/* CSS Document1 */

body {margin:0px; 
	color:#000;
	background-color:#848205;
	/* background-color:#DCCEB4; */
	}


/********************Globel work***********************************/
.titulo {display:none;}
*{margin:0px; padding:0px;}

body, ol, ul, p, hr {margin:0px; padding:0px;} 


h1, h2, h3, h4, h, h6{width:960px; margin:0 auto;}

/****************** area de encabezado **************/
#top {background:#a3bf42 !important;}  
/*{background:#DCCEB4 !important;}  */
.encabezado {width:984px;background: url(https://dl.dropboxusercontent.com/u/22055425/Sitio%20ACU/Pruebas/headerc.png); 
background-repeat:no-repeat; height:105px; background-position: 0px 15px;}
.encabezado_left { float: left; width: 515px;}
.encabezado_right { float: right; width: 450px;}
.encabezado .subtitulo {margin:0px; padding:0 0 0 110px; top:-45px; display: block; font-size:18px; color: #fff; font-weight: normal;}
.encabezado img{margin:0; padding:0}

/*************************area de menu superior***********************************/
#menu_superior{
   float:right;
  margin-top:27px;
}
#menu_superior li a:hover{
}
#menu_superior li a{
  color:#FFF;
}
#menu_superior li{
  padding:0px 11px;
  display:inline-block;
}

/*************************area de menu***********************************/

/*#menu {color:#000;width:1000px; height:71px;}
#areanavegacion {width:980px;}*/
#areanavegacion ul#navlist {margin: 0 auto;}

#areanavegacion ul#navlist a {
	text-decoration: none;
	color: #FFF;
	}
#areanavegacion ul#navlist, ul#navlist ul, ul#navlist li {
	margin: 0px 0; 
      padding: 2px 2px; list-style: none; font-size: 16px; display: block; text-align: center;
	/*padding-top:25px;*/
	}
#areanavegacion ul#navlist li { border-right: 2px solid #DCCEB4;}
#areanavegacion ul#navlist li a {
	color: #fff;
    font-weigh:bold;
	padding: 3px;
	}


/*cuando pasa el mouse sobre la opcion*/
#areanavegacion ul#navlist li a:hover {color: #fff;}
#areanavegacion ul#navlist li a:active {color: #2f6bf0;}
#areanavegacion ul#subnavlist { display: none; }
#areanavegacion ul#subnavlist li { float: none; }
#areanavegacion ul#subnavlist li a {padding: 0px; margin: 0px;}
#areanavegacion ul#navlist li:hover ul#subnavlist {
	display: block;
	position: absolute;
	font-size: 8pt;
	padding-top: 5px;
	}

#areanavegacion ul#navlist li:hover ul#subnavlist li a {
	display: block;
	width: 10em;
	border: none;
	padding: 0px;
	}
#areanavegacion ul#navlist li:hover ul#subnavlist li a:before { content: "  "; }

#areanavegacion .opcion1 { background:#030; width:12px; border:1px solid black;}
#areanavegacion .opcion2 { background:#060;}
#areanavegacion .opcion3 { background:#090;}
#areanavegacion .opcion4 { background:#0C0;}
#areanavegacion .opcion5 { background:#0F0;}
#areanavegacion .opcion6 { background:#0F0;}
#areanavegacion .opcion7 { background:#0F0;}
#areanavegacion .opcion8 { background:#0F0;}


/************************* ruta ***********************************/
#cesion .ruta {height: auto; width:1000px;}
#cesion .ruta .izquierda {width: 450px;}
#cesion .ruta .derecha {width: 450px;}



#cuerpo {background: #FFF; padding-top:10px; border-top:1px solid #FAAC58}
/************************* area de contenidos ***********************************/
.contenido {width:1000px;}
.contenido #izquierda {
	width:70px;
	background: #FFF;
	/*background: #EADCAE;*/
	}

.contenido #centro {
	width: 325px;
	background:#FFF;
	/* background:#F5EBE1;*/
	}
.contenido #derecha {
	width:200px;
	float: left;
	background: #FFF;
    /*background:#F5EBE1; */
        }


/******************** menÅ“ lateral *************************/

#izquierda #menulateral {display:table; margin-bottom:10px}
#izquierda #menulateral ul {
	font-family: verdana, arial, Helvetica, sans-serif;
	}
#izquierda #menulateral li { margin: 0 0 1px 0; }
#izquierda #menulateral a {
	padding: 5px 10px;
	width: 140px;
	color: #777;
	background: #ccc;
	}
#izquierda #menulateral a:hover {
	color: #777;
	background: #eee;
	text-decoration: none;
	}
#izquierda #menulateral ul ul li { margin: 0 0 1px 0; }
#izquierda #menulateral ul ul a {
	padding: 5px 5px 5px 30px;
	width: 125px;
	color: #777;
	background: #ddd;
	text-decoration: none;
	}
#izquierda #menulateral ul ul a:hover {
	color: #fff;
	background: #333;
	text-decoration: none;
	}


/******************** pie de pâ€¡gina *************************/
#footer {margin:0; height:auto; background:#1F2125; border-top:1px solid #ddd}
#footer img {margin:10px 0}
	
#footer .piedepag {width:1000px;}
#footer .piedepag .izquierda {width: 450px; padding: 10px 10px;}
	.piedepag .izquierda #navlist li {padding-right: 20px;}
	.piedepag .izquierda #navlist li a{ color:#fff}
