
:root {
    --main-theme-color-1: #004666;
    --main-theme-color-2: #133444;
    --main-theme-color_rgba-1: rgba(255,0,0);
}

/*Using the main variables does not work in Internet Explorer don't know about edge yet.
Instead of using the color for example #004666 everywere the idea is to use the above variable:
    background-color: #004666;
    becomes
    background-color: var(--main-theme-color-1);
*/

/**********************************************************
 *  Specific customer styles and Overides. (Should not be copied when setting up new customer)
 **********************************************************/



/**********************************************************
 *  Kendo Overide
 **********************************************************/

/*Kendo.Button */

.k-button, .k-button:focus {
    color: #004666 !important;
    font-weight: bold !important;
    background-color: #fff;
    border-radius: 4px;    
}

.k-overflow-container .k-primary, .k-primary {
    color: #004666 !important;
    border-color: #ccc !important;
    background-color: #FFFFFF !important;
}

.k-button.k-state-hover, .k-button:hover {
    color: #FFFFFF !important;
    border-color: transparent !important;
    background-color: #004666 !important;
}

.k-button.k-state-active {
    color: #FFFFFF !important;
    border-color: transparent !important;
    background-color: #004666 !important;
}


/*Tabstrip*/
.k-panelbar > li.k-state-default > .k-link, .k-tabstrip-items .k-state-default .k-link {
    color: #004666;
}

.k-tabstrip-items .k-state-hover.k-link {
    color: #004666;
}

/*Menu*/
.k-content, .k-editable-area, .k-panel > li.k-item, .k-panelbar > li.k-item, .k-tiles {
    background-color: #fff;
}

/*Kendo Window*/
.k-window-titlebar {
    background-color: #004666;
}

/*Checkbox*/
.k-checkbox:checked {
    color: #004666;
    background-color: #FFFFFF;
    border-color: #004666 !important;
}

    .k-checkbox:checked:focus {
        -webkit-box-shadow: 0 0 0 2px rgba(255,0,0,.3);
        box-shadow: 0 0 0 2px rgba(255,0,0,.3);
        border-color: #004666;
    }

/**********************************************************
 *  Valett Ctrls
 **********************************************************/

/*Theme button*/
.v-theme {
    background-color: #004666;
}

    .v-theme:hover {
        box-shadow: 0 0 0 2px white, 0 0 0 3px #004666;
    }

/*Theme vgl-button*/
.vgl-theme {
    color: #FFFFFF;
}


/**********************************************************
 *  Dialog Overrides
 **********************************************************/

/*vex Dialog Overrides*/

.vex.vex-theme-top .vex-dialog-form .vex-dialog-input input[type=tel]:focus, .vex.vex-theme-top .vex-dialog-form .vex-dialog-input input[type=text]:focus, .vex.vex-theme-top .vex-dialog-form .vex-dialog-input input[type=time]:focus, .vex.vex-theme-top .vex-dialog-form .vex-dialog-input input[type=url]:focus, .vex.vex-theme-top .vex-dialog-form .vex-dialog-input input[type=week]:focus, .vex.vex-theme-top .vex-dialog-form .vex-dialog-input input[type=date]:focus, .vex.vex-theme-top .vex-dialog-form .vex-dialog-input input[type=datetime]:focus, .vex.vex-theme-top .vex-dialog-form .vex-dialog-input input[type=datetime-local]:focus, .vex.vex-theme-top .vex-dialog-form .vex-dialog-input input[type=email]:focus, .vex.vex-theme-top .vex-dialog-form .vex-dialog-input input[type=month]:focus, .vex.vex-theme-top .vex-dialog-form .vex-dialog-input input[type=number]:focus, .vex.vex-theme-top .vex-dialog-form .vex-dialog-input input[type=password]:focus, .vex.vex-theme-top .vex-dialog-form .vex-dialog-input input[type=search]:focus, .vex.vex-theme-top .vex-dialog-form .vex-dialog-input textarea:focus {
    -moz-box-shadow: inset 0 0 0 2px #004666 !important;
    -webkit-box-shadow: inset 0 0 0 2px #004666 !important;
    box-shadow: inset 0 0 0 2px #004666 !important;
}

.vex.vex-theme-top .vex-dialog-button.vex-dialog-button-primary {
    background: #004666 !important;
}

/**********************************************************
 *  Loaders
 **********************************************************/
#loader-2 span {
    background-color: #004666;
}

/**********************************************************
 *  This Theme
 **********************************************************/

/*Link*/
a {
    color: #004666;
    font-weight: bold;
    text-decoration: none;
    font-size: small;
}

    a:hover {
        color: #004666;
    }

    a:focus {
        color: #004666;
    }

/*Text and backgroundColors*/
.theme-textcolor {
    color: #004666;
}

.theme-textcolor2 {
    color: #133444;
}

.theme-bgcolor {
    background-color: #004666;
}

.theme-bgcolor2 {
    background-color: #133444;
}

/**********************************************************
 *  Loaders
 **********************************************************/
#loader-2 span {
    background-color: #004666;
}

/*Cssload-dot Loader*/
.cssload-dot, .cssload-dot:nth-child(2), .cssload-dot:nth-child(3), .cssload-dot:nth-child(4), .cssload-dot:nth-child(5) {
    background-color: #004666 !important;
}

/**********************************************************
 *  Layout
 **********************************************************/
.main-header {
    height: 60px;
    background-color: #333333;
}

/**********************************************************
 *  Menu.cshtml
 **********************************************************/

/*.nav-link {
    color: #FFFFFF;
}*/

.nav ul {    
    background-color: #333333;
}

