/*
    The purpose of this file is to provide a place for CSS which is shared accross various areas on the site, 
    such as the main area and franchisee area.
*/


@media screen and (min-width:0px) {
    head ~ body {
        height: 100%;
    }
}

.address .route-code {
    padding-top: 3px;
    display: block;
    position: relative;
    left: -5px;
}

.red, .error, .errorLg {
    color: #ff0000;
}

.bold {
    font-weight: bold;
}

.italic {
    font-style: italic;
}

.nomargin {
    margin: 0 !important;
}

.withmargin {
    margin: 0 0 0 25px !important;
}

.nopadding {
    padding: 0 !important;
}

.noborder {
    border: 0 none !important;
}

.floatlt, .floatleft {
    float: left;
}

.floatrt, .floatright {
    float: right;
}

.center {
    text-align: center;
}

.justify {
    text-align: justify;
}

.right {
    text-align: right;
}

.clearboth {
    clear: both;
}

.clearrt, .clearright {
    clear: right;
}

.clearlt, .clearleft {
    clear: left;
}

.clearer {
    clear: both;
    height: 1px;
    overflow: hidden;
    margin-top: -1px;
}

.hidden {
    display: none;
}

.visible {
    display: block;
}

.inputs input, .inputs button, .inputs select, .inputs span,
.inputs > * {
    vertical-align: top;
}

.inputs.middle > *{
    vertical-align: middle;
}

body #masterWrap .gift_wrap,
body .modal .gift_wrap {
    display: flex;
    align-items: center;
    color: #a1282b;
}

    body #masterWrap .gift_wrap .icon-gift,
    body .modal .gift_wrap .icon-gift {
        font-size: 30px;
    }

        body #masterWrap .gift_wrap .icon-gift:before,
        body .modal .gift_wrap .icon-gift:before {
            margin: 0;
        }

    body #masterWrap .gift_wrap .quantity,
    body .modal .gift_wrap .quantity {
        font-family: var(--main-font-family);
        font-weight: 900;
        font-size: 15px;
        margin-left: 3px;
    }

.icon-user.contact-person:before, .icon-user.contact:before {
    opacity: .3;
}

a.icon-user.contact-person:hover:before,
a[role="button"].icon-user.contact-person:not(.disabled):hover:before {
    opacity: .3;
}
