.ts-main {
width: 100%;
max-width: 1160px;
padding: 0;
margin: 0;
background-color: #fff;
} .ts-main .tsplatz-noten-container {
margin: 0;
padding: 0;
display: flex; 
align-items: center; 
gap: 10px;
}
.ts-main .tsplatz-noten-container span {
margin: 0;
font-weight: bold;
}
.boxyfy-rating-true-grid {
display: grid;
grid-template-columns: auto auto auto;
grid-template-rows: auto auto;
gap: 9px 40px; justify-content: start;
align-items: start;
text-align: left;
line-height: 1.5em;
padding: 0 0 0 3px;
margin: 25px 0 0 0;
}
.boxyfy-rating-cell {
display: flex;
flex-direction: column;
align-items: center;
}
.boxyfy-rating-true-grid .boxyfy-rating-cell .boxyfy-rating-stars-wrapper {
display: inline-flex;
align-items: baseline;
gap: 4px;
padding-top: 30px;
}
.boxyfy-rating-true-grid .boxyfy-rating-cell .tsverkaufsrang-wert {
font-weight: bold;
padding-top: 30px;
}
.boxyfy-rating-stars i {
font-size: inherit;
line-height: 1;
margin: 0 1px;
}
.boxyfy-rating-average {
font-size: 14px;
font-weight: 500;
color: #444;
line-height: 1;
position: relative;
top: 1px; } .ts-main .tsnotenausgabe {
display: flex; 
align-items: center;
padding: 8px 12px; 
border-radius: 18px 18px 18px 2px;
color: #000;
font-size: 24px;
font-weight: bold;
line-height: 1.5em;
} .tsnotenausgabe.note-green {
background-color: rgba(12,179,3,0.61);
}
.tsnotenausgabe.note-yellow {
background-color: #eef211;
}
.tsnotenausgabe.note-red {
background-color: #fc7878;
} .ts-main .tsnoteninfo-container {
display: flex;
align-items: center;
gap: 5px;
} .boxyfy-rating-container {
margin-top: 10px;
display: flex;
align-items: center;
gap: 10px;
}
.boxyfy-rating-label {
font-size: 16px;
color: #333;
}
.boxyfy-rating-stars {
color: #FFD700; font-size: 16px;
}
.boxyfy-rating-value { }
.boxyfy-salesrank-tooltip {
position: relative;
cursor: help;
}
.boxyfy-salesrank-tooltip::after {
content: attr(data-tooltip);
position: absolute;
top: 130%;
left: 50%;
transform: translateX(-50%);
width: 250px;
background: rgba(0, 0, 0, 0.85);
color: #fff;
padding: 8px 12px;
border-radius: 6px;
font-size: 13px;
line-height: 1.4;
white-space: normal;
z-index: 9999;
display: none;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}
.boxyfy-salesrank-tooltip:hover::after {
display: block;
} .ts-main .better-worse-tscontainer {
display: flex;
padding: 0 !important;
gap: 6px;
margin: 35px 0 0 0;
} .ts-main .better-worse-tscontainer a {
border: 1px solid #dedcdc;
padding: 7px;
border-radius: 2px;
width: 49.5%;
box-sizing: border-box;
text-align: center;
position: relative;
text-decoration: none;
color: inherit;
border-radius: 5px;
} .ts-main .tsproduct-tsbox-rec div {
position: absolute;
top: 5px;
left: 5px;
background-color: rgba(224, 224, 224, 0.8);
padding: 2px 6px;
border-radius: 4px;
font-size: 12px;
font-weight: 400;
line-height: 1.5em;
color: #333;
}
.ts-main .tsproduct-tsbox-rec p {
display: -webkit-box;
font-weight: 400;
margin: 6px 1px 0 1px; 
padding: 0;
text-align: left; 
line-height: 1.3em;
-webkit-line-clamp: 2; -webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
word-break: break-word; hyphens: auto;    
}
.tsrating-better-product, .tsrating-worse-product {
position: absolute;
padding: 1px 4px;
top: 4px;
right: 4px;
border-radius: 4px;
font-size: 12px;
font-weight: 500;
line-height: 1.5em;
}
.tsrating-better-product {
border: 1px solid #0aa74e;
color: #098f33;
}
.tsrating-worse-product {
border: 1px solid #e70808;
color: #e70808;
}
.ts-main .better-worse-tscontainer a:hover {
border: 1px solid #a8a8a8;
}
.ts-main .tsproduct-tsbox-rec svg {
width: 28px;
height: 28px;
margin-top: 10px;
visibility: visible !important;
}
.ts-main .tsproduct-tsbox-rec img {
width: auto;
height: auto;
max-width: 70px;
max-height: 70px;
margin: 0 0 0 16px;
visibility: visible !important;
} .tsprodukt-slider-container {
position: relative;
width: 100%;
margin: 0;
} .tsprodukt_image {
position: relative;
overflow: hidden;
width: auto;
height: auto;
padding: 10px;
border: 1px solid #d6d6d6;
border-radius: 7px;
margin: auto;
cursor: crosshair;
display: flex;
align-items: center;
justify-content: center;
}
.tsprodukt_image img {
width: auto;
height: auto;
max-width: 342px;
max-height: 342px;
transition: transform 0.1s ease;
transform-origin: center center;
}
.tsprodukt_image:hover::before {
display: block;
} .ts-main .tsprodukt-image {
display: flex;
position: relative;
width: 45%;
margin-top: 2px !important;
margin: 0 15px;
justify-content: center;
box-sizing: border-box;
align-items: center;
} .tsprodukt-slider-button {
position: absolute;
top: 45%;
box-sizing: border-box;
transform: translateY(-50%);
background-color: rgba(237,236,236,0.84);
border: none;
color: #9c9a9a;
width: 37px;
height: 75px;
cursor: pointer;
font-size: 30px;
touch-action: manipulation;
}
.tsprodukt-slider-button.tsprodukt-prev {
border-radius: 0 33px 33px 0;
padding: 10px 10px 10px 4px;
}
.tsprodukt-slider-button.tsprodukt-next {
border-radius: 33px 0 0 33px;
padding: 10px 4px 10px 10px;
}
.tsprodukt-slider-button:hover {
color: #7a7575;
}
.tsprodukt-prev {
left: 0px;
}
.tsprodukt-next {
right: 0px;
}
.tsprodukt-pagination .dot {
display: inline-block;
width: 22px;
height: 6px;
margin: 0 2px;
border-radius: 2px;
cursor: pointer;
transition: background-color 0.3s;
} .tsprodukt-pagination {
text-align: center;
margin: 10px 0;
}
.tsprodukt-pagination .dot.active {
background-color: red;
}
.tsprodukt-pagination .dot:hover {
background-color: #999;
} .ts-main .tsprodukt-label {
--r: 0.8em;
position: relative !important;
display: inline-flex !important;
align-items: center;
box-sizing: border-box;
left: 0;
top: 36px;
margin: 0 4px 5px 15px;
padding: 3px 9px;
line-height: 1.5em;
min-height: 0 !important;
border-radius: 5px;
gap: 5px;
width: auto;
font-weight: 400;
text-align: left;
font-family: Open Sans, Arial, sans-serif;
}
.ts-main .tsprodukt-label svg {
width: 21px;
height: 21px;
} .tsprodukt-content-h1 {
margin: 48px 25px 35px 15px;
line-height: 1.3em;
padding: 0;
} .ts-container {
position: relative;
display: flex;
justify-content: center;
} .tsprodukt-container {
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
margin-top: 10px;
margin-bottom: 25px;
}
.tsprodukt-content {
width: 47.9%;
margin: 0 15px 0 0;
padding: 0;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.ts-main .produktseite-ranking-ausgabe-container {
display: block;
align-items: center;
font-family: Open Sans, Arial, sans-serif;
}
.tsprodukt-content p {
margin-bottom: 8px;
}
.tsprodukt-content p strong {
font-weight: 500;
}
.tsprodukt-content-h2 {
margin-top: 0px;
}
.tsprodukt-post-content {
margin: 20px 0;
width: 100%;
padding: 15px;
line-height: 1.5em;
color: #000;
background-color: #f9f9f9;
box-sizing: border-box;
} @media (max-width: 600px) {
.tsprodukt-slider-container {
width: 100%;
margin: 0 15px;
border: 1px solid #e4e1e1;
}
.ts-main .better-worse-tscontainer a {
width: 100% !important;
max-width: 49% !important;
}
.tsprodukt_image {
border: none;
}
.tsproduct-tsbox-rec {
width: 50%;
}
.boxyfy_vorteile_nachteile_container {
flex-direction: column;
}
.boxyfy_vorteile,
.boxyfy_nachteile {
width: 100%;
} .boxyfy_vorteile + .boxyfy_nachteile {
margin-top: 20px;
}
.boxyfy_vorteile ul,
.boxyfy_nachteile ul {
list-style: none;
padding-left: 0;
}
.boxyfy_vorteile ul li,
.boxyfy_nachteile ul li {
margin-bottom: 8px;
} .boxyfy_vorteile h2,
.boxyfy_nachteile h2 {
text-align: left;
padding: 10px;
} .icon {
margin: 10px 0;
width: 30px;
}
.ts-list-icon {
width: 16px;
height: 16px;
margin-right: 6px;
}
}
.boxyfy_vorteile_nachteile_container,
.boxyfy_vorteile,
.boxyfy_nachteile {
transition: all 0.3s ease;
} .tsprodukt-preisvergleich-container {
margin: 40px 0 0 0;
}
.tsprodukt-preisvergleich-head {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 400;
font-size: 15px !important;
text-align: left;
color: #4d4b4b;
border-radius: 6px;
padding: 0 0 0 7px;
margin: 5px 0;
}
.tsprodukt-preisvergleich-container p {
display: block;
position: relative;
box-sizing: border-box;
font-weight: 500;
height: 132px;
max-height: 132px;
padding: 10px;
font-size: 20px;
line-height: 1.5em;
border: 1px solid #d6d6d6;
border-radius: 6px;
align-items: center;
}
.tsprodukt-preisvergleich-container .tsprodukt-shop-logo,
.tsprodukt-preisvergleich-container .tsprodukt-shopx-logo {
display: flex;
position: absolute;
right: 13px;
top: 13px;
width: auto;
max-width: 110px !important;
height: auto;
max-height: 32px !important;
} .amazon-button-produktseite {
display: flex;
position: absolute;
width: auto;
right: 7px;
top: 85px !important;
align-items: center;
justify-content: center;
font-size: 15px;
line-height: 1.4em;
padding: 8px 15px;
font-weight: 400 !important;
margin-left: 12px;
border-radius: 6px;
color: #fff;
}
.amazon-button-produktseite:hover {
filter: brightness(85%);
}
.preis-ersparnis-produktseite {
display: inline-flex
font-size: 21px;
color: #d40606;
letter-spacing: 1.3px;
font-weight: 300;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.uvp-preis-ausgabe {
font-size: 12px;
font-weight: 400;
width: auto;
padding: 1px 4px;
margin-left: 2px;
color: #000;
} .ts-main .tsprodukt-produktinfo-list {
display: grid;
grid-template-columns: calc(50% - 15px) calc(50% - 15px);
line-height: 1.23em;
box-sizing: border-box !important;
margin: 40px 0 0 0;
font-family: Open Sans, Arial, sans-serif;
gap: 6px 30px;
align-items: center;
}
.tsprodukt-hidden {
display: none !important;
}
.tsprodukt-info-label {
text-align: left;
box-sizing: border-box !important;
padding: 6px 9px;
border-radius: 3px;
background-color: rgba(173,168,168,0.1);
}
.tsprodukt-info-value {
text-align: left;
}
.tsprodukt-produktinfo-item {
display: contents;
}
.tsprodukt-info-liste-icons {
width: 14px;
height: 14px;
padding-bottom: 3px;
margin-right: 2px;
vertical-align: middle;
} .boxyfy-metabox .logo-preview {
max-width: 150px;
height: auto;
margin-top: 6px;
} .boxyfy-metabox .hidden {
display: none;
} .tsprodukt-show-more,
.tsprodukt-show-less {
margin-top: 6px;
padding: 6px 2px;
color: #605c5c;
font-size: 14px;
border: none;
cursor: pointer;
background: transparent;
text-transform: none;
}
.tsprodukt-show-less {
display: none;
} .produkt-button-weitere-preise-wrapper {
display: flex;
flex-direction: column;
box-sizing: border-box;
position: relative;
gap: 10px;
margin-top: 10px;
}
.produkt-button-weitere-preise {
display: block;
align-items: center;
gap: 15px;
border-radius: 6px;
border: 1px solid #d6d6d6;
box-sizing: border-box;
height: 132px;
max-height: 132px;
padding: 10px;
line-height: 1.5em;
}
.produkt-preis-weitere {
font-size: 20px;
font-weight: 500;
padding: 0;
line-height: 1.5;
} .produkt-weitere-buttons-shops {
display: flex;
position: absolute;
width: auto;
right: 7px;
top: 85px;
align-items: center;
justify-content: center;
font-size: 15px;
line-height: 1.4em;
padding: 8px 15px;
font-weight: 400 !important;
margin-left: 12px;
border-radius: 6px;
color: #fff;
transition: background-color 0.3s ease;
}
.produkt-weitere-buttons-shops:hover {
filter: brightness(85%);
}
.produkt-button-link:hover {
filter: brightness(85%);
}
.single-produktseite-rabatt {
padding: 10px;
margin-top: 10px;
font-weight: 400 !important;
}
.produkt-weitere-buttons-shops svg,
.amazon-button-produktseite svg {
width: 18px;
height: 18px;
display: inline-block;
padding: 0;
margin: 0 6px 0 0;
visibility: visible !important;
opacity: 1;
}
.guenstigster-gesamtpreis {
display: inline-flex;
flex-direction: column;
align-items: start;
justify-content: start;
font-size: 12px;
line-height: 1.5em;
font-weight: 500;
width: auto;
border-radius: 4px;
padding: 2px 5px;
margin-top: 6px;
text-align: left;
}
.guenstigster-gesamtpreis span {
display: block;
margin: 1px 0;
}
.guenstigster-gesamtpreis span:last-child {
font-size: 12px;
font-weight: bold;
margin-top: 2px;
}
.prime-status-produktseite,
.versand-status-produktseite {
display: block;
margin-top: 5px;
padding-bottom: 5px;
font-size: 12px;
line-height: 1.5em;
}
.affiliate-disclaimer {
margin-top: 10px;
font-size: 13px;
line-height: 1.5em;
color: #6b6b6b;
} .boxyfy_vorteile_nachteile_container {
display: flex;
justify-content: space-between;
gap: 20px;
margin-bottom: 25px;
}
.boxyfy_vorteile,
.boxyfy_nachteile {
flex: 1;
padding: 14px;
position: relative;
overflow: hidden;
box-sizing: border-box;
background-size: contain;
background-repeat: no-repeat;
background-position: right center;
border-radius: 10px;
} .boxyfy_vorteile h2,
.boxyfy_nachteile h2 {
display: flex;
font-weight: bold;
justify-content: center;
align-items: center !important;
margin: 0 0 20px 0;
padding: 9px 10px 7px 10px;
border-radius: 15px;
} .boxyfy_vorteile h2 img {
display: block;
border-radius: 44px;
padding: 0;
margin: 0 5px 1px 0;
width: 26px;
height: 26px;
}
.boxyfy_nachteile h2 img {
display: block;
border-radius: 44px;
padding: 0;
margin: 0 5px 1px 0;
width: 24px;
height: 24px;
} .boxyfy_vorteile h2 {
background-color: rgba(8,103,8,0.12);
color: #086708;
}
.boxyfy_nachteile h2 {
background-color: rgba(131,1,1,0.14);
color: #830101;
}
.boxyfy_vorteile {
border: 2px solid rgba(8,103,8,0.43);
}
.boxyfy_nachteile {
border: 2px solid rgba(131,1,1,0.43);
} .ts-list-icon {
width: 13px;
height: 13px;
vertical-align: middle;
margin-right: 8px;
} .boxyfy_vorteile ul,
.boxyfy_nachteile ul {
list-style: none;
padding: 0 0 0 5px;
}
.boxyfy_vorteile ul li,
.boxyfy_nachteile ul li {
display: flex;
align-items: center;
margin-bottom: 8px;
} .tsprodukt-autoren-container {
width: 100%;
margin-top: 40px;
padding-top: 20px;
border-top: 1px solid #ddd;
box-sizing: border-box;
font-family: "Open Sans", sans-serif;
}
.tsprodukt-autoren-container h2 {
font-size: 20px;
margin: 20px 0 20px 0;
font-family: "Open Sans", sans-serif;
} .tsprodukt-autoren-box {
display: flex;
align-items: center;
margin-bottom: 20px;
padding: 20px 15px;
border-radius: 8px;
border: 1px solid #e0e0e0;
background-color: #fff !important;
box-shadow: 0 0 10px 4px #eaeaea;
} .tsprodukt-autoren-image {
flex-shrink: 0;
margin-right: 20px;
}
.tsprodukt-autoren-image img {
width: 90px;
height: 90px;
object-fit: cover;
border-radius: 50%;
} .tsprodukt-autoren-info h3 {
margin: 0 0 7px 0;
color: #000;
font-size: 18px;
}
.tsprodukt-autoren-box .expertise-ausgabe {
font-size: 15px;
color: #000000 !important;
padding: 0 0 8px 0;
} .tsprodukt-autoren-box .tsprodukt-autoren-info .expertise-ausgabe {
display: flex;
align-items: flex-start;
padding: 0;
margin: 0;
} .tsprodukt-autoren-info .expertise-ausgabe strong {
display: flex;
align-items: center;
color: #0173ab; margin: 0 5px 0 0;
} .expertise-ausgabe strong .autor-right-angle-arrow {
padding: 0;
margin: 0 3px 7px 0;
width: 15px;
height: 15px;
}
.tsprodukt-autoren-info {
width: 100%;
}
.tsprodukt-autoren-info p {
margin: 0;
font-size: 14px;
color: #555;
}
.tsprodukt-autoren-box .tsprodukt-autoren-info hr {
height: 1px;
margin: 12px 0 20px 0;
background-color: #ddd9d9;
border: none;
} @media screen and (max-width: 900px) {
.tsprodukt-slider-container {
margin: 0;
}
.ts-main .tsprodukt-image{
width: 100% !important;
}
.tsprodukt-image {
width: 100%;
}
.tsprodukt-post-content {
padding: 15px 15px !important;
}
.tsprodukt-content {
width: 100%;
padding: 0;
margin: 35px 15px !important;
}
}
.tsprodukt-slider-container .tsprodukt_image {
visibility: hidden;
opacity: 0;
transition: opacity 0.3s ease;
}
.tsprodukt-slider-container.tsbilder-sichtbar .tsprodukt_image {
visibility: visible;
opacity: 1;
}