﻿@import 'default.css';

/**
 * Defaults and Resets
 */
html, body {margin: 0; padding: 0; background: #fff url(images/layout/bg.gif) repeat-x 0 -50px;}

body {padding: 9px 0 20px 0; font-family: Arial, Verdana, Sans-Serif; font-size: 12px; line-height: 21px;}

form {margin: 0; padding: 0;}

img {border: 0;}

td {vertical-align: top;}

p {margin: 0 0 20px 0;}

:focus {outline: 0;}

a {color: #7A9000;}
a:hover {color: #000;}

h2 {margin: 0; font-size: 14px; font-weight: normal; color: #232223;}
h3 {margin: 0; font-size: 14px; font-weight: normal; color: #728600;}

/**
 * General
 */
.clearBoth, .clear {clear: both; height: 0px; font-size: 1px; line-height: 0px; display: block;}
.clearfix {zoom: 1;}
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}

img.preload {display: none;}

.right {float: right; margin: 0 0 20px 20px;}

.accent {color: #728600;}

p.noUnderline a,
a.noUnderline {text-decoration: none;}

/**
 * Lists
 */
ul.inline {margin: 0; padding: 0; list-style-type: none;}
ul.inline li {display: inline;}

ul.list {margin: 0; padding: 0; list-style-type: none;}

/**
 * Layout
 */
#master {width: 988px; margin: auto;}

#header {position: relative; height: 95px; background: url(images/layout/bg-header.gif) no-repeat; margin-bottom: 5px;}
#header .logo {position: absolute; top: 0; left: 0;}
#header .nav {position: absolute; bottom: 0; right: 15px; font-size: 1px; line-height: 1px;}
#header .nav ul {margin: 0; padding: 0; list-style-type: none;}
#header .nav ul li {float: left; display: block; position: relative; z-index: 1; margin-right: -1px;}
#header .menu {position: absolute; top: 87px; right: 52px; width: 425px; font-family: Arial, Verdana, Sans-Serif; font-size: 12px; line-height: 18px; color: #4a4a4a; z-index: 1000;}
#header .menu a {color: #4a4a4a; text-decoration: none;}
#header .menu a:hover {color: #000;}
#header .menu .content {width: 100%; min-height: 217px; background: url(images/layout/bg-menu.gif) no-repeat;}
#header .menu .footer {width: 100%; height: 10px; background: url(images/layout/bg-menu.gif) no-repeat left bottom;}
#header .menu .more,
#header .menu .more a {font-size: 11px; font-weight: bold; color: #6b6b6b; text-transform: uppercase;}
#header .menu .photos {float: left; width: 201px; padding: 60px 0 20px 50px; position: relative;}
#header .menu .photos div {position: absolute;}
#header .menu .category {float: left; width: 141px; padding: 12px 15px 0 15px;}
#header .menu ul {margin: 0; padding: 0 0 30px 0; list-style-type: none;}
#header .menu ul .title {padding: 12px 0 27px 0;}
#header .menu ul .title img {display: block;}
#header .menu ul .more {position: absolute; left: 267px; bottom: 5px;}
#header .menu ul .moreHolders {left: 433px;}
#header .menu ul .moreVisibility {left: 595px;}
#header .menu ul li {padding: 0 0 5px 0;}

#header .productMenu {width: 753px;}
#header .productMenu .category {padding: 0 15px;}
#header .productMenu .content {width: 100%; background: url(images/layout/bg-product-menu.gif) no-repeat;}
#header .productMenu .footer {width: 100%; height: 10px; background: url(images/layout/bg-product-menu.gif) no-repeat left bottom;}
#header .productMenu .hydration {width: 137px;}
#header .productMenu .holders {width: 132px;}
#header .productMenu .visbility {width: 142px;}

#header .hydrationMenu {right: 284px;}
#header .holdersMenu {right: 179px;}
#header .visbilityMenu {right: 89px;}

#header .search {position: absolute; top: 20px; right: 60px; background: #555657; border-radius: 5px;}
#header .search .form-item {margin: 0;}
#header .search label {display: none;}
#header .search [type="text"] {width: 150px; background: none; padding: 5px; font-family: Verdana, Arial, sans-serif; font-size: 11px; color: #fff; border: none;}
#header .search [type="submit"] {position: absolute; top: 3px; right: 5px; text-indent: -10000px; display: block; width: 20px; height: 20px; background: url(images/layout/search.png) no-repeat center center; border: none; cursor: pointer;}

#header .cart {position: absolute; top: 26px; right: 30px;}
#header .cart a {background: url(images/icons/cart.gif) no-repeat; display: block; width: 16px; height: 14px; text-indent: -10000px;}

#photo {padding: 0 0 5px 0;}
#photo p {margin: 0;}
#photo img {display: block;}

#body {}

#content {float: left;}

#sidebar {float: left; margin: -50px 0 0 -20px; padding: 0 10px 0 0; font-family: Arial, Verdana, Sans-Serif; font-size: 11px; line-height: 18px; color: #232223; background: url(images/layout/bg-sidebar.png) no-repeat left bottom; overflow: hidden;}
#sidebar > div {padding: 23px 19px 0 19px; background: url(images/layout/bg-sidebar-top.gif) no-repeat;}
#sidebar .title {height: 34px; padding: 13px 0 0 25px;}
#sidebar .title h2 {margin: 0; font-size: 18px; line-height: normal;}
#sidebar .content {padding: 10px 25px 0 25px; text-align: justify;}
#sidebar .content .noMargin {margin: -8px 0 0 -25px;}
#pageHeader {margin: 0 -2px 5px -2px; height: 49px; background: #dedede url(images/layout/bg-title.gif) no-repeat right top;}
#pageHeader .title {float: left; height: 31px; padding: 18px 25px 0 30px; background: #cbcbcb url(images/layout/bg-title-left.gif) no-repeat;}
#pageHeader .title h1 {margin: 0; font-family: Arial, Verdana, Sans-Serif; font-size: 17px; text-transform: uppercase; color: #232223;}

#pageHeader .breadcrumbs {float: left; padding: 23px 0 0 20px; font-family: Arial, Verdana, Sans-Serif; font-size: 12px; line-height: normal; color: #211f20;}
#pageHeader .breadcrumbs a {color: #211f20; text-decoration: none; padding: 0 5px;}
#pageHeader .breadcrumbs span {padding: 0 5px;}
#pageHeader .breadcrumbs .on {color: #92ab05; font-weight: bold;}
#pageHeader .breadcrumbs a:hover {color: #000;}

#footer {margin-top: 5px; height: 56px; padding: 0 18px 0 20px; background: url(images/layout/bg-footer.gif) no-repeat; font-family: Arial, Verdana, Sans-Serif; font-size: 10px; line-height: 56px; color: #8a8989; text-transform: uppercase;}
#footer a {color: #8a8989; text-decoration: none;}
#footer a:hover {color: #fff;}
#footer .quickLinks {float: left;}
#footer .quickLinks .cart {background: none; padding-left: 0;}
#footer .quickLinks .cart a {background: url(images/icons/cart.gif) no-repeat; padding-left: 22px;}
#footer .nav {float: right; text-align: right;}
#footer ul {margin: 0; padding: 0; list-style-type: none;}
#footer ul li {float: left; display: block; padding: 0 22px; background: url(images/layout/bg-footer-separator.gif) no-repeat 0 18px;}
#footer ul li.first {background: none;}

#legalFooter {font-family: Arial, Verdana, Sans-Serif; font-size: 11px; color: #6c6c6c; text-align: right; padding: 10px 10px 20px 0;}

#searchFooter {font-size: 11px; line-height: 14px; color: #ccc; padding: 0 10px;}

/**
 * Layout Variations
 */
body.sidebar-right #content {width: 659px;}
body.sidebar-right #sidebar {width: 337px;}

body.wideSidebarLayout #content {width: 438px;}
body.wideSidebarLayout #sidebar {width: 558px; background-image: url(images/layout/bg-sidebar-wide.png);}
body.wideSidebarLayout #sidebar > div {background-image: url(images/layout/bg-sidebar-top-wide.gif);}
body.wideSidebarLayout div.verticalCategoryList .content {width: 200px;}
body.wideSidebarLayout div.verticalCategoryList > div {background: url(images/layout/bg-category-narrow.gif) no-repeat 135px 30px;}

body.node-type-page #body {padding: 0 25px 0 25px;}

/**
 * Front Page
 */
#front {width: 100%; background: #121212 url(images/layout/bg-front.gif) no-repeat -988px 0; font-size: 11px; line-height: 18px; color: #fff;}
#front > div {width: 100%; background: url(images/layout/bg-front.gif) no-repeat left bottom;}
#front h2 {margin: 0 0 10px 0; font-size: 11px; color: #adc238; text-transform: uppercase;}
#front a {color: #9db034;}
#front a:hover {color: #9db034;}
#front .mainFeature {float: left; width: 434px;}
#front .mainFeature img {display: block;}
#front .contentContainer {float: left; width: 514px; padding: 20px 0 0 40px;}
#front .contentContainer .cta {margin: 0 0 30px 0;}
#front .contentContainer .cta h1 {margin:  0 0 20px 0;}
#front .contentContainer .cta .content {width: 350px;} /*float: left; width: 245px; padding: 0 30px 0 0;*/
#front .contentContainer .cta .content p {margin-bottom: 0;}
#front .contentContainer .cta .more {float: left; width: 200px; padding: 10px 0 0 0;}
#front .contentContainer .features {width: 471px; min-height: 295px; background: url(images/layout/bg-feature-separator.gif) no-repeat 238px 0;}
#front .contentContainer .features .feature {float: left; width: 215px;}
#front .contentContainer .features .rightFeature {float: right; width: 205px;}
#front .contentContainer .features .feature .photo {margin: 0 0 20px 0;}

/**
 * Contact Page
 */
#contactPage {padding: 50px 0 0 25px; line-height: 18px;}
#contactPage a {color: #000;}
#contactPage a:hover {color: #7A9000; text-decoration: underline;}
#contactPage h3 {margin: 0 0 15px 0; font-size: 12px; font-weight: bold; color: #92ab05;}
#contactPage .sidebar {float: left; width: 185px; padding: 20px 30px 0 30px; min-height: 300px; background: url(images/layout/contact-page-separator.gif) no-repeat right top; text-align: right;}
#contactPage .content {float: left; width: 275px; padding: 20px 30px 0 30px;}
#contactPage .photo {float: left; width: 380px;}

/**
 * Product
 */
#product {padding: 0 0 5px 0; font-family: Arial, Verdana, Sans-Serif; font-size: 12px; line-height: normal;}

#product .photoContainer {float: left; width: 450px; padding: 0;}

#product .photos {height: 348px; margin: 0 0 20px 0;}
#product .photos .swatches {padding: 0;}

#product .swatches {}
#product .swatches .label {padding: 0 0 5px 0; color: #7d7e7f;}
#product .swatches .swatch {float: left; width: 31px; height: 20px; margin: 0 5px 0 0; background: url(images/layout/color-swatch-overlay.gif) no-repeat;}

#product .thumbs {display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap;}
#product .thumbs .images {display: flex;}
#product .thumbs .images > div {width: 48px; margin: 0 0 0 5px; border: solid 1px #231f20; border-radius: 5px; overflow: hidden;}
#product .thumbs .images img {width: 100%; height: auto; display: block;}
#product .thumbs .images .video a {display: block; position: relative;}
#product .thumbs .images .video a:before {position: absolute; content: ""; border: solid 10px transparent; border-width: 10px 20px; border-left-color: #fff; left: 50%; top: 50%; margin: -10px 0 0 -10px; opacity: 0.95;}
#product .thumbs .images .video a:hover:before {border-left-color: #92ab05; opacity: 1;}

#product .details {float: right; width: 535px; overflow: hidden;}
#product .details .summary {padding: 0 0 0 25px; font-size: 14px; color: #7a9000; line-height: normal;}
#product .details .summary h1 {margin: 0; font-size: 22px; font-weight: normal; line-height: normal; color: #231f20;}
#product .details .summary a {text-decoration: none;}
#product .details .summary .price {float: left; width: 90px; padding: 6px 0 0 0;}
#product .details .summary .locator {float: left; width: 125px; padding: 6px 0 0 0;}
#product .details .summary .sku {display: none; float: left; width: 115px; padding: 6px 0 0 0;}
#product .details .summary .email {float: left; width: 130px; font-size: 12px; padding: 6px 0 6px 40px; background: url(images/icons/envelope.gif) no-repeat;}
#product .details .summary .email a {color: #231f20;}
#product .details .summary .checkout {float: left; font-size: 12px; padding: 6px 0 0 25px; background: url(images/icons/cart-black.gif) no-repeat 0 5px;}
#product .details .summary .checkout a {color: #7a9000;}

div.tabContainer {width: 551px; background: url(images/layout/bg-tabs.gif) repeat-y;}
div.tabContainer > div {width: 100%; background: url(images/layout/bg-tabs-footer.gif) no-repeat left bottom;}
div.tabContainer > div > div {width: 100%; background: url(images/layout/bg-tabs-header.gif) no-repeat;}
div.tabContainer ul.tabs {margin: 0; padding: 15px 0 0 15px; list-style-type: none;}
div.tabContainer ul.tabs li {display: inline;}
div.tabContainer .contentWrapper {width: 519px; padding: 0 0 0 15px; min-height: 270px;}
div.tabContainer .features {padding: 15px 20px;}
div.tabContainer .userProfile {padding: 15px 20px;}
div.tabContainer .purchase {padding: 15px 20px;}
div.tabContainer .purchase .productName {margin: 20px 0; font-weight: bold;}
div.tabContainer .purchase .actions {float: left; width: 200px; padding: 10px 0 0 0;}
div.tabContainer .purchase .actions label {display: block; margin: 0 0 10px 0;}
div.tabContainer .purchase .addToCartWrapper {float: left; width: 279px;}
div.tabContainer .customization {padding: 15px 20px;}

div.xsellList {background: url(images/layout/bg-xsell-bottom.gif) repeat-x left bottom; font-family: Arial, Verdana, Sans-Serif; font-size: 12px; line-height: 18px; color: #292728;}
div.xsellList > div {position: relative; width: 988px; background: url(images/layout/bg-xsell-top.gif) repeat-x;}
div.xsellList > div > div {width: 988px; background: url(images/layout/bg-xsell-top-left.gif) no-repeat;}
div.xsellList > div > div > div {width: 948px; padding: 20px 20px 20px 20px; background: url(images/layout/bg-xsell-top-right.gif) no-repeat right top;}
div.xsellList .heading {display: block; padding: 0 0 15px 0;}
div.xsellList .item {float: left; width: 155px; padding: 0 41px; min-height: 155px; background: url(images/layout/bg-product-separator.gif) no-repeat right top;}
div.xsellList .item h4 {margin: 0; font-size: 12px; color: #292728;}
div.xsellList .item h4 a {color: #292728; text-decoration: none;}
div.xsellList .item h4 a:hover {color: #292728;}
div.xsellList .item .price {color: #9db229; font-weight: bold;}
div.xsellList .lastItem {background: none;}

/**
 * Categories
 */
div.verticalCategoryList {margin: 25px 0 0 0; font-family: Arial, Verdana, Sans-Serif;}
div.verticalCategoryList > div {padding: 0 0 20px 0; min-height: 120px; background: url(images/layout/bg-category.gif) no-repeat 155px 30px;}
div.verticalCategoryList .photo {float: left; width: 155px; position: relative;}
div.verticalCategoryList .photo div {position: absolute;}
div.verticalCategoryList .content {float: left; width: 450px; margin: 0 0 0 155px; padding: 0 0 0 20px; font-size: 11px; line-height: 16px; color: #5e5e5e;}
div.verticalCategoryList .content h2 {margin: 0 0 20px 0; font-size: 18px; text-transform: uppercase; color: #232223; line-height: normal;}
div.verticalCategoryList .content h2 a {color: #232223; text-decoration: none;}
div.verticalCategoryList ul.categories {margin: 0; padding: 0; list-style-type: none; font-size: 12px; line-height: 18px;}
div.verticalCategoryList ul.categories li a {color: #4a4a4a; text-decoration: none;}
div.verticalCategoryList ul.categories li a:hover {color: #000;}

div.gridCategoryList {font-family: Arial, Verdana, Sans-Serif; font-size: 12px; line-height: 18px; color: #292728;}
div.gridCategoryList > div {padding: 35px 0 0 0; background: url(images/layout/bg-xsell-bottom.gif) repeat-x left bottom;}
div.gridCategoryList .item {float: left; width: 155px; padding: 0 32px; min-height: 195px; background: url(images/layout/bg-product-separator.gif) no-repeat right top;}
div.gridCategoryList .item h4 {margin: 0; font-size: 12px; color: #292728;}
div.gridCategoryList .item h4 a {color: #292728; text-decoration: none;}
div.gridCategoryList .item h4 a:hover {color: #292728;}
div.gridCategoryList .item .price {color: #9db229; font-weight: bold;}
div.gridCategoryList .lastItem {background: none;}

/**
 * Product Locator
 */
#productLocator .search {float: left; width: 266px;}
#productLocator .results {float: left; width: 682px; padding: 0 0 0 40px;}

div.locatorResults > div {padding: 0 0 20px 0;}
/*div.locatorResults .store {float: left; width: 150px; padding: 0 20px 0 0;}*/
div.locatorResults .store {float: left; width: 185px; padding: 0 15px 0 25px; background: no-repeat 0 5px;}
div.locatorResults .store p {margin: 0;}
div.locatorResults .store .name {font-weight: bold;}

#productSearch {width: 266px; background: #1f1e20 url(images/layout/bg-black-top.gif) no-repeat; font-family: Arial, Verdana, Sans-Serif; font-size: 12px; line-height: 21px; color: #cbcbcb;}
#productSearch h4 {margin: 0; font-size: 14px; font-weight: normal; color: #b8d035;}
#productSearch p {margin-bottom: 10px;}
#productSearch > div {background: url(images/layout/bg-black-bottom.gif) no-repeat left bottom;}
#productSearch .title {padding: 25px 0 15px 20px;}
#productSearch .form {padding: 20px; background: url(images/layout/bg-black-fade.gif) no-repeat;}
#productSearch .state,
#productSearch .province {margin: 0 0 10px 0;}
#productSearch input[name="zip"] {float: left; width: 115px;}
#productSearch .unitedStates input[type=image] {float: left; margin: -1px 0 0 10px;}

/**
 * Outfit Me
 */
#outfitMe {position: relative; margin: 5px 0 0 0; width: 988px; font-family: Arial, Verdana, Sans-Serif; color: #cbcbcb; background: #000 url(images/layout/bg-outfit-me.jpg) no-repeat -988px bottom;}
#outfitMe > div {height: 420px; background: url(images/layout/bg-outfit-me.jpg) no-repeat;}
#outfitMe .arrow {display: none;}
#outfitMe .content {position: absolute; top: 65px; left: 329px; width: 275px; font-size: 12px; line-height: 21px;}
#outfitMe .content h2 {margin: 0 0 10px 0;}
#outfitMe .content h3 {margin: 0; font-size: 14px; font-weight: normal; line-height: 21px; color: #aabe36; text-transform: uppercase;}
#outfitMe .progressBar {position: absolute; top: 25px; left: 689px;} /* top: 550px; */
#outfitMe .progressBar .label {float: left; margin: 7px 0 0 0; width: 80px;}
#outfitMe .progressBar .bar {float: left; width: 93px; height: 15px; position: relative; background: url(images/layout/bg-progress-bar.gif) repeat-x left bottom;}
#outfitMe .progressBar .bar .indicator {position: absolute; top: 0; left: 5px;}
#outfitMe .questions {position: absolute; top: 65px; left: 689px; width: 240px;}
#outfitMe .questions h2 {margin: 0 0 5px 0;}
#outfitMe .questions h3 {margin: 0 0 5px 0; font-size: 14px; font-weight: normal; line-height: 18px; color: #aabe36;}
#outfitMe .questions select {display: block; margin: 0 0 10px 0; border: solid 2px #fff;}
#outfitMe .questions select.invalid {border-color: orange;}
#outfitMe .questions ul.options {margin: 0; padding: 0; list-style-type: none;}
#outfitMe .questions ul.options li {clear: both; width: 200px;}
#outfitMe .questions ul.options li input {float: left; width: 15px;}
#outfitMe .questions ul.options li ul {margin: 0; padding: 0 0 0 20px; list-style-type: none;}
#outfitMe .nav {padding: 15px 0 0 0;}
#outfitMe .nav .back {float: left;}
#outfitMe .nav .next {float: right;}

div.outfitMeHeader {margin: 0 0 5px 0; height: 77px; padding: 10px 20px 10px 30px; color: #fff; background: url(images/layout/bg-om-header.gif) no-repeat;}
div.outfitMeHeader h2 {margin: 0; font-weight: bold; color: #b8d032;}
div.outfitMeHeader .content {float: left; width: 700px; line-height: 18px;}
div.outfitMeHeader .actions {float: right; width: 200px; text-align: right; padding: 30px 0 0 0;}
div.outfitMeHeader .actions img {padding-left: 5px;}

div.searchResults {font-family: Arial, Verdana, Sans-Serif; font-size: 12px; line-height: 18px; color: #292728;}
div.searchResults .header {background: #ababae url(images/layout/bg-om-category.gif) no-repeat right top;}
div.searchResults .header div {background: url(images/layout/bg-om-category-top.gif) no-repeat;}
div.searchResults .header div div {padding: 5px 30px; background: url(images/layout/bg-om-category-bottom.gif) no-repeat left bottom;}
div.searchResults .header h3 {display: inline; margin: 0; font-size: 12px; font-weight: bold; color: #000; text-transform: uppercase;}
div.searchResults .header p {margin: 0;}
div.searchResults .results > div {padding: 0 0 5px 20px; background: url(images/layout/bg-xsell-bottom.gif) repeat-x left bottom;}
div.searchResults .item {float: left; width: 155px; padding: 0 40px; background: url(images/layout/bg-product-separator.gif) no-repeat right top;}
div.searchResults .item h4 {margin: 0; font-size: 12px; color: #292728;}
div.searchResults .item h4 a {color: #292728; text-decoration: none;}
div.searchResults .item h4 a:hover {color: #292728;}
div.searchResults .item .price {color: #9db229; font-weight: bold;}
div.searchResults .lastItem {background: none;}

#outfitMeCarousel {width: 1260px !important;}

/**
 * FAQs
 */
#faqs {}
#faqs .categories {float: left; width: 220px; padding: 0 20px 0 0;}
#faqs .categories h2 {margin: 0 0 30px 0; font-size: 14px; font-weight: normal; color: #728600;}
#faqs .categories ul {margin: 0; padding: 0; list-style-type: none;}
#faqs .categories ul li a {color: #0f0f10; text-decoration: none;}
#faqs .categories ul li a:hover {color: #728600;}
#faqs .categories ul li.on a {color: #728600; font-weight: bold;}
#faqs .faqs {float: left; width: 600px; padding: 30px; border: solid 1px #d8ddb8;}
#faqs .faqs h2 {margin: 0 0 20px 0; font-size: 12px; font-weight: bold; color: #1d1f1f;}
#faqs .faqs h3 {margin: 0; font-size: 12px; font-weight: normal; color: #728600;}

/**
 * Shoping Cart
 */
/* body.page-cart .messageContainer {display: none;} */

#uc-cart-view-form {padding: 20px 20px 0 20px; width: 948px; font-family: Arial, Verdana, Sans-Serif;}
#uc-cart-view-form table {margin: 0 0 20px 0; border-collapse: collapse;}
#uc-cart-view-form tr.even,
#uc-cart-view-form tr.odd {background: #fff;}
#uc-cart-view-form th {border-bottom: solid 3px #ccc; padding: 5px;}
#uc-cart-view-form td {border-bottom: solid 1px #ccc; padding: 5px;}
#uc-cart-view-form td.remove {text-align: center; width: 80px;}
#uc-cart-view-form td.image {width: 50px;}
#uc-cart-view-form td.desc ul {margin: 0; padding: 0; list-style-type: none; font-size: 11px; font-style: italic;}
#uc-cart-view-form td.desc ul li {margin: 0; padding: 0; list-style-type: none;}
#uc-cart-view-form td.price {text-align: right;}
#uc-cart-view-form div.buttons {float: right; text-align: right;}
#uc-cart-view-form #edit-update {width: 102px; height: 24px; font-size: 0; line-height: 0; float: left; display: block; text-indent: -2000px; background: url(images/buttons/update-cart.gif) no-repeat; border: none; cursor: pointer;}
#uc-cart-view-form #edit-checkout {width: 93px; height: 24px; font-size: 0; line-height: 0; float: left; display: block; text-indent: -2000px; background: url(images/buttons/checkout.gif) no-repeat; border: none; cursor: pointer; margin: 0 0 0 10px;}

#edit-panes-uc-discounts-uc-discounts-codes {resize: none; height: 16px;}

/**
 * Search
 */
body.page-search h2 {margin: 0 0 20px 0; font-size: 18px; text-transform: uppercase; color: #232223;}
body.page-search #body {padding: 20px 0;}

#body .search-form {display: none;}

.search-form {margin: 0;}

.search-results .search-info {display: none;}

/**
 * Miscellaneous
 */
#screenMask {background: rgba(0,0,0,0.8); height: 100%; left: 0; opacity: 0.8; overflow: hidden; position: fixed; top: 0; width: 100%; z-index: 1000; display: none;}

#dialogContianer {height: 100%; left: 0; outline: medium none !important; position: fixed; top: 0; width: 100%; z-index: 1010; display: none;}
#dialogContianer > div {box-sizing: border-box; height: 100%; left: 0; padding: 0 8px; position: absolute; text-align: center; top: 0; width: 100%;}
#dialogContianer > div:before {content: ""; display: inline-block; height: 100%; vertical-align: middle;}
#dialogContianer > div > div {display: inline-block; margin: 0 auto; position: relative; text-align: left; vertical-align: middle; z-index: 10;}

.dialog {max-width: 800px; margin: 0 auto; padding: 20px; background: #fff; display: none;}

body.hasDialog #screenMask,
body.hasDialog #dialogContianer,
body.hasDialog .dialog {display: block;}

#addressStandardizationDialog label {display: block;}
#addressStandardizationDialog label + label {margin: 5px 0 0 0;}
#addressStandardizationDialog label input {margin-right: 5px;}
#addressStandardizationDialog h2 {margin: 0 0 10px 0;}
#addressStandardizationDialog p {margin: 0 0 10px 0;}
#addressStandardizationDialog .continue {margin: 20px 0 0 0; text-align: right;}

div.messages {padding: 10px; margin: 10px 0; font-size: 12px; line-height: 16px;}
div.messages ul {margin: 0; padding: 0 0 0 10px;}
div.messages li + li {margin-top: 5px;}

div.warning {border: none; border-left: solid 5px #f0c020;}

div.error {border: none; border-left: solid 5px #d77;}

/**
 * AmpU
 */
body.ampu #body {padding: 50px 100px; background: no-repeat; border-radius: 5px; min-height: 483px; position: relative;}
body.ampu #body .nav {position: absolute; right: 20px; bottom: -47px; z-index: 10;}
body.ampu #body .nav > div {float: right;}
body.ampu #body .nav a {margin-left: 10px;}
body.ampu #body .nav a:hover {color: #fff;}
body.ampu #body .nav .skip {display: none;}
body.ampuWide #body {padding: 50px;}
body.ampu #footer {padding: 0; position: relative;}
body.ampu #footer .progress-bar {position: absolute; top: 8px; left: 100px;}
body.ampu #pageHeader {display: none;}

body.ampu .mainContent {}

body.ampu input[type="text"],
body.ampu input[type="password"] {padding: 5px; border: solid 1px #ccc; font-family: Arial, Verdana, Sans-Serif; font-size: 12px; width: 300px;}
body.ampu .form-item {margin: 0 0 5px 0;}

body.ampu .buttons-centered {}
body.ampu .buttons-centered > div {position: relative; left: 50%; float: left;}
body.ampu .buttons-centered > div > div {float: left; margin-left: -50%;}
body.ampu .buttons-centered .btn {margin: 0 5px;}

body.ampu .start .instructions {float: left;}
body.ampu .start .go {float: right;}

body.ampu div.login {width: 400px;}
body.ampu .login #user-login-form {text-align: left;}

body.ampu .welcome,
.ampuContentNarrow {width: 400px;}

.ampuQuestion .question .content {float: left; width: 600px;}
.ampuQuestion .question .timer {float: right; width: 50px; height: 50px; border-radius: 25px; border: solid 1px #fff; font-size: 20px; font-weight: bold; text-align: center; line-height: 50px;}

#amphipod-u-question-form .form-item {display: inline-block; width: 215px; padding: 0 20px 20px 0; vertical-align: top; margin: 0; overflow: hidden;}
#amphipod-u-question-form .form-radios {margin: 0;}
#amphipod-u-question-form .form-item input {float: left; width: 15px; margin: 3px 0 0 0; padding: 0; text-align: left;}
#amphipod-u-question-form .form-item .answer {float: left; width: 190px; padding: 0 0 0 10px;}

.ampuContent {padding: 25px; color: #fff; margin: 0 auto; position: relative; line-height: 16px;}
.ampuContent a {color: #fff;}
.ampuContent h1 {margin: 0 0 10px 0; line-height: normal;}
.ampuContent.start,
.ampuContent.ampuQuestion,
.ampuContent.boxed {background: url(images/layout/bg-ampu-content.png); border: solid 3px #cdde2e; border-radius: 15px;}

.ampuPageLeft {float: left; width: 330px;}
.ampuPageCenter {float: left; width: 264px; padding: 0 20px;}
.ampuPageRight {float: right; width: 330px;}

.ampuPageLeft p:last-child,
.ampuPageCenter p:last-child,
.ampuPageRight p:last-child {margin: 0;}

body.ampuWide .ampuPageLeft {width: 264px;}
body.ampuWide .ampuPageRight {width: 264px;}

.ampuCongratulations .next .btn {float: right;}

.ampuTshirts .photos {float: left; width: 384px; height: 297px; position: relative;}
.ampuTshirts .photos div {position: absolute; top: 0; left: 0;}
.ampuTshirts .photos img {display: block; width: 100%; height: auto;}
.ampuTshirts .products {float: right; width: 262px;}
.ampuTshirts .products .item {margin: 0 0 20px 0;}
.ampuTshirts .products .option {float: left; width: 20px; margin: 30px 0 0 0;}
.ampuTshirts .products .option input {margin: 0;}
.ampuTshirts .products .thumb {float: left; width: 100px;}
.ampuTshirts .products .thumb img {width: 100%; height: auto; display: block;}
.ampuTshirts .products .details {float: right; width: 132px;}
.ampuTshirts .products .details select {width: 120px;}
.ampuTshirts .products .details input[type="image"] {display: none;}
.ampuTshirts .products div[id^="edit-qty-"] {display: none;}
.ampuTshirts .next {margin: 20px 0 0 0;}
.ampuTshirts .next .btn {float: right;}

.ampuConfirmation .buttons .shop {float: right;}
.ampuConfirmation .done {margin: 20px 0 0 0;}
.ampuConfirmation .done .btn {width: 130px; margin: 0 auto; float: none;}

.btn {display: block; float: left; color: #fff; text-transform: uppercase; text-shadow: 1px 1px #899b13; font-weight: bold; border: solid 1px #fff; text-decoration: none; padding: 2px 10px; background: #b7cc05; cursor: pointer; box-shadow: 2px 2px 3px 0px #201712; font-family: Arial, Verdana, Sans-Serif; font-size: 12px;} /* background:  url(images/layout/bg-button.gif) repeat-x */
.btn-accent {background: #f99c00; text-shadow: 1px 1px #da7d04;}
.btn:hover {color: #fff;}

#amphipod-u-register-form .left {float: left; width: 349px;}
#amphipod-u-register-form .right {float: right; width: 349px;}

/**
 * Customer portal
 */
body.portal #header .logo {left: auto; right: 0;}

#portalLoginDialog {width: 400px;}
#portalLoginDialog h2 {margin: 0; font-weight: bold;}
#portalLoginDialog label {display: block; font-weight: bold;}
#portalLoginDialog input {width: 100%; padding: 5px; box-sizing: border-box; font-family: Arial, Verdana, sans-serif; font-size: 12px;}
#portalLoginDialog p {margin: 0 0 10px 0;}
#portalLoginDialog .btn {float: none; display: inline-block;}
#portalLoginDialog .dialog-loading {position: absolute; background: rgba(255,255,255,0.8) url(images/loading.gif) no-repeat center center; top: 0; right: 0; bottom: 0; left: 0;}
#portal {min-height: 583px; font-size: 14px; line-height: 20px; color: #fff;}
#portal .message {display: table; width: 100%;}
#portal .message > div {text-align: center; height: 410px; display: table-cell; vertical-align: middle; padding: 0 40px; width: 100%; box-sizing: border-box;}
#portal .links {margin: 0; padding: 0; list-style-type: none; text-align: center;}
#portal .links li {display: inline-block; padding: 0 7px 15px 7px;}
#portal .links a {display: table-cell; vertical-align: middle; height: 45px; font-size: 13px; line-height: 15px; padding: 0 10px; font-weight: bold; background: #cbe134; color: #000; text-decoration: none; text-align: center; min-width: 140px; border: solid 1px #fff; border-radius: 10px; box-shadow: 5px 5px 10px 0 rgba(0,0,0,0.8);}
/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash #pageTitle h1 {
	visibility: hidden;
}

/*
.sIFR-hasFlash h2 {
	visibility: hidden;
	letter-spacing: -9px;
	font-size: 55px;
}

.sIFR-hasFlash h3 {
	visibility: hidden;
	letter-spacing: -6px;
	font-size: 25px;
}

.sIFR-hasFlash h4 {
	visibility: hidden;
	letter-spacing: -5px;
	font-size: 21px;
}

.sIFR-hasFlash h5#pullquote {
	letter-spacing: -4px;
	visibility: hidden;
	font-size: 24px;
}
*/
