/*
Theme Name: The Groovevine
Theme URI:
Author:  Casper Tromp
Author URI:  http://caspertromp.com
Description:  Basic music wordpress framework.
Version:  1.0
License:  GNU General Public License
License URI:  license.txt
Text Domain:  basic_music
Domain Path:  /languages/
 */
/* load fonts */
@font-face {
	font-family: 'iconfont';
	src: url('fonts/iconfont.eot');
	src: url('fonts/iconfont.eot?#iefix') format('embedded-opentype'), url('fonts/iconfont.ttf') format('truetype'), url('fonts/iconfont.woff') format('woff'), url('fonts/iconfont.svg#iconfont') format('svg');
	font-weight: normal;
	font-style: normal;
}

/* =Reset
--------------------------------------------------------------*/
html,body,div,span,h1,h2,h3,h4,h5,h6,p,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}

html {
	font-size: 62.5%; /* Corrects text resizing oddly in IE6/7 when body font-size is set using em units http://clagnut.com/blog/348/#c790 */
	-ms-overflow-y: hidden;
	overflow-y: hidden; /* Keeps page centred in all browsers regardless of content height */
	-webkit-text-size-adjust: 100%; /* Prevents iOS text size adjust after orientation change, without disabling user zoom */
	-ms-text-size-adjust: 100%; /* www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */
	height: auto;
	overflow: auto;
}

blockquote:before,blockquote:after,q:before,q:after {
	content: "";
}

blockquote,q {
	quotes: "" "";
}

b, strong{
	font-weight: 500;
}

a:hover,a:active {
	/* Improves readability when focused and also mouse hovered in all browsers people.opera.com/patrickl/experiments/keyboard/test */
	outline: 0;
}

a img {
	border: 0;
}

button,input {
	line-height: normal; /* Addresses FF3/4 setting line-height using !important in the UA stylesheet */
}

*:focus {
	outline: 0;
}

ol,ul{
	list-style: none;
}

h1, h2, h3, p, span{
	cursor: default;
}

a, a span, a div, a h3{
	cursor: pointer;
}

img{
	image-rendering:-webkit-optimize-contrast;
}

/* =Global
-----------------------------------------------*/
html{
	font-family: "franklin-gothic-urw", sans-serif;
	font-size: 16px;
	font-weight: 300;
	line-height: 27px;
	line-height: 1.7em;
}

@media screen and (min-width: 1400px){html{ font-size: 18px; }}
@media screen and (min-width: 1800px){html{ font-size: 21px; }}
@media screen and (min-width: 2100px){html{ font-size: 24px; }}
@media screen and (max-width: 960px){html{ font-size: 14px; }}
@media screen and (max-width: 740px){html{ font-size: 13px; }}
@media screen and (max-width: 300px){html{ font-size: 12px; }}

/* Headings */
h1,h2 {
	clear: both;
}

h1{
	font-family: "ltc-bodoni-175";
	font-size: 50px;
	font-size: 3.1rem;
	text-transform: uppercase;

	color: #FFF;
	position: relative;
	line-height: 48px;
	line-height: 3rem;
	margin-top: -16px;
	margin-top: -.4rem;
	text-shadow: 0 0 .2rem rgba(0,0,0,0.9), 0 0 1.2rem rgba(0,0,0,0.7);
	padding: 0 32px;
	padding: 0 2rem;

}

#introduction h1{
	margin-left: 38px;
	margin-left: 2.4rem;
	padding: 0;
	margin-bottom: 10px;
	margin-bottom: .6rem;
	text-shadow: 0 0 .2rem rgba(0,0,0,0.2), 0 0 1.2rem rgba(0,0,0,0.1);
	font-size: 37px;
	font-size: 2.3rem;
	margin-top: 8px;
	margin-top: .2rem;
}

.frontpage h1{
	font-size: 45px;
	font-size: 2.8rem;
	line-height: 45px;
	line-height: 2.8rem;
	padding: 0;
	text-shadow: 0 0 .3rem rgba(0,0,0,.9), 0 0 1.2rem rgba(0,0,0,0.8);
}

@media screen and (max-width: 600px) {
	h1{
		padding: 0 .9rem;
	}
	#introduction h1{
		margin-left: .9rem;
	}

	.frontpage h1{
		font-size: 2.2rem;
		line-height: 2rem;
	}

}


h2, h2 a {
	font-family: "ltc-bodoni-175";
	font-size: 27px;
	font-size: 1.7rem;
	color: #AE8D6B;
	text-transform: uppercase;
	margin-bottom: 12px;
	margin-bottom: .75rem;
	margin-top: 29px;
	margin-top: 1.8rem;
}

h3 {
	font-weight: 500;
}

p{
	margin-bottom: 14px;
	margin-bottom: .9em;
}

.paragraph p{
	font-size: 14px;
	font-size: .9rem;
	line-height: 27px;
	line-height: 1.7em;
	padding: 0 40px;
	padding: 0 2.5rem;
}

@media screen and (max-width: 600px) {
	.paragraph p{
		padding: 0 1rem;
	}


}


/* Text elements */
/* Links */
a {
	text-decoration: none;
	font-weight: 500;
	color: #000;
}

#content p a, .gig-info a{
	display: inline-block;
	-webkit-transition: background-color .3s;
	-moz-transition: background-color .3s;
	-ms-transition: background-color .3s;
	-o-transition: background-color .3s;
	transition: background-color .3s;
}

@media screen and (min-device-width: 1200px){
	#content p a:hover, .gig-info a:hover {
	}
}

#content p a:active, .gig-info a:active {

}


/* =Site Layout
-----------------------------------------------*/
html, body, #page{
	width: 100%;
	height: 100%;
	overflow: hidden;
	-ms-overflow-style: none;
}

#content{
	width: 100%;
	height: 100%;
	height: calc(100% - 4.5rem);
	position: relative;
	overflow: hidden;
	z-index: 5;
	box-sizing:border-box;
  	-moz-box-sizing:border-box;
  	-webkit-box-sizing:border-box;
}

