@charset "UTF-8";
/* http://meyerweb.com/eric/tools/css/reset/
   v2.0-modified | 20110126
   License: none (public domain)
*/
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;
}

/* make sure to set some focus styles for accessibility */
:focus {
  outline: 0;
}

/* HTML5 display-role reset for older browsers */
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;
}

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {
  -webkit-appearance: none;
  -moz-appearance: none;
}

input[type=search] {
  -webkit-appearance: none;
  -moz-appearance: none;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}

textarea {
  overflow: auto;
  vertical-align: top;
  resize: vertical;
}

/**
 * Correct `inline-block` display not defined in IE 6/7/8/9 and Firefox 3.
 */
audio,
canvas,
video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  max-width: 100%;
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Address styling not present in IE 7/8/9, Firefox 3, and Safari 4.
 * Known issue: no IE 6 support.
 */
[hidden] {
  display: none;
}

/**
 * 1. Correct text resizing oddly in IE 6/7 when body `font-size` is set using
 *    `em` units.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
html {
  font-size: 100%;
  /* 1 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
  -ms-text-size-adjust: 100%;
  /* 2 */
}

/**
 * Address `outline` inconsistency between Chrome and other browsers.
 */
a:focus {
  outline: thin dotted;
}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
  outline: 0;
}

/**
 * 1. Remove border when inside `a` element in IE 6/7/8/9 and Firefox 3.
 * 2. Improve image quality when scaled in IE 7.
 */
img {
  border: 0;
  /* 1 */
  -ms-interpolation-mode: bicubic;
  /* 2 */
}

/**
 * Address margin not present in IE 6/7/8/9, Safari 5, and Opera 11.
 */
figure {
  margin: 0;
}

/**
 * Correct margin displayed oddly in IE 6/7.
 */
form {
  margin: 0;
}

/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct color not being inherited in IE 6/7/8/9.
 * 2. Correct text not wrapping in Firefox 3.
 * 3. Correct alignment displayed oddly in IE 6/7.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  white-space: normal;
  /* 2 */
  *margin-left: -7px;
  /* 3 */
}

/**
 * 1. Correct font size not being inherited in all browsers.
 * 2. Address margins set differently in IE 6/7, Firefox 3+, Safari 5,
 *    and Chrome.
 * 3. Improve appearance and consistency in all browsers.
 */
button,
input,
select,
textarea {
  font-size: 100%;
  /* 1 */
  margin: 0;
  /* 2 */
  vertical-align: baseline;
  /* 3 */
  *vertical-align: middle;
  /* 3 */
}

/**
 * Address Firefox 3+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
button,
input {
  line-height: normal;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Chrome, Safari 5+, and IE 6+.
 * Correct `select` style inheritance in Firefox 4+ and Opera.
 */
button,
select {
  text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 * 4. Remove inner spacing in IE 7 without affecting normal text inputs.
 *    Known issue: inner spacing remains in IE 6.
 */
button,
html input[type=button],
input[type=reset],
input[type=submit] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */
  *overflow: visible;
  /* 4 */
}

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default;
}

/**
 * 1. Address box sizing set to content-box in IE 8/9.
 * 2. Remove excess padding in IE 8/9.
 * 3. Remove excess padding in IE 7.
 *    Known issue: excess padding remains in IE 6.
 */
input[type=checkbox],
input[type=radio] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
  *height: 13px;
  /* 3 */
  *width: 13px;
  /* 3 */
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof).
 */
input[type=search] {
  -webkit-appearance: textfield;
  /* 1 */
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  /* 2 */
  box-sizing: content-box;
}

/**
 * Remove inner padding and search cancel button in Safari 5 and Chrome
 * on OS X.
 */
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Remove inner padding and border in Firefox 3+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/**
 * 1. Remove default vertical scrollbar in IE 6/7/8/9.
 * 2. Improve readability and alignment in all browsers.
 */
textarea {
  overflow: auto;
  /* 1 */
  vertical-align: top;
  /* 2 */
}

/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

html,
button,
input,
select,
textarea {
  color: #222;
}

::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

img {
  vertical-align: middle;
}

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

textarea {
  resize: vertical;
}

.chromeframe {
  margin: 0.2em 0;
  background: #ccc;
  color: #000;
  padding: 0.2em 0;
}

/* Comments */
.dsq-widget-list {
  display: none;
}

.dsq-widget-item {
  line-height: 1.2em;
  display: block;
}

.dsq-widget-user {
  margin-bottom: 10px;
  display: block;
}

.dsq-widget-meta a:nth-child(2) {
  direction: ltr;
  display: inline-block;
}

