a {
		text-decoration: none !important;
	}
/* 	@font-face {
    font-family: 'Cairo-aRegular';
    src: url('fonts/Cairo-aRegular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
} */

	@font-face {
	  font-family: 'DIN-NEXT-ARABIC' ;
	  src: url('fonts/DIN-NEXT-ARABIC-BOLD.otf');
	}
	
	
	@font-face {
	  font-family: 'droid-arabic-kufi' ;
	  src: url('fonts/droid-arabic-kufi.ttf');
	}

	@font-face {
	  font-family: swissra ;
	  src: url(css/fonts/swissra-medium.ttf);

	}
	
	@font-face {
	  font-family: TheSans ;
	  src: url(fonts/TheSans-Plain.otf);
	}
	
	
	/* Start Topbar*/
	/*
	#topbar {
		height: 30px;
		width: 100% ;
		background: #eee;
	    line-height: 30px;

	}
	#topbar .topbar-container {
		display: flex;
		justify-content: space-between;
	}

	
	*/
	/* End Topbar*/
	
	
	/* Start Header*/
	
	#header {
			background: #111a41;
	}
	
	#header .bg-dark {
		background-color: rgba(46, 63, 110, 0.1) !important;
		z-index: 9999;
		margin: 0 ;
		padding: 0 ;
		min-height: 100px;
		border-bottom: 1px solid rgba(255,255,255,0.25);
	}

	.navbar-brand {
		text-align: right;
	}

	.navbar-brand img {
		width: 115px;
		transition: .5s;
	}

	.navbar-brand img:hover {
		/*opacity: .8;*/
	}


	.menu-header-container {
		flex-grow: 1 ;
	}

	nav ul{
		list-style-type: none;
	}
	ul.navbar-nav {
	}

	ul.navbar-nav li a{
		color: #fff ;
		font-size: 90%;
		font-family: 'Tajawal', sans-serif;
		padding: 14px;
		transition: 2.5s ease ;
		text-decoration: none;
		letter-spacing: 1 ;
		display: inline ;
	}
	
		ul.navbar-nav li a:hover{
			color:#eee;
		}
	
		.current-menu-item a {
			color: #fff !important;
			width: 30% !important;
		}
	
		ul.navbar-nav li:hover a {
			color: #fff ;
			
		}

