html {min-height: 100%;}

body {background:#FFFFFF; font-family: "Open Sans", Verdana, Arial, sans-serif; font-size:1rem; line-height: 1.5; min-height: 100%; width: 100%; color:#333; font-weight: 400; z-index:1; position: relative}

body:before {content: ""; display: block; position: fixed; top: 0; left:0; color:#FFF; background: #333; z-index: 1000; }

h1, h2, h3, h4, h5, h6 {font-family: "Montserrat", "Open Sans", "Verdana", sans-serif; font-weight: 400; line-height: 1.2em;}

::selection {color:#000; background: #FBBA05; }

a {text-decoration: none; color:#333; transition: all .2s ease;  border-bottom:solid .07em #FBBA05;}
a:hover {border-color: transparent; text-decoration: none;}

.wait_pos {transition: all 0s;}

/*PRELOADER*/
#preloader.preloader {position: fixed; top: 0; left:0; bottom:0; right:0; width: 100%; height: 100%; background: #FFF; z-index: 100000;}
#preloader.preloader .wrapper {position: absolute; display: block; opacity: 1; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%);  z-index: 10; text-align: center;}
#preloader.preloader .load_icon {display: block; width: 12em; height: 12em; margin: 0 auto 6em; transition: opacity .2s ease;}
#preloader.preloader .load_icon:before, #preloader.preloader .load_icon:after  {content: ""; position: absolute; display: block; top: 0; left: 0; bottom:0; right:0; background: center center no-repeat; background-size: 12em;}
#preloader.preloader .load_icon:before {background-image: url("../img/logo/logo_circle.svg"); animation: preloader_logo_circle 2s infinite ease}
#preloader.preloader .load_icon:after {background-image: url("../img/logo/logo_letter.svg"); animation: preloader_logo_circle_center 2s infinite ease}
#preloader.preloader strong {text-transform: uppercase; letter-spacing: 0.2em; font-size: 1.5em; line-height: 2em; color:#777; font-weight: 600; display: block; text-align:center;}

@keyframes preloader_logo_circle_center {
    from {transform: scale(1); opacity: 1;}
    30% {transform: scale(1.05); opacity: 0.8;}
    40% {transform: scale(1.1); opacity: 0.6;}
    to {transform: scale(1); opacity: 1;}
}

@keyframes preloader_logo_circle {
    from {transform: rotate(0deg)}
    to {transform: rotate(360deg)}
}

/*CTA*/
.cta {display: inline-block; position: relative; padding: 1.5em 2.5em; color: #FFF; border: none; border-radius: .3em; box-shadow: 0 .5em 1.5em 0 rgba(0,0,0,.2); cursor: pointer; z-index:1; outline:none;}
.cta em {font-style: normal;}
.cta:before,.cta:after {content: ""; position: absolute; display: inline-block; top:0; bottom:0; border-radius: .3em; z-index: -1;}
.cta:before {left: 0; right:100%; transition: all .4s ease 0s;}
.cta:after {left: 0; right:0;  transition: all .4s ease 0s;}

.cta:hover {}
.cta:hover:before {right:0;}
.cta:hover:after {left: 100%;}

.cta span {float:left; font: 800 .9em/2em Montserrat, sans-serif; text-transform: uppercase; letter-spacing: 0.25em;}
.cta i.arrow {font-size: 1.8em; line-height: 1em; float:right; margin-left: 3em; position: relative}
.cta i.arrow:after {content: ""; position: absolute; left: -2em; right:.5em; top: 50%; height: .07em; margin-top: -.03em; background: #FFF; }

.cta.yellow {color:#000;}
.cta.yellow:before {background-image: linear-gradient(90deg, #3A539E, #488FCC);;}
.cta.yellow:after {background-image: linear-gradient(90deg,#FBBA05, #FFE124);}
.cta.yellow  i.arrow:after {background: #000; transition: all .2s;}
.cta.yellow:hover  i.arrow:after {background: #FFF;}
.cta.yellow:hover {color:#FFF;}

.cta.red {color:#FFF;}
.cta.red:before {background-image: linear-gradient(90deg,#FBBA05, #FFE124);}
.cta.red:after {background-image: linear-gradient(90deg, #E51858, #EB598F);}
.cta.red i.arrow:after {background: #FFF; transition: all .2s;}
.cta.red:hover  i.arrow:after {background: #000;}
.cta.red:hover {color:#000;}

.cta.blue {color:#FFF;}
.cta.blue:before {background-image: linear-gradient(90deg, #E51858, #EB598F);}
.cta.blue:after {background-image: linear-gradient(90deg, #3A539E, #488FCC); }
.cta.blue  i.arrow:after {background: #FFF; transition: all .2s;}
.cta.blue:hover  i.arrow:after {background: #FFF;}
.cta.blue:hover {color:#FFF;}

.cta.green {color:#FFF;}
.cta.green:before {background-image: linear-gradient(90deg, #3A539E, #488FCC);}
.cta.green:after {background-image: linear-gradient(90deg,#30933C, #C1BC19); }
.cta.green  i.arrow:after {background: #FFF; transition: all .2s;}
.cta.green:hover  i.arrow:after {background: #FFF;}
.cta.green:hover {color:#FFF;}


.cta.transparent {border:solid .15em #FBBA05; border-radius: .2em; background: none; color:#000;}
.cta.transparent:before {background-image: linear-gradient(90deg,#30933C, #C1BC19);}
.cta.transparent:after {background-image: none; }
.cta.transparent  i.arrow:after {background: #FBBA05; transition: all .2s;}
.cta.transparent:hover  i.arrow:after {background: #000;}
.cta.transparent:hover {color:#FFF;}

.cta.transparent.white {border-color: #FFF; color: #FFF;}
.cta.transparent.white i.arrow:after {background: #FFF;}

/*PADDING*/
.padding {padding-left: 4em; padding-right:4em;}

/*BG LOGO*/
.bg_logo {position: relative}
.bg_logo:before {position: absolute; content: ""; display: block; top: 0; bottom: 0; left: 0; right: 0; background: url("../img/logo/bg.svg") center center no-repeat; background-size: cover; opacity: .15; z-index: -1;}

/*HEADER*/
.header_holder {height: 7em;}
header.header {border-bottom:solid .1em #F6F6F6; position: fixed; top:0; left:0; right:0; height: 7em; overflow: hidden; background: #FFF; z-index: 900;     box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.05); transition: all .2s ease;}
header.header .header_wrapper {padding-top: 1em; padding-bottom: 1em;}
header.header a.logo {display: block; border:none; line-height: 1em; margin: .8em 0 .8em -.2em; padding: .2em;  z-index: 101; position: relative; overflow: hidden;}
header.header a.logo:after {content: ""; display: block; clear: both}

header.header a.logo span {position: relative; z-index:1; display: inline-block; float:left; width: 3.4em; height: 3.4em; margin: -.2em 0 -.2em -.2em; background: #FFF; border-radius: 50%; transition: background-color .5s ease 0s;}
header.header a.logo span:before, header.header a.logo span:after  {content: ""; position: absolute; display: block; top: 0; left: 0; bottom:0; right:0; background: center center no-repeat; background-size: 3em; border-radius:50%; z-index: 1; opacity: 1; transform: scale(1); transition: transform .2s ease .3s;}
header.header a.logo span:before {background-image: url("../img/logo/logo_circle.svg"); animation: header_logo_circle 2s infinite ease;}
header.header a.logo span:after {background-image: url("../img/logo/logo_letter.svg");}

header.header.wait_pos a.logo span {background-color: transparent;}

header.header a.logo strong {display: inline-block; float:left; font-family: Montserrat, "Open Sans", Verdana, sans-serif; font-size: 1.25em; line-height: 2.4em; font-weight: 800; margin-left: .5em; text-transform: uppercase; letter-spacing: .15em; position: relative; opacity: 1; left: 0;  transition: opacity .5s ease .5s, left .5s ease .5s; z-index:2;}

header.header.fixed {background: #FFF !important;;}

@keyframes header_logo_circle {
    from {transform: rotate(0deg)}
    to {transform: rotate(360deg)}
}


header.header nav {margin: 1.5em 0;}

header.header nav .menu_icon {display: none; float:right; position: relative; margin:0; height: 2em; width: 2em; border:none; z-index: 101; transition: all .2s;}
header.header nav .menu_icon i, header.header nav .menu_icon:before, header.header nav .menu_icon:after {content: ""; display: block; position: absolute; height: 4px; background: #000;  left:0; right:0; transition: bacground 0s, top .2s, transform .2s ease .2s;}
header.header nav .menu_icon i {top: 50%; transform: translateY(-50%); left:.5em;}
header.header nav .menu_icon:before {top: .3em;}
header.header nav .menu_icon:after {bottom: .3em;}

header.header nav .menu_icon.close i {background: none;}
header.header nav .menu_icon.close:before, header.header nav .menu_icon.close:after {top: 50%;}
header.header nav .menu_icon.close:before {transform: rotate(45deg);}
header.header nav .menu_icon.close:after {transform: rotate(-45deg);}

header.header nav ul.main_menu {margin: 0; padding:0; list-style-type: none; display: flex; justify-content: space-between; font: 500 1em/2em Montserrat, sans-serif; letter-spacing: 0.09em; transition: transform .5s, opacity .2s;}
header.header nav ul.main_menu li {display: inline-block;}
header.header nav ul.main_menu li a {border:none; display: block; position: relative; z-index: 1;}
header.header nav ul.main_menu li a:before {content:""; display: block; position: absolute; left: 0; right: 0; bottom:-1em; height: .2em; background:#FFE124; opacity: 0; transition: all .2s;}
header.header nav ul.main_menu li a:hover:before, header.header nav ul.main_menu li.active a:before { bottom:-.2em; opacity: 1;}

header.header .contacts {margin: 0; padding: 0; list-style-type: none; font-size: 1em; line-height: 1em; text-align: right}
header.header .contacts li {display: inline-block; margin-left: 2em;}
header.header .contacts li.phone {font-weight: 700; padding: 2em 0;}
header.header .contacts li a.cta {padding: 1em 1em;}
header.header .contacts li a.cta:hover {}

/*CONTENT*/
main.main .main_title_wrapper {padding-top: 6em; padding-bottom: 6em; background-image: linear-gradient(90deg,#3A539E, #488FCC); color:#FFF; position: relative; z-index:1; overflow: hidden;}
main.main .main_title_wrapper:before {position: absolute; content: ""; display: block; top: 0; bottom: 0; left: 0; right: 0; background: url("../img/logo/bg.svg") center center no-repeat; background-size: cover; opacity: .1; z-index: -1;}

main.main h1.main_title {font-size: 4em; line-height: 1.2em; margin: 0; text-shadow:  0 .1em .3em rgba(0,0,0,.3)}

main.main .content {padding-top: 4em; padding-bottom: 4em;}
main.main .content h2 {font: 300 2.6em/1.2em Montserrat, sans-serif; margin: 1.5em 0 .75em;}

/*FOOTER*/
/*--CTA*/
footer .cta_block {background: #333 url('../img/contact1.jpg') center center no-repeat; background-size: cover; color:#FFF; overflow: hidden; opacity: 1; transition: opacity .2s ease;}
footer .cta_block.wait_pos {opacity: 0;}
footer .cta_block .wrapper {padding-top: 8em; padding-bottom: 6em; background: rgba(0,0,15, 0.75); opacity: 1; transition: opacity .3s ease .4s;}
footer .cta_block.wait_pos .wrapper {opacity: 0;}
footer .cta_block .title {font: 300 3.6em/1.2em Montserrat, sans-serif; letter-spacing: 0.025em; margin-bottom: 1em; position: relative; top: 0; opacity: 1; transition: top .2s ease .5s, opacity .2s ease .5s;}
footer .cta_block.wait_pos .title {top: -10em; opacity: 0;}
footer .cta_block .input_row {position: relative; margin: 3em 0; top: 0; opacity: 1; transition: top .2s ease .6s, opacity .2s ease .6s; }
footer .cta_block.wait_pos .input_row {top: 20em; opacity: 0;}
footer .cta_block .input_row input, footer .cta_block .input_row textarea {width: 100%; font-size: 1em; line-height: 1.5em; padding: 1em 0; border:none; border-bottom: solid .1em rgba(255,255,255,.9); background: none; color:#FFF; transition: all .2s;}
footer .cta_block .input_row .cta {}
footer .cta_block .input_row input:focus, footer .cta_block .input_row textarea:focus, footer .cta_block .input_row {outline: none; border-color:#FFF; }
footer .cta_block .input_row label.label {position: absolute; font-size: 1em; line-height: 1.5em; padding: 1em 0; display: block; top: 0; left:0; font-weight: 300; color: #FFF; transition: all .1s; cursor: text;}
footer .cta_block .input_row input[type=checkbox] {display: none;}
footer .cta_block .input_row input[type=checkbox] + label {padding-left: 3em; position: relative; color:#CCC; font-size: .9em;}
footer .cta_block .input_row input[type=checkbox] + label a {color:#FFF; border-color:#FBBA05;}
footer .cta_block .input_row input[type=checkbox] + label:before {content: ""; display: block; position: absolute; top: 0; left: 0; height: 1.4em; width: 1.4em; border:solid .15em #FFF;}
footer .cta_block .input_row input[type=checkbox] + label:after {content:"\f00c"; position: absolute; left: 0; top:0; font-family: 'icomoon' !important; font-size: 1.8em; line-height: 1em; color:#FBBA05; opacity: 0; transition: all .2s;}
footer .cta_block .input_row input[type=checkbox]:checked + label:after {opacity: 1;}

footer .cta_block form {position: relative; z-index:1;}

footer .cta_block form .load_icon {position: absolute; display: none; opacity: 0; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); width: 12em; height: 12em; z-index: 10; transition: opacity .2s ease;}
footer .cta_block form .load_icon:before, footer .cta_block form .load_icon:after  {content: ""; position: absolute; display: block; top: 0; left: 0; bottom:0; right:0; background: center center no-repeat; background-size: 12em;}
footer .cta_block form .load_icon:before {background-image: url("../img/logo/logo_circle.svg"); animation: logo_circle 2s infinite ease}
footer .cta_block form .load_icon:after {background-image: url("../img/logo/logo_letter.svg");}

footer .cta_block form .ok_txt {display: none; opacity: 0; transition: all .2s; color:#FFF; font-size: 2.2em; position: absolute; top: 1em; left: 0; right: 4em; bottom: 4em; z-index: 10;}

footer .cta_block form:before {content: ""; display: none; position: absolute; top: -4em; bottom:-4em; left: -4em; right:-4em; filter: blur(4em); z-index: 5; opacity: 0; transition: all .2s;  background: rgba(0,0,15,.75);}

footer .cta_block form.load:before {opacity: 1; display: block;}
footer .cta_block form.ok:before {opacity: 1; display: block;}
footer .cta_block form.error:before {opacity: 1; display: block; background: rgba(0,0,15,.75);}

footer .cta_block form.load .load_icon {opacity: 1; display: block;}
footer .cta_block form.ok .ok_txt {display: block; opacity: 1;}

@keyframes logo_circle {
    from {transform: rotate(0deg)}
    to {transform: rotate(360deg)}
}

/*--FOOTER*/
footer .footer {padding-top: 8em; padding-bottom: 8em; background: #00000f; color:#9c9c9c; position: relative; z-index:1}
footer .footer:before {position: absolute; content: ""; display: block; top: 0; bottom: 0; left: 0; right: 0; background: url("../img/logo/bg.svg") center center no-repeat; background-size: cover; opacity: .15; z-index: -1;}
footer .footer .container-fluid {}

footer .footer .slogan {font: 300 2em/1.4em Montserrat, sans-serif; color:#CCCCCC; margin: -.3em 0 1.2em;}
footer .footer .caption {width: 90%;}

footer .footer ul.menu {margin: 0; padding:0; list-style-type: none; font-size: .8em; line-height: 1.5em;}
footer .footer ul.menu li {margin: 0 0 1.5em 0;}
footer .footer ul.menu li a {color: #BBB; border-bottom:solid .1em transparent; display: inline-block; line-height: 1.5em;}
footer .footer ul.menu li a:hover {color:#FFF;}

footer .contacts {text-align: right}
footer .contacts a.phone {display: block; border:none; color:#EEE; font-size: 1.4em; line-height: 1.2em; margin-bottom: .5em}
footer .contacts .cta {margin-top: 2em; font-size: 0.7em; padding:1.5em 2em; color:#FBBA05;}

    /*--COPYRIGHT*/
footer .copyright { padding-top: 1em; padding-bottom:1em; background: #00000f}
footer .copyright .container-fluid {font-size: .8em; line-height: 1em;}

footer .copyright .copy {line-height: 1em; color:#999;}

footer .copyright ul.menu {margin: 0; padding:0; list-style-type: none; font-size: 1em; line-height: 1em;}
footer .copyright ul.menu li {display: inline-block; margin-right: 2em;}
footer .copyright ul.menu li a {color: #999; border-bottom:solid .1em transparent; }
footer .copyright ul.menu li a:hover {color:#FFF;}

footer .copyright a.primosoft {display: block; text-align: right; border:none;}
footer .copyright a.primosoft:after {display: block; content: ""; clear: both;}
footer .copyright a.primosoft img {height: 1.6em; display: inline-block; float:right;}
footer .copyright a.primosoft span {display: inline-block; float:right; line-height: 1.6em; color:#AAA; margin-left: .7em;}
footer .copyright a.primosoft span strong {transition: all .2s;}
footer .copyright a.primosoft:hover span strong {color:#FFF;}

/*LABEL OVER*/
.label_form label.label.active {top: -2em !important;}
.label_form label.label.freez {}



/*MODAL*/
.modal {display: none; width: 42em; padding:0;}

.totop {position: fixed; bottom: .5em; right: .5em; border:none; width: 3em; height: 3em; background: #000; border-radius: 50%; z-index: 1000; opacity: 0; display: none;}
.totop.active {opacity: .8; display: block}
.totop i {transform: rotate(-90deg); font-size: 1.5em; line-height: .5em;  display: block;   color:#FFF; transition: all .2s;}
.totop:hover {background:#FBBA05; opacity: 1;}
.totop:hover i { color:#000;}

/**/
.feddback_modal {display: none;}
.feddback_modal {width: 50em; padding: 4em;}
.feddback_modal .title {font: 300 2em/1.2em Montserrat, sans-serif; letter-spacing: 0.025em; margin-bottom: 1em; position: relative; top: 0; opacity: 1; transition: top .2s ease .5s, opacity .2s ease .5s;}

.feddback_modal .input_row {width: 100%; margin: 1em 0;}
.feddback_modal .input_row input, .feddback_modal .input_row textarea {width: 100%; line-height: 1em; padding: .75em 1em; border:solid 2px #777; border-radius: .4em;}
.feddback_modal .input_row textarea {min-height: 8em}
.feddback_modal .input_row input:focus, .feddback_modal .input_row textarea:focus {outline: none;}

.feddback_modal .input_row input[type=checkbox] {display: none;}
.feddback_modal .input_row input[type=checkbox] + label {padding-left: 3em; position: relative; color:#999; font-size: .9em;}
.feddback_modal .input_row input[type=checkbox] + label a {color:#999; border-color:#FBBA05;}
.feddback_modal .input_row input[type=checkbox] + label:before {content: ""; display: block; position: absolute; top: 0; left: 0; height: 1.4em; width: 1.4em; border:solid .15em #999;}
.feddback_modal .input_row input[type=checkbox] + label:after {content:"\f00c"; position: absolute; left: 0; top:0; font-family: 'icomoon' !important; font-size: 1.8em; line-height: 1em; color:#FBBA05; opacity: 0; transition: all .2s;}
.feddback_modal .input_row input[type=checkbox]:checked + label:after {opacity: 1;}


.grecaptcha-badge {display: none !important;}

.overlayz {
    position: fixed;
    z-index: 99999;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,0.6);
    display: none;
}
.overlayz.active {
    display: block;
}
.overlayz .flex-popap {
    height: 110%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.overlayz .flex-popap .popap {
    position: fixed;
    background-color: #fff;
    padding: 35px 25px;
    margin: 0 10px;
    max-width: 1000px;
    max-height: 750px;
    overflow: auto;
    border: solid 4px #fdbd01;
}
.popap span {
    position: absolute;
    top: 10px;
    right: 25px;
    font-size: 18px;
    font-weight: 600;
    cursor: pointer;
}