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

[1.00] GLOBAL ELEMENTS
[2.00] HEADER & TEXT STYLES
[4.00] DIV STYLES
	[4.01] NAVIGATION
	[4.02] EPISODE LISTING (MAINCONTENT RAIL)
	[4.03] EPISODE LISTING (RIGHTRAIL)
	[4.04] VIDEO RIGHTS BLOCK
[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
---------------------------------------------------------------------------------*/

/* Mobile Styles */
body {
	width: 320px;
	background-color:#fff !important;
	font-family:'Open Sans', Arial, Helvetica, sans-serif !important;
}


#episode-content {
    font-family: Arial,Helvetica,sans-serif;
    margin: 10px 0 20px;
    overflow: hidden;
    padding: 0;
    width: 300px;
}

a {color:#cc0000;}
a:hover { color:#000; text-decoration:none; }

.embeddedAds a {
	display: block;
}

/*---------------------------------------------------------------------------------
[2.00] HEADER & TEXT STYLES
---------------------------------------------------------------------------------*/
h1 { border-bottom:0 !important; color:#000 !important; font-size:24px; font-weight:300 !important; text-transform:none !important; margin-bottom:10px; }

h2 {
    color: #333333;
    font-size: 14px !important;
    font-weight: 300 !important;
    line-height: 18px !important;
    margin: 0 0 20px;
    padding: 0;
}

h3 {
	color:#333333;
	font-size: 18px;
	font-weight: 700;
	line-height: 20px;
	margin: 5px 0 8px 0;
	padding: 10px 0 0 0;
	text-transform:none;
}

h3 a {color:#cc0000;}

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

.entry-index-item h3 {
    margin: 10px 0;
    padding: 0;
}

h3 a:hover {color:#000;}

h2.airdates { font-size:14px; line-height:20px; font-weight:400; }

p { font-size:15px; line-height:20px; font-family:Arial, Helvetica, sans-serif; }

h5 {font-size:14px;font-weight:strong;}

#episode-content p {
    color: #000000;
    font-size: 15px;
    line-height: 20px;
    margin: 0px 0 20px;
    padding: 0;
	font-family:Arial, Helvetica, sans-serif;
}

.page-title h1 { font-size:18px !important; }

h3.entry-title { }
h2.entry-title.with-qualifier { font-size:20px; line-height:24px; margin:0 0 10px 0; }

h4 a {color:#cc0000;}

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

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

/*---------------------------------------------------------------------------------
[4.00] DIV STYLES
---------------------------------------------------------------------------------*/
.page-body {padding-top:10px;}


/*---------------------------------------------------------------------------------
[4.01] NAVIGATION
---------------------------------------------------------------------------------*/

.m-nav-passeye {
    background: #999999;
    color: #fff;
    display: block;
    font-family: 'Open Sans';
    font-size: 12px;
    font-weight: bold;
    height: 40px;
    line-height: 40px;
    padding-left: 5px;
    text-decoration: none;
    width: 315px;
}

.m-nav-passeye ul {
	margin:0;
	padding:0;
	list-style:none;
}

.m-nav-passeye li { 
	display:inline-block;
	margin:0;
	padding:0;
	list-style:none;
}

.m-nav-passeye .left {float:left;}
.m-nav-passeye .right {float:right;}
#passeye-hashtag { 
	padding:0 5px;
	font-weight:700;
	display:inline-block;
	color:#fff;
	text-decoration:none;
	}	
#passeye-hashtag a:hover { 
	color:#fff;
	text-decoration:none;
	}	


.m-nav-passeye2 {
    background: none repeat scroll 0 0 #000;
	color:#fff;

    display: block;
    font-family: 'Open Sans';
    font-size: 12px;
    font-weight: bold;
    height: 40px;
    line-height: 40px;
    text-decoration: none;
    width: 100%;
}



.m-nav-passeye2 ul {
	margin:0; 
	padding:0; 
	list-style:none;
}

.m-nav-passeye2 li {
	margin:0; 
	padding:0; 
	list-style:none;
}


#nav-main a { 
	display:inline-block;
	margin:0;padding:0 7px;
	list-style:none;
	float:left;
	background:#000;
	color:#fff;
	text-align:center;
	}


#nav-main a:hover { 
	background:#999999;
	color:#fff;
}

#nav-blog a { 
	display:inline-block;
	text-align:center;
	margin:0;padding:0 7px;
	list-style:none;
	float:left;
	background:#000;
	color:#fff;
	}

#nav-blog a:hover { 
	background:#999999;
	color:#fff;
}


#nav-episodes a { 
	display:inline-block;
	margin:0;padding:0 7px;
	list-style:none;
	float:left;
	color:#fff;
	background:#000;
	text-align:center;
	}

#nav-episodes a:hover { 
	background:#999999;
	color:#fff;
}

