@charset "utf-8";

/* Обнуление */
*,
*::before,
*::after {
	padding: 0;
	margin: 0;
	border: 0;
	box-sizing: border-box;
}
a {
	text-decoration: none;
}
ul,
ol,
li {
	list-style: none;
}
img {
	vertical-align: top;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: inherit;
	font-size: inherit;
}
html,
body {
	height: 100%;
	line-height: 1;
	background: #fff;
	font-size: 14px;
	color: #000;
	font-weight: 500;
	font-family: Montserrat;
}
/* ---------------------------------------------------------------------------- */
.wrapper {
	min-height: 100%;
	overflow: hidden;
	display: flex;
	flex-direction: column;
}
/* ---------------------------------------------------------------------------- */
._container {
	max-width: 1200px;
	padding: 0px 10px;
	margin: 0px auto;
	box-sizing: content-box;
}
._ibg {
}
._ibg img {
    opacity: 0.5;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	object-fit: cover;
}

@media screen and (max-width: 550px){
    ._ibg img {
        opacity: 0.25;
    }
}

/* --------------------------------------- */
.pop_up {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 3;
    transform: translateY(-44.5%) scale(0);
    transition: 0.4s ease-in-out;
}

.pop_up.active {
    transform: translateY(0%) scale(100%);
    background-color: rgba(0, 0, 0, 0.8);
   
}


.pop_up_container {
    display: flex;
    width: 100%;
    height: 100%;
}
.pop_up_body {
    margin: auto;
    width: 500px;
    background-color: #fff;
    border-radius: 10px;
    text-align: center;
    padding: 100px 15px 110px 15px;
    position: relative;

}

.pop_up_body p{
    font-size: 28px;
    font-family: serif;
    font-weight: 600;
    color: #22262D;
    margin-bottom: 40px;
}
.pop_up_body input{
    box-shadow: 0 0 15px #22262d;
    display: block;
    margin: 25px auto 0px auto;
    width: 330px;
    padding: 17px 20px;
    background-color: #E5E5E5;
    border-radius: 10px;
    border: none;
    font-family: serif;
    font-weight: 500;
    font-size: 18px;
    color: #89909F;
}
.pop_up_body button{
    text-decoration: none;
    cursor: pointer;
    display: block;
    width: 270px;
	min-height: 50px;
    padding: 10px 30px;
    margin: 55px auto 10px auto;
    position: relative;
    overflow: hidden;
    border: 2px solid #ffeb3b;
    border-radius: 8px;
    font-family: 'Montserrat', sans-serif;
    color: #000;
    transition: .2s ease-in-out;
    font-size: 14px;
    font-weight: 700;
}

.pop_up_body button:before {
    content: "";
    background: linear-gradient(90deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .5));
    height: 50px;
    width: 50px;
    position: absolute;
    top: -8px;
    left: -75px;
    transform: skewX(-45deg);
  }
  .pop_up_body button:hover {
    background: #ffeb3b;
    color: #000;
  }
  .pop_up_body button:hover:before {
    left: 150px;
    transition: .5s ease-in-out;
  }
.pop_up_close{
    position: absolute;
    top: 40px;
    right: 30px;
    font-size: 21px;
    cursor: pointer;
}

.pop_up_body textarea{
    display: block;
    margin: 25px auto 0px auto;
    width: 330px;
    padding: 17px 20px;
    background-color: #E5E5E5;
    border-radius: 10px;
    border: none;
    font-family: serif;
    font-weight: 500;
    font-size: 18px;
    color: #89909F;
}
@media screen and (max-width: 770px){
    .pop_up_body{
            margin: auto;
            width: 300px;
            background-color: #fff;
            border-radius: 10px;
            text-align: center;
            padding: 80px 15px 80px 15px;
            position: relative;
    }
    .pop_up_body input{
        box-shadow: 0 0 15px #22262d;
        display: block;
        margin: 25px auto 0px auto;
        width: 250px;
        padding: 10px 10px;
        background-color: #E5E5E5;
        border-radius: 10px;
        border: none;
        font-family: serif;
        font-weight: 200;
        font-size: 14px;
        color: #89909F;
    }
    .pop_up_body input:focus{
        outline: none;
    }


	.pop_up_body textarea{
		display: block;
		margin: 25px auto 0px auto;
		width: 250px;
		padding: 17px 20px;
		background-color: #E5E5E5;
		border-radius: 10px;
		border: none;
		font-family: serif;
		font-weight: 500;
		font-size: 18px;
		color: #89909F;
	}
    
    .pop_up_body button{
        cursor: pointer;
        display: block;
        width: 250px;
        margin: 60px auto 0px auto;
        padding: 20px 0px;
        font-family: serif;
        font-weight: 700;
        font-size: 16px;
        border: none;
        color: #000;
        border: 2px solid #ffeb3b;
        border-radius: 8px;
        font-family: 'Montserrat', sans-serif;
    }
    
    .pop_up_close{
        position: absolute;
        top: 15px;
        right: 15px;
        font-size: 21px;
        cursor: pointer;
    }
}
/* ---ШАПКА------------------------------------------------------------------------- */
.header {
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 50;
}

