header {
    height: 70px;
    width: 100%;
    background: blue;
    color: white;
    padding: 10px;
    display: none;
    justify-content: space-between;
    align-items: center;
    position: fixed;
    z-index: 1000;
}

header img {
    width: 30px;
    height: 30px;
}


.message-conatiner {
    background: red !important;
    width: 100%;
    height: 100px;
}

.hide {
    position: absolute;
    top: 10px;
    right: 10px;
    box-shadow: -1px 1px 3px 5px rgba(255, 255, 255, 0.2);
    padding: 10px 13px;
    border-radius: 50px;
    background: rgba(0,0,0, 0.3);
    display: none;
}

.radius {
    border-radius: 0 !important;
}





@media only screen and (max-width:690px){
    header {
        display: flex;
    }

    .rounded-md{
        border-radius: 2px;
    }

    .sidebar {
        position:fixed;
        z-index: 10000;
        top: 0;
        width: 200px;
        bottom: 0;
        left: 0;
        justify-content: space-between;
    }
    .social-links {
        margin-top: 50px;

    }
    .social-links a img {
        width: 30px;
        height: 30px;
    }
    .hide {
        display: block;
    }
    .sidebar-middle {
        margin-top: 50px;
    }
}