#footer .piedepag .derecha {width: 450px; padding: 10px 10px;}
	.piedepag .derecha ul li {color:#fff; padding:6px 0}

/******************** publicaciâ€”n *************************/
#publicacion {background:#1F2125;}
#publicacion .derechos {display: none;}
#publicacion .derechos {width:1000px;}
#publicacion .derechos p {color:#1F2125; font-style:italic; text-align:center}


/* Agregado el 960 para la estructura */

body {
  min-width: 960px;
  /* background-color: #A3BF42 !important; color principal verde ucol */
  background-color: #68368B !important; /*color tremporal por el da de la mujer marzo*/
}


.clearfix,
.container_12,
.container_16 {
  zoom: 1;
}

/* Modificaciones de Usuario  CGTI */

body {
	margin: 0px; 
	font: 12px Arial, Helvetica, sans-serif;  
	color: #000;
}

#top {
    width: 984px;
	background: #fff;
} 

#top {
    background: #A3BF42 !important;
}

#menu {
	width: 1000px;
	margin: auto;
	/*margin-top: 15px;*/
}

#areanavegacion ul#navlist li a {
	margin: 0px 5px 0 6px
	color: #FFF;
	/*border: 0px;*/
	padding:3px 7px;
	font-weight: bold;
}


#areanavegacion ul#navlist li a:hover {
	text-decoration:none;
	color: #000;
    /*color:#D58236; */
}

#areanavegacion .opcion1 {}
#areanavegacion .opcion2 { }
#areanavegacion .opcion3 { }
#areanavegacion .opcion4 { }
#areanavegacion .opcion5 { }
#areanavegacion .opcion6 { }
#areanavegacion .opcion7 { }
#areanavegacion .opcion8 {}


#areanavegacion ul#subnavlist { display: none; }
#areanavegacion ul#subnavlist li { float: none; padding: 6px 2px 6px 5px; text-align: left;}
#areanavegacion ul#subnavlist li a {padding: 0px; margin: 0px;}
/*Subopciones*/
#areanavegacion ul#navlist li:hover ul#subnavlist {
  color:#000;
  display: block;
  background: #003300;
  /*background: rgba(132,130,5,0.4);*/
  position: absolute;
  font-size: 8pt;
  padding-top: 5px;
  text-align: left;
  border:px solid black;
  }



/* Modificados */

#footer .piedepag .derecha {width: 450px; padding: 10px 10px;}
	.piedepag .derecha ul li {color:#fff; padding:6px 0}

#publicacion {background:#fff}
#publicacion .derechos {width:1000px; height: 25px;}
#publicacion .derechos p {
	color: #999; 
	text-align: center; 
	font-style: normal; 
	font-size: 11px;
	margin-top: 10px; 
	margin-bottom: auto;
}


/* Ã²ltimas modificaciones agredado el izquierda y derecha, sin estilos para que no se vean */


#izquierda #menulateral a:hover {
  color: #eee;
  background: #3a3e40;
  text-decoration: none;
  }
#cesion {/*background-color:#F5E3D0;*/height:26px;margin-top:10px;}
#cesion .ruta {height: auto; width:960px;}
#cesion .ruta .izquierda {width: 450px; color: #777 }
#cesion .ruta .derecha {width: 450px; color:#777; text-align: right; margin-right: 20px; }


#izquierda, #derecha {
  /* display: none; */
  color: #777;
  background: #fff;
}

#centro {
  color: #000;
  margin-left: auto;
  margin-right: auto;
}

#centro ul{
  margin-left: 10px;
}

#centro h1,
#derecha h1,
#izquierda h1,
#centro h2,
#derecha h1,
#izquierda h1
{
  color: #555;
  margin-bottom: 10px;
}

#centro strong,
#derecha strong,
#izquierda strong{
  color: #555;
}

#centro p,
#derecha p,
#izquierda p{
  margin-bottom: 10px;
  line-height: 18px;
}

#derecha h1, #derecha h2{
  color: #555;
}

.contenido {width:1000px;}
.contenido #izquierda {
  width:70px;
  background: #FFF;
  /*background: #F5EBE1; */
  }

.contenido #centro {
  width: 725px; 
  margin-left: auto; 
  margin-right: auto;
  min-height: 500px !important;
  }


 
a {
    color: #2f6bf0;
    text-decoration: none;
}

.infotabla { background-color:#F5F5F5; border: 1px solid #ddd;}
.iregistro { background-color:#D54431;width:30px; height:30px;}
.ipregunta { background-color:#FFFF05;width:30px; height:30px;}
.contenido { min-height:500px!important; background-color:#FFF;}
/*.contenido { min-height:500px!important; background-color:#F5EBE1;}*/
.titulo {border-bottom: 4px solid #EAEAEA;}

.Tgaleria td img {border:1px solid black;}
.Tgaleria td img:hover {border:1px solid red;}
.Galeria  img  {border:1px solid black; margin:5px 5px;}
.Galeria h3 { border-bottom: 2px solid #EAEAEA; width:80%}
#Evento {margin:10px 10px; border:1px solid black; background-color:#eee; padding:10px 10px;}

/*estilo anterior*/

/* CSS Document */

#imagen{
	width:760px;
	float:left;
}
#sideini{
	width:187px;
	float:left;
	height:335px;
	background-image:url(http://www1.ucol.mx/educacioncontinua/2.0/img/menuini.jpg);
}
#menuini{
	padding-top:170px;
	line-height:20px;
	list-style:none;

}
#menuini ul{
	text-align:left;
}
#menuini li{
	text-align:left;
	list-style-position:outside;
}
#menuini li a{
	text-decoration:none;
	color:#888;
	font-weight:bolder;
	font-size:13px;
}
#menuini li a:hover{
	color:#003300;
}
#menuini2{
	background-image:url(img/barra.jpg);
	height:21px;
}
#sidebar{
		width:220px;
		float:left;
		line-height:30px;
}

.menS{
		margin-bottom:10px;
}


