body {
    margin-top: 0px;
    margin-left: 0px;
    font-family: 'Roboto';
    font-size: 12px;
    color: #1c2327;
    background-color: #ffffff;
}

input {
    font-family: 'Roboto';
    font-size: 12px;
}

body#loginpage {
    background-color: #e0e0e0;
}

div#login-header {
    background-color: #ffffff; 
}

div#login-dialog {
   padding-top: 30px;
}

.white-rounded-corners {
    text-align: left;
    background-color: White;
    border-radius: 4px;
    box-shadow: 0 1px 3px 0 rgba(0,0,0,0.2), 0 1px 1px 0 rgba(0,0,0,0.14), 0 2px 1px -1px rgba(0,0,0,0.12);
}

.orange-rounded-corners {
    text-align: center;
    background-color: #f7931e;
    border-radius: 4px;
}

.login-field {
    height: 33px;
    color: #000000;
}

.login-button {
    height: 35px;
    color: #000000;
}

input[type=text], input[type=password] {
    border: 1px solid #dddddd;
    border-radius: 4px;
    padding: 5px;
}

input[type=text]:focus, input[type=password]:focus {
    border: 1px solid #2b4d99;
    border-radius: 4px;
    padding: 5px;
}

input[type=text]:enabled, input[type=password]:enabled {
    background-color: rgba(247, 147, 30, 0.10);
}

input[type=button]:focus, input[type=password]:focus {
    border: 1px solid #2b4d99;
}

.ui-dialog .ui-dialog-content {
    overflow: hidden !important;
}

.div-panel {
    border: 1px dashed #C0C0C0;
    border-radius: 8px;
    padding: 3px;
}

textarea {
    border-radius: 4px;
    border-width: 1px;
    border-style: solid;
    border-color: #dddddd;
    padding: 5px;
}

textarea:focus {
    border-radius: 4px;
    border-width: 1px;
    border-style: solid;
    border-color: #f7931e;
    padding: 5px;
}

input.ui-input-text, textarea.ui-input-text {
    padding: 0.15em !important;
}

.ui-btn-inner {
    font-size: inherit !important;
    background-color: #ffffff;
}

iframe#storyboard {
    margin: 0px;
    padding: 0px;
    width: 538px;
    height: 570px;
    border: 0px;
}

td {
    margin-top: 0px;
    margin-left: 0px;
    font-family: 'Roboto';
    font-size: 12px;
    color: #1c2327;
}

a {
    color: #dd3409;
    text-decoration: none;
}


a:hover {
    color: #dd3409;
    text-decoration: underline;
}

ul {
    font-family: 'Roboto';
    font-size: 12px;
    list-style-image: url(../images/small_arrow.gif);
    list-style-type: square;
    list-style-position: outside;
    padding-left: 30px;
    margin-left: 0px;
    margin-top: 5px;
    color: #1c2327;
    vertical-align: top;
}

ol {
    list-style-position: inside;
    margin-left: 25px;
    padding-left: 25px;
    margin-top: 5px;
}

h1 {
    font-family: 'Roboto';
    font-weight: bold;
    font-size: 18px;
    color: #1c2327;
    margin-top: 10px;
    margin-bottom: 40px;
}

.Title {
    font-family: 'Roboto';
    font-weight: bold;
    font-size: 1c2327;
    color: #3f3f3f;
    margin-top: 10px;
    margin-bottom: 40px;
}

h2 {
    font-family: 'Roboto';
    font-weight: bold;
    font-size: 18px;
    color: #1c2327;
    margin-top: 15px;
    margin-bottom: 15px;
}

h3 {
    font-family: 'Roboto';
    font-weight: bold;
    font-size: 10px;
    margin-top: 2px;
    margin-bottom: 2px;
}

.TopNavLink {
    font-size: 10px;
    color: #1c2327;
}

.WelcomeTitle {
    font-family: 'Roboto';
    font-size: 23px;
    font-weight: 900;
    letter-spacing: -0.2mm;
    margin-top: 10px;
    margin-bottom: 20px;
}

.MainText {
    font-size: 12px;
    font-family: 'Roboto';
    color: Black;
}

.SmallText {
    font-family: 'Roboto';
    color: Black;
    font-size: 10px;
}

.hint {
    color: Red;
}

.DemoContainer {
    border: 1px silver solid;
    background-color: #f6f6f6;
    height: 530px;
    width: 100%;
}

