/* Farbdefinitionen */
/*
Blau 1      #0053a1
Blau 2      #007fc3
Blau 3      #169fdb 
Weiss 1     #ffffff
Footer      #d9eaf9
Schrift Balu1 #0053a1
*/


/* Farben Überschriften */

@media all {
    
    h1,h2,h3,h4,h5 .text-primary {
        color: #1f3c8c;
    }
    
    p { color: #706f6f; }
    
}





/* Header Slider Tablet */
@media(max-width: 992px) {
    /* Header Caroussel */
.carousel-item-header { display: none; } /* Hier das Logo einfügen*/
/* Header das Slider Bild top */
.carousel .carousel-backgroundimage-container, .carousel .carousel-backgroundimage {
    background-position: top;
}
/* testting Backgroundposition im Header */
.carousel .carousel-backgroundimage-container, .carousel .carousel-backgroundimage {
    background-position-y: top;
    background-position-x: center;
    background-repeat: no-repeat;
    background-size: auto 100%;
}
.navbar-fixed-top.navbar-default-transition+a+.carousel .carousel-item, .navbar-fixed-top.navbar-default-transition+a+a+.carousel .carousel-item, .navbar-fixed-top.navbar-default-transition+.main-section>a+.carousel .carousel-item, .navbar-fixed-top.navbar-default-transition+.main-section>a+a+.carousel .carousel-item, .navbar-fixed-top.navbar-inverse-transition+a+.carousel .carousel-item, .navbar-fixed-top.navbar-inverse-transition+a+a+.carousel .carousel-item, .navbar-fixed-top.navbar-inverse-transition+.main-section>a+.carousel .carousel-item, .navbar-fixed-top.navbar-inverse-transition+.main-section>a+a+.carousel .carousel-item {
        background: white;
}

}

@media(min-width: 992px) { 
/* Header Caroussel */
.carousel-item-header { display: none; } /* Hier das Logo einfügen*/
/* Header das Slider Bild top */
.carousel .carousel-backgroundimage-container, .carousel .carousel-backgroundimage {
    background-position: top;
}
/* testting Backgroundposition im Header */
.carousel .carousel-backgroundimage-container, .carousel .carousel-backgroundimage {
    background-position-y: top;
    background-position-x: right;
    background-repeat: no-repeat;
    background-size: auto 100%;
}
.navbar-fixed-top.navbar-default-transition+a+.carousel .carousel-item, .navbar-fixed-top.navbar-default-transition+a+a+.carousel .carousel-item, .navbar-fixed-top.navbar-default-transition+.main-section>a+.carousel .carousel-item, .navbar-fixed-top.navbar-default-transition+.main-section>a+a+.carousel .carousel-item, .navbar-fixed-top.navbar-inverse-transition+a+.carousel .carousel-item, .navbar-fixed-top.navbar-inverse-transition+a+a+.carousel .carousel-item, .navbar-fixed-top.navbar-inverse-transition+.main-section>a+.carousel .carousel-item, .navbar-fixed-top.navbar-inverse-transition+.main-section>a+a+.carousel .carousel-item {
        background: white;
}


}





/* carousel mobil 100% height */
@media (max-width: 576px) {
    .navbar-fixed-top.navbar-default-transition+a+.carousel .carousel-item, .navbar-fixed-top.navbar-default-transition+a+a+.carousel .carousel-item, .navbar-fixed-top.navbar-default-transition+.main-section>a+.carousel .carousel-item, .navbar-fixed-top.navbar-default-transition+.main-section>a+a+.carousel .carousel-item, .navbar-fixed-top.navbar-inverse-transition+a+.carousel .carousel-item, .navbar-fixed-top.navbar-inverse-transition+a+a+.carousel .carousel-item, .navbar-fixed-top.navbar-inverse-transition+.main-section>a+.carousel .carousel-item, .navbar-fixed-top.navbar-inverse-transition+.main-section>a+a+.carousel .carousel-item {
    background: white;
    height: calc(100vh - 70px);
}
.carousel-text {
    
    background: rgba(255,255,255,0.95);
    
}
}




@media (min-width: 992px) {
    
    /* Desktop das Logo ausschalten, da es im Header ist */
    #page-header .navbar-brand.navbar-brand-text  {
        display:none;
    } 
    
    .navbar-brand.navbar-brand-image { display: none;}
    
    /* Navigationsknöpfe Hintergrund */
    #mainnavigation .nav-item {
        width: 200px;
        /* margin-right: 1px; */
    }
    /* Text der Navigation center */
    .navbar-mainnavigation .nav-link {
       
    }

    #mainnavigation .nav-link {
        border: 0px solid red;
    }
    #mainnavigation .nav-link-text {
        /* margin: auto; */
        text-align: center;
        width: 100%;
        
    }

    /* Leistungen */
    #nav-item-84.nav-link {
        /*background: #0053a1;*/
    }
    /* FAQ */
     #nav-item-85.nav-link {
        /*background: #007fc3;*/
    }
    /* Kontakt */
     #nav-item-86.nav-link {
        /*background: #169fdb;*/
    }
    /* Home */
     #nav-item-83.nav-link {
       /* background: #fff;*/
        color: #0053a1;
    }

    #nav-item-83.nav-link .nav-link-icon {
       position: relative;
       left: 48px;
    }
     #nav-item-83.nav-link .nav-link-text {
        background: #fff;
        color: #0053a1;
    }
    
    /* nac Icon in Start näher zum Text */
    .nav-item-83 .nav-link-icon {
        position: relative;
        left: 3rem;
    }

