@charset "UTF-8";
/* CSS Document */
/* =====Common elements - Headers, Links & Utility Styles===== */
/* Basic tags - see also basic.css for NS4-safe ones */
html, body { margin: 0; padding: 0; color:#FFF;}
body,td,th { font-size: small; font-family: "Century Gothic", Verdana, Arial, Helvetica, sans-serif;background: url(../assets/bg1.jpg) repeat left top; }
h1, h2, h3, h4, h5, h6 { margin-bottom: 0.3em; }
h1 { font-size: 160%; }
h2 { font-size: 145%; }
h3 { font-size: 130%; }
h4 { font-size: 115%; }
h5 { font-size: 100%; }
h6 { font-size: 85%; }
/* Set a consistent starting-point for list formatting */
ul { margin-left: 2.5em; padding-left: 0; }
li { margin: 0; padding: 0; line-height: 1.4em; }

/* Links - best order: link-visited-hover-active */
a:link { color: #ccf; }
a:visited { color: #faa; }
a:hover { color: #eef; }
a:active { color: #f84; }

/* Utility Classes (should rarely change) */
img { border:none; }
.hide { display: none !important; visibility: hidden !important; }
.center { text-align: center !important; }
.blockcenter { margin-right: auto !important; margin-left: auto !important; width: 595px; }
.vabscenter { position: absolute; top: 50%; margin-top:-100px; } /* Set margin-top to half element height */
.habscenter { position: absolute; left: 50%; margin-left:-100px; } /* Set margin-left to half element width */
.nopre { margin-top: 0em; } /* No space above - useful for first elements in blocks */
.nopost { margin-bottom: 0em; } /* No space below - useful for last elements in blocks */
.twocol { position: relative; margin-bottom: 1em; }
.twocol .col { float: left; width: 280px; padding: 0px 10px; position: relative; }
.cleardiv { clear: both; height: 0; margin:0; padding:0; overflow:hidden; line-height: 0; font-weight: lighter; }
.nobreak { white-space: nowrap; }

/* Wright Image Translation (change width, height) */
/* Create a 'window' for the link */
#logo.ir { display: block; width: 278px; height:100px; overflow:hidden; }
/* Ensure link and background are visible whether images are on or off */
#logo.ir, #logo.ir a { background: url(../assets/XothiqueLogo.png) no-repeat 10px top; color:#FFF; }
/* display:list-item puts an image INLINE with the link, pushing the link-text out of the 'window' if images are on. */
#logo.ir a { display: list-item; list-style-image: url(../assets/glass.gif); list-style-position: inside; }
/* Fix for Safari 1 and IEMac, which centre heading blocks with defined widths: */
#logo.ir { margin: 0; padding: 0; }
/* Repeat for tagline */
#tagline.ir { display: block; width: 490px; height:2em; overflow:hidden; }
#tagline.ir, #tagline.ir a { background: url(../assets/Tagline.gif) no-repeat left top; color:#FFF; }
#tagline.ir a { display: list-item; list-style-image: url(../assets/glass.gif); list-style-position: inside; }
#tagline.ir { margin: 0; padding: 0; }
/* =====Site Structure===== */
#sheen { height: 100px; line-height: 100px; margin: 0; padding: 0; width: 100%; background: url(../assets/HeaderGradient.png) repeat-x left top; }
#page {
  max-width: 960px;
  margin: -100px auto 0 auto;
  position: relative;
}
/* Header */
#header {
	margin:0;
	padding: 1px;
	height: 100px;
}
/* padding stops margins collapsing and repositioning inner float */
#logo {
	float: left;
	margin: 0;
	padding: 0;
} /*Breaks image-replacement in Opera 6.0.3 (Mac), but not in more modern browsers*/
#tagline {
	position: absolute;
	top: 40px;
	height: 2em;
	font-style: italic;
	background: url(../assets/Tagline.png) no-repeat left top;
	left: 280px;
	margin: 0;
	padding: 0;
}

/* Main Content */
#main { }
#content {
	padding: 10px 0;
	max-width: 810px;
	position: relative;
	left: 14em;
  font-size:110%;
}
#pagetitle {
	margin-top: 0;
	font-size: 150%;
	text-align: center;
}
#content a.nolink  { text-decoration:none !important; color:white !important; }

/* Navigation - LocalNav, GlobalNav */
#localnav { margin: 0; padding: 0 10px; position: absolute; top: 0px; left: 0px; height: 2.5em; width:780px; }
#localnav li { position: absolute; width:780px; list-style:none; text-align:center; margin: -1px; }
#localnav li.backlink { top: 0; left: 0; width:390px; z-index: 25; }
#localnav li.nextlink { top: 0; right: 0; width:390px; z-index: 25; }

