/* Reset brower defaults */
html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, menu, nav, section, time, mark, audio, video, details, summary {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font-weight: normal;
vertical-align: baseline;
box-sizing: border-box;
font-family: 'Faustina', serif;
}
main, article, aside, figure, footer, header, nav, section, details, summary {display: block;}
html {
scroll-behavior: smooth;
}
.faustina {
font-family: "Faustina", serif;
font-optical-sizing: auto;
font-weight: inherent;
font-style: normal;
}
@media (prefers-color-scheme: light) {
body {
color: black;
}
}
/* Sets properties left and right margin to % of screen width */
body {
margin: 0% ;
overflow: auto;
font-size: 1rem;
letter-spacing: 1px;
word-spacing: inherit;
color: #000000;
font-weight: 500 ;
font-family: "Faustina", serif;
background: white;'
}
.bodywhite {
margin: 0% ;
overflow: auto;
font-size: 1rem;
letter-spacing: 1px;
word-spacing: inherit;
color: #000000;
font-weight: 500 ;
font-family: "Faustina", serif;
background-color: #FFFFF3;
}
.ND {
display: none;
visibility: hidden;
text-indent: 9px;
font-style: normal;
font-size: .5rem;
font-weight: lighter;
line-height: 95%;
letter-spacing: .5px;
word-spacing: .5px;
text-align: center;
}
/* This section sets color of URL'S and whether they are underlined or not, need to be in this order */
a:link {
color: #C80000;
text-decoration: underline;
font-size: inherit;
}
a:visited {
color: #0032FF;
text-decoration: none;
font-size: inherit;
}
a:hover {
color: green;
text-decoration: underline;
font-size: inherit;
}
a:focus {
color: green;
text-decoration: underline;
font-size: inherit;
}
a:active {
color: black;
text-decoration: none;
font-size: inherit;
}
/* sets boarder of images to none and 0 margins */
img {
border: none;
margin: 0;
max-width: 100%;
height: auto;
}
/* Container sets a width of content content
to 90% of the margins set in body
sets border to none */
#container {
width: 55%;
max-width: max-content;
padding: 8px;
border: 0px none transparent;
margin-left: auto;
margin-right: auto;
}
/* Begin top nav */
#topnav {
background-color: blue;
width: 100%;
max-width: 100%;
position: fixed;
top: 0px;
left: 0px;
padding: 5px 0;
margin: 0px 0px 50px 0px;
border: solid 2px;
z-index: 10000;
align-content: center;
text-align: center;
box-sizing: border-box
}
.button, .dropbtn {
background-color: red;
border-radius:.6em;
border: none;
color: white;
padding: 4px 10px;
text-align: center;
display: inline-block;
font-size: 1rem;
margin: 2px;
cursor: pointer;
font-weight: 500;
text-decoration: none;
transition: background 0.3s;
}
/* begin drop down buttons nav
.dropbtn {
background-color: red;
border-radius: .6em;
text-align: center;
display: inline-block;
color: white;
padding: .6em;
font-size: 1em;
font-weight: 500;
border: none;
box-shadow:inset 0 -0.10em 0 -0.10em rgba(0,0,0,0.17);
position: relative;
margin: 0.1em 0 0.1em 0;
box-sizing: border-box;
} */
.dropdown {
position: relative;
display: inline-block;
}
.dropdown-content {
display: none;
position: absolute;
background-color: #F7F7F7;
min-width: 200px;
box-shadow:inset 0px 8px 16px 0px rgba(0,0,0,0.2);
padding: 1px;
z-index: 1001;
font-size: .8rem;
text-align: left;
border-radius: 4px;
top: 100%; /* Positions it right below the button */
left: 0px;
/* --- THE SCROLLING FIX --- */
max-height: 400px; /* Limits how long the menu can get */
overflow-y: auto; /* Adds a vertical scrollbar if items exceed max-height */
overflow-x: hidden; /* Prevents sideways jiggling */
/* Prevents the text from wrapping, which keeps the scroll smooth */
white-space: nowrap;
border-radius: 0 0 5px 5px;
}
.dropdown-content a {
padding: 2px 1px;
padding: 10px 16px;
text-decoration: none;
display: block;
border-bottom: 1px solid #eee;
}
.dropdown-content a:hover {background-color: #eee;}
.dropdown:hover .dropdown-content {display: block;}
/* .dropdown:hover .dropbtn {background-color: red;} /*
/* end top nav */
/* dark mode */
@media (prefers-color-scheme: dark) {
body {
color: #D6D6D6 !important;
background: #292929 !important;
}
a:link {
color: #FF4747;
text-decoration: underline;
font-size: inherit;
}
a:visited {
color: #008ffF;
text-decoration: none;
font-size: inherit;
}
a:hover {
color: #2AFF14;
text-decoration: underline;
font-size: inherit;
}
a:focus {
color: #2AFF14;
text-decoration: underline;
font-size: inherit;
}
a:active {
color: blue;
text-decoration: none;
font-size: inherit;
}
#header{
align-content: center;
text-align: center;
font-size: 3vw;
color: #A3CDFF;
font-style: normal;
font-weight: 900;
margin-top:200px;
margin-bottom: 1em;
line-height: 100%
}
h1,h2,h3,h4,h5,h6 {
color: #A3CDFF;
font-style: normal ;
font-weight: 900;
margin-top: 1.5mm;
margin-bottom: 1.5mm;
line-height: 100%;
font-size: 95%;
}
}
/* end dark mode */
/* mobile media screen */
@media (hover: none) and (pointer: coarse) {
#container {
width: 97%;
padding: 0px;
border: 0px none transparent;
margin-left: auto;
margin-right: auto;
}
#topnav {
background-color: blue;
width: 100%;
max-width: 100%;
position: fixed;
top: 0px;
left: 0px;
padding: 2px 0;
margin: 0px 0px 20px 0px;
border: solid 2px;
z-index: 10000;
align-content: center;
text-align: center;
box-sizing: border-box
}
.button, .dropbtn {
background-color: red;
border-radius:.6em;
border: none;
color: white;
padding: 2px 5px;
text-align: center;
display: inline-block;
font-size: .8rem;
margin: 0px;
cursor: pointer;
font-weight: 500;
text-decoration: none;
transition: background 0.3s;
}
#header{
align-content: center;
text-align: center;
font-size: 3vw;
color: #0000FF;
font-style: normal;
font-weight: 900;
margin-top:200px;
margin-bottom: 1em;
line-height: 100%
}
.dropbtn {
background-color: red;
border-radius: .5em;
text-align: center;
display: inline-block;
color: white;
padding: 2px;
font-size: .8em;
font-weight: 400;
border: none;
box-shadow:inset 0 -0.10em 0 -0.10em rgba(0,0,0,0.17);
position: relative;
margin: 0.1em 0 0.1em 0;
}
}
/* end mobile */
/* FLEX */
.row {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -15px;
margin-left: -15px;
justify-content: space-evenly;
}
.column
{
float: left;
border: 0px none transparent;
border-collapse: seperate;
display: flex;
flex-wrap: wrap;
justify-content: space-evenly;
}
/* end FLEX */
/* sets boarder of images to none and 0 margins */
img {
border: none;
margin: 0;
max-width: 100%;
height: auto;
}
/* Container sets a width of content content
to 90% of the margins set in body
sets border to none */
#header{
align-content: center;
text-align: center;
font-size: 1.5vw;
color: #0000FF;
font-style: normal;
font-weight: 900;
margin-top: 50px;
margin-bottom: .5em;
line-height: 100%
}
/* Footer sets a width of content content to 50% of the margins set in body
sets border to none, centers text, font size 10 px controls spacing */
#footer{
width: 50%;
margin: auto;
padding: .9rem;
border: 0px none transparent;
font-style: normal;
font-size: .6rem;
font-weight:350;
letter-spacing: 1px;
word-spacing: .1px;
text-align: center;
color: black;
}
/* Pseudo links set links only in footer to black except for active which is green, links inherit other link attributes set above */
#footer a:link {color: black;}
#footer a:visited {color: black;}
#footer a:hover {color: green;}
#footer a:focus {color: black;}
#footer a:active {color: black;}
/* sets font size and weight of paragraphs
, indents by 30 pixels */
p::first-letter {
font-size: 1.2rem;
font-weight: 500;
color: inherit;
}
p {
text-indent: 30px;
font-style: normal;
font-size: 1rem;
font-weight: 400;
line-height: 105%;
padding-left: 5%;
padding-right: 5%;
padding-bottom: 5px;
}
/* sets font size and weight of paragraphs indents by 0 pixels
*/
p.noindent {
text-indent: 0px;
font-style: normal;
font-size: 1rem;
font-weight: 400;
line-height: 105%;
padding-left: 5%;
padding-right: 5%;
padding-bottom: 5px;
}
/* sets Horizonal Rule hr elrements */
hr {
background: #0000FF;
width: 95%;
height: 1px;
border: solid #0000FF;
display: block;
max-width: 100%;
align-self: center;
opacity: 0.8;
margin-left: auto;
margin-right: auto;
margin-top: 5px;
margin-bottom: 5px;
border-style: inset;
border-width: 1px;
}
/* sets font size and weight of list elrement class="centert" elrement */
.table-wrap {
width: 100%;
/* overflow-x: auto; */
}
table.centert {
margin-left:auto;
margin-right:auto;
text-align:left;
padding: 10px;
width: auto;
}
table.background {
float: right;
border: solid medium;
padding: 4px;
}
/* sets font size and weight of elrement elrement elrement LDS with black dots */
abbr {
border-bottom: 1px dotted black;
}
pre,
code,
kbd,
samp {
font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
font-size: inherit;
}
/* sets font style, size and weight of code