#introduction p{
	margin-left: 40px;
	margin-left: 2.5rem;
	margin-right: 40px;
	margin-right: 2.5rem;
}

#page-content h2{
	margin-left: 38px;
	margin-left: 2.4rem;
	margin-right: 38px;
	margin-right: 2.4rem;
}

@media screen and (max-width: 600px) {
	#introduction p{
		margin-left: 1rem;
		margin-right: 1rem;
	}

	#page-content h2{
		margin-left: .9rem;
		margin-right: .9rem;
	}


}

#site-header{
	height: 72px;
	height: 4.5rem;
	width: 100%;
	position: relative;
	z-index: 5;
}

#site-logo{
	position: absolute;
	left: 16px;
	left: 1rem;
	top: 10px;
	top: .6rem;
}

#site-logo img{
	height: 54px;
	height: 3.36rem;
	width: auto;
}

#page-image{
	width: 46%;
	height: 100%;
	overflow: hidden;
	display: block;
	text-align: center;
	position: absolute;
}

#scroll-container{
	width: 100%;
	position: absolute;
	height: 100%;
	overflow-x: hidden;
	overflow-y: scroll;
	z-index: 5;
}

#page-content{
	width: 54%;
	height: auto;
	min-height: 100%;
	overflow-x: hidden;
	overflow-y: auto;
	display: block;
	float: right;
	position: relative;
	box-sizing:border-box;
  	-moz-box-sizing:border-box;
  	-webkit-box-sizing:border-box;
  	background: #fff;
}

.contact #page-image{
	width: 42%;
	right: 0;
}

.contact #page-content{
	width: 60%;
	float: left;
	background: #AE8D6B;
	min-height: 100%;
}

/*imageheader*/

#image-header{
	width: 100%;
	height: 100%;
	overflow: hidden;
	position: relative;
	box-sizing:border-box;
  	-moz-box-sizing:border-box;
  	-webkit-box-sizing:border-box;
  	background: #fff;
}

.slider-image{
	position: absolute;
	width: 100%;
	height: 100%;
	background-size: cover;
	image-rendering:-webkit-optimize-contrast;
	opacity: 0;
	-webkit-transition: opacity .5s;
	-moz-transition: opacity .5s;
	-ms-transition: opacity .5s;
	-o-transition: opacity .5s;
	transition: opacity .5s;
}

.slider-image.active.ready{
	opacity: 1;
}

.img-copyright{
	position: absolute;
	left: .6rem;
	bottom: 0;
	font-size: .7rem;
	line-height: .5rem;
	color: #fff;
	font-weight: 500;
	opacity: .9;
}

.frontpage .img-copyright{
	left: auto;
	right: .6rem;
	font-size: .8rem;
}

.contact .img-copyright{
	left: auto;
	right: .6rem;
}



@media screen and (max-width: 900px), screen and (max-device-width: 1200px)  { /*get rid of left column*/
	html, body, #page{
		overflow: auto;
		height: auto;
	}

	#content{
		position: relative;
		height: auto;
		min-height: 100%;
		overflow: hidden;
	}

	#scroll-container{
		overflow: auto;
		height: auto;
		width: auto;
		position: static;
		min-height: 40rem;
	}

	#page-content{
		height: auto;
		margin-bottom: 2.8rem;
	}

	.contact  #page-content{
		margin-bottom: 0;
	}
}

@media screen and (min-width: 900px) and (max-device-width: 1200px)  {
	#page-image-container{
		height: 100%;
		background: rgba(174,141,107,.3);
		width: 46%;
		height: 100%;
		overflow: hidden;
		display: block;
		text-align: center;
		position: absolute;
	}

	.contact #page-image-container{
		width: 42%;
		right: 0;
		background: #666;
	}

	#page-image{
		height: 40rem;
		width: 100% !important;
	}
}

@media screen and (max-width: 900px){
	#page-image, #page-content{
		width: 100% !important;
		position: relative;
	}

	#page-image{
		height: 32rem;
		text-align: left;
	}

	.contact #scroll-container{
		background: #AE8D6B;
	}

	#site-header{
		z-index: 100;
	}

}

@media screen and (max-width: 480px){
	#page-image{
		height: 16rem;
	}

	.contact #page-image{
		height: 25rem;
	}
}

/* =Header
-----------------------------------------------*/

ul.social {
	font-size: 19px;
	font-size: 1.2em;
	list-style: none;
	display: block;
	position: absolute;
	right: 26px;
	right: 1.65rem;
	top: 10px;
	top: .6rem;
}

ul.social li {
	display: block;
	float: left;
	margin-left: 6px;
	margin-left: .4em;
	margin-right: 0 !important;
	line-height: 26px;
	line-height: 1.6em;
}

ul.social li:first-child{
	margin-left: 0;
}

ul.social a{
	color: #AE8D6B;
	-webkit-transition: color .3s;
	-moz-transition: color .3s;
	-ms-transition: color .3s;
	-o-transition: color .3s;
	transition: color .3s;
}

@media screen and (min-device-width: 1200px){
ul.social a:hover{
	color: #000;
}
}

@media screen and (max-width: 740px) {
	ul.social {
		display: none;
	}
}


/* =Menu
-----------------------------------------------*/
#site-navigation {
	clear: both;
	display: block;
	position: absolute;
	top: 47px;
	top: 2.95rem;
	right: 5px;
	right: .3rem;
	z-index: 5;
}

#site-navigation ul {
	list-style: none;
	margin: 0;
	padding-left: 0;
}

#site-navigation li {
	float: left;
	position: relative;
	margin-right: 22px;
	margin-right: 1.4rem;
	height: 19px;
	height: 1.2rem;
	line-height: 19px;
	line-height: 1.2rem;
}

#site-navigation a {
	display: block;
	text-decoration: none;
	color: #AE8D6B;
	font-weight: 500;
	text-transform: uppercase;
	font-size: 18px;
	font-size: 1.15rem;
}

#site-navigation a{
	-webkit-transition: color .5s;
	-moz-transition: color .5s;
	-ms-transition: color .5s;
	-o-transition: color .5s;
	transition: color .5s;
}

