/*Colores:
fondo: #323232;
contenedor: #f2f2f2;
*/
/* Fuentes personalizadas */

@font-face{
	font-family:NexaLight;
	src: url(../../Contenedor/fonts/Nexa.otf) format('truetype');
}

@font-face{
	font-family:Champagne;
	src: url(../../Contenedor/fonts/Champagne_Limousines.ttf) format('truetype');
}

/* Body - Contenedor */

*{
	margin:0;
}
html { overflow-y:hidden; }
body{
	background:#606060;
	color:#606060;
	font-family:Champagne;
	font-size:16px;
}

#contenedor{
	background:#606060;
	margin:0 auto;
	max-width:2000px;
	max-height:1500px;
}

/* Header */

header{
	max-width:2000px;
	height:200px;
	text-align:center;
}

/* Menu */

#menu-principal{
	max-width:640px;
	height:50px;
	margin:0 auto;
}

#menu-principal ul, li {
	display: inline-block;
	position: relative;
}

#menu-principal ul {
	display: inline;
	margin: 0;
	list-style: none;
}

#menu-principal a {
	font-size:20px;
    text-decoration: none;
    color: #adadad;
    display: block;
    padding:0 15px;
    text-align: center;
	line-height:40px;
	background:#e7e7e7;
}

#menu-principal a:hover {
	color:#f2f2f2;
	background:#f17522;
}

#menu-principal ul li ul {
  padding: 0;
  position: absolute;
  top: 48px;
  left: 0;
  width: 150px;
  display: none;
  opacity: 0;
  visibility: hidden;
}

#menu-principal ul li ul li { 
  background: #555; 
  display: block; 
  color: #fff;
  text-shadow: 0 -1px 0 #000;
}

#menu-principal ul li ul li:hover { 
background: #323232;
}

#menu-principal ul li:hover ul {
  display: block;
  text-align:center;
  line-height:30px;
  opacity: 1;
  visibility: visible;
}

/* Menu Secundario*/

#menu-secundario{
	margin-top:-5%;
	max-width:310px;
	height:400px;
        
}
#tra-ind, #tra-col, #tra-int, #prueba-d{
	background:#aa4524;  color:#e7e7e7;  opacity:1;
}
#tra-ind:hover, #tra-col:hover, #tra-int:hover , prueba-d:hover{
opacity:0.8;  background-color:#323232; 

}
#tra-ind{
	position:absolute;
	width:130px;
	height:70px;
	text-align:center;
	font-size:25px;
	display:inline;
	padding:19px;
	font-weight: lighter;
	
	border-right:solid #f17522;
	box-shadow: 3px 3px 10px #d3d3d3;
    -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
    -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
}

#tra-ind:hover{
	
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
}

#tra-ind2{
	position:absolute;
	width:130px;
	height:70px;
	text-align:center;
	font-size:25px;
	display:inline;
	padding:19px;
	font-weight: lighter;
	border-right:solid #f17522;
	box-shadow: 3px 3px 10px #d3d3d3;
    -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
    -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
}

#tra-ind2:hover{
	
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
}



#tra-col{
	position:absolute;
	width:130px;
	height:70px;
	text-align:center;
	font-size:25px;
	display:inline;
	padding:19px;
	font-weight: lighter;
		margin-top:130px;
	
	border-right:solid #f17522;
	box-shadow: 3px 3px 10px #d3d3d3;
    -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
    -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
}

#tra-col:hover{
	
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
}

#tra-int{
	position:absolute;
	width:130px;
	height:70px;
	text-align:center;
	font-size:25px;
	display:inline;
	padding:19px;
	font-weight: lighter;
	
	margin-top:260px;
	
	border-right:solid #f17522;
	box-shadow: 3px 3px 10px #d3d3d3;
    -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
    -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
}

#tra-int:hover{
	
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
}

#prueba-d{
	position:absolute;
	width:130px;
	height:70px;
	text-align:center;
	font-size:25px;
	display:inline;
	padding:19px;
	font-weight: lighter;
	cursor:pointer;
	margin-top:100px;
	
	border-right:solid #f17522;
	box-shadow: 3px 3px 10px #d3d3d3;
    -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
    -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
}

#prueba-d:hover{
	
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
}



/* Botones---------------------------- */

#botones{
	max-width:700px;
	height:310px;
	margin:-330px auto 20%;
}
.foro_f{
        border-right:solid #f17522;
        position:absolute;
	width:300px;
	height:72px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 73px;
	background:#f2f2f2;
	color:#808080;
	margin-top:100px;
	box-shadow: 3px 3px 10px #d3d3d3;
        -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
        -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
}
.foro_f:hover{
	opacity:1;
	background-color:#f17522;
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
        
        
}

