/* CSS Template by Juuce Interactive ©2008 
   Author: Samuel Larcher
*/   




/* ----------------  INITIAL START ------------- */

* { margin: 0px; padding: 0px;}

h1 { padding-bottom: 10px;}
h2 { padding-bottom: 7px;}
h3, h4, h5 { padding-bottom: 5px;}
p, ul { padding-bottom: 10px; }
img { border: none !important; }

form label button { cursor: pointer; cursor: hand; }

ul li { list-style: none; }

/* ----------------  INITIAL END ------------- */




/* ----------------  FONT  ------------- */

h1 { font: normal bold 16px Arial, Helvetica, sans-serif; color: white; }
h2 { }
h3 { font: normal bold 12px Arial, Helvetica, sans-serif; color: #cdcdcd; }
h3 a { color: #c60000; }
h4 { }
a:link, a:visited { text-decoration: none; }
a:hover, a:active { text-decoration: underline; }

/* ----------------  BASICS  ------------- */

body { background: black url(/images/design_2009-04/basics/bg_top.jpg) center -90px no-repeat; }
#bgBottom { background: url(/images/design_2009-04/basics/bg_bottom.jpg) center bottom no-repeat; }
#mainWrapper { width: 869px; margin: 0 auto 0 auto; }
#topWrapper { height: 188px; }
#contentWrapper { background: url(/images/design_2009-04/basics/leftRightCol_bg.gif) center top repeat-y; width: 869px; }
#contentWrapper_fixed { background: url(/images/design_2009-04/basics/leftRightColumn_bottom_fixed.gif) center bottom no-repeat; width: 869px; padding-bottom: 13px; }
#leftColumn { width: 172px; float: left; font: normal normal 11px Arial, Helvetica, sans-serif; color: #595959; line-height: 12px; padding-bottom: 145px;  }
#centerColumn { width: 504px; float: left; margin-left: 10px; font: normal normal 11px Arial, Helvetica, sans-serif; color: #cdcdcd; background: black url(/images/design_2009-04/basics/centerColumn_bottom_bg.jpg) left bottom no-repeat; }
#rightColumn { width: 172px; float: right; font: normal normal 11px Arial, Helvetica, sans-serif; color: #595959; line-height: 12px; }
#leftColumn a, #rightColumn a { color: #b00004; }
#featureSlide { border: 1px solid #686868; border-top: none; height: 196px; overflow: hidden; position: relative; }



/* ----------------  BOXES FEATURED CONTAINER  ------------- */
#logo { background: url(/images/design_2009-04/basics/logo_bg.gif) left top no-repeat; width: 182px; height: 188px; display: block; }
#logoImage { display: block; position: absolute; margin-left: -10px; margin-top: 70px; }
#logoImage img { border: none; }
#googleBanner_top { width: 696px; height: 94px; position: absolute; margin-top: -158px; margin-left: 173px; z-index: 100; background: url(/images/design_2009-04/basics/googleBanner.gif) right top no-repeat;  }
#googleBanner_bottom { height: 93px; margin-top: 10px; text-align:center;}


#doll { background: url(/images/design_2009-04/basics/doll.png) left top no-repeat; width: 237px; height: 186px; position: absolute; z-index: 50; margin-left: 699px; margin-top: 125px; }

#leftColumn .header { background: url(/images/design_2009-04/basics/header_general.jpg) left top no-repeat; height: 29px; padding: 14px 0 0 12px; overflow: hidden; }

#box_1_1, #box_1_2, #box_1_3, #box_2_1, #box_2_2, #box_2_3, .centerBox { clear: both !important; }


/* ----------------  BOX 1_1  ------------- */
#box_1_1 .header { background: url(/images/design_2009-04/column_boxes/box_1_1/header.jpg) left top no-repeat; height: 28px; padding: 8px 0 0 12px; overflow: hidden; }
#box_1_1 .boxContent { background: url(/images/design_2009-04/column_boxes/box_1_1/bg.jpg) left top no-repeat; padding: 60px 10px 0 15px;  }
#box_1_1 ul li { padding: 8px 0 8px 0; background: url(/images/design_2009-04/basics/column_spacer.gif) left bottom repeat-x; }
#leftColumn a.forum-username {color:#595959;}

/* ----------------  BOX 1_2  ------------- */
#box_1_2 .boxContent { background: url(/images/design_2009-04/column_boxes/box_1_2/bg.jpg) left top no-repeat; padding: 60px 10px 0 25px;  }
#box_1_2 strong { margin-left:3px; }
#box_1_2 ul { margin-top:5px; }
#box_1_2 ul li { padding: 0 0 5px 0; }
#box_1_2 ul li a { text-decoration: underline; color: #595959; }
#box_1_2 ul li a:hover { text-decoration: none; color: #b00004; }

/* ----------------  BOX 1_3  ------------- */
#box_1_3 .boxContent { background: url(/images/design_2009-04/column_boxes/box_1_3/bg.jpg) left top no-repeat; padding: 60px 10px 0 15px;  }
#box_1_3 .boxContent  { padding: 60px 10px 0 25px; }
#box_1_3 .boxContent span { font-weight: bold; color: #b00004; }
#box_1_3 ul li { padding: 0 0 5px 0; }
#box_1_3 ul li a { text-decoration: none; color: #595959; }
#box_1_3 ul li a:hover { text-decoration: underline; color: #b00004; }

/* ----------------  BOX 1_4  ------------- */
#box_1_4 { position: absolute; bottom: 0; width: 172px; }
#box_1_4 .header { background: url(/images/design_2009-04/column_boxes/box_1_4/header.jpg) left top no-repeat; height: 27px; padding: 16px 0 0 12px; overflow: hidden; }
#box_1_4 .boxContent  { background: url(/images/design_2009-04/column_boxes/box_1_4/bg.jpg) left top no-repeat; height: 88px; padding: 15px 10px 0 15px; }
#box_1_4 .boxContent ul { text-align: right; color: white; font: normal normal 13px Arial, Helvetica, sans-serif; }
#box_1_4 .boxContent ul li { line-height: 14px; }
#box_1_4 .boxContent a { font: normal normal 11px Arial, Helvetica, sans-serif; color: white; display: block; }
#box_1_4 .boxContent a:hover { color: silver; }

/* ----------------  BOX 2_1  ------------- */
#box_2_1 .header { background: url(/images/design_2009-04/column_boxes/box_2_1/header.jpg) left top no-repeat; height: 49px; padding: 8px 0 0 12px; overflow: hidden; }
#box_2_1 .boxContent { padding: 60px 10px 0 15px;  }
#box_2_1 ul li { padding: 6px 0 2px 0; background: url(/images/design_2009-04/basics/column_spacer.gif) left bottom repeat-x; }
#box_2_1 ul li a, #box_2_1 ul li div { padding-bottom: 8px; display: block; }

/* ----------------  BOX 2_2  ------------- */
#box_2_2 .header { background: url(/images/design_2009-04/column_boxes/box_2_2/header.jpg) left top no-repeat; height: 45px; padding: 16px 0 0 12px; overflow: hidden; }
#box_2_2 .boxContent { padding: 0 10px 0 15px;  }
#box_2_2 ul li { padding: 0 0 5px 0; }
#box_2_2 ul li a { text-decoration: underline; }
#box_2_2 ul li a:hover { text-decoration: none; }

/* ----------------  BOX 2_3  ------------- */
#box_2_3 .header { background: url(/images/design_2009-04/column_boxes/box_2_3/header.jpg) left top no-repeat; height: 27px; padding: 16px 0 0 12px; overflow: hidden; }
#box_2_3 .boxContent { background: url(/images/design_2009-04/column_boxes/box_2_3/bg.jpg) left top no-repeat; padding: 60px 10px 0 15px;  }
#box_2_3 .boxContent  { padding: 60px 10px 0 15px; }
#box_2_3 .boxContent .thumbnail { width: 57px; float: left; margin-right: 8px;  }

#centerColumn .header_middle { background: url(/images/design_2009-04/column_boxes/center_top/header_middle.gif) left top repeat-x; height: 36px; }
#centerColumn .centerBox { padding-bottom: 8px; }

/* ----------------  BOX center_top  ------------- */
#box_center_top .header_left { background: url(/images/design_2009-04/column_boxes/center_top/header_left.gif) left top no-repeat; height: 36px; }
#box_center_top .header_right { background: url(/images/design_2009-04/column_boxes/center_top/header_right.gif) right top no-repeat; height: 28px; padding: 8px 0 0 18px; }
#box_center_top .boxContent { padding: 0; }

/* ----------------  BOX center_standard  ------------- */
.centerBox .header_left_centerStandard { background: url(/images/design_2009-04/column_boxes/center_top/header_left_standard.gif) left top no-repeat; height: 36px; }
.centerBox .header_right_centerStandard { background: url(/images/design_2009-04/column_boxes/center_top/header_right_standard.gif) right top no-repeat; height: 28px; padding: 8px 0 0 18px; }
.centerBox .boxContent { padding: 15px 15px 0 20px; }
.centerBox .wrapper { width: 460px; }
.centerBox .wrapper { background: url(/images/design_2009-04/basics/center_col_spacer.gif) left bottom repeat-x; padding-bottom: 5px; padding-top: 5px; }
.centerBox .wrapper a.image { display: block; float: left; margin-right: 10px; border: 1px solid #2f2f2f; }
.centerBox .wrapper a.button { color: #be0101; float: right; } 
.centerBox .mainButton { font: normal bold 13px Arial, Helvetica, sans-serif; color: #be0101; float: right; padding: 10px 10px 10px 0; }
.centerBox .mainButton a { color: white; text-decoration: underline; }
.centerBox .mainButton a:hover { color: #be0101; text-decoration: none; }


/* ----------------  BUTTON AND FORMS  ------------- */

.redButton_middle { background: url(/images/design_2009-04/formsButtons/red_button_middle.gif) left top repeat-x; height: 21px; }
.redButton_left { background: url(/images/design_2009-04/formsButtons/red_button_left.gif) left top no-repeat; height: 21px; }
.redButton_right { background: url(/images/design_2009-04/formsButtons/red_button_right.gif) right top no-repeat; height: 21px; }

.blackButton_middle { background: url(/images/design_2009-04/formsButtons/black_button_middle.gif) left top repeat-x; height: 21px; }
.blackButton_left { background: url(/images/design_2009-04/formsButtons/black_button_left.gif) left top no-repeat; height: 21px; }
.blackButton_right { background: url(/images/design_2009-04/formsButtons/black_button_right.gif) right top no-repeat; height: 21px; }

.redButton_middle a, .blackButton_middle a { display: block; color: white !important; text-decoration: none; text-align: center; padding: 4px 0 4px 0; }
.redButton_middle a:hover, .blackButton_middle a:hover { color: silver !important; }

/* ----------------  MAIN NAVIGATION  ------------- */

#navigation { position: absolute; margin-left: 182px; margin-top: -52px; width: 685px; height: 41px; z-index: 100; }
#navigation li { padding: 0; margin: 0; float: left; }
#navigation li a { float: left; }
#navigation span { display: none; }

#navigation .home { display: block; overflow: hidden; background: url(/images/design_2009-04/navigation/home.gif) left top no-repeat; width: 64px; height: 41px; }
#navigation .home:hover, #navigation .home.selected { background-position: 0px -41px; }

#navigation .news { display: block; overflow: hidden; background: url(/images/design_2009-04/navigation/news.gif) left top no-repeat; width: 52px; height: 41px; }
#navigation .news:hover, #navigation .news.selected { background-position: 0px -41px; }

#navigation .reviews { display: block; overflow: hidden; background: url(/images/design_2009-04/navigation/reviews.gif) left top no-repeat; width: 73px; height: 41px; }
#navigation .reviews:hover, #navigation .reviews.selected { background-position: 0px -41px; }

#navigation .features { display: block; overflow: hidden; background: url(/images/design_2009-04/navigation/features.gif) left top no-repeat; width: 83px; height: 41px; }
#navigation .features:hover, #navigation .features.selected { background-position: 0px -41px; }

#navigation .forum { display: block; overflow: hidden; background: url(/images/design_2009-04/navigation/forum.gif) left top no-repeat; width: 62px; height: 41px; }
#navigation .forum:hover, #navigation .forum.selected { background-position: 0px -41px; }

#navigation .video { display: block; overflow: hidden; background: url(/images/design_2009-04/navigation/video.gif) left top no-repeat; width: 54px; height: 41px; }
#navigation .video:hover, #navigation .video.selected { background-position: 0px -41px; }

#navigation .games { display: block; overflow: hidden; background: url(/images/design_2009-04/navigation/games.gif) left top no-repeat; width: 61px; height: 41px; }
#navigation .games:hover, #navigation .games.selected { background-position: 0px -41px; }

#navigation .photos { display: block; overflow: hidden; background: url(/images/design_2009-04/navigation/photos.gif) left top no-repeat; width: 68px; height: 41px; }
#navigation .photos:hover, #navigation .photos.selected { background-position: 0px -41px; }

#navigation .directory { display: block; overflow: hidden; background: url(/images/design_2009-04/navigation/directory.gif) left top no-repeat; width: 85px; height: 41px; }
#navigation .directory:hover, #navigation .directory.selected { background-position: 0px -41px; }

#navigation .vod { display: block; overflow: hidden; background: url(/images/design_2009-04/navigation/vod.gif) left top no-repeat; width: 83px; height: 41px; }
#navigation .vod:hover, #navigation .vod.selcted { background-position: 0px -41px; }

/* ----------------  FOOTER  ------------- */

#footer { height: 142px; margin-top: 32px; float: right; }
#footer .footer { font: normal bold 12px "Trebuchet MS", sans-serif; color: #888; float: left; padding: 0 20px 0 10px; border-right: 1px solid #252525; }
#footer #f5 { border-right: none; }
#footer .footer li { line-height: 15px; }
#footer .footer a { font: normal normal 11px "Trebuchet MS", sans-serif; color: #555; text-decoration: underline; }
#footer .footer a:hover { text-decoration: none; }
#footer .footerSpecialbit { float: left; }
#footer .footerSpecialbit li { font: normal normal 11px "Trebuchet MS", sans-serif; color: #757575; padding-left: 100px; width: 100px; }
#footer .footerSpecialbit li a { font: normal normal 11px "Trebuchet MS", sans-serif; color: #252525; display: block; background: url(/images/design_2009-04/basics/juuce_logo.gif) right bottom no-repeat; height: 30px; }



/* ----------------  SPECIALS  ------------- */

.left { float: left; }
.right { float: right; }
.clear { clear: both; }

.gray { color: #5d5d5d; }

.fontSize10 { font-size: 10px; }
.fontSize11 { font-size: 11px; }
.fontSize12 { font-size: 12px; }
.fontSize13 { font-size: 13px; }
.fontSize14 { font-size: 14px; }

.bold { font-weight: bold; }
.normal { font-weight: normal; }
.italic { font-style: italic; }
.underline { text-decoration: underline; }

.backgroundYellow { background: yellow; }
.backgroundRed { background: red; }
.backgroundSilver { background: silver; }
.backgroundBlack { background: black; }
.backgroundBlue { background: blue; }
.backgroundWhite { background: white; }

.padding_B_5px { padding-bottom: 5px; }
.padding_B_10px { padding-bottom: 10px; }
.padding_B_15px { padding-bottom: 15px; }
.padding_L_5px { padding-left: 5px; }
.padding_L_10px { padding-left: 10px; }
.padding_L_15px { padding-left: 15px; }

.posRelative { position: relative; }

.displayNone, .hide { display: none; }


#bigImageLeftOn { display:block; width: 50px; height: 196px; background: url(/images/design_2009-04/basics/bigImageLeftOn.png); position: absolute; left: 0px; z-index: 100; cursor: pointer; }
#bigImageLeftOff { display:block; width: 50px; height: 196px; background: url(/images/design_2009-04/basics/bigImageLeftOff.png); position: absolute; left: 0px; z-index: 100; cursor: pointer;  }
#bigImageRightOn { display:block; width: 50px; height: 196px; background: url(/images/design_2009-04/basics/bigImageRightOn.png); position: absolute; right: 0px; z-index: 100; cursor: pointer;  }
#bigImageRightOff { display:block; width: 50px; height: 196px; background: url(/images/design_2009-04/basics/bigImageRightOff.png); position: absolute; right: 0px; z-index: 100; cursor: pointer;  }

.mouseout #bigImageLeftOff {display:none;}
.mouseout #bigImageRightOff {display:none;}