@font-face {
	font-family: "Flamingo";
	src: url("../Fonts/ge-ss-med.eot");
	src: url("../Fonts/GE_SS_Two_Medium.ttf");
	src: url("../Fonts/ge-ss-med.ttf") format("truetype");
	font-weight:normal;	
	font-style:normal;	
}

/* 
Blue: #1e68a5
Dark Blue: #09497f
*/
	
html{width:100%; height:100%; position:relative; padding:0px; margin:0px; direction:rtl;}
body {
	width: 100%;
	height: 100%;
	padding: 0px;
	margin: 0px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 12pt;
	color: #333;
}

ul,ol{padding:0px; margin:0px; list-style:none;}
li{padding:0px; margin:0px;}
h1,h2,h3{padding:0px; margin:0px; font-weight:500;}
h1{font-size:18pt;}
h2{font-size: 15pt;}
img{padding:0px; margin:0px; border:0px}
a{color:#1e68a5; text-decoration:none}
a:hover{color:#555}

input,select,textarea{
	width:100%; 
	border:0px;
	padding:10px;
	font-size:13pt;
	font-family:Flamingo;
}

.clr{clear:both;}

#wrap{}
.container{width:90%; margin:0px auto}
.container-small{width:75%; margin:0px auto}

/*---Header-------------------------------------------------*/
.head{width:100%; padding:8px 0px;}

.nav{float:right; display:block; margin-top:80px;}
.nav li{float:right;}
.nav li a{display:block; font-size:12pt; padding:12px 18px}
.nav li a:hover{background-color:#1e68a5; color:#fff}
.nav li a.current{background-color:#1e68a5; color:#fff}

.logo{float:left; display:block}
.logo img{padding-top:5px; width:200px}

.headerResp {display:none;}
.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #111;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 60px;
}
.sidenav a {
    padding: 10px 20px;
    font-size: 13pt;
    color: #818181;
    display: block;
    transition: 0.3s;
}
.sidenav a:hover {color: #f1f1f1;}
.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 0px;
    font-size: 50px;
    margin-left: 50px;
}

/*---Footer-------------------------------------------------*/
.footer{clear:both; width:100%; background-color:#777; margin-top:10px}
.footer-info{padding:0px; color:#fff; font-size:10pt;}
.footer-info div{padding-top:20px;}


/*---Banner-------------------------------------------------*/
.bannerMain{
	clear:both; 
	height:600px; 
	width:100%; 
	margin:0px auto; 
	padding:0px; 
	background:url('../Images/b1.jpg') center no-repeat #eee;
	background-size:cover;
}
.bannerAbout {
	clear: both;
	height: 600px;
	width: 100%;
	margin: 0px auto;
	padding: 0px;
	background: url('../Images/b2.jpg') center no-repeat #eee;
	background-size: cover;
}
.bannerProject {
	clear: both;
	height: 600px;
	width: 100%;
	margin: 0px auto;
	padding: 0px;
	background: url('../Images/b5.jpg') center no-repeat #eee;
	background-size: cover;
}
.bannerCareer {
	clear: both;
	height: 600px;
	width: 100%;
	margin: 0px auto;
	padding: 0px;
	background: url('../Images/b3.jpg') center no-repeat #eee;
	background-size: cover;
}
.bannerService {
	clear: both;
	height: 600px;
	width: 100%;
	margin: 0px auto;
	padding: 0px;
	background: url('../Images/b4.jpg') center no-repeat #eee;
	background-size: cover;
}
/* 
Blue: #1e68a5
Dark Blue: #09497f
*/

/*---Main Page-------------------------------------------------*/
.intro{clear:both; width:100%; margin:30px auto}
.intro-panel{color:#09497f; padding:20px 0px;}
.intro-panel p{color:#555}

/*---About-------------------------------------------------*/
.about{clear:both; width:100%; background-color:#fff; }
.about-panel{padding:20px 0px;}
.about-panel h1{color:#1e68a5; text-align:center}

/*---Contact-------------------------------------------------*/
.contact{clear:both; width:100%; background-color:#fff; text-align:center}
.contact-panel{padding:20px 0px; text-align:right;}
.contact-panel h1{color:#1e68a5}
.mapZone{width:100%; height:600px; background:#fff;}
#mapProp{width:100%; height:100%}

.contact-row {padding:40px 0px 20px}
.contact-row li{float:right; width:33%; text-align:center; margin-bottom:25px}
.contact-row .addTitle{color:#1e68a5; font-size:16pt; padding-bottom:20px}
.contact-row .addContent{color:#666; padding:0px 20px}


.ulProject {
	padding: 10px;
	margin: 10px;
	list-style: circle;
}
.ulProject li {
	padding-bottom:16px;
	color:#555;
}



/*------------ Tabs --------------------------*/
/* Style the tab */
.tab {
	margin-top: 48px;
	overflow: hidden;
	border-bottom: 1px solid #ccc;
}
	/* Style the buttons inside the tab */
	.tab button {
		background-color: inherit;
		float: right;
		border: none;
		outline: none;
		cursor: pointer;
		padding: 14px 28px;
		transition: 0.3s;
		font-size: 18px;
		color: #444;
		font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	}

		/* Change background color of buttons on hover */
		.tab button:hover {
			background-color: #ddd;
		}

		/* Create an active/current tablink class */
		.tab button.active {
			background-color: #ccc;
		}

/* Style the tab content */
.tabcontent {
	display: none;
	padding: 16px 12px;
	-webkit-animation: fadeEffect 1s;
	animation: fadeEffect 1s;
}

/* Fade in tabs */
@-webkit-keyframes fadeEffect {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

@keyframes fadeEffect {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}


/*------------ Responsive --------------------------*/
/*----------------------------------------------------------------*/
@media only screen and (min-width: 1200px) {
}

@media only screen and (min-width: 992px) and (max-width: 1199px){
}

@media only screen and (min-width: 768px) and (max-width: 991px){

	.headerResp {display:block}
	.nav ul{display:none}
	.logo img{width:100%}
}

@media only screen and (min-width: 576px) and (max-width: 767px){

	.headerResp {display:block}
	.nav ul{display:none}
	.logo img{width:100%}	
}

@media only screen and (max-width: 575px){
	.container-small {width:85%}
	
	.headerResp {display:block}
	.nav ul{display:none}
	.logo img{width:100%}
	
	.footer-info{float:none; display:block; padding:20px 0px; color:#fff; font-size:9pt; text-align:center}
	.footer-info h1 small{font-size:10pt; color:#666}
	.footer-social{float:none; display:block; padding:10px 0px; text-align:center}

	.contact-row li{float:none; display:block; width:100%}
}