@import "Fonts/Akzidenz-Grotesk Std Bold Cnd.css";
@import "Fonts/Akzidenz-Grotesk Std Cnd.css";
@import "Fonts/Akzidenz-Grotesk Std ExtraBold.css";
@import "Fonts/Akzidenz-Grotesk Std Light Cnd.css";
@import "Fonts/Akzidenz-Grotesk Std Med Cnd.css";
@import "Fonts/Akzidenz-Grotesk Std XBd Cnd.css";

:root {
    --main-theme-color-1: #B0C204;
    --main-theme-color-2: #F29400;
    --main-theme-color_rgba-1: rgba(242,148,0);
}

/*Using the main variables does not work in Internet Explorer don't know about edge yet.
Instead of using the color for example #B0C204 everywere the idea is to use the above variable:
    background-color: #B0C204;
    becomes
    background-color: var(--main-theme-color-1);
*/

/**********************************************************
 *  Specific customer styles and Overides. (Should not be copied when setting up new customer)
 **********************************************************/

body {
    /*Förvaltarens font. Otf-files (AkzidGro) Needs to be installed in control panel under fonts. (Drag and drop from file explorer) 
        Will only install these on Förvaltarens production server. No need for them to exist in their Azure test site or on local developer machine except if performing changes related
        to their font in which these files can be temporary installed. Förvaltaren has a license to use this specific font.
    */

    /*font-family: 'Akzidenz-Grotesk Std' !important;*/
    font-family: 'Akzidenz-Grotesk Std Cnd' !important;
}


/**********************************************************
 *  Kendo Overide
 **********************************************************/
/*Kendo.Button */
.k-button, .k-button:focus {
    color: #B0C204 !important;
    font-weight: bold !important;
    background-color: #fff;
    border-radius: 4px;
}

.k-overflow-container .k-primary, .k-primary {
    color: #B0C204 !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: #B0C204 !important;
}

.k-button.k-state-active {
    color: #FFFFFF !important;
    border-color: transparent !important;
    background-color: #B0C204 !important;
}


/*Tabstrip*/
.k-panelbar > li.k-state-default > .k-link, .k-tabstrip-items .k-state-default .k-link {
    color: #B0C204;
}

.k-tabstrip-items .k-state-hover.k-link {
    color: #B0C204;
}

/*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: #B0C204;
}

/*Checkbox*/
.k-checkbox:checked {
    color: #B0C204;
    background-color: #FFFFFF;
    border-color: #B0C204 !important;
}

    .k-checkbox:checked:focus {
        -webkit-box-shadow: 0 0 0 2px rgba(242,148,0,.3);
        box-shadow: 0 0 0 2px rgba(242,148,0,.3);
        border-color: #B0C204;
    }

/**********************************************************
 *  Valett Ctrls
 **********************************************************/

/*Theme button*/
.v-theme {
    background-color: #B0C204;
}

    .v-theme:hover {
        box-shadow: 0 0 0 2px white, 0 0 0 3px #B0C204;
    }

    .v-theme.inverted {
        background-color: #FFFFFF;
        color: #B0C204 !important;
        border: 1px solid #B0C204;
    }

/*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 #B0C204 !important;
    -webkit-box-shadow: inset 0 0 0 2px #B0C204 !important;
    box-shadow: inset 0 0 0 2px #B0C204 !important;
}

.vex.vex-theme-top .vex-dialog-button.vex-dialog-button-primary {
    background: #B0C204 !important;
}

/**********************************************************
 *  Loaders
 **********************************************************/
#loader-2 span {
    background-color: #B0C204;
}

/**********************************************************
 *  This Theme
 **********************************************************/

/*Link*/
a {
    color: #B0C204;
    font-weight: bold;
    text-decoration: none;
    font-size: small;
}

    a:hover {
        color: #B0C204;
    }

    a:focus {
        color: #B0C204;
    }

/*Text and backgroundColors*/
.theme-textcolor {
    color: #B0C204;
}

.theme-textcolor2 {
    color: #F29400;
}

.theme-bgcolor {
    background-color: #B0C204;
}

