/*common*/
	body{
		font-family: "Roboto", sans-serif;
		font-size: 1rem;
		font-weight: 300;
   		word-break: break-word;
	}
	a{
		text-decoration: none !important;
		color: inherit !important;
	}
	.readonly{
		background: #f0f0f0 !important; 
	}
	.modal.show .modal-dialog {
	    transform: none;
	    width: 95%;
	    max-width: 1000px;
	}
	.pageheading h2{
		font-weight: 600;
		font-size: 1.7rem !important;
		color: #4e5774;
	}
	.pageheading p{
		font-weight: 400;
		font-size: 1.1rem;
	}
	img{
		width: fit-content;
		max-width: 100% !important;
	}
	@media (max-width: 991px) {
		.container{
			max-width: 100% !important;
		}
		section{
			padding-left: 20px !important;
			padding-right: 20px !important;
		}
	}
	@media (max-width: 767px) {
		section{
			padding-left: 15px !important;
			padding-right: 15px !important;
		}
		.pageheading h2{
			font-size: 1.5rem !important;
		}
		.pageheading p{
			font-size: 0.9rem !important;
		}
	}
	@media (max-width: 575px) {
		.pageheading h2{
			font-size: 1.3rem !important;
		}
	}
/*common*/

/*HEADER*/
	header{
		background: #fff;
	}
	header .row{
		justify-items: center;
		align-items: center;
	}
	
	header .fa-regular, header .fa-solid{
		color: #535d80;
	}
	header img{
		max-height: 80px;
	}
	.navbar{
		background: #fff !important;
		padding: 0px;
	}
	.navbar .nav-item a {
	    color: #4c4b4b !important;
	    padding: 5px 20px !important;
	    font-weight: 300;
	}
	.navbar-nav .nav-link.active, .navbar a:hover{
		color: #fff;
		font-weight: bold;
	}
	.navbar-expand-lg .navbar-nav {
        flex-direction: row;
        margin-left: auto;
    }
	@media (max-width: 991px) {
		.navbar-toggler{
			border: none;
			color: #fff;
			font-weight: 300;
			width:max-content;
			text-align: left;
			padding: 0px;
			font-size: 1.1rem;
		}
		.navbar-collapse{
			border-top:solid 1px #ccc;
		}
		.navbar-expand-lg .navbar-nav{
			flex-direction: column;
		}
		.navbar-toggler:focus{
			border: none;
			box-shadow: none;
		}
		.navbar{
			padding: 5px;
		}
		.navbar-nav{
			padding: 10px;
		}
		.navbar-nav li{
			padding: 5px 0px;
			border-bottom: solid 1px #ffffff29;
		}
		.navbar-nav .dropdown-menu{
			background: none;
			border: none;
		}
		.navbar-nav .nav-link.active, .navbar-nav .nav-link.show{
			color: #fff;
		}
	}
	@media (max-width: 575px) {
		header .col-xs-12{
			text-align: center;
		}
		.headerCon{
			display: none;
		}
		.headerConMob {
	    display: block;
	    font-size: 0.6rem;
	    text-align: center;
	    background: #f5f5f5;
	    padding: 5px;
		}
	}
/*HEADER*/

/*Footer*/
	footer{
		background: #ebebeb;
		padding: 20px 20px 0px 20px;
	}
	footer h2{
		font-size: 0.9rem;
	}
	footer p{
		font-size: 0.8rem;
	}
	footer li{
		font-size: 0.8rem;
		list-style: none;
	}
	footer ul{
		padding-left: 0px;
	}
	footer img{
		max-width: 170px;
	}
	footer .fas{
		color: #555;
	}
	footer .fab{
		color: #555;
		font-size: 1.2rem;
	}
	#copyright{
		background: #e0dfdf;
		width: 100%;
	}
	#copyright p{
		margin-bottom: 0px;
		color: #333;
		font-size: 0.8rem;
		padding: 5px;
	}
	#copyright .text-right{
		text-align: right;
	}
	@media (max-width: 767px) {
		footer{
			text-align: center;
		}
		footer{
			padding: 20px;
		}
	}
	@media (max-width: 575px) {
		footer h2{
			margin-bottom: 2px;
		}
		footer .fab{
			margin-bottom: 15px;
		}
	}
/*Footer*/