.header:before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    z-index: 2;
}
.header__body {
    position: relative;
    display: flex;
    justify-content: space-between;
    height: 55px;
    align-items: center;
}
.header__logo {
    background-color: #000;
    position: relative;
    z-index: 3;
	font-size: 18px;
	font-weight: 700;
	color: #ff0;
}
.header__logo img{
    max-width: 50px;
    display: block;
}
.header__burger {
    display: none;
}
.header__menu {
}
.menu__list {
    display: flex;
    position: relative;
    z-index: 2;
}
.menu__list li{
    list-style: none;
    margin: 0px 0px 0px 7px;
}
.menu__link {
    color: #000;
    text-transform: uppercase;
    font-size: 13px;
    text-decoration: none;
    font-weight: 700;
}
@media (max-width:960px){
    .menu__list li{
        margin: 0px 0px 0px 5px;
    }
    .menu__link {
        font-size: 10px;
        font-weight: 700;
    }
    .header__logo {
        margin-right: 10px;
        font-size: 16px;
        font-weight: 700;
    }
}
@media (max-width:490px){
   
    .header__logo {
        margin-right: 3px;
        font-size: 8px;
    }
}

@media (max-width:795px){
    body.lock{
        overflow: hidden;
    }
    .header__body{
        height: 59px;
    }
    .header__logo{
        flex: 0 0 50px;
    }
    .header__burger {
        margin: 0px 0px 0px 12px;
        display: block;
        position: relative;
        width: 30px;
        height: 20px;
        position: relative;
        z-index: 3;
    }
    .header__burger span{
        position: absolute;
        background-color: #000;
        position: absolute;
        left: 0;
        width: 100%;
        height: 2px;
        top: 9px;
        transition: all 0.3s ease 0s;
    }
    .header__burger:before,
    .header__burger:after{
        content: '';
        background-color: #000;
        position: absolute;
        width: 100%;
        height: 2px;
        left: 0;
        transition: all 0.3s ease 0s;
    }
    .header__burger:before{
        top: 0;
    }
    .header__burger:after{
        bottom: 0;
    }

    .header__burger.active span{
       transform: scale(0);
    }
    .header__burger.active:before{
        transform: rotate(45deg);
        top: 9px;
    }
    .header__burger.active:after{
        transform: rotate(-45deg);
        bottom: 9px;
    }
    .header__menu {
     position: fixed;
     top: -100%;
     left: 0;
     width: 100%;
     height: 100%;
     overflow: auto;
     transition: all 0.3s ease 0s;
     background-color: #c2c6c2;
     padding: 70px 10px 20px 10px;
    }
    .header__menu.active{
        top: 0;
    }
    .menu__list{
        display: block;
    }
    .menu__list li{
        margin: 0px 0px 35px 0px;
    }
    .menu__link {
        font-size: 24px;
    }
}

@media (max-width:490px){
    body.lock{
        overflow: hidden;
    }
    .header__body{
        height: 50px;
    }
    .header__logo{
        flex: 0 0 30px;
    }
    .header__burger {
        margin: 0px 0px 0px 5px;
    }
}
.header__gadjet{
    display: flex;
    flex-wrap: wrap;
    z-index: 5;
    margin-right: auto;
    position: relative;
    align-items: center;
    margin-left: auto;
}

@media (max-width:795px){
    .header__gadjet{
        display: none;
    }
}

.header__tele{
    align-items: center;
}


.link__tel{
    color: #000;
    font-size: 16px;
    font-weight: 700;
    margin: 0 10px;
}
svg {
    width: 30px;
    height: 30px;
}
@media (max-width:950px){
    .link__tel{
        color: #000;
        font-size: 12px;
        font-weight: 700;
        margin: 0 0px;   
    }
}
.header__social{
    margin: 0 5px;
}
.burger__phone{
    display: none;
}

.burger__mail{
    display: none;
}
.header__logo__alf{
    color: #000;
    font-size: 15px;
    font-weight: 700;
    z-index: 3;
    margin-right: 10px;
}
@media (max-width:930px){
    .header__logo__alf{
        font-size: 13px;
    }
}
@media (max-width:490px){
    .header__logo__alf{
        font-size: 11px;
    }
}
@media (max-width:795px){
    .burger__phone{
        display: block;
        z-index: 2;
        margin-top: 110px;
    }
    .burger__phone__link{
        color: #000;
        font-size: 24px;
    }
    .burger__phone {
        align-items: center;
        display: flex;
        z-index: 5;
    }
    .burger__tele {
        margin: 0 10px;
    }
    .burger__phone__link {
    }
    .burger__social {
        margin: 0 5px;
    }
    .burger__mail{
        display: block;
        margin: 40px 10px;
        font-size: 24px;
        font-weight: 700;
        text-decoration: underline yellow;
    }
    .burger__mail__link{
     color: #000;
     text-decoration: underline yellow;
    }
}
@media (max-width:767px){
    .header__tel {
        position: relative;
        z-index: 3;
    }
	.tel{
		display: inline-block;
		font-size: 18px;
		font-weight: 700;
		color: #fff;
        letter-spacing: 0.2px;
	}
}
@media (max-width:490px){
	.tel{
        display: none;
		font-size: 15px;
		font-weight: 700;
        width: 100%;
	}
}

