/* prefixed by https://autoprefixer.github.io (PostCSS: v7.0.26, autoprefixer: v9.7.3) */

/* prefixed by https://autoprefixer.github.io (PostCSS: v7.0.26, autoprefixer: v9.7.3) */

/* prefixed by https://autoprefixer.github.io (PostCSS: v7.0.26, autoprefixer: v9.7.3) */

/* Meine Schriften */

@font-face {
  font-family: 'oswald-700';
  src: url(../fonts/oswald-v17-latin/oswald-v17-latin-700.eot) format('eot'), url('../fonts/oswald-v17-latin/oswald-v17-latin-700.woff') format('woff'), url('../fonts/oswald-v17-latin/oswald-v17-latin-700.ttf') format('truetype');
}

@font-face {
  font-family: 'oswald-500';
  src: url('../fonts/oswald-v17-latin/oswald-v17-latin-500.eot') format('eot'), url('../fonts/oswald-v17-latin/oswald-v17-latin-500.woff') format('woff'), url('../fonts/oswald-v17-latin/oswald-v17-latin-500.ttf') format('truetype');
}

@font-face {
  font-family: 'oswald-400';
  src: url('../fonts/oswald-v17-latin/oswald-v17-latin-regular.eot') format('eot'), url('../fonts/oswald-v17-latin/oswald-v17-latin-regular.woff') format('woff'), url('../fonts/oswald-v17-latin/oswald-v17-latin-regular.ttf') format('truetype');
}

@font-face {
  font-family: 'open-sans-400';
  src: url('../fonts/open-sans-v16-latin/open-sans-v16-latin-regular.eot') format('eot'), url('../fonts/open-sans-v16-latin/open-sans-v16-latin-regular.woff') format('woff'), url(
  '../fonts/open-sans-v16-latin/open-sans-v16-latin-regular.ttf') format('truetype');
}

@font-face {
  font-family: 'open-sans-400';
  src: url('../fonts/open-sans-v16-latin/open-sans-v16-latin-regular.eot') format('eot'), url('../fonts/open-sans-v16-latin/open-sans-v16-latin-regular.woff') format('woff'), url(
  '../fonts/open-sans-v16-latin/open-sans-v16-latin-regular.ttf') format('truetype');
}

@font-face {
  font-family: 'open-sans-600';
  src: url('../fonts/open-sans-v16-latin/open-sans-v17-latin-600.eot') format('eot'), url('../fonts/open-sans-v16-latin/open-sans-v17-latin-600.woff') format('woff'), url('../fonts/open-sans-v16-latin/open-sans-v17-latin-600.ttf') format('truetype');
}


