
/**GENERAL POSITIONING**/


div.left-media{
    float: left;
    width: 465px;
}

div.right-ads{
    float: right;
    width: 155px;
}

.header .title {
	color: #fff;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 1.9em;
}

/**********NEWSER **********/

#newser{
    float: left;
    position: relative;
    width: 640px; /* ~640px */
    margin: 0; padding: 0;
}
#newser a{ text-decoration: none; }

#newser .header{
    position: absolute;
    padding: 0.5em;
    z-index: 3;
    background: #999;
}

#newser_images{
    position: absolute;
    top: 0; left: 0;
    z-index: 1;
}

#newser .credit{
    position: absolute;
    top: 0; right: 0;
    text-align: right;
    z-index: 2;
}

#newser_viewport{
    position: relative;
    width: 640px; height: 265px;
    overflow: hidden;
}

#newser_container{
    position: relative;
    /* width is set in the template */
}

#newser .newser_image{
    position: absolute;
    top: 0; left: 0;
    z-index: 1;
}

#newser .news_block{
    position: absolute; z-index: 2;
    width: 245px; height: 100%;
    top: 0;
    color: #FFF;
    background: url("http://chl.assets.mrx.ca/league/images/en/wireframe/b-60.png") repeat scroll 0 0 transparent;
	border-right: 1px solid #666666;
}
#newser .news_block a{ color: #fff; }

#newser_container .story{
    float: left;
    position: relative;
    width: 640px; height: 265px;
}

#newser .share_this{
    position: absolute;
    text-align: right; 
    top: 10px; right: 3px;
	display: none;
}

#newser .more_share{
    display: none;
    float: right;
    height: 16px;
    margin-right: 8px;
    margin-top: -4px;
	display: none;
}

#newser .open, #newser .close{
    position: absolute; bottom: 10px; right: 3px;
	display: none;
}
#newser .open{ display: none; }

#newser .news_block .title{
    width: 85%; margin: 20px 0 0 10px;
    font-size: 1.8em; font-weight: bold; 
	color: #fff;
	line-height: 1em;
}

#newser .excerpt{
    display: block;
    margin: 0 0 0 10px;
    width: 90%;
}
#newser .date{
    margin-left: 10px; color: #CCC;
}


#newser .newser_selectors{
    width: 639px; height: 44px;
}

#newser .newser_selectors .tabs {
	background: url(http://whl.assets.mrx.ca/regina/images/en/newser-bg.png) top left repeat-x;
}

#newser .arrow, #newser .arrow_right {float: left; width: 46px; height: 50px; position: relative; }
#newser .arrow_right{ text-align: right; margin-left: -48px; }

#newser .newser_selector{
    float: left; 
    width: 123px; height: 44px;
    text-align: center;
	color: #fff;
	text-transform: uppercase;
	cursor: pointer;
	background: url(http://whl.assets.mrx.ca/regina/images/en/newser-tab2.png) left top no-repeat;
	margin-left: -45px;
	padding: 0 26px 0 44px;
	-moz-border-radius: 0px 0px 26px 0px;
	-webkit-border-radius: 0px 0px 26px 0px;
	border-radius: 0px 0px 26px 0px;
}
#newser .newser_selector:hover, #newser .selected { background: url(http://whl.assets.mrx.ca/regina/images/en/newser-active.png) left top no-repeat; }
#newser .newser_selector span{ color: #aaa; }

#newser_video_wrap{
    position: absolute;
    text-align: center;
    display: none;
    top: 0; left: 0;
    height: 255px; width: 640px; /*height is offset by padding 320-10*/
    padding-top: 10px;
    background: #000;
    z-index: 3;
}

#newser .news_archives{
    position: absolute;
    z-index: 2;
    bottom: 60px; right: 10px; /*bottom should be height of selectors (58 + 2 borders)*/
	display: none;
}

/*******HIGHLIGHT REEL*****/
#highlightReel{
    position: relative;
    float: left; margin: 0;
	width: 470px;
}