/* ---------------NUMBER__BTN---------------------------------- */
.get-started-btn {
	border: 2px solid #ffeb3b;
	padding: 10px 20px;
	border-radius: 8px;
	text-transform: uppercase;
	color: #000;
}
@media (max-width:920px){
    .get-started-btn {
     margin: 50px 0px 0px 0px;
    background-color: #fff;
	border: 2px solid #ffeb3b;
	padding: 10px 20px;
	border-radius: 8px;
	text-transform: uppercase;
	color: #000;
	}
}
@media (max-width:795px){
    .get-started-btn {
		display: none;
	}
}



/* ---PAGE------------------------------------------------------------------------- */
.page {
	flex: 1 1 auto;
}

/* ---MAIN-BLOCK------------------------------------------------------------------------- */
.main-block {
	position: relative;
}

.main-block__body {
	display: flex;
	justify-content: space-between;
	padding: 130px 0px 191px 0px;
	position: relative;
	z-index: 2;
}
@media (max-width: 992px) {
	.main-block__body {
		padding: 59px 0px 20px 0px;
	}
}
@media (max-width: 479px) {
	.main-block__body {
		padding: 10px 0px 20px 0px;
	}
}

.main-block__offer{
	text-align: center;
	max-width: 610px;
}
@media (max-width: 900px) {
    .main-block__offer {
        text-align: center;
        max-width: 100%;
	}
}


/* ----------------------------- */

.main-block__promo{
    display: block;
}



@media (max-width: 900px) {
	.main-block__promo {
        display: none;
	
	}
}
.promo__container{
    box-shadow: 0 0 15px #22262d;
    max-width: 359px;
	min-height: 535px;
	background-color: #c2c6c2;
	border-radius: 20px;
}
.promo__title{
	padding: 18px;
	font-size: 22px;
	font-weight: 700;
	text-align: center;
}
.promo__subtitle{
	padding: 10px;
	font-size: 16px;
	font-weight: 500;
	text-align: center;
}


.promo__container input{
    box-shadow: 0 0 15px #22262d;
    display: block;
    margin: 20px auto 0px auto;
    width: 318px;
    padding: 17px 20px;
    background-color: #E5E5E5;
    border-radius: 10px;
    border: none;
    font-family: serif;
    font-weight: 500;
    font-size: 18px;
    color: #89909F;
	transition: all 0.5s ease 0s;
}

.promo__file-desc {
    padding: 18px 18px 0 18px;
    text-align: center;
    font-family: Montserrat;
    font-weight: 500;
    font-size: 14px;
}

.pop_up_body .popup__file-desc {
    padding: 18px 15px 0 15px;
    text-align: left;
        font-family: Montserrat;
    font-weight: 500;
    font-size: 12px;
    margin-bottom: 0;
    display: block;
    max-width: 330px;
    margin: 0 auto;
    text-align: center;
}

.input__file{
    margin: 30px auto 30px;
    font-size: 18px;
    font-weight: 700;
    border-radius: 5px;

}
.block__input__file{
    margin: 0 auto;
    text-align: center;

}

.input__box:focus{
    outline: none;
	box-shadow: 0 0 15px #22262D;
}
.input__box:invalid{
    box-shadow: 0 0 15px #da110a;
}
.input__box:valid{
    box-shadow: 0 0 15px #27e50a;
}

.input__box:not(:focus):invalid {
    box-shadow: 0 0 15px #22262D;
}
.promo__container textarea{
    display: block;
    margin: 25px auto 0px auto;
    width: 230px;
    padding: 20px 20px;
    background-color: #E5E5E5;
    border-radius: 10px;
    border: none;
    font-family: serif;
    font-weight: 500;
    font-size: 18px;
    color: #89909F;
	resize: vertical;
	transition: all 0.5s ease 0s;
}

.textarea input:focus{
    outline: none;
	box-shadow: 0 0 15px #22262D;
}


.promo__container button{
    text-decoration: none;
      cursor: pointer;
    display: block;
    width: 200px;
    padding: 10px 30px;
    margin: 45px auto 10px auto;
    position: relative;
    overflow: hidden;
    border: 2px solid #ffeb3b;
    border-radius: 8px;
    font-family: 'Montserrat', sans-serif;
    color: #000;
    transition: .2s ease-in-out;
    font-size: 14px;
    font-weight: 700;
}

.promo__container button:before {
    content: "";
    background: linear-gradient(90deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .5));
    height: 50px;
    width: 50px;
    position: absolute;
    top: -8px;
    left: -75px;
    transform: skewX(-45deg);
  }
  .promo__container button:hover {
    background: #ffeb3b;
    color: #000;
  }
  .promo__container button:hover:before {
    left: 150px;
    transition: .5s ease-in-out;
  }

/* ------------------------------- */

.page__paragraph{
	font-size: 24px;
	line-height: 137%;
	letter-spacing: 0.2px;
	font-weight: 700;
	margin-top: 25px;
}

.main-block__title {
    margin-bottom: 30px;
	text-align: center;
	font-size: 52px;
	line-height: 137%;
	letter-spacing: 0.2px;
	font-weight: 800;
}

