/*
Title:			Start Software
Description:	CSS for Toy Tracker
Author:			Visualcode Limited
Date: 			Tuesday 12th February 2007.
Version:		1.0
*/
/*---------------------------Global Start -----------------------------*/

body {
	font:11px/18px arial, helvetica, sans-serif;
	font-weight: normal;
	background:#c3e7ec;
  	line-height: 13px;
  	color: #224F87;
	text-align:center;
	margin:15px 0 0 0;
	padding:0;
	position:relative;
	}

input, 
button, 
select, 
textarea {
	font:11px/18px arial, helvetica, sans-serif;
	}
	
a:link {
	color: #BF83FD;
	text-decoration: none;
}

a:visited {
	color: #BF83FD;
	text-decoration: none;
}

a:active {
	color: #BF83FD;
	text-decoration: none;
}

a:hover {
	color: #000;
	text-decoration: none;
}

a img{
	border:0;
	}

h1{
	font-family: helvetica, arial, sans-serif;
	font-size: 18px;
	line-height: 14px;
	font-weight: bold;
	padding: 0px;
	margin: 0px;
}

h2	{
	font-size: 14px;
	font-family: arial, helvetica, sans-serif;
	line-height: 16px;
	padding: 0px 0px 10px 0px;
	border: 0px;
	margin: 0px 0px 0px 0px;
}		

h3	{
	font-size: 12px;
	font-family: arial, helvetica, sans-serif;
	line-height: 16px;
	font-weight: bold;
	padding: 0px 0px 10px 0px;
	border: 0px;
	margin: 0px 0px 0px 0px;
	}
		
h4	{
	font-size: 11px;
	font-family: arial, helvetica, sans-serif;
	line-height: 13px;
	font-weight: bold;
	padding: 0px 0px 3px 0px;
	border: 0px;
	margin: 0px 0px 0px 0px;
	}

p	{
	padding: 0px 0px 10px 0px;
	}
		
img	{
	margin: 0px;
	padding: 0px;
	}

hr {
	border: none;
	border-top: 1px solid #CCC;
	height: 1px;
	margin: 8px auto;
	padding: 0;
	color:#FFF;
	}
	
/*--------------------------- Containers -----------------------------*/
#Container {
	width:780px;
	margin:0 auto;
	text-align:center;
	padding:0;
	background:url(images/background.gif) repeat-y;
	position:relative;
	}

/*--------------------------- Logo  -----------------------------*/

#header{
	padding:10px 10px 0px 10px;
	background:url(images/topCurve.gif) no-repeat;
	text-align:left;
	position:relative;
	}

#Logo {
	width:222px;
	height:65px;
	text-align:left;
	}

/* ______________________ Start Top ______________________ */
#Top{
	height:30px; 
	text-align:right;
	
	width:520px;
	position:absolute;
	top:48px;
	right:14px;
	z-index:11;
	}

#Top ul {
	list-style:none; 
	display:inline;
	padding:0;
	margin:0;
	position:relative;
	}
	
#Top ul li {    
	margin:0;
	position:relative;
	display:block;
	float:left;
	text-align:center;
	margin-right:0px;
	border:#FFF solid 1px;
	}

#Top ul li a{
	padding-top:10px;
	display:block;
	width:125px;
	height:20px;
	font-weight:bold;
	}
	
#Top ul li.red a{background:url(images/redTab.gif) no-repeat; color:#FFF;}
#Top ul li.blue a{background:url(images/blueTab.gif) no-repeat; color:#FFF;}
#Top ul li.green a{background:url(images/greenTab.gif) no-repeat; color:#FFF;}
#Top ul li.purple a{background:url(images/purpleTab.gif) no-repeat; color:#FFF;}
#Top ul li.yellow a{background:url(images/yelloTab.gif) no-repeat; color:#224F87;}
/* ______________________ Navigation ______________________ */		
	
 #navigation{
 	background:#FFF url(images/navBack.png) no-repeat;
 	position:relative;
 	margin:7px;
	margin-top:0px;
	margin-bottom:0px !important;
	text-align:left;
	height:19px;
	padding:8px 10px;
	z-index:1;
	}

 #navigation ul {
	list-style:none; 
	display:inline;
	padding:0;
	margin:0;
	position:relative;
	}
	
 #navigation ul li {  
	border-right:#FFF solid 1px;  
	margin:0;
	position:relative;
	display:block;
	width:85px;
	height:19px;
	float:left;
	text-align:center;
	background:#ace2ff;
	margin-right:6px;
	}
	
 #navigation ul li.end {
	border-right:0 !important;  
	margin:0;
	position:relative;
	display:block;
	width:100px;
	height:20px;
	float:left;
	}

 #navigation ul li a {
	display:block;
	color:#224F87;
	position:relative;
	font-weight:bold;
	padding:4px 0 0 0px;
	height:15px;
	}
	
 #navigation ul li a:hover {
	color:#FFF;
	background:#224F87;
	position:relative;
	}


/*--------------------------- MainContent -----------------------------*/	

#contentArea{
	margin:0 7px 7px 7px;
	padding:0px;
	}

.clearBoth{
	clear:both;
	}

#editArea{
	width:560px;
	float:right;
	}
	
.image {
	width:560px; 
	text-align:left; 
	background:#fff;
	margin:0;
	padding:0;
	height:166px;
	}		
	
#MainBody {
	width:560px; 
	text-align:left; 
	font-size:110%;
	background:#fff;
	line-height:1.3em;
	background:url(images/mainBack.gif) no-repeat left bottom;
	}