.DemoArea {
    background-color: #f6f6f6;
}

.AboutBox {
    background-color: #ffffff;
    color: #666666;
}

.SidePanelFooter {
    height: 100%;
    background-image: url(../images/sidepanel_bg.gif);
    background-repeat: repeat-y;
}

.SidePanel {
    background-color: #f3f3f3;
    font-size: 10px;
    color: #666666;
    border: 1px solid rgb(221,221,221);
}

.DottedLine {
    background-image: url(../images/dot_even.gif);
    background-repeat: repeat-x;
}

.DemoName {
    color: #666666;
    font-family: 'Roboto';
    font-weight: bolder;
    font-size: 11px;
}

.OtherDemos {
    background-color: #ffffff;
    padding: 10px;
    padding-top: 8px;
    padding-right: 5px;
    padding-bottom: 0px;
    font-family: 'Roboto';
    border-right: 1px solid #dddddd;
    font-size: 10px;
    font-weight: bold;
    font-size: 11px;
    color: #666666;
}

.OtherDemosIcons {
    background-color: #ffffff;
    font-family: 'Roboto';
    font-weight: normal;
    font-size: 11px;
    color: #dd3409;
    padding-bottom: 5px;
}

.DemoBottomGradient {
    color: #666666;
    background-image: url(../images/demo_bottom_bg.gif);
    background-repeat: repeat-x;
    font-family: 'Roboto';
    font-weight: bold;
    font-size: 10px;
    padding-left: 15px;
}

.DemoGradient {
    color: #999999;
    background-image: url(../images/demo_bg.gif);
    background-repeat: repeat-x;
    font-family: 'Roboto';
    font-weight: bold;
    font-size: 11px;
    padding-left: 15px;
}

.SideNotes {
    border-right: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
}

.DemosNav {
    background-color: #f3f3f3;
    cursor: default;
    height: 330px;
    width: 208px;
    padding: 0px;
}

.NavTopItem {
    cursor: pointer;
    color: #666666;
    background-image: url(../images/nav_bg.gif);
    font-family: 'Roboto';
    font-size: 11px;
    font-weight: bold;
    padding: 0px;
    border-bottom: 1px solid #dddddd;
}

.NavTopItemHover {
    cursor: pointer;
    color: #666666;
    text-decoration: underline;
    background-image: url(../images/nav_bg.gif);
    font-family: 'Roboto';
    font-size: 11px;
    font-weight: bold;
    padding: 0px;
    border-bottom: 1px solid #dddddd;
}

.NavTopItemActive {
    cursor: pointer;
    color: #666666;
    background-image: url(../images/nav_bg.gif);
    font-family: 'Roboto';
    font-size: 11px;
    font-weight: bold;
    padding: 0px;
    padding: 0px;
    border-bottom: 1px solid #dddddd;
}

.NavLevel2Item {
    cursor: pointer;
    font-family: 'Roboto';
    font-size: 10px;
    color: #666666;
    height: 15px;
    background-color: #bcbcbc;
    padding-top: 2px;
    padding-bottom: 2px;
    margin-left: 1px;
}

.NavLevel2ItemSelected {
    cursor: pointer;
    background-color: #f7f7f7;
    color: #dd3409;
    font-family: 'Roboto';
    font-size: 10px;
    padding-top: 1px;
    padding-bottom: 1px;
    margin-left: 0px;
    border-left: 1px solid #dddddd;
    border-top: 1px solid #dddddd;
    border-bottom: 1px solid white;
    border-right: 1px solid white;
}

.NavLevel2ItemHover {
    cursor: pointer;
    background-color: #f7f7f7;
    color: #666666;
    font-family: 'Roboto';
    font-size: 10px;
    padding-top: 1px;
    padding-bottom: 1px;
    margin-left: 0px;
    border-right: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
    border-top: 1px solid white;
    border-left: 1px solid white;
}

.NavLevel2Group {
    cursor: default;
    background-color: #bcbcbc;
    border-bottom: 1px solid #dddddd;
    padding-left: 3px;
    padding-right: 3px;
    padding-top: 3px;
}

.Empty {
}

.input {
    font-family: 'Roboto';
    font-size: 11px;
    border-radius: 8px;
    border-width: 1px;
}

select {
    font-family: 'Roboto';
    font-size: 11px;
    background-color: #ffffff;
}

