/*!
 * abylonsoft
 *
 * Copyright 2014 abylonsoft
 * Individuelle Anpassungen
 */

/* Positionierung abylonsoft-Logo
-------------------------------------------------- */

body {
	position: relative;
/*	padding-top: 80px; */
}

#logo {					/* abylonsoft Logo Position */
	margin-top: 0px;
}

#nav-search{					/* abylonsoft Suche Position */
	width: 8em; 
	margin-top: 15px;
	margin-right: 10px;
}

h1, h2 {
 margin-top: 30px;
}

.topminus12 {
 margin-top: -12px;
}

.top10 {
 margin-top: 10px;
}

.top20 {
 margin-top: 20px;
}

.top30 {
 margin-top: 30px;
}

.top40 {
 margin-top: 40px;
}

.left10 {
 margin-left: 10px;
}

.left20 {
 margin-left: 20px;
}

.right10 {
 margin-right: 10px;
}

.right20 {
 margin-right: 20px;
}

.bottom10 {
 margin-bottom: 10px;
}

.bottom20 {
 margin-bottom: 20px;
}

/* ### Top-Navigation / Dropdown-Menü / Dropdown-Button ### */

/* Open dropdowns on hover instead of click. */
@media (min-width: 768px) {
  .dropdown:hover {
    background: #e7e7e7;
  }
  .dropdown:hover > .dropdown-menu {
    display: block;
  }  
  .btn-group:hover ul.auto-dropdown {
    display: block;
  }
  .dropdown-menu {
    margin-top: 0px;
  }
}

.navbar {
 margin-bottom: 0px;
}

.navbar-inverse .navbar-nav li  a.navbar-max {
	color: #F5F5F5;
}

.navbar-inverse .navbar-nav li  a.navbar-max:hover,
.navbar-inverse .navbar-nav li  a.navbar-max:active {
	color: #428BCA;
	background-color: #F5F5F5;	
}

.navbar-nav li a.navbar-max {
	line-height: 30px;
	font-size: 14px;
}

.nav li a.navbar-max {
    padding: 17px 10px;
}

@media (min-width: 992px) {
 #nav-search{					/* abylonsoft Suche Position */
	width: 15em; 
	margin-top: 15px;
	margin-right: 20px;
 }
 .navbar.top {
	min-height: 60px;
 }
 .navbar-nav li a.navbar-max {
	line-height: 34px;
	font-size: 18px;
 }
 .nav li a.navbar-max {
    padding: 14px 15px;
 }
}

@media (max-width: 767px) {
 #nav-search{					/* abylonsoft Suche Position */
	width: 15em;
	margin-top: 0px;	
	margin-left: 15px;
 }
 .navbar {
	min-height: 60px;
 }
 .navbar-nav li a.navbar-max {
	line-height: 20px;
	font-size: 18px;
 }
 .nav li a.navbar-max {
    padding: 10px 15px;
 }
}

/* Sub-Navigation in Glossar */
.nav.glossar > li > a {
    padding: 15px 8px;
	color: #428BCA;
}
.nav.glossar > li > p {
    padding: 15px 8px;
	margin: 0px;
}
.nav.glossar > li > a:hover, .nav.glossat > li > a:focus {
    background-color: #EEE;
}

.dropdown-menu.multi-column {
    width: 630px;
}

.dropdown-menu.multi-column .dropdown-menu {
    display: block !important;
    position: static !important;
    margin: 0 !important;
    border: none !important;
    box-shadow: none !important;
}

/* ### Dropdown-Menü ### */

.carousel-text h2 {
  margin: 5px 25px;
  color: #000066;
}

.carousel-text p {
  margin: 5px 25px 25px 25px;
  color: #000066;
  font-size: 16px;
  font-weight: 200;
  line-height: 24px;
}

.carousel-nav {
  position: absolute;
  margin-left: 20px;
  margin-top: -55px;
}