.pres_f{
        border-right:solid #f17522;
        position:absolute;
	width:400px;
	height:72px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 73px;
	background:#f2f2f2;
	color:#808080;
	margin-left:0px;
	box-shadow: 3px 3px 10px #d3d3d3;
        -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
        -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
}
.pres_f:hover{
	opacity:1;
	background-color:#f17522;
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
        
        
}

.prueba_f{
        border-right:solid #f17522;
        position:absolute;
	width:300px;
	height:72px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 73px;
	background:#f2f2f2;
	color:#808080;
	margin-left:0px;
	box-shadow: 3px 3px 10px #d3d3d3;
        -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
        -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
}
.prueba_f:hover{
	opacity:1;
	background-color:#f17522;
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
        
        
}


.encuesta{
        border-right:solid #f17522;
        position:absolute;
	width:400px;
	height:72px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 73px;
	background:#f2f2f2;
	color:#808080;
	margin-left:0px;
	box-shadow: 3px 3px 10px #d3d3d3;
        -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
        -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
}
.encuesta:hover{
	opacity:1;
	background-color:#f17522;
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
        
        
}
.foro{
        border-right:solid #f17522;
        position:absolute;
	width:400px;
	height:72px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 73px;
	background:#f2f2f2;
	color:#808080;
	margin-left:200px;
	box-shadow: 3px 3px 10px #d3d3d3;
        -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
        -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
}
.foro:hover{
	opacity:1;
	background-color:#f17522;
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
        
        
}



.actividad{
        border-right:solid #f17522;
        position:absolute;
	width:200px;
	height:72px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 73px;
	background:#f2f2f2;
	color:#808080;
	margin-left:0px;
	box-shadow: 3px 3px 10px #d3d3d3;
        -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
        -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
}
.actividad:hover{
	opacity:1;
	background-color:#f17522;
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
        
        
}
.recurso{
	border-right:solid #f17522;
        position:absolute;
	width:200px;
	height:72px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 73px;
	background:#f2f2f2;
	color:#808080;
	/*margin-left:250px;*/
	box-shadow: 3px 3px 10px #d3d3d3;
        -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
        -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
        
     
}
.recurso:hover{
	opacity:1;
	background-color:#f17522;
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
}
.mom_ind{
	border-right:solid #f17522;
        position:absolute;
	width:200px;
	height:72px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 30px;
	background:#f2f2f2;
	color:#808080;
	margin-left:0;
	box-shadow: 3px 3px 10px #d3d3d3;
        -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
        -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
        
     
}
.mom_ind:hover{
	opacity:1;
	background-color:#f17522;
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
}
.mom_col {
	border-right:solid #f17522;
        position:absolute;
	width:200px;
	height:72px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 30px;
	background:#f2f2f2;
	color:#808080;
	box-shadow: 3px 3px 10px #d3d3d3;
        -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
        -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
        
     
}
.mom_col:hover{
	opacity:1;
	background-color:#f17522;
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
}
.resul {
	border-right:solid #f17522;
        position:absolute;
	width:300px;
	height:72px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 30px;
	background:#f2f2f2;
	color:#808080;
	margin-left:300px;
	box-shadow: 3px 3px 10px #d3d3d3;
        -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
        -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
        
     
}
.resul:hover{
	opacity:1;
	background-color:#f17522;
	box-shadow: 0px 0px 25px #b2b2b2;
       -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
}


a:link
{
    text-decoration: none;
     color: #000;
}
a:visited{
    color: #000;
}


#video, #credi, #justi, #compe, #topic,#g-apre, #g-nave, #elem_com, #time_ind, #time_col, #time_tut
 {
   background:#4c2432;  color:#e7e7e7;  opacity:0.6;
 }
#video:hover, #credi:hover, #justi:hover, #compe:hover, #topic:hover,#g-apre:hover, #g-nave:hover, #elem_com:hover, #time_ind:hover, #time_col:hover, #time_tut:hover
 {   
  opacity:1;  color:#e7e7e7; background-color:#4c2432;
      }



#video{
	position:absolute;
	width:150px;
	height:150px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 145px;
	
	box-shadow: 3px 3px 10px #d3d3d3;
    -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
    -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
    transform:scale(1,1);
    -webkit-transform:scale(1,1);
	-moz-transform:scale(1,1);
	-o-transform:scale(1,1);
}

#video:hover{
	
	
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
	transform:scale(1.1,1.1);
    -webkit-transform:scale(1.1,1.1);
	-moz-transform:scale(1.1,1.1);
	-o-transform:scale(1.1,1.1);
}

