@import url("navi.css");
/* CSS Document */


* {
	margin : 0;
	padding : 0;
	font-family:  Helvetica, Arial, sans-serif;
}
body {
	/*background : #2B0C0E;*/
	background:#A0907C;
	text-align : center;
	width : 100%;
	font-size : 62.5%;
}
body, form, fieldset, input, textarea, select, option, p, ul, li {
}
li {
	list-style-type : square;
	list-style-position : inside;
}
#container {
	width : 890px;
	height : 80%;
	text-align : left;
	padding : 1% 3% 5% 3%;
	margin : auto;
	background:#25090B;
	border: 1px solid #230a0c;
	 -webkit-box-shadow: 0px 1px 8px #371013;
    -moz-box-shadow: 0px 1px 8px #371013;
    box-shadow: 0px 1px 8px #371013;
}
#head {
	height : 65px;
	background : url(img/linie.png) repeat-x left bottom;
	position : relative;
	padding : 0 0 10px 0;
	width : 100%;
	vertical-align : baseline;
}
#head h5 {
	font-size : 1.3em;
	line-height : 1.5em;
	width : 270px;
	padding : 0;
	height : 61px;
	float : left;
	
}
#head a.logo_1:link, #head a.logo_1:visited {
	text-decoration : none;
	color : #E6ccAA;
	display : block;
	padding : 0 0 0 98px;
	height : 61px;
	background-color: transparent;
	background-image: url(img/logo_milch.png);
	background-repeat: no-repeat;
	background-position: 0 0;
	font-size: 110%;
	letter-spacing:0.1em;
}
h3 a, h3 a:link, h3 a:active, h3 a:visited {
	text-decoration:none;
}
h3 a:hover {
	background:#63a5c5;
}
h2.rosa a, h2.rosa a:link, h2.rosa a:active, h2.rosa a:visited {
	text-decoration:none;
}
h2.rosa a:hover {
	background:#DEC2E0;
	color:#4C381D!important;
}
div.stimmung {
	background : url(stimmung/bridge3.jpg) no-repeat 0 0;
	width : 100%;
	height : 108px;
	margin : 1% 0 2% 0;
}
/*design to html anfang*/
#html_css div.stimmung {
	background-image:none;
	width : 880px;
	height : 158px;
	border:5px dotted #cccccc;
	margin-top: 1%;
	margin-right: 0;
	margin-bottom: 1%;
	margin-left: 0;
	background-color: #534A3E;/*background-image: url(img/bg_stimmung_html.jpg);
	background-repeat: repeat-x;
	background-position: 0 0;*/
}
#html_css #head {
	background:none;
}
#html_css div.stimmung ul {
	margin-top:9px;
	margin-left:auto;
	margin-right:auto;
	width:680px;
}
#html_css div.stimmung li {
	list-style-type: none;
	width:139px;
	height: 118px;
	margin:0 10px 0 10px;
	padding:0;
	float:left;
	display:block;
}
#html_css div.stimmung li h5 {
	color:#E7E7F8;
	font-size: 120%;
	text-align:center;
	vertical-align:bottom;
	margin-top:80px;
}
#html_css div.stimmung li.design {
	background-image: url(img/design_to_psd.png);
	background-repeat: no-repeat;
	background-position: 0 0;
}
#html_css div.stimmung li.payment {
	background:url(img/payment.png) no-repeat 0 0;
}
#html_css div.stimmung li.delivery {
	background:url(img/delivery.png) no-repeat 0 0;
}
#html_css div.stimmung li.arrow {
	background:url(img/arrow_stimmung.png) no-repeat 0 10px;
	width:58px;
}
/*design to html ende*/
#inhalt {
	width : 100%;
	padding : 0 0 1% 0;
	/*background-color: #756958;*/
	background-color:#756958;
	 -webkit-box-shadow: 1px 1px 30px #200915;
    -moz-box-shadow: 1px 1px 30px #200915;
    box-shadow: 1px 1px 30px #200915;
	}
