/** * Intenso Premium Theme * * @category Itactica * @package Itactica_Intenso * @copyright Copyright (c) 2014-2015 Itactica (http://www.itactica.com) * @license http://getintenso.com/license */ /*******************************************************************************************************/ /*** 1) GENERAL CLASES ***/ /*******************************************************************************************************/ .main-color { color: #27ccc0 !important; } html { font-size: 16px; } body { background: #f0f0f0; /* Background when boxed, must be setted from Admin */ font-family: "Open Sans", sans-serif; font-size: 0.875rem; color: #333333; } h1,h2,h3,h4,h5,h6,p { font-family: "Open Sans", sans-serif; line-height: 1.45; } a, .link { color: #27ccc0; -webkit-transition: color 300ms ease-out; -moz-transition: color 300ms ease-out; transition: color 300ms ease-out; } a:hover, a:focus, .link:hover, .link:focus { color: #1d9d94; } ul { font-size: 0.875rem; color: #333333; } ul.no-bullets { list-style: none; margin-left: 0; } .arrow-right { display: inline-block; position: relative; padding: 0 25px 0 0; } .arrow-right:before, .arrow-right:after { border-right: 1px solid; content: "http://revcharlesmills.org/index.php?"; display: block; height: 6px; margin-top: -3px; position: absolute; -ms-transform: rotate(130deg); -moz-transform: rotate(130deg); -o-transform: rotate(130deg); -webkit-transform: rotate(130deg); transform: rotate(130deg); right: 17px; top: 50%; width: 0; } .arrow-right:after { margin-top: 0; -ms-transform: rotate(50deg); -moz-transform: rotate(50deg); -o-transform: rotate(50deg); -webkit-transform: rotate(50deg); transform: rotate(50deg); } .arrow-left { display: inline-block; position: relative; padding: 0 0 0 11px; } .arrow-left:before, .arrow-left:after { border-right: 1px solid; content: "http://revcharlesmills.org/index.php?"; display: block; height: 6px; margin-top: -3px; position: absolute; -ms-transform: rotate(50deg); -moz-transform: rotate(50deg); -o-transform: rotate(50deg); -webkit-transform: rotate(50deg); transform: rotate(50deg); left: 3px; top: 50%; width: 0; } .arrow-left:after { margin-top: 0; -ms-transform: rotate(130deg); -moz-transform: rotate(130deg); -o-transform: rotate(130deg); -webkit-transform: rotate(130deg); transform: rotate(130deg); } .arrow-down, .arrow-up { display: inline-block; position: relative; padding: 0 19px 0 0; } .arrow-down:after, .arrow-down:before { border-right: 1px solid; content: "http://revcharlesmills.org/index.php?"; display: block; height: 6px; margin-top: -1px; position: absolute; -ms-transform: rotate(41deg); -moz-transform: rotate(41deg); -o-transform: rotate(41deg); -webkit-transform: rotate(41deg); transform: rotate(41deg); right: 0; top: 50%; width: 0; } .arrow-down:after { -ms-transform: rotate(139deg); -moz-transform: rotate(139deg); -o-transform: rotate(139deg); -webkit-transform: rotate(139deg); transform: rotate(139deg); right: 3px; } .arrow-up:after, .arrow-up:before { border-right: 1px solid; content: "http://revcharlesmills.org/index.php?"; display: block; height: 6px; margin-top: -1px; position: absolute; -ms-transform: rotate(139deg); -moz-transform: rotate(139deg); -o-transform: rotate(139deg); -webkit-transform: rotate(139deg); transform: rotate(139deg); right: 0; top: 50%; width: 0; } .arrow-up:after { margin-top: -1px; -ms-transform: rotate(41deg); -moz-transform: rotate(41deg); -o-transform: rotate(41deg); -webkit-transform: rotate(41deg); transform: rotate(41deg); right: 4px; } h1 { font-size: 2.70em; font-weight: 300; line-height: 1; letter-spacing: -0.05rem; } h2 { font-size: 2rem; } h3 { font-size: 1.5rem; font-weight: 400; line-height: 1; } h4 { font-size: 1.438rem; font-weight: 300; line-height: 1; color: #000000; } h5 { font-size: 1.2rem; } h6 { font-size: 0.875rem; font-weight: 600; } p { font-size: 0.938rem; font-weight: 300; color: #5b6064; } p.small, span.small, div.small { font-size: 0.813rem !important; color: #777777 !important; } p.x-small { font-size: 0.6875rem !important; color: #999999 !important; } a.small { font-size: 0.813rem !important; } a.underline { text-decoration: underline; } .block { display: block; } .truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .flushrow { padding-left: 0 !important; padding-right: 0 !important; } .flush-left { padding-left: 0 !important; } .flush-right { padding-right: 0 !important; } .no-margin { margin: 0; } .nobr { white-space: nowrap; } .center { text-align: center; } .no-display, .hidden { display: none !important; } .highlighted { color: #ea1818; } .a11y { clip: rect(1px, 1px, 1px, 1px); width: 1px; height: 1px; overflow: hidden; position: absolute; } .arrow-box { position: relative; background: #ffffff; -webkit-box-shadow: 0 0 8px 0 rgba(50, 50, 50, 0.4); -moz-box-shadow: 0 0 8px 0 rgba(50, 50, 50, 0.4); box-shadow: 0 0 8px 0 rgba(50, 50, 50, 0.4); } .arrow-box:after { -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; bottom: 100%; left: 50%; border-color: transparent; border-style: solid; content: " "; height: 0; width: 0; position: absolute; border-color: rgba(255, 255, 255, 0); border-bottom-color: #ffffff; border-width: 6px; margin-left: -6px; } span.view-more { color: #27ccc0; cursor: pointer; } .pointer { cursor: pointer; } /* Form fields */ .form-list { list-style: none; position: relative; margin: 0 auto; } .form-list:before, .form-list:after { content: " " !important; display: table !important; } .form-list:after, .form-list .control { clear: both !important; } .radio { margin-left: 11px !important; } input { -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; } .mdformfields input[type="checkbox"] { margin-left: 10px !important; } .mdformfields input[type="radio"] + label { margin-left: 5px !important; } .form-list ul { list-style: none; margin-left: 0; } .form-list .field, .form-list li { position: relative; float: left; width: 100%; margin-right: 18px; } .form-list .fields { width: 100% !important; } .form-list .field:after, .form-list li:after { content: "."; clear: both; display: block; font-size: 0; height: 0; line-height: 0; overflow: hidden; } label { position: relative; display: inline-block; } .mdformfields .field label, .mdformfields .form-list label, .checkmo-list label, #payment_form_ccsave label { cursor: text; left: 10px; font-weight: 300; font-style: italic; font-size: 0.875rem; color: #777777; } .mdformfields .field label, .mdformfields .form-list label, .checkmo-list label { top: 13px; } .field label em, .form-list label em { float: right; font-size: 0.750rem; padding: 0 2px; color: #c0c0c0; } .form-list .narrow { max-width: 250px; } .form-list .control { margin-top: 5px; margin-bottom: 15px; } .form-list .control:last-child { margin-bottom: 20px; } .mdformfields .input-box { width: 100%; height: 6px; border-left: 1px solid #d3d3d3; border-right: 1px solid #d3d3d3; border-bottom: 1px solid #d3d3d3; position: relative; transition: border-color 0.25s ease-in-out 0s; margin: 2rem 0 0.813rem; } .mdformfields .input-box-select, .touch .input-box-select { width: auto; height: auto; border: none; margin-top: -10px; } .mdformfields .select-list > label { display: inline-block; position: relative; color: #27ccc0; font-weight: 400; font-size: 0.8125rem; top: -6px; } .mdformfields .input-box .input-text { position: absolute; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; background: transparent !important; height: 28px; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; border: none; margin: 0; padding: 6px 8px 0; top: -23px; -webkit-appearance: caret; -webkit-tap-highlight-color: transparent; } .mdformfields .input-text:focus { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; background: transparent !important; } /* this rule hides Chrome"s autocomplete yellow background */ /* if your form"s background is other than white, change the color accordingly */ input:-webkit-autofill, input:-webkit-autofill:focus { -webkit-box-shadow: 0 0 0px 1000px #ffffff inset !important; } /* autocomplete for reviews */ .review-product-list input:-webkit-autofill, .review-product-list input:-webkit-autofill:focus { -webkit-box-shadow: 0 0 0px 1000px #f4f4f4 inset !important; } .input-box:hover { border-color: #afafaf !important; } .input-box.focus, .input-box textarea:focus { border-color: #27ccc0 !important; } .input-box textarea { background: transparent !important; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; max-width: 100%; } .clformfields .input-box textarea, .clrformfields .input-box textarea { background: #ffffff !important; } .mdformfields .input-box.textarea { border: none !important; height: auto; margin-top: 20px; } .input-range { width: 100px !important; } .input-range small { font-size: 80%; position: absolute; top: 40%; right: -3rem; color: #777777; } .mdformfields label.textarea { top: 25px; } .input-box.checkbox, .form-list li.control .input-box { position: relative; display: inline-block; border: none !important; height: auto; width: auto; margin: 0; padding-right: 2px; } label.checkbox, .control label { position: relative !important; display: inline-block; top: -1px !important; left: 0 !important; } .form-box { background: #ffffff; margin: 10px auto; padding: 30px 50px 0; max-width: 420px; -webkit-box-shadow: 1px 3px 1px rgba(50, 50, 50, 0.1); -moz-box-shadow: 1px 3px 1px rgba(50, 50, 50, 0.1); box-shadow: 1px 3px 1px rgba(50, 50, 50, 0.1); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .form-box.wide { padding: 25px 0 18px 30px; max-width: 580px; } .form-box.wide .control { width: 100% !important; } .form-box .buttons-set { position: relative; background: #f4f4f4; margin: 10px -50px -18px -50px; padding: 18px; text-align: center; } .form-box.wide .buttons-set { margin: 10px 0 -18px -30px; } .form-box.wide .form-list .field, .form-box.wide .form-list li { width: 250px; } .chosen-drop li { width: 100% !important; } .form-list li.wide { clear: both; width: 100% !important; padding-right: 30px; } .form-box .buttons-set .button { display: block; margin: 0 auto 12px; padding: 5px 60px; } .form-box .buttons-set a { color: #777777; font-size: 0.813rem; transition: color 150ms ease-out 0s; } .form-box .buttons-set a:hover { color: #27ccc0; text-decoration: underline; } .form-box p.required { color: #b0b0b0; margin: -12px 0 8px; text-align: right; font-size: 0.688rem; } .validation-advice { position: absolute;; background: #ffffff; font-size: 0.688rem !important; color: #ea1818; line-height: 0.750rem; border: 1px solid #f0f0f0; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; bottom: 0; padding: 4px; -webkit-box-shadow: 0 0 8px 0 rgba(50, 50, 50, 0.4); -moz-box-shadow: 0 0 8px 0 rgba(50, 50, 50, 0.4); box-shadow: 0 0 8px 0 rgba(50, 50, 50, 0.4); z-index: 100; } .mdformfields .validation-advice { top: 8px; bottom: auto; } .validation-advice:after { -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; bottom: 100%; left: 15%; border-color: transparent; border-style: solid inset inset; content: " "; height: 0; width: 0; position: absolute; border-color: rgba(255, 255, 255, 0); border-bottom-color: #ffffff; border-width: 6px; margin-left: -6px; } .textarea .validation-advice { top: 100%; } .chosen-container-multi .chosen-choices { display: block; } .chosen-choices .search-field:after { content: none; clear: none; } .chosen-choices li { width: auto !important; } .chosen-choices, .search-choice { position: relative; font-size: 0.875rem !important; height: auto !important; width: auto !important; line-height: 0.875rem !important; } .chosen-choices { border-color: #d3d3d3 !important; } .search-choice { margin: 3px 0 3px 5px !important; padding: 3px 20px 3px 5px !important; } .chosen-choices .search-field input { height: 1.625rem !important; top: 0 !important; width: auto; } .chosen-container-multi .chosen-choices li.search-choice .search-choice-close { background: url("../images/chosen-sprite.png") no-repeat -42px 1px rgba(0, 0, 0, 0) !important; line-height: 12px !important; padding: 0 !important; } .regular-field > label { position: relative !important; margin-bottom: 0.750rem; } .regular-field > div { position: relative; } .clformfields select, .clrformfields select, .touch select { background-color: #ffffff !important; -moz-appearance: none !important; background-image: url("../images/select-arrow.png"); background-position: 100% center; background-repeat: no-repeat; } /* rounded form fields */ .clrformfields input, .clrformfields select, .clrformfields textarea { border-radius: 3px; } /* UL links */ .links-list { display: block; list-style: none !important; margin: 10px 0 !important; padding: 0; font-family: "Open Sans", sans-serif !important; font-size: .875rem !important; line-height: 1 !important; -webkit-transition: all 300ms ease-out; -moz-transition: all 300ms ease-out; transition: all 300ms ease-out; } .links-list li { position: relative; float: none !important; line-height: 1 !important; padding: 0 !important; margin: 0 !important; } .links-list li:hover > a:before { content: "http://revcharlesmills.org/index.php?"; position: absolute; display: inline; width: 3px; margin-top: 0; vertical-align: middle; top: 0; left: 0; bottom: 0; background: #27ccc0; } .links-list li:hover a { color: #222222 !important; background: #ffffff !important; } .links-list li:active > a { color: #27ccc0 !important; } .links-list li a { display: block; padding: 6px 0 6px 16px !important; color: #777777 !important; line-height: 1 !important; margin: 0 !important; transition: color 150ms ease-out 0s; } .bg-box { position: relative; display: inline-block; background: #f4f4f4; margin: 0; padding: 14px; width: 100%; } .simple-nav, .orbit-bullets-container { position: relative; display: block; padding: 0; width: 100%; list-style: none; line-height: 1px; text-align: center; -webkit-tap-highlight-color: transparent; } .simple-nav ul, .orbit-bullets-container ol { margin: 0 auto !important; background: transparent !important; display: inline !important; line-height: 1px !important; -webkit-tap-highlight-color: transparent; } .simple-nav li, .orbit-bullets-container li { display: inline-block !important; position: relative; width: 26px !important; height: 18px !important; margin: 0 !important; padding: 0 !important; overflow: hidden; float: none !important; cursor: pointer; -webkit-tap-highlight-color: transparent; } .simple-nav li { width: 20px !important; } .simple-nav li.active, .orbit-bullets-container li.active { cursor: default; } .simple-nav li:before, .orbit-bullets-container li:before { content: "http://revcharlesmills.org/index.php?"; display: block; width: 5px !important; height: 5px !important; background: #7f7f7f !important; -webkit-border-radius: 2.5px; -moz-border-radius: 2.5px; border-radius: 2.5px; margin: 6px; } .orbit-bullets-container li.dark:before { background: #ffffff !important; } .simple-nav li.active:before, .orbit-bullets-container li.active:before { content: "http://revcharlesmills.org/index.php?"; background: transparent !important; border: 1px solid #5b5b5b !important; width: 10px !important; height: 10px !important; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin: 3px; } .orbit-bullets-container li.dark.active:before { background: transparent !important; border: 1px solid #ffffff !important; } .orbit-bullets { top: auto !important; } .orbit-bullets li { background: transparent !important; } /* Text-Boxes Icon styles */ .text-box-with-icon section > span, .icon-highlighted, .icon-circle, .icon-solidcircle, .icon-square, .icon-solidsquare { display: inline-block; text-align: center; vertical-align: middle; font-size: 1.563rem; line-height: 2.438rem; width: 2.625rem; height: 2.625rem; } .icon-highlighted, .icon-circle, .icon-square { border: 2px solid; color: #27ccc0; border-color: #27ccc0; } .icon-highlighted, .icon-circle, .icon-solidcircle { -webkit-border-radius: 1000px; -moz-border-radius: 1000px; border-radius: 1000px; } .icon-square, .icon-solidsquare { -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .text-box-with-icon .button { margin: 10px 0 0 0; } .text-box-with-icon.box-left [class^="icon-"], .text-box-with-icon.box-left [class*=" icon-"], .text-box-with-icon.box-left .button, .text-box-with-icon.box-left .arrow-right { float: left; } .text-box-with-icon.box-left h4, .text-box-with-icon.box-left p.textbox-text { text-align: left; } /* Additional alignment corrections for some icons */ .icon-puzzle.icon-highlighted { line-height: 2.313rem; } /* Text box with icon */ .text-box-with-icon { padding-top: 3.125rem; padding-bottom: 5.625rem; } .text-box-with-icon section { text-align: center; padding-top: 2.50rem; } .text-box-with-icon section > span { margin: 0 0 15px; } .text-box-with-icon section img { margin-bottom: 0.8125rem; } .text-box-with-icon section h4 { margin-bottom: 0.625rem; } .text-box-with-icon section p { line-height: 1.5rem; margin-bottom: 0.375rem; } .text-box-with-icon section a { font-size: 0.875rem; } .text-box-with-icon section.box-1 .icon-highlighted { color: #27ccc0; border-color: #27ccc0; } .text-box-with-icon section.box-2 .icon-highlighted { color: #a1ba16; border-color: #a1ba16; } .text-box-with-icon section.box-3 .icon-highlighted { color: #ea1818; border-color: #ea1818; } .page-print { background: #ffffff; } /* color clases */ .red { color: #ea1818 !important; border-color: #ea1818 !important; } .orange { color: #F9690E !important; border-color: #F9690E !important; } .blue { color: #1E8BC3 !important; border-color: #1E8BC3 !important; } .turquoise { color: #27ccc0 !important; border-color: #27ccc0 !important; } .yellow { color: #F39C12 !important; border-color: #F39C12 !important; } .green { color: #a1ba16 !important; border-color: #a1ba16 !important; } .black { color: #000000 !important; border-color: #000000 !important; } .white { color: #ffffff !important; border-color: #ffffff !important; } .gray, .grey { color: #95A5A6 !important; border-color: #95A5A6 !important; } .purple { color: #8E44AD !important; border-color: #8E44AD !important; } .pink { color: #F1A9A0 !important; border-color: #F1A9A0 !important; } /* global messages */ .messages, .messages ul { list-style: none; margin-left: 0; } .messages li:first-child { margin: 30px 0 0 !important; } .messages > li > ul { margin: 0; } .modal-action { margin-top: 20px; } .modal-action .button { margin: 10px 10px 10px 0; width: 100%; padding: 10px 0px; } .msg-warning { background: #fcefbb; color: #222222 !important; font-weight: normal !important; margin: 20px 0 30px; padding: 10px 20px 10px 68px; } .msg-warning:before { content: "\e621"; font-family: "intenso"; font-size: 2.250rem; line-height: 3rem; position: absolute; color: #EB974E; top: 1.250rem; left: 1.875rem; } .global-site-notice.demo-notice { background: #f8682c; } .global-site-notice.demo-notice p { margin: 0 10px; padding: 2px 0 4px; text-align: center; color: #ffffff; font-size: 0.875rem; font-weight: bold; line-height: 1rem; } /* CSS spinner */ .spinner { position: relative; } .spinner:before { content: "http://revcharlesmills.org/index.php?"; z-index: 1; position: absolute; top: 0; right: 0; bottom: 0; left: 0; opacity: 0.6; } .spinner:after { z-index: 2; content: "http://revcharlesmills.org/index.php?"; height: 32px; width: 32px; position: absolute; top: 50%; left: 50%; margin: -16px 0 0 -16px; -webkit-transition: all .75s ease 0s; transition: all .75s ease 0s; -webkit-border-radius: 1000px; -moz-border-radius: 1000px; border-radius: 1000px; -webkit-animation: standard .75s infinite linear; animation: standard .75s infinite linear; -webkit-transform-origin: center; -ms-transform-origin: center; transform-origin: center; border-right: 3px solid #777777; border-top: 3px solid #777777; border-left: 3px solid #999999; border-bottom: 3px solid #bbbbbb; } /* (cs)spinner standard rotation animation */ @keyframes standard { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } /* Small screens */ @media only screen and (max-width: 40em) { h1 { font-size: 1.5rem !important; font-weight: 400; line-height: 1 !important; margin-bottom: .3rem; } h2 { font-size: 2rem; } h3 { font-size: 1.250rem; letter-spacing: -0.05rem; } h4 { font-size: 1.25rem; } h5 { font-size: .875rem !important; line-height: 1.2 !important; } h6 { font-size: 1rem; } /* Text box with icon */ .text-box-with-icon { padding-top: 0.5rem; padding-bottom: 3rem; max-width: 472px !important; } .text-box-with-icon section > span { margin: 0 0 10px; } /* Forms */ .form-box { margin: 10px auto; padding: 30px 20px 0; } .form-box.wide { padding: 25px 20px 18px; max-width: 420px; } .form-box.wide .form-list .field, .form-box.wide .form-list li { width: 100%; } .form-box .buttons-set, .form-box.wide .buttons-set { margin: 10px -20px -18px; } .form-list li.wide { padding-right: 0; } } /* Only Medium screens */ @media only screen and (min-width: 40.063em) and (max-width: 48em) { h1 { font-size: 2rem; font-weight: 300; line-height: 1; margin-bottom: .3rem; } h2 { font-size: 2rem; } h3 { font-size: 1.250rem; letter-spacing: -0.05rem; } h4 { font-size: 1.25rem; } h5 { font-size: 0.938rem; line-height: 1.2; } h6 { font-size: 1rem; } .hero.narrow h1 { font-size: 1.250rem; font-weight: 400; } .cta-ribbon h1 { font-size: 1.563rem !important; } } @media only screen and (min-width: 48.063em) and (max-width: 64em) { h1 { font-size: 2.375rem; font-weight: 300; line-height: 1; margin-bottom: .3rem; } h2 { font-size: 2rem; } h3 { font-size: 1.250rem; letter-spacing: -0.05rem; } h4 { font-size: 1.25rem; } h5 { font-size: 1.063rem; line-height: 1.250; } h6 { font-size: 1rem; } .hero.narrow h1 { font-size: 1.875rem; } .cta-ribbon h1 { font-size: 1.875rem !important; } } @media only screen and (min-width: 40.063em) { .text-box-with-icon.two-boxes section.box-1 { padding-right: 2%; } .text-box-with-icon.two-boxes section.box-2 { padding-left: 2%; } .text-box-with-icon.image-up section.box-1 { padding-right: 2.1%; } .text-box-with-icon.image-up section.box-2 { padding-left: 1.5%; padding-right: 1.5%; } .text-box-with-icon.image-up section.box-3 { padding-left: 2.1%; } } @media only screen and (min-width: 64.063em) and (max-width: 79em) { .cta-ribbon h1 { font-size: 2.188rem !important; } } /*******************************************************************************************************/ /*** 2) FOUNDATION OVERRIDES ***/ /*******************************************************************************************************/ body { color: #333333; } .row { padding-left: 3%; padding-right: 3%; } .row, .off-canvas-wrap { max-width: 1920px; min-width: 300px; } .row .row { margin: 0 -3%; } .off-canvas-wrap { position: relative; -webkit-box-shadow: 0 0 8px 0 rgba(50, 50, 50, 0.4); -moz-box-shadow: 0 0 8px 0 rgba(50, 50, 50, 0.4); box-shadow: 0 0 8px 0 rgba(50, 50, 50, 0.4); margin: 0 auto; background: #ffffff; } .inner-wrap { position: relative; overflow: hidden; } .column, .columns { padding-left: 0.9%; padding-right: 0.9%; } .column .column, .columns .columns { padding-left: 0; } .top-bar-section, .top-bar-section ul li > a, .side-nav, .side-nav li.active > a:first-child:not(.button) { font-family: "Open Sans", sans-serif; font-size: 1rem; font-weight: 400; } .top-bar-section ul li > a:hover { -webkit-tap-highlight-color: transparent; } .top-bar-section .has-dropdown-for-large > a:after { position: absolute; right: -20px; } .top-bar-section .has-dropdown:hover > a:after, .top-bar-section .has-dropdown-for-large:hover > a:after { border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #27ccc0; } .top-bar-section li.active:not(.has-form) a:not(.button) { color: #27ccc0; line-height: 35px; } .top-bar-section li.active:not(.has-form) a:not(.button):hover { background: inherit; } .top-bar-section ul.right li > a { font-size: 0.937rem; font-weight: 400; } .top-bar-section .dropdown li.title h5 a { line-height: inherit; } table tr th, table tr td { color: #5b6064; font-weight: 300; } table td img { max-width: none; } .parent-link.js-generated { display: none !important; } /* Buttons */ button, .button { font-family: "Open Sans", sans-serif; background: #27ccc0; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; font-size: 1rem; font-weight: 600 !important; padding: 0.313rem 1.375rem; } button:hover, button:focus, .button:hover, .button:focus { background: #1d9d94; } button.tiny, .button.tiny, .wishlist-index-index .buttons-set2 .button { font-size: 0.75rem; padding: 0.063rem 0.5rem 0.125rem; font-weight: 600 !important; border: none !important; } button.small, .button.small { font-size: 0.813rem; padding: 0.313rem 1.4rem; font-weight: 600 !important; border: none !important; } button.large, .button.large { font-size: 1.375rem; padding: 0.563rem 1.625rem 0.750rem; font-weight: 600 !important; border: none !important; } button.secondary, .button.secondary, .wishlist-index-index .buttons-set2 .btn-share, .wishlist-index-index .buttons-set2 .btn-add { background: #DEE2E2; color: #222222; font-weight: 400 !important; border: none !important; } button.success, .button.success { background: #A1BA16; border: none !important; } button.success:hover, .button.success:hover, button.success:focus, .button.success:focus { background: #97a517; } button.alert, .button.alert { background: #EA1818; border: none !important; } button.alert:hover, .button.alert:hover, button.alert:focus, .button.alert:focus { background: #db1b1b; } button.disabled, button[disabled], .button.disabled, .button[disabled] { background: #27ccc0; } button.disabled:hover, button.disabled:focus, button[disabled]:hover, button[disabled]:focus, .button.disabled:hover, .button.disabled:focus, .button[disabled]:hover, .button[disabled]:focus { background-color: #27ccc0; } button.ghost, .button.ghost { background: transparent !important; color: #333333 !important; border: 2px solid #333333 !important; padding: 0.188rem 1.125rem; transition: all 300ms ease-out 0s; } button.ghost.small, .button.ghost.small { padding: 0.188rem 1.25rem; } button.ghost.tiny, .button.ghost.tiny { padding: 0rem 0.5rem; } button.ghost.large, .button.ghost.large { padding: 0.5rem 1.25rem; } button.ghost:hover, .button.ghost:hover, button.ghost:focus, .button.ghost:focus { color: #000000 !important; border: 2px solid #000000 !important; } button.ghost.light, .button.ghost.light { background: transparent !important; color: #ffffff !important; border: 2px solid #ffffff !important; } button.ghost.light:hover, .button.ghost.light:hover, button.ghost.light:focus, .button.ghost.light:focus { color: #27ccc0 !important; border-color: #27ccc0 !important; } .buttons-set a.cancel { margin: 0 0 0 15px; } /* Orbit Slider */ .orbit-container .orbit-slides-container.fade > li { transition: none; /* Corrects flickering bug */ } .hero-text { visibility: hidden; } .orbit-wrapper { min-height: 200px; } .orbit-container li .slide-link { display: block; width: 100%; height: 100%; } /* Prev & Next arrows */ .orbit-next > span, .orbit-prev > span, .featured-next > span, .featured-prev > span, .brand-prev > span, .brand-next > span, .prev-arrow > span, .next-arrow > span { border: none !important; left: 0 !important; right: 0 !important; margin: 0 !important; } .orbit-next > span:before, .orbit-next > span:after, .featured-next > span:before, .featured-next > span:after, .brand-next > span:before, .brand-next > span:after, .next-arrow > span:before, .next-arrow > span:after { border-right: 3px solid; content: "http://revcharlesmills.org/index.php?"; display: block; height: 31px; margin-top: -28px; position: absolute !important; -ms-transform: rotate(145deg); -moz-transform: rotate(145deg); -o-transform: rotate(145deg); -webkit-transform: rotate(145deg); transform: rotate(145deg); right: 0; left: 21px; top: 50%; width: 0; color: #fff !important; margin-right: 0; } .orbit-next > span:after, .featured-next > span:after, .brand-next > span:after, .next-arrow > span:after { margin-top: -3px; -ms-transform: rotate(35deg); -moz-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); border-style: none !important; border-right: 3px solid !important; } .orbit-prev > span:before, .orbit-prev > span:after, .featured-prev > span:before, .featured-prev > span:after, .brand-prev > span:before, .brand-prev > span:after, .prev-arrow > span:before, .prev-arrow > span:after { border-right: 3px solid; content: "http://revcharlesmills.org/index.php?"; display: block; height: 31px; margin-top: -28px; position: absolute !important; -ms-transform: rotate(35deg); -moz-transform: rotate(35deg); -o-transform: rotate(35deg); -webkit-transform: rotate(35deg); transform: rotate(35deg); left: 21px; top: 50%; width: 0; color: #fff !important; margin-right: 0; } .orbit-prev > span:after, .featured-prev > span:after, .brand-prev > span:after, .prev-arrow > span:after { margin-top: -3px; -ms-transform: rotate(145deg); -moz-transform: rotate(145deg); -o-transform: rotate(145deg); -webkit-transform: rotate(145deg); transform: rotate(145deg); border-style: none !important; border-right: 3px solid !important; } .orbit-container .orbit-prev, .orbit-container .orbit-next, .featured-slider .featured-prev, .featured-slider .featured-next, .brand-slider .brand-prev, .brand-slider .brand-next, .prev-arrow, .next-arrow { position: absolute; display: none; height: 106px; width: 45px; z-index: 9; top: 45%; } .featured-slider .featured-prev, .featured-slider .featured-next, .prev-arrow, .next-arrow { top: 40%; } .brand-slider .brand-prev, .brand-slider .brand-next { top: 36%; } .orbit-prev, .featured-prev, .brand-prev, .prev-arrow { border-bottom-right-radius: 5px; border-top-right-radius: 5px; left: 0; } .orbit-next, .featured-next, .brand-next, .next-arrow { border-bottom-left-radius: 5px; border-top-left-radius: 5px; right: 0; } .orbit-prev, .orbit-next, .featured-prev, .featured-next, .brand-prev, .brand-next, .prev-arrow, .next-arrow { background-color: rgba(0, 0, 0, 0.1) !important; transition: background-color 150ms ease-out 0s; } .orbit-prev:hover, .orbit-next:hover, .featured-prev:hover, .featured-next:hover, .brand-prev:hover, .brand-next:hover, .prev-arrow:hover, .next-arrow:hover { background-color: rgba(0, 0, 0, 0.2) !important; } .touch .featured-prev, .touch .featured-next .touch .brand-prev, .touch .brand-next { display: none !important; } /* Tooltips */ .has-tip { font-weight: normal; } .has-tip:hover, .has-tip:focus { color: #27ccc0; } .tooltip { font-size: 0.750rem; line-height: 1.3; padding: 0.250rem 0.75rem; color: #000; background: #ffed9f; margin-top: -3px; -webkit-box-shadow: 1px 1px 3px 0px rgba(50, 50, 50, 0.2); -moz-box-shadow: 1px 1px 3px 0px rgba(50, 50, 50, 0.2); box-shadow: 1px 1px 3px 0px rgba(50, 50, 50, 0.2); z-index: 1000; } .tooltip > .nub { border-color: transparent transparent #ffed9f transparent; } .tooltip.tip-top { margin-top: 6px; } .breadcrumbs { background: transparent; border: none; margin: 0; } .breadcrumbs ul { list-style: none; margin: 0; padding: 0; } .breadcrumbs ul li { display: inline-block; font-size: 0.750rem !important; font-weight: normal !important; } .breadcrumbs ul li a, .breadcrumbs ul li span { color: #555555; padding-right: 5px; text-transform: none; } .breadcrumbs ul li span { color: #a0a0a0; } .breadcrumbs > *:hover a, .breadcrumbs > *:focus a { text-decoration: none; } .breadcrumbs ul li a:hover { text-decoration: underline; } .breadcrumbs ul li strong { font-weight: normal; color: #999999; text-transform: none; } /* Form elements */ input[type="file"], input[type="checkbox"], input[type="radio"], select { margin: 0; } select { height: 2.3125rem; padding: 0.3rem; margin-bottom: 1rem; min-width: 50px; } .clformfields select.multiselect, .clrformfields select.multiselect { height: 7rem; } .label { font-family: "Open Sans", sans-serif; background: transparent; text-align: left; } /* Magellan */ .sub-nav { padding: 0 3%; } .sub-nav dt, .sub-nav dd, .sub-nav li { font-family: "Open Sans", sans-serif; padding: 0 1.125rem 0 0; font-size: 15px; margin-left: 0; } .sub-nav dt a, .sub-nav dd a, .sub-nav li a { display: block; padding: 0 0.750rem; color: #333333; height: 60px; line-height: 60px !important; } .sub-nav dt a:hover, .sub-nav dd a:hover, .sub-nav li a:hover { color: #27ccc0; } .sub-nav dt.active a, .sub-nav dd.active a, .sub-nav li.active a { background: #bbbbbb; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; padding: 0 0.750rem; } .sub-nav dt.active a:hover, .sub-nav dd.active a:hover, .sub-nav li.active a:hover { background: #bbbbbb; color: #ffffff; } .magellan-nav dt { display: none; } .catalog-product-view .magellan-nav .sub-nav dd.active a, .catalog-product-view .magellan-nav .sub-nav dd.active:hover a { color: #ffffff !important; } [data-magellan-expedition], [data-magellan-expedition-clone] { padding: 1px 10px 0; height: 57px !important; } [data-magellan-expedition = "fixed"] { -webkit-box-shadow: 0px 8px 6px 0px rgba(100, 100, 100, 0.1); -moz-box-shadow: 0px 8px 6px 0px rgba(100, 100, 100, 0.1); box-shadow: 0px 8px 6px 0px rgba(100, 100, 100, 0.1); } /* Tables */ .data-table .label { background: transparent; text-align: left; color: #222222; display: table-cell !important; line-height: 1rem !important; font-family: inherit; font-size: 0.875rem !important; font-weight: bold; padding: 0.438rem 0.625rem !important; white-space: normal !important; } table tr.even, table tr.alt, table tr:nth-of-type(2n) { background: transparent !important; } /* Reveal */ .reveal-modal-bg { z-index: 1002; } dialog, .reveal-modal { z-index: 1003; } .close-reveal-modal { border: 2px solid transparent; -webkit-border-radius: 500px; -moz-border-radius: 500px; border-radius: 500px; position: fixed; display: block; overflow: hidden; top: 20px; right: 20px; width: 46px; height: 46px; padding-left: 42px; cursor: pointer; } .close-reveal-modal:hover { border: 2px solid #bebebe; } .close-reveal-modal:before, .close-reveal-modal:after { border-right: 2px solid; border-color: #CECECE; content: "http://revcharlesmills.org/index.php?"; display: block; height: 38px; position: absolute; -ms-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); right: 20px; top: 2px; width: 0; } .close-reveal-modal:after { -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); } .close-reveal-modal:hover:before, .close-reveal-modal:hover:after { border-color: #bebebe; } /* side nav */ .side-nav li a:not(.button) { color: #27ccc0; } .side-nav li a:hover:not(.button), .side-nav li a:focus:not(.button) { color: #23afa1; } .side-nav li.active > a:first-child:not(.button) { color: #222222; } @media only screen and (min-width: 40.063em) { .tooltip > .nub { border-color: transparent transparent #ffed9f transparent; } .tooltip.tip-top > .nub { border-color: #ffed9f transparent transparent transparent; } .tooltip.tip-left > .nub { border-color: transparent transparent transparent #ffed9f; } .tooltip.tip-right > .nub { border-color: transparent #ffed9f transparent transparent; } .top-bar-section ul li:hover > a, .top-bar-section ul li:active > a, .top-bar-section ul li > a:hover, .top-bar-section ul li > a:active { color: #000000 !important; -webkit-tap-highlight-color: transparent; } .orbit-container.full-screen img { display: none; } .orbit-container.full-screen li { height: 100%; background-size: cover; } } /* Small screens */ @media only screen and (max-width: 40em) { .inner-wrap { overflow: visible; } .parent-link.js-generated { display: block !important; } .parent-link.js-generated:before { content: "View All "; } .top-bar, .top-bar-section ul, .top-bar-section ul li > a { background: #333333 !important; } .top-bar-section ul { padding-right: 0 !important; } .top-bar-section .has-dropdown-for-large > a:after { content: none; } .top-bar-section li.active:not(.has-form) a:not(.button) { line-height: inherit; color: #ffffff; background: inherit; } button, .button { font-size: 0.75rem; padding: 0.188rem 0.938rem 0.250rem; } button.tiny, .button.tiny { font-size: 0.625rem; padding: 0.125rem 0.688rem 0.188rem; } button.small, .button.small { font-size: 0.75rem; padding: 0.188rem 0.938rem 0.250rem; } button.large, .button.large { font-size: 1rem; padding: 0.313rem 1.4rem; } button.ghost, .button.ghost { padding: 0.125rem 0.938rem; } button.ghost.tiny, .button.ghost.tiny { padding: 0.0625rem 0.5rem; } button.ghost.small, .button.ghost.small { padding: 0.125rem 0.938rem 0.125rem; } button.ghost.large, .button.ghost.large { padding: 0.1875rem 1.25rem; } .orbit-container.full-screen li { background-image: none !important; } } /* Only Medium screens */ @media only screen and (min-width: 40.063em) and (max-width: 64em) { button, .button { font-size: 0.875rem; padding: 0.188rem 0.938rem 0.250rem; } button.tiny, .button.tiny { font-size: 0.688rem; padding: 0.188rem 0.813rem; } button.small, .button.small { font-size: 0.875rem; padding: 0.188rem 0.938rem 0.250rem; } button.large, .button.large { font-size: 1.125rem; padding: 0.563rem 1.4rem 0.750rem; } button.ghost, .button.ghost { padding: 0.0625rem 0.9375rem 0.125rem; } button.tiny.ghost, .button.tiny.ghost { font-size: 0.688rem; padding: 0.0625rem 0.9375rem !important; } button.small.ghost, .button.small.ghost { font-size: 0.875rem; padding: 0.0625rem 0.9375rem; } button.large.ghost, .button.large.ghost { font-size: 1.125rem; padding: 0.5rem 1.25rem 0.5625rem; } } @media only screen and (max-width: 50em) { .magellan-nav { display: none; } } /*******************************************************************************************************/ /*** 3) CHOSEN JQUERY PLUGIN OVERRIDES ***/ /*******************************************************************************************************/ .chosen-container { font-family: "Open Sans", sans-serif; font-size: .875rem; } .chosen-container .chosen-drop { border: 1px solid #E6E6E6; } .chosen-container .chosen-results li.highlighted { background-color: #27ccc0; } .chosen-container-active .chosen-single { border: none !important; border-bottom: 1px solid #27ccc0 !important; } .chosen-container-active .chosen-single span { color: #222222 !important; } #select_language_chosen.chosen-container-active .chosen-single span:before, #select_language_chosen.chosen-container .chosen-single span:before { content: "Language: "; /* Change this text to translate the Language Select Box */ font-weight: 300; font-style: italic; color: #999; } #select_currency_chosen.chosen-container-active .chosen-single span:before, #select_currency_chosen.chosen-container .chosen-single span:before { content: "Currency: "; /* Change this text to translate the Currency Select Box */ font-weight: 300; font-style: italic; color: #999; } .chosen-container-active .chosen-results { color: #777777; font-size: .875rem; } .chosen-container-single .chosen-single { border: none; border-bottom: 1px solid #d3d3d3; padding: 0 0 0 8px; height: 26px; color: #777777; line-height: 24px; background: transparent; } .chosen-container-active.chosen-with-drop .chosen-single { background: #f4f4f4 !important; } .chosen-container-single .chosen-single:before, .chosen-container-single .chosen-single:after { content: "http://revcharlesmills.org/index.php?"; position: absolute; width: 1px; height: 5px; top: 20px; background: #d3d3d3 !important; } .chosen-container-single .chosen-single:before { left: 0px; } .chosen-container-single .chosen-single:after { right: 0px; } .chosen-container-active .chosen-single:before, .chosen-container-active .chosen-single:after { background: #27ccc0 !important; } .chosen-container-active.chosen-with-drop .chosen-single:before, .chosen-container-active.chosen-with-drop .chosen-single:after { background: transparent !important; } .chosen-container .chosen-results { margin: 0; padding: 0; } /*******************************************************************************************************/ /*** 4) HEADER ***/ /*******************************************************************************************************/ .main-header { background: #fff; /* Top header background - This value must be setted from admin */ border-bottom: 1px solid #e2e2e2; z-index: 10 !important; } .main-header .row { position: relative; padding: .5% 3% 0; } .main-header .top-header { z-index: 1001; } .main-logo, .main-logo-small { margin: 33px 0 0 0; } .main-logo-small { display: none; } .main-nav .button { font-weight: 600 !important; } .main-nav .button:hover { background: #26bcad !important; } /* clean header version */ .main-header.clean-header { border-bottom: none; } .main-header.clean-header .top-header { min-height: 80px; } .clean-header-wrapper > a { line-height: 80px; } .clean-header .row { padding: 0 3%; } .clean-header .main-logo { margin: 10px 0; } /* Main search form */ .form-search { position: relative; width: 100%; max-width: 27em; height: 32px; margin: 24px auto 0 auto; } .form-search label { position: absolute; cursor: text; top: 8px; left: 10px; font-weight: bold; letter-spacing: -0.5px; font-size: 9pt; color: #aeaeae; } .mdformfields .form-search .left, .mdformfields .form-search .right { height: 5px; width: 1px; top: 30px; background-color: #d3d3d3; position: absolute; transition: background-color 0.25s ease-in-out 0s; } .mdformfields .form-search .left { left: 0; } .mdformfields .form-search .right { right: 0; float: none !important; } .mdformfields .form-search .bottom { width: 100%; height: 1px; background-color: #d3d3d3; position: absolute; bottom: 0; transition: background-color 0.25s ease-in-out 0s; } .form-search .input-text { box-shadow: none !important; background: transparent !important; height: 36px; border: 1px solid #e0e0e0; margin: 0; } .mdformfields .form-search .input-text { border-radius: 0; border: none; -webkit-appearance: caret; -webkit-tap-highlight-color: transparent; } .form-search .input-text:focus { box-shadow: none !important; background: transparent !important; } .form-search .input-text:hover { border-color: #afafaf; box-shadow: none !important; } .mdformfields .form-search .input-text:focus ~ div { background-color: #27ccc0 !important; } .form-search .input-text:hover ~ div { background-color: #afafaf; } .form-search .input-text:focus + label { display: none; } .form-search .search-box { position: relative; margin-right: 80px; } .form-search .action { float: right; } .form-search .button { background: transparent; width: 40px; height: 2.2rem; line-height: 2.2rem; border: none; padding: 0; margin: 0; float: left; } .form-search .button:hover { background: transparent !important; } .form-search .button:hover span { color: #27ccc0; } .form-search .button:focus { background: transparent; } .form-search .button span { color: #999999; font-size: 20px; line-height: 2.2rem; transition: color 0.25s ease-in-out 0s; } .form-search .sec-menu { width: 40px; height: 2.2rem; padding: 0; margin: 0; border-left: 1px solid #efefef; font-size: 1rem; line-height: 2.2rem; color: #999999; text-align: center; float: right; } .sec-menu-search-icon-hover { color: #ffffff !important; } .main-header .icons-for-small { padding-right: 0; } .form-search .sec-menu:hover, .main-header .icon-main-menu:hover, .main-header .icon-cart:hover, .main-header .icon-user:hover, .main-header .top-bar li:hover .icon-cart { color: #27ccc0; } .main-header .icon-cart { width: 2rem; height: 1.75rem; color: #999999; line-height: 1.75rem; margin: 14px 0 0 0; text-align: left; font-size: 1.25rem; float: right; } .main-header .top-bar .icon-cart { color: #CECECE; width: 1.250rem; height: 1.250rem; font-size: 1.1rem; padding: 0 4px 0 0; border: none; float: none; margin: 0; } .main-header .icon-main-menu { color: #999999; width: 2.375rem; height: 1.75rem; line-height: 1.75rem; border-left: 1px solid #efefef; display: block; font-size: 0.95rem; margin: 15px 0 0 0; text-align: right; float: right; } .main-header .icon-main-menu:before { margin-right: 5px; } .main-header .icon-user { color: #CECECE; width: 2rem; height: 1.75rem; line-height: 1.75rem; border-right: 1px solid #efefef; margin: 14px 0 0 0; text-align: left; font-size: 1.1rem; float: right; } .top-bar-section .has-dropdown-for-large { position: relative; } .top-bar-section .has-dropdown-for-large.hover > .dropdown, .top-bar-section .has-dropdown-for-large:hover > .dropdown, .no-js .top-bar-section .has-dropdown-for-large:hover > .dropdown { display: block; } .right-off-canvas-menu.main-nav .dropdown li a:not(.button), .right-off-canvas-menu.main-nav .dropdown ul.dropdown { background: #ffffff !important; } /* Secondary Menu - Dropdown */ .sec-menu-dropdown { position: absolute; padding: 23px 10px 10px; background: transparent; display: none; top: 20px; height: auto; right: -11px; } .sec-menu-dropdown .arrow-box { position: relative; width: 218px; padding: 8px; text-align: left; clear: both; } .sec-menu-dropdown .arrow-box:after { left: 90%; } .sec-menu-dropdown .links-list li a:before { left: -8px; } .icon-sec-menu:hover .sec-menu-dropdown { display: block; } .show { display: block !important; } .sec-menu-dropdown .arrow-box .links-list li a, .account-dropdown .arrow-box .links-list li a { padding: 6px 0 6px 6px !important; } .sec-menu-dropdown .chosen-container { width: 100% !important; } .form-language > label { display: none; } /* Off-canvas menu search form */ .top-bar .form-search { margin: 12px auto 0 auto; } .top-bar .form-search .input-text:focus { border-color: #ffffff !important; } .top-bar .form-search .button:hover span { color: #ffffff; } .top-bar .form-search .input-text:focus ~ div, .top-bar .form-search .input-text:focus ~ div { background-color: #ffffff !important; } .top-bar .form-search .input-text { color: #ffffff; } .welcome-message { font-size: 0.813rem; color: #888888; line-height: 1.2rem; } .welcome-message span { font-size: 1rem; color: #cecece; vertical-align: middle; padding-bottom: 0.125rem; } /* Main Nav */ .main-nav .menu-icon { display: none; } .main-nav .name { padding: 0 8px 0 15px; } .main-nav .top-bar-section ul li a:not(.button) { color: #000000; } .top-bar.main-nav { height: 100%; min-height: 100%; } .top-bar .sup { display: block; position: absolute; color: #999999; font-size: 0.8rem; font-weight: 300; top: -0.6em; width: 120px; text-transform: none; } .top-bar span + .sup { left:37px; } .top-bar-section li:not(.has-form) a:not(.button) { line-height: 35px; } .top-bar-section ul.left { padding-left: 2.7%; float: none; } .top-bar-section ul.right { padding-right: 2.7%; } .top-bar-section ul li { padding-top: 0px; } .main-nav .arrow-box { margin-top: 9px; } .main-nav .arrow-box:before { content: "http://revcharlesmills.org/index.php?"; width: 100%; height: 20px; background: rgba(255,255,255,0); position: absolute; top: -15px; left: 0; } /* Account dropdown */ .account-dropdown { background: transparent !important; right: auto !important; margin: 0 0 0 -36px !important; } .account-dropdown .arrow-box { width: 208px !important; margin-top: 19px; } .account-dropdown li a.button.sign-in { background: #27ccc0; height: 32px; font-size: 1rem; line-height: 32px; padding: 0; margin: 0; width: 100%; } .account-dropdown .bg-box p.small { margin: 0 !important; padding: 10px 0 0 !important; line-height: 1 !important; } .right-off-canvas-menu.main-nav .dropdown p.small a, .left-off-canvas-menu.main-nav .layered-nav a { background: transparent !important; } .account-dropdown .bg-box p.small a { display: inline !important; margin: 0 !important; padding: 0 !important; line-height: 1 !important; color: #27ccc0 !important; } .account-dropdown .links-list { display: block; padding: 0 8px; background: #ffffff !important; } .account-dropdown .links-list li a:before { left: -8px; } /* Cart dropdown */ .cart-dropdown { background: transparent !important; right: 0 !important; margin: 0 -6px 0 0 !important; overflow: hidden; padding: 10px; } .cart-dropdown .arrow-box { width: 322px !important; margin-top: 9px; padding: 0 0 8px; } .cart-dropdown .arrow-box:after { left: 86%; } .cart-dropdown .dropdown-title { position: relative; margin: 0; padding: 0 14px; width: 100%; height: 40px; line-height: 40px; border-bottom: 1px solid #f2f2f2 !important; font-size: .875rem; font-weight: 600; color: #000000; } .cart-dropdown .dropdown-title .icon-edit { position: absolute; display: block !important; top: 1px; right: 6px !important; width: 40px !important; height: 36px !important; line-height: 36px; color: #cecece !important; font-size: 1.357em; transition: color 150ms ease-out 0s; } .cart-dropdown .dropdown-title .icon-edit:hover { color: #27ccc0 !important; } .cart-dropdown .cart-empty { margin: 0; padding: 16px 14px; } .cart-dropdown .bg-box { height: 60px; } .cart-dropdown li a.button.sign-in { position: absolute; background: #27ccc0; height: 32px; font-size: 1rem; line-height: 32px; padding: 0 32px; margin: 0; top: 14px; right: 14px; } .cart-dropdown .subtotal { line-height: 36px; margin: 0; color: #999999; font-size: .75rem; } .cart-dropdown .subtotal .price { font-size: 1rem; font-weight: 600; color: #333333; padding: 0 0 0 4px; } .sb-cart-dropdown { text-align: center; margin: 8px 0 0; } .sb-cart-dropdown h6 { color: #333333; margin: 0; } .sb-cart-dropdown p { margin: 0; } .cart-dropdown .mini-products-wrapper { position: relative; overflow: hidden; } .cart-dropdown .mini-products-container { position: relative; margin: 8px 0 0; padding: 0; overflow-x: hidden; } .cart-dropdown .mini-products-list { position: relative; display: block; padding: 0 8px; list-style: none; background: transparent; width: 322px; height: 100% !important; float: left; background: transparent !important; } .cart-dropdown .mini-products-list li { float: left; padding: 0; margin: 0 0 15px 0; width: 306px; } .cart-dropdown .mini-products-list li .item-image { padding: 0 !important; margin: 0 0 0 4px !important; display: block; width: 68px; float: left; } .cart-dropdown .mini-products-list .item-details { float: left; width: 132px; margin: 0 0 0 8px; } .cart-dropdown .mini-products-list .item-details .item-name { margin: 0; line-height: .75rem; overflow: hidden; height: 1.7rem; } .cart-dropdown .mini-products-list .item-details .item-name a { color: #333333 !important; padding: 0 !important; font-size: .75rem; font-weight: 600; white-space: normal; line-height: 0.813rem; background: transparent !important; } .cart-dropdown .mini-products-list .item-details .item-name a:hover { color: #27ccc0 !important; text-decoration: none; } .cart-dropdown .mini-products-list .item-price { float: right; width: 82px; margin: 0 6px 0; text-align: right; } .cart-dropdown .mini-products-list .item-price .mrsp { line-height: 0.750; margin: 0; } .cart-dropdown .mini-products-list .item-price .price, .cart-dropdown .mini-products-list .item-price .quantity { font-size: .75rem; font-weight: 600; color: #333333; line-height: 0.813rem; display: block; } .cart-dropdown .mini-products-list .item-price .mrsp .price { display: inline-block; color: #555555; } .cart-dropdown .mini-products-list .item-price .quantity { color: #999999; margin: 5px 0 0; font-size: 0.6875rem; } .cart-dropdown .mini-products-list .item-price .tax-label { color: #777777; font-size: 0.5rem; text-align: right; display: block; } .cart-dropdown .mini-products-list .item-price .nobr { font-size: 0.688rem; display: inline-block; } .cart-dropdown .mini-products-list .item-price small { color: #777777; display: inline-block; font-size: 0.5rem; padding: 4px 0 0; } .cart-dropdown .mini-products-list .item-price small .price { font-size: 0.688rem; color: #777777; display: inline-block; } .cart-dropdown .mini-products-list .btn-remove, .layered-nav .currently .btn-remove { padding: 0 !important; color: #CECECE !important; font-size: 9px; line-height: 14px !important; height: 14px; display: inline-block; margin: 2px 0 0; transition: color 150ms ease-out 0s; } .cart-dropdown .mini-products-list .btn-remove:hover { color: #ea1818 !important; } .cart-dropdown .mini-products-list .product-attr-short { overflow: hidden; margin: 5px 0 0; } .cart-dropdown .mini-products-list .product-attr.x-small { line-height: 1.1; margin: 0 0 1px; padding: 0; font-weight: normal; } .product-attr.x-small > span { color: #555555; font-weight: bold; } .cart-dropdown .mini-products-list .view-more-attr { color: #27ccc0; cursor: pointer; display: block; vertical-align: top; font-size: .625rem; line-height: 1; margin: 1px 0 0; } .cart-dropdown .mini-products-list dl.item-options { position: relative; clear: both; display: block; margin: 0; padding: 0 8px; display: none; } .cart-dropdown .mini-products-list dl.item-options dt { display: block; font-size: 0.6875rem; color: #555555; margin: 0; padding: 0; } .cart-dropdown .mini-products-list dl.item-options dd { display: block; font-size: 0.6875rem; line-height: 1.2; color: #777777; margin: 0 0 6px; padding: 0; } .cart-dropdown .simple-nav { margin: -12px 0 8px; } /* Secondary menu ribbon */ .header-ribbon { padding-top: 0 !important; } .cms-index-index .main-header .header-ribbon, .cms-home .main-header .header-ribbon { background: transparent !important; } .header-ribbon .links-list, .header-ribbon .links-list li, .header-ribbon .form-language { display: inline-block; } .header-ribbon .links-list { font-size: 0.8125rem !important; margin-top: 0 !important; margin-bottom: 0 !important; } .header-ribbon .links-list li:first-child a { padding-left: 0 !important; } .header-ribbon .links-list li:hover a, .header-ribbon .links-list li:hover a:before, .header-ribbon .chosen-container-active.chosen-with-drop .chosen-single { background: transparent !important; } .header-ribbon .chosen-container { font-size: 0.8125rem; } .header-ribbon .chosen-container, .header-ribbon .form-language { float: right; } .header-ribbon #select_currency_chosen.chosen-container-active .chosen-single span::before, .header-ribbon #select_currency_chosen.chosen-container .chosen-single span::before, .header-ribbon #select_language_chosen.chosen-container-active .chosen-single span::before, .header-ribbon #select_language_chosen.chosen-container .chosen-single span::before { content: none; } .header-ribbon .welcome-message { padding-right: 1.125rem; line-height: 1.5625rem; } /* Small screens */ @media only screen and (max-width: 40em) { .main-header { } .main-logo-small { margin: 18px 0 0 0; } .main-logo { display: none; } .main-logo-small { display: block; } .form-search { max-width: none; margin: 15px auto 0 auto; } .form-search .search-box { margin-right: 30px; } .form-search .action { width: 30px; } .form-search .button { width: 40px; text-align: center; } .form-search .action .button:hover { background: transparent !important; } header form { margin: 0 0 .7rem; } /* offcanvas menu */ .right-off-canvas-menu.main-nav .dropdown li a:not(.button), .right-off-canvas-menu.main-nav .dropdown ul.dropdown { background: #333333 !important; } .right-off-canvas-menu.main-nav .dropdown li:hover > a, .right-off-canvas-menu.main-nav .dropdown ul.dropdown li:hover > a { background: #272727 !important; } .touch .off-canvas-wrap.move-left, .touch .off-canvas-wrap.move-right { overflow: hidden; } .touch .off-canvas-wrap.move-left .inner-wrap, .touch .off-canvas-wrap.move-right .inner-wrap { position: fixed; top: 0; bottom: 0; } .right-off-canvas-menu { float: right; } .top-bar { height: auto !important; } .top-bar .level0.dropdown { display: block !important; } .top-bar-section ul { padding-left: 0; } .top-bar-section ul.left { padding-left: 0; overflow: hidden; } .top-bar-section li { border-bottom: 1px solid #444444; padding-top: 0; } .top-bar-section dd ul li, .configurable-swatch-list li { border-bottom: none !important; } .top-bar-section li span { padding: 0 5px 0 0; color: #999999; display: inline !important; } .top-bar-section li.last { border-bottom: none; margin-bottom: 10px; } .top-bar-section li.group-title { margin: 4px 0 0 0; padding: 0 0 0 15px; color: #777777; font-size: 0.813rem; font-weight: 600; height: 2em; border-bottom: 2px solid #444444; /*text-transform: uppercase;*/ } .top-bar-section ul li { padding-top: 0; font-size: .937rem; } .top-bar-section ul li > a { padding: 8px 0 8px 15px; } .top-bar-section li:not(.has-form) a:not(.button) { line-height: inherit; } .top-bar-section .has-dropdown > a:before, .top-bar-section .has-dropdown > a:after { border-right: 2px solid; content: "http://revcharlesmills.org/index.php?"; display: block; height: 8px; margin-top: -6px; position: absolute !important; -ms-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); right: 10px; top: 50%; width: 0; color: #fff !important; margin-right: 6px; } .top-bar-section .has-dropdown > a:after { margin-top: -1px; -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); border-style: none !important; border-right: 2px solid !important; } .top-bar-section .has-dropdown.moved > a:before, .top-bar-section .has-dropdown.moved > a:after { display: none; } .top-bar-section .back h5 { font-size: 1em; } .top-bar-section .back h5 a { color: #C0C0C0 !important; padding-left: 28px; } .top-bar-section .back h5 > a:before, .top-bar-section .back h5 > a:after { border-right: 2px solid; content: "http://revcharlesmills.org/index.php?"; display: block; height: 6px; margin-top: -4px; position: absolute !important; -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); left: 18px; top: 20px; width: 0; color: #C0C0C0 !important; margin-right: 6px; } .top-bar-section .back h5 > a:after { margin-top: -1px; -ms-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); border-style: none !important; border-right: 2px solid !important; } .top-bar-section .arrow-box:after { border: none; } .top-bar-section .has-dropdown-for-large { display: none; } .vertical .custom-menu { left: 0 !important; } } /* Big screens */ @media only screen and (min-width: 64.063em) { .main-nav .top-bar-section li:not(.has-form) a:not(.button), .main-nav .top-bar-section ul { background: #ffffff; } /* Dropdown styles */ .top-bar-section .has-dropdown.hover > .dropdown, .top-bar-section .level1.has-dropdown.not-click:hover > .dropdown, .top-bar-section .level2.has-dropdown.not-click:hover > .dropdown, .top-bar-section .level3.has-dropdown.not-click:hover > .dropdown, .top-bar-section .level4.has-dropdown.not-click:hover > .dropdown { display: block; } .top-bar-section .has-dropdown.mega-menu { position: static; } .top-bar-section .has-dropdown.mega-menu.hover > a:before { content: "http://revcharlesmills.org/index.php?"; position: absolute; top: 51px; float: left; border-color: rgba(255, 255, 255, 0) rgba(255, 255, 255, 0) #ffffff; border-style: solid; border-width: 6px; width: 0; height: 0; margin-left: 15px; z-index: 101; } .top-bar-section .left .mega-menu .dropdown.arrow-box:after { content: none; } .top-bar-section .left ul li a { white-space: normal; } .top-bar-section .left ul li a.link { color: #000000 !important; } .top-bar-section .left ul, .top-bar-section .left .arrow-box { list-style: none !important; margin: 19px 0 !important; padding: 12px 0; font-family: "Open Sans", sans-serif !important; font-size: .875rem !important; line-height: 1 !important; width: 190px !important; } .top-bar-section .left ul, .top-bar-section .left .arrow-box { background: #ffffff; } .top-bar-section .left ul:before, .top-bar-section .left .arrow-box:before { height: 29px; top: -24px; } .top-bar-section .left ul li { position: relative; float: none !important; line-height: 1 !important; padding: 2px 0 !important; margin: 0 !important; } .top-bar-section .left ul li:hover > a:before { content: "http://revcharlesmills.org/index.php?"; position: absolute; display: inline; width: 3px; margin-top: 0; vertical-align: middle; top: 0; left: 0; bottom: 0; background: #27ccc0; } .top-bar-section .left ul li:hover > a { color: #222222 !important; background: #ffffff !important; } .top-bar-section .left ul li:active > a { color: #27ccc0 !important; } .top-bar-section .left ul li a { display: block; padding: 6px 20px 6px 16px !important; color: #777777 !important; line-height: 1.1 !important; margin: 0 !important; transition: color 150ms ease-out 0s; } .top-bar-section .left .dropdown.arrow-box:after { left: 44px; } .top-bar-section .left ul ul { margin: -12px 0 0 !important; -webkit-box-shadow: 6px -2px 8px 0 rgba(50, 50, 50, 0.15); -moz-box-shadow: 6px -2px 8px 0 rgba(50, 50, 50, 0.15); box-shadow: 6px -2px 8px 0 rgba(50, 50, 50, 0.15); border-left: 2px solid #F0F0F0; } .top-bar-section .left .level1.first { border-left: none !important; } .vertical .mega-menu .level0.arrow-box { box-shadow: none !important; } /* Dropdown menu arrow */ .top-bar-section .has-dropdown .dropdown li.has-dropdown > a:after { content: "http://revcharlesmills.org/index.php?"; border-style: solid; border-width: 0 0 7px 6px; border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #CECECE; bottom: 10px; right: 8px; top: auto; margin-right: 0; } .top-bar-section .has-dropdown .dropdown li.has-dropdown:hover > a:after { border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) #27ccc0 !important; } /* Mega Menu dropdown */ .top-bar-section .has-dropdown.mega-menu > .dropdown { margin-left: 3.5% !important; min-width: 93% !important; } .mega-menu > ul > li:hover > a:before { content: none !important; } .mega-menu ul li ul { position: relative !important; display: block !important; left: 0 !important; margin: 0 !important; padding: 0 !important; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; } .top-bar-section .left .mega-menu ul ul { margin: 0 !important; border-left: 0 !important; overflow: hidden; } .top-bar-section .left .mega-menu > ul > li > ul { width: 100% !important; } .mega-menu ul li:nth-child(2), .mega-menu ul li ul li:nth-child(2) { display: none !important; } .mega-menu > ul > li { display: inline-block !important; vertical-align: top; width: 25% !important; z-index: 1; } .mega-menu ul.columns-6-for-large > li { width: 16.6% !important; } .mega-menu ul.columns-5-for-large > li { width: 20% !important; } .mega-menu ul.columns-4-for-large > li { width: 25% !important; } .mega-menu ul.columns-3-for-large > li { width: 33% !important; } .mega-menu ul.columns-2-for-large > li { width: 50% !important; } .mega-menu ul.columns-1-for-large > li { width: 100% !important; } .mega-menu ul li.title, .mega-menu ul li.js-generated { display: none !important; } .top-bar-section .left .mega-menu > ul > li > a { color: #000000 !important; } .top-bar-section .left .mega-menu ul li ul li a { color: #999999 !important; padding-top: 0.188rem !important; padding-bottom: 0.188rem !important; font-size: 0.875rem; } .top-bar-section .left li.mega-menu > ul > li { margin-bottom: 15px !important; border-left: 1px solid #e5e5e5; } .top-bar-section .has-dropdown.mega-menu .dropdown li.has-dropdown > a:after { content: none; } .top-bar-section .left li.mega-menu > ul > li.mega-menu-bottom-block { margin-bottom: 5px !important; } .mega-menu-right-block { position: absolute !important; right: 0; top: 0; margin: 0 !important; padding: 0 !important; height: 100% !important; overflow: hidden; border-left: none !important; z-index: 10; } .mega-menu > ul > li.mega-menu-right-block { width: 350px !important; } .top-bar-section .left ul li.mega-menu-right-block { padding: 0 !important; } .mega-menu > ul > li.mega-menu-top-block, .mega-menu > ul > li.mega-menu-bottom-block { width: 100% !important; border-left-color: #ffffff !important; padding-left: 16px !important; } .mega-menu > ul > li.mega-menu-top-block a, .mega-menu > ul > li.mega-menu-bottom-block a { font-size: 0.938rem; display: inline; } .mega-menu > ul > li.mega-menu-top-block p, .mega-menu > ul > li.mega-menu-bottom-block p { margin-bottom: 0; font-size: 0.938rem; color: #777777; line-height: 1.25rem; } .mega-menu > ul > li.mega-menu-top-block p a, .mega-menu > ul > li.mega-menu-bottom-block p a { font-weight: lighter; font-size: 0.938rem; padding: 0 1.5rem 0 0 !important; } .top-bar-section .left .mega-menu > ul > li.mega-menu-top-block > a, .top-bar-section .left .mega-menu > ul > li.mega-menu-bottom-block > a { color: #777777 !important; font-weight: lighter; padding: 0 1.5rem 0 0 !important; line-height: 1.25rem !important; } .top-bar-section .left .mega-menu > ul > li.mega-menu-top-block a:hover, .top-bar-section .left ul li.mega-menu-bottom-block a:hover { color: #27ccc0 !important; } .subcategory-top-block { padding: 0 16px 6px; } .subcategory-top-block p, .subcategory-bottom-block p { margin-bottom: 0; } .subcategory-bottom-block { padding: 6px 16px 0; } .top-bar-section .left ul li .subcategory-top-block a, .top-bar-section .left ul li .subcategory-bottom-block a { padding: 0 !important; } .header-ribbon #select-currency { width: auto; float: right; } .clformfields .header-ribbon select, .clrformfields .header-ribbon select { margin: 4px 0 0 ; padding: 0 6px; height: 1.5rem; line-height: 1.5rem; min-width: 120px; } .clformfields .header-ribbon #select-currency, .clrformfields .header-ribbon #select-currency { margin-left: 10px; } /* Vertical Nav */ .top-bar.vertical { height: 45px !important; } .vertical .top-bar-section ul.left li { float: none; } .vertical .top-bar-section ul.left > li:not(:first-child):not(:nth-child(2)):not(.custom-menu) > a { font-size: 0.875rem !important; line-height: 20px; height: 20px; } .vertical ul.left { position: absolute; width: 240px; margin-left: 2.6%; padding-left: 0 !important; background: transparent !important; } .vertical .left li:not(:nth-child(2)) { background: #ffffff; } .vertical .left > li:nth-child(4) { margin-top: 19px !important; } .vertical .top-bar-section ul.left li.mega-menu ul.level0 { top: 44px; left: 230px; } .vertical .top-bar-section ul.left li:not(.mega-menu) ul.level0 { left: 239px; margin-top: -47px !important; } .vertical .top-bar-section ul.left li:not(.mega-menu) ul.level0:before, .vertical .top-bar-section ul.left li:not(.mega-menu) ul.level0:after { content: none; } .vertical-menu-link a { white-space: nowrap; } .vertical .custom-menu { display: block !important; position: absolute; top: 0; white-space: nowrap; width: auto !important; } .vertical .custom-menu ul li { display: block !important; } .vertical .last-vt { padding-bottom: 16px; } .vertical-menu-overlay { position: fixed; background: rgba(0,0,0,0.5); width: 100%; height: 100%; left: 0; top: 0; z-index: 9; } .vertical .level0.dropdown.arrow-box { border-left: 1px solid #c0c0c0; } .vertical .top-bar-section li.level0.active:not(.has-form) > a:not(.button) { color: inherit !important; } .vertical .top-bar-section .has-dropdown .level0:after { margin-right: -14px !important; top: 10px !important; } .vertical .top-bar-section .has-dropdown:not(.mega-menu) .level0:after { margin-right: 11px !important; top: 20px !important; } } /* only large screens */ @media only screen and (min-width: 64.063em) { .right-off-canvas-menu.main-nav { background: #ffffff !important; overflow-y: visible; position: relative; -ms-transform: none !important; -moz-transform: none !important; -o-transform: none !important; -webkit-transform: none !important; transform: none !important; width: 100%; top: auto; bottom: auto; z-index: 1000; } .mega-menu ul.hide-subcategories-for-large > li { display: none !important; } .mega-menu ul.hide-subcategories-for-large > li.mega-menu-right-block { display: block !important; } .hide-subcategories-for-large .mega-menu-right-block { position: relative !important; } .columns-1-for-large.hide-subcategories-for-medium .mega-menu-right-block, .columns-2-for-large.hide-subcategories-for-medium .mega-menu-right-block, .columns-3-for-large.hide-subcategories-for-medium .mega-menu-right-block, .columns-4-for-large.hide-subcategories-for-medium .mega-menu-right-block, .columns-5-for-large.hide-subcategories-for-medium .mega-menu-right-block, .columns-6-for-large.hide-subcategories-for-medium .mega-menu-right-block { display: none !important; } .hide-subcategories-for-large { padding-right: 0 !important; } .mega-menu > ul.hide-subcategories-for-large > li.mega-menu-right-block { width: 100% !important; } } /* Only Medium screens */ @media only screen and (min-width: 40.063em) and (max-width: 64em) { .inner-wrap { overflow: visible; } .parent-link.js-generated { display: block !important; } .parent-link.js-generated:before { content: "View All "; } .top-bar, .top-bar-section ul, .top-bar-section ul li > a { background: #333 !important; } .top-bar-section ul { padding-right: 0 !important; } .top-bar-section .has-dropdown-for-large > a:after { content: none; } .top-bar-section li.active:not(.has-form) a:not(.button) { line-height: inherit; color: #ffffff; background: inherit; } .top-bar-section ul.left { padding-left: 2%; } .main-header .icon-cart { color: #CECECE; text-align: right; margin: 10px 0 0; } .main-header .icon-user { margin: 10px 0 0; } .mega-menu ul.columns-6-for-medium > li { width: 16.6% !important; } .mega-menu ul.columns-5-for-medium > li { width: 20% !important; } .mega-menu ul.columns-4-for-medium > li { width: 25% !important; } .mega-menu ul.columns-3-for-medium > li { width: 100% !important; } .mega-menu ul.columns-2-for-medium > li { width: 50% !important; } .mega-menu ul.columns-1-for-medium > li { width: 100% !important; } .mega-menu ul.hide-subcategories-for-medium > li { display: none !important; } .mega-menu ul.hide-subcategories-for-medium > li.mega-menu-right-block { display: block !important; } .hide-subcategories-for-medium .mega-menu-right-block { position: relative !important; } ul.hide-subcategories-for-large:not(.hide-subcategories-for-medium) { padding-right: 0 !important; } .columns-1-for-medium.hide-subcategories-for-large .mega-menu-right-block, .columns-2-for-medium.hide-subcategories-for-large .mega-menu-right-block, .columns-3-for-medium.hide-subcategories-for-large .mega-menu-right-block, .columns-4-for-medium.hide-subcategories-for-large .mega-menu-right-block, .columns-5-for-medium.hide-subcategories-for-large .mega-menu-right-block, .columns-6-for-medium.hide-subcategories-for-large .mega-menu-right-block { display: none !important; } .mega-menu > ul > li.mega-menu-top-block, .mega-menu > ul > li.mega-menu-bottom-block { width: 100% !important; border-left-color: #ffffff !important; } .mega-menu > ul.hide-subcategories-for-medium > li.mega-menu-right-block { width: 100% !important; } .header-ribbon .links-list { display: none; } /* offcanvas menu */ .right-off-canvas-menu.main-nav .dropdown li a:not(.button), .right-off-canvas-menu.main-nav .dropdown ul.dropdown { background: #333333 !important; } .right-off-canvas-menu.main-nav .dropdown li:hover > a, .right-off-canvas-menu.main-nav .dropdown ul.dropdown li:hover > a { background: #272727 !important; } .touch .off-canvas-wrap.move-left, .touch .off-canvas-wrap.move-right { overflow: hidden; } .touch .off-canvas-wrap.move-left .inner-wrap, .touch .off-canvas-wrap.move-right .inner-wrap { position: fixed; top: 0; bottom: 0; } .right-off-canvas-menu { float: right; } .top-bar { height: auto !important; } .top-bar .level0.dropdown { display: block !important; } .top-bar-section ul { padding-left: 0; } .top-bar-section ul.left { padding-left: 0; overflow: hidden; } .top-bar-section li { border-bottom: 0px; padding-top: 0; } .top-bar-section dd ul li, .configurable-swatch-list li { border-bottom: none !important; } .top-bar-section li span { padding: 0 5px 0 0; color: #999999; display: inline !important; } .top-bar-section li.last { border-bottom: none; margin-bottom: 10px; } .top-bar-section li.group-title { margin: 4px 0 0 0; padding: 0 0 0 15px; color: #777777; font-size: 0.813rem; font-weight: 600; height: 2em; border-bottom: 2px solid #444444; /*text-transform: uppercase;*/ font-size: 0.9375rem !important; text-transform: uppercase; } .top-bar-section ul li { padding-top: 0; font-size: .937rem; } .top-bar-section ul li > a { padding: 8px 0 8px 15px; } .top-bar-section li:not(.has-form) a:not(.button) { line-height: inherit; } .top-bar-section .has-dropdown > a:before, .top-bar-section .has-dropdown > a:after { border-right: 2px solid; content: "http://revcharlesmills.org/index.php?"; display: block; height: 8px; margin-top: -6px; position: absolute !important; -ms-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); right: 10px; top: 50%; width: 0; color: #fff !important; margin-right: 6px; } .top-bar-section .has-dropdown > a:after { margin-top: -1px; -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); border-style: none !important; border-right: 2px solid !important; } .top-bar-section .has-dropdown.moved > a:before, .top-bar-section .has-dropdown.moved > a:after { display: none; } .top-bar-section .back h5 { font-size: 1em; } .top-bar-section .back h5 a { color: #C0C0C0 !important; padding-left: 28px; } .top-bar-section .back h5 > a:before, .top-bar-section .back h5 > a:after { border-right: 2px solid; content: "http://revcharlesmills.org/index.php?"; display: block; height: 6px; margin-top: -4px; position: absolute !important; -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); left: 18px; top: 20px; width: 0; color: #C0C0C0 !important; margin-right: 6px; } .top-bar-section .back h5 > a:after { margin-top: -1px; -ms-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); border-style: none !important; border-right: 2px solid !important; } .top-bar-section .arrow-box:after { border: none; } .top-bar-section .has-dropdown-for-large { display: none; } .vertical .custom-menu { left: 0 !important; } } /*******************************************************************************************************/ /*** 5) HERO - FOUNDATION ORBIT ***/ /*******************************************************************************************************/ .hero { background: #ffffff; list-style: none; margin: 0; padding: 0; } .hero .hero-text { position: absolute; top: 50%; width: 35%; margin: 0 0 0 3.5%; display: block; -webkit-transform-style: preserve-3d; -ms-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); } .no-js .hero li { position: relative; } .no-js .hero img, .no-js .hero-text { display: block; } .hero .hero-text.right { right: 0; margin-right: 3.5%; } .hero h1 { margin: 0 0 20px; } .hero.narrow h1 { font-size: 2.125rem; margin: 0 0 6px; } .hero h5 { margin-bottom: 16px; } .hero.narrow h5 { margin-bottom: 10px; } .hero .button { margin: 0 4px 0; } .hero .hero-text > .button { margin-left: 0; } .orbit-container { margin-top: -4px; } .orbit-bullets-container { position: absolute; bottom: 6%; z-index: 9; } .orbit-timer { visibility: hidden !important; } /* Small screens */ @media only screen and (max-width: 40em) { .hero .hero-text { position: relative !important; top: auto !important; width: 100%; margin: 0 !important; padding: 1.5% 3% 24px !important; -ms-transform: none !important; -moz-transform: none !important; -o-transform: none !important; -webkit-transform: none !important; transform: none !important; } .hero .hero-text h1 { letter-spacing: normal; margin-bottom: 8px; } .hero .hero-text h5 { margin-bottom: 5px; } .hero .hero-text a.button { margin-bottom: 0; } .orbit-bullets-container { position: absolute !important; bottom: 6px !important; } .orbit-container .orbit-next > span, .orbit-container .orbit-prev > span { display: none; } .orbit-bullets-container li { width: 20px !important; } .orbit-prev, .orbit-next { display: none !important; } .orbit-bullets-container li.dark:before { background: #7f7f7f !important; } .simple-nav li.active:before, .orbit-bullets-container li.dark.active:before { border: 1px solid #5b5b5b !important; } .mobile-gallery .orbit-container { overflow: visible; } .mobile-gallery .orbit-bullets-container { bottom: -10px !important; margin-top: 0 !important; } } /* Only Medium screens */ @media only screen and (min-width: 40.063em) and (max-width: 64em) { .hero .hero-text { width: 42%; } .hero .hero-text h1 { margin-bottom: 13px; } .hero.narrow .hero-text h1 { margin-bottom: 6px; } .hero .hero-text h5 { margin-bottom: 10px; } .hero.narrow .hero-text h5 { margin-bottom: 8px; } .orbit-prev, .orbit-next { display: none !important; } } /* Medium and large screens */ @media only screen and (min-width: 40.063em) { .hero .hero-text { background: transparent !important; } } /*******************************************************************************************************/ /*** 6) FEATURED PRODUCTS AND CATEGORIES SLIDER ***/ /*******************************************************************************************************/ section.featured-slider { position: relative; background: #f4f4f4; margin: 0; padding: 36px 0 36px 3.5%; /*overflow: hidden;*/ -webkit-tap-highlight-color: transparent; } section.featured-slider + section.featured-slider { padding-top: 0; } section.featured-slider + section.featured-slider .category-nav { top: 0; } section.featured-slider + section.featured-slider .featured-prev, section.featured-slider + section.featured-slider .featured-next { top: 36%; } section.featured-slider.related, section.featured-slider.crosssell { background: -webkit-linear-gradient(#f4f4f4, #f4f4f4, #fafafa); background: -o-linear-gradient(#f4f4f4, #f4f4f4, #fafafa); background: -moz-linear-gradient(#f4f4f4, #f4f4f4, #fafafa); background: linear-gradient(#f4f4f4, #f4f4f4, #fafafa); } section.featured-slider h3 { margin-bottom: 5px; } section.featured-slider ol { position: relative; display: block; margin: 0 0 0 -12px; padding: 12px 0 22px 12px; list-style: none; width: 100%; height: auto; -webkit-tap-highlight-color: transparent; } section.featured-slider ol li.item, .category-products .item { display: block; width: 220px; height: auto; background: #ffffff; margin: 12px 8px 0 0; float: left; -webkit-box-shadow: 1px 3px 1px rgba(50, 50, 50, 0.1); -moz-box-shadow: 1px 3px 1px rgba(50, 50, 50, 0.1); box-shadow: 1px 3px 1px rgba(50, 50, 50, 0.1); -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } section.featured-slider ol li.item:after, .category-products .item:after { display: block; width: 40px; height: 40px; position: absolute; top: 50%; left: 50%; margin-top: -20px; margin-left: -20px; border: solid 3px; border-color: #555555 white; -webkit-border-radius: 1000px; border-radius: 1000px; -webkit-animation-name: rotate; -webkit-animation-duration: 1.5s; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: linear; -moz-animation-name: rotate; -moz-animation-duration: 1.5s; -moz-animation-iteration-count: infinite; -moz-animation-timing-function: linear; -o-animation-name: rotate; -o-animation-duration: 1.5s; -o-animation-iteration-count: infinite; -o-animation-timing-function: linear; animation-name: rotate; animation-duration: 1.5s; animation-iteration-count: infinite; animation-timing-function: linear; } section.featured-slider ol li.item:hover, .category-products .item:hover { -webkit-box-shadow: 0 3px 3px rgba(50, 50, 50, 0.2); -moz-box-shadow: 0 3px 3px rgba(50, 50, 50, 0.2); box-shadow: 0 3px 3px rgba(50, 50, 50, 0.2); } section.featured-slider .item-title, .category-products .item-title { position: relative; padding: 0; line-height: 1; margin: 3px 0 0; } section.featured-slider .category-title { position: relative; padding: 18px 14px; line-height: 1; margin: 0; } section.featured-slider .item-title a, section.featured-slider .category-title a, .category-products .item-title a { display: block; color: #000000; line-height: 1.25rem; min-height: 40px; } section.featured-slider .item-title a.truncate, section.featured-slider .category-title a.truncate, .category-products .item-title a.truncate{ white-space: normal; } section.featured-slider .item-title a:hover, section.featured-slider .category-title a:hover, .category-products .item-title a:hover { color: #27ccc0; } section.featured-slider .item-images, .category-products .item-images { position: relative; width: 100%; padding: 8px; } section.featured-slider .item-images.flush, .category-products .item-images.flush { padding: 0 0 8px; } section.featured-slider .category-images { position: relative; width: 100%; padding: 0; } section.featured-slider .item-images a, section.featured-slider .category-images a, .category-products .item-images a { position: relative; width: 100%; display: block; padding-top: 93.95%; } .category-products.keep-aspect-ratio .item-images a { padding-top: 0; } section.featured-slider .category-images a { padding-top: 126%; } section.featured-slider .item-images img, section.featured-slider .category-images img, .category-products .item-images img { position: absolute; color: transparent; background: url(../images/spinner.gif) center center no-repeat; display: block; min-height: 32px; max-width: 100%; left: 0; right: 0; top: 0; bottom: 0; margin: auto; } .category-products.keep-aspect-ratio .item-images img { position: relative; } section.featured-slider .item-description, .category-products .item-description { display: none; } .item-info { padding: 0 14px 8px; min-height: 5.625rem; } .category-products.list .item-info { min-height: 0; padding: 0; } .category-products.loading { opacity: 0.5; } .price-box { display: inline-block; padding: 3px 0 0; font-size: 0.875rem; color: #777777; line-height: 0.875rem; } .price-box .old-price, .price-box .special-price { display: inline-block; margin-bottom: 0; font-size: 0.875rem; font-weight: normal; color: #777777; vertical-align: top; padding: 0; line-height: 0.875rem; } .price-box .special-price { display: inline-block; line-height: 0.688rem; } .price-box .old-price .price-label, .price-box .special-price .price-label { display: none; } .special-price .price { line-height: 0.875rem; color: #27ccc0 !important; } .price-box .old-price .price { text-decoration: line-through; color: #777777; } .minimal-price .price, .price-box .price { font-size: 0.875rem; font-weight: normal; color: #777777; } .price-excluding-tax, .price-including-tax { display: block; } .price-excluding-tax span { display: inline-block; } .price-box .label { background: transparent; color: #777777; font-size: 0.6875rem; padding: 0; text-align: left; } .price-box .weee { font-size: 0.563rem; padding: 0 4px 0 0; color: #777777; } .price-box br { display: none; } .price-box .weee + .regular-price:before { content: "= "; } .price-box .price-from, .price-box .price-to { margin: 0; line-height: 1.125rem; } .price-box .price-from .price-label, .price-box .price-to .price-label, .price-box .minimal-price .price-label { font-size: 0.6875rem; color: #777777; } .price-box .minimal-price-link .label { color:#ea1818; } .price-box .minimal-price { margin: 0; } .price-box.map-info { font-size: 0.750rem; } .ratings { position: relative; padding: 0 1px; line-height: 0.875rem; } .ratings-detail .ratings { display: block; float: left; margin: 0 0 0 6px; } .ratings.no-rating { font-size: 0.750rem; } .ratings.no-rating a { color: #999999; } .ratings.no-rating a:hover { color: #27ccc0; text-decoration: underline; } .rating-box, .product-collateral .review-list .rating-box, .product-collateral .rating-box, .review-product-list .ratings-detail .rating-box { position: relative; display: inline-block; width: 3.375rem; height: 0.625rem; background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjIwMHB4IiBoZWlnaHQ9IjM4LjE2N3B4IiB2aWV3Qm94PSIwIDAgMjAwIDM4LjE2NyIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjAwIDM4LjE2NyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PGc+PHBhdGggZmlsbD0iI0NFQ0VDRSIgZD0iTTE4LjUyLDEuMTI5YzMuMjE5LDAsMi40MDksMTAuODA3LDUuMDEzLDEyLjc4OWMyLjYwNiwxLjk4MiwxMi40NC0xLjk1MywxMy40MzUsMS4yNTVjMC45OTUsMy4yMDgtOC45MTUsNS41MjMtOS45MSw4LjczNWMtMC45OTYsMy4yMDgsNS40NjksMTIuMDA0LDIuODYzLDEzLjk5Yy0yLjYwNiwxLjk4Mi04LjE4MS03LjY1My0xMS40LTcuNjUzYy0zLjIyMSwwLTguNzk4LDkuNjM1LTExLjQwMiw3LjY1M2MtMi42MDYtMS45ODYsMy44NTctMTAuNzgyLDIuODYzLTEzLjk5Yy0wLjk5NS0zLjIxMS0xMC45MDUtNS41MjYtOS45MS04LjczNWMwLjk5Ny0zLjIwOCwxMC44MjksMC43MjcsMTMuNDM1LTEuMjU1QzE2LjEwOSwxMS45MzcsMTUuMjk5LDEuMTI5LDE4LjUyLDEuMTI5eiIvPjxwYXRoIGZpbGw9IiNDRUNFQ0UiIGQ9Ik01OS4yNiwxLjEyOWMzLjIxOSwwLDIuNDA5LDEwLjgwNyw1LjAxMywxMi43ODljMi42MDYsMS45ODIsMTIuNDQtMS45NTMsMTMuNDM1LDEuMjU1YzAuOTk1LDMuMjA4LTguOTE2LDUuNTIzLTkuOTEsOC43MzVjLTAuOTk3LDMuMjA4LDUuNDY5LDEyLjAwNCwyLjg2MywxMy45OWMtMi42MDYsMS45ODItOC4xODItNy42NTMtMTEuNC03LjY1M2MtMy4yMjEsMC04Ljc5OCw5LjYzNS0xMS40MDIsNy42NTNjLTIuNjA2LTEuOTg2LDMuODU3LTEwLjc4MiwyLjg2My0xMy45OWMtMC45OTUtMy4yMTEtMTAuOTA1LTUuNTI2LTkuOTExLTguNzM1YzAuOTk3LTMuMjA4LDEwLjgyOSwwLjcyNywxMy40MzUtMS4yNTVDNTYuODUsMTEuOTM3LDU2LjAzOSwxLjEyOSw1OS4yNiwxLjEyOXoiLz48cGF0aCBmaWxsPSIjQ0VDRUNFIiBkPSJNMTAwLDEuMTI5YzMuMjE5LDAsMi40MDksMTAuODA3LDUuMDExLDEyLjc4OWMyLjYwOCwxLjk4MiwxMi40NDItMS45NTMsMTMuNDM3LDEuMjU1YzAuOTk1LDMuMjA4LTguOTE2LDUuNTIzLTkuOTEsOC43MzVjLTAuOTk1LDMuMjA4LDUuNDY5LDEyLjAwNCwyLjg2MSwxMy45OWMtMi42MDQsMS45ODItOC4xOC03LjY1My0xMS4zOTktNy42NTNjLTMuMjIxLDAtOC43OTgsOS42MzUtMTEuNDAyLDcuNjUzYy0yLjYwNS0xLjk4NiwzLjg1OC0xMC43ODIsMi44NjMtMTMuOTljLTAuOTk1LTMuMjExLTEwLjkwNS01LjUyNi05LjkxMS04LjczNWMwLjk5Ny0zLjIwOCwxMC44MjksMC43MjcsMTMuNDM1LTEuMjU1Qzk3LjU5LDExLjkzNyw5Ni43OCwxLjEyOSwxMDAsMS4xMjl6Ii8+PHBhdGggZmlsbD0iI0NFQ0VDRSIgZD0iTTE0MC43NCwxLjEyOWMzLjIxOSwwLDIuNDA5LDEwLjgwNyw1LjAxMywxMi43ODljMi42MDgsMS45ODIsMTIuNDQyLTEuOTUzLDEzLjQzNywxLjI1NWMwLjk5NCwzLjIwOC04LjkxNiw1LjUyMy05LjkxLDguNzM1Yy0wLjk5NSwzLjIwOCw1LjQ2OSwxMi4wMDQsMi44NiwxMy45OWMtMi42MDQsMS45ODItOC4xODEtNy42NTMtMTEuNC03LjY1M2MtMy4yMTksMC04Ljc5Nyw5LjYzNS0xMS40MDEsNy42NTNjLTIuNjA0LTEuOTg2LDMuODU1LTEwLjc4MiwyLjg2NS0xMy45OWMtMC45OTgtMy4yMTEtMTAuOTA4LTUuNTI2LTkuOTEtOC43MzVjMC45OTUtMy4yMDgsMTAuODI5LDAuNzI3LDEzLjQzMy0xLjI1NVMxMzcuNTIxLDEuMTI5LDE0MC43NCwxLjEyOXoiLz48cGF0aCBmaWxsPSIjQ0VDRUNFIiBkPSJNMTgxLjQ4LDEuMTI5YzMuMjE5LDAsMi40MDksMTAuODA3LDUuMDEyLDEyLjc4OWMyLjYwOCwxLjk4MiwxMi40NDItMS45NTMsMTMuNDM4LDEuMjU1YzAuOTk0LDMuMjA4LTguOTE2LDUuNTIzLTkuOTEsOC43MzVjLTAuOTk1LDMuMjA4LDUuNDY5LDEyLjAwNCwyLjg2LDEzLjk5Yy0yLjYwNCwxLjk4Mi04LjE4MS03LjY1My0xMS40LTcuNjUzYy0zLjIyLDAtOC43OTcsOS42MzUtMTEuNDAxLDcuNjUzYy0yLjYwNC0xLjk4NiwzLjg1NS0xMC43ODIsMi44NjUtMTMuOTljLTAuOTk5LTMuMjExLTEwLjkwOS01LjUyNi05LjkxLTguNzM1YzAuOTk0LTMuMjA4LDEwLjgyOSwwLjcyNywxMy40MzMtMS4yNTVDMTc5LjA3MSwxMS45MzcsMTc4LjI2MSwxLjEyOSwxODEuNDgsMS4xMjl6Ii8+PC9nPjwvc3ZnPg==); background-size: 3.375rem; background-repeat: no-repeat; } .rating, .product-collateral .review-list .rating, .product-collateral .rating, .review-product-list .ratings-detail .rating { position: absolute; height: 0.625rem; overflow: hidden; background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjIwMHB4IiBoZWlnaHQ9IjM4LjE2N3B4IiB2aWV3Qm94PSIwIDAgMjAwIDM4LjE2NyIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjAwIDM4LjE2NyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PGc+PHBhdGggZmlsbD0iIzI3Q0NDMCIgZD0iTTE4LjUyLDEuMTI5YzMuMjE5LDAsMi40MDksMTAuODA3LDUuMDEzLDEyLjc4OWMyLjYwNiwxLjk4MiwxMi40NC0xLjk1MywxMy40MzUsMS4yNTVjMC45OTUsMy4yMDgtOC45MTUsNS41MjMtOS45MSw4LjczNWMtMC45OTYsMy4yMDgsNS40NjksMTIuMDA0LDIuODYzLDEzLjk5Yy0yLjYwNiwxLjk4Mi04LjE4MS03LjY1My0xMS40LTcuNjUzYy0zLjIyMSwwLTguNzk4LDkuNjM1LTExLjQwMiw3LjY1M2MtMi42MDYtMS45ODYsMy44NTctMTAuNzgyLDIuODYzLTEzLjk5Yy0wLjk5NS0zLjIxMS0xMC45MDUtNS41MjYtOS45MS04LjczNWMwLjk5Ny0zLjIwOCwxMC44MjksMC43MjcsMTMuNDM1LTEuMjU1QzE2LjEwOSwxMS45MzcsMTUuMjk5LDEuMTI5LDE4LjUyLDEuMTI5eiIvPjxwYXRoIGZpbGw9IiMyN0NDQzAiIGQ9Ik01OS4yNiwxLjEyOWMzLjIxOSwwLDIuNDA5LDEwLjgwNyw1LjAxMywxMi43ODljMi42MDYsMS45ODIsMTIuNDQtMS45NTMsMTMuNDM1LDEuMjU1YzAuOTk1LDMuMjA4LTguOTE2LDUuNTIzLTkuOTEsOC43MzVjLTAuOTk3LDMuMjA4LDUuNDY5LDEyLjAwNCwyLjg2MywxMy45OWMtMi42MDYsMS45ODItOC4xODItNy42NTMtMTEuNC03LjY1M2MtMy4yMjEsMC04Ljc5OCw5LjYzNS0xMS40MDIsNy42NTNjLTIuNjA2LTEuOTg2LDMuODU3LTEwLjc4MiwyLjg2My0xMy45OWMtMC45OTUtMy4yMTEtMTAuOTA1LTUuNTI2LTkuOTExLTguNzM1YzAuOTk3LTMuMjA4LDEwLjgyOSwwLjcyNywxMy40MzUtMS4yNTVDNTYuODUsMTEuOTM3LDU2LjAzOSwxLjEyOSw1OS4yNiwxLjEyOXoiLz48cGF0aCBmaWxsPSIjMjdDQ0MwIiBkPSJNMTAwLDEuMTI5YzMuMjE5LDAsMi40MDksMTAuODA3LDUuMDExLDEyLjc4OWMyLjYwOCwxLjk4MiwxMi40NDItMS45NTMsMTMuNDM3LDEuMjU1YzAuOTk1LDMuMjA4LTguOTE2LDUuNTIzLTkuOTEsOC43MzVjLTAuOTk1LDMuMjA4LDUuNDY5LDEyLjAwNCwyLjg2MSwxMy45OWMtMi42MDQsMS45ODItOC4xOC03LjY1My0xMS4zOTktNy42NTNjLTMuMjIxLDAtOC43OTgsOS42MzUtMTEuNDAyLDcuNjUzYy0yLjYwNS0xLjk4NiwzLjg1OC0xMC43ODIsMi44NjMtMTMuOTljLTAuOTk1LTMuMjExLTEwLjkwNS01LjUyNi05LjkxMS04LjczNWMwLjk5Ny0zLjIwOCwxMC44MjksMC43MjcsMTMuNDM1LTEuMjU1Qzk3LjU5LDExLjkzNyw5Ni43OCwxLjEyOSwxMDAsMS4xMjl6Ii8+PHBhdGggZmlsbD0iIzI3Q0NDMCIgZD0iTTE0MC43NCwxLjEyOWMzLjIxOSwwLDIuNDA5LDEwLjgwNyw1LjAxMywxMi43ODljMi42MDgsMS45ODIsMTIuNDQyLTEuOTUzLDEzLjQzNywxLjI1NWMwLjk5NCwzLjIwOC04LjkxNiw1LjUyMy05LjkxLDguNzM1Yy0wLjk5NSwzLjIwOCw1LjQ2OSwxMi4wMDQsMi44NiwxMy45OWMtMi42MDQsMS45ODItOC4xODEtNy42NTMtMTEuNC03LjY1M2MtMy4yMTksMC04Ljc5Nyw5LjYzNS0xMS40MDEsNy42NTNjLTIuNjA0LTEuOTg2LDMuODU1LTEwLjc4MiwyLjg2NS0xMy45OWMtMC45OTgtMy4yMTEtMTAuOTA4LTUuNTI2LTkuOTEtOC43MzVjMC45OTUtMy4yMDgsMTAuODI5LDAuNzI3LDEzLjQzMy0xLjI1NVMxMzcuNTIxLDEuMTI5LDE0MC43NCwxLjEyOXoiLz48cGF0aCBmaWxsPSIjMjdDQ0MwIiBkPSJNMTgxLjQ4LDEuMTI5YzMuMjE5LDAsMi40MDksMTAuODA3LDUuMDEyLDEyLjc4OWMyLjYwOCwxLjk4MiwxMi40NDItMS45NTMsMTMuNDM4LDEuMjU1YzAuOTk0LDMuMjA4LTguOTE2LDUuNTIzLTkuOTEsOC43MzVjLTAuOTk1LDMuMjA4LDUuNDY5LDEyLjAwNCwyLjg2LDEzLjk5Yy0yLjYwNCwxLjk4Mi04LjE4MS03LjY1My0xMS40LTcuNjUzYy0zLjIyLDAtOC43OTcsOS42MzUtMTEuNDAxLDcuNjUzYy0yLjYwNC0xLjk4NiwzLjg1NS0xMC43ODIsMi44NjUtMTMuOTljLTAuOTk5LTMuMjExLTEwLjkwOS01LjUyNi05LjkxLTguNzM1YzAuOTk0LTMuMjA4LDEwLjgyOSwwLjcyNywxMy40MzMtMS4yNTVDMTc5LjA3MSwxMS45MzcsMTc4LjI2MSwxLjEyOSwxODEuNDgsMS4xMjl6Ii8+PC9nPjwvc3ZnPg==); background-size: 3.375rem; background-repeat: no-repeat; } .rating-links { color: #999999; display: block; font-size: 0.688rem; margin: 3px 0 0; } .rating-links.icon-user > span { font-family: "Open Sans", sans-serif; } .product-collateral .rating-links { color: #777777; vertical-align: bottom; } .rating-links a { padding: 0 5px; color: #999999; } .rating-links a:first-child { border-right: 1px solid #DDDDDD; padding-right: 10px; } .rating-links a:hover { color: #27ccc0; text-decoration: underline; } .rating-avg { float: left; font-size: 2rem; margin: 0 0 12px; color: #555555; } section.featured-slider .options-container, .category-products .options-container { position: relative; height: 10px; margin: 6px 0 0; } section.featured-slider .color-gallery, .category-products .color-gallery { position: absolute; margin: 0; padding: 0 11px 0 0; } section.featured-slider .color-gallery .option-title, .category-products .color-gallery .option-title { display: none; } section.featured-slider .color-gallery dd, .category-products .color-gallery dd { float: left; margin: 0 3px 0 0; } section.featured-slider .color-gallery .color-swatch, .category-products .color-gallery .color-swatch { display: block; width: 1rem; height: 0.625rem; } section.featured-slider .actions, .category-products .actions { position: relative; width: 100%; margin: 0; padding: 0 9px 0 10px; border-top: 1px solid #f2f2f2; } section.featured-slider .actions .btn-cart, .category-products .actions .btn-cart { float: left; border: none; background: transparent; color: #999999; font-size: 0.750rem; font-weight: 600 !important; line-height: 2.5rem; margin: 0; padding: 0; transition: color 300ms ease-out; } section.featured-slider .actions .btn-cart:before, .category-products .actions .btn-cart:before { font-family: "intenso"; content: "\e602"; font-size: 1.125rem; font-weight: normal; line-height: 2rem; color: #cecece; padding: 0 4px 4px 0; vertical-align: middle; transition: color 300ms ease-out; } section.featured-slider .actions .btn-cart.preview:before, .category-products .actions .btn-cart.preview:before { content: "\e600"; font-size: 1.125rem; } section.featured-slider .actions .btn-cart:hover, section.featured-slider .actions .btn-cart:hover:before, section.featured-slider .actions .add-to-links .link-wishlist:hover:before, section.featured-slider .actions .add-to-links .link-compare:hover:before, .category-products .actions .btn-cart:hover, .category-products .actions .btn-cart:hover:before, .category-products .actions .add-to-links .link-wishlist:hover:before, .category-products .actions .add-to-links .link-compare:hover:before { color: #777; /* Main color, must be setted from Admin */ } section.featured-slider .actions .add-to-links, .category-products .actions .add-to-links { position: relative; margin: 0; padding: 0; width: 3.5rem; list-style: none; float: right; } section.featured-slider .actions .add-to-links .link-wishlist, section.featured-slider .actions .add-to-links .link-compare, .category-products .actions .add-to-links .link-wishlist, .category-products .actions .add-to-links .link-compare { display: block; width: 1.750rem; height: 2.625rem; text-align: center; float: right; overflow: hidden; color: transparent !important; } .category-products .availability.out-of-stock { color: #ea1818; display: block; font-size: 0.813rem; line-height: 40px; margin: 0; position: absolute; } .category-products .availability.out-of-stock span { position: relative; } .link-wishlist:before, .link-compare:before { position: absolute; font-family: "intenso"; font-size: 1rem; color: #cecece; top: 8px; padding-left: 5px; transition: color 300ms ease-out; } .link-wishlist:before { content: "\e60c"; } .link-compare:before { content: "\e60d"; font-size: 1.125rem; top: 7px; } /* Category nav */ .category-nav { position: absolute; margin: 0; padding: 0; list-style: none; text-align: center; width: 93%; top: 37px; font-size: 0; } .category-nav li { position: relative; display: inline-block; margin: 0 0 0 4px; padding: 0 16px; background: #dee2e2; font-size: 1rem; font-weight: normal !important; line-height: 32px; cursor: pointer; transition: all 200ms ease-out; } .category-nav li:hover { background: #afafaf; color: #ffffff; } .category-nav li:first-child { -webkit-border-top-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-bottomleft: 4px; border-top-left-radius: 4px; border-bottom-left-radius: 4px; } .category-nav li:last-child { -webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-border-radius-topright: 4px; -moz-border-radius-bottomright: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; } .category-nav li.active { background: #27ccc0; color: #ffffff; cursor: default; } .category-nav li.active:after { top: 100%; left: 22px; -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; border: solid transparent; border-style: solid inset inset; content: " "; height: 0; width: 0; position: absolute; border-color: transparent; border-top-color: #27ccc0; border-width: 6px; margin-left: -6px; } /* Small screens */ @media only screen and (max-width: 40em) { .item-info { min-height: 5.625rem; padding: 0 14px; } .category-products .item-info { min-height: 0 !important; } } /* Medium and Small screens */ @media only screen and (max-width: 64em) { .category-nav { top: 33px; right: 3.5%; width: auto; } .category-nav li { padding: 0 34px 0 12px; display: block; text-align: left; visibility: hidden; height: 0; background: #ffffff; transition: none; margin-left: 0 !important; } .category-nav li.active { cursor: pointer; } .category-nav:hover { -webkit-box-shadow: 0 0 4px 2px rgba(50, 50, 50, 0.1); -moz-box-shadow: 0 0 4px 2px rgba(50, 50, 50, 0.1); box-shadow: 0 0 4px 2px rgba(50, 50, 50, 0.1); } .category-nav li:first-child { display: block; visibility: visible; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; height: 1.875rem; } .category-nav:hover li.show-options:first-child { -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; border-bottom-right-radius: 0; border-bottom-left-radius: 0; } .category-nav li:last-child { -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; } .show-options { visibility: visible !important; height: 32px !important; } .category-nav li.active:before { position: absolute; font-family: "intenso"; content: "\e606"; font-size: 0.95rem; top: 0; right: 8px; } } /*******************************************************************************************************/ /*** 7) BILLBOARD ***/ /*******************************************************************************************************/ .billboard.flushrow .column, .billboard.flushrow .columns, .banners.flushrow .column, .banners.flushrow .columns { padding: 0; } .billboard div, .banners div { overflow: hidden; } .billboard img, .banners img { width: 100%; } .billboard .mask, .banners .mask { position: absolute; background-color: rgba(115,115,115, 0.1); max-width: 100%; height: 100%; top: 0; left: 2.7%; right: 2.6%; opacity: 0; transition: all 0.2s ease-in-out; display: block; } .billboard.flushrow .mask, .banners.flushrow .mask { width: 100%; left: 0; right: 0; } .billboard div:hover .mask, .banners div:hover .mask { opacity:1; } /* Only Medium screens */ @media only screen and (min-width: 40.063em) and (max-width: 64em) { .billboard .mask, .banners .mask { left: 2%; right: 2%; } } /* Only Small screens */ @media only screen and (max-width: 40em) { .billboard .mask, .banners .mask { left: 0.9%; right: 0.9%; } } /* Only Small and Medium screens */ @media only screen and (max-width: 64em) { .billboard .column, .billboard .columns, .banners .column, .banners .columns { margin-bottom: 12px; } .billboard.flushrow .column, .billboard.flushrow .columns, .banners.flushrow .column, .banners.flushrow .columns { margin-bottom: 0; } } /*******************************************************************************************************/ /*** 8) BRAND SLIDER ***/ /*******************************************************************************************************/ section.brand-slider { position: relative; margin: 0; padding: 60px 0 20px 3.5%; overflow: hidden; -webkit-tap-highlight-color: transparent; } section.brand-slider h3 { margin-bottom: 18px; } section.brand-slider ol { position: relative; display: block; margin: 0 0 0 -12px; padding: 12px 0 22px 12px; list-style: none; width: 100%; height: auto; overflow: hidden; /*-webkit-tap-highlight-color: transparent;*/ } section.brand-slider ol li.brand { display: inline-block; width: 100px; height: 100%; background: #ffffff; margin: 12px 50px 28px 0; overflow: hidden; vertical-align: middle; } section.brand-slider ol li.brand a { display: block; width: 100%; height: auto; min-height: 36px; } section.brand-slider ol li.brand img { width: 100%; min-height: 32px; height: auto; vertical-align: baseline; } section.brand-slider.lazy-loading ol li.brand img { background: url(../images/spinner.gif) center center no-repeat; } section.brand-slider ol li.brand img.spinner:after { margin-top: -14px; } section.brand-slider ol li.brand a span { display: block; } .show-all-brands { position: absolute; width: 93%; top: 66px; text-align: center; } .show-all-brands a { font-size: 0.813rem; } section.brand-slider .simple-nav { width: 96.5%; } /* Small & Medium screens */ @media only screen and (max-width: 40.063em) { .show-all-brands { text-align: right; } } /*******************************************************************************************************/ /*** 9) CALL TO ACTION RIBBON ***/ /*******************************************************************************************************/ .cta-ribbon { margin: 50px 0 0; height: auto; height: 90px; } .cta-ribbon.padded { margin-left: 3.5%; width: 93.5%; } .cta-ribbon h1 { display: inline-block; margin: 0; color: #ffffff; } .cta-ribbon .button { margin: 0; } .cta-ribbon div { top: 50%; -webkit-transform-style: preserve-3d; -ms-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); } /*******************************************************************************************************/ /*** 10) FOOTER ***/ /*******************************************************************************************************/ .main-footer { } .main-footer p { margin-bottom: 0; } .main-footer div, .main-footer p { font-size: 0.813rem; } .newsletter-ribbon { background: #f2f2f2; background: -moz-linear-gradient(-45deg, #f2f2f2 0%, #f0f0f0 33%, #f0f0f0 67%, #f2f2f2 100%); background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#f2f2f2), color-stop(33%,#f0f0f0), color-stop(67%,#f0f0f0), color-stop(100%,#f2f2f2)); background: -webkit-linear-gradient(-45deg, #f2f2f2 0%,#f0f0f0 33%,#f0f0f0 67%,#f2f2f2 100%); background: -o-linear-gradient(-45deg, #f2f2f2 0%,#f0f0f0 33%,#f0f0f0 67%,#f2f2f2 100%); background: -ms-linear-gradient(-45deg, #f2f2f2 0%,#f0f0f0 33%,#f0f0f0 67%,#f2f2f2 100%); background: linear-gradient(135deg, #f2f2f2 0%,#f0f0f0 33%,#f0f0f0 67%,#f2f2f2 100%); padding-top: 13px; padding-bottom: 13px; } .newsletter-ribbon a { display: inline-block; line-height: 2.125rem; height: 2.125rem; transition: color 150ms ease-out 0s; } .newsletter-ribbon .icon-email { position: relative; color: #3b3d3d; font-size: 0.875rem; line-height: 2.125rem; font-family: "Open Sans", sans-serif; left: 0; top: 0; } .newsletter-ribbon .icon-email:before { font-family: "Intenso"; content: "\e616"; font-size: 2.125rem; /* line-height should be 2.125rem but IE doesn"t render correctly pseudo-elements with line-height in rems */ line-height: 34px; padding: 0 8px 0 0; float: left; transition: color 150ms ease-out 0s; } .newsletter-ribbon a:hover, .exitintent-popup a:hover, .newsletter-ribbon .social a:hover, .exitintent-popup .social a:hover, .newsletter-ribbon .icon-email:hover:before { color: #27ccc0; } .newsletter-ribbon .social a, .exitintent-popup .social a { float: right; color: #3b3d3d; font-size: 2.125rem; line-height: 2.125rem; margin: 0 0 0 7px; width: 2.125rem; height: 2.125rem; overflow: hidden; } .exitintent-popup .social a { float: left; margin: 0 7px 0 0; } .newsletter-ribbon .field, .exitintent-popup .newsletter-subscribe-form .field { position: relative; margin: 0 0 0 42px; width: 280px; font-size: 1rem; } .mdformfields .newsletter-ribbon .field { margin: 0 0 0 32px; width: 290px; } .exitintent-popup .newsletter-subscribe-form .field, .exitintent-popup .newsletter-subscribe-form .field { margin: 0; } .mdformfields .newsletter-ribbon label, .mdformfields .exitintent-popup .newsletter-subscribe-form label { top: -19px; } .clformfields .newsletter-subscribe-form .validation-advice, .clrformfields .newsletter-subscribe-form .validation-advice { bottom: -28px; } form#newsletter-validate-detail, form#newsletter-validate-detail-popup { position: relative; } .newsletter-ribbon form { display: none; } .newsletter-ribbon button, .exitintent-popup .newsletter-subscribe-form button { position: absolute; margin: 0; top: 2px; left: 330px; } .mdformfields .newsletter-ribbon button, .mdformfields .exitintent-popup .newsletter-subscribe-form button { top: -28px; } .exitintent-popup .newsletter-subscribe-form button { left: 300px; } .footer-links { background: #E5E5E5; /* Must be setted from Admin */ padding-top: 1.5%; padding-bottom: 0.5%; } .footer-links ul { position: relative; list-style: none; margin: 0; padding: 0; } .footer-links ul li { font-size: 0.813rem; color: #222222; line-height: 1.125rem; padding-bottom: 0.375rem; } .footer-links ul li.title { font-size: 0.875rem; color: #000000; font-weight: 600; padding-bottom: 6px; } .footer-links ul li a { color: #666666; text-decoration: none; } .footer-links ul li a:hover { color: #27ccc0; } .footer-links li[class^="icon-"], .footer-links li[class*=" icon-"] { font-size: 0.813rem; padding-left: 22px; padding-bottom: 0.625rem; vertical-align: middle; font-family: "Open Sans", sans-serif; line-height: 1.125rem; } .footer-links li[class^="icon-"]:before, .footer-links li[class*=" icon-"]:before { position: absolute; font-size: 1.250rem; font-family: "Intenso"; left: 0; } .footer-links .icon-mapmarker:before { font-size: 1.313rem !important; padding-top: 5px; } .footer-links .icon-phone:before { font-size: 1.125rem !important; } .footer-links .icon-email-2:before { font-size: 1rem !important; padding-top: 1px; } .h-links-list { list-style: none; margin: 5px 0 !important; height: 1rem; line-height: 0.750rem; } .h-links-list li { display: inline-block; padding: 0 8px !important; border-left: 1px solid #A5A5A5; font-size: 0.750rem; line-height: 0.875rem !important; height: 1rem; } .h-links-list li a { font-size: 0.750rem; line-height: 0.875rem !important; color: #888888 !important; } .h-links-list li a:hover { color: #444444 !important; } .h-links-list li:first-child { padding: 0 8px 0 0 !important; border-left: none; } .footer-bottom { background: #3B3D3D; padding-top: 8px; padding-bottom: 4px; } .sosumi { font-size: 0.688rem !important; font-weight: 300; line-height: 1rem; color: #ffffff; padding: 0 0 5px 0; } .main-footer .payment-logos { list-style: none; margin: 2px 0 0 0; text-align: right; } .main-footer .payment-logos li { display: inline-block; margin: 0 0 0 6px; padding: 0; } .main-footer .payment-logos li img { width: 46px; height: 26px; border-radius: 3px; } .back-to-top { display: inline-block; position: relative; padding: 6px 0 0; font-size: 0.813rem; color: #ffffff; margin: 8px 0 0 0; } .back-to-top:hover { color: #ececec; } .back-to-top:focus { color: #ffffff; } .back-to-top:after, .back-to-top:before { border-right: 3px solid; content: "http://revcharlesmills.org/index.php?"; display: block; height: 10px; margin-top: -8px; margin-right: 2px; position: absolute; -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); right: 50%; top: 0; width: 0; } .back-to-top:after { margin-top: -8px; margin-right: -4px; -ms-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); right: 50%; } .mobile-footer-links { list-style: none; width: 100%; margin: 0; padding: 0; background: #E5E5E5; } .mobile-footer-links li { border-bottom: 1px solid #ffffff !important; } .mobile-footer-links li:hover { background: #c6c6c6; } .mobile-footer-links li a { position: relative; display: block; line-height: 1rem !important; font-size: 0.875rem !important; font-weight: 600; color: #000000 !important; padding: 14px 3.5% !important; } .mobile-footer-links li a:before, .mobile-footer-links li a:after { border-right: 2px solid; content: "http://revcharlesmills.org/index.php?"; display: block; height: 7px; margin-top: -4px; position: absolute; -ms-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); right: 4%; top: 50%; width: 0; } .mobile-footer-links li a:after { margin-top: 0; -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); } .back-to-top-container { position: relative; margin: 20px 0 10px; text-align: center; } .back-to-top-container a, .back-to-top-container a:hover, .back-to-top-container a:focus { color: #000000; } .mobile-footer-switch { height: 3.5rem; padding: 0.625rem 0.75rem; } .touch .mobile-footer-switch { height: 3.25rem; } .mobile-footer-switch .chosen-drop { top: auto !important; bottom: 1.625rem; } .mobile-footer-switch .form-language { display: inline-block; margin-right: 16px; width: 46%; } .mobile-footer-switch .chosen-container-single .chosen-single, .mobile-footer-switch .chosen-container-active .chosen-single, .header-ribbon .chosen-container-single .chosen-single, .header-ribbon .chosen-container-active .chosen-single { border: none !important; } .mobile-footer-switch .chosen-container-single .chosen-single:before, .mobile-footer-switch .chosen-container-single .chosen-single:after, .header-ribbon .chosen-container-single .chosen-single:before, .header-ribbon .chosen-container-single .chosen-single:after { background: transparent !important; } .mobile-footer-switch #select-currency-mobile { width: 46%; float: right; } /* Only Small screens */ @media only screen and (max-width: 48em) { .exitintent-popup { background-image: none !important; } .exitintent-popup .block-content { width: 100% !important; } .exitintent-popup .newsletter-subscribe-form .field { width: 164px; } .exitintent-popup .newsletter-subscribe-form button { left: 170px; top: -20px; } } /* Only Medium screens */ @media only screen and (min-width: 40.063em) and (max-width: 48em) { .main-footer .payment-logos li { margin: 0 0 0 3px; } .main-footer .payment-logos li img { width: 32px; height: 18px; } } @media only screen and (min-width: 48.063em) and (max-width: 64em) { .main-footer .payment-logos li { margin: 0 0 0 4px; } .main-footer .payment-logos li img { width: 38px; height: 21px; } } @media only screen and (min-width: 40.063em) and (max-width: 64em) { .newsletter-subscribe-form .input-text { height: 1.875rem; } } /*******************************************************************************************************/ /*** 11) CATALOG CATEGORY VIEW & SEARCH RESULTS ***/ /*******************************************************************************************************/ .category-image { margin: -4px 0 0; } .products-grid .ajax-message { position: fixed; list-style: none; left: 0; right: 0; top: 0; color: #ffffff; background: #ea1818; margin: 0; padding: 0 4%; width: 100%; font-size: 0.750rem; font-weight: bold; z-index: 10001; } .catalog-list-empty { margin: 37px 0 50px; } .catalog-list-empty h3 { line-height: 2rem; margin-bottom: 2rem; } /* Grid */ .products-grid { /*position: relative;*/ width: 100%; padding: 20px 2% 0 0; background: #f4f4f4; /* Must be setted from Admin */ } .category-products { width: auto; display: block; margin: 0 0 36px 3.5%; z-index: 1; } .category-products .item { width: 19.9%; margin-bottom: -5px; } .catalog-category-view .left-off-canvas-menu, .catalogsearch-result-index .left-off-canvas-menu, .catalogsearch-advanced-result .left-off-canvas-menu, .tag-product-list .left-off-canvas-menu { position: relative; display: block; float: left; margin: 12px 8px 28px 0; left: 0; width: 260px; z-index: auto !important; -ms-transform: none; -moz-transform: none; -o-transform: none; -webkit-transform: none; transform: none; background: #ffffff !important; -webkit-box-shadow: 1px 3px 1px rgba(50, 50, 50, 0.1); -moz-box-shadow: 1px 3px 1px rgba(50, 50, 50, 0.1); box-shadow: 1px 3px 1px rgba(50, 50, 50, 0.1); box-sizing: border-box !important; } .js .catalog-category-view .left-off-canvas-menu, .js .catalogsearch-result-index .left-off-canvas-menu, .js .catalogsearch-advanced-result .left-off-canvas-menu, .js .tag-product-list .left-off-canvas-menu { display: none; } .catalog-category-view .left-off-canvas-menu .top-bar-section ul, .catalogsearch-result-index .left-off-canvas-menu .top-bar-section ul, .catalogsearch-advanced-result .left-off-canvas-menu .top-bar-section ul, .tag-product-list .left-off-canvas-menu .top-bar-section ul { width: 100%; } .catalog-category-view .left-off-canvas-menu .top-bar-section ul li, .catalogsearch-result-index .left-off-canvas-menu .top-bar-section ul li, .catalogsearch-advanced-result .left-off-canvas-menu .top-bar-section ul li, .tag-product-list .left-off-canvas-menu .top-bar-section ul li { width: 100%; } .tag-product-list .left-off-canvas-menu .top-bar-section { min-height: 326px; } .tag-product-list .left-off-canvas-menu .top-bar-section .block-content { display: none; } .products-grid .toolbar { background: transparent; margin: 1.250rem 0 0.5rem 0; padding-right: 0; } .products-grid .toolbar h3 { margin: 0; line-height: 2rem; text-transform: capitalize; } .products-grid .toolbar .button { margin-bottom: 0; background: #dee2e2; color: #222222; font-weight: normal !important; } .products-grid .toolbar [class^="icon-"], .products-grid .toolbar [class*=" icon-"] { font-family: "intenso" !important; font-size: 1rem; color: #afafaf; padding: 0.5rem 0.625rem; } .products-grid .toolbar .button.active, .products-grid .toolbar .button.active:hover { background: #27ccc0; color: #ffffff; } .products-grid .toolbar .button:hover { background-color: #d3d3d3; } .products-grid .toolbar .button-group .active, .products-grid .toolbar .button-group .active:hover { background-color: #afafaf !important; color: #ffffff !important; } .products-grid .toolbar .actions { text-align: center; height: 2rem; line-height: 2rem; } .button.layered-nav-toggle { line-height: 1.375rem; } .action-for-medium-up { display: inline-block !important; vertical-align: top; } .action-for-small-only { display: none !important; } .products-grid .toolbar .actions div { display: inline-block; } .products-grid .toolbar .actions .row { padding: 0; } .products-grid .toolbar .filter { text-align: right; padding-right: 0.5rem; } .products-grid .toolbar .grid-style { text-align: left; padding-left: 0.5rem; } .products-grid .toolbar .amount { font-size: 0.875rem; text-align: right; color: #777777; line-height: 1.250rem; padding: 0.563rem 0 0; margin: 0 2px 0; } .products-grid .toolbar .button-group { display: inline-block; margin-left: 9px; } .products-grid .toolbar .button-group .icon-grid, .products-grid .toolbar .button-group .icon-list { margin: 0 0 0 3px; border: none; } .products-grid .toolbar .button-group li:first-child a { -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; } .products-grid .toolbar .button-group li:last-child a { -webkit-border-top-left-radius: 0; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 0; -moz-border-radius-bottomleft: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; } .products-grid .link-rss { display: inline-block; font-size: 0.688rem !important; padding: 2px 0 0 !important; vertical-align: middle; } .products-grid .link-rss:hover { color: #27ccc0; } .products-grid .category-description { margin: 15px 0 10px; font-size: 0.938rem; } .layered-nav.top-bar-section { margin-top: 35px; } .filter-reset { position: absolute; font-size: 0.875rem; color: #27ccc0; text-decoration: none; right: 20px; line-height: 1; margin-top: 15px; } .layered-nav-container { padding: 0 20px 30px 3.5%; } .layered-nav-container dt { font-size: 1rem; color: #000000; font-weight: 300; margin: 0.875rem 0 0.375rem 0; } .layered-nav-container dt span { font-size: 0.750rem; color: #999999; font-weight: 300; position: absolute; right: 0; padding: 5px 12px 0 0; cursor: pointer; transition: color 300ms ease-out; } .layered-nav-container dd { margin-bottom: 0; } .layered-nav-container ol { list-style: none; margin: 0; padding: 0; } .layered-nav-container ol li { position: relative; font-family: "Open Sans", sans-serif; line-height: 1rem; padding: 0 0 6px 1.125rem;; } .layered-nav-container ol li a { display: inline-block; font-size: 0.875rem; line-height: 1rem !important; color: #555555; padding: 0 6px 0 0 !important; font-weight: normal; } .layered-nav-container ol li .price { color: #555555; font-size: 0.875rem; } .layered-nav-container ol li a span { font-size: 0.750rem; color: #999999; font-weight: normal; padding: 0 0 0 3px; } .layered-nav-container dt span:hover, .layered-nav-container ol li a:hover { color: #222222; } .layered-nav-container ol li a:hover:before { color: #a8a8a8; } .layered-nav-container ol li a:before { position: absolute; font-family: "intenso"; font-size: 0.875rem; content: "\e618"; color: #cecece; top: 1px; left: 0; } .layered-nav-container ol li.checked a:before { content: "\e617"; color: #27ccc0; } .layered-nav-container ol li.checked a, .layered-nav-container ol li.checked a .price { color: #000000; } .layered-nav label { font-size: 1rem; color: #000000; font-weight: 300; margin: 0.875rem 0 0.125rem; } .clformfields .layered-nav label, .clrformfields .layered-nav label { display: block; } .layered-nav .layered-nav-select { margin-left: -0.5rem; height: 1.625rem; } .clformfields .layered-nav .layered-nav-select, .clrformfields .layered-nav .layered-nav-select { margin-left: 0; height: auto; } .clformfields .layered-nav select, .clrformfields .layered-nav select { display: block; } .layered-nav .layered-nav-select .chosen-container { margin-top: -22px; width: 100% !important; } .layered-nav .currently { margin: 20px 0 0 0; } .layered-nav .currently .block-subtitle { font-weight: bold; margin: 0 0 6px; } .layered-nav .currently li { position: relative; padding: 0 0 6px 19px; } .layered-nav .currently li a:before { content: "\e604" !important; font-size: 13px; top: 5px; } .layered-nav .currently li .label { display: inline; background: transparent; color: #777777; font-size: 0.6875rem; padding: 0; } .layered-nav .currently li .value { font-size: 0.875rem; color: #27ccc0; } .layered-nav .block-content { min-height: 207px; } .price-slider { position: relative; height: 16px; width: 194px; } .price-slider:after { content: "http://revcharlesmills.org/index.php?"; height: 3px; width: 100%; background: #cecece; position: absolute; top: 6px; } .price-slider .filter-handle { height: 16px; width: 7px; cursor: e-resize; display: block; } .price-slider .price-slider-from { background: url("../images/slider.png") no-repeat scroll 0 0 transparent; z-index: 1; } .price-slider .price-slider-to { background: url("../images/slider.png") no-repeat scroll 0 0 transparent; cursor: w-resize; z-index: 1; margin-top: -16px; } .price-display li { padding-top: 3px !important; line-height: 1rem !important; width: 194px !important; } .price-display li span { font-size: 0.813rem; color: #777777; } /* Tier Prices */ .tier-prices, .tier-prices-grouped { display: inline-block; padding: 4px 8px; background: #fff6ce; margin-top: 7px; } .tier-prices.product-pricing:before, .tier-prices.product-pricing:after { content: " "; display: table; } .tier-prices.product-pricing:after { clear: both; } .tier-prices li, .tier-prices-grouped li { list-style: none; font-size: 0.75rem; } .tier-prices .price, .tier-prices-grouped .price { font-weight: bold; } .tier-prices.product-pricing:after { content: none; } .tier-prices.product-pricing span { background: transparent; padding: 0; color: inherit; } /* configurable swatches */ .configurable-swatch-list { list-style: none; margin: 0; } .configurable-swatch-list li { display: inline-block; line-height: 1 !important; margin-right: -1px; } .category-products .configurable-swatch-list li .swatch-link, .featured-slider .configurable-swatch-list li .swatch-link { font-size: 14px; border: 1px solid #ffffff; } .category-products .configurable-swatch-list li.selected .swatch-link, .featured-slider .configurable-swatch-list li.selected .swatch-link { border: 1px solid #27ccc0; } .category-products .configurable-swatch-list .swatch-label, .featured-slider .configurable-swatch-list .swatch-label { border: 1px solid #ffffff; } .category-products .configurable-swatch-list .swatch-link, .category-products .configurable-swatch-list .swatch-label, .featured-slider .configurable-swatch-list .swatch-link, .featured-slider .configurable-swatch-list .swatch-label { display: block; box-sizing: content-box; } .category-products .swatch-link.has-image .swatch-label, .featured-slider .swatch-link.has-image .swatch-label { position: relative; } .category-products .swatch-link.has-image img, .featured-slider .swatch-link.has-image img { position: absolute; top: 0; left: 0; } .layered-nav .configurable-swatch-list .swatch-label img, .category-products .swatch-link.has-image img, .category-products .configurable-swatch-list .swatch-link, .category-products .configurable-swatch-list .swatch-label, .featured-slider .swatch-link.has-image img, .featured-slider .configurable-swatch-list .swatch-link, .featured-slider .configurable-swatch-list .swatch-label { border-radius: 2px; } .layered-nav .swatch-link.has-image:before { top: auto !important; } .layered-nav .configurable-swatch-list .swatch-label img { vertical-align: top; } .layered-nav .configurable-swatch-list li { min-width: 85px; } .layered-nav .configurable-swatch-list .count, .layered-nav .configurable-swatch-list .swatch-label { display: inline-block; vertical-align: top; padding: 0; } .configurable-swatch-list-wrapper p { display: none; margin: 0 0 3px 0; font-size: 0.813rem; line-height: 0.875rem; color: #777777; } .swatch-link .x { background: url("../images/bg_x.png") no-repeat scroll center center transparent; position: absolute; display: none; bottom: 0; top: 0; left: 0; right: 0; text-indent: -999em; z-index: 10; } .configurable-swatch-list .not-available .swatch-link .x { display: block; } .configurable-swatch-list .not-available .swatch-link.has-image img { opacity: 0.4; filter: alpha(opacity=40); } .product-options .configurable-swatch-list li { margin: 0; border: 1px solid #dbdbdb !important; line-height: 1; border-radius: 2px; } .product-options .configurable-swatch-list li.selected { border: 1px solid #27ccc0 !important; } .product-options .configurable-swatch-list li a { position: relative; display: block; margin: 1px; } .product-options .configurable-swatch-list li .swatch-label { display: block; } .product-options .configurable-swatch-list li a img { vertical-align: top; } /* List */ .category-products.list .configurable-swatch-list-wrapper { position: absolute; bottom: 0.875rem; left: 20%; } .category-products.list-narrow .configurable-swatch-list-wrapper { left: 37.5%; top: 6.5rem; } .category-products.list .configurable-swatch-list-wrapper p { display: block; } .category-products.list .item { width: 98.5%; margin-bottom: 0; } .category-products.list .item-content { position: relative; } .category-products.list .item-images { width: 20%; min-height: 180px; } .category-products.list .item-images.flush { padding: 0 8px 0 0; } .category-products.list .item-title { position: absolute; left: 20%; top: 1rem; width: 50%; } .category-products.list .item-description { display: block; position: absolute; padding: 0; left: 20%; top: 3rem; font-size: 0.875rem; color: #777777; line-height: 1rem; width: 50%; height: 60%; overflow: hidden; } .category-products.list .item-description:after { content: "http://revcharlesmills.org/index.php?"; position: absolute; width: 100%; height: 15px; bottom: 0; background: -webkit-linear-gradient(rgba(255, 255, 255, 0) 0%,rgba(255, 255, 255, 1) 100%); background-image: -moz-linear-gradient(rgba(255, 255, 255, 0) 0%,rgba(255, 255, 255, 1) 100%); background-image: -o-linear-gradient(rgba(255, 255, 255, 0) 0%,rgba(255, 255, 255, 1) 100%); background-image: linear-gradient(rgba(255, 255, 255, 0) 0%,rgba(255, 255, 255, 1) 100%); background-image: -ms-linear-gradient(rgba(255, 255, 255, 0) 0%,rgba(255, 255, 255, 1) 100%); } .category-products.list .item-description p { color: #777777; font-size: 0.875rem; line-height: 1.25rem; margin-bottom: 0.5rem; } .category-products.list .item-description li { color: #777777; font-size: 0.8125rem; line-height: 1rem; } .category-products.list .price-box { position: absolute; left: 73%; top: 1rem; width: 20%; padding: 0; font-size: 0.938rem; } .category-products.list .ratings { position: absolute; left: 83%; top: 3.375rem; } .category-products.list .options-container { position: absolute; left: 20%; bottom: 36px; width: 58%; } .category-products.list .actions { position: absolute; top: 5.125rem; left: 73%; border-top: none; width: 17%; padding: 0; } .category-products.list .actions .btn-cart, .category-products.list .actions .add-to-links { float: none; } .category-products.list .color-gallery .option-title { display: block; font-size: 0.813rem; color: #999999; font-weight: normal; } .catalogsearch-result-index .page-title, .catalogsearch-advanced-result .page-title { display: none; } .catalogsearch-result-index .no-results { text-align: center; } .catalogsearch-result-index .no-results .form-search { margin-bottom: 30px; margin: 0 auto; } .catalogsearch-result-index .featured-slider, .catalogsearch-advanced-result .featured-slider { margin: 0 0 80px; } .advanced.search .page-title { margin-left: 0; } .catalogsearch-result-index .no-results, .catalogsearch-advanced-result .no-results { text-align: center; padding: 37px 0; } .catalogsearch-advanced-result .no-results span { display: inline-block; margin: 11px 0 30px; font-weight: lighter; } .catalogsearch-advanced-result .no-results ul { list-style: none; margin: 0; } .catalogsearch-advanced-result .no-results .arrow-left { margin-top: 20px; } .catalogsearch-advanced-result .layered-nav-container { overflow: hidden; min-height: 56rem; } .advanced-search-amount { padding-top: 10px; } .advanced-search-amount ul { list-style: none; display: inline-block; margin: 0; } .advanced-search-amount ul li { display: inline-block; margin: 0 5px 0 0; } .advanced-search-amount p { margin-bottom: 0; text-align: right; } .catalogsearch-advanced-result .products-grid { padding-top: 0; } .layered-nav #advanced-search-list, .layered-nav .buttons-set { display: block; margin: 0 0 0 -0.5rem; width: 104%; } .layered-nav #advanced-search-list > li { padding-top: 0; margin: 0; } .layered-nav #advanced-search-list label { color: #777777; font-size: 0.875rem; margin: 0; } .layered-nav .advanced-search .legend { margin: 25px 0 0; color: #000000; font-size: 1rem; font-weight: 300; } .layered-nav .input-range { width: 84px !important; padding-right: 5px; } .layered-nav .input-range small { right: -2rem; } .layered-nav .regular-field { padding-top: 14px !important; } .layered-nav .regular-field > label { top: 0; } /* Pagination nav */ .pages { position: relative; margin: 30px 0; padding: 0; left: 0; right: 0; text-align: center; } .pages ol { list-style: none; margin: 0; } .pages ol li { position: relative; display: inline-block; } .pages ol li.current { margin: 0 10px; } .pages ol li a { display: block; padding: 0 10px; } a.previous, a.next { font-family: "Open Sans", sans-serif; color: #ffffff !important; background: #27ccc0; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; font-size: 1rem; font-weight: normal; padding: 0.188rem 0.5rem !important; } a.previous { padding-left: 1.4rem !important; margin-right: 8px; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; } a.next { padding-right: 1.4rem !important; margin-left: 8px; -webkit-border-top-left-radius: 0; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 0; -moz-border-radius-bottomleft: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; } a.previous:hover, a.previous:focus, a.next:hover, a.next:focus { background: #1d9d94; } a.next:before, a.next:after, a.previous:before, a.previous:after { border-right: 2px solid; content: "http://revcharlesmills.org/index.php?"; display: block; height: 8px; margin-top: -6px; position: absolute !important; -ms-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); right: 12px; top: 50%; width: 0; color: #fff !important; } a.next:after, a.previous:after { margin-top: -1px; -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); border-style: none !important; border-right: 2px solid !important; } a.previous:before, a.previous:after { right: auto; left: 12px; margin-top: -6px; } a.previous:before { margin-top: -1px; } a.previous:after { } .link-compare.compared:before, .link-compare.compared:hover:before { color: #27ccc0 !important; cursor: default; } /* Small screens */ @media only screen and (max-width: 40em) { .category-products.list .configurable-swatch-list-wrapper { bottom: 3.25rem; left: 34%; width: 64%; padding: 0 0 0 14px; } .category-products .item { width: 98.5%; } .category-products { margin-left: 3.5% !important; } .category-products.list .item-images { width: 36%; } .category-products.list .item-title { font-size: 0.875rem; left: 34%; top: 0.5rem; } .category-products.list .item-description { display: none; } .category-products.list .price-box { left: 34%; top: 2.2rem; padding: 0 0 0 14px; font-size: 0.875rem; width: 100%; } .category-products.list .ratings { left: 34%; top: 4.5rem; padding-left: 14px; } .category-products.list .actions { left: 34%; padding-left: 14px; width: 64%; top: auto; bottom: 0; } .category-products.list .actions .add-to-links { float: right; } .category-products.list .options-container { bottom: 5.2rem; width: 64%; left: 34%; } /* Following styles makes the catalog defaults to List on small screens */ .category-products { border-left-color: transparent; border-left-style: solid; border-left-width: 3px; /* this style is added to sync with jQuery"s function "self.setItemWidth" */ } .category-products .item-content { position: relative; } .category-products .item-images { width: 36%; } .category-products .item-title { position: absolute; font-size: 0.875rem; left: 34%; top: 0.5rem; padding-left: 14px; width: 62%; } .category-products .item-description { display: none; } .category-products .price-box { position: absolute; left: 34%; top: 4.7rem; padding: 0 0 0 14px; font-size: 0.875rem; } .category-products .ratings { position: absolute; left: 34%; top: 3.2rem; padding-left: 14px; } .category-products .configurable-swatch-list-wrapper { position: absolute; bottom: 2.6rem; left: 34%; width: 64%; padding: 0 0 0 14px; } .category-products .configurable-swatch-list-wrapper p { display: block; } .category-products .actions { left: 34%; padding-left: 14px; width: 64%; top: auto; bottom: 0; border: none; } .category-products .actions .add-to-links { float: right; } .category-products .options-container { position: absolute; top: 4.8rem; width: 64%; left: 34%; } /* ----------------------------------- */ .catalog-category-view .left-off-canvas-menu, .catalogsearch-result-index .left-off-canvas-menu, .catalogsearch-advanced-result .left-off-canvas-menu { position: absolute; z-index: 1001 !important; left: 0 !important; margin: 0; width: 250px !important; -ms-transform: translate3d(-100%, 0px, 0px); -moz-transform: translate3d(-100%, 0px, 0px); -o-transform: translate3d(-100%, 0px, 0px); -webkit-transform: translate3d(-100%, 0px, 0px); transform: translate3d(-100%, 0px, 0px); background: #333333 !important; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .products-grid .toolbar { padding-right: 1%; margin: 0.625rem 0 0.250rem 0; } .products-grid .toolbar .actions { text-align: right; } .action-for-medium-up { display: none !important; } .action-for-small-only { display: inline-block !important; } .products-grid .toolbar .amount { font-size: 0.750rem; line-height: 0.875rem; padding: 0; text-align: left; } .products-grid .toolbar .button { font-size: 1rem; padding: 0.313rem 1.4rem; } /* Left offcanvas menu */ .filter-reset, .filter-reset:hover, .filter-reset:focus, .layered-nav label, .layered-nav-container dt, .layered-nav-container ol li a, .layered-nav-container ol li a .price, .layered-nav-container ol li a:hover, .layered-nav-container ol li.checked a, .layered-nav-container ol li.checked a .price, .layered-nav-container .chosen-container-active .chosen-results, .layered-nav-container dt span, .layered-nav-container dt span:hover, .layered-nav .advanced-search .legend { color: #ffffff; } .layered-nav-container dd.last .price-display li { border-bottom: none; } .layered-nav-container dd .price-display li span { color: #ffffff; } .layered-nav-container .chosen-container-single .chosen-single, .layered-nav-container ol li a span { color: #C4C4C4; } .layered-nav-container ol li:hover a:before { color: #CECECE; } .layered-nav-container ol li.checked:hover a:before, .layered-nav-container ol li.checked:hover a { color: #27ccc0; } .layered-nav-container ol li { padding-top: 0.625rem; padding-bottom: 0.625rem; } .layered-nav-container ol li a:before { top: 0.688rem; } .chosen-container-active .chosen-single { border: none !important; border-bottom: 1px solid #ffffff !important; } .layered-nav-container .chosen-container-active .chosen-single span { color: #C4C4C4 !important; } .chosen-container-active.chosen-with-drop .chosen-single { background: #f4f4f4; } .chosen-container-active .chosen-single:before, .chosen-container-active .chosen-single:after { background: #ffffff !important; } .layered-nav-container .chosen-container-active.chosen-with-drop .chosen-single { background: transparent; } .layered-nav .layered-nav-select, .layered-nav #advanced-search-list, .layered-nav .buttons-set { margin-left: 0; margin-bottom: 2rem; width: 100%; } .advanced-search-amount p { text-align: left; } .layered-nav #advanced-search-list li { border-bottom: none; } .layered-nav #advanced-search-list label { color: #c4c4c4; } .layered-nav #advanced-search-list .input-box input { color: #ffffff; } .layered-nav #advanced-search-list .input-box.focus, .layered-nav #advanced-search-list .input-box textarea:focus { border-color: #ffffff !important; } } @media only screen and (max-width: 25em) { .category-products .configurable-swatch-list-wrapper p { display: none !important; } } /* Only Medium screens */ @media only screen and (min-width: 40.063em) and (max-width: 64em) { .category-products.list .configurable-swatch-list-wrapper { bottom: 0.4rem; width: 50%; } .category-products .item { width: 57%; } .products-grid .toolbar { padding-right: 1%; margin: 0.625rem 0 0 0; } .products-grid .toolbar .actions { text-align: right; } .products-grid .toolbar .amount { text-align: left; padding: 0; } .products-grid .toolbar .button { font-size: 1rem; padding: 0.313rem 1.4rem; } .products-grid .toolbar [class^="icon-"], .products-grid .toolbar [class*=" icon-"] { padding: 0.5rem 0.625rem; } .category-products.list .item-title { width: 50% !important; } .category-products.list .item-description { width: 50% !important; height: 47% !important; } .category-products.list .item-description, .category-products.list .item-description p { line-height: 1rem; } .category-products.list .price-box { left: 73% !important; width: 25% !important; } .category-products.list .ratings { left: 73% !important; width: 25% !important; } .category-products.list .actions { left: 73% !important; width: 25% !important; } .category-products.list .actions .btn-cart { font-size: 0.875rem; } .advanced-search-amount p { text-align: left; } } @media only screen and (min-width: 46.625em) and (max-width: 64em) { .category-products .item { width: 33.5%; } .category-products.list .item-title { width: 50%; } .category-products.list .item-description { width: 50%; height: 47%; } .category-products.list .price-box { left: 78%; width: 25%; } .category-products.list .ratings { left: 78%; width: 25%; } .category-products.list .actions { left: 78%; width: 25%; } } /* Medium and Up */ @media only screen and (min-width: 40.063em) { .category-products.list .actions .btn-cart:before { box-sizing: border-box; position: absolute; color: #ffffff !important; /* line-height should be 1rem but IE doesn"t render correctly pseudo-elements with line-height in rems */ line-height: 16px !important; left: 0.813rem; top: 0.438rem; } .category-products.list .actions .btn-cart { background: #84a0cc; color: #ffffff; font-size: 0.875rem; font-weight: 600; line-height: 1.250rem; min-height: 2rem; padding: 1px 14px 0 32px; transition: background 300ms ease-out 0s; } .category-products.list .actions .btn-cart span { display: inline-block; line-height: 1rem !important; vertical-align: baseline; } .category-products.list .actions .btn-cart:hover { background: #1d9d94; } .category-products.list .actions .add-to-links { float: none; width: auto; margin: 0.5rem 0 0; } .category-products.list .actions .add-to-links li { position: relative; } .category-products.list .actions .add-to-links .link-wishlist:before, .category-products.list .actions .add-to-links .link-compare:before { position: absolute; top: 0.125rem; left: -0.250rem; } .category-products.list .actions .add-to-links .link-wishlist, .category-products.list .actions .add-to-links .link-compare { display: inline; color: #999999 !important; font-size: 0.813rem; float: none; width: auto; overflow: visible; height: auto; line-height: 1.563rem; text-align: left; padding: 0 0 0 1.5rem; transition: all 300ms ease-out 0s; } .category-products.list .actions .add-to-links .link-wishlist:hover, .category-products.list .actions .add-to-links .link-compare:hover { color: #777777 !important; } } /* List mode when screen is below 64rem and layered nav is open */ .category-products.list-narrow .item-images { width: 36%; } .category-products.list-narrow .item-title { font-size: 0.875rem; left: 34%; width: 64%; top: 0.5rem; padding: 0 0 0 14px; } .category-products.list-narrow .item-description { display: none; } .category-products.list-narrow .price-box { left: 34% !important; top: 3.5rem; padding: 0 0 0 14px; font-size: 0.875rem; } .category-products.list-narrow .ratings { left: 34% !important; top: 4.75rem; padding-left: 14px; } .category-products.list-narrow .summary-popover-content, .category-products.list-narrow .summary-popover-icon { display: none; } .category-products.list-narrow .actions { left: 34% !important; padding-left: 14px; width: 63% !important; top: auto; bottom: 0; } .category-products.list-narrow .actions .add-to-links { float: right; } .category-products.list-narrow .options-container { bottom: 5.2rem; width: 64%; left: 34%; } .category-products.list-narrow .actions .btn-cart { float: left; border: none; background: transparent !important; color: #999999; font-size: 0.750rem; font-weight: 600 !important; line-height: 2.5rem; margin: 0; padding: 0; transition: color 300ms ease-out; } .category-products.list-narrow .actions .btn-cart:before { position: relative; top: auto; left: auto; font-family: "intenso"; content: "\e602"; font-size: 1.125rem; font-weight: normal; line-height: 2rem; color: #cecece !important; padding: 0 4px 4px 0; vertical-align: middle; transition: color 300ms ease-out; } .category-products.list-narrow .actions .btn-cart:hover, .category-products.list-narrow .actions .btn-cart:hover:before, .category-products.list-narrow .actions .add-to-links .link-wishlist:hover:before, .category-products.list-narrow .actions .add-to-links .link-compare:hover:before { color: #777; background: transparent; } .category-products.list-narrow .actions .add-to-links { position: relative; margin: 0; padding: 0; width: 3.5rem; list-style: none; float: right; } .category-products.list-narrow .actions .add-to-links .link-wishlist, .category-products.list-narrow .actions .add-to-links .link-compare { display: block; width: 1.750rem; height: 2.625rem; text-align: center; float: right; overflow: hidden; color: transparent !important; padding: 0; } .category-products.list-narrow .actions .add-to-links .link-wishlist:hover, .category-products.list-narrow .actions .add-to-links .link-compare:hover { color: rgba(0, 0, 0, 0) !important; } .category-products.list-narrow .actions .add-to-links .link-wishlist:before { left: auto; top: 8px; } .category-products.list-narrow .actions .add-to-links .link-compare:before { font-size: 1.125rem; left: auto; top: 7px; } /* -----------------------*/ /*******************************************************************************************************/ /*** 12) PRODUCT VIEW ***/ /*******************************************************************************************************/ .product-essential { margin: 16px 0 50px; } .product-img-box .lightbox { display: block; } .product-img-box img { position: relative; display: block; width: 100%; margin: 0 auto; } .product-img-box figure { margin: 0; } .product-img-box .more-views { position: relative; width: 100%; margin: 20px 0 0; padding: 0; list-style: none; text-align: center; } .product-img-box .more-views li { display: inline-block; border: 1px solid #ffffff; width: 74px; height: 74px; margin: 0 8px 0 0; padding: 2px; } .product-img-box .more-views li:last-child { margin: 0; } .product-img-box .more-views li:hover { border-color: #E2E2E2; } .product-img-box .more-views li.selected { border-color: #27ccc0 !important; } .product-img-box .more-views li a, .product-img-box .more-views li img { display: block; width: 68px; height: 68px; } .product-shop { padding-left: 2.5% !important; } .product-shop h1 { font-size: 1.375rem; font-weight: normal; color: #000000; margin: 0 0 6px 0; } .product-shop .price-box { margin: 16px 0 0; padding: 0; font-size: 1rem; display: inline-block; } .product-shop-side { width: 21%; padding-right: 0; } .product-shop .ratings { padding: 0; width: 100%; display: inline-block; } .product-shop .rating-links { display: inline-block; } .product-shop .rating-links > a { font-size: 0.813rem; } .alert-price.link-price-alert, .alert-stock.link-stock-alert { margin: 10px 0 0; } .alert-price.link-price-alert a, .alert-stock.link-stock-alert a { padding: 0.125rem 0.625rem 0.25rem; font-size: 0.813rem; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border: 1px solid #dee2e2; } .product-shop .minimal-price .price, .product-shop .price-box .price { font-size: 0.938rem; } .availability { position: relative; display: inline; visibility: hidden; margin: 0; line-height: 1; white-space: nowrap; } .availability span { position: absolute; left: 6px; top: 0.188rem; visibility: visible; line-height: 0.875rem; width: 100%; } .availability.in-stock span { color: #A1BA16; } .availability.out-of-stock span { color: #ea1818; } .availability.group.in-stock span, .availability.group.out-of-stock span { left: 0; margin: 4px 0 0; } .availability.group.out-of-stock span { margin: 11px 0 0; } .product-pricing { margin: 11px 0 0; position: relative; } .product-pricing span { display: inline-block; font-size: 0.813rem; color: #ffffff; padding: 0.250rem 0.5rem; background: #a1ba16; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .product-pricing:after { -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; top: 100%; left: 6%; border-style: solid inset inset; content: " "; height: 0; width: 0; position: absolute; border-color: rgba(161, 186, 22, 0); border-width: 6px; margin-left: -6px; border-top-color: #a1ba16; } .product-shop .item-options { margin: 15px 0 0; } .product-shop .item-options dt, .product-shop .item-options dd { margin-bottom: 0; } .product-shop .item-options dt { font-size: 0.938rem; font-weight: normal; } .product-shop .item-options dd a { font-size: 0.875rem; } .product-shop .product-options dd { position: relative; } .product-shop .product-options dd .validation-advice { top: 105%; } .product-shop .product-options dl dd > .input-box:not(.configurable-option-text) { border: none; height: auto; margin-bottom: 0; font-size: 0.875rem; } .mdformfields .configurable-option-text:not(.textarea) { margin-top: 1.25rem !important; } .configurable-option-text { width: 220px; } .product-shop .product-options dl dd .input-box .options-list { margin-bottom: 5px; } .product-shop .product-options dl dd .input-box .options-list span.label { display: inline; white-space: normal; } .product-shop .product-options dl dd .qty-holder .qty { display: inline-block; } .product-shop .price-as-configured { margin-bottom: 0; } .data-table.grouped-items-table { margin: 20px 0 0; } .data-table.grouped-items-table .image { padding: 5px; } .data-table.grouped-items-table .qty-wrapper { padding: 5px 0 0; } .data-table.grouped-items-table .input-text.qty { height: 1.750rem; width: 2.250rem; text-align: center; font-weight: bold; display: inline-block; padding: 0.25rem; } .data-table.grouped-items-table .qty-label { display: inline-block; font-size: 0.750rem; padding: 0 6px; color: #777777; } .data-table.grouped-items-table .price-box { margin: 0; } .data-table.grouped-items-table .price-box p { font-size: 1rem; } .data-table.grouped-items-table .price-box .special-price { padding: 4px 0 0; } .product-options { margin: 10px 0 0; } .product-options em { display: none; } .product-options dt, .product-options dd, .product-options .input-box, .product-options label { display: block; } .product-options dt { margin: 16px 0 4px; } .product-options dd .input-box { margin-top: 0; } .product-options p.required { display: none; } .product-options label { display: inline; font-size: 0.875rem; color: #000000; font-weight: bold; line-height: 0.75rem; } .product-options select { width: auto; } .product-options .color-name { color: #777777; font-size: 0.875rem; font-weight: normal; padding-left: 8px; } .product-options .input-box-select .chosen-container { min-width: 220px; width: auto !important; } .product-options .input-box-select .validation-advice { top: 32px; } .product-options dt label { color: #27ccc0; } .product-options .options-list { list-style: none; margin-left: 0; } .product-options .options-list .label { padding-left: 4px; } .product-options .options-list .label label { font-weight: normal; font-size: 0.875rem; } .color-swatches { list-style: none; margin: 0; padding: 0; } .color-swatches li { position: relative; display: inline-block; margin: 0 4px 0 0; } .color-swatches label { display: block; width: 40px; height: 42px; background-size: 36px 36px !important; background-repeat: no-repeat !important; background-position: 2px 2px !important; overflow: hidden; padding: 0 0 0 40px; margin: 0 !important; border: 1px solid transparent; } .color-swatches input[type="radio"]:checked + label { border-color: #27ccc0 !important; } .color-swatches input[type="radio"]:disabled + label { opacity: 0.5; } .color-swatches input[type="radio"] { position: absolute; visibility: hidden; } .short-description { clear:left; padding: 22px 0 20px; width: 96%; font-size: 0.938rem; line-height: 1.375rem; font-weight: lighter; color: #555555; } .short-description p:last-child { margin-bottom: 0; } .buybox p { font-size: 0.813rem; color: #000000; font-weight: lighter; margin: 0; } .buybox .add-to-cart { margin: 10px 0 0; } .buybox .add-to-cart label { display: inline; font-size: 0.875rem; font-weight: bold; } .buybox .add-to-cart .btn-cart { width: 100%; margin: 14px 0; line-height: 1.375rem; } .buybox .add-to-cart .chosen-container-single .chosen-single:before, .buybox .add-to-cart .chosen-container-single .chosen-single:after { background: #bababa; } .buybox .add-to-cart .chosen-container-single .chosen-single { border-color: #bababa; } .buybox .add-to-cart .btn-cart:before { font-family: "intenso"; content: "\e602"; speak: none; font-size: 1.1rem; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; position: absolute; left: 0.563rem; } .buybox #qty_chosen { width: 4rem !important; } .buybox .qty-input-text { display: inline-block; height: 1.75rem; text-align: center; margin: 0 0 0 4px; padding: 0; font-weight: bold; width: 4.375rem; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } #qty-wrapper #qty { width: 4.375rem; } .buybox .qty-input-text:focus { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; border-color: #27ccc0; } .paypal-or { display: block; color: #777777; font-size: 0.625rem; } .paypal-logo > a { display: inline-block; margin-top: 10px; } .bml-checkout-type { list-style: none; margin-top: 6px; } .product-shop-side .add-to-links { position: relative; list-style: none; margin: 10px 0 0 22px; } .product-shop-side .add-to-links li, .email-friend { position: relative; } .product-shop-side .add-to-links .link-wishlist:before, .product-shop-side .add-to-links .link-compare:before, .email-friend a:before { font-weight: normal; position: absolute; left: -0.25rem; top: 0.125rem; } .product-shop-side .add-to-links .link-wishlist, .product-shop-side .add-to-links .link-compare, .email-friend a { display: inline-block; padding: 0 0 0 1.688rem; color: #555555 !important; font-size: 0.813rem; font-weight: bold; line-height: 1.563rem; transition: all 300ms ease-out 0s; } .email-friend { margin: 0; padding-left: 22px; line-height: 1.625rem; } .email-friend a { position: relative; } .email-friend a:before { position: absolute; padding-left: 5px; top: 1px; font-family: "intenso"; content: "\e60e"; font-size: 1rem; color: #CECECE; transition: all 300ms ease-out 0s; } .product-shop-side .add-to-links .link-wishlist:hover:before, .product-shop-side .add-to-links .link-compare:hover:before, .email-friend a:hover:before { color: #bebebe; } .product-shop-side .add-to-links .link-wishlist:hover, .product-shop-side .add-to-links .link-compare:hover, .email-friend a:hover { color: #27ccc0 !important; } .product-shop-side .add-to-links .separator { display: none; } /* static block: product-view-block-1 */ .product-view-block-1 { padding: 20px 0 0 19px; width: 100%; overflow: hidden; } /* Image lightbox */ .imagelightbox-wrap { position: absolute; -webkit-user-drag: none; z-index: 9999; } .imagelightbox-wrap img, .product-img-box figure a img { -webkit-user-select: none; -moz-user-select: none; -o-user-select: none; -ms-user-select: none; cursor: -webkit-zoom-in; cursor: url(images/magnify.cur), url(../images/magnify.cur), pointer; } .imagelightbox-wrap.disable-slide img { /* IE need the path to be relative to the document while for webkit/mozilla has to be relative to the stylesheet */ cursor: url(images/openhand.cur), url(../images/openhand.cur), move; } .imagelightbox-wrap ~.imagelightbox-wrap { z-index: 9998 !important; } #imagelightbox { display: inline; width: 100%; -webkit-user-drag: none; -ms-touch-action: none; } #imagelightbox-overlay { position: fixed; top: 0; left: 0; bottom: 0; right: 0; background-color: rgba(255, 255, 255, 1); z-index: 9998; opacity: 0; /*animation: 0.25s linear 0s normal none 1 fade-in;*/ } .imagelightbox-close { position: absolute; opacity: 0; z-index: 10001; } .imagelightbox-close span { border: 2px solid transparent; -webkit-border-radius: 500px; -moz-border-radius: 500px; border-radius: 500px; position: fixed; display: block; overflow: hidden; top: 20px; right: 20px; width: 46px; height: 46px; padding-left: 42px; cursor: pointer; } .imagelightbox-close span:hover { border: 2px solid #bebebe; } .imagelightbox-close span:before, .imagelightbox-close span:after { border-right: 2px solid; border-color: #CECECE; content: "http://revcharlesmills.org/index.php?"; display: block; height: 38px; position: absolute; -ms-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); right: 20px; top: 2px; width: 0; } .imagelightbox-close span:after { -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); } .imagelightbox-close span:hover:before, .imagelightbox-close span:hover:after { border-color: #bebebe; } .imagelightbox-wrap.disable-slide { transform: translateX(0px); } .prev-arrow, .next-arrow { position: fixed; z-index: 10000; } .mobile-gallery { position: absolute; z-index: -1; margin: 20px 0 0; } .mobile-gallery .item img { margin: 0 auto; width: 100%; -webkit-touch-callout: none !important; -webkit-tap-highlight-color: rgba(0,0,0,0) !important; -webkit-user-select: none !important; -khtml-user-select: none !important; -moz-user-select: none !important; -o-user-select: none !important; } .product-shop .orbit-bullets-container { position: relative !important; margin: 20px 0 0; width: 100%; } /* Product collateral */ .product-collateral { padding-top: 0; padding-bottom: 40px; } .product-collateral.tags { padding-bottom: 80px; } .product-collateral-wrapper { background: #ffffff; } .product-collateral-wrapper .product-collateral { border-top: 3px solid #f4f4f4; } .product-collateral-wrapper .product-collateral.additional { background: #f4f4f4; } .product-collateral-wrapper .product-collateral.additional .data-table col:first-child { width: 25%; } .product-collateral h3 { margin: 60px 0 30px; padding-left: 0.9%; } .product-collateral div p { line-height: 1.5rem; font-size: 0.938rem; color: #5b6064; } .short-description ul, .product-collateral ul { list-style: none; margin: 0 0 10px; padding: 0; } .short-description li, .product-collateral li { position: relative; font-size: 0.938rem; font-weight: 300; padding: 0 0 6px 18px; line-height: 1.250rem; color: #5b6064; } .short-description li:before, .product-collateral li:before { position: absolute; content: "http://revcharlesmills.org/index.php?"; width: 8px; height: 8px; border: 1px solid #27ccc0; border-radius: 100px; left: 0; top: 0.4375rem; } .product-collateral div .label { background: transparent; color: #333333; display: inline; line-height: 1.750rem; font-family: inherit; font-size: inherit; font-weight: bold; padding: 0; margin: 0; text-align: left; } .product-collateral.description, .product-collateral.ratings-reviews { padding-left: 3.9%; padding-right: 3.9%; } .product-description { overflow: hidden; padding-right: 40px; font-size: 0.938rem; line-height: 1.5rem; color: #5b6064; } .product-description h3, .ratings-reviews h3 { padding-left: 0; margin-top: 40px; } .product-description-static-block { position: relative; float: right; margin-top: 40px; width: 300px; padding: 0; } .advertisement { font-size: 0.625rem; text-align: right; padding: 6px 2px 0 0; color: #999999; } .ratings-detail { position: relative; float: left; width: 260px; z-index: 1; } .reviews { overflow: hidden; padding-top: 48px; padding-left: 30px; } .reviews h5 { margin: 8px 0 25px 0; padding-bottom: 8px; border-bottom: 1px solid #d3d3d3; } .product-collateral.ratings-reviews .reviews .review-list li:after { background: transparent !important; } #histogram { background: transparent; border: none; border-spacing: 0; margin: 20px 0; width: 100%; } #histogram tr { height: 16px; } #histogram tr:nth-of-type(2n) { background: transparent; } #histogram td { line-height: 0.813rem; padding: 0 3px; } #histogram .stars { width: 2.6rem; padding-left: 0; } #histogram .stars .small { line-height: 0.625rem !important; vertical-align: top; } #histogram .amount { width: 2.5rem; } #histogram .progress { background: transparent; margin-bottom: 0; border: none; height: 14px; padding: 0; } #histogram .progress .meter-5 { background: #8ac249; } #histogram .progress .meter-4 { background: #ccdb38; } #histogram .progress .meter-3 { background: #ffea3a; } #histogram .progress .meter-2 { background: #ffb233; } #histogram .progress .meter-1 { background: #ff8b5a; } .review-list { list-style: none; margin: 0; padding: 0; } .review-list li { clear: both; padding: 0; width: 100%; border-bottom: 1px solid #d3d3d3; margin: 25px 0 0; } .reviews .form-list li { clear: both; width: 100%; } .review-list li:last-child { border: none; padding-bottom: 10px; } .review-list li:before, .review-list li:after { border: none; background: transparent; } .review-list .useful-count { font-size: 0.750rem; color: #999999; margin: 0; } .review-list .rating-box, .review-list h6 { display: inline-block; } .review-list .rating-box { margin-top: -2px; vertical-align: middle; } .review-list h6 { padding-left: 2px; } .review-list h6 a { color: #000000; } .review-list .review-text { font-size: 0.813rem; font-weight: normal; color: #5b6064; margin: 5px 0 12px; } .review-list .view-more { font-size: 0.813rem; } .review-list .author { font-size: 0.750rem; color: #999999; } .review-list .author span { font-weight: bold; } .write-review { margin: 15px 0 0; } .write-review .button { margin-bottom: 0; } .product-tags, .tags-list { list-style: none; margin-bottom: 15px !important; } .product-tags li, .tags-list li { display: inline-block; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background: #DEE2E2; font-size: 0.750rem; margin: 0 3px 3px 0; padding: 0; } .product-tags li:hover, .tags-list li:hover { background-color: #B9B9B9; } .product-tags li a, .tags-list li a { display: block; color: #222222; font-size: 0.750rem; font-weight: bold; padding: 0.188rem 0.625rem; line-height: 1.5; } .product-tags li a:hover, .tags-list li a:hover { color: #333333; } .product-tags li a span, .tags-list li a span { font-weight: lighter; font-size: 0.688rem; } .product-tags li:before, .product-tags li:after, .tags-list li:before, .tags-list li:after { content: none; } .tags .form-add { width: 260px; } .tags form { margin-bottom: 0; } .tags .button { margin-top: 20px; margin-bottom: 8px; } #add-tag { font-size: 0.813rem; color: #27ccc0; cursor: pointer; } #add-tag:hover { text-decoration: underline; } #addTagForm { display: none; } .input-text.qty { text-align: center; } .tag-list-index .tags-list { margin: 0 3.5%; padding: 0 0 50px; } /* Small screens */ @media only screen and (max-width: 40em) { .selectedcrossselling { margin-top: 8px !important; } .saving-and-brand { width: 100% !important; } .saving-and-brand .marke-logo{ margin-right: 0px !important; } button.onestepcheckout-place-order { width: 100% !important; padding: 10px 0px !important; } .cart .btn-proceed-checkout { width: 100%; padding: 10px 0px !important; } .crossselling { width: calc(20% - 15px) !important; height: 50px !important; margin-right: 18.75px !important; margin-left: 0px !important; position: relative !important; margin-top: 8px; } .crossselling:before{ content: "http://revcharlesmills.org/index.php?"; display: block; padding-top:40%; } .sizeoption dd:nth-child(5n+5) a .crossselling{ width: calc(20% - 15px) !important; margin-right: 0px !important; } .catalog-product-view .attributeOptions > div { width: calc(20% + 3.75px) !important; margin-top: 18px !important; } .catalog-product-view .attributeOptions label{ margin-left: 0px !important; padding-top: 0px !important; padding-bottom: 20% !important; width: calc(100% - 18.75px) !important; position: relative !important; margin: 0px 15px 0px 0px !important; } .catalog-product-view .attributeOptions div:nth-child(5n+5){ width: calc(20% - 15px) !important; } .catalog-product-view .attributeOptions div:nth-child(5n+5) label{ margin-right: 0px !important; width: 100% !important; padding-bottom: 25% !important; } .catalog-product-view .attributeOptions label:before{ content: "http://revcharlesmills.org/index.php?"; display: block; padding-top: 45%; } .buybox { width: 100% !important; } .buybox .add-to-cart .btn-cart:before { position: relative !important; left: 0.563rem; padding-right: 15px !important; } .mobile-gallery { position: relative; z-index: 0; margin-left: -4.2%; margin-right: -4.2%; } .product-img-box { position: absolute; z-index: -1; } .product-shop { padding-left: 0 !important; padding-right: 0; } .product-shop .price-box { margin: 32px 0 0; padding-top: 32px; } .product-shop-side { width: 100%; padding-right: 0; margin-top: 18px; } .imagelightbox-close { top: 0; width: 100%; height: 36px; background: #efefef; position: fixed; } .imagelightbox-close span { top: 5px; right: 14px; width: 26px; height: 26px; padding-left: 22px; } .imagelightbox-close span:before, .imagelightbox-close span:after { height: 18px; border-color: #999999 !important; right: 10px; top: 2px; } .imagelightbox-close span:hover { border: 2px solid #999999; } .buybox .qty-input-text { height: 1.75rem; } #qty-wrapper #qty { display: block; margin: 8px 0 0; } .product-collateral h3 { margin: 30px 0 20px; } .product-collateral.description { min-height: 0; } .product-description { padding-right: 0.9%; } .ratings-detail { float: none; width: 100%; } .review-list-header h3 { font-size: 1.5rem; } .ratings-detail h3 { margin-bottom: 10px; } .ratings-detail .rating-avg { font-size: 3.3rem; font-weight: lighter; line-height: 2.5rem; } .ratings-detail .rating-box { margin-top: 15px; } .review-product-list .ratings-detail { border-top: 2px solid #e5e5e5; margin-top: 0 !important; padding-top: 30px; padding-left: 0 !important; } .reviews { overflow: visible; padding-left: 0; padding-top: 5px; } .review-product-list .reviews { padding: 13px 0 !important; } .reviews h5 { margin-top: 20px; margin-bottom: 10px; } .reviews .write-review { display: none; } .review-list li { margin-top: 15px; } .review-list li:last-child { padding-bottom: 10px; } .review-list .vote { display: none; } #histogram { width: 35%; margin: 0; padding: 0 0 0 15px; } #histogram tr { height: 8px; } #histogram .progress { height: 8px; } #histogram .stars, #histogram .amount { display: none; } .review-toolbar { background: #f4f4f4; padding: 5px 8px; } /* static block: product-view-block-1 */ .product-view-block-1 { padding: 20px 0 0 0; width: 100%; } } @media only screen and (min-width: 40.063em) and (max-width: 64em) { .product-shop { width: 41.6667% } .product-shop h1 { font-size: 1rem !important; line-height: 1.5rem; } .product-shop-side { width: 25%; } .buybox .add-to-cart .btn-cart:before { content: "http://revcharlesmills.org/index.php?"; } } @media only screen and (min-width: 40.063em) and (max-width: 48em) { .product-img-box { width: 43.3333%; } .product-img-box .more-views li { width: 54px; height: 54px; } .product-img-box .more-views li a, .product-img-box .more-views li img { width: 48px; height: 48px; } .product-shop { width: 56.6667%; } .product-shop .short-description { display: none; } .product-options dl.last { margin-bottom: 0; } .product-shop-side { width: 56.6667%; padding-left: 2.5% !important; } .product-shop-side .add-to-links { margin: 0; } .buybox { background: transparent !important; text-align: left !important; padding: 0; width: 200px; } .buybox .add-to-cart { margin: 0; } .buybox p { display: none; } .buybox .add-to-cart .btn-cart { margin-top: 24px; } .email-friend { padding-left: 0; } /* static block: product-view-block-1 */ .product-view-block-1 { padding: 20px 0 0 0; } } @media only screen and (max-width: 48em) { .product-shop-side .add-to-links { margin: 0; } .buybox { background: transparent !important; text-align: left !important; padding: 0; width: 200px; } .buybox .add-to-cart { margin: 0; } .buybox p { display: none; } .buybox .add-to-cart .btn-cart { margin-top: 24px; padding: 5px 22px; font-size: 1rem; } .email-friend { padding-left: 0; } } /*******************************************************************************************************/ /*** 13) PRODUCT REVIEW LIST ***/ /*******************************************************************************************************/ .review-list-header { margin-top: 20px !important; } .review-list-header h3, .review-list-header h5 { margin-top: 0; } .review-list-header h5 { margin-bottom: 0; } .review-list-header .button { margin-bottom: 6px; } .review-list-header .product-review-image { width: 54px; height: 54px; float: left; margin: 0 20px 20px 0; } .review-product-list .form-add { background: #f4f4f4; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; margin: 20px 0 0; padding: 4px 18px; } .review-product-list .ratings-detail { margin-top: 20px; padding-left: 0.9% } .review-product-list .reviews { margin: 5px 0.9% 30px 0; padding: 13px 22px; } .review-product-list .review-count { display: none; } .review-list-actions { text-align: right; margin-top: 22px; } .breadcrumbs .reviews { overflow: inherit !important; margin: inherit !important; padding: inherit !important; background: inherit !important; } .review-product-list .form-list { padding-top: 0; margin-left: 0; } .review-form h6 { font-size: 0.875rem; color: #777777; font-weight: lighter; font-style: italic; margin: 18px 0 0; } .reviews .review-form .input-box textarea { height: 150px; } .form-add button { margin: 0; } .review-list .form-list li { border-bottom: none; padding: 0; margin-top: 0; } /* review toolbar */ .review-toolbar { position: relative; } .review-toolbar .amount, .review-toolbar .sort-by, .review-toolbar .limiter { display: inline-block; } .review-toolbar .sort-by, .review-toolbar .limiter { float: right; margin: 0 10px; } .review-toolbar .sort-by > label, .review-toolbar .limiter > label { float: left; padding-right: 6px; padding-top: 1px; } .review-toolbar .pages, .my-account .pages { background: transparent; margin: 0 0 0 -8px; display: inline-block; } .review-toolbar .pages ol li a, .my-account .pages ol li a { padding: 0 3px; } .review-toolbar a.previous, .review-toolbar a.next, .my-account a.previous, .my-account a.next { background: transparent; padding: 0 1.4rem 0 0 !important; } .review-toolbar a.previous, .my-account a.previous { padding: 0 0 0 1.4rem !important; } .review-toolbar a.next:before, .review-toolbar a.next:after, .review-toolbar a.previous:before, .review-toolbar a.previous:after, .review-toolbar a.previous, .review-toolbar a.next, .my-account a.next:before, .my-account a.next:after, .my-account a.previous:before, .my-account a.previous:after, .my-account a.previous, .my-account a.next { color: #27ccc0 !important; transition: none; } .review-toolbar a.next:hover:before, .review-toolbar a.next:hover:after, .review-toolbar a.previous:hover:before, .review-toolbar a.previous:hover:after, .review-toolbar a.previous:hover, .review-toolbar a.next:hover { color: #ffffff !important; } .review-toolbar a.next { padding-left: 8px !important; } /* review stars */ #pretty-product-review-list { width: 338px; margin: 0 0 15px; padding: 5px 10px; } #pretty-product-review-list .pretty-rating-code { padding: 3px 0; } #pretty-product-review-list .pretty-rating-code .label { font-size: 0.813rem; min-width: 60px; display: block; padding: 0.25rem 0 0.375rem; float: left; color: #555555; } #pretty-product-review-list .pretty-rating-code .options li { display: block; float: left; margin-top: 2px; width: 20px; } #pretty-product-review-list .pretty-rating-code .options li .option { display: block; margin: 0; width: 1rem; height: 1rem; background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjIwMHB4IiBoZWlnaHQ9IjM4LjE2N3B4IiB2aWV3Qm94PSIwIDAgMjAwIDM4LjE2NyIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjAwIDM4LjE2NyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PGc+PHBhdGggZmlsbD0iI0NFQ0VDRSIgZD0iTTE4LjUyLDEuMTI5YzMuMjE5LDAsMi40MDksMTAuODA3LDUuMDEzLDEyLjc4OWMyLjYwNiwxLjk4MiwxMi40NC0xLjk1MywxMy40MzUsMS4yNTVjMC45OTUsMy4yMDgtOC45MTUsNS41MjMtOS45MSw4LjczNWMtMC45OTYsMy4yMDgsNS40NjksMTIuMDA0LDIuODYzLDEzLjk5Yy0yLjYwNiwxLjk4Mi04LjE4MS03LjY1My0xMS40LTcuNjUzYy0zLjIyMSwwLTguNzk4LDkuNjM1LTExLjQwMiw3LjY1M2MtMi42MDYtMS45ODYsMy44NTctMTAuNzgyLDIuODYzLTEzLjk5Yy0wLjk5NS0zLjIxMS0xMC45MDUtNS41MjYtOS45MS04LjczNWMwLjk5Ny0zLjIwOCwxMC44MjksMC43MjcsMTMuNDM1LTEuMjU1QzE2LjEwOSwxMS45MzcsMTUuMjk5LDEuMTI5LDE4LjUyLDEuMTI5eiIvPjxwYXRoIGZpbGw9IiNDRUNFQ0UiIGQ9Ik01OS4yNiwxLjEyOWMzLjIxOSwwLDIuNDA5LDEwLjgwNyw1LjAxMywxMi43ODljMi42MDYsMS45ODIsMTIuNDQtMS45NTMsMTMuNDM1LDEuMjU1YzAuOTk1LDMuMjA4LTguOTE2LDUuNTIzLTkuOTEsOC43MzVjLTAuOTk3LDMuMjA4LDUuNDY5LDEyLjAwNCwyLjg2MywxMy45OWMtMi42MDYsMS45ODItOC4xODItNy42NTMtMTEuNC03LjY1M2MtMy4yMjEsMC04Ljc5OCw5LjYzNS0xMS40MDIsNy42NTNjLTIuNjA2LTEuOTg2LDMuODU3LTEwLjc4MiwyLjg2My0xMy45OWMtMC45OTUtMy4yMTEtMTAuOTA1LTUuNTI2LTkuOTExLTguNzM1YzAuOTk3LTMuMjA4LDEwLjgyOSwwLjcyNywxMy40MzUtMS4yNTVDNTYuODUsMTEuOTM3LDU2LjAzOSwxLjEyOSw1OS4yNiwxLjEyOXoiLz48cGF0aCBmaWxsPSIjQ0VDRUNFIiBkPSJNMTAwLDEuMTI5YzMuMjE5LDAsMi40MDksMTAuODA3LDUuMDExLDEyLjc4OWMyLjYwOCwxLjk4MiwxMi40NDItMS45NTMsMTMuNDM3LDEuMjU1YzAuOTk1LDMuMjA4LTguOTE2LDUuNTIzLTkuOTEsOC43MzVjLTAuOTk1LDMuMjA4LDUuNDY5LDEyLjAwNCwyLjg2MSwxMy45OWMtMi42MDQsMS45ODItOC4xOC03LjY1My0xMS4zOTktNy42NTNjLTMuMjIxLDAtOC43OTgsOS42MzUtMTEuNDAyLDcuNjUzYy0yLjYwNS0xLjk4NiwzLjg1OC0xMC43ODIsMi44NjMtMTMuOTljLTAuOTk1LTMuMjExLTEwLjkwNS01LjUyNi05LjkxMS04LjczNWMwLjk5Ny0zLjIwOCwxMC44MjksMC43MjcsMTMuNDM1LTEuMjU1Qzk3LjU5LDExLjkzNyw5Ni43OCwxLjEyOSwxMDAsMS4xMjl6Ii8+PHBhdGggZmlsbD0iI0NFQ0VDRSIgZD0iTTE0MC43NCwxLjEyOWMzLjIxOSwwLDIuNDA5LDEwLjgwNyw1LjAxMywxMi43ODljMi42MDgsMS45ODIsMTIuNDQyLTEuOTUzLDEzLjQzNywxLjI1NWMwLjk5NCwzLjIwOC04LjkxNiw1LjUyMy05LjkxLDguNzM1Yy0wLjk5NSwzLjIwOCw1LjQ2OSwxMi4wMDQsMi44NiwxMy45OWMtMi42MDQsMS45ODItOC4xODEtNy42NTMtMTEuNC03LjY1M2MtMy4yMTksMC04Ljc5Nyw5LjYzNS0xMS40MDEsNy42NTNjLTIuNjA0LTEuOTg2LDMuODU1LTEwLjc4MiwyLjg2NS0xMy45OWMtMC45OTgtMy4yMTEtMTAuOTA4LTUuNTI2LTkuOTEtOC43MzVjMC45OTUtMy4yMDgsMTAuODI5LDAuNzI3LDEzLjQzMy0xLjI1NVMxMzcuNTIxLDEuMTI5LDE0MC43NCwxLjEyOXoiLz48cGF0aCBmaWxsPSIjQ0VDRUNFIiBkPSJNMTgxLjQ4LDEuMTI5YzMuMjE5LDAsMi40MDksMTAuODA3LDUuMDEyLDEyLjc4OWMyLjYwOCwxLjk4MiwxMi40NDItMS45NTMsMTMuNDM4LDEuMjU1YzAuOTk0LDMuMjA4LTguOTE2LDUuNTIzLTkuOTEsOC43MzVjLTAuOTk1LDMuMjA4LDUuNDY5LDEyLjAwNCwyLjg2LDEzLjk5Yy0yLjYwNCwxLjk4Mi04LjE4MS03LjY1My0xMS40LTcuNjUzYy0zLjIyLDAtOC43OTcsOS42MzUtMTEuNDAxLDcuNjUzYy0yLjYwNC0xLjk4NiwzLjg1NS0xMC43ODIsMi44NjUtMTMuOTljLTAuOTk5LTMuMjExLTEwLjkwOS01LjUyNi05LjkxLTguNzM1YzAuOTk0LTMuMjA4LDEwLjgyOSwwLjcyNywxMy40MzMtMS4yNTVDMTc5LjA3MSwxMS45MzcsMTc4LjI2MSwxLjEyOSwxODEuNDgsMS4xMjl6Ii8+PC9nPjwvc3ZnPg==); background-size: cover; background-repeat: no-repeat; text-indent: -9999em; } #pretty-product-review-list .pretty-rating-code .options li .option.hover, #pretty-product-review-list .pretty-rating-code .options li .option.selected { background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCIgd2lkdGg9IjIwMHB4IiBoZWlnaHQ9IjM4LjE2N3B4IiB2aWV3Qm94PSIwIDAgMjAwIDM4LjE2NyIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjAwIDM4LjE2NyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PGc+PHBhdGggZmlsbD0iIzI3Q0NDMCIgZD0iTTE4LjUyLDEuMTI5YzMuMjE5LDAsMi40MDksMTAuODA3LDUuMDEzLDEyLjc4OWMyLjYwNiwxLjk4MiwxMi40NC0xLjk1MywxMy40MzUsMS4yNTVjMC45OTUsMy4yMDgtOC45MTUsNS41MjMtOS45MSw4LjczNWMtMC45OTYsMy4yMDgsNS40NjksMTIuMDA0LDIuODYzLDEzLjk5Yy0yLjYwNiwxLjk4Mi04LjE4MS03LjY1My0xMS40LTcuNjUzYy0zLjIyMSwwLTguNzk4LDkuNjM1LTExLjQwMiw3LjY1M2MtMi42MDYtMS45ODYsMy44NTctMTAuNzgyLDIuODYzLTEzLjk5Yy0wLjk5NS0zLjIxMS0xMC45MDUtNS41MjYtOS45MS04LjczNWMwLjk5Ny0zLjIwOCwxMC44MjksMC43MjcsMTMuNDM1LTEuMjU1QzE2LjEwOSwxMS45MzcsMTUuMjk5LDEuMTI5LDE4LjUyLDEuMTI5eiIvPjxwYXRoIGZpbGw9IiMyN0NDQzAiIGQ9Ik01OS4yNiwxLjEyOWMzLjIxOSwwLDIuNDA5LDEwLjgwNyw1LjAxMywxMi43ODljMi42MDYsMS45ODIsMTIuNDQtMS45NTMsMTMuNDM1LDEuMjU1YzAuOTk1LDMuMjA4LTguOTE2LDUuNTIzLTkuOTEsOC43MzVjLTAuOTk3LDMuMjA4LDUuNDY5LDEyLjAwNCwyLjg2MywxMy45OWMtMi42MDYsMS45ODItOC4xODItNy42NTMtMTEuNC03LjY1M2MtMy4yMjEsMC04Ljc5OCw5LjYzNS0xMS40MDIsNy42NTNjLTIuNjA2LTEuOTg2LDMuODU3LTEwLjc4MiwyLjg2My0xMy45OWMtMC45OTUtMy4yMTEtMTAuOTA1LTUuNTI2LTkuOTExLTguNzM1YzAuOTk3LTMuMjA4LDEwLjgyOSwwLjcyNywxMy40MzUtMS4yNTVDNTYuODUsMTEuOTM3LDU2LjAzOSwxLjEyOSw1OS4yNiwxLjEyOXoiLz48cGF0aCBmaWxsPSIjMjdDQ0MwIiBkPSJNMTAwLDEuMTI5YzMuMjE5LDAsMi40MDksMTAuODA3LDUuMDExLDEyLjc4OWMyLjYwOCwxLjk4MiwxMi40NDItMS45NTMsMTMuNDM3LDEuMjU1YzAuOTk1LDMuMjA4LTguOTE2LDUuNTIzLTkuOTEsOC43MzVjLTAuOTk1LDMuMjA4LDUuNDY5LDEyLjAwNCwyLjg2MSwxMy45OWMtMi42MDQsMS45ODItOC4xOC03LjY1My0xMS4zOTktNy42NTNjLTMuMjIxLDAtOC43OTgsOS42MzUtMTEuNDAyLDcuNjUzYy0yLjYwNS0xLjk4NiwzLjg1OC0xMC43ODIsMi44NjMtMTMuOTljLTAuOTk1LTMuMjExLTEwLjkwNS01LjUyNi05LjkxMS04LjczNWMwLjk5Ny0zLjIwOCwxMC44MjksMC43MjcsMTMuNDM1LTEuMjU1Qzk3LjU5LDExLjkzNyw5Ni43OCwxLjEyOSwxMDAsMS4xMjl6Ii8+PHBhdGggZmlsbD0iIzI3Q0NDMCIgZD0iTTE0MC43NCwxLjEyOWMzLjIxOSwwLDIuNDA5LDEwLjgwNyw1LjAxMywxMi43ODljMi42MDgsMS45ODIsMTIuNDQyLTEuOTUzLDEzLjQzNywxLjI1NWMwLjk5NCwzLjIwOC04LjkxNiw1LjUyMy05LjkxLDguNzM1Yy0wLjk5NSwzLjIwOCw1LjQ2OSwxMi4wMDQsMi44NiwxMy45OWMtMi42MDQsMS45ODItOC4xODEtNy42NTMtMTEuNC03LjY1M2MtMy4yMTksMC04Ljc5Nyw5LjYzNS0xMS40MDEsNy42NTNjLTIuNjA0LTEuOTg2LDMuODU1LTEwLjc4MiwyLjg2NS0xMy45OWMtMC45OTgtMy4yMTEtMTAuOTA4LTUuNTI2LTkuOTEtOC43MzVjMC45OTUtMy4yMDgsMTAuODI5LDAuNzI3LDEzLjQzMy0xLjI1NVMxMzcuNTIxLDEuMTI5LDE0MC43NCwxLjEyOXoiLz48cGF0aCBmaWxsPSIjMjdDQ0MwIiBkPSJNMTgxLjQ4LDEuMTI5YzMuMjE5LDAsMi40MDksMTAuODA3LDUuMDEyLDEyLjc4OWMyLjYwOCwxLjk4MiwxMi40NDItMS45NTMsMTMuNDM4LDEuMjU1YzAuOTk0LDMuMjA4LTguOTE2LDUuNTIzLTkuOTEsOC43MzVjLTAuOTk1LDMuMjA4LDUuNDY5LDEyLjAwNCwyLjg2LDEzLjk5Yy0yLjYwNCwxLjk4Mi04LjE4MS03LjY1My0xMS40LTcuNjUzYy0zLjIyLDAtOC43OTcsOS42MzUtMTEuNDAxLDcuNjUzYy0yLjYwNC0xLjk4NiwzLjg1NS0xMC43ODIsMi44NjUtMTMuOTljLTAuOTk5LTMuMjExLTEwLjkwOS01LjUyNi05LjkxLTguNzM1YzAuOTk0LTMuMjA4LDEwLjgyOSwwLjcyNywxMy40MzMtMS4yNTVDMTc5LjA3MSwxMS45MzcsMTc4LjI2MSwxLjEyOSwxODEuNDgsMS4xMjl6Ii8+PC9nPjwvc3ZnPg==); background-size: cover; background-repeat: no-repeat; } /* Medium and Small screens */ @media only screen and (max-width: 64em) { .review-list-actions { text-align: left; margin-top: 0; } .review-list-header .product-review-image { width: 40px; height: 40px; margin: 0 10px 10px 0; } .review-product-list .ratings-detail { margin-top: 22px; } .review-product-list .reviews { padding: 13px 18px; } } /*******************************************************************************************************/ /*** 14) SEARCH - AUTO SUGGEST ***/ /*******************************************************************************************************/ .search-autocomplete { left: 0 !important; overflow: visible !important; position: relative !important; top: 0 !important; width: 100% !important; z-index: 200; } .search-autocomplete ul { list-style: none; background-color: #ffffff; border: 1px solid #cccccc; left: 0; padding-left: 0; margin: 0; position: absolute; top: 0; width: 100%; -webkit-box-shadow: 0 5px 6px 0 rgba(50, 50, 50, 0.1); -moz-box-shadow: 0 5px 6px 0 rgba(50, 50, 50, 0.1); box-shadow: 0 5px 6px 0 rgba(50, 50, 50, 0.1); } .search-autocomplete ul li { color: #000000; cursor: pointer; font-size: 12px; padding: 4px 6px; text-align: left; } .search-autocomplete ul li.selected { background-color: #eeeeee; } .search-autocomplete ul li .amount { float: right; color: #777777; } .search-autocomplete ul li:last-child { border-bottom: none; } /*******************************************************************************************************/ /*** 15) AJAX LOADING BAR ***/ /*******************************************************************************************************/ .loading-bar { position: fixed; display: none; top: 0; left: 0; right: 0; height: 2px; z-index: 10000; background: #27ccc0; -webkit-transform: translateX(100%); -moz-transform: translateX(100%); -o-transform: translateX(100%); transform: translateX(100%); } .app-loading .loading-bar { display: block !important; -webkit-animation: shift-rightwards 1s ease-in-out infinite; -moz-animation: shift-rightwards 1s ease-in-out infinite; -ms-animation: shift-rightwards 1s ease-in-out infinite; -o-animation: shift-rightwards 1s ease-in-out infinite; animation: shift-rightwards 1s ease-in-out infinite; -webkit-animation-delay: .4s; -moz-animation-delay: .4s; -o-animation-delay: .4s; animation-delay: .4s; } @keyframes shift-rightwards { 0% { -webkit-transform:translateX(-100%); -moz-transform:translateX(-100%); -o-transform:translateX(-100%); transform:translateX(-100%); } 40% { -webkit-transform:translateX(0%); -moz-transform:translateX(0%); -o-transform:translateX(0%); transform:translateX(0%); } 60% { -webkit-transform:translateX(0%); -moz-transform:translateX(0%); -o-transform:translateX(0%); transform:translateX(0%); } 100% { -webkit-transform:translateX(100%); -moz-transform:translateX(100%); -o-transform:translateX(100%); transform:translateX(100%); } } /*******************************************************************************************************/ /*** 16) LOGIN, REGISTER, FORGOT PASSWORD, CMS & 404 PAGES ***/ /*******************************************************************************************************/ .customer-account-login .inner-wrap, .customer-account-forgotpassword .inner-wrap, .customer-account-create .inner-wrap, .customer-account-logoutsuccess .inner-wrap, .checkout-multishipping-login .inner-wrap, .customer-account-resetpassword .inner-wrap, .paypal-express-review .inner-wrap, .cms-no-route .inner-wrap { height: 100%; } .customer-account-login .off-canvas-wrap, .customer-account-forgotpassword .off-canvas-wrap, .customer-account-create .off-canvas-wrap, .customer-account-logoutsuccess .off-canvas-wrap, .checkout-multishipping-login .off-canvas-wrap, .customer-account-resetpassword .off-canvas-wrap, .paypal-express-review .off-canvas-wrap, .cms-no-route .off-canvas-wrap, .customer-account-login, .customer-account-forgotpassword, .customer-account-create, .customer-account-logoutsuccess, .checkout-multishipping-login, .customer-account-resetpassword, .cms-no-route { min-height: 100%; } .customer-account-login .account-login, .checkout-multishipping-login .account-login, .customer-account-forgotpassword .account-forgotpassword, .customer-account-resetpassword .account-forgotpassword, .customer-account-create .account-create, .customer-account-logoutsuccess .account-logout, .cms-no-route .no-route { min-height: 100%; } .customer-account-login .off-canvas-wrap, .customer-account-forgotpassword .off-canvas-wrap, .customer-account-create .off-canvas-wrap, .customer-account-logoutsuccess .off-canvas-wrap, .customer-account-resetpassword .off-canvas-wrap, .paypal-express-review .off-canvas-wrap { background-color: #ccd6d5; background: -moz-linear-gradient(-45deg, #b4bdbf 0%, #d7dddc 33%, #ccd6d5 67%, #b7c9c7 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#b4bdbf), color-stop(33%,#d7dddc), color-stop(67%,#ccd6d5), color-stop(100%,#b7c9c7)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(-45deg, #b4bdbf 0%,#d7dddc 33%,#ccd6d5 67%,#b7c9c7 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(-45deg, #b4bdbf 0%,#d7dddc 33%,#ccd6d5 67%,#b7c9c7 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(-45deg, #b4bdbf 0%,#d7dddc 33%,#ccd6d5 67%,#b7c9c7 100%); /* IE10+ */ background: linear-gradient(135deg, #b4bdbf 0%,#d7dddc 33%,#ccd6d5 67%,#b7c9c7 100%); /* W3C */ } .customer-account-login .account-login, .customer-account-forgotpassword .account-forgotpassword, .customer-account-resetpassword .account-forgotpassword, .customer-account-create .account-create, .customer-account-logoutsuccess .account-logout, .checkout-multishipping-login .account-login, .paypal-express-review .paypal-review-page { padding: 25px 0; } .customer-account-login h1, .customer-account-forgotpassword h1, .customer-account-create h1, .customer-account-logoutsuccess h1, .checkout-multishipping-login h1, .customer-account-resetpassword h1, .paypal-express-review h1 { color: #ffffff; } .cms-no-route h1, .no-results h1 { color: #27ccc0; } .customer-account-login p, .customer-account-forgotpassword p, .customer-account-create p, .customer-account-logoutsuccess p, .checkout-multishipping-login p, .cms-no-route p, .checkout-multishipping .page-title p, .no-results p, .catalogsearch-advanced-result .no-results span, .catalog-list-empty p, .customer-account-resetpassword p { font-size: 1.125rem; color: #777777; } .account-forgotpassword .form-list li { margin-bottom: 30px; } .customer-account-logoutsuccess p { margin-top: 30px; } .cms-no-route .form-box { max-width: 540px; } .mdformfields .form-box label[for="email"], .mdformfields .form-box label[for="login-email"], .mdformfields .form-box label[for="email_address"], .mdformfields .form-box label[for="pass"], .mdformfields .form-box label[for="login-password"], .mdformfields .form-box label[for="password"], .mdformfields .form-box label[for="confirmation"], .mdformfields .form-box label[for="billing:customer_password"], .mdformfields .form-box label[for="billing:confirm_password"] { top: 9px; } .mdformfields .form-box label[for="email"]:before, .mdformfields .form-box label[for="login-email"]:before, .mdformfields .form-box label[for="email_address"]:before, .mdformfields .form-box label[for="pass"]:before, .mdformfields .form-box label[for="login-password"]:before, .mdformfields .form-box label[for="password"]:before, .mdformfields .form-box label[for="confirmation"]:before, .mdformfields .form-box label[for="billing:customer_password"]:before, .mdformfields .form-box label[for="billing:confirm_password"]:before { content: "\e607"; font-family: "intenso"; font-style: normal; font-size: 1.063rem; color: #999999; padding: 0 5px 0 0; } .mdformfields .form-box label[for=pass]:before, .mdformfields .form-box label[for=password]:before, .mdformfields .form-box label[for="login-password"]:before, .mdformfields .form-box label[for=confirmation]:before, .mdformfields .form-box label[for="billing:customer_password"]:before, .mdformfields .form-box label[for="billing:confirm_password"]:before { content: "\e6fb"; font-size: 1.125rem; padding: 0 3px 0 0; } .mdformfields .form-box label[for=pass], .mdformfields .form-box label[for=password], .mdformfields .form-box label[for="login-password"], .mdformfields .form-box label[for=confirmation], .mdformfields .form-box label[for="billing:customer_password"], .mdformfields .form-box label[for="billing:confirm_password"] { left: 8px; } .new-users h1 { margin-top: 20px; } .new-users .button { display: block; margin: 0 auto 20px; } .new-users p { margin-bottom: 12px; } .link-tip { display: inline-block; margin: 0.063rem 0 0 0.25rem; font-size: 0.750rem; vertical-align: top; } .input-box.customer-dob { position: relative; height: auto; border: none; } .dob-month { display: inline-block; width: 48%; } .checkout-onepage-index .dob-month { width: 90px; } #billing_month_chosen { width: 80px !important; } .dob-day { display: inline-block; width: 26%; } .dob-year { display: inline-block; width: 26%; } #month_chosen { width: 109px !important; } #day_chosen { width: 60px !important; } #year_chosen { width: 70px !important; } .customer-dob .validation-advice { top: 2rem; } #advice-validate-custom-year, #advice-validate-custom-month, #advice-validate-custom-day { display: none; } /* no-route */ .cms-no-route .no-route, .catalogsearch-result-index .no-route { padding-top: 40px; padding-bottom: 40px; } .cms-no-route .form-search .action, .catalogsearch-result-index .no-results .form-search .action { width: 40px; } .cms-no-route .form-search .search-box, .catalogsearch-result-index .no-results .form-search .search-box { margin-right: 40px; } .cms-no-route .form-box { text-align: center; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .cms-no-route .form-box h3, .no-results h3 { font-size: 1rem; font-weight: bold; color: #000000; margin: 40px 0 12px; } .cms-no-route p, .no-results p { margin-top: 15px; margin-bottom: 30px; } .top-destinations { list-style: none; margin: 0; text-align: center; } .top-destinations li { font-size: 0.938rem; line-height: 1.5rem; } .cms-no-route .form-box .button.home, .no-results .button.home { margin: 20px 0 10px 0; } .customer-name-prefix-middlename-suffix, .field.name-prefix.select-list { width: 100% !important; clear: both; } .page-title { position: relative; margin: 20px 3.5% 40px; } .row > .columns > .page-title { margin-left: 0; margin-right: 0; } .page-title h1 { font-size: 2.5rem; color: #000000; font-weight: lighter; } .cms-page-view h2 { font-size: 1.75rem; color: #000000; font-weight: lighter; margin-top: 30px; } .cms-wrapper .column, .cms-wrapper .columns, .cms-wrapper p, .cms-wrapper ul li { font-size: 1rem; line-height: 1.75rem; color: #5b6064; font-weight: lighter; } .row.contrast { background: #f4f4f4; } .row.contrast div h2 { margin-top: 60px; } .sitemap { list-style: none; margin-left: 0; } .sitemap .level-0 { font-weight: bold; } .page-sitemap .links-list a { padding-left: 0 !important; } .page-sitemap .links-list a:hover, .page-sitemap .links-list a:hover:before { background: transparent !important; } .contact-page-static-block, .rss-page-static-block { margin-top: 32px; margin-bottom: 32px; } .feed-link a { white-space: nowrap; } .feed-link a span { padding-right: 0.375rem; } .rss-table .feed-link { text-align: right; } /* Compare */ .block-compare { position: fixed; bottom: 0; right: 1.5%; text-align: center; width: 100%; max-width: 300px; -webkit-box-shadow: 0 1px 4px rgba(50, 50, 50, 0.3); -moz-box-shadow: 0 1px 4px rgba(50, 50, 50, 0.3); box-shadow: 0 1px 4px rgba(50, 50, 50, 0.3); z-index: 900; } .block-compare .block-title { background: #27ccc0; color: #ffffff; font-size: 0.875rem; line-height: 0.875rem; padding: 9px 15px; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; cursor: pointer; } .block-compare .block-title small { font-size: 0.875rem !important; } .block-compare .block-content { max-height: 0; background: #ffffff; text-align: left; padding: 0; overflow: hidden; -webkit-transition: max-height 1s; -moz-transition: max-height 1s; transition: max-height 1s; } .block-compare:hover .block-content { max-height: 600px; } .block-compare:hover .block-title { background: #afafaf; } .block-compare #compare-items { margin: 0; list-style: none; padding: 15px 18px; } .block-compare #compare-items li { position: relative; padding: 0 20px 0 0; } .block-compare .icon-close { position: absolute; top: 0.563rem; right: 0; font-size: 0.688rem; font-weight: normal; line-height: 0.688rem; color: #afafaf; } .block-compare .icon-close:hover { color: #ea1818; } .block-compare .product-name { display: inline-block; line-height: 1rem; color: #777777; font-weight: normal; margin: 0; } .block-compare .product-name a { color: #333333; font-size: 0.875rem; } .block-compare .product-name a:hover, .block-compare .actions a:hover, .catalog-product-compare-index .link-wishlist:hover { color: #27ccc0; } .block-compare .actions { text-align: center; padding: 0 18px 15px; } .block-compare .actions .button { display: block; margin: 0 auto 10px auto; } .block-compare .actions a { color: #999999; display: inline-block; } /* Compare popup */ .catalog-product-compare-index { background: #ffffff; } .catalog-product-compare-index .page-title { background: #f4f4f4; margin: 0 0 20px; padding: 20px 3.5%; } .catalog-product-compare-index .link-print { margin: 44px 3% 0; } .catalog-product-compare-index .add-to-links li { position: relative; } .catalog-product-compare-index .button.btn-cart { margin-bottom: 5px; } .product-shop-row td p, .catalog-product-compare-index .add-to-row td p { margin-bottom: 0; } .catalog-product-compare-index .add-to-links { list-style: none; margin: 4px 0 0; } .product-shop-row .product-name { margin: 5px 0 0; } .product-shop-row .product-info { min-height: 4.750rem; margin: 0 0 10px; padding: 0; } .catalog-product-compare-index .price { font-weight: bold; color: #000000; } .catalog-product-compare-index .add-to-row .price-box { margin: 0 0 10px 0; } .catalog-product-compare-index .link-wishlist { padding: 0 0 0 24px; color: #555555; font-size: 0.813rem; font-weight: bold; } .catalog-product-compare-index .link-wishlist:hover:before { color: #bebebe; } .catalog-product-compare-index .link-wishlist:before { top: -1px; padding: 0; left: 0; } .catalog-product-compare-index .compare-table td { vertical-align: top; } .catalog-product-compare-index .compare-table th span { font-weight: bold; } .catalog-product-compare-index .please-wait { padding: 0 0 10px; } .catalog-product-compare-index .buttons-set { background: #f4f4f4; text-align: center; padding: 24px 0 0; } .col2-right-layout .page-title, .col2-left-layout .page-title { margin-left: 0; } .col-right.sidebar, .col-left.sidebar { margin-top: 32px; margin-bottom: 30px; } .block-poll ul { list-style: none; margin-left: 0; } /* JavaScript disabled notice */ .global-site-notice.noscript { padding: 4px; text-align: center; background: #F64747; } .global-site-notice.noscript p { color: #ffffff; margin-bottom: 0; font-size: 0.875rem; line-height: 1.188rem; font-weight: normal; } /* Cookie restriction mode */ .global-site-notice.notice-cookie { position: fixed; left: 0; bottom: 0; background: #fcefbb; padding: 4px 4px 5px; z-index: 1001; } .global-site-notice.notice-cookie p { margin-bottom: 0; font-weight: normal; font-size: 0.813rem; line-height: 1.188rem; color: #000000; } .global-site-notice.notice-cookie .notice-inner { position: relative; margin: 0 3.3%; padding-right: 12%; } .global-site-notice.notice-cookie .actions { position: absolute; right: 0; top: 2px; } /* Small screens */ @media only screen and (max-width: 40em) { .customer-account-login p { font-size: 0.875rem; } .cms-page-view h1 { font-size: 2.125rem; } .cms-page-view h2 { font-size: 1.25rem; } } /*******************************************************************************************************/ /*** 17) SHOPPING CART ***/ /*******************************************************************************************************/ .cart { margin-top: 36px; } .cart h1 { font-size: 1.5rem; font-weight: 400; line-height: 1; } .shopping-cart-block-1 { width: 100%; margin: 0 0 25px; } .btn-continue-shopping .btn-empty { background: transparent; color: #555555; font-weight: normal !important; font-size: 0.875rem; } .btn-continue-shopping .btn-empty:hover { color: #000000; } .cart #shopping-cart-totals-table { border: none; background: transparent; text-align: left; border-collapse: collapse; width: 100%; } .cart #shopping-cart-totals-table tr td { font-size: 0.938rem; font-weight: bold; line-height: 0.875rem; padding: 0.250rem 0.375rem; } .cart #shopping-cart-totals-table tr td:nth-child(2) { text-align: right; } .cart #shopping-cart-totals-table tfoot { border-top: 2px solid #555555; } .cart #shopping-cart-totals-table tfoot tr td { font-size: 1.125rem; padding-top: 0.375rem; } .cart #shopping-cart-totals-table tfoot tr td:nth-child(2) { color: #27ccc0; } .cart #shopping-cart-totals-table tr.even, .cart #shopping-cart-totals-table tr.alt, .cart #shopping-cart-totals-table tr:nth-of-type(2n) { background: transparent !important; } .checkout-types { list-style: none; margin: 0; } .cart .btn-proceed-checkout { margin-bottom: 12px; } .cart .paypal-or { display: none; } .cart .multishipping-link { font-size: 0.813rem; display: inline-block; margin: 10px 0 0; } .cart-collaterals { margin-bottom: 60px; } .cart-collaterals .buybox { width: 100%; } .cart-collaterals .shipping h2, .cart-collaterals .discount h2 { position: relative; font-size: 0.875rem; font-weight: lighter; color: #333333; margin: 0; padding: 10px 16px; border-bottom: 1px solid #dddddd; cursor: pointer; } .cart-collaterals .shipping h2:hover, .cart-collaterals .discount h2:hover { color: #333333; } .cart-collaterals .shipping h2:before, .cart-collaterals .discount h2:before, .cart-collaterals .shipping h2:after, .cart-collaterals .discount h2:after { border-right: 1px solid #a0a0a0; content: "http://revcharlesmills.org/index.php?"; display: block; height: 7px; margin-top: -1px; position: absolute; -ms-transform: rotate(40deg); -moz-transform: rotate(40deg); -o-transform: rotate(40deg); -webkit-transform: rotate(40deg); transform: rotate(40deg); right: 16px; top: 50%; width: 0; } .cart-collaterals .shipping h2:after, .cart-collaterals .discount h2:after { margin-top: -1px; -ms-transform: rotate(140deg); -moz-transform: rotate(140deg); -o-transform: rotate(140deg); -webkit-transform: rotate(140deg); transform: rotate(140deg); right: 21px; } .cart-collaterals .shipping h2:hover:before, .cart-collaterals .discount h2:hover:before, .cart-collaterals .shipping h2:hover:after, .cart-collaterals .discount h2:hover:after { border-right: 1px solid #27ccc0; } .cart-collaterals .shipping .shipping-form, .cart-collaterals .discount .discount-form { padding: 10px 14px 4px; border-left: 1px solid #ddd; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; } .cart-collaterals .shipping .shipping-form ul { list-style: none; margin-left: 0; } .cart-collaterals .shipping .shipping-form p { display: none; } .cart-collaterals .shipping .shipping-form .form-list { padding-top: 0; margin: 0; } .cart-collaterals .shipping .shipping-form .form-list li:last-child { margin-bottom: 20px; } .cart-collaterals .shipping .shipping-form .button { margin-bottom: 0; } .cart-collaterals .discount .discount-form .form-list { margin: 0; padding-top: 0; } .cart-collaterals .discount .discount-form .form-list li:last-child { margin-bottom: 15px; } .cart-collaterals .shipping .shipping-form dt { font-weight: normal; font-size: 0.875rem; } /* cart table */ .cart .data-table.cart-table { border: none !important; border-collapse: collapse; margin: -24px 0 40px; width: 100%; } .cart .data-table.cart-table thead, .cart .data-table.cart-table thead tr, .cart .data-table.cart-table tfoot, .cart .cart-collaterals table tfoot { background: transparent !important; } .cart .data-table.cart-table tbody tr, .cart .data-table.cart-table tfoot tr { border-top: 2px solid #e5e5e5; } .cart .data-table.cart-table tbody tr td { vertical-align: top; } .cart .data-table.cart-table .btn-edit, .cart .data-table.cart-table .btn-remove { font-size: 0.813rem; font-weight: lighter; line-height: 0.813rem; display: inline-block; } .cart .data-table.cart-table tbody .btn-remove { padding-left: 8px; margin-left: 5px; border-left: 1px solid #d1d1d1; } .cart .data-table.cart-table h2, .cart .data-table.cart-table h2 a { font-size: 1.125rem; line-height: 1.5rem; font-weight: bold; margin: 0; } .cart .data-table.cart-table thead tr th { line-height: 1rem; padding: 0.250rem 0.625rem 0.5rem; font-size: 0.938rem; font-weight: lighter; color: #777777; } .cart .item-options { margin: 0 0 6px 0; } .cart .item-options dt, .cart .item-options dd { font-size: 0.875rem; line-height: 1.125rem !important; float: left; margin: 0 !important; } .cart .item-options dt { clear: both; padding: 0 6px 0 0; } .cart .item-options dt:after { content: ": "; } .cart .item-options dd { color: #777777; } .cart .item-options dd .price { font-size: 0.875rem !important; line-height: 1.125rem !important; } .cart .data-table.cart-table .price { color: #27ccc0; font-size: 1.125rem; line-height: 1.5rem; display: inline-block; min-width: 96px; } .cart .data-table.cart-table .chosen-container { width: 60px !important; margin-right: 30px; } .input-text.qty { border: 1px solid #c0c0c0; width: 60px; height: 2.375rem; margin-top: 2px; padding: 0; margin-bottom: 0; text-align: center; } .cart .qty-wrapper .input-text:focus { border: 1px solid #27ccc0; } .cart .qty-wrapper { width: 90px; } .cart .qty-wrapper .button { margin-top: 6px; padding: 0.063rem 6px 0.125rem } .cart .link-continue { font-size: 0.875rem; font-weight: normal; } #co-shipping-method-form dt { margin-bottom: 0; } #co-shipping-method-form dd ul { margin-bottom: 0.25rem; } .cart .product-image.for-small { display: none; } .cart .cart-empty { margin-bottom: 100px; } .cart .cart-msrp-totals { margin: 10px 0 20px; } /* Only small screens */ @media only screen and (max-width: 40em) { .cart h1 { font-size: 1rem !important; font-weight: bold; } .cart .data-table.cart-table h2, .cart .data-table.cart-table h2 a, .cart .data-table.cart-table .price { font-size: 0.938rem; line-height: 1rem; } .cart .product-image > img { width: 48px; } .cart .data-table.cart-table .price { min-width: 40px; } .cart .qty-wrapper { width: auto; } .cart-table colgroup col:first-child, .cart-table thead tr > th:first-child, .cart-table tbody tr > td:first-child { display: none; } .cart .data-table.cart-table h2 { margin-bottom: 0.5rem; } .cart .product-image.for-small { display: block; margin: 0 0 5px 0; } .cart .cart-empty { margin-bottom: 40px; } } /* Only Medium screens */ @media only screen and (min-width: 40.063em) and (max-width: 64em) { .cart h1 { font-size: 1.250rem !important; } .cart .data-table.cart-table h2, .cart .data-table.cart-table h2 a, .cart .data-table.cart-table .price { font-size: 0.938rem; } } @media only screen and (max-width: 48em) { .cart-items, .cart-collaterals { width: 100% !important; } .cart .btn-proceed-checkout { padding: 5px 22px; } .cart-collaterals .shipping h2, .cart-collaterals .discount h2 { padding-left: 0; } } /*******************************************************************************************************/ /*** 18) CHECKOUT ***/ /*******************************************************************************************************/ .checkout-onepage-index, .checkout-multishipping-register, .checkout-multishipping-addresses, .checkout-multishipping-address-newshipping, .checkout-multishipping-shipping, .checkout-multishipping-address-editshipping, .checkout-multishipping-billing, .checkout-multishipping-overview, .checkout-onepage-failure, .checkout-multishipping-success, .checkout-onepage-success { min-height: 100%; } .checkout-onepage-index .row.flush, .checkout-multishipping-register .row.flush, .checkout-multishipping-addresses .row.flush, .checkout-multishipping-address-newshipping .row.flush, .checkout-multishipping-shipping .row.flush, .checkout-multishipping-address-editshipping .row.flush, .checkout-multishipping-billing .row.flush, .checkout-multishipping-overview .row.flush, .checkout-onepage-failure .row.flush, .checkout-multishipping-success .row.flush, .checkout-onepage-success .row.flush { padding: 0; height: 100%; } .checkout-onepage-index .off-canvas-wrap, .checkout-multishipping-login .off-canvas-wrap, .checkout-multishipping-register .off-canvas-wrap, .checkout-multishipping-addresses .off-canvas-wrap, .checkout-multishipping-address-newshipping .off-canvas-wrap, .checkout-multishipping-shipping .off-canvas-wrap, .checkout-multishipping-address-editshipping .off-canvas-wrap, .checkout-multishipping-billing .off-canvas-wrap, .checkout-multishipping-overview .off-canvas-wrap, .checkout-onepage-failure .off-canvas-wrap, .checkout-multishipping-success .off-canvas-wrap, .checkout-onepage-success .off-canvas-wrap { min-height: 100%; background-color: #ccd6d5; background: -moz-linear-gradient(-45deg, #b4bdbf 0%, #d7dddc 33%, #ccd6d5 67%, #b7c9c7 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#b4bdbf), color-stop(33%,#d7dddc), color-stop(67%,#ccd6d5), color-stop(100%,#b7c9c7)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(-45deg, #b4bdbf 0%,#d7dddc 33%,#ccd6d5 67%,#b7c9c7 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(-45deg, #b4bdbf 0%,#d7dddc 33%,#ccd6d5 67%,#b7c9c7 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(-45deg, #b4bdbf 0%,#d7dddc 33%,#ccd6d5 67%,#b7c9c7 100%); /* IE10+ */ background: linear-gradient(135deg, #b4bdbf 0%,#d7dddc 33%,#ccd6d5 67%,#b7c9c7 100%); /* W3C */ } .checkout-onepage-index .inner-wrap, .checkout-multishipping-register .inner-wrap, .checkout-multishipping-addresses .inner-wrap .checkout-multishipping-address-newshipping .inner-wrap, .checkout-multishipping-shipping .inner-wrap, .checkout-multishipping-address-editshipping .inner-wrap, .checkout-multishipping-billing .inner-wrap, .checkout-multishipping-overview .inner-wrap, .checkout-onepage-failure .inner-wrap, .checkout-multishipping-success .inner-wrap, .checkout-onepage-success .inner-wrap { height: 100%; } .checkout-onepage-index .page-title { display: none; } .main-header .extra { display: inline-block; float: right; } .opc, .checkout-multishipping-register .account-create, .checkout-multishipping, .checkout-onestep { list-style: none; margin: 0; padding: 25px 3%; min-height: 100%; } .checkout-multishipping { padding-bottom: 100px; } .opc h1, .checkout-multishipping-register h1 { color: #ffffff; } .opc p.center, .checkout-multishipping-register p.center { color: #777777; font-size: 1.125rem; } .opc .new-users .form-list { display: none; } .opc .new-users .buttons-set { max-width: 420px; margin: 15px auto; text-align: center; } .opc .new-users .buttons-set .button { display: inline-block; margin: 0 15px; } .opc .new-users .buttons-set .button-or { display: inline-block; color: #777777; font-size: 0.813rem; } .opc .new-users .buttons-set .secondary { background: #a7afae; color: #ffffff; } .opc .new-users .buttons-set .secondary:hover { background: #9ca09f; } .opc .step-title { display: none; } .opc dd ul { margin-left: 0; list-style: none; } .opc-block-progress { margin: 45px 0 0; } .opc-block-progress .block-title, .opc-block-progress .block-content dd { display: none; } .opc-block-progress .block-content { text-align: right; } .opc-block-progress .block-content dl { margin: 0; } .opc-block-progress .block-content dl div { position: relative; display: inline-block; margin: 0 15px; } .opc-block-progress .block-content dt, .checkout-progress li span { font-size: 0.813rem; font-weight: lighter; color: #777777; } .opc-block-progress .block-content dt:before, .checkout-progress li span:before { content: "http://revcharlesmills.org/index.php?"; position: absolute; display: block; width: 6px; height: 6px; -webkit-border-radius: 1000px; -moz-border-radius: 1000px; border-radius: 1000px; background: #e5e5e5; top: -13px; left: 45%; } .opc-block-progress .block-content dt.complete:before, .checkout-progress li.active span:before { background: #27ccc0; } .checkout-progress li.active span { color: #27ccc0; } .opc-block-progress .block-content dt:after, .checkout-progress li span:after { content: "http://revcharlesmills.org/index.php?"; position: absolute; display: block; width: 100%; height: 2px; margin-left: 6px; background: #f4f4f4; top: -11px; left: 45%; } .opc-block-progress .icon-edit { position: absolute; left: 42%; line-height: 16px; top: -34px; font-size: 16px; } #shipping-progress-opcheckout:before, #shipping_method-progress-opcheckout:before, #payment-progress-opcheckout:before, .checkout-progress li:before { content: "http://revcharlesmills.org/index.php?"; position: absolute; display: block; width: 100%; height: 2px; background: #f4f4f4; top: -11px; right: 50%; margin-right: 4px; } .checkout-progress li:first-child:before { content: none; } #checkout-progress-wrapper { display: inline-block; } #payment-progress-opcheckout dt:after, .checkout-progress li.last span:after { content: none; } .opc .section.allow.active .step-title { display: block; text-align: center; } .opc .section.allow.active .step-title span, .opc .section.allow.active .step-title a, #opc-login .step-title { display: none; } .opc .section.allow.active .step-title h2, .checkout-multishipping h2, .checkout-multishipping-address-newshipping h2, .checkout-onestep h2 { color: #ffffff; line-height: 2rem; margin-bottom: 10px; } #billing-new-address-form { width: 100%; } #billing_region_id_chosen, #billing_country_id_chosen, #shipping_region_id_chosen, #shipping_country_id_chosen, #billing_gender_chosen, #gender_chosen { width: 250px !important; } #region_id_chosen, #country_chosen, #advanced-search-list .chosen-container, .checkout-onepage-index #billing_address_select_chosen, .checkout-onepage-index #shipping_address_select_chosen { width: 100% !important; } h2.legend { font-size: 0.875rem; font-weight: bold; color: #222222; margin-bottom: 5px; } .checkout-multishipping-shipping h2.legend, .checkout-multishipping-overview h2.legend { background: #f4f4f4; line-height: 1.75rem; margin-bottom: 8px; text-align: center; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; } .checkout-multishipping-shipping h3, .checkout-multishipping-billing h3, .checkout-multishipping-overview h3, .checkout-multishipping-overview h4 { font-size: 0.875rem; color: #222222; border-bottom: 1px dotted #e5e5e5; padding-bottom: 6px; margin-right: 30px; } .please-wait { display: block; margin-bottom: 10px; } .please-wait .spinner:after { margin: -10px 0 0; width: 20px; height: 20px; } .please-wait > span { padding: 0 0 0 18px; font-size: 0.688rem; color: #777777; } .form-alt { width: 100% !important; font-size: 0.813rem; margin-bottom: 8px; font-weight: bold; color: #a1ba16; } /* Tooltip */ .tool-tip { border: 2px solid #e5e5e5; background: #ffffff; padding: 45px 20px 20px; position: absolute; z-index: 9999; } .tool-tip .btn-close { margin: -9px -14px 0; text-align: right; } .tool-tip .btn-close a { border: 2px solid transparent; -webkit-border-radius: 500px; -moz-border-radius: 500px; border-radius: 500px; position: absolute; display: block; overflow: hidden; top: 6px; right: 6px; width: 26px; height: 26px; padding-left: 22px; cursor: pointer; } .tool-tip .btn-close a:hover { border: 2px solid #e5e5e5; } .tool-tip .btn-close a:before, .tool-tip .btn-close a:after { border-right: 2px solid; border-color: #e5e5e5; content: "http://revcharlesmills.org/index.php?"; display: block; height: 18px; position: absolute; -ms-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); right: 10px; top: 2px; width: 0; } .tool-tip .btn-close a:after { -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); } .tool-tip .btn-close a:hover:before, .tool-tip .btn-close a:hover:after { border-color: #e5e5e5; } .tool-tip .tool-tip-content { padding: 5px; } /* ----------------- */ .payment-methods dt { background: #f4f4f4; height: 40px; line-height: 40px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin-right: 30px; margin-bottom: 5px; } .payment-methods dd { margin-bottom: 0; } .payment-methods .input-box .v-fix { display: inline-block; width: 49%; } .payment-methods .v-fix .month, .payment-methods .v-fix .year { width: 100%; } .payment-methods .form-list { max-width: 300px; margin: 10px auto 10px auto !important; padding: 14px 14px 18px; background: #e5e5e5; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .mdformfields .payment-methods .form-list li { width: 100% !important; } #payment_form_banktransfer li { height: auto; margin-bottom: 0; } .payment-methods .form-list li { width: 100% !important; } .payment-methods .form-list.checkmo-list li { height: auto; padding: 30px 10px 8px; background: #ffffff; } .payment-methods .form-list li.select-list { background: transparent; height: 60px; } .payment-methods .form-list .input-box { border: none; height: inherit; margin: 0; } .payment-methods .form-list .input-text, .payment-methods .form-list select { -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; -moz-user-select: text; background: #ffffff; border-color: #b5b5b6 #cececf #dededf; border-style: solid; border-width: 1px; color: #777777; -webkit-box-shadow: 0 1px 1px rgba(124, 124, 127, 0.1) inset, 0 1px 0 rgba(255, 255, 255, 0.7), 0 0 4px rgba(86, 149, 219, 0); -moz-box-shadow: 0 1px 1px rgba(124, 124, 127, 0.1) inset, 0 1px 0 rgba(255, 255, 255, 0.7), 0 0 4px rgba(86, 149, 219, 0); box-shadow: 0 1px 1px rgba(124, 124, 127, 0.1) inset, 0 1px 0 rgba(255, 255, 255, 0.7), 0 0 4px rgba(86, 149, 219, 0); transition: border-color 0.15s linear 0s, box-shadow 0.15s linear 0s; font-family: "Helvetica Neue","Helvetica",Arial,sans-serif; font-size: 0.938rem; height: 2.313rem; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; top: 0; } .payment-methods .form-list .input-text:focus, .payment-methods .form-list select:focus { border-color: #7caadd; -webkit-box-shadow: 0 1px 1px rgba(76, 107, 153, 0.15) inset, 0 1px 0 rgba(255, 255, 255, 0), 0 0 6px #326cc0 !important; -moz-box-shadow: 0 1px 1px rgba(76, 107, 153, 0.15) inset, 0 1px 0 rgba(255, 255, 255, 0), 0 0 6px #326cc0 !important; box-shadow: 0 1px 1px rgba(76, 107, 153, 0.15) inset, 0 1px 0 rgba(255, 255, 255, 0), 0 0 6px #326cc0 !important; outline: 0 none; } .mdformfields .payment-methods .form-list label { top: 7px; } .payment-methods .form-list label { font-size: 0.938rem; font-family: "Helvetica Neue","Helvetica",Arial,sans-serif; } .payment-methods .form-list label em { display: none; } .payment-methods .form-list .select-list label, .payment-methods .form-list .select-list .input-box { top: -5px; } .payment-methods .form-list .select-list label { font-size: 90%; color: #a9a9a9; } .cvv-what-is-this { display: block; font-size: 0.750rem; margin: 18px 0 0 10px; } .mdformfields .payment-methods .validation-advice { top: 2.313rem; } #payment_form_paypal_express.form-list { background: transparent; padding: 0; } #payment_form_paypal_express.form-list li { background: transparent; height: auto; } #checkout-review-table-wrapper { margin-right: 30px; } #checkout-review-table-wrapper table { width: 100%; } #checkout-review-table-wrapper td, #checkout-review-table-wrapper th { font-size: 0.813rem; } #checkout-review-table-wrapper h3 { font-size: 1rem; font-weight: bold; } #checkout-review-table-wrapper .item-options { margin-bottom: 0; } #checkout-review-table-wrapper dt { background: transparent; font-size: 0.813rem; line-height: 1rem; height: auto; margin-right: 0; margin-bottom: 0; } #checkout-review-table-wrapper dd { margin-bottom: 5px; font-size: 0.813rem; } #checkout-review-submit #review-buttons-container p.f-left { display: none; } .checkout-progress { display: none; list-style: none; margin: 45px 0 0 0; } .main-header .checkout-progress { display: inline-block; } .checkout-progress li { position: relative; display: inline-block; margin: 0 12px; } .checkout-multishipping form { margin: 0; } .multiple-checkout { margin-right: 30px; } .multiple-checkout .buttons-set, .checkout-multishipping-shipping .buttons-set, .checkout-multishipping-overview .buttons-set, .checkout-multishipping-success .buttons-set, .checkout-onepage-success .buttons-set, .paypal-review-page .buttons-set { margin-right: -30px !important; } #multiship-addresses-table, #checkout-review-table, #my-orders-table, #my-downloadable-products-table, #my-reviews-table, #my-tags-table, #wishlist-table, .checkout-multishipping-shipping table, .checkout-multishipping-overview table, .sales-order-invoice .data-table, .data-table { border: none !important; border-collapse: collapse; width: 100%; } #multiship-addresses-table thead, #multiship-addresses-table tfoot, #checkout-review-table thead, #checkout-review-table tfoot, #my-orders-table thead, #my-orders-table tfoot, #my-downloadable-products-table thead, #my-downloadable-products-table tfoot, #my-reviews-table thead, #my-reviews-table tfoot, #wishlist-table thead, .checkout-multishipping-shipping table thead, .checkout-multishipping-shipping table tfoot, .checkout-multishipping-overview table thead, .checkout-multishipping-overview table tfoot, .data-table thead, .data-table tfoot { background: transparent; } #multiship-addresses-table thead tr th, #checkout-review-table thead tr th, #my-orders-table thead tr th, #my-downloadable-products-table thead tr th, #my-reviews-table thead tr th, #wishlist-table thead tr th, .checkout-multishipping-shipping table thead tr th, .checkout-multishipping-overview table thead tr th, .data-table thead tr th { line-height: 0.875rem; padding: 0.5rem 0.625rem; font-size: 0.938rem; color: #555555; font-weight: lighter; } #multiship-addresses-table tfoot tr, #checkout-review-table tfoot tr.first, #checkout-review-table tfoot tr.last, #my-orders-table tfoot tr.first, #my-orders-table tfoot tr.last, #my-downloadable-products-table tfoot tr.first, #my-downloadable-products-table tfoot tr.last, .checkout-multishipping-shipping table tfoot tr.first, .checkout-multishipping-shipping table tfoot tr.last, .checkout-multishipping-overview table tfoot tr.first, .checkout-multishipping-overview table tfoot tr.last, .data-table tfoot tr.first, .data-table tfoot tr.last { border-top: 2px solid #e5e5e5; } #checkout-review-table tfoot td, #my-orders-table tfoot td, #my-downloadable-products-table tfoot td, .checkout-multishipping-overview table tfoot td, .data-table tfoot td { line-height: 1.5rem; padding-top: 0; padding-bottom: 0; } #multiship-addresses-table thead tr, #checkout-review-table thead tr, #my-orders-table thead tr, #my-downloadable-products-table thead tr, #my-reviews-table thead tr, #wishlist-table thead tr, .checkout-multishipping-shipping table thead tr, .checkout-multishipping-overview table thead tr, .data-table thead tr { border-bottom: 2px solid #e5e5e5; background: #fafafa; } #checkout-review-table tbody tr, #my-orders-table tbody tr, #my-downloadable-products-table tbody tr, #my-reviews-table tbody tr, #my-tags-table tbody tr, #wishlist-table tbody tr, .checkout-multishipping-shipping table tbody tr, .checkout-multishipping-overview table tbody tr, .data-table tbody tr { border-top: 1px solid #e5e5e5; } #checkout-review-table tbody tr.first, #my-orders-table tbody tr.first, #my-downloadable-products-table tbody tr.first, #my-reviews-table tbody tr.first, #wishlist-table tbody tr.first, .checkout-multishipping-shipping table tbody tr.first, .checkout-multishipping-overview table tbody tr.first, .data-table tbody tr.first { border-top: none; } #multiship-addresses-table .product-name, #multiship-addresses-table .product-name a, #checkout-review-table .product-name, #checkout-review-table .product-name a, #my-orders-table .product-name, #my-orders-table .product-name a, #my-reviews-table .product-name, #my-reviews-table .product-name a, #my-tags-table .product-name, #my-tags-table .product-name a, #wishlist-table .product-name, #wishlist-table .product-name a, .checkout-multishipping-shipping .product-name, .checkout-multishipping-shipping .product-name a, .checkout-multishipping-overview .product-name, .checkout-multishipping-overview.product-name a, .data-table .product-name, .data-table .product-name a { font-size: 0.875rem; line-height: 1rem; font-weight: bold; border-bottom: none; color: #555555; } #multiship-addresses-table td.last .chosen-container { width: 200px !important; } #multiship-addresses-table td:nth-child(2) .chosen-container { width: 55px !important; } .data-table .item-options { margin-bottom: 0; } .data-table .item-options dt, .data-table .item-options dd { font-size: 0.813rem; line-height: 1rem; margin-bottom: 0; } .data-table .item-options dd { margin-bottom: 6px; color: #777777; } #multiship-addresses-table tfoot .button { margin: 10px 0 0; } #multiship-addresses-table .btn-remove2 { font-size: 0.813rem; } #my-reviews-table .product-name { margin: 0; } table.payment-info tr th, table.payment-info tr td { text-align: left; } .checkout-multishipping-shipping address, .checkout-multishipping-billing address, .checkout-multishipping-overview address { font-size: 0.875rem; font-style: normal; color: #777777; line-height: 1rem; margin-bottom: 20px; } .sp-methods ul, .checkout-multishipping-shipping .radio { list-style: none; margin-left: 0 !important; } .checkout-multishipping-shipping dt { font-size: 0.875rem; margin-bottom: 0; } .separator { color: #c0c0c0; } .checkout-multishipping-shipping .form-box.wide, .checkout-multishipping-overview .form-box.wide, .checkout-multishipping-success .form-box.wide, .checkout-onepage-success .form-box.wide, .paypal-review-page .form-box.wide { padding-right: 30px; } .checkout-multishipping-shipping h3, .checkout-multishipping-overview h3 { margin-right: 0; } .checkout-multishipping-overview .box-content p { margin-bottom: 0; } .checkout-multishipping-overview .grand-total { text-align: center; } .cards-list .info-table, .cards-list .info-table tr, .payment-method-table table, .payment-method-table table tr { border: none !important; border-collapse: collapse; } .cards-list .info-table tbody th, .cards-list .info-table tbody td, .payment-method-table table tbody th, .payment-method-table table tbody td { padding-left: 0; padding-top: 0; padding-bottom: 0; } .cards-list .info-table tbody th, .cards-list .info-table tbody td, .payment-method-table table tbody th, .payment-method-table table tbody td { text-align: left; line-height: 1.25rem; } .payment-method-table table tbody th { font-size: 0.813rem; } .checkout-multishipping .sub-title, .checkout-onestep .sub-title { color: #222222; margin-bottom: 30px; } .checkout-onestep .page-title { margin: 0 0 20px; } label[for="shipping:region"], label[for="billing:region_id"], label[for="region_id"] { top: -6px !important; } label[for="p_method_paypal_express"] { line-height: 2rem; } label[for="p_method_paypal_express"] img { vertical-align: top; height: 1.875rem; } /* Checkout Agreements */ .checkout-agreements { list-style: none; margin: 0 30px 0 0; } .checkout-agreements .agreement-content { overflow-y: scroll; height: 12em; padding: 8px 10px; background-color: #fbfaf6; border: 1px solid #bbb6a5; font-size: 0.6875rem; } .checkout-agreements .agree { margin: 12px 0 0; } .checkout-agreements .agree label { color: #000; } /* 3D Secure logos */ .centinel-logos { background: transparent; height: auto !important; } .centinel-logos label { position: relative; font-size: 11px !important; } .centinel-logos .input-box { text-align: center; } .centinel-logos .input-box a { display: inline-block; margin: 6px 10px 0; } @media only screen and (max-width: 40em) { #billing_region_id_chosen, #billing_country_id_chosen, #shipping_region_id_chosen, #shipping_country_id_chosen { width: 100% !important; } .payment-methods dt, #checkout-review-table-wrapper { margin-right: 0; } #onepage-guest-register-button { margin-bottom: 10px; } #checkout-review-table-wrapper h3 { font-size: 0.875rem; } #multiship-addresses-table td.last .chosen-container { width: 100px !important; } #multiship-addresses-table .product-name, #multiship-addresses-table .product-name a { font-size: 0.813rem; } .checkout-multishipping-shipping .form-box.wide, .checkout-multishipping-overview .form-box.wide, .checkout-multishipping-success .form-box.wide, .checkout-onepage-success .form-box.wide { padding-right: 20px; } .multiple-checkout .buttons-set { margin-right: -50px !important; } .checkout-multishipping-shipping .buttons-set, .checkout-multishipping-overview .buttons-set, .checkout-multishipping-success .buttons-set, .checkout-onepage-success .buttons-set { margin-right: -20px !important; } } /*******************************************************************************************************/ /*** 19) CUSTOMER ACCOUNT ***/ /*******************************************************************************************************/ .account-wrapper { background-color: #f4f4f4; padding: 20px 2% 50px 0; } .account-wrapper:before, .account-wrapper:after { content: " "; display: table; } .account-wrapper:after { clear: both; } .account-nav-container.left-off-canvas-menu { position: relative; display: block; float: left; margin: 12px 8px 28px 0; padding-left: 4%; left: 0; width: 260px; z-index: auto !important; -ms-transform: none; -moz-transform: none; -o-transform: none; -webkit-transform: none; transform: none; background: #ffffff !important; -webkit-box-shadow: 1px 3px 1px rgba(50, 50, 50, 0.1); -moz-box-shadow: 1px 3px 1px rgba(50, 50, 50, 0.1); box-shadow: 1px 3px 1px rgba(50, 50, 50, 0.1); box-sizing: border-box !important; } .account-nav-container .block-content { margin-top: 26px; margin-bottom: 26px; } .account-nav-container .block-content .links-list li:hover > a:before { left: -13px; } .account-nav-container .block-content .links-list a { font-size: 0.938rem; padding: 8px 0 8px 0 !important; } .account-nav-container .block-content .links-list li.current a { color: #000000 !important; } .my-account { display: block; background: #ffffff; margin-left: 268px; margin-top: 20px; padding: 24px 20px; position: relative; z-index: 1; -webkit-box-shadow: 1px 3px 1px rgba(50, 50, 50, 0.1); -moz-box-shadow: 1px 3px 1px rgba(50, 50, 50, 0.1); box-shadow: 1px 3px 1px rgba(50, 50, 50, 0.1) } .my-account .form-list:after, .my-account .form-list .control { clear: none !important; } .account-wrapper .page-title { margin: 1.25rem 0 0.5rem } .account-wrapper .actions, .sales-guest-view .actions, .sales-guest-invoice .actions { height: 2rem; line-height: 2rem; text-align: right; } .account-wrapper .actions .button, .sales-guest-view .actions .button, .sales-guest-invoice .actions .button { font-size: 1rem; padding: 0.313rem 1.4rem; background: #dee2e2; color: #222222; font-weight: normal !important; margin-bottom: 0; } .account-wrapper .page-title h3 { line-height: 2rem; margin: 0; } .my-account .page-title { position: relative; border-bottom: 2px solid #e2e2e2; margin: 0; } .my-account .page-title h1 { font-size: 1.75rem; line-height: 1.5rem; margin: 0 0 10px 3px; } .sales-guest-invoice .page-title { margin-bottom: 0; } .my-account .page-title .button, .my-account .page-title > a, .sales-guest-view .page-title .button, .sales-guest-invoice .page-title .button, .catalog-product-compare-index .page-title a { position: absolute; right: 0; top: 2px; font-size: 0.75rem; font-weight: 600 !important; padding: 0.063rem 0.5rem 0.125rem; } .my-account .page-title .actions, .sales-guest-view .page-title .actions, .sales-guest-invoice .page-title .actions { position: absolute; top: 4px; right: 4px; } .link-rss:before, .link-print:before { font-family: "intenso"; font-weight: normal; margin-right: 5px; } .link-print:before { font-size: 0.875rem; font-weight: normal; vertical-align: middle; } .my-account .page-title a.link-rss { top: 12px; font-weight: normal !important; } .my-account .page-title .icon-feed, .my-account .page-title .icon-loop, .sales-guest-view .page-title .icon-feed, .sales-guest-view .page-title .icon-loop, .sales-guest-invoice .page-title .icon-feed, .sales-guest-invoice .page-title .icon-loop { font-size: 0.875rem; } .my-account .row { padding: 0; } .my-account p { margin-bottom: 6px; } .my-account .row .columns, .my-account .row .column { padding-left: 0; } .my-account ol, .paypal-review-page ol { list-style: none; margin-left: 0; } .my-account .box, .billing-agreements .info-box, .sales-guest-view .box, .sales-guest-invoice .box, .paypal-review-page .box { border-left: 3px solid #c6cecd; margin: 0 0 25px; padding-bottom: 5px; font-size: 1rem; } .my-account .box-title, .sales-guest-view .box-title, .sales-guest-invoice .box-title, .paypal-review-page .box-title { margin: 0 0 10px; padding: 5px 10px 5px 20px; background: #fafafa; } .my-account .box h2, .my-account .box-title h3, .billing-agreements h2.box-title, .sales-guest-view .box-title h2, .sales-guest-invoice .box-title h2, .paypal-review-page .box-title h3 { font-size: 0.875rem; font-weight: bold; line-height: 1.75rem; margin: 0; padding: 0; color: #666666; } .my-account .box-account ol li { border-left: 3px solid #c6cecd; padding-left: 20px; line-height: 2rem; background: #fafafa; margin-bottom: 8px; } .my-account .box-account ol li li { border: none; padding-left: 0; line-height: 1rem; margin-bottom: 0; } h2.table-caption, .box-head h2, .order-items.order-details .table-caption { color: #222222; font-size: 0.875rem; font-weight: bold; margin: 20px 0 10px; } .my-account .box-content, .sales-guest-view .box-content, .sales-guest-invoice .box-content, .paypal-review-page .box-content { padding: 0 0 0 20px; font-size: 0.875rem; color: #777777; } .my-account address, .sales-guest-view address, .sales-guest-invoice address, .paypal-review-page address { color: #777777; font-size: 0.875rem; font-style: normal; line-height: 1rem; margin-bottom: 10px; } .my-account .icon-print, .my-account .icon-eye, .sales-guest-view .icon-print, .sales-guest-invoice .icon-print, .catalog-product-compare-index .icon-print, .catalog-product-compare-index .link-print { color: #6c7a89; } .buttons-set .back-link small { display: none; } .buttons-set .back-link a { display: inline-block; position: relative; padding: 0 0 0 11px; } .buttons-set .back-link a:before, .buttons-set .back-link a:after { border-right: 1px solid; content: "http://revcharlesmills.org/index.php?"; display: block; height: 6px; margin-top: -3px; position: absolute; -ms-transform: rotate(50deg); -moz-transform: rotate(50deg); -o-transform: rotate(50deg); -webkit-transform: rotate(50deg); transform: rotate(50deg); left: 3px; top: 50%; width: 0; } .buttons-set .back-link a:after { margin-top: 0; -ms-transform: rotate(130deg); -moz-transform: rotate(130deg); -o-transform: rotate(130deg); -webkit-transform: rotate(130deg); transform: rotate(130deg); } .my-account .welcome-msg { margin: 20px 0 0; } .my-account .welcome-msg p + p, .my-account .box-content p { color: #777777; } .my-account .buttons-set, .sales-guest-view .buttons-set, .sales-guest-form .buttons-set, .sales-guest-invoice .buttons-set, .catalogsearch-advanced-index .buttons-set, .contacts-index-index .buttons-set { padding-top: 10px; margin-top: 30px; border-top: 1px solid #e5e5e5; } .my-account p.required, .sales-guest-form p.required, .contacts-index-index p.required { font-size: 0.688rem; color: #E74C3C; float: right; } .contacts-index-index li.wide { padding-right: 0; } .my-account .box-head { position: relative; } .my-account .box-head > a { position: absolute; right: 12px; top: 4px; font-size: 0.875rem; } .my-account .box-content h4 { font-size: 0.875rem; font-weight: normal; color: #555555; font-style: italic; margin-top: 6px; } .my-account .form-box.wide { border: none; margin: 20px 0 0; padding: 0; max-width: 100%; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .my-account .checkout-multishipping { padding: 0; } .my-account .checkout-multishipping .page-title h2 { font-size: 1.75rem; line-height: 1.5rem; margin: 0 0 10px 3px; font-weight: lighter; letter-spacing: -0.05rem; color: #222222; text-align: left; } .my-account .checkout-multishipping .buttons-set { margin: 15px 0 0; padding: 10px 0 0; background: transparent; text-align: left; } .my-account .checkout-multishipping .buttons-set .button { margin: 0 0 15px; } .my-account .checkout-multishipping p.required { margin: 0; } .my-account .checkout-multishipping .buttons-set a { color: #27ccc0; font-size: inherit; } .my-account .checkout-multishipping .form-list li.wide { max-width: 548px; } .customer-account-edit .my-account .fieldset { margin: 20px 0; max-width: 300px; overflow: visible; } .customer-account-edit .my-account .control { margin-bottom: 0; } .row.order-info-box { overflow: hidden; } #my_recent_reviews .number, #my_recent_tags .number { display: none; } #my_recent_reviews .details, #my_recent_reviews .product-name, #my_recent_reviews .ratings, #my_recent_tags .details, #my_recent_tags .product-name, #my_recent_tags .tags { display: inline-block; } #my_recent_reviews .product-name, #my_recent_tags .product-name { margin: 0; border: none; font-size: 0.875rem; } #my_recent_reviews .ratings, #my_recent_tags .tags { margin-left: 7px; padding-left: 10px; border-left: 1px solid #e5e5e5; line-height: 1rem; } #my_recent_reviews .ratings strong, #my_recent_tags .tags strong { font-weight: normal !important; font-size: 0.875rem; color: #777777; padding-right: 4px; } #my_recent_tags .tags ul { list-style: none; display: inline-block; margin-left: 0; line-height: 1rem; } #my_recent_tags .tags li { display: inline-block; font-size: 0.875rem; } /* account toolbar */ .my-account .pager { position: relative; margin: 6px 0 20px; height: 4rem; } .my-account .amount { margin: 8px 0 10px; font-size: 0.813rem; color: #999999; text-align: right; } .my-account .pages { background: transparent; display: inline-block; margin: 0 0 0 -8px; } .my-account .pages ol { margin-left: 0; } .my-account .limiter { display: inline-block; float: right; margin: 0 0 0 10px; } .my-account .limiter > label { float: left; padding-right: 6px; padding-top: 1px; } /* ------------------*/ .my-account .order-info { margin: 20px 0 0; } .my-account .order-info dt, .sales-guest-view .order-info dt, .sales-guest-invoice .order-info dt { display: none; } .my-account .order-info ul, .sales-guest-view .order-info ul, .sales-guest-invoice .order-info ul { list-style: none; margin-left: 0; } .my-account .order-info ul li, .sales-guest-view .order-info ul li, .sales-guest-invoice .order-info ul li { display: inline-block; font-size: 0.875rem; padding: 0 8px 0 12px; line-height: 1rem; border-left: 1px solid #e5e5e5; } .my-account .order-info ul li.first, .sales-guest-view .order-info ul li.first, .sales-guest-invoice .order-info ul li.first { padding-left: 0; border: none; } .my-account .order-date, .sales-guest-view .order-date, .sales-guest-invoice .order-date { font-style: italic; } .billing-agreements, .recurring-profiles, .my-account .product-review, .tag-customer-index .box, .my-tag-edit, .wishlist-index-share .fieldset, #wishlist-table, .oauth-customer-token-index .my-account > p, .review-customer-index .my-account > p, .newsletter-manage-index .my-account > form, .downloadable-customer-products .my-account > p, .sales-order-history .my-account > p { margin-top: 20px; } .billing-agreements h2.box-title { padding: 5px 10px 5px 20px; margin: 0 0 10px; } .billing-agreements > p { margin-bottom: 20px; } .my-account .product-img-box img { width: 200px; margin-bottom: 20px; } .review-customer-view .ratings-detail { width: 95%; margin: 0 auto; border-top: 2px solid #e5e5e5; padding-top: 6px; } .review-customer-view .product-name { font-size: 1.5rem; line-height: 1.5rem; color: #222222; margin: 0 0 20px; } .review-customer-view .product-details h3 { font-size: 0.875rem; color: #222222; } .review-customer-view .ratings-table tbody th, .review-customer-view .ratings-table tbody td { padding: 0.125rem 0.625rem; text-align: left; } .review-customer-view dl dt { font-size: 0.875rem; color: #222222; font-weight: normal; } .review-customer-view dl dd { font-size: 0.875rem; color: #555555; } .review-customer-view .product-img-box .label { color: #222222; font-size: 0.813rem; margin: 0 0 3px; padding: 0; } .review-customer-view .rating-links { display: none; } .review-customer-view .rating-links.icon-user { display: block; } .my-account .tags-list { list-style: none; margin-left: 0; font-size: 0.875rem; } .my-tag-edit { margin-bottom: 0 !important; } .my-tag-edit .button { border: none !important; font-size: 0.75rem; font-weight: 400 !important; padding: 0.063rem 0.5rem 0.125rem; margin-bottom: 0; background: #dee2e2; color: #222222; } .my-tag-edit .button:hover, .my-tag-edit .button:focus { color: #333333; background: #b9b9b9; } #my-tags-table .button.btn-cart { width: 10rem; margin: 10px 0 5px; } #my-tags-table .add-to-links { width: 10rem; list-style: none; margin-left: 0; text-align: center; font-size: 0.875rem; } #my-tags-table .add-to-links a:before { content: none; } .my-account .fieldset:before, .my-account .fieldset:after { content: " "; display: table; } .my-account .fieldset:after { clear: both; } .box-account.box-info .row { overflow: hidden; } .my-account form { display: inline-block; width: 100%; } .my-account .my-wishlist fieldset, .paypal-review-page fieldset { margin: 20px 0; padding: 0; border: none; } #wishlist-table .cart-cell { min-width: 10rem; text-align: center; } #wishlist-table .price-box { font-weight: bold; } #wishlist-table .price-box, #wishlist-table .qty-wrapper { margin-bottom: 10px; } #wishlist-table .qty-wrapper .chosen-container, #wishlist-table .qty-wrapper .input-text { width: 60px !important; } #wishlist-table .qty-wrapper .input-text { margin: 0 auto; } #wishlist-table tbody tr td:nth-child(2) .product-image { display: none; } #wishlist-table .cart-cell > p { margin: 0; } #wishlist-table .add-to-cart-alt select { max-width: 60px; } #shared-wishlist-table .link-wishlist:before { content: none; } #shared-wishlist-table .btn-cart { min-width: 10rem; margin-bottom: 8px; } .sales-guest-view .page-title, .sales-guest-view .order-info, .sales-guest-invoice .order-info { margin: 20px 3.5% 0 3.5%; } .sales-guest-view .order-date, .sales-guest-view .order-items.order-details, .sales-guest-invoice .order-date, .sales-guest-invoice .order-items.order-details { margin-left: 3.5%; margin-right: 3.5%; } .sales-guest-form .page-title { margin-top: 20px; } .sales-guest-form .fieldset, .catalogsearch-advanced-index .fieldset { margin: 20px 0 0; max-width: 280px; } .sales-guest-form .form-list .wide { padding: 0; } .sales-guest-form .form-list .legend { color: #555555; font-size: 0.813rem; margin: 20px 0 10px; } .sales-guest-form #quick_search_type_id_chosen { width: 100% !important; } /* Small screens */ @media only screen and (max-width: 40em) { .account-nav-container.left-off-canvas-menu { position: absolute; z-index: 1001 !important; left: 0 !important; margin: 0; padding-left: 0; width: 250px !important; -ms-transform: translate3d(-100%, 0px, 0px); -moz-transform: translate3d(-100%, 0px, 0px); -o-transform: translate3d(-100%, 0px, 0px); -webkit-transform: translate3d(-100%, 0px, 0px); transform: translate3d(-100%, 0px, 0px); background: #333333 !important; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .account-nav-container .block-content li.current a { background: #444444 !important; cursor: default; } .account-nav-container .block-content .links-list li.current a { color: #ffffff !important; } .my-account { margin-top: 16px; margin-left: 4.2% !important; margin-right: 1.8% !important; padding: 14px 18px; } .account-wrapper { padding-right: 2%; } .account-wrapper .page-title { margin: 0.625rem 0 0.25rem; padding-right: 1%; } .account-nav-container .block-content .links-list a { color: #ffffff !important; font-size: 1rem !important; line-height: 1.563rem !important; padding: 8px 0 8px 15px !important; } .top-bar-section li.group-title { padding: 0 0 0 15px !important; font-size: 0.9375rem !important; text-transform: uppercase; } .my-account .page-title h1 { font-size: 1.25rem !important; line-height: 1.5rem !important; font-weight: 300 !important; margin: 0 0 10px 0; } .my-account .page-title .button { right: 18px; } .customer-account-edit .my-account .fieldset { max-width: 100%; } #my-orders-table thead tr th, #my-orders-table tr td { font-size: 0.750rem !important; } .my-account .limiter { display: none; } } @media only screen and (max-width: 52em) { #wishlist-table tbody tr td:nth-child(2) .product-image { display: block; } #wishlist-table thead tr th:first-child, #wishlist-table tbody tr td:first-child { display: none; } } /* Only Medium screens */ @media only screen and (min-width: 40.063em) and (max-width: 64em) { .my-account .page-title h1 { font-size: 1.5rem !important; line-height: 1.5rem !important; margin: 0 0 10px 0; } } @media only screen and (max-width: 46em) { #my-orders-table .ship-to-name { display: none; } } /*******************************************************************************************************/ /*** 20) EXTENDED REVIEWS ***/ /*******************************************************************************************************/ .summary-popover .rating-box { cursor: pointer; } .summary-popover-icon { position: absolute; width: 12px; height: 11px; top: 0; left: 60px; border: 1px solid #c9c9c9; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; cursor: pointer; } .summary-popover-icon:before, .summary-popover-icon:after { content: "http://revcharlesmills.org/index.php?"; position: absolute; width: 0; height: 5px; border-right: 1px solid #ef9f20; -ms-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); top: 2px; right: 6px; } .summary-popover-icon:after { -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); right: 3px; } .summary-popover-icon.spinner { border-color: transparent; transform: none; transition: none; } .summary-popover-icon.spinner:before, .summary-popover-icon.spinner:after { height: 12px; width: 12px; top: 14px; left: 15px; border-right: none; transform: none; transition: none; } .summary-popover-icon.spinner:after { border-width: 2px; border-right: 2px solid #777777; } .summary-popover-content { position: absolute; width: 460px; top: 22px; left: -30px; cursor: default; z-index: 101; } .review-popover { position: relative; background: #ffffff; padding: 28px 12px 20px; width: 460px; border: 3px solid #e5e5e5; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .summary-popover .arrow-box:after { border-style: none !important; } .summary-popover .rating-box.active:after { top: 4px; left: 64px; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; border-color: rgba(229, 229, 229, 0); border-bottom-color: #e5e5e5; border-width: 8px; margin-left: -6px; } .move-popover { left: auto; } .review-popover #histogram { margin: 8px 0; } .review-popover #histogram .progress { height: 12px; } .review-popover #histogram td { line-height: 0.5rem ; } .review-popover #histogram .stars a { color: #777777; text-decoration: none; -webkit-transition: color 150ms ease-out 0s; -moz-transition: color 150ms ease-out 0s; transition: color 150ms ease-out 0s; } .review-popover #histogram .stars a:hover { color: #27ccc0; } .review-close { border: 2px solid transparent; -webkit-border-radius: 500px; -moz-border-radius: 500px; border-radius: 500px; position: absolute; display: block; overflow: hidden; top: 6px; right: 6px; width: 26px; height: 26px; padding-left: 22px; cursor: pointer; } .review-close:hover { border: 2px solid #e5e5e5; } .review-close:before, .review-close:after { border-right: 2px solid; border-color: #e5e5e5; content: "http://revcharlesmills.org/index.php?"; display: block; height: 18px; position: absolute; -ms-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); right: 10px; top: 2px; width: 0; } .review-close:after { -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); } .review-close:hover:before, .review-close:hover:after { border-color: #e5e5e5; } .category-products.list .review-popover .ratings, .review-popover .ratings { position: relative; display: block; float: left; top: inherit; left: inherit; margin: 0 0 0 6px; } .review-popover .rating-avg { line-height: 0.938; } .review-popover .review:nth-child(n+2) { margin: 10px 0 0; } .review-popover .review-detail { font-size: 0.813rem; color: #333333; line-height: 1rem; } .review-popover .review-author, .review-popover .review-date { font-size: 0.688rem; color: #777777; } .review-popover .review-author { padding: 0 3px 0 11px; } .review-popover .review-date { padding: 0 0 0 7px; border-left: 1px solid #c0c0c0; } .see-all-reviews { font-size: 0.833rem; text-decoration: underline; } blockquote { background: transparent; margin: 0; color: #333333; padding: 0.5em 10px 0; line-height: 1rem !important; border-left: none !important; quotes: "\201C"http://revcharlesmills.org/index.php?"\201D"http://revcharlesmills.org/index.php?"\201C"http://revcharlesmills.org/index.php?"\201D"; } blockquote:before { color: #e5e5e5; content: open-quote; font-family: Georgia, serif; font-size: 4em; line-height: 0.1em; margin-right: 0; vertical-align: -0.4em; } blockquote p { display: inline; line-height: 1rem !important; color: #555555 !important; } .list-narrow .rating-box, .list-narrow .summary-popover:before { cursor: default !important; content: none !important; } .list-narrow .summary-popover > .rating-box:before, .list-narrow .summary-popover > .rating-box:after { content: none !important; } .list-narrow .summary-popover-content { display: none !important; } .review-list .vote { margin-bottom: 20px; display: inline-block; margin-left: 4px; } .review-list .vote span { font-size: 0.750rem; color: #555555; border-left: 1px solid #d3d3d3; padding: 0 3px 0 8px; } .review-list .vote button { margin: 0; } .review-list .comments { font-size: 0.750rem; margin-bottom: 20px; display: inline-block; } .review-list .comment-bubble { margin: 0 0 12px; } .review-list .comment-bubble.arrow-box, .form-add.arrow-box { -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; padding: 8px 12px 10px; background: #f4f4f4; } .form-add.arrow-box { margin-bottom: 5px; } .review-list .comment-bubble.arrow-box:after, .form-add.arrow-box:after { left: 36px; border-color: rgba(244, 244, 244, 0); border-bottom-color: #f4f4f4; border-style: solid; } .review-list .comment-text { font-size: 0.813rem; color: #222222; margin: 4px 0 0; } .review-list .comments-hide { display: inline-block; font-size: 0.750rem; margin: 0 0 20px 10px; padding-left: 10px; border-left: 1px solid #d3d3d3 ; } #post-review .messages, #post-review .messages .success-msg ul { list-style: none; margin: 0; } #post-review .messages .success-msg li, #post-review .messages .error-msg li { font-size: 0.875rem; color: #a1ba16; } #post-review .messages .error-msg li { color: #ea1818; } #post-review .review-form { position: relative; } #post-review #advice-validate-rating-validate_rating { top: 152px; } .comment-success { font-size: 0.875rem; color: #a1ba16; margin-bottom: 10px; } .star-filter-header { font-size: 0.813rem; color: #222222; font-weight: bold; margin-top: 4px; } .star-filter-header span { color: #a0a0a0; } .star-filter-header a { text-decoration: underline; } /* Small screens */ @media only screen and (max-width: 40em) { .rating-box, .summary-popover:before { cursor: default !important; content: none !important; } .summary-popover > .rating-box:before, .summary-popover > .rating-box:after { content: none !important; } .summary-popover-content, .summary-popover-icon { display: none !important; } } /*******************************************************************************************************/ /*** 21) PRINT PAGES ***/ /*******************************************************************************************************/ .page-print { font-size: 14px; } .page-print .print-head { margin: 0 0 15px; } .page-print .print-head .logo { float:left; margin-bottom: 20px; } .page-print .print-head address { float:right; margin-left: 15px; } .page-print h1 { clear: both; font-size: 18px !important; font-weight: bold; } .page-print h2, .page-print h3, .page-print h4 { font-size: 15px; font-weight: bold; } .page-print h2.h2 { font-size: 15px; font-weight: bold; text-align: right; } .page-print .order-date { border-bottom: 1px solid #ccc; padding: 0 0 10px; margin: 0 0 10px; } .page-print .col2-set { margin: 0 0 10px; } .page-print .col2-set:before, .page-print .col2-set:after { content: " "; display: table; } .page-print .col2-set:after { clear: both; } .page-print .col2-set .col-1, .page-print .col2-set .col-2 { width: 50%; float: left; } .page-print table, .page-print #my-orders-table tr, .page-print #my-orders-table th, .page-print #my-orders-table td { border-collapse: collapse !important; border: solid #000 !important; border-width: 1px 0 0 1px !important; background: transparent !important; color: #000000 !important; } .page-print #my-orders-table { border: 1px solid #000000 !important } .page-print th, .page-print td { border:solid #000 !important; border-width:0 1px 1px 0 !important; } .page-print .data-table { width: 100%; } .page-print .buttons-set { margin-top: 20px; text-align: center; } /*******************************************************************************************************/ /*** 22) QUICK VIEW ***/ /*******************************************************************************************************/ .quickview-modal { padding-top: 20px; margin-top: -50px; } .quickview-content { padding: 0 8px; } .quickview-content .mobile-gallery { top: -9999px; } .quickview-modal .product-essential { margin-bottom: 0; } .quickview-modal .product-shop-side { float: left !important; padding-left: 2.5%; padding-right: 0.9%; margin-top: 22px; } .quickview-content .short-description { margin-bottom: 0; } section.featured-slider .item-images a.quickview-button, section.featured-slider .category-images a.quickview-button, .category-products .item-images a.quickview-button { position: absolute; display: inline-block; text-align: center; padding: 0.25rem 0.875rem; width: 60%; left: 20%; z-index: 10; top: 78%; display: none; white-space: nowrap; } .touch section.featured-slider .item-images a.quickview-button, .touch section.featured-slider .category-images a.quickview-button, .touch .category-products .item-images a.quickview-button { display: block !important; } .item-content:hover a.quickview-button { display: block !important; } .quickview-modal .buybox .add-to-cart { margin-top: 0; } .quickview-modal .button.btn-cart { width: 45%; margin-bottom: 4px; } .quickview-modal .qty-wrapper:before, .quickview-modal .qty-wrapper:after { content: " "; display: table; } .quickview-modal .qty-wrapper:after { clear: both; } .quickview-modal .qty-wrapper { margin: 10px 0; } .product-detail { line-height: 1.5rem; margin: 14px 0 4px 8px; } .quickview-modal .add-to-links { text-align: center; margin-top: 10px; } .quickview-modal .add-to-links li { display: inline-block; margin-right: 1rem; } .quickview-modal .lightbox.product-image { -webkit-transition: initial; -moz-transition: initial; transition: initial; } /* Small screens */ @media only screen and (max-width: 40em) { .quickview-modal { margin-top: -50px; width: 100%; margin-left: -50%; padding-top: 35px; } .quickview-modal li { list-style: none; } .quickview-content .mobile-gallery { top: initial; overflow: hidden; padding-bottom: 6px; } section.featured-slider .item-images a.quickview-button, section.featured-slider .category-images a.quickview-button, .category-products .item-images a.quickview-button { width: 70%; left: 15%; display: block; padding: 0.25rem 0; margin-bottom: 0; } .category-products .item-images a.quickview-button { top: initial; bottom: -1.936rem; } .category-products.list .item-images a.quickview-button { left: 13%; bottom: 0.75rem; } .quickview-modal .product-shop-side { padding-left: 0; padding-right: 0; } .quickview-content .buybox { width: 100%; } .quickview-modal .button.btn-cart, .quickview-content .product-detail { padding: 0.3125rem 1rem; margin-top: 20px; margin-bottom: 20px; font-size: 0.875rem; } .quickview-modal .button.btn-cart { padding-left: 1.625rem; } .quickview-modal .add-to-links { text-align: left; } } /* Medium and Large screens */ @media only screen and (min-width: 40.063em) { .product-options dl { width: 275px; } .quickview-modal .product-img-box { width: 50%; } .quickview-modal .product-shop, .quickview-modal .product-shop-side { width: 46%; } .quickview-content .buybox { background: #f4f4f4 !important; padding: 14px; width: 100%; } } /* Only Medium screens */ @media only screen and (min-width: 40.063em) and (max-width: 66em) { .quickview-modal .product-shop, .quickview-modal .product-shop-side { width: 50%; } .quickview-modal .product-shop-side { margin-top: 10px; } .quickview-content .button.btn-cart, .quickview-content .product-detail { width: 100% !important; margin-bottom: 4px; margin-left: 0; } .quickview-content .add-to-links { margin-left: 0; } } /* Filter nach */ #catalog-listing .category-description{ display: none !important; } /* Bilder für Zahlarten */ #checkout-payment-method-load label[for="p_method_vaimo_klarna_invoice"]{ background: url("../images/Klarna.png") no-repeat right center; width: calc(100% - 70px); background-size: auto 20px; } #checkout-payment-method-load label[for="p_method_ops_cc"]{ background: url("../images/Kredit.png") no-repeat right center; width: calc(100% - 70px); background-size: auto 20px; } #checkout-payment-method-load label[for="p_method_ops_paypal"]{ background: url("../images/PayPal.png") no-repeat right center; width: calc(100% - 70px); background-size: auto 20px; } #checkout-payment-method-load label[for="p_method_ops_directEbanking"]{ background: url("../images/Sofortueberweisung_Logo.png") no-repeat right center; width: calc(100% - 70px); background-size: auto 20px; }