@font-face {
  font-family: "_PDMS_Saleem_QuranFont";
  src: url("../fonts/pdms_saleem_quranfont-signed.eot");
  src: url("../fonts/pdms_saleem_quranfont-signed.eot?#iefix") format("embedded-opentype"), url("../fonts/pdms_saleem_quranfont-signed.woff") format("woff"), url("../fonts/pdms_saleem_quranfont-signed.ttf") format("truetype"), url("../fonts/pdms_saleem_quranfont-signed.svg#pdms_saleem_quranfont-signed") format("svg");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: "Scheherazade";
  font-style: normal;
  font-weight: 400;
  src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/scheherazade/v2/ScheherazadeRegOT.eot);
  src: url(//themes.googleusercontent.com/static/fonts/earlyaccess/scheherazade/v2/ScheherazadeRegOT.eot?#iefix) format("embedded-opentype"), url(//themes.googleusercontent.com/static/fonts/earlyaccess/scheherazade/v2/ScheherazadeRegOT.woff2) format("woff2"), url(//themes.googleusercontent.com/static/fonts/earlyaccess/scheherazade/v2/ScheherazadeRegOT.woff) format("woff"), url(//themes.googleusercontent.com/static/fonts/earlyaccess/scheherazade/v2/ScheherazadeRegOT.ttf) format("truetype");
}
@font-face {
  font-family: "fahmfont";
  src: url("../fonts/fahmfont.eot?6922433");
  src: url("../fonts/fahmfont.eot?6922433#iefix") format("embedded-opentype"), url("../fonts/fahmfont.woff?6922433") format("woff"), url("../fonts/fahmfont.ttf?6922433") format("truetype"), url("../fonts/fahmfont.svg?6922433#fahmfont") format("svg");
  font-weight: normal;
  font-style: normal;
}
[class^=icon-]:before,
[class*=" icon-"]:before {
  font-family: "fahmfont";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: 0.2em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  margin-left: 0.2em;
}

.icon-ok:before {
  content: "";
}

.icon-print:before {
  content: "";
}

.icon-print-1:before {
  content: "";
}

.icon-left-open:before {
  content: "";
}

.icon-docs:before {
  content: "";
}

.icon-comment-empty:before {
  content: "";
}

.icon-doc-text:before {
  content: "";
}

.icon-angle-left:before {
  content: "";
}

.icon-folder-empty:before {
  content: "";
}

.icon-folder-open-empty:before {
  content: "";
}

.icon-plus-squared-small:before {
  content: "";
}

.icon-minus-squared-small:before {
  content: "";
}

.icon-thumbs-up:before {
  content: "";
}

.icon-floppy:before {
  content: "";
}

.icon-folder:before {
  content: "";
}

.icon-folder-open:before {
  content: "";
}

.icon-doc:before {
  content: "";
}

.icon-download:before {
  content: "";
}

.icon-volume-off:before {
  content: "";
}

.icon-volume-down:before {
  content: "";
}

.icon-volume-up:before {
  content: "";
}

.icon-link:before {
  content: "";
}

/*!
 * qTip2 - Pretty powerful tooltips - v2.0.1
 * http://qtip2.com
 *
 * Copyright (c) 2012 Craig Michael Thompson
 * Released under the MIT, GPL licenses
 * http://jquery.org/license
 *
 * Date: Mon Dec 31 2012 02:55 GMT+0000
 * Plugins: svg ajax tips modal viewport imagemap ie6
 * Styles: basic css3
 */
/* Core qTip styles */
.qtip, .qtip {
  position: absolute;
  left: -28000px;
  top: -28000px;
  display: none;
  max-width: 280px;
  min-width: 50px;
  font-size: 1em;
  line-height: 1em;
  direction: ltr;
}

.qtip-content {
  position: relative;
  padding: 5px 9px;
  overflow: hidden;
  text-align: right;
  direction: ltr;
  word-wrap: break-word;
}

.qtip-titlebar {
  position: relative;
  padding: 5px 35px 5px 10px;
  overflow: hidden;
  border-width: 0 0 1px;
  font-weight: bold;
}

.qtip-titlebar + .qtip-content {
  border-top-width: 0 !important;
}

/* Default close button class */
.qtip-close {
  position: absolute;
  right: -9px;
  top: -9px;
  cursor: pointer;
  outline: medium none;
  border-width: 1px;
  border-style: solid;
  border-color: transparent;
}

.qtip-titlebar .qtip-close {
  right: 4px;
  top: 50%;
  margin-top: -9px;
}

* html .qtip-titlebar .qtip-close {
  top: 16px;
}

/* IE fix */
.qtip-titlebar .ui-icon,
.qtip-icon .ui-icon {
  display: block;
  text-indent: -1000em;
  direction: ltr;
  vertical-align: middle;
}

.qtip-icon, .qtip-icon .ui-icon {
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  text-decoration: none;
}

.qtip-icon .ui-icon {
  width: 18px;
  height: 14px;
  text-align: center;
  text-indent: 0;
  font: normal bold 10px/13px Tahoma, sans-serif;
  color: inherit;
  background: transparent none no-repeat -100em -100em;
}

/* Applied to 'focused' tooltips e.g. most recently displayed/interacted with */
/* Applied on hover of tooltips i.e. added/removed on mouseenter/mouseleave respectively */
/* Default tooltip style */
.qtip-default {
  border-width: 1px;
  border-style: solid;
  border-color: #F1D031;
  background-color: #FFFFA3;
  color: #555;
}

.qtip-default .qtip-titlebar {
  background-color: #FFEF93;
}

.qtip-default .qtip-icon {
  border-color: #CCC;
  background: #F1F1F1;
  color: #777;
}

.qtip-default .qtip-titlebar .qtip-close {
  border-color: #AAA;
  color: #111;
}

/*! Light tooltip style */
.qtip-light {
  background-color: white;
  border-color: #E2E2E2;
  color: #454545;
}

.qtip-light .qtip-titlebar {
  background-color: #f1f1f1;
}

/*! Dark tooltip style */
.qtip-dark {
  background-color: #505050;
  border-color: #303030;
  color: #f3f3f3;
  font-size: 1.3em;
}

.qtip-dark .qtip-titlebar {
  background-color: #404040;
}

.qtip-dark .qtip-icon {
  border-color: #444;
}

.qtip-dark .qtip-titlebar .ui-state-hover {
  border-color: #303030;
}

