html, body{    
    width: 100%; height: 100%;
    padding: 0; margin: 0;
    position: relative;
    font-size: 62.5%;
    
    font-family: 'Helvetica', 'Verdana', 'Arial', sans-serif;
    background: #023267 url(http://qmjhl.assets.mrx.ca/chicoutimi/images/fr/bg.jpg) top center no-repeat;
	color: #000;
}
body{ font-size: 1em; }

a {
	text-decoration: none;
	color: #002a5c;
	font-weight: bold;
}

/**GENERAL BUTTON STYLE**/
.button, .button_rev, .full_story, .play_video{
    float: left; display: block;
    color: #000;
    padding: 1px 3px;
    width: auto;
	background: #002a5c; 
	color: #FFF;
	text-transform: uppercase;
	font-weight: normal;
	margin: 2px;
}
.button_rev{ 

}

.button img {
	display: none;
}

.button_rev img {
	display: none;
}

.button a, .full_story a, .play_video a{
    color: #fff; text-decoration: none;
	display: block;
	padding-right: 10px;
	background: url(http://ohl.assets.mrx.ca/plymouth/images/en/small-arrow.png) right center no-repeat;
}
.button_rev a{
    color: #FFF !important; text-decoration: none;
	display: block;
	padding-right: 10px;
	background: url(http://ohl.assets.mrx.ca/plymouth/images/en/small-arrow.png) right center no-repeat;
}

/***GENERAL SITE STYLING***/

div.left{ float: left !important;}
div.right{ float: right !important; }

.team_pad{
    width:159px;
}
.rounded{
    -webkit-border-radius: 5px;    /* for Safari */
    -moz-border-radius: 5px;       /* for Firefox */
    border-radius: 5px;
}

.z1{ z-index: 1; }
.z2{ z-index: 2; }
.z3{ z-index: 3; }
.hidden{ display: none; }

.clear{ clear: both; height: 0px; }
.center{ text-align: center; }

.pad8-left{ padding-left: 8px; }
.pad8-right{ padding-right: 8px; }
.pad16-left{ padding-left: 16px; }
.pad16-right{ padding-right: 16px; }
.pad32-left{ padding-left: 32px; }
.pad32-right{ padding-right: 32px; }
.pad40-left{ padding-left: 40px; }
.pad40-right{ padding-right: 40px; }
.pad64-left{ padding-left: 64px; }
.pad64-right{ padding-right: 64px; }
.pad100-left{ padding-left: 100px; }
.pad100-right{ padding-right: 100px; }

.no-margin{ margin: 0 !important; } /*sometimes useful for P elements */
.no-pad{ padding: 0 !important; }
                                     
.pad2-all{ padding: 2px; }
.pad4-all{ padding: 4px; }
.pad6-all{ padding: 6px; }
.pad8-all{ padding: 8px; }
.pad10-all{ padding: 10px; }

.height_spacer-5 { clear: both; height: 5px;  width: 100%; line-height: 0; }
.height_spacer-10{ clear: both; height: 10px; width: 100%; line-height: 0; }
.height_spacer-20{ clear: both; height: 20px; width: 100%; line-height: 0; }

.divider{ border-top: dotted 2px #AAA; width: 100%; margin: 0.4em 0 0.4em 0; }

.no-back{ background: none !important; }
.light-back{ background: #CCC !important; }
.med-back{ background: #AAA !important; }
.dark-back{ background: #666 !important; color: #FFF; }

ul.flat{ margin: 0; padding: 0; }
ul.flat li{
    display: block;
    float: left;
    margin: 0; padding: 0;
}

.xsmall{ font-size: 0.70em !important; }
.small { font-size: 0.80em !important; }
.med   { font-size: 1.00em !important; }
.large { font-size: 1.20em !important; }
.xlarge{ font-size: 1.25em !important; }

.upper { text-transform: uppercase; }
.lower { text-transform: lowercase; }
.strong{ font-weight: bold; }

.debug{  outline: solid 1px red; }
.debug2{ outline: solid 1px green; }

p{
    margin: 0 0 1em 0;
    line-height: 1.5em;
}

img{ vertical-align: bottom; }
img.middle{ vertical-align: text-top; } /*usally does a better job than middle */
img.top{ vertical-align: top; }
a img{ border: 0; }

.body_container{
    float: none;
    width: 980px;
    margin: 0 auto 0 auto;
    background: url(http://qmjhl.assets.mrx.ca/chicoutimi/images/fr/container-bg.png) repeat;
}

#page_header {
	position: relative;
	z-index: 20;
}

.header {
	background: #419fce;
	color: #fff;
	border-bottom: 1px solid #000;
	padding: 4px 10px;
}

.header .title{
	font-weight: bold;
	color: #fff;
	font-size: 2.1em; 
	padding: 0;
	margin-left: 6px;
	text-shadow: 0px 0px 1px #002, 0px 0px 1px #000, 0px 0px 1px #000;
}

.pagetitle {
	background: #419fce;
	color: #fff;
	font-weight: bold; 
	color: #fff;
	font-size: 2.1em; 
	padding: 4px 10px;
	margin: 0;
	text-shadow: 0px 0px 2px #002a5c, 0px 0px 2px #000, 0px 0px 5px #000;
}

/*****ADS*****/
.ad_header{
	width: 980px;
	margin: auto;
	padding: 5px;
	background: #fff;
}

.ad-leaderboard{
    float: left;
    width: 728px;
    background: #EEE;
}
.ad-promobox{
    float: right;
    width: 240px;
    background: #EEE;
}

.ad-bigbox{
    width: 300px; height: 250px;
    margin: 0 auto 0 auto;
    background: url('/images/chl-wireframes/box.jpg') center;
    outline: solid 1px #444;
}

#leftbarAds .random_promo{
    width: 160px; min-height: 115px;
    margin-top: 10px;
    outline: solid 1px #666;
    background: #222;
}

/**LEAGUES MENU**/

.leagueNav{
    width: 1008px; height: 40px;
	margin: auto;
	border: 1px solid #777;
	background: #fff url(http://ohl.assets.mrx.ca/barrie/images/en/2010/leagnav_back.png) bottom repeat-x;
	position: relative;
}
.teamSprite_icons{
    float: left;
    height: 100%; width: 760px;
}

.league_graphic{
	float: left;
	width: 64px; height: 100%;
	background: #000;
	padding-left: 8px;
}

.league_graphic a {
	height: 100%;
	width: 100%;
	display: block;
	text-decoration: none;
}

.leagues_selector{
    float: left; position: relative;
    width: 40px; height: 36px;
}

.leagues_selector .dropdown{
	display: none; position: absolute; float: left;
	right: 0; top: 30px;
	background: #FFF;
	width: 400px;
	z-index: 100;
	outline: none;
	border: solid 2px #ccc;
}
.leagues_selector:hover .dropdown{ display: block; }

.chl_graphic {
	position:absolute;
	top:-8px;
	right:10px;
	width:94px;
	height:60px;
	background:transparent url(http://chl.assets.mrx.ca/league/images/en/wireframe/leagueNav-lch-logo.png) no-repeat;
}

.chl_graphic a {
	text-decoration:none;
	width:100%;
	height:100%;
	display:block;
}

/*** MAIN MENU ***/

.masthead{
    float: left;
    width: 100%;
    height: auto;
	position: relative;
}

.masthead .title_block {
	position: relative;
	width: 980px;
	margin: auto;
	z-index: 52;
	height: 100px;
	background: url(http://qmjhl.assets.mrx.ca/chicoutimi/images/fr/container-bg.png) repeat;
}

.masthead .mast_logo {
	position: absolute;
	z-index: 500;
	left: -25px;
	top: 3px;
}

.masthead .mast_text {
	position: absolute;
	left: 219px;
	top: 31px;
}

.masthead .nav{
    position: relative; 
    float: left; width: 100%;
}

.masthead .nav .tabs {
  position: relative;
  float: left; width: 100%;
  z-index: 10;
	height: 41px;
	background: url(http://qmjhl.assets.mrx.ca/chicoutimi/images/fr/nav-bg.png) top center no-repeat;
}

.masthead .nav .tabs ul {
	display: block;
	z-index: 10;
	list-style: none;
	margin: auto; padding: 0;
	width: 980px;
}

.masthead .nav .tabs ul li.toplevel {
  position: relative;
  float: left;

}

#mainnav {
	height: 36px;
}

.masthead .nav .tabs ul li a.top {
  display: block;
  float: left;
  height: 41px;
  line-height: 41px;
  padding: 0 10px;
  font-size: 1.5em;
  font-weight: bold;
  color: #fff;
  text-decoration: none;
  text-transform: uppercase;
  text-shadow: 0px 1px #777;
}
.masthead .nav .tabs ul li a.top:hover { 
  color: #fff;
  background: url(http://qmjhl.assets.mrx.ca/chicoutimi/images/fr/nav-selected.png) right top repeat-x;
}
.masthead .nav .tabs ul li .dropdown {
  display: none;
  position: absolute;
  left: 0;
  top: 35px;
  width: 165px;
  background-color: #fff;
  border: 2px solid #0051B0;
}
.masthead .nav .tabs ul li .dropdownwide {
  width: 400px;
  float: right;
}


.masthead .nav .tabs ul li:hover .dropdown {
  display: block;
}
.masthead .nav .tabs ul li .dropdown ul {
  position: relative;
  float: right;
  width: 165px;
}
.masthead .nav .tabs ul li .dropdown ul li {
  width: 165px;
}
.masthead .nav .tabs ul li .dropdown ul li a {
  display: block;
  padding: 4px 7px;
  font-size: 1.1em;
  font-weight: bold;
  color: #0051B0;
  text-decoration: none;
}
.masthead .nav .tabs ul li .dropdown ul li a:hover {
  color: #CE0623;
}
.masthead .nav .tabs ul li .dropdown ul li .subsubnav a {
  padding-left: 15px;
  font-size: 1.0em;
}
.masthead .nav .tabs ul li .dropdown .page {
  position: relative;
  float: left;
  padding: 0;
  background-color: #525252;
  color: #FFF;
}


/*****CUSTOM MASTHEAD STUFF***/

.masthead .nav{  }

.masthead .nav .tabs ul .toplevel_1{ margin-left: 138px; }

.masthead .nav .site{
    padding-left: 154px;
    font-size: 1.3em; font-weight: bold;
    color: #666;
}
.masthead .nav .site h1{ display: inline; font-size: 3em; }

#breadcrumbs{ 
	width: 100%; height: 20px; background: transparent; color: #FFF; z-index: 51;
	display: none;
}

#breadcrumbs .roundedleft, #breadcrumbs .navarrow {
	float: left;
}

#breadcrumbs .breadcrumbs {
	width: 980px;
	margin: auto;
}

#breadcrumbs ul {
	list-style: none;
	margin: 0;
	padding-left: 196px;
}

#breadcrumbs ul li {
	float: left;
	padding-right: 6px;
}

#breadcrumbs ul li a {
	color: #fff;
	padding-left: 10px;
	background: url("http://ohl.assets.mrx.ca/plymouth/images/en/small-arrow.png") no-repeat scroll left bottom transparent;
}

.search{
    width: 315px; /*IE 6-7 bug - needs width or doesn't fit contents */
}
.search input{ 
	width: 150px;
	border: 0;
	padding: 0;
	margin: 0;
	height: 21px;
}

.search .go-button{
    width: 62px;
	height: 21px;
	background: url(http://qmjhl.assets.s3.amazonaws.com/chicoutimi/images/fr/lancer.png) no-repeat;
	margin: 0;
	border: 0;
	padding: 0;
	vertical-align: top;
}


/***END CUSTOM MASTHEAD***/

#split_left{
    float: left;
    width: 660px; min-height: 400px;
}

#split_left .leftbar{ float: left; width: 160px; margin: 0 0 0 10px; }
#split_left .middle{ float: left; width: 480px; margin-left: 10px; height: auto; }

#split_right{
    float: right;
    width: 310px; min-height: 400px;
}

/***NEWSLETTER***/
#newsletter{ 
	width: 295px; 
	color: #fff;
	background: #001329;
	margin-bottom: 15px;
}

