html,body,iframe{margin:0;padding:0;height:100%;border:0;}
body{display:flex;font:15px/23px 'SBLBibLit Hebrew in English','Helvetica Neue',Helvetica,Arial,sans-serif;}
body[dir="rtl"]{font-size:16px;}
#bodycol{width:300px;display:flex;height:100%;flex-direction:column;padding:4px;box-sizing:border-box;flex:0 0 300px;}
iframe{width:100%;}

#pageTitle{margin:0;margin-bottom:5px;padding:5px;text-align:center;color:#993333;box-sizing:border-box;width:290px;}
#pageTitle,.overlay{background:#f9f4f4;border:1px solid #a99;box-shadow:#999 10px 10px 10px -10px,#999 0 0 3px 0;}
#overlayContainer{flex-grow:1;flex-basis:100%;height:100%;width:290px;position:relative;}
.overlay{height:100%;display:flex;flex-direction:column;}

.noPageTitle #pageTitle{display:none;}
.overlay{overflow:hidden;position:absolute;top:0;transform-origin:center center;}
.overlay.onslide{transform:scale(100%) rotate(0deg);}
.overlay.offslide{transform:scale(0) rotate(0deg);}
.overlay.offslide.tonext{transition:transform 1000ms step-end;z-index:1;}
.overlay.onslide.fromnext{transition:transform 1000ms ease-out;z-index:3;}
.overlay.offslide.toprev{transition:transform 1000ms ease-in;z-index:3;}
.overlay.onslide.fromprev{transition:transform 1000ms step-start;z-index:1;}

body.minified, .minified #bodycol{display:block;}
.minified iframe{width:100%!important;height:100%;position:absolute;top:0;left:0;}
body.minified[dir="rtl"] iframe{left:auto;right:0;}
.minified #pageTitle, .minified .offslide{display:none;}
.minified #overlayContainer{position:absolute;bottom:10px;left:10px;height:auto;}
.minified[dir="rtl"] #overlayContainer{left:auto;right:10px;}
.minified .overlay{position:static;}

.overlay-title,.overlay-nav{display:flex;}
.overlay h1{flex-grow:1;margin:0;padding:20px 0 0 30px;font:bold 1.467em/1.5 "";text-align:center;font-family:inherit;color:#993333;}
body[dir="rtl"] .overlay h1{padding-left:0;padding-right:30px;}
.minified .overlay-title h1{font-size:20px; line-height:25px; padding:5px;}

.minify{height:25px;width:25px;font:bold 20px/25px serif;cursor:pointer;text-align:center;margin:5px;flex:0 0 25px;transition:all 500ms;}
.minify:after{content:"−";}
.minified .minify:after{content:"+";}
.minify:hover{background:rgba(255,255,255,.8);border-radius:100%;}

.overlay-content{flex-grow:1;padding:0 10px;overflow:auto;}
.overlay-content ul{margin:0 0 0 25px;padding:0;}
body[dir="rtl"] .overlay-content ul{margin-right:25px;margin-left:0;}
.overlay-content li{margin:.2em 0;}
.minified .overlay-content,.minified .overlay-nav{display:none;}

.overlay-nav{padding:5px;justify-content:space-between;}
.overlay-nav button{display:inline-block;cursor:pointer;border-radius:20px/100%;background:#fff;border:2px solid #999;width:100px;font:14px/20px sans-serif;text-decoration:none;padding:2px 5px;margin:0;transition:background 250ms ease-in-out,transform 150ms ease;-webkit-appearance:none;-moz-appearance:none;}
.overlay-nav button:hover,.overlay-nav button:focus{background:#ddd;border:2px solid #777;}
.overlay-nav button:active{transform:scale(0.99);}
.overlay-nav .overlay-prev{align-self:flex-start;}
.overlay-nav .overlay-prev:after{content:"Previous";}
body[dir="rtl"] .overlay-nav .overlay-prev:after{content:"אחורה";}
.overlay-nav .overlay-next{align-self:flex-end;margin-left:auto;}
body[dir="rtl"] .overlay-nav .overlay-next{align-self:flex-end;margin-right:auto;margin-left:0;}
.overlay-nav .overlay-next:before{content:"Next";}
body[dir="rtl"] .overlay-nav .overlay-next:before{content:"קדימה";}

a{color:#0088cc;text-decoration:none;}
a:hover{color:#005580;text-decoration:underline;}

.url-notice{border:1px solid #e11;color:#e11;font:12px/15px "";font-family:inherit;border-radius:3px;display:none;text-align:center;padding:3px;margin-top:8px;}
.url-notice-on{display:block;}
.url-notice-warn{color:#e81;border-color:#e81;}

.overlay img{max-width:268px;max-height:300px;margin:auto;display:block;}
.overlay h2{text-align:center;font: bold 17px/1.3 "";font-family:inherit;color:#993333;}

strong{color:#993333;}

.overlay { counter-reset: fn; }
fn{counter-increment:fn;cursor:pointer;color:#777;}
fn span{display:none;font-size:.9em;}
fn.open span{display:inline;}
fn::before{content:counter(fn) " ";vertical-align:baseline;position:relative;top:-0.4em;font-size:smaller;}