/*Modal Popup*/
.modalBackground {
    background-color: White;
    filter: alpha(opacity=70);
    opacity: 0.7;
}

.modalPopup {
    background-color: #fcffff;
    border-width: 2px;
    border-style: outset;
    border-color: #ddddff;
    padding: 3px;
    width: 275px;
}

/*Popup Control*/
.popupControl {
    background-color: White;
    position: absolute;
    visibility: hidden;
}

.invisible_text {
    color: White;
    background-color: White;
    border-width: 0px;
    width: 0px;
    height: 0px;
}

.textButton {
    font-family: 'Roboto';
    font-size: 12px;
    color: #1c2327;
}

.label {
    font-family: 'Roboto';
    font-size: 12px;
    color: #1c2327;
    height: 152px;
    width: 516px;
}

.larger_label {
    font-family: 'Roboto';
    font-size: 14px;
    color: #1c2327;
}

.label2 {
    font-family: 'Roboto';
    font-size: 12px;
    color: #1c2327;
}

.message {
    font-family: 'Roboto';
    font-size: 12px;
    font-weight: bold;
    color: Maroon;
}

.smallLabel {
    font-family: 'Roboto';
    font-size: 10px;
    color: #1c2327;
}

.textBox {
    font-family: 'Roboto';
    font-size: 12px;
    color: #1c2327;
}

.textArea {
    font-family: 'Roboto';
    font-size: 12px;
    color: #1c2327;
    padding: 10px;
}

.dropDownList {
    font-family: 'Roboto';
    font-size: 12px;
    color: #1c2327;
}

input.ruButton.ruBrowse {
    cursor: pointer;
    background-color: #daf1ff !important;
    color: #005587 !important;
    font-size: 12px;
    font-family: 'Roboto';
    margin-left: 5px;
    margin-right: auto;
    border-radius: 4px;
    border: 0px !important;
    text-align: center;
    height: 22px;
    border: 0px !important;
    padding-top: 0px !important;
    padding-left: 4px;
}

input.ruButton.ruBrowse.ruButtonHover {
    background-color: #f7931e !important;
    color: #ffffff !important;
}

.radioButtonList {
    font-family: 'Roboto';
    font-size: 12px;
    color: #1c2327;
}

.heading {
    font-family: 'Roboto';
    font-size: 14px;
    color: White;
}

.dark-heading {
    font-family: 'Roboto';
    font-size: 15px;
    color: #00598e;
}

.hidden {
    display: none
}

button {
    outline-width: 0px !important;
}

.header-button {
    width: 115px;
    height: 15px;
    padding: 7px 5px 5px 5px;
    cursor: pointer;
    background: #ffffff;
    color: #1c2327;
    font-size: 12px;
    font-family: 'Roboto';
    font-weight: normal;
    margin-left: auto;
    margin-right: auto;
    border-radius: 4px;
    border: 1px solid #f7931e;
    text-align: center;
    box-shadow: 2px 2px #eeeeee;
}

.header-button:hover {
    background-color: #f7931e;
    color: #ffffff;
}

/* Tools & Widgets buttons */
.edit_tool_button {
    width: 125px;
    height: 20px;
    text-align: left;
    vertical-align: top;
    cursor: pointer;
    background-color: #fdfdfd;
    color: #2b4d99;
    font-size: 12px;
    font-family: 'Roboto';
    font-weight: normal;
    margin: 0 0 0 0;
    padding: 3px 0px 0px 3px;
    border-radius: 4px;
    border-color: #f7931e;
    border-width: 1px;
    border-style: solid;
    text-align: center;
    box-shadow: 2px 2px #eeeeee;
}

.edit_tool_button:hover {
    background-color: #f7931e;
    color: #ffffff;
}

.edit_tool_button:hover .edit_tool_text {
    background-color: #f7931e;
    color: #ffffff;
}

.edit_tool_text {
    font-family: 'Roboto';
    font-size: 12px;
    width: 100px;
    color: #1c2327;
    line-height: 20px;
}

.edit_tool_text_centered {
    font-family: 'Roboto';
    font-size: 12px;
    text-align: center;
    width: 100px;
    color: #1c2327;
    line-height: 20px;
}

.tools_widgets_he_img:hover {
    background: url("../images/studio/question-circle-16.png") no-repeat;
}

