@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,700,800&subset=cyrillic');
@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:600&subset=cyrillic,cyrillic-ext');
@import url('fonts/font-awesome.otf');

html, body{
margin: 0;
padding: 0;
height: 100%;
}

h2{
font-size: 20px;
letter-spacing: 2px;
font-weight: 400;
}

html{
position: relative;
}

ul{
padding-left: 15px;
}

body{
font-family: 'Arial', sans-serif;
font-size: 10px;
font-weight: 500;
line-height: 14px;
letter-spacing: 1.5px;
text-transform: uppercase;
background: #000000;
padding-bottom: 35px;
}

#header{
margin-top: 25px;
}
.no-padd{
padding: 0 !important;
}
.padd-top-50{
padding-top: 50px;
padding-bottom: 50px;
}

.width60{
width: 60%;
}
.width40{
width: 40%;
}


.flex{
display: flex;
align-items: center;
height: 100%;
position: relative;
   background-color: #000;
}
.flex-bg{
  background-color: #fff;
}
.vertical-align{
    display: flex;
    align-items: center;
}
.slider-clients div{
text-align: center;
}
.slider-clients img{
display: inline-block;
}

.dropdown{
display: inline-block;
float: left;
}
.dropdown-menu > li > a{
padding-left: 10px;
}

.dropdown-menu .divider{
background: url('../images/bg-white50.png') repeat-x;
}
.nav{
display: inline-block;
}
.nav a,
.nav > li > a{
font-size: 10px;
font-weight: 500;
line-height: 14px;
letter-spacing: 1.5px;
text-transform: uppercase;
color: #FFFFFF;
padding: 18px 8px 18px 9px;
}

.nav .open a:hover,
.nav .open a,
.nav li a:hover,
.nav > li > a:focus, .nav > li > a:hover,
.dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover{
background: none;
color: #626262;
}

.nav .open a:hover{
color: #FFFFFF;
}
.dropdown-menu{
background: #000;
left: 0;
padding: 0 1000px;
margin: 0 -1000px;
padding-top: 10px;
padding-bottom: 10px;
transition: height .1s ease;
}

.dropdown-menu > li > a{
color: #626262;
}

#top-images{
overflow: hidden;
height: 100%;
width: 100%;
background: url('../images/top-image2.jpg') no-repeat;
background-size: cover;
background-position: center;

opacity: 1.0;
-webkit-transition: background 2.5s linear;
-moz-transition: background 2.5s linear;
-o-transition: background 2.5s linear;
-ms-transition: background 2.5s linear;
transition: background 2.5s linear;

    -webkit-animation: myfirst 2s ; /* Chrome, Safari, Opera */
    animation: myfirst 2s ;
}

 /* Chrome, Safari, Opera */
  @-webkit-keyframes myfirst {
    from {opacity: 0.2;}
    to {opacity: 1;}
  }

  /* Standard syntax */
  @keyframes myfirst {
    from {opacity: 0.2;}
    to {opacity: 1;}
  }

.top-image-desk{
position: absolute;
bottom: 10%;
}
#top-images p{
color: #FFFFFF;
}

.social a{
color: #FFFFFF;
font-weight: 600;
display: inline-block;
margin-right: 5px;
}
.social img{
margin-right: 5px;
}

.logo img{
margin-left: 25px;
display: inline-block;
padding: 10px 0 0 0;
}
.logo h1{
text-transform: uppercase;
font-weight: 400;
margin: 0;
letter-spacing: 2.5px;
padding-top: 5px;
font-size: 30px;
color: #FFFFFF;
text-transform: uppercase;
}

#index-desk{
background: #000000;
padding: 25px 0;
}
#index-desk p{
font-size: 12px;
line-height: 16px;
letter-spacing: 1.5px;
margin: 0;
color: #eee;
}

.link{
color: #FFFFFF;
border-bottom: 1px dotted #FFF;
font-weight: 700;
}
.link:hover{
text-decoration: none;
color: #FFFFFF;
}

#footer{
background-color: #000;
padding: 5px 0;
}
#footer p{
font-size: 9px;
color: #CCC;
padding: 0;
margin: 5px 0;
}

.social-img{
margin: 0 50px;
}

#fixmenu{
z-index: 100;
transition: background .7s ease;
}

.box-inner1 {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.box-inner1 img {
  height: auto;
  object-fit: cover;
}
.box1 { float:left; background-color:#c9efbe; }

.box {
    display: inline-block;
    position: relative;    
    line-height: 0;
    transition: opacity 0.3s ease-in-out;
}
.box-inner{
    transition: opacity 0.3s ease-in-out;
}
.box:hover{
    filter: alpha(opacity=30);
    -moz-opacity: 0.5;
    -khtml-opacity: 0.5;
    opacity: 0.5;
    }
.box h2 {
position: absolute;
bottom: 0;
color: #FFFFFF;
margin: 0;
padding: 0 0 25px 0;
width: 100%;
opacity: 1;
text-align: center;
}

#index-bottom{
padding: 30px 0;
padding-bottom: 70px;
text-align: center;
background: #FFFFFF;
overflow: hidden;
}
#index-bottom h3{
margin-bottom: 20px;
}
#index-bottom p{
margin-bottom: 15px;
}

.clear-bottom{
height: 35px;
}

