/* ========================================= */
/* CSS Styles for pages created by end if    */
/* author: Sascha Merkofer, http://endif.ch/ */
/* ========================================= */

/* Color Definitions:

dark blue:		#201652
lignt blue:		#00b5f1
light Pink:		#fc8bab
light green:	#d0f341
grey:			#5f5f5f

EF blue:		#3cc3f5
EF green:		#c0d547
EF pink:		#ea589e
EF orange:		#f28f2f

*/

body, tr, td, p, table {
						font-family: Tahoma, Arial;
						color: #5F5F5F;
						font-size: 11px;}


div#photos {
						align: center;
						margin-left: auto;
						margin-top: 0px;
						margin-right:auto;
						font-family: Tahoma, Arial;
						color: #5F5F5F;
						font-size: 11px;
						width: 690px;}


/* ======( Direct CMS integration )=========================================== */	
/*	place the emotion image over the content padding.
	IE does - as always - cause problems, so we have to
	hack the padding top of the following content inside
	the HTML-content at '<div id="ef_info">' */

div#photos img#emotion_pict {
						position: absolute;
						overflow: hidden;
						left: 0;
						top: 0;
						margin: 0;
						padding: 0;
						border: 0;}
						
div#photos div#ef_info {
						position: relative;
						overflow: hidden;
						padding-left: 30px;
						padding-right: 30px;}

div#photos div#doorway_list {
						position: absolute;
						overflow: hidden;
						width: 280px;
						left: 362px;
						top: 20px;
						margin: 0;
						padding: 0;
						border: 0;
						text-align: right;}

div#photos div#emotion_form {
						position: absolute;
						overflow: hidden;
						width: 330px;
						left: 312px;
						top: 80px;
						margin: 0;
						padding: 0;
						border: 0;
						text-align: left;}

div#photos div#emotion_right {
						position: absolute;
						overflow: hidden;
						width: 186px;
						left: 490px;
						top: 48px;
						margin: 0;
						padding: 0;
						border: 0;
						text-align: left;}

div#photos img#info_pict {
						float: right;
						margin-top: 12px;
						margin-left: 16px;
						margin-bottom: 16px;}

div#photos div#info_text {
						width: 300px;
						float: right;
						margin-left: 16px;
						margin-bottom: 16px;}

/* ------( homepage )--------------------------------- */
div.mixdown {
						position: absolute;
						height: 200px;
						top: 0;
						overflow: hidden;
						z-index: -1;}

div#theperfectsong {
						position: relative;
						top: 16px;
						width: 624px;
						height: 216px;}

div#heymisterpostman {
						position: relative;
						top: 0;
						width: 624px;
						height: 216px;}

div#lyrics {
						position: absolute;
						top: 0;
						left: 0;
						width: 624px;
						height: 120px;}

div#firstrhyme {
						position: absolute;
						top: 0;
						left: 0;
						width: 220px;
						height: 120px;}

div#secondrhyme {
						position: absolute;
						top: 0;
						left: 220px;
						width: 404px;
						height: 120px;}

div#melody {
						position: absolute;
						top: 136px;
						left: 0;
						width: 624px;
						height: 80px;}

div#may7 {
						position: absolute;
						top: 0;
						left: 0;
						width: 448px;
						height: 80px;}

div#may7x11 {
						position: absolute;
						top: 0;
						left: 448px;
						width: 176px;
						height: 80px;}


/* ------( half-sized divs )--------------------------------- */
div#photos div.list-left {
						float: left;
						width: 300px;
						margin-right: 8px;}

div#photos div.list-right {
						padding: 0 0 0 16px;
						width: 300px;
						overflow: hidden;}
						
div#photos div.wrapper {
						width: 620px;
						position: relative;
						display: visible;}
						
div#photos .clear_float {
						clear: both;}

/* ------( third-sized divs )--------------------------------- */
div#photos div.third-left {
						position: relative;
						float: left;
						width: 30%;}

div#photos div.third-middle {
						position: relative;
						float: left;
						width: 33%;
						padding: 0 8px 0 8px;}

div#photos div.third-right {
						position: relative;
						float: left;
						width: 30%;}

div#photos div.two_third-right {
						position: relative;
						float: left;
						width: 63%;}

/* ------( Homepage Boxes Var 1 )--------------------------------- */
div#photos div.homebox-1-wrapper {
						width: 660px;
						position: relative;
						left: -30px;
						display: visible;
						overflow: hidden;}

div#photos div.homebox-1-left {
						position: relative;
						float: left;
						width: 250px;}

div#photos div.homebox-1-right {
						float: left;
						width: 410px;}

div#photos div.half-left {
						float: left;
						width: 320px;
						margin-right: 8px;}