#nav-item-84.nav-link ::before{
  position:absolute;
  top:0px;right:0px;bottom:0px;left:0px;
  transform:skewX(-30deg);
  background:#0053a1;
  z-index:-1;
  content:'';
}
#nav-item-85.nav-link ::before{
  position:absolute;
  top:0px;right:0px;bottom:0px;left:0px;
  transform:skewX(-30deg);
  background:#007fc3;
  z-index:-1;
  content:'';
}
#nav-item-86.nav-link ::before{
  position:absolute;
  top:0px;right:0px;bottom:0px;left:0px;
  transform:skewX(-30deg);
  background:#169fdb;
  z-index:-1;
  content:'';
}
#nav-item-83.nav-link ::before{
  position:absolute;
  top:0px;right:0px;bottom:0px;left:0px;
  transform:skewX(-30deg);
  background:#fff;
  border: 1px solid #0053a1;
  z-index:-1;
  content:'';
}  

.navbar-light .navbar-nav .nav-link, 
.navbar-default .navbar-nav .nav-link, 
.navbar-default-transition .navbar-nav .nav-link, 
.navbar-default-transition.navbar-transition .navbar-nav .nav-link {
    color: white;
}

/* Hintergrund Navigation */
.bg-white, .navbar-default, .navbar-default-transition, .navbar-default-transition.navbar-transition {
    --bs-bg-opacity: 1;
    border: none;
    background-color: transparent !important;
}
/* bein scrollen kein bornder-bottom */
.navbar-mainnavigation {
    
    box-shadow: 0 1px 0 0 rgb(0 0 0 / 15%);
    box-shadow: none;
    /*padding: 0;*/
}



/* NAVI LINKS in Bildern */

.section-column .section-column-third .element-header ::before {
  position:absolute;
  top:0px;right:0px;bottom:0px;left:0px;
  transform:skewX(-30deg);
  background:#0053a1;
  z-index:-1;
  content:'';
}





}


/* */



/* Navigation desktopn */
@media (min-width: 768px) {
 .navbar-mainnavigation .navbar-nav>li>.nav-link:before {
    top: auto;    left: 1rem;    right: 1rem;    bottom: 0.25rem;    height: 2px;    width: auto;    display: none;
}
}
/*
@media (min-width: 768px) {
#page-header.navbar-fixed-top { margin-top: 40px;}
#page-header.navbar-fixed-top.navbar-transition { margin-top: 0px;}
}
*/
@media (min-width: 992px) {
#page-header.navbar-fixed-top { margin-top: 40px;}
#page-header.navbar-fixed-top.navbar-transition { margin-top: 0px;}
}


/* header */
@media (min-width: 768px) {
    /* Nur Text Variante */
    
    .carousel .carousel-text-inner {
        max-width: 33%;
        width: 33%;
    }
    .carousel-item-type-text .carousel-text-inner {
            margin: 0;
            margin-left: 0px;
    } 
    
}


@media (min-width: 200px) and (max-width:768px) { 
.carousel-content-inner.primus {
        display: flex;
        border: 0px solid red;
        flex-direction: column;
        /* flex-wrap: nowrap; */
        align-content: flex-start;
        justify-content: center;
        align-items: flex-start;
        
        
    }
}

@media (min-width: 768px) {
    /* Text und Image Variante  */
    .carousel-content-inner.primus {
        display: flex;
        border: 0px solid red;
        flex-direction: column;
        /* flex-wrap: nowrap; */
        align-content: flex-start;
        justify-content: center;
        align-items: flex-start;
        
        
    }
    
    .carousel-content-inner.primus .carousel-image.primus-logo { position: relative; top: 10px;}
    
    .carousel-content-inner.primus .carousel-image {
       /*border: 1px solid orange;*/
       width: 36%;
    }
    .carousel-content-inner.primus .carousel-text {
       /*border: 1px solid green;*/
       width: 36%;
    }
    
    /* Grüße der Überschrift im Header unter Logo */
    .carousel-content-inner.primus .carousel-text h2 {
        font-size: 2.0rem;
    }
    
    
}

    

@media (min-width:768px) {  .carousel .item {    border: 0px solid red; }} 
@media (min-width: 768px) {  .carousel .item {    height: 800px;  }}
@media (min-width: 992px) {  .carousel .item {    height: 800px;  }}
@media (min-width: 1200px) {  .carousel .item {    height: 900px;  }}
@media (min-width: 1400px) {  .carousel .item {    height: 900px;  }}