@media screen and (min-device-width: 1200px){
	#site-navigation a:hover{
		color: #000;
	}
}

#site-navigation .current_page_item a,#site-navigation .current-menu-item a {
	color: #000;
}

/* Small menu */
#menu-toggle {
	cursor: pointer;
	display: none;
}

@media screen and (max-width: 740px) {
	#site-navigation {
		right: 0;
		top: 0;
	}

	#menu-toggle {
		display: block;
		z-index: 2;
		position: absolute;
		right: 0;
		top: 0;
		font-size: 2em;
		width: 4rem;
		height: 3rem;
	}

	#site-navigation{
		width: 4rem;
		height: 5rem;
		-webkit-transition: height 0s .4s, width 0s .4s;
		-moz-transition: height 0s .4s, width 0s .4s;
		-ms-transition: height 0s .4s, width 0s .4s;
		-o-transition: height 0s .4s, width 0s .4s;
		transition: height 0s .4s, width 0s .4s;
	}

	#site-navigation.toggle{
		width: 100%;
		height: 100%;
		-webkit-transition: none;
		-moz-transition: none;
		-ms-transition: none;
		-o-transition: none;
		transition: none;
	}

	#menu-toggle .icon{
		position: absolute;
		left: 0;
		right: 0;
		top:0;
		bottom: 0;
		text-align: center;
		vertical-align: middle;
		line-height: 4.6rem;
		font-size: 1.5rem;
		color: #AE8D6B;
		-webkit-transition: opacity .2s;
		-moz-transition: opacity .2s;
		-ms-transition: opacity .2s;
		-o-transition: opacity .2s;
		transition: opacity .2s;
	}

	#site-navigation .menubutton, #site-navigation.toggle .closebutton{ opacity: 1; }
	#site-navigation .closebutton, #site-navigation.toggle .menubutton{ opacity: 0; }

	#site-navigation .menu-navigation-container{
		display: block;
		height: auto;
		font-size: 1.2rem;
		background-color: rgba(255,255,255,.92);
		-webkit-transition: opacity .3s, width 0s .4s;
		-moz-transition: opacity .3s, width 0s .4s;
		-ms-transition: opacity .3s, width 0s .4s;
		-o-transition: opacity .3s, width 0s .4s;
		transition: opacity .3s, width 0s .4s;
		overflow: hidden;
		width: 0;
		opacity: 0;
	}
	#site-navigation .menu-navigation-container a{
		font-weight: 300;
	}


	#site-navigation.toggle .menu-navigation-container{
		width: 100%;
		opacity: 1;
		-webkit-transition: opacity .3s, width 0s;
		-moz-transition: opacity .3s, width 0s;
		-ms-transition: opacity .3s, width 0s;
		-o-transition: opacity .3s, width 0s;
		transition: opacity .3s, width 0s;
	}

	#site-navigation li {
		float: none;
		position: relative;
		margin: 0;
		height: 3.6rem;
		line-height: 3.6rem;
		text-align: center;
	}

	#site-navigation li:first-child a{
		padding-top: .6rem;
	}

	#site-navigation .current_page_item a,#site-navigation .current-menu-item a {
		border-bottom: none;
		font-weight: 500;
	}

}

/* =Footer
-----------------------------------------------*/

#contactbox{
	position: absolute;
	line-height: 0;
	bottom: 0;
	width: 100%;
	clear: both;
	text-align: center;
	z-index: 9;
}

#contactbox a{
	display: inline-block;
	background: #fff;
	background: #AE8D6B;
	border: 1px solid rgba(255,255,255,0.5);
	border-bottom: none;
	padding: 5px 19px 2px 19px;
	padding: .3rem 1.2rem .1rem 1.2rem;
	line-height: 28px;
	line-height: 1.75rem;
	color: #AE8D6B;
	color: #fff;
	font-family: "alternate-gothic-no-2-d";
	font-size: 24px;
	font-size: 1.65rem;
	width: auto;
	text-transform: lowercase;
	-webkit-transition:background-color .3s, transform .15s;
	-moz-transition:background-color .3s, transform .15s;
	-ms-transition:background-color .3s, transform .15s;
	-o-transition:background-color .3s, transform .15s;
	transition:background-color .3s, transform .15s;
}

#page-image #contactbox{
	right: 0;
	width: auto;
}

#page-image #contactbox a{
	border-right: none;
}

@media screen and (min-device-width: 1200px){
#contactbox a:hover{
	background: #000;
}
}

#contactbox a:active{
	-webkit-transform:scale(1.05);
	-moz-transfoim:scale(1.05);
	-ms-transform:scale(1.05);
	-o-transform:scale(1.05);
	transform:scale(1.05);
}

@media only screen and (min-width: 900px) and (max-device-width: 1200px) {
	#page-image #contactbox{
		bottom: 1rem;
		right: 1rem;
	}

	#page-image #contactbox a{
		border: 1px solid rgba(255,255,255,0.5);
	}

}

@media screen and (max-width: 900px) {
	#page-image #contactbox{
		bottom: 1rem;
		right: 1rem;
	}

	#page-image #contactbox a{
		border: 1px solid rgba(255,255,255,0.5);
	}

}

/* =Footer (NOT USED)
-----------------------------------------------*/


.footer {
	display: none; /* work on this later!!!!!!!!! */
	position: relative;
	text-align: center;
	width: 100%;
	overflow: auto;
}

.copyright{
	display: block;
	position: absolute;
	top: .2rem;
	right: 2rem;
}

.copyright p{
	color: rgba(164,139,103,.8);
	margin: 0;
	font-size: .55rem;
	font-weight: 500;
}

/* =Frontpage
-----------------------------------------------*/

#frontpage-titlebox{
	position: absolute;
	left: 29px;
	left: 1.8rem;
	bottom: 22px;
	bottom: 1.4rem;
}

#frontpage-gigs{
	position: absolute;
	right: 37px;
	right: 2.3rem;
	bottom: 35px;
	bottom: 2.2rem;
    border: 1px solid rgba(255,255,255,.1);
}