#mainContent{
	padding:15px 14px 10px 14px;
	background:url(images/mainTopYellow.gif) no-repeat left top;
	}

#mainContent h1{
	color:#224F87;
	margin:0;
	padding:0;
	margin-bottom:15px;
	}

#mainContent ul li {
	background:url(images/bullet.gif) no-repeat 3px 1px;
	list-style:none;
	padding-left:25px;
	margin-bottom:15px;
	}

#mainContent ol li {
	font-size:30px;
	}	

#mainContent ol li p{
	font-size:15px;
	line-height:18px;
	}	

#clearMain{
	background:url(images/contentBottom.gif) no-repeat left bottom;
	height:20px;
	}

#clearContent{
	clear:both;
	height:10px;
	}		

.sideNav{
	background:#FFF url(images/sideNavBack.gif) no-repeat;
	width:200px; 
	padding:0; 
	float:left;
	position:relative;
	text-align:left;
	margin-bottom:0px;
	clear:left;
	}

.sideNav .wrapper{
	background:transparent url(images/sideNavBottom.gif) no-repeat left bottom;
	padding:10px 4px 10px 4px;
	}

.sideNav ul {
	list-style:none; 
	padding:0; 
	margin:0; 
	position:relative;
	}
	
.sideNav li {
	display:block; 
	position:relative;
	
	padding:2px 0;
	
	}

.sideNav li a{
	display:block; 
	background:#77CCB1;
	color:#FFF;
	position:relative;
	font-weight:bold;
	padding:5px 10px;
	}
	

.sideNav li.blue a{ background:#ace2ff; color:#224f87; border:#224f87 solid 1px;}
.sideNav li.blue a:hover{background:#224f87; color:#FFF;}

.sideNav li.green a{ background:#77CCB1; color:#1f691a; border:#1f691a solid 1px;}
.sideNav li.green a:hover{background:#50b848; color:#FFF;}

.sideNav li.red a{ background:#c01e45; color:#ffe3ea; border:#5f1023 solid 1px;}
.sideNav li.red a:hover{background:#ec008c; color:#FFF;}

.sideNav li.yellow a{ background:#ffcd05; color:#876e0a; border:#876e0a solid 1px;}
.sideNav li.yellow a:hover{background:#f7941d; color:#FFF;}

.sideNav li.purple a{ background:#ca8ac8; color:#6e3477; border:#6e3477 solid 1px;}
.sideNav li.purple a:hover{background:#ae5fba; color:#FFF;}


/*--------------------------- Footer -----------------------------*/

#footerWrapper{
	clear:both;
	line-height:1.3em;
	padding:10px 15px;
	background:url(images/bottomCurve.gif) no-repeat left bottom;
	}

#Footer {  
	padding-top:0px;
	font-size:80%;
	text-align:left;
	padding:0;
	
	}

#companyInformation{
	text-align:left;
	color:#666;
	padding:0;
	}

#copyright{
	padding-top:10px;
	width:520px;
	float:right;
	text-align:right;
	}

#designed{
	width:200px;
	padding:10px 0 0 0px;
	}

/*--------------------------- Other -----------------------------*/

.left{
	width:260px;
	float:left;
	}
	
.right{
	width:260px;
	float:right;
	}

.clearLR{
	clear:both;
	}

.specialOffer{
	border:#224F87 solid 1px;
	background:#FFD30C;
	padding:10px;
	text-align:left;
	}

/*--------------------------- webform -----------------------------*/

form{
	padding:0;
	margin:0;
	}

#webform{
	border-top:#CCC solid 1px;
	padding-top:25px;
	}

#webform .heading{
	background:url(images/yelloTab.gif) no-repeat #fff;
	width:125px;
	text-align:center;
	padding:10px 0 5px 0;
	margin-left:15px;
	border-bottom:#CCC solid 1px;
	}
	

#webform .formContent{
	background:#ECECEC;
	padding:2px;
	border:#CCC solid 1px;
	margin:0;
	}

#webform .formContent p {
	margin:0;
	padding:5px;
	}

#webform .formContent label {
	float: left;
	margin:0;
	padding:2px 1px 0 1px;
	width: 7em;
	text-align: left;
	font-weight:normal;
	font-size:11px;
	font-weight:bold;
	}

#webform .formContent input {
	margin:0;
	padding:2px 1px 0 1px;
	border:#CCC solid 1px;
	font-family: tahoma, arial, sans-serif;
	color:#333;
	font-size:100%;
	}

#webform .formContent select {
	margin:0;
	border:#CCC solid 1px;
	font-family: tahoma, arial, sans-serif;
	color:#333;
	font-size:100%;
	}

#webform .formContent textarea {
	width:390px;
	margin:0;
	padding:2px 1px 0 1px;
	border:#CCC solid 1px;
	font-family: tahoma, arial, sans-serif;
	color:#333;
	font-size:100%;
	}

#webform input.submit {
	background:#FFD30C;
	padding:5px 10px ;
	font-weight:bold;
	border: 1px solid #FFF;
	color:#224F87;
	}

#webform .orderDetails{
	clear:both;
	}

#webform .orderDetails p {
	margin:0;
	padding:5px;
	clear:left;
	}
	
#webform .orderDetails label {
	float: left;
	margin:0;
	padding:2px 1px 0 1px;
	width: 20em;
	text-align: left;
	font-weight:normal;
	font-size:11px;
	font-weight:bold;
	}	
	
	
	