/*Banner*/
	#innerBanner{
		background: #FBF6F6;
	}
	#innerBanner .row{
		display: flex;
		align-items: stretch !important;
		text-align: center;
	}
	#innerBanner h1{
		color: #333;
		margin: 30px 0px 0px 0px;
		font-size: 2rem;
		font-family: "Lora", serif !important;
	}
	#innerBanner .row{
		align-items: center;
	}
	#innerBanner ul {
	    padding: 0px;
	    color: #333;
	    text-align: center;
	    font-weight: 400;
	    margin-bottom: 30px;
	    width: 100%;
	    float: right;
	}
	#innerBanner li {
	    display: inline-block;
	    padding: 0px 10px;
	    font-family: "Lora", serif !important;
	}
	@media (max-width: 991px) {
		#innerBanner{
			background-size: cover !important;
		}
		#innerBanner .col-md-4, #innerBanner .col-md-8{
			text-align: center !important;
			width: 100%;
		}
		#innerBanner h1{
			margin-bottom: 0px !important;
		}
		#innerBanner ul{
			margin-bottom: 30px;
			width: 100% !important;
			text-align: center;
		}
	}
	@media (max-width: 991px) {
		#innerBanner{
			padding: 0px !important;
		}
		#innerBanner .col-md-8, #innerBanner .col-md-4{
			background: none !important;
		}
	}
	@media (max-width: 767px) {
		#innerBanner h1{
			font-size: 1.5rem;
		}
		#innerBanner li {
			font-size: 0.9rem;
		}
	}

	@media (max-width: 575px) {
		.innerBanner h1{
			font-size: 1rem;
		}
		.innerBanner li {
			font-size: 0.8rem;
		}
	}
/*Banner*/

/*SLIDER*/
	.hero {
      background: url('../images/banner.png') no-repeat center; #5c6066;
      background-size: cover;
      color: #fff;
      padding: 120px 0;
      text-align: center;
      height:85vh;
      display: flex;
	  align-items: center;
	  justify-content: center;
	  text-align: center;
    }
    .hero .btn-light{
    	color: #343a40 !important;
    }
/*SLIDER*/

/*home1*/
	#home1{
		padding: 30px 0px 20px 0px;
		background: #fbf6f6;
	}
	#home1 .row{
		align-items: center;
	}
	#home1 h2 {
	    font-size: 1.7rem !important;
	    color: #cd840c;
	    font-weight: 400;
	}
	#home1 p{
		font-size: 1rem;
		color: #282828;
		font-weight: 300;
	}
	#home1 a{
		color: #000 !important;
		font-weight: 400;
	}
	@media (max-width: 767px) {
	  #home1 {
	    padding: 30px 0px 10px 0px;
		}
		#home1 h2{
			font-size: 1.5rem !important;
		}
		#home1 p{
			font-size: 0.9rem !important;
		}
	}
	@media (max-width: 575px) {
		#home1 h2{
			font-size: 1.3rem !important;
		}
	}
/*home1*/

/*home2*/
	#home2{
		padding: 60px 0px 60px 0px;
		background: url('../images/bg.png') #bfbfbf !important;
	}
	#home2 .row{
		align-items: center;
	}
	#home2 h2 {
	    font-size: 1.7rem !important;
	    color: #212529;
	    font-weight: 400;
	    text-align: center;
	}
	#home2 p{
		font-size: 1.2rem;
		color: #212529;
		text-align: center;
		font-weight: 300;
		margin-bottom: 30px;
	}
	.image-row {
		display: flex;
		justify-content: center;
		gap: 20px;
	}
	.image-box {
		position: relative;
		width: 33.33%;
		overflow: hidden;
		cursor: pointer;
	}
	.image-box img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: 0.4s;
	}
	.overlay {
		position: absolute;
		inset: 0;
		background: rgba(0,0,0,0.6);
		opacity: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
		padding: 20px;
		transition: 0.4s;
	}
	.overlay h3 {
		margin: 0px;
		font-size: 2rem;
		color: #fff;
		margin-top:20px !important;
	}
	.overlay p {
		font-size: 14px;
		margin-top: 10px;
	}
	.image-box:hover img {
		transform: scale(1.1);
	}
	.image-box:hover .overlay {
		opacity: 1;
	}
	.image-box:hover .overlay div {
	  	transform: translateY(0);
	}
	.image-box .fa-chart-pie, .image-box .fa-map, .image-box .fa-paper-plane{
		color: #FFE600;
		font-size: 3rem;
	}
    @media (max-width: 768px) {
		.image-box {
			width: 90%;
			height: 300px;
		}
    }
    @media (max-width: 767px) {
	  #home2 {
	    padding: 30px 0px 10px 0px;
		}
		#home2 h2{
			font-size: 1.5rem !important;
		}
		#home2 p{
			font-size: 0.9rem !important;
		}
	}
	@media (max-width: 575px) {
		#home2 h2{
			font-size: 1.3rem !important;
		}
	}
