@charset "UTF-8";
html, body {
font-size: 16px;
margin: 0 auto;
padding: 0;
font-family: "AudiType";
background-color: #fff;
color: #000;
min-height: 100vh;
scroll-behavior: smooth;
}
@media (max-width: 780px) {
html, body {
font-size: 14px;
}
}
*:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) {
all: unset;
display: revert;
}
*, *::after, *::before {
box-sizing: border-box;
}
table, th, td {
border: 0;
vertical-align: top;
padding: 0;
}
/* Fix mobile Safari increase font-size on landscape mode */
html {
-moz-text-size-adjust: none;
-webkit-text-size-adjust: none;
text-size-adjust: none;
scroll-behavior: smooth;
}
/* Reapply the pointer cursor for anchor tags */
a,
button {
cursor: revert;
}
/* Remove list styles (bullets/numbers) */
ol,
ul,
menu,
summary {
list-style: none;
}
ul {
list-style: disc;
padding-left: 20px;
}
/* For images to not be able to exceed their container */
img {
max-inline-size: 100%;
max-block-size: 100%;
display: block;
}
/* removes spacing between cells in tables */
table {
border-collapse: collapse;
}
/* Safari - solving issue when using user-select:none on the text input doesn't working */
input,
textarea {
-webkit-user-select: auto;
}
/* revert the 'white-space' property for textarea elements on Safari */
textarea {
white-space: revert;
}
/* minimum style to allow to style meter element */
meter {
-webkit-appearance: revert;
appearance: revert;
}
/* preformatted text - use only for this feature */
:where(pre) {
all: revert;
box-sizing: border-box;
}
/* reset default text opacity of input placeholder */
::placeholder {
color: unset;
}
/* fix the feature of 'hidden' attribute.
display:revert; revert to element instead of attribute */
:where([hidden]) {
display: none;
}
/* revert for bug in Chromium browsers
- fix for the content editable attribute will work properly.
- webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/
:where([contenteditable]:not([contenteditable=false])) {
-moz-user-modify: read-write;
-webkit-user-modify: read-write;
overflow-wrap: break-word;
-webkit-line-break: after-white-space;
-webkit-user-select: auto;
}
/* apply back the draggable feature - exist only in Chromium and Safari */
:where([draggable=true]) {
-webkit-user-drag: element;
}
/* Revert Modal native behavior */
:where(dialog:modal) {
all: revert;
box-sizing: border-box;
}
/* Remove details summary webkit styles */
::-webkit-details-marker {
display: none;
}
strong {
font-weight: 700;
}
.ot-floating-button__open,
.ot-floating-button__close {
display: grid;
place-items: center;
}
.container {
padding-inline: 7.81vw;
}
@media (max-width: 960px) {
.container {
padding-inline: 20px;
}
}
@media (max-width: 960px) {
.desktop {
display: none;
}
}
@media (min-width: 960px) {
.mobile {
display: none;
}
}
.c-baner {
position: relative;
margin-bottom: 4rem;
}
@media (min-width: 780px) {
.c-baner {
height: 80vh;
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
}
}
@media (max-width: 780px) {
.c-baner {
min-height: 50vh;
}
}
.c-baner img {
width: 100%;
height: 100%;
object-fit: cover;
}
.c-baner__img--mob {
display: none;
}
@media (max-width: 780px) {
.c-baner__img--mob {
display: block;
}
}
.c-baner__img--desktop {
display: block;
}
@media (max-width: 780px) {
.c-baner__img--desktop {
display: none;
}
}
.c-baner__content {
position: absolute;
bottom: clamp(5%, 27vh, 20%);
left: 8%;
color: #fff;
}
.c-baner__title {
font-size: clamp(1.2rem, 4vw, 71px);
line-height: 2.2;
font-weight: 700;
}
.c-baner__subline {
font-size: clamp(1rem, 3.5vw, 48px);
font-weight: bold;
}
.c-baner__text {
font-size: clamp(1rem, 3vw, 36px);
margin-top: 1rem;
}
.c-baner__disclaimer {
max-width: 1100px;
display: inline-block;
padding: 1rem 0;
}
.c-baner__btn {
display: inline-block;
margin-top: 2rem;
background-color: transparent;
border: 1px solid white;
color: white;
padding: 1rem 2rem;
font-size: 1.25rem;
text-align: center;
min-width: 165px;
cursor: pointer;
transition: all 0.3s ease;
}
.c-baner__btn:hover {
background-color: rgba(255, 255, 255, 0.1);
}
.c-form {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
row-gap: 50px;
padding-top: 4rem;
max-width: 1420px;
margin: 0 auto;
padding: 2rem 3rem 2rem 4rem;
}
.c-form__bg {
background-color: #000;
background: #000;
}
.c-form__header {
width: 100%;
text-align: center;
font-weight: 500;
font-size: 20px;
max-width: 1300px;
margin: 0 auto 100px auto;
}
@media (max-width: 1440px) {
.c-form__header {
margin: 0 auto 50px auto;
}
}
@media (max-width: 960px) {
.c-form__header {
margin: 0 auto 30px auto;
}
}
.c-form__header strong {
font-size: 32px;
padding-bottom: 30px;
display: inline-block;
}
@media screen and (max-width: 960px) {
.c-form__header {
font-size: 18px;
}
.c-form__header strong {
font-size: 24px;
}
}
.c-form__inputs-wrapper-short {
width: 48%;
display: flex;
align-items: center;
flex-wrap: wrap;
row-gap: 30px;
column-gap: 30px;
}
@media screen and (max-width: 960px) {
.c-form__inputs-wrapper-short {
width: 100%;
}
}
.c-form__inputs-wrapper-wide {
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
row-gap: 30px;
column-gap: 30px;
}
.c-form__input-wrapper {
max-width: calc(25% - 23px);
width: 100%;
display: flex;
flex-direction: column;
}
@media (max-width: 1440px) {
.c-form__input-wrapper {
max-width: calc(50% - 23px);
}
}
@media screen and (max-width: 960px) {
.c-form__input-wrapper {
max-width: 100%;
}
}
.c-form__input-wrapper label {
color: #555555;
font-size: 15px;
}
.c-form__text {
color: #555555;
font-size: 15px;
max-width: 100%;
width: 100%;
}
.c-form__input {
padding: 13px 0px;
background-color: transparent;
margin: 5px 0px 0px 0px;
color: #bbbbbb;
border-bottom: 1px solid #aaaaaa;
}
.c-form__input::placeholder {
opacity: 0.5;
}
.c-form__textarea-wrapper-short {
width: 48%;
display: flex;
flex-direction: column;
}
@media screen and (max-width: 960px) {
.c-form__textarea-wrapper-short {
width: 100%;
}
}
.c-form__textarea-wrapper-wide {
width: 100%;
height: 100px;
display: flex;
flex-direction: column;
}
.c-form__textarea {
padding: 0.75rem 5px;
border-radius: 4px;
height: 100%;
background-color: #fff;
color: #000;
}
.c-form__textarea::placeholder {
opacity: 0.5;
}
@media screen and (max-width: 960px) {
.c-form__textarea {
height: 100px;
}
}
.c-form__expand-btn {
font-weight: 700;
cursor: pointer;
}
.c-form__consent-text {
font-size: 14px;
width: 100%;
text-align: left;
}
.c-form__error-message {
font-size: 12px;
color: #f50537;
}
.c-form__checkbox-wrapper {
width: 100%;
margin-left: 25px;
}
.c-form__checkbox-wrapper:has(input:checked) label::before {
content: "✓";
background-color: #f50537;
line-height: 0;
font-size: 0.9rem;
}
.c-form__checkbox-wrapper--small {
width: 100px;
}
.c-form__checkbox {
position: relative;
cursor: pointer;
font-size: 0.9rem;
}
.c-form__checkbox::before {
content: "";
position: absolute;
left: -25px;
width: 20px;
height: 20px;
display: grid;
place-items: center;
color: #fff;
font-size: 1.1rem;
line-height: 1;
border-radius: 3px;
border: 1px solid #8a9097;
transition: all 0.2s ease-in-out;
}
.c-form__checkboxes-wrapper {
width: 100%;
display: flex;
gap: 0.25rem;
}
.c-form__submit-btn {
margin: 0 auto;
background-color: #000;
width: 253px;
text-align: center;
padding: 13px 0;
color: #fff;
font-weight: 700;
cursor: pointer;
display: inline-block;
border: 1px solid #000;
}
.c-form__model {
gap: 1rem;
max-width: 100%;
width: 100%;
}
@media (min-width: 780px) {
.c-form__model {
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
}
}
.c-form__model-elem {
width: 100%;
cursor: pointer;
}
@media (min-width: 780px) {
.c-form__model-elem {
width: calc(50% - 1rem);
}
}
@media (min-width: 960px) {
.c-form__model-elem {
width: calc(25% - 1rem);
}
}
.c-form__model-elem:hover .c-form__model-elem--image {
opacity: 1;
}
.c-form__model-elem.active .c-form__model-elem--image {
opacity: 1;
}
.c-form__model-elem--image {
max-width: 220px;
width: 100%;
margin: 0 auto;
opacity: 0.5;
transition: all 0.4s ease-in-out;
}
@media (max-width: 500px) {
.c-form__model-elem--image {
max-width: 190px;
}
}
.c-form__model-elem--name {
display: flex;
justify-content: flex-start;
align-items: center;
gap: 1rem;
}
.c-form__model-elem--name input[type=radio] {
-webkit-appearance: none;
appearance: none;
width: 2vw;
min-width: 2vw;
height: 2vw;
min-height: 2vw;
border: 1px solid #777;
border-radius: 100%;
display: flex;
}
.c-form__model-elem--name input[type=radio]:checked {
background: url("../images/select-circle-s.webp");
background-color: #f50537;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
border-color: #ffffff;
}
.white {
color: #fff;
}
.black {
color: #000;
background: #fff;
}
.black .c-form__bg {
background: #fff;
}
.black .c-form__header {
color: #000;
}
.black .c-form__input, .black .c-form__textarea {
border: 1px solid #000;
outline: none;
}
.black .c-form__input:focus, .black .c-form__textarea:focus {
border: none;
outline: 2px solid #000;
}
.c-form__popup {
text-align: center;
}
.c-form__popup h2 {
font-size: 2rem;
}
.c-logo-bar {
max-width: 90%;
margin: 0 auto;
}
.c-logo-bar__container {
display: flex;
align-items: center;
padding: 1rem 0;
}
.c-logo-bar__logo {
width: auto;
max-height: 33px;
}
.c-logo-bar__text {
margin-left: 2rem;
font-weight: 500;
}
.c-logo-bar__text--red {
color: #f50537;
}
.c-footer {
background-color: #000;
color: #fff;
padding: 4rem 1rem;
text-align: center;
}
.c-footer__main {
font-size: 1.4rem;
}
.c-footer__submain {
font-size: 1.2rem;
font-weight: 600;
margin-block: 0.25rem 0.75rem;
}
.c-footer::before {
content: "";
display: block;
width: 100%;
height: 1px;
background-color: #fff;
margin-bottom: 30px;
}
.c-footer-white {
padding-block: 2rem;
padding-inline: 2rem;
background-color: #fff;
color: #000;
text-align: center;
}
.c-footer-white__main {
font-size: 1.4rem;
}
.c-footer-white__submain {
font-size: 1.2rem;
font-weight: 600;
margin-block: 0.25rem 0.75rem;
}
.c-footer-white::before {
content: "";
display: block;
width: 100%;
height: 1px;
background-color: #000;
margin-bottom: 30px;
}
.c-header {
max-width: 1330px;
margin: 0 auto;
margin-bottom: 100px;
padding: 1rem;
}
.c-header h1 {
font-size: clamp(1.5rem, 2.5vw, 45px);
text-align: center;
font-weight: 500;
margin-block: 50px;
}
.c-header__text {
font-size: 1rem;
text-align: center;
width: 100%;
}
@media screen and (max-width: 960px) {
.c-header__text {
margin-bottom: 30px;
text-align: left;
font-size: 14px;
}
}
.c-photo-text {
display: flex;
align-items: center;
margin: 0 auto 4rem auto;
justify-content: space-between;
max-width: 1600px;
background-color: #fff;
color: #000;
}
@media screen and (max-width: 960px) {
.c-photo-text {
padding-inline: 30px;
flex-direction: column;
}
}
.c-photo-text--row {
flex-direction: row;
}
@media screen and (max-width: 960px) {
.c-photo-text--row {
flex-direction: column-reverse;
margin: 0 auto;
}
}
.c-photo-text--reverse {
flex-direction: row-reverse;
}
@media screen and (max-width: 960px) {
.c-photo-text--reverse {
flex-direction: column-reverse;
margin: 0 auto;
margin-inline: 30px;
}
}
.c-photo-text__content {
padding: 30px 70px;
display: flex;
flex-direction: column;
justify-content: center;
gap: 30px;
width: calc(55% - 140px);
}
@media screen and (max-width: 960px) {
.c-photo-text__content {
gap: 20px;
padding: 2rem;
width: 100%;
}
}
.c-photo-text__content p {
margin-bottom: 1.5rem;
}
.c-photo-text__content b {
font-weight: bold;
}
.c-photo-text__content ul {
list-style-type: none;
}
.c-photo-text__content ul li {
position: relative;
margin: 0.5rem;
}
.c-photo-text__content ul li::before {
content: " ";
display: block;
position: absolute;
left: -15px;
top: 2px;
width: 15px;
height: 15px;
background-image: url(/images/punktor.jpg);
background-size: contain;
background-repeat: no-repeat;
}
.c-photo-text__header {
font-size: clamp(1.5rem, 2vw, 32px);
line-height: 1.2;
font-weight: bold;
margin-top: 1rem;
}
.c-photo-text__subheader {
font-size: clamp(1rem, 2vw, 18px);
line-height: 1.2;
font-weight: 700;
}
.c-photo-text__text {
font-size: clamp(1rem, 1.5vw, 16px);
}
.c-photo-text__text h3 {
font-weight: bold;
font-size: 1.5rem;
margin-bottom: 1rem;
}
.c-photo-text__image {
width: 50%;
align-self: stretch;
}
.c-photo-text__image img {
object-fit: cover;
min-height: 100%;
}
@media screen and (max-width: 960px) {
.c-photo-text__image {
width: 100%;
}
}
@media screen and (max-width: 960px) {
.c-photo-text:nth-child(odd) {
padding-inline: 0;
flex-direction: column;
}
}
.reverse-row {
display: flex;
flex-direction: row-reverse;
}
@media screen and (max-width: 960px) {
.reverse-row {
flex-direction: column-reverse;
}
}
.c-div-flex {
display: flex;
flex: 1;
justify-content: space-between;
gap: 30px;
padding-inline: 70px;
}
@media screen and (max-width: 960px) {
.c-div-flex {
flex-direction: column;
padding-inline: 30px;
}
}
.c-tile {
display: flex;
flex-direction: column;
width: 100%;
background-color: #fff;
color: #000;
max-width: 735px;
}
.c-tile__image {
width: 100%;
}
.c-tile__content {
padding: 2rem;
}
@media (max-width: 960px) {
.c-tile__content {
padding: 0.2rem;
}
}
.c-tile__header {
margin: 20px 0px;
font-size: clamp(1rem, 2vw, 26px);
font-weight: 500;
}
.c-tile__link {
align-items: center;
padding: 20px 50px;
border: 1px solid #000;
display: inline-flex;
justify-content: center;
margin: 1rem 0;
}
@media (min-width: 960px) {
.c-tile__link {
min-width: 322px;
}
}
@media (max-width: 960px) {
.c-tile__link {
width: 100%;
}
}
.c-tile__link span {
text-align: center;
}
.c-tile__params {
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-gap: 2rem;
margin: 2rem 0;
}
.c-tile__param {
display: flex;
justify-content: flex-start;
align-items: flex-start;
max-width: 300px;
width: 100%;
gap: 1.5rem;
}
@media (max-width: 960px) {
.c-tile__param {
font-size: 12px;
gap: 0.5rem;
}
}
.c-tile__param b {
font-weight: bold;
display: inline-block;
}
.c-tile__param__img {
width: 43px;
height: auto;
}
.c-tile__param__img img {
width: 100%;
}
.c-tiles {
max-width: calc(1600px + 4rem);
margin: 0 auto;
padding: 2rem 2rem 4rem 2rem;
}
.c-tiles__title {
text-align: center;
font-size: 1.5rem;
font-weight: bold;
}
.c-tiles__row {
margin-top: 2rem;
grid-gap: 4rem;
padding: 40px 0;
grid-row-gap: 2rem;
}
@media (min-width: 960px) {
.c-tiles__row {
grid-template-columns: repeat(2, minmax(433px, 1fr));
display: grid;
}
}
@media (max-width: 960px) {
.c-tiles__row {
display: flex;
flex-direction: column;
gap: 2rem;
}
}
.c-button {
border: 1px solid #000;
padding: 16px 32px;
width: min-content;
text-wrap: nowrap;
font-size: clamp(0.7rem, 1.5vw, 16px);
transition: all 0.2s ease-in-out;
display: flex;
align-items: center;
justify-content: center;
margin: 50px auto;
max-width: 480px;
}
.c-button:hover {
background-color: #000;
color: #fff;
transition: all 0.2s ease-in-out;
}
@media screen and (max-width: 960px) {
.c-button {
margin: 30px auto;
min-height: 75px;
font-size: 20px;
width: 100%;
text-align: center;
}
}
.c-button--left {
margin-left: 0;
}
.c-short-photo-text {
max-width: 1600px;
margin-inline: auto;
padding-inline: 10%;
margin-bottom: 50px;
}
.c-short-photo-text__container {
display: flex;
padding-block: 2rem 4rem;
}
.c-short-photo-text__container--row {
flex-direction: row;
}
.c-short-photo-text__container--reverse {
flex-direction: row-reverse;
}
.c-short-photo-text__img-wrapper {
width: 80%;
}
.c-short-photo-text__img-wrapper img {
width: 100%;
height: 100%;
object-fit: cover;
}
.c-short-photo-text__content {
background-color: #fff;
color: #000;
display: flex;
flex-direction: column;
justify-content: center;
padding-inline: 2rem;
padding-block: 2rem;
}
.c-short-photo-text__header {
font-weight: 600;
font-size: 1.3rem;
margin-block: 0 1rem;
}
.c-short-photo-text__list li {
position: relative;
margin-block: 0.25rem;
margin-inline: 1rem 0;
}
.c-short-photo-text__list li::before {
content: "";
position: absolute;
left: -15px;
top: 2px;
width: 15px;
height: 15px;
background-image: url(/images/punktor.jpg);
background-size: contain;
background-repeat: no-repeat;
}
.c-short-photo-text__link {
border: 1px solid #000;
display: flex;
margin: 2rem 0 0;
width: -moz-fit-content;
width: fit-content;
padding-block: 0.75rem;
padding-inline: 2rem;
transition: all 0.2s ease-in-out;
}
.c-short-photo-text__link:hover {
background-color: #000;
color: #fff;
cursor: pointer;
}
@media screen and (max-width: 960px) {
.table {
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
}
.table h2 {
font-size: 2.4rem;
font-weight: 600;
text-align: center;
margin-block: 4rem;
}
@media screen and (max-width: 960px) {
.table h2 {
font-size: 1.8rem;
}
}
.table__header {
font-size: 1.6rem;
text-align: center;
margin-block: 6rem 3rem;
font-weight: 600;
}
.table__btn {
display: block;
margin-inline: auto;
border: 1px solid #fff;
padding-block: 1rem;
padding-inline: 3rem;
transition: all 0.2s ease-in-out;
}
.table__btn:hover {
cursor: pointer;
color: #000;
background-color: #fff;
}
.table__table {
display: flex;
font-size: 0.82rem;
justify-content: center;
}
.table__table:not(:first-of-type):hover {
cursor: pointer;
}
.table__table:not(:first-of-type):hover div {
background-color: rgba(255, 255, 255, 0.1843137255);
color: #fff;
}
.table__table:last-of-type div {
border-bottom: none;
}
@media screen and (max-width: 960px) {
.table__table {
min-width: 800px;
overflow-x: scroll;
}
}
.table__model {
width: 67px;
padding-inline: 0.5rem 0;
padding-block: 0.5rem;
display: flex;
align-items: center;
border-bottom: 1px solid #fff;
transition: all 0.2s ease-in-out;
}
.table__nr {
width: 160px;
padding-block: 0.5rem;
display: flex;
align-items: center;
border-bottom: 1px solid #fff;
transition: all 0.2s ease-in-out;
}
.table__name {
width: 103px;
padding-block: 0.5rem;
display: flex;
align-items: center;
border-bottom: 1px solid #fff;
transition: all 0.2s ease-in-out;
}
.table__tire {
width: 147px;
padding-inline: 0.2rem;
padding-block: 0.5rem;
display: flex;
align-items: center;
border-bottom: 1px solid #fff;
transition: all 0.2s ease-in-out;
}
.table__size {
width: 110px;
padding-block: 0.5rem;
display: flex;
align-items: center;
border-bottom: 1px solid #fff;
transition: all 0.2s ease-in-out;
}
.table__year {
width: 65px;
padding-block: 0.5rem;
display: flex;
align-items: center;
border-bottom: 1px solid #fff;
transition: all 0.2s ease-in-out;
}
.table__sug-price {
width: 120px;
color: #000;
background-color: #ececec;
padding-inline: 0.5rem;
padding-block: 0.5rem;
display: flex;
align-items: center;
border-bottom: 1px solid #000;
transition: all 0.2s ease-in-out;
}
.table__price-diff {
width: 107px;
color: #fff;
background-color: #f40537;
padding-inline: 0.5rem;
padding-block: 0.5rem;
display: flex;
align-items: center;
border-bottom: 1px solid #fff;
transition: all 0.2s ease-in-out;
}
.table__our-price {
background-color: #1d1d1b;
padding-inline: 0.5rem;
width: 120px;
padding-block: 0.5rem;
display: flex;
align-items: center;
border-bottom: 1px solid #fff;
transition: all 0.2s ease-in-out;
}
.table__tire-img {
background-color: #fff;
width: 100px;
aspect-ratio: 1;
color: black;
display: flex;
justify-content: center;
align-items: center;
}
.table__tire-img img {
width: 100%;
height: 100%;
object-fit: cover;
}
.table__padding {
padding-block: 1rem;
}
@media screen and (max-width: 960px) {
.table__img-wrapper {
min-width: 1000px;
overflow-x: scroll;
display: flex;
align-items: center;
justify-content: center;
}
.table__img-wrapper img {
max-width: 100%;
height: auto;
}
}
.c-slide {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 20px;
}
.c-slide__image {
max-height: 250px;
}
.c-slide__text {
font-weight: 600;
}
.c-slide__link {
background-color: #000;
color: #fff;
font-size: 14px;
padding: 15px 45px;
text-align: center;
}
.c-slider {
margin: 70px 0px;
}
@media (max-width: 1440px) {
.c-slider {
margin: 50px 0px;
}
}
@media (max-width: 960px) {
.c-slider {
margin: 0px 0px 30px 0px;
}
}
.c-slider__wrap {
position: relative;
margin: 60px 0px;
}
@media (max-width: 1440px) {
.c-slider__wrap {
margin: 40px 0px;
}
}
@media (max-width: 960px) {
.c-slider__wrap {
margin: 30px 0px;
}
}
.c-slider__header {
font-size: 20px;
font-weight: 700;
}
@media (max-width: 1440px) {
.c-slider__header {
font-size: 19px;
}
}
@media (max-width: 1110px) {
.c-slider__header {
font-size: 17px;
}
}
.c-slider__arrows {
max-width: 500px;
width: 100%;
margin: 0 auto;
display: flex;
align-items: center;
justify-content: space-between;
gap: 20px;
}
@media (max-width: 960px) {
.c-slider__arrows {
max-width: 42.71vw;
min-width: 208px;
}
}
.c-slider__arrows-prev, .c-slider__arrows-next {
cursor: pointer;
opacity: 1;
transition: all 0.4s ease-in-out;
}
@media (max-width: 960px) {
.c-slider__arrows-prev img, .c-slider__arrows-next img {
max-width: 12px;
width: 100%;
}
}
.c-slider__arrows-prev.swiper-button-disabled, .c-slider__arrows-next.swiper-button-disabled {
opacity: 0;
}
.c-slider__arrows-next img {
transform: rotate(180deg);
}
.c-slider__arrows-pagination {
display: flex;
justify-content: center;
align-items: center;
gap: 20px;
}
.c-slider__arrows-pagination .swiper-pagination-bullet {
background-color: #939393;
border-radius: 100%;
width: 20px;
min-width: 20px;
height: 20px;
min-height: 20px;
opacity: 1;
margin: 0px !important;
transition: all 0.4s ease-in-out;
}
@media (max-width: 960px) {
.c-slider__arrows-pagination .swiper-pagination-bullet {
width: 15px;
min-width: 15px;
height: 15px;
min-height: 15px;
}
}
@media (max-width: 500px) {
.c-slider__arrows-pagination .swiper-pagination-bullet {
width: 8px;
min-width: 8px;
height: 8px;
min-height: 8px;
}
}
.c-slider__arrows-pagination .swiper-pagination-bullet-active {
width: 30px;
min-width: 30px;
height: 30px;
min-height: 30px;
background-color: #000000;
}
@media (max-width: 960px) {
.c-slider__arrows-pagination .swiper-pagination-bullet-active {
width: 20px;
min-width: 20px;
height: 20px;
min-height: 20px;
}
}
@media (max-width: 500px) {
.c-slider__arrows-pagination .swiper-pagination-bullet-active {
width: 12px;
min-width: 12px;
height: 12px;
min-height: 12px;
}
}
.c-slide {
display: grid;
grid-template-rows: 1fr auto;
padding: 2.08vw;
border: 1px solid #000000;
opacity: 0.5;
height: auto;
cursor: pointer;
}
@media (max-width: 960px) {
.c-slide {
padding: 3.13vw;
}
}
.c-slide.active {
opacity: 1;
}
.c-slide.stasis {
opacity: 1;
}
.c-slide__header {
display: flex;
justify-content: space-between;
gap: 1.56vw;
align-items: flex-start;
margin: 2.6vw 0px 0px 0px;
max-width: 100%;
width: 100%;
}
.c-slide__header-text h3 {
font-size: 1.25vw;
font-weight: 700;
margin: 0px 0px 5px 0px;
}
@media (max-width: 960px) {
.c-slide__header-text h3 {
font-size: 2.29vw;
}
}
.c-slide__header-text p {
font-size: 1.1vw;
font-weight: 500;
}
@media (max-width: 960px) {
.c-slide__header-text p {
font-size: 1.88vw;
}
}
.c-slide__header-button input[type=radio] {
-webkit-appearance: none;
appearance: none;
width: 2.6vw;
min-width: 2.6vw;
height: 2.6vw;
min-height: 2.6vw;
border: 1px solid #000000;
border-radius: 100%;
}
@media (max-width: 960px) {
.c-slide__header-button input[type=radio] {
width: 4.17vw;
min-width: 4.17vw;
height: 4.17vw;
min-height: 4.17vw;
}
}
.c-slide__header-button input[type=radio]:checked {
background: url("../images/select-circle-s.webp");
background-color: #f50537;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
border-color: #ffffff;
}
.c-faq {
margin: 70px 0px;
}
.c-faq__header {
font-size: 40px;
text-align: center;
font-weight: 700;
}
@media (max-width: 1440px) {
.c-faq__header {
font-size: 30px;
}
}
@media (max-width: 1100px) {
.c-faq__header {
font-size: 20px;
}
}
@media (max-width: 550px) {
.c-faq__header {
font-size: 17px;
}
}
.c-faq__content {
margin: 50px 0px 0px 0px;
}
@media (max-width: 550px) {
.c-faq__content {
margin: 30px 0px 0px 0px;
}
}
.c-faqElement {
border-bottom: 1px solid #c3c3c3;
font-size: 20px;
}
@media (max-width: 1440px) {
.c-faqElement {
font-size: 18px;
}
}
@media (max-width: 1100px) {
.c-faqElement {
font-size: 16px;
}
}
@media (max-width: 1100px) {
.c-faqElement {
font-size: 1.88vw;
}
}
.c-faqElement.active .c-faqElement__header img {
transform: rotate(0deg);
}
.c-faqElement.active .c-faqElement__content {
max-height: 100vh;
}
.c-faqElement__header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 30px;
padding: 20px 40px;
cursor: pointer;
}
@media (max-width: 1600px) {
.c-faqElement__header {
padding: 15px 30px;
}
}
@media (max-width: 1440px) {
.c-faqElement__header {
padding: 13px 25px;
gap: 15px;
}
}
@media (max-width: 960px) {
.c-faqElement__header {
padding: 2.08vw 4.17vw;
}
}
.c-faqElement__header h4 {
font-weight: 700;
}
.c-faqElement__header img {
transform: rotate(180deg);
transition: all 0.4s ease-in-out;
}
.c-faqElement__content {
background-color: #f2f2f2;
max-height: 0px;
overflow: hidden;
transition: all 0.4s ease-in-out;
}
.c-faqElement__content a {
text-decoration: underline;
}
.c-faqElement__content table {
max-width: 1300px;
width: 100%;
}
.c-faqElement__content table tr {
border-bottom: 1px solid #a9a9a9;
}
.c-faqElement__content table tr:last-of-type {
border: 0px;
}
.c-faqElement__content table tr td, .c-faqElement__content table tr th {
padding: 25px 30px 25px 0px;
}
@media (max-width: 1600px) {
.c-faqElement__content table tr td, .c-faqElement__content table tr th {
padding: 20px 25px 20px 0px;
}
}
@media (max-width: 1440px) {
.c-faqElement__content table tr td, .c-faqElement__content table tr th {
padding: 15px 20px 15px 0px;
}
}
@media (max-width: 960px) {
.c-faqElement__content table tr td, .c-faqElement__content table tr th {
padding: 2.08vw 15px 2.08vw 0px;
}
}
.c-faqElement__content-flex {
display: flex;
gap: 10px;
margin: 20px 0px;
}
.c-faqElement__content-flex:first-of-type {
margin-top: 0px;
}
.c-faqElement__content-flex:last-of-type {
margin-bottom: 0px;
}
.c-faqElement__content-flex--step {
white-space: nowrap;
}
.c-faqElement__container {
padding: 20px 40px;
border-top: 1px solid #c3c3c3;
}
@media (max-width: 1600px) {
.c-faqElement__container {
padding: 15px 30px;
}
}
@media (max-width: 1440px) {
.c-faqElement__container {
padding: 13px 25px;
}
}
@media (max-width: 960px) {
.c-faqElement__container {
padding: 2.08vw 4.17vw;
}
}
/*# sourceMappingURL=style.css.map */