/*
ISITE Design

http://codesnippets.joyent.com/tag/expressionengine


--------- Notes -----------

* html {anything} addresses IE < 6 browser bugs
*+html {anything} addresses IE 7 browser bugs

font-sizes are set in em for resizable goodness.  Here's a basic guide for the stylesheet.
font-size: 1em; = 12px

font-size: .75em; 	= 9px
font-size: 0.835em; = 10px
font-size: .9175em; = 11px
font-size: 1em; 	= 12px
font-size: 1.085em; = 13px
font-size: 1.165em; = 14px
font-size: 1.25em;  = 15px
font-size: 1.335em; = 16px

font-size: 1.585em; = 19px
font-size: 1.665em; = 20px

http://www.boyink.com/splaat/weblog/category/building-an-expressionengine-site/
http://www.eehowto.com/wiki/Related-Entries/
http://expressionengine.com/wiki/Tome_Module/

/* Basic browser reset  */
body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dd, dt, blockquote, button, fieldset, legend, label, input, textarea, form {
    margin: 0; padding: 0; border: 0;
}

html, input, textarea, select{font-size: 100%}/*keep ie happy*/
body {
	color: #464646;
	font: 75%/1.335em Georgia, "Palatino Linotype", "Times New Roman", times, serif;
}
h1, h2, h3, h4, h5, h6{ margin: .1em 0 .33375em 0;}

h1{font-size: 1.665em; color: #788d8e; text-transform: uppercase;}
h2{font-size: 170%;}
h3{font-size: 140%;}
h4{font-size: 120%;}
h5{font-size: 100%;}
h6{font-size: 90%; }

p, ul{
    margin-bottom: 1.335em;
}
#footer p {margin-bottom: .1em;}
ul, ol {margin: .1em 0 1.5em 1.5em;}
input, textarea {border: 1px solid #242323;}
table {border-collapse: collapse;}
td{ border: 1px solid #ccc; padding: 4px;  }

          /*
--=.._/(        Site Structure / Main Containers     )\_..=--
    	  */

html{
	background: #000 url(../img/css/bg_page.jpg) center top no-repeat ;
	}
body{
	background: transparent url(../img/css/bg_bottom_bar.jpg) center bottom no-repeat;
	padding-bottom: 15px;
	}
#wrapper {
	background: transparent url(../img/css/bg_wrapper_tile.gif) 0 0 repeat-y ;
	margin: auto;
	padding: 0 12px;
	position: relative;
    width: 959px;
}
#content{
	background: url(../img/css/bg_content_top.jpg) 0 0 no-repeat ;
	float: left;
	padding-top: 76px;
    width: 959px;
	}
#primary{
	background-color: #efeee9;
	float: left;
	overflow: hidden;
	padding: 0 25px;
	width: 719px;
	}
	* html #primary {
        width: 721px;
    }
.landing-page #primary{
	padding: 0 15px;
	width: 739px;
	}

#secondary {
	color: #231f20;
	float: left;
	padding: 0 15px;
	width: 160px;
	}
	* html #secondary{
		width: 162px;
        margin:0;
        padding: 0 0 0 10px;
    }


#header{
	background: transparent url(../img/css/bg_header.jpg) 0 0 no-repeat;
    height: 121px;
	}
#footer{
	background: transparent url(../img/css/bg_footer.jpg) 0 0 repeat;
    clear: both;
	color: #d1d3d4;
	padding: 20px 25px 15px 25px ;
	}

.landing-page #primary div.callout, .landing-page #primary #special-events, .landing-page #primary #upcoming, .landing-page #primary #main {
    float: left;
	width: 323px;
	padding: 15px 15px 4px 15px;
}
.landing-page #primary div.callout, .landing-page #primary div#special-events{
	clear: left;
    margin-right: 18px;
}
.landing-page #primary #special-events, .landing-page #primary #upcoming {
    border-top: 1px solid #bfbebb;
	margin-top: 30px;
	padding-top: 23px;
	padding-bottom: 30px;
}
* html .landing-page #primary #special-events{
    margin-right: 9px;

	clear: left;
}
* html .landing-page #primary #upcoming{
	float: right;
}
.landing-page #primary div.callout p{
    margin:0;
}



          /*
--=.._/(        Type, Links and Lists      )\_..=--
    	  */


a, a:visited {color: #717c50;}
a:hover { color: #495434}
#footer a, #secondary a {    color: #fff;}
#footer a:hover, #secondary a:hover {    color: #d7e2c6;}
#nav a, #nav a:active {  outline: none;}

a#brand{
	display: block;
	height: 100px;
	padding: 10px 0 0 10px;
	text-indent: -9999em;
	width: 140px;
	}
a.pdf{
    background: transparent url(../img/css/icon_pdf.gif) right center no-repeat;
	padding-right: 20px;

	}
a.more{
    background: transparent url(../img/css/icon_red_leaf.gif) right center no-repeat;
	padding:1px 20px 1px 0;
	width: auto;
	}

#footer ul  {display: block;	margin: 1.335em 0;}
#footer li{
	display: inline;
    list-style-type: none;
	}
	#footer li a {margin: 0 .3em 0 0;}