*{
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

body, html{
	width:100%;
	margin:0;
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	}

img{
	width:100%;
}



tr:nth-child(even) {
    background-color: #ededed;
}

table {
    border-collapse: separate;
    border-spacing: 2px;
    -webkit-border-horizontal-spacing: 2px;
    -webkit-border-vertical-spacing: 2px;
    width: 98%;
    border: 1px solid #ededed;


    font-weight: 400;

	font-size: 12px;
    border: 1px solid #CCC;
    font-family: Arial, Helvetica, sans-serif;
}

h1{
	font-family: 'oswald-700', sans-serif;
	font-weight: 700;
	font-size:3em;
	margin-bottom:5px;
	line-height:1.2em;

}

.h1_dek{
	font-size:6em;
	margin-block-end: 0em;
	line-height: 0.9;
	margin-block-start:0em;
}

h2{
	font-family: 'oswald-700', sans-serif;
	font-weight: 600;
	font-size:2.5em;
	line-height:1.2em;
}

h3{
	font-family: 'oswald-500', sans-serif;
	font-weight: 500;
	font-size: 1.5em;
	margin-bottom:0;
}

.h3{
	font-family: 'oswald-500', sans-serif;
	font-weight: 500;
	font-size: 1.5em;
}

.h2{
	font-family: 'oswald-700', sans-serif;
	font-weight: 600;
	font-size:2.5em;
	line-height:1.2em;
}

.h1{
	font-family: 'oswald-700', sans-serif;
	font-weight: 700;
	font-size:3em;
	margin-bottom:5px;
	line-height:1.2em;
}

p{
	font-family:'open-sans-400', sans-serif;
	font-weight:400;
	font-size:1.2em;
}

a:active{
	text-decoration: none;

}

a{
	color:#5a5a5a;
	text-decoration:none;
}

a:visited{
	text-decoration:none;
}
.hellgrau-back{
	background-color:#f1f1f1;
}

.rot-back{
	background-color:#cc0000;
}

.dunkelgrau-back{
	background-color:#5a5a5a;
}

.mittelgrau_back{
	background-color:#c5c5c5;
}

.weiss{
	color:#FFFFFF;
}

.dunkelgrau{
	color:#5a5a5a;
}

.hellgrau{
	color:#f1f1f1;
}

.rot{
	color:#cc0000;
}

.flex{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	display: -moz-box;
}

.flex-row{
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	    -ms-flex-direction: row;
	        flex-direction: row;
}

.flex-center{
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}

.flex-col{
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
    -ms-flex-direction: column;
        flex-direction: column;
}

.flex-between{
-webkit-box-pack: justify;
    -ms-flex-pack: justify;
        justify-content: space-between;
}

.flex-end{
-webkit-box-pack: end;
    -ms-flex-pack: end;
        justify-content: flex-end;
}

.flex-start{
	-webkit-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
}

.flex-align{

	-webkit-box-align: center;

	    -ms-flex-align: center;

	        align-items: center;
}

.gdi-row{
	width:100%;
	padding:50px;
	height:auto;
}

.row_plus{
	display:block;
	width:100%;
	height:auto;
}

.row_ohne{
	width:100%;
	height:auto;
}

.padding{
	padding-left:3%;
}

.col-4 {
	display: block;
	float:left;
	margin: 1% 0 1% 2%;
}
.col-4:first-child { margin-left: 0; }

.col-3 {
	display: block;
	float:left;
	margin: 1% 0 1% 2%;
}
.col-3:first-child { margin-left: 0; }

.col{
	margin-right:2%;
}
.col_ohne{
	margin-right:2%;
}

.col-button{
	margin-right:2%;
}

.col:first-of-type{
	margin-right:0;
}


.produkt-details .col:first-of-type{
	margin-right:2%;
}

.col-5 {
display: block;
	float:left;
	margin: 1% 0 1% 2%;
}

.col:last-of-type{
	margin-right:0;
}

.col-hor-2-3{
	height:66%;
}

.col-hor-1-3{
	height:32%;
}

.col-hor{
	margin-bottom: 2%;
}

.col-hor:last-of-type{
	margin-bottom: 0;
}

.col-md-3{
	position: relative;
    width: 100%;
	height: auto;
    overflow: hidden;
}

.col-md-12{
	position: relative;
    width: 100%;
	height:auto;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.gdi-max{
	max-width:80%;
	height:auto;
	margin:0 auto;
}

.gdi-text-max{
	max-width:74%;
	height:auto;
	margin:0 auto;
}

.gdi-max-suche{
	max-width:50%;
	height:auto;
	margin:0 auto;
}

.col-1-2{
	width:49%;
	height:auto;
	float:left;
}

.col-1-2-vollbreite{
	width:50%;
	height:auto;
	float:left;
}

.col-1-3{
	width: 32%;
	height: auto;
	float: left;
}

.col-1-3_produkt{
		width:32%;
	height:auto;
	float:left;
}

.col-1-3-ohne{
	width:33,3%;
	height:auto;
	float:left;
}

.col-2-3{
	width:66%;
	height:auto;
	float:left;
}

.col-3-3{
	width:98%;
	height:auto;
	float:left;
}

.col-2-3_produkt{
	width:66%;
	height:auto;
	float:left;
}

.col-2-3-new{
	height:auto;
	float:left;
}


.col-1-4{
	width: 23.5%;
	height:auto;
	float:left;
}

.col-1-7{
	width:12%;
	height:auto;
	float:left;
}

.col-1-6{
	width:15%;
	height:auto;
	float:left;
}


.produktion_start .col:first-of-type{
	margin-right:2%;
}

.text-center{
	text-align: center;
}

.text-left{
	text-align:left;
}


.gdi_button_rot{
	background-color: #cc0000;
	color:#ffffff;
	font-family: 'oswald-500';
	font-size: 1.3em;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 5px;
    padding-bottom: 7px;
	 -webkit-transition: all 0.5s;
     -o-transition: all 0.5s;
     transition: all 0.5s;
	border:none;
	outline: none;

}
.gdi_button_gruen{
	background-color: #25D366;
	color:#ffffff;
	font-family: 'oswald-500';
	font-size: 1.3em;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 5px;
    padding-bottom: 7px;
	 -webkit-transition: all 0.5s;
     -o-transition: all 0.5s;
     transition: all 0.5s;
	border:none;
	outline: none;

}
.gdi_button_rot:hover{
	color:#ffffff;
	background-color: #5a5a5a;
	border:solid thin #FFFFFF;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	        box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);

}


.info_sage_buttons a{
	 -webkit-transition: all 0.5s;
     -o-transition: all 0.5s;
     transition: all 0.5s;
}



.info_sage_buttons a:hover{
-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	        box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
}

.button_abstand{
	margin-top:2%;
}

.button_space{
	margin-top:5%;
	margin-bottom:6%;
}

.button_ersatzteile{
	background-color:#cc0000;
	color:#ffffff;
	padding:2%;
	font-family:'open-sans-600';
	font-size:1em;
	text-align: center;
}

.button_max{
    max-width: 75%;
    height: auto;
    margin-left: 14%;
}
.space{
	padding-top:2%;
	padding-bottom:2%;
}

section{
	width:100%;
	height:auto;
	padding-top:2%;
}

section::after{
	content:"";
	clear:both;
	display:table;
}

.section_ohne{
	padding-top:0;
}



a{
	cursor:pointer;
	text-decoration: none;
}

.grow{
	-webkit-transition: all .1s ease-in-out;
	-o-transition: all .1s ease-in-out;
	transition: all .1s ease-in-out;
}

.grow:hover{
	-webkit-transform: scale(1.1);
	    -ms-transform: scale(1.1);
	        transform: scale(1.1);
}

.grow_galerie{
	-webkit-transition: all .1s ease-in-out;
	-o-transition: all .1s ease-in-out;
	transition: all .1s ease-in-out;

}

.grow_galerie:hover{
	-webkit-transform: scale(1.1);
	    -ms-transform: scale(1.1);
	        transform: scale(1.1);
	cursor: pointer;
}



.grow2{
	 -webkit-transition: all 0.3s;
     -o-transition: all 0.3s;
     transition: all 0.3s;
}

.grow2:hover{
	-webkit-transform: scale(2.1);
	    -ms-transform: scale(2.1);
	        transform: scale(2.1);
}



.logo_head img{
	max-width:48%;
	height:auto;
}
.hidden {
	display: none;
}
.greetingweihnachtstyle {
            margin: 20px auto;
            padding: 20px;
            border: 2px solid #b22222;
            background-color: #ffffffdd;
            border-radius: 20px;
            
        }

nav{
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
}

.navigation{
	width:100%;
	height:auto;
	position: fixed;
    z-index: 9999;
	padding-right:50px;
	padding-left:50px;
	padding-top:10px;
	padding-bottom: 10px;
	background-color:#5a5a5a;
	font-family: 'oswald-400', sans-serif;
		font-weight: 400;
	font-size:1.2em;
		-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	        box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
}
/* Navigation start */

/* Add a black background color to the top navigation */
.topnav {
  background-color: #5a5a5a;
  overflow: hidden;
	height:63px;
}

/* Style the links inside the navigation bar */
.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 2px 16px;
  text-decoration: none;
  font-size: 1em;
		-webkit-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
	
}

/* Add an active class to highlight the current page */
.active {
  color: white;
}

/* Hide the link that should open and close the topnav on small screens */
.topnav .icon {
  display: none;
}


.gdi_button_rot:hover{
    color: #ffffff;
    background-color: #5a5a5a;
    border: solid thin #FFFFFF;
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
    text-align: right;
		

}


/* Dropdown container - needed to position the dropdown content */
.dropdown {
  float: left;
  overflow: hidden;
	  border: none;
  outline: none;
}

.dropdown_neu {
  float: left;
  overflow: hidden;
	  border: none;
  outline: none;
}


/* Style the dropdown button to fit inside the topnav */
.dropdown .dropbtn {
  font-size: 1em;
  border: none;
  outline: none;
  color: white;
  padding: 14px 16px;
  background-color: #5a5a5a;
  font-family: inherit;
  margin: 0;
}

.dropdown_neu .dropbtn_neu {
  font-size: 1em;
  border: none;
  outline: none;
  color: white;
  background-color: #5a5a5a;
  font-family: inherit;
  margin: 0;
}

/* Style the dropdown content (hidden by default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  -webkit-box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
          box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
font-family:'open-sans-400', sans-serif;
	font-weight:400;
	font-size: 0.7em;
  z-index: 1;
		-webkit-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
	top:40px;
}

/* Style the links inside the dropdown */
.dropdown-content a {
  float: none;
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}
/* Add a grey background to dropdown links on hover */
.dropdown-content a:hover {
    background-color: #ddd;
    color: #cc0000;
    font-weight: 400;
}
/* Style the dropdown content button (hidden by default) */
.dropdown-content_Button {
  display: none;
  position: relative;
  background-color: #f9f9f9;
  min-width: 160px;
  -webkit-box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
          box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
font-family:'open-sans-400', sans-serif;
	font-weight:400;
	font-size: 0.7em;
  z-index: 1;
		-webkit-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
	top: 10px;
}

/* Style the links inside the dropdown */
.dropdown-content_Button a {
  float: none;
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}
/* Add a grey background to dropdown links on hover */
.dropdown-content_Button a:hover {
    background-color: #ddd;
    color: #cc0000;
    font-weight: 400;
}
/* Show the dropdown menu when the user moves the mouse over the dropdown button */
.dropdown:hover .dropdown-content_Button {
  display: block;
}

.dropdown_neu:hover .dropdown-content_Button {
  display: block;
}
/* Navigation ende */
/* Add a dark background on topnav links and the dropdown button on hover */
.topnav a:hover, .dropdown:hover .dropbtn {
  color:#cc0000;
  cursor: pointer;
}



/* Show the dropdown menu when the user moves the mouse over the dropdown button */
.dropdown:hover .dropdown-content {
  display: block;
}

.dropdown_neu:hover .dropdown-content {
  display: block;
}
/* Navigation ende */


nav .gdi_button_rot{
	background-color: #cc0000;
	color:#ffffff;
	font-family: 'oswald-500';
	font-size: 0.8em;
    padding-left: 10px;
    padding-right: 10px;

	 -webkit-transition: all 0.5s;
     -o-transition: all 0.5s;
     transition: all 0.5s;
	border:none;
	outline: none;
}

.headgrafik img{
	width:100%;
	height:auto;
	z-index:2;
}


.subfooter{
	color:#f1f1f1;
}

.subfooter p{
	font-family: 'open-sans-400', sans-serif;
    font-weight: 400;
    font-size: 0.9em;
}

footer{
	background-color:#f1f1f1;
}

footer p{
	    font-family: 'open-sans-400', sans-serif;
    font-weight: 400;
    font-size: 0.9em;
	color:#5a5a5a;
	line-height: 1.4em;
}

.footer_logo img{
	max-width:60%;
	height:auto;
}

.anschrift a{
	text-decoration: none;
	color:#5a5a5a;
		-webkit-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
}

.anschrift a:hover{
	color:#cc0000;
}

.kurzlink a{
	text-decoration:none;
	color:#5a5a5a;
		-webkit-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
}

.kurzlink a:hover{
	color:#cc0000;
}
.kurzlink ul li{
	list-style-type: none;
	color:#5a5a5a;
}

.kurzlink{
	font-family: 'open-sans-400', sans-serif;
    font-weight: 400;
    font-size: 0.9em;
    color: #5a5a5a;
    line-height: 1.4em;
}


.bildbereich img{
	max-width: 250px;
	max-height:250px;
}

.text-bereich{
	height:auto;
	margin-top: 3%;
	color:#202020;
	max-width:250px;
}

.text-bereich h2{
    display: block;
    font-size: 1.5em;
    -webkit-margin-before: 0em;
            margin-block-start: 0em;
    -webkit-margin-after: 0em;
            margin-block-end: 0em;
    -webkit-margin-start: 0px;
            margin-inline-start: 0px;
    -webkit-margin-end: 0px;
            margin-inline-end: 0px;
    font-weight: bold;
	font-family: arial;
}
.text-bereich h9{
    display: block;
    font-size: 1.4em;
    -webkit-margin-before: 0em;
            margin-block-start: 0em;
    -webkit-margin-after: 0em;
            margin-block-end: 0em;
    -webkit-margin-start: 0px;
            margin-inline-start: 0px;
    -webkit-margin-end: 0px;
            margin-inline-end: 0px;
    font-weight: bold;
	font-family: arial;
}
.text-bereich p{
	-webkit-margin-before: 0.7em;
	        margin-block-start: 0.7em;
	font-family: arial;
}

.container {
    overflow: hidden;
    margin-right: 2%;
    margin-left: 2%;
}

.button_bereich{
	margin-bottom:3%;
}


.Kachel_bereich{
	margin-bottom:4%;
}

.filterDiv {
	height:auto;
  float: left;
  background-color: #E3E3E3;
  color: #ffffff;
  text-align: center;
  margin: 2px;
  padding:1%;
  padding-bottom:0%;
  display: none; /* Hidden by default */
}

#test{
	background-color: #ffffff;
}

