﻿/*BASICS*/

html, body {
  height: 100%;
  margin: 0 0 1px;
}

body {
	text-align:center;
	font: .8em/1.25em arial, helvetica, sans-serif;

}
strong {
	font-weight:bold;
}

em {
	font-style:italic;
}

small {
	font-size:x-small;
	display:block;
}

/*COLORS*/
a {
	color:#a6692a;
}

h4 {
	color:#a6692a;
}

h3 {
	color:#a6692a;
}

h2 {
	color:#a6692a;
}

h1 {
	color:#a6692a;
}

a:active {
	color:#FF0000;
}

a:visited {
	color:#69311a;
}


/*HEADERS*/
h1 {
	font-size:2em;
	margin:.5em 0 1em;
	font-weight:bold;
}

h1 strong {
	font-weight:normal;
}

h2 {
	font-size:1.5em;
	font-weight:bold;
	margin-bottom:.5em;
}

h3 {
	font-weight:bold;
	margin-bottom:.5em;
}

/*DIVS*/
.wrapper {
	width:950px;
	margin:15px auto 25px;
	background:white url('../images/home-bg.jpg') no-repeat center top;
	}

.navbar {
	margin-top:25px;
	background:transparent url('../images/bar.png') no-repeat scroll center top;
	height:60px;
}

.inside {
	width:880px;
	margin:10px auto;
	padding:10px;
	text-align:left;
}

.home-col1 {
	width:315px;
	float:left;
	text-align:center;
}

.home-col1 img {
	margin-bottom:25px;
}

.box-thin1 {
	background:white url('../images/box-bg-thin.jpg') no-repeat scroll center top;
	float:left;
	width:115px;
	min-height: 395px;
	margin:0 10px 0 25px;
	padding:10px;
}

.box-thin1:hover {
	background-image: url('../images/box-bg-thin-h.jpg');
}

.box-thin2 {
	background:white url('../images/box-bg-thin.jpg') no-repeat scroll center top;
	float:left;
	width:115px;
	min-height: 395px;
	margin-right:10px;;
	padding:10px;
}

.box-thin2:hover {
	background-image: url('../images/box-bg-thin-h.jpg');
}

.box-wide {
	background:white url('../images/box-bg-wide.jpg') no-repeat scroll center top;
	float:left;
	width:223px;
	min-height: 395px;
	padding:10px;
}

.box-wide small {
	clear:left;
}

.box-wide:hover {
	background-image: url('../images/box-bg-wide-h.jpg');
}

.box-wide img {
	float:left;
}

div.weeks {
	width:250px;
	float:right;
}

div.swapgroup2 {
	background: #fff url('../images/ftr-about-bg.jpg') repeat-y scroll center top;
	margin:0;
}

div.swapgroup2 h1 {
	margin-top:0;
}

div.about {
	padding:0 50px;	
	line-height:27px;
}

div.about p {
	margin:1em;
}

div.about img {
	position:relative;
	top:6px;
}




/*LINKS*/
a {
	text-decoration:underline;
	color:#a6692a;
}

a:hover {
	text-decoration:none;
}

a.browse-link {
	font-size:smaller;
	float:left;
	clear:left;
	margin-left:10px;
}

a.browse-link-long {
	font-size:smaller;
	float:left;
	clear:left;
	margin-left:10px;
}

a.bookmark {
	text-decoration:none;
}

a.bookmark:visited {
	color:#a6692a;
}

/*TEXT*/

span.breadcrumbs {
	font-size:x-small;
	color:#555;
}

/*IMAGES*/
img {
	border:none;
}

img#title {
	position:relative;
	top:16px;
	left:25px;
}

img#btn-u2 {
	margin:0 75px;
}
img#btn-u3 {
	margin-right:75px;
}

div.openfull {
	float:left;
	margin-right:10px;
	width:136px;
}

img.openfull {
	float:left;
	margin-right:10px;
}

img#key {
	padding:10px;
	border-top:1px #666666 solid;
}


/*ACCORDION*/

.week { /*header of 2nd demo*/
cursor: hand;
cursor: pointer;
font: 12px arial, helvetica, sans-serif;
border-bottom:1px #ccc solid;
padding:5px;
}

.week-off { /*header of 2nd demo*/
/* cursor: pointer; */
font: 12px arial, helvetica, sans-serif;
border-bottom:1px #ccc solid;
padding:5px;
color:#6a6a6a;
}

.content {
	padding-bottom:1.5em;
	font-size:12px;
	
}

