/*========================================================

Project:  ChatPro - All in One Chat on Any Social Plateform jQuery Plugin
Author:  Black Theme
Released On:  25, Nov 2019
@version:  1.0
 
==========================================================*/

/* ChatPro Main Panel */
.cp-style6{
    font-family: 'Open Sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
    z-index: 9999;
}

/* Menu List */
.cp-style6 .cp-menu{
    position: fixed;
    display: flex;
    flex-direction: column;
    top: 10px;
    right: 10px;
    width: 51px;
    border-radius: 25px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    transition: 0.3s border-radius ease-in-out, 0.3s height ease-in-out;
}
.cp-style6 .cp-menu--closed{
    height: 50px;
}
.cp-style6 .cp-menu--open{
    height: 500px;
}

/* Menu Button */
.cp-style6 .cp-button{    
    position: fixed;
    display: flex;
    flex-wrap: wrap;    
    top: 13px;
    border: 2px solid #fff;
    border-radius: 50px;
    align-items: center; 
    cursor: pointer; 
    opacity: 1;   
    transition: 0.3s transform ease-in-out, 0.3s opacity ease-in-out;
}
.cp-style6 .cp-button .fa-comments-o{     
    padding: 7px;
    font-size: 26px;
}
.cp-style6 .cp-button .fa-times{ 
    padding: 7px 9px;
    font-size: 26px;
}

/* Circle Menu Social icon */
.cp-style6 .cp-tools{
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: center;
    height: 78%;
    justify-content: space-between;
    transition: 0.3s margin ease-in-out;
}
.cp-style6 .cp-tools .cp-icon{
    position: absolute;
    right: 13px;
    width: 25px;
    transition: 0.2s transform ease-in-out;
}
.cp-style6 .cp-tools .cp-icon:hover{
    transform: scale(0.8);
}
.cp-style6 .cp-tools--hidden{
    margin-top: 400px;
    z-index: -100;
}
.cp-style6 .cp-tools--visible{
    margin-top: 20px;
    z-index: 100;
}