.main-block__desc {
    opacity: 0;
    transition: 2s;
    animation: show 2s 1;
    animation-fill-mode: forwards;
    animation-delay: 2s;
}

@media (max-width: 900px) {
	.main-block__title {
        margin-bottom: 50px;
        margin-top: 70px;
		font-size: 42px;
	}
}
@media (max-width: 600px) {
	.main-block__title {
		font-size: 32px;
	}
}
@media (max-width: 479px) {
	.main-block__title {
		font-size: 26px;
	}
}

.main-block__subtitle{
  font-size: 28px;
  font-weight: 700;
  opacity:0; 
  transition: 0.5s; 
  animation: plannn 0.5s 1; 
  animation-fill-mode: forwards; 
  animation-delay: 0.5s; 
  }
  @keyframes plannn{
    0%{
    opacity:0;
    }
    100% {
    opacity:1;
    }
    }
  


    @media (max-width: 900px) {
        .main-block__subtitle {
            font-size: 24px;
        }
    }

    @media (max-width: 490px) {
        .main-block__subtitle {
            font-size: 18px;
        }
    }



    @media (max-width: 900px) {
        .page__paragraph{
            font-size: 22px;
            line-height: 137%;
            letter-spacing: 0.2px;
            font-weight: 700;
            margin-top: 30px;
        }
    }

    @media (max-width: 490px) {
        .page__paragraph{
             font-size: 18px;
        }
    }
.main-block__text {
	color: #000;
	font-size: 20px;
	line-height: 150%;
    margin-top: 40px;
    opacity:0; 
    transition: 1.2s; 
    animation: bla 1.2s 1; 
    animation-fill-mode: forwards; 
    animation-delay: 1.2s; 
    }
    
    @keyframes bla{
        0%{
        opacity:0;
        }
        100% {
        opacity:1;
        }
        }   

        @media (max-width: 890px) {
            .main-block__text {
                margin-bottom: 50px;
                }  
        }

        


/* ----------------------------- */
.button__otzyv{
    display: flex;
	flex-wrap: wrap;
    z-index: 5;
    margin-right: auto;


    position: relative;
}
/* ---------------------------------- */
.main-block__buttons {
	display: flex;
	flex-wrap: wrap;
    z-index: 5;
    margin-right: auto;
    position: relative;
}

.butonss{
    text-decoration: none;
    cursor: pointer;
    display: block;
    width: 165px;
    padding: 5px 30px;
    margin: 10px auto 10px auto;
    position: relative;
    overflow: hidden;
    border: 2px solid #ffeb3b;
    border-radius: 8px;
    font-family: 'Montserrat', sans-serif;
    color: #000;
    transition: .2s ease-in-out;
    font-size: 14px;
    font-weight: 700;
}
.butonss:before {
    content: "";
    background: linear-gradient(90deg, rgba(255, 255, 255, .1), rgba(255, 255, 255, .5));
    height: 50px;
    width: 50px;
    position: absolute;
    top: -8px;
    left: -75px;
    transform: skewX(-45deg);
  }
  .butonss:hover {
    background: #ffeb3b;
    color: #000;
  }
  .butonss:hover:before {
    left: 150px;
    transition: .5s ease-in-out;
  }

  @media (max-width: 940px) {
    .butonss{
        width: 145px;
        padding: 4px 20px;
    }
}

@media (max-width: 490px) {
    .butonss{
        width: 135px;
        padding: 4px 20px;
        margin: 10px auto 10px auto;
    }
}
/* --------------------------------------------------- */

.footer {
}
.footer__top {
	background: #17213c;
	padding: 35px 0;
}
.footer__main {
}
.footer__row {
	display: flex;
	flex-wrap: wrap;
	margin: 0px -15px;
}
.footer__column {
	padding: 15px 15px;
	flex: 0 1 16.6667%;
}
.footer__column:last-child {
	flex: 0 1 33.334%;
}
@media (max-width: 992px) {
	.footer__column {
		flex: 0 1 25%;
	}
	.footer__column:last-child {
		flex: 1 1 100%;
	}
}
@media (max-width: 992px) {
	.footer__column {
		flex: 0 1 50%;
	}
}

.footer__label {
	color: #fff;
	font-weight: 700;
	font-size: 16px;
	line-height: 150%;
	margin: 0px 0px 20px 0px;
}

.menu-footer__link {
	color: #fff;
	display: inline-block;
	line-height: 171%;
	letter-spacing: 0.2px;
}
.menu-footer__link:hover {
	text-decoration: underline;
}