.qtip-fahm, .qtip-fahm2 {
  background-color: #32405a;
  border-color: #303030;
  color: #fff;
  font-size: 1.5em;
  text-align: right !important;
  direction: ltr !important;
  font-family: "Traditional Arabic", Arial;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.4);
}

.qtip-dark .qtip-titlebar {
  background-color: #404040;
}

.qtip-dark .qtip-icon {
  border-color: #444;
}

.qtip-dark .qtip-titlebar .ui-state-hover {
  border-color: #303030;
}

.qtip-fahm2 {
  background-color: #dccda2;
  color: #32405a;
  font-family: "Traditional Arabic", Arial;
  border-color: #78611e;
}

/*! Cream tooltip style */
.qtip-cream {
  background-color: #FBF7AA;
  border-color: #F9E98E;
  color: #A27D35;
}

.qtip-cream .qtip-titlebar {
  background-color: #F0DE7D;
}

.qtip-cream .qtip-close .qtip-icon {
  background-position: -82px 0;
}

/*! Red tooltip style */
.qtip-red {
  background-color: #F78B83;
  border-color: #D95252;
  color: #912323;
}

.qtip-red .qtip-titlebar {
  background-color: #F06D65;
}

.qtip-red .qtip-close .qtip-icon {
  background-position: -102px 0;
}

.qtip-red .qtip-icon {
  border-color: #D95252;
}

.qtip-red .qtip-titlebar .ui-state-hover {
  border-color: #D95252;
}

/*! Green tooltip style */
.qtip-green {
  background-color: #CAED9E;
  border-color: #90D93F;
  color: #3F6219;
}

.qtip-green .qtip-titlebar {
  background-color: #B0DE78;
}

.qtip-green .qtip-close .qtip-icon {
  background-position: -42px 0;
}

/*! Blue tooltip style */
.qtip-blue {
  background-color: #E5F6FE;
  border-color: #ADD9ED;
  color: #5E99BD;
}

.qtip-blue .qtip-titlebar {
  background-color: #D0E9F5;
}

.qtip-blue .qtip-close .qtip-icon {
  background-position: -2px 0;
}

/* Add shadows to your tooltips in: FF3+, Chrome 2+, Opera 10.6+, IE9+, Safari 2+ */
.qtip-shadow {
  -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
  box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
}

