style.css

body{
	margin:0px;
	font-family: "Open Sans", Helvetica, Arial, sans-serif;
}

. {
    font-family: "Open Sans", Helvetica, Arial, sans-serif!important;
}


body,
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
div,
img{
	max-width: 100%;
}

a{
	cursor: pointer;
}

.parallax1{
	background-attachment: fixed;
    background-position: top;
    background-repeat: no-repeat;
    background-size: 100% 59vw;
    background-image: url("img/bg-1.jpg");
    height:59vw;
}

.parallax2{
	background-attachment: fixed;
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("img/bg-2.jpg");
    height:313px;
    position: relative;
}

.parallax2>div {
	padding: 65px 15px 80px 15px;
	position: relative;
	top:0px;
}

.parallax2>div>h2{
	font-size: 34px;
	color:white;
	text-align: center;
	text-shadow:2px 2px #999;
	display: block;
	font-weight: 500px;
	margin-bottom: 0px;
}

.parallax2>div>p{
	margin-top:0px;
	font-size: 18px;
	line-height: 24px;
	color:white;
	text-align: center;
	text-shadow:2px 2px #888;
	font-weight: 500px;
}


.parallax3{
	background-attachment: fixed;
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url("img/bg-3.jpg");
    min-height: 800px;
    position: relative;
}

.parallax3>div{
	position: relative;
	top:0px;
	flex-basis: 100%;
}

.parallax3 > div > div>h2{
	font-size: 34px;
	color:white;
	text-align: center;
	text-shadow:2px 2px black;
	display: block;
	font-weight: 500px;
	margin-bottom: 0px;
}

.parallax3 > .content_holder_outer {
	opacity: .5;
}

.parallax3 > * >.content_holder_inner{
	border-radius: 5px ;
}

.parallax3>div>div>p{
	font-weight: 500px;
	font-size: 16px;
	padding:15px  0px;
}

.full {
	width:100%;
	flex-basis: 100%;
}

.content_holder_inner.col_2_s2 {
	background-color: transparent;
}

.input {
	margin-bottom: 15px ;
	border-radius: 5px ;
	padding:5px  5px  5px  10px;
	font-size: 16px;
	border:none;
}

textarea.input {
	height:114px;
}

.black_button {
	background:black;
	border: 1px solid white;
	padding: 10px 30px 10px 30px;
	color:white;
}

.content_holder_inner > .grey_button {
	padding:10px 30px;
	text-decoration: none;
	text-transform: capitalize;
	font-size: 18px;
	color:#666;
	border: 1px solid #ccc;
	border-radius: 10px;
	background:#fff;
}

.sectionlink {
	text-decoration: none;
}

.left{
	align-content: left;
	justify-content: left
}


.parallax1{
    margin-bottom: 70px;
}

@media (min-width:768px){
	.parallax1{
		width:auto;
		max-width:100%;
		margin:0px;
		background-size: 100% calc(1800/10.52)vw;
	}
}

@media (min-width:768px) and (min-aspect-ratio: 1052/1850){
	.parallax1 {
		width:100%;
		height: calc(1800/10.52)vw
		background-size: 100% calc(1800/10.52)vw;
	}
}




.nav, .nav>label, .nav>ul, .nav>ul>li, .nav>ul>li>ul, .nav>ul>li>ul>li, .nav>ul>li>a{
	-webkit-transition: all .5s ease-out, visibility 0s ease;
	-moz-transition: all .5s ease-out, visibility 0s ease;
	-ms-transition: all .5s ease-out, visibility 0s ease;
	-o-transition: all .5s ease-out, visibility 0s ease;
	transition: all .5s ease-out, visibility 0s ease;
}

.nav > label {
		display: block;
		background-color: none;
		color: white;
		text-align: center;
		text-decoration: none;
		display: inline-block;
		text-shadow: -.25px  0px #333, 0px .25px  #333, .25px  0px #333, 0px -.25px  #333;
		cursor:pointer;
		font-size:20px;
		font-weight:100px;
		padding: 5px  9px 5px  9px;
		margin: 8px;
		text-align:center;
		background-color: #383e4c;
		float:right;
		border-radius:5px ; 
	}	

