/*
  https://www.joshwcomeau.com/css/custom-css-reset/

  1. Use a more-intuitive box-sizing model.
*/
*, *::before, *::after {
    box-sizing: border-box;
}

/*
2. Remove default margin
*/
* {
    margin: 0;
}

/*
Typographic tweaks!
3. Add accessible line-height
4. Improve text rendering
*/
body {
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}

/*
5. Improve media defaults
*/
img, picture, video, canvas, svg {
    display: block;
    max-width: 100%;
}

/*
6. Remove built-in form typography styles
*/
input, button, textarea, select {
    font: inherit;
}

/*
7. Avoid text overflows
*/
p, h1, h2, h3, h4, h5, h6 {
    overflow-wrap: break-word;
}

/*
8. Create a root stacking context
*/
#root, #__next {
    isolation: isolate;
}

/* Lichen Site CSS */

body {
    font-family: "Roboto", sans-serif;
    font-size: 1.15rem;
    font-weight: 400;
    font-style: normal;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.container {
    width: 100%;
    padding: 0 1rem;
    margin: 2rem auto;
}

/* Medium screens */
@media (min-width: 480px) {
    .container {
        max-width: 40rem;
    }
}

/* Larger screens */
@media (min-width: 1024px) {
    .container {
        max-width: 50rem;
    }
}

/* to center the logo for Colin and Michelle, include the following */
/* .logo {
    margin: 0 auto;
}*/

img.logo {
    width: 40%;
}

a:link {
    color: rgb(28, 73, 89);
}

a:visited {
    color: rgb(30, 108, 139);
}

h1 {
    font-size: 2.25rem;
    padding-bottom: 24px;
}

h2 {
    font-size: 1.75rem;
    padding-top: 24px;
    padding-bottom: 24px;
}

p {
    line-height: 2rem;   /* within paragraph */
    margin-bottom: 1.8rem; /* between paragraphs */
}

.icon-list {
    list-style-position: outside;
    margin: 8px 0;
    padding-left: 24px;
}

.icon-list li {
    padding: 8px 16px;
}

.icon-list li.software {
    list-style: "\1F310";
}

.icon-list li.access {
    list-style: "\267F";
}

.icon-list li.codesign {
    list-style: "\1F465";
}

.icon-list li.training {
    list-style: "\1F393";
}

.icon-list li.ux {
    list-style: "\1F4F1";
}

.icon-list li.art {
    list-style: "\1F3A8";
}

.icon {
    margin-right: 24px;
    flex-shrink: 0;
}

footer {
    text-align: center;
    font-size: 125%;
    font-weight: bold;
    border-top: #b0c3be 12px dotted;
    padding-top: 25px;
}

footer > p {
    padding-top: 25px;
}