@font-face {font-family: 'Scheheraza';src: url('../fonts/ScheherazadeM.eot');src: local('none'), url('../fonts/ScheherazadeM.ttf') format('truetype');}
@font-face {font-family: 'ZekrQuran';src: url('../fonts/ZekrQuran.eot');src: local('none'), url('../fonts/ZekrQuran.ttf') format('truetype');}
@font-face {font-family: 'Ru';src: url('../fonts/Ru.eot');src: local('none'), url('../fonts/Ru.ttf') format('truetype');}
@font-face {font-family: 'Chapters';src: url('../fonts/sahlnaskh.eot');src: local('none'), url('../fonts/sahlnaskh.ttf') format('truetype');}
html {
  height: 100%;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
}
body {
	text-align: center;
	margin: 0;
	height: 100%;
	min-height:100%;
	background: url(../images/back.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	-ms-behavior: url(../scripts/backgroundsize.min.htc);
	behavior: url(../scripts/backgroundsize.min.htc);
}

.preload * {
  visibility: hidden;
  transition:none!important;
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important;
}

@media (min-width: 30em) { /*the simplest responsive css grid*/
	.row { width: 100%; display: table; table-layout: fixed; }
	.col { display: table-cell; }
}
.left {text-align: left;}
.center {text-align: center;}
.right {text-align: right;}
.ltr {direction: ltr;}
.rtl {direction: rtl;}
.toc {font-family: Chapters; font-size: 1.2em; margin: 0.5em;}

/* highlight selected item */
.fancytree-plain span.fancytree-active span.fancytree-title,
.fancytree-plain span.fancytree-selected span.fancytree-title {
  background-color: rgba(0, 0, 0, 0.100) !important;
  border-color: rgba(0, 0, 0, 0.200) !important;
}

ul.fancytree-container {
  background-color: transparent !important; /* keep background */
  border: none !important; /* remove border */
  outline:none !important; /* remove border around containder */
  max-width: 95%; /* to fit long titles on screen */
  /* overflow: auto; */
}

span.fancytree-title {
  font-family: Chapters!important;
  font-size: 1.4em!important;
  white-space: normal; /* to wrap long titles */
}
input[type="submit"] {
  height: 51px;
}
.selected {background-color: #FFFFE6;}
table {border: 0; border-collapse: collapse;}
.hidden {position: absolute;top: -9999em;left: -9999em;}
.btn {width: 165px;}
.h1-ar, .h1-ru {text-align: center;}
.ogl {font-size: 2em; padding-left: 0.25em; padding-right: 0.25em;}
.dbname {font-family: Ru; font-size: 1.3em; font-weight: bold; margin: 0.2em;}
.toggle{color: #111; font-family: Ru; font-size: 1.6em; font-weight: bold; margin: 0.2em;}
a{ outline: none; text-decoration: none; cursor: hand; color: #111;}
a:hover{background-color: #FBF8D7 !important;}
.h1-ru {font-size: 1em;}
.h1-ar {font-size: 3em; font-weight: normal; margin-top: 0.25em; margin-bottom: 0em; text-shadow: #777 0px 1px 0, #eee 0 -1px 0; color: #111;}
.ru, .h1-ru {font-family: Ru;}
.ar, .h1-ar, .ogl {direction: rtl; font-family: Scheheraza;}
.text { background: #F3EFE6 url(../images/bg.jpg); font-family: Scheheraza; font-size: 2.5em; direction: rtl; text-align: right; margin: 0.1em 0.5em; padding-left: 0.5em; padding-right: 0.5em; padding-top: 0.2em; padding-bottom: 0.2em; overflow-x:hidden; overflow-y:hidden; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.3); border-radius: 5px;}
/* .quran {background-color: rgba(108, 108, 108, 0.11); font-family: ZekrQuran; font-size: 0.75em; text-shadow: #bbbbbb 0px 1px 0, #fffffa 0 -1px 0; color: #111;} */
.quran {background-color: rgba(190, 190, 183, 0.19); font-family: ZekrQuran; font-size: 0.75em; text-shadow: #bbbbbb 0 1px 0, #fffffa63 0 -1px 0; color: #111;}
.matn { font-family: Scheheraza; direction: rtl; margin:0; padding:0; background-color: rgba(190, 190, 172, 0.26);}
.foundtext { background-color: rgba(255, 230, 71, 0.16);}
.fnum { font-family: Ru; font-size: 1.2em; direction: ltr; padding: 0; unicode-bidi: bidi-override;}
.fbn { font-family: Scheheraza; font-size: 1.6em; direction: rtl; padding: 0;}
.comentary { font-family: Ru; font-size: 1.5em; direction: ltr;}
#search{ font-family: Scheheraza; font-size: 1.94em; width: 250px; vertical-align: top; }
#fbtn, #searchbook {height: 51px;}
#contents {font-family: Chapters; font-size: 1em;}
@media only screen and (max-width: 800px) {
	.wh {width: fit-content;}
}
/* pagination */
#pagination {
  display: inline-block;
  vertical-align: middle;
  padding: 1px 2px 4px 2px;
  font-size: 1.3em;
  color: #111;
}
#pagination a,
#pagination i {
  display: inline-block;
  vertical-align: middle;
  min-width: 22px;
  color: #111;
  text-align: center;
  padding: 4px 0;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}
#pagination a {
  margin: 0 2px 0 2px;
  cursor: pointer;
}
#pagination a:hover {
  background-color: #999;
  color: #fff;
}
#pagination i {
  border: 2px solid transparent;
  cursor: pointer;
}
#pagination i:hover {
  border: 2px solid #999;
  cursor: pointer;
}
#pagination input {
  width: 40px;
  padding: 2px 4px;
  color: #111;
  text-align: right;
}
#pagination a.current {
  border: 1px solid #E9E9E9;
  background-color: #666;
  color: #fff;
  cursor: default;
}

#upbutton {
  cursor: pointer;
  display: block;
  position: fixed;
  border-radius: 12%;
  font-size: 2.1em;
  /* padding: 0.5em, 0.25em, 0.5em, 0.25em; */
  padding-left: 0.6em;
  padding-right: 0.6em;
  /* padding-top: 0.1em;
  padding-bottom: 0.1em; */
  bottom: 3%;
  right: 3%;
  opacity: 0;
  z-index: 10;
  
  transform: translateY(30%);
  transition: transform 0.5s ease-in-out, opacity 0.5s ease-in-out;
}