@import 'var.colors';
@import 'var.typo';

@import 'base.globals';

@import 'plugin.icomoon';

@import 'mod.button';
@import 'mod.checkbox-item';
@import 'mod.form-item';
@import 'mod.input';
@import 'mod.overlay';
@import 'mod.accessibility-tab-handler';

@import 'utils.fontscale';
@import 'utils.spacing';
@import 'utils.text';
@import 'utils.flex';
@import 'utils.grid';
@import 'utils.animations';
@import 'utils.colors';

@import 'comp.hero';
@import 'comp.section';
@import 'comp.scrollbar';
@import 'comp.swiper';

.pos-r {
	position: relative;
}
.pos-a {
	position: absolute;
}
.height--100 {
	height: 100%;
}
.width--100 {
	width: 100%;
}
.width--70 {
	width: 70%;
}
.width--60 {
	width: 60%;
}
.width--50 {
	width: 50%;
}
.width--40 {
	width: 40%;
}
.width--30 {
	width: 30%;
}
.section--max-width {
	max-width: 68%;
	width: 100%;
	@media (max-width: 1800px) {
		max-width: 70%;
	}
	@media (max-width: 1700px) {
		max-width: 75%;
	}
	@media (max-width: 1600px) {
		max-width: 80%;
	}
	@media (max-width: 1500px) {
		max-width: 85%;
	}
	@media (max-width: 1400px) {
		max-width: 90%;
	}
	// @media (max-width: 1300px) {
	// 	max-width: 90%;
	// }
	@media (max-width: 600px) {
		max-width: 100%;
		padding-left: 16px;
		padding-right: 16px;
	}
}
.ff-roboto {
	font-family: $ff-sans;
}
.ff-roboto-slab {
	font-family: $ff-serif;
}
.ff-roboto-condensed {
	font-family: $ff-roboto-condensed-sans;
}
.fw-l {
	font-weight: $fw-light;
}
.fw-n {
	font-weight: $fw-normal;
}
.fw-b {
	font-weight: $fw-bold;
}
.pointer {
	cursor: pointer;
}
.bg-col-tertiary-opacity {
	background-color: $tertiary-color;
}
.bg-col-primary {
	background-color: $primary-color;
}
.bg-col-gray {
	background-color: #eaeaea;
}

.txt-col-secondary {
	color: $secondary-color;
}
.txt-col-tertiary {
	color: $tertiary-color;
}
.txt-col-quaternary {
	color: $quaternary-color;
}
.txt-col-quinary {
	color: $quinary-color;
}
.txt-col-senary {
	color: $senary-color;
}
.txt-col-nonary {
	color: $nonary-color;
}
.txt-col-denary {
	color: $denary-color;
}

.showOn--1100 {
	display: none;
}
@media (max-width: 1100px) {
	.showOn--1100 {
		display: flex;
	}
	.hideOn--1100 {
		display: none;
	}
}