/**
 * Custom CSS
 * Use this file to override styles if you feel uncomfortable editing
 * component stylesheets.
 ============================================================================ */
 /* PRINT */

@page { margin: 2cm }

@media print {
  .l-leaderboard, .l-footer, .l-attribution, .views-exposed-form {
    display: none;
  }
  .l-main{
    font-size: 0.8em;
  }
  .site-branding__name-link{
    color: #000000;
  }
}


/* GLOBAL */

html{
  background-color: #e8e8e8;
}

h1{
  font-size:1.8rem
}

table{
  width: 100%;
  line-height:1.2em;
}

thead .stickytable_admin{ 
  position: sticky; 
  top: 75px; 
  background-color: #e8e8e8;
  border-color: #cccccc;
}

thead .stickytable_user{ 
  position: sticky; 
  top: 0; 
  background-color: #e8e8e8;
  border-color: #cccccc;
}

.icon_cell{
  width: 100%;
  display:flex;
  vertical-align: middle;
  text-align: center;
  align-items:center;
  justify-content:center;
}

.fa-circle-chevron-right, .fa-circle-xmark, .fa-circle-exclamation, .fa-circle-check{
  font-size: 1.2em;
  float: left;
  margin-right: 10px;
}

.fa-circle-chevron-right{
  color: #0077ff;
}
.fa-circle-xmark{
  color: red;
}
.fa-circle-exclamation{
  color: #ffa640;
}
.fa-circle-check{
  color: green;
}

.attribution .attribution__link{
  display: none;
}


/* HEADER */
.site-branding img{
    max-height: 90px;
}
.pr-header {    
    background-color: #FFFFFF;
}
.block-plugin-id--system-branding-block {
    margin: 0.5rem 0;
}


/* INPUT */

input, select{
  font-family: "Lato", sans-serif;
}

.form-actions .button {
    margin-top: 10px;
}

button, .button {
  border-radius: 2px;
  border-color: transparent;
  background-color: #990000;
  box-shadow: 0 1px 3px rgb(0 0 0 / 30%), 0 0 2px rgb(0 0 0 / 20%), 0 1px 0 rgb(0 0 0 / 15%);
  color: #fcfcfc;
}

button:hover, button:focus, .button:hover, .button:focus {
  background-color: #990000;
  opacity: 0.6;
}

/*DASHBOARD*/

.dashboard-item{
  width: 350px;
  color: fcfcfc;
}

.node--type-dashboard{
  display: none;
}

.dashboard-container{
  width: 100%;
  text-align: center;
  border-style: solid;
  border-color: #cccccc;
  border-width: 1px;
  display: inline-block;
  padding: 10px 0 15px 0;
}

.dashboard-item{
  margin-top: 5px;
  margin-right: 10px;
  padding-top: 4px;
  width: 350px;
  display: inline-block;
}

.dashboard-item a {
    color: #fcfcfc;
}

.form-item-uid .ui-autocomplete-input{
   max-width: 300px;
}

.form-item-uid #edit-uid--description{
  display: none;
}

/* USER PROFILE */

.user--profile h1{
  font-size: 1.8em;
}
.user--profile h2{
  font-size: 1.5em;
}

article.user--profile { 
  padding: 10px;
}

.user--profile .field__label{
  width: 150px;
}

.field-entity-reference-type-taxonomy-term .field__item {
  margin: 0;
}

.status_1, .status_2, .status_3{
  font-weight: bold;
}

article.user--profile a:last-child {   
  padding: 5px;
  border-radius: 2px;
  border-color: transparent;
  background-color: #990000;
  box-shadow: 0 1px 3px rgb(0 0 0 / 30%), 0 0 2px rgb(0 0 0 / 20%), 0 1px 0 rgb(0 0 0 / 15%);
  color: #fcfcfc;
 }

 .field--name-field-person-vorname{
  padding-top: 50px;
 }


 /* WEBFORMS*/

legend {
  display: contents;
}
.webform-submission-information{
  display: none;
}
.fieldset__label{
  text-transform: none;
}
.form-type-radio label.option, .form-type-checkbox label.option {
  /*background-color: #f7f7f7;*/
}
.form-item, .form-radios, .form-checkboxes {
  margin: 0;
}
.form-type-radio{
  width: 150px;
  float: left;
}
.radios--wrapper{
  background-color: #ffffff;
  padding: 5px;
  margin-bottom: 10px;
}
.block-config-provider--help{
  display: none;
}


/*OVERVIEW COMPENENCIES */
tfoot{
  background-color: #e8e8e8;
  font-weight: bold;
}

tfoot .avarage_percent{
 text-align: center;
}



/*OVERVIEW COMPENENCIES QUESTIONS*/

.col1{
  width: 15%;
}

.col2{
  width: 8%;
}

.status_overview{
  min-width: 100px;
}

/* USER EDIT*/

#edit-account{
  display: none;
}

.user-form .form-item{
  margin-top: 10px;

}


/*QUESTIONS OVERVIEW*/

.fa-circle-info{
  font-size: 1.5em;
  float: left;
  margin-right: 10px;
}

.fa-circle-info{
  color: #0077ff;
}

.cell__header{
  text-align: center;
}

tfoot .total_false{
  text-align: center;
  font-weight: bold;
}

/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;  
  cursor: pointer;
  z-index: 0;
}

/* Tooltip text */
.tooltip .tooltiptext {
  visibility: hidden;
  width: 180px;
  background-color: black;
  color: #fff;
  text-align: center;
  padding: 5px;
  border-radius: 6px;
  font-size: 0.8em;
 
  /* Position the tooltip text - see examples below! */
  position: absolute;
  z-index: 100;
}

/* Show the tooltip text when you mouse over the tooltip container */
.tooltip:hover .tooltiptext {
  visibility: visible;
}

.tooltip-top {
    top: 150%;
    left: 50%;
    margin-left: -60px;
}

</style>