.carousel-img {
 float:left;
/* vertical-align: baseline;*/
 margin: 0 20px 5px 2px;
}

.text-slider.carousel-caption {
  position: static;
  min-height: 195px;
  margin-left: 15%;
  margin-right: 15%;
  color: #696969;
  text-align: center;
  text-shadow: 0px 0px 12px rgb(192, 192, 192);  
}
@media (max-width: 767px) {
 .text-slider.carousel-caption {
  min-height: 220px;  
   font-size: 95%;
 }
}
@media (max-width: 576px) {
 .text-slider.carousel-caption {
   min-height: 340px;
   font-size: 90%;
 }
}

.text-slider.carousel-caption > h3 {
  margin-top: 0px;
}
.text-slider.carousel-caption > p {
  font-size: 115%;
}
ol.carousel-indicators {
  bottom: 10px;
}

ol.carousel-indicators li {
  border: 1px solid #808080; 
}

.icon {
 float:left;
/* vertical-align: baseline;*/
 margin: 3px 20px 5px 3px;
}

.btn.btn-plus {
 background-image: none;
 border-radius: 8px;
 margin: 5px 3px;
 padding: 10px 20px;
}

.btn.btn-newsletter {
 color: #fff;
 background-color: #428bca;
 border-color: #357ebd;
}

h2.group_header {
  margin: 30px 0px 20px 0px;
/*  width:97%; */
  border-bottom: 1px solid #CECBC6; 
}

.header_box {
  width:97%;
/*  background:#FFCC66; */
  background-image: url(../img/verlauf_grey.png);
  background-repeat:repeat-x;
  padding: 2px 10px 2px 15px;
/*  margin-left: 60px;
  border: 1px solid #FF9900; */ 
}

h3.media-heading {
  width:97%;
  border-bottom: 1px solid #CECBC6; 
}

img.vollebreite {
  width:100%;
/*  max-width: 100%; */
}

/*
.header_box_fleil {
  margin: 0px;
  width:97%;
  height:14px;
  position: relative;
/* position:absolute; */ /* 
  left:10px; 
  top:-11px;
/* float:left; */  
/*  background-image: url(../img/pfeil_ueberschrift.png);
  background-repeat:no-repeat;*/ /*
}
*/
div.hintergrund {
 background-image: url(../img/verlauf_grey.png);
 background-repeat:repeat-x; 
/* background-color: ; 
 border-bottom: 1px solid gray;*/
}

.header_soft {
 text-decoration: underline;
}

.shadow1 {
  width: 100%;
  padding: 0px 5px 5px 105px; 
  margin-bottom:30px;
  float:left;  
  -webkit-box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.075);
  -moz-box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.075);
  box-shadow: 6px 6px 6px rgba(0, 0, 0, 0.075);
  -webkit-transition: border linear 0.4s, box-shadow linear 0.4s;
  -moz-transition: border linear 0.4s, box-shadow linear 0.4s;
  -ms-transition: border linear 0.4s, box-shadow linear 0.4s;
  -o-transition: border linear 0.4s, box-shadow linear 0.4s;
  transition: border linear 0.4s, box-shadow linear 0.4s;
  background:#FDFDFD;
/*  background-image: url(../img/verlauf_orange.png); */
  background-repeat:no-repeat;
  background-position:-35px 15px;
  border: 1px solid #F5F5F5;
}

.shadow1.media, .shadow1.lexikon, .shadow1.shop, .shadow1.angebot  {
  padding: 10px;
}

.shadow1.startseite  {
  padding: 0px 10px 10px 0px;
}

.shadow1.startseite  a.ib,
.shadow1.media  a.ib {
  position: absolute;
  display: inline-block;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
  z-index: 20;
}

.startseite.shadow1 div.media-body div.button-leiste {
  z-index: 21;
  position: relative;
  display: inline-block;
}
.shadow1.selekt {
  background: #F8F8FF;
  font-size: 105%;
}

