* {
    box-sizing:border-box;
}

body {
    margin:0px;
    padding:0px;
    font-size:100%;
    font-family:"Palatino Linotype", palatino, georgia, serif;
    background:rgb(0,0,0)
}



h2, p, a {
    font-size:1.5em;
}

h1 {
    font-size:2em;
}


/* HEADER ====================================================================*/
header {
    position:fixed;
    z-index: 1;
    top:0;
    overflow:hidden;
    width:100%;
    height:100px;
    margin:0;
    padding:0;
    background:rgb(0,0,0);
}

header img {
	position:absolute;
	height:100px;
	top:0;
	left:50%;
	-ms-transform: translate(-50%, 0%); /* IE 9 */
	-webkit-transform: translate(-50%, 0%); /* Safari and Chrome */
	-o-transform: translate(-50%, 0%); /* Opera */
	-moz-transform: translate(-50%, 0%); /* Firefox */
	transform: translate(-50%, 0%);
	padding:0;
    }

header nav {
    display:none;
}



/* LINKS =====================================================================*/

.first {
    margin-top:100px;
}

section {
    position:relative;
    overflow:hidden;
    margin:0;
    padding:0;
    float:left;
    width:100%;
    height:auto;
}


section a {
    display:block;
    width:100%;
    height:24vh;
    transition:filter 0.5s;
}

section a:link {
    text-decoration:none;
    color:rgb(0,0,0);
    text-shadow:2px 1px rgb(255,255,255);
}

section a:hover {
    filter:invert(100%);
}

div.label1 {
    position:absolute;
    bottom:10%;
    left:15%;
    width:70%;
    text-align:left;
}



.paraderuckus {
    background:rgb(250,130,155) url("images/index/index_paraderuckus.jpg") no-repeat center;
    background-size:cover;
}

.screenprints {
    background:rgb(220,220,220) url("images/index/index_screenprints.jpg") no-repeat center;
    background-size:cover;
}

.woodcuts {
    background:rgb(220,220,220) url("images/index/index_woodcuts.jpg") no-repeat center;
    background-size:cover;
}

.books {
    background:rgb(220,220,220) url("images/index/index_books.jpg") no-repeat center;
    background-size:cover;
}




/* FLEX ====================================================================*/
@media (min-width:1200px) {
    header img {
        position:relative;
        float:left;
        max-height:100%;
        padding:0 0 0 5%;
        left:5%;
    }
    header nav {
        display:block;
        overflow:hidden;
        position:absolute;
        right:0;
        top:50%;
        width:950px;
        padding:0;
        margin-top:auto;
        margin-bottom:auto;
        -ms-transform: translate(0%, -50%); /* IE 9 */
        -webkit-transform: translate(0%, -50%); /* Safari and Chrome */
        -o-transform: translate(0%, -50%); /* Opera */
        -moz-transform: translate(0%, -50%); /* Firefox */
        transform: translate(0%, -50%);
    }
    header nav a {
        float:left;
        text-align:center;
        width:16%; /*16.6% 7em;*/
        padding:15px 10px;
        margin:0;
    }
    header nav a:link {
        text-decoration:none;
        border:1px solid rgb(0,0,0);
        border-radius:7em;
        color:rgb(255,255,255);
    }
    header nav a:hover {
        /*border:1px solid rgb(252,60,100);*/
        border-radius:7em;
        background-color:rgb(200,50,50);
    }
    header nav a.here {
        border:1px solid rgb(0,0,0);
        border-radius:7em;
        background-color:rgb(255,255,255);
        color:rgb(0,0,0);
    }

    h1 {
	font-size:4vw; /*2.5em; */
    }
    .first {
        margin-top:0;
    }
    
    section {
        width:25%;
        height:100vh;
    }
    section a {
        height:100%; /* 100vh; */
    }
    div.label1 {
        position:absolute;
        width:90%;
        top:70%;
        left:10%
    }

}