/* CSS Stylesheet by dialog im netz http://dialog-im-netz.de
Kornkracher.de               */

@font-face {
	font-family: 'kk';
	src: url('/fonts/kk.eot');
	src: url('/fonts/kk.eot?#iefix') format('embedded-opentype'),
		url('/fonts/kk.woff2') format('woff2'),
		url('/fonts/kk.woff') format('woff'),
		url('/fonts/kk.ttf') format('truetype'),
		url('/fonts/kk.svg#DIN-Regular') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'kornkracher-nav';
	src: url('/fonts/kk-nav.eot');
	src: url('/fonts/kk-nav.eot?#iefix') format('embedded-opentype'),
		url('/fonts/kk-nav.woff2') format('woff2'),
		url('/fonts/kk-nav.woff') format('woff'),
		url('/fonts/kk-nav.ttf') format('truetype'),
		url('/fonts/kk-nav.svg#DINCondensedC') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'kornkracher-con';
	src: url('/fonts/kk-c.eot');
	src: url('/fonts/kk-c.eot?#iefix') format('embedded-opentype'),
		url('/fonts/kk-c.woff2') format('woff2'),
		url('/fonts/kk-c.woff') format('woff'),
		url('/fonts/kk-c.ttf') format('truetype'),
		url('/fonts/kk-c.svg#DINCondensedC') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'kornkracher-bold';
	src: url('/fonts/kk-b.eot');
	src: url('/fonts/kk-b.eot?#iefix') format('embedded-opentype'),
		url('/fonts/kk-b.woff2') format('woff2'),
		url('/fonts/kk-b.woff') format('woff'),
		url('/fonts/kk-b.ttf') format('truetype'),
		url('/fonts/kk-b.svg#DINAlternate-Bold') format('svg');
	font-weight: normal;
	font-style: normal;
}

html,blockquote,body,div,dl,dt,dd,fieldset,form,
h1,h2,h3,h4,h5,h6,ol,p,ul,li,center,hr,pre,img,
table,tr,td,th,thead,tbody,tfoot,caption  {
margin:0;
padding:0;
border:0 none;
}
body {
color: white;
background: #2d4456 url('/img/bg/start.jpg') center top no-repeat fixed;
background-size: cover;
font-family: 'kk', Arial, Helvetica, sans-serif;
overflow-y: scroll;
font-size: 15px;
}
h1 {
	clear: both;
}
a {
border:none;
outline: none;
color: white;
text-decoration: none
}
a:hover,
a:focus {
outline: none;
}
td {
vertical-align:top
}
p,ul {
margin: 0 0 1em 0
}
h2,h3  {
margin: 1em 0 .5em 0
}
h3 {
	font-size: 26px
}
p a {
	text-decoration: underline;
}
/*  :first-of-type */
table {
border-collapse: collapse
}
.tc {
text-align: center
}
.tr {
text-align: right
}
ul {
padding-left: 16px
}
li {
vertical-align:middle
}
.hide, .h0 {
display:none
}
img{
border: none;
height: auto;
 -ms-interpolation-mode: bicubic; 
}

sub {
position: relative; 
font-size: 9px; 
bottom: -4px;
font-weight: normal;
}
sup {
position: relative; 
font-size: 9px; 
top: -2px;
font-weight: normal;
}
.clear {
clear: both
}
.bildlinks,
.floatleft {
float: left;
margin: 0 10px 5px 0
}
.bildrechts,
.floatright {
float: right;
margin: 0 0 5px 10px
}
.klein{
font-size:11px;
}
.rot,
.red {
color: red
}
.deko {
text-decoration: underline;
}
.onlysmart {
display: none;
}

.hinweis {
	padding: 0 15px 15px;
	border: 4px solid #EA5B0C;
	margin: 20px auto;
	background-color: white;
	box-shadow: 0 5px 10px #000
}
#content .hinweis p,
#content .hinweis h2,
#content .hinweis p a {
		text-shadow: none;
		font-weight: bold;
	color: black;
}

