/* BODY
-------------------------------------------------------------------- */
body{
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	color: #666666;
	margin: 0;
	padding: 0;
	text-align: center;
	background-color: #e8e8e8;
	background-image: url(images/bg-body.jpg);
	background-repeat: repeat;
	line-height: 1.3em;
}

/* FORMULARELEMENTE
-------------------------------------------------------------------- */
form{
	color: #666666;
	padding: 0;
	margin: 0;
	width: 650px;
}
form.suche{
	background: none;
	border: 0;
	padding: 0;
	margin: 0;
	width: 170px;
}
label{ width: 190px; float: left; font-weight: bold; font-size: 85%;}
label.klein{ width: 100px; float: left; font-weight: normal; font-size: 100%;}
label.suche{ width: 30px; float: right; }
radio{ color: #666666; }
input{
	font-size: 100%;
	background-color:#dcdcdc;
	color: #666666;
	width: 300px;
	padding: 4px;
	margin-bottom: 6px;
	border: none;
}
input.zweihundert{ width: 200px; }
input.plz{ width: 66px; }
input.ort{ width: 230px; }
input.ohne_rahmen{
	border-width:0;
	background-color:#FFFFFF;
	color: #666666;
	width: 15px;
	height: 15px;
	background-image: none;
}
input.button{
	background-color: #bb0000;
	border: none;
	color: #FFFFFF;
	font-weight: bold;
	height: 35px;
	cursor:pointer;
	margin: 0;
	width: 300px;
}
input.suche{
	width: 113px;
}
input.suchebutton{
	width: 20px;
	height: 20px;
	background: none;
	background-image: url(images/suche.png);
	background-repeat: no-repeat;
	border: 0;
	cursor: pointer;
}
select{
	font-size: 100%;
	background-color:#dcdcdc;
	color: #666666;
	width: 300px;
	padding: 2px;
	margin-bottom: 2px;
	border: none;
}
select.hundert{ width: 140px; }
select.zweihundert{ width: 200px; }
textarea{
	font-size: 100%;
	background-color:#dcdcdc;
	color: #666666;
	width: 300px;
	height: 123px;
	padding: 4px;
	border: none;
	overflow: auto;
}
span.pflicht {color: #f8282f; font-weight: bold; font-size: 100%;}
fieldset {
	width: 100%;
	padding: 0;
	position: relative;
	line-height: 1.5;
	border: none;
}
legend {
	font-size: 120%;
	font-weight: bold;
	padding: 2px;
	color: #999999;
	line-height: 1.3;
}
#kontaktformular label{ clear: both; }
.falle { display: none; }

/* TABELLEN
-------------------------------------------------------------------- */
tabel{ font-family: Tahoma, Arial, Helvetica, sans-serif; }
tr{ font-size: 100%; font-family: Tahoma, Arial, Helvetica, sans-serif; }
tr.mittel {background: #999999; font-family: Tahoma, Arial, Helvetica, sans-serif;}
tr.hell{ background: #dcdcdc; font-family: Tahoma, Arial, Helvetica, sans-serif;}
th{ font-size: 120%; color: #cc0000; font-family: Tahoma, Arial, Helvetica, sans-serif;}
td{ font-size:100%; font-family: Tahoma, Arial, Helvetica, sans-serif; color: #666666; }

/* ALLGEMEINE FORMATIERUNGEN
-------------------------------------------------------------------- */
li{ color: #666666;	list-style-image:url(images/anstrich.gif); }
p{
	font-size: 100%;
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	color: #666666;
	line-height: 1.5em;
}
p.klein{ font-size: 80%; color: #666666; }
p.abschluss{ font-size: 80%; color: #cc0000; }
a{ font-size: 100%; color: #3399cc; text-decoration: none; }
a:hover{ color: #666666; text-decoration: none; }
a.klein{ font-size: 80%; }
a.noborder:hover { border: 0; text-decoration: none; }
a.ext {color: #666666; text-decoration: none;}
hr, hr.dot{
	border: 0px; /* Für Firefox und Opera */
	border-top: dotted 1px #999999;
	border-bottom: transparent;
	margin: 10px 0;
	height: 1px;
}
.meldung { width: 640px; padding: 5px; margin: 0; }
.erfolg { background-color: #e9f9e5; color: #999999; border: 1px solid #75965f; }
.fehler { background-color: #f9e5e6; color: #bb0000; border: 1px solid #bb0000; }
.highlight { font-weight: bold; }

/* RAHMEN
-------------------------------------------------------------------- */
#spezial {
	width: 500px;
	height: 361px;
	margin: 0; padding: 0;
	z-index: 1;
	position: absolute;
	background-image: url(http://www.shirts-selbst-bedrucken.de/images/bg-spezial.jpg); 
	background-repeat: no-repeat; 
}
#rahmen{
	width: 1000px;
	margin: 0 auto;
	padding: 0;
	z-index: 10;
	position: relative;
}

/* HEADER
-------------------------------------------------------------------- */
#header{
	width: 1000px;
	height: 80px;
	margin: 0;
	padding: 0;
	z-index: 100;
}
#logo {
	float: left;
	width: 550px;
	height: 80px;
	margin: 0 auto;
	padding: 0;
	text-align: left;	
}
#toptelefon {
	float: left;
	width: 230px;
	height: 80px;
	margin: 0;
	padding: 0;
	text-align: left;	
}
#topnavi {
	float: right;
	width: 170px;
	height: 64px;
	margin: 0 auto;
	padding: 16px 0 0 0;
	text-align: right;
	font-size: 80%;
	color: #999999;	
	line-height: 2.0em;
}
#topnavi a { color: #999999; }
#topnavi a:hover { text-decoration: underline; }

/* NAVIGATION
-------------------------------------------------------------------- */
#hauptnavi {
	clear: both;
	width: 1000px;
	height: 33px;
	margin: 0;
	padding: 0;
	z-index: 9999;
	position: relative;
}
#hauptnavi a.home {
	width: 37px;
	height: 33px;
	float: left;
	margin-right: 1px;
	background-image: url(http://www.shirts-selbst-bedrucken.de/images/home-On.gif); 
	background-repeat: no-repeat; 
	text-indent: -9999px;
}
#hauptnavi a.home:hover {
	background-image: url(http://www.shirts-selbst-bedrucken.de/images/home-Off.gif); 
}

*{outline: none;}
ul#topnav {
	margin: 0; padding: 0;
	width: 100%;
	list-style: none;
	font-size: 100%;
	z-index: 1000;
}
ul#topnav li {
	float: left;
	margin: 0; padding: 0;
	position: relative;
	text-align: left;
	list-style:none;
}
ul#topnav li a {
	float: left; 
	background-color: none;
	background-image: url(http://www.shirts-selbst-bedrucken.de/images/bg-navi.png); 
	background-repeat: no-repeat; 
	color: #FFFFFF;
	padding: 12px 15px 6px 15px;
	margin: 0 1px 0 0;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 120%;
}
ul#topnav li:hover a, ul#topnav li a:hover { 
	background-image: none;
	background-color: #cc0000; 
	color: #FFFFFF; 
	padding: 10px 15px 8px 15px; 
	margin: 0 1px 0 0;
	/*--Top right rounded corner--*/
	-moz-border-radius-topright: 3px;
	-khtml-border-radius-topright: 3px;
	-webkit-border-top-right-radius: 3px;
	/*--Top left rounded corner--*/
	-moz-border-radius-topleft: 3px;
	-khtml-border-radius-topleft: 3px;
	-webkit-border-top-left-radius: 3px;
}
ul#topnav li a.aktiv { 
	background-image: none;
	background-color: #FF9900; 
	color: #FFFFFF; 
	padding: 10px 15px 8px 15px; 
	margin: 0 1px 0 0;
	/*--Top right rounded corner--*/
	-moz-border-radius-topright: 3px;
	-khtml-border-radius-topright: 3px;
	-webkit-border-top-right-radius: 3px;
	/*--Top left rounded corner--*/
	-moz-border-radius-topleft: 3px;
	-khtml-border-radius-topleft: 3px;
	-webkit-border-top-left-radius: 3px;
}

ul#topnav li .sub {
	position: absolute;	
	top: 33px; left: 0;
	background: #eee;
	padding: 20px 20px 20px;
	float: left;
	/*--Bottom right rounded corner--*/
	-moz-border-radius-bottomright: 5px;
	-khtml-border-radius-bottomright: 5px;
	-webkit-border-bottom-right-radius: 5px;
	/*--Bottom left rounded corner--*/
	-moz-border-radius-bottomleft: 5px;
	-khtml-border-radius-bottomleft: 5px;
	-webkit-border-bottom-left-radius: 5px;
	display: none;
}
ul#topnav li .row {clear: both; float: left; width: 100%; margin-bottom: 0px;}
ul#topnav li .sub ul{
	list-style: none;
	margin: 0 5px; 
	padding: 0;
	width: 150px;
	float: left;
}
ul#topnav .sub ul li {
	width: 100%;
	color: #fff;
}
ul#topnav .sub ul li h2 {
	font-size: 120%;
	font-weight: normal;
	text-align: left;
	margin: 0;
	padding: 5px 0;
	background-image: none;
	color: #cc0000;
	border-bottom: 1px solid #333333;
}
ul#topnav .sub ul li a {
	float: none; 
	text-indent: 0; /*--Reset text indent--*/
	font-weight: normal;
	font-size: 90%;
	text-transform: none;
	height: auto;
	padding: 5px 5px 5px 10px;
	display: block;
	text-decoration: none;
	color: #666666;
	background-image: none;
	background-color: #eee;
	border-bottom: 1px dotted #ccc;
}
ul#topnav .sub ul li a:hover {color: #cc0000; background-color: #ddd;}
ul#topnav .sub ul li h2 a {
	font-size: 120%;
	padding: 5px 0;
	background-image: none;
	color: #cc0000;
	border-bottom: 1px solid #333333;
}
ul#topnav .sub ul li h2 a:hover {background-color: #eee;}