.contacts-footer {
	display: flex;
	flex-direction: column;
}
.contacts-footer__item {
	padding: 0px 0px 0px 34px;
	line-height: 142%;
	display: flex;
	align-items: center;
	color: #ffffff;
	min-height: 30px;
}
.contacts-footer__item:hover {
	text-decoration: underline;
}
.contacts-footer__item:not(:last-child) {
	margin: 0px 0px 12px 0px;
}
.contacts-footer__item_phone {
	background: url("../img/footer/icons/01.svg") 0 0 no-repeat;
}
.contacts-footer__item_map {
	background: url("../img/footer/icons/02.svg") 0 0 no-repeat;
}
.contacts-footer__item_email {
	background: url("../img/footer/icons/03.svg") 0 0 no-repeat;
}
.footer__bottom {
	padding: 25px 0;
}
.footer__container {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.footer__copy {
	color: #737373;
	line-height: 171%;
}

.social {
	display: flex;
	align-items: center;
}
.social__item:not(:last-child) {
	margin: 0px 20px 0px 0px;
}
.social__item:hover{
	transform: translateY(-7px);
}
.social__item{
	transition: 0.3s;
}
@media (max-width: 767px) {
	.footer__container {
		flex-direction: column;
	}
	.footer__copy {
		margin: 0px 0px 15px 0px;
		text-align: center;
	}
	
	.pop_up_body .popup__file-desc {
    text-align: left;
}
}


/* ------------------------------------------------------ */

.works {
}
.container {
}
.portfolio {
    display: flex;
    flex-wrap: wrap;
}
.portfolio__col {
    flex-basis: 33.33333%;
    padding: 1rem;
}
.work {
    overflow: hidden;
    border-radius: 10px;
    box-shadow: 0 0 4px rgb(0 0 0 / 25%);
    transition: box-shadow .2s linear;
}
.work__image {
    display: block;
    max-width: 100%;
    height: auto;
}
.work__content {
    padding: 1rem 0.8rem;
}
.work__cat {
    margin-bottom: 0.5rem;
    font-size: .8rem;
    color: #2b2a2c;
    text-transform: uppercase;
}
.work__title {
    display: flex;
    justify-content: space-between;
    font-size: 1.06rem;
    color: #2b2a2c;
    text-transform: uppercase;
    font-weight: 700;
}
.work__date {
}
/* ------------------------------------- */

.advantages {
	padding: 80px 0;
}
@media (max-width: 992px) {
	.advantages {
		padding: 50px 0;
	}
}
@media (max-width: 767px) {
	.advantages {
		padding: 40px 0;
	}
}
.advantages__container {
}
.advantages__header {
	margin: 0px 0px 50px 0px;
}
@media (max-width: 767px) {
	.advantages__header {
		margin: 0px 0px 25px 0px;
	}
}
.advantages__body {
	display: flex;
	flex-wrap: wrap;
	margin: 0px 0px 20px;
}
.advantages__column {
	padding: 0px 15px;
	margin: 0px 0px 30px 0px;
	flex: 0 1 25%;
}

@media (max-width: 1020px) {
	.advantages__column {
		flex: 0 1 50%;
	}
}
@media (max-width: 560px) {
	.advantages__column {
		flex: 0 1 100%;
	}
}

.advantages__item {
	background-color: #fff;
	padding: 30px;
	font-weight: 700;
	text-align: center;
}
.advantages__item > *:not(:last-child) {
	margin: 0px 0px 10px 0px;
}
.advantages__value {
	font-size: 40px;
	line-height: 142%;
}
.advantages__text {
	letter-spacing: 0.1px;
	color: #000;
	font-size: 16px;
	line-height: 150%;
}
.advantages__text::first-line {
    text-decoration: overline yellow 5px;
}
/* -------------------------------------------------- */
.main-block__iticon {
    display: flex;
    justify-content: space-between;
    margin-top: 100px;
    opacity:0; 
    transition: 2s; 
    animation: show 2s 1; 
    animation-fill-mode: forwards; 
    animation-delay: 2s; 
}



@keyframes show{
    0%{
    opacity:0;
    }
    100% {
    opacity:1;
    }
    }


   

    .first{
        max-width: 48px;
        margin:0 auto;
    }

    @media (max-width:900px){
        .main-block__iticon{
            margin-top: 20px;
        }
    }
    @media (max-width:600px){
        .main-block__iticon{
            justify-content: space-around;
            margin-top: 10px;
            flex-wrap: wrap;
        }
        .offer {
            flex: 1 1 31%;
            display: flex;
            flex-direction: column;
        }
    }

.body__iticon{
    margin:20px;
}
@media (max-width:600px){
    .body__iticon{
        flex: 1 1 31%;
    }
}



.tt{
    font-size: 17px;
    font-weight: 700;
    justify-content: center;
    margin-bottom:5px;
}


@media (max-width:900px){
	.tt{
        font-size: 16px;
    }
}



/* -------------------------------------------- */

.page__why {
    margin-bottom: 100px;
}

@media (max-width:500px){
    .page__why {
        margin-bottom: 50px;
    }
}


.page__why__container {
}
._container {
}
.why__title {
}
.why__body {
    margin-top: 40px;
    display: flex;
    align-items: center;
    justify-content: space-around;
    flex-wrap: wrap;
    max-width: 100%;
}
.why__item {
    flex: 30.0%;
    align-items: center;
    margin: 25px;
}
.imlog {
    text-align:center;
}
.why__subtitle {
    text-align:center;
    margin: 10px;
	font-size:16px;
	font-weight:700
}
.why__text {
    margin-top: 13px;
}
@media (max-width:490px){
	.why__item {
        flex: 100.0%;
    }
}


/* ---------------- */

.treeimg{

max-width:48px;
}



/* ------------------- */

.page__modal {
    margin-top: 30px;
    margin-bottom: 50px;
}
@media (max-width:490px){
	.page__modal {
        margin-bottom: 55px;
    }
}

.page__modal__container {
}
._container {
}
.modal__title {
}
.main-block__title {
}
.modal__body {
    display: flex;
    flex-wrap: wrap;
}
.modal__item {
    flex: 1 1 30%;
    margin: 10px;
    border: 2px #000 solid;
    border-radius: 20px;
    overflow: hidden;
    padding: 8px;
    box-shadow: 0 0 10px rgba(0,0,0,0.5);
    }

    @media (max-width:897px){
        .modal__item {
            flex: 1 1 34%;
        }
    }
    @media (max-width:625px){
        .modal__item {
            flex: 1 1 50%;
        }
    }

@media (max-width:470px){
	.modal__item {
        flex: 1 1 50%;
    }
}

.imlog {
}
.treeimg {
}
.modal__subtitle {
    text-decoration: underline yellow 4px;
    font-size: 24px;
	font-weight:700;
	text-align: center;
    margin: 10px;
}
.modal__text {
    text-align: center;
    font-size: 16px;
    font-weight: 500;
}

@media (max-width:470px){
	.modal__subtitle {
        font-size: 20px;
    }
}



/* ------Sider---------- */
.slid{
    background-color: #333; 
}

@media (max-width:767px){
	.wrapper{padding: 50px 10px;}
}

/* Слайдер */
.slick-slider{
	min-width: 0;
}
/* Ограничивающая оболочка */
.slick-list {
	overflow: hidden;
}
/* Лента слайдов */
.slick-track{
	display: flex;
	align-items: flex-start;
}



/* Конкретный слайдер */
.slider {
	position: relative;
	padding: 0px 60px;
}

@media (max-width:767px){
	.slider {
		padding: 0px 40px;
	}
}

.slider .slick-arrow{
	position: absolute;
	top: 50%;
	margin: -30px 0px 0px 0px;
	z-index: 10;
	font-size: 0;
	width: 30px;
	height: 60px;
}
.slider .slick-arrow.slick-prev{
	left: 0;
	background: url('../img/button/sl-arrow_l.svg') 0 0 / 100% no-repeat;
}
.slider .slick-arrow.slick-next{
	right: 0;
	background: url('../img/button/sl-arrow_r.svg') 0 0 / 100% no-repeat;
}
.slider .slick-arrow.slick-disabled{
	opacity: 0.2;
}

.slider .slick-dots{
	display: flex;
	align-items: center;
	justify-content: center;
}
.slider .slick-dots li{
	list-style: none;
	margin: 0px 10px;
}
.slider .slick-dots button{
	font-size: 0;
	width: 10px;
	height: 10px;
	background-color: #fff;
	border-radius: 50%;
}

.slider .slick-dots li.slick-active button{
	background-color: transparent;
	border: 1px solid #fff;
}

.slider__item {
	padding: 0px 15px;
}
.slider__item img{
	max-width: 100%;
    
}
.slider__item.slick-center{
	
}


.title__slide{
	padding-top: 30px;
    color: #fff;
    text-align: center;
    font-size: 28px;
    font-weight: 700;
    margin: 30px;
}

/* ------------------------------------------------- */

#testimonial {
    width: 100%;
    padding: 70px 0;
  }
  .review{
    margin-top: 60px;

  }
  
  .ecol {
    text-align: center;
    font-size: 30px;
    margin: 15px;
  }
  
  .testimonial-row {
    width: 100%;
    margin: auto;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
  }
  
  .testimonial-col {
    flex: 1 1 33.3%;
    padding: 10px;
    margin-bottom: 30px;
    border-radius: 5px;
    -webkit-box-shadow: 0 10px 20px 3px #00968814;
            box-shadow: 0 10px 20px 3px #00968814;
  }


  @media (max-width:767px){
	.testimonial-col {
		flex: 1 0 40%;
	}
}

