* {
    padding: 0px;
    margin: 0px;
}

h1 {
    color: #004F5D;
    font-size: 1.8em;
    font-weight: bold;
}

h3 {
    color: #EB641E;
    font-size: 1.4em;
    font-weight: bold;
}

h4 {
    color: black;
    font-size: 1em;
    font-weight: normal;
}

label {
    display: block;
}


.field {
    /*  margin-top: 1em;*/
    margin-bottom: 2em;

    /*	float:left;*/
    white-space: nowrap;
    display: inline-table;
    /*	margin:4px;*/
}

.field_error {
    background-color: #ffddce;
    padding: 1px;
    margin: 1px;

    float: left;
    white-space: nowrap;
}

.field_error_message {
    background: transparent url("../stylesheet/img/error.gif") no-repeat scroll 0 5px;
    font-weight: bold;
    display: block;
    color: black;
    padding: 5px;
    padding-left: 20px;
    white-space: nowrap;
}


.validation_message {
    background-color: #ffd9d3;
    font-weight: bold;
    color: black;
    text-align: center;
    margin: 10px;
    padding-left: 10px;
    padding-right: 10px;
    width: 40%;
}


#container {
    float: none;
    margin-left: 0px;
    margin-bottom: 10px;
    margin-top: 10px;
    margin-right: 15px;
    padding-left: 15px;
    padding-top: 10px;
    border-left: 1px solid #EB641E;
    min-height: 600px;
    height: auto !important;
    height: 600px; /* IE6 hack */
    overflow-x: visible !important;
    overflow-x: hidden;
}

#container h2,
#container h3,
#container h4,
#container h5,
#container h6,
#container p,
#container pre,
#container blockquote,
#container table,
#container ul,
#container ol {
    margin-top: 0 !important;
}

a.inpageLink {
    color: #009999;
}

a:hover.inpageLink {
    color: #EB641E;
}


#internal_container {
    margin-left: 10px;
    margin-top: 10px;
    padding-left: 10px;
    padding-top: 10px;
    width: 80%;
}

.select_section {
    padding-top: 1em;
    padding-bottom: 1em;
}


.dca_purpose_note {
    padding-top: 1em;
    font-style: italic;
}


.calendar_container {
    margin-top: 7px;
    margin-bottom: 7px;
}


.calendar_nav {
    text-align: center;
    float: right;
    padding-bottom: 5px;
    padding-top: 20px;
}

.calendar_nav form {
    display: inline;
}

.calendar_nav form div {
    display: inline;
}


.calendar_nav a {
    height: 17px;
    width: 120px;
    font-size: 14px;
    margin-left: 15px;
    margin-right: 15px;
    padding-top: 2px;
    border: 1px solid #a9a89a;
    color: black;
    background-color: #f5f5f5;
    text-decoration: none;
}

.booking_calendar {
    font-size: 11px;
    border: 1px solid #a9a89a;
    margin-bottom: 10px;
    background-color: white;
    padding-bottom: 15px;
}

.noAvailableSlotsMessage {
    background-color: #EFEFEF;
    bottom: 240px;
    font-size: 20px;
    margin-left: 13%;
    margin-right: 9%;
    padding-bottom: 10px;
    padding-top: 10px;
    padding-left: 5px;
    padding-right: 5px;
    position: relative;
    text-align: center;
}


.calendar_times {
    color: #666666;
    float: left;
    width: 10% !important;
    width: 50px;
    margin: 0;
    padding-top: 1px;
}

.calendar_time {
    border-right: 1px solid black;
    border-top: 1px solid black;
    text-align: right;
    padding-right: 3px;
    white-space: nowrap;
}

.calendar_body {
    float: left;
    width: 90% !important;
    width: auto; /* IE6 Hack */
    margin: 0;
}

.day_header {
    margin: 0;
    height: 14px;
    text-align: center;
    font-weight: bold;
    white-space: nowrap !important;
    white-space: normal; /* IE6 Hack */
}

.day_header p {
    margin: 0;
}


.day {
    float: left;
    width: 19%; /* should be 20%, but ie6 seems to have math problems */
    margin: 0;

    border-bottom: 1px solid black;
}

.day p {
    margin: 0;
}

.slot {

    border-right: 1px solid black;
    border-top: 1px solid black;
    text-align: center;
    background-color: #D9EBED;
}

.slot_bookable {
    color: white;
    background-image: url("../stylesheet/img/slot-shadow.png");
    background-position: bottom left;
    background-repeat: repeat-x;
    background-color: #009999;


}


.slot_bookable .bigText {
    color: white;
    font-size: 9pt;
    font-weight: bold;
    text-decoration: none;
}