#credi{
	position:absolute;
	width:340px;
	height:72px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 73px;
	margin-left:155px;
	box-shadow: 3px 3px 10px #d3d3d3;
    -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
    -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
    transform:scale(1,1);
    -webkit-transform:scale(1,1);
	-moz-transform:scale(1,1);
	-o-transform:scale(1,1);
}

#credi:hover{
	
	
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
	transform:scale(1.1,1.1);
    -webkit-transform:scale(1.1,1.1);
	-moz-transform:scale(1.1,1.1);
	-o-transform:scale(1.1,1.1);
}

#justi{
	position:absolute;
	width:340px;
	height:72px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 73px;
	
	
	margin:77px 0 0 155px;
	box-shadow: 3px 3px 10px #d3d3d3;
    -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
    -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
    transform:scale(1,1);
    -webkit-transform:scale(1,1);
	-moz-transform:scale(1,1);
	-o-transform:scale(1,1);
}

#justi:hover{
	
	
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
	transform:scale(1.1,1.1);
    -webkit-transform:scale(1.1,1.1);
	-moz-transform:scale(1.1,1.1);
	-o-transform:scale(1.1,1.1);
}

#compe{
	position:absolute;
	width:200px;
	height:150px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 150px;
	
	
	
	margin-left:500px;
	box-shadow: 3px 3px 10px #d3d3d3;
    -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
    -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
    transform:scale(1,1);
    -webkit-transform:scale(1,1);
	-moz-transform:scale(1,1);
	-o-transform:scale(1,1);
}

#compe:hover{
	
	
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
	transform:scale(1.1,1.1);
    -webkit-transform:scale(1.1,1.1);
	-moz-transform:scale(1.1,1.1);
	-o-transform:scale(1.1,1.1);
}

#topic{
	position:absolute;
	width:700px;
	height:72,5px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 73px;
	
	
	
	margin-top:155px;
	box-shadow: 3px 3px 10px #d3d3d3;
    -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
    -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
    transform:scale(1,1);
    -webkit-transform:scale(1,1);
	-moz-transform:scale(1,1);
	-o-transform:scale(1,1);
}

#topic:hover{
	
	
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
	transform:scale(1.1,1.1);
    -webkit-transform:scale(1.1,1.1);
	-moz-transform:scale(1.1,1.1);
	-o-transform:scale(1.1,1.1);
}

#g-apre{
	position:absolute;
	width:347px;
	height:72,5px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 73px;
	
	
	
	margin-top:235px;
	box-shadow: 3px 3px 10px #d3d3d3;
    -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
    -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
    transform:scale(1,1);
    -webkit-transform:scale(1,1);
	-moz-transform:scale(1,1);
	-o-transform:scale(1,1);
}

#g-apre:hover{
	
	
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
	transform:scale(1.1,1.1);
    -webkit-transform:scale(1.1,1.1);
	-moz-transform:scale(1.1,1.1);
	-o-transform:scale(1.1,1.1);
}

#g-nave{
	position:absolute;
	width:348px;
	height:72,5px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 73px;
	
	
	
	margin:235px 0 0 354px;
	box-shadow: 3px 3px 10px #d3d3d3;
    -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
    -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
    transform:scale(1,1);
    -webkit-transform:scale(1,1);
	-moz-transform:scale(1,1);
	-o-transform:scale(1,1);
}

#g-nave:hover{
	
	
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
	transform:scale(1.1,1.1);
    -webkit-transform:scale(1.1,1.1);
	-moz-transform:scale(1.1,1.1);
	-o-transform:scale(1.1,1.1);
}

#elem_com{
	position:absolute;
	width:500px;
	height:72,5px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 73px;
	
	
	margin-top:0px;
        margin-left:100px;
	box-shadow: 3px 3px 10px #d3d3d3;
    -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
    -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
    transform:scale(1,1);
    -webkit-transform:scale(1,1);
	-moz-transform:scale(1,1);
	-o-transform:scale(1,1);
}

#elem_com:hover{
	
		box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
	transform:scale(1.1,1.1);
    -webkit-transform:scale(1.1,1.1);
	-moz-transform:scale(1.1,1.1);
	-o-transform:scale(1.1,1.1);
}
#time_ind{
	position:absolute;
	width:500px;
	height:72,5px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 73px;
	
	
	
	margin-top:80px;
        margin-left:80px;
	box-shadow: 3px 3px 10px #d3d3d3;
    -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
    -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
    transform:scale(1,1);
    -webkit-transform:scale(1,1);
	-moz-transform:scale(1,1);
	-o-transform:scale(1,1);
}

