/* ================================
FONT
================================ */
@import url("../webfonts/Bernardo_Moda/stylesheet.css");
.emo {font-family: 'Noto Color Emoji', sans-serif;}
/* ================================
LOADING
================================ */
#body-loading {
	position:fixed;
	top: 0; 
	left: 0; 
	width: 100%; 
	height: 100%; 
	background-color: #293133; 
	z-index: 1000; 
	transition: opacity 0.2s ease;
}
a {text-decoration: none;}
/* ================================
SIZING
================================ */
.w-20 {width:20%;}
.w-30 {width:30%;}
.w-40 {width:40%;}
.w-60 {width:60%;}
.w-90 {width:90%;}

.h_6 {height: 6vh;}
.h10 {height: 10vh;}
.h50 {height: 50vh;}
.h84 {height: 84vh;}
.h100 {height: 100vh;}

.bg_pink {background-color: pink;}
.bg_lgreen {background-color: lightgreen;}
.bg_gray2 {background-color: var(--bs-gray-200);}
.bg_gray4 {background-color: var(--bs-gray-400);}
.bg_gray6 {background-color: var(--bs-gray-600);}

/** NORMALIZE BOOSTRAP **/
.rex {
	padding-right: 0;
	padding-left: 0;
}
/* ===========================================
TEXT 
=========================================== */
h1.pantalla {
	font-family: "Bernardo Moda";
	letter-spacing: 1px;
	line-height: 1em;
	font-size: 6em;
	color: rgba(255,255,255,1);
	text-align: center;
	text-shadow: 2px 2px 1px rgba(51,51,51,0.9);
}
.tc {text-align: center;}
/* ===========================================
BG-color
=========================================== */
.bg_pink {background-color: pink;}
.bg_lgreen {background-color: lightgreen;}
.bg_gray2 {background-color: var(--bs-gray-200);}
.bg_gray4 {background-color: var(--bs-gray-400);}
.bg_gray6 {background-color: var(--bs-gray-600);}
/* ===========================================
BG-size
=========================================== */
.bgcv {background:/*#fff*/ /*image*/ center center/cover no-repeat /* origin / clip / attachment*/}
.bgcn {background:#fff /*image*/ center center/contain no-repeat /* origin / clip / attachment*/}
.bgct {background:#fff /*image*/ center start/cover no-repeat /* origin / clip / attachment*/}
/* ===========================================
BORDER/SHADOW
=========================================== */
.borbold {border: 9px solid black;}
.brad-50 {border-radius:50%;}
.brad {}
.bbx {
	border: 2px solid black;
}
.brad {
	border-radius: 0% 100% 100% 0%;
	/*top-left + top-right + bottom-right + bottom-left*/
}

/* ===========================================
SHAPE
=========================================== */
#box {
	
}
 #triangle-up {
	width: 0;
	height: 0;
	border-left: 50px solid transparent;
	border-right: 50px solid transparent;
	border-bottom: 100px solid red;
}
.triangle-topleft {
	width: 0;
	height: 0;
	border-top: 100px solid red;
	border-right: 100px solid transparent;
}