/* Add rounded corners to your tooltips in: FF3+, Chrome 2+, Opera 10.6+, IE9+, Safari 2+ */
.qtip-rounded,
.qtip-tipsy,
.qtip-bootstrap {
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

/* Youtube tooltip style */
.qtip-youtube {
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  -webkit-box-shadow: 0 0 3px #333;
  -moz-box-shadow: 0 0 3px #333;
  box-shadow: 0 0 3px #333;
  color: white;
  border-width: 0;
  background: #4A4A4A;
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #4A4A4A), color-stop(100%, black));
  background-image: -webkit-linear-gradient(top, #4A4A4A 0, black 100%);
  background-image: -moz-linear-gradient(top, #4A4A4A 0, black 100%);
  background-image: -ms-linear-gradient(top, #4A4A4A 0, black 100%);
  background-image: -o-linear-gradient(top, #4A4A4A 0, black 100%);
}

.qtip-youtube .qtip-titlebar {
  background-color: #4A4A4A;
  background-color: rgba(0, 0, 0, 0);
}

.qtip-youtube .qtip-content {
  padding: 0.75em;
  font: 12px arial, sans-serif;
  filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#4a4a4a,EndColorStr=#000000);
  -ms-filter: "progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#4a4a4a,EndColorStr=#000000);";
}

.qtip-youtube .qtip-icon {
  border-color: #222;
}

.qtip-youtube .qtip-titlebar .ui-state-hover {
  border-color: #303030;
}

/* jQuery TOOLS Tooltip style */
.qtip-jtools {
  background: #232323;
  background: rgba(0, 0, 0, 0.7);
  background-image: -webkit-gradient(linear, left top, left bottom, from(#717171), to(#232323));
  background-image: -moz-linear-gradient(top, #717171, #232323);
  background-image: -webkit-linear-gradient(top, #717171, #232323);
  background-image: -ms-linear-gradient(top, #717171, #232323);
  background-image: -o-linear-gradient(top, #717171, #232323);
  border: 2px solid #ddd;
  border: 2px solid rgba(241, 241, 241, 1);
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  -webkit-box-shadow: 0 0 12px #333;
  -moz-box-shadow: 0 0 12px #333;
  box-shadow: 0 0 12px #333;
}

/* IE Specific */
.qtip-jtools .qtip-titlebar {
  background-color: transparent;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#717171,endColorstr=#4A4A4A);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#717171,endColorstr=#4A4A4A)";
}

.qtip-jtools .qtip-content {
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#4A4A4A,endColorstr=#232323);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#4A4A4A,endColorstr=#232323)";
}

.qtip-jtools .qtip-titlebar,
.qtip-jtools .qtip-content {
  background: transparent;
  color: white;
  border: 0 dashed transparent;
}

.qtip-jtools .qtip-icon {
  border-color: #555;
}

.qtip-jtools .qtip-titlebar .ui-state-hover {
  border-color: #333;
}

/* Cluetip style */
.qtip-cluetip {
  -webkit-box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);
  box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);
  background-color: #D9D9C2;
  color: #111;
  border: 0 dashed transparent;
}

.qtip-cluetip .qtip-titlebar {
  background-color: #87876A;
  color: white;
  border: 0 dashed transparent;
}

.qtip-cluetip .qtip-icon {
  border-color: #808064;
}

.qtip-cluetip .qtip-titlebar .ui-state-hover {
  border-color: #696952;
  color: #696952;
}

/* Tipsy style */
.qtip-tipsy {
  background: black;
  background: rgba(0, 0, 0, 0.87);
  color: white;
  border: 0 solid transparent;
  font-size: 11px;
  font-family: "Lucida Grande", sans-serif;
  font-weight: bold;
  line-height: 16px;
  text-shadow: 0 1px black;
}

.qtip-tipsy .qtip-titlebar {
  padding: 6px 35px 0 10;
  background-color: transparent;
}

.qtip-tipsy .qtip-content {
  padding: 6px 10;
}

.qtip-tipsy .qtip-icon {
  border-color: #222;
  text-shadow: none;
}

.qtip-tipsy .qtip-titlebar .ui-state-hover {
  border-color: #303030;
}

/* Tipped style */
.qtip-tipped {
  border: 3px solid #959FA9;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  background-color: #F9F9F9;
  color: #454545;
  font-weight: normal;
  font-family: serif;
}

.qtip-tipped .qtip-titlebar {
  border-bottom-width: 0;
  color: white;
  background: #3A79B8;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#3A79B8), to(#2E629D));
  background-image: -webkit-linear-gradient(top, #3A79B8, #2E629D);
  background-image: -moz-linear-gradient(top, #3A79B8, #2E629D);
  background-image: -ms-linear-gradient(top, #3A79B8, #2E629D);
  background-image: -o-linear-gradient(top, #3A79B8, #2E629D);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#3A79B8,endColorstr=#2E629D);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#3A79B8,endColorstr=#2E629D)";
}

.qtip-tipped .qtip-icon {
  border: 2px solid #285589;
  background: #285589;
}

.qtip-tipped .qtip-icon .ui-icon {
  background-color: #FBFBFB;
  color: #555;
}

/**
 * Twitter Bootstrap style.
 *
 * Tested with IE 8, IE 9, Chrome 18, Firefox 9, Opera 11.
 * Does not work with IE 7.
 */
.qtip-bootstrap {
  /** Taken from Bootstrap body */
  font-size: 14px;
  line-height: 20px;
  color: #333333;
  /** Taken from Bootstrap .popover */
  padding: 1px;
  background-color: #ffffff;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
}

.qtip-bootstrap .qtip-titlebar {
  /** Taken from Bootstrap .popover-title */
  padding: 8px 14px;
  margin: 0;
  font-size: 14px;
  font-weight: normal;
  line-height: 18px;
  background-color: #f7f7f7;
  border-bottom: 1px solid #ebebeb;
  -webkit-border-radius: 5px 5px 0 0;
  -moz-border-radius: 5px 5px 0 0;
  border-radius: 5px 5px 0 0;
}

.qtip-bootstrap .qtip-titlebar .qtip-close {
  /**
   * Overrides qTip2:
   * .qtip-titlebar .qtip-close{
   *   [...]
   *   right: 4px;
   *   top: 50%;
   *   [...]
   *   border-style: solid;
   * }
   */
  right: 11px;
  top: 45%;
  border-style: none;
}

.qtip-bootstrap .qtip-content {
  /** Taken from Bootstrap .popover-content */
  padding: 9px 14px;
}

.qtip-bootstrap .qtip-icon {
  /**
   * Overrides qTip2:
   * .qtip-default .qtip-icon {
   *   border-color: #CCC;
   *   background: #F1F1F1;
   *   color: #777;
   * }
   */
  background: transparent;
}

.qtip-bootstrap .qtip-icon .ui-icon {
  /**
   * Overrides qTip2:
   * .qtip-icon .ui-icon{
   *   width: 18px;
   *   height: 14px;
   * }
   */
  width: auto;
  height: auto;
  /* Taken from Bootstrap .close */
  float: right;
  font-size: 20px;
  font-weight: bold;
  line-height: 18px;
  color: #000000;
  text-shadow: 0 1px 0 #ffffff;
  opacity: 0.2;
  filter: alpha(opacity=20);
}

.qtip-bootstrap .qtip-icon .ui-icon:hover {
  /* Taken from Bootstrap .close:hover */
  color: #000000;
  text-decoration: none;
  cursor: pointer;
  opacity: 0.4;
  filter: alpha(opacity=40);
}

/* IE9 fix - removes all filters */
.qtip:not(.ie9haxors) div.qtip-content,
.qtip:not(.ie9haxors) div.qtip-titlebar {
  filter: none;
  -ms-filter: none;
}

/* Tips plugin */
.qtip .qtip-tip {
  margin: 0 auto;
  overflow: hidden;
  z-index: 10;
}

.qtip .qtip-tip,
.qtip .qtip-tip .qtip-vml {
  position: absolute;
  color: #123456;
  background: transparent;
  border: 0 dashed transparent;
}

.qtip .qtip-tip canvas {
  top: 0;
  left: 0;
}

.qtip .qtip-tip .qtip-vml {
  behavior: url(#default#VML);
  display: inline-block;
  visibility: visible;
}

/* Modal plugin */
#qtip-overlay {
  position: fixed;
  left: -10000em;
  top: -10000em;
}

/* Applied to modals with show.modal.blur set to true */
#qtip-overlay.blurs {
  cursor: pointer;
}

/* Change opacity of overlay here */
#qtip-overlay div {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: black;
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
}

/* IE6 Modal plugin fix */
.qtipmodal-ie6fix {
  position: absolute !important;
}

body, html {
  height: 100%;
}

body {
  margin: 0;
  padding: 0;
  height: 100%;
  background: url(../img/topbg.jpg) top left no-repeat, #dae5e7;
  background-size: cover;
}

a {
  color: #206373;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

ul, ol {
  padding: 0 0px 0px 40px;
  margin: 0 25px 10px 0;
}

strong {
  font-weight: bold;
}

h1, h2, h3, h4, h5, h6 {
  margin: 10px 0;
  font-family: inherit;
  font-weight: bold;
  line-height: 1;
  color: inherit;
  text-rendering: optimizelegibility;
}

h3 {
  font-size: 24px;
  line-height: 40px;
}

header {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 0 auto;
  margin-bottom: 80px;
  text-align: center;
  position: relative;
  /** Menu title, preview on hover */
  /** END Menu title, preview on hover */
  /** Tiny navigation when in mobile */
  /** end tiny navigation when in mobile */
}
header .logo {
  margin: 30px auto;
}
header #nav {
  position: relative;
  width: 100%;
  height: 61px;
  display: block;
}
header #nav .left {
  background: none;
  position: absolute;
  top: 0px;
  left: 0px;
  width: 480px;
  height: 61px;
  transition: all 1s ease;
}
header #nav .middle {
  background: url(../img/nav_middle.png) repeat-x;
  width: auto;
  height: 61px;
  transition: all 1s ease;
}
header #nav .right {
  background: none;
  position: absolute;
  top: 0px;
  right: 0px;
  width: 480px;
  height: 61px;
  transition: all 1s ease;
}
header #nav ul.menu {
  margin: 0px;
  padding: 0px;
  background: transparent;
  width: 100%;
  height: 61px;
  top: 6px;
  position: absolute;
  left: 50%;
  margin-left: -50%;
  display: inline-block;
  z-index: 1;
  direction: ltr;
}
header #nav ul.menu li {
  display: inline-block;
  list-style-type: none;
  padding: 0px 1.8%;
  height: 38px;
  border-right: 2px dotted #3d7b7f;
  font-family: "_PDMS_Saleem_QuranFont", serif;
  word-spacing: 5px;
  text-shadow: 1px 1px 0px rgba(245, 241, 224, 0.3);
}
header #nav ul.menu li:first-child {
  padding-left: 0;
}
header #nav ul.menu li:last-child {
  border-right: 0px;
}
header #nav ul.menu h2 {
  font-weight: bold;
  text-shadow: 1px 1px 0px rgba(245, 241, 224, 0.3);
  font-size: 1.7vw;
  font-size: clamp(15px, 1.7vw, 26px);
  margin: 0px;
}
header #nav ul.menu a {
  text-decoration: none;
  vertical-align: top;
  color: #206373;
  height: 100%;
  display: inline-flex;
  align-items: center;
}
header #nav ul.menu a:hover {
  color: #013568;
}
header #menu-title {
  position: absolute;
  width: 80%;
  height: 25px;
  left: 50%;
  bottom: -30px;
  margin-left: -40%;
  text-align: center !important;
  line-height: 40px;
  direction: ltr;
}
header .menu-title {
  border: none !important;
  background: transparent !important;
  color: #f5f1e0;
  font-size: 1.7vw;
  font-size: clamp(25px, 1.7vw, 26px);
  max-width: none !important;
  min-width: none !important;
  font-family: "Traditional Arabic", Arial !important;
  text-shadow: 1px 1px 0 rgba(150, 150, 150, 0.45) !important;
}
header .tinynav {
  display: none;
}
@media (max-width: 888px) {
  header .tinynav {
    display: inline-block;
    top: 6px;
    position: absolute;
    left: 50%;
    width: 90%;
    margin-left: -45%;
    font-size: 1.2em;
    line-height: 1.2em;
    font-family: "Scheherazade", "Traditional Arabic", serif;
    font-weight: bold;
    background: #dae5e7;
    border-color: #565656;
    z-index: 1;
    height: 40px;
    text-align: center;
  }
  header .tinynav option {
    text-align: center;
    font-weight: bold;
  }
  header #nav .menu {
    display: none !important;
  }
  header .content {
    padding: 15px;
  }
}

