/* ===========================================================================================*/
/* RELEASE: 16                                                                              */
/* ===========================================================================================*/

/* ------------------------------------------------------------------ */
/* Elements */
/* ------------------------------------------------------------------ */

html, body
{
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    border: none;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    color: #323232;
}
h1 {
    color: #808080;
}
h1.headerLabel {
    padding-left: 13px;
}
h2 {
    color: #0072C6;
}
h3 {
    color: #FF8800;
}
h4 {
    color: #FF8800;
}
h5 {
    font-size: 16px;
}
div.clear {
    clear: both;
}
div.bold {
    font-weight: bold;
}
.hidden {
    visibility: hidden;
}
table.nospacing { 
    border-collapse: collapse; 
    border-spacing: 0; 
}
table.fullwidth { 
    width: 100%; 
}
table.center { 
    margin: 0 auto; 
}
th.nopadding, td.nopadding { 
    padding: 0;
}
th.editform, td.editform { 
    width: 35%; 
}
th.editpages, td.editpages { 
    width: 65%; 
}
th, td { 
    vertical-align: top; 
}

/* -------------------------------------------------------------------------------------------*/
/* GENERAL elements                                                                           */
/* -------------------------------------------------------------------------------------------*/

.orangeLink {
    color: #f88e1d;
}

.headerMenu {
    float: right;
    margin-left: 5px;
    font-size: 14px;
}

.footerMenu {
    background-color: transparent!important;
}

.footerMenu a:hover,
.footerMenu a:hover * {
    color: #f88e1d!important;
}

.footerMenuItem,
.footerMenuItem > div {
    font-size: 12px!important;
}

.footerMenuSeparator {

}

.orangeButton {
    background-color: #f88e1d;
    color: #ffffff;
    border: none;
    float: right;
    margin-left: 5px;
}

.loginButton {
    background-color: #f88e1d;
    color: #f7f7f7;
    border: none!important;
    height: 50px;
    font-size: 18px;
    width: 150px!important;
}

.loginButton-hover {
    background-color: #ff8800;
    color: #ffffff;
    box-shadow: 0px 0px 3px rgba(0,0,0,0.2);
}

.standardButton {
    background-color: #ffffff;
    color: #636363;
    border: 1px solid #c3c3c3!important;
    height: 40px;
    font-size: 14px;
}

.standardButton-hover {
    background-color: #f88e1d;
    color: #ffffff;
    border: none!important;
}

.greyButton {
    background-color: #ffffff;
    color: #636363;
    border: 1px solid #c3c3c3!important;
    height: 40px;
    font-size: 14px;
}

.greyButton-hover {
    background-color: #f7f7f7;
    color: #636363;
    border: 1px solid #b3b3b3!important;
}

.radiobutton-list {

}

.radiobutton-list img {
    border: 1px solid #c4c4c4;
    padding-right: 0!important;
    margin: 0 4px;
    box-shadow: 0px 0px 3px rgba(0,0,0,0.2);
}

.contentImage {
    margin-top: 5px;
    margin-bottom: 10px;
}

div.center {
    margin: 0 auto; 
}

table.center { 
    margin: 0 auto; 
}

body .editor {
    font-size: 14px;
    height: 30px;
}

body .editor .dxic {
    padding-top: 4px;
}

body .editor.nulltext input {
    font-style: italic;
    color: #c1c1c1;
}

/* -------------------------------------------------------------------------------------------*/
/* LAYOUT                                                                                     */
/* -------------------------------------------------------------------------------------------*/

.layoutPage {
    width: 100%;
}

.layoutContentContainer {
    width: 923px;
    margin-left: auto;
    margin-right: auto;
}

.layoutPageTop {
    width: 100%;
    height: 30px;
    background-color: #333333;
    font-size: 12px;
}

.layoutPageTopContent {
    height: 100%;
    color: #e1e1e1;
    padding: 0 25px 0 16px;
}

.layoutPageTopContent a {
    color: white;
}

.layoutPageTopContent a:hover, 
.layoutPageTopContent a:active
{
    color: white;
    text-decoration: none;
}

.layoutPageHeader {
    border-bottom: 3px solid #f88e1d;
    margin-top: 11px;
    padding-bottom: 10px;
}

.layoutPageHeaderContent {
    height: 100%;
    color: #e1e1e1;
    padding: 0 2px 0 16px;
}

.layoutPageHeader .logo {
    float: left;
    margin-left: -25px;
}

.layoutPageHeader .login {
    float: right;
    margin-top: 1px;
}

.layoutPageHeaderContent .userName {
    white-space: nowrap;
    text-align: end;
    margin-right: 10px;
    padding-top: 1px;
    font-weight: bold;
    color: #777;
}

.layoutPageHeaderContent .tenantName {
    white-space: nowrap;
    text-align: end;
    margin-right: 10px;
    margin-top: -2px;
    padding-top: 0;
    color: #a8a8a8;
}

