/*--------------------------------------------------------------------------------*/
/*Colors*/
/*--------------------------------------------------------------------------------*/
:root {
  --color_tecnolution_blue: #008ccc;
  --color_tecnolution_white: #ffffff;
  --border-color: rgba(136, 136, 136, 0.9);
  --color-boder-shadow: #E0E0E0;
  --border-weight: 1px;
  --text-on-black-color: #ffffff;
  --color-inputfield-background: #ffffff;
  --color_error: #f02020;
  --color_warning: #FC9629;
  --color_information: #58B3DD;
  --color_confirmation: #4FC03A;
  --color_unimportant: grey;
  --color_icon: #000000;
  --color_icon_alternate: color-mix(in srgb, var(--color_icon) 70%, white 30%);
  --color_icon_highlight: color-mix(in srgb, var( --color_tecnolution_blue) 70%, white 30%);
  --color_light_error: color-mix(in srgb, var(--color_error) 30%, white 70%);
  --color_light_warning: color-mix(in srgb, var(--color_warning) 30%, white 70%);
  --color_light_information: color-mix(in srgb, var(--color_information) 30%, white 70%);
  --color_light_confirmation: color-mix(in srgb, var(--color_confirmation) 30%, white 70%);
  --color_halftransparent_error: color-mix(in srgb, var(--color_error) 30%, transparent 70%);
  --color_halftransparent_warning: color-mix(in srgb, var(--color_warning) 50%, transparent 50%);
  --color_halftransparent_information: color-mix(in srgb, var(--color_information) 30%, transparent 70%);
  --color_halftransparent_confirmation: color-mix(in srgb, var(--color_confirmation) 30%, transparent 70%);
  --color_transparent_error: color-mix(in srgb, var(--color_error) 5%, transparent 95%);
  --color_transparent_warning: color-mix(in srgb, var(--color_warning) 10%, transparent 90%);
  --color_transparent_information: color-mix(in srgb, var(--color_information) 5%, transparent 95%);
  --color_transparent_confirmation: color-mix(in srgb, var(--color_confirmation) 5%, transparent 95%);
  --radius-container: 0.5em 0.5em 0 0.5em;
  --radius-element: 0.2em 0.2em 0 0.2em;
  --standard-box-shadow: 0px 6px 25px 5px rgba(0,0,0,0.13);
  --standard-box-padding: 0.5em 0.5em 0.5em 1em;
  --standard-box-background: #ffffff;
  --color-hover-icon: var(--color_tecnolution_blue);
  --color-table-zebra: rgba(136, 136, 136, 0.3);
  /*--------------------------------------------------------------------------------*/
  /*Sizing*/
  /*--------------------------------------------------------------------------------*/
  --height-icon-panel: 1.2em;
  --height-table-row: 37px;
  --min-table-cell-width: 2em;
}

/*--------------------------------------------------------------------------------*/
/*Backgrounds*/
/*--------------------------------------------------------------------------------*/
/*--------------------------------------------------------------------------------*/
/*Mesurements*/
/*--------------------------------------------------------------------------------*/
/*
$mesurement_sidepanel_width: 15vw;

$mesurement_topspaceing: 2vh;
$mesurement_bottomspaceing: (($mesurement_topspaceing *0.5 )*3);

$mesurement_header_hight: 6vh;
$mesurement_header_contantactionpanel_gap:($mesurement_header_hight * 0.3);
$mesurement_contentActionsPanel_hight: ($mesurement_header_hight * 0.8);
$mesurement_footer_height: ($mesurement_header_hight * 0.5);

$mesurement_main_to_navi_offset: ($mesurement_header_contantactionpanel_gap * 0.3333333);
$messurement_main_top_spaceing: (($mesurement_main_to_navi_offset *2)  + $mesurement_contentActionsPanel_hight);
$mesurement_main_footer_overlap: ($mesurement_bottomspaceing*0.33333333);
$mesurement_main_bottom_spaceing: (($mesurement_bottomspaceing - $mesurement_main_footer_overlap )*0.7);

$messurement_offset_horizontal_contentActionsPanel: 3vw;*/
/*--------------------------------------------------------------------------------*/
/*Icons*/
/*--------------------------------------------------------------------------------*/
.material-icons.culture::after {
  content: "translate";
}
.material-icons.user::after {
  content: "person";
}
.material-icons.tenant::after {
  content: "business";
}
.material-icons.admin::after {
  content: "cloud";
}

/*NEW STUFF*/
#content {
  display: flex;
  flex-direction: column;
  z-index: 1;
}

.sectionLayout.Flex > * {
  flex-grow: 1;
  flex-shrink: 1;
}

.fieldWrap {
  display: grid;
  height: 2.3em;
  grid-template-columns: 1fr max-content;
  padding: 0 0.5em;
}
.fieldWrap > div {
  align-self: center;
  display: flex;
  position: relative;
  flex: 1 1 auto;
}

div.form-group {
  position: relative;
}