/*
Benjamin Singer
www.benjaminsinger.de
Start: 17.05.2008
Letzte Aenderung: 25.08.2010
Codezeilen: 1005
*/


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

* {
	padding: 0;
	margin: 0;
	border: 0;
}


/* Globals und Typo 
--------------------------------------------- */

html {
}

body {
	background: url(images/bg.jpg) repeat;
	text-align: center; /* --------- fuer IE 5.0 --------- */
	font-size: 25px;
	font: 20px Georgia, "Times New Roman", Times, serif;
}

a, a:link {
	color: #000;
	text-decoration: none;
	border-bottom: 1px solid #000;
	padding-bottom: 1px;
}

a:visited {
	color: #000;
	text-decoration: none;
}

a:hover {
	color: #fff;
	text-decoration: none;
	border-bottom: 1px solid #000;
	background: #000;
}

a:focus {
	outline: none; /* --------- keine gepunktete Linie mehr --------- */
}

h1 {
	color: #871e28;
	text-decoration: none;
	font-weight: bold;
	font-size: 15px;
	margin: 11px 0 0;
	text-align: right;
	background: white;
}

strong {
	font-weight: bold;
}


/* Links- bzw. Rechtsausrichtung fuer Elemente in Cbox 
--------------------------------------------- */

#cbox .links {
	float: left;
	margin: 0 10px 10px 0;
}

#cbox .rechts {
	float: right;
	margin: 0 0 10px 10px;
}


/* Layout - Standard
--------------------------------------------- */

#wrapper {
	margin: 0 auto;
	padding: 74px 0;
	width: 654px;
	/* height: 621px; */
	text-align: left;
}

#header {
	background: url(images/header.png) repeat-x;
	height: 58px;
	margin: 2px auto 0;
}


/*
#navi {
	color: #3e428f;
	font-weight: bold;
	text-decoration: underline;
	font-style: italic;
	font-size: 20px;
	background: #fff;
	height: 91px;
	/* border-bottom: 1px dashed #000;
}
*/

/*
#messagestrip {
	background: url(images/messagestrip_transp.png) no-repeat;
	display: block;
	width: 281px;
	height: 160px;
	position: absolute;
	top: 0px;
	right: 0px;
}

*/
/*
#content {
	width: 598px;
	margin: 0 auto;
}
*/

#cbox {
	width: 560px;
	margin: 4px auto 0;	
}

/*
#foto-haus {
	background: url(images/haus.jpg) no-repeat;
	width: 275px;
	height: 190px;
	float: right;
	margin: 50px 0 10px 5px;
}

*/
#foto-tasse {
	background: url(images/tasse.jpg) no-repeat;
	width: 364px;
	height: 320px;
	float: right;
	margin: 50px 10px 10px 5px;
}

#bittewaehlen {
	background: url(images/bittewaehlen.png) no-repeat;
	width: 173px;
	height: 180px;
	float: left;
	position: relative;
	left: 40px;
	top: 70px;
}

/*
#ornament {
	background: url(images/ornament.png) no-repeat;
	width: 30px;
	height: 8px;
	display: block;
}

*/

#blende {
	background: url(images/blende.jpg) no-repeat;
	width: 289px;
	height: 241px;
	float: left;
	position: relative;
	top: -35px;
	z-index: 1;
}

#flickr {
	width: 120px;
	height: 170px;
	float: right;
	position: relative;
	top: -130px;
	margin: 30px 0 0 20px;
}

#dosen {
	background: url(images/dosen.jpg) no-repeat;
	width: 240px;
	height: 190px;
	float: right;
	margin: 30px 10px 10px;
}

#klick-webdesign {
	background: url(images/klick.png) no-repeat;
	width: 154px;
	height: 46px;
	position: relative;
	top: 64px;
	right: 10px;
}

#klick-print {
	background: url(images/klick.png) no-repeat;
	width: 154px;
	height: 46px;
	margin: 20px 0 0 -10px;
	float: left;
}

#im-box {
	width: 254px;
	background: #d5d7dc;
	border: 1px solid #aaa;
	padding: 3px 3px 0;
}

/*
#links {
	float: left;
	width: 50%;
}

#rechts {
	float: right;
	width: 50%;
}
*/

#kontakt-text {
	width: 270px;
	position: relative;
	top: -450px;
	left: 280px
}

#apfel {
	background: url(images/apfel.jpg) no-repeat;
	width: 200px;
	height: 214px;
	margin: 0 0 20px 0;
}