#footer li.copyright {
    font-size: .9175em;
	}
#secondary h2{
    font-size: 1.335em;
	margin-bottom: .33375emem;
	}
#secondary .main ul{
    margin-left: 14px;
	}


#secondary .main h2{
	background-position: 0 0;
	background-repeat: no-repeat;
	height: 23px;
	margin-left: 10px;
	width: 171px;
}


.gardenpage #secondary .main h2				{background-image: url(../img/css/title_garden.gif) ; text-indent: -9999em;}
.visitingpage #secondary .main h2			{background-image: url(../img/css/title_visiting.gif) ; text-indent: -9999em;}
.events_classespage #secondary .main h2		{background-image: url(../img/css/title_events.gif) ; text-indent: -9999em;}
.rentalpage #secondary .main h2				{background-image: url(../img/css/title_rental.gif) ; text-indent: -9999em;}
.members_partnerspage #secondary .main h2	{background-image: url(../img/css/title_members.gif) ; text-indent: -9999em; margin-left: 6px}
.learningpage #secondary .main h2			{background-image: url(../img/css/title_learning.gif) ; text-indent: -9999em;}
.giftshoppage #secondary .main h2			{background-image: url(../img/css/title_giftshop.gif) ; text-indent: -9999em;}
.about_uspage #secondary .main h2			{background-image: url(../img/css/title_aboutus.gif) ; text-indent: -9999em;}

.landing-page h1, .landing-page #primary h2{
	color: #788D8E;
	font-size: 1.25em;
	text-transform: uppercase;
	}
.landing-page #primary .callout{
	color: #717c50;
    font-size: 1.585em;
	line-height: 1.25em;
	}
.more_events_classespage #primary h2{
	border-bottom:1px solid #CCCCCC;
	clear: both;
	margin-top: 35px;
	padding-bottom: 2px;
	}
.more_events_classespage #primary h3{
	clear: both;
	font-size: 120%;
	margin-top: 15px;
	}

#primary img{
	border: 4px solid #d8d3c9;
	float: right;
	margin: 4px 0 1em 1em;
	}
    #primary img.left{
	float: left;
	margin: 4px 1em 1em 0;
	}
#secondary img{
    border: 4px solid #7d857b;
	/*margin-bottom: 1.335em;*/
	}
.product-image, .giftshoppage .giftshopwrap #primary img {
    float: right;
	margin: -2em 0 1em 1em;
	}
	.giftshoppage .giftshopwrap #primary h2, .giftshoppage .giftshopwrap #primary h3 {
		border-top:1px solid #CCCCCC;
		clear:both;
		margin-top:2em;
		padding-top:1em;
    }
	.giftshoppage .giftshopwrap h1	{margin-bottom: -15px; }
	* html .interior h1			{margin-bottom: 0.33375em;}


.landing-page #primary div img{
    float: right;
	margin-left: 1em;
	}
#primary #leader-image, #primary #leader img {
    border: none;
	}
	* html #primary #leader-image, #primary #leader img {    margin-left: 0;	}
#chinese-nav{
	background: transparent url(../img/css/chinese-language.gif) 0 0 no-repeat  ;
	display: block;
	height: 20px;
	float: right;
	margin-top: -3em;
	text-indent: -9999em;
	width: 50px;
	}

          /*
--=.._/(        Navigation      )\_..=--
    	  */

#nav ul{
    list-style-type: none;
    margin:0;
    padding:0;
	}
#nav{
	left: 209px;
    float: left;
	position: absolute;
	top:41px;
	}
#nav ul li{
	color: #fff;
    display: block;
	float: left;
	position: relative;
	text-decoration: none;
	width: auto;
	}
#nav a {
	background-image: url(../img/css/nav.jpg);
	display: block;
    height: 70px;
	overflow: hidden;
	text-indent: -9999em;
	}
#nav .home-nav 				{ background-position: 0px 0px; width: 50px}
#nav .garden-nav 			{ background-position: -50px 0px; width: 99px}
#nav .visiting-nav 			{ background-position: -149px 0px; width: 72px}
#nav .events_classes-nav 	{ background-position: -221px 0px; width: 66px}
#nav .rental-nav 			{ background-position: -287px 0px; width: 65px}
#nav .members_partners-nav 	{ background-position: -353px 0px; width: 82px}
#nav .learning-nav 			{ background-position: -435px 0px; width: 81px}
#nav .giftshop-nav 			{ background-position: -516px 0px; width: 110px}
#nav .about_us-nav 			{ background-position: -626px 0px; width: 74px}

