/* These styles were initially created for the My Account section. It is now used in View Orders and Returns & Replacements. */ #UBWrapper { display: none !important; opacity: 0; visibility: hidden; } #GeneralForms { margin: 30px 0; font-size: 14px; } #GeneralForms ul { list-style: none; padding: 0; } #GeneralForms ul.override { list-style: unset; padding: 10px 10px 10px 20px; } #GeneralForms ul li { font-size: 100%; text-align: left; } #GeneralForms ul li a { display: block; padding: 15px 10px; font-size: 12px; } #GeneralForms .ui-state-hover, #GeneralForms .ui-widget-content .ui-state-hover, #GeneralForms .ui-widget-header .ui-state-hover, #GeneralForms .ui-state-focus, #GeneralForms .ui-widget-content .ui-state-focus, #GeneralForms .ui-widget-header .ui-state-focus { border: 0 !important; background: #8092a6; color: #FFF; } #GeneralForms .ui-widget-content .ui-state-focus a, #GeneralForms ul li a:focus { text-decoration: none; } #GeneralForms ul li.ui-state-active, #GeneralForms ul li.ui-widget-content .ui-state-active, #GeneralForms ul li.ui-widget-header .ui-state-active { border: 0; } #GeneralForms ul li.ui-tabs-active, #GeneralForms ul li.ui-state-hover, #GeneralForms ul li.ui-tabs-active a, #GeneralForms ul li.ui-state-hover a { background: #555; color: #FFF !important; text-shadow: none !important; } #GeneralForms ul li a:focus { outline: none !important; } #GeneralForms h1 { font-size: 19px; font-weight: normal; margin: 20px 0; } #GeneralForms h1.section-title { margin: 0 0 20px 0; } #GeneralForms .not-important { color: #999; } #GeneralForms .discount-promotional { background: #2d71a9; color: #FFF; } #GeneralForms .percentage-wrapper { background: #084577; font: normal 30px Copse,serif; text-align: center; } #GeneralForms .message-wrapper, #GeneralForms .button-wrapper { padding: 20px; } #GeneralForms .message-wrapper { padding: 10px 20px; text-align: center; } #GeneralForms .heading a { color: #428bca; } #GeneralForms .accordion-header { padding: 20px; border-top: 1px solid #dedede; } #GeneralForms .accordion-header .status-normal { color: #000; } #GeneralForms .accordion-header .status-alert { color: #E01212; } #GeneralForms .accordion-header .status-completed { color: #11772D; } #GeneralForms .accordion-header .status-returned { color: #03E; } #GeneralForms .accordion dt, #GeneralForms .accordion dd { padding: 10px; border: 1px solid black; border-bottom: 0; } #GeneralForms .accordion dt:last-of-type, #GeneralForms .accordion dd:last-of-type { border-bottom: 1px solid black; } #GeneralForms .accordion dt a, #GeneralForms .accordion dd a { display: block; color: black; font-weight: bold; } #GeneralForms .accordion dd:last-of-type { border-top: 1px solid white; position: relative; top: -1px; } #GeneralForms .accordion-content { padding: 0 20px 20px 103px; } #GeneralForms .address-box { min-height: 128px; padding: 20px; } #GeneralForms .box-wrapper { background: #dedede; } #GeneralForms .heading { border-radius: 0; background-color: #ccc; border-bottom: 1px solid #dedede; font-size: 13px; font-weight: 700; margin: 0; line-height: 1.5; color: #3f3f3f; padding: 10px 15px; } #GeneralForms .selected { border-top: 0; } #GeneralForms .no-bold { font-weight: normal; } #GeneralForms .divider-wrapper { border-bottom: 1px solid #dedede; padding: 20px 0; } #GeneralForms .orders-header { background: #E5F0F8; padding: 10px 0; color: #3d4558; border: 1px solid #DDD; } #GeneralForms .purchase-header { padding: 20px 10px 0 10px; font-size: 16px; } #GeneralForms .purchase-header-closed { padding: 20px 10px 0 10px; font-size: 16px; } #GeneralForms .purchase-header-saved { padding: 15px; font-size: 13px; } #GeneralForms .orders-item { padding: 10px 0; border-top: 1px solid #dedede; } #GeneralForms .orders-item > div { display: table-cell; vertical-align: middle; float: none; } #GeneralForms .ship-tracking dl { margin: 0; font-size: 12px; } #GeneralForms .order-content { padding: 15px; } #GeneralForms .order-details { font-size: 12px; } #GeneralForms .order-borders { border-bottom: 1px solid #dedede; } #GeneralForms .orders-substatus { border: 1px solid #dedede; padding: 15px; background-color: #f1f1f1; color: #e74c3c; line-height: 1.5; font-weight: 700; font-size: 12px; } #GeneralForms .purchase-date { background: #E5E5E5; font-size: 12px; padding: 10px 15px; } #GeneralForms .complete-box { margin-bottom: 15px; border: 1px solid #E5E5E5; border-radius: 4px; } #GeneralForms .background-tile { background: #f6f6f6; border: 1px solid #ddd; } #GeneralForms .background-tile-form { background: #f6f6f6; border: 1px solid #ddd; border-left: 0; border-right: 0; } #GeneralForms .background-tile-form-new { background: #f6f6f6; border: 0; } #GeneralForms .order-border { border: 1px solid #ddd; border-right: 0; border-left: 0; } #GeneralForms .success { border: 1px solid #E5E5E5; margin-bottom: 10px; } #GeneralForms .success .success { border: none; margin: 0; } #GeneralForms .archived-complete-box { border: 1px solid #dedede; margin-bottom: 24px; } #GeneralForms .recent-views-wrapper-account { border: 0 !important; } #GeneralForms .order-status { padding: 10px; text-align: right; } #GeneralForms .order-status-wrapper { background: #FFF; margin: 2px 0; } #GeneralForms .order-status-wrapper-new { background: #FFF; margin: 15px 0 0 0; } #GeneralForms .active .order-status { background: #777; color: #FFF; } #GeneralForms .success .order-status { background: #5cb85c; color: #FFF; } #GeneralForms .warning .order-status { background: #8092a6; color: #FFF; } #GeneralForms .danger .order-status { background: #F14040; color: #FFF; } #GeneralForms .danger .orders-item:last-child { border: 0; } #GeneralForms .cancelled .danger { color: #F14040; } #GeneralForms .project-divider { border-bottom: 1px solid #dedede; } #GeneralForms .project-divider:last-child { border-bottom: 0; } #GeneralForms .promo-wrapper { color: #F14040; } #GeneralForms .promo-code { font-size: 12px !important; } #GeneralForms .button, #GeneralForms #CustBillEdit, #GeneralForms #CustShipEdit { float: right; cursor: pointer; } #GeneralForms #CustBillEdit, #GeneralForms #CustShipEdit { cursor: pointer; } #GeneralForms .button:hover, #GeneralForms #CustBillEdit:hover, #GeneralForms #CustShipEdit:hover { text-decoration: underline; } #GeneralForms #CustShipAddrView, #GeneralForms #CustBillAddrView { font-size: 14px; } #GeneralForms .special-formatting { font-size: 12px; border-top: 1px solid #8092a6; padding-top: 10px; } #GeneralForms .form-control { max-width: 100%; box-sizing: border-box; margin-bottom: 10px; } #GeneralForms .form-spacing { margin-top: 30px; } #GeneralForms #CustShipSave, #GeneralForms #CustBillSave { margin-right: 10px; } #GeneralForms .account-snapshot { background-color: #EEE; padding: 20px; } #GeneralForms .center-vertical { display: inline-block; border: 1px solid red; position: relative; } #GeneralForms .shiptotext { font-size: 12px; padding: 15px 10px; } #GeneralForms .headertextsmall { font-size: 12px; } #GeneralForms .saved-total { background-color: #ECF0F1; } #GeneralForms .spinner { padding: 100px 0; } #GeneralForms .order-header { margin: 20px 0; } #GeneralForms .orders-filtering select { font-size: 12px; } #GeneralForms .orders h1, #GeneralForms .orders .form-control { margin: 0; } #GeneralForms .ajax-link { cursor: pointer; color: #1f3e60; font-weight: bold; } #GeneralForms .ajax-link:hover { text-decoration: underline; } #GeneralForms #policyPanel ul { list-style: disc; margin-left: 30px; } #GeneralForms #policyPanel ul li { margin-bottom: 5px; } #GeneralForms #policyPanel ul li a { padding: 0; font-size: inherit; } #GeneralForms .returns-replacements-form { background-color: #F0F0F0; padding: 0 30px; margin: 20px 15px; } .alert { margin-top: 20px; } #GeneralForms .text-label { display: block; font-size: 11px; text-transform: uppercase; } #GeneralForms #NewOrderPage { font-size: 15px; } #GeneralForms #NewOrderPage .background-tile { background: #F2F2F2; } #GeneralForms #NewOrderPage .purchase-header { font-size: 17px; font-weight: bold; padding: 20px; } #GeneralForms #NewOrderPage .purchase-header-new { font-size: 17px; font-weight: bold; padding: 20px; border-bottom: 2px solid #fff; } #GeneralForms #NewOrderPage .order-status { padding: 5px; text-align: left; } #GeneralForms #NewOrderPage .order-status p { display: inline-block; text-transform: lowercase; margin: 0; } #GeneralForms #NewOrderPage .order-status p:first-letter { text-transform: capitalize; } #GeneralForms #NewOrderPage .cancelled .success { color: #5CB85C; border: 0; } #GeneralForms #NewOrderPage .cancelled .danger { color: #F14040; border: 0; } #GeneralForms #NewOrderPage .cancelled .normal { color: initial; } .remodal { background: #FFF; } #GeneralForms .btn-spacer { margin-top: 10px !important; } #GeneralForms h2 { font-size: 18px; } #GeneralForms a { text-decoration: underline; } #GeneralForms a.btn { text-decoration: none; } #GeneralForms .status-shipped { color: #1abc9c; } @media (max-width:800px) { #GeneralForms ul li a { font-size: 14px; } #GeneralForms .accordion-header { padding: 20px 0; } #GeneralForms .accordion-content { padding: 0 20px 20px 20px; } #GeneralForms .message-wrapper { padding: 28px 20px; } #GeneralForms .spinner { padding: 30px 0; } #GeneralForms .order-header:last-child { margin: 0 0 20px 0; } #GeneralForms .orders-item { padding: 0; } #GeneralForms .orders-item > div { padding-top: 7px; padding-bottom: 7px; border-bottom: 1px solid #EEE; } #GeneralForms .orders-item > div:first-child { padding-top: 0; } #GeneralForms .orders-item > div:last-child { padding: 0; } } /* Discount Promotion 2022 Redesign */ /* TODO: Deprecate after this becomes permanent */ #GeneralForms .account-overview-grid { display: grid; grid-template-columns: 2fr 10fr; row-gap: 20px; } #GeneralForms .new-discount-promotional { display: grid; grid-template-columns: 1fr; row-gap: 10px; background: #D4EDDA; color: #000; padding: 20px; } #GeneralForms .current-xp-grid { display: grid; grid-template-columns: 150px 250px auto; column-gap: 10px; } #GeneralForms .discount-tier-grid { display: grid; grid-template-columns: 30% 30% 30%; column-gap: 20px; justify-self: start; text-align: center; } #GeneralForms .discount-tier-grid div { position: relative; } #GeneralForms .new-discount-promotional h2 { margin: 0; } #GeneralForms .current-xp-grid .discount-banner-top { background-color: #0DA98B; margin: 0; } #GeneralForms .current-xp-grid div:last-child { font-style: italic; align-self: center; } #GeneralForms .new-discount-promotional strong { color: #0B6B59; } #GeneralForms .new-discount-promotional .worm, #GeneralForms .new-discount-promotional .pill { font-weight: bold; color: #0B6B59; padding: 10px; border: 5px solid transparent; } #GeneralForms .new-discount-promotional .worm { background-color: #0B6B59; font-weight: normal; color: #FFF; border: 5px solid #0DA98B; border-radius: 20px; } #GeneralForms .new-discount-promotional .pill .arrow { position: absolute; top: 23px; } @media (max-width:800px) { #GeneralForms .discount-tier-grid { column-gap: 10px; } #GeneralForms .new-discount-promotional .worm, #GeneralForms .new-discount-promotional .pill { width: 75%; } #GeneralForms .new-discount-promotional .pill .arrow { right: 41px; top: 18px; } #GeneralForms .new-discount-promotional .pill .small span { display: inline-block; padding: 0; padding-top: 2px; } #GeneralForms .new-discount-promotional .pill .small .arrow { top: 21px; } #GeneralForms .new-discount-promotional .pill .large .arrow { top: 14px; } #GeneralForms .new-discount-promotional .pill span { display: inline-block; padding-left: 5px; } } @media (min-width:992px) { #GeneralForms .new-discount-promotional .worm, #GeneralForms .new-discount-promotional .pill { width: 70%; } #GeneralForms .new-discount-promotional .pill .arrow { right: 73px; } #GeneralForms .new-discount-promotional .pill .small { font-size: 1em; } #GeneralForms .new-discount-promotional .pill .medium { font-size: 1.25em; } #GeneralForms .new-discount-promotional .pill .large { font-size: 1.5em; } #GeneralForms .new-discount-promotional .pill .medium .arrow, #GeneralForms .new-discount-promotional .pill .large .arrow { font-size: 1.5em; } #GeneralForms .new-discount-promotional .pill .small span { display: inline-block; padding: 0; padding-top: 4px; } #GeneralForms .new-discount-promotional .pill .small .arrow { top: 25px; } #GeneralForms .new-discount-promotional .pill span { display: inline-block; padding-left: 9px; } } @media (min-width:1200px) { #GeneralForms .new-discount-promotional .worm, #GeneralForms .new-discount-promotional .pill { width: 70%; } #GeneralForms .new-discount-promotional .pill .arrow { right: 90px; } }