.content-off {
	display:none;
	padding-bottom:1.5em;
	font-size:12px;	
}

.closedcontent{ /*class added to contents of 2nd demo when they are open*/
background-color:#a6692a;
color:#fff;
}

.opencontent{ /*class added to contents of 2nd demo when they are closed*/
color: #6a6a6a;
}

.opencontent strong {
	color: #a6692a;
}

.opencontent:hover {
	color:#333;
	background-color:#ccc;
}

ul.components li {
	color:#a6692a;
	cursor:pointer;
	padding:1px 0 1px 40px;
	border:1px #fff solid;
	height:27px;
}

ul.components li:hover {
	border-top:1px #ddd solid;
	border-bottom:1px #ddd solid;
	background-color:#eee;
}

ul.components li strong {
	font-style:normal;
	padding-top:5px;
	display:inline-block;
}

li.tog {
	background: transparent url('../images/tog.gif') no-repeat scroll 5px center;
}

li.wri {
	background: transparent url('../images/wri.gif') no-repeat scroll 5px center;
}

li.ma {
	background: transparent url('../images/ma.gif') no-repeat scroll 5px center;
}

li.ev {
	background: transparent url('../images/ev.gif') no-repeat scroll 5px center;
}

li.pq1 {
	background: transparent url('../images/pq1.gif') no-repeat scroll 5px center;
}

li.gov {
	background: transparent url('../images/gov.gif') no-repeat scroll 5px center;
}

li.lb {
	background: transparent url('../images/lb.gif') no-repeat scroll 5px center;
}

div#swap-loom-title {
	cursor:pointer;
	text-align:center;
	padding-top:10px;
}


/*DOCK*/
div.dock {
	width:600px;
	background: #e4e4e4 url('../images/dock-de-logo.png') no-repeat scroll center center;
	float:left;
	clear:left;
}

div.swapgroup1 {
	width:575px;
	margin:0 10px 0 25px;
	background-color:#e4e4e4;
	float:right;
	display:block;
}

div.dock-colwrap {
	width:400px;
	float:left;
	display:block;
	background-color:#fff;
	border:1px #ccc groove;
	padding:5px 0 0 5px;
}

div.dock-colwrap h3 {
	color:#555;
}

div.dock-col {
	width:180px;
	margin-right:10px;
	padding:5px;
	float:left;
}

div.dock-col ul {
	margin-bottom:1em;
	margin-left:40px;
}

div.dock-col ul li {
    padding:3px 0;
    border-bottom:1px #aaa solid;
}

div.dock-col ul li:hover {
    background-color:#eee;
}

div.dock-col ul li a {
    text-decoration:none;
}

div.dock-col ul li a:hover {
    text-decoration:underline;
}

div.dock-col ul li#none {
    list-style:none outside;
}


div.dock-col ul li#d {
	list-style:none outside url('../images/lvl-d.png');
}

div.dock-col ul li#dr {
	list-style:none outside url('../images/lvl-dr.png');
}

div.dock-col ul li#l {
	list-style:none outside url('../images/lvl-l.png');
}

div.dock-col ul li#lu {
	list-style:none outside url('../images/lvl-lu.png');
}

div.dock-col ul li#lud {
	list-style:none outside url('../images/lvl-lud.png');
}

div.dock-col ul li#ludr {
	list-style:none outside url('../images/lvl-ludr.png');
}

div.dock-col ul li#r {
	list-style:none outside url('../images/lvl-r.png');
}

div.dock-col ul li#t {
	list-style:none outside url('../images/lvl-t.png');
}

div.dock-col ul li#tdr {
	list-style:none outside url('../images/lvl-tdr.png');
}

div.dock-col ul li#tl {
	list-style:none outside url('../images/lvl-tl.png');
}

div.dock-col ul li#tlu {
	list-style:none outside url('../images/lvl-tlu.png');
}

div.dock-col ul li#tlud {
	list-style:none outside url('../images/lvl-tlud.png');
}

div.dock-col ul li#lludr {
	list-style:none outside url('../images/lvl-tludr.png');
}

div.dock-col ul li#tr {
	list-style:none outside url('../images/lvl-tr.png');
}

div.dock-col ul li#tudr {
	list-style:none outside url('../images/lvl-tudr.png');
}

div.dock-col ul li#u {
	list-style:none outside url('../images/lvl-u.png');
}

div.dock-col ul li#ud {
	list-style:none outside url('../images/lvl-ud.png');
}

div.dock-col ul li#udr {
	list-style:none outside url('../images/lvl-udr.png');
}


