@charset "utf-8";

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,font,img,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 { margin:0; padding:0; border:0; outline:0; font-weight:inherit; font-style:inherit; font-size:100%; font-family:inherit; vertical-align:baseline; }
:focus { outline:0; }
a:active { outline:none; }
ol,ul { list-style:none; }
table { border-collapse:separate; border-spacing:0; }
caption,th,td { text-align:left; font-weight:normal; }
blockquote:before,blockquote:after,q:before,q:after { content:""; }
blockquote,q { quotes:"" ""; }

body {
	background-color:#e5e5e5;
	margin:0; padding:0;
	font-family: 'Wire One', sans-serif;
	letter-spacing: 0.5px;
	color:#6a6d77;
}

a, a:visited, a:active { color:#f9a01b; }
a:hover { text-decoration:none; }

#header { 
	position:fixed; z-index:3;
	width: 100%; height:200px;
	background: rgb(0,0,0,0.5); 
	background: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 10%, rgba(0,0,0,0) 100%);
}



.logo { position:absolute; width:262px; height:146px; left:50%; margin-left:-470px; top:25px;  z-index:999; }

#social { position:relative; width:100%; text-align:right; }
#social li { width: 30px; height: 30px; display:inline-block; margin:25px 0 0 15px; }
#social li:last-child { margin-right: 48px; }
#social img { width:30px; height:30px; }

#social #lingua img { width: 24px; height: 16px; padding-bottom: 6.5px; }

#social #facebook { background-image:url('../imgs/social/facebook.gif'); background-repeat:no-repeat; } #social #facebook:hover { background-position:0 -30px; }
#social #blogger { background-image:url('../imgs/social/blogger.gif'); background-repeat:no-repeat; } #social #blogger:hover { background-position:0 -30px; }
#social #youtube { background-image:url('../imgs/social/youtube.gif'); background-repeat:no-repeat; } #social #youtube:hover { background-position:0 -30px; }
#social #soundcloud { background-image:url('../imgs/social/soundcloud.gif'); background-repeat:no-repeat; } #social #soundcloud:hover { background-position:0 -30px; }

#menu { position:relative; width:590px; left:50%; margin:25px 0 0 -120px; text-align:center; border-top:1px solid #696969; border-bottom:1px solid #696969; }
#menu li { display:inline-block; padding:10px 20px; }

#menu li a, #menu li a:visited { 
	color:#e5e5e5;
	text-decoration:none; text-transform:capitalize;
	font-size:2em; font-weight:lighter;
}

#menu li a:hover, #menu li a:active, #menu li a.active { color:#f9a01b; }

#content { 
	position:relative; width:100%; top:200px; z-index:2;
	font-family:"Helvetica Neue", Helvetica, sans-serif;
	font-size:16px; 
	line-height:26px;
	font-weight: lighter;
}
#content p { margin-bottom: 25px; }
#content h1 { margin-bottom:46px; color:#f9a01b; font-family: 'Wire One', sans-serif; font-size:50px; line-height: 46px; }
#content h2 { margin-top: 16px; margin-bottom:46px; color:#f9a01b; font-family: 'Wire One', sans-serif; font-size:50px; text-transform:capitalize; }
#content h3 { margin-bottom:36px; color:#f9a01b; font-family: 'Wire One', sans-serif; font-size:30px; text-transform:capitalize; }
#content h3 span { margin:0; color:#e5e5e5; font-family: 'Wire One', sans-serif; font-size:30px; text-transform:none; float:none; }
#content strong { font-weight:bold; font-style:italic; }
#content hr { margin:15px 0 25px 0; border:none; height:1px; background-color:#cacaca; }
#capa { 
	position:relative; width:100%; 
	top: -200px; margin-bottom: -200px;
	background-color:#333438; background-image:url('../imgs/bkg.gif'); 
	text-align:center; 
}

#release { width:100%; background-color:#f9a01b; padding:25px 0; }
#release div { width: 100%; max-width: 924px; margin: 0 auto; text-align: center; color: #FFFFFF; }
#release img { width: auto; height: 24px; position: relative; margin: -24px 5px -5px 5px; fill: #FFFFFF; }