h2, h3 {
	font-size : 1.2em;
	line-height : 18px;
	margin-top : 10px;
	margin-right : 0;
	margin-bottom : 10px;
	margin-left : 10px;
	padding-top : 0;
	padding-right : 0;
	padding-bottom : 0;
	
}
h2 {
	background-color: transparent;
	background-image: url(img/braun_roz.png);
	background-repeat: no-repeat;
	background-position: 3px 0px;
	padding-left : 20px;
}
h3 {
	background : transparent url(img/pfeil.png) no-repeat 0 0;
	padding-left : 30px;
}
h2.eins {
	background : transparent url(img/1.png) no-repeat 0 0;
}
h2.zwei {
	background : transparent url(img/2.png) no-repeat 0 0;
}
h2.drei {
	background : transparent url(img/3.png) no-repeat 0 0;
}
h2.rosa {
	background : transparent url(img/rosa.png) no-repeat 0 2px; padding-left : 30px!important;
}
#inhalt h2, #inhalt h3 {
	color : #cccccc;
	letter-spacing : 0.2em;
}
#inhalt h1 {
	color : #414c59;
	font-size : 1.5em;
	padding : 3px 3px 3px 20px;
	background: #FCE9D0;
	border-bottom : 5px solid #e3d2bd;
	border-top : 2px solid #e3d2bd;
	margin: 0 0 15px 0;
	text-shadow:1px 1px 5px #666666;
	letter-spacing:0.1em;
	
}
#inhalt p, #inhalt ul {
	margin : 10px;
	letter-spacing : 0.1em;
	line-height : 1.7em;
	font-size : 1.3em;
	color : #DACBAE;
}
#inhalt li {
	list-style-position: inside;
}
#inhalt a, #inhalt a:hover {
	color : #ffffff;
	font-size : 0.9em;
}
#info {
	float : left;
	margin :0 10px 10px 0;
	width : 64%;
	padding :0;
}
#home #info {
	width:60%;
}
#html_css #info {
	width:62%
}
#html_css #info li {
	list-style-type:none;
	line-height: 110%;
	font-size:98%;
	background-image:url(img/klammer_mini.png);
	background-repeat: no-repeat;
	background-position: left center;
	margin: 3px 3px 3px 9px;
	padding-top: 2px;
	padding-right: 0px;
	padding-bottom: 2px;
	padding-left: 37px;
}
#html_css #html_design {
	width:32%;
	color:#CCCCCC;
	font-size:120%;
}
#webdesign #info, #e-commerce #info {
	
	width : 63%;
}
#anfrage-webdesign #info {
	min-height : 600px;
}
#webseite-pflege #info {
	min-height : 400px;
}
img.referenz {
	float : left;
	width : 89px;
	margin-top : 0;
	margin-right : 15px;
	margin-bottom : 5px;
	margin-left : 5px;
}
img.ref {
	float : left;
	width : 66px;
	margin-top : 15px;
	margin-right : 35px;
	margin-bottom : 5px;
	margin-left : 5px;
}
#info fieldset {
	color : #ffffff;
	letter-spacing : 0.1em;
	margin-top : 10px;
	font-size : 125%;
}
#info legend {
	border-left : 3px solid #c3dbf8;
	font-size : 105%;
	color : #c3dbf8;
	font-weight : bold;
	margin-top : 5px;
	padding-left : 5px;
}
fieldset {
	border : 1px dotted #cccccc;
	padding : 10px;
}
#inhalt h5 {
	color : #cccccc;
	font-size : 1.1em;
	text-align : center;
	margin : 10px 0 3px 0;
	padding : 0;
}
#neu {
	float : right;
	margin : 10px;
	padding : 0 10px 0 10px;
	width : 28%;
	background : #585147;
	border:solid 2px transparent;
	-moz-border-radius:3px; -webkit-border-radius:3px;
             box-shadow: 0 0 1px #fff; -moz-box-shadow: inset 0 0 1px #fff; -webkit-box-shadow: inset 0 0 1px #fff;
			 
			 
			 
}
#grau {
	float : right;
	margin : 10px 20px 10px 10px;
	padding : 0 10px 0 10px;
	width : 28%;
	background:#A6957D;
	border:solid 2px transparent;;
	-moz-border-radius:3px; -webkit-border-radius:3px;
             box-shadow: 0 0 1px #fff; -moz-box-shadow: inset 0 0 1px #fff; -webkit-box-shadow: inset 0 0 1px #fff;
	color:#2B0C0E!important;
	font-size:95%;
	font-weight:bold;
}
#neu span, #webpraesenz span{
	color : #E6CCAA;
	font-size : 95%;
}
#webpraesenz li {
	color : #E6CCAA;
	list-style-position:outside;
	margin: 0 0 0 17px;
	font-size:120%;
}
#webpraesenz, #html_design {
	float : right;
	margin : 10px;
	padding : 0 10px 0 10px;
	width : 28%;
	background : #685D4E;
}
#webpraesenz {
	border:solid 2px transparent; -moz-border-radius:3px; -webkit-border-radius:3px;
             box-shadow: 0 0 1px #fff; -moz-box-shadow: inset 0 0 1px #fff; -webkit-box-shadow: inset 0 0 1px #fff;
}
#home #anfrage, #home #webpraesenz, #home #neu {
	width:30%;
}
#anfrage {
	float : right;
	width : 30%;
	margin : 10px;
}
#home #webpraesenz, #home #neu {
	margin : 10px;
	padding : 0;
}
#home #neu {
	text-align:center;
}
#anfrage_rechts {
	float : left;
	margin : 10px;
	width : 62%;
	padding : 0;
}
#anfrage, #anfrage_rechts{
	background : #4C381D;
	border:solid 2px transparent; -moz-border-radius:3px; -webkit-border-radius:3px;
             box-shadow: 0 0 1px #fff; -moz-box-shadow: inset 0 0 1px #fff; -webkit-box-shadow: inset 0 0 1px #fff;
}


