/*---------------------------------------------------------------------------------
Theme Name: CBC Documentaries
Description: TV Template adaptation for CBC Docs digital family of websites
Version: 1.1 (September 13, 2013)

Feel free to dig in, or simply change the colour scheme using the preloaders below:
---------------------------------------------------------------------------------*/



/* TABLE OF CONTENTS
Use Ctrl+F to quickly navigate this stylesheet

[1.00] GLOBAL ELEMENTS
[2.00] HEADER & TEXT STYLES
[3.00] IMAGE STYLES
[4.00] DIV STYLES
	[4.01] NAVIGATION
	[4.02] EPISODE LISTING (MAINCONTENT RAIL)
	[4.03] EPISODE LISTING (RIGHTRAIL)
	[4.04] VIDEO RIGHTS BLOCK
	[4.05] DOCS FOOTER
	[4.06] WHEN TO WATCH TAB BLOCK
	[4.07] RELATED CONTENT BLOCKS
[5.00] MINOR BUG FIXES
[6.00] TV TEMPLATE OVERRIDES
	[6.01] PAGINATION
	[6.02] MASONRY BLOCKS

/* --------------------------------------------------------------------------------
Note: If css_base.css is reverted, all 'Futura' fonts shoud be replaced with
'Open Sans' within that stylesheet

Note: Rotator content and styles is self-contained within _rotator.html
---------------------------------------------------------------------------------*/

/*---------------------------------------------------------------------------------
[1.00] GLOBAL ELEMENTS
---------------------------------------------------------------------------------*/

body { background: #ccc !important; margin:0; padding:0; }

.globalheader {background-color:#1a1a1a;}

/* A separate body stylesheet wrapper avoids potential conflict with other CBC stylesheets */
#docs-body { font-family:'Open Sans', Arial, Helvetica, sans-serif !important; width:100%; }

#docs-container { margin:0 auto; width:986px; }
#docs-subcontainer { margin:0 auto; width:940px; }
#docs-content { margin:0 auto 0 auto; padding:23px 23px; width:940px; }
#docs-content-alpha { float:left; margin:0 20px 0 0; width:620px; }
#docs-content-beta { float:left; margin:0 0 0 0; width:300px; }

.sitewrapper {background-color:transparent;}
	.siteheader { }
		.siteheader-content { }

.sitecontent { background-color:#FFF; margin:0 auto; width:986px; }
	.content { background-color:#FFF; margin:0 auto; width:940px; }
		.pageheader { display:block; padding:0 0 10px 0; }
		#precontent /*allows stickynav to hover over video */ { z-index:998 !important; }

		#maincontent { margin:0 20px 0 0; padding:0 0 0 0; width:620px; }
		#maincontent-20 /*adds extra 20px for cascading blocks */ { margin:0 0 0 0; padding:0 0 0 0; width:640px; }
			.episode-body { font-family:Arial, Helvetica, sans-serif; font-size:15px; line-height:20px; display: block; position: relative; overflow: hidden; width: 100%; height: auto; }
			.episode-body p { font-family:Arial, Helvetica, sans-serif; font-size:15px; line-height:20px; margin:0 0 20px 0; }
			.entry-aside { }

		.rightrail { float:left; margin:0 0 0 0; padding:0 0 0 0px; width:300px; }

.globalfooter {background-color:#000;}

#docs-body a { color:#cc0000; font-weight:700; text-decoration:none; }
#docs-body a:hover { color:#000; text-decoration:none; }

#docs-block /* adds 20px margin for cascading blocks */ { display:block; width:300px; float:left; margin-right:20px;}
#docs-block-end { display:block; width:300px; float:left; }

/* Fits 3 Blocks within 620px */
#docs-block-3 /* adds 20px margin for cascading blocks */ { display:block; width:194px; float:left; margin-right:21px;}
#docs-block-3-end /* adds 20px margin for cascading blocks */ { display:block; width:190px; float:left; }

/*---------------------------------------------------------------------------------
[2.00] HEADER & TEXT STYLES
---------------------------------------------------------------------------------*/
#docs-body h1 /* title & page headers */ { 
	border-bottom:1px solid #ccc;
	color:#333333;
	font-size:36px;
	font-weight:300;
	line-height:48px;
	margin:0 0 10px 0;
	padding:0 0 5px 0; 
	}

#docs-body h2 /* airdate */ { 
	color: #333333;
	font-size: 16px;
	font-weight: 300 !important;
	line-height: 24px;
	margin: 0 0 10px 0;
	padding: 0 0 0 0; 
	}

#docs-body h3 /* all other headers */ {
	color:#333333;
	font-size: 20px;
	font-weight: 700;
	line-height: 24px;
	margin: 0 0 15px 0;
	padding: 0 0 0 0;
	text-transform:uppercase;
	}

#docs-body h4 /* title for maincontent episodes */ { 
	color: #333333;
    font-size: 20px;
    font-weight: 700 !important;
    line-height: 24px;
	}

#docs-body h5 /* subheader for body text */ { 
	font-family:'Open Sans', Arial, Helvetica, sans-serif !important;
	color: #000;
	font-size: 18px;
	font-weight: 400;
	line-height: 24px;
	margin: 0 0 10px 0;
	padding: 0 0 0 0; 
	}

