/* Add your css code here */
/*
Variable Definitions:
  --r-bg: Controls the background color.
  --r-tx: Determines the color of the text.
  --r-h1: Sets the color for h1, h2, and h3 headings.
  --r-lk: Changes the link text color.
  --r-lk-h: Alters the hover color of link text.
  --r-br: Specifies the border color.
  --r-bg-fr: Defines the background color of input forms.
  --r-tx-lk: Adjusts the menu link text color.
  --r-tx-lk-h: Modifies the hover color of menu link text.
  --r-bg-lk: Sets the menu link background color.
  --r-bg-lk-h: Changes the hover background color of menu links.
  --r-tx-bt: Determines the button text color.
  --r-tx-bt-h: Alters the button text color on hover.
  --r-bg-bt: Specifies the button background color.
  --r-bg-bt-h: Sets the button background color on hover.
*/

/*
Regions Names, each region has an ID and a Class with the same name.
You can use .page-wrapper or #page-wrapper
#page-wrapper {}
#primary-sidebar-menu {}
#fixed-search-block {}
#popup-login-block {}
#header {}
#primary-menu {}
#welcome-text {}

#top-container {}
#top-box-first {}
#top-box-second {}
#top-box-third {}

#system-messages {}
#breadcrumb {}
#page-title {}

#main-container {}
#sidebar-box-first {}
#sidebar-box-main {}
#sidebar-box-second {}

#bottom-container {}
#bottom-box-first {}
#bottom-box-second {}
#bottom-box-third {}
#bottom-box-fourth {}

#footer-container {}
#footer-box-first {}
#footer-box-second {}
#footer-box-third {}

#footer-menu {}
#copyright {}

Examples:
#page-wrapper {
  --r-bg: #fefffc;
  --r-tx: #4c5866;
  --r-h1: #2a3439;
  --r-lk: #8a3324;
  --r-lk-h: #79443b;
  --r-br: #f4f5f0;
  --r-bg-fr: #f8f4ff;
  --r-tx-lk: #2c3e4c;
  --r-tx-lk-h: #1520a6;
  --r-bg-lk:#F2F7FD;
  --r-bg-lk-h: #f8f8e8;
  --r-tx-bt: #354a21;
  --r-tx-bt-h: #597d35;
  --r-bg-bt: #edf1fe;
  --r-bg-bt-h: #efece1;
  }
*/

/* Begin -------------------------------- Logistics Partners ------------------------- */

/* Typo W und S ------------------------------------------------------- */
h2, h3, h5, h6 {
  font-weight: 100;
}

h3 {
  color: #961E79 !important;
}

p {
  font-size: 18px;
  line-height: 30px;
}

.li-1 {
  font-size: 18px;
}

.li-1::marker {
  color: #ccc;
}

.ul-1 {
  padding-left: 16px;
}

.hdiv {
  font-size: 140%;
  color: #961E79;
}

.page-wrapper ul li,
.page-wrapper ul {
  background-color: transparent !important;
}

p.copyright-first,
p.copyright-second {
  font-size: 90%;
}

section#block-logisticspartners-brandingblock {
  margin-top: 20px;
  margin-bottom: 20px;
}



/* ----------------------------------- K -----------------------------------------------*/

#block-logisticspartners-contact .field__label {
  display: none;
}

/* ----------------------------------Listings-------------------------------------------*/
.field-content.imgl {
  max-width: 350px;
  float: left;
  padding-right: 15px;
  padding-bottom: 10px;
  padding-top: 20px;
}

/* Navigation ---------------------------------------------------------*/
.nav__menu-item {
  font-size: 18px;
}

ul.breadcrumb-menu li {
  font-size: 14px;
}

.nav__menu-link.nav__menu-link-main.is-active {
  color: rgb(190,209,111) !important;
}

/* Branding H ----------------------------------------------------------*/
.header-inner {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  flex-direction: row;
  padding: 0px !important;
}