/* The "show" class is added to the filtered elements */
.show {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.show_test {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}


/* Style the buttons */
.btn {
  border: none;
  outline: none;
  padding: 12px 16px;
  background-color: #cc0000;
  cursor: pointer;
  font-family:'oswald-500';
  font-size:1em;
  margin-top:2%;
  letter-spacing: 0.07em;
  color:#ffffff;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;

}
.btn-input {
  border: 2px solid black;
  outline: none;
  padding: 10px 12px 6px 6px;
  background-color: #ffffff;
  cursor: text;
  font-family:'oswald-500';
  font-size:1em;
  margin-top:1%;
	margin-right:1%;
	margin-left:2%;
  letter-spacing: 0.2em;
  color:#000000;


}

/* Add a light grey background on mouse-over */
.btn:hover {
  background-color: #ddd;
	color:#000000;
}

/* Add a dark background to the active button */
.btn.active {
  background-color: #666;
  color: white;
}

.headbereich{
    margin-top: 2%;
    margin-bottom: 5%;
}


.block_suche{
      padding-left: 1em;
    line-height: 2em;
    max-width: 62%;

	margin-right:2%;
    background-color: #f1f1f1;
    border: none;
	  }
.button_suche{
	 line-height: 2em;
	 background-color: #f1f1f1;
     border: none;
	 -webkit-transition: all 0.5s;
     -o-transition: all 0.5s;
     transition: all 0.5s;
	 color:#5a5a5a;
}

.button_suche:hover{
	background-color: #cc0000;
	color:#ffffff;
	cursor: pointer;
	  }
.suchmaschine{
	margin-bottom:5%;
}

.desaturate {
    filter: grayscale(100%); /* Standard */
    -webkit-filter: grayscale(100%); /* Webkit */
    filter: url(/elements/grayscale.svg#desaturate); /* Firefox 4-34 */
    filter: gray;  /* IE6-9 */
    -webkit-filter: grayscale(1); /* Old WebKit */
}

.icon_bereich img{
	margin-right:3%;
}

.icon_bereich a{
	text-decoration: none;
	color:#ffffff;
	 -webkit-transition: all 0.5s;
     -o-transition: all 0.5s;
     transition: all 0.5s;
}

.icon_bereich a:hover{
	color:#ff0000;
}

.icons{
	margin-top:2%;
}

.icon_home{
	width:1.5%;
}

.icon_phone{
	width: 1.5%;
}

/* Übergangs Footer */

.footer_uebergang ul li{
	list-style-type: none;
	display:inline;
}

.footer_uebergang ul{
	-webkit-padding-start: 26px;
	        padding-inline-start: 26px;
}

.footer_uebergang li{
	color:#5a5a5a;
	-webkit-transition: all 0.4s;
	-o-transition: all 0.4s;
	transition: all 0.4s;
}

.footer_uebergang{
	background-color: #ffffff;
}

.footer_uebergang a{
	text-decoration: none;
	color:#5a5a5a;
	font-family: arial;
	font-size: 0.8em;
	font-weight: 400;
	margin-right:10px;
	margin-left: 10px;
	-webkit-transition: all 0.4s;
	-o-transition: all 0.4s;
	transition: all 0.4s;

}

.footer_uebergang a:hover{
	color:#FF0000;
}

.footer_uebergang li:hover{
	color:#FF0000;
}

.footer_uebergang a:first-of-type{
	margin-left:0px;
}

.footer_uebergang:last-of-type{
	margin-right:0px;
}

.kontakt_teaser_image img{
	width: 100%;
	height:auto;
}

.kontakt_teaser_image{
	margin-right: 3%;
}

.impressum{
	margin-bottom:5%;
}

.impressum a:hover{
	color:#cc0000;
}

.datenschutz a:hover{
	color:#cc0000;
}


/* slideshow start */
.mySlides {display:none;}


.w3-button{
border:none;
display:inline-block;
padding:8px 16px;
vertical-align:middle;
overflow:hidden;
text-decoration:none;
color:inherit;
background-color:inherit;
text-align:center;
cursor:pointer;
white-space:nowrap
}

.w3-button{
-webkit-touch-callout:none;
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none
}

.w3-button:disabled{cursor:not-allowed;opacity:0.3}

.w3-button:first-child,.w3-dropdown-click:hover

.w3-button{
width:100%;
text-align:left;
padding:8px 16px
}

.w3-button{
white-space:normal
}

.w3-display-left{
position:absolute;
top:35%;
left:0%;
-webkit-transform:translate(0%,-50%);
        transform:translate(0%,-50%);
-ms-transform:translate(-0%,-50%)
}

.w3-black,.w3-hover-black:hover{
color:#000000!important;
background-color:#FFFFFF}

.w3-display-right{
position:absolute;
top:35%;
right:0%;
-webkit-transform:translate(0%,-50%);
        transform:translate(0%,-50%);
-ms-transform:translate(0%,-50%)}

.w3-content,.w3-auto{
margin-left:auto;
margin-right:auto}

/* Sideshow end */

/* Direkteinstieg start */

.grid {

	list-style: none;
	text-align: center;
}

/* Common style */
.grid figure {
	position: relative;
	float: left;
	overflow: hidden;
	margin: 10px 1%;
	min-width: 320px;
	max-width: 480px;
	max-height: 360px;
	width: 48%;
	text-align: center;
	cursor: pointer;
}

.grid figure img {
	position: relative;
	display: block;
	min-height: 100%;
	max-width: 100%;
}

.grid figure figcaption {
	padding: 2em;
	color: #fff;
	text-transform: uppercase;
	font-size: 1.25em;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
	pointer-events: none;
}

.grid figure figcaption,
.grid figure figcaption > a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* Anchor will cover the whole item by default */
.grid figure figcaption > a {
	z-index: 1000;
	text-indent: 200%;
	white-space: nowrap;
	font-size: 0;
	opacity: 0;
}

.grid figure h2 {
	font-size:1.5em;
	color:#ffffff;
}

.grid figure h2 span {
	font-weight: 800;
}

.grid figure h2,
.grid figure p {
	margin: 0;
}

.grid figure p {
	letter-spacing: 1px;
	font-size: 68.5%;
}

figure.effect-sadie figcaption::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: -o-linear-gradient(top, rgba(204,0,0,1) 0%, rgba(204,0,0,0.8) 75%);
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(204,0,0,1)), color-stop(75%, rgba(204,0,0,0.8)));
	background: linear-gradient(to bottom, rgba(204,0,0,1) 0%, rgba(204,0,0,0.8) 75%);
	content: '';
	opacity: 0;
	-webkit-transform: translate3d(0,50%,0);
	transform: translate3d(0,50%,0);
}

