/*
 * Responsive Design
 */

/*= Before Responsive
 *==================================================================*/

/*== Loop Actions */
.loop-actions .orderby-select{display:none;}

/*== Select Menu */
#main-nav .select-div{background:url(images/nav-sep.png) no-repeat left 0;display:none;}
#main-nav .select-wrap{overflow:hidden;
background-image: url(images/select-arrow.png);
background-repeat:no-repeat;
background-position:right center;
}
#main-nav select {height:auto; text-transform:none; display:block; margin:0 auto; 
-webkit-border-radius:0;
border-radius:0;
width:120%;
border:0;
font-size:13px;
font-weight:bold;
color: #EEE;
text-shadow:0 1px 0 #000;
padding:7px 5px 7px 10px;
-webkit-appearance: none; 
-moz-appearance: normal; 
appearance: normal;
-webkit-padding-end: 20px; 
-webkit-padding-start: 10px; 
-webkit-user-select: none;
-moz-user-select: none;
background-color:transparent;
background-color: rgba(0,0,0,0);
background-image: url(images/select-arrow.png);
background-repeat:no-repeat;
background-position:right center;
}
#main-nav select option {font-size:12px;color:#333;background:none;}
#main-nav select:active option{background:#FFF;}
.ie #main-nav select{color:#FFF;}
.ie #main-nav select option{background:none;color:#FFF;}
.ie #main-nav select:active option{background:none;color:#333;}

/*== Tablet Portrait
 *==================================================================*/
