/* Still within designed width (1040): */
@media only screen and (max-width: 1160px) {
	.site-header .social {
		display: none;
	}
	
	.main-nav {
		margin: 0 10px;
	}
	.main-nav-list > li {
		padding: 0 .25em;
	}
}



@media only screen and (max-width: 900px) {
	
	body:before { content: 'medium'; visibility: hidden; position: absolute; }
	
	.site-header { background: #f4fafb; padding: 10px 0 0; }
	.site-header .tipline { position: relative; float: none; clear: both; margin: 0 -10px 0; padding: 1em; border-radius: 0; }
	.site-header .tipline span { display: inline-block; font-size: calc(1em + 1.5vw); margin: 0; line-height: 1; }
	.site-header .tipline span.tipline-phone { border-top: none; border-left: 1px solid rgba(255,255,255,.5); margin-left: 1em; padding-left: 1em; } 
	.site-logo { float: none; display: inline-block; }
	
	.site-header + section { padding-top: 150px; }
	
	
	.main-nav { position: relative; top: 0; width: 100%; margin: 0; }
	.main-nav-list { padding: 1em 0;  }
	.main-nav-list > li { padding: 0; display: block; text-align: center; }
	.main-nav-list > li > a { font-size: calc(1em + 2vw); padding: .5em 0; border-bottom: none; }
	
	.main-nav-list .nav-level-2 { display: block; position: static; top: auto; left: auto; width: auto; margin: -.5em 0 0 0; }
		.nav-level-2 > li > a { font-size: calc(12px + 1vw); }
	
	.main-nav-list > li:hover > a { border: none; }
	
	.js         .main-nav { opacity: 0; max-height: 0; overflow: hidden; transition: all .2s ease-in-out; }
	.js .nav-on .main-nav { opacity:1 ; max-height: 999px;}
	.js .nav-toggle { display: block; float: right; width: 50px; height: 50px; padding: 3px; margin: 0; border: none; background: transparent; color: #4b626e; cursor: pointer; line-height: normal; position: absolute; top: 10px; right: 0px; transition: all .2s ease-in-out; -webkit-tap-highlight-color: transparent;  }
	.js .nav-toggle svg { width: 100%; height: 100%; }
	.js .nav-on .nav-toggle { transform: rotate(90deg); }
	
	.hero { background-position: center 100px; }
	
	.about-episodes { display: block; }
	.about-episodes .show-time-info { width: 100%;; }
	.episodes { display: block; width: 100%; }
	.episode { padding: 2em 2em 7em; }
	
	.tribute-section > .container { max-width: 80%; }
	
	/* 	sidebar show-time-info: */
	.sidebar .show-time-info { width: auto; padding: 15%; min-width: 0; }
	.show-time-info .day,
	.show-time-info .weekday,
	.show-time-info .times { font-size: calc(15px + 1vw); }
	
	
	.toggle { left: 2%; top: 30px; }
	.toggle-article { background: linear-gradient(to top, rgba(119,133,139,.45), rgba(76,85,90,.45)); }
	
	.primary,
	.sidebar { width: auto; float: none; margin-right: 0; }
	
	
	/* 	about */
	.about .hero { background-position: left bottom; }
	.episodes-section { margin-top: 0; }
	
	.episode-article { padding-left: 15%;  background: linear-gradient(to top, rgba(119,133,139,.45), rgba(76,85,90,.45)); }
	.episode-article.is-toggle-off { max-height: 110px; }
	.episode-article.is-toggle-on { background: transparent; } 
	.episode-article .show-time-info { display: none; /* temp */ }
	.episode-article-time > .button { }
	.episode-article.is-toggle-off .episode-article-time > .button { top: 40px; right: 80px; width: auto; opacity: 0; }
	.episode-article.is-toggle-on  .episode-article-time > .button { top: 40px; right: 80px; width: auto; opacity: 0; opacity: 1; }
	
	.episode-article-fig::after { background-image: linear-gradient( to bottom, rgba(15,30,40,.4), #090611); }
	
	.episode-article-info { width: 100%; padding-right: 1.75em;  }
	.episode-article-time { position: absolute; float: none; width: 115%; margin-left: -15%; z-index: -1; opacity: 0; }
	.is-toggle-on .episode-article-heading { max-width: 50%; }
	.is-toggle-on .episode-article-time { opacity: 1; }
	
	/* 	blog */
	.blog.index .hero { background-position: left bottom; }
	
	.panel blockquote { margin: 0 -1em; font-size: 2em; line-height: 1.3; }
	.panel .col-2 { width: auto; float: none;  padding: 0; margin-bottom: 2em; }
	.panel figure img { width: 100%; }
	
	
	
	/* 	footer */
	.media-block,
	.media-block + .col-2 { width: auto; padding: 0; float: none; }
	.site-footer .tipline { margin: 2em 0; padding: 2em 2em 0; }
	.site-footer .tipline .phone-number a { font-size: 1.5em; }
	
	
	h2, .h2 { font-size: 1.50em; }
	h3, .h3 { font-size: 1em; }
	
	.columns-2 {
		-webkit-column-count: 1;
		   -moz-column-count: 1;
		        column-count: 1;
	}
	
	
	/* 	Modal  */
	.modal-portret { width: 175px; height: 225px; }
	.modal-portret:after { }
	.modal-portret img { margin: 50px auto 0; }
}

@media only screen and (max-width: 600px) {
	
	body:before { content: 'small'; visibility: hidden; position: absolute; }
	
	.col-2 { width: auto; float: none;  padding: 0; margin-bottom: 2em; }
	
	
	
	.hero { padding-bottom: 400px; }

	/* 	Home page specific */
	.home .hero-heading { font-size: 2em; }
	.home .hero-heading strong { font-size: calc(80px + 5vw); }
	.home .hero-content .button { display: block; margin: 1em auto; max-width: 200px; }
	
	.about-series { padding: 40% 2em 0em; background-image: url(/img/bg-about-series.jpg), linear-gradient(to top, #363c3f, #222629); margin-bottom: 2em; }
	
	.slick-dots button { width: 7px; height: 7px; }
	.slider-controls { max-width: 100%; left: .5em; right: .5em; padding: 1.5em 2em; }
	.all-episodes { position: relative; bottom: 2em; left: auto; right: auto; max-width: 200px; margin: 0 auto; display: block; }
	
	.latest-post .button { align-self: center; }
	
	.partners-list { margin: 0; display: block; }
	.partners-list > li { margin: 0; /* display: block; float: left; */ }
	.partners-list > li img { max-width: 80px; }
	.partners-list > li:last-child img { max-width: 140px; }
	
	/* 	about */
	.episode-article-toggle { width: 2em; height: 2em; }
	
	/* 	Blog */
	.post { padding: 0; }
	.post::before { content: none; display: none; }
	.post-fig { width: 100%; float: none; padding: 0; margin: 0 auto 1em; height: auto; }
	.post-img { position: relative; top: auto; width: 100%; height: auto; max-width: none; transform: translateX(0); }
	.post .button { position: static; bottom: auto; right:auto; display: block; margin: 1em auto; max-width: 160px; }
	
	/* 	Modal  */
	button.mfp-close { width: 30px; height: 30px; }
	.modal-content { padding: 1em; }
	.modal-portret { position: relative; left: auto; top: auto; width: 175px; height: 225px; margin: 20px 0;}
	.modal-portret:after { }
	.modal-portret img { margin: 50px auto 0; }
	.modal-actions { position: relative; left: auto; bottom: auto; margin: 1em 0; }
	.modal-actions .button { margin: .25em }
	.modal-social { position: relative; left: auto; bottom: auto; }
}