.label-container-1 {
    position:fixed;
    bottom:48px;
    right:105px;
    display:table;
    visibility: hidden;
}

.label-container-2 {
    position:fixed;
    bottom:118px;
    right:105px;
    display:table;
    visibility: hidden;
}

.label-container-3 {
    position:fixed;
    bottom:48px;
    right:105px;
    display:table;
    visibility: hidden;
}

.label-container-4 {
    position:fixed;
    bottom:118px;
    right:105px;
    display:table;
    visibility: hidden;
}

.label-text {
    color:#FFF;
    background:rgba(51,51,51,0.5);
    display:table-cell;
    vertical-align:middle;
    padding:10px;
    border-radius:3px;
}

.label-arrow {
    display:table-cell;
    vertical-align:middle;
    color:#333;
    opacity:0.5;
}

.float-1 {
    position:fixed;
    width:60px;
    height:60px;
    bottom:40px;
    right:40px;
    color:#FFF;
    border-radius:50px;
    text-align:center;
    box-shadow: 2px 2px 7px #000;
    animation: bot-to-top 2s ease-out;
}

.float-2 {
    position:fixed;
    width:60px;
    height:60px;
    bottom:110px;
    right:40px;
    color:#FFF;
    border-radius:50px;
    text-align:center;
    box-shadow: 2px 2px 7px #000;
    animation: bot-to-top 2s ease-out;
}

.float-3 {
    position:fixed;
    width:60px;
    height:60px;
    bottom:180px;
    right:40px;
    color:#FFF;
    border-radius:50px;
    text-align:center;
    box-shadow: 2px 2px 7px #000;
    animation: bot-to-top 2s ease-out;
}

.float-4 {
    position:fixed;
    width:60px;
    height:60px;
    bottom:250px;
    right:40px;
    color:#FFF;
    border-radius:50px;
    text-align:center;
    box-shadow: 2px 2px 7px #000;
    animation: bot-to-top 2s ease-out;
}

.float-4-bis {
    position:fixed;
    width:60px;
    height:60px;
    bottom:360px; 
    right:40px;
    color:#FFF;
    border-radius:50px;
    text-align:center;
    box-shadow: 2px 2px 7px #000;
    animation: bot-to-top 2s ease-out;
}

.my-float {
    font-size:24px;
    margin-top:18px;
}

a.float-1 + div.label-container-1 {
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s, opacity 0.5s ease;
}

a.float-1:hover + div.label-container-1 {
  visibility: visible;
  opacity: 1;
}

a.float-2:hover + div.label-container-2{
  visibility: visible;
  opacity: 1;
}

a.float-2 + div.label-container-2 {
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s, opacity 0.5s ease;
}

a#menu-share:active {
  opacity: 0.75;
}

a#menu-share:hover > i{
    animation: rotate-out 0.5s;
}

a#menu-share i{
    animation: rotate-in 0.5s;
}

a#menu-share:hover > img{
    animation: rotate-out 0.5s;
}

a#menu-share img{
    animation: rotate-in 0.5s;
}

@keyframes bot-to-top {
    0%   {bottom:-40px}
    50%  {bottom:40px}
}

@keyframes scale-in {
    from {transform: scale(0);opacity: 0;}
    to {transform: scale(1);opacity: 1;}
}

@keyframes rotate-in {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}

@keyframes rotate-out {
    from {transform: rotate(360deg);}
    to {transform: rotate(0deg);}
}

.btn.btn-card {
    background-color: #ffffff;
    color: #444444;
    margin-left: 10px;
    border-radius: 40px;
    width: 40px;
    height: 40px;
}

@media (max-width: 600px){
    .float-3{
        max-width:120px !important;
        max-height:120px !important;
        border-radius:50px;
    }
    .float-4-bis{
        bottom:310px; 
    }
}