/* Themengrafiken -----------------------------------------------------*/
.simage.field.field--name-field-serviceimage,
.field-content.simage {
  float: left;
  margin-right: 20px;
  margin-bottom: 10px;
  max-width: 120px;
}

#block-logisticspartners-motiv {
  width: 100%;
  margin-bottom: 20px;
}



/* Boxen --------------------------------------------------------------*/
#block-logisticspartners-views-block-duplicate-of-services-block-2 .views-view-responsive-grid__item {
border-style: solid;
  border-width: 1px;
  border-image: linear-gradient(45deg, rgb(151,32,123), rgb(186,110,170)) 1;
  padding-left: 16px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 10px;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
}


#block-logisticspartners-views-block-services-block-1 .views-view-responsive-grid__item {
  border-style: solid;
    border-width: 1px;
    border-image: linear-gradient(45deg, rgb(151,32,123), rgb(186,110,170)) 1;
    padding-left: 16px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 10px;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
  }




#block-logisticspartners-views-block-duplicate-of-services-block-2,
#block-logisticspartners-views-block-services-block-1 {
  margin-bottom: 40px !important;
}
/* Ani -----------------------------------------------------------------*/

.solo-inner ul.navigation__menubar li>a.is-active,
.solo-inner ul.navigation__menubar li.is-active>a,
.solo-inner ul.navigation__menubar li.is-active>button {
  font-weight: 100;
}
a,
button,
input.button {
  transition: 2s;
}

/* button animation  */

/* button animation  */
@keyframes btnBorderAnimation {
  0% {
    width: 0;
    height: 0;
    border-bottom-color: var(--r-br, var(--r-br-b));
  }

  99.9999% {
    width: 100%;
    height: 100%;
    border-bottom-color: var(--r-br, var(--r-br-b));
  }

  100% {
    width: 0;
    height: 0;
    border-bottom-color: transparent;
  }

}

.page-wrapper ul:not(.solo-ul) li>a,
.page-wrapper ul:not(.solo-ul) li>button,
.page-wrapper input.button {
  position: relative;
}

.page-wrapper ul:not(.solo-ul) li>a:after,
.page-wrapper ul:not(.solo-ul) li>button:after,
.page-wrapper input.button:after,
.page-wrapper ul:not(.solo-ul) li>a:before,
.page-wrapper ul:not(.solo-ul) li>button:before,
.page-wrapper input.button:before {
  content: '';
  position: absolute;
  bottom: 0;
  width: 0;
  height: 0;
  background-color: transparent;
  border-bottom: 1px solid transparent;
  border-color: rgb(190,209,111) !important;
}

.page-wrapper ul:not(.solo-ul) li>a:before,
.page-wrapper ul:not(.solo-ul) li>button:before,
.page-wrapper input.button:before {
  left: 0;
}

.page-wrapper ul:not(.solo-ul) li>a:after,
.page-wrapper ul:not(.solo-ul) li>button:after,
.page-wrapper input.button:after {
  right: 0;
}

.page-wrapper ul:not(.solo-ul) li>a:hover:before,
.page-wrapper ul:not(.solo-ul) li>button:hover:before,
.page-wrapper input.button:hover:before {
  animation: btnBorderAnimation 0.3s linear forwards;
}

.page-wrapper ul:not(.solo-ul) li>a:hover:after,
.page-wrapper ul:not(.solo-ul) li>button:hover:after,
.page-wrapper input.button:hover:after {
  animation: btnBorderAnimation 0.3s linear forwards;
}

a,
button,
input.button {
  /*! transition: 0.3s; */
}

.page-wrapper form input.button.form-submit:hover {
  animation: wiggle 0.3s;
}

/* Custom animation */
.solo-animate-opacity {
  animation: opac 0.6s;
  animation-timing-function: cubic-bezier(0.1, 0.9, 2, 0.1);
}

@keyframes opac {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }

}

.solo-animate-top {
  position: relative;
  animation: animatetop 0.6s;
  animation-timing-function: cubic-bezier(0.1, 0.9, 1.5, 0.1);
}