.theme-bgcolor2 {
    background-color: #F29400;
}

/**********************************************************
 *  Loaders
 **********************************************************/
#loader-2 span {
    background-color: #B0C204;
}

/*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: #B0C204 !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 #B0C204;                
    }

    .nav-link.active > .nav-link-title {        
        border-bottom: 5px solid #B0C204;                
    }

    .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: #B0C204;
}

.itemSlider > ul > li:hover {
    background-color: #B0C204;
}

.roomSlider > ul > .showli {
    background-color: #B0C204;
}

.roomSlider > ul > li:hover {
    background-color: #B0C204;
}

/**********************************************************
 *  LoginPartial.cshtml
 **********************************************************/
.profile-info {
    color: #343434;
}

.profile-context-menu > label > ul {
    /*border: 2px solid #B0C204;*/
    border: 2px solid #333333;
}

.mainProfile-button > span {
    color: #B0C204;
}



/**********************************************************
 *  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 #4dffdb;*/
    /*border-bottom: 7px solid #328953;*/
    /*border-bottom: 7px solid #B0C204;
    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;
    }*/

.login-block {
    text-align: center;
    width: 360px;
    padding: 20px;
    background: #fff;
    /* border-bottom: 7px solid #4dffdb; */
    /* border-bottom: 7px solid #328953; */
    border-bottom: 7px solid #B0C204;
    margin: 0 auto;
    border-radius: 10px;
    box-shadow: 0 4px 8px 0 rgb(0 0 0 / 20%), 0 6px 20px 0 rgb(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: 16px;
        /* 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 #B0C204;
}



/**********************************************************
 *  Room.css
 **********************************************************/

h1.top-content {
    color: #303030;
}

.top-content_text {
    color: #303030;
}

.top-content_line {
    border-top: solid 4px #B0C204;
}

/*a.finalize-link {
    color: #303030;    
}
a.finalize-link:hover {
    color: #B0C204;        
}*/

.finalize-button {
    background-color: #B0C204;
    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(242,148,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: #B0C204;
    }

.ChPeriodTabLink {
    color: #B0C204;
}

    .ChPeriodTabLink:hover {
        color: #B0C204;
    }

    .ChPeriodTabLink:visited {
        color: #B0C204;
    }

.arrow-up {
    border-bottom: 10px solid #B0C204;
}

.arrow-down {
    border-top: 10px solid #B0C204;
}

/* MadeChoices - ChoiceGroupsView */

progress {
    border: solid 1px #B0C204;
}

    progress::-webkit-progress-value {
        background: #B0C204;
    }

    progress::-moz-progress-value {
        background: #B0C204;
    }

.progress_value {
    color: #B0C204;
}

.ChGrp-flex-item.active {
    background-color: #B0C204;    
}




/* MadeChoicesViews */
.cgi-header {
    background: rgba(242,148,0,0.5);
}


/**********************************************************
 *  MadeChoices/NavButton.css
 **********************************************************/

.navmenu ul.text-list li.active a {
    color: #B0C204;
}

.navmenu ul.text-list li a:hover {
    color: #B0C204;
}

/**********************************************************
 *  NewsArticles.css
 **********************************************************/
.newsArticle-header-main {
    border-bottom: 2px solid #B0C204;
    color: #303030;
}


/**********************************************************
 *  Information.css
 **********************************************************/
article h1 {
    border-bottom: 2px solid #B0C204;
    color: #303030;
}

article p {
    color: #303030;
}



/**********************************************************
 *  Contacts.css, Tenant.css
 **********************************************************/
.avatar {
    -webkit-box-shadow: 0 0 0 3px #B0C204, 0 0 0 8px #fff;
    box-shadow: 0 0 0 3px #B0C204, 0 0 0 8px #fff;
}

/* Contacts */
.followers-title {
    color: #303030;
}

.occupation {
    color: #303030;
}

/**********************************************************
 *  Drawing.css
 **********************************************************/

thead.drw-headerBorder {
  border-bottom: 3px solid #B0C204;
}

.drw-table tbody tr:hover {
  /*background: rgba(0,169,121,0.6);*/
  background-color: #B0C204;
}