@import url('https://fonts.googleapis.com/css?family=EB+Garamond:400,400i|Inconsolata|Space+Mono:400,400i&display=swap');

body {
    background-image: url(img/bg3.png);
    background-size: 1100px;
    background-repeat: repeat;
    background-position: bottom 0px left 55px;
/*                background-position: center;*/
    background-attachment: fixed;
}

a {
    cursor: pointer;
}

main {
    overflow-x: hidden;
}


a:not(.conatiner), a:not(.conatiner):visited, a:not(.conatiner):active {
    color: #1439de;
    
    transition: all 0.1s;
    
    text-decoration: underline;
}

a:not(.conatiner):hover {
    
/*    text-decoration: none;*/
    color: #91a5d8;
    cursor: pointer;
}

a.conatiner {
    color: black;
    text-decoration: none;
}

main {
    max-width: 110vh;
    margin: auto;
    
    padding-right: 4rem;
    padding-left: 16rem;


    margin-top: 4rem;
    margin-bottom: 8rem;

/*
    background-color: white;
    border-style: solid;
    padding: 0 4rem;
*/
}

* {
    font-weight: 100;

    max-width: 100%;
}

.pic {
    max-width: 100%; 

    margin-bottom: 4rem;

    max-height: 90vh;

/*
    margin-left: 50%;
    transform: translate(-50%, 0);
*/
}

.border {
    border: 1px solid black;

    max-height: 80vh;
}

/*
.paper {
    max-height: 70vh;
}
*/

.small {
    max-height: 50vh;
    margin-right: 5%;
}

h2 {
    font-size: 2rem;
}

h2, p {
    margin-top: rem;
    margin-bottom: 4rem;
}

iframe {
    margin: 1rem;
}

pre {
    margin-top: -2rem;
    margin-bottom: 4rem;
}

* {
/*                background-color: white;*/
/*                display: inline-block;*/

    font-family: 'EB Garamond', serif;

/*                color: #e8b10c;*/
}

h1:not(.intro) {
    font-size: 3rem;
    margin-bottom: 4rem;
}

p {
    font-size: 1.125rem;
}

pre, p, p a {
    font-family: 'Space Mono', monospace;
    font-style: italic;

    font-size: 0.85rem;
}

nav {
    position: fixed;

    margin-left: 1.25rem;

    margin-top: -3.5rem;
    
    max-width: 4.5em;
    
    font-size: 1.1rem;
}

nav a.nav.nav.nav.nav.nav {
    color: black;
    text-decoration: none;
}

nav a.nav.nav.nav.nav.nav.nav:hover {
    text-decoration: underline;
}

nav a.nav.nav.nav.nav.nav.nav.active {
    text-decoration: underline;
}

nav a:not(.nav) {
    margin-bottom: 0.5rem;
}

nav * {
    display: block;
    
    word-wrap: break-word;
}

nav div {
    margin-bottom: 1.5rem;
}

nav .box {
    width: 28px;

    margin-top: 1rem;
    
    margin-bottom: 3rem;
}

h1.intro {
    max-width: 14em;
    font-size: 1.35rem;
    
    margin-top: 7rem;
}

img.intro {
    font-size: 1.35rem;
    width: 140px;
    
    margin-left: 45vw;
    margin-top: 8vh;
}

audio.intro {
    margin-top: 12vh;
}

img.window {
    transform: translate(0, 7%) scale(1.075);
    margin-bottom: 1.5rem;
}

a.more, a.more:visited {
    font-size: 1.3rem;
    text-decoration: none;
    font-family: serif;
}

a.more span {
    text-decoration: underline;
    font-family: "EB Garamond", serif;
    vertical-align: 0.15rem;
}

main article *, article .pic {
    margin-bottom: 1rem;
}

main article {
    margin-bottom: 8rem;
}

pre {
    background-color: white;
}

/* wide ---------------------------------------------------------------------------*/
@media all and (min-width: 100vh) { 
}

/*tall-------------------------------------------------------------------------------*/
@media all and (max-width: 100vh) { 
    
    body {
    background-position: bottom 0px left -200px;
}
    
    main {
        padding-left: 7.5rem;
        
        padding-right: 1rem;
    }
}