body {
    padding-top: 50px;
    padding-bottom: 20px;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

.survey-section-data-row {
	float: left;
	font-size: 48px;
	font-weight: bold;
	text-decoration: underline;
}
.survey-question-option-radio-inline {
	display: flex;
	margin-left: 0.5em;
}
.survey-question-option-radio-inline-label {
	display: flex;
	position: relative;
	margin-left: 0.2em;
	_top: 0.2em;
}

.survey-question-option-data-row {
    margin-left: 20px;
}

    .survey-question-option-data-row input[type=radio].css-checkbox {
        position: absolute;
        z-index: -1000;
        left: -1000px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        height: 1px;
        width: 1px;
        margin: -1px;
        padding: 0;
        border: 0;
    }

        .survey-question-option-data-row input[type=radio].css-checkbox + label.css-label {
            padding-left: 34px;
            height: 21px;
            display: inline-block;
            line-height: 22px;
            background-repeat: no-repeat;
            background-position: 0 0;
            font-size: .9em;
            vertical-align: middle;
            cursor: pointer;
            font-weight: normal;
        }

        .survey-question-option-data-row input[type=radio].css-checkbox:checked + label.css-label {
            background-position: 0 -22px;
            font-weight: bold;
        }

    .survey-question-option-data-row label.css-label {
        background-image: url(/content/images/check.png);
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .survey-question-option-data-row .container {
        margin-left: 40px;
    }

.survey-question-data-row {
    margin-top: 20px;
}

    .survey-question-data-row .validation-error {
        padding-top: 10px;
        color: #C44A66;
    }

    .survey-question-data-row .survey-question {
        padding-bottom: 10px;
    }

        .survey-question-data-row .survey-question .text {
            font-size: 1em;
            font-weight: bold;
            margin-bottom: 10px;
        }

    .survey-question-data-row .nps-comment {
        padding-bottom: 10px;
        font-weight: bold;
    }

    .survey-question-data-row .nps-score-container {
    }

        .nps-score-bad {
            float: left;
            width: 40px;
            text-align: center;
            background-color: #E31C3D;
            border: 1px solid #771122;
            color: #fff;
            border-radius: 4px;
            padding: 5px;
            margin-right: 6px;
            margin-bottom: 6px;
            cursor: pointer;
        }
        .nps-score-bad:hover {
            background-color: #771122;
        }
        .nps-score-bad-selected {
            background-color: #E31C3D;
            font-weight: bold;
            border: 1px solid #771122;
            color: #fff;
            -webkit-box-shadow: 0 0 20px #771122;
            -moz-box-shadow: 0 0 20px #771122;
            box-shadow: 0 0 20px #771122;
        }
        .nps-score-bad-selected:hover {
            background-color: #771122;
            font-weight: bold;
            border: 1px solid #771122;
            color: #fff;
            -webkit-box-shadow: 0 0 20px #771122;
            -moz-box-shadow: 0 0 20px #771122;
            box-shadow: 0 0 20px #771122;
        }

        .nps-score-good {
            float: left;
            width: 40px;
            text-align: center;
            background-color: #FF9900;
            border: 1px solid #9A5D00;
            color: #fff;
            border-radius: 4px;
            padding: 5px;
            margin-right: 6px;
            margin-bottom: 6px;
            cursor: pointer;
        }
        .nps-score-good:hover {
            background-color: #9A5D00;
        }
        .nps-score-good-selected {
            background-color: #FF9900;
            font-weight: bold;
            border: 1px solid #9A5D00;
            color: #fff !important;
            -webkit-box-shadow: 0 0 20px #9A5D00;
            -moz-box-shadow: 0 0 20px #9A5D00;
            box-shadow: 0 0 20px #9A5D00;
        }
        .nps-score-good-selected:hover {
            background-color: #9A5D00;
            font-weight: bold;
            border: 1px solid #9A5D00;
            color: #fff !important;
            -webkit-box-shadow: 0 0 20px #9A5D00;
            -moz-box-shadow: 0 0 20px #9A5D00;
            box-shadow: 0 0 20px #9A5D00;
        }

        .nps-score-excellent {
            float: left;
            width: 40px;
            text-align: center;
            background-color: #259F33;
            border: 1px solid #176721;
            color: #fff;
            border-radius: 4px;
            padding: 5px;
            margin-right: 6px;
            margin-bottom: 6px;
            cursor: pointer;
        }
        .nps-score-excellent:hover {
            background-color: #176721;
        }
        .nps-score-excellent-selected {
            background-color: #259F33;
            font-weight: bold;
            border: 1px solid #176721;
            color: #fff;
            -webkit-box-shadow: 0 0 20px #176721;
            -moz-box-shadow: 0 0 20px #176721;
            box-shadow: 0 0 20px #176721;
        }
        .nps-score-excellent-selected:hover {
            background-color: #176721;
            font-weight: bold;
            border: 1px solid #176721;
            color: #fff;
            -webkit-box-shadow: 0 0 20px #176721;
            -moz-box-shadow: 0 0 20px #176721;
            box-shadow: 0 0 20px #176721;
        }

    .survey-question-data-row .nps-footer {
        max-width: 530px;
        font-size: .8em;
    }

        .survey-question-data-row .nps-footer .not-likely {
            padding-left: 4px;
        }

        .survey-question-data-row .nps-footer .extremely-likely {
            padding-right: 4px;
        }

    .last {
        padding-top: 0px;
        padding-bottom: 0px;
        margin-top: 0px;
        margin-bottom: 0px;
    }

.survey-data .progress-bar-success {
    background-color: #224d87;
}

.header {
    position: fixed;
    width: 100%;
    background-color: #fafafa;
    z-index: 100;
    left: 0;
}

.footer {
    position: fixed;
    left: 0px;
    bottom: 0px;
    width: 100%;
    border-top: 1px solid #d2d2d2;
    height: 62px;
    background-color: #fff;
}

.survey-data .comments-text {
    font-size: 1em;
    font-weight: bold;
}

.survey-data .comments-control {
    width: 60%;
    height: 140px;
    min-width: 300px;
}

.survey-data .btn-primary {
    background-color: #224D87;
}

.survey-data textarea {
    max-width: 100%;
}

.survey-data .back-button {
    margin-top: 14px;
    margin-left: 20px;
}

.survey-data .next-button {
    margin-top: 14px;
    margin-left: 20px;
}

.survey-question-progressbar {
    margin-left: 40px;
    margin-right: 40px;
    margin-bottom: 0px;
}

.survey-not-available {
    font-size: 1em;
    font-weight: bold;
}

.survey-data .btn-primary.back-button {
    background-color: #ccc;
    color: #000;
    border-color: #a7a7a7;
    margin-top: 14px;
    margin-right: 10px;
}

.survey-data .btn-primary:focus.back-button {
    background-color: #ccc;
    border-color: #a7a7a7;
}

.survey-data .btn-primary:hover.back-button {
    background-color: #ccc;
    border-color: #a7a7a7;
}

.survey-data .btn-primary:active.back-button {
    background-color: #ccc;
    border-color: #a7a7a7;
}

.survey-data .goodbye-message {
    font-size: 18pt;
    text-align: center;
    padding-top: 150px;
}

.survey-data .redirect-message {
    font-size: 10pt;
    text-align: center;
    padding-top: 30px;
}

.survey-data .nps-trademark {
    margin-top: 40px;
    font-size: 8pt;
}

.survey-greeting {
    margin-top: 60px;
}

.progress-notstarted {
    color: #284d85;
    padding: 10px;
}

#frown {
    font-size: 20px;
    padding-left: 1.5em;
}

#smiley {
    font-size: 20px;
    padding-right: 1.75em;
}