figure.effect-sadie h2 {
	position: absolute;
	letter-spacing: 0.05em;
	top: 50%;
	left: 0;
	width: 100%;
	color: #ffffff;
	background-color: #5a5a5a;
	padding-top: 5px;
	padding-bottom:5px;
	-webkit-transition: -webkit-transform 0.35s, color 0.35s;
	-webkit-transition: color 0.35s, -webkit-transform 0.35s;
	transition: color 0.35s, -webkit-transform 0.35s;
	-o-transition: transform 0.35s, color 0.35s;
	transition: transform 0.35s, color 0.35s;
	transition: transform 0.35s, color 0.35s, -webkit-transform 0.35s;
	-webkit-transform: translate3d(0,-50%,0);
	transform: translate3d(0,-50%,0);
}

figure.effect-sadie figcaption::before,
figure.effect-sadie p {
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, -webkit-transform 0.35s;
	-o-transition: opacity 0.35s, transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	transition: opacity 0.35s, transform 0.35s, -webkit-transform 0.35s;
}

figure.effect-sadie p {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 2em;
	width: 100%;
	opacity: 0;
	-webkit-transform: translate3d(0,10px,0);
	transform: translate3d(0,10px,0);
}

figure.effect-sadie:hover h2 {
	color: #fff;
	-webkit-transform: translate3d(0,-50%,0) translate3d(0,-40px,0);
	transform: translate3d(0,-50%,0) translate3d(0,-40px,0);
}