#frontpage-gigs h3, #frontpage-gigs a{
	box-sizing:border-box;
  	-moz-box-sizing:border-box;
  	-webkit-box-sizing:border-box;
}

#frontpage-gigs a{
	display: block;
	max-width: 18rem;
	background: rgba(255,255,255,0.85);
  	padding: 0;
  	font-size: 16px;
  	font-size: 1rem;
}

#frontpage-gigs h3{
	font-family: "ltc-bodoni-175";
	text-transform: uppercase;
	font-size: 22px;
	font-size: 1.4rem;
	line-height: 29px;
	line-height: 1.8rem;
	width: 100%;
	color: #fff;
	background: #AE8D6B;
  	padding: 2px 16px 0 11px;
  	padding: 0.1rem 1rem 0 .7rem;
  	-webkit-transition: background-color .3s;
	-moz-transition: background-color .3s;
	-ms-transition: background-color .3s;
	-o-transition: background-color .3s;
	transition: background-color .3s;
}

.fp-gig-date,.fp-gig-info{
	padding: 0 13px;
	padding: 0 .8rem;
}


@media screen and (min-device-width: 1200px){
	#frontpage-gigs a:hover h3{
		background: #000;
	}
}

#frontpage-gigs .gig{
	border: none;
}

.fp-gig-date{
	text-transform: uppercase;
}

.fp-gig-time, .fp-gig-info{
	font-weight: 300;
}

.frontpage .videolinks{
	position: absolute;
	right: 40px;
	right: 2.5rem;
	bottom: 126px;
	bottom: 9rem;
	text-align: right;
}

.frontpage li{
	margin-top: 16px;
	margin-top: 1rem;
}

.frontpage a{
	font-size: 19px;
	font-size: 1.2rem;
}

@media screen and (max-width: 1200px) {
	#frontpage-titlebox{
		left: 1.5rem;
		bottom: 2.8rem;
	}

	#frontpage-gigs{
		bottom: 3.1rem;
	}


}

@media screen and (max-width: 600px) {
	#frontpage-titlebox{
		left: 1rem;
	}

	.frontpage .videolinks{
		right: 1rem;
		bottom: auto;
		top: 5rem;
	}

}

@media screen and (max-aspect-ratio: 1/1) {

	#frontpage-titlebox{

		bottom: 8.8rem;

	}

	.frontpage #image-header{
		/*border-bottom: 5rem solid #fff;*/
		box-sizing:border-box;
  		-moz-box-sizing:border-box;
  		-webkit-box-sizing:border-box;
	}

	#frontpage-gigs{
		right: 0;
		left: 0;
		bottom: 0;
		box-shadow: none;
		border: none;
		height: 5rem;
		width: 100%;
		padding: 0;
	}

	#frontpage-gigs h3{
		font-size: 1.1rem;
		line-height: 1.5rem;
		padding: 0;
		padding-top: .2rem;
		padding-left: .9rem;
		width: 100%;
	}

	#frontpage-gigs a{
		font-size: 1rem;
		line-height: 1.5rem;
		width: 100%;
		display: block;
		max-width: none;
	}

	.fp-gig-date,.fp-gig-info{
		padding: 0 1rem;
	}

	.frontpage #contactbox {
		bottom: 5.8rem;
		text-align: left;
		left: 1rem;
	}

	#contactbox a{
		border: 1px solid rgba(255,255,255,0.5);
	}


}




/* =Content
-----------------------------------------------*/

#titlebox{
	position: absolute;
	z-index: 1;
	top: 22px;
	top: 1.4rem;
	left: 0;
	right: 0;
}

#introduction{
	background: #AE8D6B;
	color: #fff;
	padding: 16px 0 6px 0;
	padding: 1rem 0 .4rem 0;
	margin-bottom: 19px;
	margin-bottom: 1.2rem;
}

ul#testimonials{
	padding: 8px 40px;
	padding: .5rem 2.5rem;
	width: 100%;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	margin-bottom: 19px;
	margin-bottom: 1.2rem;
	overflow: hidden;
}

ul#testimonials li{
	width: 48%;
	color: #AE8D6B;
	background: rgba(174,141,107,.08);
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	float: left;
	display: block;
	margin-right: 2%;
	line-height: 24px;
	line-height: 1.5rem;
}

ul#testimonials li:nth-child(2n){
	margin-left: 2%;
	margin-right: 0;
}

ul#testimonials h3{
	font-family: "ltc-bodoni-175";
	font-size: 16px;
	font-size: 1rem;
	width: 100%;
	border-bottom: 2px solid rgba(174,141,107,.6);
	padding: 0 5px;
	padding: 0 .3rem;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

ul#testimonials p{
	margin-bottom: 0;
	font-size: 14px;
	font-size: .9rem;
}

ul#testimonials .testimonial-content{
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	padding-left: 19px;
	padding-left: 1.2rem;
	padding-right: 5px;
	padding-right: .3rem;
	position: relative;
	font-style: italic;
	font-weight: 400;
}

ul#testimonials .testimonial-content::before{
	content: '“';
	position: absolute;
	left: 2px;
	left: .1rem;
	top: 10px;
	top: .6rem;
	font-family: "ltc-bodoni-175";
	font-size: 35px;
	font-size: 2.2rem;
	font-style: normal;
}

ul#testimonials .testimonial-company{
	font-style: italic;
}

ul#corporate-logos{
	padding: 0 40px;
	padding: 0 2.5rem;
	list-style: none;
}

ul#corporate-logos li{
	display: block;
	float: left;
	margin-right: 16px;
	margin-right: 1rem;
}

ul#corporate-logos li img{
	width: auto;
	height: 35px;
	height: 2.2rem;
}

@media screen and (max-width: 600px){
	ul#testimonials{
		padding: .5rem 1rem;
	}
}



/* About page layout
-----------------------------------------------*/
ul#artists{
	list-style: none;
	clear: both;
	width: 100%;
	padding: 0 35px;
	padding: 0 2.5rem;
	box-sizing:border-box;
  	-moz-box-sizing:border-box;
  	-webkit-box-sizing:border-box;
}

