@charset 'UTF-8';
@import url('font-awesome.min.css');
@import url('https://fonts.googleapis.com/css2?family=Almarai:wght@300;400;700;800&family=Amiri:wght@400;700&family=Aref+Ruqaa:wght@400;700&display=swap');
@font-face{font-family:'Noto Nastaliq Urdu Draft';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/ea/notonastaliqurdudraft/v3/NotoNastaliqUrduDraft.eot);src:url(//fonts.gstatic.com/ea/notonastaliqurdudraft/v3/NotoNastaliqUrduDraft.eot) format("embedded-opentype"),url(//fonts.gstatic.com/ea/notonastaliqurdudraft/v3/NotoNastaliqUrduDraft.woff2) format("woff2"),url(//fonts.gstatic.com/ea/notonastaliqurdudraft/v3/NotoNastaliqUrduDraft.woff) format("woff"),url(//fonts.gstatic.com/ea/notonastaliqurdudraft/v3/NotoNastaliqUrduDraft.ttf) format("truetype")}
@font-face{font-family:'Noto Kufi Arabic';font-style:normal;font-weight:400;src:url(//fonts.gstatic.com/ea/notokufiarabic/v2/NotoKufiArabic-Regular.eot);src:url(//fonts.gstatic.com/ea/notokufiarabic/v2/NotoKufiArabic-Regular.eot?#iefix) format("embedded-opentype"),url(//fonts.gstatic.com/ea/notokufiarabic/v2/NotoKufiArabic-Regular.woff2) format("woff2"),url(//fonts.gstatic.com/ea/notokufiarabic/v2/NotoKufiArabic-Regular.woff) format("woff"),url(//fonts.gstatic.com/ea/notokufiarabic/v2/NotoKufiArabic-Regular.ttf) format("truetype")}
@font-face{font-family:'Noto Kufi Arabic';font-style:normal;font-weight:700;src:url(//fonts.gstatic.com/ea/notokufiarabic/v2/NotoKufiArabic-Bold.eot);src:url(//fonts.gstatic.com/ea/notokufiarabic/v2/NotoKufiArabic-Bold.eot?#iefix) format("embedded-opentype"),url(//fonts.gstatic.com/ea/notokufiarabic/v2/NotoKufiArabic-Bold.woff2) format("woff2"),url(//fonts.gstatic.com/ea/notokufiarabic/v2/NotoKufiArabic-Bold.woff) format("woff"),url(//fonts.gstatic.com/ea/notokufiarabic/v2/NotoKufiArabic-Bold.ttf) format("truetype")}
@font-face{font-family:Amiri;font-style:normal;font-weight:400;src:local(Amiri),local(Amiri-Regular),url(http://fonts.gstatic.com/s/amiri/v7/k2MEYNRoSfd5tdYW9SpWiA.woff2) format("woff2")}
@font-face{font-family:Amiri;font-style:normal;font-weight:700;src:local('Amiri Bold'),local(Amiri-Bold),url(http://fonts.gstatic.com/s/amiri/v7/8b_RNX_MuT-wzF5O8XZEVvesZW2xOQ-xsNqO47m55DA.woff2) format("woff2")}

/* Basic */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
@-ms-viewport {
	width: device-width;
}
body {
	-ms-overflow-style: scrollbar;
}
body.is-preload *, body.is-preload *:before, body.is-preload *:after {
	-moz-animation: none !important;
	-webkit-animation: none !important;
	-ms-animation: none !important;
	animation: none !important;
	-moz-transition: none !important;
	-webkit-transition: none !important;
	-ms-transition: none !important;
	transition: none !important;
}

/* Container */
.container {
	margin-left: auto;
	margin-right: auto;
}

/* Media */
/* Extra large devices (large laptops and desktops, 1680px and up) */
@media screen and (max-width:1680px){
}

/* Extra large devices (large laptops and desktops, 1441px and up) */
@media screen and (max-width: 1441px) {
.container {
}
}
/* Extra large devices (large laptops and desktops, 1280px and up) */
@media screen and (max-width: 1280px) {
.container {
	width: 95%!important;
}
body {
    font-size: 90%!important;
}

}
/* Large devices (laptops/desktops, 992px and up) */
@media screen and (max-width: 992px) {
.container {
	width: 95%;
}
}

/* Medium devices (landscape tablets, 768px and up) */
@media screen and (max-width: 768px) {
.container {
	width: 100%!important;
}
body {
    font-size: 85%!important;
}
}
/* Medium devices (landscape tablets, 480px and up) */
@media screen and (max-width: 480px) {
html, body {
	min-width: 320px;
}
.container {
	width: 100%!important;
}
}
.row {
	border-bottom: solid 1px transparent;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.row > * {
	float: right;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.row:after, .row:before {
	content: '';
	display: block;
	clear: both;
	height: 0;
}
.row > * {
	padding: 1.5em 1.5em;
}
.row {
	margin: 0 auto;
}
.row.uniform > * {
	padding: 0.5em 0.5em;
}
.row.uniform {
	margin: 0  auto;
}

.\31 2u{
	width: 100%;
	clear: none;
	margin-left: 0;
}
.\31 1u{
	width: 91.6666666667%;
	clear: none;
	margin-left: 0;
}
.\31 0u{
	width: 83.3333333333%;
	clear: none;
	margin-left: 0;
}
.\39 u{
	width: 75%;
	clear: none;
	margin-left: 0;
}
.\38 u{
	width: 66.6666666667%;
	clear: none;
	margin-left: 0;
}
.\37 u{
	width: 58.3333333333%;
	clear: none;
	margin-left: 0;
}
.\36 u{
	width: 50%;
	clear: none;
	margin-left: 0;
}
.\35 u{
	width: 41.6666666667%;
	clear: none;
	margin-left: 0;
}
.\34 u{
	width: 33.3333333333%;
	clear: none;
	margin-left: 0;
}
.\33 u{
	width: 25%;
	clear: none;
	margin-left: 0;
}
.\32 u{
	width: 16.6666666667%;
	clear: none;
	margin-left: 0;
}
.\31 u{
	width: 8.3333333333%;
	clear: none;
	margin-left: 0;
}
.\31 2u + *, .\31 1u + *, .\31 0u + *, .\39 u + *, .\38 u + *, .\37 u + *, .\36 u + *, .\35 u + *, .\34 u + *, .\33 u + *, .\32 u + *, .\31 u + * {
	clear: left;
}
.\-11u {
	margin-left: 91.6666666667%;
}
.\-10u {
	margin-left: 83.3333333333%;
}
.\-9u {
	margin-left: 75%;
}
.\-8u {
	margin-left: 66.6666666667%;
}
.\-7u {
	margin-left: 58.3333333333%;
}
.\-6u {
	margin-left: 50%;
}
.\-5u {
	margin-left: 41.6666666667%;
}
.\-4u {
	margin-left: 33.3333333333%;
}
.\-3u {
	margin-left: 25%;
}
.\-2u {
	margin-left: 16.6666666667%;
}
.\-1u {
	margin-left: 83.33333%;
}

@media screen and (max-width:1280px){
.\31 u, .\32 u, .\33 u, .\34 u, .\35 u, .\36 u, .\37 u, .\38 u, .\39 u {
	width: 50%;
}
}
@media screen and (max-width:1200px){
#color-wrapper .row .\35 u,#color-wrapper .row .\37 u {
	width: 100%!important;
}
}
@media screen and (max-width:992px){
.\31 u, .\32 u, .\33 u, .\34 u, .\35 u, .\36 u, .\37 u, .\38 u, .\39 u {
	width: 100%;
}
}
@media screen and (max-width:768px){
.row > * {
	padding: 1em 1em;
}
.row.uniform > * {
	padding: .25em .25em;
}
.\31 u, .\32 u, .\33 u, .\34 u, .\35 u, .\36 u, .\37 u, .\38 u, .\39 u {
	width: 100%;
}
}
@media screen and (max-width:480px){
.row > * {
	padding: 1em 1em;
}
.row.uniform > * {
	padding: .25em .25em;
}
.\31 u, .\32 u, .\33 u, .\34 u, .\35 u, .\36 u, .\37 u, .\38 u, .\39 u {
	width: 100%;
}
}

body {
	width: 100%;
	height: 100%;
	background-position: top center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: 100% auto;
	line-height: 1.50em;
}

body.is-loading *,body.is-preload-0 *, body.is-preload-0 *:before, body.is-preload-0 *:after  {
	-moz-transition: none !important;
	-webkit-transition: none !important;
	-o-transition: none !important;
	transition: none !important;
	-moz-animation: none !important;
	-webkit-animation: none !important;
	-o-animation: none !important;
	animation: none !important;
}

html {
	box-sizing: border-box;
}
*, *:before, *:after {
	box-sizing: inherit;
}

a {
	text-decoration:none;
}
a,a:before,i {
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

a:hover {
	text-decoration: none;
}
h1, h2, h3, h4, h5, h6 {
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
	text-decoration: none;
	outline: 0;
}
b, strong {
	font-weight: 600;
}
i, em {
	font-style: italic;
}
br.clear {
	clear: both;
}
sub, sup{
	top: -.75em;
}

sub, sup {
	position: relative;
	font-size: .6em!important;
	padding: 0 .25em;
}
hr {
	border: 0;
	border-top: solid 1px #eee;
}
blockquote {
	border-left: solid 0.5em #eee;
	padding: 1em 0 1em 2em;
	font-style: italic;
}
p, ul, ol, dl, table {
	margin-bottom: .25em;
}
hr {
	background: -moz-linear-gradient(left,rgba(0,0,0,0) 0,rgba(0,0,0,.5) 50%,rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(left,rgba(0,0,0,0) 0,rgba(0,0,0,.5) 50%,rgba(0,0,0,0) 100%);
	background: linear-gradient(to right,rgba(0,0,0,0) 0,rgba(0,0,0,.5) 50%,rgba(0,0,0,0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#00000000', GradientType=1);
	position: relative;
	border: 0;
	margin: 1em auto;
	height: 1px;
}
center{
	margin: 1em auto;
}

/* List */

ul.info {
	list-style: inside;
	padding-right: 0;
	display:inline-block;
    color: inherit;
	margin-top:1em;
}
ul.info li:first-child {
	list-style: none;
}

ul.info li {
	border-bottom: dotted 1px rgba(0,0,0,.2);
	box-shadow: 0 1px 0 rgba(255,255,255,.9);
	padding: .25em 0;
}
ul.info li a{
	font-weight:300;
}

ul.info.article li{
	padding: .90em 0;
}

ul.info li span {
	padding: 0.25em;
	color: green;
}
ul.info li a:before {
	padding-left: .5em;
}
ul.info li:last-child {
	border-bottom: 0;
	box-shadow: none;
}

ul.alt {
	padding-right: 0;
	display:inline-block;
}
ul.alt li {
	border-bottom: dotted 1px rgba(0,0,0,.2);
	box-shadow: 0 1px 0 rgba(255,255,255,.9);
	padding: .5em 0;
}
ul.alt.article li{
	padding: .5em 0;
}
ul.alt.number li{
	list-style: decimal;
}
ul.alt li span {
	padding-right: .5em;
	color: green;
}
ul.alt li a:before {
	padding-left: .5em;
}
ul.alt li:last-child {
	border-bottom: 0;
	box-shadow: none;
}
ul.default {
	list-style: disc;
	padding-right: 1em;
}
ul.default li {
	padding-right: 0.5em;
}
ul.actions {
list-style: none;
    margin: 0 0 .25em;
}
ul.actions li {
	display: inline-block;
	list-style: none;
    margin: 0 0 .25em .25em;
}
ul.actions li:first-child {
	margin-right: 0;
	padding-right: 0;
}

ul.postview {
	position: absolute;
    top: 50%;
    right: 50%;
    text-align: center;
    color: #FFFFFF;
	margin: -25px -50px 0 0;
}
ul.postview li {
	display: inline-block;
}
ul.postview li a {
	font-size: inherit;
    color: #FFFFFF;
	padding:10px;
	text-align: center;
	opacity: .5;
}
ul.postview li a:hover {
	opacity: 1;
}

ul.status{
	padding: 1em 0;
	margin:0;
	font-size: initial;
}

ul.status li {
	display: inline-block;
}
ul.status li span {
	padding: 0 .5em;
	color: green;
}

ul.copyright li {
	border-right: solid 1px #e0e0e0;
	display: inline-block;
	padding: 0 0.75em 0 0;
	margin: 0 0.75em 0 0;
}
ul.copyright li:first-child {
	border-right: 0;
	margin-right: 0;
	padding-right: 0;
}

ol.default {
	list-style: decimal;
	padding-right: 1.25em;
}
ol.default li {
	padding-right: 0.25em;
}

header {
	padding: 0 0 1em 0;
}
header h2, header h3 {
	padding: 0 0 0.25em 0;
}
footer {
	padding: 1em 0 0 0;
}
@media screen and (max-width: 600px) {
ul.copyright li {
	border: 0;
	margin: 0;
	padding: 0;
display: block;
}
}

/* Form */
form {
	margin: 0 0 2em 0;
}
label {
	color: #646464;
	display: block;
	font-size: 0.9em;
	font-weight: 300;
	margin: 0 0 1em 0;
}
input[type=text], input[type=password], input[type=email],input[type=tel], select, textarea{
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	background: #f8f8f8;
	border-radius: 6px;
	border: solid 1px #e5e5e5;
	color: inherit;
	font-size:inherit;
	display: block;
	outline: 0;
	padding: 0 1em;
	text-decoration: none;
	width: 100%;
	-moz-transition: all .3s ease,color .3s ease;
	-webkit-transition: all .3s ease,color .3s ease;
	transition: all .3s ease,color .3s ease;
}
input[type=text]:invalid, input[type=password]:invalid, input[type=email]:invalid,input[type=tel]:invalid, select:invalid, textarea:invalid, option:invalid {
	box-shadow: none;
}
input[type=text]:focus, input[type=password]:focus, input[type=email]:focus,input[type=tel]:focus, select:focus, textarea:focus, option:focus {
	border-color: #FFFFFF;
	box-shadow: 0 0 0 1px #acacac;
}
.select-wrapper {
	text-decoration: none;
	display: block;
	position: relative;
}
.select-wrapper:before {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-transform: none !important;
}
.select-wrapper:before {
	color: #acacac;
	content: '\f078';
	display: block;
	height: 3em;
	line-height: 3em;
	pointer-events: none;
	position: absolute;
	left: 0;
	text-align: center;
	top: 0;
	width: 3em;
}
.select-wrapper select::-ms-expand {
	display: none;
}
option {
    font-weight: inherit;
	font-size: inherit;
}

input[type=text], input[type=password], input[type=email],input[type=tel], select {
	height: 3em;
}

textarea {
	padding: 0.75em 1em;
	min-height: 8em;
}
input[type=checkbox], input[type=radio] {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	display: block;
	float: right;
	margin-left: -2em;
	opacity: 0;
	width: 1em;
	z-index: -1;
}
input[type=checkbox] + label, input[type=radio] + label {
	text-decoration: none;
	color: #777;
	cursor: pointer;
	display: inline-block;
	font-size: 1em;
	font-weight: 300;
	padding-right: 2.55em;
	padding-left: 0.75em;
	position: relative;
}
input[type=checkbox] + label:before, input[type=radio] + label:before {
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	font-family: FontAwesome;
	font-style: normal;
	font-weight: normal;
	text-transform: none !important;
}
input[type=checkbox] + label:before, input[type=radio] + label:before {
	background: #f8f8f8;
	border-radius: 6px;
	border: solid 1px #e5e5e5;
	content: '';
	display: inline-block;
	height: 1.8em;
	right: 0;
	line-height: 1.725em;
	position: absolute;
	text-align: center;
	top: 0;
	width: 1.8em;
}
input[type=checkbox]:checked + label:before, input[type=radio]:checked + label:before {
	background: #666;
	border-color: #666;
	color: #ffffff;
	content: '\f00c';
}
input[type=checkbox]:focus + label:before, input[type=radio]:focus + label:before {
	border-color: #FFFFFF;
	box-shadow: 0 0 0 1px #acacac;
}
input[type=checkbox] + label:before {
	border-radius: 6px;
}
input[type=radio] + label:before {
	border-radius: 100%;
}
::-webkit-input-placeholder {
	color: #999 !important;
	opacity: 1.0;
}
:-moz-placeholder {
	color: #999 !important;
	opacity: 1.0;
}
::-moz-placeholder {
	color: #999 !important;
	opacity: 1.0;
}
:-ms-input-placeholder {
	color: #999 !important;
	opacity: 1.0;
}
.formerize-placeholder {
	color: #999 !important;
	opacity: 1.0;
}
/* Button */
input[type=submit], input[type=reset], input[type=button], button.button,a.button {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
	-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
	transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
	border-radius: 6px;
	border: 0;
	cursor: pointer;
	display: inline-block;
	height: 3em;
	line-height: 3em;
	padding: 0 2em;
	margin: .5em 0;
	text-align: center;
	text-decoration: none;
	white-space: nowrap;
}
input[type=submit]:hover, input[type=reset]:hover, input[type=button]:hover, .button:hover {
	background-color: #737373!important;
	color: #ffffff!important;
}
input[type=submit]:active, input[type=reset]:active, input[type=button]:active, .button:active {
	background-color: #595959!important;
}
input[type=submit].icon, input[type=reset].icon, input[type=button].icon, .button.icon {
	padding-right: 1.35em;
}
input[type=submit].icon:before, input[type=reset].icon:before, input[type=button].icon:before, .button.icon:before {
	margin-left: 0.5em;
}
input[type=submit].fit, input[type=reset].fit, input[type=button].fit, .button.fit {
	display: block;
	margin: 0 0 1em 0;
	width: 100%;
}
input[type=submit].small, input[type=reset].small, input[type=button].small, .button.small {
	font-size: smaller;
	height: 2.7em;
	line-height: 2.7em;
    padding: 0 1em;
}
input[type=submit].big, input[type=reset].big, input[type=button].big, .button.big {
	font-size: larger;
	height: 2.7em;
	line-height: 2.7em;
}
input[type=submit].alt, input[type=reset].alt, input[type=button].alt, .button.alt {
	background-color: transparent;
	box-shadow: inset 0 0 0 2px #e5e5e5;
	color: #777;
}
input[type=submit].alt:hover, input[type=reset].alt:hover, input[type=button].alt:hover, .button.alt:hover {
	background-color: #f8f8f8;
}
input[type=submit].alt:active, input[type=reset].alt:active, input[type=button].alt:active, .button.alt:active {
	background-color: #f0f0f0;
}
input[type=submit].alt.icon:before, input[type=reset].alt.icon:before, input[type=button].alt.icon:before, .button.alt.icon:before {
	color: #999;
}
input[type=submit].special, input[type=reset].special, input[type=button].special, .button.special {
	background-color: #00644f;
	color: #ffffff !important;
}
input[type=submit].special:hover, input[type=reset].special:hover, input[type=button].special:hover, .button.special:hover {
	background-color: #ecaa96;
}
input[type=submit].special:active, input[type=reset].special:active, input[type=button].special:active, .button.special:active {
	background-color: #e4886a;
}
input[type=submit].disabled, input[type=submit]:disabled, input[type=reset].disabled, input[type=reset]:disabled, input[type=button].disabled, input[type=button]:disabled, .button.disabled, .button:disabled {
	background-color: #777 !important;
	box-shadow: inset 0 -0.15em 0 0 rgba(0, 0, 0, 0.15);
	color: #f5f5f5 !important;
	cursor: default;
	opacity: 0.25;
}

/* Table */
.table-wrapper {
	-webkit-overflow-scrolling: touch;
	overflow-x: auto;
}
table {
	margin: 0 0 2em 0;
	width: 100%;
}
table tbody tr {
	border: solid 1px;
	border-left: 0;
	border-right: 0;
}
table td {
	padding: 0.75em 0.75em;
}
table th {
	font-family: "Source Sans Pro", Helvetica, sans-serif;
	font-size: 0.8em;
	font-weight: 900;
	letter-spacing: 0.075em;
	line-height: 1.5;
	padding: 0 0.75em 0.75em 0.75em;
	text-align: left;
	text-transform: uppercase;
}
@media screen and (max-width: 980px) {
table th {
	font-size: 0.9em;
}
}
table thead {
	border-bottom: solid 2px;
}
table tfoot {
	border-top: solid 2px;
}
table.alt {
	border-collapse: separate;
}
table.alt tbody tr td {
	border: solid 1px;
	border-left-width: 0;
	border-top-width: 0;
}
table.alt tbody tr td:first-child {
	border-left-width: 1px;
}
table.alt tbody tr:first-child td {
	border-top-width: 1px;
}
table.alt thead {
	border-bottom: 0;
}
table.alt tfoot {
	border-top: 0;
}
table tbody tr {
	border-color: #eeeeee;
}
table tbody tr:nth-child(2n + 1) {
			background-color: rgba(220, 220, 220, 0.25);
		}
table th {
	color: #252525;
}
table thead {
	border-bottom-color: #eeeeee;
}
table tfoot {
	border-top-color: #eeeeee;
}
table.alt tbody tr td {
	border-color: #eeeeee;
}
/* Image */
.image {
	display: block;
	max-width: 100%;
}
.image img {
	display: block;
	width: 100%;
	height: auto;
}
.image.fit {
	display: block;
	width: 100%;
}
.image.featured {
	position:relative;
	overflow:hidden;
	width: auto;
	height: 180px;
	margin: 0 auto;
}
.image.featured img {
    position: absolute;
    left: -1000%;
    right: -1000%;
    top: -1000%;
    bottom: -1000%;
    margin: auto;
    min-height: 100%;
    min-width: 100%;
}

.image.left {
	float: left;
	margin: 0 0.5em 0.5em 0;
}
.image.right {
	float: right;
	margin: 0 0 0.5em 0.5em;
}

.image.centered {
	display: block;
	margin: 0 0 0.5em 0;
}
.image.centered img {
	margin: 0 auto;
	width: auto;
}

/* Wrappers */
#wrapper {
	-moz-transition: opacity 0.5s ease;
	-webkit-transition: opacity 0.5s ease;
	transition: opacity 0.5s ease;
	position: relative;
	z-index: 1;
	overflow: hidden;
}

.bg-wrapper {
    background-attachment: fixed;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

/* Divider */
.divider-top {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	overflow: hidden;
	line-height: 0;
	z-index: 9;
}
	.divider-top svg {
		position: relative;
		display: block;
		width: calc(100% + 1.3px);
		height: 130px;
	}

	.divider-top .shape-fill {
		fill: #FFFFFF26;
}
/* Header */
#header-bar {
	position: absolute;
	top: 30px;
	right: 0;
	width: 100%;
	height: 50px;
	margin-left: auto;
	margin-right: auto;
	z-index: 9999;
}
/* Logo */
#header-bar .logo {
	position: absolute;
	top: -25px;
	right:70px;
    height: 100px;
    width: 100px;
	text-align: center;
    background-repeat: no-repeat;
    background-position: center center;
    overflow: hidden;
}

#header-bar h1 {
	position:absolute;
	top: 12px;
	right:180px;
}
#header-bar .logo span {
	line-height: 4.5em;
}
/* Icons */
ul.icons {
    position: absolute;
	top: 0;
    left: 25px;
    margin:0;
    height: 50px;
    z-index: 99999;
	cursor: default;
    text-align:center;
	list-style: none;
}
ul.icons li {
	display: inline-block;
	padding-left: 1.75em;
}
ul.icons li:last-child {
	padding-left: 0;
}
ul.icons li .fa:before {
	display: inline-block;
	text-align: center;
	line-height: 50px;
	-moz-transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}

@media screen and (max-width: 736px) {
#header-bar h1 {
display:none;
}

ul.icons li {
	padding-left: 1.25em;
}
.divider-top {
display:none;
}
}

/* Intro */
#intro {
	color: #ffffff;
	padding: 6em 4em 6em 4em;
	-webkit-align-items: center;
	align-items: center;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	justify-content: flex-end;
	-moz-transition: opacity 1s ease, -moz-transform 1s ease;
	-webkit-transition: opacity 1s ease, -webkit-transform 1s ease;
	transition: opacity 1s ease, transform 1s ease;
	position: relative;
	cursor: default;
	text-align: center;
	z-index: 1;
	min-height: 100vh;
}
#intro.fade-in:before {
	pointer-events: none;
	-moz-transition: opacity 1s ease-in-out;
	-webkit-transition: opacity 1s ease-in-out;
	transition: opacity 1s ease-in-out;
	-moz-transition-delay: 1s;
	-webkit-transition-delay: 1s;
	transition-delay: 1s;
	z-index: 1;
	content: '';
	display: block;
	height: 100%;
	left: 0;
	opacity: 1;
	position:absolute;
	top: 0;
	width: 100%;
	background: -moz-radial-gradient(center, ellipse cover, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0) 90%);
	background: -webkit-radial-gradient(center, ellipse cover, rgba(0,0,0,0.7) 0%,rgba(0,0,0,0) 90%);
	background: radial-gradient(ellipse at center, rgba(0,0,0,0.7) 0%,rgba(0,0,0,0) 90%);
}
body.is-preload #intro.fade-in:before {
	opacity: 0;
}

#intro .inner,.noads{
	max-width:700px;
	color: #FFFFFF;
	display: inline-block;
	padding: 1.5em;
	position: absolute;
	top: 50%;
	left: 50%;
  	transform: translate(-50%, -50%);
	text-align: center;
	z-index:9;
}

#intro .inner,.noadsCube{
	max-width:700px;
	color: #FFFFFF;
	display: inline-block;
	padding: 1.5em;
	position: absolute;
	top: 50%;
	left: 50%;
  	transform: translate(-50%, -50%);
	text-align: center;
	z-index:9;
}

.cubecontainer {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #000;
    
    margin: 0;
    position: relative;
}

.scene {
    width: 400px; /* Make the scene wider */
    height: 400px;
    perspective: 800px; /* Adjust perspective for wider scene */
    position: relative;
    margin-right: 150px;
    margin-top: 150px;
}

.cube {
    width: 75%;
    height: 75%;
    position: absolute;
    transform-style: preserve-3d;
    /*animation: rotateY 20s infinite linear; */
    transition: transform 1s;
}

.face {
    position: absolute;
    width: 250px; /* Adjust size for wider scene */
    height: 250px;
    background-color: #fff;
    border: 2px solid #ccc;
    box-sizing: border-box;
}

.front  { transform: rotateY(  0deg) translateZ(200px); }
.back   { transform: rotateY(180deg) translateZ(200px); }
.left   { transform: rotateY(-90deg) translateZ(200px); }
.right  { transform: rotateY( 90deg) translateZ(200px); }
.top    { transform: rotateX( 90deg) translateZ(200px); }
.bottom { transform: rotateX(-90deg) translateZ(200px); }

.face img {
    width: 100%;
    height: 100%;

    object-fit: cover;
    -webkit-user-drag: none;
    user-drag: none;
    pointer-events: none;
}

@keyframes rotate {
    from { transform: rotateY(0deg)  }
    to { transform: rotateY(360deg)  }
}

#intro .inner img {	width:450px;	height:450px;	border-radius:100%;}
#intro .inner header {
	display: inline-block;
	padding: 1px 0 1px 0;
}
#intro .inner header h2 {
	border-bottom: solid 2px;
	border-top: solid 2px;
	margin: 0;
	padding: 0.75em;
	position: relative;
}

#intro a.goto-next {
	position: absolute;
	background-color: rgba(0,0,0,0.1);
    color: rgba(255,255,255,0.7);
    width: 1.5em;
    height: 1.5em;
    line-height:1.5em;
    border:2px rgba(255,255,255,0.7) solid;
    border-radius: 100%;
    text-align: center;
   overflow: hidden;
    padding:0;
    white-space: nowrap;
    z-index:10;
}
#intro a.goto-next:hover{
	border-color: #FFFFFF;
	color: #FFFFFF;
}

