/* CSS Documento desarrollado por Wize SA*/

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,300,700);

hr{ border: none; border-bottom: dashed 1px #777;}
body{ 
	margin:0; 
	padding:0;
	background:url(../imagenes/bg-yolvic.png) #FFF center top;
	background-attachment:fixed;
	background-repeat:repeat-y}
	
a:hover{
	transition:all 0.5s;
	-webkit-transition:all 0.5s;
	-moz-transition:all 0.5s;
	-ms-transition:all 0.5s;
	-o-transition:all 0.5s;}
	
#wrapper{
	width:900px;
	margin:0 auto;
	top:10px;
	margin-bottom:10px;
	position:relative;
	background:url(../imagenes/bg_page.png) #FFF repeat;
	-moz-box-shadow: 0px 0px 5px #797979; 
	-webkit-box-shadow: 0px 0px 5px #797979; 
 	box-shadow: 0px 0px 5px #797979;}
	
#header{
	width:900px;
	height:194px;
	display:block;
	position:relative;}	
	
#marcas_header{
	width:900px;
	height:34px;
	background:url(../imagenes/header.png);
	position:relative;}
	
#logo{	
	float:left;
	display:block;
	position:relative;
	margin-left:35px;
	position:relative;}

#nav{
	width:605px;
	height:194px;
	position:relative;
	display:block;
	margin-right:40px;
	float:right;
	font-size: 1.05em;
	background:url(../imagenes/nav.png) no-repeat}
	
#nav li{
	display: inline-block;
	width:95px;}

#nav a{
	display: block;
	height: 164px;
	line-height:164px;
	color:white;
	font-family:"Open Sans";
	font-weight:700;
	margin-left:22px;
	text-decoration: none;
	-webkit-transition:all .4s;
	-moz-transition:all .4s;
	-o-transition:all .4s;
	transition:all .4s;}

#nav a:hover{
	color:#7E4B18;
	-webkit-transform:scale(1.1);
	-moz-transform:scale(1.1);
	-o-transform:scale(1.1);
	transform:scale(1.1)}
	
#nav .active{
	color:#7E4B18;
	-webkit-transform:scale(1.1);
	-moz-transform:scale(1.1);
	-o-transform:scale(1.1);
	transform:scale(1.1);
	-webkit-transition:all .4s;
	-moz-transition:all .4s;
	-o-transition:all .4s;
	transition:all .4s;}
		
#contacto{
	height:350px;
	display:block;
	position:relative;
	margin-bottom:30px;}
	
.cotizacion{
	height:100%;
	margin-left:45px;
	float:left;
	font-size:0.95em;
	font-family:"Open Sans";
	text-align:justify;
	color:rgb(119, 119, 119);}
	
#banner_contacto{
	clear:both;
	width:820px;
	margin:0 40px 20px 40px;
	height:330px;
	position:relative;
	border-bottom: dashed 1px #777;}
	
#banner_nosotros{
	clear:both;
	top:-20px;
	width:820px;
	margin:0 40px;
	height:450px;
	margin-bottom: 30px;
	display:block;
	position:relative;}	
	
#banner_servicios{
	clear:both;
	top:-20px;
	width:820px;
	margin:0 40px;
	height:450px;
	display:block;
	margin-bottom: 30px;
	position:relative;}	
	
#banner_portada{
	clear:both;
	top:-20px;
	width:820px;
	margin:0 40px;
	height:450px;
	display:block;
	background-image: url(../imagenes/bg_banner.png);
	position:relative;}
	
#portada{
	clear:both;
	height:280px;
	display:block;
	position:relative;
	padding:90px 115px 30px 115px;
	margin-bottom:30px;}

.img_1{
	width:120px;
	height:120px;
	float:left;
	margin:0 50px;
	background:#CDCDCD;
	cursor:pointer;
	border-radius: 50%;
	-webkit-transition:all .7s;
	-moz-transition:all .7s;
	-o-transition:all .7s;
	transition:all .7s;}
	.img_1:hover{
	-webkit-transform:rotate(30deg);
	-moz-transform:rotate(30deg);
	-o-transform:rotate(30deg);
	transform:rotate(30deg)}

#portada p{
	width:180px;
	font-family:"Open Sans";
	text-align:center;
	color:#555;
	float: left;
	margin:20px 20px;}

h5{
	line-height: 0.85em;}

span{
	font-weight: 700;}

#nosotros{
	width:100%;
	height:455px;
	display:block;
	position:relative;
	margin-bottom: 30px;}
	
.menu_nosotros{
	font-size: 1.05em;}

