/*
	(c)2017 - visuallizard.com
	
	Responsive styles using Media Queries
*/

@media only screen and (min-width: 1240px) {
	body:before { content: 'extra-large'; visibility: hidden; position: absolute; }
	
	.main .main-nav .nav_1 { margin: 0 -1em; }
	.sticky-mode .main-nav .nav_1 { margin: 0 1em; }
}

@media only screen and (max-width: 1240px) {
	body:before { content: 'large'; visibility: hidden; position: absolute; }
	
	.container { padding: 0 15px; }
	.section-head .container { padding: 0; }
	.section-head-title { padding-left: 15px; padding-right: 10px; max-width: 55%; font-size: 13px; }
	.section-head-link { right: 15px; }
	
	.main .main-nav .nav_1 { margin: 0 2em; }
	.main-nav .nav_1 > li > a { padding: .85em .5em; font-size: 15px; }
	
	main img[style] {
		width: 100% !important;
		height: auto !important;
	}
	
	
}

@media only screen and (max-width: 800px) {
	body:before { content: 'medium'; }
	
	
	main > .container { display: block; }
	.primary { width: 100%; padding: 1em 0; }
	.sidebar { width: 100%; padding: 1em 0; border-left: 0; }
	
	.site-header { z-index: 102; background: #fff; box-shadow: 0 2px 5px rgba(0,0,0,.25); }
	.site-header .container { padding: 10px; }
	
	.site-logo-link { width: auto; padding: 0px 0; display: flex; justify-content: start; align-items: center; float: left; }
	.site-logo-img-wordmark {order: 1; width: auto; height: 30px; margin: 0; max-width: none; }
	.site-logo-img-artwork { order: 0;  width: auto; height: 35px; margin: 0 10px 0 0; max-width: none; }
	.site-logo-title { display: none; }
	
	.site-header .social-media { display: none; }

	.js .site-header .nav-button  { float: right; display: inline-block; border: 0; background: none; color: #444; appearance: none; vertical-align: top; width: 35px; height: 35px; padding: 5px; transition: all .2s ease-in;  -webkit-tap-highlight-color:rgba(0,0,0,0);  overflow: hidden; transform-origin: center; z-index: 1; position: relative; }
	.js .site-header .nav-button span { /* visuallyhidden: */ border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }


	.js .site-header .search-toggle { position: relative; background: #fff; z-index: 2; transition: all .2s; margin-right: 5px; }
	.js .site-header .nav-toggle    {  }
	.js .nav-on   .nav-toggle { transform: rotate(270deg); }

	.js .search-on .search-toggle { right: -40px; }
	.js            .search-toggle .icon.close { display: none; }
	.js .search-on .search-toggle .icon.close { display: block; }
	.js .search-on .search-toggle .icon.search { display: none; }

	.js         .main-nav { position: absolute; z-index: 101; top: 45px; right: 0; height: auto; width: 100%; padding: 0 0; text-align: right; border: 0; background-color: transparent; }
	.js         .main-nav .nav_1 { max-height: 100vh; display: block; top: 10px; left: -100%; position: absolute; width: 100%; height: auto; min-height: 100vh; padding: 10px; margin: 0; overflow: hidden; text-align: left; -webkit-transition: -webkit-transform .2s ease-in; transition: transform .2s ease-in, opacity .4s ease-in; opacity: 0; background: #808080;/*  z-index: 1000; */ }
	.js .nav-on .main-nav .nav_1 { max-height: none;  display: block; top: 10px; -webkit-transform: translateX(100%); transform: translateX(100%); /* for scrolling nav, but not content: */ opacity: 1; box-shadow: 0 0 100vh 100vh rgba(0,0,0,.25); }
	
	.main-nav .nav_1 > li { display: block; margin-bottom: 1em; }
	.main-nav .nav_1 > li > a,
	.main-nav .nav_1 > li:hover > a { color: #fff; font-size: 17px; padding: .25em 0; background-color: transparent; border-radius: 0; }
	.main-nav .nav_1 > li:hover > a:after { content: none; }
	.main-nav .nav_1 > li.at > a { color: #000; background-color: transparent; }
	
	.main-nav .nav_2,
	.main-nav .nav_1 > li:hover > .nav_2 { display: block; position: static; left: 0; margin: 0; padding: 0; border: none; background-color: transparent; width: auto; list-style: none; }
	.main-nav .nav_2 > li { border-bottom: .5px solid rgba(0,0,0,.1); }
	.main-nav .nav_2 > li > a { padding: .75em 0 .75em; color: #fff; }
	
	.main-nav .nav_3 { display: block;  border-top: .5px solid rgba(0,0,0,.1); }
	.main-nav .nav_3 > li { display: block; border-bottom: .5px solid rgba(0,0,0,.1); }
	.main-nav .nav_3 > li > a { display: block; font-weight: normal; color: #fff; padding: .5em 1em; }
	
	
	.search-form {  }
	.js            .search-form .icon.search { display: none; }
	.js            .search-form .button { display: none; }
	.js            .search-form input[type="search"] { }
	.js            .search-form { position: absolute; top: 0; left: -100%; width: 100%; max-width: calc(100% - 40px); transition: all .1s ease-in; will-change: transform; /* turn on 3d accel. hack */; opacity: 0; padding: 10px; margin: 0; min-height: 40px; background: #fff; z-index: 102;   }
	.js .search-on .search-form { left: 0; opacity: 1; }
	.js .search-on .site-header { box-shadow: 0 0 100vh 100vh rgba(0,0,0,.5); }
	.js.flexbox            .search-form { transform: translateX(0);     left: -100%; }
	.js.flexbox .search-on .search-form { transform: translateX(100vw); left: -100%; }
	
	
	.side_navigation_2 { display: none; }
	
	body > .quicklinks { display: none; }
	body > main {  }
	
	.news-list-item { width: 50%; }
	.news-list-item:nth-child(2n+1) { border-left: 0; }
	
	.events-list-item { width: 50%; }
	.events-list-item:nth-child(2n+1) { border-left: 0; }
	
	
	.items-list-item { width: 50%; }
		
	.flex-columns { display: block; }
	
	.about-section .twitter-timeline { max-width: none !important; border-left: 0 !important; }
	
	.staffer .contact-info,
	.staffer .bio {	margin-left: 0; }
	.staffer > img { float: none; width: auto; }
	
	.music-chart li { width: 100%; }
	
	.site-footer { }
	.footer_nav_1 { display: none; }
	
	.site-footer .social-media { display: block; text-align: center; font-size: 1.5em; margin: 1em 0;}
	.site-footer .social-media .memebers-signup,
	.site-footer .social-media .memebers-login { width: 48%; margin: 1em 0; font-size: .7em; }
	.site-footer .social-media .memebers-signup a,
	.site-footer .social-media .memebers-login a {  }
	
	.site-footer .search-toggle { display: none; }
	.site-footer .social-media svg {  }
	.site-footer .social-media > li { margin-left: .5em; }
	
	
	.partners-list { display: block; margin: 1em 0; }
	.partners-item,
	.partners-item-tall { width: auto; float: none; max-width: none; }
	.partners-group.center-vertical,
	.partners-group.center-horizontal { display: block; }
}

@media only screen and (max-width: 480px) {
	body:before { content: 'small'; }
	
	
	.full-width { display: none; }
	
	.news-list-item { width: 100%; border-left: 0; }
	.events-list-item { width: 100%; border-left: 0; }
	.items-list-item { width: 100%; border-left: 0; }
	
	.cke div.c1,
	.cke div.c2,
	.cke div.c3,
	.cke div.c4,
	.cke div.c5,
	.cke div.c6,
	.about-section .cke > .c2 { margin-left: 0; padding: 0; float: none; width: auto; }
	
	.music-chart-archive li { width: 100%; }
	.music-chart .rank { font-size: 1.5em; }
	
	.inline + .inline,
	.button + .button,
	.inline + .button { margin-left: 0; }
	
	.filter-form { display: block;}
	.filter-form > input,
	.filter-form > input:first-of-type,
	.filter-form > select { width: 100%; }
	
	
	.footer_nav_1 { display: none; }

	table { display: block; max-width: 100%; overflow-x: scroll; }
/* 	img { max-width: 100%; width: 100%; height: auto; } */

}