/* Book / magazine style pages: books, audiobooks, podcasts, al-risala, spirit-of-islam,
   quran-for-kids, quran-translations, quran-commentaries (covers grid, store links, banners). */
.page-id-1234 .widget-title{font-size:50px}
.subtitle h4{font-size:24px;color:#fff;margin-top: -40px}
.pipe{color:#bea90b}
.singlebook{padding:20%}
.singlebookimage{-webkit-box-shadow: 5px 5px 11px 4px rgba(0,0,0,0.35); box-shadow: 5px 5px 11px 4px rgba(0,0,0,0.35)}
.booklinks{text-align:center;padding-top:20px}
.booklinks a{
/*position:relative;*/color:#191919;
transition: background .6s ease-out;
-webkit-transition: background .6s ease-out;
-moz-transition: background .6s ease-out;
-o-transition: background .6s ease-out
}
.booklinks a:hover{color:#2d5c88}
.booklinks img{width:50px;position:absolute;left:150px;top:2px}
.booklinks p{padding:0;margin:0}
.bookpageup{margin-top:-80px}
.page-id-1234 .audiobooks{display:none}
.magazinedate{font-size:18px;text-align:center}
.magzinerowone{margin-top:-60px}
.page-id-1534 .widget-title{margin-top:-150px}
.page-id-1502 .widget-title{margin-top:-150px}
.page-id-1749 .offhome .widget-title{
margin-top: -150px;
}
/* --- page 1749 (Audiobooks): SiteOrigin per-page layout CSS, not carried over by the dump.
   Same generated pattern as the #pg-8-* block above: full-width title row, 4 columns with a 30px gutter --- */
#pgc-1749-0-0{ width:100%;width:calc(100% - ( 0 * 30px ) ) }
#pgc-1749-1-0,#pgc-1749-1-1,#pgc-1749-1-2,#pgc-1749-1-3,#pgc-1749-2-0,#pgc-1749-2-1,#pgc-1749-2-2,#pgc-1749-2-3,#pgc-1749-3-0,#pgc-1749-3-1,#pgc-1749-3-2,#pgc-1749-3-3,#pgc-1749-4-0,#pgc-1749-4-1,#pgc-1749-4-2,#pgc-1749-4-3{ width:25%;width:calc(25% - ( 0.75 * 30px ) ) }
#pl-1749 .so-panel{ margin-bottom:30px }
#pl-1749 .so-panel:last-child{ margin-bottom:0px }
#pg-1749-0.panel-no-style,#pg-1749-0.panel-has-style > .panel-row-style,#pg-1749-1.panel-no-style,#pg-1749-1.panel-has-style > .panel-row-style,#pg-1749-2.panel-no-style,#pg-1749-2.panel-has-style > .panel-row-style,#pg-1749-3.panel-no-style,#pg-1749-3.panel-has-style > .panel-row-style,#pg-1749-4.panel-no-style,#pg-1749-4.panel-has-style > .panel-row-style{ -webkit-align-items:flex-start;align-items:flex-start }
@media (max-width:780px){
#pg-1749-0.panel-no-style,#pg-1749-0.panel-has-style > .panel-row-style,#pg-1749-1.panel-no-style,#pg-1749-1.panel-has-style > .panel-row-style,#pg-1749-2.panel-no-style,#pg-1749-2.panel-has-style > .panel-row-style,#pg-1749-3.panel-no-style,#pg-1749-3.panel-has-style > .panel-row-style,#pg-1749-4.panel-no-style,#pg-1749-4.panel-has-style > .panel-row-style{ -webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column }
#pg-1749-0 > .panel-grid-cell,#pg-1749-0 > .panel-row-style > .panel-grid-cell,#pg-1749-1 > .panel-grid-cell,#pg-1749-1 > .panel-row-style > .panel-grid-cell,#pg-1749-2 > .panel-grid-cell,#pg-1749-2 > .panel-row-style > .panel-grid-cell,#pg-1749-3 > .panel-grid-cell,#pg-1749-3 > .panel-row-style > .panel-grid-cell,#pg-1749-4 > .panel-grid-cell,#pg-1749-4 > .panel-row-style > .panel-grid-cell{ width:100%;margin-right:0 }
#pgc-1749-1-0,#pgc-1749-1-1,#pgc-1749-1-2,#pgc-1749-2-0,#pgc-1749-2-1,#pgc-1749-2-2,#pgc-1749-3-0,#pgc-1749-3-1,#pgc-1749-3-2,#pgc-1749-4-0,#pgc-1749-4-1,#pgc-1749-4-2{ margin-bottom:30px }
#pl-1749 .panel-grid-cell{ padding:0 }
#pl-1749 .panel-grid .panel-grid-cell-empty{ display:none }
#pl-1749 .panel-grid .panel-grid-cell-mobile-last{ margin-bottom:0px }
}
/* .magzinerowone pulls every row up 60px (magazine-page look); here that dragged the first
   grid row onto the hero banner and hid the store links behind the next row of covers */
.page-id-1749 .magzinerowone{margin-top:0}
/* push the whole grid down clear of the banner */
.page-id-1749 #pg-1749-1{margin-top:140px !important}

/* ===========================================================================
   Mobile / tablet layout.

   front-flex.min.css lays every panel row out as `display:flex;flex-wrap:nowrap`
   and relies on the per-page CSS WordPress generated for each layout to supply
   the cell widths and the `@media (max-width:780px){flex-direction:column}`
   stacking. That generated CSS was never carried over by the static dump (only
   page 1749 above has it), so the 3- and 4-cell rows on these pages stay side by
   side at every width: on a phone the covers shrink to ~45px thumbnails, the
   store links wrap to three lines each and long words such as "Portuguese"
   overflow their column. Restore the stacking here.

   The rules stay inside media queries so desktop rendering is untouched, and
   they skip `.siteorigin-panels-stretch` rows - those are the full-bleed page
   title bands, whose single cell must keep the width:100% common.css gives it.
   =========================================================================== */

/* Tablets keep the row's own column count - wrapping to two would strand the
   third cover of every 3-cover row on a half-empty line. Instead give the cells
   their space back: .singlebook's 20% side padding is what squeezes the covers
   to thumbnails and wraps "Download eBook" onto two lines at this width. */
@media only screen and (min-width:768px) and (max-width:991px){
.singlebook{padding:16px 6% 24px}
}

/* Phones: one card per row (the breakpoint the theme uses elsewhere - see the
   1749 block above). The cover is capped rather than left to fill the column so
   a nine-cover page does not turn into a six-screen scroll. */
@media only screen and (max-width:767px){
.panel-grid.panel-no-style,
.panel-grid.panel-has-style > .panel-row-style:not(.siteorigin-panels-stretch){
flex-direction:column}
.panel-grid.panel-no-style > .panel-grid-cell,
.panel-grid.panel-has-style > .panel-row-style:not(.siteorigin-panels-stretch) > .panel-grid-cell{
width:100%;margin-right:0}
.singlebook{padding:16px 0 34px}
/* not every cover in the dump carries .aligncenter, so centre them all here */
.singlebook img{display:block;margin-left:auto;margin-right:auto;max-width:240px}
}

/* .magzinerowone / .bookpageup pull each following row up under the previous one
   to tighten the desktop grid. Once the rows are narrower (and especially once
   they stack) that overlap lands the store links on top of the next row's
   covers, so drop it for everything below the desktop breakpoint. */
@media only screen and (max-width:991px){
.magzinerowone,.bookpageup{margin-top:0}
/* single long words ("Portuguese", "Blasphemy") cannot wrap inside a narrow
   column and spill past its edge */
.magazinedate,.booklinks{overflow-wrap:break-word;word-wrap:break-word}
}