/*------------------------- GRUNDGERUEST-------------------------- */
* {
	box-sizing: border-box;
}

html {height: 101%;}
body {
    background-image: url('../images/HG.jpg');
    background-repeat: repeat-x;
    background-color: #fefefe;
    margin: 0;
    padding: 0;
    font-family: Arial, sans-serif;
    font-size: 12px;
    color: #8c8c8c;
    background-color: #b2b3b5;
    height: 101%;
}

#div_main {
    margin: 0 auto;
    padding: 0;
	width: 100%;
    max-width: 980px;
    position: relative;
}

img {
	display: block;
	border: none;
	margin: 0;
	max-width: 100%;
	/*height: auto;*/
}
  
a {
    text-decoration: none;
    text-transform: none;
    color: #C40000;
}

a:hover {
	text-decoration: underline;
}

ul {
    text-decoration: none;
    text-transform: none;
    list-style: none;
}

#div_contentbereich:after,
#bildauswahl1:after,
#div_footer ul:after {
	content: '.';
	display: block;
	width: 100%;
	height: 0;
	opacity: 0;
	visibility: hidden;
	margin: 0;
	padding: 0;
	clear: both;
}

/*-------------------------Kopfbereich-------------------------- */
img.sortiment_logo {
	margin: 15px;
}

#div_kopfbild {
	width: 100%;
    max-width: 980px;
    height: 200px;
    background-image: url('../images/kopfbild.jpg');
    background-position: top;
    background-repeat: no-repeat;
    margin: 0 auto;
    padding: 0;
    position: relative;
}

div#div_inhalt div.buero_teaser {
	float: left;
	width: 95px;
	height: 122px;
	text-align: center;
	background-color: #B2B3B5;
    border: 1px solid #A4A6A8;
    margin: 0 45px 45px 0;
}

div#div_inhalt div.buero_teaser p {
	width: 95px;
	overflow: hidden;
	color: #ffffff;
}

div#div_inhalt ul {
	padding: 0;
	margin: 10px 0 10px 25px;
}

div#div_inhalt ul li {
	padding: 2px;
	margin: 0;
}

/*-------------------------Navi Top 2-------------------------- */
.menueBtn {
	background-image: url('../images/bg-button-menu.png');
	background-repeat: no-repeat;
	background-position: 14px center;
	width: 100%;
	height: 42px;
	padding: 6px 10px;
	text-indent: 44px;
	color: #000;
	background-color: #B2B3B5;
	line-height: 32px;
	font-size: 16px;
	text-align: left;
	cursor: pointer;
	border-bottom: 1px solid #fff;
}

#div_kopfbild ul {
	max-height: 0;
	opacity: 0;
	margin: 0;
	padding: 0;
    visibility: hidden;
    -transition: visibility 0s linear .9s, max-height .9s ease-in-out, opacity .9s ease-in-out;
    -moz-transition: visibility 0s linear .9s, max-height .9s ease-in-out, opacity .9s ease-in-out;
    -webkit-transition: visibility 0s linear .9s, max-height .9s ease-in-out, opacity .9s ease-in-out;
    transition: visibility 0s linear .9s, max-height .9s ease-in-out, opacity .9s ease-in-out;
	background-color: #B2B3B5;
}

#div_kopfbild ul.showMen {
	visibility: visible;
    max-height: 500px;
    opacity: 1;
    transition-delay: 0s;
}

#div_kopfbild ul li {
    padding: 10px 5px 10px 0;
    display: block;
	width: 100%;
}

#div_kopfbild ul li.kontaktimpressum {
    display: block;
}

#div_kopfbild ul li a {
    color: #ffffff;
    font-size: 14px; 
}

#div_kopfbild ul li a:hover {
    color: #c40000;
}

/*-------------------------Untermenue-------------------------- */
#div_contentbereich {
    width: 100%;
	max-width: 980px;
	height: auto;
    background-color: #ffffff;
    margin-top: 0;
    text-align: left;  
}

