base.css

/* ===========================
 * BASE
** =========================== */

* {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	color: #5f646a;
	font: 500 18px/1.4 "Prx Nova";
	vertical-align: baseline;
	border: none;
}

section[class*="s-"] {
	padding-top: 75px;
	padding-bottom: 75px;
}

*::selection {
	/*background: #fff35f;*/
}

ol,
ul,
p {
	list-style-type: none;
	margin: 0;
}

a {
	color: inherit;
	text-decoration: none;
}


/* SITE SPECIFIC
   ============= */

.headline-1,
.headline-2,
.headline-3,
.headline-4 {
}

.headline-1 {
}

.headline-2 {
}

.headline-3 {
}

.headline-4 {
}

.text-2 {
}

.text-3 {
}

.btn,
.button {
}

.btn:hover,
.button:hover {
}


/* PRELOADER
   ========= */

.preloader {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: #fff;
	z-index: 3;
}

.preloader .spinner {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.preloader img {
	animation: preloader 1s;
}

@keyframes preloader {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}


/* ===========================
 * FONTS
** =========================== */


/* ===========================
 * GRID
** =========================== */

.container {
	width: 1200px;
	padding-left: 15px;
	padding-right: 15px;
	margin: auto;
}
@media (max-width: 1200px) {
	.container {
		width: 900px;
	}
}
@media (max-width: 900px) {
	.container {
		width: 720px;
	}
}
@media (max-width: 720px) {
	.container {
		width: 540px;
	}
}
@media (max-width: 540px) {
	.container {
		width: 100%;
	}
}

.container-sm {
	width: 900px;
	padding-left: 15px;
	padding-right: 15px;
	margin: auto;
	box-sizing: border-box;
}
@media (max-width: 1200px) {
	.container-sm {
		width: 720px;
	}
}
@media (max-width: 900px) {
	.container-sm {
		width: 720px;
	}
}
@media (max-width: 720px) {
	.container-sm {
		width: 540px;
	}
}
@media (max-width: 540px) {
	.container-sm {
		width: 100%;
	}
}