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

body,html {
  margin:0;
  padding:0;
	width: 100%;
}


input[type=text] {
  border: 4px solid #97de30;
  border-radius: 4px;
}


.mailer  {
	
	margin-left: 50px;
	float: right;
	
	
}

textarea {
	
	 border: 4px solid #97de30;
  border-radius: 5px;
	
}

.container {
    margin: 0px;
    height: 100%;
    width: 100%;
}



.wedesign {
	
	
	
	
	
}

.fa-envelope {
	
	padding-left: 220px;
	
}
	

.fa, .far, .fas {
    color: #98de30;
	padding-right: 5px;
}



.upload {
	
	
	
}


.hr {
	
	    color: #4CAF50;

}


p {
	font-size: xx-large;
	font-family: 'Raleway', sans-serif;
	color: #28406c;
	text-align: center;
}


h1, h2, h3, h4, h5, h6 {
    font-size: 36px;
    font-family: 'Raleway', sans-serif;
    color: #28406c;
    font-weight: 900;
	line-height: 10px;
}


.burst {
	
	
	    width: 300px;
    float: right;
	
}



a:hover {
    color: #7CBF48;
    font-weight: bolder;
	
}

a {

	    color: #ffffff;
    text-decoration-line: none;
	
}




h3 {
    font-size: 19px;
    font-family: 'Raleway', sans-serif;
    color: #28406c;
}




.topbar {
    background-color: #28406c;
    height: 50px;
    width: auto;
	font-color: white;
	padding-top: 4px;
padding-left: 25px;
padding-right: 25px;
		font-family: 'Raleway', sans-serif;
	font-weight: bold;
	padding-left: 6%;
	padding-right: 7%;
	line-height: 46px;

	
	
}

.leftsidemain {
    background-color: #28406c;
    width: 47%;
    height: 421px;
    float: left;
	 font-size: 20px;
    font-family: 'Raleway', sans-serif;
    color: #FFFFFF;
    padding-left: 1%;
    padding-right: 1%;
	


	
}

.bottombanner {
    background-colo: white;
    height: 350px;
}





.rightsidemain {
	background-position: 100%;
	width: 51%;
	height: 432px;
	overflow: scroll;
	font-color: #28406c;
	font-size: 17px;
	background-position: center center;
	float: right;
	overflow-x: hidden;
}


.greenoffer {
	width: 100%;
	height: 100%;
	overflow: hidden;
	font-color: #28406c;
	font-size: small;
	background-color: #dedede;
	font-weight: bold;
	text-align: center;
	padding-top: 0;
}


.div1  {
	
	height: 300px;
	width: 30%;
font-family: 'Kanit', sans-serif;
	color:  #28406c;
		float: left;
	font-size: 22px;
	padding-left: 2%;
	text-align: left;
	font-weight: 600;
	padding-top: 7%;
	clear: left;

	
	
}

.div2  {
	
	height: 300px;
	width: 30%;
font-family: 'Kanit', sans-serif;
	color:  #28406c;
	float: left;
	font-size: 22px;
	padding-left: 3%;
	text-align: left;
	font-weight: 600;
	padding-top: 5%;

	
}


.div3  {
	
	height: 300px;
	width: 30%;
font-family: 'Kanit', sans-serif;
	color:  #28406c;
	float: left;
	font-size: 22px;
	padding-left: 3%;
	text-align: left;
	font-weight: 600;
	padding-top: 5%;




	
	
}

u {
	
	  text-decoration: underline;
	
  border-bottom: 3px #A7DB52; solid;


	
}

.social {
	
	Float: right;
	margin-top: 3px;
	
	
}

.midtopbanner {
	
	
	padding-left: 40px;
	padding-right: 25px;
	padding-top: 27px;
	padding-bottom: 63px;
	font-family: 'Raleway', sans-serif;
	font colo: white;
	textialign: right;
		font-family: 'Raleway', sans-serif;
	height: 100px;

	
 }


 /* Add a black background color to the top navigation */
.topnav {
  background-color: #dedede;
  overflow: hidden;
}

/* Style the links inside the navigation bar */
.topnav a {
  float: left;
  display: block;
  color: #28406c;
  text-align: center;
  padding: 14px 16px;
  font-size: 17px;
	background-color: #dedede;
	font-family: 'Kanit', sans-serif;
	font-weight: 900;
	test-decoration: none;
	

	
}

/* Change the color of links on hover */
.topnav a:hover {
    background-color: #ddd;
    color: #28406c;
    font-weight: 900;
}

/* Add an active class to highlight the current page */
.active {
  background-color: #4CAF50;
  color: white;
}

/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
  display: none;
} 

