.banner { position: relative; overflow: auto;background-color: rgba(0,0,0,0.5);width: 98%;margin: auto;padding: auto; }
    .banner li { list-style: none; }
        .banner ul li { float: left; }


 @font-face {
  font-family: 'Electrolize';
  font-style: normal;
  font-weight: 400;
  src: local('Electrolize'), local('Electrolize-Regular'), url(http://themes.googleusercontent.com/static/fonts/electrolize/v2/DDy9sgU2U7S4xAwH5thnJ4bN6UDyHWBl620a-IRfuBk.woff) format('woff');
}

body {
	background: #310404 url(http://web-sonick.zz.mu/images/sl/red_texture.jpg) repeat top left;
	font-family: 'Electrolize';
}

@-webkit-keyframes pulse {
  25% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
  75% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }
}

@keyframes pulse {
  25% {
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
  }
  75% {
    -webkit-transform: scale(0.8);
    -ms-transform: scale(0.8);
    transform: scale(0.8);
  }
}
 
.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

@-webkit-keyframes wobble {
  16.65% {
    -webkit-transform: translateY(2px);
    transform: translateY(2px);
  }
  33.3% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
  49.95% {
    -webkit-transform: translateY(4px);
    transform: translateY(4px);
  }
  66.6% {
    -webkit-transform: translateY(-2px);
    transform: translateY(-2px);
  }
  83.25% {
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes wobble {
  16.65% {
    -webkit-transform: translateY(2px);
    -ms-transform: translateY(2px);
    transform: translateY(2px);
  }
  33.3% {
    -webkit-transform: translateY(-2px);
    -ms-transform: translateY(-2px);
    transform: translateY(-2px);
  }
  49.95% {
    -webkit-transform: translateY(4px);
    -ms-transform: translateY(4px);
    transform: translateY(4px);
  }
  66.6% {
    -webkit-transform: translateY(-2px);
    -ms-transform: translateY(-2px);
    transform: translateY(-2px);
  }
  83.25% {
    -webkit-transform: translateY(1px);
    -ms-transform: translateY(1px);
    transform: translateY(1px);
  }
  100% {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.grow {
  -webkit-transition:all 0.5s ease-out;
  -moz-transition:all 0.5s ease-out;
  -ms-transition:all 0.5s ease-out;
  -o-transition:all 0.5s ease-out;
  transition:all 0.5s ease-out;
}

.grow:hover {
  -webkit-transform:scale(1.3);
  -moz-transform:scale(1.3);
  -ms-transform:scale(1.3);
  -o-transform:scale(1.3);
  transform:scale(1.3);
}

.wobble {
  display: inline-block;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
}

.wobble:hover {
  -webkit-animation-name: wobble;
  animation-name: wobble;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

.zoom-tilt {
  -webkit-transition:all 0.3s ease-out;
  -moz-transition:all 0.3s ease-out;
  -ms-transition:all 0.3s ease-out;
  -o-transition:all 0.3s ease-out;
  transition:all 0.3s ease-out;
}

.zoom-tilt:hover {
  -webkit-transform:rotate(15deg) scale(1.3);
  -moz-transform:rotate(15deg) scale(1.3);
  -ms-transform:rotate(15deg) scale(1.3);
  -o-transform:rotate(15deg) scale(1.3);
  transform:rotate(15deg) scale(1.3);
}

.winningbanners {
    float: right;    
    margin-right:15px; 
    height:110px;
    width: 720px;

            
     /***  CSS Rounded Corners  ***/
  border-radius:9px;
  -webkit-border-radius:9px;
  -moz-border-radius:9px;

  /***  CSS Box Shadow  ***/
  box-shadow: 1px 2px 1px 2px #181818 ;

  -webkit-box-shadow: 1px 2px 1px 2px #181818 ;

  -moz-box-shadow: 1px 2px 1px 2px #181818 ;

}

.container{
	width: 100%;
    height: 100px;
    background-color: transparent;
	position: relative;
	overflow:hidden;
}

a {
  text-decoration:none;
}

h1.main,p.demos {
	-webkit-animation-delay: 18s;
	-moz-animation-delay: 18s;
	-ms-animation-delay: 18s;
	animation-delay: 18s;
}
.sp-container {
	position: relative;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: 0; 
}
.sp-content {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	z-index: 1000;
}
.sp-container h2 {
	position: absolute;
	top: 50%;
	line-height: 100px;
	height: 40px;
	margin-top: -50px;
	font-size: 40px;
	width: 100%;
	text-align: center;
	color: transparent;
	-webkit-animation: blurFadeInOut 3s ease-in backwards;
	-moz-animation: blurFadeInOut 3s ease-in backwards;
	-ms-animation: blurFadeInOut 3s ease-in backwards;
	animation: blurFadeInOut 3s ease-in backwards;
}
.sp-container h2.frame-1 {
    color: gold;
	-webkit-animation-delay: 0s;
	-moz-animation-delay: 0s;
	-ms-animation-delay: 0s;
	animation-delay: 0s;
}
.sp-container h2.frame-2 {
    color: gold;
	-webkit-animation-delay: 3s;
	-moz-animation-delay: 3s;
	-ms-animation-delay: 3s;
	animation-delay: 3s;
}
.sp-container h2.frame-3 {
    color: gold;
	-webkit-animation-delay: 6s;
	-moz-animation-delay: 6s;
	-ms-animation-delay: 6s;
	animation-delay: 6s;
}
.sp-container h2.frame-4 { 
    color: gold;
	-webkit-animation-delay: 9s;
	-moz-animation-delay: 9s;
	-ms-animation-delay: 9s;
	animation-delay: 9s;
}
.sp-container h2.frame-5 {
    color: gold;
	-webkit-animation: none;
	-moz-animation: none;
	-ms-animation: none;
	animation: none;
	color: transparent;
	text-shadow: 0px 0px 1px #fff;
}
.sp-container h2.frame-5 span {
	-webkit-animation: blurFadeIn 3s ease-in 12s backwards;
	-moz-animation: blurFadeIn 1s ease-in 12s backwards;
	-ms-animation: blurFadeIn 3s ease-in 12s backwards;
	animation: blurFadeIn 3s ease-in 12s backwards;
	color: transparent;
	text-shadow: 0px 0px 1px #fff;
}
.sp-container h2.frame-5 span:nth-child(2) {
	-webkit-animation-delay: 13s;
	-moz-animation-delay: 13s;
	-ms-animation-delay: 13s;
	animation-delay: 13s;
}
.sp-container h2.frame-5 span:nth-child(3) {
	-webkit-animation-delay: 14s;
	-moz-animation-delay: 14s;
	-ms-animation-delay: 14s;
	animation-delay: 14s;
}   
/**/
@-webkit-keyframes blurFadeInOut{
	0%{
		opacity: 0;
		text-shadow: 0px 0px 40px #fff;
		-webkit-transform: scale(1.3);
	}
	20%,75%{
		opacity: 1;
		text-shadow: 0px 0px 1px #fff;
		-webkit-transform: scale(1);
	}
	100%{
		opacity: 0;
		text-shadow: 0px 0px 50px #fff;
		-webkit-transform: scale(0);
	}
}
@-webkit-keyframes blurFadeIn{
	0%{
		opacity: 0;
		text-shadow: 0px 0px 40px #fff;
		-webkit-transform: scale(1.3);
	}
	50%{
		opacity: 0.5;
		text-shadow: 0px 0px 10px #fff;
		-webkit-transform: scale(1.1);
	}
	100%{
		opacity: 1;
		text-shadow: 0px 0px 1px #fff;
		-webkit-transform: scale(1);
	}
}
@-webkit-keyframes fadeInBack{
	0%{
		opacity: 0;
		-webkit-transform: scale(0);
	}
	50%{
		opacity: 0.4;
		-webkit-transform: scale(2);
	}
	100%{
		opacity: 0.2;
		-webkit-transform: scale(5);
	    color: transparent;
	}
}
@-webkit-keyframes fadeInRotate{
	0%{
		opacity: 0;
		-webkit-transform: scale(0) rotate(360deg);
	}
	100%{
		opacity: 1;
		-webkit-transform: scale(1) rotate(0deg);
          color: transparent;
	}
}
/**/
@-moz-keyframes blurFadeInOut{
	0%{
		opacity: 0;
		text-shadow: 0px 0px 40px #fff;
		-moz-transform: scale(1.3);
	}
	20%,75%{
		opacity: 1;
		text-shadow: 0px 0px 1px #fff;
		-moz-transform: scale(1);
	}
	100%{
		opacity: 0;
		text-shadow: 0px 0px 50px #fff;
		-moz-transform: scale(0);
	}
}
@-moz-keyframes blurFadeIn{
	0%{
		opacity: 0;
		text-shadow: 0px 0px 40px #fff;
		-moz-transform: scale(1.3);
	}
	100%{
		opacity: 1;
		text-shadow: 0px 0px 1px #fff;
		-moz-transform: scale(1);
	}
}
@-moz-keyframes fadeInBack{
	0%{
		opacity: 0;
		-moz-transform: scale(0);
	}
	50%{
		opacity: 0.4;
		-moz-transform: scale(2);
	}
	100%{
		opacity: 0.2;
		-moz-transform: scale(5);
	}
}
@-moz-keyframes fadeInRotate{
	0%{
		opacity: 0;
		-moz-transform: scale(0) rotate(360deg);
	}
	100%{
		opacity: 1;
		-moz-transform: scale(1) rotate(0deg);
	}
}
/**/
@keyframes blurFadeInOut{
	0%{
		opacity: 0;
		text-shadow: 0px 0px 40px #fff;
		transform: scale(1.3);
	}
	20%,75%{
		opacity: 1;
		text-shadow: 0px 0px 1px #fff;
		transform: scale(1);
	}
	100%{
		opacity: 0;
		text-shadow: 0px 0px 50px #fff;
		transform: scale(0);
	}
}
@keyframes blurFadeIn{
	0%{
		opacity: 0;
		text-shadow: 0px 0px 40px #fff;
		transform: scale(1.3);
	}
	50%{
		opacity: 0.5;
		text-shadow: 0px 0px 10px #fff;
		transform: scale(1.1);
	}
	100%{
		opacity: 1;
		text-shadow: 0px 0px 1px #fff;
		transform: scale(1);
	}
}
@keyframes fadeInBack{
	0%{
		opacity: 0;
		transform: scale(0);
	}
	50%{
		opacity: 0.4;
		transform: scale(2);
	}
	100%{
		opacity: 0.2;
		transform: scale(5);
	}
}
@keyframes fadeInRotate{
	0%{
		opacity: 0;
		transform: scale(0) rotate(360deg);
	}
	100%{
		opacity: 1;
		transform: scale(1) rotate(0deg);
	}
}















@font-face {
  font-family: 'Electrolize';
  font-style: normal;
  font-weight: 200;
  src: local('Electrolize'), local('Electrolize-Regular'), url(http://themes.googleusercontent.com/static/fonts/electrolize/v2/DDy9sgU2U7S4xAwH5thnJ4bN6UDyHWBl620a-IRfuBk.woff) format('woff');
}

a:hover {
    color: white;
}
 
    .statBox {
        width: 25%;
        left: 1px;
        float: left;
    }
 

body 
{
    background-color:#040404;
    font-family: 'Electrolize';
    font-size: 12px;
    width: 100%;
    height: 100%;
    text-align: left;  
}  

#winningLinks {
    color: white;
    font-weight: bold;
 font-size: 135%;
}

#winningLinks a {
    margin-right: 5px;
    margin-left: 25px;
    
    color: yellow;
    text-decoration: underline;
}
 

#winningdiv {
  -webkit-animation:winningAnim 2s; /* Chrome, Safari, Opera */
animation:winningAnim 2s;  
}
  
/* Chrome, Safari, Opera */
@-webkit-keyframes winningAnim
{
0%   { opacity: 0; }  
100% { opacity: 1;  }
}

/* Standard syntax */
@keyframes winningAnim
{
0%   {  opacity: 0; }  
100% {  opacity: 1; }
}
 
  
.top10 {
	padding:0px;
}
.top10 a  {
	border: 0px solid #ccc;
	background-color:transparent;
	padding: 12px;
	margin: 1px;
	display: block;
	float: left;
}
 
.ImageHolder {
 padding: 10px; margin-right: 40px;
}

.VideoItemPlayer {
 float: right; padding: 6px; margin-left: 40px;
}

.TopVideoItemPlayer {
   padding: 10px;
    margin: auto;
}
 

.VideoFullDescription {
  overflow: auto; height: 325px; padding: 5px; border: solid 0px white; float: left;width:512px;margin:auto;margin-bottom: 15px;
}

 #sharethis_section {
        display: block;   
    }

 p {
     color: white;
 }

   #statHeader { 
      font-weight: bold;
      color: white; 
      font-size: 155%;  
    }
#statValue, #totalvideos, #newtoday, #viewedtotal {
    background-color: transparent;
    color: white;
    font-weight: bold;
    font-size: 300%;     
   }

    #sharethis_section {
        display: block;
    }

