src/components/Emoji/Emojicontainer.scss
.emojicontainer{
    display: flex;
    flex-direction: column;
    height:38rem;
    border-radius: .5rem;
    background-color: #2f3136;
    width:30rem;
    position: relative;
    z-index:100;
    &__header{
        padding: 1.2rem;
        display: flex;
        align-items: center;
        flex:1;
        z-index:50;
        border-bottom: 1px solid #202225;
        &-inputdiv{
            margin-right: auto;
            display: flex;
            flex:1;
            align-items: center;
            position: relative;
        }
        &-form{
            display: block;
            flex:1;
            margin-right: auto;
            display: flex;
            margin-right: -12%;
        }
        &-input{
            color:#dcddde;
            background-color: #202225;
            border:0;
            outline:0;
            font-size: 1.6rem;
            flex:1;
            padding: .8rem;
            display: block;
        }
        &-handicon{
            font-size: 2.4rem;
            padding-left: 1.2rem;
        }
    }
    &__body{
        display: flex;
        height:100%;
    }
    &__sidebar{
        padding-top: 1rem;
        flex:0 0 12%;
        background-color: #202225;
        display: flex;
        flex-direction: column;
        align-items: center;
        &-items{
            // width: 3.2rem;
        }
        &-item{
            // padding: 1rem;
            font-size: 2.2rem;
            margin-bottom: .8rem;
        }
    }
    &__content{
        display: flex;
        flex-direction: column;
        overflow: hidden scroll;
        height: 100%;
        background-color: #2f3136;
        &-header{
            margin-left: .8rem;
            color:#b9bbbe;
            padding: .4rem .4rem;
            font-size: 1.2rem;
        }
        &-items{
            display: flex;
            align-items: center;
            flex-wrap: wrap;
            height: 100%;
        }
        &-item{
            height:3.2rem;
            width:3.2rem;
            font-size: 2.2rem;
            margin-left: .8rem;
            &:hover{
                background-color: #4f545c;
            }
        }
        &::-webkit-scrollbar {
            width: 10px;
          }
        &::-webkit-scrollbar-track {
            background: #2e3338;
            background-clip: content-box;
            }
        &::-webkit-scrollbar-thumb {
            background: #202225;
            height:1rem;
            } 
         
    }
}