.layoutPageMain {
    width: 100%;
    background-color: white;
}

.layoutPageMainContent {
    padding: 0;
    height: 100%;
}

.layoutPageMainContent .rootContentHeader {
    width: 100%;
    min-height: 90px;
}

.layoutPageMainContent .rootContentHeaderLeft {
    float: left;
}

.layoutPageMainContent .rootContentHeaderRight {
    float: right;
}

.layoutPageMainContent .footerContainer {
    width: 100%;
    height: 180px;
    background-color: #f7f7f7;
    border-top: 1px solid #dedede;
    margin-top: 50px;
}

.layoutPageMainContent .footerContainer a {
    color: #f7f7f7;
}

.layoutPageMainContent .footerContainer a:hover, 
.layoutPageMainContent .footerContainer a:active
{
    color: #4a4a4a;
    text-decoration: none;
}

.layoutPageMainContent .footerContainer .columns {
    padding-top: 26px;
    padding-bottom: 20px;
}

.layoutPageMainContent .footerContainer .column {
    height: 122px;
    float: left;
    width: 290px;
    padding-right: 40px;
    padding-bottom: 11px;
    margin-left: 10px;
}

.layoutPageMainContent .footerContainer .column.rightBorder {
    border-right: 1px solid #d2d2d2;
    margin-right: 10px;
}

.layoutPageMainContent .footerContainer .column h5 {
    font-size: 16px;
    color: #808080;
    margin-bottom: 10px;
    margin-top: 2px;
}

.layoutPageMainContent .footerContainer .column .text {
    font-size: 14px;
    color: #676767;
    margin-bottom: 6px;
}

.layoutPageMainContent .footerContainer .column .menu {
    margin-bottom: 6px;
}

.layoutPageMainContent .footerContainer .column .menu .dxm-content {
    padding-left: 1px!important;
}

.layoutPageMainContent .footerContainer .info {
    background-color: #f88e1d;
    height: 61px;
}

.layoutPageMainContent .footerContainer .copyright {
    float: left;
    margin-top: 24px;
    font-size: 12px;
    color: #ffffff;
}

.layoutPageMainContent .footerContainer .logo {
    float: right;
    margin-top: 10px;
}

/* -------------------------------------------------------------------------------------------*/
/* LIGHT pages area                                                                           */
/* -------------------------------------------------------------------------------------------*/

.layoutPageMainContent .headerContainer {

}

.layoutPageMainContent .mainContainer {

}

.layoutPageMainContent .messageContainer {

}

.layoutPageMainContent .contentContainer {

}

.layoutPageMainContent .headerPanel {
    height: 100px;
    background-color: #f7f7f7;
    border-bottom: 1px solid #dedede;
}

.layoutPageMainContent .headerPanel .headerBlock {
    float: left;
    margin-top: 0;
}

.layoutPageMainContent .headerPanel .headerBlock .text {
    margin-left: 5px;
}

.layoutPageMainContent .headerPanel .headerBlock h1 {
    font-size: 45px;
    font-weight: normal;
    margin-top: 23px;
    margin-left: -8px;
}

.layoutPageMainContent .headerPanel .helpBlock {
    float: right;
    margin-top: 10px;
}

.layoutPageMainContent .headerPanel .helpBlock .text {
    text-align: right;
    display: inline-block;
    vertical-align: middle;
}

.layoutPageMainContent .headerPanel .helpBlock h5 {
    font-size: 18px;
    font-weight: normal;
    margin-top: 5px;
    margin-bottom: 5px;
}

.layoutPageMainContent .headerPanel .helpBlock .contact {
    color: #7c7c7c;
    font-size: 14px;
}

.layoutPageMainContent .headerPanel .helpBlock .image {
    display: inline-block;
    vertical-align: middle;
}

.layoutPageMainContent .logo {
    margin: 12px 0 8px 16px;
}

.layoutPageMainContent .contentPanel {
    margin-bottom: 30px;
}

.layoutPageMainContent .teaserPanel {
    padding: 10px 10px 0 10px;
}

.layoutPageMainContent .descriptionPanel {
    padding: 10px 10px 20px 10px;
    font-size: 14px;
}

.layoutPageMainContent .descriptionPanel a {
    font-size: 14px;
}

.layoutPageMainContent .editPanel {
    width: 923px;
}

.layoutPageMainContent .editPanel h4 {
    font-weight: normal;
    font-size: 18px;
    margin-top: 28px;
    margin-bottom: 5px;
}

.layoutPageMainContent .editPanel .form {
    float: left;
    width: 582px;
}

.layoutPageMainContent .editPanel .form .block-info {
    width: 923px;
    margin-top: 10px;
    margin-bottom: 40px;
}

.layoutPageMainContent .editPanel .form .block-info .block {
    float: left;
}

