@charset "UTF-8";
@import url("../components/fonts/fontawesome62/css/all.min.css");

@font-face {
    font-family: 'Montserrat';
    src: url('../components/fonts/Montserrat/Montserrat-VariableFont_wght.ttf');
}

:root{
  --color-basic: #2443a7;
  --color-background-gray: #cfcfcf;
  --color-background-active-menulink: #d92540;
  --content-block-margin: clamp(40px,10vh,100px);
  --content-h1-font-size: clamp(1rem, 10vw, 2rem);
  --content-h2-font-size: clamp(.9rem, 7vw, 1.6rem);
  --content-p-font-size: clamp(.9rem, 7vw, 1.2rem);
  --body-color:rgb(51, 51, 51);
  --body-font-family: 'Montserrat', sans-serif;
  --cassiopeia-font-family-headings:'Montserrat', sans-serif;
}
*,
*::before,
*::after {
  box-sizing: border-box;
}

@media (prefers-reduced-motion: no-preference) {
  :root {
    scroll-behavior: smooth;
  }
}
body {
  margin: 0;
  font-size: var(--content-p-font-size);
  font-weight: var(--body-font-weight);
  line-height: var(--body-line-height);
  color: var(--body-color);
  text-align: var(--body-text-align);
  background-color: var(--body-bg);
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  font-family: var(--body-font-family);
  /* background-color: var(--color-background-gray); */

}

body h4,body h5{
  font-weight: normal;
  font-size: 18px;
}
/* body h1 , body h2{
  font-weight: normal;
  font-size: 2em;
   font-weight: 600;
   background-image: linear-gradient(to left, var(--color-basic), #74a42f);
   color: transparent;
   background-clip: text;
   -webkit-background-clip: text;
   width:max-content;
   max-width: 100%;
} */

/* h1 style 1 background 2 stripes */
h1{
  color:var(--color-background-active-menulink);
  position: relative;
  padding: 0;
  margin: 0;
  font-family: "Raleway", sans-serif;
  font-weight: 300;
  font-size: 40px;
  -webkit-transition: all 0.4s ease 0s;
  -o-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
  margin-bottom: 25px;
}
main h1 {
    text-align: center;
    font-size:30px;
    font-weight:300;
    /* color:#222;  */
    letter-spacing:1px;
    text-transform: uppercase;
    display: grid;
    grid-template-columns: 1fr max-content 1fr;
    /* grid-template-rows: 27px 0; */
    grid-gap: 20px;
    align-items: center;
}

main h1:after,main h1:before {
    content: " ";
    display: block;
    /* border-bottom: 1px solid var(--color-basic);
    border-top: 1px solid var(--color-basic); */
    height: 1px;
    background-color:var(--color-basic);
}
/* h1 style 1 background 2 stripes  END*/
body a{
  color:inherit;
}
main table{
  width: 100%;
  max-width: 100%;
  margin-bottom: 20px;
}
/* BASICS END */

.grid-child {
  max-width: none;
  width: 100%;
}

/* Header / Logo + Menü */

  header.container-header{
    background-color: #fff !important;
    background-image:none !important;
    padding-bottom:6px;
  }
  header .header{
    display: grid;
    grid-template-columns: auto auto;
    justify-content: space-between;
  }
  header .header .brand-logo img{
    height:150px;
    max-width: 100%;
  }
  header .header .sub-logo{
    height: 150px;
    display: grid;
    align-items: center;
  }
  @media screen and (max-width:768px){
    header .header{
      grid-template-columns: 100%;
      /* grid-row-gap: 15px; */
    }
    #dj-megamenu111mobile {
      position: absolute;
      top: 20px;
      right: 20px;
    }
    header .header .sub-logo{
      display: none;
    }
  }
  .container-header .navbar-brand a {
    color: #fff;
    width: 100%;
    display: block;
    /* padding: 0 10px; */
  }
  header .navigation-container{
	background-color:var(--color-basic);
  }
  header.container-header .container-nav {
    flex-wrap: none;
    /* justify-content: flex-end; */
    align-items:center;
    padding: 0;
  }
  header.container-header .container-nav .dj-megamenu-clean li a.dj-up_a{
    color:#fff;
    padding: 5px 0;
    height: auto;
    font-size: 16px;
    font-weight: 600;
    white-space: nowrap;
  }
  header.container-header .container-nav .dj-megamenu-clean li a.dj-up_a > span{
    height: auto;
    justify-content: center;
    line-height: 1.1;
  }

  /* header.container-header .container-nav .dj-megamenu-clean li a::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 3px;
    top: 100%;
    left: 0;
    background: var(--color-basic);
    transition: transform 0.5s;
    transform: scaleX(0);
    transform-origin: right;
  }
  header.container-header .container-nav .dj-megamenu-clean li a:hover {
    color: #95a5a6;
  }
  header.container-header .container-nav .dj-megamenu-clean li a:hover::after {
    transform: scaleX(1);
    transform-origin: left;
  }
  .container-header .navbar-brand{
    margin-top: 30px;
    margin-bottom: 20px;
    padding:0;
  } */
  .container-header .navbar-brand{
    padding:0;
    margin-right:0;
    width:100%;
  }
  ul.dj-megamenu-clean{
    flex-direction: row;
    align-items: stretch;
  }
  ul.dj-megamenu-clean > li{
    flex:1;
    border-right:1px solid #fff;
    text-align: center;
    background-color:var(--color-basic);
  }
  ul.dj-megamenu-clean > li:first-of-type{
    border-left:1px solid #fff;
  }
  ul.dj-megamenu-clean > li.active{
    background-color: var(--color-background-active-menulink);
  }