.callus {
    float: right;
    text-align: right;
	translate(0% ,0%)
	padding-left: 41px;
    padding-left: 41px;
	font-family: 'Kanit', sans-serif;
	font-weight: 600;

	
	
}

.hours {
	
	float: right;
	text-align: right;
	translate(0% ,0%)
	padding-right: 40px;
	font-family: 'Kanit', sans-serif;
	font-weight: 600;


	
	
}

body{
  box-sizing:border-box;
  font-family:'Raleway', sans-serif;
/*   position:relative; */
}

.box{
  position:left;
	


}

.btn:link,
.btn:visited{
	text-decoration: none;
	text-transform: uppercase;
	position: relative;
	top: 0px;
	left: 0;
	padding: 11px 17px 13px 22px;
	border-radius: 0px;
	display: inline-block;
	transition: all .5s;
	background-color: #97de2f;
}

.btn-white{
  background:#97de2f;
  color:#ffffff;
	height: 24px;
	width: 242px;
    text-align: center;
}

.btn:hover{
   box-shadow:0px 10px 10px rgba(0,0,0,0.2);
   transform : translateY(-3px);
}

.btn:active{
  box-shadow:0px 5px 10px rgba(0,0,0,0.2)
  transform:translateY(-1px);
}

.btn-bottom-animation-1{
  animation:comeFromBottom 1s ease-out .8s;
}

.btn::after{
  content:"";
  text-decoration: none;
  text-transform:uppercase;
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  border-radius:0px;
  display:inline-block;
  z-index:-1;
  transition: all .5s;
}

.btn-white::after {
	
	
	
background: #97de2f;
    height: 24px;


}

.btn-animation-1:hover::after {
    transform: scaleX(1.4) scaleY(1.6);
    opacity: 0;
}

@keyframes comeFromBottom{
  0%{
    opacity:0;
    transform:translateY(40px);
  } 
  100%{
    opacity:1;
    transform:translateY(0);
  }
}


@media only screen and (max-width: 2560px) {
	
	
	.couponoffer {
		
		
		width:65%;
		height: auto;
		
	}

	
	.fa-envelope {
	
	padding-left: 220px;
	
}
	
	
	.leftsidemain {
	background-color: #28406c;
	width: 47%;
	height: 525px;
	float: left;
	font-size: 20px;
	font-family: 'Raleway', sans-serif;
	color: #FFFFFF;
	padding-left: 1%;
	padding-right: 1%;	


	
}
.rightsidemain {
	background-position: 100%;
	width: 51%;
	height: 524px;
	overflow: scroll;
	font-color: #28406c;
	font-size: 18px;
	background-position: center center;
	float: right;
		overflow-x: hidden;

}
	
	
	.burst {
		
		
		width: 20%;
		margin-right: 130px;
}
	
	
.div1 {
	height: 300px;
	width: 30%;
	font-family: 'Kanit', sans-serif;
	color: #28406c;
	float: left;
	font-size: 22px;
	padding-left: 2%;
	text-align: left;
	font-weight: 600;
	padding-top: 100px;
	
	
}
.div2 {
	height: 300px;
	width: 30%;
	font-family: 'Kanit', sans-serif;
	color: #28406c;
	float: left;
	font-size: 22px;
	padding-left: 5%;
	text-align: left;
	font-weight: 600;
	padding-top: 100px;
	
}
.div3 {
	height: 300px;
	width: 30%;
	font-family: 'Kanit', sans-serif;
	color: #28406c;
	float: left;
	font-size: 22px;
	padding-left: 3%;
	text-align: left;
	font-weight: 600;
	padding-top: 100px;
	
}
.btn-white {
	background: #97de2f;
	color: #ffffff;
	height: 9px;
	width: 444px;
	text-align: center;
	line-height: 13px;
	font-weight: 900;
}
	
	
	
}

