/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 05.06.2014, 14:06:55
    Author     : kriz
*/

/* COLOR CONCEPT =====================================

Orange:     hsl(14, 67%, 53%)
DarkGrey:   hsl(205, 8%, 44%)
DarkBlue:   hsl(204, 29%, 54%)
LightBlue:  hsl(197, 30%, 82%)
LightGrey:  hsl(0, 0%, 96%)

Alterantiv:
DarkGrey:       hsl(201, 14%, 81%)
Darkblue:       hsl(205, 31%, 68%)
LightOrange:    hsl(13, 100%, 64%)
DarkOrange:     hsl(10, 82%, 58%)

=================================================== */

/* Menu =============================== */

#sidemenu > h1 {
    padding: 16px 22px 0px;
    z-index: 2;
    font-size: 16px;
    font-weight: 400;
    font-style: italic;
    text-decoration: none;
    color: hsl(0, 0%, 96%);
}
#sidemenu > #login-menu a[title=Logout] {
    color: hsl(10, 82%, 58%);
}
#sidemenu > #login-menu a:hover {
    color: hsl(13, 100%, 64%);
}
#sidemenu > #login-menu {
    margin-bottom: 10px;
}

#sidemenu ul,
#sidemenu ul li,
#sidemenu ul li a {
    margin: 0;
    padding: 0;
    border: 0;
    list-style: none;
    line-height: 1;
    display: block;
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
#sidemenu {
    width: 300px;
    font-family: 'Lato', sans-serif;
    color: #ffffff;
}
#sidemenu ul ul {
    display: none;
}
#sidemenu > ul > li.active > ul {
    display: block;
}

#sidemenu .active a {

}

.align-right {
    float: right;
}
#sidemenu > ul > li > a {
    padding: 16px 22px;
    cursor: pointer;
    z-index: 2;
    font-size: 16px;
    text-decoration: none;
    color: #ffffff;
    -webkit-transition: color .2s ease;
    -o-transition: color .2s ease;
    transition: color .2s ease;
}
#sidemenu > ul > li > a:hover {
    color: #d8f3f0;
}
#sidemenu ul > li.has-children > a:after {
    position: absolute;
    right: 26px;
    top: 19px;
    z-index: 5;
    display: block;
    height: 10px;
    width: 2px;
    background: #ffffff;
    content: "";
    -webkit-transition: all 0.1s ease-out;
    -moz-transition: all 0.1s ease-out;
    -ms-transition: all 0.1s ease-out;
    -o-transition: all 0.1s ease-out;
    transition: all 0.1s ease-out;
}
#sidemenu ul > li.has-children > a:before {
    position: absolute;
    right: 22px;
    top: 23px;
    display: block;
    width: 10px;
    height: 2px;
    background: #ffffff;
    content: "";
    -webkit-transition: all 0.1s ease-out;
    -moz-transition: all 0.1s ease-out;
    -ms-transition: all 0.1s ease-out;
    -o-transition: all 0.1s ease-out;
    transition: all 0.1s ease-out;
}
#sidemenu ul > li.has-children.open > a:after,
#sidemenu ul > li.has-children.open > a:before {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}
#sidemenu ul ul li a {
    padding: 14px 22px;
    cursor: pointer;
    z-index: 2;
    font-size: 14px;
    text-decoration: none;
    color: #dddddd;
    background: hsla(0, 0%, 0%, 0.2);
    -webkit-transition: color .2s ease;
    -o-transition: color .2s ease;
    transition: color .2s ease;
}
#sidemenu ul ul ul li a {
    padding-left: 32px;
}
#sidemenu ul ul li a:hover {
    color: #ffffff;
}
#sidemenu ul ul > li.has-children > a:after {
    top: 16px;
    right: 26px;
    background: #dddddd;
}
#sidemenu ul ul > li.has-children > a:before {
    top: 20px;
    background: #dddddd;
}
#sidemenu ul li ul li.first-item {
    box-shadow: inset 0 2px 2px #555;
}
#sidemenu ul li ul:last-child {
    box-shadow: inset 0 -2px 2px #555;
}


/*
AutoComplete
*/
.ui-autocomplete .highlight {
    color: #DF6300;
}

/* Buttons =============================== */
span button,
span a {
    border: none !important;
    cursor: pointer;
    display: inline-block;
    margin: 3px 2px;
    border-radius: 2px;
}

span button span,
span a span {
    display: none;
}