#nav-host a { 
	display:inline-block;
	margin:0;padding:0 7px;
	list-style:none;
	float:left;
	text-align:center;
	background:#000;
	color:#fff;
	}

#nav-host a:hover { 
	background:#999999;
	color:#fff;
}

#nav-about a { 
	display:inline-block;
	margin:0;padding:0 7px;
	list-style:none;
	float:left;
	text-align:center;
	background:#000;
	color:#fff;
	}

#nav-about a:hover { 
	background:#999999;
	color:#fff;
}

#nav-contact a { 
	display:inline-block;
	text-align:center;
	margin:0;padding:0 7px;
	list-style:none;
	float:left;
	background:#000;
	color:#fff;
	}

#nav-contact a:hover { 
	background:#999999;
	color:#fff;
}


#passeye-hashtag2 { 
	background:#00ACED;
	padding-right:10px;
	font-weight:700;
	display:inline-block;
	color:#fff;
	text-decoration:none;
	}	
#passeye-hashtag2 a:hover { 
	color:#fff;
	text-decoration:none;
	}	

/*---------------------------------------------------------------------------------
[4.02] MAIN BLOC
---------------------------------------------------------------------------------*/

#image_left {margin-bottom: 8px;}

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

#docs-footer h5 { font-size:16px; margin-bottom:10px; }
#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:60px;padding:0;}

#docs-footer-col1 { display:block; padding:10px; width:300px; }
#docs-footer-col1 img { width:120px; height:auto; margin:0 auto; }

#docs-footer-col2 { display:block; padding:10px; width:300px; }

#docs-footer-col3 { display:block; padding:10px; width:300px; }

#docs-footer-col4 { display:block; padding:10px; width:300px; }


/*---------------------------------------------------------------------------------
[4.04] VIDEO RIGHTS BLOCK
---------------------------------------------------------------------------------*/
#docs-block-videorights {
color:#999;
display:block;
background:#efefef;
font-size:10px;
line-height:12px;
margin:0 0 20px 0;
padding:10px; 
width:300px;
}

#docs-block-videorights-alpha {
float:none;
font-weight:400;
margin-bottom:5px;
padding-left:0;
text-align:center;
width:90%;
color:#555555;
}

#docs-block-videorights-beta {
float:none;
padding-right:0;
text-align:center;
text-transform:none;
width:90%;
color:#555555;
}


/*---------------------------------------------------------------------------------
[5.00] MINOR BUG FIXES
---------------------------------------------------------------------------------*/
.docs-share-bar /*Fixes float issue affecting FF only */ { float:left; margin:-10px 0 0 0; padding:0 0 12px 0; display:block; width:300px !important; }

article { display:inline-block !important; }

/*---------------------------------------------------------------------------------
[6.00] TV TEMPLATE OVERRIDES
---------------------------------------------------------------------------------*/
.globalheader { font-family:'Open Sans', Arial, Helvetica, sans-serif !important; height:30px; }

.search {
    display: none !important;
}

.mobile-home-link { font-family:'Open Sans', Arial, Helvetica, sans-serif !important; line-height:30px; }
.mobile-airtime { font-family:'Open Sans', Arial, Helvetica, sans-serif !important; line-height:30px; }

.pageheader {
    display: block;
    padding: 0 0 5px 0;
}

fieldset {
    border: 0 solid #C0C0C0;
    margin: 0 0 10px 0;
    padding: 0;
}

.page-header {margin-bottom:0;}

/*---------------------------------------------------------------------------------
[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:{off_state_colour};
}

.homepage-feed h3 {
	color:#cc0000 !important;
    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:#999999;
    border-bottom: 0px solid #999999;
    border-top: 0px solid #999999;
    color: #fff !important;
    display: block;
    font-size: 14px;
	font-weight:700;
    height: auto;
    padding: 10px 20px;
    position: relative;
    width: 260px;
	text-align:right;
}

.homepage-feed .feed-item .info-cta a {
 color: #fff !important;
}

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

.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: {off_state_colour};
    border-radius: 3px 3px 3px 3px;
    color: #FFFFFF !important;
	font-weight:700;
	font-size:14px;
    display: inline-block;
    line-height: 2em;
    padding: 0 15px;
    transition: background-color 260ms ease 0s;
}

.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;
	}

#docs-block-videorights {
line-height:20px;
font-size:14px !important;
font-weight:600 !important;
width:100%;
height: 50px !important;
margin:0 0 10px 0 !important;
padding-top: 5px !important;
color: #000 !important;
text-align:center !important;
}

#docs-block-videorights-alpha {
float:none;
padding-right:0;
text-align:center;

width:100%;
}

#docs-block-videorights-beta {
float:none;
padding-left:0;
margin-top:-10px;
text-align:center;
width:100%;
}




/*---------------------------------------------------------------------------------
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;
  }