body {

  font-family: 'Open Sans Condensed', sans-serif;
 background-color: #4182C3
}

header, nav, vcard, article, #ifr1 {
 display: block; 
}
#ifr1 {
max-width: 1080px;margin: 0 auto;background-color: #fff
}

.vcard {text-align: center;
margin: 10px;
float: left;
position: relative;
padding: 3px 4px;
width: 300px;
}



h3 a {color: #000; margin: 0 15px; text-align: center }
#avtd-embed-link {
 color: #fff
}

   
nav { text-align: center;
list-style: none;
background-color: #42aaff; padding: 5px;
float: left; width: 26%;margin: 0;
}

nav li { float: left; width: 100%;margin: 0;
	font-size: 22px; 
	height: 35px;
    border: 1px solid #ffff00; 
}
nav li a { color: #fff;
    text-decoration: none;
	display: block;
    height: 25px;
	padding: 5px 10px 4px 10px;
}
nav li:hover { background-color: #1faee9;
    border: 1px solid #677fc8 
}

nav li a:hover { color: #fff0f5;
}

.clear {
clear: both;
}

article, header {
    background-color: #fff;
    float: left;
    font-size: 19px;
    margin: 2%;
    padding: 20px;
    transition: background-color 0.2s ease-out 0s;
    width: 90%;
}
article {float: left; margin: 0; width: 68%;
    text-align: justify;
}

.spectehnika { float: left;
width: 300px;
height: 450px;
margin: 9px;
border: 1px solid #dedede;
}

.container {
  width: 100%;
  /* overflow: hidden; position: relative; background: #000;*/
  margin: 0;
}

.container a {color: #000;}

.stoimost {
text-align: center;
}

.container img {
  width: 100%;
}

.container h3, .spectehnika h3 {
text-align: center;
  color: #000;
  font-size: 20px;
  font-family: 'Open Sans Condensed', sans-serif;
  margin: 5px 0;
  bottom: 0;
  /* 
  width: 360px; position: absolute;
  text-transform: uppercase;
  transition: transform 0.9s cubic-bezier(0.34, 0.67, 0.17, 0.95); */
}
/*
.container:hover h3 {
  transform: translateY(-200px);
}

.container:hover .overlay {
  transform: translateY(-630px);
}
*/
.container ul {
  margin-left: -15px;
 width: 250px;}

.overlay {
  width: 380px;
  background: #fff;

 /*   margin-top: 512px;
  height: 100%;
  position: absolute;
  transition: transform 0.8s cubic-bezier(0.24, 0.06, 0.25, 0.92); */
}

.overlay li { color: #000;
list-style: outside none none;
 margin: 1px;
}
.overlay a { color: #000;
    text-decoration: none;
}

.clear {
    clear: both;
}

@media screen and (max-width: 1300px) {
.overlay {
  width: 360px;}
}

@media screen and (max-width: 1080px) {
article {
width: 50%;
}
nav { width: 280px;
}
}


@media screen and (max-width: 780px) {
article {
width: 85%;
}}


@media screen and (max-width: 780px) {
nav { width: 90%;
}
}
@media screen and (max-width: 480px) {
.spectehnika, .container, .overlay, .container h3, header { 
width: 95%;
}
nav { width: 90%;
}
header { 
padding: 2px;
}
}


.instal div {
color: #fff; 
border:1px solid black; 
    font-size: 18px;
    text-align:center;
    width: 300px;
    display: block;
background-color: #0000ff !important ;
margin: 1% auto;
padding: 1%;
}
.instal div h3 {text-aliign:center;
    width: 300px;
}


@media screen and (max-width: 780px) {
.instal div {
    display: none;
}
}

.videof {
    width: 560px;
    height:  315;
}

@media screen and (max-width: 600px) {
.videof {
    width: 100%;
}}