.menu_nosotros ul{border-bottom:1px dashed #777; margin: 0 40px; }

.menu_nosotros li{
	display: inline-block;}

.tabs_a{
	display: block;
	padding:15px 20px;
	line-height: 10px;
	color:#777;
	font-family:"Open Sans";
	font-weight:700;
	text-decoration: none;
	-webkit-transition:all .4s;
	-moz-transition:all .4s;
	-o-transition:all .4s;
	transition:all .4s;}

.tabs_a.current{
	border-top: 1px dashed #777;
	border-left: 1px dashed #777;
	border-right: 1px dashed #777;
	border-bottom: 2px solid #fff;
	color:#006393;
	
	-webkit-transform:scale(1.05);
	-moz-transform:scale(1.05);
	-o-transform:scale(1.05);
	transform:scale(1.05)}

.tabs_b.current{
	border-top: 1px dashed #777;
	border-left: 1px dashed #777;
	border-right: 1px dashed #777;
	border-bottom: 2px solid #fff;
	color:#207553;
	
	-webkit-transform:scale(1.05);
	-moz-transform:scale(1.05);
	-o-transform:scale(1.05);
	transform:scale(1.05)}



strong{ color:#A28D1E}
	
.tabscontent{
	font-size:0.95em;
	margin:10px 40px;
	font-family:"Open Sans";
	text-align:justify;
	color:rgb(119, 119, 119)}

.tabscontent li:before{
	content: url("../imagenes/vineta.png");
}
	
#servicios{
	width:100%;
	height:380px;
	display:block;
	position:relative;
	margin-bottom:30px;}
	
textarea{
	width:330px;
	height:70px;
	border:dotted 1px #999;}

#telefono, #nombre, #apellido, #correo, #empresa{
	width:170px;
	height:18px;
	border:dotted 1px #999;}
	
.boton{
	border:none;
	background-color:#999;
	font-family: 'Open Sans', sans-serif;
	font-size:0.85em;
	color:#fff;
	padding:1px 15px;
	background-image: linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
	background-image: -o-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(44,160,202) 0%, rgb(62,184,229) 100%);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-o-border-radius: 5px;
	border-radius: 5px;}

.boton:active {
	background-image: linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
	background-image: -o-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);
	background-image: -ms-linear-gradient(bottom, rgb(62,184,229) 0%, rgb(44,160,202) 100%);	}
	
.images{
	width:380px;
	float:left;
	margin-top:40px;
	font-size:0.85em;
	font-family:"Open Sans";
	color:#555;}

.img_a{
	width:28px;
	height:28px;;}	
	
#banner_pantone{
	clear:both;
	width:100%;
	height:450px;
	margin-bottom:80px;
	display:block;
	position:relative;}
	
#clientes{
	width:100%;
	height:380px;
	display:block;
	position:relative;
	margin-bottom:30px;}

.punto{
	color:white}
	
.line1{
	width:250px;
	height:100%;
	margin-left:45px;
	float:left;
	font-size:0.95em;
	font-family:"Open Sans";
	text-align:justify;
	color:rgb(119, 119, 119);}
	
.line2{
	width:250px;
	height:100%;
	margin-right:45px;
	float:right;
	font-size:0.95em;
	font-family:"Open Sans";
	text-align:justify;
	color:rgb(119, 119, 119);}
	
	
.line3{
	width:250px;
	height:100%;
	margin-right:29px;
	margin-left:29px;
	float:right;
	font-size:0.95em;
	font-family:"Open Sans";
	text-align:justify;
	color:rgb(119, 119, 119);}
	
.linea1{
	width:380px;
	height:100%;
	margin-left:45px;
	float:left;
	font-size:0.95em;
	font-family:"Open Sans";
	text-align:justify;
	color:rgb(119, 119, 119);}
	
.linea2{
	width:380px;
	height:100%;
	margin-right:45px;
	float:right;
	font-size:0.95em;
	font-family:"Open Sans";
	text-align:justify;
	color:rgb(119, 119, 119);}
		
footer{
	width:900px;
	height:40px;
	display:block;
	margin:auto;
	position:relative;}
	
#marca_footer{
	width:100%;
	height:34px;
	background:url(../imagenes/footer_marcas.png) no-repeat bottom}
	
#espacio2{
	width:100%;
	height:10px;}
	
	
/*logo*/

.cont_logo img
{
  margin: 0 auto;
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  -ms-transition: all .5s;
  -o-transition: all .5s;
  transition: all .5s;
}

.cont_logo:hover img
{
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1);
}

.grafica, .yolvic, .icon{
  display: block;
  position: absolute;
  left: auto;
  -webkit-animation-name: fontbulger;
  -moz-animation-name:    fontbulger;
  -o-animation-name:      fontbulger;
  animation-name:         fontbulger;

  -webkit-animation-duration: .5s;
  -moz-animation-duration: .5s;
  -o-animation-duration: .5s;
  animation-duration: .5s;
}



@-webkit-keyframes fontbulger {
  0%   { opacity: 0; -webkit-transform:scale(1.5); }
  100% { opacity: 1; -webkit-transform:scale(1);}
}
@-o-keyframes fontbulger {
  0%   { opacity: 0; -o-transform:scale(1.5);}
  100% { opacity: 1; -o-transform:scale(1);}
}
@keyframes fontbulger {
  0%   { opacity: 0; transform:scale(1.5);}
  100% { opacity: 1; transform:scale(1);}
}
@-moz-keyframes fontbulger {
  0%   { opacity: 0; -moz-transform:scale(1.5);}
  100% { opacity: 1; -moz-transform:scale(1);}
}