



@font-face {
font-family: "Roboto";
font-style: normal;
font-weight: normal;
src: url(//chayns-res.tobit.com/API/Styles/Font/Roboto/Regular.woff) format("woff"),url(//chayns-res.tobit.com/API/Styles/Font/Roboto/Regular.ttf) format("truetype"),url(//chayns-res.tobit.com/API/Styles/Font/Roboto/Regular.svg) format("svg")
}

@font-face {
font-family: "Roboto";
font-style: italic;
font-weight: normal;
src: url(//chayns-res.tobit.com/API/Styles/Font/Roboto/Italic.woff) format("woff"),url(//chayns-res.tobit.com/API/Styles/Font/Roboto/Italic.ttf) format("truetype"),url(//chayns-res.tobit.com/API/Styles/Font/Roboto/Italic.svg) format("svg")
}

@font-face {
font-family: "Roboto";
font-style: normal;
font-weight: bold;
src: url(//chayns-res.tobit.com/API/Styles/Font/Roboto/Bold.woff) format("woff"),url(//chayns-res.tobit.com/API/Styles/Font/Roboto/Bold.ttf) format("truetype"),url(//chayns-res.tobit.com/API/Styles/Font/Roboto/Bold.svg) format("svg")
}

@font-face {
font-family: "Roboto";
font-style: italic;
font-weight: bold;
src: url(//chayns-res.tobit.com/API/Styles/Font/Roboto/ItalicBold.woff) format("woff"),url(//chayns-res.tobit.com/API/Styles/Font/Roboto/ItalicBold.ttf) format("truetype"),url(//chayns-res.tobit.com/API/Styles/Font/Roboto/ItalicBold.svg) format("svg")
}

/*--------------------------------------CustomCSS--------------------------------------*/

.accordion__head .arrow:before, .accordion__head:before, .accordion__item .arrow:before, .accordion__item:before {
    color: #fff !important;
}

#descriptionText {
    color: rgba(253, 253, 253, 0.5) !important;
}

.ChaynsIDActive {
    border-bottom: 1px solid #F5F5F5 !important;
}

#ChaynsIDFrame {
    background-color: #F5F5F5 !important;
}

.NavIconOnlyAdmin:before {
    color: #545454 !important;
    opacity: 1 !important;
}

#Navigation .text-only-admin {
    color: rgba(255, 255, 255, 0.5) !important;
}

.chayns--mobile #Navigation, .chayns--mobile #NavItems {
    background-color: #222222 !important;
}

.ChaynsCS-BgColor-110Pcnt {
    background-color:
    #606060 !important;
}

.ChaynsCS-BgColor {
    background-color: #6E6E6E;
}

.ChaynsCS-BgColor-90Pcnt {
    background-color: #7C7C7C;
}

.ChaynsCS-BgColor-80Pcnt {
    background-color: rgba(110, 110, 110, .8);
}

.ChaynsCS-BgColor-60Pcnt {
    background-color: rgba(110, 110, 110, .6);
}

.ChaynsCS-BgColor-50Pcnt {
    background-color: #B6B6B6 !important;
}

.ChaynsCS-BgColor-30Pcnt {
    background-color: rgba(110, 110, 110, .3);
}

.ChaynsCS-BgColor-20Pcnt {
    background-color: #E2E2E2 !important;
    color: #6E6E6E;
}

.ChaynsCS-BgColor-10Pcnt {
    background-color: #F0F0F0 !important;
}

.ChaynsCS-BgColor-028Pcnt {
    background-color: rgba(110, 110, 110, .028);
}


.ChaynsCS-Color{
    color: #6E6E6E;
}

.footer .ChaynsCS-Color{
    color: #6E6E6E !important;
}

.ChaynsCS-Color-80Pcnt{
    color: rgba(110, 110, 110, .8);
}

.ChaynsCS-Color-75Pcnt{
    color: rgba(110, 110, 110, .75);
}

.ChaynsCS-Color-65Pcnt{
    color: rgba(110, 110, 110, .65);
}

.ChaynsCS-Color-60Pcnt{
    color: rgba(110, 110, 110, .6);
}

.ChaynsCS-Color-40Pcnt{
    color: rgba(110, 110, 110, .4);
}

.ChaynsCS-Color-30Pcnt{
    color: rgba(110, 110, 110, .3);
}

.ChaynsCS-Color-20Pcnt{
    color: rgba(110, 110, 110, .2);
}

