/* CSS reset rule */
* {
    margin: 0; padding: 0; border: 0; box-sizing: border-box;
}

        body {
                background-color: rgb(186, 157, 186);
                font-family: "DM Sans", "sans-serif";
                line-height: 1.5;
            }

            header{
                text-align: center;
                color: rgb(75, 50, 87);
                font-family: "Bebas Neue", sans-serif;
                font-size: larger;
                margin-top: 20px;
                margin-bottom: 10px;
            }
            h1{
                text-align: center;
                color: black;
                font-family: "Bebas Neue", sans-serif;
                margin-top: 10px;
                margin-bottom: 40px;
                text-transform: capitalize;
            }

            nav.assignments1 {
                display: flex;
                flex-flow: row wrap ;
                justify-content: center;
                list-style: none;
                gap: 8px;
                }

            nav.assignments1 a {
                border: 3px solid rgb(75, 50, 87);
                border-radius: 8px;
                color: black;
                display: inline-block;
                padding: 8px 24px;
                text-decoration: none;
                font-weight: bold;
            }


            h2 {
                font-family: "Bebas Neue", sans-serif;
                margin-bottom: 10px; margin-top: 30px;
                background-color: rgb(241, 241, 184);
                margin-left: 0px;
                padding-left: 20px;
                }

            .img_center {
                display: inline;
                width: 300;
                height: 350px;
                float:right;
                margin-right: 40px;
                margin-left: 20px;
                margin-top: 30px;
                border: 4px solid rgb(75, 50, 87);
                border-radius: 10px;
                box-shadow: 8px 8px 20px rgb(98, 65, 113);
                /* margin-top: 5px;
                margin-bottom: 20px; */
               
            }

            .welcome {
                text-align: center;
                font-family: Verdana, Geneva, Tahoma, serif;
            }

            p{
                margin-bottom: 10px;
                margin-left: 10%; margin-right: 10%;
            }

            nav {
                margin-left: 40px;
            }


            ul, ol {
                margin-left: 80px;
                margin-bottom: 20px;
            }

            a:hover {
                background-color: rgb(241, 241, 184);
                margin-top: 20px;
                transition: smooth;
        
            }
            nav.back {
                margin-bottom: 20px;
                text-align: right;
                margin-right: 8px;
                
            }
            footer {
               height: auto;
                background-color: rgb(162, 161, 161);
                padding-top: 30px;
                text-align: center;
            }

            nav.assignments {
                display: flex;
                flex-flow: column nowrap ;
                justify-content: center;
                list-style: none;
                gap: 8px;
                }

            nav.assignments a {
                border: 3px solid rgb(75, 50, 87);
                border-radius: 8px;
                color: black;
                display: inline-block;
                padding: 8px 24px;
                text-decoration: none;
                font-weight: bold;
            }

            img {
                height: 300px; width: 400px;
                display: block;
                margin-left: auto; margin-right: auto;
                border: 4px solid rgb(75, 50, 87);
                border-radius: 10px;
                box-shadow: 8px 8px 20px rgb(98, 65, 113);
            }

            .fig1{
                display: flex;
                padding-bottom: 80px;
                padding-top: 40px
            }