#anfrage a, #anfrage_rechts a {
	color : #fbfbf3;
	text-decoration : none;
	padding : 0 10px 0 3px;
}
#footer {
	text-align : right;
	color : #BFA0A5;
	padding : 5px 0 0 0;
	font-size:110%;
	font-weight:bold;
}
#footer ul {
	width : 300px;
}
#footer li {
	float : left;
	list-style-type : circle;
	display : inline;
	margin : 0 5px 0 0;
}
#footer a {
	/*color : #8594A1;*/
	color : #BFA0A5;
	text-decoration : none;
}
.kast {
	float : left;
	margin : 3px;
	padding : 0;
	font-size : 120%;
}
#leistung.kast {
	width : 45%;
}
#leistung.kast a {
	color : #ffffff;
	text-decoration : none;
}
#leistung.kast a:hover {
	color : #63a5c5;
	text-decoration : none;
}
#basic.kast {
	width : 15%;
}
#business.kast {
	width : 15%;
}
#profi.kast {
	width : 18%;
}
#leistung h1, #basic h1, #business h1, #profi h1, #commerce h1 {
	margin : 0 0 15px 0;
	padding : 5px 3px!important;
	background : #B4AB92;
	color : #4E4A3F;
	letter-spacing : 0.1em;
	border-bottom : 1px solid #E6CCAA; 
	border-top : 1px solid #E6CCAA;
	-moz-border-radius:3px; -webkit-border-radius:3px;
             box-shadow: 0 0 1px #fff; -moz-box-shadow: inset 0 0 1px #fff; -webkit-box-shadow: inset 0 0 1px #fff;
	font-size : 95%;
}
#leistung li, #basic li, #business li, #profi li, #commerce li {
	border-bottom : 2px solid #7F7260;
	letter-spacing:0.1em;
	list-style : none;
	min-height : 21px;
	font-size : 90%;
	margin:8px 0 5px 3px;
	font-size-adjust:inherit;
	vertical-align:baseline;
}
.haken {
	background : transparent url(img/ok.png) no-repeat center bottom;
	padding:3px 0 3px 0;
}
.nichts {
	background : transparent url(img/nichts.png) no-repeat center bottom;
	padding:3px 0 2px 0;
}
.pfeil {
	background : transparent url(img/pfeil.png) no-repeat center bottom;
}
#leistung.kast li {
	background : transparent url(img/info.png) no-repeat 100% 50%;
	cursor : pointer;
}
#html_css #commerce.kast li, #commerce.kast li {
	background : transparent url(img/info.png) no-repeat 98% 50%;
	cursor : pointer;
	padding-left:0;
}
.mitte {
	text-align : center;
}
.preis {
	color:#A6957D!important;
	font-size : 1.1em!important;
	font-weight : bold;
	background : #5D5346;
	text-align : right;
	background-image:none!important;
	padding:3px;
}
p.preis {
	width:96%;
}
.clear {
	clear : both;
}
#commerce {
	width : 98%;
	margin:0 0 0 11px;
}
.hide {
	position : absolute;
	z-index : 800;
	left : -9999px;
}
.hide {
	border : 1px solid #000;
	padding : 5px 10px;
	background : #fff;
	text-align : left;
}
.hide h2 {
	font-size : 120%;
	margin : 0;
	padding : 5px 0;
	background-image : none;
	text-align : center;
}
.hide p {
	padding : 10px;
	margin : 0;
	font-size : 120%;
	line-height : 1.5em;
	letter-spacing : 0.1em;
	color : #ffffff;
	font-weight : bold;
}
.hide img {
	border : 1px solid #aaa;
	padding : 5px;
}
span.toptip {
	color : #800;
	font-weight : bold;
	font-style : italic;
}
a.toptip {
	font-weight : bold;
	font-style : italic;
}
img.toptip {
	padding : 0px;
	margin : 5px 0 5px 0px;
	float:left;
}
h2.toptip {
	color : #800;
	margin : 0;
	padding : 0 0 0 25px;
	font-style : italic;
}
#lifespan {
	width : 200px;
}
#beratung, #domain, #layout, #seitenanzahl, #valides_html, #website_launch, #kontaktformular, #sitemap, #favicon, #beispiele, #preis, #kategorie, #editor, #sprache, #sonderangebot, #download, #versand, #zahlung, #ssl, #gutscheine, #marketing, #marketing, #marketing, #export, #direkturl, #geld, #geheim, #support, #webdesign_referenz1, #webdesign_referenz2, #webdesign_referenz3, #webdesign_referenz4, #webdesign_referenz5, #webdesign_referenz6 {
	width : 380px;
	border : 0;
	padding : 0;
	background : transparent;
}
.xb1, .xb2, .xb3, .xb4, .xb5, .xb6, .xb7 {
	display : block;
	overflow : hidden;
	font-size : 0;
}
.xb1, .xb2, .xb3, .xb4, .xb5, .xb6 {
	height : 1px;
}
.xb4, .xb5, .xb6, .xb7 {
	background : #AA9474;
	border-left : 1px solid #E6CCAA;
	border-right : 1px solid #E6CCAA;
}
.xb1 {
	margin : 0 8px;
	background : #AA9474;
}
.xb2 {
	margin : 0 6px;
	background : #AA9474;
}
.xb3 {
	margin : 0 4px;
	background : #AA9474;
}
.xb4 {
	margin : 0 3px;
	background : #AA9474;
	border-width : 0 5px;
}
.xb5 {
	margin : 0 2px;
	background : #AA9474;
	border-width : 0 4px;
}
.xb6 {
	margin : 0 2px;
	background : #AA9474;
	border-width : 0 3px;
}
.xb7 {
	margin : 0 1px;
	background : #AA9474;
	border-width : 0 3px;
	height : 2px;
}
.xboxcontent {
	display : block;
	background : #AA9474;
	border : 3px solid #E6CCAA;
	border-width : 0 3px;
}
.xboxcontent h2 {
	padding : 5px;
	color : #2c303c;
}
ul.check li {
	line-height : 1.8em;
	padding : 0 0 0 28px;
	list-style-type : none;
	background-color: transparent;
	background-image: url(img/klammer_mini.png);
	background-repeat: no-repeat;
	background-position: 0 3px;
}
.wichtig {
	font-weight : bold;
	font-size : 150%;
	text-transform : uppercase;
	padding : 8px 0 15px 0;
	text-decoration : underline;
}
#zitat {
	background : #6F5126 url(img/klammer.png) no-repeat 0 0;
	float : right;
	margin : 10px 20px 10px 10px;
	padding : 0 10px 0 20px;
	width : 27%;
	border:solid 2px transparent; -moz-border-radius:3px; -webkit-border-radius:3px;
             box-shadow: 0 0 1px #fff; -moz-box-shadow: inset 0 0 1px #fff; -webkit-box-shadow: inset 0 0 1px #fff;
}
#zitat .autor {
	font-style : italic;
	visibility : visible;
	margin : 0;
}
#portrait, #design_html {
	background : #685D4E;
	float : right;
	margin : 10px 20px 10px 10px;
	padding : 0 10px 0 10px;
	width : 28%;
	text-align : right;
	border:solid 2px transparent; -moz-border-radius:3px; -webkit-border-radius:3px;
             box-shadow: 0 0 1px #fff; -moz-box-shadow: inset 0 0 1px #fff; -webkit-box-shadow: inset 0 0 1px #fff;
}
#home #portrait {
	background : #685D4E;
	float : right;
	margin : 10px 10px 10px 10px;
	padding : 0 10px 0 10px;
	width : 28%;
	text-align : right;
	border:solid 2px transparent; -moz-border-radius:3px; -webkit-border-radius:3px;
             box-shadow: 0 0 1px #fff; -moz-box-shadow: inset 0 0 1px #fff; -webkit-box-shadow: inset 0 0 1px #fff;
}
#portrait p {
	color : #e2d4f5;
	font-size : 1.2em;
	font-weight:bold;
}
#portrait img {
	margin :15px 3px 3px 3px;
}
.underline {
	border-bottom : 1px solid #4f5768;
	border-right : 1px solid #4f5768;
	padding : 0 5px 5px 0;
	-moz-border-radius:3px; -webkit-border-radius:3px;
             box-shadow: 0 0 1px #fff; -moz-box-shadow: inset 0 0 1px #fff; -webkit-box-shadow: inset 0 0 1px #fff;
}
.kast_1 {
	font-size : 125%;
	float : left;
	font-family : Verdana, Arial, Helvetica, sans-serif;
	font-size : 80%;
	padding : 0 15px 0 10px;
	min-height : 205px;
	height : 270px;
	text-align : justify;
	width : 350px;
	max-width : 350px;
	border-bottom : 1px dotted #cccccc;
}
.kast_1 img, .kast_2 img {
	margin : 10px;
	float : left;
}
.kast_2 {
	font-size : 125%;
	float : right;
	font-size : 80%;
	padding : 0 15px 0 10px;
	min-height : 205px;
	height : 270px;
	text-align : justify;
	width : 350px;
	max-width : 350px;
	border-bottom : 1px dotted #cccccc;
}
/*formular*/