h1.onlysmart {
width: 100%;
}
h1 img{
display: block;
float:left;
margin: 67px 0 16px 0;
width: auto;
}


div,
nav,
main,
section,
header,
article,
footer {
display: block;
position: relative;
box-sizing: border-box;
}

/* DIVS */ 
#wrapper {
margin:0 auto;
max-width:1440px;
height:auto;
padding: 0 20px 20px
}
#background {
display: none;
position: fixed;
z-index: 0;
top:0;
left:0;
max-width: 100vw;
max-height: 100vw;
width: auto;
height: auto;
}
#logo{
width:363px;
display: block;
float: left;
margin-left: -12px;
margin-right: 20px;
}
#content {
float: left;
width:calc(100% - 371px);
}
#nav {
display: inline-block;
z-index: 12;
white-space: nowrap;
float: left
}
#nav a {
font-family: 'kornkracher-nav', Arial, sans-serif;
color: white;
text-transform: uppercase;
text-decoration: none;
font-size: 26px;
letter-spacing: .06em;
display: inline-block;
opacity: .7;
padding: 20px 15px;
}
#nav a:first-of-type {
padding-left: 0
}
#nav a:last-of-type {
padding-right: 10px;
padding-bottom: 0
}
#nav a:hover,
#nav a.ac {
opacity: 1
}
#content article {
max-width: 450px;
hyphens: auto;
}
#content p,
#content li,
#contact p,
label {
margin-bottom: .5em;
text-shadow: 2px 2px #000;
}
#nav #navshop {
	display: none;
}
#shoplink {
	display: block;
	position: absolute;
	top: 168px;
	right: 0;
	height: 31px;
	overflow: hidden;
	padding: 0 80px 0 50px;
	background: #EA5B0C url('/img/buttons/kk-shop.png') 10px 3px no-repeat;
	color: white;
	font-family: kornkracher-nav;
	text-transform: uppercase;
	text-decoration: none;
	font-size: 26px;
	letter-spacing: .06em;
	box-shadow: -10px 20px 20px rgba(0,0,0,.6);
	z-index: 1000
}


#left {
	display: none;
clear: both;
min-height: 20px;
background-color: #998877
}
#content #left img:first-of-type {
margin-left: -10px;
}
#buttons {
position: fixed;
bottom: 0;
right:0;
padding: 20px;
white-space: nowrap
}

#bioland {
 margin: 0 10px 0 60px
}
#vollkornbaeckerei {
position: absolute; 
top:0;
right:40px;
z-index: 11
}
#footer {
position: relative;
max-width: 1060px;
margin: 0 auto;
padding-top: 20px;
clear:both;
} 
#footer img {
margin-right: 40px;
}
#footer img:last-of-type {
margin-right: 0
}

#mobilebutton span ,
#hidenav span  {
display: none
}
#toplink {
display: none
}
#startbanner {
	position: fixed;
	top: 70px;
	left: 50%;
	max-width: 540px;
	background-color: #E85C13;
	padding: 7px 20px;
	text-align: center;
	color: white;
	font-size: 20px;
	font-weight: bold;
	box-shadow: 0 5px 10px #000;
	z-index: 11
}

/* FORMULAR */
form {
padding-top:30px;
background-color: transparent;
width: 100%;
	max-width: 400px

}
input, textarea, select, button {
box-sizing: border-box;
margin:0 0 20px 0  ;
background-color: transparent;
color: black;
}
input, textarea,select {
background: transparent url(/img/bg/formbg.png) 0 0 repeat-x;
border-width: 1px; 
padding: 2px 4px;
width: 100%;
}
textarea {
height: 100px;
}

label {
display: block;
margin-bottom: 10px
}


