
html {
    height:100%;
}

body {
    margin:0;
    background-color: #fcfcfc;
    height:100%;
    font-family: 'Exo 2', sans-serif;

}

h2 {
text-align: center;
}

a {
color: #27176F;
text-decoration: none;
border-bottom: 1px solid #6A89BF;
}

.center {
text-align: center;
}

div.block {
    width:98%;
    margin: 0 auto;
    max-width: 1000px;
    padding:20px 0;
}

.header {
    /* height:100%;*/
    color:white;
    position: relative;
    background: url("/content/images/bg1.jpg") no-repeat center center;
    background-size: cover;
}

.semi {
background-color: rgba(0,0,0,0.8);
/* height:100%; */
	}

.why {
    color:white;
    position: relative;
    background: url("/content/images/bg2.jpg") no-repeat center center;
    background-size: cover;
}

.why a {
color:white;
}

.why2 {
    color:white;
    position: relative;
    background: url("/content/images/why2.jpg") no-repeat center center;
    background-size: cover;
	}

.why a {
color:white;
}

.footer {
    text-align: center;
    border-top:1px solid;
}

.relative {
    position: relative;
}

.height100 {
    height: 100vh;
}


.logo {
    width:400px;
    height:auto;
}

.logolink {
border-bottom: none;
}




/* change text animation */

.rotated {
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    margin:auto;
    height:100px;
    text-align: center;
}

.rotated-text {
  color:#91A6CF;
    font-size:3em;
}
.rotated-text:after {
  content:"";
  animation: changeLetter 6s linear infinite alternate;
}

@keyframes changeLetter {
  0% {
    content: "Индивидуальный подход";
      opacity:1;
  }
  25% {
      opacity:0;
  }
  50% {
    content: "Высокое качество продукции";
      opacity:1;
  }
75% {
      opacity:0;
  }
  100% {
    content: "Надежный партнер";
      opacity:1;
  }
}

.arrow {
width:10px;
height: 10px;
padding:5px;
border: solid #91A6CF;
border-width: 0 1px 1px 0;
-moz-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-o-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
display: inline-block;
margin-top:15px;
}

.downarrow {
width:60px;
height:60px;
border: 1px solid #91A6CF;
border-radius:30px;
text-align: center;

position: absolute;
right:0;
left:0;
bottom:60px;
margin:0 auto;
 
-moz-animation: bounce 2s infinite;
-webkit-animation: bounce 2s infinite;
animation: bounce 2s infinite;
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-30px);
  }
  60% {
    transform: translateY(-15px);
  }
  }
/* блок текст с фото */
div.phototext {
   display: flex;
   align-items: center;
    justify-content: space-between;
}

.phototext div {
    padding:10px;
    margin:10px;
}

div.photo {
    width: 30%;
    max-width: 100%;
}

.photo img {
    width: 300px;
    max-width: 100%;
}

div.text {
    width: 70%;
    max-width: 100%;
}


a.button {
background-color: #91A6CF; 
padding:10px;
text-decoration: none;
color:white;
-webkit-box-shadow: 0px 0px 10px 0px rgba(200,200,200,1);
-moz-box-shadow: 0px 0px 10px 0px rgba(200,200,200,1);
box-shadow: 0px 0px 10px 0px rgba(200,200,200,1);
border-radius: 3px;
    
}

.why h3 {
    text-align: center;
    
}

div.whylist {
   display: flex;
   align-items: stretch;
    justify-content: space-around;
     flex-flow: row wrap;
}

.whylist div {
    padding:10px;
    margin:10px;
    width:250px;
    text-align: center;
}

.margin-10px {
margin-top: -10px;
}

.margin-20px {
margin-top: -20px;
}

.margin-30px {
margin-top: -30px;
}



/*.why img {
width:150px;
height:auto;
margin-bottom:20px;
}*/

.why {
color: #91A6CF;
}

.why2 {
color: #91A6CF;
}

.why a {
color: #91A6CF;

}

.why2 img {
width:150px;
height:auto;
margin-bottom:20px;
}

.why img.contacts {
height:20px;
width:auto;
vertical-align: top;
}

/* адаптивность */

span.less-900-show {
	display: none;
}

@media screen and (max-width:900px) {
    span.less-900 {
		display: none;
    }
	
	span.less-900-show {
		display: inline;
    }
	
	.logo {
	width: 230px;
	}
}

p.images {
	text-align: center;
}

.images img {
	-webkit-box-shadow: 0px 0px 10px 0px rgba(200,200,200,1);
-moz-box-shadow: 0px 0px 10px 0px rgba(200,200,200,1);
box-shadow: 0px 0px 10px 0px rgba(200,200,200,1);
margin:5px;
height:50%;
max-height: 330px;
}