#intro + #header {
	margin-top: -20em;
}
#intro + #header{
	-moz-transform: translateY(2em);
	-webkit-transform: translateY(2em);
	-ms-transform: translateY(2em);
	transform: translateY(2em);
	opacity: 0;
	visibility: hidden;
}
#intro.hidden {
	pointer-events: none;
	-moz-transform: translateY(2em);
	-webkit-transform: translateY(2em);
	-ms-transform: translateY(2em);
	transform: translateY(2em);
	-moz-transition: opacity 0.5s ease, -moz-transform 0.5s ease, visibility 0.5s;
	-webkit-transition: opacity 0.5s ease, -webkit-transform 0.5s ease, visibility 0.5s;
	transition: opacity 0.5s ease, transform 0.5s ease, visibility 0.5s;
	opacity: 0;
	visibility: hidden;
}
#intro.hidden + #header{
	-moz-transform: translateY(0);
	-webkit-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0);
	opacity: 1;
	visibility: visible;
}
body.is-preload #intro {
	-moz-transform: translateY(2em);
	-webkit-transform: translateY(2em);
	-ms-transform: translateY(2em);
	transform: translateY(2em);
	opacity: 0;
}
body.is-preload #intro:not(.hidden) + #header + #nav {
				-moz-transform: translateY(4em);
				-webkit-transform: translateY(4em);
				-ms-transform: translateY(4em);
				transform: translateY(4em);
				opacity: 0;
			}