#nav .home-nav:hover 				{ background-position:    0px -70px; }
#nav .garden-nav:hover 				{ background-position:  -50px -70px; }
#nav .visiting-nav:hover 			{ background-position: -149px -70px; }
#nav .events_classes-nav:hover 		{ background-position: -221px -70px; }
#nav .rental-nav:hover 				{ background-position: -287px -70px; }
#nav .members_partners-nav:hover 	{ background-position: -353px -70px; }
#nav .learning-nav:hover 			{ background-position: -435px -70px; }
#nav .giftshop-nav:hover 			{ background-position: -516px -70px; }
#nav .about_us-nav:hover 			{ background-position: -626px -70px; }

.homepage #nav .home-nav, #nav .on .home-nav 										{background-position:    0px -140px;}
.gardenpage #nav .garden-nav, #nav .on a.garden-nav 								{background-position:  -50px -140px;}
.visitingpage #nav .visiting-nav, #nav .on a.visiting-nav							{background-position: -149px -140px;}
.events_classespage #nav .events_classes-nav, #nav .on a.events_classespage-nav 	{background-position: -221px -140px;}
.rentalpage #nav .rental-nav, #nav .on a.rental-nav									{background-position: -287px -140px;}
.members_partnerspage #nav .members_partners-nav, #nav .on a.members_partners-nav 	{background-position: -353px -140px;}
.learningpage #nav .learning-nav, #nav .on a.learning-nav 							{background-position: -435px -140px;}
.giftshoppage #nav .giftshop-nav, #nav .on a.giftshop-nav 							{background-position: -516px -140px;}
.about_uspage #nav .about_us-nav, #nav .on a.about_us-nav 							{background-position: -626px -140px;}

#nav .pages-nav {display: none;}

#nav ul ul{
	background: #000;
    position: absolute;
	left: -9999em;
	top: 70px;
	width: 151px;
    margin:0;
    padding:0;
	}
#nav ul li.over ul {
    left: 0;
	}
#nav ul ul li, #nav ul ul li a {
    float: none;
	}
#nav ul ul li a {
	background-image: none;
    border-bottom: 1px solid #333;
	color: #fff;
	height: auto;
	line-height: 32px;
	padding-left: 9px;
	text-indent: 0;
	text-decoration: none;
	width: 142px;

	}
#nav ul ul a:hover{
	background: #454340 url(../img/css/bg_subnav_over.jpg) 0 0 no-repeat ;
	}
#nav ul ul a.china_links_for_students-nav{
    letter-spacing: -.02em;
}



#secondary .main{
    background: #737D67 url(../img/css/bg_sidebar_dark_bottom.gif) left bottom repeat-x	;
	margin: -1px 0 1.335em -13px;
	padding: 1px 0 15px 6px;
	width: 182px;
	}
	* html #secondary .main{
		margin-left: -10px;
	}
	* html .landing-page #secondary .main{
		margin-left: -8px;
	}

.homepage #secondary .main, .stand-alone-page #secondary .main{
	margin-top: -9px;
	padding-bottom: 5px;
	}
.homepage #secondary .main h3,  .stand-alone-page #secondary .main h3{position: absolute; left: -9999em;}	
.homepage #secondary .main p, .stand-alone-page #secondary .main p{
	background: transparent url(../img/css/address_sidebar.gif) left top no-repeat;
	height: 70px;
	margin-left: 10px;
	text-indent: -9999em;
	width: 142px;
	}
* html .homepage #secondary .main p{
	background: transparent url(../img/css/address_sidebar.gif) left bottom no-repeat;
	height: 77px;

	}
#secondary .main li{
    list-style-type: none;
	}
#secondary .main a{
	line-height:1.66875em;
	}


          /*
--=.._/(        Forms      )\_..=--
    	  */

form ul{
    list-style-type: none; margin: 0;
	}
form li{
    margin-bottom: 1em;
	}
input, select, textarea, label, button {
    display: block;
	}
button{
    cursor: pointer;
	}
#paypal-form{
    margin-bottom: 1em;
}

#paypal-form br{
    display: none;
}

input[type=hidden]{
    border: none;
}


          /*
--=.._/(        Bits      )\_..=--
    	  */




#secondary .callout{
	background: transparent url(../img/css/bg_callout_border.gif) center top no-repeat ;
	margin-bottom: 1em;
	padding: 1em 0;

}
div.product{
    margin-bottom: 5em;
}

#gallery {
	margin: 2em 0;
	padding: 0;
}
#gallery h3{
    font-size: 100%;
}