#artista, #carreira { width: 100%; max-width:924px; padding:50px; margin:0 auto; }

#artista figure { width:325px; float:right; bottom:0; margin-left:25px; margin-top: 0px; clear:both; }
#artista figure img { width:100%; height:auto; }
#artista figure a {
	display:block; padding:8px 0;
	background-color:#f9a01b; color:#FFFFFF;
	text-align:center; text-decoration:none; text-transform:uppercase; font-weight:bold;
}
#artista figure a:hover { background-color:#df8f18; }
#artista figure span.fechar { display: none; }


#artista figcaption span {  
	display: none; padding: 16px;
	background-color:#333438; color:#eee;
	font-size: 12px; font-weight:normal; text-transform:inherit; text-align: left;
}
#artista figcaption strong { font-size: 14px; }
#artista figcaption li strong { font-size: 12px; }
#artista figcaption h3 { margin-bottom: 8px; }
#artista figcaption h4 { font-size: 16px; font-weight:bold; margin: -25px auto auto auto; }
#artista figcaption hr { margin-bottom: 16px; }

#fotos { width:100%; background-color:#333438; text-align:center; clear:both; height: auto; }
#fotos #slides { display: run-in; width: 100%; margin:0 auto; padding:35px 0; overflow:hidden; }

#fotos .prev, #fotos .next  { 
	position:absolute; 
	left:50%;
	z-index:2;
	width:40px; height:40px; 
	padding:0; margin:250px 0 0 -505px;
	background-color: transparent;
	background-image:url('../imgs/prev.png'); background-position:-6px;
}
#fotos .next { 
	float:right; margin:-290px 0 0 465px;
	background-image:url('../imgs/next.png'); background-position:-8px;
}
#fotos .prev:hover, #fotos .next:hover { 
	width:40px; height:40px; 
	padding:0; margin:250px 0 0 -505px; 
	background-position:-7px;
}
#fotos .next:hover { margin:-290px 0 0 465px; }

#fotos img { width:560px; height:420px; background-color:#e5e5e5; margin:15px; padding:5px; }
#fotos img:hover { width:568px; height:428px; padding:1px; }

#discografia { width:100%; background-color:#fff; }
#discografia #soundcloud { width: 100%; max-width:925px; height:510px; padding:50px; margin:0 auto; }
#discografia iframe { width:100%; height:450px; }

#contato { width:100%; background-color:#333438; }
#contato #formulario { width: 100%; max-width:925px; margin:0 auto; padding:50px; }
#contato input { width: 225px; padding:25px; margin:0 15px; border:none; font-size:18px; color:#6a6d77; -webkit-appearance:caret; }
#contato textarea { width: 835px; padding:25px; margin:25px 15px; border:none; font-size:18px; color:#6a6d77; -webkit-appearance:caret; font-family:"Helvetica Neue", Helvetica, sans-serif; }
#contato input[type='reset'] { background-color:#e5e5e5; }
#contato input[type='reset']:hover { background-color:#cfcfcf; cursor: pointer; }
#contato input[type='submit'] { background-color:#f9a01b; color: #FFFFFF; }
#contato input[type='submit']:hover { background-color: #df8f18; cursor: pointer; }

#contato span { 
	float:right; text-align:right; 
	margin:-70px 25px 0 0;
	font-size:30px; line-height:32px; 
	color: #f9a01b;
	font-weight: normal;
}
#contato span a, #contato span a:visited, #contato span a:active { color:#f9a01b; font-size:20px; margin-right:8px; font-weight: lighter;  }
#contato span a:hover { text-decoration:none; }

