@import url('reset.css');
@font-face{font-family:JodieBadiston-Regular;src:url(fontes/JodieBadiston-Regular.woff2) format('woff2'),url(fontes/JodieBadiston-Regular.woff) format('woff');font-weight:400;font-style:normal}
@font-face{font-family:Gotham-Light;src:url(fontes/Gotham-Light.woff2) format('woff2'),url(fontes/Gotham-Light.woff) format('woff');font-weight:400;font-style:normal}
@font-face{font-family:Gotham-Bold;src:url(fontes/Gotham-Bold.woff2) format('woff2'),url(fontes/Gotham-Bold.woff) format('woff');font-weight:400;font-style:normal}

html, body {
    color: #000;
    font-family: Verdana, Geneva, sans-serif;
    margin: 0px;
    padding: 0px;}

body {
	background: #161616 url('imagens/bg.jpg') center top no-repeat;
	background-size: 100% auto;
    width: 100%;
    font-size: 62.5%;
    font-style: normal;
    line-height: 1.4;
    margin: 0;}

a {
    color: #000;
    outline: none;
    text-decoration: none;}

#pagina {
    width: 100%;
    max-width: 1260px;
    margin: 0px auto;
    padding: 180px 10px 180px 10px;
    box-sizing: border-box;
    position: relative;
    overflow: hidden;}

#header, #logo {
    width: 100%;
    position: relative;
    float: left;}

#logo {
    text-align: center;}

#logo a {
    width: 48%;
    position: relative;
    display: inline-block;}

#logo a img {
	width: 100%;
	height: auto;
    position: relative;
	display: block;}

#header h2 {
    width: 100%;
	color: #fffc00;
    font-family: 'JodieBadiston-Regular';
	font-size: 10.0em;
	line-height: 1.0em;
	text-align: center;
	text-transform: lowercase;
	margin: -20px 0px 0px 0px;
    position: relative;
    float: left;}

.titulo-amarelo {
    color: #fffc00;
    font-family: 'Gotham-Light';
    font-size: 2.8em;
    text-transform: uppercase;
    padding: 30px 0px 20px 0px;}

.titulo-azul {
    color: #00fffc;
    font-family: 'Gotham-Light';
    font-size: 2.8em;
    text-transform: uppercase;
    padding: 30px 0px 20px 0px;}

.titulo-roxo {
    color: #e400ff;
    font-family: 'Gotham-Light';
    font-size: 2.8em;
    text-transform: uppercase;
    padding: 30px 0px 20px 0px;}

.titulo-verde {
    color: #66ff00;
    font-family: 'Gotham-Light';
    font-size: 1.555em;}

#pagina-conteudo {
    width: 100%;
    padding: 100px 0px 0px 0px;
    position: relative;
    float: left;}

#pagina-secao {
    width: 80%;
	padding: 0px 10% 0px 10%;
    position: relative;
    float: left;}
	
.pagina-secao-item {
    width: 22%;
    padding: 0px 0px 0px 4%;
    position: relative;
    float: left;}

#pagina-secao-business {
    padding: 0px;}

.pagina-secao-item a {
    width: 100%;
    position: relative;
    float: left;}

.pagina-secao-item a img {
	width: 100%;
	height: auto;
    position: relative;
	display: block;}

#pagina-texto {
    width: 100%;
    padding: 200px 0px 0px 0px;}

.pagina-frases {
    color: #FFF;
    font-family: 'Gotham-Light';
    font-size: 1.8em;}

.pagina-frases p {
    padding-bottom: 20px;}

#box {
    width: 100%;
    margin-top: 40px;
    padding: 20px 0px 20px 0px;
    position: relative;
    float: left;
    border: 1px solid #FFF;}

.box-item {
    width: 25%;
    color: #FFF;
    font-family: 'Gotham-Light';
    font-size: 1.8em;
    padding: 0px 20px 0px 20px;
    box-sizing: border-box;
    position: relative;
    float: left;}

#box-item-albuns.box-item {
        width: 21%;}

#box-item-singles.box-item {
        width: 33%;}

#box-item-teatro.box-item {
    width: 46%;}

#newsletter_spotify {
    width: 70%;
    padding: 100px 15% 0px 15%;
    position: relative;
    float: left;}

#newsletter {
    width: 45%;
    position: relative;
    float: left;}

#smc-embedded-subscribe-form {
    width: 100%;
    position: relative;
    float: left;}

#newsletter-titulo {
    width: 100%;
	color: #FFF;
    font-family: 'Gotham-Light';
	font-size: 1.8em;
	line-height: 1.125em;
	text-align: center;
	text-transform: uppercase;
    position: relative;
    float: left;}

