/*
Theme Name: The Coathangers
Theme URI: http://jazzatkin.com
Author: JAZZatkin
Author URI: http://jazzatkin.com/

*/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{font-size:100%;font:inherit;padding:0;border:0;margin:0;vertical-align:baseline}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}.clear{clear:both}
.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}.screen-reader-text{clip:rect(1px, 1px, 1px, 1px);position:absolute !important;}

*{
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	}
body{
	background-color: #11ae9b;
	font-family: Futura;
	font-size: 16px;
	}
.landingPage img {
    max-width: 100%;
	height: auto;
	}
a{
	text-decoration: none;
	}
#loader-wrapper{
    position: fixed;
    top: 0;
    width: 100vw;
    height: 100vh;
    background: #11ae9b;
    z-index: 1000;
	color: #FFF;
	display: flex;
	align-items: center;
  	justify-content: center;
	font-size: 30px;
	}
img.loading{
	opacity: 0;
	transition: opacity 1s ease-in;
	transition-delay: 0.5s;
}
#landing{
	width: 100vw;
	height: calc(100vh - 130px);
	display: block;
	background-position: center center;
	background-repeat: no-repeat;
	background-color: #11ae9b;
	position: relative;
	box-sizing: border-box;
	margin-bottom: 30px;
	}
#landing img{
	width: 100%;
	height: 100%;
	object-fit: contain;
	}
@media screen and (max-width: 1100px) {
	#landing{
		width: 100%;
		height: unset;
		overflow: hidden;
		margin-bottom: 20px;
		margin-top: 80px;
		z-index: 1;
		}
	#landing img{
		width: 100%;
		height: unset;
		height: auto;
		object-fit: unset;
	}
}
#header{
	width: 100vw;
	height: 80px;
	position: sticky;
	top: 0;
	left: 0;
	background-color: #11ae9b;
	z-index: 500;
	opacity: 0;
	transform: translateY(-100%);
	transition: transform 1s ease-in;
	transition-delay: 0.5s;
	}
#menuContainer{
	width: 100%;
	display: flex;
	}
.menuItem{
	font-family: Futura;
	text-transform: uppercase;
	color: #e4e075;
	margin: 0px 10px 0px 30px;
	line-height: 80px;
	width: 180px;
	letter-spacing: 1px;
	}
.menuItem.right{
	margin: 0px 30px 0px 10px;
	}
.menuItem a{
	color: #e4e075;
	}
.menuItem.right a{
	font-size: 20px;
	margin-left: 5px;
	}
.menuItem a:hover{
	color: #FFF;
	}
.menuItem.right{
	text-align: right;
	}
#menuContainerContainer{
	display: none;
	}
ul#menu{
	flex-grow: 1;
	list-style-type: none;
	text-align: center;
	font-family: Futura;
	text-transform: uppercase;
	color: #bef2aa;
	}
ul#menu li{
	display: inline-block;
	line-height: 80px;
	margin: 0px 10px;
	letter-spacing: 1px;
	}
ul#menu li::before{
	content: "";
	}
ul#menu li a{
	color: #bef2aa;
	}
ul#menu li a.active{
	color: #FFF;
	}
ul#menu li a:hover{
	color: #FFF;
	}
.icon{
	display: none;
	}
@media screen and (max-width: 1100px) {
	#header{
		position: fixed;
		}
	.icon{
		display: block;
		line-height: 80px;
		margin: 0px 30px;
		flex-grow: 1;
		text-align: right;
		color: #e4e075;
		}
	.icon .fa-times{
		color: #FFF;
		}
	.icon:hover{
		color: #FFF;
		}
	.icon:hover .fa-times{
		color: #e4e075;
	}
	.menuItem.right{
		display: none;
		}
	ul#menu{
		display: none;
		}
	#menuContainerContainer.menu{
		display: none;
		}
	#menuContainerContainer.menu.responsive {
		position: fixed;
		top: 80px;
		left: 0;
		z-index: 600;
		height: calc(100vh - 80px);
		width: 100%;
		display: block;
		bottom: 0;
		right: 0;
		display: flex;
		flex-direction: column;
		justify-content: center;
		background-color: #e4e075;
		}
	#menuContainerContainer.menu.responsive ul#menuResponsive{
		text-align: center;
		font-family: Futura;
		text-transform: uppercase;
		color: #bef2aa;
		display: block;
		background-color: #e4e075;
		border-top: 0;
		max-height: 100%;
		overflow-y: scroll;
		position: relative;
		}
	#menuContainerContainer.menu.responsive ul#menuResponsive li{
		display: block;
		margin: 0;
		line-height: 80px;
		}
	#menuContainerContainer.menu.responsive ul#menuResponsive li a{
		color: #FFF;
		display: block;
		width: 100%;
		line-height: 80px;
		border-bottom: 0;
		}
	#menuContainerContainer.menu.responsive ul#menuResponsive li:last-child a{
		border-bottom: 0;
		}	
	#menuContainerContainer.menu.responsive ul#menuResponsive li a:hover{
		background-color: #bef2aa;
		}
	}