.artist{
	clear: both;
	display: block;
	width: 100%;
	border-top: 2px solid #AE8D6B;
	box-sizing:border-box;
  	-moz-box-sizing:border-box;
  	-webkit-box-sizing:border-box;
  	vertical-align: middle;
  	overflow: hidden;
  	margin-bottom: 26px;
  	margin-bottom: 1.6rem;
  	position: relative;

}

.artist:last-child{
	padding-bottom: 6px;
	padding-bottom: .4rem;
	border-bottom: 2px solid #AE8D6B;
}

.artist p, #band-info p{
	font-size: 14px;
	font-size: .9rem;
	line-height: 27px;
	line-height: 1.7em;
}

.artist-info{
	width: 60%;
	display: block;
	float: left;
}

img.artist-img{
	display: block;
	float: right;
	width: 35%;
	height: auto;
	position: absolute;
	right: 0;
}

img.band-img{
	display: block;
	float: right;
	width: 35%;
	height: auto;
}

#band{
	clear: both;
	padding: 0 40px;
	padding: 0 2.5rem;
	font-size: 14px;
	font-size: .9rem;
	line-height: 27px;
	line-height: 1.7em;
	margin-bottom: 18px;
	margin-bottom: 1.1rem;
	overflow: auto;
}

#band img{
	margin-left: 13px;
	margin-left: .8rem;
}

#band-info{
	width: 60%;
	display: block;
	float: left;
}

@media screen and (max-width: 600px) {
	ul#artists, #band{
		padding: 0 1rem;
	}

	.artist-info{
		position: static;
		display: inline;
		width: auto;
	}

	img.artist-img{
		position: relative;
		margin-left: .4rem;
	}


}




/* Gig Page layout
-----------------------------------------------*/


.gig {
	width:100%;
	display:block;
	border-bottom:2px solid rgba(174,141,107,.6);
	overflow:auto;
	position:relative;
	padding: 6px 40px 13px 40px;
	padding: 0.4rem 2.5rem .8rem 2.5rem;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}

.gig:nth-child(2n){
	background:rgba(174,141,107,.2);
}

.gig-date {
	text-transform:uppercase;
	float:left;
	width:128px;
	width:8rem;
	display:block;
	position: relative;
	top: 5px;
	top: .3rem;

}

.gig-day {
	font-family: "ltc-bodoni-175";
	font-size: 24px;
	font-size: 1.5rem;
	line-height: 24px;
	line-height: 1.5rem;
	display: block;
}

.gig-time {
	font-weight:300;
	display:inline-block;
	background: #AE8D6B;
	color: #fff;
	line-height: 21px;
	line-height: 1.3rem;
	padding: 0 3px 2px 3px;
	padding: 0 .2rem 0.1rem .2rem;
	font-size: 19px;
	font-size: 1.2rem;
}

.gig-info {
	float:left;
	width:60%;
	width:calc(100% - 8rem);
	width:-webkit-calc(100% - 8rem);
	width:-moz-calc(100% - 8rem);
	display:block;
}

.gig-title {
	font-weight:500;
	display:block;
	text-transform: uppercase;
}

.gig-subtitle {
	font-weight:300;
	display:block;
}

.gig-location {
	display:block;
}

.gig-location a {
	font-weight:300!important;
	background: rgba(174,141,107,.2);
	-webkit-transition: background-color .3s;
	-moz-transition: background-color .3s;
	-ms-transition: background-color .3s;
	-o-transition: background-color .3s;
	transition: background-color .3s;

}

@media screen and (min-device-width: 1200px){
.gig-location a:hover {
	color: #fff;
	background: rgba(174,141,107,1);
}
}



/* =Contact Page Layout
-----------------------------------------------*/
ul#contact-numbers{
	z-index: 10;
	background: #AE8D6B;
	position: absolute;
	margin: 0 auto;
	right: 0;
	left: 24px;
	left: 1.5rem;
	bottom: 40px;
	bottom: 2.5rem;
	text-align: left;
	color: #fff;
	line-height: 27px;
	line-height: 1.7rem;
	width: 272px;
	width: 17rem;
	padding: 6px 11px;
	padding: .4rem .7rem;
	border: 1px solid rgba(255,255,255,.2);
}

ul#contact-numbers li.email{
	font-weight: 500;
	margin-bottom: 13px;
	margin-bottom: .85rem;
}

ul#contact-numbers li span{
	position: absolute;
	right: 11px;
	right: .7rem;
	font-weight: 500;
}

ul#contact-numbers li a{
	color: #fff;
}

@media screen and (max-width: 900px){
	ul#contact-numbers{
		left: 0;
	}

}

.contact form{
	padding: 0 40px;
	padding: 0 2.5rem;
	font-size: 14px;
	font-size: .9rem;
	border-top: 2px solid rgba(255,255,255,.7);
	padding-top: 24px;
	padding-top: 1.5rem;
	padding-bottom: 24px;
	padding-bottom: 1.5rem;
	margin-bottom: 16px;
	margin-bottom: 1rem;
}

@media screen and (max-width: 600px) {
	.contact form{
		padding: 0 1rem;
	}
}

.contact form hr{
	border: none;
	height: 2px;
	background: rgba(255,255,255,.7);
	margin: 0 -40px;
	margin: 0 -2.5rem;
}


form label{
	color: #fff;
	font-weight: 300;
}

.gfield_label{
	font-family: "ltc-bodoni-175";
	text-transform: uppercase;
	font-size: 18px;
	font-size: 1.1rem;
	line-height: 32px;
	line-height: 2rem;
}

.ginput_container_radio	ul li input, .ginput_container_radio ul li label, .ginput_container_checkbox ul li input, .ginput_container_checkbox ul li label{
	cursor: pointer;
}


.gfield.hide-label label.gfield_label{
	display: none;
}

.gfield.hide-label{
	margin-top: -14px;
	margin-top: -.9rem;
}

.ginput_container span{
	background-color: rgba(255,255,255,.15);
	padding-left: 8px;
	padding-left: .5rem;
	width: auto !important;
}