/*
		ul.navbar-nav li::after{
			content: "" ;
			height: 2px;
			width: 0 ;
			background: #4DB7FE;
			display:block ;
			opacity: .3 ;
			transition: .5s ease ;
			margin-top: 20px;
		}

		ul.navbar-nav li:hover::after  {
			width: 90%;
			opacity: 1 ;
		}
	
		ul.navbar-nav li.current-menu-item::after  {
		width: 90%;
		opacity: 1 ;
		
		}
*/
		
		.sub-menu { 
			visibility: hidden; 
			opacity: 0; 
			position: absolute;
			top: 100%;
			transform: translateY(-2em);
			z-index: -1;
			transition: all 0.3s ease-in-out 0s, visibility 0s linear 0.3s, z-index 0s linear 0.01s;
		}

		nav li:hover > ul.sub-menu{
		  visibility: visible; 
		  opacity: 1;
		  z-index: 1;
		  transform: translateY(0%);
		  transition-delay: 0s, 0s, 0.3s; 
		}

		.sub-menu li{
			width: auto;
			margin-right: -33px;
			text-align: right;
			background-color: #0d0d29cf;
			border-color: #e7e7e7;
			padding:8px;
			box-shadow: 0px 1px 0 0 #ccc;
		}
		
		.sub-menu li a {
			color: #fff;
			transition: .3s ease !important;
		}
		
		.sub-menu li a:hover {
			color: #4db6fd !important	;
		}
		
		.sub-menu li::after {
			content: "" ;
			margin-top: 5px !important ;
			height: 0 !important ;
		}

		.menu-item-has-children > a::after {
			content: "▼";
			font-size: 12px;
			padding-right:3px
		}


			/* Safari 4.0 - 8.0 */
		@-webkit-keyframes fixdSlide {
		  from {opacity: 0;}
		  to {opacity: 1;}
		}

		/* Standard syntax */
		@keyframes fixdSlide {
		  from {opacity: 0;}
		  to {opacity: 1;}
		}
		
	.fixed-top {
		transition: top 1s linear;
		transition-delay: 1s;
		-webkit-animation-name: fixdSlide; /* Safari 4.0 - 8.0 */
		-webkit-animation-duration: 2s; /* Safari 4.0 - 8.0 */
		animation-name: fixdSlide;
		animation-duration: 1s;
		margin-top: 0 !important ;

	}
	
	.fixed-header {
		height: 50px;
		background: silver;
	}
	
	.fixed-logo img {
		width: 150px !important;
		transition: .5s ease ;
	}
	
		/* Header Social Media Icons */
		
	.social-icons {

	}	
	
	.social-icons i {
		font-size: 20px;
		padding-right: 10px;
		transition: .5s ;
		text-align: left;
		color: #4DB7FE;
		
	}

	.social-icons i.fa-whatsapp:hover {
		color: #7ad06d;
	}

	.social-icons i.fa-twitter:hover {
		color: #76a9ea;
	}

	.social-icons i.fa-snapchat-ghost:hover {
		color: #fffd01;
		text-shadow: 0px 1px #333;
	}

	.social-icons i.fa-instagram:hover {
		color: #ac5717;
	}

	.social-icons i.fa-youtube:hover {
		color: #f61c0d;
	}

	.social-icons i:hover {
		opacity: 1;
		color: #4DB7FE;
		padding-right: 15px;
		transition: .5s ease ;
		-ms-transform: scalex(1.1); /* IE 9 */
		-webkit-transform: scalex(1.1); /* Safari 3-8 */
		transform: scaleX(1.1);
		transition: all .3s
	}
		/* End Header Social Media Icons */
	/* End Header*/
	
	/* Start Slider */
	
	 /* Video Slider*/
	 .home-video-slider {
		 margin-top: -120px;
		 position: relative;
	 }
	 
	 .home-video-slider:after {
		content: "";
		width: 30%;
		height: 65px;
		position: absolute;
		left: 0;
		-webkit-transform: skewY(7deg);
		transform: skewY(7deg);
		background-color: #fff;
		bottom: -34px;
		z-index: 9;
		}
	 
	 .home-video-slider:before {
		content: "";
		width: 70%;
		height: 69px;
		bottom: -31px;
		position: absolute;
		right: 0;
		-webkit-transform: skewY(-4deg);
		transform: skewY(-4deg);
		background-color: #ffffff;
		z-index: 9 ;
		}
		
	 
	 .slider-text {
		 position: absolute;
		 top: 35%;
		 left: 0;
		 right:0;
		 text-align: center;
		 z-index:2;
	 }
	 .slider-text  h1 {
		font-family: DIN-NEXT-ARABIC;
		color: #fff;
		font-size: 600%;
		margin: 20px 30px;
		text-shadow: 1px 1px 0px #000;
		 
		 
	 }
	 	 .slider-text p {
			color: #4DB7FE;
			line-height: 1.5em;		
			font-size: 150%;
			font-family: 'Tajawal', sans-serif ;

		 }
		 
	 .slider-text p::after {
		content: "";
		height: 2px;
		background: #4DB7FE;
		display: block;
		transition: .5s ease;
		margin-top: 10px;
		width: 50px;
		margin: 10px auto;
	 }



	#mainslider .carousel-item h1  {
		font-family: 'Tajawal', sans-serif ;
		font-size: 350%;
		margin-bottom: 50px;
		color: #fff ;
		font-weight: 800;
		 -webkit-animation-name: slide; /* Safari 4.0 - 8.0 */
		-webkit-animation-duration: 2s; /* Safari 4.0 - 8.0 */
		animation-name: fontSize;
		animation-duration: 2s;
		
	}
	




	 
		.home-video-slider .overlay {
			position: absolute;
			background: rgba(3, 1, 33, 0.9) !important;
			top: 0 ;
			right: 0;
			bottom: 0;
			left: 0;
			height: 99.3%;
			transition: .6s ease;
			opacity: .7;
			z-index: 1 ;
		} 
		
	#mainslider {
		z-index: 1;
	    margin-top: -134px; 
	}
	
	#mainslider .overlay {
		position: absolute;
		background: rgba(46, 63, 110, 0.6) !important;
		top: 0 ;
		right: 0;
		bottom: 0;
		left: 0;
		transition: .6s ease;
		opacity: .3;
		z-index: 1 ;
	}
	
	#mainslider .carousel-item {
		height: 900px;
		max-height: 100%;
	}

	#mainslider .carousel-caption {
 		bottom: 0 ;
		top: 20%;
		text-align: right ; 
	}
	
			/* Safari 4.0 - 8.0 */
		@-webkit-keyframes slide {
		  from {margin-right: -100%;}
		  to {margin-right: 0;}
		}

		/* Standard syntax */
		@keyframes slide {
		  from {margin-right: -100%;}
		  to {margin-right: 0;}
		}
	
			/* Safari 4.0 - 8.0 */
		@-webkit-keyframes fontSize {
		  from {font-size: 1%;}
		  to {font-size: 350%;}
		}

		/* Standard syntax */
		@keyframes fontSize {
		  from {font-size: 1%;}
		  to {font-size: 350%;}
		}
		
		

		
		
		
	#mainslider .carousel-item img {
		height: 100%;
	}
	
	#mainslider .carousel-item h1  {
		font-family: 'Tajawal', sans-serif ;
		font-size: 350%;
		margin-bottom: 50px;
		color: #fff ;
		font-weight: 800;
		 -webkit-animation-name: slide; /* Safari 4.0 - 8.0 */
		-webkit-animation-duration: 2s; /* Safari 4.0 - 8.0 */
		animation-name: fontSize;
		animation-duration: 2s;
		
	}
	
	#mainslider .carousel-item  p {
		width: 75%;
		font-size: 120%;
		font-family: 'Tajawal', sans-serif ;
		letter-spacing: 2px;
		-webkit-animation-name: slide; /* Safari 4.0 - 8.0 */
		-webkit-animation-duration: 3s; /* Safari 4.0 - 8.0 */
		animation-name: slide;
		animation-duration: 3s;
	}

	/* End Slider */

	/* Start About us */
	

	
	.about-us {
		position: relative;
	}
	
	.about-us h1 {
		font-family: 'Tajawal', sans-serif;
		font-size: 300%;
		padding-bottom: 0px;
		color: #111a41;
	}
	
	.about-us h1::after{
		content: "" ;
		height: 2px;
		background: #4DB7FE;
		display:block ;
		transition: .5s ease ;
		margin-top: 10px;
		width: 50px;

	}
	
	.about-row p {
		font-family: 'Tajawal', sans-serif;
		font-size: 21px;
		text-align: justify;
		padding: 0 15px;
		
	}
	
	.about-row .about-content::after {
    content: "";
    height: 300px;
    width: 7px;
    background: #3d506e;
    position: absolute;
    top: 5px;
    /* right: 0; */
    bottom: 0;
    left: 0;
    border-radius: 10px;
	}
	
	.about-row {
		display: flex ;
		align-items: center;
	}
	
	.about-img img {
		max-width:100%;
		height: auto;
		padding: 2%;
		border-radius: 0 200px 0 200px;
		border-radius: 5% 20% 5% 20%;
		transition: .8s;
		}
		
	.about-img img:hover {
		border-radius: 0 50px 0 50px;
		transform: scale(1.1);
	}
	 .shape {
	width: 140px;
    height: 190px;
    background: #00adee;
    border-radius: 40px 40px 0 40px;
    -ms-transform: rotate(50deg)!important;
    -webkit-transform: rotate(50deg) !important;
    transform: rotate(50deg) !important;
    position: absolute;
    top: 50px;
    right: -173px;
}	
		
		/* Start our Services  */
	.our-Services {
		margin-top: 50px;
		padding: 70px 0px;
		position: relative;
		/*background: #1023ff17; */
	}
	
	.our-Services::after {
		content: "";
		background-image: url('../images/s-bg.jpg');
		background-size: cover;
		background-position: bottom;
		opacity: 0.1;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		position: absolute;
		z-index: -1;   
	}