#down{
	width: 100vw;
	height: 80px;
	line-height: 80px;
	color: #bef2aa;
	text-align: center;
	background-color: transparent;
	position: absolute;
	bottom: 0;
	left: 0;
	opacity: 0;	
	transition: opacity 1s ease-in;
	transition-delay: 0.5s;
	}
.section{
	width: 100%;
	overflow: hidden;
	padding: 50px;
	box-sizing: border-box;
	text-align: center;
	opacity: 0;
	transition: opacity 1s ease-in;
	transition-delay: 0.5s;
	}
.section.preorder{
	background-color: #11ae9b;
	padding: 20px 50px 50px 50px;
	}
.section.landingPage{
	padding: 20px 50px 20px 50px;
	}
.section.fourohfour, .section.landingPage{
	color: #FFF;
	margin-top: 30px;
	margin-bottom: 0px;
	line-height: 1.4em;
	}
.section.fourohfour a, .section.landingPage a{
	color: #e4e075;	
	}
.section.fourohfour a:hover, .section.landingPage a:hover{
	color: #FFF;
	}
@media screen and (max-width: 1100px) {
	.section.fourohfour, .section.landingPage{
		margin-top: 110px;
		}
	}
@media screen and (max-width: 900px) {
	#down{
		display: none;
		}
	.section{
		padding: 20px 10px;
		}
	.section.fourohfour, .section.landingPage{
		margin-top: 100px;
		}
	.section.preorder, .section.landingPage{
		padding: 20px 20px 20px 20px;
		}
	
	}
@media screen and (max-width: 700px) {
	.section.fourohfour, .section.landingPage{
		margin-top: 100px;
		margin-bottom: 30px;
		}
	}
.sliderContainer{
	width: 100%;
	overflow: hidden;
	position: relative;
	}
.slide{
	width: 100%;
	}
.cycleNext{
	position: absolute;
	top: calc(50% - 85px);
	right: 50px;
	transform: translateY(-50%);
	z-index: 200;
	color: #FFF;
	font-size: 30px;
	}
.cycleNext.videoNav{
	top: calc(50% - 40px);
	}
.cyclePrev{
	position: absolute;
	top: calc(50% - 85px);
	left: 50px;
	transform: translateY(-50%);
	z-index: 200;
	color: #FFF;
	font-size: 30px;
	}
.cyclePrev.videoNav{
	top: calc(50% - 40px);
	}
.cycleNext:hover, .cyclePrev:hover{
	cursor: pointer;
	color: #e4e075;
	}
img.albumArtwork{
	width: 40vw;
	max-width: 600px;
	border-radius: 0%;
	border: 5px solid #FFF;
	box-sizing: border-box;
	}
@media screen and (max-width: 900px) {
	img.albumArtwork{
		max-width: unset;
		width: calc(100% - 100px);
		}
	.cycleNext{
		right: 10px;
		font-size: 20px;
		}
	.cyclePrev{
		left: 10px;
		font-size: 20px;
		}
	}
h1{
	font-family: Futura;
    padding: 45px 0px 10px 0px;
	font-weight: bold;
	font-size: 25px;
	text-transform: uppercase;
	}
h1.albumTitle{
	color: #bef2aa;
	}
@media screen and (max-width: 900px) {
	h1{
		font-size: 20px;
		padding: 20px 0px 5px 0px;
		}
	
	}
.releaseMeta{
	display: flex;
	flex-direction: column;
	}
span.releaseDate{
	display: block;
    font-family: Futura;
    text-decoration: none;
	line-height: 1.2em;
	width: 100%;
	font-size: 12px;
	font-weight: 700;
	text-align: center;
	text-transform: uppercase;
	color: #FFF;
	padding: 10px 0px 20px 0px;
	}