.datos td{
	height:25px;

}
.filaDos{
	background-color:#f2f2f2;
}
.nomcampo{
	text-align:left;
	padding-left:10px;
	padding-right:10px;
	height:30px;
}
.resultados{
	text-align:center;
	font-size:14px;
	font-style:italic;
}
.gde{
	font-size:14px;
	font-weight:bolder;
}
.oculto{
	display:none;
	background-color:#f2f2f2;
	padding:10px;
}
.ocultox{
	background-color:#f2f2f2;
	padding:10px;
}
.link{
	cursor:pointer;
	font-weight:bolder;

}
#bottom{
	width:100%;
	float:left;
	text-align:center;
	font-size:10px;
	color:#444;
}

.datos th{
	height:10px;
	border-top:1px solid #96B22E;
	border-bottom:1px solid #96B22E;
	padding-top:10px;
	font-size:13px;
}
.datos td{

	border-bottom:1px solid #f2f2f2;
	padding-left:2px;
	padding-top:10px;
}
.campo{
	width:80px;
	float:left;
	text-align:right;
	color:#333333;
	font-size:12px;
}
#uno {
	width:20%;
	float:left;
	height:340px;
	background-color:#fff;
	margin-left:10px;
}
#dos {
	width:43%;
	float:left;
        margin-left:10px;
	height:340px;
}
#tres {
	width:33%;
	float:left;
	height:340px;
	line-height:45px;
}
#textoini{
	text-align:left;
	font-size:13px;
	line-height:23px;
}
#eventos h1{ font-size:18px; text-align:left;}
#eventos h2{ font-size:15px; text-align:left;}
#eventos #categorias{ width:100%; border-bottom:1px solid #CCCCCC; padding-bottom:30px;}
#eventos #tipoeve{ border:1px solid #f2f2f2; width:100px; height:100px; float:left; margin-left:20px; padding:5px;}
#eventos #tipoevedos{ border:1px solid #f2f2f2; width:300px; min-height:250px; float:left; margin-left:40px;  margin-bottom:40px; padding:5px;}
#eventos img { margin-right:10px; }
#eventos #imgdepe { width:110px; float:left; border:0px solid #666666;}
#eventos #eventodetalles { width:260px; float:left; border:0px solid #666666;}
#eventos #eventodetalles2 { width:450px; float:right; border:0px solid #666666;}
#clear{ clear:both;}

/*----------------------------------------------------------------------------------------------------------------------------------------------MODIFICACIONES DIRECCION DE SISTEMAS-----------------------------------------------------------------------------*/
.encabezado .derecha{
	height: auto;
    margin-left: 850px;
    margin-top: 20px;
    position: absolute;
    width: 160px;
}

#areanavegacion ul#navlist li a {
    /*color: #999999;*/
     font-family: Bookman Old Style;
     font-size: 11pt;
     line-height:16px;
    color: #fff;
    /*color: #494949; */
    font-weight: lighter;
    /*font-style: italic; */
}
	.encabezado p{
		margin-top: 10px;
	}
	#cesion{
    height: 26px;
    width: 1000px;
    margin-top:-28px;

	}
	#cesion .ruta {
    margin-top: 35px;
    position: absolute;
    width: 1000px;
}
#cesion .ruta .izquierda{
		margin-left: 20px;}

.contenido #centro{
  /*width: 980px;*/
  height: auto;
  }
 /* 
  #centro .slider{
	width: 625px;
	float: left;
}
  */
  
  
  .contenido #centro h1,
  .contenido #centro .derecha h1 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 22pt;
  color: #336699;
  }
  .contenido #centro h2,
  .contenido #centro .derecha h2 {
  font-family: Arial, Helvetica, sans-serif;
font-size: 20pt;
color: #336699;
  }
  #areanavegacion ul#navlist, ul#navlist ul, ul#navlist li {
	margin-top: 2px !important;
	}
.contenido #centro .derecha h1{
  width: 325px;
  height: auto;
  }
#cuerpo,
#centro{
	padding-top: 20px;
	font-family: Arial, Helvetica, sans-serif;
    font-size: 12pt;
    line-height:16px;
    color: #494949;
    text-align: justify;
    line-height: 1.5em;
}

.contenido #centro .eventos{
  width: 625px;
  float: left;
  height: auto;
  }

#centro .derecha{
	float: right;
    width: 330px;
}

#centro .derecha .textoContainer,
#centro .derecha .recursos,
#centro .derecha .info,
#centro .derecha .vid{
	height: auto;
}
.recurso1{
	width: auto;
	padding: 10px 0px;
}
#centro .derecha .vid{
	margin: 0 auto;
	width: 241px;
}

#areanavegacion #navlist{
    list-style:none;
    margin:0;
    padding:0;
    text-align:center;
}
#areanavegacion #navlist li{
    display:block;
}
#areanavegacion #navlist a{
    display:inline-block;
}
#areanavegacion ul#navlist, ul#navlist ul, ul#navlist li {
    display: block;
    font-size: 13px;
    list-style: none outside none;
    text-align: center;
}

#areanavegacion ul#subnavlist {
    z-index: 1;
}






/* Galeras */
#slider {
	text-align: center;
	margin: 0 auto;
	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

#slider label, #slider a {
	color: #444444;
	cursor: pointer;
	text-decoration: none;
}
#slider label:hover, #slider a:hover {
	color: #000 !important;
}
#slider label, #slider #active, #slider img { -moz-user-select:none;-webkit-user-select:none; }

#slider input {
	display: none;
}

#slide1:checked ~ #slides .inner { margin-left:0; }
#slide2:checked ~ #slides .inner { margin-left:-100%; }
#slide3:checked ~ #slides .inner { margin-left:-200%; }
#slide4:checked ~ #slides .inner { margin-left:-300%; }
#slide5:checked ~ #slides .inner { margin-left:-400%; }


#overflow {
	width: 100%;
	overflow: hidden;
}

#slider article img {
	width: 100%;
	max-width:80% !important;
}

#slides .inner {
	width: 500%;
	line-height: 0;
}

#slides article {
	width: 20%;
	float: left;
}

