/*
Theme Name: CD Nous Encontro com a Alma
Theme URI: http://www.curaespectral.com.br/album-nous
Description: Informações sobre o Álbum Nous - Encontro com a Alma de Cynara B. Pamplona
Version: 1.0
Author: Lila Nascimento
Author URI: lila_nascimento@hotmail.com 
Tags: CD NOUS, Cynara B Pamplona, música, piano, encontro com a alma, poesia, musicoterapia, terapeuta, terapia
*/
/* CSS Document */
@charset "utf-8";
/*----------------*/

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
   MODIFICADO
*/
html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, 
a, ul, li, article, main, footer, header, nav, section {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
	}
/* HTML5 display-role reset for older browsers */
article, main, footer, header, nav, section { display: block;}
ul {list-style: none;}

/* Fim Eric Meyer reset */
/* utilidades */
*, *:before, *:after {
  -moz-box-sizing: border-box; 
  	-webkit-box-sizing: border-box;
   		box-sizing: border-box;
		}
.cf:before,.cf:after {content: " "; display: table;}
.cf:after { clear: both;}
.cf {*zoom: 1;}
/* Fim utilidades */
body { width: 100%; font: 62.5%/1.4 Arial, sans-serif;}
.mae { max-width:1024px; margin:0 auto;}
main {width:100%; max-width:940px;	margin:0 auto;}
p { font-family: Arial;	font-size: 15px; color: #333;}
h1 {
	width: 90%;
	font-family: Georgia;
	font-size: 30px; 
	color: #000;
	line-height: 28px;
	padding: 35px 0;
	border-bottom: 1px solid #CCC;
	margin: 0 auto;
	margin-bottom: 20px;
	}
h2 {
	font-family: Arial; 
	font-size: 18px; 
	color: #333;
	text-transform: uppercase;
	margin-bottom: 20px;
	}

h3 {
	font-family: Arial; 
	font-size: 18px; 
	color: #000;
	text-transform: uppercase;
	margin-bottom: 20px;
	}
/*///MOBILE first////////////*/
/*Areas de Texto - Mobile first*/
p.sobre-album , p.sobre-musicas, p.sobre-encarte, .box-agradecimento, .ficha-tecnica, .sobre-cynara {padding: 15px;} 	
#area1, #area2, #area3 {width: 100%;}
figure {max-width: 320px; margin: 0 auto; padding:0; }
/*Topo - Mobile first*/
.topo { width:100%; text-align: center;}
	.banner { width:100%;}
		h1 strong {font-weight: normal; }
		.h1-sup{
			font-family: Times New Roman;
			font-size: 16px; 
			vertical-align: 6px;
			margin-top:5px;
			color: #666;
			margin-right: 5px;
			}
		strong.encontro { display: inline-block; font-family: Times New Roman; font-size: 30px; font-style: italic;}
		strong.cynara {font-size: 20px; color: #999;}
	.chamada {
		display: inline-block;
		width: 90%;
		font-size: 19px; 
		font-weight: normal; 
		color: #9F5959; 
		padding: 0 5px;
		margin-bottom: 10px;
		}

/*Area 1 - Mobile first*/
#area1 section img { width: 100%;}
	p.sobre-musicas  {background-color:#ECF6F8;}
	p.sobre-encarte  {background-color:#E6E1CF;}
/*Area 2 - Mobile first*/
#area2 { text-align: center;}
	#area2 h1 { padding: 40px 0;border: none; margin-bottom: 0;}
	.capa-album { width: 80%; }
		.ver-encarte {font-size: 14px; font-weight:600; width: 80%; margin: 0 auto;margin-bottom: 30px ;}
			.ver-encarte a {color: #999; text-decoration: none;}
			.ver-encarte a:hover {text-decoration: underline;}
	.adquirir { margin: 0 auto 40px auto; padding: 15px 0;}
	.adquirir ul li {display: inline-block;  margin:0 auto; padding: 12px }
	.adquirir h3 { max-width: 350px; color:#990000; margin: 0 auto; margin-bottom: 30px;}
		.logo-circulo {width:52px;}
		.logos-adquirir p {font-size: 9px; text-align: center;}
		.logos-adquirir a {text-decoration: none;}
		
	.cadastro {background-color: #FFCC99; padding: 15px;}
		.cadastro form h3 {text-transform:none; color:#333;}
		.campo-cad-form-in {width: 100%; height: 32px; margin-bottom: 10px; font-size: 15px;}
		.btenviar {
			display:block-inline;
			font-family:Arial, Helvetica, sans-serif;
			font-size: 15px;
			font-weight:600;
			text-transform:uppercase;
			text-align:center;
			letter-spacing:1px;
			color:#FFFFFF; 
			background-color:#FF6600;
			border: #FF6600 solid 1px;
			margin: 0 auto;
			padding: 8px 10px;
			cursor:pointer;
			border-radius: 20px;
			box-shadow: 3px 3px 5px #333;
			-webkit-box-shadow: 3px 3px 5px #333;
			-moz-box-shadow: 3px 3px 5px #333;
			}			
/*Area 3 - Mobile first*/
#area3 { text-align: center;}
.box-agradecimento {padding-top: 30px;}
.box-agradecimento p {text-align: left; padding-bottom:10px;}
.box-cynara img {width: 100%;}
	.sobre-cynara {background-color: #F3E5E5;}
.ficha-tecnica {margin-bottom: 30px; }
	.ficha-tecnica dt {font-size: 14px; font-weight: 600; }
	.ficha-tecnica dd {font-size: 14px; font-weight: 500; margin-left: 0; margin-bottom:10px;}
	.ficha-tecnica span p {font-family: Georgia; font-size: 12px; font-weight: 600;  font-style: italic;line-height:22px; }
/*Rodapé - Mobile first*/
footer {text-align: center; padding-bottom:80px;}
	footer h2 { 
		display: inline-block;
		font-family: Arial; 
		text-transform: capitalize; 
		font-size: 20px;
		font-weight: 500;
		border-bottom: 1px solid #999;
		padding: 15px 0;
		}
		footer ul {width: 100%; display: inline-block; margin-bottom: 15px;}
		footer ul li {display: inline-block; vertical-align: middle;}
			li.ico-social-meio {padding: 0 40px;}
			footer ul li img {width: 33px; }
	.copyright { margin: 0 auto; padding: 0 15px; }
	.copyright span { display: inline-block; width: 80%; }
	.copyright p { font-family: Times; }
/*Fim Mobile First*/
	
/*Viewport min-width: 400px*/	
@media screen and (min-width: 400px) {
h1 {font-size: 30px; line-height: 30px;}
h2 {font-size: 20px;}
h3 {font-size: 18px;}
p { font-size: 16px;}
figure {margin:10px auto; }
/*Areas de Texto - min-width: 400px*/
p.sobre-album , p.sobre-musicas, p.sobre-encarte, .box-agradecimento, .ficha-tecnica, .sobre-cynara {padding: 22px;} 	
/*Topo - min-width: 400px*/
.h1-sup{font-size: 20px; margin-right: 8px; vertical-align: 8px;}
	strong.nous {font-size: 38px;} 
	strong.encontro { font-size: 38px; margin: 10px auto;}
	strong.cynara {font-size: 25px;}
	.chamada { font-size: 25px;}
/*Area 2 - min-width: 400px*/
.adquirir {width: 80%; border: 1px solid #999; }
	.logos-adquirir p {font-size: 12px;}
.cadastro form h3 {width: 380px; font-size: 22px; margin: 0 auto 15px auto;}
	.campo-cad-form-in { width: 380px; height: 40px; font-size: 16px; margin-bottom: 12px;}
	.btenviar {	font-size: 17px; font-weight:; padding: 8px 12px;}
/*Area 3 - min-width: 400px*/
.ficha-tecnica dt, .ficha-tecnica dd {font-size: 16px;}
.ficha-tecnica span p {font-size: 14px;line-height:24px; font-weight: 400; }

/*Rodape - min-width: 400px*/
footer h2 { font-size: 25px;}
li.ico-social-meio {padding: 0 40px;}
footer ul li img {width: 33px; }
.copyright p { font-size: 16px;}
.copyright span { display: inline-block; width: 80%; }
}	
/*Fim viewport min-width: 400px*/	

/*Viewport min-width: 600px*/	
@media screen and (min-width: 600px) {
main {width: 90%;}
h1 {font-size: 32px; line-height: 32px;}
h2 {font-size: 22px;}
h3 {font-size: 20px;}
p { font-size: 17px;}
figure {margin:10px auto; }
/*Areas de Texto - min-width: 600px*/
p.sobre-album , p.sobre-musicas, p.sobre-encarte, .box-agradecimento, .ficha-tecnica, .sobre-cynara {padding: 26px;} 	
/*Topo - min-width: 600px*/
.h1-sup{font-size: 20px; margin-right: 8px; vertical-align: 10px;}
	strong.nous {font-size: 45px;} 
	strong.encontro { font-size: 45px; margin: 10px auto;}
	strong.cynara {font-size: 27px;}
	.chamada { font-size: 30px;}
.adquirir {width: 430px;}
.ficha-tecnica span p {font-size: 14px;line-height:24px; font-weight: 400; }
/*Rodapé - min-width: 600px*/
footer h2 { font-size: 28px;}
.copyright p { font-size: 19px;}
}	
/*Fim viewport min-width: 600px*/	

/*Viewport min-width: 720px*/	
@media screen and (min-width: 720px) {
main, #area2, #area2 h1, #area2 figure, #area3, .a1-sc1 p, .a1-sc2 p, .a1-sc1 figure, .a1-sc2 figure,.adquirir ul li, .box-agradecimento, .box-cynara, .box-cynara	figure {padding: 0;}

#area2 figure, #area3,.a1-sc1 p, .a1-sc2 p, .a1-sc1 figure, .a1-sc2 figure, .box-agradecimento, .box-cynara, .box-cynara figure {margin:0; }

main {width: 95%; max-width: 720px;}
p{font-size:16px; line-height: 25px;}
/*Topo - min-width: 720px*/
.chamada { width: 100%; font-size: 28px; padding: 0 7px 30px 7px;}
/*Area 1 - min-width: 720px*/
.a1-sc1, .a1-sc2 {margin-bottom: 30px;}
.a1-sc1{ background-color:#ECF6F8;}
	.h1-sup{font-size: 22px; margin-right: 8px; vertical-align: 10px;}
		strong.nous {font-size: 50px;} 
		strong.encontro { font-size: 48px; margin: 10px auto;}
		strong.cynara {font-size: 28px;}

	.a1-sc1 p { width:52%; padding: 0 20px 5px 20px;}
		p.sobre-album, p.sobre-musicas { float: right; }
		p.sobre-album {padding-top: 25px;}
	.a1-sc1 figure {float:left;}
.a1-sc2{ height: 215px; background-color:#E6E1CF;}
	p.sobre-encarte { width:475px; padding: 20px;}
	.a1-sc2 figure {float:right; width: 200px;}
/*Area 2 - min-width: 720px*/
#area2 { margin: 0 auto;}
	#area2 header{ display: block; width:285px; height: 380px; float: left; }
	#area2 h1 {width:100%; margin-bottom: 15px;}
		.h1-sup-2{
			font-size: 16px; 
			vertical-align: 6px;
			margin-top:5px;
			margin-right: 5px;
			}
			strong.nous-2 {font-size: 30px;}
			strong.encontro-2 { font-size: 30px; margin: 2px 0;}
			strong.cynara-2 {font-size: 20px; color: #999;}
	#area2 figure { height: 285px;}
.capa-album {width: 85%;}	
.adquirir { width: 55%; margin-left:5px; padding: 10px 0; float: right;}
.adquirir ul li, .logos-adquirir li a {margin: 0 10px;}
	.logo-circulo {width: 42px;}
.cadastro {width: 100%; clear:both; background-color: #FFCC99; padding: 15px; margin-bottom: 30px;}
	.cadastro form h3 {width: 100%;}
	.campo-cad-form-in {width: 70%; height: 32px; margin-bottom: 10px; font-size: 15px;}
	.btenviar { font-size: 15px;}	
#area3 {clear:both;}
.box-agradecimento { width: 350px; float: right;}
	.box-agradecimento h2 {margin-bottom: 0;}
.box-cynara	 { width: 310px;}
.box-cynara	p { padding:10px;}
.ficha-tecnica {clear:both;}
}
/*Fim viewport min-width: 720px*/	
	
	
/*Viewport min-width: 900px*/	
@media screen and (min-width: 900px) {
.topo, .topo h1,.sobre-album {padding: 0;}

.topo h1, #area2 figure, #area3 {margin:0; }

.topo h1 {padding-bottom:15px; width:90%;}
main {min-width:900px; max-width:940px;}
p{font-size:16px; line-height: 25px;}

/*Topo - min-width: 900px*/
.banner {margin-bottom: 30px;}
.topo {width:600px; float: left; position: relative; }
	.topo h1 { width: 100%; margin-bottom: 10px;}
.chamada { width: 100%; font-size: 25px; padding: 3px 0 5px 0; margin-bottom: 5px;}
/*Area 1 - min-width: 900px*/
#area1 { margin-bottom: 30px;}
	.a1-sc1 { width:67%; height: 370px; clear: both;}
		.h1-sup-2{
			font-size: 16px; 
			vertical-align: 6px;
			margin-top:5px;
			margin-right: 5px;
			}
			strong.nous-2 {font-size: 30px;}
			strong.encontro-2 { font-size: 30px; margin: 2px 0;}
			strong.cynara-2 {font-size: 20px; color: #999;}
		.a1-sc1 figure { width:280px;}
		.a1-sc1 p { padding: 0 10px 10px 10px; }
	p.sobre-album, p.sobre-encarte {padding-top: 20px;}
.a1-sc2 {width: 290px; float: right; position: relative; margin-top: -598px;}
	.a1-sc2 figure {float:none; width: 290px;}
	p.sobre-encarte { width: 100%; height: 253px;}
/*Area 2 - min-width: 900px*/
#area2{ height: auto;}	
	#area2 header{ display: block; width:34%; height: 380px; float: left; padding-left:40px; padding-right:10px;}
	#area2 figure { width: 280px;}
	#area2 h1 {width: 280px; margin-left:0;}
	.capa-album {width: 100%; margin-left:0;}
	.adquirir { margin-right:40px;}
	.adquirir h3 {max-width:; font-size: 20px;}
		.logo-circulo {width: 55px;}
	.cadastro {width: 100%; clear:both; padding: 15px; margin-bottom: 30px;}
		.cadastro form {width: 820px; margin:0 auto;}
			.cadastro form h3 {font-size: 25px; text-align: left;}
			.campo-cad-form-in { width:340px; margin:0 15px 0 0; font-size: 16px; padding-left: 5px; float: left;}
			.btenviar { font-size: 16px; margin:0;}
/*Area 3 - min-width: 900px*/		
#area3{ height: auto; clear: both;}	
	.box-agradecimento, .box-cynara, .ficha-tecnica { height: 736px;}
	.box-agradecimento { width:34%; float: left; padding: 10px; background-color: #EAEAEA; margin-right: 8px;}
		.box-agradecimento p{ font-size: 14px; padding-bottom: 5px; }
	.box-cynara	 { float: left; width: 300px;  background-color: #F3E5E5;}
		.sobre-cynara {  font-size: 14px; padding: 10px;}
	.ficha-tecnica { width: 295px; float: right; position: relative; margin-top: -734px; padding: 10px;}
		.ficha-tecnica h2{ margin-bottom:20px; padding:0;}
		.ficha-tecnica dt, .ficha-tecnica dd {font-size: 14px;}
		.ficha-tecnica dd {margin-bottom: 12px;}
		.ficha-tecnica span p {font-size: 14px;line-height:24px; font-weight: 300; }
		
/*Rodape - min-width: 900px*/
footer {clear: both;}
.copyright span {display: inline-block; width: 80%; margin: 0 auto; padding-left: 13%;}
.copyright span p { float: left; margin-right: 5px;}
}
/*Fim viewport min-width: 900px*/	
