/*
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.05.2017, 11:12:21
    Author     : stadlerc
*/

/** Allgemein **/
.no-padding {
    padding: 0rem !important;
}

.no-shadow {
    box-shadow: 0rem 0rem 0rem 0rem #fff !important;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.width-100 {
    width: 100%;
}

.width-50 {
    width: 50%;
}

.width-20 {
    width: 20%;
}

.height-100 {
    height: 100%;
}

.ui-g-0-5 {
    width: 4.16666%;
    float: left;
    box-sizing: border-box;
}

.ui-g-1-5 {
    width: 12.5%;
    float: left;
    box-sizing: border-box;
}

.ui-g-2-5 {
    width: 20.83333%;
    float: left;
    box-sizing: border-box;
}

.ui-g-3-5 {
    width: 29.16666%;
    float: left;
    box-sizing: border-box;
}

.ui-g-5-5 {
    width: 45.83333%;
    float: left;
    box-sizing: border-box;
}

.ui-g-10-5 {
    width: 87.5%;
    float: left;
    box-sizing: border-box;
}

.ui-messages-info {
    margin: 0.3rem 0rem;
}

.ui-picklist .ui-picklist-list {
    height: 120px !important;
}

.ui-panel .ui-panel-content {
    padding: 0.3rem !important;
}

.ui-autocomplete input {
    width:100%;
    max-width: 29rem !important; 
}

.ui-autocomplete-items {
    max-width: 29rem !important; 
}

.ui-picklist.ui-picklist-vertical .ui-button {
    margin-left: 0.2rem !important;
    margin-right: 0.2rem !important;
}

div.ui-button, .ui-splitbutton {
    box-shadow: 0rem 0rem 0rem 0rem #fff !important; 
}

.ui-fileupload-preview {
    display: none !important;
}

.ui-paginator-top .ui-paginator-current, .ui-paginator-top .ui-paginator-rpp-options {

    display: none !important;
}

.ui-paginator-bottom .ui-paginator-current, .ui-paginator-bottom .ui-paginator-rpp-options {
    margin-left: 1em;
    margin-right: 0em;
    background-image: none;
    float: right;
}

.ui-progressbar .ui-progressbar-value {
    background-color:#668ba4;
    background-image:none;
}

/** Landing Page **/
.landing-page-background-image-area {
    background: url("/luxwsp/javax.faces.resource/images/watersplash_lp.jpg.xhtml?ln=iww-layout") !important; 
    background-repeat:  no-repeat !important;
    background-size: cover !important;
    background-position: center center !important; 
    height: 29rem !important;
}

.landing-page-title-area {
    background-color: rgba(255,255,255, 0.35); 
    max-width:42rem; 
    margin: auto;
    margin-top: 5rem; 
    border-top-left-radius: 4px; 
    border-top-right-radius: 4px;
}

.landing-page-main-slogan-area {
    background-color: #406e8e; 
    border-bottom-left-radius: 4px; 
    border-bottom-right-radius: 4px;
}

.landing-page-main-slogan {
    color: #fff !important;
    font-size: 1.9rem !important;
    padding-top: 1.2rem !important;
    padding-bottom: 1.3rem !important;
}

.landing-page-sub-slogan-area {
    transform: rotateZ(35deg); 
    width: 10rem; 
    height: 8rem; 
    background-color:#F6AE2D; 
    border-radius: 4px; 
    margin: auto; 
    margin-right: -1rem;
}

.landing-page-sub-slogan-inner-area {
    margin: auto;
}

.landing-page-sub-slogan-text {
    color: white; 
    font-size: 1.3rem; 
    padding: 0.7rem;
}


.landing-page-topbar-logo-age-area {
    float: left; 
    border: 1px solid #cfd8dc; 
    width: 4.2rem; 
    height: 4.2rem;
}

.landing-page-topbar-logo-age {
    width: 2.75rem; 
    padding: 0.6rem; 
    padding-top: 0.0rem; 
    opacity: 0.9;
}