.layoutPageMainContent .editPanel .form .block-info .info {
    float: right;
    margin-left: 24px;
    width: 316px;
}

.layoutPageMainContent .editPanel .form .block {
    background: #f7f7f7;
    border: 1px solid #c3c3c3;
    width: 580px;
}

.layoutPageMainContent .editPanel .form .controlContainer {
    padding-top: 20px;
    padding-left: 20px;
    padding-right: 20px;
    margin-bottom: -20px;
}

.layoutPageMainContent .editPanel .form .form-layout {
    padding-top: 30px;
    padding-bottom: 30px;
    margin: 0 auto;
}

.layoutPageMainContent .editPanel .form .form-layout.no-margin-top {
    padding-top: 0;
}

.layoutPageMainContent .editPanel .form .form-layout .item {
    width: auto;
    padding-bottom: 5px;
    padding-top: 5px;
}

.layoutPageMainContent .editPanel .form .infoBox {
    background: #FFF;
    border-bottom: 1px solid #dedede;
    padding: 20px;
    font-weight: bold;
}

.layoutPageMainContent .editPanel .form .infoBox-bottom {
    background: #FFF;
    border-top: 1px solid #dedede;
    padding: 20px;
}

.layoutPageMainContent .editPanel .form .comment {
    color: #7c7c7c;
    font-size: 14px;
    padding-top: 30px;
    padding-left: 20px;
    padding-right: 20px;
    margin-bottom: -20px;
}

.layoutPageMainContent .editPanel .form .comment-center {
    text-align: center;
    color: #7c7c7c;
    font-size: 14px;
    padding-top: 30px;
    padding-left: 20px;
    padding-right: 20px;
    margin-bottom: -20px;
}

.layoutPageMainContent .editPanel .form .comment-bottom {
    color: #7c7c7c;
    font-size: 14px;
    padding-top: 30px;
    padding-left: 20px;
    padding-right: 20px;
    margin-bottom: 40px;
}

.layoutPageMainContent .editPanel .form .page-control .dxtc-leftIndent {
    display: none;
}

.layoutPageMainContent .editPanel .form .tab {
    background: #FFFFFF;
}

.layoutPageMainContent .editPanel .form .tab a {
    color: #323232 !important;
    font-size: 14px;
}

.layoutPageMainContent .editPanel .form .active-tab {
    background: #f7f7f7;
}

.layoutPageMainContent .editPanel .form .tab-content {
    background: #f7f7f7;
}

.layoutPageMainContent .editPanel .form .page-control-content {
    padding: 0;
}

.layoutPageMainContent .editPanel .form .form-layout .captcha .captcha-button {
    font-size: 14px;
}

.layoutPageMainContent .editPanel .summary {
    float: right;
    width: 318px;
    font-size: 14px;
}

.layoutPageMainContent .editPanel .summary .block-info .block {
    border: 1px solid #c3c3c3;
}

.layoutPageMainContent .editPanel .summary .block-info .info {
    margin-top: 55px;
    margin-left: 24px;
}

.layoutPageMainContent .editPanel .block-info .info {
    font-size: 14px;
}

.layoutPageMainContent .editPanel .block-info .info h5 {
    display: block;
    border-bottom: 1px solid #e5e5e5;
    color: #808080;
    font-weight: normal;
    font-size: 14px;
    margin-top: 0;
}

.layoutPageMainContent .editPanel .block-info .info li {
    list-style-image: url("Images/Template/list-checked.png");
    font-size: 14px;
    margin-bottom: 16px;
}

.layoutPageMainContent .editPanel .block-info .info ul {
    padding-left: 25px;
}

.layoutPageMainContent .editPanel .block-info .info .buttons {
    padding-top: 5px;
}

.layoutPageMainContent .editPanel .block-info .info a {
    font-size: 14px;
}

/* -------------------------------------------------------------------------------------------*/
/* Landing page                                                                               */
/* -------------------------------------------------------------------------------------------*/

.landingPage {
    width: 100%;
}

.landingPage .index-banner {
    background-image: url('Images/Template/Banner.jpg');
    background-position: center;
    height: 400px;
    width: 100%;
}

.landingPage .index-banner .text {
    text-align: left;
}

.landingPage .index-banner .text h1 {
    font-size: 48px;
    color: #414444;
    font-weight: 400;
}

.landingPage .index-banner .text h2 {
    font-size: 24px;
    color: #777b7a;
    font-weight: 400;
}

.landingPage .index-banner .buttons {
    padding-top: 15px;
}

.landingPage .signupPanelContainer {
    width: 920px;
    height: 400px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 10px;
}

.landingPage .signup-panel {
    float: right;
    border: 1px solid #dedede;
    width: 390px;
    background-color: #fafcfb;
    background-color: rgba(250, 250, 250, 0.8);
    box-shadow: 0 0 15px rgba(0,0,0,0.2);
}