@media screen and (max-width: 980px) {
#intro {
	padding: 4em 4em 6em 4em;
}#intro .inner img {	width:350px;	height:350px;}
#intro + #header {
	margin-top: -14em;
}
}
@media screen and (max-width: 736px) {
#intro {
display:none;
}
}
/* Header */
#header {
	color: #ffffff;
	-webkit-align-items: center;
	align-items: center;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	justify-content: flex-end;
	pointer-events: none;
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
	height: 20em;
	padding-bottom: 6em;
	position: relative;
	text-align: center;
	z-index: 2;
}
#header h1 {
	-moz-transition: border-color 0.2s ease-in-out, color 0.2s ease-in-out, opacity 0.5s ease, -moz-transform 0.5s ease, visibility 0.5s;
	-webkit-transition: border-color 0.2s ease-in-out, color 0.2s ease-in-out, opacity 0.5s ease, -webkit-transform 0.5s ease, visibility 0.5s;
	transition: border-color 0.2s ease-in-out, color 0.2s ease-in-out, opacity 0.5s ease, transform 0.5s ease, visibility 0.5s;
	color: inherit;
	background-color: rgba(0, 0, 0, 0.5);
	pointer-events: auto;
	border: 5px solid rgba(255, 255, 255, 0.5);
	font-size:  130%;
	line-height: 1;
	padding: .75em 1.75em;
	visibility: visible;
}