#gallery li{
	list-style-type: none;
	display: block;
	float: left;
	margin: 0 12px 30px 13px;
	padding: 0;
	width: 211px;
}
#gallery li img {float: left; margin:0;}
.gallery_caption {float: left; width: 500px;}

.caption{
	clear: right;
    color: #999;
	font: .8em  Helvetica, Arial, sans-serif  ;
    float: right;
	margin: -.8em 0 1em 1em;
	padding: 0 4px;

}
.alert {
    background-color: #802828;
	border: 2px solid #fff;
	margin-bottom: 1em;
	padding: 10px 10px 0 10px;
	text-align: center;
}
.alert * {
    color: #fff;
}



/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox specific link and font settings <<<------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_window {
  font: 12px Arial, Helvetica, sans-serif;
  color: #333333;
}
#TB_secondLine {
  font: 10px Arial, Helvetica, sans-serif;
  color:#666666;
}
#TB_window a:link {color: #666666;}
#TB_window a:visited {color: #666666;}
#TB_window a:hover {color: #000;}
#TB_window a:active {color: #666666;}
#TB_window a:focus{color: #666666;}
/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------->>> thickbox settings <<<-----------------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/
#TB_overlay {
	position: fixed;
	z-index:100;
	top: 0px;
	left: 0px;
	height:100%;
	width:100%;
	}
.TB_overlayMacFFBGHack {background: url(macFFBgHack.png) repeat;}
.TB_overlayBG {
	background-color:#000;
	filter:alpha(opacity=75);
	-moz-opacity: 0.75;
	opacity: 0.75;
	}
* html #TB_overlay { /* ie6 hack */
     position: absolute;
     height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
	}
#TB_window {
	position: fixed;
	background: #ffffff;
	z-index: 102;
	color:#000000;
	display:none;
	border: 4px solid #525252;
	text-align:left;
	top:50%;
	left:50%;
	}
	* html #TB_window { /* ie6 hack */
		position: absolute;
		margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
		}
#TB_window img#TB_Image {
	display:block;
	margin: 15px 0 0 15px;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #666;
	border-left: 1px solid #666;
	}
#TB_caption{
	height:25px;
	padding:7px 30px 10px 25px;
	float:left;
	}
#TB_closeWindow{
	height:25px;
	padding:11px 25px 10px 0;
	float:right;
	}
#TB_closeAjaxWindow{
	padding:7px 10px 5px 0;
	margin-bottom:1px;
	text-align:right;
	float:right;
	}
#TB_ajaxWindowTitle{
	float:left;
	padding:7px 0 5px 10px;
	margin-bottom:1px;
	}
#TB_title{
	background-color:#e8e8e8;
	height:27px;
	}
#TB_ajaxContent{
	clear:both;
	padding:2px 15px 15px 15px;
	overflow:auto;
	text-align:left;
	line-height:1.4em;
	}
#TB_ajaxContent.TB_modal{
	padding:15px;
	}
#TB_ajaxContent p{
	padding:5px 0px 5px 0px;
	}
#TB_load{
	position: fixed;
	display:none;
	height:13px;
	width:208px;
	z-index:103;
	top: 50%;
	left: 50%;
	margin: -6px 0 0 -104px; /* -height/2 0 0 -width/2 */
	}
* html #TB_load { /* ie6 hack */
	position: absolute;
	margin-top: expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + 'px');
	}
#TB_HideSelect{
	z-index:99;
	position:fixed;
	top: 0;
	left: 0;
	background-color:#fff;
	border:none;
	filter:alpha(opacity=0);
	-moz-opacity: 0;
	opacity: 0;
	height:100%;
	width:100%;
	}
* html #TB_HideSelect { /* ie6 hack */
	position: absolute;
	height: expression(document.body.scrollHeight > document.body.offsetHeight ? document.body.scrollHeight : document.body.offsetHeight + 'px');
	}
#TB_iframeContent{
	clear:both;
	border:none;
	margin-bottom:-1px;
	margin-top:1px;
	_margin-bottom:1px;
	}


          /*
--=.._/(        Randoms/dev utility styles      )\_..=--
    	  */


.accessibility{height: 0; left: -9999em;  line-height: 0; position: absolute; text-indent: -9999em; }
.column{
    float: left;
	width: 45%;
	margin-right: 2%;
}
ul.nav {list-style-type: none; margin:0;}



.hide {display: none;}
.left {float: left; margin: 10px 5px 10px 0;}
* html .left {margin-right: 0;}
.right {float: right;}
.clear {clear: both;}
.clearleft {clear: left;}
.clearright {clear: right;}
.error, .red {color: red;}

.small {width: 25%;}
.medium {width: 48%;}
.large {width: 90%;}


