@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;600;700;800&display=swap');

* {transition: all 0.3s linear;}
.not div:before {content: 'Страница в разработке'; width: 140px; height: 70px; text-align:center; position:absolute; bottom:70px; right:20px; background:#FFF; transition: all 0.2s linear; color:#000; padding:15px; opacity:0; }
.not div:after {content: ''; width: 0; height: 0; border-right: 20px solid transparent; border-left: 20px solid transparent; border-top: 20px solid #fff; position:absolute; bottom:55px; right:68px; transition: all 0.2s linear; opacity:0;  }

.not:hover div:before, .not:hover div:after { opacity:1;  }
.mob {display: none !important;}
.atel {text-decoration: none;}

.section3 .not div:before { bottom:160px;}
.section3 .not div:after { bottom:145px;}

.mobile { display:none;}
.podmenu { display:none;}

#top_nav{top: 95px; position: fixed; z-index: 1000;}
.header { width: 100%; max-width:1900px; height:250px; margin:0 auto; background: linear-gradient(rgba(255,255,255,1),rgba(25,25,35,0.0));; position:relative; color: #747474; filter: drop-shadow(2px 2px 6px white);}
.header .logo { width: 175px; height:165px; background:url(../images/logo-gkpis.png) center no-repeat; background-size: 100%; /*position:absolute; left:0; top:10px;*/ display:block; margin-top: 10px;}
.header a { color: #2a547a;}
.header .menu { /*position: fixed;*/ left: 80px; z-index: 1000; width: auto; cursor: pointer; height: 80px; display: flex; flex-wrap: wrap; align-items: center;}
.header .menu div {width: 30px; height: 26px; margin-right: 10px;}


.scroll header { height:85px;}
.scroll .header { background: rgba(255, 255, 255, .8); backdrop-filter: blur(20px); filter: none;}
.scroll .header .logo { width: 175px; background:url(../images/logo-text-col.svg) center no-repeat;  margin: 0;}
/*.scroll .header .adres, .scroll .header .tel, .scroll .header .socicons  { display:none;}*/
.scroll .header, .scroll .header .logo, .scroll .header .top {height: 85px;}
.scroll .header .callback a {height: 45px; background: url(../images/icons/phone.svg) 7% 50% no-repeat rgba(137, 33, 27, 1); background-size: 14%; padding: 13px 17px 0 50px; font-weight:500; text-transform: none;}
/*.scroll .header .top {display: flex; flex-wrap: nowrap; justify-content: flex-end; flex-direction: row-reverse; padding: 0 0 0 175px;}*/
.scroll .cd-main-nav-wrapper {width: 100%; padding: 0; }
.scroll .cd-main-nav {padding-top: 0px;}
.scroll .cd-main-nav li a { font-size: 1.1rem; }
.scroll .sokr { display: none;}

.header .top, .header .bottom { width:100%; max-width:1600px; margin:0 auto; position:relative; box-sizing: border-box; }
.header .top { /*padding:0 0 0 175px; height:135px;*/ display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; padding: 0 50px; }
.header .bottom { padding:0 0 0 175px; height:80px; }

.gkmenu {line-height: 1.1; font-size: 0.9rem; font-weight: 600;}
.gkmenu a { font-size: 1.2rem;}



/*.tel { line-height: 0.9; text-align: right;}*/
.tel { line-height: 1.5; font-size: 1.4rem; display: flex; align-items: center;}
.tel strong {  font-weight: 700; padding-right: 5px; position: relative; display: flex; justify-content: space-between; flex-direction: column;}
.tel strong a:before {height: 36px !important; background: #fff !important;}
.tel div {width: 45px; height: 46px; margin-right: 10px; display: flex; -webkit-mask: url(../images/phone.svg) no-repeat 50% 50%; background: #747474; -webkit-mask-size: 30px;}
.tel:hover div {
    animation: krug 2.5s infinite ease-in-out;
    background: #454347;
}

.navBurger:hover, .botton:hover font  {animation: krug 2.5s infinite ease-in-out;}

.header a:hover {color: #454347; /*transform: scale(1.03);*/}

.socicons a { width:55px; height:55px; border-radius:55px; /*background-color:rgba(234, 234, 234, 1) !important;*/ display:inline-block; margin:0 10px;}
.massager a {  width:55px; height:55px; border-radius:55px; display:inline-block; margin:0 10px; background-color:rgba(185, 185, 185, 1) !important; }

.top .socicons { display: flex !important; }
.socicons .youtube { background:url(../images/icons/youtube.svg) center no-repeat; background-size: 85%;}
.socicons .vk { background:url(../images/icons/vk.svg) center no-repeat; background-size: 100%;}
.socicons .insta { background:url(../images/icons/insta.svg) center no-repeat; background-size: 65%;}
.socicons .facebook { background:url(../images/icons/facebook.svg) center no-repeat; background-size: 65%;}
.massager .telegram { background:url(../images/icons/telegram.svg) center no-repeat; background-size: 55%;}
.massager .whatsapp { background:url(../images/icons/whatsapp.svg) center no-repeat; background-size: 55%;}
.massager .viber { background:url(../images/icons/viber.svg) center no-repeat; background-size: 55%;}
.socicons .callus { background:url(../images/icons/phone.svg) center no-repeat; background-size: 55%; display: none;}

.header .socicons a:hover {transform: scale(1.1); background-color:rgba(200, 215, 240, .3) !important;}

.header .callback a { height:55px; background:url(../images/icons/phone.svg) 10% 50% no-repeat rgba(137, 33, 27, 1); background-size: 17%; display:inline-block; padding:18px 25px 0 70px; font-weight:bold; text-transform:uppercase; color:#FFF;}
.header .callback a:hover {transform: scale(1.03); background-color:rgba(99, 40, 35, 1) !important;}



.topslider { /*background:url(../images/slide-1.jpg) center no-repeat; background-size: cover;*/ height: 80vh; max-height: 1100px; min-height: 700px; overflow: hidden; width: 100%; max-width: 1900px; margin: 0 auto; position:relative; /*box-shadow: 0 0 100px 0 rgba(0,0,0,.6) inset;*/  }
.topslider video { z-index:-100; -webkit-filter: grayscale(50%); filter: grayscale(50%); opacity:0.6; min-width: 100%; min-height: 100%; width: auto; height: auto;}
.topslider .texts { position:absolute; bottom:0; width:100%; height:100%; /*background:url(../images/dots.png); border-bottom:10px solid rgba(137, 33, 27, .6);*/ z-index:1; background: linear-gradient(rgba(25,25,35,0.0),rgba(25,25,35,0.0),rgba(25,25,35,0.0),rgba(25,25,35,0.6));}
.topslider .texts .one { position:absolute; top:50%; left:25%; background: rgba(255, 255, 255, .6); z-index:2; padding:2.5rem; display: flex; justify-content: center; align-items: center; backdrop-filter: blur(6px);}


.topslider .texts .one .year {font-size:4.5rem; font-weight: 400; color: #747474; padding-right: 2rem; border-right: 5px solid #2a547a;}
.topslider .texts .one .name {font-size:1.2rem; color: #2a547a; padding-left: 2rem; font-weight: 600; }

.topslider .texts .one .customer { position: absolute; top: -125px; left: -50px; background: #fff; padding: 1rem; font-size: 0.9rem;}
/* слайдер обратная прокрутка фикс */
.slider * {transition: auto;}
/* слайдер обратная прокрутка фикс */



/* слайдер главная */
.topslider .slick-slide {max-width: 1900px; width: 100%; margin:0;}
.galone {background-position:center; background-repeat: no-repeat; background-size: cover; height:80vh; min-height: 700px;}

.slide0 {background-image:url(../images/slide-0.jpg);}
.slide1 {background-image:url(../images/slide-1.jpg);}
.slide2 {background-image:url(../images/slide-2.jpg);}
.slide3 {background-image:url(../images/slide-3.jpg);}
.slide4 {background-image:url(../images/slide-4.jpg);}


.is-animating .galone {animation-name: scale; animation-duration: 10s; animation-iteration-count: infinite; animation-timing-function: cubic-bezer(1, .01, 0, 1.01); transform-origin: 50% 50%}
@keyframes scale {
    0% {transform: scale(1)}
    50% {transform: scale(1.1)}
    100% {transform: scale(1)}
}
/* слайдер главная */

.mincontent {width: 100%; max-width: 1600px; margin: 0 auto; position: relative; margin-bottom:60px; padding: 0 50px;}
.maxcontent {width: 100%; max-width:1900px; margin: 0 auto; position: relative; overflow: hidden;}
.red { background:rgba(250, 230, 230, 1);}
.darkred { background:rgba(137, 33, 27, 1);}
.whitegray { background:rgba(234, 234, 234, .6);}
.gray { background:rgba(209, 209, 210, 1); background-image: url(../images/gray-bg.jpg); background-position: left center;
    background-repeat: no-repeat;
    background-size: contain;}
.black { background:rgba(209, 209, 210, 1); background-image: url(../images/footer-bg.jpg); background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;}
.darkgray  { background:rgba(25, 25, 35, 1); padding:10px 0 !important; text-align:center; color:rgba(234, 234, 234, 1);}

.darkgray a { color:rgba(234, 234, 234, 1);}
.darkgray strong { color: #FFF;
    -webkit-mask: url(../images/phone.svg) 80% 0% no-repeat;
    padding: 0 0 0 65px;
    font-weight: 600;
    -webkit-mask-size: 18px;
    background: #fff;
}}
/*.red h2, .gray h2 { color:#89211b; font-size: 3.3rem; font-weight:100; padding: 50px 0 0 0;}*/
.black h2 { color:#FFFFFF; font-weight:100; padding: 50px 0 0 0;}
.whitegray h2 {padding: 50px 0 0 0;}

.maxcontent .cont {width: 100%; max-width:1600px; margin: 0 auto; position: relative; padding: 20px 50px;}

.projects {background:url(../images/black-bg.jpg) center no-repeat; box-shadow: 0px 60px 130px 130px rgba(25,25,35,0.8) inset;}


/*.epcm .contentcontainer {background:url(../images/uslugi/us-epcm.jpg) center top no-repeat; }*/

table {margin: 0 auto; border: 1px solid rgba(0, 0, 0, .1); border-right: none; min-width: 90%;}
td {padding: 10px 10px 10px 15px; /*border-bottom: 1px solid rgba(0, 0, 0, .1);*/ border-right: 1px solid rgba(0, 0, 0, .1);}
thead {/*background: rgba(200, 215, 240, 1);*/ background: rgba(75, 75, 85, 1); color: #FFF; font-weight: bold; text-align: center;}



.callbackbg { width:206px; height:319px; position:absolute; bottom:0; right:0; -webkit-filter: drop-shadow(0px 0px 60px rgba(255,255,255,1)); filter: drop-shadow(0px 0px 60px rgba(255,255,255,1));}
.callback .cont { padding:0 230px 0 0;}

.stroy h1 { color: #4b4b55; margin-top: 10px;}
.stroy .block { width: 60vw; max-width: 1100px; padding: 30px 0;}
.stroy .cont {display: flex; justify-content: flex-end;}


.compicts {/*display: flex; flex-wrap: wrap; justify-content: space-around;*/}
.compictsnongal {display: flex; flex-wrap: wrap; justify-content: space-around;}
.compicts a, .compictsnongal a {width: 380px; height: 375px; text-align:center; /*margin: 15px;*/ background: #eaeaea; transition: all .3s linear; }

.compictsnongal a {margin: 15px;}
.compicts a div, .compictsnongal a div {width: 380px; height: 280px; margin-bottom:20px; box-shadow: 0 0 30px 0 rgba(25,25,35,.5) inset; display: flex; align-items: center; font-size: 5rem; font-weight: bold; color: #89211b; justify-content: space-around; background-size: 100%; background-repeat: no-repeat; background-position: center; transition: all .3s linear;}
.compicts a:not(:hover), .compictsnongal a:not(:hover) {  filter: saturate(40%); -webkit-filter: saturate(40%);}
.compicts a:hover div, .compictsnongal a:hover div {background-size: 110%; font-size: 6rem; }
.compicts a:hover, .compictsnongal a:hover {transform: scale(1.06);}







.breadcrumbs {margin-top: 20px; padding-bottom: 20px; border-bottom: 1px solid #eaeaea; margin-bottom: -10px;}

.usicons {display: flex; flex-wrap: wrap; justify-content: center;}
.usicons .icon { width:380px; height:245px; border:1px solid #eaeaea; margin:15px; background-size: cover !important;}
.usicons .icon a {color: #4b4b55; width: 100%; height: 170px; display: flex; flex-wrap: wrap; align-items: center; font-size:1.2rem; font-weight:500; padding-left: 200px; background: linear-gradient(to right, rgba(0,0,0,0), rgba(255,255,255,.2), rgba(255,255,255,.8), rgba(255,255,255,1)); drop-shadow(0px 0px 5px rgba(255,255,255,.9)); -webkit-filter: drop-shadow(0px 0px 5px rgba(255,255,255,.9)); }

.usicons .icon font {display: flex; flex-wrap: wrap; align-items: center; width: 100%; height: 75px; font-size: 0.9rem; background: #eaeaea; padding: 0 10px 0 15px;}

.usicons .ognestoy font {/*background:url(../images/msk.svg) 15px 50% no-repeat #eaeaea; background-size: 10%; padding-left: 65px;*/}

.usicons .ognestoy {background:url(../images/ognestoy.jpg) center left no-repeat; }
.usicons .postavka {background:url(../images/postavka-1.jpg) center left no-repeat; }
.usicons .obolochky {background:url(../images/obolochky.jpg) center left no-repeat; }
.usicons .remont {background:url(../images/remont.jpg) center left no-repeat; }
.usicons .stroy {background:url(../images/stroy.jpg) center left no-repeat; }

.flex { display: flex; flex-wrap: wrap; justify-content: center; margin:1rem 0; align-items: center;}
.flex div {flex: 1 0 50%;}

.flex .shadow {box-shadow: 0px 0px 20px rgba(200,215,240,1); margin:30px; flex: 0 0 35%; height: fit-content; background: rgba(200, 215, 240, 1);}
.flex .shadow img { top:-25px; left:-25px; position:relative; max-width:100%; height:auto;}
.flex .right { }
.flex .right img { top:25px; left:25px; }

.ageent-ru {    margin: 15px 5px;}
.newspic { text-align:center; margin-bottom:30px;}
.news .cont, .newscont {display: flex; flex-wrap: wrap; justify-content: space-between;}
.news .cont .blog, .newscont .nhalf, .info .icon { width:49%; height:205px; border:1px solid #eaeaea; margin:15px 0; overflow:hidden; position:relative; background: #fff; padding: 40px;}
.obj .cont .blog {height:350px; padding: 0;}
.news .cont .blog .block, .newscont .nhalf .block { /*padding:40px;*/ height: 100%; overflow: hidden;}
.newscont .nhalf .createdate, .news .createdate { /*display: none;*/ margin-bottom:20px; font-size: 0.9rem; font-weight: 600;}
.news .cont .blog .block .newspic, .newscont .nhalf .newspic { position:absolute; bottom:20px; left:0; text-align:center; width:380px; height:100px; background:#FFF; padding-top: 30px; filter: none; margin:0; }
.news .cont .blog .block a, .newscont .nhalf a { width: 100%; height: 100%; display: flex; flex-wrap: wrap; align-items: center; }
/*.news .cont .blog .block a div, .newscont .nhalf a div { -webkit-mask-size: 65%; background: #b0b0b0; width: 190px; height: 160px;}*/
.newspic { display: none;}
.news .cont .contentheading, .newscont .contentheading { margin-bottom:20px;}
.news .cont .button, .newscont .nhalf .button { position:absolute; width:100%; height:100%; left:0; top:0;}
.news .cont .blog:hover, .newscont .nhalf:hover {  -webkit-filter: drop-shadow(0px 0px 20px rgba(200,215,240,1)); filter: drop-shadow(0px 0px 20px rgba(200,215,240,1));}
.news .cont .blog .block .newspic img, .newscont .nhalf .newspic img { width:100%; height:100%; }
.news .contentpaneopen {height: 100%; overflow: hidden;}
.news .contentpagetitle, .contentpagetitlenews, h5 { font-size: 1.2rem; color:rgba(225, 127, 0, 1); font-weight: bold;}
.obj .contentpaneopen {
    height: 100%;
    overflow: hidden;
}
.obj .cont .blog .block {	padding: 0;}
.contnews li { margin-bottom: 10px;}

.proj .cont, .gal {display: flex; flex-wrap: wrap; justify-content: center; width: 100%;}
.proj .cont .blog  { max-width:380px; height:375px; margin:15px; overflow:hidden; position:relative; background: #fff;}
.proj .cont .blog .block { height: 100%; overflow: hidden;}
.proj .contentpaneopen div {
    width: 380px;
    height: 280px;
    margin-bottom: 20px;
    box-shadow: 0 0 30px 0 rgba(25,25,35,.5) inset;
    display: flex;
    align-items: center;
    font-size: 5rem;
    font-weight: bold;
    color: #89211b;
    justify-content: space-around;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
}
.proj .blog:hover .block .contentpaneopen div {
    background-size: 110%;
}
.proj .blog:not(:hover) .block, .gal a img:not(:hover) {
    filter: saturate(40%);
    -webkit-filter: saturate(40%);
}



.proj .cont .button { position:absolute; width:380px; height:350px; left:0; top:0;}
.proj .cont .blog:hover, .gal a:hover { transform: scale(1.06); -webkit-filter: drop-shadow(0px 0px 20px rgba(200,215,240,1)); filter: drop-shadow(0px 0px 20px rgba(200,215,240,1));}

.proj .contentpaneopen {max-width: 380px;
    height: 375px;
    text-align: center;
    background: #eaeaea; font-size: 1rem; text-decoration: underline;}

.proj .contentpagetitle { display: none;}



.gal a {max-width: 380px; margin: 15px; overflow: hidden; display: inline-block; border: 1px solid #eaeaea; }
.gal a img { width: 100%; }



.imglogos {display: flex; flex-wrap: wrap; justify-content: space-around;}
.imglogos img {/*border: 1px solid #eaeaea;*/ margin: 15px;}



.allnews .botton  { margin-top: -20px;}
.botton { margin-top:30px;}
.botton a, .allnews a { margin:0 auto; padding: 5px 40px; font-weight: 600; text-transform: none; background: rgba(225, 127, 0, 0.8); display:inline-block; color:rgba(255, 255, 255, 1); display: flex;
    align-items: center;
    width: max-content;}
.projects .botton a { background: rgba(255, 255, 255, 1); opacity: .9;}
.botton a:hover, .allnews a:hover { transform: scale(1.03); opacity: 1;}
.botton font {width: 45px;
    height: 46px;
    margin-right: 10px;
    display: flex;
    -webkit-mask: url(../images/more.svg) no-repeat 50% 50%;
    background: #fff;
    -webkit-mask-size: 30px;}


.usicons .icon a:hover {-webkit-filter: drop-shadow(0px 0px 20px rgba(200,215,240,1)); filter: drop-shadow(0px 0px 20px rgba(200,215,240,1));}
.usicons .icon:hover {    transform: scale(1.06); }



.contacts, .center { text-align:center; font-size: 18px; line-height:1.5; max-width: 1900px; margin-bottom: 0px;}
.contacts h2 { max-width: 1230px; margin: 50px auto 30px auto;}
.contacts strong a { color: #b0b0b0; font-size: 36px; position: relative; padding-left: 50px; font-weight:700;}
/*.contacts strong a:before, .tel strong a:before { content: ''; -webkit-mask: url(../images/icons/phone.svg) no-repeat 50% 50%; width: 50px; height: 41px; position: absolute; background: #b0b0b0; top: 0; left: 0; -webkit-mask-size: 65%;}*/
.map { margin:30px 0 0 0; border:1px solid #eaeaea; height:550px;}


.callback .rsformred { padding-bottom:50px;}
.callback .rsformred form, .callback .rsformdarkred form {display: flex; flex-wrap: wrap; justify-content: center; }
.callback input {font-family: 'Montserrat', sans-serif; font-size:18px; color:#b0b0b0; border:none;}
.formcheck { flex: 0 0 100%; text-align:center; padding-top:20px;}
.formname, .formtel, .formmail { padding:10px 20px; flex: 1 0 320px;}
.formend { padding:10px 0 10px 20px; width:200px;}
.callback .formname input, .callback .formtel input, .callback .formmail input { width:100%; padding:15px 15px 15px 55px;}
.callback .formname input:focus, .callback .formtel input:focus { }
.callback .formname input { background: url(../images/icons/name.svg) no-repeat 3% 50% #FFF; background-size: 11%; }
.callback .formtel input { background: url(../images/icons/phone-callback.svg) no-repeat 3% 50% #FFF; background-size: 11%; }
.callback .formmail input { background: url(../images/icons/mail.svg) no-repeat 3% 50% #FFF; background-size: 11%; }
.callback .formcheck input { padding:5px;}
.callback .formend input { padding:15px; width:100%; background:rgba(137, 33, 27, 1); color: #FFF; text-decoration: underline;}
.formError {display: block;}

.callback .formend input:hover {background: rgba(99, 40, 35, 1); transform: scale(1.03);} 
 
.foot .callbackbg { display:none;} 
.foot .cont {padding: 15px 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center;}
.foot h2 { width:auto; color:#FFF; margin:0; font-size: 2.1rem; padding-right:20px;}
.rsformdarkred { flex: 1 0 250px;}  

.foot a { color:#FFF;}
.foot .formcheck { flex: 0 0 220px; text-align:center; padding-top:14px; color:#fff;}
.foot .formname, .foot .formtel, .foot .formmail { padding:10px 20px; flex: 1 0 250px;}
.foot .formend { padding:10px 0 10px 20px; width:200px; order: 1;} 
.foot .formend input {background: rgba(99, 40, 35, 1); } 
.foot .formend input:hover { transform: scale(1.03);} 
 
.formend input, .formcheck input { cursor:pointer; } 
 
.footer .cont {display: flex; flex-wrap: wrap; justify-content: space-around; align-items: center; /*height:220px;*/ padding:30px 50px;}
.footer .cont div { /*height:150px;*/}
.footer .logoinfo { width:200px; height: 200px; background: url(../images/logo-gkpis.png) center left no-repeat /*, rgba(234, 234, 234, .6)*/; background-size: 170px; padding-left: 20px; background-blend-mode: color; -webkit-filter: grayscale(100%) drop-shadow(2px 2px 6px white); filter: grayscale(100%) drop-shadow(2px 2px 6px white);}
.footer .logoinfo strong { font-weight: 600; padding: 5px 0;}
.footer .socicons a {background-color: rgba(255, 255, 255, .2) !important; display: block; margin: 20px;}
.footer .socicons font { height:55px;}
.footer .socicons, .footer .massager {/*display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; padding:10px 0;*/}
.footer .socicons a:hover, .footer .massager a:hover {transform: scale(1.1); background-color: rgba(200, 215, 240, .3) !important;}

.footer a { /*color:#fff;*/}
.footer .menu { border-left:1px solid #919191; padding:20px 60px;}
.footer .menu ul { margin:0 15px; padding:0; border:none; max-width: 260px; display: inline-block;}
.footer .menu .uslugi { margin-left: 50px;}
.footer .menu li { list-style:none; padding: 4px 0;}
.footer .menu .uslugi li { padding: 7px 0;}
.footer .menu a { font-weight: 600; color: #2a547a;}
.footer .menu a:hover { color:#4b4b55;}

.footer .menu .menu .item3 {display: none;}

.nav {margin: 20px 0;}
.nav ul {margin: 0; padding: 0; text-align:center;}
.nav li {margin: 0 5px 10px 0; padding: 0; list-style: none; display: inline-block; *display:inline;}
.nav a {padding: 3px 12px; text-decoration: none; color: #999; line-height: 100%;}
.nav a:hover {color: #000;}
.nav .current a {background: #999; color: #fff; border-radius: 3px;}


/* модальное окно */


	/* Базовые стили слоя затемнения и модального окна  */
/*.overlay {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 10;
    display: none;

    background-color: rgba(0, 0, 0, 0.65);
    position: fixed; 
    cursor: default; 
}*/
/*  
.overlay:target {
    display: block;
}*/
/* стили модального окна */
.popup {
    top: -100%;
    right: 0;
    left: 50%;

    z-index: 20;
    margin: 0;
    width: 85%;
    width: 330px;
/* фиксированное позиционирование, окно стабильно при прокрутке */
    position: fixed;
    padding: 15px;
    background: rgba(137, 33, 27, 1);
/* скругление углов */
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    border-radius: 4px;

/* внешняя тень */
    -webkit-box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3);
    -moz-box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3);
    -ms-box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3);
    box-shadow: 0 15px 20px rgba(0,0,0,.22),0 19px 60px rgba(0,0,0,.3);
    -webkit-transform: translate(-50%, -500%);
    -ms-transform: translate(-50%, -500%);
    -o-transform: translate(-50%, -500%);
    transform: translate(-50%, -500%);
    -webkit-transition: -webkit-transform 0.6s ease-out;
    -moz-transition: -moz-transform 0.6s ease-out;
    -o-transition: -o-transform 0.6s ease-out;
    transition: transform 0.6s ease-out;
}
/* активируем модальный блок */
.overlay:target+.popup {
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    top: 20%;
}
/* формируем кнопку закрытия */
.popupclose {
    top: -15px;
    right: -15px;
    width: 40px;
    height: 40px;
    position: absolute;
    padding: 0;
    border-radius: 25px;
    background-color: #fff;
    text-align: center;
    text-decoration: none;
    transition: all ease .8s; font: 14px/18px 'Tahoma', Arial, sans-serif;
}
.popupclose:before {
    color:#89211b;
    content: "X"; font-size: 20px;
    font-weight: bold; top: 10px; left: 14px; position: absolute; 
}
.popupclose:hover {
    transform: rotate(360deg);   
}
/* изображения внутри окна */
.popup img {
    width: 100%;
    height: auto;
}
/* миниатюры слева/справа */
.pic-left, 
.pic-right {
    width: 25%;
    height: auto;
}
.pic-left {
    float: left;
    margin: 5px 15px 5px 0;
}
.pic-right {
    float: right;
    margin: 5px 0 5px 15px;
}
/* элементы м-медиа, фреймы */
.popup embed, 
.popup iframe {
    top: 0;
    right: 0;
    bottom: 0; 
    left: 0; 
    display:block;
    margin: auto;
    min-width: 320px;
    max-width: 600px;
    width: 100%;
}
.popup h2 { /* заголовок 2 */
    margin: 0;
    padding: 5px 0px 10px;
    line-height: 1.3;
}
/* параграфы */
.popup p {margin: 0; padding: 5px 0}
.popup .foot .formend {padding: 25px 0 10px 0px;}
.popup .foot .thanks {color: #fff; text-align: center; padding: 0px 25px 25px 25px; font-size: 18px; line-height: 1.5;}
.popup hr {border-bottom: 1px solid rgba(255, 255, 255, .2);}



/* модальное окно */



.aboutus ul li, .uslugi ul li { padding:0 0 15px 0; font-size: 1.2rem;}
.uslugi ol {list-style: disc; margin-inline-start: 2em; margin-top: -1.5em;;}

html, body { width:100%; height:100%; margin:0; padding:0; font-family: 'Montserrat', sans-serif; scroll-behavior: smooth; line-height:1.3;  color:#4b4b55;}
section {height: 100vh; min-height: 650px; overflow: hidden; border-top: 0; position:relative;  }
.clr { clear:both;}
a { transition: all .3s linear; }
hr { border: none; border-bottom:1px solid rgba(0, 0, 0, .1); width: 80%; margin: 3rem auto !important;}

.contentcontainer {font-size: 1rem;}


.loaderArea { background: url(../images/preload.jpg) rgba(75, 75, 85, 1); background-size: cover; background-repeat: no-repeat; background-position: center center; overflow: hidden; position: fixed; left: 0; top: 0; right:0;
bottom:0; z-index: 100000; display: flex; flex-direction: column; justify-content: center; text-align:center;}
.loaderArea img {width: 25%; max-width: 500px; min-width: 150px;}
.bubbles {margin-top: 50px; position: relative;}
.bubble {display: inline-block; padding: 0px 5px;}
.bubble:nth-of-type(1) .circle {animation-delay: 0.1s;}
.bubble:nth-of-type(2) .circle {animation-delay: 0.2s;}
.bubble:nth-of-type(3) .circle {animation-delay: 0.3s;}
.bubble:nth-of-type(4) .circle {animation-delay: 0.4s;}
.bubble:nth-of-type(5) .circle {animation-delay: 0.5s;}
.bubble:nth-of-type(6) .circle {animation-delay: 0.6s;}
.bubble:nth-of-type(7) .circle {animation-delay: 0.7s;}
.bubble:nth-of-type(8) .circle {animation-delay: 0.8s;}
.bubble:nth-of-type(9) .circle {animation-delay: 0.9s;}
.bubble:nth-of-type(10) .circle {animation-delay: 1s;}

.bubble .circle {width: 20px; height: 20px; border-radius: 50%; background: #FFF; opacity:0.7; animation: pulse 1.5s infinite; box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);}

@keyframes pulse {
  0% {transform: scale(1);}
  50% {transform: scale(0.2); opacity: 0.75;  }
  100% {transform: scale(1);}
}



h1 { color:#2a547a; font-size:2rem; font-weight:700; margin:70px 0 30px 0; text-align:center;}
h2 { color:#2a547a; font-size:2rem; font-weight:700; margin:70px 0 30px 0; text-align:center; width:100%;}
h3, .createdatenews { color:rgba(75, 75, 85, 1); font-size:1.2rem; font-weight:600; margin:50px 0 20px 0; text-align: left; width: 100%; border-bottom: 1px solid #eaeaea; padding-bottom: 20px;}
h4 { color:rgba(75, 75, 85, 1); font-size:2rem; font-weight:100; margin:50px 0 30px 0; text-align:center; width: 100%;}

a  { color:#4b4b55; }
h5 {margin:50px 0 10px 0; text-align:center; width: 100%; font-size: 1.5rem;}

/*h1:after, h3:after { content: ''; margin: 5px 50%; display: block; width: 40%; height: 6px; background: rgba(200, 215, 240, 1);}
h2:after, h4:after { content: ''; margin: 5px 10%; display: block; width: 40%; height: 6px; background: rgba(200, 215, 240, 1);}*/


#top-menu li.active a:after, #top-menu li.active a:before { opacity:1;transform: scale(1.2); }


.fil0, .fil1 { fill:#FFF !important; }

/*.cd-main-nav a:hover { color:#8cd2fa;}
.cd-main-nav li ul a:hover { color:#000;}*/

.section1 {box-sizing: border-box; width:100%; height:100vh; background:#CCC; margin:0; padding:0; }
	
	
.logogal, .tur, .phone, .proc {-webkit-filter: drop-shadow(0px 0px 30px rgba(15,30,60,0.9)); filter: drop-shadow(0px 0px 30px rgba(15,30,60,0.9)); text-shadow:#000 0 0 15px; min-height:31px; position:absolute; bottom: 70px; display:block; transition: all 1s linear; opacity:0.9; color:#FFF; z-index:10; padding:0 0 0 45px;}
.logogal {background:url(../images/logo-atlantis.svg) bottom left no-repeat; background-size: 100%; left:5%; transition: transform 0.3s linear; width:15rem; height:8rem; bottom:60px; }	
.phone {/*background:url(../images/phone.png) 0% 80% no-repeat;*/ right:5%; top:15px; filter: none; text-shadow:none; }
.phone a { padding:0; border:none;}
.phone span { font-size:1.8rem; display:block; line-height:1;  }	
.phone span font { color:#8cd2fa; position:absolute; text-align:right; width:135px; left:-105px;}	
.tur {background:url(../images/tur.svg) 15% no-repeat #FFF; background-size: 35px; right:5%; /*padding:10px 30px 10px 65px; border-radius: 100px;*/ padding: 1rem 3rem 1rem 5rem; font-size:16px; color:#000; text-shadow:none; opacity:0.7; transition: all 0.3s linear; }	
.tur:hover {transform: scale(1.1); opacity:0.9; }	
.proc { left: calc(50% - 100px); bottom:40px; width:200px; padding:0; text-align:center; z-index:100; }
.proc div {transition: transform 0.2s linear;}
.proc div:hover{transform: scale(1.1);}
.proc span { height:45px; width:28px; background: url(../images/arrow.png) 50% 75% no-repeat #fff; border-radius:15px; display:inline-block; margin-bottom:10px; }
.proc a { color:#FFF; text-decoration-style: dashed;}

	
.gal1 .one { background-image:url(../images/pic-0.jpg);}	
.gal1 .two { background-image:url(../images/pic-1.jpg);}
.gal1 .three { background-image:url(../images/pic-2.jpg);}
.gal1 .four { background-image:url(../images/pic-3.jpg);}
.gal1 .five { background-image:url(../images/pic-4.jpg);}
.gal1 .six { background-image:url(../images/pic-5.jpg);}
/*.gal1 .seven { background-image:url(../images/pic-6.jpg);}*/

.pic { width:100%; height:100vh; background-size: cover; background-repeat: no-repeat; background-position: center center; box-shadow: inset 0 -600px 900px -500px rgba(0, 0, 0, .9);}


.gal1 .text, .opis { -webkit-filter: drop-shadow(0px 0px 80px rgba(15,30,60,0.9)); filter: drop-shadow(0px 0px 80px rgba(15,30,60,0.9)); text-shadow: 0 0 80px rgba(15,30,60,0.9); min-height:31px; position:absolute; right:15%; top: 20%; display:block; transition: all 1s linear; opacity:0.9; color:#FFF; z-index:10;  font-size:3rem; width:370px; text-align:right; }
.gal1 .text span, .opis span { font-size:1.4rem; display:block; }
.gal1 .text span:before, .opis span:before {content: ''; margin:5% 0; display: block; width: 140%; height: 2px; background: linear-gradient(to right, rgba(0, 120, 190, 0), rgba(0, 120, 190, 0.8)); z-index:1000; margin: 10% -20%; }
.gal1 .four .text {  top:20% ;}
.gal1 .three .text { -webkit-filter: drop-shadow(0px 0px 80px rgba(15,30,60,0.9)); filter: drop-shadow(0px 0px 80px rgba(15,30,60,0.9)); text-shadow: 0 0 80px rgba(15,30,60,0.9); left:15%; top: 15%; text-align:left; top:20%;}
.three .text span:before { background: linear-gradient(to left, rgba(0, 120, 190, 0), rgba(0, 120, 190, 0.8));  }



.gal1 .text p { margin:0; padding:0; -webkit-filter: drop-shadow(2px 2px 1px rgba(15,30,60,0.5)); filter: drop-shadow(2px 2px 1px rgba(15,30,60,0.5)); text-shadow: 0 0 40px rgba(255,255,255,1); }






@keyframes krug {
0%{
     transform: scale(1);
}
15%{
    transform: scale(1);
}
19%{
    transform: scale(1.1);
}
23%{
    transform: scale(1);
}
27%{
    transform: scale(1.1);
}
31%{
    transform: scale(1);
}	
55%{
    transform:rotate(360deg)
}
65%{
    transform:rotate(0deg)
}
100%{
    transform: scale(1);
}}