.landingPage .signup-panel h3 {
    margin-top: 8px;
    margin-bottom: 8px;
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    color: #f88e1d;
}

.landingPage .signup-panel .item {
    padding-bottom: 6px;
}

.landingPage .signup-panel .item-caption {
    font-size: 14px;
    color: #323232;
}

.landingPage .signup-panel .descriptionPanel {
    padding: 0 15px 10px 15px;
    font-size: 14px;
}

.landingPage .signup-panel .descriptionPanel a {
    font-size: 14px;
}

.landingPage .widgets {
    overflow: hidden;
}

.landingPage .dockingVertical {
    float: left;
    margin-left: 20px;
    padding-top: 40px;
}

.landingPage .dockingHorizontal {
    margin-bottom: 20px;
}

.landingPage .dockingVertical.first {
    margin-left: 0;
}

.landingPage .dockingHorizontal.first {
    margin-top: 50px;
}

.widgets.hide-panel {
    height: 0;
}

.landingPage .widget {
    box-shadow: 0 0 2px rgba(0,0,0,0.1);
}

.landingPage .widget .dxpc-content {
    padding: 9px;
}

.landingPage .widget .imageContainer {
    width: 100%;
    height: 115px;
    overflow: visible;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: -13px;
    position:relative;
    top: -23px;
    cursor: pointer;
}

.landingPage .widget .image {

}

.landingPage .widget .imageText {
    position: relative;
    top: -85px;
    color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    padding-left: 95px;
    font-size: 30px;
}

.landingPage .widget .imageTextDouble {
    position: relative;
    top: -105px;
    color: #ffffff;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    padding-left: 95px;
    font-size: 30px;
}

.landingPage .widget .closeImageContainer {
    width: 100%;
    height: 13px;
    position: relative;
    top: 10px;
    right: 10px;
    z-index: 10000;
}

.landingPage .widget .closeImage {
    float: right;
    cursor: default;
}







/* ===========================================================================================*/
/* RELEASE: 2015                                                                              */
/* ===========================================================================================*/

/* -------------------------------------------------------------------------------------------*/
/* GENERAL elements                                                                           */
/* -------------------------------------------------------------------------------------------*/

.labelLeftFirst {
    padding-top: 13px;
}
.labelLeft {
    padding-top: 5px;
}
.textLabelContainer {
    padding-top: 5px;
}
.textLabelWithoutCaptionContainer {
    padding-top: 31px;
}
.textLabel {
}
.textEdit {
    height: 25px;
}
.textEdit td.dxic {
    padding-top: 4px;
}
.tokenEdit {
    height: 25px;
}
.tokenEdit td.dxic {
    padding-top: 4px;
}
.spinEdit {
    height: 25px;
}
.spinEdit td.dxic {
    padding-top: 4px;
}
.spinEdit .dxeButton {
    height: 12px !important;
    padding: 5px;
    vertical-align: middle;
}
.selectBox {
    height: 25px;
}
.selectBox td.dxic {
    padding-top: 4px;
}
.selectBox img {
    margin-top: 4px;
}
.buttonEdit {
    height: 25px;
}
.buttonEdit td.dxic {
    padding-top: 4px;
}
.buttonEdit img {
    margin-top: 4px;
}
.buttonEditButton {
    /*background: White!important;
    border-color: White!important;*/
}
.buttonEditButton > table {
    padding-right: 5px;
}
.checkBox {

}
.checkBox td.dxichTextCellSys {
    padding-top: 4px;
}
.FileUpload {
    height: 25px;
    padding-top: 2px;
}








/* Tables*/

.dxtcLite_Metropolis > .dxtc-stripContainer .dxtc-link {
    padding-left: 15px;
    padding-right: 15px;
}

/* -------------------------------------------------------------------------------------------*/
/* LAYOUT                                                                                     */
/* -------------------------------------------------------------------------------------------*/

.layoutMainForm {
    height: 100%;
}
.layoutContainer {
    height: 100%;
}
table.layoutTable {
    border-collapse: collapse; 
    border-spacing: 0; 
    height:100%; 
    width:100%;
}
.layoutHeader {
    height: 30px;
    background-color: #333333;
    font-size: 12px;
}
.layoutHeader td {
    vertical-align: middle;
}
.layoutHeaderContent {
    height: 100%;
    color: #e1e1e1;
    padding: 0 25px 0 16px;
}
.layoutHeaderContent a {
    color: white;
}
.layoutHeaderContent a:hover, 
.layoutHeaderContent a:active
{
    color: white;
    text-decoration: none;
}
.layoutMain {
    background-color: white;
}
.layoutMain td {
    vertical-align:top;
}
.layoutMainContent {
    padding: 0;
    height: 100%;
}
.layoutFooter {
    font-size: 12px;
    height: 24px;
    background-color: #f3f3f3;
}
.layoutFooter td {
    vertical-align: middle;
}
.layoutFooterContent {
    color: #5b5b5b;
    padding: 0 25px 0 15px;
}
.layoutFooterContent a {
    color: #5b5b5b;
}
.layoutFooterContent a:hover, 
.layoutFooterContent a:active
{
    color: #4a4a4a;
    text-decoration: none;
}
.layoutFooterContent .message {
    float: left;
}
.layoutFooterContent .copyright {
    float: right;
}
.dxsplVSeparatorHover_Metropolis {
    background-color: white;
}