#newsletter .header .title, #seasonSummary .header .title {
	font-size: 1.7em;
}

#newsletter .inside {
	border: 1px solid #6C85A0;
	padding: 10px;
}

#newsletter h3{ margin: 0; }

#newsletter .form_title {
	font-size: 1.2em;
	margin: 5px 0px;
} 

#newsletter .survey .clear {
	display: none;
}

#newsletter .survey label { display: block; width: 100%; }

#newsletter .survey input, #newsletter .survey .submit {
	float: left;
}

#newsletter .survey .submit {
	border: 0;
	background: #419FCE;
	color: #fff;
	padding: 0;
	font-weight: bold;
	height: 22px;
	cursor: pointer;
}



/*****GET SOCIAL***/

#getSocial{ 
	width: 295px; 
	color: #000;
	background: #001329;
}

#getSocial .tabs{ float: left; }
#getSocial .tabs div{ float: left; padding: 2px; cursor: pointer; }
#getSocial .tabs .selected{ background: #419FCE; }


#getSocial .viewport{ overflow: hidden; width: 295px; }
#getSocial .container{ width: 590px; } /*Tabs x width of viewport/view */
#getSocial .view{ float: left; width: 295px; background: #fff; }

#getSocial #twitter_listing{ float: left; width: 100%; }
#getSocial #twitter_listing .content{ padding: 5px; }

