/**
 * Custom CSS file Created by Karim Ramadan
 */

/* Fonts */

@import url("http://fonts.googleapis.com/earlyaccess/droidarabicnaskh?ver=3.7.1");
@import url("http://fonts.googleapis.com/earlyaccess/droidarabickufi?ver=3.7.1");
@font-face {
   font-family: PDMSSaleemQuranFont;
   src: url(../fonts/me_quran_volt_newmet.ttf);
}

html{
scroll-behavior: smooth;
}

body {
  background: url("../img/bg.jpg") repeat 50% 50% rgba(0, 0, 0, 0) !important;
  background-attachment: fixed;
}

/* Arabic Fonts */
body, button, .button, .top-bar-section ul li > a{
  font-family: 'droid arabic naskh', Tahoma, arial;
}

h1, h2, h3, h4, h5, h6{
  font-family: 'droid arabic kufi', Tahoma, arial;
}

h4{
  display: block;
  background: rgba(0,0,0,0.5);
  color: #fff;
  padding: 10px 20px;
}

/* display */
.center{
  text-align: center;
}
/***********************************/

/* Page Style */
.wrapper{
  width: 90%;
  display: block;
  margin: 0 auto;
  background: rgba(256,256,256,0.8);
  margin-top: 50px;
}
footer{
  padding-top: 100px;
  text-align: center;
}

/************************************/

/* Main Menu */
ul.dropdown li a{
  line-height: 25px !important;
}

hgroup{
  margin: 100px 0;
}

/************************************/

/* Quran text */
#Quran {
   font-family: PDMSSaleemQuranFont, 'droid arabic kufi', Tahoma, arial; 
   font-size: 1.5rem;  
   word-spacing: 5px;
   text-align: justify;
   color: green;
   
}

/* a[href*="sura.php"]{
  background: green;
  color: white;
  width: 16px;
  height: 16px;
  font-size: 10px;
  padding: 2px;
  border-radius: 50%;
} */

a.ayanum{
  background: green;
  color: white;
  width: 16px;
  height: 16px;
  font-size: 10px;
  padding: 2px;
  border-radius: 50%;
}
h6.ayanum{
  margin:0;
  background: green;
  color: white;
  width: 16px;
  height: 16px;
  font-size: 10px;
  padding: 2px;
  border-radius: 50%;
}
/* a.anchor{
  background: green;
  color: white;
  width: 16px;
  height: 16px;
  font-size: 10px;
  padding: 2px;
  border-radius: 50%;
} */


::-webkit-input-placeholder {
   color: green;
  font-size: 20px;

  
}
::-webkit-input {
   
    line-height: 2em;

  
}

:-moz-placeholder { /* Firefox 18- */
   color: green;  
  font-size: 20px;
    padding: 10px 0;

}

::-moz-placeholder {  /* Firefox 19+ */
   color: green;  
  font-size: 20px;
    padding: 10px 0;

}

:-ms-input-placeholder {  
   color: green;  
  font-size: 20px;
    padding: 10px 0;

}

/* fix anchors for ff chrome */
:target {
    /*display: block;     */
    position: relative;    
    top: -60px;
    /*visibility: hidden;*/
}
/* fix anchors ie */
a[name]:not([href]){
    display: block;    
    position: relative;     
    top: -60px;
    visibility: hidden;
}

@media only screen and (max-width : 993px) {
    [class*="block-grid-"] > li{
        width:100%;
    }
}

.has-dropdown ul{
    position: absolute;
    left: 0;
    top: auto;
    width: 100%;
}

.top-bar-section li:not(.has-form) a:not(.button) {
    background: #333333;
   
}