a:link {color: #484848;} 
a:visited {color: #484848;}
a:hover {color: #484848;}
a:active {color: #484848;}

html * {max-height:1000000px;}

::-webkit-input-placeholder {color:#5b5b5b;}
::-moz-placeholder          {color:#5b5b5b;}/* Firefox 19+ */
:-moz-placeholder           {color:#5b5b5b;}/* Firefox 18- */
:-ms-input-placeholder      {color:#5b5b5b;}

html {height: 100%; max-height: 100000000px !important;}
body {
        font-family: 'Jost', sans-serif;
        font-size: 18px;
        font-weight: 300;
        color: #484848;
        margin: 0px;
        padding: 0px;
        color: #151515;
        height: 100%;
        line-height: 25px;
        background: url('/img/logo_bg.png') center 100px no-repeat, url('/img/logo_bg.png') center 1700px no-repeat;
}
textarea, input, button {
        font-family: 'Jost', sans-serif;
        font-size: 16px;
}
textarea, input[type=text], input[type=password], input[type=number]  {
        padding: 0px 8px;
        border: 1px solid #0e5694 ;
        box-sizing: border-box; 
}
input[type=text], input[type=password], input[type=number]  {
        line-height: 34px;
        height: 34px;
}
textarea {padding: 8px;}
select {
        border: 0px;
        padding: 0px 8px;
        margin: 0px;
        height: 34px;
        line-height: 34px;
        width: 250px;
}
.select  {
        width: 216px;
        height: 29px;
        overflow: hidden;
        display:  inline-block;
        vertical-align: bottom;       
}
button, .likebtn {
        display: inline-block;
        line-height: 60px;
        height: 60px;
        padding: 0px 20px;
        cursor: pointer;
        text-decoration: none !important;
        border: 0px !important;
        border-radius: 10px;
        box-sizing: border-box;
        background: #ADACD1;
        color: #253259 !important;
        font-weight: 500;
        vertical-align: middle;
        text-align: center;
}
button img, .likebtn img {vertical-align: middle; margin-bottom: 3px;}
.clear {
        clear: both;
}

h1, .h1 {
        font-family: 'Jost', sans-serif;
        font-size: 26px;
        padding-top: 0px;
        margin-bottom: 15px;
        color:  #484848;
        line-height: 105%;
        font-weight: 300;
}
h2, .h2 {
        font-family: 'Jost', sans-serif;
        font-size: 37px;
        padding: 0px;
        margin: 15px 0px;
        font-weight: 400;
        color: #253259;
        text-align: center;
        line-height: 40px;
}
h3, .h3 {
        font-family: 'Jost', sans-serif;
        font-size: 29px;
        line-height: 31px;
        padding-top: 0px;
        margin-top: 0px;
        margin-bottom: 30px;
        font-weight: 500;
        color:  #253259;
}
h4 {
        font-family: 'Jost', sans-serif;
        font-size: 18px;
        padding-top: 0px;
        margin-top: 25px;
        font-weight: bold;
        color:  #000;
}
p {
        text-align: left;
        margin: 10px 0px;
        line-height: 30px;
        padding: 0px;
}



/* MessageBox */
.messageBox {
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        
        background: #0e5694; /* old browsers */
        
        opacity: 0.9;
        
        position: fixed;
        right: 10px;
        top: 10px;
        
        border: 1px solid #0e5694;
        width: 280px;
        padding: 15px;
        
        text-align: center;
        
        font-family: 'ubunturegular';
        color: white;
        z-index: 1001;
        
        box-shadow: 0px 0px 8px #ffffff,  0px 0px 8px #ffffff,  0px 0px 8px #ffffff;
}
.mb_error {
        background: #e11111 !important;
}
.mb_success {
        color: green;
}
.mb_notice {
        color: #DD5502;
}
.mb_normal {
        color: white;
}
/* MessageBox */



@keyframes jump{0%{transform:translate(0%,-20%)}50%{transform:translate(0%,-50%)}to{transform:translate(0%,-20%)}}


.main {max-width: 1400px; margin: 0px auto;}
.main2 {max-width: 1000px; margin: 0px auto;}



nav {display: block; line-height: 105%; font-size: 18px; min-height: 19px;}
nav ul {margin: 50px 0px 0px 0px; display: flex; list-style: none; padding: 0px; justify-content: space-between;}
nav ul li {display: flex; flex-grow: 1;}
nav ul li:first-child {padding-left: 15px;}
nav ul li a {text-decoration: underline !important;}
nav ul li.language {flex-grow: 10; justify-content: flex-end; padding-right: 15px;}
nav ul li.language a {text-decoration: none;}

.line, .menu_close {display: none;}

#logo {display: flex; flex-direction: column; flex-wrap: wrap; align-content: center; height: 100%; _height: 100vh; justify-content: space-around; text-align: center;}
#logo .logo {display: inline-block;}
#logo .scroll {display: flex; justify-content: center; }
#logo .scroll img {animation: jump 1.2s infinite; cursor: pointer; }

#services {margin-top: -5px; margin-bottom: 100px;}
.services {max-width: 1100px; margin: 0px auto; display: flex; justify-content: space-between; align-content: center; flex-direction: row; flex-wrap: wrap; align-items: flex-start;}
.services .elem {text-align: center; width: 300px; height: auto; margin: 30px 0px; line-height: 31px;}
.services .elem img {display: inline-block; margin-bottom: 32px;}
.services .break {display: none; flex-basis: 100%;}

.left {text-align: left;}
.right {text-align: right;}

#about {_padding-top: 20px;}
.about {display: flex; align-items: center; margin-top: 100px; }
.about.reverse {flex-direction: row-reverse}
.about_text {width: 50%; color: #000; line-height: 31px;}
.about_text.full_width {width: 100%; text-align: center; margin-top: 60px;}
.about_text.text_left {text-align: left; padding-right: 25px; box-sizing: border-box;}
.about_text.text_right {text-align: right; padding-left: 25px; box-sizing: border-box;}
.about_img {width: 50%;}
.about_img img {border-radius: 10px; width: 95%;}

#contacts {line-height: 31px; margin-top: 80px; text-align: center;}
#contacts h2 {margin-bottom: 40px;}
#contacts .likebtn {width: 256px; float: right; margin-top: -30px;}


footer {height: auto; margin-top: 70px; padding: 60px 0px; background: #253259 url('/img/logo_bg.png') center center no-repeat; color: rgba(255, 255, 255, 0.67);}
footer h3 {text-align: center; font-size: 24px; line-height: 125%;  color: rgba(255, 255, 255, 0.67); letter-spacing: 0.125em;}
footer h3 span {display: block; font-size: 48px; line-height: 105%; font-weight: 500;}
footer p {font-size: 14px; text-align: center; margin-top: 30px;}


#bg {
    position: absolute;
    left: 0px;
    top: 0px;
    background: #000000;
    width: 100%; 
    height: 100%; 
    position: fixed; 
    z-index: 100;
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
    -moz-opacity: 0.5;
    -khtml-opacity: 0.5;
    opacity: 0.5; 
    display: none;
}


.toTop {display: block; position: fixed; right: 25px; bottom: 25px; width: 70px; box-sizing: border-box; border: 1px solid #FFF !important; height: 70px; border-radius: 50%; background: #253259; text-align: center; line-height: 64px; z-index: 100000; text-decoration: none !important;
  -moz-transform: translateY(180px) !important;
  -ms-transform: translateY(180px) !important;
  -o-transform: translateY(180px) !important;
  -webkit-transform: translateY(180px) !important;
  transform: translateY(180px) !important;
  -moz-transition: 0.3s ease;
  -o-transition: 0.3s ease;
  -webkit-transition: 0.3s ease;
  transition: 0.3s ease;  
}
.toTop.active {transform: translateY(0) !important;}
.toTop img{vertical-align: middle;}


@media (max-width: 480px) { 
    body {background: url('/img/logo_bg.png') center 28px/247% no-repeat, url('/img/logo_bg.png') center 1700px/247% no-repeat;}

    .line {display: block; width: 30%; margin: 0px auto; background: #000; height: 1px;}

    .menu_icon {
        z-index: 5;
        display: flex;
        flex-direction: column;
        position: absolute;
        top: 30px;
        left: 30px;
        width: 22px;
        height: 18px;
        cursor: pointer;
        margin-right: 0px;
        z-index: 10;
    }    
    .menu_icon.hide {display: none;}

    .menu_icon span, .menu_icon::before, .menu_icon::after {
        content: "";
        left: 0;
        position: absolute;
        width: 100%;
        height: 1px;
        transition: all 0.3s ease 0s;
        background-color: #000;
    }

    .menu_icon span {
        top: 50%;
    }

    .menu_icon::before {
            top: 0;
    }

    .menu_icon::after {
            bottom: 0;
    } 

    nav {padding: 30px;}
    nav ul {margin: 0px;}
    nav ul .line {display: none;}

    nav ul li:first-child {padding-left: 0px;}
    nav ul li.nav {display: none;}   
    nav ul li.language {padding-right: 0px;}

    nav ul.mobile_show {background: #FFF; flex-direction: column; position: absolute; left: 0px; top: 0px; width: 100%; height: auto; padding: 30px; box-sizing: border-box; z-index: 101;}
    nav ul.mobile_show li.nav {display: block;}
    nav ul.mobile_show li.language {display: none;}
    nav ul.mobile_show li a {text-decoration: none !important; line-height: 62px; font-size: 23px; font-weight: 500;}
    nav ul.mobile_show .menu_close {display: block; position: absolute; right: 32px; top: 32px;}
    nav ul.mobile_show .line {margin: initial; display: block;}

    #logo {height: 100%; _height: 100vh}
    #logo img {max-width: 80%;}
    #logo h1 {font-size: 26px; width: 90%; line-height: 30.0px;}

    #about .line {margin: 50px auto;}
    .about_text {width: 100%;}
    .about_img {width: 100%;}
    .about_text.text_left {text-align: center; padding-right: 0px; box-sizing: border-box;}
    .about_text.text_right {text-align: center; padding-left: 0px; box-sizing: border-box;}
    .about_img img {width: 100%; margin-bottom: 60px;}
    .about {padding: 0px 20px; margin-top: 20px;}

    .about_wrapper .slick-dots {top: 240px; bottom: initial;}


    #contacts {text-align: center; width: 90%;}
    #contacts h2 {margin-bottom: 40px;}
    #contacts .likebtn {float: initial; display: block; margin: 30px auto;}
    footer {height: auto; padding: 30px 20px; box-sizing: border-box;}
    footer p {margin-bottom: 30px;}
    .services .elem img {display: block; margin: 0px auto 32px auto;}
    .services .elem {padding: 0px 20px; box-sizing: border-box;}
}

/* От ландшафтного экрана телефона до потретного планшета */
@media (min-width: 481px) and (max-width: 767px) {
        //
}

/* От портретного планшета до ландшафтного экрана и настольных дисплеев */
@media (min-width: 768px) and (max-width: 979px) {

}

/* Средний дисплей */
@media (min-width: 980px) and (max-width: 1370px) { 

}

@media  (min-width: 481px){ 
    #bg {display: none !important;}
}