/*
    Document   : default-theme
    Created on : Apr 3, 2014, 10:33:06 AM
    Author     : kbores
*/

root {
    display: block;
}

/** Calendar Styles **/
/* normal school pink */
.schoolStyle {
    font-size:10px;
    background-color:#FA8072;
    border: 1px solid #004D99;
}

.schoolStyleHeader {
    font-size:10px; color: white;
    background-color:#B22222;
}

.schoolStyleBody {
    font-size: 10px;
    background-color: #FA8072;
    padding: 3px;
}

.schoolStyleResizer{
    border-top:1px solid white;
    border-bottom: 1px solid white;
}

/* holiday purple */
.holidayStyle {
    font-size:10px;
    background-color:#B365D4;
    border: 1px solid #4E026E;
}

.holidayStyleHeader {
    font-size:10px; color: white;
    background-color:#790BAA;
}

.holidayStyleBody {
    font-size: 10px;
    background-color: #B365D4;
    padding: 3px;
}

.holidayStyleResizer{
    border-top:1px solid white;
    border-bottom: 1px solid white;
}

/* assignment orange */
.assignmentStyle {
    font-size:10px;
    background-color:#F1D1AD;
    border: 1px solid #4E026E;
}

.assignmentStyleHeader {
    font-size:10px; color: white;
    background-color:#D66321;
}

.assignmentStyleBody {
    font-size: 10px;
    background-color: #F1D1AD;
    padding: 3px;
}

.assignmentStyleResizer{
    border-top:1px solid white;
    border-bottom: 1px solid white;
}

/* lesson blue */
.lessonStyle {
    font-size:10px;
    background-color:#70A9EF;
    border: 1px solid #4E026E;
}

.lessonStyleHeader {
    font-size:10px; color: white;
    background-color:#3152A5;
}

.lessonStyleBody {
    font-size: 10px;
    background-color: #70A9EF;
    padding: 3px;
}

.lessonStyleResizer{
    border-top:1px solid white;
    border-bottom: 1px solid white;
}

.tooltips {
    position: relative;
    display: inline;
}
.tooltips span {
    position: absolute;
    color: #FFFFFF;
    background: #726E6D;
    border: 1px solid #000000;
    line-height: 26px;
    text-align: center;
    border-radius: 8px;
}
.tooltips span:before {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -8px;
    width: 0; height: 0;
    border-right: 8px solid transparent;
    border-left: 8px solid transparent;
}
.tooltips span:after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -8px;
    width: 0; height: 0;
    border-right: 8px solid transparent;
    border-left: 8px solid transparent;
}
.tooltips span:hover {
    visibility: visible;
    opacity: 0.1;
    left: 50%;
    margin-left: -76px;
    z-index: 999;
}

.normal {
    font-size: 17px;
}

.largerfont {
    font-size:20px;
}

.textitem,
.textitemDisabled {
    font-family:Lucidia Grande,Bitstream Vera Sans,sans-serif; font-size:17px;
    padding: 5px;
    padding-left: 10px;
    color: #333333;
}

.textitemHint,
.textitemDisabledHint {
    font-family:Lucidia Grande,Bitstream Vera Sans,sans-serif; font-size:17px;
    padding: 5px;
    padding-left: 10px;
    color: #979797;
}

.textitemRequired {
    font-family:Lucidia Grande,Bitstream Vera Sans,sans-serif; font-size:17px;
    padding: 5px;
    padding-left: 10px;
    content: "*";
    color: #ABCABC;
}

.textitemRequiredHint {
    font-family:Lucidia Grande,Bitstream Vera Sans,sans-serif; font-size:17px;
    padding: 5px;
    padding-left: 10px;
    content: "*";
    color: #ABCABC;
}


.loginstyle {
    font-family:Lucidia Grande,Bitstream Vera Sans,sans-serif; font-size:10px;
    padding: 5px;
    color: #ffffff;
}

.logintext {
    font-family:Lucidia Grande,Bitstream Vera Sans,sans-serif; font-size:14px;
    /*padding: 5px;*/
    color: #000000;
}

.passwordstyle {
    font-family:Lucidia Grande,Bitstream Vera Sans,sans-serif; font-size:12px;
    padding: 5px;
    color: #000000;
}