/* Slider Styling */

/* Control Setup */

#controls {
	margin: -25% 0 0 0;
	width: 100%;
	height: 50px;
}

#controls label { 
	display: none;
	width: 50px;
	height: 50px;
	opacity: 0.3;
}

#active {
	margin: 23% 0 0;
	text-align: center;
}

#active label {
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	display: inline-block;
	width: 10px;
	height: 10px;
	background: #bbb;
}

#active label:hover {
	background: #ccc;
	border-color: #777 !important;
}

#controls label:hover {
	opacity: 0.8;
}

#slide1:checked ~ #controls label:nth-child(2), 
#slide2:checked ~ #controls label:nth-child(3), 
#slide3:checked ~ #controls label:nth-child(4), 
#slide4:checked ~ #controls label:nth-child(5), 
#slide5:checked ~ #controls label:nth-child(1) {
	background: url('http://img140.imageshack.us/img140/7481/nextfy.png') no-repeat;
	float: right;
	margin: 0 -140px 0 0;
	display: block;
}


#slide1:checked ~ #controls label:nth-child(5),
#slide2:checked ~ #controls label:nth-child(1),
#slide3:checked ~ #controls label:nth-child(2),
#slide4:checked ~ #controls label:nth-child(3),
#slide5:checked ~ #controls label:nth-child(4) {
	background: url('http://img7.imageshack.us/img7/152/prevrt.png') no-repeat;
	float: left;
	margin: 0 0 0 -140px;
	display: block;
}

#slide1:checked ~ #active label:nth-child(1),
#slide2:checked ~ #active label:nth-child(2),
#slide3:checked ~ #active label:nth-child(3),
#slide4:checked ~ #active label:nth-child(4),
#slide5:checked ~ #active label:nth-child(5) {
	background: #333;
	border-color: #333 !important;
}

/* Info Box */

#slider .info {
	line-height: 20px;
	margin: 0 0 -150%;
	position: absolute;
	font-style: italic;
	padding: 30px 30px;
	opacity: 0;
	color: #000;
	text-align: left;
}

#slider .info h3 {
	color: #333;
	margin: 0 0 5px;
	font-weight: normal;
	font-size: 22px;
	font-style: normal;
}

/* Slider Styling */

#slides {
	margin: 45px 0 0;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	box-shadow: 1px 1px 4px #666;
	padding: 1%;
	background: #fff;
	background: rgb(252,255,244); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(252,255,244,1) 0%, rgba(219,218,201,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(252,255,244,1)), color-stop(100%,rgba(219,218,201,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(252,255,244,1) 0%,rgba(219,218,201,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(252,255,244,1) 0%,rgba(219,218,201,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(252,255,244,1) 0%,rgba(219,218,201,1) 100%); /* IE10+ */
	background: linear-gradient(top,  rgba(252,255,244,1) 0%,rgba(219,218,201,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#dbdac9',GradientType=0 ); /* IE6-9 */
}


/* Animation */

#slides .inner {
	-webkit-transform: translateZ(0);
	-webkit-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000); 
	-moz-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000); 
    -ms-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000); 
     -o-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000); 
        transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000); /* easeInOutQuart */

	-webkit-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); 
	-moz-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); 
    -ms-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); 
     -o-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); 
        transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); /* easeInOutQuart */
}

#slider {
	-webkit-transform: translateZ(0);
	-webkit-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
}

#controls label{
	-webkit-transform: translateZ(0);
	-webkit-transition: opacity 0.2s ease-out;
	-moz-transition: opacity 0.2s ease-out;
	-o-transition: opacity 0.2s ease-out;
	transition: opacity 0.2s ease-out;
}
	#slider #controls {
		margin: -25% 0 0 15%;
		width: 70%;
		height: 50px;
	}

	#slider #controls label {
		-moz-transform: scale(0.8);
		-webkit-transform: scale(0.8);
		-o-transform: scale(0.8);
		-ms-transform: scale(0.8);
		transform: scale(0.8);
	}
#slide1:checked ~ #slides article:nth-child(1) .info,
#slide2:checked ~ #slides article:nth-child(2) .info,
#slide3:checked ~ #slides article:nth-child(3) .info,
#slide4:checked ~ #slides article:nth-child(4) .info,
#slide5:checked ~ #slides article:nth-child(5) .info {
	opacity: 1;
	-webkit-transition: all 1s ease-out 0.6s;
	-moz-transition: all 1s ease-out 0.6s;
	-o-transition: all 1s ease-out 0.6s;
	transition: all 1s ease-out 0.6s;
}

#slider .info, #controls, #slides, #active, #active label, .info h3, .desktop, .tablet, .mobile {
	-webkit-transform: translateZ(0);
	-webkit-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
}


/* Responsive Styling */



@media only screen and (max-width: 850px) and (min-width: 450px) {



	#slider #slides {
		padding: 1% 0;
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		border-radius: 0px;
	}

	#slider #active {
		margin: 22% 0 0;
	}

}



@media only screen and (max-width: 450px) {

	#slider #controls {
		margin: -28% 0 0 24%;
		width: 50%;
		height: 50px;
	}

	#slider #active {
		margin: 23% 0 0;
	}

	#slider #slides {
		padding: 1% 0;
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		border-radius: 0px;
	}

	#slider #slides .info {
		opacity: 0 !important;
	}

	#slider #controls label {
		-moz-transform: scale(0.6);
		-webkit-transform: scale(0.6);
		-o-transform: scale(0.6);
		-ms-transform: scale(0.6);
		transform: scale(0.6);
	}

}


/* CSS Document1 */

body {margin:0px; 
	color:#000;
	 /* background-color: #A3BF42 !important; color principal verde ucol */
  background-color: #68368B !important; /*color tremporal por el da de la mujer marzo
	background-color:#848205; */
	/* background-color:#DCCEB4; */
	}