@media screen and (max-width: 1920px) {
.leftsidemain {
	background-color: #28406c;
	width: 47%;
	height: 523px;
	float: left;
	font-size: 20px;
	font-family: 'Raleway', sans-serif;
	color: #FFFFFF;
	padding-right: 1%;	


	
}
	
	.btn-white {
	background: #97de2f;
	color: #ffffff;
	height: 15px;
	width: 444px;
	text-align: center;
	line-height: 15px;
	font-weight: bolder;
		font-weight: 900;
}
	
	
.burst {
	
	
	    width: 30%;
    float: right;
    left: 200px;
    margin-top: 21px;

}
	
	.btn-white {
    background: #97de2f;
    color: #ffffff;
    height: 15px;
    width: 394px;
    text-align: center;
		font-size: 24px;
		
}
.div1 {
	height: 300px;
	width: 30%;
	font-family: 'Kanit', sans-serif;
	color: #28406c;
	float: left;
	font-size: 22px;
	padding-left: 50px;
	text-align: left;
	font-weight: 600;
	padding-top: 100px;
	
	
}
.div2 {
	height: 300px;
	width: 30%;
	font-family: 'Kanit', sans-serif;
	color: #28406c;
	float: left;
	font-size: 22px;
	padding-left: 4%;
	text-align: left;
	font-weight: 600;
	padding-top: 100px;
	
}
.div3 {
	height: 300px;
	width: 30%;
	font-family: 'Kanit', sans-serif;
	color: #28406c;
	float: left;
	font-size: 22px;
	padding-left: 1%;
	text-align: left;
	font-weight: 600;
	padding-top: 100px;



	
	
}

}






@media only screen and (max-width: 1024px) {
.leftsidemain {
	background-color: #28406c;
	width: 47%;
	height: 302px;
	float: left;
	font-size: 20px;
	font-family: 'Raleway', sans-serif;
	color: #FFFFFF;
	padding-left: 1%;
	padding-right: 1%;	


	
}
	
	.btn-white {
	background: #97de2f;
	color: #ffffff;
	height: 8px;
	width: 202px;
	text-align: center;
	line-height: 13px;
	font-weight: 900;
}
	
	
.rightsidemain {
	background-position: 100%;
	width: 51%;
	height: 302px;
	overflow: scroll;
	font-color: #28406c;
	font-size: 10px;
	background-position: center center;
	float: right;
}
.burst {
	
	
	width: 35%;
    float: right;
    margin-top: 27px;
    margin-right: 67px;
}
	
	
	
}


@media only screen and (max-width: 600px) {
	
	
	h1, h2, h3, h4, h5, h6 {
    font-size: small;
    font-family: 'Raleway', sans-serif;
    color: #28406c;
    font-weight: 900;
    line-height: 12px;
}
	
	
	
	
	.fa-envelope {
    padding-left: 20px;
}
	
	
.btn-white {
	background: #97de2f;
	color: #ffffff;
	height: 8px;
	width: 352px;
	text-align: center;
	line-height: 13px;
	font-weight: 900;
}
	
	
	.mailer {
		
padding-left: 15px;
		float: right;
		
		
	}
  
	.btn-white {
      background: #97de2f;
    color: #ffffff;
    height: 5px;
    width: 29%;
    text-align: center;
    font-size: 8px;
}
	
	
	.leftsidemain {

	  height: 122px;

	
	}
	
	.topnav a {

    font-size: 7px;
   
}
	
	.alienlogo {

	position:left;
	width: 55%;
	height:auto;
}
	
	
	.callus {
    float: right;
    text-align: right;
	translate(0% ,0%)
	padding-left: 111px;
    padding-left: 41px;
	font-family: 'Kanit', sans-serif;
	font-weight: 600;
	font-size: 11px;


	
	
}

.hours {
	
	float: right;
	clear: right;
	text-align: right;
	translate(0% ,0%)
	padding-right: 40px;
	font-family: 'Kanit', sans-serif;
	font-weight: 600;
		font-size: 11px;



	
	
}
.burst {
	width: 30%;
	float: right;
	margin-top: -22px;
    margin-right: 24px;
}
	
	.btn:link, .btn:visited {
    text-decoration: none;
    text-transform: uppercase;
    position: relative;
    top: -17px;
    left: 2px;
    padding: 11px 17px 13px 22px;
    border-radius: 0px;
    display: inline-block;
    transition: all .5s;
}
.rightsidemain {
	background-position: 100%;
	width: 51%;
	height: 122px;
	overflow: scroll;
	font-color: #28406c;
	font-size: x-small;
	background-position: center center;
	float: right;
}
.div1 {
	height: 300px;
	width: 30%;
	font-family: 'Kanit', sans-serif;
	color: #28406c;
	float: left;
	font-size: small;
	padding-left:4%;
	text-align: left;
	font-weight: 600;
	padding-top: 5%;
	
	
}
.upload {
	
	    width: 95%;
    height: auto;
	
}
.midtopbanner {
	padding-left: 20px;
	padding-right: 25px;
	padding-top: 15px;
	padding-bottom: 20px;
	font-family: 'Raleway', sans-serif;
	font colo: white;
	textialign: right;
	font-family: 'Raleway', sans-serif;
	height: 100px;
	
 }
/* Add a black background color to the top navigation */
.topnav {
	    background-color: #f2f2f2;
    overflow: hidden;
    width: 100%;
    margin-top: 24px;
}
.div2 {
	height: 300px;
	width: 30%;
	font-family: 'Kanit', sans-serif;
	color: #28406c;
	float: left;
	font-size: small;
	padding-left: 2%;
	text-align: left;
	font-weight: 600;
	padding-top: 5%;
	
}
.div3 {
	height: 300px;
	width: 30%;
	font-family: 'Kanit', sans-serif;
	color: #28406c;
	float: left;
	font-size: small;
	padding-left: 2%;
	text-align: left;
	font-weight: 600;
	padding-top: 5%;
	padding-right: 1%;



	
	
}

.wedesign {
	
	margin-bottom: -16px;
	
	
	
	
}
.wedesign2 {
	
margin-bottom: 0px;
	
	}
.bottombanner {
	background-colo: white;
	height: 350px;
	margin-top: 105px;

}
.social {
	
	Float: right;
    clear: right;
    width: auto;
}
.hr {
	color: #4CAF50;
}
	
	

}

