/* Kundenaktivität, Demo Anfragen, Demo Archiv, kauf Anfragen, Kurs+ käufe */
.demo_filter #reportrange {
  padding: 6.5px;
  /* max-width: 250px; */
  border-radius: var(--rd-borderradius-border-md);
  margin-right: 5px;
}

.demo_filter form > div {
  display: table-cell;
  padding-right: 10px;
  vertical-align: top;
}
.demo_filter form > div.filter_label_grid{
  display:grid !important;
  grid-template-areas:
    "LABEL"
    "INPUT";
  /* grid-template-rows: 40px 40px; */
}
.demo_filter form > div.filter_label_grid > *{
  margin:0;
}
.demo_filter form > div label {
  display: block;
  font-weight: var(--rd-fontweights-open-sans-1);
}

.demo_filter input[type="text"],
.demo_filter select {
  width: 250px;
  font-size: var(--rd-fontsize-4);
  line-height: 14px;
  padding: 10px;
  border: var(--rd-borderwidth-border-default) solid #999;
  border-radius: var(--rd-borderradius-border-md);
  margin-right: var(--rd-spacing-xx-sm);
}


.demo_filter form {
  display: grid;
  gap: var(--rd-spacing-x-sm);
  grid-template-areas:
    "EL1 EL2 EL3 EL4"
    "EL5 EL6 EL7 EL8";
}
.demo_filter form > div{
    align-self: end;
}

.demo_filter form button {
  margin-top: 32px;
  padding: 7px 24px;
  width: fit-content;
  justify-self: end;
  margin-right: 10px;
  grid-area: btn;
}

.demo_filter {
  border-radius: var(--rd-borderradius-border-md);
  box-shadow: 0 0.12rem 0.2rem rgba(0, 0, 0, 0.15);
}

.demo_filter input[name="suche"] {
  padding: var(--rd-spacing-x-sm);
}

.demo_filter select[name="was"] {
  margin-top: 32px;
}

.kurs-plus .demo_filter form,
.aktivitaet .demo_filter form {
  display: flex;
}

.kurs-plus .demo_filter select,
.aktivitaet .demo_filter select {
  width: 250px;
}

.kurs-plus .cont_body,
.aktivitaet .cont_body,
.was-ist-neu .cont_body {
  overflow-x: auto;
}

.demo_table .btn_action {
  margin: var(--rd-spacing-xx-sm);
}

.demoform label {
  display: block;
  font-weight: var(--rd-fontweights-open-sans-0);
}

.demoform > input,
.demoform > select,
.demoform > textarea {
  padding: var(--rd-spacing-xx-sm);
  font-size: var(--rd-fontsize-4);
  min-width: 250px;
  border: var(--rd-borderwidth-border-default) solid #999;
}

.demoform textarea {
  width: 100%;
  height: 150px;
}

.demoform > input,
.demoform > select {
  margin-bottom: 10px;
  min-width: 250px;
  box-sizing: border-box;
}


.demo_msg {
  display: block;
  padding: var(--rd-spacing-xx-sm);
  max-width: 250px;
}