div#photos div.half-right {
						float: left;
						width: 320px;}

/* ------( Infopage Boxes Var 1 )--------------------------------- */
div#photos div.infobox-1-wrapper {
						width: 660px;
						position: relative;
						left: -30px;
						display: visible;
						overflow: hidden;}

div#photos div.infobox-1-left {
						position: relative;
						float: left;
						width: 250px;}

div#photos div.infobox-1-right {
						float: left;
						width: 410px;}

/* ------( Homepage Subinfo )--------------------------------- */
div#photos div.homesub-wrapper {
						width: 100%;
						position: relative;
						display: visible;
						overflow: hidden;}

div#photos div.homesub-left {
						position: relative;
						float: left;
						margin-right: 10px;
						width: 195px;}

div#photos div.homesub-middle {
						float: left;
						padding-right: 10px;
						width: 195px;}

div#photos div.homesub-right {
						float: left;
						padding-right: 10px;
						width: 195px;}

/* ======( Links )============================================ */
/* ------( inaktiv )----------------------------------------- */
div#photos a:link, div#photos a:visited {
						text-decoration: none;
						color: #00b5f1;}

/* ------( aktiv )------------------------------------------- */
div#photos a:focus, div#photos a:hover, div#photos a:active {
						text-decoration: none;
						color: #201652;}

/* Links with Button Image */
div#photos a.btn_start {
						text-align: left;
						margin-bottom: 16px;
						display: block;
						padding: 4px 120px 4px 0;
						height: 44px;
						font-size: 13px;
						font-weight: bold;
						color: #201652;
						background: url(images/btn_start.jpg) no-repeat right top;}

div#photos a.btn_start:link, div#photos a.btn_start:visited {
						color: #201652;}

div#photos a.btn_start:focus, div#photos a.btn_start:hover, div#photos a.btn_start:active {
						color: #201652;
						background: url(images/btn_start_active.jpg) no-repeat right top;}

div#photos a.btn_start-home {
						position: relative;
						margin-bottom: 16px;
						width: 670px;
						left: -15;
						display: block;
						overflow: visible;
						height: 44px;
						background: url(images/btn_start-home.jpg) no-repeat left top;}

div#photos a.btn_start-home:focus, div#photos a.btn_start-home:hover, div#photos a.btn_start-home:active {
						background: url(images/btn_start-home_active.jpg) no-repeat left top;}

div#photos a.btn_start-home-f {
						position: relative;
						margin-bottom: 16px;
						width: 670px;
						left: -15;
						display: block;
						overflow: visible;
						height: 44px;
						background: url(images/btn_start-home-f.jpg) no-repeat left top;}

div#photos a.btn_start-home-f:focus, div#photos a.btn_start-home-f:hover, div#photos a.btn_start-home-f:active {
						background: url(images/btn_start-home_active-f.jpg) no-repeat left top;}

div#photos a.btn_start-info {
						position: relative;
						margin-bottom: 16px;
						width: 670px;
						left: -15px;
						display: block;
						overflow: visible;
						height: 44px;
						background: url(images/btn_start-home.jpg) no-repeat left top;}

div#photos a.btn_start-info:focus, div#photos a.btn_start-info:hover, div#photos a.btn_start-info:active {
						background: url(images/btn_start-home_active.jpg) no-repeat left top;}

div#photos a.btn_start span.btn_start_pink {
						color: #ea589e;}

div#photos a.btn_sub_emotion {
						text-align: right;
						margin-bottom: 16px;
						display: block;
						padding: 12px 60px 12px 0;
						height: 21px;
						font-size: 13px;
						font-weight: bold;
						color: #201652;
						background: url(images/btn_sub_emotion.jpg) no-repeat right top;}

div#photos a.btn_sub_emotion:link, div#photos a.btn_sub_emotion:visited {
						color: #201652;}

div#photos a.btn_sub_emotion:focus, div#photos a.btn_sub_emotion:hover, div#photos a.btn_sub_emotion:active {
						color: #ea589e;
						background: url(images/btn_sub_emotion_active.jpg) no-repeat right top;}

div#photos a.btn_right {
						font-size: 13px;
						font-weight: bold;}
						
div#photos a.btn_bullet {
						font-size: 13px;
						font-weight: bold;
						padding: 4px 30px 4px 0;
						background: url(images/btn_bullet.gif) no-repeat right;}

/*
div#photos a.btn_forte {
						font-size: 13px;
						font-weight: bold;
						padding: 4px 30px 4px 0;
						background: url(images/btn_right.gif) no-repeat right;}
*/