/* -------------------------------------------------------------------------------------------*/
/* TOP area                                                                                   */
/* -------------------------------------------------------------------------------------------*/

.layoutHeaderContent .top {

}
.layoutHeaderContent .topTable {
    width: 100%;
}
.layoutHeaderContent .topleft {
    width: 235px;
    height: 100%;
    white-space: nowrap;
    overflow: hidden;
}
.layoutHeaderContent .topcenter {
    height: 100%;
    white-space: nowrap;
}
.layoutHeaderContent .topright {
    text-align: right;
    height: 100%;
    white-space: nowrap;
}
.layoutHeaderContent .toptenant {
    padding-top: 1px;
    white-space: nowrap;
}
.layoutHeaderContent .toppath {
    padding-top: 3px;
    white-space: nowrap;
}
.layoutHeaderContent .toprightwrapper {
    float: right;
    white-space: nowrap;
}
.layoutHeaderContent .toplanguage {
    float: left;
    padding-top: 4px;
    white-space: nowrap;
}
.layoutHeaderContent .topinfo {
    float: left;
    padding-top: 1px;
    white-space: nowrap;
}
.layoutHeaderContent .topsocial {
    float: left;
    padding-top: 1px;
    white-space: nowrap;
}
.layoutHeaderContent .topuser {
    float: left;
    padding-top: 1px;
    white-space: nowrap;
}
.layoutHeaderContent .hosterImage {
    float: left;
    margin-right: 7px;
}
.layoutHeaderContent .hosterName {
    white-space: nowrap;
}
.layoutHeaderContent .tenantImage {
    float: left;
    margin-right: 7px;
}
.layoutHeaderContent .tenantName {
    white-space: nowrap;
    padding-top: 3px;
}
.layoutHeaderContent .userName {
    white-space: nowrap;
    margin-right: 2px;
    padding-top: 3px;
}
.layoutHeaderContent .userLogin {
    white-space: nowrap;
    margin-top: 5px;
    margin-right: 25px;
}
.layoutHeaderContent .userRegister {
    white-space: nowrap;
    margin-top: 5px;
    margin-right: 10px;
}
.layoutHeaderContent .tenantMenu {
    padding-right: 5px !important;
    color: #e1e1e1;
}
.layoutHeaderContent .pathMenu {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    padding-left: 24px !important;
    padding-right: 20px !important;
    color: #e1e1e1;
}
.layoutHeaderContent .languageMenu {
    padding-right: 20px !important;
    color: #e1e1e1;
}
.layoutHeaderContent .infoMenu {
    padding-right: 12px !important;
    color: #e1e1e1;
}
.layoutHeaderContent .socialMenu {
    padding-right: 40px !important;
    color: #e1e1e1;
}
.layoutHeaderContent .userMenu {
    padding-right: 5px !important;
    color: #e1e1e1;
}
.layoutHeaderContent .tenantMenu,
.layoutHeaderContent .tenantMenu.dxm-main,
.layoutHeaderContent .pathMenu,
.layoutHeaderContent .pathMenu.dxm-main,
.layoutHeaderContent .languageMenu,
.layoutHeaderContent .languageMenu.dxm-main,
.layoutHeaderContent .infoMenu,
.layoutHeaderContent .infoMenu.dxm-main,
.layoutHeaderContent .socialMenu,
.layoutHeaderContent .socialMenu.dxm-main,
.layoutHeaderContent .userMenu,
.layoutHeaderContent .userMenu.dxm-main {
    background: transparent;
}
.layoutHeaderContent .subMenu {
}

/* -------------------------------------------------------------------------------------------*/
/* LIGHT master area                                                                          */
/* -------------------------------------------------------------------------------------------*/

.rootContentContainer {
    position:absolute; 
    top:50px; 
    left:50%; 
    margin-left:-400px; 
    width:800px; 
}
.rootContentContainer .rootContentHeader {
    width: 100%;
    min-height: 90px;
}
.rootContentContainer .rootContentHeaderLeft {
    float: left;
}
.rootContentContainer .rootContentHeaderRight {
    float: right;
}
.rootContentContainer .logo {
    margin: 12px 0 8px 16px;
}

/* -------------------------------------------------------------------------------------------*/
/* LIGHT pages area                                                                           */
/* -------------------------------------------------------------------------------------------*/