/********************Globel work***********************************/
.titulo {display:none;}
*{margin:0px; padding:0px;}

body, ol, ul, p, hr {margin:0px; padding:0px;} 


h1, h2, h3, h4, h, h6{width:960px; margin:0 auto;}

/****************** area de encabezado **************/
/*#top {background:#A3BF42 !important;} */
 /* background-color: #A3BF42 !important; color principal verde ucol */
 #top {background-color: #68368B !important;} /*color tremporal por el da de la mujer marzo*/

.encabezado {width:984px;background: url(https://dl.dropboxusercontent.com/u/22055425/Sitio%20ACU/Pruebas/headerc.png); background-repeat:no-repeat; height:105px; background-position: 0px 15px;}
.encabezado_left { float: left; width: 515px;}
.encabezado_right { float: right; width: 450px;}
.encabezado .subtitulo {margin:0px; padding:0 0 0 110px; top:-45px; display: block; font-size:18px; color: #fff; font-weight: normal;}
.encabezado img{margin:0; padding:0}

/*************************area de menu superior***********************************/
#menu_superior{
   float:right;
  margin-top:27px;
}
#menu_superior li a:hover{
}
#menu_superior li a{
  color:#FFF;
}
#menu_superior li{
  padding:0px 11px;
  display:inline-block;
}

/*************************area de menu***********************************/

/*#menu {color:#000;width:1000px; height:71px;}
#areanavegacion {width:980px;} */
#areanavegacion ul#navlist {margin: 0 auto;}

#areanavegacion ul#navlist a {
	text-decoration: none;
	color: #FFF;
	}
#areanavegacion ul#navlist, ul#navlist ul, ul#navlist li {
	margin: 0px 0; 
      padding: 2px 2px; list-style: none; font-size: 13px; display: block; text-align: center;
	/*padding-top:25px;*/
	}
#areanavegacion ul#navlist li { border-right: 2px solid #DCCEB4;}
#areanavegacion ul#navlist li a {
	color: #fff;
    font-weigh:bold;
	padding: 3px;
	}


/*cuando pasa el mouse sobre la opcion*/
#areanavegacion ul#navlist li a:hover {color: #fff;}
#areanavegacion ul#navlist li a:active {color: #2f6bf0;}
#areanavegacion ul#subnavlist { display: none; }
#areanavegacion ul#subnavlist li { float: none; }
#areanavegacion ul#subnavlist li a {padding: 0px; margin: 0px;}
#areanavegacion ul#navlist li:hover ul#subnavlist {
	display: block;
	position: absolute;
	font-size: 8pt;
	padding-top: 5px;
	}

#areanavegacion ul#navlist li:hover ul#subnavlist li a {
	display: block;
	width: 10em;
	border: none;
	padding: 0px;
	color: #333;
	}
#areanavegacion ul#navlist li:hover ul#subnavlist li a:before { content: "  "; }

#areanavegacion .opcion1 { background:#030; width:12px; border:1px solid black;}
#areanavegacion .opcion2 { background:#060;}
#areanavegacion .opcion3 { background:#090;}
#areanavegacion .opcion4 { background:#0C0;}
#areanavegacion .opcion5 { background:#0F0;}
#areanavegacion .opcion6 { background:#0F0;}
#areanavegacion .opcion7 { background:#0F0;}
#areanavegacion .opcion8 { background:#0F0;}


/************************* ruta ***********************************/
#cesion .ruta {height: auto; width:1000px;}
#cesion .ruta .izquierda {width: 450px;}
#cesion .ruta .derecha {width: 450px;}



#cuerpo {background: #FFF; padding-top:10px; border-top:1px solid #FFFFFF}
/************************* area de contenidos ***********************************/
.contenido {width:1000px;}
.contenido #izquierda {
	width:70px;
	background: #FFF;
	/*background: #EADCAE;*/
	}

.contenido #centro {
	width: 325px;
	background:#FFF;
	/* background:#F5EBE1;*/
	}
.contenido #derecha {
	width:200px;
	float: left;
	background: #FFF;
    /*background:#F5EBE1; */
        }


/******************** menÅ“ lateral *************************/

#izquierda #menulateral {display:table; margin-bottom:10px}
#izquierda #menulateral ul {
	font-family: verdana, arial, Helvetica, sans-serif;
	}
#izquierda #menulateral li { margin: 0 0 1px 0; }
#izquierda #menulateral a {
	padding: 5px 10px;
	width: 140px;
	color: #777;
	background: #ccc;
	}
#izquierda #menulateral a:hover {
	color: #777;
	background: #eee;
	text-decoration: none;
	}
#izquierda #menulateral ul ul li { margin: 0 0 1px 0; }
#izquierda #menulateral ul ul a {
	padding: 5px 5px 5px 30px;
	width: 125px;
	color: #777;
	background: #ddd;
	text-decoration: none;
	}
#izquierda #menulateral ul ul a:hover {
	color: #fff;
	background: #333;
	text-decoration: none;
	}


/******************** pie de pâ€¡gina *************************/
#footer {margin:0;  background:#333333; border-top:1px solid #ddd}
#footer img {margin:10px 0}
	
#footer .piedepag {width:1000px;}
#footer .piedepag .izquierda {width: 450px; padding: 10px 10px;}
	.piedepag .izquierda #navlist li {padding-right: 20px;}
	.piedepag .izquierda #navlist li a{ color:#fff}
