@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@500&display=swap');

    body{
    
        
        font-family: 'Poppins', sans-serif;
        padding:0rem;
        margin:0rem;
        color:#333333;
        
    }

    h1, h2{
        color:#1d1d1d;
        text-transform: capitalize;
    }

    a{
        text-decoration: none;
    }
    
    ol li::marker{
        font-weight: bold;
    }

    #navbar{
        min-width: 290px;
        width:250px;
        /*background-color: #7e82ff;*/
        background-image: linear-gradient(to left bottom, #0dd291, #00d1ac, #00cfc3, #00cbd4, #0ac7df);
        padding:1rem;
        height:100%;
        position:fixed;
        top:0;
        left:0;
        
        min-width: 10rem;
    }

    h1{
        color:white;
        border-bottom: 4px solid #002240;
    }

    #navbar ul{
        padding:0rem;
        border-radius: 1rem;
        
    }

    #navbar li{
        list-style: none;
    
    }

    #navbar li:hover{
        border-left: 4px solid #0e1d1d;
        /*background-color:#646aff ;*/
        background-color: rgba(73, 223, 243, 0.664);
    
        border-top-right-radius: 10px;
        border-bottom-right-radius: 10px;
    }
    #navbar li:active {
        border-left: 4px solid #0e1d1d;
        background-color:#646aff ;
        border-top-right-radius: 10px;
        border-bottom-right-radius: 10px;
    }
    #navbar li a{
        color:white;

    }

    #main-doc{
        position:absolute;
        margin-left:300px;
        margin-bottom:110px;
        padding:20px;
    }
    .image-container{
        display:grid;
        align-content: center;
    }
    img{
        width: 90%;
        height: auto;
        max-width: 50rem;
        box-shadow: 15px 15px 15px 1px  #757575;
        margin: 0 auto;
        margin-bottom: 20px;
    }

    thead{
    background-color:#00cfc3;
            
    }

    tr:nth-child(even) {
        background-color: #dddddd;
    }

    .main-section{
        border-bottom: 4px solid #00cfc3 ;
    }
    @media  (max-width:600px){
        #main-doc{
            margin-top:0px;
            margin-left:0px;
            position:relative;
        }

        #navbar{
            position:relative;
            width:100%;
        }
    }