# Main styles


// You can specify colors below for your headers, links, and hover. // The colors selected below are accessible according to WCAG guidelines. // If you wish to change the colors but want to ensure their accessibility, // you can check out: colorsafe.co/ $main_title_color: #3e3e3e; $main_header_color: ff0000; $link_color: #3e3e3e; $link_background_color: ffe0e0; $link_hover_color: ff0000; $font_family: system-ui, Helvetica, Arial, sans-serif;

body {

font-family: $font-family;

}

a {

color: $link_color;
background: linear-gradient(to bottom, transparent 0%, transparent 60%, $link_background_color 60%, $link_background_color 100%);;
text-decoration: none;

}

a:hover, a:focus {

color: $link_hover_color;
background: linear-gradient(to bottom, transparent 0%, transparent 0%, $link_background_color 0%, $link_background_color 100%);;

}

h1 {

color: $main_header_color;
padding-top: 10px;

}

h2, h3, h4, h5, h6 {

color: $main_title_color;
padding-top: 10px;

}

h1 {

size: 1.7rem;

}

h2 {

size: 1.3rem;

}

h3 {

size: 1.2rem;

}

img {

max-width: 100%;

}

figcaption {

margin-top: -3px;
background: #dddddd;
padding: 1rem;
font-size: 1rem;
line-height: 1.3rem;
text-align: center;

}

p, li {

font-size: 1rem;
line-height: 150%;
color: #444;
margin: 1.25rem 0;

}

.site-title , .post-title {

font-size: 2.5rem;
color: $main_title_color;
margin: 0;

}

.page {

display: flex;
flex-direction: column;
justify-content: center;
margin: auto;
width: 80%;
max-width: 600px;
// border: 1px solid;

}

main-content, nav-container {

// margin: 2%;

}

nav-container > h1 {

font-size: 2.5rem;

}

nav > ul {

display: flex;
list-style: none;
padding-inline-start: 0;

}

nav > ul li {

font-size: 1.2rem;
padding-right: 3vw;
font-weight: 300;

}

// hide skip link until it's in focus .skip-link {

background: #fff;
position: absolute;
top: -3em;

} .skip-focus {

top: 0;

}

th, td {

padding: 15px;
text-align: left;
border-bottom: 1px solid #ddd;

}

code {

font-size: 1.1rem;

}

pre {

white-space: pre-wrap;       /* css-3 */
white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
white-space: -pre-wrap;      /* Opera 4-6 */
white-space: -o-pre-wrap;    /* Opera 7 */
word-wrap: break-word;       /* Internet Explorer 5.5+ */
padding: 2%;

}