a.albumBuy {
    font-family: Futura;
    text-decoration: none;
    color: #e4e075;
	line-height: 1.2em;
	text-align: center;
	padding: 15px 40px;
	border: 1px solid #e4e075;
	align-self: center;
	font-size: 12px;
	font-weight: 700;
	}
a.albumBuy:hover{
	background-color: #e4e075;
	color: #FFF;
}
.section.videos{
	background-color: #bef2aa;
	}
@media screen and (max-width: 900px) {
	span.releaseDate{
		padding: 10px 0px;
		}
	.section.videos{
		padding: 20px 10px;
		}
	a.albumBuy{
		margin-top: 5px;
		}
	}
.video{
	width: 80%;
    height: 0px;
    padding-bottom: 40%;
    display: block;
    margin: 0 auto;
    border: 5px solid #FFF;
    border-radius: 0px;
	position: relative;
	}
@media screen and (max-width: 900px) {
	.video{
		width: calc(100% - 100px);
		}
	}
.video img.videoStill{
	width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    position: absolute;
	z-index: 1;
	}
.video:hover img.videoStill{
	mix-blend-mode: multiply;
	}
.video:hover .fas{
	}
.video:hover img{
	filter: grayscale(100%) brightness(120%);
	}
.video::after{
	display: block;
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #fe956c;
    mix-blend-mode: multiply;
	}
.video .fas{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	color: #FFF;
	font-size: 50px;
	z-index: 50;
	}
h1.videoTitle{
	color: #11ae9b;
	/* color: #bef2aa; */
	}
.fancybox-bg{
	background: #11ae9b !important;
	}
.fancybox-content{
	border: 2px solid #FFF;
	}
.fancybox-button{
	height: 80px;
	margin-right: 15px;
	}
.fancybox-button, .fancybox-button:link, .fancybox-button:visited{
	color: #e4e075;
	background: transparent !important;
	}
.fancybox-button:hover{
	color: #FFF;
	}
.section.tour{
	padding: 50px 50px 30px 50px;
	background-color: #11ae9b;
	}
.inner{
	width: 80%;
	overflow: hidden;
	margin: 0 auto;
	box-sizing: border-box;
	}
@media screen and (max-width: 900px) {
	.section.tour{
		padding: 20px 10px 0px 10px;
		}
	.inner{
		width: 100%;
		}
	}
.bit-widget{
    font-size: 14px !important;
    font-family: Futura !important;
	}
.bit-widget .bit-offers{
	border: 1px solid #e4e075 !important;
	color: #e4e075 !important;
	background-color: #11ae9b !important;
	}
.bit-offers.bit-button:hover{
	background-color: #e4e075 !important;
	color: #FFF !important;
	}
a.bit-rsvp.bit-button:hover{
	background-color: #bef2aa !important;
	color: #FFF !important;
	}
.bit-nav-bar-container{
	display: none !important;
	}
.bit-no-dates-container{
	border-top: 0px !important;
	padding: 50px 0px 60px 0px !important;
	}
.bit-widget .bit-top-track-button{
	display: none !important;
}
.bit-widget .bit-no-dates-container .bit-track-button{
	margin: 20px 0px 0px 0px !important;
}
a.bit-details {
    font-size: 16px !important;
	}
.bit-widget.bit-layout-ipad .bit-event .bit-details{
	text-align: left !important;
	}
.section.bio{
	background-color: #bef2aa;
	}
.section.bio p{
	font-size: 16px;
	line-height: 1.6em;
	padding-top: 20px;
	color: #1c625a;
	text-align: center;
	}
.bit-widget .bit-play-my-city-button{
	display: none !important;
}
@media screen and (max-width: 900px) {
	.bio .inner{
		padding: 0px 20px;
		}
	.section.bio p{
		padding-top: 10px;
		text-align: justify;
		}
	}
h1.bioTitle{
	color: #11ae9b;
	}
h1.bioTitle:first-child{
	padding-top: 0px;
	padding-bottom: 0px;
	}
.section.photos{
	background-color: #11ae9b;
	padding: 50px 45px;
	}
@media screen and (max-width: 900px) {
	.section.photos{
		padding: 0px 5px 20px 5px;
		}
	}
#sb_instagram{
	padding-bottom: 0px !important;
}
.sbi_photo {
    box-sizing: border-box;
    border: 5px solid #FFF;
    border-radius: 100%;
	}