#localnav a:link { color: #bbf; }
#localnav a:visited { color: #faa; }
#localnav a:hover { color: #ddf; }
#localnav a:active { color: #f84; }

#globalnav { margin: 10px; position: absolute; top: 100px; left: 0px; }
#globalnav ul { margin: 0; padding: 5px; }
#globalnav li { width:10.5em; list-style: none; background: url(../assets/bullet.gif) 5px 3px no-repeat !important; padding: 0 0 0 20px; margin: 0 -1.2em 0 0; }
#globalnav a:link, #footer a:link { color: #ccf; background: #336; }
#globalnav a:visited, #footer a:visited { color: #fbb; background: #336; }
#globalnav a:hover, #footer a:hover { color: #ddf; background: #336; }
#globalnav a:active, #footer a:active { color: #f84; background: #336; }
#globalnav li#here { list-style: none; background: url(../assets/bullet_here.gif) 5px 3px no-repeat !important; }
#globalnav #here a { text-decoration: none; }

/* Footer */
#footer { clear: both; margin: 120px 10px 10px 10px; position: absolute; top: 31em; left: 0px; }
#footer ul { text-align: center; list-style: none; font-size: 85%; margin: 0; padding: 5px 0; }

#footer ul li a.nolink { text-decoration: none !important; color: #fff !important; }
a.nolink span.showlink { text-decoration: underline !important; color: #ccf !important; }
a:visited span.showlink { color: #fbb !important; }

/* =====Box Styling===== */
#globalnav.box, #footer.box { width: 11.5em; }
.boxcontent { border: 1px solid white; background-color: #336; }
.boxcontent { -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; }

/* =====Other Classes===== */
#globalnav li.navgroup { font-weight: bold; margin-left: 5px; background: none !important; padding-top: 5px; padding-left: 0; }
#globalnav li.navgroup h4.navGroupTitle { padding:0;margin-top:0; }

#pictitle { text-align: center; }
#artpic { margin: 1em auto; }
.galleryInfo { text-align: left; }

.thumb { display: inline-block; width: 140px; height: 160px; position: relative; }
.thumblink { position: relative; text-decoration: none; }
.thumbnail { padding: 10px 5px; }
.multithumb { padding: 10px 5px; }
.thumbcount { border: 1px solid #000; color: #000; background-color: #FFFF99; z-index: 25; display: inline; text-decoration: none; }
.thumbcount { position: absolute; left: 5px; }

/* ART PAGES */
#artinfo { text-align: left; }
#artinfo a:link {	color: #bbf; }
#artinfo a:visited { color: #faa; }
#artinfo a:hover { color: #ddf; }
#artinfo a:active { color: #f84; }
#artpage { margin-top: 2em; padding-top:1em;}
#artpage img { float:left; padding: 0 1em 0 0; }
#artpage ul { margin: 0; padding: 0.5em 0; list-style: none; width:40%; float: left; }
#artpage ul li { margin: 0; padding: .5em 0; list-style: none; }
#artpage .priceinfo { padding: 0; margin-left:-1em;}
#artpage .priceinfo .label { font-weight: bold; }
#artpage .priceinfo .buylink { line-height: 36px; }
#artpage .priceinfo .pricecut { font-size: smaller; text-decoration:line-through; position:absolute; top: -0.3em; }
#artpage .priceinfo form { display: inline; margin: 0 5px; position: relative; top: 5px;}
#artpage .priceinfo .stockcount { white-space: nowrap; }
.wide {	width: 100% !important; }

/* CONTACT PAGE */
#contactForm .formfield { display: block; list-style: none; font-weight: bold; line-height: 2em; }
.formInput, .radioGroup, .checkboxGroup { display: inline; position: absolute; left: 25%; }
#contactForm .tallfield { display: block; list-style: none; font-weight: bold; margin-bottom: 8em; }
.vcard { margin-left: 10em; }
#contactForm .captcha { font-weight: normal; }
#contactForm .formBtns { text-align: center; padding: 1em 0 0 0; }

/* BIO PAGE */
#xothique_pic { float: right; margin: -2em 0 0 10px; }

#piclinks {
	margin: 15px auto 0 auto;
	width: 810px;
	overflow: hidden;
}
#piclinks li {
	list-style: none;
	width: 270px;
	text-align: center;
	float: left;
	margin: 0;
}
#piclinks li a { text-decoration: none; border: none; }
#piclinks li a strong { text-decoration: underline; }
#piclinks li img#aceopic { background: url(../assets/ACEOs.png) no-repeat center top; }
#piclinks li img#maskpic1 { background: url(../assets/Masquerade-Mask-Green-Man.png) no-repeat center top; }
#piclinks li img#maskpic2 { background: url(../assets/Ra-Headdress-Masquerade-Mask.png) no-repeat center top; }
#piclinks li img#paintingpic { background: url(../assets/Painting.png) no-repeat center top; }

#main #content .tooltip .tipinfo { }
a.info:link, a.info:visited { color:#fff; position: relative; font-weight:bold; z-index: 24; text-decoration:none; border-bottom: 1px dotted #fff; }
a.info span { display: none; }
a.info:hover span { display:block; position: absolute; top: -1.6em; left: 0; color: #000; background-color: #FFFF99; font-weight: normal; font-size: x-small; width: 12.5em; z-index: 25; border: 1px solid #000; text-decoration: none; }
a.info:hover { background-color:#fff;	/* required by IE6 */ 
	color:#669; }

.smallText { font-size: 90%; }

#globalnav #subnav li { width: 7.5em; margin-left: -10px; font-size: 85%; }

fieldSet {
	margin-top: 0.75em;
	border: none;
}
fieldset legend {
	margin-left: -1em;
	font-size: larger;
	font-weight: bold;
}

/*SHOP*/
.subcatTitle { clear: both; padding-top: 1em; }
#MasqueradeMasksShop .thumb { float: left; height: 190px; position: relative; width: 150px; margin: 0 2px; }
#MasqueradeMasksShop .thumb img { padding: 0; }

#MasqueradeMasksShop .thumb .priceinfo, #MasqueradeMasksShop .thumb .buylink { text-align: center; width: 75px; position: absolute; bottom: 0; }
#MasqueradeMasksShop .thumb .priceinfo { left: 0; height: 25px; }
#MasqueradeMasksShop .thumb .buylink { right: 0; height: 30px; }
#MasqueradeMasksShop .thumb .buylink form { display: inline; padding: 0; margin: 0 auto; }
#MasqueradeMasksShop .thumb .buylink form img { width:1px; height: 1px; }
#MasqueradeMasksShop .thumb .priceinfo .pricecut { text-decoration:line-through; font-size: smaller; margin: -1em 0 0 0; padding: 0; position: relative; top: -0.5em; }
#MasqueradeMasksShop .thumb .priceinfo .saleprice { margin: 0; padding: 0; position: relative; top: -0.5em; color:#FFFF00; font-weight: bold; }
.saleprice { color:#FFFF00; font-weight: bold; }

/*=============SALE+CALLOUT BANNERS=============*/
#sale, .callout {
	margin: 1em auto 0 auto;
	width: 80%;
	font-size: 1em;
	background-color: #447;
	padding: 10px 5px;
}
#sale, .callout {
	border: 1px solid white;
	-moz-border-radius: 10px;	-webkit-border-radius: 10px;	border-radius: 10px;
}
#sale p, .callout p { text-align: center; }
#sale h2, .callout h2 { text-align: center; }
#sale h2, #sale p, .callout h2, .callout p { margin: 5px; padding: 0; }
.callout.snow { padding: 5px; margin: 0 auto;
  width: 620px;
  text-align: center;
  background-color: #558;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
  border: 1px solid white;
}
.callout.snow h2:before {
  padding-right: 10px;
  content: url(../assets/flakes-l.png);
}
.callout.snow h2:after {
  padding-left: 10px;
  content: url(../assets/flakes-r.png);
}
.subtitle {
	margin-bottom: -0.6em;
	margin-top: 1.6em;
}
#shares { text-align: center; clear: left; padding: 2em 0 1em 0; }
.sociable_tagline { display: inline; }
#content .sociable ul { position: absolute; }

/*--- CSS3 enhancements --*/

#social, #webutation-badge {width: 11.5em; margin: 10px;}
#social {padding-left: 10px;}
#webutation-badge {margin-left: 5px;}
#social > div > a { width:120px;display: block; margin: 10px 37px; }
#social > div > a.addthis_button_facebook_like {margin-left:40px;}
#social > div > a.addthis_button_tweet {margin-left:32px;}

.highlight { font-weight: bold; font-style:italic; color: yellow; }
#MasqueradeMasksShop .thumb.nostock:before {
content: "Made To Order";
position: absolute;
text-align: center;
width: 100%;
bottom: 30px;
color: yellow;
font-weight: bold;
font-style: italic;
}

span#welcome { font-weight:bold; }

img[alt] { } /* stub for debugging to find images *with* alt text */

#faqsList dt {font-weight:bold;margin-top:10px;}
#faqsList dd {margin:5px;}

body .addthis-smartlayers .at4-recommended h3.at-recommended-label {color:white;}
body #at4-recommended-outer-container {padding-left:140px;zoom:0.92;}
#col1 {width:11.5em;float:left;}