/*	--------------------------------------------------------------------------------
	CSS resources:
		http://www.csszengarden.com
		http://www.positioniseverything.net/
		http://bluerobot.com
		http://www.sitepoint.com/article/1213
			http://www.cross-browser.com/x/ 
		http://dhtmlkitchen.com/css/
	--------------------------------------------------------------------------------
*/

/*	--------------------------------------------------------------------------------
	--------------------------------------------------------------------------------
*/
html {
/*	IE only
*/
	scrollbar-base-color: #FFCC99;
	scrollbar-arrow-color: red;
}

body {
	background: #FFCC99;
	color: Red;
	font-size: 0.7em;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
}

/*	--------------------------------------------------------------------------------
	Headers
	--------------------------------------------------------------------------------
*/
h4 {
/*	H4 is used for generic RARE header
*/
 	position: relative; /* IE sometimes loses background color if omitted */
	background-color: #ccffcc; 
	color: #330033; 
	font-size: 100%;
	font-weight: normal;
	text-align: center;
	margin-top: 0px;
	margin-bottom: 0.5em;
	padding: 1px 4px 2px 4px;
}
h5 { 
/*	H5 is used for generic RARE SUB-header
*/
/*	background-color: #ffff99; */
	background-color: #e5ffcc; 
	color: #000066; 
	text-align: center;
	font-size: 100%;
	font-weight: normal;
	margin-top: 0px;
	margin-bottom: 0.5em;
	padding: 1px 4px 2px 4px;
}

/*	--------------------------------------------------------------------------------
	Anchors
	--------------------------------------------------------------------------------
*/
/* ---
	Basic anchor
*/
a {
	background-color: transparent;
	color: #000033;
	cursor: hand;	
}
a:link, 
a:visited {
	text-decoration: underline;
}
a:hover, 
a:focus, 
a:active {
	text-decoration: none;
}

/* ---
	Double Colon (dc, ::) anchor
*/
div.dcAnchor a {
	background-color: transparent;
	color: red;
	cursor: hand;	
}
div.dcAnchor a:link, 
div.dcAnchor a:visited {
	text-decoration: none;
}
div.dcAnchor a:hover, 
div.dcAnchor a:focus, 
div.dcAnchor a:active {
	text-decoration: underline;
}


.vLinks ul{
	list-style-type: none;
	list-style-image: none;
	margin-top: 0px;
	margin-bottom: 0.7em;
}

.contentTop { 
/*	used for a link back to the top of the page 
*/
	font-size: 90%;
	text-align: right;
}

/*	--------------------------------------------------------------------------------
  Full redefinition of a <form /> and its form- components.
  Includes a number of custom classes for form-components.
	--------------------------------------------------------------------------------
*/
form {
	display: block;
	background-color: #FFFF99; /* light yellow */
	border: 1px dashed;
	margin: 2px 0px 0px 0px;
	padding: 2px 2px 2px 2px;
}

input,
.text {
	border : 1px outset #FFCCCC;
	color : Red;
	font-size : 100%; 
}
.radio {
	border : none;
}
.checkbox {
	border : none;
}
.button {
	background-color: #990000; /* darker red (brownish)*/ 
	border : 1px outset;
	color: #FFFF66;  /* darker yellow */
	font-size : 100%; /* should equal < body /> size */
	cursor: hand;	
}
select {
	border : 1px solid #99CC33;
	color : Red;
	font-size : 100%; /* should equal < body /> size */
}
textarea  {
	border : 1px solid #FFCCCC;
	color : Red;
	font-size : 100%; /* should equal < body /> size */
}

/*	--------------------------------------------------------------------------------
	--------------------------------------------------------------------------------
*/
/* definition data (from definition list) */
dd {
	margin-bottom: 0.7em;
}

.list_in_p {
	margin-top: 0px;
	padding-top: 0px;
}

