@charset "utf-8";
/* Parfümerie Kreuzer */
/* Copryright: Gamradt Webdesign, www.gamradt-webdesign.de */
/* 2013-06 */

/* ----------------------------------------------------------------*/
/*  -- Generelles Reset --  */
/* ----------------------------------------------------------------*/

* {
	margin: 0;
	padding: 0;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	border:0;
	font-size:100%;
	margin:0;
	padding:0;
}
a {
	text-decoration:none;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset, img {
	border:0;
}
del, ins {
	text-decoration:none;
}
caption, th {
	text-align:left;
}
h1, h2, h3, h4, h5, h6 {
	font-size:100%;
	font-weight:normal;
}
q:before, q:after {
	content:'';
}
abbr, acronym {
	border:0;
	font-variant:normal;
}
sup, sub {
	vertical-align:baseline;
}
legend {
	color:#000;
}
input, button, textarea, select, optgroup, option {
	font-family:inherit;
	font-size:inherit;
	font-style:inherit;
	font-weight:inherit;
}
input, button, textarea, select {
	font-size:100%;
}

html, body{
  margin:0;
  padding:0;
  height:100%;

}

body{
	font-size:16px;
	font-size:93,75%; /* entspricht 15 px */
	background-color:#f3eeeb;
	margin:0;
	padding:0;
	color:#2f302f;

}

p{
	font-size:15px;
	font-size:1rem; /* entspricht 100% = 15 px*/
}

h1{
	font-size:24px;
	font-size:2rem; /* entspricht 30 px = 200% */
}




header, footer, nav, section, article, div {
	display:block;
}

/* Format Cookie-Skript */
.cc_container .cc_btn, .cc_container .cc_btn:visited {
background-color: rgba(191,191,191,1.00) !important;}
.cc_container .cc_btn:hover, .cc_container .cc_btn:active{
background-color: rgba(191,191,191,1.00) !important;}
.cc_container a, .cc_container a:visited {color:#000!important;}
.cc_more_info, .cc_message {font-size:1rem !important;line-height:1.2 !important;color:#000 !important;}
.cc_container .cc_btn {font-size:1rem !important}

#container{
	width:100%;
	min-height: 100%;
  	height:auto !important; 
  	height:100%;
  	overflow: hidden !important; 
	background-image: url(../images/bg/fuss.png);
	background-repeat: repeat-x;
	background-position: left bottom;
	background-size:100% auto;
	position:relative;
	z-index:1000;
	bottom:0;left:0;	
}

#container_l{
	background-image: url(../images/bg/b2-l.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	background-size:40% auto;
	margin:0;
	padding:0;
	width:100%;	
	positon:relative;
	z-index:970;
}
#container_r{
	background-image: url(../images/bg/bg2-r.jpg);
	background-repeat: no-repeat;
	background-position:right top;
	background-size:40% auto;
	margin:0;
	padding:0;
	width:100%;
	positon:relative;
	z-index:960;
}

#wrapperss{	
	width:1280px;
	background-color:#f8f7f4;
	margin-left:auto;
	margin-right:auto;
	padding:0;
	overflow:hidden;
	position:relative;
	z-index:1100;
	-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box; 	
	-webkit-box-shadow: 3px 3px 12px rgba(179, 153, 154, 0.7);-moz-box-shadow: 3px 3px 12px rgba(179, 153, 154, 0.7);box-shadow: 3px 3px 12px rgba(179, 153, 154, 0.7);
	}

header#head{
		-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box; 	
		height:auto;
		width:100%; /* 1080px */
		padding:0 0 0 0;
		background-color:#e3d7d0;
		position:relative;
		z-index:10
		}

#logo{	
		-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box; 	
		width:24.0740740740741%;
		float:left;
		padding-bottom:1%;
		padding-left:0.6%;
		padding-right:0.6%;
		padding-top:0.4%;
		position:absolute;
		left: 3%;
		top: 3%;
		background-color:#f3f0e9;
		-webkit-box-shadow: 4px 3px 12px rgba(179, 153, 154, 0.7);-moz-box-shadow: 4px 3px 12px rgba(179, 153, 154, 0.7);box-shadow: 2px 0px 5px 2px rgba(179, 153, 154, 0.7);
		}

	#head #logo img{
		height:auto;
		max-width:100%;
		}