@media screen and (max-width: 980px) {
#header {
	height: 14em;
	padding-bottom: 2em;
}
}
@media screen and (max-width: 736px) {
#header {
	padding-bottom: 2em;
}
#header h1 {
	font-size:  90%;
	border-width: 3px !important;
}

}
/* Nav */
#nav {
	color: #ffffff;
	display: -webkit-flex;
	display: flex;
	-moz-transition: -moz-transform 1s ease, opacity 1s ease;
	-webkit-transition: -webkit-transform 1s ease, opacity 1s ease;
	transition: transform 1s ease, opacity 1s ease;
	background: rgba(0,0,0,0.7);
	height: 4em;
	line-height: 4em;
	margin: -4em auto 0 auto;
	overflow: hidden;
	padding: 0 0 0 2em;
	position: relative;
	z-index: 2;
}
/* Search Bar */

#nav .searchbar{
    position: relative;
}
#nav .searchbar input{
	  background: transparent;
	  cursor:pointer;
	  overflow: hidden;
	  position: absolute;
	  left:-.75em;
	  top:.5em;
	  border:0;
	  color:#FFFFFF;
	  width:40px;
}
#nav .searchbar input[type=text]:focus, .searchbar input[type=text]:hover {
	  border: 1px rgba(255, 255, 255, 0.3) solid;
	border-color: #FFFFFF;
	width:240px;
}