@media only screen and (max-width: 400px) {
	
	
	h1, h2, h3, h4, h5, h6 {
    font-size: small;
    font-family: 'Raleway', sans-serif;
    color: #28406c;
    font-weight: 900;
    line-height: 12px;
}
	
	
	
	
	.fa-envelope {
    padding-left: 0px;
		
}
	
	
.btn-white {
	background: #97de2f;
	color: #ffffff;
	height: 8px;
	width: 352px;
	text-align: center;
	line-height: 13px;
	font-weight: 900;
}
	
	
	.mailer {
		
		width: 90%;
		height: auto;
		
		
	}
  
	.btn-white {
      background: #97de2f;
    color: #ffffff;
    height: 5px;
    width: 29%;
    text-align: center;
    font-size: 8px;
}
	
	
	.leftsidemain {

	  height: 122px;

	
	}
	
	.topnav a {

    font-size: 7px;
   
}
	
	.alienlogo {

	position:left;
	width: 55%;
	height:auto;
}
	
	
	.callus {
    float: right;
    text-align: right;
	translate(0% ,0%)
	padding-left: 111px;
    padding-left: 41px;
	font-family: 'Kanit', sans-serif;
	font-weight: 600;
	font-size: 11px;


	
	
}

.hours {
	
	float: right;
	clear: right;
	text-align: right;
	translate(0% ,0%)
	padding-right: 40px;
	font-family: 'Kanit', sans-serif;
	font-weight: 600;
		font-size: 11px;



	
	
}
.burst {
	width: 30%;
	float: right;
	margin-top: -22px;
    margin-right: 24px;
}
	
	.btn:link, .btn:visited {
    text-decoration: none;
    text-transform: uppercase;
    position: relative;
    top: -17px;
    left: 2px;
    padding: 11px 17px 13px 22px;
    border-radius: 0px;
    display: inline-block;
    transition: all .5s;
}
.rightsidemain {
	background-position: 100%;
	width: 51%;
	height: 122px;
	overflow: scroll;
	font-color: #28406c;
	font-size: x-small;
	background-position: center center;
	float: right;
}
.div1 {
	height: 300px;
	width: 30%;
	font-family: 'Kanit', sans-serif;
	color: #28406c;
	float: left;
	font-size: small;
	padding-left:4%;
	text-align: left;
	font-weight: 600;
	padding-top: 5%;
	
	
}
.upload {
	
	    width: 95%;
    height: auto;
	
}
.midtopbanner {
	padding-left: 20px;
	padding-right: 25px;
	padding-top: 15px;
	padding-bottom: 20px;
	font-family: 'Raleway', sans-serif;
	font colo: white;
	textialign: right;
	font-family: 'Raleway', sans-serif;
	height: 100px;
	
 }
/* Add a black background color to the top navigation */
.topnav {
	    background-color: #f2f2f2;
    overflow: hidden;
    width: 100%;
    margin-top: 24px;
}
.div2 {
	height: 300px;
	width: 30%;
	font-family: 'Kanit', sans-serif;
	color: #28406c;
	float: left;
	font-size: small;
	padding-left: 2%;
	text-align: left;
	font-weight: 600;
	padding-top: 5%;
	
}
.div3 {
	height: 300px;
	width: 30%;
	font-family: 'Kanit', sans-serif;
	color: #28406c;
	float: left;
	font-size: small;
	padding-left: 2%;
	text-align: left;
	font-weight: 600;
	padding-top: 5%;
	padding-right: 1%;



	
	
}

.wedesign {
	
	margin-bottom: -16px;
	
	
	
	
}
.wedesign2 {
	
margin-bottom: 0px;
	
	}
.bottombanner {
	background-colo: white;
	height: 350px;
	margin-top: 105px;

}
.social {
	
	Float: right;
    clear: right;
    width: auto;
	-ms-transform: scale(0.5, 0.5); /* IE 9 */
  -webkit-transform: scale(0.5, 0.5); /* Safari */
  transform: scale(0.8, 0.8);

}
	
.hr {
	color: #4CAF50;
}
	
	.topbar {
		
		
		font-size: 11px;
		
		
	}
	
	

}