/*home2*/

/*home3*/
	#home3{
		padding: 60px 0px 60px 0px;
	}
	#home3 .row{
		align-items: center;
	}
	#home3 h4{
		color: #333;
		font-size: 2rem;
		font-weight: 300;
		margin-bottom: 30px;
	}
	.grid {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 40px;
	}
	.item {
		display: flex;
		align-items: flex-start;
		gap: 20px;
	}
	.icon {
		min-width: 50px;
		height: 50px;
		background: #ffd400;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 20px;
		color: #000;
		box-shadow: 0 3px 6px rgba(0,0,0,0.2);
	}
	.content h3 {
		margin: 0;
		font-size: 20px;
		color: #222;
		font-weight: 300;
	}
	.content p {
		margin-top: 8px;
		color: #666;
		line-height: 1.6;
		font-size: 14px;
	}
	@media (max-width: 768px) {
	  	.grid {
	    	grid-template-columns: 1fr;
	  	}
	}
	@media (max-width: 767px) {
	  #home3 {
	    padding: 30px 0px 10px 0px;
		}
		#home3 h3{
			font-size: 1.2rem !important;
		}
		#home3 h4{
			font-size: 1.5rem !important;
		}
		#home3 p{
			font-size: 0.9rem !important;
		}
	}
	@media (max-width: 575px) {
		#home3 h3{
			font-size: 1rem !important;
		}
		#home3 h4{
			font-size: 1.3rem !important;
		}
	}
/*home3*/

/*home4*/
	#home4 {
		background: #333;
		color: #fff;
		text-align: center;
		padding: 80px 0;
	}
	@media (max-width: 767px) {
		#home4 h3{
			font-size: 1.3rem !important;
		}
	}
	@media (max-width: 575px) {
		#home4 h3{
			font-size: 1.1rem !important;
		}
	}
/*home4*/

/*About1*/
	#about1{
		padding: 30px 0px 20px 0px;
	}
	#about1 .row{
		align-items: center;
	}
	#about1 h2 {
	    font-size: 1.7rem !important;
	    color: #333;
	    font-weight: 400;
	}
	#about1 h2 span {
		color: #cd840c !important;
	}
	#about1 h3 {
	    font-size: 1.2rem !important;
	    color: #333;
	    font-weight: 300;
	}
	#about1 p{
		font-size: 1rem;
		color: #282828;
		font-weight: 300;
	}
	@media (max-width: 767px) {
	  	#about1 {
	    	padding: 30px 0px 10px 0px;
		}
		#about1 h2{
			font-size: 1.5rem !important;
		}
		#about1 h3{
			font-size: 1.1rem !important;
		}
		#about1 p, #about1 li{
			font-size: 0.9rem !important;
		}
	}
	@media (max-width: 575px) {
		#about1 h2{
			font-size: 1.3rem !important;
		}
		#about1 h3{
			font-size: 1rem !important;
		}
	}
/*About1*/

/*about2*/
	#about2{
		margin-bottom: 50px;
	}
	#about2 .col-md-6 {
	    background: #E5E6E9;
	    min-height: 600px;
	    display: flex;
	    flex-wrap: wrap;
	    align-content: center;
	    padding: 50px;
	}
	.imageprofile{
		background: url('../images/Jamal-Qureshi.jpg') no-repeat center center !important;
		background-size: cover;
		border-top-left-radius: 20px !important;
		border-bottom-left-radius: 20px !important;
	}
	.profiletext{
		border-top-right-radius: 20px !important;
		border-bottom-right-radius: 20px !important;
	}
	#about2 .row{
		display: flex;
	}
	@media (max-width: 767px) {
	  	#about2 {
	    	padding: 0px 0px 10px 0px;
		}
		#about1 h2{
			font-size: 1.5rem !important;
		}
		#about1 p{
			font-size: 0.9rem !important;
		}
		.imageprofile{
			border-top-right-radius: 20px !important;
			border-top-right-radius: 20px !important;
			border-bottom-left-radius: 0px !important;
			border-bottom-right-radius: 0px !important;
		}
		.profiletext{
			border-top-right-radius: 0px !important;
			border-top-right-radius: 0px !important;
			border-bottom-left-radius: 20px !important;
			border-bottom-right-radius: 20px !important;
			min-height: max-content !important;
			display: block;
			padding: 20px !important;
		}
		#about2{
			min-height: max-content !important;
		}
	}
	@media (max-width: 575px) {
		#about1 h2{
			font-size: 1.3rem !important;
		}
	}
