/******************************************************************
 ******************************************************************
 **                                                              **
 **                                                              **
 **                                                              **
 ******************************************************************
 *****************************************************************/
 
 /************ RESET ******************/
 html, body{margin:0; padding:0; font-size: 0px; width: 100%}
 body{overflow-x: hidden}
 p, h1, h2, h3, h4, h5{padding: 0; margin: 0; font-family: 'Alegreya Sans', sans-serif}
 a{color: inherit; text-decoration: none}
 ul{padding: 0}
 /*************************************/
 
 /******* ---- GENERALES ---- ********/
 /************ HEADER ****************/
 #global_header{max-width: 1920px; height: 103px}
 #global_header #border_top{width: 2230px; height: 11px; background: URL('imagenes/border.jpg'); position: absolute; left: 50%; margin-left: -1265px}
 #global_header #header_content{width: 1024px; margin: 0 auto; height: 92px; padding-top: 11px}
 #global_header #header_content #header_logo{width:311px; height: 92px; display: inline-block}
 #global_header #header_content #resp_menu-button{display: none;}
 #global_header #header_content #header_menu{display: inline-block; vertical-align: bottom; width: 710px}
 #global_header #header_content #header_menu ul{-webkit-margin-before: 0; -webkit-margin-after: 0; padding-left: 0; width: 880px}
 #global_header #header_content #header_menu .menu_item{width: 168px; display: inline-block; border-bottom: 4px solid; margin-left: 10px; margin-bottom: 8px}
 #global_header #header_content #header_menu .menu_item#menu_item-institucional{border-color: RGB(255, 102, 0);}
 #global_header #header_content #header_menu .menu_item#menu_item-prestaciones{border-color: #1097C1}
 #global_header #header_content #header_menu .menu_item#menu_item-sindical{border-color: #1CD3A2}
 #global_header #header_content #header_menu .menu_item#menu_item-contacto{border-color: #f7f200}
 #global_header #header_content #header_menu .menu_item p{font-family: 'Alegreya Sans SC', sans-serif; color: #2D2929; font-size:19px; font-weight: 500; line-height: 19px; letter-spacing: 1px}
 #global_header #header_content #header_menu .menu_item > p{cursor: default}
 #global_header #header_content #header_menu .menu_item#menu_item-institucional .sub_menu{width:169px}
 #global_header #header_content #header_menu .menu_item .sub_menu{padding-top: 5px; display: none; position: absolute; width: 194px; height: 58px; background-color: RGBA(233,221,201,.8); margin-top: 12px; z-index: 20}
 #global_header #header_content #header_menu #menu_item-prestaciones #menu-prestaciones{height:185px}
 #global_header #header_content #header_menu .menu_item .sub_menu .sub_menu_item{padding-left: 5px; border-bottom: 1px solid #686766}
 #global_header #header_content #header_menu .menu_item .sub_menu .sub_menu_item p{font-family: 'Alegreya Sans SC', sans-serif; color: #2D2929; font-size: 13px; line-height: 24px; font-weight: 400; letter-spacing: 0}
 #global_header #header_content #header_menu .menu_item .sub_menu .sub_menu_item:hover{background-color: RGBA(255,255,255,.8);}
 #global_header #header_content #header_menu .menu_item .sub_menu .sub_menu_item:hover p{font-weight: 500}

 #global_header #header_content #header_menu #menu-colors{width: 157px; display: inline-block; height: 4px; vertical-align: bottom; margin-left: 4px; background: URL('imagenes/colors.jpg'); margin-bottom: 8px}
 /*************************************/
 
 
 /************ PRINCIPAL *************/
 .first-letter{font-size:15px;}
 .main{height: 583px}
 .main .main-content{width: 1024px; position: absolute; left: 50%; margin-left: -511px; position: absolute; z-index: 10} 
 .main .fondo-especifico{width: 2491px; height: 583px; position:absolute; left: 50%; margin-left: -1263px; z-index: 0}
 .main .izquierda{width: 311px; height: 583px; display: inline-block; vertical-align: top}
 .main .derecha{width: 712px; height: 583px; display: inline-block; vertical-align: top}
 
  
  #bloques-institucional .bloque-info{display: inline-block; vertical-align: top; height: 85px}
  #emergencias, #superintendencia {border-right: 1px solid #48C2C5; cursor: pointer}
  #emergencias .imagen, #superintendencia .imagen{margin-top: 17px}
  #emergencias .imagen {background-image: URL("imagenes/telefonos-utiles.jpg"); width: 195px; height: 65px; background-position: -8px 0px}
  #superintendencia .imagen {background-image: URL("imagenes/superintendencia.jpg"); width: 210px; height: 60px; background-position: -8px 0px}
  #atencion .imagen {background-image: URL("imagenes/atencion.jpg"); width: 304px; height: 81px; background-repeat: no-repeat; background-position: 0px 20px;}
 /************************************/
 
 /************ SLIDER ****************/
 .slider .slide img{width: 100%}
 .slider .controls{ position: absolute; width: inherit; height: inherit}
 .slider .controls > div, .slider .controls li{cursor: pointer}
 .slider .controls .left-arrow{width: 19px; height: 46px; background-image: URL("imagenes/left-arrow.jpg"); position: absolute; left: 0; top: 50%; margin-top: -23px;}
 .slider .controls .right-arrow{width: 19px; height: 46px; background-image: URL("imagenes/right-arrow.jpg"); position: absolute; right: 0; top: 50%; margin-top: -23px;}
 .slider .controls .bullets{position: absolute; left: 24px; bottom: 10px}
 .slider .controls .bullets .bullet{display: inline-block; width: 10px; height: 10px; background-image: URL("imagenes/bullet-off.png"); margin-left: 5px}
 .slider .controls .bullets .bullet.on, .slider .controls .bullets .bullet:hover{display: inline-block; width: 10px; height: 10px; background-image: URL("imagenes/bullet-on.png")}
 .slider .controls .view-more{width: 98px; height: 22px; background-image: URL("imagenes/view-more.jpg"); position: absolute; right: 22px; bottom: 14px; background-position: 0px -1px }
 /************************************/
 
 /************* TELEFONOS ***********/
 #emergenciasTelefonosWrapper{
	position: absolute;
	z-index: 9999;
	margin-top: 0px;
	height: 0px;
	overflow: hidden;
	padding-top: 10px;
    padding-left: 10px;
    padding-right: 10px;
    margin-left: -10px;
	transition: margin 1s ease-in, height 1s ease-in, opacity 0.4s linear;
	opacity: 0;
 }
 #emergenciasTelefonosWrapper.shown{
	 opacity: 1;
	 margin-top: -470px;
	 height: 480px;
	transition: margin 0.7s ease-in, height 0.7s ease-in, opacity 0.6s linear;
 }
 #emergenciasTelefonos{
    width: 250px;
    background-color: rgb(226, 226, 226);
    height: 470px;
    border-radius: 15px 15px 0px 0px;
    padding-top: 10px;
    padding-left: 15px;
    padding-right: 15px;
    box-shadow: 0px -3px 4px 1px rgba(0,0,0,.4);
	cursor: default;
 }
 #emergenciasTelefonos h2{font-size: 19px; color: #fd3a00}
 #emergenciasTelefonosWrapper #emergenciasTelefonos > h3{font-size: 14px;
    text-align: left;
    color: black;
    font-weight: 400;
    background-color: #ff7812;
    line-height: 20px;
    padding: 0;
    margin-bottom: 5px;
    margin-top: 5px;
    padding-left: 5px;
    padding-right: 5px;}
 #emergenciasTelefonos p{font-size: 13px}
 /***********************************/
 
 /************* FOOTER **************/
 #global_footer{max-width: 1920px; height: 35px; padding-top: 5px;}
 #global_footer #footer_content{width: 1024px; margin: 0 auto}
 #global_footer #footer_content p{font-family: Arial; font-size: 9px; line-height: 11px; width: 711px; float: right}
 
 /***********************************/
 
 /************************************************************************************************************
  ************************************************************************************************************
  *********                                                                                          *********
  *********                                   ESPECÍFICOS                                            *********
  *********                                                                                          *********
  ************************************************************************************************************
  ***********************************************************************************************************/
  
  /***************** HOME *****************/
  .main#home .fondo-especifico{background-image: URL("imagenes/fondo-home.jpg")}
  #home .izquierda #introduccion{padding-top: 40px; padding-left: 30px; padding-bottom: 10px}
  #home .izquierda #introduccion h3{font-family: "Alegreya Sans", sans-serif; font-weight: 500; font-size: 23px; line-height: 20px; color: #1C2A24; width: 152px; padding-bottom: 23px}
  #home .izquierda #introduccion p{font-family: "Alegreya Sans SC", sans; font-weight: 400; font-size: 14px; line-height: 18px; color: #1C2A24; width: 250px}
  #home .izquierda img{width: 100%}
  #home #home-slider .controls{width: 712px; height: 368px}
  #home #bloques-institucional{margin-top: 75px}
  #home .derecha #home-slider{width: 712px; height: 368px; overflow: hidden}
  #home .derecha #home-slider .wrapper{min-width:712px; height: 368px; overflow: visible}
  #home .derecha #home-slider .wrapper > div.slide{display: inline-block; width: 712px; height: 368px; vertical-align: top}
  /***************************************/
  
  /***************** QUE ES APS *****************/
  .main#que-es-aps .fondo-especifico{background-image: URL("imagenes/fondo-QueEsAps.jpg")}
  #que-es-aps .izquierda{background-image: URL("imagenes/QueEsAps-cuadro.jpg"); background-position: -1px 0px; margin-left: -1px}
  #que-es-aps .izquierda h2{font-size: 23px; line-height: 30px; color: #253B93; font-weight: 500; text-align: center; padding-top: 30px;}
  #que-es-aps .izquierda h3{font-size: 15px; line-height: 19px; color: #F7F3E3; letter-spacing: 1px; font-weight: 600; text-align: center; padding-top: 5px; padding-right: 10px}
  #que-es-aps .izquierda p{font-size: 14px; line-height: 18px; color: #293844; width: 239px; padding-left: 32px; padding-top: 35px}
  #que-es-aps .derecha #slider-container{background-image: URL("imagenes/QueEsAps-slider-fondo.jpg"); padding: 25px}
  #que-es-aps .derecha #que-es-aps-slider{width: 668px; height: 452px}
  #que-es-aps .derecha #que-es-aps-slider .controls .bullets{position: absolute; left: 0; bottom: 10px; width: 100%; text-align: center}
  #que-es-aps .derecha #que-es-aps-slider{width: 668px; height: 452px; overflow: hidden}
  #que-es-aps .derecha #que-es-aps-slider .wrapper{min-width: 668px; height: 452px; overflow: visible}
  #que-es-aps .derecha #que-es-aps-slider .wrapper > div.slide{display: inline-block; width: 668px; height: 452px; vertical-align: top}
  /**********************************************/
  
  /********** QUIERE SER BENEFICIARIO **********/
  .main#quiere-ser-beneficiario .fondo-especifico{background-image: URL("imagenes/fondo-QuiereSerBeneficiario.jpg")} 
  #quiere-ser-beneficiario .main-content{margin-left: -513px}
  #quiere-ser-beneficiario .izquierda{background-image: URL("imagenes/QuiereSerBeneficiario-degrade-top.png"); background-repeat: no-repeat}
  #quiere-ser-beneficiario .izquierda #beneficiario-bloques-container {background-image: URL("imagenes/QuiereSerBeneficiario-main-fondo.png"); background-size: 1024px 378px; padding-top: 7px}
  #quiere-ser-beneficiario .izquierda h2{font-size: 23px; line-height: 30px; color: #1C2A24; font-weight: 500; padding-top: 30px; padding-left: 22px}
  #quiere-ser-beneficiario .izquierda h3{font-size: 17px; line-height: 20px; color: #29869B; font-weight: 500; padding-top: 5px; padding-left: 22px; padding-bottom: 10px}
  #quiere-ser-beneficiario .izquierda .beneficiario-bloques{width: 298px; height: 117px}
  #quiere-ser-beneficiario .izquierda .beneficiario-bloques p{font-size: 15px; color: #124551; line-height: 18px}
  #quiere-ser-beneficiario .izquierda #beneficiario-bloque-1{background-image: URL('imagenes/beneficiario-cuadro-1.png')}
  #quiere-ser-beneficiario .izquierda #beneficiario-bloque-1 p{padding-top: 30px; padding-left: 75px}
  #quiere-ser-beneficiario .izquierda #beneficiario-bloque-2{background-image: URL('imagenes/beneficiario-cuadro-2.png')}
  #quiere-ser-beneficiario .izquierda #beneficiario-bloque-2 p{padding-top: 40px; padding-left: 75px}
  #quiere-ser-beneficiario .izquierda #beneficiario-bloque-3{background-image: URL('imagenes/beneficiario-cuadro-3.png')}
  #quiere-ser-beneficiario .izquierda #beneficiario-bloque-3 p{padding-top: 20px; padding-left: 75px}
  #quiere-ser-beneficiario #brothers-img{background-image:URL("imagenes/brothers.jpg"); width: 311px; height: 130px; background-size: 100%; background-position: 0px -20px}
  #quiere-ser-beneficiario .derecha{background-image: URL("imagenes/QuiereSerBeneficiario-degrade-top.png"); background-repeat: no-repeat}
  #quiere-ser-beneficiario .derecha h3{font-size: 19px; line-height: 22px; font-weight: 300; text-align: center; color: #58595B; padding-top: 25px; padding-bottom: 26px}
  #quiere-ser-beneficiario .derecha #bloque-principal{background-image: URL("imagenes/QuiereSerBeneficiario-main-fondo.png"); background-size: 1024px 378px; padding-top: 13px; height: 345px}
  #quiere-ser-beneficiario .derecha #bloque-principal #beneficiario-requisitos{background-image: URL('imagenes/QuiereSerBeneficiario-bloque-principal.png'); width: 548px; overflow-y: scroll; height: 325px; overflow-x: hidden; padding-left: 150px; padding-top: 8px}
  #quiere-ser-beneficiario .derecha #bloque-principal #beneficiario-requisitos h2{background-image: URL('imagenes/QuiereSerBeneficiario-requisito-titulo.jpg'); width: 130px; height: 34px; font-size: 14px; font-weight: 600; line-height: 17px; color: #4C433A; padding-left: 20px; padding-top: 9px; background-repeat: no-repeat; background-size: 150px 35px}
  #quiere-ser-beneficiario .derecha #bloque-principal #beneficiario-requisitos p{font-size: 13px; line-height: 16px; color: #404041; padding-bottom: 5px; padding-left: 5px}
  #quiere-ser-beneficiario #bloques-institucional{margin-top: 25px}
  /*******************************************/
  
  /********** CENTRO RECREATIVO **********/
  .main#centro-recreativo .fondo-especifico{background-image: URL("imagenes/fondo-CentroRecreativo.jpg")}
  #centro-recreativo .main-content{margin-left: -513px}
  #centro-recreativo .contenedor-azul{width: 100%; height: 375px; background: URL("imagenes/CentroRecreativo-principal.jpg"); margin-top: 25px; margin-left: 1px}
  #centro-recreativo .izquierda{background-image: URL("imagenes/QuiereSerBeneficiario-degrade-top.png"); background-repeat: no-repeat}
  #centro-recreativo .izquierda h2{font-size: 23px; line-height: 30px; font-weight: 500; color: #081E49; text-align: center; padding-top: 15px;}
  #centro-recreativo .izquierda h3{font-size: 18px; line-height: 30px; font-weight: 600; color: #FFF; text-align: center; padding-top: 12px; background-image: URL("imagenes/CentroRecreativo-titulo-izq.png"); width: 225px; height: 40px; background-repeat: no-repeat; position: absolute; margin-left: 45px}
  #centro-recreativo .izquierda p{font-size: 15px; line-height: 18px; color: #081e49; padding-top: 32px; padding-left: 10px; padding-bottom: 5px}
  #centro-recreativo .izquierda #linea-punteada{width: 311px; height: 4px; background-image:URL("imagenes/CentroRecreativo-punteada.png"); background-repeat: no-repeat; background-position: -4px 0px}
  #centro-recreativo .izquierda p.lista{text-align: center; font-family: "Alegreya Sans SC", sans-serif; font-weight: 500; font-size: 15px; color: #1097C1; padding-top: 5px; padding-bottom: 5px}
  #centro-recreativo .izquierda .contenedor-azul #recuadro-horario{background-color:#BBE6FB; width: 290px; height: 216px; padding-right: 20px}
  #centro-recreativo .izquierda .contenedor-azul #recuadro-horario p{font-size: 14px; line-height: 17px; color: #081E49; padding-top: 5px}
  #centro-recreativo .izquierda .contenedor-azul #recuadro-horario span.titulo{font-weight: 600; color: #EB008B}
  #centro-recreativo .izquierda #ubicacion {padding-left: 1px}
  #centro-recreativo .izquierda #ubicacion #mapa{background-image:URL("imagenes/CentroRecreativo-mapa.jpg"); width: 138px; height: 138px; display: inline-block}
  #centro-recreativo .izquierda #ubicacion #direccion{padding-left: 5px; padding-top: 5px; display: inline-block; vertical-align: top}
  #centro-recreativo .izquierda #ubicacion #direccion p{font-family: "Alegreya Sans SC", sans-serif; font-size: 15px; font-weight: 500; line-height: 18px}
  
  #centro-recreativo .derecha{background-image: URL("imagenes/CentroRecreativo-borde-top.png"); background-repeat: no-repeat}
  #centro-recreativo .derecha h3{font-size: 19px; line-height: 23px; font-weight: 300; text-align: center; color: #659624; padding-top: 15px; padding-bottom: 10px}
  #centro-recreativo .derecha #bloque-principal{margin-top: -1px; background-position: -310px 0px; width: 662px; padding: 25px; height: 325px}
  #centro-recreativo .derecha #centro-recreativo-slider{width: 662px; height: 321px; overflow: hidden}
  #centro-recreativo .derecha #centro-recreativo-slider .wrapper{min-width:662px; height: 321px; overflow: visible}
  #centro-recreativo .derecha #centro-recreativo-slider .wrapper > div.slide{display: inline-block; width: 662px; height: 321px; vertical-align: top}
  
  /**************************************/
  
  
  /***********  BENEFICIOS **************/
  .main#beneficios .fondo-especifico{background-image: URL("imagenes/fondo-Beneficios.jpg")}
  #beneficios .izquierda{background-image: URL("imagenes/Beneficios-flechas_izq.png"); background-repeat: no-repeat; background-position: -6px -8px; margin-left: -1px; background-size: 322px 87px;}
  #beneficios .izquierda h2{font-size: 23px; line-height: 30px; color: #1C2A24; font-weight: 500; padding-top: 20px; text-align: center; height: 55px}
  #beneficios .contenedor-azul{background-image: URL("imagenes/Beneficios-cuadro_azul.jpg"); width: 311px; height: 508px}
  #beneficios .caja-objetivo{width: 221px; height: 135px; background-image: URL('imagenes/Beneficios-cuadro_izq.png'); padding-top: 16px; padding-left: 50px; background-repeat: no-repeat; overflow: hidden; padding-right: 20px}
  #beneficios .caja-objetivo h3 {font-size: 20px; font-weight: 400; line-height: 30px; color: #ee4036}
  #beneficios .caja-objetivo p{font-family: "Alegreya Sans SC", sans-serif; font-size: 15px; font-weight: 400; line-height: 18px; color: #131916; padding-top: 14px; width: 220px}
  #beneficios .caja-info{width: 274px; height: 320px; background-image: URL('imagenes/Beneficios-info.jpg'); margin-left: 17px; margin-top: 15px}
  #beneficios .caja-info p{font-size: 13px; line-height: 21px; font-family: "Georgia", times new roman; padding-left: 20px; padding-top: 20px; width: 240px}
  #beneficios .derecha{background-image: URL("imagenes/Beneficios-iconos_der.jpg"); background-repeat: no-repeat; background-position: 408px -3px; margin-left: 0px}
  #beneficios .derecha #bloque-principal{background-image: URL("imagenes/Beneficios-cuadro_der.jpg"); background-repeat: no-repeat; width:712px; height: 361px; margin-top: 74px; background-size: 100%}
  #beneficios .derecha #bloque-principal ul.lista-beneficios{padding-left: 33px; padding-top: 33px; -webkit-column-count: 2; -moz-column-count: 2; column-count: 2}
  #beneficios .derecha #bloque-principal ul.lista-beneficios li{padding-left: 22px; width: 273px; padding-bottom: 10px; padding-top: 10px; border-bottom: 1px solid RGBA(30,106,124,.4);background-image: URL("imagenes/Beneficios-list.png"); background-repeat: no-repeat; background-position: 0px 9px}
  #beneficios .derecha #bloque-principal ul.lista-beneficios li.last{ border-bottom: 0px}
  #beneficios .derecha #bloque-principal ul.lista-beneficios li p{font-size: 14px; line-height: 15px}
  #beneficios .derecha #bloques-institucional{margin-top: 25px}
  /**************************************/
  
  
  /***********  TURISMO **************/
  .main#turismo .fondo-especifico{background-image: URL("imagenes/fondo-Turismo.jpg")}
  #turismo .izquierda{margin-left: -1px}
  #turismo .izquierda h2{font-size: 23px; line-height: 30px; color: #1C2A24; font-weight: 500; padding-top: 20px; text-align: center; height: 55px}
  #turismo .contenedor-azul{background-image: URL("imagenes/Turismo-caja_izq.jpg"); width: 311px; height: 508px}
  #turismo .contenedor-azul > p{font-family: "Alegreya Sans SC", sans-serif; font-size: 15px; font-weight: 400; line-height: 16px; color: #131916; padding-top: 14px; width: 220px; padding-left: 30px; padding-top: 32px}
  #turismo .derecha{background-image: URL("imagenes/Turismo-iconos.png"); background-repeat: no-repeat; background-position: 408px -3px; margin-left: 0px}
  #turismo .derecha h3{font-size: 19px; line-height: 23px; font-weight: 300; text-align: center; color: #1BA2C1; padding-top: 15px; padding-bottom: 10px; padding-right: 300px}
  #turismo .derecha #bloque-principal{background-image: URL("imagenes/Turismo-caja_der.jpg"); background-repeat: no-repeat; width:712px; height: 361px; margin-top: 4px; background-size: 100%; padding-top: 12px}
  #turismo .derecha #bloque-principal .wrapper{padding-left: 145px; height: 335px; width: 558px; overflow: hidden; overflow-y: scroll; padding-top: 1px}
  #turismo .derecha #bloque-principal .destinos-lista{padding-top: 30px; -webkit-column-count: 3; column-count: 3; -moz-column-count: 3; width: 526px; padding-right: 30px; column-gap: 40px; padding-top: 20px; min-height: 314px;}
  #turismo .derecha #bloque-principal .destinos-lista .destino-grupo{break-inside: avoid-column;
    -webkit-column-break-inside: avoid; page-break-inside: avoid}
  #turismo .derecha #bloque-principal .destinos-lista .destino-grupo ul{padding-bottom: 20px}
  #turismo .derecha #bloque-principal .destinos-lista h3.destinos-titulo{font-weight: 700; font-size: 14px; color: #4C433A; line-height: 17px; width: 123px; height: 17px; background-image: URL("imagenes/Turismo-list.png"); background-repeat: no-repeat; padding-left: 18px; padding-top: 8px; text-align: left; break-inside: avoid-column; -webkit-column-break-inside: avoid; page-break-inside: avoid}
  #turismo .derecha #bloque-principal .destinos-lista p.zona{font-size: 14px; padding-left: 18px; break-inside: avoid-column; -webkit-column-break-inside: avoid; page-break-inside: avoid; padding-top: 3px}
  #turismo .derecha #bloque-principal .destinos-lista li p{font-size: 14px; padding-left: 20px; width: 140px; break-inside: avoid-column; -webkit-column-break-inside: avoid; page-break-inside: avoid}
  /***********************************/
  
  
  /***********  CARTILLAS **************/
  .main#cartillas .fondo-especifico{background-image: URL("imagenes/fondo-Cartillas.jpg")}
  #cartillas .izquierda{margin-left: -1px}
  #cartillas .izquierda h2{font-size: 23px; line-height: 30px; color: #1C2A24; font-weight: 500; padding-top: 20px; text-align: center; height: 55px}
  #cartillas .contenedor-azul{background-image: URL("imagenes/Cartillas-caja-izq.jpg"); width: 311px; height: 508px}
  #cartillas .contenedor-azul > p{font-family: "Alegreya Sans", sans-serif; font-size: 24px; font-weight: 300; line-height: 29px; color: #1C2A24; padding-top: 14px; width: 220px; padding-left: 40px; padding-top: 92px; text-align: center}
  #cartillas .derecha{background-image: URL("imagenes/Cartillas-iconos.png"); background-repeat: no-repeat; background-position: 0px -1px; margin-left: 0px}
  #cartillas .derecha #bloque-principal{background-image: URL("imagenes/Cartillas-caja_der.jpg"); background-repeat: no-repeat; width:712px; height: 361px; margin-top: 4px; background-size: 100%; padding-top: 12px; margin-top: 75px}
  /*#cartillas .derecha #bloque-principal .cartilla { position: absolute; width: 173px; height: 114px;}
  #cartillas .derecha #bloque-principal .cartilla#cart-1{margin-top: 26px; margin-left: 86px;}
  #cartillas .derecha #bloque-principal .cartilla#cart-2{margin-top: 26px; margin-left: 264px;}
  #cartillas .derecha #bloque-principal .cartilla#cart-3{margin-top: 26px; margin-left: 443px;}
  #cartillas .derecha #bloque-principal .cartilla#cart-4{margin-top: 189px; margin-left: 175px;}
  #cartillas .derecha #bloque-principal .cartilla#cart-5{margin-top: 189px; margin-left: 353px;}*/
  #cartillas .derecha #bloque-principal .cartilla { position: absolute; width: 196px; height: 178px;}
  #cartillas .derecha #bloque-principal .cartilla#cart-1{margin-top: 116px; margin-left: 156px;}
  #cartillas .derecha #bloque-principal .cartilla#cart-2{margin-top: 26px; margin-left: 264px;}
  #cartillas .derecha #bloque-principal .cartilla#cart-3{margin-top: 26px; margin-left: 443px;}
  #cartillas .derecha #bloque-principal .cartilla#cart-4{margin-top: 116px; margin-left: 360px;}
  #cartillas .derecha #bloque-principal .cartilla#cart-5{margin-top: 189px; margin-left: 353px;}
  #cartillas .derecha #bloques-institucional{margin-top: 25px}
  /**********************************/
  
  /***************** SOCIAL *****************/
  .main#social .fondo-especifico{background-image: URL("imagenes/fondo-home.jpg")}
  #social .izquierda #introduccion{padding-top: 20px; padding-left: 10px; overflow:hidden}
  #social .izquierda #introduccion h3{font-family: "Alegreya Sans", sans-serif; font-weight: 500; font-size: 23px; line-height: 20px; color: #1C2A24; width: 152px; padding-bottom: 2px; padding-left: 20px}
  #social .izquierda #resumen{width: 264px; height: 108px; background-image: URL("imagenes/Social-resumen_off.jpg"); background-repeat: no-repeat; cursor: pointer}
  #social .izquierda #resumen:hover{background-image: URL("imagenes/Social-resumen_on.jpg")}
  #social .izquierda #comunicados{width: 264px; height: 108px; background-image: URL("imagenes/Social-comunicados_off.jpg"); background-repeat: no-repeat; cursor: pointer; margin-left: 2px}
  #social .izquierda #comunicados:hover{background-image: URL("imagenes/Social-comunicados_on.jpg")}
  #social .izquierda img{width: 100%}
  #social #social-slider .controls{width: 712px; height: 368px}
  #social #bloques-institucional{margin-top: 75px}
  #social .derecha #home-slider{width: 712px; height: 368px; overflow: hidden}
  #social .derecha #home-slider .wrapper{min-width:712px; height: 368px; overflow: visible}
  #social .derecha #home-slider .wrapper > div.slide{display: inline-block; width: 712px; height: 368px; vertical-align: top}
  /***************************************/
  
  /***************** PLANES *****************/
  .main#planes .fondo-especifico{background-image: URL("imagenes/fondo-Planes.jpg")}
  #planes .izquierda{margin-left: -1px}
  #planes .izquierda h2{font-size: 23px; line-height: 30px; color: #1C2A24; font-weight: 500; padding-top: 20px; text-align: left; padding-left: 30px}
  #planes .izquierda h3{font-size: 21px; line-height: 30px; font-weight: 300; color: #1C2A24; text-align: left; padding-left: 30px; padding-bottom: 31px}
  #planes .izquierda h3 span.azul{font-weight: 500; color: #1aa8a1}
  #planes .contenedor-azul{background-image: URL("imagenes/Planes-caja_izq.jpg"); width: 311px; height: 508px; background-repeat: no-repeat}
  #planes .contenedor-azul > p{font-family: "Alegreya Sans", sans-serif; font-size: 20px; font-weight: 300; line-height: 24px; color: #1C2A24; padding-top: 25px; width: 240px; text-align: left; padding-left: 40px}
  #planes .derecha #bloque-principal{background-image: URL("imagenes/Planes-caja_der.jpg"); background-repeat: no-repeat; width:712px; height: 446px; margin-top: 4px; background-size: 100%; padding-top: 12px; margin-top: 0px}
  #planes .derecha #bloque-principal .plan { position: absolute; width: 218px; height: 141px; background-image:URL("imagenes/Planes-planes.png")}
  #planes .derecha #bloque-principal .plan#plan-1{background-position: -553px 0px}
  #planes .derecha #bloque-principal .plan#plan-2{margin-left: 218px; background-position: -771px 0px}
  #planes .derecha #bloque-principal .plan#plan-3{margin-top: 141px; background-position: -553px -141px; height: 130px}
  #planes .derecha #bloque-principal .plan#plan-4{margin-left:218px; margin-top:141px; background-position: -771px -141px; height: 130px}
  #planes .derecha #bloque-principal .plan#plan-1:hover{background-position: -33px 0px}
  #planes .derecha #bloque-principal .plan#plan-2:hover{margin-left: 218px; background-position: -251px 0px}
  #planes .derecha #bloque-principal .plan#plan-3:hover{margin-top: 141px; background-position: -33px -141px}
  #planes .derecha #bloque-principal .plan#plan-4:hover{margin-left:218px; margin-top:141px; background-position: -251px -141px}
  /***************************************/
  
  /***************** CONTACTO *****************/
  .main#contacto .fondo-especifico{background-image: URL("imagenes/fondo-home.jpg")}
  #contacto .izquierda{font-family: "Alegreya Sans", sans-serif; margin-left: -1px}
  #contacto .izquierda h3{font-size: 21px; line-height: 30px; font-weight: 300; color: #1C2A24; text-align: left; padding-left: 30px; padding-bottom: 20px; background-image: URL("imagenes/Contacto-top.png"); background-repeat: no-repeat; background-position: center right; padding-top:15px}

  #contacto .izquierda label{background-image: URL("imagenes/Contacto-item.png"); font-size: 14px; line-height: 19px; font-weight: 300; display: block; padding-top: 15px; padding-left: 30px; background-repeat: no-repeat; background-position: 20px 18px}
  #contacto .izquierda .seccion{height: 155px; width: 100%; background-color: #AAE0E4}
  #contacto .izquierda input{margin-left: 30px; margin-top: 5px}
  #contacto .izquierda input[type="radio"]{display: inline-block}
  #contacto .izquierda .seccion > p{font-size: 14px; font-weight: 300; line-height: 19px; padding-top: 20px; padding-left: 20px; padding-bottom: 10px}
  #contacto .izquierda p.radio{ font-weight: 500; font-size: 14px; line-height: 19px; color: #14918B; display: inline-block}
  #contacto .izquierda .nombre{height: 148px; width: 100%; background-color: #F9B37C}
  #contacto .izquierda .comentarios{height: 215px; width: 100%; background-color: #CEDD76; background-image: URL("imagenes/Contacto-bottom.png"); background-repeat: no-repeat; background-position: bottom center;}
  #contacto .izquierda textarea{width: 242px; height: 105px; margin-left: 30px; margin-top: 10px}
  #contacto .izquierda .comentarios p{font-weight: 500; font-size: 14px; line-height: 19px; color: #000;  text-align: center; margin-top: 10px; display: inline-block; padding-left: 10px}
  #contacto .derecha #home-slider{width: 712px; height: 368px; overflow: hidden}
  #contacto .derecha #home-slider .wrapper{min-width:712px; height: 368px; overflow: visible}
  #contacto .derecha #home-slider .wrapper > div.slide{display: inline-block; width: 712px; height: 368px; vertical-align: top}
  #contacto #bloques-institucional{margin-top: 75px}
  /**********************************************/
  
  
  
  /***************************************************************************************
  ****************************************************************************************
  **                																	**
  **																					**
  **                                    RESPONSIVE                                      **
  **																					**
  **																					**
  ****************************************************************************************
  ***************************************************************************************/
  
  @media screen and (max-width: 1050px){
	  .fondo-especifico{background-image: none!important}
	  #global_header{width: 768px; margin: 0 auto}
	  #global_header #border_top{margin-left: -1137px}
	  #global_header #header_content #header_menu .menu_item{width: 104px}
	  #global_header #header_content #header_menu .menu_item p{font-size: 14px;}
	  #global_header #header_content #header_menu .menu_item .sub_menu .sub_menu_item p{font-size: 14px}
	  
	  .main{width: 768px; height: 560px; margin: 0 auto} 
	  .main .main-content{width: 768px; left: 0; margin: 0 auto; position: relative}
	  .main .derecha{width: 455px}
	  
	  /** HOME **/
	  #home #bloques-institucional{margin-top: 22px}
	  #home .izquierda #introduccion{padding-top: 18px}
	  #home .derecha #home-slider{margin-left: 10px; width: 445px; height: 235px}
	  #home .derecha #home-slider .wrapper{height: 235px}
	  #home .derecha #home-slider .wrapper > div.slide{width: 445px; height: 235px}
	  #home #home-slider .controls{width: 445px; height: 235px}
	  /** *** **/
	  
	  /** QUE ES APS **/
	  #que-es-aps #bloques-institucional{margin-top: 22px}
	  #que-es-aps{height: 585px}
	  #que-es-aps .derecha #slider-container{padding: 10px; padding-left: 0}
	  #que-es-aps .derecha #que-es-aps-slider{margin-left: 10px; width: 445px; height: 235px}
	  #que-es-aps .derecha #que-es-aps-slider .wrapper{height: 235px}
	  #que-es-aps .derecha #que-es-aps-slider .wrapper > div.slide{width: 445px; height: 235px}
	  #que-es-aps #que-es-aps-slider .controls{width: 445px; height: 235px}
	  /** ** ** *** **/
	  
	  /** QUIERE SER BENEFICIARIO **/
	  #quiere-ser-beneficiario{height: 770px}
	  #quiere-ser-beneficiario #bloques-institucional{margin-top: 22px}
	  #quiere-ser-beneficiario .main-content{margin-left: 0px}
	  #quiere-ser-beneficiario #brothers-img{background-image:URL("imagenes/brothers-resp.jpg"); width: 311px; height: 320px; background-size: auto; background-position: -70px 0px}
	  #quiere-ser-beneficiario .derecha h3{overflow: hidden; height: 44px}
	  #quiere-ser-beneficiario .derecha #bloque-principal #beneficiario-requisitos{background-image:URL("imagenes/cuadro-470.png"); padding-left: 20px; background-position: -15px -10px; background-repeat: no-repeat; overflow-y: scroll;width: 425px; height: 320px; box-shadow: -1px 2px 2px gray}
	  /** ****** *** ************ **/
	  
	  /** CENTRO RECREATIVO **/
	  #centro-recreativo{height:670px}
	  #centro-recreativo .main-content{margin-left: 0px}
	  #centro-recreativo .izquierda{width: 310px}
	  #centro-recreativo .izquierda #ubicacion #mapa{background-image:URL("imagenes/mapa-grande.jpg"); width: 310px; height: 218px; background-blend-mode: lighten; background-color: gray}
	  #centro-recreativo .izquierda #ubicacion #direccion{margin-top: -250px; margin-left: -5px}
	  #centro-recreativo .izquierda #ubicacion #direccion p{font-size:23px; line-height: 27px; text-shadow: 0px 0px 1px white}
	  #centro-recreativo .derecha #bloque-principal{height: 235px; padding: 10px; padding-left: 0px}
	  #centro-recreativo .derecha #centro-recreativo-slider{margin-left: 10px; width: 445px; height: 235px}
	  #centro-recreativo .derecha #centro-recreativo-slider .wrapper{height: 235px}
	  #centro-recreativo .derecha #centro-recreativo-slider .wrapper > div.slide{width: 445px; height: 235px}
	  #centro-recreativo #centro-recreativo-slider .controls{width: 445px; height: 235px}
	  #centro-recreativo #bloques-institucional{margin-top: 22px}
	  /** ****** ********** **/
	  
	  /** TURISMO **/
	  #turismo{height: 600px}
	  #turismo .derecha{background-image: none}
	  #turismo .derecha h3{overflow: hidden; height: 44px; padding-right: 0; padding-bottom: 12px}
	  #turismo .derecha #bloque-principal{width: 452px; background-color: #9ec9e4; padding-top: 14px; margin-top: 4px; background-image: none; height: 220px}
	  #turismo .derecha #bloque-principal .wrapper{background-color: white; background-image: none; padding-left: 40px; margin-left: 15px; margin-top: 0px; box-shadow: -2px 2px 3px gray; width: 385px; height: 200px}
	  #turismo .derecha #bloque-principal .destinos-lista{-webkit-column-count: 2; column-count: 2; -moz-column-count: 2; width: 356px; column-gap: 0}
	  /** ******* **/
	  
	  /** BENEFICIOS **/
	  #beneficios{height: 600px}
	  #beneficios .derecha #bloques-institucional{margin-top: 0px}
	  #beneficios #bloques-institucional .bloque-info{height: 85px}
	  #beneficios .derecha{background-position: 68px -3px;}
	  #beneficios .derecha h3{height: 75px; display: block}
	  #beneficios .derecha #bloque-principal{width: 455px; margin-top: 0px; padding-top: 10px; height: 230px; background-image: none; background-color: #9ec9e4}
	  #beneficios .derecha #bloque-principal .wrapper{margin-left: 7px; margin-top: 0px; box-shadow: -2px 2px 3px gray; padding-left: 0px; padding-top: 0px; padding-right: 0px; column-gap: 15px; height: 210px; overflow: hidden; overflow-y: scroll; margin-right: 8px; background-image: none; background-color: white}
	  #beneficios .derecha #bloque-principal ul.lista-beneficios{padding-left: 10px; padding-top: 10px; column-gap: 15px; padding-right: 10px}
	  #beneficios .derecha #bloque-principal ul.lista-beneficios li{width: auto}
	  /** ********** **/
	   
	  #planes{height: 600px}
	  #planes .derecha #bloque-principal{background-image: none; height: 271px}
	  
	  #cartillas{height: 600px}
	  #cartillas .derecha #bloque-principal{width: 455px; height: 220px}
	  #cartillas .derecha #bloques-institucional{margin-top: 0px}
	  /*#cartillas .derecha #bloque-principal .cartilla{height: 74px; width: 111px}
	  #cartillas .derecha #bloque-principal .cartilla#cart-1{margin-top: 12px; margin-left: 55px}
	  #cartillas .derecha #bloque-principal .cartilla#cart-2{margin-top: 12px; margin-left: 170px}
	  #cartillas .derecha #bloque-principal .cartilla#cart-3{margin-top: 12px; margin-left: 284px}
	  #cartillas .derecha #bloque-principal .cartilla#cart-4{margin-top: 115px; margin-left: 111px}
	  #cartillas .derecha #bloque-principal .cartilla#cart-5{margin-top: 115px; margin-left: 226px}*/
	  #cartillas .derecha #bloque-principal .cartilla{height: 115px; width: 125px}
	  #cartillas .derecha #bloque-principal .cartilla#cart-1{margin-top: 72px; margin-left: 100px}
	  #cartillas .derecha #bloque-principal .cartilla#cart-4{margin-top: 72px; margin-left: 229px}
	  
	  /** SOCIAL **/
	  #social{height: 600px}
	  #social #bloques-institucional{margin-top: 22px}
	  #social .derecha #home-slider{margin-left: 10px; width: 445px; height: 235px}
	  #social .derecha #home-slider .wrapper{height: 235px}
	  #social .derecha #home-slider .wrapper > div.slide{width: 445px; height: 235px}
	  #social #home-slider .controls{width: 445px; height: 235px} 
	  /** ******** **/
	  
	  /** CONTACTO **/
	  #contacto{height: 600px}
	  #contacto #bloques-institucional{margin-top: 22px}
	  #contacto .derecha #home-slider{margin-left: 10px; width: 445px; height: 235px}
	  #contacto .derecha #home-slider .wrapper{height: 235px}
	  #contacto .derecha #home-slider .wrapper > div.slide{width: 445px; height: 235px}
	  #contacto #home-slider .controls{width: 445px; height: 235px} 
	  /** ******** **/
	  
	  /** BLOQUES INSTITUCIONAL **/
	  #bloques-institucional .bloque-info{height: 95px; width: 100%}
	  #emergencias, #superintendencia{border: none}
	  #bloques-institucional div .imagen{background-size:100%; background-repeat: no-repeat; height: 95px; margin: 0 auto}
	  #emergencias .imagen{background-image: URL("imagenes/emergencias-grande.jpg")}
	  #superintendencia .imagen{background-image: URL("imagenes/superintendencia-grande.jpg")}
	  #atencion .imagen{background-image: URL("imagenes/atencion-grande.jpg")}
	  #emergencias .imagen, #superintendencia .imagen{margin-top: 10px}
	  #emergencias .imagen{width: 300px}
	  #superintendencia .imagen{width: 300px}
	  #atencion .imagen{width: 300px; background-position: -10px 0}
	  /** ****************** **/
	  
	  #global_footer{width: 768px; margin: 0 auto}
	  #global_footer #footer_content p{float: left}
  }
  
  @media screen and (max-width: 767px){
	  
	  
	  #global_header #border_top{margin-left: 0px;width: 100vw; left:0}
	  #global_header{width:480px; height: 92px; text-align: center}
	  #global_header #header_content{width: 480px; padding-top: 11px; }
	  #global_header #header_content #header_menu{display: none}
	  
	  #panel{opacity: .3; width: 380px; height: 100vh; top: 11px; background-color: #2D317A; position: absolute; z-index: 9999999; margin-left:-380px; -moz-transition: all 0.6s ease-in; -webkit-transition: all 0.6s ease-in; transition: all 0.6s ease-in}
	  #panel.active{margin-left: 0px; opacity: 1}
	  #panel nav{width: 100%; height: 100%;}
	  #panel nav > ul{padding-top: 10px}
	  #panel nav .menu_item > p,#panel nav .menu_item a p{font-size: 18px; color: white; margin-bottom: 3px; text-align: center; width: 180px; margin: 0 auto;}
	  #panel nav .menu_item#menu_item-institucional > p{border-bottom: 2px solid RGB(255, 102, 0)}
	  #panel nav .menu_item#menu_item-prestaciones > p{border-bottom: 2px solid #1097C1}
	  #panel nav .menu_item#menu_item-sindical a p{border-bottom: 2px solid #1CD3A2}
	  #panel nav .menu_item#menu_item-contacto a p{border-bottom: 2px solid #f7f200}
	  #panel nav .menu_item .sub_menu p{font-size: 14px; color: white; margin-bottom: 3px; text-align: center; }
	  #global_header #header_content #resp_menu-button{display: block; width: 20px; height: 20px; display: inline-block; right: 15px; position: absolute;}
	  #resp_menu-button p.line{    color:#2d317a; width: 20px; line-height: 5px; font-size: 60px; margin-bottom: 2px; transition: all 0.4s linear; font-family: Arial; cursor: pointer}
	  #resp_menu-button p.title{color: #2D317a;font-family: "Alegreya Sans SC", sans; letter-spacing: 1px;    display: block; height: 10px; width: 40px; font-size: 12px; padding-top: 15px; margin-left: -10px;}
	  #resp_menu-button.active p.line#line1{transform: rotate(45deg); margin-left: 3px; margin-top: 6px; position: absolute}
	  #resp_menu-button.active p.line#line2{transform: rotate(-45deg); margin-top: 6px; margin-left: -4px; position: absolute}
	  #resp_menu-button.active p.line#line3{opacity: 0}
	  
	  .main{width: 480px}
	  .main .fondo-especifico{display: none!important; width:0px}
	  .main .main-content{width: 480px; height: 560px}
	  .main .izquierda{width: 100%}
	  #home .izquierda{height: 195px}
	  #home .izquierda #introduccion{padding-left: 0}
	  #home .izquierda #introduccion h3{width: 480px; text-align: left; padding-left: 10px; padding-top: 20px}
	  #home .izquierda #introduccion p{padding-left: 10px; padding-right: 20px; width: 440px}
	  #home .izquierda img{display: none}
	  #home #bloques-institucional{margin-top: 15px; margin-left: 35px}
	  #home .derecha{height: 465px}
	  #home .derecha #home-slider{margin-left: 10px; width: 460px; height: 235px}
	  #home .derecha #home-slider .wrapper{height: 235px}
	  #home .derecha #home-slider .wrapper > div.slide{width: 460px; height: 235px}
	  #home #home-slider .controls{width: 460px; height: 235px}
	  #home .main .derecha{height: 370px}
	  
	  #que-es-aps{padding-top: 20px; height: 1050px; width: 100vw; overflow: hidden;}
	  #que-es-aps .izquierda{width: 465px; height: 655px; margin: 0 auto; display: block; background-size: 100% 100%; position: absolute;     margin-top: 265px; margin-left: 7px; z-index: 90}
	  #que-es-aps .izquierda h2{padding-top: 30px}
	  #que-es-aps .izquierda h3{padding-top: 16px}
	  #que-es-aps .izquierda p{font-size: 16px; line-height: 18px; color: #293844; width: 314px; padding-left: 32px; line-height: 22px; padding-left: 50px; padding-right: 25px;  padding-top: 100px;}
	  #que-es-aps .derecha #slider-container{position: absolute; margin-left: 7px; height: 900px; z-index:50}
	  #que-es-aps #bloques-institucional { margin-top: 935px; padding-left: 45px;}
	  
	  #quiere-ser-beneficiario{height: 1100px; margin-top: 10px; width: 100%}
	  #quiere-ser-beneficiario .main-content{width: 100%}
	  #quiere-ser-beneficiario .izquierda{width: 100%;}
	  #quiere-ser-beneficiario .izquierda h2, #quiere-ser-beneficiario .izquierda h3{width: 420px; text-align: center; display: block; margin: 0 auto; padding-left: 0px;}
	  #quiere-ser-beneficiario .izquierda #beneficiario-bloques-container{height:370px}
	  #quiere-ser-beneficiario .izquierda .beneficiario-bloques{margin: 0 auto!important; display: block}
	  #quiere-ser-beneficiario #brothers-img{display: none}
	  #quiere-ser-beneficiario .derecha{margin-top: -111px; width: 100%;}
	  #quiere-ser-beneficiario .derecha #bloque-principal #beneficiario-requisitos{height: 360px;background-color: white; background-image: none; margin: 0 auto}
	  #quiere-ser-beneficiario .derecha #bloque-principal{height: 385px; background-size: 1024px 100%}
	  #quiere-ser-beneficiario #bloques-institucional {    width: 480px; margin: 0 auto; padding-left: 20px;}
	  
	  #centro-recreativo{height: 1150px; margin-top: 10px; width: 100%}
	  #centro-recreativo .main, #centro-recreativo .main-content {width: 100%}
	  #centro-recreativo .izquierda{width: 100%; display: block; margin: 0 auto; height: 670px}
	  #centro-recreativo .izquierda h2, #centro-recreativo .izquierda h3{width: 100%; text-align: center; display: block; margin: 0 auto; padding-left: 0px;}
	  #centro-recreativo .izquierda h3{background-position: 50% 0px}
	  #centro-recreativo .izquierda > p br{display: none}
	  #centro-recreativo .izquierda p{text-align: center}
	  #centro-recreativo .izquierda #linea-punteada{width: 100%; background-repeat: repeat}
	  #centro-recreativo .izquierda p.lista{padding-left: 25px; padding-right: 25px}
	  #centro-recreativo .izquierda .contenedor-azul #recuadro-horario{height: 135px; width: 400px; padding-left: 10px; padding-right: 10px;}
	  #centro-recreativo .contenedor-azul{height: 350px}
	  #centro-recreativo .izquierda .contenedor-azul #recuadro-horario{margin: 0 auto}
	  #centro-recreativo .izquierda #ubicacion #mapa{width: 100%; height: 253px; background-size: 100%}
	  #centro-recreativo .derecha{width: 100%; display: block; margin: 0 auto; height: 581px; background-image: URL("imagenes/QuiereSerBeneficiario-degrade-top.png");}
	  #centro-recreativo .derecha #centro-recreativo-slider{margin: 0 auto}
	  #centro-recreativo .derecha #bloque-principal{width: 100%}
	  #centro-recreativo #bloques-institucional{ margin-top: 20px; padding-left: 20px}
	  #centro-recreativo #bloques-institucional {    width: 480px; margin: 0 auto; padding-left: 20px;}
	  
	  #turismo{height: 1100px}
	  #turismo .contenedor-azul{margin: 0 auto}
	  #turismo .derecha{ margin: 0 auto; display: block;}
	  #turismo .derecha #bloque-principal{height: 295px}
	  #turismo .derecha #bloque-principal .wrapper{height: 280px}
	  #turismo #bloques-institucional{ margin-top: 20px; padding-left: 20px}
	  
	  #beneficios{height: 1100px; margin-top: 10px; width: 100%}
	  #beneficios .izquierda{background-position: 80px -8px; background-size: 321px 87px;}
	  #beneficios .contenedor-azul{margin: 0 auto; width: 100%; background-size: 100%}
	  #beneficios .caja-objetivo{ margin: 0 auto; padding-right: 40px;}
	  #beneficios .caja-info{ margin: 0 auto}
	  #beneficios .derecha{ width: 100%;display: block;}
	  #beneficios .derecha #bloques-institucional{ margin-top: 20px; width: 100%}
	  #beneficios .derecha #bloque-principal{width: 100%}
	  #beneficios #bloques-institucional{padding-left: 20px}
	  
	  #planes{height: 1000px; margin-top: 10px; width: 100%}
	  #planes .izquierda{width: 310px; margin: 0 auto; display: block}
	  #planes .derecha{margin: 0 auto; display: block;height: 400px}
	  #planes .derecha #bloque-principal{width: 480px; margin: 0 auto; height: 270px}
	  #planes .derecha #bloque-principal .plan{width: 218px; height: 141px; }
	  #planes #bloques-institucional{margin-top:20px}
	  
	  #cartillas{height: 780px; margin-top: 10px; width: 100%}
	  #cartillas .main, #cartillas .main-content{width:100%}
	  #cartillas .izquierda{width: 100%; height: 350px}
	  #cartillas .izquierda .contenedor-azul{display: block; margin: 0 auto;  background-size: 100%; height: 275px}
	  #cartillas .derecha{width: 480px; display: block; padding-top: 65px; margin: 0 auto; height: 375px}
	  #cartillas .derecha #bloque-principal{width: 480px; margin: 0 auto}
	  #cartillas #bloques-institucional{padding-left: 20px; padding-top: 20px}
	  
	  #social{height: 520px}
	  #social .izquierda{height: 155px}
	  #social .izquierda #introduccion{padding-left: 0}
	  #social .izquierda #introduccion h3{width: 480px; padding-left: 0; text-align: center; padding-bottom: 20px; padding-top: 0px;}
	  #social .izquierda #introduccion p{padding-left: 10px; padding-right: 20px; width: 440px}
	  #social .izquierda img{display: none}
	  #social .izquierda #introduccion > a, #social .izquierda #introduccion  #comunicados{display: inline-block; vertical-align: top}
	  #social .izquierda #introduccion  #resumen, #social .izquierda #introduccion  #comunicados{width: 214px; height: 98px; background-size: 100%; }
	  #social .izquierda #introduccion > a{padding-left: 4px}
	  #social .izquierda #introduccion  #comunicados{margin-top: 3px; margin-left: 42px}
	  #social #bloques-institucional{margin-top: 15px; margin-left: 35px}
	  #social .derecha{width: 480px; height: 385px}
	  #social .derecha #home-slider{margin: 0 auto; width: 460px; height: 235px}
	  #social .derecha #home-slider .wrapper{height: 235px}
	  #social .derecha #home-slider .wrapper > div.slide{width: 460px; height: 235px}
	  #social #home-slider .controls{width: 460px; height: 235px}
	  #social .main .derecha{height: 370px}
	  
	  #contacto{height: 930px; margin-top: 10px; width: 480px}
	  #contacto .izquierda{width: 480px; margin: 0 auto; display: block; height: 538px}
	  #contacto .izquierda .nombre{width: 480px; margin: 0 auto; margin-top: 240px;}
	  #contacto .izquierda .nombre > *{width: 310px; margin: 0 auto; display: block}
	  #contacto .izquierda .seccion{width: 480px; margin: 0 auto; height: 110px}
	  #contacto .izquierda .seccion > *{width: 310px; margin: 0 auto; display: block}
	  #contacto .izquierda .comentarios{width: 480px; margin: 0 auto;}
	  #contacto .izquierda .comentarios > *{width: 310px; margin: 0 auto; display: block}
	  #contacto .derecha{margin-top: -473px; width: 480px}
	  #contacto .derecha #home-slider{margin: 0 auto}
	  #contacto #bloques-institucional{margin-top: 492px}
	  
	  #bloques-institucional .bloque-info{height: 55px; width: 195px}
	  #bloques-institucional .bloque-info#atencion{padding-left: 2px}
	  #bloques-institucional div .imagen{width: 195px; }
	  
	  #global_footer{width: 470px; height: 55px; padding-left: 10px; padding-top: 20px}
	  #global_footer #footer_content p{width: 460px}
	}
	@media screen and (max-width: 479px){
	  #global_header{width:320px}
	  #global_header #header_content{width: 320px}
	  #global_header #header_content #header_logo{text-align: left}
	  #global_header #header_content #header_logo a img{width: 265px}
	  
	  #panel{width: 270px;}
	  
	  .main{width: 320px}
	  .main .main-content{width: 320px; height: 560px}
	  .main .derecha{width:320px}
	  
	  /** HOME 320 **/
	  #home .izquierda{height: 215px}
	  #home .izquierda #introduccion{padding-top: 0px}
	  #home .izquierda #introduccion h3{width: 320px;}
	  #home .izquierda #introduccion p{width: 300px}
	  
	  #home .derecha{height: 465px; width:320px; display: block; margin: 0 auto}
	  #home .derecha #home-slider{margin-left: 0px; width: 320px; height: 165px}
	  #home .derecha #home-slider .wrapper{height: 165px}
	  #home .derecha #home-slider .wrapper > div.slide{width: 320px; height: 165px}
	  #home #home-slider .controls{width: 320px; height: 165px}
	  #home .main .derecha{height: 370px}
	  
	  #home #bloques-institucional{width: 190px; margin: 0 auto; margin-top: 15px}
	  /** **** *** **/
	  
	  #que-es-aps{padding-top: 20px; height: 1060px; width: 100vw; overflow: hidden;}
	  #que-es-aps .izquierda{width: 320px; height: 655px; margin: 0 auto; display: block; background-size: 100% 100%; position: absolute;     margin-top: 265px; margin-left: 7px; z-index: 90}
	  #que-es-aps .izquierda{margin-top: 215px; width: 305px}
	  #que-es-aps .izquierda h2{padding-top: 34px}
	  #que-es-aps .izquierda h3{padding-top: 12px}
	  #que-es-aps .izquierda p{font-size: 16px; line-height: 18px; color: #293844; width: 314px; padding-left: 32px; line-height: 22px; padding-left: 50px; padding-right: 25px;  padding-top: 100px;width: 220px; }
	  #que-es-aps .izquierda p{padding-left: 40px; width: 220px; line-height: 17px}
	  #que-es-aps .derecha{width: 310px}
	  #que-es-aps .derecha #slider-container{position: absolute; margin-left: 7px; height: 900px; z-index:50; height: 195px; width: 295px;}
	  #que-es-aps .derecha #que-es-aps-slider{width: 285px; height: 193px}
	  #que-es-aps #que-es-aps-slider .controls{width:285px; height: 193px}
	  #que-es-aps .derecha #que-es-aps-slider .wrapper{height: 193px}
	  #que-es-aps .derecha #que-es-aps-slider .wrapper > div.slide{width: 285px; height: 193px}
	  #que-es-aps #bloques-institucional{width: 190px; margin: 0 auto; margin-top: 885px}
	  
	  #quiere-ser-beneficiario{height: 1150px; margin-top: 10px; width: 100%}
	  #quiere-ser-beneficiario .main-content{width: 100%}
	  #quiere-ser-beneficiario .izquierda{width: 100%;}
	  #quiere-ser-beneficiario .izquierda h2, #quiere-ser-beneficiario .izquierda h3{width: 320px; text-align: center; display: block; margin: 0 auto; padding-left: 0px;}
	  #quiere-ser-beneficiario .izquierda #beneficiario-bloques-container{height:370px}
	  #quiere-ser-beneficiario .izquierda .beneficiario-bloques{margin: 0 auto!important; display: block}
	  #quiere-ser-beneficiario #brothers-img{display: none}
	  #quiere-ser-beneficiario .derecha{margin-top: -111px; width: 100%;}
	  #quiere-ser-beneficiario .derecha #bloque-principal #beneficiario-requisitos{height: 360px;background-color: white; background-image: none; margin: 0 auto}
	  #quiere-ser-beneficiario .derecha #bloque-principal{height: 385px; background-size: 1024px 100%}
	  #quiere-ser-beneficiario #bloques-institucional {    width: 320px; margin: 0 auto; padding-left: 20px;}
	  #quiere-ser-beneficiario .derecha #bloque-principal #beneficiario-requisitos{ width: 270px; padding-right: 10px;}
	  #quiere-ser-beneficiario  #bloques-institucional{width: 190px; margin: 0 auto; margin-top: 15px}
	  
	  #centro-recreativo{height: 1150px; margin-top: 10px; width: 100%}
	  #centro-recreativo .main, #centro-recreativo .main-content {width: 100%}
	  #centro-recreativo .izquierda{width: 100%; display: block; margin: 0 auto; height: 670px}
	  #centro-recreativo .izquierda h2, #centro-recreativo .izquierda h3{width: 100%; text-align: center; display: block; margin: 0 auto; padding-left: 0px;}
	  #centro-recreativo .izquierda h3{background-position: 50% 0px}
	  #centro-recreativo .izquierda > p br{display: none}
	  #centro-recreativo .izquierda p{text-align: center}
	  #centro-recreativo .izquierda #linea-punteada{width: 100%; background-repeat: repeat}
	  #centro-recreativo .izquierda p.lista{padding-left: 25px; padding-right: 25px}
	  #centro-recreativo .izquierda .contenedor-azul #recuadro-horario{height: 135px; width: 320px; padding-left: 10px; padding-right: 10px;}
	  #centro-recreativo .contenedor-azul{height: 350px}
	  #centro-recreativo .izquierda .contenedor-azul #recuadro-horario{margin: 0 auto}
	  #centro-recreativo .izquierda #ubicacion #mapa{width: 100%; height: 253px; background-size: 100%}
	  #centro-recreativo .derecha{width: 100%; display: block; margin: 0 auto; height: 581px; background-image: URL("imagenes/QuiereSerBeneficiario-degrade-top.png");}
	  #centro-recreativo .derecha #centro-recreativo-slider{margin: 0 auto}
	  #centro-recreativo .derecha #bloque-principal{width: 100%}
	  #centro-recreativo #bloques-institucional{ margin-top: 20px; padding-left: 20px}
	  #centro-recreativo #bloques-institucional {    width: 320px; margin: 0 auto; padding-left: 20px;}
	  #centro-recreativo .izquierda .contenedor-azul #recuadro-horario{height:195px}
	  #centro-recreativo .izquierda .contenedor-azul #recuadro-horario p{width:290px}
	  #centro-recreativo .izquierda #ubicacion #mapa{height:220px}
	  #centro-recreativo .izquierda{height: 640px}
	  #centro-recreativo .derecha #bloque-principal{width: 320px; height: 193px}
	  #centro-recreativo .derecha #centro-recreativo-slider{width: 320px; height: 193px}
	  #centro-recreativo #centro-recreativo-slider .controls{width:320px; height: 193px}
	  #centro-recreativo .derecha #centro-recreativo-slider .wrapper{height: 193px}
	  #centro-recreativo .derecha #centro-recreativo-slider .wrapper > div.slide{width:320px; height: 193px}
	  #centro-recreativo  #bloques-institucional{width: 190px; margin: 0 auto; margin-top: 15px}
	  
	  #turismo{height: 1140px}
	  #turismo .contenedor-azul{margin: 0 auto}
	  #turismo .derecha{ margin: 0 auto; display: block;}
	  #turismo .derecha #bloque-principal{height: 295px}
	  #turismo .derecha #bloque-principal .wrapper{height: 280px}
	  #turismo #bloques-institucional{ margin-top: 20px; padding-left: 20px}
	  #turismo .derecha #bloque-principal{width:320px;}
	  #turismo .derecha #bloque-principal .wrapper{width:250px}
	  #turismo .derecha #bloque-principal .destinos-lista{column-count: 1; -webkit-coulmn-count: 1; -moz-column-count: 1; }
	  #turismo  #bloques-institucional{width: 190px; margin: 0 auto; margin-top: 15px}
	  
	  #beneficios{height: 1140px; margin-top: 10px; width: 100%}
	  #beneficios .izquierda{background-position: 80px -8px; background-size: 321px 87px;}
	  #beneficios .contenedor-azul{margin: 0 auto; width: 100%; background-size: 100%}
	  #beneficios .caja-objetivo{ margin: 0 auto; padding-right: 40px;}
	  #beneficios .caja-info{ margin: 0 auto}
	  #beneficios .derecha{ width: 100%;display: block;}
	  #beneficios .derecha #bloques-institucional{ margin-top: 20px; width: 100%}
	  #beneficios .derecha #bloque-principal{width: 100%}
	  #beneficios #bloques-institucional{padding-left: 20px}
	  #beneficios{margin-top:-4px}
	  #beneficios .izquierda { background-image: none}
	  #beneficios .derecha{background-position: center 0px}
	  #beneficios .derecha #bloque-principal ul.lista-beneficios{column-count: 1; -webkit-coulmn-count: 1; -moz-column-count: 1; }
	  #beneficios  .derecha #bloques-institucional{width: 190px; margin: 0 auto; margin-top: 15px}
	  
	  #planes{height: 1000px; margin-top: 10px; width: 100%}
	  #planes .izquierda{width: 310px; margin: 0 auto; display: block}
	  #planes .derecha{margin: 0 auto; display: block;height: 400px}
	  #planes .derecha #bloque-principal{width: 480px; margin: 0 auto; height: 270px}
	  #planes .derecha #bloque-principal .plan{width: 218px; height: 141px; }
	  #planes #bloques-institucional{margin-top:20px}
	  /*#planes .derecha #bloque-principal .plan#plan-1{background-position: -573px -13px}
	  #planes .derecha #bloque-principal .plan#plan-2{margin-left: 118px; background-position: -780px -13px}
	  #planes .derecha #bloque-principal .plan#plan-3{margin-top: 255px; background-position: -573px -141px}
	  #planes .derecha #bloque-principal .plan#plan-4{margin-top: 380px; background-position: -781px -140px}*/
	  #planes .derecha #bloque-principal{width: 320px}
	  #planes .derecha #bloque-principal .plan{ width: 155px; height: 101px; background-size: 740px; }
	  #planes .derecha #bloque-principal .plan#plan-1{background-position: -423px 0px;}
	  #planes .derecha #bloque-principal .plan#plan-2{margin-left: 155px; background-position: -190px 0px}
	  #planes .derecha #bloque-principal .plan#plan-3{background-position: -423px -325px; margin-top: 101px; height: 105px}
	  #planes .derecha #bloque-principal .plan#plan-4{margin-left: 155px; background-position: -580px -105px; margin-top: 101px; height: 105px}
	  #planes  .derecha #bloques-institucional{width: 190px; margin: 0 auto; margin-top: 15px}
	  #planes .derecha #bloque-principal{height: 210px}
	  
	  #cartillas{height: 780px; margin-top: 10px; width: 100%}
	  #cartillas .main, #cartillas .main-content{width:100%}
	  #cartillas .izquierda{width: 100%; height: 350px}
	  #cartillas .izquierda .contenedor-azul{display: block; margin: 0 auto;  background-size: 100%; height: 275px}
	  #cartillas .derecha{width: 480px; display: block; padding-top: 65px; margin: 0 auto; height: 375px}
	  #cartillas .derecha #bloque-principal{width: 480px; margin: 0 auto}
	  #cartillas #bloques-institucional{padding-left: 20px; padding-top: 20px}
	  #cartillas .derecha{width: 320px; height: 370px}
	  #cartillas .derecha #bloque-principal{width: 320px; height: 150px}
	  /*#cartillas .derecha #bloque-principal .cartilla#cart-1{margin-top: 5px; margin-left: 38px; width: 78px; height: 51px;}*/
	  #cartillas .derecha #bloque-principal .cartilla#cart-1{    margin-top: 45px;
    margin-left: 70px;
    width: 88px;
    height: 81px;}	  
	  #cartillas .derecha #bloque-principal .cartilla#cart-2{margin-top: 4px; margin-left: 120px; width: 78px; height: 51px;}
	  #cartillas .derecha #bloque-principal .cartilla#cart-3{margin-top: 4px; margin-left: 200px; width: 78px; height: 51px;}
	  /*#cartillas .derecha #bloque-principal .cartilla#cart-4{margin-top: 79px; margin-left: 78px; width: 78px; height: 51px;}*/
	  #cartillas .derecha #bloque-principal .cartilla#cart-4{    margin-top: 45px;
    margin-left: 161px;
    width: 88px;
    height: 81px;}
	  #cartillas .derecha #bloque-principal .cartilla#cart-5{margin-top: 78px; margin-left: 159px; width: 78px; height: 51px;}
	  #cartillas  .derecha #bloques-institucional{width: 190px; margin: 0 auto; margin-top: 15px}
	  
	  
	  #social{height: 620px}
	  #social .izquierda{height: 155px}
	  #social .izquierda #introduccion{padding-left: 0}
	  #social .izquierda #introduccion h3{width: 320px; padding-left: 0; text-align: center; padding-bottom: 20px; padding-top: 0px;}
	  #social .izquierda #introduccion p{padding-left: 10px; padding-right: 20px; width: 320px}
	  #social .izquierda img{display: none}
	  #social .izquierda #introduccion > a, #social .izquierda #introduccion  #comunicados{display: inline-block; vertical-align: top}
	  #social .izquierda #introduccion  #resumen, #social .izquierda #introduccion  #comunicados{width: 214px; height: 98px; background-size: 100%; }
	  #social .izquierda #introduccion > a{padding-left: 4px}
	  #social .izquierda #introduccion  #comunicados{margin-top: 3px; margin-left: 42px}
	  #social #bloques-institucional{margin-top: 15px; margin-left: 35px}
	  #social .derecha{width: 320px; height: 385px}
	  #social .derecha #home-slider{margin: 0 auto; width: 320px; height: 165px}
	  #social .derecha #home-slider .wrapper{height: 165px}
	  #social .derecha #home-slider .wrapper > div.slide{width: 320px; height: 165px}
	  #social #home-slider .controls{width: 320px; height: 165px}
	  #social .izquierda #introduccion  #resumen, #social .izquierda #introduccion  #comunicados{width:264px; margin: 0 auto; display: block; height: 106px}
	  #social .izquierda{height: 270px}
	  #social .izquierda #introduccion > a{display: block; margin: 0 auto; padding: 0}
	  #social .main .derecha{height: 370px}
	  #social .izquierda #introduccion #comunicados{    background-size: 261px; background-position: 3px 0px;}
	  #social  .derecha #bloques-institucional{width: 190px; margin: 0 auto; margin-top: 15px}
	  
	  #contacto{height: 930px; margin-top: 10px; width: 480px}
	  #contacto .izquierda{width: 480px; margin: 0 auto; display: block; height: 538px}
	  #contacto .izquierda .nombre{width: 480px; margin: 0 auto; margin-top: 240px;}
	  #contacto .izquierda .nombre > *{width: 310px; margin: 0 auto; display: block}
	  #contacto .izquierda .seccion{width: 480px; margin: 0 auto; height: 110px}
	  #contacto .izquierda .seccion > *{width: 310px; margin: 0 auto; display: block}
	  #contacto .izquierda .comentarios{width: 480px; margin: 0 auto;}
	  #contacto .izquierda .comentarios > *{width: 310px; margin: 0 auto; display: block}
	  #contacto .derecha{margin-top: -473px; width: 480px}
	  #contacto .derecha #home-slider{margin: 0 auto}
	  #contacto #bloques-institucional{margin-top: 492px}
	  #contacto {width:320px}
	  #contacto .izquierda {width: 320px}
	  #contacto .izquierda .nombre{width: 320px; margin-top: 165px}
	  #contacto .izquierda .seccion{width: 320px}
	  #contacto .izquierda .comentarios{width: 320px}
	  #contacto .derecha{width: 320px}
	  #contacto .derecha #home-slider{margin-left: 0px; width: 320px; height: 165px}
	  #contacto .derecha #home-slider .wrapper{height: 165px}
	  #contacto .derecha #home-slider .wrapper > div.slide{width: 320px; height: 165px}
	  #contacto #home-slider .controls{width: 320px; height: 165px}
	  #contacto  .derecha #bloques-institucional{width: 190px; margin: 0 auto; margin-top: 500px}
	  
	  #bloques-institucional .bloque-info{height: 55px; width: 195px}
	  #bloques-institucional .bloque-info#atencion{padding-left: 2px}
	  #bloques-institucional div .imagen{width: 195px; }
	  
	  #global_footer{width: 310px; height: 75px; padding-left: 5px; padding-top: 20px}
	  #global_footer #footer_content p{width: 310px}
	}