.uiPickListCell,
.uiPickListCellRTL,
.uiPickListCellOver,
.uiPickListCellOverRTL,
.uiPickListCellSelected,
.uiPickListCellSelectedRTL,
.uiPickListCellSelectedOver,
.uiPickListCellSelectedOverRTL,
.uiPickListCellDisabled,
.uiPickListCellDisabledRTL,
.uiPickListCellDark,
.uiPickListCellDarkRTL,
.uiPickListCellOverDark,
.uiPickListCellOverDarkRTL,
.uiPickListCellSelectedDark,
.uiPickListCellSelectedDarkRTL,
.uiPickListCellSelectedOverDark,
.uiPickListCellSelectedOverDarkRTL,
.uiPickListCellDisabledDark,
.uiPickListCellDisabledDarkRTL,
.uiPickListCellPending,
.uiPickListCellPendingRTL,
.uiPickListCellPendingOver,
.uiPickListCellPendingOverRTL,
.uiPickListCellPendingSelected,
.uiPickListCellPendingSelectedRTL,
.uiPickListCellPendingSelectedOver,
.uiPickListCellPendingSelectedOverRTL,
.uiPickListCellPendingDisabled,
.uiPickListCellPendingDisabledRTL,
.uiPickListCellPendingDark,
.uiPickListCellPendingDarkRTL,
.uiPickListCellPendingOverDark,
.uiPickListCellPendingOverDarkRTL,
.uiPickListCellPendingSelectedDark,
.uiPickListCellPendingSelectedDarkRTL,
.uiPickListCellPendingSelectedOverDark,
.uiPickListCellPendingSelectedOverDarkRTL,
.uiPickListCellPendingDisabledDark,
.uiPickListCellPendingDisabledDarkRTL,
.uiPickListCellDeselected,
.uiPickListCellDeselectedRTL,
.uiPickListCellDeselectedOver,
.uiPickListCellDeselectedOverRTL,
.uiPickListCellDeselectedSelected,
.uiPickListCellDeselectedSelectedRTL,
.uiPickListCellDeselectedSelectedOver,
.uiPickListCellDeselectedSelectedOverRTL,
.uiPickListCellDeselectedDisabled,
.uiPickListCellDeselectedDisabledRTL,
.uiPickListCellDeselectedDark,
.uiPickListCellDeselectedDarkRTL,
.uiPickListCellDeselectedOverDark,
.uiPickListCellDeselectedOverDarkRTL,
.uiPickListCellDeselectedSelectedDark,
.uiPickListCellDeselectedSelectedDarkRTL,
.uiPickListCellDeselectedSelectedOverDark,
.uiPickListCellDeselectedSelectedOverDarkRTL,
.uiPickListCellDeselectedDisabledDark,
.uiPickListCellDeselectedDisabledDarkRTL{
    font-family:Lucidia Grande,Bitstream Vera Sans,sans-serif; font-size:17px;
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    color: #333333;
    height: 30px;
}

.uiSelectItem,
.uiSelectItemControl,
.uiSelectItemControlOver,
.uiSelectItemControlRTL,
.uiSelectItemControlFocused,
.uiSelectItemControlFocusedRTL,
.uiSelectItemControlDisabled,
.uiSelectItemControlDisabledRTL,
.uiSelectItemControlError,
.uiSelectItemControlErrorRTL,
.uiSelectItemControlPending,
.uiSelectItemControlPendingRTL,
.uiSelectItemControlPendingFocused,
.uiSelectItemControlPendingFocusedRTL,
.uiSelectItemControlPendingDisabled,
.uiSelectItemControlPendingDisabledRTL,
.uiSelectItemControlPendingError,
.uiSelectItemControlPendingErrorRTL,
.uiSelectItemOver,
.uiSelectItemRTL,
.uiSelectItemFocused,
.uiSelectItemFocusedOver,
.uiSelectItemFocusedRTL,
.uiSelectItemError,
.uiSelectItemErrorRTL,
.uiSelectItemPending,
.uiSelectItemPendingRTL,
.uiSelectItemPendingFocused,
.uiSelectItemPendingFocusedRTL,
.uiSelectItemPendingDisabled,
.uiSelectItemPendingDisabledRTL,
.uiSelectItemPendingError,
.uiSelectItemPendingErrorRTL{
    font-family:Lucidia Grande,Bitstream Vera Sans,sans-serif; font-size:17px;
    padding: 5px;
    padding-left: 10px;
    color: #333333;
    height: 22px !important;

    /*-webkit-appearance: textfield;*/
    background-color: white;
    border-style: solid;
    border-color: lightgray;
    border-width: 1px;
}

.uiSelectItemHint,
.uiSelectItemHintOver,
.uiSelectItemHintRTL,
.uiSelectItemDisabled,
.uiSelectItemDisabledRTL,
.uiSelectItemDisabledHint,
.uiSelectItemDisabledHintRTL {
    font-family:Lucidia Grande,Bitstream Vera Sans,sans-serif; font-size:17px;
    padding: 5px;
    padding-left: 10px;
    color: #979797;
    height: 22px !important;

    /*-webkit-appearance: textfield;*/
    background-color: white;
    border-style: solid;
    border-color: lightgray;
    border-width: 1px;
}

.uiSelectItemCell,
.uiSelectItemCellDisabled{
    border: none;
    padding: 5px;
    padding-left: 10px;
}

