@import url("https://fonts.cdnfonts.com/css/helvetica");
@import url("https://fonts.cdnfonts.com/css/helvetica-neue-55");
@font-face {
  font-family: "Raleway";
  font-style: normal;
  font-weight: 400;
  /* font-display: swap; */
  src: url("fonts/Raleway-Regular.ttf") format("woff2"),
    url("fonts/Raleway-Regular.ttf") format("woff");
}
@font-face {
  font-family: "Raleway";
  font-style: normal;
  font-weight: 600;
  /* font-display: swap; */
  src: url("fonts/Raleway-SemiBold.ttf") format("woff2"),
    url("fonts/Raleway-SemiBold.ttf") format("woff");
}
@font-face {
  font-family: "Raleway";
  font-style: normal;
  font-weight: 800;
  /* font-display: swap; */
  src: url("fonts/Raleway-ExtraBold.ttf") format("woff2"),
    url("fonts/Raleway-ExtraBold.ttf") format("woff");
}

@font-face {
  font-family: "Helvetica";
  font-style: normal;
  font-weight: 800;
  /* font-display: swap; */
  src: url("fonts/Helvetica-ExtraBold.ttf") format("woff2"),
    url("fonts/Helvetica-ExtraBold.ttf") format("woff");
}

body {
  color: var(--main-text-color);
  background-color: #e8eaed;
  font-family: "Raleway", sans-serif;
  font-display: optional;
  --main-text-color: #1e314b;
}
p,
h1,
h2,
h3,
h4,
h5 {
  padding: 0;
  margin: 0;
}
a {
  /* color: inherit; */
  text-decoration: none;
}
h1 {
  font-weight: 800;
  font-size: 28px;
  text-transform: uppercase;
}