#docs-body h6 /* title for rightrail episodes */ { 
	color: #333333;
    font-size: 14px;
    font-weight: 700;
    line-height: 18px;
	margin: 0 0 5px 0;
	}

#docs-body p /* body */ { 
	color:#333333;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px; font-weight: 400;
	line-height: 24px;
	margin: 0 0 20px 0;
	padding: 0 0 0 0; 
	}


#docs-body li /* body */ { 
	color:#333333;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 15px; font-weight: 400;
	line-height: 24px;
	 
	}
	
#multimedia-caption	{ padding:20px 20px 10px 20px; margin-bottom:20px; background:#efefef; }

.blog-header p, .interactive-header p { color:#555555 !important; font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size:11px !important; letter-spacing:0px; text-transform:uppercase; }

.blog-header h1 { text-transform:none; width:620px; }
.interactive-header h1 { margin:10px 0 10px !important; }

#dateline { color:#555555; font-size:11px; line-height:18px !important; margin:5px 0 5px 0; text-transform:uppercase; }
#dateline2 { color:#555555; font-size:11px; line-height:18px !important; margin:-5px 0 5px 0; text-transform:uppercase; }
#excerpt { color:#555555; font-family:'Open Sans', Arial, Helvetica, sans-serif !important; font-size:11px !important; line-height:16px !important; margin:0px 0 0px 0 !important; }
.padding5px0 { padding:5px 0; } 
.padding7px0 { padding:7px 0; } 
.padding10px0 { padding:10px 0; } 
.bold { font-weight:700 !important; }

.align_center {text-align:center;}
.align_left {text-align:left;}
.align_right {text-align:right;}

/*---------------------------------------------------------------------------------
[3.00] IMAGE STYLES
---------------------------------------------------------------------------------*/
.image_center { margin-left:auto; margin-right:auto; }
.image_left { width:300px; height:auto; display:block; padding-bottom:10px;line-height: 14px; }
.image-relative { position:relative; width:100%; height:auto; display:block; }
.icon-relative {position:absolute;top:0;left:0;width:100px;height:100px;}


/* ----- OLD PAGES IMAGES ----- */
#image_left { float:left; font-size:11px; margin-right:20px; width:300px; color:#555555; border-bottom: 1px solid #eee; padding-bottom: 5px; line-height: 14px; }
#image_left a { text-decoration:none; color:#cc0000; }
#image_left a:hover { text-decoration:underline; color:#000000; }
#image_left img {border: 1px solid #eee !important; margin-top: 5px; margin-bottom: 6px;}
#caption {font-size:12px; color:#555555; margin-bottom: 15px; line-height: 12px; margin-top: -18px; font-weight:bold; }
#image_caption {font-size:11px; color:#555555; border-bottom: 1px solid #eee; padding-bottom: 5px; margin-top: -13px; line-height: 14px; margin-bottom: 10px; }



/*---------------------------------------------------------------------------------
[4.00] DIV STYLES
---------------------------------------------------------------------------------*/
.block-relative {position:relative;}


/*---------------------------------------------------------------------------------
[4.01] NAVIGATION
---------------------------------------------------------------------------------*/
#docs-nav { background:#999999; border-bottom:7px solid #666666; display:block; position: absolute; font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size:20px; height:60px; width:100%; z-index:999 !important; box-shadow:0px 0px 10px #000; -moz-box-shadow:0px 0px 10px #000; -webkit-box-shadow:0px 0px 10px #000; }
#docs-nav img { width:auto !important; }
#docs-nav ul li.nav-item.selected a, { background: #999999; }
#docs-nav ul { list-style:none; margin:0; padding:0; clear:both; position:relative; }
#docs-nav li a { background:transparent; color:#fff; float:left; font-weight:300; line-height:60px; list-style:none; margin:0; padding:0 10px 0 10px; text-decoration:none; -moz-transition: 300ms ease-in 0s; -ms-transition: 300ms ease-in 0s; transition: 300ms ease-in 0s; -webkit-transition: 300ms ease-in 0s; }
#docs-nav li a:hover { background:#666666; color:#fff; }
#docs-nav li.facebook a { background:transparent; color:#000; float:right; font-weight:300; line-height:60px; list-style:none; margin:0 0px 0 0; padding:0 0 0 0; text-decoration:none; -moz-transition: 300ms ease-in 0s; -ms-transition: 300ms ease-in 0s; transition: 300ms ease-in 0s; -webkit-transition: 300ms ease-in 0s; }
#docs-nav li.facebook a:hover { }

#docs-nav li.instagram a { background:transparent; color:#fff; float:right; font-weight:300; line-height:60px; list-style:none; margin:0 0px 0 0; padding:0 0 0 0; text-decoration:none; -moz-transition: 300ms ease-in 0s; -ms-transition: 300ms ease-in 0s; transition: 300ms ease-in 0s; -webkit-transition: 300ms ease-in 0s; }
#docs-nav li.instagram a:hover { }
#docs-nav li.twitter a { background:transparent; color:#fff; float:right; font-weight:300; line-height:60px; list-style:none; margin:0 0px 0 0; padding:0 20px 0 0; text-decoration:none; -moz-transition: 300ms ease-in 0s; -ms-transition: 300ms ease-in 0s; transition: 300ms ease-in 0s; -webkit-transition: 300ms ease-in 0s; }
#docs-nav li.twitter a:hover { }
#docs-nav ul li.nav-item.selected a { background:#666666; color:#fff; }


/*---------------------------------------------------------------------------------
[4.02] EPISODE LISTING (MAINCONTENT RAIL)
---------------------------------------------------------------------------------*/
#docs-block-episodes {
background:#efefef;
display:block;
font-size:14px;
margin-bottom:20px;
padding:3%;
box-shadow:0px 0px 0px #fff; -moz-box-shadow:0px 0px 0px #fff; -webkit-box-shadow:0px 0px 0px #fff; 
 -moz-transition: 300ms ease-in 0s; -ms-transition: 300ms ease-in 0s; transition: 300ms ease-in 0s; -webkit-transition: 300ms ease-in 0s; 
}

