@font-face {
    font-family: 'LexendDeca-Medium';
    src: url('../fonts/LexendDeca-Medium.woff2') format('woff2'),
        url('../fonts/LexendDeca-Medium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'LexendDeca-Bold';
    src: url('../fonts/LexendDeca-Bold.woff2') format('woff2'),
        url('../fonts/LexendDeca-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'LexendDeca-SemiBold';
    src: url('../fonts/LexendDeca-SemiBold.woff2') format('woff2'),
        url('../fonts/LexendDeca-SemiBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'LexendDeca-ExtraBold';
    src: url('../fonts/LexendDeca-ExtraBold.woff2') format('woff2'),
        url('../fonts/LexendDeca-ExtraBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
	color: #fff;
	font-size: 16px;
	line-height: 1.33;
	font-family: 'LexendDeca-Medium', sans-serif;
}

body,
.header,
.footer__background,
.asideBox
 {
    background: #000;
}

.header {
    box-shadow: none;
}

.header__inner {
    height: 105px;
}

@media(max-width: 1600px) {
    .header__inner {
        height: 70px;
    }
}

@media(max-width: 800px) {
    .header__inner {
        height: 50px;
    }
}

.header__logo {
    width: 460px;
    height: auto;
    aspect-ratio: 13.14;
}

@media (max-width: 1600px) {
    .header__logo {
        width: 360px;
    }
}

@media (max-width: 800px) {
    .header__logo {
        width: 200px;
    }
}

@media (max-width: 500px) {
    .header__logo {
        width: 140px;
    }
}

.footer {
    text-transform: uppercase;
    font-family: 'LexendDeca-SemiBold', sans-serif;
}

.footer__nav li:before {
    content:'';
}

.asideBox {
    border: 3px solid currentColor;
}

.userMenu__navItem {
    color: #000;
}

.userMenu__navItem a:hover,
.userMenu__navButton:hover {
    color: #000;
    opacity: 0.6;
}

h1,h2,h3,h4 {
    letter-spacing: normal;
    font-weight: normal;
    font-family: 'LexendDeca-ExtraBold', sans-serif;
}

.h3--section {
    border: none;
    margin: 0;
}

.button--filled {
    background: #fff;
    color: #000;
    font-family: 'LexendDeca-Bold', sans-serif;
    border: 3px solid #fff;
}

.button:hover {
    background: #fff;
    color: #000;
    border: 2px solid #fff;
}

.button--filled:hover {
    background: #000;
    color: #fff;
    border: 2px solid #fff;
}

form input {
    color: #000;
}

.cartItem__quantityInputButton {
    background: silver;
}

.textButton:hover,
.cartItem__button:hover,
.footer__nav a:hover {
    color: #fff;
    opacity: .6;
}

.listOptions__item,
.form__input,
.address {
    background: #fff;
    color: #000;
}

.listOptions__Button {
    border: 2px solid #000;
}

.listOptions__icon {
    width: 10px;
    height: 10px;
}

.form__label {
    color: #000;
}

.progress__number {
    box-shadow: 0 0 0 15px #000;
}

.active .progress__number {
    background: #000;
    border: 2px solid #fff;
}

.progress__icon,
.listOptions__icon,
.form__checkboxIcon {
    fill: #000;
}

.form__checkboxButton {
    background: #fff;
}

.address__buttonsItem a {
    color: #000;
    opacity: 0.6;
}

