@charset "utf-8";
/* CSS Document */
#page{ width:1200px; height:500px; margin:10px auto; padding:0 0 60px 0; display:table;}

/*/////////////////////////////////SIDE IZQ/////////////////////////////////*/
#side-izq{width:100px; height:900px; float:left;}
#menu-izq{  }
	#boletin-tools{ margin:0 auto; display:table;background:#333333; border-radius:8px; width:70px;
	padding:8px 0 8px 0;}
	#boletin-tools, #boletin-tools li{ list-style:none;}
	#boletin-tools li a, #boletin-tools li a:link, #boletin-tools li a:visited{
		text-decoration:none; color:#FFF; display:block; width:70px; height:65px; padding:5px 0 0 0;
		text-align:center; border-bottom:1px solid #555; font-family:Arial, Helvetica, sans-serif;
		font-size:12px; cursor:pointer;}
	#boletin-tools li a:hover, #boletin-tools li a:focus,#boletin-tools li a:active{ background:#222;}
	#boletin-tools li a div{ margin:5px 0 0 0;}
	#boletin-tools li:last-child{ display:none; float:left; color:#FFF; font-size:24px; padding:20px 26px 0 10px; 
	/*background:url(../images/icon-arrow-down-w.png) no-repeat right 24px;*/}
	/*menu que aparece al presionar el titulo cuando la pantalla es inferior a 900px*/
	#boletin-tools li .tipMenuBoletin{ padding:2px 0 0 5px; cursor:pointer;}
	#boletin-title-menu{ font-size:18px; height:300px; margin:10px 0 10px 0; padding:0 5px 0 15px; overflow:hidden; overflow-y:scroll;}
	#boletin-title-menu div{ line-height:30px; display:table; width:140px; text-align:center; border:1px solid #444; text-shadow:1px 1px 1px #000000;
							 margin:2px; float:left; cursor:pointer;}
	#boletin-title-menu div:hover{ background:#000;}
	#boletin-tools li:last-child input{ font-size:24px; width:60px; text-align:center; background:#333; color:#fff;}
.menu-izq-fijo{position: fixed; top: 52px; margin-left:15px; z-index:800;}
#menu-izq.fixed{position: fixed; top: 52px; margin-left:15px; z-index:800;}

/*/////////////////////////////////CONTENIDO/////////////////////////////////*/
#contenido{width:800px; float:left;}
#articulo{ margin:0 auto; display:table; background:#FFF; padding:0 10px 0 10px; border-radius:5px; font-family:"Times New Roman", Times, serif;
box-shadow:0px 0px 10px #777; font-size:1.2em}

/*/////////////////////////////////SIDE DER/////////////////////////////////*/
#side-der{width:300px; height:900px; float:left;}
#menu-der{ }
#ropa-menu{margin:0 auto; width:214px; display:table; border-radius:5px; box-shadow:0px 0px 8px #777;
	background:#F7F7F7;}
/*side der menu label*/
#ropa-menu-label{background:url(../images/bg-label-02.png); border-radius:5px 5px 0 0;}
#ropa-menu-label a,#ropa-menu-label a:link,#ropa-menu-label a:visited{  border-radius:5px;	display:block;
	width:100%; color:#FFF; font-size:22px; line-height:50px; text-decoration:none; 
	text-shadow:1px 1px 1px #333; text-align:center; cursor:default;}
	
	#ropa-menu-label a img{ margin:0 10px 0 -20px;}
#ropa-menu-label a:hover,#ropa-menu-label a:active{background:#C00;}
/*side der menu*/
#ropa-menu ul{ height:500px; overflow:hidden}
#ropa-menu ul,#ropa-menu ul li{ list-style:none}
#ropa-menu ul li a,#ropa-menu ul li a:link,#ropa-menu ul li a:visited{ width:100%; height:40px;
	padding:9px 0 0 0; color:#333; text-decoration:none; border-bottom:1px solid #C5BFB6; display:block; 
	background:#F7F7F7; cursor:pointer}
#ropa-menu ul li a:hover,#ropa-menu ul li a:active{ background:#EFEFEF;}
	#ropa-menu ul li a div{font-family:"Times New Roman", Times, serif; 
	 display:table; border-bottom:1px solid #333; font-size:18px; margin:0px 0 0 35px;}
	#ropa-menu ul li a div:last-child{ font-family:"Century Gothic", Arial; font-size:10px; margin:0;
	border:none; text-decoration:none;display:block; text-align:right; padding:0 5px 0 0; visibility:hidden}
/*menu der bottom*/
#ropa-menu-bottom a,#ropa-menu-bottom a:link,#ropa-menu-bottom a:visited{
	background:url(../images/bg-label-02.png);border-radius:0 0 5px 5px; display:block; width:100%; 
	color:#FFF; font-size:14px; line-height:26px; text-decoration:none; text-shadow:1px 1px 1px #333; 
	text-align:center; cursor:pointer}
#ropa-menu-bottom a:hover,#ropa-menu-bottom a:focus,#ropa-menu-bottom a:active{
	background-image:none; background:#C00}
/*fixed*/
#menu-der.fixed{position:fixed; top:52px; margin-left:43px; z-index:700;}






/* Por debajo de 1200px */
@media screen and (max-width: 1200px){


}

/* Por debajo de 900px */
@media screen and (max-width: 1025px){
#page{ width:100%;}
#side-izq{ width:100%; height:90px; float:none; clear:both;}

#boletin-tools{ width:98%}
#boletin-tools li,#boletin-tools li a, #boletin-tools li a:link, #boletin-tools li a:active{ float:right;}
#boletin-tools li:last-child{ display:table; }
#menu-izq.fixed{ display:none}/*quita efecto pegado cuando pantalla pequeña*/

#contenido{ float:none; margin:0 auto;}

#side-der{width:100%; float:none; clear:both;}
#ropa-menu{ width:98%;}
#ropa-menu ul li a div{ margin:0 auto;}

#menu-der.fixed{ position:static; margin:0;}/*quita efecto pegado cuando pantalla pequeña*/
}
