@import url("http://fonts.googleapis.com/css?family=Rokkitt");
@import url("../font/font.css");
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 { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; }

html { line-height: 1; }

ol, ul { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; }

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

a img { border: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; }

.f-left { float: left; }

.f-right { float: right; }

.center { width: 1240px; margin: 0 auto; }

.clear { clear: both; }

* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

a { color: inherit; text-decoration: none; }

body { background-color: #000; color: #FFF; font-family: "Avenir", Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 16px; font-size: 1rem; min-width: 620px; }

.seta { display: block; width: 44px; height: 94px; position: absolute; background-position: center center; background-repeat: no-repeat; }

.seta.esquerda { background-image: url(../img/seta-esquerda.png); }

.seta.direita { background-image: url(../img/seta-direita.png); }

#header { position: relative; width: 100%; height: 1080px; }

#player { position: fixed; z-index: 1; top: 0; width: 1920px; height: 1080px; left: 50%; margin-left: -960px; background: transparent url(../img/bkg-topo-low.jpg) no-repeat center top; }

#overlay { display:none; }

#logo { width: 610px; height: 374px; background: transparent url(../img/logo-low.png) no-repeat center center; position: absolute; z-index: 3; left: 50%; top: 260px; margin-left: -282px; }

#content { position: relative; z-index: 4; }

#agenda { width: 100%; height: 566px; background-color:#000; }

#proximo-show { float: left; margin-top: 120px; }

#proximo-show h2 { font-size: 190px; font-size: 11.875rem; text-transform: uppercase; line-height: 0.9em; }

#proximo-show h2 span { font-size: 400px; font-size: 25rem; font-family: "Rokkitt", "Avenir", Helvetica, Arial, sans-serif; }

#proximo-show p { font-size: 42px; font-size: 2.625rem; margin-left: 10px; }

#proximos-shows { margin-top: 50px; }

#proximos-shows li { float: left; margin-right: 35px; }

#proximos-shows p { display: block; float: left; color: #9195A1; }

#proximos-shows p.dia { display: block; width: 90px; height: 90px; text-align: center; line-height: 84px; border: 5px solid #9195A1; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; font-size: 64px; font-size: 4rem; font-family: "Rokkitt", "Avenir", Helvetica, Arial, sans-serif; }

#proximos-shows p.mes { font-size: 55px; font-size: 3.4375rem; text-transform: uppercase; margin: 17px 25px 0; }

#proximos-shows p.local { font-size: 22px; font-size: 1.375rem; max-width: 220px; margin-top: 20px; letter-spacing: 0.04em; }

#comprar { width: 100%; height: 80px; background: #FFF url(../img/bkg-musica.png) repeat; }

#comprar h2 { color: #880332; float: left; width: 120px; font-family: "Rokkitt", "Avenir", Helvetica, Arial, sans-serif; font-size: 20px; font-size: 1.25rem; text-transform: uppercase; margin: 32px 10px 0 0; }

#comprar h2.lojas { color: #333; margin-top: 22px; }

#link-itunes { display: block; float: left; width: 111px; height: 32px; background: transparent url(../img/id-apple.png) no-repeat center center; margin: 20px 140px 0 0; }

#lojas { float: left; margin-left: 10px; }

#lojas li { display: block; float: left; margin:7px 0; }

#lojas li a { display: block; float: left; color: #333; padding: 3px 20px; font-size: 18px; font-size: 1.125rem; background: transparent url(../img/separador.png) no-repeat right center; text-transform: uppercase; -moz-transition: color 300ms ease-in-out; -o-transition: color 300ms ease-in-out; -webkit-transition: color 300ms ease-in-out; transition: color 300ms ease-in-out; }

#lojas li a:hover { color: #880332; }

#lojas li a.last { background: none; }

#albuns { height: 540px; padding: 70px 0 50px; background-color:#FFF; }

#capa { float: left; width: 30%; position: relative; }

#capa img { display: block; }

#prev-album { top: 120px; left: -22px; }

#next-album { top: 120px; left: 308px; }

#capa h2 { display: block; float: left; font-size: 28px; font-size: 1.75rem; text-transform: uppercase; margin-top: 13px; color: #880332; font-family: "Rokkitt", "Avenir", Helvetica, Arial, sans-serif; }

.ico-share { display: block; float: left; width: 42px; height: 42px; background-position: center center; background-repeat: no-repeat; margin-left: 10px; }

.ico-fb { background-image: url(../img/ico-facebook-mini.jpg); }

.ico-tw { background-image: url(../img/ico-twitter-mini.jpg); }

.ico-gp { background-image: url(../img/ico-gplus-mini.jpg); }

#musicas { float: left; width: 70%; }

#musicas h2 { font-size: 46px; font-size: 2.875rem; color: #880332; font-family: "Rokkitt", "Avenir", Helvetica, Arial, sans-serif; text-transform: uppercase; margin-bottom: 20px; }

#musicas ul { display: block; width: 50%; float: left; }

#musicas ul li { font-size: 22px; font-size: 1.375rem; line-height: 30px; color:#880332; }

#instagram { width: 100%; height: 615px; background-color:#000; }

#fotos { margin: 60px 0 0; float: left; }

#fotos li { display: block; float: left; width: 19.2%; margin: 0 1% 12px 0; }

#fotos li:nth-child(5n) { margin-right: 0; }

#fotos li a img { display: block; width: 100%; }

#title-box { display: block; width: 100%; height: 200px; padding-top: 210px; background: transparent url(../img/id-instagram.png) no-repeat center 10px; text-align: center; text-transform: uppercase; font-size: 22px; font-size: 1.375rem; }

#videos { width: 100%; height: 730px; }

#videos .center { position: relative; }

#prev-video { top: 290px; left: 7%; }

#next-video { top: 290px; right: 7%; }

#video { width: 80%; height: 580px; margin: 30px auto 0; }

#video iframe { width: 100%; height: 100%; }

#social-share { width: 55%; float: right; margin-right: 10%; }

#social-share h2 { display: block; float: left; font-size: 46px; font-size: 2.875rem; text-transform: uppercase; line-height: 50px; font-family: "Rokkitt", "Avenir", Helvetica, Arial, sans-serif; }

#social-share .social-btn { display: block; float: left; width: 50px; height: 50px; margin-left: 15px; background-repeat: no-repeat; background-position: center center; }

#social-share .social-btn.fb-btn { background-image: url(../img/ico-facebook.png); }

#social-share .social-btn.tw-btn { background-image: url(../img/ico-twitter.png); }

#social-share .social-btn.gp-btn { background-image: url(../img/ico-gplus.png); }

#fas { width: 100%; height: 510px; background-color:#000; }

#fas h2 { display: block; float: left; font-size: 56px; font-size: 3.5rem; text-transform: uppercase; margin: 55px 0 55px 10%; color: #880332; font-family: "Rokkitt", "Avenir", Helvetica, Arial, sans-serif; }

#fa-form { width: 90%; float: left; margin-left: 10%; }

#fa-form .col-left { float: left; width: 40%; }

#fa-form .col-right { float: left; width: 40%; margin-left: 2%; }

#fa-form label { display: block; width: 100%; border: 1px solid #880332; margin-bottom: 15px; padding: 5px 10px; color: #9195A1; font-size: 18px; font-size: 1.125rem; }

#fa-form label input,
#fa-form label select { padding: 3px; background-color: transparent; border: 0; color: #880332; font-size: 18px; font-size: 1.125rem; font-family: "Avenir", Helvetica, Arial, sans-serif; font-weight: 400; font-style: italic; outline: none; }

#fa-form label#f-pais { float: left; width: 48%; }

#fa-form label#f-provincia { float: left; width: 48%; margin-left: 4%; }

#f-nome input { width: 66%; }

#f-pais select { width: 79%; }

#f-provincia input { width: 61%; }

#f-mail input { width: 84%; }

#f-facebook input { width: 48%; }

#f-movel input { width: 62%; }

#f-fone input { width: 62%; }

#cadastrar { display: block; width: 100%; height: 103px; background-color: #880332; border: 0; text-transform: uppercase; color: #FFF; font-size: 18px; font-size: 1.125rem; font-family: "Avenir", Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; cursor: pointer; }

#social { float: left; margin-left: 3%; }

.i-social { display: block; width: 46px; height: 46px; margin: 0 0 12px 0; }

.i-social.i-facebook { background: transparent url(../img/spt-social.png) no-repeat -46px 0; }

.i-social.i-facebook:hover { background-position: 0 0; }

.i-social.i-instagram { background: transparent url(../img/spt-social.png) no-repeat -46px -46px; }

.i-social.i-instagram:hover { background-position: 0 -46px; }

.i-social.i-youtube { background: transparent url(../img/spt-social.png) no-repeat -46px -92px; }

.i-social.i-youtube:hover { background-position: 0 -92px; }

.i-social.i-twitter { background: transparent url(../img/spt-social.png) no-repeat -46px -138px; }

.i-social.i-twitter:hover { background-position: 0 -138px; }

#contato { width: 100%; height: 540px; background-color:#FFF; }

#contato h2 { display: block; float: left; font-size: 56px; font-size: 3.5rem; text-transform: uppercase; margin: 35px 0 35px 10%; color: #880332; font-family: "Rokkitt", "Avenir", Helvetica, Arial, sans-serif; }

#con-form .col-left { float: left; width: 40%; margin-left: 10%; }

#con-form label { display: block; width: 100%; border: 1px solid #880332; margin-bottom: 15px; padding: 5px 10px; color: #9195A1; font-size: 18px; font-size: 1.125rem; }

#con-form label input, #con-form label textarea { padding: 3px; background-color: transparent; border: 0; color: #880332; font-size: 18px; font-size: 1.125rem; font-family: "Avenir", Helvetica, Arial, sans-serif; font-weight: 400; font-style: italic; outline: none; }

#con-form label textarea { width: 100%; height: 100px; resize: none; }

#con-form label#c-mensagem { width: 80%; float: left; }

#enviar { display: block; float: left; width: 18%; height: 133px; background-color: #880332; border: 0; margin-left: 2%; text-transform: uppercase; color: #FFF; font-size: 18px; font-size: 1.125rem; font-family: "Avenir", Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; cursor: pointer; }

#footer { width: 100%; height: 70px; position: relative; z-index: 11; background-color: #880332; font-size: 12px; font-size: 0.75rem; }

#footer p { float: left; line-height: 70px; }

#footer a { float: right; margin-top:18px; }

@media screen and (max-width: 1240px) { .center { width: 96%; }
  #capa img { display: block; width: 100%; }
  #prev-album { left: -5%; }
  #next-album { left: auto; right: -5%; }
  #musicas { float: left; width: 65%; margin-left: 5%; }
  #link-itunes { margin: 20px 40px 0 0; } }
@media screen and (max-width: 800px) { #agenda { height: auto; background: transparent url(../img/bkg-agenda.jpg) repeat; padding-bottom: 20px; }
  #proximo-show h2 { font-size: 150px; font-size: 9.375rem; }
  #proximo-show h2 span { font-size: 300px; font-size: 18.75rem; }
  #proximo-show p { font-size: 24px; font-size: 1.5rem; }
  #proximos-shows li { margin-bottom: 30px; }
  #comprar { height: auto; }
  #comprar h2 { float: none; width: auto; margin: 30px 10px 0 0; }
  #link-itunes { display: block; float: none; margin: 10px 60px 0 0; }
  #lojas { float: none; margin: 0; }
  #lojas li { display: block; float: left; margin: 10px 0 40px; }
  #lojas li a { padding: 0 10px; }
  #lojas li:first-child a { padding-left: 0; }
  #albuns { height: auto; background: transparent url(../img/bkg-musicas.jpg) repeat center top; }
  #capa { float: none; width: 56%; margin: 0 auto 40px; }
  #prev-album { top: 120px; left: -30px; }
  #next-album { top: 120px; right: -30px; }
  #musicas { float: left; width: 100%; margin-left: 0; }
  #musicas h2 { font-size: 46px; font-size: 2.875rem; color: #880332; font-family: "Rokkitt", "Avenir", Helvetica, Arial, sans-serif; text-transform: uppercase; margin-bottom: 20px; }
  #musicas ul { display: block; width: 50%; float: left; }
  #musicas ul li { font-size: 22px; font-size: 1.375rem; line-height: 30px; }
  #instagram { display: none; }
  #videos { display: none; }
  #fas { width: 100%; height: auto; background: transparent url(../img/bkg-fas.jpg) repeat center top; }
  #fas h2 { margin-left: 0; }
  #fa-form { width: 100%; margin-left: 0; }
  #fa-form .col-left { float: left; width: 100%; }
  #fa-form .col-right { float: left; width: 100%; margin-left: 0; }
  #social { float: left; margin: 0 0 40px 0; }
  #social li { float: left; margin: 30px 30px 0 0; }
  .i-social { float: left; width: 46px; height: 46px; margin: 0 0 12px 0; }
  #contato { height: auto; background: #000 url(../img/bkg-contato.jpg) repeat center top; }
  #contato h2 { margin: 35px 0 35px 0; }
  #con-form .col-left { width: 100%; margin-left: 0; } }