div {
	border-radius: 5px;
}

#wraper {
	
}

#pageTop {
	text-decoration: none;
}

body {
	padding-top: 70px;
	color: #333;
}

body div h1 {
	margin-left: 0.0em;
  margin-bottom: 0.5em;
  margin-top:0;
}

.admin_body {
	padding-top: 150px;
}

.btn:focus,
.btn:active,
.btn.active {
    outline: 0;
}

.scroll-top {
    z-index: 1049;
    position: fixed;
    right: 2%;
    bottom: 2%;
    width: 50px;
    height: 50px;
}

.scroll-top .btn {
    width: 50px;
    height: 50px;
    border-radius: 100%;
    font-size: 20px;
    line-height: 28px;
}

.scroll-top .btn:focus {
    outline: 0;
}
#form {
	margin-left: 10px;
}

li {
	list-style-type: square;
}

a:hover {
	font-style: none;
}

img { border: none; padding: 0px; }

div .message { border: 1px solid #dddddd; /*era #8D0D19*/
	color: #333; font-weight: normal; /*era #8D0D19*/
	margin: 1em 0; padding: 9px; }

div .message-fondo-wwhatsapp{ border: 0px ; /*clon del essage anterior*/
	color: #333; font-weight: bold;
  background-color: #e1dad2;
	margin-bottom: 0em; padding: 0px; }

div .message-fondo-facebook{ border: 0px ; /*clon del essage anterior*/
	color: #333; font-weight: bold;
  background-color: #ffffff;
	margin-bottom: 0em; padding: 0px; }

div .message-whatsapp { border: 0px ; /*clon del essage anterior*/
background-image: url("https://www.mediosyarte.com/assets/img/mensaje_whatsapp.svg");
background-repeat: no-repeat, repeat;
margin: 0.0em; padding: 9px; }

div .message-facebook { border: 0px ; /*clon del essage anterior*/
background-image: url("https://www.mediosyarte.com/assets/img/mensaje_facebook.svg");
background-repeat: no-repeat, repeat;
margin-top: 0.5em; padding: 9px; }

div .message_verde_whatsapp{ border: 0px ; /*clon del essage anterior*/
background-color: #00855b;
background-image: url("https://www.mediosyarte.com/assets/img/hernando.png");
background-repeat: no-repeat;
background-size: contain;
margin-top: 0em ; padding: 9px;
text-align:right;}

div .message_azul_facebook{ /*clon del essage anterior*/
background-color: #ffffff;
background-image: url("https://www.mediosyarte.com/assets/img/hernando.png");
background-repeat: no-repeat;
background-size: contain;
margin-top: 0em ; padding: 9px;
text-align:right;
border-bottom: solid 1px ;
border-radius: 0px;}

/* start text and image content*/
  .navbar-fixed-top{
    background-color: Black; /* era rey #e8e8e8 lo puse black */
    }
	
/* end text and image content*/	



#pagination .selected { font-weight: bold; color: #8D0D19; }

#footer {
    position: relative;
    height: auto; /* Permite que el footer se ajuste automáticamente al contenido */
    background-color: #e8e8e8; /* Fondo gris */
    color: #4d4d4d; /* Gris más oscuro para el texto */
    padding: 20px 0; /* Espaciado superior e inferior */
    text-align: center;
    font-family: Verdana, sans-serif;
    margin-top: 1em;
}

.footer-content {
    max-width: 1200px; /* Ancho máximo del contenido */
    margin: 0 auto; /* Centrando el contenido */
    padding: 0 15px; /* Espaciado lateral */
}

#social-follow {
    margin: 10px 0; /* Espacio entre texto y enlaces */
}

#social-follow a {
    color: #4d4d4d; /* Gris más oscuro para los iconos */
    font-size: 20px; /* Tamaño de los iconos */
    margin: 0 10px; /* Espacio entre iconos */
    transition: transform 0.3s; /* Transición para efecto hover */
}

