.ui-dialog.modalAjaxContentDialog {
    padding: 0;
    z-index: 500;
    margin-top: 100px;
}

.ui-corner-all.modalAjaxContentDialog 
{
    -moz-border-radius-topleft: 0; -webkit-border-top-left-radius: 0; -khtml-border-top-left-radius: 0; border-top-left-radius: 0;
    -moz-border-radius-topright: 0; -webkit-border-top-right-radius: 0; -khtml-border-top-right-radius: 0; border-top-right-radius: 0;
    -moz-border-radius-bottomleft: 0; -webkit-border-bottom-left-radius: 0; -khtml-border-bottom-left-radius: 0; border-bottom-left-radius: 0;
    -moz-border-radius-bottomright: 0; -webkit-border-bottom-right-radius: 0; -khtml-border-bottom-right-radius: 0; border-bottom-right-radius: 0;
}

.ui-widget.modalAjaxContentDialog {
    font-size: inherit;
}

.ui-widget-content.modalAjaxContentDialog {
    border: solid 2px white;
    font-family: inherit;
    min-height: 0 !important;
}

.ui-dialog.modalAjaxContentDialog .ui-dialog-titlebar {
    display: none;
}

.ui-dialog.modalAjaxContentDialog .ui-dialog-content {
    border: 0;
    padding: 0;
}

.modalAjaxContentDialog .headerDiv
{
    height: 49px;
    background-image: url(../../Images/Weather/forecast_dialog_header_bg.png?1);
    line-height: 49px;
    color: white;
    text-align: center;
    font-size: 16px;
}

.modalAjaxContentDialog .buttonarea {
    padding: 0;
    margin: 0;
}

.ui-widget-overlay {
    background-color: black;
    filter: alpha(opacity=30);
    opacity: 0.6;
    background-position: 120% 120%;
}

.modalAjaxContentDialog .loadingDiv {
    text-align: center;
    font-size: 16px;
    font-weight: bold;
}

.modalAjaxContentDialog .loadingDiv .loadingIndicatorImg {
    display: inline-block;
    background-image: url(../../Images/Icons/icon_activity_indicator_animation.gif);
    width: 67px;
    height: 67px;
}

.modalAjaxContentDialog .content {
    background-color: #F5F5F5;
    padding: 5px;
}

/*********** edit schedule period modal dialog ***********/

.modalAjaxContentDialog .headerDiv {
    height: 55px;
    background-image: url(../../Images/Schedule/edit_scheduled_period_dialog_header_bg.png?1);
    line-height: 55px;
    color: white;
    text-align: center;
    font-size: 18px;
    font-weight: bold;
}

.modalAjaxContentDialog .headerDiv img 
{
    position: relative;
    top: -2px;
    left: -15px;
}

.modalAjaxContentDialog.editScheduledPeriod .contentDiv,
.modalAjaxContentDialog.editScheduledPeriod .headerDiv,
.modalAjaxContentDialog.editScheduledPeriod .loadingDiv {
    width: 666px;
}

.modalAjaxContentDialog.editScheduledPeriod .headerDiv img
{
    display: inline-block; vertical-align: middle; padding-right: 5px;
}

.modalAjaxContentDialog.editScheduledPeriod .inputarea {
    background-color: #F5F5F5;
    
    /* this is to stop collapsing of margin for first and last fieldset */
    padding-top: 1px;
    margin-top: -1px;
    padding-bottom: 1px;
    margin-bottom: -1px;
}

.modalAjaxContentDialog.editScheduledPeriod fieldset {
    margin: 5px;
    padding: 15px 8px 15px 15px;   
}

.modalAjaxContentDialog.editScheduledPeriod fieldset .question,
.modalAjaxContentDialog.editScheduledPeriod fieldset .inputControls
{
    float: left;
    height: 80px;
}

.modalAjaxContentDialog.editScheduledPeriod fieldset .question {
    line-height: 80px;
    width: 214px;
    padding-right: 15px;
}

.modalAjaxContentDialog.editScheduledPeriod fieldset .question span
{
    display: inline-block;
    vertical-align: middle;
    line-height: 1.2;
    font-size: 14px;
}

.modalAjaxContentDialog.editScheduledPeriod fieldset .inputControls {
    width: 400px;
    background-color: #F5F5F5;
    text-align: center;
    line-height: 80px;
    position: relative;
}

