@charset "UTF-8";
/* CSS Document */

/**********************************************************************************/
/**********************************************************************************/
/***                                                                            ***/
/***  Copyright: Lars Trautmann 2008 / www.kontragrafik.de / www.piratearts.de  ***/
/***                                                                            ***/
/**********************************************************************************/
/**********************************************************************************/


/* ##################################################### */
/* ####################### BODY ######################## */
/* ##################################################### */

body			{
				margin: 0px;
				background-color:#464344;
				background-image:url(img/bg.gif);
				font-family:"Trebuchet MS", Arial, sans-serif;
				font-size:12px;
				color:#ffffff;
				}
				
				
/* ##################################################### */
/* ####################### LINKS ####################### */
/* ##################################################### */

a 				{ color:#583f99; font-weight:bold; text-decoration:none; }
a:hover 		{ color:#583f99; font-weight:bold; text-decoration:underline; }
a.button 		{ color:#583f99; text-decoration:none; }
a.button:hover 	{ color:#583f99; text-decoration:none; }
a.typ2 		{ color:#110f10; font-weight:bold; text-decoration:none; }
a.typ2:hover { color:#110f10; font-weight:bold; text-decoration:underline; }

/* ##################################################### */
/* #################### GRUNDAUFBAU #################### */
/* ##################################################### */

div				{ border:none; }

.floatleft		{ float:left; }
.floatright		{ float:right; }

.padding		{ padding:10px; }

.absatz			{ padding-bottom:10px; }
.absatz2		{ padding-bottom:30px; }

.clearall		{ clear:both; } /* Zum Beenden von float-Tags */


/* Index Seite */

#index_button	{ 
				margin:0 auto;
				background-image:url(img/start.png);
				width:671px;
				height:418px;
				}

#index_button:hover	{ 
				background-image:url(img/start2.png);
				}



/* ##################################################### */
/* ####################### HAUPTMENU ################### */
/* ##################################################### */

#hm_bg			{
				background-image:url(img/bg_kopf.jpg);
				width:1000px;
				height:225px;
				position:relative;
				}

#hm_weblog		{
				position:absolute;
				top:98px;
				left:153px;
				background-image:url(img/hmenu_weblog_01.jpg);
				width:95px;
				height:65px;
				}
				
#hm_weblog:hover {
				background-image:url(img/hmenu_weblog_02.jpg);
				}

#hm_weblog_a	{
				position:absolute;
				top:98px;
				left:153px;
				background-image:url(img/hmenu_weblog_02.jpg);
				width:95px;
				height:65px;
				}

				
#hm_portfolio	{
				position:absolute;
				top:79px;
				left:248px;
				background-image:url(img/hmenu_portfolio_01.jpg);
				width:107px;
				height:70px;
				}
				
#hm_portfolio:hover {
				background-image:url(img/hmenu_portfolio_02.jpg);
				}
				
#hm_portfolio_a	{
				position:absolute;
				top:79px;
				left:248px;
				background-image:url(img/hmenu_portfolio_02.jpg);
				width:107px;
				height:70px;
				}
				

#hm_infos		{
				position:absolute;
				top:66px;
				left:355px;
				background-image:url(img/hmenu_infos_01.jpg);
				width:78px;
				height:64px;
				}
				
#hm_infos:hover {
				background-image:url(img/hmenu_infos_02.jpg);
				}
				
#hm_infos_a		{
				position:absolute;
				top:66px;
				left:355px;
				background-image:url(img/hmenu_infos_02.jpg);
				width:78px;
				height:64px;
				}
				
#hm_kontakt		{
				position:absolute;
				top:54px;
				left:433px;
				background-image:url(img/hmenu_kontakt_01.jpg);
				width:97px;
				height:62px;
				}
				
#hm_kontakt:hover {
				background-image:url(img/hmenu_kontakt_02.jpg);
				}
				
#hm_kontakt_a	{
				position:absolute;
				top:54px;
				left:433px;
				background-image:url(img/hmenu_kontakt_02.jpg);
				width:97px;
				height:62px;
				}

#hm_past		{
				position:absolute;
				top:0px;
				left:602px;
				background-image:url(img/button_past_01.jpg);
				width:111px;
				height:123px;
				}
				
#hm_past:hover {
				background-image:url(img/button_past_02.jpg);
				}

#hm_past_a		{
				position:absolute;
				top:0px;
				left:602px;
				background-image:url(img/button_past_02.jpg);
				width:111px;
				height:123px;
				}
				
#hm_shop		{
				position:absolute;
				top:15px;
				left:713px;
				background-image:url(img/button_shop_01.jpg);
				width:111px;
				height:139px;
				}
				
#hm_shop:hover {
				background-image:url(img/button_shop_02.jpg);
				}

#hm_shop_a		{
				position:absolute;
				top:15px;
				left:713px;
				background-image:url(img/button_shop_02.jpg);
				width:111px;
				height:139px;
				}
				
				
#hm_piratearts	{
				position:absolute;
				top:0px;
				left:824px;
				background-image:url(img/button_piratearts_01.jpg);
				width:101px;
				height:141px;
				}
				
#hm_piratearts:hover {
				background-image:url(img/button_piratearts_02.jpg);
				}

#hm_piratearts_a		{
				position:absolute;
				top:0px;
				left:824px;
				background-image:url(img/button_piratearts_02.jpg);
				width:101px;
				height:141px;
				}
				
				
				
				
				
				
				

/* ##################################################### */
/* ####################### TEXT ELEMENTE ############### */
/* ##################################################### */

div.rahmen		{ margin-left:100px; }

