body{
	background-color: white;
	font-family: "Corbel", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", "Bitstream Vera Sans", "Liberation Sans", "Verdana", "Verdana Ref", sans-serif;
}


*{
		margin: 0;
		padding: 0;
}

/* ------FONTS ---------------------------------------------- */

h1{
		font-size: 23px;
		font-weight: bold;
		color: #031252;
	margin-bottom: 2%;
	margin-top: -.05%;
}

h2{

	font-size: 19px;
	color: #031252;
	margin-bottom: 1%;
	line-height: 1.3em;

}

h3{

	font-size: 16.5px;
	color: #031252;
	margin-bottom: 1%;
	line-height: 1.4em;
	font-weight: 250;

}

.cookiesfont{
	font-size:1.35vh;
	color: white;
}


.herotext{
		font-size: 1.7vw;
		color: #190F7A;
	line-height: 2.4vw;
	font-weight: 600;
	margin-top: 14%;

}

.footer1{
		font-size: 12px;
		color: white;
}

.footer2 a:link, a:visited{
		font-size: 14px;
		color: white;
		text-decoration: none;
}

.footer2a{
		font-size: 14px;
		color: white;
		text-decoration: none;
}

.footer3{
		font-size: 14px;
		color: #575656;
	align-content: center;
}
.footerh1{
		font-size: 22px;
		color: #575656;
	font-weight: bold;
	
}

.maintext{
		font-size: 18px;
		color: #031252;
	margin-bottom: 1%;
}

/* ------END OF FONTS ---------------------------------------------- */

/* ------NAV BAR ---------------------------------------------- */

.navcookiecontainer{
	width:100%;
	height: auto;
	overflow: auto;
	position: relative;
	position: fixed;
	z-index: 10;
	

}

.navbarcontainer{
	width: 100%;
	background: white;
}

.navbar{
	width: 80%;
	height: auto;
	background: #FFFFFF;
	overflow: auto;
	margin-left: auto;
	margin-right: auto;

	
	}
@media screen and (max-width: 1024px) {
  div.navbar {
	
  }
@media screen and (max-width: 700px) {
  div.navbar {
	 display: none;
  }
}
}


.mobilenavbar{
	display: none;

	
	}
@media screen and (max-width: 1024px) {
  div.mobilenavbar {
	
  }
@media screen and (max-width: 700px) {
  div.mobilenavbar {
	  display: block;
	 width: 100%;
	height: auto;
	background: #FFFFFF;
	overflow: auto;
	
  }
}
}

.cookiecontainer{
		width: 100%;
		height: auto;
		overflow: auto;
		background-image: url("../nav/nav_bg-01.png");
		background-repeat: repeat;
		padding-top: .5%;
		padding-bottom: .5%;
}

@media screen and (max-width: 1024px) {
  div.cookiecontainer {
	
  }
@media screen and (max-width: 700px) {
  div.cookiecontainer {
	 padding-top: 3%;
		padding-bottom: 3%;
	
  }
}
}
.navlogo{
		width: 30%;
		height: auto;
		overflow: auto;
	float: left;
	padding-top: 5px;
		
}

.navbuttoncontainer{
	width:70%;
	height: auto;
	overflow: auto;				
}

@media screen and (max-width: 1024px) {
  div.navbuttoncontainer {

  }
@media screen and (max-width: 700px) {
  div.navbuttoncontainer {

    display: none;
	  
  }
}
}


.navbuttons{
	width: 22%;
	height: auto;
	overflow: auto;
	float: right;
	margin-right: 2%;
	padding-top: 17px;
	
}

.navbuttons2{
	width: 30%;
	height: auto;
	overflow: auto;
	margin-right: 0;
	float: right;
	padding-top: 17px;
	padding-left: 8%;
	padding-right: 8%;
	padding-bottom: 1%;
	background: #CCC;
}



/* Style the navigation menu */
.topnav {
  overflow: hidden;
  position: relative;
}

/* Hide the links inside the navigation menu (except for logo/home) */
.topnav #myLinks {
  display: none;
	line-height: 5px;
}

/* Style navigation menu links */
.topnav a {
  
  padding: 5px 15px;
  text-decoration: none;
  font-size: 22px;
  display: block;
}

/* Style the hamburger menu */
.topnav a.icon {
  background: white;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
}

