*{padding: 0;margin: 0;box-sizing: border-box;}
html{scroll-behavior:smooth;}
@font-face{ font-family: patua; src:url(../font/patua.ttf);}
@font-face{ font-family: roboto; src:url(../font/roboto.ttf);}
ul,ol{list-style: none;}a{text-decoration: none;}
h1,h2,h3,h4,h5,h6{font-family: patua;color: #2A2B44;}
p,span{font-family: roboto, tahoma;}

 h1 {
            text-align: center;
 }
 
.header_fondo{width: 100%;min-height: 233px;}

.header{width: 100%;background: linear-gradient(to bottom, #D2B48C, #FFF8DC);}



.logo{width: 100%;display: block;text-align: center;height: 180px;
	display: table;}
.logo_texto{display: table-cell;vertical-align: middle;}
.logo_texto h2 a{color: #faabf5 ;}
.logo_texto h2 a:hover{color:  #fbdcc8 ;}
.menu{width: 100%;
	border-top: solid 1px #e8e8e8;
	border-bottom: 4px solid #fafafa;
	height: 53px;
	box-shadow: 0 1px 3px rgba(0,0,0,.1);
	background-color: #fff;
}
.menu_nav{
	margin: auto;max-width: 1100px;width: 95%;
}
.menu_nav ul{}
.menu_nav ul li{float: left;position: relative;}
.menu_nav ul li a{
	border-left: 1px solid #e8e8e8;padding: 0 15px;font-family: patua;
	line-height: 53px;display: inline-block;position: relative;font-size:14px;
	text-transform: uppercase;color: #222;
}
.menu_nav> ul >li:last-child{
	line-height: 48px;
	border-right:1px solid #e8e8e8;
}
.ul_right{float: right;}
.ul_right li{
	line-height: 48px;
}
.ul_right li input{padding: 5px;
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
}

.menu_nav ul li a span{
    display: none;
    position: absolute;
    width: 100%;
    left: 0;
    height: 3px;
    transition: all 2s ease;
}

.menu_nav ul li a:hover,
.menu_nav ul li a:focus, /* Añadimos :focus para cuando el enlace esté seleccionado */
.menu_nav ul li a:active { /* Añadimos :active para cuando se haga clic en el enlace */
    color: #ea4848;
    font-weight: bold; /* Opcional para enfatizar el negrita en hover */
}

.menu_nav ul li a:active {
    color: #ea4848; /* Mantén el color rojo cuando el enlace esté activo */
}
.nav a.active {
    color: #ea4848; /* Color rojo */
    font-weight: bold; /* Opcional, para hacer el texto en negrita */
	font-size: 120%; /* Aumenta el tamaño de la fuente un 20% */
}
.ul_right{position: relative;}
.ul_right li input[type="text"]{
	padding: 7px;position: relative;
	border: 1px solid #e8e8e8;
	border-radius: 3px;
}
.ul_right li input[type="submit"]{
	position: absolute;height: 30px;
	right: 0;margin-top: 10px;
	border: 1px solid #e8e8e8;
}
.resulbuscar{margin:0 0 3% 3%;background: #fff;border-radius:4px;padding: 2%;
box-shadow: 0 1px 2px rgba(0,0,0,.2);border: 1px solid #e8e8e8;}
.menu_nav label{display: none;}
.menu_nav input[type="checkbox"]{display: none;}
.movil{display: none;}

/* --- Clase que agregaremos cuando el usuario haga scroll --- */
.menu-fixed {
	position:fixed;
	z-index:1000;
	top:0;
	/*max-width:1000px;*/
	left:0;
	width:100%;
	box-shadow:0px 4px 3px rgba(0,0,0,.2);
}
.subitem{
	display: none;
	position: absolute;
	top: 52px; background: #222;
	padding: 10px;z-index:1000;
    min-width: 250px;
    border-radius: 0 0 3px 3px;overflow: hidden;
}
.subitem ul li{display: block;width: 100%;border-right:none;}
.subitem ul li a{
	display: block;
	background: #333;
    border-radius: 2px;
    margin-bottom: 2px;
    line-height: 35px;text-transform: none;
    border: 0;color:#ccc;font-family: roboto,arial;
    transition: all .2s ;
}
.subitem ul li a:hover{color: #ea4848;}
.menu_nav ul li:hover .subitem{display: block;}


.footer {
  width: 100%;
  background-color:  #0f1824  ; /* Fondo negro */
  color: #fff; /* Color de texto blanco */
  text-align: center;
  box-sizing: border-box;
  padding: 10px 0; /* Espaciado superior e inferior */
}

.footer-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 20px; /* Espaciado interno horizontal */
}

.footer p {
  margin: 0; /* Eliminar márgenes por defecto */
  line-height: 70px; /* Alineación vertical de los textos */
}

.footer .left {
  text-align: left;
}

.footer .right {
  text-align: right;
}




.header_top{width: 100%;background:#fff;overflow:hidden;height: 45px;border-bottom:1px solid #e8e8e8;}
.htop{max-width:1100px;width:95%;margin: auto;color: #e3e3e3;}
.login_top {float: left;}
.login_top li{display: inline-block;}
.login_top li a {
    display: block;
    padding: 10px 0;
    color: #c0c0c0;
    font-family: roboto;
    font-size: 16px;
    font-weight: bold; /* Agregado para negrita */
}
.login_top li a:hover {
    color: #ea4848;
    font-weight: bold; /* Opcional para enfatizar negrita en hover */
}

.socializa {
  float: right;
}

.socializa li {
  display: inline-block;
  transition: transform 0.3s ease;
}

.socializa li a {
  display: block;
  padding: 0;  /* Elimina el padding */
  background: none;  /* Elimina el fondo negro */
  border-radius: 0;  /* Elimina el borde redondeado */
  width: 25x;
  height: 25px;
  margin-top: 7px;
}

.socializa li:hover {
  transform: scale(1.3);
}

.socializa li a img {
  width: 30px;
  height: 30px;
}

.top_nombre li a{display:inline-block;color: #c0c0c0;line-height: 35px;text-align: right;
font-family:patua;float:right; padding:0 5px;}
.top_nombre li a:hover{color: #ea4848;}
/*  __________________________  */
.contenido{
	width: 100%;
	overflow: hidden;
	background: linear-gradient(to bottom, #D2B48C, #FFF8DC);
	min-height: 800px;
	padding: 30px 0;
}
.contenido_caja{
	max-width: 1100px;
    margin: 20px;
    width: 95%;
    display: flex; /* Utiliza flexbox */
    gap: 20px; /* Espacio entre los elementos */
}

/* Contenido turno de farmacia*/
.contenido_caja1{
	width: auto;   /* El ancho será ajustado automáticamente */
    height: auto;  /* La altura se ajustará al contenido */
    margin: 20px;
 
   
}





.categoria{width: 30%;height:30%;float: left; background: #fff;
border: 1px solid #e8e8e8;border-radius:4px ;
box-shadow: 0 1px 2px rgba(0,0,0,.2);}
.categoria > .img{width: 90%;overflow: hidden;margin:5% auto ;}
.categoria > .img img{width: 100%;}
.categoria >.texto{background: #fff;height: auto;}

}
.categorias{width: 90%;margin: 0 auto;
	min-height: 200px;}
.categorias h3{margin-bottom: 20px;border-bottom:1px solid #e8e8e8;
padding-bottom: 10px;}
.categorias ul li{border-bottom:1px solid #f5f5f5;}
.categorias ul li a{padding:15px 0;display: block;
color:#606267;font-family:arial;font-weight:100;}
.categorias ul li a span{background:#ea4848;padding: 4px;
border-radius: 3px;color:#fff;font-size: 12px;float: right;}

.socializa_i {
  float: left;
}

.socializa_i li  {
  display: inline-block;
  transition: transform 0.3s ease;
}

.socializa_i li a {
  display: block;
  padding: 0;  
  background: none;  
  border-radius: 0;  
  width: 25x;
  height: 25px;
  margin-top: -20px;
  margin-left: 5px;
 
}

.socializa_i li:hover {
   margin-bottom: 35px;
  transform: scale(1.3);
}

.socializa_i li a img {
  width: 30px;
  height: 30px;
}

.articulos{
	width: 70%;float: left;
	overflow: hidden;
}
.columna{
	width: 47%;
	overflow: hidden;
	float: left;
	background:#fff;
	margin-left: 3%;
	margin-bottom: 3%;
	border: 1px solid #e8e8e8;
	border-radius:4px;
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
	position: relative;
}
.columna>.img{width: 90%;overflow: hidden;margin:5% auto ;height:200px;}
.columna > .img img{width: 100%;}
.texto{
	width: 100%;overflow: hidden;
	padding:5% 5% 5% 5%;
	background: #f5f5f5;
	color: #606267;
	height: 200px;
	position: relative;
	font-family: patua;
	text-overflow: ellipsis;
    color: #45465a;
}
.tituloindex{width: 97%;overflow: hidden;padding:5%;}
.texto h2{}
.texto p{
	text-overflow: ellipsis;
	color:#45465a;

}
.texto h2{font-size: 22px;margin-bottom: 10px;}
.texto a:hover h2{color:#ea4848;}
.entrar{
	position: absolute;
	background:#f3f3f3;
	bottom: 0;
	width: 100%;left: 0;
	height: 40px;
	padding: 10px;

}
.entrar a{line-height: 20px;display: inline-block;color:#7a7a7a;font-family: patua;transition: .2s;}
.entrar a:hover{color:#ea4848;}
.ver_r{float: right;}


.single_categoria{float: right;}
.single_articulo{float: left;width: 67%;background: #fff;margin: 0;}
.single_comlumna{width: 100%;margin:0;}
.single_head{padding:8% 5%;position: relative;}
.single_head h1{color: #222;margin-bottom: 10px;}
.single_head p {color: #000;}
.single_head span {position: absolute;right: 20px;top: 50%;color:#ea4848;cursor: pointer;}
.single_comlumna .img{width:100%;height:auto; ;margin: 0;}
.single_texto{background:#fff;font-size: 22px; line-height: calc(32.4px);font-family: roboto;}
.single_texto p{font-size: 22px;line-height:calc(32.4px); font-family:roboto;}
.single_texto{height: auto;}
.comparte{width: 100%;}
.comparte h5{    border-top: 1px solid #ddd;display: inline-block;
padding: 20px 0;margin-top: 20px;}
.mapcategoria{background: #fafafa; width: 100%;padding: 50px 0;
	border-top: 1px solid #e8e8e8;border-bottom: 1px solid #e8e8e8;}
.mapcategoria h4{margin-left: 5%;color:#555;}
.mapcategoria h4 span{font-weight: 100;color: #777;padding-left: 10px;}
.comentar{padding:5%;}
.comentar h3{margin-bottom: 20px;}
.comentar p{margin-bottom: 20px;font-size: 12px;}
.comentar textarea{width: 100%;border: 1px solid #e8e8e8;
border-radius: 4px;margin-bottom: 10px;padding:10px;
	max-width: 100%;min-width: 100%;min-height: 140px;
}
.comentar input[type="text"]{
	width: 100%;border: 1px solid #e8e8e8;border-radius: 4px;
	padding: 12px 15px;margin-bottom: 10px;
}
.comentar input[type=submit]{
	padding: 12px 35px;font-size: 15px;
	border-radius:3px;font-family: patua;
	background: #ea4848;
	border: none;color: #fff;
}
.comentar input[type=submit]:hover{background: #e82525;}
.comentar input[type=submit]:focus{border: none;}
.comentar button{
	padding: 12px 35px;font-size: 15px;
	border-radius:3px;font-family: patua;
	background: #ea4848;
	border: none;color: #fff;
}
.comentar button:hover{background: #e82525;}
.comentar button:focus{border: none;}
.comentar form  span{font-family: roboto;}

.paginacion {
	width: 70%;float: right;
	padding-left: 2%;
}
.paginacion ul{
	overflow: hidden;padding: 10px 0;border-radius:4px;}
.paginacion ul li{background: maroon;margin: 2px;float:left;color:#fff;}
.paginacion ul li a{display: block;padding:10px 20px;background: #595959;color:#fff;}
.paginacion ul li a:hover {background: #BB1F35;text-decoration: none;}
.paginacion ul .active {
	background: #BB1F35;
	padding:10px 20px;
}

.paginacion ul .disabled{
	background: #a8a8a8;
	padding:10px 20px;
	cursor: not-allowed;
}

.paginacion ul .disabled:hover {
	background: #a8a8a8;
}
.box_login{width: 100%; overflow: hidden;}
.login_content{max-width:500px;width: 90%;margin:50px auto;padding: 50px;
box-shadow: 0 0 3px silver;}
.login_content h2{margin-bottom: 20px;text-align: center;}
.login_content form input{width: 100%;margin-bottom:3%;padding: 10px;font-family: patua;}
.login_content form input[type="submit"]{font-family: patua;}

.admin_panel a{display: block;background:;margin-bottom: ;padding:10px;
color:#2A2B44;font-family: roboto;}
.admin_articulos{width: 70%;}
.admin_panel a:hover{background: #333;color:#fff;}
.admin_colum{width: 97%;margin-bottom: 10px;}
.admin_article{width: 100%;padding: 1%;}
.admin_article h2{font-family: roboto;}
.admin_article h5{font-family: roboto;font-size: 15px;border-bottom: 1px solid silver;}
.admin_article a{color: #999;font-family: roboto;}
.admin_article a:hover{color:#ea4848;;}
.nuevoa{padding: 3%;}
.nuevoa h2{margin-bottom: 10px;}
.nuevoa form{width: 97%;}
.nuevoa label{width: 100%;font-family: patua;}
.nuevoa input{width: 100%;font-family: patua;padding: 10px;margin-bottom: 10px;}
.nuevoa textarea{max-width: 100%;min-width: 100%;min-height: 200px;padding: 20px;}
.about{background:#fff;max-width:700px;margin:auto;}
.about h1{padding: 50px;}
.about img{width: 100%;}
.about > .texto{background: #fff;font-family: roboto;font-weight: 100;height: auto;
font-size: 18px;}
.h1contacto{padding-bottom:0px;}
.contacto > .texto{padding-top: 0px;}
.texto ul{border: 1px solid silver;background:#f9f9f9;padding: 20px;margin:20px 0;}
.texto form label{width: 100%;display:block;margin: 5px 0;font-family: patua;color: #606267;}
.texto form input{width: 100%;padding: 10px;border:1px solid #e8e8e8;border-radius: 4px;
font-family: patua;color: #606267;}
.texto form textarea{max-width:100%;min-width:100%;min-height:110px;border-color:#e8e8e8;
padding: 10px;border-radius: 4px;font-family: patua;color: #606267;}
.texto form button{padding:10px 20px;margin-top: 10px;font-family: patua;font-size: 18px;}
.txt_categoria{width: 100%;overflow: hidden;}
.txt_categoria select{ width: 90%;padding: 10px;border:1px solid #e8e8e8;border-radius: 4px;
font-family: patua;color: #606267;}
.text_box_cat{width: 50%;float: left;}
.error{border:1px solid #ea4848;padding:5px;background:#FEF0F0;font-family:patua;}
.success{border:1px solid #40990B;padding:5px;background:#E9FEE7;font-family:patua;}
.cat_text{}
.cat_select{}
.cat_new{}
/* _________ */
.comentario_id{width: 100%;border: 1px solid black;overflow: hidden;margin-bottom: 20px;
border-radius: 4px;font-family: patua;border-color:#e8e8e8;}
.comentario_img{width:50px;height:50px;overflow:hidden;float: left;}
.comentario_img img{width: 100%;height:100%;}
.comentario_texto{width: calc(100% - 50px);float: left;padding: 5px;}
.comentario_texto p{font-size: 16px;color: #606267;padding: 15px 0;}
.comentario_id ul{width: 90%;float: right; border-right: none;}
.comentario_texto h6{font-family: roboto;}
.comentario_texto h6 span{font-size: 16px;}
.comentario_texto a{color:#2A2B44;}
.comentario_texto a:hover{color:#ea4848;}
.btn_regenerar{display: block;width: 50%; line-height:34px;
background: #333;color: #fff !important;text-align:center;}
.btn_regenerar:hover{color: #e8e8e8!important; }
.txtmini{min-height: 150px !important;}
.txtmini_{min-height: 50px !important;}
@media screen and (max-width: 768px){
	.menu_nav label{display: inline-block;}
	.menu_nav label img{;width: 40px;height: 40px;overflow: hidden;margin-top: 4px;}
	.nav{display:none;}
	#btn_menu:checked ~ .nav{display: block;float: left;}
	.ul_right{display: none;}
	.movil{display: block;float: right;}
	.nav{background: #fff;overflow:hidden;width:100%;height: 100vh;}
	.nav li{width: 100%;float: none;display: block;}
	.nav li a{width: 100%;border-left: none;}
	.subitem{float: none;display: none;position: relative;top: 0;}
	.nav li:hover .subitem{display: block;}
	.menu_nav ul li a{border: none;}


	.categoria{width: 100%;float: right!important;}
	.articulos{width: 100%;}
	.paginacion{width: 100%;;}
	.columna{width: 100%;margin:20px 0;}
	.single_comlumna{margin: 0;}
	.resulbuscar{margin: 15px 0;}

}




/* ajuste de los box titulo*/
.container {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px; /* Espacio entre los box */
    width: 100%;
    max-width: 1200px; /* Ajusta el ancho máximo para que los box no se rompan */
}

.box {
    width: 200px;
    height: 200px;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center; /* Asegura que el contenido dentro esté centrado */
    border-radius: 10px;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
	margin-top: 20px; /* Ajusta el espacio entre los box y la línea de arriba */
}

.box.middle {
    width: 550px;
    height: 200px;
    position: relative; /* Permite posicionar el título sobre la imagen */
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden; /* Evita que el contenido se desborde */
}

.image-container {
    position: relative;
    width: 100%;
    height: 100%;
	
}

.box.middle img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ajusta la imagen sin deformarla */
    border-radius: 10px; /* Borde redondeado */
}

.box img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ajusta la imagen sin deformarla */
    border-radius: 10px; /* Borde redondeado */
}

.box.middle h1 {
    position: absolute;
    top: 50%; /* Centra verticalmente */
    left: 50%; /* Centra horizontalmente */
    transform: translate(-50%, -50%); /* Ajusta la posición para centrar */
    color: white; /* Color del texto */
    font-size: 2.5rem; /* Aumenta el tamaño del texto */
    font-family: 'Patua', sans-serif; /* Usa la fuente deseada */
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.7); /* Sombra para mejorar la legibilidad */
    white-space: nowrap; /* Asegura que el texto no se rompa en varias líneas */
    width: 90%; /* Ajusta el ancho del título */
    text-align: center; /* Centra el texto dentro del contenedor */
    overflow: hidden; /* Evita que se desborde fuera del box */
}
.box.middlevideo {
    width: 550px;
    height: 200px;
    position: relative; /* Permite posicionar el título sobre la imagen */
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden; /* Evita que el contenido se desborde */
}

/*estilos tiempo*/
.header-info {
            font-family: Arial, sans-serif;
            color: #333;
            text-align: center;
            margin-top: 0px;
        }

        #ciudad {
            font-size: 1.2em;
            font-weight: bold;
        }

        #fecha, #hora, #clima {
            font-size: 1em;
            color: #555;
        }

        #clima {
            font-size: 1.2em;
            font-weight: bold;
        }

        #temperatura {
            font-size: 1.5em;
            color: #333;
			font-weight: bold;
        }

/*estilos video de Berisso*/

