*{
        scrollbar-width: none;
}
body{
    margin:0;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
    font-size:1rem;
    font-weight:400;
    line-height:1.5;
    color:#212529;
    text-align:left;
    background-color:#fff
}
.row{
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    margin-right:-15px;
    margin-left:-15px
}
.container{
    width:100% !important;
    padding-right:15px;
    padding-left:15px;
    margin-right:auto;
    margin-left:auto
}
@media (min-width:576px){
    .container{
        max-width:100%;
    }
}
@media (min-width:768px){
    .container{
        max-width:720px
    }
}
@media (min-width:992px){
    .container{
        max-width:960px
    }
}
@media (min-width:1200px){
    .container{
        max-width:1140px
    }
}
@media print{
    *,::after,::before{
        text-shadow:none!important;
        box-shadow:none!important
    }
}
.no-gutters>.col,.no-gutters>[class*=col-]{
    padding-right:0;
    padding-left:0
}
.col,.col-1,.col-10,.col-11,.col-12,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-auto,.col-lg,.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-auto,.col-md,.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-auto,.col-sm,.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-auto,.col-xl,.col-xl-1,.col-xl-10,.col-xl-11,.col-xl-12,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-auto{
    position:relative;
    width:100%;
    min-height:1px;
    padding-right:15px;
    padding-left:15px
}
.col{
    -ms-flex-preferred-size:0;
    flex-basis:0;
    -ms-flex-positive:1;
    flex-grow:1;
    max-width:100%
}
.col-auto{
    -ms-flex:0 0 auto;
    flex:0 0 auto;
    width:auto;
    max-width:none
}
.col-1{
    -ms-flex:0 0 8.333333%;
    flex:0 0 8.333333%;
    max-width:8.333333%
}
.col-2{
    -ms-flex:0 0 16.666667%;
    flex:0 0 16.666667%;
    max-width:16.666667%
}
.col-3{
    -ms-flex:0 0 25%;
    flex:0 0 25%;
    max-width:25%
}
.col-4{
    -ms-flex:0 0 33.333333%;
    flex:0 0 33.333333%;
    max-width:33.333333%
}
.col-5{
    -ms-flex:0 0 41.666667%;
    flex:0 0 41.666667%;
    max-width:41.666667%
}
.col-6{
    -ms-flex:0 0 50%;
    flex:0 0 50%;
    max-width:50%
}
.col-7{
    -ms-flex:0 0 58.333333%;
    flex:0 0 58.333333%;
    max-width:58.333333%
}
.col-8{
    -ms-flex:0 0 66.666667%;
    flex:0 0 66.666667%;
    max-width:66.666667%
}
.col-9{
    -ms-flex:0 0 75%;
    flex:0 0 75%;
    max-width:75%
}
.col-10{
    -ms-flex:0 0 83.333333%;
    flex:0 0 83.333333%;
    max-width:83.333333%
}
.col-11{
    -ms-flex:0 0 91.666667%;
    flex:0 0 91.666667%;
    max-width:91.666667%
}
.col-12{
    -ms-flex:0 0 100%;
    flex:0 0 100%;
    max-width:100%
}
@media (min-width:576px){
    .col-sm{
        -ms-flex-preferred-size:0;
        flex-basis:0;
        -ms-flex-positive:1;
        flex-grow:1;
        max-width:100%
    }
    .col-sm-auto{
        -ms-flex:0 0 auto;
        flex:0 0 auto;
        width:auto;
        max-width:none
    }
    .col-sm-1{
        -ms-flex:0 0 8.333333%;
        flex:0 0 8.333333%;
        max-width:8.333333%
    }
    .col-sm-2{
        -ms-flex:0 0 16.666667%;
        flex:0 0 16.666667%;
        max-width:16.666667%
    }
    .col-sm-3{
        -ms-flex:0 0 25%;
        flex:0 0 25%;
        max-width:25%
    }
    .col-sm-4{
        -ms-flex:0 0 33.333333%;
        flex:0 0 33.333333%;
        max-width:33.333333%
    }
    .col-sm-5{
        -ms-flex:0 0 41.666667%;
        flex:0 0 41.666667%;
        max-width:41.666667%
    }
    .col-sm-6{
        -ms-flex:0 0 50%;
        flex:0 0 50%;
        max-width:50%
    }
    .col-sm-7{
        -ms-flex:0 0 58.333333%;
        flex:0 0 58.333333%;
        max-width:58.333333%
    }
    .col-sm-8{
        -ms-flex:0 0 66.666667%;
        flex:0 0 66.666667%;
        max-width:66.666667%
    }
    .col-sm-9{
        -ms-flex:0 0 75%;
        flex:0 0 75%;
        max-width:75%
    }
    .col-sm-10{
        -ms-flex:0 0 83.333333%;
        flex:0 0 83.333333%;
        max-width:83.333333%
    }
    .col-sm-11{
        -ms-flex:0 0 91.666667%;
        flex:0 0 91.666667%;
        max-width:91.666667%
    }
    .col-sm-12{
        -ms-flex:0 0 100%;
        flex:0 0 100%;
        max-width:100%
    }
}
@media (min-width:768px){
    .col-md{
        -ms-flex-preferred-size:0;
        flex-basis:0;
        -ms-flex-positive:1;
        flex-grow:1;
        max-width:100%
    }
    .col-md-auto{
        -ms-flex:0 0 auto;
        flex:0 0 auto;
        width:auto;
        max-width:none
    }
    .col-md-1{
        -ms-flex:0 0 8.333333%;
        flex:0 0 8.333333%;
        max-width:8.333333%
    }
    .col-md-2{
        -ms-flex:0 0 16.666667%;
        flex:0 0 16.666667%;
        max-width:16.666667%
    }
    .col-md-3{
        -ms-flex:0 0 25%;
        flex:0 0 25%;
        max-width:25%
    }
    .col-md-4{
        -ms-flex:0 0 33.333333%;
        flex:0 0 33.333333%;
        max-width:33.333333%
    }
    .col-md-5{
        -ms-flex:0 0 41.666667%;
        flex:0 0 41.666667%;
        max-width:41.666667%
    }
    .col-md-6{
        -ms-flex:0 0 50%;
        flex:0 0 50%;
        max-width:50%
    }
    .col-md-7{
        -ms-flex:0 0 58.333333%;
        flex:0 0 58.333333%;
        max-width:58.333333%
    }
    .col-md-8{
        -ms-flex:0 0 66.666667%;
        flex:0 0 66.666667%;
        max-width:66.666667%
    }
    .col-md-9{
        -ms-flex:0 0 75%;
        flex:0 0 75%;
        max-width:75%
    }
    .col-md-10{
        -ms-flex:0 0 83.333333%;
        flex:0 0 83.333333%;
        max-width:83.333333%
    }
    .col-md-11{
        -ms-flex:0 0 91.666667%;
        flex:0 0 91.666667%;
        max-width:91.666667%
    }
    .col-md-12{
        -ms-flex:0 0 100%;
        flex:0 0 100%;
        max-width:100%
    }
}
@media (min-width:992px){
    .col-lg{
        -ms-flex-preferred-size:0;
        flex-basis:0;
        -ms-flex-positive:1;
        flex-grow:1;
        max-width:100%
    }
    .col-lg-auto{
        -ms-flex:0 0 auto;
        flex:0 0 auto;
        width:auto;
        max-width:none
    }
    .col-lg-1{
        -ms-flex:0 0 8.333333%;
        flex:0 0 8.333333%;
        max-width:8.333333%
    }
    .col-lg-2{
        -ms-flex:0 0 16.666667%;
        flex:0 0 16.666667%;
        max-width:16.666667%
    }
    .col-lg-3{
        -ms-flex:0 0 25%;
        flex:0 0 25%;
        max-width:25%
    }
    .col-lg-4{
        -ms-flex:0 0 33.333333%;
        flex:0 0 33.333333%;
        max-width:33.333333%
    }
    .col-lg-5{
        -ms-flex:0 0 41.666667%;
        flex:0 0 41.666667%;
        max-width:41.666667%
    }
    .col-lg-6{
        -ms-flex:0 0 50%;
        flex:0 0 50%;
        max-width:50%
    }
    .col-lg-7{
        -ms-flex:0 0 58.333333%;
        flex:0 0 58.333333%;
        max-width:58.333333%
    }
    .col-lg-8{
        -ms-flex:0 0 66.666667%;
        flex:0 0 66.666667%;
        max-width:66.666667%
    }
    .col-lg-9{
        -ms-flex:0 0 75%;
        flex:0 0 75%;
        max-width:75%
    }
    .col-lg-10{
        -ms-flex:0 0 83.333333%;
        flex:0 0 83.333333%;
        max-width:83.333333%
    }
    .col-lg-11{
        -ms-flex:0 0 91.666667%;
        flex:0 0 91.666667%;
        max-width:91.666667%
    }
    .col-lg-12{
        -ms-flex:0 0 100%;
        flex:0 0 100%;
        max-width:100%
    }
}
*,::after,::before{
    box-sizing:border-box
}
body{
    margin:0;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
    font-size:1rem;
    font-weight:400;
    line-height:1.5;
    color:#212529;
    text-align:left;
    background-color:#fff
}
h1{
    margin-top:0;
    margin-bottom:.5rem
}
ul{
    margin-top:0;
    margin-bottom:1rem
}
a{
    color:#007bff;
    text-decoration:none;
    background-color:transparent;
    -webkit-text-decoration-skip:objects
}
a:hover{
    color:#0056b3;
    text-decoration:underline
}
input{
    margin:0;
    font-family:inherit;
    font-size:inherit;
    line-height:inherit
}
input{
    overflow:visible
}
h1{
    margin-bottom:.5rem;
    font-family:inherit;
    font-weight:500;
    line-height:1.2;
    color:inherit
}
h1{
    font-size:2.5rem
}
.container{
    width:100%;
    padding-right:15px;
    padding-left:15px;
    margin-right:auto;
    margin-left:auto
}
@media (min-width:576px){
    .container{
        max-width:540px
    }
}
@media (min-width:768px){
    .container{
        max-width:720px
    }
}
@media (min-width:992px){
    .container{
        max-width:960px
    }
}
@media (min-width:1200px){
    .container{
        max-width:1140px
    }
}
.row{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    margin-right:-15px;
    margin-left:-15px
}
.col-12{
    position:relative;
    width:100%;
    min-height:1px;
    padding-right:15px;
    padding-left:15px
}
.col-12{
    -webkit-box-flex:0;
    -ms-flex:0 0 100%;
    flex:0 0 100%;
    max-width:100%
}
.table{
    width:100%;
    max-width:100%;
    margin-bottom:1rem;
    background-color:transparent
}
.form-control{
    display:block;
    width:100%;
    padding:.375rem .75rem;
    font-size:1rem;
    line-height:1.5;
    color:#495057;
    background-color:#fff;
    background-clip:padding-box;
    border:1px solid #ced4da;
    border-radius:.25rem;
    transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out
}
.form-control::-ms-expand{
    background-color:transparent;
    border:0
}
.form-control:focus{
    color:#495057;
    background-color:#fff;
    border-color:#80bdff;
    outline:0;
    box-shadow:0 0 0 .2rem rgba(0,123,255,.25)
}
.form-control::-webkit-input-placeholder{
    color:#ccc8bd;
    opacity:1
}
.form-control::-moz-placeholder{
    color:#ccc8bd;
    opacity:1
}
.form-control:-ms-input-placeholder{
    color:#ccc8bd;
    opacity:1
}
.form-control::-ms-input-placeholder{
    color:#ccc8bd;
    opacity:1
}
.form-control::placeholder{
    color:#ccc8bd;
    opacity:1
}
.form-control:disabled{
    background-color:#e9ecef;
    opacity:1
}
.list-group{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -ms-flex-direction:column;
    flex-direction:column;
    padding-left:0;
    margin-bottom:0
}
.text-center{
    text-align:center!important
}
@media print{
    *,::after,::before{
        text-shadow:none!important;
        box-shadow:none!important
    }
    a:not(.btn){
        text-decoration:underline
    }
    body{
        min-width:992px!important
    }
    .container{
        min-width:992px!important
    }
    .table{
        border-collapse:collapse!important
    }
}
button,hr{
    overflow:visible
}
button,h3,h5{
    font-family:inherit
}
h3,h5,ul{
    margin-top:0
}
hr,ul{
    margin-bottom:1rem
}
.btn,.navbar-toggler-icon,img{
    vertical-align:middle
}
.btn:not(:disabled):not(.disabled),.close:not(:disabled):not(.disabled),.navbar-toggler:not(:disabled):not(.disabled){
    cursor:pointer
}
nav{
    display:block
}
[tabindex="-1"]:focus{
    outline:0!important
}
hr{
    box-sizing:content-box;
    height:0;
    margin-top:1rem;
    border:0;
    border-top:1px solid rgba(0,0,0,.1)
}
h3,h5{
    margin-bottom:.5rem;
    font-weight:500;
    line-height:1.2;
    color:inherit
}
.btn,.d-i,.dropdown-item{
    font-weight:400;
    white-space:nowrap
}
.btn,.btn-sm{
    line-height:1.5
}
a{
    color:#007bff;
    text-decoration:none;
    background-color:transparent;
    -webkit-text-decoration-skip:objects
}
a:hover{
    color:#0056b3;
    text-decoration:underline
}
.btn:focus,.btn:hover,.d-i:active,.dropdown-item:active,.nav-link:focus,.nav-link:hover,.navbar-brand:focus,.navbar-brand:hover,.navbar-toggler:focus,.navbar-toggler:hover{
    text-decoration:none
}
h3{
    font-size:1.75rem
}
.container-fluid{
    width:100%;
    padding-right:15px;
    padding-left:15px;
    margin-right:auto;
    margin-left:auto
}
.btn{
    display:inline-block;
    text-align:center;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
    border:1px solid transparent;
    padding:.375rem .75rem;
    font-size:1rem;
    border-radius:.25rem;
    transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out
}
@media screen and (prefers-reduced-motion:reduce){
    .btn{
        transition:none
    }
}
.btn:focus{
    outline:0;
    box-shadow:0 0 0 .2rem rgba(0,123,255,.25)
}
.btn:disabled{
    opacity:.65
}
.btn-secondary{
    color:#fff;
    background-color:#6c757d;
    border-color:#6c757d
}
.btn-secondary:hover{
    color:#fff;
    background-color:#5a6268;
    border-color:#545b62
}
.btn-secondary:focus{
    box-shadow:0 0 0 .2rem rgba(108,117,125,.5)
}
.btn-secondary:disabled{
    color:#fff;
    background-color:#6c757d;
    border-color:#6c757d
}
.btn-sm{
    padding:.25rem .5rem;
    font-size:.875rem;
    border-radius:.2rem
}
.fade{
    transition:opacity .15s linear
}
@media screen and (prefers-reduced-motion:reduce){
    .fade{
        transition:none
    }
}
.fade:not(.show){
    opacity:0
}
.collapse:not(.show){
    display:none
}
.dropdown{
    position:relative
}
.dropdown-toggle::after{
    display:inline-block;
    width:0;
    height:0;
    margin-left:.255em;
    vertical-align:.255em;
    content:"";
    border-top:.3em solid;
    border-right:.3em solid transparent;
    border-bottom:0;
    border-left:.3em solid transparent
}
.dropdown-toggle:empty::after{
    margin-left:0
}
.dropdown-menu{
    position:absolute;
    top:100%;
    left:0;
    z-index:1000;
    display:none;
    float:left;
    min-width:10rem;
    padding:.5rem 0;
    margin:.125rem 0 0;
    font-size:1rem;
    color:#212529;
    text-align:left;
    list-style:none;
    background-color:#fff;
    background-clip:padding-box;
    border:1px solid rgba(0,0,0,.15);
    border-radius:.25rem
}
.dropdown-menu.show,.nav-link{
    display:block
}
.navbar-brand,.navbar-toggler,h5{
    font-size:1.25rem
}
.d-i,.dropdown-item{
    display:block;
    width:100%;
    padding:.25rem 1.5rem;
    clear:both;
    color:#212529;
    text-align:inherit;
    background-color:transparent;
    border:0
}
.nav-link,.navbar{
    padding:.5rem 1rem
}
.d-i:focus,.d-i:hover,.dropdown-item:focus,.dropdown-item:hover{
    color:#16181b;
    text-decoration:none;
    background-color:#f8f9fa
}
.d-i:active,.dropdown-item:active{
    color:#fff;
    background-color:#007bff
}
.d-i:disabled,.dropdown-item:disabled{
    color:#6c757d;
    background-color:transparent
}
.navbar{
    position:relative;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    -ms-flex-align:center;
    align-items:center;
    -ms-flex-pack:justify;
    justify-content:space-between
}
.navbar>.container{
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    -ms-flex-align:center;
    align-items:center;
    -ms-flex-pack:justify;
    justify-content:space-between
}
.navbar-brand{
    display:inline-block;
    padding-top:.3125rem;
    padding-bottom:.3125rem;
    margin-right:1rem;
    line-height:inherit;
    white-space:nowrap;
    margin-left: 25px;
}
.navbar-nav{
    display:-ms-flexbox;
    display:flex;
    -ms-flex-direction:column;
    flex-direction:column;
    padding-left:0;
    margin-bottom:0;
    list-style:none
}
.navbar-nav .nav-link{
    padding-right:10px;
    padding-left:0
}
.navbar-nav .dropdown-menu{
    position:static;
    float:none
}
.navbar-collapse{
    -ms-flex-preferred-size:100%;
    flex-basis:100%;
    -ms-flex-positive:1;
    flex-grow:1;
    -ms-flex-align:center;
    align-items:center
}
.navbar-toggler{
    padding:.25rem .75rem;
    line-height:1;
    background-color:transparent;
    border:1px solid transparent;
    border-radius:.25rem
}
.navbar-toggler-icon{
    display:inline-block;
    width:1.5em;
    height:1.5em;
    content:"";
    background:center center no-repeat;
    background-size:100% 100%
}
@media (max-width:991.98px){
    .navbar-expand-lg>.container{
        padding-right:0;
        padding-left:0
    }
}
@media (min-width:992px){
    .navbar-expand-lg{
        -ms-flex-flow:row nowrap;
        flex-flow:row nowrap;
        -ms-flex-pack:start;
        justify-content:flex-start
    }
    .navbar-expand-lg .navbar-nav{
        -ms-flex-direction:row;
        flex-direction:row
    }
    .navbar-expand-lg .navbar-nav .dropdown-menu{
        position:absolute
    }
    .navbar-expand-lg .navbar-nav .nav-link{
        padding-right:.5rem;
        padding-left:.5rem
    }
    .navbar-expand-lg>.container{
        -ms-flex-wrap:nowrap;
        flex-wrap:nowrap
    }
    .navbar-expand-lg .navbar-collapse{
        display:-ms-flexbox!important;
        display:flex!important;
        -ms-flex-preferred-size:auto;
        flex-basis:auto
    }
    .navbar-expand-lg .navbar-toggler{
        display:none
    }
}
.navbar-dark .navbar-brand,.navbar-dark .navbar-brand:focus,.navbar-dark .navbar-brand:hover{
    color:#fff
}
.navbar-dark .navbar-nav .nav-link{
    color:rgba(255,255,255,.5)
}
.navbar-dark .navbar-nav .nav-link:focus,.navbar-dark .navbar-nav .nav-link:hover{
    color:rgba(255,255,255,.75)
}
.navbar-dark .navbar-toggler{
    color:rgba(255,255,255,.5);
    border-color:rgba(255,255,255,.1)
}
.navbar-dark .navbar-toggler-icon{
    background-image:url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E")
}
.fixed-top{
    position:fixed;
    top:0;
    right:0;
    left:0;
    z-index:1030
}
.ml-auto{
    margin-left:auto!important
}
*,::after,::before{
    box-sizing:border-box
}
img{
    border-style:none
}
.text-center{
    text-align:center!important
}
@media print{
    a:not(.btn){
        text-decoration:underline
    }
    h3{
        orphans:3;
        widows:3;
        page-break-after:avoid
    }
    .container,body{
        min-width:992px!important
    }
    .navbar{
        display:none
    }
    img{
        page-break-inside:avoid
    }
}
h5{
    margin-top:0;
    margin-bottom:.5rem;
    font-weight:500;
    line-height:1.2;
    color:inherit
}
button{
    border-radius:0;
    margin:0;
    font-size:inherit;
    line-height:inherit;
    text-transform:none
}
button:focus{
    outline:dotted 1px;
    outline:-webkit-focus-ring-color auto 5px
}
button,html [type=button]{
    -webkit-appearance:button
}
[type=button]::-moz-focus-inner,button::-moz-focus-inner{
    padding:0;
    border-style:none
}
button.close{
    padding:0;
    background-color:transparent;
    border:0;
    -webkit-appearance:none
}
.close{
    float:right;
    font-size:1.5rem;
    font-weight:700;
    line-height:1;
    color:#000;
    text-shadow:0 1px 0 #fff;
    opacity:.5
}
.close:focus,.close:hover{
    color:#000;
    text-decoration:none;
    opacity:.75
}
.modal,.modal-open{
    overflow:hidden
}
.modal,.modal-backdrop{
    top:0;
    right:0;
    bottom:0;
    left:0
}
.modal{
    position:fixed;
    z-index:1050;
    display:none;
    outline:0
}
.modal-open .modal{
    overflow-x:hidden;
    overflow-y:auto
}
.modal-dialog{
    position:relative;
    width:auto;
    margin:.5rem;
    pointer-events:none
}
.modal.fade .modal-dialog{
    transition:-webkit-transform .3s ease-out;
    transition:transform .3s ease-out;
    transition:transform .3s ease-out,-webkit-transform .3s ease-out;
    -webkit-transform:translate(0,-25%);
    transform:translate(0,-25%)
}
@media screen and (prefers-reduced-motion:reduce){
    .modal.fade .modal-dialog{
        transition:none
    }
}
.modal.show .modal-dialog{
    -webkit-transform:translate(0,0);
    transform:translate(0,0)
}
.modal-dialog-centered{
    display:-ms-flexbox;
    display:flex;
    -ms-flex-align:center;
    align-items:center;
    min-height:calc(100% - (.5rem * 2))
}
.modal-content{
    position:relative;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-direction:column;
    flex-direction:column;
    width:100%;
    pointer-events:auto;
    background-color:#fff;
    background-clip:padding-box;
    border:1px solid rgba(0,0,0,.2);
    border-radius:.3rem;
    outline:0
}
.modal-backdrop{
    position:fixed;
    z-index:1040;
    background-color:#000
}
.modal-backdrop.fade{
    opacity:0
}
.modal-backdrop.show{
    opacity:.5
}
.modal-header{
    display:-ms-flexbox;
    display:flex;
    -ms-flex-align:start;
    align-items:flex-start;
    -ms-flex-pack:justify;
    justify-content:space-between;
    padding:1rem;
    border-bottom:1px solid #e9ecef;
    border-top-left-radius:.3rem;
    border-top-right-radius:.3rem
}
.modal-header .close{
    padding:1rem;
    margin:-1rem -1rem -1rem auto
}
.modal-title{
    margin-bottom:0;
    line-height:1.5
}
.modal-body{
    position:relative;
    -ms-flex:1 1 auto;
    flex:1 1 auto;
    padding:1rem
}
.modal-footer{
    display:-ms-flexbox;
    display:flex;
    -ms-flex-align:center;
    align-items:center;
    -ms-flex-pack:end;
    justify-content:flex-end;
    padding:1rem;
    border-top:1px solid #e9ecef
}
.modal-footer>:not(:first-child){
    margin-left:.25rem
}
.modal-footer>:not(:last-child){
    margin-right:.25rem
}
.modal-scrollbar-measure{
    position:absolute;
    top:-9999px;
    width:50px;
    height:50px;
    overflow:scroll
}
@media (min-width:576px){
    .modal-dialog{
        max-width:500px;
        margin:1.75rem auto
    }
    .modal-dialog-centered{
        min-height:calc(100% - (1.75rem * 2))
    }
    .modal-sm{
        max-width:300px
    }
}
@media (min-width:992px){
    .modal-lg{
        max-width:800px
    }
}
.notransition{
    -webkit-transition:none!important;
    -moz-transition:none!important;
    -o-transition:none!important;
    transition:none!important
}
@font-face{
    font-family:Uthmani;
    src:url(../fonts/Uthmani.woff2) format('woff2'),url(../fonts/Uthmani.woff) format('woff');
    font-weight:400;
    font-style:normal;
    font-display:swap
}
@font-face{
    font-family:Uthmani-Hafs;
    src:url(../fonts/UthmaniHafs.woff2) format('woff2'),url(../fonts/UthmaniHafs.woff) format('woff');
    font-weight:400;
    font-style:normal;
    font-display:swap
}
@font-face{
    font-family:IndoPak;
    src:url(../fonts/IndoPak.woff2) format('woff2'),url(../fonts/IndoPak.woff) format('woff');
    font-weight:400;
    font-style:normal;
    font-display:swap
}
@font-face{
    font-family:Cabin;
    src:local('Cabin-Bold');
    src:url(../fonts/Cabin-Bold.eot);
    src:url(../fonts/Cabin-Bold.eot?#iefix) format('embedded-opentype'),url(../fonts/Cabin-Bold.woff2) format('woff2'),url(../fonts/Cabin-Bold.woff) format('woff'),url(../fonts/Cabin-Bold.ttf) format('truetype');
    font-weight:700;
    font-style:normal;
    font-display:swap
}
:root{
  /*  --gold:#a98401;*/
   --gold:#8a2121;
}
::-moz-selection,::selection{
    background:var(--gold);
    color:#fff;
    text-shadow:none
}
hr{
    margin-top:8px;
    margin-bottom:0
}
a:hover{
    text-decoration:none
}
.homepage{
    padding-top:40px;
    padding-bottom:40px;
    background-color:#fff
}
.index-main-surah-list{
    margin:0 30px 0 30px
}
.index-surah-no{
    color:var(--gold);
    font-weight:600;
    padding-right:20px;
    margin-top:-19px
}
.index-surahname-ar{
    font-size:15px;
    float:right
}
.letter-Q{
    font-size:210px
}
.homepage-title{
    font-size:160px;
    font-family:Cabin,sans-serif;
    font-weight:700;
    text-align:center;
    color:var(--gold);
    display:inline;
    margin-left:-20px;
    letter-spacing:-8px
}
.tagline{
    color:var(--gold);
    margin-top:-30px;
    margin-bottom:50px;
    font-size:13px;
    font-weight:700
}
.about-heading{
    color:var(--gold);
    font-family:cabin,arial;
    font-size:25px
}
.about-list{
    margin-bottom:-15px
}
.center-block{
    display:block;
    margin-left:auto;
    margin-right:auto;
    margin-bottom:20px;
    text-align:justify
}
.bismillah-div{
    padding-top:85px
}
.bismillah{
    background-image:url(../images/bismillah.png);
    background-repeat:no-repeat;
    background-position:center;
    background-size:295px 65px;
    width:295px;
    height:65px;
    margin-left:auto;
    margin-right:auto
}
.bismillah-english{
    font-size:12px;
    color:#999
}
button{
    touch-action:manipulation
}
.btn:active,.btn:focus,button:focus{
    outline:0!important;
    box-shadow:none
}
.btn{
    border-radius:0
}
.dropdown-menu{
    max-height:335px;
    overflow-y:scroll;
    border-radius:0;
    margin-top:9px
}
.dropdown-menu::-webkit-scrollbar-track{
    background-color:#f5f5f5
}
.list-group::-webkit-scrollbar-track{
    background-color:#fff
}
.dropdown-menu::-webkit-scrollbar,.list-group::-webkit-scrollbar{
    width:10px;
    background-color:var(--gold)
}
.dropdown-menu::-webkit-scrollbar-thumb,.list-group::-webkit-scrollbar-thumb{
    background-color:var(--gold)
}
.dropdown-toggle::after{
    display:none
}
.d-i:active,.dropdown-item:active{
    background-color:var(--gold)
}
.d-i{
    cursor:pointer;
    display:block;
    width:100%;
    padding:.25rem 1.5rem;
    clear:both;
    color:#212529;
    text-align:inherit;
    background-color:transparent;
    border:0;
    font-weight:400;
    white-space:nowrap
}
.d-i-highlight{
    background-color:var(--gold);
    color:#fff
}
.d-i:focus,.d-i:hover{
    color:#16181b;
    text-decoration:none;
    background-color:#f8f9fa
}
.collapsing{
    position:relative;
    height:0;
    overflow:hidden;
    transition:height .45s ease
}
.bg-gold{
    /*background-color:var(--gold);*/
    background-color:#992121;
}
.navbar-toggler-icon{
    width:1.2em;
    height:1.2em
}
.nav-link,.navbar{
    padding:.3em 1rem .3em 1em
}
.fixed-top{
    box-shadow:0 1px 10px #ccc
}
.nav-link{
    font-size:15px
}
.nav-settings{
    margin-bottom:20px;
    display:inline
}
.ns-b-h{
    max-width:35%;
    flex:35%
}
.ns-b-b{
    max-width:15%;
    flex:15%
}
.btn-nav{
    color:#fff;
    background-color:var(--gold);
    border-color:var(--gold);
    margin-right:5px;
    float:right;
    margin-bottom:10px
}
.full-surah{
    padding-bottom:50px
}
.home-icon{
    display:none
}
.navbar-brand{
    font-size:20px
}
.nav-link{
    outline:0
}
.navbar-toggler{
    padding:0;
    background:0 0;
    border:0;
        background: #992121;
    border-radius: 0px;
    position: fixed;
    right: 0;
    height: 40px;
    width: 50px;top: 0;
}
.navbar-toggler:active,.navbar-toggler:focus{
    outline:0
}
.navbar-toggler .icon-bar{
    display:block;
    width:22px;
    height:2px;
    border-radius:1px;
    margin:4px 0 4px 0;
    transition:all .5s
}
.navbar-dark .navbar-toggler .icon-bar{
    background:#fff
}
.navbar-toggler .icon-bar:nth-of-type(1){
    transform:rotate(45deg);
    transform-origin:10% 10%
}
.navbar-toggler .icon-bar:nth-of-type(2){
    opacity:0
}
.navbar-toggler .icon-bar:nth-of-type(3){
    transform:rotate(-45deg);
    transform-origin:10% 90%
}
.navbar-toggler.collapsed .icon-bar:nth-of-type(1){
    transform:rotate(0)
}
.navbar-toggler.collapsed .icon-bar:nth-of-type(2){
    opacity:1
}
.navbar-toggler.collapsed .icon-bar:nth-of-type(3){
    transform:rotate(0)
}
.nav-slash{
    color:rgba(255,255,255,.5)
}
.surah-nav-ar{
    font-weight:300;
    font-size:15px
}
.surah-nav-margin{
    padding-bottom:70px
}
.navbar-toggler,.navbar-toggler:focus,.navbar-toggler:hover{
    border:0
}
.navbar-nav{
    flex-direction:row
}
.navbar-nav .dropdown-menu{
    position:absolute
}
.ml-auto{
    margin-right:20px
}
a.about-link,a.surah-nav-links{
    color:var(--gold)
}
a.surah-nav-links{
    font-size:15px;
    text-transform:uppercase;
    transition:none
}
a.surah-selector-link{
    color:#000;
    text-decoration:none
}
a.surah-selector-link:hover{
    color:var(--gold);
    text-decoration:none
}
.s-a,.single-ayah{
    padding-top:3px;
    margin-top:-5px
}
.a,.ayah{
    display:inline-block;
    width:100%;
    padding:10px 0 10px 0
}
.a:hover,.ayah-hover,.ayah:hover,.f-t-hover,.f-t:hover,.full-translation:hover{
    background-color:#e3e6b799;
    cursor:pointer
}
.f-t,.full-translation{
    font-size:23px;
    text-align:justify;
    color:#959494;
    padding-right:0;
    padding-left:0
}

.f-t-l{
    font-size:23px;
    text-align:right;
    color:#5a9f19;
    padding-right:0;
    padding-left:0;
    margin-top: -20px;
}
.wa,.wl,.wt,w-a,w-l,w-t{
    display:block
}
.sw,.w,.word,s-w{
    text-align:center;
    float:right;
    margin:0 8px;
    cursor:pointer
}
.AR,.wa,w-a{
    font-family:Uthmani;
    text-align:right;
    font-size:50px;
    margin:-2px 0 -5px -5px;
    border-bottom:1px solid transparent
}
.AR-hover,.AR:hover,.w-a-hover,.wa-hover,.wa:hover,w-a:hover{
    color:var(--gold)
}
.AR-hover,.w-a-hover,.wa-hover{
    border-bottom:1px solid var(--gold)
}
.TR,.TRL,.wl,.wt,w-l,w-t{
    font-size:10px;
    font-family:arial;
    color:#999;
    direction:ltr
}
.TRL,.wl,w-l{
    padding-top:5px;
    padding-bottom:10px
}
.TR,.wt,w-t{
    padding-top:10px;
    padding-bottom:0px
}
.a-n,.ayah-number{
    font-family:Uthmani;
    margin:90px 25px 0 0;
    color:var(--gold);
    font-size:20px
}
.a-n-a .a-n,.ayah-number-after .ayah-number{
    padding-left:25px;
    margin-top:40px;
    margin-right:-8px
}
.f-t .a-n,.full-translation .ayah-number{
    margin:0;
    font-size:inherit;
    display:inline
}
.f-t .a-n:after{
    content:'.'
}
.a-n-m,.ayah-number-mobile{
    text-align:center;
    color:var(--gold);
    margin-bottom:-20px;
    font-size:18px;
    font-weight:500
}
.a-n-b,.ayah-number-before{
    display:block;
    text-align:right!important
}
.a-n-a,.ayah-number-after{
    display:none
}
.modal-content{
    border:0;
    border-radius:0;
    background-color:#ffff0
}
.continue-reading-margin{
    margin:20px 0 -20px 0
}
.left-icon{
    font-size:15px;
    padding-right:5px
}
.right-icon{
    font-size:15px;
    padding-left:5px
}
.btn-gold{
    color:#fff;
    background-color:var(--gold);
    border-color:var(--gold);
    font-size:15px;
    text-transform:uppercase;
    margin-top:0
}
.btn-gold:hover,.btn:hover{
    color:var(--gold);
    background-color:transparent;
    border-color:var(--gold)
}
.gold{
    color:var(--gold)
}
.loader{
    display:block;
    position:fixed;
    left:0;
    top:0;
    width:100%;
    height:100%;
    z-index:0;
    background:url(../images/loading.png) 50% 50% no-repeat transparent;
    background-size:150px
}
.chevron-down,.chevron-down-nav,.chevron-left,.chevron-right,.chevron-up,.chevron-up-nav{
    background-image:url(../images/menu.png);
    background-size: cover;
}
.chevron-down{
    background-repeat:no-repeat;
    filter:brightness(0) invert(1);
    width:10px;
    height:10px;
    display:inline-block;
    margin-bottom:-1px
}
.chevron-up{
    background-repeat:no-repeat;
    filter:brightness(0) invert(1);
    width:10px;
    height:10px;
    display:inline-block;
    margin-bottom:-1px
}
.chevron-down-nav,.chevron-up-nav{
    background-repeat:no-repeat;
    filter:brightness(0) invert(1);
    width: 35px;
    height: 25px;
    display:inline-block;
    margin-bottom:-2px
}
.chevron-up,.chevron-up-nav{
    transform:rotate(180deg)
}
.chevron-left{
    transform:rotate(90deg)
}
.chevron-right{
    transform:rotate(270deg)
}
.chevron-left,.chevron-right{
    background-repeat:no-repeat;
    display:inline-block;
    width:12px;
    height:12px;
    margin-bottom:-1px
}
.modal-body .col-6{
    -ms-flex:0 0 100%;
    flex:0 0 100%;
    max-width:100%;
    padding-left:0;
    padding-right:0
}
.bottom-nav{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    font-family:inherit;
    font-size:14px;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
    border-top:1px solid #ccc;
    background:#fff;
    box-shadow:0 -1px 10px #ccc
}
.bottom-nav__inner{
    width:85%;
    display:flex;
    max-width:1440px;
    margin:auto
}
.bottom-nav__item{
    justify-content:center
}
.bottom-nav-surahplayer,.bottom-nav-surahplayer2{
    width:60%;
    padding:0 20px;
    text-align:center;
    padding-top:11px;
    cursor:pointer
}
.bottom-nav__item.bottom-nav__item--nextsurah,.bottom-nav__item.bottom-nav__item--prevsurah{
    width:20%;
    text-align:center;
    height:50px;
    padding-top:10px
}
.play-icon{
    background-image:url(../images/play.png)
}
.pause-icon{
    background-image:url(../images/pause.png)
}
.play-pause-icon{
    width:18px;
    height:18px;
    display:inline-block;
    background-size:15px;
    background-repeat:no-repeat;
    margin-bottom:-5px
}
.bottom-nav-surahname{
    padding-left:5px;
    padding-right:5px
}
#bottom-nav-surahayah{
    display:none
}
.back-to-ayah{
    display:none;
    position:fixed;
    bottom:50px;
    right:30px;
    z-index:99;
    border:0;
    outline:0;
    background-color:var(--gold);
    color:#fff;
    cursor:pointer;
    padding:10px;
    border-radius:0;
    font-size:15px
}
.back-to-ayah:hover{
    background-color:#555
}
.last-read{
    display:none;
    font-size:19px;
    padding-bottom:20px
}
a.last-read-link{
    color:var(--gold);
    border-bottom:1px solid var(--gold);
    text-transform:uppercase;
    font-size:15px
}
h5.modal-about{
    margin-top:20px;
    color:#7e7e7e
}
a.modal-about-link{
    color:var(--gold)
}
a.modal-about-link:hover{
    text-decoration:underline
}
a.surah-name-duas,a.surah-name-duas:hover{
    font-size:20px;
    color:var(--gold);
    font-weight:600;
    border-bottom:1px solid
}
.sajda-icon{
    background-image:url(../images/sajda.png);
    width:30px;
    height:45px;
    display:inline-block;
    background-size:25px;
    background-repeat:no-repeat;
    margin-top:20px
}
.offline-message{
    color:var(--gold);
    font-size:16px
}
.offline-message:hover{
    border-bottom:1px solid;
    cursor:pointer
}
.wl{
    padding-bottom:2px
}
.wt{
    padding-top:0;
    color:#6d6d6d
}
.a-n{
    margin-top:65px
}
.nav-settings-col{
    flex:0 0 50%!important;
    max-width:50%!important
}
@media only screen and (min-device-width:300px) and (max-device-width:667px) and (-webkit-min-device-pixel-ratio:2) and (orientation:portrait){
    .index-main-surah-list{
        margin:0
    }
    .index-surah-list{
        flex:100%;
        max-width:100%;
        border-bottom:1px #ebebeb solid;
        padding-bottom:5px;
        margin-bottom:5px
    }
    .index-row-1{
        font-size:20px
    }
    .index-row-2{
        margin-top:0
    }
    .index-surah-no{
        flex:13%;
        max-width:13%;
        font-size:16px
    }
    .index-surahname,.index-surahname-en{
        flex:56%;
        max-width:56%
    }
    .index-surah-verses,.index-surahname-ar{
        flex:31%;
        max-width:31%
    }
    h5{
        font-size:15px
    }
    .homepage{
        padding-top:0;
        padding-bottom:20px
    }
    .homepage-title{
        font-size:100px;
        letter-spacing:-5px
    }
    .letter-Q{
        font-size:150px
    }
    .tagline{
        font-size:10px;
        margin-top:-30px
    }
    a.homepage-links{
        font-size:14px
    }
    .nav-link,.navbar{
        padding:.5em 1rem .5em 1em
    }
    .nav-link{
        font-size:16px
    }
    .nav-settings{
        flex:0 0 50%;
        max-width:50%
    }
    .ns-b-h{
        max-width:70%;
        flex:70%
    }
    .ns-b-b{
        max-width:30%;
        flex:30%
    }
    .nav-surahname-en{
        display:none
    }
    li.nav-item{
        padding-right:14px
    }
    .surah-selector{
        max-width:50%;
        flex:50%
    }
    .n-s{
        font-size:15px
    }
    .AR,.wa,w-a{
        font-size:30px
    }
    .TR,.TRL,.wl,.wt,w-l,w-t{
        font-size:8px
    }
    .f-t,.full-translation{
        font-size:20px
    }
    .a-n,.ayah-number{
        font-size:14px;
        margin:50px 5px 0 -20px
    }
    .bismillah{
        background-size:220px 50px;
        width:220px;
        height:50px
    }
    .bismillah-english{
        font-size:8px
    }
    .btn-load-surah,a.surah-nav-links{
        font-size:17px
    }
    .surah-nav-ar{
        display:none
    }
    .center-block{
        max-width:100%;
        flex:0 0 100%
    }
    #back-to-top{
        width:35px;
        padding:0;
        right:5px
    }
    .s-a,.single-ayah{
        flex:0 0 100%;
        max-width:100%
    }
    .a-n-b,.ayah-number-before{
        display:none
    }
    .a-n-a,.ayah-number-after{
        display:block
    }
    .chevron-left,.chevron-right{
        margin-top:5px
    }
    .navbar{
        padding:.1em 1rem .1em 1em
    }
    .back-to-ayah{
        right:15px
    }
    .bottom-nav__inner{
        width:100%
    }
    .bottom-nav__item.bottom-nav__item--nextsurah,.bottom-nav__item.bottom-nav__item--prevsurah{
        width:42.5%;
        padding-top:9px
    }
    .bottom-nav__item.bottom-nav__item--prevsurah{
        text-align:left;
        padding-left:10px
    }
    .bottom-nav__item.bottom-nav__item--nextsurah{
        text-align:right;
        padding-right:10px
    }
    .bottom-nav-surahplayer,.bottom-nav-surahplayer2{
        width:15%;
        padding:0 10px
    }
    a.surah-nav-links{
        font-size:14px!important
    }
    .bottom-nav-surahname{
        display:none
    }
    .play-pause-icon{
        margin-bottom:-16px
    }
    #bottom-nav-surahayah{
        display:none!important
    }
    .last-read{
        font-size:15px
    }
    .sajda-icon{
        background-size:17px;
        margin-top:10px
    }
    .offline-message{
        font-size:15px
    }
    .a-n-a .a-n{
        margin-top:15px
    }
    .nav-settings-col{
        flex:inherit!important;
        max-width:inherit!important
    }
}
@media only screen and (min-device-width:375px) and (max-device-width:667px) and (-webkit-min-device-pixel-ratio:2) and (orientation:landscape){
    .index-main-surah-list{
        margin:0
    }
    .index-row-1{
        font-size:15px
    }
    .index-row-2{
        font-size:9px
    }
    .index-surah-list{
        flex:50%;
        max-width:50%;
        margin-right:0;
        margin-left:0
    }
    .index-surah-no{
        flex:13%;
        max-width:13%
    }
    .index-surah-verses,.index-surahname-ar{
        flex:27%;
        max-width:27%
    }
    .index-surahname,.index-surahname-en{
        flex:55%;
        max-width:55%
    }
    .surah-nav-ar{
        display:none
    }
    .homepage-title{
        font-size:100px;
        letter-spacing:-5px
    }
    .letter-Q{
        font-size:150px
    }
    .homepage{
        padding-top:0
    }
    .container{
        max-width:650px
    }
    .AR,.wa,w-a{
        font-size:40px
    }
    .a,.ayah{
        margin-right:-40px
    }
    .f-t,.full-translation{
        font-size:8px
    }
    .a-n,.ayah-number{
        font-size:16px;
        margin-top:60px
    }
    .navbar{
        padding:0 1rem 0 1em
    }
    .nav-link{
        padding:.5em 1rem .5em 1em
    }
    .nav-settings{
        flex:0 0 50%;
        max-width:100%
    }
    .nav-four-btn,.nav-four-btn-heading{
        flex:0 0 50%;
        max-width:50%
    }
    li.nav-item{
        padding-right:15px
    }
    #back-to-top{
        right:15px
    }
    .bottom-nav__inner{
        width:100%
    }
    .bottom-nav-surahplayer,.bottom-nav-surahplayer2{
        width:50%
    }
    .bottom-nav__item.bottom-nav__item--nextsurah,.bottom-nav__item.bottom-nav__item--prevsurah{
        width:25%
    }
    #bottom-nav-surahayah{
        display:none!important
    }
    .nav-settings-col{
        flex:inherit!important;
        max-width:inherit!important
    }
}
@media only screen and (min-device-width:668px) and (max-device-width:991px){
    .nav-link,.navbar{
        padding:.5em 1rem .5em 1em
    }
    .nav-link{
        font-size:20px
    }
    li.nav-item{
        padding-right:15px
    }
    .nav-settings-col{
        flex:inherit!important;
        max-width:inherit!important
    }
}
/* Pintu Kabah Quran - Unified 5-color theme */
:root {
  --bg-light: #F8F9FA;
  --deep-navy: #003354;
  --gray-200: #E5E7EB;
  --teal-green: #148F87;
  --warm-yellow: #FFB606;
}

