@import "https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900";
.sag-icon-bar{position:fixed;top:30%;right:0;width:50px;padding:0;background:#292929;z-index:99;border-radius:10px 0 0 10px;font-family: 'Roboto', 'sans-serif'}
.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:#FF0000;border-radius:0 0 0 0}
.sag-icon-bar ul li.s2{background:#232323}
.sag-icon-bar ul li.s3{background:#fe9301;border-radius:10px 0 0 0}
.sag-icon-bar ul li.s4{background:#2db842}
.sag-icon-bar ul li.s5{background:#0033CC;border-radius:10px 0 0 0}
.sag-icon-bar ul li.s6{background:#0A66C2}

.sag-icon-bar ul li.s1:hover{background:#FF0000}
.sag-icon-bar ul li.s2:hover{background:#232323}
.sag-icon-bar ul li.s3:hover{background:#fe9301}
.sag-icon-bar ul li.s4:hover{background:#2db842}
.sag-icon-bar ul li.s5:hover{background:#0033CC}
.sag-icon-bar ul li.s6:hover{background:#0A66C2}

.sag-icon-bar ul li a i{font-size:24px;color:#fff}
.sag-icon-bar ul li a.teklifal{margin-right:5px}
.sag-icon-bar ul li a{color:#fff;display: flex;align-items: center;justify-content: center;text-decoration:none}
.rotate_text{color:#fff;font-weight:500;line-height:35px;letter-spacing:1px;font-size:22px;width:100px;transform-origin:0 0;transform:rotate(-90deg) translateY(0px) translateX(calc(-100% - 0px))}
@media only screen and (max-width: 560px) {

.sag-icon-bar ul {flex-direction:row}
.sag-icon-bar ul li .s3.rotate_text{color:#fff;font-weight:500;line-height:35px;letter-spacing:1px;font-size:24px;position:absolute;width:49%!important;transform-origin:0 0;transform:rotate(0deg) translateY(0px) translateX(calc(0% - 0px))}
.sag-icon-bar{position:fixed;display:inline-block;top:auto;bottom:0;width:100%;padding:0;background:#292929;z-index:99;border-radius:10px 0 0 10px}
.sag-icon-bar ul li.s1{background:#FF0000;float:left;width:25%;display:inline-block;border-radius:0 0 0 0}
.sag-icon-bar ul li.s2{background:#232323;float:left;display:inline-block;width:25%}
.sag-icon-bar ul li.s3{background:#fe9301;font-size:18px;border-radius:0 0 0 0;font-weight:900;line-height:23px;letter-spacing:1px;width:50%;display:inline-block;transform:rotate(0deg) translateY(0px) translateX(calc(0px - 0px))}
.sag-icon-bar ul li.s4{background:#2db842;float:left;display:inline-block;width:25%}
.sag-icon-bar ul li.s5{background:#0033CC;float:left;display:inline-block;width:25%}
.sag-icon-bar ul li.s6{background:#0A66C2;float:left;display:inline-block;width:25%}

.sag-icon-bar ul li.s1:hover{background:#FF0000}
.sag-icon-bar ul li.s2:hover{background:#232323}
.sag-icon-bar ul li.s3:hover{background:#fe9301}
.sag-icon-bar ul li.s4:hover{background:#2db842}
.sag-icon-bar ul li.s5:hover{background:#0033CC}
.sag-icon-bar ul li.s6:hover{background:#0A66C2}

.sag-icon-bar ul li a i{font-size:24px;color:#fff}
.sag-icon-bar ul li a{color:#fff}
}