/*@import url('http://fonts.googleapis.com/css?family=Capriola');
@import url('http://fonts.googleapis.com/css?family=Telex');
@import url(http://fonts.googleapis.com/css?family=Telex);

@import url('http://fonts.googleapis.com/earlyaccess/notosanskufiarabic.css');
@import url(http://fonts.googleapis.com/earlyaccess/notosansmalayalam.css);
*/@import url('http://fonts.googleapis.com/earlyaccess/droidarabicnaskh.css');

* {
	margin: 0;
	padding: 0;
	font-family:'Droid Arabic Naskh',Tahoma, serif,'Trebuchet MS', Tahoma, Arial;
}

body {
    height: 100%;
    background: #fff;
    background: url(../imgs/Cloud-7.png) top left repeat-x, -moz-linear-gradient(top, #0154d6 0%, #fff 80%);
    background: url(../imgs/Cloud-7.png) top left repeat-x, -o-linear-gradient(top, #0154d6 0%, #fff 80%);
    background: url(../imgs/Cloud-7.png) top left repeat-x, -webkit-linear-gradient(top, #0154d6 0%, #fff 80%);
    background: url(../imgs/Cloud-7.png) top left repeat-x, -webkit-gradient(linear, left top, left bottom, color-stop(0, #0154d6 0%), color-stop(1, #fff 80%));
    filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr=#0154d6 0%, EndColorStr=#fff 80%)";
    background: url(../imgs/Cloud-7.png) top left repeat-x, linear-gradient(top, #0154d6 0%, #fff 80%);
    }

/* ------------ loading -------------*/
.loading {
	-webkit-animation: loading 45s infinite linear;
	-moz-animation: loading 45s infinite linear;
	-ms-animation: loading 45s infinite linear;
	-o-animation: loading 45s infinite linear;
	animation: loading 45s infinite linear;
}

@keyframes "loading" {
 0% {
    background-position: 0 0;
 }
 100% {
    background-position: -100% 0;
 }

}

@-moz-keyframes loading {
 0% {
   background-position: 0 0;
 }
 100% {
   background-position: -100% 0;
 }

}

@-webkit-keyframes "loading" {
 0% {
   background-position: 0 0;
 }
 100% {
   background-position: -100% 0;
 }

}

@-ms-keyframes "loading" {
 0% {
   background-position: 0 0;
 }
 100% {
   background-position: -100% 0;
 }

}

@-o-keyframes "loading" {
 0% {
   background-position: 0 0;
 }
 100% {
   background-position: -100% 0;
 }

}



.clear {
	clear: both;
}
.sectio {
	width: 1000px;
	padding: 0px 20px 0px 20px;
	margin: 0 auto;
	border: 0px red solid;
	clear: both;
}
.section {
	width: 1000px;
	padding: 20px;
	margin: 0 auto;
	border: 0px red solid;
	clear: both;
}
.top {
	margin-top: 10px;
	width: 100%;
	clear: both;
}
.med-content {
	background: #fff;
/*	background-image:url('../imgs/top-ba.jpg');
	background-position:center top;
	background-repeat:no-repeat;
*/box-shadow: 0px 0px 40px 2px #fff;
	min-height: 300px;
	height: auto;
	padding: 0px 0px 60px 0px;
	clear: both;
	border-radius: 20px;
}

.bottom {
	background-image: url('../imgs/web-bottom.jpg');
	background-position: center bottom;
	background-repeat: no-repeat;
	padding-top: 10px;
	margin-top: 10px;
	height: 100px;
}
.topmain {
	clear: both;
	height: 230px;
	border: 0px #ccc solid;
}
.logoside {
	padding-top: 0px;
	border: 0px red solid;
	width: 100%;
	float: left;
}
.logo {
	float: left;
	height: 100px;
	width:413px;
}
.search{
	float:right;
	width:250px;
}
.search span{
	text-align:left;
	width:70%;
	float:right;
	height:30px;
	padding:0px 0px 0px 30px;
	color:#ccc;
}
.search span:hover,.search span img:hover{
	color:#fff;
	opacity:1;
}
.search span img{
	width:auto;
	height:inherit;
	float:left;
	opacity:0.5;
}


.search input{
	width:100%;
	padding:2px;
	background-color:transparent;
	color:#fff;
	border-radius:4px;
	border-spacing:1px 1px;
	border:1px #ccc solid;
}
.search input:focus{
	border:1px #fff solid;
}
.cotitle {
	color: #fff;
	text-shadow: -1px 2px 2px #333;
	padding: 10px;
	width: 100%;
	font-weight: bold;
	float: left;
	text-align: center;
	font-size: 36px;
	
}
.cotitle span {
	text-shadow: 0px 1px 1px #fff;
	font-family:Arial, Helvetica, sans-serif;
	color:#000;
	font-size: 24px;
}
.slideshow {
	width: 1000px;
	float: left;
	box-shadow: 0px 0px 5px 1px #fff;
	height: 300px;
	margin-bottom: 10px;
	margin-top:20px;
}
.leftp {
	float: left;
	width: 180px;
	min-height: 400px;
	border: 1px #ccc solid;
}
.rightp {
	float: right;
	width: 20%;
	border: 1px #ccc solid;
	margin-bottom: 20px;
}
.divi {
	height: 0px;
	margin:20px 20px 30px 20px;
	border-bottom: 1px #ccc dashed;
	clear: both;
}
.content {
	border:0px red solid;
	margin: 0 auto;
	width: 960px;
	height: auto;
	padding: 30px 0px 0px 0px;
}
.content h1 {
	text-align:left;
	direction:ltr;
	text-shadow:0px 1px 0px #ccc;

	text-shadow: 0px 1px 1px #fff; /*text-shadow: 0px 1px 2px rgba(0,100,0, 0.4);*/;
	background-image: url('../imgs/icon.png');
	background-repeat: no-repeat;
	background-position: left;
	padding: 20px 20px 20px 30px;
	color: #272727;
	font-size: 23px;
	line-height: 36px;
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}
.content h1:hover {
	color: #25B0EA;
	margin-right: 5px;
	-webkit-transition: all 500ms ease;
	-moz-transition: all 500ms ease;
	-o-transition: all 500ms ease;
	transition: all 500ms ease;
}
.content h2 {
	text-align:left;
	direction:ltr;

	font-size: 18px;
	line-height: 35px;
}
.content h2 a {
background: rgba(255,255,255,1);
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(100%, rgba(237,237,237,1)));
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=0 );	padding: 6px 10px 6px 20px;
	border-radius: 3px;
	box-shadow: 0px 0px 3px 1px #fff;
	color: #333;
	text-shadow: 1px 1px 1px rgba(255,255,255, 1);

	margin: 10px 30px 10px 40px;
	border: 2px #ccc solid;
	display: block;
	text-decoration: none;
	-webkit-transition: all 700ms ease;
	-moz-transition: all 700ms ease;
	-o-transition: all 700ms ease;
	transition: all 700ms ease;
}
.content h2 a:hover {
	color: #25B0EA ;
	text-shadow: 1px 2px 1px rgba(255,255,255, 1);
	border: 2px #25B0EA solid;
	border-radius:5px;

	margin-right: 0px;
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
}
.content p {
	text-align:right;
	direction:rtl;
	width: 95%;
	padding: 0px 20px 0px 20px;
	text-align: left;
	font-size: 15px;
	line-height: 18pt;
	font-weight: lighter;
	text-shadow: 0px 1px 1px #fff;
	line-height: 30px;
}
.content ul li{
	display:inline-block;
	padding-right:40px;
}
.content p img {
	padding: 0px;
	margin: 20px;
	box-shadow: 0px 1px 1px 1px #f1f1f1;
}
.content p a {
	color: #000;
	font-size: 15px;
	text-decoration: none;
	line-height: 18pt;
	font-weight: bold;
}
.content hr {
	border: 1px #666 solid;
	margin: 10px 20px 10px 20px;
	box-shadow: 0px 0px 1px 1px #f1f1f1;
}
.content table {
	border: 1px #666 solid;
	margin: 10px 20px 10px 20px;
}
.content table th {
	padding: 3px;
	background-color: #666;
	color: #fff;
}
.content table td {
	padding: 3px;
	border: 1px #666 solid;
}
.content caption {
	padding: 10px;
	background-color: #666;
	color: #fff;
}
.slidetitle{
	box-shadow:0px 0px 5px 1px #ccc;
	height:40px;
	border-radius:20px;
	border-top:1px #ccc solid;
	border-left:1px #ccc solid;
	border-right:1px #ccc solid;
	width:200px;
	text-align:center;
	font-size:20pt;
	padding:5px;
	margin-top:-30px;
}
.slidetitle a{
		color:#25B0EA;
		text-decoration:none;
}
/*----------------- footer --------------------------*/

.footer {
	text-align:right;
	direction:rtl;
	color:#828282;
	text-align:center;
	font-size:10pt;
	margin-top: -79px;
	clear: both;
	height: 150px;
	padding: 0px 20px 20px 20px;
	background-image: url('../imgs/web-bottom.jpg');
	background-position: center bottom;
	background-repeat: no-repeat;
}
.footer-content {
	margin-bottom:10px;
	clear: both;
}
.footer-left {
	color:#858585;
	font-size:12pt;
	height:70px;
	float:left;
	margin: 10px;
	border-right: 1px #999 dashed;
	padding:10px;
	float: left;
	width: 250px;
	text-align:left;
}
.footer-left img{
	margin-right:5px;
	float:left;
}
.footer-left a{
	color:#858585;
	text-decoration:none;
}
.footer-left a:hover{
	color:#1D8DDF;
}
.footer-left span {
	font-size: 10pt;
}

.footer-right {
	color:#858585;
	height:70px;
	float:right;
	margin: 10px;
	border-left: 1px #999 dashed;
	padding: 10px 10px 10px 10px;
	float: right;
	width: 250px;
}
.footer-right label{
	margin-right:30px;
	padding:4px;
	float:right;
	clear:both;
}
.footer-right label img{
	margin-bottom:-5px;
	margin-left:8px;
	opacity:0.6;
	height:20px;
}
.footer-right label:hover{
	color:#000;
		-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;

}

.footer-center{
	text-align:center;
	padding:20px 10px 10px 10px;
	margin:0 auto;
	width:360px;
	height:20px;
}

.footer-center a{
	padding:10px 0px 5px 0px;
	border-bottom:1px #999 dashed;
	height:30px;
	opacity:0.6;
	text-decoration:none;
	margin-right:0px;
	font-size:12pt;
	color:#000;
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
	text-align:left;
}
.footer-center a img{
	height:20px;
	margin-bottom:-4px;
	margin-right:3px;
	
}
.footer-center a:hover{
	color:#1D8DDF;
	border-bottom:2px #999 solid;
	opacity:1;
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;

}
/*-----------------end footer--------------------------*/

/*----------back to top------------*/
#back-top {
	float:right;
	opacity:0.5;
	padding:10px;
	width:40px;
	height:40px;
	border-radius:40px;
	border:1px #999 solid;
	position: fixed;
	bottom: 40px;
	right:40px;
	margin-left: -150px;
	background-color:#25C1F1;
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;

}
#back-top:hover{
	opacity:1;
		background-color:#fff;
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;

	
}
#back-top a {
	display:block;
	opacity:0.5;
	margin-top:-15px;
	font-size:30pt;
	display: block;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	color: orange;
	/* background color transition */
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
}
#back-top a:hover {
	font-weight:bold;
	opacity:1;
	color: orange;
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;

}