/* Grid */
.row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
}

.column {
  display: flex;
  flex-direction: column;
  flex-basis: 100%;
  flex: 1;
}

.column-wrapper {
  display: flex;
  flex: 1;
  min-height: 40vh;
}

.columns {
  display: flex;
  flex: 1;
  flex-direction: column;
}

.content {
  flex: 1;
  order: 3;
}
.content .outerBox.column {
  flex: auto;
  margin: 20px;
}

.sidebar-left {
  order: 2;
}

.sidebar-right {
  order: 1;
}

/** End Grid */
/** Sidebar content */
.sidebar .wrapper {
  position: relative;
  width: 80%;
  height: 100%;
  margin: 0px auto;
}
.sidebar .left {
  position: absolute;
  top: 0px;
  left: 0px;
  background: url(../img/sidebar_left.png) no-repeat;
  height: 312px;
  width: 15px;
}
.sidebar .middleOuter, .sidebar .middle {
  position: relative;
  top: 0;
  left: 0;
  background: url(../img/sidebar_middle.png) repeat-x;
  height: 312px;
  width: auto;
  margin: 0px 15px;
}
.sidebar .middleOuter {
  background: none;
  width: 100%;
  margin: 0px;
  position: absolute;
  left: 0;
  top: 0;
}
.sidebar .right {
  position: absolute;
  top: 0px;
  right: 0px;
  background: url(../img/sidebar_right.png) no-repeat;
  height: 312px;
  width: 15px;
}
.sidebar .innerWrapper {
  position: relative;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
  z-index: 1;
}
.sidebar ul.menu {
  padding: 13px 0px;
  margin: 0;
  text-align: center;
}
.sidebar ul.menu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  text-align: center;
  font-family: "Scheherazade", "Traditional Arabic", serif;
  font-weight: 300;
}
.sidebar ul.menu a {
  display: block;
  text-decoration: none;
}
.sidebar ul.menu li {
  margin-top: 2px;
}
.sidebar ul.menu li a {
  min-height: 24px;
  font-family: "Scheherazade", "Traditional Arabic", serif;
  line-height: 1.7em;
  font-size: 1vw;
  font-size: clamp(20px, 1vw, 26px);
  color: #206373;
  font-weight: bold;
  margin-top: auto;
  margin-bottom: auto;
}
.sidebar ul.menu li a:hover {
  font-weight: bold;
  color: #013568;
}
.sidebar ul.menu li a.header {
  max-height: 40px;
  font-size: 1vw;
  font-size: clamp(20px, 1vw, 26px);
  text-align: center;
  line-height: 40px;
  font-family: "_PDMS_Saleem_QuranFont", serif;
  color: #206373;
  text-shadow: 0 0 1px rgba(255, 255, 255, 0.3);
  position: relative;
  left: -15px;
  border-radius: 5px;
  background: #a7c3ca url("../img/header.png") bottom repeat-x;
  background: -moz-linear-gradient(top, #A2C0C7 0, #9cbbc3 28%, #98b9c1 38%, #8eb2bb 51%, #8eb2bb 59%, #88aeb7 67%, #89afb8 74%, #81a9b3 87%, #83aab4 90%, #80a8b2 92%, #80a8b2 100%);
  background: -ms-linear-gradient(top, #A2C0C7 0, #9cbbc3 28%, #98b9c1 38%, #8eb2bb 51%, #8eb2bb 59%, #88aeb7 67%, #89afb8 74%, #81a9b3 87%, #83aab4 90%, #80a8b2 92%, #80a8b2 100%);
  background: linear-gradient(to bottom, #A2C0C7 0, #9cbbc3 28%, #98b9c1 38%, #8eb2bb 51%, #8eb2bb 59%, #88aeb7 67%, #89afb8 74%, #81a9b3 87%, #83aab4 90%, #80a8b2 92%, #80a8b2 100%);
  border: 1px solid #2d647b;
  border-bottom-left-radius: 0px;
  -webkit-box-shadow: 2px 2px 5px 0 rgba(1, 53, 104, 0.2);
  -moz-box-shadow: 2px 2px 5px 0 rgba(1, 53, 104, 0.2);
  box-shadow: 2px 2px 5px 0 rgba(1, 53, 104, 0.2);
}
.sidebar ul.menu li a.header .corner-left, .sidebar ul.menu li a.header .corner-right {
  background: url("../img/bottom-corner.png") no-repeat;
  height: 7px;
  position: absolute;
  width: 11px;
  left: 3px;
  bottom: -8px;
}
.sidebar ul.menu li a.header .corner-right {
  background: url("../img/bottom-corner-right.png") no-repeat;
  left: inherit;
  right: 3px;
}
.sidebar ul.menu li.active ul li.active a {
  font-weight: bold;
  color: #013568;
  border-right: 5px #206373 solid;
}
.sidebar ul.menu li ul li a {
  background: none;
  color: #206373;
  font-weight: bold;
  padding-bottom: 0px;
  padding-top: 0px;
  margin-top: auto;
  margin-bottom: auto;
  border-right: 5px transparent solid;
  -webkit-transition: background 1s ease-in;
  -moz-transition: background 1s ease-in;
  transition: background 1s ease-in;
}
.sidebar ul.menu li ul li:last-child a {
  padding-bottom: 5px;
}
.sidebar ul.menu li ul li a:hover {
  background-color: #206373;
  background-color: rgba(32, 99, 115, 0.1);
  border-right: 5px #206373 solid;
  -webkit-transition: background 1s ease-out;
  -moz-transition: background 1s ease-out;
  transition: background 1s ease-out;
  color: #013568;
  font-weight: bold;
  padding-bottom: 0px;
  padding-top: 0px;
}
.sidebar.right-sidebar a.header {
  left: inherit !important;
  right: -15px !important;
  border-bottom-left-radius: 5px !important;
  border-bottom-right-radius: 0px !important;
}
.sidebar.right-sidebar ul.menu li ul li.active a {
  font-weight: bold;
  color: #013568;
  border-left: 5px #206373 solid !important;
  border-right: 5px transparent solid;
  margin-left: 0px !important;
}
.sidebar.right-sidebar ul.menu li ul li a {
  border-left: 5px transparent solid;
}
.sidebar.right-sidebar ul.menu li ul li a:hover {
  border-left: 5px #206373 solid;
  border-right: 5px transparent solid;
  margin-left: 0px !important;
}

/** Main content */
main > .content {
  direction: ltr;
  font-size: 30px;
  line-height: 35px;
  font-family: "Scheherazade", "Traditional Arabic", serif;
  margin-bottom: 40px;
  padding: 20px;
}
main > .content h1 {
  font-family: "Scheherazade", "Traditional Arabic", serif;
  font-size: 40px;
  line-height: 45px;
  font-weight: bold;
  text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.3);
  color: #206373;
  margin-bottom: 50px;
}
main > .content .author {
  text-align: right;
  font-size: 0.9em;
  color: black;
  font-weight: bold;
}
main > .content .listing {
  border-bottom: 2px solid rgba(167, 195, 202, 0.25);
  color: rgba(32, 99, 115, 0.6);
  position: relative;
  text-align: left;
  direction: ltr;
  transition: all 0.6s ease-in;
}
main > .content .listing strong {
  margin-right: 5px;
}
main > .content .listing h2.listTitle {
  font-size: inherit;
  margin-left: 10px;
  font-weight: normal;
  margin-bottom: 0px;
  margin-top: 0px;
  padding: 2px 0px;
  width: 70%;
}
main > .content .listing h2.listTitle a:hover {
  text-decoration: none;
}
main > .content .listing .listDate {
  margin-right: 20px;
  display: inline-block;
  text-align: left;
}
main > .content .listing .listCounter {
  min-width: 100px;
  display: inline-block;
  text-align: left;
}
main > .content .listing .listDetails {
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 0.7em;
  line-height: 1em;
  direction: ltr;
  text-align: right;
}
main > .content .listing:hover {
  border-radius: 5px;
  background: rgba(167, 195, 202, 0.4);
  transition: all 0.6s ease-in;
}
main > .content p {
  margin: 0 0 30px;
}
main > .content [class^=icon-]:before,
main > .content [class*=" icon-"]:before {
  vertical-align: middle;
  color: rgba(32, 99, 115, 0.6);
  text-decoration: none;
}
main > .content #font-resize {
  color: rgba(32, 99, 115, 0.6);
}
main > .content #font-resize:hover {
  opacity: 1;
  color: #013568;
}
main > .content #font-resize div {
  font-size: 1em;
  display: inline-block;
  text-align: left;
  transition: all 0.3s ease-out;
  text-shadow: 1px 1px 0 rgba(150, 150, 150, 0.45);
  line-height: 0.8em;
}
main > .content #font-resize div:hover {
  border-radius: 4px;
  text-shadow: 1px 1px 0 0 0 1px rgba(255, 255, 255, 0.6);
}
main > .content #font-resize .normal {
  font: Tahoma, Geneva, sans-serif;
  font-size: 1.4em;
}
main > .content #font-resize .normal:hover {
  background: none;
}
main > .content #font-resize .minus, main > .content #font-resize .plus {
  width: 0px;
  opacity: 0;
}
main > .content #font-resize:hover .minus, main > .content #font-resize:hover .plus {
  width: 30px;
  transition: all 0.6s ease-in;
  opacity: 1;
}
main > .content:hover #content-tools {
  opacity: 1;
  transition: all 0.6s ease-in;
}
main > .content #content-tools {
  float: right;
  text-align: right;
  width: auto;
  overflow: hidden;
  opacity: 0.5;
  transition: all 0.6s ease-in;
}
main > .content #content-tools:hover {
  opacity: 1;
  transition: all 0.6s ease-in;
}
main > .content #content-tools .icon {
  width: 1em;
  color: #013568;
  transition: all 0.6s ease-in;
  margin-bottom: 4px;
  cursor: pointer;
}
main > .content #content-tools > a {
  display: block;
}