span button:before,
span a:before {
    display: inline-block;
    -webkit-font-smoothing: antialiased;
    font: normal 24px/1 'Genericons';
    vertical-align: middle;
}

span.menu-button button:before {
    content: '\f419';
}

span.help-button a:before {
    content: '\f457';
}

a.hinweis:before {
    display: inline-block;
    -webkit-font-smoothing: antialiased;
    font: normal 24px/1 'Genericons';
    vertical-align: middle;
    content: '\f456';
}
a.bni:before {
    background-image: url('/img/bni.png');
    background-size: 24px 11px;
    width: 24px;
    height: 11px;
    display: inline-block;
    vertical-align: middle;
    content: "";
}

#user-menu {
    width: 50%;
    text-align: center;
    padding: 0;
    margin: 0 auto;
    list-style-type: none;
}

#user-menu li {
    display: inline;
}

#user-menu a {
    margin: 0 10px;
    overflow: hidden;
    white-space: nowrap;
    line-height: 38px;
    width: 38px;
    position: relative;
    font-size: 16px;
    vertical-align: bottom;
    text-align: center;
    -moz-transition: color .1s ease-in 0;
    -webkit-transition: color .1s ease-in 0;
    display: inline-block;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-decoration: inherit;
    text-transform: none;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    speak: none;
}

#user-menu li.mail:before {
    position: absolute;
    margin-left: 30px;
    vertical-align: top;
    line-height: 19px;
    font: normal 16px/1 'Genericons';
    z-index: 0;
    color: red;
}
#user-menu li.task:before {
    position: absolute;
    margin-left: 27px;
    vertical-align: top;
    line-height: 19px;
    font: normal 16px/1 'Genericons';
    z-index: 0;
    color: red;
}
#user-menu a:before {
    position: relative;
    margin-right: 20px;
    vertical-align: top;
    line-height: 38px;
    font: normal 32px/1 'Genericons';
    z-index: -10;
}

#user-menu li.mail a:before {content: "\f410";}
#user-menu li.storage a:before {content: "\f409";}
#user-menu li.task a:before {content: "\f425";}

#user-menu li.unread:before {content: '\f456';}

/* Login =============================== */
div.users.login form {
    /* Size and position */
    width: 300px;
    margin: 30px auto 30px;
    padding: 10px;
    position: relative;

    /* Font styles */
    font-family: 'Lato', sans-serif;
    color: hsl(205, 8%, 44%);
}
div.users.login legend {
    font-size: 22px;
    font-weight: 400;
    padding-bottom: 20px;
    text-align: center;
    width: 100%;
}
div.users.login div {
    margin: 0;
    padding: 0;
}
div.users.login input[type=text],
div.users.login input[type=password] {
    /* Size and position */
    width: 100%;
    padding: 8px 4px 8px 10px;
    margin-bottom: 15px;

    /* Styles */
    border: 1px solid #4e3043; /* Fallback */
    border: 1px solid rgba(78,48,67, 0.8);
    background: hsla(204, 29%, 54%, 0.15);
    border-radius: 2px;
    box-shadow: 
        0 1px 0 rgba(255,255,255,0.2), 
        inset 0 1px 1px rgba(0,0,0,0.1);
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;

    /* Font styles */
    font-family: 'Lato', sans-serif;
    color: hsl(205, 8%, 44%);
    font-size: 13px;
}
div.users.login input::-webkit-input-placeholder {
    color: rgba(37,21,26,0.5);
    text-shadow: 0 1px 0 rgba(255,255,255,0.15);
}
div.users.login input:-moz-placeholder {
    color: rgba(37,21,26,0.5);
    text-shadow: 0 1px 0 rgba(255,255,255,0.15);
}
div.users.login input:-ms-input-placeholder {
    color: rgba(37,21,26,0.5);
    text-shadow: 0 1px 0 rgba(255,255,255,0.15);
}
div.users.login input[type=text]:hover,
div.users.login input[type=password]:hover {
    border-color: #333;
}
div.users.login input[type=text]:focus,
div.users.login input[type=password]:focus,
div.users.login input[type=submit]:focus {
    box-shadow: 
        0 1px 0 rgba(255,255,255,0.2), 
        inset 0 1px 1px rgba(0,0,0,0.1),
        0 0 0 3px rgba(255,255,255,0.15);
    outline: none;
}
/* Fallback */
.no-boxshadow div.users.login input[type=text]:focus,
.no-boxshadow div.users.login input[type=password]:focus {
    outline: 1px solid white;
}
div.users.login input[type=submit] {
    /* Size and position */
    width: 100%;
    padding: 8px 5px;

    /* Styles */
    background: linear-gradient(hsla(13, 100%, 64%,0.5), hsla(10, 82%, 58%,0.7));    
    border-radius: 5px;
    border: 1px solid #4e3043;
    box-shadow: 
        inset 0 1px rgba(255,255,255,0.4), 
        0 2px 1px rgba(0,0,0,0.1);
    cursor: pointer;
    transition: all 0.3s ease-out;

    /* Font styles */
    color: white;
    text-shadow: 0 1px 0 rgba(0,0,0,0.3);
    font-size: 16px;
    font-weight: bold;
    font-family: 'Raleway', 'Lato', Arial, sans-serif;
}
div.users.login input[type=submit]:hover {
    box-shadow: 
        inset 0 1px rgba(255,255,255,0.2), 
        inset 0 20px 30px hsla(10, 82%, 58%, 0.5);
}
/* Fallback */
.no-boxshadow div.users.login input[type=submit]:hover {
    background: hsl(205, 31%, 68%);
}
div.users.login label {
    display: none;
    padding: 0 0 5px 2px;
    cursor: pointer;
}
div.users.login label:hover ~ input {
    border-color: #333;
}
.no-placeholder div.users.login label {
    display: block;
}