#warenkorb { width: 150px; height: 30px; float: right; padding: 3px 0 0 0; }
#hauptnavi a.warenkorb {
	width: 150px;
	height: 30px;
	float: left;
	margin: 0;
	background-image: url(http://www.shirts-selbst-bedrucken.de/images/warenkorb-Off.gif); 
	background-repeat: no-repeat; 
	text-indent: -9999px;
}
#hauptnavi a.warenkorb:hover {
	background-image: url(http://www.shirts-selbst-bedrucken.de/images/warenkorb-On.gif); 
}

#unternavi {
	width: 180px;
	margin: 0;
	padding: 0;
	text-align: left;
}
#unternavi ul {
	margin: 0 0 10px 0;
	padding: 0;
	list-style:none;
}
#unternavi ul ul{
	margin: 0 0 10px 0;
	padding: 0;
	list-style:none;
}
#unternavi ul li {
	margin: 0;
	padding: 0;
	list-style-image:none;
	list-style:none;
}
#unternavi ul li.nav1 {
	background-color: #ff9900;
	font-size: 110%;
	padding: 5px 10px;
	margin: 0;
	text-decoration: none;
	color: #FFFFFF;
}
#unternavi ul li a {
	font-size: 90%;
	color: #3399cc;
	display: block;
	padding: 3px 10px;
	margin: 0;
	border-bottom: 1px dotted #cccccc;
	text-decoration: none;
}
#unternavi ul li a:hover { background-color: #eeeeee; }
#unternavi ul li a.aktiv { background-color: #eeeeee; }

