@font-face {
	font-family: "EBG12-It";
	src:  url( fonts/EBGaramond12-Italic.eot );
	src:  url('fonts/EBGaramond12-Italic.ttf') format('truetype'),
  	      url('fonts/EBGaramond12-Italic.woff') format('woff');
    }

    @font-face {
        font-family: "lydian";
        src: url(fonts/lydian.ttf) format('truetype');

    }
    .head img {
        width: 100%;
    }
    body {
	display: flex;
	flex-direction: row;
	margin-left: -1em;
	margin-top: -1em;
    font-family: sans-serif;
    }

    .left {
	display: flex;
	flex-direction: column;
	flex: 0 0 86vw;
    }

    header {
	    background-color: #f0b2b0;
	    height: 10em;
    }

    .head {
	font-family: 'EBG12-It';
	 font-size: 4em;
	 font-family: 'EBG12-It';
	 -moz-font-feature-settings: "swsh";
	 -webkit-font-feature-settings: "swsh";
	 -ms-font-feature-settings: "swsh";
	 -o-font-feature-settings: "swsh";
	 font-feature-settings: "swsh";
	 font-size: 4em;
	 margin-left: .5em;
	 margin-top: .5em;
    }

    .ff-cover img {
	float: right;
	clear: left;
    }

    .bams-cover {
	float: left;
	margin-right: 2.5em;
	margin-top: 2.5em;
    }

    .nav {
	background-color: #8485B9;
	flex: 0 0 12em;
    }

    .content {
	padding-left: 10em;
	padding-right: 5em;
    }

    nav {
        padding-top: 4em;
        font-family: "lydian";
        font-size: xx-large;
    }

    .nav  li a {
        color: #f0b2b0;
        text-decoration: none;
    }

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

    nav li {
	    list-style: none;
	    margin: auto;
        padding: .5em;
    }

    .bad-luck {
        background-color: #B9D2CD;
    }

    .declared-dead {
        background-color: #D3D1E9;
    }


    .booklist {
        display: flex;
        flex-direction: column;

    }

    .book {
        display: flex;
        flex-direction: row;
    }

    .book img {
        padding: .75em;
	align-self: center;
	flex-shrink: 0;
    }

    .now-at {
	display: flex;
    }