/*	Default Layout
	92px columns, 24 px gutters, 72 px margins, 1234px total (extra space for scrollbars)
	-------------------------------------------------------------------------------
cols    1    2     3     4     5     6     7     8     9     10     11     12     13
px      68   160   252   344   436   528   620   712   804   896	988    1050   1142 */

/*---------Home Page Center---------*/

#content {
	width: 100%;
	margin: 0 auto;
}
.content_bottom {
	position: relative;
	width: 70%;
    margin: 20px auto 0;
	z-index: 3;
}
/*---------Highlights---------*/
.highlights-box {
	width: 100%;
	overflow: hidden;
	height: 630px;
	margin: 0;
	padding: 0 !important;
	position: relative;
	background-color: #000;
}
.highlights-box img {
	position: absolute;
	top: 0;
	right: 0;
	margin: 0;
	z-index: 1;
	width: 100%;
	height: 100%;
	object-fit: cover;
    object-position: center center;
}
.highlight-textbox{
	width: 735px;
	height: 300px;
	position: relative;
    margin: 140px auto 0;
    padding: 70px 30px 0;
	text-align: center;
	background-color: rgba(53,53,53,0.7);
	border-radius: 5px;
	z-index: 50;
}

.highlights-box h4 {
	width: 95%;	
	margin-left: auto;
	margin-right: auto;
	font-family: 'TeXGyreAdventorRegular';
	font-weight: bold;
	color: #fff;
	font-size: 35px;
	line-height:normal;
}
.highlight-text {
	z-index:50;
	position: relative;
	width: 85%;
	margin-left: auto;
	margin-right: auto;
}


.highlight-text img {
	position: relative;
	object-fit: none;
	margin-top: -50px;
    /*margin-top: -20px;*/
	max-width: 50%;
}

.highlight-text p {
	text-align: center;
	font-family: 'TeXGyreAdventorRegular';
	font-size: 18px;
	font-weight: normal;
	font-style: italic;
	color: #fff;
	letter-spacing: 1px;
	line-height: 30px;
}
.highlight-text a {
	font-size: 28px;
	font-weight: normal;	
}
.highlight-prev  {
	position: relative;
	z-index: 52;
	float: left;
	margin-left: 0;
	margin-top: 80px;
	display: block;
	width: 65px;
	height: 65px;
}
.highlight-next  {
	position: relative;
	z-index: 52;
	float: right;
    display: block;
	margin-right: 0;
	margin-top: 80px;
	width: 65px;
	height: 65px;
}
.highlight-indicator {display: none;}
.highlight-button {
    z-index:50;
	position: relative;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
}
.highlight-button a {
	text-decoration: none;
	color: #fff;
	font-weight: bold;
	background-color: #7ebe42;
    padding: 10px 30px;
	border-radius: 15px;
	font-size: 18px;
}
.highlight-button a:hover {
	text-decoration: none;
	background-color: #6D28AA;
}
.highlight-icon {
	z-index:51;
	position: relative;
    margin: 100px auto 0;
    width:65px;
}
.highlight-icon img {
	text-align: center;
	border-radius: 50px;
	background-color: #7ebe42;
	width: 60px;
	height: 60px;
	padding: 10px;
}
/*---------News & Now Showing Styles---------*/
#features {margin-top: 10px;}
.side-title {
	text-transform: uppercase;
	float: left;
	transform: rotate(90deg);
	font-size: 90px;
	line-height: 0;	
}
.news-title {
	position: relative;
	z-index: 1;
	color: rgba(53,53,53,0.2);
	top: 200px;
	left: -20px;
}

.mainbox_col {
	position: relative;
	width: 100%;
}

.news-grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-gap: 25px;
margin-top: 30px;
margin-bottom: 20px;
}


.news-box h2 {
	color: #fff;
	background-color: #6318AA;
	padding: 10px;
	padding-left: 20px;
	border-bottom: none;
	margin-top: 0;
}

.news_article2 {
	height: 200px;
    margin: 10px 1% 15px;
	float: left;
	line-height: 24px;	
	font-size: 16px;
	padding-bottom: 20px;
	font-weight: 100;	
}
.news_article2 img{
	width: 75px;
	float: left;
	padding-right: 10px;
}
.news_article:first-child {margin-left: 0;} 
.news_article:last-child {margin-right: 0;}
.news_header {
	font-size:18px;
	color: #346ABD;
	font-weight: bold;
    width: 90%;
    margin: 0 auto;
}
.news_img {
	overflow: hidden;
	padding:4px;
}
.news_img img {width: 100%;}
.mhz_img img, .now_img img, .fnx_img img, .nhk_img img, .nasa_img img{
	width: 100%;
	margin: 0;
}