div.shadow1.media div.media-left {
    padding-right: 20px;
}

.shadow1:hover {
  -webkit-box-shadow: 8px 8px 8px rgba(0, 0, 128, 0.2);
  -moz-box-shadow: 8px 8px 8px rgba(0, 0, 128, 0.2);
  box-shadow: 8px 8px 8px rgba(0, 0, 128, 0.2);
}

/* Cut-Image auf der Startseite */
img.media-object.icon-cut {
 filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
 filter: gray; /* IE6-9 */
 -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
 filter:alpha(opacity=70); /* IE */
 opacity:0.7; /* allgemein */
 -moz-opacity:0.7; /* Mozilla */
 -khtml-opacity:0.7; /* KTHML */
 -opera-opacity:0.7; /* Opera */
 -webkit-transition:all 2s ease;
 -moz-transition:all 2s ease;
 -o-transition:all 2s ease;
 transition:all 2s easeout; 
}

div.shadow1:hover  img.media-object.icon-cut {
 filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
 -webkit-filter: grayscale(0%);
 filter:alpha(opacity=0); /* IE */
 opacity:1; /* allgemein */
 -moz-opacity:1; /* Mozilla */
 -khtml-opacity:1; /* KTHML */
 -opera-opacity:1; /* Opera */
 -webkit-transition:all 2s ease;
 -moz-transition:all 2s ease;
 -o-transition:all 2s ease;
 transition:all 2s ease;
}

/*
@-webkit-keyframes overview {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes overview {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}
*/

.overview {
  margin: 40px 0px;
/*  width: 100%; */
  min-height: 400px;
/*  -webkit-animation-name: overview;
  animation-name: overview; 
*/  
}

/*
.showdelay2s {
  animation-delay: 2s;
  -moz-animation-delay: 2s;
  -webkit-animation-delay: 2s;
  -o-animation-delay: 2s;
  transition-delay: 2s;
  -webkit-transition-delay: 2s;
  -moz-transition-delay: 2s;
  -o-transition-delay: 2s;
}

.showdelay8s {
  animation-delay: 8s;
  -moz-animation-delay: 8s;
  -webkit-animation-delay: 8s;
  -o-animation-delay: 2s;
  transition-delay: 8s;
  -webkit-transition-delay: 8s;
  -moz-transition-delay: 8s;
  -o-transition-delay: 8s;
}
*/

.overview-links {
 height: 100%;
 min-height: 400px;
 text-align: center;
/* position: relative; */
}

.overview-links img {
 max-height: 400px;
 max-width: 100%;
 opacity: .7;
} 

.overview-links div {
 width: 100%;
 position: absolute; 
 bottom: -30px;
 text-align: center;
}

.overview-mitte {
}

.overview h2 {
 background-color: #F2F2F2;
 margin-top: 5px;
 padding: 5px;
 border-bottom: 1px solid #7BAEDA;
}

.overview-rechts {
}

span.size150 {
 font-size: 150%;
 font-weight: bold;
}

span.size200 {
 font-size: 200%;
 font-weight: bold;
}

span.size300 {
 font-size: 300%;
 font-weight: bold;
}

/* Lieferzeiten */
span.lieferzeit {
  height: 8px;
  width: 32px;
  display: inline-block;
  border: 1px solid rgba(0, 0, 0, 0.25);
}

span.lieferzeit.rot {
  background-color:tomato;
}
span.lieferzeit.green {
  background-color:limegreen;
}
span.lieferzeit.yellow {
  background-color:lightyellow;
}

.form-control.menge {
 width:100%;
}
.overview-mitte {
/* margin-left: 10px; */
}

.overview-mitte ul{
/* list-style-type:none;
 maring-left: 5px; */
}

.overview-mitte ul li.small{
 font-size: 110%;
/* background-color: #C0C0C0; */
 margin: 2px;
 padding: 3px;
}

