@import url("fonts/nie-fonts.css");
*::-moz-selection {
    color: #fff;
    background-color: #b62427
}

*::selection {
    color: #fff;
    background-color: #b62427
}

body {
    background:#b48b4b;
    margin: 0;
}

a,
a:visited {
    text-decoration: none;
    color: #ffffff;
}

.key-nav {position: fixed;background: #ffffffde;bottom: 0px;border-top: 4px #c84704 solid;width: 100%;height: 71px;clear: both;}

.mprev {
    width: 80px;
    height: 80px;
    background: url('../pic/prev-next-1.png');
    cursor: hand;
    background-size: cover;
    position: absolute;
    left: 20px;
    bottom: 20px;
}

.mnext {
    width: 80px;
    height: 80px;
    background: url('../pic/prev-next-1.png') 0 -80px;
    cursor: hand;
    background-size: cover;
    position: absolute;
    right: 20px;
    bottom: 20px;
}



.matn {
    /* max-width: 700px; */
    margin: auto;
    text-align: justify;
    border: 3px solid #9c6e28;
    direction: rtl;
    background: #feebb8;
    margin-bottom: 30px;
}

.doa-title {
    display: block;
    text-align: center;
    margin: 0px 0px;
    padding: 10px 0px;
    font-family: 'wneirizi';
    font-size: 18pt;
    color: rgb(255, 255, 255);
    background-color: #039c84;
    border: 3px solid;
}

.aarabic {
    text-align: center;
    font-family: iransansnumber,'neirizi-quran2', adobe arabic;
    font-size: 20pt;
    color: rgb(0, 0, 0);
    line-height: 300%;
    /* background: #ffffff; */
    display: block;
    border: 3px solid #ffffff;
}

.aarabic:hover {
    background-color: #ffecb7;
    cursor: pointer;
    -webkit-transition: all 100ms ease-in;
    -moz-transition: all 100ms ease-in;
    transition: all 100ms ease-in;
}

.active {
    border: 3px solid #feebb8;
    border-right: 3px solid #b53333;
    border-left: 3px solid #b53333;
    background-color: rgb(249, 208, 96);
}

.ppersian {
    text-align: center;
    font-family: iransans;
    font-size: 10pt;
    color: rgb(136, 136, 136);
    display: block;
    border-top: 1px solid #BCBCBC;
    border-bottom: 1px solid #BCBCBC;
    padding: 3px 0px;
    background: #f1f1f1;
}

.inpersian {
    text-align: center;
    font-family: iransans;
    font-size: 12pt;
    line-height: 200%;
    color: rgb(31, 145, 0);
    padding: 10px;
    /* display: block; */
    text-align: justify;
}

.inpersian:before {
    content: ' [';
}

.inpersian:after {
    content: '] ';
}

audio.inplayer {
    width: 700px;
    margin: 20px auto;
    display: table;
}

.contrl {
    border: 1px solid #C43C00;
    margin: 10px auto;
    max-width: 80%;
    padding: 0px 10px;
    direction: rtl;
    overflow: auto;
    border-radius: 10px;
    bottom: 0px;
    margin: 10px 132px;
    width: 100%;
    position: fixed;
    background-color: rgb(230, 223, 215);
}

.audio-mp3 {
    float: left;
}

.contrl ul {
    float: right;
    padding: 0;
}


.contrl ul li {
    cursor: pointer;
    font-family: iransans;
    font-size: 10pt;
    display: inline;
    border-left: 1px solid;
    padding: 10px;
    border: 1px solid;
    border-radius: 5px;
    border-bottom: 4px solid;
    background-color: rgb(240, 240, 240);
}

.contrl ul li:hover {
    background-color: rgb(188, 188, 188);
    border-bottom: 4px solid #ffffff;
}

.list-main {
    background: #feebb8;
}

.list-main a {
    color:#026959;
    width: 100%;
    /* height: 100%; */
    display: block;
}

.list-main .aarabic:hover {
    background-color: #9c6e27;
}

.list-main .aarabic:hover a {
    color: #ffffff;
}
@media (min-width: 300px) and (orientation:portrait){
.contrl {
    border: 1px solid #C43C00;
    margin: 10px auto;
    max-width: 50%;
    padding: 0px 10px;
    direction: rtl;
    overflow: auto;
    border-radius: 10px;
    bottom: 0px;
    margin: 10px 132px;
    margin-left: 240px;
    width: 100%;
    position: fixed;
    background-color: rgb(230, 223, 215);
}

.key-nav {
    /* position: fixed; */
    /* background: #ffffffde; */
    /* bottom: 0px; */
    /* border-top: 4px #c84704 solid; */
    /* width: 100%; */
    height: 140px;
    clear: both;
}
.mprev {
    width: 200px;
    height: 200px;
    background: url('../pic/prev-next-1.png');
    cursor: hand;
    background-size: cover;
    /* position: fixed; */
    left: 20px;
    bottom: 20px;
}

.mnext {
    width: 200px;
    height: 200px;
    background: url('../pic/prev-next-1.png') 0 -200px;
    cursor: hand;
    background-size: cover;
    /* position: fixed; */
    right: 20px;
    bottom: 20px;
}
.contrl ul li {
    cursor: pointer;
    font-family: iransans;
    font-size: 18pt;
    display: block;
    border-left: 1px solid;
    padding: 10px;
    border: 1px solid;
    border-radius: 5px;
    margin-bottom: 10px;
    border-bottom: 4px solid;
    background-color: rgb(240, 240, 240);
}
.sm2-360ui {
    width: 150px !important;
    height: 150px !important;
}
.ui360, .ui360 .sm2-360btn-default, .ui360 .sm2-360ui.sm2_paused .sm2-360btn {
    background-size: 100px 100px !important;

}
}