@charset "UTF-8";
/* CSS Document
Client: CAUSETEAM / CauseTeam
Company: Informatics, Inc
Author: Jeff S
Date: Oct 2020
*/

/* GENERAL */
.cause-form {margin-bottom: 2rem;}
.cause-form .col-aside {margin-bottom: -1rem;}
.grid > .text-center, .list-group-table .text-center {margin: 0;}

.pv-0 {padding-top: 0 !important; padding-bottom: 0 !important;}
.top-spacer {margin-top: .75rem;}

/* GRIDS & LAYOUT */
.grid {display: grid; grid-gap: 1rem; align-items: center;}
.grid-1-1 {grid-template-columns: 1fr 1fr;}
.grid-3-1-1-1 {grid-template-columns: 1fr 1fr;}
.grid-1-1 .grid-3-1 {grid-template-columns: 3fr 1fr;}
.hidden-mobile {display: none !important; visibility: hidden !important;}
.hidden-desktop {display: revert !important; visibility: visible !important;}

/* BUTTONS */
.btn-theme {line-height: 1.2;}
.btn-theme.btn-theme-paypal {background-color: #009cde; color: #fff; white-space: nowrap; border-color: #009cde;}
.paypal-button-container {display: inline-block; height: 1rem; overflow: hidden; vertical-align: sub; margin-left: 2px;}
.paypal-button-container img {max-height: 100%;width: auto;max-width: initial;}
button.btn-theme-apple, button.btn-theme-google {display: block;background-color: #000; color: #fff; white-space: nowrap; border-color: #000; margin-bottom: 1.5rem; min-width: 17rem;}
button.btn-theme-apple img, button.btn-theme-google img {max-height:  1.25rem; width: auto; max-width: 3rem; display: inline-block; vertical-align: bottom; margin: 0 0 0 2px;}
.place_order_div .btn-theme {min-width: 18rem;}
.grid-1-1 .btn-theme {width: auto;}
.col-main .checkout_types {max-width: 18rem;}
.btn-block {width: 100%;}

.btn-theme-left.place_order_div {min-width: 45%;}
.hidden-desktop .btn-theme-left.place_order_div {width: 100%;}
.btn-theme-left {float: left;}
.btn-theme-right {float: right;}

.checkout_types .btn-theme {width: 100%;}

/* PROGRESS BAR */
.progress-container {margin: 2rem auto 0; max-width: var(--max-width);}
.progress {height: 1.5rem; border-radius: 100vw; margin-bottom: .75rem; background-color: #fff;}
.progress-bar {line-height: 1.5rem; background-color: var(--primary); box-shadow: none;}
.progress-labels {display: flex; flex-direction: row; justify-content: space-between; align-items: flex-start;}
.progress-labels > p, .progress-meta {font-size: 1rem; margin-bottom: 1rem;}
.progress-meta {margin: 0;}

/* CART ITEM LIST */
.list-group-table .list-group-item {background-color: transparent; border-radius: 0; border-left: 0; border-right: 0; border-top: 1px dotted #ccc; border-bottom: 1px dotted #ccc; padding: 1rem 0;}
.list-group-table .list-group-header, .list-group-table .list-group-action {position: relative; z-index: 5;}
.list-group-table .list-group-detail {display: flex; justify-content: flex-start; align-items: flex-start; line-height: 1.2;}
.list-group-table .list-group-detail small {color: var(--dark);}
.list-group-table .list-group-detail:hover small {color: var(--tertiary);}
.list-group-table .list-group-img {max-height: 4rem;margin: 0 1rem 0 0;}

.list-group-table .list-group-header {background-color: var(--soft-4); border-top: 2px solid #ddd; border-bottom: 2px solid #ddd; padding-left: 15px; padding-right: 15px;}
.list-group-table .list-group-action {padding-top: 1rem; padding-bottom: 1rem; border-bottom: 0;}
.list-group-table .text-center {margin: 0;}

.box {position: relative;}
.box .list-group-table {margin: -1rem 0;}
.box .list-group-table > .list-group-header {border: 0;}

.footer .grid {align-items: flex-start;}
.footer .grid form {width: 95%;}

/* ---------*/
/* MOBILE ONLY */ @media (max-width: 767px) {

/* GRIDS & LAYOUT */
.grid-3-1-1-1 > *:first-child, .grid-3-1-1-1 > .grid-span-1-3, .grid-3-1-1-1 > .grid-span-3-5 {grid-column: 1 / -1;}
.place_order_div .btn-theme {width: 100%;}
/* ---------*/
}
/* MOBILE ONLY END */

/* ---------*/
/* PORTRAIT */ @media (min-width: 768px) {
/* ---------*/

/* GENERAL */
.text-sm-center {text-align: center !important;}

/* GRIDS & LAYOUT */
.grid-3-1 {grid-template-columns: 3fr 1fr;}
.grid-3-1-1-1 {grid-template-columns: 3fr 1fr 1fr 1fr;}
.grid-3-1-1-1 > .grid-offset-1 {grid-column-start: 2;}
.grid-3-1-1-1 > .grid-offset-2 {grid-column-start: 3;}
.grid-3-1-1-1 > .grid-offset-3 {grid-column-start: 4;}
.grid-3-1-1-1 > .grid-span-1-3 {grid-column-start: 1; grid-column-end: 3;}
.grid-3-1-1-1 > .grid-span-3-5 {grid-column-start: 3; grid-column-end: 5;}

.grid-3-1-1-1 > .grid-span-1-4 {grid-column-start: 1; grid-column-end: 4;}
.grid-3-1-1-1 > .grid-span-4-5 {grid-column-start: 4; grid-column-end: 5;}

.grid-3-1-1-1 > .grid-span-1-2 {grid-column-start: 1; grid-column-end: 2;}
.grid-3-1-1-1 > .grid-span-2-3 {grid-column-start: 2; grid-column-end: 3;}
.grid-3-1-1-1 > .grid-span-3-4 {grid-column-start: 3; grid-column-end: 4;}

.grid-2-2-2 {grid-template-columns: 2fr 2fr 2fr;}
/* CART ITEM LIST */
.list-group-table .list-group-item {padding-left: 15px; padding-right: 15px;}
.list-group-table .list-group-collapse {border-top: 2px solid #ddd; padding: 1rem 15px;}
.list-group-table .list-group-action {background-color: var(--soft-4); padding-top: 1rem; border-top: 2px solid #ddd;}
.bkg-soft-2 .list-group-table .list-group-action {background-color: rgba(223, 128, 100, 0.35);}

.grid-1-1 .btn-container {text-align: right;}
}
/* PORTRAIT END */
/* LANDSCAPE */ @media (min-width: 992px) {
/* ----------*/

/* GENERAL */
.cause-form .col-aside {margin-bottom: 0;}

/* GRIDS & LAYOUT */
.grid-4-1 {grid-template-areas: 'main main main aside'; grid-template-columns: 1fr 1fr 1fr 1fr; grid-gap: 3rem; align-items: start;}
.grid-4-1 .col-main {grid-area: main;}
.two-col-aside .col-aside {grid-area: aside;}
/*
.hidden-mobile {display: revert !important; visibility: visible !important;}
SR updates - removed "display: none !important; " so that aside column width looks good. And did not find any other effect of this
.hidden-desktop {visibility: hidden !important;}

Display none needed to remove hidden from flow.
*/
.hidden-mobile {display: revert !important; visibility:visible !important;}
.hidden-desktop {display: none !important; visibility: hidden !important;}

/* CART ITEM LIST */
.box-arrow::after {border-top: 20px solid transparent; border-bottom: 20px solid transparent; border-right: 20px solid var(--soft); position: absolute;  right: 100%;  top: 25px; content: "";}
}
/* LANDSCAPE END */

/* SR updates: To view the borders for fields that have error and select fields selected value is not visible*/
.cause-form input, .cause-form .form-input {
    padding: 6px 12px;
    background: #f9f9f9;
}

.has-error .form-control {
    border: 2px solid #a94442;
}

.print-button { text-align: center; }
.print { display: block; }
.print-display-only { display: none;}
@media print {  .no-print { display: none !important; }  .print,.print-display-only {display: block; }  }
.hide-submit-button { visibility: hidden !important; }

.btn-theme.btn-theme-shiping {background-color: #28a745; color: #fff; border-color:#28a745 ; padding: 20px;}