@import url(fonts/stylesheet.css);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css);




html, body {
	background: #e3e3e3 url(img/bodybg.jpg) no-repeat fixed;	/* GRAU #e3e3e3 */
	/*font-family: 'pt_serifregular';*/
	font-family: 'LMSans10-Regular', Arial, sans-serif;
	font-size: 16px;
	font-weight:normal;
	line-height:150%;
	margin: 0; padding: 0;
	height:100%;
}

body{
	background: #e3e3e3; /* GRAU #e3e3e3 */
	/*font-family: 'pt_serifregular';*/
	font-family: 'LMSans10-Regular';

	
					}
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	Layout Blocks
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
.bodybox { /* Holds the page items in place*/
	background: #e3e3e3; /* GRAU #e3e3e3 */
	max-width: 1028px;	
	min-height:90%;
	margin: 0 auto 0 auto;
	padding: 0;

	
	
}
/* max-width: 1028px */
.wrapper {
	background: #e3e3e3; /* GRAU #e3e3e3 */
	max-width: 1028px;
	margin: 0px auto;
	position: relative;
}
hr { border-color:#999!important; border-color:#9a781a!important;}/*gold*/
.menu-current {
	 font-weight:600!important;
}


:focus { outline:none!important;}

#headerbox {width: 100%;  margin:0 0 0 0; 
	/* background-image: radial-gradient(circle, rgba(191,141,202,1),rgba(183,203,238,1)); */

}

#headerpic, .logobox  {height: auto;}
/*Top left*/
.logobox {width: 0%; float:left; background: #fff; display:none}
a.homelink {width: 100%; height:100%; float:right;  text-align:center; vertical-align:middle;}
a.homelink img { max-width:100%; max-height:100%; }

#headerpic {width: 100%; padding:20px 0 0 20px; overflow:hidden; text-align:center; height:250px; /* 
background-color: #b8c8ec;  background: rgb(191,141,202);
background: radial-gradient(circle, rgba(191,141,202,1) 0%, rgba(183,203,238,1) 90%);  */ 
background-image: radial-gradient(circle, rgba(191,141,202,1),rgba(183,203,238,1));

}
 #headerpic img { max-width:1248px; height:330px; margin:0 auto;}
#headerbox_replace {height:0; clear:both;}

/*fixed menu*/
.noheader #headerbox_replace {height: 200px;}
.noheader #headerbox {position:fixed; max-width: 1028px; margin: -110px auto 0 auto; z-index:5000;}
.noheader #headerbox .headertop {display:none; }
.reduced #headerbox {margin: -30px auto 0 auto ! important;  transition:0.5s all;}
#aprevnext2 {display:none;}


#topslider {width: 75%; float:right; } 
#topslider ul, #topslider li {    list-style: none; list-style-type: none; list-style-image: none; margin: 0; padding: 0;}
#topslider img {float:right; width:100%;} 


.search_box {width:25%; float:left;}

.menubox {width: 100%; height:45px; text-align:center; background-color: #fff!important; z-index:6000!important;} /* weisser Streifen hinterm Menue */
.mobileheader {display:none; background: #e3e3e3; background-image: radial-gradient(circle, rgba(191,141,202,1),rgba(183,203,238,1));} /* Hintergrund mobiler Header */
#opensidebarswitch, #closesidebarswitch{display:none;}


/* ------------------------------------------------ */
h1, h2, h3, h4, h5 { margin: 0px 0 4px 0; line-height: 120%;
/*color: #64018a !important;*/
font-weight:400!important;

}

h1, h2, h3, h4 {color: #9a781a!important;}

h1, h2, h3 {font-weight:300!important}
h5, h6 {font-weight:700!important}

.mainbox a, .contentwide a, .mainbox a:visited ,.contentwide a:visited {
	text-decoration: none;
	
	color:#9a781a!important;
}

/*left*/

.leftbox {
	margin-left: 0;
	width:0%;
	float:left;
	display:inline;
	min-height: 1px;
	
}

.leftbox .inner {margin:50px 10px 20px 10px; min-height:200px;}
.leftbox .inner img {max-width:100%; height: auto;}




.widetop {width:100%; margin: 0 0 20px 0;}
.widetop, .widebottom {clear:both;}


.mainbox {width:100%;  float:left; display:inline;}



.maincontent { /* main content */
	width: 65%;
	float: left;
	display:inline;
	margin-left: 2%;
	padding-top:10px;
}

.mainbox .contentwide  {width:95%; margin:0 0 0 20px;}

.mainbox .maincontent p img:not([class^="pic"]) { max-width:100%; height:auto ! important;}


.sidebar {
    margin-top:60px;
	width: 25%;	
	float: right;
	display:inline;
}
.sidebar .inner { margin: 20px 15px 0 0; font-size:0.9em; line-height:135%}
.sidebar .inner p img { max-width:100%; height:auto ! important;}



.clearcontent {height:100px; clear:both; }

.footerbox {background: #e3e3e3;  margin: -30px auto 0px auto; height:60px; max-width: 1028px;  font-size:12px; color: #999;}
.footerbox li a { color: #999!important;} /* GRAU #e3e3e3 */
 /* GRAU #e3e3e3 */
.footerbox .left {width: 0%; margin:15px 0 0 0; float:left;}
.footerbox  .center {width:95%; margin: 15px 0px 0 20px; float:left;text-align:center }
#gototopswitch {float:right; margin:15px 0 0 0;}


/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~  */
.breadcrumbs {
	height:30px;
	line-height:100%;
	margin: 0 0 0 0;
	padding: 3px 0 3px 0;
	clear:both;	
}

.innerbc {
	font-size:14px;
	margin:10px 0 0 18px;
	width: 650px;
}

.breadcrumbs .innerbc span {
	background: transparent url(img/bclink.gif) no-repeat; 
	padding: 6px 2px 0px 12px; font-weight: normal; }
	
.breadcrumbs .innerbc a {
	padding:1px;

	text-decoration: none;
}

	
.breadcrumbs .innerbc .menu-current a, .menu-2 .menu-current a{
	color: #000000!important; font-weight:600!important;
}


.aprevnext {display:block; width:90px; height:27px; float:right;}
.aprevnext a {display:block; width:40px; height:27px; float:right; opacity:0.5; border:none;}
.aprevnext a.aprev {background: url(img/prev.png) no-repeat center top;  }
.aprevnext a.anext {background: url(img/next.png) no-repeat center top;  }
.aprevnext a:hover {opacity:0.8}



/* Menue-Formatierung */





#nav {
	/* background: #fff; Gesamthintergrund nur am Menue */
  position:relative;
	margin:0 auto 0 auto;
	text-align:center;
	
   /*width:570px;
	max-width: 1028px;*/
	height: 32px;	
	border: 0;	
	z-index: 700;
	
	top:3px !important;
}

/*ul.ullev0 {
	
	
	max-width: 1028px;

text-align: center !important;
}

ul.ullev0 li {
 display: inline-block !important;
}
*/

#nav ul.ullev0 {
	background: #fff;	/* linker senkrechtstreifen im mobilen Menue */
	list-style-type: none;
	list-style-image: none;
	z-index: 800;
	 display:inline-block;

}

 #nav2 ul {
	background: #fff;	/* linker senkrechtstreifen im mobilen Menue */
	list-style-type: none;
	list-style-image: none;
	z-index: 800;


}


#nav ul.ullev0 li {
	background: #fff;	/* Hintergrund 2. mobile Menue-Ebene */
	list-style-type: none;
	list-style-image: none;
	list-style: none;
	margin-top: -3px;
	padding: 0 16px 0 0 ;
	 display:inline-block;
}

#nav2 ul li {
	background: #fff;	/* Hintergrund 2. mobile Menue-Ebene */
	list-style-type: none;
	list-style-image: none;
	list-style: none;
	margin-top: -3px;
	padding: 0 16px 0 0 ;
	
	
}