#docs-block-episodes h3 a {color:#cc0000;
font-size:18px;
font-weight:700;
line-height:24px;
margin-bottom:3px;
}
#docs-block-episodes h3 a:hover {color:#000000;
text-decoration:underline;
}
#docs-block-episodes img {
display:block;
width:100%;
}
#docs-block-episodes-alpha {
float:left;
width:35%;
}
#docs-block-episodes-beta {
float:right;
width:60%;
}

#docs-block-episodes p.dateline {
color:#555555;
font-family: 'Open Sans', Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:400;
line-height:30px;
margin:0;
padding:0;
text-transform:uppercase;
}

#docs-block-episodes p {
color:#555555;
font-family: Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:400;
line-height:18px;
margin:0;
padding:0;
}


/*---------------------------------------------------------------------------------
[4.03] EPISODE LISTING (RIGHTRAIL)
---------------------------------------------------------------------------------*/
#docs-block-rightrail {
background:#efefef;
display:block;
font-size:14px;
margin-bottom:10px;
padding:5%;
box-shadow:0px 0px 0px #fff; -moz-box-shadow:0px 0px 0px #fff; -webkit-box-shadow:0px 0px 0px #fff; 
 -moz-transition: 300ms ease-in 0s; -ms-transition: 300ms ease-in 0s; transition: 300ms ease-in 0s; -webkit-transition: 300ms ease-in 0s; 
}

