/* Основные стили */

.content {
	position: absolute;
	
	font-family: 'Open Sans', sans-serif;
	background-color: ;
	padding: 28px;
	z-index: 999;
}

.content img {
	max-width: 230px;
	width: 100%;
	top: 28%;
}

.content h1 {
	font-size: 2em;
	font-weight: 700;
}

.content p {
	margin-top: 14px;

}

.content a {
	color: #333;
}

.content3 {
    width: 1480px;
    margin: 0 auto;
    color: #ccc;
    border: # 1px solid;
    padding-top: 40px;
    padding-bottom: 0px;
    background: #fff;
}


@media only screen and (min-width: 300px) {
     .content3 {
    min-width: 300px;
    margin: 0 auto;
    color: #ccc;
    border: # 1px solid;
    padding-top: 40px;
    padding-bottom: 0px;
    background: #fff;
    width: 100%;
    background-color: rgba(255, 255, 255, 0.3);
    box-shadow: 0 0 16px 8px rgba(0,0,0,0.3), 0 10px 10px rgba(0,0,0,0);
}
}

@media only screen and (min-width: 1300px) {
     .content2 {
    position: absolute;
top: 3% !important;
bottom: ;
font-family: 'Open Sans', sans-serif;
background-color: ;
padding-left: %;
padding-right: %;
z-index: 999;
border: ;
width: 100%;
}
}

@media only screen and (min-width: 1300px) {
     .content3 {
    width: 1050px;
    margin: 0 auto;
    color: #ccc;
    border: # 1px solid;
    padding-top: 50px;
    padding-bottom: 0px;
    background: #fff;
    background-color: rgba(255, 255, 255, 0.3);
    box-shadow: 0 0 16px 8px rgba(0,0,0,0.3), 0 10px 10px rgba(0,0,0,0);
}
}

@media only screen and (min-width: 1500px) {
     .content3 {
    width: 1180px;
    margin: 0 auto;
    color: #ccc;
    border: # 1px solid;
    padding-top: 40px;
    padding-bottom: 0px;
    background: #fff;
    background-color: rgba(255, 255, 255, 0.3);
    box-shadow: 0 0 16px 8px rgba(0,0,0,0.3), 0 10px 10px rgba(0,0,0,0);
}
}


@media only screen and (min-width: 1700px) {
     .content3 {
    width: 1395px;
    margin: 0 auto;
    color: #ccc;
    border: # 1px solid;
    padding-top: 40px;
    padding-bottom: 0px;
    background: #DCDCDC;
    /*background-color: rgba(255, 255, 255, 0.3);*/
    box-shadow: 0 0 16px 8px rgba(0,0,0,0.4), 0 10px 10px rgba(0,0,0,0);
}
}


@media only screen and (min-width: 300px) {
     .content img{
      width: 90%;
      margin-left: 4% !important;
      margin-top: -5px;
    }
}

@media only screen and (min-width: 1100px) {
     .content img{
      width: 80%;
      margin-left: 10% !important;
      margin-top: 15px;
    }
}
@media only screen and (min-width: 1500px) {
     .content img{
      margin-left: 10% !important;
      margin-top: 15px;
    }
}

@media only screen and (min-width: 1800px) {
     .content img{
     	width: 90%;
      margin-left: 10% !important;
      margin-top: 15px;
    }
}

@media only screen and (min-width: 300px) {
     .zastavka{
      /*margin-top: -90px;*/
       margin-left: 3%;
margin-right: 2.5%;

    }
}


@media only screen and (min-width: 1300px) {
     .zastavka{
      margin-bottom: 70px;
       height: 700px;
       width: 1000px;
       margin: 0 auto;
       margin-top: -25px;
    }
}

@media only screen and (min-width: 1500px) {
     .zastavka{
      margin-top: 0px;
      margin-bottom: -10px;
       height: 700px;
       width: 1130px;
       margin: 0 auto;
    }
}

@media only screen and (min-width: 300px) {
     .zastavka img{
      margin-top: -20px;
      margin-bottom: -10px;
       /*height: 700px;*/
       min-width: 280px;
       width: 96%;

    }
}

@media only screen and (min-width: 1300px) {
     .zastavka img{
      margin-top: 0px;
      margin-bottom: -10px;
       height: 700px;
       min-width: 900px;
       width: 100%;

    }
}

@media only screen and (min-width: 1500px) {
     .zastavka img{
      margin-top: -15px;
      margin-bottom: -10px;
       height: 720px;
       min-width: 1130px;
       width: 100%;

    }
}

@media only screen and (min-width: 1700px) {
     .zastavka img{
      margin-top:-3px;
      margin-bottom: -10px;
       height: 840px;
       min-width: 1230px;
       width: 100%;

    }
}

@media only screen and (min-width: 1800px) {
     .zastavka{
      margin-top: 3px;
      margin-left: 8.3%;
margin-right: 10%;
 min-width: 1320px;
  margin-bottom: -10px;
  height: 830px;
  margin: 0 auto;
    }
}

.content2 {
	position: absolute;
top: 20%;
bottom: ;
	font-family: 'Open Sans', sans-serif;
	background-color: ;
padding-left: %;
padding-right: %;
	z-index: 999;
	border: ;
	width: 100%;
  
}

@media only screen and (min-width: 300px) {
     .content2 {
      top: 0%;
      padding-left: %;
    }
}