/* Root Level Link Formatting TEST */
#nav ul { background:#fff;}
#nav ul li { text-align: left; font-weight: normal; list-style-type: none; list-style-image: none; text-transform: uppercase; background: #ffffff;  display:inline-block;} /* Hintergrund Menue-Zwischenraum */
#nav ul li a {display: block; font-size: 14px;  color: #000; text-decoration: none; font-weight: 400;}
#nav ul li a span {display:block; padding: 10px 10px 0px 10px; }
/* Root Level link hover */
#nav ul li a:hover, #nav li a:focus, #nav li a:active, #nav ul li a.active, #nav a.menu-current, #nav a.menu-parent {color:#9a781a;}


/*Current page Customisations*/
#nav li a.menu-current,  #nav li  a.menu-parent {color:#9a781a;}




/* 2nd Child menu */ /* Hintergrund-Rand Untermenue #fff */
#nav  li ul {position: absolute; width: 200px; margin: 0 0 0 -10000px; padding-top: 10px; text-transform: uppercase; border-bottom: 0px solid #fff;  background-color: #fff; box-shadow: 0px 10px 10px -4px rgba(0, 0, 0, 0.5); }
#nav  li ul li {text-align: left; font-weight: normal; margin: 0 0 0 0; padding: 0;  }
#nav  li ul li a {width: 180px;  height:auto; margin:0; padding: 0; border-top: 0px solid #fff; line-height: 1.2em; font-size: 0.94em;  }
#nav  li ul li a span {display:block; padding:8px 0; margin:0;}


/* 2nd Child link hover *//* Hover-Info-Untermenue */
#nav  li ul a:hover,  #nav  li ul a.menu-current { color:#9a781a; background:#fff}
#nav  li ul a.menu-expand {background: #fff url(img/arr-right.png) no-repeat right center ; color:#9a781a}
	#nav li a.menu-expand {background: #fff url(img/arr-down.png) no-repeat right 70%;  padding-right:10px}
/* TEST */
#nav  li ul a.menu-parent {background: #000  url(img/arr-right.png) no-repeat right 5px; }

/* Show and hide */
#nav  li:hover ul, #nav  li a:focus ul{ margin: -3px 0 0 0;}
#nav  li ul ul { margin-left: -10000px;}
#nav  li:hover ul ul, #nav  li.subMenu ul ul { margin-left: -10000px;}
#nav  li:hover>ul, #nav  li li:hover>ul, #nav li.tabselected ul  {z-index: 1000;}
#nav  ul li ul li:hover>ul {margin-left: -30%;}

/* 3rd Child Menu Appreances */
#nav  li ul li ul	{ width: 180px; margin: 10px 0 0 -40%; z-index: 2000; }
#nav  li ul li ul li	{width: 100%;}
#nav  li ul li ul li a 	{ width: 100%;}



/* Positioning the Pop-out Drops */
#nav li {position: relative;}

#nav ul ul ul {
	position: absolute;
	top: 1px;
	left: 100%;
}



/* Better: */
#nav li:hover {
	z-index: 1000;	/* ...and here. this makes sure active item is always above anything else in the menu */
	white-space: normal;/* required to resolve IE7 :hover bug (z-index above is ignored if this is not present)
							see http://www.tanfa.co.uk/css/articles/pure-css-popups-bug.asp for other stuff that work */
}


/* end nav */
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

#leftmenu {margin-top:0px; }
#leftmenu ul, #leftmenu ul li {
	list-style-type: none;
	list-style-image: none;
	margin: 0;
	padding: 0;
}

#leftmenu li a {
	background: #cccccc;
	margin:0;
	display:block;
	font-size:14px;
	padding:10px 0 3px 10px;
	line-height: 120%;	
	color: #217cd7;
	text-decoration: none;
	border-bottom: 1px #fff solid;	
}

#leftmenu li li a { font-size:13px; padding:5px 0 5px 20px; }
#leftmenu li li li  a { font-size:12px; padding:5px 0 5px 30px;}

#leftmenu a.menu-current, #leftmenu a.menu-parent, #leftmenu a:hover, #leftmenu a:focus { color:#fff; text-shadow: 0px 1px 1px #333; }
#leftmenu a.menu-current, #leftmenu a.menu-parent {font-weight: bold;  }


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

/* Search Box in header */

#search_box {	
	padding-top:10px;
	width:25%;
}

#search_box .searchstring {
	
	width:70%;
	border: 1px solid;
	font-size:14px;
	padding:2px;
	margin-left:10px;
}
#search_box .submitbutton {
	vertical-align: top; margin:0 0 0 10px; 
}

#suggestbox {
	z-index:10000;
	z-index:9999 ! important;
	width:280px;	
	position: absolute;
	float:left;
	clear:both;		
}
#suggestbox ul {width: 280px; margin: -5px 0 0 20px;}
#suggestbox ul, #suggestbox li {
	list-style-type: none;
	list-style-image: none;	
	padding: 0 0 0 0 ;
	font-size:inherit;
	line-height: inherit;
	text-align: left;		
}
#suggestbox ul li a {
	display:block;
	padding: 5px 10px 5px 15px; 
	text-decoration: none;
	margin:0; 
	font-weight:normal;
	font-size:13px;
	line-height: 120%;
	overflow:hidden;
}
#suggestbox ul li {background: transparent url(img/suggestli.png) repeat-y;} 
#suggestbox ul li.suggestdivide {font-size:5px;}
	
#suggestbox ul li.suggesttop {
	height:30px;
	background: transparent url(img/suggesttop.png) no-repeat;
} 
#suggestbox ul li.suggestbottom {height:15px; background: transparent url(img/suggestbottom.png) no-repeat;} 



/* Login Box */

#showlogin {display:block; float:left; position:relative;  width:30px; text-align:right; margin:6px 6px 0 0; }
#login-box {position:absolute; width:200px; left:30px; top:-10px; padding:5px; font-size:11px; z-index:2000; background: #eee; box-shadow: 0 5px 20px 0 rgba(0, 0, 0, 0.2);}
#login-box .loginsubmit {border:0;}
#login-box .inputfield {width:80px; border: 1px solid #c9e8f9; padding:1px;}

