﻿#content .outerContainer {
    background-color: #FFFFFF!important;
}
#orderContents {
    margin: auto;
}
.chkDontForget {
    margin-top: 7px;
    margin-left: 10px;
    background-color: #ACACACAC;
    height: 15px;
    width: 15px;
}
.lblDontForget {
    margin-left: 5px;
    margin-top: 5px;
    margin-right: 25px;
    font-size: var(--primaryHeaderFontSize);
    font-weight: var(--darkenedFontWeight);
}
#attendeesCt {
    text-align: center;
    font-weight: var(--darkenedFontWeight);
    font-size: var(--subHeaderFontSize);
}
#mainSpinner {
    position: absolute;
    width: 150px;
    height: 135px;
    opacity: 0.5;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 999;
}

/* Order Contents */
#orderContents .col {
    float: left
}

#orderContents .col1 {
    width: 47px;
}

#orderContents .col2 {
    width: 265px;
    padding-right: 10px
}

#orderContents .col2short {
    width: 175px;
    padding-right: 10px
}

#orderContents .col2a {
    width: 475px;
    padding-right: 3px;
}

#orderContents .col2a img {
    vertical-align: bottom;
    margin-left: 5px;
}

#orderContents .col3 {
    width: 46px;
}

#orderContents .col4 {
    width: 48px;
    text-align: right
}

#orderContents .col5 {
    width: 75px;
    text-align: right;
    float: right
}

#orderContents .col6 {
    width: 38px;
    text-align: center;
    float: left;
}

/* Remove this to get Calories to display */
#orderContents #calorieHeader, #orderContents .calories {
    display: none;
}

#orderContents .itemRow {
    padding: 5px 0;
    border-bottom: #817567 1px solid;
}

#orderContents .subtotalRow {
    color: #000 !important
}

#orderContents .updateQtyBtn {
    width: 162px;
    display: block;
    margin-left: 0 !important;
}

#orderContents .orderPanel_totalWithoutDisc {
    color: #7F7361;
    margin-right: 8px;
    text-decoration: line-through
}

.cateringAssistant .mainLabel {
    font-size: var(--primaryHeaderFontSize);
    font-weight: var(--boldFontWeight);
}

.cateringAssistant .labelTile {
    display: flex;
    flex: 35%;
    font-size: var(--primaryHeaderFontSize);
    font-weight: var(--darkenedFontWeight);
    align-items: center;
    justify-content: center;
}

.cateringAssistant .labelTile .labelTileText {
    width: 230px;
    text-align: center;
}

.cateringAssistant .accordion {
    overflow: hidden;
    transition: height 1s ease;
    height: 30px;
}

.accordion.open {
    height: 270px;
}

.accordion.open.short {
    height: 170px;
}

.accordion.open.preferences {
    height: 100px;
}

.cateringAssistant .accordionHeader {
    height: 20px;
    border: 0;
    border-top: 1px solid var(--lightGray);
    padding: 0;
    width: 818px;
}

.cateringAssistant .accordionLabel {
    position: absolute;
    text-align: center;
    margin-top: -12px;
    width: 818px;
}

.cateringAssistant .accordionLabelText {
    z-index: 1;
    padding-left: 10px;
    padding-right: 10px;
    background-color: white;
    font-size: var(--primaryHeaderFontSize);
    font-weight: 500;
    display: inline;
    cursor: pointer;
}

.cateringAssistant .accordionButton {
    position: absolute;
    left: 910px;
    margin-top: -35px;
}

.cateringAssistant .accordion.open .accordianButton img {
    transform: scaleY(-1);
}

.cateringAssistant .accordionButton:hover {
    cursor: pointer;
}

.cateringAssistant .accordionContents {
    margin-bottom: 20px;
}

.cateringAssistant .question-tile {
    flex: 50%;
    height: 200px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    margin: 0 3px;
}

.cateringAssistant .question-tile.tile-wide {
    /*flex: 100%;*/
    align-items: center;
}

.cateringAssistant .accordion.short .question-tile {
    height: 100px;
}

.cateringAssistant .answerTilesGroup {
    flex: 65%;
    align-items: center;
}

.cateringAssistant .question-tile label {
    margin-bottom: 10px;
    width: 90%;
    text-align: center;
}

.cateringAssistant .header-banner-image {
    background-image: url("https://images.specialtys.com/cateringassistant/CaterignAssistantHeader.png");
    background-size: cover;
    background-repeat: no-repeat;
    height: 100px;
    margin-bottom: 20px;
}

.cateringAssistant .breakfast-tile {
    background-image: url("https://images.specialtys.com/cateringassistant/breakfast.png");
    background-size: cover;
}

.cateringAssistant .lunch-tile {
    background-image: url("https://images.specialtys.com/cateringassistant/lunch.jpg");
    background-size: cover;
}

.cateringAssistant .snack-tile {
    background-image: url("https://images.specialtys.com/cateringassistant/snack.png");
    background-size: cover;
}

.cateringAssistant .lunch-box-tile {
    background-image: url("https://images.specialtys.com/cateringassistant/lunch-box.png");
    background-size: cover;
}

.cateringAssistant .lunch-platter-tile {
    background-image: url("https://images.specialtys.com/cateringassistant/lunch-buffet.png");
    background-size: cover;
}

.cateringAssistant .breakfast-box-tile {
    background-image: url("https://images.specialtys.com/cateringassistant/breakfast-box.png");
    background-size: cover;
}

.cateringAssistant .breakfast-platter-tile {
    background-image: url("https://images.specialtys.com/cateringassistant/breakfast-buffet.png");
    background-size: cover;
}

.cateringAssistant .dontForgetSection {
    display: flex;
    background: var(--offWhite);
    padding: 10px;
}

.cateringAssistant .dontForgetOptions {
    flex: 20%;
    text-align: center;
}

.cateringAssistant .actionsSection {
    display: flex;
    align-items: flex-end;
}

.cateringAssistant .actionItem {
    flex: 20%;
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: center;
}

.cateringAssistant #divGioLink.actionItem {
    flex: 15%;
}

.cateringAssistant .mainContent {
    padding: 0px 70px 0px 70px;
}

.modal .swapProduct {
    padding: 5px;
    border-top: 1px solid #A0A0A0;
    cursor: pointer;
}

.modal .swapProduct img {
    vertical-align: bottom;
    margin-left: 5px;
}

.modal .swapProduct:first-of-type {
    border-top: 3px solid black;
}

.modal .swapProduct:last-of-type {
    border-bottom: 3px solid black;
}

.modal #modalProductList {
    max-height: 70vh;
    overflow-y: auto;
}