/***********************************
CSS fuer dreusicke.de
Online Now! GmbH - 2020
Michael Boeneke

CSS - Hauptdatei styles.css


grün		:	#33CD99
hell grün	:	#a5e7d1
mittel grün	:	#8adbc0
dunkel grün	:	#2eba8b 
orangehell  :   #FF9934   headcontent / footer
orange		:	#FF6634
orange dunkler  #FC7A00  // mouseover warenkorb tab
grau suche	:	#E0E0E0
grau suche	:	#4a4a4a
grau inhalt	:	#F3F3F3
grau schrift:	#676767

grau robotics:  #707070
orange service: #FF6634
blau walzen:	#0174BF
************************************/


/* 
RESET 
*/

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    padding-right: 0;
    padding-left: 0;
}


html {
 margin:0;
 padding:0;
 font-size:16px;
 font-family: Arial, Helvetica, sans-serif;
 overflow-y: scroll !important;
}

body {
  margin:0;
  padding:0;
  line-height: 0;
  font-size:16px;  
  font-family: Arial, Helvetica, sans-serif;
}

.clear {
 clear:both;	
}

.font16 {
	font-size:16px;
	line-height: 2rem;
}

button, input, optgroup, select, textarea  {
 color:#000;
}
.form-horizontal .form-group  {
 margin:0;
 padding:0;
}


.loginform {
 	margin: 30px 0 0 0;	
}

.loginstart {
margin: 10px 0 20px 0;	
}

.loginstart .form-group {
	margin-right: 20px;
}

.loginhint {
	padding:2px;
}

.form-group label {
 text-align: left !important;
}

#wrapper, .wrappertopbottom {
 margin:0 auto !important;
} 
#wrapper {
 max-width: 1150px;
 padding-left:10px;
 padding-right:10px;
} 
.wrappertopbottom {
  max-width: 1150px;
  padding:0;
}



#headcontent {
	background-color: #33CD99;
	color: #fff;
	margin:0;
	padding: 20px;
}
.container , .row{
  margin:0;
  padding:0;
  width:100%;
}

.mt-20 {
 margin-top: 20px;	
}
.mt-40 {
 margin-top: 40px;	
}

.mb-20 {
 margin-bottom: 20px;	
}
.mb-40 {
 margin-bottom: 40px;	
}


.px-20 {
	padding-left: 20px;
	padding-right: 20px;
}


/* Logo und Firma */
.navbar > .container .navbar-brand, 
.navbar > .container-fluid .navbar-brand {
 margin-left:0;
}
.navbar-brand {
 padding: 0;
 float:	left;
 max-width: 400px;
}

.navbar-default .navbar-toggle .icon-bar {
    background-color: #fff;
}

.navbar-default .navbar-toggle {
    border-color: #fff;
}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    background-color: #FF6634;
}




.menue ul {
	list-style: none;
	font-size: 16px;
	width:100%;
	padding:0;
	margin:0;
}
.menue ul li {
}

.menue ul li a {
	color: #fff;
	padding: 20px 0;
	display: block;
}



/* Inhalt Start */
#webcontent {
 margin: 10px 0 0 0;
 /* padding: 0 10px; */
 line-height: 1.5em;
 position: relative;
 z-index: 10;
}


#left-webcontent {
  width: 20%;
  float: left;
}

#main-webcontent-unterseite {
  margin-left:20px;
float:left;
 width:75%;
}

#main-webcontent-unterseite2 {
 margin-left:20px;
 float:none;
}

#footer {
 margin: 20px 0 0 0;
 background-color: #33CD99;
 color: #fff;
 padding: 0 20px;
 line-height: 20px;
 position: relative;
 min-height:86px;
 font-size:16px;
}

#footer .wrappertopbottom {
 padding: 20px 0 0 0;	
}

#footer a {
 color: #fff;
 padding: 20px;
}
#footer a:first-child {
 padding: 20px 20px 20px 0;
}


#footer span {
margin: 10px 0 0 0;
border-right: 1px solid #FFF;
display: inline-block;
}

#footer span:last-child {
	border:0;
}


/* Startseite */
.startseite-textunten {
	margin: 20px 0;
}


/* Bereich */
.auswahlbereich img.inaktiv {
	width: 150px;
}


.urlbtn {
	border-radius:10px;
	border:1px solid transparent;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:24px;
	width:100%;
	text-decoration:none;
	text-align:center;
	text-transform: uppercase;
	padding: 20px 0;
}