@media (max-width:500px){
	.testimonial-col {
		flex: 1 0 80%;
	}
}
  
  .testimonial-col p {
    font-size: 18px;
  }
  
  .user {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin: 20px 0;
    font-family: Georgia, "Times New Roman", Times, serif;
  }
  
  .user img {
    width: 40px;
    margin-right: 20px;
    border-radius: 20px;
  }
  
  .user-info .fa {
    margin-left: 10px;
    color: #27c0ff;
    font-size: 20px;
  }
  
  .user-info small {
    color: #009688;
  }
  
  .otzyv {
    background-color: #27c0ff;
    color: #000;
    width: 300px;
    height: 100px;
    border-radius: 35px;
    margin: auto;
  }
/* --------------------------------------------- */

.bodyacc {
    padding: 10px;
    max-width: 1200px;
    margin: 0 auto;
  }
  
  .bodyacc .box {
    position: relative;
    margin-bottom: 20px;
  }
  
  .bodyacc .box:last-child {
    margin-bottom: 0;
  }
  
  .bodyacc .box .label {
    position: relative;
    padding: 20px 50px 20px 20px;
    background-color: #ff0;
    color: #000;
    cursor: pointer;
    font-size:22px;
    font-weight:700;
  }

  @media (max-width:500px){
    .bodyacc .box .label {
        font-size:16px;
      }
}
  
  .bodyacc .box .label::after {
    content: "+";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 20px;
    font-size: 25px;
    font-weight: bold;
  }
  
  .bodyacc .box.active .label::after {
    content: "\2014";
  }
  
  .bodyacc .box .content {
    position: relative;
    background-color: #fff;
    overflow: hidden;
    max-height: 0;
    transition: 0.3s;
  }
  
  .bodyacc .box .content p {
    font-size: 22px;
    padding: 20px;
  }

  .box__title{
      max-width: 200px;

  }

  /* ------------TILDA------------------------------ */

  .tilda__title{
      margin: 30px;
      font-size: 28px;
      font-weight: 700;
      text-align: center;

  }

  .block__title{
    font-size: 18px;
    font-weight: 700;
    text-align: center;
    margin: 20px;
  }

  @media (max-width:777px){
    .block__title{
        font-size: 14px;
     
      }
}

  @media (max-width:500px){
    .block__title{
        font-size: 22px;
        font-weight: 700;
        text-align: center;
        margin: 10px;
      }
}

