/******************************* * MODAL AS LEFT/RIGHT SIDEBAR * Add "left" or "right" in modal parent div, after class="modal". * Get free snippets on bootpen.com *******************************/ .modal.left .modal-dialog, .modal.right .modal-dialog { position: fixed; margin: auto; width: 320px; height: 100%; -webkit-transform: translate3d(0%, 0, 0); -ms-transform: translate3d(0%, 0, 0); -o-transform: translate3d(0%, 0, 0); transform: translate3d(0%, 0, 0); } .modal.left .modal-content, .modal.right .modal-content { /*height: 100%;*/ height: auto; overflow-y: auto; display: contents; position: absolute; top: 25%; } .modal.left .modal-body, .modal.right .modal-body { padding: 0px; position: absolute; top: 25%; } /*Left*/ .modal.left.fade .modal-dialog{ left: -320px; -webkit-transition: opacity 0.3s linear, left 0.3s ease-out; -moz-transition: opacity 0.3s linear, left 0.3s ease-out; -o-transition: opacity 0.3s linear, left 0.3s ease-out; transition: opacity 0.3s linear, left 0.3s ease-out; } .modal.left.fade.in .modal-dialog{ left: 0; } /*Right*/ .modal.right.fade .modal-dialog { right: -320px; -webkit-transition: opacity 0.3s linear, right 0.3s ease-out; -moz-transition: opacity 0.3s linear, right 0.3s ease-out; -o-transition: opacity 0.3s linear, right 0.3s ease-out; transition: opacity 0.3s linear, right 0.3s ease-out; } .modal.right.fade.in .modal-dialog { right: 0; height: auto; position: absolute; top: 25%; } /* ----- MODAL STYLE ----- */ .modal-content { border-radius: 0; border: none; } .modal-header { border-bottom-color: #EEEEEE; background-color: #FAFAFA; } /* ----- v CAN BE DELETED v ----- */ body { background-color: #78909C; } .demo { padding-top: 60px; padding-bottom: 110px; } .btn-demo { margin: 15px; padding: 10px 15px; border-radius: 0; font-size: 16px; background-color: #FFFFFF; } .btn-demo:focus { outline: 0; } .demo-footer { position: fixed; bottom: 0; width: 100%; padding: 15px; background-color: #212121; text-align: center; } .demo-footer > a { text-decoration: none; font-weight: bold; font-size: 16px; color: #fff; } .floatGroupBuy { position:fixed; width:30px; bottom:45vh; right:20px; z-index:1000; border: none; background: none; } .my-floatGroupBuy{ margin-top:1px; }