/* ------------------------------------------------------------------------------------------------------------------------- MANIPULATE STYLES FOR INTERNET EXPLORER ALL WIDTHS ----------------------------------------------------------------------------------------------------------------------------*/ /*IE EDGE OVERIDES*/ @supports (-ms-ime-align:auto) { /* Conditional Edge styles */ .border-stripe-top::before, .border-stripe-bottom::after, .top-stripe::before, .bottom-stripe::after {display:none !important;} a.item-link {display:block !important; text-align:center !important; } a.item-link .nav-item-image {margin-top:10px !important;} } /*IE 10 & 11 OVERIDES*/ @media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) { /* Conditional IE 10 & 11 styles */ .border-stripe-top::before, .border-stripe-bottom::after, .top-stripe::before, .bottom-stripe::after {display:none !important;} a.item-link {display:block !important; text-align:center !important; } a.item-link .nav-item-image {margin-top:10px !important;} } /* ------------------------------------------------------------------------------------------------------------------------- MAX-WIDTH MEDIA QUERIES BELOW ----------------------------------------------------------------------------------------------------------------------------*/ /* Media query 1600px site styles and template overides ---------------------------------------------------------------------------------------------------------------------------- */ @media all and (max-width: 1600px){ /*FIFTY-FIFTY VISUAL COMPOSER OVERIDES */ /*change padding to act as a wrapper, there is no wrapper on these sections*/ .vc_section.fifty-fifty .vc_column_container:nth-child(1) {padding-left:7% !important;} .vc_section.fifty-fifty .vc_column_container:nth-child(2) {padding-right:7% !important;} .vc_section.fifty-fifty .vc_column_container.image {min-height:600px !important; padding:0 !important;} /*reinforce no padding on images*/ /*change padding to act as a wrapper, there is no wrapper on these sections*//*UNITE GALLERY*/ /*VISUAL COMPOSER ANIMATED BANNER (1)*/ .vc_section.fifty-fifty .vc-animated-buttons .vc_column_container:nth-child(1) {padding-left:20px !important;} .vc_section.fifty-fifty .vc-animated-buttons .vc_column_container:nth-child(2) {padding-right:20px !important;} .vc_section.fifty-fifty .vc-animated-buttons .full-width-button .vc_column_container {padding-left:20px !important; padding-right:20px !important;} /*heights - .min-height matches .image*/ .min-height, .min-height .vc_column-inner {min-height:600px;} .min-height-small, .min-height-small .vc_column-inner {min-height:400px;} .max-height, .max-height .vc_column-inner {min-height:600px;} .max-height-small, .max-height-small .vc_column-inner {min-height:400px;} } /* Media query 1200px site styles and template overides ---------------------------------------------------------------------------------------------------------------------------- */ @media all and (max-width: 1200px){ /*FIFTY-FIFTY VISUAL COMPOSER OVERIDES ***********************************************************************/ /*TOP BAR*/ .top-bar, .top-bar .languages-area {display:block !important;} .top-bar .top-links .topbar-widget, .top-bar .top-links ul li.popup_link, .top-bar .navbar-header .header-search {display:inline-block !important;} .shop-top-bar .top-bar .navbar-header.show-in-tb-left.search-active, .shop-top-bar .top-bar .navbar-header.show-in-tb-right.search-active {top:0;} .top-bar .header-search {margin-top:-5px;} .top-bar .header-search.search-open {padding:18px 20px;} /*MAIN MENU SEARCH AJAX*/ .search-active i.et-icon.et-zoom {margin-right:20px !important;} /*change padding to act as a wrapper, there is no wrapper on these sections*/ .vc_section.fifty-fifty .vc_column_container:nth-child(1) {padding-left:0 !important;} .vc_section.fifty-fifty .vc_column_container:nth-child(2) {padding-right:0 !important;} article.blog-post div.entry-content {padding-right:0 !important;} /*post text*/ /*change padding to act as a wrapper, there is no wrapper on these sections*//*UNITE GALLERY*/ /*this cancels out display:flex; for .fifty-fifty.mulitple-images sections*/ .fifty-fifty.multiple-images .vc_row {flex-wrap:wrap;} /*flex wrap keeps same height when content is wraped to next line*/ .fifty-fifty.multiple-images .vc_row:after, .fifty-fifty.multiple-images .vc_row:before {display:none !important; visibility:hidden;} /*this needs to be removed or it jumps the content columns when they become 50%, the before and after conetnt is empty anyway?*/ /*this cancels out display:flex; for .fifty-fifty.mulitple-images sections*/ /*remove all padding*/ .vc_section.fifty-fifty .vc_column_container {padding-left:0; padding-right:0;} /*remove all padding*/ /*Force all columns to 50% width*/ /*.fifty-fifty .vc_col-sm-1, .fifty-fifty .vc_col-sm-2, .fifty-fifty .vc_col-sm-3, .fifty-fifty .vc_col-sm-4, .fifty-fifty .vc_col-sm-5, .fifty-fifty .vc_col-sm-6, .fifty-fifty .vc_col-sm-7, .fifty-fifty .vc_col-sm-8, .fifty-fifty .vc_col-sm-9, .fifty-fifty .vc_col-sm-10, .fifty-fifty .vc_col-sm-11 {width:50% !important; min-width:50% !important;}*/ /*Force all columns to 50% width*/ } /* Media query 992px site styles and template overides ---------------------------------------------------------------------------------------------------------------------------- */ @media all and (max-width: 992px){ /*NEW STYLES ***********************************************************************/ /*.display-mobile {display:block !important;} .display-screen {display:none !important;} .mobile-none, .empty {display:none !important;}*/ /*REVOLUTION SLIDER TEXT / BANNER TEXT *************************/ .tp-caption.revslider-wrapper h6, .banner-text h6 {font-size:40px !important;} .tp-caption.revslider-wrapper p, .banner-text p {font-size:16px !important;} .tp-caption.revslider-wrapper h6, .banner-text {margin-top:225px !important;} .tp-caption.revslider-wrapper a {margin-top:450px !important;} /*single posts only*/ .banner-text h2 {font-size:23px !important;} /*HEADER - FORCE OVERIDE XSTORE STYLE*/ .main-header .header-logo, .fixed-header .header-logo {width:120px !important; margin:0 auto !important;} .main-header .header-logo img, .fixed-header .header-logo img {width:120px !important; max-width:120px !important;} /*MOBILE MENU*/ body.mobile-menu-opened .mobile-menu-wrapper {width:50vw; display:block !important;} /*fixed size image*/ .fixed-size-image img {width:90% !important; height:90% !important;} /*ADD CLIP TO PAGE WRAPPER AND FOOTER TO GET CLIP AT THE BOTTOM OF THE PAGE*/ .page-wrapper {padding-bottom:50px;-webkit-clip-path: polygon(0 0, 100% 0, 100% 95%, 0 100%) !important; clip-path: polygon(0 0, 100% 0, 100% 95%, 0 100%) !important;} .footer {padding-top:100px !important; -webkit-clip-path: polygon(0 5%, 100% 0, 100% 100%, 0% 100%); clip-path: polygon(0 5%, 100% 0, 100% 100%, 0% 100%);} /*BLOG IMAGES (FIFTY FIFTY LAYOUT*/ article.blog-post.content-chess .wp-picture.blog-hover-animated img {width:100% !important; min-height:300px !important;} /*BLOG WIDGET SIDEBAR - BESPOKE SIDEBAR*/ .blog-sidebar li.widget {width:100%;} /*FOOTER*/ /*If footer is set to fixed in Xstore footer settings, it has been disabled and set to releative for mobiles in media queries*/ .et-footer-fixed-on .et-footers-wrapper {position:relative !important;} .page-wrapper {margin-bottom:0 !important;}/*if footer fixed setting it adds weird margin bottom over 1000px! - remove it here*/ .content-page, .page-content, .page-wrapper {padding-bottom:60px !important;} /*if footer fixed setting it adds weird padding bottom over 5.65em! - change it here*/ /*overide xstore x3 column footer break point*/ .footer-widgets.col-md-4 {width:33.33% !important; float:left;} /******************************************************************************/ /******************************************************************************/ /*WOOCOMMERCE*/ /******************************************************************************/ /******************************************************************************/ /*generic products*/ .products-loop {padding-bottom:0 !important;} /*SINGLE PRODUCT PAGE*/ /*.single-product-wide .product-information {width:100% !important; max-width:100% !important; padding: 20px !important;}*/ /* Media query 768px site styles and template overides ---------------------------------------------------------------------------------------------------------------------------- */ @media all and (max-width: 768px){ /*BASE STYLES ***********************************************************************/ h1, h2, h3, h4, h5, h6, p {width:100%;} h1, h6, .big-title h2 {font-size:33px !important;} h2 {font-size:23px !important;} h3 {font-size:18px !important;} h4, .footer-widget .widget-title {font-size:16px !important;} h5 {font-size:14px !important;} p, a, .footer-widget a, .footer-widget p {font-size:12px !important;} .enlarged-text p {font-size:16px !important;} /*GRIDICULOUS ***********************************************************************/ .wrapper .c1,.wrapper .c2,.wrapper .c3,.wrapper .c4,.wrapper .c5,.wrapper .c6,.wrapper .c7,.wrapper .c8,.wrapper .c9,.wrapper .c10,.wrapper .c11,.wrapper .c12{width:100% !important; margin-bottom:20px;} .wrapper .s1,.wrapper .s2,.wrapper .s3,.wrapper .s4,.wrapper .s5,.wrapper .s6,.wrapper .s7,.wrapper .s8,.wrapper .s9,.wrapper .s10,.wrapper .s11,.wrapper .s12{width:100% !important; margin-left:0 !important;} .c1,.c2,.c3,.c4,.c5,.c6,.c7,.c8,.c9,.c10,.c11,.c12 {width:100% !important;} .s1,.s2,.s3,.s4,.s5,.s6,.s7,.s8,.s9,.s10,.s11,.s12 {margin-left:0 !important;} /*VISUAL COMPOSER*/ /*Force all columns to 100% width*/ .vc_col-sm-1, .vc_col-sm-2, .vc_col-sm-3, .vc_col-sm-4, .vc_col-sm-5, .vc_col-sm-6, .vc_col-sm-7, .vc_col-sm-8, .vc_col-sm-9, .vc_col-sm-10, .vc_col-sm-11 {width:100% !important; min-width:100% !important;} /*FLEXY BREADCRUMBS ***********************************************************************/ .fbc {margin-top:20px !important;} /*NEW STYLES ***********************************************************************/ .display-mobile {display:block !important;} .mobile-none, .empty {display:none !important;} /*SUB CATEGORY LOGOS*/ .sub-logo img {width:50% !important;} /*CLIP*/ .clip-middle-top, /*.clip-right-top-bottom, .clip-left-top-bottom,*/ .clip-right-top, .clip-left-top, .clip-right-bottom, .clip-left-bottom, .clip-left, .clip-right {-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%) !important; clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%) !important;} /*IF PAGE TITLE FIRST SECTION DO NOT REMOVE CLIP STYLE - THIS IS THE SAME CODE AS STYLE.CSS TO OVERIDE THE STYLES ABOVE*/ .page-title.clip-middle-top {-webkit-clip-path: polygon(50% 15%, 100% 0, 100% 100%, 0 100%, 0 0) !important; clip-path: polygon(50% 15%, 100% 0, 100% 100%, 0 100%, 0 0) !important;} .page-title.clip-left-top-bottom {-webkit-clip-path: polygon(0 0, 100% 20%, 100% 100%, 0 80%) !important; clip-path: polygon(0 0, 100% 20%, 100% 100%, 0 80%) !important;} .page-title.clip-right-top-bottom {-webkit-clip-path: polygon(0 20%, 100% 0, 100% 80%, 0% 100%) !important; clip-path: polygon(0 20%, 100% 0, 100% 80%, 0% 100%) !important;} .page-title.clip-right-top {-webkit-clip-path: polygon(0 0, 100% 20%, 100% 100%, 0 100%) !important; clip-path: polygon(0 0, 100% 20%, 100% 100%, 0 100%) !important;} .page-title.clip-left-top {-webkit-clip-path: polygon(0 20%, 100% 0, 100% 100%, 0% 100%) !important; clip-path: polygon(0 20%, 100% 0, 100% 100%, 0% 100%) !important;} .page-title.clip-right-bottom {-webkit-clip-path: polygon(0 0, 100% 0, 100% 80%, 0 100%) !important; clip-path: polygon(0 0, 100% 0, 100% 80%, 0 100%) !important;} .page-title.clip-left-bottom {-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 80%) !important; clip-path: polygon(0 0, 100% 0, 100% 100%, 0 80%) !important;} .page-title.clip-right {-webkit-clip-path: polygon(0 0, 80% 0, 100% 100%, 0% 100%) !important; clip-path: polygon(0 0, 80% 0, 100% 100%, 0% 100%) !important;} .page-title.clip-left {-webkit-clip-path: polygon(20% 0, 100% 0%, 100% 100%, 0% 100%) !important; clip-path: polygon(20% 0, 100% 0%, 100% 100%, 0% 100%) !important;} /*heights - .min-height matches .image*/ .min-height, .min-height .vc_column-inner {min-height:400px;} .min-height-small, .min-height-small .vc_column-inner {min-height:400px;} .max-height, .max-height .vc_column-inner {min-height:400px;} .max-height-small, .max-height-small .vc_column-inner {min-height:400px;} /*back to top no change*/ .back-to-top .to-top {font-size:25px !important; padding:5px 18px !important; display:block !important;} /*match this in zillah overides*/ /*borders*/ .border-right, .border-right-thin {border-right:0px solid #999 !important;} .border-left, .border-left-thin {border-left:0px solid #999 !important;} .border-left-right, .border-left-right-thin {border-left:0px solid #999 !important; border-right:0px solid #999 !important;} /*BACKGROUND IMAGE FIXED*/ .bg-fixed {background-attachment:scroll !important;} /*CONTACT FORM 7*/ .email-form p label {width:100%;} .email-form p label:nth-child(1) {padding-right:0;} .email-form p label:nth-child(2) {padding-left:0;} /*header images*/ .full-width .header-image-big {height:700px !important;} .header-image-small {height:500px !important;} .header-image-small .tp-caption.revslider-wrapper h6, .header-image-small .banner-text {margin-top:80px !important;} /*visual composer - banner baner text*/ .vc_row .banner-text h1, .vc_row .banner-text h2, .vc_row .banner-text h3, .vc_row .banner-text h4, .vc_row .banner-text h5, .vc_row .banner-text h6, .vc_row .banner-text p {padding: 20px !important; margin-top:40px !important;} /*this is reinforcing the padding for mobiles*/ /*fixed size image*/ .fixed-size-image img {width:60% !important; height:60% !important;} /*STRIPES*/ /*.top-stripe::before, .bottom-stripe::after, .border-stripe-top::before, .border-stripe-bottom::after {display:none !important;} */ /*banner text*/ .vc_row .banner-text {margin-top:70px !important;} /*VISUAL COMPOSER ACCORDION ON "CLASSIC" SETTING ONLY*/ .accordion:nth-child(1) .vc_column-inner {padding-bottom:0 !important;} .accordion:nth-child(2) .vc_column-inner {padding-top:0 !important;} .accordion .vc_column-inner .wpb_wrapper .vc_tta-container {margin-bottom:5px !important;} /*VISUAL COMPOSER ANIMATED BANNER (1)*/ .vc-animated-buttons {margin-top:0 !important; margin-bottom:0 !important;} .vc-animated-buttons .vc_row {width:50% !important; flex-flow:nowrap !important; margin:0 !important; padding: 0 !important;} .vc_section.fifty-fifty .vc-animated-buttons .vc_column-inner {padding:20px 0 !important;} .vc_section.fifty-fifty .vc-animated-buttons .wpb_wrapper .vc_column-inner {padding:0 !important; margin:0 !important;} .vc_section.fifty-fifty .vc-animated-buttons .vc_column_container:nth-child(1) {padding-left:0 !important;} .vc_section.fifty-fifty .vc-animated-buttons .vc_column_container:nth-child(2) {padding-right:0 !important;} .vc_section.fifty-fifty .vc-animated-buttons .full-width-button .vc_column_container {padding-right:0 !important;} .vc-animated-buttons .full-width-button.vc_row {width:100% !important;} /*GENERIC BUTTON RE STYLE FOR ANIMATED BANNER BUTTONS, CATEGORY WOOCOMMERCE BUTTONS WITHIN FIFTY FIFTY AND NOT*/ .categories-mask h1, .categories-mask h2, .categories-mask h3, .categories-mask h4, .categories-mask h5, .categories-mask h6, .vc-animated-buttons .vc_column-inner .ult-banner-block h1, .vc-animated-buttons .vc_column-inner .ult-banner-block h2, .vc-animated-buttons .vc_column-inner .ult-banner-block h3, .vc-animated-buttons .vc_column-inner .ult-banner-block h4, .ult-banner-block .vc_column-inner h5, .vc-animated-buttons .vc_column-inner .ult-banner-block h6, .ult-banner-block h1, .ult-banner-block h2, .ult-banner-block h3, .ult-banner-block h4, .ult-banner-block h5, .ult-banner-block h6 {padding:15px !important;} /***********************************************************************/ /*GENERIC VISUAL COMPOSER OVERIDES /*generic padding styles*/ .entry-content .vc_section {padding:30px 0 !important;} .vc_section.section-extra-padding {padding:50px 0 !important;} .vc_section.negative-margin2,.vc_section .vc_row.negative-margin2, .negative-margin2 {margin-top:0 !important;} /*FIFTY-FIFTY VISUAL COMPOSER OVERIDES ***********************************************************************/ /*Force all columns to 100% width*/ .fifty-fifty .vc_col-sm-1, .fifty-fifty .vc_col-sm-2, .fifty-fifty .vc_col-sm-3, .fifty-fifty .vc_col-sm-4, .fifty-fifty .vc_col-sm-5, .fifty-fifty .vc_col-sm-6, .fifty-fifty .vc_col-sm-7, .fifty-fifty .vc_col-sm-8, .fifty-fifty .vc_col-sm-9, .fifty-fifty .vc_col-sm-10, .fifty-fifty .vc_col-sm-11 {width:100% !important; min-width:100% !important;} .vc_section.fifty-fifty .vc_column_container:nth-child(1), .vc_section.fifty-fifty .vc_column_container:nth-child(2), .vc_column_container {padding:20px 20px 20px 20px !important;} .vc_section.fifty-fifty .vc_column_container.image {min-height:400px !important; padding:0 !important;} /*.fifty-fifty .vc_column_container.image.fixed-height {min-height:400px !important; padding:0 !important;}*/ .vc_section.fifty-fifty .vc_column-inner {padding:40px 0 !important;} /*remove side padding from text*/ .fifty-fifty .vc_column-inner h1, .fifty-fifty .vc_column-inner h2, .fifty-fifty .vc_column-inner h3, .fifty-fifty .vc_column-inner h4, .fifty-fifty .vc_column-inner h5, .fifty-fifty .vc_column-inner h6, .fifty-fifty .vc_column-inner p, .fifty-fifty .vc_column-inner a {padding: 0 0 !important;} /*IMPORTANT this will arrange the image left to the bottom when they stack up for mobile ***********************************************************************/ .vc_row {display:flex !important; flex-flow:row wrap !important;} .vc_row .vc_column_container {order:2 !important; -webkit-order:2 !important;} .vc_row .vc_column_container.image {order:1 !important; -webkit-order:1 !important;} /*FIFTY-FIFTY VISUAL COMPOSER OVERIDES END ***********************************************************************/ /*REMOVE CLIP TO PAGE WRAPPER ONLY FOOTER GETS CLIPED AT THE BOTTOM OF THE PAGE*/ .page-wrapper, body.archive.woocommerce .page-wrapper, body.blog .page-wrapper, body.single-product .page-wrapper, body.search .page-wrapper, body.archive .page-wrapper {-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%) !important; clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%) !important;} /*CONTENT BOX BREAK*/ .content-break-half .vc_column_container {width:50% !important;} .content-break-third .vc_column_container {width:33.33% !important;} /*WP BAKERY / Visual Composer image gallery using pretty photo for lightbox */ .wpb_image_grid .wpb_image_grid_ul li.isotope-item {width:50%;} div.pp_default .pp_details {display:block !important;} div.pp_default .pp_hoverContainer {width:100% !important; height:100% !important; } div.pp_default .pp_content_container a.pp_next, div.pp_default .pp_content_container a.pp_previous {font-size:0 !important;} div.pp_default .pp_hoverContainer, div.pp_default .pp_content_container a.pp_next, div.pp_default .pp_content_container a.pp_previous {display:block !important;} /*overide xstore x3 column footer break point*/ .footer-widgets.col-md-4 {width:100% !important;} /*under footer*/ .under-footer.tidal {padding-top:5px !important;} .tidal-under-footer .under-footer-bar p {text-align: left !important;} /*WOOCOMMERCE*/ .products-loop {padding-bottom:0 !important;} /*WOOCOMMERCE POSTS ELEMENTS*/ /*post page images*/ .wp-picture {margin-bottom:0 !important;} } /* Media query 640px site styles and template overides ---------------------------------------------------------------------------------------------------------------------------- */ @media all and (max-width: 640px){ /*SUB CATEGORY LOGOS*/ .sub-logo img {width:100% !important;} /*REVOLUTION SLIDER TEXT / BANNER TEXT *************************/ .tp-caption.tp-shape.revslider-wrapper {display:none !important;} .tp-caption.revslider-wrapper h6, .tp-caption.revslider-wrapper p {width:100%; background-color: rgba(219,20,60,0.6) !important; padding: 20px !important;} .tp-caption.revslider-wrapper h6, .banner-text {margin-top:80px !important;} .tp-caption.revslider-wrapper a {margin-top:480px !important;} .tp-caption.revslider-wrapper h6 {margin-bottom:0 !important;} .tp-caption.revslider-wrapper p {margin-top:0 !important;} /*HEADER IMAGE TEXT *************************/ .background-shape {display:none;} .header-image-small .banner-text, .header-image-small .banner-text {width:100%; background-color: rgba(219,20,60,0.6) !important; width: calc(100% - 40px) !important; margin-left:20px !important;} /*MOBILE MENU*/ body.mobile-menu-opened .mobile-menu-wrapper {width:100vw;} } /* Media query 568px site styles and template overides ---------------------------------------------------------------------------------------------------------------------------- */ @media all and (max-width: 468px){ .phone-display-none {display:none !important;} /*VISUAL COMPOSER ANIMATED BANNER (1)*/ .vc-animated-buttons .vc_row {width:100% !important; flex-flow:wrap !important;} /*CONTENT BOX BREAK*/ .content-break-half .vc_column_container, .content-break-third .vc_column_container {width:100% !important;} /*WP BAKERY / Visual Composer image gallery using pretty photo for lightbox */ .wpb_image_grid .wpb_image_grid_ul li.isotope-item {width:100%;} .wpb_image_grid .wpb_image_grid_ul li.isotope-item {border-left:0 solid #fff !important; border-right:0 solid #fff !important;} /*WOOCOMMERCE*/ /*.main-products-loop .products-grid .product {width:100% !important; padding:0 14px 0 14px !important;}*/ } /* Media query 380px site styles and template overides ---------------------------------------------------------------------------------------------------------------------------- */ @media all and (max-width: 380px){ .product.type-product {width:100% !important;} } /* Media query 320px site styles and template overides ---------------------------------------------------------------------------------------------------------------------------- */ @media all and (max-width: 320px){ }