h3.wri-head {
    cursor:pointer;
    border-bottom:1px #aaa solid;
    padding:2px 5px;
}

h3.wri-head:hover {
    background-color:#ccc;
}

h3#off.wri-head:hover {
    background-color:transparent;
    cursor:auto;
}

div.dock-col ul li#sup {
    list-style:none outside url('../images/lvl-sup.png');
}

div.dock-col ul li#talk {
    list-style:none outside url('../images/lvl-talk.png');
}

div.dock-col ul li#grade {
    list-style:none outside url('../images/lvl-grade.png');
}


div.dock-col ul li#transp {
	list-style:none outside url('../images/lvl-transp.png');
}

div.dock-col ul li#purple {
	list-style:none outside url('../images/lvl-purple.png');
}

div.dock-col ul li#orange {
	list-style:none outside url('../images/lvl-orange.png');
}

div.dock-col ul li#green {
	list-style:none outside url('../images/lvl-green.png');
}

div.dock-col ul li#yellow {
	list-style:none outside url('../images/lvl-yellow.png');
}

div.dock-col ul li#blue {
	list-style:none outside url('../images/lvl-blue.png');
}

div.dock-col ul li#instructions {
	list-style:none outside url('../images/lvl-instructions.png');
}


/*DESCRIPTION*/
.unit-description {
	width:600px;
	margin-top:25px;
	margin-bottom:25px;
	float:left;
	display:block;
}
.cover {
	width: 150px;
	float:left;
	margin:0 25px 10px 0;
	text-align:center;
}

img.cover {
	width:150px;
}

.cover a {
	line-height:.5em;
}

.tools {
	width:600px;
	float:left;
	clear:left;
	margin-bottom:10px;
}

.contents {
	width:600px;
	float:left;
	clear:left;
}



/*SLIDER*/

div#swap-loom h3, div.about h3 {
	color:#333;
	border-bottom: 1px solid #333; 
	margin: 15px 0 5px; 
	padding-bottom: 3px; 
	line-height:1.25em;
}

div#swap-loom ul {
	margin-left:25px;
}



/*FOOTER*/

.footer {
	width:900px;
	min-height:50px;
	margin:10px auto 5px;
	background: #fff url('../images/ftr-top2.jpg') no-repeat scroll center top;
	clear:both;
	text-align:left;
}

div#home.footer {
	padding-top:25px;
	min-height:0;
}

div.about h1 {
	margin-bottom:10px;
}
div.use-link-wrapper {
	width:100%;
	text-align:center;
	margin-top:20px;
	margin-bottom:1em;
}
div.use-link-wrapper a {
	color:#000;
	display:inline-block;
	width:250px;
	height:25px;
	text-align:center;
	font-size:1.25em;
	text-decoration:none;
	font-weight:bold;
	background:url('../images/use-link-bg.png');
	margin-right:10px;
	clear:both;
}

div.swapgroup2 {
	clear:both;
}

div.use-link-wrapper a:hover {
	color:#555;
	background-image:url('../images/use-link-bg-h.png');
}

h2.steps {
	color:#333;
	font-weight:normal;
}

h2.steps img {
	position:relative;
	top:14px;
}

p.date {
	text-align:center;
	color:#333;
	font-size:smaller;
}

div.ftr-links-wrapper {
	padding:18px 0 0 25px;
}

div.online-links {
	height:30px;
	padding:0 25px;
/*	width:696px;
	padding:10px 0 0 25px;
	background:transparent url('../images/links-bar.png') no-repeat scroll center center; 
	color:#fff;*/
	float:right;
	text-align:center;
}

div.online-links a{
	color:#fff;
	text-decoration:none;
	font-weight:bold;
}

span#footer-contact {
	color:#333;
	font-size:smaller;
	letter-spacing:1px;
	text-transform:uppercase;
}

span#footer-contact a {
	font-size:medium;
	letter-spacing:0;
	text-transform:none;
	text-decoration:none;
}

span#footer-contact a:hover {
	text-decoration:underline;
}




/* TOOLTIPS */

a.ico {
	position:relative;
	z-index:25;
}

a.ico:hover {
	position: relative;
	z-index:24;
}

a.ico span {
	display: none;
}

a.ico:hover span {
	display: block;
   	position: absolute; bottom: 33px; left: -20px;
	/* formatting only styles */
   	padding: 2px 5px; margin: 10px; z-index: 100;
   	color:#555;
   	background: #fff; 
   	border: 1px #a6a6a6 outset;
   	white-space:nowrap;
   	cursor:default;
	/* end formatting */
}