/*	--------------------------------------------------------------------------------
	Tab Control
	--------------------------------------------------------------------------------
*/
/* Container */
div.tabCtrl
{
	padding: 8px;
/*	background-color: gray;	*/
}
/* Generic styles */
div.tabCtrl div.hide { display: none; }
div.tabCtrl div.show { display: block; }
/* tabs */
div.tabCtrl ul.tabs 
{
	list-style-type: none;
	padding-left: 0px;
	margin-top: 0px;
	margin-left: 0px;	
	margin-bottom: 0px;
}
div.tabCtrl ul.tabs li 
{
	display: inline;
	padding-left: 4px;
	padding-right: 4px;
	background-color: White;
	border: 1px solid Red;
	margin-right: 4px;
}
div.tabCtrl ul.tabs li.hover
{
	background-color: #CCFFCC; /* greenisch */ 
	cursor: pointer;
}
div.tabCtrl ul.tabs li.selected
{
	background-color: #CCFFCC; /* greenisch */ 
	border-bottom-color: #CCFFCC; /* greenisch */ 
}
/* tab content */
div.tabCtrl div.tabsContent 
{
	clear: both;	
	padding: 4px;
	background-color: #CCFFCC; /* greenisch */
	border: 1px solid;
}
div.tabCtrl div.tabsContent div.show
{
	background-color: White;
	border: 1px inset;
}

/*	--------------------------------------------------------------------------------
	--------------------------------------------------------------------------------
*/

.left {
	text-align: left;
}
.right {
	text-align: right;
}
.center {
	text-align: center;
}

.large {
	font-size: 120%;
}

.small {
	font-size: 80%;
}
.x-small {
	font-size: 70%;
}

.remark, 
.finePrint {
	font-size : 90%;	
}

.mandatory {
	background-color: transparent;
	color: red;
	font-weight: bold;
}

/*	----------------------------------------
*/
.imageLeft {
	float: left;
	margin-right: 4px;
}
.imageRight {
	float: right;
	margin-left: 4px;
}


/*	--------------------------------------------------------------------------------
	Generic 2 column design
	--------------------------------------------------------------------------------
*/
.cols {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width: 99%;
	padding: 2px 2px 2px 2px;
}
.cols70 {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width: 69%;
	padding: 2px 2px 2px 2px;
}
.col1{
	position: relative;
	float: left;
	top: 0px;
	width: 49%;
}
.col2 {
	position: relative;
	float: right;
	top: 0px;
	width: 49%;
}

/*	--------------------------------------------------------------------------------
	Special index page styles
	--------------------------------------------------------------------------------
*/
/* 
	went for the easy way out... a table!!! 
*/
#news {
	margin-left: auto;
	margin-right: auto; 
	width: 400px;
	height: 400px;
	overflow: auto;
	text-align: left;
	border: 1px outset white;
	background-color: #fffaf0; /* Floral White */ 
	padding: 0.2em 0.2em 0.2em 0.2em;	
}
#news dl { /* defintion list */
	margin-top: 0px;
}
#news dt { /* definition list title*/
	font-variant: small-caps;
	font-style: italic;
}
#news dd { /* definition list data */
	margin-left: 1em;
	margin-bottom: 0.7em;
}

/*	--------------------------------------------------------------------------------
	General sections definiton
	--------------------------------------------------------------------------------
*/
#header,
#breadcrumbs,
#content,
#footer {
	position: relative;
	background: #ffffcc;
	color: Red;
	border: 1px solid #ffcccc;
	padding: 0.3em 0.3em 0.3em 0.3em;
	margin-bottom: 0.7em;
}

.spacer {
	clear: both;
}

/*	--------------------------------------------------------------------------------
	Header
	--------------------------------------------------------------------------------
*/
#header #logo {
	position: relative;
	background-image: url(../images/rare_header.png);
	width: 300px;
	height: 65px;
}

#header #supportMenu {
	position: absolute; /* is relative to the containing "box" */
	top: 0.7em;
	right: 0.7em;
	text-align: left;
}

#header #menu {
	margin-top: 0.7em;
	text-align: center;
}

/*	--------------------------------------------------------------------------------
	BreadCrumbs
	--------------------------------------------------------------------------------
*/
#breadcrumbs {
	text-align: right;
}

/*	--------------------------------------------------------------------------------
	Page
	--------------------------------------------------------------------------------
*/
#content {
}
#content p {
	padding: 0px 0px 0.7em 0.7em;	
	margin-top: 0px;
	margin-bottom: 0px;
}


/*	----------
	Page main
	---------
*/
.tblContent {
	position: relative;
	width: 100%;	
}
.tdLeftColumn {
	position: relative;
	width: 150px;
}
.tdRightColumn {
	position: relative;
	width: 150px;
}
.tdMiddleColumn {
	position: relative;
	width: 100%;
}

