/*******************isio-design aus osnabrueck ***********************/

html {
    min-height: 101%;

}
body {
  font-family: calibri,Verdana,Arial,sans-serif;
  margin: 0px;
  padding: 0px;

}

#container {
	margin: 0;
	padding: 0;
	height: 100%;
	width: 100%;
	float:left;


}

/*******************layout oben ***********************/


#oben{
	padding: 0px;
	width: 100%;
	position:fixed;
	top:0;
	left:0;
	z-index:10000;
	background-image: url(../images/rot.jpg);
}

#rot{
	padding: 0px;
	width: 100%;
	background-image: url(../images/buch-rot.jpg);
    background-repeat:no-repeat;
    background-position:center;
	
	
}

#header {
	margin: 0px;
	padding: 0px;
	max-width: 979px;
	margin:auto auto;

}

#topmenu {
	height:25px;
	float:left;
	width:300px;
	margin:8px 0px;

}

#slogan{
    float:left;
	margin:0px;
	padding:0px;
}


#logo {
	float:left;
	width:20%;
	margin:5px;
	padding:15px;
	height:60px;
}

#header-rechts{width:250px;float:right;}

#warenkorb {
	float:left;
	width:100%;
	margin:5px 10px;
	padding:0px;

}

#search{
    float:left;
	width:100%;
	margin:0px;
	padding:0px;
}


/******************* navi-leiste ***********************/

#gelb {
	padding:0;
	margin:0;
	width: 100%;
	float:left;
	height:40px;
	background-color:#ffeec5;
	-webkit-box-shadow: 0px 10px 15px -1px rgba(31,31,31,0.6);
    -moz-box-shadow: 0px 10px 15px -1px rgba(31,31,31,0.6);
    box-shadow: 0px 10px 15px -1px rgba(31,31,31,0.6);


}

#navi {
	margin: 0px;
	padding: 0px;
	max-width:979px ;
	margin:auto auto;
}

#menu {
	margin:auto auto;
	width:auto;
}


/*******************layout inhalt ***********************/

#inhalt {
	padding:0;
	margin-top:150px;
	width: 100%;
	float:left;
    background:#f2f2f2;

}

#content {
	margin: 0px;
	padding: 15px 5px;
	max-width: 979px;
	margin:auto auto;
}

#component {padding:0px;}




.leading-0{width:95%; padding:5px 15px;}


.item.column-1, .item.column-2, .item.column-3{
	float:left;
	width:95%;
    padding:5px 10px;
	margin:5px 10px;
}

#breadcrumb{

	float:left;
	max-width: 979px;
	margin:auto auto;
	
}

/*******************layout grau ***********************/

#grau {
	padding:0;
	margin:0;
	width: 100%;
	float:left;
	background-color:#ffeec5;
	min-height:100px;
	-webkit-box-shadow: 0px 10px 80px #444;
    -moz-box-shadow: 0px 10px 80px #444;
    box-shadow: 0px 10px 80px #444;

}

#boxes {
	margin: 0px;
	padding: 0px;
	max-width: 979px;
	margin:auto auto;

}

#box1, #box2, #box3 {
	float:left;
	border:1px solid #681212;
	width:97%;
	
}




/*******************layout unten ***********************/

#unten{
	background:#681212;
	padding: 0px;
	min-height:250px;
	width: 100%;
	float:left;
	border-top:1px solid #fff;


}

#footer{
	margin: 0px;
	padding: 0px;
	max-width: 979px;
	margin:auto auto;
}


#box4, #box5, #box6 {
	float:left;
    padding:10px;
	margin:15px 7px;
	width:97%;
	

}




/******************************** schriften **********************************/