#nav .searchbar form.fa-search:before {
	cursor:pointer;
    position: absolute;
    left:0;
    color: rgba(255, 255, 255, 0.5);
    line-height: 2em;
    display: inline-block;
    font-size: 1.75em;
}
#nav .searchbar form.fa-search:hover:before {
    color: rgba(255, 255, 255, 0.9);
}

#nav ul.divided li {
	border-top-color: #ffffff;
}
#nav a {
	color: #ffffff;
}

#nav ul.links {
	display: -webkit-flex;
	display: flex;
	-webkit-flex-grow: 1;
	flex-grow: 1;
	flex-shrink: 1;
	font-weight: 900;
	list-style: none;
	margin-bottom: 0;
	padding-right: 0;
}
#nav ul.links li {
	display: block;
	padding-right: 0;
}
#nav ul.links li a {
	-moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
	-webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
	transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
	display: block;
	outline: none;
	padding: 0 2em;
}
#nav ul.links li a:hover {
	color: #FFFFFF !important;
	background-color: rgba(255, 255, 255, 0.2);
}
#nav ul.links li.active {
	background-color: #FFFFFF;
}
#nav ul.links li.active a {
	color: rgba(0, 0, 0, 0.8);
}
#nav ul.links li.active a:hover {
	color: #000000 !important;
}

@media screen and (max-width: 980px) {
#nav {
	display: none;
}
}

/* Main */
#main {
    position: relative;
	z-index: 2;
}

@media screen and (max-width:736px){
.service-mobile {
	padding-top: 100px;
}
}


/*------------------------------------------------------
	Newpost Styling 
--------------------------------------------------------*/
.gallery-item {
	overflow: hidden;
	position: relative;
	border: 1px solid;
	width:  auto;
	height: 250px;
	text-align:center;
}
.gallery-item img {
    position: absolute;
    left: -1000%;
    right: -1000%;
    top: -1000%;
    bottom: -1000%;
    margin: auto;
    min-height: 100%;
    min-width: 100%;
}
.gallery-item .overlay {
	background-color: rgba(0, 0, 0, 0.5);
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	visibility: hidden;
	z-index:1;
	-webkit-transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
}
.gallery-item .overlay a{
	position:relative;
	top:50%;
	right: 0;
	width: 100%;
	height: 100%;
	color:initial;
    padding: 10px;
	font-size: smaller;
}

