TRI-283: end adaptive 1920 + start header
This commit is contained in:
@@ -58,6 +58,13 @@ h2, .h2 {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
h2, .h2 {
|
||||
font-size: 28px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
h3, .h3 {
|
||||
font-size: 20px;
|
||||
line-height: 28px;
|
||||
@@ -75,6 +82,13 @@ p {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
p {
|
||||
font-size: 20px;
|
||||
line-height: 26px;
|
||||
}
|
||||
}
|
||||
|
||||
b {
|
||||
font-weight: 500;
|
||||
}
|
||||
@@ -109,7 +123,7 @@ b {
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.title {
|
||||
font-size: 44px;
|
||||
font-size: 48px;
|
||||
margin-bottom: 22px;
|
||||
}
|
||||
}
|
||||
@@ -122,7 +136,7 @@ b {
|
||||
@media (min-width: 1720px) {
|
||||
.subtitle {
|
||||
font-size: 20px;
|
||||
margin-bottom: 97px;
|
||||
margin-bottom: 105px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -130,10 +144,33 @@ b {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.hide__xxl {
|
||||
display: block;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.hide__xxl {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.show__xxl {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.show__xxl {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1440px) {
|
||||
.is-container.wrapper_main {
|
||||
max-width: initial;
|
||||
}
|
||||
.br--xxl {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.presentation {
|
||||
@@ -144,6 +181,7 @@ b {
|
||||
.presentation {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
margin-bottom: 160px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -155,7 +193,7 @@ b {
|
||||
background-image: url(/static/img/png/Box9.png), url(/static/img/png/Box10.png), url(/static/img/png/Box11.png), url(/static/img/png/Box12.png);
|
||||
background-position: top -4px left 46px, top -30px right -14px, bottom 73px left 278px, bottom 71px right 276px;
|
||||
background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
|
||||
background-size: 17.5%,21.8%,8.5%,8.8%;
|
||||
background-size: 17.5%, 21.8%, 8.5%, 8.8%;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
@@ -191,6 +229,23 @@ b {
|
||||
animation: jump 2s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.presentation__cards {
|
||||
max-width: 1300px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.presentation__cards {
|
||||
max-width: initial;
|
||||
margin-left: -10px;
|
||||
margin-right: -10px;
|
||||
}
|
||||
}
|
||||
|
||||
.presentation__bottom .presentation__title {
|
||||
margin-bottom: 13px;
|
||||
}
|
||||
|
||||
@keyframes jump {
|
||||
0% {
|
||||
transform: translateY(0px);
|
||||
@@ -212,15 +267,6 @@ b {
|
||||
}
|
||||
}
|
||||
|
||||
.presentation__bottom .presentation__title {
|
||||
margin-bottom: 13px;
|
||||
}
|
||||
|
||||
.presentation__cards {
|
||||
max-width: 1300px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.cards__list {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
@@ -239,11 +285,31 @@ b {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.cards__img {
|
||||
width: 100%;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.cards__desc {
|
||||
font-weight: 500;
|
||||
line-height: 22px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.cards__desc {
|
||||
font-size: 20px;
|
||||
line-height: 26px;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.cards__desc a {
|
||||
color: var(--color-orange);
|
||||
}
|
||||
|
||||
.cards__arrow {
|
||||
width: 62px;
|
||||
height: 20px;
|
||||
@@ -253,19 +319,45 @@ b {
|
||||
background-image: url("/static/img/svg/Arrow23.svg");
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.cards__arrow {
|
||||
right: -45px;
|
||||
top: -29px;
|
||||
}
|
||||
}
|
||||
|
||||
.easy {
|
||||
margin-bottom: 162px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.easy {
|
||||
margin-bottom: 180px;
|
||||
}
|
||||
}
|
||||
|
||||
.easy .title {
|
||||
max-width: 55%;
|
||||
margin-bottom: 21px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.easy .title {
|
||||
max-width: 45%;
|
||||
margin-bottom: 23px;
|
||||
}
|
||||
}
|
||||
|
||||
.easy .subtitle {
|
||||
margin-bottom: 41px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.easy .subtitle {
|
||||
margin-bottom: 59px;
|
||||
}
|
||||
}
|
||||
|
||||
.easy__grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
@@ -276,6 +368,15 @@ b {
|
||||
margin-bottom: 46px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.easy__grid {
|
||||
grid-column-gap: 147px;
|
||||
grid-template-rows: repeat(2, minmax(245px, auto));
|
||||
grid-row-gap: 136px;
|
||||
margin-bottom: 63px;
|
||||
}
|
||||
}
|
||||
|
||||
.easy__item {
|
||||
border-radius: 30px;
|
||||
background-color: var(--color-grey);
|
||||
@@ -291,19 +392,31 @@ b {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.easy__item--fir {
|
||||
margin-right: -10px;
|
||||
margin-left: 7px;
|
||||
padding-top: 31px;
|
||||
}
|
||||
}
|
||||
|
||||
.easy__item--fir p {
|
||||
width: 93%;
|
||||
margin-bottom: 29px;
|
||||
}
|
||||
|
||||
.easy__item--sec img {
|
||||
margin-bottom: -10px;
|
||||
margin-right: -5px;
|
||||
@media (min-width: 1720px) {
|
||||
.easy__item--fir p {
|
||||
width: 89%;
|
||||
margin-bottom: 53px;
|
||||
}
|
||||
}
|
||||
|
||||
.easy__item--thr img {
|
||||
margin-bottom: -10px;
|
||||
margin-right: 24px;
|
||||
.easy__item--thr {
|
||||
grid-area: c;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.easy__item--sec {
|
||||
@@ -314,20 +427,20 @@ b {
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.easy__item--sec p,
|
||||
.easy__item--thr p,
|
||||
.easy__item--sec,
|
||||
.easy__item--thr {
|
||||
margin-bottom: 0;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
.easy__item--sec img {
|
||||
margin-bottom: -10px;
|
||||
margin-right: -5px;
|
||||
}
|
||||
|
||||
.easy__item--thr {
|
||||
grid-area: c;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
@media (min-width: 1720px) {
|
||||
.easy__item--sec img {
|
||||
margin-right: -12px;
|
||||
}
|
||||
}
|
||||
|
||||
.easy__item--thr img {
|
||||
margin-bottom: -10px;
|
||||
margin-right: 24px;
|
||||
}
|
||||
|
||||
.easy__item--thr p {
|
||||
@@ -342,30 +455,71 @@ b {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.easy__arrow {
|
||||
scale: 1.4;
|
||||
}
|
||||
}
|
||||
|
||||
.easy__arrow--fir {
|
||||
top: 46%;
|
||||
right: 101%;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.easy__arrow--fir {
|
||||
right: 104%;
|
||||
top: 34%;
|
||||
}
|
||||
}
|
||||
|
||||
.easy__arrow--sec {
|
||||
top: 117%;
|
||||
left: 30%;
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.easy__arrow--sec {
|
||||
left: 46%;
|
||||
top: 124%;
|
||||
}
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.chatterbox {
|
||||
margin-bottom: 160px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.chatterbox {
|
||||
margin-bottom: 180px;
|
||||
}
|
||||
}
|
||||
|
||||
.chatterbox__slider {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.chatterbox__slider {
|
||||
max-width: 1640px;
|
||||
}
|
||||
}
|
||||
|
||||
.chatterbox__slide {
|
||||
width: 335px;
|
||||
height: 615px;
|
||||
@@ -375,6 +529,14 @@ b {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.chatterbox__slide {
|
||||
width: 456px;
|
||||
height: 836px;
|
||||
background-size: 456px 836px;
|
||||
}
|
||||
}
|
||||
|
||||
.chatterbox__slide.loaded video {
|
||||
opacity: 1;
|
||||
}
|
||||
@@ -407,6 +569,12 @@ b {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.chatterbox__wrap {
|
||||
border-radius: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
.chatterbox__vbtn {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
@@ -434,6 +602,13 @@ b {
|
||||
transition: opacity 100ms linear;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.chatterbox__vbtn::before {
|
||||
width: 109px;
|
||||
height: 109px;
|
||||
}
|
||||
}
|
||||
|
||||
.chatterbox__vbtn::before, .chatterbox__vbtn::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
@@ -451,6 +626,13 @@ b {
|
||||
margin-left: 2px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.chatterbox__vbtn::after {
|
||||
border-width: 23px 0 23px 35px;
|
||||
margin-left: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.chatterbox__vbox {
|
||||
position: relative;
|
||||
display: flex;
|
||||
@@ -459,6 +641,12 @@ b {
|
||||
height: 600px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.chatterbox__vbox {
|
||||
height: 827px;
|
||||
}
|
||||
}
|
||||
|
||||
.chatterbox .title {
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
@@ -490,12 +678,25 @@ b {
|
||||
margin-bottom: 123px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.use {
|
||||
margin-bottom: 184px;
|
||||
}
|
||||
}
|
||||
|
||||
.use__img {
|
||||
width: 67.5%;
|
||||
margin-left: 16px;
|
||||
margin-bottom: 31px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.use__img {
|
||||
width: 50.2%;
|
||||
margin-left: 27px;
|
||||
}
|
||||
}
|
||||
|
||||
.use__btn {
|
||||
margin-bottom: 11px;
|
||||
}
|
||||
@@ -512,21 +713,22 @@ b {
|
||||
margin-bottom: 49px;
|
||||
}
|
||||
|
||||
.use--diff .title {
|
||||
width: 60%;
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
.use--diff .use__img {
|
||||
width: 100%;
|
||||
margin-left: 0;
|
||||
margin-bottom: 17px;
|
||||
@media (min-width: 1720px) {
|
||||
.use .title {
|
||||
max-width: 40%;
|
||||
}
|
||||
}
|
||||
|
||||
.use--lett {
|
||||
margin-bottom: 120px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.use--lett {
|
||||
margin-bottom: 140px;
|
||||
}
|
||||
}
|
||||
|
||||
.use--lett .title {
|
||||
margin-bottom: 51px;
|
||||
}
|
||||
@@ -538,6 +740,172 @@ b {
|
||||
width: 1290px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.use--lett .use__img {
|
||||
width: initial;
|
||||
}
|
||||
}
|
||||
|
||||
.diff {
|
||||
margin-bottom: 166px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.diff {
|
||||
margin-bottom: 172px;
|
||||
}
|
||||
}
|
||||
|
||||
.diff .title {
|
||||
width: 60%;
|
||||
margin-bottom: 65px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.diff .title {
|
||||
width: 49%;
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
}
|
||||
|
||||
.diff__grid {
|
||||
display: flex;
|
||||
position: relative;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.diff__grid::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
height: 96%;
|
||||
width: 5px;
|
||||
border-radius: 5px;
|
||||
background-color: #EDEDED;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.diff__coll {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.diff__coll.left {
|
||||
margin-right: 29px;
|
||||
}
|
||||
|
||||
.diff__coll.left .diff__coll-title {
|
||||
padding-left: 39px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.diff__coll.left .diff__coll-title {
|
||||
padding-left: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.diff__coll.right {
|
||||
margin-left: 29px;
|
||||
}
|
||||
|
||||
.diff__coll.right .diff__coll-title {
|
||||
padding-right: 39px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.diff__coll.right .diff__coll-title {
|
||||
padding-right: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.diff__coll-title {
|
||||
margin-bottom: 38px;
|
||||
}
|
||||
|
||||
.diff__item {
|
||||
position: relative;
|
||||
text-align: left;
|
||||
padding-left: 10px;
|
||||
padding-top: 11px;
|
||||
padding-bottom: 11px;
|
||||
display: flex;
|
||||
gap: 11px;
|
||||
align-items: center;
|
||||
background-color: #FFFFFF;
|
||||
border-radius: 15px;
|
||||
font-weight: 500;
|
||||
font-size: 20px;
|
||||
line-height: 28px;
|
||||
margin-bottom: 35px;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.diff__item {
|
||||
padding-top: 22px;
|
||||
padding-bottom: 20px;
|
||||
padding-left: 27px;
|
||||
gap: 20px;
|
||||
margin-bottom: 38px;
|
||||
}
|
||||
}
|
||||
|
||||
.diff__item:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.diff__item:hover .diff__status::before {
|
||||
scale: 1.2;
|
||||
}
|
||||
|
||||
.diff__status {
|
||||
position: relative;
|
||||
height: 48px;
|
||||
width: 48px;
|
||||
border-radius: 5px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.diff__status {
|
||||
border-radius: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.diff__status::before {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
transform-origin: 0% 15%;
|
||||
}
|
||||
|
||||
.diff__status::before {
|
||||
content: '';
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
}
|
||||
|
||||
.diff__item--done .diff__status {
|
||||
background-color: #CCF9D9;
|
||||
}
|
||||
|
||||
.diff__item--done .diff__status::before {
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjYiIGhlaWdodD0iMjYiIHZpZXdCb3g9IjAgMCAyNiAyNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI0IDJMOS4zMzMzMyAyNEwyIDEzLjAwMDUiIHN0cm9rZT0iIzQ1QzIyNiIgc3Ryb2tlLXdpZHRoPSI0IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==);
|
||||
}
|
||||
|
||||
.diff__item--error .diff__status {
|
||||
background-color: #F9CCCC;
|
||||
}
|
||||
|
||||
.diff__item--error .diff__status::before {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzNiAzNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI4LjEyNSA3Ljg3NUw3Ljg3NSAyOC4xMjUiIHN0cm9rZT0iI0ZGMDAwMCIgc3Ryb2tlLXdpZHRoPSI0IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTI4LjEyNSAyOC4xMjVMNy44NzUgNy44NzUiIHN0cm9rZT0iI0ZGMDAwMCIgc3Ryb2tlLXdpZHRoPSI0IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==);
|
||||
}
|
||||
|
||||
.animate {
|
||||
padding: 60px 40px 49px;
|
||||
opacity: 0;
|
||||
@@ -547,6 +915,14 @@ b {
|
||||
margin-bottom: 160px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.animate {
|
||||
padding-top: 100px;
|
||||
padding-bottom: 89px;
|
||||
margin-bottom: 180px;
|
||||
}
|
||||
}
|
||||
|
||||
.animate.left {
|
||||
transform: translateX(-180px);
|
||||
}
|
||||
@@ -555,6 +931,12 @@ b {
|
||||
transform: translateX(180px);
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.animate.right .title {
|
||||
max-width: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
.animate__link {
|
||||
color: var(--color-orange);
|
||||
text-decoration: underline !important;
|
||||
@@ -566,19 +948,45 @@ b {
|
||||
/*width: 90%;*/
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.animate .title {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.animate .subtitle {
|
||||
width: 47%;
|
||||
margin: 0 auto 23px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.animate .subtitle {
|
||||
line-height: 26px;
|
||||
letter-spacing: 0.1px;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.about {
|
||||
margin-bottom: 168px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.about {
|
||||
margin-bottom: 188px;
|
||||
}
|
||||
}
|
||||
|
||||
.about .title {
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.about .title {
|
||||
margin-bottom: 49px;
|
||||
}
|
||||
}
|
||||
|
||||
.about__grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
@@ -587,16 +995,29 @@ b {
|
||||
.about__img {
|
||||
box-shadow: inset 18.19px 1.21px 18.19px 0 #FFFFFFCC, inset -18.19px -1.21px 18.19px 0 #4052801A, 48.5px 36.38px 36.38px 0 #6B7F9933;
|
||||
border-radius: 31px;
|
||||
margin-left: 8px;
|
||||
margin-left: -20px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.about__img {
|
||||
margin-top: 19px;
|
||||
}
|
||||
}
|
||||
|
||||
.about__right {
|
||||
text-align: left;
|
||||
padding-top: 43px;
|
||||
padding-left: 50px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.about__right {
|
||||
padding-top: 90px;
|
||||
padding-left: 21px;
|
||||
}
|
||||
}
|
||||
|
||||
.about__half {
|
||||
max-width: 50%;
|
||||
float: left;
|
||||
@@ -611,10 +1032,29 @@ b {
|
||||
letter-spacing: 0.4px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.about b {
|
||||
font-weight: 700;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.about p {
|
||||
margin-bottom: 39px;
|
||||
}
|
||||
}
|
||||
|
||||
.benefits {
|
||||
margin-bottom: 132px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.benefits {
|
||||
margin-bottom: 147px;
|
||||
}
|
||||
}
|
||||
|
||||
.benefits__grid {
|
||||
text-align: left;
|
||||
display: grid;
|
||||
@@ -627,24 +1067,61 @@ b {
|
||||
margin-bottom: 22px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.benefits__item {
|
||||
min-height: 145px;
|
||||
}
|
||||
}
|
||||
|
||||
.benefits__third {
|
||||
padding-left: 16px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.benefits__third {
|
||||
padding-left: 31px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.benefits .title {
|
||||
margin-bottom: 76px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.benefits .title {
|
||||
margin-bottom: 93px;
|
||||
}
|
||||
}
|
||||
|
||||
.benefits img {
|
||||
position: relative;
|
||||
top: 14px;
|
||||
right: -11px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.benefits img {
|
||||
top: -33px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.benefits h2 {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.uses {
|
||||
margin-bottom: 122px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.uses {
|
||||
margin-bottom: 136px;
|
||||
}
|
||||
}
|
||||
|
||||
.uses__grid {
|
||||
text-align: left;
|
||||
display: grid;
|
||||
@@ -659,10 +1136,24 @@ b {
|
||||
padding: 0 50px 0 2px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.uses__item {
|
||||
margin-bottom: 22px;
|
||||
}
|
||||
}
|
||||
|
||||
.uses__icon {
|
||||
margin-bottom: 11px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.uses__icon {
|
||||
width: 147px;
|
||||
height: 147px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.uses .title {
|
||||
max-width: 50%;
|
||||
margin: 0 auto 60px;
|
||||
@@ -672,22 +1163,54 @@ b {
|
||||
margin-bottom: 160px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.sore {
|
||||
margin-bottom: 178px;
|
||||
}
|
||||
}
|
||||
|
||||
.sore__img {
|
||||
margin: 0 auto 26px;
|
||||
position: relative;
|
||||
left: -17px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.sore__img {
|
||||
margin-bottom: 46px;
|
||||
}
|
||||
}
|
||||
|
||||
.sore .title {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.sore .title {
|
||||
margin-bottom: 61px;
|
||||
}
|
||||
}
|
||||
|
||||
.sore .subtitle {
|
||||
max-width: 62%;
|
||||
margin: 0 auto -1px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.sore .subtitle {
|
||||
line-height: 26px;
|
||||
max-width: 60%;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.sore .h3 {
|
||||
max-width: 47%;
|
||||
margin: 0 auto 19px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.sore .h3 {
|
||||
max-width: 38%;
|
||||
}
|
||||
}
|
||||
|
||||
77
static/css/moover/about.css
Normal file
77
static/css/moover/about.css
Normal file
@@ -0,0 +1,77 @@
|
||||
.about {
|
||||
margin-bottom: 168px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.about {
|
||||
margin-bottom: 188px;
|
||||
}
|
||||
}
|
||||
|
||||
.about .title {
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.about .title {
|
||||
margin-bottom: 49px;
|
||||
}
|
||||
}
|
||||
|
||||
.about__grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
}
|
||||
|
||||
.about__img {
|
||||
box-shadow: inset 18.19px 1.21px 18.19px 0 #FFFFFFCC, inset -18.19px -1.21px 18.19px 0 #4052801A, 48.5px 36.38px 36.38px 0 #6B7F9933;
|
||||
border-radius: 31px;
|
||||
margin-left: -20px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.about__img {
|
||||
margin-top: 19px;
|
||||
}
|
||||
}
|
||||
|
||||
.about__right {
|
||||
text-align: left;
|
||||
padding-top: 43px;
|
||||
padding-left: 50px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.about__right {
|
||||
padding-top: 90px;
|
||||
padding-left: 21px;
|
||||
}
|
||||
}
|
||||
|
||||
.about__half {
|
||||
max-width: 50%;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.about__half:last-child {
|
||||
padding-left: 16px;
|
||||
max-width: 47%;
|
||||
}
|
||||
|
||||
.about b {
|
||||
letter-spacing: 0.4px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.about b {
|
||||
font-weight: 700;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.about p {
|
||||
margin-bottom: 39px;
|
||||
}
|
||||
}
|
||||
28
static/css/moover/animate.css
vendored
28
static/css/moover/animate.css
vendored
@@ -7,6 +7,14 @@
|
||||
margin-bottom: 160px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.animate {
|
||||
padding-top: 100px;
|
||||
padding-bottom: 89px;
|
||||
margin-bottom: 180px;
|
||||
}
|
||||
}
|
||||
|
||||
.animate.left {
|
||||
transform: translateX(-180px);
|
||||
}
|
||||
@@ -15,6 +23,12 @@
|
||||
transform: translateX(180px);
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.animate.right .title {
|
||||
max-width: 80%;
|
||||
}
|
||||
}
|
||||
|
||||
.animate__link {
|
||||
color: var(--color-orange);
|
||||
text-decoration: underline !important;
|
||||
@@ -26,7 +40,21 @@
|
||||
/*width: 90%;*/
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.animate .title {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.animate .subtitle {
|
||||
width: 47%;
|
||||
margin: 0 auto 23px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.animate .subtitle {
|
||||
line-height: 26px;
|
||||
letter-spacing: 0.1px;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2,6 +2,12 @@
|
||||
margin-bottom: 132px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.benefits {
|
||||
margin-bottom: 147px;
|
||||
}
|
||||
}
|
||||
|
||||
.benefits__grid {
|
||||
text-align: left;
|
||||
display: grid;
|
||||
@@ -14,16 +20,47 @@
|
||||
margin-bottom: 22px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.benefits__item {
|
||||
min-height: 145px;
|
||||
}
|
||||
}
|
||||
|
||||
.benefits__third {
|
||||
padding-left: 16px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.benefits__third {
|
||||
padding-left: 31px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.benefits .title {
|
||||
margin-bottom: 76px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.benefits .title {
|
||||
margin-bottom: 93px;
|
||||
}
|
||||
}
|
||||
|
||||
.benefits img {
|
||||
position: relative;
|
||||
top: 14px;
|
||||
right: -11px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.benefits img {
|
||||
top: -33px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.benefits h2 {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
58
static/css/moover/cards.css
Normal file
58
static/css/moover/cards.css
Normal file
@@ -0,0 +1,58 @@
|
||||
.cards__list {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
}
|
||||
|
||||
.cards__item {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.cards__img:hover {
|
||||
scale: 1.05;
|
||||
transition: scale 0.15s linear;
|
||||
}
|
||||
|
||||
.cards__img {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.cards__img {
|
||||
width: 100%;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.cards__desc {
|
||||
font-weight: 500;
|
||||
line-height: 22px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.cards__desc {
|
||||
font-size: 20px;
|
||||
line-height: 26px;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.cards__desc a {
|
||||
color: var(--color-orange);
|
||||
}
|
||||
|
||||
.cards__arrow {
|
||||
width: 62px;
|
||||
height: 20px;
|
||||
position: absolute;
|
||||
right: -30px;
|
||||
top: -21px;
|
||||
background-image: url("/static/img/svg/Arrow23.svg");
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.cards__arrow {
|
||||
right: -45px;
|
||||
top: -29px;
|
||||
}
|
||||
}
|
||||
@@ -2,11 +2,23 @@
|
||||
margin-bottom: 160px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.chatterbox {
|
||||
margin-bottom: 180px;
|
||||
}
|
||||
}
|
||||
|
||||
.chatterbox__slider {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.chatterbox__slider {
|
||||
max-width: 1640px;
|
||||
}
|
||||
}
|
||||
|
||||
.chatterbox__slide {
|
||||
width: 335px;
|
||||
height: 615px;
|
||||
@@ -16,6 +28,14 @@
|
||||
position: relative;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.chatterbox__slide {
|
||||
width: 456px;
|
||||
height: 836px;
|
||||
background-size: 456px 836px;
|
||||
}
|
||||
}
|
||||
|
||||
.chatterbox__slide.loaded video {
|
||||
opacity: 1;
|
||||
}
|
||||
@@ -48,6 +68,12 @@
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.chatterbox__wrap {
|
||||
border-radius: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
.chatterbox__vbtn {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
@@ -75,6 +101,13 @@
|
||||
transition: opacity 100ms linear;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.chatterbox__vbtn::before {
|
||||
width: 109px;
|
||||
height: 109px;
|
||||
}
|
||||
}
|
||||
|
||||
.chatterbox__vbtn::before, .chatterbox__vbtn::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
@@ -92,6 +125,13 @@
|
||||
margin-left: 2px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.chatterbox__vbtn::after {
|
||||
border-width: 23px 0 23px 35px;
|
||||
margin-left: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.chatterbox__vbox {
|
||||
position: relative;
|
||||
display: flex;
|
||||
@@ -100,6 +140,12 @@
|
||||
height: 600px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.chatterbox__vbox {
|
||||
height: 827px;
|
||||
}
|
||||
}
|
||||
|
||||
.chatterbox .title {
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
159
static/css/moover/diff.css
Normal file
159
static/css/moover/diff.css
Normal file
@@ -0,0 +1,159 @@
|
||||
.diff {
|
||||
margin-bottom: 166px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.diff {
|
||||
margin-bottom: 172px;
|
||||
}
|
||||
}
|
||||
|
||||
.diff .title {
|
||||
width: 60%;
|
||||
margin-bottom: 65px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.diff .title {
|
||||
width: 49%;
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
}
|
||||
|
||||
.diff__grid {
|
||||
display: flex;
|
||||
position: relative;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.diff__grid::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
height: 96%;
|
||||
width: 5px;
|
||||
border-radius: 5px;
|
||||
background-color: #EDEDED;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.diff__coll {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.diff__coll.left {
|
||||
margin-right: 29px;
|
||||
}
|
||||
|
||||
.diff__coll.left .diff__coll-title {
|
||||
padding-left: 39px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.diff__coll.left .diff__coll-title {
|
||||
padding-left: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.diff__coll.right {
|
||||
margin-left: 29px;
|
||||
}
|
||||
|
||||
.diff__coll.right .diff__coll-title {
|
||||
padding-right: 39px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.diff__coll.right .diff__coll-title {
|
||||
padding-right: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.diff__coll-title {
|
||||
margin-bottom: 38px;
|
||||
}
|
||||
|
||||
.diff__item {
|
||||
position: relative;
|
||||
text-align: left;
|
||||
padding-left: 10px;
|
||||
padding-top: 11px;
|
||||
padding-bottom: 11px;
|
||||
display: flex;
|
||||
gap: 11px;
|
||||
align-items: center;
|
||||
background-color: #FFFFFF;
|
||||
border-radius: 15px;
|
||||
font-weight: 500;
|
||||
font-size: 20px;
|
||||
line-height: 28px;
|
||||
margin-bottom: 35px;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.diff__item {
|
||||
padding-top: 22px;
|
||||
padding-bottom: 20px;
|
||||
padding-left: 27px;
|
||||
gap: 20px;
|
||||
margin-bottom: 38px;
|
||||
}
|
||||
}
|
||||
|
||||
.diff__item:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.diff__item:hover .diff__status::before {
|
||||
scale: 1.2;
|
||||
}
|
||||
|
||||
.diff__status {
|
||||
position: relative;
|
||||
height: 48px;
|
||||
width: 48px;
|
||||
border-radius: 5px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.diff__status {
|
||||
border-radius: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
.diff__status::before {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
transform-origin: 0% 15%;
|
||||
}
|
||||
|
||||
.diff__status::before {
|
||||
content: '';
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
}
|
||||
|
||||
.diff__item--done .diff__status {
|
||||
background-color: #CCF9D9;
|
||||
}
|
||||
|
||||
.diff__item--done .diff__status::before {
|
||||
width: 26px;
|
||||
height: 26px;
|
||||
background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjYiIGhlaWdodD0iMjYiIHZpZXdCb3g9IjAgMCAyNiAyNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI0IDJMOS4zMzMzMyAyNEwyIDEzLjAwMDUiIHN0cm9rZT0iIzQ1QzIyNiIgc3Ryb2tlLXdpZHRoPSI0IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==);
|
||||
}
|
||||
|
||||
.diff__item--error .diff__status {
|
||||
background-color: #F9CCCC;
|
||||
}
|
||||
|
||||
.diff__item--error .diff__status::before {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzNiAzNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTI4LjEyNSA3Ljg3NUw3Ljg3NSAyOC4xMjUiIHN0cm9rZT0iI0ZGMDAwMCIgc3Ryb2tlLXdpZHRoPSI0IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPHBhdGggZD0iTTI4LjEyNSAyOC4xMjVMNy44NzUgNy44NzUiIHN0cm9rZT0iI0ZGMDAwMCIgc3Ryb2tlLXdpZHRoPSI0IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==);
|
||||
}
|
||||
172
static/css/moover/easy.css
Normal file
172
static/css/moover/easy.css
Normal file
@@ -0,0 +1,172 @@
|
||||
.easy {
|
||||
margin-bottom: 162px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.easy {
|
||||
margin-bottom: 180px;
|
||||
}
|
||||
}
|
||||
|
||||
.easy .title {
|
||||
max-width: 55%;
|
||||
margin-bottom: 21px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.easy .title {
|
||||
max-width: 45%;
|
||||
margin-bottom: 23px;
|
||||
}
|
||||
}
|
||||
|
||||
.easy .subtitle {
|
||||
margin-bottom: 41px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.easy .subtitle {
|
||||
margin-bottom: 59px;
|
||||
}
|
||||
}
|
||||
|
||||
.easy__grid {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-template-rows: repeat(2, minmax(186px, auto));
|
||||
grid-template-areas: 'a b' 'a c';
|
||||
grid-column-gap: 20px;
|
||||
grid-row-gap: 80px;
|
||||
margin-bottom: 46px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.easy__grid {
|
||||
grid-column-gap: 147px;
|
||||
grid-template-rows: repeat(2, minmax(245px, auto));
|
||||
grid-row-gap: 136px;
|
||||
margin-bottom: 63px;
|
||||
}
|
||||
}
|
||||
|
||||
.easy__item {
|
||||
border-radius: 30px;
|
||||
background-color: var(--color-grey);
|
||||
/*background-color: #a72525;*/
|
||||
text-align: left;
|
||||
padding: 21px;
|
||||
box-shadow: var(--box-shadow-primary);
|
||||
}
|
||||
|
||||
.easy__item--fir {
|
||||
grid-area: a;
|
||||
margin-right: 60px;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.easy__item--fir {
|
||||
margin-right: -10px;
|
||||
margin-left: 7px;
|
||||
padding-top: 31px;
|
||||
}
|
||||
}
|
||||
|
||||
.easy__item--fir p {
|
||||
width: 93%;
|
||||
margin-bottom: 29px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.easy__item--fir p {
|
||||
width: 89%;
|
||||
margin-bottom: 53px;
|
||||
}
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
|
||||
.easy__item--sec img {
|
||||
margin-bottom: -10px;
|
||||
margin-right: -5px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.easy__item--sec img {
|
||||
margin-right: -12px;
|
||||
}
|
||||
}
|
||||
|
||||
.easy__item--thr img {
|
||||
margin-bottom: -10px;
|
||||
margin-right: 24px;
|
||||
}
|
||||
|
||||
.easy__item--thr p {
|
||||
max-width: 50%;
|
||||
}
|
||||
|
||||
.easy__arrow {
|
||||
width: 68px;
|
||||
height: 18px;
|
||||
background-image: url("/static/img/svg/Arrow08.svg");
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.easy__arrow {
|
||||
scale: 1.4;
|
||||
}
|
||||
}
|
||||
|
||||
.easy__arrow--fir {
|
||||
top: 46%;
|
||||
right: 101%;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.easy__arrow--fir {
|
||||
right: 104%;
|
||||
top: 34%;
|
||||
}
|
||||
}
|
||||
|
||||
.easy__arrow--sec {
|
||||
top: 117%;
|
||||
left: 30%;
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.easy__arrow--sec {
|
||||
left: 46%;
|
||||
top: 124%;
|
||||
}
|
||||
}
|
||||
|
||||
.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;
|
||||
}
|
||||
@@ -6,6 +6,7 @@
|
||||
.presentation {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
margin-bottom: 160px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -17,7 +18,7 @@
|
||||
background-image: url(/static/img/png/Box9.png), url(/static/img/png/Box10.png), url(/static/img/png/Box11.png), url(/static/img/png/Box12.png);
|
||||
background-position: top -4px left 46px, top -30px right -14px, bottom 73px left 278px, bottom 71px right 276px;
|
||||
background-repeat: no-repeat, no-repeat, no-repeat, no-repeat;
|
||||
background-size: 17.5%,21.8%,8.5%,8.8%;
|
||||
background-size: 17.5%, 21.8%, 8.5%, 8.8%;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
@@ -53,6 +54,23 @@
|
||||
animation: jump 2s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.presentation__cards {
|
||||
max-width: 1300px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.presentation__cards {
|
||||
max-width: initial;
|
||||
margin-left: -10px;
|
||||
margin-right: -10px;
|
||||
}
|
||||
}
|
||||
|
||||
.presentation__bottom .presentation__title {
|
||||
margin-bottom: 13px;
|
||||
}
|
||||
|
||||
@keyframes jump {
|
||||
0% {
|
||||
transform: translateY(0px);
|
||||
@@ -73,12 +91,3 @@
|
||||
transform: translateY(0px);
|
||||
}
|
||||
}
|
||||
|
||||
.presentation__bottom .presentation__title {
|
||||
margin-bottom: 13px;
|
||||
}
|
||||
|
||||
.presentation__cards {
|
||||
max-width: 1300px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@@ -58,6 +58,13 @@ h2, .h2 {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
h2, .h2 {
|
||||
font-size: 28px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
h3, .h3 {
|
||||
font-size: 20px;
|
||||
line-height: 28px;
|
||||
@@ -75,6 +82,13 @@ p {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
p {
|
||||
font-size: 20px;
|
||||
line-height: 26px;
|
||||
}
|
||||
}
|
||||
|
||||
b {
|
||||
font-weight: 500;
|
||||
}
|
||||
@@ -109,7 +123,7 @@ b {
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.title {
|
||||
font-size: 44px;
|
||||
font-size: 48px;
|
||||
margin-bottom: 22px;
|
||||
}
|
||||
}
|
||||
@@ -122,7 +136,7 @@ b {
|
||||
@media (min-width: 1720px) {
|
||||
.subtitle {
|
||||
font-size: 20px;
|
||||
margin-bottom: 97px;
|
||||
margin-bottom: 105px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -130,8 +144,31 @@ b {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.hide__xxl {
|
||||
display: block;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.hide__xxl {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.show__xxl {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.show__xxl {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1440px) {
|
||||
.is-container.wrapper_main {
|
||||
max-width: initial;
|
||||
}
|
||||
.br--xxl {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2,22 +2,54 @@
|
||||
margin-bottom: 160px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.sore {
|
||||
margin-bottom: 178px;
|
||||
}
|
||||
}
|
||||
|
||||
.sore__img {
|
||||
margin: 0 auto 26px;
|
||||
position: relative;
|
||||
left: -17px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.sore__img {
|
||||
margin-bottom: 46px;
|
||||
}
|
||||
}
|
||||
|
||||
.sore .title {
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.sore .title {
|
||||
margin-bottom: 61px;
|
||||
}
|
||||
}
|
||||
|
||||
.sore .subtitle {
|
||||
max-width: 62%;
|
||||
margin: 0 auto -1px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.sore .subtitle {
|
||||
line-height: 26px;
|
||||
max-width: 60%;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.sore .h3 {
|
||||
max-width: 47%;
|
||||
margin: 0 auto 19px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.sore .h3 {
|
||||
max-width: 38%;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2,12 +2,25 @@
|
||||
margin-bottom: 123px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.use {
|
||||
margin-bottom: 184px;
|
||||
}
|
||||
}
|
||||
|
||||
.use__img {
|
||||
width: 67.5%;
|
||||
margin-left: 16px;
|
||||
margin-bottom: 31px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.use__img {
|
||||
width: 50.2%;
|
||||
margin-left: 27px;
|
||||
}
|
||||
}
|
||||
|
||||
.use__btn {
|
||||
margin-bottom: 11px;
|
||||
}
|
||||
@@ -24,21 +37,22 @@
|
||||
margin-bottom: 49px;
|
||||
}
|
||||
|
||||
.use--diff .title {
|
||||
width: 60%;
|
||||
margin-bottom: 60px;
|
||||
}
|
||||
|
||||
.use--diff .use__img {
|
||||
width: 100%;
|
||||
margin-left: 0;
|
||||
margin-bottom: 17px;
|
||||
@media (min-width: 1720px) {
|
||||
.use .title {
|
||||
max-width: 40%;
|
||||
}
|
||||
}
|
||||
|
||||
.use--lett {
|
||||
margin-bottom: 120px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.use--lett {
|
||||
margin-bottom: 140px;
|
||||
}
|
||||
}
|
||||
|
||||
.use--lett .title {
|
||||
margin-bottom: 51px;
|
||||
}
|
||||
@@ -49,3 +63,9 @@
|
||||
max-width: 110%;
|
||||
width: 1290px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.use--lett .use__img {
|
||||
width: initial;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2,6 +2,12 @@
|
||||
margin-bottom: 122px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.uses {
|
||||
margin-bottom: 136px;
|
||||
}
|
||||
}
|
||||
|
||||
.uses__grid {
|
||||
text-align: left;
|
||||
display: grid;
|
||||
@@ -16,10 +22,24 @@
|
||||
padding: 0 50px 0 2px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.uses__item {
|
||||
margin-bottom: 22px;
|
||||
}
|
||||
}
|
||||
|
||||
.uses__icon {
|
||||
margin-bottom: 11px;
|
||||
}
|
||||
|
||||
@media (min-width: 1720px) {
|
||||
.uses__icon {
|
||||
width: 147px;
|
||||
height: 147px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.uses .title {
|
||||
max-width: 50%;
|
||||
margin: 0 auto 60px;
|
||||
|
||||
BIN
static/img/png/about-1920.png
Normal file
BIN
static/img/png/about-1920.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 128 KiB |
BIN
static/img/png/benefits-1920.png
Normal file
BIN
static/img/png/benefits-1920.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 257 KiB |
BIN
static/img/png/sender-card1.png
Normal file
BIN
static/img/png/sender-card1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 141 KiB |
BIN
static/img/png/sender-card2.png
Normal file
BIN
static/img/png/sender-card2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 80 KiB |
BIN
static/img/png/sender-card3.png
Normal file
BIN
static/img/png/sender-card3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 46 KiB |
BIN
static/img/png/sore-1920.png
Normal file
BIN
static/img/png/sore-1920.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 181 KiB |
|
Before Width: | Height: | Size: 42 KiB After Width: | Height: | Size: 42 KiB |
BIN
static/img/png/use-letters-1920.png
Normal file
BIN
static/img/png/use-letters-1920.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 622 KiB |
Reference in New Issue
Block a user