/* =====================================
   BLIPPERDEX
   Explorer's Ancient Field Journal
===================================== */


@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700&family=Cormorant+Garamond:wght@400;500;600;700&family=IM+Fell+English&display=swap');



/* =====================================
   PAGE
===================================== */


body {

    margin: 0;

    background-color: #d8c39b;

    color: #3a2918;

    font-family: 'Cormorant Garamond', serif;

}



/* =====================================
   HEADER
===================================== */


header {

    background-color: #4b321f;

    color: #f3dfb3;

    text-align: center;

    padding: 60px 20px;

    border-bottom: 10px solid #96733e;

}



header h1 {

    margin: 0;

    font-family: 'IM Fell English', serif;

    font-size: 70px;

    letter-spacing: 4px;

}



header p {

    font-family: 'Cormorant Garamond', serif;

    font-size: 25px;

    font-style: italic;

}



/* =====================================
   BOOK PAGE
===================================== */


main {

    width: 90%;

    max-width: 900px;

    margin: 40px auto;

}



section {

    background-color: #f4e8c8;

    padding: 45px;

    margin-bottom: 40px;

    border: 3px solid #b08a4a;

    border-radius: 4px;

    box-shadow:

        0 5px 15px rgba(50,30,10,0.25),

        inset 0 0 30px rgba(120,80,30,0.08);

}



/* =====================================
   TITLES
===================================== */


h2 {

    font-family: 'Cinzel', serif;

    color: #4b321f;

    font-size: 38px;

    border-bottom: 2px solid #b08a4a;

    padding-bottom: 10px;

}



/* =====================================
   TEXT
===================================== */


p {

    font-size: 22px;

    line-height: 1.8;

}



/* =====================================
   EXPLORATION BUTTONS
===================================== */


a {

    display: block;

    width: fit-content;

    background-color: #667a32;

    color: #fff8df;

    font-family: 'Cinzel', serif;

    text-decoration: none;

    padding: 16px 30px;

    margin-bottom: 18px;

    border: 2px solid #40501d;

    border-radius: 3px;

}



a:hover {

    background-color: #536328;

}



/* =====================================
   DIVIDER
===================================== */


hr {

    border: none;

    height: 3px;

    background-color: #b08a4a;

    margin: 50px 0;

}