@import url("font/DINPro/stylesheet.css");

:root{
    --textColor1:#2B2C2E;
    --color1:#FCF8F1;
    --color2:#F8F0E4;
    --color3:#EFDABA;
    --color4:#6E4D1A;

}
HTML{}

BODY{line-height:1.5; font-size:14px; font-weight: normal; font-family: 'Din_Pro', sans-serif; color: var(--textColor1);}
BODY._inner{ }

.__container{ max-width: 760px; margin:0  auto; }
.__wrapper{padding-top: 54px; max-width: 2000px; margin: auto;  box-shadow: 0px 0px 10px -3px rgb(43 65 92 / 20%);}

/***/
h1{ font-size: 2rem; font-weight: bold; line-height:1; letter-spacing: -.5px}
h2{ font-size: 1.7rem; line-height: 1.1}
h3{ font-size: 1.2rem; line-height: 1.1}
a{ color: inherit}

.section-title h1{font-size: 1.8rem; padding: 10px}

.button{ font-size: 14px; font-weight:500;color: var(--textColor1);   background-color: #CE9233; width: 100%; max-width: 210px; line-height: 48px; text-align: center; border-radius: 10px; box-shadow: 0px 16px 7px -9px rgb(43 65 92 / 18%); display: block;   text-decoration: none; border: none; cursor: pointer; transition: all 0.3s ease; padding: 0px 15px; box-sizing: border-box; }
.button:hover{ box-shadow: 3px 5px 13px rgba(13, 38, 79, 0.4); transform: scale(1.05, 1.05)}


/***/
header{ position: fixed; top: 0; left: 0; width: 100%; z-index: 100;  transition: all 0.3s ease; }
.header{ background: var(--color1)}
.header-items{  padding: 12px 0 }
.header-item-logo{ display: flex; flex-grow: 0; align-items: center;  z-index: 10;  transition: all 0.3s ease; }
.header-item-logo span{ font-size: 13px;font-weight: 300; line-height: 1}
.header-logo{display: block;  height: 30px; width: 100px; background-image: url(../images/logo.svg); background-size: contain; background-position: left; background-repeat: no-repeat;}
.header-item-phone{flex-grow: 1;justify-content: flex-end;display: flex;}
.header-item-phone a{font-weight: bold;}

.header-menu{ display: none}
.header-menu-button{ margin-left: 20px}

.is-scroll header{ }
.is-scroll .header-item-logo { }

._inner header{background: #463195cc;backdrop-filter: blur(9px);}

 /***/
.menu-button{ display:block; width: 22px; height:22px; z-index: 7100;  -webkit-transition: all 0.5s ease; transition: all 0.5s ease; right: 0; }
.menu-button .menu-icon{ display:block; width:22px;position:absolute; height:2px;  top:0; bottom:0; left:0; right:0; margin:auto;
    background: var(--color4);border-radius: 2px;}
.menu-button .menu-icon:before,
.menu-button .menu-icon:after{ display:block; content:""; position:absolute; height:2px; width:100%; left:0;
    margin:auto; background: var(--color4); -webkit-transition: all .3s ease; transition: all 0.3s ease; border-radius: 2px;}
.menu-button .menu-icon:before{ top:7px;}
.menu-button .menu-icon:after{ bottom:7px;}
.menu-button.is_open .menu-icon, .menu-button.is_open .menu-icon:before, .menu-button.is_open .menu-icon:after{  background: var(--color4);}
.menu-button.is_open { -webkit-transform: rotate(-180deg)}
.menu-button.is_open .menu-icon{ height:0; }
.menu-button.is_open .menu-icon:before{-webkit-transform: rotate(-45deg);    transform: rotate(-45deg);      width: 100%;   top: 0; bottom:0;}
.menu-button.is_open .menu-icon:after{-webkit-transform: rotate(45deg);    transform: rotate(45deg);      width: 100%;   top: 0; bottom:0;}

.over-content .header-menu{ display: flex;  height: 100%; flex-direction: column; justify-content: center}
.over-content .menu-items a{ color: var(--color4) !important}

.section{ margin-top:30px}
.section-background{ background: var(--color1);  }
.section-about{ margin-top:40px; padding-bottom: 30px;}

.block-content-desc .buttons{ margin-top: 20px;}

p{margin-bottom: 10px; margin-top: 0}
p:last-child{margin-bottom: 0px}

/***/
.page{ }
.page p{  }
.page ol li,
.page ul li,
.page .ol .li,
.page .ul .li { }

video{ display: block; max-width: 100%; height: 100%; object-fit: cover;}

.link-detale{ display: inline-block; border: 1px solid #6E4D1A; border-radius: 30px; line-height: 30px; padding: 0 50px 0 20px; position: relative; box-sizing: border-box; color: #6E4D1A }
.link-detale:after{display: block; position: absolute; content: ""; width: 32px; height: 32px; border-radius: 50%; border: 1px solid #6E4D1A; top:-1px; right: -1px; background-image: url(../images/icon-arrow.svg); background-repeat: no-repeat; background-position: center; background-size: 12px;   box-sizing: border-box;   transition: all 0.3s ease-in-out; }
.link-detale:hover:after{ background-color: #e2bc82}

.buttons{ display: flex; }
.buttons .link-detale{ margin-right: 20px}
.buttons .link-detale:last-child{ margin-right: 0px}


/***/
.double-blocks{ display: flex; flex-direction: column;}
.block-content-uptitle{ display: inline-block; padding: 5px 10px; margin-bottom: 20px; border-radius: 8px;
    background: var(--color3); font-weight: 500;}

.double-blocks .block-media{ border-radius: 15px; overflow: hidden}
.double-blocks .block-media-video{position: absolute;  top: 0; bottom: 0; left: 0; right: 0; margin: auto; opacity: 1; z-index: 10;
    transition: all 0.3s linear;}
.double-blocks .block-media-video.poster{opacity: 0;  z-index: -1;}
.double-blocks .block-media-video.is-show{ opacity: 1; z-index: 10}

.block-line{border-top: 1px solid #EAEAEA; }
.line-padding-both{height: 1px; background:#EAEAEA;  margin-top: 30px; margin-bottom: 30px}

.block-media button{position: absolute; display: block; bottom: 20px; right: 0; border-radius: 50px 0 0 50px; background: rgb(255 255 255 / 40%); color: var(--color3); padding: 0px 20px 0px 50px; height: 40px; line-height: 40px; border: none; z-index: 20; cursor: pointer;  transition: all 0.3s linear; }
.block-media button:before{ display: block; position: absolute; content: ""; width: 40px; height: 40px; border-radius: 50%; background: #FCF8F1; top:0; left: 0; background-image: url(../images/icon-video-play.svg); background-repeat: no-repeat; background-position: center; background-size: 16px;  transition: all 0.3s linear;  }
/*.block-media button.is-play {max-width: 40px; overflow: hidden; border-radius: 50%; padding: 0; right: 20px }*/
.block-media button.is-play:before {background-image: url(../images/icon-video-stop.svg);  }

.block-media-desktop{ display: none}
.block-media-mobile{ max-width: 420px; margin: auto; margin-bottom: 20px;}

.double-blocks .block-content{ order: 2; margin-top: 25px}
.double-blocks .block-content h1{margin-top: 0; }
.double-blocks .block-content h2{margin-top: 0; font-size: 1.6rem}

.swiper-slide{ height: unset}

/**/
.list-blocks{}
.list-blocks.slider .swiper-wrapper .swiper-slide { margin-left: 15px; flex-basis: calc(100% - 120px)}
.list-blocks .list-block{ height: 100%; box-sizing: border-box}
.list-blocks .list-block-inner{height: 100%; box-sizing: border-box; background: var(--color1); padding: 20px; border-radius: 15px; z-index: 10;
display: flex; flex-direction: column;transition: all 0.3s linear; }

.list-blocks .list-block-inner div{ flex-grow: 1}
.list-blocks .list-block h3{ margin-top: 10px; margin-bottom: 20px;}
.list-blocks .list-block p{ margin-top: 0; margin-bottom: 10px}
.list-blocks .list-block p:last-child{margin-bottom: 0px}

.list-blocks .list-block-link{ display: block; width: 26px; height: 26px; border-radius: 50%; border: 1px solid var(--color4); margin-top: 10px; margin-left:auto; margin-right: 0; background-image: url(../images/icon-arrow.svg); background-repeat: no-repeat; background-position: center; background-size: 10px;  }
.list-blocks .list-block-overlink{ display: block;position: absolute; top:0; left: 0; width: 100%; height: 100%}


.list-blocks-frame .list-block{padding-left: 12px; padding-top: 12px; }
.list-blocks-frame .list-block:before{ display: block; position: absolute; content: ""; width: 50%; height: 50%; border-radius: 15px; border: 1px solid  var(--color3); top:0px; left: 0px; z-index: 0; box-sizing: border-box }
/**/
.list-services .list-block-inner{ background: var(--color2)   }
.list-services img{ border-radius: 10px; margin-bottom: 20px   }
.list-services .list-block-inner:hover .list-block-link{background-color: var(--color3)}
.list-services .list-block-inner:hover{ background: #f5e8d3  }

/**/
footer{ padding: 15px 0; background: var(--color2); color: #6E4D1A;  margin-top: 30px}
footer .footer{ padding-bottom: 15px; text-align: center}
footer .footer-item{ padding-top: 25px;}
footer .footer-item-desktop{ display: none}
footer .item-info-logo{ text-align: center; }
footer .item-info-logo a{ width:140px; height: 40px; display: inline-block; background-image: url(../images/logo.svg); background-size: contain; background-position: center top; background-repeat: no-repeat;}
footer .item-info-logo p{ font-weight: 500;}
footer .item-info-company{ padding-top: 15px;}
footer .item-contacts-phone{ font-size: 18px; font-weight: 600 }
footer .item-contacts-button{ padding-top: 20px}
footer .item-contacts-button .button{ margin: auto; max-width: 240px; color: #fff}

footer .item-docs-links a{ display: block; text-decoration: underline; cursor: pointer; margin-bottom: 10px}

footer .footer-disclaimer{ border-top: 1px solid rgb(110 77 26 / 25%); padding-top: 15px; margin-top: 15px; font-weight: 100  }
footer .small-disclaimer{ font-size: 12px; line-height: 1.4}

.footer-item-adress{ font-size: 14px;}
.footer-item-phones  a{ display:block; background-size: 20px; background-repeat: no-repeat; background-position: 0 center; display: block; font-weight: 400; font-size: 16px; font-weight: 600 }

.footer-item-cosial .cosial-link{ margin: auto }
.footer-text{font-size: 11px; opacity: .7; border-top: 1px solid rgb(255 255 255 / 10%); text-align: center }
.footer-text a{ text-decoration: underline;  }
.footer p{ margin: 0}
.footer-privacy{ font-size: 12px;opacity: .7; border-top: 1px solid rgb(255 255 255 / 10%); padding-top: 15px;
    text-align: center;}
.footer-privacy a{line-height: 2; text-decoration: underline}

.checkbox label:before, .checkbox label:after{ cursor: pointer}

/***/
.contact-block{  border-radius: 15px; overflow:hidden; background-color: var(--color2); }
.contact-block-content{ padding: 30px; border-radius: 15px;   font-weight: 300;  background-color: var(--color3); font-size:16px}
.contact-block-content h2{ margin-top: 0}
.contact-block-content .plist{padding-left: 30px; position: relative}
.contact-block-content .plist:before{display:block; content:""; position:absolute; height:22px; width:22px; left:0; top: 2px;
    margin:auto; background-color:#FBFBFB; background-image: url(../images/icon-galka.svg); background-size: 12px; background-position: center; background-repeat: no-repeat; border-radius: 50%}
.contact-block-content .plist.warning{ font-weight: bold; margin-top: 20px}
.contact-block-content .plist.warning:before{ background-color: #9F5151;  background-image: url(../images/icon-cancel.svg);  background-size: 10px;}

.contact-block-form{ border-radius: 15px; padding: 30px; color: #6E4D1A}
.contact-block-form .form-title{ font-size: 1.4rem; line-height: 1.2; font-weight: bold; margin-bottom: 20px; }
.contact-block-form .form-row{ margin-bottom:25px;}
.contact-block-form .form-row.text input{ display: block; border: none; background: transparent; border-bottom: 1px solid #6E4D1A; width: 100%; box-sizing: border-box;  padding: 0;   }
.contact-block-form input{color:rgb(110 77 26); font-size: 1rem }
.contact-block-form input::placeholder { color: rgb(110 77 26 / 0.8); font-weight:300;  }

.contact-block-form .form-row.checkbox{display: flex;  margin-bottom: 30px }
.contact-block-form .form-row.checkbox  input{ display: block; border: 1px solid #6E4D1A; background: rgb(255 255 255 / 20%); width: 22px; height: 22px; box-sizing: border-box;  border-radius: 4px; flex-shrink: 0; flex-grow: 0; margin-right: 15px;}
.contact-block-form .form-row.checkbox input:checked{background: rgb(255 255 255 / 85%);}
.contact-block-form .form-row.checkbox label{ font-weight: 300; font-size: 13px; color: inherit}
.contact-block-form .form-row.checkbox label a{ text-decoration: underline}
.contact-block-form .form-title{ margin: auto; margin-bottom: 30px;}
.contact-block-form .button{ color: #fff}
.contact-block-form .button.preload{ }
.contact-block-form .form-row.submit{ margin-top: 40px;}

.form-vracham .contact-block-form h2{margin: 0; margin-bottom: 15px;}
.form-vracham .contact-block-form p{ line-height: 1.4}
.form-vracham .contact-block-form .form-title{ margin-top: 20px;}
.form-vracham a.download{ display: block; background-image: url(/images/dwnl.svg); background-repeat: no-repeat; background-position: 10px center; background-size: 16px; font-weight: 600; border: 1px solid #6E4D1A; padding: 10px 20px; padding-left: 35px; border-radius: 10px; max-width: 250px; cursor: pointer; margin-top: 20px;  }

.form-row .field-error{ position: absolute; font-size: 12px; color: #9f5151;  line-height: 1.2; right: 0; bottom: -18px; opacity: 0; transition: all 0.3s linear;   border-radius: 3px; padding: 2px 5px; }
.form-row .field-error.is-show{opacity: 1}
.form-row.checkbox input:checked + label:before{ border-color: #6E4D1A !important;}
.form-row.checkbox input:checked + label:after{ background-color: #6E4D1A !important}


.page-content a{ font-weight: normal; text-decoration: underline}

/***/
.map-block{ box-shadow: 0px 4px 24px -3px rgba(0, 0, 0, 0.15);  border-radius:  10px; overflow: hidden }
.map-block-content{background: #FFFFFF;  padding: 25px;}
.map-block-content h3{ margin-top: 0}
.map-wrap { height: 340px; filter: saturate(0.7);  }
.map-wrap iframe{ display: block; width: 100%; height: 100%;}

/**/
/***/
.popup-form{ max-width: 500px; margin: auto  }
.popup-form form{ margin: auto}
.popup-form > div{ padding: 20px;}
.popup-form label{ font-weight: 600; margin-bottom: 5px;}
.popup-form *::placeholder{ }
.popup-form .form-title{ font-size: 22px; font-weight: bold; line-height: 1.2; margin-bottom: 30px; color: #fff}
.popup-form .form-row{ padding-bottom: 20px;  }
.popup-form .form-row.checkbox{ padding-bottom: 40px; padding-top: 10px}
.popup-form .form-row.text input{ display: block; width: 100%; box-sizing: border-box; border-radius: 10px; padding: 5px 0; border: 1px solid var(--color4) !important; background-color: #fff; box-shadow: 0 2px 10px -3px   rgb(0 0 0 / 20%); padding: 15px }
.popup-form .form-row.text textarea{ display: block; width: 100%; box-sizing: border-box; padding: 5px 0; border: 1px solid var(--color4) !important; background-color: transparent;    box-shadow: 0 2px 10px -3px   rgb(0 0 0 / 20%); border-radius: 10px; padding: 10px;}
.popup-form .select-input input{ display: block; width: 100%; box-sizing: border-box; border-radius: 10px; padding: 5px 0; border: 1px solid var(--color4) !important; background-color: #fff; box-shadow: 0 2px 10px -3px   rgb(0 0 0 / 20%); padding: 15px }
.popup-form .button{ height: 50px; background: var(--color4); color: #fff}

.popup-form .title{ font-size: 22px; line-height: 1.2; text-align: center; font-weight: 600; color: var(--color4)}
.popup-form .title-wrap  .text{ text-align: center}
.popup-form .title-wrap{ margin-bottom: 30px;}

.popup-form .form-row.checkbox input{ width: 0; height: 0; opacity: 0; z-index: -1; visibility: hidden; position: absolute}
.popup-form .form-row.checkbox label{ padding-left: 40px;display: block;position: relative;font-size: 13px;line-height: 1.3; color: var(--color4)  }
.popup-form .form-row.checkbox label:before, .form-row.checkbox label:after{ content: ""; position: absolute; display: block;   transition: all 0.3s linear; opacity: 0.8;}
.popup-form .form-row.checkbox label:before{top:3px;   left: 0; width: 26px; height: 16px; border: 2px solid #bcbcbc; border-radius: 12px;}
.popup-form .form-row.checkbox label:after{top:8px; left: 7px; width: 10px; height: 10px;  border-radius: 50%;    background-color: #bcbcbc;}
.popup-form .form-row.checkbox input:checked + label:before{ border-color: var(--color4)}
.popup-form .form-row.checkbox input:checked + label:after{ left: 15px; background-color:  var(--color4)}
.popup-form .form-row.checkbox label a{text-decoration: underline;}
.popup-form .form-row.submit{ margin-top: 5px;}
.popup-form .button{  margin: auto}
.popup-form .form-row .field-error{ bottom: -2px}
.acms_popup_wrapper {border-radius: 15px !important;}


@media only screen and (min-width: 480px) {

    .list-blocks.slider .swiper-wrapper .swiper-slide { margin-left: 25px;}
    .list-blocks .list-block-inner{ padding: 20px 30px;}

    .list-services.slider .swiper-wrapper .swiper-slide { margin-left: 15px; flex-basis: calc(100% - 200px)}
}
@media only screen and (min-width: 600px) {


    .list-services.slider .swiper-wrapper .swiper-slide { margin-left: 15px; flex-basis: calc(100% - 260px)}

}


@media only screen and (min-width: 768px) {
    BODY{ font-size:15px;}

    h2{ }
    h3{ }
    .section-title h1{ }

    /**/
    .header-items{ padding: 15px 0 }
    .header-item-logo span{padding-left: 20px;width:180px;  }

    /**/
    .list-blocks.slider{ padding: 0 25px; margin-top: 30px}
    .list-blocks.slider .swiper {   margin-left: -15px}
    .list-blocks.slider .swiper-wrapper{ flex-wrap: wrap; justify-content: space-between; }
    .list-blocks.slider .swiper-wrapper .swiper-slide { flex-basis: calc(50% - 15px); margin: 0; margin-bottom: 30px}

    .section-about{padding-bottom: 0px;}
    .list-services.slider .swiper{ margin: 0}

    .double-blocks .block-content h1{font-size: 2.2rem}
    .double-blocks .block-content h2{font-size: 1.8rem}

    /**/
    .contact-block{ display: flex; justify-content: space-between; background-color: #F8F0E4;   align-items: stretch}
    .contact-block-form{ background: none}
    .contact-block-content{ padding: 30px; flex-grow: 0; box-sizing: border-box; display: flex;  flex-direction: column; justify-content: center}
    .contact-block > div{ flex-basis: 50%; box-sizing: border-box; flex-grow: 0;}
    .contact-block-form .form-wrapper { margin-bottom: 0}
    .contact-block-form .form-row:last-child{margin-bottom: 0}

}



@media only screen and (min-width: 1024px) {
    BODY{ }
    .__container{ max-width:1320px; }
    .__wrapper {padding-top: 70px;}

    h1{  }
    h2{ }
    .section-title { padding: 15px 15px }

    /**/
    .header-logo { width: 120px; height: 40px;}
    .header-item-logo span{ width:140px;  }
    .header-item-phone { flex-grow: 0}

    .header-menu{ display: block; flex-grow: 1;}
    .header-menu ul{display: flex; margin: 0; padding: 0; list-style: none; justify-content: center;}
    .header-menu li{ margin: 0 15px; }
    .header-menu a{ color: var(--textColor1);font-weight: 500; position: relative }
    .header-menu a.current:after{ display: block; content: ""; height: 3px; position: absolute; width: 100%; left: 0; bottom: -29px; background: #CE9233}

    .section {margin-top: 50px;}
    .section-home {margin-top: 40px;}

    /**/
    .double-blocks{ flex-direction: row; justify-content: space-between}
    .double-blocks .double-block{ width: calc(50% - 15px)}
    .double-blocks.double-40-60 .double-block:first-child{ width: calc(40% - 15px)}
    .double-blocks.double-40-60 .double-block:last-child{ width: calc(60% - 15px)}
    .double-blocks .block-media-image{ height: 100%}
    .double-blocks .block-media-image img{ height: 100%; object-fit: cover}
    .double-blocks .block-content{ margin-top: 0; order: 0}
    .double-blocks .block-content.double-block-revers{ order: 2}

    .double-blocks .block-content h1{font-size: 2.2rem}
    .double-blocks .block-content h2{font-size: 1.8rem}

    .block-media-desktop{ display: block}
    .block-media-mobile{ display: none}

    .block-line{ padding-top: 40px}

    .line-padding-both{ margin-top: 40px; margin-bottom: 40px}


    /**/
    .section-home .block-content-desc{ font-size: 16px}

    /**/
    .double-blocks.scanface .block-content{order: 2}

    /**/
    .section-about{padding-top: 30px}

    /**/
    .section-kollegam  .double-blocks .block-content{ margin-top: 0; order:2}

    /**/
     .list-blocks.slider .swiper-wrapper .swiper-slide { flex-basis: calc(25% - 20px); margin: 0; }

    .section-services{ }
    .list-services .list-block-inner { padding: 20px}

    footer{   margin-top: 50px}
    footer .footer{ text-align: left}
    footer .footer-items{ align-items: start}
    footer .footer-item{ text-align: left; margin-bottom: 0px; max-width: 30%}
    footer .footer-item-mobile{ display: none}
    footer .footer-item-desktop{ display: block}
    footer .item-info-logo{ text-align: left}
    footer .item-contacts-button .button{ margin: 0}
    footer .item-info-license{ padding-top: 24px;}
    footer .item-contacts-phone {font-size: 20px;font-weight: 600;margin: 8px 0;}
    footer .footer-disclaimer{ text-align: center}
    footer .item-docs-links{padding-top: 46px;}
    footer .item-docs-links a{ margin-bottom: 0}

    .contact-block-content{ padding: 30px 60px; }
    .contact-block-content div:nth-child(1) {  font-size: 34px;}
    .page-form-phone{ display: inline-block}
    .contact-block-form{ max-width: 560px; margin: auto; padding: 40px}

    /***/

    .map-block-content{position: absolute; z-index: 10; top: 50px; left: 50px; width: 290px; box-shadow: 0px 4px 24px -3px rgba(0, 0, 0, 0.15); border-radius:  15px;}
    .map-wrap{ height: 400px}
}

@media only screen and (min-width: 1280px) {
    .__wrapper {padding-top: 90px;}

    h1{ font-size: 2.8rem; }
    h2{ font-size: 2.2rem}


    .header-items{ padding: 20px 0}
    .header-logo{   width: 140px; height: 50px}
    .header-item-logo span{ font-size: 14px;}
    .header-item-phone a{ font-size: 20px; font-weight: bold}
    .header-item-button { margin-left: 40px }
    .header-item-button .button{ color: #fff; }

    .header-item-menu{ font-size: 15px}
    .header-menu a{ font-size: 16px; line-height: 1}
    .header-menu a.current:after{  bottom: -39px;}

    /**/
    .double-blocks .block-content h1{font-size: 2.8rem}
    .double-blocks .block-content h2{font-size: 2.2rem}

    /**/
    .list-blocks.slider{padding: 0px 30px}

    .list-services .list-block-inner { padding: 20px 30px;}

    .block-line{ padding-top: 50px}


    }
