/* @override http://www.texturestogo.com/css/base.css */

@charset "UTF-8";
body  {
	font: 100% Arial, Helvetica, sans-serif;
	background: #FFFFFF;
	margin: 0; /*global reset*/
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color:#333;
}
#highlightMask{
	/*used to mask the whole screen when download buttons clicked*/
}
#mask {
  position:absolute;
  left:0;
  top:0;
  z-index:9000;
  display:none;
  /* used by js in preview to flash screen red when login errors*/
}

.fillScreenRed{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:2000px;
	z-index:5000;
    background-color:red;
}
.fillScreenGreen{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:2000px;
	z-index:5000;
    background-color:green;
}

.columns #container { 
	width: 100%;  /* main container div */
	background: #FFFFFF;
	margin: 0 auto; /* centre */
	border: 1px solid silver;
	text-align: left; /* this overrides the text-align: centre on the body element. */
} 
#header { 
	background-image:url(/css/css_images/header_background.gif);
	background-repeat:repeat-x;
	padding: 0 10px;  /* this padding matches the left alignment of the elements in the divs that appear beneath it */

} 

.columns #container #header h1 {
	color: green;
	margin: 0;  /*prevent margin collapse */
	padding: 4px 0 10px 0; /* from edge */
	font-style:italic;
	font-family: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
}

/* check % widths, change to px is necessary
*/
.columns #treeDiv {
	float: left; 
	width: 210px; /* floated, a width needed */
	/*background: silver;  the background color will be displayed for the length of the content in the column, but no further, a transparent gif is added as the first item in the div, floated left, this sets the minimum height of the div */
	padding: 3px 0; /* repeats  */
	/*border:thin solid #000;*/
}
.columns #treeDiv p , .columns #treeDiv h3{
	margin-left: 10px; /* the left and right margin should be given to every element that will be placed in the side columns */
	margin-right: 10px;
	margin-top: 0px;
	margin-bottom:3px;
}
.columns #treeDiv h3{
	/* heading that appears above tree */
	color: green;
	font-size:0.8em;
	font-style:italic;
	font-weight:normal;
}
.columns #treeDiv p{
	color:#333;
	font-size:11px;
}

/* Tips for mainDiv:
1. the space between the mainDiv and treeDiv is created with the left margin on the mainDiv div.  No matter how much content the treeDiv div contains, the column space will remain. You can remove this left margin if you want the #mainDiv div's text to fill the #treeDiv space when the content in #treeDiv ends.
2. to avoid float drop at a supported minimum 800 x 600 resolution, elements within the mainDiv div should be 430px or smaller (this includes images).
3. in the Internet Explorer Conditional Comment below, the zoom property is used to give the mainDiv "hasLayout." This avoids several IE-specific bugs.
*/
.columns #mainDiv { 
	margin: 0 210px 0 230px; /* the right margin can be given in percentages or pixels. It creates the space down the right side of the page. */
	font-family: Arial, Helvetica, sans-serif;
	min-height:600px;
} 
/* Headings and text styles for mainDiv */
#mainDiv h1, #mainDiv h2, #mainDiv h3 {
	color:green;
	margin-top:0;
}
#mainDiv h1{
	font-size:1.2em;
	margin-top:2px;
	margin-bottom:0.5em;
}
#mainDiv h2{
	font-size:1.1em;
	margin-bottom:0.9em;
}
#mainDiv h3{
	font-size:1em;
	margin-bottom:0.8em;
}
#mainDiv p{
	font-size:0.8em;
	margin-top:0;
	margin-bottom:0.8em;
	color:#333;
}
/*#mainDiv ul, #mainDiv ul li{
	font-size: 0.8em;
}*/
#mainDiv p.descriptionClass{
	color:#666;
}
#mainDiv ul#p-thumbs, #mainDiv ul#A-thumbs{ 
list-style-type: none;
margin: 0;
padding: 0;
}
#mainDiv ul#A-thumbs li {
	margin: 3px 3px 3px 0;
	padding: 1px;
	float: left;
	width: 120px;
	height: 120px;
	font-size: 1em;
	color:green;
	border:thin solid #CFC;
}
#mainDiv ul#p-thumbs, #mainDiv ul#A-thumbs{ 
list-style-type: none;
margin: 0;
padding: 0;
}
#mainDiv ul#p-thumbs li {
	margin: 3px 3px 3px 0;
	padding: 1px;
	float: left;
	width: 180px;
	height: 180px;
	font-size: 1em;
	color:green;
	border:thin solid #CFC;
}

