init

public/frontend/webth/css/queries.css

@@ -0,0 +1,248 @@
+/* #Media Queries
+================================================== */
+@media only screen and ( min-width: 981px ) {
+  #mobile-header {
+    display: none! important;
+  }
+}
+
+@media only screen and ( max-width: 980px ) {
+  .tablet-hide {
+    display: none! important;
+  }
+
+  #logo {
+    margin-bottom: 10px;
+    margin-top: 0;
+    text-align: center;
+  }
+
+  #logo .shifter-handle, #search .shifter-handle {
+    display: none! important;
+  }
+}
+
+@media only screen and (min-width: 740px) {
+  #dropdown {
+    display: none;
+  }
+  .dropdownwrap {
+    display: block;
+  }
+}
+
+/* Tablet Portrait size to standard 960 (devices and browsers) */
+@media only screen and (min-width: 768px) and (max-width: 980px) {
+  .first {
+    clear: none;
+  }
+
+  .tablet-first {
+    clear: left;
+  }
+
+  .homepage-promo .caption p {
+    display: none! important;
+  }
+}
+
+/* All Mobile Sizes (devices and browser) */
+@media only screen and (max-width: 740px) {
+
+  #mobile-header {
+    display: block;
+  }
+
+  #top-bar {
+    margin-bottom: 0;
+    text-align: center! important;
+  }
+
+  .navigation {
+    display: none;
+  }
+
+  .text_section {
+    margin-top: 30px! important;
+  }
+
+  section.homepage-section.slideshow-section .row {
+    width: 100%;
+  }
+
+  section.homepage-section.slideshow-section .row .mobile-3 {
+    width: 100%;
+    margin: 0;
+  }
+
+  section.homepage-section.slideshow-section .flexslider .slides li img {
+    width: 150%! important;
+    margin-left: -25%;
+  }
+
+  #big-footer {
+    text-align: center;
+  }
+
+  .flex-caption {
+    width: 100%! important;
+    left: 50%! important;
+    margin-left: -50%! important;
+  }
+
+  .caption-inners {
+    width: 100%;
+  }
+
+  .flex-caption h2.slide-title {
+    font-size: 18px;
+    margin-bottom: 0;
+  }
+
+  .flex-caption p.caption {
+    font-size: 14px;
+  }
+
+  .cta {
+    margin-top: 20px! important;
+  }
+
+  .cta a {
+    font-size: 14px;
+    padding: 5px 8px! important;
+  }
+
+  .homepage-section .flexslider .slides img {
+    width: 150%! important;
+    margin-left: -25%;
+    max-width: initial! important;
+  }
+
+  .mobile-hide {
+    display: none;
+  }
+
+  .first {
+    clear: none;
+  }
+
+  .tablet-first {
+    clear: none;
+  }
+
+  .mobile-first {
+    clear: left;
+  }
+
+  .product-index:nth-child(2n+1) {
+    clear: left;
+  }
+
+  .homepage-promo {
+    margin-bottom: 20px;
+  }
+
+  .dropdownwrap {
+    display: none;
+  }
+
+  #search input#q {
+    text-align: center;
+    border: 1px solid #f5973b! important;
+    line-height: 24px;
+    width: 100%;
+  }
+
+  #subscribe_popup { width: 300px; }
+
+  #search i.fa.fa-search {
+    display: none;
+  }
+
+  #product-photos {
+    display: none;
+  }
+
+  div#product-description {
+    text-align: center;
+    margin-top: 30px;
+  }
+
+  .swatch-element {
+    float: none! important;
+    display: inline-block;
+    margin: 0 5px;
+  }
+
+  .product-add.clearfix {
+    text-align: center;
+  }
+
+  a.downer {
+    float: none;
+    display: inline-block;
+  }
+
+  a.up {
+    float: none;
+    display: inline-block;
+  }
+
+  input.quantity {
+    float: none;
+    display: inline-block! important;
+  }
+
+  input.add.clearfix {
+    float: none;
+    display: block;
+    margin: 20px auto;
+    width: 100%! important;
+  }
+
+  .desc {
+    text-align: center;
+  }
+
+  span.twitter, span.facebook, span.pinterest {
+    float: none;
+    display: inline-block;
+    vertical-align: top;
+  }
+
+  div#soc {
+    margin-bottom: 20px;
+  }
+
+  ul.view-more {
+    text-align: center;
+  }
+
+  ul#sortme li {
+    width: 100%;
+    margin: 0! important;
+    display: block;
+  }
+
+  #full-width-filter p {
+    display: block;
+    line-height: initial;
+    margin-bottom: 4px;
+  }
+
+  select.styled-select {
+    display: block;
+    width: 100%;
+    clear: left;
+    margin: 0;
+  }
+
+  #logo img {
+    max-width: 200px;
+  }
+
+  .map-section-content {
+    text-align: center;
+  }
+
+}