input.short {
width: 80px;
}
input:hover,
textarea:hover,
select:hover {
background-color: #ffffff;
}
#submit {
background-image: none;
background-color:#e7ebed;
color: black;
text-align: center;
width: auto;
border-width: 2px ;
font-weight: bold;
color:#334e63;
}
p.meldung,
p.meldungok {
	position: fixed;
	top: 40px;
	left: 20px;
font-weight: bold;
font-size: 1.3em;
text-align:left;
background-color: #fff;
color: black;
text-shadow: none!important;
padding: 5px;
box-shadow: 3px 2px 7px #000
}
#E-mail {
display: none
}
.meldungok {
transition: fadeOut 5s;
}

.imglist{
	padding: 20px 0;
}
.imglist img {
	width:auto;
	height:  100px;
	float:left;
	display: inline-block;
	margin: 0 10px 10px 0
}
.doclist {
	clear: both;
}
.doclist a{
display: block;
padding: 15px 10px 25px 50px;
background: transparent url('/img/buttons/pdf-128.png') 0 0 no-repeat; 
background-size: 50px auto;
}
.olFramedCloudPopupContent{
    background-color: white;
    border: 1px solid grey;
}
@media screen and (min-width: 1400px) {

#content {
padding-left: 40px
}
}
@media screen and (max-width: 1150px) {
#logo {
width: 242px;
}
}
@media screen and (max-width: 1040px) {
h1 img {
width: auto;
height: 50px;
margin-top: 0
}


#nav {
white-space: normal;
margin-right: 230px;
margin-bottom: 20px
}
#nav a {
padding: 5px 10px 5px 0;
display: block;
float: none
}
}
@media screen and (max-width: 700px) {
body {
background-image: url('/img/bg/mobil.jpg');
background-size: cover;
background-repeat: repeat;
}

#submit {
font-size: 1em
}
#wrapper {
padding: 0 20px
}
#head,
#content,
#content #left,
#content #right{
width: 100%;
max-width: 950px;
margin: 20px 0 0;
padding:0;
}
#content #right,
#content #left {
margin:0;
padding:0
}
#content img {
display: inline-block;
float: none;
margin:0 auto 20px auto;
}

#head {
margin-top: 0
}
#logo {
margin:0 0 0 -15px
}
h1 img{
max-width: 100%;
height: auto;
margin-top: 0
}
#nav {
position: fixed;
top:-100%;
left:0;
margin: 0;
white-space: normal;
width: 100%;
padding: 10px;
transition: .3s
}
#nav a{
color: #5b89ac;
width: 100%;
margin: 0;
padding: 4px 0 2px 0;
opacity: 1;
font-size: 1.4em;
}
#nav a:hover,
#nav a.ac {
color: #243848;
}
#nav a::before {
  content: "";
  position: absolute;
  top: -10px; 
  left: -10px;
	right: 0;
	bottom:-10px;
  opacity: .3; 
  z-index: -1;
  background-color:white;
}
#nav_prod,
#nav_prod img {
display: none;
}
#nav #navshop {
	display: block;
}
#shoplink {
	display: none;
}
#vollkornbaeckerei {
width:160px;
}
#mobilebutton,
#hidenav {
position: fixed;
display: block;
top: 20px;
right: 10px;
height: 50px;
width: 50px;
background: transparent url(/img/buttons/hh.png) 0 0 no-repeat;
z-index: 30
}
#hidenav{
background-image: url(/img/buttons/ha.png);
display: none;
z-index: 31
}
#buttons {
clear: both;
float: left;
position: relative;
display: block;
bottom: auto;
right:auto;
margin:0;
padding: 40px 0 0 0;
width: auto;
}
#toplink {
display: block;
position: relative;
width: 48px;
height: 25px;
background: url(/img/buttons/top.gif) center center no-repeat;
background-color:transparent;
}
#bioland {
}

.onlysmart {
display: block;
}
input,
textarea {
	
	width: 100%; 
	min-width: none;
	max-width: none;
}
}

@media screen and (max-width: 400px) {
#buttons {
margin-bottom: 20px
}

}

@media print {

}