body { margin: 0; background: #000;}
video { 
position: fixed;
top: 50%;
left: 50%;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -100;
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
background: url('') no-repeat; background-size: cover;  -webkit-transition: 1s opacity; transition: 1s opacity; }
div { font-family: Agenda-Light, Agenda Light, Agenda, Arial Narrow, sans-serif;   
font-weight: 100; background: rgba(0,0,0,0.3); color: white; padding: 2rem; width: 33%; margin: 2rem; float: right; font-size: 1.2rem; }
h1 { font-size: 3rem; text-transform: uppercase; margin-top: 0; letter-spacing: .3rem; }
a { display: inline-block; color: #fff; text-decoration: none; background: rgba(0,0,0,0.5); 
padding: .5rem; -webkit-transition: .6s background; transition: .6s background; }
a:hover { background: rgba(0,0,0,0.9); }
.stopfade { opacity: .5; }
#polina button { 
  display: block;
  width: 80%;
  padding: .4rem;
  border: none; 
  margin: 1rem auto; 
  font-size: 1.3rem;
  background: rgba(255,255,255,0.23);
  color: #fff;
  border-radius: 3px; 
  cursor: pointer;
  -webkit-transition: .3s background;
  transition: .3s background;
}
#polina button:hover { 
   background: rgba(0,0,0,0.5);
}

@media screen and (max-width: 500px) { 
  div{width:70%;} 
}
@media all and (max-device-width: 800px) {
  body { background: url("") #000 no-repeat center center fixed; background-size: cover; }
  #bgvid, #polina button { display: none; }
  div{width:70%;} 
}