#topvideoimagedesk {
    margin-top: 15px;
    border: 5px ridge rgba(255,255,255,0.3);
    height: 150px;
    width: 260px;
    margin-top: 10px;
    display: block;
}
#topvideoimagemob {
    margin-top: 15px;
    border: 5px ridge rgba(255,255,255,0.3);
    height: 150px;
    width: 260px;
    margin-top: 10px;
    display: none;
}

#topvideosection { 
    margin: auto;
    padding: auto;
    margin-top: 5px;
    text-align: center;
}

#lasttopvideothumb {
  margin-top:15px;margin-right:15px;border:5px ridge rgba(255,255,255,0.3);height: 220px; width: 380px;margin-top:9px;
}

#topvideothumb {
    float:left;margin-top:15px;margin-right:15px;border:5px ridge rgba(255,255,255,0.3);height: 140px; width: 220px;margin-top:9px;
}

#topchannelthumb {
      float:left;margin-top:15px;margin-right:15px;border:5px ridge rgba(255,255,255,0.3);height: 140px; width: 140px;margin-top:9px;

}

#topplayerthumb {
      text-align: center;border:5px ridge rgba(255,255,255,0.3);height: 110px; width: 140px;

}

 

#topvideochannelinfo {
 font-size: 180%; margin-bottom: 1px;
 line-height: 100%; 
}
     