html, body { background: var(--bg-light) !important; }

/* Global navigation */
.bg-gold,
.navbar,
.navbar-toggler { background: var(--deep-navy) !important; }
.fixed-top { box-shadow: 0 2px 10px rgba(0,51,84,.18) !important; border-bottom: 4px solid var(--warm-yellow) !important; }
.nav-link, .navbar-brand, .navbar-brand-p, .navbar-brand-ayat { color: var(--bg-light) !important; }
a.about-link, a.surah-nav-links { color: var(--teal-green) !important; }

/* Remove the old orange/red header artwork on the Surah page */
.to-surah, .to-ayat { background: var(--deep-navy) !important; }
.to-surah img, .to-ayat img { display: none !important; }

/* JUZ / selector dropdown */
.dropdown-menu.ayah-selector,
.ayah-selector {
  background: var(--bg-light) !important;
  border: 1px solid var(--gray-200) !important;
  box-shadow: 0 10px 28px rgba(0,51,84,.18) !important;
  border-radius: 0 0 14px 14px !important;
  padding: 8px !important;
}
.ayah-selector .d-i {
  color: var(--deep-navy) !important;
  background: #F8F9FA !important;
  border-bottom: 1px solid var(--gray-200) !important;
  border-radius: 9px !important;
  margin: 4px 0 !important;
  padding: 11px 16px !important;
  font-weight: 600 !important;
  transition: .18s ease !important;
}
.ayah-selector .d-i:hover,
.ayah-selector .d-i:focus {
  color: var(--deep-navy) !important;
  background: rgba(20,143,135,.12) !important;
  border-color: var(--teal-green) !important;
}
.ayah-selector .d-i:active,
.ayah-selector .d-i-highlight {
  color: var(--deep-navy) !important;
  background: var(--warm-yellow) !important;
}
.dropdown-menu::-webkit-scrollbar-thumb,
.list-group::-webkit-scrollbar-thumb { background: var(--teal-green) !important; }
.dropdown-menu::-webkit-scrollbar { background: var(--gray-200) !important; }