/* Add a grey background color on mouse-over */
.topnav a:hover {

  color: black;
}

/* Style the active link (or home/logo) */
.active {

  color: black;
}
/* ------END OF NAV BAR --------------------------------------- */


/* ------Background -------------------------------------------- */

.heropanel{
		width: 100%;
	overflow: auto;
	height: auto;
	position: absolute;
	z-index: 1;
	margin-left: auto;
	margin-right: auto;

	
}

@media screen and (max-width: 1024px) {
  div.heropanel {
	
  }
@media screen and (max-width: 700px) {
  div.heropanel {

    display: none;
	  

  }
}
}

.mobileheropanel{
	display: none;
}

@media screen and (max-width: 1024px) {
  div.mobileheropanel {
	
  }
@media screen and (max-width: 700px) {
  div.mobileheropanel {

    display: block;
	width: 100%;
	overflow: auto;
	height:auto;
	z-index: 1;
	margin-left: auto;
	margin-right: auto;
	  

  }
}
}


.herocontainer{
	width: 100%;
	height:auto;
	overflow: auto;
	position: absolute;
	z-index: 2;
	
}
@media screen and (max-width: 1024px) {
  div.herocontainer {
	
  }
@media screen and (max-width: 700px) {
  div.herocontainer {

    display: none;
	  

  }
}
}


.scaleableheropanel{
	width: 80%;
	height: auto;
	
	overflow: auto;
	margin-left: auto;
	margin-right: auto;
	

	
	}
@media screen and (max-width: 1024px) {
  div.scaleableheropanel {

  }
@media screen and (max-width: 700px) {
  div.scaleableheropanel {
	  width: 100%;
    display: block;
	  
position: relative;
  }
}
}

.herocontact{
	width: 31.3%;
	height: auto;
	overflow: auto;
	margin-right: 0;
	float: right;
	padding-top: 6%;
	padding-left: 6px;
	padding-right: 6px;
	padding-bottom: 300px;
	background-image: url("../images/herobg-01.png");
	background-repeat: repeat-x;
	
}

@media screen and (max-width: 1024px) {
  div.herocontact {
		width: 30.3%;
  }
@media screen and (max-width: 700px) {
  div.herocontact {

  }
}
}

.mainwidediv{
		width: 90%;
		height: auto;
		overflow: auto;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0%;
	margin-bottom: 0%;
}

@media screen and (max-width: 1024px) {
  div.mainwidediv {
		width: 65%;
	  
  }
@media screen and (max-width: 700px) {
  div.mainwidediv {
		width: 100%;
		height: auto;
		overflow: auto;
  }
}
}



.mainwidediv2{
		width: 35%;
		height: auto;
		overflow: auto;
	margin-left: auto;
	margin-right: auto;
}

@media screen and (max-width: 1024px) {
  div.mainwidediv2 {
		width: 65%;
	  
  }
@media screen and (max-width: 700px) {
  div.mainwidediv2 {
		width: 100%;
		height: auto;
		overflow: auto;
  }
}
}

.mainwidediv3{
		width: 35%;
		height: auto;
		overflow: auto;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 3%;
}

@media screen and (max-width: 1024px) {
  div.mainwidediv3 {
		width: 65%;
	  
  }
@media screen and (max-width: 700px) {
  div.mainwidediv3 {
		width: 100%;
		height: auto;
		overflow: auto;
	  margin-bottom: 5%;
  }
}
}
/* ------END OF Background ------------------------------------- */


/* ------Main Container -------------------------------------------- */

.maincontainers{
	width: 100%;
	height: auto;
	overflow: auto;
	position: absolute;
	z-index: 1;
	margin-bottom: 10px;
	margin-top: 35%;
	
	
}

@media screen and (max-width: 1024px) {
  div.maincontainers {
	
	
  }
@media screen and (max-width: 700px) {
  div.maincontainers {
	  margin-top: -55%;
	 
		
  }
}
}

.intropanel{
	width: 77%;
	margin-left: auto;
	margin-right: auto;
	height: auto;
	overflow: auto;
	background-color: #D6D6D6;
	margin-bottom: 50px;
	padding: 1.5%;
	
}



@media screen and (max-width: 1024px) {
  div.intropanel{
	
	
  }
@media screen and (max-width: 700px) {
  div.intropanel {
	 width: 82%;
	  padding: 3%;
	  margin-bottom: 7%;
	 
		
  }
}
}