label~input{
	display: none;
}

input~ul{
	overflow: hidden;
	max-height:0px;
}

input:checked~ul{
	max-height:230px;
}


.nav {
		z-index: 5px;
		position: fixed;
		top:0px;
		width:100%;
}

.nav >ul{
	background-color: #383e4c;
	margin-top:60px;
	padding-left: 0px;
	width:96%;
	margin-left: 2%;
}

.nav >ul>li{
	list-style-type: none;
	text-align: center;
	width: 100%;
	height:100%;
}

.nav>ul>li>a{
	font-size:16px;
	color:white;
	display: block;
	width: 100%;
	height:100%;
	border-bottom: 1px solid #999999;
	padding: 10px 0px 10px 0px;
}

.nav>ul>li:last-child>a{
	border-bottom: 0px solid #999999;
}

.nav>ul>li>a.highlighted{
	background-color: #49505f;
}

.nav>ul>li>a:hover{
	background-color: #383e4c;
}

.material_holder_outer{
	padding-top:60px;
}

.col_3{
	margin: 0px 15px 30px 15px;
}

.col_2{
	margin: 0px 15px 30px 15px;
	max-width: 555px ;
}

.col_4{
	margin: 0px 15px 30px 15px;
	max-width: 260px;
}

.col_1{
	margin: 0px 15px 30px 15px;
	max-width: 720px;
}

.col_1_medium{
	margin: 0px 15px 30px 15px;
	max-width: 720px;
	flex-basis: 100%;
}

.parallax3 >.flex{
	justify-content: center;
}

.margin_top_30px > .col_2_s2{
	flex-basis: 100%;
	margin:0px 15px 0px 15px;
	width:100%;
}

.flex{
	display: flex;
	flex-flow: row wrap;
	justify-content: space-around;
}

.material_holder_inner{
	text-align: center;
}

.col_3 > .content_holder_inner{
	max-width: 360px;
}

.content_holder_inner{
	margin:auto;
	background-color: #f2f2f2;
	text-align: center;
	padding:0px 0px 40px 0px;
}

.content_holder_inner > h2 {
	font-size:20px;
}

.content_holder_inner > p {
	margin:15px 0px 0px 0px;
	padding:0px 20px 35px 20px;
	font-size:14px;
}

.content_holder_inner > a {
	font-size:20px;
	padding:10px 30px 10px 30px;
	border-radius:5px ;
	border:black;
}

.green_bk {
	background-color: #1f892d;
	color:white;
}

.blue_bk {
	background-color: #2087bf;
	color:white;
}

.red_bk {
	background-color: #84240f;
	color:white;
}

.green_txt {
	color: #1f892d;
}

.blue_txt {
	color: #2087bf;
}

.grey_txt {
	color:#777;
}

.flex_holder {
	display:flex;
	justify-content: space-around;
	flex-flow: row wrap;
}

.material_holder_outer.flex_holder {
	justify-content: center;
}

.margin_top_30{
	margin-top: 30px;
}

.margin_sides_15{
	margin: 0px 15px  0px 15px;
}

.padding_top_45{
	padding-top: 45px ;
}

footer > .material_holder_outer {
	padding: 0px;
	background-color: #f2f2f2;
}

.border_bottom_sm{
	border-bottom:1px solid grey;
}



.parallax1>div{

	display: block;
	width:100%;
}

h1{
	font-size: 60px;
	color:white;
	text-align: center;
	text-shadow:2px 2px black;
	display: block;
	font-weight: 500px;
	margin-bottom: 0px;
}

.parallax1>div>h4{
	margin-top:0px;
	font-size: 25px ;
	color:white;
	text-align: center;
	text-shadow:2px 2px black;
	font-weight: 500px;
}



