* { outline: none }

html, body { height: 100% }

body {
	/* preload the carticon images */
	background-image: url(/templates/images/icons/cart_empty.png);
	background-image: url(/templates/images/icons/cart_one.png);
	background-image: url(/templates/images/icons/cart_two.png);
	background-image: url(/templates/images/icons/cart_three.png);
	background-image: url(/templates/images/icons/cart_more.png);

	background: #fff url(/templates/images/bg.png) center top no-repeat;
	font: 85% Arial, Lucida Grande, Arial, Sans-Serif, Verdana, Helvetica;
	color: #323232;
	margin: 0;
	padding: 0;
}

table { width: 95%; margin: 0 10px 1.5em 10px }
table, table tr, table td {
	position: relative;
	border-collapse: collapse;
	border-spacing: 0;
	border: 0;
	padding: 0;
}
table thead td { background: #E2E2E2; padding: 0.25em }
table tbody tr.odd { background: #F0F0F0 }
table tbody td { padding: 0.25em; vertical-align: top }

label, form div { float: left; width: 12em; margin: 0.5em 0.5em 0 0 }
label.n { float: none; width: auto; margin: 0.75em 0.5em 0 0; font-weight: normal }
form { margin: 0; padding: 0 }

form input, form textarea, form select {
	font: 1em Verdana, Arial, Sans-Serif, Verdana, Helvetica, Arial;
	margin: 0.70em 0.5em 0 0;
	padding: 0;
}

img { margin: 0; padding: 0; border: 0 }

a { text-decoration: none }
a img { border: none }
a, a:active, a:visited { color: #3c74c1; text-decoration: none }
a:hover { text-decoration: underline }

h1, h2, h3, h4, h5 {
	font-family: Arial, "Lucida Grande", Sans-Serif, Verdana, Helvetica;
	margin: 0.5em 0 0.25em 0;
	padding: 0;
	font-weight: normal;
}

blockquote { font-style: italic; margin: 0 }

h1 { font-size: 1.58em }
h2 { font-size: 1.46em }
h3 { font-size: 1.30em }
h4 { font-size: 1.16em }

p { margin: 0 0 1.5em 0 }

ul li, ol li { list-style: none }
ul, ol { margin: 0 0 1.5em 0; padding: 0 }
ul li {
	background: transparent url(/templates/images/ul.png) 0 0 no-repeat;
	padding: 0.2em 0 0.2em 15px;
	margin: 0;
}
ul.flat, ol.flat { overflow: auto }
ul.flat li, ol.flat li { float: left; margin-right: 2em }

ol li {
	background: transparent url(/templates/images/ul.png) 0 0 no-repeat;
	padding: 0.2em 0 0.2em 22px;
	margin: 0 0 1em 0;
}
ol #s1 { background-image: url(/templates/images/ol1.png) }
ol #s2 { background-image: url(/templates/images/ol2.png) }
ol #s3 { background-image: url(/templates/images/ol3.png) }
ol #s4 { background-image: url(/templates/images/ol4.png) }
ol #s5 { background-image: url(/templates/images/ol5.png) }
ol #s6 { background-image: url(/templates/images/ol6.png) }
ol #s7 { background-image: url(/templates/images/ol7.png) }
ol #s8 { background-image: url(/templates/images/ol8.png) }

hr { background: #323232; color: #323232; width: 100%; height: 2px; margin: 1.25em 0 0.75em auto; border: none; }


/* LAYOUT */

#header {
	position: relative;
	width: 100%;
	height: 72px;
	padding: 0;
	margin: 0 0 5px 0;
	z-index: 999;
}
#logo {
	position: absolute;
	background: transparent url(/templates/images/logo.png) 0 0 no-repeat;
	top: 14px;
	left: 0;
	width: 200px;
	height: 75px;
	color: #e1e1e1;
	text-indent: -500em;
}

#menu {
	position: absolute;
	top: 65px;
	left: -10px;
	width: 1000px;
	background: #282828;
}
#menu ul { list-style: none }
#menu li {
	position: relative;
	float: left;
	background: none;
	width: 125px;
	height: 26px;
	margin: 0;
	padding: 0;
}
#menu a { display: block; width: 115px; height: 18px; font-weight: bold; color: #e1e1e1; text-decoration: none; padding: 4px 5px }
#menu a:hover { color: #e1e1e1; background: #555555; text-decoration: none }

#container {
	position: relative;
	width: 980px;
	height: 100%;
	margin: auto;
	padding: 0 10px;
}
html>body #container { height: auto; min-height: 100% }

#contents { position: relative; width: 100%; margin: 25px 0 0 0; padding: 0 }

#footer {
	position: relative;
	width: 100%;
	font-size: 0.85em;
	text-align: center;
	color: #AFAFAF;
	margin: 4em 0 0 0;
	padding: 0 0 0.75em 0;
}

#error {
	padding: 0.5em 0 0.75em 0;
	font-weight: bold;
	color: #FF6A6A;
	text-align: center;
}