#nps-score-1-row table td {
    width: 3.5em;
}
#nps-score-1-row table tr {
    text-align: center;
}

@media (min-width: 545px) {
    #nps-score-1-row {
        display: block;
    }
    #nps-score-2-rows {
        display: none;
    }
}

@media (max-width: 544px) {
    #nps-score-1-row {
        display: none;
    }
    #nps-score-2-rows {
        display: block;
    }
}


@media (min-width: 0px) {
    .header {
        height: 40px;
    }

    .survey-greeting {
        font-size: 16px;
    }

    .survey-data {
        margin-top: 110px;
    }

    .survey-question-progressbar {
        margin-top: 8px;
    }
}

@media (max-width: 768px) {
    .nps-score-container {
        width: 100%;
    }
}

@media (min-width: 768px) {
    .header {
        top:0;
        height: 180px;
    }

    .survey-greeting {
        font-size: 16pt;
    }

    .survey-data {
        margin-top: 150px;
    }

    .survey-question-progressbar {
        margin-top: 150px;
    }
}

@media (min-height: 740px) {
    .footer {
        position: relative;
        left: 0px;
        bottom: 0px;
        width: 100%;
        border-top: none !important;
        height: 62px;
        background-color: #fafafa !important;
    }
}
@media (max-height: 739px) {
    .primary {
        padding-bottom: 100px;
    }
}

body {
    padding: 0;
    background-color: #fafafa;
}

a:hover {
    text-decoration: none;
    cursor: pointer;
}

* {
    font-family: Tahoma;
}

    *:focus {
        outline: 0;
    }

.nav > li > a:hover {
    background: none;
}

.main-content {
    float: left;
    width: 100%;
    height:100%;
}

.shell {
    position: absolute;
    width: 100%;
    height: 100%;
}

.container {
    width: 100%;
    padding-left: 40px;
    padding-right: 40px;
}

#splash-page {
    z-index: 99999 !important;
}

    #splash-page .bar {
        width: 100%;
    }

.page-splash {
    z-index: 99999 !important;
    position: fixed !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #333;
    opacity: .9;
    pointer-events: auto;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: opacity 0.3s linear;
    -moz-transition: opacity 0.3s linear;
    -o-transition: opacity 0.3s linear;
    transition: opacity 0.3s linear;
}

