@charset utf-8;
/*
Theme Name: LAURA =
Author: Code by Ricardo Juárez for JIS	
Author URI: https://rjvv.com/
Version: 1.0
License: GNU/GPL Version 2 or later. http://www.gnu.org/licenses/gpl.html
Copyright: (c) 2025 Ricardo Juárez
*/





:root 	{
  --sans: 'Helvetica Neue', Helvetica, Arial, sans-serif;

--small: 12px;
--linesmall: 1.5;
--lssmall: 0%;

--body: 15px;
--linebody: 1;
--lsbody: 0;

	--primary:#000000;
	--contrast: #FFFFFF;

	--pad:25px;
	 --app-height: var(--real100);

}

#logo,
#bg,
#content {
	opacity: 0;
  animation: fade 1.8s ease forwards;
}

@keyframes fade {
  from { opacity: 0; }
  to { opacity: 1; }
}


*{
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
     -webkit-touch-callout: none;
    -webkit-tap-highlight-color: transparent;

}


html, body
{
	overscroll-behavior-block: none;
overscroll-behavior: none;
margin:0;
font-size:100%;
width:100%;
background-color: var(--primary);

     }
     
     	html { margin-top: 0px !important; }
	* html body { margin-top: 0px !important; }
	@media screen and ( max-width: 782px ) {
		html { margin-top: 0px !important; }
		* html body { margin-top: 0px !important; }
	}
	
	


 body {
min-height: 100vh;
margin:0;
-moz-osx-font-smoothing: grayscale; 
text-rendering:geometricPrecision;
-webkit-font-smoothing: antialiased;
color: var(--contrast);
background-color: var(--primary);
transition: background 0.5s ease;
font-family: var(--sans);
  font-size: var(--body);
  line-height: var(--linebody);
  font-weight: 300;
  letter-spacing: var(--lsbody);
  display: flex;
  flex-direction: column;
}


#logo{
	position: fixed;
	width: 100vw;
	padding-top: var(--pad);
	z-index: 2;
top: 0;
left: 0;text-align: center;
}

#bg{
position: fixed;
z-index: 1;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}
#bg img{
	max-width: 90%;
}

#content{
	position: relative;
	z-index: 999;
	display: grid;
	height: 100vh;
	width: 100vw;
	grid-template-columns: repeat(3, 1fr);
	align-items: center;
	justify-content: center;
	text-align: center;
}

#countdown{
	display: flex;
	justify-content: center;
}

@media only screen and (max-width: 768px) {

#content{
	grid-template-columns: repeat(1, 1fr);
}
#bg, #content{
height: var(--real100);
}
body{
	min-height: var(--real100);
}

}



/* Evita seleccionar o arrastrar imágenes */
img {
  user-select: none;
  -webkit-user-drag: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  pointer-events: none;
}

/* Estilo de selección personalizada */
::selection {
  background: #fff;
  color: #000;
}

::-moz-selection {
  background: #fff;
  color: #000;
}