@media (min-width: 400px){
	h1{
		font-size: 70px;
	}
}


@media (min-width: 480px)
{
	.parallax1>div {
		padding-top:12%;
	}
	.flex{

		display: flex;
		flex-flow: row;
		justify-content: space-around;
		min-width: 100%
	}
	.parallax1>div>h1{
		margin-top: 0px;
	}
	.parallax3{
    	min-height: 600px;
	}
}

@media (min-width: 768px){

	.nav, .nav>label, .nav>ul, .nav>ul>li, .nav>ul>li>ul, .nav>ul>li>ul>li, .nav>ul>li>a{
	max-height: 70px;
}

	.parallax1>div>h1{
		margin-top: auto;
	}
	input~ul{
		visibility: visible;
		-moz-transform: scaleY(1);
		-webkit-transform: scaleY(1);
		-o-transform: scaleY(1);
		-ms-transform: scaleY(1);
		transform: scaleY(1);
		overflow: visible;
		max-height: 250px;
	}

	.nav, .nav>label, .nav>ul, .nav>ul>li, .nav>ul>li>ul, .nav>ul>li>ul>li, .nav>ul>li>a{
		-webkit-transition: max-height .3s ease-out;
		-moz-transition: max-height .3s ease-out;
		-ms-transition: max-height .3s ease-out;
		-o-transition: max-height .3s ease-out;
		transition: max-height .3s ease-out;
	}

	.nav {
		background-color: #383e4c;
		position: fixed;
		top:0px;
		width:100%;
	}

	.nav >label{
		text-align:center;
		margin:auto;
		display:none;
	}

	.nav >ul{
		text-align:center;
		padding-top: 6px;
		padding-bottom: 12px;
		padding-left: 0px;
		vertical-align: center;
		margin-top:16px;
	}

	.nav >ul>li{
		width: auto;
		height:auto;
		list-style-type: none;
		display:inline;
		vertical-align: center;
		line-height: 20px;
	}

	.nav>ul>li>a{
		display:inline;
		font-size:16px;
		padding:14px 23px 14px 23px;
		border: 1px solid #646d7c;
		color:white;
		margin:0px 6px 0px 6px;
		text-transform: capitalize;
	}

	.nav>ul>li:last-child>a{
		border-bottom: 1px solid #646d7c;
	}

	.nav>ul>li>a.highlighted{
		background-color: #49505f;
	}

	.nav>ul>li>a:hover{
		background-color: #49505f;
	}

	.col_3{
		width:220px;
		display: inline-block;
	}

	.col_2{
		max-width: 345px ;
	}
	.parallax3>div>div>p{
		font-size: 18px;
	}
	.margin_top_30 > .col_2_s2{
		max-width: 345px ;	
	}
}



@media (min-width: 992px){

	h1{
		font-size:90pt;
	}

	.nav>ul>li>a{
		font-size:20px;
		padding:11px 22px 12px 22px;
		margin:0px 10px 0px 10px;
		text-align: center;
	}

	.nav >ul>li{
		list-style-type: none;
		display:inline;
		padding:10px 0px 10px 0px;
		vertical-align: center;
		line-height: 20px;
	}

	.nav >ul{
		text-align:center;
		padding-top: 10px;
		padding-bottom: 16px;
		padding-left: 0px;
		vertical-align: center;
	}

	.col_3{
		width:293.3px;
	}

	.col_2{
		max-width: 455px ;
	}
	.col_4{
		max-width: 212.5px ;
	}
	.flex{
		min-width: 0%
	}
	.col_1{
		max-width: 940px;
	}

	.col_1_medium{
		max-width: 750px;
	}

}

@media (min-width: 1200px){
	.col_3{
		width:360px;
	}
	.col_2{
		max-width: 555px ;
	}
	.col_4{
		max-width: 260px;
	}
	.col_1{
		max-width: 1140px;
	}
}