﻿            .fab {
              position: fixed;
              width: 56px;
              left: 32px;
              bottom: 15px;
              margin-left: -28px;
            }
            
            .fab:hover .fab-buttons {
              opacity: 1;
              visibility: visible;
            }
            
            .fab:hover .fab-buttons__link {
              transform: scaleY(1) scaleX(1) translateY(-16px) translateX(0px);
            }
            
            .fab-action-button:hover + .fab-buttons .fab-buttons__link:before {
              visibility: visible;
              opacity: 1;
              transform: scale(1);
              transform-origin: right center 0;
              transition-delay: 0.3s;
            }
            
            .fab-action-button {
              position: absolute;
              bottom: 0;
              display: block;
              width: 56px;
              height: 56px;
              background-color: #2c0d0f;
              border-radius: 50%;
              box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
            }
            
            .fab-buttons {
              position: absolute;
              left: 0;
              right: 0;
              bottom: 50px;
              list-style: none;
              margin: 0;
              padding: 0;
              opacity: 0;
              visibility: hidden;
              transition: 0.2s;
            }

            .fab-action-button__icon{
                display: inline-block;
                width: 56px;
                height: 56px;
                background: url('/image/login.svg') center no-repeat;
            }

            .fab-action-button-loggedin__icon {
                display: inline-block;
                width: 56px;
                height: 56px;
                background: url('/image/loggedin.svg') center no-repeat;
            }
            
            .fab-buttons__item {
              display: block;
              text-align: center;
              margin: 12px 0;
            }
            
            .fab-buttons__link {
              display: inline-block;
              width: 40px;
              height: 40px;
              text-decoration: none;
              background-color: #ffffff;
              border-radius: 50%;
              box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
              transform: scaleY(0.5) scaleX(0.5) translateY(0px) translateX(0px);
              -moz-transition: .3s;
              -webkit-transition: .3s;
              -o-transition: .3s;
              transition: .3s;
            }
            
            [data-tooltip]:before {
              top: 50%;
              margin-top: -11px;
              font-weight: 600;
              border-radius: 2px;
              background: #585858;
              color: #fff;
              content: attr(data-tooltip);
              font-size: 12px;
              text-decoration: none;
              visibility: hidden;
              opacity: 0;
              padding: 4px 7px;
              margin-right: 12px;
              position: absolute;
              transform: scale(0);
              right: 100%;
              white-space: nowrap;
              transform-origin: top right;
              transition: all .3s cubic-bezier(.25, .8, .25, 1);
            }
            
            [data-tooltip]:hover:before {
              visibility: visible;
              opacity: 1;
              transform: scale(1);
              transform-origin: right center 0;
            }
            
            .icon-material {
              display: inline-block;
              width: 40px;
              height: 40px;
            }

            .icon-material_edit {
                background: url('/image/edit.svg') center no-repeat;
            }

            .icon-material_exit {
                background: url('/image/logout.svg') center no-repeat;
            }

            .icon-material_panel {
                background: url('/image/settings.svg') center no-repeat;
            }
            
           