a.template_edit_link {width:30px; height:30px; position:absolute; top:0; left:0; background:url(img/edit.gif) no-repeat; z-index:5000}

.footercredits {font-size:12px; padding:3px 0 0 0;}



/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ 
	Custom Classes (Re-useables)
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
	
/*  Float containers fix: */
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
/*  \*/
* html #clearfix {
	height: 1%;
}
/*  */

.stealth {visibility:hidden; display:none;} /* hides from normal css enabled browsers */

/*Extra cookie_permission */
#cookie_permission {position:fixed; top:0; right:0; z-index:9950; width: 200px; padding:10px; background: #555; text-align:center; font-size: 0.9em; line-height:120%; border-radius: 0 0 0 25px; box-shadow: 0 10px 50px 0 rgba(0, 0, 0, 0.2); }
#cookie_permission p , #cookie_permission a {color:#fff;}
#cookie_permission a.cookieaccepted {color:#000; background: #eeb300; display:block; padding:5px; border-radius: 15px; border: 1px solid #fff; font-weight:bold;}





/*Extra Colorpicker */
#colorpickericon {display:block; width:24px; height:24px; background: url(img/colorpicker.png) no-repeat; z-index:5000; position: absolute; top:100px; right:0; cursor:pointer;}
#colorpicker {display:none; width:90px; background: #e3e3e3; position: absolute; top:100px; right:0; z-index:5000; font-size:12px;line-height:100%; /* GRAU #e3e3e3 */ box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.1);}
.pickerfield {width:100%; height:40px; float:left;}