.grayText {
    color:#666666;
    font-family:Verdana,Bitstream Vera Sans,sans-serif;
    font-size:15px;
}

.whiteText {
    color:#ffffff;
    font-size:30px;
    font-family:Verdana,Bitstream Vera Sans,sans-serif;
}

.phoneWhiteText {
    color:#ffffff;
    font-size:16px;
    font-family:Verdana,Bitstream Vera Sans,sans-serif;
}

/*.header {
    color:black;
    font-family:Arial,Bitstream Vera Sans,sans-serif;
    font-size:20px;
}*/


.login {
    font-family:Verdana,Bitstream Vera Sans,sans-serif; font-size:16px;
}

.title {
    font-family:Lucidia Grande,B3itstream Vera Sans,sans-serif; font-size:30px;
    color: #2e3133;
}

.demoTitle {
    font-family:Lucidia Grande,B3itstream Vera Sans,sans-serif;
    font-size:30px;
    color: #ffffff;
}

.demoHeader {
    font-family:Lucidia Grande,Bitstream Vera Sans,sans-serif;
    font-size:18px;
    /*text-shadow:2px 2px 4px #c0c0c0;*/
    color: #ffffff;
}

.subtitle {
    font-family:Lucidia Grande,B3itstream Vera Sans,sans-serif; font-size:20px;
    font-weight:bold;
    color: #666666;
}

.texttitle {
    font-family:Lucidia Grande,B3itstream Vera Sans,sans-serif; font-size:20px;
    color: #666666;
}

.titleCanvas {
    alignment-adjust: middle;
    vertical-align: middle;

}

.header {
    font-family:Lucidia Grande,Bitstream Vera Sans,sans-serif; font-size:20px;
    /*text-shadow:2px 2px 4px #c0c0c0;*/
    color: #2e3133;
}

.subheader {
    font-family:Lucidia Grande,Bitstream Vera Sans,sans-serif; font-size:16px;
    color: #0061a7;
    font-weight:bold;
}

.formsubheader {
    font-family:Lucidia Grande,Bitstream Vera Sans,sans-serif; font-size:15px;
    color: #1a9fff;
}

.description {
    font-family:Lucidia Grande,Bitstream Vera Sans,sans-serif; font-size:16px;
    color: darkgray;
}

.finished {
    background-color: #e6fee6;
}

.inprocess {
    background-color: #99ddff;
}

