@charset "utf-8";
/* CSS Document */

* {
	margin: 0px;
	padding: 0px;
	-webkit-box-sizing:  border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

body {
	background: url(../imagenes/fondobr.jpg) #000;
	/*background: rgba(0, 128, 128);*/
	background-size: cover;
	color: #fff;
	font-size: 16px;
}

.borde{
	border: 2px solid #999999;
	text-align: center;
	padding: 8px;
}

.wrap {
	width: 90%;
	max-width: 1000px;
	/*margin: auto;*/
}

.widget {
	/*width: 40%;*/
	/*margin: 1em;*/
	margin:  8px;
}

.bordeRedondo{
	/*border: 2px solid #e6b800;*/
	/*border: 2px solid #006600;*/
	border-radius: 20px;
	text-align: center;
	padding: 8px;
}


.widget p {
	display: inline-block;
	line-height: 1em;
}

.fecha {
	font-family: Oswald, Arial;
	text-align: center;
	font-size: 1em;
	margin-bottom: 0.3125rem;
	/*maring-bottom:  5px;*/
	background: rgba(0,0,0,0.5);
	padding: 16px;
	width: 100%;
}

.reloj {
	font-family: Oswald, Arial;
	width: 100%;
	padding: 8px;
	font-size: 2em;
	text-align: center;
	background: rgba(0, 0, 0, 0.5);
}

h1 {
    font-family: Oswald, Arial;
	width: 100%;
	padding: 5px;
	font-size: 2em;
	text-align: center;
	background: rgba(0, 0, 0, 0.5);
}

h4 {
    font-family: Oswald, Arial;
	width: 100%;
	padding: 5px;
	font-size: 16px;
	text-align: center;
	color: black;
}

th {
    font-family: Oswald, Arial;
    font-size: 1.5em;
	text-align: center;
	color: white;
}

.th2 {
    font-family: Oswald, Arial;
    font-size: 16px;
	text-align: center;
	color: black;
	padding: 0px;
}

h2 {
    font-family: Oswald, Arial;
    font-size: 18px;
	text-align: center;
	color: black;
	padding: 0px;
	font-weight: bold;
}

.tituloTabla{
    font-family: Oswald, Arial;
    font-size: 1.5em;
	text-align: left;
	color: white;
}

.negro {
    color: black;
    text-align: right;
}

td {
    font-family: Oswald, Arial;
    font-size: 1.2em;
	text-align: center;
	color: black;
}

.conttabla {
    font-family: Oswald, Arial;
    font-size: 1.2em;
	text-align: left;
	color: black;
}

.reloj .caja-segundos {
	display: inline-block;
}

.reloj .segundos,
.reloj .ampm {
	font-size: 1rem;
	display: block;
}

.alinearLabel{
	text-align: right;
}

.alinearIzquierda{
	text-align: left;
}

.alinearLabelIzq{
	text-align: left;
}

.tituloTabla{
	text-align: center;
	font-family: Oswald, Arial;
    font-size: 13px;
	text-align: center;
	color: black;
}

.tituloPrecio{
	text-align: center;
	font-family: Oswald, Arial;
    font-size: 13px;
	text-align: right;
	color: black;
}

.alinearTabla {
	text-align: right;
}

.margenSuperior{
	margin-top: 30px;
}




.image-container {
    /* Establece el contexto de posicionamiento para los elementos internos */
    position: relative; 
    /* Asegura que el contenedor tome el ancho completo de la columna de Bootstrap */
    width: 100%;
    padding: 10px;
}

.image-container .img-responsive {
    /* Asegura que la imagen sea responsive y ocupe todo el contenedor */
    width: 100%;
    height: auto;
}

.text-overlay {
    /* Posiciona el texto absolutamente dentro del contenedor */
    position: absolute; 
    /* Ejemplo: para colocar el texto en el centro inferior */
    bottom: 20px; 
    left: 50%;
    transform: translate(-50%, 0); /* Centra horizontalmente */
    
    /* Estilos adicionales para el texto (color, fondo, padding) */
    color: white; 
    background-color: rgba(0, 0, 0, 0.6); /* Fondo semi-transparente para legibilidad */
    padding: 10px;
    text-align: center;
    width: 80%; /* Ajusta el ancho del contenedor de texto */
}