@keyframes animatetop {
  from {
    top: -300px;
    opacity: 0;
  }

  to {
    top: 0;
    opacity: 1;
  }

}

.solo-animate-left {
  position: relative;
  animation: animateleft 0.6s;
  animation-timing-function: cubic-bezier(0.1, 0.9, 1.5, 0.1);
}

@keyframes animateleft {
  from {
    left: -300px;
    opacity: 0;
  }

  to {
    left: 0;
    opacity: 1;
  }

}

.solo-animate-right {
  position: relative;
  animation: animateright 0.6s;
  animation-timing-function: cubic-bezier(0.1, 0.9, 1.5, 0.1);
}

@keyframes animateright {
  from {
    right: -300px;
    opacity: 0;
  }

  to {
    right: 0;
    opacity: 1;
  }

}

.solo-animate-bottom {
  position: relative;
  animation: animatebottom 0.6s;
  animation-timing-function: cubic-bezier(0.1, 0.9, 1.5, 0.1);
}

@keyframes animatebottom {
  from {
    bottom: -300px;
    opacity: 0;
  }

  to {
    bottom: 0;
    opacity: 1;
  }

}

.solo-animate-zoom {
  animation: animatezoom 0.6s;
  animation-timing-function: cubic-bezier(0.1, 0.5, 2, 0.1);
}

@keyframes animatezoom {
  from {
    transform: scale(0);
  }

  to {
    transform: scale(1);
  }

}

.solo-animate-input {
  transition: width 0.4s ease-in-out;
}

.solo-animate-input:focus {
  width: 100% !important;
}

@keyframes wiggle {
  0%,
  7% {
    transform: rotateZ(0);
  }

  15% {
    transform: rotateZ(-15deg);
  }

  20% {
    transform: rotateZ(10deg);
  }

  25% {
    transform: rotateZ(-10deg);
  }

  30% {
    transform: rotateZ(6deg);
  }

  35% {
    transform: rotateZ(-4deg);
  }

  40%,
  100% {
    transform: rotateZ(0);
  }

}

/* Profile User ---------------------------------------------------------*/
.aline {
  margin-bottom: 0px !important;
  margin-top: 0px !important;
}

.aland {
  margin-top: 0px !important;
  margin-bottom: 20px !important;
}

.field--name-field-city {
  margin-bottom: 0px !important;
}

.clogo {
  max-width: 250px;
  margin-bottom: 30px !important;
}

.ctext {
  margin-bottom: 30px !important;
}

.cflag {
  background-color: #e8e8e8;
  max-width: 70px;
  padding-left: 10px;
  margin-bottom: 15px;
}


.ccomp .field__item {
  font-size: 100%;
}

.ccomp .field__label,
.cref .field__label,
.aline .field__label {
  font-weight: 100;
  font-size: 140%;
  color: rgba(72,121,187) !important;
}

.cref.field--label-above {
  margin-top: 40px;
}

.refimg {
  float: left;
  padding-right: 25px;
}

.links.inline.solo-ul.ul-1 {
  padding-bottom: 30px;
}

.clistm .views-view-responsive-grid__item {
  border-style: solid;
    border-width: 1px;
    border-image: linear-gradient(45deg, rgb(12,115,186), rgb(34,147,225)) 1;
    padding-left: 16px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 10px;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
  }  


/* Hint Hacks ----------------------------------------------------------*/

#edit-field-competencies-company-0-format-help-about {
  display: none !important; 
}

.filter-tips__item--short {
  margin-top: 0.3333em;
  margin-bottom: 0;
  display: none !important;
}
  

/* Bottom ---------------------------------------------------------------*/
#bottom-box-first,
#bottom-box-second,
#bottom-box-third,
#bottom-box-fourth{
  padding: 0px !important;
  margin: 0px !important;
}

#bottom-container-inner {
  padding: 0px;
  margin: 0px;
}

