/* Quran reading pages: /readquran, /readquran1 and the chapter/content pages rendered from the
   database (verse list, navigator bar, tafsir accordion, chapter nav, language fonts, AJAX loader). */

/* Per-language scripts (QuranLanguages.Font); files live under wwwroot/font/<family>/ */
@font-face{font-family:'NotoNastaliqUrdu';src:url('/font/NotoNastaliqUrdu/NotoNastaliqUrdu-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'NotoNastaliqUrdu';src:url('/font/NotoNastaliqUrdu/NotoNastaliqUrdu-Medium.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:'NotoNastaliqUrdu';src:url('/font/NotoNastaliqUrdu/NotoNastaliqUrdu-SemiBold.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:'NotoNastaliqUrdu';src:url('/font/NotoNastaliqUrdu/NotoNastaliqUrdu-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:'ScheherazadeNew';src:url('/font/ScheherazadeNew/ScheherazadeNew-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'ScheherazadeNew';src:url('/font/ScheherazadeNew/ScheherazadeNew-Medium.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:'ScheherazadeNew';src:url('/font/ScheherazadeNew/ScheherazadeNew-SemiBold.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:'ScheherazadeNew';src:url('/font/ScheherazadeNew/ScheherazadeNew-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
.korean #quransurahverses ol li span,.korean .basmallah,.korean .chapterno,.korean #explore-quran-intro-txt h3,.korean #explore-quran-intro-txt #quransurahverses{font-family:Korean !important}
.chinese #quransurahverses ol li span,.chinese .basmallah,.chinese .chapterno,.chinese #explore-quran-intro-txt h3,.chinese #explore-quran-intro-txt #quransurahverses{font-family:Chinese !important}
.category-read-quran-hindi .quranverse{font-family: "Hindi - normal"}
.postid-778 #paragrapgviewwidget,.postid-778 #quranexploretafsir{display:none}
#explore-quran-intro-txt .kad-post-navigation{padding-top:30px}
#explorequransearchbar{
/*background: linear-gradient(180deg, rgb(125, 111, 111) 0%, rgb(91, 78, 78) 100%);*/
background: linear-gradient(0deg, rgba(154,176,176,1) 0%, rgba(205,217,217,1) 100%);
padding-top:20px;padding-bottom:20px}
.language-label,.chapter-label{/*color:#fff;*/font-weight:bold;color:#383838}
.language-label,.chapter-label,.language-select,.chapter-select{margin-right:20px}
#explorequransearch .wpcf7-form-control-wrap.chapter-surah .select2-container{max-width:500px;width:450px}
#explorequransearch .wpcf7 input.wpcf7-submit{padding:9px 18px 8px 18px !important;font-size:14px;background:#4eb8e9}
.readquransubmit button{    background: #4eb8e9;
    color: #fff;
    border: none;
    padding: 5px 20px 0 20px;
    line-height: 35px;
    position: relative;
    top: 3px;
display:none;
}
.readquransubmit button i{font-size:20px}
#explorequransearch .select2-container{background:#fff !important}
#explorequransearch form{/*background:green;*/max-width:1300px;margin:0 auto}
#explorequransearch #forminner{text-align:center}
#explorequransearch .wpcf7 form.sent .wpcf7-response-output{display:none !important}
#explorequransearch .wpcf7 form.failed .wpcf7-response-output{display:none !important}
.chapterno span{font-size:smaller}
.basmallah{color: #191919;font-size: larger;line-height: 2.5em;
/*font-weight: bolder;*/}
.basmallahpar{margin-left:20px}
#explorequranpagetitle{text-align:center;position: relative;top:-100px;height:0}
#explorequranpagetitle{margin-top:-100px}
#explorequranpagetitle .widget-title{color:#383838;color:#fff;
margin-top:-100px;
}
#explorepart{margin-top:-20px}
#explorepart h3{font-size:24px;line-height: 1.1;}
.read-quran-post .entry-title{display:none}
#quransurahverses li{color:#666;font-size:larger;line-height:3em}
#quransurahverses li span{color:#191919;line-height:2em}
#quransurahverses li div{margin-right:25px}
#quransurahverses{padding:60px;background:#fff;overflow-y:auto;max-height: 800px}
.read-quran-post .kad-post-navigation{text-align:center}
.read-quran-post .kad-post-navigation{
background: rgb(154,176,176);
background: linear-gradient(0deg, rgba(154,176,176,1) 0%, rgba(205,217,217,1) 100%);
padding:10px;color:#fff;margin-top:30px !important;font-weight:bolder}
.read-quran-post .kad-previous-link,.read-quran-post .kad-next-link{font-size:smaller;font-weight:normal;margin-top:-55px;background:#4eb8e9}
.read-quran-post .kad-previous-link a,.read-quran-post .kad-next-link a{color:#fff}
.kad-post-navfoot{padding-top: 75px}
.kad-post-navfoot .kad-previous-link a,.kad-post-navfoot .kad-next-link a{
/*background: rgba(0,0,0,.05);*/
transition: background .6s ease-out;
-webkit-transition: background .6s ease-out;
-moz-transition: background .6s ease-out;
-o-transition: background .6s ease-out
}
.kad-post-navfoot  .kad-previous-link a::before{
    font-family: virtue_icons;
    font-style: normal;
    speak: none;
    vertical-align: bottom;
    font-weight: 400;
    content: "\e3b7";
    padding-right: 3px;
    -webkit-font-smoothing: antialiased;
}
.kad-post-navfoot .kad-next-link a::after{
    font-family: virtue_icons;
    font-style: normal;
    speak: none;
    font-weight: 400;
    vertical-align: bottom;
    content: "\e3b5";
    padding-left: 3px;
    -webkit-font-smoothing: antialiased;
}
.paragraphview{display:inline;line-height: 1.7em !important;}
.paragraphview:before{color:red;font-size:10px;position:relative;top:-10px;margin-left: 0px !important;margin-right: 5px !important;padding: 0.4em 0.6em !important;}
.paragraphview span{margin-left: 0px !important;display: inline !important;}
#quransurahverses ol{counter-reset:item;list-style:none;position:relative}
#quransurahverses ol li:before{content: counter(item);counter-increment:item;color:#383838;margin-left:-2em;
padding: 0.7em 0.8em;
font-size:0.7em;
/*border: 1px #383838 solid;*/}
#quransurahverses ol li span{margin-left:20px;display:block;margin-top:-2.5em}
/* RTL scripts (Urdu, Sindhi, Pashto): mirror the counter/text margins so the verse number
   sits to the right of the text instead of overlapping it. */
#quransurahverses[dir="rtl"] ol li:before{margin-left:0;margin-right:-2em}
#quransurahverses[dir="rtl"] ol li span{margin-left:0;margin-right:20px}
.normviewbreak{display:none}
.normviewbreakextra{display:block !important;line-height: 20px;}
#quranexploretafsir{margin-top:0px}
.read-quran-post .panel-heading .accordion-toggle{
color:#383838;
background: rgb(154,176,176);
background: linear-gradient(0deg, rgba(154,176,176,1) 0%, rgba(205,217,217,1) 100%);}
.read-quran-post .panel-heading .accordion-toggle h5{font-size:20px}
.read-quran-post .panel-body{background:#fff;padding:15px 50px}
#quranexploretafsircont .panel-body{overflow-y:auto;
max-height: 800px;font-size:17px}
#quranexploretafsir .tafsirverseno{font-size:smaller;font-weight:bold;color:#666}
@font-face{font-family: "Chinese";font-style: normal;font-weight: 400;src:,url("/media/2022/04/SimSun-01.woff2.html") format("woff2");font-display: swap;}
@font-face{font-family: "Korean";font-style: normal;font-weight: 400;src:url("/media/2022/03/UnGungseo.woff") format("woff"),url("/media/2022/03/UnGungseo.woff") format("woff");font-display: swap;}
@font-face{font-family: "Hindi - normal";font-style: normal;font-weight: 400;src:url("/media/2020/11/Shiva-Normal.woff") format("woff"),url("/media/2020/11/Shiva-Normal.woff") format("woff");font-display: swap;}
/* --- post 8255 (Read Quran Introduction English): SiteOrigin per-page layout CSS, copied verbatim
   from the dump's siteorigin-panels-layouts-head style block --- */
#pgc-8255-0-0 , #pgc-8255-1-0 , #pgc-8255-2-0 , #pgc-8255-3-0 { width:100%;width:calc(100% - ( 0 * 30px ) ) } #pg-8255-0 , #pg-8255-1 , #pg-8255-2 , #pl-8255 .so-panel { margin-bottom:30px } #pl-8255 .so-panel:last-child { margin-bottom:0px } #pg-8255-0.panel-no-style, #pg-8255-0.panel-has-style > .panel-row-style , #pg-8255-1.panel-no-style, #pg-8255-1.panel-has-style > .panel-row-style , #pg-8255-2.panel-no-style, #pg-8255-2.panel-has-style > .panel-row-style , #pg-8255-3.panel-no-style, #pg-8255-3.panel-has-style > .panel-row-style { -webkit-align-items:flex-start;align-items:flex-start } @media (max-width:780px){ #pg-8255-0.panel-no-style, #pg-8255-0.panel-has-style > .panel-row-style , #pg-8255-1.panel-no-style, #pg-8255-1.panel-has-style > .panel-row-style , #pg-8255-2.panel-no-style, #pg-8255-2.panel-has-style > .panel-row-style , #pg-8255-3.panel-no-style, #pg-8255-3.panel-has-style > .panel-row-style { -webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column } #pg-8255-0 > .panel-grid-cell , #pg-8255-0 > .panel-row-style > .panel-grid-cell , #pg-8255-1 > .panel-grid-cell , #pg-8255-1 > .panel-row-style > .panel-grid-cell , #pg-8255-2 > .panel-grid-cell , #pg-8255-2 > .panel-row-style > .panel-grid-cell , #pg-8255-3 > .panel-grid-cell , #pg-8255-3 > .panel-row-style > .panel-grid-cell { width:100%;margin-right:0 } #pl-8255 .panel-grid-cell { padding:0 } #pl-8255 .panel-grid .panel-grid-cell-empty { display:none } #pl-8255 .panel-grid .panel-grid-cell-mobile-last { margin-bottom:0px }  }
/* --- post 489 (Read Quran Chapter 1 English, ported as /readquran1): SiteOrigin per-page layout CSS,
   copied verbatim from the dump's siteorigin-panels-layouts-head style block --- */
#pgc-489-0-0 , #pgc-489-1-0 , #pgc-489-2-0 , #pgc-489-3-0 { width:100%;width:calc(100% - ( 0 * 30px ) ) } #pg-489-0 , #pg-489-1 , #pg-489-2 , #pl-489 .so-panel { margin-bottom:30px } #pl-489 .so-panel:last-child { margin-bottom:0px } #pg-489-0.panel-no-style, #pg-489-0.panel-has-style > .panel-row-style , #pg-489-1.panel-no-style, #pg-489-1.panel-has-style > .panel-row-style , #pg-489-2.panel-no-style, #pg-489-2.panel-has-style > .panel-row-style , #pg-489-3.panel-no-style, #pg-489-3.panel-has-style > .panel-row-style { -webkit-align-items:flex-start;align-items:flex-start } @media (max-width:780px){ #pg-489-0.panel-no-style, #pg-489-0.panel-has-style > .panel-row-style , #pg-489-1.panel-no-style, #pg-489-1.panel-has-style > .panel-row-style , #pg-489-2.panel-no-style, #pg-489-2.panel-has-style > .panel-row-style , #pg-489-3.panel-no-style, #pg-489-3.panel-has-style > .panel-row-style { -webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column } #pg-489-0 > .panel-grid-cell , #pg-489-0 > .panel-row-style > .panel-grid-cell , #pg-489-1 > .panel-grid-cell , #pg-489-1 > .panel-row-style > .panel-grid-cell , #pg-489-2 > .panel-grid-cell , #pg-489-2 > .panel-row-style > .panel-grid-cell , #pg-489-3 > .panel-grid-cell , #pg-489-3 > .panel-row-style > .panel-grid-cell { width:100%;margin-right:0 } #pg-489-0 , #pg-489-1 , #pg-489-2 , #pg-489-3 { margin-bottom:px } #pl-489 .panel-grid-cell { padding:0 } #pl-489 .panel-grid .panel-grid-cell-empty { display:none } #pl-489 .panel-grid .panel-grid-cell-mobile-last { margin-bottom:0px }  }
/* /readquran1 AJAX chapter loader */
#chapterwrap{position:relative}
#chapterloader{display:none;position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(255,255,255,.65);z-index:40;text-align:center}
.chapter-spinner{display:inline-block;margin-top:90px;width:44px;height:44px;border:4px solid #d9d9d9;border-top-color:#2d5c88;border-radius:50%;-webkit-animation:chapterspin .8s linear infinite;animation:chapterspin .8s linear infinite}
@-webkit-keyframes chapterspin{to{-webkit-transform:rotate(360deg)}}
@keyframes chapterspin{to{transform:rotate(360deg)}}
/* Reading-page navigator: hide the GO button (chapters auto-load on change) and double the chapter dropdown width */
.read-quran-post .quran-navigator .btn{display:none}
.read-quran-post .quran-navigator .chapter-select{flex:1 1 auto}
.read-quran-post .quran-navigator select#surahselect{width:100%;max-width:640px}
@media only screen and (max-width:991px){
.read-quran-post .quranoptionsbutton{display:block}
.language-label,.chapter-label,.language-select,.chapter-select{display:block;margin:0}
.readquransubmit{display:block;margin:20px 0 0 20px}
.language-select .wpcf7-form-control.wpcf7-select{width:60%;display:block;margin:0 auto}
.chapter-select .wpcf7-form-control.wpcf7-select{width:60%;display:block;margin:0 auto}
#explorequransearch .wpcf7-form-control-wrap.chapter-surah .select2-container{max-width:60%;width:60%}
}
@media only screen and (max-width:767px){
.read-quran-post .kad-previous-link,.read-quran-post .kad-next-link{margin-top:5px}
.kad-post-navfoot{padding: 0px 10px 20px 10px}
}
@media only screen and (max-width:500px){
.read-quran-post #quransurahverses{padding:40px}
}
/* Chapter audiobook player (native HTML5 <audio>, themed to match the site) */
.quranaudio{margin-top:0px;display:flex;align-items:center}
.chapter-audio-player{
    display:block;
    vertical-align:middle;
    width:100%;
    height:44px;
    border-radius:22px;
    background:#cd3824;               /* site red */
    outline:none;
    accent-color:#cd3824;            /* red progress/volume in supporting browsers */
    box-shadow:0 1px 4px rgba(0,0,0,.15);
}
.chapter-audio-player::-webkit-media-controls-enclosure{
    background:#cd3824;
    border-radius:22px;
}
.chapter-audio-player::-webkit-media-controls-panel{background:#cd3824}
.chapter-audio-player::-webkit-media-controls-play-button,
.chapter-audio-player::-webkit-media-controls-mute-button{filter:invert(1)}
.chapter-audio-player::-webkit-media-controls-current-time-display,
.chapter-audio-player::-webkit-media-controls-time-remaining-display{color:#fff;text-shadow:none}

/* Mobile "Quran Options" panel: a single custom Play/Pause button (native control hidden) */
#quranoptionsmobile .quranaudio{padding:0;text-align:center}
#chaptermobileaudio{display:none}
.mobile-play-btn{
    display:inline-block;
    background:#cd3824;              /* site red */
    color:#fff;
    border:none;
    border-radius:4px;
    padding:8px 28px;
    font-size:15px;
    font-weight:bold;
    cursor:pointer;
}
.mobile-play-btn:hover{background:#2d5c88}