nav#menu{
		-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box; 	
		width: 70%; /*756 */
		margin-left: 30%;
		height: 70px;height:4.38rem;
		position: relative;
		padding-top: 2%;
		padding-bottom: 1.5%;
		}

	nav#menu ul{
		width:100%;
	}
	
	nav#menu li{
		float:left;
		padding-left:1.8rem;
		padding-right:0;
		list-style:none;
		font-size:1em;
		
	}

	nav#menu li, nav#menu li a{
	color: #847675;
	font-weight:normal;
	font-size:1.1rem;
	}
	
	nav#menu ul.ul_sp1 li:first-child{
	padding-left:0;
	}

	nav#menu li:hover, nav#menu li:hover a{
	color:#AE9C9A;
		
	}


	/* CSS für Referenzen aktiven Link auf aktueller Seite */
	/* Seiten-ID wie Dateiname, Link-Id wie akt-Dateiname */
	/* CSS und Ids bei jeder neuen Seiten ergänzen */
	
    #index #container #container_l #container_r #wrapperss #head #menu li #index_akt,
	#parfuemerie #container #container_l #container_r #wrapperss #head #menu li #parfuemerie_akt,
	#kosmetik #container #container_l #container_r #wrapperss #head #menu li #kosmetik_akt,
	#aktuell #container #container_l #container_r #wrapperss #head #menu li #aktuell_akt,
	#kosmetikpreise #container #container_l #container_r #wrapperss #head #menu li #kosmetik_akt,
	#hochzeitservice #container #container_l #container_r #wrapperss #head #menu li #kosmetik_akt,	
	#marken #container #container_l #container_r #wrapperss #head #menu li #marken_akt,	
	#team #container #container_l #container_r #wrapperss #head #menu li #team_akt,
	#lieferservice #container #container_l #container_r #wrapperss #head #menu li #lieferservice_akt,
	#kontakt #container #container_l #container_r #wrapperss #head #menu li #kontakt_akt	
	{
		color:#BA9D9F;
	}
	


header#bild{
	height:auto;
	width:100%; 
	padding:0 0 0 0;
	background-color:#e3d7d0;
	position:relative;
	z-index:9;
	}

	header#bild img  {
			height:auto;
			min-width:100%;
			max-width:100%;
	}



section#content{
	-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box; 	
	width:100%;
	padding:2.5% 2% 2% 2%;
	background-color:#f8f7f4;
	position:relative;
	}

article#content_main{
	-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box; 	
	width:65%; 
	margin-right:5%; 
	padding:0;	
	background-color:#f8f7f4;
	float:left;
	position:relative;
}
article#content_main img{
	max-width:40%;
	height:auto;
	float:left;
	}
#content_main.hg_bild {
	background-image: url(../images/make-up.jpg);
	background-repeat: no-repeat;
	background-position: 75% 70%;
	}

	
	
/*für Kontaktformular */
#content_main_com{
	-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box; 	
	width:100%;
	padding:0 10% 0 0;	
	background-color:#f8f7f4;
	float:left;
	position:relative;
}

	

    figure#rechts, nav#rechts{
	-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box; 	
	width:30%;
	padding:0;
	background-color:#f8f7f4;
	float:left;
	position:relative;
	overflow:hidden;
}
  
    figure#rechts img, nav#rechts img{
		height:auto;
		width:99.5%;margin-left:0.5%;
		padding:0;
	}

		nav#rechts ol {
			list-style-type: decimal;
			margin:0.5rem 1rem 0.5rem 1.5rem;
			list-style-position: outside;
		}
		nav#rechts ol li{
			padding-bottom:0.3rem;
	
		}
			
		nav#rechts ol li a, nav#rechts ol li {
			color: #BA9D9F;
		}
		nav#rechts ol li a:hover {
			color: #8E6467;font-weight:bold;
		}	
		
		article#preisliste{
	-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box; 	
			width:45%;
			padding:0 0 0 0;
			margin-right:9%;	
			background-color:#f8f7f4;
			float:left;
			position:relative;
		}
		article#preisliste img{
			max-width:40%;
			height:auto;
			float:left;
			}	
			
			
		#rechts .preise .preis_sp0 ul {
			float:left;margin-right:30px;margin-right: 2rem;
			}	
			
	
	
    article#rechts{
		-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box; 	
		width:45%;
		padding:0 0 0 0;
		margin-right:1%;
		background-color:#f8f7f4;
		float:left;
		position:relative;
		overflow:hidden;
		}



    article#rechts img{
		height:auto;
		max-width:100%;
		padding:0;
		}
		
	