#footer .piedepag .derecha {width: 450px; padding: 10px 10px;}
	.piedepag .derecha ul li {color:#fff; padding:6px 0}

/******************** publicaciâ€”n *************************/
#publicacion {background:#1F2125;}
#publicacion .derechos {display: none;}
#publicacion .derechos {width:1000px;}
#publicacion .derechos p {color:#1F2125; font-style:italic; text-align:center}


/* Agregado el 960 para la estructura */

body {
  min-width: 960px;
}


.clearfix,
.container_12,
.container_16 {
  zoom: 1;
}

/* Modificaciones de Usuario  CGTI */

body {
	margin: 0px; 
	font: 12px Arial, Helvetica, sans-serif;  
	color: #000;
}

#top {
        width: 984px;
	background: #fff;
} 

#menu {
	width: 1000px;
	margin: auto;
	/*margin-top: 15px;*/
}

#areanavegacion ul#navlist li a {
	margin: 0px 5px 0 6px
	color: #FFF;
	/*border: 0px;*/
	padding:3px 7px;
	font-weight: bold;
}


#areanavegacion ul#navlist li a:hover {
	text-decoration:none;
	color: #525100;
    /*color:#D58236; */
}

#areanavegacion .opcion1 {}
#areanavegacion .opcion2 { }
#areanavegacion .opcion3 { }
#areanavegacion .opcion4 { }
#areanavegacion .opcion5 { }
#areanavegacion .opcion6 { }
#areanavegacion .opcion7 { }
#areanavegacion .opcion8 {}


#areanavegacion ul#subnavlist { display: none; }
#areanavegacion ul#subnavlist li { float: none; padding: 6px 2px 6px 5px; text-align: left;}
#areanavegacion ul#subnavlist li a {padding: 0px; margin: 0px;}
/*Subopciones*/
#areanavegacion ul#navlist li:hover ul#subnavlist {
    display: block;
    background: #ffffff;
    position: absolute;
    font-size: 8pt;
    padding-top: 8px;
    margin-top: 2px !important;
    text-align: left;
    border: 1px solid #f5f5f5;
    border-radius: 5px;
    box-shadow: 3px 3px 3px 0px #f5f5f5;
    color: #333333;
}



/* Modificados */

#footer .piedepag .derecha {width: 450px; padding: 10px 10px;}
	.piedepag .derecha ul li {color:#fff; padding:6px 0}

#publicacion {background:#fff}
#publicacion .derechos {width:1000px; height: 25px;}
#publicacion .derechos p {
	color: #999; 
	text-align: center; 
	font-style: normal; 
	font-size: 11px;
	margin-top: 10px; 
	margin-bottom: auto;
}


/* Ã²ltimas modificaciones agredado el izquierda y derecha, sin estilos para que no se vean */


#izquierda #menulateral a:hover {
  color: #eee;
  background: #3a3e40;
  text-decoration: none;
  }
#cesion {/*background-color:#F5E3D0;*/height:26px;margin-top:10px;}
#cesion .ruta {height: auto; width:960px;}
#cesion .ruta .izquierda {width: 450px; color: #777 }
#cesion .ruta .derecha {width: 450px; color:#777; text-align: right; margin-right: 20px; }


#izquierda, #derecha {
  /* display: none; */
  color: #777;
  background: #fff;
}

#centro {
  color: #000;
  margin-left: auto;
  margin-right: auto;
}

#centro ul{
  margin-left: 10px;
}

#centro h1,
#derecha h1,
#izquierda h1,
#centro h2,
#derecha h1,
#izquierda h1
{
  color: #555;
  margin-bottom: 10px;
}

#centro strong,
#derecha strong,
#izquierda strong{
  color: #555;
}

#centro p,
#derecha p,
#izquierda p{
  margin-bottom: 10px;
  line-height: 18px;
}

#derecha h1, #derecha h2{
  color: #555;
}

.contenido {width:1000px;}
.contenido #izquierda {
  width:70px;
  background: #FFF;
  /*background: #F5EBE1; */
  }

.contenido #centro {
  width: 725px; 
  margin-left: auto; 
  margin-right: auto;
  min-height: 500px !important;
  }


 
a {
    color: #2f6bf0;
    text-decoration: none;
}

.infotabla { background-color:#F5F5F5; border: 1px solid #ddd;}
.iregistro { background-color:#D54431;width:30px; height:30px;}
.ipregunta { background-color:#FFFF05;width:30px; height:30px;}
.contenido { min-height:500px!important; background-color:#FFF;}
/*.contenido { min-height:500px!important; background-color:#F5EBE1;}*/
.titulo {border-bottom: 4px solid #EAEAEA;}

.Tgaleria td img {border:1px solid black;}
.Tgaleria td img:hover {border:1px solid red;}
.Galeria  img  {border:1px solid black; margin:5px 5px;}
.Galeria h3 { border-bottom: 2px solid #EAEAEA; width:80%}
#Evento {margin:10px 10px; border:1px solid black; background-color:#eee; padding:10px 10px;}

/*estilo anterior*/

/* CSS Document */

#imagen{
	width:760px;
	float:left;
}
#sideini{
	width:187px;
	float:left;
	height:335px;
	background-image:url(http://www1.ucol.mx/educacioncontinua/2.0/img/menuini.jpg);
}
#menuini{
	padding-top:170px;
	line-height:20px;
	list-style:none;

}
#menuini ul{
	text-align:left;
}
#menuini li{
	text-align:left;
	list-style-position:outside;
}
#menuini li a{
	text-decoration:none;
	color:#888;
	font-weight:bolder;
	font-size:13px;
}
#menuini li a:hover{
	color:#003300;
}
#menuini2{
	background-image:url(img/barra.jpg);
	height:21px;
}
#sidebar{
		width:220px;
		float:left;
		line-height:30px;
}

.menS{
		margin-bottom:10px;
}