div#main {
	top: 0.7em;
	left: 0px;
	margin-bottom: 0.7em;
}

div#main p {
	position: relative;
	margin-top: 0px;
	margin-bottom: 0px;
	padding: 0px 0px 0.7em 0.7em;	
}
/*	----------
	----------
*/
.section,
#whatsnew  {
	border: 1px solid #ffcccc;	
	padding: 2px 4px 2px 4px;
	margin-bottom: 0.7em;
}
.section ul {
	list-style-type: none;
	list-style-image: none;
	margin: 0px 2px 0px 0px;
	padding: 0px 0px 0.7em 0.7em;
}
.section p {
	margin-top: 0px;
	margin-bottom: 0px;
	padding: 0px 0px 0.7em 0.7em;
}


/*	----------
	Page photo
	----------
*/
#content_photo {
	
}
#content_explanation {
	text-align: center;
}

/*	--------------------------------------------------------------------------------
	Footer
	--------------------------------------------------------------------------------
*/
#footer,
#belowFooter {
	clear: both;
}

#agreement {
	margin-left: auto;
	margin-right: auto;
	width: 90%;
	text-align: left;	
}
#copyright {
	text-align: right;
}
#pageDate {
	text-align: right;
}


/*	--------------------------------------------------------------------------------
	Misc sections on a page
	--------------------------------------------------------------------------------
*/
/*	--------------------------------------------------------------------------------
	Yahoo section
	--------------------------------------------------------------------------------
*/
#yahoo {
	text-align: center;
}
#yahoo table {
/* the subscribe form is in a table
*/
	text-align: center;
}


/*	--------------------------------------------------------------------------------
	RopeMarks What's New / News
	--------------------------------------------------------------------------------
*/
#rm_news {
	font-size: 80%;

	width: 138px;
	height: 250px;
	overflow: auto;
	
	padding: 0;
	margin: 0;
	
	/* colors */
	scrollbar-base-color : #ffffcc;
	scrollbar-arrow-color : Red; 	
	
}
#rm_news dl {
	margin-top: 0px;
}
#rm_news dt {
	margin-top: 10px;
	/* colors */
	background-color: #FFCC99; 
	color: #003399; 
}
#rm_news dd
{
	margin-left: 0px;
	/* colors */
	border-color: #FF9999;
}
#rm_news dd.item {
	font-weight: bold;
	margin-top: 5px;	
}
#rm_news dd.item a {
	font-weight: bold;
	margin-top: 5px;	
}

/*	--------------------------------------------------------------------------------
	--------------------------------------------------------------------------------
*/
.glossary {
/* Section in a glossary page 
*/
	position: relative;
	margin-left: auto;
	margin-right: auto;
}
.glossary dl {
	padding-left: 4px;
}
.glossary dt {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 115%;
}

/*	--------------------------------------------------------------------------------
	Gallery preview section
	--------------------------------------------------------------------------------
*/
.thumbs {
	position: relative; /* IE - Peek-A-Boo */
	margin-left: auto;
	margin-right: auto;
	width: 100%;
}
.thumb {
	float: left;
	width: 250px;
	height: 200px;
	margin-left: 2px;
	margin-right: 2px;
}


.galleryPreview
{
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width: 80%;
	border: 1px solid black;
	margin-bottom: 1.4em;
}
.galleryPreview .previewCover
{
	margin-left: 4px;
}
.galleryPreview .previewImage
{
	margin-left: 2px;
	margin-right: 2px;
}
.galleryPreview .previewDescription
{
	overflow: auto; 
	width: 100%; 
	height: 215px;
	margin-top: 4px;
}
.galleryPreview .previewFooter
{
	text-align: center;
	margin-top: 0px;
	margin-bottom: 4px;

}

/*	--------------------------------------------------------------------------------
	--------------------------------------------------------------------------------
*/
#video { /* members gallery video */
}

/*	--------------------------------------------------------------------------------
	Resources - books
	--------------------------------------------------------------------------------
*/
.tblBook,
.tblMagazine, 
.tblVideo,
.tblMusic {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width: 95%;
	border: 0px;
	padding: 3px;
	margin-bottom: 1em;
}
.trHdr {
	background-color: #ccffcc;
	color: #330033;
}
.trBook,
.trMagazine,
.trVideo,
.trMusic {
/*	position: relative;*/
}


/* --- EOF --- */