#time_ind:hover{
	
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
	transform:scale(1.1,1.1);
    -webkit-transform:scale(1.1,1.1);
	-moz-transform:scale(1.1,1.1);
	-o-transform:scale(1.1,1.1);
}

#time_col{
	position:absolute;
	width:500px;
	height:72,5px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 73px;
	
	
	
	margin-top:160px;
        margin-left:80px;
	box-shadow: 3px 3px 10px #d3d3d3;
    -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
    -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
    transform:scale(1,1);
    -webkit-transform:scale(1,1);
	-moz-transform:scale(1,1);
	-o-transform:scale(1,1);
}

#time_col:hover{
	
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
	transform:scale(1.1,1.1);
    -webkit-transform:scale(1.1,1.1);
	-moz-transform:scale(1.1,1.1);
	-o-transform:scale(1.1,1.1);
}

#time_tut{
	position:absolute;
	width:500px;
	height:72,5px;
	text-align:center;
	font-size:30px;
	display:inline;
	line-height: 73px;
	
	
	
	margin-top:240px;
        margin-left:80px;
	box-shadow: 3px 3px 10px #d3d3d3;
    -webkit-box-shadow: 3px 3px 10px #d3d3d3;
	-moz-box-shadow: 3px 3px 10px #d3d3d3;
	-o-box-shadow: 3px 3px 10px #d3d3d3;
	transition: box-shadow 1s, transform 1s, background 1s;
    -webkit-transition: opacity 1s, -webkit-box-shadow 1s, -webkit-transform 1s, background 1s, color 1s;
	-moz-transition: opacity 1s, -moz-box-shadow 1s, -moz-transform 1s, background 1s, color 1s;
	-o-transition: opacity 1s, -o-box-shadow 1s, -o-transform 1s, background 1s, color 1s;
    transform:scale(1,1);
    -webkit-transform:scale(1,1);
	-moz-transform:scale(1,1);
	-o-transform:scale(1,1);
}

#time_tut:hover{
	
	box-shadow: 0px 0px 25px #b2b2b2;
    -webkit-box-shadow: 0px 0px 25px #b2b2b2;
	-moz-box-shadow: 0px 0px 25px #b2b2b2;
	-o-box-shadow: 0px 0px 25px #b2b2b2;
	transform:scale(1.1,1.1);
    -webkit-transform:scale(1.1,1.1);
	-moz-transform:scale(1.1,1.1);
	-o-transform:scale(1.1,1.1);
}

/* Footer */


footer{
 position: fixed;
    width:2000px;
    height:70px;
    margin:0 auto auto auto;
    background:#323232;
    bottom:0%;
    right:0%;
}
footer #logo{
   
    position: fixed; 
    bottom: 20px; 
    left: 3%; 
    float: left;
    margin-right: 10%;
   
    /*background: url("images/logo.png") no-repeat center fixed;  */
}
.link{
   float:right; 
   line-height:70px;
   margin-right:8%;
   font-size: 21px;
  background-size: cover;
}

/* Estilos Basicos */

h1{
	color:#fff;
	font-size:130px;
	font-weight: lighter; 
}

h5{
	color:#323232;
	font-size:20px;
	font-weight: lighter;
}

/* Estilo POPups*/

#element_to_pop_up1,#element_to_pop_up2,#element_to_pop_up3,#element_to_pop_up4,#element_to_pop_up5
,#element_to_pop_up6,#element_to_pop_up7,#element_to_pop_up8,#element_to_pop_up9,#element_to_pop_up10,#element_to_pop_up11
,#element_to_pop_up12,#element_to_pop_up13,#element_to_pop_up14,#element_to_pop_up15,#element_to_pop_up16,
#element_to_pop_up17,#element_to_pop_up18,#element_to_pop_up19,#element_to_pop_up_r1,#element_to_pop_up_r2,#element_to_pop_up_r3,#element_to_pop_up_r4
,#element_to_pop_up_r5,#element_to_pop_up_r6,#element_to_pop_up_r7,#element_to_pop_up_r8,#element_to_pop_up_r9,#element_to_pop_up_r10
,#element_to_pop_up_r11,#element_to_pop_up_r12,#element_to_pop_up_20

{ 
    height:320px;
    width:750px;
    background-color:#fff;
    border-radius:15px;
    color:#000;
    display:none; 
    padding:20px;
    min-width:350px;
    min-height: 180px;
    font-family:helvetica; 
    margin-top: 20px;
    background-image: url('http://sanmateovirtual.edu.co/moodle/Modulos/Contenedor/images/bpopup.png');
}

