body {
	width:100%;	
	background-color: $cor-fundo-beje;

	.barracima{
		position: absolute;
		width: 100%;
		height: 500px;
		top: 0px;
		left: 0px;
		background-color: $cor-fundo-azul;
		-webkit-box-shadow: 0px 0px 5px 2px #222;
		box-shadow: 0px 0px 5px 2px #222; 
	}
	
	.area{
		position:relative;
		float:left;
		width: 100%;
		height: auto;
		margin: 0 auto;		
	}	
	.wrapper{
		width: 960px;
		height: auto;
		margin: 0 auto;
		display: block;
		#logo{
			img{
				display:block;
				margin: 15px auto;
			}
		}
	}
	h1, h2{
		font-family:$fonte-titulo;
		color: $cor-texto-beje;
		text-align: center;
	}
	h1{
		font-size: 100px;
		margin-bottom:15px;
		
	}
	h2{
		font-size: 40px;
		margin-top: 15px;
		margin-bottom:110px;
	}
	#timer{
		position: relative;
		display:block;
		width: 100%;
		margin-top: 75px;
		
		&>span{
			display:block;
			width: 100%;
			div{
				display:block;
				width: 210px;
				height: 190px;		
				float: left;
				margin-right: 40px;
				
				&:nth-child(1){
					-webkit-transform: rotate(-3deg);
					-moz-transform: rotate(-3deg);
					-o-transform: rotate(-3deg);
					-ms-transform: rotate(-3deg);
					transform: rotate(-3deg);
				}
				&:nth-child(2){
					-webkit-transform: rotate(5deg);
					-moz-transform: rotate(5deg);
					-o-transform: rotate(5deg);
					-ms-transform: rotate(5deg);
					transform: rotate(5deg);
				}
				&:nth-child(3){
					-webkit-transform: rotate(-8deg);
					-moz-transform: rotate(-8deg);
					-o-transform: rotate(-8deg);
					-ms-transform: rotate(-8deg);
					transform: rotate(-8deg);
				}
				&:nth-child(4){
					margin-right: 0;
					-webkit-transform: rotate(7deg);
					-moz-transform: rotate(7deg);
					-o-transform: rotate(7deg);
					-ms-transform: rotate(7deg);
					transform: rotate(7deg);
				}
				&>span{				
					display: block;
					float:left;
					width: 210px;
					height: 190px;				
					background-color: $cor-texto-beje;
					text-align: center;

					color: $cor-fundo-azul;
					font-family: $fonte-titulo;
					font-size: 20px;
					position:relative;					
					text-transform: uppercase;
					line-height:1.45;

					&:before, &:after {
						z-index: -1;
						position: absolute;
						content: "";
						bottom: 15px;
						left: 3px;
						width: 50%;
						top: 80%;
						max-width: 100px;
						background: #222;
						-webkit-box-shadow: 0 16px 5px #222;
						-moz-box-shadow: 0 16px 5px #222;
						box-shadow: 0 16px 5px #222;
						-webkit-transform: rotate(-3deg);
						-moz-transform: rotate(-3deg);
						-o-transform: rotate(-3deg);
						-ms-transform: rotate(-3deg);
						transform: rotate(-3deg);
					}

					&:after{
						-webkit-transform: rotate(3deg);
						-moz-transform: rotate(3deg);
						-o-transform: rotate(3deg);
						-ms-transform: rotate(3deg);
						transform: rotate(3deg);
						right: 3px;
						left: auto;
					}

					&>span{
						font-size: 100px;
						color: $cor-texto-bejescuro;
					}
				}
			}
		}
	}
	#about{
		font-family:$fonte-titulo;		
		font-size: 22px;
		text-align: center;
		width:100%;
		color: $cor-texto-bejescuro;
		float:left;
		margin-top: 80px;
		line-height: 2;
	}
	#newsletter{
		float:left;
		margin-top:45px;
		width:960px;
		font-family:$fonte-titulo;
		font-size: 22px;
		color: $cor-texto-bejescuro;
		background-color:$cor-texto-beje;
		padding:10px;		
		position: relative;


		&:before, &:after {
			z-index: -1;
			position: absolute;
			content: "";
			bottom: 15px;
			left: 3px;
			width: 80%;
			height:20px;
			top: 42%;
			max-width: 350px;
			background: #222;
			-webkit-box-shadow: 0 16px 5px #222;
			-moz-box-shadow: 0 16px 5px #222;
			box-shadow: 0 16px 5px #222;
			-webkit-transform: rotate(-3deg);
			-moz-transform: rotate(-3deg);
			-o-transform: rotate(-3deg);
			-ms-transform: rotate(-3deg);
			transform: rotate(-3deg);
		}
		&:after{
			-webkit-transform: rotate(3deg);
			-moz-transform: rotate(3deg);
			-o-transform: rotate(3deg);
			-ms-transform: rotate(3deg);
			transform: rotate(3deg);
			right: 3px;
			left: auto;
		}


		input{
			display:block;
			padding:10px;
			width:700px;
			float:left;
			padding-left: 65px;
			background-color: $cor-texto-beje;
			background-image: url(img/subscribe-50px.svg);
			background-repeat:no-repeat;
			background-position: 8px 0px;
			border: 0;
			//border-bottom:1px dotted $cor-texto-bejescuro;
		}

		a{
			display:block;
			background-color:$cor-fundo-azul;
			color: $cor-texto-beje;
			float:left;
			padding:10px;
			width:240px;		
			height:auto;	
			text-align: center;
			line-height: 1.4;
			vertical-align: middle;
			-webkit-transition: all 300ms ease;
			-moz-transition: all 300ms ease;
			-ms-transition: all 300ms ease;
			-o-transition: all 300ms ease;
			transition: all 300ms ease;
			&:hover{
				background-color:$cor-texto-bejescuro;
				color: #fff;
			}
		}
	}

	#footer {
		font-family:Arial, sans-serif;		
		font-size: 12px;
		text-align: center;
		width:100%;
		color: $cor-texto-bejescuro;
		float:left;
		margin-top:50px;
		line-height: 2;
	}
}