.landing-page-topbar-menu-icon-area {
    background-color: #537c99; 
    border-radius: 50%; 
    width: 3rem; 
    height: 3rem;
    margin: 0.5rem;
    float: right; 
}

.landing-page-topbar-menu-icon {
    width: 1.8rem; 
    padding: 0.6rem;
}

.landing-page-topbar-language-menu-entry {
    color: #424242; 
    margin-left: 0.3rem; 
    vertical-align: middle;
}

.landing-page-app-logo {
    width: 29rem; 
    opacity: 1; 
    margin-top: 3.2rem; 
    margin-bottom: 2rem; 
    margin-left: 0.5rem;
}

/** Landing Page - Funktionen **/
.landing-page-features-area {
    margin-top: 5.8rem;
    background-color: #fff !important;
}

.landing-page-features-icon {
    width: 4rem;
}

.landing-page-features-header-text {
    /**color: #e4061f !important; **/
    color: #F6AE2D !important;
}

/** Landing Page - Information **/
.landing-page-information-area {
    position: relative; 
    border-top: 1px solid #d8d8d8;
}

.landing-page-information-inner-area {
    max-width: 58.8rem; 
    margin: auto; 
    padding-bottom: 2.8rem; 
    padding-top: 0rem;
}

.landing-page-information-card-100 {
    background-color: #668ba4; 
    padding: 1rem; 
    margin-top: -2.95rem; 
    border-radius: 4px; 
    margin-bottom: 3rem;
}

.landing-page-information-card-50 {
   background-color: #335871; 
   padding: 1rem;
   margin-top: -2.95rem; 
   border-radius: 4px; 
   margin-bottom: 1rem; 
   height: 100%;
}

.landing-page-information-text {
    color: #f5f5f5;
}

/** Login Page **/
.login-page-app-logo {
    width: 2.7rem !important;
}

.login-page-messages-area {
    padding: 0px 20px !important; 
    padding-bottom: 5px !important;
}

.login-page-button-area {
    padding: 20px 70px !important;
}

.login-page-separator-button-area {
    padding-top: 20px !important;
    padding-right: 0px !important;
    padding-bottom: 20px !important;
    padding-left: 0px !important;
}

.login-page-background-image-area {
    background: url("/luxwsp/javax.faces.resource/images/watersplash_lo.jpg.xhtml?ln=iww-layout") !important; 
    background-repeat:  no-repeat !important;
    background-size: contain !important;
    background-position: top center !important; 
}

.login-page-home-button-area {
    padding-top: 20px !important;
    padding-right: 70px !important;
    padding-bottom: 20px !important;
    padding-left: 0px !important;
}


/** Topbar **/
.topbar-logo-area {
    float:right !important;
    margin-right: 0rem !important;
    background-color: #537c99 !important;
}

.topbar-logo-age {
    margin-top: 0.5rem !important;
    width: 1.64rem !important;
}

.topbar-information-area {
    max-width: 20rem; 
    margin-top: 0.75rem;
    margin-right: 1.25rem;
    float: right;
}

.topbar-information {
    color: #cfd8dc; 
    text-align: left !important;
}

.topbar-dashboard-icon-area {
    background-color: #537c99 !important;
}

.topbar-dashboard-icon {
    color: #cfd8dc !important; 
    font-size: 30px !important;
    width: 30px !important;
    height: 30px !important; 
    vertical-align: middle !important;
    margin-top: 0.9rem;
}

.topbar-dashboard-nav-icon {
    color: #757575 !important; 
    font-size: 36px !important;
    width: 36px !important;
    height: 36px !important; 
    vertical-align: middle !important;
    margin-top: 0.9rem;
    margin-right: 1.4rem;
}

.topbar-dashboard-nav-icon-small {
    color: #fff !important; 
    font-size: 24px !important;
    width: 24px !important;
    height: 24px !important; 
    vertical-align: middle !important;
    margin-top: 0.5rem;
    margin-right: 1.4rem;
}

/** Dashboard **/
.dashboard-user-card-area {
    min-width: 15rem;
    margin-top: 1.4rem;
}

.dashboard-user-card-area-large {
    min-width: 48rem;
}

