@import url('https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@400;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald&display=swap');



body {font-family: 'Source Sans Pro', sans-serif; color:#55565a;  background: rgb(179,187,201);

background: linear-gradient(90deg, rgba(179,187,201,1) 0%, rgba(242,242,242,1) 40%, rgba(242,242,242,1) 60%, rgba(179,187,201,1) 100%); }





.copyright a {color:#4f5252 !important;}

.blau {background: #06508c;}

.rot {background: #e30613;}

.dunkelgrau {background: #4f5252;}

.dunkelgrau .ce-bodytext, .dunkelgrau h2, .dunkelgrau h3, .dunkelgrau h1, .blau h1, .blau h2, .blau h3, .dunkelgrau a, .blau a {color:#fff !important;}

.rot .ce-bodytext, .rot h2, .rot h3, .rot h1, .blau h1, .blau h2, .blau h3, .rot a, .blau a, blau .ce-bodytext {color:#fff !important;}



footer h4,

footer .ce-bodytext p {color:#fff !important; padding: 2% 0 0 2%;}



.hellgrau {background: #dcdcde;}

.hellgrau a {color: #4f5252;}



main p {font-size: 1.2rem;}



.mm-menu_offcanvas {  z-index: 100 !important;}

 .news-img-wrap a:hover {color: #c42337;}

a:hover {color: #FFFFFF;}

 footer a:hover {opacity: 0.8;}



footer .blau {padding: 2% 0;}



#pageid47 main {position: relative; overflow: auto !important;}




   .jsSticky {
      width: 100%;
      height: 60px;
      position: relative;
   }
   
   .sticky {
      position: fixed;
      top: 2%;
      width: 100%;
   }


@supports (position: sticky) or (position: -webkit-sticky) {
   @media (min-width: 680px) {
      .jsSticky {
         position: -webkit-sticky;
         position: sticky;
         top: 2%;
      }
   }
}





btn {background: #e30613;}



.test h1::after {

  position: absolute;

  content: "";

  background-color: #e30613;

  width: 25%;

  height: 4px;

  bottom: -23px;

  left: 0;

}



.trennerblau img {

	transform: none;

}

.ce-gallery figcaption {

background-repeat: no-repeat;

	background-position-y: center; }



.test .adlertrenner {border-bottom: 2px solid #e30613; }



.adlertrenner .ce-gallery {  position: absolute; top: 64px;}

.adlertrenner .ce-bodytext {margin-left: 150px;}

.adlertrenner  {position: relative;}



.adlertrenner:after {

  content: '';

  position: absolute;

top: 128px;

	width: 100%;

  border:1px solid #06508c;

 color:#06508c;

}





.logo .ce-bodytext p {position: absolute; top:44px; font-size: 24px;}

footer h3 {text-transform: uppercase; font-size: 16px;}



.slides {width: 100%; position: relative;   max-height: 700px;  overflow: hidden;}

.slides .slidertext {position: absolute; bottom: 50%; left: 10%; z-index: 40;  }

.slides .slidertext h2 {text-transform: uppercase; font-size: 60px; display: inline-block; font-weight: bold; background: #fff; padding: 8px 30px; display: none;}

.slides .grafikelement {z-index: 4; position: relative;}





main .ce-gallery[data-ce-columns="3"] .ce-column {

  width: 32%;

  float: left;

  margin-right: 1%;

  margin-bottom: 1%;

}



main .ce-gallery[data-ce-columns="4"] .ce-column {

  width: 24%;

  float: left;

	  margin-right: 1%;

  margin-bottom: 1%;

}



.adlerposition {position: relative;}



/*#pageid1 .animationsadler {background-image: url("images/header-adler-koch-container.svg");   position: absolute;

  left: -24%;

  top: 0;

  height: 700px;

  z-index: 1000;

  width: 100%;

	background-repeat: no-repeat;



}*/ 





.hunderter .ce-bodytext {

    top: 20%;

    position: absolute;

    text-align: center;

    width: 100%;

}



nav.sticky {	position:fixed;}

.thumbnail .col {

  display: block;

  padding: 1px;

  line-height: 1.42857143;

  border-radius: 4px;

  transition: border 0.2s ease-in-out;

}

.thumbnail > img,

.thumbnail a > img {

  margin-right: auto;

  margin-left: auto;

}

a.thumbnail:hover,

a.thumbnail:focus,

a.thumbnail.active {

  border-color: #337ab7;

}

.thumbnail .caption {

  padding: 9px;

  color: #333333;

}



.test .text-center{

color: #e30613;

}





.id450 {padding: auto;

background-color: aqua;}



.parallax {

	margin-bottom: 5%;

	margin-top: 5%;

    min-height: 600px;

    position: sticky;

    background-attachment: fixed;

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

	background-image: url("https://www.koch-container.com/fileadmin/user_upload/Unternehmen/DJI_0250-3.jpg");

}



main {margin:5% 0;}





main .ce-gallery .figcaption {

	

	position: absolute;

display: block;

top: 0;

bottom: 0;

left: 0;

right: 0;

width: 100%;

max-width: 100%;

height: 100%;

}
 


main h1, h2, h3, strong { color: #06508c;}



main .frame-custom-19  img {

    max-height: 700px;

    object-fit: cover;

    object-position: center;

}

/* main {padding: 2% 0; margin:3% 0;}*/

#pageid1 main  {padding: 0% 0 2%;}

main a {color: #c42337;}

main h1 {

  color: #e30613;

  font-weight: bold;

  text-transform: uppercase;

  font-size: 60px;

  position: relative;

  margin-bottom: 100px !important;

}

main h2 {color:#e30613; font-weight: bold;}

main .container .row .col .row  .hellgrau  { background: #dcdcde;    margin-bottom: 34px;}







.jahre {position: absolute !important; right: 4px; top:14px; max-width: 180px;}





.footer {margin: 2% 0 ;}



.footer .ce-center .ce-gallery {max-width: 200px;}



.whitetext .ce-bodytext, .whitetext h1,.whitetext h2, .whitetext h3, .whitetext h4, .whitetext a {color:#fff !important;}



.menuebalken {margin-top:10px;}

.menuebalken,

.breadcrumps { width: 100%;}

.grau  {background: #d2d2d2;}



.footerleiste {background: #9f9f9f;}







.mobilelogo {display: none;}



.slides h2 {display: none;}

.slick-slide img {

    display: block;

    width: 100%;

	margin: 0 auto;

}



.slider {

	display: table !important;

	table-layout: fixed !important;

	width: 100% !important;

	position: relative;

	background: #888;

}

.slick-prev, .slick-next {z-index: 100000;}

slider .container {max-width: inherit !important; width: 100% !important;}

slider .container .col, slider .container, 

slider .container .row {padding: 0; margin:0;}

slider h2 {display: none !important;}



 .slick-prev {left: 25px !important;}

.slick-next {right: 50px !important;}



.slick-next::before,

.slick-prev::before {color:#a33c3a; font-size: 50px;}



ul.slick-dots {

    bottom: 3% !important;

}



.adlerposition {

	z-index: 1;

}



#pageid1 .breadcrumpnav {display: none;}

.kopfbereich {

    border-bottom: 1px solid #888;

    position: relative;

    width: 100%;

    z-index: 10 !important;

    padding: 6px 0;

	position:relative;

	background: rgb(179,187,201);

    background: linear-gradient(90deg, rgba(179,187,201,1) 0%, rgba(242,242,242,1) 40%, rgba(242,242,242,1) 60%, rgba(179,187,201,1) 100%);



top: 0px;

width: 100%;

z-index: 20;

}



.justify-content-start {padding-bottom: 30px;}



.copyright {font-size: 12px; color:404040; padding: 1% 0; text-align: center;}



.adlertrenner .ce-gallery .image:hover img {

transform: scale(1); -o-transition: all 0.3s linear;

}





h1, h2, h3, h4, h5 {font-family: 'Source Sans Pro', sans-serif !important; font-weight: bold; padding-bottom: 0.5% !important; margin: 1.5% 0 !important; }





main h3  {

    font-size: 31px !important;

    margin: 6px 0 !important;

    text-transform: uppercase;

    font-weight: bold;

	color: #e30613;

}



.breadcrumps p {padding-top:10px; font-size: 14px; color:#fff; float:right;}

.breadcrumps a {font-weight: bold; color:#fff;}

.breadcrumps span {font-weight: bold;}







.tx-powermail h3 {display: none;}



.flexslider .ce-left .ce-gallery, 

.flexslider  .ce-column {

    float: left;

    width: 100%;

}





.flexslider 

.flexslider .ce-left .ce-gallery {float:inherit;}





.flexslider  .ce-gallery figure {

    display: table;

    margin: 0;

    width: 100%;

}



.flexslider {

	margin: 0 !important;

	border: 0px !important;

}





.animation .flexman, .animation .slides, .animation .frame, .animation .image, .animation .ce-row, .animation figure, .animation img, .animation .ce-column, .animation .ce-gallery, .animation .ce-outer {

    width: 100% !important;

    position: relative;

    float: left;

    padding: 0;

    margin: 0;

    border: none;

}



.btn-primary{

    background-color: #06508c !important;

    border-color: #06508c !important;

	font-size: unset !important;

}



.btn-primary:hover { background: #0d6efd;}



/*main .button,

main strong a  {

    background-color: #228468;

    border-color: #228468;

    color: #228468;

    text-transform: uppercase;

    border-width: 1px;

    border-style: solid;

    text-shadow: none;

    background: none no-repeat center center;

    padding: 9px 22px 6px;

    font-size: 14px;

    line-height: 100%;

    font-family: montserrat,Helvetica,Arial,sans-serif;

    -webkit-box-shadow: 0 0 0 transparent;

    box-shadow: 0 0 0 transparent;

    -moz-box-shadow: 0 0 0 transparent;

    border-radius: 0;

    -webkit-border-radius: 0;

    -moz-border-radius: 0;

    -o-border-radius: 0;

    -webkit-transition: all .3s;

    -o-transition: all .3s;

    transition: all .3s;

	margin-bottom: 20px;

	font-weight: bold;

}*/



.rot strong a {

    border: 1px solid #fff;

    color: #fff;

}

.media img {

 object-fit: scale-down ;

  }





.media  .image {

    max-height: 170px;

    display: block;

    overflow: hidden;

    object-fit: cover;

    object-position: center;

}





.media .ce-gallery  {

    margin: 0;

    padding: 0 !important;

    box-sizing: border-box;

    position: relative;



}



.media .ce-center .ce-row {

    display: flex !important;

    flex-direction: row;

    flex-wrap: nowrap;

    justify-content: center;

}





.hellgrau .container .row .col .row .ce-textpic {



	margin-bottom: 20px;}





.flexslider .aktion .ce-bodytext {

    position: absolute;

    bottom: 177px;

    width: 100%;

	margin-left: 30%;

	

}



.flexslider .aktion h2{

    font-size: 46px;

    line-height: 120%;

    font-family: montserrat,Helvetica,Arial,sans-serif;

    font-weight: 700;

    color: #fff;

    background: #228468;

    background: rgba(34,132,104,.8);

    display: inline;

    padding: 5px 15px 0;

    margin-bottom: 0;

    display: table;

    margin: 6px 0 2px !important;

	

}



.flexslider .aktion h3{



border: none;



    font-size: 30px;

    line-height: 120%;

    font-family: montserrat,Helvetica,Arial,sans-serif;

    font-weight: 700;

    color: #fff;

    background: #228468;

  background-color: #333;

    display: inline;

    padding: 5px 15px 0;

    margin-bottom: 0;

        display: table;

    margin: 6px 0 2px !important;

}





.flexslider .button {



    display: inline-block;

    max-width: 100%;

    transition: all .2s ease-out;

    box-shadow: 0 1px transparent;

    border: 1px solid #038387;

    cursor: pointer;

    display: inline-block;

    padding: .5em 1.5em;

    position: relative;

    text-decoration: none;

    -webkit-user-select: none;

    -moz-user-select: none;

    -ms-user-select: none;

    user-select: none;

    white-space: nowrap;

    background: #e44343;

    color: #fff;

    transition: background-color 125ms ease-out,border-color 125ms ease-out,color 125ms ease-out;



}



.flexslider .button a::before {

    content: "\f101";

    font: FontAwesome !important;

    font-style: normal;

    display: inline;

    font-size: 14px;

    position: relative;

    margin-right: 4px;

    display: inline-block;

    font: normal normal normal 14px/1 FontAwesome;

        font-size: 14px;

    font-size: 14px;

    font-size: inherit;

    text-rendering: auto;

}

*, ::before, ::after {

    box-sizing: border-box;

}

*, ::after, ::before {

    box-sizing: border-box;

}







.verlauf {

background: rgb(216,220,225);

background: linear-gradient(-45deg, rgba(216,220,225,1) 38%, rgba(220,144,151,1) 45%, rgba(227,6,19,1) 54%);



}







.frame-h2special h2 {font-weight: bold; text-transform: uppercase; color:#06508c;}



.frame-custom-20  .ce-textpic,

.bildbox .ce-textpic  {	background-color: #06508c;}



.frame-custom-20  .ce-textpic p,

.bildbox .ce-textpic p {color: #ffff; text-decoration: none;}

.frame-custom-20  .ce-textpic h3 a,

.bildbox .ce-textpic  h3 a,

.bildbox .ce-textpic  h3 {

    text-align: center;

    color: white !important; text-decoration: none;

}



.frame-custom-20  .ce-textpic a:hover,

.bildbox .ce-textpic a:hover {

	color: white;

	opacity: 0.8;

}





figcaption {

 /*background-image: url("images/beschriftung-koch-rot-01.svg");*/ 

bottom: 75% !important;

background-color: #e30613 !important;

		padding: 1% 2% !important;

	font-weight: 700;

	color: white !important;

text-transform: uppercase !important;

}



.frame-textbildentsorgung p {

	bottom: 54%;

    position: absolute;

    text-align: center;

    width: 46%;

    font-weight: 700;

    font-size: 35px !important;

    color: white;

    text-shadow: 0px 5px 10px black;

    text-transform: uppercase;

	height: 4%;

}



.frame-textbildtransporte p {

	bottom: 48%;

    position: absolute;

    text-align: center;

    width: 46%;

    font-weight: 700;

    font-size: 35px !important;

    color: white;

    text-shadow: 0px 5px 10px black;

    text-transform: uppercase;



	}



.frame-textbildcontainer p {

	bottom: 39%;

    position: absolute;

    text-align: center;

    width: 46%;

    font-weight: 700;

    font-size: 35px !important;

    color: white;

    text-shadow: 0px 5px 10px black;

    text-transform: uppercase;



	}



.frame-textbildbaustoffe p {

	bottom: 30%;

    position: absolute;

    text-align: center;

    width: 46%;

    font-weight: 700;

    font-size: 35px !important;

    color: white;

    text-shadow: 0px 5px 10px black;

    text-transform: uppercase;

	

}



/* PROBE CODES */

main .ce-gallery .image{

overflow: hidden;

}



main .bildhover .ce-gallery .image img {

 -webkit-transition: all 0.3s linear;

-moz-transition: all 0.3s linear;

-ms-transition: all 0.3s linear;

-o-transition: all 0.3s linear;

transition: all 0.3s linear;

}





/* [3] Finally, transforming the image when container gets hovered */

main .bildhover .ce-gallery .image:hover img {

  transform: scale(1.2);

}



i.fa-times.fas {

	color: #e30613;

}

i.fa-check.fas {

    color: #06508c;

}