.name_input, .email_input, .betreff_input, .message_input {
	margin:10px 0 10px 0;
}
#kontakt form, #kontakt_output {
	font-size:125%;
	color:#ffffff;
	padding:25px;
}
#kontakt label, div.name_input label, div.email_input label, div.betreff_input label, div.message_input label {
	color:#ffffff;
	width: 200px;
	display:block;
	float:left;
}
/*design to html*/
#html_design label, #html_design span {
	color:#ffffff;
	font-size:110%;
	padding:3px;
}
#html_design label {
	width:90%;
	display:block;
	font-style:italic;
}
#html_design legend {
	color:#cccccc;
	font-size:120%;
	font-style:italic;
	font-weight:bold;
}
#html_design input, .srew {
	background:#5D5346;
	border:none;
	padding:1px;
	color:#cccccc;
}
input.gross {
	width:90%;
}
input.senden {
	height:28px;
	width:100%;
	font-size:120%;
	font-weight:bold;
	margin:8px 0 8px 0;
	padding:8px;
	float:right;
	border:1px solid #cccccc;
}
.error {
	color:#FF3399;
}
.dunkler {
	background:#A6957D;
	padding:10px;
	margin-top:0;
	width:94%;
	border:solid 1px transparent; -moz-border-radius:3px; -webkit-border-radius:3px;
             box-shadow: 0 0 1px #fff; -moz-box-shadow: inset 0 0 1px #fff; -webkit-box-shadow: inset 0 0 1px #fff;
	color:#2B0C0E!important;
}
.unt {
	margin:5px 0 25px 0;
}
/*neu ab 03.2010*/

