video{ 
/* video border */ 
border: 1px solid #ccccc; padding: 20px; margin: 0px; border-radius: 20px; 
/* tranzitionstransitions applied to the vodeovideo element */ 
-moz-transition: all 1s ease-in-out; 
-webkit-transition: all 1s ease-in-out; 
-o-transition: all 1s ease-in-out; 
-ms-transition: all 1s ease-in-out; transition: all 1s ease-in-out; } 
/* background color and gradient */ 
video, #start, #stop, #pause, #plus, #minus, #mute { 
/* background color */ 
background-color: <p>#8FF268</p>; 
/* background gradient */ 
background-image: 
linear-gradient(top, #fff, #8FF268); background-image: 
-moz-linear-gradient(top, #fff, #8FF268); background-image: -webkit-linear-gradient(top, #fff, #fcc); background-image: -o-linear-gradient(top, #fff, #8FF268); background-image: 
-ms-linear-gradient(top, #fff, #8FF268); } 
/* shadows */ 
video, #start, #stop, #pause, #plus, #minus, #mute { box-shadow: 0 0 10px #ccc; } video:hover, video:focus, #start:hover, #stop:hover, #pause:hover, #plus:hover, #minus:hover, #mute:hover { 
/* glow */ 
box-shadow: 0 0 20px #8FF268; } #controls { display: none; margin: 10px 30px; } 
/* style for buttons */ 
#start, #stop, #pause, #plus, #minus, #mute { border: 1px solid #ccc; padding: 5px; border-radius: 10px; width: 60px; margin: 0 10px 0 0; } body{ 
/* color tranzitiontransition */ 
-webkit-transition: background-color 1s ease-in-out; -moz-transition: background-color 1s ease-in-out; -o-transition: background-color 1s ease-in-out; -ms-transition: background-color 1s ease-in-out; transition: background-color 1s ease-in-out; 
/* initial color */ 
background-color: #1BC06E; } #butterfly{ position: absolute; left: 0; top: -6px; background-image: url(butterfly.png); width: 40px; height: 40px; } #progressbar{ display: none; /* size */ 
width: 500px; height: 20px; 
/* position and border */ 
position: relative; border: 1px solid #ccc; margin: 10px; border-radius: 20px; 
/* background color */ 
background-color: #cccccc; 
/* background gradient */ 
background-image: linear-gradient(top, #fff, #ccc); background-image: -moz-linear-gradient(top, #fff, #ccc); background-image: -webkit-linear-gradient(top, #fff, #fcc); background-image: -o-linear-gradient(top, #fff, #ccc); background-image: -ms-linear-gradient(top, #fff, #ccc); 
/* shadow */ 
box-shadow: 0 0 10px #ccc; } #loadingprogress{ 
/* border */ 
border-radius: 20px; 
/* initial size */ 
height: 20px; width: 0; 
/* background color */ 
background-color: #9acd00; 
/* background gradient */ 
background-image: linear-gradient(top, #ffffff, #9acd00); background-image: -moz-linear-gradient(top, #ffffff, #9acd00); background-image: -webkit-linear-gradient(top, #ffffff, #9acd00); background-image: -o-linear-gradient(top, #ffffff, #9acd00); background-image: -ms-linear-gradient(top, #ffffff, #9acd00); }