#docs-block-rightrail h3 a {color:#cc0000;
font-size:14px;
font-weight:700;
line-height:18px;
margin-bottom:5px;
}
#docs-block-rightrail h3 a:hover {color:#000000;
text-decoration:underline;
}
#docs-block-rightrail img {
display:block;
width:100%;
}
#docs-block-rightrail-alpha {
float:left;
width:35%;
}
#docs-block-rightrail-beta {
float:right;
width:60%;
}

#docs-block-rightrail p.dateline {
color:#555555;
font-family: 'Open Sans', Arial, Helvetica, sans-serif !important;
font-size:11px;
font-weight:400;
line-height:16px;
margin:0;
padding:0;
text-transform:uppercase;
}

#docs-block-rightrail p {
color:#555555;
font-family: Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:400;
line-height:18px;
margin:0;
padding:0;
}

/*---------------------------------------------------------------------------------
[4.04] VIDEO RIGHTS BLOCK
---------------------------------------------------------------------------------*/
#docs-block-videorights {
color:#999;
display:block;
background:#efefef;
font-size:14px;
line-height:40px;
margin:0 0 20px 0;<br />
padding-top: 15px;
width:940px;
height: 40px;
font-family:Arial, Helvetica, sans-serif;
}

#docs-block-videorights-alpha {
float:left;
font-weight:600;
padding-left:2%;
text-align:left;
width:90%;
color:#555555;
}

#docs-block-videorights-beta {
float:left;
padding-right:2%;
text-align:right;
text-transform:none;
width:5%;
color:#555555;
}

/*---------------------------------------------------------------------------------
[4.05] DOCS FOOTER
---------------------------------------------------------------------------------*/
#docs-footer { width:940px; color:#fff; background:#555555; padding:20px 23px 20px; font-size:12px; margin:0 auto; }
#docs-footer a { color:#fc0; font-weight:700; }
#docs-footer a:hover {color:#ff0;}

#docs-footer h5 {margin-bottom:5px;}
#docs-footer p { font-family:'Open Sans', Arial, Helvetica, sans-serif; font-size:12px; line-height:16px; color:#efefef; margin:0; }

#docs-footer #social { display:block; margin-top:5px; height:30px; font-size:14px; }
#docs-footer .social {float:left;width:25px;height:25px;margin-right:15px;padding:0;}
#docs-footer .email {float:left;width:40px;height:40px;margin-right:15px;margin-bottom:50px;padding:0;}

#docs-footer-col1 { float:left; width:100px; margin-right:20px; }

#docs-footer-col2 { float:left; margin-right:20px; width:260px; }

#docs-footer-col3 { float:left; width:200px; margin-left:20px;}

#docs-footer-col4 { border-left:1px solid #fff; float:right; padding-left:20px; width:279px; }


/*---------------------------------------------------------------------------------
[4.06] WHEN TO WATCH TAB BLOCK
---------------------------------------------------------------------------------*/
#docs-tabs { display:block; margin-bottom:20px; font-size:15px; }
#docs-tabs #cbctv { background:#efefef; padding:20px; }
#docs-tabs #cbcnn { background:#efefef; padding:20px; }
#docs-tabs-alpha { float:left; width:60px; }
#docs-tabs-alpha img { width:100%; height:auto; }
#docs-tabs-beta { float:right; width:180px; }
#docs-tabs .tabs { display:block; margin:0; padding:0; }
#docs-tabs .tabs ul { border-bottom:1px solid #cc0000; list-style:none; margin:0; padding:0; }
#docs-tabs .tabs li { float:left; color:#fff; list-style:none; display:inline; margin:0; padding:0; }
#docs-tabs .tabs a { font-weight:700; border-left:1px solid #cc0000; border-right:1px solid #cc0000; border-top:1px solid #cc0000; font-size:14px; padding:5px 10px; display:inline-block; background:#cc0000; color:#fff !important; text-decoration:none; }
#docs-tabs .tabs a.active { background:#555555; color:#fff !important; border-left:1px solid #555555; border-right:1px solid #555555; border-top:1px solid #555555; }

