header {
    background-color: #1d0060;
    color: white;
    padding: 15px;
    text-align: center;

    nav {
        
        ul {
            list-style: none;
            margin: 0;
            padding: 0;
            li {
                display: inline-block;
                margin: 10px;
                vertical-align:top;
                margin-top:20px;
                li{
                    margin-top:0px;
                    display: block;
                }
            }
        }
        a {
            text-decoration: none;
            color: white;
        }
    }
}


body {
    word-wrap: break-word;
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    background-color: #2d0081;
    color: white;
    min-height: 100vh;
    text-align: center;

    h1, h2 {
        margin: 0;
    }
    h1, h2, h3, h4, h5{
        margin-bottom:0;
    }

    ul {
        list-style-position: inside;
        padding-left:0;
    }
    iframe{
        width:100%;
        height:4600px;
        border: none;
        padding: 0;
        margin: 0;
    }

    .video{
        width: 100%;
        aspect-ratio: 16 / 9;
        border: none;
        padding: 0;
        margin: 0;
    }

    .container {
        @media (min-width:500px) { width: 75%; }
        margin:auto;
        margin-top:25px;
        margin-bottom:25px;
        background-color: rgba(0, 0, 0, 0.3);
        padding: 20px;
        border-radius: 8px;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3);
        text-align: center;
        position: relative;
        color:white;

        a{
            color:tomato
        }

        img {
            width: 100%;
            margin-bottom: 5px;
        }
        #smallImg{
            width:48%;
            margin-left:7px;
            margin-right:7px;
        }
        #gif{
            @media (min-width:854px) { width:640px; }
        }
    }
}