TRI-283: end header + start adaptive 1400>

This commit is contained in:
2024-11-20 01:38:34 +03:00
parent 4996d02f71
commit d83940b47d
27 changed files with 1883 additions and 208 deletions

View File

@@ -2,7 +2,6 @@
margin: 0 auto;
width: 1280px;
position: relative;
min-height: 695px;
}
@media (min-width: 1720px) {
@@ -11,11 +10,19 @@
}
}
/*@media (max-width: 1019.98px) {*/
/* .container {*/
/* width: 720px*/
/* }*/
/*}*/
@media (max-width: 1304.98px) {
.container {
width: 1120px;
max-width: 88vw;
}
}
@media (max-width: 991.98px) {
.container {
width: 640px;
}
}
/*@media (max-width: 767.98px) {*/
/* .container {*/
/* margin: 0 15px;*/
@@ -36,6 +43,10 @@
color: var(--color-black2);
}
body {
overflow-x: hidden;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
font-weight: 700;
}
@@ -128,6 +139,19 @@ b {
}
}
@media (max-width: 1304.98px) {
.title {
margin-bottom: 20px;
}
}
@media (max-width: 991.98px) {
.title {
font-size: 32px;
line-height: 38.73px;
}
}
.subtitle {
margin-bottom: 81px;
line-height: 22px;
@@ -140,12 +164,18 @@ b {
}
}
@media (max-width: 1304.98px) {
.subtitle {
margin-bottom: 71px;
}
}
.hide {
display: none;
}
.hide__xxl {
display: block;
display: initial;
}
@media (min-width: 1720px) {
@@ -154,6 +184,16 @@ b {
}
}
.hide__md {
display: initial;
}
@media (max-width: 991.98px) {
.hide__md {
display: none;
}
}
.show__xxl {
display: none;
}
@@ -164,17 +204,136 @@ b {
}
}
@media (min-width: 1440px) {
.is-container.wrapper_main {
max-width: initial;
.show__md {
display: none;
}
@media (max-width: 991.98px) {
.show__md {
display: initial;
}
}
@media (min-width: 1440px) {
.br--xxl {
display: none;
}
}
@media (max-width: 991.98px) {
.br--md {
display: none;
}
}
@media (min-width: 1440px) {
.is-container.wrapper_main {
max-width: initial;
}
}
.header {
margin-top: 0;
position: relative;
padding: 40px 5px;
}
@media (max-width: 991.98px) {
.header {
padding-top: 19px;
padding-bottom: 19px;
}
}
.header__grid, .header__list {
display: flex;
align-items: center;
justify-content: space-between;
}
.header__logo {
width: 48px;
height: 48px;
position: relative;
left: 5px;
}
@media (max-width: 1304.98px) {
.header__logo {
left: 14px;
}
}
@media (max-width: 991.98px) {
.header__logo {
left: 0;
}
}
.header__nav {
flex-grow: 1;
max-width: 41%;
margin-left: auto;
}
@media (min-width: 1720px) {
.header__nav {
max-width: 34%;
}
}
@media (max-width: 1304.98px) {
.header__nav {
max-width: 46%;
}
}
.header__link {
color: var(--color-black2);
text-decoration: none;
}
.header__btn {
padding: 8px 0 6px;
font-size: 16px;
margin-left: 61px;
margin-right: -3px;
}
@media (min-width: 1720px) {
.header__btn {
margin-left: 81px;
}
}
@media (max-width: 1304.98px) {
.header__btn {
margin-right: -8px;
}
}
@media (max-width: 991.98px) {
.header__btn {
display: none;
}
}
.header .dropdown {
left: -4px;
}
.header .dropdown-content {
right: 0;
height: initial;
}
.header .dropdown img {
width: 25px;
height: 25px;
}
.presentation {
margin: 20px -65px 140px;
margin: 12px -65px 140px;
}
@media (min-width: 1720px) {
@@ -185,6 +344,18 @@ b {
}
}
@media (max-width: 1304.98px) {
.presentation {
margin-bottom: 120px;
}
}
@media (max-width: 991.98px) {
.presentation {
margin-bottom: 105px;
}
}
.presentation__top {
position: relative;
min-height: 270px;
@@ -205,19 +376,65 @@ b {
}
}
@media (max-width: 1304.98px) {
.presentation__top {
background-size: 16%, 20%, 9.5%, 10.1%;
background-position: top -2.8% left 6.5%, top -19% right 3.5%, bottom 32% left 23%, bottom 29% right 22.6%;
margin-bottom: 96px;
}
}
@media (max-width: 991.98px) {
.presentation__top {
background-size: 14.5%, 17%, 8.3%, 9.1%;
background-position: top 9% left 7%, top 5% right 6%, bottom 51% left 14.8%, bottom 47.5% right 13.8%;
padding-top: 31px;
margin-bottom: 76px;
}
}
@media (max-width: 991.98px) {
.presentation__bottom .subtitle {
max-width: 40%;
margin: 0 auto 30px;
}
}
.presentation__title {
margin-bottom: 23px;
}
@media (max-width: 991.98px) {
.presentation__title {
max-width: 75%;
margin: 0 auto 19px;
}
}
.presentation__subtitle {
margin-bottom: 41px;
font-weight: 600;
}
@media (max-width: 991.98px) {
.presentation__subtitle {
max-width: 55%;
margin: 0 auto 40px;
font-size: 16px;
}
}
.presentation__btn {
margin-bottom: 40px;
}
@media (max-width: 991.98px) {
.presentation__btn {
padding-left: 82px;
padding-right: 82px;
}
}
.presentation__next {
font-weight: 500;
line-height: 22px;
@@ -242,6 +459,12 @@ b {
}
}
@media (max-width: 1304.98px) {
.presentation__cards {
max-width: 1140px;
}
}
.presentation__bottom .presentation__title {
margin-bottom: 13px;
}
@@ -276,9 +499,10 @@ b {
position: relative;
}
.cards__img:hover {
scale: 1.05;
transition: scale 0.15s linear;
@media (max-width: 991.98px) {
.cards__item {
max-width: 270px;
}
}
.cards__img {
@@ -292,6 +516,17 @@ b {
}
}
@media (max-width: 991.98px) {
.cards__img {
margin-bottom: 8px;
}
}
.cards__img:hover {
scale: 1.05;
transition: scale 0.15s linear;
}
.cards__desc {
font-weight: 500;
line-height: 22px;
@@ -306,6 +541,21 @@ b {
}
}
@media (max-width: 1279.98px) {
.cards__desc {
padding-left: 5px;
padding-right: 5px;
margin-bottom: 3px;
}
}
@media (max-width: 991.98px) {
.cards__desc {
padding-left: 8px;
padding-right: 8px;
}
}
.cards__desc a {
color: var(--color-orange);
}
@@ -326,6 +576,49 @@ b {
}
}
@media (max-width: 1304.98px) {
.cards__arrow {
top: -8%;
}
}
@media (max-width: 991.98px) {
.cards__arrow {
display: none;
}
}
.cards .slick-list {
overflow: visible;
}
.slick-dots {
display: flex;
justify-content: center;
margin: 0;
padding: 1rem 0;
list-style-type: none;
}
.slick-dots li {
margin: 0 0.25rem;
}
.slick-dots button {
display: block;
width: 8px;
height: 8px;
padding: 0;
border: none;
border-radius: 100%;
background-color: #D9D9D9;
text-indent: -9999px;
}
.slick-dots li.slick-active button {
background-color: var(--color-orange);
}
.easy {
margin-bottom: 162px;
}
@@ -336,6 +629,18 @@ b {
}
}
@media (max-width: 1304.98px) {
.easy {
margin-bottom: 142px;
}
}
@media (max-width: 991.98px) {
.easy {
margin-bottom: 121px;
}
}
.easy .title {
max-width: 55%;
margin-bottom: 21px;
@@ -348,6 +653,12 @@ b {
}
}
@media (max-width: 991.98px) {
.easy .title {
max-width: 75%;
}
}
.easy .subtitle {
margin-bottom: 41px;
}
@@ -377,6 +688,21 @@ b {
}
}
@media (max-width: 1304.98px) {
.easy__grid {
grid-column-gap: 69px;
grid-template-rows: repeat(2, minmax(172px, auto));
margin-bottom: 41px;
}
}
@media (max-width: 991.98px) {
.easy__grid {
display: block;
margin-bottom: 40px;
}
}
.easy__item {
border-radius: 30px;
background-color: var(--color-grey);
@@ -400,6 +726,20 @@ b {
}
}
@media (max-width: 1304.98px) {
.easy__item--fir {
margin-right: 13px;
}
}
@media (max-width: 991.98px) {
.easy__item--fir {
padding-top: 17px;
margin-right: 0;
margin-bottom: 43px;
}
}
.easy__item--fir p {
width: 93%;
margin-bottom: 29px;
@@ -412,24 +752,29 @@ b {
}
}
.easy__item--thr {
grid-area: c;
display: flex;
align-items: center;
justify-content: space-between;
}
.easy__item--sec {
grid-area: b;
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
}
@media (max-width: 991.98px) {
.easy__item--sec {
padding-top: 35px;
padding-bottom: 37px;
margin-bottom: 39px;
}
}
.easy__item--sec img {
margin-bottom: -10px;
margin-right: -5px;
max-width: 50.1%;
}
@media (min-width: 1720px) {
@@ -438,13 +783,78 @@ b {
}
}
.easy__item--thr img {
@media (max-width: 1304.98px) {
.easy__item--sec img {
max-width: 43.1%;
}
}
@media (max-width: 991.98px) {
.easy__item--sec img {
margin-right: 0;
margin-bottom: 0;
}
}
.easy__item--sec p {
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
}
.easy__item--thr {
grid-area: c;
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
}
@media (max-width: 991.98px) {
.easy__item--thr {
padding-top: 42px;
padding-bottom: 46px;
}
}
.easy__item--thr .img {
margin-bottom: -10px;
margin-right: 24px;
max-width: 80%;
}
@media (max-width: 1279.98px) {
.easy__item--thr .img {
max-width: 35%;
}
}
@media (max-width: 1304.98px) {
.easy__item--thr .img {
margin-right: 2px;
}
}
@media (max-width: 991.98px) {
.easy__item--thr .img {
margin-right: 0;
max-width: 34%;
}
}
.easy__item--thr p {
max-width: 50%;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
}
@media (max-width: 991.98px) {
.easy__item--thr p {
max-width: 60%;
}
}
.easy__arrow {
@@ -461,6 +871,18 @@ b {
}
}
@media (max-width: 1304.98px) {
.easy__arrow {
scale: 0.8;
}
}
@media (max-width: 991.98px) {
.easy__arrow {
display: none;
}
}
.easy__arrow--fir {
top: 46%;
right: 101%;
@@ -473,6 +895,12 @@ b {
}
}
@media (max-width: 1304.98px) {
.easy__arrow--fir {
top: 48%;
}
}
.easy__arrow--sec {
top: 117%;
left: 30%;
@@ -486,17 +914,22 @@ b {
}
}
@media (max-width: 1304.98px) {
.easy__arrow--sec {
left: 38%;
}
}
.easy__btn {
margin-top: -21px;
}
.easy__item--sec p,
.easy__item--thr p,
.easy__item--sec,
.easy__item--thr {
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
@media (max-width: 991.98px) {
.easy__btn {
margin-top: -26px;
padding-left: 54px;
padding-right: 54px;
}
}
.chatterbox {
@@ -537,6 +970,14 @@ b {
}
}
@media (max-width: 1304.98px) {
.chatterbox__slide {
width: 300px;
height: 615px;
background-size: 300px 615px;
}
}
.chatterbox__slide.loaded video {
opacity: 1;
}
@@ -647,6 +1088,12 @@ b {
}
}
@media (max-width: 1304.98px) {
.chatterbox__vbox {
height: 530px;
}
}
.chatterbox .title {
margin-bottom: 60px;
}
@@ -684,6 +1131,18 @@ b {
}
}
@media (max-width: 1304.98px) {
.use {
margin-bottom: 145px;
}
}
@media (max-width: 991.98px) {
.use {
margin-bottom: 121px;
}
}
.use__img {
width: 67.5%;
margin-left: 16px;
@@ -694,6 +1153,21 @@ b {
.use__img {
width: 50.2%;
margin-left: 27px;
margin-bottom: 35px;
}
}
@media (max-width: 1304.98px) {
.use__img {
width: 77%;
}
}
@media (max-width: 991.98px) {
.use__img {
margin-left: 0;
width: 100%;
margin-bottom: 40px;
}
}
@@ -719,13 +1193,19 @@ b {
}
}
@media (max-width: 991.98px) {
.use .title {
margin-bottom: 38px;
}
}
.use--lett {
margin-bottom: 120px;
}
@media (min-width: 1720px) {
.use--lett {
margin-bottom: 140px;
margin-bottom: 135px;
}
}
@@ -746,8 +1226,15 @@ b {
}
}
@media (max-width: 991.98px) {
.use .h3 {
max-width: 75%;
margin: 0 auto 22px;
}
}
.diff {
margin-bottom: 166px;
margin-bottom: 168px;
}
@media (min-width: 1720px) {
@@ -756,6 +1243,12 @@ b {
}
}
@media (max-width: 991.98px) {
.diff {
margin-bottom: 125px;
}
}
.diff .title {
width: 60%;
margin-bottom: 65px;
@@ -768,6 +1261,20 @@ b {
}
}
@media (max-width: 1304.98px) {
.diff .title {
width: 73%;
margin-bottom: 40px;
}
}
@media (max-width: 991.98px) {
.diff .title {
width: 90%;
margin-bottom: 40px;
}
}
.diff__grid {
display: flex;
position: relative;
@@ -786,14 +1293,38 @@ b {
bottom: 0;
}
@media (max-width: 991.98px) {
.diff__grid::before {
display: none;
}
}
@media (max-width: 991.98px) {
.diff__grid {
display: block;
}
}
.diff__coll {
width: 50%;
}
@media (max-width: 991.98px) {
.diff__coll {
width: 100%;
}
}
.diff__coll.left {
margin-right: 29px;
}
@media (max-width: 991.98px) {
.diff__coll.left {
margin-right: 0;
}
}
.diff__coll.left .diff__coll-title {
padding-left: 39px;
}
@@ -804,10 +1335,23 @@ b {
}
}
@media (max-width: 991.98px) {
.diff__coll.left .diff__coll-title {
padding-left: 0;
}
}
.diff__coll.right {
margin-left: 29px;
}
@media (max-width: 991.98px) {
.diff__coll.right {
margin-left: 0;
display: none;
}
}
.diff__coll.right .diff__coll-title {
padding-right: 39px;
}
@@ -818,10 +1362,22 @@ b {
}
}
@media (max-width: 991.98px) {
.diff__coll.right .diff__coll-title {
padding-right: 0;
}
}
.diff__coll-title {
margin-bottom: 38px;
}
@media (max-width: 991.98px) {
.diff__coll-title {
margin-bottom: 19px;
}
}
.diff__item {
position: relative;
text-align: left;
@@ -850,6 +1406,14 @@ b {
}
}
@media (max-width: 991.98px) {
.diff__item {
font-size: 18px;
margin-bottom: 25px;
padding-bottom: 9px;
}
}
.diff__item:last-child {
margin-bottom: 0;
}
@@ -872,6 +1436,12 @@ b {
}
}
@media (max-width: 991.98px) {
.diff__status {
border-radius: 11px;
}
}
.diff__status::before {
position: absolute;
left: 50%;
@@ -1113,7 +1683,7 @@ b {
}
.uses {
margin-bottom: 122px;
margin-bottom: 120px;
}
@media (min-width: 1720px) {
@@ -1132,7 +1702,7 @@ b {
.uses__item {
min-height: 50px;
margin-bottom: 43px;
margin-bottom: 19px;
padding: 0 50px 0 2px;
}
@@ -1161,6 +1731,7 @@ b {
.sore {
margin-bottom: 160px;
margin-top: 1px;
}
@media (min-width: 1720px) {

View File

@@ -7,9 +7,10 @@
position: relative;
}
.cards__img:hover {
scale: 1.05;
transition: scale 0.15s linear;
@media (max-width: 991.98px) {
.cards__item {
max-width: 270px;
}
}
.cards__img {
@@ -23,6 +24,17 @@
}
}
@media (max-width: 991.98px) {
.cards__img {
margin-bottom: 8px;
}
}
.cards__img:hover {
scale: 1.05;
transition: scale 0.15s linear;
}
.cards__desc {
font-weight: 500;
line-height: 22px;
@@ -37,6 +49,21 @@
}
}
@media (max-width: 1279.98px) {
.cards__desc {
padding-left: 5px;
padding-right: 5px;
margin-bottom: 3px;
}
}
@media (max-width: 991.98px) {
.cards__desc {
padding-left: 8px;
padding-right: 8px;
}
}
.cards__desc a {
color: var(--color-orange);
}
@@ -56,3 +83,46 @@
top: -29px;
}
}
@media (max-width: 1304.98px) {
.cards__arrow {
top: -8%;
}
}
@media (max-width: 991.98px) {
.cards__arrow {
display: none;
}
}
.cards .slick-list {
overflow: visible;
}
.slick-dots {
display: flex;
justify-content: center;
margin: 0;
padding: 1rem 0;
list-style-type: none;
}
.slick-dots li {
margin: 0 0.25rem;
}
.slick-dots button {
display: block;
width: 8px;
height: 8px;
padding: 0;
border: none;
border-radius: 100%;
background-color: #D9D9D9;
text-indent: -9999px;
}
.slick-dots li.slick-active button {
background-color: var(--color-orange);
}

View File

@@ -36,6 +36,14 @@
}
}
@media (max-width: 1304.98px) {
.chatterbox__slide {
width: 300px;
height: 615px;
background-size: 300px 615px;
}
}
.chatterbox__slide.loaded video {
opacity: 1;
}
@@ -146,6 +154,12 @@
}
}
@media (max-width: 1304.98px) {
.chatterbox__vbox {
height: 530px;
}
}
.chatterbox .title {
margin-bottom: 60px;
}