.rootContentContainer .editForm {
    margin-top: 10px;
}
.rootContentContainer .editFormTab {
    margin-top: 20px;
}
.rootContentContainer .editButton {
    margin-top: 18px;
}
.rootContentContainer .rememberMe {
    margin-top: 30px;
    margin-bottom: 20px;
}
.rootContentContainer .descriptionPanel {
    padding-top: 10px;
}
.rootContentContainer .lightContentContainer {
    padding-left: 15px;
}

/* -------------------------------------------------------------------------------------------*/
/* OFFICE master area                                                                         */
/* -------------------------------------------------------------------------------------------*/

.layoutMainContent .layoutContainer {
    height: 100%;
}
.layoutMainContent .logo {
    margin: 15px;
}
/* not used here (solution to center the image)
.logo img {
    display: block;
    margin: 0 auto;
}
*/
.layoutMainContent .layoutSplitter {

}
.layoutMainContent .layoutLeftPaneSplitter {
    height: 100%;
    background-color: #f3f3f3;
    border-color: #f3f3f3 !important;
    border-right: 1px solid;
}
.layoutMainContent .layoutLeftPaneSplitterControl {
    background-color: #f3f3f3;
    padding: 0 !important;
}
.layoutMainContent .layoutLeftPane {
    width: 100%;
    height: 100%;
    background-color: #f3f3f3;
}
.layoutMainContent .layoutRightPaneSplitter {
    height: 100%;
    padding: 0 !important;
}
.layoutMainContent .layoutRightPane {
    width: 100%;
    height: 100%;
}
.layoutMainContent .navigationContainer {
    height: 100%;
    padding-bottom: 68px;
}
.layoutMainContent .navigationContainer a:hover {
    text-decoration: none;
}
.layoutMainContent .navigation {
    height: 100%;
    border-top: 1px solid white;
    border-bottom: 1px solid white;
}
.layoutMainContent .layoutNavigationMain {

}
.layoutMainContent .layoutNavigationGroup {
    padding-left: 20px !important;
    font-size: 18px;
}
.layoutMainContent .layoutNavigationGroup span {
    font-weight: 100;
}
.layoutMainContent .dxnb-gr {
    margin-bottom: 1px;
}
.layoutMainContent .layoutNavigationItem {
    margin-left: 21px;
}
.layoutMainContent .layoutNavigationItem span {
    font-size: 13px;
}
.layoutMainContent .dxgvFocusedRow_Metropolis {
    background-color: #e0e0e0;
    color: #333333;
}
.layoutMainContent .dxeListBoxItemSelected_Metropolis {
    background-color: #e0e0e0;
    color: #333333;
}
.layoutMainContent .dxeListBoxItemHover_Metropolis {
    background-color: #FF8800;
    color: white;
}

/* -------------------------------------------------------------------------------------------*/
/* OFFICE pages area                                                                          */
/* -------------------------------------------------------------------------------------------*/

.layoutMainContent .content {
    height: 100%;
}
.layoutMainContent .contentWrapper {
    height: 100%;
}
.layoutMainContent .menuContainer {
    padding: 10px 20px 0 10px;
}
.layoutMainContent .ribbonTemplateContainer {
    padding: 4px 6px;
}
.layoutMainContent .messageContainer {
    padding: 0 20px 0 10px;
}
.layoutMainContent .alert {
    margin-top: 10px;
    margin-bottom: 5px;
}
.layoutMainContent .bodyContainer {
    height: 100%;
    padding: 0 0 0 10px;
}
.layoutMainContent .bodyEntityPanel {
    height: 100%;
}
.layoutMainContent .objectHeaderName h2 {
    margin-top: 0px;
    margin-left: 15px;
}
.layoutMainContent .controlFormWrapper {
    height: 100%;
    padding-right: 22px;
    padding-bottom: 133px;
}
.layoutMainContent .controlWidgetContainer {
    height: 100%;
    padding: 2px;
}
.layoutMainContent .controlCalendarWrapper {
    height: 100%;
    padding-right: 5px;
    padding-bottom: 1px;
}
.layoutMainContent .controlGridWrapper {
    height: 100%;
    padding-right: 22px;
    padding-bottom: 140px;
}
.layoutMainContent .controlCardWrapper {
    height: 100%;
    padding-right: 22px;
    padding-bottom: 140px;
}
.layoutMainContent .controlTreeWrapper {
    height: 100%;
    padding-top: 15px;
    padding-right: 22px;
    padding-bottom: 140px;
}
.layoutMainContent .controlFormContainer {
    height: 100%;
}
.layoutMainContent .controlCalendarContainer {
    height: 100%;
}
.layoutMainContent .controlGridContainer {
    height: 100%;
}
.layoutMainContent .controlCardContainer {
    height: 100%;
}
.layoutMainContent .controlTreeContainer {
    height: 100%;
}
/* OLD Card View */
.layoutMainContent div.controlCard {
    height: 100%;
    background-color: #F5F5F5;
    border-color: #F5F5F5;
}
.layoutMainContent div.controlCardHover {
    height: 100%;
    background-color: #DEDEDE;
    border-color: #DEDEDE;
}
.layoutMainContent .controlCardView {
    width: 255px !important;
    height: 90px !important;
}
.layoutMainContent .controlCardContactView {
    width: 325px !important;
    height: 120px !important;
}
.layoutMainContent .controlCardPictureView {
    width: 295px !important;
    height: 90px !important;
}
.layoutMainContent .controlCardRecordView {
    width: 370px !important;
    height: 98px !important;
}
.layoutMainContent .controlCardTable {
    float: left;
}
.layoutMainContent .controlImage {
    float: left;
    max-height: 80px;
    max-width: 75px;
    margin: 5px;
}
/* End of OLD Card View */

