html {
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

body {
    padding: 0px;
    padding-top: 40px;
    margin: 0px;
    background-color: #eee;
    color: black;
    background-image:url('../images/background.jpg');
    background-size: 1920px 1080px;
}

.body-responsive {
    padding: 0px;
    margin: 0px;
    background-color: #eee;
    color: black;
}

footer {
    padding: 10px;
}

#mainPageWrapper {
    width: 614px;
    min-height: 570px;
    margin: 0 auto;
    /*border: 2px solid #888888; bbb*/
    border: 2px solid #bbbbbb;
    background-color: #eee;
    -webkit-box-shadow: 4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    box-shadow:         4px 4px 5px 0px rgba(50, 50, 50, 0.75);
}

#mainPageWrapper-responsive {
    max-width: 614px;
    min-height: 570px;
    margin: 0 auto;
    border: 2px solid #bbbbbb;
    background-color: #eee;
    -webkit-box-shadow: 4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    box-shadow:         4px 4px 5px 0px rgba(50, 50, 50, 0.75);
}

.mainBodyContent {
    padding: 10px;
}

.steps {
    font-size: 18px;
    text-align: center;
    /*border-top: 2px solid #bbbbbb;*/
    border-bottom: 2px solid #bbbbbb;
    padding-top: 10px;
    padding-bottom: 10px;
}

.extras {
    font-size: 18px;
    text-align: center;
    border-bottom: 2px solid #bbbbbb;
    padding-top: 10px;
    padding-bottom: 10px;
}


.step1form {
    padding: 10px;
}

.inputRow {
    width: 100%;
    padding: 20px;

    background: #eeeeee; /* Old browsers */
    background: -moz-linear-gradient(top,  #eeeeee 0%, #d1d1d1 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#d1d1d1)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #eeeeee 0%,#d1d1d1 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #eeeeee 0%,#d1d1d1 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #eeeeee 0%,#d1d1d1 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #eeeeee 0%,#d1d1d1 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#d1d1d1',GradientType=0 ); /* IE6-9 */

}

.inputRow-responsive {

    padding: 20px;

    background: #eeeeee; /* Old browsers */
    background: -moz-linear-gradient(top,  #eeeeee 0%, #d1d1d1 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#d1d1d1)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #eeeeee 0%,#d1d1d1 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #eeeeee 0%,#d1d1d1 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #eeeeee 0%,#d1d1d1 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #eeeeee 0%,#d1d1d1 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#d1d1d1',GradientType=0 ); /* IE6-9 */

}

.inputLabel {
    display: inline-block;
    width: 48%;
    text-align: center;
    font-weight: bold;
}

.inputLabel-responsive {
    text-align: center;
    font-weight: bold;
}

.inputData {
    display: inline-block;
    width: 48%;
    text-align: center;
}

.inputData-responsive {
    text-align: center;
}

#raceDatePicker {
    line-height: normal !important;
}

.formButton {
    background: #cd2128;
    color: white;
    font-size: 20px;
}

.formButton-responsive {
    background: #cd2128;
    color: white;
    font-size: 20px;
}

@media (max-width: 600px) {
    .formButton-responsive {
        font-size: 18px;
    }

}

@media (max-width: 380px) {
    .formButton-responsive {
        font-size: 14px;
    }
}


.formButton:hover {
    color: white;
}

.formButtonDisabled {
    background: #bbbbbb; /* Old browsers */
    color: white;
    font-size: 20px;
}

.rightAligned {
    text-align: right;
}

.regularButton {
    background: #cd2128; /* Old browsers */
    color: white;
    font-size: 20px;
    width: 32%;
}

.regularButton-responsive {
    background: #cd2128; /* Old browsers */
    color: white;
    font-size: 20px;
    width: 32%;
    vertical-align: top;
}

@media (max-width: 600px) {
    .regularButton-responsive {
        font-size: 18px;
        height: 81px;
    }
}

@media (max-width: 380px) {
    .regularButton-responsive {
        font-size: 14px;
        height: 66px;
    }
}

.ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
}

.raceName {
    font-size: 20px;
    vertical-align: middle;
    font-weight: bold;
    padding-left: 0px;
}

.raceDate {
    font-size: 20px;
    display: inline-block;
    vertical-align: middle;
    font-weight: bold;
    padding-right: 0px;
}

.quantityText {
    font-size: 20px;
    font-weight: bold;
}

.noRaceResults {
    border: 1px solid #696969;
    padding: 10px;
    -webkit-box-shadow: 4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    box-shadow:         4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    margin-top: 10px !important;
    font-size: 20px;
}

.noGiftCardResults {
    border: 1px solid #696969;
    padding: 10px;
    -webkit-box-shadow: 4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    box-shadow:         4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    margin-top: 10px !important;
    font-size: 20px;
}