h1{
	font-family: Calibri,Verdana, Arial, Helvetica, sans-serif;
	font-size:35px;
	font-weight: bold;
	color:#681212;
    line-height:40px;


}
h2{
	font-family: calibri, Verdana, Arial, Helvetica, sans-serif;
	font-size: 25px;
	font-weight: nprmal;
	color: #888;
	text-decoration: none;
	letter-spacing:1pt;
}
h3{
	font-family: calibri,Verdana, Arial, Helvetica, sans-serif;
	font-size: 28px;
	font-weight: bold;
	color: #681212;
	text-decoration: none;
 
}
h4{
	font-family: calibri,Verdana, Arial, Helvetica, sans-serif;
	font-size: 20px;
	font-weight:bold;
	color: #999;
	text-decoration: none;
	margin:0px;
}
h5{
	font-family: calibri,Verdana, Arial, Helvetica, sans-serif;
	font-size: 22px;
	font-weight: normal;
	color:#7Ed5f4;
	text-decoration: none;
	line-height:42px;
	margin:0px;
}
h6{
	font-family: calibri, Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	color: #ffeec5;
	text-decoration: none;
	margin:0px;
	letter-spacing:0.5pt;
}


code {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: bold;
    color: #681212;
    text-decoration: none;
    letter-spacing: 1pt;
	background:transparent;
	padding:0;
	margin:0;

}

p{
	font-family: Calibri, Verdana,Arial,Helvetica,sans-serif;
	font-weight: normal;
	color: #898989;
	text-decoration: none;
	margin:0px;
	font-size:12px;
	line-height:20px;
	
}

div{margin:0px; padding:0px;}


.contentheading {
    color: #FFFFFF;
    font-family: calibri, Verdana,Arial,Helvetica,sans-serif;
    font-size: 16px;
    font-weight: bold;
    letter-spacing: 1px;
    text-decoration: none;
}

.custom_box p{
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: normal;
  color: #fff;
  text-decoration:none;
}


/****************************** links *************************************/

a{
  font-family: calibri, Verdana, Arial, Helvetica, sans-serif;
  font-size: 20px;
  font-weight: normal;
  color:#681212;
  text-decoration: none;

}

a:hover{
  font-family: calibri, Verdana, Arial, Helvetica, sans-serif;
  font-size: 20px;
  font-weight: normal;
  text-decoration: underline;
  color:#888;

}

a.btn{
  font-family: calibri, Verdana, Arial, Helvetica, sans-serif;
  font-size: 20px;
  font-weight: normal;
  color: #444;
  text-decoration: none;

}

a.btn:hover{
  font-family: calibri, Verdana, Arial, Helvetica, sans-serif;
  font-size: 20px;
  font-weight: normal;
  color: #fff;
  text-decoration:none;

}

.custom_ul a{
  font-family: calibri, Verdana, Arial, Helvetica, sans-serif;
  font-size: 15px;
  font-weight: normal;
  color: #c2c2c2;
  text-decoration: none;
  line-height:22px;

}

.custom_ul a:hover{
  font-family: calibri, Verdana, Arial, Helvetica, sans-serif;
  font-weight: normal;
  text-decoration: underline;
  color: #b3ce00;

}

.custom_fussmenu a{
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: normal;
  color:#fff;
  text-decoration: none;
  letter-spacing:0.5pt;
  padding:10px 0px;

}