.textpanel{
	width: 78%;
	margin-left: auto;
	margin-right: auto;
	height: auto;
	overflow: auto;
	background-color: #D6D6D6;
	margin-bottom: 10px;
	padding: 2%;
	
}
.navpanel{
	width: 80%;
	height: auto;
	overflow: auto;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 10px;
	

	
}

@media screen and (max-width: 1024px) {
  div.navpanel{
	
	height: 24em;
  }
@media screen and (max-width: 700px) {
  div.navpanel {
	 width: 89%;
	 height: auto;
	
	 
		
  }
}
}


.navpanel3{
	width: 80%;
	overflow: auto;
	margin-left: auto;
	margin-right: auto;
	display: flex;
	margin-bottom: 1%;
	
	

	
}

@media screen and (max-width: 1024px) {
  div.navpanel3{
	
	
  }
@media screen and (max-width: 700px) {
  div.navpanel3 {
	 display: none;
	
	 
		
  }
}
}



.testpanel{
	width: 70%;
	height: auto;
	overflow: auto;
	margin-left: auto;
	margin-right: auto;
	background-color: #D6D6D6;
	margin-top: 2%;
	margin-bottom: -1%;
	padding-top: 4%;
	padding-left: 5%;
	padding-right: 5%;
	padding-bottom: 2%;
	
}

@media screen and (max-width: 1024px) {
  div.testpanel{
	
	
  }
@media screen and (max-width: 700px) {
  div.testpanel {
	 width: 79%;
	  margin-bottom: 5%;
	 
		
  }
}
}


.socialpanel{
	width: 80%;
	height: auto;
	overflow: auto;
	margin-left: auto;
	margin-right: auto;
	background-color: #D6D6D6;
	margin-bottom: 3%;
	margin-top: 2%;


	
}

@media screen and (max-width: 1024px) {
  div.socialpanel{
	
	
  }
@media screen and (max-width: 700px) {
  div.socialpanel {
	 width: 80%;
	  padding: 5%;
	 
		
  }
}
}

.planingpanel{
	width: 78%;
	height: auto;
	overflow: auto;
	margin-left: auto;
	margin-right: auto;
	background-color: #D6D6D6;
	margin-bottom: 4%;
	padding: 1%;
	
}

@media screen and (max-width: 1024px) {
  div.planingpanel{
	
	
  }
@media screen and (max-width: 700px) {
  div.planingpanel {
	 width: 82%;
	  padding: 3%;
	  margin-left: 5%;
	 
		
  }
}
}


.contactpanel{
	width: 78%;
	height: auto;
	overflow: auto;
	margin-left: auto;
	margin-right: auto;
	background-color: #D6D6D6;
	margin-bottom: 3%;
	padding: 1%;
	margin-top: 3%;
	
}

@media screen and (max-width: 1024px) {
  div.contactpanel{
	
	
  }
@media screen and (max-width: 700px) {
  div.contactpanel {
	 width: 86%;
	  padding: 2%;
	 
		
  }
}
}

/* ------END OF Container ------------------------------------- */

/* ------Intro panel ----------------------------------------------- */

.media{
		width: 45%;
		height: auto;
		overflow: auto;
		float: left;
		margin-right: 2%;
		
		
	}

@media screen and (max-width: 1024px) {
  div.media{
	
	
  }
@media screen and (max-width: 700px) {
  div.media {
	 width: 100%;
	 
	  margin-top: 2%;
	  margin-right: 0%;
	  margin-left: auto;
	  
	  
	 
	 
		
  }
}
}

.video{
	widows: 95%;
	height: auto;
	overflow: auto;
}

.mediapics{
		width:31.9%;
		height: auto;
		overflow: auto;
		margin-right: 2%;
		margin-top: 2%;
		float: left;
	
}

.mediapics2{
		width:31.9%;
		height: auto;
		overflow: auto;
		margin-top: 2%;
		float: left;
		
}

.introtext{
		width: 42%;
		height: auto;
		overflow: auto;
		float: right;
		margin-left: 7%;
		margin-right: 4%;
	
}

@media screen and (max-width: 1024px) {
  div.introtext{
	
	
  }
@media screen and (max-width: 700px) {
  div.introtext {
	 width: 90%;
	  
	  
	  margin-bottom: 5%;
	
	
	 
	 
		
  }
}
}
/* ------END OF Intro panel ----------------------------------------------- */