figure.effect-sadie:hover figcaption::before ,
figure.effect-sadie:hover p {
	opacity: 1;
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

.shadow_2{
	-webkit-box-shadow: 3px 2px 9px grey;
	        box-shadow: 3px 2px 9px grey;
}

figure.effect-sadie{
	-webkit-transition: all 0.4s;
	-o-transition: all 0.4s;
	transition: all 0.4s;
}

/*Direkteinstieg ende */

/* Product carousel start */

 .slider {
        width: 50%;
        margin: 100px auto;
    }

    .slick-slide {
      margin: 0px 20px;
    }

    .slick-slide img {
      width: 100%;
    }

    .slick-prev:before,
    .slick-next:before {
      color: black;
    }


    .slick-slide {
      -webkit-transition: all ease-in-out .3s;
      -o-transition: all ease-in-out .3s;
      transition: all ease-in-out .3s;
      opacity: .2;
    }

    .slick-active {
      opacity: .5;
    }

    .slick-current {
      opacity: 1;
    }

.produkt_caousel p{
	font-size: 0.9em;
}

/* Product carousel end */

.startseite_info_text{
	padding-left:5%;
}

.infobereich{
	margin-bottom:5%;
}

.infobereich ul li{
	list-style-type: none;
	font-family: 'oswald-700';
	font-size:1.4em;
	color:#5a5a5a;
	line-height: 2em;
}

.infobereich ul{
	-webkit-padding-start: 0px;
	        padding-inline-start: 0px;
}

.startseite_vorteile{
	padding-left:5%;
}

/* Neuigkeiten start */

.neuigkeiten{
	background-image: url("../GDI-Dateien/startseite/gdi_herdecke_stqartseite_neuigkeitenteaser.jpg");
	max-width:100%;
	height:auto;
	padding-bottom:3%;
}

figure.effect-selena {
	background: #cc0000;
	-webkit-transition: all 0.4s;
	-o-transition: all 0.4s;
	transition: all 0.4s;
}

figure.effect-selena img {
	opacity: 0.95;
	-webkit-transition: -webkit-transform 0.35s;
	transition: -webkit-transform 0.35s;
	-o-transition: transform 0.35s;
	transition: transform 0.35s;
	transition: transform 0.35s, -webkit-transform 0.35s;
	-webkit-transform-origin: 50% 50%;
	-ms-transform-origin: 50% 50%;
	    transform-origin: 50% 50%;
}

figure.effect-selena:hover img {
	-webkit-transform: scale3d(0.95,0.95,1);
	transform: scale3d(0.95,0.95,1);
}

figure.effect-selena h2 {
	-webkit-transition: -webkit-transform 0.35s;
	transition: -webkit-transform 0.35s;
	-o-transition: transform 0.35s;
	transition: transform 0.35s;
	transition: transform 0.35s, -webkit-transform 0.35s;
	-webkit-transform: translate3d(0,20px,0);
	transform: translate3d(0,20px,0);
}

figure.effect-selena p {
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, -webkit-transform 0.35s;
	-o-transition: opacity 0.35s, transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	transition: opacity 0.35s, transform 0.35s, -webkit-transform 0.35s;
	-webkit-transform: perspective(1000px) rotate3d(1,0,0,90deg);
	transform: perspective(1000px) rotate3d(1,0,0,90deg);
	-webkit-transform-origin: 50% 0%;
	-ms-transform-origin: 50% 0%;
	    transform-origin: 50% 0%;
}

figure.effect-selena:hover h2 {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

figure.effect-selena:hover p {
	opacity: 1;
	-webkit-transform: perspective(1000px) rotate3d(1,0,0,0);
	transform: perspective(1000px) rotate3d(1,0,0,0);
}

.shadow_1{
	-webkit-box-shadow: 3px 2px 22px black;
	        box-shadow: 3px 2px 22px black;
}

/* Neuigkeiten ende */

/* Produktseite */

.produktbereich{
	margin-bottom:5%;
}

.produktbereich h2{
	line-height: 0.2em;
}

.produkt_bereich_logo img{
	max-width:100%;
	height:auto;
}

.produktbereich_buttonbereich {
	margin-bottom: 6%;
}

hr {
	width:80%;
	align:center;
}

.technische_daten{
	padding-bottom:2%;
}

.technische_daten ul li{
	list-style-type: none;
	font-family:'open-sans-400';
	font-size: 1.2em;
	line-height:1.6em;
	color:#5a5a5a;
}

.technische_daten ul{
	-webkit-padding-start: 0px;
	        padding-inline-start: 0px;
}



.einsatzbereich p{
	color:#5a5a5a;
	line-height: 1.6em;
}

.technische_daten a:hover{
	color:#cc0000;
}

.technische_daten a{
	-webkit-transition: all 0.5s;
     -o-transition: all 0.5s;
     transition: all 0.5s;
}

.accordion {
  background-color: #5a5a5a;
  color: #ffffff;
  cursor: pointer;
  padding-left:15%;
  padding-right:17%;
padding-top:18px;
	padding-bottom:18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
  -webkit-transition: 0.4s;
  -o-transition: 0.4s;
  transition: 0.4s;
}

.accordion h3{
	-webkit-margin-before: 0em;
	        margin-block-start: 0em;
}


.panel {
  padding: 0 18px;
  display: none;
  background-color: white;
  overflow: hidden;
}

/* Produktslider */

.w3-container:after,.w3-container:before,.w3-panel:after,.w3-panel:before,.w3-row:after,.w3-row:before,.w3-row-padding:after,.w3-row-padding:before,
.w3-cell-row:before,.w3-cell-row:after,.w3-clear:after,.w3-clear:before,.w3-bar:before,.w3-bar:after{content:"";display:table;clear:both}

.w3-container,.w3-panel{padding:0.01em 16px}.w3-panel{margin-top:16px;margin-bottom:16px}

.w3-content,.w3-auto{margin-left:auto;margin-right:auto}

/* .w3-content_produkt{max-width:980px} */

.w3-auto{max-width:1140px}

.w3-row-padding,.w3-row-padding>.w3-half,.w3-row-padding>.w3-third,.w3-row-padding>.w3-twothird,.w3-row-padding>.w3-threequarter,.w3-row-padding>.w3-quarter,.w3-row-padding>.w3-col{padding:0 8px}

.w3-section,.w3-code{margin-top:16px!important;margin-bottom:16px!important}

.w3-col,.w3-half,.w3-third,.w3-twothird,.w3-threequarter,.w3-quarter{float:left;width:100%}
.w3-col.s1{width:8.33333%}.w3-col.s2{width:16.66666%}.w3-col.s3{width:24.99999%}.w3-col.s4{width:33.33333%}
.w3-col.s5{width:41.66666%}.w3-col.s6{width:49.99999%}.w3-col.s7{width:58.33333%}.w3-col.s8{width:66.66666%}
.w3-col.s9{width:74.99999%}.w3-col.s10{width:83.33333%}.w3-col.s11{width:91.66666%}.w3-col.s12{width:99.99999%}

.w3-col{padding:0 8px}

.s4{width:33.33333%}

.w3-opacity,.w3-hover-opacity:hover{opacity:0.60}.w3-opacity-off,.w3-hover-opacity-off:hover{opacity:1}
.w3-opacity-max{opacity:0.25}.w3-opacity-min{opacity:0.75}

.w3-hover-opacity-off:hover{opacity:1}

.infobereich imd{
	width:100%;
		height:auto;
}

/* animation */

.fadescroll{
	-webkit-transition: all 400ms;
	-o-transition: all 400ms;
	transition: all 400ms;
	opacity: 0;
}

.fade{
	opacity: 1;
}

/* kontaktseite */

.kontakt-box-grau{
	text-align: center;
	padding:2%;
	margin-right:2%;
}

.kontakt-box-grau a{
	color:#000000;
	 -webkit-transition: all 0.5s;
     -o-transition: all 0.5s;
     transition: all 0.5s;
}

.kontakt-box-grau a:hover{
	color:#cc0000;
}

.kontakt_socialmedia img{
    max-width:50%;
		 -webkit-transition: all 0.5s;
     -o-transition: all 0.5s;
     transition: all 0.5s;
}

.kontakt_socialmedia img:hover{
   -webkit-box-shadow: 3px 2px 9px grey;
	        box-shadow: 3px 2px 9px grey;
	border-radius: 100px;
	cursor: pointer;
}



.socialmedia-box-grau{
	max-width:50%;
}

.anker_technische_daten{
	visibility: hidden;
	height: 0px !important;
	position: absolute;
	margin: -100px;
}

/*Aktionsseite*/

.aktion_text_bereich{
	padding:3%;
}

.aktion_wandsafe h3{
	-webkit-margin-before: 0em;
	        margin-block-start: 0em;
}


/*parallaxeffekt*/

.parallax {
  /* The image used */
  background-image: url('../GDI-Dateien/aktionen/gdi_herdecke_aktionsseite_teaser.jpg');

  /* Set a specific height */
  min-height: 500px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.zubehoer_ueberschrift{
	padding-bottom:1%;
	padding-top:1%;
}

.zubehoer_ueberschrift h3{
	-webkit-margin-before: 0em;
	        margin-block-start: 0em;
}

.produktseite_abstand{
	margin-top:1%;
	margin-bottom:1%;
}

.produkt_uebersicht{
	margin-top:5%;
	margin-bottom:5%;
}

.anfas_einleitung ul li{
	list-style-type: none;
	font-family: 'open-sans-600';
	font-weight: 400;
    font-size: 1.2em;
}

/* Medien start */

.row > .column {
  padding: 0 8px;
}

.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Create four equal columns that floats next to eachother */
.column {
  float: left;
  width: 25%;
}

/* The Modal (background) */
.modal {
  display: none;
  position: fixed;
  z-index: 9999;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: black;
}

/* Modal Content */
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  width: 90%;
  max-width: 1200px;
}

/* The Close Button */
.close {
  color: white;
  position: absolute;
  top: 10px;
  right: 25px;
  font-size: 35px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #999;
  text-decoration: none;
  cursor: pointer;
}

/* Hide the slides by default */
.mySlides_galerie {
  display: none;
}

/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  -webkit-transition: 0.6s ease;
  -o-transition: 0.6s ease;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  -moz-user-select: none;
   -ms-user-select: none;
       user-select: none;
  -webkit-user-select: none;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
  background-color: rgba(0, 0, 0, 0.8);
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* Caption text */
.caption-container {
  text-align: center;
  background-color: black;
  padding: 2px 16px;
  color: white;
}

img.demo_galaerie {
  opacity: 0.6;
}
.active,
.demo_galaerie:hover {
  opacity: 1;
}

img.hover-shadow {
  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
}

.hover-shadow:hover {
  -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
          box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  cursor: pointer;
}


/* Medien ende */

/* ueber uns start */

.icon{
	padding:7%;
}

.infoblock{
	padding:3%;
}

.gdi-text-max-icon {
    max-width: 50%;
    margin: 0 auto;
	}

/* ueber uns ende */


/* Register-menü*/

/* Tabs mit radio-Buttons */
.tabbed figure {
   display: block;
   margin-left: 0;
   clear: both;
}

.tabbed > input,
.tabbed figure > div { display: none; }

.tabbed figure>div {
  padding: 20px;
  width: 100%;
  background: #e3e3e3;
  line-height: 1.5em;
  letter-spacing: 0.3px;
  color: #444;
font-family:'open-sans-400';
}

#tab1:checked ~ figure .tab1,
#tab2:checked ~ figure .tab2,
#tab3:checked ~ figure .tab3,
#tab4:checked ~ figure .tab4 { display: block; }

nav label {
   float: left;
   padding: 15px 15px;
   background:#5a5a5a;
   color: #eee;
   font-family:'oswald-700';
margin-right:1%;
}


nav label:nth-child(1) { border-left: 1px solid silver; }
nav label:hover {background: #cc0000;cursor:pointer;}
nav label:active { background: #ffffff; }

#tab1:checked ~ nav label[for="tab1"],
#tab2:checked ~ nav label[for="tab2"],
#tab3:checked ~ nav label[for="tab3"],
#tab4:checked ~ nav label[for="tab4"]{
    background: #cc0000;
    color: #ffffff;
  position: relative;
  border-bottom: none;
	border-left: none;
}

#tab1:checked ~ nav label[for="tab1"]:after,
#tab2:checked ~ nav label[for="tab2"]:after,
#tab3:checked ~ nav label[for="tab3"]:after,
#tab4:checked ~ nav label[for="tab4"]:after{
  content: "";
  display: block;
  position: absolute;
  height: 2px;
  width: 100%;
  background: white;
  left: 0;
  bottom: -1px;
}


.produkt_bereich_beschreibung ul li{
	list-style-type:none;
	font-family: 'open-sans-400';

}

.produkt_bereich_beschreibung ul{
	-webkit-padding-start: 0px;
	        padding-inline-start: 0px;
}
.trennung{
	border: solid grey thin;
}


.margin_button_abstand{
	margin-right:2%;
}


/*Videobereich start*/

#fade{
  display: none;
  position: fixed;
  top: 0%;
  left: 0%;
  width: 100%;
  height: 100%;
  background-color: black;
  z-index: 1001;
  -moz-opacity: 0.8;
  opacity: .80;
  filter: alpha(opacity=80);
}

#light {
  display: none;
  position: absolute;
  max-width: 600px;
  max-height: 360px;
  margin-left: -350%;
  margin-top: -300%;
  border: 2px solid #FFF;
  background: #FFF;
  z-index: 1002;
  overflow: visible;
}