.bottom-box-first-inner.fade-inner,
.bottom-box-second-inner.fade-inner,
.bottom-box-third-inner.fade-inner,
.bottom-box-fourth-inner.fade-inner{
  padding: 0px !important;
}

.bottom-box-first-inner.fade-inner {
  background: rgb(0,87,154);
  background: linear-gradient(90deg, rgba(0,87,154,1) 0%, rgba(72,121,187,1) 100%); 
}

.bottom-box-second-inner.fade-inner {
background: rgb(190,209,111);
background: linear-gradient(90deg, rgba(190,209,111,1) 0%, rgb(222, 241, 147) 100%); 
}

.bottom-box-third-inner.fade-inner {
  background: rgb(238, 191, 23);
background: linear-gradient(90deg, rgb(238, 191, 23) 0%, rgba(252, 227, 3, 0.885) 100%); 
}

.neg {
  padding-left: 16px !important;
  color: #fff;
}

.fblockbody {
  padding: 16px !important;
  color: transparent;
  height: 20px;
}

.multi > .solo-col {
  gap: 0;
  grid-auto-flow: column;
}

/* CG --------------------------------------------- */
#top-container-inner {
  max-width: 1280px;
}

/* REF------------------------------------------------------------------*/
.node.node--type-member-references.node--view-mode-teaser {
  border-bottom: 1px solid #ccc;
  margin-bottom: 50px;
}



/* Fields -------------------------------------------------------------*/
.cname {
  color: #0069B4;
  font-size: 20px;
  line-height: 24px;
  margin-bottom: 10px;
}

.sub {
  line-height: 24px;
  margin-bottom: 10px !important;
}

.cportrait {
  max-width: 340px;
}

/* Lead Classes -----------------------------------------------------------*/
.clead {
  font-size: 21px;
  line-height: 32px;
  columns: 2 auto;
  column-gap: 40px;
  margin-bottom: 40px;
}



/* Regions all ---------------------------------------------------------*/
.region-inner {
  padding: 8px !important;
}

#footer-menu {
  background-color: rgb(34, 34, 34);
}
#copyright {
  background-color: rgb(34, 34, 34);
}

/* DS ------------------------------------------------------------------*/
.cright.group-right {
  width: 60%;
}

.cleft.group-left {
  width: 35%;
}

/* Mainblock ------------------------------------------------------------*/
#block-logisticspartners-content {
  margin-bottom: 30px;
}

#block-logisticspartners-contact {
  margin-top: 25px;
}


/* Header ---------------- */
#primary-menu {
  justify-content: center;
  text-align: center;
}

/* Breadcrumbs -------------*/
#breadcrumb {
  max-width: 1280px;
}

/* Network Partners -------------------------*/
.npblock {
  margin-top: 30px !important;
  margin-bottom: 30px !important;
}


/* Main -------------------*/
#main-container-inner {
  max-width: 1280px;
}

/* Links --------------------*/
.lmore a {
  color: #79AC2B !important;
  margin-bottom: 30px !important;
}

/* Services ------------------*/
.shead {
  color: #005699;
}

/* Competencies ---------------*/
.hcom {
  color: #005699;
}



/* Footer ----------------*/
#footer-container,
.region-inner.footer-box-inner.footer-box-first-inner.fade-inner,
.region-inner.footer-box-inner.footer-box-second-inner.fade-inner {
  background-color: rgb(34, 34, 34)!important;
}

#footer-box-first p,
#footer-box-second p,
#footer-box-third p {
  color: #efefef;
}

#block-logisticspartners-footerlinks a,
#block-logisticspartners-footerlinks a:hover {
  color: #efefef;
}




/* Cookies ----------------------------------------------------------- */
.cookiesjsr-btn {
  align-items:center;
  background-color:#005699 !important;
}

.cookiesjsr-btn.invert {
  border-color:#005699 !important;
  color:#005699 !important;
}
.cookiesjsr-btn.important {
  color:#005699 !important;

}
.cookiesjsr-btn.important.invert {
  background-color:#005699 !important;
  border-color:#005699 !important;
}