#top {
  min-height: 53px;
  height: 53px;
  text-align: justify;
  background-color: white;
  margin-top: 0;
}
.startTop {
  position: relative;
  z-index: 2;
  border-bottom: 1px solid #c0c5cc;
  box-shadow: 0px 6px 18px 0px rgba(30, 49, 75, 0.1);
  -webkit-box-shadow: 0px 6px 18px 0px rgba(30, 49, 75, 0.1);
  -moz-box-shadow: 0px 6px 18px 0px rgba(30, 49, 75, 0.1);
}
.masterGridX {
  display: grid;
  grid-template-columns: 1fr [alstart] 18px [alend] 30px [cxstart] 1200px [cxend] 30px [arstart] 18px [arend] 1fr;
  align-content: start;
}
.topGrid {
  grid-template-rows: 13px [cystart] 24px [cyend] 16px;
}
.topContent {
  grid-column: cxstart / cxend;
  grid-row: cystart / cyend;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.topLogoButton {
  background-image: url(../ui_images/logo.png);
  background-position: 0 0;
  width: 175px;
  height: 24px;
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
}

.topWrapButtons {
  display: flex;
  height: auto;
  align-items: center;
}

.topBellIcon {
}

.topWrapButtons .searchStripEl .foregroundBox {
  display: flex;
  margin: 0 50px;
  height: 53px;
  align-items: center;
}

.topBellBadge {
  border-radius: 20px;
  background: red;
  font-size: 12px;
  font-weight: 600;
  display: flex;
  height: 20px;
  width: 20px;
  color: white;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: -5px;
  z-index: 1;
  right: -5px;
}

.topLoginButton {
  /* display:inline-block; */
  display: flex;
  color: #1e314b;
  align-items: center;
  font-weight: 600;
  font-size: 14px;
  height: 19px;
}
a {
  text-decoration: none !important;
  /* color: inherit !important; */
}
a.topLoginButton:hover {
  color: #1e314b !important;
}
.topLoginButton > ion-icon {
  font-size: 20px;
}

.topRightButtons {
  display: flex;
}

.notificationHeader{
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  padding-bottom: 4px;
  border-bottom: 1px solid #999;
  margin-bottom: 4px;
}

.notificationType {
  font-weight: bold;
}

.notificationView {
}
.cta_first_frame {
  height: 100vh;
}
.cta_first_frame .mainSearchBoxLarge {
  height: 50vh;
}
.mainSearchBox {
  background-image: url(src/bg_search.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}
.mainSearchBoxThin {
  background-image: none;
}
.mainSearchContent {
  grid-column: alstart / arend;
  display: grid;
  grid-template-rows: 144px 302px;
  align-items: start;
  justify-content: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 350px;
  background-position: center center;
}
.mainSearchBoxThin > .mainSearchContent {
  height: 156px;
  align-items: center;
}

.mainSearchTop {
  font-size: 20px;
  font-weight: 400;
  align-self: end;
  justify-self: center;
}
.catSelect {
  width: 180px;
  height: 71px;
  display: flex;
  justify-content: space-between;
}
.catSelect a {
  color: #8e98a5;
}
.catSelectSelected {
  text-align: center;
  justify-self: center;
}
.catSelect > .catSelectSelected > a {
  color: #1e314b;
}
.catSelect .css_icon_chev_down {
  display: none;
}
.catSelect > .catSelectSelected .css_icon_chev_down {
  display: block;
}

.mainSearchBottom {
  grid-row: 2 / 3;
}
.searchStrip {
  display: flex;
  align-items: center;
  justify-content: space-between;

  height: 84px;
  width: 963px;
  /* border:1px solid #d6d9de; */

  border: 1px solid var(--strip-radius-border-color);
  border-radius: 42px;
  /* background:white; */
  background-color: var(--dark-bg-color);
  box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  -webkit-box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  -moz-box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  padding: 0 14px 0 35px;
}
.mainSearchBoxThin .searchStrip {
  width: 1200px;
  height: 86px;
  box-sizing: border-box;
}
.mainContentBlue .mainSearchBoxThin .searchStrip {
  border: 1px solid #58768d;
  background: #112139;
}
.searchStripInput {
  /* color:#8e98a5; */
  color: var(--default-color);
  font-weight: 400;
  font-size: 22px;
  width: 240px;
  border: none;
  outline: none;
  background-color: var(--dark-bg-color);
}
.searchStripInput:focus {
  border-bottom: 1px solid #8e98a5;
}
.css_icon_chev_down {
  display: block;
  margin: 12px auto 0;
  width: 12px;
  height: 12px;
  border-top: 2px solid #a9b1bb;
  border-right: 2px solid #a9b1bb;
  transform: rotate(135deg) translate(-5px, 7px) skew(9deg, 9deg);
}
.css_icon_chev_down_sm {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-top: 2px solid #1e314b;
  border-right: 2px solid #1e314b;
  transform: rotate(135deg) translate(0px, 2px);
}
.mainContentBlue .pagination .css_icon_chev_down_sm {
  border-top: 2px solid white;
  border-right: 2px solid white;
}
.mainContentRed .pagination .css_icon_chev_down_sm {
  border-top: 2px solid #ffa69a;
  border-right: 2px solid #ffa69a;
}
.searchStripSubFlex {
  display: inline-flex;
  justify-content: space-between;
  min-width: 628px;
  width: max-content;
  /* width:calc(max-content + 10px); */
  align-items: center;
  /* gap:1px; */
}
.searchStripDivider {
  width: 1px;
  height: 42px;
  overflow: hidden;
  background-color: var(--default-color);
  flex: 0 0 1px;
}
.searchStripEl {
  position: relative;
  padding: 0;
  user-select: none;
}
.searchStripSubFlex .searchStripEl {
  /* flex:1 0 auto; */
  /* max-width:33%; */
}
.searchStripEl > label,
.searchStripEl .foregroundBox > label {
  display: block;
  color: #9b061b;
  font-weight: 800;
  font-size: 14px;
  text-transform: uppercase;
}
.mainSearchBoxThin .searchStripEl label {
  margin-bottom: 6px;
}
.mainContentBlue .mainSearchBoxThin .searchStripEl label {
  color: #81c6f5;
}
.searchStripEl > p,
.searchStripEl .foregroundBox > p {
  color: var(--default-color);
  font-weight: 400;
  font-size: 22px;
}
.mainSearchBoxThin .foregroundBox p {
  font-size: 18px;
}
.searchStripBranchen {
  max-width: 40%;
}
.searchStripRegion {
  max-width: 25%;
}
.searchStripUmsatz {
  max-width: 45%;
}
.form_selection_preview {
  width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
  line-height: 1.2em;
}
.searchStripButton {
  display: block;
  background-image: url(src/bg_sprite.png);
  background-position: -255px -1px;
  width: 57px;
  height: 56px;
  border: 0;
  background-color: transparent;
  cursor: pointer;
}
.searchStripAddFiltersButton {
  display: inline-flex;
  align-items: center;
  text-align: center;
  white-space: nowrap;
  font-size: 18px;
  font-weight: 600;
  color: #1e314b;
  height: 56px;
  padding: 0 26px;
  border-radius: 28px;
  background: rgb(186, 192, 199);
  background: linear-gradient(
    0deg,
    rgba(186, 192, 199, 1) 0%,
    rgba(220, 226, 231, 1) 100%
  );
}
.mainContentBlue .searchStripAddFiltersButton {
  color: white;
  background: rgb(66, 98, 134);
  background: linear-gradient(
    180deg,
    rgba(66, 98, 134, 1) 0%,
    rgba(34, 65, 101, 1) 100%
  );
}
.mainContentRed .searchStripAddFiltersButton {
  color: white;
  background: rgb(164, 18, 41);
  background: linear-gradient(
    180deg,
    rgba(164, 18, 41, 1) 0%,
    rgba(130, 0, 6, 1) 100%
  );
}
.searchStripAddFiltersButton > span {
  color: #9b061b;
  margin-left: 5px;
}
.mainSearchSubline {
  margin: 13px 55px 0 0;

  font-size: 14px;
  font-weight: bold;
  color: #7c8895;
  text-align: right;
}
.mainSearchSubline > a {
  color: #7c8895;
}
.suche_results_header {
  grid-column: cxstart / cxend;
  min-height: 56px;
  margin-top: -18px;

  display: grid;
  grid-template-columns: 20% auto 20%;
}
.suche_results_text {
  font-size: 28px;
  color: #1e314b;
  text-align: center;
}
.mainContentBlue .suche_results_text {
  color: #a5c4da;
}
.mainContentRed .suche_results_text {
  color: #ffa69a;
}
.suche_results_button {
  display: inline-flex;
  background-color: #dde0e4;
  height: 34px;
  align-items: center;
  justify-content: space-between;
  border-radius: 17px;
  font-size: 12px;
  color: #1e314b;
  text-transform: uppercase;
  padding: 0 22px;
  width: max-content;
  gap: 8px;
}
.mainContentBlue .suche_results_button {
  background-color: #426286;
  color: white;
  border: 1px solid #112139;
}
.mainContentRed .suche_results_button {
  background-color: #9b061b;
  color: white;
  border: 1px solid rgba(0, 0, 0, 0.4);
}
.suche_results_resetbutton {
  grid-column: 1 / 2;
}
.suche_results_speichernbutton {
  grid-column: 3 / 4;
  justify-self: end;
}

.mainTrinity {
  background-image: url(src/bg_main_trinity.jpg);
  /* background-image:url(src/cbuy_trinity.png); */
  background-repeat: no-repeat;
  background-size: cover;
  box-sizing: border-box;
  height: 168px;
  background-position: center center;
}
.mainTrinityThin {
  background-image: url(src/bg_main_trinity_thin.jpg);
  background-position: center center;
  /* background-image:url(src/dummy_7.png); */
  height: 88px;
  box-shadow: 1px 1px 18px 0px rgba(192, 197, 204, 0.1);
  -webkit-box-shadow: 1px 1px 18px 0px rgba(192, 197, 204, 0.1);
  -moz-box-shadow: 1px 1px 18px 0px rgba(192, 197, 204, 0.1);
  min-width: calc(18px + 30px + 1200px + 30px + 18px);
}
.trinityMenu {
  grid-column: cxstart / cxend;
  /* background-image:url(src/bg_main_trinity.jpg); */
  background-image: inherit;
  /* background-image:url(src/cbuy_trinity.png); */
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}
.trinityMenuInner {
  position: relative;
  grid-column: alstart / arend;
  box-sizing: border-box;
  height: 168px;
}
.mainTrinityThin > .trinityMenu > .trinityMenuInner {
  height: 88px;
}
.mainTrinityH1,
.mainTrinityH2,
.mainTrinityH3 {
  position: absolute;
  background-image: url(src/bg_sprite.png);
  top: 44px;
}
.mainTrinityH1 {
  display: inline-block;
  background-position: 0 -25px;
  top: 44px;
  left: 1px;
  width: 166px;
  height: 80px;
}
.mainTrinityH2 {
  display: inline-block;
  background-position: 0 -106px;
  left: 408px;
  width: 58px;
  height: 21px;
}
.mainTrinityH3 {
  display: inline-block;
  background-position: 0 -191px;
  left: 846px;
  width: 139px;
  height: 85px;
}

.homeTabText1,
.homeTabText2,
.homeTabText3 {
  position: absolute;
  /* background-image: url(src/bg_sprite.png); */
  top: 44px;
}

.homeTabText1 {
  display: inline-block;
  color: #ffffff;
  font-size: x-large;
  font-weight: bold;
  background-position: 0 -25px;
  top: 44px;
  left: 1px;
  width: 139px;
  height: 80px;
}
.homeTabText2 {
  display: inline-block;
  color: rgb(0, 0, 32);
  font-size: x-large;
  font-weight: bold;
  background-position: 0 -106px;
  left: 408px;
  width: 139px;
  height: 80px;
}
.homeTabText3 {
  display: inline-block;
  color: #ffffff;
  font-size: x-large;
  font-weight: bold;
  background-position: 0 -191px;
  left: 846px;
  width: 139px;
  height: 80px;
}

.homeTabText1 span,
.homeTabText2 span,
.homeTabText3 span {
  display: block;
  white-space: normal;
  font-weight: normal;
  overflow: hidden;
  font-size: small;
  text-overflow: ellipsis;
  text-align: left;
}

.mainTrinityButton {
  position: absolute;
  font-family: "Raleway", sans-serif;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  line-height: 1em;

  top: 58px;
  width: 155px;
  height: 53px;
  box-sizing: border-box;

  display: flex;
  align-items: center;
  text-align: center;

  padding: 0 10px;
}
.mainTrinityButton1 {
  border: 3px solid #ff988e;
  color: white;
  left: 204px;
}
.mainTrinityButton2 {
  border: 3px solid #8e98a5;
  color: #1e314b;
  left: 637px;
}
.mainTrinityButton3 {
  border: 3px solid #77a0c7;
  color: white;
  left: 1045px;
}
.mainTrinityThin .mainTrinityH1 {
  top: 34px;
  left: 1px;
  width: 155px;
  height: 21px;
}
.mainTrinityThin .mainTrinityH2 {
  top: 34px;
  left: 571px;
}
.mainTrinityThin .mainTrinityH3 {
  top: 34px;
  width: 139px;
  height: 21px;
}
.mainTrinityThin .mainTrinityH2NotActive {
  left: 426px;
}
.mainTrinityThin .mainTrinityButton {
  top: 18px;
}
.mainTrinityThin .mainTrinityButton1 {
  top: 18px;
  left: 204px;
}
.mainTrinityThin .mainTrinityButton2 {
  top: 18px;
  left: 604px;
}
.mainTrinityThin .mainTrinityButton3 {
  top: 18px;
  left: 1045px;
}
.mainTrinityThin .catSelect {
  position: absolute;
  width: 298px;
  top: 35px;
  left: 449px;
  font-size: 18px;
}

.mainContent {
  min-height: 600px;
  padding-bottom: 120px;
}
.mainContentStart {
  background-image: url(src/bg_main.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
}
.mainContentBlue {
  background-image: url(src/bg_blue.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
}
.mainContentRed {
  background-image: url(src/bg_red.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
}
.elementList {
  grid-column: alstart / arend;
  margin-bottom: 35px;
}
.elementRow {
  display: grid;
  text-align: center;
}
.elementRowHeader {
  grid-column: alstart / arend;
  grid-row: 1 / 2;
}
.elementRowHeader > h2,
.elementRowHeader > h3 {
  font-weight: 400;
  font-size: 18px;
  color: #324259;
  text-transform: uppercase;
  margin-top: 36px;
}
.elementRowHeader > h2 {
  margin-top: 2px;
  font-weight: 800;
  font-size: 28px;
  margin-bottom: 3px;
}
.listIndex {
  display: flex;
  align-items: center;
  justify-content: center;
}
.listIndexBox {
  display: inline-block;
  width: 11px;
  height: 11px;
  box-sizing: border-box;
  border: 1px solid #8e98a5;
  background-color: transparent;
}
.listIndexBoxSel {
  background-color: #8e98a5;
}
.listIndexBox + .listIndexBox {
  margin-left: 8px;
}
.listBoxArrowR {
  color: #8e98a5;
  grid-column: arstart / arend;
  align-self: center;
  cursor: pointer;
}
.listBoxArrowL {
  color: #8e98a5;
  grid-column: alstart / alend;
  align-self: center;
  cursor: pointer;
}
.listBoxArrowL_TB {
  display: inline-block;
  width: 20px;
  height: 20px;
  border-top: 2px solid #8e98a5;
  border-right: 2px solid #8e98a5;
  transform: rotate(-135deg) translate(-5px, 2px);
}
.listBoxArrowR_TB {
  display: inline-block;
  width: 20px;
  height: 20px;
  border-top: 2px solid #8e98a5;
  border-right: 2px solid #8e98a5;
  transform: rotate(45deg) translate(-5px, 7px);
}
.listBox {
  grid-column: cxstart / cxend;
  grid-row: 2 / 3;
  display: inline-block;
  position: relative;
  width: 100%;
  /* background-color:white; */
  box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  -webkit-box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  -moz-box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  text-align: left;
  background-color: var(--box-bg-color);
}
.companyList {
  /* grid-template-rows:27px 227px; */
  grid-template-rows: 27px 227px;
}
.mainContentRed .companyList {
  /* grid-template-rows:27px 197px; */
  grid-template-rows: 27px 230px;
}
.topAngebote {
  grid-template-rows: 116px 227px;
}
.companyList > .listBox {
  display: grid;
  grid-template-columns: 486px 36px 650px 1fr;
  grid-template-rows: 28px 18px 23px 88px 28px 18px 1fr;
  grid-template-areas:
    "lbta_img . . ."
    "lbta_img . lbta_cat ."
    "lbta_img . . ."
    "lbta_img . lbta_info ."
    "lbta_img . . ."
    "lbta_img . lbta_attr ."
    "lbta_img . . .";
}
.companyList > .listBox:not(.vbn_topfirmen) {
  width: 95%;
}
.mainContentRed .companyList > .listBox {
  display: grid;
  grid-template-columns: 282px 36px 848px 1fr;
  /* grid-template-rows: 28px 18px 23px 64px 20px 18px 26px; */
  grid-template-rows: 19px 18px 12px 49px 49px 18px 19px;
  grid-template-areas:
    "lbta_img . . ."
    "lbta_img . lbta_cat ."
    "lbta_img . . ."
    "lbta_img . lbta_info ."
    "lbta_img . . ."
    "lbta_img . lbta_attr ."
    "lbta_img . . .";
}
.listBox .listBoxImage {
  grid-area: lbta_img;
  background: #fff;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}
.companyList .listBox img.listBoxImage {
  width: 227px !important;
  position: absolute;
  left: 0;
}
.listBox .listBoxLink {
  grid-area: lgex_img;
}
.listBox .listBoxImageDummy,
.boxBoxImageDummy {
  display: inline-block;
  width: 282px;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-image: url(src/defaultsquirrel-red-283.jpg);
}
.elementList .listBox .listBoxImageDummy,
.elementList .boxBoxImageDummy {
  position: absolute;
}
.boxBoxImageDummy {
  width: 283px;
  height: 174px;
  background-image: url(src/defaultsquirrel-red-283.jpg);
  background-position: 1px 0;
}
.listBox .infoText {
  grid-area: lbta_info;
}
.listBox .infoText > a > h2 {
  font-weight: 600;
  font-size: 21px;
  /* color:#1e314b;  */
  color: var(--listBox-h2-color);
  margin-bottom: 6px;
}
.listBox .infoText > p {
  font-weight: 400;
  font-size: 14px;
  /* color:#8e98a5;  */
  color: var(--listBox-p-color);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.listBox .attributes {
  grid-area: lbta_attr;
  display: flex;
  justify-content: space-between;
  font-weight: 400;
  font-size: 14px;
  /* color:#8e98a5;  */
  color: var(--listBox-default-color);
  text-transform: uppercase;
}
.listBox .attributes > .element > span + span {
  margin-left: 8px;
}
.listBox .catList {
  grid-area: lbta_cat;
}
.catList {
  align-self: left;
  font-weight: 400;
  font-size: 14px;
  /* color:#8e98a5; */
  color: var(--listBox-default-color);
  text-transform: uppercase;
}
.catListIcon {
  display: inline-block;
  margin-right: 8px;
}
.catListEl + .catListEl {
  margin-left: 0.5em;
  padding-left: 0.5em;
  border-left: 1px solid #8e98a5;
}
.star {
  position: absolute;
  top: -0.5rem;
  left: -1.5rem;
}
.topRightClipping {
  position: absolute;
  top: -2px;
  right: -2px;
  z-index: 1;
}
.experteSiegel {
  display: block;
  background-image: url(src/bg_sprite.png);
  background-position: 0 -279px;
  width: 116px;
  height: 117px;
}
.experteSiegelVeri {
  display: block;
  background-image: url(src/bg_sprite.png);
  background-position: -128px -279px;
  width: 116px;
  height: 117px;
}
.experteSoloSiegelVeri {
  display: block;
  background-image: url(../ui_images/expert-geprufter.png);
  background-position: 5% 50%;
  background-size: contain;
  background-repeat: no-repeat;
  width: 250px;
  height: 45px;
  transform: translate(80px, 30px) rotate(45deg);
  border: 2px solid #396db5;
  background-color: #1e314b;
}
.companyBoxes {
  display: inline-block;
}
.boxList {
  grid-column: cxstart / cxend;
  /* display:flex; */
  /* justify-content:space-between; */
  display: grid;
  grid-template-columns: 283px 283px 283px 238px;
  gap: 22px;
}
.boxBox {
  width: 283px;
  /* height:calc(174px + 116px); */
  height: min-content;
  position: relative;
  background-color: var(--box-bg-color);
  margin-top: 22px;
  box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  -webkit-box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  -moz-box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
}
.boxBoxBottom {
  display: block;
  /* height:116px; */
  height: min-content;
  padding: 13px 17px;
  box-sizing: border-box;
}
.boxBoxImage,
.boxBoxImage > img {
  display: block;
  cursor: pointer;
}
.boxBox h2 {
  font-weight: 600;
  font-size: 15px;
  /* color:#1e314b; */
  color: var(--listBox-h2-color);
  margin-bottom: 11px;
  line-height: 1.2em;
  height: 2.4em;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.boxBox .attributes {
  text-align: right;
  /* display:inline-flex; */
  /* justify-content:space-between; */
  font-weight: 400;
  font-size: 14px;
  /* color:#8e98a5;  */
  color: var(--listBox-default-color);
  text-transform: uppercase;
}
.boxBox .attributes > .element > span + span {
  margin-left: 8px;
}
.boxBox .catList {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-bottom: 10px;
}

.companySoloGrid {
  grid-column: cxstart / cxend;
  display: grid;
  grid-template-columns: 895px 1fr;
  column-gap: 24px;
  margin-top: 28px;
}
.companySoloBox {
  display: inline-block;
  position: relative;
  width: 100%;
  /* background-color:white; */
  background-color: var(--box-bg-color);
  box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  -webkit-box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  -moz-box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  text-align: left;
}
.companySoloBoxImage {
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  background: rgb(255 255 255 / 0.5);
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: top;
}

.companySoloBox + .companySoloBox {
  margin-top: 25px;
}
.companySoloBox.experteBox img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: top;
}
.companySoloBox > .header {
  display: grid;
  grid-template-columns: 282px 613px;
  /* grid-template-rows: 183px 1fr; */
  grid-template-rows: min-content 1fr;
}
.companySoloBox > .header > .header_text {
  padding: 36px 40px 0;
}
.companySoloBox > .header > .header_text > h2 {
  font-weight: 600;
  font-size: 34px;
  /* height:92px; */
  /* overflow: hidden; */
  /* text-overflow: ellipsis;  */
  /* display: -webkit-box; */
  /* -webkit-line-clamp: 2; */
  /* -webkit-box-orient: vertical; */
  /* color:#1e314b; */
  color: var(--listBox-h2-color);
  margin-bottom: 6px;
  margin-top: 30px;
}
.companySoloBox .catList {
  font-size: 16px;
  /* color:#67717e; */
  color: var(--default-color);
}
.companySoloBox > p {
  padding: 32px 28px;
  font-weight: 600;
  font-size: 14px;
  /* color:#8e98a5; */
  color: var(--default-color);
  line-height: 1.6em;
}
.companySoloBox .attributes {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 28px;
  row-gap: 32px;
  padding: 0 28px 32px;
  justify-content: space-between;
  font-weight: 400;
  font-size: 16px;
  /* color:#67717e;  */
  color: var(--default-color);
  text-transform: uppercase;
}
.companySoloBox .element {
  display: grid;
  grid-template-columns: 30px 1fr;
  column-gap: 14px;
  align-content: start;
}
.companySoloBox .element > label {
  display: block;
  font-weight: bold;
  text-transform: none;
  align-self: end;
}
.companySoloBox .element > span:last-child {
  text-transform: none;
}
.companySoloBox .element > span:first-child {
  grid-column: 1 / 2;
  grid-row: 1 / span 2;
  justify-self: start;
  align-self: center;
  font-size: 26px;
}

:root,
.mainContentWhite,
.mainContentStart {
  --box-bg-color: white;
  --dark-bg-color: white;
  --strip-radius-border-color: white;
  --listBox-h2-color: #1e314b;
  --default-color: #8e98a5;
  --listBox-p-color: #8e98a5;
  --listBox-default-color: #8e98a5;
  --button-icon-color: #9b061b;
}

.mainContentRed {
  --box-bg-color: #750414;
  --dark-bg-color: #4b000b;
  --strip-radius-border-color: #bc6464;
  --listBox-h2-color: white;
  --default-color: #eaa09a;
  --listBox-p-color: #eaa09a;
  --listBox-default-color: #eaa09a;
  --button-icon-color: #1e314b;
}
.mainContentBlue {
  --box-bg-color: #1e314b;
  --dark-bg-color: #112139;
  --strip-radius-border-color: #58768d;
  --listBox-h2-color: white;
  --default-color: #8e98a5;
  --listBox-p-color: #8e98a5;
  --listBox-default-color: #8e98a5;
  --button-icon-color: #9b061b;
}

.mainContentRed .listBox {
  background-color: var(--box-bg-color);
}

.expertSoloBox {
  background-color: #ffffff;
  /* background-color: #1e314b; */
}
.expertsList {
  grid-template-rows: 27px 197px;
  /* --box-bg-color: #1e314b; */
  --box-bg-color: #ffffff;
}
.expertsList > .listBox {
  display: grid;
  grid-template-columns: 486px 36px 650px 1fr;
  grid-template-rows: 37px 88px 28px 18px 1fr;
  grid-template-areas:
    "lgex_img . . ."
    "lgex_img . lbex_info ."
    "lgex_img . . ."
    "lgex_img . lbex_attr ."
    "lgex_img . . .";
  overflow: hidden;
}
/** START: List box text content styling */
.companyList .listBox .listBoxTextContent {
  /* display: grid; */
  display: flex; 
  flex-direction: column; 
  grid-template-rows: (6 2fr);
  gap: 30px;
  position: absolute;
  left: 280px;
  margin-top: 20px;
  width: 850px;
  color: red;
}

.listBoxTextContent > .catList {
  grid-row: 1;
}
.notificationBoxTextContent > .catList {
  grid-row: 1;
}

.listBoxTextContent > .infoText {
  grid-row: 2;
}
.notificationBoxTextContent > .infoText {
  grid-row: 2;
}
.listBoxTextContent > .attributes {
  grid-row: 3;
}
.notificationBoxTextContent > .attributes {
  grid-row: 3;
}
/** END: List box text content styling */

.expertsList > .listBox .listBoxImage {
  grid-area: lgex_img;
  background: rgba(95, 90, 90, 0.05);
  width: 486px;
  height: 197px;
}
.expertsList > .listBox .listBoxImageDummy {
  display: inline-block;
  width: 486px;
  height: 197px;
  /* background-image: url(src/defaultsquirrel-red-283.jpg); */
}
.expertsList > .listBox .infoText {
  grid-area: lbex_info;
}
.expertsList > .listBox .infoText > a > h2 {
  /* color: #fff; */
  color: #1e314b;
}
.expertsList > .listBox .attributes {
  grid-area: lbex_attr;
}
.expertsList > .listBox .attributes > span {
  display: flex;
}
.expertsList > .listBox .attributes > .element > span {
  flex-wrap: nowrap;
  flex: 0 1 auto;
  justify-content: space-between;
}
.expertsList > .listBox .attributes > .element > span + span {
  white-space: nowrap;
  text-overflow: ellipsis;
  width: 240px;
  overflow: hidden;
  display: block;
}

.experteBox {
  background-color: #1e314b;
  color: white;
  box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  -webkit-box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  -moz-box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  padding-bottom: 33px;
}
.experteBox > .catList {
  padding: 14px 16px 0;
  font-size: 14px;
}
.experteBox > .infoText {
  padding: 12px 19px 0;
}
.experteBox > .infoText > h2 {
  font-size: 15px;
  line-height: 1.3em;
  margin-bottom: 4px;
}
.experteBox > .infoText > p {
  font-size: 14px;
  line-height: 1.3em;
}

.experteBox > .experteButton {
  margin: 32px 20px 0;
}

.sideColButton {
  display: flex;
  align-items: center;
  font-size: 16px;
  font-weight: 600;
  height: 45px;
  padding: 0 26px;
  border-radius: 23px;
  /* color:#1e314b; */
  color: var(--listBox-h2-color);
  background: rgb(197, 216, 242);
  background: linear-gradient(
    0deg,
    rgba(186, 192, 199, 1) 0%,
    rgba(220, 226, 231, 1) 100%
  );
}

.sideButtons {
  position: absolute;
  right: -270px;
  width: 250px;
  height: 45px;
}

.sideColButtonForRow {
  display: flex;
  align-items: center;
  font-size: 12px;
  font-weight: 600;
  height: 35px;
  padding: 0 26px;
  border-radius: 23px;
  /* color:#1e314b; */
  color: var(--listBox-h2-color);
  background: rgb(197, 216, 242);
  background: linear-gradient(
    0deg,
    rgba(186, 192, 199, 1) 0%,
    rgba(220, 226, 231, 1) 100%
  );
}
.mainContentRed .sideColButton {
  background: rgb(164, 18, 41);
  background: linear-gradient(
    180deg,
    rgba(164, 18, 41, 1) 0%,
    rgba(130, 0, 6, 1) 100%
  );
}

.mainContentRed .sideColButtonForRow {
  background: rgb(164, 18, 41);
  background: linear-gradient(
    180deg,
    rgba(164, 18, 41, 1) 0%,
    rgba(130, 0, 6, 1) 100%
  );
}

.sideColButton + .sideColButton {
  margin-top: 30px;
}

.sideColButtonForRow + .sideColButtonForRow {
  margin-top: 10px;
}

.experteButton {
  background: rgb(197, 216, 242);
  background: linear-gradient(
    0deg,
    rgba(131, 150, 176, 1) 0%,
    rgba(197, 216, 242, 1) 100%
  );
}
.sideColButton > span:first-child {
  /* #9b061b */
  color: var(--button-icon-color);
  width: 32px;
  font-size: 20px;
}

.sideColButtonForRow > span:first-child {
  /* #9b061b */
  color: var(--button-icon-color);
  width: 32px;
  font-size: 20px;
}

.adInteractButtonsBox {
  box-sizing: border-box;
  padding: 29px 20px;
}

.topExperten {
  grid-template-rows: 116px 133px;
}
.topExperten > .listBoxRow {
  grid-column: cxstart / cxend;
  display: flex;
  justify-content: space-between;
}
.topExperten > .listBoxRow > .listBox {
  display: inline-grid;
  grid-template-columns: 282px 23px 260px 1fr;
  grid-template-rows: 20px 16px 10px 70px 1fr;
  grid-template-areas:
    "lbte_img . . ."
    "lbte_img . lbte_cat ."
    "lbte_img . . ."
    "lbte_img . lbte_info ."
    "lbte_img . . .";

  width: 587px;
  height: 133px;
  background-color: #1e314b;
  color: white;
}
.topExperten .listBoxImage {
  grid-area: lbte_img;
  background: #fff;
}
.topExperten .infoText {
  grid-area: lbte_info;
  color: white;
  overflow: hidden;
}
.topExperten .infoText > h2 {
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 4px;
}
.topExperten .infoText > p {
  font-weight: 400;
  font-size: 14px;
  line-height: 1.2;
}
.topExperten .catList {
  grid-area: lbte_cat;
}

.pagination {
  display: grid;
  grid-template-columns: 8% 20% 1fr 22% 6%;
  column-gap: 2%;
  grid-column: cxstart / cxend;
  border-top: 1px solid #bbc1c9;
  border-bottom: 1px solid #bbc1c9;
  color: #1e314b;
  height: 49px;
  align-items: stretch;
  justify-content: center;
  font-size: 12px;
  font-weight: 400;
  padding: 0 14px;
}
.pagination_solo {
  padding: 0;
}
.mainContentBlue .pagination {
  color: white;
  border-top: 1px solid #112139;
  border-bottom: 1px solid #112139;
  background-color: rgba(17, 33, 57, 0.2);
}
.mainContentRed .pagination {
  color: rgba(255, 166, 154, 0.6);
  border-top: 1px solid rgba(0, 0, 0, 0.4);
  border-bottom: 1px solid rgba(0, 0, 0, 0.4);
  /* background-color:rgba(17,33,57,0.2); */
  background-color: rgba(0, 0, 0, 0.2);
}
.pagArrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: inherit;
  align-self: stretch;
  background-color: #1e314b;
  border-color: white;
}
.mainContentBlue .pagArrow {
  background-color: #112139;
}
.mainContentRed .pagArrow {
  border-color: #ffa69a;
  background-color: rgba(0, 0, 0, 0.4);
}
.pagArrowInactive {
  background-color: #c0c5cd;
}
.mainContentBlue .pagArrowInactive {
  background-color: #112139;
  border-color: #344257;
}
.mainContentRed .pagArrowInactive {
  background-color: rgba(0, 0, 0, 0.3);
  border-color: rgba(255, 255, 255, 0.6);
}
.pagArrowL_TB,
.pagArrowR_TB {
  display: inline-block;
  width: 15px;
  height: 15px;
  border-color: inherit;
  border-top-width: 3px;
  border-top-style: solid;
  border-right-width: 3px;
  border-right-style: solid;
  transform: rotate(-135deg) translate(-2px, 2px);
}
.pagArrowR_TB {
  transform: rotate(45deg) translate(-3px, 2px);
}
.mainContentBlue .pagArrowL_TB,
.mainContentBlue .pagArrowR_TB {
  border-color: inherit;
}
.pagEl {
  position: relative;
  align-self: center;
}
.pagEl:nth-child(1) {
  grid-column: 1 / span 1;
  justify-self: start;
}
.pagEl:nth-child(2) {
  grid-column: 2 / span 1;
  justify-self: center;
}
.pagEl:nth-child(3) {
  grid-column: 3 / span 1;
}
.pagEl:nth-child(4) {
  grid-column: 4 / span 1;
  justify-self: center;
}
.pagEl:nth-child(5) {
  grid-column: 5 / span 1;
  justify-self: end;
}
.mainContentBlue .pagEl:nth-child(4) {
  grid-column: 4 / span 2;
  justify-self: end;
}
.pagElFlex {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  align-self: inherit;
  font-size: 16px;
  color: #8e98a5;
}
.pagElTextFlex > span + span {
  margin-left: 1em;
}
.pagElIcons {
  font-size: 18px;
  color: #8e98a5;
  cursor: pointer;
}
.pagElIcons > a + a {
  margin-left: 26px;
}
.mainContentRed .pagElIcons {
  color: rgba(255, 166, 154, 0.4);
}
.pagElIconActive {
  color: #1e314b;
  cursor: default;
}
.mainContentBlue .pagElIconActive {
  color: white;
}
.mainContentRed .pagElIconActive {
  color: #ffa69a;
}
.pagEl .css_icon_chev_down_sm {
  margin-left: 8px;
}
.pagNum {
  align-self: center;
}
.pagNumSel {
  color: #1e314b;
  font-weight: bold;
}
.mainContentBlue .pagNumSel {
  color: white;
}
.mainContentRed .pagNumSel {
  color: #ffa69a;
}
.pagElSolo {
  grid-column: 1 / span 5;
}
.pagElSoloPageIndex {
  align-self: center;
  font-size: 20px;
  font-weight: 600;
}
.pagElSolo:first-child,
.pagElSolo:last-child {
  align-self: stretch;
}
.pageElSoloFlex {
  display: flex;
  justify-content: space-between;
  align-items: stretch;
  align-self: inherit;
  font-size: 16px;
  color: #8e98a5;
  width: 89%;
}
.pageElSoloFlex > a {
  font-size: 12px;
  align-self: center;
}
.pagElSoloIcon {
  display: inline-block;
  margin-right: 14px;
  min-width: 22px;
}
.pagElArrowText {
  color: #1e314b;
}
.pagElArrowTextInactive {
  color: #8e98a5;
}
.mainContentBlue .pagElArrowText {
  color: white;
}
.mainContentBlue .pagElArrowTextInactive {
  color: #8e98a5;
}
.mainContentRed .pagElArrowText {
  color: #ffa69a;
}
.mainContentRed .pagElArrowTextInactive {
  color: #8e98a5;
}

.pagElSelect {
  display: none;
  position: absolute;
  background-color: #e8eaed;
  padding: 12px 16px;
  border-radius: 12px;
  border: 1px solid gray;
  z-index: 3;
  top: 4px;
  left: 15px;
  left: 0;
  transform: translateX(50%);
  -webkit-box-shadow: 0px 11px 24px 0px rgba(5, 17, 34, 0.5);
  -moz-box-shadow: 0px 11px 24px 0px rgba(5, 17, 34, 0.5);
  box-shadow: 0px 11px 24px 0px rgba(5, 17, 34, 0.5);
  text-align: left;
}
.pagElSelect > * {
  display: block;
  cursor: pointer;
  line-height: 1.5em;
}
.pagElSelect > .selected {
  font-weight: 800;
}

.pagEl:hover .pagElSelect {
  display: block;
}
.mainContentBlue .pagElSelect {
  background-color: #1e314b;
  color: white;
  border: 1px solid #112139;
}
.mainContentRed .pagElSelect {
  background-color: #7a0000;
  color: rgba(255, 166, 154, 1);
  border: 1px solid rgba(0, 0, 0, 0.4);
}

.pageConfigSelectButtons > .option {
  white-space: nowrap;
}

.listBoxArrowInactive,
.hidden {
  visibility: hidden;
  display: none !important;
}

.popup_overlay {
  position: fixed;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.6);
  z-index: 2;
  width: 100%;
  min-height: 100%;
  height: 100%;
  min-width: 1200px;
  display: none;
}

.popup_overlay:has(.noDarkBackground) {
  background: transparent;
}

.popup {
  z-index: 10;
  top: 200px;

  width: 80%;
  height: 50vh;
  overflow: auto;
  min-width: 1104px;
  margin: 0 auto;

  left: 50%;
  transform: translate(-50%, 0);

  background-color: white;
  border-radius: 12px;
  -webkit-box-shadow: 0px 11px 24px 0px rgba(5, 17, 34, 1);
  -moz-box-shadow: 0px 11px 24px 0px rgba(5, 17, 34, 1);
  box-shadow: 0px 11px 24px 0px rgba(5, 17, 34, 1);
  border: 1px solid #6c7785;
  padding: 36px 48px;
}

.popup::-webkit-scrollbar {
  width: 0.5em;
  height: 0.5em;
  padding: 2px;
}

.popup::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
}

.popup::-webkit-scrollbar-thumb {
  background-color: darkgrey;
  outline: 1px solid slategrey;
  border-radius: 8px;
}

.subPopup {
  display: none;
  position: absolute;
  background-color: white;
  border-radius: 12px;
  -webkit-box-shadow: 0px 11px 24px 0px rgba(5, 17, 34, 0.6);
  -moz-box-shadow: 0px 11px 24px 0px rgba(5, 17, 34, 0.6);
  box-shadow: 0px 11px 24px 0px rgba(5, 17, 34, 0.6);
  border: 1px solid rgba(0, 0, 0, 0.3);
  padding: 30px 30px;
  z-index: 10;
}
.mainContentBlue .subPopup {
  background-color: #112139;
  border-color: #58768d;
}
.popClickActive {
  cursor: default;
}
.popClickActive .subPopup {
  display: block;
  position: absolute;
  top: calc(100% + 6px);
}

.foregroundBox {
  cursor: pointer;
  display: grid;
  position: relative;
  /* display:none; */
  /* position:absolute; */
  /* top:-63px; */
  /* left:-6px; */
  height: 84px;
  border-radius: 42px;
  /* background:white; */
  background: var(--dark-bg-color);
  padding: 0 35px;
  align-content: center;
  white-space: nowrap;
}
.popClickActive .foregroundBox {
  display: grid;
  cursor: default;
  /* box-shadow: 0px 11px 18px 0px rgba(30,49,75,0.15); */
  /* -webkit-box-shadow: 0px 11px 18px 0px rgba(30,49,75,0.15); */
  /* -moz-box-shadow: 0px 11px 18px 0px rgba(30,49,75,0.15);  */
  -webkit-box-shadow: 0px 11px 24px 0px rgba(5, 17, 34, 0.6);
  -moz-box-shadow: 0px 11px 24px 0px rgba(5, 17, 34, 0.6);
  box-shadow: 0px 11px 24px 0px rgba(5, 17, 34, 0.6);
  z-index: 4;
}

.center_popup {
  position: absolute;
}
.center_popup_small {
  width: 450px;
  min-width: 450px;
}

.weitere_filter {
  position: absolute;
  columns: 3;
  column-gap: 80px;
  column-rule: 1px solid #d2d6db;
}
.formCol2 {
  columns: 2;
  column-gap: 80px;
  column-rule: 1px solid #d2d6db;
}
.filter h2,
.form_input_label {
  display: block;
  color: #9b061b;
  font-weight: 800;
  font-size: 14px;
  text-transform: uppercase;
  margin-bottom: 8px;
  flex: 0 1 100%;
}
.filter_attributes {
  display: flex;
  flex-wrap: wrap;
  color: #1e314b;
  break-inside: avoid;
  min-width: 280px;
}
.filter_attributes + .filter_attributes {
  margin-top: 48px;
}
.filter_attributes_50_50 > p:nth-child(even),
.filter_attributes_50_50 > p:nth-child(odd) {
  width: 50%;
}
.filter_attributes_100 {
  display: block;
}
.filter_attributes_100 > p {
  width: 100%;
}

.filter_attributes > p {
  font-size: 15px;
  line-height: 2em;
}
.filter_attributes > p > input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  z-index: -9999;
}
.filter_attributes > p > label .css_checkbox {
  position: absolute;
  top: 0;
  top: 6px;
  left: 0;
  display: block;
  width: 14px;
  height: 14px;
  background: #fff;
  border: 2px solid #d2d6db;
  border-radius: 2px;
  cursor: pointer;
}
.filter_attributes > p > input[type="checkbox"] + label {
  position: relative;
  display: inline-block;
  cursor: pointer;
  padding-left: 26px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.filter_attributes > p > input[type="checkbox"] + label .css_checkbox {
  position: absolute;
  display: block;
  width: 14px;
  height: 14px;
  background: #fff;
  border: 2px solid #d2d6db;
  border-radius: 2px;
  cursor: pointer;
}
.filter_attributes > p > input[type="checkbox"]:checked + label .css_checkbox {
  background: #1e314b;
  border: 2px solid #1e314b;
}
.filter_attributes
  > p
  > input[type="checkbox"]:checked
  + label
  .css_checkbox::after {
  content: "";
  position: absolute;
  width: 4px;
  height: 9px;
  border: 2px solid #fff;
  border-left: none;
  border-top: none;
  transform: rotate(45deg);
  left: 4px;
}
.mainContentBlue
  .filter_attributes
  > p
  > input[type="checkbox"]:checked
  + label
  .css_checkbox {
  background: #fff;
  border-color: #fff;
}
.mainContentBlue
  .filter_attributes
  > p
  > input[type="checkbox"]:checked
  + label
  .css_checkbox::after {
  border-color: #1e314b;
}

.filter_attributes_select {
  display: block;
}
.filter_attributes_select > div {
  margin: 0 -15px;
}
.filter_attributes_select > div {
  display: flex;
  justify-content: space-between;
}
.filter_attributes_select > div > .select_box {
  flex: 0 1 47%;
}
.select_box {
  position: relative;
  display: inline-block;
}
.select_box > select,
.form_input_text {
  display: inline-block;
  width: 100%;
  height: 44px;
  border: 1px solid #bbc1c9;
  border-radius: 21px;
  padding: 0 15px;
  box-sizing: border-box;
  color: #1e314b;
  background: #f6f7f8;
}
.select_box > select > option {
  width: 80%;
  margin: 0 auto;
}
.select_divider {
  flex: 0 1 6%;
  align-self: center;
  text-align: center;
}
textarea.form_input_text {
  padding: 15px;
  border-radius: 21px 0 0 21px;
  border-radius: 0;
}
.form_footer {
  text-align: right;
  margin-top: 44px;
}

/* Select arrow styling */
.select_box > .select_dd_arrow {
  display: inline-block;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 23px;
  height: 42px;
  background: #8e98a5;
  background: #cdcdcd;
  position: absolute;
  top: 0px;
  right: 0px;
  border: 1px solid #bbc1c9;
  border-radius: 0 21px 21px 0;
  pointer-events: none;
}
.select_box > .select_dd_arrow > span {
  border-color: white;
  margin-left: 2px;
}

.formPageContent {
  grid-column: cxstart / cxend;
  display: grid;
  align-items: start;
  justify-content: center;
  margin-top: 64px;
  min-height: 446px;
  background-position: center center;
}
.formPageContent p {
  margin-top: 20px;
}

.vertScrollList {
  /* height:410px; */
  /* overflow:auto visible; */
}

.soloBox {
  background-color: white;

  background-color: white;
  border-radius: 12px;

  padding: 36px 48px;

  box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  -webkit-box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  -moz-box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  text-align: left;
}
.shadowBox {
  box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  -webkit-box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
  -moz-box-shadow: 0px 11px 18px 0px rgba(30, 49, 75, 0.15);
}
.noRound {
  border-radius: 0;
}
.formPageLoginGrid {
  grid-template-columns: 1fr 1fr 1fr;
  column-gap: 56px;
}
.formPageLoginGrid .loginForm {
  grid-column: 1 / 2;
}
.formPageLoginGrid .registerForm {
  grid-column: 2 / 4;
}
.registerFormFields {
  columns: 2;
  column-gap: 28px;
}
.h2Spacing h2 {
  margin-top: 20px;
}
.h2Spacing h2:first-child {
  margin-top: 0px;
}
.formPageContent h2,
.kundenPage h2 {
  font-weight: 600;
  font-size: 21px;
  color: #1e314b;
  margin-bottom: 6px;
}
.formPageContent h3,
.kundenPage h3,
.form_info_subtitle {
  font-weight: 400;
  font-size: 14px;
  color: #1e314b;
}
.formPageContent h3 {
  margin-bottom: 24px;
}
.f_row {
  break-inside: avoid;
}

.basicContent {
  grid-column: cxstart / cxend;
  min-height: 446px;
  background-position: center center;
}
.basicBox {
}

.basicContent > h1 {
  text-align: center;
  letter-spacing: 0.1em;
  line-height: 85px;
}
.basicContent h2 {
  color: var(--main-text-color);
  font-weight: 300;
  font-size: 30px;
  margin-bottom: 30px;
}
.basicContent .leftRow > div + div {
  margin-top: 30px;
}
.basicContentGrid {
  display: grid;
  grid-template-columns: 78px 278px 54px 1fr 78px;
  grid-template-rows: 78px auto 78px;
}
.basicContentGrid > .leftRow {
  grid-column: 2 / 3;
  grid-row: 2 / 3;
}
.basicContentGrid > .rightRow {
  grid-column: 4 / 5;
  grid-row: 2 / 3;
}

.address_info {
  line-height: 1.4em;
}
.address_info > p > label {
  font-weight: 800;
  display: inline-block;
  width: 60px;
}
.address_info .f_row + .f_row {
  margin-top: 10px;
}
.address_info .f_row > label {
  margin-bottom: 2px;
  width: auto;
}

.kontaktGrid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  column-gap: 24px;
}

.kundenPage {
  grid-column: cxstart / cxend;
  display: grid;
  align-items: start;
  justify-content: center;
  /* margin-top:64px; */
  min-height: 446px;
  background-position: center center;
}
.kundenPageGrid {
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-template-rows: 86px auto auto;
  /* column-gap:1px; */
}
.kundenPageHeader {
  grid-column: 1 / 5;
  grid-row: 1;
  color: #1e314b;
  font-family: Raleway;
  font-weight: bold;
  font-size: 28px;
  line-height: 86px;
  text-align: center;
}
.kundenPageMenu {
  background-color: #edf0f3;
  height: 100%;
  border-right: 1px solid #d4d5db;
  z-index: 4;
}
.kundenPageMenu {
  min-width: 299px;
}
.kundenPageContent {
  grid-column: 2 / 5;
  grid-row: 2;
  background-color: white;
  padding: 44px 56px;
  z-index: 3;
  min-width: min-content;
}
.kundenPageContent > p,
.kundenPageContent form > p,
.kundenPageContent form > div {
  margin-top: 20px;
}
.kundenPageContent > .ad_list + h3 {
  margin-top: 20px;
}
.kundenTextButton {
  display: inline-block;
  color: #1e314b;
  font-size: 12px;
  font-weight: bold;
  height: 32px;
  line-height: 32px;
  padding: 0 7px;
  text-transform: uppercase;
  background: rgb(187, 193, 200);
  background: linear-gradient(
    0deg,
    rgba(187, 193, 200, 1) 0%,
    rgba(220, 226, 231, 1) 100%
  );
}
.kundenTextButton + .kundenTextButton {
  margin-left: 6px;
}
.kbBoxBoxButtonRow {
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
}
.kbAddButton {
  display: inline-flex;
  align-items: center;
  text-align: center;
  white-space: nowrap;
  font-size: 16px;
  font-weight: 600;
  color: #1e314b;
  height: 45px;
  padding: 0 22px;
  border-radius: 22px;
  background: rgb(186, 192, 199);
  background: linear-gradient(
    0deg,
    rgba(186, 192, 199, 1) 0%,
    rgba(220, 226, 231, 1) 100%
  );
}
.kbAddButton ion-icon {
  color: #9b061b;
  font-size: 22px;
  font-weight: bold;
  margin-right: 8px;
}
.kbTopRow {
  display: flex;
  justify-content: space-between;
}

.mitem {
  background-color: #e2e5e9;
  line-height: 32px;
  /* display:block; */
  display: grid;
  grid-template-columns: 6px 1fr;
  font-weight: bold;
  text-transform: uppercase;
}
.mitem > span:first-child {
  grid-column: 1 / 2;
  background-color: #bac1ca;
}
.mitem > span:last-child {
  grid-column: 2 / 3;
  padding-left: 19px;
  color: #767f8b;
}
.mitem + .mitem {
  border-top: 1px solid #c6ccd3;
}
.mitem:last-child {
  border-bottom: 1px solid #c6ccd3;
}
.mitem_sel > span:first-child {
  background-color: #9b061b;
}
.mitem_sel > span:last-child {
  background-color: white;
  color: #1e314b;
}
.mitem:hover > span:first-child {
  background-color: #67717e;
}
.mitem:hover > span:last-child {
  background-color: #edf0f3;
}
.mitem_sel > span:first-child {
  background-color: #9b061b !important;
}
.mitem_sel > span:last-child {
  background-color: white !important;
  color: #1e314b !important;
}
.mitem ion-icon {
  color: #9b061b;
  width: 18px;
}

.ueber-cbuy-background-1 {
  background-image: url(src/ueber-1.jpg);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;

  height: 429px;
  text-indent: -99999px;
}
.ueber-cbuy-background-2 {
  position: relative;
  background-image: url(src/ueber-2.jpg);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  height: 393px;
  text-indent: -99999px;
}
.ueber-cbuy-2-text {
  position: relative;
  width: 544px;
  margin: 0 auto 0;
  transform: translate(305px, 186px);
  color: #364861;
  line-height: 1.4em;
  text-indent: 0;
}
.ueber-cbuy-2-video {
  position: absolute;
  transform: translate(-625px, 37px);
  top: 0;
  left: 50%;
  width: 564px;
  height: 316px;
  background-color: black;
}
.ueber-cbuy-3-center {
  display: block;
  width: 1230px;
  margin: 0 auto;
  height: 480px;
}
.ueber-cbuy-3-h {
  display: block;
  position: relative;
  top: 116px;
  color: #364861;
  font-size: 42px;
  font-weight: 300;
  width: 682px;
  line-height: 1.1em;
  letter-spacing: -0.01em;
}
.ueber-cbuy-3-text {
  position: relative;
  top: 136px;
  color: #364861;
  font-family: Raleway, sans-serif;
  width: 682px;
  line-height: 1.4em;
}
.uber-cbuy-3-image {
  float: right;
  margin-top: 108px;
  margin-right: 26px;
  background-image: url(src/ueber-3-img-sm.png);
  width: 457px;
  height: 264px;
}
.ueber-cbuy-3-bayern {
  position: relative;
  color: #364861;
  margin: 0 auto;
  width: 1200px;
  height: 194px;
  transform: translateX(-15px);
  background-color: white;
  background-image: url(src/ueber-4.png);
  padding: 36px 38px;
  box-sizing: border-box;
}
.ueber-cbuy-3-bayern > p:nth-child(3) {
  position: absolute;
  top: 49px;
  right: 45px;
  width: 400px;
  height: 125px;
  line-height: 1.4em;
}
.ueber-cbuy-3-bayern-image {
  background-image: url(src/ueber-by.png);
  margin-top: 32px;
  width: 598px;
  height: 76px;
}

.userdataFormFields > form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 24px;
}

.ad_list {
  display: grid;
  grid-template-columns: 283px 283px 283px;
  gap: 22px;
}

.filter .footer {
  position: relative;
  width: 3570px;
  column-span: all;
  background-color: #e8eaed;
  padding: 16px 42px;
  border-radius: 0 0 12px 12px;
  border-left: 1px solid #6c7785;
  border-bottom: 1px solid #6c7785;
  border-right: 1px solid #6c7785;
  margin: 36px -49px -37px;
}
.filter .footer .link_list > a {
  color: #8e98a5;
  font-size: 16px;
  font-weight: 600;
}
.filter .footer .link_list .cancel_button {
  color: #1e314b;
}
.filter .footer .link_list > a + a {
  margin-left: 20px;
  border-left: 1px solid #1e314b;
  padding-left: 20px;
}
.filter .footer .main_button,
.form_main_button {
  display: inline-block;
  height: 44px;
  line-height: 44px;
  border-radius: 21px;
  border-width: 0;
  padding: 0 62px;
  background: rgb(121, 0, 0);
  background: linear-gradient(
    0deg,
    rgba(121, 0, 0, 1) 0%,
    rgba(187, 38, 59, 1) 100%
  );
  color: white;
  font-weight: 600;
}
.form_main_button:disabled {
  background: linear-gradient(0deg, #ccc 0%, #888 100%);
}
.mainContentBlue .form_main_button {
  background: rgb(66, 98, 134);
  background: linear-gradient(
    180deg,
    rgba(66, 98, 134, 1) 0%,
    rgba(34, 65, 101, 1) 100%
  );
}
.form_main_button {
  cursor: pointer;
}
.form_cancel_button {
  display: inline-block;
  height: 36px;
  line-height: 36px;
  border-radius: 18px;
  border-width: 0;
  padding: 0 32px;
  background: rgb(121, 121, 121);
  background: linear-gradient(
    0deg,
    rgba(121, 121, 121, 1) 0%,
    rgba(70, 70, 70, 1) 100%
  );
  color: white;
  font-weight: 600;
}
.filter .footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.input2col {
  display: flex;
  flex-wrap: nowrap;
  break-inside: avoid;
  column-gap: 20px;
}
.editForm .filter_attributes + .filter_attributes {
  margin-top: 20px;
}
.editForm .filter_attributes_select > div {
  margin: 0;
}

.footerMenu,
.footerPartner {
  display: flex;
  height: 180px;
  grid-column: cxstart / cxend;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid #c8ccd3;
}
.footerMenuElement {
  flex: 0 1 auto;
  font-family: "Raleway", sans-serif;
  font-size: 12px;
  font-weight: 600;
  color: #8e98a5;
  text-transform: uppercase;
}
.footerPartner {
  height: 141px;
  padding: 0 78px;
}
.footerMenuBlue {
  color: white;
  background-color: #314258;
  border: 0;
}
.footerMenuRed {
  color: white;
  background-color: #a91f29;
  border: 0;
}
.footerMenuRed .footerMenuElement {
  color: white;
}

.vthumb_row {
  display: flex;
  gap: 10px;
  justify-content: center;
  align-items: center;
  margin-bottom: 80px;
}
.vthumb {
  position: relative;
  display: inline-block;
  flex: 0 1 15%;
  height: 135px;
  background-size: contain;
  background-repeat: no-repeat;
}
.vthumb_button {
  display: inline-block;
  border: 0;
  background: transparent;
  box-sizing: border-box;
  width: 0;
  height: 60px;

  border-color: transparent transparent transparent #9b061b;
  /* border-color: transparent transparent transparent #FFFFFF; */
  transition: 100ms all ease;
  cursor: pointer;

  border-style: solid;
  border-width: 30px 0 30px 48px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.hideText {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}

.defButtonSm {
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0.05, #ededed),
    color-stop(1, #dfdfdf)
  );
  background: -moz-linear-gradient(center top, #ededed 5%, #dfdfdf 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
  background-color: #ededed;
  line-height: 1.15em;
  text-indent: 0;
  border: 1px solid #dcdcdc;
  display: inline-block;
  color: #777777;
  font-family: Arial;
  font-size: 10px;
  font-weight: bold;
  font-style: normal;
  padding: 2px;
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  text-shadow: 1px 1px 0px #ffffff;
  cursor: pointer;
}
.defButtonSm:hover {
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0.05, #bfbfbf),
    color-stop(1, #787878)
  );
  background: -moz-linear-gradient(center top, #bfbfbf 5%, #787878 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bfbfbf', endColorstr='#787878');
  background-color: #bfbfbf;
  border: 1px solid #787878;
  color: white;
  text-shadow: 1px 1px 0px #4a4a4a;
}
.defButtonSm:active {
  position: relative;
  top: 1px;
}
.defButtonSm + .defButtonSm {
  margin-left: 2px;
}

ion-icon {
  font-weight: bold;
  font-size: 1.1em;
  vertical-align: text-top;
  display: inline-block !important;
  pointer-events: none;
  position: relative;
  z-index: 1;
}
ion-icon * {
  position: relative;
  z-index: 1;
}

.cp {
  cursor: pointer;
  user-select: none;
}
.noPad {
  padding: 0;
}
.tar {
  text-align: right;
}
select.tar > option {
  direction: rtl;
}

.btn {
  border: none;
  padding: 8px 16px;
  cursor: pointer;
  margin: 2px;
  border-radius: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.btn-mail {
  background-color: transparent;
  color: var(--listBox-default-color, #ccc);
  min-width: 100px;
}
.modal-wrapper {
  position: fixed;
  top: 0;
  width: 100%;
  height: 100%;
  display: none;
  justify-content: center;
  align-items: center;
}
.modal-wrapper-visible {
  display: flex;
  z-index: 100;
}
.modal-container {
  min-width: 300px;
  min-height: 50px;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
  background-color: rgb(255, 255, 255);
  border-radius: 12px;
  /* -webkit-box-shadow: 0px 11px 24px 0px rgba(5,17,34,1); */
  /* -moz-box-shadow: 0px 11px 24px 0px rgba(5,17,34,1); */
  /* box-shadow: 0px 11px 24px 0px rgba(5,17,34,1); */
  -webkit-box-shadow: 0px 11px 24px 0px rgba(5, 17, 34, 0.6);
  -moz-box-shadow: 0px 11px 24px 0px rgba(5, 17, 34, 0.6);
  box-shadow: 0px 11px 24px 0px rgba(5, 17, 34, 0.6);
  border: 1px solid rgba(0, 0, 0, 0.3);
  padding: 30px 30px;
  z-index: 5;
}
.modal-header {
  border-bottom: 1px solid #ccc;
  font-size: 18px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.modal-body {
  display: flex;
  padding: 15px 0;
}
.modal-dismiss {
  cursor: pointer;
}
.modal-title {
  margin-right: 10px;
}
form {
  width: 100%;
}
.form-group {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.form-control {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 15px;
  justify-content: space-between;
}
.form-control input {
  border: none;
  border-bottom: 1px solid rgb(66, 98, 134);
}
.form-control input,
textarea {
  width: 100%;
  min-height: 24px;
  font-size: 16px;
  padding-left: 5px;
  background-color: transparent;
}
.form-label {
  min-width: 100px;
}
.action-btn-group {
  justify-content: flex-end;
}
.btn-send {
  /* background-color: #9b061b; */
  background-color: rgb(66, 98, 134);
  color: #eee;
}

.alert {
  padding: 20px;
  color: white;
  position: fixed;
  z-index: 1000;
  top: 15px;
  right: 15px;
  display: none;
  border-radius: 8px;
}
.alert.error {
  background-color: #9f2c24;
  display: block;
}
.alert.warning {
  background-color: #ffa500;
  display: block;
}
.alert.success {
  background-color: #1a774c;
  display: block;
}
.alert.relative {
  position: relative;
  width: 100%;
  border: 2px solid;
  z-index: 0;
}
.alert.error.relative {
  border-color: #6d1f19;
}
.alert.success.relative {
  border-color: #125536;
}
.closebtn {
  margin-left: 15px;
  color: white;
  font-weight: bold;
  float: right;
  font-size: 22px;
  line-height: 20px;
  cursor: pointer;
  transition: 0.3s;
}

.closebtn:hover {
  color: black;
}
.btn-link {
  background: transparent;
  border: none;
  cursor: pointer;
}
.globalCTAFrame {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  position: relative;
  height: 50vh;
}
.cta_bg_image {
  -moz-transform: scaleY(-1);
  -o-transform: scaleY(-1);
  -webkit-transform: scaleY(-1);
  transform: scaleY(-1);
  filter: FlipV;
  -ms-filter: "FlipV";
  position: absolute;
  top: 0;
  object-fit: cover;
  object-position: top;
  width: 100%;
}
.ctaButtonsArea {
  display: flex;
  width: 1243px;
  margin: auto;
  position: relative;
  /* margin: 0 51px; */
}
.ctaButton {
  width: 117px;
  height: 41px;
  border-radius: 30px;
  background: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 27px;
  font-family: Helvetica;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  cursor: pointer;
  color: #9098a4;
  border: 2px solid #9098a4;
  font-weight: 400;
  margin-bottom: 22px;
}

.ctaButton:nth-child(1) {
  margin-left: 51px;
}
.ctaButtonActive {
  border: 2px solid rgba(151, 36, 42, 0.5);
  color: #97242a80;
  font-weight: 700;
}

.frameBox {
  width: 1243px;
  height: 325px;
  flex-shrink: 0;
  border-radius: 51px;
  background: var(--BG, #1b2940);
  box-shadow: 0px 4px 15px 0px rgba(0, 0, 0, 0.25);
  display: flex;
  margin: auto;
  position: relative;
}

.frameBoxText {
  /* display: flex;
  flex-direction: column; */
  /* gap: 16px; */
  margin: 48px;
  display: grid;
  grid-template-rows: auto;
  gap: 16px;
  width: 100%;
}

#bigText {
  color: #fff;
  font-family: Helvetica;
  font-size: 40px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
#bigText span {
  color: #c63138;
  margin-bottom: 16px;
}

#smallText {
  color: rgba(241, 241, 241, 0.7);
  font-family: Helvetica;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

#buttonsContainer {
  padding: 18px 0;
  display: flex;
}

.frameBoxButton:nth-child(2) {
  padding: 0 10px;
  margin-left: 10px;
}
.frameBoxButton {
  display: flex;
  justify-content: center;
  align-items: center;
  min-width: 180px;
  max-width: 300px;
  height: 52px;
  font-family: Helvetica;
  font-size: 18px;
  line-height: 22px;
  border-radius: 25px;
  font-weight: 700;
  text-decoration: none;
}

#primary-button {
  color: white;
  border: 2px solid #97242a;
  background: conic-gradient(
    from 180deg at 50% 50%,
    #932127 0deg,
    #932127 360deg
  );
  color: #fff;
}

#secondary-button {
  color: #97242a;
  border-radius: 30px;
  border: 2px solid #97242a;
  background: #fff;
}

.frameImageBox {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: end;
  margin: 0 25px;
}

.frameImage {
  position: relative;
  width: 596px;
  height: 279px;
  border-radius: 30px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transition: background-image 1s ease-out;
  background-color: rgb(151 36 42 / 0.6);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.dots {
  position: absolute;
  right: 0;
  margin: 18px 51px;
  display: flex;
  justify-content: end;
}

.dot {
  width: 12px;
  height: 12px;
  background: #fff;
  margin-right: 12px;
  border-radius: 12px;
  transition: background 1s ease-in;
}

.dotActive {
  background: #97242a;
}

.infoBox {
  position: absolute;
  bottom: 0;
  width: 597px;
  height: 88px;
  flex-shrink: 0;
  background: rgba(45, 45, 45, 0.62);
  backdrop-filter: blur(5px);
}
.infoBox > div {
  position: relative;
  width: 597px;
  height: 88px;
}

.infoOne {
  position: absolute;
  top: 0;
  margin: 16px 0 0 36px;
  width: 380px;
  color: #fff;
  font-family: Helvetica Neue;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.infoTwo {
  position: absolute;
  bottom: 0;
  margin: 0 0 10px 36px;
  /* width: 161.001px; */
  color: #fff;
  font-family: Helvetica Neue;
  font-size: 20px;
  font-style: normal;
  font-weight: 200;
  line-height: normal;
}
.infoThree {
  position: absolute;
  bottom: 0;
  right: 0;
  margin: 0 31px 10px 0;
  color: #fff;
  width: 120;
  font-family: Helvetica Neue;
  font-size: 20px;
  font-style: normal;
  font-weight: 200;
  line-height: normal;
}
.contactButton {
  width: 126px;
  height: 38px;
  border-radius: 30px;
  border: 2px solid #fff;
  background: #97242a;
  color: #fff;
  font-family: Helvetica;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
}

.contactButton > ion-icon {
  margin: -5px 5px 0 0;
}
.video_content {
  border-radius: 20px;
  width: 100%;
}
.video_wrapper {
  width: auto;
  padding: 0 15px;
}

.notification-btn {
  margin: 0 5px !important;
  padding: 0 5px !important;
  position: relative;
  height: 32px !important;
  width: auto;
}

.top_actions_wrapper {
  margin: 0;
  margin-right: 25px;
  display: flex;
}

.loader {
  border: 3px solid #f3f3f3;
  border-top: 3px solid #3498db;
  border-radius: 50%;
  width: 100%;
  height: 100%;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.attachment_request_list {
  list-style: none;
  list-style-type: none;
  margin: 0;
  margin-bottom: 15px;
  padding: 0;
}
.attachment_request_container {
  display: flex;
  flex-direction: column;
}
.attachment_request_details p {
  width: 240px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.attachment_request_actions {
  display: flex;
}
.attachment_request_actions .btn_accept {
  border-radius: 50px;
  border: 1px solid #97242a;
  color: #97242a;
}
.attachment_request_actions .btn_accept:hover {
  background-color: rgb(151 36 42 / 0.3);
}

.attachment_request_actions .btn_decline {
  border-radius: 8px;
  border: 1px solid transparent;
  color: #333;
}
.attachment_request_actions .btn_decline:hover {
  background-color: rgb(51 51 51 / 0.3);
}
img.admin_box_image {
  width: 100%;
  height: 200px;
  object-fit: cover;
  object-position: center;
}

.booking {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 5px 8px 30px #413838;
}

.booking .message {
  width: 800px;
  padding: 32px 40px;
  margin: auto;
  display: flex;
  background: #fff;
  font-size: 20px;
  line-height: 1.5;
  font-weight: 500;
  text-align: justify;
}

.loginRedirect{
  position:absolute; 
  width:100%; 
  display:flex; 
  justify-content:center;
  z-index:2
}

.loginRedirect .content{
  text-align:center;
  background:#fff;
  max-width:800px;
  border-radius:12px; 
  padding: 40px 0;
}
.loginRedirect .content .imageBox{
  width:100%; 
  display:flex; 
  justify-content:center; 
  margin-top:30px;
}

.slider {
  width: 40rem;
  text-align: center;
  overflow: hidden;
}

.slides {
  display: flex;

  overflow-x: auto;
  scroll-snap-type: x mandatory;

  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
}
.slides::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}
.slides::-webkit-scrollbar-thumb {
  background: black;
  border-radius: 10px;
}
.slides::-webkit-scrollbar-track {
  background: transparent;
}
.slides > div {
  scroll-snap-align: start;
  flex-shrink: 0;
  width: 40rem;
  height: 25rem;
  margin-right: 5px;
  border-radius: 20px;
  background: #eee;
  transform-origin: center center;
  transform: scale(1);
  transition: transform 0.5s;
  position: relative;

  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 100px;
}

.slider > a {
  display: inline-flex;
  width: 1.5rem;
  height: 1.5rem;
  background: white;
  text-decoration: none;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  margin: 0 0 0.5rem 0;
  position: relative;
}
.slider > a:active {
  top: 1px;
}
.slider > a:focus {
  background: #000;
}

/* Don't need button navigation */
@supports (scroll-snap-type) {
  .slider > a {
    display: none;
  }
}

.selectedAd {
  background: rgb(228, 228, 228);
}

.adsearch-dropdown {
  display: inline-block;
  position: relative;
}

.adsearch-dropdown-content {
  display: none;
  position: absolute;
  width: 100%;
  overflow: auto;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.adsearch-dropdown:hover .adsearch-dropdown-content {
  display: block;
}

.adsearch-dropdown-content a {
  display: block;
  color: #000000;
  padding: 5px;
  text-decoration: none;
  background-color: rgba(187, 193, 200, 0.7);
  /*background-color: #FFFFFF;*/
}

.adsearch-dropdown-content a:hover {
  color: #FFFFFF;
  background-color: #4a4f52;
}