@font-face
{
	font-family:'awesome';
	src:url('../font/awesome.woff2');
	font-weight:normal;
	font-style:normal
}
.fa
{
	display:inline-block;
	font:normal normal normal 14px/1 FontAwesome;
	font-size:inherit;
	text-rendering:auto;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale
}
.fa-bars:before
{
	content:"\f0c9";
}
.fa-facebook:before
{
	content:"\f09a";
}
.fa-twitter:before
{
	content:"\f099";
}
.fa-youtube:before
{
	content:"\f16a";
}
.fa-instagram:before
{
	content:"\f16d";
}
.fa-linkedin:before
{
	content:"\f0e1";
}
.fa-reddit-alien:before
{
	content:"\f281";
}
.fa-chevron-left:before
{
    content:"\f053";
}
.fa-chevron-right:before
{
    content:"\f054";
}
.fa-caret-up:before
{
    content:"\f0d8";
}
.fa-phone:before
{
    content:"\f095";
}
.fa-envelope:before
{
    content:"\f0e0";
}
.fa-map:before
{
    content:"\f279";
}
.fa-check-circle:before
{
    content:"\f058";
}
.fa-ban:before
{
    content:"\f05e";
}
@font-face
{
	font-family:mainlight;
	src:url('../font/arabiclight.woff2');
}
@font-face
{
	font-family:mainbold;
	src:url('../font/arabicbold.woff2');
}
body
{
	direction:rtl;
	position:relative;
	color:#918e88;
	text-align:center;
	font:16px mainlight;
	padding:72px 0 144px 0;
	background:url('../img/body.jpg') repeat;
	margin:0;
}
em
{
	display:inline-block;
	vertical-align:super;
	width:10px;
	color:#cc0000;
}
.topbar
{
	position:fixed;
	top:0;
	left:0;
	right:0;
	z-index:999;
	max-height:72px;
	color:#fff;
	overflow:hidden;
	background:url('../img/topbar.png') repeat;
	border-bottom:solid 3px #1a76ba;
	transition:all .25s ease-out;
}
.container
{
	max-width:1200px;
	padding:0 10px;
	overflow:hidden;
	margin:auto;
}
.fa-bars
{
	cursor:pointer;
	display:none;
	float:right;
	font:40px/70px awesome;
}
.menulogo
{
	display:inline-block;
	float:left;
	height:40px;
	margin-top:15px;
}
.socialsblock
{
	float:right;
	text-align:center;
	margin:20px 0 20px 20px;
}
.sociallink
{
	display:inline-block;
	vertical-align:middle;
	width:30px;
    height:30px;
    text-align:center;
    color:inherit;
    background:#1a76ba;
    border-radius:50%;
    margin:0 5px;
}
.sociallink:first-of-type
{
	font:bold 20px/30px sherif;
	text-decoration:none;
}
.fa-facebook , .fa-twitter , .fa-youtube , .fa-instagram , .fa-reddit-alien , .fa-linkedin
{
	font:16px/30px awesome;    
}
.menulink
{
	display:inline-block;
	font:14px/70px mainlight;
	color:inherit;
	text-align:center;
	text-decoration:none;
	transition:color .25s ease-out;
}
.menulink:hover , .formbutton:hover
{
	color:#1a76ba;
}
.menuseparator
{
	display:inline-block;
	vertical-align:middle;
	color:#1a76ba;
	font:6px mainlight;
	margin:-3px 6px 0 6px;
}
.slidercontainer
{
	position:relative;
	padding-top:50%;
	overflow:hidden;
}
.loaderouter
{
	position:absolute;
    top:50%;
    left:50%;
    width:60px;
    height:60px;
    border-left:solid 5px #1a76ba;
    border-radius:80px 0 0 80px;
    margin:-40px 0 0 -40px;
    animation:rotate 1.25s linear infinite;
}
.loaderinner
{
    position:absolute;
	top:15px;
    left:15px;
    width:30px;
    height:30px;
    border-left:solid 4px #1a76ba;
    border-radius:50px 0 0 50px;
    animation:rotate 3.5s linear infinite;
}
.sliderarrow
{
	cursor:pointer;
	position:absolute;
	top:35%;
	right:2%;
	z-index:99;
	width:45px;
	height:45px;
	color:#fff;
	text-indent:-2px;
	font:20px/48px awesome;
	background:rgba(26,118,186,.5);
	border-radius:50%;
	transition:opacity .25s ease-out;
}
.sliderarrow:last-of-type
{
	right:auto;
	left:2%;
	text-indent:2px;
}
.sliderarrow:hover
{
	background:#1a76ba;
}
.singleslide
{
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	opacity:0;
	width:100%;
	transition:opacity 2s;
}
.sliderbottom
{
	position:absolute;
	left:0;
	bottom:-5px;
	width:10px;
	height:10px;
	background:url('../img/body.jpg');
	transform:rotateZ(45deg);
}
.smalltitle
{
	color:#555;
	font:20px mainbold;
}
.sectionparagraph
{
	text-align:justify;
	margin:20px auto;
}
.topicsblock , .sectionblock
{
	display:inline-block;
	vertical-align:top;
	width:24%;
	text-align:center;
	padding:10px;
	margin:5% .5%;
	box-sizing:border-box;
	transition:transform .5s ease-out , opacity .5s ease-out;
}
.topicsblock
{
	padding:0;
	overflow:hidden;
	text-decoration:none;
	padding-bottom:5px;
	background:#fff;
	border-radius:5px;
	box-shadow:0 1px 6px -2px #000;
}
.topicsimage
{
	padding-top:60%;
	background:url('../img/blank.jpg') transparent no-repeat center/cover;
}
.topicsblock > .smalltitle , .topicsblock > .sectionparagraph
{
	font-size:1em;
	padding:5px 10px 0 10px;
	margin:0;
}
.iframeblock
{
	width:100%;
	height:600px;
}
.spacerline
{
	height:6px;
	background:#ddd;
	margin:3% auto;
}
.bottombar
{
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	color:#fff;
	padding:30px 0;
	background:#000;
}
.fa-caret-up
{
	cursor:pointer;
    position:fixed;
    left:30px;
    bottom:30px;
	width:30px;
    height:30px;
    opacity:.5;
    z-index:9999;
    color:#fff;
    font:15px/30px awesome;
    background:#1a76ba;
    border-radius:50%;
    transition:opacity .25s;
}
.fa-caret-up:hover , .linkbuttons:hover
{
	opacity:1;
    background:#1a76ba;
}
.surveylink
{
	position:fixed;
    top:80px;
    left:-220px;
	width:500px;
    color:#fff;
    font:14px mainbold;
    text-decoration:none;
    padding:5px;
    background:rgba(26,118,186,.8);
    box-shadow:0 0 3px -1px #000;
    border:solid 3px #1a76ba;
    transform:rotateZ(-45deg);
    animation:blink 1s linear infinite;
}
.largetitle
{
	color:#555;
	text-align:right;
	font:25px/30px mainbold;
}
.linkbuttons
{
	cursor:pointer;
    display:inline-block;
    color:#fff;
    text-decoration:none;
    font:16px/32px mainbold;
    padding:2px 20px;
    background:#080325;
    border-radius:5px;
    border:0;
    margin:auto;
}
.sectionimage
{
	display:block;
	width:90%;
	overflow:hidden;
	border-radius:50%;
	margin:30px auto;
}
.contactblock
{
	display:inline-block;
	vertical-align:top;
	width:50%;
}
.fa-phone , .fa-mobile , .fa-envelope , .fa-map
{	
	font:16px/32px awesome;
	margin-left:25px;
}
.contactmap
{
	width:100%;
	max-width:450px;
	height:250px;
	border:solid 2px #ddd;
	margin-bottom:30px;
}
.surveyform
{
	max-width:800px;
}
.surveyform > .formfield
{
	display:inline-block;
	width:calc(100% - 10px);
}
.formfield
{
	display:block;
	width:100%;
	font:16px/32px tahoma;
	padding:10px;
	background:#ddd;
	margin:20px 0;
	resize:none;
	border:solid 1px #ddd;
	outline:0;
}
.formfield:invalid
{
	color:#777;
}
.formfield:focus
{
	color:#000;
	background:#fff;
	border:solid 1px #918e88;
}
.formbutton
{
	cursor:pointer;
	display:inline-block;
	width:100px;
	font:16px/32px mainlight;
	background:none;
	border:0;
	outline:0;
}
.fieldset
{
    text-align:right;
    padding:0 20px;
    border:solid 2px #ddd;
    margin-bottom:20px;
}
.fieldsetlegend
{
    padding:0 10px;
    margin-left:-10px;
}
.skillsblock
{
    display:inline-block;
    width:20%;
    margin:10px auto;
}
.checkbox
{
    float:right;
    width:20px;
    height:20px;
    margin:0 0 0 10%;
}
.fa-check-circle , .fa-ban
{
	display:block;
	color:#008800;
	font:120px/150px awesome;
}
.fa-ban
{
	color:#aa0000;
}
.sharinglink
{
	display:inline-block;
	width:60px;
	height:60px;
	color:#fff;
	font:30px/60px awesome;
	text-decoration:none;
	background:#1a76ba;
    border-radius:5px;
    margin:1px 1%;
}
@keyframes rotate
{
	to { transform:rotate(360deg); }
}
@keyframes blink
{
	0% { color:white; }
	50% { color:goldenrod; }
	100% { color:white; }
}
@media (max-width:992px)
{
	.fa-bars { display:inline-block; }
	.socialsblock { float:none; display: inline-block; width:100%; margin:10px 0 20px 0; }
	.sociallink { width:40px; height:40px; margin:0 .8%; }
	.sociallink:first-of-type { font:bold 25px/40px sherif; }
	.fa-facebook , .fa-twitter , .fa-youtube , .fa-instagram , .fa-reddit-alien , .fa-linkedin { font:20px/42px awesome; }
	.menulink { display:block; width:100%; line-height:50px; border-top:solid 1px rgba(26,118,186,.5); box-sizing:border-box; margin:0; }
	.menuseparator { display:none; }
	.topicsblock , .sectionblock , .contactblock , .skillsblock { width:100%; }
	.iframeblock { height:300px; }
}