.cookiesjsr-switch:after {
  background-color:#fff !important;
  border:1px solid #e3e3e3 !important;
  border-radius:var(--switch-height,20px);
}

.cookiesjsr-switch.active {
  background-color:#79AC2B !important;
}

.cookiesjsr-banner {
  align-items:center;
  background-color:#005699 !important;
  bottom:0;
  color:#fff !important;
}

.cookiesjsr-service-group--tab {
  border-bottom:1px solid #e3e3e3 !important;
  color:#575756 !important;
}

.cookiesjsr-service-group.active .cookiesjsr-service-group--tab {
  background:#005699 !important;
}

.cookiesjsr-service-group.active .cookiesjsr-service-group--content {
  background:#005699 !important;
}

.cookiesjsr-layer--header {
  border-bottom:1px solid #e3e3e3 !important;
}

.cookiesjsr-layer--title {
  color:#575756 !important;
  text-transform:uppercase
}

.cookiesjsr-btn.important.allowAll {
  background-color: #fff !important;
}

.cookiesjsr-btn.important.denyAll {
  background-color: #fff !important;
  text-align: center;
}

#tab-functional {
  background-color: #fff !important;
}

.cookiesjsr-btn.invert.denyAll,
.cookiesjsr-btn.invert.allowAll,
.cookiesjsr-btn.invert.important.save.dialog-last-tab {
  background-color: #fff !important;
  text-align: center;
}

#cookiesjsr {
  --default-margin:1.25em;
  --font-size-reset:1rem;
  --btn-font-color:#fff;
  --btn-border-color:#fff;
  --btn-bg-color:#004c93;
  --btn-prime-font-color:#005699;
  --btn-prime-border-color:#fff;
  --btn-prime-bg-color:#fff;
  --btn-inv-font-color:#005699;
  --btn-inv-border-color:#005699;
  --btn-inv-bg-color:#fff;
  --btn-prime-inv-font-color:#fff;
  --btn-prime-inv-border-color:#005699;
  --btn-prime-inv-bg-color:#005699;
  --link-list-font-color:#fff;
  --link-list-separator-color:#fff;
  --banner-logo-offset:100px;
  --banner-bg-color:#004c93;
  --banner-font-color:#fff;
  --layer-header-height:3.5em;
  --layer-header-bg-color:#fff;
  --layer-header-font-color:#575756;
  --layer-body-bg-color:#fff;
  --layer-tab-bg-color:#fff;
  --layer-tab-font-color:#575756;
  --layer-tab-active-bg-color:#005699;
  --layer-tab-active-font-color:#fff;
  --layer-bg-dark:#004c93;
  --layer-font-light:#fff;
  --layer-font-dark:#000f37;
  --layer-border-color:#e4e5e6;
  --layer-footer-bg-color:#fff;
  --layer-footer-font-color:#000f37;
  --layer-footer-height:4.5em;
  --switch-border-color:#e4e5e6;
  --switch-handle-color:#fff;
  --switch-bg-off:#fff;
  --switch-bg-on:#79AC2B;
  --switch-width:45px;
  --switch-height:20px;
  --switch-always-on-font-color:#79AC2B;
  --switch-always-on-bg-color:#fff
}

@media (min-width:62rem) {
  #primary-sidebar-menu {
    min-width: 25rem;
    max-width: 36rem;
  }

}

@media (max-width:62rem) {
  h1 {
    font-size: var(--solo-px26);
    line-height: calc(2 * var(--solo-px15));
  }

  h2 {
    font-size: var(--solo-px22);
    line-height: var(--solo-px26);
  }

  h3 {
    font-size: var(--solo-px20);
    line-height: var(--solo-px24);
  }

  h4 {
    font-size: var(--solo-px18);
    line-height: var(--solo-px22);
  }

  #primary-sidebar-menu {
    min-width: 18rem;
    max-width: 32rem;
  }

  .mobile-nav > button {
    padding: 0 0px !important;
  }

  .clead {
    font-size: 18px;
    line-height: 26px;
    columns: 1 auto;

  }

}

