/* ---------------------------------------- Fonts ----------------------------------------*/
@font-face {
	font-family: 'Nexa';
	src: url('fonts/NexaLight.eot');
	src: url('fonts/NexaLight.eot?#iefix') format('embedded-opentype'),
		url('fonts/NexaLight.woff') format('woff'),
		url('fonts/NexaLight.ttf') format('truetype');
	font-weight: 300;
	font-style: normal;
}

@font-face {
	font-family: 'Nexa';
	src: url('fonts/NexaBold.eot');
	src: url('fonts/NexaBold.eot?#iefix') format('embedded-opentype'),
		url('fonts/NexaBold.woff') format('woff'),
		url('fonts/NexaBold.ttf') format('truetype');
	font-weight: bold;
	font-style: normal;
}


/* ---------------------------------------- Helpers ----------------------------------------*/
.container { margin-right: auto; margin-left: auto; padding: 0; max-width: 1300px; width: 100%; }
.container .subcont { width: 90%; margin: 0 auto; }
.content {  }
.clear { clear:both; }
.fadeIn { opacity: 0; margin-top: 50px; }
.left { float: left; }
.right { float: right; }
.spacer { height: 0px; margin-bottom: 115px;  }
.mini { display: none; } /* Hide on mobile */
.max { } /*Show in non-mobile only */
.col { display: inline-block; float: left; text-align: center; vertical-align: top; }
.temp { height: 1100px; }
.error { display:none; }
.soon { cursor:pointer; }


/* ---------------------------------------- Body ----------------------------------------*/
body{ margin:0; padding:0; font-family: 'Nexa';}
body a { color: #0D6C96; text-decoration: none; }
body a:hover { color: #000; }
body p { text-align: justify; margin-top: 0; }


/* ---------------------------------------- Top Bar ----------------------------------------*/
.topbar { position:fixed; z-index: 10; top:0; background-color: #fff; text-align: center; height: 75px; padding: 10px 5px; width: 100%;  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.4); }
.comingsoon { position:fixed; z-index: 10; bottom:0; background-color: #265b80; text-align: center; height: 0; padding: 10px 5px; width: 100%; color:#fff; opacity: 0; font-size: 20px; font-weight: bold; text-transform: uppercase; }
.topbar .logo { float: left; }
.topbar .logo img { height: 75px; }
.topbar .logo #penta_logo_svg { height: 75px; }
.topbar .logoSm { float: left; }
.topbar .logoSm img { height: 35px; }
.menu { float:right; font-size: 15px; margin-top: -7px;}
.menu ul { list-style: none; padding-top: 33px;}
.menu ul li { display: inline-block; position: relative; }
.menu ul li a { padding: 10px 10px;}
.menu ul li a:hover { background-color: #b1cad7; }
.submenu { display: none; position: absolute; background-color: #f9f9f9; min-width: 180px; box-shadow: 0px 2px 2px 0px rgb(177, 202, 215); z-index: 20; margin-top: 5px;}
.submenu a { display:block; }
.menu ul li:hover .submenu { display:block; }
.menu ul li:hover .menulink { background-color: #b1cad7; }
.menu ul li.button a { background-color: #1f638b; color: #fff; border-radius: 10px; }
.menu ul li.button a:hover { background-color: #b21229; }

.hamb { float: none !important; }
#minimenu { display: none; background-color: #fff; padding: 0 0 10px 0; margin: 11px 0 0 -5px;}
#minimenu li { display: block; padding: 10px 0; margin-left; 0; }
.hamburger { height: 35px; margin-top: 4px; float: right; cursor:pointer; }
/* ---------------------------------------- Feature ----------------------------------------*/

.feature { background: url(../images/feat-city.jpg) center no-repeat; background-size: cover; position: relative; }
.mission { display: none; position: absolute; bottom: 0; margin: 5%; padding: 2%; color: #fff; background-color: rgba(13, 108, 150, 0.68); border: 3px solid #0d6c96;     border-radius: 10px; width: 40%; min-width: 250px; }
.ourmission { font-weight: bold; font-size: 3vh; margin-bottom: 1%; }
.m-a { opacity: 0; position: relative; bottom: 10px; font-size: 2vh; }


/* ---------------------------------------- Main Section ----------------------------------------*/
.main { padding: 60px 0 0; display: flex; flex-direction: column;}
.main .content { margin-top: 2%; width: 100%}

.introsections .col { width: 100%;}
.introsections .col .subcontent { padding: 0 5%; }
.introsections h2 { font-weight: normal; font-size: 1.5em; border-bottom: 1px solid rgba(13, 108, 150, 0.1); padding-bottom: 10px;  }
.introsections .button { padding: 5px;  border: 1px solid rgba(13, 108, 150, 0.1); width: fit-content; float: right; }
.introsections .button:hover { border-color: rgba(13, 108, 150, 0.38); }
.introicon { width: 50px; }

.contactsection { background: url(../images/contactBg.jpg) center no-repeat; background-size: cover; background-color: #deebf0; padding: 50px 1%; }
.contactsection .container {  }
.contactsection .contactForm { display: flex; padding: 15px 0; background-color: #bdd6e1; border-radius: 20px; overflow: auto; }
.contactsection h2 { font-weight: bold; font-size: 1.5em; color: #265b80; text-transform: uppercase; }
.contactsection h3 { font-weight: normal; font-size: 1.2em; }
.contactsection .col { width: 100%; }
.contactsection .col .subcontent { padding: 0 5%; }
.contactsection input { width: 100%; border-bottom: 1px solid black; border-top: 0px; border-right: 0px; border-left: 0px; background-color: #fff; font-size: 20px; height: 40px; margin-top: 10px; padding: 0 5px;}
.contactsection #form-accredited { text-align: left; }
.contactsection #form-accredited input { height: 18px; width: 18px; margin-right: 5px; }
.contactsection #form-submit input { width: 60%; border-radius: 10px; background-color: #265b80; color: #fff; border: 0; cursor: pointer; } 
.accreditedInfo { display: none; font-size: 12px; }
.contactsection textarea { width: 100%; font-size: 20px; margin-top: 10px; border-bottom: 1px solid black; border-top: 0px; border-right: 0px; border-left: 0px; }
.contactsection .label {  text-transform: uppercase;  text-align: left;}
.contactsection .error { color: red; }




/* ---------------------------------------- Footer ----------------------------------------*/

.footer { background-color: #0d6c96; padding: 25px 0; color: #fff; }



/* ---------------------------------------- Media Size ----------------------------------------*/

/* Mobile */
@media (max-width: 450px) {

}

@media (max-width: 560px) {
	
}


@media (min-width: 560px) {
	
}



@media (max-width: 768px) {
	
	.max { display: none; }
	.mini { display: block; }
	.topbar { height: 35px; }
	.contactsection .contactForm { display: block; }
	
	 




}

@media (min-width: 768px) {
	
}

@media (min-width: 992px) {
	.menu ul li a { padding: 10px 18px;}
	.introsections .col { width: 33%;}
	.contactsection .col { width: 50%; }
}

@media (max-width: 992px) {
	


}

@media (min-width: 1200px) {
	
}