/*
Theme Name: Seggletto Limites
Version: 1.0

 */

html {
	overflow-y: scroll;

}

body {
	font-family: 'Open Sans', Helvetica, Arial, Sans-Serif;
	font-size: 16px;
	color: #fff;
	background-color: #131417;
}

.container-fluid {
	padding-left: 40px;
	padding-right: 40px;
}

@media(min-width: 1200px){
	.container {
		max-width: 1200px;
	}
}

a {
	color: #fff;
}

a:hover {
	color: inherit;
}

a.dotted {
	border-bottom: 1px dotted #fff; 
}

a.dotted:hover {
	text-decoration: none;
	border-color: inherit;
}


.p24 {
	font-size: 1.22em;	
}

.p16 {
	font-size: 0.88em;
}

.p14 {
	font-size: 0.77em;
}

.p12 {
	font-size: 0.667em;
}

.p10 {
	font-size: 0.556em;
}

.extra-bold {
	font-weight: 800;
}

.bold {
	font-weight: 700;
}

.semi-bold {
	font-weight: 600;
}

.light {
	font-weight: 300;
}


.img-center {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.col-center {
	float: none;
	margin-left: auto;
	margin-right: auto;
}


@media(max-width: 1199px){

}

@media(max-width: 991px){

}

@media(max-width: 767px){

}



/* ==========================================================================
Header Styles
========================================================================== */

#hero {
	background: transparent url('../images/background.jpg') no-repeat 350px 126px;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

header {
	padding-top: 20px;
	padding-bottom: 20px;
}

.logo {
	width: 82px;
	height: auto;
}

#hero-text {
	flex-grow: 1;
	display: flex;
	align-items: center;
}

#hero h1 {
	max-width: 700px;
	font-size: 30px;
	font-weight: 300;
}

#hero h1 span {
	position: relative;
}

#hero h1 span::after {
	width: 55px;
	height: 5px;
	background-color: #fff;
	right: -80px;
	top: 50%;
	margin-top: -2.5px;
	content: '';
	position: absolute;
}

footer {
	background-color: #131417;
	font-size: 12px;
}

@media(min-width: 1500px){
	#hero {
		background-position: 650px 126px;
	}
}

@media(max-width: 768px){
	#hero {
		background-position: 175px 126px;
	}
}

@media(max-width: 575px){
	#hero {
		background-position: center 126px;
	}
	#hero h1 span::after {
		display: none;
	}
}

/* ==========================================================================
Footer Styles
========================================================================== */

