.ui-slideouttab-panel, .ui-slideouttab-handle { background-color: #fff; padding: 0.4em; box-sizing: border-box; } .ui-slideouttab-panel { display: block; position: fixed; border: 1px solid #f9f9f9; } .ui-slideouttab-ready { transition: transform 0.5s ease 0s; } @media print { .ui-slideouttab-panel { display: none; } } .ui-slideouttab-handle { display: block; position: absolute; cursor: pointer; color: white; background-color: grey; } .ui-slideouttab-handle-image { transform: rotate(0); } .ui-slideouttab-right { right: 0px; transform: translateX(100%); border-right: none; } .ui-slideouttab-right.ui-slideouttab-open { transform: translateX(0%); } .ui-slideouttab-right .ui-slideouttab-handle { transform-origin: 0% 0%; transform: rotate(-90deg) translate(-100%,-100%);    } .ui-slideouttab-right .ui-slideouttab-handle-reverse { transform-origin: 0% 100%; transform: rotate(-90deg); } .ui-slideouttab-left { left: 0px; transform: translateX(-100%); border-left: none; } .ui-slideouttab-left.ui-slideouttab-open { transform: translateX(0%); } .ui-slideouttab-left .ui-slideouttab-handle { transform-origin: 100% 0%; transform: rotate(-90deg);    } .ui-slideouttab-left .ui-slideouttab-handle-reverse { transform-origin: 100% 100%; transform: rotate(-90deg) translate(100%,100%);    } .ui-slideouttab-top { top: 0px; transform: translateY(-100%); border-top: none; } .ui-slideouttab-top.ui-slideouttab-open { transform: translateY(0%); } .ui-slideouttab-bottom { bottom: 0px; transform: translateY(100%); border-bottom: none; } .ui-slideouttab-bottom.ui-slideouttab-open { transform: translateY(0%); } .ui-slideouttab-left .ui-slideouttab-handle>.fa-icon,  .ui-slideouttab-right .ui-slideouttab-handle>.fa-icon {  transform: rotate(90deg); } .ui-slideouttab-handle>.fa-icon { margin-left: 0.5em; } .ui-slideouttab-top .ui-slideouttab-handle-rounded, .ui-slideouttab-left .ui-slideouttab-handle-rounded { border-radius: 0 0 4px 4px; } .ui-slideouttab-right .ui-slideouttab-handle-rounded,  .ui-slideouttab-bottom .ui-slideouttab-handle-rounded { border-radius: 4px 4px 0 0; }