#mainDiv ul {
	list-style-type:none;
	font-size:0.8em;
	color:#333;
	margin: 0 0 2px 0;
}
#mainDiv ul li {
	margin-top:0;
	margin-bottom:0.8em;
}
/* no border on linked images */
#mainDiv ul li img{ 
border:0;
}

/* end of text styles for RHS column */

.columns #footer { 
	padding: 0 10px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	background:#CFC;
} 
.columns #footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 5px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
	text-align:center;
	font-size:10px;
	color:green;
	font-family:Arial, Helvetica, sans-serif;
}
.columns #footer p.footer-keywords {
	text-align:left;
}

/* Miscellaneous classes for reuse */
.floatRight { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.floatLeft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
	
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}
/*  new navigation bar */
.columns #navigation { 
	height: 30px;
	width:100%;
	margin-top: 0;
	margin-bottom: 0;
	margin-left: auto;
	margin-right: auto;
	/*background-color:#e9c6b0;*/

} 
.columns #navigation ul, .columns #navigation li{
margin: 0;
padding: 0;
display:inline;
list-style-type: none;
background-color:#CCC;
text-decoration:none;
}
.columns #navigation  a:link, .columns #navigation  a:visited
{
float: left;
line-height: 14px;
margin: 0 10px 6px 10px;
font-size: 1.2em/*85%*/;
text-decoration: none;
font-weight:bold;
color: blue;
padding-top: 7px;
padding-bottom: 6px;
background-color: #FFFFFF;

}

.columns #navigation a:link#current, .columns #navigation a:visited#current, .columns #navigation a:hover
{
border-top: 3px solid #FF0000;
border-bottom: 3px solid #FF0000;
padding-top: 4px;
padding-bottom: 4px;
background: white;
color: red;
font-weight:bold;
text-decoration:none;
}

.columns #navigation a:hover { 
	color: #FF0000; }
.clearLeft{
	clear:left;
}
div#rhsDiv {
	float:right;
	width:190px;
	margin-left:5px;
	padding-left:5px;
	padding-right:10px;
/*	background-image:url(/images_other/tree_height.gif);
*/	background-position:right;
	/*border-left:1px solid grey;*/
	font-family: Arial, Helvetica, sans-serif;
}
/* Headings and text styles for RHS column */
#rhsDiv h1, #rhsDiv h2, #rhsDiv h3 {
	color:green;
	margin-top:0;
}
#rhsDiv h1{
	font-size:1.2em;
	margin-bottom:1em;
}
#rhsDiv h2{
	font-size:1.1em;
	margin-bottom:0.9em;
}
#rhsDiv h3{
	font-size:1em;
	margin-bottom:0.4em;
}
#rhsDiv p{
	font-size:0.8em;
	margin-top:0;
	margin-bottom:0.8em;
	color:#333;
}
#rhsDiv ul{
	list-style-type: none;
	margin-left: 0em;
	padding: 0;
}
/* next line is a css trick, it causes the browser to pre-load the hover image so the user will not have a delay */
#rhsDiv ul li a { background: url(/css/css_images/sign_background_hover.gif); }

#rhsDiv ul li a:link, #rhsDiv ul li a:visited{
	display: inline-table;
	height: 40px;
	width: 115px;
	background-image:url(/css/css_images/sign_background.gif);
	background-repeat: no-repeat;
	margin-top: 0;
	padding-left: 0.4em;
	padding-top: 0.4em;
	color:#000;
	text-decoration:none;
}
#rhsDiv ul li a:link, #rhsDiv ul li a:visited{
	display: inline-table;
	height: 40px;
	width: 115px;
	background-image:url(/css/css_images/sign_background.gif);
	background-repeat: no-repeat;
	margin-top: 0;
	padding-left: 0.4em;
	padding-top: 0.4em;
	color:#000;
	text-decoration:none;
}
#rhsDiv ul li a:link#current, #rhsDiv ul li a:visited#current, #rhsDiv ul li a:hover{
	display: inline-table;
	height: 40px;
	width: 115px;
	background-image:url(/css/css_images/sign_background_hover.gif);
	background-repeat: no-repeat;
	margin-top: 0;
	padding-left: 0.4em;
	padding-top: 0.4em;
	color:red;
}