.gallery-item:hover .overlay {
	opacity: 1;
	visibility: visible;
}
.shuhada_grid {
	position: relative;
	margin: 2.5em 2em;
	box-shadow: 0 0 0 3px #000,0 0 0 6px #FFF,0 0 0 9px #ed1c24;
}

.shuhada_grid .bottom-left, .shuhada_grid .bottom-right, .shuhada_grid .top-left, .shuhada_grid .top-right {
	background-image: url(images/static_images.png);
	background-repeat: no-repeat;
	background-position: -215px -290px;
	position: absolute;
	width: 105px;
	height: 105px;
}
.shuhada_grid .top-right {
	top: 0;
	right: 0;
	margin: -1.75em -1.75em 0 0;
}
.shuhada_grid .top-left {
	top: 0;
	left: 0;
	margin: -1.75em 0 0 -1.75em;
	-ms-transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);
	transform: rotate(-90deg);
}
.shuhada_grid .bottom-right {
	bottom: 0;
	right: 0;
	margin: 0 -1.75em -1.75em 0;
	-ms-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	transform: rotate(90deg);
}
.shuhada_grid .bottom-left {
	bottom: 0;
	left: 0;
	margin: 0 0 -1.75em -1.75em;
	-ms-transform: rotateX(-180deg) rotateY(180deg);
	-webkit-transform: rotateX(-180deg) rotateY(180deg);
	transform: rotateX(-180deg) rotateY(180deg);
}

/*------------------------------------------------------
	Services Styles 
--------------------------------------------------------*/
.service {
	margin-top: 30px;
	overflow: hidden;
	background-color: white;
}
.service-header {
	position: relative;
	height: 60px;
}
.service-header .header-bg {
	position: absolute;
	width: 60px;
	height: 60px;
	z-index: 2;
}
.service-header .service-icon {
	position: absolute;
	z-index: 3;
	width: 100%;
}
.service-header .service-icon .icon {
	width: 60px;
	position: relative;
	float: right;
	line-height: 60px;
	height: 60px;
	text-align: center;
}
.service-header .service-icon .icon i {
	font-size: 18px;
	color: #FFFFFF;
}
.service-header .service-icon h4 {
	float: right;
	line-height: 60px;
	margin: 0;
	padding: 0 15px;
	color: #222222;
}
.service-header .service-icon h4.active {
	color: white;
}
.service-body {
	padding: 20px;
	color: #3c3c3c;
	overflow: hidden;
}
.service-header .header-bg {
	background: #a71e2b;
}
/* Box */
.sticky {
	background-color: rgba(0,0,0,.4);
	color: #FFF;
	padding: .15em .25em;
	position: absolute;
	top: 10px;
	right: 0;
	z-index: 1;
}

.box-article-list {
    background-color:rgba(255,255,255,.5);
	padding: .5em .5em 0;
	border-bottom: solid 1px rgba(128,128,128,.1);
	margin: 5px 0;
}
.box-excerpt {
	position: relative;
	overflow: hidden;
	text-align: justify;
	padding: .5em;
	min-height: 7em;
}
.box-excerpt span {
	text-align:start;
	padding: .5em;
}

.box-excerpt img {
	display: block;	float: right;	width: auto;    height: 180px;
	margin: 0 0 .5em .5em;
	background: #FFF;
	-webkit-transition: all .2s linear;
	-moz-transition: all .2s linear;
	-o-transition: all .2s linear;
	transition: all .2s linear;
}
.box-excerpt img:hover {
	-webkit-transform: scale(.9,.9);
	-moz-transform: scale(.9,.9);
	-o-transform: scale(.9,.9);
	-ms-transform: scale(.9,.9);
	transform: scale(.9,.9);
}
.box-excerpt .box-excerpt-info{
	position: absolute;
	bottom: .5em;
	left: .5em;
	font-size: smaller;
	text-align:center;
	display:block;
}
.box-excerpt .box-excerpt-info li {
	display:block;
	line-height: inherit;
}
.box-excerpt .box-excerpt-info span {
	padding: 0 .25em;
}
.box {
	position: relative;
	background-color: #FFFFFF;
	border:1px rgba(0,0,0,0.15) solid;
	padding: 0;
}
.box a {
	position: relative;
}
.box.feature {
	background-color: rgba(255,255,255,0.75);
}
	.box.feature a.image {
		position: relative;
		top: 0;
		right: 0;
		min-height: 250px;
		overflow: hidden;
	}

		.box.feature a.image img {
			position: absolute;
			left: -1000%;
			right: -1000%;
			top: -1000%;
			bottom: -1000%;
			margin: auto;
			min-height: 100%;
			min-width: 100%;
		}
.box .inner {
	min-height:140px;
	padding: 0.5em;
	margin-top: .25em;
}
.box a span.mask-cat {
	display: block;
	position: absolute;
	bottom: 5px;
	right: 0;
	padding:5px;
	width: 100%;
	opacity: 0;
	color:#FFFFFF;
	background-color: rgba(0,0,0,.3);
	-webkit-transition: all .3s;
	-moz-transition: all .3s;
	-o-transition: all .3s;
	transition:all .3s
}
.box a:hover span.mask-cat, .box a:focus span.mask-cat{
	opacity: 1;
}
/* Spotlight */
.spotlight {
	background-color: rgba(255,255,255,.8);
	position: relative;
	-webkit-align-items: center;
	align-items: center;
	display: -webkit-flex;
	display: flex;
	padding: 10px;
	border-bottom: dotted 1px rgba(0,0,0,.2);
    box-shadow: 0 1px 0 rgba(255,255,255,.9);
}
.spotlight .image {
	position: relative;
	order: 1;
	border-radius: 0;
	width: 40%;
	max-height: 250px;
	overflow: hidden;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
.spotlight .image img {
	width: 100%;
	border-radius: 0;
	min-width: 250px;
    margin-top: -25px;
    }

.spotlight .content {
	padding: .5em 1em;
	order: 2;
	max-width: 48em;
	width: 60%;
}
.spotlight.in .content {
	max-width: 100% !important;
	width: 100% !important;
}
.spotlight.in .content .detail{
	text-align: start;
}

.spotlight .content h2 {
	text-align: start;
}
.spotlight:after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	position: absolute;
	left: 40%;
	top: 50%;
	border-bottom: 10px solid transparent;
	border-right: 10px solid rgba(255,255,255,1);
	border-top: 10px solid transparent;
	margin: -10px 0 0 -10px;
	z-index: 1;
}
.spotlight:last-child {
	margin-bottom: .25em;
}
.spotlight:nth-child(even):after{-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg);margin:-10px 0 0;left:60%}
.spotlight:nth-child(odd){-webkit-flex-direction:row-reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse;background-color:rgba(255,255,255,.5)}
.spotlight .time-view {
	left: .5em;
}
.spotlight:nth-child(odd) .time-view{left:41%}
.spotlight.in:nth-child(odd) .time-view{left:0}