@media screen and (max-width: 900px) {
#sb_instagram.sbi_col_3.sbi_disable_mobile #sbi_images .sbi_item{
	padding: 5px 2% !important;
	}
}
h1.photoTitle{
	color: #bef2aa;
	padding: 15px 0px 20px 0px;
	}
@media screen and (max-width: 900px) {
	h1.photoTitle{
		padding: 0px 0px 10px 0px;
		}
	}
.section.contact{
	background-color: #bef2aa;
	color: #1c625a;
	line-height: 1.4em;
	}
section.contact p {
    font-size: 16px;
    line-height: 1.6em;
}
h1.contactTitle{
	color: #11ae9b;
	padding: 20px 0px;
	}
@media screen and (max-width: 900px) {
	h1.contactTitle{
		padding: 10px 0px;
		}
	}
h1.contactTitle:first-child{
	padding-top: 0px;
	}
#footer{
	width: 100vw;
	overflow: hidden;
	padding: 50px;
	box-sizing: border-box;
	box-sizing: border-box;
	background-color: #11ae9b;
	}
a.continue{
	margin-top: 50px;
	height: 45px;
	padding: 0px 25px;
	border: 1px solid #e4e075;
	font-size: 12px;
	color: #e4e075;
	font-weight: 700;
	display: inline-block;
	line-height: 45px;
	}
a.continue:hover{
	border: 1px solid #FFF;
	color: #e4e075 !important;
	background-color: #FFF;
	}
@media screen and (max-width: 700px) {
	#footer{
		padding: 20px;
		}
	a.continue{
		margin-top: 20px;
		}
	}
.mailingList{
	width: 600px;
	overflow: hidden;
	margin: 0 auto 30px auto;
	box-sizing: border-box;
	padding: 0px 20px;
    }
@media screen and (max-width: 740px) {
	.mailingList{
		width: 100%;
		padding: 0px;
		margin: 0 auto 20px auto;
		}
	}
.mailingList input[type="email"]{
	font-family: Futura;
	font-weight: 400;
	border-radius: 0;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
	width: calc(100% - 150px);
    height: 45px;
    background: transparent;
    margin: 0px;
 	text-shadow: none !important;
    padding: 0px 10px;
	line-height: 45px;
    font-size: 15px;
	border: 1px solid #FFF;
  	color: #FFF;
  	text-decoration: none;
	float: left; 
	-webkit-font-smoothing: antialiased;
	-webkit-appearance: none;
	box-sizing: border-box;
	}
@media screen and (max-width: 700px) {
	.mailingList input[type="email"]{
		width: 100%;
		border-bottom: 0px;
		}
	}
.mailingList input[type="email"]:focus{
	outline: none;
	}
.mailingList input[type="submit"]{
	font-family: Futura;
	border-radius: 0;
	height: 45px;
	width: 150px;
	background: transparent;
	margin: 0px;
	padding: 0px;
   	background-color: transparent;
 	cursor: pointer;
	display: inline-block;
	font-size: 12px;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
	color: #FFF;
	border-right: 1px solid #FFF;
	border-left: 0px solid #FFF;
	outline: none;
	float: left;
	-webkit-appearance: none;
	-webkit-font-smoothing: antialiased;
	box-sizing: border-box;
	font-weight: 700;
	text-transform: uppercase;
	}
.mailingList input[type="submit"]:hover{
	background-color: #FFF;
	color: #11ae9b;
	}
@media screen and (max-width: 700px) {
	.mailingList input[type="submit"]{
		width: 100%;
		background-color: #FFF;
		color: #11ae9b;
		}
	.mailingList input[type="submit"]:hover{
		background-color: #e4e075;
		color: #FFF;
		border: 2px solid #e4e075;
		}
	}
.footerSocials{
	width: 100%;
	text-align: center;
	}
.footerSocials a{
	color: #FFF;
	margin: 0px 2px;
	font-size: 25px;
	}
.footerSocials a:hover{
	color: #e4e075;	
	}
.credit{
	width: 100%;
	text-align: center;
	color: #e4e075;
	text-transform: uppercase;
	padding-top: 30px;
	font-size: 14px;
	}
@media screen and (max-width: 740px) {
	.credit{
		padding-top: 20px;
		}
	}
.credit a{
	color: #bef2aa;
	}
.credit a:hover{
	color: #FFF;
	}