#div_untermenue {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    position: relative;
    background-color: #ffffff;
    float: left;
    font-weight: bold;
}

#div_untermenue ul,
#div_untermenue ul ul  {
	display: none;
    width: 100%;
	max-width: 220px;
    margin: 20px 0 5px 40px;
    padding: 0;
    height: auto;
}

#div_untermenue ul ul {
    margin: 5px 0;
    background-color: #ffffff;
}

#div_untermenue ul li,
#div_untermenue ul ul li,
#div_untermenue ul li #ctl00_a_shop {
    margin: 5px 0;
    padding: 0;
	background-color: #A4A5A7;
	height: 28px;
	overflow: visible;
}

#div_untermenue ul ul li {
	background-color: #CFD1D0;
}

#div_untermenue ul li #ctl00_a_shop {
    display: block;  
    padding: 6px 5px 6px 20px;
	background-color: #d20071;
}

#div_untermenue ul li a,
#div_untermenue ul ul li a {
    background-image: url('../images/pfeil_weiss.gif');
    background-repeat: no-repeat;
    background-position: 205px 8px;
    display: block;  
    padding: 6px 5px 6px 20px;
    color: #ffffff;
}

#div_untermenue ul li a:hover {
    background-color: #c40000;
}

#div_untermenue ul ul li a {
    padding: 6px 5px 6px 40px;
}

#div_untermenue > a {
	display: inline-block;
	margin-bottom: 20px;
}

/*-------------------------Direktlinks-------------------------- */
#div_direktlinks {
    margin: 0;
    padding: 0;
    width: 0;
}

#div_direktlinks p {
    font-size: 12px;
    color: #b3b3b3;
    border-top: 1px solid #dadada;
    border-bottom: 1px solid #dadada;
    margin: 40px 0 10px 40px;
    padding: 3px 0;
}

#div_direktlinks p.p2 {
    text-align: justify;
    border: none;
    margin: 10px 0 20px 40px;
    display: block;
    width: 195px;
}

#div_direktlinks p.p2 a {
    color: #b3b3b3;
    font-weight: bold;
    text-align: justify;
    font-size: 11px;
    text-decoration: none;
}

#div_direktlinks p.p2 a.a2 {
    color: #b3b3b3;
    font-weight: normal;
    text-align: justify;
    font-size: 12px;
    text-decoration: none;
}

#div_direktlinks p.p2 a:hover {
    color: #003375;
}

/*-------------------------Content-------------------------- */
#div_content {
	width: 100%;
    /*max-width: 650px;*/
    background-color: #ffffff;
    margin: 10px 0 0;
    padding: 0;
    float: right;
}

#div_inhalt {
	width: 100%;
	/*max-width: 620px;*/
    margin: 20px 0;
    padding: 0;
    color: #707070;
	padding: 0 10px;
}

#div_inhalt p {
	width: 100%;
	/*max-width: 600px;*/
    margin: 0 0 30px;
    padding: 0;
    color: #707070;
    float: left; 
}

#div_content p a {
    color: #C40000;
}

#div_content ul li {
    list-style-type: square;
    margin: 0;
    padding: 1px 0 0; 
}

#div_content ul li a {
    color: #02afee;
    text-decoration: none;
}

.anfahrt {
	padding-bottom: 0 !important;
}

div.subNavMobile {
	width: 100%;
	clear: both;
}

div.subNavMobile a {
	background-image: url("../images/pfeil_weiss.gif");
	background-color: #c40000;
	background-position: 205px 8px;
	background-repeat: no-repeat;
	color: #ffffff;
	display: block;
	width: auto;
	max-width: 220px;
	margin: 4px 0;
	padding: 6px 5px 6px 20px;
}

/*-------------------------Bild Content-------------------------- */
#bildauswahl1 {
    background-color: #ffffff;
    text-align: center;
    padding: 0 10px;
    margin: 0;
	width: 100%;
	height: auto;
}

#buerobedarf,
#bueromoebel,
#bueromaschinen {
    background-color: #b2b3b5;
    padding: 0;
    margin: 14px auto 14px;
	border: 1px solid #a4a6a8;
    width: 171px;
    height: 273px;
	text-align: center;
}