/* Header / Logo + Menü END */


/* Content  */
  .blog-item {
    overflow: visible;
  }
  .main-container{
      padding-bottom: 51px;
  }
    main .main-background-image{
      position: relative;
      /* min-height: 1000px; */
      background-color: white;
      /* background-image: url("http://hgd-server7.de/ibk-luebeck.com/images/kundenordner/bg_footer.jpg"); */
      background-repeat: no-repeat;
      background-position: bottom;
      background-size: 100% auto;
    }
  main .main-background-image  .component-container{
    padding:60px 0px;
  }
  main .main-background-image  .component-container iframe {
    float: right;
  }
  main a{

  }
  .site-grid{
    display: block !important;
    grid-template-rows: none;
    grid-template-columns: none !important;
    /* grid-template-areas:none; */
  }
  .site-grid > div:first-of-type , .site-grid > div:last-of-type{
    padding: 0;
  }
  .site-grid > div{
    padding: var(--content-block-margin) 0;
  }
  .site-grid p{
    font-size: var(--content-p-font-size);
  }
  figure.flex-format-img{
    height:100%;
  }
  figure.flex-format-img img{
    height:100%;
    object-fit: cover;
    object-position: center;
  }
  .service-container{
    margin-top:var(--content-block-margin);
  }
  .service-card{
    background-color:#1111110d;
    height:100%;
    /* border:1px solid var(--color-basic); */
    box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
  }
  .service-card > .service-card-icon{
    position: relative;
    width:max-content;
    left:20px;
    /* margin-left:auto;
    margin-right:auto; */
    margin-bottom: -45px;
    top:-45px;
    border:8px solid #fff;
    background-color: #fff;
    border-radius: 15px;
    transition: all ease .6s;
  }
  .service-card:hover > .service-card-icon{
    transform: translate(30px,0);
  }
  .service-card > .service-card-body{
    padding:20px 25px;
    /* text-align: center; */
  }
  .service-card > .service-card-body > div.w-100{
    /* padding:20px 25px; */
    text-align: right;
  }
  @media screen and (max-width:768px){
    .service-container .row > div{
      margin-bottom: 60px;
    }
  }
  @media screen and (min-width:768px){
    .service-card > .service-card-body a.btn{
      transition: all ease .6s;
      transform:translateX(-30px);
      opacity: 0;
    }
    .service-card:hover > .service-card-body a.btn{
      transform:translateX(0px);
      opacity: 1;
    }
  }
  /* check-list stxyle 1 */
  ul.check-list {
      list-style: none;
      padding: 0;
      display: block;
  }
  ul.check-list li {
    color: RGBA(0,0,0,0.7);
    line-height: 1.5;
    /* font-size:1.2em; */
      padding-left: 2em;
      display: block;
      margin-top: 15px;
  }
  ul.check-list li::before {
      display: inline-block !important;
      content: '\f058' !important;
      font-weight: 300;
      font-family: "Font Awesome 6 Pro";
      color:var(--color-basic) !important;
      position: absolute;
      font-size: 1.4em;
      margin-right: 1em;
      transform: translate(-1.3em,-3px);
  }
  .red ul.check-list li::before{
    color:var(--color-background-active-menulink) !important;
  }
  /* check-list stxyle 1  END*/
/* Content  END*/

/* Footer */

  .contact-footer{
    padding: 30px 0 0 0;
    /* background-color: #3333; */
  }
  .contact-footer .hgd-bottom-box{
    margin-bottom: 30px;
  }
  .contact-footer .hgd-bottom-box h3{
    font-size:var(--content-h2-font-size);
    font-weight: normal;
    margin-bottom: 15px;
  }
  .contact-footer .hgd-bottom-box p, .contact-footer .hgd-bottom-box a{
    font-size:16px;
  }
  .contact-footer .hgd-bottom-box a{
    color:inherit !important;
    text-decoration: none;
  }
  .contact-footer .hgd-bottom-box a:hover{
    color:var(--color-basic) !important;
  }
  .contact-footer .hgd-bottom-box i{
    margin-right: 10px;
  }
  .contact-footer .hgd-bottom-box p{
    margin:0 !important;
  }
  .contact-footer .hgd-bottom-box ul.menu{
    list-style: none;
    padding: 0;
    margin: 0;
  }
  .contact-footer .hgd-bottom-box table tr , .contact-footer .hgd-bottom-box table tr td{
    border:none !important;
  }
  .container-bottom-a > *, .container-bottom-b > *, .container-top-a > *, .container-top-b > * {
    margin: 0;
  }
  .table > :not(caption) > * > * {
    padding: 0;
  }
