:root {
	--tra-red: #d04b1a66;
	--red: #d04b1a;
	--tra-white: #ffffff66;
	--slider_vh: 50vw;
}
.dropdown-menu {
	--bs-dropdown-link-active-bg: #ff000066;
}
body {
	position: relative;
	background-color: #e8e0dd;
	/* background-image:
		repeating-linear-gradient(45deg, rgba(0, 0, 0, 0.01) 0px,
		rgba(0, 0, 0, 0.01) 20px,
		transparent 20px,
		transparent 60px),
		repeating-linear-gradient(-45deg, rgba(0, 0, 0, 0.01) 10px,
			rgba(0, 0, 0, 0.01) 20px,
			transparent 20px,
			transparent 60px
		); */
	background-blend-mode: multiply;
	background-repeat: repeat;
	background-size: auto;
}

body::before {
	content: "";
	position: fixed;
	inset: 0;
	background: url(/assets/imgs/bg-t.png) center no-repeat;
	background-size: cover;
	opacity: 0.05;
	pointer-events: none;
	z-index: 0;
}
.navbar::before {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	margin: 0 auto;
	content: "";
	background-color: var(--tra-red);
	height: 2px;
	transition: all 0.5s;
	z-index: -1;
}
.navbar-nav .nav-item a {
	color: var(--tra-red) !important
}
.navbar-nav .nav-item a.active, .navbar-nav .nav-item:hover a {
	color: var(--red) !important;
}
.navbar-nav .nav-item a::before {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	margin: 0 auto;
	content: "";
	border: 0;
	background-color: var(--red);
	width: 0%;
	height: 2px;
	transition: all 0.5s;
}
.navbar-nav .nav-item a.active::before, .navbar-nav .nav-item:hover a::before {
	width: 100%;
	font-weight: bold;
	height: 3px;
}
.logo {
    height: 77px;
    position: absolute;
    top: 8px;
    right: 37px;
	z-index: 9;
}
.text-red {
	color: var(--red) !important;
}
/* @media screen and (max-width: 991px) {
	.navbar-collapse {
		position: absolute;
        top: 100%;
        background: #e8e0dd;
        width: calc(100% - 40px);
        padding: 10px 20px;
        margin: 5px 0;
		border: 1px solid var(--red);
        border-radius: 7px;
        z-index: 9;
        transition: 0.1s all;
	}
} */

.falling_grains {
	position: fixed;
	top: 0;
	right: 0;
	width: 40vw;
	height: 100%;
	pointer-events: none;
	z-index: 1;
	overflow: hidden;
	opacity: 0.7;
}
.slow {
	transition: all 0.3s ease-in-out;
}
.category:hover img, .big {
	transform: scale(1.2);
}
.bg-tra-white {
	background-color: var(--tra-white);
}
.bg-tra-red {
	background-color: var(--tra-red) !important;
	color: var(--red);
}
.bg-red, .btn.bg-tra-red:hover {
	background-color: var(--red) !important;
	color: #ffffff;
}
.rotating {
	animation: rotating 10s linear infinite;
}
@keyframes rotating {
	from {
	  transform: rotate(0deg);
	}
	to {
	  transform: rotate(360deg);
	}
}
#contact .info-item {
	color: var(--tra-red);
	text-decoration: none;
}
#contact a i {
	color: var(--red);
	border: 1px dashed;
	border-color: transparent;
	border-radius: 50%;
	transition: all 0.3s ease-in-out;
	width: 60px;
	height: 60px;
	text-align: center;
	padding: 12px;
	font-size: 30px;
}
#contact a:hover {
	color: var(--red);
}
#contact a:hover i {
	border-color: var(--red);
	transform: scale(1.2);
}
.form-control:focus {
	border: 1px solid transparent;
	box-shadow: 0 0 0 0.2rem rgba(255, 0, 0, 0.25);
	
}
.social-links a:hover i {
	transform: scale(1.2);
}
.footer {
	color: var(--red);
}
.about-hand {
	position: absolute;
	width: 20%;
	right: 6%;
  	top: 37.5%;
	transition: 0.3s all;
	transform-origin: 10% 90%;
	animation: rotating-hand 1s linear infinite;
}
@keyframes rotating-hand {
	0% {
		transform: rotate(0deg);
	}
	25% {
		transform: rotate(-15deg);
	}
	50% {
		transform: rotate(0deg);
	}
	75% {
		transform: rotate(15deg);
	}
	100% {
		transform: rotate(0deg);
	}
}

.mh-40vh {
	max-height: 40vh !important;
}
.mw-50 {
	max-width: 50% !important;
}