/**
   COMMON.WONKA.CSS
   
   Created by Rafael Vega on 2010-02-04.
   Copyright 2010 Studiocom. All rights reserved.
**/

/** RESET **/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
body {line-height:1.5;}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;}
table, td, th {vertical-align:middle;}
blockquote:before, blockquote:after, q:before, q:after {content:"";}
blockquote, q {quotes:"" "";}
a img {border:none;}
a{outline:0 none;}

/** Layout **/
body{background:#1A0B34;}
#bg_image{background:url('/img/background.jpg') top center no-repeat}
#container{width:980px;margin:0px auto;padding:0px;}
#content{margin:15px auto 0px; position:relative;}
#Homepage #bg_image #container #content{margin:0px auto 0px;} 
#Products #bg_image #container #content{margin:-45px auto 0px;} 
#VideoRoom #bg_image #container #content{margin:-30px auto 0px;} 
#Events #bg_image #container #content{margin:43px auto 0px;} 
#WhatsNew #bg_image #container #content{margin:-35px auto 0px;} 
#wonka_golden_ticket #bg_image #container #content{margin:45px auto 0px;} 

/** Typography **/
html{font-size:11px;}
body{color:#FFF;font-family:"Trebuchet MS", Helvetica, sans-serif;}
input{color:#946BC5;font-family:"Trebuchet MS", Helvetica, sans-serif; font-size:13px; letter-spacing:-1px;}
.validation_error, .validation_ok, .validation_info{font-size:12px; letter-spacing:-1px;}
p {margin:0 0 15px; line-height:1.0; color:#946BC5; font-size:14px;}
strong {color:#FFF;}
label{font-size:14px; letter-spacing:-1px;}
h1{font-size:18px; margin-bottom:15px; text-align:center;}
h2{font-size:14px; margin-bottom:15px; color:#FF6600;}

/** Util **/
span.go_away{position: absolute; left: -15000px}
.center{text-align:center;}
.clear{clear:both;}
.float_right{float:right;}
.align_right{text-align:right;}

/** Footer **/
#footer{
	height:94px;
	width:980px;
	background:url('/img/footer_bg.png') no-repeat;
	color:#946BC5;
	font-size:10px; 
	text-align:center;
	position:relative; bottom:60px;
	}
#Products #bg_image #container #footer{bottom:20px;} 
#Homepage #bg_image #container #footer{bottom:30px;} 
#wonka_golden_ticket #bg_image #container #footer{bottom:5px;}   
#Events #bg_image #container #footer {bottom:80px;}  
#Events #bg_image #container #footer p {color:#ffffff;}  
#Events #bg_image #container #footer p a {color:#ffffff;} 
#footer p{font-size:11px;}
#footer #footer_1{padding-top:29px;}
#footer #footer_2{margin-top:16px;}
#footer #truste{margin-bottom:30px;}
#footer_1 a{color:#946BC5; text-decoration:none;}
#footer_1 a:hover{color:#F6F;}

/** MENU **/
#header{position:relative; top:44px; z-index:1}
#header #menu{height:83px;width:438px;background:url('/img/menu_bg.png'); margin-left:40px;}
#main_menu{width:310px; position:absolute; top:25px; left:140px; line-height:1.0;}
#main_menu,#main_menu *{margin:0;padding:0;list-style:none;}
#hat_link{/*border:1px solid red;*/ width:95px; height:85px; display:block;}

/* first level elements */
#main_menu li:hover{visibility:inherit;}
#main_menu li{float:left;position:relative;margin-left:1px;height:34px;padding-top:11px}
#main_menu li:first-child{margin-left:0px;}
#main_menu li:hover{background:url('/img/arrow_down.png') top center no-repeat;}
#main_menu a{display:block;position:relative;}
#main_menu li a{height:19px;}

/* replace text in first level with images in sprite*/
#main_menu li a span{position: absolute; left: -15000px}
#main_menu_whats_good{width:65px;background:url('/img/menu_sprite.png') 234px 2px;}
li:hover #main_menu_whats_good{background-position:234px 22px;}
#main_menu_whats_happening{width:90px;background:url('/img/menu_sprite.png') 344px 2px;}
li:hover #main_menu_whats_happening{background-position:344px 22px;}
#main_menu_whats_new{width:62px;background:url('/img/menu_sprite.png') 0px 2px;}
li:hover #main_menu_whats_new{background-position:0px 22px;}
#main_menu_create{width:39px;background:url('/img/menu_sprite.png') 40px 2px;}
li:hover #main_menu_create{background-position:40px 22px;}
#main_menu_music{width:36px;background:url('/img/menu_sprite.png') 149px 2px;}
li:hover #main_menu_music{background-position:149px 22px;}

/* second level elements*/
#main_menu ul{position:absolute;top:-10000px;width:400px;}
#main_menu li:hover ul, #main_menu li.sfHover ul{right:-8px;top:32px;z-index:99;}
#main_menu li li{height:12px; width:100%;  margin:0px 0px 4px 0px; padding:0px;}
#main_menu li li a{color:#FAFAFA; text-decoration:none; height:auto; text-align:right; padding:0px 12px 0px 0px;}
#main_menu li li:hover{background:url('/img/arrow_left.png') 388px 1px no-repeat;}
#main_menu li li a strong{color:#B090C2}

/** Login Form **/
#login{width:407px; height:57px; position:absolute; top:12px; right:40px; background:url('/img/login/login_form_bg.png');}
#login *{font-family:"Trebuchet MS", Helvetica, sans-serif;}
#login form{position:relative;}
#login #login_submit{position:absolute; top:28px; left:324px; width:55px; height:15px; background:url('/img/login/submit.png');}
#login #login_submit:hover, #login #login_submit:focus{background:url('/img/login/submit_hover.png'); outline:0 none; cursor:pointer;}
#login #login_register{display:block; position:absolute; top:44px; left:324px; width:47px; height:12px; background:url('/img/login/register.png');}
#login #login_register:hover, #login #login_register:focus{background:url('/img/login/register_hover.png'); cursor:pointer;}
#login #login_forgot_password{display:block; position:absolute; top:46px; left:227px; width:64px; height:9px; background:url('/img/login/forgot_password.png');}
#login #login_forgot_password:hover, #login #login_forgot_password:focus{background:url('/img/login/forgot_password_hover.png'); cursor:pointer;}
#login #login_remember_me{position:absolute; top:40px; left:86px;}
#login input.text{border:0px none; background:transparent; padding:0px; margin:0px; text-align:center; color:#FFF; width:128px; height:18px; font-size:11px;}
#login #login_email{position:absolute; top:25px; left:59px;}
#login #login_password{position:absolute; top:25px; left:192px;}
#login #login_password_label{position:absolute;top:26px;left:192px;width:128px;display:none;font-size:11px;letter-spacing:-1px;text-align:center;}
#login #login_wait{position:absolute; top:25px; left:328px; background: url('/img/login/wait.png');width: 41px;height: 20px;}
#login .login_error{position:absolute; left:74px; top:60px; width:250px; height:auto; background:none; margin:0px;}
#login .login_error p {color:#FF6600; font-size:11px; padding:0;}

#logged_in{width:282px; height:28px; position:absolute; top:26px; left:688px; background:url('/img/login/logged_in_bg.png');}
#logged_in #sign_out{width:65px; height:16px; position:absolute; top:29px; left:210px; background:url('/img/login/sign_out.png');}
#logged_in #sign_out:hover{background:url('/img/login/sign_out_hover.png');}
#logged_in #welcome{position:absolute; top:13px; left:96px; font-size:12px;}
#logged_in #user_name{color:#ddcae7;}

/** Generic Box **/
.generic_box{margin:15px auto; width:642px;}
.generic_box_top{width:642px;height:27px; background:url('/img/generic_box_top.png');}
.generic_box_middle{width:612px;min-height:407px; background:url('/img/generic_box_middle.png') no-repeat #23103e; padding:0px 15px 15px 15px;}
.generic_box_bottom{width:642px;height:26px; background:url('/img/generic_box_bottom.png');}

#swfContainer{ position:relative; width:100%; height:600px; margin-left:-9%;}