#buerobedarf:hover,
#bueromoebel:hover,
#bueromaschinen:hover {
    background-color: #c40000;   
}

#buerobedarf a,
#bueromoebel a,
#bueromaschinen a {
    color: #ffffff;
    padding: 35px 0 0;
    margin: 10px 0 0;
    font-weight: bold;
    text-align: center;
}

#buerobedarf img,
#bueromoebel img,
#bueromaschinen img {
	display: inline-block;
}

.bueromaschinenBild {
	display: none;
}

div.images img,
div.sortimen_stuhl img,
div.sortiment_schreibtische img,
div.sortiment_schrank img,
div.sortiment_objekt img {
	display: inline-block;
}

/*--------------------Ueberschriften Content------------------------ */
h1 {
    margin: 0;
    font-size: 18px;
    color: #c40000;
    font-weight: bold;
}

h2 {
    margin: 6px 0 12px;
    padding: 0;
    font-size: 16px;
    color: #a5a6a8;
    font-weight: bold;
}

/*--------------------Footer------------------------ */
#div_footer {
    margin: auto;
    padding: 2px 10px 0;
    width: 100%;
    max-width: 980px;
    background-color: #989898;
    clear: both;
}

#div_footer ul {
    margin: 0;
    padding: 10px 0;
    font-size: 12px;
    width: 100%;
	max-width: 980px;
}

#div_footer ul li {
    margin: 6px 0;
    padding: 0;
	width: 50%;
	float: left;
}

#div_footer ul li a {
    color: #ffffff;
	display: block;
	width: 100%;
	height: 100%;
}

#div_footer ul li a:hover {
    color: #c40000;
}

#div_footer ul li.li1,
#div_footer ul li.li2 {
	width: 100%;
	text-align: center;
}

#div_footer ul li.li2 a,
#div_footer ul li.li1 {
    color: #c8c8ca;
}

/*-------------------- Galerie Planung -------------------------------*/
#gallery {
	background-color: #444;
	padding: 10px;
	width: 100%;
	max-width: 520px;
}
		
#gallery ul { 
	list-style: none; 
}
	
#gallery ul li { 
	display: inline; 
}
	
#gallery ul img,
#gallery ul a:hover img  {
	border: 5px solid #3e3e3e;
	border-width: 5px 5px 20px;
}
		
#gallery ul a:hover img {
	border: 5px solid #fff;
	color: #fff;
}
	
#gallery ul a:hover { 
	color: #fff; 
}

#jquery-overlay {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
}

#jquery-lightbox {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
}

#jquery-lightbox a img {
	border: none;
}

#lightbox-container-image-box {
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
}

#lightbox-container-image {
	padding: 10px;
}

#lightbox-loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}

#lightbox-nav {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}

#lightbox-container-image-box > #lightbox-nav {
	left: 0;
}

#lightbox-nav a {
	outline: none;
}

#lightbox-nav-btnPrev,
#lightbox-nav-btnNext {
	width: 49%;
	height: 100%;
	zoom: 1;
	display: block;
}

#lightbox-nav-btnPrev { 
	left: 0; 
	float: left;
}

#lightbox-nav-btnNext { 
	right: 0; 
	float: right;
}

#lightbox-container-image-data-box {
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%;
	padding: 0 10px 0;
}

#lightbox-container-image-data {
	padding: 0 10px; 
	color: #666; 
}

#lightbox-container-image-data #lightbox-image-details { 
	width: 70%; 
	float: left; 
	text-align: left; 
}	

#lightbox-image-details-caption {
	font-weight: bold;
}
	
#lightbox-image-details-currentNumber {
	display: block; 
	clear: left; 
	padding-bottom: 1em;	
}			

#lightbox-secNav-btnClose {
	width: 66px; 
	float: right;
	padding-bottom: 0.7em;	
}	

/* Büromöbel Links */
a.moebel_link {
	float: left;
}