.datos td{
	height:25px;

}
.filaDos{
	background-color:#f2f2f2;
}
.nomcampo{
	text-align:left;
	padding-left:10px;
	padding-right:10px;
	height:30px;
}
.resultados{
	text-align:center;
	font-size:14px;
	font-style:italic;
}
.gde{
	font-size:14px;
	font-weight:bolder;
}
.oculto{
	display:none;
	background-color:#f2f2f2;
	padding:10px;
}
.ocultox{
	background-color:#f2f2f2;
	padding:10px;
}
.link{
	cursor:pointer;
	font-weight:bolder;

}
#bottom{
	width:100%;
	float:left;
	text-align:center;
	font-size:10px;
	color:#444;
}

.datos th{
	height:10px;
	border-top:1px solid #96B22E;
	border-bottom:1px solid #96B22E;
	padding-top:10px;
	font-size:13px;
}
.datos td{

	border-bottom:1px solid #f2f2f2;
	padding-left:2px;
	padding-top:10px;
}
.campo{
	width:80px;
	float:left;
	text-align:right;
	color:#333333;
	font-size:12px;
}
#uno {
	width:20%;
	float:left;
	height:340px;
	background-color:#fff;
	margin-left:10px;
}
#dos {
	width:43%;
	float:left;
        margin-left:10px;
	height:340px;
}
#tres {
	width:33%;
	float:left;
	height:340px;
	line-height:45px;
}
#textoini{
	text-align:left;
	font-size:13px;
	line-height:23px;
}
#eventos h1{ font-size:18px; text-align:left;}
#eventos h2{ font-size:15px; text-align:left;}
#eventos #categorias{ width:100%; border-bottom:1px solid #CCCCCC; padding-bottom:30px;}
#eventos #tipoeve{ border:1px solid #f2f2f2; width:100px; height:100px; float:left; margin-left:20px; padding:5px;}
#eventos #tipoevedos{ border:1px solid #f2f2f2; width:300px; min-height:250px; float:left; margin-left:40px;  margin-bottom:40px; padding:5px;}
#eventos img { margin-right:10px; }
#eventos #imgdepe { width:110px; float:left; border:0px solid #666666;}
#eventos #eventodetalles { width:260px; float:left; border:0px solid #666666;}
#eventos #eventodetalles2 { width:450px; float:right; border:0px solid #666666;}
#clear{ clear:both;}

/*----------------------------------------------------------------------------------------------------------------------------------------------MODIFICACIONES DIRECCION DE SISTEMAS-----------------------------------------------------------------------------*/
.encabezado .derecha{
	height: auto;
    margin-left: 850px;
    margin-top: 20px;
    position: absolute;
    width: 160px;
}

#areanavegacion ul#navlist li a {
    /*color: #999999;*/
     font-family: Bookman Old Style;
     font-size: 13pt;
     line-height:16px;
    color: #fff;
    /*color: #494949; */
    font-weight: lighter;
    /*font-style: italic; */
}
	.encabezado p{
		margin-top: 10px;
	}
	#cesion{
    height: 26px;
    width: 1000px;
    margin-top:-28px;

	}
	#cesion .ruta {
    margin-top: 35px;
    position: absolute;
    width: 1000px;
}
#cesion .ruta .izquierda{
		margin-left: 20px;}

.contenido #centro{
  /*width: 980px;*/
  height: auto;
  }
  
  /*
  #centro .slider{
	width: 625px;
	float: left;
}
  
  */
  
  .contenido #centro h1,
  .contenido #centro .derecha h1 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 22pt;
  color: #336699;
  }
  .contenido #centro h2,
  .contenido #centro .derecha h2 {
  font-family: Arial, Helvetica, sans-serif;
font-size: 20pt;
color: #336699;
  }
  #areanavegacion ul#navlist, ul#navlist ul, ul#navlist li {
	margin-top: 2px !important;
	}
.contenido #centro .derecha h1{
  width: 325px;
  height: auto;
  }
#cuerpo,
#centro{
	padding-top: 20px;
	font-family: Arial, Helvetica, sans-serif;
    font-size: 12pt;
    line-height:16px;
    color: #494949;
    text-align: justify;
    line-height: 1.5em;
}

.contenido #centro .eventos{
  width: 625px;
  float: left;
  height: auto;
  }

#centro .derecha{
	float: right;
    width: 330px;
}

#centro .derecha .textoContainer,
#centro .derecha .recursos,
#centro .derecha .info,
#centro .derecha .vid{
	height: auto;
}
.recurso1{
	width: auto;
	padding: 10px 0px;
}
#centro .derecha .vid{
	margin: 0 auto;
	width: 241px;
}

#areanavegacion #navlist{
    list-style:none;
    margin:0;
    padding:0;
    text-align:center;
}
#areanavegacion #navlist li{
    display:block;
}
#areanavegacion #navlist a{
    display:inline-block;
}
#areanavegacion ul#navlist, ul#navlist ul, ul#navlist li {
    display: block;
    font-size: 13px;
    list-style: none outside none;
    text-align: center;
}

#areanavegacion ul#subnavlist {
    z-index: 1;
}






/* Galeras */
#slider {
	text-align: center;
	margin: 0 auto;
	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

#slider label, #slider a {
	color: #444444;
	cursor: pointer;
	text-decoration: none;
}
#slider label:hover, #slider a:hover {
	color: #000 !important;
}
#slider label, #slider #active, #slider img { -moz-user-select:none;-webkit-user-select:none; }

#slider input {
	display: none;
}

#slide1:checked ~ #slides .inner { margin-left:0; }
#slide2:checked ~ #slides .inner { margin-left:-100%; }
#slide3:checked ~ #slides .inner { margin-left:-200%; }
#slide4:checked ~ #slides .inner { margin-left:-300%; }
#slide5:checked ~ #slides .inner { margin-left:-400%; }


#overflow {
	width: 100%;
	overflow: hidden;
}

#slider article img {
	width: 100%;
	max-width:80% !important;
}

#slides .inner {
	width: 500%;
	line-height: 0;
}

#slides article {
	width: 20%;
	float: left;
}

/* Slider Styling */

/* Control Setup */

