body{
	height: 100%;
	width: 100%;
	margin: 0;
	padding: 0;
}
html{
	margin: 0;
	padding: 0;
	scroll-behavior: smooth;
}

html, body {
    max-width: 100% !important;
    overflow-x: hidden !important;
}

#gradient {
	height: 100%;
	/* background-image: linear-gradient(to bottom, rgba(255,251,231), rgba(255,236,139)); */
	background-image: url("images/bg1.jpg");
	background-repeat: repeat;
	background-size:auto;
}
.container{
	max-width: 100%;
	margin: 0;
	padding: 0;
}

.navbar{
	max-width: 100%;
	background-color: #fffbe7;
	/*height: 70px;*/
	top: 0;
	padding-bottom: 0px;
}

.row{
	max-width: 100%;
	margin: 0;
}

.navbar a{
	text-decoration: none;
	margin: 0; 
	padding-right: 10px;
	color: #000;
}

.nav_left{
	padding-top: 0px;
	font-size: 30px; 
	font-weight: 800;
	/*margin-left: 100px;*/
	font-family: 'Khula', sans-serif;
}
.nav_left a{
	padding-top: 5px;
}
.nav_left_margin{ 
	margin-left: 100px;
}
.nav_right_margin{
	margin-left: 140px;
}
.nav_logo{
	width: 2rem;
	margin-right: 10px;
	margin-bottom: 8px;
	margin-top: 5px;
}
.nav-item{
	float: right;
	font-family: 'Khula', sans-serif;
	font-weight: 400;
	padding: 13px 25px 16px 25px;
	letter-spacing: -.5px;
	color: #000;
	display: inline-block;
}
.nav-item:hover{
	padding-top: 15px;
	padding-bottom: 13px;
	border-bottom: 4px solid #204D27;
	line-height: 20px;
}
.navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 1rem;
    padding-left: 1rem;
}
.navbar-toggler{
	float: right;
	margin-right: 5px;
	margin-bottom: 7px;
	margin-top: 4px;
	background-color: none;
	border: none;
	padding: 0px;
}
.navbar-toggler a{
	/*margin-left: */
}
.nav_right{
	margin-bottom: 10px;
	margin-right: 150px;
	display: inline-block;
	float: right;

}
.nav_right a{
	margin: 0px 0px 0px 0px;
	padding: 20px 18px 18px 18px;
	font-family: 'Khula', sans-serif;
	font-weight: 400;
}
.nav_right a:hover{
	padding-top: 15px;
	padding-bottom: 13px;
	border-bottom: 4px solid #204D27;
	line-height: 25px;
}
.modal-content{
	z-index: -1;
	min-height: 90vh;
	width: 100%;
	background-color: #f8f8f8;
	/*d6ddd7*/
}
.modal-content a{
	font-family: 'Khula', sans-serif;
	font-weight: 600;
	margin: 20px 20px 20px 20px;
}
.modal-header{
	margin: 0;
	padding: 0;
	background-color: #f8f8f8;
	/*box-shadow: 0px 4px 7px -1px #b2b2b2;*/
}
.modal-header a{
	font-weight: 600;
	margin-left: 10px;
}
.modal_logo{
	margin: 15px 0px 0px 20px;
	width: 2rem;
}
.modal-body{
	font-family: 'Khula', sans-serif;
	font-size: 16px;
	font-weight: 600;
}
.g-recaptcha{
	transform:scale(.9);
	-webkit-transform:scale(.9);
	transform-origin:0 0;
	-webkit-transform-origin:0 0;"
}

.icon{
	padding: 9.5px;
	background-color: #ececec;
	border: solid #ced4da 1px;
	text-align: center;
	display: block;
	min-width: 45px;
	border-radius: 5px 0 0 5px;
}
.input-field{
	padding: 10px;
}