/* Layout - Schatten
--------------------------------------------- */

#contentbox_obenlinks {
	background: url(images/contentbox_obenlinks.png) top left no-repeat;
	width: 17px;
	height: 164px;
}

/*
#contentbox_links {
	background: url(images/contentbox_links.png) left repeat-y;
	width: 17px;
	min-height: 402px;
}

*/
#contentbox_untenlinks {
	background: url(images/contentbox_untenlinks.png) bottom left no-repeat;
	width: 17px;
	height: 55px;
}

#contentbox_obenrechts {
	background: url(images/contentbox_obenrechts.png) top right no-repeat;
	width: 17px;
	height: 164px;
	float: right;
	margin: -621px 0 0 0;
}

/*
#contentbox_rechts {
	background: url(images/contentbox_rechts.png) right repeat-y;
	width: 17px;
	min-height: 402px;
	float: right;
	margin: -457px 0 0 0;
}

*/
/*
#contentbox_untenrechts {
	background: url(images/contenbox_untenrechts.png) bottom right no-repeat;
	width: 17px;
	height: 55px;
	float: right;
	margin: -55px 0 0 0;
}

*/
/*
#contentbox_main {
	background: white;
	width: 620px;
	min-height: 621px;
	float: left;
	margin: -621px 0 0 17px;
}

*/

/* Kategorie-Beschreibungen
--------------------------------------------- */

/*
a#home span {
	background: url(images/desc_home.png) no-repeat;
}

*/
#navi span {
	display: none;
	position: absolute;
}

#navi a:hover span {
	display: block;
}

/*
#navi-home span {
	background: url(images/desc_home.png) no-repeat;
	width: 74px;
	height: 57px;
	left: 10px;
	top: 30px;
}

#navi-webdesign span {
	background: url(images/desc_webdesign.png) no-repeat;
	width: 97px;
	height: 57px;
	left: 119px;
	top: 30px;
}

#navi-portfolio span {
	background: url(images/desc_portfolio.png) no-repeat;
	width: 112px;
	height: 57px;
	left: 253px;
	top: 30px;
}

#navi-foto span {
	background: url(images/desc_foto.png) no-repeat;
	width: 102px;
	height: 57px;
	left: 382px;
	top: 30px;
}

#navi-kontakt span {
	background: url(images/desc_kontakt.png) no-repeat;
	width: 79px;
	height: 57px;
	left: 510px;
	top: 30px;
}

*/

/* Boxen mit runden Ecken
--------------------------------------------- */

/*
.rundbox-breit {
	width: 553px;
	margin: 0 auto;
}

*/
.rundbox-breit .rechtsoben {
	background: url(images/rundbox/rechtsoben.png) top right no-repeat;
}

.rundbox-breit .linksoben {
	background: url(images/rundbox/linksoben.png) top left no-repeat;
}

.rundbox-breit .rechtsunten {
	background: url(images/rundbox/rechtsunten.png) bottom right no-repeat;
}

.rundbox-breit .linksunten {
	background: url(images/rundbox/linksunten.png) bottom left no-repeat;
}

.rundbox-breit .rundbox-content {
	padding: 10px;
}

/*
.rundbox-gelb {
	width: 179px;
	margin: 10px auto;
}

*/
.rundbox-gelb .rechtsoben {
	background: url(images/rundbox_gelb/rechtsoben.png) top right no-repeat;
}

.rundbox-gelb .linksoben {
	background: url(images/rundbox_gelb/linksoben.png) top left no-repeat;
}

.rundbox-gelb .rechtsunten {
	background: url(images/rundbox_gelb/rechtsunten.png) bottom right no-repeat;
}

.rundbox-gelb .linksunten {
	background: url(images/rundbox_gelb/linksunten.png) bottom left no-repeat;
}

.rundbox-gelb .rundbox-content p {
	padding: 7px;
	font-size: 15px;
	line-height: 20px;
	font-style: italic;
}

/*
.rundbox-gelb a, .rundbox-gelb a:link, .rundbox-gelb a:visited {
	border-bottom: 1px solid #ff0000;
}

.rundbox-gelb a:hover, .rundbox-gelb a:active {
	background: #ff0000;
}

*/

.rundbox-gelb a, .rundbox-gelb a:link, .rundbox-gelb a:visited {
	background: #ff0000;
	border: none;
	color: #fff;
}

.rundbox-gelb a:hover, .rundbox-gelb a:active {
	background: #000;
}


/* Formular
--------------------------------------------- */

form {
	background: #edeff5;
	padding: 5px 10px;
	width: 240px;
	border: 1px solid #aaa;
	margin: 0 0 0px 0;
}

input, textarea {
	padding: 5px;
	border: 1px solid #aaa;
	font: 13px Arial, Helvetica, Geneva, sans-serif;
	color: #111;
	width: 230px;
}

label {
	display: block;
	font-size: 14px;
	font-weight: bold;
}

.senden {
	font: 14px Georgia, "Times New Roman", Times, serif;
	width: 150px;
	border: 2px solid #000;
	padding: 2px;
	background: none;
	font-weight: bold;
}

span.nichtfett {
	font-weight: normal;
}


/* Portfolio-Items
--------------------------------------------- */

#portfolio-webdesign a, #portfolio-webdesign a:link, #portfolio-webdesign a:visited {
	width: 82px;
	height: 164px;
	color: #a1a097;
	border: none;
	text-align: center;
	font-size: 12px;
	line-height: 15px;
	float: left;
	padding: 0 2px 0 0;
}

#portfolio-webdesign a:hover, #portfolio-webdesign a:active {
	color: #575757;
}

#portfolio-webdesign span.referenz {
	position: relative;
	top: 170px;
}

a#referenz-drupato, a#referenz-drupato:link, a#referenz-drupato:visited {
	background: url(images/portfolio_thumbs/12.jpg) 0 0 no-repeat;
	/* margin: -40px 0 0 191px; */
	margin: -40px 0 0 155px;
}

a#referenz-drupato:hover, a#referenz-drupato:active {
	background-position: -91px 0;
}

a#referenz-ellinger, a#referenz-ellinger:link, a#referenz-ellinger:visited {
	background: url(images/portfolio_thumbs/11.jpg) 0 0 no-repeat;
	/* margin: -40px 0 0 191px; */
	margin: -40px 0 0 0;
}

a#referenz-ellinger:hover, a#referenz-ellinger:active {
	background-position: -91px 0;
}

a#referenz-pratley, a#referenz-pratley:link, a#referenz-pratley:visited {
	background: url(images/portfolio_thumbs/10.jpg) 0 0 no-repeat;
	margin: -40px 0 0 0;
}

a#referenz-pratley:hover, a#referenz-pratley:active {
	background-position: -91px 0;
}

a#referenz-berger, a#referenz-berger:link, a#referenz-berger:visited {
	background: url(images/portfolio_thumbs/9.jpg) 0 0 no-repeat;
	margin: -40px 0 0 0;
}

a#referenz-berger:hover, a#referenz-berger:active {
	background-position: -91px 0;
}

a#referenz-3x3, a#referenz-3x3:link, a#referenz-3x3:visited {
	background: url(images/portfolio_thumbs/8.jpg) 0 0 no-repeat;
	margin: -40px -20px 0 0;
}

a#referenz-3x3:hover, a#referenz-3x3:active {
	background-position: -91px 0;
}

a#referenz-sunflower, a#referenz-sunflower:link, a#referenz-sunflower:visited {
	background: url(images/portfolio_thumbs/7.jpg) 0 0 no-repeat;
	/* margin: -40px 0 0 0; */
	margin: 50px 0 0 -14px;
}

a#referenz-sunflower:hover, a#referenz-sunflower:active {
	background-position: -91px 0;
}

a#referenz-green, a#referenz-green:link, a#referenz-green:visited {
	background: url(images/portfolio_thumbs/6.jpg) 0 0 no-repeat;
	margin: 50px 0 0 0;
}

a#referenz-green:hover, a#referenz-green:active {
	background-position: -91px 0;
}

a#referenz-ibot, a#referenz-ibot:link, a#referenz-ibot:visited {
	background: url(images/portfolio_thumbs/5.jpg) 0 0 no-repeat;
	margin: 50px 0 0 0;
}

a#referenz-ibot:hover, a#referenz-ibot:active {
	background-position: -91px 0;
}

a#referenz-cnc, a#referenz-cnc:link, a#referenz-cnc:visited {
	background: url(images/portfolio_thumbs/4.jpg) 0 0 no-repeat;
	margin: 50px 0 0 0;
}

a#referenz-cnc:hover, a#referenz-cnc:active {
	background-position: -91px 0;
}

a#referenz-red, a#referenz-red:link, a#referenz-red:visited {
	background: url(images/portfolio_thumbs/3.jpg) 0 0 no-repeat;
	margin: 50px 0 0 0;
}

a#referenz-red:hover, a#referenz-red:active {
	background-position: -91px 0;
}

a#referenz-holiday, a#referenz-holiday:link, a#referenz-holiday:visited {
	background: url(images/portfolio_thumbs/2.jpg) 0 0 no-repeat;
	margin: 50px 0 0 0;
}

a#referenz-holiday:hover, a#referenz-holiday:active {
	background-position: -91px 0;
}

a#referenz-glossy, a#referenz-glossy:link, a#referenz-glossy:visited {
	background: url(images/portfolio_thumbs/1.jpg) 0 0 no-repeat;
	margin: 50px -15px 0 0;
}

a#referenz-glossy:hover, a#referenz-glossy:active {
	background-position: -91px 0;
}

#portfolio-print {
	margin: 0 0 0 5px;
}

#portfolio-print a, #portfolio-print a:link, #portfolio-print a:visited {
	width: 542px;
	height: 143px;
	color: #a1a097;
	border: none;
	font-size: 12px;
	line-height: 15px;
	float: left;
	padding: 0 7px 0 0;
}

#portfolio-print a:hover, #portfolio-print a:active {
	color: #575757;
}

a#referenz-faek, a#referenz-faek:link, a#referenz-faek:visited {
	background: url(images/portfolio_thumbs/print/4.jpg) 0 0 no-repeat;
	margin: 0 7px 10px 0;
	width: 86px;
	height: 79px;
	position: relative;
 	bottom: 10px;
}

a#referenz-faek:hover, a#referenz-faek:active {
	background-position: -93px 0;
}

a#referenz-drupato4, a#referenz-drupato4:link, a#referenz-drupato4:visited {
	background: url(images/portfolio_thumbs/print/3d.jpg) 0 0 no-repeat;
	margin: 0 0 10px 17px;
	width: 86px;
	height: 79px;
	position: relative;
 	bottom: 10px;
}

a#referenz-drupato4:hover, a#referenz-drupato4:active {
	background-position: -93px 0;
}

a#referenz-drupato3, a#referenz-drupato3:link, a#referenz-drupato3:visited {
	background: url(images/portfolio_thumbs/print/3c.jpg) 0 0 no-repeat;
	margin: 0 0 10px 17px;
	width: 86px;
	height: 79px;
	position: relative;
 	bottom: 10px;
}

a#referenz-drupato3:hover, a#referenz-drupato3:active {
	background-position: -93px 0;
}

a#referenz-drupato2, a#referenz-drupato2:link, a#referenz-drupato2:visited {
	background: url(images/portfolio_thumbs/print/3b.jpg) 0 0 no-repeat;
	margin: 0 0 10px 17px;
	width: 86px;
	height: 79px;
	position: relative;
 	bottom: 10px;
}

a#referenz-drupato2:hover, a#referenz-drupato2:active {
	background-position: -93px 0;
}

a#referenz-drupato1, a#referenz-drupato1:link, a#referenz-drupato1:visited {
	background: url(images/portfolio_thumbs/print/3a.jpg) 0 0 no-repeat;
	margin: 0 0 10px 10px;
	width: 86px;
	height: 79px;
	position: relative;
 	bottom: 10px;
}

a#referenz-drupato1:hover, a#referenz-drupato1:active {
	background-position: -93px 0;
}

a#referenz-fullhouse, a#referenz-fullhouse:link, a#referenz-fullhouse:visited {
	background: url(images/portfolio_thumbs/print/2.jpg) 0 0 no-repeat;
	margin: 15px 0 0 0;
}

a#referenz-fullhouse:hover, a#referenz-fullhouse:active {
	background-position: -548px 0;
}

a#referenz-kulturnacht, a#referenz-kulturnacht:link, a#referenz-kulturnacht:visited {
	background: url(images/portfolio_thumbs/print/1.jpg) 0 0 no-repeat;
	margin: 20px 0 0 0;
}

a#referenz-kulturnacht:hover, a#referenz-kulturnacht:active {
	background-position: -548px 0;
}

#portfolio-print span.referenz {
	position: relative;
	top: 145px;
}

#portfolio-print span.referenz2 {
	position: relative;
	top: 80px;
}

/* Unsortiert
--------------------------------------------- */

/*
#navi ul {
	list-style: none;
	position: relative;
	top: 7px;
	margin: 0 auto;
}

#navi li {
	float: left;
	background: white;
	display: block;
	/* min-width: 58px;
	text-align: center;
	margin: 0 18px;
}
*/

#navi li.links {
	margin: 0 18px 0 0px;
}

/*
#navi li.rechts {
	margin: 0 0px 0 19px;
}

*/
/*
#navi li a, #navi li a:visited {
	background: #fff;
	color: #3e428f;
	padding: 7px 5px 5px;
	border-bottom: 0;
}

#navi li a:hover, #navi li a:active {
	background: #4e53ac;
	border-top: #8184c0 solid 11px;
	border-bottom: 0;
	color: #fff;
	padding: 7px 5px 5px;
}

*/
ul.portfolio {
	margin: 20px auto 0;
	text-align: center;
}

ul.portfolio li {
	padding: 0 40px;
	display: inline;
	list-style: none;
}

ul.portfolio a, ul.portfolio a:link {
	border-bottom: 11px solid #d95d19;
	font-size: 34px;
	padding-bottom: 2px;
}

img#hoeher {
	position: relative;
	top: -6px;
}

#cbox p.normal {
	margin: 0 0 5px;
	line-height: 26px;
}

#gruss {
	font-size: 23px;
	letter-spacing: 1px;
	line-height: 30px;
}

span.highlight {
	font-weight: normal;
	font-size: 35px;
}

span.rechtsbuendig {
	float: right;
	margin-bottom: 10px;
}

/*
hr.gross {
	border-top: 1px dotted #b2b2b2;
	width: 100%;
	margin: 10px 0;
	clear: both;
}

*/
/*
hr.gross-enger {
	border-top: 1px dotted #b2b2b2;
	width: 100%;
	margin: 10px 0;
	clear: both;
	position: relative;
	top: -12px;
}

*/
hr.mittel {
	border-top: 1px dotted #b2b2b2;
	width: 65%;
	margin: 10px 0;
	clear: both;
	position: relative;
	top: -20px;
}

/*
hr.halb {
	border-top: 1px dotted #b2b2b2;
	width: 270px;
	margin: 10px 0;
}

*/
p.schrift-kleiner {
	font-size: 17px;
	padding: 10px 0 0 10px;
	line-height: 26px;
}

p.schrift-kleiner-absatz-klein {
	font-size: 17px;
	padding: 0 0 0 10px;
	line-height: 26px;
}

p.eingerueckt {
	font-size: 17px;
	padding: 0 0 10px 10px;
	
}

p.schrift-mittel {
	font-size: 19px;
	padding: 10px 0 0 10px;
	line-height: 26px;
}

.absatz-gross {
	margin: 18px 0;
	display: block;
}

strong.blau a, strong.blau a:link {
	font-size: 20px;
	border: 0;
	color: #fff;
	padding: 2px;
	background: #1996d6;
	font-weight: normal;
}

strong.blau a:hover, strong.blau a:active {
	background: #000;
}

h2.foto {
	background: url(images/foto_heading.png) no-repeat;
	width: 338px;
	height: 77px;
	float: right;
	position: relative;
	z-index: 2;
}

span.invisible {
	visibility: hidden;
}

/*
p.schrift-kleiner-untenrechts {
	font-size: 17px;
	padding: 100px 0 0 10px;
	line-height: 26px;
}

*/
p.schrift-kleiner-rechts {
	font-size: 17px;
	float: right;
	line-height: 26px;
}

.rosa {
	color: #ff0084
}

.hellblau {
	color: #0063dc
}

.kursiv {
	font-style: italic;
}

p.schrift-sehrklein-zentriert {
	font-size: 13px;
	text-align: center;
	line-height: 15px;
	padding: 0 0 10px 0;
}

.fett {
	font-weight: bold;
}

#impressum h2 {
	font-size: 15px;
	font-weight: bold;
	padding: 15px 0 0 0;
}

#impressum p {
	font-size: 15px;
}

/*
#links-zweidrittel {
	float: left;
	width: 350px;
}

#rechts-eindrittel {
	float: right;
}

*/
#links-zweidrittel p {
	padding: 0 10px 0 0;
}

h2#webstandards {
	background: url(images/webstandards_heading.png) no-repeat;
	width: 205px;
	height: 32px;
}

#sehrklein {
	font-size: 14px;
}

/*
#sehrklein p {
	font-size: 14px;
	margin: 10px 0 0 0;
	line-height: 22px;
}

#sehrklein ul {
	list-style: none;
	margin: 10px 0 0 10px;
	font-weight: bold;
}

#sehrklein li {
	padding: 3px 0 0 0;
}
*/