/*about2*/

/*about3*/	
	#about3{
		background: url('../images/about_bg.jpg') no-repeat center center !important;
		background-size: cover;
		color: #fff;
		padding: 60px 0px;
	}
	#about3 h2{
		text-align: center;
		text-transform: uppercase;
		font-size: 2.5rem;
	}
	#about3 .fa-quote-left{
		color: #FFE600;
		font-size: 3rem;
	}

	@media (max-width: 767px) {
	  	#about3 {
	    	padding: 30px 0px 10px 0px;
		}
		#about3 h2{
			font-size: 1.5rem !important;
		}
		#about3 .fa-quote-left{
			font-size: 1.2rem;
		}
		#about3 p{
			font-size: 0.9rem !important;
		}
	}
	@media (max-width: 575px) {
		#about3 h2{
			font-size: 1.3rem !important;
		}
	}
/*about3*/

/*projManagement*/
	#projManagement{
		background: #E5E6E9;
		padding: 30px 0px 50px 0px;
	}
	#projManagement p{
		text-align: center;
		font-size: 1.4rem;
		color: #000;
	}
	#projManagement img{
		max-height: 500px;
	}
	#projManagement .text-right{
		text-align: right;
	}
	@media (max-width: 767px) {
		#projManagement .col-md-6{
			width: 50% !important;
		}
		#projManagement p{
			font-size: 1.4rem !important;
			line-height: 25px;
		}
	}
	@media (max-width: 575px) {
		#projManagement .text-right{
			text-align: center;
		}
		#projManagement p{
			font-size: 1.3rem !important;
		}
	}
/*projManagement*/

/*projOverview*/
	.overview p{
		font-size: 1.2rem !important;
	}
	.overview{
		padding: 50px 0px 30px 0px !important;
	}
	.overview .col-md-12{
		margin-top: 20px !important;
	}
/*projOverview*/

/*sitemap*/
	#sitemap2 .container {
	  margin: auto;
	  padding: 0px 30px;
	}
	#sitemap2 h3{
		font-size: 1.2rem;
	}
	@media (max-width: 767px) {
		#sitemap2 h3{
			font-size: 1.1rem;
		}
		#sitemap2 li{
			font-size: 0.9rem;
		}
	}
/*sitemap*/

/*contactus*/
	#contact2{
	 	padding: 50px 0px !important;
	}
	#contact2 .row{
	 	align-items: center;
	}
	#contact2 h2{
		color: #cd840c;
		font-size: 1.7rem;
		font-weight: 500;
	}
	#contact2 h3{
		color: #222222;
		font-size: 1.1rem;
		font-weight: 500;
	}
	#contact2 p{
		color: #222222;
		font-size: 1rem;
		font-weight: 300;
	}
	#contact1{
		background: #fbf6f6;
		padding: 30px 0px 40px 0px;
	}
	#contact1 .row{
		align-items: top;
	}
	#contact1 h2 {
	    font-size: 1.7rem !important;
	    color: #333;
	    font-weight: 400;
	}
	#contact1 h2 span {
		color: #cd840c !important;
	}
	#contact1 .form-control{
		margin-bottom: 10px;
	}
	#contact1 label{
		font-weight: 400;
	}
	#contact1 #enqBtn{
		margin-top: 10px;
	}
	@media (max-width: 767px) {
		#contact2 h2, #contact1 h2{
			font-size: 1.3rem !important;
		}
		#contact2 p, #contact1 p{
			font-size: 0.9rem;
		}
		#contact2 iframe{
			margin-bottom: 20px;
		}
		#contact1, #contact2{
			padding: 30px 20px 30px 20px !important;
		}
		#contact1 #enqBtn{
			margin-bottom: 20px;
		}
	}
/*contactus*/
@media (max-width: 767px) {
	#projManagement p{
		font-size: 0.9rem !important;
		line-height: 22px !important;
	}
}