#getSocial .button_rev{ margin-left: 5px; }

/****STORE***/
#store{ float: left; width: 50%; }

#store ul{ list-style: none; padding: 0; margin: 10px 0 0 0; }
#store ul li{ margin: 0 0 5px 10px; }
#store ul li a{ text-decoration: none; }
#store ul li .title{ font-weight: bold; }

#store .image{ float: left; margin-right: 6px; width: 70px; }
#store .image img{ width: 70px; height: 40px; vertical-align: top; }
#store .details{ float: left; width: 120px; }

#store .button_rev{ margin-top: 5px; }

/***FEATURED PLAYERS***/
#featuredPlayerBottom{
    position: relative;
    float: left; width: 50%;
    min-height: 190px;
}

#featuredPlayerBottom .header{ width: 100%; }
#featuredPlayerBottom .header .title{ font-size: 1.4em; font-weight: bold; padding: 6px 0; }

#featuredPlayerBottom h2, #featuredPlayerBottom h3{ margin: 0; }
#featuredPlayerBottom h2{ font-size: 1.4em; }
#featuredPlayerBottom h3{ font-size: 1.2em; }

#featuredPlayerBottom .player{
    position: relative; float: left;
    padding: 5px;
}

#featuredPlayerBottom .details{
    position: absolute;
    bottom: 0; left: 5px; width: 225px; /* 225 + 5 to match image width*/
    padding: 10px 0 10px 5px;
    margin-bottom: -30px;
    color: #FFF;
    background: url('http://chl.assets.mrx.ca/league/images/en/2010/rustyfu/newser-selector.png') repeat-x;
}