/* 	.our-Services .overlay {
		position: absolute;
		top: 0 ;
		bottom: 0;
		left: 0;
		right: 0 ;
		opacity: 0.5 ; 
		z-index: 2;
		background: rgb(255,255,255);
		background: radial-gradient(circle, rgba(255,255,255,1) 0%, rgba(125,210,254,1) 100%);
		
	} */
	
	.our-Services h1 {
		font-family: 'Tajawal', sans-serif;
		font-size: 200%;
		color: #111a41;
		padding-bottom: 0px;
		z-index: 3;
		position: relative;
	}
	
	.our-Services h1::after{
		content: "" ;
		height: 2px;
		width: 50px ;
		background: #4DB7FE;
		display:block ;
		transition: .5s ease ;
		margin-top: 10px;
		margin: 10px auto;
		z-index: 3;
	}
		.our-Services .Services-card{
		border: none ;
		overflow: hidden ;
		transition: .5s;
		position:relative;
		padding: 10px;
		margin-top: 10px;
		z-index: 3;
	}
	

	.our-Services .Services-card:hover{

	}
		

	
	.our-Services .Services-card img{
		transition: .5s ease ;
		height: 150px;
		width: 150px;
		z-index: 3;
		border-radius: 5% 20% 5% 20%;
		filter: grayscale(1);
		filter: contrast(100%) ;

	}
	
	.our-Services .Services-card:hover img{
		opacity: 1;
		transform: scale(1.1);
		padding: 1px ;
		filter: contrast(100%) ;
		filter: grayscale(1);

	}

	.our-Services h2 , .our-Services h5  {
		color: #333;
		font-family: 'Tajawal', sans-serif;
		font-size: 18px;
		margin: 2px auto;
		font-weight: 700;
	}
	
	.our-Services h5 {
		color: #666;
		font-size: 14px;
	    line-height: 20px;
		font-weight: 500;
		text-align: justify;
		padding: 3px 10px;


	}
	
		/* Start our Projects  */
	.our-projects {
			width: 100%;
			height: auto;
			background-size: cover ;
			background-attachment: fixed;
			position: relative;
			background-position: top;
			z-index: 1;
			background: #fff;
			background: rgb(230,230,230);
			background: linear-gradient(0deg, rgba(230,230,230,1) 0%, rgba(255,255,255,1) 100%);
	}
	
	.our-projects svg {
    overflow: hidden;
    vertical-align: middle;
    position: absolute;
    top: -90px;
    right: 0;
    left: 0;
	/* background: #e9ebff; */
	}
	