@media screen and (max-width:1280px){
.spotlight .image {
	width: 45%;
}
.spotlight .content {
	width: 55%;
	min-height: 9em;
}
}
@media screen and (max-width:980px){
.spotlight {
	display: block;
}
.spotlight br {
	display: none;
}
.spotlight .image {
	width: 100%;
	max-height: none;
}
.spotlight .content {
	max-width: none;
	width: 100%;
}
.spotlight .time-view {
	left: .5em!important;
}
}
@media screen and (max-width:736px){
.spotlight:after {
	display: none;
}
.box-article-list {
    padding: 0;
}    
.box-excerpt img {
	display: block;
	float: none;
	width:100%;
}

.box-excerpt .box-excerpt-info {
    position: relative;
bottom: auto;
    left: auto;
    }
}

@media screen and (max-width:480px){
.spotlight .time-view {
	width: 100%;
	text-align: center;
}
}
/* Mask */
.mask-a, .mask-i, .mask-v{
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -1em;
	margin-left: -1em;
	font-size: 2em;
	width: 2em;
	height: 2em;
	text-align: center;
	cursor: pointer;
	opacity: 1;
	background-color: rgba(0,0,0,.3);
	border: .1em solid rgba(255,255,255,.4);
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	-webkit-transition: all .2s;
	-moz-transition: all .2s;
	-o-transition: all .2s;
	transition:all .2s
}
.mask-a:hover, .mask-i:focus, .mask-i:hover, .mask-v:focus, .mask-v:hover{
	outline: 0;
	background-color: rgba(0,0,0,.5);
	border-color: rgba(255,255,255,.6);
}
.mask-a:before, .mask-i:before, .mask-v:before {
	font-family: FontAwesome;
	line-height: 1.85em;
	color: rgba(255,255,255,.8);
	margin-left: 0.15em;
	position: absolute;
	left: 0;
	width: 100%;
	height: 100%;
}
.mask-v:before {
	content: '\f04b';
}
.mask-a:before {
	content: '\f025';
}
.mask-i:before {
	content: '\f03e';
}
.mask-small{
	font-size: 1em!important;
}

/*********************************************************************************/
/* More & Time View                                                                         */
/*********************************************************************************/
.news-more {
	margin:0 auto;
	width: 100%;
	text-align: center;
	overflow: hidden;
	padding:0;
}
.news-more, .news-more > ul{
    position: relative;
	font-size: initial;
}
.news-more > ul {
	line-height: 0;
	display: inline-block;
	margin:1.5em auto 0 auto;
	height: 24px;
	border-left: inset 1px rgba(0,0,0,.3);
	border-right: inset 1px rgba(0,0,0,.3);
}
.news-more > ul:after, .news-more > ul:before {
	content: '';
	display: block;
	width: 150%;
	position: absolute;
	top: 50%;
	margin-top: -2px;
	height: 5px;
	border-top: rgba(0,0,0,.3) solid 1px;
	border-bottom: rgba(0,0,0,.3) solid 1px;
}
.news-more > ul:before {
	left: 100%;
	margin-left: 1px;
}
.news-more > ul:after {
	right: 100%;
	margin-right: 1px;
}
.news-more > ul > li {
	display: inline-block;
	margin: -0.12em 0.5em;
	padding: 0.80em 0.25em;
	border: 1px solid transparent;
}
.news-more > ul > li, .news-more > ul > li a {
	font-size: initial;
}

.time-view {
	position: absolute;
    bottom: .5em;
    left: .5em;
    font-size: smaller;
    text-align: center;
    display: block;
}
.time-view li {
	display: block;
	line-height: inherit;
}
.time-view li a{
    font-size: smaller;
}

.news-title {
	overflow: hidden;
	text-align: center;
	margin: 1em auto;
}
.news-title h2{
	display: inline-block;
	padding: 0 15px;
	position: relative;
	font-size: larger;
	text-shadow: 0 3px 3px rgba(0,0,0,.4);
}
.news-title h2:after, .news-title h2:before{
	background: rgba(0,0,0,.5);
	content: "";
	display: block;
	height: 1px;
	position: absolute;
	top: 50%;
	width: 400%;
	box-shadow: 0 1px 0 rgba(255,255,255,.9);
}
.news-title h2:before{
	right: 100%;
}
.news-title h2:after {
	left: 100%;
}

/*********************************************************************************/
/* Main Menu                                                                      */
/*********************************************************************************/
.bt-menu{
	-webkit-backface-visibility: hidden;
}
.bt-menu {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 0;
	border-width: 0;
	border-style: solid;
	border-color: rgba(0,0,0,.7);
	background-color: rgba(0,0,0,0);
	-webkit-transition: border-width .2s,background-color .2s,height 0 .2s;
	transition: border-width .2s,background-color .2s,height 0 .2s;
}
.bt-menu.bt-menu-open {
	position: fixed;
	z-index: 999999;
	height: 100vh;
	border-width: 0 280px 0 0;
	background-color: rgba(0,0,0,.5);
	-webkit-transition: border-width .2s,background-color .2s;
	transition: border-width .2s,background-color .2s;
}
.bt-overlay {
	position: absolute;
	width: 100%;
}
.bt-menu-open .bt-overlay {
	height: 100vh;
}
.bt-menu-trigger {
	position: fixed;
    top: 35px;
    right: 15px;
    display: block;
	width: 50px;
	height: 40px;
	cursor: pointer;
	z-index: 99999;
	background-color: rgba(0,0,0,.5);
	text-align: center;
}
.bt-menu-trigger span.bt-icon {
	position: absolute;
	top: 50%;
	left: auto;
	right: 5px;
	display: block;
	width: 40px;
	height: 4px;
	margin-top: -2px;
	background-color: #fff;
	font-size: 0;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-transition: background-color .2s;
	transition: background-color .2s;
}
.bt-menu-open .bt-menu-trigger span.bt-icon {
	background-color: transparent;
}
.bt-menu-trigger span.bt-icon:after, .bt-menu-trigger span.bt-icon:before {
	position: absolute;
	right: auto;
	left: 0;
	width: 40px;
	height: 100%;
	background: #fff;
	content: '';
	-webkit-transition: -webkit-transform .2s;
	transition: transform .2s;
}
.bt-menu-trigger span.bt-icon:before {
	-webkit-transform: translateY(-250%);
	transform: translateY(-250%);
}
.bt-menu-trigger span.bt-icon:after {
	-webkit-transform: translateY(250%);
	transform: translateY(250%);
}
.bt-menu-open .bt-menu-trigger span.bt-icon:before {
	-webkit-transform: translateY(0) rotate(45deg);
	transform: translateY(0) rotate(45deg);
}
.bt-menu-open .bt-menu-trigger span.bt-icon:after {
	-webkit-transform: translateY(0) rotate(-45deg);
	transform: translateY(0) rotate(-45deg);
}
.bt-menu nav {
	position: fixed;
	margin: 0;
	padding: 0;
	list-style: none;
}
.bt-menu nav {
	top: 110px;
	right: 0;
}
.bt-menu nav ul {
	visibility: hidden;
	opacity: 0;
	-webkit-transition: -webkit-transform .2s,opacity .2s,visibility 0 .2s;
	transition: transform .2s,opacity .2s,visibility 0 .2s;
}
.bt-menu.bt-menu-open nav ul {visibility:visible;opacity:1;-webkit-transition:-webkit-transform .2s,opacity .2s .1s;transition:transform .2s,opacity .2s}
.bt-menu nav ul {
	width: 280px;
	height: 100vh;
	-webkit-transform: translate3d(100%,50%,0);
	transform: translate3d(100%,50%,0);
}
.bt-menu.bt-menu-open nav ul {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

#cssmenu, #cssmenu ul, #cssmenu ul li, #cssmenu ul li a {
	margin: 0;
	padding: 0;
	border: 0;
	display: none;
	list-style: none;
}
.bt-menu.bt-menu-open #cssmenu, #cssmenu ul, #cssmenu ul li, #cssmenu ul li a{
	display: block;
}