#social-follow a:hover {
    transform: scale(1.2); /* Efecto de aumento al pasar el mouse */
    color: #333; /* Cambio de color al hacer hover */
}

.location {
    font-size: 12px; /* Tamaño de fuente más pequeño para la ubicación */
    margin-top: 10px; /* Espacio arriba */
}



/* start text and image content*/
  .frame-columns{
    display:block;
    margin: 0; /*era 0 0 40px*/	
	/*border:solid red;*/
    }
	
/* end text and image content*/	


/* start Grids */	
  .column_3 {
    width: 50%; 
    float: left;
	display: block;
  }
  .column_3,
  .column_4,
  .column_6,
  .column_9,
  .column_12 {
    margin-bottom:0px;/*era 40*/
	/*positioning and padding*/
	position: relative;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px;
	text-align:center;
  }
.barrai {
    float: left;
    font-size: 18px;
    margin-left: 1em;
    font-weight: bold;
    padding-top: 0.8em;
    color: white; /* Color del texto del párrafo */
}

.barrai a {
    color: white; /* Color del enlace */
    text-decoration: none; /* Sin subrayado */
}

.barrai a:visited {
    color: white; /* Color del enlace visitado */
}

.barrai a:active {
    color: white; /* Color del enlace activo */
}

  .icono {
float: left;
font-size: 18px;
margin-left: 1em;
margin-top: 0.3em;
margin-bottom: 0.3em;
font-weight: bold;
padding-top:0.0em;
  }


.notai {
float: right;
font-size: 12px;
margin-right: 1.4em;
font-weight: bold;
padding-top:1.4em;
  }
.v-container {
	position: relative;
	padding-bottom: 52.5%; /* proporci贸n 16:9 era 56.25%*/
	padding-top: 0px;/* era 25px*/
	height: 0;
}

.v-container iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* start estilo falso video con capas*/

.thumbnail {
    position: relative; /* Asegura que los elementos hijos se posicionen relativamente a este contenedor */
    display: inline-block; /* Ajusta según sea necesario para tu diseño */
}

.thumbnail img {
    display: block; /* Elimina el espacio extra debajo de la imagen */
    width: 100%; /* Asegura que la imagen principal se ajuste al contenedor */
    height: auto; /* Mantiene la proporción de la imagen principal */
}

.overlay-background {
    position: absolute;
    top: 9px; /* Alinea la capa 9px desde la parte superior */
    left: 9px; /* Alinea la capa 9px desde la parte izquierda */
    right: 9px; /* Alinea la capa 9px desde la parte derecha */
    bottom: 9px; /* Alinea la capa 9px desde la parte inferior */
    background-color: rgba(0, 0, 0, 0.5); /* Capa negra con 50% de opacidad */
    z-index: 5; /* Coloca la capa debajo del SVG pero encima de la imagen */
}

.overlay-svg {
    position: absolute; /* Cambia a absolute para alinear sobre el contenedor */
    bottom: 0; /* Alinea el SVG al borde inferior del contenedor */
    left: 0;
    padding: 9px;
    width: 100%; /* Ajusta el tamaño del SVG para que cubra toda el área del contenedor */
    height: auto; /* Ajusta el tamaño del SVG para que mantenga su proporción */
    pointer-events: none; /* Evita que el SVG interfiera con los eventos del ratón */
    z-index: 10; /* Asegura que el SVG esté por encima de la capa de color */
}

/* end estilo falso video con capas*/

/* textrto sobre iconos en index*/
        
.text-overlay {
    position: absolute;
    top: 75%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: black;
    text-align: center;
    text-transform: uppercase;
    font-size: 14px; /* Ajusta según sea necesario */
}
.figure{}
.figure-caption {
    font-size: 0.2 em; /* Ajusta según sea necesario */
    font-style: italic;
    text-align: right;
}
/* Controlar padding de TODAS las columnas Bootstrap */
[class*="col-"] {
  padding-left: 6px !important;
  padding-right: 6px !important;
}