/* typefaces */

@charset "UTF-8";

/* Reset basics */

/* * {
	outline: 1px dotted red;
} */

*,
*::before,
*::after {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

body {
	min-height: 100vh;
	line-height: 1.5;
	text-rendering: optimizeLegibility;
        font-family: Charter, 'Bitstream Charter', 'Sitka Text', Cambria, serif;
}


/* Color schemes. */
@media (prefers-color-scheme: dark) {
    body {
        background-color: #262626;
        color: #fffff8;
    }
    a {
	color: SkyBlue;
    }
}

body {
	color: #262626;
	background-color: #fffff8;
}

a {
	color: DarkBlue;
}
/* End color stuff */


/* header and footer */

footer {
	margin-top: 1ex;
	font-size: 80%;
	text-align: center;
}

footer > * {
	max-width: 100%;
}

footer * {
	display: inline;
}

footer ul li {
	margin: 1ex;
}

header  a {
	color: inherit;
	text-decoration: none;
}

#top_links {
	top: 0;
	text-align: right;
}

/* grid container */
.big-grid {
    display:grid;
    padding: 0px;
    max-width: 100vw;
    grid-template-areas:
        'header'
        'main-content'
        'left-sidebar'
        'right-sidebar'
        'footer';
}

.big-grid > * {
	padding: 1.5rem;
}

/* assign columns to grid areas */
.big-grid > .header {
    grid-area:header;
}
.big-grid > .main-content {
    grid-area:main-content;
}
.big-grid > .left-sidebar {
    grid-area:left-sidebar;
}
.big-grid > .right-sidebar {
    grid-area:right-sidebar;
}
.big-grid > .footer {
    grid-area:footer;
}

main {
	margin: 0 auto; /* center main content */
}

/* desktop breakpoint */
@media (min-width:880px) {
    .big-grid {
    	justify-content: center;
        grid-template-columns: min-content auto min-content;
        grid-template-areas:
            'header header header'
            'left-sidebar main-content right-sidebar'
            'footer footer footer';
    }
    main {
    	margin: 0;
	max-width: 55em;
    }
    .right-sidebar {
    	min-width: 20vw;
    }
    .left-sidebar {
    	min-width: 20vw;
    }
}

#main-form {
    display: grid;
    max-width: 30rem;
    grid-template-columns: 1fr;
    grid-template-areas:
        'name-label'
	'name-input'
        'email-label'
	'email-input'
        'phone-label'
	'phone-input'
	'continue'
}

@media (min-width: 800px) {
  #main-form {
    grid-template-columns: 1fr 4fr;
    grid-template-areas:
        'name-label name-input'
        'email-label email-input'
        'phone-label phone-input'
	'continue continue'
    }
}

#main-form > * {
	margin: 1ex;
	padding: 0.5ex;
}

#name-label { grid-area: name-label; }
#name { grid-area: name-input; }
#email-label { grid-area: email-label; }
#email { grid-area: email-input; }
#phone-label { grid-area: phone-label; }
#phone { grid-area: phone-input; }
#continue { grid-area: continue; }


/* Normal article elements. Some styles based on ET Book
   adapted from https://github.com/edwardtufte/et-book/blob/gh-pages/et-book.css */
/* Source: https://github.com/edwardtufte/tufte-css */

h1 a, h2 a {
	color: inherit;
	font-weight: inherit;
	text-decoration: none;
}

h1 {
    font-size: 2.4rem;
    font-weight: 400;
    margin-top: 1ex;
    margin-bottom: 1ex;
    line-height: 1;
}

p.cta {
	font-size: 2rem;
}

h2 {
    font-weight: 400;
    font-size: 1.7rem;
    margin-top: 3ex;
    margin-bottom: 1ex;
    line-height: 1;
}

h3 {
    font-weight: 400;
    font-size: 1.3rem;
    margin-top: 3ex;
    margin-bottom: 1ex;
    line-height: 1;
}

h4 {
	font-weight: inherit;
	font-size: inherit;
	text-align: center;
	text-transform: uppercase;
}

p {
    margin-top: 1.4rem;
    margin-bottom: 1.4rem;
    vertical-align: baseline;
}

img {
	width: 100%;
	max-width: 100%;
}

p, li {
	margin-bottom: 1em;
	line-height: 1.55;
}

blockquote {
	display: block;
	margin-bottom: 1em;
	margin-left: 2.5rem;
	margin-right: 2.5rem;
}

ul, ol {
	display: block;
	margin-bottom: 1rem;
	margin-left: 2.5rem;
}

dt {
	float: left;
	clear: left;
	font-weight: bold;
	margin-right: 1em;
}

dd {
	margin-left: 0px;
	margin-bottom: 1ex;
}

img {
	width: 100%;
}

.nobr {
	white-space:nowrap;
}