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

body 
{
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	background-image: url(graficos/layout/bg-x.jpg);
	background-repeat: repeat-x;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}
a:link 
{
	color: #333;
	text-decoration: none;
}
a:visited 
{
	text-decoration: none;
	color: #333;
}
a:hover 
{
	text-decoration: none;
	color: #23A8CF;
}
a:active
 {
	text-decoration: none;
	color: #333;
}

*:focus
{
	outline: none;
}

img 
{
	border: 0px;
}

/*ESTRUCTURA*/

#master
{
	width:980px;
	height:740px;
	margin-left:auto;
	margin-right:auto;
	animation:miTrans 1s;
	-moz-animation:miTrans 1s; /* Firefox */
	-webkit-animation:miTrans 1s; /* Safari and Chrome */
	
	/*background-color:#333333;*/
}

#header
{
	width:980px;
	height:82px;
	margin-left:auto;
	margin-right:auto;
	background-color:#21A9D1;
}

#headerLogo
{
	width:331px;
	height:82px;
	float:left;
	margin-left:57px;
	/*background-color:#000;*/
}
#headerID
{
	width:534px;
	height:82px;
	float:left;
	/*background-color:#000;*/
}

#content
{
	width:866px;
	height:497px;/*495*/
	margin-left:auto;
	margin-right:auto;
	background-color:#F3F4F4;
}

#contentL
{
	width:331px;
	height:495px;
	float:left;
	margin-left:-1px;
	border-style:solid;
	border-width:1px;
	border-color:#D5D5D5;
	position:absolute;
	z-index:9999;
	/*background-color:#00FF00;*/

}

#contentLParche
{
	width:57px;
	height:497px;
	float:left;
	margin-left:-57px;
	position:absolute;
	z-index:9999;
	background-color:#FFF;

}

#contentR
{
	width:534px;
	height:495px;
	float:right;
	position:relative;
	/*border-color:#ff0000;*/
	/*background-color:#F1F1F2;*/
}

#contentR2
{
	width:534px;
	height:495px;
	float:right;
	position:relative;
	background-image:url(graficos/layout/bg-content.jpg);
	/*border-color:#ff0000;*/
	/*background-color:#F1F1F2;*/
}

#contentR2CajaTexto
{
	width:473px;
	height:429px;
	position:relative;
	margin-left:18px;
	margin-top:32px;
	padding-right:5px;
	overflow:auto;
	/*background-color:#000;*/
}


#footer
{
	width:866px;
	height:164px;
	margin-left:auto;
	margin-right:auto;
	margin-top:-2px;
	clear:both;
	background-color:#F1F1F2;
}

#footerL1
{
	width:331px;
	height:164px;
	float:left;
	/*background-color:#C1C0BE;*/
}

#footerR
{
	width:534px;
	height:164px;
	float:right;
}

/*HOME*/
#boton1Off
{
width:376px;
height:124px;
left:0px;/*376*/
top:-0px;
position:absolute;
background-image:url(graficos/layout/m1-off.jpg);
/*background:green;*/
z-index:9;
}

#boton2Off
{
width:376px;
height:124px;
left:0px;/*376*/
top:124px;
position:absolute;
background-image:url(graficos/layout/m2-off.jpg);
/*background:green;*/
z-index:9;
}

#boton3Off
{
width:376px;
height:124px;
left:0px;/*376*/
top:248px;
position:absolute;
background-image:url(graficos/layout/m3-off.jpg);
/*background:green;*/
z-index:9;
}

#boton4Off
{
width:376px;
height:124px;
left:0px;/*376*/
top:372px;
position:absolute;
background-image:url(graficos/layout/m4-off.jpg);
/*background:green;*/
z-index:9;
}