#winningdiv {
    position: relative; margin: auto; padding: 4px; display: block;  background-color: transparent; background-image: none;max-width:1240px;
}


@media only screen and (max-width:2500px){
 
    .VideoItemPlayer {
        width:60%
    }

    .YTPlayer
	{
	 width:100%;	 
	}

    

    #statHeader {
        font-size: 100%;
    }

    #statValue {
          font-size: 225%;      
    }


}


@media only screen and (min-width:1260px) {
    #rules-desktop {
        display:block;
    } 
    #rules-mobile {

        display:none;

    }
} 
@media only screen and (max-width:1260px) {
    #rules-desktop {
        display:none;
    } 
    #rules-mobile {

        display:block;

    }
} 


@media only screen and (max-width:850px){
  
.VideoItemPlayer {
	  float:none;
	  margin-right: auto;
	  margin-bottom:5px;
    visibility: visible;
    margin-left: 0px;
    width: 100%;
	}
 

.TopVideoItemPlayer {
	  float:none;
	  margin-right: auto;
	  margin-bottom:20px;
    visibility: visible;
	}

.VideoFullDescription{
 width:100%;margin:auto;margin-bottom:40px;
}
	.YTPlayer
	{
	 width:100%;
	    height: 390px;
	}
}
 

header 
{    
    margin:auto;
    width:100%;      
    height:100px;
    background-image: none;
    background-color: transparent;
}

