@charset "UTF-8";

@import "reset.css";





/* CSS Document */





/*

	----------------------------

	HTML SELECTORS

	____________________________

*/





body { background: #333; font:14px/21px Helvetica, Arial, sans-serif; color: #333; margin: 0; padding: 0; }

a { color: #ccc; text-decoration: underline; }

a:hover { color: #fb2b2b; }

h1, h2 { font-size: 26px; line-height: 28px; font-weight: normal; letter-spacing: -1px; color: #fff; }

h3 { font-size: 18px; font-weight: normal; margin: 8px 0; }

h4 { font-size: 14px; font-weight: normal; margin: 0; }

h5 { font-size: 12px; font-weight: normal; margin: 0; }

ul { margin-left: 20px; }

ol { margin-left: 36px; }





/*

	----------------------------

	LAYOUT

	____________________________

*/





#wrapper { width: 960px; margin: 0 auto; padding: 48px 0 72px; }

#main { width: 640px; float: left; }

#main > p, #main > div { margin-left: 7px; }

#sidebar { width: 280px; float: right; }

#sidebar ol { margin: 12px 0 12px 22px; }

/*

	----------------------------

	PAGE/SECTION SPECIFIC

	____________________________

*/





#video-controls { width: 172px; height: 33px; background-color: #f1f1f1;
position: fixed;
bottom: 0;
left: 45%;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;}

#video-controls a { color: #ddd; text-decoration: underline; width:24px; height:24px; float:left; margin:5px; z-index:11; position:relative; }
#video-controls > div { width:20px; height:9px; position: absolute; left: 74px;top: -9px;background-color: #f1f1f1; z-index:10;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
#video-controls > div:hover { background-color:#C1C1C1; cursor:pointer;}





/*

	----------------------------

	UTILITY CLASSES

	____________________________

*/


.play { background-image:url(../media/play.png);}
.pause { background-image:url(../media/pause.png);}
.volume-up { background-image:url(../media/volumeup.png);}
.volume-down { background-image:url(../media/volumeupdown.png);}
.mute { background-image:url(../media/mute.png);}



.clearfix:before,

.clearfix:after {

    content: " "; /* 1 */

    display: table; /* 2 */

}



.clearfix:after {

    clear: both;

}