/*---------------------------------------------------------------------------------
[4.07] RELATED CONTENT BLOCKS
---------------------------------------------------------------------------------*/
#docs-related-episodes-block { display:block; width:300px; margin-bottom:20px; }
#docs-related-block-image { display:block; position:relative; width:100%; height:auto; }
#docs-related-block-image-icon img { position:absolute; top:0; left:0; width:70px; height:70px; display:block; border:none; }
#docs-related-block { display:inline-block; width:140px; margin-bottom:20px; margin-right:10px; vertical-align: top;  }
#docs-related-block-2 { display:inline-block; width:140px; margin-bottom:20px; vertical-align: top ; }
#docs-related-block-wrapper {padding-top:10px;}

/*---------------------------------------------------------------------------------
[4.08] WHEN TO WATCH EPISODE HEADER
---------------------------------------------------------------------------------*/

#docs-newsnet a {
    background:#999999;
    color: #000;
    float: left;
    font-size: 12px;
    font-weight: 800;
    margin-right: 10px;
    padding: 0 10px;
    text-transform: uppercase;
}

#docs-newsnet a:hover {
    background:#000;
    color: #FFFFFF;
}



/*---------------------------------------------------------------------------------
[4.09] BLOCKQUOTES
---------------------------------------------------------------------------------*/

#fact-left { font-family:'Open Sans', Arial, Helvetica, sans-serif; float:left; background:url('') top left no-repeat #efefef; width:240px; margin:5px 20px 10px 0; padding:20px; font-weight:300; line-height:24px; font-size:18px; }
#fact-right { font-family:'Open Sans', Arial, Helvetica, sans-serif; float:right; background:url('') top left no-repeat #efefef; width:240px; margin:5px 0px 10px 20px; padding:20px; font-weight:300; line-height:24px; font-size:18px; }


#quote-left { font-family:'Open Sans', Arial, Helvetica, sans-serif; float:left; background:url('/doczone/content/images/__common/quote.png') top left no-repeat #efefef; width:240px; margin:5px 20px 00px 0; padding:20px 20px 0px 20px; }
#quote-left p { padding-top:10px; font-size:11px; text-transform:uppercase; font-weight:800; color:#999999; text-align:right; }
#quote-left p:before { content:"- "; }

#quote-right { font-family:'Open Sans', Arial, Helvetica, sans-serif; float:right; background:url('/doczone/content/images/__common/quote.png') top left no-repeat #efefef; width:240px; margin:0 0 0 20px; padding:20px 20px 10px 20px; }
#quote-right p { padding-top:10px; font-family:'Open Sans', Arial, Helvetica, sans-serif; text-transform:uppercase; font-weight:800; color:#999999; text-align:right; }
#quote-right p:before { content:"- "; }


/*---------------------------------------------------------------------------------
[5.00] MINOR BUG FIXES
---------------------------------------------------------------------------------*/
.docs-share-bar /*Fixes float issue affecting FF only */ { float:left; height:30px; margin:0 0 0 0; padding:0 0 12px 0; width:620px; }

article { display:inline-block !important; }

/*Globalnav header styles */ 
#footer.v10 .main.corp h3 {
    font-family:Arial, Helvetica, sans-serif;
    font-size: 1.08em;
    margin: 7px 0 14px 10px;
    text-transform: uppercase;
}

#footer.v10 .main h3 {
    color: #FFFFFF;
    font-family:Arial, Helvetica, sans-serif;
    font-size: 1.67em;
    margin: 0 0 12px 9px;
}