#element_to_pop_up 
{ 

    background-color:#fff;
    border-radius:15px;
    color:#000;
    display:none; 
    padding:20px;
    min-width:350px;
    min-height: 180px;
    font-family:helvetica; 
    margin-top: 20px;
 
}



.b-close{
    cursor:pointer;
    position:absolute;
    right:10px;
    top:5px;
}

/* ----- - ToolTip ----------*/
a.tooltip {outline:none; }
a.tooltip strong {line-height:30px;}
a.tooltip:hover {text-decoration:none;} 
a.tooltipa {outline:none; }
a.tooltipa strong {line-height:30px;}
a.tooltipa:hover {text-decoration:none;} 
a.tooltipb {outline:none; }
a.tooltipb strong {line-height:30px;}
a.tooltipb:hover {text-decoration:none;} 
a.tooltip span {    
    z-index:10;display:none; padding:14px 20px;
    margin-top:0px; margin-left:200px;
    width:200px; line-height:16px;
    font-size: 21px;
}
a.tooltipa span {
    z-index:10;display:none; padding:14px 20px;
    margin-top:130px; margin-left:200px;
    width:200px; line-height:16px;
     font-size: 21px;
}
a.tooltipb span {
    z-index:10;display:none; padding:14px 20px;
    margin-top:260px; margin-left:200px;
    width:200px; line-height:16px;
     font-size: 21px;
}
a.tooltip:hover span{
    display:inline; position:absolute; color:#111;
    border:1px solid #DCA; background:#fff;}
a.tooltipa:hover span{
    display:inline; position:absolute; color:#111;
    border:1px solid #DCA; background:#fff;}
a.tooltipb:hover span{
    display:inline; position:absolute; color:#111;
    border:1px solid #DCA; background:#fff;}
.callout {z-index:20;position:absolute;top:30px;border:0;left:-12px;}
    
/*CSS3 extras*/
a.tooltip span
{
    border-radius:4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
        
    -moz-box-shadow: 5px 5px 8px #CCC;
    -webkit-box-shadow: 5px 5px 8px #CCC;
    box-shadow: 5px 5px 8px #CCC;
}
a.tooltipa span
{
    border-radius:4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
        
    -moz-box-shadow: 5px 5px 8px #CCC;
    -webkit-box-shadow: 5px 5px 8px #CCC;
    box-shadow: 5px 5px 8px #CCC;
}
a.tooltipb span
{
    border-radius:4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
        
    -moz-box-shadow: 5px 5px 8px #CCC;
    -webkit-box-shadow: 5px 5px 8px #CCC;
    box-shadow: 5px 5px 8px #CCC;
}



/* Backgrounds*/
.sTop{
        min-height: 700px;
	/*background: #2e2e2e;*/
        background:url('/moodle/Modulos/M37916/images/1.jpg')  no-repeat  center center ; 
        background-size: cover;

}
.s1{
    
    	min-height: 1000px;
	/*background: #2e2e2e;*/
        background: url('/moodle/Modulos/M37916/images/2.jpg') no-repeat  center center ; 
        background-size: cover;

	
}
.s2{
    min-height: 700px;
	/*background: #2e2e2e;*/
        background: url('/moodle/Modulos/M37916/images/3.jpg') no-repeat  center center ; 
        background-size: cover;
      
}
.s3{
    min-height: 700px;
	/*background: #2e2e2e;*/
        background: url('/moodle/Modulos/M37916/images/4.jpg') no-repeat  center center ; 
        background-size: cover;
    
}
.s4{
    min-height: 700px;
	/*background: #2e2e2e;*/
        background: url('/moodle/Modulos/M37916/images/5.jpg') no-repeat  center center ; 
        background-size: cover;
    
}
.s5{
    min-height: 700px;
	/*background: #2e2e2e;*/
        background: url('/moodle/Modulos/M37916/images/6.jpg') no-repeat  center center ; 
        background-size: cover;

     
}


/* -------------Estilo textos hover 2da interfaz-------------  */

.object1 , .object2{
background-color: white;
position: absolute;
margin-top: 80px; width: 400px;
color: black;

}
 .object3, .object4, .object5, .object6, .object7, .object8, .object9, .object10,
.object11, .object12, .object13, .object14,.object15, .object16, .object17, .object18,
.object19, .object20, .object21, .object22, .object23, .object24, .object25, .object26,
 .object27, .object28, .object29, .object30, .object31, .object32, .object33, .object34,
.object35, .object36, .object37, .object38, .object39, .object40, .object41, .object42, .object43,
.object44, .object45, .object46, .object47
{
background-color: white;
position: absolute;
margin-top: -90px; width: 400px;
color: black;

}