#header1
{
    font-weight:bold;   
    padding:1px;font-size: 250%;text-decoration: none;
    margin-bottom: 5px;
}   
#header2
{
    font-weight:bold;
    font-size:110%;  
}

@media only screen and (max-width:940px) {
 
 

    #winningdiv {
        text-align: left;
    }

    #topvideotitle {
        font-size: 110%; 
    }
    #topvideochannelinfo {
    font-size: 100%;  
    }

    #topchannelthumb {
   height: 90px; width: 90px;margin-top:3px;margin-left: 20px;
}

    #topvideothumb {
   height: 90px; width: 140px;margin-top:3px;margin-left: 20px;
}

    #header1 {
        font-size:200%;
    }
   
}

#header3
{
    font-weight:bold;
    font-size:50%;  
} 


.VideoItemTitle 
{ 
     font-weight:bold;
     font-size:14px;
}
 .VideoItemDesc
 {
   font-size:10px;
   line-height:10px; 
 }
 
.contentBox { 
    border-bottom:1px solid rgba(255,255,255,0.06);
    border-top:1px solid rgba(255,255,255,0.06);
    background-color: rgba(255,255,255,0.04)
}
#contentboxheading {
      font-size:18px;
      font-weight: normal;
      color: white; 
}
 
.player { 
    right: 5px;  
    font-size: 16px;
    color:white;
    font-weight:bold;
}
.channel { 
    right: 5px;  
    font-size: 16px;
    color:white;
    font-weight:bold;
}
.rank { 
    right: 5px;  
    font-size: 12px;
    color:white;
    font-weight:bold;
}
          