#footer.v10 #ftr-connect h3 {
    color: #FFFFFF;
    float: left;
    font-family:Arial, Helvetica, sans-serif;
    font-size: 1.08em;
    margin: 0 25px 0 0;
}



/*---------------------------------------------------------------------------------
[6.00] TV TEMPLATE OVERRIDES
---------------------------------------------------------------------------------*/


.related-entries-item figure img {
    border: 0px solid #999999;
    display: block;
    height: auto;
    position: relative;
    width: 143px;
    z-index: 1;
}

.related-entries-item figure figcaption img {
    border: medium none;
    display: block;
    height: 70px;
    width: 70px;
}


.related-entries-item figure figcaption {
    top: 0px;
    display: block;
    height: 70px;
    left: 0px;
    opacity: 1;
    position: absolute;
    width: 70px;
    z-index: 2;
}

.related-entries-item h3 {
	color: #333333 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 18px !important;
	margin: 0 0 5px 0 !important;
	text-transform:none !important;
	}



.page-body {padding-top:20px;}

fieldset {
    border: 0 solid #C0C0C0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}

.page-header {
    border-bottom: 0px solid #cc0000;
    display: block;
    height: auto;
    margin-bottom: 16px;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.highlight.selected {
    display: none;
}
.highlight {
    border-left: 0px solid transparent;
    border-right: 0px solid transparent;
    border-top: 0px solid #4269AC;
    display: none;
    height: 0em;
    text-align: center;
    width: 0;
}

.rightrail-element {
	display: block;
	position: relative;
	float: left;
	width: 300px;
	margin-bottom: 20px !important;
	padding-top: 0px !important;
}

.entry-aside {
	display: block;
	font-size:12px; 
	line-height:18px;	
	position: relative;
	padding: 20px 0 0 0;
	margin: 20px 0 0 0;
	border-top: 1px solid #ccc;
}

#commentwrapper p {
	color:#555555;
	font-size:12px;
	line-height:18px;
}

/*---------------------------------------------------------------------------------
[6.01] PAGINATION
---------------------------------------------------------------------------------*/
.pagination {
    clear: both;
    display: block;
    margin: 10px 0;
    overflow: hidden;
    padding: 0;
    position: relative;
}

.pagination-total { 
	display:inline-block;
	font-size:14px;
	line-height:24px;
	float:left;
	color:#555555;
	padding-right:15px;
}


.pagination-number.selected, .pagination-number:hover {
    background-color: #cc0000;
    border-radius: 2px 2px 2px 2px;
    color: #FFFFFF !important;
}
.pagination-number {
    color: #cc0000;
    display: block;
    float: left;
    font-size: 1em;
    line-height: 1.5em;
    margin: 0 1px 0 0;
    padding: 0 7px;
    position: relative;
    transition: background-color 260ms ease 0s;
}

.pagination-total { 
	display:inline-block;
	font-size:14px;
	line-height:24px;
	float:left;
	color:#555555;
	padding-right:15px;
}


/*---------------------------------------------------------------------------------
[6.02] MASONRY BLOCKS
---------------------------------------------------------------------------------*/

.homepage-feed .feed-item figure figcaption {
    display: block;
    height: 100px;
    left: 0;
    opacity: 1;
    position: absolute;
    top: 0;
    width: 100px;
    z-index: 2;
}

.homepage-feed .feed-item figure figcaption img {
    border: medium none;
    display: block;
    height: 100px;
    width: 100px;
}

.homepage-feed {
    border-top: 0px solid #999999;
    display: block;
    height: auto;
    margin: 0px 0;
    overflow: hidden;
    padding-top: 0px;
    position: relative;
    width: 100%;
}

.homepage-feed .feed-item .info-body {
    background-color: #EAEAEA;
    font-family: 'Open Sans';
    font-size: 12px;
    line-height: 1.5em;
    padding: 0 20px 20px;
}

.homepage-feed .feed-item .info-title h3 {
    font-size: 18px;
    font-weight: 700;
    line-height: 20px;
    padding: 10px 0 8px;
	color:#000000;
}

.homepage-feed h3 {
    font-size: 18px;
    font-weight: 700;
    line-height: 16px;
    margin: 0 !important;
    padding: 10px 0 !important;
    text-transform: none !important;
}

.homepage-feed .feed-item .info-cta {
    background-color: #cc0000;
    border-bottom: 0px solid #999999;
    border-top: 0px solid #999999;
    color: #000;
    display: block;
    font-size: 14px;
	font-weight:700;
    height: auto;
    padding: 10px 20px;
    position: relative;
    width: 260px;
	text-align:right;
}

.info-cta a, .info-cta a:visited {
    color: #000 !important;
    text-decoration: none;
}

.info-cta:hover {background:#cc0000; }

.qualifier {
    color: #555555;
    font-size: 11px;
    line-height: 14px;
	margin:0 0 0px 0; 
	padding:10px 0;
	text-transform:uppercase;
}

.homepage-feed .feed-item .info-title {
    background-color: #EAEAEA;
    padding: 20px 20px 0;
	line-height:14px;
}

.moreposts-wrapper {
    display: block;
    height: auto;
    margin: 15px 0;
    position: relative;
    text-align: center;
    width: 100%;
}

#moreposts .moreposts-button {
    background-color: #cc0000;
    border-radius: 3px 3px 3px 3px;
    color: #000 !important;
	font-weight:700;
	font-size:14px;
    display: inline-block;
    line-height: 2em;
    padding: 0 15px;
    transition: background-color 260ms ease 0s;
}

#moreposts:hover .moreposts-button {
	background-color: #cc0000;
	color:#fff;
}