.form-control {
	background-color: #fff;
}
.form-control:focus {
    border-color: #a3d1a3;
    box-shadow: 0px 1px 1px rgba(250, 250, 250, 0.075) inset, 0px 0px 5px rgba(206,212,218, 1);
}
.txtbox_font{
	padding-top: 11px;
	font-size: 15px;
	font-family: 'Khula', sans-serif;
	font-weight: 400;
}
.txtbox_font_select{
	padding-top: 5px;
	font-size: 16px;
	font-family: 'Khula', sans-serif;
	font-weight: 400;
	color: gray;
}
.btn_close{
	float: right; 
	padding: 3px 10px 10px 10px; 
	background-color: gray; 
	margin-right: 20px;
}
.btn_submit{
	float: right;
	/*margin-top: 10px;*/
	font-family: 'Khula', sans-serif;
	padding: 5px 10px 3px 10px;
	margin-bottom: 20px;
	border-radius: 5px;
	background-color: #005c00;
	color: #fff;
	border: 0px;
}
.btn_submit:hover{
	background-color: #006600;
}

.section1_logo{
	width: 6rem;
	padding-bottom: 10px;
}
.lst{
	background-color: #325738;
	padding: 10px 15px 10px 15px;
	border-radius: 25px;
	text-decoration: none;
	cursor: pointer;
  	box-shadow: 4px 5px #9f9f9f;
}
.lst:hover{
	background-color: #1c4523;
}
.lst a{
	display: inline-block;
}

/*.lst h5{
	font-family: 'Exo', sans-serif; 
	color: #f8f8f8; 
}*/
.section_1{
	/*background-color: #;*/
	height: 100vh;
	margin-top: -1px;
	/*min-height: 100vh;*/
	padding-top: 55px;
}
.section1_pad{
	background-color: rgba(255,255,255);
	/*box-shadow: 15px 10px 20px #d7d7d7; */
	margin: 0px 0px 35px 0px;
	/*border-radius: 15px;*/
	padding: 30px 130px 30px 130px;
	border-bottom: solid #ededed 1px;
}
.section1_pad:last-child{
	border-bottom: none;
}
.section1_pad_right{
	background-color: rgba(255,255,255);
	/*box-shadow: 1px 10px 80px 0px #d7d7d7; */
	margin: 0px 0px 35px 0px;
	/*border-radius: 15px;*/
	padding: 30px 130px 30px 130px;
	border-bottom: solid #ededed 1px;
}
.section1_pad_right h3{
	text-align: left;
	padding-top: 20px;
	padding-left: 20px;
	letter-spacing: -.5px;
}
.section1_pad_right p{
	padding-left: 20px;
}
.section1_pad p{
	/*line-height: 23px; */
	font-size: 17px;
	color: gray;
}
.section1_pad h3{
	text-align: left;
	padding-top: 20px;
	letter-spacing: -.5px;
}
.section1_margin{
	margin-top: 300px;
}
.section1_p{
	text-align: left;
	margin-bottom: 0px;
}
.section1_p_right{
	text-align: left;
	margin-bottom: 0px;
	font-size: 17px;
}

.section_about_us{
	background-color: #fff;
	height: 100%;
	padding: 50px 0px 50px 0px;
}
.about_us_img{
	width: 15rem;
	float: left;
	/*display: block;*/
	/*filter: grayscale(30%);*/
	filter: sepia(40%);
}
.about_us_img_right{
	width: 15rem;
	float: right;
	/*display: block;*/
	/*filter: grayscale(30%);*/
	filter: sepia(40%);
}

.section_2{
	background-color: #204D27;
	height: 100%;
	padding: 50px 30px 30px 25px; 
	/*max-height: 100%;*/
}