#highlightReel .header{
    float: left;
    width: 100%;
    height: 47px;
    margin: 15px 0 -24px 0;
	background: url(http://whl.assets.mrx.ca/regina/images/en/title-bg2.png) no-repeat scroll left bottom transparent;
	overflow: hidden;
	position: relative;
	z-index: 1;
}
#highlightReel .header .title{
	margin-left:5px;
	height:17px;
	width:149px;
}

#highlightReel .contents {
	background: #ddd;
	padding: 15px 0 0 0;
	position: relative;
	border: 6px solid #555;
	border-top: none;
	-moz-border-radius: 0px 0px 10px 10px;
	-webkit-border-radius: 0px 0px 10px 10px;
	border-radius: 0px 0px 10px 10px;	
}

#highlightReel .videoplayer{
    float: left;
    width: 100%; height: 284px; /* on wireframe this was 320, but that's not 16:9 */
}

#highlightReel #highlightVideo .divider {
	margin: 0px;
	border: none;
}

#highlightReel .tabs{
    float: right;
    list-style: none;
    margin: 0; padding: 0;
    cursor: pointer;
}

#highlightReel .tabs li{
    float: left;
    display: block;
    padding-left: 10px;
    background: url(http://whl.assets.mrx.ca/regina/images/en/arrow.png) no-repeat scroll left center transparent;
	color: #9e0000;
    margin: 6px 7px 0 0;
	text-transform: uppercase;
	font-weight: bold;
}
#highlightReel .tabs li img{
	display: none;
}
#highlightReel .tabs li.selected{  }
#highlightReel .tabs a{ color: #9E0000; text-decoration: none; }

#highlightReel .viewport{
    float: left;
    width: 100%; height: auto;
    min-height: 166px;
    overflow: scroll;
    overflow-y: hidden;
}

#highlightReel .viewport .button_rev {
	display: none;
}

#highlightReel .container{
    float: left;
    /* width is width of #highlightReel Channel Width X Tab Channels (465 x 2) */
    width: 930px;
}

#highlightReel .container .channel{
    float: left;
    width: 465px; /* same as module width */
}

#highlightReel .container .channel .title{
    float: left;
    font-weight: bold; font-size: 1.2em;
    min-height: 30px;
    width: 100%;
	color: #004990;
}

#highlightReel .thumb{
    float: left;
    width: 141px;
    margin: 10px 10px 0 0;
    text-align: center;
}
#highlightReel div.thumb:first-child{ margin-left: 10px; }

#highlightReel .thumb img.thumb{ height: 80px; width: 141px; }

#highlightReel .highlights_sponsor {
	position: absolute;
	right: 5px;
	top: 17px;
}

/**********HEADLINES***************/

#headlines, #headlinesMore{
    float: left;
    width: 470px;
    margin: 0;
}

#headlinesMore{ 
	width: 150px; 
	margin-left: 14px;
}

#headlines .header, #headlinesMore .header{
    float: left;
    width: 100%;
    height: 47px;
    margin: 15px 0 -24px 0;
	background: url(http://whl.assets.mrx.ca/regina/images/en/title-bg2.png) no-repeat scroll left bottom transparent;
	overflow: hidden;
	position: relative;
}

#headlinesMore .header {
	background: url(http://whl.assets.mrx.ca/regina/images/en/title-bg.png) no-repeat scroll left bottom transparent;
}

#headlines .header .title, #headlinesMore .header .title{
    margin-left: 5px;
    font-size: 1.9em; font-weight: bold;
    text-transform: uppercase;
	color: #fff;
}
#headlines .header .title {
	width: 115px;
	height: 17px;
}
#headlinesMore .header .title {
	width: 115px;
	height: 17px;
}
#headlines .header .morenews{
	float: right;
	background:url(http://whl.assets.mrx.ca/regina/images/en/arrow.png) no-repeat scroll left center transparent;
	color:#9e0000;
	font-weight:bold;
	padding-left:10px;
	text-transform:uppercase;
	margin: 6px 7px 0 0;
}
#headlines .header .morenews img{
	display: none;
}

#headlines .news {
	padding: 0 6px;
	border: 6px solid #555;
	border-top: none;
	background: #ddd;
	-moz-border-radius: 0px 0px 10px 10px;
	-webkit-border-radius: 0px 0px 10px 10px;
	border-radius: 0px 0px 10px 10px;	
}