#boxclose {
  float: right;
  cursor: pointer;
  color: #fff;
  border: 1px solid #AEAEAE;
  border-radius: 3px;
  background: #222222;
  font-size: 31px;
  font-weight: bold;
  display: inline-block;
  line-height: 0px;
  padding: 11px 3px;
  position: absolute;
  right: 2px;
  top: 2px;
  z-index: 1002;
  opacity: 0.9;
}

.boxclose:before {
  content: "×";
}

#fade:hover ~ #boxclose {
  display:none;
}

.test:hover ~ .test2 {
  display: none;
}
/*Videobereich ende*/
img.zoom {
 transition: transform 0.5s;
 -moz-transition: transform 0.5s;
 -webkit-transition: transform 0.5s;
 -o-transition: transform 0.5s;
 -ms-transition: transform 0.5s;
}
img.zoom:hover {
 cursor: zoom-in;
 cursor: -moz-zoom-in;
 cursor: -webkit-zoom-in;
 transform: scale(20em,0);
 -moz-transform: scale(3.0, 3.0);
 -webkit-transform: scale(3.0, 3.0);
 -o-transform: scale(3.0, 3.0);
 -ms-transform: scale(3.0, 3.0);
}

.zoom_abstand{
	margin-right:3%;
}

.tab4 a:hover{
	color:#cc0000;
}