.modalAjaxContentDialog.editScheduledPeriod fieldset .inputControls.startTime span.timeSpanEditor {
    position: relative;
    left: -18px;
}

.modalAjaxContentDialog.editScheduledPeriod fieldset .inputControls .setpointWrapper {
    line-height: 1.2;
    display: inline;
    position: relative;
    left: -5px;
}

.modalAjaxContentDialog.editScheduledPeriod fieldset .inputControls input,
.modalAjaxContentDialog.editScheduledPeriod fieldset .inputControls select {
    display: none;
}

.modalAjaxContentDialog.editScheduledPeriod fieldset .inputControls .button {
    font-weight: bold;
    text-transform: uppercase;
}

.modalAjaxContentDialog.editScheduledPeriod fieldset .inputControls .button span.left {
    min-width: 74px;
    text-align: center;
}

.modalAjaxContentDialog.editScheduledPeriod .buttonarea #toggleCancelPeriodBtn {
    float: left;
}

.modalAjaxContentDialog.editScheduledPeriod .buttonarea {
    padding: 13px 10px 10px 10px;
    width: 646px;
}

.modalAjaxContentDialog.editScheduledPeriod .buttonarea .button span.left,
.modalAjaxContentDialog.editScheduledPeriod .buttonarea .button input {
    min-width: 88px;
}

.modalAjaxContentDialog.editScheduledPeriod .buttonarea #toggleCancelPeriodBtn span.left {
    min-width: 120px;
    padding-right: 20px;
}

.modalAjaxContentDialog.editScheduledPeriod .buttonarea #toggleCancelPeriodBtn span.right {
    
}

.modalAjaxContentDialog.editScheduledPeriod .timeSpanEditor .value {
    width: 125px;
    font-size: 26px;
    font-weight: bold;
}

.modalAjaxContentDialog.editScheduledPeriod .timeSpanEditor .buttonInc,
.modalAjaxContentDialog.editScheduledPeriod .timeSpanEditor .buttonDec
{    
    width: 76px;
    background-image: url(../../Images/Schedule/timespan_editor_buttons_lg.png?1);
}

.modalAjaxContentDialog.editScheduledPeriod .setpointEditor .buttonInc,
.modalAjaxContentDialog.editScheduledPeriod .setpointEditor .buttonDec
{
    display: block;
    cursor: pointer;
    
    width: 68px;
        
    background-image: url(../../Images/Schedule/setpoint_editor_heat_buttons_lg.png?1);
}

.modalAjaxContentDialog.editScheduledPeriod .setpointEditor.cool .buttonInc,
.modalAjaxContentDialog.editScheduledPeriod .setpointEditor.cool .buttonDec {
    background-image: url(../../Images/Schedule/setpoint_editor_cool_buttons_lg.png?1);
}

.modalAjaxContentDialog.editScheduledPeriod .setpointEditor .labelWithValue {
    margin-right: 5px;
    margin-left: 15px;
}

.modalAjaxContentDialog.editScheduledPeriod .setpointEditor label {
    font-size: 11px;
    text-align: center;
}

.modalAjaxContentDialog.editScheduledPeriod .setpointEditor .value {
    font-size: 27px;
    min-width: 63px;
}

/*********** edit schedule confirmation dialog ***********/

.modalAjaxContentDialog.confirmEditScheduleDialog ._gray-bordered-box {
    background-color: white;
    padding: 5px;
    text-align: center;
    padding-bottom: 30px;
}

.modalAjaxContentDialog.confirmEditScheduleDialog .buttonarea {
    width: 100%;
}

.modalAjaxContentDialog.confirmEditScheduleDialog .buttonarea .button {
    float: right;
    margin-right: 10px;
    margin-top: 5px;
}

.modalAjaxContentDialog.confirmEditScheduleDialog h4
{
    font-size: 16px;
    font-weight: bold;
    text-align: center;
}

.modalAjaxContentDialog.confirmEditScheduleDialog ._gray-bordered-box .button span.left {
    min-width: 68px;
}

.modalAjaxContentDialog.confirmEditScheduleDialog .buttonarea .button span.left {
    min-width: 88px;
}

.modalAjaxContentDialog.confirmEditScheduleDialog .contentDiv,
.modalAjaxContentDialog.confirmEditScheduleDialog .headerDiv,
.modalAjaxContentDialog.confirmEditScheduleDialog .loadingDiv {
    width: 400px;
}