.ginput_container span:first-child{
	margin-right: 19px;
	margin-right: 1.2rem;
}

.ginput_container span{
	margin-bottom: 16px;
	margin-bottom: 1rem;
}

.ginput_complex{
	margin-bottom: -16px;
	margin-bottom: -1rem;
}

.ginput_container label{
	width: 96px;
	width: 6rem;
	display: inline-block;
}

.ginput_container input[type=text], .ginput_container input[type=email], .ginput_container input[type=tel], .ginput_container input[type=number] {
	height: 29px;
	height: 1.8rem;
	border: none;
	width: 192px;
	width: 12rem;
	display: inline-block;
	border-radius: 0;
	padding: 0 5px;
	padding: 0 .3rem;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;

}

.ginput_container input, .ginput_container textarea{
	-webkit-transition: background-color .3s;
	-moz-transition: background-color .3s;
	-ms-transition: background-color .3s;
	-o-transition: background-color .3s;
	transition: background-color .3s;
}

.ginput_container input:focus, .ginput_container textarea:focus{
	background:rgba(255,255,255,.7);
}

.ginput_container input[type=radio]{
	background: none !important;
}

.ginput_container input[type=tel], input#input_1_2 {
	width: 264px;
	width: 16.5rem;
}


.ginput_container ul label{
	width: auto;
}

li.gfield{
	margin-bottom: 16px;
	margin-bottom: 1rem;
}

span.name_first, span.name_last, span.ginput_left, span.ginput_right{
	display: inline-block;
	width: 240px;
	width: 15rem;
}

ul.gfield_radio label, ul.gfield_checkbox label{
	margin-left: 8px;
	margin-left: .5rem;
}

.gform_button{
	background-color: #fff;
    border:none;
    font-family: "ltc-bodoni-175";
    text-transform: uppercase;
    font-size: 20px;
    font-size: 1.25rem;
    line-height: 29px;
    line-height: 1.8rem;
    color: #AE8D6B;
    padding: 5px 24px;
    padding: .3rem 1.5rem;
	-webkit-transition: background-color .3s, -webkit-transform .15s;
	-moz-transition: background-color .3s, transform .15s;
	-ms-transition: background-color .3s, transform .15s;
	-o-transition: background-color .3s, transform .15s;
	transition: background-color .3s, transform .15s;
	cursor: pointer;
	border-radius: 0;
    -webkit-appearance: none;
}

@media screen and (min-device-width: 1200px){
	.gform_button:hover{
		background-color: #000;
	}
}

.gform_button:active{
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-ms-transform: scale(1.05);
	-o-transform: scale(1.05);
	transform: scale(1.05);
}

.clear-multi div{
	display: inline-block;
}



.ginput_container textarea, .ginput_container input, .ginput_container select{
	font-family: "franklin-gothic-urw", sans-serif;
	font-weight: 300;
	font-size: 14px;
	font-size: .9rem;
}

.ginput_container select{
	margin-right: 8px;
	margin-right: .5rem;
	font-size: 13px;
	font-size: .8rem;
}

.ginput_container textarea{
	width: 352px;
	width: 22rem;
	border: none;
	resize:none;
	height: 128px;
	height: 8rem;
	padding: 5px;
	padding: .3rem;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	border-radius: 0;
}

.gfield_error div span{
	background: #AE6B6B;
}

.validation_message, .validation_error{
	text-transform: uppercase;
	color: #fff;
	background: #000;
	width: auto;
	display: inline-block;
	line-height: 18px;
	line-height: 1.1rem;
}

 .validation_error{
 	font-size: 16px;
 	font-size: 1rem;
 	background: #AE6B6B;
 }

.gform_confirmation_message{
	padding: 0 40px;
	padding: 0 2.5rem;
	color: #fff;
	font-family: "ltc-bodoni-175";
	font-size: 18px;
	font-size: 1.1rem;
}

@media screen and (max-width: 600px){
	.gform_confirmation_message{
		padding: 0 1rem;
	}
}


/* =Icons
-----------------------------------------------*/
.icon {
	font-family: 'iconfont';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* =Video
-----------------------------------------------*/

#video-toggle-wrap{
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top:0;
	text-align: center;
	-webkit-transition: background-color .5s;
	-moz-transition: background-color .5s;
	-ms-transition: background-color .5s;
	-o-transition: background-color .5s;
	transition: background-color .5s;
}

#video-toggle-wrap.toggle{
	background: rgba(174,141,107,.9);
	z-index: 10;
}

#video-toggle {
	color: #fff;
	position: absolute;
	top:0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: 10;
	margin: auto;
	height: 320px;
	height: 20rem;
	width: 320px;
	width: 20rem;
	overflow: visible;
}

#video-toggle .icon.video{
	font-size: 144px;
	font-size: 9rem;
	opacity: .8;
	line-height: 320px;
	line-height: 20rem;
	-webkit-transition: opacity .5s;
	-moz-transition: opacity .5s;
	-ms-transition: opacity .5s;
	-o-transition: opacity .5s;
	transition: opacity .5s;
}

.toggle #video-toggle .icon.video{
	opacity: .1;
}

#video-toggle-wrap.toggle #video-toggle{

}

.icon#video-toggle:hover{
	opacity: 1;
}

ul.videolinks{
	opacity: 0;
	list-style: none;
	margin-bottom: 0;
	-webkit-transition: opacity .3s;
	-moz-transition: opacity .3s;
	-ms-transition: opacity .3s;
	-o-transition: opacity .3s;
	transition: opacity .3s;
}

.toggle ul.videolinks, ul.videolinks.artist-content {
	opacity: 1;
}

.toggle  ul.videolinks{
	-webkit-transition: opacity .5s .3s;
	-moz-transition: opacity .5s .3s;
	-ms-transition: opacity .5s .3s;
	-o-transition: opacity .5s .3s;
	transition: opacity .5s .3s;
}



#page-image ul.videolinks{
	z-index: 10;
	position: absolute;
	text-align: center;
	top: 0;
	bottom: 0;
	width: 100%;
	height: auto;
	left: 0;
	right: 0;
	margin: auto;
	overflow: visible;
}