/* ------Test panel ----------------------------------------------- */

.testheader{
		width: 100%;
		height: auto;
		overflow: auto;
		margin-bottom: 1%;
	background-color: aqua;
	
}

.testsection{
		
		width: 100%;
		height: auto;
		overflow: auto;
		margin-bottom: 1%;
		background-color: aqua;
}


.mySlides {display: none}
img {vertical-align: middle;}

/* Slideshow container */
.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: auto;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -22px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .prev, .next,.text {font-size: 11px}
}
/* ------END OF Test panel ----------------------------------------------- */

/* ------NAV2 ----------------------------------------------- */



.nav2panel{
		width:42.2%;
		height: 100%;
	float: left;
	padding: 3%;
	
	background-color: #D6D6D6;

}

@media screen and (max-width: 1024px) {
  div.nav2panel{
	
	
  }
@media screen and (max-width: 700px) {
  div.nav2panel{
	  padding: 2%;
	  padding-bottom: 8%;
	  width: 96%;
	  height: auto;
	  overflow: auto;
	  float: none;
	  margin-bottom: 2%;
}
}
}

.nav2panel2{
		width:42.2%;
		height: 100%;
	float: left;
	padding: 3%;
	margin-left: 3%;
	
	background-color: #D6D6D6;

	
	
}

@media screen and (max-width: 1024px) {
  div.nav2panel2{
	
	
  }
@media screen and (max-width: 700px) {
  div.nav2panel2{
	  padding: 2%;
	  padding-bottom: 8%;
	  width: 96%;
	  overflow: auto;
	  height: auto;
	  float: none;
	  margin-left: 0%;
	  margin-bottom: 5%;
}
}
}


.nav2image{
		width: 90%;
		height: auto;
		overflow: auto;
	margin-left: 5%;
	
		
		float: left;
		
		margin-bottom: 2%;
		
	
}

@media screen and (max-width: 1024px) {
  div.nav2image{
	
	
  }
@media screen and (max-width: 700px) {
  div.nav2image{
	 width: 100%;
	
	 margin-right: 0%;
	 margin-left: auto;

	  
	  
	 
	 
		
  }
}
}

.nav2text{
		width: 80%;
		height: auto;
		overflow: auto;
		
		float: left;
	margin-left: 9%;
	margin-top: 5%;
		
	
		
	
}

@media screen and (max-width: 1024px) {
  div.nav2text{
	
	
  }
@media screen and (max-width: 700px) {
  div.nav2text {
	 width: 100%;
	 

	  margin-right: 0%;
	  margin-left: auto;
	  
	  
	 
	 
		
  }
}
}
/* ------END OF NAV2 ----------------------------------------------- */


/* ------NAV3 ----------------------------------------------- */

.nav3panel{
		width:30.4%;
		height: auto;
	overflow: auto;
	float: left;
	margin-right: 1.3%;
	background-color: #D6D6D6;
	padding: 1%;
	padding-bottom: 3%;
}

@media screen and (max-width: 1024px) {
  div.nav3panel{
	
	
  }
@media screen and (max-width: 700px) {
  div.nav3panel{
	  padding: 4%;
	  width: 90%;
	  float: none;
	  padding-bottom: 5%;
	  margin-bottom: 3%;
}
}
}

.nav3panel2{
		width:30.4%;
height: auto;
	overflow: auto;
	float: left;
	background-color: #D6D6D6;
	padding: 1%;
	padding-bottom: 3%;
}

@media screen and (max-width: 1024px) {
  div.nav3panel2{
	
	
  }
@media screen and (max-width: 700px) {
  div.nav3panel2{
		 padding: 4%;
	 	 width: 91%;
	  	float: none;
	 	 padding-bottom: 5%;
	  margin-bottom: 3%;
}
}
}

.nav3pic{
		width: 100%;
		height: auto;
	overflow: auto;
	margin-bottom: 4%;
}

.nav3text{
		width: 90%;
		height: auto;
	margin-left: auto;
	margin-right: auto;
	overflow: auto;
	margin-top: 10%;
	
}

.seemore{

  width: 100%;
	height: auto;
	overflow: auto;
	background-color: antiquewhite;
  display: flex;
  align-items: flex-end;
}