/*--- News on PD page ----*/

.news_articlePD {
	display: grid;
	grid-template-columns: 1fr 2fr;
	grid-gap: 20px;
	padding-bottom: 20px;
	
}
.news_articlePD img{
	width: 100%;
}

/*--- End News on PD page ----*/

.watch-section {
	width: 100%;
	background-color: rgba(53,53,53,0.2);
	padding-top: 10px;
}

.watch-grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid-gap: 25px;
margin-top: 30px;
margin-bottom: 30px;
}

.watch-box {
    /*width: 32%;
	width: 24%; for 4 layout
	float: left;
    margin: 0 .0% 20px 1.3%;
	height: 420px;*/
	background-color: #fff;
	position: relative;
	line-height: 24px;
}
/*.watch-box:first-child {margin-left: 0;} 
.watch-box:last-child {margin-right: 0;}*/

.watch-box h2 {
	color: #fff;
	background-color: rgba(89,20,121,.85);
	padding: 10px;
	padding-left: 20px;
	border-bottom: none;
	margin-top: 0;
	margin: 0;
}
.watch {
	width: 90%;
	margin-bottom: 5px; 
	line-height: 24px;	
	font-size: 16px;
	font-weight: 100;
	margin-left: auto;
	margin-right: auto;
	position: relative;
	z-index: 2;
}

.watch-title {
	position: relative;
	z-index: 1;
	color: #fff;
	top: 200px;
	left: -40px;
}
.watch-img {
	position: absolute;
	float: right;
	z-index: 1;
	bottom: 0;
	right: 0;
	padding-right: 5px;
}
.now-episode {
	font-style: italic;
	font-weight: bold;		
}
/*---------Secondary Pages---------*/
#column1 {
	width: 230px;	
	margin-top: 15px;
	margin-right: 40px;
	float: left;
}
#column2 {
	margin-top: 15px;
	width: 650px;
	float: left;
}
#column3 {
	width: 200px;
	float:left;
	margin-top: 15px;
	margin-left: 40px;
}
.side-menu ul {
	padding-bottom: 15px;
	margin-left: 0;
}
.side-menu li {
	list-style: none;
	padding-left: 0;
	border-top-width: 1px;
	border-right-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-left-style: solid;
	border-top-color: rgb(255,255,255);
	border-right-color: rgb(255,255,255);
	border-left-color: rgb(255,255,255);
}
.side-menu li a {
	letter-spacing: 1px;
	font-weight: 400;
}
.side-menu li div:hover {
	padding-left: 8px;	
}
#main-highlight {
	position: relative;	
	width: 100%;
	height: 300px;
	float: left;
	margin-bottom: 20px;
	overflow: hidden;
	border-radius: 5px;
}
#main-highlight img {width: 100%;}
.main-highlight-text {
	position: absolute;
	left: 15px;
	bottom: 0;
}

#secondary-highlight {
	position: relative;	
	width: 100%;
	float: left;
	margin-bottom: 20px;
	overflow: hidden;
	border-radius: 5px;
}
#secondary-highlight img {
	width: 100%;
	padding:0;
}
.secondary-highlight-text {
	/*position: absolute;*/
	width: 100%;
	margin-top: -10px;
}


#column2 .smallCol {width: 120px;}
#column2 .column {
	width: 490px;
	margin-bottom: 10px;
}
#tvFeature .smallCol, #nasa .smallCol, #fnx .smallCol, #nhk .smallCol {width: 145px;}
#tvFeature .column, #nasa .column, #fnx .column, #nhk .column {width: 465px;}
.map {width: 95%;}
/*		Laptop size: 1222px. 
		
-------------------------------------------------------------------------------
  */