.dashboard-user-card-list-header {
    height: 4rem !important; 
    background-color: #fff !important;
    overflow: visible! important;
}

.dashboard-user-card-list-header-admin {
    height: 4rem !important; 
    background-color: #406e8e !important;
}

.dashboard-user-card-header {
    height: 4rem !important; 
    background-color: #fff !important;
    border-bottom: 1px solid #eaeaea;
    overflow: visible! important;
}

.dashboard-user-card-header-big{
    height: 12.5rem !important; 
    background-color: #fff !important;
    border-bottom: 1px solid #eaeaea;
    overflow: visible! important;
}

.dashboard-user-card-header-auswertung {
    height: 8.45rem !important; 
    background-color: #fff !important;
    border-bottom: 1px solid #eaeaea;
    overflow: visible! important;
}


.dashboard-user-card-header-title-area {
    margin-top: 0.7rem !important; 
}

.dashboard-user-card-header-title {
    font-size: 1.2rem; 
    font-weight: bold; 
    color: #424242; 
    margin-left: 1rem;
}

.dashboard-user-card-heading {
    font-size: 1.2rem; 
    color: #757575; 
}

.dashboard-user-card-heading-small {
    font-size: 1rem; 
    color: #757575; 
}

.dashboard-user-card-header-title-admin {
    font-size: 1.2rem; 
    font-weight: bold; 
    color: #fbfbfb;
    margin-left: 1rem;
}

.dashboard-user-card-header-count {
    font-size: 1.2rem; 
    font-weight: bold; 
    color: #424242; 
    margin-left: 0.5rem;
}

.dashboard-user-card-content {
    height: 15.25rem !important;
}

.dashboard-user-card-content-medium {
    height: 25.5rem !important;
}

.dashboard-user-card-content-large {
    height: 30rem !important;
}

.dashboard-user-card-content-larger {
    height: 33.3rem !important;
}

.dashboard-user-card-content-extra-large {
    height: 36.5rem !important;
}

.dashboard-user-card-content-small {
    height: 11.2rem !important;
}

.dashboard-user-card-content-smaller {
    height: 10.09rem !important;
}

.dashboard-user-card-content-tiny {
    height: 5rem !important;
}

.dashboard-user-card-content-footer {
    height: 3.2rem !important;
}

.dashboard-user-card-name {
    /** margin-top: 1rem !important; **/
    margin-left: 1.2rem !important;
    top: -52px !important;
}

.dashboard-user-card-icon {
    color: #757575 !important; 
    font-size: 24px !important;
    width: 24px !important;
    height: 24px !important; 
    vertical-align: middle !important;
}

.dashboard-user-card-button {
    width: 5.6rem !important; 
    height: 1.8rem !important; 
    margin: 0px !important; 
    margin-top: -4px !important;
}

.dashboard-user-card-big-button {
    width: 5.6rem !important; 
    height: 1.8rem !important; 
    margin: 0px !important; 

    float: right !important; 
    margin-top: 1rem !important; 
    margin-right: 1.65rem !important;
}

.dashboard-user-card-header-icon {
    font-size: 36px !important;
    width: 36px !important;
    height: 36px !important; 
    margin-left: 0.35rem;
    margin-right: 1rem;
    margin-top: -1.8rem;
    margin-bottom: 0rem;
    float:right;
    vertical-align: middle !important;

    color: #fff !important; 
    background-color: #668ba4 !important; 
    padding: 0.8rem; 
    border-radius: 3px;
    box-shadow: 0 10px 30px -12px rgba(0, 0, 0, 0.205), 0 4px 25px 0px rgba(0, 0, 0, 0.03), 0 8px 10px -5px rgba(0, 0, 0, 0.05);
}

.dashboard-user-card-header-chart {
    min-height: 9rem; 
    background-color: #668ba4 !important; 
    margin: 0.5rem; 
    margin-top: -1.8rem; 
    border-radius: 3px;
    box-shadow: 0 10px 30px -12px rgba(0, 0, 0, 0.205), 0 4px 25px 0px rgba(0, 0, 0, 0.03), 0 8px 10px -5px rgba(0, 0, 0, 0.05);
}