/* Surah cards */
body.body { background: var(--bg-light) !important; }
.colom-surah {
  background: #FFFFFF !important;
  color: var(--deep-navy) !important;
  border: 1px solid var(--gray-200) !important;
  box-shadow: 0 3px 12px rgba(0,51,84,.08) !important;
}
.colom-surah:hover {
  background: rgba(20,143,135,.08) !important;
  border-color: var(--teal-green) !important;
}
.colom-surah p { color: var(--deep-navy) !important; opacity: .72; }
.arab { color: var(--deep-navy) !important; }

/* Search */
.form { background: var(--teal-green) !important; }
.input[type="search"] { border: 1px solid var(--gray-200) !important; }
.button { background: var(--deep-navy) !important; color: var(--bg-light) !important; }

/* Quran ayah accents */
.a-n, .ayah-number, .a-n-m, .ayah-number-mobile { color: var(--teal-green) !important; }
.AR-hover, .AR:hover, .w-a-hover, .wa-hover, .wa:hover, w-a:hover { color: var(--teal-green) !important; }
.AR-hover, .w-a-hover, .wa-hover { border-bottom-color: var(--teal-green) !important; }
.a:hover, .ayah-hover, .ayah:hover, .f-t-hover, .f-t:hover, .full-translation:hover { background: rgba(20,143,135,.08) !important; }
.f-t-l { color: var(--deep-navy) !important; }

