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

  
    .footer { 
background-color: #cdcdcd; 
height: 30px; 

padding-top: 10px; 
width: 100%; 
position:fixed; 
left: 0px; 
bottom: 0px;
z-index:4;
 

} 
.footer p { position:relative; top:3px;
font-family: Arial, Helvetica, sans-serif;
text-align: center; 
	color: #7d7d7d;
	font-size: 11px;
	letter-spacing: 0px;
	text-shadow: #fff 1px 1px 1px;
	filter: progid:DXImageTransform.Microsoft.Shadow(color='#ffffff', Direction=135, Strength=1);

}



   /* <!--[if lte IE 6]> 
    <style type="text/css"> text-shadow:#A5A4A5 2px 2px 2px;
filter: progid:DXImageTransform.Microsoft.Shadow(color='#A5A4A5', Direction=135, Strength=2);
    body {height:100%; overflow-y:auto;} 
    html {overflow-x:auto; overflow-y:hidden;} 
    * html .footer {position:absolute;} 
    </style> 
    <![endif]-->*/




  
      * {
        margin: 0px;
        padding: 0px;
      }
      body {
        background:;
        position: relative;
	/* overflow-y:hidden; para quitar el scroll vertical*/
      }
	   /* outline none quita la linea de puntos en los en laces en IE */
	  * { outline:none;
    
}

#total { width:1320px; position: absolute;
	top:;
    left: 50%;
		margin-left: -660px; float:left; }




	
 /*#pie{ width:100%; background-color: #333333; position:relative; bottom:50px; float:left; height:20px;}*/
 /*quita la linea de puntos en los enlaces en firefox */
button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner {
        border: none;
}

       
	  #linea{ height:2px; width:100%; background-color: #CCCCCC; position:absolute; top:235px;}
	  #linea2{ height:2px; width:100%; background-color: #CCCCCC; position:absolute; top:285px;}
	  #linea3{ height:2px; width:100%; background-color: #CCCCCC; position:absolute; top:335px;}
	  #linea4{ height:2px; width:100%; background-color: #CCCCCC; position:absolute; top:385px;}
	  
	  div#contenedor{ float:left; 
	  }
	   div#contenedor2{ float:left; width:500px;
	  }
	  div#botones{ float:left; display:block; background-color:; width:600px; padding-left:140px; height:250px; padding-top:0px; 
	  }
      div#shell {
        display: block;
        position: relative;
        left: 50%;
		margin-left: -470px;
        width: 800px;
        height: 600px;
		float:left;
		background-color:;
		
      }
      div#shell{
        z-index: 1;
      }
	   
	    #logo2{ background: url(img/logoweb.png); height:200px; width:500px; background-repeat:no-repeat; position:absolute; top:17px; left:-500px;  cursor: pointer; }
		
	   #logo2 span{ background:url(img/slideTrans2.png) no-repeat;  position: absolute;
        display: block;
        width: 50px;
        height: 200px;
		left:-100px;
		z-index:1; }
	  #logo{ float:left; height:200px; width:500px; background-repeat:no-repeat; background-color:;}
	
 
	  
	  #topnav{ list-style:none; position:absolute; left:-800px; background:url(img/botonBlg.png) bottom no-repeat; height:253px; width:400px;}
	  
	  /* el vertical align hace que no se descuadren los botones en IE */
	  #topnav a
{
    
    cursor: pointer; vertical-align:bottom; width:400px;  

}

.container {
			
	overflow: hidden;
}	 

ul#topnav {
	margin: 10px 0 20px; 
	padding: 0; 
	list-style: none;	
	font-size: 1.1em;
	clear: both;
	
	width: 400px;
}
ul#topnav li{
	margin: 0; 
	padding: 0; 
	overflow: hidden; 
	
	height:50px;
	width:400px;
	cursor:pointer;
cursor:hand;



}


ul#topnav a, ul#topnav span {
	
	float: left; 
	text-decoration: none; 
	color: #fff;
	text-transform: uppercase;
	clear: both;
	height: 50px;
	width:400px;
	line-height: 20px;
	background: #1d1d1d; 
} 

ul#topnav a {	color: #7bc441; }
ul#topnav span {
	display: none;
}

ul#topnav.v2 li{
	background:  url(img/botonblc.png) repeat-x left top; 
}

ul#topnav.v2 li#li5 {
	background:   url(img/botonBlg.png) repeat-x left top;
}

ul#topnav.v2 li#li1 span{
	background:  url(img/home2txt.png) repeat-x left top; 
}

ul#topnav.v2 li#li1 a{
	color: #555;
	background:  url(img/hometxt2.png) repeat-x left  top; 
}

ul#topnav.v2 li#li2 span{
	background:  url(img/quienes2txt.png) repeat-x left top; 
}

ul#topnav.v2 li#li2 a{
	color: #555;
	background:  url(img/quienestxt2.png) repeat-x left  top; 
}

ul#topnav.v2 li#li3 span{
	background:  url(img/servicios2txt.png) repeat-x left top; 
}