@media (min-width: 480px) {
	
}

@media (min-width: 623px) {
	#buerobedarf,
	#bueromoebel,
	#bueromaschinen {
		background-color: #b2b3b5;
		padding: 0;
		margin: 10px 30px 0 0;
		border: 1px solid #a4a6a8;
		float: left;
		width: 171px;
		height: 273px;
	}
}

@media (min-width: 768px) {
	div.teaserWrap {
		max-width: 70%;
	}
	
	.bueromaschinenBild {
		display: block;
		width: 170px;
	}
}

@media (min-width: 980px) {
	/*-------------------------Kopfbereich-------------------------- */
	img.sortiment_logo {
		margin: 15px;
	}

	#div_kopfbild {
		width: 100%;
		max-width: 980px;
		height: 200px;
		background-image: url('../images/kopfbild.jpg');
		background-position: top;
		background-repeat: no-repeat;
		margin: 0 auto;
		padding: 0;
		position: relative;
	}

	div#div_inhalt div.buero_teaser {
		float: left;
		width: 95px;
		height: 122px;
		text-align: center;
		background-color: #B2B3B5;
		border: 1px solid #A4A6A8;
		margin: 0 45px 45px 0;
	}

	div#div_inhalt div.buero_teaser p {
		width: 95px;
		overflow: hidden;
		color: #ffffff;
	}

	div#div_inhalt ul {
		padding: 0;
		margin: 10px 0 10px 25px;
	}

	div#div_inhalt ul li {
		padding: 2px;
		margin: 0;
	}

	/*-------------------------Navi Top 2-------------------------- */
	.menueBtn {
		display: none;
	}

	#div_kopfbild ul {
		position: absolute;
		top: 12px;
		left: 50px;
		padding: 0;
		margin: 0;
		list-style: none;
		float: left;
		max-height: 500px;
		opacity: 1;
		background-color: transparent;
		visibility: visible;
	}

	#div_kopfbild ul li {
		padding: 10px 5px 0 0;
		margin: 0 0 0 5px;
		display: inline;
	}

	#div_kopfbild ul li.kontaktimpressum {
		margin-left: 215px;
		display: inline;
	}

	#div_kopfbild ul li a {
		color: #ffffff;
		font-size: 10px; 
	}

	#div_kopfbild ul li a:hover {
		color: #c40000;
	}

	/*-------------------------Untermenue-------------------------- */
	#div_contentbereich {
		width: 100%;
		max-width: 980px;
		height: auto;
		background-color: #ffffff;
		margin-top: 0;
		text-align: left;  
	}

	#div_untermenue {
		width: 100%;
		max-width: 280px;
		height: auto;
		margin: 0;
		padding: 0 40px 0 0;
		position: relative;
		background-color: #ffffff;
		float: left;
		font-weight: bold;
		min-height: 500px;
	}

	#div_untermenue ul,
	#div_untermenue ul ul  {
		display: block;
		width: 100%;
		max-width: 220px;
		margin: 20px 0 5px 40px;
		padding: 0;
		height: auto;
	}

	#div_untermenue ul ul {
		margin: 5px 0;
		background-color: #ffffff;
	}

	#div_untermenue ul li,
	#div_untermenue ul ul li,
	#div_untermenue ul li #ctl00_a_shop {
		margin: 5px 0;
		padding: 0;
		background-color: #A4A5A7;
		height: 28px;
		overflow: visible;
	}

	#div_untermenue ul ul li {
		background-color: #CFD1D0;
	}

	#div_untermenue ul li #ctl00_a_shop {
		display: block;  
		padding: 6px 5px 6px 20px;
		background-color: #d20071;
	}

	#div_untermenue ul li a,
	#div_untermenue ul ul li a {
		background-image: url('../images/pfeil_weiss.gif');
		background-repeat: no-repeat;
		background-position: 205px 8px;
		display: block;  
		padding: 6px 5px 6px 20px;
		color: #ffffff;
	}

	#div_untermenue ul li a:hover {
		background-color: #c40000;
	}

	#div_untermenue ul ul li a {
		padding: 6px 5px 6px 40px;
	}

	#div_untermenue > a {
		margin-bottom: 0;
	}

	/*-------------------------Direktlinks-------------------------- */
	#div_direktlinks {
		margin: 0;
		padding: 0;
		width: 0;
	}

	#div_direktlinks p {
		font-size: 12px;
		color: #b3b3b3;
		border-top: 1px solid #dadada;
		border-bottom: 1px solid #dadada;
		margin: 40px 0 10px 40px;
		padding: 3px 0;
	}

	#div_direktlinks p.p2 {
		text-align: justify;
		border: none;
		margin: 10px 0 20px 40px;
		display: block;
		width: 195px;
	}

	#div_direktlinks p.p2 a {
		color: #b3b3b3;
		font-weight: bold;
		text-align: justify;
		font-size: 11px;
		text-decoration: none;
	}

	#div_direktlinks p.p2 a.a2 {
		color: #b3b3b3;
		font-weight: normal;
		text-align: justify;
		font-size: 12px;
		text-decoration: none;
	}

	#div_direktlinks p.p2 a:hover {
		color: #003375;
	}

	/*-------------------------Content-------------------------- */
	#div_content {
		width: 100%;
		max-width: 650px;
		background-color: #ffffff;
		margin: 10px 0 0;
		padding: 0;
		float: right;
	}

	#div_inhalt {
		width: 100%;
		max-width: 620px;
		margin: 20px 0 0;
		padding: 0;
		color: #707070;
		float: left;
	}

	#div_inhalt p {
		width: 100%;
		max-width: 600px;
		margin: 0 0 30px;
		padding: 0;
		color: #707070;
		float: left; 
	}

	#div_content p a {
		color: #C40000;
	}

	#div_content ul li {
		list-style-type: square;
		margin: 0;
		padding: 1px 0 0; 
	}

	#div_content ul li a {
		color: #02afee;
		text-decoration: none;
	}

	.anfahrt {
		padding-bottom: 70px !important;
	}
	
	div.subNavMobile {
		display: none;
	}

	/*-------------------------Bild Content-------------------------- */
	#bildauswahl1 {
		background-color: #ffffff;
		text-align: center;
		float: left;
		padding: 0;
		margin: 0 5px 0 0;
	}

	#buerobedarf,
	#bueromoebel,
	#bueromaschinen {
		background-color: #b2b3b5;
		padding: 0;
		margin: 10px 30px 0 0;
		border: 1px solid #a4a6a8;
		float: left;
		width: 171px;
		height: 273px;
	}

	#buerobedarf:hover,
	#bueromoebel:hover,
	#bueromaschinen:hover {
		background-color: #c40000;   
	}

	#buerobedarf a,
	#bueromoebel a,
	#bueromaschinen a {
		color: #ffffff;
		padding: 35px 0 0;
		margin: 10px 0 0;
		font-weight: bold;
		text-align: center;
	}
	
	div.teaserWrap {
		max-width: 68%;
	}
	
	.bueromaschinenBild {
		width: 190px;
	}

	/*--------------------Ueberschriften Content------------------------ */
	h1 {
		margin-top: 0;
		margin-bottom: 11px;
		padding: 0 10px 0 0;
		font-size: 17px;
		color: #c40000;
		font-weight: bold;
		float: left;
	}

	h2 {
		margin: 2px 0 0;
		padding: 0;
		font-size: 15px;
		color: #a5a6a8;
		font-weight: bold;
	}

	/*--------------------Footer------------------------ */
	#div_footer {
		margin: auto;
		padding: 2px 0 0;
		width: 100%;
		max-width: 980px;
		height: 36px;
		background-color: #989898;
		clear: both;
	}

	#div_footer ul {
		margin: 0;
		padding: 10px 0 0;
		font-size: 11px;
		width: 100%;
		max-width: 980px;
	}

	#div_footer ul li {
		margin: 0;
		padding: 0 0 0 10px;
		display: inline;
		float: left;
		width: auto;
	}

	#div_footer ul li a {
		color: #ffffff;
	}

	#div_footer ul li a:hover {
		color: #c40000;
	}

	#div_footer ul li.li1,
	#div_footer ul li.li2 {
		width: auto;
		text-align: left;
		display: inline;
	}

	#div_footer ul li.li2 a {
		padding: 0 0 0 30px;
		color: #c8c8ca;
	}

	#div_footer ul li.li1 {
		padding: 0 20px 0 40px;
		color: #c8c8ca;
	}

	/*-------------------- Galerie Planung -------------------------------*/
	#gallery {
		background-color: #444;
		padding: 10px;
		width: 100%;
		max-width: 520px;
	}
			
	#gallery ul { 
		list-style: none; 
	}
		
	#gallery ul li { 
		display: inline; 
	}
		
	#gallery ul img,
	#gallery ul a:hover img  {
		border: 5px solid #3e3e3e;
		border-width: 5px 5px 20px;
	}
			
	#gallery ul a:hover img {
		border: 5px solid #fff;
		color: #fff;
	}
		
	#gallery ul a:hover { 
		color: #fff; 
	}

	#jquery-overlay {
		position: absolute;
		top: 0;
		left: 0;
		z-index: 90;
		width: 100%;
		height: 500px;
	}

	#jquery-lightbox {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		z-index: 100;
		text-align: center;
		line-height: 0;
	}

	#jquery-lightbox a img {
		border: none;
	}

	#lightbox-container-image-box {
		position: relative;
		background-color: #fff;
		width: 250px;
		height: 250px;
		margin: 0 auto;
	}

	#lightbox-container-image {
		padding: 10px;
	}

	#lightbox-loading {
		position: absolute;
		top: 40%;
		left: 0%;
		height: 25%;
		width: 100%;
		text-align: center;
		line-height: 0;
	}

	#lightbox-nav {
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
		z-index: 10;
	}

	#lightbox-container-image-box > #lightbox-nav {
		left: 0;
	}

	#lightbox-nav a {
		outline: none;
	}

	#lightbox-nav-btnPrev,
	#lightbox-nav-btnNext {
		width: 49%;
		height: 100%;
		zoom: 1;
		display: block;
	}

	#lightbox-nav-btnPrev { 
		left: 0; 
		float: left;
	}

	#lightbox-nav-btnNext { 
		right: 0; 
		float: right;
	}

	#lightbox-container-image-data-box {
		font: 10px Verdana, Helvetica, sans-serif;
		background-color: #fff;
		margin: 0 auto;
		line-height: 1.4em;
		overflow: auto;
		width: 100%;
		padding: 0 10px 0;
	}

	#lightbox-container-image-data {
		padding: 0 10px; 
		color: #666; 
	}

	#lightbox-container-image-data #lightbox-image-details { 
		width: 70%; 
		float: left; 
		text-align: left; 
	}	

	#lightbox-image-details-caption {
		font-weight: bold;
	}
		
	#lightbox-image-details-currentNumber {
		display: block; 
		clear: left; 
		padding-bottom: 1em;	
	}			

	#lightbox-secNav-btnClose {
		width: 66px; 
		float: right;
		padding-bottom: 0.7em;	
	}	

	/* Büromöbel Links */
	a.moebel_link {
		float: left;
	}
	
	div.datenschutz p {
		max-width: 100%;
	}
}

@media (min-width: 1024px) {
	
}

@media (min-width: 1200px) {
	
}

/*------------------------- Druckansicht-------------------------- */
@media print
{
    body, #div_main
    {
        width: 550px;
    }
    #div_content
    {
        width: 550px;
        margin: 30px 0px 0px 0px;
    }
    #div_kopfbild, #ul_navi_top, #ul_navi_top2, #div_untermenue, .ul_untermenue, #div_direktlinks, #div_balken_rechts, .bildauswahl1, #div_kopf, #div_footer, .img_rechte_leiste
    {
        display: none;
    }
}