/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@700&family=Lobster&family=Montserrat:wght@300&family=Pacifico&family=Playfair+Display:ital,wght@0,400;1,500&display=swap');

/* 
font-family: 'Dancing Script', cursive;
font-family: 'Lobster', cursive;
font-family: 'Montserrat', sans-serif;
font-family: 'Pacifico', cursive;
font-family: 'Playfair Display', serif; */

/* ----------------------------------------------------------------------------------------------------------- */
body{
    margin:0em;
    font-family: Georgia, 'Times New Roman', Times, serif;
}

header {
    margin: 0em;
}
    .heading{
        margin: 0px;
        background-color: white;
        padding: 0em 2em;
        text-align: center;
        display: flex;
        justify-content: space-between;
        font-family: 'Dancing Script', cursive;
        box-shadow: 1px 1px 10px #2c2c2c;
        /* color: #ffc107; */
        color: #000;
    }
        .heading h1{
            text-decoration: overline;
        }

    header nav{
        width: 50em;
        align-self: center;
    }
        nav ul {
            display: flex;
            justify-content: space-around;
            flex-wrap: nowrap;
            list-style: none;
            padding-inline-start: 0px;
            margin-block-start: 0em;
            margin-block-end: 0em;
        }
    header li {
        width: 7.3em;
        text-align: center;
        /* background: #0a9fc4; */
        
        padding: 0.8em 1em;
        margin-inline-end: 5px;
        border-radius: 15px;
    }
    header a {
        width: 100%;
        font-weight: 600;
        text-decoration: none;
        color: #000;
        font-family: 'Montserrat', sans-serif;
    }
    header li:hover a{
        color: #ffc107;     
        text-decoration: underline;
        text-underline-offset: 1em;   
        font-weight: bolder; 
    }

    header li.current a{
            color: #ffc107;     
            text-decoration: underline;
            text-underline-offset: 1em;  
        }

        li.acc {
            background: #ffc107;
            box-shadow: 5px 6px 10px #ffd761 inset, -7px -7px 20px #c09207 inset;
        }

        /* header li.current a{
            color: #313131;
        } */
    
        li.acc:hover{
            /* background: linear-gradient(135deg,#494949,#292929); */
            /* box-shadow: 5px 6px 10px #9c9c9c inset, -7px -10px 20px rgb(0, 0, 0) inset; */
            /* background: #0daed6;
            box-shadow: 5px 6px 10px #59bdd6 inset, -7px -7px 20px #107791 inset; */
            /* background: #fa69a5;
            box-shadow: 5px 6px 10px #fa81b4 inset, -7px -7px 20px #c01a67 inset; */
            background: #ddaa10;
            box-shadow: 5px 6px 10px #ffca2b inset, -7px -7px 20px #ca9904 inset;
        }
        li.acc:hover a{
            color: white;
        }

/* ------------------------------------------------------------------------------------------------------------------------------------- */

main {
    margin: 0em;
    /* padding: 1em; */
    background-color: #eee;
    /* background-color: #ffc107; */
}

    main li{
        margin-bottom: 0.5em;
    }

    article{
        margin-bottom: 4em;
    }

    /* aside {
        width: 20%;
        padding-left: 15px;
        margin-left: 15px;
        float: right;
        font-style: italic;
    } */

    div.content{
        display: flex;
        flex-wrap: nowrap;
        justify-items: center;

    }

    .info{
        padding: 0px 1em;
        font-style: italic;
        line-height: 1.5em;
        text-align: justify;
    }
        main .info h1{
            margin-top: 0px;
            padding-top: 1em;
        }

    .img {
        width: 100%;
        max-height: 30em;
    }

    .textover{
        background-color: #fff;
        max-width: 80%;
        margin: -10em 10% 3em 10%;
        display: inline-block;
        box-shadow: 1px 1px 10px;
        padding: 1em 2em;
    }

    /* ---------------------------------------------------------------------------------------------------------------------------- */

    footer {
        padding: 0.3em 0.5em;
        bottom: 0;  
        background-color: rgb(54, 54, 54);
        color: white;
    }