.dashboard-user-card-header-icon-admin {
    color: #cfd8dc !important; 
    font-size: 47px !important;
    width: 47px !important;
    height: 47px !important; 
    margin-left: 0.35rem;
    margin-right: 0.4rem;
    margin-top: 0rem;
    margin-bottom: 0rem;
    float:right;
    vertical-align: middle !important;
}

.dashboard-user-card-content-icon {
    color: #757575 !important; 
    font-size: 50px !important;
    width: 50px !important;
    height: 50px !important; 
    margin-right: 0.5rem;
    margin-top: 1.9rem;
    margin-bottom: 0rem;
    float:right;
    vertical-align: middle !important;
}

.dashboard-auswertung-row {
    height: 7.15rem; 
    border-bottom: 1px solid #eaeaea; 
}

.dashboard-auswertung-row-first {
    border-top: 1px solid #eaeaea;
}

.dashboard-auswertung-row-title-area {
    margin-top: 1.2rem; 
    margin-left: 1.5rem;
}

.dashboard-auswertung-row-content {
    height: 7.15rem; 
}

.dashboard-auswertung-row-title {
    font-weight: 700; 
    margin-right: 8px; 
    margin-left: 8px;
}

.dashboard-auswertung-column-header {
    margin-left: 0.5rem; 
    margin-top: 0.1rem; 
    margin-bottom: 0.2rem;
}

.dashboard-auswertung-font-medium {
    color: #757575; 
    font-size: 0.8rem;
    margin-left: 1.2rem;
}

.dashboard-auswertung-font-big {
    color: #757575; 
    font-size: 1.8rem;
}

.dashboard-auswertung-column-content {
    height: 5.2rem;  
}

.dashboard-stammdaten-column-content {
    height: 7.3rem;
    background-color: #fff;
}

.dashboard-auswertung-column-content-count {
    margin-left: 1.65rem; 
    margin-top: 1.4rem; 
}

.dashboard-auswertung-column-content-description {
    margin-left: 1.2rem; 
    margin-top: 0.2rem;  
}

.dashboard-auswertung-column-content-description-without-count {
    margin-left: 0.3rem; 
    margin-top: 0.3rem;  
}

.dashboard-auswertung-column-content-knob {
    padding-left: 0.5rem; 
    padding-bottom: 0.2rem; 
    padding-top: 0.6rem;
}

.dashboard-auswertung-column-content-knob-description {
    margin-left: 0.5rem; 
    margin-top: 0rem;
}

.dashboard-separator-row {
    height: 1.2rem; 
    border-bottom: 1px solid #eaeaea;
}

.dashboard-auswertung-thick-border-left {
    border-left: 2px solid #757575;
}

.dashboard-auswertung-thick-border-right {
    border-right: 2px solid #757575;
}

.dashboard-auswertung-thin-border-left {
    border-left: 1px solid #757575;
}

.dashboard-auswertung-thin-border-right {
    border-right: 1px solid #757575;
}

.dashboard-auswertung-button-area {
    margin-top: 0.4rem; 
    margin-right: 24px; 
}

.dashboard-auswertung-button {
    float: right; 
    margin: 0px !important;
    margin-top: 0.5rem !important;
    width: 2.5rem; 
    height: 2.5rem; 
}

/** Erste Schritte **/
.erste-schritte-column-content {
    background-color: #fff;
    /**height: 21.2rem; **/
}

/** Statistik **/
.statistik-prioritaet-column-content {
    height: 5.8rem !important;
}

.statistik-prioritaet-header-title {
    font-size: 1.1rem; 
    font-weight: bold; 
    color: #fff;
    margin-left: 1rem;
}

.statistik-prioritaet-header-count {
    font-size: 1.1rem; 
    font-weight: bold; 
    color: #fff; 
    float: right;
    margin-left: 0.5rem;
    margin-right: 0.5rem;
}

.statistik-prioritaet-subheader-title {
    font-size: 0.9rem; 
    /**font-weight: bold; **/
    color: #fff;
    margin-left: 1.1rem;
}