@media only screen and (min-width: 1222px) and (max-width: 1492px) {
/*---------Highlights---------*/	
.highlights-box {height: 500px;}
.highlight-textbox {margin-top: 70px;}
.highlight-icon {margin-top: 40px;}
.side-title {font-size: 80px;}
.news-title {
	top: 200px;
	left: -50px;
}
.watch-title {
	top: 200px;
	left: -80px;
}
}
/*		10 Column Layout: 992px. 
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.
-------------------------------------------------------------------------------
cols    1     2      3      4      5      6      7      8      9      10
px      68    160    252    344    436    528    620    712    804    896    */
@media only screen and (min-width: 992px) and (max-width: 1221px) {
/*---------Home Page Center---------*/
.content_bottom {width: 992px;}
/*---------Highlights---------*/
.highlights-box {height: 450px;}
.highlight-textbox{margin-top: 70px;}
.highlight-icon {margin-top: 40px;}
.highlights-box h4 {font-size: 32px;}
.highlight-textbox {
	width: 700px;
	height: 240px;
	margin-top: 80px;
}

.highlight-prev {margin-top: 60px;}
.highlight-next {margin-top: 60px;}
/*---------News & Now Showing Styles---------*/
.news_header {font-size: 16px;}
	
.news-grid {
	margin-top: 50px;
}
	
.news_article {
	font-size: 14px;
}

.side-title {
	transform: none;
	font-size: 40px;
}
.news-title {
	top: 30px;
	left: 20px;	 
}
.watch-title {
	top: 25px;
	left: 20px;
}
	
	
.watch-box {
	margin-bottom: 20px;
	margin-top: 27px;
}
.watch-box:first-child {margin-left: 15px;} 
.watch {font-size: 14px;}
/*---------Secondary Pages---------*/
#column1 {
	width: 215px;	
	margin-top: 10px;
	margin-right: 25px;
}
#column2 {
	margin-top: 10px;
	width: 473px;
}
#column3 {
	width: 182px;
	margin-top: 10px;
	margin-left: 25px;
}
.side-menu ul {padding-bottom: 15px;}
.side-menu li {padding-left: 12px;}
.side-menu li a {letter-spacing: 1px;}
.side-menu li div:hover {padding-left: 10px;}
#main-highlight {margin-bottom: 5px;}
.main-highlight-text {left: 10px;}
#column2 .smallCol {width: 95px;}
#column2 .column {width: 340px;}
#tvFeature .smallCol, #nasa .smallCol, #fnx .smallCol, #nhk .smallCol {width: 115px;}
#tvFeature img, #nasa img, #fnx img, #nhk img {width: 95%;}
#tvFeature .column, #nasa .column, #fnx .column, #nhk .column {width: 315px;}		
}
/*		Tablet Layout: 768px.
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */
@media only screen and (min-width: 768px) and (max-width: 991px) {
/*---------Home Page Center---------*/
.content_bottom {width: 768px;}
/*---------Highlights---------*/
.highlights-box {height: 400px;}
.highlights-box h4 {
    font-size: 27px;
	line-height: 26px;
	margin-top: 10px;
}
.highlight-textbox{
	width: 550px;
	height: 200px;
	margin-top:  70px;
	padding-left: 10px;
	padding-right: 10px;
}
.highlight-text p {
	font-size: 16px;
	line-height: 28px;
}

.highlight-text img {
	display: none;
}
	
.highlight-prev {margin-top: 50px;}
.highlight-next {margin-top: 50px;}
.highlight-button a {
    padding: 7px 20px;
	border-radius: 15px;
	font-size: 14px;
}
.highlight-icon {
	z-index:51;
	margin-top: 40px;
    width:45px;
}
.highlight-icon img {
	border-radius: 40px;
	width: 40px;
	height: 40px;
	padding: 10px;
}
/*---------News & Now Showing Styles---------*/

.news-grid {
	margin-top: 50px;
}
	

.news_article {
	font-size: 13px;
}

.news_header {
	font-size: 15px;
	}
	
.watch-grid {
	grid-gap: 15px;
}

.watch-box {
    /* width: 31.2%;
	 width: 23%; for 4 program layout */
	margin-top: 30px;
}
.watch-box:first-child {margin-left: 18px;} 
.hide {display: none;}
.watch {font-size: 14px;}
.side-title {
	transform: none;
	font-size: 40px;
}
.news-title {
	top: 30px;
	left: 20px;
}
.watch-title {
	top: 25px;
	left: 20px;
}
/*---------Secondary Pages---------*/
#column1 {
	width: 225px;	
	margin-top: 5px;
	margin-right: 20px;
}
#column2 {
	margin-top: 5px;
	width: 495px;
}
#column3 {
	width: 495px;
	margin-top: 5px;
	margin-left: 0;
}
.side-menu ul {padding-bottom: 15px;}
.side-menu li {padding-left: 0;}
.side-menu li a {letter-spacing: 1px;}
.side-menu li div:hover {padding-left: 10px;}
#main-highlight {display: none;}
#column2 .smallCol {width: 95px;}
#column2 .column {width: 365px;}
#tvFeature .smallCol, #nasa .smallCol, #fnx .smallCol, #nhk .smallCol {width: 125px;}
#tvFeature img, #nasa img, #fnx img, #nhk img {width: 95%;}
#tvFeature .column, #nasa .column, #fnx .column, #nhk .column {width: 330px;}				
}
/*		Mobile Layout: 320px.
		Gutters: 24px.
		Outer margins: 34px.
		Inherits styles from: Default Layout.
---------------------------------------------
cols    1     2      3
px      68    160    252    */
@media only screen and (max-width: 479px) {
/*---------Home Page Center---------*/
#content {
	width: 100%;
	margin-top: 0;
}
.content_bottom {
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
}
/*---------Highlights---------*/
.highlights-box {
	height: 220px;
	width: 100%;
}
.highlights-box h4 {
	font-size: 18px;
	line-height: 20px;
	margin-top: 50px;
}
.highlight-textbox{
	width: 100%;
	height: 220px;
	margin-top: 0;
    padding: 5px 3px 0;
	border-radius: 0;
}
.highlight-text p {
	font-size: 12px;
	letter-spacing: 1px;
	line-height: 15px;
}

