.live_contact .main_button{background:#001e3f;border:6px solid #001e3f60}

.live_contact .main_button:not(.active):before{background-color:#001e3f}
.live_contact .sub_buttons_container .sub_button{background:#001e3f}

/*تغطية الشاشة*/
.contact_overlay{position:fixed;top:0;left:0;width:100%;height:100vh;background:rgba(0,0,0,.3);z-index:900;display:none}

.contact_overlay.active{z-index:1100}

.live_contact{margin:10px;z-index:900}

  .live_contact.active{ z-index:1100 }
  
  .live_contact .main_button{
      position:relative;width:70px;
      height:70px;
      border-radius:50%;
      -webkit-background-clip:padding-box;
      background-clip:padding-box;
      display:flex;
      justify-content:center;
      align-items:center;
      cursor:pointer
  }

  .live_contact .main_button:not(.active):before{
      z-index:-10;content:'';position:absolute;top:-21px;left:-21px;display:block;width:100px;height:100px;border-radius:50%;animation:pulse-ring 2s cubic-bezier(0.3,.6,.4,2) infinite}

@keyframes pulse-ring{0%{transform:scale(.33)}90%,100%{opacity:0}}

.live_contact .active{background:#ccc;border:6px solid rgba(0,0,0,.2);-webkit-background-clip:padding-box;background-clip:padding-box}

.live_contact .main_button i{font-size:26px;color:white;text-shadow:1px 1px 1px rgba(0,0,0,.1)}

.live_contact .main_button span{font-size:32px;color:white;text-shadow:1px 1px 1px rgba(0,0,0,.1);display:none}

.live_contact .sub_buttons_container{position:relative;top:20px;width:70px;display:none;opacity:0;flex-direction:column;justify-content:flex-end;align-items:center}

.live_contact .sub_buttons_container .sub_button{width:50px;height:50px;border-radius:50%;display:flex;justify-content:center;align-items:center;
                                                 margin-bottom:6px;box-shadow:1px 1px 2px rgba(0,0,0,.25);
                                                 transition:all .5s;cursor:pointer}

.live_contact .sub_buttons_container .sub_button_container{position:relative}
.live_contact .sub_buttons_container .sub_button_container span{width:100px;position:absolute;left:60px;top:10px;padding:5px;background:rgba(255,255,255,.8);border-radius:3px;text-align:center;opacity:0;transition:all .5s}
.live_contact .sub_buttons_container .sub_button:hover{box-shadow:1px 1px 12px rgba(0,0,0,.5)}
.live_contact .sub_buttons_container .sub_button:hover span{opacity:1}
.live_contact .sub_buttons_container .sub_button i{font-size:22px;color:white;text-shadow:1px 1px 1px rgba(0,0,0,.1)}