/*
Theme Name: Divided Sky / McNay Music Group
Theme URI: http://modernsparkmedia.com
Description: Custom Website for Divided Sky and McNay Music Group
Version: 1.0
Author: Modern Spark
Author URI: http://modernsparkmedia.com
Tags: Custom
*/

/*====================================== COLORS  ======================================*/
/*


BLUE: 5790ae
DARK GREY: 262626
BLACK: 000000
WHITE: FFFFFF
LIGHT GREY IN LOGOS: 9fa0a3
BRIGHT BLUE IN DS LOGO: 7ccfd9

MATCHING LIGHT BLUE: 7DCEFA


*/ 

/*====================================== BASICS  ======================================*/

html {margin:0; padding:0; font-size:18px; font-family:'Open Sans', Arial, Helvetica, sans-serif; font-weight:300; color: #000; background:#262626;}
* { margin: 0px; padding: 0px; }

.alignleft 	{ float: left; margin:0 10px 0px 0 }
.alignright { float: right; margin:0 0 0px 10px }
.aligncenter, img.aligncenter { text-align:center; clear: both; display: block; margin-left: auto; margin-right: auto; }
.clear { clear: both; }

a:link, a:visited {color: #7DCEFA; font-weight: bold; text-decoration: none; outline: none;  }
a:hover, a:active {color: #5790ae; text-decoration: none; outline: none;  -webkit-transition: background linear .2s; -moz-transition: background linear .2s; -o-transition: background linear .2s; -ms-transition: background linear .2s; transition: background linear .2s;  }

a img { border: none; }
a:hover img, a:active img {opacity: 0.8;  -webkit-transition: opacity linear .2s; -moz-transition: opacity linear .2s; -o-transition: opacity linear .2s; -ms-transition: opacity linear .2s; transition: opacity linear .2s; }

ul,ol{ list-style: none; }
p{margin-bottom: 10px; }

h1, h2, h3, h4, h5, h6 {margin:0 0 20px 0; color:#5790ae; font-family:'Oswald', Arial, Helvetica, sans-serif; letter-spacing:-1px; font-weight:400;}
h1 {font-size:240%;   }
h2 {font-size:200%; color:#fff;}
h3 {font-size:200%; }
h4 {font-size:180%; }
h5 {font-size:160%; }
h6 {font-size:140%; }
	h6.post-date {letter-spacing:1px; float:left; text-transform:uppercase; width:100%; margin:5px 0 10px 0; border-bottom:1px solid #222; font-size:80%; font-weight:300; color:#ccc; text-align:right; }

input[type="text"],input[type="password"],input[type="email"],select,textarea{padding:5px 1%; width:98%; background:#c1c1c1; margin:0 0 5px 0; font-family:'Open Sans', Arial, Helvetica, sans-serif;  font-size:100%; border:0;}
input:focus[type="text"],input:focus[type="email"],select:focus,textarea:focus{background:#eee;}
input[type="submit"] {padding:10px 5px; width:70%; cursor:pointer; border:0; background:#5790ae;  font-family:'Oswald', Arial, Helvetica, sans-serif; color:#111; font-size:160%; font-weight:300;  }
input[type="submit"]:hover {background:#7DCEFA; color:#000;} 

/*====================================== SPECIAL EFFECTS  ======================================*/

.box-shadow {box-shadow:3px 3px 5px #111;-webkit-box-shadow:3px 3px 5px #111;-moz-box-shadow: 3px 3px 5px #111;}
.rounded-corners {border-radius:6px; -moz-border-radius: 6px; -khtml-border-radius: 6px; -webkit-border-radius: 6px;}
.background-transition { -webkit-transition: background linear .2s; -moz-transition: background linear .2s; -o-transition: background linear .2s; -ms-transition: background linear .2s; transition: background linear .2s;}

.responsive {height: 0; padding-top: 25px; padding-bottom: 67.5%; margin-bottom: 10px; position: relative; overflow: hidden; }
.responsive.widescreen { padding-bottom: 57.25%; }
.responsive.vimeo { padding-top: 0; }
.responsive embed, .responsive iframe, .responsive object, .responsive video { top: 0; left: 0; width: 100%; height: 100%; position: absolute; }

.facebook iframe {border:none; height:600px; width:100% !important;}


/*====================================== CONTAINERS  ======================================*/

.inner-container {width:96%; min-width:300px; max-width:1140px; margin: 0 auto;  }

.basic-container {float:left; width:98%; margin:0 1% 10px 1%;}

.left-basic-container {float:left; width:49%; margin:0 .5% 10px .5%;}

.right-basic-container {float:right; width:49%; margin:0 .5% 10px .5%;}

/*====================================== HEADER  ======================================*/

#header {width:100%; min-height:60px; float:left; background:#fff}

	#logo-divided-sky {float:left; width:20%; height:auto;}
	#logo-mckay {float:right; width:20%; height:auto; text-align:right;}
	#logo-divided-sky img, #logo-mckay img {max-width:100%; height:auto;}

	#slogan {float:left; width:79%; padding:35px 0% 35px 1%; font-size:180%; font-weight:300; font-style:italic; color:#000; text-align:right;}

	#social {float:right; width:30%; }
	#social ul {float:right; text-align:right;}
	#social li {display:inline-block; width:32px; margin:0 1px; float:left;}
	#social li img {max-width:100%; height:auto; margin:0 auto;}


#nav { width:100%; margin: 0; float:left; text-align:center; padding:20px 0; background:#000; font-family:'Oswald', Arial, Helvetica, sans-serif; }  
#nav ul {float:left; width:100%; text-align:center; }
#nav li {display:inline; margin:0;}  
#nav a {padding:20px 2%;text-decoration:none; font-weight:300; font-size:160%; color:#fff; } 
#nav a:hover {background:#444; color:#fff; }  
#nav ul li.current_page_item a {color:#fff; background:#5790ae;}

#slideshow-container {float:left; width:100%; background:#5790ae; min-height:50px; position:relative; }
#slider-box-shadow {float:left; width:100%; background:#1c1c1c; margin:20px 0; display:block; box-shadow:1px 2px 20px #111;-webkit-box-shadow:1px 2px 20px #111;-moz-box-shadow: 1px 2px 20px #111;}
#slider { }

#blue-header {float:left; width:100%; background:#5790ae; height:10px;  overflow:hidden; position:relative; }


/*====================================== MAIN SECTION + SIDEBAR  ======================================*/

#content {float:left; width:100%; min-height:50px; margin:20px 0; color:#fff;}
#content img, #content object, #content embed {max-width: 100%;  }
#content img { height: auto; }
#content ul, #content ol {margin:0 0 10px 5%; }
#content ul li {list-style:disc; margin:0 0 10px 0; }
#content ol li {list-style:decimal-leading-zero; margin:0 0 10px 0; } 

	#main-section-full-width {float:left; width:96%; margin:0 0 10px 0; padding:10px 2%; background:#1c1c1c}

	#main-section {float:left; width:55%; margin:0 1% 0 0; padding:10px 2%; background:#000;}

	.two-columns {float:left; width:45%; margin:0 .5% 0 .5%; padding:10px 2%; background:#1c1c1c;}

	.fifty-left {float:left; width:45%; margin:0 1% 20px 0; padding:10px 2%; background:#1c1c1c;}
	.fifty-right {float:right; width:45%; margin:0 0 20px 1%; padding:10px 2%; background:#1c1c1c;}
	.hundred {float:left; width:96%; margin:0 0 20px 0; padding:10px 2%; background:#1c1c1c;}

.one-third {float:left; width:29.3333%; margin:0 1% 20px 1%; padding:10px 1%; background:#1c1c1c;}
/*====================================== FOOTER  ======================================*/

#footer {float:left; background:#5790ae; padding:25px 2%; margin:0px 0 20px 0; width:96%; text-align:center; font-size:100%; font-weight:300;}

/*====================================== SERVICES ======================================*/

 .service-container {float:left; width:100%; margin:0 0 10px 0;  }
 .service-container .service{float:left; width:90%; cursor:pointer; padding:10px 5%; background:#1c1c1c; border-bottom:5px solid #333; font-family:'Oswald', Arial, Helvetica, sans-serif;  font-size:200%;}
 .service-container .service:hover {background:#5790ae;  }
  .service-container .service-info{float:left; width:80%; padding:20px 5%; margin:0px 0% 5px 10%; background:#333; color:#fff; line-height:1.6em;}
 
/*====================================== ARTISTS ======================================*/
.artist-container {float:left; margin:0 1% 20px 1%; padding:20px 2% 10px 2%; text-align:center; background:#1c1c1c;}
.artist-container.two-columns {width:44%; }
.artist-container.three-columns {width:27.33333333%; }

.artist-container:hover {background:#5790ae; cursor:pointer;}
.artist-container:hover h1 {color:#fff;}

.artist-name {float:left; width:100%; padding:15px 0 0 0;}
.artist-name h1 {font-size:26px; line-height:28px;}

#artist-single {float:left; width:96%; padding:10px 2%; background:#1c1c1c;}

#artist-left {float:left; width:54%; margin:0 2% 0 0;}
	.single-artist-image {float:left; width:100%; margin:0 0 20px 0;}
		.single-artist-image img {width:100%; height:auto; }
	.single-artist-bio {float:right; width:100%;}


#artist-right {float:right; width:44%; margin:0 0 0 0;}
	.audio-embed-code {float:left; width:100%; margin:0 0 20px 0;}
	


.single-artist-video {float:left; width:100%; margin:0 0 20px 0;}
	.responsive-video {

		position: relative;
		padding-bottom: 56.25%; /* 16:9 */
		padding-top: 25px;
		height: 0;
	}
	.responsive-video iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index:1000;
	}


/*====================================== VIDEO PRODUCTION ===================================*/


.single-video-container {float:left; width:49%; margin:0 1% 10px 0;}
.single-video {float:left; width:100%; position:relative;}

/*====================================== NEWS ===================================*/
.news-post {float:left; width:100%; }

/*====================================== SINGLE POST ===================================*/
.single-post-image {float:left; width:40%; margin:0 10px 10px 0;}
	.single-post-image img {width:100%; height:auto; }


/*====================================== MOBILE  ======================================*/


@media handheld, only screen and (max-width: 1140px) {



}




@media handheld, only screen and (max-width: 1023px) {

	html {font-size:16px;}
	html { -webkit-text-size-adjust: 100%; }

	.inner-container {width:96%; min-width:300px; max-width:640px; margin: 0 auto;  }

	#logo-divided-sky {float:left; width:96%; margin:0 2% 0; text-align:center;}

	#slogan {float:right; width:100%; margin:0; padding:5px 0; font-size:140%; text-align:center; }

	.nivo-caption {font-size:100%; padding:5px;}

	#social {float:left; width:100%; }
	#social ul {text-align:center; width:100%; float:left;}
	#social li {display:inline; width:auto; margin:0 1px; float:none;}
	#social li img {max-width:100%; height:auto; margin:0 auto;}
	
	#nav li {display:block; float:left; width:50%; margin:0; text-align:center; } 
	#nav li a {float:left; display:block; width:96%; font-size:120%; padding:5px 1%; margin:3px 1%; background:#333; color:#fff;}
	#nav li a:hover, #nav li a:active {color:#fff; background:#1c1c1c;}

	#main-section {float:left; width:96%; margin:0 1% 20px 1%; padding:10px 1%; }
	#main-section-full-width {float:left; width:96%; margin:0 1% 20px 1%; padding:10px 1%; }

	.two-columns {float:left; width:94%; margin:0 1% 20px 1%; padding:10px 2%; }
	.fifty-left{float:left; width:94%; margin:0 1% 20px 1%; padding:10px 2%; }
	.fifty-right {float:left; width:94%; margin:0 1% 20px 1%; padding:10px 2%; }
	.one-third {float:left; width:94%; margin:0 1% 20px 1%; padding:10px 2%; }
	.hundred {float:left; width:94%; margin:0 1% 20px 1%; padding:10px 2%; }
	.left-basic-container {float:left; width:94%; margin:0 1% 20px 1%; padding:10px 2%; }
	.right-basic-container{float:left; width:94%; margin:0 1% 20px 1%; padding:10px 2%; }
	#artist-left {float:left; width:94%; margin:0 1% 20px 1%; padding:10px 2%; }
	#artist-right {float:left; width:94%; margin:0 1% 20px 1%; padding:10px 2%; }
	.artist-container.two-columns, .artist-container.three-columns {float:left; width:94%; margin:0 1% 20px 1%; padding:10px 2%; }
	#sidebar {float:left; width:94%; margin:0 1% 20px 1%; padding:10px 2%; }

	.single-post-image {float:left; width:98%; margin:0 1% 10px;}


	}