*{
padding:0px;
margin:0px;
box-sizing:border-box;
}

/** Elemente **/
body{
font-family:'Roboto Condensed', Arial,Helvetica,sans-serif;
color:black;
letter-spacing:0px;
font-size:1em;
margin:0px;
line-height:20px;
}

html{
overflow-y:scroll;
}

h1{
color:black;
margin:0px 0px 37px 0px;
line-height:25px;
font-size:1.375em;
}

h2{
margin:0px 0px 25px 0px;
font-size:1em;
line-height:25px;
}

h3{
margin:0px 0px 25px 0px;
font-size:1em;
line-height:20px;
}

a{
color:black;
text-decoration:none;
}

table{
border:0px;
border-spacing:0;
border-collapse:collapse;
}

table td{
padding:0px;
vertical-align:middle;
}

img{
padding:0px;
margin:0px;
border:0px solid transparent;
}

input[type=search],input[type=text],input[type=email],input[type=number],input[type=tel],input[type=password],textarea,option,textarea{
padding:2px;
font-size:1em;
font-family:'Roboto Condensed', Arial,Helvetica,sans-serif;
}

input[type=search],input[type=text],input[type=password],input[type=email],input[type=number],input[type=tel],textarea,select{
padding:4px 4px;
border:1px solid lightgrey;
}

input[type=search],input[type=submit],input[type=text],input[type=tel],input[type=email],input[type=number],input[type=password],input[type=button]{
border-radius:2px;
}

input[type=submit],input[type=button],.fake_button{
padding:9px 20px;
border:0px;
font-weight:bold;
max-width:100%;
color:white;
}

input[type=submit]:hover,input[type=button]:hover,.fake_button:hover{
cursor:pointer;
box-shadow: 0 0 6px rgba(0,0,0,0.65) inset;
}

select{
padding-top:1px;
padding-bottom:1px;
font-size:1em;
font-family:'Roboto Condensed', Arial,Helvetica,sans-serif;
}

option{
padding-left:5px;
padding-right:5px;
}

::-webkit-input-placeholder{
color:rgb(130,130,130);
font-size:1em;
}

:-moz-placeholder{
color:rgb(130,130,130);
font-size:1em;
}

::-moz-placeholder{
color:rgb(130,130,130);
font-size:1em;
}

:-ms-input-placeholder{
color:rgb(130,130,130);
font-size:1em;
}

.antispam{
display:none;
}

.clear{
clear:both;
width:0px;
height:0px;
}

.float{
float:left;
}

.req_lang{
font-style:italic;
}

.bold{
font-weight:bold;
}


/** Generelle Seitenbreite **/
.page_size{
width:1250px;
margin-left:auto;
margin-right:auto;
position:relative;
}


/** Kopf **/
.head{
z-index:999;
min-width:1250px;
position:fixed;
top:0px;
left:0px;
right:0px;
width:auto;
min-height:75px;
}


/** Logo **/
.logo{
z-index:999;
position:absolute;
left:0px;
top:10px;
background-repeat:no-repeat;
background-size:contain;
}

.logo_print{
display:none;
}


/** Suche **/
.search_container{
position:absolute;
top:17px;
left:250px;
}

.search{
width:300px;
position:relative;
}

.search input[type=search]{
width:100%;
height:40px;
letter-spacing:1px;
border:0;
padding-right:50px;
}

.search input[type=search]:focus{
outline: none;
}

.search input[type=submit]{
position:absolute;
right:2px;
bottom:2px;
height:36px;
width:39px;
border:0;
color:black;
font-weight:normal;
-o-box-shadow: none;
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;
background-image:url(/images/lupe5_new.png);
background-repeat:no-repeat;
background-color:white;
background-position:50% 50%;
}


/** Sprachauswahl **/
.languages{
width:80px;
height:40px;
background-color:rgb(255,237,166);
text-align:left;
position:absolute;
right:0px;
top:17px;
z-index:999;
padding-left:10px;
padding-right:10px;
padding-top:10px;
}

.languages_use{
display:inline-block;
}

.languages_smart select{
border:0;
text-align:right;
}

.languages_smart{
padding-right:5px;
display:none;
}

.languages img{
width:21px;
height:13px;
vertical-align:middle;
margin-right:10px;
margin-left:5px;
}

.languages_switch{
display:inline-block;
width:15px;
height:16px;
border-radius:50%;
vertical-align:middle;
background-image:url(/images/kreis.png);
background-repeat:no-repeat;
background-position:50% 50%;
background-size:cover;
}