@media (max-width:48rem) {
  .node--view-mode-teaser .field--name-field-image {
    min-width: 100%;
  }

  .clead {
    font-size: 18px;
    line-height: 26px;
    columns: 1 auto;

  }

  .view .node--view-mode-teaser .node__title,
  .view .node--view-mode-teaser .node__content .field--name-field-image {
    padding-right: 0 !important;
    margin-right: 0 !important;
  }

  h1 {
    font-size: var(--solo-px22);
    line-height: var(--solo-px26);
  }

  h2 {
    font-size: var(--solo-px20);
    line-height: var(--solo-px24);
  }

  h3 {
    font-size: var(--solo-px18);
    line-height: var(--solo-px22);
  }

  h4 {
    font-size: var(--solo-px16);
    line-height: var(--solo-px20);
  }

  #primary-sidebar-menu {
    min-width: 18rem;
    max-width: 25rem;
  }

}

@media (max-width:36rem) {
  .header-inner #block-solo-branding {
    width: 100%;
    padding-left: 42px;
  }

  #main-menubar {
    padding-left: 18px;
  }

  .solo-inner .hamburger-icon {
    display: grid;
    justify-content: left !important;
    align-items: baseline;
  }

  .mobile-nav > button {
    padding: 0 0px !important;
  }

  #primary-menu {
    justify-content: left;
    text-align: left;
    padding-left: 20px;
  }

  .solo-inner .navigation__menubar:not(.navigation__megamenu) li.nav__menu-item > a {
    padding: 3px;
  }

  #block-logisticspartners-brandingblock {
    width: 300px;
  }

  .header-inner {
    display: block;
    justify-content: left;
  }

  #member-actions-menubar--3 {
    display: block;
  }

  .solo-inner .navigation__menubar-account li {
    float: left;
    display: block;
  }

  .clead {
    font-size: 16px;
    line-height: 26px;
    columns: 1 auto;

  }

  .shead {
    color: #005699;
    font-size: 18px;
    line-height: 26px;
  }

  .hdiv {
    font-size: 18px;
    color: #961E79;
  }

  .copyright-second,
  .copyright-first {
    font-size: 16px;
  }

  .header-inner .branding-wrapper {
    display: grid;
    gap: var(--solo-px8);
    margin-top: var(--solo-px8);
  }

  .site-name {
    font-size: var(--solo-px26);
    line-height: calc(2 * var(--solo-px15));
  }

  .site-slogan {
    font-size: var(--solo-px20);
    line-height: var(--solo-px24);
  }

  .header-inner .branding-wrapper>* {
    width: 100%;
  }

  .header-inner .branding-wrapper .branding-first,
  .header-inner .branding-wrapper .branding-first a,
  .header-inner .branding-wrapper h1.site-name,
  .header-inner .branding-wrapper h1.site-name a,
  .header-inner .branding-wrapper h3.site-slogan {
    justify-content: center;
    text-align: center;
  }

  h1 {
    font-size: 20px;
    line-height: 26px;
  }

  h2 {
    font-size: 20px;
    line-height: 26px;
  }

  h3 {
    font-size: var(--solo-px16);
    line-height: var(--solo-px20);
  }

  h4 {
    font-size: var(--solo-px14);
    line-height: var(--solo-px18);
  }

  #primary-sidebar-menu {
    min-width: 18rem;
    max-width: 22rem;
  }

}

@media (max-width:20rem) {
  h1 {
    font-size: var(--solo-px18);
    line-height: var(--solo-px20);
  }

  h2 {
    font-size: var(--solo-px16);
    line-height: var(--solo-px20);
  }

  h3 {
    font-size: var(--solo-px14);
    line-height: var(--solo-px18);
  }

  h4 {
    font-size: var(--solo-px12);
    line-height: var(--solo-px16);
  }

  #primary-sidebar-menu {
    min-width: 12rem;
    max-width: 16rem;
  }

}