.statistik-prioritaet-header-column-blue {
    background-color: #406e8e; 
    border-top-left-radius: 3px; 
    border-bottom-left-radius: 3px; 
    border-right: 2px solid #fff;
}

.statistik-prioritaet-header-column-lightblue {
    background-color: #537c99; 
    border-top-right-radius: 3px; 
    border-bottom-right-radius: 3px;
}

.statistik-prioritaet-subheader-column-blue {
    background-color: #406e8e; 
    border-radius: 3px; 
}

.statistik-prioritaet-column-red {
    background-color: rgba(165,70,87, 0.75); 
    border-top-left-radius: 3px; 
    border-bottom-left-radius: 3px; 
    margin-top: 2px;
}

.statistik-prioritaet-column-red {
    background-color: rgba(165,70,87, 0.75); 
    border-top-left-radius: 3px; 
    border-bottom-left-radius: 3px; 
    margin-top: 2px;
}

.statistik-prioritaet-column-yellow {
    background-color: rgba(246,174,45, 0.75); 
    border-left: 2px solid #fff; 
    border-right: 2px solid #fff; 
    margin-top: 2px;
}

.statistik-prioritaet-column-green {
    background-color: rgba(28, 124, 84, 0.75); 
    border-top-right-radius: 3px; 
    border-bottom-right-radius: 3px; 
    margin-top: 2px;
}

.statistik-prioritaet-font-medium {
    color: #fff; 
    font-size: 0.8rem;
    margin-left: 1.2rem;
}

.statistik-prioritaet-font-big {
    color: #fff; 
    font-size: 1.8rem;
}

.statistik-prioritaet-font-percentage {
    color: #fff; 
    font-size: 1.1rem;
    margin-left: 0.3rem;
}

/** Beantwortung **/
.beantwortung-button-filter-status {
    background-color: #668ba4 !important; 
    margin-top: 1px !important;
}

.beantwortung-button-filter {
    background-color: #757575 !important;
    margin-top: 1px !important;
}

.beantwortung-filter-list {
    width: 18rem;
}

.beantwortung-filter-list-separator {
    margin-top: 0.8rem !important;
    border-top: 1px solid #d8d8d8 !important;
}

.beantwortung-filter-list-button {
    background-color: #757575 !important; 
    margin-top: 0.5rem !important;
}

.beantwortung-list-item {
    border-bottom: 1px solid #d8d8d8; 
    margin-bottom: 0.4rem;
}

.beantwortung-list-item-text {
    color:#757575;
}

.beantwortung-list-item-header-area {
    margin-top: 0.8rem; 
    margin-bottom: 0.5rem;
}

.beantwortung-list-item-header-text {
    font-weight: bold; 
    padding-top: 1rem;
}

.beantwortung-list-item-details-panel {
    border: 0rem !important; 
    padding-bottom: 0.2rem !important;
}

.beantwortung-status-icon {
    font-size: 36px !important; 
    width: 36px !important; 
    height: 36px !important;  
    margin: 0.2rem !important;  
    margin-right: 0rem !important; 
}

.beantwortung-status-icon-antwort-completed {
    color: #9cb380 !important;
}

.beantwortung-status-icon-antwort {
    color: #2e4052 !important; 
}

.beantwortung-status-icon-risiko {
    color: #f6ae2d !important;
}

.beantwortung-status-icon-datei {
    color: #85668e !important;
}

.beantwortung-action-button {
    margin: 0.4rem 0.4rem 0 0; 
    float: right;
}

.beantwortung-action-button-risiko {
    background-color: #f6ae2d !important;
}

.beantwortung-action-button-datei {
    background-color: #85668e !important;
}

/** Drepsi-Bewertung **/
.drepsi-bewertung-status-icon {
    color: #757575 !important;
    font-size: 29px !important;
    width: 29px !important;
    height: 29px !important;
}

.drepsi-bewertung-tiny-status-icon {
    color: #757575 !important;
    font-size: 20px !important;
    width: 20px !important;
    height: 20px !important;
}