div#photos a.btn_bullet-small, div#photos a.btn_forte {
						font-size: 11px;
						font-weight: bold;
						padding: 3px 24px 3px 0;
						background: url(images/btn_bullet-small.gif) no-repeat right;}


/* ======( Fonts )============================================ */
/*
div#photos p {
						margin: 0;
						padding: 0 0 6px 0;}
*/
div#photos h2, div#photos h2.forte {
						font-size: 15px;
						font-weight: bold;
						color: #201652;
						margin: 16px 0 4px 0;}

div#photos h3, div#photos h3.forte {
						color: #201652;
						font-size: 13px;
						font-weight: bold;
						margin: 16px 0 4px 0;}

/*
div#photos h2.forte {
						position: relative;
						left: -30px;
						font-size: 15px;
						font-weight: bold;
						color: #201652;
						background: url(images/h2.jpg) no-repeat left 3px;
						padding: 7px 0 16px 30px;
						margin: 8px 0 0 0;}

div#photos h3.forte {
						position: relative;
						left: -30px;
						font-size: 13px;
						font-weight: bold;
						color: #201652;
						background: url(images/h3.jpg) no-repeat left 3px;
						padding: 5px 0 4px 30px;
						margin: 8px 0 4px 0;}

*/

div#photos div.list-left h3.forte {
						color: #201652;
						font-size: 11px;
						font-weight: bold;
						margin: 16px 0 4px 0;}
						
div#photos div.list-right h3.forte {
						color: #201652;
						font-size: 11px;
						font-weight: bold;
						margin: 16px 0 4px 0;}

/*

div#photos h3.third {
						background: url(images/h3_third.jpg) no-repeat left 3px;
						padding: 5px 0 4px 8px;}

*/

div#photos .subtitle {
						font-size: 15px; }

div#photos .emotion_text {
						font-size: 13px;
						color: #201652;
						background: transparent;}

div#photos .subinfo {	
						font-size: 10px;
						background-color: transparent;}

div#photos .strike {
						text-decoration: line-through;}

div#photos .fat {
						font-weight: bold;}

div#photos .ef-pink {
						color: #ea589e;}

div#photos .ef-orange {
						color: #f28f2f;}

div#photos .ef-green {
						color: #c0d547;}

div#photos .ef-blue {
						color: #00B5F1;}

div#photos .light-pink {
						color: #fc8bab;}

div#photos .light-green {
						color: #AAD202;}

div#photos .grey {
						color: #5f5f5f;}

div#photos .dark-blue {
						color: #201652;}


/* ======( Lists )============================================ */
div#photos ul, div#photos ol, div#photos dl {
						margin: 0 0 8px 0;
						padding: 0;
						list-style: none;}

div#photos ul li, div#photos ol li, div#photos dl li {
						margin: 0;
						padding: 0 0 6px 0;}
						
div#photos ul.info_list, div#photos ol.info_list {
						margin-bottom: 16px;}

div#photos ul.info_list li, div#photos ol.info_list li {
						padding: 0 0 4px 22px;}

div#photos ul.info_list li.check {
						padding: 0 0 4px 22px;
						background: url(images/ok_haken.gif) no-repeat left 3px;}

div#photos ul.info_list li.dash {
						padding: 0 0 4px 22px;
						background: url(images/dash.gif) no-repeat left 3px;}
						
div#photos ol li.p1 {
						padding: 0 0 4px 22px;
						background: url(images/list_number_1.gif) no-repeat left 2px;}

div#photos ol li.p2 {
						padding: 0 0 4px 22px;
						background: url(images/list_number_2.gif) no-repeat left 2px;}
						
div#photos ol li.p3 {
						padding: 0 0 4px 22px;
						background: url(images/list_number_3.gif) no-repeat left 2px;}
						
div#photos ol li.p4 {
						padding: 0 0 4px 22px;
						background: url(images/list_number_4.gif) no-repeat left 2px;}
						
div#photos ol li.p5 {
						padding: 0 0 4px 22px;
						background: url(images/list_number_5.gif) no-repeat left 2px;}
						
div#photos ol li.p6 {
						padding: 0 0 4px 22px;
						background: url(images/list_number_6.gif) no-repeat left 2px;}
						
div#photos ol li.p7 {
						padding: 0 0 4px 22px;
						background: url(images/list_number_7.gif) no-repeat left 2px;}
						
div#photos ol li.p8 {
						padding: 0 0 4px 22px;
						background: url(images/list_number_8.gif) no-repeat left 2px;}
						
div#photos ol li.p9 {
						padding: 0 0 4px 22px;
						background: url(images/list_number_9.gif) no-repeat left 2px;}
						
div#photos ul.doorway_links {
						position: relative;
						margin-top: 4px;}