/* -------------------------------- */

.block__row {
    display: flex;
    flex-direction:column;
    justify-content: center;
}
.block__item__2 {
    align-self:flex-end;
    max-width: 50%;
}
.block__item__4 {
    align-self:flex-end;
    max-width: 50%;
}
.block__title {
    text-align:center;
}
.block__text {
    text-align:center;
    margin: 15px
}


.block__item__1 {
    max-width: 50%;
}

.block__item__1:before{ 
    content: url(../img/nubmer/number-one_icon-icons.com_66514.png);
    float: right;
    margin-right: -24px;
    }
    .block__item__2:before{ 
        content: url(../img/nubmer/number-two_icon-icons.com_66513.png);
        float: left;
        margin-left: -24px;
        }
        .block__item__3:before{ 
            content: url(../img/nubmer/number-three_icon-icons.com_66512.png);
            float: right;
            margin-right: -24px;
            }
            .block__item__4:before{ 
                content: url(../img/nubmer/number-four_icon-icons.com_66511.png);
                float: left;
                margin-left: -24px;
                }

.block__item__3 {
    max-width: 50%;
    
}
.block__item__5 {
    max-width: 50%;
}
.block__title {
    text-align:center;
}


.block__item__5:before{ 
    content: url(../img/nubmer/number-five_icon-icons.com_66509.png);
    float: right;
    margin-right: -24px;
    }




    .block__title__main{
        text-align: center;
        font-size: 24px;
        font-weight: 700;
        text-decoration: underline solid 7px;
        text-decoration-color: yellow;
    }


    .block__text{
        font-size: 16px;
        font-weight: 500;
    }

    @media screen and (max-width: 777px){

        .block__title__main{
          
            font-size: 22px;
           
        }
        .block__text{
            font-size: 14px;
            font-weight: 500;
        }
    }

    @media screen and (max-width: 600px){

        .block__item__1 {
            max-width: 100%;
        }

        .block__item__2 {
            align-self:flex-start;
            max-width: 100%;
        }
        .block__item__4 {
            align-self:flex-start;
            max-width: 100%;
        }

        .block__item__3 {
            max-width: 100%;
            
        }
        .block__item__5 {
            max-width: 100%;
        }
       

        .block__item__1:before{ 
            content: url(../img/nubmer/number-one_icon-icons.com_66514.png);
            float: left;
            margin-right: -24px;
            display: none;
            }
            .block__item__2:before{ 
                content: url(../img/nubmer/number-two_icon-icons.com_66513.png);
                float: left;
                margin-left: -24px;
                display: none;
                }
                .block__item__3:before{ 
                    content: url(../img/nubmer/number-three_icon-icons.com_66512.png);
                    float: left;
                    margin-right: -24px;
                    display: none;
                    }
                    .block__item__4:before{ 
                        content: url(../img/nubmer/number-four_icon-icons.com_66511.png);
                        float: left;
                        margin-left: -24px;
                        display: none;
                        }
                        .block__item__5:before{ 
                            content: url(../img/nubmer/number-five_icon-icons.com_66509.png);
                            float: left;
                            margin-right: -24px;
                            display: none;
                            }
                            .block__text{
                                font-size: 18px;   
                            }
    }


    @media screen and (max-width: 470px){
        .block__text{
            font-size: 16px;
            font-weight: 500;
            margin-bottom: 50px;   
        }
    }








/* ---------------------------------------- */
.controld-file{
    display: none;
}




/* -------------------------------------------------- */
#feature{
    width: 100%;
    padding: 40px 0;
}


.feature__title{
    font-size: 28px;
    font-weight: 700;
    text-align: center;
    margin-bottom: 30px;
}

@media screen and (max-width: 490px){
    .feature__title{
        font-size: 23px;
    }
}

.first__p{
    margin-bottom: 10px;

}


.title-text{
    text-align: left;
    padding-bottom: 10px;
}
.title-text p{
    margin: auto;
    font-size: 20px;
    color: #009688;
    font-weight: bold;
    position: relative;
    z-index: 1;
    display: inline-block;
}

