@font-face { font-family: 'FontAwesome'; src: url('font-awesome/fonts/fontawesome-webfont.eot?v=4.7.0'); src: url('font-awesome/fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('font-awesome/fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('font-awesome/fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('font-awesome/fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg'); font-weight: normal; font-style: normal; }

body {overflow-x: hidden; margin:0; padding:0 }
@media print {
    .pagebreak {
        clear: both;
        page-break-after: always;
    }
}
/*#f1f1f1*/
.push-LeftRight { float: right }

.push-RightLeft { float: left }

.breadcrumb { display: none }

.marTB10 { margin: 10px 0 !important }

.marTB5 { margin: 5px 0 !important }

.subHeading { color: #0a6b7a; font-size: 14px; font-weight: 800; margin: 0 0 0.5rem 0; padding: 0 }

.rel { position: relative }

.posAB0 { position: absolute; bottom: 0 }

.DeleteSingleFile { font-size: 1rem !important; margin: 0 5px; padding: 2px 4px; color: #54696c; border: 1px solid #54696c; border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; }

.radioClass input[type="radio"] { margin: 0 5px; display: inline-block; vertical-align: bottom }

.radioClass label { font-size: 12px; display: inline-block; }

.fa.fa-info-circle { color: #81999d }

.H42 { height: 42px }

.w200px { width: 200px }

.fontWeight600 { font-weight: 600 }

.jumplink, .jumplink:focus { color: #062f37; font-size: 0.70rem; font-weight: 600; background-color: #89bcc6; padding: 0.2rem 0.3rem; text-decoration: none }

.jumplink:hover { background-color: #abd2da; text-decoration: none; color: #062f37; }

.overflowxyVisible { overflow: visible !important }
.mvc-gridScroll { overflow-x: scroll; max-width: 80vw }

/*used in login page*/
/*nav*/
.sidePanel .nav a { color: #ffffff }
/*header*/
.row.headerLogos { padding-top: 5px }

.header { height: 90px; background-color: #ffffff; width: 100% }

.loginContainer { display: flex; flex-direction: column; justify-content: space-between; align-items: center; background-color: #0a7f91; width: 100%; height: 90px; }

.loginContainer .settingsMenu.dropdown-toggle { display: flex; flex-direction: row; justify-content: space-between; width: 77%; height: 90px; align-items: center; }

.loginContainer .settingsMenu.dropdown-toggle span { display: block; color: #ffffff; background: url(../images/sprite.png) no-repeat; height: 43px; padding-left: 46px; vertical-align: middle; line-height: 43px; }

.loginContainer .settingsMenu.dropdown-toggle::after {color: #fff }
.loginContainer .dropdown-menu .dropdown-submenu{ background-color:#ffffff}
.loginContainer .dropdown-menu .dropdown-submenu .nav-item .nav-link{ color:#0a7f91}
.loginContainer .dropdown-menu.show{padding:0}
/*.loginContainer .dropdown-menu { padding: 0; top: 70px; transform: translate(0, 90px) !important; }

.loginContainer .dropdown-menu.show { top: -20px !important; transform: translate(37px, 90px) !important; }
    .loginContainer { background-color: #0a7f91; width: 100%; height: 90px;position:relative; }
.loginType { padding: 10px; position: absolute; right: 0; left: 0; top: 0; bottom: 0; margin: auto; width: 76%; height: 64px }
.loginType span { color: #ffffff; background: url(../images/sprite.png) no-repeat;height: 43px; vertical-align: middle; line-height: 43px;}
.settingsMenu {height: 34px;width: 100%; position: absolute; top: -20px; left:0; right:auto }
.settingsMenu.dropdown-toggle::after{ content:"\f0c9";font-family: FontAwesome; position: absolute;  top: 10px; font-size: 18px; text-decoration: inherit; border:none; color:#fff}*/
.settingsMenu:hover { text-decoration: none; }

.nav .dropdown-item { color: #808080; }
.bootstrap-select .dropdown-item:hover, .bootstrap-select .dropdown-item:focus { background-color: #e1e1e1; }

/*logoutContainer*/
.waqfLogo { background: url("../images/WAQFlogo.png"); height: 78px; width: 90px; display: block;}
.logoutContainer{display: flex; align-items: flex-end;}
.logoutBtn, .logoutBtn:hover { text-decoration: none; background-color: #0a7f91; color: #ffffff; font-size: 12px; border-radius: 5px; -webkit-border-radius:5px; -moz-border-radius: 5px; padding: 0.2rem 0.3rem; height: 25px; vertical-align: middle; display: inline-block; font-size: 0.7rem; margin:0 0.2rem}
.logoutBtn .fa{font-size: 0.9rem;height: 15px;  width: 15px;line-height: 19px;}
.langBtn, .langBtn:hover { text-decoration: none; background-color: #ffffff; border: 0.1rem solid #0a7f91; color: #0a7f91; font-size: 0.7rem; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding:0.2rem 0.3rem; vertical-align: middle; display: inline-block;font-weight: 600;margin:0 0.2rem;height: 25px; }

.maraLogo { background: url("../images/MARAlogo.png"); height: 75px; width: 85px; display: inline-block }
/*side panel Navigation*/
/*  100% height to side panel ---https://www.bootply.com/BZQYq01ABC---*/
html, body { height: 100%; }
/*.container-fluid, .row {height:100%;}*/
.flex-row, .flex-row > div[class*='col-'] { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; flex: 0 auto; height: 100%; }

.flex-col { display: flex; display: -webkit-flex; flex: 1; flex-flow: column nowrap; }

.flex-grow { display: flex; -webkit-flex: 2; flex: 2; }

.sidePanel { background-color: #0a6b7a }

.nav-link { margin: 0 0.25rem !important; font-size: 0.9rem; }

.nav-link[data-toggle].collapsed:after { content: "▾"; position: absolute; }

.sidePanel .nav-link[data-toggle]:not(.collapsed):after { content: "▴"; position: absolute; }

.sidePanel .navbar-collapse, .sidePanel .navbar-collapse .nav { padding: 0; width: 100% }

.sidePanel .nav-item { border-bottom: 1px solid #649ba3; padding: 0; line-height: 19px }
/*padding:0 0.5rem */
.dropdown-submenu { font-size: 13px; background-color: #1c7b8a; }

.dropdown-submenu li { /*padding:4px 0 ;*/ border: none }

.dropdown-submenu li a { color: #0a7f91 }

.dropdown-submenu .nav-item { /*margin:0 0.7rem; padding: 0 0.3rem;*/ border-bottom: #0a6b7a 1px solid; }

.dropdown-submenu .nav-item .nav-link { color: #a9dfe7; font-size: 13px; /*padding: 0.3rem 0*/ }

.dropdown-subsubMenu { background-color: #3893a1; font-size: 13px; margin: 0 }

.dropdown-subsubMenu .nav-item { /*padding:4px 0 ;*/ border: none; /*margin:0 0.7rem;*/ }

.dropdown-subsubMenu .nav-item .nav-link { color: #c8f4fb; text-decoration: none }

.HPLayout .contentH, .HPLayout .contentH > div:nth-of-type(1)  { background-color:#ffffff }
.contentH { margin-bottom: 30px; background-color: #f1f1f1;min-height: calc(100vh - 107px); }

/*do not change*/
.contentH > div:nth-of-type(1) { background-color: #f1f1f1 }
/*do not change*/

/*register page accordian -https://www.cssscript.com/flexbox-based-horizontal-accordion-pure-css/ -*/

/* Main layout */

div.descriptionArea { width: 100%; height: 170px; list-style: none; position: relative; display: flex; flex-wrap: nowrap; align-items: stretch; overflow: hidden; margin-bottom: 1rem }

/* Articles */
div.descriptionArea article { flex: initial; height: 100%; text-align: center; color: #fff; text-decoration: none; vertical-align: bottom; box-sizing: border-box; padding: 0; position: relative; background: #e3e3e3; border-left: 1px solid #fff; border-right: 1px solid #fff; }

/* Hover interaction */

div.descriptionArea:hover article { flex: initial; cursor: pointer }

div.descriptionArea article { width: 3%; }

div.descriptionArea article.active { width: 92%; }


div.descriptionArea article > div { opacity: 0; transition: opacity .2s 0 ease; }

div.descriptionArea article.active > div, div.descriptionArea article:hover > div { opacity: 1; transition: opacity .2s ease 0; }
/** { transition:  .3s ease 0s; }*/
/* navigation */

div.descriptionArea article > h2 { position: absolute; width: 170px; height: 33px; margin: 0; padding: 0.5rem; transform-origin: 0 0 0; opacity: 1; font-size: 0.8rem; font-weight: 600; color: #b2e3ea; background: #0a7f91; transition: none !important }

/* Article layouts */
div.descriptionArea article div h3 { margin: 0 0 0.5rem 0; color: #0a6b7a; font-size: 1.1rem; font-weight: 600 }

div.descriptionArea article div h4 { margin: 0 0.5rem; color: #308953; text-decoration: underline; font-size: 0.8rem; font-weight: 600 }

div.descriptionArea article div.desp-body, div.descriptionArea article div h2 { margin: 0 0 1em 0; }

div.descriptionArea article div.desp-body { font-size: 0.8rem; font-weight: 600; color: #333; height: 125px; max-height: 125px; overflow-y: auto; margin-bottom: 0; }


/*div.descriptionArea article div p { width: 40vw; }*/
/*accordion responsive*/
@media (max-width: 900px) { 

    div.descriptionArea article { width: 8%; }

    div.descriptionArea article.active { width: 66%; }

    div.descriptionArea article { padding: 0 }

    div.descriptionArea article > h2 { transform-origin: 0 0 0; opacity: 1; }

    div.descriptionArea article div h3 { font-size: 0.8rem; font-weight: 800; }

    div.descriptionArea article div.desp-body { font-size: 0.7rem; }
}

/*card*/
.card-header { padding: 10px }

.card-header { background-color: transparent; border: none; margin-top: 0.5rem }

.card-footer { background-color: #ffffff; }

.card-title { font-weight: 600; color: #54696c; font-size: 1rem; background-color: #d6e4e5; width: 100%; display: block; padding: 2px 5px; margin: 0.15rem 0.15rem 0 0.15rem }

.card-body { padding: 0.8rem }
/*well*/
.wellContainer { padding: 1.5rem; background-color: #efefef; margin: 0.5rem 0 }
/*table*/
.table { background-color: #ffffff }

.table th { background-color: #d1e9ba; }

.table td { padding: 5px 15px }

.table th, .table td { font-size: 0.85rem; padding: 0.5rem }

.table td a.fa { color: #5a7b3d; margin: 0 0.1rem }

.table td a.fa:not(.fa-lg):not(.fa-2x):not(.fa-3x):not(.fa-4x):not(.fa-5x) { font-size: 1.33333333em; }

.table td a.fa:hover { text-decoration: none }

.mvc-grid .badge-info{color: #e87421; padding: 5px 10px; background-color:#fff; font-weight:bold}

/*Minutes of Meeting*/
.table-success, .table-success > th, .table-success > td{ background-color:#c3e6cb}
.table-danger, .table-danger > th, .table-danger > td{ background-color:#f5c6cb}
.table-warning, .table-warning > th, .table-warning > td{ background-color:#fff}
.table-info, .table-info > th, .table-info > td{ background-color:#b1ecf7}

/*pagination*/
.paginationCenter { margin: 0 auto; width: 35%; }

.page-link, .page-link:focus, .page-link:hover { color: #333333; font-size: 0.8rem; }

.page-item .page-link { color: #3e631a; }

.page-item.active .page-link { background-color: #d3e6c0; color: #3e631a; border: 1px solid #a5c982 }

.page-item.disabled { cursor: default; }

.page-item.disabled .page-link { background-color: #f2f2f2 }
/*form*/
.control-label { font-size: 0.8rem; font-weight: bold }

.control-text, .form-control { font-size: 0.8rem; }

input[type=submit] { cursor: pointer }

.control-text { display: block; background-color: #eeeeee; padding: 0.3rem; margin-bottom: 0.5rem; min-height: 28px; }
/*attachment*/
.attachmentIM { background-color: #e9ecef; display: block; padding: 7px; font-size: 0.8rem; border: 1px solid rgba(0, 0, 0, 0.15); border-radius: 0.25rem; -webkit-border-radius: 0.25rem; -moz-border-radius: 0.25rem; }
/*button*/
.btn { border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; padding: 0.4rem 1rem; cursor: pointer }

.btn-primary, .btn-primary:hover { background-color: #0a6b7a; border-color: #0a6b7a; font-size: 0.85rem; color: #ffffff !important; }

.btn-secondary, .btn-secondary:hover { background-color: #47b0c3; border-color: #47b0c3; font-size: 0.85rem; color: #ffffff !important; }

.btn-outline-secondary, .btn-outline-secondary:hover { border: 2px solid #003f49; font-size: 0.9rem; font-weight: 600; color: #003f49 !important; display: inline-block; background-color: transparent }

.btn-success, .btn-success:hover, .btn-danger, .btn-danger:hover { font-size: 0.9rem; color: #ffffff !important; }

.navigationLink { color: #0a6b7a; font-size: 0.8rem }

.btnSep { margin: 0 5px; color: #ffffff }

.btn.btn-info { color: #ffffff !important; border-radius: 15px; -moz-border-radius: 15px; -webkit-border-radius: 15px; padding-top: 0.4rem; padding-bottom: 0.4rem; border-color: #78b045; background-color: #78b045; font-size: 0.8rem }

.btn-outline-primary, .btn-outline-primary:hover { border: 1px #0a6b7a solid; background-color: #ffffff; font-size: 0.85rem; color: #0a6b7a; font-weight: normal }
/*grid-search-Container--update in mvcgrid.css also*/
.btn-link, .btn-link:hover { color: #186c83; font-size: 0.8rem; text-decoration: underline; font-weight: 600; }

.grid-search { color: black; width: 178px; height: 30px }

.grid-search-Container input::-webkit-input-placeholder { font-size: 12px; line-height: 30px; vertical-align: middle }

.grid-search-Container input::-moz-placeholder { font-size: 12px; line-height: 30px; vertical-align: middle }

.grid-search-Container input:-ms-input-placeholder { font-size: 12px; line-height: 30px; vertical-align: middle }

.grid-search-Container { display: inline-block }

.grid-search-Container i { background-color: #808080; color: #ffffff; height: 30px; padding: 3px 5px; vertical-align: top; line-height: 23px; margin: 0 -6px; }

.grid-search-Container a i { cursor: pointer }
/*alert*/
.text-danger { font-size: 0.7rem; font-weight: 600; line-height: 15px; /*display: block;*/ margin-top: 0.2rem; }

.alert-danger { font-size: 0.8rem; font-weight: 600; width: 100%; margin: 0 auto; padding: 0.3rem }
/*remark*/
.remark-heading { font-size: 1rem; font-weight: 800; color: #0a6b7a; display: inline-block; padding: 0 0.5rem }

.remark-heading::after { font-size: 1rem; content: ':'; font-weight: 600; }
/*modal popups*/
.modal-header{ background-color:#b7dfe5;padding: 0.5rem;}
.modal-header .close{ font-size:14px}
.modal-title span { display: inline-block; }
span#alertModelTitle { font-size: 18px; font-weight: 600; }
.modal-body .dropdownFix .dropdown-menu { position: static !important; transform: translate3d(0px, 0px, 0px) !important; }
.modal-body .dropdownFix .dropdown-menu .inner { overflow-y: scroll; max-height: 120px; }

.dropdown-width-fix .dropdown-menu{ min-width:100% !important; width: 100%}
.dropdown-width-fix .dropdown-menu .dropdown-item span.text{ white-space: pre-wrap}

/*footer*/
footer { position: fixed; bottom: 0; width: 100% }

footer p { text-align: center; font-size: 12px; color: #333333; background-color: #dcdcdc; line-height: 30px; vertical-align: middle; margin-bottom: 0 }
/*titleGroup*/
.titleGroup { padding: 25px 0 10px }

.titleGroup h2 { font-size: 20px; font-weight: 800; color: #333333 }
/*stepTabContainer*/
.stepTabWrapper { border-top: 4px solid #b8cfd3 }

.stepTab a { color: #333 }

.stepTab .nav-tabs { height: 100%; }

.stepTab .nav-tabs .nav-link.active, .stepTab .nav-tabs .nav-item.show .nav-link, .stepTab .nav-item, .stepTab .nav-tabs { border: none }

.stepTab .nav-link[data-toggle].collapsed:after { content: " "; position: unset; }

.stepTab .nav-link[data-toggle]:not(.collapsed):after { content: " "; position: unset; }

.stepTab .nav-tabs .nav-link { font-size: 13px; font-weight: 600; margin: 0 !important; position: relative; border-top-left-radius: 0; border-top-right-radius: 0; }

.stepTab .nav-tabs .nav-link i { border-radius: 3rem; -moz-border-radius: 3rem; -webkit-border-radius: 3rem; display: block; height: 50px; width: 50px; background-image: url(../images/sprite.png); background-repeat: no-repeat }
/*.stepTab .nav-tabs .nav-link span{display:inline-block;vertical-align: top;  height: 38px;  padding-top: 9px;}*/
.stepTab .nav-tabs .nav-link span { display: block; height: 38px; position: absolute; top: 0; right: 0; left: 0; bottom: 0; margin: auto; vertical-align: middle; line-height: normal; padding-top: 5px; }

.stepTab .nav-tabs .nav-link:hover { border-top: 1px solid #e9e9e9; border-bottom: 1px solid #e9e9e9; background-color: #e9e9e9 }

.stepTab .nav-tabs .nav-link.active { border-top: 1px solid #a4a3a3; border-bottom: 1px solid #a4a3a3; border-right: 1px solid #ffffff }

.stepTab .nav-tabs .nav-link.active span { font-weight: bold }

.stepTab .nav-tabs .nav-link.step0 { border-top: 1px solid #ffffff !important }

.stepTab .nav-tabs .nav-link.step0 i { background-color: #0a7f91; background-position: center -531px; }

.stepTab .nav-tabs .nav-link.active.step0 span { color: #0a7f91; }

.stepTab .nav-tabs .nav-link.step1 i { background-color: #207f1b; background-position: center -95px; }

.stepTab .nav-tabs .nav-link.active.step1 span { color: #207f1b; }

.stepTab .nav-tabs .nav-link.step2 i { background-color: #6ca93a; background-position: center -143px; }

.stepTab .nav-tabs .nav-link.active.step2 span { color: #41701a; }

.stepTab .nav-tabs .nav-link.step3 i { background-color: #f79c3b; background-position: center -194px; }

.stepTab .nav-tabs .nav-link.active.step3 span { color: #b96307; }

.stepTab .nav-tabs .nav-link.step4 i { background-color: #8567b2; background-position: center -292px; }

.stepTab .nav-tabs .nav-link.active.step4 span { color: #423457; }

.stepTab .nav-tabs .nav-link.step5 i { background-color: #45a6d8; background-position: center -345px; }

.stepTab .nav-tabs .nav-link.active.step5 span { color: #35708f; }

.stepTab .nav-tabs .nav-link.step6 i { background-color: #3262c3; background-position: center -393px; }

.stepTab .nav-tabs .nav-link.active.step6 span { color: #2c426f; }

.stepTab .nav-tabs .nav-link.step7 i { background-color: #1f419b; background-position: center -573px; }

.stepTab .nav-tabs .nav-link.active.step7 span { color: #2c426f; }

.stepTab .nav-tabs .nav-link.stepContriDetails i { background-color: #6ca93a; background-position: center -684px; }

.stepTab .nav-tabs .nav-link.active.stepContriDetails span { color: #549022; }

.stepTab .nav-tabs .nav-link.stepContactDetails i { background-color: #8567b2; background-position: center -739px; }

.stepTab .nav-tabs .nav-link.active.stepContactDetails span { color: #634197; }

.stepTab .nav-tabs .nav-link.stepDescDetails i { background-color: #3262c3; background-position: center -628px; }

.stepTab .nav-tabs .nav-link.active.stepDescDetails span { color: #3262c3; }

.stepTab .nav-tabs .nav-link.stepBankAccount i { background-color: #003965; background-position: center -793px; }

.stepTab .nav-tabs .nav-link.active.stepBankAccount span { color: #003965; }

.stepTab .nav-tabs .nav-link.stepTransaction i { background-color: #5428cd; background-position: center -851px; }

.stepTab .nav-tabs .nav-link.active.stepTransaction span { color: #5428cd; }

.stepTab .nav-tabs .nav-link.stepHistory i { background-color: #60c367; background-position: center -905px; }

.stepTab .nav-tabs .nav-link.active.stepHistory span { color: #60c367; }

.stepTab .nav-tabs .nav-link.supervision i { background-color: #a58223; background-position: center -1024px }

.stepTab .nav-tabs .nav-link.active.supervision span { color: #a58223; }
.stepTab .nav-tabs .nav-link.stepRelatedReqs i { background-color: #257394; background-position: center -1088px }
.stepTab .nav-tabs .nav-link.active.stepRelatedReqs span { color: #257394; }
.stepTab .nav-tabs .nav-link.stepwaqfEvaluation i { background-color: #2b8b6a; background-position: center -1139px }
.stepTab .nav-tabs .nav-link.active.stepwaqfEvaluation span { color: #2b8b6a; }
.stepTab .nav-tabs .nav-link.stepContractsFollowUp i { background-color: #8a5233; background-position: center -1191px }
.stepTab .nav-tabs .nav-link.active.stepContractsFollowUp span { color: #8a5233; }
.stepTab .nav-tabs .nav-link.stepContributors i { background-color: #cd6831; background-position: center -1240px }
.stepTab .nav-tabs .nav-link.active.stepContributors span { color: #cd6831; }
.stepTab .nav-tabs .nav-link.Financial i { background-color: #187bb4; background-position: center -1288px }
.stepTab .nav-tabs .nav-link.active.Financial span { color: #187bb4; }
.stepTab .nav-tabs .nav-link.FinancialAudits i { background-color: #185c64; background-position: center -1340px }
.stepTab .nav-tabs .nav-link.active.FinancialAudits span { color: #185c64; }
.stepTab .nav-tabs .nav-link.stepMembersDetails i { background-color: #2b8b6a; background-position: center -1452px }
.stepTab .nav-tabs .nav-link.active.stepMembersDetails span { color: #2b8b6a; }
.stepTab .nav-tabs .nav-link.stepMoMDetails i { background-color: #60c367; background-position: center -1395px }
.stepTab .nav-tabs .nav-link.active.stepMoMDetails span { color: #60c367; }
.stepTab .nav-tabs .nav-link.EstablishmentFund i { background-color: #a58223; background-position: center -1510px }
.stepTab .nav-tabs .nav-link.active.EstablishmentFund span { color: #a58223; }
.stepTab .nav-tabs .nav-link.EstablishmentSystem i { background-color: #a74f89; background-position: center -1621px }
.stepTab .nav-tabs .nav-link.active.EstablishmentSystem span { color: #a74f89; }
.stepTab .nav-tabs .nav-link.FoundersDetails i { background-color: #3262c3; background-position: center -1567px }
.stepTab .nav-tabs .nav-link.active.FoundersDetails span { color: #3262c3; }
.stepTab .nav-tabs .nav-link.subsidiraies i { background-color: #8567b2; background-position: center -1678px }
.stepTab .nav-tabs .nav-link.active.subsidiraies span { color: #8567b2; }    
.stepTab .nav-tabs .nav-link.subsidaryManage i { background-color: #5c3e88; background-position: center -1732px }
.stepTab .nav-tabs .nav-link.active.subsidaryManage span { color: #5c3e88; } 
.stepTab .nav-tabs .nav-link.stepAssigningLogs i { background-color: #8d8e52; background-position: center -1790px }
.stepTab .nav-tabs .nav-link.active.stepAssigningLogs span { color: #8d8e52; } 
.stepTabContainer h1 { color: #05454f; font-weight: 600; font-size: 20px; margin: 0 }

.stepTabContainer p { font-size: 13px; color: #000; font-weight: 600 }


.stepTabContainer .cd-timeline__container p { color: #212529; }
/*333333*/
.stepTabContainer .stepCount { color: #b8cfd3; font-size: 30px; position: absolute; top: 10px; bottom: auto }
/*Beneficiary Tab*/
.innerTabWrapper .nav-tabs { border: none; margin: 0; padding: 0 }

.innerTabWrapper .nav-tabs .nav-item { background-color: #4971c1; width: 10.85%; border: none }

.innerTabWrapper .nav-tabs .nav-link { padding: 0.5rem 0; margin: 0 !important; color: #c0d0ef; height: 56px; text-align: center; }

.innerTabWrapper .nav-link[data-toggle].collapsed:after { content: " "; position: unset; }

.innerTabWrapper .nav-link[data-toggle]:not(.collapsed):after { content: " "; position: unset; }

.innerTabWrapper .nav-tabs .nav-link:hover { border-radius: 0; border-top: 1px solid #4971c1; border-bottom: 1px solid #4971c1; }

.innerTabWrapper .nav-tabs .nav-link span { height: auto; display: block; display: flex; font-size: 0.75rem; font-weight: 600; align-items: center; line-height: 15px; height: 37px; justify-content: center; }

.innerTabWrapper .nav-tabs .nav-link.active span { display: none }

.innerTabWrapper .nav-tabs .nav-link.active { background: url("../images/WaqfBene-Sprite.png") no-repeat; border: 1px solid #cce2fe; border-radius: 0; height: 56px; margin: 0 !important }

.innerTabWrapper .nav-tabs .nav-link.active.Waqf01 { background-position: center top }

.innerTabWrapper .nav-tabs .nav-link.active.Waqf02 { background-position: center top }

.innerTabWrapper .nav-tabs .nav-link.active.Waqf03 { background-position: center top }

.innerTabWrapper .nav-tabs .nav-link.active.Waqf04 { background-position: center top }

.innerTabWrapper .nav-tabs .nav-link.active.Waqf05 { background-position: center top }

.innerTabWrapper .nav-tabs .nav-link.active.Waqf06 { background-position: center top }

.innerTabWrapper .nav-tabs .nav-link.active.Waqf07 { background-position: center top }

.innerTabWrapper .nav-tabs .nav-link.active.Waqf08 { background-position: center top }

.innerTabWrapper .nav-tabs .nav-link.active.Waqf09 { background-position: center top }

.innerTabWrapper .nav-tabs .nav-link.active.Waqf10 { background-position: center top }

.innerTabWrapper .nav-tabs .nav-link.active::after { background: url("../images/sprite.png") center -509px no-repeat; height: 15px; width: 100%; display: block; position: relative; bottom: -46px; }

.innerTabContainer { background-color: #ededed; padding: 30px 10px 10px 10px; min-height: 340px; width: 97.8%; }

.innerTabContainer h1 { color: #333333; font-size: 0.9rem; margin: 0 0 10px 0; background-image: none; }
/*horizontal Tab*/
.horizontalTab { border-bottom: 1px solid #0a6b7a }

.horizontalTab.nav-tabs .nav-link.active, .horizontalTab.nav-tabs .nav-link.active:hover { border-color: #0a6b7a #0a6b7a #fff; background-color: #ffffff }

.horizontalTab.nav-tabs .nav-link.active span { font-weight: 800; color: #0a6b7a }

.horizontalTab.nav-tabs .nav-link:hover { border-color: #e9ecef #e9ecef #fff; background-color: #e5e5e5 }

.horizontalTab.nav-tabs .nav-link { color: #5e758a; font-weight: 600 }
/*based on fa-plus */
[data-toggle][aria-expanded=true] i.fa:before { content: "\f068"; }
/*based on fa-minus */
[data-toggle][aria-expanded=false] i.fa:before { content: "\f067"; }

.validation-summary-errors { color: #dc3545; }
/*.allow-full-screen {
   transition: all 1s;
}*/
.fullscreen { z-index: 1049; /*less than modals*/ width: 100%; height: 100%; position: fixed; overflow-y: auto; top: 0; left: 0; max-width: 100%; background-color: white; transition: all 1s; }

.full-screen-handle { padding: 3px; cursor: pointer; }

.full-screen-handle:hover { outline: 1px solid #b8d6fb; background-color: #d4e5f5; }

.bannerWrapper .carousel-control-prev, .bannerWrapper .carousel-control-next { z-index: 20; height:85% }
/*waqf borders*/
.directionImg { background: url("../images/direction.png") no-repeat center center; width: 100%; min-height: 277px; }

/*header*/

.maraLogoHM { background: url("../images/MARAlogo.png") no-repeat; height: 75px; width: 85px; display: block; margin: 4px 0 ;order: 4;}
.loginBtn,.loginBtn:hover{display:flex; background-color:#0a7f91;color:#fff;padding: 0.2rem 0.3rem;
    border-radius: 5px; align-items:center; text-decoration:none; height:25px}
.loginBtn span{font-size:0.7rem}
.loginBtn span.loginIcon{width:20px; height:16px;font-size:0.9rem}
.loginContainerHM {height: 30px; display: flex;flex-direction: row-reverse;order: 3;margin: 0 2rem;}
.NavigationBar{border-bottom: 4px solid #0a6b7a;}
.NavigationBar .navbar-collapse.collapse{order:2}
/*
.loginContainerHM a { display: inline-block; margin: 17px 4px }

.loginBtn span.loginIcon { background: url("../images/spriteHM.png") center top; width: 29px; height: 29px; display: inline-block; vertical-align: middle; }

.loginBtn span { color: #ffffff; font-size: 0.8rem; display: inline-block; text-decoration: none; vertical-align: middle; line-height: 29px; font-weight: 600; }
*/
.LangBtnHM, .LangBtnHM:hover { text-decoration: none; background-color: #ffffff; color: #0a7f91; font-weight: 600; padding: 0.2rem 0.3rem; font-size: 0.7rem; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; vertical-align: middle; display: block; text-align: center;border:1px solid #0a7f91;margin:0 0.3rem;vertical-align: middle; height:25px}
    
/*nav bar*/

.NavigationBar {height: 100px;display: flex; justify-content: space-between; align-items: end;}
.NavigationBar .navbar {height: 100px;justify-content: space-between;align-items: flex-end; width: 100%;}
.NavigationBar .navbar-nav .nav-item{border-top:2px solid #fff;}
.NavigationBar .navbar-nav .nav-item.activeLink{ border-top:2px solid #b9e1e7 !important}
.NavigationBar .navbar-nav .nav-link, .NavigationBar .navbar-nav .nav-link:hover, .NavigationBar .navbar-nav .nav-link:visited { text-transform: uppercase; color: #000;  font-size: 0.8rem; padding: 0.3rem 0;font-weight: 600;height:25px; margin:0 0.8rem !important  }

    
/*video banner image HM*/
.bannerWrapper {width: 100%; position:relative}

#SliderMapWrapper video { width:100%}

.bannerWrapper button:focus { border: none; outline: none }

#SliderMapWrapper .carousel-caption { position: absolute; right: 0; top: auto;bottom:65px; left:0; color: #ffffff; font-size: 1.8rem; z-index: 15; text-align: center;background-color:rgba(0, 0, 0, 0.16)}

/*login page*/
.LoginPgheaderWrapper { background: url("../images/loginPattern.png"); height: 160px; width: 100%; position: relative }

.LoginPgWAQFLogo { height: 120px; width: 106px; position: absolute; top: 0; bottom: 0; right: 0; left: 0; margin: auto; background: url(../images/WAQFWhiteLogo.png) no-repeat; background-size: contain; }

.LoginPgWrapper { width: 100%; height: auto; background: url('../images/loginbgreapeat.png') repeat left top; }

.LoginPgheaderBanner { background: url(../images/LoginBanner.jpg) repeat-x left top; height: 166px; width: 100%; }

.LoginPgForm { margin: 40px 20px }

.LoginPgWrapper .card { background-color: transparent; width: 90%; margin: 0 auto; border: none }

.LoginPgWrapper .card-header { background-color: transparent; background-image: url("../images/sprite-vert.png"); background-repeat: no-repeat }

.LoginPgWrapper .card .card-header p { color: #ffffff; font-size: 0.8rem; padding: 0; margin: 0 }

.LoginPgWrapper .card .card-header h1 { color: #c09e32; font-size: 1.5rem; padding: 0; margin: 0; font-weight: normal }

.LoginPgWrapper .card .card-body input[type="text"], .LoginPgWrapper .card .card-body input[type="password"] { background-color: #000a13; height: 32px; color: #ffffff; background-image: url("../images/sprite-vert.png"); background-repeat: no-repeat }

.LoginPgWrapper .card .card-body .text-danger { padding-bottom: 10px }

.loginPgContainer { margin: 10px 0 9rem 0; background-color: #ffffff; padding: 20px 0; }

.loginPgContainer p { height: auto; /*45px*/ color: #333; line-height: normal; font-size: 1rem; font-weight: 600 }
/*.loginContainerHeading.CivilId {}
.loginContainerHeading{background-color:#ffffff;padding:0 15px; border:1px solid #babec1;border-bottom:none}*/
.loginContainerHeading a { font-size: 12px; vertical-align: middle; text-decoration: underline; color: #333 }

.loginContainerHeading h1 { font-weight: 600; font-size: 20px; color: #333; line-height: 60px; margin: 0; padding: 0 10px; border-bottom: 1px solid #333; }
/*.loginFormContainer{}*/

.loginTypeIcon span { margin-top: 10px; margin-bottom: 25px; display: block }

.loginForm label, .loginForm span { color: #333; font-size: 13px }

.loginFormHyperlink, .loginFormHyperlink:hover { color: #333; font-size: 13px; text-decoration: underline }

.loginForm input { background-color: transparent; border: 1px solid #b6b6b6; height: 32px; color: #333; margin-bottom: 10px; font-size: 1rem; width: 90%; padding: 0 5px; }

.loginForm input::-webkit-input-placeholder { color: #b6b6b6 }

.loginForm input::-moz-placeholder { color: #b6b6b6 }

.loginForm input:-ms-input-placeholder { color: #b6b6b6 }

.loginForm input:-moz-placeholder { color: #b6b6b6 }

.loginpgBgColor footer { position: unset }

.loginpgBgColor footer p { background-color: transparent; color: #ffffff }
/*waqf types slider*/
.WaqfTypesContainer { padding: 2rem 0; width: 100% ;background: url("../images/pattern-bg.jpg") repeat-x ; height:530px}
.HM-Heading{font-size:2rem; font-weight:bold; color:#096573; margin:0 auto 2rem auto; padding:0; text-align:center}
.bx-wrapper { background: none; border: none; box-shadow: none; margin: 0 auto; }
/*width:940px !important*/
.WaqfTypesContainer .slider .card-img-top{height:240px}
.bx-pager { display: none }

.edu span, .helth span, .ismaffir span, .orph span, .pvt span, .piety span, .socWelfr span { height: 61px; width: 98px; display: block; margin: 0 auto; background-image: url("../images/spriteHM.png") }

.edu span { background-position: center -30px }

.helth span { background-position: center -80px }

.ismaffir span { background-position: center -137px }

.orph span { background-position: center -195px }

.pvt span { background-position: center -256px }

.piety span { background-position: center -317px }

.socWelfr span { background-position: center -376px }

.WaqfTypesContainer .sliderSection { position: relative; height: 150px;display:flex; flex-direction:column;flex: 0;padding:1.3rem 0.8rem }

.WaqfTypesContainer .sliderSection span { position: absolute; background-color: #9bdbe7; padding: 10px; border-radius: 100%; height: 75px; width: 75px; top: -35px; border:3px solid #fff }

.WaqfTypesContainer .sliderSection h1 { color: #333; font-size: 1rem; font-weight: 600; margin: 0.2rem 0 0 0; padding: 0; height: auto; line-height: normal; background-image: none; width: auto }
.WaqfTypesContainer .sliderSection .DonateNowBtn{ display:flex; }
.WaqfTypesContainer .sliderSection .DonateNowBtn a{background-color: #47b0c3;color: #ffffff; font-size: 0.8rem; text-decoration: none; font-weight: 600; line-height: 30px;border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;cursor: pointer;padding: 0 0.5rem;display: flex; margin-top: 0.8rem;}

.WaqfTypesContainer .sliderSection .DonateNowBtn a:after, .WaqfTypesContainer .sliderSection .DonateNowBtn a:before{font-family:"FontAwesome" ; width:10px; height:30px; margin:0 3px;font-weight: bold; display: block; font-size: 1.1rem; line-height: 30px; vertical-align: top;}
/*section page heading*/
.servicesWrapperHeading { width: 100% }
h1 {width: 100%; padding: 3.5% 3.5% 0 3.5%; margin:0}

h1 span { height: 60px; width: 100%; display: block; color: #0a6b7a; text-transform: uppercase; font-size: 1.4rem; font-weight: 600; margin: 0; padding: 0; line-height: 60px; }

.availableWaqfWrapperHeading, .availableWaqfWrapperHeading h1, .availableWaqfWrapperHeading h1 span { background-color: #78b045 }

.waqfProjWrapperHeading, .waqfProjWrapperHeading h1, .waqfProjWrapperHeading h1 span { background-color: #fff }

.KPISWrapperHeading, .KPISWrapperHeading h1, .KPISWrapperHeading h1 span { background-color: #0a7f91 }
/*services*/
.waqf-service-logo{ width: 30%; padding: 2rem 3%;}
.waqf-service-logo img{width:100%}
.servicesWrapper { width: 100%; min-height: 545px; display:flex}

.servicesContainer { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; height: 283px; width: 90% }

.serivceLinkContainer { display: inline-block; vertical-align: top; }

.serivceLinkContainer a, .serivceLinkContainer a:hover { text-decoration: none }

.serivceLinkform { vertical-align: top; width: 100%; margin: 0; background-color:#175f6b;    height: 105px; display:flex; align-items: center;justify-content:center; padding:0 0.5rem}

.serivceLinkform h2{ color:#fff; font-size:1rem; font-weight:bold;height: 85px;margin: 0 0.5rem; padding: 0;display: flex; align-items: center;}
.serivceLinkform form .form-group, .serivceLinkform form a{ margin:0 0.2rem;display: flex;flex-direction: column; height: 58px;}
.serivceLinkform form a{color:#ffffff; background-color:transparent; text-decoration:underline; font-weight:400;height: 30px;}
.serivceLinkform form{ display:flex;justify-content: flex-start;height: 80px;
    align-items: flex-start;}
.serivceLinkform form input[type="text"] { display: inline-block; width: 48.5%; padding: 0 10px }
.serivceLinkform form input[type="submit"]{width:100px; font-weight:800}
.serivceLinkform form .field-validation-valid.text-danger{height:0; padding:0; margin:0}
.serivceLinkform form .text-danger{color:#fff !important; background-color:#dc3545;padding: 0.2rem 0.5rem;margin-top: 0.5rem;font-size: 0.6rem;font-weight: 400; display:flex; justify-content:center}

.serivceLinkform form .form-group label { color: #ffffff; font-weight: 600; margin: 0 0 2px 0; font-size: 0.8rem; }

/*.serivceLinkform form .form-group .selectGeneralServices ul { padding: 0; margin: 0 }

.serivceLinkform form .form-group .selectGeneralServices ul li { list-style-type: none; display: inline-block; vertical-align: top; width: 29%; margin-bottom: 10px }

.serivceLinkform form .form-group .selectGeneralServices ul li a { display: block; width: 70px; text-align: center; margin: 0 auto }
    .serivceLinkform form .form-group .selectGeneralServices ul li a span:hover, .activeGeneralServices { -webkit-box-shadow: 0px 0px 10px 0px rgba(0,255,242,1); -moz-box-shadow: 0px 0px 10px 0px rgba(0,255,242,1); box-shadow: 0px 0px 10px 0px rgba(0,255,242,1); }


.serivceLinkform form .form-group .selectGeneralServices ul li a span { background-color: #ffffff; height: 60px; width: 60px; margin: 0 auto; display: block; border-radius: 5px; background-image: url("../images/GeneralServicesIcons.png") }

.serivceLinkform form .form-group .selectGeneralServices ul li a span.ComplaintWaqf { background-position: center 1px }

.serivceLinkform form .form-group .selectGeneralServices ul li a span.issueWaqf { background-position: center -60px }

.serivceLinkform form .form-group .selectGeneralServices ul li a span.fenceWaqf { background-position: center -120px }

.serivceLinkform form .form-group .selectGeneralServices ul li a span.DigWell { background-position: center -181px }

.serivceLinkform form .form-group .selectGeneralServices ul li a span.DeepenWell { background-position: center -239px }

.serivceLinkform form .form-group .selectGeneralServices ul li a span.MaintainWaqf { background-position: center -298px }

.serivceLinkform form .form-group .selectGeneralServices ul li a span.OwnBaitMal { background-position: center -356px }
*/
.serivceDropdown .btn { font-size: 12px; color:#333;height: 36px;padding: 0.375rem 0.75rem;border: 1px solid #ced4da;width:250px;text-align: inherit;display: flex;
    align-items: center; justify-content: space-between; font-weight:600}

.serivceLinkform form .form-group .selectGeneralServices input { display: none }
.selectGeneralServices{width:100%; max-width:100% !important}
.selectGeneralServices .dropdown-item {padding: 0.25rem 0.5rem;margin: 0;}
.selectGeneralServices .dropdown-item:hover{ background-color:#dbdbdb}
.selectGeneralServices .dropdown-item p { font-size: 0.7rem; color: #333; margin: 0 0 0 0 }

.serivceLinkform form input, .serivceLinkform form select, .serivceLinkform form textarea { border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; }

.serivceLinkform form select, .serivceLinkform form textarea { width: 100% }

.serivceLinkform form select, .serivceLinkform form input { height: 36px; line-height:36px; max-width:200px; }
.serivceLinkform form input[type=submit]{ line-height:normal}

.serivceLinkform form select { font-size: 0.8rem; line-height: 27px; vertical-align: middle }

.serivceLinkform form input::-webkit-input-placeholder { font-size: 12px; line-height: 25px; vertical-align: middle; padding: 0 10px }

.serivceLinkform form input::-moz-placeholder { font-size: 12px; line-height: 25px; vertical-align: middle; padding: 0 10px }

.serivceLinkform form input:-ms-input-placeholder { font-size: 12px; line-height: 25px; vertical-align: middle; padding: 0 10px }

.addNewWaqfIcon, .requestLegitimateIcon, .requestCompanyIcon { width: 65px; height: 62px; display: inline-block; margin: 0 0.5rem; background-image: url("../images/spriteHM.png") }

.addNewWaqfIcon { background-position: center -1026px }

.requestLegitimateIcon { background-position: center -1096px }

.requestCompanyIcon { background-position: center -1167px }

.servicesWrapper h2 { font-weight: 600; font-size: 1rem; color: #67bece; margin: 0; padding: 0 0 0.3rem 0; }

.serviceWrapper{ width:70%}
.serviceWrapper .serviceContainer { display: flex; flex-direction: row; }
.serviceContainer ul.nav { width: 40%; margin: 0; padding: 0; align-content: flex-start; }
.serviceContainer ul.nav li.nav-item { border: none; margin-bottom: 0.7rem; width:100% }
.serviceContainer ul.nav li.nav-item a.nav-link { padding:0 0.5rem; border-radius: 0; color: #000; height: 64px;width: 100%; margin: 0 !important; display: flex; align-items: center; justify-content: flex-start; font-size: 1.13rem;line-height: 22px;  }
.serviceContainer ul.nav li.nav-item a.nav-link.active {background-color: #e4f8fc; color: #036d7d;font-weight:bold}
.serviceContainer ul.nav li.nav-item a.nav-link .Servie01Icon, .serviceContainer ul.nav li.nav-item a.nav-link .Servie02Icon, .serviceContainer ul.nav li.nav-item a.nav-link .Servie03Icon, .serviceContainer ul.nav li.nav-item a.nav-link .Servie04Icon { background-image: url("../images/spriteHM.png"); height: 55px; width:62px; display: block; margin:0 0.5rem; border-radius:50%; background-color:#bee6ee }
.serviceContainer ul.nav li.nav-item a.nav-link .Servie01Icon { background-position: center -952px}
.serviceContainer ul.nav li.nav-item a.nav-link .Servie02Icon { background-position: center -1003px}
.serviceContainer ul.nav li.nav-item a.nav-link .Servie03Icon { background-position:center -1050px  }
.serviceContainer ul.nav li.nav-item a.nav-link .Servie04Icon { background-position: center -1099px}

.serviceContainer ul.nav li.nav-item a.nav-link[data-toggle]:not(.collapsed):after { content: "" }

.serviceContainer ul.nav li.nav-item a.nav-link span{width:100%}
.serviceContainer .tab-content { width: 60%; padding: 0 }
.serviceContainer .tab-content .tab-pane { padding: 0 }
.serviceContainer .tab-content .tab-pane.active{border-top:5px solid #98c5cd }
.accordionSectionPanel {position: relative; border-bottom: 1px solid #e1e1e1; width: 99%; }
.accordionSectionPanel:last-child{ border:none}
.accordionSectionHeader.collapsed { background: #ffffff !important; color:#0c4650; font-weight:normal }
.accordionSectionHeader {color:#067a8c;font-weight:bold; padding:1.5rem 1rem ;width: 100%; display: flex; flex-direction: row; justify-content: flex-start; align-items: center; cursor: pointer; font-size:1rem}
.accordionSectionHeader::after { content: "+"; width: 25px; display: block; position: absolute; top: 0; bottom:auto; line-height:75px !important }
.accordionSectionHeader[data-toggle].collapsed:after { font-family: 'FontAwesome'; color: #b4b4b4 }
.accordionSectionHeader[data-toggle]:not(.collapsed):after { content: "\f078"; font-family: 'FontAwesome'; color: #b4b4b4 }
.accordionSectionBody .accordionSectionBodyContent {display:none; font-size: 0.85rem; padding: 0.5rem; margin-bottom: 0 }
.accordionSectionBody .accordionSectionBodyContent span { font-size: 0.85rem !important; }
.accordionSectionBody a { font-size: 0.8rem; color: #8f671b; padding: 0 0.5rem; text-decoration: underline }
.accordionSectionBody .badge-warning { font-size: 0.6rem; padding: 0.4rem 0.3rem; }
.accordionSectionBody.collapse.show{}
.accordionSectionBody .ServiceIconList{ display:flex; justify-content:flex-start;padding: 0 1rem;align-items: baseline;}
.accordionSectionBody .ServiceDetail-icon, .accordionSectionBody .checkStatus-icon, .accordionSectionBody .login-icon, .accordionSectionBody .pdf-icon{ height: 125px; width: 140px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-decoration: underline; color: #000000; text-align: center; margin: 0 0.5rem; }
.accordionSectionBody .ServiceDetail-icon::before, .accordionSectionBody .checkStatus-icon::before, .accordionSectionBody .login-icon::before, .accordionSectionBody .pdf-icon::before { content: ''; background-image: url("../images/spriteHM.png"); height: 70px; width: 70px; border: 2px solid #0a6b7a; border-radius: 50%; background-color: #ffffff; margin-bottom: 0.5rem; }
.accordionSectionBody .ServiceDetail-icon::before{background-position: center -1157px}
.accordionSectionBody .checkStatus-icon::before{background-position: center -1217px}
.accordionSectionBody .pdf-icon::before { background-position: center -1762px }
.accordionSectionBody .login-icon::before { background-position: center -1278px }

.btn-clear { font-size: 0.8rem }

.btn-submit { background-color: #67bece; color: #ffffff; font-size: 0.8rem }
/*.servicesWrapper a.btn{position:absolute; top:auto; left:auto; right:0; bottom:0;}*/

/*available waqfs*/
.availableWaqfTopImg { background-image: url("../images/serviceTopIMG.gif"); background-size: 100% 100%; background-repeat: no-repeat; background-color: #7eb1d4; height: 186px; width: 100%; position: relative }

.availableWaqfTopImg span { color: #3f499f; font-size: 2rem; font-weight: 400; position: absolute; top: 0; left: auto; right: 5%; bottom: 0; margin: auto; height: 40px }

.availableWaqfWrapper { background-color: #f3f3f3; position: relative; height: auto; padding-bottom: 3rem; width: 100% }
/*925px;*/
.availableWaqfWrapper .nav-tabs, .searchResultContainer { width: 90%; margin: 0 auto }

.availableWaqfWrapper .nav-tabs { border-bottom: #78b045 1px solid }

.availableWaqfWrapper .nav-tabs .nav-item { width: 25%; }

.availableWaqfWrapper .nav-tabs .nav-link { margin: 0 !important; padding-top: 1.5rem; height: 130px; background-color: transparent; border-left: 1px solid #78b045; border-right: 1px solid #78b045 }

.availableWaqfWrapper .nav-tabs .nav-link.active, .availableWaqfWrapper .nav-tabs .nav-item.show .nav-link { background-color: #d9e4cf; height: 130px; border-left: none; border-bottom-color: #78b045 }

.availableWaqfWrapper .nav-tabs .nav-link:focus, .availableWaqfWrapper .nav-tabs .nav-link:hover { border-bottom-color: #78b045 }

.availableWaqfWrapper .nav-tabs .nav-link span.landIcon, .availableWaqfWrapper .nav-tabs .nav-link span.waterIcon, .availableWaqfWrapper .nav-tabs .nav-link span.treeIcon, .availableWaqfWrapper .nav-tabs .nav-link span.buildingIcon { width: 70px; height: 45px; display: block; margin: 0 auto; background-image: url("../images/spriteHM.png") }

.availableWaqfWrapper .nav-tabs .nav-link span.landIcon { background-position: center -714px }

.availableWaqfWrapper .nav-tabs .nav-link span.waterIcon { background-position: center -766px }

.availableWaqfWrapper .nav-tabs .nav-link span.treeIcon { background-position: center -822px }

.availableWaqfWrapper .nav-tabs .nav-link span.buildingIcon { background-position: center -877px }

.availableWaqfWrapper .nav-tabs .nav-link span { color: #78b045; font-size: 1.2rem; display: block; text-align: center; width: 80%; font-weight: 600; margin: 0.5rem auto }

.availableWaqfWrapper .nav-tabs .nav-link.b-0 { border-right: none !important; }

.availableWaqfWrapper select { height: 44px; line-height: 25px; width: 250px; display: block; padding: 0 0.8rem; margin: 1rem auto; border-color: #cacaca; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; }

.waqfSection { position: relative; background-color: #ffffff; width: 90%; margin: 0 auto 2rem auto; }

.waqfSection a, .waqfSection a:hover { display: block; width: 100%; height: auto; text-decoration: none }

.waqfSection img, .waqfSectionDetails { display: inline-block; }

.waqfSectionDetails { padding: 1.5rem; vertical-align: top }

.waqfSectionDetails h2 { font-weight: 600; font-size: 1rem; color: #767676; margin: 0; padding: 0 0 0.3rem 0; }

.waqfSectionDetails p { font-weight: 600; font-size: 0.8rem; color: #767676; margin: 0; padding: 0 0 0.3rem 0; }

.waqfSection span.readmoreLink { font-size: 0.8rem; font-weight: bold; color: #444444; position: absolute; top: auto; bottom: 15px; }

.availableWaqfWrapper a.hyperLink { font-size: 0.9rem; font-weight: 800; text-decoration: underline; color: #444444; position: absolute; top: auto; left: 0; right: 0; bottom: 22px; margin: auto; text-align: center; }

#searchResultcarousel .carousel-indicators { bottom: -7px }

#searchResultcarousel .carousel-indicators li { background-color: #b6b6b6; cursor: pointer; height: 6px; }

#searchResultcarousel .carousel-indicators li.active { background-color: #3d7e3f }

/*waqf projects*/
.waqfProjWrapper { width: 100%; height: auto; background-color:#fff}

.waqfProjWrapper .carousel { height: 100%; margin: 20px 0; }

.waqfProjWrapper .carousel .waqfProjFlexContainer { display: flex; flex-direction: row; width: 90%; justify-content: space-around; margin: 0 auto; align-items: center; height: 100% }

.waqfProjContainerCol { width: 287px;height: 405px; padding: 0; background-color: #fff; }

.waqfProjContainerCol h2 { font-size: 1rem ;font-weight: bold;}

.waqfProjContainer { height: auto;display: flex;
    flex-direction: column; justify-content: space-between;}

.waqfProjWrapper .waqfProjIMG {width: 100%;background-color: #fff;max-height: 195px; height: 195px}

.waqfProjWrapper .waqfProjIMG img {width: 100% !important; max-height: 195px; height: 195px}

.waqfProjWrapper .waqfProjectDescription { width: 100%; margin: 1rem 0 0 0; height:100px;  display: flex; flex-direction:column; justify-content:space-between }

.waqfProjectDescription p { max-height: 65px; overflow: hidden;  margin: 0; width: 100%;line-height: 16px;}

.waqfProjectBtn{display:flex; justify-content:flex-start}

.waqfProjWrapper a.btn { height: 28px; width: auto; padding: 3px 5px; font-size: 0.8rem }

.waqfProjectTotal {  color: #575757; font-size: 0.8rem; font-weight: bold }
.waqfProjectDescription span { color: #0a7f91 }

.waqfProjWrapper .carousel .carousel-inner, .waqfProjWrapper .carousel .carousel-inner .carousel-item { height: 100% }

.waqfProjWrapper .carousel .carousel-indicators {bottom: -50px;}
.waqfProjWrapper .carousel .carousel-indicators li.active{ background-color:#0a6b7a}
.waqfProjWrapper .carousel .carousel-indicators li{ background-color: #b6b6b6}
.waqfProjWrapper .carousel .carousel-indicators { display: none }

.waqfProjWrapper .carousel .carousel-control-next, .waqfProjWrapper .carousel .carousel-control-prev { opacity: 1; width: 6% }

.waqfProjWrapper .carousel .carousel-control-next .carousel-control-next-icon, .waqfProjWrapper .carousel .carousel-control-prev .carousel-control-prev-icon { width: 45px; height: 75px; display: block; }

.waqfProjWrapper .carousel .carousel-control-next .carousel-control-next-icon { background: url(../images/spriteHM.png) no-repeat center -1463px }

.waqfProjWrapper .carousel .carousel-control-prev .carousel-control-prev-icon { background: url(../images/spriteHM.png) no-repeat center -1369px }

.waqfProjWrapper .nav.nav-tabs { height: 80px; width: 100%; padding: 0;display: flex; justify-content: center; border:none}

.waqfProjWrapper .nav.nav-tabs li.nav-item { width: 15%; padding: 10px 0 }

.waqfProjWrapper .nav.nav-tabs li .nav-link { color: #3793a3; font-weight: 600; font-size: 0.85rem; border: 1px solid #3793a3;text-align:center;border-radius:5px; height:42px;line-height:23px;padding: 0.5rem 0.5rem; }

.waqfProjWrapper .nav-tabs .nav-link.active, .waqfProjWrapper .nav-tabs .nav-link.active:hover, .waqfProjWrapper .nav-tabs .nav-link:hover, .waqfProjWrapper .nav-tabs .nav-link:focus { background-color: #3793a3; border: 1px solid #3793a3;color:#ffffff !important }

.waqfProjectsIcon, .shareableShareIcon, .charityShareIcon, .paybackshareIcon { margin: 0 0.5rem; display: inline-block; vertical-align: middle; height: 87px; width: 87px; background-image: url("../images/spriteHM.png"); }

.waqfProjectsIcon { background-position: center -1889px }

.shareableShareIcon { background-position: center -1782px }

.charityShareIcon { background-position: center -1673px }

.paybackshareIcon { background-position: center -1564px }

.waqfProjWrapper a.hyperLink { font-size: 0.9rem; font-weight: 800; text-decoration: underline; color: #444444; position: absolute; top: auto; left: 0; right: 0; margin: auto; text-align: center; }

.waqfProjWrapper .tab-content { height: auto; margin-bottom: 10px }

.waqfProjWrapper .tab-content > .tab-pane { height: 100% }


/*KPIS*/
.KPISWrapper { background-color: #ffffff; height: 460px; width: 100% }

.KPISWrapper h2 { border: #0a7f91 solid 1px; padding: 0; margin: 2rem 0; text-align: center; color: #999999; font-size: 1.5rem; font-weight: 400; line-height: 50px; vertical-align: middle }

/*outer footer*/
.outerFooter { width: 100%; background-color: #ffffff; background-image: url("../images/pattern-bg.jpg"); background-repeat: repeat-x; height: 345px; display:flex;flex-direction:column; justify-content:center;align-items:center; border-bottom:8px solid #175f6b }

.footerLinks { margin: 0; padding: 0;display: flex; justify-content:center; align-items:center }

.footerLinks li { list-style-type: none;  width: auto; margin: 0 0.5rem; display:flex; align-items:center; justify-content:center }

.footerLinks li a { color: #000000; text-transform: uppercase; font-size: 0.7rem; text-decoration: underline; font-weight: 600; text-align:center; margin:0 !important;padding:1rem 0} 

.footerLogo { background: url("../images/WAQFlogo.png") ; width: 90px; height: 78px; display: block; margin-top: 0.8rem }

.socialLinks { padding: 0; height: 30px; line-height: 30px; margin: 0 }

.socialLinks li { line-height: 30px; height: 30px; width:30px; vertical-align: middle; list-style: none; margin: 0; padding: 0; display: inline-block; color: #ffffff;background-color: #ffffff; border-radius: 50%; border: 1px solid #999999; }

.socialLinks li a.iconYTube, .socialLinks li a.iconInsta, .socialLinks li a.iconFb, .socialLinks li a.icontwitter { width: 21px; height: 30px; display: block; text-decoration: none; margin: 0 0.2rem;}

.iconYTube { background: url('../images/youtube.png') no-repeat center 5px; background-size: 90% }

.iconInsta { background: url('../images/instagram.png') no-repeat center center; background-size: 90% }

.iconFb { background: url('../images/facebook.png') no-repeat center 5px; background-size: 90% }

.icontwitter { background: url('../images/twitter.png') no-repeat center 5px; background-size: 90% }

.outerFooter p { color: #000000; font-size: 0.7rem; margin: 0 0.5rem }

.goTop { display: block; position: fixed; font-size: 1.2rem; bottom: 40px; z-index: 10; width: 40px; height: 40px; border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; color: #ffffff; background-color: rgba(0,0,0,0.5) }

.goTop { right: 1% }

.goTop:hover { color: #78b045 }

.goTop span { width: 17px; height: 30px; margin: 10px auto; display: block; }

/*validation*/
input[data-val-required]:not(.noBorder), select[data-val-required]:not(.noBorder), textarea[data-val-required]:not(.noBorder), .requiredField:not(.noBorder) { border: 1px dashed red }

.loginForm input[data-val-required] { border: 1px solid #b6b6b6 }

/*waqf Register*/

.service-request { flex: none; /*border: 1px solid red;*/ box-sizing: border-box; display: block; width: 100%; }

.service-request .form-horizontal { width: 98%; }
/*   .waqf-request .modal-body { height: 520px; }
    .waqf-request .card-header { padding: 0.75rem 1.25rem; background-color: rgba(0, 0, 0, 0.03); border-bottom: 1px solid rgba(0, 0, 0, 0.125); 
margin-top: 0; }
*/
.service-request .card { /*margin: 1.5em;*/ box-sizing: border-box; display: block; width: 100%; }

.vertical-container { }

.vertical-row { display: flex; flex-direction: column; flex-wrap: wrap; font-size: 10px; }

.waqf-entity-label { font-size: .8em; }

.waqf-entity { font-weight: bold; font-size: .8em; }

.sep-line { height: 1px; width: 95%; display: inline-block; background-color: lightgrey; }

.wizard-steps-panel.steps-quantity-5 .step-number { width: 20%; }

.wizard-steps-panel.steps-quantity-6 .step-number { width: 16.6% !important; }

.service-request .modal-footer { justify-content: center; /*flex-direction:row-reverse;*/ }

.wizard-steps-panel .step-number { line-height: 1.3em; }

.wizard-button-back .fa, .wizard-button-next .fa { font-size: 1.1rem }


/*mobile screen only - portrait all*/
@media only screen and (min-width: 320px) and (max-width: 992px) {
    html, body { overflow-x: hidden }

    .waqfLogo { margin: 0.5rem; }

    .maraLogoHM { margin: 0}
    .header{height:130px}
    .NavigationBar .navbar-nav .nav-link, .NavigationBar .navbar-nav .nav-link:hover, .NavigationBar .navbar-nav .nav-link:visited { line-height: 35px;height: 37px;
    padding: 0 0.3rem; }
    .NavigationBar .navbar-nav .nav-link.activeLink{ border:none; background-color:#0a7f91; color:#ffffff}
    .NavigationBar,.NavigationBar .navbar{ height: 105px }
    .NavigationBar .navbar{align-items: flex-start; padding:0.5rem 0; }
    .loginContainer{ height:30px}
    .loginContainer .settingsMenu.dropdown-toggle{width:100%}
    .loginContainer .settingsMenu.dropdown-toggle span{height:30px;line-height: 32px;font-size: 0.8rem;}
    .loginContainerHM { height: 35px;margin: 0.5rem 0;order: initial;}

    .loginContainerHM a, .loginContainerHM a:hover{ margin: 5px 4px; }
    .logoutContainer{ align-items:flex-start}
    .langBtn, .logoutBtn, .langBtn:hover, .logoutBtn:hover{margin-top:10px}
    .LangBtnHM, .LangBtnHM:hover{ margin:0}
    .maraLogo { background-repeat: no-repeat; background-position-y: 10px; height: 90px; padding-bottom: 0 }

     .logoutBtn span:last-child {display:none }
    .loginBtn span:last-child{ display:none}
    .loginBtn span.loginIcon{height:15px; width:15px}
    .NavigationBar .navbar-toggler {margin: 7px 0; padding: 0; }
    .NavigationBar .navbar-toggler .fa{ color:#000;font-size: 1.8rem;}
    .NavigationBar .navbar-toggler:focus{ outline:none; background-color:#d9d9d9}
    .NavigationBar .navbar-nav{margin:0; padding:0}
    .HM-Heading{font-size: 1.5rem;}
    h1 { background-image: none; width: 96%; margin:0 auto }

    h1 span { width: 100%; font-size: 1.6rem; height: 50px; line-height: 50px }

    .bx-viewport {margin: 0 auto }

    .bx-wrapper .bx-prev{ left:11px}

    .bx-wrapper .bx-next{right:5px}

    .bx-pager { display: block }

    .bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto { bottom: -22px }
    .WaqfTypesContainer .bx-wrapper .bx-pager.bx-default-pager a { width: 10px; height: 10px; border-radius: 0 }
    .waqfProjWrapper .bx-wrapper .bx-pager.bx-default-pager a { width: 13px; height: 5px; border-radius: 0 }

    .bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-pager.bx-default-pager a:focus { background-color: #0a6b7a }

    .bx-wrapper .bx-pager.bx-default-pager a { background-color: #b6b6b6 }

    .servicesWrapper {width:100%;flex-direction: column; height:auto;}
    .serviceWrapper{width:100%}
    .servicesWrapperHeading h1{width: 100%;text-align: center;}
    .serviceContainer ul.nav{width:30%}
    .serviceContainer .tab-content { width: 70%; }
    .accordionSectionHeader{padding:0.5rem;width: 90%; font-size: 0.8rem;}
    .accordionSectionBody .ServiceIconList{padding:0 0.5rem}    
    .accordionSectionHeader::after{line-height: 39px !important;font-size: 0.6rem;}
    .waqf-service-logo{width:50%; padding:1rem;margin: 0 auto; }
    .waqf-service-logo img{ width:100%}
    .servicesContainer { top: auto; bottom: auto; width: 96%; height: auto; position: unset }
    .serivceLinkform { width:100%;height: auto;flex-direction: column; justify-content: flex-start;align-items: flex-start;padding: 0 1rem; margin:0 auto}
    .serivceLinkform h2{ height:50px; line-height:50px}
    .serivceLinkform form { margin-bottom: 10px;flex-direction: column;align-items: flex-start; height: auto;}
     .serivceLinkform form .form-row{ flex-direction:column}
    .serivceLinkform form .form-group, .serivceLinkform form a{ margin:0.3rem 0;    height: auto;}
    .serviceContainer ul.nav li.nav-item a.nav-link{font-size:0.8rem}
    .serviceContainer ul.nav li.nav-item a.nav-link i{display:none !important}
    .availableWaqfWrapper .nav-tabs { width: 96%; }

    .availableWaqfWrapper .nav-tabs .nav-link { padding: 0.8rem 0; height: 100px; }

    .availableWaqfWrapper .nav-tabs .nav-link.active, .availableWaqfWrapper .nav-tabs .nav-item.show .nav-link { height: 100px; }

    .availableWaqfWrapper .nav-tabs .nav-link span { font-size: 0.8rem; width: 98%; }
    .accordionSectionBody .ServiceDetail-icon, .accordionSectionBody .checkStatus-icon, .accordionSectionBody .login-icon, .accordionSectionBody .pdf-icon { font-size: 0.7rem; font-weight: 600; margin: 0; padding: 0; }
    .accordionSectionBody .ServiceDetail-icon::before, .accordionSectionBody .checkStatus-icon::before, .accordionSectionBody .login-icon::before, .accordionSectionBody .pdf-icon::before { height: 50px; width: 50px; border: 1px solid #0a6b7a }
    .accordionSectionBody .ServiceDetail-icon::before{background-position: center -1563px}
    .accordionSectionBody .checkStatus-icon::before{background-position: center -1612px}
    .accordionSectionBody .pdf-icon::before { background-position: center -1710px }
    .accordionSectionBody .login-icon::before { background-position: center -1661px }
    .waqfSectionDetails { padding: 0.5rem; }

    .waqfProjContainerCol h2 { font-size: 1.1rem; }

    .waqfProjWrapper, .waqfProjWrapper .nav.nav-tabs, #waqfProjcarousel { height: auto }

    .waqfProjWrapper .waqfProjectDescription { width: 100% }

    .waqfProjectDescription p, .waqfProjectDescription span { display: block; width: 100%; margin: 0}    

    .waqfProjWrapper .carousel .carousel-inner { margin: 0 auto; width: 87%; height: 100% }

    .waqfProjWrapper .carousel .waqfProjFlexContainer { flex-direction: column; width:100%}
    .waqfProjWrapper .tab-content > .tab-pane{ padding:1rem}
    .waqfProjContainer { flex-direction: column; }

    .waqfProjWrapper .carousel .carousel-control-next, .waqfProjWrapper .carousel .carousel-control-prev { display: none }

    .waqfProjWrapper .carousel .carousel-indicators { display: flex; bottom: -52px; }

    .waqfProjWrapper .carousel .carousel-indicators li { background-color: #b6b6b6; cursor: pointer; height: 6px; }

    .waqfProjWrapper .carousel .carousel-indicators li.active { background-color: #003f49 }

    .waqfProjWrapper .waqfProjContainerCol img { display: block; margin: 0 auto; }

    .waqfProjWrapper .nav.nav-tabs li.nav-item { padding: 10px 0 0 0;width: 25%; }

    .waqfProjWrapper .nav.nav-tabs li .nav-link { padding: 0.5rem; margin: 0 !important; font-size: 0.75rem; text-align: center;border-radius:0;line-height: 13px; }

    .waqfProjWrapper .nav.nav-tabs li .nav-link span { line-height: 13px; display: block; margin-top: 0rem }

    .waqfProjWrapper .tab-content { height: auto; margin-bottom: 50px }

    .waqfProjectsIcon, .shareableShareIcon, .charityShareIcon, .paybackshareIcon { margin: 0 !important; display: block; height: 61px; width: 61px; }

    .waqfProjWrapper a.hyperLink { font-size: 0.75rem; bottom: -10px; }
    .waqfProjectsIcon, .shareableShareIcon, .charityShareIcon, .paybackshareIcon { margin: 0 !important; display: block; height: 61px; width: 61px; }

    .waqfProjectsIcon { background-position: center -2222px }

    .shareableShareIcon { background-position: center -2222px }

    .charityShareIcon { background-position: center -2222px }

    .paybackshareIcon { background-position: center -2222px }

  
    .KPISWrapper h2 { font-size: 1rem; line-height: 40px; width: 90%; margin: 2rem auto; }

    .outerFooter { padding:2rem 0.5rem; height: auto; }

    .footerLinks { margin: 0; padding: 0;text-align:center }

    .footerLinks li a {font-weight: 600;font-size: 0.5rem; padding:0 }

    .outerFooter p { margin: 1rem 0 0 0; }

    .stepTab .nav-tabs .nav-link span { display: none }

    #collapsibleNavbar { background-color: #ffffff; z-index:10000; border-top: none; box-shadow: none; }

    .navbar-light .navbar-toggler { color: #ffffff; border-color: #ffffff }

    .LoginPgheaderBanner { display: none }

    .sideMenuToggle .navbar-toggler .fa.fa-bars { color: #fff }

    .titleGroup { padding: 25px 10px 10px 10px }

    .card-title { width: 100%; margin-bottom: 10px }

    .mvc-grid { max-width: 100%; overflow-x: scroll }

    footer p { font-size: 10px; line-height: 17px }

    .stepTabContainer h1 { width: 100%; text-align: center }

    .stepTabContainer .stepCount { position: initial; width: 100%; text-align: center; }

    .directionImg { background-image: none }

    .innerTabWrapper .nav-tabs .nav-item { width: 25% }
    .sidePanel .navbar-collapse .nav { width: 100% }
    .sidePanel .navbar-toggler { background-color: #0a6b7a; color: #ffffff; display: flex; justify-content: space-between; align-items: center; padding: 0 0.3rem; line-height: normal;margin:0.5rem 1rem;flex-direction: row-reverse;}
    .sidePanel .navbar-toggler:focus{outline: none;}
    .sidePanel .navbar-toggler .fa{font-size: 0.9rem;color:#ffffff;}
    .sidePanel .navbar-toggler .navbar-toggler-menu{color:#ffffff;font-size: 0.8rem; line-height: 16px; margin: 0 0.3rem;}
     /*.sidePanel{padding-top: 0.2rem; background-color:transparent}
    
   
*/
    .stepTabContainer .tab-content .tab-pane .container { padding: 0 }
     /*.sidePanel .navbar-collapse{position:relative;
      left: 0%;
      padding: 15px;
      width:100%;
      top:0%;
      height:auto  !important;    background-color: #0a6b7a;}
   .sidePanel .navbar-collapse { height: 0 !important; padding:0;
      -webkit-transition: left 0.3s linear;
      -o-transition: left 0.3s linear;
      -moz-transition: left 0.3s linear;
      transition: left 0.3s linear;
      -webkit-transition: height 0s linear;
     -o-transition: height 0s linear;
     transition: height .0s linear;
      left: -100%;}

    .sidePanel .navbar-collapse.show { left: 0;
      -webkit-transition: left 0.3s linear;
      -o-transition: left 0.3s linear;
      -moz-transition: left 0.3s linear;
      transition: left 0.3s linear; left: -100%; }*/

    .fa.full-screen-handle { display: none }
}

.w-98 { width: 98%; }



.wfBoard { left: 0; right: 0; background-color: #ffffff; max-width: 65%; margin: auto; text-align: center; border: 1px solid #a3a3a3; padding: 1rem 1.5rem }

.wfBoard .wfStatus { display: inline-block; }

.wfBoard .wfStatus.midColGSS { padding: 0 2rem; margin: 0 2rem; border-left: 1px solid #a3a3a3; border-right: 1px solid #a3a3a3 }

.wfBoard .wf-label { color: #333333; font-size: 0.9rem; display: block; font-weight: 500; line-height: 17px }

.wfBoard .wfStatus { display: block; font-size: 1.3rem; font-weight: 600; color: #333333; }

.workflow-gradeIcon, .workflow-ScoreIcon { width: 40px; height: 40px; display: inline-block; background-image: url("../images/sprite.png") }

.workflow-statusIcon { width: 40px; height: 40px; display: inline-block; line-height: 40px; vertical-align: top; }

.workflow-statusIcon::after { font-family: 'FontAwesome'; display: inline-block; font-size: 2rem; font-style: normal; }

.wfApproved .workflow-statusIcon::after { content: '\f046'; color: #1fa82f }

.wfMoreData .workflow-statusIcon::after { content: '\f071'; color: #ff7e0b }

.wfInProgress .workflow-statusIcon::after { content: '\f017'; color: #0a7f91 }

.wfRejected .workflow-statusIcon::after { content: '\f05c'; color: #e92929; }
/* rejected add new in code*/
.wfNew .workflow-statusIcon::after, .wfSubmitted .workflow-statusIcon::after { content: '\f0f6'; color: #0a7f91 }

.workflow-gradeIcon { background-position: -51px -872px }

.workflow-ScoreIcon { background-position: -101px -872px }

.wfApproved .workflow-status { font-size: 1.2rem; font-weight: 600; color: #1fa82f; }

.wfMoreData .workflow-status { font-size: 1.2rem; font-weight: 600; color: #ff7e0b; }

.wfNew .workflow-status, .wfSubmitted .workflow-status, .wfInProgress .workflow-status { display: block; font-size: 1.2rem; font-weight: 600; color: #000; }

@media (min-width: 768px) {
    .modal-content { width: 100%; margin: auto; }
    /*600px*/
}
/*mobile landscape*/
@media only screen and (min-width: 700px) and (max-width: 1024px) {
    .serivceLinkform form .form-row{flex-direction: row !important; justify-content:flex-start !important; margin: 0.3rem !important;}
    .serivceLinkform, .serivceLinkform form{ height:auto}

}
#history .wfBoard { border: none; }

#history .timeline__content { padding: 0px 10px !important; }

#history .alert { padding: 0 !important; }

/*#history .workflow-icon::after { font-family: 'FontAwesome'; text-align: center; width: 41px; height: 45px; line-height: 40px; display: block; font-size: 1.4rem; color: #fff; font-style: normal; }
#history .wfApproved .workflow-icon { content: '\f046'; }
#history .wfMoreData .workflow-icon { content: '\f071'; }
#history .wfInProgress .workflow-icon { content: '\f017'; }
#history .wfNew .workflow-icon::after { content: '\f0f6'; }
#history .wfSubmitted .workflow-icon::after { content: '\f0f6'; }
#history .wfCancel .workflow-icon::after { content: '\f00d'; }*/
#history .wfNew { background-color: #0a7f91 }

#history .wfSubmitted { background-color: #0a7f91 }

#history .wfMoreData { background-color: #f1761b }

#history .wfInProgress { background-color: #8bc6cf }

#history .wfApproved { background-color: #1fa82f }

#history .wfCancel { background-color: #c63434 }

#history .cd-timeline__content h2 { font-size: 13px; color: #0a7f91; font-weight: bold }

#history .workflow-icon { display: block; position: relative; left: 50%; top: 50%; margin-left: -20px; margin-top: -20px; }

.cd-timeline__container .cd-timeline__block:nth-child(2n+1) { text-align: right; }

.cd-timeline__container .cd-timeline__block:nth-child(2n+2) { text-align: left; }

catheader { /*font-weight: bold;*/ color: tan; }

catheader .categoryItem label { font-weight: bold; }

.checklist label { font-weight: normal; }

.showOnLoad { display: none; }

.loginType .dropdown-menu { padding: 0px 0px !important; }

.align-center { text-align: center; }

.consent { height: 160px; overflow-y: scroll; }

.center { text-align: center !important; }

.middle { vertical-align: middle !important; }

.closeAgent { width: 20px; display: inline-block; text-align: center; text-shadow: 0 1px 0 #fff; opacity: .5; }

.closeAgent:hover, .closeAgent:focus { color: #000; text-decoration: none; opacity: .75; }

tr.highlight { background-color: #FFFF9C !important; }
/*supervision Messaging*/
.not-viewed-msg { box-shadow: inset -6px 0px #7e9469; color: #7e9469; font-weight: 600 }

#supervisionMessages-grid > table > thead > tr > th { padding-right: 0 !important; padding-left: 0 !important; }

.msg { padding: 5px; border-top: 1px solid #ddd; margin: 0; height: 150px; }

.msg.odd { background-color: #FFFFFF; }

.msg.even { background-color: #F4F6F8; }

.msg-wrap { padding: 10px; }

.msg-wrap .media-heading { color: #0a6b7a; font-weight: 700; }

.panel.panel-horizontal { display: table; width: 100%; }

.panel.panel-horizontal > .panel-heading, .panel.panel-horizontal > .panel-body { display: table-cell; padding: 10px; }

.panel.panel-horizontal > .panel-heading { width: 25%; border: 0; vertical-align: middle; }

.panel.panel-horizontal > .panel-heading { border-inline-end: 1px solid #ddd; border-top-right-radius: 0; border-bottom-left-radius: 4px; }

.HistoryMsgBody { max-height: 200px; overflow-y: auto; width: 100%; padding: 20px; }

.HistoryMsgBody::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); border-radius: 10px; background-color: #F5F5F5; }

.HistoryMsgBody::-webkit-scrollbar { width: 7px; background-color: #F5F5F5; }

.HistoryMsgBody::-webkit-scrollbar-thumb { border-radius: 7px; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3); background-color: #0a6b7a; }

.ltrDir { direction: ltr; }

#WaqfFormsHistory-grid td, #WaqfFormsHistory-grid th, #OtherEvaluators-grid td, #OtherEvaluators-grid th, #SupervisionVisit-grid td, #SupervisionVisit-grid th, #WaqfVisitsWithInfractions-grid td, #WaqfVisitsWithInfractions-grid th, #div-waqf #waqf-grid td, #div-waqf #waqf-grid th, #ContractsFollowUp-grid td, #ContractsFollowUp-grid th, #AssignedWaqfs-grid td, #AssignedWaqfs-grid th, #AssigninigLogs-grid td, #AssigninigLogs-grid th, #AssignedWaqfs_table > td, #AssignedWaqfs_table > th {
    white-space: nowrap;
}
.linkEffect a {color: #4478A6;text-decoration: none;background-color: transparent;transition: background-color 1s linear;  padding: 3px;}
.linkEffect a:hover {color: #26445e;background-color: #dee8f1;}
.linkEffect a:visited { color: #96b7d4;}
.chosen-search-input {font-family: 'Droid Arabic Kufi', sans-serif !important;}
.center{text-align:center !important;}
.middle{vertical-align:middle !important;}
.closeAgent { width:20px; display:inline-block; text-align:center; text-shadow: 0 1px 0 #fff;opacity: .5;}
.closeAgent:hover, .closeAgent:focus {color: #000;text-decoration: none;opacity: .75;}
tr.highlight{background-color:#FFFF9C !important;}

.waqfNumWidth{
    width: 200px;
}
.soften {
    height: 1px;
    background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0 95 113 / 93%), rgba(0, 0, 0, 0));
    background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0 95 113 / 93%), rgba(0, 0, 0, 0));
    background-image: -ms-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0 95 113 / 93%), rgba(0, 0, 0, 0));
    background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0 95 113 / 93%), rgba(0, 0, 0, 0));
    border: 0;
}
/*Administrative supervision - Messages hisory*/
.comment-heading::after {
    display: inline-block;
    position: absolute;
    right: 0;
    align-self: center;
    color: rgba(0 0 0 / 51%);
    font-weight: bolder;
    font-size: 20px;
}

.comment-thread {
    width: 700px;
    max-width: 100%;
    margin: auto;
    padding: 0 30px;
    background-color: #fff;
    border: 1px solid transparent; /* Removes margin collapse */
}

.m-0 {
    margin: 0;
}

.sr-only {
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* Comment */

.comment {
    position: relative;
    margin: 20px auto;
}

.comment-heading {
    display: flex;
    align-items: center;
    height: 50px;
    font-size: 14px;
}

details.comment[open] .comment-heading::after {
    content: "\f0d8";
    font-family: FontAwesome;
}

details.comment:not([open]) .comment-heading::after {
    content: "\f0d7";
    font-family: FontAwesome;
}

.comment-voting {
    width: 20px;
    height: 32px;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 4px;
}

    .comment-voting button {
        display: block;
        width: 100%;
        height: 50%;
        padding: 0;
        border: 0;
        font-size: 10px;
    }

.comment-info {
    color: rgba(0, 0, 0, 0.5);
    margin-left: 10px;
}

.comment-author {
    color: rgba(0, 0, 0, 0.85);
    font-weight: bold;
    text-decoration: none;
}

    .comment-author:hover {
        text-decoration: underline;
    }


.comment-border-link {
    display: block;
    position: absolute;
    top: 50px;
    left: 6px;
    width: 12px;
    height: calc(100% - 50px);
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    background-color: rgba(0, 0, 0, 0.1);
    background-clip: padding-box;
}

    .comment-border-link:hover {
        background-color: rgba(0, 0, 0, 0.3);
    }

.comment-body {
    padding: 0 20px;
    padding-left: 28px;
}

.replies {
    margin-left: 28px;
}



details.comment summary {
    position: relative;
    list-style: none;
    cursor: pointer;
}

    details.comment summary::-webkit-details-marker {
        display: none;
    }

details.comment:not([open]) .comment-heading {
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .comment-heading {
        cursor: default;
    }

    details.comment[open] .comment-heading::after,
    details.comment:not([open]) .comment-heading::after {
        content: " ";
    }
}

.actionBtn {
    color: #5a7b3d;
    margin: 0 0.1rem;
    font-size: 1.3em;
    text-decoration: none;
}


.required-asterisk:after {
    content: " *";
    color: red;
}
.capital-total {

}
.noSearch {

}
.DeleteFromGrid {

}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.day-select {
    border-color: #ced4da;
    border-left-style: none;
    border-bottom-left-radius: 0px;
    border-top-left-radius: 0px;
}

.month-select {
    border-radius: 0px;
    border-color: #ced4da;
    border-right-style: none;
}
#estform-grid {
overflow-x:scroll;
}

.formtabs > li > a {
    padding:10px 5px;
}


/*.bootstrap-datetimepicker-widget{ display:none !important}*/