/*Full screen menu*/
.nav-link,
    .nav-link:link,
    .nav-link:visited,
    .nav-link:active,
    .submenu-link,
    .submenu-link:link,
    .submenu-link:visited,
    .submenu-link:active {
        color: #FFFFFF;
    }
    
    /*.nav-link:hover > span {
        background-color: #f4f4f4;
        color: #303030;                
    }*/

    .nav-link:hover > .nav-link-title {        
        border-bottom: 5px solid #004666;                
    }

    .nav-link.active > .nav-link-title {        
        border-bottom: 5px solid #004666;                
    }

    .nav-link:hover > .badge {        
        color: #FFFFFF !important;        
    }

/*Mobil Screen menu*/
.nav .menu-icon .navicon {
    background: #fff;    
}

.nav .menu-icon .navicon:before, .nav .menu-icon .navicon:after {
    background: #fff;    
}


/**********************************************************
 *  RoomSlider and ItemSlider
 **********************************************************/

.itemSlider > ul > .showli {
    background-color: #004666;
}

.itemSlider > ul > li:hover {
    background-color: #004666;
}

.roomSlider > ul > .showli {
    background-color: #004666;
}

.roomSlider > ul > li:hover {
    background-color: #004666;
}

/**********************************************************
 *  LoginPartial.cshtml
 **********************************************************/
.profile-info {
    color: #343434;
}

.profile-context-menu > label > ul {
    /*border: 2px solid #004666;*/
    border: 2px solid #333333;
}

.mainProfile-button > span {
    color: #004666;
}



/**********************************************************
 *  Login Content
 **********************************************************/

.login-body {    
    margin-top: 65px;
}

.login-valett-title {    
    color: #FFFFFF;    
}


.login-block {
    text-align: center;
    width: 320px;
    padding: 20px;
    background: #fff;
    border-bottom: 7px solid #004666;
    margin: 0 auto;
    border-radius: 10px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}


    .login-block input {
        width: 100%;
        height: 42px;
        box-sizing: border-box;
        border-radius: 5px;
        border: 1px solid #ccc;
        margin-bottom: 20px;
        font-size: 14px;
        /*font-family: Montserrat;*/
        padding: 0 20px 0 50px;
        outline: none;
    }


/**********************************************************
 *  WelcomeLayout.cshtml
 **********************************************************/
.front-menu {
    /*background-color: rgba(255,255,255,.8);*/
    background-color: #FFFFFF;
    border-bottom: 4px solid #004666;
}



/**********************************************************
 *  Room.css
 **********************************************************/

h1.top-content {
    color: #303030;
}

.top-content_text {
    color: #303030;
}

.top-content_line {
    border-top: solid 4px #004666;
}

/*a.finalize-link {
    color: #303030;    
}
a.finalize-link:hover {
    color: #004666;        
}*/

.finalize-button {
    background-color: #004666;
    color: #FFFFFF;
}

    .finalize-button:hover {
        font-size: 22px;
        /*box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);*/
    }

.campaign-box .box .info {
    background-color: rgba(255,0,0,0.6);
}

    .campaign-box .box .info .days-left {
        color: #FFFFFF;
    }

    .campaign-box .box .info .percentage {
        border: 2px solid #FFFFFF;
        color: #FFFFFF;
    }

        .campaign-box .box .info .percentage.complete {
            border: 2px solid #FFFFFF;
            color: #FFFFFF;
        }

.campaign-box a {
    color: #FFFFFF;
}

.campaign-box .box .info .chart {
    border: solid 2px #FFFFFF;
}

.pc1 svg .percent-circle-inner {
    stroke: #FFFFFF;
}

/**********************************************************
 *  MadeChoices.css
 **********************************************************/

.img-wrapper.active {
        background-color: #004666;
    }

.ChPeriodTabLink {
    color: #004666;
}

    .ChPeriodTabLink:hover {
        color: #004666;
    }

    .ChPeriodTabLink:visited {
        color: #004666;
    }

.arrow-up {
    border-bottom: 10px solid #004666;
}

.arrow-down {
    border-top: 10px solid #004666;
}

/* MadeChoices - ChoiceGroupsView */

progress {
    border: solid 1px #004666;
}

    progress::-webkit-progress-value {
        background: #004666;
    }

    progress::-moz-progress-value {
        background: #004666;
    }

.progress_value {
    color: #004666;
}

.ChGrp-flex-item.active {
    background-color: #004666;    
}




/* MadeChoicesViews */
.cgi-header {
    background: rgba(255,0,0,0.5);
}


/**********************************************************
 *  MadeChoices/NavButton.css
 **********************************************************/

.navmenu ul.text-list li.active a {
    color: #004666;
}

.navmenu ul.text-list li a:hover {
    color: #004666;
}

/**********************************************************
 *  NewsArticles.css
 **********************************************************/
.newsArticle-header-main {
    border-bottom: 2px solid #004666;
    color: #303030;
}


/**********************************************************
 *  Information.css
 **********************************************************/
article h1 {
    border-bottom: 2px solid #004666;
    color: #303030;
}

article p {
    color: #303030;
}



/**********************************************************
 *  Contacts.css, Tenant.css
 **********************************************************/
.avatar {
    -webkit-box-shadow: 0 0 0 3px #004666, 0 0 0 8px #fff;
    box-shadow: 0 0 0 3px #004666, 0 0 0 8px #fff;
}

/* Contacts */
.followers-title {
    color: #303030;
}

.occupation {
    color: #303030;
}

/**********************************************************
 *  Drawing.css
 **********************************************************/

thead.drw-headerBorder {
  border-bottom: 3px solid #004666;
}

.drw-table tbody tr:hover {
  /*background: rgba(0,169,121,0.6);*/
  background-color: #004666;
}