/*------------end of back to top---------*/
.contact{
	padding:10px;
	float:right;
	width:940px;
	box-shadow: 0px 0px 10px 1px #333;
	min-height:300px;
	border-radius:20px;
}

.conatctinfo {
	width: 400px;
	float: left;
	padding: 10px;
	margin: 10px auto;
	border: 0px #66CCFF solid;
	border-radius: 10px;
}

.formcontact{
	border-radius:20px;
	padding:20px;
	float:right;
	width:430px;
	border: 3px #66CCFF solid;
	height:400px;
}
.map{
	display:none;
	float:right;
	width:200px;
	height:200px;
	border-radius:200px;
	border:3px #66CCFF solid;
}

.formcontact table {
	border:0;
	width:450px;
	margin:0 auto;
}
.formcontact table th{
	height:60px;
	width:60px!important;
	border-radius:45px;
	background-color:#ccc;
}
.formcontact table td{
border: 0;
}
.formcontact table td input{
	text-align:right;
	direction:rtl;
	width:270px;
	padding:15px;
	height:30px;
	font-size:20px;
	border-radius:45px;
	outline:none;
}
.formcontact table td textarea {
	text-align:right;
	direction:rtl;
	width:340px;
	padding:15px;
	height:130px;
	font-size:20px;
	border-radius:15px;
	outline:none;
}
.formcontact table td input[type=submit]{
	text-align:center;
	width:370px;
-moz-box-shadow: 0px 5px 7px -3px #3e7327;
	-webkit-box-shadow: 0px 5px 6px -3px #3e7327;
	box-shadow: 0px 10px 14px -7px #3e7327;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #77b55a), color-stop(1, #72b352));
	background: -moz-linear-gradient(top, #77b55a 5%, #72b352 100%);
	background: -webkit-linear-gradient(top, #77b55a 5%, #72b352 100%);
	background: -o-linear-gradient(top, #77b55a 5%, #72b352 100%);
	background: -ms-linear-gradient(top, #77b55a 5%, #72b352 100%);
	background: linear-gradient(to bottom, #77b55a 5%, #72b352 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#77b55a', endColorstr='#72b352',GradientType=0);
	background-color: #77b55a;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	border: 1px solid #4b8f29;
	display: inline-block;
	cursor: pointer;
	color: #fff;
	font-size: 13px;
	font-weight: bold;
	padding: 8px 15px;
	text-decoration: none;
	text-shadow: 0px 1px 0px #5b8a3c;	
}