responsive.css 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210
  1. /**
  2. * @version 7.9 [rev.7.9.03]
  3. */
  4. /* xs */
  5. @media (max-width: 767px) {
  6. body {
  7. padding: 50px 0 0 0;
  8. }
  9. /* reset input fields for the listing details page */
  10. .product .form-control {
  11. display: inline-block;
  12. width: inherit;
  13. }
  14. .details-content .dl-horizontal dt {
  15. width: auto;
  16. }
  17. .details-content .dl-horizontal dd {
  18. margin-left: 0;
  19. }
  20. .navbar-static-top {
  21. margin: 0 auto;
  22. }
  23. #main-nav > li {
  24. width: 33%;
  25. border: none;
  26. }
  27. .main-content {
  28. border-radius: 0 0 0 0;
  29. box-shadow: none;
  30. border: none;
  31. }
  32. .breadcrumbs {
  33. background: none;
  34. }
  35. .btn-sidebar {
  36. display: block;
  37. }
  38. .search ul {
  39. width: 100%;
  40. }
  41. #view-switch {
  42. padding-left: 0;
  43. }
  44. .product .manage-buttons {
  45. display: none;
  46. }
  47. .carousel-inner .col-xs-3 {
  48. padding-left: 5px;
  49. padding-right: 5px;
  50. }
  51. .row-offcanvas-right .sidebar-offcanvas {
  52. right: -74%;
  53. }
  54. .row-offcanvas-left .sidebar-offcanvas {
  55. left: -74%;
  56. }
  57. .row-offcanvas-right.active {
  58. right: 80%;
  59. }
  60. .row-offcanvas-left.active {
  61. left: 80%; /* 6 columns */
  62. }
  63. .sidebar-offcanvas {
  64. position: absolute;
  65. top: 0;
  66. width: 77%; /* 6 columns */
  67. }
  68. .grid {
  69. width: 50%;
  70. }
  71. .recently-viewed .grid {
  72. width: 50%;
  73. }
  74. }
  75. /* sm */
  76. @media (min-width: 768px) and (max-width: 991px) {
  77. .row-offcanvas-left .sidebar-offcanvas {
  78. left: -40%;
  79. }
  80. .row-offcanvas-left.active {
  81. left: 42%;
  82. }
  83. .sidebar-offcanvas {
  84. position: absolute;
  85. top: 0;
  86. width: 40%;
  87. }
  88. }
  89. /* md */
  90. @media (min-width: 992px) and (max-width: 1199px) {
  91. }
  92. /* lg */
  93. @media (min-width: 1200px) {
  94. }
  95. /* xs & sm */
  96. @media (max-width: 991px) {
  97. .row-offcanvas {
  98. display: block;
  99. position: relative;
  100. }
  101. .container {
  102. padding-left: 10px;
  103. padding-right: 10px;
  104. width: 100%;
  105. }
  106. }
  107. /* sm & md & lg */
  108. @media (min-width: 768px) {
  109. .input-tiny,
  110. .navbar-form .input-tiny,
  111. .form-inline .input-tiny {
  112. width: 60px;
  113. }
  114. .input-mini,
  115. .navbar-form .input-mini,
  116. .form-inline .input-mini {
  117. width: 80px;
  118. }
  119. .input-small,
  120. .navbar-form .input-small,
  121. .form-inline .input-small {
  122. width: 105px;
  123. }
  124. .input-default,
  125. .navbar-form .input-default,
  126. .form-inline .input-default {
  127. width: 150px;
  128. }
  129. .input-medium,
  130. .navbar-form .input-medium,
  131. .form-inline .input-medium {
  132. width: 240px;
  133. }
  134. .input-large,
  135. .navbar-form .input-large,
  136. .form-inline .input-large {
  137. width: 300px;
  138. }
  139. .input-xlarge,
  140. .navbar-form .input-xlarge,
  141. .form-inline .input-xlarge {
  142. width: 430px;
  143. }
  144. }
  145. /* md & lg */
  146. @media (min-width: 992px) {
  147. }
  148. /* screen */
  149. @media screen {
  150. /* print only blocks */
  151. .print-only {
  152. display: none;
  153. }
  154. }
  155. /* print */
  156. @media print {
  157. .tab-content > .tab-pane {
  158. display: block;
  159. }
  160. .print-only {
  161. display: block !important;
  162. }
  163. .no-print {
  164. display: none !important;
  165. }
  166. a:link:after, a:visited:after {
  167. display: none;
  168. content: "";
  169. }
  170. }