/* Copyright 2024 ChristHeals.Us. All Rights Reserved. 2024-06-09 */
body { margin: 0; } header#topBanner { display: inline-flex; justify-content: center; width: 100%; border-width: 1em 1em 0 1em; } #banner { display: flex; flex-flow: row wrap; flex-wrap: wrap; justify-content: center; margin: 1em 0 0 0; } #site_logo { object-fit: contain; display: flex; margin: .2em .2em 0 0; } #site_name_box { display: flex; align-self: center; margin: .4em 0 0 .2em; } #site_name_grid { display: grid; flex: auto; grid-template-columns: auto 1fr; grid-template-rows: auto auto; margin-left: .7em; font-size: 125%; } #siteName1 { grid-column: 1; grid-row: 1; } #siteName2 { grid-column: 1; grid-row: 2; } #siteName3 { grid-column: 2; grid-row: 1 / span 2; align-self: end; font-size: 150%; margin: 0 0 .2em .3em; } #siteName1::first-letter, #siteName2::first-letter { font-size: 150%; } div.tall_cap::first-letter { font-size: 150%; } .spaced_text { text-align: center; letter-spacing: .7em; font-weight: bold; font-size: 150%; } .smaller_text { font-size: 75%; margin: 0 0 0 .3em; font-family: serif; } .italic { font-style: italic; } div > .vertTextBox { transform: rotate(-90deg); margin: 0 0 0 -1em; } h1#s1_h { font-size: 1.75em; text-align: center; bottom: -1em; font-variant: small-caps; font-style: italic; margin: .5em 1em 0 1em; text-wrap: pretty; } @media only screen and (prefers-color-scheme: light) { a:link { color: rgb(0, 100, 0); text-decoration: none; } a:visited { color: rgb(0, 0, 128); text-decoration: none; } a:hover { text-decoration: underline; } body { background-color: rgba(255, 255, 255, 1); } h1, h2, h3, h4, h5, h6 { color: rgba(0, 110, 56, 0.9); text-shadow: rgba(255, 254, 1, 1) -2px -2px 5px; } h1#s1_h { color: #489340; text-shadow: rgba(0, 51, 255, 1) 0.2rem 0.3rem 0.7rem; } p { color: rgba(0, 0, 0, 1); } header#topBanner { border-image: linear-gradient(#000099, white 80%) 5% round stretch; } div#site_name_grid { color: rgba(0, 6, 208, 1); text-shadow: rgba(255, 252, 69, 1) -1px 1px 30px; } .tl, .tr, .bl, .br { text-shadow: rgba(72, 67, 36, 0.88) 60px 40px 6px; } .slide_bg::after { background: url('logo__684x684_w.png'); } section > div > h2 { color: rgba(255, 255, 47, 1); text-shadow: rgba(128, 128, 128, 1) 2px 2px 5px; } div#footer__page_block { background: linear-gradient(white 12.18%, #acacff 89.08%); } footer#footer__page > #footer__page_block > p > span.site_name > a { color: rgba(0, 0, 140, 1); font-family: sans-serif; } } @media only screen and (prefers-color-scheme: dark) { a:link { color: rgb(128, 128, 128); text-decoration: none; } a:visited { color: rgb(160, 160, 255); text-decoration: none; } a:hover { text-decoration: underline; } body { background-color: black; } h1, h2, h3, h4, h5, h6 { color: rgba(0, 255, 0, 0.8); } h1#s1_h { color: rgba(95, 181, 86, 0.37); text-shadow: #03F 2px 2px 5px; } p { color: rgba(200, 200, 200, 1); } header#topBanner { border-image: linear-gradient(#000091, #000 90%) 5% round stretch; } div#site_name_grid { color: rgba(0, 6, 224, 0.67); text-shadow: rgba(255, 252, 69, 1) -1px 1px 0px; } #page_title { color: #CCC; } #page_subtitle { color: rgb(160, 160, 160); } .author { color: rgb(120, 120, 120); } #date_published { color: rgb(120, 120, 120); } .slide_bg::after { background: url('logo__684x684_d.png'); } section.top h1 { color: rgba(0, 5, 181, 0.77); text-shadow: rgba(224, 220, 0, 1) -2px -2px 0px; } section > div > h2 { color: rgba(255, 255, 47, 1); text-shadow: rgba(0, 255, 0, 1) 0px 0px 8px; } div#footer__page_block { background: linear-gradient(#000, #000091 90%); } footer#footer__page > #footer__page_block > p > span.wrapText__anywhere { color: rgba(255, 56, 255, 0.84); } footer#footer__page > #footer__page_block > p > span.site_name > a { color: rgba(163, 166, 255, 0.66); font-family: sans-serif; } } main { height: 100vh; overflow-x: hidden; overflow-y: auto; perspective: 2.1px; } section.top h1 { display: inline-flex; flex-wrap: wrap; align-items: baseline; justify-content: center; } div.grid_corners { display: inline-grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr; width: 100%; justify-items: center; } .tl { grid-column: 1; grid-row: 1; } .tr { grid-column: 2; grid-row: 1; } .bl { grid-column: 1; grid-row: 2; } .br { grid-column: 2; grid-row: 2; } .tl, .tr, .bl, .br { margin: 1em 0 0 0; font-size: 6vh; color: red; } .slide { transform-style: preserve-3d; position: relative; height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; color: white; } .top { transform-style: preserve-3d; position: relative; height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; color: red; } h1 { margin: 0 1em 0 1em; } .slide h1 { text-align: center; font-size: 9vh; font-family: sans-serif; } .slide h2 { text-align: center; word-break: keep-all; font-size: 4vh; margin: 0 0 7vh 0; } section > div > h2 { margin-top: 1vh; text-align: center; line-height: 10vh; } section > div > h2 > div { font-size: 5vh; } span.jesus { color: rgba(255, 47, 47, 1); } span.jesus_callout { color: rgba(255, 0, 190, 0.9); } p.quote { font-size: 3.6vh; padding: 0 1.2em 0 18%; margin: 0 0 3vh 0; } p.center { text-align: center; } .bottom_margin_0 { margin-block-end: 0; } .bottom_margin_2em { margin-block-end: 2em; } span.source { color: burlywood; font-family: sans-serif; font-variant: petite-caps; } span.verse_number, .version { color: gray; } .slide_no_bg { z-index: 999; } .slide_bg h1 { width: 100%; font-size: 9vh; } .slide_bg::after { content: ' '; position: absolute; top: 0; right: 0; bottom: 0; left: 0; transform: translateZ(-1px) scale(1.5); z-index: -1; background-size: cover; } footer.authored > p { font-style: italic; } footer#footer__page > #footer__page_block { padding: 15em 0.5em 1em 0.5em; } footer#footer__page > #footer__page_block > p { margin: 0 0.5em 0 1em; font-size: smaller; font-family: sans-serif; } footer#footer__page > #footer__page_block > p > span { font-family: sans-serif; } .c_red { color: red; } .c_pink { color: rgb(255, 100, 200); } div.center_dl { display: inline-flex; justify-content: center; width: 100%; } @media (orientation:landscape) { p.quote { font-size: 6vh; line-height: 1.08em; padding: 0 12% 0 12%; } .slide h1 { font-size: 12vh; margin-block-start: .3em; margin-block-end: .1em; } .tl, .tr, .bl, .br { font-size: 11vh; } .slide h2 { font-size: 9vh; margin: 0 0 5vh 0; } section > div > h2 > div { font-size: 11vh; line-height: 11vh; } div.tall_cap { line-height: 1.3em; } }