@media only screen and (device-width: 768px) 
{
  /* For general iPad layouts */
#boton1On
{
width:376px;
height:124px;
left:376px;/*-376*/
margin-top:0px;
position:absolute;
/*background:red;*/
z-index:99;
/*display:none;*/
}
  
  
#boton2On
{
width:376px;
height:124px;
left:376px;/*-376*/
margin-top:0px;
position:absolute;
/*background:green;
z-index:99;
/*display:none;*/
}

#boton3On
{
width:376px;
height:124px;
left:376px;/*-376*/
margin-top:0px;
position:absolute;
/*background:green;*/
z-index:99;
/*display:none;*/
}


#boton4On
{
width:376px;
height:124px;
left:376px;/*-376*/
margin-top:0px;
position:absolute;
/*background:green;*/
z-index:99;
/*display:none;*/
}
#boton1On:hover
{
	display:none;
}

#boton2On:hover
{
	display:none;
}


#boton3On:hover
{
	display:none;
}


#boton4On:hover
{
	display:none;
}

}

  
@media screen and (max-device-width: 480px)
{
 /*--- iPhone only CSS here ---*/
 #boton1On
{
width:376px;
height:124px;
left:376px;/*-376*/
margin-top:0px;
position:absolute;
/*background:red;*/
z-index:99;
/*display:none;*/
}
  
  
#boton2On
{
width:376px;
height:124px;
left:376px;/*-376*/
margin-top:0px;
position:absolute;
/*background:green;
z-index:99;
/*display:none;*/
}

#boton3On
{
width:376px;
height:124px;
left:376px;/*-376*/
margin-top:0px;
position:absolute;
/*background:green;*/
z-index:99;
/*display:none;*/
}


#boton4On
{
width:376px;
height:124px;
left:376px;/*-376*/
margin-top:0px;
position:absolute;
/*background:green;*/
z-index:99;
/*display:none;*/
}
#boton1On:hover
{
	display:none;
}

#boton2On:hover
{
	display:none;
}


#boton3On:hover
{
	display:none;
}


#boton4On:hover
{
	display:none;
}
}


#boton1On
{
width:752px;
height:124px;
margin-left:-376px;/*376-752*/
position:relative;
/*background:red;*/
z-index:99;
/*display:none;*/
}


#boton1On:hover
{
position:relative;

animation:miMovida 200ms;
animation-iteration-count:1;
animation-fill-mode: forwards;

-webkit-animation:miMovida 200ms;
-webkit-animation-iteration-count:1;
-webkit-animation-fill-mode: forwards;
}

#boton2On
{
width:752px;
height:124px;
margin-left:-376px;/*-376*/
margin-top:0px;
position:relative;
/*background:red;*/
z-index:99;
/*display:none;*/
}


#boton2On:hover
{
position:relative;

animation:miMovida 200ms;
animation-iteration-count:1;
animation-fill-mode: forwards;

/* Safari and Chrome */
-webkit-animation:miMovida 200ms;
-webkit-animation-iteration-count:1;
-webkit-animation-fill-mode: forwards;
}


#boton3On
{
width:752px;
height:124px;
margin-left:-376px;/*376*/
position:relative;
/*background:red;*/
z-index:99;
/*display:none;*/
}


#boton3On:hover
{
position:relative;

animation:miMovida 200ms;
animation-iteration-count:1;
animation-fill-mode: forwards;

/* Safari and Chrome */
-webkit-animation:miMovida 200ms;
-webkit-animation-iteration-count:1;
-webkit-animation-fill-mode: forwards;
}

#boton4On
{
width:752px;
height:124px;
margin-left:-376px;/*376*/
position:relative;
/*background:red;*/
z-index:99;
/*display:none;*/
}


#boton4On:hover
{
position:relative;

animation:miMovida 200ms;
animation-iteration-count:1;
animation-fill-mode: forwards;

/* Safari and Chrome */
-webkit-animation:miMovida 200ms;
-webkit-animation-iteration-count:1;
-webkit-animation-fill-mode: forwards;
}




@keyframes miMovida
{
from {left:0px;}
to {left:376px;}
}

@-webkit-keyframes miMovida /*Safari and Chrome*/
{
from {left:0px;}
to {left:376px;}
}



@keyframes miTrans
{
from {opacity:0;}
to {opacity:1;}
}

@-moz-keyframes myfirst /* Firefox */
{
from {opacity:0;}
to {opacity:1;}
}

@-webkit-keyframes miTrans /* Safari and Chrome */
{
from {opacity:0;}
to {opacity:1;}
}


/*TEXTO*/
.txtGral
{
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#333;
}


.txtTit1
{
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:bolder;
	color:#333;
}
