:root{
  --bs-body-font-size:18px;
  --bs-body-font-family:Lato,-apple-system,Roboto,Verdana,sans-serif !important;
}
@font-face {
  font-family: "Sectra";
  font-weight: 700;
  font-display: swap;
  src: url('/.resources/cic-home-theme/webresources/GT-Sectra-Fine-Bold.woff2') format('woff2');
}
body{
  background:url('redesign-background.jpg') #e2e3db top right no-repeat !important;
  background-size:contain !important;
  font-family: Lato,-apple-system,Roboto,Verdana,sans-serif;
  font-weight: 300 !important;
  font-size:18px !important;
  height: 100%;
  color: #505050;
}
.header {
  position: relative;
  display: flex;
  height: 90px;
  margin: 20px auto;
  padding: 0;
  width: 100%;
  max-width: 1220px;
}
.header .navbar-brand {
  margin: 17px 0 17px 0px;
  display: inline-block;
  padding-top: 0.3125rem;
  padding-bottom: 0.3125rem;
  margin-right: 1rem;
  font-size: 1.25rem;
  line-height: inherit;
  white-space: nowrap;
}
.box-header {
  position: relative;
  padding-top: 10px;
  padding: 15px 25px 5px;
}
h1.title {
  align-self: center;
  font-family: Sectra, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, Helvetica Neue, Arial;
  font-weight: normal;
  font-size: 22px;
  line-height: 30px;
  color: black;
  min-height: 48px;
  margin: 0;
  padding-top: 4px;
}
.language-switcher .dropdown-toggle{
  float: right;
}
.box-content {
  padding: 16px 0px 16px 25px;
}
main .box {
  min-width: 0;
  min-height: 0;
  /* TODO: Align with all OTHER 1280/1220 values (header, footer etc.)! */
  max-width: 1220px; /*TODO: eigentlich 1280px (falls wie Funds-Finder) */
  border-radius: 8px;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto 1fr auto;
  grid-template-areas:
        "header"
        "main"
        "footer";
  align-content: start;
  margin: 0 auto;
  min-height: 100%;
  padding: 0 15px;
  background: #fff;
  box-shadow: 0 2px 8px 0 rgb(99 99 99 / 20%);
  border-radius: 0;
}
.form-control, .form-select{
  border-radius: 0 !important;

}

.form-control, .form-select{
  font-weight: 300 !important;
}

.form-control:focus, .custom-control-input:checked, .form-select:focus{
  box-shadow: 0 0 0 .25rem rgba(102,0,0,.25) !important;
  border-color:rgb(102,0,0,.5) !important;
}
#app .custom-control-input:checked{
  background-color:rgb(102,0,0,0.5) !important;
}
.btn {
  text-align: left;
  border:1px solid #660000 !important;
}
.btn:hover{
  background: rgb(65,0,13) !important;
  color:white !important;
}
#app .btn:focus-visible{
  box-shadow: 0 0 0 .25rem rgba(102,0,0,.25) !important;
}
/* TODO: Hover Menu (language selection) is NOT visible with this!!*/
#dropdown-button, #dropdown-button:hover, #dropdown-button:active{
  border:none !important;
  background: transparent !important;
  color:black !important;
}
#app .btn-action {
  border-radius: 0 !important;
}
.btn-primary {
  background-color: #660000;
  border: none;
}
.personlist h4 {
  margin-top: 20px;
  font-size: 18px;
}
form h3 {
  font-size: 22px;
  line-height: 24px;
  color: #660000;
  font-weight: 400;
  line-height: 30px!important;
  margin-bottom: 10px;
}
form h4{
  font-size: 18px;
  color: #660000;
  font-weight: 700;
  line-height: 26px!important;
}
form label.error {
  color: #b00020;
  font-size: .8em;
}
form .form-label {
  margin-bottom: 0.20rem;
}
form .form-label sup {
  font-weight: 400;
}
form b {
  color: #5a5a5a;
}
form p {
  margin-bottom: 0.7rem;
  line-height: 133%;
}
.form-row {
  margin-bottom: 10px;
  display: block;
}
.form-check {
  margin-bottom: 5px;
}
.form.subtitle {
  margin-bottom: 10px;
}
form .list-group-item {
  border-left: 2px solid #f0f0f0;
}
.btn img, .list-group-item-action img {
  width: 18px;
  filter: invert(30%);
}
.btn-primary img {
  filter: invert(100%);
}
.stepwizard-step p {
  margin-top: 10px;
  padding-left:10px;
  padding-right:10px;
}
.stepwizard-row {
  display: table-row;
}
.stepwizard {
  display: table;
  width: 50%;
  position: relative;
  margin-left: auto;
  margin-right: auto;
}
.stepwizard-step button[disabled] {
  opacity: 1 !important;
  filter: alpha(opacity=100) !important;
}
.stepwizard-row:before {
  top: 14px;
  bottom: 0;
  position: absolute;
  content: " ";
  width: 100%;
  height: 1px;
  background-color: #ccc;
  z-order: 0;
}
.stepwizard-step {
  display: table-cell;
  text-align: center;
  position: relative;
}
.stepwizard-step .btn-outline-secondary {
  background-color: white;
}
.btn-circle {
  width: 30px;
  height: 30px;
  text-align: center;
  padding: 6px 0;
  font-size: 12px;
  line-height: 1.428571429;
  border-radius: 15px;
}