/* INHALTSBEREICH
-------------------------------------------------------------------- */
#content {
	background-color: #FFFFFF;
	width: 960px;
	padding: 20px;
}
#links {
	float: left;
	width: 180px;
	margin-right: 19px;
	border-right: 1px dotted #bbbbbb;
}
#inhaltstart {
	width: 960px;
	margin: 0;
	padding: 0;
	text-align: left;
}
#inhalt {
	float: right;
	width: 760px;
	margin: 0;
	padding: 0;
	text-align: left;
}
h1{
	color: #cc0000; 
	font-family: Raspoutine, Verdana, Times, serif;
	font-size: 210%;
	font-weight: normal;
	margin: 20px 0;
	padding: 0;
}
h2{
	font-family: Raspoutine, Verdana, Times, serif;
	font-size: 160%;
	font-weight: normal;
	color: #ff9900;
	margin: 0 0 5px 0;
	padding: 0;
	border: none;
}
#inhalt h3{
	font-family: Raspoutine, Verdana, Times, serif;
	font-size: 130%;
	font-weight: normal;
	color: #999999;
	margin: 0 0 5px 0;
	padding: 0;
}
#inhalt h4{
	font-size: 100%;
	font-weight: bold;
	margin: 2px 3px;
	padding: 0;
}
#inhalt img { padding: 7px; border: 1px solid #eeeeee; }
#inhalt img.noborder { border: none; }
#infos { 
	width: 100%;
	margin: 20px auto;
	padding: 0; 
	text-align: left;
	color: #333333;
}
#infos { border-bottom: 1px dotted #333333; }
#infos strong{font-size: 100%; color: #cc3333;}
.trenner {
	width: 960px;
	height: 10px;
	margin: 0;
	padding: 0;
	background-image: url(images/trenner-1000.png); 
	background-repeat: no-repeat; 
}