.columns2,
.columns3,
.columns4,
.columns_end { position: relative; float: left; padding: 0 5px 0 0; margin: 0 10px 0 0; overflow: hidden }

.columns2 { width: 488px }
.columns3 { width: 314px }
.columns4 { width: 242px }

.columns_end { margin: 0!important; padding: 0!important }

html>body .columns1,
html>body .columns2,
html>body .columns3,
html>body .columns4,
html>body .columns_end { min-height: 350px; height: auto }

.clear { clear: both }

.left { float: left }
.right { float: right }

.tcenter { text-align: center }
.tright { text-align: right }

.ileft { float: left; margin: 0 5px 0 0 }
.iright {  float: right; margin: 0 0 0 5px }

.box { position: relative; background: #fff; padding: 4px 6px }
.box .btl,
.box .btr,
.box .bbl,
.box .bbr {
	position: absolute!important;
	float: none!important;
	background-color:	transparent!important;
	background-image: url(/templates/images/box.png)!important;
	background-repeat: no-repeat!important;
	width: 7px!important;
	height: 7px!important;
	padding: 0!important;
	margin: 0!important
	overflow: hidden;
}
.box .btl { top: -1px; left: -1px; background-position: 0 0 }
.box .btr { top: -1px; right: -1px; background-position: -7px 0 }
.box .bbl { bottom: -1px; left: -1px; background-position: 0 -7px }
.box .bbr { bottom: -1px; right: -1px; background-position: -7px -7px }

.error { color: #dd0000 }
.error2 { color: #dd0000; text-align: center; font-size: 1.25em }

/* INTERFACE */

#cart {
	position: absolute;
	bottom: 7px;
	right: 2px;
	background: transparent url(/templates/images/bg_cart.gif) top right no-repeat;
	width: 225px;
	height: 25px;
	margin: 10px;
	padding: 10px;
	text-align: right;
	vertical-align: middle;
	font-weight: normal;
	font-size: 0.95em;
}
#cart a { color: #e1e1e1 }
#cartIcon { position: relative; vertical-align: middle; margin: 0 0.25em 0 0 }
#cartList { padding: 4px 10px; background: #fff }
#cartList .item {
	float: left;
	width: 230px;
	height: 160px;
	padding: 5px;
	margin: 0 5px 5px 0;
	overflow: hidden;
}
#cartList .item div { float: right ; margin: 0 0 0 0.5em; height: 100%; overflow: hidden }

#cartList p,
#cartList h2 { text-align: right }

#cartList .border { border: 10px solid #FFF }

#cartCheckout { background: #F0F0F0; padding: 0.5em }
#cartCheckout input { margin: 0.15em 0 0.45em 0!important }
#cartCheckout .n { float: none }

#cartCheckout #fieldA,
#cartCheckout #fieldB {
	position: relative;
	float: left;
	width: 49%;
	border: none;
	margin: 0.5em 0 0 0;
	padding: 0
}
#cartCheckout #fieldB {
	background: #E2E1DE;
	padding: 5px;
	margin: 0;
}
#cartStatus { display: none }

/* START: Uploaded images styling */
#uploaded {
	position: relative;
	width: 980px;
	margin: 20px 0 10px 0;
}

#uploaded p { padding: 0 10px }
#uploaded div {
	position: relative;
	float: left;
	text-align: center;
	width: 140px;
	height: 140px;
	padding: 8px 4px 4px 8px;
	margin: 0 4px 4px 0;
}
#uploaded div input { position: absolute; width: 80px; bottom: 6px; left: 35px;}
/* END: Uploaded images styling */

#categories_open { display:block!important }
#categories_selected { background:#f1f0ed!important; width:100% }

#galleryCategories { float: left }

#galleryCategories { background: #E2E1DE; width: 180px; margin: 0 10px 0 0; padding: 0 0 1em 0 }
#galleryCategories ul { margin: 0 0 0 10px; padding: 0 }
#galleryCategories ul li { margin: 0; padding: 0; background: none }

#galleryImages { width: 765px!important }

/* START: Gallery styling */
.gallery {
	position: relative;
	width: 100%!important;
	margin: auto;
}
.gallery td {
	position: relative;
	width: 20%;
	height: 155px;
	text-align: center;
	vertical-align: middle;
	overflow: hidden;
}

.gallery a:hover { background: none }

/* END: Gallery styling */

/* START: Upload-form styling */
#upload { position: relative; margin: 0 0 1em 0 }
#uploadForm {
	position: relative;
	padding: 4px 0 14px 0!important;
	text-align: center;
	background: #323232;
	width: 310px;
	margin: 0 0 0 3px;
}
#uploadFormIframe
{
	border: none;
	width: 0px;
	height: 0px;
}
#upload input { vertical-align: middle }
#upload #uploadStatus {
	display: none;
	background: #FFF;
	padding: 0.75em 0;
}
#upload #uploadProgress {
	position: relative;
	width: 310px;
	height: 2.5em;
	margin: auto;
	border-top: 1px solid #4B4B4B;
	border-left: 1px solid #4B4B4B;
	border-right: 1px solid #FFF;
	border-bottom: 1px solid #FFF;
}
#upload #uploadProgressInfo {
	position: absolute;
	width: 310px;
	margin: 0.5em;
	text-align: center;
	font-size: 0.95em;
	z-index: 99;
}
#upload #uploadProgressBar {
	background: transparent url(/templates/images/progress.png) 0 0;
	width: 0%;
	height: 100%;
	text-align: center;
}
/* END: Upload-form styling */