ul#topnav.v2 li#li3 a{
	color: #555;
	background:  url(img/serviciostxt2.png) repeat-x left  top; 
}

ul#topnav.v2 li#li4 span{
	background:  url(img/contactotxt.png) repeat-x left top; 
}

ul#topnav.v2 li#li4 a{
	color: #555;
	background:  url(img/contactotxt2.png) repeat-x left  top; 
}

ul#topnav.v2 li#li5 span{
	background:  url(img/blogtxt.png) repeat-x left top; 
}

ul#topnav.v2 li#li5 a{
	color: #555;
	background:  url(img/blogtxt2.png) repeat-x left  top; 
}

li.active a:visited{ background:  url(img/blogtxt2.png) repeat-x left  top}


      div#azul {
        position: absolute;
        top: 0px;
        left: 420px;
		width:200px;
        z-index: 1;
      }
      div#rojo {
        position: absolute;
        z-index: 2;
        top:100px;
        left: 92px;
		width:400px;
      }
      div#verde {
        position: absolute;
        z-index: 3;
        top:140px;
        left: 260px;
		width:450px;
      }
      div#naranja {
        position: absolute;
        top: 320px;
        left: 200px;
		width:250px;
        z-index: 4;
      }
	   #azuli {width:100%;
       
      }
      #rojoi {width:100%;
     
      }
      #verdei { width:100%;
     
      }
      #naranjai { width:100%;
        
      }
	  #verde p { position:absolute; top:200px; left:150px; display: none; 
	  }
	  
	  #textoverde {position:absolute; top:130px; left:190px; z-index:5; display: none; width:520px; font-family: Arial, Helvetica, sans-serif; font-size:12px;
	  }
	  
	  #textoverde h1 { color: #166627;
	  }
	 
	  
	  #textoverde p { color: #616362; padding-top:5px; padding-bottom:5px;
	  }
	  
	   #textoverde a {text-decoration:none; color: #616362;
	  }
	  #textoverde span{ color: #2E7E16;  
	  }
	   #textoverde h1 span {
        background:  url(img/gradient-white2.png) repeat-x;
        position: absolute;
        display: block;
        width: 100%;
        height: 31px;
       }
	   #textoverde h1.title{ padding-bottom:7px;}
	   
	   #inicio1{ padding-top:0px;
        }
		 #jump  { padding-top:30px;
	    }
		 #jump  h1{ font-size:14px;
	    }
		 #jump  h1:hover{ color: #999999; 
	    }

	  #textorojo {position:absolute; top:135px; left:195px; z-index:5; display: none; width:510px; font-family: Arial, Helvetica, sans-serif; font-size:12px
	  }
	  #textorojo ul { padding-left:px;
	  }
	  
	  #textorojo h1 { color: #B70F0B;
	  }
	   #textorojo p{  padding-top:5px; padding-bottom:5px; 
	  }
	 
	  #textorojo ul{ color: #616362; 
	  }
	  #textorojo span{ color: ; font-weight:; 
	  }
	   #textorojo a{ text-decoration:none;
	  }
	   #inicio h1:hover{ color:  #999999; 
	  }
	   #textorojo span{ color: #B70F0B ; 
	  }
	  h1.sevicios{ padding-bottom:7px;}
	  
	  
	  	   #textorojo h1 span {
        background:  url(img/gradient-white2.png) repeat-x;
        position: absolute;
        display: block;
        width: 100%;
        height: 31px;
}

       #inicio{ padding-top:30px;

  
  }
	  #textonaranja {position:absolute; top:140px; left:200px; z-index:5; display: none; width:510px; font-family: Arial, Helvetica, sans-serif; font-size:14px
	  }
	  
	  #contactoNaranja{ margin-left:10px;}
	  	  #contactoNaranja p{ font-family: Arial, Helvetica, sans-serif; font-size:14px; color:#0d85a5; width:100%; float:left;
	  }
	   #contactoNaranja span{  color: #F90; 
	  }
	  
	  
	   #textoazul {position:absolute; top:120px; left:240px; z-index:5; display: none; width:390px; font-family: Arial, Helvetica, sans-serif; font-size:12px
	  }
	  
	  #textoazul h1 { color: #0099FF;
	  }
	  #textoazul p{ color: #616362; padding-top:5px; padding-bottom:5px;
	  } 
	  
	  span#participa{ padding-left:17px; position:relative; bottom:2.5px; text-decoration:none; color:#999999;}
	  
	  #blog span{ color: #7A91DE ; 
	  }
	  
	 
	  	    #textoazul a{ 
	display: block;
	height: 10px;
	width: 10px;
	margin: 3px;
	padding: 0;
	outline: 0;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	text-decoration:none;
		border: 1px solid  #333333;
	background: #999999;
	position:relative; top:10px; left:-1px;
	
}
	  
	   #textoazul a:hover{background: #666666; 
	  }
	  
	  
	  

        #CanvasContenedor{  width:1200px; position:absolute; left:80px; top:560px;  float:left; overflow:none; z-index:3;
		/* For IE 8 
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";*/
	/* For IE 5.5 - 7 
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=140, Color='#000000'); A9C630 (color verde claro del canvas)*/
   }


