/* Theme Name: Wilkinsons Author: Chris Collins *//* #All Sizes================================================== */ .container {width: 96%;margin: 0 auto;max-width: 1600px;} #mobilemenuicon {display: none;top: -66px;left: -5px;} #shopping-cart .cart-pop-up li.line-item-summary-view-cart, #shopping-cart .cart-pop-up li.line-item-summary-checkout {display: inline-block;width: 49%;} #shopping-cart .cart-pop-up .view-footer .links a {margin: 5px 1%;padding: 10px;} .tabs-wrapper {top: -90px;} #block-block-4 .content span {display: block;text-align: right;float: left;} #block-block-4 .content span.delivery, #block-block-4 .content span.free-delivery {padding-right: 10%;} #block-block-4 p {margin: 0;} #block-views-exp-products-page-1 .views-exposed-widgets {position: relative;} #block-system-user-menu, #block-block-6 {top: -50px;position: absolute;right: -10px;} #block-block-6 {top:-80px;right:0px} ul.megamenu-skin-blanc > li > h2 a {font-size: 17px;letter-spacing: 1px; margin: 0 5px;} #block-block-5 {display: none;} /* Front */ #block-block-1, #block-views-taxonomy-block {width: 50%;} #block-block-1 .content, #block-views-taxonomy-block .content { width: 800px; padding: 100px 0; height: 200px;} #block-views-taxonomy-block .content { padding-left: 35px;} #block-views-taxonomy-block .views-row { display: block; width: 25%; height: 100px; padding: 20px; box-sizing: border-box; float: left; margin-right: 0px; margin-top: 0px;} /* Image Blocks */ .caption-image { position: absolute; top: 0px; pointer-events: none; width: 28.125%; margin: 2.8125%} #block-views-image-blocks-block { background: #fff; } .thirdw { width: 33.33%; } .thirdw .views-field-field-block-content { height: 320px; line-height: 320px; } .fullwil .views-field-path { width: 45%; -webkit-clip-path: polygon(100% 0%, 0% 0%, 0% 100%, 100% 100%, 100% 90%, 88% 75%, 100% 60%); clip-path: polygon(100% 0%, 0% 0%, 0% 100%, 100% 100%, 100% 90%, 88% 75%, 100% 60%); } .fullwil .views-field-field-block-content { width: 55%; min-height: 300px; line-height: 300px; } .fullwir .views-field-path { width: 55%; } .fullwir .views-field-field-block-content { width: 45%; min-height: 500px; line-height: 500px; } .twothirdw { width: 66.666666%; } .twothirdw .views-field-field-block-content .field-content { line-height: 80px; height: 88px; } .halfwctl, .halfwcbl { width: 50%; } /* Slideshow */ #block-views-slideshow-block .caption { font-size: 56px; padding: 15px 68px; } /* Image Blocks */ #block-views-image-blocks-block .views-row.columns-2 { width: 49%} #block-views-image-blocks-block .views-row.columns-2: nth-of-type(2n-1) { margin-right: 2%; } #block-views-image-blocks-block .views-row.columns-3 { width: 32%} #block-views-image-blocks-block .views-row.columns-3: nth-of-type(3n-1) { margin: 0 2%; } #block-views-image-blocks-block .views-row.columns-4 { width: 23.5%; margin-right: 2%} #block-views-image-blocks-block .views-row.columns-4: nth-of-type(4n) { margin-right: 0; } .twothirdw .views-field-field-block-content { display: table-footer-group; } #block-views-slideshow-block-1 {overflow:hidden; position: relative; display: none;} /* Products */ #block-views-all-content-block .content {padding: 50px;} .view-products .views-row a {font-size: 19px;} .view-products .views-field-title {height: 50px;overflow: hidden;} .view-products .views-field-commerce-price {height:106px} .view-products .views-row {width: 33%;} .newproduct { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); position: absolute; top: 35px; left: -55px; width: 190px;} /* News */ #block-views-all-content-block-2 .views-field-title a { height: 44px; font-size: 20px; line-height: 25px; } #block-views-all-content-block-2 .views-row { width: 33.33%; } #block-views-all-content-block-2 .views-field-path a { font-size: 18px; } /* Checkout */ .page-user .field-name-commerce-customer-billing, .page-user .field-name-commerce-customer-shipping { width: 50%; float: left; } /* Footer */ #block-block-3, #block-block-2 { width: 33.33%; float: left; } #block-views-tweet-feed-block-1 { position: absolute; right: 0px; top: 0px; text-align: left; width: 24%; } #block-views-tweet-feed-block-1 .content { padding-left: 2%; } #copyright { margin-top: 130px; } #bottom { padding: 100px 0; } /* REGIONS */ #logo {width: 100%;} #logo img {display: block; margin: 10px auto 0px auto;width: 370px;max-width: 100%;position: absolute;top: -95px;left: 50%;margin-left: -185px;} #navigation {margin-top: 95px;} #topbarleft {color: #fff;padding-right: 20%;} #menubarleft {position: absolute;top: -70px;left: 0px;width: 25%;} #topbarright, #menubarright {position: absolute;top: 0px;right: 0px;width: 25%;text-align: right;} /* GRID */ #inner-sidebar {float: left;width: 20%;margin-right: 2%;} .with-inner-sidebar {float: left;width: 78%;} .without-sidebar {width: 100%;} .with-sidebar {float: left;width: 70%;} .sidebar {float: right;width: 28%;margin-left: 2%;} .bottom-four {width: 17%;margin-left: 2%;float: left;} .bottom-three {width: 32%;margin-left: 2%;float: left;} .bottom-two {width: 49%;margin-left: 2%;float: left;} .bottom-one {width: 100%} .bottom-menus {overflow: hidden;} /* GRID OVERRIDES */ .node-type-product #inner-sidebar {width: 48%;margin-right: 2%;} .node-type-product .with-inner-sidebar {width: 50%;} /* #Extra Large Devices Desktops (up to 1600px)================================================== */ @media only screen and (max-width: 1600px) { /* Front */ #block-block-1 .content, #block-views-taxonomy-block .content {width: 650px;} /* Image Blocks */ .twothirdw .views-field-field-block-content {display:block;} .thirdw .views-field-field-block-content {height: 288px;line-height: 288px;} .fullwir .views-field-field-block-content {width: 45%;min-height: 400px;line-height: 400px;} /* Products */ .view-products .views-field-title {height:75px;} .view-products .views-row a {font-size: 19px;line-height: 21px;} } /* #Large Devices Desktops (up to 1300px)================================================== */ @media only screen and (max-width: 1300px) { .container {} /* Front */ #block-block-1 .content, #block-views-taxonomy-block .content {width: 96%;padding: 100px 2%;} #block-views-taxonomy-block .views-row {padding: 5px} /* Image Blocks */ .fullwil .views-field-field-block-content {min-height: 208px;line-height: 208px;} .fullwir .views-field-field-block-content {min-height: 282px;line-height: 282px;} .fullwir .views-field-field-block-content span { /* line-height: 100%;*/} .thirdw .views-field-field-block-content {height: 240px;line-height: 240px;} .twothirdw .views-field-field-block-content {} /* Slideshow */ #block-views-slideshow-block .caption { font-size: 40px; padding: 15px 50px; } /* Products */ .view-products .views-field-title { height: 75px; } .view-products .views-row a { font-size: 17px; line-height: 19px; } /* News */ #block-views-all-content-block-2 .views-field-title a { height: 70px; } /* Footer */ #bottom { padding: 70px 0; } } /* #Medium devices Desktops (up to 992px)================================================== */ /* Note: Design for a width of 992px */ @media only screen and (max-width: 992px) { .container {width: 90%;margin: 0 5%;} #topbar {padding: 10px 0;} #mobilemenuicon {display: block;} #topbar {height: 46px;} #navigation {margin-top: 0px;} #block-block-6 {top:0px;} /* make the search bar full width */ #menubarleft {width: 100%;} #block-views-exp-products-page-1 .form-text {max-width:100%!important;} #block-views-exp-products-page-1 .views-exposed-widget {padding-right:0px;} #block-views-exp-products-page-1 .views-exposed-widgets {margin:0 50px 0 50px;} #topbarright {width: auto;} #logo img {width: 60%;position: relative;top: 0px;left: 0px;margin: 15px auto;max-width:370px;margin-left: 0;} ul.megamenu-skin-blanc > li > h2 a {font-size: 12px;letter-spacing: 0px;margin: 0 1px;} #block-block-4 {display: none;} #block-system-user-menu {top: 30px} #block-block-5 {display: block;} #block-commerce-cart-cart {display: none;} .megamenu-skin-blanc li {font-size:13px;line-height:19px;} .megamenu-slot-title span, .megamenu-slot-title a {min-height:40px;} /* Front */ #block-block-1, #block-views-taxonomy-block {width: 100%;} #block-block-1 .content {padding-top: 100px;padding-bottom:10px;} #block-views-taxonomy-block .content {height: auto;padding: 50px 2%;} #block-views-taxonomy-block .views-row {display: inline-block;float: none;margin-right:10px;margin-top:10px;padding:10px;width: 22%;} /* Slideshow */ .view-slideshow li {overflow:hidden;width:100%;position:relative;} .view-slideshow li img.adaptive-image {height:340px!important;width:1000px!important;max-width:1600px!important;} .caption-image img {width:300px!important;} .caption-image {width:300px;margin:20px} /* Image Blocks */ .fullwil .views-field-field-block-content {min-height: 175px;line-height: 175px;} .fullwir .views-field-path {width: 55%;} .thirdw .views-field-field-block-content {height: 200px;line-height: 200px;} .twothirdw .views-field-field-block-content .field-content {line-height: initial;height: auto;} .fullwir .views-field-field-block-content, .fullwir .views-field-field-block-content span {font-size: 20px!important;} .fullwir .views-field-field-block-content {min-height: 222px;line-height: 222px;} /* Products */ .view-products .views-row {width: 50%;} /* News */ #block-views-all-content-block-2 .views-field-title a {height: 44px;} #block-views-all-content-block-2 .views-row {width: 50%;} } /* #Small devices Tablets (up to 767px)================================================== */ @media only screen and (max-width: 767px) { .container {} .tabs-wrapper {top: -5px;} #main-menu {display: none;} #navigation {margin-top: 0px;} #block-commerce-cart-cart {margin-top: 10px;} #block-commerce-cart-cart .content {font-size: 18px;line-height: 20px;} #shopping-cart .cart-pop-up li.line-item-summary-view-cart, #shopping-cart .cart-pop-up li.line-item-summary-checkout {width: 100%} #shopping-cart .cart-pop-up .view-footer .links a {width: 100%;margin: 5px 0;} #menubarright {width: 40%;} /* Front */ #block-views-taxonomy-block .views-row {width: 30%;} /* Image Blocks */ #block-views-slideshow-block .flex-direction-nav a {top: 12%} .halfwctl, .halfwcbl {width: 100%;} .caption-image img {width: 100%!important;} .thirdw, .twothirdw {width: 100%;} .fullwil .views-field-field-block-content, .fullwir .views-field-field-block-content {width: 100%;min-height: 30px;line-height: 30px;padding-top: 70px!important;} .fullwil .views-field-path {-webkit-clip-path: polygon(0% 100%, 0% 0%, 35% 0, 50% 20%, 65% 0, 100% 0%, 100% 100%); clip-path: polygon(0% 100%, 0% 0%, 35% 0, 50% 20%, 65% 0, 100% 0%, 100% 100%);} .fullwir .views-field-path, .fullwil .views-field-path {width:100%;} .fullwil .views-field-field-block-content {min-height: 105px;line-height: 105px;} .fullwir .views-field-field-block-content {min-height: 30px;line-height: 30px;} .fullwil .views-field-field-block-content, .fullwil .views-field-field-block-content span, .fullwir .views-field-field-block-content, .fullwir .views-field-field-block-content span {font-size: 18px!important;} .fullwil .views-field-field-block-content, .fullwir .views-field-field-block-content {padding-top: 50px!important;} /* Products */ .view-products .views-row a {font-size: 16px; line-height: 18px;} /* News */ #block-views-all-content-block-2 .views-field-title a {height: 51px; font-size: 16px;line-height: 19px;} #block-views-all-content-block-2 .views-field-path a {font-size: 16px;} /* Checkout */ .page-checkout td, .view-commerce-cart-form td, .page-user td {padding: 2px;} .view-commerce-cart-form table .form-text {padding: 5px 2px;} .page-checkout table, .view-commerce-cart-form table, .page-user table {font-size: 12px;} .page-checkout th, .view-commerce-cart-form th, .page-user th {font-size: 10px;padding: 3px;} .page-checkout fieldset {padding: 3px;} th.views-field-commerce-unit-price, td.views-field-commerce-unit-price {display: none;} .page-user .field-name-commerce-customer-billing, .page-user .field-name-commerce-customer-shipping {width: 100%;} /* Footer */ #bottom .block .content, #bottom .block h2 {text-align: center;} #bottom .block {font-size: 17px;line-height: 24px;} #bottom .block li {list-style-type: none!important;text-align: center;} #block-block-3, #block-block-2 {width: 100%} #copyright .credit {text-align: center;} #block-views-tweet-feed-block-1 {position: relative;width: 100%;margin-bottom: 30px!important;} #block-views-tweet-feed-block-1 h2 {margin-bottom: 10px!important;} #copyright {margin-top: 0px; } #block-block-3 .content {float: none!important;} #block-block-3 img {margin: 0 auto;display: block;} #bottom {padding: 30px 0;} /* GRID */ #inner-sidebar {width: 100%;margin-right: 0%;} .with-inner-sidebar, .with-sidebar {width: 100%;} .sidebar {width: 100%;margin-left: 0%;} .bottom-four, .bottom-three, .bottom-two, .bottom-one {width: 100%!important;margin: 0!important;} .bottom-three: nth-child(1), .bottom-three:nth-child(2) {width: 50%!important;} } /* #Extra small devices Phones Landscape (up to 480px)================================================== */@media only screen and (max-width: 480px) { #logo img {width: 80%;position: relative;top: 0px;left: 0px;margin: 10px auto;margin-bottom: 50px;width: 280px;} #menubarright {width:90%;} #block-block-6 {top: 60px;right: auto;left: 0px;} #block-block-6 .content {font-size: 17px!important} /* Slideshow */ .caption-image img {width:100%!important;} .caption-image {width:90%;margin:5%;max-width:300px} #block-views-slideshow-block {display: none;} #block-views-slideshow-block-1 {display:block;} #block-views-slideshow-block-1 li img {height: auto!important;width: 100%!important;} /* Front */ #block-views-taxonomy-block .views-row {/* max-width: 100px; */height: auto;width: 70%;margin: 0px;padding: 0 0 10px 0;} #ema_signup_form input#signup_email {max-width:170px!important} #block-system-user-menu {top: 60px;} #block-system-user-menu .menu {text-align: center!important;} /* Image Blocks */ #block-views-slideshow-block .flex-direction-nav a { top: 10%} .halfwctl .field-content h2, .halfwctl .field-content h2 span, .halfwcbl .field-content h2, .halfwcbl .field-content h2 span { font-size: 18px!important; } .halfwctl .field-content p, .halfwctl .field-content p span, .halfwcbl .field-content p, .halfwcbl .field-content p span { font-size: 14px!important; } /* Products */ #block-views-all-content-block .content {padding: 25px;} .view-products .views-field-title { height: 70px; line-height: 14px; } .view-products .views-row a { font-size: 14px; } .newproduct { transform: rotate(-0deg); -webkit-transform: rotate(-0deg); -moz-transform: rotate(-0deg); -o-transform: rotate(-0deg); -ms-transform: rotate(-0deg); position: relative; top: 0px; left: 0px; width: 90%; margin: 0 auto 10px auto; } .view-products td { padding: 2px; } /* News */ #block-views-all-content-block-2 .views-field-title a { height: 26px; font-size: 14px; line-height: 17px; } #block-views-all-content-block-2 .views-row { width: 100%} #block-views-all-content-block-2 .views-field-path a { font-size: 14px; } /* GRID */ .bottom-three:nth-child(1), .bottom-three:nth-child(2) { width: 100%!important; } /* GRID OVERRIDES */ .node-type-product #inner-sidebar { width: 100%; margin-right: 0%; } .node-type-product .with-inner-sidebar { width: 100%; } } /* #Extra Extra small devices Phones Portrait (up to 320px)================================================== */@media only screen and (max-width: 320px) { } /* #Clearing================================================== */ /* Self Clearing Goodness */ .container: after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; } /* Use clearfix class on parent to clear nested columns, or wrap each row of columns in a
*/ .clearfix: before, .clearfix:after, .row:before, .row:after { content: '\0020'; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; } .row: after, .clearfix:after { clear: both; } .row, .clearfix { zoom: 1; } /* You can also use a
to clear columns */ .clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; } img.scale-with-grid { max-width: 100%; height: auto; }