Skip to content

L
landing_pages
Commit a63373a8 by Iren
Options

Add section "protection"

parent 834c2017
Showing with 222 additions and 31 deletions
css/styles.css
...@@ -198,12 +198,14 @@ header { ...@@ -198,12 +198,14 @@ header {
align-items: stretch; align-items: stretch;
width: 33%; width: 33%;
padding-top: 10px; padding-top: 10px;
padding-right: 10%;
height: auto; height: auto;
} }
@media (max-width: 576px) { @media (max-width: 576px) {
.main-card { .main-card {
flex-flow: nowrap; flex-flow: nowrap;
width: 100%; width: 100%;
padding-right: 0;
} }
} }
.main-img { .main-img {
...@@ -230,19 +232,20 @@ header { ...@@ -230,19 +232,20 @@ header {
} }
/*advertising*/ /*advertising*/
.advertising-background { .advertising-background {
background-image: url("../img/background.jpg"); background-image: url("../img/Прямоугольник_6_копия_5@3x.jpg");
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
background-position: center center; background-position: center center;
padding-top: 75px; padding-top: 75px;
margin-bottom: 95px; padding-bottom: 170px;
margin-bottom: 75px;
} }
@media (max-width: 576px) { @media (max-width: 576px) {
.advertising-background { .advertising-background {
padding-top: 45px; padding-top: 45px;
padding-bottom: 20px; padding-bottom: 20px;
margin-bottom: 50px; margin-bottom: 50px;
background-image: url("../img/Прямоугольник_6_копия_5.jpg"); background-image: url("../img/background-optuon-modal.jpg");
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
background-position: center center; background-position: center center;
...@@ -268,8 +271,9 @@ header { ...@@ -268,8 +271,9 @@ header {
letter-spacing: 0.36px; letter-spacing: 0.36px;
max-width: 803px; max-width: 803px;
margin-top: 110px; margin-top: 110px;
margin-bottom: 15px; margin-bottom: 31px;
line-height: 36px; line-height: 36px;
font-weight: 800;
} }
@media (max-width: 576px) { @media (max-width: 576px) {
.advertising-text-order h2 { .advertising-text-order h2 {
...@@ -305,6 +309,12 @@ header { ...@@ -305,6 +309,12 @@ header {
width: 100%; width: 100%;
} }
} }
.advertising-text .main-line {
margin-bottom: 24px;
}
.advertising-text-order .main-line {
margin-bottom: 24px;
}
.advertising-img-order { .advertising-img-order {
padding-top: 45px; padding-top: 45px;
width: 50%; width: 50%;
...@@ -344,8 +354,9 @@ header { ...@@ -344,8 +354,9 @@ header {
letter-spacing: 0.36px; letter-spacing: 0.36px;
max-width: 803px; max-width: 803px;
margin-top: 110px; margin-top: 110px;
margin-bottom: 15px; margin-bottom: 31px;
line-height: 36px; line-height: 36px;
font-weight: 800;
} }
@media (max-width: 576px) { @media (max-width: 576px) {
.advertising-text h2 { .advertising-text h2 {
...@@ -415,6 +426,7 @@ header { ...@@ -415,6 +426,7 @@ header {
letter-spacing: 0.36px; letter-spacing: 0.36px;
max-width: 803px; max-width: 803px;
font-weight: 800; font-weight: 800;
margin-bottom: 0;
} }
@media (max-width: 576px) { @media (max-width: 576px) {
.option h2 { .option h2 {
...@@ -436,7 +448,7 @@ header { ...@@ -436,7 +448,7 @@ header {
.option-container { .option-container {
position: relative; position: relative;
display: flex; display: flex;
margin-top: 76px; margin-top: 46px;
justify-content: space-around; justify-content: space-around;
align-items: baseline; align-items: baseline;
} }
...@@ -475,6 +487,8 @@ header { ...@@ -475,6 +487,8 @@ header {
font-weight: 300; font-weight: 300;
color: #303a81; color: #303a81;
letter-spacing: 0.16px; letter-spacing: 0.16px;
margin-bottom: 0;
margin-top: 6px;
} }
@media (max-width: 576px) { @media (max-width: 576px) {
.option-card-img p { .option-card-img p {
...@@ -496,11 +510,12 @@ header { ...@@ -496,11 +510,12 @@ header {
@media (max-width: 576px) { @media (max-width: 576px) {
.option-text { .option-text {
min-height: 145px; min-height: 145px;
margin-bottom: 15px;
} }
} }
.option-card-img-container { .option-card-img-container {
margin: 0 auto; margin: 0 auto;
max-width: 281px; /*max-width: 281px;*/
max-height: 284px; max-height: 284px;
} }
@media (max-width: 576px) { @media (max-width: 576px) {
...@@ -508,26 +523,67 @@ header { ...@@ -508,26 +523,67 @@ header {
max-width: 139px; max-width: 139px;
max-height: 139px; max-height: 139px;
} }
} .option-card-img-container img {
.option-card-img-container img { max-width: 140px;
max-width: 140px; }
} }
.option-card-line { .option-card-line {
position: absolute; position: absolute;
left: 50%; left: 50%;
top: 3%; top: 8%;
width: 105px; width: 105px;
height: 387px; height: 387px;
border-left: 1px solid gray; border-left: 1px solid gray;
transform: rotate(10deg); transform: rotate(15deg);
} }
@media (max-width: 576px) { @media (max-width: 576px) {
.option-card-line { .option-card-line {
position: absolute; position: absolute;
width: 2px; width: 2px;
height: 353px; height: 343px;
transform: rotate(0deg); transform: rotate(0deg);
left: 155px; left: 50%;
top: 2%;
}
}
.option-btn {
margin-top: 0!important;
}
/**/
.protection-background {
background-image: url("../img/Прямоугольник_6_копия_5@3x.jpg");
background-repeat: no-repeat;
background-size: 100% 100%;
background-position: center center;
}
@media (max-width: 576px) {
.protection-background {
padding-top: 51px;
}
}
.protection {
display: flex;
flex-direction: row;
}
.protection-img {
width: 100%;
}
@media (max-width: 576px) {
.protection-img img {
width: 70px;
height: 70px;
margin-bottom: 0;
margin-right: 16px;
}
}
.protection-text {
height: 150px;
}
@media (max-width: 576px) {
.protection-text {
height: auto;
margin-bottom: 10px;
min-width: 216px;
} }
} }
/*# sourceMappingURL=styles.css.map */ /*# sourceMappingURL=styles.css.map */
\ No newline at end of file
css/styles.css.map
{"version":3,"sources":["styles.less"],"names":[],"mappings":"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","file":"styles.css"} {"version":3,"sources":["styles.less"],"names":[],"mappings":"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","file":"styles.css"}
\ No newline at end of file \ No newline at end of file
css/styles.less
...@@ -184,10 +184,12 @@ header { ...@@ -184,10 +184,12 @@ header {
align-items: stretch; align-items: stretch;
width: 33%; width: 33%;
padding-top: 10px; padding-top: 10px;
padding-right: 10%;
height: auto; height: auto;
@media (max-width: 576px) { @media (max-width: 576px) {
flex-flow: nowrap; flex-flow: nowrap;
width: 100%; width: 100%;
padding-right: 0;
} }
} }
.main-img { .main-img {
...@@ -211,17 +213,18 @@ header { ...@@ -211,17 +213,18 @@ header {
} }
/*advertising*/ /*advertising*/
.advertising-background { .advertising-background {
background-image: url("../img/background.jpg"); background-image: url("../img/Прямоугольник_6_копия_5@3x.jpg");
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
background-position: center center; background-position: center center;
padding-top: 75px; padding-top: 75px;
margin-bottom: 95px; padding-bottom: 170px;
margin-bottom: 75px;
@media (max-width: 576px) { @media (max-width: 576px) {
padding-top: 45px; padding-top: 45px;
padding-bottom: 20px; padding-bottom: 20px;
margin-bottom: 50px; margin-bottom: 50px;
background-image: url("../img/Прямоугольник_6_копия_5.jpg"); background-image: url("../img/background-optuon-modal.jpg");
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 100% 100%; background-size: 100% 100%;
background-position: center center; background-position: center center;
...@@ -238,8 +241,9 @@ header { ...@@ -238,8 +241,9 @@ header {
h2 { h2 {
.h2-desktop; .h2-desktop;
margin-top: 110px; margin-top: 110px;
margin-bottom: 15px; margin-bottom: 31px;
line-height: 36px; line-height: 36px;
font-weight: 800;
} }
p { p {
.text-h2-desktop; .text-h2-desktop;
...@@ -249,6 +253,12 @@ header { ...@@ -249,6 +253,12 @@ header {
width: 100%; width: 100%;
} }
} }
.advertising-text .main-line {
margin-bottom: 24px;
}
.advertising-text-order .main-line {
margin-bottom: 24px;
}
.advertising-img-order { .advertising-img-order {
padding-top: 45px; padding-top: 45px;
width: 50%; width: 50%;
...@@ -277,8 +287,9 @@ header { ...@@ -277,8 +287,9 @@ header {
h2 { h2 {
.h2-desktop; .h2-desktop;
margin-top: 110px; margin-top: 110px;
margin-bottom: 15px; margin-bottom: 31px;
line-height: 36px; line-height: 36px;
font-weight: 800;
} }
p { p {
.text-h2-desktop; .text-h2-desktop;
...@@ -313,6 +324,7 @@ header { ...@@ -313,6 +324,7 @@ header {
h2 { h2 {
.h2-desktop; .h2-desktop;
font-weight: 800; font-weight: 800;
margin-bottom: 0;
@media (max-width: 576px) { @media (max-width: 576px) {
margin-bottom: 15px; margin-bottom: 15px;
line-height: 24px; line-height: 24px;
...@@ -323,7 +335,7 @@ header { ...@@ -323,7 +335,7 @@ header {
.option-container { .option-container {
position: relative; position: relative;
display: flex; display: flex;
margin-top: 76px; margin-top: 46px;
justify-content: space-around; justify-content: space-around;
align-items: baseline; align-items: baseline;
@media (max-width: 576px) { @media (max-width: 576px) {
...@@ -357,6 +369,8 @@ header { ...@@ -357,6 +369,8 @@ header {
font-weight: 300; font-weight: 300;
color: #303a81; color: #303a81;
letter-spacing: 0.16px; letter-spacing: 0.16px;
margin-bottom: 0;
margin-top: 6px;
@media (max-width: 576px) { @media (max-width: 576px) {
font-size: 14px; font-size: 14px;
...@@ -374,34 +388,72 @@ header { ...@@ -374,34 +388,72 @@ header {
min-height: 75px; min-height: 75px;
@media (max-width: 576px) { @media (max-width: 576px) {
min-height: 145px; min-height: 145px;
margin-bottom: 15px;
} }
} }
.option-card-img-container { .option-card-img-container {
margin: 0 auto; margin: 0 auto;
max-width: 281px; /*max-width: 281px;*/
max-height: 284px; max-height: 284px;
@media (max-width: 576px) { @media (max-width: 576px) {
max-width: 139px; max-width: 139px;
max-height: 139px; max-height: 139px;
} img {
img {
max-width: 140px; max-width: 140px;
} }
}
} }
.option-card-line { .option-card-line {
position: absolute; position: absolute;
left: 50%; left: 50%;
top: 3%; top: 8%;
width: 105px; width: 105px;
height: 387px; height: 387px;
border-left: 1px solid gray; border-left: 1px solid gray;
transform: rotate(10deg); transform: rotate(15deg);
@media (max-width: 576px) { @media (max-width: 576px) {
position: absolute; position: absolute;
width: 2px; width: 2px;
height: 353px; height: 343px;
transform: rotate(0deg); transform: rotate(0deg);
left: 155px; left: 50%;
top: 2%;
}
}
.option-btn {
margin-top: 0!important;
}
/**/
.protection-background {
background-image: url("../img/Прямоугольник_6_копия_5@3x.jpg");
background-repeat: no-repeat;
background-size: 100% 100%;
background-position: center center;
@media (max-width: 576px) {
padding-top: 51px;
}
}
.protection {
display: flex;
flex-direction: row;
}
.protection-img {
width: 100%;
img {
@media (max-width: 576px) {
width: 70px;
height: 70px;
margin-bottom: 0;
margin-right: 16px;
} }
} }
}
.protection-text {
height: 150px;
@media (max-width: 576px) {
height: auto;
margin-bottom: 10px;
min-width: 216px;
}
}
index.html
...@@ -349,7 +349,7 @@ ...@@ -349,7 +349,7 @@
системы с использованием облачных технологий. системы с использованием облачных технологий.
</p> </p>
</div> </div>
<button type="button" class="main-btn">Заказать</button> <button type="button" class="main-btn option-btn">Заказать</button>
</div> </div>
<div class="option-card-line"> <div class="option-card-line">
</div> </div>
...@@ -363,7 +363,89 @@ ...@@ -363,7 +363,89 @@
системы с использованием облачных технологий. системы с использованием облачных технологий.
</p> </p>
</div> </div>
<button type="button" class="main-btn">Заказать</button> <button type="button" class="main-btn option-btn">Заказать</button>
</div>
</div>
</section>
<section class="protection-background">
<div class="main-container">
<h2 class="h2-desktop h2-desktop-tittle">Защита данных в облаке</h2>
<div class="main-line">
</div>
<p class="text-h2-desktop">
Используемая архитектура Single tenant позволяет оградить от рисков злонамеренной
или случайно гибели данных всех своих пользователей благодаря использованию
персональной архитектуры и, как следствие, минимизации рисков.
</p>
<div class="main-flex">
<div class="main-card">
<div class="protection-img">
<img src="img/protection6.png">
</div>
<div class="protection-text">
<h3 class="h3-desktop">Single tenant</h3>
<p class="text-h3-desktop">
Собственная архитектура для каждой системы
</p>
</div>
</div>
<div class="main-card">
<div class="protection-img">
<img src="img/protection2.png">
</div>
<div class="protection-text">
<h3 class="h3-desktop">SSL шифрование</h3>
<p class="text-h3-desktop">
Ваши данные никто не сможет перехватить
</p>
</div>
</div>
<div class="main-card">
<div class="protection-img">
<img src="img/protection1.png">
</div>
<div class="protection-text">
<h3 class="h3-desktop">Распределенные дата-центры</h3>
<p class="text-h3-desktop">
Плюсы и возможности резервной работы системы
</p>
</div>
</div>
</div>
<div class="main-flex">
<div class="main-card">
<div class="protection-img">
<img src="img/protection3.png">
</div>
<div class="protection-text">
<h3 class="h3-desktop">Полное шифрование данных</h3>
<p class="text-h3-desktop">
Возможность полного шифрования данных.
Никто не сможет их прочесть.
</p>
</div>
</div>
<div class="main-card">
<div class="protection-img">
<img src="img/protection5.png">
</div>
<div class="protection-text">
<h3 class="h3-desktop">Резервирование данных</h3>
<p class="text-h3-desktop">
Защита информации от возможных потерь
</p>
</div>
</div>
<div class="main-card">
<div class="protection-img">
<img src="img/protection4.png">
</div>
<div class="protection-text">
<h3 class="h3-desktop">Работа по 152 ФЗ</h3>
<p class="text-h3-desktop">
</p>
</div>
</div>
</div> </div>
</div> </div>
</section> </section>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment