/*
	Kustom Workz Styles
	
	styles.common.css

	this file sets up all of the IDs and CLASSes that are used by the entire site
	
	SOME NOTES ON THE CONVENTIONS USED:
	- IDs that are used for template-level objects are InitalCaps
	- CLASSes that are used for site-wide objects are also InitialCaps
	- IDs that are used for an element on a specific page are all lowercase, using
		dashes to separate words, and (if approprate) prefixed by another word to 
		'group' the IDs, and then an underscore. (ex: Navigation_contact-us, Navigation_home)

*/

/* add the good stuff for the good browsers */

BODY { margin: 0; padding: 0; background :url(images/img.bg.site.jpg) 0px 0px repeat-x #3b3b3b; font-family: Verdana, Arial, Helvetica, sans-serif; color: #333; }
/* \*/ * HTML BODY { text-align: center; } /* WORKAROUND: for IE/win */ /* */
TEXTAREA { font-family: Verdana, Arial, Helvetica, sans-serif; color: #333; font-size: 75%; }

A { text-decoration: none; }
A:Hover { text-decoration: underline; }
HR { display: none; }

IMG { font-size: 11px; border: none; }
LEGEND { display: none; }
FIELDSET { border: none; margin: 0; padding: 0; }

.SectionMarker, #BrowserWarning, #AccessibilityLinks { display: none; }

H1, H2, H3, H4, H5, H6 { margin: 0; padding: 0; }
H1 { font-size: 120%; }
H2 { font-size: 110%; }
H3 { font-size: 100%; }
H4 { font-size: 90%; }
H5 { font-size: 80%; }
H6 { font-size: 75%; }

P { margin-top: 0; font-size: 75%; }

A { color: #53859F; }

FORM { margin: 0; padding: 0; }

.SectionMarker A { color: #333; }

/* ---------------------------------------------- BEGIN: important classes -- */

.ClearFix { clear: both; font-size: 0; }

.LayoutTable { width: 100%; }
.LayoutTable TD { vertical-align: top; }

.FormTable { }
.FormTable TD, .FormTable TH { padding: 2px 0; }
.FormTable TD { }
.FormTable TH { font-size: 75%; font-weight: normal; text-align: left; padding-right: .5em; }
.FormTable TH LABEL { font-size: 100% !important; }

.FormAction { text-align: right; padding-top: 4px; }

.DataTable { width: 100%; }
.DataTable TH,
.DataTable TD { padding: 2px 0; }

.Horizlist { margin: 0; padding: 0; }
.Horizlist LI { float: left; list-style-type: none; display: block; }
.Horizlist LI A { display: block; }

UL.LinkList,
.NoBullet { margin: 0 0 1em 0; padding: 0; }
UL.LinkList LI { margin: 0 0 .5em 0; padding: 0 0 0 10px; list-style-type: none; }
.NoBullet LI { list-style-type: none; background-image: none !important; padding-left: 0; }

UL.Inputs { margin: 0; padding: 0; }
UL.Inputs LI { margin: 0; padding: 0; list-style-type: none; font-size: 75%; margin-bottom: .3em; }

DL.LinkList { margin: 0; }

INPUT, SELECT,
.Icon, .Button { vertical-align: middle; }

.Invisible { display: none; }

.Separator { text-align: center; margin: 10px 0; }

.Exception { } /* NOTE: to be used *sparingly*! */

.Even { }
.Odd { }

.ErrorMsg { border: 1px solid #900; margin: 0 0 .3em 0; background :#D5B6B6; color: #900; padding: 5px;  }
.ErrorMsg P { margin: 0 0 .5em 0; }
#Error { border: 1px solid #900;  color: #900; margin: 0 0 1em 0; padding: 40px 10px 5px 10px;  }
#Error P { margin: 0 0 .5em 0; }

.RightColCell { }
.LeftColCell { }

#NavColumn {}
#NavColumn DIV { width: 164px; }
#MainColumn {}
#SideColumn {}

/* \*/
* HTML { } /* WORKAROUND: for IE/win */
/* */

font[size=1] { font-size: xx-small; }
font[size=2] { font-size: small; }
font[size=3] { font-size: medium; }
font[size=4] { font-size: large; }
font[size=5] { font-size: x-large; }
font[size=6] { font-size: xx-large; }
font[size=7] { font-size: 300%; }
font[size=-1] { font-size: smaller; }
font[size=+1] { font-size: larger; }
font[size=-2] { font-size: 60%; }
font[size=+2] { font-size: 150%; }
font[size=+4] { font-size: 300%; }

/* ------------------------------------------------ END: important classes -- */

#PageWrapper { margin: auto; width: 780px; text-align: left; }
#LayoutWrapper { margin: .5em 0 0 0; }
#HeaderWrapper { margin: 0;   }
#BodyWrapper { margin: 0;  }
#FooterWrapper { margin: .5em 0 .5em 0; padding: 5px 10px 5px 10px; border: 1px solid #333; background: #fff; text-align: center; }
#FooterWrapper P { font-size: 70%;  margin: 0 0 .3em 0; }
#FooterWrapper #Copyright { margin: .8em 0 0 0; }
#FooterWrapper #Copyright P { font-size: 9px; }

#SectionHeader { margin: 0 0 .2em 0; }

#MainColumn { min-height: 400px; }
*HTML #MainColumn { height: 400px; }


#NavigationWrapper { background :url(images/img.bg.navigation.jpg) 0px 101px no-repeat #3b3b3b; border-left: 1px solid #333; border-right: 1px solid #333; border-bottom: 1px solid #333;  }
#NavigationWrapper IMG { border-bottom: 1px solid #333;  }
#NavigationWrapper .LayoutTable { width: 620px; margin: 0 0 0 158px;  }

#SubNavigationWrapper { height: 20px; margin: 2px 0 0 0; border: 1px solid #333;  background :url(images/img.bg.subnav.gif) 0px 0px repeat-x #3b3b3b; }
#SubNavigationWrapper UL { font-size: 70%; font-weight: bold; color: #e9e9e9; line-height: 20px; }
#SubNavigationWrapper UL LI {  }
#SubNavigationWrapper UL LI.Active A { background: #ccc; text-decoration: none; color: #990000; }
#SubNavigationWrapper A { display: block; padding: 0 7px 0 7px; border-right: 1px solid #333; color: #e9e9e9; }
#SubNavigationWrapper A:Hover { background: #ccc; text-decoration: none; color: #990000; }

#MainLayoutColumn { height: 400px; background: #ccc; margin: 0; padding: 0; border-top: 1px solid #333; border-left: 1px solid #333; border-bottom: 2px solid #333; border-right: 2px solid #3b3b3b; }
#SideLayoutColumn { background: #fff; margin: 0; padding: 0; border-top: 1px solid #333; border-left: 1px solid #333; border-bottom: 2px solid #333; border-right: 1px solid #333; }

#Breadcrumb { margin: .5em 0 1em 10px; }
#Breadcrumb P { font-size: 70%; }

.Pagination {  margin: 1em 10px 1em 10px; text-align: center;  }
.Pagination DIV { padding: 0 10px 0 10px; height: 17px; line-height: 17px; border: 1px solid #8a9bb8; background: #ececec; font-size: 70%; }
.Pagination DIV SPAN {  margin: 0 30px 0 30px; }
.Pagination DIV SPAN.Active {  margin: 0; padding: 0 5px 0 5px; color: #fff; background: #900; border-top: 1px solid #900; border-bottom: 1px solid #900; border-left: 1px solid #900; border-right: 1px solid #900; font-weight: bold;  }
.Pagination P { margin: 0; font-weight: bold; font-size: 65%; }

/* ------------------------------------------------ END: important classes -- */



/* -------------------------------------------------- BEGIN: PageCommon -- */

.Item { padding: 5px 10px 5px 10px; margin: 0 0 1em 0; clear: both;}
.Item H3 { color: #900; font-size: 85%; margin: 0 0 .5em 0; }
.Item DL { margin: 0; font-size: 75%; }
.Item DT { margin: 0; font-weight: bold; }
.Item DD { margin: 0; }
.Item DD A { margin: 0; }


.SideNavBox { margin: 0 0 1em 0; }
.SideNavBox H3 { height: 20px; line-height: 20px; margin: 0 0 .5em 0; padding: 0 5px 0 5px; font-size: 70%; color: #fff;border-top: 1px solid #333; border-bottom: 1px solid #333;  background :url(images/img.bg.subnav.gif) 0px 0px repeat-x #3b3b3b; }
.SideNavBox H5 { margin: 0 5px .5em 5px; }
.SideNavBox P { margin: 0 5px .5em 5px; }
.SideNavBox UL { margin: 0 5px 0 5px; font-size: 75%; }
.SideNavBox DL { margin: 0 5px 0 5px; font-size: 75%; }
.SideNavBox DT { margin: 0; font-weight: bold; }
.SideNavBox DD { margin: 0; }
.SideNavBox DD A { margin: 0; font-weight: bold; display: block; margin: .5em 0 0 0; }

.SideNavBox UL { list-style-type: none; margin: 0; padding: 0; }
.SideNavBox UL LI { padding: 0 0 0 15px; margin: 0 0 .5em 0; background: url(images/icon.bullet.8a9bb8.gif) 5px 5px no-repeat; }


#NavGroup-coupon DL {}
#NavGroup-coupon DT { font-size: 160%; color: #900; text-align: center; }
#NavGroup-coupon DD {}
#NavGroup-coupon DD SPAN { font-size: 75%; }

.ShopServices #HomeBox-information P { padding: 0 0 1em 0; border-bottom: none; }

#HomeBox-information P { padding: 0 0 1em 0; border-bottom: 1px dashed #999; }
#HomeBox-information UL { margin: 0 0 1em 0; padding: 0 0 0 25px; font-size: 75%; }
#HomeBox-featuregallery {}
#HomeBox-featuregallery H5 { margin: -.5em 0 0 0; font-size: 70%; font-weight: normal; }

#HomeBox-gallerythumb {}
#HomeBox-gallerythumb H3 { border-bottom: 1px dashed #999; }
#HomeBox-gallerythumb .DataTable { border-top: 1px solid #8a9bb8; }
#HomeBox-gallerythumb .DataTable TD { width: 150px; padding: 5px 5px 0 5px; border-bottom: 1px solid #8a9bb8; border-right: 1px solid #8a9bb8; border-left: 1px solid #8a9bb8; }
#HomeBox-gallerythumb .DataTable TH { padding: 5px 5px 0 5px; border-bottom: 1px solid #8a9bb8; border-left: 1px solid #8a9bb8; }
#HomeBox-gallerythumb .DataTable H4 { font-size: 75%;}
#HomeBox-gallerythumb .DataTable H5 { font-size: 70%; font-weight: normal; }
#HomeBox-gallerythumb .DataTable P { font-weight: normal; }

#HomeBox-galleryindex .DataTable { border-top: 1px solid #8a9bb8; }
#HomeBox-galleryindex .DataTable TD { width: 150px; padding: 5px 5px 0 5px; border-bottom: 1px solid #8a9bb8; border-right: 1px solid #8a9bb8; border-left: 1px solid #8a9bb8; }
#HomeBox-galleryindex .DataTable TH { padding: 0; border-bottom: 1px solid #8a9bb8; border-left: 1px solid #8a9bb8; }
#HomeBox-galleryindex .DataTable H4 { font-size: 75%;}
#HomeBox-galleryindex .DataTable H5 { font-size: 70%; font-weight: normal; }
#HomeBox-galleryindex .DataTable P { font-weight: normal; }

#HomeBox-tshirtindex .DataTable { border-top: 1px solid #8a9bb8; }
#HomeBox-tshirtindex .DataTable TD { width: 150px; padding: 0; border-bottom: 1px solid #8a9bb8; border-right: 1px solid #8a9bb8; border-left: 1px solid #8a9bb8; }
#HomeBox-tshirtindex .DataTable TH { padding: 0; border-bottom: 1px solid #8a9bb8; border-left: 1px solid #8a9bb8; }
#HomeBox-tshirtindex .DataTable H4 { font-size: 75%;}
#HomeBox-tshirtindex .DataTable H5 { font-size: 70%; font-weight: normal; }
#HomeBox-tshirtindex .DataTable P { font-weight: normal; }

#HomeBox-gallerycategory .DataTable { border-top: 1px solid #8a9bb8; }
#HomeBox-gallerycategory .DataTable TD { width: 150px; padding: 0; border-bottom: 1px solid #8a9bb8; border-right: 1px solid #8a9bb8; border-left: 1px solid #8a9bb8; }
#HomeBox-gallerycategory .DataTable TH { padding: 0; border-bottom: 1px solid #8a9bb8; border-left: 1px solid #8a9bb8; }


#HomeBox-bioindex .DataTable TD { padding: 0 0 2em 0; }
#HomeBox-bioindex H4 { font-size: 80%; }
#HomeBox-bioindex H5 { font-size: 70%; font-weight: normal; margin: 0 0 .3em 0; }

.BioDetail #HomeBox-information { margin: .5em 0 0 0; }
.BioDetail #HomeBox-information IMG { float: left; margin: 0 15px 0 0; }
.BioDetail #HomeBox-information H5 { margin: -.5em 0 1em 0; }



.ShopProducts #HomeBox-productindex { margin: .5em 0 0 0; }
.ShopProducts #HomeBox-productindex IMG { float: left; margin: 0 15px 0 0; }
.ShopProducts #HomeBox-productindex H5 { margin: -.5em 0 1em 0; }


.CouponIndex #CouponWrapper { width: 400px; margin: 0 auto 1em auto; text-align: center; border: 3px dashed #900; background: #fff; font-family: Helvetica, sans-serif; }
.CouponIndex #CouponWrapper SPAN { padding: 3px 0 0 15px; width: 150px; height: 18px; margin: .5em auto .5em auto; border-bottom: 1px solid #ccc; border-top: 1px solid #ccc; font-size: 70%; display: block; background: url(images/icon.printer.gif) 10px 0px no-repeat; }
.CouponIndex #CouponWrapper H3 { color: #666; font-size: 120%; margin: 1em 0 0 0; }
.CouponIndex #CouponWrapper H2 { color: #900; font-size: 250%; font-weight: bold; font-family: Verdana, sans-serif; }
.CouponIndex #CouponWrapper H4 { margin: 0 0 1em 0; }
.CouponIndex #CouponWrapper IMG { margin: 0 0 1em 0; }
.CouponIndex #CouponWrapper H5 { margin: 0 0 .5em 0; text-align: left; font-weight: normal; font-size: 9px; }
.CouponIndex #CouponWrapper H6 { margin: 0 0 1em 0; }


.ShopCertifications .Item IMG { float: left; margin: 0 15px 1em 0; }


/* -------------------------------------------------- END: PageCommon -- */




/* ------------------------------------------------ BEGIN: important classes -- 

.RichText P { font-size: 75%; }
.RichText P.Button A { color: #35465A; font-weight: bold; }
.RichText H2 { height: auto; padding: 0; margin: 0 0 .5em 0; color: #35465A; background: none; line-height: normal; font-size: 100%; border: none;  }
.RichText H3 { color: #35465A; font-size: 95%; margin: 0 0 .5em 0; }
.RichText H4 { color: #35465A; margin: 0 0 .5em 0; }
.RichText H5 { color: #35465A; margin: 0 0 .5em 0; }
.RichText H6 { color: #35465A; margin: 0 0 .5em 0; }
.RichText BLOCKQUOTE { color: #35465A; width: 150px; padding: 5px; font-size: 75%; font-style: italic; border: 1px solid #BEBEBE; }

.RichText DL { margin: 0 0 .5em 0; padding: 0; font-size: 75%; }
.RichText DT STRONG { margin: 0; padding: 0; color: #972324; }
.RichText DT { margin: 0; padding: 0; }
.RichText DD { margin: 0; padding: 0; }

.RichText UL { margin: 0 0 .5em 0; padding: 0 0 0 14px; font-size: 75%; }
.RichText OL { margin-bottom: .5em; padding: 0 0 0 24px; font-size: 75%; }
.RichText OL LI { margin-bottom: .5em; }





.PageCommon { }
.PageCommon #MainColumn { margin: 0; }
.PageCommon #MainColumn H2 { height: 33px; margin: 0 -15px 1em -15px; color: #3D4D69; text-align: center; line-height: 33px; font-size: 75%; font-weight: bold; border-top: 1px solid #BEBEBE; border-bottom: 1px solid #BEBEBE; background :url(./img/img.body.h3.bg.gif) 0px 0px repeat-x; }
.PageCommon #MainColumn .LayoutTable { height: 523px; padding: 0 15px 0 15px; border-bottom: 1px solid #BEBEBE; border-left: 1px solid #BEBEBE; border-right: 1px solid #BEBEBE; }
.PageCommon #MainColumn .LeftColCell { border-right: 1px solid #BEBEBE; }
.PageCommon #MainColumn H3 { padding: 0 5px 0 5px; color: #3D4D69; font-size: 80%; }
.PageCommon #MainColumn P { padding: 0 5px 0 5px; }
.PageCommon #MainColumn .Button A { font-weight: bold; color: #3D4D69; }
.PageCommon #MainColumn .FormTable TD { padding: 0 0 0 0; border: none; }
.PageCommon #MainColumn .FormTable INPUT,
.PageCommon #MainColumn .FormTable SELECT,
.PageCommon #MainColumn .FormTable TEXTAREA { margin: 0 0 .5em 0; width: 160px; border: 1px solid #b9b9b8; }
.PageCommon #MainColumn .FormTable TEXTAREA { height: 80px;  }
.PageCommon #MainColumn .FormTable LABEL { font-size: 70%; color: #37455D; }
.PageCommon #MainColumn .FormTable LABEL SPAN { font-size: 80%; }