Kirill Pet
8 months ago
parent
72ea7506a3
commit
bf2dd875e0
@ -1,5 +1,205 @@ |
|||||||
/* Стили для планшетов */ |
/* Стили для планшетов */ |
||||||
@media only screen and (max-width: 992px) { |
@media only screen and (max-width: 992px) { |
||||||
|
.wrapper{ |
||||||
|
width: 100%; |
||||||
|
} |
||||||
|
.phone--hone{ |
||||||
|
display: none; |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
/* header */ |
||||||
|
.header{ |
||||||
|
padding: 24px 16px; |
||||||
|
|
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: center; |
||||||
|
|
||||||
|
position: relative; |
||||||
|
} |
||||||
|
.header__wrapper{ |
||||||
|
padding: 0; |
||||||
|
} |
||||||
|
.header__phone{ |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
} |
||||||
|
.header-phone__item{ |
||||||
|
margin-left: 24px; |
||||||
|
|
||||||
|
width: 32px; |
||||||
|
height: 32px; |
||||||
|
|
||||||
|
transition: opacity .3s; |
||||||
|
} |
||||||
|
.header-phone__item > img{ |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
} |
||||||
|
.header-phone__item:first-child{ |
||||||
|
margin-left: 0; |
||||||
|
} |
||||||
|
.header-phone__item:active{ |
||||||
|
opacity: .8; |
||||||
|
} |
||||||
|
|
||||||
|
.button-menu{ |
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
|
||||||
|
position: relative; |
||||||
|
|
||||||
|
overflow: hidden; |
||||||
|
} |
||||||
|
.button-menu__open{ |
||||||
|
position: absolute; |
||||||
|
top: 0; |
||||||
|
left: 0; |
||||||
|
|
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
|
||||||
|
transition: opacity .3s; |
||||||
|
} |
||||||
|
.button-menu__close{ |
||||||
|
position: absolute; |
||||||
|
top: 0; |
||||||
|
left: 0; |
||||||
|
|
||||||
|
width: 100%; |
||||||
|
height: 100%; |
||||||
|
|
||||||
|
transition: opacity .3s; |
||||||
|
opacity: 0; |
||||||
|
} |
||||||
|
.button-menu.open .button-menu__open{ |
||||||
|
opacity: 0; |
||||||
|
} |
||||||
|
.button-menu.open .button-menu__close{ |
||||||
|
opacity: 1; |
||||||
|
} |
||||||
|
|
||||||
|
.phone-menu{ |
||||||
|
position: absolute; |
||||||
|
top: 112px; |
||||||
|
right: 0; |
||||||
|
left: 0; |
||||||
|
|
||||||
|
width: 100%; |
||||||
|
} |
||||||
|
.phone-menu__block-content{ |
||||||
|
/* height: 0; */ |
||||||
|
/* overflow: hidden; */ |
||||||
|
} |
||||||
|
.phone-menu__content{ |
||||||
|
padding: 0 16px 40px 16px; |
||||||
|
|
||||||
|
} |
||||||
|
.phone-menu__block{ |
||||||
|
margin-top: 32px; |
||||||
|
} |
||||||
|
.phone-menu__title{ |
||||||
|
font-weight: 700; |
||||||
|
font-size: 32px; |
||||||
|
color: var(--text-white); |
||||||
|
} |
||||||
|
.phone-menu__list{ |
||||||
|
list-style-type: none; |
||||||
|
|
||||||
|
font-weight: 400; |
||||||
|
font-size: 14px; |
||||||
|
text-transform: uppercase; |
||||||
|
color: var(--text-white); |
||||||
|
} |
||||||
|
.phone-menu__list a{ |
||||||
|
font-weight: 400; |
||||||
|
font-size: 14px; |
||||||
|
text-transform: uppercase; |
||||||
|
color: var(--text-white); |
||||||
|
|
||||||
|
text-decoration: none; |
||||||
|
} |
||||||
|
.phone-menu__list li{ |
||||||
|
margin-top: 24px; |
||||||
|
} |
||||||
|
.phone-menu__list li:first-child{ |
||||||
|
margin-top: 0; |
||||||
|
} |
||||||
|
.phone-menu--next{ |
||||||
|
display: block; |
||||||
|
|
||||||
|
background-image: url(/assets/img/icon/arrow-right.svg); |
||||||
|
background-repeat: no-repeat; |
||||||
|
background-position: center right; |
||||||
|
} |
||||||
|
|
||||||
|
.phone-menu__text{ |
||||||
|
margin-top: 24px; |
||||||
|
|
||||||
|
display: block; |
||||||
|
|
||||||
|
font-weight: 400; |
||||||
|
font-size: 16px; |
||||||
|
color: var(--text-white); |
||||||
|
} |
||||||
|
.phone-menu__text:first-child{ |
||||||
|
margin-top: 0; |
||||||
|
} |
||||||
|
.phone-menu__text > a { |
||||||
|
color: var(--text-white); |
||||||
|
} |
||||||
|
.phone-menu__text--no-line{ |
||||||
|
text-decoration: none; |
||||||
|
} |
||||||
|
|
||||||
|
.phone-social{ |
||||||
|
margin-top: 24px; |
||||||
|
|
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
} |
||||||
|
/* header */ |
||||||
|
|
||||||
|
/* footer */ |
||||||
|
.footer__wrapper{ |
||||||
|
padding: 0 16px; |
||||||
|
|
||||||
|
justify-content: start; |
||||||
|
} |
||||||
|
.footer__item:nth-child(2){ |
||||||
|
margin-left: 38px; |
||||||
|
} |
||||||
|
.footer__contact{ |
||||||
|
margin-top: 20px; |
||||||
|
|
||||||
|
flex-wrap: wrap; |
||||||
|
} |
||||||
|
.footer__contact .footer__item:nth-child(3){ |
||||||
|
margin-top: 20px; |
||||||
|
margin-left: 0; |
||||||
|
|
||||||
|
width: 100%; |
||||||
|
} |
||||||
|
/* footer */ |
||||||
|
} |
||||||
|
|
||||||
|
@media only screen and (max-width: 829px) { |
||||||
|
.footer__about{ |
||||||
|
flex-direction: column; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
@media only screen and (max-width: 630px) { |
||||||
|
.footer__wrapper{ |
||||||
|
justify-content: center; |
||||||
|
} |
||||||
|
.footer__contact{ |
||||||
|
flex-direction: column; |
||||||
|
justify-content: center; |
||||||
|
} |
||||||
|
.footer__contact .footer__item:nth-child(2){ |
||||||
|
margin-top: 20px; |
||||||
|
margin-left: 0; |
||||||
|
} |
||||||
} |
} |
||||||
Loading…
Reference in new issue