/*
Theme Name: The Foxloft
Theme URI: http://foxloft.com
Description: Foxloft.com new theme.
Version: 1.0
Author: Roman Zenka
*/

body, table
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 16px;
	border: 0;
	margin: 0;
	padding: 0;
}

body
{
	background-color: #3A4A69;
	color: white;
}

body.narrow {
	background-image: url(/files/images/glassbg.gif);
	background-repeat: repeat-y;
	background-position: center;
}

div#topbanner {
	padding: 0;
	margin: 0;
	display: block;
	height: 145px;
	background-image: url(/files/artwork/foxexotics-topbanner-head.jpg);
	background-repeat: no-repeat;
	background-position: center;
	background-color: #000;	
}

body.narrow div#topbanner {
	padding: 0;
	margin: 0;
	display: block;
	height: 145px;
	background-image: url(/files/artwork/foxexotics-topbanner-bg.gif);
	background-repeat: repeat-x;
	background-position: top left;
}

body.narrow div#topbackground {
	background-image: url(/files/artwork/foxexotics-topbanner-narrow.jpg);
	background-repeat: no-repeat;
	background-position: center;	
}

div#topbanner h1 {
	display: block;
	margin: 0 auto;
	font-size: 0;
	color: black;
	width: 622px;
	height: 145px;
	background-image: url(/files/artwork/foxexotics-topbanner-center.jpg);
	background-repeat: no-repeat;
}

#headerbanner {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 145px;
	text-align: center;
}

#headerbanner div {
	margin: 0 auto;
	width: 622px;
	height: 145px;
	position: relative;
}

#headerbanner div h2 {
	display: block;
	position: absolute;
	left: 300px;
	top: 30px;
	width: 403px;
	height: 75px;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	font-size: 0;
	color: black;
}

.buttonstripe {
	text-align: center;
	margin: 0 auto;
}

.buttonstripe ul {
	list-style-type: none;
	list-style-position: inside;
	display: block;
	text-align: center;
	padding: 0;
	margin: 0 auto;	
}

.buttonstripe ul li {
	display: block;
	float: left;
	text-align: center;
	margin: 0 4px;
}

.buttonstripe a {
	display: block;
	float: left;
	margin: 12px 0 0 0;
}

.buttonstripe a img {
	display: block;
	float: left;
}

.buttonstripe ul li span {
	display: block;
	clear: left;
	text-align: center;
}

table.clear {
	clear: both;
}

div#content {
	margin: 1em;
}

div#last_modified
{	
	margin: 1em 38% 1em 38%;
	text-align: center;
}

h1 {  font-size: 20px; font-weight: normal; text-align: center }
h2 { font-size: 16px; }
h3 { font-size: 14px; }
h4 { font-size: 12px; }
.comingsoon {  border: 2px #000 solid }

td.paypal { width: 300px; vertical-align: middle; text-align: center;}

#topmenu { display: block; position: absolute; left:0; top:0; padding: 0; margin: 0; width: 100%; height: 145px; text-align: center;  }
#topmenu div { display: block; margin: 0 auto; text-align: left; position: relative; width: 622px; height: 145px; }
#topmenu div ul { list-style-type: none; list-style-position: inside; margin: 0; padding: 0; width: 622px; height: 145px; position: relative; }
#topmenu div ul li { display: block; margin: 0; padding: 0; position: absolute; width: 0; height: 0; }
#topmenu div ul li a { 
	display : block; position: relative; font-size: 0; color: black; background-image: 
	url(/files/artwork/foxexotics-highlight.gif);
	background-position: 0 -100px; /* Hide */
	background-repeat: no-repeat;
}
#topmenu div ul li#menu-home a { width: 90px; height: 45px; left: 0; top: 100px; }
#topmenu div ul li#menu-home a:hover, #topmenu div ul li#menu-home a:active { background-position: 14px 23px; }
#topmenu div ul li#menu-artwork a { width: 122px; height: 45px; left:90px; top:100px; }
#topmenu div ul li#menu-artwork a:hover, #topmenu div ul li#menu-artwork a:active { background-position: -76px 23px; }
#topmenu div ul li#menu-shop a { width: 82px; height: 45px; left:212px; top:100px; }
#topmenu div ul li#menu-shop a:hover, #topmenu div ul li#menu-shop a:active  { background-position: -198px 23px; }
#topmenu div ul li#menu-about a { width: 94px; height: 45px; left:294px; top:100px; }
#topmenu div ul li#menu-about a:hover, #topmenu div ul li#menu-about a:active  { background-position: -280px 23px; }
#topmenu div ul li#menu-exotics a { width: 110px; height: 45px; left:387px; top:100px; }
#topmenu div ul li#menu-exotics a:hover, #topmenu div ul li#menu-exotics a:active  { background-position: -373px 23px; }
#topmenu div ul li#menu-contact a { width: 124px; height: 45px; left:496px; top:100px; }
#topmenu div ul li#menu-contact a:hover, #topmenu div ul li#menu-contact a:active  { background-position: -482px 23px; }

h2 {  font-size: 20px; margin: 1em 0; }

h3 {  font-size: 16px; margin: 1em 0; }

.art-stripe { padding: 0 0; overflow: hidden; text-align: left; height: 104px}
.art-stripe a { margin: 2px 2px; overflow: hidden; text-align: left; height: 104px}

