/******************************************************************
screen styles for WandWords (wwords) -- 2007.02.02 -- Michael Burke
-------------------------------------------------------------------
web			:	http://www.wandwords.com.au
filepath		:	Sites/wwords/bridge/wandwords.css (Mac)
filepath		:	C:\FoxServ\www\wwords\bridge\wandwords.css (Win)
version		:	2007.02.02	v.1 *** 2007.07.20 v.2  
copyright	:	(c) Burke & Wandwords 2007
authors		:	Michael Burke & Warren Bradley
websites		:	http://www.bearfacts.com.au *** http://www.wandwords.com.au
	Warren	:	yyyy.mm.dd	v.
	laptop	:	2007.06.20	v.2
	server	:	yyyy.mm.dd	v.
	powerbook:	yyyy.mm.dd	v.
tested		:	Firefox Win v.1.0.7
-------------------------------------------------------------------
colours
#9cc    - blue light ... background
#36c    - blue light
#009    - blue dark
#336    - blue darkest
#609    - purple
#669    - pale steel
#f00    - red
******************************************************************/
* {
	margin: 0;
	padding: 0;
}/* the usual start - strip all browser presets */

body {
	color: black;
/*	background: #9cc;*/
	background: url(../piccies/light-bg-down.jpg) repeat-x;
	font-family: Skia, 'Trebuchet MS', Arial, Helvetica, sans-serif;
	font-size: 100%; /* for ie to use em values */
	text-align: center; /* ie centre hack */
}/* site-wide font & bg colour outside container div */

#container {
	position: relative;
	color: black;
	background: white;
	margin: 1em auto;
	border: 1px solid #336;
	width: 95%;
	text-align: left; /* ie centre hack reset */
}/* position for menu div */

#noscript {
	margin-left: 33%;
	font-size: .9em;
	text-align: center;
	background: #000;
	color: #fff;
	letter-spacing: .1em;
}/* noscript message */

#noscript p {
	line-height: 1.2;
}/* tightens the noscript txt */

#main {
	margin-left: 33%;
	padding-bottom: 2em; /* so left border is drawn to end of container div */
	width: 65%; /* total 98% of container div */
	border-left: 1px solid #336;
	min-height: 42em;
}/* main txt - right col */

img {
	margin: 0 auto;
	display: block; /* to centre the img */
	border: none;
}/* affects only logo & banner - 2007.02.03 */

#logo {
	margin-top: 1em;
	margin-bottom: 1em;
}/* affects only logo above menu */

h1, h2 {
	margin-top: 1em;
	font-size: 1.6em;
	letter-spacing: .1em;
	padding-left: 1em;
}
	
p {
	margin-top: .5em;
	padding-left: 1.6em;
	line-height: 1.4;
}

#menu {
	position: absolute;
	top: 0;
	left: 0;
	margin-left: 2.5em;
	width: 25%;
}/* position to container - left col */

#menulinks {
	margin-top: 2em;
	margin-bottom: 2em;
	padding: 1em;
	font-weight: bold;
	line-height: 1.5em;
	border: 1px solid #9cc;
}/* ul div */

#menulinks a {
	display: block;
	margin: 0;
	border: 1px solid #fff;
}

#menulinks a:hover {
	border: 1px solid;
	border-left: 1px solid #fff;
	border-right:  1px solid #fff;
}

em {
	font-style: normal;
	text-decoration: none;
}/* accesskeys */

ul {
	list-style: none;
}/* generic unordered list style */

a {
	text-decoration: none;
}/* generic link styles */

a:link {
	color: #009;  
	background: #fff;
}

a:visited {
	color: #609;
	background: #fff;
}

a:focus {
	color: #669;
	background: #fff;
}

a:hover { /* was #main a:hover */
	color: #36c;
	background: #fff;
	border-top: 1px solid #36c;
	border-bottom: 1px solid #36c;
}/* links (h1) in main div only */

a:active { /* was #main a:active */
	color: #f00;
	background: #fff;
}/* links (h1) in main div only */

#version {
	border: 1px solid #9cc;
	font-style: italic;
	font-size: .8em; 
	background-color: #fff;
	color: #336;
}/* for the site version info (ul spanning 4 lines in previous version) */

#version em {
	font-style: italic;
}/* re-italicizes the Wandwords and Bear Facts W and B */

#version a:hover {
	border-top: 1px dotted #f00;
	border-bottom: none;
	color: #36c;
}/* so links stand out in the version paragraph */

#copyright {
	margin: 2em 0;
	padding: 1em;
	text-align: center;
	background-color: #9cc;
	color: #fff;
	font-size: .8em;
	letter-spacing: .1em;
}/* the copyright label under the menu */
	
#copysymbol {
	font-size: 1.25em;
}/* enlarges only the copyright symbol in label */

