#list-user-sub{

    padding-right: 17px;

  }

  th#id {

    width: 5%;

}

th#avatar{width:10%;}

th#first_name {

    width: 10%;

}

th#last_name {

    width: 10%;

}

th#gender {

    width: 10%;

}

th#locale {

    width: 10%;

}

th#recipient_id {

    width: 15%;

}

th#day {

    width: 10%;

}

th#product {

    width: 25%;

}

  /*PAGINATION**/

  .spider-pagination {

            display: inline-block;

        }

        .spider-pagination a {

            color: black;

            float: left;

            padding: 8px 16px;

            text-decoration: none;

        }

        .spider-pagination a.active{

          color: #fff!important;

            background-color: #f44336!important;

        }

        .spider-pagination a:hover{

          text-decoration: underline;

        }

        .spider-pagination a.active:hover{

          text-decoration: none;

        }

 /*PAGINATION**/

.emojionearea .emojionearea-picker.emojionearea-picker-position-top{

  margin-top: -15px !important;

    right: -20px !important;

    top: 47px !important;

  }

  div#TB_ajaxWindowTitle{

    float: left;

    font-weight: 600;

    line-height: 29px;

    overflow: hidden;

    padding: 0 29px 0 10px;

    text-overflow: ellipsis;

    white-space: nowrap;

    width: calc( 100% - 39px );

  }

  #TB_title {

    background: #fcfcfc;

    border-bottom: 1px solid #ddd;

    height: 29px;

}

.tb-close-icon:before {

    content: "\f158";

    font: normal 20px/29px dashicons;

    speak: none;

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

}

span.tb-close-icon {

    display: block;

    color: #666;

    text-align: center;

    line-height: 29px;

    width: 29px;

    height: 29px;

    position: absolute;

    top: 0;

    right: 0;

}

span.tb-close-icon:hover{

  color: #ed1c24;

}

button#TB_closeWindowButton{

      position: absolute;

    left: auto;

    right: 0;

    width: 29px;

    height: 29px;

    border: 0;

    padding: 0;

    background: none;

    cursor: pointer;

    outline: none;

    -webkit-transition: color .1s ease-in-out, background .1s ease-in-out;

    transition: color .1s ease-in-out, background .1s ease-in-out;

 } 

  /*****************POPUP****************/

.ahachat_spider_create_group_popup{

    display: none;

    position: fixed;

    z-index: 99999;

    top: 0;

    left: 0;

    width: 100%;

    height: 100%;

    background-color: rgba(0, 0, 0, 0.47);

}

.ahachat_spider_create_group_popup.spider-open{

    display: block;

}

.ahachat_spider_create_group_popup .spider_create_group_format_body{

    position: absolute;

    width: 650px;

    max-width: 95%;

    max-height: 95%;

    overflow-y: auto;

    -webkit-overflow-scrolling: touch;

    top: 50%;

    left: 50%;

    -webkit-transform: translate(-50%,-50%);

    transform: translate(-50%,-50%);

}

.ahachat_spider_create_group_popup .spider_create_group_format_body .spider-popup-content{

    max-height: 100%;

    overflow-y: auto;

    z-index: 100;

    padding: 20px;

    background-color: #fff;

    /*border-radius: 5px;*/

}

.spider_close_popup{

    background-image: url('../images/ahachat_close.png');

    background-size: 44px 152px;

    position: absolute;

    right: 2px;

    width: 36px;

    height: 36px;

    cursor: pointer;

}

.spider_close_popup:hover{

    opacity: 0.6;

}

/**********************/

/**PREOGRESS BAR**/

progress[value] {

  /* Reset the default appearance */

  -webkit-appearance: none;

   appearance: none;

  width: 50%;

  height: 40px;

}

progress[value]::-webkit-progress-bar {

  background-color: #eee;

  border-radius: 2px;

  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;

}

progress[value]::-webkit-progress-value {

  background-image:

       -webkit-linear-gradient(-45deg, 

                               transparent 33%, rgba(0, 0, 0, .1) 33%, 

                               rgba(0,0, 0, .1) 66%, transparent 66%),

       -webkit-linear-gradient(top, 

                               rgba(255, 255, 255, .1), 

                               rgba(0, 0, 0, .1)),

       -webkit-linear-gradient(left, #7BC144, #7bc144);

    border-radius: 2px; 

    background-size: 100px 40px, 100% 100%, 100% 100%;

}

/**PREOGRESS BAR**/

.ahachat-fb-mess-result-fail {

    color: red;

}

.motionblur{

  animation: motion 200ms linear infinite;

}

@keyframes motion{

  to {

    transform: translate(0px, 30px);

  }

}

.rocket {

  animation: MoveUpDown 600ms alternate infinite ;

}

@keyframes MoveUpDown {

  to {

    transform: translate(0px, -2px);

  }

}

.s1{

  animation-delay:200ms;

}