/* General styling */
a{
        text-decoration: none !important;
        
}
a:hover{
        box-shadow: none !important;
      }

ul{
    margin-block-start: 0em !important;
    margin-block-end: 0em !important;
    padding-inline-start: 0px !important;
}
 
/* Header */

header{
        background-color: rgb(75, 0, 130);
        width: 100%;
        height: 48px;  
}
.header__content{
        padding: 0 121px;
}
.header__content span{
                font-size: 14px;
                font-family: "Poppins";
                color: rgb(255, 255, 255);
                text-transform: uppercase;
                line-height: 3.2;                           
}

.header__content a{
        font-size: 14px;
        font-family: "Poppins";
        color: rgb(255, 255, 255);
        text-transform: uppercase;  
}

.header__content a:hover{
        color: rgb(255, 255, 255); 
}


.header__content i{
                font-size: 14px;
                font-family: "Poppins";
                color: rgb(255, 255, 255);
}

/* logout modal */
#logoutmodal .modal-header{
        background-color: #6f3699;
}

#logoutmodal .modal-header .modal-title{
        color: white;
}




.logoutbtnDiv {
        display: flex;
        justify-content: space-between;
        width: 97%;
        margin-top: 20px;
}

#logoutmodal .modal-body h1{
        font-size: 20px;
        font-family: "Poppins";
        margin-top: 10px;
}

#logoutmodal .modal-footer{
        background-color: #4B0082;
        display: block;
}

/* reset password */
.resetpassword{
        display: flex;
        justify-content: space-evenly;
        padding: 10px 0;
}
.resetpassword input{
        font-size: 12px;
        width: 35%;
        margin: 0 0.5% !important;
        height: 40px;
}

.resetpassword input[type=password]::placeholder{
        font-size: 12px;
}

.resetpassword button{
        width: 25%;
        margin: 0px auto !important;
        
}


/* Nav */
nav ul li a{
        
                font-size: 16px;
                font-family: "Poppins";
                color: rgb(48, 48, 48);
                text-transform: uppercase;
                line-height: 1.2;
                padding: 0 18px !important;
}
nav ul li a:hover{
        color: #4B0082 !important;
}

/* Logout btn*/
.logout{
        margin-top: -10px;
        background-color: #6f3699;
        color: white;
}

.logout:hover{
        background-color: white;
        color: #6f3699;
}

/* Footer */
.footer{
        background: url('../images/footer/background.jpg');
        background-repeat: no-repeat;
        height: auto;
        min-height: 380px;
        background-size: cover;
        margin-top: 100px;
        
}
.footer-icons i{
        font-size: 18px;
        color: white;
        padding: 20px;
}
.footer-nav{
margin-top: 36px;
border-top: 1px solid #6f3699; 
border-bottom:1px solid #6f3699;
padding: 24px 0;
}

.footer-nav ul{

    margin-block-start: 0em !important;
    margin-block-end: 0em !important;
    padding-inline-start: 0px !important;
}

.footer-nav ul li{
        display: inline-block;
        
}

.footer-nav ul li a{
        font-size: 16px;
        color: rgb(255, 255, 255);
        line-height: 1.438;
      }

.copyright {
        font-size: 14px;
        font-family: "Poppins";
        color: rgb(255, 255, 255);
        padding-top: 20px;
        
      }


/* Media Queries  */
@media(max-width:1199px){
        .header__content {
                padding: 0 32px;
            }
}
@media(max-width:991px){
        /* Header */
        .header__content {
                padding: 0 0px;
            }
        
        .logo{
                width: 80px;
                height: 80px;
        }
        nav{
                position: relative;
        }
        .navbar-collapse{
                position: absolute;
                top: 110px;
                left: 0;
                background-color:#6f3699;
                width: 99%;
                
                opacity: 1;
                z-index: 100;
        }
        nav ul li{
                border: 1px solid white;
                padding: 16px 0 !important;
        }
        nav ul li a{
                color: white !important;
        }

        .li-div:hover{
                background-color: white;   
        }

        .li-div:hover .nav-link{
                color: #6f3699 !important;
        }
}

@media(max-width:575px){
    /* Header */
.header__content span{
                font-size: 12px;
                line-height: 4;                
}

.header__content a,.header__content i{
        font-size: 12px;       
}

#logoutmodal .modal-body {
        width: 100% !important;
        height: auto !important;
    }

/* navbar */
nav ul li a{
        font-size: 14px;
}

/* Footer */
.footer-nav ul li a {
        font-size: 13px;
}
.copyright {
        font-size: 13px;
}

}

@media(max-width:430px){
        .footer-nav ul li a {
                font-size: 12px;
        }
        .copyright {
                font-size: 12px;
        } 
        .footer-icons i {
                font-size: 13px;
                padding: 10px;
            }

            #logoutmodal .modal-body {
                    padding: 5px !important;
            }
}
@media(max-width:360px){
        .footer-nav ul li a {
                font-size: 10px;
        }
        .copyright {
                font-size: 11px;
        } 
        .footer-icons i {
                font-size: 15px;
                padding: 8px;
            }
}