body {
	background-color: #fff;
	font-family: 'masdar-font';
	font-weight: 300;
	font-size: 20.5px;
	color: #555;
	direction: rtl;
	-webkit-font-smoothing: antialiased;
	-webkit-overflow-scrolling: touch;
	/*height: 100%;
	  width: 100%;
	  overflow: hidden;
	height: 100vh;
	overflow: hidden;*/
	}
  ::-webkit-scrollbar {
	  width: 3px;
	  height: 1vh;
  }
  
  /* Track */
  ::-webkit-scrollbar-track {
	  
	  -webkit-border-radius: 0;
	  border-radius: 0;
	  -moz-border-radius: 0;
  }
  
  /* Handle */
  ::-webkit-scrollbar-thumb {
	  -webkit-border-radius: 1px;
	  border-radius: 1px;
	  -moz-border-radius: 1px;
	  background:#AD9E74 ;
	  }
	 
  
	 ::-webkit-scrollbar-thumb:window-inactive{
	  background:#827E64; }
	  ::-webkit-scrollbar-thumb:hover{
	  background:#AD9E74; }
  
  
  /* Titles */
  h1, h2, h3, h4, h5, h6 {
	  font-family: 'gss', sans-serif;
	  font-weight: 300;
	  color: #D8D8D8;
  }
  
  h1 {
	  font-size: 40px;
  }
  
  h3 {
	color: #453e3e;
	  font-weight: 400;
  }
  
  h4 {
	color: #453e3e;
	  font-weight: 400;
	  font-size: 18px;
  }
  
  /* Paragraph & Typographic */
  p {
	  line-height: 28px;
	  margin-bottom: 25px;
	  font-size: 16px;
  }
  
  .centered {
	  text-align: center;
  }
  
  /* Links */
  a {
	color: #e7b954;
	  word-wrap: break-word;
	  -webkit-transition: color 0.1s ease-in, background 0.1s ease-in;
	  -moz-transition: color 0.1s ease-in, background 0.1s ease-in;
	  -ms-transition: color 0.1s ease-in, background 0.1s ease-in;
	  -o-transition: color 0.1s ease-in, background 0.1s ease-in;
	  transition: color 0.1s ease-in, background 0.1s ease-in;
  }
  .items a:hover,.items 
  a:focus {
	  color: #fff;
	  text-decoration: none;
	  outline: 0;
	  cursor: pointer;
	 }
  .breadcrumb 
  a:hover,
  .breadcrumb a:focus {
	  color: #fff;
	  text-decoration: none;
	  outline: 0;
	  cursor: pointer;
	 }
    
   a:hover,
   a:focus {
     color: rgb(21, 76, 255);
     text-decoration: none;
     outline: 0;
     cursor: pointer;
    }
   
  a:before,
  a:after {
	  -webkit-transition: color 0.1s ease-in, background 0.1s ease-in;
	  -moz-transition: color 0.1s ease-in, background 0.1s ease-in;
	  -ms-transition: color 0.1s ease-in, background 0.1s ease-in;
	  -o-transition: color 0.1s ease-in, background 0.1s ease-in;
	  transition: color 0.1s ease-in, background 0.1s ease-in;
  }
  
   hr {
	  display: block;
	  height: 1px;
	  border: 0;
	  border-top: 1px solid #ccc;
	  margin: 1em 0;
	  padding: 0;
  }
    /* 
  .navbar-default {
	  background-color: #3498db;
	  border-color: transparent;
  }
  
  .navbar-default .navbar-brand {
	  color: white;
  }
  
  .navbar-default .navbar-nav > li > a {
	  color: white;
  }
  
  /* Helpers */
  
  .mt {
	margin-top: 18px;
    /* margin-bottom: -12px; */
   
    position: relative;
  }
  
  .form-control {
	  height: 42px;
	  font-size: 17px;
	 
  }
  
  i {
	  margin: 8px;
	  color: #ffcb61;
  }
  
  @media (max-width: 768px) {
	 
	body{
	  height:auto;
	  overflow: auto;
	}
  }
  
  /* HeaderWrap */
  #headerwrap {
	  /* background: url(../img/bg01.jpg) no-repeat center top; */
	  background-color: #3498db;
	  /* margin-top: -20px; */
	  /* padding-top:200px; */
	  background-attachment: relative;
	  background-position: center center;
	  min-height: 650px;
	  width: 100%;
	  -webkit-background-size: 100%;
	  -moz-background-size: 100%;
	  -o-background-size: 100%;
	  background-size: 100%;
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
	  background-size: cover;
  }
  
  #headerwrap h1 {
	  margin-top: 60px;
	  margin-bottom: 15px;
	  color: white;
	  font-size: 45px;
	  font-weight: 300;
	  letter-spacing: 1px;
  }
  .header-logo {
	  /* width: 12%; */
	 
  }
  
  .row.header {
 
    transition: all 800ms;
  }
   .page2 img.img-btn_search{ 
	top: 1px;
}
  .page2 img.img-logo_search{  

}
  .row.header.mt.centered {}
  img.img-logo_search {
	  /* width: 11%; */
	 
  }
  
  input.text-key  {
    position: relative;
    /* top: 3px; */
    /* right: -4px; */
    /* width: 76%; */
    border-width: 0;
    background: transparent;
    height: 57px;
    /* padding-top: 6px; */
    /* padding-bottom: 6px; */
    /* padding-left: 0; */
    /* padding-right: 24px; */
    font-size:132%;
    line-height: 1.428571429;
    color: #15193c;
    outline: none;
  }
  .bar1{
    margin-bottom: 1em;
  }
  .header-search .form{
    border-bottom: 2px solid #ffcb5e;;
    background: #f8f8fa;
  }
  .header-search .form .fa{
    color: #0b0f36;
    font-size: 46px;
  } 
  .header-search .form a{
    border-right: 5px solid #fff;
    height: 63px;
  }
  .img-logo { 
margin: 0 auto;
 
  }
  img.img-btn_search {margin-right: -15px;position: relative;}
  .header-search {
	 
	  
	  margin-top: 6%;
  }
  #main-cont {height: 71vh;
	 ;background-size: 20% 70%;}
  h2.main-title:after {
    
   width: 100%;
   height: 77px;
   display: block;
   position: absolute;
   top: -34px;
   content: '';
   right: 4px;
  }
  h2.main-title:before {
   content: '';
   width: 70%;
   height: 1.5px;
   background: #A59770;
   display: block;
   position: relative;
   top: 35px;
  }
  h2.main-title{
	  margin: 15px 0;
	  color: white;
	  margin-bottom: 24px;
  }   
  .main-cont-md:after {
	
  }
  .scrollbar
  {
	  margin-left: 30px;
	  float: left;
	  height: 300px;
	  width: 65px;
	  background: #F5F5F5;
	  overflow-y: scroll;
	  margin-bottom: 25px;
  }
  
  .force-overflow
  {
	  min-height: 450px;
  }
  
  #wrapper
  {
	  text-align: center;
	  width: 500px;
	  margin: auto;
  }
  
  /*
   *  scrollbar 1
   */
  
  #scrollbar-1::-webkit-scrollbar-track
  {
	  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	  border-radius: 10px;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-1::-webkit-scrollbar
  {
	  width: 12px;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-1::-webkit-scrollbar-thumb
  {
	  border-radius: 10px;
	  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
	  background-color: #555;
  }
  
  /*
   *  scrollbar 2
   */
  
  #scrollbar-2::-webkit-scrollbar-track
  {
	  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	  border-radius: 10px;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-2::-webkit-scrollbar
  {
	  width: 12px;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-2::-webkit-scrollbar-thumb
  {
	  border-radius: 10px;
	  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
	  background-color: #D62929;
  }
  
  /*
   *  scrollbar 3
   */
  
  #scrollbar-3::-webkit-scrollbar-track
  {
	  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	  background-color: #F5F5F5;
  }
  
  #scrollbar-3::-webkit-scrollbar
  {
	  width: 6px;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-3::-webkit-scrollbar-thumb
  {
	  background-color: #000000;
  }
  
  /*
   *  scrollbar 4
   */
  
  #scrollbar-4::-webkit-scrollbar-track
  {
	  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	  background-color: #F5F5F5;
  }
  
  #scrollbar-4::-webkit-scrollbar
  {
	  width: 10px;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-4::-webkit-scrollbar-thumb
  {
	  background-color: #000000;
	  border: 2px solid #555555;
  }
  
  
  /*
   *  scrollbar 5
   */
  
  #scrollbar-5::-webkit-scrollbar-track
  {
	  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	  background-color: #F5F5F5;
  }
  
  #scrollbar-5::-webkit-scrollbar
  {
	  width: 10px;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-5::-webkit-scrollbar-thumb
  {
	  background-color: #0ae;
	  
	  background-image: -webkit-gradient(linear, 0 0, 0 100%,
						 color-stop(.5, rgba(255, 255, 255, .2)),
						 color-stop(.5, transparent), to(transparent));
  }
  
  
  /*
   *  scrollbar 6
   */
  
  #scrollbar-6::-webkit-scrollbar-track
  {
	  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	  background-color: #F5F5F5;
  }
  
  #scrollbar-6::-webkit-scrollbar
  {
	  width: 10px;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-6::-webkit-scrollbar-thumb
  {
	  background-color: #F90;	
	  background-image: -webkit-linear-gradient(45deg,
												rgba(255, 255, 255, .2) 25%,
												transparent 25%,
												transparent 50%,
												rgba(255, 255, 255, .2) 50%,
												rgba(255, 255, 255, .2) 75%,
												transparent 75%,
												transparent)
  }
  
  
  /*
   *  scrollbar 7
   */
  
  #scrollbar-7::-webkit-scrollbar-track
  {
	  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	  background-color: #F5F5F5;
	  border-radius: 10px;
  }
  
  #scrollbar-7::-webkit-scrollbar
  {
	  width: 10px;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-7::-webkit-scrollbar-thumb
  {
	  border-radius: 10px;
	  background-image: -webkit-gradient(linear,
										 left bottom,
										 left top,
										 color-stop(0.44, rgb(122,153,217)),
										 color-stop(0.72, rgb(73,125,189)),
										 color-stop(0.86, rgb(28,58,148)));
  }
  
  /*
   *  scrollbar 8
   */
  
  #scrollbar-8::-webkit-scrollbar-track
  {
	  border: 1px solid black;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-8::-webkit-scrollbar
  {
	  width: 10px;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-8::-webkit-scrollbar-thumb
  {
	  background-color: #000000;	
  }
  
  
  /*
   *  scrollbar 9
   */
  
  #scrollbar-9::-webkit-scrollbar-track
  {
	  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	  background-color: #F5F5F5;
  }
  
  #scrollbar-9::-webkit-scrollbar
  {
	  width: 10px;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-9::-webkit-scrollbar-thumb
  {
	  background-color: #F90;	
	  background-image: -webkit-linear-gradient(90deg,
												rgba(255, 255, 255, .2) 25%,
												transparent 25%,
												transparent 50%,
												rgba(255, 255, 255, .2) 50%,
												rgba(255, 255, 255, .2) 75%,
												transparent 75%,
												transparent)
  }
  
  
  /*
   *  scrollbar 10
   */
  
  #scrollbar-10::-webkit-scrollbar-track
  {
	  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	  background-color: #F5F5F5;
	  border-radius: 10px;
  }
  
  #scrollbar-10::-webkit-scrollbar
  {
	  width: 10px;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-10::-webkit-scrollbar-thumb
  {
	  background-color: #AAA;
	  border-radius: 10px;
	  background-image: -webkit-linear-gradient(90deg,
												rgba(0, 0, 0, .2) 25%,
												transparent 25%,
												transparent 50%,
												rgba(0, 0, 0, .2) 50%,
												rgba(0, 0, 0, .2) 75%,
												transparent 75%,
												transparent)
  }
  
  
  /*
   *  scrollbar 11
   */
  
  #scrollbar-11::-webkit-scrollbar-track
  {
	  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	  background-color: #F5F5F5;
	  border-radius: 10px;
  }
  
  #scrollbar-11::-webkit-scrollbar
  {
	  width: 10px;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-11::-webkit-scrollbar-thumb
  {
	  background-color: #3366FF;
	  border-radius: 10px;
	  background-image: -webkit-linear-gradient(0deg,
												rgba(255, 255, 255, 0.5) 25%,
												transparent 25%,
												transparent 50%,
												rgba(255, 255, 255, 0.5) 50%,
												rgba(255, 255, 255, 0.5) 75%,
												transparent 75%,
												transparent)
  }
  
  /*
   *  scrollbar 12
   */
  
  #scrollbar-12::-webkit-scrollbar-track
  {
	  -webkit-box-shadow: inset 0 0 7px #FFDD33;
	  border-radius: 10px;
	  background-color: #A79970;
  }
  
  #scrollbar-12::-webkit-scrollbar
  {
	  width: 12px;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-12::-webkit-scrollbar-thumb
  {
	  border-radius: 10px;
	  background-color: #D62929;
	  background-image: -webkit-linear-gradient(90deg,               rgba(0, 0, 0, 0),               rgba(0, 0, 0, 0.4) 50%,               rgba(179, 23, 23, 0),               transparent);
  }
  
  /*
   *  scrollbar 13
   */
  
  #scrollbar-13::-webkit-scrollbar-track
  {
	  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.9);
	  border-radius: 10px;
	  background-color: #CCCCCC;
  }
  
  #scrollbar-13::-webkit-scrollbar
  {
	  width: 12px;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-13::-webkit-scrollbar-thumb
  {
	  border-radius: 10px;
	  background-color: #D62929;
	  background-image: -webkit-linear-gradient(90deg,
												transparent,
												rgba(0, 0, 0, 0.4) 50%,
												transparent,
												transparent)
  }
  
  /*
   *  scrollbar 14
   */
  
  #scrollbar-14::-webkit-scrollbar-track
  {
	  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.6);
	  background-color: #CCCCCC;
  }
  
  #scrollbar-14::-webkit-scrollbar
  {
	  width: 10px;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-14::-webkit-scrollbar-thumb
  {
	  background-color: #FFF;
	  background-image: -webkit-linear-gradient(90deg,
												rgba(0, 0, 0, 1) 0%,
												rgba(0, 0, 0, 1) 25%,
												transparent 100%,
												rgba(0, 0, 0, 1) 75%,
												transparent)
  }
  
  /*
   *  scrollbar 15
   */
  
  #scrollbar-15::-webkit-scrollbar-track
  {
	  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.1);
	  background-color: #ff3577;
	  border-radius: 10px;
  }
  
  #scrollbar-15::-webkit-scrollbar
  {
	  width: 10px;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-15::-webkit-scrollbar-thumb
  {
	  border-radius: 10px;
	  background-color: #FFF;
	  background-image: -webkit-gradient(linear,
										 40% 0%,
										 75% 84%,
										 from(#4D9C41),
										 to(#19911D),
										 color-stop(.6,#54DE5D))
  }
  
  /*
   *  scrollbar 16
   */
  
  #scrollbar-16::-webkit-scrollbar-track
  {
	  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.1);
	  background-color: #F5F5F5;
	  border-radius: 10px;
  }
  
  #scrollbar-16::-webkit-scrollbar
  {
	  width: 10px;
	  background-color: #F5F5F5;
  }
  
  #scrollbar-16::-webkit-scrollbar-thumb
  {
	  border-radius: 10px;
	  background-color: #FFF;
	  background-image: -webkit-linear-gradient(top,
												#e4f5fc 0%,
												#bfe8f9 50%,
												#9fd8ef 51%,
												#2ab0ed 100%);
  }
  .bar {
	  height: 50px;
	  background:rgb(234, 189, 106);
	  margin-bottom: 10px;
	  margin-top: 2px;    padding-right: 1em;
  }
  

  .text-content {
	  
	  background-size: 16% 68%;
	  background-repeat: no-repeat;
  }
  .btn-index {
	position: relative;
    top: -21px;
    margin-right: -30%;
    cursor: pointer;
  }
  .result-table {
	  max-height: 23vh;
    overflow-y: scroll;
    position: fixed;
    bottom: 0vh;
    z-index: 99;
    background-color: #fdf9f0;
    /* width: 100%; */
    direction: ltr;
    text-align: right;
    font-size: 17px;
    color: #453e3e;
    overflow: hidden;
  }
  .result-table-tabled.result-count {
	  
	  direction: rtl;
  bottom: 23vh;
  }
  .fixed{
	position: fixed;
  }
  .result-table-tabled.result-count span{
	  font-size:18px;
	  font-family:ge ss;
  }
  .result-table-tabled ,.result-table-tabled table{
  direction: ltr;
  width: 100%;
  }
  .result-table.collpesd .result-count{
bottom: 0;
  }
  .result-table.collpesd .table1{
    display: none;
      }
  .result-table-tabled .tr{
    border: 1px solid #ffcb617a;
    border-bottom: 0;
  }
  .td-color {
    background: #1c224a;
    color: #fff;
    border-bottom: 2px solid #ffcb61;
  }
  .td-no {
	width: 2vw;
  }
  .td-book {
 
  }
  .td-book a{
    color: #453e3e;
  }
  .td-book a:hover{
    color: #eabd6a;
  }
  .txt-body {
	  padding-bottom: 26vh;
  } 
  #txtbody {
    background: #fff;
    padding-right: 10px;
    border-radius: 5px;
}
  .main-text {
  padding-bottom:0!important;
  }
  .txt-body  br:first-child{
	  
  }
  .container-searchFahares {
	  position: relative;
	  height: 15px;
	  right: 10px;
	  direction: rtl;
  }
  
  input.txt-searchFahares {
 
	  border-bottom-left-radius: 0;
	  top: 3px;
	  padding-right:10px
  ;
	  width: 240px;
	  border: 1px solid #7E765B;
	  border-radius: 6px;
	  height: 28px;
	  font-size: small;
  }
  .more  {
	  position: absolute;
	  left: 0;
	  bottom: 17vh;
  }
  .ShairContiner {
	  width: 34px;
	  background-color: #1c234a;
	  border-bottom-right-radius: 16px;
  }
  .ShairContiner a i{
	   color: #fff;
	   font-size:larger
  }
  a.closer {
	  font-size: x-small;
  }
  .more a:hover i{
	   color: #FFEB3B;
	   opacity: 0.8;
  }
  img.img-title-cont {
	  position: absolute;
	  height: 173px;
	  bottom: 15px;
	  z-index: 99;
  }
  .close-icon {
	  position: absolute;
	  left: 10px;
	  top: 18px;
  }
	  .close-icon a:hover{
		  opacity: 0.4;
	  }
  .close-icon a{
	  float:left;
	  margin-left:10px;
	  zoom:.5;	-moz-transform: scale(.5);
  }
  .page2 .row.header {
	  margin-top: -140px;
	  margin-bottom: 0px;
	  transition: all 1000ms ease-in-out;
  }
  .page2 .img-logo {
	height: 83px;
  }
  .page2 .header-logo {
	  /* width: 12%; */
	  margin-top: 6%;
  }
  .page2 .top{
	  background: rgb(69, 62, 62);
  } 
 
.page2 .header-search input.text-key {
     color:#e5e7f1;}
     
  .page2 .header-search {
    margin-top: 0;
	  padding-top: 2px;
  }
  .page2 .conifig{
    border-right: 6px solid #1c224a;
    margin-top: 1px;
}
  .page2 .header-search .form {
    border-bottom: 1px solid #858587;
    background: #1c234a;
}
.page2 .header-search .form a {
  border-right: 5px solid #1c224a;
  height: 45px;
}
 /* .page2 .img-bot_first_page {position:fixed;bottom: 0;background: url(../img/top_footer_page.png) top left no-repeat;left: 2px;z-index: 9;width: 100%;height: 70px;display: block;}
  */
  table.result-table-tabled.result-count.centered {
    width: 74vw;    
}
  input.txt-searchSorah  {
	  position: absolute;
	  right: 16vw;
	  width: 66vw;
  }
  .page2 .img-bot_first_page {display: none}
  .page2 .header-search a.pull-left.conifig .fa ,.page2 .header-search .form .fa{
    color: #eabd6a;
    font-size: 31px;
    line-height: 37px;
}
 .page2  .imglogo{
  height: 70px;
  float: right;
}
.modal .column__text {
  color: #262222;
}

my-player{
    
    position: fixed !important;
    top: 5px;
    z-index: 9;
    left: 10vw;
    padding-bottom: 3px;
    padding-left: 6px;
 
}