/* ------END OF NAV3 ----------------------------------------------- */
/* ------Planning panel ----------------------------------------------- */

.planningpic{
		width: 35%;
		height: auto;
		overflow: auto;
		margin-right: 2%;
		margin-left: 2%;
		float: left;
}

@media screen and (max-width: 1024px) {
  div.planningpic{
	
	
  }
@media screen and (max-width: 700px) {
  div.planningpic{
	  width: 100%;
	  float: none;
	  margin-bottom: 2%;
	  text-align: center;
	  margin: 0%;
}
}
}



.planingtext{
		width: 58%;
		height: auto;
		overflow: auto;
		float: left;
		text-align: left;
	
}
@media screen and (max-width: 1024px) {
  div.planingtext{
	
	
  }
@media screen and (max-width: 700px) {
  div.planingtext{
	  width: 90%;
	  padding: 5%;
	  float: none;
	  margin-top: 3%;
	  text-align: center;
	  margin-bottom: -5%;
	  
}
}
}

.planingpic2{
		width: 35%;
		height: auto;
		overflow: auto;
		float: right;
}

@media screen and (max-width: 1024px) {
  div.planingpic2{
	
	
  }
@media screen and (max-width: 700px) {
  div.planingpic2{
	  width: 100%;
	  float: none;
	  margin-bottom: 10%;
	  text-align: center;
	  
	  
}
}
}

.planingtext2{
		width: 58%;
		height: auto;
		overflow: auto;
		margin-right: 5%;
		text-align: right;
	float: right;
}

@media screen and (max-width: 1024px) {
  div.planingtext2{
	
	
  }
@media screen and (max-width: 700px) {
  div.planingtext2{
	  width: 100%;
	  float: none;
	  margin-bottom: 2%;
	  text-align: center;
	  margin: 0%;
}
}
}


.planningclear{
		width: 100%;
		height: auto;
	float: left;
	margin-bottom: 2%;
}

/* ------SOCIAL ----------------------------------------------- */

.socail1{
		width: 26%;
		height: auto;
		overflow: auto;
		float: left;
	margin-right: 1%;
	padding-left: 2%;
	padding-right: 2%;
}

@media screen and (max-width: 1024px) {
  div.socail1{
	
	
  }
@media screen and (max-width: 700px) {
  div.socail1{
	  width: 90%;
	  float: none;
	  margin-bottom: 2%;
	  padding-left: 2%;
	padding-right: 2%;
}
}
}

.socail2{
		width: 68%;
		height: auto;
		overflow: auto;
		float: left;
	margin-top: 2%;
	
	
}

@media screen and (max-width: 1024px) {
  div.socail2{
	
	
  }
@media screen and (max-width: 700px) {
  div.socail2{
	  width: 100%;
	  float: none;
	  margin-bottom: 2%;
	  margin-top: 10%;
}
}
}

.clientsimages{
		width: 100%;
		height: auto;
		overflow: auto;
	
}

.cimages{
		width: 18%;
		height: auto;
		overflow: auto;
		margin-bottom: 2%;
	margin-right: 2%;
		float: left;
}

@media screen and (max-width: 1024px) {
  div.cimages{
	
	
  }
@media screen and (max-width: 700px) {
  div.cimages{
	 width: 50%;
	  margin-bottom: 0%;
}
}
}



.linkscontiner{
		width: 35%;
		height: auto;
		overflow: auto;
		margin-left: auto;
		margin-right: auto;
		margin-top: 20%;
}

@media screen and (max-width: 1024px) {
  div.linkscontiner{
	
	
  }
@media screen and (max-width: 700px) {
  div.linkscontiner{
	 margin-top: 5%;
}
}
}


.weblinks{
		width: 46%;
		height: auto;
		overflow: auto;
		padding: 2%;
	float: left;
}

/* ------END OF SOCIAL ----------------------------------------------- */

/* ------contact ----------------------------------------------- */

.contactform{
		width: 50%;
		height: auto;
		overflow: auto;
		
	float: left;
	
}

@media screen and (max-width: 1024px) {
  div.contactform{
	
	
  }
@media screen and (max-width: 700px) {
  div.contactform{
	  width: 100%;
	  float: none;
	  margin-bottom: 2%;
}
}
}

