1/* =Theme 2----------------------------------------------- */ 3 4/* Body */ 5body { 6 overflow-x: hidden; 7 padding: 40px 0 0; 8 width: 100%; 9 background: @ini_text_alt; 10 color: @ini_text; 11 -ms-word-wrap: break-word; 12 word-wrap: break-word; 13} 14body:after, 15body:before { 16 content: ''; 17 display: block; 18 position: fixed; 19 z-index: -1; 20 top: 0; 21 height: 200%; 22} 23body:after { 24 left: 0; 25 width: 300px; 26 background: @ini_theme_color; 27} 28body:before { 29 left: 300px; 30 width: 100px; 31 background: @ini_text_alt; 32} 33 34/* Page */ 35#page { 36 z-index: 1; 37 margin: 0; 38 width: (@ini_content_width + 400px); 39} 40#page:before { 41 content: ''; 42 display: block; 43 position: fixed; 44 z-index: -1; 45 top: 0; 46 left: 400px; 47 width: @ini_content_width; 48 height: 100%; 49 background: @ini_background; 50} 51 52/* Sidebar */ 53.sidebar-area { 54 position: relative; 55 float: left; 56 width: 300px; 57 padding: 0 40px; 58 -webkit-box-sizing: border-box; 59 -moz-box-sizing: border-box; 60 box-sizing: border-box; 61} 62#sidebar-toggle { 63 display: none; 64 position: absolute; 65 z-index: 3; 66 top: -40px; 67 left: 0; 68 height: 40px; 69 width: 40px; 70 background: @ini_theme_color_alt; 71 color: @ini_background; 72 line-height: 40px; 73 text-align: center; 74 text-decoration: none; 75} 76#sidebar-toggle:before, 77#sidebar-toggle:after { 78 content: ''; 79 display: block; 80 position: absolute; 81 border-top: 40px solid @ini_theme_color_alt; 82 border-right: 40px solid transparent; 83} 84#sidebar-toggle:before { 85 top: 40px; 86} 87#sidebar-toggle:after { 88 top: 0; 89 left: 40px; 90} 91#sidebar-toggle .genericon { 92 margin-top: 5px; 93 height: 40px; 94 width: 40px; 95 font-size: 40px; 96 line-height: 40px; 97 -webkit-transform: rotate(45deg); 98 -moz-transform: rotate(45deg); 99 -ms-transform: rotate(45deg); 100 -o-transform: rotate(45deg); 101 transform: rotate(45deg); 102} 103#sidebar-toggle.open .genericon { 104 -webkit-transform: rotate(0deg); 105 -moz-transform: rotate(0deg); 106 -ms-transform: rotate(0deg); 107 -o-transform: rotate(0deg); 108 transform: rotate(0deg); 109} 110 111/* Header */ 112.site-header { 113 background: @ini_theme_color; 114 color: @ini_background; 115} 116.site-logo { 117 display: block; 118 margin: 0 0 20px; 119 text-align: center; 120} 121.site-logo img { 122 display: block; 123} 124.site-branding { 125 position: relative; 126 padding: 0; 127 margin: 0 0 20px; 128 border-bottom: 15px double @ini_theme_color_alt; 129 text-align: center; 130} 131.site-title { 132 padding: 0 0 5px; 133 margin: 0; 134 font-size: 20px; 135 font-weight: bold; 136 text-transform: uppercase; 137} 138.site-title a { 139 display: inline-block; 140 color: @ini_background; 141 text-decoration: none; 142} 143.site-title a:hover { 144 color: @ini_theme_color_alt; 145} 146.site-description { 147 margin: 0 0 20px; 148 color: @ini_background; 149 font-size: 12px; 150 text-transform: uppercase; 151} 152 153/* Primary */ 154.content-area { 155 float: right; 156 width: @ini_content_width; 157 height: auto; 158 padding: 0 40px; 159 background: @ini_background; 160 -webkit-box-sizing: border-box; 161 -moz-box-sizing: border-box; 162 box-sizing: border-box; 163} 164 165/* Sidebar */ 166.widget-area, 167.widget-area a, 168.widget-area h1, 169.widget-area h2, 170.widget-area h3, 171.widget-area h4, 172.widget-area h5, 173.widget-area h6 { 174 color: @ini_background; 175} 176.widget-area a:hover, 177.widget-area a:focus, 178.widget-area a:active { 179 color: @ini_background_neu; 180} 181.widget-area { 182 width: 220px; 183} 184 185/* Footer */ 186.site-footer { 187} 188.site-info { 189 padding: 0 0 40px; 190 color: @ini_background; 191 font-size: 12px; 192 text-align: center; 193} 194.site-info a { 195 color: @ini_background; 196 text-decoration: none; 197} 198.site-info a:hover { 199 color: @ini_theme_color_alt; 200} 201