.languages_can{
position:absolute;
left:0px;
right:0px;
top:40px;
max-height:0;
overflow:hidden;
background-color:rgb(255,237,166);
transition:0.4s all;
}

.languages:hover .languages_can{
display:block;
max-height:400px;
}

.languages_can a{
display:block;
padding:7px 30px 7px 25px;
}

.languages_can a:hover{
background-color:white;
}


/** Obere Navigation **/
.navigation{
display:block;
padding-top:28px;
padding-left:580px;
padding-right:0px;
width:100%;
font-size:1.125em;
font-weight:bold;
position:relative;
}

.navigation ul{
list-style-type:none;
margin:0px;
padding:0px;
}

.navigation ul li{
display:inline-block;
padding-right:20px;
position:relative;
}

.navigation ul li:last-child{
padding-right:0;
}

.navigation a{
color:black;
}

.navigation a.navigation_active{
cursor:default;
}

.smart_hide{
display:none;
}

.smart_links{
display:none;
}

.menu1,.menu2,.menu3{
display:none;
}

.menu2{
z-index:999;
position:absolute;
left:5px;
top:-30px;
width:35px;
cursor:pointer;
transition:1s all;
}

.line{
display:block;
width:100%;
height:5px;
background-color:black;
border-radius:3px;
margin-bottom:5px;
transition:1s all;
transform-origin:3px 3px;
}

.menu2 .line:last-of-type{
margin-bottom:0;
}

.menu3{
z-index:999;
position:absolute;
right:0px;
top:0px;
width:40px;
height:40px;
cursor:pointer;
transform-origin:23px 20px;
transition:0.5s all;
}

.line2{
position:absolute;
top:9px;
left:19px;
display:block;
width:5px;
height:25px;
background-color:grey;
}

.line2.dia{
top:19px;
left:9px;
height:5px;
width:25px;
}


/** Kategorien in Navigation **/
.smart_categorie{
display:none;
width:100%;
}

.smart_categorie select{
width:100%;
height:34px;
}

/** Seitenanfang **/
.gototop{
background-color:rgb(235,235,235);
color:rgb(150,150,150);
cursor:pointer;
border:1px solid lightgrey;
border-right:1px solid rgb(235,235,235);
border-top-left-radius:2px;
border-bottom-left-radius:2px;
display:block;
position:fixed;
padding:5px;
bottom:60px;
right:0px;
z-index:999;
}

.gototop_hide{
display:none;
}


/** Inhalt **/
.content{
padding-top:94px;
}

.content_right{
float:right;
width:100%;
position:relative;
vertical-align:top;
}

.content_left{
float:left;
width:250px;
padding-right:70px;
}

.content_right_small{
width:1000px;
}

.content_left h3{
display:block;
font-weight:bold;
margin:1px 0px 0px 0px;
background-color:grey;
color:white;
padding:7px;
}

.content_left a{
display:block;
color:black;
font-size:1em;
padding-top:5px;
padding-bottom:5px;
border-top:1px solid lightgrey;
}

.content_left > a:first-of-type{
border-top:0px;
}

.content_left a:hover,.catalogue_tip,.catalogue_tip_link{
color:rgb(198,40,58);
}

.content_left a.active{
color:rgb(150,150,150);
cursor:default;
}

.content_left .subs{
margin-left:20px;
}

.content_left .subs a{
border-top:0px;
hyphens:auto;
}

.content_left a.m_neuheiten,.content_left a.m_adaptertool,.content_left a.m_kabeltool, .content_left a.m_dockingstationtool{
border:1px solid rgb(200, 200, 200);
display:block;
margin-bottom:10px;
padding:5px;
text-align:center;
}

.content_left a.active_tools{
color:rgb(150, 150, 150);
cursor:default;
}


/** Footer **/
.footer{
margin-top:30px;
margin-left:auto;
margin-right:auto;
padding-top:20px;
border-top:1px solid lightgrey;
text-align:center;
}

.footer.footer_policy{
margin-bottom:50px;
}

.footer ul{
list-style-type: none;
margin:0px;
padding:0px;
}

.footer ul li{
display:inline-block;
border-right:1px solid rgb(230,230,230);
}

.footer ul li:last-child{
border:0px;
}

.footer a{
display:inline-block;
text-align:center;
padding:15px 30px 15px 30px;
}

.footer a.active:hover{
cursor:default;
}

.footer a.active{
color:rgb(150,150,150);
}