.tab4 a{
	color:#444444;
}





#socialmedia img{
	width:10%;


	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
}



#socialmedia img:hover{
-webkit-transform: scale(1.2);
	-moz-transform: scale(1.2);
	-ms-transform: scale(1.2);
	-o-transform: scale(1.2);
	transform: scale(1.2);

	-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
	        box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);

}


.social_elements a:first-child{
	margin-left:20px;
}


/* Pop up video start*/

.overlay_pop{
  position: fixed;
  z-index:8888;
  top: -33px;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  transition: opacity 500ms;
  visibility: hidden;
  opacity: 0;
}
.overlay_pop:target {
  visibility: visible;
  opacity: 1;
}

.popup{
  margin: 200px auto;
  padding: 50px;
  background: #eae5e6;
  border-radius: 5px;
  width: 50%;
  position: relative;

}

.popup_partner{
  margin: 200px auto;
  padding: 50px;
  background: #eae5e6;
  border-radius: 5px;
  width: 30%;
  position: relative;

}

.popup .close {
  position: absolute;
  top: 13px;
  right: 30px;
  transition: all 200ms;
  font-size: 40px;
  font-weight: bold;
  text-decoration: none;
  color: #333;
}
.popup .close:hover {
  color: #06D85F;
}
.popup .content {
  max-height: 30%;
  overflow: auto;
}


.video-frame{
  overflow: hidden;
  margin-bottom: 10px;
}


.content{
	display: flex;
    justify-content: center;
}

button{
  border: none;
  background-color: #e75252;
  color: #ffffff;
  padding: 10px 15px;
  border-radius: 3px;
  cursor: pointer;
}
button:focus{
  outline: 0;
}


#stop{
  background-color: #ff0002;
}


.parallax_storie1{
  /* The image used */
  background-image: url("../GDI-Dateien/aktionen/gdi_herdecke_aktion_einstiegsbild.png");
  /* Set a specific height */
  min-height: 500px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}



