﻿*{
    box-sizing:border-box;
}
html, body { margin:0; padding:0; font-family:calibri; font-size:1vw; border: 0 none; max-width:1920px; }

@font-face {
    font-family: 'unispace';
    src: url('../fonts/Unispace-Bold.woff2') format('woff2'),
         url('../fonts/Unispace-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

section, header, footer {
    display:block;
    position:relative;
}


#geral, #fotos {
    overflow: hidden;
    position: absolute;
    width: 100%;
    height: 106vw;
  }
.foto{
    position: absolute;
    z-index: 20;
    background: linear-gradient(to bottom, rgba(0,0,0,.15), rgba(0,0,0,0) 50%);
    background-color: #eeece9;
    padding: 1vw 1vw 3vw 1vw;
    filter: drop-shadow(.3vw .3vw .6vw rgba(0,0,0,0.5));
    width: 14vw;
}
#foto1{
    top: 25vw;
    left: 5vw;
    rotate: 30deg;
}
#foto1 {
    top: 24vw;
    left: 6vw;
    rotate: 24deg;
}
#foto2 {
    top: 43vw;
    left: 4vw;
    rotate: -5deg;
}
#foto3 {
    top: 20vw;
    left: 84vw;
    rotate: -9deg;
}
#foto4 {
    top: 30vw;
    left: 70vw;
    rotate: 12deg;
}
#foto5 {
    top: 65vw;
    left: 85vw;
    rotate: -9deg;
}
#foto6 {
    top: 88vw;
    left: 70vw;
    rotate: -6deg;
}
#foto7 {
    top: 85vw;
    left: 85vw;
    rotate: 20deg;
}

#g {
    overflow: hidden;
    position: absolute;
    z-index: 10;
    background-image: url(../images/g.svg);
    background-position: center center;
    background-repeat: no-repeat;
    width: 100%;
    height: 106vw;
    background-position-x: -20vw;
    background-position-y: -17vw;
    background-size: 126vw;
    filter: drop-shadow(.5vw .5vw 0.5vw rgba(0,0,0,0.5));
  }
#w{
    position: absolute;
    z-index: 30;
    top: 42vw;
    width: 25vw;
    right: 4vw;
    filter: drop-shadow(.5vw .5vw 0.5vw rgba(0,0,0,0.5));
}
header{ 
    background-image:url(../images/textura1.jpg);
    background-position: center;
    background-size:cover;
    height:40vw;
}
header:before{
    content: "";
    height: 13vw;
    width: 100%;
    background: linear-gradient(to bottom, rgba(255,255,255,0.5), rgba(49,159,39,0));
    position: absolute;
    margin: 0;
    top: 0;
}
header #logo{
    position:absolute;
    top: 9vw;
    left: 50%;
	width: 11.45vw;
    margin-left: -18.23vw;
}
header #nome{
    position:absolute;
    top: 14vw;
    left: 50%;
	width: 11.45vw;
    margin-left: 0vw;
}
header span{
    position: absolute;
    color: #fff;
    font-family: 'unispace';
}
header .contato{
    top: 3vw;
    right: 3vw;
    font-size: 1.3vw;
    line-height: 2.3vw;
    text-align: right;
    z-index: 100;
}
header .slogan{
    top: 16vw;
    margin-left: 13vw;
    left: 50%;
    font-size: 2vw;
}



#quemsomos{ 
    background-image:url(../images/textura2.jpg);
    background-position: center; 
    background-size:cover; 
    height:35vw;
}
#quemsomos .titulos{
	position:absolute;
	width:10vw;
	left: 20vw;
    padding-top: 8.5vw;
	text-align:center;
}
#quemsomos .texto{
	position:absolute;
	width:27vw;
	right: 32vw;
    padding-top: 8.5vw;
}

#quemsomos #nome-verde{
    position:absolute;
    top: 11vw;
    left: 32vw;
	width: 6vw;
}


footer{
    height: 31vw;
}
footer div{
	background-color:rgba(160,160,160,1);
    position:absolute;
	height: 8vw;
    width: 50vw;
    margin-top: -4vw;
	text-align:right;
	color:#fff;
    padding: 0;
	font-size:1vw;
}
footer div:after{
    content: "";
    height: 6vw;
    width: .4vw;
    background-color: #71c05e;
    position: absolute;
    margin: 0;
	right:-.2vw;
    top: 1vw;
}
footer h2, footer h3{
	height: 4vw;
	margin:0;
	color:#fff;
	padding:1.5vw 2vw;
	font-size:.9vw;
}
footer h2{
	background-color:rgba(100,100,100,1);
	height: 4vw;
	margin:0;
	display:block;
	font-size:1.2vw;
}
footer iframe{
    height: 31vw;
}
footer:before{
    content: "";
    height: 10vw;
    width: 100%;
    background: linear-gradient(to bottom, rgba(255,255,255,1), rgba(49,159,39,0));
    position: absolute;
    margin: 0;
    top: 0;
}
footer small{
   z-index:20;
   position: absolute;
   bottom:3vw;
   left:6vw;
   width: 30vw;
   font-family: calibri;
   line-height:1.2vw;
   font-size:1vw;
}
footer small a{
   color: #fff;
   font-family: 'unispace';
   line-height:2.5vw;
   fonte-size:2vw;
}




a{
    color: #fff;
text-decoration: none;
}
h1, h2, h3{
    font-family: 'unispace';
    font-weight:lighter;
}
h2{
    font-size: 1.5vw;
	margin:0;
}
h3{
    font-size: 1vw;
	margin:0;
}
h4{
    font-size: .8vw;
	margin:0;
}


#rotation {
    transition: 1s ease-in-out;
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.8);
    z-index: 10000000;
    opacity: 0;
    pointer-events: none !important;
	text-align:center;
	color:#fff;
}
#rotation div{
	color:#fff;
	position:absolute;
	top: 50%;
	margin-top: 20vw;
	font-size: 5vw;
	text-align:center;
	width:100%;
}
#rotation img {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 40vw;
    height: 40vw;
    margin: -20vw 0 0 -20vw;
}
@media all and (orientation:portrait) {
    #rotation {
        opacity: 1;
        pointer-events: all !important;
    }
}