/* GENERAL STYLES */

h1 {
	font-size: 42px;
	font-family: "Montserrat", sans-serif; 
	font-weight: 800;
	text-transform: uppercase;
	}

p { 
	text-align: center; 
	font-size: 18px;
	font-family: "Montserrat", sans-serif; 
}

.button {
	font-family: "Montserrat", sans-serif;
	font-size: 20px;
	text-transform: uppercase;
	font-weight: 800;
	padding: 1em 2em;
	margin-top: 15px;
	border-radius: 9px;
}

.button.blue,
.button.blue:hover,
.button.blue:focus {
	border-color: #69b8c9;
	color: #fff; 
	background-color: #69b8c9; 
	}

.button.blue:hover,
.button.blue:focus {
	border-color: #69b8c9;
	background-color: #fff; 
	color: #69b8c9;
	}	

.button.green,
.button.green:hover,
.button.green:focus {
	border-color: #17C2A4;
	color: #fff; 
	background-color: #17C2A4; 
	}

.button.green:hover,
.button.green:focus {
	border-color: #17C2A4;
	background-color: #fff; 
	color: #17C2A4;
	}	

.button.orange,
.button.orange:hover,
.button.orange:focus {
	border-color: #FFDD9A;
	color: #D74680; 
	background-color: #FFDD9A; 
	}

.button.orange:hover,
.button.orange:focus {
	border-color: #FFDD9A;
	background-color: #fff; 
	color: #FFDD9A;
	}	

.button.white,
.button.white:hover,
.button.white:focus {
	border-color: #fff;
	color: #17C2A4; 
	background-color: #fff; 
	}

.button.white:hover,
.button.white:focus {
	border-color: #fff;
	background-color: #17C2A4; 
	color: #fff;
	}

section { padding: 5% 0;}	

header { text-align: center;}

/*============== HERO ==============*/
.hero {
  background: url('../img/hero_bg.jpg') top right no-repeat;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  color: #fff;
}

.hero-text {  
	text-align: center;
	}

.hero-text h1 {
 	font-weight: 500;
	text-transform: uppercase;
 	font-size: 62px;
	line-height: 100%;
 	margin-top: 5%;
	margin-bottom: 2%;
 }


 .hero .button { margin-bottom: 2%; }


/*============== SECTIONS ==============*/


.promise h1
{
	text-transform: uppercase;
	color: #17C2A4;
	text-align: center;
	margin-bottom: 3%;
	line-height: 3rem;
	}

.promise .row { text-align: center; }


.cost {
	background-color: #D74680;
	text-align: left;
	color: #fff;
}

.cost .row .columns{
	text-align: center;
}

.cost h1 {
	color: #FFDD9A;
    margin-bottom: 3%;
	}


.about h1 {
	text-transform: uppercase;
	color: #69b8c9;
	line-height: 3rem;
	margin-bottom: 3%;
	padding-left: 0;
	}	

.about p { text-align: left; }

.apply {
	background-color: #17C2A4;
	color: #fff;
	text-align: center;
}

.apply h1 {
	color: #fff;
	margin-bottom: 3%;
	text-align: center;
}

footer {
	color: #999;
	text-align: center;
	padding-top: 20px;
	padding-bottom: 20px;
	line-height: 13px;
}


/*=========================== 
	MEDIA QUERIES:  
=========================== */

/* 850 and below */

@media (max-width: 850px) {

	.hero-text h1 {
    font-size: 32px;
	}
	
	h1 {font-size:38px;}
}

/* 639 and below */

@media (max-width: 639px) {

	.about h1,
	.apply h1,
	.promise h1,
	.cost h1 { font-size: 36px; line-height: 36px; }

	.about img { margin-bottom: 20px; }
}

/* 460 and below */

@media (max-width: 460px) {

	.about h1, .apply h1, .promise h1, .cost h1 {
    font-size: 32px;
    line-height: 32px;
}
	.apply, .apply h1, .apply p {text-align: left;}
}