#featuredPlayerTop{
    position: absolute;
    top: 0; right: 0;
    width: 315px; height: 70px;
    outline: solid 1px #444;
}

#featuredPlayerTop .background{
    position: absolute;
    width: 100%; height: 100%;
    top: 0; left: 0;
    z-index: 1;
}

#featuredPlayerTop .details{
    position: absolute;
    bottom: 5px; left: 5px;
    z-index: 2;
}

#featuredPlayerTop .details .position{ font-size: 1.3em; font-weight: bold; color: #666; }
#featuredPlayerTop .details .player { font-size: 1.5em; font-weight: bold; text-transform: uppercase; }

#featuredPlayerTop .button_rev{
    position: absolute;
    bottom: 5px; right: 5px;
    z-index: 3;
}



/****FAN PHOTOS***/
#fanphotos h2{ display: none; }
#fanphotos .highslide-gallery{ float: left; }
#fanphotos .highslide-pic-info{ float: left; }
#fanphotos .highslide-pic{ width: 60px; height: 60px; float: left; margin-right: 5px; }

/********SKED*********/
#sked{
    width: 300px;
    margin-right: 10px;
	color: #fff;
	position: relative;
}

#sked .sked_tabs .game_time, #sked .sked_tabs .league_sked {
    float: left; display: block;
    color: #000;
    padding: 0 10px;
    width: auto;
	height: 13px;
	background: url(http://qmjhl.assets.s3.amazonaws.com/chicoutimi/images/fr/aqua-arrow.png) no-repeat scroll left center transparent;
	color: #FFF;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 1.1em;
}

#sked .sked_tabs .league_sked {

}

#sked .sked_tabs a {
	text-decoration: none;
}

#sked .sked_tabs .game_time a {
	color: #fff;
}

#sked .sked_tabs .league_sked a {
	color: #fff;
}

#sked .full_sked {	
	margin: 1px;
	width: 292px;
	line-height: 30px;
	background: #419FCE;
	text-align: right;
}

#sked .sked_tabs .full_sked a{
	color: #002A5C;
	background: url(http://qmjhl.assets.s3.amazonaws.com/chicoutimi/images/fr/blue-arrow.png) no-repeat scroll right center;
}

#sked .header {
	margin-top: 3px;
}

#sked .header .button_rev{
    float: left;
    margin: 10px 0px 10px 4px;
}

#sked .games{ 
	float: left; 
	width: 298px; 
	border: 1px solid #6c85a0;
	padding-bottom: 32px;
}
#sked .game-next .logo{
    height:100%;
}
#sked .game, #sked .game-next{
	position: relative;
    float: left;
    width: 294px;
    /*height: 43px;*/
    border-bottom: solid 1px #6c85a0;
	padding: 0;
	margin-left: 2px;
	font-weight: bold;
	background: url(http://qmjhl.assets.mrx.ca/chicoutimi/images/fr/blackglow4.png) bottom left repeat-x;
}
#sked .games .left, #sked .games .right { padding-top: 6px; padding-bottom:1px;}
#sked .game-next .left, #sked .game-next .right { padding-top: 15px;}
#sked .game-next{ height: 80px; }

