/** Shopify CDN: Minification failed Line 134:0 Unexpected "$" Line 166:39 Comments in CSS use "/* ... */" instead of "//" Line 270:8 Unexpected "{" Line 547:2 Unexpected "$" Line 1966:73 Expected identifier but found "*" Line 1990:72 Expected identifier but found "*" Line 4035:19 Unexpected "{" Line 5768:2 Unexpected "{" Line 6105:2 Expected "}" to go with "{" **/ /****************************************************************** Theme Name: Shop3D 2.0 (Built from Responsive 6.2.0) Theme URI: https://themes.shopify.com/themes/responsive/styles/new-york?ref=out-of-the-sandbox Author: Sarah Caracciolo Description: Shopify Theme ******************************************************************/ /* Table of Content ================================================== #Reset & Basics #Reset #Basics #Headings #Buttons #Custom Buttons #Loading Buttons #Homepage Buttons - Recommended Menu #Columns #Tables #Repeatables #Coloured Backgrounds #Language Market #Fixes #Sections #Header #AnnouncementContainer #Navbar #Header #MegaMenu #Mobile Navbar #Sidebar #Pagination #FeaturedPromotions #Modules #Accordion #GreyOutlineBox #IntroSection #NewsletterFooter #SliderNav #SliderQuote #Video-Container #FeaturesBox #Alert Box #BambuWhyShop #Pages #ContactUs #Products # #Inserts #Leasing #Snippets #Take Action Bar #Newsletter Signup #FeaturedBrands #BookaConsultation #PullQuote #CostComparison #ProductPages #Blog #LandingPages #Services #CollectionBanners #Hubspot Styles #MISC #Animate.css #Hide Recaptcha #Footer #MobileStyles #Desktop #Tablet #Mobile #KonamiHaley #CNY newyear */ /*---------------------- #Reset & Basics---------------------- */ /*------ #Resets ------*/ /*------ #Resets ------*/ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } /*------ #Basics ------*/ body { line-height: 1; min-width:290px; font-family: 'Rubik', sans-serif; letter-spacing: 0.03em; background-color: #ffffff; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-smoothing: antialiased; font-weight: normal; font-size: 15px; text-transform: none; color: #404040; line-height: 1.8em; } ::-moz-selection { background-color: #000; color: #fff; } ::selection { background-color: #000; color: #fff; } abbr { border-bottom: 1px dotted #aeaeb0; } body, html { overflow-x: hidden; margin: 0; padding: 0;} $font-size-header: 34; /* #Typography ================================================== */ .header_icons a:hover {color: #c82029; } .header_icons a:hover { /* Firefox */ -moz-transform: rotate(360deg) ; /* Firefox */ -moz-transition: all 1s ease; /* WebKit */ -webkit-transition: all 1s ease; /* Opera */ -o-transition: all 1s ease; /* Standard */ transition: all 1s ease; /* WebKit */ -webkit-transform: rotate(360deg); /* Opera */ -o-transform: rotate(360deg) ; /* Standard */ transform: rotate(360deg) ; } h1 a, h1 a:visited, .title a, .title a:visited { color: #333333 } h1 a:hover, h1 a:active, .title a:hover, .title a:active { color: #255a90 } h1, .h1, h2.home, h2.title, .title a { //line-height: 36px; margin: 0 auto 20px; text-align: center; border-bottom: 1px solid #aeaeb0; border-top: none; padding: 0 0 8px 0; clear:both; font-weight: normal; text-align: center; } h2.home { @include headline-style(floor($font-size-header*0.9)); border-top: 0; border-bottom: 1px solid #aeaeb0; padding: 0 0 12px 0; } h1.product_name{ text-align:left; clear: none; margin-bottom: 0px!important; } h1.article_name { text-align:center; clear: none; } .section-header a, .section-header a:visited { @include headline-style(floor($font-size-header*0.9)); } h2.title a { border-bottom: 0; padding-bottom: 0; margin-bottom: 0; } h2 {font-size:30px; color:#404040; text-align:center;} h4, .h4, h4.title a { @include headline-style(floor($font-size-header*0.7)); line-height: 35px; margin: 0 0 20px 0; text-align: left; padding: 0; border-bottom: 1px solid #aeaeb0; padding-bottom:12px;} h4.title a { border-bottom: 0; padding-bottom: 0; margin-bottom: 0; } h5, .h5 { @include headline-style(floor($font-size-header*0.65)); line-height: 28px; padding-bottom: 5px; } h5.sub_title a { margin: 15px 0 5px 0; color: #333333; display: block; } h6, .h6 { @include headline-style(floor($font-size-header*0.6)); padding-bottom: 1em;} .headline { @include headline-style(floor($font-size-header)); } .subheader { color: #777; } .modal h3 { padding: 6px 0 12px 0;} h6.social { padding-bottom: 10px } p { margin: 0 0 20px; font-style: normal; } p img { margin: 0; } sub { font-size: 60% } em, i { font-style: italic; } strong, b { font-weight: bold; } small { font-size: 80%; } /* Blockquotes */ blockquote, blockquote p { font-size: 17px; line-height: 24px; font-style: italic; } blockquote { margin: 0 0 20px; padding: 9px 20px 0 19px; border-left: 1px solid #aeaeb0; } blockquote cite { display: block; font-size: 12px; color: #555; } blockquote cite:before { content: "\2014 \0020"; } blockquote cite a, blockquote cite a:visited, blockquote cite a:visited { color: #555; } hr { border: solid #aeaeb0; border-width: 1px 0 0; clear: both; margin: 10px 0 15px; height: 0; } .quote { font-size: 18px; line-height: 32px; text-align: center; margin: 0 0 20px 0; font-style: italic; } /* #Links ================================================== */ a, a:visited { color: #255a90; text-decoration: none; outline: 0; -webkit-transition: color 0.3s ease-out 0s; -moz-transition: color 0.3s ease-out 0s; -o-transition: color 0.3s ease-out 0s; transition: color 0.3s ease-out 0s; } a:hover, a:focus { color: #f02f2f; } a, button, input, select, textarea, label, summary { touch-action: manipulation; } /* #Lists ================================================== */ main ul,main ol { margin-bottom: 20px; } main ul { list-style: none; line-height: 26px; margin-left:20px;} main ol { list-style: decimal; } main ol, main ul.square, main ul.circle, main ul.disc { margin-left: 30px; } main ul.square { list-style: square; } main ul.circle { list-style: circle; } main ul.disc { list-style: disc; } main ul ul, main ul ol, main ol ol, main ol ul { margin: 4px 0 5px 15px; } main ul ul li, main ul ol li, main ol ol li, main ol ul li { margin-bottom: 6px; } main li { line-height: 1.8em; margin-bottom: 12px; } main ul.large li { line-height: 1.8em; } main ul.none { list-style: none outside; margin-left: 0;} main ul.none li { list-style: none; padding: 0; } main li p { line-height: 1.8em; } main ul li { list-style-type: disc; list-style-position: outside; padding: 6px; margin-bottom: 0; } .description ul { list-style: disc outside; } /* #MegaMenu ================================================== */ /* Mega Menu Content */ #mega-menu-container { z-index: 9999; width: 100%; position: absolute; left: 0px; padding-bottom: 30px; /* Extends area for mouse activation*/ } /* Mega Menu Content */ .mega-menu-content * {box-sizing: border-box;} .mega-menu-content {display: none; } .mega-menu-content.active {display: block; font-size:0.85em; min-height:300px; border: 1px solid #ddd; background:#F2F2F2; -webkit-box-shadow: 6px 14px 14px 0px rgba(59,59,59,0.38); -moz-box-shadow: 6px 14px 14px 0px rgba(59,59,59,0.38); box-shadow: 6px 14px 14px 0px rgba(59,59,59,0.38);} .mega-menu-content .main-container, .mega-menu-content .sub-container { display:flex; flex-wrap: wrap;} .mega-menu-content .sub-container {padding: inherit; } .main-container.sml, .sub-container.sml {width: 95%; margin: auto;} .sub-container ul,.sub-container ol { margin: 0; padding: 0;} /* Flexbox Grid */ .flex-container {box-sizing: border-box; display:flex; width:100%;} .grid, .flex {display: flex; flex-wrap: wrap; box-sizing: border-box;} .flex-container img, .grid img, .flex img {max-width:100%;} /* Grid Columns */ .col-1 { flex: 0 0 12.5%; } .col-2 { flex: 0 0 25%; } .col-3 { flex: 0 0 37.5%; } .col-4,.half { flex: 0 0 50%; } .col-5 { flex: 0 0 62.5%; } .col-6, { flex: 0 0 75%; } .col-7 { flex: 0 0 62.5%; } .col-8, .full { flex: 0 0 100%; } /* sub columns */ .sub-container .col-2-1, .sub-container.col-2-1{flex: 0 0 50%;} .sub-container .col-2-2,.sub-container.col-2-2{flex: 0 0 100%;} .sub-container .col-3-1,.sub-container.col-3-1{flex: 0 0 33.33%;} .sub-container .col-3-2,.sub-container.col-3-2{flex: 0 0 66.66%;} .sub-container .col-3-3,.sub-container.col-3-3{flex: 0 0 100%;} .sub-container .col-4-1,.sub-container.col-4-1{flex: 0 0 25%;} .sub-container .col-4-2,.sub-container.col-4-2{flex: 0 0 50%;} .sub-container .col-4-3,.sub-container.col-4-3{flex: 0 0 75%;} .sub-container .col-4-4,.sub-container.col-4-4{flex: 0 0 100%;} .sub-container .col-5-1,.sub-container.col-5-1{flex: 0 0 20%;} .sub-container .col-5-2,.sub-container.col-5-2{flex: 0 0 40%;} .sub-container .col-5-3,.sub-container.col-5-3{flex: 0 0 60%;} .sub-container .col-5-4,.sub-container.col-5-4{flex: 0 0 80%;} .sub-container .col-5-5,.sub-container.col-5-5{flex: 0 0 100%;} .sub-container .col-6-1,.sub-container.col-6-1{flex: 0 0 16.66%;} .sub-container .col-6-2,.sub-container.col-6-2{flex: 0 0 33.333%;} .sub-container .col-6-3,.sub-container.col-6-3{flex: 0 0 49.99;} .sub-container .col-6-4,.sub-container.col-6-4{flex: 0 0 66.65%;} .sub-container .col-6-5,.sub-container.col-6-5{flex: 0 0 83.31%;} .sub-container .col-6-6,.sub-container.col-6-6{flex: 0 0 100%;} .sub-container .col-7-1,.sub-container.col-7-7{flex: 0 0 14.28%;} .sub-container .col-7-2,.sub-container.col-7-7{flex: 0 0 28.56%;} .sub-container .col-7-3,.sub-container.col-7-7{flex: 0 0 42.84;} .sub-container .col-7-4,.sub-container.col-7-7{flex: 0 0 57.13%;} .sub-container .col-7-5,.sub-container.col-7-7{flex: 0 0 71.40%;} .sub-container .col-7-6,.sub-container.col-7-7{flex: 0 0 85.68%;} .sub-container .col-7-7,.sub-container.col-7-7{flex: 0 0 100%;} /* Borders */ .b-1{border:2px solid #929292;} .b-b{border-bottom:2px solid #929292;} .b-t{border-bottom:2px solid #929292;} .b-l{border-bottom:2px solid #929292;} .b-r{border-right:1px solid #929292;} /* Margins */ .m-1 { margin: 0 1.66% 0 1.66%; } .mt-1 { margin-top: 1.66% } .mb-1 { margin-bottom: 1.66%; } .ml-1 { margin-left: 1.66%; } .mr-1 { margin-right: 1.66%; } /* Padding */ .p-0, .mega-menu-content .sub-container .p-0 { padding: 0!important; } .p-1, .mega-menu-content .sub-container .p-1 { padding: 0 1.66% 0 1.66%!important; } .p-2, .mega-menu-content .sub-container .p-2{ padding: 1.66% 0 1.66% 0!important; } .p-3, .mega-menu-content .sub-container .p-3 { padding: 1.66%!important; } .p-4, .mega-menu-content .sub-container .p-4 {padding: 15px!important;} /* special case */ .p-t, .mega-menu-content .sub-container .p-t { padding-top: 1.66%!important; } .p-b, .mega-menu-content .sub-container .p-b { padding-bottom: 1.66%!important; } .p-l, .mega-menu-content .sub-container .p-l{ padding-left: 1.66%!important; } .p-r, .mega-menu-content .sub-container .p-r{ padding-right: 1.66%!important; } .brand-list .sub-container div, .brand-list.sub-container div {align-content: center;} .brand-list .brand-item a{ display: grid; height: auto; padding: 0; margin: 0; align-items: center;} /* sml image */ .sml-img {width:60%; margin:auto;} .push-down {margin-top:auto; align-self: flex-end;} .image-container {overflow:hidden} .space-between {align-content: space-between;} .product-image {width: 100%; height: 85px; margin-bottom: 10px; overflow: hidden; border-radius: 20px;} /* Text Columns */ [class^="column-text"] {column-count: 0; width: 100%;} ul.column-text, .column-text ul, .column-text li{margin:0; padding:0;} /* Button */ button.custom-button { display: flex; align-items: center; justify-content: space-between; padding: 10px 15px; cursor: pointer; font-size: 0.9em; text-transform:uppercase; background: transparent; border: 1px solid #929292; width: 100%; border-radius: 0; color: #000; } button.custom-button:hover {background:#E4E4E4;} button.custom-button.active {background:#17668C; color:#fff;} .button-thumb { width: 30px; /* Adjust thumbnail size */ height: 30px; border-radius: 4px; object-fit: cover; /* Ensures the image is scaled properly */ margin-right: 10px; } .button-text { flex: 1; /* Allows the text to take up available space */ text-align: left; } .button-arrow { font-size: 16px; /* Arrow size */ margin-left: 10px; color: #555; } /* Specialty Classes */ .mega-menu-content a.title {height:37px; background:#17668C; color:#fff!important; text-align:center; text-transform:capitalize; display: grid; align-items: center; transition: background-color 0.5s ease;} .mega-menu-content a.title:hover {background:#1f3366;} .mega-menu-content .sub-container a.big-link:link, .mega-menu-content .sub-container a.big-link:visited {border-top: 2px solid #929292; padding: 10px 10px 10px 10px; font-weight: 400; color: #1E1E1E; position:relative; width: 100%; display: block;} .big-link:after { content: ''; position: absolute; top: 12px; right: 10px; width: 35px; height: 20px; display: block; background-image: url(/cdn/shop/files/Icon-right-arrow-long.svg?v=1733865436); background-size: auto; background-position: right; background-repeat: no-repeat; z-index: 1; } a.linked-navbar-image { display: block; height: 100%; width: 100%; background-size: cover; background-position: center; position: relative; /* Required for positioning :before and :after */ transition: filter 0.3s ease, background-size 1.2s ease; } a.linked-navbar-image:hover { /*filter: grayscale(100%); Example: Grayscale the image on hover */ filter: sepia(100%) saturate(100%) hue-rotate(187deg) brightness(83%) contrast(100%); background-size: 140%; transition: filter 0.3s ease, background-size 1.2s ease; } a.linked-navbar-image::before, a.linked-navbar-image::after { filter: none!important; /* Ensure pseudo-elements are unaffected */ } a.linked-navbar-image:before { content: attr(data-before-content); position: absolute; bottom: 33px; padding-left: 15px; font-weight: 600; font-size: 12px; color: #9C9C9C; width: 100%; z-index: 999; } a.linked-navbar-image:after { content: attr(data-after-content); position: absolute; bottom: 0px; font-weight: 400; font-size: 12px; color: #fff; width: 100%; padding: 30px 15px 15px 15px; background: linear-gradient(to bottom, transparent, #000000c7, #000000); } a.block-link { display: block; padding: 10px; border-radius:20px; } a.block-link:hover p {font-weight:400;} a.block-link:hover p.SubTitle{font-weight:600;} a.block-link:hover {background:#e1e1e1;} /* Images and Links */ .mega-menu-content .sub-container img {width:100%} .mega-menu-content .sub-container img.sml-img {width:60%; margin:auto;} .mega-menu-content .sub-container a img:hover {transform: scale(1.1);} .mega-menu-content .sub-container a:link, .mega-menu-content .sub-container a:visited {color:#1E1E1E;} .mega-menu-content .sub-container a:active, .mega-menu-content .sub-container a:hover {color:#1E1E1E; font-weight:600;} .mega-menu-content .sub-container a.big-link:active, .mega-menu-content .sub-container a.big-link:hover {background:#17668C; color:#fff; font-weight:400; border-radius:0 0 25px 15px} .big-link:hover:after {filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(1834%) hue-rotate(309deg) brightness(103%) contrast(101%);} /* #Images ================================================== */ /* The purpose of the below declaration is to make sure images don't exceed the width of columns they are put into when resizing window. Unfortunately, this declaration breaks certain lightbox, slider or other plugins, so the best solution is to individually call these properties on images that are children of the grid that you want to resize with grid. */ .product_row img, .product_image_col img, .article img, .article_image img, .section img, .thumbnail img, .sidebar img, #target img { max-width: 100%; height: auto; } .zoomImg { max-width: inherit !important; cursor: pointer; } .detail-images { img { width: 100%; } } .transition-in { opacity: 0; transition: opacity 0.2s linear; } .transition-in.lazyloaded { opacity: 1; } .lazyloading { min-height: 100px; } img[data-sizes="auto"] { display: block; width: 100%; } /*Ensures that small images are not stretched larger */ .small-auto-image { width: auto !important; display: block; margin-left: auto; margin-right: auto; max-width: 100%; } .loading-wrap { position: relative; } /* #Placeholders ================================================== */ $color-blankstate: rgba(255,255,255, 0.15); $color-blankstate-background: #333333; .placeholder-svg { fill: #333333; width: 100%; height: 100%; max-width: 100%; max-height: 100%; box-sizing: border-box; } .placeholder-svg--banner, .placeholder-svg--slideshow, .placeholder-svg--video { fill: $color-blankstate; background-color: $color-blankstate-background; max-height: 600px; border-left: 0; border-right: 0; } .placeholder-instagram .four:nth-child(even) .placeholder-svg--instagram { margin-bottom: 10px; } /* #Videos ================================================== */ /* For YouTube and Vimeo videos, wrap the embedded code snippet in a
tag to allow it to resize. To restrict the width, wrap with an additional
*/ .video-container { position: relative; padding-bottom: 56.25%; padding-top: 25px; height: 0; overflow: hidden; } .video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .video-wrapper { width: 600px; max-width: 100%; } video { display: block; width: 100%; height: auto; } .header-video--media { width: 100%; height: auto; } /* #Home page - video */ .homepage-video { position: relative; overflow: hidden; transition: height 0.3s ease-in-out; img { width: 100%; display: block; } iframe { position: absolute; top: 0; bottom: 0; left: 0; right: 0; height: 100%; width: 100%; } .homepage-video--media { cursor: pointer; width: 100%; height: auto; padding-top: 0; } .flex-caption { z-index: 10; } .caption.text-on-video { z-index: 3; pointer-events: none; } .mediaWrapper { position: absolute !important; top: 0; left: 0; } .first_button { pointer-events: true; } } .homepage-video__placeholder { position: relative; } .homepage-video.darken-video-true::after { content: ''; display: block; background: rgba(0,0,0,0.3); top: 0; left: 0; right: 0; bottom: 0; position: absolute; pointer-events: none; } .caption { position: absolute; top: 50%; -ms-transform: translate(0, -50%); transform: translate(0, -50%); pointer-events: none; text-align: center; a { pointer-events: all; } } /* Featured Collections */ .featured_collections .thumbnail a[href] img { box-shadow: #000 0em 0em 0em; transition: opacity 0.2s linear; } .featured_collections .thumbnail:hover a[href] img { opacity: 0.8; } /* Featured Promotions */ /* Featured Promotions */ .featured-promotions h2.title { border: 0; margin: 0; padding: 20px 0 15px 0; font-size: 22px; line-height: 1.2; } .feature-wrap {padding: 10px 20px;} .feature-section { text-align: center; float: left; margin: 0 10px 10px; position: relative;} .feature-section .description a { pointer-events: auto; } .feature-section img { width: 100%; display: block; box-shadow: #000 0em 0em 0em; } .feature-section .rounded { border-radius: 50%; max-width: 66%; margin: 0px auto; } .feature-section:hover a[href] img { opacity: 0.8;} .feature-section:hover a[href] h2.title {color: #255a90; } .promo-1 { -webkit-animation-delay: 0s; animation-delay: 0s; } .promo-2 { -webkit-animation-delay: 0.3s; animation-delay: 0.3s; } .promo-3 { -webkit-animation-delay: 0.6s; animation-delay: 0.6s; } .promo-4 { -webkit-animation-delay: 0.9s; animation-delay: 0.9s; } .promo-5 { -webkit-animation-delay: 1.2s; animation-delay: 1.2s; } .promo-6 { -webkit-animation-delay: 1.5s; animation-delay: 1.5s; } .promo-7 { -webkit-animation-delay: 1.8s; animation-delay: 1.8s; } /* #Buttons ================================================== */ /* #Tabs ================================================== */ main ul.tabs { display: block; margin: 20px 0 10px 0; padding: 0; border-bottom: solid 1px #ddd; border-top: 0; } main ul.tabs li { display: block; width: auto; height: 30px; padding: 0; float: left; margin-bottom: 0; border: 0 } main ul.tabs li a { display: block; text-decoration: none; width: auto; height: 29px; padding: 0px 15px; line-height: 30px; border: solid 1px #ddd; border-width: 1px 0 0 1px; margin: 0; background: #f5f5f5; font-size: 13px; } main ul.tabs li a.active { background-color: #ffffff; height: 30px; position: relative; top: -4px; padding-top: 4px; border-right-width: 1px; margin: 0 -1px 0 0; color: #404040; -moz-border-radius-topleft: 2px; -webkit-border-top-left-radius: 2px; border-top-left-radius: 2px; -moz-border-radius-topright: 2px; -webkit-border-top-right-radius: 2px; border-top-right-radius: 2px; } main ul.tabs li:first-child a { -moz-border-radius-topleft: 2px; -webkit-border-top-left-radius: 2px; border-top-left-radius: 2px; } main ul.tabs li:last-child a { border-width: 1px 1px 0 1px; -moz-border-radius-topright: 2px; -webkit-border-top-right-radius: 2px; border-top-right-radius: 2px; } main ul.tabs-content { margin: 0; display: block; border: 0;} ul.tabs-content > li { display:none; border: 0;} ul.tabs-content > li.active { display: block; border: 0;} /* Clearfixing tabs for beautiful stacking */ ul.tabs:before, ul.tabs:after { content: '\0020'; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; } ul.tabs:after { clear: both; } ul.tabs { zoom: 1; } /* #Forms ================================================== */ form { margin-bottom: 20px; } fieldset { margin-bottom: 20px; } input[type="text"], input[type="password"], input[type="email"], input[type="search"], input[type="url"], input[type="tel"], input[type="number"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="range"], input[type="color"], select, textarea { display: block; width: 100%; height: 40px; min-height: 40px; padding: 0 9px; margin: 0; line-height: 22px; border: 1px solid #dfdfdf; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; outline: none; background: #fff; color: #5f6a7d; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font: 13px "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif; margin-bottom: 15px; } input[type="text"]:active, input[type="text"]:focus, input[type="password"]:active, input[type="password"]:focus, input[type="email"]:active, input[type="email"]:focus, input[type="search"]:active, input[type="search"]:focus, input[type="url"]:active, input[type="url"]:focus, input[type="tel"]:active, input[type="tel"]:focus, input[type="number"]:active, input[type="number"]:focus, input[type="date"]:active, input[type="date"]:focus, input[type="month"]:active, input[type="month"]:focus, input[type="week"]:active, input[type="week"]:focus, input[type="time"]:active, input[type="time"]:focus, input[type="range"]:active, input[type="range"]:focus, input[type="color"]:active, input[type="color"]:focus, select:active, select:focus, textarea:active, textarea:focus { border: 1px solid #aaa; color: #444; -moz-box-shadow: 0 0 3px rgba(0,0,0,.2); -webkit-box-shadow: 0 0 3px rgba(0,0,0,.2); box-shadow: 0 0 3px rgba(0,0,0,.2); } select { background: url(//shop3d.ca/cdn/shop/t/42/assets/select.png?v=115686807687498086611753739152) no-repeat right,#fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border-radius: 3px; border: 1px solid #d9dbdc; -webkit-appearance: none; -ms-appearance: none; -moz-appearance: none; -o-appearance: none; appearance: none; padding: 10px 9px 8px; text-indent: 0.01px; text-overflow: ''; } select::-ms-expand { display: none; } label, legend { display: block; font-weight: bold; font-size: 14px; padding-bottom: 4px; } input[type="checkbox"] { display: inline; } label span, legend span { font-weight: bold; font-size: 14px; color: #444; } textarea { padding: 8px; min-height: 100px; } #customer_decline { width: auto; } /* #Tables ================================================== */ /* #Misc ================================================== */ .remove, .remove:visited{ color: #404040; } .half-bottom { margin-bottom: 10px !important; } .add-bottom { margin-bottom: 20px !important; } .inline { display: inline; } .right { float:right; position: relative; } .left { float: left; } .relative { position: relative; } .align_right { text-align:right } .align_left { text-align: left; } .align_center { text-align: center; } div.mobile_only { display:none; } .no_border { border: none !important; } .extra_padding { padding-top: 4px; } .view_cart { float: right; position: relative; top: 8px; right: 50px; } div.hidden { display: none; } div#gift-card-outer-container { background-color: #eee; } #target { text-align: center; } #gift-card-outer-container a.action_button { width: 90%; display: block; margin: 0 auto; } /* JOY */ .MuiLink-button { min-height: 30px; color: #ffffff!important; padding: 5px;} /* #Site Styles ================================================== */ div.container { margin: 0 auto; } div.content { padding: 15px 0 10px 0; } div.main-container.content {padding: 0} .index .shopify-section { margin-bottom: 15px; } .content_column { padding-bottom: 2em; .action_button { display: inline; } } .image_column { text-align: center; img, svg { margin-bottom: 15px; } } div.shopify-section.header-section, div.shopify-section.footer-section { margin-bottom: 0; } .header_icons { float: right; margin-right: 15px; } .header_icons a.ss-icon { font-size: 32px; display: inline-block; margin: 10px 0 10px 0; line-height: 1em; } .logo img { max-width: 100%; height: auto; } .logo a { display:block; &.logo-align--left { text-align: left; margin: 0; } &.logo-align--center { text-align: center; margin: 0 auto; } } div.section { margin: 10px 0; } .index div.section.product_section { padding-top: 25px; .product_info { margin-bottom: 2em; } } div.product_section { margin-top: 5px; } .frontpage_product_stagger--true .product_section:nth-child(2n) { > div { float: right; } } .product_row { text-align: center; } .purchase { margin-top: 25px; } .inline_purchase { display: inline-block; margin-left: 20px; margin-top: 30px; } .items_left p { margin-bottom: 10px; } .breadcrumb { font-size: 12px; font-style: italic; padding-bottom: 1em; padding-top: 10px; } .product_breadcrumb { margin: 1em; } #feature_image a { cursor: -webkit-zoom-in; cursor: -moz-zoom-in; } .feature_text { margin: 10px 0 0; clear: both; } .paginate { text-align: center; } .paginate span { padding: 0 10px; } .sidebar a { color: #404040; } .sidebar .ss-icon { color: #404040; } .thumbnail { position: relative; padding-bottom: 0.5em; margin-bottom: 1em; } .thumbnail.blank { border: 0; } .products .thumbnail img { max-height: 200px; } .thumbnail a { display: block; padding-bottom: 0.5em; color: #404040; } .thumbnail a:hover, .sidebar a:hover { color: #255a90; } .thumbnail a img, .thumbnail a svg { margin-bottom: 15px; display: block; margin-left: auto; margin-right: auto; } .thumbnail .secondary { display: none; } .swap .secondary { display: block; } .swap .primary { display: none; } .banner_image { width: 100%; height: auto; margin-bottom: 2em; } .sale_banner, .new_banner { position: absolute; top: 0px; left: 0px; background: #222222; font-size: 15px; font-family: 'Rubik', sans-serif; text-transform: uppercase; text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.3); padding: 6px 20px; text-align: center; color: #fff; } .new_banner { background-color:#cd2027; padding: 6px 23px; } .thumbnail .info { text-align: center; } .thumbnail .price { display: block; font-weight: bold; } .collection_swatches { text-align: center; } .cart_price { float:right; padding-left: 20px; font-weight:bold; } .cart_price { display: none; } .was_price { text-decoration: line-through; color: #888888; font-style: italic; text-shadow: none; font-weight: normal; } .thumbnail .quick_shop { display: none; padding: 6px 0; background-color: #888888; border-color: #888888; position: absolute; width: 130px; top: 50%; left: 50%; margin-left: -65px; color: #ffffff; } .thumbnail .quick_shop:hover { color: #ffffff; background-color: #222222; border-color: #222222; } .thumbnails a { display:block; margin-bottom: 1em; } .arrow { font-size: smaller; position: relative; left: 2px; } .modal { margin: 10px 0; display: none; background-color: #ffffff; } .modal_product { width: auto; line-height:0px; max-width: 940px; } .cart_notification { display: table !important; .cart_notification_content { margin-left: 20px; } } .cart_notification .product_image { display: table-cell; text-align: center; vertical-align: middle; float: none; } .cart_notification .action_button { display: inline; } .modal_product img { cursor: pointer; } .modal_image { text-align:center; } .modal a { padding-bottom: 0; } .modal p.modal_price, p.modal_price { font-size: 22px; margin-bottom: 10px; } .modal form { margin-bottom: 10px; } .notify_form .action_button { width: 100%; } .product_image { text-align: center; } .product_image_col { margin-top: 15px; text-align:center; } .meta { font-size: 13px; padding-bottom: 5px; } .meta p { font-size: 13px; margin-bottom: 0px; } p.meta { margin-bottom: 5px; } .meta .label, .label { color: #808080; } .meta .label { display: inline-block; min-width: 25%; } .cart .meta .label { min-width: auto; } .notify_form { padding-top: 10px; } .count { font-style: normal; font-size: 13px; } .filter_wrap { display: inline-block; width: 48%; @include respond-to('xlarge'){ width: auto; } @include respond-to('medium'){ width: 100%; display: inline-block; } } #tag_filter, #sort-by { display: inline-block; padding-right: 30px; width: 100%; @include respond-to('xlarge'){ width: auto; } } .section_select { text-align: right; } .or { font-size:smaller; font-style: italic; padding: 0 10px; } input.quantity { width: 45px; display: inline; padding-left: 6px; padding-right: 0; height: 35px; min-height: 35px; } .quantity_left { float: left; } .cart_image img { float:left; margin-right: 20px; max-width: 180px; } .quantity_label { display: none; } .subtotal { text-align:right; } .mobile_left { text-align: right; } .cart_description { font-size: 13px; } label.tos_label { display: inline; font-weight: normal; text-transform: none;} #estimated-shipping, .excluding_tax { display: block; } h4.title a.twitter, h4.title a.subscribe { display: inline; font-size: 18px; } h4.title a.twitter .text, h4.title a.subscribe .text { position: relative; top: -14px; font-size: 16px; } #instafeed img, #instafeed video { margin-bottom: 1em; } .article, .article_image { padding-bottom: 30px; } .article img { margin-bottom: 10px; } body.article { padding-bottom: 0 } .blog_meta span { position: relative; display: inline-block; margin-right: 15px; font-size: smaller; color: #888888; } .blog_meta span:after { content: ''; position: absolute; right: -16px; top: 50%; margin: -1px 5px 0; width: 4px; height: 4px; border-radius: 2px; background-color: #ced3d3; box-sizing: border-box; } .blog_meta span:last-child:after { background-color: transparent; } .tags span a { font-weight: bold; color: #255a90; } .blog_list li { list-style: none; } .collection_menu li span.active, .sidebar li.active a, ul.blog_list a.active, ul.blog_list a.active--default { color: #000000; } .collection_menu li a:hover, .collection_menu li span.active:hover, .sidebar a:hover { color: #255a90; } .toggle span { color: #888888; font-weight:bold; font-family: 'Rubik', sans-serif; font-size:smaller; float: right; display: none; } .toggle-all--true { h4.toggle { cursor: pointer; } .toggle span { display: block; } .toggle_list, .article_list { display: none; } } .sidebar ul, .sidebar li { list-style: none; } .sidebar .search { padding-top: 8px; } .sidebar input.search_box { width: 100%; height: 40px; min-height: 40px; padding: 0 9px 0 28px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .sidebar_content { border-left: solid 1px #aeaeb0; padding-left: 20px; } .sidebar .newsletter { margin-bottom: 20px; .contact-form { width: auto; } } .sidebar input.sign_up[type="submit"], .sidebar input.contact_email[type="email"] { width: 100% !important; margin-left: 0; } .comment { margin-bottom:30px; } .comment-body p.meta { margin-bottom: 5px; font-size: smaller; } .comment-body h6 { padding: 0; } .gravatar { width: 100px !important; } .gravatar img { width: 80px; height: 80px; margin-bottom: 15px; -webkit-border-radius: 40px; -khtml-border-radius: 40px; -moz-border-radius: 40px; -ms-border-radius: 40px; -o-border-radius: 40px; border-radius: 40px; } .red { color: #C33; } .address p { margin-bottom: 5px; } div#disqus_thread ul, div#disqus_thread li { border: none; } .tweet .columns { overflow: hidden; -ms-word-break: break-all; word-break: break-all; word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; } div.featured_content { margin-top: 20px; margin-bottom: 0; text-align: center; } .featured_content p { margin-bottom: 0; } .featured_text { font-size: 18px; line-height: 36px; } .social_buttons { text-align: center; } .share_article .social_buttons { text-align: left; @media only screen and (max-width: 767px){ text-align:left; } } .social_buttons a, .social_buttons a:visited { display: inline-block; line-height: 32px; padding: 0 6px; color: #404040; margin: 8px 8px 8px 0; font-size: 12px; } .social_buttons a:hover, .social_buttons a:active { color: #255a90; } .size_chart { float: right; padding-top: 2px; font-family: 'Rubik', sans-serif; } .size_chart_content { display: none; padding: 10px 20px; } /* #Footer ================================================== */ .footer-section { margin-bottom: 0; } .footertitle{ font-size:0.9em; } footer { background-color: #001b5e; color:#fff; font-size: 14px; line-height: 1.7em; padding: 30px 0; margin-top: 2em; &.text-align--left { text-align: left; } &.text-align--center { text-align: center; } } footer hr { border-color: #888888; } footer a { color: #fff; text-shadow: none; } footer a:visited {color:#bbbbbb;} footer a:hover { color: #707070; text-shadow: none; } footer_menu_vertical ul { margin-bottom: 1em; } footer_menu_vertical li { padding: 0 0 15px 0; list-style: none outside; } footer_menu { margin-bottom: 0; } footer_menu li { display: inline; padding: 0 15px 15px 15px; @include respond-to('medium'){ display: block; } } footer .action_button { background-color: #4d4d4d !important; border-color: #4d4d4d !important; } footer .action_button:hover { background-color: #707070 !important; border-color: #707070 !important; } .contact-form { margin-bottom: 0; } #contact_email, #contact_name { display:inline-block; width: 205px; margin-bottom:0px } input.search_box { height: 30px; min-height: 30px; padding-left: 28px; background: #fff url(//shop3d.ca/cdn/shop/t/42/assets/search.jpg?v=14535434292738173541753739152) no-repeat 6px; margin-bottom: 0; } .search_box:focus { background-color: #fff; } #currencies { max-width: 40%; height: 30px; min-height: 30px; margin: 5px 0; padding-top: 6px; } .payment_methods { margin: 4px 0 6px 0; -webkit-filter: grayscale(1); filter: grayscale(1); } .payment_methods img { padding-right: 5px; height: 30px; width: 48px; } .footer .credits, .footer .credits a { font-size: 13px; color: #888888 !important; padding-top: 1em; } table tr.order_summary td.label { text-align: right;} /* #Image Gallery ================================================== */ .gallery-section{ text-align: center; a{display: block;} img{width: 100%;height: auto;display: block;} .two-per-row { width: 50%; @media only screen and (max-width: 767px) { width: 100%; } } .three-per-row { width: 33.333%; @media only screen and (max-width: 767px) { width: 100%; } } .four-per-row { width: 25%; @media only screen and (max-width: 767px) { width: 100%; } } .gallery_image{ display: block; float: left; margin: 0; } .add-padding{ padding: 5px; } } /* #Logo-list ================================================== */ /* Titles */ h2 .first-title {font-weight:600; color:#76787a;} h2 .second-title {font-weight:300; color:#8f9092;} /* #Swatch Styles ================================================== */ .selector-wrapper, .select { display: none; } .swatch_options { margin-bottom: 1em; } .swatch .option_title { margin: 0 0 0.8em 0; } /* Hide radio buttons.*/ .swatch input { display:none; } .swatch label { float:left; min-width: 25px; height: 35px; margin:0; font-size:13px; text-align:center; line-height: 35px; white-space:nowrap; text-transform:uppercase; cursor: pointer; padding: 0 10px; } .swatch .color label { min-width: 30px; height: 30px; line-height: 30px; background-position: center; background-size: cover; } .swatch-element { border: #e2e2e2 1px solid; } .swatch-element.color { padding: 6px; } .swatch-element.color, .swatch-element.color label { -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; border: #e2e2e2 1px solid; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .color.swatch-element label { padding:0; } .swatch_options input:checked + .swatch-element { border-color: #666; } .swatch .swatch-element { float:left; -webkit-transform:translateZ(0); -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing: grayscale; margin:0px 10px 5px 0; position:relative; } .crossed-out { position:absolute; width:100%; height:100%; left:0; top:0; } .swatch .swatch-element .crossed-out { display:none; } .swatch .swatch-element.soldout .crossed-out { display:block; height: 100%; width: 100%; } .swatch .swatch-element.soldout label { filter: alpha(opacity=60); -khtml-opacity: 0.6; -moz-opacity: 0.6; opacity: 0.6; } /* Tooltips */ .swatch .tooltip { text-align:center; background: #333; background: rgba(#333, 0.9); color:#fff; bottom:100%; padding: 5px 10px; display:block; position:absolute; width:120px; font-size: 13px; left:-35px; margin-bottom:15px; /* Make it invisible by default */ filter:alpha(opacity=0); -khtml-opacity: 0; -moz-opacity: 0; opacity:0; visibility:hidden; /* Animations */ -webkit-transform: translateY(10px); -moz-transform: translateY(10px); -ms-transform: translateY(10px); -o-transform: translateY(10px); transform: translateY(10px); -webkit-transition: all .25s ease-out; -moz-transition: all .25s ease-out; -ms-transition: all .25s ease-out; -o-transition: all .25s ease-out; transition: all .25s ease-out; -webkit-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28); -moz-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28); -ms-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28); -o-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28); box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28); z-index: 10000; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; } .swatch .tooltip:before { bottom:-20px; content:" "; display:block; height:20px; left:0; position:absolute; width:100%; } /* CSS triangle */ .swatch .tooltip:after { border-left:solid transparent 10px; border-right:solid transparent 10px; border-top:solid rgba(#333, 0.9) 10px; bottom:-10px; content:" "; height:0; left:50%; margin-left:-13px; position:absolute; width:0; } .swatch .swatch-element:hover .tooltip { filter:alpha(opacity=100); -khtml-opacity:1; -moz-opacity:1; opacity:1; visibility:visible; -webkit-transform:translateY(0px); -moz-transform:translateY(0px); -ms-transform:translateY(0px); -o-transform:translateY(0px); transform:translateY(0px); } .collection_swatches { clear: both; } .collection_swatches .swatch { display: inline-block; margin: 2px; } .collection_swatches .swatch span { width: 20px; min-width: 20px; height: 20px; float: none; display: inline-block; -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; border: #e2e2e2 1px solid; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; background-position: center; background-size: cover; } /* #FlexSlider v2.6 ================================================== */ /* Browser Resets *********************************/ .flex-container a:active, .flexslider a:active, .flex-container a:focus, .flexslider a:focus {outline: none;} .slides, .flex-control-nav, .flex-direction-nav, .flex-direction-nav li {margin: 0; padding: 0; list-style: none; line-height: 1; } ul.slides li {border:none; padding: 0; margin-bottom: 0; position: relative;} /* FlexSlider Necessary Styles *********************************/ html[xmlns] .slides {display: block;} .flexslider {margin: 0; padding: 0; z-index: 0;} .flexslider .slides > li {display: none;} /* Hide the slides before the JS is loaded. Avoids image jumping */ .flexslider .slides img {display: block;} .flex-pauseplay span {text-transform: capitalize;} .index .slides img, .article .slides img { width: 100%; } .slider.slideshow_article_darken--true { background-color: #000; img { opacity: 0.6; } } /* Clearfix for the .slides element */ .slides:after {content: "\0020"; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} * html .slides {height: 1%;} /* No JavaScript Fallback */ /* If you are not using another script, such as Modernizr, make sure you * include js that eliminates this class on page load */ .no-js .slides > li:first-child {display: block;} .flexslider .slides img { display: block; max-width: 100%; height: auto; margin: 0 auto; } /* FlexSlider Default Theme *********************************/ .flexslider {position: relative; zoom: 1; clear:both; overflow: hidden} .flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; } .loading .flex-viewport {max-height: 300px;} .flexslider .slides {zoom: 1;} .flexslider .slides .flex-active-slide{z-index:100 !important;} .flexslider .slides li {text-align: center; position: relative; z-index:-100 !important;} .flexslider-container {position:relative;} .carousel li {margin-right: 5px;border: 0} .flex-caption { margin:0; width: 100%; position: absolute; color: #fff; text-shadow: 0 2px 2px rgba(0,0,0,0.2); top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .flexslider .headline, .caption-content .headline { color: #ffffff; font-size: 42px; margin-bottom: 0.2em; line-height: 47px; font-weight: normal; border: 0; text-align: inherit; } .subtitle { font-family: 'Rubik', sans-serif; font-weight: normal; font-style: normal; text-transform: none; font-size: 16px; color: #ffffff; line-height: 1.5em; position: relative; margin-bottom: 35px; } .subtitle p a { pointer-events: all; } .flex-caption .action_button { width: auto; padding: 12px 20px; } /* Direction Nav */ .flex-direction-nav {height: 0;} .flex-direction-nav a {z-index:200 !important; width: 80px; height: 80px; margin: -20px 0 0; display: block; z-index: 10; position: absolute; top: 50%; cursor: pointer; opacity: 0; -webkit-transition: all .3s ease; transition: all .3s ease; color: #fff !important; text-shadow: 0 0 1px #000; font-size: 55px; } .flex-direction-nav .flex-next {background-position: 0 -120px; right: -36px; text-align: center; } .flex-direction-nav .flex-prev {background-position: 0 -60px; left: -36px; text-align: center;} .flexslider:hover .flex-next {opacity: 0.8; right: 15px;} .flexslider:hover .flex-prev {opacity: 0.8; left: 15px;} .flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover {opacity: 1;} .flex-direction-nav .flex-disabled {opacity: .3 !important; filter:alpha(opacity=30); cursor: default;} /* Control Nav */ .flex-control-nav { position: absolute; bottom: 4%; text-align:center; width: 100%; z-index: 100; } .flex-control-nav li {margin: 0 0 0 5px; display: inline-block; zoom: 1; *display: inline;} .flex-control-nav li:first-child {margin: 0;} .flex-control-nav li a { width: 6px; height: 6px; display: inline-block; cursor: pointer; text-indent: -9999em; background: #fff; border: 1px solid transparent; color: #fff; margin: 8px; overflow: hidden; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; transition: all 0.2s ease-in-out; } .flex-control-nav li a.flex-active, .flex-control-nav li a:hover { border: 1px solid #fff; background: transparent; -webkit-transform: scale(1.5); transform: scale(1.5); } .flex-control-thumbs {width: 100%; position: absolute; bottom: -40px; text-align: center;} .flex-control-thumbs li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;} .flex-control-thumbs {position: static; overflow: hidden;} .flex-control-thumbs li, .flex-control-thumbs li:first-child { width: 55px; height: 55px; vertical-align: top; overflow: hidden; margin: 11px 10px 0 0; border: 1px solid #eaf0f6; background: #eaf0f647;} .flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;} .flex-control-thumbs img:hover {opacity: 1;} .flex-control-thumbs .flex-active {opacity: 1; cursor: default;} .product_slider .flex-active-slide a:hover {cursor: -webkit-zoom-in; cursor: -moz-zoom-in;} .product_slider, .product_slider .flex-viewport { margin-bottom: 1em } .product_slider .slides img { max-height: 700px; } .thumbnail_position--left-thumbnails, .thumbnail_position--right-thumbnails { .flex-control-thumbs { width: 16%; margin: 0 auto; margin-bottom: 15px; li { width: auto; margin-top: 20px; &:first-child { margin-top: 0; } } } .product_gallery > .slides, .flex-viewport { width: 80%; } } .thumbnail_position--left-thumbnails { .product_gallery > .slides, .flex-viewport { float: right; } .flex-control-thumbs { float: right; margin-right: 4%; } } .thumbnail_position--right-thumbnails { .product_gallery > .slides, .flex-viewport { float: left; } .flex-viewport { float: left; } .flex-control-thumbs { float: left; margin-left: 4%; } } .thumbnail_position--none, .thumbnail_position--bottom{ .flex-control-thumbs li:nth-child(5n) {margin: 15px 0 0; } } .homepage_slider, .header_banner { position: relative; z-index: 0; margin-top: -10px; } .homepage_slider .slides img.lazyloaded { width: 100%; } .header_banner { margin-bottom: 25px; } .flex-caption { pointer-events: none; .action_button { pointer-events: all; } } .homepage_slider .slides > li:first-of-type {display: block } .homepage_content { padding: 10px 0; .action_button { display: inline; @include respond-to('medium'){ display: block; } } } .index-sections .image-with-text-overlay-section:last-child { margin-bottom: 0; } #grid .column, #grid .columns { background: #ddd; height: 25px; line-height: 25px; margin-bottom: 10px; text-align: center; text-transform: uppercase; color: #555; font-size: 12px; font-weight: bold; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; } #grid .column:hover, #grid .columns:hover { background: #bbb; color: #333; } #grid .example-grid { overflow: hidden; } /* #Fancybox ================================================== */ /*! fancyBox v2.1.2 fancyapps.com | fancyapps.com/fancybox/#license */ .fancybox-wrap, .fancybox-skin, .fancybox-outer, .fancybox-inner, .fancybox-image, .fancybox-wrap iframe, .fancybox-wrap object, .fancybox-nav, .fancybox-nav span, .fancybox-tmp { padding: 0; margin: 0; border: 0; outline: none; vertical-align: top; } .fancybox-wrap { position: absolute; top: 0; left: 0; z-index: 8020; } .fancybox-skin { position: relative; background-color: #ffffff; color: #404040; text-shadow: none; } .fancybox-opened { z-index: 8030; } .fancybox-opened .fancybox-skin { -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5); } .fancybox-outer, .fancybox-inner { position: relative; } .fancybox-inner { overflow: hidden; } .fancybox-type-iframe .fancybox-inner { -webkit-overflow-scrolling: touch; } .fancybox-error { color: #444; font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif; margin: 0; padding: 15px; white-space: nowrap; } .fancybox-image, .fancybox-iframe { display: block; width: 100%; height: 100%; } .fancybox-image { max-width: 100%; max-height: 100%; } #fancybox-loading { position: fixed; top: 50%; left: 50%; margin-top: -22px; margin-left: -22px; background-position: 0 -306px; opacity: 1; cursor: pointer; z-index: 8060; -webkit-border-radius: 4px; -khtml-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; background-color: #fff; } #fancybox-loading div { width: 44px; height: 44px; background: url('//shop3d.ca/cdn/shop/t/42/assets/loader.gif?v=125178144250721846881753739152') center center no-repeat; background-size: 32px 32px; display: block !important; } .fancybox-close { position: absolute; top: 28px; right: 28px; cursor: pointer; z-index: 8040; font-size: 28px !important; color: #404040 !important; } .gallery .fancybox-close, .newsletter_popup .fancybox-close { top: 2px; right: 2px; } .cart_notification .fancybox-close { top: 25px; right: 45px; @include respond-to('medium'){ top: 2px; right: 2px; } } .fancybox-nav { position: absolute; top: 0; width: 40%; height: 100%; cursor: pointer; text-decoration: none; background: transparent url('//shop3d.ca/cdn/shop/t/42/assets/blank.gif?v=164826798765693215961753739152'); /* helps IE */ -webkit-tap-highlight-color: rgba(0,0,0,0); z-index: 8040; } .fancybox-prev { left: 0; } .fancybox-next { right: 0; } .fancybox-nav span { position: absolute; top: 50%; width: 60px; height: 60px; margin-top: -18px; cursor: pointer; z-index: 8040; visibility: hidden; color: #333; opacity: 0.8; text-shadow: 0 0 1px #fff; } .fancybox-prev span { left: 16px; } .fancybox-next span { right: -10px; } .fancybox-nav:hover span { visibility: visible; } .fancybox-tmp { position: absolute; top: -9999px; left: -9999px; visibility: hidden; } /* Overlay helper */ .fancybox-lock { overflow: hidden; } .fancybox-overlay { position: absolute; top: 0; left: 0; overflow: hidden; display: none; z-index: 8010; background: url(//shop3d.ca/cdn/shop/t/42/assets/fancybox_overlay.png?v=25725100520094592231753739152); } .fancybox-overlay-fixed { position: fixed; bottom: 0; right: 0; } .fancybox-lock .fancybox-overlay { overflow: auto; overflow-y: scroll; } /* Title helper */ .fancybox-title { visibility: hidden; position: relative; text-shadow: none; z-index: 8050; width: 100%; } .fancybox-opened .fancybox-title { visibility: visible; } .fancybox-title-float-wrap { position: absolute; bottom: 0; right: 50%; margin-bottom: -28px; z-index: 8050; text-align: center; } .fancybox-title-float-wrap .child { display: inline-block; margin-right: -100%; padding: 2px 0px; background: transparent; background: rgba(0, 0, 0, 0.6); text-shadow: 0 1px 2px #222; color: #FFF; font-weight: bold; line-height: 24px; white-space: nowrap; width: 100%; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; } .fancybox-title-outside-wrap { position: relative; margin-top: 10px; color: #fff; } .fancybox-title-inside-wrap { padding-top: 10px; } .fancybox-title-over-wrap { position: absolute; bottom: 0; left: 0; color: #fff; padding: 10px; background: #000; background: rgba(0, 0, 0, .8); } #fancybox-thumbs { position: fixed; left: 0; width: 100%; overflow: hidden; z-index: 8050; } #fancybox-thumbs.bottom { bottom: 2px; } #fancybox-thumbs.top { top: 2px; } #fancybox-thumbs ul { position: relative; list-style: none; margin: 0; padding: 0; border: none; } #fancybox-thumbs ul li { float: left; padding: 1px; opacity: 0.5; border: none; } #fancybox-thumbs ul li.active { opacity: 0.75; padding: 0; border: 1px solid #fff; } #fancybox-thumbs ul li:hover { opacity: 1; } #fancybox-thumbs ul li a { display: block; position: relative; overflow: hidden; border: 1px solid #222; background: #111; outline: none; } #fancybox-thumbs ul li img { display: block; position: relative; border: 0; padding: 0; max-width: none; } /* Checkout */ .checkout_table_header { background-color: #255a90; color: #fff; margin-bottom: 15px; } .checkout_table_header h4 { color: #fff; font-size: 14px!important; padding: 4px 7px!important; } /* Newsletter */ .newsletter { margin-bottom: 1.5em; .contact-form { width: 460px; margin: 0 auto; @include respond-to('medium'){ width: 100%; } } input.sign_up { display: inline-block; width: 30%; @include respond-to('medium'){ width: 100%; } } input.contact_email { width: 67%; display: inline-block; margin-right: 2%; @include respond-to('medium'){ width: 100%; margin-right: 0; } } } .newsletter_popup .fancybox-skin, .newsletter_popup .fancybox-skin p.headline, .newsletter_popup .fancybox-skin a, .newsletter_popup .fancybox-skin a:visited { color: #404040 !important;; } .newsletter_popup .newsletter { margin-bottom: 0; } .newsletter_popup .fancybox-skin { background-color: #ffffff; } .newsletter_popup .fancybox-close { color: #404040 !important; } /* Cloud Zoom CSS. (c)2012 Star Plugins. */ .cloudzoom-zoom-inside img { -webkit-touch-callout:none; -webkit-user-select:none; -khtml-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; -webkit-tap-highlight-color:rgba(0,0,0,0); } .cloudzoom-lens { border:none; border:1px solid #888; width:225px; height:175px; box-shadow: -0px -0px 10px rgba(0,0,0,0.40); cursor:pointer; z-index: 11; } .cloudzoom-zoom { border:1px solid #888; box-shadow: -0px -0px 10px rgba(0,0,0,0.40); background-color: #ffffff; } .cloudzoom-zoom-inside { border:none; box-shadow:none; z-index:1000 !important; position:relative; } .cloudzoom-caption { display:none; text-align: left; background-color:#000; color:#fff; font-weight:bold; padding:10px; font-family: 'Rubik', sans-serif; font-size:11px; } .cloudzoom-blank { background-image:url('//shop3d.ca/cdn/shop/t/42/assets/blank.gif?v=164826798765693215961753739152'); } div.cloudzoom-ajax-loader { display: none; } .cloudzoom-lens + div { display: none !important } /* #Password Page ================================================== */ #password-page-bg { background-color: #000000; color: #ffffff; background: url(//shop3d.ca/cdn/shop/t/42/assets/password-page-background.jpg?v=55097477111664664521753739152) center center; background-repeat: no-repeat; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #password-container { margin: 75px auto 0; max-width: 100%; display: table; text-align: center; display: table; @include respond-to('medium') { margin-top: 10px; } } #password-container h1 { color: #ffffff; } .password-page-row { display: table-row; width: 100%; height: 100%; margin: 0 auto; } .password-page-col { display: table-cell; vertical-align: middle; padding: 5px 30px; width: 100%; h1 { border: 0; } } .password-page-message { color: #ffffff; font-size: 3em; line-height: 1.2; margin: 10px auto; padding: 12px 0; text-align: center; border-top: 1px solid #ffffff; border-bottom: 1px solid #ffffff; } .password-page-follow { color: #ffffff; } .password-logo { max-width: 200px; /* Allows logo to be more prominent*/ margin: 0px auto; } .password-message{ max-width: 600px; font-size: 1.2em; color: #ffffff; } .hr-small { margin: 20px auto; width: 50px; } .password-social { margin-top: 10px; padding-top: 20px; } .password-social ul { margin-left: 0; padding-left: 0; margin-bottom: 10px; } .password-social .social_icons li { display: inline; margin-left: 0; } .password-social .social_icons a, .password-social .social_icons a:visited, .password-social .social_icons a:active { color: #ffffff; font-size: 44px; } .password-social .social_icons a:hover { color:#f02f2f; } .password-footer { margin-top: 15px; margin-bottom: 40px; font-size: 13px; color: #888888; text-align: center; } .powered { display: block; margin-top: 15px; } .shopify a { background-repeat: no-repeat; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAARCAYAAADUryzEAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA0JJREFUeNqMU81vG0UU/83sR73YG+M4xrHj4jj9UCFNSaGlQQUhhFBRpXIo6jEHQFXFAbhy4B/gioTgzgGV7ws5IAoqUgUSoWoIaZJGpGpMHDuptf5a7+fM8nZpJaRy4M0+jd7szO/93u/NsAsX5vFvi6IInHNUq5NnstnsqXp96xur3f392HNlrIcLePHkS8hlTchIJvtVSTOjIaSAwhkiGsXi+BudjjVp28Oj+XzhrPDZh5qqfoIQD5j6wrxHCAJ6UMXVr3pgnB0c9O2843jrE5XMtZER47GTp+bOqfn++d9+Ct5TuLrCGAcjpgnAWEVSdg8HSyWUzTl8v7D08szxSltPB6/OPDWeW/q1caI2O0zfbrThBM7pjdbiz9PG7LsK01epYKiCaMlIQadnHag9UZ2vbuqvl47tVMwcY3fdFjLFCIHksB0bQojCTmfzlWyHf53S0qsyigESMRS0uqtvNbs330nXNHhRAWl3ChnNhLG/jzBy4fg27pGG5TSqWsARV6EGwk+WScgymIQ5auLpyTdRHj2arC//9QXuDpfgeDYkQcgoZixq4DKuAGoo7wEwVg5DD3PVt1EafRzL21/C0HJo9f4gYUO4gZNkFMk5Nkli3wcI4vP7yIvxhsLIIXhBHzfqlzHwWihkDiNjPEwlDJNE/zDABGPQKfR5QAzI8wRU9IWNurWIlJbF+dmP8Ig5ja67Az8cwvWdmCVi4YSMSlTzODjAQxGAvCZkaIpI4MeN97Fc/xbpfXk8WXmNqPcw9C1idR8gKSNN06GYEScZYwZVJ+xj/8hpPJp9HmvNK/Bd6g0zEXfJ9rvEwE0A4qbFLOibimN15RcLR57JVFx7iLGHpvFs9RJ8QZvofmzsXoEXDqAqWiIiyUaAUSIkBTVVY1BuXuth6rhxcaxizDb619EcrGPg7+JG8zJWdj8HZwplk7hTHyDiKrU5BVWXyKT57ncfNz9TRBjxrRWn3/zT2+7seV7DWuabnR+MTrCm6ikNnLLEL3R720dmQkMqFz8dia3rdmvhg8an7MH3hZRhKuVsQTtcPmCcGK+lZvLl1JEdK9T7PW9t75a72L7tXh3sBbdEELXxP00h1//rx98CDACS7p3N/ZPUwQAAAABJRU5ErkJggg==); padding-left: 21px; color: #ffffff; text-decoration: none; } .password-footer a { color: #ffffff; text-decoration: none; } .hide {display:none;} /* Password Page Modal CSS */ .controls { display: block; margin: 1em; text-align: right; text-transform: uppercase; position: relative; } #open-me { text-align: center; margin-bottom: 35px; a { color: #ffffff; &:hover { color: #f02f2f; } } } .close-me { z-index: 8000; } .modalbox { position: absolute; height: 100%; top: -1em; bottom: 0; left: 0; right: 0; padding: 0; z-index:5000; } .overlay { position: fixed; width: 100%; height: 100%; max-height: 100%; top: 0; left: 0; background: #fff; background: rgba(255,255,255,0.95); } .overlay-close { width: 150px; height: 50px; position: absolute; right: 10px; top: 10px; border: 1px solid #000; font-size: 14px; } .overlay-data { opacity: 0; visibility: hidden; -webkit-transition: opacity 0.5s; transition: opacity 0.5s; visibility: 0s 0.5s; transition: opacity 0.5s, visibility 0s 0.5s; } .overlay-open { opacity: 1; visibility: visible; -webkit-transition: opacity 0.5s; transition: opacity 0.5s; } .inputbox { margin: 0px auto; max-width: 80%; display: table; text-align: center; position: absolute; top: 50%; left: 50%; margin-right: -50%; -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); color: #000; } #password-page-bg .modalbox .inputbox { @include respond-to('medium'){ top: 50%; } } .storefront-password-form label { font-size: 0.9em; margin: 0 0 1em 0; text-align: center; } .storefront-password-form .actions { display: inline-block; } .storefront-password-form #password { width: 50%; display: inline-block; @include respond-to('small'){ width: 100%; } } #owner { font-size: 0.9em; margin-top: -1em; opacity: 0.8; } .pass-close a { color: #000 !important; padding: 0 !important; margin: 1em !important; position: inherit !important; } @media screen and (min-width: 320px) and (max-width: 440px) and (max-height: 667px){ .modalbox { display: block; width: 414px !important; max-width: 100%; text-align: center; } .pass-close { display: block; margin: 0.65em -0.15em 1em 0 !important; } } /* #Product Details ================================================== */ div.product-details { .action_button { width: auto; } img { width: 100%; } img.rich-image { max-width: auto; margin-bottom: 20px; } .divider { margin: 20px 0px; opacity:0; } .detail_title { line-height: initial; font-size: 42px; margin-bottom: 0.3em; font-family: 'Rubik', sans-serif; font-weight: normal; text-transform: uppercase; color: #333333; display:block; letter-spacing: 1px; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; @include respond-to('medium'){ font-size: 21px; } } .featured_collections .featured-link--half a[href] img { box-shadow: #000 0em 0em 0em; transition: opacity 0.2s linear; } .featured_collections .featured-link--half:hover a[href] img { opacity: 0.8; } .featured-link--section { box-sizing: border-box; float: left; width: 100%; min-height: 100px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; &:nth-child(odd){ -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -webkit-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; .featured-link--half { float: right; } } } .featured-link--half.featured-link--image { background-color: transparent; text-align: center; } .featured-link--half { box-sizing: border-box; float: left; width: 50%; position: relative; text-align: center; display: table; -webkit-box-flex: 1; -webkit-flex: 1 0 auto; -ms-flex: 1 0 auto; flex: 1 0 auto; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; @include respond-to('small'){ width: 100%; -webkit-box-flex: 1; -webkit-flex: 1 0 100%; -ms-flex: 1 0 100%; flex: 1 0 100%; } .featured-link--wrap { width: 100%; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; } img, svg { display: block; margin: 0 auto; width: 100%; max-width: 100%; @include respond-to('small'){ width: 100%; max-width: auto; } } .info { display: inline-block; width: 80%; margin: 0 auto; padding: 20px; &.text-align--right { text-align: right; .description:before { margin-right: 0; } } &.text-align--left { text-align: left; .description:before { margin-left: 0; } } @include respond-to('small'){ position: static; transform: translateY(0); -webkit-transform: translateY(0); -ms-transform: translateY(0); padding: 2em 0; } } .collection_title { font-size: 2vw; line-height: initial; font-family: 'Rubik', sans-serif; /*font-family: Raleway;*/ font-weight: normal; text-transform: uppercase; color: #333333; display:block; margin-bottom: 0.3em; letter-spacing: 1px; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; @include respond-to('medium') { font-size: inherit; } &.text-align--right { text-align: right; .description:before { margin-right: 0; } } &.text-align--left { text-align: left; .description:before { margin-left: 0; } } } .description { position: relative; font-size: 1.6vw; line-height: 1.5; margin-bottom: 20px; @include respond-to('medium'){ font-size: 2vw; } @include respond-to('small'){ font-size: inherit; } @include respond-to('xlarge'){ font-size: inherit; } } .action_button { width: auto; @include respond-to('tablet'){ padding: 10px 20px; font-size: -2px; } @include respond-to('medium'){ padding: 7px 15px; } } } .featured_collections.across-2 { .featured-link--section.featured-link--no-image { width: 100%; } .featured-link--section:nth-child(odd) .featured-link--half { float: left; } } .featured-link--section.featured-link--no-image { > img { display: none; } .featured-link--half { width: 100%; } .info { position: static; transform: translateY(0); -webkit-transform: translateY(0); -ms-transform: translateY(0); text-align: center; padding: 2em; &.text-align--left { text-align: center; } &.text-align--right { text-align: center; } } .description, .collection_title { display: none; } } .featured_collections.across-2 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; .featured-link--image:nth-of-type(4n+3) { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -webkit-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; @include respond-to('medium'){ -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; } } .featured-link--image:nth-of-type(4n+4) { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -webkit-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } } .featured_collections.across-2 { .featured-link--section.featured-link--no-image { .featured-link--half { width: 100%; } } .featured-link--section { width: 50%; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; @include respond-to('medium'){ width: 100%; &:nth-of-type(2n){ -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -webkit-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } } .featured-link--half { @include respond-to('medium'){ width: 50%; } @include respond-to('small'){ width: 100%; } } .description { font-size: 1.2vw; @include respond-to('medium'){ font-size: inherit; } } .button { font-size: 1.2vw; @include respond-to('medium'){ font-size: inherit; } } } .featured-link--image:nth-of-type(2n+1) { clear: both; } .featured-link--image:nth-of-type(2n+2) .featured-link--half { float: left; @include respond-to('medium'){ float: right; } } .featured-link--image:nth-of-type(3n+3) .featured-link--half { float: right; @include respond-to('medium'){ float: left; } } .featured-link--image:nth-of-type(4n+4) .featured-link--half { float: right; } } } /* * Layout * Skeleton V1.1 * Copyright 2011, Dave Gamache * www.getskeleton.com * Free to use under the MIT license. * http://www.opensource.org/licenses/mit-license.php * 8/17/2011 */ /* Table of Contents ================================================== #Base 1200 Grid #Tablet (Portrait) #Mobile (Portrait) #Mobile (Landscape) #Clearing #Media Queries */ /* #Base 1200 Grid ================================================== */ .container { position: relative; width: 1200px; margin: 0 auto; padding: 0;} .column, .columns { float: left; display: inline; margin-left: 10px; margin-right: 10px;} .row { margin-bottom: 20px; } /* Nested Column Classes */ .column.alpha, .columns.alpha { margin-left: 0; } .column.omega, .columns.omega { margin-right: 0; } /* Base Grid */ .container .one.column { width: 55px; } .container .two.columns { width: 130px; } .container .three.columns { width: 205px; } .container .four.columns { width: 280px; } .container .five.columns { width: 355px; } .container .six.columns { width: 430px; } .container .seven.columns { width: 505px; } .container .eight.columns { width: 580px; } .container .nine.columns { width: 655px; } .container .ten.columns { width: 730px; } .container .eleven.columns { width: 805px; } .container .twelve.columns { width: 880px; } .container .thirteen.columns { width: 955px; } .container .fourteen.columns { width: 1030px; } .container .fifteen.columns { width: 1105px; } .container .sixteen.columns { width: 1180px; } .container .one-third.column { width: 380px; } .container .two-thirds.column { width: 780px; } .container .one-fifth.column { width: 220px; } /* Offsets */ .container .offset-by-one { padding-left: 75px; } .container .offset-by-two { padding-left: 150px; } .container .offset-by-three { padding-left: 225px; } .container .offset-by-four { padding-left: 300px; } .container .offset-by-five { padding-left: 375px; } .container .offset-by-six { padding-left: 450px; } .container .offset-by-seven { padding-left: 525px; } .container .offset-by-eight { padding-left: 600px; } .container .offset-by-nine { padding-left: 675px; } .container .offset-by-ten { padding-left: 750px; } .container .offset-by-eleven { padding-left: 825px; } .container .offset-by-twelve { padding-left: 900px; } .container .offset-by-thirteen { padding-left: 975px; } .container .offset-by-fourteen { padding-left: 1050px; } .container .offset-by-fifteen { padding-left: 1125px; } .container .offset-by-one.alternate { padding-right: 75px; } /* #Base 960 Grid ================================================== */ @media only screen and (min-width: 960px) and (max-width: 1199px) { .container { position: relative; width: 960px; margin: 0 auto; padding: 0; } .column, .columns { float: left; display: inline; margin-left: 10px; margin-right: 10px; } .row { margin-bottom: 20px; } /* Nested Column Classes */ .column.alpha, .columns.alpha { margin-left: 0; } .column.omega, .columns.omega { margin-right: 0; } /* Base Grid */ .container .one.column { width: 40px; } .container .two.columns { width: 100px; } .container .three.columns { width: 160px; } .container .four.columns { width: 220px; } .container .five.columns { width: 280px; } .container .six.columns { width: 340px; } .container .seven.columns { width: 400px; } .container .eight.columns { width: 460px; } .container .nine.columns { width: 520px; } .container .ten.columns { width: 580px; } .container .eleven.columns { width: 640px; } .container .twelve.columns { width: 700px; } .container .thirteen.columns { width: 760px; } .container .fourteen.columns { width: 820px; } .container .fifteen.columns { width: 880px; } .container .sixteen.columns { width: 940px; } .container .one-third.column { width: 300px; } .container .two-thirds.column { width: 620px; } .container .one-fifth.column { width: 172px; } /* Offsets */ .container .offset-by-one { padding-left: 60px; } .container .offset-by-two { padding-left: 120px; } .container .offset-by-three { padding-left: 180px; } .container .offset-by-four { padding-left: 240px; } .container .offset-by-five { padding-left: 300px; } .container .offset-by-six { padding-left: 360px; } .container .offset-by-seven { padding-left: 420px; } .container .offset-by-eight { padding-left: 480px; } .container .offset-by-nine { padding-left: 540px; } .container .offset-by-ten { padding-left: 600px; } .container .offset-by-eleven { padding-left: 660px; } .container .offset-by-twelve { padding-left: 720px; } .container .offset-by-thirteen { padding-left: 780px; } .container .offset-by-fourteen { padding-left: 840px; } .container .offset-by-fifteen { padding-left: 900px; } .container .offset-by-one.alternate { padding-right: 60px; } } /* #Tablet (Portrait) ================================================== */ /* Note: Design for a width of 768px */ @media only screen and (min-width: 768px) and (max-width: 959px) { .container { width: 768px; } .container .column, .container .columns { margin-left: 10px; margin-right: 10px; } .column.alpha, .columns.alpha { margin-left: 0; margin-right: 10px; } .column.omega, .columns.omega { margin-right: 0; margin-left: 10px; } .container .one.column { width: 28px; } .container .two.columns { width: 76px; } .container .three.columns { width: 124px; } .container .four.columns { width: 172px; } .container .five.columns { width: 220px; } .container .six.columns { width: 268px; } .container .seven.columns { width: 316px; } .container .eight.columns { width: 364px; } .container .nine.columns { width: 412px; } .container .ten.columns { width: 460px; } .container .eleven.columns { width: 508px; } .container .twelve.columns { width: 556px; } .container .thirteen.columns { width: 604px; } .container .fourteen.columns { width: 652px; } .container .fifteen.columns { width: 700px; } .container .sixteen.columns { width: 748px; } .container .one-third.column { width: 236px; } .container .two-thirds.column { width: 492px; } .container .one-fifth.column { width: 133px; } /* Offsets */ .container .offset-by-one { padding-left: 48px; } .container .offset-by-two { padding-left: 96px; } .container .offset-by-three { padding-left: 144px; } .container .offset-by-four { padding-left: 192px; } .container .offset-by-five { padding-left: 240px; } .container .offset-by-six { padding-left: 288px; } .container .offset-by-seven { padding-left: 336px; } .container .offset-by-eight { padding-left: 348px; } .container .offset-by-nine { padding-left: 432px; } .container .offset-by-ten { padding-left: 480px; } .container .offset-by-eleven { padding-left: 528px; } .container .offset-by-twelve { padding-left: 576px; } .container .offset-by-thirteen { padding-left: 624px; } .container .offset-by-fourteen { padding-left: 672px; } .container .offset-by-fifteen { padding-left: 720px; } .container .offset-by-one.alternate { padding-right: 48px; } } /* #Mobile (Portrait) ================================================== */ /* Note: Design for a width of 320px */ @media only screen and (max-width: 767px) { .container { width: 300px; } .columns, .column { margin: 0; } .container .one.column, .container .two.columns, .container .three.columns, .container .four.columns, .container .five.columns, .container .six.columns, .container .seven.columns, .container .eight.columns, .container .nine.columns, .container .ten.columns, .container .eleven.columns, .container .twelve.columns, .container .thirteen.columns, .container .fourteen.columns, .container .fifteen.columns, .container .sixteen.columns, .container .one-third.column, .container .two-thirds.column, .container .one-fifth.column { width: 300px; } /* Offsets */ .container .offset-by-one, .container .offset-by-two, .container .offset-by-three, .container .offset-by-four, .container .offset-by-five, .container .offset-by-six, .container .offset-by-seven, .container .offset-by-eight, .container .offset-by-nine, .container .offset-by-ten, .container .offset-by-eleven, .container .offset-by-twelve, .container .offset-by-thirteen, .container .offset-by-fourteen, .container .offset-by-fifteen { padding-left: 0; } .container .offset-by-one.alternate { padding-right: 0; } } /* #Mobile (Landscape) ================================================== */ /* Note: Design for a width of 480px */ @media only screen and (min-width: 480px) and (max-width: 767px) { .container { width: 420px; } .columns, .column { margin: 0; } .container .one.column, .container .two.columns, .container .three.columns, .container .four.columns, .container .five.columns, .container .six.columns, .container .seven.columns, .container .eight.columns, .container .nine.columns, .container .ten.columns, .container .eleven.columns, .container .twelve.columns, .container .thirteen.columns, .container .fourteen.columns, .container .fifteen.columns, .container .sixteen.columns, .container .one-third.column, .container .two-thirds.column, .container .one-fifth.column { width: 420px; } } /* #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 {clear:both;} .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; } /* ------- #Basics ------ */ html {scroll-behavior: smooth;} section {margin:30px 0px;} @font-face { font-family: "Rubik"; src: url('//shop3d.ca/cdn/shop/t/42/assets/Rubik-VariableFont_wght.ttf?v=13750104551074037421753739152') format('truetype'); font-weight: 100 900; /* Defines the range of weights available */ font-style: normal; } @font-face { font-family: "Rubik"; src: url('//shop3d.ca/cdn/shop/t/42/assets/Rubik-Italic-VariableFont_wght.ttf?v=17445089829563299521753739152') format('truetype'); font-weight: 100 900; /* Defines the range of weights available */ font-style: italic; } @font-face { font-family: "SSSandbox"; src: url('//shop3d.ca/cdn/shop/t/42/assets/ss-sandbox.eot?v=141511472151981348991753739152'); src: url('//shop3d.ca/cdn/shop/t/42/assets/ss-sandbox.eot?%23iefix&v=141511472151981348991753739152') format('embedded-opentype'), url('//shop3d.ca/cdn/shop/t/42/assets/ss-sandbox.woff?v=48992105333655219891753739152') format('woff'), url('//shop3d.ca/cdn/shop/t/42/assets/ss-sandbox.ttf?v=129195143481659963811753739152') format('truetype'), url('//shop3d.ca/cdn/shop/t/42/assets/ss-sandbox.svg%23SSSandbox?37593') format('svg'); font-weight: 400; font-style: normal; } /* This triggers a redraw in IE to Fix IE8's :before content rendering. */ html:hover [class^="ss-"]{-ms-zoom: 1;} .ss-icon, .footer .ss-icon, .ss-icon:visited, .ss-icon.ss-sandbox, [class^="ss-"]:before, [class*=" ss-"]:before, [class^="ss-"].ss-sandbox:before, [class*=" ss-"].ss-sandbox:before, [class^="ss-"].right:after, [class*=" ss-"].right:after, [class^="ss-"].ss-sandbox.right:after, [class*=" ss-"].ss-sandbox.right:after { font-family: "SSSandbox"; font-style: normal; font-weight: 400; text-decoration: none; text-rendering: optimizeLegibility; white-space: nowrap; /*-webkit-font-feature-settings: "liga"; Currently broken in Chrome >= v22. Falls back to text-rendering. Safari is unaffected. */ -moz-font-feature-settings: "liga=1"; -moz-font-feature-settings: "liga"; -ms-font-feature-settings: "liga" 1; -o-font-feature-settings: "liga"; font-feature-settings: "liga"; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 40px; margin: 15px 8px 15px 0; display: inline-block; color: #ffffff; } .ss-icon:hover, .ss-icon:active, .footer .ss-icon:hover, .footer .ss-icon:active { color: #707070; } .remove .ss-icon { font-size: 24px !important; margin-right: 0; margin-top: 8px; color: #404040; } [class^="ss-"].right:before, [class*=" ss-"].right:before{display:none;content:'';} @font-face { font-family: 'responsive'; src: url('//shop3d.ca/cdn/shop/t/42/assets/responsive.eot?v=177188688402810416251753739152'); src: url('//shop3d.ca/cdn/shop/t/42/assets/responsive.eot?v=177188688402810416251753739152') format('embedded-opentype'), url('//shop3d.ca/cdn/shop/t/42/assets/responsive.woff?v=125613827718332891281753739152') format('woff'), url('//shop3d.ca/cdn/shop/t/42/assets/responsive.ttf?v=155149060830637160321753739152') format('truetype'), url('//shop3d.ca/cdn/shop/t/42/assets/responsive.svg?v=68270429300444322901753739152') format('svg'); font-weight: normal; font-style: normal; } [class^="icon-"]:before, [class*=" icon-"]:before { font-family: "responsive" !important; font-style: normal; font-weight: normal; speak: none; display: inline-block; text-decoration: inherit; width: 1em; margin-right: .2em; text-align: center; font-variant: normal; text-transform: none; line-height: 1em; margin-left: .2em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-twitter:before { content: '\e800'; } .icon-twitter-share:before { content: '\e801'; margin-right: 0.4em; color: #09AEEC; } .icon-facebook:before { content: '\e802'; } .icon-facebook-share:before { content: '\e803'; margin-right: 0.4em; color: #49659D; } .icon-flickr:before { content: '\e804'; } .icon-vimeo:before { content: '\e805'; } .icon-gplus-share:before { content: '\e806'; margin-right: 0.4em; color: #CC3A2B; } .icon-gplus:before { content: '\e807'; } .icon-pinterest-share:before { content: '\e808'; margin-right: 0.4em; color: #CB1F2A; } .icon-mail:before { content: '\e809'; margin-right: 0.4em; color: #49659D; } .icon-tumblr:before { content: '\e80a'; } .icon-instagram:before { content: '\e80b'; } .icon-email:before { content: '\e80c'; } .icon-youtube:before { content: '\e80d'; } .icon-rss-squared:before { content: '\e80e'; } .icon-cart:before { content: '\e80f'; } .icon-linkedin:before { content: '\e810'; } .icon-menu:before { content: '\e815'; } .icon-cancel:before { content: '\e812'; } .icon-cart:before { content: '\e80f'; } .icon-bag:before { content: '\e816'; } .icon-check:before { content: '\e817'; } .icon-search:before { content: '\e818'; } .icon-down-arrow:before { content: '\e813'; margin-right: 0; } .icon-right-arrow:before { content: '\e814'; margin-right: 0; } .icon-left-arrow:before { content: '\e800'; } .social_icons a { font-size: 30px; color: #ffffff; opacity: 0.8; } .social_icons a:hover { color: #707070; opacity: 1; } .icon-cart { font-size: 13px; } /*------ #Headings ------*/ h1, h1 a { font-weight: 600; color: #404040; border-top: 0px; border-bottom: 0px; text-transform: uppercase; display: block; letter-spacing: 1px; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; line-height: 45px; padding: 5px 0; margin:auto auto 15px auto; } h2, h2 a, h4.section-header.home a:link { color: #76787a; border-top: 0px; border-bottom: 0px; text-transform: uppercase; display: block; letter-spacing: 1px; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; /*line-height: 45px;*/ padding: 5px 0; margin:20px auto; font-weight:600; } h3, h3 a { color: #404040; border-top: 0px; border-bottom: 0px; text-transform: uppercase; display: block; letter-spacing: 1px; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; line-height: 35px; padding: 5px 0; margin:15px auto; font-size:22px; } h4, h4 a { color: #255a90; border-top: 0px !important; border-bottom: 0px !important; text-transform: none !important; display: block; letter-spacing: 1px !important; text-rendering: optimizeLegibility !important; -webkit-font-smoothing: antialiased !important; line-height: 37px !important; padding: 5px 0 !important; margin: auto !important; font-size: 28px !important; } h5, h5 a { color: #404040; border-top: 0px; border-bottom: 0px; text-transform: uppercase; display: block; letter-spacing: 0.55px!important; text-rendering: optimizeLegibility!important; -webkit-font-smoothing: antialiased!important; margin: 0 0 10px!important; font-size:15px!important; font-weight: 700!important; line-height: 19px!important; } h1 {font-size: 28px; font-family: 'Gilroy', sans-serif;} h2 {} h3 {} h4 {} h5 {} h6 {} /* ------ #Buttons ------ */ a.button, button, input[type="submit"], input[type="reset"], input[type="button"], .action_button, a.action_button, input.action_button[type="submit"], input.action_button[type="button"] { background-color: #1f3366; background-image: linear-gradient(-44deg, #1f3366, #255a90); padding: 8px 20px; text-align: center; font-size: 14px; cursor: pointer; display: inline-block; box-sizing: border-box; font-weight: normal; text-transform: uppercase; letter-spacing: 1px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-smoothing: antialiased; /*font-family: Raleway;*/ font-family: 'Rubik', sans-serif; text-shadow: 0 1px rgba(0, 0, 0, 0.1); width: 100%; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; color: #ffffff; transition: all .2s linear; -o-transition: all .2s linear; -moz-transition: all .2s linear; -webkit-transition: all .2s linear; margin-bottom: 0; -webkit-appearance: none; outline: 0px; border:0px; } a.button:hover, button:hover, input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover, .action_button:hover, input.action_button[type="submit"]:hover, input.action_button[type="button"]:hover { color: #ffffff; background: #06060d; border-color: #06060d; outline: none; } a.button, a.action_button { cursor: default; } a.button[href], a.action_button[href] { cursor: pointer; } .disabled { pointer-events: none; opacity: 0.8; } .btn.action_button, input.btn.action_button[type="submit"], input.btn.action_button[type="button"] { width: inherit; } .disabled { pointer-events: none; opacity: 0.8; } .amazon-payments-pay-button { display: block !important; text-align: center; } /* #Custom Buttons */ .btn-blue { width: 100%; background: #050d4e; display: block; padding: 7px; margin: 20px auto 0 auto; text-align: Center; border: 1px solid #212b36; color: #ffffff!important;} a.action_button {margin:5px; } a.action-button.red { background-color: #cd2027!important;} /* Button - Order a Print */ .btn, .h3d-button {background-color: #1f214a; border: 1px solid #1f214a;} /* #Loading Buttons */ .button { position: relative; padding: 8px 16px; background: #203366; border: none; outline: none; border-radius: 2px; cursor: pointer; } .button:active { background: #00479a; } .button__text { font: bold 20px; color: #ffffff; transition: all 0.2s; } .button--loading, .button--loading:active, .button--loading:hover, .button--loading:disabled {background: #5e5f61; cursor: progress;} .button--loading .button__text { visibility: hidden; opacity: 0; } .button--loading::after { content: ""; position: absolute; width: 16px; height: 16px; top: 0; left: 0; right: 0; bottom: 0; margin: auto; border: 4px solid transparent; border-top-color: #ffffff; border-radius: 50%; animation: button-loading-spinner 1s ease infinite; } @keyframes button-loading-spinner { from { transform: rotate(0turn); } to { transform: rotate(1turn); } } /* Homepage Buttons - Recommended Menu */ #recommended-menu ul li { display: inline-block; background: #eaeaea; margin: 10px 5px; padding: 10px; border: 1px solid #c5c5c5; } #recommended-menu ul:first-child {margin: 10px 5px 10px 0px;} #recommended-menu ul:last-child {margin: 10px 0px 10px 5px;} /*------ #Columns ------*/ /* One */ /* Two */ .two-col {width:48%;} .two-col:first-child {padding:2% 2% 2% 0%; float:left;} .two-col:last-child {padding:2% 0% 2% 2%; float:right;} .one-half-first {width:48%; padding:2% 2% 2% 0%; float:left;} /* Legacy */ .one-half-last {width:48%; padding:2% 0% 2% 2%; float:right;} /* Legacy */ /* Three */ .three-col {width:31.3%; padding:2% 1% 2% 1%;float:left;} .three-col:first-child,.four-col:nth-child(4n) {padding:2% 2% 2% 0%; float:left;} .three-col:nth-child(3n) {padding:2% 0% 2% 2%; float:right;} /* Halves working properly with flexbox */ .halves {width: 100%; clear: Both; display: flex; flex-wrap: wrap; } .halves .card, .halves-container .card, .halves .block {min-height: auto; flex: 48%!important; margin: 0 1% 20px 1%;} .halves .block img {width: 100%;} .thirds-container { display: flex; flex-wrap: wrap; width:100%;} .thirds {width: 100%; clear: Both; display: flex; flex-wrap: wrap; } .thirds .card, .thirds-container .card, .thirds .block {min-height: auto; flex: 31.3%!important; margin:2% 1% 2% 1%; max-width: 31.3%;} .thirds .block img {width: 100%;} /*.thirds {width:100%; clear:Both; } .thirds .card, .thirds-container .card {width:31.3%; float:left; margin:2% 1% 2% 1%;}*/ .thirds .card:first-child, .thirds .card:nth-child(4n), .thirds-container .card:first-child, .thirds-container .card:nth-child(3n+1), .thirds-container .card:nth-child(6n+1) {margin:2% 2% 2% 0%!important;} .thirds .card:nth-child(4n), .thirds-container .card:nth-child(3n+1) {clear:Both;} .thirds .card:nth-child(3n), .thirds-container .card:nth-child(3n) { width:31.3%; margin:2% 0% 2% 2%; float:left;} .one-third-first {width:31.3%; padding:2% 2% 2% 0%; float:left;} /* Legacy */ .one-third-middle {width:31.3%; padding:2% 1% 2% 1%;float:left;}/* Legacy */ .one-third-last {width:31.4%; padding:2% 0% 2% 2%; float:left;}/* Legacy */ .two-thirds-first {width:64.6%; padding:2% 2% 2% 0%; float:left;} /* Legacy */ .two-thirds-last {width:64.7%; padding:2% 0% 2% 2%; float:right;}/* Legacy */ /* Four */ /* Fourths working properly with flexbox */ .fourths, .quarters {width: 100%; clear: Both; display: flex; flex-wrap: wrap; align-items: stretch } .fourths .block, .quarters .block {min-height: auto; width: 23%!important; margin: 10px 1% 10px 1%;} .quarters .block img {width: 100%;} .quarters:first-child, .quarters:nth-child(4n+1) {width: 24%!important; margin: 10px 1% 10px 0%;} .quarters:nth-child(4n) {width: 24%!important; margin: 10px 0% 10px 1%;} .four-col {width:23%; padding:2% 1% 2% 1%;float:left;} .four-col:first-child,.four-col:nth-child(5n) {padding:2% 2% 2% 0%; float:left;} .four-col:nth-child(4n) {padding:2% 0% 2% 2%; float:right;} .one-fourth-first {width:23%; padding:2% 2% 2% 0%; float:left;}/* Legacy */ .one-fourth-middle {width:23%; padding:2% 1% 2% 1%;float:left;}/* Legacy */ .one-fourth-last {width:23%; padding:2% 0% 2% 2%; float:left;}/* Legacy */ .two-fourth-first {width:50%; padding:2% 2% 2% 0%; }/* Legacy */ .two-fourth-middle {width:50%; padding:2% 1% 2% 1%;}/* Legacy */ .two-fourth-last {width:50%; padding:2% 0% 2% 2%; }/* Legacy */ /* Five */ .five-col {width:18%; padding:2% 1% 2% 1%;float:left;} .five-col:first-child,.four-col:nth-child(6n) {padding:2% 2% 2% 0%; float:left;} .five-col:nth-child(5n) {padding:2% 0% 2% 2%; float:right;} .one-fifth-first {width:18%; padding:2% 2% 2% 0%; float:left;}/* Legacy */ .one-fifth-middle {width:18%; padding:2% 1% 2% 1%; float:left;}/* Legacy */ .one-fifth-last {width:18%; padding:2% 0% 2% 2%; float:left;}/* Legacy */ .four-fifth-last {width:78%; padding:2% 0% 2% 0%; float:left; }/* Legacy */ .two-fifth-first {width:40%; padding:2% 2% 2% 0%; }/* Legacy */ .two-fifth-middle {width:40%; padding:2% 1% 2% 1%; }/* Legacy */ .two-fifth-last {width:40%; padding:2% 0% 2% 2%; }/* Legacy */ /* Six */ .one-sixth-first {width:14.6%;padding:2% 2% 2% 0%; float:left;}/* Legacy */ .one-sixth-middle {width:14.6%; padding:2% 1% 2% 1%; float:left;}/* Legacy */ .one-sixth-last {width:14.6%; padding:2% 0% 2% 2%; float:left;}/* Legacy */ /* Pages - Division Divs */ .col-container {width: 100%; clear: both; float: none; padding-bottom:20px;} /* Two Column */ .twocol-left {width: 48%; padding-right: 2%; float:left;} .twocol-right {width: 48%; padding-left: 2%; float:left;} /* Three Column */ .threecol-left {width: 31%; padding-right: 2%; float:left;} .threecol-center {width: 31.99%; float:left; padding: 0 1%;} .threecol-right {width: 31%; padding-left: 2%; float:left;} /*------ #Tables ------*/ table { border-collapse: collapse; border-spacing: 0; -webkit-box-shadow: 1px 1px 5px 1px rgba(187,187,187,0.78); box-shadow: 1px 1px 5px 1px rgba(187,187,187,0.78);} table a:link { color: #666; font-weight: bold; text-decoration:none; } table a:visited { color: #999999; font-weight:bold; text-decoration:none; } table a:active, table a:hover { color: #bd5a35; text-decoration:underline; } table { color:#666; text-shadow: 1px 1px 0px #fff; background:#eaebec; border:#ccc 1px solid; margin-bottom: 20px; -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; } table img { max-width: inherit !important; } table th { text-align: left; font-weight: bold; padding: 12px; border-top:1px solid #ccc; border-bottom:1px solid #e0e0e0; background: #ededed; background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#ebebeb)); background: -moz-linear-gradient(top, #ededed, #ebebeb); } table th:first-child{ text-align: left; } table tr:first-child th:first-child{ -moz-border-radius-topleft:3px; -webkit-border-top-left-radius:3px; border-top-left-radius:3px; } table tr:first-child th:last-child{ -moz-border-radius-topright:3px; -webkit-border-top-right-radius:3px; border-top-right-radius:3px; } table tr{ text-align: center; padding-left:12px; } table tr td:first-child{ text-align: left; padding-left:12px; border-left: 0; } table tr td { padding:12px; border-bottom:1px solid #e0e0e0; border-left: 1px solid #e0e0e0; background: #fafafa; background: -webkit-gradient(linear, left top, left bottom, from(#fbfbfb), to(#fafafa)); background: -moz-linear-gradient(top, #fbfbfb, #fafafa); } table tr td.value input { margin-bottom: 0; } table tr.even td{ background: #f6f6f6; background: -webkit-gradient(linear, left top, left bottom, from(#f8f8f8), to(#f6f6f6)); background: -moz-linear-gradient(top, #f8f8f8, #f6f6f6); } table tr:last-child td:first-child{ -moz-border-radius-bottomleft:3px; -webkit-border-bottom-left-radius:3px; border-bottom-left-radius:3px; } table tr:last-child td:last-child{ -moz-border-radius-bottomright:3px; -webkit-border-bottom-right-radius:3px; border-bottom-right-radius:3px; } table tr:hover td{ background: #f2f2f2; background: -webkit-gradient(linear, left top, left bottom, from(#f2f2f2), to(#f0f0f0)); background: -moz-linear-gradient(top, #f2f2f2, #f0f0f0); } tr.categories td, tr.categories:hover td { background: #001b5e; color: #fff; text-shadow: none; font-weight:700; } tr.blue-bg td, tr.heading td { background: #006fbb!important; color: #fff; text-shadow: none;} /*------ #Repeatables ------*/ .disclaimer {font-size:0.85em; margin-top:-20px;} .sub-container {padding:20px;} .tablet-show {display:None;} .mobile-show {display:none;} .visible {display:block!important} .hidden {display:none!important} .bold {font-weight:600;} .center { text-align: center; } .left {text-align:left;} .right {text-align:right;} .grid-center {display: grid; justify-content: center; align-items: center;} .flex-center {justify-content: center;} .flex-start {align-content: flex-start;} /*---------- #Coloured Backgrounds -----------------*/ .background-padding {padding: 15px 30px 15px 20px;} .blue-background { background-color: #d1edfc; border-left: 10px #26a9f2 solid;} .grey-background, { background-color: #f6f6f6; border-left: 10px #b2b2b2 solid; } /*------ #Fixes ------*/ #sidebar div:first-child {margin-top:0px!important;} /*---------------------- #Sections ----------------------*/ /*------ #AnnouncementContainer ------*/ #announcement-container { width:100%; height:auto; background-color: #0F78D0; color:#fff; font-size:12px; text-align:Center;} .announcement-one {padding:3px; overflow: hidden; height: 38px; align-content:center;} /*------ #Header ------*/ /* Header Setup */ header {Width:100%; min-width: 320px; margin:auto; border:1px solid #aeaeb0; } /* Logo */ header #logo-row {height:68px; display:flex; flex-wrap: wrap; align-items: flex-start; padding: 0px 2.4% 0px 2.4%;} header #logo-row > * {box-sizing: border-box;} header #logo-row .padding-container{padding: 10px 0 10px 0%;} header #logo-row #logo {width:9%; margin:auto 0; display: grid; place-items: center; height: auto; padding: 10px; min-width: 140px;} header #logo-row #logo img{width:100%} header #logo-row #logo a {line-height: 0;} /* Phone Numbers */ header #logo-row #phone-numbers{max-width:300px;width:20.91%;height:100%;line-height:1.2em;} header #logo-row #phone-numbers .location{font-size:12px;width:100%;min-height:23px;} header #logo-row #phone-numbers .location a:link,header #logo-row #phone-numbers .location a:visited{margin-right:10px;color:#76788E;font-weight:600;display:block;float:left;text-transform:uppercase;} header #logo-row #phone-numbers .location a:active,header #logo-row #phone-numbers .location a:hover{color:#474E93;font-weight:600;} header #logo-row #phone-numbers .location a.phone:link,header #logo-row #phone-numbers .location a.phone:visited{margin-right:10px;color:#76787A;font-weight:400;display:block;float:right;} header #logo-row #phone-numbers .location a.phone:active,header #logo-row #phone-numbers .location a.phone:hover{color:#474E93;font-weight:600;} #logo-row #phone-numbers .language-marker{background-color:#e1e1e1;border-radius:2px;padding:2px 4px;font-size:8px;position:relative;top:-2px;font-weight:600;} /* Search */ #logo-row #search{margin-left:auto;width:21.91%;margin-right:20px;} #logo-row #search form {margin-bottom: 0px;} #logo-row #search input.search_box{height:100%;min-height:68px;padding:10px;background:none;margin-bottom:0;border-top:0;border-bottom:0;} .search-container {display: flex;align-items: center;overflow: hidden;height: 68px;} .search-container .icon-container { width: 50px; height: 100%; display: flex; align-items: center; justify-content: center; border-left: 1px solid #aeaeb0; /* Thin grey line on the left */ } .search-container .icon-container img { width: 20px; height: 20px; } .search_box { flex: 1; border: none; outline: none; padding: 10px; font-size: 14px; } .search_box::placeholder {color: #aaa;} .search-results {width:100%;} /*------ #Navbar ------*/ /* Navbar */ nav {width: 100%;} nav#mega-menu {height:auto; border-bottom: 1px solid #aeaeb0;} /* Menu Items */ #menu { display: flex; justify-content: space-between; /* Distributes items evenly */ align-items: center; /* Aligns items vertically */ padding: 0; margin: 0; width: 100%; height: auto; } #menu .menu-item { flex: 1; /* Each item takes up equal space */ text-align: center; /* Centers the text of each item */ list-style-type: none;} #menu .menu-item a { display: inline-block; padding: 10px 20px; text-decoration: none; font-size: 12px; text-transform: uppercase; color:#1E1E1E; } /* Customer Menu */ nav#customer-menu {text-align: right; height: 54px; display: flex; justify-content: flex-end; background: #f2f2f2; border-bottom: 1px solid #cdcdcd;} nav#customer-menu ul {margin:0; padding:0; } nav#customer-menu ul li{ list-style-type: none; display: inline-block; padding: 0px 0px; text-transform: uppercase; min-width: 95px;} nav#customer-menu ul li:last-child a, nav#customer-menu ul li#deals a{border-right:0px;} a.highlight-button:link, a.highlight-button:visited { height: 54px; font-size: 11px; text-align: center; color:#373737; display: grid; place-items: center; margin-right: -4px; padding: 0px 20px; border-right: 1px solid #aeaeb0; } a.highlight-button:active, a.highlight-button:hover {color:#17668C; background:#e1e1e1;} #deals a.highlight-button:link, #deals a.highlight-button:visited { background: #CD2027; color: #fff; min-width: 95px; height: 35px; border-radius: 20px; } a.highlight-button.special:link, a.highlight-button.special:visited { background: #1f3366; color: #fff; min-width: 95px; height: 35px; border-radius: 20px; margin: 0px 0px 0px 10px;} .special a.highlight-button:active, .special a.highlight-button:hover{background:#162249} #deals a.highlight-button:active, #deals a.highlight-button:hover {background: #17668C; } nav#customer-menu #customer-interface {position: relative; background: #F2F2F2; padding: 2px 20px; padding-right: calc(20px + 0.5%); border: 1px solid #cdcdcd; border-top: 0px; border-radius: 0 0 0px 10px; right: -3%; margin-left: -3%; min-width: 240px; height: 52px; z-index: 999; display:flex; align-items: center; /* Aligns items vertically */} #customer-interface div {padding: 0px 16px;} #customer-interface img { width: 19px; position: relative; top: 5px; padding-right:4px; } nav#customer-menu #buttons{overflow:hidden} #customer-interface, #customer-interface a {font-size:14px; color:#373737} .software-container .sub-container:hover {background:#e1e1e1;} .software-container .sub-container a:hover {font-weight:400;} /* Shopping Cart */ #cart {display: grid; place-items: center; border-left: 1px solid #aeaeb0;} /*------ #Mobile Navbar ------*/ div#mobile-nav {display:none} nav#mobile-subnav {display:none;} #menu li a{} #menu li a:hover {background:#F2F2F2; text-decoration: underline #1f3366!important; text-underline-offset: 8px;} /* Mobile Navbar */ button#hamburger-button {background:none; border:0;} /* submitted */ /* Base Styles for the Navigation */ #mobile-subnav { background-color: #fff; /* Background for the navbar */ border-bottom: 1px solid #ddd; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); top: -69px; z-index: 99999; z-index:99999; box-sizing: border-box; } #mobile-menu { list-style-type: none; margin: 0; padding: 0; } #mobile-menu li a {font-size:15px; text-transform:uppercase;} #mobile-menu:first-child {border-top: 1px solid #EBEBEB;} #mobile-menu > li { position: relative; /* Position for dropdown handling */ border-bottom: 1px solid #EBEBEB; padding:0px; } ul#mobile-menu li:nth-child(11){background: #bc3430;} ul#mobile-menu li:nth-child(11) a:hover{background: #9b1d19;} ul#mobile-menu li:nth-child(11) a{color: #fff;} /* Links Styling */ #mobile-menu a { display: block; padding: 10px 20px; font-size: 16px; color: #333; text-decoration: none; transition: background-color 0.3s ease; } #mobile-menu a:hover { background-color: #f5f5f5; /* Hover background */ color: #000; } /* Dropdown Styling */ #mobile-menu ul, #mobile-menu ul ul {margin:0;} #mobile-menu ul li, #mobile-menu ul ul li {list-style-type:none;} #mobile-menu .dropdown > a:after, #mobile-menu .dropdown ul li > a:after { content: url('/cdn/shop/files/Icon-arrow-right.svg?v=1732727664'); display: inline-block; /* Ensures the image behaves like an inline element */ width: 16px; /* Optional: set width */ height: 16px; /* Optional: set height */ float: right; font-size: 12px; margin-left: 10px; transform: rotate(0deg); transition: transform 0.3s ease; } #mobile-menu .dropdown:hover > a:after { transform: rotate(90deg); /* Rotate the arrow on hover */ } #mobile-menu .dropdown.active > a:after { transform: rotate(-90deg); /* Rotate the arrow up when clicked*/ } #mobile-menu .dropdown > ul { display: none; /* Hide dropdown by default */ position: relative; left: 0; top: 100%; background-color: #fff; width: 100%; /* Full width dropdown */ border: 1px solid #ddd; /*box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);*/ z-index: 999; padding-inline-start: 0px; } #mobile-menu .dropdown.active > ul { display: block; position: static; } /* Submenu Styling */ #mobile-menu .dropdown ul li a { padding-left: 20px; /* Indent for submenus */ font-weight: 600; border-left: 6px solid #f5f5f5; font-size: 13px; } #mobile-menu .dropdown ul ul li a { border-left: 0px; font-weight: 400; text-transform: capitalize; border-left: 6px solid #cfcfcf; } #mobile-menu .dropdown ul ul { background-color: #F8F8F8; /* Light grey background for 3rd level */ padding-inline-start: 0px; } #mobile-menu .dropdown ul ul li a { padding-left: 50px; /* Further indent for 3rd level submenu */ } /* Active Link Styling */ #mobile-menu a.active {background-color: #eaeaea;} #mobile-menu li.open ul {display:block;} /*---- #Sidebar ----*/ .sidebar.four.columns.toggle-all--false { background-color: #f5f5f5; margin-bottom: 30px;} .sidebar div { padding: 10px 20px;} .sidebar h4.toggle { color: #fff!important; background: #1f3366; width: 100%; margin: -10px 4px 8px -20px!important; padding: 10px 21px 6px 19px!important; font-size: 17px!important;} main ul.toggle_list li {font-weight:600;} main ul.toggle_list li ul li {font-weight:300} /* #Pagination */ .paginate { text-align: center; font-size: 22px; margin-bottom: 30px;} .paginate span a{ border: 1px solid #999999; padding: 5px 12px; margin: 0 -5px;} .paginate span a:hover { background-color: #f5f5f5; } span.page.current { background-color: #d3d3d3; color: #000000; border: 1px solid #999999; padding: 5px 12px; margin: 0 -5px;} span.next a, span.prev a{border:0;} /* Featured Promotions */ /* Featured Collections */ .featured_collections .thumbnail a[href] img { box-shadow: #000 0em 0em 0em; transition: opacity 0.2s linear; } .featured_collections .thumbnail:hover a[href] img { opacity: 0.8; } /* Featured Promotions */ .featured-promotions h2.title { border: 0; margin: 0; padding: 20px 0 15px 0; font-size: 22px; line-height: 1.2; } .feature-wrap { padding: 10px 20px;} .feature-section { text-align: center; float: left; margin: 0 10px 10px; position: relative; } .feature-section .description a { pointer-events: auto; } .feature-section img { width: 100%; display: block; box-shadow: #000 0em 0em 0em; } .feature-section .rounded { border-radius: 50%; max-width: 66%; margin: 0px auto; } .feature-section:hover a[href] img {opacity: 0.8;} .feature-section:hover a[href] h2.title {color: #255a90;} .promo-1 { -webkit-animation-delay: 0s; animation-delay: 0s; } .promo-2 { -webkit-animation-delay: 0.3s; animation-delay: 0.3s; } .promo-3 { -webkit-animation-delay: 0.6s; animation-delay: 0.6s; } .promo-4 { -webkit-animation-delay: 0.9s; animation-delay: 0.9s; } .promo-5 { -webkit-animation-delay: 1.2s; animation-delay: 1.2s; } .promo-6 { -webkit-animation-delay: 1.5s; animation-delay: 1.5s; } .promo-7 { -webkit-animation-delay: 1.8s; animation-delay: 1.8s; } .featured-promotions.promo-per-row-4 h2.title { font-size: 21px; line-height: 27px!important; padding: 0!important; margin: 7px 0!important; font-weight: 600; } .featured-promotions.promo-per-row-4 h2.title ul.toggle_list li {font-weight:600;} .featured-promotions.promo-per-row-4 h2.title ul.toggle_list li ul li {font-weight:300} /*---------------------- #Modules ----------------------*/ /*------ #Accordion ------*/ .accordion {outline:1px solid #878787;} .accordion-toggle { background-color:#001b5e; outline: 1px solid #001b5e; width:100%; display:block; margin:20px 0px;} .accordion-container {padding:2px 20px;} .accordion-content {margin-top:-20px; outline: 1px solid gray; margin-bottom: 20px;} .accordion-container h3 {color: #fff; font-size: 1.3em; text-transform: capitalize;} .accordion-container .accordion-title {display: table; float: left; width: 87%;} .accordion-container .accordion-icon {position:relative; right:0px; float:right;} /*------ #GreyOutlineBox ------*/ .grey-outline-box {width:100%; margin:20px auto; border: 1px solid #878787; text-align:Center;} .grey-outline-box .icon {background: #001b5e; font-size: 3.5em; padding: 12px 0px; color: #fff; margin-bottom: -20px;} .grey-outline-box h3 {text-align:center!important; font-weight:600; color:#001b5e!important; margin-bottom:0px!important;} .grey-outline-box:hover {-webkit-box-shadow: 3px 3px 7px -3px rgba(0,0,0,0.84); box-shadow: 3px 3px 7px -3px rgba(0,0,0,0.84);} /*------ #IntroSection ------*/ #intro-section {text-align:center;} #intro-section .tagline {font-size:1.5em; font-style: italic;} /*------ #SliderNav ------*/ #slider-nav ul {list-style-type: none; width: 100%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; margin-left: 0px} #slider-nav li {display: inline-block; width: 23%; margin: 5px 0.5%; background:#fff; outline:1px solid grey; padding: 10px 0px; text-indent: 10px; color:#454f5b; cursor:pointer;} #slider-nav li.yellow {border-left:5px solid #eac21f; background-image: linear-gradient(to left, transparent, transparent 50%, #eac21f 50%, #eac21f); background-position: 100% 0; background-size: 200% 100%; transition: all .25s ease-in;} #slider-nav li.red {border-left:5px solid #cb2027; background-image: linear-gradient(to left, transparent, transparent 50%, #cb2027 50%, #cb2027); background-position: 100% 0; background-size: 200% 100%; transition: all .25s ease-in;} #slider-nav li.green {border-left:5px solid #03a756; background-image: linear-gradient(to left, transparent, transparent 50%, #03a756 50%, #03a756); background-position: 100% 0; background-size: 200% 100%; transition: all .25s ease-in;} #slider-nav li.light-blue {border-left:5px solid #007bff; background-image: linear-gradient(to left, transparent, transparent 50%, #007bff 50%, #007bff); background-position: 100% 0; background-size: 200% 100%; transition: all .25s ease-in;} #slider-nav li:hover { color:#fff!important;background-position: 0 0; -webkit-box-shadow: 3px 3px 7px -3px rgba(0,0,0,0.84); box-shadow: 3px 3px 7px -3px rgba(0,0,0,0.84);} #content-slider {outline: 1px solid #454f5b;} /* ---------- #SliderQuote ----------*/ blockquote { padding: 10px 20px; border-left: 5px solid #EEE; width: 90%; padding: 30px 30px 20px 30px; margin: auto!important; } .text-center { text-align: center; } /* carousel */ #quote-carousel { padding: 0 10px 30px 10px; margin-top: 30px 0px 0px; } /* Control buttons */ #quote-carousel .carousel-control { background: none; color: #222; font-size: 2.3em; text-shadow: none; margin-top: 10%; } /* Previous button */ #quote-carousel .carousel-control.left { left: -12px; } /* Next button */ #quote-carousel .carousel-control.right { right: -12px !important; } /* Changes the position of the indicators */ #quote-carousel .carousel-indicators { right: 50%; top: auto; bottom: 0px; margin-right: -19px; } /* Changes the color of the indicators */ #quote-carousel .carousel-indicators li { background: #c0c0c0; } #quote-carousel .carousel-indicators .active { background: #333333; } #quote-carousel img { width: 250px; height: 100px } /* End carousel */ .item blockquote { border-left: none; margin: 0; } .item blockquote img { margin-bottom: 10px; } /* ---------- #Alert Box ----------*/ div.alert { padding: 10px 30px 1px 20px; margin: 20px 0; font-size: 1.05em; line-height: 2em;} div.alert-blue { background-color: #d1edfc; border-left: 10px #26a9f2 solid; } div.alert-red { background-color: #fcd1d1; border-left: 10px #f44336 solid; } /* -------- BambuWhyShop ----- */ section#choose-shop3d {margin:60px 0px 40px 0px; border-bottom:4px solid #959595; border-top:4px solid #959595;} section#choose-shop3d .logo-container { position:relative; top:-6px; width:100%; margin-bottom: -20px;} section#choose-shop3d .logo-container img {margin:auto; width:400px; position: relative; top: 50%; left: 50%; transform: translate(-50%, -50%);} section#choose-shop3d .flex{display:flex; flex-wrap: wrap;} section#choose-shop3d h2 {font-size: 22px;} section#choose-shop3d div.title {flex: 0 0 100%} section#choose-shop3d .flex > div {width:100%; margin:0 0.5% 3% 0.5%; box-sizing: border-box; border:5px solid #1F255A; border-radius:25px;overflow: hidden; } section#choose-shop3d .flex div > div{padding:10px; font-size:12px;} section#choose-shop3d .flex > div:first-child {margin:0 0.5% 3% 0} section#choose-shop3d .flex > div:last-child {margin:0 0 3% 0.5%} section#choose-shop3d .flex div .bluebg {background:#1F255A; text-align:center; } section#choose-shop3d .flex div .bluebg img {width:45px; margin:auto;} section#choose-shop3d .flex div h4 {text-align:center; font-size:12px!important; line-height: 20px !important;} section#choose-shop3d .flex div > div ul{margin:0; margin-bottom:0; margin-left:0;} /* MEDIA QUERIES */ @media (width >= 1100px) { .column-text {column-count: 2; column-gap: 1.66%; width: 100%;} .column-text-3 {column-count: 3; column-gap: 1.66%; width: 100%; } .column-text-4 {column-count: 4; column-gap: 1.66%;width: 100%; } .column-text-5 {column-count: 5; column-gap: 1.66%;width: 100%; } .column-text-6 {column-count: 6; column-gap: 1.66%;width: 100%; } .column-text-7 {column-count: 7; column-gap: 1.66%;width: 100%; } .column-text-8 {column-count: 8; column-gap: 1.66%; width: 100%;} } /* Tablet */ @media (width <= 960px) {header #logo-row #search {width: 35%;} header #logo-row #phone-numbers {width: 25%;}} @media only screen and (min-width: 900px){ section#choose-shop3d .flex > div {width:24%;} section#choose-shop3d .flex div .bluebg img {width:70px; margin:auto;} } @media (width <= 949px){ header #logo-row {height: auto; padding:0; justify-content: space-between;} header #logo-row #search {width: 100%; margin-right: 0px; border-top: 1px solid #aeaeb0; border-bottom: 1px solid #aeaeb0;} header #logo-row #search form {margin-bottom: 0px;} header #logo-row #logo {padding: 10px 2.4% 10px 2.4%;} div#mobile-nav {display: flex; align-items: center; justify-content: flex-end;padding: 10px 2.4% 10px 2.4%;} div#mobile-nav div {padding: 0 10px;} div#mobile-nav img {width: 30px; height:30px; padding:0px 5px;} div#mobile-nav #hamburger {border-left: 1px solid #aeaeb0;} div#mobile-nav .cart-num {position: relative; top: -18px; left: -4px;} /* hide navs */ header #logo-row #phone-numbers {display:none} header #buttons {display:None;} nav#mega-menu, nav#customer-menu{display:none;} } @media (width <= 408px){ #announcement-container {display:none;} header #logo-row {display:block; } header #logo-row #logo {width:100%; text-align: center; border-bottom: 1px solid #aeaeb0; background: #f5f5f5;} header #logo-row #logo img {width:50%;} div#mobile-nav {display:flex; justify-content: space-between; align-items: center;} #cart, #hamburger {border-left:0; border-right:0;} } /* Small devices (tablets, 768px and up) */ @media (min-width: 768px) { #quote-carousel { margin-bottom: 0; padding: 0 40px 30px 40px; margin-top: 30px; } } /* Small devices (tablets, up to 768px) */ @media (max-width: 768px) { /* Make the indicators larger for easier clicking with fingers/thumb on mobile */ #quote-carousel .carousel-indicators { bottom: -20px !important; } #quote-carousel .carousel-indicators li { display: inline-block; margin: 0px 5px; width: 15px; height: 15px; } #quote-carousel .carousel-indicators li.active { margin: 0px 5px; width: 20px; height: 20px; } .announcement-one{ height:auto; } } .img-circle { border-radius: 50%; } .container-fluid { margin-right: auto; margin-left: auto; padding-left: 15px; padding-right: 15px; } .row { margin-left: -15px; margin-right: -15px; } .carousel { position: relative; } .carousel-inner { position: relative; overflow: hidden; width: 100%; } .carousel-inner > .item { display: none; position: relative; -webkit-transition: 0.6s ease-in-out left; transition: 0.6s ease-in-out left; } .carousel-inner > .item > img, .carousel-inner > .item > a > img { line-height: 1; } .carousel-inner > .active, .carousel-inner > .next, .carousel-inner > .prev { display: block; } .carousel-inner > .active { left: 0; } .carousel-inner > .next, .carousel-inner > .prev { position: absolute; top: 0; width: 100%; } .carousel-inner > .next { left: 100%; } .carousel-inner > .prev { left: -100%; } .carousel-inner > .next.left, .carousel-inner > .prev.right { left: 0; } .carousel-inner > .active.left { left: -100%; } .carousel-inner > .active.right { left: 100%; } .carousel-control { position: absolute; top: 0; left: 0; bottom: 0; width: 15%; opacity: 0.5; filter: alpha(opacity=50); font-size: 20px; color: #ffffff; text-align: center; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6); } .carousel-control.left { background-image: -webkit-linear-gradient(left, color-stop(rgba(0, 0, 0, 0.5) 0%), color-stop(rgba(0, 0, 0, 0.0001) 100%)); background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1); } .carousel-control.right { left: auto; right: 0; background-image: -webkit-linear-gradient(left, color-stop(rgba(0, 0, 0, 0.0001) 0%), color-stop(rgba(0, 0, 0, 0.5) 100%)); background-image: linear-gradient(to right, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%); background-repeat: repeat-x; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1); } .carousel-control:hover, .carousel-control:focus { outline: none; color: #ffffff; text-decoration: none; opacity: 0.9; filter: alpha(opacity=90); } .carousel-control .icon-prev, .carousel-control .icon-next, .carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right { position: absolute; top: 50%; z-index: 5; display: inline-block; } .carousel-control .icon-prev, .carousel-control .glyphicon-chevron-left { left: 50%; } .carousel-control .icon-next, .carousel-control .glyphicon-chevron-right { right: 50%; } .carousel-control .icon-prev, .carousel-control .icon-next { width: 20px; height: 20px; margin-top: -10px; margin-left: -10px; } .carousel-indicators { position: absolute; bottom: 10px; left: 50%; z-index: 15; width: 60%; margin-left: -30%; padding-left: 0; list-style: none; text-align: center; } .carousel-indicators li { display: inline-block; width: 10px; height: 10px; margin: 1px; text-indent: -999px; border: 1px solid #ffffff; border-radius: 10px; cursor: pointer; background-color: #000 \9; background-color: rgba(0, 0, 0, 0); } .carousel-indicators .active { margin: 0; width: 12px; height: 12px; background-color: #ffffff; } .carousel-caption { position: absolute; left: 15%; right: 15%; bottom: 20px; z-index: 10; padding-top: 20px; padding-bottom: 20px; color: #ffffff; text-align: center; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6); } .carousel-caption .btn { text-shadow: none; } @media (min-width: 768px) { .quote-container { width: 750px; } blockquote { width: 75%;} } @media (min-width: 992px) { .quote-container { width: 970px; } } @media (min-width: 1200px) { .quote-container { width: 1170px; } } /*------ #Video Container ------*/ /* Automatically resizes video on mobile */ .video-container { position: relative; padding-bottom: 56.25%; height: 0; } .video-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } @media screen and (min-width: 768px) { .carousel-control .glyphicon-chevron-left, .carousel-control .glyphicon-chevron-right, .carousel-control .icon-prev, .carousel-control .icon-next { width: 30px; height: 30px; margin-top: -15px; margin-left: -15px; font-size: 30px; } .carousel-caption { left: 20%; right: 20%; padding-bottom: 30px; } .carousel-indicators { bottom: 20px; } } /*------ #FeaturesBox ------*/ /* Features Box */ section.features-box {border:3px solid #cccccc; border-radius: 25px; border-left: 10px solid #001b5e; -webkit-box-shadow: 9px 11px 16px -13px rgba(0,0,0,0.25); box-shadow: 9px 11px 16px -13px rgba(0,0,0,0.25);} section.features-box .container {padding:25px 20px 25px 30px; width: auto;} section.features-box h1 { color: #001b5e; font-size: 30px; font-weight: 600; text-align: left; text-transform: capitalize; line-height: initial; margin: 0px 0px 15px 0px; padding: initial; } section.features-box h2 { color: #383838; font-size: 18px; font-style: italic; text-transform: none; font-weight: normal; text-align: left; margin: 0px 0px 15px 0px; padding: initial;} section.features-box .check-list {color:#878787; font-size:16px;} .check-list ul { -moz-columns: 2; -webkit-columns: 2; columns: 2; list-style-position: inside; } section.features-box p {color:#383838; font-size:18px;} section.features-box a:link, section.features-box a:visited { color: #007bff; text-decoration: underline; text-underline-offset: 3px;} section.features-box a:active, section.features-box a:hover {color:#878787} /*Color Options: red lightblue grey */ section.features-box.red {border-left: 10px solid #cb2027;} section.features-box.red h1 { color: #cb2027;} section.features-box.lightblue {border-left: 10px solid #007bff;} section.features-box.lightblue h1 { color: #007bff;} section.features-box.grey {border-left: 10px solid #878787;} section.features-box.grey h1 { color: #878787;} /*------ # ------*/ /*---------------------- #Pages---------------------- */ /*------ #ContactUs ------*/ #phone-contact ul {list-style-type:none; margin-left: 0px;} #phone-contact ul li {display:inline-block; margin-bottom:0px;} #phone-contact ul li .disclaimer {background-color: #007bff; padding:2px 0px; color: #fff;} #live-chat {cursor:pointer} /*------ #Products ------*/ .product_image {text-align: center; height: 200px!important;} /*------ # ------*/ /*---------------------- #Inserts ---------------------- */ /*------ #Leasing ------*/ img.nli-cwb-logo { max-width: 120px; } .nli-container {width:100%} /*---------------------- #Snippets ---------------------- */ /*---------------------- #Take Action Bar (Product Pages) ---------------------- */ #take-action-bar {color:#fff; margin-bottom:-40px;} #take-action-bar .halves .block {margin: 0;} #take-action-bar h1 {color: #fff;text-align: left;text-transform: capitalize;margin-bottom: 0px;} #take-action-bar #custom-quote h1 {text-align:center;} #take-action-bar .container {padding:20px; margin:auto; width:80%; } #take-action-bar #custom-quote {background: rgb(226,42,42);background: linear-gradient(144deg, rgba(226,42,42,1) 0%, rgba(4,54,127,1) 100%);text-align:center;margin-bottom:-1px;} #take-action-bar #custom-sample {background: rgb(15,123,213);background: linear-gradient(144deg, rgba(15,123,213,1) 0%, rgba(4,54,127,1) 100%);outline:1px solid #063f8b;} #take-action-bar #speak-expert {background: rgb(10,175,101);background: linear-gradient(144deg, rgba(10,175,101,1) 0%, rgba(4,54,127,1) 100%); outline:1px solid #063f8b;} #take-action-bar a.action-button, #take-action-bar button {background: #fff;color: #043781;padding: 10px 30px;border-radius: 10px;box-shadow: 2px 2px #082453;width: auto;text-transform:capitalize;} #take-action-bar a.action-button:hover, #take-action-bar button:hover {background: #ffffff6e; color:#fff;} /*---------------------- #Newsletter Signup ---------------------- */ #NewsletterFooter {width: 100%; background: #d3d3d3 url(/cdn/shop/files/Icons_Render_collage.png?v=1629491796); background-position: 2px 208px; background-repeat: repeat; background-size: 630px; background-attachment: fixed; border-top: 3px solid #eee; border-bottom: 1px solid #eee; padding: 20px 0px 0px 0px; margin-bottom: -48px;} #newsletter-container .halves{width:80%; margin:auto;} #newsletter-container .halves .block:first-child {min-height: auto; flex: 28%!important; margin: 0 1% 20px 1%;} #newsletter-container .halves .block:last-child {min-height: auto; flex: 68%!important; margin: 0 1% 20px 1%;} #newsletter-container h1 {all: unset; text-transform:capitalize; text-align:left; font-size:1.7em; display:Block; } #newsletter-container h3 { all: unset; text-align: left; font-size: 1.25em; display: Block; margin-top: 12px; margin-bottom:20px; border-bottom: 2px solid #858585; padding-bottom: 20px;} .newsletter-image img {width: 100%; margin: -60px 0px 0px 0px} .newsletter-signup-block {background: #c4c4c487; padding: 30px; margin: auto;} .newsletter-signup-form {display: table; width: 100%; height: 99px;} /*---------------------- #FeaturedBrands ---------------------- */ #featured-brands .container .two-col img:hover, #featured-brands .container .four-col img:hover{ outline: 3px solid #707070;} /*---------------------- #BookaConsultation ---------------------- */ #book-a-consult {text-align:Center; color:#7e7e7e; font-size:18px;} #book-a-consult a:link, #book-a-consult a:visited {color:#386591; font-size:37px; text-decoration:underline} #book-a-consult a:active, #book-a-consult a:hover {color:#575757;} #book-a-consult .num {font-size:30px;} #book-a-consult .loc {font-size:16px;} /*---------------------- #PullQuote ---------------------- */ .pullquote {text-align:center; color:#7e7e7e; font-size:30px; line-height: 1.58;} .pullquote-attribution {text-align:center; color:#7e7e7e; font-size:14px; } .pull-quote-container:before { display: block; content: ""; border-top: 2px solid lightgrey; width: 50%; margin: 20px auto; transform: translateY(-15px); } .pull-quote-container:after { display: block; content: ""; border-bottom: 2px solid lightgrey; width: 50%; margin: 20px auto; transform: translateY(10px); } /*---------------------- #CostComparison ---------------------- */ .cost-comparison {background: #fff;border:0; text-shadow: none; font-size:12px; width:100%;} .cost-comparison tr, .cost-comparison td{padding-left: 0px; background:#fff; border:0; border-bottom:1px solid grey!important;} .cost-comparison tr.dark-table td{border:0; background-color:#76787a!important; color:#fff; text-align:Center; text-transform:uppercase; font-weight:600;} .cost-comparison tr.light-table td{border:0; background-color:#efefef!important; text-align:Center; text-transform:uppercase; font-weight:600;} .cost-comparison .bluebox {background:#d1edfc;} .cost-comparison tr td.right-border {border-right:1px solid grey;} .cost-comparison tr.dark-table:hover td{background: #76787a!important;} /*---------------------- #ProductPages ---------------------- */ /* Products Pages - Bottom */ section.product-contact {border:1px solid #1f3366;} section.product-contact #product-contact-title {margin-top:-22px; text-align:Center; background-color: #1f3366; background-image: linear-gradient(-44deg, #1f3366, #255a90);} section.product-contact #product-contact-title h2 {color:#fff!important; font-size: 24px; padding: 15px 0px;} /* Product Pages - Description */ .product-heading-bar {padding: 5px 15px; text-align: left; background-color: #1f3366; background-image: linear-gradient(-44deg, #1f3366, #255a90); color: #fff;} .product-description-block {padding: 15px;} .product-description-block ul li {list-style-position: outside; padding: 3px;} /* Case Studies*/ #case-study-section {position:Relative;} #case-study-section .block { background: #f7f7f7; border-radius: 25px; overflow: hidden; position:relative;} #case-study-section .block .desc {padding: 10px 20px; margin-bottom: 30px;} #case-study-section .download { position: absolute; bottom: 0; width: 100%;} #case-study-download .block img {width: 100%;} /*---------------------- #Blog ---------------------- */ h2.article_title { text-align: left; display: block; font-size: 18px; line-height: 24px !important; margin: 0!important; padding: 0!important; margin-bottom: -20px!important; } h2.article_title a:link, h2.article_title a:visited { color:#255a90; } h2.article_title a:active, h2.article_title a:hover { color:#255a90; } p.blog_meta { margin: 0; padding: 0; border-bottom: 1px solid #cfcfcf; margin-bottom: 0px; } h5.sub_title, h5.sub_title a { font-size: 17px!important; line-height: 25px!important; margin-bottom: 3px!important; } .index p.blog_meta { margin-bottom: 8px;} body.article p.blog_meta { margin-bottom: 0px; margin-top: -17px; } body.article .blog-post-section img {width:100%!important} .blog-caption { top: -38px; position: relative; text-align: right; padding: 4px 20px; background: #e6e6e6; font-size: 0.8em; } .blog #shopify-section-blog-template img { height: 125px!important; width: 100%!important; } /* Blog Image Hover */ .featured-blog-section a img:hover {opacity: 0.7; filter: alpha(opacity=70); /* For IE8 and earlier */} h4, .h4, h4.title a {border-bottom: 0px solid #aeaeb0; font-size: 20px;} /* Blog Images*/ .index img.transition-in.lazyloaded.small-auto-image,.blog img.transition-in.lazyloaded.small-auto-image {height: 200px;} .index img.transition-in.lazyautosizes.lazyloaded,.blog img.transition-in.lazyautosizes.lazyloaded {height: 200px;} img.transition-in.lazyautosizes.lazyloaded {height: auto;} img.transition-in.lazyloaded.small-auto-image {height: auto;} div.block-quote { background-color: #d1edfc; padding: 15px 30px 15px 20px; margin:20px 0px; border-left: 10px #26a9f2 solid; font-size: 1.05em; line-height: 2em; } div.grey-box {background-color: #f6f6f6; border-left: 10px #b2b2b2 solid;padding: 15px 30px 15px 20px; margin:20px 0px;font-size: 1.05em; line-height: 2em;} /* Case Study Download */ #case-study-download .block img { width: 100%; } div#case-study-download .block div.blue {background: #001a5e; padding: 20px 30px;} div#case-study-download .block div.white {padding: 20px;} #case-study-download .block .blue h1 { color: #fff; text-align: left; line-height: 1; font-size: 1.5em; padding-bottom: 20px; border-bottom: 1px solid white; } #case-study-download .block .blue h2 { color: #fff; text-align: left; line-height: 1; font-size: 1em; font-weight: 400; font-style: italic; text-transform: capitalize; margin: 0; } /*---------------------- #LandingPages ---------------------- */ /* Landing Pages */ .breakout { /*Top Image*/ margin:1em -100%; /* old browsers fallback */ margin:1em calc(50% - 50vw); background-color:rgba(255,0,255,0.5); height:220px; background-color: #cccccc; height: 450px; background-position: center; background-repeat: no-repeat; background-size: cover; position: relative;} .breakout-quote {width:50%; margin:auto; background:rgba(255, 255, 255, 0.8); text-align: center; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: white; padding:20px;} .deep-dive-padding {padding:50px} /*---------------------- #Services ---------------------- */ #services-container {background-color: #e9eff4; width:100%; clear:both; display:Table;} #services-container div {text-align:Center; color:#255a90;} #services-container div a{display:block;} #services-container div a:link, #services-container div a:visited{color:#255a90;} #services-container div a:active, #services-container div a:hover{color:#1f3366; position:relative; top: -5px;} #services-container i { font-size: 40px; padding: 10px; } .homepage_content section h3 {text-align:center;} #easyquote-status {background-color: #d1edfc;} #application .block-title {outline: 1px solid #25598f;} #application .container { outline: 1px solid #25598f; padding: 1% 10%; width: 76%; margin-top: -21px;} /*---------------------- #CollectionBanners ---------------------- */ /*Collection Banners */ #collection-banner-container { margin-top: -95px;} #collection-banner-container .thirds-container {margin-top: -11px; margin-bottom: -23px;} #collection-banner-container .card:hover {opacity: 0.8;} #collection-banner-container img {width: 100%;} /*---------------------- #Newsletter Signup ---------------------- */ /*---------------------- #Hubspot Styles ---------------------- */ .hubspot-form-container iframe {width:100%!important} .hs-form-94344410-eae1-4a68-9675-89e5a3312800_bed4dbf5-df86-4568-8f3c-5d8700dcb256 .hs-form-field label { color: #386591!important; text-transform: uppercase!important; font-size: 10px!important; } .hubspot-form-container label {font-size:10px;} /*---------------------- #MISC ---------------------- */ /* Not sure where these are located */ section#cost-comparison {width: 100%;margin: auto;overflow: auto;} #banners {margin-top: 0!important;} .embed-container { position: relative; padding-bottom: 41.25%; height: 0; overflow: hidden; max-width: 75%; margin:-38px auto 0 auto; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .sub-title {font-size:18px; font-weight:600;} .col-text {text-align:Center; font-size:14px;} .disclaimer-text {text-align:Right; font-size:10px; color:#7e7e7e; margin:-20px 0 20px 0} #potential-roi {text-align:Center; margin:35px 0px; } #potential-roi h2 {font-size:25px; margin:0!important; padding:0!important;} #potential-roi div {padding:30px 40px 10px 40px; border:1px solid grey; background:#eff7ff; } #phone-num-container {margin-top:-20px} .call-to-action-buttons {text-align:center;font-size:18px;} #call-to-action p {font-size:18px;} .additional-checkout-button+.additional-checkout-button { margin-left: 0px!important;} .container .offset-by-one {padding-left: 0px; } .shortbox {width: 50%; margin: auto;} .shortbox-left {float: left; width: 40%; padding: 0 5%;} .shortbox-right {float: left; width: 40%; padding: 0 5%;} div#shopify-section-header {width: 100%;} div.featured_content {background: #083989; padding: 14px 5px; margin-top: 0; margin-bottom: -1px; position: relative; top: 0px; width: 99vw; position: relative; margin-left: -50vw; left: 50%;} div.featured_content p {color:#fff;} .fancybox-inner .view_cart a{ padding: 10px 15px; background: #1f214a; color: #FFF; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;} .fancybox-inner .view_cart a:link,.fancybox-inner .view_cart a:visited {color:#fff;} .fancybox-inner p .action_button {display:none} @media only screen and (min-width: 958px) {.fancybox-inner p .continue_shopping {position: relative; top: 35px;}} /* ---- #Animate.css ---- *//* Animate.css - http://daneden.me/animate Licensed under the MIT license Copyright (c) 2013 Daniel Eden */.animated{-webkit-animation-duration:0.5s;animation-duration:0.5s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.animated.infinite{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.animated.hinge{-webkit-animation-duration:2s;animation-duration:2s}@-webkit-keyframes bounce{0%,100%,20%,50%,80%{-webkit-transform:translateY(0);transform:translateY(0)}40%{-webkit-transform:translateY(-30px);transform:translateY(-30px)}60%{-webkit-transform:translateY(-15px);transform:translateY(-15px)}}@keyframes bounce{0%,100%,20%,50%,80%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}40%{-webkit-transform:translateY(-30px);-ms-transform:translateY(-30px);transform:translateY(-30px)}60%{-webkit-transform:translateY(-15px);-ms-transform:translateY(-15px);transform:translateY(-15px)}}.bounce{-webkit-animation-name:bounce;animation-name:bounce}@-webkit-keyframes flash{0%,100%,50%{opacity:1}25%,75%{opacity:0}}@keyframes flash{0%,100%,50%{opacity:1}25%,75%{opacity:0}}.flash{-webkit-animation-name:flash;animation-name:flash}@-webkit-keyframes pulse{0%{-webkit-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes pulse{0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}50%{-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1)}100%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}.pulse{-webkit-animation-name:pulse;animation-name:pulse}@-webkit-keyframes rubberBand{0%{-webkit-transform:scale(1);transform:scale(1)}30%{-webkit-transform:scaleX(1.25) scaleY(0.75);transform:scaleX(1.25) scaleY(0.75)}40%{-webkit-transform:scaleX(0.75) scaleY(1.25);transform:scaleX(0.75) scaleY(1.25)}60%{-webkit-transform:scaleX(1.15) scaleY(0.85);transform:scaleX(1.15) scaleY(0.85)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes rubberBand{0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}30%{-webkit-transform:scaleX(1.25) scaleY(0.75);-ms-transform:scaleX(1.25) scaleY(0.75);transform:scaleX(1.25) scaleY(0.75)}40%{-webkit-transform:scaleX(0.75) scaleY(1.25);-ms-transform:scaleX(0.75) scaleY(1.25);transform:scaleX(0.75) scaleY(1.25)}60%{-webkit-transform:scaleX(1.15) scaleY(0.85);-ms-transform:scaleX(1.15) scaleY(0.85);transform:scaleX(1.15) scaleY(0.85)}100%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}.rubberBand{-webkit-animation-name:rubberBand;animation-name:rubberBand}@-webkit-keyframes shake{0%,100%{-webkit-transform:translateX(0);transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px);transform:translateX(10px)}}@keyframes shake{0%,100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}10%,30%,50%,70%,90%{-webkit-transform:translateX(-10px);-ms-transform:translateX(-10px);transform:translateX(-10px)}20%,40%,60%,80%{-webkit-transform:translateX(10px);-ms-transform:translateX(10px);transform:translateX(10px)}}.shake{-webkit-animation-name:shake;animation-name:shake}@-webkit-keyframes swing{20%{-webkit-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);transform:rotate(-5deg)}100%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}@keyframes swing{20%{-webkit-transform:rotate(15deg);-ms-transform:rotate(15deg);transform:rotate(15deg)}40%{-webkit-transform:rotate(-10deg);-ms-transform:rotate(-10deg);transform:rotate(-10deg)}60%{-webkit-transform:rotate(5deg);-ms-transform:rotate(5deg);transform:rotate(5deg)}80%{-webkit-transform:rotate(-5deg);-ms-transform:rotate(-5deg);transform:rotate(-5deg)}100%{-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg)}}.swing{-webkit-transform-origin:top center;-ms-transform-origin:top center;transform-origin:top center;-webkit-animation-name:swing;animation-name:swing}@-webkit-keyframes tada{0%{-webkit-transform:scale(1);transform:scale(1)}10%,20%{-webkit-transform:scale(0.9) rotate(-3deg);transform:scale(0.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg);transform:scale(1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg);transform:scale(1.1) rotate(-3deg)}100%{-webkit-transform:scale(1) rotate(0);transform:scale(1) rotate(0)}}@keyframes tada{0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}10%,20%{-webkit-transform:scale(0.9) rotate(-3deg);-ms-transform:scale(0.9) rotate(-3deg);transform:scale(0.9) rotate(-3deg)}30%,50%,70%,90%{-webkit-transform:scale(1.1) rotate(3deg);-ms-transform:scale(1.1) rotate(3deg);transform:scale(1.1) rotate(3deg)}40%,60%,80%{-webkit-transform:scale(1.1) rotate(-3deg);-ms-transform:scale(1.1) rotate(-3deg);transform:scale(1.1) rotate(-3deg)}100%{-webkit-transform:scale(1) rotate(0);-ms-transform:scale(1) rotate(0);transform:scale(1) rotate(0)}}.tada{-webkit-animation-name:tada;animation-name:tada}@-webkit-keyframes wobble{0%{-webkit-transform:translateX(0%);transform:translateX(0%)}15%{-webkit-transform:translateX(-25%) rotate(-5deg);transform:translateX(-25%) rotate(-5deg)}30%{-webkit-transform:translateX(20%) rotate(3deg);transform:translateX(20%) rotate(3deg)}45%{-webkit-transform:translateX(-15%) rotate(-3deg);transform:translateX(-15%) rotate(-3deg)}60%{-webkit-transform:translateX(10%) rotate(2deg);transform:translateX(10%) rotate(2deg)}75%{-webkit-transform:translateX(-5%) rotate(-1deg);transform:translateX(-5%) rotate(-1deg)}100%{-webkit-transform:translateX(0%);transform:translateX(0%)}}@keyframes wobble{0%{-webkit-transform:translateX(0%);-ms-transform:translateX(0%);transform:translateX(0%)}15%{-webkit-transform:translateX(-25%) rotate(-5deg);-ms-transform:translateX(-25%) rotate(-5deg);transform:translateX(-25%) rotate(-5deg)}30%{-webkit-transform:translateX(20%) rotate(3deg);-ms-transform:translateX(20%) rotate(3deg);transform:translateX(20%) rotate(3deg)}45%{-webkit-transform:translateX(-15%) rotate(-3deg);-ms-transform:translateX(-15%) rotate(-3deg);transform:translateX(-15%) rotate(-3deg)}60%{-webkit-transform:translateX(10%) rotate(2deg);-ms-transform:translateX(10%) rotate(2deg);transform:translateX(10%) rotate(2deg)}75%{-webkit-transform:translateX(-5%) rotate(-1deg);-ms-transform:translateX(-5%) rotate(-1deg);transform:translateX(-5%) rotate(-1deg)}100%{-webkit-transform:translateX(0%);-ms-transform:translateX(0%);transform:translateX(0%)}}.wobble{-webkit-animation-name:wobble;animation-name:wobble}@-webkit-keyframes bounceIn{0%{opacity:0;-webkit-transform:scale(.3);transform:scale(.3)}50%{opacity:1;-webkit-transform:scale(1.05);transform:scale(1.05)}70%{-webkit-transform:scale(.9);transform:scale(.9)}100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}}@keyframes bounceIn{0%{opacity:0;-webkit-transform:scale(.3);-ms-transform:scale(.3);transform:scale(.3)}50%{opacity:1;-webkit-transform:scale(1.05);-ms-transform:scale(1.05);transform:scale(1.05)}70%{-webkit-transform:scale(.9);-ms-transform:scale(.9);transform:scale(.9)}100%{opacity:1;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}}.bounceIn{-webkit-animation-name:bounceIn;animation-name:bounceIn}@-webkit-keyframes bounceInDown{0%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}60%{opacity:1;-webkit-transform:translateY(30px);transform:translateY(30px)}80%{-webkit-transform:translateY(-10px);transform:translateY(-10px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes bounceInDown{0%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}60%{opacity:1;-webkit-transform:translateY(30px);-ms-transform:translateY(30px);transform:translateY(30px)}80%{-webkit-transform:translateY(-10px);-ms-transform:translateY(-10px);transform:translateY(-10px)}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.bounceInDown{-webkit-animation-name:bounceInDown;animation-name:bounceInDown}@-webkit-keyframes bounceInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}60%{opacity:1;-webkit-transform:translateX(30px);transform:translateX(30px)}80%{-webkit-transform:translateX(-10px);transform:translateX(-10px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes bounceInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}60%{opacity:1;-webkit-transform:translateX(30px);-ms-transform:translateX(30px);transform:translateX(30px)}80%{-webkit-transform:translateX(-10px);-ms-transform:translateX(-10px);transform:translateX(-10px)}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.bounceInLeft{-webkit-animation-name:bounceInLeft;animation-name:bounceInLeft}@-webkit-keyframes bounceInRight{0%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}60%{opacity:1;-webkit-transform:translateX(-30px);transform:translateX(-30px)}80%{-webkit-transform:translateX(10px);transform:translateX(10px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes bounceInRight{0%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}60%{opacity:1;-webkit-transform:translateX(-30px);-ms-transform:translateX(-30px);transform:translateX(-30px)}80%{-webkit-transform:translateX(10px);-ms-transform:translateX(10px);transform:translateX(10px)}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.bounceInRight{-webkit-animation-name:bounceInRight;animation-name:bounceInRight}@-webkit-keyframes bounceInUp{0%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}60%{opacity:1;-webkit-transform:translateY(-30px);transform:translateY(-30px)}80%{-webkit-transform:translateY(10px);transform:translateY(10px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes bounceInUp{0%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}60%{opacity:1;-webkit-transform:translateY(-30px);-ms-transform:translateY(-30px);transform:translateY(-30px)}80%{-webkit-transform:translateY(10px);-ms-transform:translateY(10px);transform:translateY(10px)}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.bounceInUp{-webkit-animation-name:bounceInUp;animation-name:bounceInUp}@-webkit-keyframes bounceOut{0%{-webkit-transform:scale(1);transform:scale(1)}25%{-webkit-transform:scale(.95);transform:scale(.95)}50%{opacity:1;-webkit-transform:scale(1.1);transform:scale(1.1)}100%{opacity:0;-webkit-transform:scale(.3);transform:scale(.3)}}@keyframes bounceOut{0%{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}25%{-webkit-transform:scale(.95);-ms-transform:scale(.95);transform:scale(.95)}50%{opacity:1;-webkit-transform:scale(1.1);-ms-transform:scale(1.1);transform:scale(1.1)}100%{opacity:0;-webkit-transform:scale(.3);-ms-transform:scale(.3);transform:scale(.3)}}.bounceOut{-webkit-animation-name:bounceOut;animation-name:bounceOut}@-webkit-keyframes bounceOutDown{0%{-webkit-transform:translateY(0);transform:translateY(0)}20%{opacity:1;-webkit-transform:translateY(-20px);transform:translateY(-20px)}100%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}}@keyframes bounceOutDown{0%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}20%{opacity:1;-webkit-transform:translateY(-20px);-ms-transform:translateY(-20px);transform:translateY(-20px)}100%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}}.bounceOutDown{-webkit-animation-name:bounceOutDown;animation-name:bounceOutDown}@-webkit-keyframes bounceOutLeft{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{opacity:1;-webkit-transform:translateX(20px);transform:translateX(20px)}100%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}}@keyframes bounceOutLeft{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}20%{opacity:1;-webkit-transform:translateX(20px);-ms-transform:translateX(20px);transform:translateX(20px)}100%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}}.bounceOutLeft{-webkit-animation-name:bounceOutLeft;animation-name:bounceOutLeft}@-webkit-keyframes bounceOutRight{0%{-webkit-transform:translateX(0);transform:translateX(0)}20%{opacity:1;-webkit-transform:translateX(-20px);transform:translateX(-20px)}100%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}}@keyframes bounceOutRight{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}20%{opacity:1;-webkit-transform:translateX(-20px);-ms-transform:translateX(-20px);transform:translateX(-20px)}100%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}}.bounceOutRight{-webkit-animation-name:bounceOutRight;animation-name:bounceOutRight}@-webkit-keyframes bounceOutUp{0%{-webkit-transform:translateY(0);transform:translateY(0)}20%{opacity:1;-webkit-transform:translateY(20px);transform:translateY(20px)}100%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}}@keyframes bounceOutUp{0%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}20%{opacity:1;-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px)}100%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}}.bounceOutUp{-webkit-animation-name:bounceOutUp;animation-name:bounceOutUp}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.fadeIn{-webkit-animation-name:fadeIn;animation-name:fadeIn}@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translateY(-20px);transform:translateY(-20px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;-webkit-transform:translateY(-20px);-ms-transform:translateY(-20px);transform:translateY(-20px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.fadeInDown{-webkit-animation-name:fadeInDown;animation-name:fadeInDown}@-webkit-keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeInDownBig{0%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.fadeInDownBig{-webkit-animation-name:fadeInDownBig;animation-name:fadeInDownBig}@-webkit-keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translateX(-20px);transform:translateX(-20px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes fadeInLeft{0%{opacity:0;-webkit-transform:translateX(-20px);-ms-transform:translateX(-20px);transform:translateX(-20px)}100%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.fadeInLeft{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}@-webkit-keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes fadeInLeftBig{0%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}100%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.fadeInLeftBig{-webkit-animation-name:fadeInLeftBig;animation-name:fadeInLeftBig}@-webkit-keyframes fadeInRight{0%{opacity:0;-webkit-transform:translateX(20px);transform:translateX(20px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes fadeInRight{0%{opacity:0;-webkit-transform:translateX(20px);-ms-transform:translateX(20px);transform:translateX(20px)}100%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.fadeInRight{-webkit-animation-name:fadeInRight;animation-name:fadeInRight}@-webkit-keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}100%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes fadeInRightBig{0%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}100%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.fadeInRightBig{-webkit-animation-name:fadeInRightBig;animation-name:fadeInRightBig}@-webkit-keyframes fadeInUp{0%{opacity:0;-webkit-transform:translateY(20px);transform:translateY(20px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.fadeInUp{-webkit-animation-name:fadeInUp;animation-name:fadeInUp}@-webkit-keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes fadeInUpBig{0%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.fadeInUpBig{-webkit-animation-name:fadeInUpBig;animation-name:fadeInUpBig}@-webkit-keyframes fadeOut{0%{opacity:1}100%{opacity:0}}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut}@-webkit-keyframes fadeOutDown{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(20px);transform:translateY(20px)}}@keyframes fadeOutDown{0%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px)}}.fadeOutDown{-webkit-animation-name:fadeOutDown;animation-name:fadeOutDown}@-webkit-keyframes fadeOutDownBig{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}}@keyframes fadeOutDownBig{0%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}}.fadeOutDownBig{-webkit-animation-name:fadeOutDownBig;animation-name:fadeOutDownBig}@-webkit-keyframes fadeOutLeft{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-20px);transform:translateX(-20px)}}@keyframes fadeOutLeft{0%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-20px);-ms-transform:translateX(-20px);transform:translateX(-20px)}}.fadeOutLeft{-webkit-animation-name:fadeOutLeft;animation-name:fadeOutLeft}@-webkit-keyframes fadeOutLeftBig{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}}@keyframes fadeOutLeftBig{0%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}}.fadeOutLeftBig{-webkit-animation-name:fadeOutLeftBig;animation-name:fadeOutLeftBig}@-webkit-keyframes fadeOutRight{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(20px);transform:translateX(20px)}}@keyframes fadeOutRight{0%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(20px);-ms-transform:translateX(20px);transform:translateX(20px)}}.fadeOutRight{-webkit-animation-name:fadeOutRight;animation-name:fadeOutRight}@-webkit-keyframes fadeOutRightBig{0%{opacity:1;-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}}@keyframes fadeOutRightBig{0%{opacity:1;-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}}.fadeOutRightBig{-webkit-animation-name:fadeOutRightBig;animation-name:fadeOutRightBig}@-webkit-keyframes fadeOutUp{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-20px);transform:translateY(-20px)}}@keyframes fadeOutUp{0%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-20px);-ms-transform:translateY(-20px);transform:translateY(-20px)}}.fadeOutUp{-webkit-animation-name:fadeOutUp;animation-name:fadeOutUp}@-webkit-keyframes fadeOutUpBig{0%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}}@keyframes fadeOutUpBig{0%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}}.fadeOutUpBig{-webkit-animation-name:fadeOutUpBig;animation-name:fadeOutUpBig}@-webkit-keyframes flip{0%{-webkit-transform:perspective(400px) translateZ(0) rotateY(-360deg) scale(1);transform:perspective(400px) translateZ(0) rotateY(-360deg) scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(-190deg) scale(1);transform:perspective(400px) translateZ(150px) rotateY(-190deg) scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(-170deg) scale(1);transform:perspective(400px) translateZ(150px) rotateY(-170deg) scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) translateZ(0) rotateY(0deg) scale(.95);transform:perspective(400px) translateZ(0) rotateY(0deg) scale(.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:perspective(400px) translateZ(0) rotateY(0deg) scale(1);transform:perspective(400px) translateZ(0) rotateY(0deg) scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}@keyframes flip{0%{-webkit-transform:perspective(400px) translateZ(0) rotateY(-360deg) scale(1);-ms-transform:perspective(400px) translateZ(0) rotateY(-360deg) scale(1);transform:perspective(400px) translateZ(0) rotateY(-360deg) scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}40%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(-190deg) scale(1);-ms-transform:perspective(400px) translateZ(150px) rotateY(-190deg) scale(1);transform:perspective(400px) translateZ(150px) rotateY(-190deg) scale(1);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}50%{-webkit-transform:perspective(400px) translateZ(150px) rotateY(-170deg) scale(1);-ms-transform:perspective(400px) translateZ(150px) rotateY(-170deg) scale(1);transform:perspective(400px) translateZ(150px) rotateY(-170deg) scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}80%{-webkit-transform:perspective(400px) translateZ(0) rotateY(0deg) scale(.95);-ms-transform:perspective(400px) translateZ(0) rotateY(0deg) scale(.95);transform:perspective(400px) translateZ(0) rotateY(0deg) scale(.95);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}100%{-webkit-transform:perspective(400px) translateZ(0) rotateY(0deg) scale(1);-ms-transform:perspective(400px) translateZ(0) rotateY(0deg) scale(1);transform:perspective(400px) translateZ(0) rotateY(0deg) scale(1);-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}}.animated.flip{-webkit-backface-visibility:visible;-ms-backface-visibility:visible;backface-visibility:visible;-webkit-animation-name:flip;animation-name:flip}@-webkit-keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateX(-10deg);transform:perspective(400px) rotateX(-10deg)}70%{-webkit-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg)}100%{-webkit-transform:perspective(400px) rotateX(0deg);transform:perspective(400px) rotateX(0deg);opacity:1}}@keyframes flipInX{0%{-webkit-transform:perspective(400px) rotateX(90deg);-ms-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateX(-10deg);-ms-transform:perspective(400px) rotateX(-10deg);transform:perspective(400px) rotateX(-10deg)}70%{-webkit-transform:perspective(400px) rotateX(10deg);-ms-transform:perspective(400px) rotateX(10deg);transform:perspective(400px) rotateX(10deg)}100%{-webkit-transform:perspective(400px) rotateX(0deg);-ms-transform:perspective(400px) rotateX(0deg);transform:perspective(400px) rotateX(0deg);opacity:1}}.flipInX{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInX;animation-name:flipInX}@-webkit-keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateY(-10deg);transform:perspective(400px) rotateY(-10deg)}70%{-webkit-transform:perspective(400px) rotateY(10deg);transform:perspective(400px) rotateY(10deg)}100%{-webkit-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);opacity:1}}@keyframes flipInY{0%{-webkit-transform:perspective(400px) rotateY(90deg);-ms-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}40%{-webkit-transform:perspective(400px) rotateY(-10deg);-ms-transform:perspective(400px) rotateY(-10deg);transform:perspective(400px) rotateY(-10deg)}70%{-webkit-transform:perspective(400px) rotateY(10deg);-ms-transform:perspective(400px) rotateY(10deg);transform:perspective(400px) rotateY(10deg)}100%{-webkit-transform:perspective(400px) rotateY(0deg);-ms-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);opacity:1}}.flipInY{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipInY;animation-name:flipInY}@-webkit-keyframes flipOutX{0%{-webkit-transform:perspective(400px) rotateX(0deg);transform:perspective(400px) rotateX(0deg);opacity:1}100%{-webkit-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}}@keyframes flipOutX{0%{-webkit-transform:perspective(400px) rotateX(0deg);-ms-transform:perspective(400px) rotateX(0deg);transform:perspective(400px) rotateX(0deg);opacity:1}100%{-webkit-transform:perspective(400px) rotateX(90deg);-ms-transform:perspective(400px) rotateX(90deg);transform:perspective(400px) rotateX(90deg);opacity:0}}.flipOutX{-webkit-animation-name:flipOutX;animation-name:flipOutX;-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important}@-webkit-keyframes flipOutY{0%{-webkit-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);opacity:1}100%{-webkit-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}}@keyframes flipOutY{0%{-webkit-transform:perspective(400px) rotateY(0deg);-ms-transform:perspective(400px) rotateY(0deg);transform:perspective(400px) rotateY(0deg);opacity:1}100%{-webkit-transform:perspective(400px) rotateY(90deg);-ms-transform:perspective(400px) rotateY(90deg);transform:perspective(400px) rotateY(90deg);opacity:0}}.flipOutY{-webkit-backface-visibility:visible!important;-ms-backface-visibility:visible!important;backface-visibility:visible!important;-webkit-animation-name:flipOutY;animation-name:flipOutY}@-webkit-keyframes lightSpeedIn{0%{-webkit-transform:translateX(100%) skewX(-30deg);transform:translateX(100%) skewX(-30deg);opacity:0}60%{-webkit-transform:translateX(-20%) skewX(30deg);transform:translateX(-20%) skewX(30deg);opacity:1}80%{-webkit-transform:translateX(0%) skewX(-15deg);transform:translateX(0%) skewX(-15deg);opacity:1}100%{-webkit-transform:translateX(0%) skewX(0deg);transform:translateX(0%) skewX(0deg);opacity:1}}@keyframes lightSpeedIn{0%{-webkit-transform:translateX(100%) skewX(-30deg);-ms-transform:translateX(100%) skewX(-30deg);transform:translateX(100%) skewX(-30deg);opacity:0}60%{-webkit-transform:translateX(-20%) skewX(30deg);-ms-transform:translateX(-20%) skewX(30deg);transform:translateX(-20%) skewX(30deg);opacity:1}80%{-webkit-transform:translateX(0%) skewX(-15deg);-ms-transform:translateX(0%) skewX(-15deg);transform:translateX(0%) skewX(-15deg);opacity:1}100%{-webkit-transform:translateX(0%) skewX(0deg);-ms-transform:translateX(0%) skewX(0deg);transform:translateX(0%) skewX(0deg);opacity:1}}.lightSpeedIn{-webkit-animation-name:lightSpeedIn;animation-name:lightSpeedIn;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}@-webkit-keyframes lightSpeedOut{0%{-webkit-transform:translateX(0%) skewX(0deg);transform:translateX(0%) skewX(0deg);opacity:1}100%{-webkit-transform:translateX(100%) skewX(-30deg);transform:translateX(100%) skewX(-30deg);opacity:0}}@keyframes lightSpeedOut{0%{-webkit-transform:translateX(0%) skewX(0deg);-ms-transform:translateX(0%) skewX(0deg);transform:translateX(0%) skewX(0deg);opacity:1}100%{-webkit-transform:translateX(100%) skewX(-30deg);-ms-transform:translateX(100%) skewX(-30deg);transform:translateX(100%) skewX(-30deg);opacity:0}}.lightSpeedOut{-webkit-animation-name:lightSpeedOut;animation-name:lightSpeedOut;-webkit-animation-timing-function:ease-in;animation-timing-function:ease-in}@-webkit-keyframes rotateIn{0%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(-200deg);transform:rotate(-200deg);opacity:0}100%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateIn{0%{-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(-200deg);-ms-transform:rotate(-200deg);transform:rotate(-200deg);opacity:0}100%{-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateIn{-webkit-animation-name:rotateIn;animation-name:rotateIn}@-webkit-keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateInDownLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateInDownLeft{-webkit-animation-name:rotateInDownLeft;animation-name:rotateInDownLeft}@-webkit-keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateInDownRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateInDownRight{-webkit-animation-name:rotateInDownRight;animation-name:rotateInDownRight}@-webkit-keyframes rotateInUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateInUpLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);opacity:0}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateInUpLeft{-webkit-animation-name:rotateInUpLeft;animation-name:rotateInUpLeft}@-webkit-keyframes rotateInUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}}@keyframes rotateInUpRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}}.rotateInUpRight{-webkit-animation-name:rotateInUpRight;animation-name:rotateInUpRight}@-webkit-keyframes rotateOut{0%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(200deg);transform:rotate(200deg);opacity:0}}@keyframes rotateOut{0%{-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:center center;-ms-transform-origin:center center;transform-origin:center center;-webkit-transform:rotate(200deg);-ms-transform:rotate(200deg);transform:rotate(200deg);opacity:0}}.rotateOut{-webkit-animation-name:rotateOut;animation-name:rotateOut}@-webkit-keyframes rotateOutDownLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}@keyframes rotateOutDownLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}.rotateOutDownLeft{-webkit-animation-name:rotateOutDownLeft;animation-name:rotateOutDownLeft}@-webkit-keyframes rotateOutDownRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}}@keyframes rotateOutDownRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}}.rotateOutDownRight{-webkit-animation-name:rotateOutDownRight;animation-name:rotateOutDownRight}@-webkit-keyframes rotateOutUpLeft{0%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}}@keyframes rotateOutUpLeft{0%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:left bottom;-ms-transform-origin:left bottom;transform-origin:left bottom;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);opacity:0}}.rotateOutUpLeft{-webkit-animation-name:rotateOutUpLeft;animation-name:rotateOutUpLeft}@-webkit-keyframes rotateOutUpRight{0%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}@keyframes rotateOutUpRight{0%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);opacity:1}100%{-webkit-transform-origin:right bottom;-ms-transform-origin:right bottom;transform-origin:right bottom;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);opacity:0}}.rotateOutUpRight{-webkit-animation-name:rotateOutUpRight;animation-name:rotateOutUpRight}@-webkit-keyframes slideInDown{0%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}100%{-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes slideInDown{0%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}100%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.slideInDown{-webkit-animation-name:slideInDown;animation-name:slideInDown}@-webkit-keyframes slideInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes slideInLeft{0%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.slideInLeft{-webkit-animation-name:slideInLeft;animation-name:slideInLeft}@-webkit-keyframes slideInRight{0%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}100%{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes slideInRight{0%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}100%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}}.slideInRight{-webkit-animation-name:slideInRight;animation-name:slideInRight}@-webkit-keyframes slideOutLeft{0%{-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-2000px);transform:translateX(-2000px)}}@keyframes slideOutLeft{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(-2000px);-ms-transform:translateX(-2000px);transform:translateX(-2000px)}}.slideOutLeft{-webkit-animation-name:slideOutLeft;animation-name:slideOutLeft}@-webkit-keyframes slideOutRight{0%{-webkit-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(2000px);transform:translateX(2000px)}}@keyframes slideOutRight{0%{-webkit-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0)}100%{opacity:0;-webkit-transform:translateX(2000px);-ms-transform:translateX(2000px);transform:translateX(2000px)}}.slideOutRight{-webkit-animation-name:slideOutRight;animation-name:slideOutRight}@-webkit-keyframes slideOutUp{0%{-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-2000px);transform:translateY(-2000px)}}@keyframes slideOutUp{0%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(-2000px);-ms-transform:translateY(-2000px);transform:translateY(-2000px)}}.slideOutUp{-webkit-animation-name:slideOutUp;animation-name:slideOutUp}@-webkit-keyframes slideInUp{0%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes slideInUp{0%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}}.slideInUp{-webkit-animation-name:slideInUp;animation-name:slideInUp}@-webkit-keyframes slideOutDown{0%{-webkit-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(2000px);transform:translateY(2000px)}}@keyframes slideOutDown{0%{-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}100%{opacity:0;-webkit-transform:translateY(2000px);-ms-transform:translateY(2000px);transform:translateY(2000px)}}.slideOutDown{-webkit-animation-name:slideOutDown;animation-name:slideOutDown}@-webkit-keyframes hinge{0%{-webkit-transform:rotate(0);transform:rotate(0);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate(80deg);transform:rotate(80deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%{-webkit-transform:rotate(60deg);transform:rotate(60deg);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}80%{-webkit-transform:rotate(60deg) translateY(0);transform:rotate(60deg) translateY(0);-webkit-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}100%{-webkit-transform:translateY(700px);transform:translateY(700px);opacity:0}}@keyframes hinge{0%{-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}20%,60%{-webkit-transform:rotate(80deg);-ms-transform:rotate(80deg);transform:rotate(80deg);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}40%{-webkit-transform:rotate(60deg);-ms-transform:rotate(60deg);transform:rotate(60deg);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}80%{-webkit-transform:rotate(60deg) translateY(0);-ms-transform:rotate(60deg) translateY(0);transform:rotate(60deg) translateY(0);-webkit-transform-origin:top left;-ms-transform-origin:top left;transform-origin:top left;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;opacity:1}100%{-webkit-transform:translateY(700px);-ms-transform:translateY(700px);transform:translateY(700px);opacity:0}}.hinge{-webkit-animation-name:hinge;animation-name:hinge}@-webkit-keyframes rollIn{0%{opacity:0;-webkit-transform:translateX(-100%) rotate(-120deg);transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}}@keyframes rollIn{0%{opacity:0;-webkit-transform:translateX(-100%) rotate(-120deg);-ms-transform:translateX(-100%) rotate(-120deg);transform:translateX(-100%) rotate(-120deg)}100%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);-ms-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}}.rollIn{-webkit-animation-name:rollIn;animation-name:rollIn}@-webkit-keyframes rollOut{0%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}100%{opacity:0;-webkit-transform:translateX(100%) rotate(120deg);transform:translateX(100%) rotate(120deg)}}@keyframes rollOut{0%{opacity:1;-webkit-transform:translateX(0px) rotate(0deg);-ms-transform:translateX(0px) rotate(0deg);transform:translateX(0px) rotate(0deg)}100%{opacity:0;-webkit-transform:translateX(100%) rotate(120deg);-ms-transform:translateX(100%) rotate(120deg);transform:translateX(100%) rotate(120deg)}}.rollOut{-webkit-animation-name:rollOut;animation-name:rollOut}@-webkit-keyframes zoomIn{0%{opacity:0;-webkit-transform:scale(.3);transform:scale(.3)}50%{opacity:1}}@keyframes zoomIn{0%{opacity:0;-webkit-transform:scale(.3);-ms-transform:scale(.3);transform:scale(.3)}50%{opacity:1}}.zoomIn{-webkit-animation-name:zoomIn;animation-name:zoomIn}@-webkit-keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes zoomInDown{0%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);-ms-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(60px);-ms-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.zoomInDown{-webkit-animation-name:zoomInDown;animation-name:zoomInDown}@-webkit-keyframes zoomInLeft{0%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(48px);transform:scale(.475) translateX(48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes zoomInLeft{0%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);-ms-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(48px);-ms-transform:scale(.475) translateX(48px);transform:scale(.475) translateX(48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.zoomInLeft{-webkit-animation-name:zoomInLeft;animation-name:zoomInLeft}@-webkit-keyframes zoomInRight{0%{opacity:0;-webkit-transform:scale(.1) translateX(2000px);transform:scale(.1) translateX(2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(-48px);transform:scale(.475) translateX(-48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes zoomInRight{0%{opacity:0;-webkit-transform:scale(.1) translateX(2000px);-ms-transform:scale(.1) translateX(2000px);transform:scale(.1) translateX(2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateX(-48px);-ms-transform:scale(.475) translateX(-48px);transform:scale(.475) translateX(-48px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.zoomInRight{-webkit-animation-name:zoomInRight;animation-name:zoomInRight}@-webkit-keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale(.1) translateY(2000px);transform:scale(.1) translateY(2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(-60px);transform:scale(.475) translateY(-60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}@keyframes zoomInUp{0%{opacity:0;-webkit-transform:scale(.1) translateY(2000px);-ms-transform:scale(.1) translateY(2000px);transform:scale(.1) translateY(2000px);-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out}60%{opacity:1;-webkit-transform:scale(.475) translateY(-60px);-ms-transform:scale(.475) translateY(-60px);transform:scale(.475) translateY(-60px);-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}}.zoomInUp{-webkit-animation-name:zoomInUp;animation-name:zoomInUp}@-webkit-keyframes zoomOut{0%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}50%{opacity:0;-webkit-transform:scale(.3);transform:scale(.3)}100%{opacity:0}}@keyframes zoomOut{0%{opacity:1;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}50%{opacity:0;-webkit-transform:scale(.3);-ms-transform:scale(.3);transform:scale(.3)}100%{opacity:0}}.zoomOut{-webkit-animation-name:zoomOut;animation-name:zoomOut}@-webkit-keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale(.475) translateY(-60px);transform:scale(.475) translateY(-60px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateY(2000px);transform:scale(.1) translateY(2000px);-webkit-transform-origin:center bottom;transform-origin:center bottom}}@keyframes zoomOutDown{40%{opacity:1;-webkit-transform:scale(.475) translateY(-60px);-ms-transform:scale(.475) translateY(-60px);transform:scale(.475) translateY(-60px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateY(2000px);-ms-transform:scale(.1) translateY(2000px);transform:scale(.1) translateY(2000px);-webkit-transform-origin:center bottom;-ms-transform-origin:center bottom;transform-origin:center bottom}}.zoomOutDown{-webkit-animation-name:zoomOutDown;animation-name:zoomOutDown}@-webkit-keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale(.475) translateX(42px);transform:scale(.475) translateX(42px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-transform-origin:left center;transform-origin:left center}}@keyframes zoomOutLeft{40%{opacity:1;-webkit-transform:scale(.475) translateX(42px);-ms-transform:scale(.475) translateX(42px);transform:scale(.475) translateX(42px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateX(-2000px);-ms-transform:scale(.1) translateX(-2000px);transform:scale(.1) translateX(-2000px);-webkit-transform-origin:left center;-ms-transform-origin:left center;transform-origin:left center}}.zoomOutLeft{-webkit-animation-name:zoomOutLeft;animation-name:zoomOutLeft}@-webkit-keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale(.475) translateX(-42px);transform:scale(.475) translateX(-42px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateX(2000px);transform:scale(.1) translateX(2000px);-webkit-transform-origin:right center;transform-origin:right center}}@keyframes zoomOutRight{40%{opacity:1;-webkit-transform:scale(.475) translateX(-42px);-ms-transform:scale(.475) translateX(-42px);transform:scale(.475) translateX(-42px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateX(2000px);-ms-transform:scale(.1) translateX(2000px);transform:scale(.1) translateX(2000px);-webkit-transform-origin:right center;-ms-transform-origin:right center;transform-origin:right center}}.zoomOutRight{-webkit-animation-name:zoomOutRight;animation-name:zoomOutRight}@-webkit-keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-transform-origin:center top;transform-origin:center top}}@keyframes zoomOutUp{40%{opacity:1;-webkit-transform:scale(.475) translateY(60px);-ms-transform:scale(.475) translateY(60px);transform:scale(.475) translateY(60px);-webkit-animation-timing-function:linear;animation-timing-function:linear}100%{opacity:0;-webkit-transform:scale(.1) translateY(-2000px);-ms-transform:scale(.1) translateY(-2000px);transform:scale(.1) translateY(-2000px);-webkit-transform-origin:center top;-ms-transform-origin:center top;transform-origin:center top}}.zoomOutUp{-webkit-animation-name:zoomOutUp;animation-name:zoomOutUp} /* ---- #Hide Recaptcha ---- */ .grecaptcha-badge {display:None;} /*---------------------- #Footer ----------------------*/ footer h6 {color:#fff; text-transform:capitalize;} div.shopify-section.footer-section { margin-top: 40px!important;} /*---------------------- #MobileStyles---------------------- */ /*------ #Desktop ------*/ /*------ #Tablet ------*/ @media only screen and (max-width: 767px) { #sidebar {margin-top: 30px; width: 100%;} /* Full Width Sidebar */ } @media only screen and (max-width: 500px) { .container .one.column, .container .two.columns, .container .three.columns, .container .four.columns, .container .five.columns, .container .six.columns, .container .seven.columns, .container .eight.columns, .container .nine.columns, .container .ten.columns, .container .eleven.columns, .container .twelve.columns, .container .thirteen.columns, .container .fourteen.columns, .container .fifteen.columns, .container .sixteen.columns, .container .one-third.column, .container .two-thirds.column, .container .one-fifth.column { width: 100%; } .one-half-first, .one-half-last, .one-third-first, .one-third-middle, .one-third-last, .two-thirds-first, .two-thirds-last {width:100%; padding:2% 0% 2% 0%; float:clear;} .shortbox {width: 100%; margin: auto;} .shortbox-left {float: none; width: 70%; padding: 0 0% 2% 0%; margin:auto;} .shortbox-right {float: none; width: 70%; padding: 0%; margin:auto;} .featured_content strong:after { content: ' '; display: block;} .threecol-left { width: 100%; padding:0px; float: none; border-bottom: 1px dashed grey;margin: 0 0 10px 0;} .threecol-center { width: 100%; padding:0px; float: none; border-bottom: 1px dashed grey;margin: 20px 0 10px 0;} .threecol-right { width: 100%; padding:0px; float: none; border-bottom: 1px dashed grey; margin: 20px 0 10px 0;} .twocol-left {width: 100%; padding:0px; float: none; margin: 0 0 10px 0;} .twocol-right {width: 100%; padding:0px; float: none; margin: 20px 0 10px 0;} ul { margin: 0% 2% 0% 6%;} .slicknav_btn { font-size: 1.25em!important; padding-top: 8px!important; padding-bottom: 8px; background: #f5f5f5; margin-bottom: 10px;} .slicknav_collapsed {} .icon-right-arrow {font-size: 1.2em;} .icon-right-arrow:before {content: '\e813';} .icon-down-arrow:before {content: '\e813';} .sidebar h4 {margin-bottom: -10px;} .header-logo.logo a { max-width:400px!important; position: relative; top: -40px;} .header_icons { position: relative; top: 150px;} .mobile-hidden {display:none;} .homepage_content p {display:none;} #instafeed img, #instafeed video {width:100%;} } @media only screen and (max-width: 550px) { .mobile-hide, .mobile-hidden {display:none;} .mobile-show {display:block;} /* Slider */ #slider-nav li {width: 46%;} #mlb2-4584265.ml-form-embedContainer .ml-form-embedWrapper.embedForm { width: 90%!important; max-width: 600px!important;} } @media screen and (max-width: 480px) { .one-half-first, .one-half-last, .one-third-first,.one-third-middle,.one-third-last, .two-thirds-first,.two-thirds-last { width: 100%; clear: both; float: none; margin:20px 0;} .two-col { width: 100%; clear: both; float: none; margin:20px 0;} .three-col, .four-col, .five-col { width: 50%; padding:0%!important; float: left; margin:20px 0;} #featured-brands .container .two-col img:hover, #featured-brands .container .four-col img:hover{ outline: 0px; opacity:0.5px;} div#shop-logo { padding: 0px 0px 10px 0;} .login-label, .cart-num { font-size: 20px; font-weight: 200; position: relative; top: -3px;} div#account-options2 .fas { top: 3px; left: 0%;} .search-toggle {display:inline-block!important;} #account-options2 { top: -6px;} #account-options { width: 100%; float: none; font-size: 28px; margin-top: 0px; text-align: center; background-color: #f5f5f5; border-radius: 10px; margin-bottom: 0px; } #account-options ul li { padding: 0px 20px; margin: 0px; margin-bottom: -5px; } ul#account-buttons {margin: 0; padding: 0;} #video-container {margin-bottom:0px;} #potential-roi h2 { font-size: 22px; margin: 0 0 10px 0 !important;} #potential-roi {font-size: 13px;} .pull-quote-container:before, .pull-quote-container:after {display: none;} .pullquote {font-size:20px; } .pullquote-attribution {font-size: 12px;} h1, h2, h2.home, h1.blog_title, h3, h4, h5, h6, .title a { font-size: 150%; line-height: 1.5em!important; text-align: center} #s5-benefits h2 {margin: -20px auto 0px auto!important;} #book-a-consult .num {font-size: 20px;} #phone-num-container .one-half-first, #phone-num-container .one-half-last { width: 48%; float: left; clear: none;} .disclaimer-text { text-align: left; margin: 0px 0 20px 0;} } /*------ #Mobile ------*/ @media only screen and (max-width:400px){.ml-form-formContent.horozintalForm .ml-form-horizontalRow .horizontal-fields{margin-bottom:10px!important;width:100%!important}} /* ================================================================================================= #Mobile Styles / Media Queries / mobile .mobile ==================================================================================================== */ /* #Media Queries ================================================== */ /* Smaller than standard 1200 (devices and browsers) */ @media only screen and (max-width: 1199px) { .social_buttons a { padding: 0 2px; } .twitter { display: block; } } /* Smaller than standard 960 (devices and browsers) */ @media only screen and (max-width: 959px) { .thirds .card, .thirds-container .card, .thirds .block {max-width: 100%;} } /* Tablet Portrait size to standard 960 (devices and browsers) */ @media only screen and (min-width: 768px) and (max-width: 959px) { .continue_shopping { display: block; margin-top: 15px; } } /* All Mobile Sizes (devices and browser) */ @media only screen and (max-width: 767px) { .homepage_slider .flex-direction-nav { display: none; } #currencies { padding-top: 4px; } .cart_notification .product_image { display: none; } .continue_shopping { display: block; padding: 15px 0; } .view_cart { /*right: 40px;*/ } .article_image { padding-bottom: 0; } .sidebar_content { border: 0; padding: 0; } #nav, #nav ul, #mobile_nav { text-align: center; } .flex-control-paging { display: none; } .top_bar ul { text-align: center; margin: 0; } .top_bar--fixed-true.top_bar + .content .header-logo { padding-top: 75px; } .social_buttons a { padding: 0; } .quantity_label { display: inline; } #currencies { margin-left: auto; margin-right: auto; } .section_select { text-align: center; } .logo a { text-align: center; margin: 0 auto; } #mobile_nav { display: block !important; margin-top: 15px } #nav { display: none; } .arrow { display: none } .header_icons { float: none; margin-right: 0px; text-align: center; } .mobile_hidden { display: none; } .toggle span { display: block; } .toggle_list { display: none; } #tag_filter, #sort-by { margin-bottom: 1em; } .thumbnail { margin-top: 1em; } .thumbnail a:hover img { opacity: 1; } td { padding: 4px !important; } .title_column { float:left; } .subtotal { text-align:center; } .mobile_left { text-align:left; } div.mobile_only { display:block; } .update_subtotal_text, .price_total, .remove_column, .checkout_table_header { display: none; } .action_button { width: 100%; } .mobile_right { text-align: right; } .quick_shop { display: none !important; } .cart_price { display: block; } .cart_description, .gravatar { display:none; } table tr th, table tr td { padding: 2px; } input.action_button { margin-bottom: 1em !important; } .multiple_product_images { display: none; } .flex-caption .headline { font-size: 1.5em; line-height: 1em; } .flex-caption .subtitle { font-size: 1.2em; line-height: 1em; margin-bottom: 10px; } .footer input[type="text"]{ width:100%; } } /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ @media only screen and (min-width: 480px) and (max-width: 767px) {} /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ @media only screen and (max-width: 479px) { .inline_purchase { margin-left: 0 } .top_bar ul li { padding: 0 5px; } .breadcrumb { text-align:center; } h1 {line-height: 36px!important;} h1, h2.home, h1.blog_title, .title a, h2 { padding:0; } .flex-caption .action_button { padding: 4px 15px; font-size: 12px; } .flex-direction-nav .flex-prev {display: none;} .flex-direction-nav .flex-next {display: none;} } @media (min--moz-device-pixel-ratio: 2), (-o-min-device-pixel-ratio: 2/1), (-webkit-min-device-pixel-ratio: 2), (min-device-pixel-ratio: 2) { .social_link img { width: 30px; height: 30px; } input.search_box { background: #fff url(//shop3d.ca/cdn/shop/t/42/assets/search2x.jpg?v=83174658983691375601753739152) no-repeat 6px; background-size: 14px 14px; } } @media only screen and (min-device-width : 320px) and (max-device-width : 1024px) { html { -webkit-text-size-adjust: 100%; } } @media screen and (-webkit-min-device-pixel-ratio:0) and (max-width: 767px) { select, textarea, input { font-size: 16px; } } /* Desktop */ @media only screen and (max-width: 1000px) { .form-select {column-count: 2;} } @media only screen and (max-width: 959px) { .contact-form .three.columns {width: 100%!important;} .column.alpha, .columns.alpha, .column.omega, .columns.omega {margin-right: 0;margin-left: 0px!important;} } @media only screen and (max-width: 959px) and (min-width: 769px) { .fancybox-inner h4 {position: relative; left: -140px;} } /* TABLET */ @media only screen and (max-width: 900px) { ul#account-buttons { margin-top: -5px;} .meeting-btn { display: none!important; } } @media only screen and (max-width: 900px) and (min-width: 600px) { .tablet-show {display:block} } @media only screen and (max-width: 768px) and (min-width: 479px) { .banner p{margin: 14px 40px 4px 40px;display: Block;font-size: 11px;} .fall-promo, .fall-promo2 {column-count: 2;} .container {width: 90vw!important;} .container .eight.columns{width: 40vw;margin: 10px 1vw;padding: 0;} .container .one.column, .container .two.columns, .container .three.columns, .container .five.columns, .container .six.columns, .container .seven.columns, .container .nine.columns, .container .ten.columns, .container .eleven.columns, .container .twelve.columns, .container .thirteen.columns, .container .fourteen.columns, .container .fifteen.columns, .container .sixteen.columns, .container .one-third.column, .container .two-thirds.column, .container .one-fifth.column { width: 85vw!important;} .homeButton-padding {padding: 3% 0 0 9%;} .featured_content p {text-align:center;} .content_column a {text-align:center;} .index-sections .content .four.columns, #instafeed .four.columns, { width: 45%!important; margin: 0 10px 50px 10px; padding: 0; float: left; display: block; height: 210px;} footer .container .four.columns{ width: 45%!important; margin: 0 10px 50px 10px; padding: 0; float: left; display: block; height: 310px;} .container .one-third.column{ width: 45%!important; margin: 0 10px 50px 10px; padding: 0; float: left; } .shortbox {width:80%;} .shortbox-left {width:40%;} .footer .credits, .footer .credits a {text-align:center;} } @media only screen and (max-width: 767px) { a.slicknav_btn { border-radius: 10px; padding: 7px 0px; background-color: #f5f5f5; } #nav.nav-border--solid, #mobile_nav.nav-border--solid { border-top: 0px solid #aeaeb0; border-bottom: 0px solid #aeaeb0; } #contact-form-container {width:100%; float:none;} #section-contact #page-content {width:100%; float:none;} } @media only screen and (max-width: 756px) and (min-width: 100px) { .view_cart { margin-bottom: 20px; float: none; position: relative; top: 0; margin-bottom: 20px; right: 0px; }} @media only screen and (max-width: 700px) { .quote-form-container {width:100%; margin:auto;} .embed-container { position: relative; padding-bottom: 51.25%; height: 0; overflow: hidden; max-width: 100%; margin:-38px auto 0 auto; } @media only screen and (max-width: 700px) and (min-width: 550px) { #call-to-action h2 { font-size: 22px; line-height: 1.45em!important; margin-top: 0px!important; margin-bottom: 10px!important;} #call-to-action p {font-size: 15px;} .call-to-action-buttons .one-half-first, .call-to-action-buttons .one-half-last {width:100%; padding:10px 0;} #book-a-consult a:link, #book-a-consult a:visited {line-height: 1.15em;} .tablet-hide {display:none;} .thirds .card, .thirds-container .card, .thirds .card:nth-child(3n), .thirds-container .card:nth-child(3n) {width: 100%;} .card.one-third-first,.card.one-third-middle,.card.one-third-last {width: 100%; margin: 2% 0; float: none;} } @media only screen and (max-width: 680px) {.banner p {font-size: 12px;}} @media only screen and (max-width: 659px) { .customer-label {display:none;} .log-out {display: none!important;} .cart-label {display:none;} #account-buttons .mobile-hide {display:none} #account-buttons .mobile-show {display:block;} ul#account-buttons { margin-top: 0px; } #account-options { width: 100%; float: right; font-size: 22px; margin-top: 1px; margin-bottom: -9px; text-align: center; } #account-options2 {text-align:Center; position: relative; top: -37px; width:100%; clear:both;} #account-options2:before { clear: both; content: ''; display: table; } div#account-options2 .fas { position: relative; top: 1px; left: 31%; font-size: 30px; color: #255a90; } #account-options2 ul { list-style-type: none; margin: 0; padding: 0; position: Relative; top: -21px;} #account-options2 ul li { list-style-type: none; margin: 0; padding: 0; } #account-options2 ul li:first-child { border-top: 0px; } #account-options2 a:link, #account-options2 a:visited { width: 100%; background-color: #f5f5f5; display: Block; padding: 8px 0; border: 1px solid #255a90!important; margin-bottom: -1px; } #account-options2 a:active, #account-options2 a:hover {background-color: #255a90; color: #fff;} } .block-title {background-color: #1f3366; background-image: linear-gradient(-44deg, #1f3366, #255a90); color: #fff; text-align:center; padding:10px; font-size:24px; text-transform: uppercase; margin:20px 0px;} .tiny-quote {color:#077ed2; text-align:center; font-size:29px; margin:10px 0; line-height:32px;} #slideshow-container { background-position: center; background-repeat: no-repeat; background-size: cover; height:350px; margin:-9px 0;} #slideshow-container .slide-show-text { background-color: rgba(0,0,0,.5); width:200px; height:310px; position:relative; top:0px; left:40px; padding:20px;} #slideshow-container .featured-text { position: relative; top: 28px; color:#fff; } #slideshow-container .featured-text a:link,#slideshow-container .featured-text a:visited { background-color: #ebebeb; background-image: linear-gradient(-44deg, #bdbdbd, #fff); color: #000; padding:8px 10px; } #slideshow-container .featured-text a:active, #slideshow-container .featured-text a:hover { background-image: linear-gradient(-44deg, #fff, #fff); } #slideshow-container .featured-text h2 { font-size:18px; color:#fff!important; padding:0!important; margin:20px 0 0 0!important; line-height: 26px!important;} #slideshow-container .featured-text p{line-height: 28px; margin-top: 10px;} @media only screen and (max-width: 650px) and (min-width: 479px) { .threecol-left { width: 100%; padding:0px; float: none; border-bottom: 1px dashed grey; margin: 0 0 10px 0;} .threecol-center { width: 100%; padding:0px; float: none; border-bottom: 1px dashed grey; margin: 20px 0 10px 0;} .threecol-right { width: 100%; padding:0px; float: none; border-bottom: 1px dashed grey; margin: 20px 0 10px 0;} .twocol-left {width: 100%; padding:0px; float: none; margin: 0 0 10px 0;} .twocol-right {width: 100%; padding:0px; float: none; margin: 20px 0 10px 0;} .column, .columns {float:none;} } @media only screen and (max-width: 600px) { .product-table {Display:none;} .form-left {width: 94%; padding: 3%; display:inline-block;} .form-right {width: 94%; padding: 3%; display:inline-block;} .form-full {width:94%; padding:3%;} .cost-comparison.mobile-hide {display:none;} .cost-comparison.mobile-show {display:Block;} .cost-comparison h3 {text-align:Center;} .two-thirds-first { width: 100%; padding: 2% 0% 2% 0%; float: none; } .one-third-last.mobile-extend { width: 100%; padding: 2% 0% 2% 0%; float: none;} } @media only screen and (max-width: 550px) { .deep-dive-padding {padding:20px} .mobile-full {width:95%!important; margin:auto!important; display:table!important;} .mobile-center {text-align:Center;} .mobile-table {display:Table} #call-to-action .one-half-first{width:46%; float:left; clear:none;} #call-to-action .one-half-last{width:50%;float:left; clear:none;} #call-to-action h2 {font-size: 93%; margin: -10px 0px 0px 0px!important; line-height: 1.5em!important;} #call-to-action p {font-size:13px; line-height: 1.75em;} .mobile-show.call-to-action-buttons div { margin: -20px auto 0px auto!important;} #potential-roi a:link, .mobile-buttons a:link, #potential-roi a:visited, .mobile-buttons a:visited{display:Block; background:#386591; color:#fff!important; padding:10px 5px; font-size:14px; line-height:1.5em;} #book-a-consult a:active, #book-a-consult a:hover,#potential-roi a:active, #potential-roi a:hover, .mobile-buttons a:active,.mobile-buttons a:hover{background:#1f3366;} #book-a-consult a:link, #book-a-consult a:visited { display:Block; background:#386591; color:#fff!important; padding:20px 5px; font-size:18px; line-height:1.5em; text-decoration:none;} #whitepaper-downloads h2 { margin-top: -50px!important;} .one-fourth-first, .one-fourth-middle, .one-fourth-last {width:48%; display: table;} } @media only screen and (max-width: 550px) and (min-width: 479px) { .call-to-action-buttons {width: 100%!important; clear: both;} #call-to-action h2 {font-size: 133%; margin: 2px 0px 0px 0px !important;} #account-options { width: 40%; float: right; font-size: 30px; margin-top: -18px;} #account-options ul li { display: inline-block; padding: 0px 7px 0 7px; margin-bottom: 0px; } } @media only screen and (max-width: 490px) { .form-select {column-count: 1;} .form-submit {width:100%; margin:auto;} #contact-form-container ul{margin:0;} } @media only screen and (max-width: 478px) { .header_icons {display:none;} .header-logo.logo a { margin-top: 105px; margin-bottom: -56px;} div.featured_content p { color: #fff; font-size: 19px; padding: 10px 36px; } .container { width: 90%; margin: auto!important; } div.featured_content {width:100%; margin: auto auto 10px auto; left:0; padding: 14px 0px;} /* Hide Homepage Stuff */ .index a.action_button, .homepage_content h3 {display: none;} } @media only screen and (max-width: 400px) { #section-contact #contact-form-container li {margin: 0px 0 15px 0;} } @media only screen and (max-width: 361px) { .banner p {margin: 14px 25px 4px 25px;} #account-options ul li { padding: 0px 15px;} } @media only screen and (max-width: 360px) { .header-logo.logo a { max-width: 300px!important;} .header_icons { top: 120px;} .container .one.column, .container .two.columns, .container .three.columns, .container .four.columns, .container .five.columns, .container .six.columns, .container .seven.columns, .container .eight.columns, .container .nine.columns, .container .ten.columns, .container .eleven.columns, .container .twelve.columns, .container .thirteen.columns, .container .fourteen.columns, .container .fifteen.columns, .container .sixteen.columns, .container .one-third.column, .container .two-thirds.column, .container .one-fifth.column { width: 320px!important; } .container {width: 320px !important;} } /* Konami Haley */ .konami-haley{position:fixed;bottom:0;left:10px;z-index:500000;display:none}.konami-haley-visible{display:block!important;animation:2s forwards load_up;-webkit-animation:2s forwards load_up}@keyframes load_up{from{opacity:0;bottom:-100%}to{opacity:1;bottom:-3%}}@-webkit-keyframes load_up{from{opacity:0;bottom:-3%}to{opacity:1;bottom:-100%}}