/* NEW Card View */
.layoutMainContent .objectCardCustPanel {
    padding-top: 7px;
    padding-bottom: 3px;
    padding-right: 10px;
}
.layoutMainContent .objectCardTable {
    padding: 0 0 3px 0;
}
.layoutMainContent .objectCard {
    width: 255px !important;
    height: 90px !important;
    margin: 3px 12px 12px 3px;
}
.layoutMainContent .objectCardFlow {
    width: 255px !important;
    height: 90px !important;
    margin: 3px 12px 12px 3px;
}
.layoutMainContent .objectCardLayoutGroupBox {
    padding: 0;
}
.layoutMainContent .objectCardLayoutGroup {
    padding: 0;
}
.layoutMainContent .objectCardLayoutGroup td {
    padding: 0 0 0 5px;
}
.layoutMainContent .objectCardLayoutItem {
    padding-top: 5px !important;
    padding-bottom: 2px !important;
}
.layoutMainContent .objectCardNestedControl {
    padding: 0 0 0 8px;
}
.layoutMainContent .cardImage {
    float: left;
}
.layoutMainContent .cardImage img {
    max-height: 80px;
    max-width: 60px;
}
.layoutMainContent .cardHeader {
    font-weight: bold;
}
.layoutMainContent .cardContent td {
    padding: 0 5px 0 0;
}
.layoutMainContent .cardContent label {
    font-weight: normal;
    padding-bottom: 0;
    margin-bottom: 0;
}

/* End of NEW Card View */

.layoutMainContent .tableClassificationContainer {
    text-align: center;
}
.layoutMainContent .labelClassificationContainer {
    margin: 10px 0 0 0;
}
.layoutMainContent .labelClassification {
    font-size: 6em;
}
.layoutMainContent .controlRatingContainer {
    margin: 20px 0 15px 0;
}
.layoutMainContent .labelRatingContainer {
    margin: 3px 0 0;
}
.layoutMainContent .controlEditContainer {
    height: 100%;
    padding-top: 15px;
    width: 100%;
    max-width: 1200px;
}
.layoutMainContent .controlEditHeader {
    padding-left: 5px;
}
.layoutMainContent .controlEditBody {
    height: 100%;
}
.layoutMainContent .controlEditFormContainer {
    width: 100%;
    max-width: 460px;
    padding-right: 20px;
    float: left;
}
.layoutMainContent .controlListFormContainer {
    width: 100%;
    max-width: 460px;
    padding-right: 20px;
    padding-top: 15px;
    padding-left: 5px;
    float: left;
}
.layoutMainContent .controlEditFlyoutFormContainer {
    max-width: 300px;
    padding-right: 20px;
    float: left;
}
.layoutMainContent .controlEditExtendedFormContainer {
    width: 100%;
    max-width: 550px;
    padding-right: 20px;
    float: left;
}
.layoutMainContent .controlEditPagesContainer {
    width: 100%;
    padding-top: 10px;
}
.layoutMainContent .controlEditPagesContainer .dxtc-content {
    padding: 0px;
}
.layoutMainContent div.cardViewWrapper {
    height: 100%;
    background-color: #f5f5f5;
    border-color: #f5f5f5;
}
.layoutMainContent div.cardViewWrapperHover {
    height: 100%;
    background-color: #dedede;
    border-color: #dedede;
}
.layoutMainContent .objectGridFooter {
    background-color: #f3f3f3;
}
.layoutMainContent #CurrencyCardView .hgl {
    background: #fbf4d7;
}
.layoutMainContent .objectGridGroupPanel {
    color: #c7c7c7;
}
.layoutMainContent .infoContentContainer {
    max-width:800px; 
    padding-top: 20px;
}
.layoutMainContent .infoContentContainer .infoContentHeader {
    width: 100%;
    min-height: 90px;
}
.layoutMainContent .infoContentContainer .infoContentHeaderLeft {
    float: left;
}
.layoutMainContent .infoContentContainer .infoContentHeaderRight {
    float: right;
}
.layoutMainContent .infoContentContainer .logo {
    margin: 15px;
}
.layoutMainContent .infoContentContainer .infoContentBody {
    padding-left: 15px;
}
.layoutMainContent .imageLayoutGroupLarge > div,
.layoutMainContent .imageLayoutGroupLarge > table {
    width: 400px;
}
.layoutMainContent .imageLayoutGroupMedium > div,
.layoutMainContent .imageLayoutGroupMedium > table {
    width: 300px;
}
.layoutMainContent .imageLayoutGroupSmall > div,
.layoutMainContent .imageLayoutGroupSmall > table {
    width: 200px;
}
.layoutMainContent .imageTaxRegion {
    padding-bottom: 6px;
    padding-left: 10px;
    max-height: 32px;
    max-width: 50px;
}
.layoutMainContent .imageEditLink {
    margin-left: 30px;
}