.parallax_saegetipp{
  /* The image used */
  background-image: url("../GDI-Dateien/saegetipp/gdi_herdecke_saegetipp_parallax.jpg");
  /* Set a specific height */
  min-height: 300px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
/* Slideshow container */
.slideshow-container2 {
  max-width: 1000px;
  position: relative;
  margin: auto;
}

/* Hide the images by default */
.mySlides2 {
  display: none;
}

/* Next & previous buttons */
.prev2, .next2 {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
  user-select: none;
}

/* Position the "next button" to the right */
.next2 {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev2:hover, .next2:hover {
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text2 {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext2 {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot2 {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active2, .dot2:hover {
  background-color: #717171;
}

/* Fading animation */
.fade2 {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

.col-border{
	border-color:grey;
	border-style:solid;
	border-width:1px;
}

.info_saegetipp ul li{
	font-family:'open-sans-400', sans-serif;
	font-weight:400;
	font-size:1.2em;
}

.info_saegetipp table tr td{
	font-family:'open-sans-400', sans-serif;
	font-weight:400;
	font-size:1.2em;
}

.info_saegetipp table{
	width: 600px;
}

.info_saegetipp h2{
	    margin-block-start: 0em;
}


.info_saegetipp tr:nth-child(even) {
    background-color: #ededed;
}

.info_saegetipp tr{
    background-color: #FFFFFF;
}

.info_margin{
	margin-top: 2%;
	padding-bottom:2%;
}

.sprung {visibility: hidden; height: 0px !important; position: absolute; margin: -100px;}

.parallax_produktion1 {
  /* The image used */
  background-image: url('../GDI-Dateien/fussbodenfraese_story/gdi_herdecke_produktion_parallax.jpg');

  /* Set a specific height */
  min-height: 500px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.produkt-informationen table{
	    font-family: 'open-sans-400', sans-serif;
    font-weight: 400;
    font-size: 1.2em;
}

.produkt-informationen{
	margin-bottom:5%;
}

.kernbohrtipp-liste ul li{
font-family:'open-sans-400', sans-serif;
	font-weight:400;
	font-size:1.2em;
	list-style: none;
}

.tipp-bereich .col:first-of-type {
    margin-right: 2%;
}

.kernbohrtipp-tabelle table td{
	font-family:'open-sans-400', sans-serif;
	font-weight:400;
	font-size:1.2em;
	padding:1%;
}

.kernbohrtipp-tabelle table th{
	font-family:'open-sans-400', sans-serif;
	font-weight:400;
	font-size:1.2em;
	padding:1%;
}

.problemloesungen h2{
	margin-block-start: 0;
}

.vollbohrtechnik-liste ul li{
	font-family:'open-sans-400', sans-serif;
	font-weight:400;
	font-size:1.2em;
}

.schraenk .col:first-of-type{
	margin-right: 2%;
}

@-webkit-keyframes fade2 {
  from {opacity: .4}
  to {opacity: 1}
}

@keyframes fade2 {
  from {opacity: .4}
  to {opacity: 1}
}


@media screen and (max-width: 300px) {

	#artikel_resp{
		display:none;
	}

}



@media screen and (max-width: 2300px) {

	#artikel_resp{
		display:none;
	}
}

@media screen and (max-width: 1785px) {
	.headgrafik_schmal img{
		margin-top:7%;
	}
}

@media screen and (max-width: 1400px) {

	.responsive_infobereich{
		display:block;
		width:100%;
		height:auto;
	}

	.produktbereich_res_t{
		display:block;
		width:100%;
		height:auto;
	}

		.container{
		display:block;
		width:100%;
		height:auto;
	}
}


@media screen and (max-width: 1360px) {

	.responsive_direkteinstieg{
		display:block;
		width:100%;
		height:auto;
	}

	.responsive_center{
		margin-left: auto;
        margin-right: auto;

	}

	.gdi-max-resp{
		max-width: 74%;
    margin: 0 auto;
	}
}


/* When the screen is less than 600 pixels wide, hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */
@media screen and (max-width: 1300px) {
  .topnav a, .dropdown .dropbtn {
    display: none;
  }

	.dropdown_neu{
		display:none;
	}

  .topnav a.icon {
    float: right;
    display: block;
  }
}

/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 1300px) {
  .topnav.responsive {position: relative;}
  .topnav.responsive a.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  .topnav.responsive .dropdown {float: none;}
  .topnav.responsive .dropdown-content {position: relative;}
  .topnav.responsive .dropdown .dropbtn {
    display: block;
    width: 100%;
    text-align: left;
  }

	.dropdown_neu{
		float:none;
	}

	.dropdown_neu .drop_neu a {
		   display: block;
    width: 100%;
    text-align: left;
	}

}

@media screen and (max-width: 1200px) {
	.headgrafik_schmal img{
		margin-top:10%;
	}
}




@media screen and (max-width: 1100px) {
	.headgrafik_schmal img{
		margin-top:8%;
	}

	.col-2-3_produkt{
	display:block;
	width:100%;
	height:auto;
	float:left;
}
		.col-1-3_produkt{
	display:block;
	width:100%;
	height:auto;
	float:left;
}
}


@media screen and (max-width: 1000px) {

	.responsive_neuheit{
		display:block;
		width: 100%;
		height: auto;
	}

		.suche_resp{
		display:none;
	}
}

@media (min-width:993px){.w3-col.l1{width:8.33333%}.w3-col.l2{width:16.66666%}.w3-col.l3{width:24.99999%}.w3-col.l4{width:33.33333%}
.w3-col.l5{width:41.66666%}.w3-col.l6{width:49.99999%}.w3-col.l7{width:58.33333%}.w3-col.l8{width:66.66666%}
.w3-col.l9{width:74.99999%}.w3-col.l10{width:83.33333%}.w3-col.l11{width:91.66666%}.w3-col.l12{width:99.99999%}}


@media (min-width:993px){.w3-modal-content{width:900px}.w3-hide-large{display:none!important}.w3-sidebar.w3-collapse{display:block!important}}
@media (max-width:992px) and (min-width:601px){.w3-hide-medium{display:none!important}}
@media (max-width:992px){.w3-sidebar.w3-collapse{display:none}.w3-main{margin-left:0!important;margin-right:0!important}.w3-auto{max-width:100%}}


/* Übergangs Footer Ende */

@media screen and (max-width: 800px){

	.responsive{
		display:block;
		width:100%;
		height: auto;
	}
	.row{
		display:block;
	}

	.kontakt_teaser_image img {
    max-width: 100%;
    height: auto;
}
	.space{
		padding-left:15%;
	}

	.kontakt-box-grau{
		margin-bottom:3%;
	}

	.socialmedia-box-grau {
		max-width:100%;
		display:block;
	}

	.social_icon img{
		max-width: 14%;
	}

	.produkt_caousel {
		display:none;
	}

	.text-bereich {
    height: auto;
    margin-top: 3%;
    color: #202020;
}

	textarea{
		width:70%;
	}

}

@media screen and (max-width: 700px){

	.button_resp_produkt{
		display: block;
	}


}




@media screen and (max-width: 690px) {
.produktbereich h2 {
    line-height: 1.2em;
}
}


@media screen and (max-width: 650px) {
	.headgrafik_schmal img{
		margin-top:11%;
	}

	.w3-button{
	 width:100%
	 }

	.startseite_einstieg h1{
		font-size: 2em;
	}

	.block_suche{
		max-width: 36%;
	}
}

@media (min-width:601px){.w3-col.m1{width:8.33333%}.w3-col.m2{width:16.66666%}.w3-col.m3,.w3-quarter{width:24.99999%}.w3-col.m4,.w3-third{width:33.33333%}
.w3-col.m5{width:41.66666%}.w3-col.m6,.w3-half{width:49.99999%}.w3-col.m7{width:58.33333%}.w3-col.m8,.w3-twothird{width:66.66666%}
.w3-col.m9,.w3-threequarter{width:74.99999%}.w3-col.m10{width:83.33333%}.w3-col.m11{width:91.66666%}.w3-col.m12{width:99.99999%}}


@media screen and (max-width: 600px) {

	.topnav{
		overflow:inerhit;
	}

	.social_elements{
		display:none;
	}

	.navigation{
		padding-right: 0px;
		padding-left:0px;
	}

	.hartmetall h2{
		font-size:1.5em;
	}

	.table-scrollable {
  width: 100%;
  overflow-y: auto;
  margin: 0 0 1em;
}

.table-scrollable::-webkit-scrollbar {
  -webkit-appearance: none;
  max-width: 100%;
  height: 14px;
}

.table-scrollable::-webkit-scrollbar-thumb {
  border-radius: 8px;
  border: 3px solid #fff;
  background-color: rgba(0, 0, 0, .3);
}

}


@media screen and (max-width: 450px){

	.gdi_button_rot{
		font-size:1em;
	}

	.logo_head img {
    max-width: 100%;
    height: auto;
}
	h1{
		font-size:2.5em;
	}

	.ueberschrift-resp h1{
	font-size:	1.8em;
	}

}

@media screen and (max-width: 400px) {
	.headgrafik_schmal img{
		margin-top:21%;
	}
}

@media screen and (max-width: 360px) {


	.dropdown-content {
    display: none;
    /* position: absolute; */
    background-color: #f9f9f9;
    min-width: 160px;
    -webkit-box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    font-family: 'open-sans-400', sans-serif;
    font-weight: 400;
    font-size: 0.7em;
    z-index: 1;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
}

	#light {
    display: none;
    position: absolute;
    max-width: 600px;
    max-height: 360px;
    margin-left: -39%;
    top: 46%;
    border: 2px solid #FFF;
    background: #FFF;
    z-index: 1002;
    overflow: visible;
}

	.smart_neuheit .grid figure {
    position: relative;
    float: left;
    overflow: hidden;
    margin: 10px 1%;
    /* min-width: 320px; */
    /* max-width: 480px; */
    /* max-height: 365px; */
    /* width: 145%; */
    text-align: center;
    cursor: pointer;
}



	.logo_head{
		max-width:50%;
	}

	.gdi-max-resp {
    max-width: 87%;
    margin: 0 auto;
}
	.gdi-text-max {
    max-width: 93%;
    margin: 0 auto;
}

	.aktion_abstand_resp{
		margin-bottom:20%;
	}

	.aktion_abstand_resp:last-of-type{
		margin-bottom:0%;
	}
}
 blink {
        animation: blinker 0.6s linear infinite;
        color: #1c87c9;
       }
      @keyframes blinker {  
        50% { opacity: 0; }
       }
       .blink-one {
         animation: blinker-one 1s linear infinite;
       }
       @keyframes blinker-one {  
         0% { opacity: 0; }
       }
       .blink-two {
         animation: blinker-two 1.4s linear infinite;
       }
       @keyframes blinker-two {  
         100% { opacity: 0; }
       }