#cssmenu ul ul {
	display: none;
	height:auto;
}
#cssmenu > ul > li > a {
	border-top: 1px solid rgba(255,255,255,.1);
	color: rgba(255,255,255,.8);
	margin: 0 5px;
	padding: 5px;
	cursor: pointer;
	-moz-transition: background .25s ease-in-out,color .25s ease-in-out,border-color .25s ease-in-out;
	-webkit-transition: background .25s ease-in-out,color .25s ease-in-out,border-color .25s ease-in-out;
	-o-transition: background .25s ease-in-out,color .25s ease-in-out,border-color .25s ease-in-out;
	transition: background .25s ease-in-out,color .25s ease-in-out,border-color .25s ease-in-out;
}
#cssmenu ul ul li a {
	background-color: rgba(0,0,0,.3);
	border-top: 1px solid rgba(255,255,255,.1);
	color: #fecb78;
	margin: 0 5px;
	padding: 5px;
	cursor: pointer;
}
#cssmenu > ul > li > a:hover,#cssmenu ul ul li a:hover,#cssmenu ul ul ul li a:hover {
	color: #FFFFFF;
}
#cssmenu ul ul li:first-child > a {
	border: none;
}
#cssmenu ul ul ul li:first-child > a {
	border-top: 1px solid rgba(255,255,255,.1);
	color: #fecb78;
}
.holder {
	width: 0;
	height: 0;
	position: absolute;
	top: 0;
	left: 0;
}
#cssmenu > ul ul > li.has-sub > a::before, #cssmenu > ul > li.has-sub > a::before {
	display: block;
	position: relative;
	content: '\f067';
	font-family: FontAwesome;
	color: #fecb78;
	float: left;
}
#cssmenu > ul ul > li.open > a::before, #cssmenu > ul > li.open > a::before {
	display: block;
	position: relative;
	content: '\f068';
	font-family: FontAwesome;
	color: #fecb78;
	float: left;
}
/*********************************************************************************/
/* Footer                                                                        */
/*********************************************************************************/

#footer {
	padding: .5em;
	z-index: 2;
}
#footer,#footer a,#footer nav.news-more h1 {
	color: inherit;
}
.copyright {
	text-align:center;
	margin:2em auto;
	color:rgba(255,255,255,.8);
}

/*********************************************************************************/
/* Date - Time                                                                   */
/*********************************************************************************/
.service-list {
    font-family: Noto Kufi Arabic;
    font-weight:500;
	padding: 0.50em;
	margin: 0 auto;
    min-height: 27em;
	text-align: center;
}
#praytime ul li {
    padding: .5em;
}

.service-list .headtitle {
	display: block;
	padding: 0.25em;
	margin-bottom: 1em;
	height: 60px;
	border: 1px solid rgba(0,0,0,0.2);
}
#praytime .headtitle > strong {
	display: block;
}
.contant-doaa{
	text-align:justify;
	line-height:2em;
	padding: 0 0.5em;
	color:#156459;
	font-family: 'Amiri', sans-serif;
}
.tickerclass {
	display:inline-block;
	line-height:2em;
	padding: 0 0.5em;
	font-size: larger;
}

.tickerclass .tickerclass-detail{
display: block;
text-align:right;
}
.tickerclass .tickerclass-sub{
	float: left;
	padding: 0.50em;
	color:green; 
	font-family: 'Aref Ruqaa', serif;
}

/* Tabs */
.tab {
  overflow: hidden;
}
.tab button {
	background-color:  transparent;
    font-family:inherit;
	font-size: inherit;
    font-weight: inherit;
	height: 60px;
	  padding:0 1.5em;
	  float: right;
	  border: none;
	  outline: none;
	  cursor: pointer;
	  transition: 0.3s;
}
.tab button.active{
	background-color: rgba(0,0,0,0.3);
}
.tabcontent {
  display: none;
  padding: 0.25em 0;
  border-top: none;
  min-height:20em;
  animation: fadeEffect 1s;
}
.tabcontent .headtitle{
	height: auto;
}
@keyframes fadeEffect {
  from {opacity: 0;}
  to {opacity: 1;}
}
@media screen and (max-width:736px){
.tab button {
	font-size: 90%;
	  padding:0 1em;
}
}

/*********************************************************************************/
/* Navbar - Paging                                                                   */
/*********************************************************************************/
ul.pagination {
	width: 100%;
	margin: 1em auto;
	padding: 1em 0;
	border-top: 2px solid rgba(0,0,0,.4);
	text-align: center;
}
ul.pagination li.dot {
	padding: 0 5px;
}
ul.pagination li.details {
	font-weight: 400;
}
ul.pagination li {
	display: inline-block;
	margin-bottom: .5em;
	padding: 0 0.25em;
}
ul.pagination li a {
	-moz-border-radius: .5em;
	-webkit-border-radius: .5em;
	border-radius: .5em;
	background-color: transparent;
	padding: 0 .75em;
	border: 2px solid rgba(0,0,0,.4);
	-webkit-transition: all .35s ease-in-out;
	-moz-transition: all .35s ease-in-out;
	transition: all .35s ease-in-out;
}
ul.pagination li a:hover, ul.pagination li a.current {
	border: 2px solid rgba(255,255,255,.4);
}
@media screen and (max-width:736px){
ul.pagination li.details {
	width: 100%;
}
ul.pagination li {
	margin-bottom: 1.25em;
}
}
@media screen and (max-width:480px){
ul.pagination li.details {
	width: 100%;
}
ul.pagination li {
	margin-bottom: 1.25em;
}
}
.navbar {
	padding: .5em 0;
	border-bottom: 2px rgba(0,0,0,.4) solid;
	width: 100%;
	margin: .5em auto;
}
.navbar a:after {
	font-family:FontAwesome;
	content: '\f104';
	margin: 0 5px;
}
.navbar a.current:last-child:after {
	content: '';
}
.navbar, .navbar .current, .paging, .paging a {
	display: inline-block;
}
.current{
	font-weight:600;
	font-size: initial;
}

.view_sharing_toolbox {
	position:  relative;
	text-align:center;
}