#sked .logo{
    float: left;
    width: 56px;
    /*height: 100%;*/
    height: 40px;
    display: block;
}
#sked .game-next .logo{ width: 90px; }
#sked .where { font-weight: bold; color: #fff; }
#sked .win_lost, #sked .score{ font-weight: bold; color: #fff; }
#sked .team_name{ font-size: 1.7em; font-weight: bold; color: #fff; line-height:0.8em; }
#sked .action, #sked .watch{ font-size: 0.8em; }
#sked .watch{ padding-top: 3px; text-align: right; }

#sked .sked_team_coverages {
	font-weight: bold;
	text-transform: uppercase;
	text-align: right;
	float: right;
	width: 60px;
	position: relative;
	padding-top: 20px;
}

#sked .tickets_button a,
#sked .sked_team_coverages a,
#sked .action a{
	color: #419FCE;
}

#sked .countdown{
    position: absolute; top: 20px; left: 0;
    background: url('http://chl.assets.mrx.ca/league/images/en/wireframe/b-80.png') repeat;
    color: #FFF;
    text-align: center;
    width: 85px;
}

#sked .countdown .centre{
    font-weight: bold; font-size: 1.5em;
}

/*****VIDEO PAGE****/
a.rating_star{
  display: block;
  float: left;
  width: 15px;
  height: 14px;
  background: transparent url(http://ohl.assets.mrx.ca/guelph/images/stars.png) no-repeat 0 0; 
  text-indent: -9000px;
}

a.rating_star_1:hover { background-position: -15px 0; }
a.rating_star_2:hover { background-position: -30px 0; }
a.rating_star_3:hover { background-position: -45px 0; }
a.rating_star_4:hover { background-position: -60px 0; }
a.rating_star_5:hover { background-position: -75px 0; }


/***FOOTER***/
#footer{
    float: left;
    background: #000 url(http://ohl.assets.mrx.ca/peterborough/images/en/footer-bg.png) top left repeat-x;
    width: 100%; min-height: 200px;
    padding-top: 12px;
}

#footer_contents {
	width: 980px;
	margin: auto;
	color: #fff;
}

#footer_contents a {
	color: #fff;
	text-decoration: none;
}

#footer_logos{
    float: left;
    width: 245px; height: 100%;
	text-align: center;
}

#footer_logos img{
	max-width: 100px;
	max-height: 70px;
	margin-bottom: 15px;
}

#footer .footer_menu{
    float: left;
}

#footer h2 {
	font-size: 1.7em;
	font-weight: normal;
	margin: 8px 0;
}

#footer .footer_menu .footer_links{
    float: left; 
    width: 215px;
	border-left: 1px solid #222;
	padding-left: 24px;
	min-height: 200px;
}

#footer .footer_links a {
	color: #777;
	font-weight: normal;
	font-size: 1.1em;
}

#footer .footer_links ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
#footer .footer_links li {
	padding: 1px 0 2px 0;
}

#footer .footer_conf{ float: left; width: 50%; }

#footer .footer_team_space{
    float: left;
    width: 50px; height: 100%;
}

/****PROMOS****/

.bigbox {
	height: 250px;
	width: 295px;
	border: 1px solid #ccc;
	background: #555;
}


/***HEADER FEATURE***/

.header_feature {
	position: absolute;
	bottom: 4px;
	right: 10px;
}

#player_header {
	width: 300px;
	height: 60px;
	border: 2px solid #FFF;
	overflow: hidden;
	position: relative;
}

#player_header .info {
	position: absolute;
	bottom: 0;
	right: 0;
	color: #fff;
	font-weight: bold;
	font-size: 1.2em;
	width: 296px;
	padding-right: 4px;
	text-transform: uppercase;
	cursor: pointer;
	text-align: right;
	background: url(http://ohl.assets.mrx.ca/peterborough/images/en/fade-right.png) right bottom repeat-y;
	
}

#player_header .info .name {
	color: #fff;
	font-size: 1.3em;
}

#player_header .info .button { display: none; }


/*** Page Tabs ***/
.pagetabbar {

}

.pagetabbar ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: block;
	float: left;
	width: 100%;
}

.pagetabbar ul li {
	float: left;
	padding: 4px;
	margin: 2px;
	background: #fff;
	color: #000;
	border: 1px solid #000;
}

.pagetabbar ul li a{
	color: #000
}


/*** Footer Promo ***/
.promoFooter {
	float: none;
	width: 728px;
	margin: 12px auto 0;
}