@import url("Theme.Kentro_Konnekt.css?11222");

/**/
/* Arto Fonts */
/**/

/**/
/* Free Google Font */
/**/
@import url(https://fonts.googleapis.com/css?family=Roboto);

h1,
h2,
h3,
.Heading1,
.Heading2,
.Heading3,
.Button {
    font-family: 'Roboto', sans-serif;
}

/**/
/* General CSS */
/**/
html, body, a, select, fieldset, input, button, select, textarea, optgroup, option {
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    font-weight: 300;
}

body {
    background: #ffffff;
    color: #444444;
    line-height: 18px;
}

h1
.Heading1 {
    font-weight: normal;
    font-size: 1em;
    line-height: 1.5em;
    margin: 0 0 1.5em;
}

h2,
h3,
h4,
h5,
h6,
.Heading2,
.Heading3,
.Heading4,
.Heading5,
.Heading6 {
    color: #cf0a2d; /* base color */
    font-weight: normal;
    font-size: 1em;
    line-height: 1.5em;
    margin: 0 0 1.5em;
}

h1,
.Heading1 {
    color: #cf0a2d;
    font-size: 26px;
    font-weight: 300;
    margin-bottom: 1em;
    margin-top: 1em;
    line-height: 1em;
}

h2,
.Heading2 {
    font-size: 22px;
    line-height: 1em;
    margin-bottom: .75em;
}

h3,
.Heading3 {
    font-size: 18px;
    margin-bottom: .75em;
}

h4,
h5,
h6,
.Heading4,
.Heading5,
.Heading6 {
    font-family: 'Roboto', sans-serif;                                                                                                                          
}

a,
a:link,
a:visited {
    color: #cf0a2d;
    text-decoration: none;
}

a:hover {
    color: #1d2f55;
}

.Content,
.MainContent {
    background: #ffffff;
    padding-top: 0px;
}

.tablet .MainContent,
.phone .MainContent {
    background: #ffffff;
    padding-top: 15px;
}

html .ThemeGrid_Container {
    padding-left: 0;
    padding-right: 0;
}

html .tablet .ThemeGrid_Container,
html .phone .ThemeGrid_Container {
    padding-left: 10px;
    padding-right: 10px;
}

.Turquoise,
.Silver {
    background-color: #d8d8d8;
    color: #555555;
}

.White {
    background-color: #ffffff;
}

/**/
/* General */
/**/
.Header {
    background: url("https://www.arto.nl/_images_upload/XbFzHYVaiLBkMlFE.jpg") no-repeat center 30%;
    background-size: 100% auto;
    z-index: 2;
    position: unset;
}

.desktop .Header {
    height: 265px;
}

.Header,
.Header_Menu,
.Application_Menu,
.Menu_DropDownPanel a.Menu_SubMenuItem,
.Menu_DropDownPanel a.Menu_SubMenuItem:link,
.Menu_DropDownPanel a.Menu_SubMenuItem:visited,
.Calendar-day-selected,
.Calendar-day-selected:hover,
.calendarPattern tbody td.selected,
div.os-internal-Popup .os-internal-ui-dialog .os-internal-ui-dialog-titlebar,
div.os-internal-Popup.os-internal-ui-dialog .os-internal-ui-dialog-titlebar {
    background-color: transparent;
}

.Footer {
    background-color: #2d3942;
    color: #ffffff;
    bottom: 0;
    left:0;
    position: fixed;
}

.Header_Menu {
    margin-top: 25px important!;
}

.Application_Title {
    overflow: visible;
    position: relative;
}

.Application_Title a {
    padding-left: 170px;
    font-size: 0px;
}

.Application_Title a.kk-header-logo {
    height: 80px;
    left: 0;
    padding-left: 0;
    position: absolute;
    top: 10px;
    width: 119px;
    z-index: 1;
}

.Application_Title a.kk-header-logo,
.Application_Title a.kk-header-logo img {
    max-height: 105px;  /*88px*/
    width: 200px; /*180px*/
    top: 65px;
}

.desktop .Application_Menu {
    margin-left: 250px;
}

.tablet .Application_Title a,
.phone .Application_Title a {
    padding-left: 85px;
}

.tablet .Application_Title a.kk-header-logo,
.phone .Application_Title a.kk-header-logo {
    height: 40px;
    left: 10px;
    padding-left: 0;
    top: 2px;
    width: 59px;
}

.tablet .Application_Title a.kk-header-logo,
.phone .Application_Title a.kk-header-logo,
.tablet .Application_Title a.kk-header-logo img,
.phone .Application_Title a.kk-header-logo img {
    max-height: 40px;
    width: 110px;
}

.Menu_TopMenu a:link, .Menu_TopMenu a:visited, .Menu_TopMenu a {
    color: #ffffff;
}

.Menu_TopMenuActive,
.Menu_DropDownButton {
    background-color: transparent;
    color: #ffffff;
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    letter-spacing: 1px;
    box-shadow: none;
}

.Menu_TopMenu .Menu_DropDownArrow {
    border: none;
    top: 40%;
 }

.Title_Section {
    margin-top: 0px;
    width: 100%;
}

.Menu_TopMenu:not(.Menu_TopMenuActive) 
.Menu_DropDownArrow {
    top: 38%;
    color:#ffffff !important;
    border-style: none;
}

.Header_Menu,
.Application_Menu,
.Menu_TopMenu a:hover,
.Menu_TopMenu:hover,
.Menu_DropDownButton.open .Menu_TopMenu {
    background: transparent;
    box-shadow: none;
    color: #444444;
}

.Menu_DropDownArrow:after {
    display: inline-block;
    color:#ffffff !important;
    content: "\f063";
    font-family: FontAwesome;
    font-size: 14px;
    position: absolute;
    left: -0px;
    top: 5px;
}

.Menu_DropDownButton:hover .Menu_DropDownPanel {
    display:block !important;
}

.Menu_TopMenuActive a:link,
.Menu_TopMenuActive .Menu_DropDownArrow,
.Menu_DropDownButton:hover .Menu_TopMenu a,
.Menu_DropDownButton.open .Menu_TopMenu a {
    background: transparent;
    color: #ffffff;
}

.desktop .Menu_TopMenuActive a:link,
.desktop .Menu_TopMenuActive .Menu_DropDownArrow,
.desktop .Menu_DropDownButton:hover .Menu_TopMenu a,
.desktop .Menu_DropDownButton.open .Menu_TopMenu a {
    padding-bottom: 22px;
}

.Menu_DropDownPanel a.Menu_SubMenuItem,
.Menu_DropDownPanel a.Menu_SubMenuItem:link,
.Menu_DropDownPanel a.Menu_SubMenuItem:visited {
    background-color: #ffffff; /* 10% of base color */
    color: #444444;
    padding-right: 60px;
}

.Menu_DropDownPanel a.Menu_SubMenuItem.kk-ActiveSubmenuItem {
    background-color: #ffffff;
    color: #444444 !important;
    text-decoration: none;
}

.Menu_DropDownPanel {
    background-color: #ffffff;
    margin-top: 4px;
    margin-left: 20px;
}

.Login_Info .Logout_Button {
    display: none;
}

.Login_Info {
    color: #ffffff; 
    position: relative;
    z-index: 10;
    margin-top: 0 !important;
}

.Login_Info_Logout,
.Login_Info_Username,
.Login_Info_Logout:before,
.Login_Info_Username:before {
    color: #ffffff !important;
    transition: none;
}

.Login_Info_Logout:hover:before {
    color: #cf0a2d !important;
}

.Login_Info .Login_Info_Username {
    color: #ffffff;
    padding-right: 10px;
}

.phone .Login_Info {
    background: none;
    margin: 0;
    padding: 0;
    width: 0;
}

.tablet.active .Login_Info_Logout,
.phone.active .Login_Info_Logout {
    text-decoration: none;
}

.tablet.active .Login_Info_Logout,
.phone .Login_Info_Logout,
.phone .Login_Info_Logout:before,
.tablet .Login_Info_Logout:before,
.phone .Login_Info_Username,
.phone .Login_Info_Username:before {
    color: #ffffff !important;
}

.kk-social-login-separator-text .OSInline {
    background: #f5f5f5;
}

/* Sidebar navigation */
.kk-sidebar-navigation {
    margin-top: 1em;
    padding-right: 30px;
}

.kk-sidebar-navigation .kk-sidebar-navigation__module:not(:first-child) {
    margin-top: 20px;
}

.kk-sidebar-navigation .kk-sidebar-navigation__module .kk-sidebar-navigation__list-title {
    color: #cf0a2d;
    height: 40px;
    line-height: 40px;
    padding: 10px 20px;
    margin-bottom: 0;
}

.kk-sidebar-navigation .kk-sidebar-navigation__module .kk-sidebar-navigation__list {
    border-bottom: 1px solid #444444;
    margin-top: 0;
    padding-top: 10px;
    padding-bottom: 10px;
}

.kk-sidebar-navigation .kk-sidebar-navigation__module .kk-sidebar-navigation__list a,
.kk-sidebar-navigation .kk-sidebar-navigation__module .kk-sidebar-navigation__list a.Active {
    color: #444444 !important;
    font-weight: normal;
    line-height: 34px;
    padding: 0 20px;
    text-decoration: none;
}

.kk-sidebar-navigation .kk-sidebar-navigation__module .kk-sidebar-navigation__list a:hover {
    color: #cf0a2d !important;
    padding-left: 0px;
    margin-left: 20px;
}

/* Home page profile information blocks */
.kk-profile-short {
    margin-bottom: 40px;
}

.kk-profile-short .Columns {
    display: flex;
    margin-left: -10px;
    margin-right: -10px;
    width: auto;
}

.kk-profile-short .Columns .Column {
    display: flex;
    flex: 1 0 auto;
    padding: 0 10px;
}

.kk-profile-short .kk-homepage-block__personal-details,
.kk-profile-short .kk-homepage-block__contact-details {
    height: 100%;
}

.kk-profile-short .kk-highlighted-block .Section {
    position: relative;
    padding: 0 20px;
    background: #d8d8d8;
    margin-top: 0 !important;
    height: 100%;
}

.kk-profile-short .kk-homepage-block__personal-details .Section_header,
.kk-profile-short .kk-homepage-block__contact-details .Section_header {
    padding-top: 10px;
}

.kk-profile-short .kk-homepage-block__personal-details .Section_header .Section__title,
.kk-profile-short .kk-homepage-block__contact-details .Section_header .Section__title {
    margin-bottom: 0;
}

.kk-profile-short .kk-homepage-block__personal-details .Section_content,
.kk-profile-short .kk-homepage-block__contact-details .Section_content {
    padding-bottom: 10px;
}

.kk-profile-short .kk-homepage-block__personal-details .Section_content .Box,
.kk-profile-short .kk-homepage-block__contact-details .Section_content .Box {
    background-color: transparent;
    margin-bottom: 0;
    padding-bottom: 0;
}

/* Homepage completeness block */
.kk-completeness {
    margin-bottom: 60px;
}
.kk-completeness .Completeness {
    background: -webkit-linear-gradient(left, #fce8e8, #cf0a2d); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(right, #fce8e8, #cf0a2d); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(right, #fce8e8, #cf0a2d); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to right, #fce8e8, #cf0a2d); /* Standard syntax */
}
.CompletenessContainer .InfoIcon {
    background-color: #ffffff;
    color: #cf0a2d;
}

/* Homepage blocks icons */
.kk-homepage-block__personal-details .Section_header .Section__title:before,
.kk-homepage-block__contact-details .Section_header .Section__title:before,
.kk-homepage-block__background .Section_header .Section__title:before,
.kk-homepage-block__my-application .Section_header .Section__title:before,
.kk-homepage-block__timesheets .Section_header .Section__title:before,
.kk-homepage-block__contractors-CP .Section_header .Section__title:before,
.kk-homepage-block__timesheet-overview .Section_header .Section__title:before,
.kk-homepage-block__payments .Section_header .Section__title:before,
.kk-homepage-block__reservations .Section_header .Section__title:before {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    transform: translate(0, 0);
    width: 1.28571429em;
    text-align: center;
    margin-right: 5px;
}

.kk-homepage-block__contact-details .Section_header .Section__title:before {
    content: "\f007"; /* user */
}

.kk-homepage-block__personal-details .Section_header .Section__title:before {
    content: "\f05a"; /* info circle */
}

.kk-homepage-block__background .Section_header .Section__title:before {
    content: "\f0b1"; /* briefcase */
}

.kk-homepage-block__my-application .Section_header .Section__title:before {
    content: "\f0f3"; /* bell */
}

.kk-homepage-block__timesheets .Section_header .Section__title:before {
    content: "\f017"; /* clock */
}

.kk-homepage-block__contractors-CP .Section_header .Section__title:before {
    content: "\f1ad"; /* building */
}

.kk-homepage-block__timesheet-overview .Section_header .Section__title:before {
    content: "\f022"; /* list */
}

.kk-homepage-block__payments .Section_header .Section__title:before {
    content: "\f0d6"; /* money */
}

.kk-homepage-block__reservations .Section_header .Section__title:before {
    content: "\f185"; /* sun */
}

.phone .kk-profile-short .Columns,
.tablet .kk-profile-short .Columns {
    display: block;
}

.phone .kk-profile-short .Columns .Column,
.tablet .kk-profile-short .Columns .Column {
    width: 100%;
    margin-bottom: 10px !important;
}

/* Application_Menu tablet & phone */
.phone .Header_RightSection,
.tablet .Header_RightSection {
    position: relative;
    z-index: 11;
}

.tablet .Application_Menu,
.phone .Application_Menu {
    background-color: #ffffff;
}

.tablet .Header_RightSection,
.phone .Header_RightSection,
.tablet a.Header_ButtonMenu,
.phone a.Header_ButtonMenu {
    width: 50px;
}

.tablet a.Header_ButtonMenu,
.phone a.Header_ButtonMenu {
    background-color: #cf0a2d;
    color: #ffffff;
    margin-left: 10px;
    text-align: center;
}

.tablet .Menu_DropDownButton.open:hover .Menu_DropDownArrow,
.phone .Menu_DropDownButton.open:hover .Menu_DropDownArrow {
    xxtransform: rotate(180deg);
    xxtop: 30px;
}

.tablet.active a.Header_ButtonMenu,
.phone.active a.Header_ButtonMenu,
.tablet .Application_Menu,
.phone .Application_Menu,
.tablet .Menu_DropDownButton.open,
.phone .Menu_DropDownButton.open {
    background-color: #cf0a2d;
    color: #ffffff;
}

.tablet .Application_Menu a,
.phone .Application_Menu a,
.tablet .Application_Menu a:link,
.phone .Application_Menu a:link,
.tablet .Application_Menu a:visited,
.phone .Application_Menu a:visited {
    border-bottom: none;
    color: #ffffff;
    text-align: center;
}

.tablet .Application_Menu .Menu_TopMenu,
.phone .Application_Menu .Menu_TopMenu {
    height: auto;
}

.tablet .Application_Menu .Menu_TopMenu a:hover,
.tablet .Application_Menu .Menu_TopMenu a:active,
.phone .Application_Menu .Menu_TopMenu a:hover,
.phone .Application_Menu .Menu_TopMenu a:active,
.tablet .Menu_TopMenuActive,
.phone .Menu_TopMenuActive {
    background-color: #cf0a2d;
    color: #ffffff;
}

.Menu_DropDownPanel a,
.Menu_DropDownPanel a:link,
.Menu_DropDownPanel a:visited {
    font-size: 14px;
}

.tablet .Menu_DropDownPanel,
.phone .Menu_DropDownPanel {
    background-color: #cf0a2d;
}

.tablet .Menu_DropDownPanel a.Menu_SubMenuItem.kk-ActiveSubmenuItem,
.phone .Menu_DropDownPanel a.Menu_SubMenuItem.kk-ActiveSubmenuItem {
    background-color: #cf0a2d !important;
    color: #444444 !important;
}

.Menu_DropDownButton:hover .Menu_DropDownPanel {
    display:block !important;
}

.Menu_DropDownButton .Menu_DropDownPanel a.Menu_SubMenuItem,
.Menu_DropDownButton .Menu_DropDownPanel a.Menu_SubMenuItem:link {
    background: none;
    border-bottom: none;
    border-top-width: 0;
    padding-left: 15px;
    text-transform: none;
}

.Menu_DropDownButton .Menu_DropDownPanel a.Menu_SubMenuItem:hover {
    color: #cf0a2d;
}

.tablet .Menu_DropDownButton .Menu_DropDownPanel a.Menu_SubMenuItem,
.phone .Menu_DropDownButton .Menu_DropDownPanel a.Menu_SubMenuItem,
.tablet .Menu_DropDownButton .Menu_DropDownPanel a.Menu_SubMenuItem:link,
.phone .Menu_DropDownButton .Menu_DropDownPanel a.Menu_SubMenuItem:link,
.tablet .Menu_DropDownButton .Menu_DropDownPanel a.Menu_SubMenuItem:hover,
.phone .Menu_DropDownButton .Menu_DropDownPanel a.Menu_SubMenuItem:hover {
    background-color: #cf0a2d;
    color: #444444;
    padding-left: 0px;
    padding-right: 0px
}

.tablet .Application_Menu .Menu_TopMenu .Menu_DropDownArrow,
.phone .Application_Menu .Menu_TopMenu .Menu_DropDownArrow {
    color:#ffffff !important;
    border-width: 6px 6px 0;
    padding-right: 20px
}

/**/
/* Classes */
/**/
.kk-simple-layout .phone.portrait .kk-BackLinkContainer {
    margin-top: -10px;
}

.kk-simple-layout .phone.landscape .kk-BackLinkContainer,
.kk-simple-layout .tablet .kk-BackLinkContainer {
    margin-top: 40px;
}

/**/
/* Forms */
/**/
.Form:not(.form-top) label {
    color: #555555;
    padding-top: 6px;
}

.Form label.MandatoryLabel:after {
    color: #c73127;
}

.Form a.SmartInput_Undo {
    padding-top: 6px;
}

textarea,
select,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.Form input.ReadOnly,
.Form textarea.ReadOnly,
.Form select.ReadOnly {
    font-size: 14px !important;
    line-height: normal !important; /* fix for KK-304 */
}

input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"] {
    height: 30px !important;
}

.Form input.ReadOnly:not(.Not_Valid),
.Form textarea.ReadOnly:not(.Not_Valid),
.Form select.ReadOnly:not(.Not_Valid) {
    border-color: #d8d8d8;
}

select {
    height: 30px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

select:focus,
input[type="text"]:focus {
    border-color: #444444;
}

.tablet input[type="text"],
.phone input[type="text"],
.tablet input[type="password"],
.phone input[type="password"],
.tablet input[type="datetime"],
.phone input[type="datetime"],
.tablet input[type="datetime-local"],
.phone input[type="datetime-local"],
.tablet input[type="date"],
.phone input[type="date"],
.tablet input[type="month"],
.phone input[type="month"],
.tablet input[type="time"],
.phone input[type="time"],
.tablet input[type="week"],
.phone input[type="week"],
.tablet input[type="number"],
.phone input[type="number"],
.tablet input[type="email"],
.phone input[type="email"],
.tablet input[type="url"],
.phone input[type="url"],
.tablet input[type="search"],
.phone input[type="search"],
.tablet input[type="tel"],
.phone input[type="tel"],
.tablet input[type="color"],
.phone input[type="color"],
.tablet select,
.phone select {
    height: 30px !important;
}

html input[type="radio"],
html input[type="checkbox"] {
    height: 12px;
    width: 12px;
}

input[type="checkbox"]:after {
    border: 3px solid #cf0a2d;
    border-right: 0;
    border-top: 0;
    left: 15%;
    top: 5%;
}

.phone .Button,
.tablet .Button,
.phone a.Button,
.tablet a.Button {
    height: 30px !important;
    line-height: 30px !important;
}

.Button input:not([type=radio]) {
    background-color: #ffffff;
    border: 1px solid #cf0a2d;
    color: #cf0a2d;
    font-size: 14px;
    height: 30px;
    padding: 0px 58px 13px 20px;
    text-decoration: none;
    transition: background-color .2s ease-in;
    background-image: url(../KentroKonnekt/img/Artoarrowrightred.png?11170);
    background-position: right 20px center;
    background-repeat: no-repeat;
}

.Button.ButtonDefault,
.Button.Is_Default,
.Button.Button.Is_Default {
    background-color: #ffffff;
    border: 1px solid #cf0a2d;
    color: #cf0a2d;
    padding: 0px 58px 13px 20px;
    text-decoration: none;
    background-image: url(../KentroKonnekt/img/Artoarrowrightred.png?11170);
    background-position: right 20px center;
    background-repeat: no-repeat;
}

.Button:hover,
.desktop .Button:hover,
.Button.ButtonDefault:hover,
.desktop .Button.ButtonDefault:hover,
.Button.Is_Default:hover,
.Button.Button.Is_Default:hover {
    background-color: #cf0a2d;
    border-color: #cf0a2d;
    box-shadow: none;
    color: #ffffff !important;
    background-image: url(../KentroKonnekt/img/Artoarrowrightwhite.png?11170);
    background-position: right 20px center;
    background-repeat: no-repeat;
}

a.Button {
    background-color: #ffffff;
    color: #cf0a2d !important;
    border: 1px solid #cf0a2d;
    font-size: 14px;
    height: 30px;
    padding: 0 20px;
    text-decoration: none;
    transition: background-color .2s ease-in;
}

a.Button:hover,
a.Button:active,
a.Button:visited {
    background-color: #cf0a2d !important; 
    box-shadow: none;
    color: #ffffff;
    }  

.ValidationMessage {
    background-color: #f4d6d4;
    color: #c73127;
}

.ValidationMessage:after {
    background-color: #f4d6d4;
}

/**/
/* Patterns */
/**/
.AccordionVertical > .AccordionVertical_item > .AccordionVertical__header > .AccordionVertical___title {
    color: #cf0a2d;
}

div.calendar tbody th.hilite,
div.calendar tbody td.hilite,
div.calendar .combo .hilite {
    background: #fce8e8 !important;
}

div.calendar tbody td.selected,
div.calendar tbody th.selected,
div.calendar tbody tr.rowhilite td.selected,
div.calendar .combo .active {
    background: #cf0a2d !important;
}

/* an empty div as a placeholder, so the calendar-dropdown would fit the page*/
.desktop div.kk-OR-calendar-height-placeholder {
    margin-top:210px !important;
}
.desktop div.kk-VA-calendar-height-placeholder {
    margin-top:80px !important;
}

/* Section + SectionExpandable */
.Section > .Section_header,
.SectionExpandable > .SectionExpandable_header {
    border-bottom-color: #cf0a2d;
}

.SectionExpandable > .SectionExpandable_header > .SectionExpandable__icon {
    color: #cf0a2d;
}

/* Box */
.Section > .Section_content > .Box,
.SectionExpandable.expanded > .SectionExpandable_content > .Box {
    background-color: #ffffff;
    padding-left: 0;
    padding-right: 0;
    padding-top: 0 !important;
}

.Box + .Box {
    margin-top: -30px;
}

.kk-profile-status .Box {
    padding-left: 0;
    padding-right: 0;
}

/* ButtonGroup */
.ButtonGroup {
    outline: 1px solid transparent;
    width: 100%;
}

.ButtonGroup_button.Button {
    background-color: #ffffff;
    border: 1px solid #cf0a2d;
    border-left-width: 0;
    color: #000000;
    font-family: 'Roboto', sans-serif;                                                                                                                          
    font-size: 14px;
    height: 30px;
    line-height: 28px;
    margin-left: 0 !important;
    padding: 0px 58px 13px 20px;
    -webkit-transition: all .2s ease-in;
    transition: all .2s ease-in;
}

.ButtonGroup_button.Button:first-child {
    border-color: #cf0a2d !important;
    border-left-width: 1px;
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px;
}

.ButtonGroup_button.Button:last-child {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
}

.desktop .ButtonGroup_button.Button.active,
.tablet .ButtonGroup_button.Button.active,
.phone .ButtonGroup_button.Button.active {
    background-color: #cf0a2d !important;
    border-color: #cf0a2d !important;
    box-shadow: none !important;
    color: #ffffff !important;
}

.ButtonGroup_button.Button:hover {
    background: #cf0a2d !important;
    border-color: #cf0a2d !important;
    color: #ffffff !important;
}

.desktop .ButtonGroup_button.Button.active:hover,
.tablet .ButtonGroup_button.Button.active:hover,
.phone .ButtonGroup_button.Button.active:hover {
    background-color: #cf0a2d !important;
    border-color: #cf0a2d !important;
    color: #ffffff !important;
    cursor: default !important;
}

/* FileUpload */
.FileUpload {
    background-color: #f1f1f1;
    border: none;
}

.kk-link-FileUpload > .Box.Silver {
    border: none;
}

/* NavigationBar */
.NavigationBar a.Active {
    color: #444444;
}

.NavigationBar a.Active:not(.IE8):before {
    border-bottom-color: #cf0a2d;
}

.NavigationBar a.Active:after {
    background-color: #cf0a2d;
}

/* NavigationBar styles as Tabs */
.NavigationBar_wrapper {
    padding-top: 10px;
}

.NavigationBar {
    position: relative;
}

.NavigationBar:after {
    background-color: #d8d8d8;
    bottom: -1px;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    right: 0;
    width: 100%;
}

.NavigationBar,
.NavigationBar a {
    background-color: #f1f1f1;
}

.NavigationBar a,
.NavigationBar a:link,
.NavigationBar a:visited {
    color: #9b9b9b;
    padding: 10px 25px;
}

.NavigationBar a:after,
.NavigationBar a:link:after {
    left: 0;
    right: 0;
    width: 100%;
}

.NavigationBar a.Active {
    background-color: #ffffff;
    color: #444444;
    cursor: default;
}

.NavigationBar a.Active:not(.ie7):before,
.NavigationBar a.Active:not(.ie8):before {
    border-bottom: 4px solid #ffffff;
    border-left-width: 0;
    border-right-width: 0;
    bottom: -1px;
    left: 0;
    margin-left: 0;
    right: 0;
    width: 100%;
    z-index: 1;
}

.NavigationBar a.Active:after {
    bottom: auto;
    top: 0;
}

.desktop .NavigationBar a.Active:hover:after,
.desktop .NavigationBar a.Active:link:hover:after {
    background-color: #cf0a2d;
}

/* Tile */
.Tile .Heading2 {
    color: #cf0a2d !important;
    margin-bottom: .2em;
}

/* Tabs */
.Tabs,
.Tabs_body,
.Tabs__tab,
.Tabs__tab.active,
.Tabs__tab:hover,
.TableRecords,
.desktop .TableRecords > tbody > tr:hover,
.desktop .EditableTable > tbody > tr:hover td,
.tablet .TableRecords > tbody > tr:hover,
.tablet .EditableTable > tbody > tr:hover td,
.phone .TableRecords > tbody > tr:hover,
.phone .EditableTable > tbody > tr:hover td {
    background-color: #f5f5f5;
}

.Tabs .Tabs_header .Tabs__tab span.kk-timesheetRejectedTab {
    background-color: #f5f5f5;
    color: #c70028;
}

.LoginRegister .Tabs,
.LoginRegister .Tabs__tab.active {
    border: 1px solid #f5f5f5;
}

.Separator {
    border-bottom: 1px solid #444444;
}

/* CardFlip */
.kk-form-flipcard-front,
.kk-form-flipcard-back {
    height: 160px;
    outline: 1px solid transparent;
    padding: 30px;
}

.kk-form-flipcard-front {
    background: #cf0a2d;
    color: #ffffff;
    cursor: pointer;
    font-size: 1.5em;
    height: 160px;
    line-height: 1.25em;
    padding-left: 180px;
    padding-top: 40px;
    position: relative;
}

.kk-form-flipcard-front:before {
    content: "";
    display: block;
    height: 118px;
    left: 0;
    margin-top: -59px;
    position: absolute;
    top: 50%;
    width: 160px;
    z-index: 1;
}

.kk-form-flipcard-back {
    background: #f1f1f1;
}

.kk-form-flipcard-front > .fa.fa-fw.fa-angle-right.fa-lg,
.kk-form-flipcard-back > .fa.fa-fw.fa-angle-left.fa-lg {
    bottom: 5px;
    position: absolute;
}

.kk-form-flipcard-front > .fa.fa-fw.fa-angle-right.fa-lg {
    right: 0;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}

.kk-form-flipcard-back > .fa.fa-fw.fa-angle-left.fa-lg {
    left: 0;
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

/* ===================================================
Language
=================================================== */
.kk-language-container-menu {
   /* margin-right: 10px;*/
}

.kk-language-link {
    padding: 8px 10px 0 0;
}

.phone .kk-language-link {
    padding: 8px 10px 0 0;
}

.kk-selected-language-link {
    opacity: 0.5;
}

/* ===================================================
Konnekt Classes
=================================================== */
.kk-welcome-box {
    background-color: transparent;
    margin-bottom: 20px;
}

.kk-page-content {
    padding: 0;
    padding-left: 20px;
    padding-right: 20px;
}

.kk-form-disclaimer-checkbox .Float_left input[type="checkbox"] {
    margin-top: 8px;
}

.kk-vacancy-list {
    border-top-color: #cf0a2d;
    padding-left: 0;
    padding-right: 0;
}

.kk-vacancy-list:first-child {
    padding-top: 0;
}

.kk-vacancy-list .Heading3 a {
    font-family: 'Roboto', sans-serif;
}

a.kk-social-link {
    border-radius: 0;
}

.kk-border {
    border: solid 1px #d8d8d8;
    padding: 10px;
}

/* ===================================================
Open Registration Flow Classes
=================================================== */
.kk-or-wizard {
    margin-bottom: 50px;
    padding-top: 20px;
}

.kk-or-wizard:after {
    border-bottom-color: #cf0a2d;
    top: 86px;
}

.kk-or-wizard > table {
    width: auto;
}

.kk-or-wizard > table td {
    text-align: left;
}

.kk-or-wizard > table td div {
    background-color: #f1f1f1;
    border-radius: 50%;
    height: 42px;
    margin-left: 12px;
    padding: 0;
    text-align: center;
    width: 42px;
}

.kk-or-wizard > table td:first-child div {
    margin-left: 0;
}

.kk-or-wizard > table td div,
.kk-or-wizard > table td div .fa {
    line-height: 42px;
}

.kk-or-wizard > table td div .fa {
    color: #9b9b9b;
}

.kk-or-wizard > table td div.past,
.kk-or-wizard > table td div.past .fa {
    color: #444444;
}

.kk-or-wizard > table td div.active {
    background-color: #ffffff;
}

.kk-or-wizard > table td div.active .fa {
    color: #ffffff;
}

.kk-or-wizard > table td div.active:before,
.kk-or-wizard > table td div.active:after {
    background-color: #ffffff;
}

.kk-or-wizard > table td div.active:before {
    border-color: #cf0a2d;
    height: 14px;
    margin-left: -7px;
    top: 59px;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 14px;
    z-index: 2;
}

.kk-or-wizard > table td div.active:after {
    height: 14px;
    margin-left: -11px;
    top: 68px;
    width: 26px;
    z-index: 3;
}

/* ===================================================
Media Queries
=================================================== */
@media (max-width: 768px) /* tablet portrait and smaller */ {
    .Page.Request .MainContent .kk-request-form-page {
        padding: 0;
        padding-top: 8px;
    }
}

@media (max-width: 320px) /* phone portrait */ {
    .Page.Request .MainContent .kk-request-form-page {
        padding: 0;
        padding-top: 6px;
    }
}

/* ===================================================
Timesheets Flow Classes
=================================================== */
.kk-select-assignment {
    font-family: monospace;
}

.kk-select-assignment option {
    font-family: monospace;
}

/* ===================================================
List Navigation
=================================================== */
.kk-listpagination a.ListNavigation_PageNumber:link,
.kk-listpagination span.ListNavigation_Ellipsis {
    background-color: #ffffff;
    color: #444444;
    border: none;
    text-decoration: none;
}

.kk-listpagination a.ListNavigation_PageNumber:link:hover {
    background-color: #cf0a2d;
    border: none;
    color: white;
    text-decoration: none;
    -webkit-transition: all .2s ease-in;
    transition: all .2s ease-in;
}

.kk-listpagination span.ListNavigation_Ellipsis:hover {
    background-color: #ffffff;
    box-shadow: none;
}

.kk-listpagination span.ListNavigation_CurrentPageNumber {
    background: #cf0a2d;
    color: #ffffff;
}

/*Workaround for IE*/
.desktop .kk-listpagination .ListNavigation_Next, 
.kk-listpagination .ListNavigation_DisabledNext,
.desktop .kk-listpagination .ListNavigation_Next:hover,
.kk-listpagination .ListNavigation_DisabledNext:hover {
    background: #ffffff;
    border:none !important;
    color:#ffffff;
}

.desktop .kk-listpagination .ListNavigation_Next:before,
.desktop .kk-listpagination .ListNavigation_DisabledNext:before {
    content: ">"; 
    color:#cf0a2d;
}

.desktop .kk-listpagination .ListNavigation_Previous, 
.kk-listpagination .ListNavigation_DisabledPrevious,
.desktop .kk-listpagination .ListNavigation_Previous:hover, 
.kk-listpagination .ListNavigation_DisabledPrevious:hover {
    background: #ffffff;
    border:none;
    color:#ffffff;
    width:0px;
}

.desktop .kk-listpagination .ListNavigation_Previous:after,
.desktop .kk-listpagination .ListNavigation_DisabledPrevious:after{
    content: "<"; 
    margin-left: -90px;
    color:#cf0a2d;
}

a.ListNavigation_Next:link:hover,
a.ListNavigation_Previous:link:hover{
    box-shadow:none;
}

.kk-listpagination a.ListNavigation_Next {
    text-decoration:none;
}
.kk-listpagination a.ListNavigation_Previous {
    text-decoration:none;
}

.tablet .kk-listpagination a.ListNavigation_Previous,
.phone  .kk-listpagination a.ListNavigation_Previous,
.tablet .kk-listpagination a.ListNavigation_Next,
.phone  .kk-listpagination a.ListNavigation_Next {
    background-color: #cf0a2d;
    border: none;
    color: #ffffff;
}

/* ===================================================
Positioning containers Invoice Page
=================================================== */
.tablet.portrait .kk-pagination,
.phone .kk-pagination {
    width: 100%;
    text-align: center;
}

.tablet.portrait .kk-listcounter,
.phone .kk-listcounter {
    width: 100%;
    margin-left: 5px !important;
    margin-top: 10px !important;
    text-align: center;
}

/* ==================================================
Alert classes from SilkUIFramework 
===================================================*/
.Alert.Success { 
    background-color: #289614;
    border-color: #289614;
    color: #ffffff;
    text-align:left;
}

.Alert.Error { 
    background-color: #c70028;
    border-color: #c70028;
    color: #ffffff;
    text-align:left;
}

.Alert.Info { 
    background-color: #336ddc;
    border-color: #336ddc;
    color: #ffffff;
    text-align:left;
}