div#photos ul.doorway_links li {
						padding: 0 0 4px 0;
						padding-right: 24px;
						background: url(images/btn_bullet-small.gif) no-repeat right;}

div#photos ul.doorway_links li a {
						font-size: 13px;
						font-weight: bold;}

/* ======( Tables )=========================================== */
/* ------( global table formatting )-------------------------- */
div#photos table, div#photos tr, div#photos td, div#photos th {
						vertical-align: top; 
						text-align: left; 
						border-spacing: 0;
						margin: 0;
						padding: 0;
						border: 0;
						color: transparent;
						background-color: transparent;}
						
div#photos th {
						font-size: 12px;}

div#photos table.table_wrapper {
						width: 100%;}

div#photos td.price {
						text-align: right;}

div#photos td.inner_table_wrapper {
						width: 50%;
						padding: 0 4px;}

div#photos td.leftalign {
						text-align: left;}

div#photos td.rightalign {
						text-align: right;}

/* ------( E-Mail Form )-------------------------- */
div#photos table.confirm_email {
						margin-top: 16px;}

/* ------( table transparent )--------------------------------- */
div#photos .info_table-transparent {
						margin: 6px 0;
						width: 100%;
						border-collapse: collapse;}

div#photos .info_table-transparent tr {
						border: 0;}

div#photos .info_table-transparent tr.heading {
						border: 0;
						text-align: center;}

div#photos .info_table-transparent td {
						padding: 4px;
						text-align: center;}

div#photos .info_table-transparent td.leftalign {
						text-align: left;}

div#photos .info_table-transparent td.rightalign {
						text-align: right;}

div#photos .info_table-transparent th {
						padding: 4px;
						font-weight: bold;
						text-align: center;}

div#photos .info_table-transparent th.leftalign {
						text-align: left;}

/* ------( table orange )------------------------------------- */
div#photos .info_table-orange {
						margin: 6px 0;
						width: 100%;
						border-collapse: collapse;}

div#photos .info_table-orange tr {
						border: 1px solid #cccccc;}

div#photos .info_table-orange tr.heading {
						border: 1px solid #ebb342;}

div#photos .info_table-orange td {
						padding: 8px;
						color: #201652;
						background-color: #eeeeee;}

div#photos .info_table-orange th {
						padding: 8px;
						color: #201652;
						background-color: #f7c57e;
						font-weight: bold;}

div#photos .info_table-orange td.hilight {
						background-color: #dfdfdf;}

div#photos .info_table-orange th.hilight {
						background-color: #ffc44d;}

div#photos .info_table-orange span.colored {
						color: #f28f2f;}

/* ------( table green )-------------------------------------- */
div#photos .info_table-green {		
						margin: 6px 0; 
						width: 100%; 
						border-collapse: collapse;}

div#photos .info_table-green tr {	
						border: 1px solid #cccccc;}

div#photos .info_table-green tr.heading {
						border: 1px solid #c0d547;}

div#photos .info_table-green td {
						padding: 8px; 
						color: #201652; 
						background-color: #eeeeee;}

div#photos .info_table-green th {
						padding: 8px; 
						color: #201652; 
						background-color: #daeeaa;
						font-weight: bold;}

div#photos .info_table-green td.hilight {
						background-color: #dfdfdf;}

div#photos .info_table-green th.hilight {	
						background-color: #c6e67a;}

div#photos .info_table-green span.colored {
						color: #89ad1a;}
						
/* ------( table blue )--------------------------------------- */
div#photos table.info_table-blue {
						margin: 6px 0; 
						width: 100%; 
						border-collapse: collapse;}

div#photos table.info_table-blue tr {
						border: 1px solid #cccccc;}

div#photos table.info_table-blue tr.heading {
						border: 1px solid #4cabce;}

div#photos table.info_table-blue td {
						padding: 8px; 
						color: #201652;
						background-color: #eeeeee;}

div#photos table.info_table-blue th {
						padding: 8px; 
						color: #201652; 
						background-color: #8dcee6;
						font-weight: bold;}

div#photos table.info_table-blue td.hilight {
						background-color: #dfdfdf;}

div#photos table.info_table-blue th.hilight {	
						background-color: #7fc1d9;}

div#photos table.info_table-blue span.colored {
						color: #008bbe;}

/* ======( main.css Hacks )=================================== */
div#photos h2.pagetitleleft {
						font-size:14px;
						font-weight:bold;
						color: #4F4977;
						margin: 0;
						padding: 0;}

div#photos h2.pagetitleright {
						font-size:14px;
						font-weight:bold;
						color: #00B5F1;
						margin: 0;
						padding: 0;}