
body {
  margin: 0;
  padding: 0;
  height: 100%;
  background: #000; 
}

/* Smartphones, Tablet, etc. ----------- */
@media only screen 
and (min-width : 320px) 
and (max-width : 1000px) 
{
/* Styles */
  
  #bgvid { display: none; 
  }



  #warning {
    height: 200px;
    width: 200px;
    border: solid white 2px;
    display: block;
    color: white;
    text-align: center;
    /*margin:30px auto 0 auto*/;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  #warning p {
    margin-top: 80px;
  }

  #iframeWrap {
   display: none;
  }

}

/* Shit Monitors ----------- */
@media only screen 
and (min-width : 1000px)  {
/* Styles */

  #warning {
    display: none;
  }

  iframe {
   position: absolute;
    top: -200px;
    left: -114px;
    width: 450px;
    height: 800px;
    border: 3px black solid;
    -ms-transform:  scale(-.5, .5); /* IE 9 */
    -webkit-transform: scale(-.5, .5); /* Chrome, Safari, Opera */
    transform: scale(-.5, .5);

  }

  #iframeWrap {
     display: block;
     position: absolute;
     top: 25%;
     left:40px;
  }


}

/* Desktops and laptops ----------- */
@media only screen 
and (min-width : 1224px) {
/* Styles */

  iframe {
   position: absolute;
  /*  top: -40px;
    left: -40px;*/
    top:-144px;
    width: 450px;
    height: 800px;
    border: 3px black solid;
    -ms-transform:  scale(-.64, .64); /* IE 9 */
    -webkit-transform: scale(-.64, .64); /* Chrome, Safari, Opera */
    transform: scale(-.64, .64);

  }

  #iframeWrap {
    position: absolute;
    top: 15%;
    left: 100px;
  }

  #swoosh {
    background-image: url("ribbon_m.png");
    background-repeat: no-repeat;
    background-size: 900px 308px;
    position: absolute;
    left:150px;
    top:200px;
    width: 900px;
    height: 400px;
    z-index: -1;
    opacity: .1;
  }



}

/* Large screens ----------- */
@media only screen 
and (min-width : 1600px) {
/* Styles */

  iframe {
   position: absolute;
    top:-110px;
    left: -62px;
    width: 495px;
    height: 880px;
    border: 3px black solid;
   -ms-transform:  scale(-.75, .75); /* IE 9 */
    -webkit-transform: scale(-.75, .75); /* Chrome, Safari, Opera */
    transform: scale(-.75, .75);
  }

  #iframeWrap {
    position: absolute;
  top: 15%;
  left: 100px;

  }


  #swoosh {
    background-image: url("ribbon_m.png");
    background-repeat: no-repeat;
    background-size: 1080px 370px;
    position: absolute;
    left:250px;
    top:200px;
    width: 1100px;
    height: 400px;
    z-index: -1;
    opacity: .1;
}


}

/* Large screens ----------- */
@media only screen 
and (min-width : 1920px) {
/* Styles */

  iframe {
    position: fixed;
    top:100px;
    left: 40px;
    width: 495px;
    height: 880px;
    border: 3px black solid;
   -ms-transform:  scale(-.85, .85); /* IE 9 */
    -webkit-transform: scale(-.85, .85); /* Chrome, Safari, Opera */
    transform: scale(-.85, .85);
  }

  #iframeWrap {
  /* position: relative;
    height: 0;
    overflow: hidden;
    padding-bottom: 177.78%;*/

  }


  #swoosh {
    background-image: url("ribbon_m.png");
    background-repeat: no-repeat;
    background-size: 1080px 370px;
    position: absolute;
    left:250px;
    top:200px;
    width: 1100px;
    height: 400px;
    z-index: -1;
    opacity: .1;
  }


}

  


.wrapper {

  width:100%;
  height:100vh;
  overflow: hidden;
}

.wrapper video {
  /*object-fit: contain;*/
  /*       object-fit: fill; */
  object-fit: cover;
  width:100%;
  height:100%;
  background: url('//demosthenes.info/assets/images/polina.jpg') no-repeat;
}