#headlines table{ padding-left: 0px; }
#headlines td{
    width: 30%;
    vertical-align: top;
    margin: 0 0 10px 0; 
}

#headlines td.title{
    font-size: 1.2em; font-weight: bold;
    padding-top: 21px;
}
#headlines td.date{
    padding: 5px 0 5px 0;
    color: #666;
}
#headlines td.excerpt p{ width: 90%; color: #000 }

#headlines .title a{ text-decoration: none; color: #0055A5 }

#headlinesMore .news {
	padding: 18px 3px 0 3px;
	width: 132px;
	background: #ddd;
	border: 6px solid #555;
	border-top: none;
	-moz-border-radius: 0px 0px 10px 10px;
	-webkit-border-radius: 0px 0px 10px 10px;
	border-radius: 0px 0px 10px 10px;
}
/*headlines more*/
#headlinesMore ul{
    float: left;
    list-style: none;
    margin: 10px 0 0 0; padding: 0;
    min-height: 137px; /*match this to the height of headlines table..you have to eye it*/
}
#headlinesMore li{ margin-bottom: 10px; width: 94%}
#headlinesMore li a{ text-decoration: none; font-weight: bold;}

#headlinesMore .button_rev {
	padding-left: 0;
	background: transparent;
}

/******PLAYERS OF THE WEEK*********/

#player_of_the_week{
    float: left;
    position: relative;
    width: 470px; margin: 0;
}

#player_of_the_week .header{
    float: left;
    width: 100%;
    height: 47px;
    margin: 15px 0 -24px 0;
	background: url(http://whl.assets.mrx.ca/regina/images/en/title-bg2.png) no-repeat scroll left bottom transparent;
	overflow: hidden;
	position: relative;

}

#player_of_the_week .header .title{
    margin-left: 5px;
    text-transform: uppercase;
	height: 17px;
}

#player_of_the_week .header .button_rev{
	margin: 6px 7px 0 0;
    float: right;
}

#player_of_the_week .header .button_rev a{
	color: #ae0000;
}

#player_of_the_week .profile{
	float: left;
	width: 458px;
	padding-top: 5px;
	background: #ddd;
	border: 6px solid #555;
	border-top: none;
	-moz-border-radius: 0px 0px 10px 10px;
	-webkit-border-radius: 0px 0px 10px 10px;
	border-radius: 0px 0px 10px 10px;
}

#player_of_the_week .headshot{
	position: relative;
    float: left;
    margin: 10px 0 0 0px;
    width: 182px; height: 182px;
    background: url('/images/chl-wireframes/box.jpg') center;
    border: solid 1px #444;
}

#player_of_the_week .headshot img{
	width: 182px; height: 182px;
}

#player_of_the_week .roster_sponsor {
	position: absolute;
	bottom: 5px;
	left: 5px;
}

#player_of_the_week .roster_sponsor,
#player_of_the_week .roster_sponsor img{
	width: 113px; height: 53px;
}

#player_of_the_week .info{
    float: left;
    margin: 10px 0 0 10px;
    width: 240px;
}

#player_of_the_week .number{
    float: left;
    font-size: 4em; font-weight: bold;
    color: #0055a5;
}

#player_of_the_week .name{ 
	float: left; 
	color: #b20501;
	font-weight: bold;
	font-size: 1.5em;
}

#player_of_the_week .name .first{ float: left; }
#player_of_the_week .name .last{ float: left;  font-size: 2em; margin-top: -0.3em; }
#player_of_the_week .name .position{
    float: left;
    color: #222;
    font-size: 1.3em; margin-top: -0.3em;
}

#player_of_the_week .stats{ float: left; margin-top: 10px; width: 100%; }
#player_of_the_week .stats div{ float: left; }
#player_of_the_week .stats .title{ width: 35%; clear: left; 	text-transform: uppercase; color: #666666; font-weight: bold; }
#player_of_the_week .stats .value{ width: 65%; font-weight: bold; color: #222 }