.title-text p::after{
    content: '';
    width: 50px;
    height: 35px;
    background: linear-gradient(#019587,#fff);
    position: absolute;
    top: -20px;
    left: 0;
    z-index: -1;
    transform: rotate(10deg);
    border-top-left-radius: 35px;
    border-bottom-right-radius: 35px;
}
.title-text h2{
      font-size: 50px;
}
@media screen and (max-width: 770px){
    .title-text h2{
        font-size: 38px;
  }  
  .title-text{
    text-align: center;
    padding-bottom: 15px;
}
}

.feature-box{
    width: 80%;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    text-align: center;
}
.features{
    flex-basis: 50%;
}
.features-img{
    flex-basis: 50%;
    margin: auto;
}
.features-img img{
    width: 70%;
    border-radius: 10px;
}
.features h2{
    text-align: center;
    margin-bottom: 10px;
    font-weight: 200;
    color: #91b50f;
    font-size: 32px;
}

.features-desc{
    display: flex;
    align-items: center;
    margin-bottom: 40px;
} 
.feature-icon .fa{
    width: 50px;
    height: 50px;
    font-size: 30px;
    line-height: 50px;
    border-radius: 8px;
    color: #9db031;
    border: 1px solid #9db031;
}
.feature-text p{
    
    padding: 0 5px;
    text-align: initial;
    font-size: 18px;
}

@media screen and (max-width: 770px){
    .title-text h2{
        font-size: 30px;
        font-weight: bold;
        margin: auto;
        color: #000;
        font-weight: bold;
    }

    .features{
      flex-basis: 100%;
    }

    .features h2{
        text-align: center;
        margin-bottom: 10px;
        font-weight: 400;
        color: #009688;
        font-size: 30px;
    }

    @media screen and (max-width: 500px){
        .title-text h2{
            font-size: 30px;
        }
        .footer-row p{
            font-size: 18px;
        } 
      
    }
     
.feature-box{
        width: 100%;
        
        display: flex;     
}

    .feature-icon .fa{
        width: 25px;
        height: 25px;
        font-size: 20px;
        line-height: 25px;
        border-radius: 4px;
        color: #aeb932;
        border: 1px solid #aeb932;
    }

    .features{
       flex-basis: 100%;
    }
    .features-img{
        flex-basis: 100%; 
    }
    .features-img img{
        width: 100%;
    }

    .feature-text p{
        width: 100%;
        font-size: 15px;
        padding: 0 10px;
        text-align: initial;
    }
}

/* ---------footer-------------------- */

#footer{
    padding: 40px 0 20px;
    background: #efefef;
    position: relative;

    
}

.footer__images{
    opacity: 0.3;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
}


.footer__wrapper{
    margin: 10px 50px 20px 70px;
	padding: 10px 20px 30px 10px;
	max-width: 600px;
	max-height: 600px;
	background-color: #fff;
    z-index: 20;
    position: relative;
	border-radius: 18px;
}
@media screen and (max-width: 500px){
    
    .footer__wrapper{
        margin: 10px 10px 20px 10px;
    }
}
 .footer__img{
 
}

.footer__title{
    margin-top: 20px;
    font-size: 30px;
    font-weight: 700;
    margin-bottom: 10px;
}


@media screen and (max-width: 500px){
    .footer__title{
        font-size: 25px;
    }
}


.footer-row{
    width: 100%;
    margin: 0 auto;
}
.footer-left, .footer-right{
    padding: 10px;
    margin-bottom: 20px;
}

.footer-left a {
    color: #000;
}

.footer-right{
    text-align: right;
}
.footer-row h1{
    margin: 10px 0;
}
.footer-row p{
    line-height: 35px;
    font-size: 20px;
}

@media screen and (max-width: 500px){
    .footer-row p{
        font-size: 18px;
    }
}


.footer-right .fa,.footer-left .fa{
     font-size: 20px;
     color: #000;
     margin: 10px;
}

.footer-img{
    max-width: 370px;
    opacity: 0.1;
    position: absolute;
    left: 50%;
    top: 35%;
    transform: translate(-50%,-50%);
}


.social-links{
    text-align: center;
}
.social-links .fa{
    border-radius: 20px;
    height: 40px;
    width: 40px;
    font-size: 20px;
    line-height: 40px;
    border: 1px solid #000;
    margin: 40px 5px 0;
    color: #000;
    cursor: pointer;
    transition: .5s;
}

.social-links .fa:hover{
    background: #000;
    color: #fff;
    transform: translateY(-7px);
}

.social-links p{
    font-size: 12px;
    margin-top: 20px;
}


@media screen and (max-width: 770px){
    .footer-left, .footer-right{
        flex-basis: 100%;
        font-size: 14px;
    }
    .footer-img{
        top: 25%;
    }
} 

/* ---------------------------------------------------------- */

.pop__form{
    display: none;
}

@media screen and (max-width: 900px){
    .pop__form{
        display: none;
        margin-top: 15px;
    }
} 



    /* ------------------------------------ */

    .feature__title{
        font-size: 24px;
        font-weight: 700;
        margin-bottom: 20px;

    }


    /* ---------------------------- */
    .why__flex{
        display: flex;
    }



    .link__otzyv{
        margin: auto;
    }




    /* ----------------------------------- */
    .footer_img{
        max-width: 100%;

    }


    /* ---------------------------------------- */

    .box__ul{
        font-size: 22px;

    }