#mc-embedded-subscribe-form .email {
	background-color: #FFF;
    width: calc(100% - 20px);
	height: 20px;
    color: #000;
    font-family: 'Gotham-Light';
    font-size: 1.6em;
    line-height: 20px;
	letter-spacing: 1px;
	margin: 10px 0px 0px 0px;
	padding: 15px 10px 15px 10px;
	border: 0px;
	outline: none;
    position: relative;
    float: left;}

#mc-embedded-subscribe-form .button {
	background-color: #000;
    width: 100%;
	height: 32px;
    color: #FFF;
    font-family: 'Gotham-Bold';
    font-size: 1.6em;
	text-transform: uppercase;
	margin: 5px 0px 0px 0px;
	border: 0px;
	outline: none;
	cursor: pointer;
    position: relative;
    float: left;}
	
#spotify {
    width: 45%;
    position: relative;
    float: right;}

#spotify-player, #spotify-follow {
    width: 100%;
    position: relative;
    float: left;}

#spotify-follow {
    margin: 10px 0px 0px 0px;}

.iframe-container {
    height: 0;
    padding-bottom: 180px;
    position: relative;
	overflow: hidden;}

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

#footer {
	width: 100%;
	padding: 100px 0px 0px 0px;
    position: relative;
    float: left;}

#redes-titulo {
    width: 100%;
    color: #FFF;
    font-family: 'Gotham-Light';
    font-size: 1.8em;
    line-height: 1.4em;
    text-align: center;
    text-transform: uppercase;
    padding: 0px 0px 35px 0px;
    position: relative;
    float: left;}

#footer-redes {
	width: 100%;
	text-align: center;
    position: relative;
    float: left;}

#footer-redes li {
	padding: 0px 7px 0px 7px;
	position: relative;
    display: inline-block;}

#footer-redes li a {
	background-image: url('imagens/social.png');
	background-size: 128px 32px;
	background-repeat: no-repeat;
	width: 32px;
	height: 32px;
	text-indent: -9999px;
    position: relative;
    float: left;}

#footer-redes li a#footer-redes-instagram {
    background-position: 0px 0px;}

#footer-redes li a#footer-redes-spotify {
    background-position: -32px 0px;}

#footer-redes li a#footer-redes-youtube {
    background-position: -64px 0px;}

#footer-redes li a#footer-redes-tiktok {
    background-position: -96px 0px;}

#selo-sony {
    width: 100%;
	text-align: center;
    padding: 15px 0px 0px 0px;
    position: relative;
    float: left;}

#selo-sony a {
    width: 187px;
    position: relative;
    display: inline-block;}

#selo-sony a img {
	width: 100%;
	height: auto;
    position: relative;
	display: block;}

#contato {
    width: 100%;
    color: #FFF;
    font-family: 'Gotham-Light';
	font-size: 1.8em;
	line-height: 1.4em;
	text-align: center;
    padding: 40px 0px 0px 0px;
    position: relative;
    float: left;}

#contato a {
	color: #FFF;}

#contato strong {
    font-family: 'Gotham-Bold';
    padding: 15px 0px 15px 0px;
    display: block;
    position: relative;}

::-webkit-input-placeholder {
    color: #000;
    opacity: 1;}

::-moz-placeholder {
    color: #000;
    opacity: 1;}

:-ms-input-placeholder {
    color: #000;
    opacity: 1;}

input:-moz-placeholder {
    color: #000;
    opacity: 1;}

@-ms-viewport {
  width: device-width;}

@media only screen and (max-width: 900px) {
#logo a {
    width: 60%;}

.box-item {
    width: 100% !important;}

#box-item-singles.box-item {
    padding: 20px;}
}

@media only screen and (max-width: 720px) {
#header h2 {
    font-size: 7.0em;
	margin: -10px 0px 0px 0px;}
	
.pagina-secao-item {
    width: 48%;
    padding: 0px 0px 4% 4%;}

#pagina-secao-business, #pagina-secao-fashion {
    padding: 0px 0px 4% 0px;}

#newsletter_spotify {
    width: 80%;
    padding: 100px 10% 0px 10%;}

#newsletter, #spotify {
    width: 100%;}

#spotify {
    padding: 30px 0px 0px 0px;}
}

@media only screen and (max-width: 520px) {
#logo a {
    width: 80%;}
	
#pagina {
    padding: 180px 10px 50px 10px;}

#redes-titulo {
    font-size: 1.6em;}
}