@charset "UTF-8";

/***********************************/
/* Tablet, landscape               */
/***********************************/
@media only screen and (max-width: 1463px) {
	#menu-main { margin-left:-294px; }
}

@media only screen and (max-width: 1169px) {
	.tablet-only { display:inherit!important; }

	.debug span.tablet-l { display:inline; }
	.debug span.pc { display:none; }

	#header,
	#footer,
	#page,
	#page > section,
	.slideshow,
	.slideshow .slides,
	.slideshow .slides .slide {
		width:100%;
	}
	#footer #likebox { width:60%; }
	#footer #news { width:60%; }
	#footer #club { width:35%; }
	#menu-main { margin-left:-294px; }
	.slideshow,
	.slideshow .slides,
	.slideshow .slides .slide {
		height:57.86324786324787vw;
		background-size:100% 100%;
		background-size:cover;
	}
	.artists {
		margin-left:0;
		padding:0 33px;
	}
	.artists .artist {
		margin:0;
		background-size:100% auto;
		background-repeat:no-repeat;
		height:26vw!important;
	}
	.artists .artist .inner h1 { padding-bottom:11px; }
	.artists .artist .inner h1 .first { font-size:18px; }
	.artists .artist .inner h1 .last { font-size:50px; }
	.artists .artist .inner p { font-size:11px; max-height:60px; overflow: hidden; text-overflow: ellipsis; }
	.artists .artist.size-1 { width:33%; }
	.artists .artist.size-2 { width:66%; }
	
	.shows-list {
		max-width:90%;
	}

	#header { width:100%; left:0; margin-left:0; padding-left:55px; }
	#social-bar, #sidebutton { display:none; }

	.artisthead .video .thumb.playing {
		width:770px;
		height:433px;
	}
}

/***********************************/
/* Tablet, portrait                */
/***********************************/
@media only screen and (max-width: 1169px) and (min-width:481px) and (orientation:portrait),
       only screen and (min-device-width:481px) and (max-device-width: 1169px) and (orientation:portrait),
       only screen and (max-width: 768px) and (min-width:481px) {

	.artists .artist .inner a.website { padding:12px;height:46px; }
	.artists .artist .inner h1 { padding-bottom:8px; padding-top:16px; }
	.artists .artist .inner h1 .first { font-size:14px; }
	.artists .artist .inner h1 .last { font-size:40px; }
	.artists .artist .inner p { max-height:55px; }
	.mediagallery .list { max-width:100%; }
	
	.shows .shows-list .show {
		height:60px;
		padding-left:75px;
	}
	
	.shows .show .link a {
		padding-top:30px;
		background-position:50% 5px;
	}
	
	.shows .show .date,
	.shows .show .phone {
		font-size:30px;
		line-height:100%;
		height:25px;
	}
	.shows .show .venue,
	.shows .show .city {
		font-size:15px;
		line-height:100%;
	}
	
	.tvarchives .list {
		width:558px;
		margin:0 auto;
	}

	.artisthead .video { height:150px; }
	.artisthead .video .thumb {
		width:168px;
		height:100px;
	}
	.artisthead .video .info {
		left:330px;
	}
	.artisthead .quotes {
		bottom:183px;
		left:75px;
	}
	.artisthead .quotes .quote, .artisthead .quotes .quote p {
		font-size:16px;
	}
	.artisthead .quotes .author { font-size:13px; margin-top:0.5em; }
	.artisthead .video .thumb.playing {
		width:560px;
		height:315px;
	}
}

/***********************************/
/* Phone                           */
/***********************************/
@media only screen and (max-width: 767px) {
	.mobile-only { display:inherit!important; }

	.debug span.phone { display:inline; }
	.debug span.tablet-l { display:none; }
	.debug span.tablet-p { display:none; }
	.debug span.pc { display:none; }

	#header {
		padding-left:16px;
		height:40px;
	}
	#logo {
		margin-top:8px;
		max-width:50%;
	}
	
	#header .language,
	#header .menu {
		font-size:12px;
		margin-top:13px;
	}
	
	#header .language {
		margin-right:10px;
		padding-right:10px;
	}
	
	#header .menu {
		background-size:auto 100%;
		padding:0 16px 0 30px;
	}
	
	#menu-main {
		position:absolute;
		top:0;
		left:0;
	}
	
	.slideshow,
	.slideshow .slides,
	.slideshow .slides .slide {
		height:57.86324786324787vw;
		background-size:100% 100%;
		background-size:cover;
	}
	
	
	.tvarchives .list {
		width:277px;
		margin:0 auto;
	}

	.associates ul li.active article { 
		width:100%;
	}
	
	.associates ul.open {
		padding:0;
	}
	
	.associates ul.open li {
		background-position:0 -1000px;
	}
	
	.text {
		padding:0 16px;
	}
	
	.shows .shows-list .show {
		height:60px;
		padding-left:75px;
	}
	
	.shows .show .link a {
		padding-top:30px;
		background-position:50% 5px;
	}
	
	.shows .show .date,
	.shows .show .phone {
		font-size:20px;
		line-height:100%;
		height:25px;
	}
	.shows .show .venue,
	.shows .show .city {
		font-size:15px;
		line-height:100%;
	}
	.shows .show .city {
		max-width:100%;
	}
	.shows .show .venue { display:none; }
	.shows .show .phone {
		color: #7f9298;
		font-family: 'EB Garamond', serif;
		text-transform: uppercase;
		font-size:15px;
	}
	
	.shows .gfield select,
	.shows .form button	{
		float:none;
		width:100%;
		margin:0;
	}
	.shows .gfield select,
	.shows .form button {
		margin-bottom:8px;
	}
	
	.shows .more { max-width:90%; }

	.store .list .product {
		width:100vw;
	}
	
	.text ul {
		margin-left:20px;
	}

	
	.artisthead .quotes { display:none; }
	.artisthead .video { height:150px; transition:height 0.5s; }
	.artisthead .video.playing { height:265px; transition:height 0.5s; }
	.artisthead .video .thumb {
		width:168px;
		height:100px;
		position:relative;
		top:25px;
		bottom:inherit;
		left:inherit;
		margin:0 auto;
	}
	.artisthead .video .thumb.playing {
		width:90%;
		height:215px;
	}
	.artisthead .video .info { display:none; }
	
	
	#footer {
		padding-left:16px;
		padding-right:16px;
	}
	
	#footer #likebox,
	#footer #news,
	#footer #club { 
		float:none;
		width:100%;
	}
	#footer #club { 
		margin-top:20px;
	}
}

/***********************************/
/* Retina display                  */
/***********************************/
@media only screen and (min-width: 48em) and (max-device-width:1024px) {
	#wrapper {
		background-image:url('../images/bg-repeat-2x.png');
		background-size:1px 663px;
	}
	#cont-menu-main ul li a span {
		background-image:url('../images/header/bg-menu-primary-2x.png');
	}
	#cont-menu-main ul li a span {
		background-size:auto 200%;
	}
}