.custom-control-inline {
  display: inline-block;
  margin-right: 1rem;
}
.custom-control {
  display: block;
  min-height: 1.5rem;
  padding-left: 1.5em;
  margin-bottom: 0.125rem;
}
.custom-radio input.custom-control-input{
  float: left;
  margin-left: -1.5em;
  margin-top:5px;
}
form .btn-action {
  --bs-btn-padding-y: 0.4rem;
  --bs-btn-padding-x: 1.2rem;
  --bs-btn-font-size: 1.1rem;
  --bs-btn-border-radius: 0.5rem;
}
form .form-check input:checked, form .btn-primary {
  background-color: #660000 !important;
}
/* Step 2 radios*/
.form-check-input:checked,.form-check-input:active{
  border-color:#660000 !important;
  box-shadow: 0 0 0 .25rem rgba(102,0,0,.25) !important;
}
form .personlist .list-group-item.active {
  background-color: #f9efef !important;
  border-left-color: #660000 !important;
  color: #505050;
}
form .personlist .list-group-item {
  color: #505050;
  font-weight: normal;
  border: none;
  border-left: 2px solid #f0f0f0;
  border-radius: 0px;
}
form .personlist .btn{
  border-radius: 0px;
}
form .list-group-item h5{
  font-size: 1rem;
}

#captcha {
  height: 30px;
  width: 230px;
  margin: 1.25em 0 1.5em 0;
  clear: both;
}

#captcha span {
  float: left;
  padding-left: 49px;
  line-height: 30px;
  padding-bottom: 5px;
  font-size: 16px;
  font-weight: 300;
}

#check {
  border-radius: 3px;
  width: 30px;
  height: 30px;
  border: 2px solid black;
  display: inline;
  position: absolute;
  cursor: pointer;
}

/*Styles for check animation*/
#check .wrapper {
  width: 25px;
  display: inline;
  margin: 4em auto 0;
}

#captcha .error {
  color: #b00020;
  float: left;
}

button#submit[disabled] {
  background: lightgrey;
}
form p.small {
  font-size: 12px;
  margin-bottom:0.2rem;
  line-height: 120%;
}

/* Checkbox Styling */
.custom-control-input:checked {
  background-color: #46aae6!important;
}
.custom-control-input[type=checkbox] {
  border-radius: 0.25em;
}
.custom-control-input:checked[type=checkbox] {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}
.custom-control-input:checked[type=radio] {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
}
.custom-control-input:focus {
  border-color: #86b7fe;
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgb(13 110 253 / 25%);
}

.custom-control-input {
  float: left;
  margin-left: -1.5em;
  width: 1em;
  height: 1em;
  margin-top: 0.25em;
  vertical-align: top;
  background-color: #fff;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  border: 1px solid rgba(0, 0, 0, 0.25);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-print-color-adjust: exact;
  color-adjust: exact;
  print-color-adjust: exact;
}
.custom-control-input[type=radio] {
  border-radius: 50%;
}
.custom-control-input:checked {
  background-color: #46aae6;
  border-color: #46aae6;
}
.custom-control-inline {
  display: inline-flex;
  margin-right: 1rem;
}
.custom-control-inline .custom-control-input {
  margin-right: 10px;
}
form .form-select {
  font-size: 0.9rem;
}

* {
  box-sizing: inherit;
}
html, body{
  height:100%;
  box-sizing: border-box;
}
main.main{
  min-height: 100%;
  display: grid;
  grid-template-rows: auto 1fr auto;
}

footer{
  margin:8em auto 0 auto;
  background:#373a3c;
  color:white;
  font-size:15px;
}
footer a{
  color:inherit;
  text-decoration: none;
}
footer a:hover{
  color:inherit;
  text-decoration: underline;
}
footer .wrapper{
  max-width: 1220px;
  margin:0 auto;
  padding:2em 0;
}
footer nav ul, footer nav li{
  list-style:none;
  font-weight: 400;
}

.contact p{
  margin:0.2em 0
}