#rhsDiv .rhs a{
	font-size:0.8em;
	text-decoration:none;
	font-weight:normal;
	color:blue;
}
#rhsDiv .rhs a:hover{
	color:blue;
}
#rhsMessage {
	font-size:0.8em;
	text-decoration:none;
	font-weight:normal;
}
#rhsMessage a{
	font-size:0.8em;
	text-decoration:none;
	font-weight:normal;
	color:blue;
}
#rhsDiv #tally h3, #rhsDiv #tally-2 h3, #tally-1 {
	color:green;
	font-size:0.7em;
	font-style:italic;
	font-weight:normal;
	margin:0;
}
#rhsDiv #tally h4, #rhsDiv #tally-2 h4, #tally-1 h4{
	color:green;
	font-size:0.7em;
	font-style:italic;
    font-weight:bold;
    margin:0;
}
#rhsDiv #tally p, #rhsDiv #tally-2 p, #tally-1 p{
	font-size:0.6em;
	margin:0;
}
#rhsDiv #subscribe {
	margin:1em 1em 1em 0;
	padding:0.8em;
	border:thin green solid;
}
#rhsDiv #subscribe p{
	font-size:0.6em;
	margin:0;
}
#offer {
	border:solid thin red;
	padding:3px;
	margin-bottom:4px;
}
#rhsDiv #subscribe #offer h3{
	color:red;
	font-size:0.7em;
}
/* end of text styles for RHS column */
.noTopMargin {
	margin-top:0;
}
/* links */
a {
	text-decoration:none;
	font-weight:bold;
	color:green;
}
a:hover {
	color:blue;
}
a:visited {
	color:blue;
}
/* ul at bottome of thumbnail page, for links to additional pages  */
.paging {
	display: inline-block;
	
	/*clear:left;*/
	text-align: center;
	width:100%; /* prevents floating to right of thumbnails */
	
}
.paging ul.pages_ul {
	list-style-type: none;
	height:36px;
	margin-left:200px;
}
.paging ul.pages_ul li {
	display:block;
	
    padding-top: 11px; /* adjust vertical spacing to align text on baseline */
	margin: 4px 8px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	float:left;
}
.paging ul.pages_ul li.larger {
	font-size: 24px;
	padding-top: 0;
}
.preview-div{
	position:relative;
}
.image-preview{
	z-index:1000;
	position:absolute;
	top:0;
	left:0;
}
.image-closeup{
	z-index:2000;
	position:absolute;
	/*top:100;
	left:100;*/
	display:none;
}
#mainDiv p.keywords{
	margin-top:420px;
	color:#666;
	font-size:11px;
}
#mainDiv #dl-buttons {
	/*border:thin green dashed;*/
	width:400px;
}
.downloadButton{
	background-image:url(/images_other/free_download.png);
	width:120px;
	height:77px;
	border:none;
}
.downloadGreyed{
	background-image:url(/images_other/free_greyed.png);
	width:120px;
	height:77px;
	border:none;
}
.subs-button{
	background-image:url(/images_other/subscriber_download.png);
	width:120px;
	height:77px;
	border:none;
}
.subs-greyed{
	background-image:url(/images_other/subscriber_download_greyed.png);
	width:120px;
	height:77px;
	border:none;
}
.noShow{
	display:none;
}
.showInline{
	display: inline;
}
.noShow2{
	display:block;
	height:1px;
	overflow:hidden;
	margin-left:9000px;
}
#dl-buttons p.image-size-string{
	/* relative positioning to drop image size onto button */
	font-family:Arial, Helvetica, sans-serif;
	font-size:0.5em;
	font-stretch:condensed;
	color:#990000;
	/*z-index:100;*/
	display:block;
	width:80px;
	position:relative;
	top:70px;
	left:160px;
}
#dl-buttons a img{
	border:none;
}
#recentAdditions{
float:left;

}
#recentAdditions ul#recent li {
	margin: 3px 3px 3px 0;
	padding: 2px;
	
	