.pad{
	/*background-color: rgba(28,69,35, .6);*/
	height: 100%;
	width: 100%;
	margin-bottom: 0px;
	border-radius: 15px;
}
.pad_colored{
	background-color: rgba(28,69,35, .5);
	height: 100%;
	width: 100%;
	margin-bottom: 0px;
	border-radius: 0px;
}
.pad a{
	font-size: 17px;
}
.pad_title{
	color: #fff;
	font-size: 1.25rem;
	margin-top: 20px;
	margin-bottom: 5px;
	font-weight: 400;
	font-family: 'Khula', sans-serif;
	letter-spacing: -.5px;
}
.pad_body{
	color: #fff;
	font-size: 14px;
	margin: 0px 50px 50px 50px;
	font-weight: 300;
	text-align: center;
	font-family: 'Khula', sans-serif;
}
.pad_body_right{
	color: #fff;
	font-size: 14px;
	margin: 0px 50px 50px 50px;
	font-weight: 300;
	text-align: center;
	font-family: 'Khula', sans-serif;
}
.prog_lang{
	width: 4rem;
	margin: 10px;
}
.prog_lang:hover{
	opacity: 0.8;
}
.jquery{ 
	width: 5rem;
}
.soft_dev{
	width: 5rem;
	margin-top: 40px;
	color: #fff;
}
.section_3{
	background-color: #e5e5e5;
	height: 100%;
}
.section_3 h5{
	font-family: 'Khula', 
	sans-serif; font-weight: 400;
	/*font-size: 20px;*/
	margin-top: 30px;
	letter-spacing: -.5px;
}
.logo{
	width: 200px;
	height: 170px;
	background-color: #fff;
	border: solid #d8d8d8 1px;
	margin: 3px;
	border-radius: 0px;
	display: inline-block;
	padding-top: 20px;
}
.logo:hover{
	box-shadow: 0 0 2px 1px rgba(164,164,164, 0.5);
}
.clients li{
	display: inline;
	margin-left: 0;
}