/* ----------------------------------------- */
/* Preislisten */
/* ----------------------------------------- */

table.tab_preise{
	width:100%;
	margin-bottom:3%;
	}
table.tab_preise td:nth-child(1), table.tab_preise th:nth-child(1){
	width:80%;
	padding-right:3%;
	text-align:left;
	vertical-align:top;
	}
	
	
table.tab_preise td:nth-child(2), table.tab_preise th:nth-child(2){
	width:17%;
	text-align:right;
	vertical-align:bottom;
	}
table.tab_preise tr:last-child, .punktlinie {
	
	border-bottom-style: dotted;
	border-bottom-color: #D8C8BE;
	border-bottom-width: 1px;
}
.punktlinie {padding-bottom:1rem;margin-bottom:1rem;}

table.tab_preise thead tr:last-child {
	border-bottom:none;}
	
	
table.tab_preise td{
	padding-left:1rem;
	}
	
	
table.tab_preise th:nth-child(2){
	font-weight:normal;
	font-size:1em;
}
.tab_preise thead h2{
	font-size:14pt;	font-size:1.1rem;
	letter-spacing:0.03rem;
	color:#b49c9b;
	padding-top:8px;padding-top:0.5rem;
	padding-bottom:9px;padding-bottom:0.56rem;
	}	
	

.tab_preise ul {
 	margin-left:1rem;
}
	
.tab_preise li {
	list-style-type: disc;
	list-style-position: outside;
	padding-left: 0.2rem;
	padding-bottom:0.3rem;
	list-style-image: url(../images/punkt.jpg);
}

p.weiter{padding-top:5%;}
img.pfeil {max-width:100%;height:auto;padding-top:0.1em;margin-right:0.8em;
}
 #rechts p .pfeil
 	{width:20px;height:auto;padding-top:0.1em;margin-right:1em;
}	


footer#fuss{
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box; 
	width:100%;
	position:relative;
	clear:both;
	padding:2% 1% 1% 2%;
	margin:0;
}

#fuss1{
	-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box; 	
	width:55%;
	margin-right:5%;
    padding:0;
	height:auto;
	position:relative;
	float:left;
	color:#b49c9b;
}
	#fuss1 p{
		color:#b49c9b;
		float:left;
}

nav#fuss2{
	box-sizing: inherit; 	
	width:40%;
    padding:0 0 0 0;
	height:auto;
	position:relative;
	float:left;
	color:#b49c9b;
}
	nav#fuss2 li{
		float:left;
		padding:0 4px 0 4px;padding:0 0.25rem 0 0.25rem;
		border-left-width: 1px;
		border-left-style: solid;
		border-left-color: #b49c9b;	
		color:#b49c9b;
		font-size:8px;font-size:0.5rem;
	}
	
	nav#fuss2 li:first-child{
		border:none;
		padding-left:0;
	}
	
	nav#fuss2 ul{
		list-style:none;
		float:left;
}

p.copyright {
	font-size: 80%;
	text-align: right;
	padding-top: 10px;
	padding-top: 0.63rem;
	padding-left:0;
	margin-left: auto;
	margin-right:auto;
	width: 1077px;
	z-index: 150;

}
p.copyright a {
	font-size: 100%;
	color: #D3C4B8;
	line-height: 1em;
	z-index: 150;
}

p.copyright a:hover {
	font-size: 100%;
	color: #E3D7D0;
	line-height: 1em;
}

/* ormatierung Cookie-Hinweis */
.cc_container .cc_btn, .cc_container .cc_btn:visited {
background-color: rgba(191,191,191,1.00) !important;}
.cc_container .cc_btn:hover, .cc_container .cc_btn:active{
background-color: rgba(191,191,191,1.00) !important;}
.cc_container a, .cc_container a:visited {color:#000!important;}
.cc_more_info, .cc_message {font-size:1rem !important;line-height:1.2 !important;color:#000 !important;}
.cc_container .cc_btn {font-size:1rem !important}

@media only screen and (max-width:1920px){
	
	#wrapperss{width:1180px;}
}


@media only screen and (max-width:1440px){
	
	#wrapperss{width:1080px;}
	
}


@media only screen and (max-width:1082px){
	
	#wrapperss{
			width:100%;
			margin-left:auto;
			margin-right:auto;
			}
			
	#logo{padding-bottom:1.2%;}
	
}

@media only screen and  (max-device-width: 1024px) and (orientation : landscape){
	nav#menu li{
		padding-left:1.1rem;
	}
	#fuss1{
		float:none;
		width:100%;
		padding:0;
	}

	nav#fuss2{
		float:left;
		width:100%;
		padding:0.5rem 0 2rem 0;
	}
	
	#fuss2 ul{
		float:none;
	}
	#fuss2 li{
		border:none;
	}
	#fuss2 li a.menu-p1{
		padding-left:0;
	}
	#fuss2 li a{
		padding-left:2rem;
		padding-right:2rem;
	}
	

	
}