.urlbtn:hover {
-webkit-box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.75);
box-shadow: 1px 1px 4px 0px rgba(0,0,0,0.75);
}	

.urlbtn.service {
	background-color:#FF6634;
}	
.urlbtn.service:hover {
	background-color:#FF6634;
	color:#ffffff;
	text-decoration:none;
}
.urlbtn.service:active {
	position:relative;
	top:1px;
}

.urlbtn.walzen {
	background-color:#0174BF;
}	
.urlbtn.walzen:hover {
	background-color:#0174BF;
	color:#ffffff;
	text-decoration:none;
}
.urlbtn.walzen:active {
	position:relative;
	top:1px;
}

.urlbtn.robotics {
	background-color:#707070;
	position:relative;
}	
.urlbtn.robotics:hover {
	background-color:#707070;
	color:#ffffff;
	text-decoration:none;
}
.urlbtn.robotics:active {
	position:relative;
	top:1px;
}


.urlbtn.robotics .neu {
	position:absolute;
	bottom: -10px;
	right: 30px;
	/* width: 106px; */
	transform: matrix(0.97, -0.26, 0.26, 0.97, 0, 0);
	background: #D12C2C 0% 0% no-repeat padding-box;
	padding: 5px 5px;
	opacity: 1;
	text-align: center;
	letter-spacing: 0;
	color: #ECF434;
}	





/* Kontaktformular */
.kontakthinweis {
	margin: 30px 0 30px 0;
}

.kontakthinweis p {
 padding: 10px;	
}




/* Sprachauswahl */
.sprachauswahl {
	margin:40px 0 20px 0;
	color:#fff;
	font-size:16px;
}
.sprachauswahl a {
	color:#fff;
}

.sprachauswahl .unternavilink {
	margin: 0;	
}
.sprachauswahl .unternavilink:after {
	content: '|';
	padding:0 20px;
}

/* Navigation warenkorb/Login */
/*  .navbar-default .navbar-nav > li > a { */
.navbar-default .navbar-nav > li a,
.navbar-default .navbar-nav > li img {
    color: #fff;
	padding: 15px 10px !important;
}

/* DPS User Bereich - Verwaltung */
.dpsuser .navbar-default .navbar-nav > li a {
	padding: 2px !important;
}

.dpsusernavi { position: relative; }
.dpsnavi { position: absolute; bottom:0; right:0; }
.dpsnavi li { float:left; margin: 0 5px;}

.dpsnavi li a { font-size:1.2em;}
.dpsnavi li a:hover, .dpsnavi li a:focus, .dpsnavi li a:active,
.dpsnavi li.aktiv a  { 
 text-decoration:underline; color:#fff !important; 
}

.dpsuser .panel-heading a {
	display:block;
	text-decoration: none;
	font-size: 1.2em;
}
.dpsuser .panel-heading a:hover {
  text-decoration:underline;
  color:#FF9934;
}

.dpsuser .panelFreigabe .panel-heading {
    padding: 10px 5px;
	font-size:  1.2em;
}

.dspkundeFirma {
	margin-left: -10px;
}	

.dpsuser .panel-heading a span {
	float:right;
}

.panelFreigabe td {
	vertical-align: middle !important;
}

.panelFreigabeSpalte5 {
	width:100px;
}

.inputkurz {
 width: 400px;
}
 
.dp_daypicker {
	height: 250px;	
}


.navbar-header {
 margin-bottom:30px;
}

/* Startseite */
.container-kategorien {
 display:flex;
 flex-direction: column;
 -webkit-justify-content:space-between;
 -ms-justify-content:space-between;
 -ms-flex-pack:justify;
 justify-content:space-between;
 
/* 
 justify-content: space-between;
 -ms-flex-pack : justify;
 align-items: flex-start;
 -ms-flex-align : start;
 */
 margin: 0 0 20px 0;
}



.container-kategorien h3 {
 font-size: 1.1em;
}

.container-suche {
  /* border:1px solid #dedede; */
  margin: 30px 0 0 0;
}

#main-webcontent h1 {
	font-size:1.5em;
	color: #676767;
	font-weight:bold;
}

#main-webcontent h2 {
	font-size:1.3em;
	color: #676767;
}

.teaser-kategorie-rahmen {
 padding: 0 10px;
 margin: 0 0 20px 0;
}

.teaser-kategorie {
 margin: 30px 0 0 0;
 max-width: 330px;
}

