aside {
display: block;
- position: absolute;
+ position: fixed;
max-width: 400px;
width: 80%;
left: -100%;
+ -webkit-transition: left 0.5s;
+ -moz-transition: left 0.5s;
+ -o-transition: left 0.5s;
transition: left 0.5s;
}
aside.show {
left: 0;
}
+
+/* tabs */
+.tabs { position: relative; height: 25px!important; }
+.tabs li { width: 100%; }
+.tabs .tab { display: none;}
+.tabs .tab.active { display: block; }
+.tabs::after {
+ font-family: FontAwesome;
+ text-align: right;
+ content: "\f13a";
+ display: block;
+ position: absolute;
+ left: 0; right:0; top: 0; bottom: 0;
+ padding: 8px 2px 0 0;
+}
+
+.tabs.show {
+ position: fixed;
+ z-index: 1000;
+ left: 10px;
+ right: 10px;
+ top: 0px;
+ bottom: 10px;
+ height: auto !important;
+ border: 1px solid #ccc;
+}
+.tabs.show::after { display: none; }
+.tabs.show .tab { display: block; }