@media only screen and (min-width:640px) and (max-width:959px) {

/*== Structure */
body{min-width:640px;}
.boxed-wrap #page{width:640px;}
#main{padding:20px 0;}
.wrap{width:620px}
#content, #sidebar{width:100%;}

/*== Header */
#branding{margin-bottom:10px;}
#header-actions{margin-bottom:10px;}
#header-search{width:100%;margin-left:0;}

/*== Featured */
.home-featured .nav{width:620px;height:188px;float:left;background:#333;position:relative;}
.home-featured .nav .carousel{width:620px;height:160px;border-bottom:1px solid #444;}
.home-featured .nav .carousel-clip{height:320px;width:630px;}
.home-featured .nav .carousel-list{width:624px;}
.home-featured .nav li{float:left;width:309px;margin-left:0;
border-left:1px solid #444;
border-right:1px solid #272727;
}
.home-featured .nav li .inner{margin:0;}
.home-featured .nav li.current{background:#222;width:310px;border-left:0;}
.home-featured .nav li.current .inner{
	border-left:4px solid #B70000;
	margin-left:0;
	padding-left:6px;
}

.home-featured .nav .carousel-prev, 
.home-featured .nav .carousel-next{position:absolute;bottom:0px;}
.home-featured .nav .carousel-prev{left:0;margin:0;width:309px;border-left:1px solid #444;}
.home-featured .nav .carousel-next{right:0;width:308px;}

.home-featured-full .stage, 
.home-featured-full .stage .carousel{width:620px;height:349px;overflow:hidden;}
.home-featured-full .stage,
.home-featured-full .stage .carousel-list{height: 349px;}
.home-featured-full .stage .item,
.home-featured-full .stage .thumb {
width: 620px;
height: 349px;
}
.home-featured-full .stage .thumb img{width:620px;}


.fcarousel-5 .carousel-clip{width:544px;}
.fcarousel-5 li {
margin: 5px 3px 20px 3px;
}




/*== Footbar
 *=================================*/
#footbar .widget-col-5{width:100%;margin-left:0;}
#footbar.footbar-c4 .widget{width:300px;}

/* Fixed Youtube Video with JWPlayer*/
.fluid-width-video-wrapper embed{height:349px !important;}

/* End @media 
 *================================================================== */}

/*== Mobile
 *==================================================================*/ 
@media only screen and (max-width:639px) {
#main-nav .wrap{background:url(images/nav-sep.png) no-repeat right 0;}
#main-nav.has-select-menu .menu{display:none;}
#main-nav .select-div{display:block;}
 
.js .loop-actions .orderby{display:none;}
.js .loop-actions .orderby-select{display:block;float:left;height:21px;padding:2px;text-transform:none;}
.loop-actions .prefix{display:none;} 


.comment-form-author, .comment-form-email, .comment-form-url{
margin-left:0;
width:100%;
float:none;
}


/*== Structure */
body{min-width:320px;}
.boxed-wrap #page{width:320px;}
#main{padding:20px 0;}
.wrap{width:300px}
#content, #sidebar{width:100%;}

/*== Header
 *=================================*/
#branding{float:none;margin-bottom:10px;}
#site-logo img{margin:0 auto;}
#header-actions{float:none;}
#header-search{float:none;width:100%;margin:0;padding:15px 0 0;overflow:hidden;}

/*== Archive Content
 *=================================*/

.loop-actions .view .grid-small-link,  
.loop-actions .view .grid-medium-link, 
.loop-actions .view .list-large-link{display:none;}

.grid-small .item {
	width:140px;
	margin: 0 10px 20px;
}
.grid-small .thumb {
	width:140px;
	height:78px;
}
.grid-small .thumb img {
	width:140px;
}

.grid-medium .nag{margin: 0 -10px;}
.grid-medium .item{width:300px;margin: 0 10px 20px;}
.grid-medium .thumb{width:300px;height:168px;}
.grid-medium .thumb img{width:300px;}

.list-small .thumb {
	width:140px;
	height:78px;
}
.list-small .thumb img {
	width:140px;
}
.list-small .data {
	margin-left:158px
}
.list-small .meta, .list-small .stats{float:none;}
.list-small .stats > span{margin:0 10px 0 0 !important;}
.list-small .author,
.list-small .suffix,
.list-small .entry-summary{display:none;}

.list-medium .thumb {
	width:300px;
	height:168px;
	margin:0 0 10px;
}
.list-medium .thumb img {
	width:300px;
}
.list-medium .data {
	margin-left:0
}
.list-medium .author,
.list-medium .suffix{display:none;}
.list-medium .meta{float:left;}
.list-medium .stats{float:right;}
.list-medium .entry-summary{font-size:11px;}

.list-large .item{width:100%;}
.list-large .thumb{width:100%;height:168px;}
.list-large .meta, .list-large .stats{float:none;}
.list-large .stats > span{margin:0 10px 0 0 !important;}

/*== Featured Content
 *=================================*/
.home-featured .stage, 
.home-featured .nav{width:100%;}
.home-featured .stage{margin-left:-2px;}
.home-featured .stage,
.home-featured .stage .carousel-list{height: 168px;}
.home-featured .stage .item,
.home-featured .stage .thumb {
width: 300px;
height: 168px;
}
.home-featured .stage .thumb img{width:300px;}

.home-featured-full .stage,
.home-featured-full .stage .carousel{width:300px;height:168px;}
.home-featured-full .stage,
.home-featured-full .stage .carousel-list{height: 168px;}
.home-featured-full .stage .item,
.home-featured-full .stage .thumb {
width: 300px;
height: 168px;
}
.home-featured-full .stage .thumb img{width:300px;}

/*== Single Content
 *=================================*/
.entry-header .entry-title{float:none;margin:0 0 10px !important;}
.entry-header .entry-actions{float:none;margin:0;}

/*== Footbar
 *=================================*/
#footbar.footbar-c4 .widget{width:300px;}

/*== Colophon
 *=================================*/
#colophon{text-align:center;}
#social-nav{float:none;overflow:hidden;text-align:center;margin:0 0 10px;}
#social-nav li {
margin: 0 8px 0 0;

}
#copyright, #credits {
font-size: 11px;
margin: 0;
display: block;
}

.fluid-width-video-wrapper embed{height:259px !important;}
/* End @media ================================================================== */}

/* Fit the viewport between the original fixed-width breakpoints. */
@media only screen and (max-width:959px) {
	body {min-width:0;}
	.boxed-wrap #page {width:100%;}
	.wrap {width:calc(100% - 32px);max-width:620px;}
	#content, #sidebar, .widecolumn {width:100%;min-width:0;}
	#branding, #site-logo img {max-width:100%;}
	#header-actions {display:flex;flex-wrap:wrap;gap:8px;}
	#header-actions .btn {margin:0;}
	#sidebar, #footbar-inner {height:auto !important;display:flex;flex-wrap:wrap;gap:20px;}
	#sidebar .widget, #footbar .widget, #footbar .widget-col {position:static !important;transform:none !important;max-width:100%;box-sizing:border-box;margin-left:0;margin-right:0;}
	#footbar .widget-col .widget {width:100%;}
	#main-nav .menu {display:flex;flex-wrap:wrap;}
	#main-nav .menu > li {float:none;}
	.home-featured .stage {margin-left:0;}
	.home-featured .stage, .home-featured-full .stage {width:100%;height:auto;aspect-ratio:16/9;}
	.home-featured .stage .carousel, .home-featured-full .stage .carousel {width:100%;height:100%;}
	.home-featured .stage .carousel-list, .home-featured-full .stage .carousel-list {height:100%;}
	.home-featured .stage .item, .home-featured-full .stage .item {width:calc(100vw - 32px);max-width:620px;height:auto;aspect-ratio:16/9;}
	.home-featured .stage .thumb, .home-featured-full .stage .thumb {width:100%;height:100%;}
	.home-featured .stage .thumb img, .home-featured-full .stage .thumb img {width:100%;height:auto;}
	.loop-actions {display:flex;flex-wrap:wrap;gap:10px;align-items:center;}
	.loop-actions .sort, .loop-actions .view {float:none;}
	.loop-actions .view {margin-left:auto;}
	.loop-actions .orderby-select {max-width:100%;min-height:36px;height:auto;}
	.loop-actions .view a, .loop-actions .order a {min-height:36px;min-width:32px;}
}
@media only screen and (max-width:639px) {
	#main-nav select {width:100%;min-height:44px;font-size:16px;}
	#main-nav.has-select-menu .menu {display:none;}
	#header-search input {font-size:16px;}
	.grid-mini .nag, .grid-small .nag, .grid-medium .nag {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 16px;margin:0;}
	.grid-mini .nag::before, .grid-mini .nag::after, .grid-small .nag::before, .grid-small .nag::after, .grid-medium .nag::before, .grid-medium .nag::after {display:none;}
	.grid-mini .item, .grid-small .item, .grid-medium .item {float:none;width:auto;min-width:0;margin:0;}
	.grid-mini .thumb, .grid-small .thumb, .grid-medium .thumb {width:100%;height:auto;aspect-ratio:16/9;}
	.grid-mini .thumb img, .grid-small .thumb img, .grid-medium .thumb img {width:100%;height:auto;}
	.list-medium .thumb, .list-large .thumb {width:100%;height:auto;aspect-ratio:16/9;}
	.list-medium .thumb img, .list-large .thumb img {width:100%;height:auto;}
	.list-small .thumb {width:42%;height:auto;aspect-ratio:16/9;}
	.list-small .thumb img {width:100%;height:auto;}
	.list-small .data {margin-left:calc(42% + 16px);}
	#sidebar .widget, #footbar .widget, #footbar .widget-col {width:100%;}
	#footbar-inner {margin:0;}
	#comment, #author, #email, #url {font-size:16px;}
	.comment-list .depth-3 .comment-inner, .comment-list .depth-4 .comment-inner, .comment-list .depth-5 .comment-inner {margin-left:12px;}
	.fluid-width-video-wrapper embed {height:100% !important;}
}