#controls {
	margin: -25% 0 0 0;
	width: 100%;
	height: 50px;
}

#controls label { 
	display: none;
	width: 50px;
	height: 50px;
	opacity: 0.3;
}

#active {
	margin: 23% 0 0;
	text-align: center;
}

#active label {
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	display: inline-block;
	width: 10px;
	height: 10px;
	background: #bbb;
}

#active label:hover {
	background: #ccc;
	border-color: #777 !important;
}

#controls label:hover {
	opacity: 0.8;
}

#slide1:checked ~ #controls label:nth-child(2), 
#slide2:checked ~ #controls label:nth-child(3), 
#slide3:checked ~ #controls label:nth-child(4), 
#slide4:checked ~ #controls label:nth-child(5), 
#slide5:checked ~ #controls label:nth-child(1) {
	background: url('http://img140.imageshack.us/img140/7481/nextfy.png') no-repeat;
	float: right;
	margin: 0 -140px 0 0;
	display: block;
}


#slide1:checked ~ #controls label:nth-child(5),
#slide2:checked ~ #controls label:nth-child(1),
#slide3:checked ~ #controls label:nth-child(2),
#slide4:checked ~ #controls label:nth-child(3),
#slide5:checked ~ #controls label:nth-child(4) {
	background: url('http://img7.imageshack.us/img7/152/prevrt.png') no-repeat;
	float: left;
	margin: 0 0 0 -140px;
	display: block;
}

#slide1:checked ~ #active label:nth-child(1),
#slide2:checked ~ #active label:nth-child(2),
#slide3:checked ~ #active label:nth-child(3),
#slide4:checked ~ #active label:nth-child(4),
#slide5:checked ~ #active label:nth-child(5) {
	background: #333;
	border-color: #333 !important;
}

/* Info Box */

#slider .info {
	line-height: 20px;
	margin: 0 0 -150%;
	position: absolute;
	font-style: italic;
	padding: 30px 30px;
	opacity: 0;
	color: #000;
	text-align: left;
}

#slider .info h3 {
	color: #333;
	margin: 0 0 5px;
	font-weight: normal;
	font-size: 22px;
	font-style: normal;
}

/* Slider Styling */

#slides {
	margin: 45px 0 0;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	box-shadow: 1px 1px 4px #666;
	padding: 1%;
	background: #fff;
	background: rgb(252,255,244); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(252,255,244,1) 0%, rgba(219,218,201,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(252,255,244,1)), color-stop(100%,rgba(219,218,201,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(252,255,244,1) 0%,rgba(219,218,201,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(252,255,244,1) 0%,rgba(219,218,201,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(252,255,244,1) 0%,rgba(219,218,201,1) 100%); /* IE10+ */
	background: linear-gradient(top,  rgba(252,255,244,1) 0%,rgba(219,218,201,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#dbdac9',GradientType=0 ); /* IE6-9 */
}


/* Animation */

#slides .inner {
	-webkit-transform: translateZ(0);
	-webkit-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000); 
	-moz-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000); 
    -ms-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000); 
     -o-transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000); 
        transition: all 800ms cubic-bezier(0.770, 0.000, 0.175, 1.000); /* easeInOutQuart */

	-webkit-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); 
	-moz-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); 
    -ms-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); 
     -o-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); 
        transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000); /* easeInOutQuart */
}

#slider {
	-webkit-transform: translateZ(0);
	-webkit-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
}

#controls label{
	-webkit-transform: translateZ(0);
	-webkit-transition: opacity 0.2s ease-out;
	-moz-transition: opacity 0.2s ease-out;
	-o-transition: opacity 0.2s ease-out;
	transition: opacity 0.2s ease-out;
}
	#slider #controls {
		margin: -25% 0 0 15%;
		width: 70%;
		height: 50px;
	}

	#slider #controls label {
		-moz-transform: scale(0.8);
		-webkit-transform: scale(0.8);
		-o-transform: scale(0.8);
		-ms-transform: scale(0.8);
		transform: scale(0.8);
	}
#slide1:checked ~ #slides article:nth-child(1) .info,
#slide2:checked ~ #slides article:nth-child(2) .info,
#slide3:checked ~ #slides article:nth-child(3) .info,
#slide4:checked ~ #slides article:nth-child(4) .info,
#slide5:checked ~ #slides article:nth-child(5) .info {
	opacity: 1;
	-webkit-transition: all 1s ease-out 0.6s;
	-moz-transition: all 1s ease-out 0.6s;
	-o-transition: all 1s ease-out 0.6s;
	transition: all 1s ease-out 0.6s;
}

#slider .info, #controls, #slides, #active, #active label, .info h3, .desktop, .tablet, .mobile {
	-webkit-transform: translateZ(0);
	-webkit-transition: all 0.5s ease-out;
	-moz-transition: all 0.5s ease-out;
	-o-transition: all 0.5s ease-out;
	transition: all 0.5s ease-out;
}


/* Responsive Styling */



@media only screen and (max-width: 850px) and (min-width: 450px) {



	#slider #slides {
		padding: 1% 0;
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		border-radius: 0px;
	}

	#slider #active {
		margin: 22% 0 0;
	}

}



@media only screen and (max-width: 450px) {

	#slider #controls {
		margin: -28% 0 0 24%;
		width: 50%;
		height: 50px;
	}

	#slider #active {
		margin: 23% 0 0;
	}

	#slider #slides {
		padding: 1% 0;
		-webkit-border-radius: 0px;
		-moz-border-radius: 0px;
		border-radius: 0px;
	}

	#slider #slides .info {
		opacity: 0 !important;
	}

	#slider #controls label {
		-moz-transform: scale(0.6);
		-webkit-transform: scale(0.6);
		-o-transform: scale(0.6);
		-ms-transform: scale(0.6);
		transform: scale(0.6);
	}

}