View File

@@ -1,5 +1,5 @@
.diff {
margin-bottom: 166px;
margin-bottom: 168px;
}
@media (min-width: 1720px) {
@@ -8,6 +8,12 @@
}
}
@media (max-width: 991.98px) {
.diff {
margin-bottom: 125px;
}
}
.diff .title {
width: 60%;
margin-bottom: 65px;
@@ -20,6 +26,20 @@
}
}
@media (max-width: 1304.98px) {
.diff .title {
width: 73%;
margin-bottom: 40px;
}
}
@media (max-width: 991.98px) {
.diff .title {
width: 90%;
margin-bottom: 40px;
}
}
.diff__grid {
display: flex;
position: relative;
@@ -38,14 +58,38 @@
bottom: 0;
}
@media (max-width: 991.98px) {
.diff__grid::before {
display: none;
}
}
@media (max-width: 991.98px) {
.diff__grid {
display: block;
}
}
.diff__coll {
width: 50%;
}
@media (max-width: 991.98px) {
.diff__coll {
width: 100%;
}
}
.diff__coll.left {
margin-right: 29px;
}
@media (max-width: 991.98px) {
.diff__coll.left {
margin-right: 0;
}
}
.diff__coll.left .diff__coll-title {
padding-left: 39px;
}
@@ -56,10 +100,23 @@
}
}
@media (max-width: 991.98px) {
.diff__coll.left .diff__coll-title {
padding-left: 0;
}
}
.diff__coll.right {
margin-left: 29px;
}
@media (max-width: 991.98px) {
.diff__coll.right {
margin-left: 0;
display: none;
}
}
.diff__coll.right .diff__coll-title {
padding-right: 39px;
}
@@ -70,10 +127,22 @@
}
}
@media (max-width: 991.98px) {
.diff__coll.right .diff__coll-title {
padding-right: 0;
}
}
.diff__coll-title {
margin-bottom: 38px;
}
@media (max-width: 991.98px) {
.diff__coll-title {
margin-bottom: 19px;
}
}
.diff__item {
position: relative;
text-align: left;
@@ -102,6 +171,14 @@
}
}
@media (max-width: 991.98px) {
.diff__item {
font-size: 18px;
margin-bottom: 25px;
padding-bottom: 9px;
}
}
.diff__item:last-child {
margin-bottom: 0;
}
@@ -124,6 +201,12 @@
}
}
@media (max-width: 991.98px) {
.diff__status {
border-radius: 11px;
}
}
.diff__status::before {
position: absolute;
left: 50%;

View File

@@ -8,6 +8,18 @@
}
}
@media (max-width: 1304.98px) {
.easy {
margin-bottom: 142px;
}
}
@media (max-width: 991.98px) {
.easy {
margin-bottom: 121px;
}
}
.easy .title {
max-width: 55%;
margin-bottom: 21px;
@@ -20,6 +32,12 @@
}
}
@media (max-width: 991.98px) {
.easy .title {
max-width: 75%;
}
}
.easy .subtitle {
margin-bottom: 41px;
}
@@ -49,6 +67,21 @@
}
}
@media (max-width: 1304.98px) {
.easy__grid {
grid-column-gap: 69px;
grid-template-rows: repeat(2, minmax(172px, auto));
margin-bottom: 41px;
}
}
@media (max-width: 991.98px) {
.easy__grid {
display: block;
margin-bottom: 40px;
}
}
.easy__item {
border-radius: 30px;
background-color: var(--color-grey);
@@ -72,6 +105,20 @@
}
}
@media (max-width: 1304.98px) {
.easy__item--fir {
margin-right: 13px;
}
}
@media (max-width: 991.98px) {
.easy__item--fir {
padding-top: 17px;
margin-right: 0;
margin-bottom: 43px;
}
}
.easy__item--fir p {
width: 93%;
margin-bottom: 29px;
@@ -84,24 +131,29 @@
}
}
.easy__item--thr {
grid-area: c;
display: flex;
align-items: center;
justify-content: space-between;
}
.easy__item--sec {
grid-area: b;
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
}
@media (max-width: 991.98px) {
.easy__item--sec {
padding-top: 35px;
padding-bottom: 37px;
margin-bottom: 39px;
}
}
.easy__item--sec img {
margin-bottom: -10px;
margin-right: -5px;
max-width: 50.1%;
}
@media (min-width: 1720px) {
@@ -110,13 +162,78 @@
}
}
.easy__item--thr img {
@media (max-width: 1304.98px) {
.easy__item--sec img {
max-width: 43.1%;
}
}
@media (max-width: 991.98px) {
.easy__item--sec img {
margin-right: 0;
margin-bottom: 0;
}
}
.easy__item--sec p {
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
}
.easy__item--thr {
grid-area: c;
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
}
@media (max-width: 991.98px) {
.easy__item--thr {
padding-top: 42px;
padding-bottom: 46px;
}
}
.easy__item--thr .img {
margin-bottom: -10px;
margin-right: 24px;
max-width: 80%;
}
@media (max-width: 1279.98px) {
.easy__item--thr .img {
max-width: 35%;
}
}
@media (max-width: 1304.98px) {
.easy__item--thr .img {
margin-right: 2px;
}
}
@media (max-width: 991.98px) {
.easy__item--thr .img {
margin-right: 0;
max-width: 34%;
}
}
.easy__item--thr p {
max-width: 50%;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
}
@media (max-width: 991.98px) {
.easy__item--thr p {
max-width: 60%;
}
}
.easy__arrow {
@@ -133,6 +250,18 @@
}
}
@media (max-width: 1304.98px) {
.easy__arrow {
scale: 0.8;
}
}
@media (max-width: 991.98px) {
.easy__arrow {
display: none;
}
}
.easy__arrow--fir {
top: 46%;
right: 101%;
@@ -145,6 +274,12 @@
}
}
@media (max-width: 1304.98px) {
.easy__arrow--fir {
top: 48%;
}
}
.easy__arrow--sec {
top: 117%;
left: 30%;
@@ -158,15 +293,20 @@
}
}
@media (max-width: 1304.98px) {
.easy__arrow--sec {
left: 38%;
}
}
.easy__btn {
margin-top: -21px;
}
.easy__item--sec p,
.easy__item--thr p,
.easy__item--sec,
.easy__item--thr {
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
@media (max-width: 991.98px) {
.easy__btn {
margin-top: -26px;
padding-left: 54px;
padding-right: 54px;
}
}

View File

@@ -0,0 +1,99 @@
.header {
margin-top: 0;
position: relative;
padding: 40px 5px;
}
@media (max-width: 991.98px) {
.header {
padding-top: 19px;
padding-bottom: 19px;
}
}
.header__grid, .header__list {
display: flex;
align-items: center;
justify-content: space-between;
}
.header__logo {
width: 48px;
height: 48px;
position: relative;
left: 5px;
}
@media (max-width: 1304.98px) {
.header__logo {
left: 14px;
}
}
@media (max-width: 991.98px) {
.header__logo {
left: 0;
}
}
.header__nav {
flex-grow: 1;
max-width: 41%;
margin-left: auto;
}
@media (min-width: 1720px) {
.header__nav {
max-width: 34%;
}
}
@media (max-width: 1304.98px) {
.header__nav {
max-width: 46%;
}
}
.header__link {
color: var(--color-black2);
text-decoration: none;
}
.header__btn {
padding: 8px 0 6px;
font-size: 16px;
margin-left: 61px;
margin-right: -3px;
}
@media (min-width: 1720px) {
.header__btn {
margin-left: 81px;
}
}
@media (max-width: 1304.98px) {
.header__btn {
margin-right: -8px;
}
}
@media (max-width: 991.98px) {
.header__btn {
display: none;
}
}
.header .dropdown {
left: -4px;
}
.header .dropdown-content {
right: 0;
height: initial;
}
.header .dropdown img {
width: 25px;
height: 25px;
}

View File

@@ -1,5 +1,5 @@
.presentation {
margin: 20px -65px 140px;
margin: 12px -65px 140px;
}
@media (min-width: 1720px) {
@@ -10,6 +10,18 @@
}
}
@media (max-width: 1304.98px) {
.presentation {
margin-bottom: 120px;
}
}
@media (max-width: 991.98px) {
.presentation {
margin-bottom: 105px;
}
}
.presentation__top {
position: relative;
min-height: 270px;
@@ -30,19 +42,65 @@
}
}
@media (max-width: 1304.98px) {
.presentation__top {
background-size: 16%, 20%, 9.5%, 10.1%;
background-position: top -2.8% left 6.5%, top -19% right 3.5%, bottom 32% left 23%, bottom 29% right 22.6%;
margin-bottom: 96px;
}
}
@media (max-width: 991.98px) {
.presentation__top {
background-size: 14.5%, 17%, 8.3%, 9.1%;
background-position: top 9% left 7%, top 5% right 6%, bottom 51% left 14.8%, bottom 47.5% right 13.8%;
padding-top: 31px;
margin-bottom: 76px;
}
}
@media (max-width: 991.98px) {
.presentation__bottom .subtitle {
max-width: 40%;
margin: 0 auto 30px;
}
}
.presentation__title {
margin-bottom: 23px;
}
@media (max-width: 991.98px) {
.presentation__title {
max-width: 75%;
margin: 0 auto 19px;
}
}
.presentation__subtitle {
margin-bottom: 41px;
font-weight: 600;
}
@media (max-width: 991.98px) {
.presentation__subtitle {
max-width: 55%;
margin: 0 auto 40px;
font-size: 16px;
}
}
.presentation__btn {
margin-bottom: 40px;
}
@media (max-width: 991.98px) {
.presentation__btn {
padding-left: 82px;
padding-right: 82px;
}
}
.presentation__next {
font-weight: 500;
line-height: 22px;
@@ -67,6 +125,12 @@
}
}
@media (max-width: 1304.98px) {
.presentation__cards {
max-width: 1140px;
}
}
.presentation__bottom .presentation__title {
margin-bottom: 13px;
}