.raceResult {
    border: 1px solid #696969;
    padding: 10px;
    -webkit-box-shadow: 4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    box-shadow:         4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    margin-top: 10px;
}

.loginOptions {
    border: 1px solid #696969;
    padding: 10px;
    -webkit-box-shadow: 4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    box-shadow:         4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    margin-top: 10px;
}

.createAccount {
    border: 1px solid #696969;
    padding: 10px;
    -webkit-box-shadow: 4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    box-shadow:         4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    margin-top: 10px;
    text-align: left;
}

.loginToAccount {
    border: 1px solid #696969;
    padding: 10px;
    -webkit-box-shadow: 4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    box-shadow:         4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    margin-top: 10px;
    text-align: left;
}

.checkoutForm {
    border: 1px solid #696969;
    padding: 10px;
    -webkit-box-shadow: 4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    box-shadow:         4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    margin-top: 10px;
    text-align: left;
}

.contentBox {
    border: 1px solid #696969;
    padding: 10px;
    -webkit-box-shadow: 4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    -moz-box-shadow:    4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    box-shadow:         4px 4px 5px 0px rgba(50, 50, 50, 0.75);
    margin-top: 10px;
    text-align: left;
}

.formHeader {
    font-size: 20px;
    font-style: italic;
    margin-top: 10px;
    margin-bottom: 10px;
}
.raceResultHeader {
    margin: 0 auto;
}

.spotsAvailable {
    font-style: italic;
}

.raceResultFooter {
    margin: 0 auto;
}

.racePrices {
    font-size: 16px;
    vertical-align: middle;
    font-weight: bold;
    padding-left: 0px;
}


.raceBookButtonArea {
    vertical-align: middle;
    padding-right: 0px;
}
.bookingError {
    width: 80%;
    margin: 0 auto;
    margin-top: 10px;
}

.accountError {
    width: 80%;
    margin: 0 auto;
}

.centered {
    margin: 0 auto;
    text-align: center;
}

label {
    width: 240px;
    font-size: 16px;
}

.createAccount input[type=text] {
    width: 100%;
    max-width: 300px;
}

.createAccount input[type=password] {
    width: 100%;
    max-width: 300px;
}

.checkoutForm input[type=text] {
    width: 100%;
    max-width: 300px;
}

.checkoutForm input[type=password] {
    width: 100%;
    max-width: 300px;
}

@media (max-width: 630px) {
    .checkoutForm input[type=text] {
        width: 100%;
        max-width: 700px;
    }

    .checkoutForm input[type=password] {
        width: 100%;
        max-width: 700px;
    }
}

.loginToAccount input {
    width: 100%;
    max-width: 300px;
}

.mainBodyHeader {
    font-size: 28px;
    text-align: center;
}

.yesterdayArrow {
    font-size: 16px;
    height: 41px;
    line-height: 41px;
    vertical-align: text-bottom;
}

.tomorrowArrow {
    font-size: 16px;
    height: 41px;
    line-height: 41px;
    vertical-align: text-bottom;
}

.mainBodyHeader-responsive {
    font-size: 24px;
    text-align: center;
}
.yesterdayArrow-responsive {
    font-size: 16px;
    height: 41px;
    line-height: 41px;
    vertical-align: text-bottom;
}
.tomorrowArrow-responsive {
    font-size: 16px;
    height: 41px;
    line-height: 41px;
    vertical-align: text-bottom;
}

@media (max-width: 600px) {
    .mainBodyHeader-responsive {
        font-size: 18px;
        text-align: center;
    }
    .yesterdayArrow-responsive {
        font-size: 14px;
        vertical-align: text-bottom;
    }
    .tomorrowArrow-responsive {
        font-size: 14px;
        vertical-align: text-bottom;
    }
    .availableRacesSection {
        padding-top: 7px;
    }
}

@media (max-width: 380px) {
    .mainBodyHeader-responsive {
        font-size: 18px;
        text-align: center;
    }
    .yesterdayArrow-responsive {
        font-size: 11px;
        vertical-align: text-bottom;
    }
    .tomorrowArrow-responsive {
        font-size: 11px;
        vertical-align: text-bottom;
    }
    .availableRacesSection {
        padding-top: 0px;
    }
}


::-webkit-input-placeholder {
    text-align: center;
}
:-moz-placeholder { /* older Firefox*/
    text-align: center;
}
::-moz-placeholder { /* Firefox 19+ */
    text-align: center;
}
:-ms-input-placeholder {
    text-align: center;
}


/* Live Validation styles TODO: Some are pending deletion */

.requiredAsterisk {
    color: red;
}

.LV_validation_message{
    font-weight:bold;
}

.LV_valid {
    color:#00CC00;
}

