diff --git a/about.html b/about.html index e7f351c..e53b2c1 100644 --- a/about.html +++ b/about.html @@ -175,7 +175,7 @@ -
+

@@ -200,86 +200,176 @@ «Ашхабад», организация и оформление выставки нефтегазовых компаний, печать журнала «Лачин» и пр.

+ +
+
+
+ + + +
+
+

Преимущества:

+
+
- + + + + +
+ + +
+
+

- Почему стоит выбрать нашу компанию? + Почему стоит выбрать нашу компанию?

  • - Доверие партнеров – мы - несомненный лидер в рекламной, маркетинговой и печатной индустрии Туркменистана. + Доверие партнеров – мы - несомненный лидер в рекламной, маркетинговой и + печатной индустрии Туркменистана.

  • - Индивидуальный подход – работаем с клиентами разных ниш и с разными рекламными бюджетами. + Индивидуальный подход – работаем с клиентами разных ниш и с разными рекламными + бюджетами.

  • - Программа лояльности – став нашим постоянным клиентом, вы получите скидки и специальные предложения. + Программа лояльности – став нашим постоянным клиентом, вы получите скидки и + специальные предложения.

  • - Лучшие цены на рекламу – предлагаем самое выгодное соотношение цены и качества на рынке. + Лучшие цены на рекламу – предлагаем самое выгодное соотношение цены и качества + на рынке.

  • - Любая сложность исполнения – большой опыт работы и сильная команда позволяет браться за любой проект. + Любая сложность исполнения – большой опыт работы и сильная команда позволяет + браться за любой проект.

  • - Инновации и успех – используем современные технологии, адаптированные под конкретный проект или кампанию. + Инновации и успех – используем современные технологии, адаптированные под + конкретный проект или кампанию.

@@ -307,23 +397,6 @@