.page-splash-message {
    text-align: center;
    margin: 20% auto 0 auto;
    font-family: "Segoe UI", Arial, Helvetica, sans-serif;
    font-weight: normal;
    -webkit-text-shadow: 2px 2px #000000;
    text-shadow: 2px 2px #000000;
    text-shadow: 2px 2px rgba(0, 0, 0, 0.15);
    text-transform: uppercase;
    text-decoration: none;
    color: #0083be;
    padding: 0;
}

    .page-splash-message.page-splash-message-subtle {
        margin: 30% auto 0 auto;
        font-size: 200%;
    }

.overlay-message {
    font-size: 200%;
}

.centerfix {
    text-align: center;
    display: block;
}

.fa {
    color: #224D87;
}

    .fa:hover {
        color: #387C2B;
    }

button {
    background: transparent;
    border: none;
}

.header-white-bar {
    position: relative;
    background: #fff;
    width: 75%;
    height: 140px;
}

    .header-white-bar:after {
        content: '';
        display: block;
        position: absolute;
        left: 100%;
        top: 0;
        width: 0;
        height: 0;
        border-bottom: 140px solid transparent;
        border-left: 160px solid #fff;
    }


.header-white-bar-border {
    position: absolute;
    background: #d6d6d6;
    width: 75%;
    height: 140px;
    top: 1px;
}

    .header-white-bar-border:after {
        content: '';
        display: block;
        position: absolute;
        left: 100%;
        top: 0;
        width: 0;
        height: 0;
        border-bottom: 140px solid transparent;
        border-left: 160px solid #d6d6d6;
    }

.header-blue-bar {
    position: absolute;
    background: #224d87;
    width: 40%;
    height: 55px;
    top: 40px;
    left: 45%;
}

    .header-blue-bar:after {
        content: '';
        display: block;
        position: absolute;
        left: 100%;
        top: 0;
        width: 0;
        height: 0;
        border-bottom: 55px solid transparent;
        border-left: 85px solid #224d87;
    }


    .header-blue-bar:before {
        content: '';
        display: block;
        position: absolute;
        left: -85px;
        top: 0;
        width: 0;
        height: 0;
        border-top: 55px solid transparent;
        border-right: 85px solid #224d87;
    }


/*.header-blue-bar-border {
    position: absolute;
    background: #122A47;
    width: 40%;
    height: 55px;
    top: 41px;
    left: 45%;
}

    .header-blue-bar-border:after {
        content: '';
        display: block;
        position: absolute;
        left: 100%;
        top: 0;
        width: 0;
        height: 0;
        border-bottom: 55px solid transparent;
        border-left: 85px solid #122A47;
    }


    .header-blue-bar-border:before {
        content: '';
        display: block;
        position: absolute;
        left: -85px;
        top: 0;
        width: 0;
        height: 0;
        border-top: 55px solid transparent;
        border-right: 85px solid #122A47;
    }*/


.navlinks a {
    color: #fff;
    font-size: 18px;
}

ul.navbar-nav li {
    padding-left: 10px;
    padding-right: 10px;
}

    ul.navbar-nav li a {
        color: #fff;
        padding-left: 5px;
        padding-right: 5px;
        font-size: 18px;
    }

        ul.navbar-nav li a:hover {
            color: #fff;
        }

        ul.navbar-nav li a.current {
            color: #fff;
            border-bottom: 6px solid #fff;
            padding-bottom: 14px;
        }

.current a {
    color: #FFF;
    background: #7BD72B;
    border: 1px solid #7BD72B;
    text-decoration: none;
}

.greeting {
    height: 100%;
    padding-top: 13px;
    font-size: 18px;
    text-align: center;
    color: #fff;
    margin-top: 0;
    margin-bottom: 0;
    margin-right: 10px;
}

.interior-logo {
    width: 100%;
}

.nv-logo {
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    padding-bottom: 50px;
    width: 100%;
    max-width: 325px;
}

.nv-logo-loading {
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    padding-bottom: 50px;
    width: 100%;
    max-width: 360px;
}

.mobile-header {
    background-color: #fff;
}

    .mobile-header .mobile-greeting {
        background-color: #224D87;
        color: #fff;
        height: 30px;
        width: 100%;
    }

        .mobile-header .mobile-greeting .name {
            padding-top: 4px;
            padding-left: 10px;
        }

@media (min-width: 0px) {
    .page-splash-message {
        font-size: 2em;
    }

    .header-white-bar {
        display: none;
    }

    .header-white-bar-border {
        display: none;
    }

    .header-blue-bar {
        display: none;
    }

    .header-blue-bar-border {
        display: none;
    }

    .greeting {
        display: none;
    }

    .mobile-header {
        display: block;
    }

    .interior-logo {
        max-width: 260px;
    }
}

@media (min-width: 768px) {
    .page-splash-message {
        font-size: 400%;
    }

    .header-white-bar {
        display: inline-block;
    }

    .header-white-bar-border {
        display: inline-block;
    }

    .header-blue-bar {
        display: inline-block;
    }

    .header-blue-bar-border {
        display: inline-block;
    }

    .greeting {
        display: block;
    }

    .mobile-header {
        display: none;
    }

    .interior-logo {
        max-width: 325px;
    }
}
body {
}