/* Ayah separator */
.garis { border-bottom-color: var(--gray-200) !important; }

/* Quran reader controls */
.tab-label { background: var(--teal-green) !important; }
.tab-label:hover, .input:checked + .tab-label { background: var(--deep-navy) !important; }
.tab-close { background: var(--deep-navy) !important; }
.tab-close:hover { background: var(--teal-green) !important; }
.btn-gold, .btn-nav { background: var(--teal-green) !important; border-color: var(--teal-green) !important; color: var(--bg-light) !important; }
.btn-gold:hover, .btn:hover { color: var(--deep-navy) !important; border-color: var(--teal-green) !important; }

/* Modals / Penanda / Murajaah style */
.modal-content {
  background: var(--bg-light) !important;
  border: 1px solid var(--gray-200) !important;
  box-shadow: 0 12px 35px rgba(0,51,84,.18) !important;
}
.modal-header, .modal-footer { border-color: var(--gray-200) !important; }
.modal-header { background: var(--deep-navy) !important; color: var(--bg-light) !important; }
.modal-header .modal-title, .modal-header .close { color: var(--bg-light) !important; }
.modal-footer .btn, .modal-content .btn-secondary { background: var(--deep-navy) !important; border-color: var(--deep-navy) !important; color: var(--bg-light) !important; }
.modal-footer .btn:hover, .modal-content .btn-secondary:hover { background: var(--teal-green) !important; border-color: var(--teal-green) !important; }

/* Reader audio panel */
#PlayAud .modal-content { border-top: 4px solid var(--teal-green) !important; }
#PlayAud .modal-footer .btn { background: var(--deep-navy) !important; }
#PlayAud .modal-footer .btn:hover { background: var(--teal-green) !important; }
.social li:hover { background: var(--teal-green) !important; color: var(--bg-light) !important; }
.setclose { background: var(--deep-navy) !important; }
.d-i p { color: var(--deep-navy) !important; }

/* Bottom navigation */
.bottom-nav { background: var(--bg-light) !important; border-top: 1px solid var(--gray-200) !important; box-shadow: 0 -2px 12px rgba(0,51,84,.12) !important; }
.bottom-nav__item { color: var(--deep-navy) !important; }

/* Voice and misc controls */
#micvoice { border-color: var(--teal-green) !important; background: transparent !important; }

/* Old inline theme colors that occur in the reader */
[style*="#992121"], [style*="#9d0000"], [style*="#900"], [style*="#ed3020"] { background-color: var(--deep-navy) !important; border-color: var(--deep-navy) !important; }