.custom_fussmenu a:hover{color: #ffeec5;text-decoration: underline;font-size: 16px;}

.custom_topmenu a{
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 10px;
  font-weight: normal;
  color:#fff;
  text-decoration: none;
  letter-spacing:0.5pt;
  padding:10px 0px;

}

.custom_topmenu a:hover{color: #ffeec5;text-decoration: underline;font-size: 10px;}



/******************* bilder ***********************/

img {
    border: medium none;
	
}

.schatten{     
        -moz-box-shadow: 5px 5px 10px #666;
        -webkit-box-shadow: 5px 5px 10px #666;
        box-shadow: 5px 5px 10px #666;
        filter:progid:DXImageTransform.Microsoft.Shadow(strength=3,color=#666666,direction=135);
		margin:0px 25px 5px 0px;
		
}



/****************************** Haupt-navileiste *************************************/

.navbar-collapse.collapse {
	width:95%;
	margin:auto auto;}


.navbar-default {
    background: none;
    border: none;
}

.navbar {
    border-radius: 0px;
}

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
    color: #555;
    background-color: transparent;
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    color: #d2d2d2;
	font-weight:bold;
	background: none;
}

.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
    color: #d2d2d2;
    background: none;
	font-weight:bold;
}

.navbar-default .navbar-nav > li > a {
    color: #681212;
    font-weight:bold;

}

.navbar-default .navbar-nav > li > a:hover {
    color: #d2d2d2;

}

.navbar-toggle{
	background-color:#fff;
	margin:0px;
	height:27px;
	padding:2px 10px;
	float:left;
}

.navbar-collapse{
	background-color:#666;
}

.container{width:97%;}

/****************************** Box-navileiste *************************************/

.nav-justified {
	margin:0;
	padding:0;
	
}

.nav-justified li {
	padding:0px 1%;
	float:left;
	width:100%;

	
}


.nav.nav-justified li a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 16px;
	font-weight: normal;
	text-decoration: none;
	color:#681212;
	letter-spacing:1pt;

}

.nav.nav-justified li a:hover {
	background:none;
	text-decoration: underline;

}

.moduletable_boxmenu h3{
	background:#681212;
	color:#fff;
	text-align:center;
	font-size:28px;
	padding:5px;
	margin:5px 0px;
	font-weight:normal;
	
}


/************************************* Suche ******************************************/

#search > div > form > label {display:none;}

div.mod_search90 input[type="search"] {
    width: auto;
    background-color:#ffeec5;
    border:transparent;
    border-radius:5px;
	margin:10px;
}

.phrases, .only{display:none;}

.form-limit, .searchintro{margin:20px 0px;}

/************************************* Kontaktformular ******************************************/



#jform_contact_name, #jform_contact_email, #jform_contact_emailmsg {
    background: none repeat scroll 0 0 #f8f8f8;
    border: 1px solid #898989;
    margin: 5px 10px;
    padding: 3px;
    width:50%;
    height:40px;
}
#jform_contact_message {
    background: none repeat scroll 0 0 #f8f8f8;
    border: 1px solid #898989;
    margin: 5px 10px;
    padding: 3px;
	width: 60%;
	height:90px;

}

input[type="radio"], input[type="checkbox"] {
    margin: 20px;
    margin: 5px 15px;
    line-height: normal;
	zoom:1.7;
}

.page-header {
    padding-bottom: 0px;
    margin:0px;
    border:none;
}

.btn-primary {
    color: #fff;
    background-color:#681212;
    border-color: #888;
	margin:10px 0px 30px 0px;
}

.btn-primary:hover {
	background-color:#ffeec5;
	color:#000;
}


label{float:left}
.control-group{margin:30px 10px;}
.hasTooltip {color:#888;}
.contact {padding:15px;}
.well{background:none;border:none;padding:0px;}
.optional{float:left; margin:0px 5px}

.contact h3 {display:none;}

.contact-street{
	font-size:18px;
	font-weight: normal;
	color:#681212;
}

.contact h2 {
    font-family: Calibri,Verdana, Arial, Helvetica, sans-serif;
	font-size:35px;
	font-weight: bold;
	color:#681212;
    line-height:40px;
	margin-left:15px;

	
}
.required, .hasTip, legend {
    color: #888;
    font-family: calibri,Arial,Helvetica,sans-serif;
    font-size: 14px;
    font-weight: normal;
    text-decoration: none;
}
#component > div > div.thumbnail.pull-right{
	width:100%;
	background:transparent;
	border:none;
	margin:30px 5px 15px -6px;
}

#component > div > div.thumbnail.pull-right img{
	width:12%; 
	float:left;
	margin:0px;

}