/*
.teaser-kategorie.links {
 padding: 0 45px 0 0;
}
.teaser-kategorie.mitte {
 padding: 0 45px 0 45px;
}
.teaser-kategorie.rechts {
 padding: 0 0 0 45px;
}
*/

.teaser-kategorie-item{
 margin-top: 40px;
 border: 1px solid #707070;
 border-radius: 10px;
 overflow:hidden;

}
.teaser-kategorie-item.walzen {
 background: #fff url(icons/pfeil_auswahl_walzen.gif) no-repeat right bottom;
}
.teaser-kategorie-item.service {
 background: #fff url(icons/pfeil_auswahl_service.gif) no-repeat right bottom;
}
.teaser-kategorie-item.robotics {
 background: #fff url(icons/pfeil_auswahl_robotics.gif) no-repeat right bottom;
}

.teaser-kategorie-item img {
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	border-bottom: 1px solid #707070;
	transition: all 2.0s;
    transform: scale(1);
}

.teaser-kategorie-item:hover img {
transform: scale(1.1);
}

.teaser-kategorie-item a {
	color: #000;
}
.teaser-kategorie-item h3 {
font-weight: bold;
height: 100px;
margin: 0;
padding: 20px 50px 10px 10px;
font-size:16px;
}


.kategorie2Items {
	padding: 5px;
}

.kategorie2Items div.catimg {
	float: left;
	width: 150px;
	margin: 0;
}

.kategorie2Items a img {
  border-radius: 10px;
}


.kategorie2Items div.cattext {
  margin: 0 0 0 150px;
}
.kategorie2Items div.cattext a {
 display:block;
}	

.kategorie2Items div.cattext a p {
 margin: 0 ;
}	
/* store.php */
/* eshop_anzeige_produkte.php */

.sortparameter {
	background-color: #ececec;
	padding: 5px 20px 5px 0;
}

.sortparameter #Sortierung,
.sortparameter #Anzahl {
margin: 0 20px 0 0;	
}

.sortparameter #Anzahl option{
	float:left;
}

/* -------  start store-warenkorb-modal */ 
#dwkModal .modal-inhaltpreis {
	padding: 10px 0 0 0;
}

#dwkModal .modal-inhaltinfo,#dwkModal .modal-preis, #dwkModal .modal-sonderpreis {
	line-height:normal !important;
}

#dwkModal .modal-inhaltinfo .showmoreinfofade {
	display:none;
}


 #dwkModal .anzahlLabel {
  height:2em;	
  margin: 0 5px;
  font-size: 1.2em
}


/* Auswahl Anzahl */

.quantity {
  position: relative;
  display: inline-flex;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button
{
  -webkit-appearance: none;
  margin: 0;
}

input[type=number]
{
  -moz-appearance: textfield;
}

.quantity input {
  width: 65px;
  height: 42px;
  line-height: 1.65;
  float: left;
  display: block;
  padding: 0;
  margin: 0;
  padding-left: 10px;
  border: 1px solid #eee;
  font-size: 1.2em
}

.quantity input:focus {
  outline: 0;
}

.quantity-nav {
  float: left;
  position: relative;
  height: 42px;
}

.quantity-button {
  position: relative;
  cursor: pointer;
  border-left: 1px solid #eee;
  width: 20px;
  text-align: center;
  color: #333;
  font-size: 22px;
  font-family: "Trebuchet MS", Helvetica, sans-serif !important;
  line-height: 0.9;
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}

.quantity-button.quantity-up {
  position: absolute;
  height: 50%;
  top: 0;
  border-bottom: 1px solid #eee;
}

.quantity-button.quantity-down {
  position: absolute;
  bottom: -1px;
  height: 50%;
}
/* Auswahl Anzahl */

/* -------  Ende store-warenkorb-modal */ 


#countDown {
	font-weight:bold;
	font-size: 1.4em; 
}

/* Block teaser orange - z.B. Vor-Ort-Abholung */
.blockteaserorange {
	padding: 10px 5px;
	border:1px solid #FC7A00;
	margin: 0 0 20px 0;
}

.blockteaserorange strong.verkauf {
	padding: 2px 0;
}

.blockteaserorange ul {
	list-style: none;
	padding:0;
}
.blockteaserorange ul li  {
   margin: 0 0 3px 0;
}