.highlight-text img {
	display: none;
}
	
.highlight-prev  {
	margin-top: 40px;
	height: 40px;
	width: 40px;
}
.highlight-next {
	margin-top: 40px;
    height: 40px;
	width: 40px;
}
.highlight-button {
	margin-top: -45px;
}
.highlight-button a {
	padding: 3px 15px;
	border-radius: 15px;
	font-size: 12px;
}
.highlight-icon {
	display: none;
}
.highlight-icon img {
	border-radius: 40px;
	width: 40px;
	height: 40px;
}
/*---------News & Now Showing Styles---------*/

	.news-grid {
	grid-template-columns: 1fr;
	margin-top: 40px;
	margin-left: 15px;
	margin-right: 15px;
}
	
.news_img {
	float: left;
	width: 180px;
	padding-right: 15px;
}
.news_header {font-size: 15px;}
	
/*--- Professional Devlopment news -----*/
	
	.news_articlePD {
	grid-template-columns: 1fr;
}
	
/*--- End Professional Devlopment news -----*/
	
.watch-section {
	width: 100%;
	padding-top: 5px;
	padding-bottom: 20px;
	margin-bottom: 0;
	position: relative;
	float: left;	
}
	
.watch-grid {
	grid-template-columns: 1fr;
	grid-gap: 25px;
	margin-top: 50px;
	margin-left: 20px;
	margin-right: 20px;
	margin-bottom: 40px;
}
	
.watch-box {
	float: none;
	height: auto;
	background-color: #fff;
}
.watch-box:first-child, .watch-box:last-child {
	margin-left: auto;
	margin-right: auto;
} 
.watch {
	width: 90%;
	margin-bottom: 10px; 
	line-height: 24px;	
	font-size: 14px;
	font-weight: 100;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 5px;
}
.side-title {
	transform: none;
	font-size: 30px;
}
.news-title {
	position: relative;
	top: 20px;
	left: 20px;
}
.watch-title {
	position: relative;
	top: 20px;
	left: 20px;
}
/*---------Secondary Pages---------*/
#column1 {
	width: 295px;	
	margin-top: 15px;
	margin-right: 0;
}
#column2 {
	margin-top: 15px;
	width: 295px;
}