/* Footer END*/

/* Copyright */

  .footer{
    margin-top: 30px !important;
    background-image:none;
    background-color: #fff0;
    /* padding:0 28px; */
    color:var(--body-color);
  }
  .footer .mod-footer{
    border-top: 1px solid var(--color-basic);
    padding: 10px 0;
  }
  .footer img{
    width:300px;
    max-width:100%;
  }
  .footer h3{
    margin-top:15px;
  }
  .footer a{
    font-size: 14px;
    line-height: 1.42857143;
    color:#333;
    text-decoration: none;
  }
  .footer tbody > tr > td, .table > tfoot > tr > td {
    padding: 0px !important;
  }


/* Copyright END*/

.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td{
  padding: 8px;
  line-height: 1.42857143;
  vertical-align: top;
  border-top: 1px solid #ddd !important;
}

@media (min-width: 1400px){

/* .container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
  max-width: 1170px;
  } */
}
/* CHecklist */
  ul.checker{
      list-style: none;
      padding: 0;
      display: block;
  }
  ul.checker li{
      font-size: 1em;
      padding-left: 2em;
      display: block;
      margin-top: 10px;
  }
  ul.checker li::before{
      display: inline-block !important;
      content: '\f14a' !important;
      font-weight: 300;
      font-family: "Font Awesome 6 Pro";
      position: absolute;
      font-size: 1.2em;
      margin-right: 1em;
      transform:translate(-1.3em , -2px);
      color:var(--color-basic);
  }
/* CHecklist ENDE */
@media (max-width: 1220px){
  .main-container {
    padding-bottom: 80px;
  }
}

@media (max-width: 1000px){
  header.container-header .container-nav {
    padding: 10px;
  }
  .main-container {
    padding-bottom: 80px;
  }
}

/* Customer layout on the unmodified standard Cassiopeia template. */
.hgd-header { max-width:1320px; margin:auto; padding:0 12px; height:150px; display:flex; align-items:center; justify-content:space-between; }
.hgd-header .brand-logo img {height:150px; width:auto; max-width:100%; object-fit:contain;}
.hgd-header .sub-logo {display:flex;align-items:center;max-width:57%;}
.hgd-header .sub-logo img {max-width:100%;height:auto;}
.container-header .container-topbar {padding:0;}
.container-header .container-nav {max-width:1320px;margin:0 auto;padding:0 12px;position:relative;isolation:isolate;background:var(--color-basic);}
.container-header .container-nav::before {content:"";position:absolute;left:50%;top:0;width:100vw;height:100%;transform:translateX(-50%);background:var(--color-basic);z-index:-1;}
.site-grid {width:100%;max-width:1320px;margin:0 auto;gap:0;padding:0 12px;}
.site-grid>.container-component {padding:60px 0 !important;}
.container-banner {padding:0 !important;margin-bottom:0;}
.container-component>main {margin-top:0;}
.container-header .container-nav>.dj-megamenu-wrapper {width:100%;flex:1;}
.com-content-article a {overflow-wrap:anywhere;}
.container-footer {margin:0 !important;padding-bottom:51px;}
.container-footer>.grid-child {display:block;max-width:1320px;margin:0 auto;padding:0 12px;}
.container-footer .custom {width:100%;}
.container-footer .mod-footer {margin-top:30px;}
.container-footer .mod-footer .footer2 {margin-top:8px;}
.container-footer .mod-footer .footer2 a {font-size:14px;}
@media(max-width:768px) {
 .hgd-header {height:150px;justify-content:flex-start;}
 .hgd-header .brand-logo {max-width:calc(100% - 56px);}
 .hgd-header .brand-logo img {max-width:100%;height:auto;max-height:150px;}
 .hgd-header .sub-logo {display:none;}
 #dj-megamenu111mobile {position:fixed;top:20px;right:20px;z-index:1100;}
 .container-header .container-nav {min-height:20px;padding:0 12px !important;}
 .site-grid>.container-component {padding:60px 0 !important;}
 .container-footer {padding-bottom:80px;}
 main h1 {grid-template-columns:minmax(0,1fr) minmax(0,auto) minmax(0,1fr);gap:12px;overflow-wrap:anywhere;}
}