﻿
video { 
    position: fixed;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    z-index: -100;
    transform: translateX(-50%) translateY(-50%);
 background: url('/images/banner.jpg') no-repeat;
  background-size: cover;
  transition: 1s opacity;
}
.stopfade { 
   opacity: .5;
}

/*FIX SPECTRAL FOR VIDEO*/
#page-wrapper {
    transition: 2s background !important;
}
#main > header, body.landing #page-wrapper.videoBgk {
    background: url(/images/gridtile.png);
}

.vidIcon {
    display:none;
    opacity: .4;
    filter: alpha(opacity=40);
    transition: .5s all;
    position: absolute;
    bottom: 10px;
    z-index: 100;
    cursor: pointer;
    padding: 0;
    width: 23px;
    height: 22px;
    text-align: center;
    line-height: 22px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}
.vidIcon:hover, .vidIcon.active  {
    opacity: 1; filter: alpha(opacity=100);
}
.vidIcon.active  {
    background-color: #000;
}

#audioIcon { left:85px; }
#ffIcon    { left:60px; }
#pauseIcon { left:35px; }
#stopIcon  { left:10px; display:none; }
#rwIcon    { left:10px; }
.vidPaused { opacity: 1; filter: alpha(opacity=1); }

@media screen and (max-width: 980px) { 
  /*div{width:70%;}*/
    .vidIcon {
        display: none!important;
    }
}
@media screen and (max-device-width: 100px) {
  html { background: url('/images/banner.jpg') #000 no-repeat center center fixed; }
  /*#bgvid { display: none; }*/
}