.LV_invalid {
    color:#CC0000;
    margin-left: 245px;
    margin-bottom: 8px;
    display: inline-block;
}

.LV_valid_field,
input.LV_valid_field:hover,
input.LV_valid_field:active,
textarea.LV_valid_field:hover,
textarea.LV_valid_field:active {
    border: 1px solid #00CC00;
}

.LV_invalid_field,
input.LV_invalid_field:hover,
input.LV_invalid_field:active,
textarea.LV_invalid_field:hover,
textarea.LV_invalid_field:active {
    border: 1px solid #CC0000;
}

th {text-align: center}

/* jQuery.validation styles */

.formError {
    font-size: 12px;
    color: red;
}

/*
    LOADING SPINNER
*/
.spinner {
    margin: 0 auto;
    width: 100px;
    height: 60px;
    text-align: center;
    font-size: 20px;
}

.spinner > div {
    background-color: #333;
    height: 100%;
    width: 6px;
    display: inline-block;

    -webkit-animation: stretchdelay 1.2s infinite ease-in-out;
    animation: stretchdelay 1.2s infinite ease-in-out;
}

.spinner .rect2 {
    -webkit-animation-delay: -1.1s;
    animation-delay: -1.1s;
}

.spinner .rect3 {
    -webkit-animation-delay: -1.0s;
    animation-delay: -1.0s;
}

.spinner .rect4 {
    -webkit-animation-delay: -0.9s;
    animation-delay: -0.9s;
}

.spinner .rect5 {
    -webkit-animation-delay: -0.8s;
    animation-delay: -0.8s;
}

@-webkit-keyframes stretchdelay {
    0%, 40%, 100% { -webkit-transform: scaleY(0.4) }
    20% { -webkit-transform: scaleY(1.0) }
}

@keyframes stretchdelay {
    0%, 40%, 100% {
        transform: scaleY(0.4);
        -webkit-transform: scaleY(0.4);
    }  20% {
           transform: scaleY(1.0);
           -webkit-transform: scaleY(1.0);
       }
}

#loading{
    position: absolute;
    left: 50%;
    margin-left: -145px;
    height: 500px;
    top: 50%;
    margin-top: -125px;
}

.ui-datepicker-year {
    color: black;
}

#loggedInAs {
    margin-top: 10px;
    text-align: center;
}

.smallerFormInput {
    width: 50px !important;
}

.monthInput {
    width: 30px !important;
}

.loadingModal {
    z-index: 9999;
}

.loadingModalInner {
    background-color: black; color: white; border: 2px solid white;
}

.loadingModalHeader {
    border-color: black;
}

.loadingModalImage {
    max-width: 100%; text-align: center;
}

.redRectangle {
    background-color: red !important;
}

.redirectHeader {
    margin-top: 30px; font-size: 20px;
}

.emailConsent {
    float: right; margin-bottom: 5px;
}

.inputMarginAdjustment {
    margin-left: 75px !important;
}

.inputGenderMarginAdjustment {
    margin-left: 66px !important;
}

.inputLineHeightAdjustment {
    line-height: normal !important;
}

.languageDropdownContainer {
    width: 614px;
    margin: 0 auto;
}

.languageDropdownContainer-responsive {
    width: 100%;
    max-width: 614px;
    margin: 0 auto;
}

.languageDropdown {
    z-index: 1049; text-align: right;
    padding-left: 430px;
}

.languageDropdown-responsive {
    z-index: 1049; text-align: right;
}

.dropdown dd, .dropdown dt, .dropdown ul { margin:0px; padding:0px; }
.dropdown dd { position:relative; }
.dropdown a, .dropdown a:visited { color:#816c5b; text-decoration:none; outline:none;}
.dropdown a:hover { color:#5d4617;}
.dropdown dt a:hover { color:#5d4617; border: 1px solid #d0c9af;}
.dropdown dt a {background:#e4dfcb url("../images/flags/arrow.png") no-repeat scroll right center; display:block; padding-right:20px;
    border:1px solid #d4ca9a; width:180px;}
.dropdown dt a span {cursor:pointer; display:block; padding:5px;}
.dropdown dd ul { background:#e4dfcb none repeat scroll 0 0; border:1px solid #d4ca9a; color:#C5C0B0; display:none;
    left:0px; padding:5px 0px; position:absolute; top:2px; width:auto; min-width:180px; max-width: 180px; list-style:none;}
.dropdown span.value { display:none;}
.dropdown dd ul li a { padding:5px; display:block;}
.dropdown dd ul li a:hover { background-color:#d0c9af;}
img.flag { border:none; vertical-align:baseline; margin-left:10px;}

.currentCultureString {
    display: inline-block;
}

/* Fix for URLs being visible when printing a page */
@media print {
    a[href]:after {
        content: "" !important;
    }
}