div.pfeil_links { background-image:url(img/pfeil_links.png); width:10px; height:6px; float:left; margin-top:4px; margin-right:5px; }

div.hl			{ font-size:44px; color:#FFFFFF; float:left; }

div.shl			{
				font-size:12px;
				color:#110f10;
				font-style:italic;
				padding-top:29px;
				padding-left:10px;
				padding-right:10px;
				float:left;
				}

/* 1. BLOG ELEMENTE */

div.h1			{
				font-size:36px;
				font-weight:bold;
				color:#FFFFFF;
				background-color:#110f10;
				padding-top:10px;
				padding-bottom:10px;
				padding-left:15px;
				padding-right:20px;
				float:left;
				}

div.datum		{
				font-size:12px;
				color:#FFFFFF;
				padding-top:24px;
				padding-bottom:24px;
				padding-left:24px;
				padding-right:10px;
				float:left;
				}
				
div.eintrag		{
				font-size:12px;
				color:#110f10;
				background-color:#FFFFFF;
				padding-top:15px;
				padding-bottom:15px;
				padding-left:15px;
				padding-right:15px;
				width:800px;
				margin-bottom:30px;
				}




/* 2. PORTFOLIO ELEMENTE */

div.thumbnail	{
				background-color:#110f10;
				margin-right:30px;
				margin-bottom:30px;
				width:250px;
				float:left;
				}
				
div.thumbnail:hover {
				background-color:#272526;
				}

div.h2			{
				font-size:24px;
				font-weight:bold;
				color:#FFFFFF;
				padding-top:8px;
				padding-left:12px;
				padding-right:12px;
				}

div.projektart	{
				font-size:12px;
				font-style:italic;
				color:#FFFFFF;
				padding-top:3px;
				padding-left:12px;
				padding-right:12px;
				padding-bottom:11px;
				}
				
div.h2bg		{
				background-color:#110f10;
				width:830px;
				}

/* 3. KONTAKT ELEMENTE */

div.formrahmen1 { float:left; width:300px; }

div.formrahmen2 { background-color:#110f10; padding:15px; padding-right:30px; width:785px; }

div.submit		{ text-align:right; }

div.h3			{
				font-size:24px;
				font-weight:bold;
				color:#110f10;
				padding-bottom:10px;
				}

div.lageplan	{
				background-color:#FFFFFF;
				background-image:url(img/map01.gif);
				width:830px;
				height:496px;
				}
				
span.traegerschrift {
				background-color:#FFFFFF;
				font-size:12px;
				color:#110f10;
				}

/* 4. INFO ELEMENTE */

div.block_a		{
				width:375px;
				background-color:#FFFFFF;
				color:#110f10;
				padding:20px;
				}

div.spalte		{
				float:left;
				}

div.h4			{
				font-size:24px;
				font-weight:bold;
				padding-bottom:10px;
				}
				
div.zitat		{
				font-size:16px;
				font-style:italic;
				}

div.info_farb	{
				width:375px;
				background-color:#583f99;
				color:#FFFFFF;
				padding:20px;
				}

div.info_dunkel	{
				background-color:#110f10;
				color:#FFFFFF;
				width:375px;
				padding:20px;
				}
	
div.info_grau	{
				background-color:#999999;
				color:#FFFFFF;
				width:375px;
				padding:20px;
				}
	


/* Pressematerialien Elemente */

div.dl_ai		{
				background-image:url(img/dl_ai.gif);
				width:21px;
				height:18px;
				float:left;
				margin-right:2px;
				}

div.dl_pdf		{
				background-image:url(img/dl_pdf.gif);
				width:21px;
				height:18px;
				float:left;
				margin-right:2px;
				}
				
div.dl_eps		{
				background-image:url(img/dl_eps.gif);
				width:21px;
				height:18px;
				float:left;
				margin-right:2px;
				}

div.dl_gif		{
				background-image:url(img/dl_gif.gif);
				width:21px;
				height:18px;
				float:left;
				margin-right:2px;
				}

div.dl_block	{
				width:355px;
				background-color:#FFFFFF;
				color:#110f10;
				padding:20px;
				margin-right:20px;
				}
				
				
/* PA.ST Elemente */

div.eintrag_w		{
				font-size:12px;
				color:#110f10;
				background-color:#FFFFFF;
				padding-top:15px;
				padding-bottom:15px;
				padding-left:15px;
				padding-right:15px;
				width:800px;
				}

div.eintrag_g		{
				font-size:12px;
				color:#110f10;
				background-color:#AAAAAA;
				padding-top:15px;
				padding-bottom:15px;
				padding-left:15px;
				padding-right:15px;
				width:800px;
				}

div.prev-image	{ float:left; margin-right:20px; }

div.dl-button	{
				width:250px;
				padding:10px;
				background-color:#110F10;
				color:#FFFFFF;
				font-size:18px;
				text-decoration:none;
				text-align:center;				
				}

div.dl-button:hover	{
				background-color:#583F99;
				text-decoration:underline;
				}


/* SHOP Elemente */

img.shopimg		{
				float:left;
				margin-right:20px;
				}

div.shoptopic	{
				font-size:18px;
				font-weight:bold;
				}

/* ##################################################### */
/* ####################### MENU UNTEN ################### */
/* ##################################################### */

#menuunten		{
				text-align:center;
				width:1000px;
				margin-top:20px;
				}

/* ##################################################### */
/* ####################### SPEZIELLE ELEMENTE ########## */
/* ##################################################### */

#kommtbald		{
				width:574px;
				height:303px;
				background-image:url(img/kommtbald.gif);
				margin:0 auto;
				position:relative;
				margin-top:150px;
				}