html {
scroll-behavior: smooth;
}
head,body{
margin: 0;
padding: 0;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{
margin-bottom: 0;
}
img{
width: 100%;
height: auto;
}
dl, ol, ul{
margin-top: 0;
margin-bottom: 0;
}
*{
transition: .3s;
}
select{
background: url(images/br_down.webp) no-repeat right #ddd;
-webkit-appearance: none;
background-position-x: calc(100% - 10px);
background-size: 12px;
}
.header__services__content select,.online-recording select{
background: url(images/down_white.svg) no-repeat right;
background-position-x: calc(100% - 10px);
background-size: 12px;
}
svg:not(.none_h):hover path{
fill: #D9398D;
}
@font-face {
font-family: "IBM Plex Sans";
src: url("fonts/IBM_Plax_Sans/IBMPlexSans-Bold.ttf");
font-weight: 700;
font-display: swap;
}
@font-face {
font-family: "IBM Plex Sans";
src: url("fonts/IBM_Plax_Sans/IBMPlexSans-Regular.ttf");
font-weight: 400;
font-display: swap;
}
@font-face {
font-family: "IBM Plex Sans";
src: url("fonts/IBM_Plax_Sans/IBMPlexSans-Medium.ttf");
font-weight: 500;
font-display: swap;
}
@font-face {
font-family: "Raleway";
src: url("fonts/Raleway/Raleway-Bold.ttf");
font-weight: 700;
font-display: swap;
}
@font-face {
font-family: "Raleway";
src: url("fonts/Raleway/Raleway-Regular.ttf");
font-weight: 400;
font-display: swap;
}
h1{
font-size: 84px;
color: #fff;
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
}
h2{
font-size: 64px;
color: #fff;
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
}
p{
margin-bottom: 0;
}
@media (min-width: 1440px) {
.container, .container-lg, .container-md, .container-sm, .container-xl {
max-width: 1240px;
}
}
@media (max-width: 991px) {
h1{
font-size: 64px;
color: #fff;
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
}
h2{
font-size: 50px;
color: #fff;
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
}
}
@media (max-width: 767px) {
h1{
font-size: 54px;
color: #fff;
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
}
h2{
font-size: 40px;
color: #fff;
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
}
}
@media (max-width: 575px) {
h1{
font-size: 34px;
color: #fff;
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
}
h2{
font-size: 36px;
color: #fff;
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
}
}
a:hover{
text-decoration: unset;
}
.home{
background-color: #161616;
}
.services{
background-color: #161616;
}
.header{
display: flex;
position: relative;
}
.header__menu ul li a:hover{
color: #D14494;
}
.header__menu {
width: 100%;
display: flex;
justify-content: flex-end;
align-items: center;
}
.header__menu ul{
list-style-type: none;
display: flex;
justify-content: flex-end;
}
.hamburger__menu{
display: none;
}
.hamburger__menu span{
display: block;
width: 20px;
height: 2px;
background-color: #FFFFFF;
margin-bottom: 5px;
}
.hamburger__menu div{
display: flex;
margin-bottom: 5px;
}
.hamburger__menu div span:nth-of-type(1){
width: 3px;
height: 3px;
border-radius: 50%;
background-color: #FFFFFF;
margin-right: 4px;
margin-bottom: 0;
}
.hamburger__menu div span:nth-of-type(2){
width: 13px;
margin-bottom: 0;
}
.header__menu ul li a.header__number{
border-bottom: 1px dashed rgba(255,255,255,0.6);
font-family: 'IBM Plex Sans', sans-serif;
color: #ffff;
font-weight: 500;
font-size: 14px;
opacity: 1;
margin-left: 40px;
}
.section__header.active .container{
height: 100%;
}
.header__menu ul li a.header__number:hover{
color:#D9398D;
border-bottom: 1px solid rgba(217, 57, 141,0.6);
}
.header__menu ul li a{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 400;
font-size: 14px;
color: #FFFFFF;
opacity: .85;
margin-left: 53px;
}
.header__menu ul li:last-child a{
opacity: 1;
text-transform: uppercase;
color: #ffff;
font-size: 11px;
font-weight: 700;
font-family: 'IBM Plex Sans', sans-serif;
background: linear-gradient(93.03deg, #D9398D 0%, #6DC6E3 137.2%);
padding: 10px 40px;
letter-spacing: 0.13em;
transition: .5s all;
}
.button__colored{
text-transform: uppercase;
color: #ffff;
font-size: 11px;
font-weight: 700;
font-family: 'IBM Plex Sans', sans-serif;
background: linear-gradient(93.03deg, #D9398D 0%, #6DC6E3 137.2%);
padding: 10px 40px;
letter-spacing: 0.13em;
box-shadow: 0 4px 44px rgba(217, 57, 141, 0.55);
transition: .5s all;
position: relative;
}
.button__colored span{
position: relative;
z-index: 3;
}
.button__colored:after{
z-index: 2;
opacity: 0;
content: '';
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
transition: 0.5s all;
display: flex;
justify-content: center;
align-items: center;
background: transparent;
}
.button__colored:hover {
color: #fff;
background-color: transparent;
}
.button__colored:hover:after{
z-index: 2;
opacity: 1;
width: 100%;
background: linear-gradient(93.03deg, #6DC6E3 0%, #D9398D 137.2%);
box-shadow: 0px 8px 14px rgba(217, 57, 141, 0.25);
color: #fff;
position: absolute;
left: 0;
top:0
}
.button__colored:focus, .button__colored:active{
background: linear-gradient(93.03deg, #6DC6E3 0%, #D9398D 137.2%);
box-shadow: 0 0 0 transparent;
color: #fff;
}
.mobile__menu{
display: none;
}
.header__phone{
display: none;
}
@media only screen and (max-width: 1200px){
.header__menu ul li a{
font-size: 12px;
margin-left: 35px;
}
.header__menu ul li a.header__number{
font-size: 12px;
}
.header__menu ul li:last-child a{
font-size: 10px;
padding: 7px 30px;
}
}
@media only screen and (max-width: 991px) {
.header__phone{
display: block;
position: absolute;
right: 50px;
top: 25px;
}
header.active{
position: fixed;
z-index: 999;
width: 100%;
background-color: #161616;
}
.hamburger__menu.active div{
display: none;
}
.hamburger__menu.active span{
margin-bottom: 0;
}
.hamburger__menu.active{
top: 38px;
}
.hamburger__menu.active span:nth-of-type(1){
transform: rotate(45deg);
position: absolute;
}
.hamburger__menu.active span:nth-of-type(2){
transform: rotate(-45deg);
}
.hamburger__menu{
display: flex;
flex-direction: column;
justify-content: center;
position: absolute;
right: 0;
top: 30px;
}
.header__menu{
display: none;
}
.mobile__menu{
background-color: #ffffff;
transition: unset;
}
.active .mobile__menu{
height: calc(100vh - 65px);
z-index: 999;
width: 100%;
position: fixed;
}
.mobile__menu ul{
list-style-type: none;
border-bottom: 1px solid rgba(0, 0, 0, 0.3);
padding-left: 0;
padding-bottom: 30px;
padding-top: 16px;
}
.mobile__menu ul li{
margin-top: 16px;
}
.mobile__menu ul li a{
font-family: 'IBM Plex Sans', sans-serif;
font-style: normal;
font-weight: 700;
font-size: 24px;
color: #161616;
}
.mobile__menu__contacts{
padding-top: 32px;
padding-bottom: 80px;
}
.section__first{
transition: unset;
}
.section__first.active{
padding-top: 207px;
}
.mobile__menu__contacts a{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
font-size: 24px;
color: #000000;
border-bottom: 1px dashed rgba(0, 0, 0, 0.6);
}
.mobile__menu__contacts p{
font-family: 'Raleway' , sans-serif;
font-weight: 500;
font-size: 13px;
color: #000000;
margin-top: 17px;
}
.mobile__menu-neworks{
display: flex;
margin-top: 25px;
}
.mobile__menu-neworks a{
border: unset;
}
.mobile__menu-neworks a svg{
margin-right: 30px;
max-width: 29px;
}
}
@media only screen and (max-width: 767px){
.header__logo svg{
max-width: 150px;
}
}
.arrow__slider{
background-color: transparent;
border: none;
}
.arrow__slider:focus,.arrow__slider:hover,.arrow__slider:active{
border: none;
outline: none
}
.arrow__slider svg, .arrow__slider path{
fill: #a2a2a2;
}
.first__slider__buttons{
position: absolute;
right: 0;
transform: translateY(40px) translateX(-10px);
z-index: 3;
}
.section__first{
padding-top: 130px;
}
.section__first .container{
position: relative;
}
.section__first__title h1{
text-align: center;
margin-bottom: 20px;
}
.section__first p{
font-family: 'IBM Plex Sans' , sans-serif;
font-weight: 400;
font-size: 14px;
text-align: center;
color: #fff;
margin-top: 30px;
}
.section__first__title{
position: relative;
}
@media only screen and (max-width: 767px){
.section__first p{
font-size: 12px;
}
}
.welcome-image img{
position: absolute;
top: 35px;
right: 19.3%;
animation: ease lightning 2s forwards infinite;
animation-delay: 1s;
max-width: 197px;
z-index: 2;
}
.about{
padding-top: 130px;
overflow: hidden;
}
.about__screens{
display: flex;
align-items: flex-end;
flex-wrap: wrap;
}
.about__main{
display: flex;
}
.about__first__image{
display: flex;
align-items: flex-end;
}
.about__first__image img{
width: 100%;
}
.about__icon-text{
display: flex;
align-items: center;
cursor: pointer;
}
.about__icon-text:hover{
color: #D9398D;
}
.about__icon-text svg{
transition: .3s all;
}
.about__icon-text:hover svg path{
fill: #D9398D;
}
.about__icon-text svg{
margin-right: 25px;
max-width: 36px;
}
.about__icon-text svg:hover + p{
color: #D9398D;
}
.about__icon-text p{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 400 ;
font-size: 14px;
color: #FFFFFF;
transition: .3s all;
}
.about__icon-text:hover p,.about__icon-text p:hover{
color: #D9398D;
}
.about__first__title{
margin-left: 30px;
margin-top: 30px;
position: relative;
}
.first__title__buttons{
display: flex;
align-items: center;
width: max-content;
}
.first__title__buttons:hover .youtube__button{
border: 2px solid #ffffff;
}
.yeah-image{
position: absolute;
top: -40%;
right: -30%;
animation: ease lightning 1.7s forwards infinite;
animation-delay: 1.7s;
}
.about__first__title p{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 400;
font-size: 14px;
color: #FFFFFF;
}
.about__first__title p:nth-of-type(1){
margin-top: 30px;
}
.about__first__title p:nth-of-type(2){
margin-top: 25px;
margin-bottom: 30px;
}
.about__first__title a{
font-family: 'IBM Plex Sans' , sans-serif;
font-weight: 500;
font-size: 16px;
color: #FFFFFF;
border-bottom: 1px dashed rgba(255,255,255,0.6);
transition: .3s;
}
.about__first__title a:hover{
border-bottom: 1px solid rgb(255,255,255);
}
.about__icon-text{
margin-top: 20px;
}
.about__icon-text:nth-of-type(2) img{
height: 36px;
width: 36px;
}
@media only screen and (min-width: 992px) and (max-width: 1200px){
.about__first__image{
display: flex;
align-items: flex-end;
}
}
@media only screen and (max-width: 991px){
.about__main{
flex-wrap: wrap;
}
.about__first__title{
margin-left: 0;
}
.about__second-screen{
margin-top: 80px;
}
.about__icon-text p{
font-size: 16px;
}
.about__first-screen{
padding-left: 0;
}
.yeah-image svg{
max-width: 250px;
}
.yeah-image{
position: absolute;
top: -20%;
right: 25%;
animation: ease lightning 1s forwards infinite;
animation-delay: .7s;
}
}
@media only screen and (max-width: 767px){
.yeah-image svg{
max-width: 200px;
}
.yeah-image{
position: absolute;
top: -15%;
right: 20%;
animation: ease lightning 1s forwards infinite;
animation-delay: .7s;
}
}
@media only screen and (max-width: 575px) {
.about__first__title a{
font-size: 14px;
}
.about__first__title{
margin-top: 50px;
}
.yeah-image svg{
max-width: 150px;
}
.yeah-image{
position: absolute;
top: -17%;
right: -7%;
animation: ease lightning 1s forwards infinite;
animation-delay: .7s;
}
}
.our__price{
padding-top: 130px;
}
.our__price-info{
margin-top: 55px;
}
.info-service{
display: flex;
border-bottom: 1px solid rgba(255, 255, 255, 0.65);
margin-top: 35px;
position: relative;
z-index: 2;
}
.info-service p:hover{
color: #D9398D;
transition: .3s;
}
.info-service .col-sm-3{
display: flex;
align-items: flex-end;
padding-left: 0;
z-index: 2;
}
.info-service .col-sm-7{
display: flex;
align-items: flex-end;
}
.info-service .col-sm-2{
display: flex;
justify-content: flex-end;
align-items: flex-end;
padding-right: 0;
}
.info-service a{
font-family: 'IBM Plex Sans' , sans-serif;
font-weight: 500;
font-size: 24px;
color: #FFFFFF;
}
.info-service .col-sm-7 p{
font-family: 'IBM Plex Sans' , sans-serif;
font-weight: 400;
font-size: 18px;
color: #FFFFFF;
display: flex;
align-items: center;
}
.info-service .col-sm-2 p{
font-family: 'IBM Plex Sans' , sans-serif;
font-weight: 600;
font-size: 30px;
color: #FFFFFF;
}
.info-service .col-sm-4{
display: flex;
align-items: flex-end;
padding-left: 0;
}
.info-service .col-sm-4 p{
font-family: 'IBM Plex Sans' , sans-serif;
font-weight: 500;
font-size: 24px;
color: #FFFFFF;
}
.info-service .col-sm-6{
display: flex;
align-items: flex-end;
}
.info-service .col-sm-6 p{
font-family: 'IBM Plex Sans' , sans-serif;
font-weight: 400;
font-size: 17px;
color: #FFFFFF;
display: flex;
align-items: center;
}
.info-service__circle{
display: flex;
}
.info-service__last.col-lg-9{
padding-right: 0;
}
.circle__button{
display: flex;
align-items: flex-end;
position: relative;
}
.circle__button a{
position: relative;
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
font-size: 20px;
color: #FFFFFF;
background: linear-gradient(0deg, #D9398D, #D9398D), #D9398D;
border-radius: 50%;
text-align: center;
padding: 61px 25px;
display: block;
transition: 0.5s;
}
.circle__button:after{
position: absolute;
content: 'Записаться на прием';
display: block;
background-color: #6DC6E3;
width: 100%;
height: 100%;
border-radius: 50%;
z-index: -1;
bottom: -5px;
left: 18px;
transition: .5s all;
-ms-flex: 0 0 66.666667%;
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
font-size: 20px;
color: #FFFFFF;
text-align: center;
padding: 61px 25px;
height: max-content;
}
@media only screen and (min-width: 992px){
.our__price .circle__button:after{
flex: 0 0 calc(66.666667% - 15px);
max-width: calc(66.666667% - 15px);
}
}
@media only screen and (max-width: 1199px) and (min-width: 992px){
.our__price .circle__button:after{
left: 52%;
top: 51%;
transform: translate(-50%, -50%);
}
}
.circle__button a:hover{
transform: scale(1.25);
}
.circle__button a:hover + .circle__button:after{
transform: scale(1.25);
}
.circle__button.active:after{
transform: scale(1.25);
}
.info-service__circle .our__price-info{
margin-top: 0;
}
.our__price-title h2{
text-align: center;
}
.our__price-title .our__price-title__button{
display: flex;
justify-content: center;
}
.hidden__block{
background-color: #BA397C;
padding: 20px 20px 50px 20px;
margin-top: 30px;
z-index: 1;
display: none;
}
.hidden__block-main{
display: flex;
margin-top: 40px;
flex-wrap: wrap;
}
.hidden__block h4{
font-family: 'IBM Plex Sans', sans-serif;
font-style: normal;
font-weight: 500;
font-size: 18px;
color: #FFFFFF;
}
.hidden__block-info{
display: flex;
flex-direction: column;
align-items: center;
}
.hidden__block-info svg{
max-width: 50px;
}
.hidden__block-info svg:hover path{
fill: #ffffff!important;
}
.hidden__block-info p{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
font-size: 16px;
color: #FFFFFF;
text-align: center;
margin-top: 10px;
}
.our__price-title a{
color: #D9398D;
border-bottom: 1px dashed #D9398D;
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
font-size: 18px;
margin-top: 30px;
width: max-content;
transition: .3s;
}
.our__price-title a:hover{
color: #D9398D;
border-bottom: 1px solid #D9398D;
}
@media only screen and (max-width: 1199px){
.circle__button a, .circle__button:after{
padding: 40px 15px;
}
.circle__button{
align-items: center;
justify-content: center;
}
}
@media only screen and (max-width: 991px){
.hidden__block h4{.our__price-title a
text-align: center;
}
.hidden__block-main{
margin-top: 0;
}
.hidden__block-info{
margin-top: 30px;
}
.info-service__circle .circle__button {
display: none;
}
.info-service a{
font-size: 20px;
}
.info-service .col-sm-7 p{
font-size: 15px;
}
.info-service .col-sm-2 p{
font-size: 25px;
}
.info-service__last.col-lg-9{
padding-left: 0;
}
.info-service .col-sm-2 p{
font-family: 'IBM Plex Sans' , sans-serif;
font-weight: 600;
font-size: 25px;
color: #FFFFFF;
}
.yeah-image svg{
max-width: 200px;
max-height: 170px;
}
}
@media only screen and (max-width: 767px){
.info-service a{
font-size: 15px;
}
.info-service .col-sm-7 p{
font-size: 13px;
}
.info-service .col-sm-2 p{
font-size: 20px;
}
.hidden__block h4{
font-size: 15px;
}
.hidden__block-info p{
font-size: 13px;
}
}
@media only screen and (max-width: 575px){
.info-service{
flex-direction: column;
position: relative;
}
.info-service .col-sm-2{
position: absolute;
right: 0;
}
.info-service .col-sm-7{
padding-left: 0;
margin-top: 15px;
}
.hidden__block-info svg{
max-width: 40px;
}
}
.promotional__offers{
padding-top: 130px;
position: relative;
overflow: hidden;
}
.promotional__offers__title h2{
position: relative;
width: max-content;
}
.promotional__offers__title h2:after{
position: absolute;
content: '';
background-image: url(images/Gramophone.png);
top: -50%;
right: -54%;
animation: ease lightning 1.7s forwards infinite;
animation-delay: 1.7s;
width: 177px;
height: 165px;
}
.offers__info{
display: flex;
margin-top: 40px;
flex-wrap: wrap;
}
.offers__first__screen{
background-image: url("images/offers-back-first.png");
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
background-color: rgba(0, 0, 0, 0.5);
background-blend-mode: multiply;
padding: 30px 0 30px 35px;
}
.offers__first__screen svg{
max-width: 200px;
}
.barbershop__image{
position: absolute;
top: 15px;
left: 125px;
animation: ease lightning 1.8s forwards infinite;
animation-delay: 1.8s;
}
.barbershop__second-image{
position: absolute;
bottom: -20px;
right: -30px;
animation: ease lightning 1.9s forwards infinite;
animation-delay: 1.9s;
}
.offers__second__screen{
background-image: url("images/offers-back-second.png");
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
background-color: rgba(0, 0, 0, 0.5);
background-blend-mode: multiply;
display: flex;
flex-direction: column;
padding: 77px 32px 50px 32px;
}
.offers__info a{
border: 2px solid #6DC6E3;
border-image: linear-gradient(93.03deg, #D9398D 0%, #6DC6E3 137.2%);
border-image-slice: 1;
padding: 10px 40px;
}
.offers__second__screen svg{
max-width: 220px;
}
.second__screen__image{
height: 100%;
display: flex;
align-items: flex-end;
justify-content: flex-end;
}
.offers__second__screen a{
text-transform: uppercase;
font-family: 'Raleway' , sans-serif;
font-style: normal;
font-weight: 700;
font-size: 11px;
letter-spacing: 0.13em;
color: #FFFFFF;
width: max-content;
}
.offers__second__screen p{
font-family: 'IBM Plex Sans',sans-serif;
font-style: normal;
font-weight: 700;
font-size: 51px;
color: #FFFFFF;
margin-bottom: 35px;
}
.button__transparent{
text-transform: uppercase;
font-family: 'Raleway' , sans-serif;
font-style: normal;
font-weight: 700;
font-size: 11px;
letter-spacing: 0.13em;
color: #FFFFFF;
width: max-content;
}
.button__transparent:hover{
background: linear-gradient(93.03deg, #D9398D 0%, #6DC6E3 137.2%);
border: 2px solid rgba(255, 255, 255, 0.4);
color: #fff;
box-shadow: 0px 4px 44px rgba(217, 57, 141, 0.55);
}
.offers__first__screen p{
margin: 60px 0 25px 0;
font-family: 'IBM Plex Sans',sans-serif;
font-style: normal;
font-weight: 700;
font-size: 51px;
color: #FFFFFF;
}
@media only screen and (max-width: 991px) {
.offers__first__screen{
padding-bottom: 40px;
}
.offers__second__screen{
margin-top: 40px;
}
.second__screen__image{
justify-content: flex-start;
margin-top: 65px;
align-items: flex-start;
}
.barbershop__second-image{
left: 20%;
right: unset;
bottom: -15px;
}
}
@media only screen and (max-width: 575px){
.offers__first__screen p{
font-size: 30px;
margin-top: 30px;
}
.offers__second__screen p{
font-size: 40px;
}
}
@media only screen and (max-width: 420px){
.offers__second__screen p{
font-size: 30px;
}
}
.section__online-recording{
padding-top: 80px;
}
.online-recording{
background: linear-gradient(314.82deg, rgba(255, 255, 255, 0.06) 28.66%, rgba(255, 255, 255, 0.24) 94.66%);
box-shadow: 0 1px 24px -1px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(58px);
padding: 30px 0 100px 0;
}
.online-recording__title p{
text-align: center;
font-family: 'IBM Plex Sans' , sans-serif;
font-weight: 700;
font-size: 21px;
color: #FFFFFF;
}
.online-recording__form{
display: flex;
justify-content: space-between;
margin-top: 60px;
padding: 0 20%;
}
.form__data{
background-color: unset;
border: 1px solid #FFFFFF;
box-sizing: border-box;
border-radius: 2px;
padding: 10px 25px 10px 10px;
font-family: 'Raleway' , sans-serif;
font-weight: 400;
font-size: 12px;
color: rgba(255, 255, 255, 0.6);
width: inherit;
}
.form__data option{
background-color: #242424;
}
select.form__data{
padding-bottom: 8px;
}
select:disabled{
opacity: .3;
}
.online-recording__form input{
background-color: unset;
border: 1px solid #FFFFFF;
box-sizing: border-box;
border-radius: 2px;
padding: 10px 20px 10px 10px;
font-family: 'Raleway' , sans-serif;
font-weight: 400;
font-size: 12px;
color: rgba(255, 255, 255, 0.6);
width: 100%;
}
.online-recording__form input::placeholder{
color: rgba(255, 255, 255, 0.6);
}
.form__data__title p{
font-family: 'Raleway', sans-serif;
font-weight: 400;
font-size: 12px;
color: #FFFFFF;
opacity: 0.6;
}
.form__button{
display: flex;
align-items: center;
}
.form__button a{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 700;
font-size: 11px;
text-align: center;
letter-spacing: 0.15em;
text-transform: uppercase;
color: #FFFFFF;
background: linear-gradient(93.03deg, #D9398D 0%, #6DC6E3 137.2%);
padding: 11px 40px;
}
.service__drop-down{
display: flex;
position: absolute;
left: 50%;
transform: translatex(-50%);
bottom: 25px;
cursor: pointer;
}
.service__drop-down span{
background-color: #ffffff;
width: 20px;
height: 3px;
display: block;
}
.service__drop-down span:nth-of-type(1){
position: relative;
left: 7px;
transform: rotate(45deg);
}
.service__drop-down span:nth-of-type(2){
transform: rotate(-45deg);
}
@media only screen and (max-width: 1439px) {
.form__data{
width: 100%;
padding-right: 20px;
}
}
@media only screen and (max-width: 1199px) {
.online-recording__form input{
font-size: 10px;
}
.form__data{
font-size: 10px;
padding-right: 10px;
}
.online-recording__form input{
font-size: 10px;
padding-right: 10px;
}
}
@media only screen and (max-width: 991px) {
.home .online-recording__form{
flex-wrap: wrap;
text-align: center;
}
.home .form__number{
margin-top: 30px;
}
.home .form__button{
justify-content: center;
padding-right: 0;
margin-top: 30px;
}
.home .form__button a{
width: 100%;
}
.online-recording__form div:nth-of-type(2n){
padding-right: 0;
}
.online-recording__form div:nth-of-type(2n + 1){
padding-right: 0;
padding-left: 0;
}
.header__services-form .online-recording__form div:nth-of-type(2n + 1){
padding-left: 15px;
}
.popup__form .online-recording__form div:nth-of-type(2n + 1){
padding-right: 15px;
padding-left: 15px;
}
.online-recording__form .date-time .col-md-8{
padding-left: 0!important;
padding-right: 15px!important;
}
.online-recording__form .date-time .col-md-4{
padding-left: 0!important;
padding-right: 15px!important;
}
}
@media only screen and (max-width: 767px){
.online-recording__form div:nth-of-type(2n){
padding-left: 0;
}
.home .form__button{
padding-left: 0;
}
.home .form__button a{
max-width: 230px;
}
.online-recording__form div:nth-of-type(2){
text-align: center;
display: flex;
justify-content: center;
align-items: center;
position: relative;
left: 50%;
transform: translateX(-50%);
padding-right: 0;
padding-left: 0;
}
.online-recording__form .date-time .col-md-8{
padding-left: 15px!important;
}
.online-recording__form .date-time .col-md-4 {
padding-left: 15px !important;
}
.popup__form .online-recording__form .form__button{
padding-right: 15px!important;
padding-left: 15px!important;
}
}
@media only screen and (max-width: 575px){
.home .online-recording__form{
padding: 0 40px;
}
.home .online-recording__form input{
max-width: unset;
}
.home .form__data{
width: 100%;
}
.home .form__name{
width: 100%;
}
.home .form__button{
padding: 0 15px;
}
.home .form__button a{
max-width: unset;
width: 100%;
}
.online-recording__form div:nth-of-type(2){
max-width: unset;
}
}
@media only screen and (max-width: 420px){
.home .online-recording__form{
padding: 0 10px;
}
}
.section__our-team{
padding-top: 80px;
position: relative;
}
.team__title{
position: absolute;
left: 50%;
transform: translateX(-50%);
top: 40px;
}
.team__main-content{
background-image: url("images/team-back.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
background-color: rgba(29,29,29, 0.8);
background-blend-mode: multiply;
display: flex;
justify-content: center;
padding: 88px 109px 68px 185px;
}
.team__title h2{
text-align: center;
}
.team__content{
display: flex;
flex-direction: column;
justify-content: center;
}
.team__image{
position: relative;
transform: translateX(-10%);
}
.team__image img{
position: relative;
z-index: 1;
}
.team__image:after{
position: absolute;
content: '';
display: block;
height: 80%;
width: 70%;
background-color: #D9398D;
top: 80px;
right: 15px;
}
.hello-image img{
position: absolute;
top: -40px;
left: -20px;
animation: ease lightning 1.5s forwards infinite;
animation-delay: 1.5s;
width: 177px;
}
.team__content h3{
font-family: 'IBM Plex Sans' , sans-serif;
font-weight: 600;
font-size: 55px;
color: #FFFFFF;
}
.team__content p:nth-of-type(1){
font-family: 'IBM Plex Sans', sans-serif;
font-style: normal;
font-weight: 500;
font-size: 18px;
color: #FFFFFF;
opacity: 0.8;
margin-bottom: 20px;
}
.team__content p:nth-of-type(2){
font-family: 'IBM Plex Sans' , sans-serif;
font-style: normal;
font-weight: normal;
font-size: 14px;
color: #FFFFFF;
margin-bottom: 20px;
}
.team__content p:nth-of-type(3){
font-family: 'IBM Plex Sans' , sans-serif;
font-style: normal;
font-weight: normal;
font-size: 14px;
color: #FFFFFF;
margin-bottom: 35px;
}
.team__content a{
font-family: 'Raleway', sans-serif;
font-weight: 700;
font-size: 11px;
letter-spacing: 0.13em;
text-transform: uppercase;
color: #FFFFFF;
background: linear-gradient(93.03deg, #D9398D 0%, #6DC6E3 137.2%);
padding: 15px 40px;
width: max-content;
}
.our__works{
padding-top: 110px;
}
.our__works__info{
display: flex;
align-items: center;
justify-content: space-between;
}
.info__buttons a{
font-family: 'Raleway', sans-serif;
font-weight: 700;
font-size: 16px;
text-transform: uppercase;
color: rgba(255,255,255,0.6);
border-bottom: 1px dashed rgba(255,255,255,0.6);
letter-spacing: 0.13em;
margin-right: 40px;
}
.info__buttons a:hover{
color: #D9398D;
border-bottom: 1px dashed #D9398D;
transition: .3s all;
}
.info__buttons a:nth-of-type(3){
margin-right: 0;
}
.our__works__slider{
margin-top: 40px;
}
.our__works__main{
border-bottom: 1px solid rgba(255,255,255,0.6);
padding-bottom: 50px;
}
.our__works__slider img{
margin: 30px 0 50px 0;
width: 100%;
height: auto;
}
@media only screen and (max-width: 1200px) {
.info__buttons a{
font-size: 13px;
}
}
@media only screen and (max-width: 991px){
.our__works__info{
flex-direction: column;
}
.info__buttons{
display: flex;
flex-direction: column;
align-items: center;
}
.info__buttons a{
margin-right: 0;
margin-top: 15px;
}
.info__title{
text-align: center;
}
}
.section__instagram{
padding: 105px 0 50px 0;
}
.section__instagram__title{
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 40px;
}
.arrow__instagram svg{
margin-right: 25px;
animation: ease lightning 2s forwards infinite;
animation-delay: 1s;
max-width: 144px;
}
.arrow__instagram a svg{
margin-right: 0;
max-width: 60px;
max-height: 60px;
animation: unset;
}
.arrow__instagram svg:hover path {
fill: transparent;
}
.arrow__instagram a svg:hover path {
fill: #fff;
}
.gram__title{
margin-bottom: 40px;
}
.arrow__instagram{
display: flex;
align-items: center;
}
.section__instagram__title a{
position: relative;
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
font-size: 20px;
color: #FFFFFF;
background: linear-gradient(0deg, #D9398D, #D9398D), #D9398D;
border-radius: 50%;
text-align: center;
padding: 40px 40px;
display: block;
transition: .5s all;
}
.section__instagram__media{
display: flex;
flex-wrap: wrap;
}
.section__instagram__media img{
width: 100%;
height: auto;
}
.section__first__buttons{
text-align: center;
margin-top: 30px;
}
.instagram__image img{
margin-top: 30px;
}
.section__instagram .circle__button:after{
content: '';
width: 140px;
height: 140px;
left: unset;
right: -5px;
}
.section__first__buttons a:last-child{
border-bottom: 1px dashed rgba(255,255,255,0.6);
font-family: 'IBM Plex Sans', sans-serif;
color: #ffff;
font-weight: 500;
font-size: 14px;
text-transform: uppercase;
margin-left: 30px;
transition: .3s;
}
.section__first__buttons a:last-child:hover{
color: #D9398D;
border-bottom: 1px solid #D9398D;
}
@media only screen and (max-width: 767px) {
.section__instagram__title{
margin-bottom: 0;
flex-direction: column;
}
.section__instagram .circle__button:after{
width: 130px;
height: 130px;
}
.arrow__instagram{
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 20px;
width: 100%;
}
.section__instagram__title a{
padding: 35px;
}
}
@media only screen and (max-width:575px) {
.arrow__instagram a svg{
max-width: 40px;
max-height: 40px;
}
.section__instagram .circle__button:after{
width: 110px;
height: 110px;
}
}
@media only screen and (max-width:420px){
.arrow__instagram a svg{
max-width: 35px;
max-height: 35px;
}
.arrow__instagram svg{
max-width: 120px;
}
}
.section__interior{
background-color: #FFFFFF;
padding: 80px 0 130px 0;
}
.interior__title{
display: flex;
justify-content: space-between;
align-items: center;
}
/************* cssssssss ************/
.interior-slider{
position: relative;
}
.custom_nav{
list-style-type: none;
padding-left: 0;
position: absolute;
bottom: 15px;
left: 50%;
transform: translateX(-50%);
display: flex;
justify-content: center;
transition: unset;
}
.custom_nav li a{
border-radius: unset;
height: 2px;
width: 75px;
background-color: rgba(255,255,255,0.5);
transition: unset;
font-size: 0;
display: block;
margin-right: 10px;
}
.custom_nav li a.active{
background-color: #ffffff;
}
.interior-slider .lSSlideOuter .custom_nav {
position: absolute;
bottom: 15px;
left: 50%;
transform: translateX(-50%);
display: flex;
justify-content: center;
transition: unset;
}
.interior-slider .lSSlideOuter .custom_nav, .lSSlideOuter .custom_nav.lSpg>li a, .lSSlideOuter .custom_nav.lSpg>li.prev a{
border-radius: unset;
height: 2px;
width: 75px;
background-color: rgba(255,255,255,0.5);
transition: unset;
}
.lSSlideOuter .custom_nav.lSpg>li.active a, .lSSlideOuter .custom_nav.lSpg>li:hover a{
background-color: #ffffff;
}
.lSSlideOuter .custom_nav.lSpg>li:hover a{
background-color: #ffffff;
}
@media only screen and (max-width: 767px){
.second__slider{
height: auto!important;
}
}
/************* cssssssss ************/
.interior__title h2{
color: #000000;
margin-bottom: 30px;
}
.interior__title p{
font-family: 'IBM Plex Sans',sans-serif;
font-weight: 400;
font-size: 14px;
color: #000000;
}
.second__slider__item div{
background-image: url("images/team-image.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
@media only screen and (max-width: 991px) {
.interior__title{
flex-direction: column;
}
.interior__title p{
margin-bottom: 30px;
}
}
.section__contacts{
background-color: #FFFFFF;
padding-bottom: 80px;
}
.section__contacts .container{
border-top: 1px solid rgba(0,0,0,0.35);
border-bottom: 1px solid rgba(0,0,0,0.35);
display: flex;
}
.section__contacts-info{
border-right: 1px solid rgba(0,0,0,0.35);
padding-top: 40px;
padding-bottom: 30px;
padding-left: 0;
}
.section__contacts-info h4{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 400;
font-size: 18px;
color: #000000;
}
.contacts h2{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
font-size: 48px;
color: #000000;
margin-bottom: 35px;
}
.contacts a{
border-bottom: 1px dashed rgba(0,0,0,0.6);
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
font-size: 36px;
color: #000000;
}
.contacts a:hover{
border-bottom: 1px solid #D9398D;
color: #D9398D;
}
.contacts__map iframe{
width: 100%;
height: 100%;
border: 5px solid #000000;
}
.section__contacts .container{
padding-right: 0;
padding-left: 0;
flex-wrap: wrap;
}
.contacts__map{
padding: 35px 0 35px 50px;
}
.contacts__map .map__design{
display: flex;
position: relative;
top:-6px
}
.contacts__map .map__design div{
border-left: 5px solid #000000;
border-right: 5px solid #000000;
border-bottom: 5px solid #000000;
height: 11px;
}
@media only scren and (max-width: 575px) {
.contacts__map .map__design{
top:-7px
}
}
.contacts__map .map__design div:nth-of-type(1){
background: #109263;
width: 51.23%;
}
.contacts__map .map__design div:nth-of-type(2){
background: #006BA7;
width: 26.55%;
}
.contacts__map .map__design div:nth-of-type(3){
background: #B49600;
width: 22.22%;
}
.our-address{
margin-top: 30px;
}
.our-address p{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
font-size: 36px;
color: #000000;
}
.our__social-networks{
margin-top: 30px;
}
.social-networks{
margin-top: 20px;
}
.social-networks a svg{
margin-right: 30px;
width: unset;
}
.Schedule{
margin-top: 30px;
}
.Schedule p:nth-of-type(1){
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
font-size: 36px;
color: #000000;
}
.Schedule p:nth-of-type(2){
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 400;
font-size: 14px;
color: #000000;
}
.Convenience{
margin-top: 20px;
}
.Convenience h3{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 400;
font-size: 21px;
color: #000000;
}
.Convenience h3:nth-of-type(2){
margin-top: 15px;
}
.Convenience p{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 400;
font-size: 14px;
color: #000000;
}
@media only screen and (max-width: 991px){
.contacts__map{
padding: 0;
}
.contacts__map iframe{
width: inherit;
height: calc(650px);
border: 5px solid #000000;
}
.contacts__map .map__design div:nth-of-type(3){
background: #B49600;
width: 22.42%;
}
.section__contacts-info{
border-right: unset;
}
.section__contacts .container{
border-bottom: unset;
}
}
@media only screen and (max-width: 767px){
.contacts__map iframe{
width: inherit;
height: calc(550px);
border: 5px solid #000000;
}
.contacts h2{
font-size: 40px;
}
.contacts a{
font-size: 30px;
}
.our-address p{
font-size: 30px;
}
.Schedule p:nth-of-type(1){
font-size: 36px;
}
}
@media only screen and (max-width: 575px){
.section__contacts .container{
padding-left: 15px;
padding-right: 15px;
}
.contacts h2{
font-size: 36px;
}
.contacts a{
font-size: 26px;
}
.our-address p{
font-size: 26px;
}
.contacts__map iframe{
width: inherit;
height: 75vw;
border: 5px solid #000000;
}
.contacts__map .map__design div{
height: 8px;
}
.section__contacts{
padding-bottom: 55px;
}
}
.footer{
padding-top: 80px;
}
.footer__title{
border-bottom: 1px solid rgba(255,255,255,0.35);
}
.footer__title h2{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
font-size: 48px;
text-align: center;
color: #FFFFFF;
margin-bottom: 30px;
}
.footer__info{
text-align: center;
border-bottom: 1px solid rgba(255,255,255,0.35);
display: flex;
align-items: center;
justify-content: center;
}
.footer__info p{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 400;
font-size: 21px;
color: #FFFFFF;
margin: 40px 0 30px 0;
}
.footer__info span{
font-weight: 700;
}
.footer__info svg{
margin-left: 35px;
animation: ease lightning 2s forwards infinite;
animation-delay: 1s;
max-width: 140px;
}
.footer__rating{
display: flex;
justify-content: center;
padding: 30px 0;
}
.rating-detail{
display: flex;
}
.rating-detail:nth-of-type(1){
border-right: 1px solid rgba(255,255,255,0.35);
}
.rating-detail-info{
display: flex;
flex-direction: column;
align-items: flex-end;
}
.rating-detail-circle{
display: flex;
justify-content: flex-end;
}
.rating-detail:nth-of-type(2){
border-right: 1px solid rgba(255,255,255,0.35);
}
.rating-detail-info p{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 400;
font-size: 36px;
color: #FFFFFF;
}
.rating-detail-info a{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 400;
font-size: 11px;
color: #FFFFFF;
border-bottom: 1px dashed rgba(255,255,255,0.6);
width: max-content;
}
.rating-detail-info a:hover{
border-bottom: 1px solid #D9398D;
color: #D9398D;
}
.rating-detail{
display: flex;
justify-content: flex-end;
}
.rating-detail-circle p{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 400;
font-size: 24px;
color: #FFFFFF;
background-color: #D9398D;
padding: 20px 20px;
border-radius: 50%;
}
.rating-detail-circle:nth-of-type(1){
margin-right: 50px;
}
.rating-detail-circle:nth-of-type(2){
margin-right: 50px;
}
.rating-detail:nth-of-type(2){
margin-left: 20px;
}
.rating-detail:nth-of-type(3){
margin-left: 20px;
}
.footer__last{
border-top: 1px solid rgba(255,255,255,0.35);
}
.last__info{
display: flex;
padding: 50px 0;
}
.info__copyright{
display: flex;
align-items: center;
justify-content: flex-start;
}
.info__copyright a{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 400;
font-size: 14px;
color: #FFFFFF;
transition: .3s;
}
.info__copyright a:hover{
color: #D9398D;
}
.info__social-networks{
display: flex;
justify-content: flex-end;
align-items: center;
}
.info__copyright p{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 400;
font-size: 14px;
color: #FFFFFF;
}
.info__contacts{
padding-right: 0;
display: flex;
align-items: center;
justify-content: flex-end;
}
.info__social-networks a svg{
margin-right: 30px;
width: unset;
}
.info__social-networks a:nth-of-type(4) img{
margin-right: 0;
}
.info__copyright p:nth-of-type(1){
margin-right: 65px;
}
.info__contacts a:nth-of-type(1){
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 500;
font-size: 14px;
color: #FFFFFF;
margin-right: 55px;
}
.info__contacts a:nth-of-type(1):hover{
color: #D9398D;
}
@media only screen and (max-width: 991px){
.footer__rating{
flex-direction: column;
}
.rating-detail-circle:nth-of-type(2) {
margin-right: 0;
}
.rating-detail{
justify-content: center;
}
.rating-detail:nth-of-type(1){
border-right: none;
margin-bottom: 20px;
}
.rating-detail:nth-of-type(2){
border-right: none;
margin-left: 0;
margin-bottom: 20px;
}
.rating-detail-circle {
display: flex;
justify-content: center;
}
.rating-detail:nth-of-type(3){
margin-left: 0;
}
.last__info{
flex-direction: column-reverse;
}
.rating-detail-info {
display: flex;
flex-direction: column;
align-items: center;
}
.info__copyright{
flex-direction: column-reverse;
}
.info__social-networks{
justify-content: center;
}
.info__contacts{
margin-bottom: 40px;
justify-content: center;
}
.info__copyright p:nth-of-type(1){
margin-right: 0;
margin-top: 40px;
}
.info__copyright p:nth-of-type(2){
margin-right: 0;
margin-top: 40px;
}
.info__copyright br{
display: none;
}
}
@media only screen and (max-width: 767px){
.info__copyright{
text-align: center;
}
.footer__title h2{
font-size: 40px;
}
.footer__info p{
font-size: 17px;
}
.footer__info svg{
display: none;
}
.info__contacts{
flex-direction: column-reverse;
}
.info__contacts a:nth-of-type(1){
margin-right: 0;
margin-top: 30px;
}
}
@media only screen and (max-width: 575px) {
.rating-detail-info p{
font-size: 30px;
}
}
@keyframes lightning {
0%{
opacity: 0;
}
100%{
opacity: 1;
}
}
@media only screen and (max-width: 420px){
.rating-detail-info{
align-items: flex-start;
margin-right: 15px;
}
.rating-detail-circle{
margin-left: 15px;
}
}
/* */
.lightSlider{
display: flex;
}
.first__slider {
height: 437px!important;
}
.first__slider__item{
margin-right: 90px;
display: flex;
align-items: flex-end;
}
@media only screen and (min-width: 992px){
.first__slider__item img{
max-width: 200px;
transition: width 0.2s ;
}
.first__slider__item.active{
width: calc(0.376 * 1210px)!important;
max-width: 437px;
transition: 2s;
display: flex;
align-items: center;
margin-right: calc(0.080 * 1210px)!important;
}
.first__slider__item.active img{
max-width: 100%;
width: 100%;
}
.first__slider__item.prev img{
width: calc(0.220 * 1210px)!important;
max-width: 266px;
min-width: 230px;
transition: 2s;
}
.first__slider__item.prev {
align-items: center;
justify-content: flex-end;
width: calc(0.225 * 1210px)!important;
margin-right: calc(0.1 * 1210px)!important;
}
.first__slider__item.next img{
width: 100%!important;
max-width: 270px;
transition: 2s;
margin-bottom: 20px;
min-width: 240px;
}
.first__slider__item.next{
width: calc(0.22 * 1210px)!important;
display: flex;
align-items: flex-end;
}
.about__second-screen{
padding-bottom: 65px;
}
}
@media only screen and (max-width: 1439px) and (min-width: 992px){
.first__slider__item.next img,.first__slider__item.prev img {
max-width: 100%;
}
.first__slider__item.active {
margin-right: calc(0.070 * 1210px)!important;
}
.welcome-image img {
right: 16.3%;
}
}
@media only screen and (max-width: 1199px){
.welcome-image img {
right: 10.3%;
}
}
@media only screen and (max-width: 991px) {
.welcome-image img {
right: 4.3%;
top: 23px;
}
.first__slider__item.next {
align-items: center;
}
.section__first {
padding-top: 50px;
}
.section__first.active {
padding-top: 127px;
}
.first__slider {
height: auto!important;
margin: 40px 0 60px;
}
}
@media only screen and (max-width: 991px) and (min-width: 767px) {
.first__slider__item.prev {
align-items: center;
margin-right: calc(0.150 * 720px)!important;
animation-delay: 2s;
}
.first__slider__item.prev,.first__slider__item.next {
align-items: center;
width: calc(0.150 * 720px)!important;
display: flex;
animation-delay: 2s;
}
.first__slider__item.active {
margin-right: calc(0.150 * 720px)!important;
width: calc(0.360 * 720px)!important;
animation-delay: 2s;
}
.first__slider__item.slick-current{
height: 200px;
}
}
@media only screen and (max-width: 767px) {
.welcome-image img {
right: 4.3%;
top: 23px;
}
.first__slider__item.next {
align-items: center;
}
.first__slider{
padding-left: 0;
}
.first__slider__item {
margin-right: 0;
}
.slick-initialized .slick-slide{
height: 100%;
margin-right: 4vw;
max-width: 100%;
justify-content: center;
width: 52vw!important;
}
.slick-track{
display: flex;
align-items: center;
}
}
@media only screen and (max-width: 767px) and (min-width: 575px) {
.first__slider__item.prev {
align-items: center;
margin-right: calc(0.050 * 540px)!important;
}
.first__slider__item.prev,.first__slider__item.next {
align-items: center;
width: calc(0.150 * 540px)!important;
display: flex;
}
.first__slider__item.active {
margin-right: calc(0.050 * 540px)!important;
width: calc(0.560 * 540px)!important;
}
.section__first .container {
max-width: 100%;
}
}
@media only screen and (max-width: 575px){
.slick-initialized .slick-slide {
height: 100%;
margin-right: 13vw;
width: inherit!important;
}
.first__slider {
height: auto !important;
min-height: 180px;
max-height: 230px;
}
.welcome-image img{
max-width: 78px;
}
.first__slider__buttons{
display: none;
}
.section__first .container{
padding-left: 0;
padding-right: 0;
}
.first__slider__item.prev img {
max-height: max-content;
max-width: 205px;
}
.first__slider__item img {
max-height: max-content;
}
.section__first .lightSlider{
display: flex;
justify-content: center;
height: 210px!important;
}
.first__slider__item.lslide:not(.active), .first__slider__item.left{
display: flex;
justify-content: flex-end;
align-items: center;
}
.first__slider__item{
align-items: center;
}
.first__slider__item.prev {
width: 57vw!important;
margin-left: 30px;
margin-right: 30px!important;
display: flex;
justify-content: center!important;
}
}
/************************************************************ "service" page ***********************************************/
.services .section__header{
background-image: url("images/services-back.png");
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
background-color: rgba(20, 20, 20, 0.75);
background-blend-mode: multiply;
height: 100vh;
position: relative;
min-height: 775px;
padding-bottom: 60px;
}
.header__services{
position: relative;
top: 50%;
/*transform: translateY(-50%);*/
}
.header__services__content{
display: flex;
align-items: center;
flex-wrap: wrap;
}
.header__services-title{
height: 100%;
display: flex;
flex-direction: column;
justify-content: flex-end;
}
.header__services-title h2{
margin-bottom: 20px;
}
.header__services-title p:nth-of-type(1){
font-family: 'IBM Plex Sans', sans-serif;
font-style: normal;
font-weight: 400;
font-size: 18px;
color: #FFFFFF;
margin-bottom: 20px;
}
.header__services-title p:nth-of-type(2){
font-family: 'IBM Plex Sans', sans-serif;
font-style: normal;
font-weight: 600;
font-size: 40px;
color: #FFFFFF;
margin-bottom: 20px;
}
.header__services__buttons a:nth-of-type(2){
font-family: 'IBM Plex Sans', sans-serif;
font-style: normal;
font-weight: 700;
font-size: 11px;
letter-spacing: 0.13em;
text-transform: uppercase;
color: #FFFFFF;
text-shadow: 0 6px 24px rgba(217, 57, 141, 0.35);
border: 1px solid #FFFFFF;
padding: 9px 30px;
margin-left: 20px;
}
.header__services-form{
background: linear-gradient(314.82deg, rgba(255, 255, 255, 0.06) 28.66%, rgba(255, 255, 255, 0.24) 94.66%);
box-shadow: 0 1px 24px -1px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(58px);
padding: 45px 28px 80px 28px;
}
.header__services-form .online-recording__form{
padding: 0;
flex-direction: column;
margin-top: 11px;
}
.header__services-form .online-recording__form input{
max-width: unset;
margin-top: 20px;
}
.header__services-form .form__data{
width: 100%;
margin-top: 20px;
padding-right: 45px;
}
.header__services-form select#time{
padding-right: 25px;
}
.header__services-form .form__button{
align-items: unset;
margin-top: 20px;
text-align: center;
}
.form__button{
flex-wrap: wrap;
justify-content: center;
}
.header__services-form .form__button a{
width: 100%;
display: block;
}
.popup__form .success{
color: #000!important;
margin-left: 0!important;
}
@media only screen and (max-width:1439px){
.header__services-form{
padding: 35px 30px 50px 30px
}
}
@media only screen and (max-width:991px){
.header__services-title{
margin-top: 77px;
}
.header__services-form{
margin-top: 50px;
padding: 45px 78px 40px 78px
}
.header__services-title p:nth-of-type(2){
font-size: 34px;
}
.header__services-title p:nth-of-type(1){
font-size: 14px;
}
}
.services-form-title p{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 700;
font-size: 21px;
text-align: center;
color: #FFFFFF;
}
.section__services{
padding: 70px 0;
}
.services__content{
display: flex;
flex-wrap: wrap;
}
.services-about__title{
display: flex;
align-items: center;
}
.services-about__title img{
max-width: 85px;
}
.image__main img{
max-width: 480px;
}
.services-about__paragraphs p{
font-family: 'IBM Plex Sans', sans-serif;
font-weight: 400;
font-size: 14px;
color: #FFFFFF;
}
.services-about__paragraphs p:nth-of-type(2), .services-about__paragraphs p:nth-of-type(3){
margin-top: 20px;
}
.how-to__work .first__title__buttons{
margin-left: 20px;
}
.services-about__buttons{
margin-top: 30px;
display: flex;
align-items: center;
}
.how-to__work{
display: flex;
align-items: center;
}
.how-to__work a{
font-family: 'IBM Plex Sans' ,sans-serif;
font-style: normal;
font-weight: 500;
font-size: 16px;
color: #FFFFFF;
border-bottom: 1px dashed rgba(255, 255, 255, 0.6);
width: max-content;
}
.services-about{
display: flex;
flex-direction: column;
justify-content: flex-end;
}
.services-image{
display: flex;
flex-direction: column;
align-items: center;
}
.services-image__title{
display: flex;
flex-wrap: wrap;
}
.image__title-icons{
display: flex;
align-items: center;
justify-content: center;
padding-left: 0;
margin-top: 20px;
padding-right: 0;
}
.image__title-icons svg{
max-width: 36px;
height: 36px;
margin-right: 30px;
}
.image__title-icons p{
font-family: 'IBM Plex Sans' ,sans-serif;
font-style: normal;
font-weight: 400;
font-size: 14px;
color: #FFFFFF;
}
@media only screen and (max-width: 1199px) {
.image__title-icons p{
font-size: 12px;
}
.image__title-icons{
justify-content: flex-start;
}
}
@media only screen and (max-width: 991px) {
.services .section__header{
background-image: url("images/services-back-mobile.png");
/*padding-top: 250px;*/
height: auto;
}
.header__services-title{
align-items: flex-start;
padding-left: 0;
}
.services-image{
margin-top: 60px;
}
.services-about__buttons{
text-align: center;
}
.image__main{
width: 100%;
}
.image__main img{
max-width: 100%;
}
.image__title-icons p{
font-size: 15px;
}
.services-about__paragraphs{
margin-top: 10px;
}
}
@media only screen and (max-width: 767px) {
.services-about__title img{
max-width: 70px;
}
.how-to__work .first__title__buttons{
margin-left: 0;
}
.how-to__work{
margin-top: 30px;
}
.services-about__buttons{
display: flex;
flex-direction: column;
align-items: center;
cursor: help;
}
.services-about__buttons a{
width: max-content;
}
.services-about__buttons a:nth-of-type(2){
margin-top: 20px;
}
.services-about__buttons a:nth-of-type(2){
font-size: 14px;
}
.header__services__buttons{
display: flex;
align-items: center;
justify-content: center;
}
.header__services__buttons a{
width: max-content;
}
.header__services__buttons a:nth-of-type(1){
padding: 11px 48px;
}
.header__services__buttons a:nth-of-type(2){
padding: 10px 30px;
margin-left: 20px;
}
}
@media only screen and (max-width: 575px){
.services-about__buttons .button__colored{
width: 100%;
}
.services-about__title img{
max-width: 60px;
}
.services-about__title h2{
font-size: 35px;
}
.services-about__paragraphs p{
font-size: 12px;
}
.header__services-form{
padding: 10px 20px;
}
.header__services__buttons a:nth-of-type(1){
padding: 11px 25px;
}
.header__services__buttons a:nth-of-type(2){
padding: 10px 10px;
margin-left: 10px;
}
}
.section__services-price{
padding-top: 70px;
}
.services-price__title{
text-align: center;
}
.services-price__title h2{
margin-bottom: 30px;
}
.services-price__title{
display: flex;
flex-direction: column;
justify-content: center;
}
.services-price__title a{
font-family: 'IBM Plex Sans', sans-serif;
font-style: normal;
font-weight: 500;
font-size: 18px;
color: #D9398D;
border-bottom: 1px dashed #D9398D;
width: max-content;
margin: 0 auto;
}
.services-price__info{
width: 70%;
margin: 0 auto;
}
.services-price__button{
text-align: center;
margin-top: 60px;
}
.price__info-main{
display: flex;
justify-content: center;
}
.price__info-main .col-6{
padding: 0;
}
.price__info-main:nth-of-type(1){
border-bottom: 1px solid rgba(255, 255, 255, 0.65);
}
.price__info-main:nth-of-type(1) .first-text p{
font-family: 'IBM Plex Sans', sans-serif;
font-style: normal;
font-weight: 500;
font-size: 18px;
color: #FFFFFF;
padding-bottom: 20px;
}
.price__info-main{
margin-top: 25px;
}
.price__info-main:nth-of-type(1) .second-text p{
font-family: 'IBM Plex Sans', sans-serif;
font-style: normal;
font-weight: 500;
font-size: 18px;
color: #FFFFFF;
}
.first-text p{
font-family: 'IBM Plex Sans', sans-serif;
font-style: normal;
font-weight: 400;
font-size: 18px;
color: #FFFFFF;
}
.second-text p{
font-family: 'IBM Plex Sans' , sans-serif;
font-style: normal;
font-weight: 600;
font-size: 18px;
color: #FFFFFF;
}
.first-text{
padding-left: 0;
}
.second-text{
padding-right: 0;
}
.second-text{
display: flex;
justify-content: flex-end;
}
@media only screen and (max-width: 767px) {
.price__info-main:nth-of-type(1) .first-text p{
font-size: 14px;
}
.price__info-main:nth-of-type(1) .second-text p{
font-size: 14px;
}
.first-text p{
font-size: 14px;
}
.second-text p{
font-size: 14px;
}
}
@media only screen and (max-width: 450px){
.price__info-main:nth-of-type(1) .first-text p{
font-size: 11px;
}
.price__info-main:nth-of-type(1) .second-text p{
font-size: 11px;
}
.first-text p{
font-size: 11px;
}
.second-text p{
font-size: 11px;
}
}
.section__questions{
padding: 70px 0;
}
.questions__title{
text-align: center;
}
.questions__main{
margin-top: 30px;
border-bottom: 1px solid rgba(255,255,255,0.6);
padding-bottom: 30px;
}
.questions__main__info{
display: flex;
justify-content: space-between;
align-items: center;
}
.questions__main__button{
border: 5px solid #ffffff;
border-radius: 50%;
padding: 14px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
cursor: pointer;
}
.questions__main__button.active span:nth-of-type(1){
transform: rotate(45deg);
}
.questions__main__button.active span:nth-of-type(2){
transform: rotate(-45deg);
}
.questions__main__button span:nth-of-type(2){
transform: rotate(90deg);
}
.questions__main__button span{
display: block;
width: 12px;
height: 4px;
background-color: #ffffff;
position: absolute;
border-radius: 3px;
transition: .3s;
}
.questions__main__title{
cursor: pointer;
}
.questions__main__title p{
font-family: 'IBM Plex Sans', sans-serif;
font-style: normal;
font-weight: 500;
font-size: 24px;
color: #FFFFFF;
}
.answer__main{
display: none;
transition: unset;
}
.answer__main p{
font-family: 'IBM Plex Sans', sans-serif;
font-style: normal;
font-weight: 400;
font-size: 14px;
color: #FFFFFF;
padding-right: 10%;
margin-top: 20px;
}
@media only screen and (max-width: 767px) {
.section__questions{
padding-bottom: 0;
}
.questions__main__title p{
font-size: 15px;
}
.answer__main p{
font-size: 12px;
}
.questions__main__button{
border: 3px solid #ffffff;
}
.questions__main__button span{
height: 3px;
}
}
.team__image:after {
position: absolute;
content: '';
display: block;
height: 89%;
width: 86%;
background-color: #D9398D;
top: 40px;
right: 30px;
}
.team__title{
z-index: 2;
top: -40px ;
}
.section__our-team .arrow__slider svg,.section__our-team .arrow__slider path{
fill: #fff;
}
.section__our-team .arrow__slider{
border: 1px solid #fff;
padding: 12px 15px;
transform: translate(-75%, -50%);
top: 50%;
display: flex;
align-items: center;
justify-content: center;
}
.section__our-team .next__arrow{
position: absolute;
z-index: 1;
transform: translate(35%, -50%);
top: 50%;
right: 0;
}
.section__our-team .prev__arrow{
position: absolute;
z-index: 1;
}
.section__our-team .container{
position: relative;
}
@media only screen and (max-width: 1439px){
.team__image {
display: flex;
align-items: center;
}
.team__image:after {
position: absolute;
content: '';
display: block;
height: 82%;
width: 86%;
background-color: #D9398D;
top: 11%;
right: 5%;
}
}
@media only screen and (max-width: 1199px){
.team__image:after {
position: absolute;
content: '';
display: block;
height: 83%;
width: 84%;
background-color: #D9398D;
top: 13%;
right: 25px;
}
.team__image {
display: flex;
align-items: center;
}
.team__main-content {
padding: 88px 49px 68px 85px;
}
.team__title {
top: -40px;
}
}
@media only screen and (max-width: 991px){
.team__main-content{
flex-wrap: wrap;
}
.team__image {
position: relative;
transform: translateX(0);
}
.section__our-team .arrow__slider {
transform: translate(-75%, -50%);
top: 40%;
}
.section__our-team .next__arrow {
transform: translate(35%, -50%);
}
}
@media only screen and (max-width: 767px){
.team__title {
top: -20px;
width: 100%;
}
.team__content p:nth-of-type(1) {
font-size: 18px;
}
.team__content h3 {
font-size: 36px;
}
}
@media only screen and (max-width: 575px){
.section__our-team .container{
padding-right: 0;
padding-left: 0;
}
.section__our-team .arrow__slider {
transform: translate(15px, -50%);
top: 30%;
}
.section__our-team .next__arrow {
transform: translate(-15px, -50%);
}
.team__main-content {
padding: 88px 0 68px 0;
}
.team__image {
position: relative;
transform: translateX(0);
padding-left: 60px;
padding-right: 55px;
}
.team__image:after {
height: 87%;
width: 63%;
background-color: #D9398D;
top: 40px;
right: 16%;
}
.team__content{
margin-top: 10px;
}
.team__main-content{
justify-content: flex-start;
height: fit-content;
}
.hello-image img {
position: absolute;
top: -25px;
left: 35px;
animation: ease lightning 2s forwards infinite;
animation-delay: 1s;
width: 95px;
}
.section__our-team .arrow__slider {
border: 1px solid #fff;
padding: 5px 10px;
}
.team__content a {
margin: 0 auto;
}
}
.our__price__hover{
opacity: 0;
position: absolute;
max-width: 245px;
transform: translate(-50%,-50%);
transition: 0.2s linear;
filter: brightness(0.5);
}
.second__slider__item__image{
height: 569px;
}
.section__instagram__title .mobile{
display:none
}
@media only screen and (max-width: 991px){
.promotional__offers__title h2:after {
top: -90%;
right: -30%;
}
}
@media only screen and (max-width: 767px){
.section__instagram__title .mobile{
display:block;
}
.section__interior .container{
padding-left: 0;
padding-right: 0;
}
.second__slider__item__image{
height: 465px;
}
.interior__title{
padding-left: 15px;
padding-right: 15px;
}
.interior__title p {
text-align: center;
}
.section__interior {
padding: 50px 0 30px 0;
}
.promotional__offers__title h2:after {
top: -83%;
right: -32%;
width: 147px;
height: 125px;
background-size: cover;
}
.about__first__title h2, .interior__title h2{
font-size: 48px;
}
.our__price-title h2{
font-size: 36px;
}
.rating-detail {
padding-left: 40px;
padding-right: 40px;
}
.info__contacts a:nth-of-type(1){
font-size: 24px;
}
.info__social-networks a svg {
margin-right: 30px;
width: 28px;
}
.info__social-networks {
justify-content: space-around;
}
.footer {
padding-top: 40px;
}
}
@media only screen and (max-width: 575px){
.promotional__offers__title h2:after {
top: -30%;
right: -20%;
width: 92px;
height: 86px;
}
.about__first__title h2, .interior__title h2{
font-size: 36px;
}
}
/******************************** last css********************************/
header{
position: fixed;
width: 100%;
top: 0;
z-index: 10;
height: 90px;
}
.header{
display: flex;
width: 100%;
align-items: center;
}
header.sticky:not(.active){
height: 68px;
position: fixed;
width: 100%;
z-index: 10;
background-color: rgba(0,0,0,0.6);
}
header.sticky.nav-up:not(.active) {
top: -90px;
}
.section__first{
margin-top: 77px;
}
.section__first.sticky{
margin-top: 77px;
}
html.active{
overflow: hidden;
}
@media only screen and (max-width: 767px){
header {
height: 77px;
}
header.sticky.nav-up:not(.active) {
top: -77px;
}
}
@media only screen and (max-width: 575px) {
header.sticky:not(.active){
height: 60px;
}
header{
height: 55px;
}
.header__phone{
top: 15px;
}
.hamburger__menu{
top: 20px;
}
.hamburger__menu.active{
top: 28px;
}
}
.hidden__block{
transition: unset;
}
#lg-download{
display: none;
}
#block__scroll-first{
display: none;
}
#block__scroll-second{
display: none;
}
#block__scroll-third{
display: none;
}
@media only screen and (max-width: 575px){
#block__scroll-first{
background-color: #ffffff;
position: fixed;
bottom: 0;
padding: 10px;
width: 100%;
display: block;
}
.scroll__buttons-first{
display: flex;
justify-content: space-around;
align-items: center;
}
.scroll__buttons-first a:nth-of-type(1){
margin-right: 18px;
font-family: 'IBM Plex Sans', sans-serif;
font-style: normal;
font-weight: 500;
font-size: 14px;
color: #000000;
border-bottom: 1px dashed rgba(0,0,0,0.6);
}
.scroll__buttons-first a:nth-of-type(1):hover{
color: #D9398D;
transition: .3s;
border-bottom: 1px dashed rgba(217, 57, 141, 0.6);
}
.last__info{
padding-bottom: 100px;
}
#block__scroll-second{
background-color: #ffffff;
position: fixed;
bottom: 0;
padding: 10px;
width: 100%;
display: none;
}
.scroll__buttons-second{
display: flex;
justify-content: space-around;
align-items: center;
}
.scroll__buttons-second a:nth-of-type(2){
font-family: 'IBM Plex Sans' ,sans-serif;
font-style: normal;
font-weight: 700;
font-size: 11px;
text-align: center;
letter-spacing: 0.1em;
text-transform: uppercase;
color: #262626;
text-shadow: 0 6px 24px rgba(217, 57, 141, 0.35);
border: 1px solid #D63E90;
box-sizing: border-box;
border-radius: 1px;
padding: 10px 18px;
margin-left: 20px;
}
#block__scroll-third{
background-color: #ffffff;
position: fixed;
bottom: 0;
padding: 10px;
width: 100%;
display: none;
}
.scroll__buttons-third{
display: flex;
justify-content: space-around;
align-items: center;
}
.scroll__social{
display: flex;
}
.scroll__social a svg{
max-width: 21px;
margin-right: 20px;
}
.scroll__buttons-first .button__colored{
padding: 10px 8px;
}
.scroll__buttons-second .button__colored{
padding: 10px 8px;
}
.scroll__buttons-third .button__colored{
padding: 10px 8px;
}
}
#lightSlider__works{
padding-left: 0;
padding-right: 0;
}
.works__slider li{
list-style-type: none;
}
.our__works .lSSlideOuter .lightSlider{
height: 513px!important;
}
.our__works__slider{
position: relative;
}
.youtube__button{
border: 2px solid rgba(255,255,255, 0.6);
border-radius: 50%;
padding: 10px;
position: relative;
margin-right: 10px;
border-left: 2px solid #ffffff;
transform: rotate(-35deg);
cursor: pointer;
transition: .7s all;
}
.youtube__button:hover{
border: 2px solid #ffffff;
transition: .3s;
}
.youtube__button a{
border-bottom: unset;
}
.triangle{
width: 0;
height: 0;
border-top: 5px solid transparent;
border-left: 10px solid #E14F9C;;
border-bottom: 5px solid transparent;
transform: rotate(35deg);
transition: unset;
position: relative;
left: 1px;
}
.our__works .lSSlideOuter .lightSlider,.our__works__slider {
height: 513px!important;
}
.our__works__slider{
position: relative;
}
.our__works__main__sliders{
position: relative;
}
.our__works__slider{
top: 0;
width: 100%;
}
.our__works__slider{
position: absolute;
opacity: 0;
z-index: 1;
}
.our__works__slider.active{
position: relative;
opacity: 1;
z-index: 2;
transition: 3s;
}
.our__works__info{
margin-bottom: 40px;
}
.info__buttons a.active{
cursor: default;
color: #D9398D;
border-bottom: 1px dashed #D9398D;
}
.our__works .lSAction>.lSPrev{
background-image: url("images/controls.svg");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
left: 30px
}
.our__works .lSAction>.lSNext{
background-image: url("images/controls_right.svg");
background-size: cover;
background-position: center;
background-repeat: no-repeat;
right: 30px;
}
.our__works .works__slider li{
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}
@media only screen and (max-width:575px){
.our__works .lSSlideOuter .lightSlider,.our__works__slider {
height: 435px!important;
}
.our__works{
padding-right: 0;
padding-left: 0;
}
.our__works .works__slider li{
background-color:rgba(29,29,29, 0.4);
background-blend-mode: multiply;
}
.our__works__main{
border-bottom: 0;
padding-bottom: 0
}
.section__instagram {
padding: 50px 0 50px 0;
}
.our__works {
padding-top: 50px;
}
#block__scroll-first,#block__scroll-second,#block__scroll-third{
z-index: 999;
}
.online-recording__form{
margin-top: 10px;
}
.online-recording{
padding: 30px 0 60px 0;
}
}
.questions__main__title{
padding-right: 10px;
}
.first__slider__item.lslide.next{
position: relative;
}
.first__slider__item .slide_hover{
content: '';
display: block;
width: 100%;
height: 58%;
position: absolute;
z-index: -1;
right: -15px;
bottom: 10px;
opacity: 0;
transition: unset;
}
.first__slider__item.prev {
position: relative;
}
.first__slider__item.lslide.prev .slide_hover, .first__slider__item.lslide.next .slide_hover{
transition: .5s all;
}
.first__slider__item.lslide.prev .slide_hover {
content: '';
display: block;
width: 100%;
height: 62%;
position: absolute;
z-index: -1;
top: 65%;
/* bottom: 10px; */
opacity: 0;
transition: .5s all;
transform: translateY(-65%);
left: 20px;
}
.first__slider__item.lslide.next:hover .slide_hover, .first__slider__item.lslide.prev:hover .slide_hover{
background-color: #BA397C;
opacity: 1;
}
@media only screen and (max-width: 991px){
.first__slider__item .slide_hover{
content: unset!important;
}
.first__slider__item.lslide.next:hover .slide_hover, .first__slider__item.lslide.prev:hover .slide_hover
{
opacity: 0!important;
}
}
.youtube__button:hover + .button-of-youtube a, .button-of-youtube:hover a{
border-bottom: 1px solid #ffffff;
}
.button-of-youtube a:hover + .youtube__button{
border: 2px solid #ffffff;
}
.info__social-networks a:nth-of-type(4) svg{
margin-right: 0;
}
header .container, header .header{
height: 100%;
}
.info-service a:hover{
color: #BA397C;
}
@media only screen and (max-width: 767px) {
.section__instagram__title {
margin-bottom: 40px;
}
.section__our-team .lightSlider{
height: auto!important;
}
.first__slider__item img {
max-width: 100%;
width: auto;
}
.first__slider__item:not(.slick-current) img{
height: max-content;
max-height: 140px;
min-height: 140px;
}
.first__slider__item{
display: flex!important;
align-items: center;
}
.first__slider__item.slick-current img{
height: auto;
min-height: 180px;
}
.slick-arrow{
display: none!important;
}
.section__first .first__slider .slick-list{
padding: 0px 40px 0 10px!important;
}
}
.popup {
display: none;
position: fixed;
z-index: 100;
width: 100%;
height: calc(100% - 64px);
overflow: scroll;
top: 0;
left: 0;
transition: unset;
}
.overlay_popup {
display: none;
position: fixed;
z-index: 50;
top: 0;
right: 0;
left: 0;
bottom: 0;
background: #000;
opacity: 0.5;
transition: unset;
}
.videoWrapper {
position: relative;
padding-bottom: 17.25%;
height: unset;
min-height: 320px;
}
.object {
z-index: 100;
position: fixed;
width: 560px;
height: max-content;
top: 50vh;
left: 50vw;
transform: translate(-50%, -50%);
}
.videoWrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
}
.popup__form .object{
width: 390px;
}
.popup__form .online-recording__form {
display: flex;
justify-content: space-between;
margin-top: 0;
padding: 50px 40px;
flex-direction: column;
}
.popup__form .online-recording__form input, .popup__form .online-recording__form select{
border: 1px solid #000000;
box-sizing: border-box;
border-radius: 2px;
padding: 10px 18px;
color: #484848;
width: 100%;
max-width: unset;
margin-bottom: 30px;
}
.popup__form .online-recording__form input::placeholder {
color: #484848;
}
.online-recording__form button{
border: unset;
width: 100%;
}
.online-recording__form button:focus, .online-recording__form button:hover{
border: unset;
outline: unset;
}
.popup__form .online-recording__form button {
width: 100%;
border: unset;
}
.online-recording__form button:disabled{
opacity: .5;
}
.popup__form .videoWrapper{
background-color: #fff;
box-shadow: 0px 14px 24px rgba(0, 0, 0, 0.14);
border-radius: 6px;
padding-bottom: 0;
}
.date-time{
display: flex;
flex-wrap: wrap;
}
.date-time .col-md-8{
padding-left: 0;
}
.date-time .col-md-4{
padding-right: 0;
}
.popup__title{
font-style: normal;
font-weight: bold;
font-size: 21px;
line-height: 130%;
text-align: center;
margin-bottom: 30px;
color: #000000;
}
.close__button{
position: absolute;
right: 18px;
top: 18px;
cursor: pointer;
}
@media only screen and (max-width: 1199px){
.popup__form .form__data,.online-recording__form input {
font-size: 12px;
}
.home .popup__form .form__number {
margin-top: 0;
}
.home .popup__form .form__data{
margin-top: 0;
}
.popup__form .online-recording__form div:nth-of-type(2) {
padding-right: 15px;
padding-left: 15px;
max-width: unset;
}
}
@media only screen and (max-width:991px){
.online-recording__form .col-lg-12{
padding-right: 0;
}
.custom_nav li a{
width: 40px;
}
.header__services-form .online-recording__form .date-time .col-md-4{
padding-right: 0!important;
}
}
@media only screen and (max-width: 767px){
.header__services-form .online-recording__form div:nth-of-type(2n + 1) {
padding-left: 0
}
.header__services-form .online-recording__form .date-time .col-md-8 {
padding-left: 0!important;
padding-right: 0!important;
}
.header__services-form .online-recording__form .date-time .col-md-4 {
padding-left: 0!important;
}
}
@media only screen and (max-width: 575px)
{
.service__drop-down{
bottom: 15px;
}
.videoWrapper {
position: relative;
padding-bottom: 17.25%;
height: unset;
min-height: 320px;
}
.object {
width: calc(100% - 20px);
}
.videoWrapper iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.popup__form .object{
width: calc(100% - 30px);
}
.popup__form .online-recording__form {
padding: 50px 10px;
}
}
.online-recording__form p:not(.popup__title){
margin-bottom: 15px;
font-size: 14px;
}
.popup__form:not(#popup__form) .online-recording__form{
padding: 50px 24px;
}
.popup__form:not(#popup__form) .popup__title{
text-align: center;
}
.online-recording__form form{
display: flex;
width: 100%;
flex-wrap: wrap;
}
.online-recording__form form .col-12{
margin-top: 20px;
}
.form__button a{
width: 100%;
}
.online-recording__form form .col-12 input{
width: 100%;
}
option.avatar {
background-repeat: no-repeat !important;
padding-left: 20px;
}
.avatar .ui-icon {
background-position: left top;
}
@media only screen and (max-width: 374px){
.first__slider__item:not(.slick-current) img{
max-height: 120px;
min-height: 120px;
}
.first__slider__item.slick-current img{
max-width: 100%;
width: auto;
height: auto;
max-height: max-content;
min-height: unset;
}
}
.works__slider{
cursor: pointer;
}
.loader{
background-image: url("images/loader.gif");
background-position: center center;
background-repeat: no-repeat;
z-index: 3;
background-color: rgba(255,255,255, 0.5);
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
display: none;
}
.loader.active{
display: flex;
}
@media only screen and (max-width: 767px){
#popup_form .online-recording__form div:nth-of-type(2n){
padding-right: 15px;
padding-left: 15px;
}
#popup_form .online-recording__form .date-time .col-md-8,#popup_form .online-recording__form .date-time .col-md-4{
padding-right: 0px!important;
padding-left: 0px!important;
}
}