- - -
diff --git a/assets/css/components/2-layout/responsive.scss b/assets/css/components/2-layout/responsive.scss index 0067b30..f93fed2 100644 --- a/assets/css/components/2-layout/responsive.scss +++ b/assets/css/components/2-layout/responsive.scss @@ -393,6 +393,25 @@ height: 385px; } } + + + } + + // About Page ==================== + .about.page { + .about { + &_box { + &-item { + &-title { + font-size: 18px; + } + + &-txt { + font-size: 14px; + } + } + } + } } // Contact =============== @@ -467,6 +486,17 @@ } } } + + // About Page ==================== + .about.page { + .about { + &_box { + &-item { + width: calc(50% - 82px); + } + } + } + } } // 750 ======================== @@ -713,11 +743,11 @@ } .main_title { - font-size: 18px; + font-size: 20px; } } -// 600 ======================= +// 650 ======================= @include md-sm { // Gallery ============== @@ -782,6 +812,17 @@ } } } + + // About Page ==================== + .about.page { + .about { + &_box { + &-item { + width: calc(100% - 82px); + } + } + } + } } // 400 =========================== diff --git a/assets/css/components/3-page/about.scss b/assets/css/components/3-page/about.scss index 80a6bf0..4d0e203 100644 --- a/assets/css/components/3-page/about.scss +++ b/assets/css/components/3-page/about.scss @@ -1,6 +1,6 @@ // About ================ .about.page { - padding: 50px 0 100px; + padding: 50px 0 0; .about { &_txt { @@ -11,16 +11,67 @@ margin-bottom: 30px; } + + &_box { + background: linear-gradient(0deg, rgba(0, 0, 0, .7), rgba(0, 0, 0, .7)), url("../images/blur-bg.jpg") no-repeat center; + background-size: cover; + margin-bottom: 50px; + position: relative; + padding: 80px 0; + + &::after { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + backdrop-filter: blur(15px); + z-index: 1; + } + + &-inner { + display: flex; + flex-wrap: wrap; + z-index: 5; + position: relative; + } + + &-item { + width: calc(33.33% - 82px); + margin: 20px; + text-align: center; + padding: 30px 20px; + border: .5px solid hsla(0, 0%, 100%, .3); + ; + border-radius: 12px; + + color: #fff; + + &-title { + font-size: 22px; + font-weight: 400; + line-height: 1.4; + } + + &-txt { + margin-top: 20px; + font-size: 16px; + font-weight: 400; + line-height: 1.4; + } + } + } } } .main_title { padding-left: 25px; position: relative; - font-size: 22px; + font-size: 25px; font-weight: 500; line-height: 1.4; - margin: 15px 0 25px; + margin: 45px 0 30px; &::before { content: ''; @@ -29,7 +80,19 @@ left: 0; width: 3px; height: 100%; - max-height: 30px; + max-height: 35px; background: $main-color; } +} + +.p0 { + padding: 0 !important; +} + +.pt0 { + padding-top: 0 !important; +} + +.pb0 { + padding-bottom: 0 !important; } \ No newline at end of file diff --git a/assets/css/components/3-page/home.scss b/assets/css/components/3-page/home.scss index 207b7bb..09f2a10 100644 --- a/assets/css/components/3-page/home.scss +++ b/assets/css/components/3-page/home.scss @@ -282,7 +282,6 @@ &_box { display: flex; - } &_info { diff --git a/assets/css/main.css b/assets/css/main.css index df2d9c0..bc938cf 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -1760,7 +1760,7 @@ svg.active .svg-elem-21 { } .about.page { - padding: 50px 0 100px; + padding: 50px 0 0; } .about.page .about_txt { font-weight: 400; @@ -1769,14 +1769,62 @@ svg.active .svg-elem-21 { color: #000000; margin-bottom: 30px; } +.about.page .about_box { + background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.7)), to(rgba(0, 0, 0, 0.7))), url("../images/blur-bg.jpg") no-repeat center; + background: linear-gradient(0deg, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url("../images/blur-bg.jpg") no-repeat center; + background-size: cover; + margin-bottom: 50px; + position: relative; + padding: 80px 0; +} +.about.page .about_box::after { + content: ""; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + -webkit-backdrop-filter: blur(15px); + backdrop-filter: blur(15px); + z-index: 1; +} +.about.page .about_box-inner { + display: -webkit-box; + display: -ms-flexbox; + display: flex; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + z-index: 5; + position: relative; +} +.about.page .about_box-item { + width: calc(33.33% - 82px); + margin: 20px; + text-align: center; + padding: 30px 20px; + border: 0.5px solid hsla(0deg, 0%, 100%, 0.3); + border-radius: 12px; + color: #fff; +} +.about.page .about_box-item-title { + font-size: 22px; + font-weight: 400; + line-height: 1.4; +} +.about.page .about_box-item-txt { + margin-top: 20px; + font-size: 16px; + font-weight: 400; + line-height: 1.4; +} .main_title { padding-left: 25px; position: relative; - font-size: 22px; + font-size: 25px; font-weight: 500; line-height: 1.4; - margin: 15px 0 25px; + margin: 45px 0 30px; } .main_title::before { content: ""; @@ -1785,10 +1833,22 @@ svg.active .svg-elem-21 { left: 0; width: 3px; height: 100%; - max-height: 30px; + max-height: 35px; background: #2B72B6; } +.p0 { + padding: 0 !important; +} + +.pt0 { + padding-top: 0 !important; +} + +.pb0 { + padding-bottom: 0 !important; +} + .gallery { padding: 100px 0; } @@ -2819,6 +2879,13 @@ svg.active .svg-elem-21 { height: 385px; } + .about.page .about_box-item-title { + font-size: 18px; + } + .about.page .about_box-item-txt { + font-size: 14px; + } + .contact_box { -webkit-box-orient: vertical; -webkit-box-direction: normal; @@ -2866,6 +2933,10 @@ svg.active .svg-elem-21 { .service.page .service_box .slick-list { padding: 0 170px 0 0 !important; } + + .about.page .about_box-item { + width: calc(50% - 82px); + } } @media (max-width: 750px) { .header .logo_bg { @@ -3026,7 +3097,7 @@ svg.active .svg-elem-21 { } .main_title { - font-size: 18px; + font-size: 20px; } } @media (max-width: 650px) { @@ -3075,6 +3146,10 @@ svg.active .svg-elem-21 { .service.page .service_list li p { line-height: 28px; } + + .about.page .about_box-item { + width: calc(100% - 82px); + } } @media (max-width: 400px) { .auto_container { diff --git a/assets/images/blur-bg.jpg b/assets/images/blur-bg.jpg new file mode 100644 index 0000000..72861fa Binary files /dev/null and b/assets/images/blur-bg.jpg differ