/* ****************************************************************************
* Diese Datei gehört zum WebEng20/21 Projekt der Gruppe 13                    * 
* CSS File für das Datenobjekt Kontakte                                       *
* Copyright (c) by Bjoern Scherenberger                                       *
***************************************************************************** */

/*CSS File für Kontakt*/

/* Labelfarbe setzen*/

label {
    color: #33BDFF;
}

hr {
  margin: 0px;
}

/*ab hier für CSS für die Formularansichten*/

.formularContainer .breit a {
    text-decoration: none;
    font-family: Arial;
    color: black;
}

.formularContainer .breit a:hover {
    color: blue;
}

.formularContainer {
    display: grid;
    width: 50%;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
    grid-template-columns: 1fr 2fr 2fr;
    grid-row-gap: 20px;
}

.formularContainer div {
    padding-right: 5px;
}

.formularContainer h2 {
    text-align: left;
    grid-column: 1/4;
}

.formularContainer .breit {
    text-align: left;
    grid-column: 1/4;
}

.formularContainer label {
    display: inline-block;
    min-width: 120px;
    padding-right: 10px;
}

.formularContainer textarea {
    width: 99%;
    height: 10em;
    font-family: Arial;
    font-size: 1em;
    color: black;
    box-shadow: inset 1px 2px 8px 4px #dae1e3;
    padding: 15px;
}

/*ab hier CSS für Tabellenansicht*/

#tableContainer {
    display: grid;
    width: 95%;
    margin: 2em 2em 4em 2em;
    text-align: left;
    grid-template-columns: 0.5fr 0.5fr 1fr 1fr 1fr 1fr 3fr 1fr 0.5fr;
    grid-template-rows: auto;
    grid-row-gap: 15px;
    grid-column-gap: 25px;
}

#tableContainer h2 {
    text-align: left;
    grid-column: 1/10;
}

#tableContainer .breit {
    text-align: right;
    grid-column: 1/10;
}

#tableContainer .breit_l {
  text-align: right;
  grid-column: 1/9;
}

#tableContainer textarea {
    width: 100%;
    height: 5.3em;
    resize: none;
    border-color: #33BDFF;
    box-shadow: inset 1px 2px 4px 2px #dae1e3;
    font-family: Arial;
    color: black;
}

/* Ab hier CSS für die Gestaltung der UI-Dialogbox*/

/*html-code in Normalansicht verstecken*/
#dialogDelete {
    display: none;
}

#dialogFehler {
    display: none;
}

/*Dialogfenster Gestalten*/
.customDialog.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset {
    float: none;
    text-align: center;
    padding: 15px;
    border: none;
}

.ui-dialog Button {
    background-color: white;
    color: red;
}

.customDialog .ui-dialog-titlebar-close {
    display: none;
}

.customDialog .ui-widget-content {
    background: white;
}

.customDialog .ui-dialog-content {
    background: white;
}

.customDialog .ui-widget-header {
    background-color: red;
    color: white;
    text-align: center;
}