.overview-mitte ul li.big{
 font-size: 120%;
/* background-color: #C0C0C0; */
 margin: 3px;
 padding: 4px;
}

/*
.shadow2 {
  -webkit-box-shadow: inset 0px 30px 30px #fbfb74;
  -moz-box-shadow: inset 0px 30px 30px #fbfb74;
  box-shadow: inset 0px 30px 30px #fbfb74;
  -webkit-transition: border linear 0.4s, box-shadow linear 0.4s;
  -moz-transition: border linear 0.4s, box-shadow linear 0.4s;
  -ms-transition: border linear 0.4s, box-shadow linear 0.4s;
  -o-transition: border linear 0.4s, box-shadow linear 0.4s;
  transition: border linear 0.4s, box-shadow linear 0.4s;
}
*/
/*
.dist {
  margin: 3px 5px 5px 7px; 
}
*/
/*
.btn-group a {
    display:inline-block;
}
*/

/* #### Angebote ###### */
 div.tag 
 {
  min-height: 80px;
  border: 1px solid #E1E1E1;
  position: relative;
  float: left;
  width: 16%;
  margin: 20px 2px 10px 2px;
  padding: 4px;
  border-radius: 4px;
  -webkit-box-shadow: 2px 2px 1px rgba(0, 0, 0, 0.075);
  -moz-box-shadow: 2px 2px 1px rgba(0, 0, 0, 0.075);
  box-shadow: 2px 2px 1px rgba(0, 0, 0, 0.075);
  background:#FFF0F5;
  -webkit-transition: background linear 0.4s, box-shadow linear 0.4s;
  -moz-transition: background linear 0.4s, box-shadow linear 0.4s;
  -ms-transition: background linear 0.4s, box-shadow linear 0.4s;
  -o-transition: background linear 0.4s, box-shadow linear 0.4s;
  transition: background linear 0.4s, box-shadow linear 0.4s;
 }

 div.tag:hover 
 {
  -webkit-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.175);
  -moz-box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.175);
  box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.175);
  background:#FFFFE0;  
 }

 div.tag div.tag-text p
 {
  font-size: 110%;
  font-weight: bolder;
  color: silver;
 }

 div.tag div.tag-zahl p {
  margin-left: 8px;
  font-size: 120%;
  font-weight: bolder;
  color: limegreen;
/*  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.175); */ 
 }

 span.big300 {
  font-size: 300%;
 }
 
 div.unten {
  bottom:0px;
 }

 div.unten h4 {
  color: #666;
  margin-left: 3px;
 }

 div.tag.vorgestern div.unten h4,
 div.tag.gestern div.unten h4,
 div.tag.morgen div.unten h4,
 div.tag.uebermorgen div.unten h4 {
  font-size:  90%;
 }
 
 div.unten div.list-group,
 div.unten ul.list-group {
  margin-bottom: 0px;
 }
 
 div.heute  {
  min-height: 140px;
  width: 30%;
  margin: 2px;
  background:#E6FFA2;
 }
 
 div.morgen,
 div.uebermorgen {
  background: #E0FFFF;
 }

 img.angebot.sm  {
  margin-top: 20px;
 }

 div.list-group.gestern,
 div.list-group.vorgestern,
 ul.list-group.morgen,
 ul.list-group.uebermorgen  {
  font-size:  90%;
 }

@media (max-width: 767px) {
 div.tag  {
  width: 19.5%;
 }
 div.heute {
  width: 58%;
 } 
} 


/* ### Anleitung und Tutorial-Seite ### */

div.tutorial {
 padding: 16px 9px;
 border-bottom: 1px solid #DDD;
}

div.tutorial:hover {
 background-color: #F5F5F5;	
}

div.tutorial div.row div h3 {
 margin-top: 0px;
}

div.tutorial div.row div a.thumbnail {
 margin-bottom: 0px;
}

/* ### Doownload-Seite ### */

div.download {
 margin: 40px 0;
}

/* ### Support und Kommentar ### */

