1@media (max-width: 979px) { 2 body { 3 padding-top: 0 4 } 5 6 .navbar-fixed-top, .navbar-fixed-bottom { 7 position: static 8 } 9 10 .navbar-fixed-top { 11 margin-bottom: 20px 12 } 13 14 .navbar-fixed-bottom { 15 margin-top: 20px 16 } 17 18 .navbar-fixed-top .navbar-inner, .navbar-fixed-bottom .navbar-inner { 19 padding: 5px 20 } 21 22 .navbar .container { 23 width: auto; 24 padding: 0 25 } 26 27 .navbar .brand { 28 padding-right: 10px; 29 padding-left: 10px; 30 margin: 0 0 0 -5px 31 } 32 33 .nav-collapse { 34 clear: both 35 } 36 37 .nav-collapse .nav { 38 float: none; 39 margin: 0 0 10px 40 } 41 42 .nav-collapse .nav > li { 43 float: none 44 } 45 46 .nav-collapse .nav > li > a { 47 margin-bottom: 2px 48 } 49 50 .nav-collapse .nav > .divider-vertical { 51 display: none 52 } 53 54 .nav-collapse .nav .nav-header { 55 color: #777777; 56 text-shadow: none 57 } 58 59 .nav-collapse .nav > li > a, .nav-collapse .dropdown-menu a { 60 padding: 9px 15px; 61 font-weight: bold; 62 color: #777777; 63 -webkit-border-radius: 3px; 64 -moz-border-radius: 3px; 65 border-radius: 3px 66 } 67 68 .nav-collapse .btn { 69 padding: 4px 10px 4px; 70 font-weight: normal; 71 -webkit-border-radius: 4px; 72 -moz-border-radius: 4px; 73 border-radius: 4px 74 } 75 76 .nav-collapse .dropdown-menu li + li a { 77 margin-bottom: 2px 78 } 79 80 .nav-collapse .nav > li > a:hover, .nav-collapse .dropdown-menu a:hover { 81 background-color: #f2f2f2 82 } 83 84 .navbar-inverse .nav-collapse .nav > li > a, .navbar-inverse .nav-collapse .dropdown-menu a { 85 color: #999999 86 } 87 88 .navbar-inverse .nav-collapse .nav > li > a:hover, .navbar-inverse .nav-collapse .dropdown-menu a:hover { 89 background-color: #111111 90 } 91 92 .nav-collapse.in .btn-group { 93 padding: 0; 94 margin-top: 5px 95 } 96 97 .nav-collapse .dropdown-menu { 98 position: static; 99 top: auto; 100 left: auto; 101 display: none; 102 float: none; 103 max-width: none; 104 padding: 0; 105 margin: 0 15px; 106 background-color: transparent; 107 border: 0; 108 -webkit-border-radius: 0; 109 -moz-border-radius: 0; 110 border-radius: 0; 111 -webkit-box-shadow: none; 112 -moz-box-shadow: none; 113 box-shadow: none 114 } 115 116 .nav-collapse .open > .dropdown-menu { 117 display: block 118 } 119 120 .nav-collapse .dropdown-menu:before, .nav-collapse .dropdown-menu:after { 121 display: none 122 } 123 124 .nav-collapse .dropdown-menu .divider { 125 display: none 126 } 127 128 .nav-collapse .nav > li > .dropdown-menu:before, .nav-collapse .nav > li > .dropdown-menu:after { 129 display: none 130 } 131 132 .nav-collapse .navbar-form, .nav-collapse .navbar-search { 133 float: none; 134 padding: 10px 15px; 135 margin: 10px 0; 136 border-top: 1px solid #f2f2f2; 137 border-bottom: 1px solid #f2f2f2; 138 -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); 139 -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); 140 box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1) 141 } 142 143 .navbar-inverse .nav-collapse .navbar-form, .navbar-inverse .nav-collapse .navbar-search { 144 border-top-color: #111111; 145 border-bottom-color: #111111 146 } 147 148 .navbar .nav-collapse .nav.pull-right { 149 float: none; 150 margin-left: 0 151 } 152 153 .nav-collapse, .nav-collapse.collapse { 154 height: 0; 155 overflow: hidden 156 } 157 158 .navbar .btn-navbar { 159 display: block 160 } 161 162 .navbar-static .navbar-inner { 163 padding-right: 10px; 164 padding-left: 10px 165 } 166} 167 168@media (min-width: 980px) { 169 .nav-collapse.collapse { 170 height: auto !important; 171 overflow: visible !important 172 } 173} 174 175@media (max-width: 767px) { 176 body { 177 padding-right: 20px; 178 padding-left: 20px 179 } 180 181 .navbar-fixed-top, .navbar-fixed-bottom, .navbar-static-top { 182 margin-right: -20px; 183 margin-left: -20px 184 } 185 186 .container-fluid { 187 padding: 0 188 } 189 190 .dl-horizontal dt { 191 float: none; 192 width: auto; 193 clear: none; 194 text-align: left 195 } 196 197 .dl-horizontal dd { 198 margin-left: 0 199 } 200 201 .container { 202 width: auto 203 } 204 205 .row-fluid { 206 width: 100% 207 } 208 209 .row, .thumbnails { 210 margin-left: 0 211 } 212 213 .thumbnails > li { 214 float: none; 215 margin-left: 0 216 } 217 218 [class*="span"], .uneditable-input[class*="span"], .row-fluid [class*="span"] { 219 display: block; 220 float: none; 221 width: 100%; 222 margin-left: 0; 223 -webkit-box-sizing: border-box; 224 -moz-box-sizing: border-box; 225 box-sizing: border-box 226 } 227 228 .span12, .row-fluid .span12 { 229 width: 100%; 230 -webkit-box-sizing: border-box; 231 -moz-box-sizing: border-box; 232 box-sizing: border-box 233 } 234 235 .row-fluid [class*="offset"]:first-child { 236 margin-left: 0 237 } 238 239 .input-large, .input-xlarge, .input-xxlarge, input[class*="span"], select[class*="span"], textarea[class*="span"], .uneditable-input { 240 display: block; 241 width: 100%; 242 min-height: 30px; 243 -webkit-box-sizing: border-box; 244 -moz-box-sizing: border-box; 245 box-sizing: border-box 246 } 247 248 .input-prepend input, .input-append input, .input-prepend input[class*="span"], .input-append input[class*="span"] { 249 display: inline-block; 250 width: auto 251 } 252 253 .controls-row [class*="span"] + [class*="span"] { 254 margin-left: 0 255 } 256 257 .modal { 258 position: fixed; 259 top: 20px; 260 right: 20px; 261 left: 20px; 262 width: auto; 263 margin: 0 264 } 265 266 .modal.fade { 267 top: -100px 268 } 269 270 .modal.fade.in { 271 top: 20px 272 } 273} 274 275@media (max-width: 480px) { 276 .nav-collapse { 277 -webkit-transform: translate3d(0, 0, 0) 278 } 279 280 .page-header h1 small { 281 display: block; 282 line-height: 20px 283 } 284 285 input[type="checkbox"], input[type="radio"] { 286 border: 1px solid #cccccc 287 } 288 289 .form-horizontal .control-label { 290 float: none; 291 width: auto; 292 padding-top: 0; 293 text-align: left 294 } 295 296 .form-horizontal .controls { 297 margin-left: 0 298 } 299 300 .form-horizontal .control-list { 301 padding-top: 0 302 } 303 304 .form-horizontal .form-actions { 305 padding-right: 10px; 306 padding-left: 10px 307 } 308 309 .media .pull-left, .media .pull-right { 310 display: block; 311 float: none; 312 margin-bottom: 10px 313 } 314 315 .media-object { 316 margin-right: 0; 317 margin-left: 0 318 } 319 320 .modal { 321 top: 10px; 322 right: 10px; 323 left: 10px 324 } 325 326 .modal-header .close { 327 padding: 10px; 328 margin: -10px 329 } 330 331 .carousel-caption { 332 position: static 333 } 334} 335