/** Cookie Banner **/
.cookie_private{
display:none;
position:fixed;
bottom:0px;
left:0px;
right:0px;
width:auto;
background-color:rgb(255,221,0);
padding:7px 10px;
z-index:998;
}

.cookie_private .ok{
display:inline-block;
padding:3px 10px;
cursor:pointer;
}

.datenschutz{
color:rgb(207,12,19);
text-decoration:underline;
}



.pflichtfeld_text{
display:block;
margin-top:10px;
margin-bottom:10px;
font-size:1em;
}

.pflichtfeld:before{
color:rgb(202,0,33);
content:"*";
}


/** Bread **/
.bread{
display:block;
margin-bottom:20px;
color:black;
border-bottom:3px solid transparent;
font-size:0.8em;
}

.bread a{
color:black;
vertical-align:top;
display:inline-block;
padding-top:2px;
position:relative;
border-bottom:1px solid lightgrey;
}

.bread a.active{
cursor:default;
color:rgb(150,150,150);
}

.bread a:hover{
color:rgb(198,40,58);
}

.bread a:hover{
color:rgb(150,150,150);
}

.bread_pfeil{
vertical-align:middle;
padding-left:5px;
margin-right:5px;
margin-top:2px;
display:inline-block;
}


/** Formulare **/
.form_text{
max-width:580px;
width:580px;
text-align:justify;
margin-bottom:20px;
}

.form{
display:table;
width:580px;
}

.form_row{
display:table-row;
}

.form_cell{
display:table-cell;
}

.form_left{
padding-top:10px;
vertical-align:middle;
width:134px;
}

.form_right{
padding-top:10px;
width:446px;
}

.form .form_row:first-child .form_left,.form .form_row:first-child .form_right{
padding-top:0px;
}

.form_right input[type=text],.form_right input[type=email],.form_right input[type=number],.form_right input[type=tel],.form_right textarea,.form_right select{
width:100%;
max-width:580px;
}

.form_right textarea{
height:90px;
}

.form_button{
text-align:right;
}

.form_top{
vertical-align:top;
}


/** Fehler **/
.fehler{
position:fixed;
bottom:0px;
left:50%;
width:300px;
margin-left:-150px;
background-color:rgb(255,255,0);
color:black;
padding:10px;
box-shadow:0px 0px 2px black;
text-align:center;
z-index:999;
}


/** Debug **/
.umgebung{
position:fixed;
top:50%;
left:0px;
max-height:30px;
bottom:0px;
width:150px;
box-shadow:0px 0px 3px black;
display:block;
background-color:white;
z-index:99999;
transition:0.5s all;
overflow:hidden;
}

.umgebung:hover{
top:0px;
bottom:0px;
width:500px;
max-height:100%;
}

.umgebung_ueberschrift{
text-align:center;
padding:5px;
background-color:grey;
color:white;
font-weight:bold;
}

.umgebung_variablen{
overflow:auto;
position:absolute;
top:30px;
bottom:0px;
width:100%;
}

/** Browser Auflösungen **/
@media screen and (max-width: 1275px)
{
  .head{
  min-width:inherit;
  }

  .logo{
  left:5px;
  }

  .languages{
  right:5px;
  }

  .page_size{
  width:100%;
  padding:94px 5px 0px 5px;
  }

  .page_size_cookie{
  padding:5px;
  }

  .head .page_size{
  padding:0;
  }

  .navigation{
  padding-left:530px;
  }

  .footer{
  min-width:inherit;
  }

  .content_right_small{
  width: calc(100% - 250px);
  }

  .navigation.navi_small ul li{
  max-width:110px;
  vertical-align:top;
  text-align:center;
  padding-right:10px;
  }

  .search{
  width:250px;
  }
}

