/*Variables*/
:root {
	--my-yellow: #C58C35;
	--my-white: #f4ece9;
	--my-purple: #2F2941;

	--my-hover-yellow: #C58C35c2;
	--my-hover-white: #f4ece9c2;
	--my-hover-purple: #2F2941c2;
}

.bg-my-yellow {
	background-color: var(--my-yellow);
}

.bg-my-white {
	background-color: var(--my-white);
}

.bg-my-purple {
	background-color: var(--my-purple);
}

.btn.bg-my-purple:hover {
	background-color: var(--my-purple);
	color: var(--my-yellow) !important;
}

.color-my-yellow {
	color: var(--my-yellow);
}

.color-my-white {
	color: var(--my-white);
}

.color-my-purple {
	color: var(--my-purple);
}

footer a.color-my-yellow:hover {
	color: #fff;
}

.hover-color-yellow:hover {
	background-color: var(--my-yellow);
	border-color: var(--my-yellow);
	color: var(--my-yellow);
}
.hover-color-white:hover {
	background-color: var(--my-white);
	border-color: var(--my-white);
	color: var(--my-white);
}
.hover-color-purple:hover {
	background-color: var(--my-purple);
	border-color: var(--my-purple);
	color: var(--my-purple);
}


/* LOADER */
.loader {
	display: none;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	z-index: 999999999;
}

.loader_box {
	margin: auto;
	text-align: center;
	color: #ffffff;
	font-weight: 500;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5);
}

.loader_box_animation {
	width : 65px;
	height: 65px;
	border-radius: 50%;
	display: inline-block;
	border-top:3px solid #fff;
	border-right:3px solid transparent;
	animation: rotation 1s linear infinite;
}

.loader_box_title {
	margin-top: 15px;
	font-weight: 600;
	color: #FFF;
}

@keyframes rotation {
	0% { transform: rotate(0deg) }
	100% { transform: rotate(360deg) }
}