.pickerfield input[type="color"] {width:100%; height:20px; padding:0; border:0; cursor:pointer;}
.pickerfield input[type="text"] {width:90%; height:20px; padding:1px 3%; border: 1px solid #999;; cursor:text;}


a.colpick-button {display:block; clear:both; width:80%; margin:10px auto; padding:3px; background: rgba(255,255,255,0.2); text-align:center; border: 1px solid #666; border-radius: 15px;  cursor:pointer;}
#colorpicker-info {display:none; position: absolute; width:160px; padding:10px; top:0; left:-180px; background: #e3e3e3; box-shadow: 0 20px 50px 0 rgba(0, 0, 0, 0.1);} /* GRAU #e3e3e3 */




/* ======================================================================
Smaller Screens */
@media screen and (max-width: 1110px) {
	/* #nav ul li a span {padding: 11px 5px 9px 2px; font-size:0.95em;}*/
	#nav ul li a span {display:block; padding: 10px 10px 0px 10px; }

	
	/*Touch Menu*/
	/* Child menu for iPads*/
	#nav  li ul {display:none; margin: -3px 0 0 0; }
	#nav  li ul ul { display:none; }
	#nav  li:hover ul ul, #nav  li.subMenu ul ul { display:none;}
	#nav  li:hover>ul, #nav  li li:hover>ul, #nav li.tabselected ul  { display:block;}




	
}
/* ======================================================================
Smaller Screens */
@media screen and (max-width: 960px) {
	XXbody {font-size: 14px;}
	.bodybox {margin-top: 0}
	.bodybox, .footerbox {width:100%; background: #e3e3e3; background-image:none;} /*Hintergrund von Urheber-Fusszeile GRAU #e3e3e3 */
	.menubox, .leftbox,  .logobox {display:none;}
	.headerbox, .mainbox, .headerbox, #headerpic  {width:100%; margin: 0 0 0 0;}

	#rightheader {float:none; height:auto;}
	#headerpic  {height:80px; display:none }
	#headerpic img {display:block;}
	
	.logobox a.logo {display:none;}
	
	.mobileheader {display:block;  height:80px; background:#d3e7f9; background-image: radial-gradient(circle, rgba(191,141,202,1),rgba(183,203,238,1));}
	.mobileheader #mobile-logo {margin:0px 0 0 0px; max-height:99%}
	
	#topslider {width: 100%; float:right; background: #e3e3e3; display:none}  /*Hintergrund vom Slider GRAU #e3e3e3 */
	
	
	
	a.toggleMenu { float:left; width:60px; height:60px; background: url(img/menuswitch.png) no-repeat top right; margin:20px 30px 0 0;}
	
	.search_box {  width: 180px; margin-left:60px;}
	.search_box .searchstring {width: 100px;}
	
	
	
	.maincontent { width: 63%; 	 margin-left:2%; }
	.mainbox .contentwide  {width:96%; margin:0 0 0 2%;}
	.sidebar { width: 33%;
	 margin-top:60px;
	}
	.sidebar .inner { margin: 0 5% 0 5%;}
	
	#suggestbox ul li a {padding: 6px 10px 6px 15px; font-size:12px;}
	.footerbox { margin: -20px auto 0px auto;}
	.footerbox .center{width:96%; margin: 5px 0 0 3%;}
	.footerbox .left  {width:0%; margin: 05px 0 0 0%;}
	.footerbox .left #showlogin {width:100%; margin: 0 0 0 0; text-align: left;}

	/*Nav*/
	
	
	
	#nav2 {width:300px; width:auto; height: auto; position:absolute; left:0; top:100px; z-index:2000; box-shadow: 0px 10px 30px 0px rgba(0, 0, 0, 0.4); background: #fff!important}
	#nav2>ul {}
	
	#nav2 li {width:250px; width:auto;  padding: 0 0 0 0; }
	#nav2 li a {display:block; padding: 10px 0 10px 20px; font-size:18px; color:#000;  text-decoration:none; border-bottom: 0px solid #fff; }
	#nav2 li li a {padding: 10px 0 10px 20px; font-size:16px;  }
	#nav2 li li li a {padding: 8px 0 8px 30px; font-size:16px; }
	#nav2 li li li li a {padding: 6px 0 6px 40px; font-size:16px; }
	
	#nav2 li ul {display:none; border-bottom: 0px solid #fff; }
	#nav2 li.menu-parent > ul, #nav2 li.menu-current > ul {display:block;}
	#nav2 li.is_opened > ul, #nav2 li.is_opened > ul {display:block;}
	
	#nav2 li a.menu-expand {background: #fff url(img/arr-down.png) no-repeat left center ; color:#000}
	#nav2 li a.menu-current { color:#d3ae39;  font-weight:bold;}
	
	#nav2 ul li a.menu-expand.is_opened, #nav2 ul li a.menu-parent {font-weight:bold;  color:#9999; background: url(img/arr-right.png) no-repeat 2px center ; }
	#nav2close {display:none;  position:absolute; top:0; width:100%;  height: 900px; background-image:none;}
	
	#nav2 form {margin: 10px 20px 0 20px;}
	#nav2 .searchstring {width:80%; float:left; margin-right:10px;}
	
	.reduced .headerbox {display:none;}
	
	.breadcrumbs { width: 100%; height: auto; }
	.innerbc { margin: 2px 0 5px 2%; width: 96%; }
	.innerbc span  {display: block; float:left; padding: 2px 2px 2px 12px; margin: 0 0 5px 0;}
	.innerbc b  {display: none;}
	
	#aprevnext {display:none;}
	#aprevnext2 {display:block; margin-top:20px;display:none;}
	
}


/* ======================================================================
Smaller Screens */
@media screen and (max-width: 500px) {
bodybox{
	background: #fff!important; /* GRAU #e3e3e3 */
	margin-top: 50px;
	
					}
	.maincontent{ width: 96%; margin-left:2%; 

	}
	#headerbox { margin-top: 70px;}
	.sidebar {display:none; width:300px; border-left:none; position:absolute; right:0;  top:30px; background:#f0f0f0; box-shadow: 0px 20px 30px -20px rgba(0, 0, 0, 0.4);z-index:99900!important;}
	.sidebar.sidebar1, .sidebar.sidebar2 {display:block; float:none; clear:both; width:100%; position:static; box-shadow:none; background:none;}
	.sidebar.sidebar1 .inner, .sidebar.sidebar2 .inner { width: 96%; 	 margin-left:2%; }
	
	.innerbc {width:90%; float:left;}

	#opensidebarswitch {display:block; width: 21px; height:60px; position:absolute; z-index:99900!important; right:0; top:100px;}	
	#closesidebarswitch {display:block;z-index:99900!important;}
	.frontpage #opensidebarswitch {top:200px;}
/* Hintergrund mobiles Logo*/	
	.mobileheader { height: 70px; width:100%; position:fixed;  top: 0; left:0; background:#e3edfb; background:#d3e7f9; z-index:900; box-shadow: 0px 20px 30px -10px rgba(0, 0, 0, 0.2); background-image: radial-gradient(circle, rgba(191,141,202,1),rgba(183,203,238,1));}
	.mobileheader #mobile-logo { margin: 0px auto 0 25px; max-height: 100%; text-align:center}
	/*.mobileheader img {position:absolute; top:0px;}*/
	a.toggleMenu { height: 40px; width:40px; margin: 15px 0px; }
	
	#aprevnext2 {display:block; margin-top:10px; display:none}
	
	#langmenu{ position:fixed; top:5px} /* sprache-menu oben fixieren */
	
	h1 {font-size: 1.2em;}
	h2 {font-size: 1.1em;}
	h3 {font-size: 1.0em;}
	
	#colorpickericon {top:60px; display:none}
	#colorpicker {top:60px;display:none}


  .tupper > div { position:fixed; bottom: 0; background-color: yellow; height: 100px;  width:100%; background: url(<?php echo TEMPLATE_DIR ?>/img/Footer-BG.png) center bottom; background-repeat: no-repeat; background-size: cover}

}



/* ===================================================================================
huier kommt der style für die foldergallerie die per section picker gepickt werden */
            /* Dieser Eintrag entfernt den gepunkteten Rahmen um Links beim anklicken. 
 ===================================================================================*/
a:focus {
	outline: none;
}

.rfg_design ul.fg_pages_nav {
	XXdisplay: inline;
	list-style-type: none;
	padding-left: 0px;
}

.rfg_design ul.fg_pages_nav li {
  	display: inline;
	padding-right: 10px;
  	padding-left: 15px;
  	background: url(./images/crumbs.png) no-repeat left center;
}

.rfg_design ul.fg_pages_nav li a.current {
  font-weight: bold;
}


.clear {
	clear: both;
}

hr.clear {
	clear: both;
	padding-top: 15px;
	border:0;
}

figure {margin:0; padding:0;}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	categories AND photos:
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

.rfg_wrapper ul {
/* ul.categories, ul.photostyle { */
	list-style: none;
	list-style-type: none;
	list-style-image: none;
	padding: 0;
	margin:0;	
	clear:left;
	position:relative;
}

.rfg_design ul {
/* ul.categories, ul.photostyle { */	
	width:100%;	
	text-align:left;
	list-style: none;
    list-style-type: none;
    list-style-image: none;
	padding: 0;
	margin:0;
}


.rfg_wrapper ul li  {
	list-style: none;
	list-style-type: none;
	list-style-image: none;
	display: block;
	
}

.rfg_design ul li  {	
	float:left;
	margin: 0 0.5% 10px 0.5%;	
	padding: 0px;
	display: block;	
}





/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	categories
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */

.rfg_wrapper ul.categories li {
	position:relative;
	overflow:hidden;
}



.rfg_wrapper ul.categories li a  {
	position:relative;
}

.rfg_design ul.categories li a em {
	display:block;
	box-sizing: border-box;
	
	height:68px;
	width:100%;
	padding: 18px 0 0 5%;
	margin-top:-75px;	
	background: transparent url(images/folderbg.png) no-repeat ;
	overflow:hidden;
	font-size:12px;
	line-height:110%;
	font-style:normal;
	color:#fff;
	
}

.rfg_design ul.categories  a img  {
	/*box-shadow:         0px 3px 8px #333;*/
	border:0;
	border-radius: 0 30px 0 0;
}

.rfg_design ul.categories a.inactive {opacity:0.1;}


/*with Headlines*/
.rfg_design ul.captionlist {width:104%; }
.rfg_design ul.captionlist li.group {float:left; width:46% ! important; margin: 0 2% 10px 0; padding: 0 2% 10px 0; height:60px;  overflow:hidden; }
.rfg_design ul.captionlist li a  {display:block; height:60px; text-decoration: none; font-weight:normal; line-height:120%; font-size: 12px; background: rgba(200, 200, 200, 0.2); transition:background 0.2s;}
.rfg_design ul.captionlist li a:hover  {background: rgba(255, 255, 255, 0.4); transition:background 1s;}
.rfg_design ul.captionlist .backgroundblock {display:block; float:left; width: 100px; height:60px; margin: 0 2% 0 0; background-size:cover;}
.rfg_design ul.captionlist .cat_caption {display:block;  font-size: 14px; line-height:120%; }
.rfg_design ul.captionlist .cat_description {}

.rfg_narrow .rfg_design ul.captionlist, .rfg_sidebar .rfg_design ul.captionlist {width:100%; }
.rfg_narrow .rfg_design ul.captionlist li.group, .rfg_sidebar .rfg_design ul.captionlist li.group {width:100% ! important; margin: 0 0 10px 0; padding: 0 0 10px 0;}

/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	photos
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */


.rfg_wrapper ul.photostyle li.group {
	position:relative;
	padding:0;
	border: none;
	border-radius: 0;
}

ul.photostyle li.group a img {padding:0 ! important; border:0 ! important;}

.rfg_design ul  a  {
	overflow:hidden;
}


.rfg_design ul  a img  {	
	width: 100%;
	max-width: 100%;
}

.rfg_design ul.photostyle li.group img { border:0; float:left; transition: 1s all;  }

/*extras*/
XXul.photostyle li.group img { border:0; float:left; transition: 1s all;  }


/*Captions*/
ul.photostyle li.group .caption {display:block; padding:2px; position: absolute; z-index:600; bottom:0; color: #fff; font-size:12px; line-height:1.1; max-height:100%; max-width:90%; overflow:hidden; background: rgba(0,0,0,0.5); pointer-events: none; opacity:0.7;  transition: 1s all; }
ul.photostyle li.group:hover .caption {opacity:1; background: rgba(0,0,0,0.9); color:#fff;}
.nocaptions ul.photostyle li.group .caption {display:none;}

/*fix for PhotoSwipe, if somewhere is max width: 100% */
.pswp__container .pswp__item .pswp__zoom-wrap  pswp__img {width: auto ! important; height: auto ! important; }


/*==========================================================================
predefined classes
==========================================================================*/
.rounded ul.photostyle li.group a img { border-radius:15%; }
.rounded ul.categories li.group a img { border-radius:15% 15% 0 0; }
.rounded ul.photostyle li.group .caption {bottom:10%;}

.circle ul.photostyle li.group a img { border-radius:50%; }
.circle ul.categories li.group a img { border-radius:10% 50% 0 0; }
.circle ul.photostyle li.group .caption {bottom:0; border-radius:10px; width: 80%; margin: 0 10% 0 10%; text-align:center}

.shadow ul li.group a img  {box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.4);}

.opaque ul li.group a img { opacity:0.6; transition: 1s opacity; }
.opaque ul li.group a:hover img { opacity:1; }

.grayscale ul li.group a img {-webkit-filter: grayscale(60%);  filter: grayscale(60%);}
.grayscale ul li.group a:hover img {-webkit-filter: grayscale(0);   filter: grayscale(0);}

.saturate ul li.group a img {-webkit-filter: saturate(0%);  filter: saturate(0%);}
.saturate ul li.group a:hover img {-webkit-filter: saturate(80%);   filter: saturate(80%);}

.sepia ul li.group a img {-webkit-filter: sepia(60%);  filter: sepia(60%);}
.sepia ul li.group a:hover img {-webkit-filter: sepia(0);   filter: sepia(0);}

.blur ul li.group a img {-webkit-filter: blur(3px);  filter: blur(3px);}
.blur ul li.group a:hover img {-webkit-filter: blur(0);   filter: blur(0);}


.blur-rev ul li.group a img {-webkit-filter: blur(0);   filter: blur(0);}
.blur-rev ul li.group a:hover img {-webkit-filter: blur(3px);  filter: blur(3px);}

.rfg_design.center ul  {text-align:center; }
.rfg_design.center ul li.group {display: inline-block; float:none; margin: 0 0.2% 0 0.2%; }


.rfg_header.noheader h3, .rfg_header.noheader p  {display:none;}

/*========================================================================== 
Frontend Edit + iFrame 
==========================================================================*/

.fg_fe_editable i.editbutton {cursor:pointer; text-align:center; display:block; position:absolute; top:0; right:0; width:32px; height:32px; background: transparent url(images/edit32.png) no-repeat center center; }
.fg_fe_editable i.editbutton {opacity:0.3; transition: 1s all;}
.fg_fe_editable i.editbutton:hover {opacity:1; transition: 0.3s all;}
.fg_fe_editable i.editbutton.editobjactive {opacity:1;  width:48px; height:48px; background: #00cc33 url(images/edit32.png) no-repeat center center;}

.fg_fe_editable i.editbutton {opacity:0.0;}
.fg_fe_editable:hover  i.editbutton {opacity:0.3 ! important;}
.fg_fe_editable li i.editbutton.editobjactive, .fg_fe_editable li i.editbutton:hover {opacity:1 ! important;}

.fe_editadd_big {cursor:pointer; opacity:1; display: block; float:left; width:210px; height:60px;  background: darkgreen url(images/add_images_big.png) no-repeat center ; }

.topbuttons {position: relative; z-index:900; height:0px; width:50px; opacity:0.2; transition: 0.3s all}
.topbuttons div {position:absolute; border-radius: 50%; border: 2px solid #000; cursor:pointer;  transition: 0.3s all}
.rfg_outertools div.topbuttons {top:-20px; }
.rfg_outertools:hover div.topbuttons {opacity:0.8; }

.topbuttons div.fe_editadd {left:-10px;  top:2px; height:41px; width:41px; background-color: #444;  background-repeat: no-repeat; background-position: center center; }
.eafolder { background-image:  url(images/add_folder.png);}
.eaimage { background-image:  url(images/add_image.png);}
.makeitdraggableswitch {left:-5px;  top:50px; height:31px; width:31px; background: #999 url(images/sort.png) no-repeat center center;}
.makeitdraggableswitch.active {background-color:#33cc00; }
.rfg_scrollhelper {display:none; position: absolute; top:0; right:0; z-index:9000; width: 20px; height: 100%; background:#ffea00 url(images/scrollhere.png) ; background-size: 100% auto}

li.sortgroup a {cursor:move ! important;}

.anfasser {height:15px;cursor:move; }
#fg_frontendedit {z-index:1200; opacity: 0.2; transition: 0.9s opacity; position: absolute; left:-1000px; top:0; width:400px; background: #222; height:250px; padding:0; box-shadow: 0px 5px 50px 0px rgba(0, 0, 0, 0.8); transition: 1s width, 1s height;}					
#editthisiframe {widht:100%; height:100%;}

.rfg_header {position: relative;}
.rfg_header .fe_editedit {cursor:pointer; display:block; float:right; width:32px; height:32px; background: transparent url(images/edit32.png) no-repeat center center; opacity:0.3; transition: 1s all;}
.rfg_header .fe_editedit {position:absolute; right:0; top:-40px; z-index:1000;}
.rfg_header:hover .fe_editedit {opacity:1; transition: 0.3s all;}
	

/* Setup */
#rfg_setup_assistant {float:none; text-align:center; clear:both; font-size:32px; padding: 5px 0; margin: 10px 0; width:100% ! important; background: rgba(128,128,128,0.3);}
.rfg_setup_choose {clear:both;  margin: 0 0 10px 0; opacity:0.4; transition:1s all; background: rgba(200,200,200,0.1); cursor:pointer;}
.rfg_setup_choose img {float:left; margin: 0 10px 0 0}
.rfg_setup_choose.rfg_setup_ischosen, .rfg_setup_choose:hover {opacity:1; background: rgba(200,200,200,0.2); }
	
a.rfg_setup_button {border: 1px solid #999; padding:2px 5px; text-decoration:none; background: rgba(128,128,128,0.2); cursor:pointer;}
.rfg_output {float:right; clear:right; width: 80px; text-align:right; margin: 0 0 0 0}

h3 a.setup_button {font-size:11px; font-weight:normal;}

#rfg_setup_controls.rfg_setup_style2 #rfg_width_controls {display:none;}
#rfg_setup_controls.rfg_setup_style3 #rfg_height_controls {display:none;}

.XXrfg_setup_style1 .rfg_outputw2, .XXrfg_setup_style2 .rfg_outputw2 {display:none;}
.XXrfg_setup_style3 .rfg_outputw2 {display:block;}
.XXrfg_setup_style3 .rfg_outputw1 {display:none;}
#rfg_setup_controls.rfg_setup_style2 .predefined  {display:none;}


h1#fg_jquery_check {font-size: 36px; padding: 10px 0; text-align: center; color:#fff; background-color:#f00;}
#rfg_setup_wrapper {overflow:hidden;}
.rfg_setup_dummy {background: #eff url(images/dummy.png) no-repeat; background-size: 100% 100%, auto;}
#rfg_setup_wrapper .group.rfg_getfitting a, #rfg_setup_wrapper .group.rfg_getfitting a div {width:100% ! important; height:100% ! important;}

#rfg_setup_wrapper.rfg_wrapper_style2 .photostyle {width:150%;}
#rfg_setup_wrapper.rfg_wrapper_style2 .photostyle .group  {margin:0 5px 5px 0;}

#rfg_setup_wrapper.rfg_wrapper_style3 .photostyle {XXwidth:400%;}
#XXrfg_setup_wrapper.rfg_wrapper_style3 .group {margin:0;}

#class_chooser a.rfg_setup_button {display: block; float: left;}
#class_chooser .useclass {background: rgba(128,128,128,0.5)}


.rfgstyle1.rfg_narrow .rfg_design ul.categories li, .rfgstyle1.rfg_narrow .rfg_design ul.photostyle li {width: 32% ! important;}
.rfgstyle1.rfg_sidebar .rfg_design ul.categories li, .rfgstyle1.rfg_sidebar .rfg_design ul.photostyle li {width: 49% ! important;}

/*2021 von FG geklaut
Funktioniert nicht mit Sorting
.rfgstyle1 .photostyle {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(auto-fill, minmax(150px, 3fr));
    list-style: none;
    margin: 0 0 5px 0;
    padding: 0;
}*/
/* //2021 von FG geklaut*/

/*moving*/
.rfg_wrapper ul.categories li.movetothis  { background: rgba(45,210,230,0.5);}
.rfg_wrapper ul.categories li.movetothis a  {opacity:0.3;}

#upfolder_area {width:100px; height:88px; background: transparent url(images/folder-up.png) no-repeat; background-size: 100% 100%, auto; position: absolute; top:0; left:0;}
#upfolder_area.movetothis  { background-color: rgba(45,210,230,0.5);}					

/* ================================================================================================= */
/* touch? */
@media screen and (max-width: 1200px) {
	.fg_fe_editable  i.editbutton {opacity:0.2;}
	.XXfg_fe_editable div.fe_editadd {opacity:0.9; width:40px;}
	.topbuttons {opacity:0.3}
}

/* ================================================================================================= */

/* Smaller Screens */
@media screen and (max-width: 768px) {
	.rfgstyle1 .rfg_design ul.categories li, .rfg_design ul.photostyle li {width: 24%; height:auto;}
	.rfg_design ul.categories li a img, .rfg_design ul.photostyle li a img  {width: 100%; height:auto;}
	
	.rfg_design ul.captionlist, .rfg_design ul.captionlist {width:100%; }
	.rfg_design ul.captionlist li.group, .rfg_design ul.captionlist li.group {width:100% ! important; margin: 0 0 10px 0; padding: 0 0 10px 0;}

	.rfg_wrapper ul.captionlist li, .rfg_wrapper ul.captionlist li a {float:none; clear:left; width:100% ! important; padding-right:0; margin: 0 0 10px 0; height:auto; } /*stronger */
	.XXmakeitdraggableswitch {display:none;} /*Funktioniert am Handy nicht */	
}


/* Smaller Screens */
@media screen and (max-width: 540px) {
	.rfgstyle1 .rfg_design ul.categories li, .rfgstyle1 .rfg_design ul.photostyle li {width: 32% ! important;}
	
	
}

/* Smaller Screens */
@media screen and (max-width: 400px) {
	.rfg_design ul.categories li, .rfg_design ul.photostyle li  {width: 49% ! important;}
	.rfg_design ul.captionlist .backgroundblock {width: 30%; XXheight:100%;}
	
	body.rfg_sortable {XXmargin-left:40px;}
	body.rfg_sortable .rfg_scrollhelper {display:block;}
}            

/* importieren bakery-styles für den section-picker */
                                    @import url('gridism.css');

.mod_bakery_cart_head {
	font-weight:bold;
	border-bottom:1px solid #000;
}

.mod_bakery_sum {
	border-top:1px solid #000;
	border-bottom:3px double #000;
	margin-bottom:10px;
}

.mod_bakery_row {
	margin-bottom:10px;	
	padding:5px 0;
}

.mod_bakery_cart_row:nth-child(even) {
	background-color:#eee;
}


/*
  CSS definition for WebsiteBaker module: Bakery
  Copyright (C) 2007 - 2017, Christoph Marti

  This CSS file is free software. You can redistribute it and/or modify it 
  under the terms of the GNU General Public License - version 2 or later, 
  as published by the Free Software Foundation: http://www.gnu.org/licenses/gpl.html.

  This CSS file is distributed in the hope that it will be useful, 
  but WITHOUT ANY WARRANTY; without even the implied warranty of 
  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 
  GNU General Public License for more details.
*/


/* Frontend Stylesheet Module Bakery */
/* ********************************* */

/*
NOTE:
Modify the HTML of the main page and the item page in the layout section of the Bakery page settings.
Modify the HTML of the invoice template in the layout section of the Bakery payment methods > select invoice.
Modify the CSS of the main page and the item page in this stylesheet.
Modify the CSS of the invoice template and the view order in the backend stylesheet.
*/


/* GENERAL */

.mod_bakery_h_f {
	text-align: left;
}
.mod_bakery_ordernum_f {
	font-weight: bold;
}
.mod_bakery_hr_f {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #C5C5C5;
    margin: 1em 0;
    padding: 0;
}


/* MAIN PAGE */

.mod_bakery_main_div_cart_bt_f {
	text-align: left;
}
.mod_bakery_main_td_f {
	text-align: center;
}
.mod_bakery_main_thumb_f {
	border: none;
}
.mod_bakery_main_img_f {
	border: none;
}
.mod_bakery_main_title_f {
	font-weight: bold;
}
.mod_bakery_main_in_stock_f {
	color: green;
}
.mod_bakery_main_short_of_stock_f {
	color: orange;
}
.mod_bakery_main_out_of_stock_f {
	color: red;
}
.mod_bakery_main_stock_img_f {
	border: red 1px; 
}
.mod_bakery_main_input_f {
	text-align: right;
}
.mod_bakery_main_select_f {
	width: 100px;
}


/* ITEM PAGE */

.mod_bakery_item_thumb_f {
	border: none;
}
.mod_bakery_item_img_f {
	border: none;
}
.mod_bakery_item_caption_f {
	
}
.mod_bakery_item_table_f {
	width: 75%;
	text-align: left;
}
.mod_bakery_item_title_f {
	font-weight: bold;
}
.mod_bakery_item_sku_f {
	font-weight: bold;
}
.mod_bakery_item_stock_f {
	font-weight: bold;
}
.mod_bakery_item_in_stock_f {
	color: green;
}
.mod_bakery_item_short_of_stock_f {
	color: orange;
}
.mod_bakery_item_out_of_stock_f {
	color: red;
}
.mod_bakery_item_stock_img_f {
	border: red 1px; 
}
.mod_bakery_item_price_f {
	font-weight: bold;
}
.mod_bakery_item_shipping_f {
	font-weight: bold;
}
.mod_bakery_item_full_desc_f {
	font-weight: bold;
}
.mod_bakery_shipping_cost_f {
	font-weight: bold;
}
.mod_bakery_item_option_f {
	font-weight: bold;
}
.mod_bakery_item_input_f {
	text-align: right;
}
.mod_bakery_item_select_f {
	
}


/* CART */

/* CART table header */
.mod_bakery_cart_th_thumb_f {
	text-align: left;
}
.mod_bakery_cart_th_sku_f {
	text-align: right;
	white-space: nowrap;
}
.mod_bakery_cart_th_name_f {
	text-align: center;
	width: 44%;
}
.mod_bakery_cart_th_quantity_f {
	text-align: left;
	white-space: nowrap;
}
.mod_bakery_cart_th_price_f {
	text-align: right;
	white-space: nowrap;
}
.mod_bakery_cart_th_shipping_f {
	text-align: right;
	white-space: nowrap;
}
.mod_bakery_cart_th_sum_f {
	text-align: right;
	width: 20%;
}

/* CART table body */
.mod_bakery_cart_td_thumb_f {
	text-align: left;
}
.mod_bakery_cart_td_sku_f {
	text-align: right;
}
.mod_bakery_cart_td_name_f {
	text-align: center;
}
.mod_bakery_cart_td_quantity_f {
	text-align: right;
	white-space: nowrap;
}
.mod_bakery_cart_td_quantity_f a img {
	margin-bottom: -3px; 
	border: none;
}
.mod_bakery_cart_td_price_f {
	text-align: right;
	white-space: nowrap;
}
.mod_bakery_cart_td_shipping_f {
	text-align: right;
	white-space: nowrap;
}
.mod_bakery_cart_td_sum_f {
	text-align: right;
	white-space: nowrap;
}

/* CART table details */
.mod_bakery_cart_currency_f {
	font-size: 9px;
	font-weight: normal;
}
.mod_bakery_cart_item_f {
	font-weight: bold;
}
.mod_bakery_cart_item_desc_f {
	font-size: 10px;
}
.mod_bakery_cart_subtotal_f {
	text-align: right;
	font-weight: bold;
	line-height: 200%;
}
.mod_bakery_cart_shipping_f {
	text-align: right;
	font-weight: bold;
	line-height: 75%;
}
.mod_bakery_cart_free_shipping_f {
	text-align: right;
	font-weight: bold;
	line-height: 75%;
	color: #FF0000;
}
.mod_bakery_cart_tax_f {
	text-align: right;
	font-weight: bold;
	line-height: 75%;
}
.mod_bakery_cart_total_f {
	text-align: right;
	font-weight: bold;
	line-height: 300%;
}


/* MINI CART */

#mod_bakery_mc_div_f {
	width: 250px;
	float: right;
	font-size: 11px;
}
.mod_bakery_mc_h2_cart_f {
	
}
.mod_bakery_mc_p_empty_f {
	font-weight: bold;
}
.mod_bakery_mc_p_orderid_f {
	
}
.mod_bakery_mc_orderid_f {
	font-style: italic;
}
.mod_bakery_mc_p_summary_f {
	
}
.mod_bakery_mc_quantity_f {
	font-weight: bold;
}
.mod_bakery_mc_total_f {
	font-weight: bold;
}
.mod_bakery_mc_p_excl_f {
	font-size: 10px;
}


/* ADDRESS FORM & ADDRESS */

.mod_bakery_form_p_f {
	font-style: italic;
}
.mod_bakery_form_label_f {	
	font-weight: bold;
	white-space: nowrap;
}
.mod_bakery_form_input_f {
	width: 280px;
}
.mod_bakery_address_h_f {
	font-weight: bold;
}
.mod_bakery_address_p_f {
	
}
.mod_bakery_tax_no_h_f {
	font-weight: bold;
}
.mod_bakery_tax_no_p_f {
	
}


/* PAY */

.mod_bakery_pay_h_f {
	padding-left: 12px;
}
.mod_bakery_pay_h_f img {
	padding-left: 8px;
}
.mod_bakery_agree_f {
	padding: 3px 15px 15px 15px;
	background-color: #ECECEC;
	border-color: #CBCBCB;
	border-width: 1px;
	border-style: solid;
}
.mod_bakery_agree_f div {
	padding-top: 12px;
}
.mod_bakery_err_agree_f {
	border: solid 1px red;
	background-color: #FFDCD9;
}
.mod_bakery_no_revocation_f input {
	float: left;
	margin-right: 5px;
}
.mod_bakery_no_revocation_f span {
	display: block;
	margin-top: 2px;
	overflow: hidden;
}
.mod_bakery_cust_msg_f {
	font-weight: bold;
}
.mod_bakery_cust_msg_ta_f {
	width: 98%;
	height: 80px;
}
.mod_bakery_pay_method_f {
	font-weight: bold;
}
.mod_bakery_pay_td_f {
	font-size: 11px;
	padding: 3px 12px;
}
.mod_bakery_pay_submit_f {
	height: 30px;
	text-align: center;
}
.mod_bakery_selected_pay_h_f {
	
	font-weight: bold;
}


/* BUTTONS */

.mod_bakery_bt_cart_f {
	
}
.mod_bakery_bt_add_f {
	
}
.mod_bakery_bt_continue_f {
	
}
.mod_bakery_bt_update_f {
	
}
.mod_bakery_bt_add_ship_form_f {
	
}
.mod_bakery_bt_order_f {
	
}
.mod_bakery_bt_cancel_f {
	
}
.mod_bakery_bt_modify_address_f {
	
}
.mod_bakery_bt_modify_pay_methods_f {
	
}
.mod_bakery_bt_buy_f {
	min-width: 45%;
}
.mod_bakery_bt_pay_cod_f {
	width: 98%;
}
.mod_bakery_bt_pay_bopis_f {
	width: 98%;
}
.mod_bakery_bt_pay_advance_f {
	width: 98%;
}
.mod_bakery_bt_pay_invoice_f {
	width: 98%;
}
.mod_bakery_bt_pay_paypal_f {
	width: 98%;
}
.mod_bakery_bt_pay_payment-network_f {
	width: 98%;
}


/* MESSAGES */

.mod_bakery_error_f {
	text-align: center;
	color: red;
	margin-top: 5px;
	border: solid 1px red;
	background-color: #FFDCD9;
	background-image: url(images/error.gif);
	background-position: 15px center;
	background-repeat: no-repeat;
}
.mod_bakery_error_f p {
	padding-left: 60px;
	padding-right: 6px;
}
.mod_bakery_errorbg_f {
	background-color: #FFDCD9;
}
.mod_bakery_success_f {
	text-align: left;
	color: green;
	margin-top: 5px;
	border: solid 1px green;
	background-color: #D4FFD1;
	background-image: url(images/success.gif);
	background-position: 15px center;
	background-repeat: no-repeat;
}
.mod_bakery_success_f p {
	padding-left: 60px;
	padding-right: 6px;
}
.mod_bakery_information_f {
	text-align: left;
	margin-top: 5px;
	border: solid 1px #FFD700;
	background-color: #FFFFDD;
	background-image: url(images/information.gif);
	background-position: 15px center;
	background-repeat: no-repeat;
}
.mod_bakery_information_f p {
	padding-left: 60px;
	padding-right: 6px;
}


/* IE ONLY */

/* IE < 7 */
* html input.mod_bakery_bt_continue_f, * html input.mod_bakery_bt_update_f, * html input.mod_bakery_bt_order_f, * html input.mod_bakery_bt_cancel_f {
	font-size: 9px;
}
/* IE = 7 */
*:first-child+html .mod_bakery_bt_continue_f, *:first-child+html .mod_bakery_bt_update_f, *:first-child+html .mod_bakery_bt_order_f, *:first-child+html .mod_bakery_bt_cancel_f {
	font-size: 9px;
}


/* LIGHTBOX2 */

/* Preload images */
body:after {
  content: url(lightbox2/images/close.png) url(lightbox2/images/loading.gif) url(lightbox2/images/prev.png) url(lightbox2/images/next.png);
  display: none;
}

body.lb-disable-scrolling {
  overflow: hidden;
}

.lightboxOverlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  background-color: black;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
  opacity: 0.8;
  display: none;
}

.lightbox {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 10000;
  text-align: center;
  line-height: 0;
  font-weight: normal;
}

.lightbox .lb-image {
  display: block;
  height: auto;
  max-width: inherit;
  border-radius: 3px;
}

.lightbox a img {
  border: none;
}

.lb-outerContainer {
  position: relative;
  background-color: white;
  *zoom: 1;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  border-radius: 4px;
}

.lb-outerContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-container {
  padding: 4px;
}

.lb-loader {
  position: absolute;
  top: 43%;
  left: 0;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
}

.lb-cancel {
  display: block;
  width: 32px;
  height: 32px;
  margin: 0 auto;
  background: url(lightbox2/images/loading.gif) no-repeat;
}

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

.lb-container > .nav {
  left: 0;
}

.lb-nav a {
  outline: none;
  background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
}

.lb-prev, .lb-next {
  height: 100%;
  cursor: pointer;
  display: block;
}

.lb-nav a.lb-prev {
  width: 34%;
  left: 0;
  float: left;
  background: url(lightbox2/images/prev.png) left 48% no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-prev:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.lb-nav a.lb-next {
  width: 64%;
  right: 0;
  float: right;
  background: url(lightbox2/images/next.png) right 48% no-repeat;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-next:hover {
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}

.lb-dataContainer {
  margin: 0 auto;
  padding-top: 5px;
  *zoom: 1;
  width: 100%;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.lb-dataContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-data {
  padding: 0 4px;
  color: #ccc;
}

.lb-data .lb-details {
  width: 85%;
  float: left;
  text-align: left;
  line-height: 1.1em;
}

.lb-data .lb-caption {
  font-size: 13px;
  font-weight: bold;
  line-height: 1em;
}

.lb-data .lb-number {
  display: block;
  clear: left;
  padding-bottom: 1em;
  font-size: 12px;
  color: #999999;
}

.lb-data .lb-close {
  display: block;
  float: right;
  width: 30px;
  height: 30px;
  background: url(lightbox2/images/close.png) top right no-repeat;
  text-align: right;
  outline: none;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
  opacity: 0.7;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  transition: opacity 0.2s;
}

.lb-data .lb-close:hover {
  cursor: pointer;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
  opacity: 1;
}
/*Shopstyles für die übersicht hinzugefügt auch reponsive 
	*/	
	
div.artikeluebersicht, div.artikel {
width: 32.33%; height:48%; min-height:130px!important;
display: table-cell;
background: rgba(255,255,255,.5);
box-shadow: 4px 4px 5px 0px rgba(0,0,0,.1);
/*overflow:hidden!important;*/
float:left; 
margin:0 1% 1% 0; 
text-align:left!important;
padding:5px 5px 5px 0;}	
div.artikel {background: rgba(255,255,255,.0);
box-shadow: 0px 0px 0px 0px rgba(0,0,0,.0)!important;
width: 48%!important;
}
div.artikel{width: 48%!important;
 display:table-cell; text-align:center}
  div.artikel>div{max-width: 400px!important;
 margin:0 auto}

    #picture{ width: 100%!important; overflow:hidden!important}
    #Thumb {width:100px; float:left; margin:10px}
    #artikeldescription {max-width:100%; float:left; margin:1%}
    

    
    
    
    
/* Small devices (landscape phones, less than 768px) , 823*/
@media only screen and (min-width:768px) and (max-width:1068px)
 {
 
 div.artikeluebersicht {width: 49%!important;}
 div.artikel{width: 100%!important;
 display:table-cell; text-align:center}
  div.artikel>div{max-width: 400px!important;
 margin:0 auto}
      div.artikeluebersicht h1 {font-size:22px}
    div.artikel{ width: 100%!important; overflow:hidden!important;
    box-shadow: 0px 0px 0px 0px rgba(0,0,0,.0)!important;}
    #picture{ width: 100%!important; overflow:hidden!important}
}	


/* Small devices (landscape phones, less than 768px) , 823*/
@media only screen and (min-width:568px) and (max-width:823px)
 {
 
 div.artikeluebersicht {width: 49%!important;}
 div.artikel{width: 100%!important;
 display:table-cell; text-align:center}
  div.artikel>div{max-width: 400px!important;
 margin:0 auto}
      div.artikeluebersicht h1 {font-size:22px}
    div.artikel{ width: 100%!important; overflow:hidden!important;
    box-shadow: 0px 0px 0px 0px rgba(0,0,0,.0)!important;}
    #picture{ width: 100%!important; overflow:hidden!important}
}	


/*iphone*/
@media only screen and (min-width:240px) and (max-width:568px)
    {
    
    div.artikeluebersicht {width: 100%!important;}
      div.artikeluebersicht h1 {font-size:22px}
      div.artikel{width: 100%!important;}
    div.artikel{ width: 100%!important; overflow:hidden!important;
    box-shadow: 0px 0px 0px 0px rgba(0,0,0,.0)!important;}
    #picture{ width: 100%!important; overflow:hidden!important}
}