/* List-Stile */
.isystems.view ul {
        list-style-type: none;
        text-indent: 8px;
}
.isystems.view ul li:before {
        padding-right: 8px;
        content: '\f418';
        display: inline-block;
        -webkit-font-smoothing: antialiased;
        font: normal 16px/1 'Genericons';
        vertical-align: text-top;
				color: hsl(142, 67%, 53%);
}
table.positionen .right {
    text-align: right;
}
table.positionen li:first-of-type {
    list-style: none;
    text-indent: 8px;
}
table.positionen li {
    margin: 0;
    padding: 0;
    list-style: none;
    text-indent: 16px;
}

/* ACTIONS ======================= */
.actions a:before {
    margin-right: 0px;
    vertical-align: middle;
    line-height: 26px;
    font: normal 20px/1 'Genericons';
}
.actions a span {
    display: none;
}

.actions a.view:before {content: "\f403";}
.actions a.edit:before {content: "\f411";}
.actions a.delete:before {content: "\f407";}

.actions a.print:before {content: "\f469";}
.actions a.check:before {content: "\f425";}
.actions a.order:before {content: "\f447";}

p.markAsDone, a.markAsUndone {text-decoration: none;}
p.markAsDone:before, a.markAsUndone:before {
    margin-right: 0px;
    vertical-align: middle;
    line-height: 26px;
    font: normal 20px/1 'Genericons';
}
p.markAsDone span, a.markAsUndone span {display: none;}
p.markAsDone:before {content: "\f418";}
a.markAsUndone:before {content: "\f405";}
a.markAsUndone:hover:before {content: "\f418";}

.text-align-left {
    text-align: left;
}
.text-align-center {
    text-align: center;
}
.text-align-right {
    text-align: right;
}

.pdficon a {
    margin: 0;
    overflow: hidden;
    white-space: nowrap;
    line-height: 38px;
    width: 38px;
    position: relative;
    font-size: 16px;
    vertical-align: bottom;
    text-align: center;
    -moz-transition: color .1s ease-in 0;
    -webkit-transition: color .1s ease-in 0;
    display: inline-block;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-decoration: inherit;
    text-transform: none;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    speak: none;
}

.pdficon a:before {
    position: relative;
    margin-right: 20px;
    vertical-align: top;
    line-height: 38px;
    font: normal 32px/1 'Genericons';
    z-index: 10;
}
.pdficon a:before {
    content: '\f443';
}

a.linkicon  {
    margin: 0;
    overflow: hidden;
    white-space: nowrap;
    line-height: 14px;
    width: 24px;
    position: relative;
    font-size: 16px;
    vertical-align: bottom;
    text-align: center;
    -moz-transition: color .1s ease-in 0;
    -webkit-transition: color .1s ease-in 0;
    display: inline-block;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-decoration: inherit;
    text-transform: none;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    speak: none;
}

a.linkicon:before {
    position: relative;
    margin-right: 20px;
    margin-left: -2px;
    vertical-align: middle;
    line-height: 16px;
    font: normal 18px/1 'Genericons';
    z-index: 10;
}
a.linkicon:before {
    content: '\f107';
}