.tools_widgets_he_img {
    background: url("../images/studio/question-circle-16-or.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: right;
    margin-right: 4px;
    cursor: pointer;
}

/* edit buttons column */

.edit_tool_button:hover .edit_tool_at_img {
    background: url("../images/studio/painters_palette_brush-18-wh.png") no-repeat;
}

.edit_tool_at_img {
    background: url("../images/studio/painters_palette_brush-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_hh_img {
    background: url("../images/studio/html_tag2-18-wh.png") no-repeat;
}

.edit_tool_hh_img {
    background: url("../images/studio/html_tag2-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_js_img {
    background: url("../images/studio/js-square-18-wh.png") no-repeat;
}

.edit_tool_js_img {
    background: url("../images/studio/js-square-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_pl_img {
    background: url("../images/studio/pencil-18-wh.png") no-repeat;
}

.edit_tool_pl_img {
    background: url("../images/studio/pencil-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_cy_img {
    background: url("../images/studio/copy-18-wh.png") no-repeat;
}

.edit_tool_cy_img {
    background: url("../images/studio/copy-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_cp_img {
    background: url("../images/studio/clipboard_paste-18-wh.png") no-repeat;
}

.edit_tool_cp_img {
    background: url("../images/studio/clipboard_paste-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_sd_img {
    background: url("../images/studio/selection_delete-18-wh.png") no-repeat;
}

.edit_tool_sd_img {
    background: url("../images/studio/selection_delete-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_bf_img {
    background: url("../images/studio/front-18-wh.png") no-repeat;
}

.edit_tool_bf_img {
    background: url("../images/studio/front-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_sb_img {
    background: url("../images/studio/back-18-wh.png") no-repeat;
}

.edit_tool_sb_img {
    background: url("../images/studio/back-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_uo_img {
    background: url("../images/studio/undo-18-wh.png") no-repeat;
}

.edit_tool_uo_img {
    background: url("../images/studio/undo-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_ro_img {
    background: url("../images/studio/redo-18-wh.png") no-repeat;
}

.edit_tool_ro_img {
    background: url("../images/studio/redo-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_sp_img {
    background: url("../images/studio/snap-18-wh.png") no-repeat;
}

.edit_tool_sp_img {
    background: url("../images/studio/snap-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_dr_img {
    background: url("../images/studio/nav_down_right-16-wh.png") no-repeat;
}

.edit_tool_dr_img {
    background: url("../images/studio/nav_down_right-16.png") no-repeat;
    width: 16px;
    height: 16px;
    vertical-align: middle;
    float: right;
    margin-left: 4px;
    margin-right: 4px;
    margin-top: 1px
}

#snap_to_grid_edit:hover {
    background: url("../images/studio/nav_down_right-16.png") no-repeat;
}

/* widget buttons column */

.edit_tool_button:hover .edit_tool_hp_img {
    background: url("../images/studio/document_tag-18-wh.png") no-repeat;
}

.edit_tool_hp_img {
    background: url("../images/studio/document_tag-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_ll_img {
    background: url("../images/studio/label-18-wh.png") no-repeat;
}

.edit_tool_ll_img {
    background: url("../images/studio/label-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_tf_img {
    background: url("../images/studio/text_field-18-wh.png") no-repeat;
}

.edit_tool_tf_img {
    background: url("../images/studio/text_field-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_ta_img {
    background: url("../images/studio/text_area-18-wh.png") no-repeat;
}

.edit_tool_ta_img {
    background: url("../images/studio/text_area-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_im_img {
    background: url("../images/studio/photo_landscape-18-wh.png") no-repeat;
}

.edit_tool_im_img {
    background: url("../images/studio/photo_landscape-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_bn_img {
    background: url("../images/studio/button-18-wh.png") no-repeat;
}

.edit_tool_bn_img {
    background: url("../images/studio/button-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_ib_img {
    background: url("../images/studio/image_button-18-wh.png") no-repeat;
}

.edit_tool_ib_img {
    background: url("../images/studio/image_button-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_tb_img {
    background: url("../images/studio/toggle-on-18-wh.png") no-repeat;
}

.edit_tool_tb_img {
    background: url("../images/studio/toggle-on-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_cb_img {
    background: url("../images/studio/check-square-18-wh.png") no-repeat;
}

.edit_tool_cb_img {
    background: url("../images/studio/check-square-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_lv_img {
    background: url("../images/studio/list-alt-18-wh.png") no-repeat;
}

.edit_tool_lv_img {
    background: url("../images/studio/list-alt-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_gd_img {
    background: url("../images/studio/grid-18-wh.png") no-repeat;
}

.edit_tool_gd_img {
    background: url("../images/studio/grid-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_rs_img {
    background: url("../images/studio/rss-18-wh.png") no-repeat;
}

.edit_tool_rs_img {
    background: url("../images/studio/rss-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_bc_img {
    background: url("../images/studio/chart-bar-18-wh.png") no-repeat;
}

.edit_tool_bc_img {
    background: url("../images/studio/chart-bar-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_qc_img {
    background: url("../images/studio/question-circle-16-wh.png") no-repeat;
}

.edit_tool_qc_img {
    background: url("../images/studio/question-circle-16.png") no-repeat;
    width: 16px;
    height: 16px;
    vertical-align: middle;
    float: right;
    margin-left: 4px;
    margin-right: 4px;
    margin-top: 1px;
    cursor: pointer;
}

#chart_help:hover {
    background: url("../images/studio/question-circle-16.png") no-repeat;
}

.edit_tool_button:hover .edit_tool_bs_img {
    background: url("../images/studio/barcode-18-wh.png") no-repeat;
}

.edit_tool_bs_img {
    background: url("../images/studio/barcode-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_dd_img {
    background: url("../images/studio/drop_down_list-18-wh.png") no-repeat;
}

.edit_tool_dd_img {
    background: url("../images/studio/drop_down_list-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_sl_img {
    background: url("../images/studio/slide_panel-18-wh.png") no-repeat;
}

.edit_tool_sl_img {
    background: url("../images/studio/slide_panel-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_sr_img {
    background: url("../images/studio/slider-18-wh.png") no-repeat;
}

.edit_tool_sr_img {
    background: url("../images/studio/slider-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_ln_img {
    background: url("../images/studio/location-arrow-18-wh.png") no-repeat;
}

.edit_tool_ln_img {
    background: url("../images/studio/location-arrow-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_mp_img {
    background: url("../images/studio/map_location-18-wh.png") no-repeat;
}

.edit_tool_mp_img {
    background: url("../images/studio/map_location-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_sw_img {
    background: url("../images/studio/sign_warning-18-wh.png") no-repeat;
}

.edit_tool_sw_img {
    background: url("../images/studio/sign_warning-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

.edit_tool_button:hover .edit_tool_hn_img {
    background: url("../images/studio/hidden-18-wh.png") no-repeat;
}

.edit_tool_hn_img {
    background: url("../images/studio/hidden-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-left: 4px;
}

/* end of tool buttons */

/* apps buttons */

td.tool_cell_size {
    width: 20px;
    padding: 0px;
    margin: 0px;
    align-content: center;
}

.page_tool_he_img:hover {
    background: url("../images/studio/question-circle-16.png") no-repeat;
}

.page_tool_he_img {
    background: url("../images/studio/question-circle-16-or.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: right;
    margin-right: 4px;
    cursor: pointer;
}

.page_tool_nt_img:hover {
    background: url("../images/studio/template-18-wh.png") no-repeat;
}

.page_tool_nt_img {
    background: url("../images/studio/template-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
}

.page_tool_na_img:hover {
    background: url("../images/studio/new_app-18-wh.png") no-repeat;
}

.page_tool_na_img {
    background: url("../images/studio/new_app-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
}

.page_tool_ra_img:hover {
    background: url("../images/studio/rename_app-18-wh.png") no-repeat;
}

.page_tool_ra_img {
    background: url("../images/studio/rename_app-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
}

.page_tool_du_img:hover {
    background: url("../images/studio/duplicate_app-18-or.png") no-repeat;
}

.page_tool_du_img {
    background: url("../images/studio/duplicate_app-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
}

.page_tool_ca_img:hover {
    background: url("../images/studio/convert_app_type-18-or.png") no-repeat;
}

.page_tool_ca_img {
    background: url("../images/studio/convert_app_type-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
}

.page_tool_vf_img:hover {
    background: url("../images/studio/rubber_stamp-18-or.png") no-repeat;
}

.page_tool_vf_img {
    background: url("../images/studio/rubber_stamp-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
}

.page_tool_sa_img:hover {
    background: url("../images/studio/share-18-or.png") no-repeat;
}

.page_tool_sa_img {
    background: url("../images/studio/share_app-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
}

.page_tool_da_img:hover {
    background: url("../images/studio/delete_app-18-wh.png") no-repeat;
}

.page_tool_da_img {
    background: url("../images/studio/delete_app-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
}

/* end of apps buttons */

/* page buttons */

.page_tool_ph_img:hover {
    background: url("../images/studio/question-circle-16.png") no-repeat;
}

.page_tool_ph_img {
    background: url("../images/studio/question-circle-16-or.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: right;
    margin-right: 4px;
    cursor: pointer;
}

.page_tool_np_img:hover {
    background: url("../images/studio/new_page-18-or.png") no-repeat;
}

.page_tool_np_img {
    background: url("../images/studio/new_page-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: right;
    margin-right: 4px;
}

.page_tool_rp_img:hover {
    background: url("../images/studio/rename_page-18-or.png") no-repeat;
}

.page_tool_rp_img {
    background: url("../images/studio/rename_page-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: right;
    margin-right: 4px;
}

.page_tool_dp_img:hover {
    background: url("../images/studio/duplicate_page-18-or.png") no-repeat;
}

.page_tool_dp_img {
    background: url("../images/studio/duplicate_page-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: right;
    margin-right: 4px;
}

.page_tool_sf_img:hover {
    background: url("../images/studio/step-forward-18-or.png") no-repeat;
}

.page_tool_sf_img {
    background: url("../images/studio/step-forward-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: right;
    margin-right: 4px;
}

.page_tool_sb_img:hover {
    background: url("../images/studio/step-backward-18-or.png") no-repeat;
}

.page_tool_sb_img {
    background: url("../images/studio/step-backward-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: right;
    margin-right: 4px;
}

.page_tool_md_img:hover {
    background: url("../images/studio/move_page_down-18-or.png") no-repeat;
}

.page_tool_md_img {
    background: url("../images/studio/move_page_down-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: right;
    margin-right: 4px;
}

.page_tool_mu_img:hover {
    background: url("../images/studio/move_page_up-18-or.png") no-repeat;
}

.page_tool_mu_img {
    background: url("../images/studio/move_page_up-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: right;
    margin-right: 4px;
}

.page_tool_dh_img:hover {
    background: url("../images/studio/question-circle-16-or.png") no-repeat;
}

.page_tool_dh_img {
    background: url("../images/studio/question-circle-16.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-right: 4px;
    cursor: pointer;
}

.page_tool_de_img:hover {
    background: url("../images/studio/delete_page-18-or.png") no-repeat;
}

.page_tool_de_img {
    background: url("../images/studio/delete_page-18.png") no-repeat;
    width: 18px;
    height: 18px;
    vertical-align: middle;
    float: left;
    margin-right: 4px;
}

/* end of page buttons */

.ui-widget, .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
    font-family: 'Roboto' !important;
}

.ui-widget-header {
    background-color: rgb(142,190,230) !important;
    color: rgb(255,255,255) !important;
    background-image: none !important;
    font-weight: normal !important;
    border: 0px !important;
}

.ui-widget-content {
    border: 0px !important;
}

[role~="tablist"] {
    background-color: transparent !important;
}

.ui-widget-shadow {
    -webkit-box-shadow: 3px 3px 3px #cccccc !important;
    box-shadow: 3px 3px 3px #cccccc !important;
}

.edit-tools-container {
    text-align: left;
    background-color: #ffffff;
    border-radius: 4px;
    box-shadow: 0 1px 3px 0 rgba(0,0,0,0.2), 0 1px 1px 0 rgba(0,0,0,0.14), 0 2px 1px -1px rgba(0,0,0,0.12);
    height: 690px;
    width: 301px;
}

.apps-container {
    text-align: left;
    background-color: #ffffff;
    border-radius: 4px;
    box-shadow: 0 1px 3px 0 rgba(0,0,0,0.2), 0 1px 1px 0 rgba(0,0,0,0.14), 0 2px 1px -1px rgba(0,0,0,0.12);
    height: 125px;
    width: 540px;
}

.pages-container {
    text-align: left;
    background-color: #ffffff;
    border-radius: 4px;
    box-shadow: 0 1px 3px 0 rgba(0,0,0,0.2), 0 1px 1px 0 rgba(0,0,0,0.14), 0 2px 1px -1px rgba(0,0,0,0.12);
    height: 125px;
    width: 540px;
    margin-top: 10px;
}

.storyboard-container {
    text-align: left;
    background-color: #ffffff;
    border-radius: 4px;
    box-shadow: 0 1px 3px 0 rgba(0,0,0,0.2), 0 1px 1px 0 rgba(0,0,0,0.14), 0 2px 1px -1px rgba(0,0,0,0.12);
    height: 600px;
    width: 540px;
    margin-top: 10px;
}

div#tools_panel_title {
    font-weight: 400;
    font-size: 16px;
    text-shadow: 1px 1px 0px #cbcbcb;
    text-align: left;
    padding-top: 8px;
    padding-bottom: 2px;
    padding-left: 8px;
}

div#apps_panel_title {
    font-weight: 400;
    font-size: 16px;
    text-shadow: 1px 1px 0px #cbcbcb;
    text-align: left;
    padding-top: 8px;
    padding-bottom: 2px;
    padding-left: 8px;
}

div#pages_panel_title {
    font-weight: 400;
    font-size: 16px;
    text-shadow: 1px 1px 0px #cbcbcb;
    text-align: left;
    padding-top: 8px;
    padding-bottom: 2px;
    padding-left: 8px;
}

div#storyboard_panel_title {
    font-weight: 400;
    font-size: 16px;
    text-shadow: 1px 1px 0px #cbcbcb;
    text-align: left;
    padding-top: 8px;
    padding-bottom: 2px;
    padding-left: 8px;
}

.designbutton {
    cursor: pointer;
    background-color: #ffffff;
    color: #000000;
    font-size: 12px;
    font-family: 'Roboto';
    margin-left: auto; 
    margin-right: auto;
    border-radius: 4px;
    border: 1px;
    border-color: #f7931e;
    border-style: solid;
    text-align: center;
    height: 25px;
    box-shadow: 2px 2px #eeeeee;
}

.designbutton:hover {
    background-color: #f7931e;
    color: #ffffff;
}

.propertybutton {
    cursor: pointer;
    background-color: #ffffff;
    color: #2b4d99;
    font-size: 12px;
    font-family: 'Roboto';
    margin-left: auto;
    margin-right: auto;
    border-radius: 4px;
    border: 0px;
    text-align: center;
    height: 25px;
}

.propertybutton:hover {
    background-color: #0093ea;
    color: #ffffff;
}

.header-tab-bar {
    text-align: left;
    background-color: #2b4d99;
    border-radius: 0px;
    box-shadow: 0 1px 3px 0 rgba(0,0,0,0.8);
    height: 30px;
}

.header-tab-item {
    color: #dddddd;
    font-size: 18px;
    padding: 5px;
    cursor: pointer;
}

.header-tab-item:hover {
    background-color: rgb(94,154,227);
    border-radius: 4px;
    padding: 5px;
}

.header-tab-item-selected {
    color: navy;
    font-size: 18px;
    background-color: white;
    border-radius: 4px;
    padding: 5px;
}

input.rounded {
    border: 1px solid #ccc;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    -moz-box-shadow: 2px 2px 3px #666;
    -webkit-box-shadow: 2px 2px 3px #666;
    box-shadow: 2px 2px 3px #666;
    font-size: 20px;
    padding: 4px 7px;
    outline: 0;
    -webkit-appearance: none;
}

.warningbutton {
    background: #660000;
    color: #CCCCCC;
    font-size: 10px;
    font-family: 'Roboto';
    margin-left: auto;
    margin-right: auto;
    border-radius: 8px;
    border-width: 1px;
    text-align: center;
}

.panel {
    background-color: #fffcea !important;
    border-radius: 8px;
}

.propertyPanel {
    width: 320px;
    height: 320px;
    border-width: 0px;
    padding: 0px;
    margin: 0px;
    border-radius: 8px;
}

div.RadTreeView_Web20, .RadTreeView .rtEdit .rtIn input {
    font-size: 12px;
    font-family: 'Roboto';
    overflow: visible;
    margin: 1px !important;
    padding: 2px !important;
}

div.RadTreeView_Web20 .rtHover .rtIn {
    overflow: visible;
    border: none;
    background-color: rgba(247, 147, 30, 0.05);
    margin: 1px !important;
    padding: 2px !important;
}

div.RadTreeView_Web20 .rtSelected .rtIn {
    overflow: visible;
    border: none;
    background-color: #fff1d9;
    margin: 1px !important;
    padding: 2px !important;
}

.dragme {
    position: absolute;
}

.toast {
    display: none;
    position: fixed;
    z-index: 99999;
    width: 100%;
    text-align: center;
    top: 1em;
}

.toast .message {
    display: inline-block;
    color: #fff;
    padding: 10px;
    border-radius: 5px;
    box-shadow: 2px 2px 2px #666;
    -webkit-box-shadow: 2px 2px 2px #666;
    font-family: 'Roboto';
    font-size: 12px;
    background: rgb(54,101,90);
}

#control-gutter {
    text-align: left;
    width: 1200px;
    margin: 0 auto 10px;
}

#control-gutter label {
    font-size: 16px;
    font-weight: bold;
    background: #999;
    color: #dddddd;
    text-align: right;
    padding: 6px 5px 8px 0;
    height: 16px;
    width: 75px;
    display: block;
    float: left;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

#control-gutter .chosen-choices {
    height: 30px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

#control-gutter .search-field {
    font-size: 16px;
    padding: 2px;
}

#chart-help {
    width: 1200px;
    padding-top: 10px;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
}

#chart-help-left {
    float: left;
}

#chart-help-right {
    float: right;
}

#chart-help-left, #chart-help-right {
    padding: 10px;
    width: 580px;
    text-align: left;
}

.highcharts-container {
    box-shadow: 0 1px 3px 0 rgba(0,0,0,0.2), 0 1px 1px 0 rgba(0,0,0,0.14), 0 2px 1px -1px rgba(0,0,0,0.12);
}

.highcharts-credits {
    display: none;
}

.dx-popup-title {
    background-color: rgba(230, 230, 255, 0.3);
}

/* RadComboBox style overrides */

/* combo box container */
td .RadComboBox_Simple {
    border: solid 1px #f7931e;
    border-radius: 4px;
    padding: 0px;
    margin: 0px;
    line-height: 24px;
    max-height: 24px;
    width: 100px;
    background-color: #ffffff;
    box-shadow: 2px 2px #eeeeee;
}

td .RadComboBox_Simple:hover {
    background-color: #fef4e8;
}

td .RadComboBox_Simple:focus {
    background-color: deepskyblue;
    color: #ffffff;
}

/* cell */

.RadComboBox_Simple input[type=text] {
    padding: 0px;
    border: 0px;
    color: #1c2327 !important;
}

.RadComboBox_Simple input[type=text]:focus {
    padding: 0px;
    margin: 0px;
    border: 0px;
    color: #ffffff !important;
}

td .RadComboBox_Simple input[type=text]:enabled {
    background-color: inherit;
    padding: 0px;
    margin: 0px;
    line-height: 22px;
    max-height: 22px;
}

td .RadComboBox .rcbReadOnly .rcbInputCell {
    background-color: inherit;
    border: 0px;
    padding: 0 0 0 10px;
    margin: 0px;
    line-height: 22px;
    max-height: 22px;
}

td .RadComboBox_Simple .rcbHovered .rcbReadOnly .rcbInputCell {
    border: 0px;
    color: #ffffff;
    background-color: inherit;
}

td .RadComboBox_Simple .rcbFocused .rcbReadOnly .rcbInputCell {
    border-color: #1c2327;
    background-color: #f7931e;
}

/* arrow */
td .RadComboBox_Simple .rcbArrowCell {
    background-color: inherit;
    border: 0px;
    padding: 0px;
    margin: 0px;
    line-height: 22px;
    max-height: 22px;
    color: #1c2327;
    background-image: url('WebResource.axd?d=SmTw0vWRt1QyA33CNjbfdyaTUh1bOwhwDD2x6N5B_EYCByM_K8GQZZAbApNxpRusLapsJjaCVc7ZNuf4ZfVgZ8eV1EsjqrozvYwfc87pWGxNsYzHEeTMmAVVSIGbnxxkSFzYE06WK5Yqk9LExcO0WNz9BLw1&t=636752803936382765');
    background-repeat: no-repeat;
    background-position: -1px -19px
}

td .RadComboBox_Simple .rcbHovered .rcbArrowCell {
    border: 0px;
    color: #ffffff;
    background-color: inherit;
}

td .RadComboBox_Simple .rcbFocused .rcbArrowCell {
    border: 0px;
    color: #882501;
    background-color: #f7931e;
}

/* drop down */

div .RadComboBoxDropDown_Simple .rcbHovered {
    color: black;
    background: #fef4e8;
}