ul.videolinks, ul.videolinks li{
	padding: 0;
}

ul.videolinks li{
	display: inline-block;
	margin-bottom: 8px;
	margin-bottom: .5rem;
}

ul.videolinks.artist-content li:nth-child(2n){
	margin-left: 1rem;
}

ul.videolinks li a, #page-image .toggle ul.videolinks li a{
	width: 256px;
	width: 16rem;
	position: relative;
	overflow: hidden;
}

#page-image ul.videolinks li a{
	width: 0;
}



ul.videolinks a .video-image-wrapper{
	position: relative;
	padding-bottom: 56.25%; /* 16:  9 */
	height: 0;
}

ul.videolinks a img{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: .2;
}

ul.videolinks a{
	text-align: center;
	display: inline-block;
	color: #fff;
	background: #AE8D6B;
	border: 1px solid rgba(255,255,255,.2);
	text-align: center;
}

ul.videolinks .icon{
	position: absolute;
	top:48px;
	top:3rem;
	width: 100%;
	text-align: center;
	left: 0;
	font-size: 80px;
	font-size: 5em;
}

ul.videolinks a span{
	position: absolute;
	left: 0;
	bottom: 3px;
	bottom: 0.2rem;
	width: 100%;
	text-transform: uppercase;
	font-size: 14px;
	font-size: .9rem;
	line-height: 16px;
	line-height: 1rem;
}


ul.videolinks a span, ul.videolinks a .icon{
	color: #fff;
}

a.videolink{
	-webkit-transition: background-color .3s, -webkit-transform .15s;
	-moz-transition: background-color .3s, transform .15s;
	-ms-transition: background-color .3s, transform .15s;
	-o-transition: background-color .3s, transform .15s;
	transition: background-color .3s, transform .15s;
}

ul.videolinks.artist-content{
	max-width: 21.5rem;
}

ul.videolinks.artist-content li{
	display: block;
	float: left;
}

ul.videolinks.artist-content li:nth-child(2n){
	margin-left: 16px;
	margin-left: 1rem;
}

ul.videolinks.artist-content li a{
	width: 160px;
	width: 10rem;
}
ul.videolinks.artist-content a img{
	opacity: .2;
}
ul.videolinks.artist-content a{
	background: #AE8D6B;
}
ul.videolinks.artist-content a span, ul.videolinks.artist-content a .icon{
	color: #fff;
}

ul.videolinks.artist-content .icon{
	top:16px;
	top:1rem;
	font-size: 48px;
	font-size: 3em;
}

@media screen and (min-device-width: 1200px){
	ul.videolinks a:hover img{
		opacity: .4;
	}

	a.videolink:hover{
		background-color: #000;
	}
}

@media screen and (max-device-width: 1199px){
	ul.videolinks a img{
		opacity: .7;
	}

	a.videolink{
		background-color: #000;
	}

	ul.videolinks.artist-content a img{
		opacity: .5;
	}

}

@media screen and (max-width: 1200px){
	ul.videolinks.artist-content li a{
		width: 7.4rem;
	}

	ul.videolinks.artist-content a .icon{
		font-size: 1.1rem;
		top: 0;
		line-height: 1.2rem;
	}
}

@media screen and (max-width: 900px){
	#page-image ul.videolinks{
		bottom: 3.3rem;
	}

	ul.videolinks li{
		margin-bottom: 1rem;
	}
}

@media screen and (max-width: 600px){
	#video-toggle {
		height: 5rem;
		width: 14rem;
	}

	#video-toggle .icon.video{
		font-size: 4.5rem;
		line-height: 5rem;
	}
	ul.videolinks li{
		margin-top: 1rem;
	}

	ul.videolinks li a, #page-image .toggle ul.videolinks li a{
		width: 6.5rem;
	}

	ul.videolinks .icon{
		top:0;
		font-size: 1em;
	}
}



a.videolink:active{
	-webkit-transform: scale(1.05);
	-moz-transform: scale(1.05);
	-ms-transform: scale(1.05);
	-o-transform: scale(1.05);
	transform: scale(1.05);
}

/* Video Overlay
-----------------------------------------------*/
#overlay-close-button {
	position: absolute;
	right: 16px;
	right: 1rem;
	top: 16px;
	top: 1rem;
	z-index: 101;
	color: #AE8D6B;
}

#overlay-close-button{
	-webkit-transition: -webkit-transform .15s, color .3s;
	-moz-transition: transform .15s, color .3s;
	-ms-transition: transform .15s, color .3s;
	-o-transition: transform .15s, color .3s;
	transition: transform .15s, color .3s;
}

@media screen and (min-device-width: 1200px){
#overlay-close-button:hover{
	color: #FFF;
}
}

#overlay-close-button:active{
	-webkit-transform: scale(1.15);
	-moz-transform: scale(1.15);
	-ms-transform: scale(1.15);
	-o-transform: scale(1.15);
	transform: scale(1.15);
}

#overlay .icon {
	font-size: 35px;
	font-size: 2.2rem;
}

#overlay {
	opacity: 0;
	position: fixed;
	left: 0;
	top:0;
	width: 100%;
	height: 0;
	z-index: 999;
	overflow: hidden;
	background: #393939;
	background: rgba(0,0,0,0.8);
	-webkit-transition: opacity .3s, height 0s .4s;
	-moz-transition: opacity .3s, height 0s .4s;
	-ms-transition: opacity .3s, height 0s .4s;
	-o-transition: opacity .3s, height 0s .4s;
	transition: opacity .3s, height 0s .4s;
	cursor: pointer;
}

#overlay.toggle {
	height: 100%;
	opacity: 1;
	-webkit-transition: opacity .3s;
	-moz-transition: opacity .3s;
	-ms-transition: opacity .3s;
	-o-transition: opacity .3s;
	transition: opacity .3s;
}

@media screen and (max-device-width: 1024px){
	#overlay {
		position: absolute;
	}

	#overlay-wrap{
		position: absolute;
		left:0;
		top:0;
		height: 100%;
		width: 100%;
	}
}