/* 	.our-projects .overlay {
			position: absolute;
			top: 0 ;
			bottom: 0;
			left: 0;
			right: 0 ;
			opacity: 0.73 ; 
			z-index: 2;
			background: #000;
			
	} 
	 */
	 
	.our-projects h1 {
		font-family: 'Tajawal', sans-serif;
		font-size: 200%;
		color: #111a41;
		padding-bottom: 0px;
		z-index: 3;
		position: relative;
		padding: 20px 0 ;

	}
	
	.our-projects h1::after{
		content: "" ;
		height: 2px;
		width: 50px ;
		background: #4DB7FE;
		display:block ;
		transition: .5s ease ;
		margin-top: 10px;
		margin: 10px auto;
		z-index: 3;
		position: relative;

	}
	
	.our-projects i {
		color: #4db7fe;
		padding-right: 10px;
	
	}
	
	.our-projects .card{
		border: none ;
		overflow: hidden ;
		transition: .5s;
		z-index: 3;
		position: relative;
		/* box-shadow: 0 0 5px #eee; */
		padding: 0 ;
		border-radius: unset;
		margin-bottom: 25px;
	}
	
	
	.our-projects  .card img {
		width: 100%;
		z-index: 3;
		position: relative;
		transition: all ease 0.3s;
	}
	
	.our-projects .card:hover img{
		transform: scale(1.1);
	}

	.card img.card-img-top{
		height: 250px; ;
	}

	.our-projects .card-body {
    position: absolute;
    bottom: 0;
    background: #000000ba;
    z-index: 3;
    /* padding: 0; */
    margin: 0;
    left: 0;
    right: 0;
}
	.our-projects h5 a {
		color: #fff;
		font-family: 'Tajawal', sans-serif;
		z-index: 3;
		position: relative;
		font-weight: bold;
	}
	
	.our-projects p {
		font-family: 'Tajawal', sans-serif;
		color: #eee ;
		font-size: 14px; 
		transition: .5s ease;
		z-index: 3;
		position: relative;
	}
		/* End our Projects  */
		
		
		
		/*----------- Start Testimonial   -----------*/
		.testimonial {
			margin-bottom: 50px;
		}
		
		.testimonial h1 {
			font-family: 'Tajawal', sans-serif;
			font-size: 200%;
			color: #111a41;
			padding-bottom: 0px;
			z-index: 3;
			position: relative;
	}

		.testimonial h1::after{
			content: "" ;
			height: 2px;
			width: 50px ;
			background: #4DB7FE;
			display:block ;
			transition: .5s ease ;
			margin-top: 10px;
			margin: 10px auto;
			z-index: 3;
			position: relative;

	}
		.testimonial .owl-carousel .owl-item img {
			height: 150px;
			object-fit: scale-down;
			
			}
			
		.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
			background: #111a41 !important;
		}	
		
		

		/*----------- End Testimonial  -----------*/
		
		
		/*----------- End google-map  -----------*/
		
		.google-map {
			background: #111a41;
			
		}
		.google-map  iframe {
		-webkit-filter:  grayscale(1);
        -moz-filter:  grayscale(1);
        -ms-filter:  grayscale(1);
        -o-filter:  grayscale(1);
         filter:  grayscale(1);
		}
		
		/*----------- End google-map  -----------*/
		
		
		
		/*-----------  Start contact us  -----------*/
		
		.contact-us {
			margin-top: -200px;
			background: #f2f3f4;
				}	
		
	.contact-container {
		min-height: 450px;
		background: red;
 		background: url("../images/contact-bg.png");
 		background-size: cover ;
 		background-attachment: fixed;
		position: relative;
		background-position: top;
		margin-top: 10px;		
	}	


	.contact-container h1 {
		font-family: 'Tajawal', sans-serif;
		font-size: 200%;
		color: #7d8791;
		padding-bottom: 0px;
		padding-top: 50px;
	}	
	
	
	.contact-container h1::after{
		content: "" ;
		height: 2px;
		width: 50px ;
		background: #4DB7FE;
		display:block ;
		transition: .5s ease ;
		margin-top: 10px;
		margin: 10px auto;
		z-index: 3;
		position: relative;

	}
	
		.contact-container .container {
		z-index: 5 ;
		position: relative;
	}
	
		.contact-us .contact-section h5 , .contact-us .contact-section h5 a{
			font-size: 1.1rem;
			font-family: 'Tajawal', sans-serif;
			color: #000 ;
			font-weight: 600;
			max-width: 160px;
		}
		
		
		
		.contact-us .contact-section.adress h5  {
			font-size: 0.9rem;
			font-family: 'Tajawal', sans-serif;
			color: #000 ;
			font-weight: 600;
			max-width: 200px;
		}
				
	.contact-form {
		margin-top: 20px;
	}
	
	.contact-container input , .contact-container textarea {
		width: 100%;
		border: none;
		padding: 10px 10px ;
		border-radius: 5px;
		margin-bottom: 20px;
		transition: .5s ease;
		opacity: .95 ;
		}
	

	
	.contact-container .submit {
		margin: -15px auto;
		font-family: 'Tajawal', sans-serif;
		font-size: 100%;

	}

		.contact-container .submit input {
		background: #4db7fe ;
		color: #eee;

		}
	
	.contact-container input:focus , .contact-container textarea:focus {
		opacity: 1 ;
	}
	
	.contact-container .submit input:hover {
		background: #111a41 ;
	}
	

	.contact-info {
	
	}
			
	.contact-info .contact-section {
			display: flex;
		    margin-top: 20px;
			margin-right: 15%;
		}
				
	.contact-container .call-icon {
		background: #111a41;
		background: #4DB7FE;
		width: 65px;
		height: 65px;
		border-radius: 50%;
		margin: 0 0 5px 6%;
		}
		
		.contact-container .text-icon {
			padding-top: 8px;
		}

	.contact-container .text-icon p {
		font-size: 13px;
		line-height: 24px;
		color: #7d8791;
		font-family: 'Tajawal', sans-serif;
		font-weight: 600;
		}
	
		.contact-container .call-icon i {
			color: #fff;
			font-size: 23px;
			line-height: 65px;
			text-align: center;
			display: block;
		}
		
		.contact-container .email-info  {
			margin: 50px 50px;
		}
		
		.contact-container .adress .call-icon {
			width: 65px;
			height: 65px;
		}	
		
		
	.header-info {
		height: 100px;
		line-height: 100px;
		padding: 0px 20px;
		border-right: 1px solid rgba(255,255,255,0.25);
		border-left: 1px solid rgba(255,255,255,0.25);
		}
	
	.header-info i , .header-info i a  {
		color: #eee;
		padding-right: 5px;
	}
	
	 .header-info .fas:before ,  .header-info .far:before {
		padding-right: 5px;
	}
	
	
		/*-----------  End contact us  -----------*/
		
		
		/*-----------  Start Footer  -----------*/
	.footer {
		height: auto;
		background: #111a41; 
		margin-bottom: 0;
		padding-bottom: 10px ;
	}
	
	.footer .social-icons a  {
		padding-right: 15px;
	}
	
	.footer .social-icons a i {
		font-size: 25px;
		color: #fff;
		margin-top: 20px;
		}
		
	.footer .social-icons a:hover {
		color: #bbb9ad;
		-ms-transform: rotate(0deg); /* IE 9 */
		-webkit-transform: rotate(0deg); /* Safari 3-8 */
		transform: rotate(0deg);
		} 
	
	.footer .social-icons a i:first-child {
		padding-right: 0;
		}	
			
		.footer .site-copyright {
			margin-top: 16px;
		}
			
		.footer .copyright p , .site-copyright span{
			color: #fff;
			font-family: TheSans ;
			font-size: 80% ;
			margin-top: 20px;
		}
		
		.site-copyright img {
			width: 50px;
			margin-right: 10px;	
			padding-bottom: 5px;			
		}
		/*-----------  End Footer  -----------*/
		
		/*-----------  Start  Inner pages  -----------*/
		
		nav#navbar.inner-header {
			margin: 0;
		}
		.page-style {
			min-height: 600px;
		}
		
		.page-style .page-title {
			height: 75px;
			background: #141d45; 
/* 			background-image: url("../images/bg-page.png"); */
		opacity: 0.9;
		}
		
		.page-style .page-title h2{
			color: #fff;
			margin-right: 20%;
			border-right: 4px solid #fff;
			padding-right: 20px;
			padding-bottom: 10px;
		}		
		
		.page-style p{
			color: #333;
			font-family: 'Tajawal', sans-serif;
			font-size: 120%;
			line-height: 180%;

		}
				
		.page-style img {
			width: auto;
			display: block;
			max-width: 100%;
			/* border: 3px solid #ccc;
			box-shadow: 0 0 13px 1px #ddd; */
			margin: auto;
			height: auto;
		}

		.title-line {
			width: 100%;
			height: 1px;
			position: relative;
			background: #1a70ae;
			margin: 25px auto;
		}
		
		.line-circle1 {
			position: absolute ;
			width: 10px;
			height: 10px;
			border-radius: 50%;
			background: #1a70ae;
			top: -5px;
			right: 0 ;
			/*display: inline-block;
			vertical-align: middle; */
		}		
		.line-circle2 {
			position: absolute ;
			width: 10px;
			height: 10px;
			border-radius: 50%;
			background: #1a70ae;
			top: -5px;
			left: 0 ;
			/*display: inline-block;
			vertical-align: middle; */
		}
		
		.wp-block-column:not(:first-child) {
			margin-right: 10px !important;
		}
		
		
		/*-----------  End  Inner pages  -----------*/
		
				
		/*-----------  Custom Page Style  -----------*/
		
		.custom-page-style {
			background: #e4e6e8 ;
			position: relative;
		}
		
		.custom-page-style .inner-title {
			color: #ddd;
			position: absolute;
			top: 120px;
			left: 53%;
			z-index: 1;
			background: #111d40 ;
			padding: 10px;
			border-radius: 40px 40px 40px 0 ;
			-ms-transform: rotate(-50deg)!important ; /* IE 9 */
			-webkit-transform: rotate(-50deg) !important; /* Safari 3-8 */
			transform: rotate(-50deg) !important;
			width: 170px;
			height: 120px;
		} 
		
		.custom-page-style .inner-title .inner-border {
			
			border: 2px solid #00adee;
			border-radius: 40px 40px 40px 0 ;
			height: 100%;
		}
		
		
		.custom-page-style .inner-title h2 {
			font-size: 32px;
			-ms-transform: rotate(50deg); /* IE 9 */
			-webkit-transform: rotate(50deg); /* Safari 3-8 */
			transform: rotate(50deg);
			margin: 20px;
			font-family: DIN-NEXT-ARABIC;
		}
		
		
		.custom-page-style .content {
			padding: 0 10%;
			margin: 120px auto; 
		}
		
		
		.custom-page-style .content::after {
			content: "";
			background: url(../images/nawat-bg.png);
			opacity: 0.05;
			top: 0;
			left: 0;
			bottom: 0;
			right: 0;
			position: absolute;
			background-repeat: no-repeat;
			background-position: bottom;
			background-size: contain;		  
		}


		.v-border {
			height: 300px;
			width: 8px;
			background: #3d506e;
			border-radius: 5px;
			position: absolute;
			right: -6px;
			top: 32%;
		}
		
		.custom-page-style p , .custom-page-style span {
		    font-family: DIN-NEXT-ARABIC;
			font-size: 22px;
			text-align: justify;
			color: #6d6e70;
			line-height: 2.8rem;

		}	
		.custom-page-style .content h4 {
		font-family: DIN-NEXT-ARABIC;
		font-size: 13px;
		text-align: justify;
		color: #6d6e70;
		line-height: 1.3rem;
		}

		.custom-page-style  span{
			font-size: 45px;	
		}
		
		.custom-page-style .page-title {

			height: 75px;
			background: #141d45; 
			opacity: 0.9;
		}

		.custom-page-style .page-title h2{
			color: #fff;
			margin-right: 20%;
			border-right: 4px solid #fff;
			padding-right: 20px;
			padding-bottom: 10px;
		}	
		
		
		.vision-cover {
			height: 400px ;
			overflow: hidden ;
		}
		
		
		.vision-title  {
			left: 61% !important;
		}
		
		.custom-page-style.vision-page .v-border {
		    right: 75px;
			top: 0;
		}
		.custom-page-style.vision-page .content {
			margin: 60px auto; 
		}
		
		.custom-page-style ul li {
            font-family: DIN-NEXT-ARABIC;
            font-size: 18px;
            color: #6d6e70;
		}
		
		/*-----------  End Custom Page Style  -----------*/
		
	
	
		
		/*-----------  Start Scroll up  -----------*/
		#scroll-up {
			display: none;
		}
		#scroll-up li{
			position: fixed;
			left: 2%;
			bottom: 100px;
			z-index: 9999;
			color: #111a41;
			transition: .5s ease;
			font-size: 28px;
		}
		
		#scroll-up li:hover {
			color: #4db7fe ;
		}
		/*-----------  End Scroll up  -----------*/
		
		
		/*-----------Start  @media Query 768 -----------*/
			@media only screen and (min-width: 768px) {
				

			
			.card-body {
				padding: 0.5rem ;
			}
			.our-projects .card:hover  h5 , .our-projects .card:hover p{
				color: #000;
				}


			}


			/*-----------Start  @media Query 990 -----------*/
			@media only screen and (max-width: 990px) {
				
				#mainslider .carousel-item {
					height: 350px;
				}
				
				#mainslider .carousel-caption {
					top : 10%;
				}
				
				#mainslider .carousel-item h1 {
					font-size: 150% ;
				}
				
				#mainslider .carousel-item p {
					font-size: 100%;
					width: 100%;
					letter-spacing: 1px;
				}


				ul#menu-header {
						text-align: center !important;
					}
				
				ul#menu-header li a {
					font-weight: 700 ;
				}

				 #header .social-icons {
					text-align: center !important;
					margin-top: 10px ;
					padding-bottom: 10px;
				}
				
				ul#menu-header li::after{
					margin: 20px auto ;
				}

				ul#menu-header li:hover::after  {
					width: 30% !important;
				}
				
				
				

				.our-vision, .our-mission {
					margin-top: 25px;
				}				
					
				.custom-page-style.vision-page .content {
					margin: 0px auto; 
				}
		
			}
			
					/*-----------Start  @media Query 768 -----------*/
			@media only screen and (max-width: 768px) {
				
				#header .bg-dark {
					background-color: #2e3f6e;
					margin: 0;
					border-bottom: unset;
				}
				.home #header .bg-dark {
					margin: 0px 0 168px 0;
				}
									
				#mainslider .carousel-item {
					height: 250px;
				}
						/* Safari 4.0 - 8.0 Mobile*/
		@-webkit-keyframes fontSizeMobile {
		  from {font-size: 1%;}
		  to {font-size: 150%;}
		}

		/* Standard syntax Mobile*/
		@keyframes fontSizeMobile {
		  from {font-size: 1%;}
		  to {font-size: 150%;}
		}
				#mainslider .carousel-item h1 {
					font-size: 150%;
				    margin-bottom: 15px;
					animation-name: fontSizeMobile ;
				}
				
				.home-video-slider:before , .home-video-slider:after {
					content: none;
				}
				
				.home-video-slider .overlay {
					height: 97.3%;
				}
				
				.slider-text h1 {
					font-size: 200% !important;
					margin: 5px 0 0 0;
					animation-name: fontSizeMobile ;
					
				}
				
				.slider-text p {
					margin: -3px 0px 0px 0px;
					font-size: 100%;
				}
				
				.slider-text p::after {
					height: 1px;
				}
				
				#mainslider .carousel-item p {
					font-size: 85%;
					width: 100%;
					letter-spacing: 1px;
					max-height: 80px;
					overflow: hidden;				
				}
				
			
			.menu-header-container {
				padding-bottom: 50px;
			}
			
			.home-video-slider {
				margin-top: -275px;
			}
					
				
				.navbar-brand img {
					width: 80px;
				}
				
				/* mobile sub-menu*/
				.sub-menu{
				 position:relative;
				width: 100%; 
				top: 50px;
				
				height: 0 ;
				}
				
				nav li:hover .sub-menu  {
					height: auto !important;
					margin-bottom: 50px;
				}
						
				.sub-menu li {
					/* margin-right: -80px; */
				}
				/* End mobile sub-menu*/
				
			.about-img img {
				border-radius: 0 100px 0 0 ;
			}
			
			.our-projects svg {
				
				top: -20px;
			}

				#scroll-up li {
					font-size: 35px !important;
				}
				
				
				.aboutus-s .container {
						margin: 0 !important ;
						padding: 0 !important;

				}
				
				.our-projects .card {
					margin: 15px 0 ;
					padding: 0 ;
				}	
				
				
				.contact-container .adress .call-icon {
					
					width: 65px;
					height: 65px;
					margin-top: 20px;
				}
				
				.contact-container textarea {
					height: 130px ;
				}

				.contact-info .contact-section {
					margin-right: 5%;
					margin-left: 5%;
				}
				
				.contact-us .contact-section h5 {
					font-size: 1rem;
				}
			
				.page-style {
					min-height: 500px;
				}				
				
				ul#menu-header {
						padding: 0 ;
				}
				
					ul#menu-header li.current-menu-item::after  {
					width: 30%;
				}
				
				.card img:hover {
					transform: scale(1.2);
				}
				

				
				.contact-container h1 {
					font-size: 170% ;
				}
				
				.contact-container p {
					font-size: 100% ;
				}
				
				
				
				.contact-form {
					margin-top: 20px;
				}
				
				 .v-border {
					right: 20px !important;
				}
				
				.custom-page-style .inner-title h2 {
				    font-size: 22px;
				}
	
			}
		
		/*-----------  End @media Query  -----------*/