.gallery-page h3 {  font-weight: normal; text-align: left; margin: 20px 0 0; }

.organized-thumbnails a { display: block; float:left; width: 170px; height: 170px; text-align: center; vertical-align: middle; line-height: 168px; background-image: url(/images/tileborder.gif); background-repeat: no-repeat; }

div#last_modified
{	
	background-color: #293958;
	border: 2px solid #5C6C8B;
}

a { text-decoration: none; }
a:link { color: #BFE3FF; }
a:active { color: #f8f8ff; text-decoration: underline; }
a:visited { color: #8CB0DD; }
a:hover { color: #DFF3FF; text-decoration: underline; }

a img { border-color: #8FC3FF #7FB3ED #7FB3ED #8FC3FF; border-width: 2px; border-style: solid; }
a:visited img { border-color: #4F83AF #3F73AD #3F73AD #4F83BF; border-width: 2px; border-style: solid; }

a:hover img { border-color: #CFF3FF #AFD3FF #AFD3FF #CFF3FF; border-width: 2px; border-style: solid; }

#menu {
	float: right;
}

.narrow-column { width: expression(document.body.clientWidth > 860? "860px": "auto" ); max-width: 860px; text-align: justify; margin: 0 auto; }

.leftpic { margin: 0 1em 1em 0; float: left; }

tr.mouseOver { background-color: #304060; }

.galleryTitle { text-align: center; }

/* Pendants */
#pendants { border: 0; padding: 0; margin: 0; border-collapse: collapse;  }
#pendants tr td { padding: 5px; }
#pendants .glyph { text-align: center; }
#pendants .species { text-align: center; }
#pendants .symbolism { padding-right: 15px; padding-left: 15px; }

/* Single pendant */
#pendant { position: relative; border: 0; }
a.colbtn { width: 64px; height: 29px; display: block; text-align: center; line-height: 25px; float: left; border: 0px; }
a:hover.colbtn { background-color: #304060; }
a.colbtn-sel { background-color: #283858; }
a:hover.colbtn-sel { background-color: #203050; }

.linkimg0 { position: absolute; left: -5px; top: -23px; background-image: url(/files/images/pendants/link.gif); width: 16px; height: 27px; }
.linkimg1 { position: absolute; left: -5px; top: -23px; background-image: url(/files/images/pendants/link_cord.gif); width: 16px; height: 27px; }

a.cordbtn { height: 29px; display: block; text-align: center; line-height: 25px; border: 0px; }
a:hover.cordbtn { background-color: #304060; }
a.cordbtn-sel { background-color: #283858; }
a:hover.cordbtn-sel { background-color: #203050; }

a.cordlenbtn { width: 64px; height: 29px; display: block; text-align: center; line-height: 25px; float: left; border: 0px; }
a:hover.cordlenbtn { background-color: #304060; }
a.cordlenbtn-sel { background-color: #283858; }
a:hover.cordlenbtn-sel { background-color: #203050; }


.cart-button {
    border: 0; padding: 0; margin: 4px 0 0 15px;
    text-align: center; display: block; width: 170px; height: 115px;
	background-image: url(/files/images/foxcart.gif);
}

.cart-button:hover, .cart-button:active {
	background-position: 0 -115px;
}

/* Right-side blurb */
.blurb {
	float: right; 
	margin: 0 0px 20px 20px; 
	padding: 10px; 
	background-color: #304069;
	border: 1px solid black; 
	border-radius: 1em;
	-moz-border-radius: 1em;
}

dt { font-weight: bold; margin-bottom: 0.2em; }
dd { margin-bottom: 0.5em; }

.large-pendant-list {
	line-height: 18px;
}

.large-pendant-list span {
	font-size: 17px;
	font-weight: bold;
}

.recipe-list {
	vertical-align: top;
	width: 180px;
	text-align: center;
	margin: 0 auto;
}

.recipe-list h3 {
	background-color:#21304D;
	padding: 10px;
	margin: 4px 0 10px 0;
}

.recipe-list ul {
	list-style-type: none;
	list-style-position: outside;
	padding: 0;
	margin: 0 0;
	width: 100%;
}

.recipe-list ul li {
	padding: 0;
	margin: 8px 0 8px 0;
}

.recipe-body {
	padding: 0;
	text-align:left;
}

.recipe-body h2 {
	line-height: 1.2em;
}

.recipe-body p {
	margin: 5px 5px 5px 10px;
}

.recipe-body table {
	margin: 5px 5px 5px 10px;
}

.recipe-ingredients, .recipe-directions {
	padding-left: 10px;
	background-color:#21304D;
	line-height: 2em;
	height: 2em;
	display: block;
}

.recipe-description {
	padding-left: 10px;
}

.image-sale .price {
	font-weight: bold;
	text-align: center;
	padding: 0 5px;
    white-space: nowrap;
}

.image-sale .original .price, .image-sale .desc .original-text {
	color: #ff0;
	font-weight: bold;
}

.sale-info { text-align: right; }

.noscript { position: absolute; z-index: 100; background-color: #eedd44; color: #300; padding: 3px; font-weight:bold; }
.noscript a { color: #f00; }

.see-also-transparent {
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}