border: thin solid green;
}
#recentAdditions ul#recent li a{
	/*background-image:none;*/

}
#recentAdditions ul#recent li a{
	background-image:none;

}
#recentAdditions ul#recent li img{
border:none;
}
#recentAdditions p{
	font-size:0.65em;
	margin-bottom:-6px;
	color:green;
	font-style:italic;
	font-weight:bold;
	
}
#recentAdditions p.caption{
	font-weight:normal;
	font-style:normal;
}
#recentAdditions p.keyword-snippet{
	font-weight:normal;
	font-style:normal;
}
#recentAdditions ul li p{
color:green;
font-size:0.65em;
text-align:center;
margin-bottom:0;
}
.visibleButton{
	display:inline;
}
.hiddenButton{
	display:none;
}
.columns #container #mainDiv #faqs p.question{
	color: green;
	font-weight: bold;
	font-size: 0.8em;
	font-style: italic;
	margin: 0;
	
}
.columns #container #mainDiv #faqs p.answer{
	color: #666;

	font-size: 0.8em;
	font-style: italic;
	
}
.columns #container #mainDiv #sitemap ul li.sitemapLi{
	margin:0;
	font-size:0.8em
}
.columns #container #mainDiv #sitemap ul li.sitemapHeading{
	margin:0;
	font-size:1.2em;
	font-weight:bold;
	color:#000000;
/*border:solid thin red;*/
}
.columns #container #mainDiv #sitemap ul li.sitemapHeading ul li{
	margin:0;
	font-size:0.8em;
/*border:solid thin blue;*/
}
.columns #container #mainDiv #sitemap ul li.sitemapHeading ul p.sitemapDescription{
	margin:1px 0 0 0;
	color:#000;
    font-weight:normal;
}
.columns #container #mainDiv #sitemap ul li.sitemapHeading  ul p.sitemapKeywords{
	margin:1px 0 0 0;
	color:#333;
    font-weight:normal;
}
.loginInner label{
	font-size:0.8em;
	text-align:right;
}
#username.textinput,#password.textinput{
	width: 10em;
}
#swivel-login, #swivel-register, #swivel-feedback{
	display:block;
	margin: 2px 0 2px 2px;
	width:100%;
	/*border:thin red solid;*/
}
#swivel-login ul.closed li, #swivel-register ul.closed li, #swivel-feedback ul.closed li{
	color: green;
	font-weight: bold;
	list-style:url(/css/css_images/swivel_closed.png);
}
#swivel-login ul.open li, #swivel-register ul.open li, #swivel-feedback ul.open li{
	color: green;
	font-weight: bold;
	list-style:url(/css/css_images/swivel_open.png);
}
#feedbackForm{padding:10px; border:solid gray 2px; background-color:#CCFFCC;}
#swivel-feedback.bold-red{
	font-size:16px;
	font-weight:bold;
	color:red;
}
/* @group image results */

.searchinput {
	margin-left: 8px;
	margin-bottom: 4px;
}

button.search-button {
margin-left: 8px;
}

.largeThumbnails {
	width: 180px;
	float: left;
	margin:4px
}
.smallThumbnails {
	width: 120px;
	float: left;
	margin:4px
}

.columns #container #treeDiv #searchBox p{
	color:green;
}

/* @end */

/* @group homepage thumbnails */
ul.homepageThumbnails{
	/* outer ul */
}
#mainDiv ul{
	padding: 0;
	}
#mainDiv ul.homepageThumbnails li{
	float: left;
	margin: 1px 2px 1px 2px;
	padding: 0;
	border: blue solid  1px;
	width: 132px;
	height: 153px;
}
#mainDiv ul.homepageThumbnails li p{
	color: green;
	text-align: center;
	font-size: 12px;
	margin-top: 4px;
}


/* @end */