@charset "utf-8";
/* CSS Document */
@import url(https://fonts.googleapis.com/css?family=Roboto:400,400italic,500,300italic,300,500italic);


@font-face {
font-family: 'Questrial-Regular';
src: url('../fonts/questrialregular.eot');
src: url('../fonts/questrialregular.eot?#iefix') format('embedded-opentype'),
url('../fonts/questrialregular.woff') format('woff'),
url('../fonts/questrialregular.ttf') format('truetype'),
url('../fonts/questrialregular.svg#questrialregular') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Montserrat', sans-serif;
src: url('../fonts/proximanovaaltbold.eot');
src: url('../fonts/proximanovaaltbold.eot?#iefix') format('embedded-opentype'),
url('../fonts/proximanovaaltbold.woff') format('woff'),
url('../fonts/proximanovaaltbold.ttf') format('truetype'),
url('../fonts/proximanovaaltbold.svg#proximanovaaltbold') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'ProximaNovaLight';
src: url('../fonts/proximanovalight.eot');
src: url('../fonts/proximanovalight.eot?#iefix') format('embedded-opentype'),
url('../fonts/proximanovalight.woff') format('woff'),
url('../fonts/proximanovalight.ttf') format('truetype'),
url('../fonts/proximanovalight.svg#proximanovalight') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'ProximaNovaRegular';
src: url('../fonts/proximanovaregular.eot');
src: url('../fonts/proximanovaregular.eot?#iefix') format('embedded-opentype'),
url('../fonts/proximanovaregular.woff') format('woff'),
url('../fonts/proximanovaregular.ttf') format('truetype'),
url('../fonts/proximanovaregular.svg#proximanovaregular') format('svg');
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'SakkalMajalla';
src: url('../fonts/majalla.eot');
src: url('../fonts/majalla.eot?#iefix') format('embedded-opentype'),
url('../fonts/majalla.woff') format('woff'),
url('../fonts/majalla.ttf') format('truetype'),
url('../fonts/majalla.svg#majalla') format('svg');
font-weight: normal;
font-style: normal;
}

/*.roboto{font-family: 'Roboto', sans-serif;}*/

.selecter { display: block; margin:0; position: relative; /*max-width: 30%;*/ z-index: 1;}
.selecter .selecter-element { *left: -999999px; height: 100%; left: 0; position: absolute; opacity: 0; width: 100%; z-index: -1; }
.selecter .selecter-element,.selecter .selecter-element:focus { outline: none;-webkit-tap-highlight-color: rgba(255, 255, 255, 0);-webkit-tap-highlight-color: transparent;}
.selecter .selecter-selected { background: #fff url(../images/arrow-grey.png) no-repeat right center; border: 1px solid #ccc; border-radius: 0; color: #7f7f7f; cursor: pointer; display: block; font-size: 16px; margin: 0; overflow: hidden; padding:6px 12px; position: relative; text-overflow: clip; z-index: 2; height:53px; border-radius:4px; line-height:40px}
.selecter .selecter-options { border: 1px solid #ccc; border-width: 0 1px 1px; background-color: #fefefe; border-radius:0; /*box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);*/ display: none; left: 0; margin: 0; max-height: 260px; overflow: auto; overflow-x: hidden; padding: 0; position: absolute; top: 100%; width: 100%; *width: auto; z-index: 50; -webkit-box-shadow: 1px 0 7px 0 rgba(0,0,0,0.31);box-shadow: 1px 0 7px 0 rgba(0,0,0,0.31); }
.selecter .selecter-group { background: #F9F9F9; border-bottom: 1px solid #e3e3e3; color: #999; display: block; font-size: 14px; padding: 5px 10px 4px; text-transform: uppercase; }
.selecter .selecter-item { background: #f3f3f3; /*border-bottom: 1px solid #e3e3e3;*/ color: #7f7f7f; cursor: pointer; display: block; font-size: 14px; margin: 0; overflow: hidden; padding: 8px 10px; text-overflow: ellipsis; width: 100%;}
.selecter .selecter-item.placeholder { display: none; }
.selecter .selecter-item.selected { background: #fff; }
.selecter .selecter-item.disabled { color: #999; cursor: default; }
.selecter .selecter-item:first-child { border-radius: 4px; }
.selecter .selecter-item:last-child { border-radius: 0; border-bottom: 0; }
@media screen and (min-width: 980px) {
.selecter .selecter-item:hover, .selecter .selecter-item.selected:hover { background-color: #f3f3f3; }
.selecter .selecter-item.disabled:hover { background-color: #f3f3f3; }
.selecter:hover .selecter-selected { background-color: #fff; }
.selecter.disabled .selecter-item:hover { background: #f3f3f3; }
}
/* Open */.selecter.open { z-index: 3; }
.selecter.open .selecter-selected { border-radius: 4px; z-index: 51; }
.selecter.open .selecter-selected,.selecter.focus .selecter-selected { background-color: #fff; box-shadow: 0 0 5px rgba(0, 0, 0, 0.1); }
/* 'Cover' Positioning */.selecter.cover .selecter-options { border-radius: 0; border-width: 1px; top: 0; }
.selecter.cover .selecter-options .selecter-item.first { border-radius: 0; }
.selecter.cover.open .selecter-selected { border-radius: 0; z-index: 49; }
/* 'Bottom' Positioning */.selecter.bottom .selecter-options { border-width: 1px 1px 0; bottom: 100%; top: auto; }
.selecter.bottom .selecter-item:last-child { border: none; }
.selecter.bottom.open .selecter-selected { border-radius: 0; }
.selecter.bottom.open .selecter-options { border-radius: 0; }
/* 'Bottom' + 'Cover' Positioning */.selecter.bottom.cover .selecter-options { bottom: 0; top: auto; }
.selecter.bottom.cover.open .selecter-selected { border-radius: 0; }
.selecter.bottom.cover.open .selecter-options { border-radius: 0; }
/* Multiple Select */.selecter.multiple .selecter-options { border-radius: 0; border-width: 1px; box-shadow: none; display: block; position: static; width: 100%; }
/* 'Disabled' State */.selecter.disabled .selecter-selected { background: #f3f3f3; border-color: #eee; color: #ccc; cursor: default; }
.selecter.disabled .selecter-options { background: #f3f3f3; border-color: #eee; }
.selecter.disabled .selecter-group,.selecter.disabled .selecter-item { border-color: #eee; color: #ccc; cursor: default; }
.selecter.disabled .selecter-item.selected { background: #fafafa; }
/* Scroller Support */.selecter .selecter-options.scroller { overflow: hidden; }
.selecter .selecter-options.scroller .scroller-content { max-height: 260px; padding: 0; }
/* Media Queries */@media screen and (max-width: 740px) {.selecter { max-width: 100%; }
}
@media screen and (max-width: 500px) {.selecter { max-width: 100%; }
}

.pre-header{ margin:0; padding:15px 0 12px 0; color:#2499ce; font-family: 'Montserrat', sans-serif; font-size:16px;}
.pre-header .col-xs-5{ text-align:right;}
.pre-header .col-xs-5, .pre-header .col-xs-7{ padding-left:5px; padding-right:5px;}
.pre-header .row{ margin-left:-5px; margin-right:-5px;}

.header{ margin:4px 0 0; padding:; background:url(../images/header-lg.jpg) no-repeat center; height:160px; position:relative;}
.logo{ padding-top:25px;}
.img-logo{margin-right:20px;padding-top:20px;}
.ksimc{ text-align:right}
.hyderi-logo{ padding-top:24px; text-align:center;}

.navigation{ margin:0; padding:0; background:#e1e1e1; position:relative}

.menu{display:table; width:100%; margin:0; padding:0; list-style:none;}
.menu li{display:table-cell; position:relative; font-size:13px; position:relative; text-transform:uppercase; font-weight:700}
.menu li a{text-decoration:none; text-align:center; padding:20px 15px; display:block; color:#3a3a3a; -webkit-transition:all 0.2s ease-in-out 0s; -moz-transition:all 0.2s ease-in-out 0s; -o-transition:all 0.2s ease-in-out 0s; -ms-transition:all 0.2s ease-in-out 0s; transition:all 0.2s ease-in-out 0s; font-family: 'Montserrat', sans-serif; }
.menu li a:hover, .menu li:hover > a,  .menu li.active > a{color:#fff; background:#1b508b }
.menu ul{display:none; margin:0; padding:0; width:200px; position:absolute; top:100%; left:0px; background:#ffffff; }
.menu ul li{display:block; float:none; background:none; margin:0; padding:0; border-top:1px solid #399ae8; }
.menu ul li a{font-size:14px; font-weight:normal; display:block; color:#fff; background:#37a5de; padding:5px 10px; white-space:nowrap;  }
.menu ul li a:hover, .menu ul li:hover > a{background:#f2f2f2; color:#000; }
.menu ul li:before{ display:none;}
.menu li:hover > ul{display:block; }
.menu ul ul{left:149px; top:0px; }
.mobile-menu{display:none; padding:0; background:url(../images/menu-toogle.png); height:28px; width:38px; position:absolute; top:50%; left:15px; z-index:11; text-indent:-9999px; margin-top:-14px;}
@media (max-width: 767px) {
.navigation{ margin:0; border:none;}
.menu{display:none; float:none; }
.mobile-menu{display:block; }
nav{margin:0; background:none; }
.menu li{display:block; margin:0; background:none; border-bottom:1px solid #ccc;}
.menu li a{border:none; padding:10px 20px; background:#e1e1e1; font-size:18px;}
.menu li a:hover, .menu li:hover > a,  .menu li.active > a{color:#fff; background:#1b508b }
.menu ul{display:block; position:relative; top:0; left:0; width:100%; }
.menu ul ul{left:0; }
.menu{ position:absolute; top:100%; right:-15px; left:-15px; width:auto; z-index:999;}
}

.tab-viisible{ display:none; margin-bottom:20px;}
.tab-viisible .form-control { height:38px;}
.tab-viisible .selecter .selecter-selected{ background:#1b508b url(../images/arrow-white.png) no-repeat right; color:#fff; height:38px; line-height:24px; border-color:#1b508b}
.tab-viisible .selecter .selecter-item.selected{background:#1b508b; color:#fff;}
.tab-viisible .input-group-addon{ background:#fff; border-left:none; color:#b2b2b2; font-size:18px}
.tab-viisible .form-control{ border-right:none; box-shadow:none;}
.tab-viisible .form-control:focus{ border-color:#ccc;}
.tab-viisible select.form-control{ background:#1b508b; border-color:#1b508b; color:#fff;}
.tab-viisible label{ line-height:38px;}



.search-form { margin:10px 0;}
.search-form .input-group-addon{ background:#fff; border-left:none; color:#1b508b; font-size:22px; border-radius:0; border-color:#fff;}
.search-form .form-control{ border-right:none; box-shadow:none; height:40px; border-radius:0; border-color:#fff;}
.search-form .form-control:focus{ border-color:#ccc;}

.search-icon{ position:absolute; padding:0; background:#000; border:1px solid #1b508b; color:#1b508b; line-height:34px; font-size:20px; height:34px; width:38px; position:absolute; top:50%; right:15px; z-index:11; margin-top:-19px; border-radius:0; text-align:center; display:none;}
.search-icon:hover{ color:#fff;}

.search-xs{ padding:15px; margin:0; position:absolute; left:0; right:0; top:100%; background:#1b508b; border-top:1px solid #1b508b; display:none; z-index:99}
.search-xs .input-group-addon{ background:#fff; border-left:none; color:#b2b2b2; font-size:18px}
.search-xs .form-control{ border-right:none; box-shadow:none;}
.search-xs .form-control:focus{ border-color:#ccc;}

.wrapper{ margin:0; padding:24px 0; overflow:hidden}
.welcome-banner{ margin:0; padding:35px; background:url(../images/welcome-bg.jpg) no-repeat center; background-size:cover; border-radius:0; position:relative; border-radius:6px; position:relative;}
.welcome-banner h1{ margin:0; padding:0 0 5px 0; font-size:40px; color:#ffffff; font-weight:300; font-family: 'Montserrat', sans-serif; margin-top:0}
.welcome-banner h1 strong{ font-weight:normal; color:#1b508b; font-weight:700;}
.welcome-banner p{ margin:0; padding:12px 0 0 0; color:#e5e2e2; font-size:15px; font-weight:300;}
.shadow{ margin:10px 0 25px 0; text-align:center;}
.al-ahad-logo{ position:absolute; top:-8px; right:0;}

.quick-links{ margin:0 0 15px; padding:4px 12px; background:#1b508b; border-radius:0;}
.quick-links ul{ margin:0; padding:0; list-style:none;}
.quick-links ul li{ border-bottom:1px solid #fed170; color:#fff; text-transform:uppercase;}
.quick-links ul li:last-child{ border:none;}
.quick-links ul li a{ background:url(../images/bullet.png) no-repeat left center; padding:10px 0 10px 20px; color:#fff; display:block;}
.quick-links ul li a:hover{ color:#000; text-decoration:none}

.form-wrap{ margin:0 0 45px 0; padding:0;}
.form-wrap h2{ margin:0 0 20px 0; line-height:50px; font-size:24px; font-family: 'Montserrat', sans-serif; color:#000000; border-top:2px solid #bde6c4; font-weight:700}
.form-wrap h2 span{ background:#bde6c4; padding:0 25px; display:inline-block; position:relative}
.form-wrap h2 span:after { width: 0; height: 0; border-top: 50px solid #bde6c4; border-right: 50px solid transparent; position:absolute; top:0; left:100%; content:'';} 
.form-wrap .form-control{ height:53px; font-size:16px;}
.form-wrap input[type=submit]{ width:185px; display:block; margin:0 auto; border-radius:4px; color:#fff; height:53px; background:#1b508b; font-family: 'Montserrat', sans-serif; display:inline-block; font-size:20px; border:none; cursor:pointer; font-weight:700; text-transform:uppercase;}
.form-wrap input[type=submit]:hover{ background:#bde6c4;}

.area-list{ margin:0 0 15px; padding:0;}
.area-list h3{ margin:0; padding:15px; color:#000000; font-size:16px; text-transform:uppercase; font-weight:700; background:#bde6c4}
.area-list ul{ margin:0; padding:0; list-style:none; background:#1b508b; padding:15px;}
.area-list ul:before, .area-list ul:after{ content:''; display:table;}
.area-list ul:after{ clear:both;}
.area-list li{ margin:0; padding:0;}
.area-list li a{ padding:8px 2px 8px 35px; background:url(../images/map-marker.png) no-repeat 5px center; color:#fff; border-bottom:1px solid #f7d168; font-size:14px; text-transform:uppercase; display:block; font-weight:700;}
.area-list select.form-control{ background:url(../images/map-marker.png) no-repeat 8px; padding-left:30px; height:53px;}
.area-list .selecter .selecter-selected{ color:#1b508b; font-family: 'Montserrat', sans-serif; background:url(../images/arrow-grey.png) no-repeat right, url(../images/map-marker.png) no-repeat 8px center; padding-left:32px}

.short-alphabet{ margin:0 0 45px; padding:0}
.short-alphabet h3{ margin:0 0 20px 0; line-height:50px; font-size:24px; font-family: 'Montserrat', sans-serif; color:#000000; border-top:2px solid #bde6c4; font-weight:700}
.short-alphabet h3 span{ background:#bde6c4; padding:0 25px; display:inline-block; position:relative}
.short-alphabet h3 span:after { width: 0; height: 0; border-top: 50px solid #bde6c4; border-right: 50px solid transparent; position:absolute; top:0; left:100%; content:'';} 

.short-alphabet h4{ color:#202020; font-size:16px; font:700; text-align:center; background:url(../images/line.jpg) repeat-x center; font-family:'ProximaNovaA-Bold'; margin-bottom:20px;}
.short-alphabet h4 span{ padding:0 10px; background:#fff;}
.short-alphabet ul{ margin:0 -5px; padding:0; list-style:none; text-align:center}
.short-alphabet ul:before, .short-alphabet ul:after{ content:''; display:table;}
.short-alphabet ul:after{ clear:both;}
.short-alphabet ul li{ padding:0 5px; margin-bottom:10px; display:inline-block; text-align:center; font-family: 'Roboto', sans-serif; text-transform:uppercase; font-size:32px; font-weight:300; text-align:center;}
.short-alphabet ul li a{ padding:0; border:3px solid #e0e0e0; border-radius:50%; display:block;   height:63px; width:63px; line-height:53px;}
.short-alphabet ul li a:hover, .short-alphabet ul li.active a{ color:#fff; background:#1b508b; border-color:#1b508b; text-decoration:none;}

.donation h4{ margin:0 0 20px 0; line-height:50px; font-size:24px; font-family: 'Montserrat', sans-serif; color:#fff; border-top:2px solid #bde6c4; font-weight:700}
.donation h4 span{ background:#bde6c4; padding:0 25px; display:inline-block; position:relative}
.donation h4 span:after { width: 0; height: 0; border-top: 50px solid #bde6c4; border-right: 50px solid transparent; position:absolute; top:0; left:100%; content:'';} 
.donation p{ font-size:16px; text-align:center;}
.donation  a{ width:185px; display:block; margin:0 auto; line-height:53px; text-align:center; border-radius:4px; color:#fff; height:53px; background:#1b508b; font-family: 'Montserrat', sans-serif; font-size:20px; border:none; cursor:pointer; font-weight:700;}
.donation  a:hover{ background:#bde6c4; text-decoration:none}

.footer{ margin:0; padding:30px 0; text-align:center; background:#0d0d0d}
.footer ul{ margin:0; padding:30px 0; border-bottom:1px solid #c0c0c0; border-top:1px solid #c0c0c0; list-style:none;}
.footer ul li{ margin:0 30px; padding:0; display:inline-block; text-transform:uppercase;}
.footer ul li a{ color:#3a3a3a}
.footer ul li a:hover{ text-decoration:none; color:#1b508b}
.footer p{ margin:0; padding:0; color:#7c7c7c}
.footer p a{ color:#7c7c7c; display:inline-block;}
.footer p a:after{ margin:0 10px; content:'|'; float:right; display:block;}
.footer p a:last-child:after{ display:none;}

.page-heading{ margin:0; padding:0 0 0 50px; height:137px; background:url(../images/black-bg.jpg) no-repeat center; background-size:cover; border-radius:4px; display:table; width:100%; position:relative; overflow:hidden}
.page-heading h1{ margin:0; padding:0; display:table-cell; vertical-align:middle; font-size:40px; font-family: 'Montserrat', sans-serif; font-weight:300; text-transform:uppercase; color:#fff;}
.page-heading h1 strong{ color:#1b508b}
.page-heading .img-logo{ vertical-align:middle; float:right;}
.page-banner{ margin:25px 0}
.content-block{ margin:0; padding:0;}
.content-block  p{ font-size:15px; color:#6c6e6f; line-height:24px; margin-bottom:15px;}


.search-result-box{ height:160px;margin-top:30px; padding:20px; border:2px solid #bde6c4; background:#fff; -webkit-box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.21); box-shadow: 5px 5px 5px 0 rgba(0,0,0,0.21); border-radius:5px;}
.search-result-box:hover{ background:#ecf5f4; border-color:#1b508b}
.search-result-box h4{ margin:0 0 6px 0; padding:0 0 6px 0; border-bottom:1px solid #fee8b7; color:#1b508b; font-size:22px; font-family: 'Montserrat', sans-serif; font-weight:700}
.search-result-box ul{ margin:0; padding:0; list-style:none;}
.search-result-box ul li{ font-size:16px; color:#272827;}

/* #Media Queries
================================================== */
/* Large desktop */

@media (min-width: 992px) and (max-width: 1199px) {
/*.pre-header{ font-size:14px;}*/
/*.header{ background:url(../images/header-md.jpg) no-repeat center;}*/
.ksimc{ padding-right:30px;}
.area-list h3, .form-wrap h2, .short-alphabet h3{ font-size:20px;}
.area-list li a{ font-size:15px;}
.menu li a{ padding-left:8px; padding-right:8px;}
.welcome-banner h1{ font-size:32px;}
.welcome-banner{ padding:28px;}
}

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 991px) {
.header{ background:url(../images/header-sm.jpg) no-repeat center;}
.ksimc{ padding-right:30px;}
.ksimc img{ width:150px;}
/*.pre-header{ font-size:11.07px;}*/
.welcome-banner{ padding:24px;}
.welcome-banner h1{ font-size:30px;}
.area-list h3, .form-wrap h2, .short-alphabet h3{ font-size:20px;}
.area-list li a{ font-size:15px;}
.footer p span{ display:block;}
.footer ul{ display:none;}
.tab-viisible{ display:block;}
.menu li a{ padding-left:8px; padding-right:8px;}
.page-heading h1{ font-size:30px;}
.search-result-box h4{ font-size:20px;}
} 
/* END__ */

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {
.pre-header{ font-size:14px; text-align:center;}
.header{ background:url(../images/header-xs.jpg) no-repeat center ; padding:20px 0; height:auto;}
.logo{ text-align:center; padding:0 60px;}
.search-icon{  display:block;}
.welcome-banner h1{ font-size:36px;}
.welcome-banner .col-sm-3 img{ width:120px;}
.short-alphabet ul{ text-align:center;}
.area-list h3, .form-wrap h2, .short-alphabet h3, .content-block h2, .donation h4 { font-size:18px;}
.short-alphabet h3{ background:none;}
.short-alphabet h3 span, .donation h4 span{ padding:0 0 0 15px;}
.area-list ul{ display:none;}
.footer ul{ display:none;}
.tab-viisible{ display:block;}
.page-heading{ padding:15px;}
.page-heading h1{ font-size:24px;}
.page-heading .img-logo{ width:70px;}
.page-heading{ height:120px;}
.al-ahad-logo{ display:none;}
} 
/* END__ */
 
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
} 
/* END__ */

/* Landscape phones and down */
@media (max-width: 400px) {
.welcome-banner{ padding:15px;}
.form-wrap h2, .short-alphabet h3, .donation h4{ line-height:inherit; ;}
.form-wrap h2 span, .short-alphabet h3 span, .donation h4 span{ display:block; padding:8px 12px;}
.form-wrap h2 span:after, .short-alphabet h3 span:after, .donation h4 span:after{ display:none}
} 
/* END__ */