#clock { 
    color: yellow;
    padding: 5px;
    font-size: 18px; 
}
#clock span {
    color: white; 
    padding: 5px;
    font-size: 18px; 
}

 
.rank:before {
    content:' Video Rank '
}
 .channel:before {
    content:' Channel Rank '
}
  .player:before {
    content:' Player Rank '
}


          #progress-helper{width:80%;height:25px;border: 0px white solid;margin: 5px;text-align: center;float: none;color:white} 
          #progress-holder{width:80%;height:25px;background:rgba(254, 0, 0, 0.77);border: 1px white solid;margin: 5px;text-align: center;float: none;} 
          .progress{width:0%;height:100%;background:yellow;-webkit-transition: width 1500ms;border-radius:0px}
  
  


  
a {color:White; text-decoration:none} 

  
.BannerGfx 
{ 
    width:100%; 
    top:0px;
    left:0px;
    height: 90px;
    background-image: none;
    background-color: transparent;
}  

#videoplayer {
    
     /***  CSS Rounded Corners  ***/
  border-radius:9px;
  -webkit-border-radius:9px;
  -moz-border-radius:9px;

  /***  CSS Box Shadow  ***/
  /*box-shadow: 1px 2px 1px 2px #181818 ;

  -webkit-box-shadow: 1px 2px 1px 2px #181818 ;

  -moz-box-shadow: 1px 2px 1px 2px #181818 ;*/
    
}
 
 .NavigationBar 
 {
     
    min-width: 800px; 
    width: 100%; 
    height: 50px;
    padding-top: 9px;
    z-index: 9999; 
    margin:0px;
    position: relative;
      
}

.html_carousel {
	padding: 15px 0 15px 40px;
}
.html_carousel div.slide {
	position: relative;
}
.html_carousel div.slide div {
	background-color: rgba(0, 0, 0, 0.6);
	width: 100%;
	display: none;
	position: absolute;
	bottom: 0;
}
.html_carousel div.slide h4 {
	font-size: 35px;
	padding: 30px 0 0 100px;
}
.html_carousel div.slide p {
	font-size: 16px;
	padding: 0 0 30px 100px;
}
.html_carousel div.slide h4, .html_carousel div.slide p {
	color: white;
	margin: 0;
}
.clearfix {
	float: none;
	clear: both;
}

 

 .VideoItemPostDate
 {
  font-size:9px; 
 }
  
    .VideoItemBox {
        width: 280px;
        height:  350px;
    }

    .VideoItem {
        height:275px;
        width: 210px;
        padding: 5px;
        float: left;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        behavior: url(../Common/IE/border-radius.htc);
        border-radius: 5px;
        margin-left: 15px;
        margin-bottom: 15px;
        text-align: center;
    } 
    .VideoItem p {
         font-size:0.7em;
     }

 .crop { height: 255px; width:100%; overflow: hidden;margin-bottom:0px;  background-size: 140% 200%!important; background-repeat: no-repeat; background-color:rgba(0,0,0,0.2);border-top-right-radius:9px;border-top-left-radius:9px;top:2px;left:0px;position:absolute}
.crop img { margin-top:4px;height: 160px;width: 100%;min-width:200px; margin: -13px 0 0 0px; }

@media all and (max-width: 1200px) {
  .crop { height: 255px; width:100%; overflow: hidden;margin-bottom:0px;  background-size: 140% 200%!important; background-repeat: no-repeat; background-color:rgba(0,0,0,0.2);border-top-right-radius:9px;border-top-left-radius:9px;top:2px;left:0px;position:absolute}
.crop img { margin-top:4px;height: 160px;width: 100%;min-width:200px; margin: -13px 0 0 0px; }

     .VideoItemBox {
         width: 380px;
        height:  450px;
 }
     .VideoItem p {
         font-size:21px;
         font-family:arial;
     }

     .VideoItem span {
         font-size:16px;         
         margin-bottom:10px;
         
     }

    .VideoItem {
        height:355px;
        width: 310px;
        padding: 5px;
        float: left;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        behavior: url(../Common/IE/border-radius.htc);
        border-radius: 5px;
        margin-left: 15px;
        margin-bottom: 15px;
        text-align: center;
    }
}