@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation : portrait){

	
	body{
		background:none;
	    background-color:#f8f7f4;		
	}
	
	#wrapperss{	
	-webkit-box-shadow:none;
	-moz-box-shadow: none;
	box-shadow: none;
	}


	nav#menu{
	width: 68%; /*756 */
	margin-left: 32%;
	height: 70px;height:8rem;
	padding-top: 2%;
	padding-bottom:3%;
	
}

	nav#menu ul{
		width:33%;
		float:left;
	}
	
	nav#menu li{
		float:left;
		width:100%;
		padding-left:0rem;
		padding-bottom:0.5rem;
		list-style:none;
		font-size:1em;
		
	}

	nav#menu li, nav#menu li a{
	color: #847675;
	font-weight:normal;
	font-size:1.1rem;
	}
	
	nav#menu li {
	padding-left:0;
	}

	section#content{
	padding-top:5%;
	}

	
	#fuss1{
		float:none;
		width:100%;
		padding:0;
	}

	nav#fuss2{
		float:left;
		width:100%;
		padding:0.5rem 0 2rem 0;
	}
	
	#fuss2 ul{
		float:none;
	}
	#fuss2 li{
		border:none;
	}
	#fuss2 li a.menu-p1{
		padding-left:0;
	}
	#fuss2 li a{
		padding-left:2rem;
		padding-right:2rem;
	}
	
	
	p.copyright {
	position:absolute;
	bottom:2%;
	right:-50%;
	}	
	
	
	}
	
	


@media only screen and (max-width:480px){
	body{
		background:none;
	    background-color:#f8f7f4;		
	}
	
#wrapperss{	
	-webkit-box-shadow:none;
	-moz-box-shadow: none;	
	box-shadow: none;
	}

header#head{
	height:auto;
	width:100%; 
	padding:0 0 0 0;
	padding:0;
	}
	
#logo{
	float:none;
	width:100%;
	position:relative;
	overflow:hidden;
	padding:0;
	left:0;
	top:0;
}

	

nav#menu{
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box; 

	height:15rem;
	width:98%;
	padding:1rem 0 1rem 0;
}

nav#menu ul li{
	float:none;
	padding:0 0 0.15rem 0;
	}	
	nav#menu li a{
		font-size:20px;font-size:1.3rem;font-weight:bold;
	}
	



footer#fuss{
	-moz-box-sizing: border-box;-webkit-box-sizing: border-box;box-sizing: border-box; 	
	width:100%;
	padding:0;
}
	
	#fuss1{
		float:none;
		width:100%;
		padding:0;
	}

	nav#fuss2{
		float:left;
		width:100%;
		padding:0.5rem 0 2rem 0;
	}
	
	#fuss2 ul{
		float:none;
	}
	#fuss2 li{
		border:none;
	}
	#fuss2 li a.menu-p1{
		padding-left:0;
	}

	

	
	p.copyright {
	position:absolute;
	bottom:2%;
	right:-50%;
	
	}

#content_main, article#content_main{
	width:100%;
	float:none;
	padding:0;
}


    figure#rechts, nav#rechts{
	width:100%; 
	padding:0;
	float:none;
}
  
    figure#rechts img, nav#rechts img{
		height:auto;
		width:100%;
		padding:0;
	}

}


@media only screen and (min-height: 800px) {
	
	#content {min-height:15em;}
}


@media only screen and (min-height: 1080px) {
	
	#content {min-height:22em;}
}



/* _________________________________ */

/* Klassen für alle */
/* _________________________________ */

.bild_h{max-height:100%;width:auto;}
.bild_w{height:auto;max-width:100%;}
.float_left{float:left;}
