/*** General stylesheet for every pages ***/

/* Reset CSS and general stuff */
*{margin:0;padding:0}iframe,a img,fieldset,form,table{border:0}h6,h5,h4,h3,h2,h1,caption,th,td{font-size:100%;font-weight:normal}dd,dt,li,dl,ol,ul{list-style:none}legend{color:#000}button,select,textarea,input{font:100% serif}table{border-collapse:collapse}caption,th,td{text-align:left}
html { overflow:-moz-scrollbars-vertical; }
.clear { clear: both; font-size: 0; height: 0; line-height: 0; }
a { outline: none; }
* { zoom: 1; }

h1, h2 { position: absolute; left: -10000px; }

body { font: 12px Arial, Helvetica, sans-serif; }
select { font: 12px Arial, Helvetica, sans-serif; }

/* Show category dropdown only in index and movies sections */
#categories_form { display: none; }
#page-movies #categories_form,
#page-index #categories_form { display: block; }


/*** General container ***/
#container { position: relative; width: 980px; margin: 0 auto; z-index: 0; }

/*** Toolbar ***/
#container #toolbar { position: absolute; top: 0; width: 960px; height: 17px; padding: 10px; text-align: right; font: 12px Arial, Helvetica, sans-serif; }
#container #toolbar { background: #999; }
#container #toolbar form { float: left; }

/*** Flags ***/
#container #flags { position: absolute; display: none; top: 35px; right: 164px; padding: 0 7px 5px; background: #999; width: 50px; z-index: 100; }
#container #flags img { position: relative; top: 5px; }
#container #flags p { margin: 0 0 5px 0; }
#container #flags a { text-decoration: none; }

/*** Header-Index ***/
#container #global #header { position: absolute; top: 37px; left: 0; width: 980px; height: 400px; }
#container #global #header #anim-header { position: absolute; bottom: 0; left: 57px; width: 490px; height: 130px; }
#container #global #header #join-header { position: absolute; width: 153px; height: 104px; top: 290px; left: 712px; }
#container #global #header #join-header strong { position: absolute; left: -10000px; }
#container #global #header #disco { position: absolute; width: 150px; height: 124px; top: 1px; left: 397px; }
#container #global #header #header-trailer { position: absolute; width: 248px; height: 174px; top: 69px; right: 85px; }

#container #global #header-template { position: absolute; top: 0px; left: 0; width: 980px; height: 400px; background: url(../images/header-template.jpg) 0 0 no-repeat; }


/*** Menu ***/
#container .menu { position: absolute;  top: 437px; left: 0; width: 960px; height: 39px; padding: 0 10px; z-index: 0; }
#container .menu li { position: relative; float: left; }
#container .menu li a { display: block; float: left; height: 32px; padding: 2px 28px 3px 25px; font-size: 12px; line-height: 32px; font-weight: bold; text-align: center; text-decoration: none; }
#container .menu li a span { position: absolute; top: 0; right: 0; width: 5px; height: 39px; }
#container .menu li a:hover span { background: none!important; }



/*** Global ***/
#container #global { padding: 519px 0 0; }

/*** Breadcrumbs ***/
#container #global .breadcrumbs { position: absolute; top: 483px; left: 0; width: 968px;  padding: 5px; text-transform: capitalize;}
#container #global .breadcrumbs { border: 1px solid #999; }
#container #global .breadcrumbs form { float: right; }

/*** Modules ***/
#container #global .module { margin: 0 0 25px; }
#container #global .module h3 { padding: 5px 10px; font-weight: bold; font-size: 14px; text-transform: uppercase; }
#container #global .module h3 { /* border: 1px solid #999; */} 
#container #global .module h4 { font-size: 15px; font-weight: bold; }
#container #global .module .module-content { padding: 10px; }
#container #global .module .module-content { /* border: 1px solid #999; */ border-top: none; }

#container #global .textmodule { padding: 55px 40px; }
#container #global .text-content p { margin: 0 0 12px; }

/*** Latest Update on Home ***/
#container #global #latest-update { height: 272px; padding: 1px 0; }
#container #global #latest-update .module-content { position: relative; padding: 10px 10px 10px 338px; height: 220px; }
#container #global #latest-update #latest-screenshot { position: absolute; top: 10px; left: 10px; }
#container #global #latest-update #latest-screenshot-btn { position: absolute; display: block; top: 10px; left: 10px; width: 307px; height: 224px; background: url(../images/playbutton.png) center center no-repeat; }
* html #container #global #latest-update #latest-screenshot-btn { background: url(../images/playbutton.gif) center center no-repeat; }
#container #global #latest-update h4 { padding: 0 0 6px; margin: 0 0 10px; }
#container #global #latest-update h4 a { font-size: 18px; text-decoration: none; }
#container #global #latest-update h4 a:hover { text-decoration: underline; }
#container #global #latest-update #latest-update-description { position: relative; float: left; display: inline; width: 410px; margin: 0 30px 0 0; text-align: justify; }
#container #global #latest-update #latest-update-description div { width: 400px; padding: 0 10px 0 0; height: 145px; overflow: auto; }
#container #global #latest-update #latest-update-info { position: relative; float: left; display: inline; width: 185px; }
#container #global #latest-update #latest-update-specs { position: absolute; bottom: 5px; width: 620px; height: 29px; line-height: 29px; }
#container #global #latest-update #latest-update-specs li { display: block; float: left; margin: 0 26px 0 0; }
#container #global #latest-update #latest-update-specs .last-spec { margin: 0; }
#container #global #latest-update p { margin: 0 0 5px; line-height: 18px; }

/*** Previous Updates on Home ***/
#container #global #previous-updates { position: relative; margin: 0 0 25px; padding-bottom: 25px; }
#container #global { position: relative; padding-bottom: 26px; }
#container #global .scene-box { float: left; display: inline; width: 249px; margin: 0 0 30px 0; line-height: 20px; }
#container #global .last-scene-box { width: 201px; }
#container #global .scene-box h4 { margin: 3px 0 0; font-size: 12px; }
#container #global .scene-box h4 a { text-decoration: none; }
#container #global .view-button { position: absolute; bottom: 0; width: 965px; height: 25px; line-height: 25px; padding: 0 13px 0 0; font-weight: bold; text-align: right; text-decoration: none; }

/*** Navbar ***/
#container #global .navbar { margin: 15px 0; }

/*** Clip ***/
#container #global .clip-info { float: left; display: inline; width: 388px; }
#container #global .clip-info p { margin: 0 0 10px; }
#container #global .clip-info .module-content { min-height: 250px; }
* html #container #global .clip-info .module-content { height: 250px; } /* IE6 is dumb */
#container #global .clip-info .clip-description { padding: 10px; height: 150px; overflow: auto; }

#container #global .clip-options { float: left; display: inline; width: 240px; }
#container #global .clip-options h3 { border-left: none; border-right: none; }
#container #global .clip-options .module-content { border-left: none; border-right: none; min-height: 250px; }
* html #container #global .clip-options .module-content { height: 250px; } /* IE6 is dumb */
#container #global .clip-options .button { display: block; padding: 3px; margin: 0 0 10px 0; text-align: center; color: #000; text-transform: uppercase; text-decoration: none;  }
#container #global .clip-options .button strong { display: block; font-weight: bold; font-size: 14px; }
#container #global .clip-options .button { border: 1px solid #999; background: #999; }

#container #global .clip-trailer { float: left; display: inline; width: 342px; }
#container #global .clip-trailer .module-content { min-height: 250px; }
* html #container #global .clip-trailer .module-content { height: 250px; }
#container #global .clip-trailer #flash-trailer { width: 320px; height: 240px; background: #999; }

#container #global #clip-screenshot-holder { position: relative;  zoom: 1; }
#container #global .clip-screenshot { float: left; display: inline; width: 320px; height: 238px; }
#container #global .clip-screenshot img { border: 1px solid #333; }
#container #global .clip-screenshot-last { width: 307px; }

/*** Banner ***/
.banner { text-align: center; margin: 0 0 25px; }

/*** Footer ***/
#footer { padding: 30px 100px 30px 0; text-align: center; }
#footer a { color: #fdc745; }
#footer ul { text-align: center; }
#footer ul li { display: inline; }
#footer #footer-primary { margin: 0 0 20px; }
#footer #footer-secondary a { color: #919191; }

/*** Section ***/
#container #global .section { position: relative; width: 920px; height: 73px; margin: 0 auto 25px; padding: 0 60px 0 0; font-size: 18px; line-height: 72px; text-transform: uppercase; text-align: right; }
#container #global .section strong { font-weight: normal; font-size: 26px; text-transform: uppercase; }

/*** Timelines **/
#container #global #timeline dl { float: left; margin: 0 0 30px; }
#container #global #timeline dl dt { float: left; display: inline; width: 238px; height: 22px; padding: 0 0 0 17px; font-size: 14px; font-weight: bold; }
#container #global #timeline dl dd { float: left; display: inline; width: 600px; }
#container #global #timeline dl dd ul li { margin: 0 0 12px; line-height: 20px; }
#container #global #timeline dl dd ul li strong { color: #16bffb; text-transform: capitalize; }
#container #global #timeline .ephemeris { }



/** Star Rating **/

.star-rating { position: relative; margin: 1px 20px 0 0; }
.star-rating-wrap{ white-space: nowrap; }
.star-rating,
.star-rating a:hover,
.star-rating a:active,
.star-rating a:focus,
.star-rating li.current-rating{ background: url(images/star-rating.gif) left -1000px no-repeat;  }
/* Broche à foin is here */
.star-rating { width:75px !important; height:25px !important; overflow:hidden !important; list-style:none; padding:0 !important; background-position: left top; display: block; }
/* Broche à foin ends here */
.star-rating li{ display: inline; background: none !important; border: 0 !important; }
ul.star-rating a,
ul.star-rating li.current-rating{ position:absolute; top:0; left:0; text-indent:-9999px; height:25px !important; line-height:25px !important; outline:none; overflow:hidden; border: none; padding: 0 !important; margin: 0 !important; }
.star-rating a:hover,
.star-rating a:active,
.star-rating a:focus{ background-position: left bottom; }
.star-rating a.rate-stars-1{ width:10%; z-index:11; }
.star-rating a.rate-stars-2{ width:20%; z-index:10; }
.star-rating a.rate-stars-3{ width:30%; z-index:9; }
.star-rating a.rate-stars-4{ width:40%; z-index:8; }
.star-rating a.rate-stars-5{ width:50%; z-index:7; }
.star-rating a.rate-stars-6{ width:60%; z-index:6; }
.star-rating a.rate-stars-7{ width:70%; z-index:5; }
.star-rating a.rate-stars-8{ width:80%; z-index:4; }
.star-rating a.rate-stars-9{ width:90%; z-index:3; }
.star-rating a.rate-stars-10{ width:100%; z-index:2; }
.star-rating li.current-rating{ z-index:1; background-image: url(images/star-rating.gif) !important; background-position: left center !important; background-repeat: no-repeat;}


/*** Columns in module for listed content ***/
#container #global .module .module-content .col-title { display: inline; float: left; width: 300px; margin: 5px 10px 5px 5px; font-weight: bold; }
#container #global .module .module-content .col-content { display: inline; float: left; text-align: left; margin: 5px; }

#container #global .loginbox { width: 680px; margin: 20px 0 30px 130px; padding: 20px 20px; background: #333; }
#container #global .loginbox h2 { margin: 0 0 20px 0px; }
#container #global .loginbox p { text-align: center; margin: 0 0 15px; }
#container #global .loginbox strong { display: block; } 
#container #global .loginbox input { font-family: Arial, Helvetica, sans-serif; padding: 5px; }