/* 
Title:		Main CSS
Author: 	3 Crown Creative
*/
@import "base.css";

body {min-width:832px; background: #fff url(/images/bkgWindow.jpg) no-repeat center top }
html {height:101%}

/*  <PAGE STRUCTURE>
--------------------------------------------------*/
#outerWrap {width:832px; background:url(/images/bkgContent.png) repeat-y; margin:0 auto;}
#foot {font-size:.7em;color:#cd6060; margin-top:20px; padding-bottom:10px}

.sidebar {float:left; padding-left:30px; width:305px}

.content {float:right;width:497px  }
.logo { margin:10px 25px 5px 0; background:url(/images/logo.png) no-repeat top right;  height:65px; display:block; text-indent:-5000px;}
.whatsnew {background:url(/images/whatsnew.png) no-repeat right top; height:14px; display:block; text-indent:-5000px; margin-top:1em}
.featured {background: url(/images/txtFeaturedProducts.png) no-repeat right top; height:18px; display:block; text-indent:-5000px;}

#header .sidebar {width:380px; padding:0 30px;}
#header .content {width:392px}

.introSection {height:339px; margin-top:20px}
#contact #content, #bio #content {padding:20px 30px;}

#introText { position:relative; width:325px;  height:100%; float:left}
#introText div {position:absolute; bottom:0; left:30px}
#introText div > p:last-of-type {padding-bottom:0}

#bio #sidebarTop {padding-left:30px; float:left}
.section {margin-top:30px}
.section .content {padding-left:22px; width:475px}
.featuredImgs img {margin-right:1em; border:1px solid #000}
.featuredImgs img:hover {filter:alpha(opacity=50);-moz-opacity:0.5;opacity: 0.5;}
#content .featuredImgs a {color:#000}
#content .featuredImgs a:hover {color:#EC3E09}


/*  <NAVIGATION>
--------------------------------------------------*/
#nav { background:#000; padding:0 1em;  height:22px;}
#nav .sidebar {width:335px; padding-left:0}
#nav ul {margin:0px; padding:0px;}
#nav ul li {display:inline; float:left; list-style:none; height:22px; margin-right:3.5em; position:relative;}
#nav li a {color:#fff;text-decoration:none;font-family:Verdana, Geneva, sans-serif; line-height:1.7em; font-weight:bold}
#nav ul li.last { margin-right:0}
#nav li a:hover { color:#ec3e09;}
#nav li ul { margin:0; padding:0 1em;  position:absolute; left:0px; top:22px; width:202px; background-color:#fff; border:1px solid #000; border-top:none; display:none}  
#nav li:hover ul,
#shop #nav li ul,
#belts #nav li ul,
#glass #nav li ul,
#jewelry #nav li ul
	{display:inline; }
#nav li li {display: inline; list-style:none; margin-right:20px; position:relative; height:20px; float:left}
#nav li li a {color:#000; text-decoration:none; font-size:.9em; font-weight:bold}
#nav li li a:hover {color:#ec3e09;}
#nav li li a.active {color:#ec3e09; cursor:default}

#nav li li ul { width: auto; display:block; white-space:nowrap; padding:0 0 0 .5em; border:none;background:url(/images/50p_white.png) repeat;}
#nav li li li.subnav {float:none; display:list-item; font-size:.9em; height:auto;line-height:.9em}
#nav li li li.subnav a { color:#000 ; font-size:.8em; font-weight:normal}


#home #nav .home a,
#shop #nav li.shop > a:first-of-type,
#bio #nav .bio a,
#contact #nav .contact a
	{text-decoration:none; color:#ec3e09; cursor:default;}
#shop #nav .shop ul li a {color:#000}
#shop #nav .shop ul li a:hover {color:#ec3e09; cursor:pointer}
#shop #nav .shop ul ul {display:none}

/*   SLIDESHOW  */
/*
#prev { float:left; background:url(/images/prev.png) no-repeat left bottom; width:20px; height:34px;margin:305px 2px 0 0; text-indent:-5000px; display:block; cursor:pointer}
#next { float:left; background:url(/images/next.png) no-repeat left bottom; width:20px; height:34px;margin:305px 0 0 2px; text-indent:-5000px; display:block; cursor:pointer}
a#prev, a#next {border-bottom:none}
#slideshow-container {float:left; position:relative; width:452px; height:339px;}
#slideshow-container img { width:452px; height:339px; display:block; position:absolute; top:0px; left:0px; z-index:1; }
*/
/*  <SLIDE SHOW>
--------------------------------------------------*/
#slideshow {float:left;clear:both; margin:0 16px 16px 20px;position: relative; width: 452px; height: 339px;}
#slideshow ol,
#slideshow ul, 
#slideshow ol li, 
#slideshow ul li 
  {margin:0; padding:0}
#slideshow #menu, #slideshow #pictures, #slideshow #loading { position: absolute; }
#slideshow #loading { background: url(/images/imagesCMS/spinner.gif); display: block; top:161px; left: 204px; text-indent: -5000px; width: 16px; height: 16px; visibility: hidden; z-index: 5; }
#slideshow #pictures { width: 452px; height:339px; left: 0; overflow: hidden; }
#slideshow #pictures li { display: block; position: absolute; top: 0; width: 452px; }
#slideshow #pictures li img { display: block; position: relative; bottom: 0; }
#content #slideshow ul li {list-style-image: none)}
#slideshow #menu li {list-style-type: none; width: 0px; height:0px; right: 0;  }
#slideshow #menu li { display:none;}
#slideshow #menu li a { display: none; }
#slideshow #menu li.current a { display:none}
#slideshow #menu li.background { display:none }

/* main shop page */
#shop #content {padding:20px 30px; font-size:.9em}
#shop #content .floatL {margin:0 50px 30px 0 }
#shop #content .floatR {margin:0 0 10px 50px }
#shop #content h1 {margin:0 0 .5em 0}
.returnMsg {visibility:hidden; position:absolute; left:0; top:0}

/*  <CONTACT FORM>
--------------------------------------------------*/
.required {background:url(/images/imagesCMS/formRequired.gif) no-repeat 2px 2px; width:15px; height:15px; display: inline-block;}
#formContact {padding-top:10px;font-family:Verdana,Arial,Helvetica,sans-serif; font-size:.95em}
#formContact table {padding:0; margin:0; width:80%}
#formContact td {padding:0 5px 5px 0; margin:0; width:20%; text-align:right; border:none}
#formContact .tdl {text-align:left; width:80%; vertical-align:top }
#formContact input { border:1px solid;border-color:#DCDCDC #F0F0F0 #F0F0F0 #DCDCDC; width:250px; padding:1px; letter-spacing:.04em; font-size:.95em; outline:none;font-family:Verdana,Arial,Helvetica,sans-serif;}
#formContact input:focus, #formContact textarea:focus {border-color:#9a9a9a #c0c0c0 #c0c0c0 #9a9a9a;}

#formContact .button { margin-top:5px;background-color:#b0b388; border:1px solid black; cursor:pointer; color:#eee; width:255px; padding-top:3px;font-family:Verdana,Arial,Helvetica,sans-serif;}
#formContact textarea { border:1px solid;border-color:#DCDCDC #F0F0F0 #F0F0F0 #DCDCDC;width:250px;font-family:Verdana,Arial,Helvetica,sans-serif; letter-spacing:.04em; padding:1px; outline:none; font-size:.95em}


/*  <PAGINATION>
--------------------------------------------------*/
.pagination {font-size:.9em;padding: 3px 3px 3px 0;margin:3px 3px 3px 0; text-decoration:none}
.pagination a {padding: 1px 5px;margin: 2px 4px 2px 0;border: 1px solid #666666;text-decoration: none;color: #666666; background-color:#ffffff;}
.pagination a:hover, .pagination a:active {border: 1px solid #000000;color:#000000; background-color:#c26612; text-decoration:none}
.pagination .current {border: 1px solid #000000;color:#000000; background-color:#c26612; cursor: default	}
.pagination .disabled {padding:1px 5px;margin: 2px;border: 1px solid #EEE;color: #DDD;}


/*  <ERROR HANDLING>
--------------------------------------------------*/
.inpErr {background-color:#7a2a0b; color:#ffffff;}
.inpOK {background-color:white; color:#000000}
.errorDiv {color:#7a2a0b; font-weight:bold; margin-top:10px; text-align:left }
.noerror {font-weight:normal; margin:0; color:#333;text-align:left; border:1px solid #333; padding:3px;margin-top:20px;background-color:#DCDDD5; }
#formContact .inpOK {background-color:#fff;}

/*  <MISC>
--------------------------------------------------*/
.right {float:right; text-align:right}
.left {float:left}
.alignL {text-align:left}
.alignR {text-align:right}
.none {display:none}
.show {display:block}
.visible {visibility:visible}
.hidden {visibility:hidden}
.SQLerror {color:#7a2a0b; font-weight:bold; margin-top:10px; text-align:left; border:1px solid #7a2a0b; padding:5px }

/* self-clear floats */
.group:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}

/*  <SPECIAL LINK TYPES>
--------------------------------------------------*/
a.pdf {background: url(/images/imagesCMS/pdf.png) no-repeat left center;padding-left: 20px;line-height: 16px; }
a.txt {background: url(/images/imagesCMS/txt.png) no-repeat left center;padding-left: 20px;line-height: 16px;}
a.zip { background: url(/images/imagesCMS/zip.png) no-repeat left center;padding-left: 20px;line-height: 16px;}
a.email {background: url(/images/imagesCMS/email.png) no-repeat left center;padding-left: 20px;line-height: 16px;}
a.external {background: url(/images/imagesCMS/ext_link.png) no-repeat left center;padding-left: 20px;line-height: 16px;}

/*  <ACCORDION>
--------------------------------------------------*/
h3.selected  { color: #973513;}
#accordion {margin:20px 0px;}
h3.toggler {cursor: pointer;border: 1px solid #f5f5f5;border-right-color: #ddd;border-bottom-color: #ddd;
	margin: 0 0 4px 0;padding: 3px 5px 1px 5px; clear:both;font-size:.95em; font-weight: normal;}
h3.back { }
div.element  {	margin:0px;padding:4px 4px 4px 10px;}
.toggler:hover   {color: #973513}  

/*  <IMAGE CAPTION>
--------------------------------------------------*/
.arc90_imgcaptionTXT {font-size: .8em;text-align: left; padding-right:0; line-height: normal}
.arc90_imgcaption {text-align: center;width: 9em;
/*border: 1px solid #004716;padding: 1em;margin: 1em 0;*/
}