.support {
/* font-size: 90%; 
 min-height: 20px; */
 padding: 8px;
 margin: 40px 0 20px 0;
 background-color: #C0C0C0;
/* border: 1px solid #696969;
 border-radius: 8px; */
  -webkit-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.2);
}

.support div.media.kommentar{
 padding: 8px;
 margin-top: 8px;
 background-color: #FFFFFF;
}

.support h2{
 margin-top: 0;
}

.panel-body {
 background-color: #f5f5f5;
}

/* ### Rechte Spalte ### */

.box-right {
 font-size: 90%;
 min-height: 20px;
 padding: 8px;
 margin: 10px 0 20px 0;
 background-color: #FDFDFD;
 border: 1px solid #3071A9;
 border-radius: 8px;
/* -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.05);
 box-shadow: inset 0 1px 1px rgba(0,0,0,.1); */
 text-align: center;
}

.img-awards {
 max-width: 100%;
 width: auto;
 max-height: 100px;
 height: auto;
 padding: 0px;
 filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
 filter: gray; /* IE6-9 */
 -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
 filter:alpha(opacity=50); /* IE */
 opacity:0.5; /* allgemein */
 -moz-opacity:0.5; /* Mozilla */
 -khtml-opacity:0.5; /* KTHML */
 -opera-opacity:0.5; /* Opera */
}

.img-awards:hover {
 filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
 -webkit-filter: grayscale(0%);
 filter:alpha(opacity=0); /* IE */
 opacity:1; /* allgemein */
 -moz-opacity:1; /* Mozilla */
 -khtml-opacity:1; /* KTHML */
 -opera-opacity:1; /* Opera */
 -webkit-transition:opacity 0.5s ease;
 -moz-transition:opacity 0.5s ease;
 -o-transition:opacity 0.5s ease;
 transition:opacity 0.5s ease;
}

.box-right h3, p.side_header {
 margin-top: 10px;
 font-size: 22px;
 font-weight: 500;
}

p.side_subheader {
 margin-top: 10px;
 font-size: 18px;
 font-weight: 500;
}

a.bearbeiten {
 color: #FFF;
}

/* ### Fusszeile ### */

footer {
	padding: 40px 0px 3px 0px;
	margin-top: 50px;
	background: #222222;
	border-top: solid 3px #F5F5F5;
}

footer div.container.links {
	color: #F5F5F5;
}
footer div.copyright {
	padding: 10px 0px 2px 0px;
	margin: 20px 0;
	background: #F5F5F5;
}

.Soft { 
 font-weight: bold; 
 color:#F90; 
}

.klein {
 font-size: 90%;
 -webkit-text-size-adjust: 90%;
 -ms-text-size-adjust: 90%;
/* line-height: 10px; */  
}

.fixed-bottom {
 position: fixed;
 bottom: 0px;
 z-index: 30;
 width: 100%;
}

.fixed-bottom  div ul {
 width: 100%;
 text-align: center;
}

div#cookiehint {
  background-color:#d9edf7;
  padding: 5px 0;
	 opacity: 1;
  animation-duration: 3s;
 	animation-name: cookiehint_animation;
 	animation-play-state: running;  
}

div#cookiehint  p {
 padding-top: 5px;
}

@keyframes cookiehint_animation {
	from {
		opacity: 0.2;
	}
	to {
		opacity: 1;
	}
}

/* Google Werbung */
p.trenner {
 font-size:80%;
 width:100%; 
 text-align:center; 
 border-bottom: 1px solid #f4f5f7; 
 line-height:0.1em; 
} 
p.trenner span {
 background:#f4f5f7; 
 padding:2px 10px; 
}

.werbung_aside { width: 100%; }
@media(min-width: 768px) { .werbung_aside { width: 166px; } }
@media(min-width: 980px) { .werbung_aside { width: 220px; } }
@media(min-width: 1200px) { .werbung_aside { width: 270px; } }