.page-loader {
	position: fixed;
	width: 100%;
	height: 100vh;
	overflow: hidden;
	z-index: 999999;
	background-color: #f8f7f2;
	top: 0;
	visibility: visible;
	opacity: 1;
	transition: all .5s;
}

.page-loader:before {
	content: "";
	position: absolute;
	top: calc(50% - 60px);
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 60px;
	height: 60px;
	background-color: transparent;
	border-left: 6px solid #d52b1e;
	border-radius: 50%;
	animation: rotacion 1s infinite linear;
}

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

.page-loader.loaded {
	visibility: hidden;
	opacity: 0;
}


@media only screen and (max-width: 480px) {
	.page-loader:before {
	    border-left: 4px solid #d52b1e;
	    width: 37px;
	    height: 37px;
	    top: calc(50% - 37px);
	}
}
@media only screen and (min-width: 481px) and (max-width: 599px) {
	.page-loader:before {
	    border-left: 4px solid #d52b1e;
	    width: 37px;
	    height: 37px;
	    top: calc(50% - 37px);
	}
}
@media only screen and (min-width: 600px) and (max-width: 767px) {
	.page-loader:before {
	    border-left: 4px solid #d52b1e;
	    width: 42px;
	    height: 42px;
	    top: calc(50% - 42px);
	}
}
@media only screen and (min-width: 768px) and (max-width: 979px) {
	.page-loader:before {
	    border-left: 4px solid #d52b1e;
	    width: 42px;
	    height: 42px;
	    top: calc(50% - 42px);
	}
}
@media only screen and (min-width: 980px) and (max-width: 1099px) {
	.page-loader:before {
	    border-left: 4px solid #d52b1e;
	    width: 42px;
	    height: 42px;
	    top: calc(50% - 42px);
	}
}
@media only screen and (min-width: 1100px) and (max-width: 1199px) {
	.page-loader:before {
	    border-left: 4px solid #d52b1e;
	    width: 42px;
	    height: 42px;
	    top: calc(50% - 42px);
	}
}
@media only screen and (min-width: 1200px) and (max-width: 1299px) {
	.page-loader:before {
	    border-left: 4px solid #d52b1e;
	    width: 42px;
	    height: 42px;
	    top: calc(50% - 42px);
	}
}
@media only screen and (min-width: 1300px) and (max-width: 1399px) {
	.page-loader:before {
	    border-left: 4px solid #d52b1e;
	    width: 45px;
	    height: 45px;
	    top: calc(50% - 45px);
	}
}
@media only screen and (min-width: 1400px) and (max-width: 1499px) {
	.page-loader:before {
	    border-left: 5px solid #d52b1e;
	    width: 50px;
	    height: 50px;
	    top: calc(50% - 50px);
	}
}
@media only screen and (min-width: 1500px) and (max-width: 1599px) {
	.page-loader:before {
	    border-left: 5px solid #d52b1e;
	    width: 50px;
	    height: 50px;
	    top: calc(50% - 50px);
	}
}
@media only screen and (min-width: 1600px) and (max-width: 1699px) {
	.page-loader:before {
	    border-left: 5px solid #d52b1e;
	    width: 55px;
	    height: 55px;
	    top: calc(50% - 55px);
	}
}
@media only screen and (min-width: 1700px) and (max-width: 1799px) {
	.page-loader:before {
	    border-left: 5px solid #d52b1e;
	    width: 55px;
	    height: 55px;
	    top: calc(50% - 55px);
	}
}
@media only screen and (min-width: 1800px) and (max-width: 1899px) {
	.page-loader:before {
	    border-left: 5px solid #d52b1e;
	    width: 55px;
	    height: 55px;
	    top: calc(50% - 55px);
	}
}