.debut /* title debut on rotator */ { 
	color: #fff;
    font-size: 12px;
    font-weight: 500;
    line-height: 12px;
	margin: 0 0 0 0;
	}
.debut-page /* title debut on page */ { 
	color: #666666 !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 12px;
	margin: 0 0 0 0;
	}


/*---------------------------------------------------------------------------------
SHAREBAR FIX
---------------------------------------------------------------------------------*/

#sharecount {
line-height: 1em;
}

#sharecount div.gig-button-container {
     border-bottom: none !important;
}

/*---------------------------------------------------------------------------------
VIDEO BUTTON FIX
---------------------------------------------------------------------------------*/

.cbc-caffeine-player .cbc-caffeine-container .icons .play-button {
background-size: 50% auto !important;
opacity: .75 !important;
}

.cbc-caffeine-player .cbc-caffeine-container .icons .play-button:hover {
background-size: 45% auto !important;
}

/* additional styling for responsive iframes */
#video-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	height: 0;
	overflow: hidden;

}

#video-container iframe {
	position: absolute;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
}
	

.embed-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    max-width: 940px;
}

.embed-container iframe,
.embed-container object,
.embed-container embed
{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.embed-container {padding-bottom:55.1%;}


/*---------------------------------------------------------------------------------
Remove Embedded Player - Drive To Gem SHORT VIEW - April 2019
---------------------------------------------------------------------------------*/
.episode_gem_container {
    position: relative;
  }
  
  .episode_gem_container img {
    width: 100%;
  }
  
  .episode_gem_container:before {
    content:"Stream Now on CBC Gem";
    background-color: #e60505;
    color: white;
    padding: 10px 20px;
    text-transform: uppercase;
    font-weight: 500;
  }
  
  .episode_gem_container .image_overlay {
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.3)
    z-index: 1;
  }
  
  .episode_gem_container .fa-play:before {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%,-50%);
    z-index: 5;
    font-size: 5em;
    color: white;
  }
  
  @media only screen and (max-width: 768px){
    .episode_gem_container .fa-play:before {
      font-size: 2em;
    }
    
    .episode_gem_container .image_overlay {
      height: 88%!important;
    }
  
  }
  
  .episode_gem_container .image_overlay {
    position: absolute;
    left: 0;
    width:100%;
    height: 95.5%;
    background-color: rgba(0,0,0,0.3);
    z-index: 1;
  }
  
  