#test {
	position: absolute;
	background: transparent url(/templates/images/test.png) 0 0 no-repeat;
	top: 10px;
	left: 10px;
	width: 70px;
	height: 70px;
	z-index: 99;
}

/* START: Print image styling */
#printImage {
	position: relative;
	width: 555px;
	background: #f0f0f0;
	margin: 10px 0 0 0;
}
#printImage .tl {
	position: relative;
	width: 495px;
	margin: 0 0 0 6px;
	background: url(/templates/images/frames/large/empty.png) 0 0 no-repeat;
}
#printImage .tr {
	position: relative;
	background: transparent url(/templates/images/frames/large/empty.png) top right no-repeat;
	padding-top: 45px;
	right: -45px;
}
#printImage .bl {
	position: relative;
	background: transparent url(/templates/images/frames/large/empty.png) bottom left no-repeat;
	left: -45px;
}
#printImage .br {
	position: relative;
	height: 45px;
	background: transparent url(/templates/images/frames/large/empty.png) bottom right no-repeat;
	right: -45px;
}
#printImageSource { margin: 0 0 -2px 0 ; padding: 0 }
/* END: Print image styling */

/* START: Print settings styling */
#printSettings
{
	position: absolute;
	top: 10px;
	left: 568px;
	width: 412px;
	text-align: center;
	font-size: 0.95em;
}
#printSettings #printPapers,
#printSettings #printSizes,
#printSettings #printFrames,
#printSettings #printCosts {
	position: relative;
	background: #f0f0f0;
	width: 100%;
	margin: 0 0 10px 0;
	text-align: center;
}
#printSettings #printHelp {
	margin: 0 10px;
	text-align: left;
}

#printSettings #printSizes,
#printSettings #printFrames,
#printSettings #printCosts { display: none }

#printSettings #printCosts div { margin: 5px 0; padding: 0 0 5px 0 }

#printSettings #printPapers,
#printSettings #printSizes {
	position: relative;
	overflow: auto;
}
#printSettings #printPapers div, #printSettings #printSizes div {
	float: left;
	padding: 0.25em 0;
	margin: 0;
}
#printSettings #printPapers div { width: 206px }
#printSettings #printSizes div { width: 103px }

#printSettings #printFrames {
	position: relative;
	overflow: hidden;
}
#printSettings #printFrames #printFramesContainer {
	position: relative;
	margin: 5px 0 0 0;
	height: 175px;
	overflow: auto;
}
#printSettings #printFrames div div {
	float: left;
	margin: 0 5px 10px 5px;
	padding: 0 3px;
	text-align: center;
}
/* END: Print settings styling */

/* START: View image styling */
#viewImage { position: absolute; width: 555px }
#viewImage .shadowBox { left: 45px }

#viewInfo { position: relative; float: right; top: 18px; width: 375px; padding: 0 10px; overflow: hidden }
#viewInfo label { float: left; width: 10em }

#viewTitle { position: relative; width: 100%; left: -10px; background:#fff; margin: 0 0 2em 0; padding:10px }
/* END: View image styling */

.pageList { overflow: auto; margin: 0 0 1.5em 0 }
.pageList a, .pageList span {
	display: block;
	float: left;
	padding: 2px 5px;
	margin: 0 2px;
	border: 1px solid #a0a0a0;
	text-align: center;
	font-weight: bold;
}
.pageList a:hover { border: 1px solid #4191A0; cursor: pointer }
.pageList span { border-color: #BFBBB6; padding: 2px 5px; color: #BFBBB6 }
.pageList span.current { color: #303030 }
.pageList span.space { border: none }

.frame img { margin: 0; padding: 0; border: none }

.bar { background: #dcdcdc; margin: 0; padding: 4px 0; font-size: 1.0em; font-weight: bold }

.set { background: #bcd9f2 }

.shadowBox { position: relative }
.shadowBox img { position: relative; margin: 0 0 -2px 0 }
.shadowBox .tl {
	position: relative;
	background: transparent url(/templates/images/shadow.png) top left no-repeat;
}
.shadowBox .tr {
	position: relative;
	background: transparent url(/templates/images/shadow.png) top right no-repeat;
	padding-top: 20px;
	right: -20px;
}
.shadowBox .bl {
	position: relative;
	background: transparent url(/templates/images/shadow.png) bottom left no-repeat;
	left: -20px;
	top: -1px;
}
.shadowBox .br {
	position: relative;
	height: 20px;
	background: transparent url(/templates/images/shadow.png) bottom right no-repeat;
	right: -20px;
	top: -1px;
}