.ChannelItem {
    padding: 5px;
    float: left;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    behavior: url(../Common/IE/border-radius.htc);
    border-radius: 5px;
    margin-left: 15px;
    margin-bottom: 15px;
    text-align: center;
}



.flash {
    -moz-animation: flash 0.95s ease-out;
    -moz-animation-iteration-count: 1;
    -webkit-animation: flash 0.95s ease-out;
    -webkit-animation-iteration-count: 1;
    -ms-animation: flash 0.95s ease-out;
    -ms-animation-iteration-count: 1;
}
@-webkit-keyframes flash {
    0% {
        background-color:none; 
    }
    35% {
        background-color:white; 
    }
    100% {
        background-color:none; 
    }
}
@-moz-keyframes flash {
    0% { 
        background-color:none;
    }
    35% {
        background-color:white; 
    }
    100% { 
        background-color:none;
    }
}
@-ms-keyframes flash {
    0% {
        background-color:none; 
    }
    35% {
        background-color:white; 
    }
    100% {
        background-color:none; 
    }
}
#test {
    display:block;
    width:70%;
    height:300px;
    background:black;
}
 
 

 
#pageloading {
 background-color :Black;
 color:White;
 width:100%;
 height:100%;
 position:fixed;
 left:0px;
 top:0px;
 border:1px solid gray;
 z-index:200;
 padding:20px;
 display:block;
 text-align:center;
 opacity:0.95;
}



.MobilePageBG
{
    background-attachment:scroll;
}

.VideoPlayer 
{   
  position:relative;
  border:0px Groove White;
  background-color:black;
  color:Black;
  margin-top:0px;
  margin-left:50px;
  margin-right:50px;
  padding: 0px;
  float: center;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;  
  behavior: url(../Common/IE/border-radius.htc); 
  border-radius: 3px; 
  margin-bottom:0px;
}
 
#entirescreen {
    width: 100%;
    height: 100%;
}

#loading 
{
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;  
   behavior: url(../Common/IE/border-radius.htc); 
   border-radius: 5px; 
}

h3 
{
   font-size:12px;
   color:Black;
   margin:5px;
}

h4 
{
   font-weight:bold;
   font-size:15px;
   line-height:18px;
   margin:0px;
   margin-top:11px;
   margin-bottom:0px;
   padding:0px;
}

p 
{
   font-size:11px;
   margin:5px;
}
  
 .PlayImage 
 {
    position:absolute;
    float:right; 
    position:absolute; 
    border:0px;
} 

.videoStats 
{
    font-size:10px;
}
  
.searchButton 
{ 
            height:18px;
		    padding:0px;				 
		    margin:0px;
		    margin-top:0px;
}			
		
@media all and (max-width: 800px)   {	 
#searchCriteria  
{   
	            
                width:80%;                
}	
}
@media all and (min-width: 801px)   {	 
#searchCriteria  
{  
	            
                width:150px;                   
}	
}
   
   

.recentVideos
{   
    background-repeat:repeat; 
 
  position:relative;
  top:-5px;
  
  
  background-color:#111111;
  color:White;
  margin:2px;
  padding: 2px;
  float: left;
  
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;  
  behavior: url(../Common/IE/border-radius.htc); 
  border-radius: 2px; 
  margin-bottom:2px;
  border: 4px solid #030303;
  
  
  overflow:hidden;
}

.PlayImage:hover
{
        animation-name: playIconFrames;
animation-duration: 0.7s;
transform-origin:50% 50%;
animation-iteration-count: infinite;
animation-timing-function: linear;

-moz-animation-name: playIconFrames;
-moz-animation-duration: 0.7s;
-moz-transform-origin:50% 50%;
-moz-animation-iteration-count: infinite;
-moz-animation-timing-function: linear;

-webkit-animation-name: playIconFrames;
-webkit-animation-duration: 0.7s;
-webkit-transform-origin:50% 50%;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear; 
 
}

