/****************************************************** 
	Title:    UBB Album Site
	Author:   Mag Studio
	Updated:  13/01/2009
	
	List Of Contents:
		= GLOBAL STYLES
			- Common
	
		= LAYOUT
			- Body
			- Header
			- Wrapper
			- Flash
			- Left Column
			- Right Column
			- Footer
******************************************************/





/* ************************ GLOBAL STYLES */

/* .................... Common */
	a {
		text-decoration: underline;
		color: #145b97;
	}
	
	a:hover {
		text-decoration: none;
	}

	a.arrows {
		line-height: 2.4em; /*26.4px*/
		padding-right: 12px;
		background: url(../images/site_images/arrows.gif) right 6px no-repeat;
	}

	a.skip {
		width: 0em;
		height: 0em;
		display: block;
		text-indent: -9999px;
	}

	.clearfix:after {
		content: ".";
		display: block;
		height: 0em;
		clear: both;
		visibility: hidden;
	}
/* ........................... */





/* ******************************* LAYOUT */

/* ...................... Body */
	html {
		background: url(../images/site_images/bg.jpg) 0 0 repeat-x;
		font-size: 1.25em; /*20px*/
	}

	body {
		font: 50% Verdana, Arial, Helvetica, sans-serif;
		background: url(../images/site_images/header.jpg) center top no-repeat;
	}
/* ........................... */


/* .................... Header */
	div.header {
		font-size: 1.10em; /*11px*/
		width: 81.82em; /*900px*/
		height: 11.64em; /*128px*/
		overflow: hidden;
		margin: 0px auto;
	}

		div.header h1 {
			width: 16.36em; /*180px*/
			height: 6.36em; /*70px*/
			margin-top: 30px;
		}

		div.header h1 a {
			display: block;
			height: 100%;
		}

		div.header h1 a,
		div.header h2,
		div.header h4 {
			text-indent: -9999px;
		}
/* ........................... */


/* ................... Wrapper */
	div.wrapper {
		width: 81.82em; /*900px*/
		margin: 10px auto 0;
		overflow: hidden;
		color: #666;
		font-size: 1.10em; /*11px*/
	}

		div.wrapper h3 {
			font: normal 2em Georgia, "Times New Roman", Times, serif;
			color: #b7a174;
			margin: 5px 0 10px;
			padding-left: 30px;
			background: url(../images/site_images/beige_symbol.gif) left 6px no-repeat;
		}

		div.wrapper h3.red_heading {
			color: #79000d;
			background: url(../images/site_images/red_symbol.gif) left 6px no-repeat;
		}

		div.wrapper p {
			margin-bottom: 15px;
		}

		div.wrapper p.order_text {
			margin-bottom: 5px;
		}
/* ........................... */


/* ..................... Flash */
	div.flash_box {
		width: 49.64em; /*546px*/
		height: 38.27em; /*421px*/
		float: left;
		margin-top: 12px;
		background: url(../images/site_images/flash_bg.jpg) 0px 0px no-repeat;
	}

		div.flash_box #teaserFlash {
			width: 47.55em; /*523px*/
			height: 35.27em; /*388px*/
			margin: 14px 0px 0px 7px;
		}
/* ........................... */


/* ............... Left Column */
	div.left_column {
		width: 49.36em; /*543px*/
		float: left;
		margin-left: 7px;
	}

		div.left_column ul,
		div.left_column ul li {
			list-style: none;
			margin: 0px;
			padding: 0px;
		}

		div.left_column ul {
			width: 47.27em; /*520px*/
		}

			div.left_column ul li {
				width: 100%;
				clear: both;
				margin-bottom: 20px;
				float: left;
			}

				div.left_column ul li div.thumb {
					width: 11.09em; /*122px*/
					height: 13.73em; /*151px*/
					background: url(../images/site_images/thumb.gif) 0 0 no-repeat;
					float: left;
				}

				div.left_column ul li h4 {
					font-weight: bold;
				}

				div.left_column ul#accordeon li div.extended_content {
					float: right;
					width: 36.09em; /*397px*/
				}

				div.left_column ul#accordeon li a.arrows,
				div.left_column ul#accordeon li span.dots {
					display: inline;
				}

				div.left_column ul#accordeon li.current a.arrows,
				div.left_column ul#accordeon li.current span.dots {
					display: none;
				}
/* ........................... */


/* .............. Right Column */
	div.right_column {
		width: 31.82em; /*350px*/
		float: right;
		margin-top: 6px;
	}

		div.right_column h3 {
			margin-top: 14px;
		}

		div.right_column h3.album {
			margin-top: 7px;
		}

		div.right_column div.thumb {
			width: 18.82em; /*207px*/
			height: 16.82em; /*185px*/
			float: right;
		}

		div.right_column div.order_box {
			height: 6em; /*66px*/
		}

		div.right_column a.order_now {
			width: 12.94em; /*207px*/
			height: 2.56em; /*41px*/
			display: block;
			background: url(../images/site_images/order_now.gif) 0 0 no-repeat;
			font: bold 1.45em Verdana, Arial, Helvetica, sans-serif; /*16px*/
			color: #FFF;
			text-decoration: none;
			text-align: center;
			margin: 0px auto;
			padding-top: 17px;
		}

		div.right_column div#payment {
			overflow: hidden;
		}

			div.right_column div#payment p {
				text-align: center;
				font-weight: bold;
			}

			div.right_column div#payment a {
				text-indent:-9999px;
			}

			div.right_column div#payment a.epay {
				width: 8.55em; /*94px*/
				height: 2.73em; /*30px*/
				float: left;
				background: url(../images/site_images/epay.png) 0 0 no-repeat;
				margin-left: 50px;
			}

			div.right_column div#payment a.ubb_online {
				width: 10.45em; /*115px*/
				height: 3.45em; /*38px*/
				float: right;
				background: url(../images/site_images/ubb_online.png) 0 0 no-repeat;
				margin-right: 50px;
			}
/* ........................... */


/* .................... Footer */
	div.footer {
		width: 85.09em; /*936px*/
		height: 2.73em; /*30px*/
		margin: 0px auto;
		background: url(../images/site_images/footer.gif) 0 0 no-repeat;
		font: normal 1.10em Verdana, Arial, Helvetica, sans-serif;
		color: #666;
		overflow: hidden;
		padding-top: 35px;
	}

		div.footer div.copyright {
			float: left;
			margin-left: 20px;
		}

		div.footer div.magstudio {
			float: right;
			margin-right: 20px;
		}

			div.footer div.magstudio span {
				float: left;
				padding-right: 10px;
			}

			div.footer div.magstudio a {
				width: 4.45em; /*49px*/
				height: 1.36em; /*15px*/
				background: url(../images/site_images/magstudio.gif) 0 0 no-repeat;
				float: left;
				text-indent: -9999px;
			}
/* ........................... */