@charset "utf-8";
/* CSS Document */

body {
	font-family:Asap, sans serif;
	margin:0;
}

h1 {
	font-family: 'Roboto Slab', serif;
	font-size:21pt;
	margin:10px;
	color:#363636;
	padding:0;
	font-weight:bold;
}

.landing {
	background-image:url("files/abstract-succulents.jpg");
	background-color: #0000000;
	background-size:100% 100%;
	background-repeat:no-repeat;
	position: relative;
  	height: 92vh;
	width: auto;
	background-size: cover !important;
	background-position:center center;
	overflow:hidden;
}


.logo {
	text-align:center;
	max-width:100%;
	margin:0;
	margin-top:20%;
}

.row {
	align-content:center;
}

.logo img {
	max-width:100%;
}

.logo p {
	padding:20px;
	text-align:center;
	margin:20px;
	font-family: 'Roboto Slab', serif;
	font-weight:200;
	color:#ffffff;
	font-size:16pt;
}

.menu {
	width:99%;
	text-align:center !important;
	justify-content: center !important;
	margin:0;
	margin-left:0.5%;
	margin-right:0.5%;
	padding:0;
	z-index:2;
}

.menu .container {
	margin:0;
	padding:0;
	text-align:center;
	min-width:100%;
}

.menu .row {
	margin:0;
	padding:0;
	min-width:100%;
}

.menu .col-lg-2, .col-md-4, .col-4 {
	padding:0 !important;
	padding-left:0;
	padding-right:0;
	margin:0 !important;
}

.menu a {
	margin:0;
	padding:0;
	min-width:18%;
}

.menu img {
	width:100% !important;
	height:auto;
	margin:0;
	padding:0;
}

#menuheading {
	font-size:10pt;
	font-family: 'Roboto Slab', serif;
	font-weight:100;
	background-color:#598b97;
	color:#ffffff;
	padding:10px;
	margin:4px;
	margin-bottom:20px;
	display: none;
}

#menuheading:hover {
	background-color:#6d6e71;
}

.menu a:hover {
	text-decoration:none;
}

.footer {
	margin:0;
	padding:0;
	overflow:hidden;
	background-color:#217282;
	z-index:99;
}

.footer p {
	color:#ffffff;
	font-size:9pt;
	text-align:center;
	margin:20px;
	padding:0;
}

.footer a {
	color:#ffffff;
	font-size:9pt;
	text-align:center;
	padding:0;
}

.footer a:hover {
	color:#598b97;
	font-size:9pt;
	text-align:center;
	padding:0;
}

@media screen and (min-width: 1081px) and (max-width: 1200px) {
	.logo {
	text-align:center;
	max-width:100%;
	margin:0;
	margin-top:30%;
	}
	
	.logo img {
	max-width:100%;
}

.logo p {
	padding:20px;
	text-align:center;
	margin:20px;
	color:#ffffff;
	font-size:12pt;
}
}

@media screen and (min-width: 992px) and (max-width: 1080px) {
	
.logo img {
	max-width:100%;
	margin-top:30%;
}

.logo p {
	padding:20px;
	text-align:center;
	margin:20px;
	color:#ffffff;
	font-size:14pt;
}
}

@media screen and (min-width: 621px) and (max-width: 991px) {

.logo img {
	max-width:50%;
	margin-top:30%;
}

.logo p {
	padding:20px;
	text-align:center;
	margin:20px;
	color:#ffffff;
	font-size:14pt;
}
}

@media screen and (min-width: 321px) and (max-width: 620px) {
	
.logo img {
	max-width:70%;
	margin-top:30%;
}

.logo p {
	padding:20px;
	text-align:center;
	margin:20px;
	color:#ffffff;
	font-size:12pt;
}
}


@media screen and (max-width: 320px) {
	
.logo img {
	max-width:80%;
	margin-top:20%;
}

.logo p {
	padding:20px;
	text-align:center;
	margin:20px;
	color:#ffffff;
	font-size:12pt;
}
}