#copyright { width: 100%; text-align: center; }
#copyright img { width: auto; height: 72px; margin: 25px auto; }	


	.comCor {
		background-color: #333438 !important;
		-webkit-transition: background 0.5s linear;
		-moz-transition: background 0.5s linear;
		-ms-transition: background 0.5s linear;
		-o-transition: background 0.5s linear;
		transition: background 0.5s linear;
		height: 160px !important;
	}
	.comCor .logo { 
		width: 200px; height: auto; 
		-webkit-transition: width 0.2s linear;
		-moz-transition: width 0.2s linear;
		-ms-transition: width 0.2s linear;
		-o-transition: width 0.2s linear;
		transition: width 0.2s linear;
	}
	.semCor {
		background-color: transparent !important;
		-webkit-transition: background 0.5s linear;
		-moz-transition: background 0.5s linear;
		-ms-transition: background 0.5s linear;
		-o-transition: background 0.5s linear;
		transition: background 0.5s linear;
	}
	.semCor .logo { 
		-webkit-transition: width 0.2s linear;
		-moz-transition: width 0.2s linear;
		-ms-transition: width 0.2s linear;
		-o-transition: width 0.2s linear;
		transition: width 0.2s linear;
	}

	#fotos.mobile { display: none; }
	
	#album { 
		padding: inherit !important;
		width: inherit !important;
	}

@media only screen and (max-width: 768px) {
	.logo { left: 20px; margin:0; top: 20px; width: 72px; height: auto; }
	.comCor .logo { width: 72px; }

	#header { background: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 75%, rgba(0,0,0,0) 100%); }
	#header, .comCor { height: 124px !important; }

	#social li:last-child { margin-right: 20px; }
	#social li { width: 20px; height: 20px; margin-left: 8px; background-size: cover; }
	#social #lingua img { padding-bottom: 12px; margin-left: -10px; }


	#menu { width: 100%; left:0; margin: 16px 0; }
	.comCor #menu { margin:16px 0; }
	#menu li { padding:8px 6px; }
	#menu li a, #menu li a:visited { font-size:1.5rem; }

	#capa { margin-bottom: -204px; }
	#capa #video { height: 320px; margin-top: 55px; margin-bottom: -7px; }

	#release { position: relative; top: -64px; margin:0 0 -64px 0; padding: 0 !important; width: 100% !important; font-size: 0.8em; }
	#release span { display: block; margin-top: 16px; }
	#release img { height: 20px; }

	#artista figure { width: 100% !important; margin: 0 0 32px 0; }

	#content { font-size: 1.3rem; font-weight: 300; line-height: 150%; }
	#content div { width: calc(100% - 40px); padding: 32px 20px; }
	#content #capa, #content #discografia #soundcloud, #content #contato #formulario { width: 100%; padding: 0; }

	#contato input, #contato textarea { width: calc(100% - 50px); margin: 0; }
	#contato input { margin-bottom: 8px; }
	#contato input[type=reset] { display: none; }
	#contato input[type=submit] { width: calc(100%); }
	#contato span { float: none; display: block; margin-top: 24px; width: 100%; text-align: center; }

	#fotos { width: 100% !important; padding: 40px 0 !important; display: block; }
	#fotos #slides { margin: 0 !important; padding: 0 !important; }
	#fotos #slides > div { width: 100%; padding: 0 10px !important; }
	#fotos #slides div { width: 100%; }
	/* #fotos .slick-slide { width: calc(100% - 40px); margin: 0; } */
	#fotos img { width: 100%; max-width: 360px; margin: 0; height: auto; max-height: 270px; }
	#fotos .prev, #fotos .next  { display: none !important; }
	/*
	#fotos #slides { max-width: calc(100% + 40px) !important; height: auto; padding: 32px 0; }
	#fotos .prev, #fotos .next  { margin: 248px 0 0 -160px; }
	#fotos .next { margin:-310px 0 0 132px; }
	#fotos .prev:hover, #fotos .next:hover { padding:0; margin:248px 0 0 -160px; }
	#fotos .next:hover { margin:-310px 0 0 132px; }

	#fotos img { width: 100px; height: 75px; margin: 8px; }
	#fotos img:hover { width:102px; height:77px; }
	*/
	#fotos { display: none !important; }
	#fotos.mobile { 
		display: block !important; 
		padding: 12px 0 !important;
	}
	#sequencia { 
		width: inherit !important; 
		padding: inherit !important;
	}
	#sequencia div {
		padding: 12px 20px !important;
	}
}