/** END Main content **/
form[action^="index.php"] {
  max-width: 750px;
  margin-bottom: 80px;
}
form[action^="index.php"] .field {
  display: flex;
}
form[action^="index.php"] label {
  min-width: 150px;
}
form[action^="index.php"] input, form[action^="index.php"] textarea, form[action^="index.php"] select {
  background: rgba(167, 195, 202, 0.25);
  border: 0;
  margin: 5px;
  padding: 5px;
  border-radius: 2px;
  font-size: 1.3rem;
  transition: all 0.6s ease-in;
}
form[action^="index.php"] input:not(.submit), form[action^="index.php"] textarea, form[action^="index.php"] select {
  width: 100%;
}
form[action^="index.php"] input.submit {
  float: left;
  padding: 5px 20px;
}
form[action^="index.php"] input.submit:hover {
  background: rgba(167, 195, 202, 0.5);
  transition: all 0.6s ease-in;
}

/** Content Boxes **/
.outerBox {
  width: 100%;
  border-width: 1px;
  border-style: double;
  border-color: rgba(32, 99, 115, 0.4);
  border-radius: 3px;
  position: relative;
  direction: ltr;
  border-bottom: 0 solid rgba(32, 99, 115, 0.2);
  border-right: 1px solid rgba(32, 99, 115, 0.2);
  border-left: 1px solid rgba(32, 99, 115, 0.1);
  margin-bottom: 40px;
}
.outerBox:first-child {
  margin-left: 38px;
}
.outerBox .innerBox {
  width: 100%;
  border-width: 1px;
  border-style: double;
  border-color: rgba(32, 99, 115, 0.4);
  border-radius: 3px;
  position: relative;
  left: 6px;
  top: 4px;
  padding-top: 1.2em;
  direction: ltr;
  border-bottom: 0 solid rgba(32, 99, 115, 0.2);
  border-right: 1px solid rgba(32, 99, 115, 0.4);
  border-left: 1px solid rgba(32, 99, 115, 0.1);
  background: linear-gradient(to bottom, rgba(167, 195, 202, 0.9) 0, rgba(167, 195, 202, 0.04) 96%, rgba(255, 255, 255, 0) 100%);
}
.outerBox h2.boxTitle {
  position: absolute;
  left: 14px;
  top: -1em;
  color: #21626d;
  padding: 0 10px;
  max-width: 250px;
  min-height: 1.3em;
  font-size: 1vw;
  font-size: clamp(20px, 1vw, 26px);
  line-height: 1.3em;
  font-family: "_PDMS_Saleem_QuranFont", serif;
  text-shadow: 0 0 1px rgba(255, 255, 255, 0.3);
  border-radius: 5px;
  background: #a7c3ca url("../img/header.png") bottom repeat-x;
  background: linear-gradient(to bottom, #A2C0C7 0, #9cbbc3 28%, #98b9c1 38%, #8eb2bb 51%, #8eb2bb 59%, #88aeb7 67%, #89afb8 74%, #81a9b3 87%, #83aab4 90%, #80a8b2 92%, #80a8b2 100%);
  border: 1px solid #3d7b7f;
  border-bottom-right-radius: 0px;
  -webkit-box-shadow: 2px 2px 5px 0 rgba(1, 53, 104, 0.2);
  -moz-box-shadow: 2px 2px 5px 0 rgba(1, 53, 104, 0.2);
  box-shadow: 2px 2px 5px 0 rgba(1, 53, 104, 0.2);
}
.outerBox ul.news li {
  line-height: 1em;
  list-style-type: circle;
}
.outerBox .newsDate,
.outerBox .newsDate2 {
  font-size: 0.5em;
  color: rgba(32, 99, 115, 0.8);
  line-height: 1em;
  float: right;
}
.outerBox .newsDate2 {
  font-size: 0.5em;
  line-height: 40px;
}
.outerBox .newsTitle {
  margin-bottom: 0.5em;
  display: inline-block;
  font-size: 1em;
  border-bottom: 1px dotted rgba(32, 99, 115, 0.4);
  width: auto;
}
.outerBox .newsText {
  margin-bottom: 0.8em;
  margin-top: 0.1em;
}

/** END Content Boxes **/
/** Footer area **/
footer {
  position: relative;
  min-height: 300px;
  border-top: 4px white solid;
  background: #95b7bf;
  background: linear-gradient(to bottom, #95b7bf 1%, #dae5e7 100%);
  padding: 10px;
  margin: 0px;
  margin-top: 100px;
}
footer .span11 {
  margin-top: 50px;
}

.backtotop {
  color: #206373;
  font-size: 22px;
  position: absolute;
  top: 0;
  left: 10px;
  width: 70px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  -webkit-border-bottom-right-radius: 5px;
  -webkit-border-bottom-left-radius: 5px;
  -moz-border-radius-bottomright: 5px;
  -moz-border-radius-bottomleft: 5px;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
  background: #a7c3ca url("../img/header.png") bottom repeat-x;
  background: linear-gradient(to bottom, #A2C0C7 0, #9cbbc3 28%, #98b9c1 38%, #8eb2bb 51%, #8eb2bb 59%, #88aeb7 67%, #89afb8 74%, #81a9b3 87%, #83aab4 90%, #80a8b2 92%, #80a8b2 100%);
  border: 4px solid #fff;
  padding: 2px;
  border-top: none;
  box-shadow: 2px 2px 5px 0 rgba(0, 0, 0, 0.2);
}

ul.sitemap {
  display: inline-block;
  text-align: left;
  margin: 1em;
  padding: 0px;
  margin-left: 50px;
  width: auto;
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
}
ul.sitemap ul {
  padding: 0;
}
ul.sitemap li {
  list-style: none outside none;
}
ul.sitemap li a {
  color: #206373;
  display: inline-block;
  font-family: "Traditional Arabic", Arial;
  direction: ltr;
  font-size: 1.5em;
  line-height: 1.2em;
  margin: 1px 0 0;
  padding: 0;
  width: 100%;
  font-weight: bold !important;
}
ul.sitemap li ul li a, ul.sitemap li ul li ul li a, ul.sitemap li ul li ul li ul li a {
  font-weight: normal !important;
  margin-top: 0 !important;
  color: #206373;
}

/** Footer area END **/
ul.B_crumbBox {
  margin: 0px;
  padding: 0px;
  display: inline;
}
ul.B_crumbBox li {
  display: inline;
}

/** Article summary main page */
.latestArticles {
  margin-bottom: 60px;
}
.latestArticles .newsDate,
.latestArticles .newsDate2 {
  font-size: 0.5em;
  color: rgba(32, 99, 115, 0.8);
  line-height: 1em;
}
.latestArticles .newsDate2 {
  font-size: 0.5em;
  line-height: 40px;
}
.latestArticles .newsTitle {
  margin-bottom: 0.5em;
  display: inline-block;
  font-size: 1em;
  border-bottom: 1px dotted rgba(32, 99, 115, 0.4);
  width: auto;
}
.latestArticles .newsText {
  margin-bottom: 0.8em;
  margin-top: 0.1em;
}

/** End Article summary main page */
/* Larger than mobile/table  */
@media (min-width: 750px) {
  .columns {
    flex-direction: row;
    overflow-x: clip;
  }

  .content {
    flex: 1;
    order: 2;
  }

  .sidebar .wrapper {
    width: 100%;
  }

  .sidebar-left {
    width: 20%;
    order: 3;
  }

  .sidebar-right {
    width: 20%;
    order: 1;
  }
}
/* Desktop  */
@media (min-width: 1280px) {
  .columns {
    flex-direction: row;
    overflow-x: clip;
  }

  .content {
    flex: 1;
    order: 2;
  }

  .sidebar .wrapper {
    max-width: 300px;
  }

  .sidebar-left {
    width: 17%;
    order: 3;
  }

  .sidebar-right {
    width: 17%;
    order: 1;
  }

  .content .outerBox.column {
    flex: 0%;
  }
}

/*# sourceMappingURL=styles.css.map */