.MenuSpacer {
    height:95px;    
}

.realtimeview {
    border: 3px ridge rgba(255, 255, 255, 0.3); width: 110px; height: 55px
}

  @import url(http://fonts.googleapis.com/css?family=Montserrat:400,700);
#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a,
#cssmenu #menu-button {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  line-height: 1;
  display: block;
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#cssmenu:after,
#cssmenu > ul:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
#cssmenu #menu-button {
  display: none;
}
#cssmenu {
  font-family: Montserrat, sans-serif;
  background: black;
  position:fixed;
  visibility:hidden; 
}
#cssmenu > ul > li {
  float: left;
}
#cssmenu.align-center > ul {
  font-size: 0;
  text-align: center;
}
#cssmenu.align-center > ul > li {
  display: inline-block;
  float: none;
}
#cssmenu.align-center ul ul {
  text-align: left;
}
#cssmenu.align-right > ul > li {
  float: right;
}
#cssmenu > ul > li > a {
  padding: 17px;
  font-size: 12px;
  letter-spacing: 1px;
  text-decoration: none;
  color: black;
  font-weight: 700;
  text-transform: uppercase;
}
#cssmenu > ul > li:hover > a {
  color: red;
}
#cssmenu > ul > li.has-sub > a {
  padding-right: 30px;
}
#cssmenu > ul > li.has-sub > a:after {
  position: absolute;
  top: 22px;
  right: 11px;
  width: 8px;
  height: 2px;
  display: block;
  background: #dddddd;
  content: '';
}
#cssmenu > ul > li.has-sub > a:before {
  position: absolute;
  top: 19px;
  right: 14px;
  display: block;
  width: 2px;
  height: 8px;
  background: #dddddd;
  content: '';
  -webkit-transition: all .25s ease;
  -moz-transition: all .25s ease;
  -ms-transition: all .25s ease;
  -o-transition: all .25s ease;
  transition: all .25s ease;
}
#cssmenu > ul > li.has-sub:hover > a:before {
  top: 23px;
  height: 0;  color: red;
}
#cssmenu ul ul {
  position: absolute;
  left: -9999px;
}
#cssmenu.align-right ul ul {
  text-align: right;
}
#cssmenu ul ul li {
  height: 0;
  -webkit-transition: all .25s ease;
  -moz-transition: all .25s ease;
  -ms-transition: all .25s ease;
  -o-transition: all .25s ease;
  transition: all .25s ease;
}
#cssmenu li:hover > ul {
  left: auto;  color: red;
}
#cssmenu.align-right li:hover > ul {
  left: auto;
  right: 0;  color: red;
}
#cssmenu li:hover > ul > li {
  height: 35px;  color: red;
}
#cssmenu ul ul ul {
  margin-left: 100%;
  top: 0;
}
#cssmenu.align-right ul ul ul {
  margin-left: 0;
  margin-right: 100%;
}
#cssmenu ul ul li a {
  border-bottom: 1px solid rgba(150, 150, 150, 0.15);
  padding: 11px 15px;
  width: 170px;
  font-size: 12px;
  text-decoration: none;
  color: black;
  font-weight: 400;
  background: #333333;
}
#cssmenu ul ul li:last-child > a,
#cssmenu ul ul li.last-item > a {
  border-bottom: 0;
}
#cssmenu ul ul li:hover > a,
#cssmenu ul ul li a:hover {
  color: red;
}
#cssmenu ul ul li.has-sub > a:after {
  position: absolute;
  top: 16px;
  right: 11px;
  width: 8px;
  height: 2px;
  display: block;
  background: #dddddd;
  content: '';
}
#cssmenu.align-right ul ul li.has-sub > a:after {
  right: auto;
  left: 11px;
}
#cssmenu ul ul li.has-sub > a:before {
  position: absolute;
  top: 13px;
  right: 14px;
  display: block;
  width: 2px;
  height: 8px;
  background: #dddddd;
  content: '';
  -webkit-transition: all .25s ease;
  -moz-transition: all .25s ease;
  -ms-transition: all .25s ease;
  -o-transition: all .25s ease;
  transition: all .25s ease;
}
#cssmenu.align-right ul ul li.has-sub > a:before {
  right: auto;
  left: 14px;
}
#cssmenu ul ul > li.has-sub:hover > a:before {
  top: 17px;
  height: 0;
}
@media all and (max-width: 768px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
    
      .realtimeview {
    border: 3px ridge rgba(255, 255, 255, 0.3); width: 90%; height: 255px;margin-top:10px;
}

    #statValue, #totalvideos, #newtoday, #viewedtotal { 
    font-size: 400%;   
   }

    .statBox{
        display:block;
        left:unset;
        float:none;
        width:100%;
        padding-top:5px;
        padding-bottom:5px;
    }

    .MenuSpacer {
    height:50px;    
}
    
    .BannerGfx {
        visibility:hidden;
    }

    .desktopmenu {
         visibility:hidden;
    }
    
    #cssmenu {
    width: 100%;
     visibility:visible;
  }
  #cssmenu ul {
    width: 100%;
    display: none;
  }
  #cssmenu.align-center > ul {
    text-align: left;
  }
  #cssmenu ul li {
    width: 100%;
    border-top: 1px solid rgba(120, 120, 120, 0.2);
  }
  #cssmenu ul ul li,
  #cssmenu li:hover > ul > li {
    height: auto;
  }
  #cssmenu ul li a,
  #cssmenu ul ul li a {
    width: 100%;
    border-bottom: 0;
  }
  #cssmenu > ul > li {
    float: none;
  }
  #cssmenu ul ul li a {
    padding-left: 25px;
  }
  #cssmenu ul ul ul li a {
    padding-left: 35px;
  }
  #cssmenu ul ul li a {
    color: #dddddd;
    background: none;
  }
  #cssmenu ul ul li:hover > a,
  #cssmenu ul ul li.active > a {
    color: red;
  }
  #cssmenu ul ul,
  #cssmenu ul ul ul,
  #cssmenu.align-right ul ul {
    position: relative;
    left: 0;
    width: 100%;
    margin: 0;
    text-align: left;
  }
  #cssmenu > ul > li.has-sub > a:after,
  #cssmenu > ul > li.has-sub > a:before,
  #cssmenu ul ul > li.has-sub > a:after,
  #cssmenu ul ul > li.has-sub > a:before {
    display: none;
  }
  #cssmenu #menu-button {
    display: block;
    padding: 17px;
    color: #dddddd;
    cursor: pointer;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 700;
  }
  #cssmenu #menu-button:after {
    position: absolute;
    top: 22px;
    right: 17px;
    display: block;
    height: 4px;
    width: 20px;
    border-top: 2px solid #dddddd;
    border-bottom: 2px solid #dddddd;
    content: '';
  }
  #cssmenu #menu-button:before {
    position: absolute;
    top: 16px;
    right: 17px;
    display: block;
    height: 2px;
    width: 20px;
    background: #dddddd;
    content: '';
  }
  #cssmenu #menu-button.menu-opened:after {
    top: 23px;
    border: 0;
    height: 2px;
    width: 15px;
    background: #ffffff;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
  }
  #cssmenu #menu-button.menu-opened:before {
    top: 23px;
    background: #ffffff;
    width: 15px;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
  #cssmenu .submenu-button {
    position: absolute;
    z-index: 99;
    right: 0;
    top: 0;
    display: block;
    border-left: 1px solid rgba(120, 120, 120, 0.2);
    height: 46px;
    width: 46px;
    cursor: pointer;
  }
  #cssmenu .submenu-button.submenu-opened {
    background: #262626;
  }
  #cssmenu ul ul .submenu-button {
    height: 34px;
    width: 34px;
  }
  #cssmenu .submenu-button:after {
    position: absolute;
    top: 22px;
    right: 19px;
    width: 8px;
    height: 2px;
    display: block;
    background: #dddddd;
    content: '';
  }
  #cssmenu ul ul .submenu-button:after {
    top: 15px;
    right: 13px;
  }
  #cssmenu .submenu-button.submenu-opened:after {
    background: #ffffff;
  }
  #cssmenu .submenu-button:before {
    position: absolute;
    top: 19px;
    right: 22px;
    display: block;
    width: 2px;
    height: 8px;
    background: #dddddd;
    content: '';
  }
  #cssmenu ul ul .submenu-button:before {
    top: 12px;
    right: 16px;
  }
  #cssmenu .submenu-button.submenu-opened:before {
    display: none;
  }
}