.contactmap{
		width: 90%;
		height: auto;
		overflow: auto;
		float: left;
		margin-left: 5%
	
}

@media screen and (max-width: 1024px) {
  div.contactmap{
	
	
  }
@media screen and (max-width: 700px) {
  div.contactmap{
	  width: 90%;
	  float: none;
	  margin-bottom: 2%;
}
}
}

.googlemap{
		width: 90%;
	height: auto;
	overflow: auto;
	margin-left: auto;
	margin-right: auto;

	margin-top: 5%;
}


/* ------END OF contact ----------------------------------------------- */



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

.subfooter{
	width: 100%;
	height: auto;
	overflow: auto;
	padding-top: 1%;
	padding-bottom: 1%;
background-color: #181818;
	
	}


.subarea{
		width: 80%;
		height: auto;
	overflow: auto;
	margin-left: auto;
	margin-right: auto;
}
.sub3{
		width: 33.3%;
		height: auto;
		overflow: auto;
		float: left;
	
}

@media screen and (max-width: 1024px) {
  div.sub3{
	
	
  }
@media screen and (max-width: 700px) {
  div.sub3{
	  width: 100%;
	  float: none;
	  margin-bottom: 1%;

}
}
}

.sub32{
		width: 33.3%;
		height: auto;
		overflow: auto;
		float: left;
	padding-top: 3%;
	
}

@media screen and (max-width: 1024px) {
  div.sub32{
	
	
  }
@media screen and (max-width: 700px) {
  div.sub32{
	  width: 100%;
	  float: none;
	  

}
}
}

.sub1{
		
	display: none;
}

@media screen and (max-width: 1024px) {
  div.sub1{
	
	
  }
@media screen and (max-width: 700px) {
  div.sub1{
	  display: block;
	 width: 100%;
		height: auto;
		overflow: auto;
		float: left;
	  
	  

}
}
}



.sub2{
		width: 50%;
		height: auto;
		overflow: auto;
		float: left;

}

@media screen and (max-width: 1024px) {
  div.sub2{
	
	
  }
@media screen and (max-width: 700px) {
  div.sub2{
	  display: none;

	  
	  

}
}
}

.footer{
	width: 100%;
	height: auto;
	overflow: auto;
	margin-top: .3%;
	padding-top:1%; 
	padding-bottom:1%; 
	background-color: black;
	
}

.gassafe{
		width: 31%;
	height: auto;
	overflow: auto;
	margin-right: 2%;
	float: left;
}

@media screen and (max-width: 1024px) {
  div.gassafe{
	
	
  }
@media screen and (max-width: 700px) {
	div.gassafe{
		
	margin-left: 10%;
	  

}
}
}
.logo2{
		width: 38%;
		height: auto;
		overflow: auto;
	margin-bottom: 2%;
		background-color: azure;
	float: left;
}

.spacers{
	width: 10%;
	height: auto;
	overflow: auto;
	float: left;
	margin-top: 3%;
}

.sociallinks{
	width: 40%;
	height: auto;
	overflow: auto;
	float: left;
	margin-top: 3%;
}
/* ------END OF Footer----------------------------------------- */


/* ------Testimonal----------------------------------------- */

 .testimonial {
      display: none;
    }
			 
	#hiddenDiv {
    display: none;
		width: 60%;
		height: auto;
		overflow: auto;
		margin-left: auto;
		margin-right: auto;
		margin-top: 2%;
  }
			 
	/* Style for the submit button */
        input[type="submit"] {
            background-color: white; /* Background color */
            color: #E6007E; /* Text color */
            padding: 10px 20px; /* Padding for the button */
            border: none; /* Remove the button border */
            cursor: pointer; /* Change cursor to pointer on hover */
			font-size: 1.7em;
        }
			 
	input[type="text"],
    input[type="checkbox"] {
            width: 35%; /* Make the input fields 100% width */
            padding: 5px; /* Increase padding for user input fields */
            margin: 5px 0; /* Add some vertical margin between input fields */
			font-size: 1.6em;
        }
			 
	input[type="email"],
			 input[type="tel"] {
				 	width: 85%;
				 padding: 5px; /* Increase padding for user input fields */
            margin: 5px 0; /* Add some vertical margin between input fields */
			font-size: 1.6em;
			 }

/* ------END OF Testimonal----------------------------------------- */