.burlington{
	width: 10rem;
	/*margin-bottom: px;*/
	padding-top: 10px;
	display: block;
	margin-top: 5%;
	margin-left: auto;
	margin-right: auto;
}
.tire_republic{
	width: 10rem;
	/*height: 3rem;*/
	padding-top: 50px;
	margin-left: auto;
	margin-right: auto;
	display: block;
}
.reswerkes{
	width: 7rem;
	padding-top: 35px;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.kfi{
	width: 7rem;
	margin-bottom: 20px;
	padding-top: 20px;
	/*padding: 36px 10px 36px 10px;
	background-color: #fff;
	border: solid #d8d8d8 2px;
	border-radius: 15px;*/
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.luminaire{
	width: 9rem;
	margin-bottom: 0px;
	padding-top: 35px;
	/*height: 11rem;*/
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.vsp1{
	width: 4.5rem;
	margin-bottom: 10px;
	padding-top: 17px;
	/*padding-left: 15px;
	padding-right: 15px;*/
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.b-ashlar{
	width: 7.5rem;
	margin-bottom: 40px;
	padding-top: 45px;
	/*padding: 60px 20px 60px 20px;
	background-color: #fff;
	border: solid #d8d8d8 2px;
	border-radius: 15px;*/
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.masagana{
	width: 6rem;
	padding-top: 10px;
	/*padding: 27px 10px 26px 10px;
	background-color: #fff;
	border: solid #d8d8d8 2px;
	margin-left: 10px;
	border-radius: 15px;*/
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.vsp{
	width: 8.5rem;
	padding: 50px 15px 50px 15px;
	background-color: #fff;
	border: solid #d8d8d8 2px;
	/*margin-right: 10px;*/
	border-radius: 15px;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.edgeworth{
	width: 7.5rem;
	padding-top: 15px;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
.redmaroon{
	width: 7rem;
	padding-top: 35px;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.section_4{
	background-color: #1c4523;;
	height: 100%;
}
.section_4 p{
	line-height: 5px;
	font-size: 13px;
	color:#cecece;
}
.section4_margin{
	margin-bottom: 0px;
}
.footer_menu{
	width: 100%;
	margin-top: 20px;
}
.footer_menu a{
	color: #cecece;
	margin-left: 30px;
	margin-right: 30px;
	text-decoration: none;
	padding: 20px 0px 20px 0px;
	font-weight: 600;
	font-family: 'Khula', sans-serif;
}
.footer_menu a:hover{
	color: #fff;
}

.fb,.twitter,.yahoo{
	width: 1.7rem;
 	filter: grayscale(100%);
 	border-radius: 5px; 
}
.yahoo:hover{
	opacity: 0.7;
}
.fb:hover{
	opacity: 0.7;
}
.twitter:hover{
	opacity: 0.7;
}

.footer_lst{
	background-color: #325738;
	height: 100%;
	padding-top: 13px;
	padding-bottom: 1px;
}

.footer_lst p{
	color: #e5e5e5;
	padding-top:10px;
	font-size: 15px;
	font-weight: 300;
	font-family: 'Khula', sans-serif;
}

.khula_p{
	font-size: 15px !important;
	font-weight: 300; 
	font-family: 'Khula', sans-serif;
}

.hide{
	display: none;
}

/*for smartphones*/
@media (max-width: 575.98px) {

	html { scroll-behavior: auto; }
	.row { margin: 0; padding: 0; }
	.nav_left_margin { margin: 10px 0px 10px 0px; }
	.navbar a { margin: 0 0 0 0px; }
	.nav_left { font-size: 25px; }
	.section_1 { margin-top: 0; padding-top: 40px; }
	.section1_margin { margin-top: 300px; }
	.section_about_us { padding: 50px 0px 20px 0px; background-color: #e5e5e5;  }
	.nav-link { font-size: 15px; padding-left: 0px; }
	.navbar-nav .nav-link { padding-right: 0; padding-left: 20px; }
	.navbar-light .navbar-nav .nav-link.active { margin-left: -150px; }
	.nav-item:hover { padding-top: none; padding-bottom: none; border-bottom: none ; line-height: none; }
	.section_1 h5 { font-size: 1.1rem; }
	.section1_p { margin-left: 0px; margin-right: 0px; margin-bottom: 20px; font-size: 13px; }
	.section1_pad {  margin: 0px 0px 15px 0px; border-radius: 0px; 
					padding: 30px 30px 30px 30px; border-bottom: none; width: 90%; }
	.section1_pad p { font-size: 13px; text-align: center; }
	.section1_pad h3 { padding-top: 0px; text-align: center; font-size: 1.5rem; }
	.about_us_img { width: 100%; max-width: 14rem; display: block; margin-left: 20px; margin-right: 20px; }
	/*.section1_pad_right { box-shadow: 15px 10px 20px #d7d7d7; margin: 0px 0px 35px 0px; border-radius: 0px; 
					padding: 30px 30px 30px 30px; border-bottom: none; width: 85%; }
	.section1_pad_right h3 { text-align: left; padding-left: 0px; padding-top: 0px; }
	.section1_pad_right p { padding-left: 0px; padding-right: 0px; padding-bottom: 20px; }
	.section1_p_right { text-align: left; font-size: 13px; margin-right: 0px; }*/
	
	.about_us_img_right { width: 100%; max-width: 14rem; display: block; margin-right: 20px; margin-left: 20px;
	 					  margin-top: -10px; float: left; }
	.lst { background-color: #325738; padding: 9px 13px 8px 13px; border-radius: 25px; text-decoration: none; 
		   cursor: pointer; box-shadow: 4px 5px #9f9f9f; font-size: .9rem; font-family: 'Khula', sans-serif; }
  	.soft_dev { margin-top: 30px; width: 4.5rem; }
  	.prog_lang { width: 3rem; }
  	.prog_lang:hover { opacity: 1; }
  	.jquery { width: 4rem; }
  	.modal-header a { font-weight: 600; text-align: left; font-size: 13px; }
  	.modal-body { font-size: 13px; }
  	.modal_logo { margin: 25px 0px 0px 20px; }
  	.txtbox_font { font-size: 14px; }
  	.txtbox_font_select { font-size: 14px; padding-top: 6px; }
  	.icon { padding: 10px; }

	.section_2 { padding: 35px 5px 15px 5px; }
	.pad { border-radius: 0px; background-color: rgba(28,69,35, .6); }
	.pad_title { font-size: 15px; }
	.pad_body { margin: 0px 20px 30px 20px; font-size: 13px; }

	.section_3 p { font-size: 17px; margin-bottom: .8rem; }
	.logo { width: 150px;
	height: 120px;
	background-color: #fff;
	border: solid #d8d8d8 2px;
	margin: 3px;
	border-radius: 0px;
	display: inline-block;
	padding-top: 20px; }
	.logo:hover { box-shadow: 0 0 0px 0px rgba(164,164,164, 0.5); }
	.burlington { width: 8rem; padding-bottom: 0px; }
	.tire_republic { width: 7rem; padding-top: 30px; padding-bottom: 0px; }
	.reswerkes { width: 5.5rem; padding-top: 15px; padding-bottom: 0px; }
	.kfi { width: 5rem; padding-top: 10px; padding-bottom: 0px; }
	.masagana { width: 4.5rem; padding-top: 0px; padding-bottom: 0px; }
	.luminaire { width: 6.5rem; margin-bottom: 0px; padding-top: 20px; }
	.vsp1 { width: 3.5rem; margin-bottom: 0px; padding-top: 5px; }
	.b-ashlar { width: 5.5rem; margin-bottom: 0px; padding-top: 25px; }
	.edgeworth { width: 5.5rem; padding-top: 5px;  }
	.redmaroon { width: 6rem; padding-top: 20px; }

	.footer_menu { margin-left: 18px; }
	.footer_menu a { margin-left: -3px; font-size: 14px; }
	.footer_menu a:hover { color: #cecece; }
	.section_4 p { font-size: 11.5px; }
	.section4_margin{ margin-bottom: -20px; }
	.fb,.twitter,.yahoo { width: 1.7rem; }
	.fb:hover { opacity: 1; }
	.twitter:hover { opacity: 1; }
	.yahoo:hover { opacity: 1; }
	.footer_lst { padding-top: 13px; }
	.footer_lst p { font-size: 10px; }
	
}
/*for tablets/ipads*/
@media (min-width: 577px) and (max-width: 1024px) { 

	html { scroll-behavior: auto; }
	.navbar-light .navbar-nav .nav-link.active { margin-left: -150px; }
	.nav_left_margin { margin: 10px 0px 10px 5px; }
	.navbar-toggler { margin-right: 20px; }
	.nav-item:hover { padding-top: none; padding-bottom: none; border-bottom: none ; line-height: none; }
	.section1_margin { margin-top: 500px; }
	.footer_menu a:hover { color: #cecece; }
	.logo:hover { box-shadow: 0 0 0px 0px rgba(164,164,164, 0.5); }
	.about_us_img_right { width: 100%; max-width: 14rem; display: block; margin-right: 35px; margin-left: 25px;
	 					  margin-top: -10px; float: left; }
	.about_us_img { width: 100%; max-width: 14rem; display: block; margin-left: 35px; margin-right: 20px; float: left; }

}

@media (min-width: 1024px) and (max-width: 1100px) {

	.about_us_img_right { width: 100%; max-width: 14rem; display: block; margin-right: 70px; margin-left: 80px;
	 					  margin-top: -10px; float: left; }
	.about_us_img { width: 100%; max-width: 14rem; display: block; margin-right: 70px; margin-left: 80px; float: left; }
	.section1_pad h5 { padding-top: 0px; padding-left: 30px; }
	.section1_p { margin-left: 30px; margin-right: 30px; margin-bottom: 30px; }
	.section1_pad_right p { padding-left: 30px; padding-right: 30px; padding-bottom: 30px; }
	.section1_pad_right h5 { margin-left: 10px; }


}