.ChaynsCS-Color-10Pcnt{
    color: rgba(110, 110, 110, .1);
}


.ChaynsCS-Border {
    border: 1px solid #6E6E6E;
}

.ChaynsCS-Border-80Pcnt {
    border: 1px solid #8B8B8B;
}

.ChaynsCS-Border-30Pcnt {
    border: 1px solid #D4D4D4;
}

.ChaynsCS-Border-20Pcnt {
    border: 1px solid #E2E2E2;
}

.ChaynsCS-Border-15Pcnt {
    border: 1px solid #E9E9E9;
}

.ChaynsCS-Border-10Pcnt {
    border: 1px solid #F0F0F0;
}

.ChaynsCS-Border-Color-80Pcnt {
    border-color: rgba(110, 110, 110, .8) !important;
}

.ChaynsCS-Border-Color-30Pcnt {
    border-color: rgba(110, 110, 110, .3) !important;
}

.ChaynsCS-Bottom-Border-Color {
    border-bottom-color: #6E6E6E !important;
}

.ChaynsCS-Top-Border-Color {
    border-top-color: #6E6E6E !important;
}


h1, h2, h3, h4, h5, h6 {
    color: #6E6E6E;
    margin-bottom: 10px;
}

h1 {
    font-size: 24px;
    line-height: 29px;
}

h2 {
    font-size: 19px;
    line-height: 24px;
}

h3 {
    font-size: 17px;
    line-height: 22px;
}

h4 {
    font-size: 13px;
    line-height: 18px;
    color: #8B8B8B;
}

.NodeFoldOutTableHeader {
    font-family: 'robotomedium';
    padding: 10px 12px !important;
    color: #545454;
    background-color: rgba(110, 110, 110, .2);
    text-align: center;
}

.NodeFoldOutTableRow {
    padding: 10px 12px;
    border-bottom: solid 1px #FFFFFF;
    background-color: rgba(0,0,0,0.03);
}

.NodeButtonChoosed {
    background-color: rgba(110, 110, 110, .2);
}

.ColoredIconBackground {
    background-color: rgba(110, 110, 110, .8);
    color: #FFFFFF;
}

.NodeLink, .NodeLink:visited {
    transition: all ease-in-out 0.5s;
    text-decoration: none;
    padding-right: 5px;
    color: #A4A4A4;
}

    .NodeLink:hover {
        background-color: rgba(110, 110, 110, .2);
    }

    .NodeLink::before {
        font-family: 'FontAwesome';
        color: rgba(110, 110, 110, .8);
        content: "\f08e";
        padding: 0 5px;
        text-decoration: none;
    }

.chaynsBtn {
    display:inline-block;
    background-color: #6E6E6E;
    color: #ffffff;
    font-size: 14px;
    font-family: 'Roboto', Tahoma, 'robotolight';
    line-height: 23px;
    visibility: visible;
    text-align: center;
    padding: 8px 12px;

    cursor: pointer;

    -webkit-transition: background 150ms ease;
    -moz-transition: background 150ms ease;
    -o-transition: background 150ms ease;
    transition: background 150ms ease;

    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

    .chaynsBtn.wide {
        padding: 3px 12px;
}

    .chaynsBtn.smaller{
        padding: 2px 15px;
        margin: 0 auto;
        display: block;
        width: 100px;
}

    .chaynsBtn.brighter{
        background-color: rgba(110, 110, 110, .3);
}

    .chaynsBtn.brighter:hover{
        background-color: rgba(110, 110, 110, .8);
    }


.Hover-30Pcnt:hover {
    background-color: rgba(110, 110, 110, .3);
    color: #fff;
}

.Hover-100Pcnt:hover {
    background-color: rgba(110, 110, 110, 1);
}

/*Ende BaseStyle*/
    body {
        background - color: #6E6E6E;
    }

/*----------Menue----------*/

.NodeBodytext > .MenuToggle{
    margin-bottom: 0 !important;
}

.MenuToggleIcon::before{
    color: rgba(110, 110, 110, .8);
}

.chaynsBtn {
    display:inline-block;
    background-color: #6E6E6E;
    color: #ffffff;
    font-size: 14px;
    font-family: 'Roboto', Tahoma, 'robotolight';
    line-height: 23px;
    visibility: visible;
    text-align: center;
    padding: 8px 12px;

    cursor: pointer;

    -webkit-transition: background 150ms ease;
    -moz-transition: background 150ms ease;
    -o-transition: background 150ms ease;
    transition: background 150ms ease;

    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

    .chaynsBtn.wide {
    padding: 3px 12px;
}

    .chaynsBtn.smaller{
    padding: 2px 15px;
    margin: 0 auto;
    display: block;
    width: 100px;
}

    .chaynsBtn.brighter{
    background-color: rgba(110, 110, 110, .3);
}

    .chaynsBtn.brighter:hover{
    background-color: rgba(110, 110, 110, .8);
}

    .chaynsBtn:hover {
    background-color: rgba(110, 110, 110, .6);
}

body.AltMainBackgroundColor {
     background-color: #F5F5F5;
}

body{
    background-repeat: repeat-x;
    background-attachment: fixed;
    background-position: top left;
}


.chayns--mobile > body:not(.coming-soon-mobile):not(.coming-soon) {
    background-color: #222222 !important;
}


    body {
        background-color: #393939;
    }


/*-----DesignSettings-----*/

#WebBackground{
    width: 100%;
    margin: 0 auto 30px;
    background-color: #222222 !important;
    height: 100%;
    position: absolute;
    top: 0;
    z-index: -130;
    -webkit-transform:translateZ(130px);
        opacity: 0.8;
}

#BackgroundBlur {
        display: none;
}

