body 
{
}

/* https://www.w3schools.com/howto/howto_css_navbar_image.asp */

.ia-img {
    /* The image used */
    background-image: url('../../images/IaBlueBanner.jpg');
    min-height: 380px;
    /* Center and scale the image nicely */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    /* Needed to position the navbar */
    position: relative;
}

/* Position the navbar container inside the image */
.container {
    position: absolute;
    margin-top: 90px;
    margin-left: 50px;
    width: auto;
}

/* The navbar */
.topnav {
    overflow: hidden;
    background-color: #333;
}

    /* Navbar links */
    .topnav a {
        float: left;
        color: #f2f2f2;
        text-align: center;
        padding: 4px 25px;
        text-decoration: none;
        font-size: 12px;
    }

    .topnav a:hover {
       background-color: #ddd;
       color: black;
    }

div.SurahSearch {
    background-color: #0181FF;
    color: #E0E0E0;
    text-align: center;
}


div.audioAyah {
    text-align: center;
}


div.rootSummary {
	background-color: #88888;
	border: thin;
}

fieldset.root-s {
    text-align: center;
    font-size: 100%;
    color: green;
    background-color: #FFFFFF;
}
legend.root-s {
	font-size: 80%;
    float: left;
    margin-bottom: .5em;
    border: solid;
    background-color: white;
    color: green;
    background: white;
    text-align: left;
}


fieldset.root-h {
    text-align: center;
    font-size: 150%;
    color: black;
    background-color: #FFFFFF;
}
legend.root-h {
    font-weight: bold;
    float: right;
    margin-bottom: .5em;
    border: thin;
    background-color: white;
    color: black;
    background: white;
    text-align: right;
}

.root-h {
    text-align: center;
    font-size: 150%;
    color: green;
    padding: 2px;
	background-color: #FFFFFF;
}

div.root-s {
    text-align: center;
    font-size: 150%;
    color: black;
    padding: 2px;
}

li.rootword-h {
	background-color: #FFFFFF;
	
}

.RootWord div {
	background-color: #FFFFFF;
	font-size: 150%;
}
.BtnArabic {
	font-size: 120%;
	  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
	  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.16, rgb(207, 207, 207)), color-stop(0.79, rgb(252, 252, 252)));
  background-image: -moz-linear-gradient(center bottom, rgb(207, 207, 207) 16%, rgb(252, 252, 252) 79%);
  background-image: linear-gradient(to top, rgb(207, 207, 207) 16%, rgb(252, 252, 252) 79%); 
  padding: 3px;
  border: 1px solid #000;
  color: black;
  text-decoration: none;
  
}

ul.RootWordTran {
	background-color: #90FF90;
	padding-right: 30px;
}
ul.RootWordTranConc {
	background-color: #7abede;
	padding-right: 5px;
}
li.concordlink {
	list-style-type: square;
}

div.eng1 {
    text-align: left;
    font-size: 100%;
    color: green;
    padding: 20px;
}

div.donate-container {
    align-content: center;
    clear: both;
    border-block: double;
}

div.donate-child {
    margin: auto;
    width: 75%;
    border: 3px solid green;
    padding: 10px;
    align-content: center;
    border-block: double;
    background-color: aquamarine;
}


legend.ayah {
    border:thin;
    background-color: white;
    color: black;
    background: white;
    font: 12px Verdana, sans-serif;
    text-align: left;
}

/* The other navbar */
.ayahNav {
    overflow: hidden;
    background-color: #FFFFFF;
}

    /* Navbar links */
    .ayahNav a {
        float: left;
        color: #222222;
        text-align: center;
        padding: 4px 25px;
        text-decoration: none;
        font-size: 12px;
    }

        .ayahNav a:hover {
            background-color: #EEEEEE;
            color: black;
        }

div.stcl1 {
    background-color: #FFFFFF;
    border-color: lightgray;
    border-style: solid;
    text-align: right;
    font-size: 100%;
    color: green;
    padding: 2px;
}
div.stcl1-a {
    background-color: #FFFFFF;
    border-color: lightgray;
    border-style: solid;
    text-align: right;
    font-size: 150%;
    color: green;
    padding: 2px;
}

div.stcl2 {
    border-color: lightgray;
    border-style: solid;
    text-align: left;
    font-size: 100%;
    color: black;
    background-color: #E4FFE1;
    padding: 2px;
}
div.stcl3 {
    border-color: lightgray;
    border-style: solid;
    text-align: left;
    font-size: 100%;
    color: black;
    background-color: #FEFFE1;
    padding: 2px;
}
div.stcl4 {
    border-color: lightgray;
    border-style: solid;
    text-align: left;
    font-size: 100%;
    color: black;
    background-color: #FFE8E6;
    padding: 2px;
}
div.stcl5 {
    border-color: lightgray;
    border-style: solid;
    text-align: left;
    font-size: 100%;
    color: black;
    background-color: #E6FFFF;
    padding: 2px;
}
div.stcl6 {
    border-color: lightgray;
    border-style: solid;
    text-align: left;
    font-size: 100%;
    color: black;
    background-color: gray;
    padding: 2px;
}