/* PRIMUS LOgog Position */

@media (min-width: 768px) { .carousel-content-inner.primus .carousel-image.primus-logo { position: relative; top: -50px;}}
@media (min-width: 992px) {  .carousel-content-inner.primus .carousel-image.primus-logo { position: relative; top: -50px;}}
@media (min-width: 1200px) {  .carousel-content-inner.primus .carousel-image.primus-logo { position: relative; top: -100px;}}
@media (min-width: 1400px) {  .carousel-content-inner.primus .carousel-image.primus-logo { position: relative; top: -100px;}}

/* Breite Header Text */
@media (min-width:768px) { .carousel-content-inner.primus .carousel-text { width: 66%; }}
@media (min-width: 768px) { .carousel-content-inner.primus .carousel-text { width: 66%; }}
@media (min-width: 992px) { .carousel-content-inner.primus .carousel-text { width: 36%; }}
@media (min-width: 1200px) { .carousel-content-inner.primus .carousel-text { width: 36%; }}
@media (min-width: 1400px) { .carousel-content-inner.primus .carousel-text { width: 36%; }}

    
    
/* Startseite 3x Kacheln */ 
@media (min-width:768px){        
        .section-column.section-column-third {
            /* gutter */
            padding: 15px;
        } 
        
        .section-column.section-column-third h2 {
            font-weight: bold;
            border: none;
        }
        
        .section-column.section-column-third h2::before {
           
        }
        
        
        
        
}

    
 

/* divider ohne rand */
.frame-type-div hr {
    background: transparent;
}


@media (min-width: 1400px) {

  --max-breite: 840px;
  --border: 22px ;
  
    .container  {
      max-width: var(--max-breite);   
      border: var(--border) solid red;
    }
    
  
}

/* Footer mobile */
@media (max-width: 576px) {
    .footer-section-content {
     padding: 20px;
}

.carousel-content-inner.primus .carousel-text {
     margin: auto;
     padding: 20px;
    
}

  .carousel-content-inner.primus .carousel-text h2 {
     padding: 20px;
     /*background: rgba(255,255,255,.8);*/
     
}

  .carousel-content-inner.primus .carousel-text h4 {
     padding: 20px;
     /*background: rgba(255,255,255,.8);*/
     
}

  .carousel-content-inner.primus .carousel-text h2 span {
}

  

  
.carousel-content-inner.primus .carousel-text p{
     margin: auto;
     padding: 20px;
    /* background: rgba(255,255,255,.8);*/
}

  
    
}


/* Footer Logo rechte Spalte nach unten */
@media (min-width: 768px) and (max-width:992px) {
    .footer-section-content-column-right {
        display:flex;
        align-items: center;
    }
    
    #c226.frame-default { padding-top: 0rem;}
}

@media (min-width: 992px) {
    .footer-section-content-column-right {
        display:flex;
        align-items: center;
    }
    
}
@media (min-width: 1200px) {
    .footer-section-content-column-right {
        display:flex;
        align-items: flex-end;
    }
    
}




/* Knöpfe in Pyramide verschoben */

/* Leistung 1 - Arbeitssicherheit */
@media (min-width:768px) {
     #c415 {
         /* border: 1px solid green; */
         position: relative;
         top: -100px;
         width: calc(992px / 2 + 0px);
}
}
@media (min-width:992px) {
     #c415 {
     position: relative;
     top: -153px;
     left: 200px;
     width: calc(992px / 2 + 0px);
}
}
@media (min-width:1200px) {
    
}
@media (min-width:1400px) {
    #c415 { 
     top: -100px;
     left: 180px;
    }
    
}





/* Leistung 2 - Qualitätsmanagement  */

@media (min-width:768px) {
     #c425 {
         /* border: 1px solid green; */
         position: relative;
         top: 49px;
         left: 30%;
         width: calc(992px / 2 + 0px);
}
}
@media (min-width:992px) {
     #c425 {
     position: relative;
     top: 150px;
     left: 43%;
     width: calc(992px / 2 + 0px);
}
}
@media (min-width:1200px) {
    
}
@media (min-width:1400px) {
    #c425 {
     top: 200px;
     left: 33%;
    }
    
}

/* Leistung 3 - Hebetechnik  */

@media (min-width:768px) {
     #c332 {
         /* border: 1px solid green; */
         position: relative;
         top: 49px;
         left: 30%;
         width: calc(992px / 2 + 0px);
}
}
@media (min-width:992px) {
     #c332 {
     position: relative;
     top: 150px;
     left: 43%;
     width: calc(992px / 2 + 0px);
}
}
@media (min-width:1200px) {
    
}
@media (min-width:1400px) {
    #c332 {
     top: 200px;
     left: 33%;
    }
    
}