anurag.css

#search-icon {
    color: rgb(163, 35, 35);
    font-size: 22px;
}

#search-input {
    border: none;
    background: transparent;
    color: white;
    width: 75%;
    outline: none;
}

.search-bar {
    position: fixed;
    height: auto;
    top: 23px;
    margin-left: 33em;
    background-color: rgb(158, 226, 21);
    border-radius: 25px;
    padding: 5px 10px;
}

.image {
    position: fixed;
    height: auto;
    left: 0px;
    width: 70px;
    margin-left: 5em;

}

* {
    box-sizing: border-box;

}

body {
    padding: 0px;
    margin: 0px;
    background-color: white;
    font-family: 'Lora', serif;
}



header {
    background: blue;
    height: 66px;
}

header * {
    color: white;
}

header .logo {
    float: left;
    height: inherit;
    margin-left: 9em;
}

header .logo-text {
    margin: 9px;
    font-family: 'Candal', sans-serif;
}

header .logo-text span {
    color: rgb(158, 226, 21);
}

header ul {
    float: right;
    margin: 0px;
    padding: 0px;
    list-style: none;

}

header ul li {
    float: left;
    position: relative;
}

header ul li ul {
    position: absolute;
    top: 66px;
    right: 0px;
    width: 180px;
    display: none;

}

header ul li:hover ul {
    display: block;
}

header ul li ul li {
    width: 100%;
}

header ul li ul li a {
    padding: 10px;
    background: white;
    color: #444;
}

header ul li ul li a.Logout {
    text-decoration: none;
    color: red;

}

header ul li ul li a:hover {
    background-color: rgb(178, 222, 246);
}

header ul li a {
    display: block;
    padding: 21px;
    font-size: 1.25em;
    text-decoration: none;

}

header ul li a:hover {
    background: #698fe6;
    transition: 0.5s;
}

header .menu-toggle {
    display: none;
}

/* MEDIA QUERIES */
@media only screen and (max-width: 750px) {
    header {
        position: relative;
    }



    header ul {
        width: 100%;
        background: rgb(20, 91, 112);
        overflow: hidden;
    }




    header ul li {
        width: 100%;
    }

    header ul li ul {
        position: static;
        display: block;
        width: 100%;

    }

    header ul li ul li a {
        padding: 10px;
        background: rgb(20, 91, 112);
        color: white;
        padding-left: 50px;
    }

    header ul li ul li a.Logout {
        text-decoration: none;
        color: red;

    }

    header .menu-toggle {
        display: block;
        position: absolute;
        right: 20px;
        top: 20px;
        font-size: 1.9em;
    }

    header .logo {
        margin-left: 5em;
    }

    header .logo-text {
        font-size: 2em;
    }

    header .logo-text span {
        color: rgb(158, 226, 21);
    }

    .image {
        position: fixed;
        height: auto;
        left: 0px;
        width: 70px;
        margin-left: 1em;

    }

    #search-icon {
        color: rgb(163, 35, 35);
        font-size: 22px;
    }

    #search-input {
        border: none;
        background: transparent;
        color: white;
        width: 75%;
        outline: none;
    }

    .search-bar {
        position: fixed;
        height: auto;
        top: 23px;
        margin-right: 4em;
        background-color: rgb(158, 226, 21);
        border-radius: 25px;
        padding: 5px 10px;
    }





}