Лагерь: Секция 2-3
This commit is contained in:
Dekart Deploy Bot
parent
e4ae1344b4
commit
d0d7029f8c
@ -14,8 +14,8 @@ html {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 75px;
|
||||
padding-top: 30px !important;
|
||||
padding-bottom: 30px !important;
|
||||
padding-top: 30px;
|
||||
padding-bottom: 30px;
|
||||
}
|
||||
|
||||
.container_camp {
|
||||
@ -42,9 +42,14 @@ p {
|
||||
}
|
||||
|
||||
.camp_text {
|
||||
color: #212121;
|
||||
font-size: 18px;
|
||||
font-weight: 500;
|
||||
font-family: Inter, sans-serif;
|
||||
font-size: 18px;
|
||||
line-height: 1.6;
|
||||
color: #555;
|
||||
text-align: center;
|
||||
max-width: 700px;
|
||||
margin: 0 auto 50px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
/* banner */
|
||||
@ -207,29 +212,20 @@ p {
|
||||
|
||||
|
||||
.about-us {
|
||||
|
||||
background: #ffffff;
|
||||
|
||||
padding: 24px 0;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.about-us__wrapper {
|
||||
|
||||
position: relative;
|
||||
|
||||
display: flex;
|
||||
|
||||
flex-direction: row;
|
||||
|
||||
align-items: center;
|
||||
|
||||
gap: 60px;
|
||||
|
||||
padding: 60px 75px;
|
||||
|
||||
padding: 0 75px;
|
||||
overflow: visible;
|
||||
|
||||
}
|
||||
|
||||
|
||||
@ -318,44 +314,34 @@ p {
|
||||
|
||||
|
||||
.about-us__content-col {
|
||||
|
||||
flex: 1;
|
||||
|
||||
min-width: 0;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.about-us__title {
|
||||
text-align: center;
|
||||
margin-bottom: 20px;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.about-us__text {
|
||||
|
||||
font-family: Inter, sans-serif;
|
||||
|
||||
font-size: 18px;
|
||||
|
||||
line-height: 1.7;
|
||||
|
||||
line-height: 1.6;
|
||||
font-weight: 400;
|
||||
|
||||
color: #333;
|
||||
|
||||
text-align: left;
|
||||
|
||||
margin: 0 0 24px;
|
||||
|
||||
color: #555;
|
||||
text-align: center;
|
||||
max-width: 700px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.about-us__social-proof {
|
||||
|
||||
margin-bottom: 16px;
|
||||
|
||||
}
|
||||
|
||||
.about-us__badge {
|
||||
@ -379,9 +365,6 @@ p {
|
||||
}
|
||||
|
||||
.about-us__cta {
|
||||
|
||||
margin-top: 8px;
|
||||
|
||||
}
|
||||
|
||||
.about-us__cta-link {
|
||||
@ -472,9 +455,9 @@ p {
|
||||
|
||||
flex-direction: column;
|
||||
|
||||
padding: 40px 20px;
|
||||
padding: 24px 20px;
|
||||
|
||||
gap: 30px;
|
||||
gap: 24px;
|
||||
|
||||
}
|
||||
|
||||
@ -487,12 +470,14 @@ p {
|
||||
}
|
||||
|
||||
.about-us__title {
|
||||
padding-bottom: 0;
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.about-us__text {
|
||||
|
||||
font-size: 16px;
|
||||
text-align: center;
|
||||
|
||||
line-height: 1.6;
|
||||
|
||||
@ -587,7 +572,7 @@ p {
|
||||
}
|
||||
.suggestions {
|
||||
background: #f8f9fa;
|
||||
padding: 100px 0;
|
||||
padding: 80px 0;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
@ -606,15 +591,13 @@ p {
|
||||
z-index: 2;
|
||||
}
|
||||
.suggestions__subtitle {
|
||||
font-family: "Inter", sans-serif;
|
||||
font-size: 20px;
|
||||
font-family: Inter, sans-serif;
|
||||
font-size: 18px;
|
||||
line-height: 1.6;
|
||||
color: #555;
|
||||
text-align: center;
|
||||
margin: -30px 0 50px;
|
||||
max-width: 700px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin: 0 auto 50px;
|
||||
}
|
||||
.suggestions-wrapper {
|
||||
display: flex;
|
||||
@ -745,8 +728,8 @@ p {
|
||||
.suggestions-wrapper > .suggestions__item { width: calc(50% - 8px); min-width: 0; }
|
||||
}
|
||||
@media (max-width: 767px) {
|
||||
.suggestions { padding: 60px 0; }
|
||||
.suggestions__subtitle { font-size: 18px; margin: -20px 0 36px; padding: 0 20px; }
|
||||
.suggestions { padding: 40px 0; }
|
||||
.suggestions__subtitle { font-size: 16px; margin: 0 auto 30px; padding: 0 20px; }
|
||||
.suggestions-wrapper { gap: 14px; }
|
||||
.suggestions-wrapper > .suggestions__item { width: 100%; }
|
||||
.suggestions__item { padding: 24px 20px 28px; }
|
||||
@ -755,16 +738,24 @@ p {
|
||||
.suggestions__doodle { display: none; }
|
||||
.suggestions::before { display: none; }
|
||||
}
|
||||
.infograph {
|
||||
background: #faf7f2;
|
||||
padding: 80px 0;
|
||||
}
|
||||
|
||||
.infograph__item {
|
||||
width: calc(25% - 20px);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.infograph__item_img {
|
||||
border-radius: 30px;
|
||||
width: 234px;
|
||||
width: 100%;
|
||||
max-width: 180px;
|
||||
aspect-ratio: 1 / 1;
|
||||
}
|
||||
|
||||
@ -783,6 +774,22 @@ p {
|
||||
}
|
||||
|
||||
/* infograph END */
|
||||
|
||||
.infograph-wrapper {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
gap: 30px;
|
||||
}
|
||||
|
||||
.infograph__item {
|
||||
transition: transform 0.3s ease, box-shadow 0.3s ease;
|
||||
}
|
||||
|
||||
.infograph__item:hover {
|
||||
transform: translateY(-4px);
|
||||
}
|
||||
|
||||
/* programs */
|
||||
.programs-wrapper {
|
||||
flex-wrap: wrap;
|
||||
@ -1645,8 +1652,8 @@ p {
|
||||
@media (width > 780px) and (width < 1200px) {
|
||||
.camp {
|
||||
gap: 6.25vw;
|
||||
padding-top: 2.5vw !important;
|
||||
padding-bottom: 2.5vw !important;
|
||||
padding-top: 2.5vw;
|
||||
padding-bottom: 2.5vw;
|
||||
}
|
||||
|
||||
.container_camp {
|
||||
@ -2207,32 +2214,44 @@ p {
|
||||
}
|
||||
|
||||
section {
|
||||
padding: 0 15px;
|
||||
padding: 0 15px;
|
||||
}
|
||||
|
||||
.camp_text {
|
||||
font-size: 16px;
|
||||
margin: 0 auto 30px;
|
||||
padding: 0 20px;
|
||||
}
|
||||
|
||||
|
||||
.infograph {
|
||||
padding: 40px 0;
|
||||
}
|
||||
|
||||
.infograph-wrapper {
|
||||
margin-top: 0;
|
||||
gap: 20px 40px;
|
||||
gap: 16px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.infograph__item {
|
||||
width: calc(50% - 20px);
|
||||
gap: 10px;
|
||||
width: calc(50% - 8px);
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.infograph__item_title {
|
||||
margin-bottom: 0;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.infograph__item_img {
|
||||
width: 70%;
|
||||
width: 100%;
|
||||
max-width: 160px;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.infograph__item_data {
|
||||
font-size: 22px;
|
||||
font-size: 24px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
|
||||
@ -215,9 +215,9 @@ $metrics = [
|
||||
</div>
|
||||
</section>
|
||||
<section class="infograph">
|
||||
<h2 class="camp_title">С любовью и заботой о каждом</h2>
|
||||
<h2 class="camp_title">Цифры, которые говорят сами за себя</h2>
|
||||
<p class="camp_text">Мы обеспечиваем безопасную и поддерживающую среду, где дети могут раскрывать свой
|
||||
потенциал, исследовать мир и развивать дружбу под присмотром заботливые наставников.</p>
|
||||
потенциал, исследовать мир и развивать дружбу под присмотром заботливых наставников.</p>
|
||||
<div class="infograph-wrapper">
|
||||
<div class="infograph__item">
|
||||
<img loading="lazy" class="infograph__item_img" width="234" height="234" src="<?php echo get_template_directory_uri(); ?>/assets/images/age.svg" alt="инфографика возраста">
|
||||
@ -238,7 +238,7 @@ $metrics = [
|
||||
<img loading="lazy" class="infograph__item_img" width="234" height="234" src="<?php echo get_template_directory_uri(); ?>/assets/images/price.svg"
|
||||
alt="инфографика стоимости">
|
||||
<p class="infograph__item_title">стоимость недели</p>
|
||||
<p class="infograph__item_data">от <?php echo number_format($priceMin, 0, ',', ' '); ?> ₽</p>
|
||||
<p class="infograph__item_data">от <?php echo esc_html( number_format($priceMin, 0, ',', ' ') ); ?> ₽</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user