/* HILFE
-------------------------------------------------------------------- */
a.box_head {
	text-align: left;
	display:block;
	background-color: #3399cc;
	font-size: 110%;
	padding: 5px 10px;
	margin: 0;
	text-decoration: none;
	color: #FFFFFF;
	cursor:pointer;
	border-bottom: 1px solid #FFFFFF;
}
.boxes {text-align: left; padding: 0 5px 10px 5px;}

/* ZEBRA-TABELLEN
-------------------------------------------------------------------- */
#zebra tr td { border-bottom: 1px solid #eeeeee; }
#zebra tr.odd td { background-color: #f4f4f0; }

/* STARTSEITE
-------------------------------------------------------------------- */
#Start{
	width: 620px;
	height: 260px; 
	padding: 0;
	margin: 0;
}
a#buttonCreatorStart{
	background-image: url(images/button-designer-Off.gif); 
	background-repeat: no-repeat;
	margin: 0;
	width: 268px;
	height: 50px;
	text-indent: -9999px;
	display: block;
	z-index: 1000;
}
a:hover#buttonCreatorStart{
	background-image: url(images/button-designer-On.gif); 
}

div.kategorie { background: #FFFFFF; width: 216px; padding: 127px 7px 5px 7px; margin: 0 13px 0 0; float: left; font-size: 85%;}
div.last { margin: 0; float: right;}
*html div.kategorie { width: 230px; }
#maenner { background-image: url(images/t-shirt-maenner.gif); background-repeat: no-repeat; }
#maenner:hover { background-color: #eeeeee; }
#frauen { background-image: url(images/t-shirt-frauen.gif); background-repeat: no-repeat; }
#frauen:hover { background-color: #eeeeee; }
div#kinder { background-image: url(images/kinder-baby.gif); background-repeat: no-repeat; }
div:hover#kinder { background-color: #eeeeee; }
div#geschenke { background-image: url(images/geschenke.gif); background-repeat: no-repeat; }
div:hover#geschenke { background-color: #eeeeee; }

#news { width: 620px; }
#meinungen { width: 320px; float: left; }
#social { width: 280px; float: left; margin: 0 20px;}
#newsletter { width: 320px; float: right; }
#news p, #meinungen p, #siegel p { font-size: 90%; }

ul.tabs {
	margin: 0;
	padding: 0;
	float: left;
	list-style: none;
	height: 32px; /*--Set height of tabs--*/
	width: 100%;
}
ul.tabs li {
	float: left;
	margin: 0 10px 0 0;
	padding: 0;
	height: 31px; /*--Subtract 1px from the height of the unordered list--*/
	line-height: 31px; /*--Vertically aligns the text within the tab--*/
	border-bottom: 1px dotted #dddddd;
	margin-bottom: -1px; /*--Pull the list item down 1px--*/
	overflow: hidden;
	position: relative;
}
*html ul.tabs li { height: 32px; line-height: 32px;}
ul.tabs li a {
	text-decoration: none;
	color: #333333;
	display: block;
	font-weight: bold;
	padding: 0 20px;
	border: 1px solid #fff; /*--Gives the bevel look with a 1px white border inside the list item--*/
	outline: none;
}
ul.tabs li a:hover {color: #cc0000;}
html ul.tabs li.active, html ul.tabs li.active a:hover { /*--Makes sure that the active tab does not listen to the hover properties--*/
	background: #fff;
	color: #333;
	border-bottom: 1px dotted #cc0000; /*--Makes the active tab look like it's connected with its content--*/
}
.tab_container {
	overflow: hidden;
	clear: both;
	float: left; 
	width: 100%;
	background: #fff;
}
.tab_content {padding: 20px;font-size: 100%;}
.t-shirt {float:left; width: 185px; text-align:center;}

.motivdiv {
	height: 140px;
	width: 960px;
	margin: 0;
}
ul.motive {
	float: left;
	list-style: none;
	margin: 0; padding: 10px;
	width: 960px;
}
ul.motive li {
	margin: 0; padding: 5px;
	float: left;
	position: relative;  /* Set the absolute positioning base coordinate */
	width: 110px;
	height: 110px;
	list-style: none;
}
ul.motive li img {
	width: 100px; height: 100px; /* Set the small thumbnail size */
	-ms-interpolation-mode: bicubic; /* IE Fix for Bicubic Scaling */
	border: 1px solid #ddd;
	padding: 5px;
	background: #efefef;
	position: absolute;
	left: 0; top: 0;
}
ul.motive li img.hover {
	border: none; /* Get rid of border on hover */
}

ul.motiveFB {
	list-style: none;
	margin: 0 auto; padding: 0;
	width: 390px;
}
ul.motiveFB li {
	margin: 0; padding: 5px;
	float: left;
	position: relative;  /* Set the absolute positioning base coordinate */
	width: 110px;
	height: 110px;
	list-style: none;
}
ul.motiveFB li img {
	width: 100px; height: 100px; /* Set the small thumbnail size */
	-ms-interpolation-mode: bicubic; /* IE Fix for Bicubic Scaling */
	border: 1px solid #ddd;
	padding: 5px;
	background: #efefef;
	position: absolute;
	left: 0; top: 0;
}
ul.motiveFB li img.hover {
	border: none; /* Get rid of border on hover */
}


/* NEWS
-------------------------------------------------------------------- */
.artikel{
	border-bottom: 1px dotted #666666;
	padding-bottom: 10px;
	margin-bottom: 20px;
}
.thumb-img {
	background:none repeat scroll 0 0 #FFFFFF;
	position:relative;
	border: 1px solid #dddddd;
	padding: 10px;
}
.thumb-inner {
	overflow:hidden;
	position:relative;
}
.thumb-zoom {
	background:url("images/lupe.png") no-repeat scroll 0 0 transparent;
	bottom:10px;
	height:22px;
	position:absolute;
	right:10px;
	width:22px;
}
*html .thumb-zoom {
	background:url("images/lupe.png") no-repeat scroll 0 0 transparent;
	bottom:13px;
	height:22px;
	position:absolute;
	right:11px;
	width:22px;
	padding: 2px;
}

/* NEWSLETTER
-------------------------------------------------------------------- */
form#nl{ width: 300px; }
form#nl input, form#nl2 input { width: 200px; height: 17px; padding: 1px 3px; border: 1px solid #dddddd; background: #eeeeee; font-size: 85%;}
form#nl input.button, form#nl2 input.button { width: 100px; height: 23px; padding: 2px; border: none; color: #333333; background: #dddddd; }
form#nl label { width: 90px; float:left; }
form#nl2 label { width: 130px; float:left; }

/* KONTAKT
-------------------------------------------------------------------- */
.kontaktbox{
	width: 100px; 
	float: left; 
	background-image: url(images/anstrich.gif); 
	background-repeat: no-repeat; 
	background-position: 0 5px;
	padding-left: 15px;
}
a:hover.autor { border: 0px; }
form p { margin-bottom: 5px; }

/* ARTIKEL
-------------------------------------------------------------------- */
.art { float: left; width: 170px; border: 1px dotted #cccccc; padding: 6px; margin-right: 6px; color: #333333; line-height:1.5em;}
*html .art { width: 170px; }
.art:hover { border: 1px dotted #3399cc; background-color: #efefef; }
.art strong { font-size: 85%;color: #999999; }
.art_preis { font-size: 150%; }
.art_btn { display: block; padding: 10px 0 0 0; font-size: 110%; font-weight: bold; color: #3399cc; }
.art:hover .art_btn { color: #cc0000; }
.rechts { float: right; margin-right: 0; }

/* FOOTER
-------------------------------------------------------------------- */
#footer {
	width: 1000px;
	height: 300px;
	margin: 0;
	padding: 0;
	background-image: url(images/trenner-1000.png); 
	background-repeat: no-repeat; 
	text-align: left;
}
#footer .fuss {float: left; width: 130px; margin: 20px 10px 0 0;}
#footer .lang {width: 230px;}
#footer .rechts {float: right; margin-right: 0;}
#footer p, #footer .fuss p {
	font-size: 80%;
	font-weight: normal;
	color: #666666; 
	text-align: left;
	margin: 0;
	padding: 0;
	line-height: 1.5em;
}
#footer .fuss a {font-size: 85%;}
#footer .fuss p.gross { font-size: 120%; padding: 0 0 10px 0;}
#footer a { color: #666666; }
#footer a:hover{ color: #666666; border: 0; background: none; text-decoration: underline; }

#footerlinks { color: #999999; font-size: 80%;}
#footerlinks a { color: #999999;}

/* IE7 PROBLEME
-------------------------------------------------------------------- */
*html input{ height: 22px; }
*html select {	margin-right: 4px; }
*html fieldset { margin-top: 15px; margin-bottom: 15px; }
*html fieldset legend {	float: left; position: relative; margin-top: -1.5em;}
*html #inhalt { height: 300px;}