#column3 {
	width: 295px;
	margin-top: 15px;
	margin-left: 0;
}
.side-menu ul {padding-bottom: 10px;}
.side-menu li {padding-left: 10px;}
.side-menu li div:hover {padding-left: 0;}
#main-highlight {display: none;}
#column2 .smallCol {width: 75px;}
#column2 .column {
    width: 184px;
	margin-bottom: 10px;
}
#tvFeature .smallCol, #nasa .smallCol, #fnx .smallCol, #nhk .smallCol {width: 145px;}
#tvFeature .column, #nasa .column, #fnx .column, #nhk .column {width: 280px;}
.map {width: 95%;}
}
/*		Wide Mobile Layout: 480px.
		Gutters: 24px.
		Outer margins: 22px.
		Inherits styles from: Default Layout, Mobile Layout.
------------------------------------------------------------
cols    1     2      3      4      5
px      68    160    252    344    436   */
@media only screen and (min-width: 480px) and (max-width: 767px) {
/*---------Home Page Center---------*/
.content_bottom {
	margin-left: auto;
	margin-right: auto;
}
/*---------Highlights---------*/
.highlights-box {height: 320px;}
.highlights-box h4 {
	font-size: 18px;
	line-height: 20px;
	margin-top: 10px;
}
.highlight-textbox{
	width: 100%;
	height: 120px;
	margin-top:  195px;
	padding-top: 5px;
	padding-left: 5px;
	padding-right: 5px;
	border-radius: 0;
}
.highlight-text p {
	font-size: 12px;
	letter-spacing: 1px;
	line-height: 15px;
}
	
.highlight-text img {
	display: none;
}
	
.highlight-prev {
    margin-top: 40px;
    height: 40px;
	width: 40px;
}
.highlight-next {
    margin-top: 40px;
	height: 40px;
	width: 40px;
}
.highlight-button {
	margin-left: auto;
	margin-right: auto;
	margin-top: -30px;
}
.highlight-button a {
    padding: 3px 15px;
	border-radius: 15px;
	font-size: 12px;
}
.highlight-icon {display: none;}
.highlight-icon img {
	border-radius: 40px;
	width: 40px;
	height: 40px;
}
/*---------News & Now Showing Styles---------*/
.news-grid {
	grid-template-columns: 1fr;
	margin-top: 40px;
}

.news_img {
	float: left;
	width: 200px;
	padding-right: 15px;
	padding-bottom: 2px;		
}
.news_header {
    font-size: 15px;
    /*width: 96%;*/
}
	

/*--- Professional Devlopment news -----*/
	
	.news_articlePD {
	
	grid-template-columns: 1fr;
	
}
	
/*--- End Professional Devlopment news -----*/

.watch-section {
	width: 100%;
	padding-top: 5px;
	padding-bottom: 20px;
	margin-bottom: 0;
	position: relative;
	float: left;
}
	.watch-grid {
	grid-template-columns: 1fr;
	grid-gap: 25px;
	margin-top: 50px;
	margin-left: 20px;
}
	
.watch-box {
	float: none;
	background-color: #fff;
}
.watch-box:first-child {
	margin-left: 0;
} 
.watch-box:last-child {
	margin-right: 10px;
}
.watch {
	width: 96%;
	margin-bottom: 5px; 
	line-height: 24px;	
	font-size: 14px;
	font-weight: 100;
	margin-left: auto;
	margin-right: auto;
	padding-left: 5px;
	padding-right: 5px;
}
.side-title {
    transform: none;
	font-size: 30px;
}
.news-title {
	position: relative;
	top: 20px;
	left: 20px;
}
.watch-title {
	position: relative;
	top: 20px;
	left: 20px;
}
.now_img img, .mhz_img img{
	height: auto;
	width: 100%;	
}
.mhz_img .inner, .now_img .inner {
	width: 100%;
	height: auto;
}
.now_img, .mhz_img {margin-bottom: 2px;}
/*---------Secondary Pages---------*/
#column1 {
	width: 150px;	
	margin-top: 15px;
	margin-right: 40px;
	float: left;
}
#column2 {
	margin-top: 15px;
	width: 260px;
}
#column3 {
	width: 260px;
	margin-top: 15px;
	margin-left: 0;
}
.side-menu ul {
	padding-bottom: 10px;
	margin-left: 5px;	
}
.side-menu li {
	padding-left: 0;
	margin: 10px 5px 10px 0;
}
.side-menu li div:hover {padding-left: 0;}
#main-highlight {display: none;}
#column2 .smallCol {width: 50px;}
#column2 .column {
	width: 193px;
	margin-bottom: 10px;
}
#tvFeature .smallCol, #nasa .smallCol, #fnx .smallCol, #nhk .smallCol {width: 100px;}
#tvFeature .column, #nasa .column, #fnx .column, #nhk .column {width: 278px;}
.map {width: 95%;}
}