.navbar-toggle .icon-bar{
background: #FFF;
}
.navbar-toggle{
border-color: #FFFFFF;
}
#history h2,#history p,
#activity h2,#activity p,
#practice h2,#practice p,
#competence h2,#competence p,
.gallery h3,
.gallery p{
text-align: left;
color: #FFFFFF;
}
#history p,
#competence p, #activity ul li,
#practice p, #practice ul li,
#activity p,
.gallery p{
text-transform: initial;
color: #b2b2b2;
font-size: 12px;
letter-spacing: .5px;
line-height: 20px;
}
#activity ul li,
#practice ul li{
line-height: 16px;
}

#command{
background: #FFFFFF;
}
#command p{
position: relative;
font-size: 12px;
letter-spacing: .5px;
line-height: 20px;
text-transform: initial;
}
.romb::before{
content: "";
background: #FFFFFF;
display: inline-block;
position: absolute;
width: 40px;
height: 40px;
left: -20px;
top: 50%;
transform: rotate(45deg);

}
#command .small{
text-transform: uppercase;
color: #b2b2b2;
font-weight: 600;
}

.nav > ul > li { 
    display: inline-block; 
    position: relative; 
    padding: 3px 10px 3px 0;
    z-index: 100;
}

/* SECOND LEVEL */

.nav > ul > li > ul {
    position: absolute;
    left: 0;
    top: 100%;
    padding: 0 1000em; /* trick from css-tricks comments */
    margin: 0 -1000em; /* trick from css-tricks comments */
    z-index: 101;
    visibility: hidden;
    opacity: 0;
    background: rgba(255, 240, 240, 0.8);
}

.nav > ul > li:hover > ul {
    visibility: visible;
    opacity: 1;
}

.nav > ul > li > ul > li {
    padding: 3px 0;
}

/* ------ menu-child-page ----- */

.menu-back{
background: #000000;
padding: 0 50px;
}

.navbar-collapse{
padding-left: 0;
padding-right: 0;
}

.navbar-brand{
color: #FFFFFF;
padding-left: 50px;
padding-top: 8px;
}
.navbar-brand:hover{
color: #FFFFFF;
}
.navbar-brand>img{
width: 35px;
margin-right: 10px;
display: inline;
}
.lang{
margin: 0;
}
.lang li{
display: inline-block;
}
.demo-gallery{
margin-top: 0;
overflow: hidden;
}

#contact, #sotr{
background: #FFFFFF;
height: 100%;
}
#sotr{
padding-top: 70px;
}
#sotr .flex{
flex-direction: column;
}
#sotr h3{
margin-bottom: 35px;
}

#contact h3{
margin-bottom: 20px;
font-size: 20px;
letter-spacing: 2px;
text-align: center;
}
#contact .form-group{
border-bottom: 1px solid #d8d8d8;
}
#contact .form-group input{
border: none;
box-shadow: none;
}

#contact .form-group .form-control{
display: inline;
width: auto;
}

#contact .label-msg{
float: left;
padding-right: 15px;
}
#contact .form-group textarea{
width: 100% !important;
border: none;
box-shadow: none;
}
.text-nornal{
text-transform: none;
}
.no-border{
border: none !important;
}
#contact .link{
color: #333;
border-bottom: 1px dotted;
}

[class*="ymaps-2"][class*="-ground-pane"] {
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
    /* Firefox 3.5+ */
    -webkit-filter: grayscale(100%);
    /* Chrome 19+ & Safari 6+ */
}

.addres a,
.addres a:hover{
color: #333;
text-decoration: none;
}

.ymaps-2-1-74-controls__toolbar_right{
display: none;
}

/* ----------------- main-one-page ----------------- */
.page_container_flex{
display: flex;
flex-direction: row;
justify-content: center;
align-item: center;
}
.page_container_flex img{
width: 500px;
}
.list-unstyled img:hover{
    webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    transform: scale(1.1);
}
.list-unstyled img{
    -webkit-transition: all 0.5s ease-out;
}
img.zoom:hover{
    webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    transform: scale(1.2);
    opacity: 1;
}
img.zoom{
    width: 20px;
    height: 20px;
}
.list-unstyled img:hover + .zoom{
    opacity: 1;
    z-index: 99;
}
.zoom{
    left: 50%;
    margin-left: -10px;
    margin-top: -10px;
    position: absolute;
    top: 50%;
    opacity: 0;
    z-index: 9;
    -webkit-transition: opacity 0.3s ease 0s;
    -o-transition: opacity 0.3s ease 0s;
    transition: opacity 0.3s ease 0s;
}
span#answer {
  width: 100%;
  display: block;
  text-align: center;
  color: #333;
  font-size: 18px;
  line-height: 20px;
  font-family: 'Arial', sans-serif;
}
.result {
  text-align: center;
}
span#loader {
  display: none;
  width: 100%;
  text-align: center;
}
span#answer-cooper {
  width: 100%;
  display: block;
  text-align: center;
  color: #333;
  font-size: 18px;
  line-height: 20px;
  font-family: 'Arial', sans-serif;
}
.result-cooper {
  text-align: center;
}
span#loader-cooper {
  display: none;
  width: 100%;
  text-align: center;
}

body{
   background-color: transparent;
}
.bg-index{
  background-color: #000;
}
.bg-wrap{
  background-color:#000;
  height: 100%;
  display: flex;
}

.bg-wrap-index{
  background-color:#000;
  height: 100%;
  display: flex;
}
textarea#message{
  max-width: 585px;
  min-width: 305px;
  min-height: 42px;
  max-height: 400px;

}