.mainBorder {
    -moz-box-shadow:inset 0px 0px 0px 0px #ffffff;
    -webkit-box-shadow:inset 0px 0px 0px 0px #ffffff;
    box-shadow:inset 0px 0px 0px 0px #ffffff;
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #f6f6f6));
    background:-moz-linear-gradient(top, #395791 5%, #4D6999 100%);
    background:-webkit-linear-gradient(top, #395791 5%, #4D6999 100%);
    background:-o-linear-gradient(top, #395791 5%, #4D6999 100%);
    background:-ms-linear-gradient(top, #395791 5%, #4D6999 100%);
    background:linear-gradient(to bottom, #395791 5%, #4D6999 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#395791', endColorstr='#4D6999',GradientType=0);
    background-color:#4D6999;
    border:1px solid #dcdcdc;
    display:inline-block;
    color:#ffffff;
    font-family:Arial;
    font-size:15px;
    font-weight:bold;
    padding:6px 24px;
    text-decoration:none;
    text-shadow:0px 0px 0px #ffffff;
}

.signUpButton {
    -moz-box-shadow:inset 0px 1px 0px 0px #54a3f7;
    -webkit-box-shadow:inset 0px 1px 0px 0px #54a3f7;
    box-shadow:inset 0px 1px 0px 0px #54a3f7;
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #007dc1), color-stop(1, #0061a7));
    background:-moz-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:-webkit-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:-o-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:-ms-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:linear-gradient(to bottom, #007dc1 5%, #0061a7 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#007dc1', endColorstr='#0061a7',GradientType=0);
    background-color:#007dc1;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    border:1px solid #124d77;
    display:inline-block;
    cursor:pointer;
    color:#ffffff;
    font-family:Arial;
    font-size:20px;
    font-weight: bold;
    padding:6px 24px;
    text-decoration:none;
    text-shadow:0px 1px 0px #154682;
}
.signUpButton:hover {
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #0061a7), color-stop(1, #007dc1));
    background:-moz-linear-gradient(top, #0061a7 5%, #007dc1 100%);
    background:-webkit-linear-gradient(top, #0061a7 5%, #007dc1 100%);
    background:-o-linear-gradient(top, #0061a7 5%, #007dc1 100%);
    background:-ms-linear-gradient(top, #0061a7 5%, #007dc1 100%);
    background:linear-gradient(to bottom, #0061a7 5%, #007dc1 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0061a7', endColorstr='#007dc1',GradientType=0);
    background-color:#0061a7;
}
.signUpButton:active {
    position:relative;
    top:1px;
}

.pickerStyle,
.pickerStyleFocused,
.pickerStyleOver:hover {
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #e9e9e9), color-stop(1, #f9f9f9));
    background:-moz-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
    background:-webkit-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
    background:-o-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
    background:-ms-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
    background:linear-gradient(to bottom, #e9e9e9 5%, #f9f9f9 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e9e9e9', endColorstr='#f9f9f9',GradientType=0);
    background-color:#e9e9e9;
    border:1px solid #dcdcdc;
}
.pickerStyleDisabled{
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f9f9f9), color-stop(1, #e9e9e9));
    background:-moz-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
    background:-webkit-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
    background:-o-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
    background:-ms-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
    background:linear-gradient(to bottom, #f9f9f9 5%, #e9e9e9 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e9e9e9',GradientType=0);
    background-color:#f9f9f9;
    border:1px solid #dcdcdc;
    display:inline-block;
    cursor:pointer;
    color:#666666;
    font-family:Arial;
    font-size:15px;
    font-weight:bold;
    padding:0px 0px;
    text-decoration:none;
}

.blueButton {
    -moz-box-shadow:inset 0px 1px 0px 0px #54a3f7;
    -webkit-box-shadow:inset 0px 1px 0px 0px #54a3f7;
    box-shadow:inset 0px 1px 0px 0px #54a3f7;
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #007dc1), color-stop(1, #0061a7));
    background:-moz-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:-webkit-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:-o-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:-ms-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:linear-gradient(to bottom, #007dc1 5%, #0061a7 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#007dc1', endColorstr='#0061a7',GradientType=0);
    background-color:#007dc1;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    border:1px solid #124d77;
    display:inline-block;
    cursor:pointer;
    color:#ffffff;
    font-family:Arial;
    font-size:15px;
    padding:10px 24px;
    text-decoration:none;
    text-shadow:0px 1px 0px #154682;
}
.blueButton:hover {
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #0061a7), color-stop(1, #007dc1));
    background:-moz-linear-gradient(top, #0061a7 5%, #007dc1 100%);
    background:-webkit-linear-gradient(top, #0061a7 5%, #007dc1 100%);
    background:-o-linear-gradient(top, #0061a7 5%, #007dc1 100%);
    background:-ms-linear-gradient(top, #0061a7 5%, #007dc1 100%);
    background:linear-gradient(to bottom, #0061a7 5%, #007dc1 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0061a7', endColorstr='#007dc1',GradientType=0);
    background-color:#0061a7;
}
.blueButton:active {
    position:relative;
    top:1px;
}

.uploadButton {
    -moz-box-shadow:inset 0px 1px 0px 0px #54a3f7;
    -webkit-box-shadow:inset 0px 1px 0px 0px #54a3f7;
    box-shadow:inset 0px 1px 0px 0px #54a3f7;
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #007dc1), color-stop(1, #0061a7));
    background:-moz-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:-webkit-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:-o-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:-ms-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:linear-gradient(to bottom, #007dc1 5%, #0061a7 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#007dc1', endColorstr='#0061a7',GradientType=0);
    background-color:#007dc1;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    border:1px solid #124d77;
    display:inline-block;
    cursor:pointer;
    color:#ffffff;
    font-family:Arial;
    font-size:15px;
    /*padding:10px 24px;*/
    text-decoration:none;
    text-shadow:0px 1px 0px #154682;
}
.uploadButton:hover {
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #0061a7), color-stop(1, #007dc1));
    background:-moz-linear-gradient(top, #0061a7 5%, #007dc1 100%);
    background:-webkit-linear-gradient(top, #0061a7 5%, #007dc1 100%);
    background:-o-linear-gradient(top, #0061a7 5%, #007dc1 100%);
    background:-ms-linear-gradient(top, #0061a7 5%, #007dc1 100%);
    background:linear-gradient(to bottom, #0061a7 5%, #007dc1 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0061a7', endColorstr='#007dc1',GradientType=0);
    background-color:#0061a7;
}
.uploadButton:active {
    position:relative;
    top:1px;
}

.loginButton {
    -moz-box-shadow:inset 0px 1px 0px 0px #54a3f7;
    -webkit-box-shadow:inset 0px 1px 0px 0px #54a3f7;
    box-shadow:inset 0px 1px 0px 0px #54a3f7;
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #007dc1), color-stop(1, #0061a7));
    background:-moz-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:-webkit-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:-o-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:-ms-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:linear-gradient(to bottom, #007dc1 5%, #0061a7 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#007dc1', endColorstr='#0061a7',GradientType=0);
    background-color:#007dc1;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    border:1px solid #124d77;
    display:inline-block;
    cursor:pointer;
    color:#ffffff;
    font-family:Arial;
    font-size:15px;
    padding: 13px 24px;
    vertical-align: bottom;
    /*padding:10px 24px;*/
    text-decoration:none;
    text-shadow:0px 1px 0px #154682;
}
.loginButton:hover {
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #0061a7), color-stop(1, #007dc1));
    background:-moz-linear-gradient(top, #0061a7 5%, #007dc1 100%);
    background:-webkit-linear-gradient(top, #0061a7 5%, #007dc1 100%);
    background:-o-linear-gradient(top, #0061a7 5%, #007dc1 100%);
    background:-ms-linear-gradient(top, #0061a7 5%, #007dc1 100%);
    background:linear-gradient(to bottom, #0061a7 5%, #007dc1 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0061a7', endColorstr='#007dc1',GradientType=0);
    background-color:#0061a7;
}
.loginButton:active {
    position:relative;
    top:1px;
}

.inProcessButton {
    -moz-box-shadow:inset 0px 1px 0px 0px #dcecfb;
    -webkit-box-shadow:inset 0px 1px 0px 0px #dcecfb;
    box-shadow:inset 0px 1px 0px 0px #dcecfb;
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #bddbfa), color-stop(1, #80b5ea));
    background:-moz-linear-gradient(top, #bddbfa 5%, #80b5ea 100%);
    background:-webkit-linear-gradient(top, #bddbfa 5%, #80b5ea 100%);
    background:-o-linear-gradient(top, #bddbfa 5%, #80b5ea 100%);
    background:-ms-linear-gradient(top, #bddbfa 5%, #80b5ea 100%);
    background:linear-gradient(to bottom, #bddbfa 5%, #80b5ea 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#bddbfa', endColorstr='#80b5ea',GradientType=0);
    background-color:#bddbfa;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    border-radius:6px;
    border:1px solid #84bbf3;
    display:inline-block;
    cursor:pointer;
    color:#ffffff;
    font-family:Arial;
    font-size:10px;
    font-weight:bold;
    text-decoration:none;
    text-shadow:0px 1px 0px #528ecc;
    padding:10px 24px;
    height: 30px;
}
.inProcessButton:hover {
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #80b5ea), color-stop(1, #bddbfa));
    background:-moz-linear-gradient(top, #80b5ea 5%, #bddbfa 100%);
    background:-webkit-linear-gradient(top, #80b5ea 5%, #bddbfa 100%);
    background:-o-linear-gradient(top, #80b5ea 5%, #bddbfa 100%);
    background:-ms-linear-gradient(top, #80b5ea 5%, #bddbfa 100%);
    background:linear-gradient(to bottom, #80b5ea 5%, #bddbfa 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#80b5ea', endColorstr='#bddbfa',GradientType=0);
    background-color:#80b5ea;
}
.inProcessButton:active {
    position:relative;
    top:1px;
}

.finishedButton {
    -moz-box-shadow:inset 0px 1px 0px 0px #d9fbbe;
    -webkit-box-shadow:inset 0px 1px 0px 0px #d9fbbe;
    box-shadow:inset 0px 1px 0px 0px #d9fbbe;
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #b8e356), color-stop(1, #a5cc52));
    background:-moz-linear-gradient(top, #b8e356 5%, #a5cc52 100%);
    background:-webkit-linear-gradient(top, #b8e356 5%, #a5cc52 100%);
    background:-o-linear-gradient(top, #b8e356 5%, #a5cc52 100%);
    background:-ms-linear-gradient(top, #b8e356 5%, #a5cc52 100%);
    background:linear-gradient(to bottom, #b8e356 5%, #a5cc52 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b8e356', endColorstr='#a5cc52',GradientType=0);
    background-color:#b8e356;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    border-radius:6px;
    border:1px solid #83c41a;
    display:inline-block;
    cursor:pointer;
    color:#ffffff;
    font-family:Arial;
    font-size:10px;
    font-weight:bold;
    text-decoration:none;
    text-shadow:0px 1px 0px #86ae47;
    padding:10px 24px;
    height: 30px;
}
.finishedButton:hover {
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #a5cc52), color-stop(1, #b8e356));
    background:-moz-linear-gradient(top, #a5cc52 5%, #b8e356 100%);
    background:-webkit-linear-gradient(top, #a5cc52 5%, #b8e356 100%);
    background:-o-linear-gradient(top, #a5cc52 5%, #b8e356 100%);
    background:-ms-linear-gradient(top, #a5cc52 5%, #b8e356 100%);
    background:linear-gradient(to bottom, #a5cc52 5%, #b8e356 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#a5cc52', endColorstr='#b8e356',GradientType=0);
    background-color:#a5cc52;
}
.finishedButton:active {
    position:relative;
    top:1px;
}

.incompleteButton {
    -moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
    -webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
    box-shadow:inset 0px 1px 0px 0px #ffffff;
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf));
    background:-moz-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
    background:-webkit-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
    background:-o-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
    background:-ms-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
    background:linear-gradient(to bottom, #ededed 5%, #dfdfdf 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf',GradientType=0);
    background-color:#ededed;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    border-radius:6px;
    border:1px solid #dcdcdc;
    display:inline-block;
    cursor:pointer;
    color:#777777;
    font-family:Arial;
    font-size:10px;
    font-weight:bold;
    text-decoration:none;
    text-shadow:0px 1px 0px #ffffff;
    padding:10px 24px;
    height: 30px;
}
.incompleteButton:hover {
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed));
    background:-moz-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
    background:-webkit-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
    background:-o-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
    background:-ms-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
    background:linear-gradient(to bottom, #dfdfdf 5%, #ededed 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed',GradientType=0);
    background-color:#dfdfdf;
}
.incompleteButton:active {
    position:relative;
    top:1px;
}

/*.breadcrumb {
    font-family:Arial;
    font-size:12px;
    height: 15px;
    text-align: center;
}*/


.greenButton {
    -moz-box-shadow:inset 0px 1px 0px 0px #2ac200;
    -webkit-box-shadow:inset 0px 1px 0px 0px #2ac200;
    box-shadow:inset 0px 1px 0px 0px #2ac200;
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #009628), color-stop(1, #42bd00));
    background:-moz-linear-gradient(top, #009628 5%, #42bd00 100%);
    background:-webkit-linear-gradient(top, #009628 5%, #42bd00 100%);
    background:-o-linear-gradient(top, #009628 5%, #42bd00 100%);
    background:-ms-linear-gradient(top, #009628 5%, #42bd00 100%);
    background:linear-gradient(to bottom, #009628 5%, #42bd00 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#009628', endColorstr='#42bd00',GradientType=0);
    background-color:#009628;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    border:1px solid #00a310;
    display:inline-block;
    cursor:pointer;
    color:#ffffff;
    font-family:Arial;
    font-size:15px;
    font-weight:bold;
    padding:10px 24px;
    text-decoration:none;
    text-shadow:0px 1px 0px #2f6627;
}
.greenButton:hover {
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #42bd00), color-stop(1, #009628));
    background:-moz-linear-gradient(top, #42bd00 5%, #009628 100%);
    background:-webkit-linear-gradient(top, #42bd00 5%, #009628 100%);
    background:-o-linear-gradient(top, #42bd00 5%, #009628 100%);
    background:-ms-linear-gradient(top, #42bd00 5%, #009628 100%);
    background:linear-gradient(to bottom, #42bd00 5%, #009628 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#42bd00', endColorstr='#009628',GradientType=0);
    background-color:#42bd00;
}
.greenButton:active {
    position:relative;
    top:1px;
}




.breadcrumb {
    -moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
    -webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
    box-shadow:inset 0px 1px 0px 0px #ffffff;
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #f6f6f6));
    background:-moz-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
    background:-webkit-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
    background:-o-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
    background:-ms-linear-gradient(top, #ffffff 5%, #f6f6f6 100%);
    background:linear-gradient(to bottom, #ffffff 5%, #f6f6f6 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0);
    background-color:#ffffff;
    -moz-border-radius:0px;
    -webkit-border-radius:0px;
    border-radius:0px;
    border:1px solid #dcdcdc;
    vertical-align: middle;
    display:inline-block;
    cursor:pointer;
    color:#666666;
    font-family:Arial;
    font-size:12px;
    padding:5px 20px;
    text-decoration:none;
    text-shadow:0px 1px 0px #ffffff;
    height: 30px;
    text-align: center;

}




.breadcrumbactive {
    -moz-box-shadow:inset 0px 1px 0px 0px #54a3f7;
    -webkit-box-shadow:inset 0px 1px 0px 0px #54a3f7;
    box-shadow:inset 0px 1px 0px 0px #54a3f7;
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #007dc1), color-stop(1, #0061a7));
    background:-moz-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:-webkit-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:-o-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:-ms-linear-gradient(top, #007dc1 5%, #0061a7 100%);
    background:linear-gradient(to bottom, #007dc1 5%, #0061a7 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#007dc1', endColorstr='#0061a7',GradientType=0);
    background-color:#007dc1;
    -moz-border-radius:0px;
    -webkit-border-radius:0px;
    border-radius:0px;
    border:1px solid #124d77;
    display:inline-block;
    cursor:pointer;
    color:#ffffff;
    font-family:Arial;
    font-size:12px;
    padding:5px 20px;
    text-decoration:none;
    text-shadow:0px 1px 0px #154682;
    height: 30px;
    text-align: center;
}

.breadcrumbfinished {
    -moz-box-shadow:inset 0px 1px 0px 0px #2ac200;
    -webkit-box-shadow:inset 0px 1px 0px 0px #2ac200;
    box-shadow:inset 0px 1px 0px 0px #2ac200;
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #009628), color-stop(1, #42bd00));
    background:-moz-linear-gradient(top, #009628 5%, #42bd00 100%);
    background:-webkit-linear-gradient(top, #009628 5%, #42bd00 100%);
    background:-o-linear-gradient(top, #009628 5%, #42bd00 100%);
    background:-ms-linear-gradient(top, #009628 5%, #42bd00 100%);
    background:linear-gradient(to bottom, #009628 5%, #42bd00 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#009628', endColorstr='#42bd00',GradientType=0);
    background-color:#009628;
    -moz-border-radius:0px;
    -webkit-border-radius:0px;
    border-radius:0px;
    border:1px solid #00a310;
    display:inline-block;
    cursor:pointer;
    color:#ffffff;
    font-family:Arial;
    font-size:12px;
    padding:5px 20px;
    text-decoration:none;
    text-shadow:0px 1px 0px #2f6627;
    height: 30px;
    text-align: center;
}

.requiredText {
    color:#996666;
    font-family:Verdana,Bitstream Vera Sans,sans-serif;
    font-size:15px;
    font-weight: bold;
}



/*.breadcrumb {
        centering
        display: inline-block;
        box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.35);
        overflow: hidden;
        border-radius: 5px;
        Lets add the numbers for each link using CSS counters. flag is the name of the counter. to be defined using counter-reset in the parent element of the links
}*/

/*.breadcrumb:active {
        text-decoration: none;
        outline: none;
        display: block;
        float: left;
        font-size: 12px;
        line-height: 36px;
        color: white;
        need more margin on the left of links to accomodate the numbers
        padding: 0 10px 0 60px;
        background: #666;
        background: linear-gradient(#666, #333);
        position: relative;
}*/

/*since the first link does not have a triangle before it we can reduce the left padding to make it look consistent with other links*/
/*.breadcrumb:first-child {
        padding-left: 46px;
        border-radius: 5px 0 0 5px; to match with the parent's radius
}
.breadcrumb:first-child:before {
        left: 14px;
}
.breadcrumb:last-child {
        border-radius: 0 5px 5px 0; this was to prevent glitches on hover
        padding-right: 20px;*/
/*}*/

/*hover/active styles*/
/*.breadcrumb.active, .breadcrumb:hover{
        background: #333;
        background: linear-gradient(#333, #000);
}
.breadcrumb.active:after, .breadcrumb:hover:after {
        background: #333;
        background: linear-gradient(135deg, #333, #000);
}*/

/*adding the arrows for the breadcrumbs using rotated pseudo elements*/
/*.breadcrumb:after {
        position: absolute;
        top: 0;
        right: -18px; half of square's length
        same dimension as the line-height of .breadcrumb a
        width: 36px;
        height: 36px;
        as you see the rotated square takes a larger height. which makes it tough to position it properly. So we are going to scale it down so that the diagonals become equal to the line-height of the link. We scale it to 70.7% because if square's:
        length = 1; diagonal = (1^2 + 1^2)^0.5 = 1.414 (pythagoras theorem)
        if diagonal required = 1; length = 1/1.414 = 0.707
        transform: scale(0.707) rotate(45deg);
        we need to prevent the arrows from getting buried under the next link
        z-index: 1;
        background same as links but the gradient will be rotated to compensate with the transform applied
        background: #666;
        background: linear-gradient(135deg, #666, #333);
        stylish arrow design using box shadow
        box-shadow:
                2px -2px 0 2px rgba(0, 0, 0, 0.4),
                3px -3px 0 2px rgba(255, 255, 255, 0.1);

                5px - for rounded arrows and
                50px - to prevent hover glitches on the border created using shadows
        border-radius: 0 5px 0 50px;
}*/
/*we dont need an arrow after the last link*/
/*.breadcrumb:last-child:after {
        content: none;
}*/
/*we will use the :before element to show numbers*/
/*.breadcrumb:before {
        some styles now
        border-radius: 100%;
        width: 20px;
        height: 20px;
        line-height: 20px;
        margin: 8px 0;
        position: absolute;
        top: 0;
        left: 30px;
        background: #444;
        background: linear-gradient(#444, #222);
        font-weight: bold;
}*/

/*
.flat, .flat:after {
        background: white;
        color: black;
        transition: all 0.5s;
}
.flat:before {
        background: white;
        box-shadow: 0 0 0 1px #ccc;
}
.flat:hover, .flat.active,
.flat:hover:after, .flat.active:after{
        background: #9EEB62;*/
/*}*/

.messages-wrapper {
    padding-top: 10px;
    position: relative;
    border: 1px solid #ddd;
    border-top: 0 none;
}
.messageFrom {
    border-radius: 20px 20px 20px 20px;
    margin: 0 15px 10px;
    padding: 15px 20px;
    background-color: #E5E4E9;
    color: #363636;
    margin-right: 80px;
    margin-top: -7px;
    position: relative;
}


.messageTo {
    border-radius: 20px 20px 20px 20px;
    margin: 0 15px 10px;
    padding: 15px 20px;
    background-color: #2095FE;
    color: #fff;
    margin-left: 80px;
    margin-top: -7px;
    position: relative;
}

.messageTo:before,
.messageFrom:before {
    border-color: #2095FE;
    border-radius: 50% 50% 50% 50%;
    border-style: solid;
    border-width: 0 20px;
    bottom: 0;
    clip: rect(20px, 35px, 42px, 0px);
    content: " ";
    height: 40px;
    position: absolute;
    right: -50px;
    width: 30px;
    z-index: -1;
}
.messageFrom:before {
    border-color: #E5E4E9;
    left: -50px;
    transform: rotateY(180deg);
}

.version {
    color: #f9f9f9;
}

.redButton,
.redButtonDisabled,
.redButtonDown,
.redButtonFocused,
.redButtonFocusedOver,
.redButtonOver {
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #d0451b), color-stop(1, #bc3315));
    background:-moz-linear-gradient(top, #d0451b 5%, #bc3315 100%);
    background:-webkit-linear-gradient(top, #d0451b 5%, #bc3315 100%);
    background:-o-linear-gradient(top, #d0451b 5%, #bc3315 100%);
    background:-ms-linear-gradient(top, #d0451b 5%, #bc3315 100%);
    background:linear-gradient(to bottom, #d0451b 5%, #bc3315 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#d0451b', endColorstr='#bc3315',GradientType=0);
    background-color:#d0451b;
    border:1px solid #942911;
    border-radius:3px;
}

.redButton:active {
    position:relative;
    top:1px;
}

.greenButton2,
.greenButton2Disabled,
.greenButton2Down,
.greenButton2Focused,
.greenButton2FocusedOver,
.greenButton2Over {
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #33cc00), color-stop(1, #2db300));
    background:-moz-linear-gradient(top, #33cc00 5%, #2db300 100%);
    background:-webkit-linear-gradient(top, #33cc00 5%, #2db300 100%);
    background:-o-linear-gradient(top, #33cc00 5%, #2db300 100%);
    background:-ms-linear-gradient(top, #33cc00 5%, #2db300 100%);
    background:linear-gradient(to bottom, #33cc00 5%, #2db300 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#33cc00', endColorstr='#2db300',GradientType=0);
    background-color:#33cc00;
    border:1px solid #0d3300;
    border-radius:3px;
}

.greenButton2:active {
    position:relative;
    top:1px;
}

.singleDigitTextItem {
    font-family:Lucidia Grande,Bitstream Vera Sans,sans-serif; font-size:20px;
    padding-top: 2px;
    padding-left: 5px;
    color: #333333;
}

.redIconBadge{
    position: absolute;
    top: 0px;
    right: 0px;
    padding: 3px 3px;
    border-radius:50%;
    background:red;
    color:white;
    font-weight: bold;
    font-size: 10px;
    opacity: 1.0;
}

.greenIconBadge{
    position: absolute;
    top: 0px;
    right: 0px;
    padding: 3px 3px;
    border-radius:50%;
    background:#33cc00;
    color:white;
    font-weight: bold;
    font-size: 10px;
    opacity: 1.0;
}

.grRedCell,
.grRedCellDark,
.grRedCellDisabled,
.grRedCellDisabledDark {
    font-family:Verdana,Bitstream Vera Sans,sans-serif; font-size:11px;
    color:black;
    border-style:outset;
    border-color:#7a8a99;
    border-width:1px;
    background-color:#FFC9C9;
}
.grRedCellOver,
.grRedCellSelected,
.grRedCellSelectedDark,
.grRedCellSelectedOver,
.grRedCellSelectedOverDark,
.grRedCellOverDark{
    font-family:Verdana,Bitstream Vera Sans,sans-serif; font-size:11px;
    color:black;
    border-style:outset;
    border-color:#7a8a99;
    border-width:1px;
    background-color:rgb(204, 255, 255);
}

.calculatorDisplay,
.calculatorDisplayFocused,
.calculatorDisplayFocusedOver,
.calculatorDisplaySelected,
.calculatorDisplayDisabled {
    color:black;
    font-family:Lucidia Grande,Bitstream Vera Sans,sans-serif;
    font-weight:300;
    font-size:24px;
    text-align: right;
    padding-right:5px;
}

.mathitem {
    display: inline-block;
    border-radius: 10px;
    padding: 10px;    
    border:3px solid transparent;
}

.mathitem:hover {
    display: inline-block;
    border-radius: 10px;
    padding: 10px;    
    border:3px solid orange;
}

