@charset "UTF-8";
/* CSS Document */

html, body {
    width: 100% ;
    height: 100% ;
    min-height: 500px ;
    min-width: 900px ;
    margin: 0px ;
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

#pagina {
    height: 100% ; background-color:#FFF;
	
}


#todoconteudo {
	
	height:850px;
	width:1023px; /* largura fictícia */
	margin:0 auto;
	
	
}


#footertop {
    height: 34px; 
	background-color:#333;
}


/**************** Media social / Facebook / Google + *****************/


#mediasocial { margin: 0 auto; width:1020px; height:34px;}



.btnfacebook { float: right; padding-right:5px; width:40px; height:34px; background-image:url(../imagem/facebook01.jpg); background-repeat:no-repeat;}


.btnfacebook:hover { background-image:url(../imagem/facebook01hover.jpg); background-repeat:no-repeat; }


.btngooglemais { float: right; padding-right:5px; width:40px; height:34px; background-image:url(../imagem/googlemais01.jpg); background-repeat:no-repeat;}

.btngooglemais:hover { background-image:url(../imagem/googlemais01hover.jpg); background-repeat:no-repeat; }


.btncorreio { float: right; padding-right:5px; width:40px; height:34px; background-image:url(../imagem/correio01.jpg); background-repeat:no-repeat;}

.btncorreio:hover { background-image:url(../imagem/correio01hover.jpg); background-repeat:no-repeat; }


/**************** Fim de Media social / Facebook / Google + *****************/					



/************** Logo Vigorkriativo *****************/


.logotipo { float:left;}



/************** Menu *****************/

#barramenu { margin-top:22px; 
			 height:110px;
			 }


.menu { float:right; 
		padding-top:60px;
	}


.menu ul { list-style:none;}


.menu ul li { display:inline;
			  padding:15px; 
			  
			 }


.menu ul li a { font-family:Arial, 
				Helvetica, sans-serif; 
				font-size:12px; 
				color:#000; 
				text-decoration:none; 
				padding:10px;
				
				}


/****** Rollover Menu *********/

.menu ul li a:hover { background-color:#00aeef; 
					  -moz-border-radius:7px;
					  -webkit-border-radius:7px; 
					  border-radius:7px; 
					  color:#FFF;
					  
					 }



.btncontato { background-color:#00aeef; 
			  -moz-border-radius:7px;
			  -webkit-border-radius:7px; 
			  border-radius:7px;}



/************** Fim do Menu *****************/





/************** Google Map *****************/


#googlemap { height:300px; margin-top:60px; }
			 
			 
/************** Fim do Google Map *****************/



#titulo { margin-top:40px; font-family:Gotham, 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:24px;  }



/************** Toda informação da Esquerda *****************/

#contatoesq {  height:300px; width:620px; float:left; font-size:12px; font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif; }

ul { list-style:none;}

#listacontatos { margin-left:-40px; margin-top:72px;}

/************** Fim de Toda informação da Esquerda *****************/




/************** Toda informação da Direita/ incluindo o Formulario *****************/



#contatodir { float:left; height:300px; width:368px;}




/************** Inicio formulario *****************/


# Form {
	width: 459px;
	margin: 0 auto;
	margin-top: 30px-;
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	
}

label {
	display: block;
	margin-top: 20px;
	letter-spacing: 2px;
}



.nome { margin-left:20px; height:30px; width:270px;}


.email { margin-left:20px; height:30px; width:270px;}


.mensagem { margin-left:20px; height:90px; width:340px;}



.enviar { height:40px; width:114px; margin-top:5px; background-color:#FF0000; color:rgba(255,255,255,1.00); border:rgba(255,255,255,1.00); float:right;}



textarea {
	height: 100px;
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:12px;}
	
	
/************** link email *****************/

 a { color:rgba(0,0,0,1.00); text-decoration:none;}
 
 a:hover { color:#00aeef; text-decoration:underline;}
 
 
 /************** Fim do formulario *****************/
 
 
 
 
 /**************** Inicio do Box effect *******************/


.bubble-float-top {
  display: inline-block;
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: -webkit-transform;
  transition-property: transform;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 30px rgba(0, 0, 0, 0);
  background-color:#FF0004;
   
   
}

.bubble-float-top:before {
  position: absolute;
  z-index: -1;
  content: '';
  left: -webkit-calc(90% - 10px);
  left: calc(50% - 10px);
  top: 0;
  border-style: solid;
  border-width: 0 30px 30px 30px;
  border-color:#FF0004;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: top;
  transition-property: top;
}

.bubble-float-top:hover {
  -webkit-transform: translateY(5px) translateZ(0);
  -ms-transform: translateY(5px) translateZ(0);
  transform: translateY(5px) translateZ(0);
 
}

.bubble-float-top:hover:before {
  top: -10px;
}

.bubble-float-top { border:rgba(255,255,255,1.00) solid thin; width:100px; height:40px; float:right; color:rgba(255,255,255,1.00); margin-top:10px }



/**************** Fim do Box effect / Hover Shadow *******************/
 
 
 
#footerinferior { height:35px; background-color:#333;  margin-top:90px; }



/************************Inicio do  Submenu ***********************/

#submenu { position:relative; top:-8px;}


#submenu ul { list-style:none;}


#submenu ul li { display:inline;
			  padding:5px;
			  
			 }


#submenu ul li a { font-family:Arial, 
				Helvetica, sans-serif; 
				font-size:12px; 
				color:#FFFFFF; 
				text-decoration:none; 
				padding:7px;
				position:relative; top:15px;
				
				}


/****** Rollover Menu *********/

#submenu ul li a:hover { background-color:#00aeef; -moz-border-radius:7px; -webkit-border-radius:7px; border-radius:7px;color:#FFF; }
					 

/************************Fim do  Menu ***********************/


#footer02 { background-color:rgba(0,0,0,1.00); margin-top:-12px; height:10%;}