@media only screen and (min-width: 1500px) {
     .content2 {
     	top: 3.7%;
      padding-left: %;
    }
}

@media only screen and (min-width: 300px) {
     .content2 p a {
      position: absolute;
margin-top: 800px;
margin-left: -3px;
width: 220px;
top: -650px;
    }
}

@media only screen and (min-width: 1200px) {
     .content2 p a {
      position: absolute;
margin-top: 800px;
margin-left: 900px;
width: 220px;
top: -235px;
    }
}


@media only screen and (min-width: 1500px) {
     .content2 p a {
      position: absolute;
margin-top: 800px;
margin-left: 1100px;
width: 220px;
top: -235px;
    }
}

@media only screen and (min-width: 1700px) {
     .content2 p a {
      position: absolute;
margin-top: 950px;
margin-left: 1250px;
width: 220px;
font-size: 18px;
    }
}


@media only screen and (min-width: 1800px) {
     .zastavka p a {
     margin-top: 0px;
    position: absolute;
    }
}

@media only screen and (min-width: 1800px) {
     .content2 {
      top: 3%;
      padding-left: %;

    }
}

.project p a:hover {
  border: #fff 1px solid;
      width: 70px;
padding-left: 7px;
left: -8px;
}

.project_2 p a:hover {
  border: #fff 1px solid;
      width: 70px;
padding-left: -15px;
left: px;
}

@media only screen and (min-width: 300px) {
     video {
     width: 410px;
/*height: 700px;*/
/*margin-left: -95px;*/
margin-top: px;
    }
}


@media only screen and (min-width: 1300px) {
     video {
     width: 1000px;
height: 700px;
/*margin-left: -95px;*/
margin-top: px;
    }
}

@media only screen and (min-width: 1500px) {
     video {
     width: 1390px;
height: 700px;
margin-left: -95px;
margin-top: px;
    }
}


@media only screen and (min-width: 1800px) {
     video {
     width: 1376px;
height: 869px;
margin-left: 0px;
margin-top: -20px;
    }
}

@media only screen and (min-width: 300px) {
    .content2 p {
  margin-top: -230px !important;
  float: left;
  padding-left: 0px !important;
  padding-right: 20px;
  color: #fff;
  line-height: 20px !important;
  text-align: justify;
  font-size: 14px !important;
  position: absolute;
  width: 294px !important;

}
}

@media only screen and (min-width: 1300px) {
    .content2 p {
  margin-top: -670px !important;
  float: left;
  padding-left: 50px;
  padding-right: 20px;
  color: #fff;
  line-height: 40px;
  text-align: justify;
  font-size: 18px;
  position: absolute;
  width: 900px !important;

}
}

@media only screen and (min-width: 1500px) {
    .content2 p {
  margin-top: -690px !important;
  float: left;
  padding-left: 50px;
  padding-right: 20px;
  color: #fff;
  line-height: 28px !important;
  text-align: justify;
  font-size: 18px;
  position: absolute;
  width: 1070px !important;
  font-size: 20px !important;
margin-left: 30px !important;

}
}


@media only screen and (min-width: 1800px) {
    .content2 p {
  margin-top: -810px !important;
  float: left;
  padding-left: 50px;
  padding-right: 20px;
  color: #fff;
  line-height: 36px !important;
  text-align: justify;
  font-size: 18px;
  position: absolute;
  width: 1250px !important;
  font-size: 21px !important;
margin-left: 34px !important;

}
}


.zastavka {
	/*border: #333 1px solid;*/
	min-width: px;
width: ;
padding-bottom: 0px;
}

.content2 h1 {
	font-size: 2em;
	font-weight: 700;
}

.content2 p {
	margin-top: -670px;
	float: left;
	padding-left: 50px;
	padding-right: 20px;
	color: #fff;
	line-height: 40px;
	text-align: justify;
	font-size: 18px;
  position: absolute;
  width: 1130px;

}

.content2 a {
	color: #333;
}

.responsive {
    width: 100%;
    height: auto;
}

.content2_ {
 top: 47%;
  transform: translateY(-50%);
  animation-name: Appearance;
  animation-duration: 2s;
  animation-timing-function: cubic-bezier(.1,-.6,.2,0);
}

.span {
 padding-bottom: 10px;
}

@-webkit-keyframes Appearance {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

@-o-keyframes Appearance {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

@-moz-keyframes Appearance {
  0% {opacity: 0;}
  100% {opacity: 1;}
}

@keyframes Appearance {
  0% {opacity: 0;}
  100% {opacity: 1;}
}
/* Стили для видеофона */

#video-bg {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: hidden;
	z-index: 1;
	background: url(bg/daisy-stock-poster.jpg) no-repeat #94a233;
	background-size: cover;
}

#video-bg > video {
	position: absolute;
	top: 0;
	left: 0;
	min-width: 100%; 
	min-height: 100%;
	width: auto;
	height: auto; 
}


/* Проверка на поддержку свойства object-fit: */

 @supports (object-fit: cover) {
     #video-bg > video {
         top: 0;
         left: 0;
         width: 100%;
         height: 100%;
         object-fit: cover;
     }
 }


/* Отключение видео для устройств с размером экрана менее 800px: */

@media screen and (max-device-width: 800px) {
	#video-bg > video {
		display: none;
		}
	}