.green {
	margin:10px;
	background:#685D4E;
	min-height: 150px;
	width:100%;
	margin-bottom:1.5em!important;
	padding-top: 15px;
	padding-right: 15px;
	padding-bottom: 15px;
	line-height:160%!important;
}
.green p {
	padding-left: 138px;
}
.green ul li {
	color:#A99A87;
	font-size:110%;
	font-weight:bold;
	line-height:190%;
	list-style-type: none;
	list-style-position:outside;
	padding-left:25px;
	margin-left:10px;
	background-image: url(img/klammer_mini.png);
	background-repeat: no-repeat;
	background-position: 0px 3px;
}

.green ul li.ssylka{font-size:140%; background-image:none!important; text-align:right;}


#apfel {
	background-image: url(img/apfel_fon_k.png);
	background-repeat: no-repeat;
	background-position: 8px 25px;
}
#muschel {
	background-image: url(img/muschel_fon_k.png);
	background-repeat: no-repeat;
	background-position: 8px 25px;
}
#erde {
	background-image: url(img/erde_fon_k.png);
	background-repeat: no-repeat;
	background-position: 8px 25px;
}
.green a, .green a:link , .green a:active {
	-moz-border-radius:3px; -webkit-border-radius:3px;
	box-shadow: 0 0 1px #fff; -moz-box-shadow: inset 0 0 1px #fff; -webkit-box-shadow: inset 0 0 1px #fff;
	text-decoration:none;
	color:#FCE9D0!important;
	font-weight: bold;
	font-size:95%;
	background:#534A3E; padding: 1px 5px;
	border:solid 1px transparent; display:block; position:relative;
    text-decoration:none; min-width:120px;
	
}
/*.green a:hover{color:#534A3E; background:#4C381D; }*/
.green a:hover{border:solid 1px #000;
             -moz-border-radius:3px; -webkit-border-radius:3px;
             box-shadow: 0 0 1px #fff; -moz-box-shadow: inset 0 0 1px #fff; -webkit-box-shadow: inset 0 0 1px #fff;
             background-color:#8594A1;}
            
             
#screenshot {
	position:absolute;
	border:1px solid #ccc;
	background:#333;
	padding:5px;
	display:none;
	color:#fff;
	z-index:100;
}
.webreferenz {
	text-align:left;
	padding-left:105px;
	;
	min-height:80px;
}
#one {
	background-image: url(webdesign-referenzen/4.jpg);
	background-repeat: no-repeat;
	background-position: 0 5px;
}
#two {
	background-image: url(webdesign-referenzen/3.jpg);
	background-repeat: no-repeat;
	background-position: 0 5px;
}
#three {
	background-image: url(webdesign-referenzen/6.jpg);
	background-repeat: no-repeat;
	background-position: 0 5px;
}
#four {
	background-image: url(webdesign-referenzen/8.jpg);
	background-repeat: no-repeat;
	background-position: 0 5px;
}