.slot_bookable .smallText {
    color: white;
    font-size: 7.5pt;
    font-weight: bold;
    text-decoration: none;
}

.slot_bookable a {
    display: block;
    width: 100%;
}


.slot_bookable a span {
    display: none;
}

.slot_bookable a:hover span {
    display: block;
    color: white;
}

.slot_bookable a:hover {
    background-color: #009bab;
    background-image: none;

}


.slot_taken {
    background-color: #ffb193;
}


.slot label {
    padding-top: 10px;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 10px;
}


.slot input:hover {
    background-color: #C6C4BD;
}

.guide {
    padding-top: 10px;
    float: left;

    padding-bottom: 8px;

    white-space: nowrap;
}

.guide .taken {
    height: 15px;
    width: 15px;
    float: left;

    background-color: #D9EBED;

    margin-right: 5px;
}

.guide .free {
    height: 15px;
    width: 15px;
    float: left;

    background-color: #009999;

    margin-right: 5px;
}


/* booking details */

.field_container {
    background-color: #f6fbf7;
    border: 1px solid #09707B;
    width: 80% !important;
    width: auto;
    min-width: 480px;
    margin: 10px;
    padding: 10px;
}

.field_container p {
    margin-bottom: 10px;
}

.field_container h3 {
    margin-bottom: 10px;
}

.field_container h4 {
    margin-bottom: 10px;
}


.note {
    /*	display: block;*/
    /*float: left;*/
    color: #666;
    font-size: smaller;
    /*	margin-top:-5px;*/


}

.note .asterisk {

}

.headingGroup {
    color: #004F5D;
}



.input_autocomplete {
    width: 430px;
}

.attendees {
    margin-bottom: 2em;
}


.attendees .field {
    /*  margin-top: 0.5em;*/
    margin-bottom: 0.5em;
}

.field_container .attendees input {

    width: 300px;
}

.field_container textarea {
    margin: 1px;
    width: 430px;
}

.label_textarea {
    color: #004F5D;
    font-weight: bold;
    margin-bottom: 4px;
}


.complete_details_label {
    margin-bottom: 0px;
    color: #004F5D;
}


.details_hr1 {
    border-top: 1px solid #09707B;
    /*height:1px;*/
    margin-top: 1em;
    margin-bottom: 1em;
}

#meeting_information {
    border-bottom: 1px solid #09707B;
}

#meeting_details {
    padding-top: 10px;
}

#meeting_details label {
    color: #004F5D;
    width: 28em;
    float: left;
    font-weight: bold;
    margin-bottom: 4px;
}

#meeting_details .attendees label {
    width: 130px;
    margin-bottom: 0;
}

.confirmation_message {
    padding-top: 1em;
    padding-bottom: 1em;
}

.planning_proposals a {
    color: #009999;
}

.planning_proposals a:hover {
    color: #EB641E;

}

.prevweek, .nextweek {
    padding-left: 3px;
    padding-right: 3px;
    margin: 0;
}

#complete_message p {
    padding-top: 14px;
}

#booking\.attachments + p {
    margin-top: 6px;
    font-style: italic;
    font-size: 13px;
    color: #666;
}

#projectPhase label {
    float: none;
    margin-bottom: 4px;
}

#projectPhase .selection label {
    font-weight: normal;
    color: black;
    display: inline;
}

#projectPhase input[type="radio"] {
    margin-right: 4px;
}

    /** Background overlay on form submission **/
.overlay {
    position: fixed;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 79, 93,0.25);
    z-index: 2;
    cursor: wait;
}
/** Spinner that goes with background overlay **/
.spinner {
    position: absolute;
    left: 50%;
    top: 50%;
    height:60px;
    width:60px;
    margin:0px auto;
    -webkit-animation: rotation .6s infinite linear;
    -moz-animation: rotation .6s infinite linear;
    -o-animation: rotation .6s infinite linear;
    animation: rotation .6s infinite linear;
    border-left: 6px solid rgb(255,255,255,.25);
    border-right: 6px solid rgba(255,255,255,.25);
    border-bottom: 6px solid rgba(255,255,255,.25);
    border-top: 6px solid rgb(255,255,255,.8);
    border-radius:100%;
}

@-webkit-keyframes rotation {
    from {-webkit-transform: rotate(0deg);}
    to {-webkit-transform: rotate(359deg);}
}
@-moz-keyframes rotation {
    from {-moz-transform: rotate(0deg);}
    to {-moz-transform: rotate(359deg);}
}
@-o-keyframes rotation {
    from {-o-transform: rotate(0deg);}
    to {-o-transform: rotate(359deg);}
}
@keyframes rotation {
    from {transform: rotate(0deg);}
    to {transform: rotate(359deg);}
}