#canvas{ width:30%; height:200px; background-color:#9BAD2D; position:relative; float:left; padding:10px; margin-top:50px;
-webkit-box-shadow: 2px 2px 2px #000;
-moz-box-shadow: 2px 2px 2px #000;
box-shadow: 2px 2px 2px #000;
opacity:0.8;

}


#canvas2{ width:30%; height:200px; background-color:#1691BF;  position:relative; float:left; padding:10px; margin-top:50px;
-webkit-box-shadow: 2px 2px 2px #000;
-moz-box-shadow: 2px 2px 2px #000;
box-shadow: 2px 2px 2px #000;
opacity:0.8;




}
#canvas3{ width:30%;height:200px; background-color: #E0081A; position:relative; float:left; padding:10px; margin-top:50px;
-webkit-box-shadow: 2px 2px 2px #000;
-moz-box-shadow: 2px 2px 2px #000;
box-shadow: 2px 2px 2px #000;
opacity:0.8;
filter:alpha(opacity=100); 
}
#AjusteCanvas{ width:; height:200px;  position:relative; margin:100px;

}
.SeparadorCanvas{ float:left; position:relative; padding:3px;}

#CanvasContenedor h1 { font-family: Arial, Helvetica, sans-serif; color:#FFFFFF; font-size:20px; margin-left:10px;}
 #CanvasContenedor p { 
	}
#parrafos p{ font-family: Arial, Helvetica, sans-serif; color: #FFFFFF; font-size:11px; margin-left:10px; margin-right:15px;
	letter-spacing: 0px; padding-top:5px;}
#parrafos{ padding-top:5px; float:left; width: 50%;}

#icono01{ background-image: url(img/rrdd.png) ; background-repeat:no-repeat; padding:10px;  height:150px; position:relative; top:25px; left:220px; width: 40%; }
#icono02{ background-image: url(img/copa.png) ; background-repeat:no-repeat; padding:10px;  height:150px; position:relative; top:25px; left:220px; width: 40%;}
#icono03{ background-image: url(img/android.png) ; background-repeat:no-repeat; padding:10px;  height:150px; position:relative; top:25px; left:220px; width: 40%; }


.redes{  z-index:5;  margin: 0;
  font-size: 80% /*smaller*/;
  font-weight: bold;
  line-height: 1.1;
  text-align: center;
  position: fixed;
  top: 2em;
  left: auto;
  width:40px;right:0; top:100px;
  background-color:transparent;
  padding:10px 0;
 /*   -moz-border-radius-topleft: 5px;
  -webkit-border-top-left-radius:5px;
  -moz-border-radius-bottomleft:5px;
  -webkit-border-bottom-left-radius:5px;
  -webkit-box-shadow: 2px 2px 2px #000;
  -moz-box-shadow: -0.5px 3px 2px  #777C7C;
  box-shadow: -0.5px 3px 2px  #777C7C; */
  
  /* For IE 8 
	-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";*/
	/* For IE 5.5 - 7 
	filter: progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=-140, Color='#777C7C');
  border:0.5px solid  #DFDFDF ;
  border-right-width:0;*/
  height:100px;
  
} 

 
#redes{width:23px;}
#redes ul{width:23px; height:100px;}
#redes li, #redes a{ text-decoration:none;  list-style-type: none; width:23px; height:23px;  }
.facebook a{ background-image:url(img/Facebook_icon2.png) ; background-repeat:no-repeat; padding:15px;  height:23px; position:relative; top:43px; left:-10px; }
.twitter a{ background-image:url(img/Twitter_icon2.png) ; background-repeat:no-repeat;  padding:15px; height:23px; position:relative; top:50px; left:-10px; }

.google a{ background-image:url(img/GooglePlus_icon.png) ; background-repeat:no-repeat;  padding:15px; height:23px; position:relative; top:57px; left:-10px; }  

.youtube a{ background-image:url(img/youtube_icon.png) ; background-repeat:no-repeat;  padding:15px; height:23px; position:relative; top:64px; left:-10px; }    

 /* .seguir a{ background-image: url(img/seguir.png) ; background-repeat:no-repeat;  padding:10px; padding-bottom:60px;  height:64px; position:relative; top:7px; } */      

#easyTooltip{
	 min-width: 40px;
 color: #dddddd;
 background: #444;
 border: 1px solid #777;
 padding: 8px;
 display: none;
 opacity: 0.9;
 filter: alpha(opacity=90);
 text-align: left;
 border-radius: .5em;
 -moz-border-radius: .5em;
 -webkit-border-radius: .5em;
 z-index: 1000;
  display: block;
 text-align: center;
 font-family: Helvetica, sans-serif;
 font-size:12px;
	}