.demo_msg:before {
  content: "";
  background-image: url(https://www.pflegecampus.de/src/img/svg/af/comment-solid-gray.svg);
  display: inline-block;
  width: 10px;
  height: 10px;
  background-size: 100%;
  margin-right: var(--rd-spacing-xx-sm);
}

demo_page .support-teaser-b p {
  margin-bottom: 24px;
}

.demo_page .support-teaser-b {
  z-index: 1;
  margin-bottom: 80px;
}

.demo_page .support-teaser-b .contact_overpop_phonewrap {
  display: inline-flex;
  gap: 48px;
  max-width: 100%;
}

.demo_page {
  text-align: center !important;
}

.rd-demo-desc-title {
  font-size: var(--rd-fontsize-8);
  font-weight: var(--rd-fontweights-open-sans-0);
  line-height: var(--rd-lineheights-0);
  letter-spacing: 0.22px;
  color: var(--rd-font-dark);
  margin-bottom: var(--rd-spacing-x-big);
}

.rd-demo-desc p {
  font-size: var(--rd-spacing-md);
  line-height: 170%;
  letter-spacing: 0.16px;
  color: var(--rd-font-dark);
}

.demo_page h1 img[alt="Unhappy Face"] {
  width: 40px;
}

.demo_btn_grid .btn_action.dell_demo ::before,
.demo_btn_grid a.btn_action.add_customer ::before {
  content: "";
  display: inline-block;
  height: 15px;
  width: 15px;
  background-image: none;
  background-color: var(--rd-font-light);
}

.demo_btn_grid .btn_action.dell_demo ::before {
  mask-size: contain;
  -webkit-mask-size: contain;
  mask-position: 50%;
  -webkit-mask-position: 50%;
  mask-image: url(/src/img/2021/svg/trash.svg);
  -webkit-mask-image: url(/src/img/2021/svg/trash.svg);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
}

.demo_btn_grid a.btn_action.add_customer ::before {
  mask-size: contain;
  -webkit-mask-size: contain;
  mask-position: 50%;
  -webkit-mask-position: 50%;
  mask-image: url(/src/img/svg/reload_icon.svg);
  -webkit-mask-image: url(/src/img/svg/reload_icon.svg);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
}

.demo_btn_grid {
  display: inline-grid;
  grid-template-areas:
    "BTN1 BTN2 BTN3"
    "BTN4 BTN5 BTN6";
  margin-right: 15px;
}

.del_demo span {
  display: block;
  color: #999;
}

/* --- Demo Messe Form --- */

.demo-messe-form h1,
.demo-messe-form h2 {
  font-size: var(--rd-fontsize-10);
  color: var(--rd-primary-active);
}

.demo-messe-form .flex {
  align-items: flex-end;
  width: calc(100% - 14px);
  gap: var(--rd-spacing-sm);
  margin-bottom: var(--rd-spacing-md);
  margin-top: var(--rd-spacing-big);
}

.demo-messe-form label {
  display: block;
  font-weight: var(--rd-fontweights-open-sans-0);
}

.demo-messe-form pc-files {
  width: 100%;
  margin-top: 0;
}

.demo-messe-form pc-files .pc_ufiles_uploadlink {
  margin-top: 0;
}

.demo-messe-form input,
.demo-messe-form select {
  padding: 12px;
  font-size: var(--rd-fontsize-4);
  border: 1px solid var(--rd-input-focused);
  width: 100%;
}

.demo-messe-form .flex.fx1,
.demo-messe-form .flex.fx3 {
  display: grid !important;
  grid-template-areas: "EL1 EL2";
  grid-template-columns: 50% 50%;
}

.demo_filter button:focus{
    background: var(--rd-primary-pressed) !important;
  border: var(--rd-borderwidth-border-default) solid var(--rd-primary-pressed) !important;
  color: var(--rd-font-light) !important;
}

/* --- Demo Archive --- */

body[data-page="demo-archiv"] td[data-label="Vorname Name"] {
  word-wrap: break-word;
  max-width: 250px;
}

/* --- Responsive --- */

@media screen and (max-width: 970px) {

  .demo-messe-form .flex.fx1,
  .demo-messe-form .flex.fx3,
  .demo-messe-form .flex {
    display: block !important;
    width: 100%;
  }
}

@media screen and (max-width: 1420px) {
  .demo_filter form {

    display: grid;
    grid-template-areas:
      "EL1 EL2"
      "EL3 EL4"
      "EL5 EL6"
      "EL7 EL8"
    ;
    width: 95%;
    position: relative;
    grid-template-columns: 50% 50%;
  }

  .demo_filter form button {
    width: fit-content;
    margin-bottom: 0;
  }

  .demo_filter {
    max-width: 98%;
    padding-bottom: 20px;
  }

  .demo_filter input[type="text"],
  .demo_filter select {
    width: 100%;
  }

  .demo_filter #reportrange {
    width: 100%;
  }
}

@media screen and (max-width: 800px) {
  .demo_filter form {
    display: grid;
    grid-template-columns: auto auto;
    grid-template-areas:
      "one one"
      "one one"
      ". btn";
    gap: var(--rd-spacing-x-sm);
  }

  .demo_filter .cb_navi {
    background-color: var(--rd-font-light);
  }
}

@media screen and (max-width: 500px) {
  .demo_filter form button {
    width: 100%;
  }
}


#DemoTyp .rd-checkbox-label,
.demo_typ{
	text-align: center;
	padding: var(--rd-spacing-xx-sm) var(--rd-spacing-sm);
	font-size: var(--rd-fontsize-3);
	font-style: normal;
	font-weight: var(--rd-fontweights-open-sans-1);
	line-height: normal;
	border-radius: var(--rd-borderradius-border-lg);
}
#DemoTyp .rd-panel .rd-checkboxes-listitem-group label{
	display: grid;
	grid-template-areas:
		"INPUT LABEL";
	grid-template-columns: 30px auto;
}
.demo_typ{
	display:inline-block;
	white-space: nowrap;
	
}
.demo_typ.dt_demo{
	    background-color: #FFF1F2;
    color: #9F1239;
}
.demo_typ.dt_pro_upgrade{
	    background-color: #ecf7db;
	    color: #369f34;
}
.demo_typ.dt_angebot{
    background-color: #E7F0D9;
    color: #526D26;
}
.demo_typ.dt_verlaengerung{
background-color: #ECF1F8;
    color: #4073B6;
}
.demo_typ.dt_schwebend::after{
  content: " (schwebend)";
  font-size: var(--rd-fontsize-2);
  color: #DC2626;
	font-weight: var(--rd-fontweights-open-sans-2);
}
.dt_webinar{
	background-color: #fff3e0;
    color: #ffa500;
}
.demo_typ.dt_campaign{
	margin-top: var(--rd-spacing-xx-sm);
	background-color: #EEF2F6;
	color: #475569;
}
.demo_typ.dt_campaign_sommer{
	background: linear-gradient(90deg, #FFE9A8, #FFC766);
	color: #8A5A00;
	font-weight: var(--rd-fontweights-open-sans-2);
}