#video-container {
	position: absolute;
	margin: auto;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border: 1px solid #000;
	text-align: center;
}

#video-wrap {
	position: relative;
	padding-bottom: 56.25%; /* 16:  9 */
	height: 0;
	background: #000;
}

#video-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

@media screen and (max-width: 600px) {
		#video-container {
		width: 100%;
	}
}

/* Audio Player (Soundcloud)
-----------------------------------------------*/
.sc-player {
	width:100%;
	position:relative;
	padding:0 8px;
	padding:0 .45rem;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	background:#AE8D6B;

	color: #fff;
	display:block;
	overflow:hidden;
	height:auto;
	max-height:0;
	opacity:0;
	-webkit-transition:background-color .3s, max-height .6s, opacity .4s;
	-moz-transition:background-color .3s, max-height .6s, opacity .4s;
	-ms-transition:background-color .3s, max-height .6s, opacity .4s;
	-o-transition:background-color .3s, max-height .6s, opacity .4s;
	transition:background-color .3s, max-height .6s, opacity .4s;
}

.sc-player.ready {
	max-height:25rem;
	opacity:1;
}

.sc-player.playing {
	background:#000;
}

.article .sc-player {
	margin-top:-16px;
	margin-top:-.9rem;
	margin-bottom:.9rem;
}

.sc-player .sc-controls div {
	font-size:22px;
	font-size:1.2rem;
	line-height:40px;
	line-height:2.2rem;
	cursor:pointer;
	display:block;
	float:left;
}

.sc-player .sc-play, .sc-player.playing .sc-pause {
	display:block!important;
}

.sc-player .sc-pause, .sc-player.playing .sc-play {
	display:none!important;
}

.sc-play, .sc-pause {
	-webkit-transition:color .3s, transform .15s;
	-moz-transition:color .3s, transform .15s;
	-ms-transition:color .3s, transform .15s;
	-o-transition:color .3s, transform .15s;
	transition:color .3s, transform .15s;
}

@media screen and (min-device-width: 1200px){
.sc-play:hover {
	color:#000;
}

.sc-pause:hover {
	color:#fff;
}
}

.sc-play:active, .sc-pause:active {
	-webkit-transform:scale(1.15);
	-moz-transfoim:scale(1.15);
	-ms-transform:scale(1.15);
	-o-transform:scale(1.15);
	transform:scale(1.15);
}

.sc-scrubber {
	position:absolute;
	top:10px;
	top:.55rem;
	right:8px;
	right:.45rem;
	height:18px;
	height:1rem;
	width:60%;
	width:-webkit-calc(100% - 3rem);
	width:-moz-calc(100% - 3rem);
	width:calc(100% - 3rem);
	overflow:hidden;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	z-index:50;
	background:rgba(255, 255, 255, 0.3);
}

.playing .sc-scrubber {
	cursor:pointer;
}

.sc-scrubber .sc-time-span {
	height:100%;
	position:relative;
}

.sc-scrubber .sc-buffer, .sc-scrubber .sc-played {
	height:100%;
	position:absolute;
	top:0;
}

.sc-scrubber .sc-time-indicators span {
	position:absolute;
	font-weight:500;
	font-size:.7em;
	right:.3em;
	top:-.55em;
}

.musicproject .sc-scrubber .sc-time-indicators span {
	top:-.15em;
}

.sc-scrubber .sc-time-span img {
	height:0;
	width:100%;
}

.sc-scrubber .sc-buffer, .sc-scrubber .sc-played {
	background-color:#fff;
}

.sc-scrubber .sc-played {
	background:rgba(174,141,107,.6);
}

.sc-player ol.sc-trackslist {
	clear:both;
	position:relative;
	width:100%;
	list-style:none;
	text-transform:uppercase;
}

.sc-player ol.sc-trackslist li {
	cursor:pointer;
	border-top:1px solid rgba(255, 255, 255, 0.3);
}

.sc-player ol.sc-trackslist li a {
	font-size:.75em;
	font-weight:300;
	color: #fff;
}

.sc-player.playing ol.sc-trackslist li.active a, .sc-player.playing ol.sc-trackslist li.active {
	font-weight:500;
}

.sc-track-duration {
	display:inline-block;
	font-size:.6em!important;
	margin-left:11px;
	margin-left:.6rem;
}

@media screen and (max-device-width:1024px) {
	.sc-player {
	line-height:2.3rem;
}

.sc-player .sc-controls div {
	font-size:2rem;
	line-height:4rem;
}

.sc-scrubber {
	top:1.1rem;
	height:1.8rem;
	width:-webkit-calc(100% - 4rem);
	width:-moz-calc(100% - 4rem);
	width:calc(100% - 4rem);
}

.sc-scrubber .sc-time-indicators span {
	top:-.4rem;
}

.musicproject .sc-scrubber .sc-time-indicators span {
	top:.2rem;
}
}
@media screen and (max-width: 600px) {
	.sc-player .sc-controls div {
		font-size:1.8rem;
		line-height:3rem;
	}

	.sc-scrubber {
		top:.8rem;
		height:1.3rem;

	}
}


/*IE 8 Fixes*/
html.ie8{
	font-family: "franklin-gothic-urw-n3", "franklin-gothic-urw", sans-serif;
}

.ie8 b, .ie8 strong, .ie8 h3, .ie8 #site-navigation a, .ie8 .gig-title, .ie8 ul#contact-numbers li.email, .ie8 ul#contact-numbers li span{
	font-family: "franklin-gothic-urw-n5", "franklin-gothic-urw", sans-serif;
}

.ie8 ul#testimonials .testimonial-content{
	font-family: "franklin-gothic-urw-i4", "franklin-gothic-urw", sans-serif;
}

.ie8 #site-logo{
	width: 285px;
	height: 55px;
	background-image: url('img/logo.png');
}

.ie8 #site-logo img{
	display: none;
}

.ie8 #image-header img{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:auto;
}

.ie8 .frontpage #image-header img{
	width:100%;
}


.ie8 #frontpage-gigs a{
	background: #fff;
}