Commit 9ccf2ebf authored by IrinaPronina's avatar IrinaPronina

without final images

parent 923dabc3
Pipeline #92 canceled with stages
......@@ -76,5 +76,10 @@
&.decor:after {
bottom: -100px;
@media (min-width: 2100px) {
bottom: -150px;
height: 150px;
}
}
}
\ No newline at end of file
This diff is collapsed.
......@@ -26,6 +26,9 @@
.accordeon__btn:after {
background: linear-gradient(0deg, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45));
}
.accordeon__btn-img{
filter: grayscale(0%);
}
.accordeon__content {
max-height: 5000px;
......@@ -58,7 +61,7 @@
@media (min-width: $screen-lg) {
padding: 0 80px;
height: 256px;
min-height: 160px;
margin-bottom: 40px;
}
......@@ -71,13 +74,45 @@
width: 100%;
height: 100%;
cursor: pointer;
opacity: 1;
background: linear-gradient(0deg, rgba(1, 73, 60, 0.6), rgba(1, 73, 60, 0.6)), linear-gradient(180deg, rgba(0, 221, 164, 0.5) 0%, rgba(0, 212, 192, 0.5) 100%);
transition: all $transition-time;
transition: all .5s;
}
&:hover {
&:after {
background: linear-gradient(0deg, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45));
opacity: 0;
}
.accordeon__check::after,
.accordeon__check::before {
background-color: $main-light;
}
}
&::before {
position: absolute;
content: '';
opacity: 0;
top: 0;
left: 0;
border-radius: 16px;
width: 100%;
height: 100%;
cursor: pointer;
z-index: 2;
background: linear-gradient(0deg, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45));
transition: all .5s;
}
&:hover {
&:before {
opacity: 1;
}
.accordeon__btn-img{
filter: grayscale(0%);
}
.accordeon__check::after,
......@@ -88,6 +123,17 @@
}
&__btn-img{
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
border-radius: 16px;
filter: grayscale(99%);
transition: all $transition-time;
}
&__content {
max-height: 0;
opacity: 0;
......@@ -184,7 +230,22 @@
}
.accordeon.accordeon--industries {
}
.accordeon--industries {
margin-bottom: 0; padding: 30px 0;
@media (min-width: $screen-xxl) {
margin-bottom: 0px;
}
@media (min-width: $screen-lg) {
padding: 50px 0;
}
.accordeon__btn {
&::after {
background: linear-gradient(0deg, rgba(64, 119, 115, 0.85), rgba(64, 119, 115, 0.85));
......@@ -199,19 +260,26 @@
.accordeon__element {
&.open {
.accordeon__btn:after {
background: linear-gradient(0deg, rgba(64, 119, 115, 0.85), rgba(64, 119, 115, 0.85));
}
// .accordeon__btn:after {
// background: linear-gradient(0deg, rgba(64, 119, 115, 0.85), rgba(64, 119, 115, 0.85));
// }
}
}
.task__item::before{
.task__item::before {
background-color: $color-accent;
}
.collapse__btn{
.collapse__btn {
color: $black;
transition: all $transition-time;
// &:hover {
// color: $main-light;
// }
}
.collapse__btn::before{
.collapse__btn::before {
background: url(../img/arrow-down-black.svg);
width: 23px;
height: 24px;
......
......@@ -7,7 +7,8 @@
$block-name: &; // #{$block-name}__element
margin-bottom: 40px;
@media (min-width: $screen-lg){
@media (min-width: $screen-lg) {
margin-bottom: 64px;
}
......@@ -29,16 +30,18 @@
&__item {
margin-bottom: 16px;
@media (max-width: ($screen-xxl - 1)){
flex: 0 0 50%;
margin-bottom: 20px;
}
padding: 0 20px;
@media (min-width: $screen-lg) {
@media (min-width: $screen-c) {
padding: 0 20px;
flex: 0 0 25%;
margin-bottom: 0;
}
@media (max-width: ($screen-c - 1)) {
flex: 0 0 50%;
margin-bottom: 20px;
}
}
&__body {
......@@ -63,7 +66,7 @@
height: 60px;
}
svg{
svg {
width: 100%;
height: 100%;
}
......
......@@ -116,7 +116,7 @@
list-style: none;
margin-bottom: 40px;
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
display: flex;
flex-wrap: wrap;
margin: 0 -20px 40px;
......@@ -126,7 +126,7 @@
&__screen-item {
margin-bottom: 24px;
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
padding: 20px;
flex: 0 0 33.333%;
display: flex;
......
......@@ -22,9 +22,11 @@ mixin branch(text, mods)
.branch__inner.container
h2.branch__title.h2 Отрасли
.branch__block
.branch__top(style="background-image: url(img/branch1.jpg);")
.branch__top
a(href="javascript:void(0);").branch__link
.branch__item-body
img(src="img/branch1.jpg", alt="").branch__item-img
h3.branch__item-title Цифровизация производства
ul.branch__item-bottom
li.branch__item-item
......@@ -36,9 +38,10 @@ mixin branch(text, mods)
li.branch__item-item
span.branch__item-subtitle.h5 Распределённая командная работа и цифровой рабочий
ul.branch__grid
.branch__item(style="background-image: url(img/branch2.jpg);")
.branch__item
a(href="javascript:void(0);").branch__link
.branch__body
.branch__body
img(src="img/branch2.jpg", alt="").branch__item-img
h3.branch__title-h3 Нефть и газ
ul.branch__bottom
li.branch__subtitle.h5 Цифровые двойники
......@@ -46,21 +49,22 @@ mixin branch(text, mods)
li.branch__subtitle.h5 Интегрированное планирование и оптимизация
li.branch__subtitle.h5 Переработка и сбыт
li.branch__subtitle.h5 Корпоративные сервисы
.branch__item(style="background-image: url(img/branch3.jpg);")
.branch__item
a(href="javascript:void(0);").branch__link
.branch__body
.branch__body
img(src="img/branch3.jpg", alt="").branch__item-img
h3.branch__title-h3 Энергетика
ul.branch__bottom
li.branch__subtitle.h5 Генерация
li.branch__subtitle.h5 Ресурсоснабжающие организации и сбыт
li.branch__subtitle.h5 Корпоративные сервисы
.branch__item(style="background-image: url(img/branch4.png);")
.branch__item
a(href="javascript:void(0);").branch__link
.branch__body
.branch__body
img(src="img/branch4.jpg", alt="").branch__item-img
h3.branch__title-h3 Промышленное производство
ul.branch__bottom
li.branch__subtitle.h5 Цифровые двойники
li.branch__subtitle.h5 Достоверность данных
li.branch__subtitle.h5 Проактивные приложения
li.branch__subtitle.h5 Распределённая командная работа и цифровой рабочий
li.branch__subtitle.h5 Ресурсоснабжающие организации и сбыт
li.branch__subtitle.h5 Корпоративные сервисы
......@@ -9,15 +9,27 @@
margin-bottom: 48px;
@media (min-width: $screen-xxl) {
padding: 148px 0;
padding: 160px 0;
margin-bottom: 104px;
}
@media (min-width: $screen-c) {
padding: 136px 0;
margin-bottom: 118px;
}
@media (min-width: $screen-xl) {
padding: 108px 0;
padding: 118px 0 136px;
margin-bottom: 132px;
}
@media (min-width: $screen-lg) {
padding: 100px 0;
padding: 102px 0 112px;
margin-bottom: 40px;
}
@media (min-width: $screen-md) {
padding: 102px 0;
margin-bottom: 100px;
}
@media (min-width: $screen-sm) {
......@@ -28,7 +40,10 @@
color: $white;
margin: 0 0 30px;
@media (min-width: $screen-lg) {
@media (min-width: $screen-xxl) {
margin: 0 0 56px;
}
@media (min-width: $screen-md) {
margin: 0 0 48px;
}
......@@ -61,7 +76,7 @@
bottom: 0;
right: 0;
left: 0;
z-index: -1;
z-index: 2;
border-radius: 16px;
pointer-events: none;
transition: all $transition-time;
......@@ -76,7 +91,6 @@
bottom: 0;
right: 0;
left: 0;
z-index: -1;
border-radius: 16px;
pointer-events: none;
background: linear-gradient(0deg, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45));
......@@ -92,6 +106,10 @@
&:after {
opacity: 1;
}
.branch__item-img{
filter: grayscale(0%);
}
}
}
......@@ -113,7 +131,7 @@
padding: 48px;
}
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
padding: 32px;
align-items: center;
}
......@@ -123,14 +141,15 @@
font: 18px $ff-i-b;
font-weight: 700;
margin: 0;
z-index: 3;
@media (min-width: $screen-xxl) {
font-size: 36px;
margin: 0 0 40px;
}
@media (min-width: $screen-lg) {
font-size: 30px;
@media (min-width: $screen-md) {
font-size: 26px;
text-align: center;
margin: 0 0 32px;
}
......@@ -156,7 +175,7 @@
right: 50%;
transform: translateY(-50%);
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
top: 50%;
right: -32px;
}
......@@ -170,24 +189,32 @@
width: 28%;
}
@media (min-width: $screen-lg) {
margin-bottom: 16px;
@media (min-width: $screen-md) {
margin-bottom: 12px;
}
}
}
&__item-subtitle {
text-align: center;
@media (min-width: $screen-xxl) {
font-size: 20px;
}
@media (min-width: $screen-c) {
font-size: 17px;
}
}
&__item-bottom {
margin: 0;
padding: 0;
z-index: 3;
list-style: none;
display: none;
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
......@@ -202,13 +229,10 @@
grid-template-columns: repeat(1, 1fr);
gap: 16px;
@media (min-width: $screen-xxl) {
gap: 40px;
}
@media (min-width: $screen-xl) {
grid-template-columns: repeat(3, 1fr);
gap: 16px;
gap: 40px;
}
}
......@@ -225,10 +249,9 @@
z-index: 1;
@media (min-width: $screen-xxl) {
aspect-ratio: 1/1;
min-height: auto;
}
&::after {
@media (min-width: $screen-xl) {
......@@ -251,7 +274,7 @@
bottom: 0;
right: 0;
left: 0;
z-index: -1;
z-index: 2;
border-radius: 16px;
pointer-events: none;
background: linear-gradient(0deg, rgba(0, 16, 91, 0.55), rgba(0, 16, 91, 0.55));
......@@ -267,6 +290,9 @@
&:after {
opacity: 1;
}
.branch__item-img{
filter: grayscale(0%);
}
}
}
......@@ -281,7 +307,7 @@
bottom: 0;
right: 0;
left: 0;
z-index: -1;
z-index: 2;
border-radius: 16px;
pointer-events: none;
background: linear-gradient(0deg, rgba(237, 28, 36, 0.5), rgba(237, 28, 36, 0.5));
......@@ -297,6 +323,10 @@
&:after {
opacity: 1;
}
.branch__item-img{
filter: grayscale(0%);
}
}
}
}
......@@ -310,7 +340,7 @@
bottom: 0;
right: 0;
left: 0;
z-index: -1;
z-index: 2;
border-radius: 16px;
pointer-events: none;
background: linear-gradient(0deg, rgba(0, 71, 99, 0.66), rgba(0, 71, 99, 0.66));
......@@ -326,11 +356,28 @@
&:after {
opacity: 1;
}
.branch__item-img{
filter: grayscale(0%);
}
}
}
}
}
&__item-img{
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
border-radius: 16px;
filter: grayscale(99%);
object-fit: cover;
transition: all $transition-time;
}
&__body {
display: flex;
flex-direction: column;
......@@ -343,7 +390,7 @@
padding: 48px;
}
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
padding: 32px;
}
......@@ -354,7 +401,7 @@
bottom: 0;
right: 0;
left: 0;
z-index: -1;
z-index: 2;
border-radius: 16px;
pointer-events: none;
background: linear-gradient(0deg, rgba(1, 73, 60, 0.6), rgba(1, 73, 60, 0.6)),
......@@ -367,10 +414,16 @@
font: 18px $ff-i-b;
font-weight: 700;
margin: 0;
z-index: 3;
@media (min-width: $screen-xxl) {
font-size: 36px;
min-height: 86px;
margin: 0 0 40px;
}
@media (min-width: $screen-c) {
margin: 0 0 32px;
}
@media (min-width: $screen-xl) {
......@@ -378,7 +431,7 @@
margin: 0 0 40px;
}
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
font-size: 28px;
margin: 0 0 32px;
}
......@@ -387,19 +440,35 @@
&__bottom {
list-style: disc;
display: none;
z-index: 3;
@media (min-width: $screen-xxl) {
padding-left: 20px;
}
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
display: block;
}
}
&__subtitle {
@media (min-width: $screen-xxl){
font-size: 20px;
}
@media (min-width: $screen-c){
font-size: 17px;
}
&:not(:last-child) {
margin-bottom: 8px;
}
}
}
.without-top {
.branch__item::after{
visibility: hidden;
}
}
\ No newline at end of file
......@@ -36,7 +36,7 @@
}
span {
opacity: 0.5;
opacity: 0.7;
}
&__item {
......
......@@ -24,10 +24,11 @@
&__text {
display: flex;
justify-content: center;
margin-bottom: 40px;
margin-bottom: 24px;
p {
text-align: center;
margin-bottom: 0;
}
}
......
......@@ -4,36 +4,55 @@
.collapse {
$block-name: &; // #{$block-name}__element
$block-name: &; // #{$block-name}__element
width: 100%;
display: flex;
justify-content: center;
&__btn{
&__btn {
color: $white;
position: relative;
transition: all $transition-time;
&::before{
position: absolute;
content: '';
background: url(../img/arrow-down-white.svg);
background-repeat: no-repeat;
background-position: center;
background-size: contain;
border: 0;
width: 20px;
height: 24px;
top: -100%;
left: 50%;
transform: translateX(-50%);
transition: all $transition-time;
}
// &::before {
// position: absolute;
// content: '';
// background: url(../img/arrow-down-white.svg);
// background-repeat: no-repeat;
// background-position: center;
// background-size: contain;
// border: 0;
// width: 23px;
// height: 24px;
// top: -100%;
// left: 50%;
// transform: translateX(-50%);
// transition: all $transition-time;
// }
svg {
width: 24px;
display: block;
margin: 4px auto;
transition: transform .5s;
}
&:hover{
.collapse__btn::before{
top: -110%;
&:hover {
svg{
transform: translateY(-10px);
// animation: scroll .5s ease-out alternate infinite;
}
}
}
}
@keyframes scroll {
0% {
transform: translateY(0px);
}
100% {
transform: translateY(-10px);
}
}
\ No newline at end of file
......@@ -20,6 +20,9 @@
margin-right: 40px;
margin-bottom: 0;
}
@media (min-width: $screen-lg) {
max-width: 440px;
}
}
&__body {
......
......@@ -14,8 +14,9 @@
}
&__descr {
padding: 70px 0 40px;
padding: 40px 0 40px;
text-align: center;
}
&__error {
......
......@@ -33,9 +33,13 @@
}
&__text {
@media (min-width: $screen-xxl) {
max-width: 1180px;
@media (min-width: $screen-c) {
margin-bottom: 24px;
transform: translateY(-28px);
}
@media (min-width: $screen-lg) {
margin-bottom: 16px;
}
}
}
\ No newline at end of file
......@@ -11,7 +11,11 @@
padding: 80px 0;
}
&__top{
@media (min-width: $screen-xl) {
padding: 46px 0 46px;
}
&__top {
margin: 0;
margin-bottom: 64px;
}
......@@ -30,6 +34,7 @@
&__item {
margin-bottom: 32px;
@media (min-width: $screen-lg) {
flex: 0 0 33.3333%;
padding: 0 20px;
......@@ -46,9 +51,10 @@
&__label {
color: $main-dark;
margin-bottom: 16px;
@media (min-width: $screen-lg){
@media (min-width: $screen-lg) {
margin-bottom: 32px;
}
......@@ -63,7 +69,8 @@
color: $black;
text-decoration: none;
}
p{
p {
margin: 0;
}
......
......@@ -4,29 +4,36 @@
.more {
$block-name: &;
$block-name: &;
&__wrapper{
display: flex;
justify-content: center;
&__wrapper {
display: flex;
justify-content: center;
}
}
.news {
.more{
.more {
margin-bottom: 48px;
@media (min-width: $screen-lg) {
margin-bottom: 80px;
}
}
}
.projects__more {
.more{
@media (min-width: $screen-xl) {
margin-top: 32px;
}
.more {
margin-bottom: 48px;
@media (min-width: $screen-lg) {
margin-bottom: 80px;
}
}
}
}
\ No newline at end of file
......@@ -65,12 +65,15 @@
display: flex;
align-items: center;
flex-direction: column;
padding: 40px 0;
padding: 20px 0;
margin: 0;
@media (min-width: $screen-lg) {
padding: 64px 0;
}
@media (min-width: $screen-md) {
padding: 40px 0;
}
}
figcaption {
......
......@@ -9,11 +9,11 @@
padding: 46px 0 80px;
@media (min-width: $screen-xxl) {
padding: 160px 0 220px;
padding: 160px 0 140px;
}
@media (min-width: $screen-xl) {
padding: 100px 0 180px;
padding: 100px 0 140px;
}
@media (min-width: $screen-lg) {
......
......@@ -42,14 +42,16 @@ mixin page-footer(mods)
form.page-footer__form.footer-form
.footer-form__left
.footer-form__title.h5 Обратная связь
label.footer-form__label
input(type="text" name="name" placeholder="Имя Фамилия").footer-form__input
label.footer-form__label
input(type="text" name="name" placeholder="Компания").footer-form__input
label.footer-form__label
input(type="text" name="name" placeholder="Должность").footer-form__input
label.footer-form__label.message-desc
textarea(name="name", cols="30", rows="6", placeholder="Ваше сообщение").footer-form__textarea
.footer-form__left-input
label.footer-form__label
input(type="text" name="name" placeholder="Имя Фамилия").footer-form__input
label.footer-form__label
input(type="text" name="name" placeholder="Компания").footer-form__input
label.footer-form__label
input(type="text" name="name" placeholder="Должность").footer-form__input
.footer-form__left-textarea
label.footer-form__label.message-desc
textarea(name="name", placeholder="Ваше сообщение").footer-form__textarea
.footer-form__right
label.footer-form__label
input(type="text" name="name" placeholder="Телефон").footer-form__input
......
......@@ -14,15 +14,23 @@
padding: 120px 0 56px;
}
@media (min-width: $screen-c) {
padding: 86px 0 48px;
}
@media (min-width: $screen-lg) {
padding: 80px 0 48px;
}
@media (min-width: $screen-md) {
padding: 64px 0 56px;
}
&__body {
position: relative;
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
display: flex;
}
}
......@@ -33,14 +41,24 @@
@media (min-width: $screen-xxl) {
margin-right: 42px;
flex: 0 0 30%;
}
@media (min-width: $screen-c) {
flex: 0 0 35%;
}
@media (min-width: $screen-xl) {
margin-right: 52px;
}
@media (min-width: $screen-lg) {
margin-right: 208px;
}
@media (min-width: $screen-md) {
margin-bottom: 0;
margin-right: 66px;
margin-right: 120px;
}
}
......@@ -50,6 +68,11 @@
@media (min-width: $screen-xxl) {
flex: 0 0 18%;
}
@media (min-width: $screen-c) {
flex: 0 0 21%;
}
@media (min-width: $screen-xl) {
display: block;
flex: 0 0 17%;
......@@ -64,14 +87,15 @@
margin-bottom: 54px;
}
@media (min-width: $screen-xl) {
margin-bottom: 46px;
}
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
width: 267px;
margin-bottom: 56px;
margin-bottom: 46px;
}
}
......@@ -88,7 +112,7 @@
margin-bottom: 16px;
}
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
padding-left: 80px;
}
}
......@@ -99,7 +123,7 @@
margin-bottom: 0;
letter-spacing: 0.05em;
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
padding-left: 80px;
}
}
......@@ -121,9 +145,9 @@
margin-bottom: 16px;
}
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
font-size: 16px;
margin-bottom: 24px;
margin-bottom: 16px;
}
}
......@@ -146,12 +170,12 @@
margin-bottom: 16px;
}
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
font-size: 16px;
margin-bottom: 24px;
margin-bottom: 16px;
}
&:hover{
&:hover {
color: $main-light;
}
}
......@@ -175,6 +199,19 @@
@media (min-width: $screen-xxl) {
font-size: 14px;
max-width: 280px;
}
@media (min-width: $screen-c) {
max-width: 240px;
}
@media (min-width: $screen-xl) {
max-width: 210px;
}
@media (min-width: $screen-md) {
margin-bottom: 16px;
}
}
......@@ -186,7 +223,7 @@
&__item {
color: $white;
font: 18px/1.3 $ff-i-m;
font: 16px/1.3 $ff-i-m;
font-weight: 500;
letter-spacing: 0.05em;
margin-bottom: 32px;
......@@ -206,7 +243,7 @@
color: $white;
transition: color $transition-time;
&:hover{
&:hover {
color: $main-light;
}
}
......@@ -215,26 +252,60 @@
.footer-form {
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
display: flex;
justify-content: space-between;
}
&__left {
flex: 0 0 47%;
@media (min-width: $screen-xxl) {
flex: 0 0 47%;
}
@media (min-width: $screen-c) {
flex: 0 0 49%;
}
@media (min-width: $screen-md) {
display: flex;
flex-direction: column;
justify-content: space-between;
}
}
&__left-textarea{
flex: 1 0 auto;
}
&__right {
@media (min-width: $screen-lg) {
@media (min-width: $screen-xxl) {
margin-top: 50px;
flex: 0 0 47%;
}
@media (min-width: $screen-c) {
flex: 0 0 49%;
margin-top: 40px;
}
@media (min-width: $screen-md) {
margin-top: 39px;
flex: 0 0 47%;
display: flex;
flex-direction: column;
justify-content: space-between;
}
}
&__label {
width: 100%;
p {
margin-bottom: 0;
}
}
&__input {
......@@ -253,7 +324,7 @@
font: 12px/1.3 $ff-i-r;
letter-spacing: 0.05em;
@media (min-width: $screen-lg) {
@media (min-width: $screen-xxl) {
font-size: 14px;
}
}
......@@ -276,10 +347,31 @@
border: 1px solid #336D69;
transition: all $transition-time;
@media (min-width: $screen-xxl) {
min-height: 103px;
}
@media (min-width: $screen-xl) {
min-height: 96px;
}
@media (min-width: $screen-lg) {}
@media (min-width: $screen-md) {
margin-bottom: 0;
height: 100%;
}
&::placeholder {
color: $placeholder-color;
font: 14px/1.3 $ff-i-r;
font: 12px/1.3 $ff-i-r;
letter-spacing: 0.05em;
@media (min-width: $screen-xxl) {
font-size: 14px;
}
}
&:focus {
......@@ -293,15 +385,25 @@
margin: 0;
margin-bottom: 18px;
@media (min-width: $screen-lg) {
@media (min-width: $screen-xxl) {
margin-bottom: 24px;
font-size: 20px;
}
@media (min-width: $screen-c) {
font-size: 17px;
margin-bottom: 16px;
}
@media (min-width: $screen-md) {
margin-bottom: 16px;
}
}
&__submit {
width: 113px;
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
width: 100%;
}
}
......@@ -311,18 +413,27 @@
margin-bottom: 16px;
@media (min-width: $screen-xxl) {
padding-top: 24px;
padding-top: 16px;
padding-bottom: 24px;
}
@media (min-width: $screen-xl) {
padding-top: 4px;
padding-bottom: 4px;
padding-top: 8px;
padding-bottom: 16px;
}
@media (min-width: $screen-lg) {
padding: 8px 0 8px;
padding-left: 40px;
}
@media (min-width: $screen-md) {
margin-bottom: 0;
padding: 24px 0;
padding: 8px 0 24px;
padding-left: 40px;
flex: 1 0 auto;
display: flex;
align-items: center;
}
}
......@@ -354,7 +465,7 @@
font-weight: 700;
transition: color $transition-time;
&:hover{
&:hover {
color: $main-light;
}
}
......@@ -384,7 +495,7 @@
.message-mob {
display: block;
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
display: none;
}
}
......@@ -392,8 +503,13 @@
.message-desc {
display: none;
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
display: block;
}
.footer-form__textarea {}
}
.footer-form__label.message-desc {
height: 100%;
}
\ No newline at end of file
......@@ -84,9 +84,13 @@ mixin page-header(mods)
svg.page-header__search-btn(width='23' height='22' viewBox='0 0 23 22' fill='none' xmlns='http://www.w3.org/2000/svg')
path(d='M9.11 17.22C13.589 17.22 17.22 13.589 17.22 9.11C17.22 4.63097 13.589 1 9.11 1C4.63097 1 1 4.63097 1 9.11C1 13.589 4.63097 17.22 9.11 17.22Z' stroke='#00E68A' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round' fill='none')
path(d='M15.52 14.28L21.6 20.36' stroke='#00E68A' stroke-width='2' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round' fill='none')
.search-block
.search-block.fix-block
.search-block__inner.container
.search-block__content
button.search-block__close.search-block-close.btn-reset
svg(width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg')
path(d='M15.625 4.375L4.375 15.625' stroke='#014945' stroke-width='2' stroke-linecap='round' stroke-linejoin='round')
path(d='M15.625 15.625L4.375 4.375' stroke='#014945' stroke-width='2' stroke-linecap='round' stroke-linejoin='round')
label.search-block__label Введите запрос
input.search-block__input(type="search" name="" placeholder="Поиск по сайту")
svg.search-block__btn(width='20' height='18' viewBox='0 0 20 18' fill='none' xmlns='http://www.w3.org/2000/svg')
......@@ -95,7 +99,7 @@ mixin page-header(mods)
.page-header__lang
a(href="javascript:void(0)").page-header__lang-btn ENG
#callback-popup(style="display:none;max-width:440spx;").popup.callback-popup
#callback-popup(style="display:none;max-width:440px;").popup.callback-popup
.callback-popup__title.h4 Обратный звонок
.callback-popup__text
p.text Оставьте свои контакты, и мы перезвоним Вам в ближайшее время.
......
......@@ -21,10 +21,12 @@
@media (min-width: $screen-xl) {
padding: 32px 0 24px;
align-items: flex-start;
}
@media (min-width: $screen-lg) {
padding: 24px 0 12px;
@media (min-width: $screen-md) {
padding: 24px 0 24px;
align-items: center;
}
@media (min-width: $screen-sm) {
......@@ -38,11 +40,29 @@
order: 1;
@media (min-width: $screen-xxl) {
margin-right: 78px;
margin-right: 64px;
width: 24%;
}
@media (min-width: $screen-c) {
width: 23%;
}
@media (min-width: $screen-xl) {
width: 22%;
width: 250px;
margin-right: 0;
max-height: 39px;
}
@media (min-width: $screen-lg) {
margin-right: 50px;
max-height: 33px;
}
@media (min-width: $screen-md) {
margin-right: 50px;
max-height: 33px;
width: 210px;
}
@media (min-width: $screen-sm) {
......@@ -58,15 +78,25 @@
@media (min-width: $screen-xxl) {
justify-content: flex-start;
width: 40%;
order: 2;
}
@media (min-width: $screen-c) {
width: 30%;
}
@media (min-width: $screen-xl) {
width: 40%;
width: 34%;
order: 2;
}
@media (min-width: $screen-lg) {
width: 12%;
width: 15%;
}
@media (min-width: $screen-md) {
width: 17%;
}
}
......@@ -77,12 +107,21 @@
display: flex;
justify-content: center;
@media (min-width: $screen-xxl) {
order: 3;
width: 32%;
}
@media (min-width: $screen-c) {
width: 21%;
}
@media (min-width: $screen-xl) {
order: 3;
width: 30%;
width: 26%;
}
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
justify-content: space-between;
}
......@@ -102,6 +141,7 @@
&__phone {
display: none;
text-decoration: none;
color: $main-light;
font: 14px $ff-i-b;
......@@ -114,10 +154,15 @@
}
@media (min-width: $screen-lg) {
font-size: 17px;
margin-bottom: 8px;
display: block;
}
@media (min-width: $screen-md) {
display: block;
font-size: 17px;
}
}
&__magnify {
......@@ -125,7 +170,7 @@
position: relative;
}
&__search-btn path{
&__search-btn path {
transition: all $transition-time;
}
......@@ -144,8 +189,8 @@
}
}
&:hover{
.page-header__search-btn path{
&:hover {
.page-header__search-btn path {
stroke: $white;
}
}
......@@ -179,20 +224,27 @@
justify-content: flex-end;
@media (min-width: $screen-xxl) {
padding-top: 80px;
padding-right: 86px;
padding-top: 66px;
padding-right: 96px;
}
@media (min-width: $screen-xl) {
padding-top: 52px;
padding-right: 36px;
padding-right: 84px;
}
@media (min-width: $screen-lg) {
padding-right: 214px;
}
@media (min-width: $screen-md) {
}
@media (min-width: $screen-md) {}
}
&__close{
position: absolute;
right: 24px;
width: 20px;
height: 20px;
}
&__content {
......@@ -297,9 +349,8 @@
font-size: 15px;
}
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
display: block;
;
}
}
......@@ -322,6 +373,12 @@
@media (min-width: $screen-xxl) {
width: auto;
display: block;
}
@media (min-width: $screen-c) {
display: flex;
justify-content: center;
}
@media (min-width: $screen-xl) {
......@@ -360,7 +417,7 @@
height: 100%;
z-index: 99;
background: linear-gradient(0deg, #00BFFF 0%, #00E68A 100%);
padding: 24px 32px;
padding: 24px 16px;
transition: right $transition-time;
}
......@@ -377,7 +434,7 @@
left: -24%;
width: 24%;
height: 100%;
background: rgba(1,73,69,.48);
background: rgba(1, 73, 69, .48);
transition: all $transition-time;
......@@ -452,6 +509,9 @@
pointer-events: none;
transition: all $transition-time;
@media (min-width: $screen-xxl) {
top: 10px;
}
@media (min-width: $screen-xl) {
display: block;
top: 8px;
......@@ -522,7 +582,7 @@
}
& .menu__sublist {
padding-top: 24px;
padding-top: 16px;
max-height: 500px;
opacity: 1;
}
......@@ -593,7 +653,7 @@
&__subitem {
position: relative;
padding: 8px 24px;
padding: 8px 16px;
cursor: pointer;
transition: all $transition-time;
......@@ -607,8 +667,8 @@
@media (min-width: $screen-xl) {
background-color: $white;
&:not(:last-child){
border-bottom: 1px solid #E3E3E3;
&:not(:last-child) {
border-bottom: 1px solid #E3E3E3;
}
}
......@@ -635,10 +695,17 @@
}
&__sublink {
color: $main-dark;
text-decoration: none;
@media (min-width: $screen-xxl) {
font-size: 18px !important;
}
@media (min-width: $screen-xl) {
font-size: 15px !important;
}
}
&__burger {
......@@ -662,7 +729,7 @@
width: 30px;
}
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
margin-right: 16px;
}
......@@ -705,9 +772,12 @@
white-space: nowrap;
@media (min-width: $screen-lg) {
font-size: 15px;
font-weight: 700;
}
@media (min-width: $screen-md) {
font-size: 15px;
}
}
&__top {
......
......@@ -123,7 +123,7 @@ body {
left: 0px;
width: 100%;
height: 100%;
background: rgba(1,73,69,.48);
background: rgba(1, 73, 69, .48);
z-index: 10;
transition: all $transition-time;
}
......@@ -374,21 +374,23 @@ pre {
@media (min-width: $screen-xxl) {
--container-width: calc(1460px - var(--container-horizontal-padding) * 2);
--container-horizontal-padding: 15px;
}
@media (min-width: $screen-c) {
--container-horizontal-padding: 60px;
}
@media (min-width: $screen-xl) {
--container-horizontal-padding: 15px;
--container-width: calc(1020px - var(--container-horizontal-padding) * 2);
--container-horizontal-padding: 40px;
}
@media (min-width: $screen-lg) {
--container-horizontal-padding: 15px;
--container-width: calc(828px - var(--container-horizontal-padding) * 2);
--container-horizontal-padding: 40px;
}
@media (min-width: $screen-md) {
--container-horizontal-padding: 15px;
--container-width: calc(600px - var(--container-horizontal-padding) * 2);
--container-horizontal-padding: 16px;
}
}
......@@ -419,12 +421,20 @@ pre {
.partners-slider__title {
background: linear-gradient(270deg, #00bfff -.23%, #00e68a 99.77%);
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
margin-bottom: 32px;
@media (min-width: $screen-lg) {
margin-bottom: 56px;
@media (min-width: $screen-xxl) {
margin-bottom: 92px;
}
@media (min-width: $screen-c) {
margin-bottom: 80px;
}
@media (min-width: $screen-md) {
margin-bottom: 80px;
}
}
......@@ -436,6 +446,7 @@ pre {
background-color: $white;
border: 1px solid #e3e3e3;
border-radius: 4px;
height: 100%;
}
.choices__item {
......@@ -452,6 +463,13 @@ pre {
}
}
.choices[data-type*=select-one] {
height: 100%;
}
.choices[data-type*=select-one] .choices__inner {
padding-top: 9.5px;
}
.is-focused .choices__inner,
.is-open .choices__inner {
......@@ -532,7 +550,7 @@ pre {
}
}
.mb-64 {
.mt-64 {
margin-top: 48px;
@media (min-width: $screen-lg) {
......@@ -540,6 +558,18 @@ pre {
}
}
.mb-section-80 {
margin-bottom: 40px;
@media (min-width: $screen-xxl) {
margin-bottom: 80px;
}
@media (min-width: $screen-md) {
margin-bottom: 72px;
}
}
//fancybox
.popup>.carousel__button.is-close {
......@@ -550,11 +580,13 @@ pre {
color: #336D69;
padding: 0;
}
.carousel__button svg{
width: 18px;
height: 18px;
.carousel__button svg {
width: 18px;
height: 18px;
filter: none;
}
.fancybox__content :focus:not(.carousel__button.is-close) {
outline: none;
}
......@@ -611,6 +643,7 @@ height: 18px;
background-color: $main-light;
}
}
.custom-checkbox--white {
font: 12px/1.3 $ff-i-r;
......@@ -651,4 +684,8 @@ height: 18px;
}
}
.disable-scroll {
position: relative;
overflow: hidden;
height: 100vh;
}
\ No newline at end of file
......@@ -8,9 +8,13 @@
$block-name: &; // #{$block-name}__element
margin-bottom: 86px;
@media (min-width: $screen-lg) {
margin-bottom: 120px;
@media (min-width: $screen-xxl) {
margin-bottom: 152px;
}
@media (min-width: $screen-c) {
margin-bottom: 80px;
}
&__title {
background: linear-gradient(270deg, #00BFFF -0.23%, #00E68A 99.77%);
......
......@@ -13,17 +13,23 @@
margin-top: 80px;
z-index: -1;
@media (min-width: $screen-xl) {
padding-bottom: 120px;
}
@media (min-width: $screen-lg) {
margin-top: 204px;
@media (min-width: $screen-xxl) {
padding-bottom: 108px;
margin-top: 206px;
}
@media (min-width: $screen-c) {
padding-bottom: 100px;
margin-bottom: 0;
}
@media (min-width: $screen-xl) {
padding-bottom: 18px;
margin-top: 194px;
}
@media (min-width: $screen-md) {
margin-top: 100px;
margin-top: 166px;
padding-bottom: 70px;
margin-bottom: 80px;
}
@media (min-width: $screen-sm) {
......@@ -37,6 +43,13 @@
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
@media (min-width: $screen-xxl) {
margin-bottom: 56px;
}
@media (min-width: $screen-md) {
margin-bottom: 46px;
}
}
&__grid {
......@@ -46,7 +59,7 @@
grid-template-columns: repeat(1, 1fr);
gap: 40px;
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
grid-template-columns: repeat(4, 1fr);
}
......@@ -72,6 +85,9 @@
margin-bottom: 32px;
}
@media (min-width: $screen-md) {
margin-bottom: 24px;
}
@media (min-width: $screen-sm) {
margin-bottom: 8px;
}
......
......@@ -56,6 +56,7 @@ padding-top: 48px;
&__search {
@media (min-width: $screen-lg) {
width: 120px;
padding-left: 6px;
}
}
......
......@@ -8,9 +8,10 @@
margin: 48px 0;
@media (min-width: $screen-lg){
@media (min-width: $screen-lg) {
margin: 80px 0 64px;
}
&__list {
padding: 0;
......@@ -38,14 +39,10 @@
}
&:hover {
.project-tasks__body {
background: linear-gradient(0deg, rgba(64, 119, 115, 0.85), rgba(64, 119, 115, 0.85)), url("../img/fill-img.jpg");
background-repeat: no-repeat;
background-color: $main-dark;
background-position: right center;
background-size: cover;
.project-tasks__body::after {
opacity: 1;
}
.project-tasks__title {
color: $white;
......@@ -54,6 +51,7 @@
}
&__body {
position: relative;
text-decoration: none;
box-shadow: 0px 8px 32px rgba(0, 0, 0, 0.05);
border-radius: 16px;
......@@ -69,9 +67,28 @@
background-size: cover;
transition: all $transition-time;
&::after {
position: absolute;
content: '';
top: 0;
left: 0;
border-radius: 16px;
width: 100%;
height: 100%;
cursor: pointer;
opacity: 0;
background: linear-gradient(0deg, rgba(64, 119, 115, 0.85), rgba(64, 119, 115, 0.85)), url("../img/fill-img.jpg");
background-repeat: no-repeat;
background-color: $main-dark;
background-position: right center;
background-size: cover;
transition: all .5s;
}
@media (min-width: $screen-xxl) {
padding: 48px;
}
@media (min-width: $screen-lg) {
padding: 36px;
flex: 0 0 25%;
......@@ -83,8 +100,10 @@
&__title {
color: $black;
font: 14px/1.5 $ff-i-sb;
z-index: 2;
transition: color $transition-time;
@media (min-width: $screen-xl) {
font-size: 18px;
......
......@@ -4,41 +4,44 @@
.solutions-grid {
$block-name: &; // #{$block-name}__element
$block-name: &; // #{$block-name}__element
margin: 0;
list-style: none;
padding: 0;
display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 16px;
z-index: 7;
filter: drop-shadow(0px 8px 32px rgba(0, 0, 0, 0.24));
transform: translateY(20px);
@media (min-width: $screen-c) {
margin: 0;
list-style: none;
padding: 0;
display: grid;
grid-template-columns: repeat(12, 1fr);
gap: 16px;
z-index: 7;
filter: drop-shadow(0px 8px 32px rgba(0, 0, 0, 0.24));
transform: translateY(20px);
gap: 40px;
}
@media (min-width: $screen-xxl) {
margin: 0;
gap: 40px;
}
@media (min-width: $screen-xl) {
margin: 0 20%;
}
@media (min-width: $screen-xl) {
margin: 0 14%;
row-gap: 32px;
column-gap: 40px;
}
@media (min-width: $screen-lg) {
margin: 0 13%;
}
@media (min-width: $screen-lg) {
margin: 0 6%;
row-gap: 32px;
column-gap: 40px;
}
@media (min-width: $screen-md) {
margin: 0 4%;
row-gap: 32px;
column-gap: 40px;
}
&__item {
grid-column: 12 span;
background-color: $black;
border-radius: 16px;
position: relative;
background-repeat: no-repeat;
background-color: $black;
background-position: center center;
......@@ -50,16 +53,22 @@
@media (min-width: $screen-xxl) {
grid-column: 3 span;
height: 320px;
aspect-ratio: 1/1;
}
@media (min-width: $screen-c) {
grid-column: 3 span;
height: 200px;
}
@media (min-width: $screen-xl) {
grid-column: 6 span;
width: 320px;
aspect-ratio: 1/1;
height: 320px;
}
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
grid-column: 6 span;
width: 320px;
height: 200px;
......@@ -70,13 +79,35 @@
}
&:nth-child(1) {
background-image: url("../img/a1.jpg");
position: relative;
// &::before {
// content: '';
// position: absolute;
// width: 100%;
// height: 100%;
// background: rgba(0, 0, 0, 0.48);
// opacity: 0;
// top: 0;
// left: 0;
// z-index: 1;
// pointer-events: none;
// }
&:hover {
// &::before {
// opacity: 1;
// }
background-image: url("../img/a2.jpg");
}
}
&:nth-child(2) {
background-image: url("../img/b1.jpg");
......@@ -84,6 +115,7 @@
background-image: url("../img/b2.jpg");
}
}
&:nth-child(3) {
background-image: url("../img/c1.jpg");
......@@ -91,6 +123,7 @@
background-image: url("../img/c2.jpg");
}
}
&:nth-child(4) {
background-image: url("../img/d1.jpg");
......@@ -98,6 +131,7 @@
background-image: url("../img/d2.jpg");
}
}
&:nth-child(5) {
background-image: url("../img/e1.jpg");
......@@ -105,6 +139,7 @@
background-image: url("../img/e2.jpg");
}
}
&:nth-child(6) {
background-image: url("../img/f1.jpg");
......@@ -112,6 +147,7 @@
background-image: url("../img/f2.jpg");
}
}
&:nth-child(7) {
background-image: url("../img/g1.jpg");
......@@ -119,6 +155,7 @@
background-image: url("../img/g2.jpg");
}
}
&:nth-child(8) {
background-image: url("../img/h1.jpg");
......@@ -136,17 +173,22 @@
width: 100%;
height: 100%;
@media (min-width: $screen-lg) {
@media (min-width: $screen-c) {
padding: 32px;
}
@media (min-width: $screen-md) {
padding: 16px;
padding: 24px;
}
}
&__subtitle {
margin: 0;
color: $white;
z-index: 2;
@media (min-width: $screen-md) {
font-size: 20px;
}
}
}
}
\ No newline at end of file
......@@ -22,10 +22,10 @@ mixin solutions(text, mods)
.solutions__inner.container
.solutions__content
.solutions__top
.solutions__top-title.h3 Advanced Digital Solutions
.solutions__top-title Advanced Digital Solutions
.solutions__top-descr
p.solutions__top-text.text Команда профессионалов высокой квалификации проводит обследование, консалтинг, выбор оптимальных параметров проектного решения, реализацию, внедрение, сопровождение и поддержку.
p.solutions__top-text.text Мы предлагаем набор планов и возможностей, инноваций и связанных с ними технологических решений, которые помогают компаниям и промышленным предприятиям перейти на новые уровни автоматизации и цифровизации.
p.solutions__top-text.text Наши Заказчики — основные предприятия реального сектора экономики: энергетики, нефтегазодобычи, промышленного производства. Наши продукты помогают им контролировать критическую инфраструктуру, обеспечивают аналитику для принятия управленческих решений, оптимизируют сложные технологические процессы.
p.solutions__top-text.text Наши Заказчики&nbsp;&mdash; основные предприятия реального сектора экономики: энергетики, нефтегазодобычи, промышленного производства. Наши продукты помогают им&nbsp;контролировать критическую инфраструктуру, обеспечивают аналитику для принятия управленческих решений,<br> оптимизируют сложные технологические процессы.
h2.solutions__title.h2 Решения
+solutions-grid()
\ No newline at end of file
......@@ -12,10 +12,6 @@
margin-top: 0px;
}
@media (min-width: $screen-lg) {
margin-top: 22px;
}
@media (min-width: $screen-md) {
margin-top: 24px;
}
......@@ -26,22 +22,29 @@
&__content {
transform: translateY(6px);
padding-bottom: 20px;
@media (min-width: $screen-xxl) {
transform: translateY(80px);
}
@media (min-width: $screen-lg) {
transform: translateY(60px);
@media (min-width: $screen-c) {
transform: translateY(73px);
}
@media (min-width: $screen-xl) {
transform: translateY(73px);
padding-bottom: 0;
}
@media (min-width: $screen-md) {
transform: translateY(24px);
transform: translateY(48px);
}
@media (min-width: $screen-sm) {
transform: translateY(18px);
padding-bottom: 50px;
}
}
......@@ -49,22 +52,42 @@
@media (min-width: $screen-xxl) {
margin-bottom: 72px;
}
@media (min-width: $screen-c) {
margin-bottom: 66px;
}
@media (min-width: $screen-md) {
margin-bottom: 66px;
}
}
&__top-title {
font: 25px/1.2 $ff-i-b;
font-weight: 700;
letter-spacing: 0.02em;
margin-bottom: 16px;
@media (min-width: $screen-xxl) {
margin-bottom: 32px;
font-size: 36px;
}
@media (min-width: $screen-c) {
margin-bottom: 24px;
font-size: 26px;
}
@media (min-width: $screen-lg) {
margin-bottom: 24px;
}
@media (min-width: $screen-md) {
margin-bottom: 20px;
margin-bottom: 24px;
}
@media (min-width: $screen-sm) {
margin-bottom: 20px;
}
}
&__top-descr {
......@@ -81,6 +104,9 @@
@media (min-width: $screen-lg) {
margin-bottom: 24px;
}
@media (min-width: $screen-md) {
margin-bottom: 26px;
}
@media (min-width: $screen-sm) {
margin-bottom: 18px;
......@@ -91,8 +117,14 @@
color: $white;
margin: 0;
@media (min-width: $screen-lg) {
margin-bottom: 12px;
@media (min-width: $screen-xxl) {
margin-bottom: 32px;
}
@media (min-width: $screen-c) {
margin-bottom: 20px;
}
@media (min-width: $screen-md) {
margin-bottom: 16px;
}
}
......
......@@ -7,6 +7,7 @@
$block-name: &;
margin-bottom: 40px;
@media (min-width: $screen-lg) {
margin-bottom: 64px;
}
......@@ -24,19 +25,21 @@
list-style: none;
padding-left: 20px;
margin-bottom: 40px;
@media (min-width: $screen-lg) {
padding-left: 26px;
margin-bottom: 80px;
margin-bottom: 64px;
}
}
&__item {
position: relative;
margin-bottom: 8px;
font-size: 18px;
color: $black;
p{
p {
margin: 0;
}
......@@ -48,6 +51,7 @@
width: 10px;
height: 10px;
background-color: $color-accent;
@media (min-width: $screen-lg) {
left: -26px;
}
......@@ -57,4 +61,44 @@
margin-bottom: 26px;
}
}
}
.task--links .task__item::before {
background-color: #fff;
}
.task--links {
margin-top: 64px;
.hyperlink__link {
color: $black;
width: fit-content;
transition: color $transition-time;
&:hover {
color: $white;
.hyperlink__svg svg path {
stroke: #fff;
}
}
}
.hyperlink__svg {
padding-left: 8px;
display: inline-block;
}
.hyperlink__svg svg path {
transition: all $transition-time;
}
}
.task__list.task__list--inner {
margin-bottom: 24px;
@media (min-width: $screen-lg) {
margin-bottom: 24px;
}
}
\ No newline at end of file
......@@ -28,17 +28,17 @@ mixin top-slider(text, mods)
.top-slider__descr
p Разработка комплексных программных продуктов на&nbsp;заказ, реализация решений в&nbsp;области цифровизации производства и&nbsp;снижения импортозависимости.
.swiper-slide.top-slider__slide
.top-slider__img(style="background-image: url(img/slider2.jpg);")
.top-slider__img(style="background-image: url(img/bgrd_solutions-mon.jpg);")
.top-slider__inner.container
.top-slider__body
h2.top-slider__title Advanced Digital Solutions
h2.top-slider__title Комплексные программные продукты
.top-slider__descr
p Разработка комплексных программных продуктов на&nbsp;заказ, реализация решений в&nbsp;области цифровизации производства и&nbsp;снижения импортозависимости.
p Мы предлагаем набор планов и возможностей, инноваций, которые помогают компаниям которые помогают компаниям и промышленным предприятиям перейти на новые уровни автоматизации и цифровизации.
.swiper-slide.top-slider__slide
.top-slider__img(style="background-image: url(img/slider1.jpg);")
.top-slider__img(style="background-image: url(img/bgrd_ind-cif.jpg);")
.top-slider__inner.container
.top-slider__body
h2.top-slider__title Advanced Digital Solutions
h2.top-slider__title Технологические решения для предприятий
.top-slider__descr
p Разработка комплексных программных продуктов на&nbsp;заказ, реализация решений в&nbsp;области цифровизации производства и&nbsp;снижения импортозависимости.
.top-slider__wrapper.container
......
......@@ -9,33 +9,50 @@
position: relative;
&__inner {
height: 100%;
}
&__body {
max-width: 540px;
padding: 10% 0 19%;
max-width: calc(100% - 32px);
display: flex;
flex-direction: column;
justify-content: center;
height: calc(100% - 30px);
@media (min-width: $screen-xxl) {
max-width: 960px;
padding: 154px 136px 272px;
padding-left: 136px;
}
@media (min-width: $screen-c) {
max-width: 1092px;
padding-left: 80px;
height: calc(100% - 120px);
}
@media (min-width: $screen-xl) {
max-width: 670px;
padding: 6% 0 17% 10%;
max-width: 773px;
padding-left: 100px;
height: calc(100% - 112px);
}
@media (min-width: $screen-lg) {
padding: 8% 0 17% 10%;
max-width: 540px;
max-width: 635px;
padding-left: 80px;
height: calc(100% - 76px);
}
@media (min-width: $screen-md) {
padding: 5% 0 11% 0%;
max-width: 547px;
max-width: 473px;
padding-left: 66px;
height: calc(100% - 76px);
}
@media (min-width: $screen-sm) {
padding: 5% 0 10%;
max-width: 547px;
}
}
......@@ -45,6 +62,24 @@
background-color: $main-light;
background-position: center center;
background-size: cover;
height: 344px;
@media (min-width: $screen-xxl) {
height: 780px;
}
@media (min-width: $screen-c) {
height: 488px;
}
@media (min-width: $screen-lg) {
height: 488px;
}
@media (min-width: $screen-md) {
height: 377px;
}
}
......@@ -53,19 +88,29 @@
font-weight: 600;
color: $white;
margin: 0 0 14px;
-webkit-line-clamp: 3;
text-overflow: ellipsis;
display: flex;
display: -webkit-box;
-webkit-box-orient: vertical;
flex-direction: column;
overflow: hidden;
@media (min-width: $screen-xxl) {
font-size: 80px;
}
@media (min-width: $screen-lg) {
font-size: 56px;
margin: 0 0 24px;
@media (min-width: $screen-c) {
margin: 0 0 16px;
}
@media (min-width: $screen-lg) {}
@media (min-width: $screen-md) {
margin: 0 0 30px;
margin: 0 0 16px;
font-size: 40px;
}
@media (min-width: $screen-sm) {
margin: 0 0 24px;
}
......@@ -73,14 +118,25 @@
}
&__descr {
font: 18px/1.5 $ff-i-sb;
font: 16px/1.5 $ff-i-sb;
font-weight: 600;
color: $black;
margin: 0;
letter-spacing: .02em;
@media (min-width: $screen-xxl) {
font-size: 24px;
}
p{
-webkit-line-clamp: 3;
text-overflow: ellipsis;
display: flex;
display: -webkit-box;
-webkit-box-orient: vertical;
flex-direction: column;
overflow: hidden;
}
}
&__nav {
......@@ -94,8 +150,12 @@
z-index: 5;
padding: 0;
@media (min-width: $screen-lg) {
@media (min-width: $screen-xl) {
bottom: 100px;
}
@media (min-width: $screen-md) {
bottom: 60px;
width: 40px;
}
......@@ -107,8 +167,9 @@
opacity: .5;
transition: all $transition-time;
}
&:hover{
svg path{
&:hover {
svg path {
opacity: 1;
}
}
......@@ -122,9 +183,12 @@
right: 0%;
padding: 0;
@media (min-width: $screen-lg) {
right: 0;
@media (min-width: $screen-xl) {
bottom: 100px;
}
@media (min-width: $screen-md) {
bottom: 60px;
width: 40px;
}
......@@ -136,8 +200,9 @@
opacity: .5;
transition: all $transition-time;
}
&:hover{
svg path{
&:hover {
svg path {
opacity: 1;
}
}
......@@ -149,26 +214,36 @@
&__pagination {
display: flex;
justify-content: center;
bottom: 20px !important;
left: 37% !important;
bottom: 30px !important;
width: var(--container-width) !important;
max-width: 960px;
max-width: 200px;
@media (min-width: $screen-xxl) {
bottom: 118px !important;
left: 10% !important;
}
@media (min-width: $screen-c) {
bottom: 112px !important;
left: 10% !important;
justify-content: flex-start;
}
@media (min-width: $screen-xl) {
bottom: 100px !important;
left: 14% !important;
bottom: 112px !important;
justify-content: flex-start;
}
@media (min-width: $screen-lg) {
bottom: 100px !important;
left: 17% !important;
left: 12% !important;
}
@media (min-width: $screen-md) {
bottom: 76px !important;
left: 11% !important;
justify-content: flex-start;
max-width: 500px;
}
@media (min-width: $screen-sm) {
......@@ -190,7 +265,7 @@
opacity: 1;
transition: all $transition-time;
&:hover{
&:hover {
background-color: $white;
}
}
......
<svg width="24" height="29" viewBox="0 0 24 29" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2.71672 14.1858C2.1311 14.7718 1.18135 14.772 0.595402 14.1864C0.00944948 13.6008 0.0091809 12.6511 0.594802 12.0651L2.71672 14.1858ZM12 2.77539L10.939 1.71503L12 0.65347L13.0609 1.71503L12 2.77539ZM23.4052 12.0651C23.9908 12.6511 23.9905 13.6008 23.4046 14.1864C22.8186 14.772 21.8689 14.7718 21.2832 14.1858L23.4052 12.0651ZM0.594802 12.0651L10.939 1.71503L13.0609 3.83575L2.71672 14.1858L0.594802 12.0651ZM13.0609 1.71503L23.4052 12.0651L21.2832 14.1858L10.939 3.83575L13.0609 1.71503Z" fill="#00E68A"/>
<path d="M10.4995 3.0271C10.4995 2.19867 11.1711 1.5271 11.9995 1.5271C12.8279 1.5271 13.4995 2.19867 13.4995 3.0271H10.4995ZM13.4995 26.7755C13.4995 27.6039 12.8279 28.2755 11.9995 28.2755C11.1711 28.2755 10.4995 27.6039 10.4995 26.7755H13.4995ZM13.4995 3.0271L13.4995 26.7755H10.4995L10.4995 3.0271H13.4995Z" fill="#00E68A"/>
</svg>
<svg width="24" height="29" viewBox="0 0 24 29" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2.71721 14.4104C2.13159 14.9964 1.18184 14.9967 0.59589 14.411C0.00993776 13.8254 0.00966918 12.8757 0.59529 12.2897L2.71721 14.4104ZM12.0005 3L10.9395 1.93964L12.0005 0.87808L13.0614 1.93964L12.0005 3ZM23.4057 12.2897C23.9913 12.8757 23.991 13.8254 23.4051 14.411C22.8191 14.9967 21.8694 14.9964 21.2837 14.4104L23.4057 12.2897ZM0.59529 12.2897L10.9395 1.93964L13.0614 4.06036L2.71721 14.4104L0.59529 12.2897ZM13.0614 1.93964L23.4057 12.2897L21.2837 14.4104L10.9395 4.06036L13.0614 1.93964Z" fill="white"/>
<path d="M10.5 3.25195C10.5 2.42353 11.1716 1.75195 12 1.75195C12.8284 1.75195 13.5 2.42353 13.5 3.25195H10.5ZM13.5 27.0004C13.5 27.8288 12.8284 28.5004 12 28.5004C11.1716 28.5004 10.5 27.8288 10.5 27.0004H13.5ZM13.5 3.25195L13.5 27.0004H10.5L10.5 3.25195H13.5Z" fill="white"/>
<svg width="23" height="24" viewBox="0 0 23 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2.71672 14.1858C2.1311 14.7718 1.18135 14.772 0.595402 14.1864C0.00944948 13.6008 0.0091809 12.6511 0.594802 12.0651L2.71672 14.1858ZM12 2.77539L10.939 1.71503L12 0.65347L13.0609 1.71503L12 2.77539ZM23.4052 12.0651C23.9908 12.6511 23.9905 13.6008 23.4046 14.1864C22.8186 14.772 21.8689 14.7718 21.2832 14.1858L23.4052 12.0651ZM0.594802 12.0651L10.939 1.71503L13.0609 3.83575L2.71672 14.1858L0.594802 12.0651ZM13.0609 1.71503L23.4052 12.0651L21.2832 14.1858L10.939 3.83575L13.0609 1.71503Z" fill="#FFFFFF"/>
<path d="M10.4995 3.0271C10.4995 2.19867 11.1711 1.5271 11.9995 1.5271C12.8279 1.5271 13.4995 2.19867 13.4995 3.0271H10.4995ZM13.4995 26.7755C13.4995 27.6039 12.8279 28.2755 11.9995 28.2755C11.1711 28.2755 10.4995 27.6039 10.4995 26.7755H13.4995ZM13.4995 3.0271L13.4995 26.7755H10.4995L10.4995 3.0271H13.4995Z" fill="#FFFFFF"/>
</svg>
src/img/bgrd_contacts.jpg

31.9 KB | W: | H:

src/img/bgrd_contacts.jpg

94.4 KB | W: | H:

src/img/bgrd_contacts.jpg
src/img/bgrd_contacts.jpg
src/img/bgrd_contacts.jpg
src/img/bgrd_contacts.jpg
  • 2-up
  • Swipe
  • Onion skin
src/img/bgrd_error.jpg

145 KB | W: | H:

src/img/bgrd_error.jpg

557 KB | W: | H:

src/img/bgrd_error.jpg
src/img/bgrd_error.jpg
src/img/bgrd_error.jpg
src/img/bgrd_error.jpg
  • 2-up
  • Swipe
  • Onion skin
src/img/bgrd_news.jpg

198 KB | W: | H:

src/img/bgrd_news.jpg

679 KB | W: | H:

src/img/bgrd_news.jpg
src/img/bgrd_news.jpg
src/img/bgrd_news.jpg
src/img/bgrd_news.jpg
  • 2-up
  • Swipe
  • Onion skin
src/img/bgrd_projects.jpg

106 KB | W: | H:

src/img/bgrd_projects.jpg

411 KB | W: | H:

src/img/bgrd_projects.jpg
src/img/bgrd_projects.jpg
src/img/bgrd_projects.jpg
src/img/bgrd_projects.jpg
  • 2-up
  • Swipe
  • Onion skin
src/img/bgrd_search.jpg

108 KB | W: | H:

src/img/bgrd_search.jpg

438 KB | W: | H:

src/img/bgrd_search.jpg
src/img/bgrd_search.jpg
src/img/bgrd_search.jpg
src/img/bgrd_search.jpg
  • 2-up
  • Swipe
  • Onion skin
src/img/bgrd_solutions.jpg

72 KB | W: | H:

src/img/bgrd_solutions.jpg

271 KB | W: | H:

src/img/bgrd_solutions.jpg
src/img/bgrd_solutions.jpg
src/img/bgrd_solutions.jpg
src/img/bgrd_solutions.jpg
  • 2-up
  • Swipe
  • Onion skin
src/img/branch1.jpg

145 KB | W: | H:

src/img/branch1.jpg

254 KB | W: | H:

src/img/branch1.jpg
src/img/branch1.jpg
src/img/branch1.jpg
src/img/branch1.jpg
  • 2-up
  • Swipe
  • Onion skin
src/img/branch2.jpg

180 KB | W: | H:

src/img/branch2.jpg

177 KB | W: | H:

src/img/branch2.jpg
src/img/branch2.jpg
src/img/branch2.jpg
src/img/branch2.jpg
  • 2-up
  • Swipe
  • Onion skin
src/img/branch3.jpg

347 KB | W: | H:

src/img/branch3.jpg

282 KB | W: | H:

src/img/branch3.jpg
src/img/branch3.jpg
src/img/branch3.jpg
src/img/branch3.jpg
  • 2-up
  • Swipe
  • Onion skin
src/img/comm.jpg

104 KB | W: | H:

src/img/comm.jpg

320 KB | W: | H:

src/img/comm.jpg
src/img/comm.jpg
src/img/comm.jpg
src/img/comm.jpg
  • 2-up
  • Swipe
  • Onion skin
src/img/control.jpg

257 KB | W: | H:

src/img/control.jpg

311 KB | W: | H:

src/img/control.jpg
src/img/control.jpg
src/img/control.jpg
src/img/control.jpg
  • 2-up
  • Swipe
  • Onion skin
src/img/disp.jpg

141 KB | W: | H:

src/img/disp.jpg

340 KB | W: | H:

src/img/disp.jpg
src/img/disp.jpg
src/img/disp.jpg
src/img/disp.jpg
  • 2-up
  • Swipe
  • Onion skin
......@@ -46,12 +46,20 @@ window.addEventListener("load", () => {
speed: 1500,
pagination: {
el: '.top-slider__pagination',
clickable: true,
clickable: true,
},
navigation: {
nextEl: '.top-slider__next',
prevEl: '.top-slider__prev',
},
breakpoints: {
320: {
speed: 1000,
},
1710: {
speed: 1250,
},
}
});
}
......@@ -79,7 +87,7 @@ window.addEventListener("load", () => {
slidesPerView: 2,
spaceBetween: 0
},
992: {
768: {
slidesPerView: 3,
spaceBetween: 0
},
......@@ -168,86 +176,147 @@ window.addEventListener("load", () => {
if (gradientAccordeon) {
function GradientAccordeon() {
const accordeonContents = document.querySelectorAll('.accordeon__content');
const accordeonBtns = document.querySelectorAll('.accordeon__btn');
// function GradientAccordeon() {
const accordeonContents = document.querySelectorAll('.accordeon__content');
const accordeonBtns = document.querySelectorAll('.accordeon__btn');
accordeonBtns.forEach((btn, index) => {
btn.addEventListener('click', () => {
accordeonBtns.forEach((btnItem, idx) => {
accordeonBtns.forEach((btn, index) => {
btn.addEventListener('click', () => {
accordeonBtns.forEach((btnItem, idx) => {
if (btnItem === btn) {
const accordeonelement = btn.closest('.accordeon__element');
const collapseBtn = accordeonelement.querySelector('.collapse__btn');
accordeonelement.classList.toggle('open');
if (btnItem === btn) {
const accordeonelement = btn.closest('.accordeon__element');
const collapseBtn = accordeonelement.querySelector('.collapse__btn');
accordeonelement.classList.toggle('open');
collapseBtn.addEventListener('click', () => {
accordeonelement.classList.remove('open');
})
}
})
collapseBtn.addEventListener('click', () => {
accordeonelement.classList.remove('open');
})
}
})
})
}
GradientAccordeon();
})
// }
// GradientAccordeon();
// window.addEventListener('resize', GradientAccordeon);
}
/*-- Search --*/
const searchBtn = document.querySelector('.search-btn');
const body = document.querySelector('body');
if (searchBtn) {
searchBtn.addEventListener('click', () => {
const searchBlock = document.querySelector('.search-block');
searchBlock.classList.toggle('active');
searchBtn.classList.toggle('active');
document.body.classList.toggle('lock');
const timeout = 400;
const fixBlocks = document.querySelectorAll('.fix-block');
searchBtn.addEventListener('click', function (e) {
searchBlockOpen();
})
const searchInput = document.querySelector('.search-block input')
function searchBlockOpen() {
const searchBlock = document.querySelector('.search-block');
searchBlock.classList.add('active');
// searchBtn.classList.add('active');
searchBodyLock();
searchInput.addEventListener('focus', function () {
const searchIcon = document.querySelector('.search-block__btn');
const searchPaths = document.querySelectorAll('.search-block__btn path');
searchBlock.addEventListener('click', function (e) {
console.log(e.target)
if (!e.target.closest('.search-block')) {
searchPaths.forEach(searchPath => {
searchPath.style.stroke = '#00E68A';
searchBlockClose(e.target.closest('.search-block'));
}
})
})
}
function searchBlockClose(doUnlock = true) {
const searchBlock = document.querySelector('.search-block');
searchBlock.classList.remove('active');
searchBtn.classList.remove('active');
searchBodyUnlock();
}
const serchBlockItem = document.querySelectorAll('.search-block-close');
if (serchBlockItem.length > 0) {
for (let i = 0; i < serchBlockItem.length; i++) {
const el = serchBlockItem[i];
el.addEventListener('click', function (e) {
searchBlockClose(el.closest('.search-block'));
e.preventDefault();
})
}
}
function searchBodyLock() {
let paddingOffset = window.innerWidth - body.offsetWidth + "px";
body.style.paddingRight = paddingOffset;
fixBlocks.forEach((el) => {
el.style.paddingRight = paddingOffset;
})
body.classList.add('lock');
}
function searchBodyUnlock() {
body.style.paddingRight = 0;
fixBlocks.forEach((el) => {
el.style.paddingRight = 0;
})
body.classList.remove('lock');
}
// const searchInput = document.querySelector('.search-block input')
// searchInput.addEventListener('focus', function () {
// const searchIcon = document.querySelector('.search-block__btn');
// const searchPaths = document.querySelectorAll('.search-block__btn path');
// searchPaths.forEach(searchPath => {
// searchPath.style.stroke = '#00E68A';
// })
// })
}
/*-- Thanks popup --*/
// const body = document.querySelector('body');
// const popupBtn = document.querySelector('.popup-submit');
/*--Collapse--*/
const topElement = document.querySelector('.accordeon')
if (topElement) {
let topPosition = topElement.offsetTop;
// let unlock = true;
const collapseBtns = document.querySelectorAll('.collapse__btn');
collapseBtns.forEach((collapseBtn) => {
collapseBtn.addEventListener('click', (e) => {
scrollTo(topElement);
})
})
function scrollTo(element) {
window.scroll({
behavior: 'smooth',
left: 0,
top: topPosition
});
}
}
// const timeout = 400;
// popupBtn.addEventListener('click', function (e) {
// const popupName = popupBtn.getAttribute('data-id').replace('#', '');
// const currentPopup = document.getElementById(popupName);
// popupOpen(currentPopup);
// console.log(currentPopup);
// })
/*--Fancybox--*/
// function popupOpen(currentPopup) {
// if (currentPopup && unlock) {
// const popupActive = document.querySelector('.popup.open');
// if (popupActive) {
// popupClose(popupActive, false);
// } else {
// bodyLock();
// Fancybox.bind('[data-fancybox="trigger"]', {
// closeButton: true,
// // dragToClose: false,
// // click: false,
// on : {
// ready : (fancybox) => {
// const previousPOpup = document.querySelector('[data-fancybox="trigger"]');
// console.log(previousPOpup);
// }
// currentPopup.classList.add('open');
// body.style.overflow = 'hidden';
// currentPopup.addEventListener('click', function (e) {
// if (!e.target.closest('.popup')) {
// popupClose(e.target.closest('.popup'));
// }
// })
// }
// }
// });
});
This diff is collapsed.
......@@ -11,7 +11,7 @@ block meta
block content
+inner-wrapper()
+inner-wrapper-top(style="background-image: url(img/slider2.jpg);")
+inner-wrapper-top(style="background-image: url(img/bgrd_solutions-mon.jpg);")
+breadcrumbs()
+breadcrumbs-item('Главная', '/')
+breadcrumbs-item('Решения', '/')
......
......@@ -29,16 +29,35 @@ block content
p.text-block__text.text Для реализации проекта была приглашена компания ИНЛАЙН ГРУП, специалисты которой предложили собственные инновационные методические подходы и&nbsp;технические решения, с&nbsp;помощью которых удалось реализовать управление сетью терминальных устройств значительно проще и&nbsp;с&nbsp;меньшими затратами, чем это могло быть при выборе другого решения.
p.text-block__text.text Принципиальной особенностью предложенного решения было использование методологии управления ИТ-активами (ITAM) для управления жизненным циклом терминальных устройств.
p.text-block__text.text Первым шагом в&nbsp;этом направлении стало формирование единых требований банка для оптимизации процесса управления сетью терминального оборудования. Проектной командой ИНЛАЙН ГРУП совместно с&nbsp;командой заказчика были разработаны: описание процесса управления сетью терминальных устройств, техническое задание на&nbsp;настройку системы, требования к&nbsp;интеграциям, а&nbsp;также алгоритмы выполнения стандартных запросов на&nbsp;обслуживание.
section.text-block
p.text-block__text.text-bold Автоматизация процесса управления сетью терминальных устройств самообслуживания и POS-терминалов позволила:
ul.task__list.task__list--inner
li.task__item
p.text Постановка на учет;
li.task__item
p.text Перемещения;
li.task__item
p.text Обновления и ремонты;
li.task__item
p.text Изменения атрибутов;
li.task__item
p.text Постановка и снятие с сервисного обслуживания; изменение сервисной компании.
li.task__item
p.text Сократить время на интеграцию данных о новых устройствах.
p.text-block__text.text Еще одной особенностью реализованного проекта стало внедрение единого централизованного решения на&nbsp;базе уже существующей в&nbsp;банке ITSM-системы НРE Service Manager&nbsp;9.30. HPE Service Manager&nbsp;&mdash; широко распространенный и&nbsp;хорошо зарекомендовавший себя на&nbsp;российском рынке продукт для автоматизации ITSM-процессов. Он&nbsp;обладает большой гибкостью настройки бизнес-логики и&nbsp;кастомизации, что позволяет быть уверенным в&nbsp;возможности построения самых разнообразных процессов с&nbsp;учетом требований заказчиков.
p.text-block__text.text Разработанные специалистами&nbsp;ИГ на&nbsp;базе HP&nbsp;SM&nbsp;решения позволили расширить функционал ITSM-продукта и&nbsp;реализовать универсальное управление активами, в&nbsp;том числе не&nbsp;относящимися к&nbsp;ИТ. Для конечных пользователей, не&nbsp;связанных с&nbsp;эксплуатацией IMAC-процессов, взаимодействие с&nbsp;системой реализовано в&nbsp;максимально привычной форме через портал самообслуживания. Использование в&nbsp;полной мере функционала multi-tennancy позволило достичь удовлетворяющей заказчика изолированности рабочих сред для различных подразделений.
p.text-block__text.text Помимо этого, внедренная система позволила учитывать выполнение работ на&nbsp;стороне внешних контрагентов, что дало возможность банку обеспечить взаимодействие и&nbsp;контроль над бизнес-процессами в&nbsp;режиме реального времени.
p.text-block__text.text В&nbsp;рамках проекта система НРE Service Manager была интегрирована с&nbsp;информационно-банковской системой, MS&nbsp;Active Directory и&nbsp;программным комплексом по&nbsp;управлению информационно-платежными терминалами и&nbsp;устройствами АТМ (Automatic Teller Machine). Кроме этого, была выполнена загрузка данных из&nbsp;систем по&nbsp;управлению POS-терминалами (Unipos, TMS).
section.text-block.mb-section-80
.text-block__inner.container
h2.text-block__h2.h2-inner Результат
p.text-block__text.text-bold Автоматизация процесса управления сетью терминальных устройств самообслуживания и POS-терминалов позволила:
ul.task__list
ul.task__list.task__list--inner
li.task__item
p.text Обеспечить руководство банка возможностью получать объективную статистическую информацию о работе и обслуживании устройств, работе поддерживающих подразделений, а также принимать эффективные управленческие решения на основе этих данных;
li.task__item
p.text Повысить темпы внедрения новых банковских продуктов за счет владения достоверной информацией о работе терминальных устройств и процедурах обслуживания;
li.task__item
li.task__item
p.text Организовать работу в системе с внешними контрагентами в рамках единого процесса;
li.task__item
p.text Улучшить контроль исполнения поставщиками и сервисными организациями своих обязательств;
......@@ -51,7 +70,7 @@ block content
p.text-block__text.text Большой опыт компании-исполнителя в&nbsp;применении методологий ITSM и&nbsp;ITAM для организации процессов управления информационными технологиями позволил решить широкий спектр бизнес-задач без серьезного увеличения бюджета заказчика. Это дало возможность не&nbsp;закупать еще одно специализированное и&nbsp;дорогостоящее решение, а&nbsp;быстро применить существующий функционал для реализации принципиально новых задач.
p.text-block__text.text Результаты внедрения убедительно демонстрируют уникальные преимущества использования методик ITSM для управления активами в&nbsp;сферах деятельности, традиционно контролируемыми сложными и&nbsp;дорогими системами класса ERP.
ul.download.mb-64
ul.download.mt-64
li.download__item
.download__body
.download__pic
......
......@@ -155,9 +155,14 @@
top: -31px;
background-color: $main-light;
@media (min-width: 2100px) {
height: 170px;
}
@media (min-width: $screen-xl) {
top: 0;
}
@media (min-width: $screen-md) {
top: -24px;
}
......@@ -171,11 +176,16 @@
&:after {
transform-origin: 100%;
bottom: -32px;
background-color: $color-accent;
background-color: $white;
z-index: -1;
@media (min-width: 2100px) {
bottom: -150px;
height: 150px;
}
@media (min-width: $screen-sm) {
bottom: -80px;
bottom: -100px;
}
}
}
......@@ -209,9 +219,9 @@
background: linear-gradient(270deg, #44D0FF -0.23%, #33FFAD 99.77%);
}
&:focus {
outline: 2px solid #64D8FF;
}
// &:focus {
// outline: 2px solid #64D8FF;
// }
&:active {
border: none;
......@@ -232,7 +242,7 @@
.h2 {
margin: 0;
font: 28px/1.2 $ff-i-sb;
font: 26px/1.2 $ff-i-sb;
font-weight: 600;
letter-spacing: 0.02em;
......@@ -240,8 +250,8 @@
font-size: 72px;
}
@media (min-width: $screen-lg) {
font-size: 60px;
@media (min-width: $screen-md) {
font-size: 42px;
}
}
......@@ -294,11 +304,11 @@
letter-spacing: 0.05em;
margin: 0;
@media (min-width: $screen-xxl) {
@media (min-width: $screen-c) {
font-size: 20px;
}
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
font-size: 17px;
}
}
......@@ -314,7 +324,7 @@
font-size: 18px;
}
@media (min-width: $screen-lg) {
@media (min-width: $screen-md) {
font-size: 15px;
}
}
......@@ -354,20 +364,16 @@
font-size: 24px;
}
}
.info {
font: 12px/1.3 $ff-i-r;
letter-spacing: 0.05em;
@media (min-width: $screen-xxl) {
font-size: 14px;
font-size: 14px;
}
}
.pt-16 {
padding-top: 16px;
}
}
\ No newline at end of file
......@@ -99,6 +99,7 @@ $screen-sm: 576px;
$screen-md: 768px;
$screen-lg: 992px;
$screen-xl: 1200px;
$screen-c: 1480px;
$screen-xxl: 1800px;
$container-sm: 100%;
......
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