#BackgroundGradient {
}

#MainFrame {
}

#WebShadow {
    position: relative;
}


.chayns--desktop #HeadShadow {
    max-height: 315px;
    display: block !important;
    height: 315px;
    width: 851px;;
    margin: 75px auto 30px;
    top: 0;
    left: 0;
    right: 0;
    -webkit-transform:translateZ(200px);
    z-index: -200;
    position: absolute;
}


#HeadShadow {
    display:none;
}





    .headerbar,
    .overlay__header,
    #LocationNameItemWrapper,
    .LocationNameItem {
        background-color: #393939 !important
    }


#BodyContent:not(.coming-soon-element) {
}

chayns--desktop #BodyContent:not(.coming-soon-element) {
}

/*-----Navigation-----*/


#Navigation .nav-item.active{
    background-position: left bottom;
}

#AdminMenuHeader::after {
    color: #8B8B8B;
}

/*----FBConnect----*/
#TitleConnect .DropDownList li {
    background-color: rgba(110, 110, 110, 0.1);
    display: block;
    padding: 8px;
}

#TitleConnect .DropDownList li:hover {
    background-color: rgba(110, 110, 110, 0.3);
}

.chaynsBtn {
    display:inline-block;
    background-color: #6E6E6E;
    color: #ffffff;
    font-size: 14px;
    font-family: 'Roboto', Tahoma, 'robotolight';
    line-height: 23px;
    visibility: visible;
    text-align: center;
    padding: 8px 12px;

    cursor: pointer;

    -webkit-transition: background 150ms ease;
    -moz-transition: background 150ms ease;
    -o-transition: background 150ms ease;
    transition: background 150ms ease;

    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;

    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

    .chaynsBtn.wide {
        padding: 3px 12px;
    }
    .chaynsBtn.smaller{
        padding: 2px 15px;
        margin: 0 auto;
        display: block;
        width: 100px;
    }
    .chaynsBtn.brighter{
        background-color: rgba(110, 110, 110, .3);
    }
    .chaynsBtn.brighter:hover{
        background-color: rgba(110, 110, 110, .8);
    }
    .chaynsBtn:hover {
        background-color: rgba(110, 110, 110, .6);
    }

/*----Content----*/

.coming-soon {
    background-color: #222222;
}

/*----TitleConnect----*/



.titleConnectColor{
    background-color: rgba(255, 255, 255, 1);
    color: rgba(84, 84, 84, 0.8) !important;
}






.group-block, .tappGroup {
    color: #fff !important;
    background-color: #393939 !important;
}

.NavSymbol {
    color: #fff !important;
}

#LocationNameItemWrapper {
    background-color: #393939 !important;
}

#Navigation .nav-item--badge {
    background-color: #5E5E5E;
    transition: all 0.1s ease-in-out;
    height: 36px;
    float: left;
    width: 4px;
    opacity: 0;
    position: absolute;
}

#Navigation .nav-item {
    background-position: right bottom;
    background: linear-gradient(to right, #5E5E5E 50%, transparent 50%) 100% 100%;
    background-size: 200% 100%;
}