View File

@@ -2,7 +2,6 @@
margin: 0 auto;
width: 1280px;
position: relative;
min-height: 695px;
}
@media (min-width: 1720px) {
@@ -11,11 +10,19 @@
}
}
/*@media (max-width: 1019.98px) {*/
/* .container {*/
/* width: 720px*/
/* }*/
/*}*/
@media (max-width: 1304.98px) {
.container {
width: 1120px;
max-width: 88vw;
}
}
@media (max-width: 991.98px) {
.container {
width: 640px;
}
}
/*@media (max-width: 767.98px) {*/
/* .container {*/
/* margin: 0 15px;*/
@@ -36,6 +43,10 @@
color: var(--color-black2);
}
body {
overflow-x: hidden;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
font-weight: 700;
}
@@ -128,6 +139,19 @@ b {
}
}
@media (max-width: 1304.98px) {
.title {
margin-bottom: 20px;
}
}
@media (max-width: 991.98px) {
.title {
font-size: 32px;
line-height: 38.73px;
}
}
.subtitle {
margin-bottom: 81px;
line-height: 22px;
@@ -140,12 +164,18 @@ b {
}
}
@media (max-width: 1304.98px) {
.subtitle {
margin-bottom: 71px;
}
}
.hide {
display: none;
}
.hide__xxl {
display: block;
display: initial;
}
@media (min-width: 1720px) {
@@ -154,6 +184,16 @@ b {
}
}
.hide__md {
display: initial;
}
@media (max-width: 991.98px) {
.hide__md {
display: none;
}
}
.show__xxl {
display: none;
}
@@ -164,11 +204,30 @@ b {
}
}
@media (min-width: 1440px) {
.is-container.wrapper_main {
max-width: initial;
.show__md {
display: none;
}
@media (max-width: 991.98px) {
.show__md {
display: initial;
}
}
@media (min-width: 1440px) {
.br--xxl {
display: none;
}
}
@media (max-width: 991.98px) {
.br--md {
display: none;
}
}
@media (min-width: 1440px) {
.is-container.wrapper_main {
max-width: initial;
}
}

View File

@@ -1,5 +1,6 @@
.sore {
margin-bottom: 160px;
margin-top: 1px;
}
@media (min-width: 1720px) {

View File

@@ -8,6 +8,18 @@
}
}
@media (max-width: 1304.98px) {
.use {
margin-bottom: 145px;
}
}
@media (max-width: 991.98px) {
.use {
margin-bottom: 121px;
}
}
.use__img {
width: 67.5%;
margin-left: 16px;
@@ -18,6 +30,21 @@
.use__img {
width: 50.2%;
margin-left: 27px;
margin-bottom: 35px;
}
}
@media (max-width: 1304.98px) {
.use__img {
width: 77%;
}
}
@media (max-width: 991.98px) {
.use__img {
margin-left: 0;
width: 100%;
margin-bottom: 40px;
}
}
@@ -43,13 +70,19 @@
}
}
@media (max-width: 991.98px) {
.use .title {
margin-bottom: 38px;
}
}
.use--lett {
margin-bottom: 120px;
}
@media (min-width: 1720px) {
.use--lett {
margin-bottom: 140px;
margin-bottom: 135px;
}
}
@@ -69,3 +102,10 @@
width: initial;
}
}
@media (max-width: 991.98px) {
.use .h3 {
max-width: 75%;
margin: 0 auto 22px;
}
}

View File

@@ -1,5 +1,5 @@
.uses {
margin-bottom: 122px;
margin-bottom: 120px;
}
@media (min-width: 1720px) {
@@ -18,7 +18,7 @@
.uses__item {
min-height: 50px;
margin-bottom: 43px;
margin-bottom: 19px;
padding: 0 50px 0 2px;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

BIN
static/img/png/use-md.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 231 KiB