/* ESTILOS PERSONALIZADOS */
html {scroll-behavior: smooth;}

header { 
	background:#2c3e50; 
	color:#fff; 
}
.evitarareza{margin-top:10px;color:#FFF;}/*para que no haga cosas raras en la última fila de imágenes del muro en 'otras' y 'encargos' si dominio frame activada*/

/*Inicio carrusel*/
.cajacarousel{
  background-color:#fff;
  border:2px dashed #ccc; /*border: 1px solid #ccc; */
  padding:10px;
}
.epigrafefotoscarrusel{text-align:center; margin-bottom:-10px; margin-top:-10px;}
/**/

/*editar carousel dentro de otras obras
.carousel-indicators{bottom:-15px;} 
.carousel-indicators li{width:7px; height:7px;}
.carousel-indicators .active {width:8px; height:8px;}
.carousel-caption { bottom: 10px; padding-top: 20px; padding-bottom: 20px;}
*/

/*visualizar bien la cabecera (titulo, barra menú, espacio resto contenidos*/
.menuespaciosup{padding-top:5px;height:75px;background:#ffffff;} /*para crear un fondo blanco enicma del menú que tape los contenidos de la página al usar el scroll 2021*/
.menumargeninf{margin-bottom:65px;} /*45px; para separar menu de contenidos cuando no está en forma hamburguesa 2021*/
.h1modif{font-size:30px;} /*para que permanezca estable tamaño título */
@media (min-width: 768px) {
	.menuespaciosup{padding-top:5px;height:45px;} /*para crear un fondo blanco enicma del menú que tape los contenidos de la página al usar el scroll 2021*/
	.menumargeninf{margin-bottom:95px;} /* para separar menu de contenidos cuando no está en forma hamburguesa 2021*/
}
/**/
#ancl{padding-top: 115px;margin-top: -115px;}/*para que las anclas scrolleen bien con una columna exposiciones*/
@media (min-width: 768px) {
	#ancl{display:none;}/*para que las anclas scrolleen bien con varias collumnas*/
}
/* exposiciones*/
.recuadro_fototext {width:100%; min-height:200px; background-color:#fff; border:1px solid #ccc; margin-top:10px; padding-top:10px; padding-left:10px; padding-right:10px; padding-bottom:-5px;text-align:justify;} /* para recuadro especial mas info bajo fotos expo*/
.marco_tarjeta {border:1px solid #ccc;} /* para recuadro tarjeta marco der expos y recuadro fotos atrapados*/
.marco_tarjetablanc {border:1px solid #fff;} /* para recuadro fotos atrapados*/
.flotaizq_foto{float:left; margin-right:20px;}
.margender{ margin-right:10px;}

@media (min-width: 768px) {
	.divscroll {/*para que scrollee el listado de exposiciones*/
	margin-bottom:10px; /* para dejar un espacio cuando se forman 2 columnas y una debajo por el total del ancho*/
  height: 53em;
 /* overflow-x: hidden;*/
  overflow-y: auto; /*scroll (aparece siempre, habilitado o no)*/
  /*scrollbar-gutter: stable;para personalizar scroll*/
  border: 0px ;
  border:1px solid #25B3C2; /*#D1F8F2;*/
  padding: 3px;/**/
  
}
	.divscroll::-webkit-scrollbar {/*para personalizar scroll*/
  width: 10px;
  height: 10px;
  background-color: #D1F8F2;
}
	.divscroll::-webkit-scrollbar-thumb {/*para personalizar scroll*/
  background-color:  #25B3C2;/*transparent;*/
}
	.divscroll:hover::-webkit-scrollbar-thumb {/*para personalizar scroll*/
  background-color: #1C8793;
}

  /*.divscroll::-webkit-scrollbar-track-piece:decrement {
  background: #ccc;
  border: solid 1px transparent;
}*/
	.divscroll::-webkit-scrollbar-button:vertical:start:decrement {
  background: transparent url(../images/arrow_up.png) no-repeat center center;
  background-color: #eee;
}
 /*	.divscroll::-webkit-scrollbar-button:vertical:end:decrement {
  background: transparent url(../images/arrow_up.png) no-repeat center center;
  background-color: #eee;
}*/
	.divscroll::-webkit-scrollbar-button:vertical:end:increment {
  background: transparent url(../images/arrow_down.png) no-repeat center center;
  background-color: #eee;
}
}
@media (min-width: 992px) {
	.divscroll { height: 50em;}
}
@media (min-width: 1200px) {
	.divscroll { height: 40em;}
}

/*para seccion encargos*/
.cajamuralfotos{
  background-color:#fff;
  border:2px dashed #ccc; /*border: 1px solid #ccc; */
  padding-left:5px;padding-right:5px;padding-top:5px;paddin-bottom:5px; /*para que no deje tanto espacio negro abajo del catálogo*/
  margin-top:-5px;
}
.columnaizq{margin-right:0px;}
.columnader{margin-left:0px;}
.columnader .recuadrogris{width:100%;border:0px solid #ccc;padding:0px;margin-bottom:-15px;margin-top:10px;}
@media (min-width: 768px) {
.linea{width:15px;border-top:1px solid #ccc;margin-top:50px;}
.izq{float:left;width:20%;}
.der{float:right;width:80%;}
.columnaizq{margin-right:-15px;margin-bottom:5px}
.columnader{margin-left:-15px;;}
.columnader .recuadrogris{width:100%;border:1px solid #ccc;padding-left:5px;padding-right:5px;padding-top:5px;paddin-bottom:-5px;} 
}

/**/

/*para fijar arriba la cabecera con todo lo que contenga: título, menú. 
IMPORTANTE definir una capa con esta clase y dentro una contenedor que incluya todos los contenidos que queremos fijar y ajustar al ancho de las secciones para que funcione con todos los navegadores (cuando utilizaba una capa sola capa contenedor fijoarriba no me alineaba bien la cabecera respecto al resto de contenidos en el navegador antiguo de mi tablet samsung)*/
.fijoarriba{
    position: fixed;
	right:0;
	left:0;
	z-index:1030;
	top:0;
}


/*para que dentro de los paneles que contienen las fotos de las obras deje el mismo marge a izquierda y a derecha*/
.margender{padding-right:5px;}

/*para separar contenidos dentro de una columna*/
.margensup{margin-top:10px;}
.margeninf{margin-bottom:10px;}
/*para tabular textos*/
.textos > p {
	text-align:justify;
	text-indent:2em;
}
.textos .pright{text-align:right;}
/**/

/* para organizar texto inmersiones*/
.textos .prestoespecial{text-align:justify;text-indent:0em;margin-top:-10px;} 
/**/

.enlacenoresalt{color:#000; text-decoration:none;}
.azul{color:#25B3C2;}
.turquesa{background-color:#D1F8F2;}
.celeste{background-color:#BEECF3;}/*no usado, muy boito*/
.gris{background-color:#F7F7F7;}/*para fondo columna textos*/
.noborde{border:0;}/*para las obras(thumnails) que no tengan el fondo blanco*/

/*para bordear las tabs en obras*/
.bordeizq {border-left:1px solid #000;}
.bordeinf {border-bottom:1px solid #000;}
.bordeder {border-right:1px solid #000;}
/*Se lo aplico al recuadro de espectadores con las imágenes*/
.recuadro {width:100%; background-color:#fff; border:1px solid #000;}
.recuadromaxancho {max-width:350px; }
.recuadro img{padding-right:20px;}
.paddint{padding-left:10px;padding-right:10px;padding-top:5px;}/*padding dentro de los paneles de obras*/
.paddinf{padding-bottom:10px;}
#obras a img{margin:3px 2px;}
@media (min-width: 768px) {
  #obras a img{margin:5px 4px;}
}
@media (min-width: 992px) {
  #obras a img{margin:5px 5px;}
}
@media (min-width: 1200px) {
  #obras a img{margin:5px 4px;}
}

/* espacio entre secciones cuando se quedan en columna*/
#expodat {margin-top:-15px;}
.inicio {padding-top: 65px;}
.presentacion-section { padding-top: 55px;}
.obras-section {padding-top: 15px;}
.espectadores-section {padding-top: 15px;}
@media(min-width:768px) {
	#expodat {margin-top:0px;}
   .inicio{padding-top: 5px;}
   .presentacion-section {padding-top: 0px;}
   .obras-section {padding-top: 0px;}
   .espectadores-section {padding-top: 0px;}
   .listaexpo-section {padding-top: 0px;}
}


/* campo control spam formularios 2024*/
.clasegform {display:none}


/*enlace sin deco beatriz mateos en el menu*/
#nodecoenlace a, a:hover,
a:focus {
  color:#666;
  text-decoration: none;
}
/*enlace sin deco contacto inicio*/
#nodecoenlaceini a{
  text-decoration: none;
}
#nodecoenlaceini a:hover,
a:focus {
  color:#666;
}