@media screen and (max-width: 1023px)
{
  .head .page_size{
  padding:0px;
  }

  .head{
  position:inherit;
  margin-top:30px;
  min-height:auto;
  padding-top:10px;
  }

  .navigation{
  padding-top:0;
  }

  .search_container{
  margin:20px 0px 10px 0px;
  padding:0px;
  background-color:rgb(210,210,210);
  position:relative;
  right:inherit;
  top:inherit;
  left:inherit;
  border-bottom:0;
  }

  .languages{
  position:absolute;
  top:-41px;
  height:30px;
   right:0px;
  padding-right:0;
  width:auto;
  background-color:white !important;
  }

  .languages_smart{
  display:block;
  width:100%;
  text-align:right;
  }

  .languages_use{
  display:none;
  }

  .languages_switch{
  display:none;
  }

  .languages_can{
  border-bottom:0;
  }

  .search{
  width:100%;
  padding:10px 55px 10px 5px;
  }

  .search input[type=search]{
  width:100%;
  border-radius:10px;
  }

  .search input[type=search]:focus{
  border:0 !important;
  }

  .search input[type=submit]{
  bottom:10px;
  right:5px;
  border-radius:10px;
  background-color:grey;
  }

  .content{
  padding-top:10px !important;
  }

  .logo{
  position:relative;
  display:block;
  top:inherit;
  left:inherit;
  margin-left:auto;
  margin-right:auto;
  }

  nav{
  position:absolute;
  left:-700px;
  top:90px;
  transition:0.6s left;
  max-width:70%;
  min-width:300px;
  min-height:600px;
  background-color:rgb(255,204,0);
  box-shadow:4px 4px 4px;
  padding:10px;
  z-index:999;
  overflow:auto;
  }

  .menu2,.menu3{
  display:block;
  }

  .menu1:checked + .menu2{
  width:27px;
  }

  .menu1:checked + .menu2 + nav{
  left:0px;
  }

  .menu1:checked + .menu2 .line{
  width:35px;
  }

  .menu1:checked + .menu2 .line:nth-child(1){
  transform:rotate(45deg);
  }

  .menu1:checked + .menu2 .line:nth-child(2){
  transform:rotateY(-90deg);
  opacity:0;
  }

  .menu1:checked + .menu2 .line:nth-child(3){
  transform:rotate(-45deg);
  }

  .smart_links{
  display:block;
  height:auto;
  max-height:0;
  overflow: hidden;
  transition:0.5s all;
  transition-timing-function:linear;
  }

  .menu1:checked + .menu3,.menu1:checked + .menu3,.menu1:checked + .menu3,.menu1:checked + .menu3,.menu1:checked + .menu3{
  transform:rotate(45deg);
  }

  .menu1:checked + .menu3 + .smart_links,.menu1:checked + .menu3 + .smart_links,.menu1:checked + .menu3 + .smart_links,.menu1:checked + .menu3 + .smart_links,.menu1:checked + .menu3 + .smart_links{
  max-height:600px;
  }

  .navigation ul li{
  width:100%;
  display:block;
  padding:0;
  }

  .navigation ul li a{
  display:block;
  padding:10px 0px 10px 10px;
  }

  .navigation ul li a:hover{
  border-bottom:0;
  background-color:white;
  }

  .smart_links{
  padding-left:20px;
  }

  .navigation ul li .smart_links a{
  color:rgb(120,120,120);
  }

  .navigation a.navigation_active{
  background-color:white;
  }

  .navigation a.navigation_active,.navigation a:hover{
  border-bottom:0 !important;
  }

  .smart_categorie{
  display:block;
  }

  .content_right{
  width:100%;
  }

  .content_right_small{
  width: calc(100% - 250px);
  }

  .bread{
  margin-top:0px;
  }

  .cookie_private{
  top:0px;
  bottom:inherit;
  box-shadow:0px 0px 2px black;
  z-index:999;
  }

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

@media screen and (max-width: 910px)
{
  .content_left{
  width:100%;
  padding:0px;
  margin-bottom:20px;
  }

  .content_left .subs{
  display:none;
  }

  .content_right_small{
  width:100%;
  }

  .form_text{
  width:100%;
  }

  .form{
  display:table;
  width:100%;
  }

  .form_row{
  display:block;
  }

  .form_cell{
  display:block;
  }

  .form_left{
  padding-top:15px;
  width:100%;
  }

  .form_right{
  width:100%;
  padding-top:0px;
  }

  .form_button{
  text-align:left;
  }
}

@media screen and (max-width: 487px)
{
  .listing .list_picture{
  margin-bottom:5px;
  }
}

@media print
{
  .head{
  position:relative;
  width:100%;
  min-width:auto;
  display:none;
  }

  .logo_print{
  display:block;
  }

  .content{
  padding-top:10px;
  }

  .navigation{
  display:none;
  }

  .search{
  display:none;
  }

  .languages{
  display:none;
  }

  .page_size{
  width:100%;
  }

  .logo{
  display:block;
  position:relative;
  top:auto;
  left:auto;
  margin-left:auto;
  margin-right:auto;
  }

  .content_left{
  display:none;
  }

  .content_right,.content_right_small{
  width:100%;
  max-width:100%;
  min-width:100%;
  }

  .footer{
  display:none;
  }
}