@media only screen and (max-width: 320px) {
	
	
	h1, h2, h3, h4, h5, h6 {
    font-size: small;
    font-family: 'Raleway', sans-serif;
    color: #28406c;
    font-weight: 900;
    line-height: 12px;
}
	
	
	
	
	.fa-envelope {
    padding-left: 0px;
		
}
	
	
.btn-white {
	background: #97de2f;
	color: #ffffff;
	height: 8px;
	width: 352px;
	text-align: center;
	line-height: 13px;
	font-weight: bolder;
}
	
	
	.mailer {
		
		width: 90%;
		height: auto;
		
		
	}
  
	.btn-white {
      background: #97de2f;
    color: #ffffff;
    height: 5px;
    width: 29%;
    text-align: center;
    font-size: 8px;
}
	
	
	.leftsidemain {

	  height: 122px;

	
	}
	
	.topnav a {

    font-size: 7px;
   
}
	
	.alienlogo {

	position:left;
	width: 55%;
	height:auto;
}
	
	
	.callus {
    float: right;
    text-align: right;
	translate(0% ,0%)
	padding-left: 111px;
    padding-left: 41px;
	font-family: 'Kanit', sans-serif;
	font-weight: 600;
	font-size: 11px;


	
	
}

.hours {
	
	float: right;
	clear: right;
	text-align: right;
	translate(0% ,0%)
	padding-right: 40px;
	font-family: 'Kanit', sans-serif;
	font-weight: 600;
		font-size: 11px;



	
	
}
.burst {
	width: 30%;
	float: right;
	margin-top: -22px;
    margin-right: 24px;
}
	
	.btn:link, .btn:visited {
    text-decoration: none;
    text-transform: uppercase;
    position: relative;
    top: -17px;
    left: 2px;
    padding: 11px 17px 13px 22px;
    border-radius: 0px;
    display: inline-block;
    transition: all .5s;
}
.rightsidemain {
	background-position: 100%;
	width: 51%;
	height: 122px;
	overflow: scroll;
	font-color: #28406c;
	font-size: x-small;
	background-position: center center;
	float: right;
}
.div1 {
	height: 300px;
	width: 30%;
	font-family: 'Kanit', sans-serif;
	color: #28406c;
	float: left;
	font-size: small;
	padding-left:4%;
	text-align: left;
	font-weight: 600;
	padding-top: 5%;
	
	
}
.upload {
	
	    width: 95%;
    height: auto;
	
}
.midtopbanner {
	padding-left: 20px;
	padding-right: 25px;
	padding-top: 15px;
	padding-bottom: 20px;
	font-family: 'Raleway', sans-serif;
	font colo: white;
	textialign: right;
	font-family: 'Raleway', sans-serif;
	height: 100px;
	
 }
/* Add a black background color to the top navigation */
.topnav {
	    background-color: #f2f2f2;
    overflow: hidden;
    width: 100%;
    margin-top: 24px;
}
.div2 {
	height: 300px;
	width: 30%;
	font-family: 'Kanit', sans-serif;
	color: #28406c;
	float: left;
	font-size: small;
	padding-left: 2%;
	text-align: left;
	font-weight: 600;
	padding-top: 5%;
	
}
.div3 {
	height: 300px;
	width: 30%;
	font-family: 'Kanit', sans-serif;
	color: #28406c;
	float: left;
	font-size: small;
	padding-left: 2%;
	text-align: left;
	font-weight: 600;
	padding-top: 5%;
	padding-right: 1%;



	
	
}

.wedesign {
	
	margin-bottom: -16px;
	
	
	
	
}
.wedesign2 {
	
margin-bottom: 0px;
	
	}
.bottombanner {
	background-colo: white;
	height: 350px;
	margin-top: 105px;

}
.social {
	
	Float: right;
    clear: right;
    width: auto;
	-ms-transform: scale(0.5, 0.5); /* IE 9 */
  -webkit-transform: scale(0.5, 0.5); /* Safari */
  transform: scale(0.8, 0.8);
	
	

}
	
.hr {
	color: #4CAF50;
}
	
	.topbar {
		
		
		font-size: 11px;
		
		
	}
	
	

}