.chayns--exclusive #Navigation {
    background-color: #222222;
}

.tappGroup .accordion__head:hover::after {
    content: "";
    background-color: #5E5E5E;
    transition: all 0.1s ease-in-out;
    height: 34px;
    width: 4px;
    left: 0;
    top: 0;
    position: absolute;
}

#Navigation .PageMenuWrapper {
    background-color: #2A2A2A;
    color:#fff;
}

#Navigation .AdministrationWrapper {
    background-color: #2A2A2A;
    color:#fff;
}

.select-dialog .ChaynsCS-BgColor-20Pcnt {
    background-color: #5E5E5E !important;
    color: #ffffff !important;
}

.dialog{
    color: #fff !important;
    background-color: #222222 !important;
}

.dialog__header .headline {
    color: #6E6E6E;
}

.dialog__header .description {
    color: #ffffff !important;
}

.date-picker__header {
    background-color: #222222 !important;
}

.day-picker .day-picker__day-table .day-table__week-row div.day--out-of-month {
    color: #595959 !important;
}

.day-picker .day-picker__day-table .day-table__week-row div.day--blocked {
    color: #595959 !important;
}

.month-picker__year-table__month-row div span.month--blocked {
    color: #595959 !important;
}

.time-picker .time-picker__hours input, .time-picker .time-picker__minutes input  {
    background-color: #222222 !important;
}

.chaynsBtn {
    color: #fff;
    background-color: #676767;
}

    .chaynsBtn:hover {
        background-color: #BABABA;
    }

#HeaderBar {
    background-color: #393939;
}

#scroller .NameItem {
    background-color: #393939 !important;
}

#administration{
    color: #fff !important;
    background-color: #2A2A2A !important;
}

.ListSeperator {
    border-left: 1px #545454 solid;
}

#Navigation .accordion--open.accordion:not(.accordion--wrapped) {
    background-color: #393939 !important;
}

#AdminMenuHeader .onoffswitch-checkbox:checked + .onoffswitch-label {
    right: -8px;
    background-color: #BABABA;
}

#Navigation .onoffswitch-label {
    background-color: #535353;
}

.pageIconItem {
    color: #BABABA;
}

.ChaynsLoadingCursor > .loading-spinner-wrapper {
    background-color: rgba(103, 103, 103, 0.5);
}

.ChaynsLoadingCursor.with-text > .loading-spinner-wrapper {
    background-color: rgba(103, 103, 103, 0.9) !important;
}

.loading-spinner circle {
    stroke: rgba(168, 168, 168, 0.8);
}

.ChaynsLoadingCursor .loading-spinner-text {
    color: #dadada;
}

.ChaynsCS-Top-Border-Color-20Pcnt {
    border-top-color: #222222 !important;
    border-top-style: solid !important;
}

#IntroBox #IntroDescription{
    color: #cdcdcd;
}

#BodyContent #TappContent .Node, #BodyContent .TappContent .Node {
    background-color: #0B0B0B !important;
}

.NodeTitle {
    font-size: 17px;
    color: #b3b3b3;
}

.NodeTitleSubline {
    font-size: 13px;
    color: #cdcdcd;
}

.NodeBodytext {
    font-size: 14px;
    color: #cdcdcd;
    line-height: 24px;
    word-wrap: break-word;
}

#AdminMenuHeader .onoffswitch-switch {
    box-shadow: 0 0px 0px 0 white !important;
}

#FooterWrapper {
    color: rgba(253, 253, 253, 0.5) !important; 
}

.overlay {
    background-color: #222222 !important;
}



.ribbon-menu {
    color: #FFF;
    background-color: #161616;
    border-color: rgba(255, 255, 255, .08) !important;
}

.ribbon-menu .burger-badge span {
    background-color: #FFF;
}

.ribbon-menu .tapp-item:before {
    background-color: #5E5E5E;
}

.ribbon-menu .tapp-item.selected:before {
    background-color: #FFF;
}

.ribbon-menu .tapp-group {
    background-color: #161616;
    border-color: rgba(255, 255, 255, .08);
}

.ribbon-menu .group-item {
    background: linear-gradient(to right, #5E5E5E 50%, transparent 50%) right bottom;
}

.ribbon-menu .group-item:before {
    background-color: #5E5E5E;
}

.ribbon-menu .fa {
    color: #FFF;
}