.blockteaserorange ul li a {
   background-color: #FC7A00;
   color: #fff;
   display:block;
   line-height: 1.5em;
   font-weight:bold;
   font-size:1.2em;
   padding: 2px 5px;
   margin:0;
}


/* Suchformular */ 

#suchformular {
  background-color: #ECECEC;
  font-size: 16px;
  padding: 10px 20px;
  position:relative;
  z-index:20;
   -webkit-border-radius: 10px;
 -moz-border-radius: 10px;
 border-radius: 10px;
 /* width: 90%; */
}

#suchformular label {
 font-weight:bold;
 float:left;
 width:80px;
 color: #4a4a4a;
 padding: 15px 0 ;
}

#suchformular input#sucheingabe {
 height: 30px;
 /* min-width: 400px; */
 margin: 0; 
 font-size: 16px;
 padding: 0px 5px;
}

#suchformular input.submitbtn,
.submitbtn {
    padding: 5px 10px;
	background-color: #FF6634;
	color: #fff;
	font-size: 16px;
	border:0;
	height: 30px;
}
#suchformular #msg {
  border: 1px solid #cdcdcd;
  background-color: #fff;
  padding: 5px 5px;
  margin: 1px 0 0 0;
  display:none;
  min-height: 50px;
  max-height: 200px;
  position:absolute;
  z-index: 10000;
  overflow-x:auto;
  overflow-x: auto;
  color: #4a4a4a;
}
#suchformular #msg  ul {
 margin:0;
 padding:0;
 list-style: none;
}


#suchformular #msg  ul li {
 font-size: 16px;
 line-height: 20px;
}

#suchformular #msg  ul li:hover {
 background-color:#cdcdcd;
}


/* Unterseite */
.seitentitel {
	text-align: right;
	font-size: 2em;
}

/* Navigation links */

.facetten-suche {
 padding: 5px 10px;
 margin: 0 0 20px 0;
 background-color: #F3F3F3;
 -webkit-border-radius: 10px;
 -moz-border-radius: 10px;
 border-radius: 10px;
 color:#000;
 position:relative;
  z-index:100;
}

.facetten-suche-gross {
 padding: 5px 10px;
 margin: 0 0 20px 0;
 background-color: #F3F3F3;
 -webkit-border-radius: 10px;
 -moz-border-radius: 10px;
 border-radius: 10px;
 color:#000;
 position:relative;
  z-index:100;
 width:100%;
}

#suche-hersteller-mehr-btn,
#suche-kategorie-mehr-btn,
#suche-tags-mehr-btn
 {
 cursor: pointer;
 font-size: 0.5em;
 padding: 4px;
 display: inline;
 background-color: #FF6634;
}

#suche-hersteller-mehr-btn .glyphicon,
#suche-kategorie-mehr-btn .glyphicon,#suche-tags-mehr-btn .glyphicon {
  color: #fff;
}
  
#suche-hersteller-mehr,
#suche-kategorie-mehr ,
#suche-tags-mehr{
  display:none;
}


.downloadCatalog {
	margin:0;
	padding:10px 0 5px;
}

/* Shoplist */
.shopliststart div {
	/* bootstrap überschreiben */ 
	padding-left:0;
	padding-right: 0
}


.shoplistitem {
	margin: 10px 0;
	padding: 5px 0;
	border-bottom: 1px solid #cdcdcd;
}

.shoplistitem1 {
	text-align:center;
}

.showmoreinfo {
 position: relative;
 z-index:10;
 overflow:hidden;
 height: 7.5em;
 margin: 10px 0 0 0;
}

.shownomoreinfo {
 position: relative;
 z-index:10;
 margin: 10px 0 0 0;
}


.showmoreinfo.showmoreall {
	height: auto !important;
	overflow: visible;
}

.showmoreinfofade {
	background: transparent url('transparent_50.png') repeat-x;
    height:	50px;
	position:absolute;
	bottom:0;	
	z-index: 100;
	width:100%;
}

.showmoreinfobtn {
  cursor: pointer;
  color: #FF6634;	
  text-decoration: underline;
}

.pagebrowserbtn {
	background-color: #FF6634;
	color: #fff;
	-webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
	padding: 2px 4px;
}
.pagebrowserbtn:hover {
	color: #fff;
} 

.pagebrowserseite {
	padding: 0 2px 0 0;
	color: #FF6634;
}

.pagebrowserseite.aktiv{
	color: #000;
}

/* fg.php */
.freigabetext {
	padding: 10px;
}

/* Inhalt Ende */