/* -------------------------------------------------------------------------------------------*/
/* OFFICE PopUp area                                                                          */
/* -------------------------------------------------------------------------------------------*/

.controlPopUpEditSingleContainer {
    width: 450px;
    padding-top: 10px;
}
.controlPopUpEditExtendedContainer {
    width: 700px;
    padding-top: 10px;
}
.controlPopUpEditDoubleContainer {
    width: 850px;
    padding-top: 10px;
}
.controlPopUpEditContainer .dxtc-content {
    padding: 0px;
}
.controlPopUpEditContainer .popupEditFormWrapper {
    padding: 10px 10px 0 20px;
    width: 400px;
}
.controlPopUpEditContainer .popupEditForm {
    margin: 10px 10px 20px 10px;
    width: 100%;
}
.controlPopUpEditContainer .popupButtonsWrapper {
    padding-left: 10px;
}

/* -------------------------------------------------------------------------------------------*/
/* REPORTS, ANALYSIS, CHARTS                                                                  */
/* -------------------------------------------------------------------------------------------*/

.reportContainer {
    height: 100%;
    margin: 0;
    background: white;
}
.analysisWrapper {
    height: 100%;
    margin: 0;
    padding: 0 10px 40px 10px;
    background: white;
}
.analysisContainer {
    height: 100%;
    width: 100%;
}
.chartContainer {
    height: 100%;
    margin: 0px;
    padding: 0 10px;
    background: white;
}
.mapContainer {
    height: 100%;
    margin: 0px;
    padding: 0 10px;
    background: white;
}

/* -------------------------------------------------------------------------------------------*/
/* Popups                                                                                     */
/* -------------------------------------------------------------------------------------------*/

.popupReportViewer {
    height: 100%;
}
.popupReportViewer .dxpc-content {
    height: 100%;
    padding: 1px 0;
}
.popupAnalysisViewer {
    height: 100%;
}
.popupAnalysisViewer .dxpc-content {
    height: 100%;
    padding: 1px 0;
}
.popupChartViewer {
    height: 100%;
}
.popupChartViewer .dxpc-content {
    height: 100%;
    padding: 1px 0;
}
.popupMapViewer {
    height: 100%;
}
.popupMapViewer .dxpc-content {
    height: 100%;
    padding: 1px 0;
}
.popupFilemanager {
    width: 950px !important; 
    height: 550px !important;
}
.popupFilemanagerButtons {
    float: right;
    margin-top: 5px;
    margin-bottom: 10px;
}
.popupMenu {
    background-color: #f3f3f3;
}
.popupButtons {
    float: right;
    margin: 0px;
}
.popupButton {
    float: right;
    margin: 9px 9px 9px 0;
}

/* -------------------------------------------------------------------------------------------*/
/* Errors & Messages                                                                          */
/* -------------------------------------------------------------------------------------------*/

.errorScreenWrapper {
    border-top: 2px solid #c7c7c7;
    margin-left: 10px;
    margin-right: 17px;
    padding-top: 30px;
    padding-left: 7px;
}
.errorDetailPanel {
    margin-bottom: 20px;
}
.errorTitleWrapper {
    margin-bottom: 20px;
}
.errorTitle {
    font-size: large;
    color: #FF8800;
}
.errorMessageWrapper {
    margin-bottom: 20px;
}
.errorMessage {
    color: #808080;
}
.errorDetail {
    font-size:small;
    color: #808080;
}
.errorTrace {
    font-size:small;
    color: #808080;
}
.errorLinkWrapper {
}
.timeoutScreenWrapper {
    padding: 0px;
}
.timeoutMessageWrapper {
    font-size: 1.2em;
    color: #808080;
}
.timeoutCountDownWrapper {
    font-size: 40px;
    color: #c7c7c7;
    margin-bottom: 10px;
}
.timeoutRemarkWrapper {
    font-size: 1.2em;
    color: #808080;
}