#wwcopy {
	color: #336;
}/* dark blue wandwords text in label */

#trial {
	border-top: 1px solid #336;
	background: white;
	margin: 0 2em 2em;
}/* div for the form */

fieldset {
	margin: 1em;
	border: 1px solid #9cc;
	padding-top: 1em;
}/* form border */

legend {
	color: white;
	background: #9cc;
	padding: .2em .5em;
	margin-left: .5em;
}/* form header */

.labels {
	float: left;
	width: 45%;
	text-align: right;
	padding-right: 1em;
}/* left col in form */

.inputs {
	float: left;
	width: 45%;
}/* input col in form */

form p {
	padding: .1em 0;
	color: #306;
	background: white;
}

#button {
	clear: left;
	background: #9cc;
	text-align: center;
	margin: 2em;
}/* submit button in form */ 

.purple {
	background: white;
	color: #306;
	font-weight: bold;
}
		
.red {
	color: #c00;
	background: white;
}
	
p.top_paragraph {
	margin-top: 1em;
	margin-bottom: 1em;
	font-weight: bold;
}/* first paragraph in form */

p.top_space {
	margin-top: 5em;
}/* for "size" & "questions" in form */
	
p#required {
	position: absolute;
	top: 39em;
	left: 5em;
	font-style: italic;
}/* "required" text in form */

#list {
	list-style: none;
	border: 1px solid #9cc;
	margin: 1em 0 1em 1em;
	padding-left: 2em;
}

.arrow {
	color: #9cc;
	padding-right: .5em;
}

.first_item {
	padding-top: .5em;
}
	
.last_item {
	padding-bottom: .5em;
}


/*** `LINKS PAGE ***/
	
#links {
	margin-top: 1em;
	margin-left: 1em;
	height: 65em;/* this will change with more link boxes */
}/* container for the links page links */

.box {
	float: left;
	width: 44%;
	height: 11em;
	border: 1px solid #336;
	margin: 1em;
	background: #ddd;
}/* each individual link box */

#links img {
	margin-top: 1em;	
}

#links .box ul {
	text-align: center;
	margin-top: .5em;/* under image */
}

#links li {
		
}

#links .box ul li a {
	background: #ddd;	
}

#links .box ul li.link {
	letter-spacing: .1em;
	font-weight: bold;
}/* link part of box txt */

#links .box ul li.underlink {
	font-size: .9em;
}/* non-link part of box txt */

.box1 {
	position: relative;	
}/* to position the artist txt ... */

li#artist {
	font-size: .9em;
	position: absolute;
	top: 7em;
	right: 3em;
}/* ... and here's the artist txt */

li#artist span {
   color: #609;
}/* for the left arrow */


/*** `FORM ***/

form {
	background: #fff;
	border: 1px solid #336;
}

#registration {
	border: 1px solid black;
	margin-bottom: 1em;
	background: white;
	color: black;
	margin: 1em;
}/* whole contact page */

#registration p, #registration h1 {
	margin: 0 4em 1em;
}
	
#registration h1 {
	font-size: 2em;
	padding-top: .5em;
}

#all {
	position: relative;
	margin: 1em;
}/* to position right bit div and "required fields" */

#leftbit {
	width: 48%;
	text-align: right;
	padding-right: .5em;
	padding-bottom: 2em;
	margin-top: 1em;
}/* form txt */

#rightbit {
	position: absolute;
	top: 1em;
	left: 49%;
	text-align: left;
	width: 50%;
	padding-left: 1em;
}/* input fields */

#rightbit li, #leftbit li {
	padding: .2em 0;	
}/* breathing space */

#leftbit li {
	line-height: 1.3em;
}/* height of left txt to line up with right input fields */

#rightbit input {
	width: 90%;
}/* limits input field from popping out of div */

#rightbit select {
	width: 25%;
}/* drop-down menus */

#rightbit select.wide-drop-down {
	width: 50%;
}/* expands "country" drop-down */

#rightbit select option {
	white-space: normal;
}/* long txt in country menu breaks lines */

li#size {
	padding-top: 5.5em;
}/* "size of org" txt */

li#qac {
	padding-top: 2.5em;
}/* questions/comments txt */

#required {
	position: absolute;
	top: 2em;
	left: 3em;
	font-size: .9em;
	font-style: italic;
}/* required txt - positioned to "all" div */

.white {
	color: white;
	background-color: white;
}
	
#button {
	padding: .5em;
	color: black;
	background: #9cc;
	text-align: center;
}/* submit button */

#button:hover {
	color: red;
}

textarea {
	width: 95%;	
}/* questions/comments field */

#outlinks {
	line-height: 1.5;
	padding-left: 3em;
}/* outward links */