@import 'styles.css';


#homepage-hero {
	background: url(/assets/images/hero-truck.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position-y: bottom;
    background-position-x: right;
    height: 70vh;
}

#homepage-hero div {
	top: 30%;
    position: absolute;
    margin: 0;
    width: -webkit-fill-available;
}

#homepage-hero h1 {
	font-family:  'Optima Bold';
	text-align: center;
    color: #FF9900;
    margin-bottom: 20px;
    padding: 0px 20px;
    font-size: 2.5em;
}

#homepage-benefits #benefits-subtext {
	padding-bottom: 40px;
}

#homepage-benefits .row {
	padding-bottom: 40px;
}

#homepage-benefits .col-xs-1 {
	padding-bottom: 20px;
}

@media (min-width: 768px) { 
	#homepage-hero {
	    background-position-x: right;
	}

	#homepage-hero h1 {
		font-size: 2.5em;
	}
}

@media (min-width: 992px) {
	#homepage-hero h1 {
		font-size: 3.5em;
	}
}