@font-face {
  font-family: 'Uthmani';
  font-style: normal;
  font-weight: 600;
  src: url(fonts/Uthman/UthmanTN1.otf) format('woff');
}
@font-face {
  font-family: 'Uthmani';
  font-style: bold;
  font-weight: 900;
  src: url(fonts/Uthman/UthmanTN1B.otf) format('woff');
}
@font-face {
  font-family: 'FontAwesome';
  font-style: normal;
  font-weight: 400;
  src: url(fonts/FontAwesome/fontawesome-webfont.eot?#iefix) format('embedded-opentype'),
    url(fonts/FontAwesome/fontawesome-webfont.woff) format('woff'),
    url(fonts/FontAwesome/fontawesome-webfont.ttf) format('truetype');
}
@font-face {
  font-family: 'Droid Arabic Kufi';
  font-style: normal;
  font-weight: 400;
  src: url(fonts/DroidKufi/DroidKufi-Regular.ttf) format('truetype');
}
@font-face {
  font-family: 'Droid Arabic Kufi';
  font-style: normal;
  font-weight: 700;
  src: url(fonts/DroidKufi/DroidKufi-Bold.ttf) format('truetype');
}
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 700;
  src: url(fonts/Quicksand/Quicksand-Bold.ttf) format('truetype');
}
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 200;
  src: url(fonts/Quicksand/Quicksand-Light.ttf) format('truetype');
}
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 400;
  src: url(fonts/Quicksand/Quicksand-Medium.ttf) format('truetype');
}
@font-face {
  font-family: 'Quicksand';
  font-style: normal;
  font-weight: 300;
  src: url(fonts/Quicksand/Quicksand-Regular.ttf) format('truetype');
}

.carousel-fade .carousel-inner .item {
  opacity: 0;
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  -o-transition-property: opacity;
  transition-property: opacity;
}
.carousel-fade .carousel-inner .active {
  opacity: 1;
}
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 0;
}
.carousel-fade .carousel-control {
  z-index: 2;
}
.carousel-inner > .item {
  -webkit-transition: 0.2s ease-in-out left;
  -moz-transition: 0.2s ease-in-out left;
  -o-transition: 0.2s ease-in-out left;
  transition: 0.2s ease-in-out left;
}
.SliderContainer {
  margin: 40px auto auto auto;
  padding: 15px 0px;
  display: flex;
}
.PhColCont {
  text-align: center;
  align-items: center;
  display: flex;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  background-color: #ddc47f;
}
.PhCol {
  color: rgba(255,255,255,1.00);
  font-size: 30px;
  font-weight: 700;
  line-height: 1.2000em;
  padding: 50px 30px;
  text-align: center;
  width: 100%;
}

body {
  background-image: url(../images/small-bg.png);
  font-family: 'Droid Arabic Kufi', 'Uthmani';
  font-size: 16px;
  line-height: 28px;
}

h2 {
  font-size: 30px !important;
  margin-bottom: 20px !important;
}

h3 {
  font-size: 18px !important;
}

a {
  text-decoration: none;
  -webkit-transition: 300ms;
  -moz-transition: 300ms;
  -o-transition: 300ms;
  transition: 300ms;
}

a:focus, 
a:hover {
  text-decoration: none;
  outline: none
}

section {
  padding: 15px 0;
}

.navbar-collapse{

}
.navbar-toggle {
  padding: 5px 10px;
  margin-top: 5px;
  margin-left: 15px;
  margin-bottom: 5px;
}
.navbar-nav li a:hover, 
.navbar-nav li a:focus {
  outline: none;
  outline-offset: 0;
  text-decoration: none;  
  background: transparent;
}
.menu-bar {
  margin: 0px;
  padding: 0px;
  height: 40px !important;
}
.navbar {
  float: right !important;
  height: 100% !important;
  min-height: 40px !important;
}
.navbar li a {
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 600;
  padding-top: 10px;
  padding-bottom: 10px;
}
.navbar li {
  height: 30px !important;
}
.navbar-brand {
  padding: 2px !important;
  height: 20px;
}
.navbar-brand h1 {
  margin-top: 5px;
}

.logo-text {
  text-transform: uppercase !important;
  font-weight: 600 !important;
  font-size: 20px !important;
}

#footer {
  padding: 15px;
}
.footer-select {
  border-radius: 15px;
}
.phCopyRights {
  padding: 5px;
  font-size: 11px;
  margin: 0px !important;
}

.PhContent {
  margin: 5px 0;
}

.PhPart {
  padding: 5px;
  margin: 0 0 10px 0;
  text-align: center;
  border-radius: 15px;
}
.PartImage {
  width: 20%;
}

.PhTab {
  padding: 0 5px 5px 0;
  text-align: center;
}
.PhTabBtn {
  text-align: center;
  margin: 5px 0 5px 0;
  padding: 5px;
  border-radius: 15px;
}
.PhTabBtn.active{
  margin: 5px 0 5px 0;
  padding: 5px;
  border-radius: 15px;
}
.PhTabName {

}
.PhTabImage { 
  width: 15%;
}

.PhTabContent {
  margin: 5px 0;
}
.PhCard {
  margin: 15px 0 15px 0;
  padding: 15px;
  border-radius: 15px;
}
.PhCard h5 {
  font-weight: bolder;
}
.PhCard li {
  font-weight: bolder;
}

.getURL-btn {
    cursor: pointer;
}

.mediaFileName {
  text-align: left;
  font-weight: 400 !important;
  font-size: 20px !important;
}

.modalspan {
  cursor: pointer;
  border-radius: 15px;
}
.modalspan:hover  {
  cursor: pointer;
  border-radius: 15px;
}
.spanOverImage {
  margin-top: -25px;
}

.commentSpan {
  cursor: pointer;
  border-radius: 15px;
}
.commentSpan:hover  {
  cursor: pointer;
  border-radius: 15px;
}

.mainButtons-container {
  width: 100%;
  cursor: pointer;
}

.PhImage {
  margin: 10px;
  padding: 10px;
}

.mediaFileName {
  text-align: right;
  font-weight: 400 !important;
  font-size: 20px !important;
}

.IndexItem {
  cursor: pointer;
}
.IdxLvl1 {
  font-size: 16px;
  font-weight: 700;
}
.IdxLvl2 {
  font-size: 15px;
}
.IdxLvl3 {
  font-size: 14px;
}
.IdxLvl4 {
  font-size: 13px;
}
.IdxLvl5 {
  font-size: 12px;
}

::-webkit-scrollbar {
  width: 12px;
}

::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
  border-radius: 15px;
}

::-webkit-scrollbar-thumb {
  border-radius: 15px;
  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); 
}