@import "https://fonts.googleapis.com/css?family=Roboto:500";
.sag-icon-bar{position:fixed;top:30%;right:0;width:50px;font-family: 'Roboto', 'sans-serif';z-index:99;}
.sag-icon-bar ul {list-style-type: none;margin: 0;padding: 0;display:flex;flex-direction:column}
.sag-icon-bar ul li{padding:10px}
.sag-icon-bar ul li.s1{background:#2db842;border-radius:10px 0 0 0}
.sag-icon-bar ul li.s2{background:#232323}
.sag-icon-bar ul li.s3{width:200px;line-height:35px;background:#fe9301;border-radius:10px 0 0 0;letter-spacing:1px;
    font-size:22px;font-weight:500;transform:rotate(-90deg) translateX(-100%);transform-origin:0 0;}
.sag-icon-bar ul li.s1:hover{background:#25c73d}
.sag-icon-bar ul li.s2:hover{background:#383838}
.sag-icon-bar ul li.s3:hover{background:#e08100}
.sag-icon-bar ul li a{color:#fff;display: flex;align-items: center;justify-content: center;text-decoration:none}
.sag-icon-bar ul li a i{font-size:24px;color:#fff}
.sag-icon-bar ul li.s3 a i{margin-right:5px}

@media only screen and (max-width: 560px) {
.sag-icon-bar{top:auto;bottom:0;width:100%}
.sag-icon-bar ul {flex-direction:row}
.sag-icon-bar ul li.s1{width:25%;border-radius:0}
.sag-icon-bar ul li.s2{width:25%}
.sag-icon-bar ul li.s3{font-size:18px;border-radius:0;line-height:23px;width:50%;transform:unset}
}