/************************************* preise ******************************************/

.vm3pr-1 {
    margin-left: 25%;

}

.product-price {

    margin: 0 0px 10px 30px;
}





/************************************* mediapoints ab 320 ******************************************/

@media screen and (min-width:320px) {
	
.item.column-0, .item.column-1, .item.column-2, .item.column-3 {
	float:left;
	width:96%;
    padding:5px;
	margin:1%;
}

h1{font-size:26px;}
h2{font-size:20px;}
h3{font-size:18px;}
p{font-size:18px;}



.item-page{padding:0px 15px;}

	
	
.navbar-default .navbar-nav > li > a {
    font-size: 15px;
	padding:3px 13px;
	letter-spacing:0pt;
}

#box1, #box2, #box3 {padding:0px 15px;}

}

@media screen and (min-width:320px) and (max-width:767px) {
	
#oben {height:90px;}

#rot {height:70px;}

#gelb {height:30px;}

#inhalt {margin-top:95px;}
	
#topmenu {width:15%;}

#logo {
	
	width:25%;
	margin:5px;
	padding:5px;
	height:40px;
}
.custom_logo img{width:80%; height:auto;}

#header-rechts {width:150px;}

div.mod_search90 input[type="search"] {
    width: 140px;
	margin:3px;
	height:20px;
}
	
.custom_warenkorb img{width:60%; height:auto;}

.custom_topmenu a{
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 10px;
  font-weight: normal;
  color:#fff;
  text-decoration: none;
  letter-spacing:0pt;
  padding:0px;
  display:block;
  text-align:left;
  margin:0px;
  line-height:0px;

}
	
	
}


/************************************* mediapoints ab 521 ******************************************/

@media screen and (min-width:521px) {
	
.item.column-0, .item.column-1, .item.column-2, .item.column-3 {
	float:left;
	width:45%;
    padding:0px;
	margin:8px;
}


}

/************************************* mediapoints 768 ******************************************/

@media screen and (min-width:768px) {
 
.custom_logo img{}

.custom_warenkorb img{}

#topmenu {width:40%;}


.navbar-collapse{
	background:none;
}

.navbar-default .navbar-nav > li > a {
    font-size: 20px;
	padding:10px 20px;
	letter-spacing:0pt;
}

h1{font-size:30px;}
h2{font-size:22px;}
h3{font-size:24px;}
p{font-size:18px;line-height:24px;}
a{font-size:18px;line-height:24px;}



#box1, #box2, #box3 {
	width:31%;
	margin:30px 1%;
	padding:0px 5px;
	min-height:230px;
}
.item.column-0, .item.column-1, .item.column-2, .item.column-3 {
	float:left;
	width:47%;
    padding:5px;
	margin:1%;
}

.dl-horizontal dd {margin-left: 0px;}


.navbar-default .navbar-nav > li > a {
    font-size: 16px;
	padding:12px 16px;
	
}

	
	
}

/************************************* mediapoints 978 ******************************************/

@media screen and (min-width:978px) {
 

#oben {height:140px;}

#rot {height:100px;}

#inhalt {margin-top:150px;}

.custom_logo img{}

.custom_warenkorb img{}

.navbar-default .navbar-nav > li > a {
    font-size: 20px;
	padding:12px 20px;
	
}

.item.column-0, .item.column-1, .item.column-2, .item.column-3 {
	float:left;
	width:31%;
    padding:0px;
	margin:1%;
}

h1{font-size:35px;}
h2{font-size:25px;}
h3{font-size:28px;}


}

/************************************* mediapoints 1025 ******************************************/

@media screen and (min-width:1025px) {
	
.navbar-default .navbar-nav > li > a {
    font-size:21px;
	padding:12px 21px;
	
}

p{font-size:20px;line-height:24px;}
a, a:hover{font-size:20px;line-height:24px;}

}