/*************************************************

TORCH MOBILE				 
JANUARY 2008						
BY 76design			


***************************************************
	GENERIC
	*/


HTML {
	font: 62.5%/120%  Arial, Helvetica, Verdana, sans-serif;   
	background:#FFF url('../images/html_bkg.gif') repeat-x;
	color: #323232;
	}
	
BODY {
	margin: 0px;
	padding: 0px;
	text-align: center;
	}
	
A{
	color:#000;
	font-weight:bold;
	
	}
		
A:hover{color:#bb3833;}

A IMG {border:0;}

.left {float:left;}
.right {float:right;}

.bold 			{ font-weight:bold; }
.italic 		{ font-style:italic; }
.underline 		{ border-bottom:1px solid; }
.highlight 		{ background:#ffc; }
	
H1,H2,H3,H4,H5,H6,UL,LI, BLOCKQUOTE,IMG {
	margin:0;
	padding:0;
	list-style:none;
	}
	
	/***************************************************
	TABLES
	 */

TABLE{
		clear: both;
		margin:20px 0;
		width: 100%;
		padding:0;
		border-collapse: collapse;
		font-size:100%;
		}	

TABLE THEAD TH {		
		line-height:120%;
		}
		
TABLE TBODY TR TH {
		color:#651714;
		width:140px;
		}

TABLE TBODY TR {
		color:#AAA;
		}
	
TABLE TH {
		padding: 8px 3px;
		vertical-align:middle;
		color:#bb3833;
		font-weight:bold;

		border-bottom: 1px solid #CCC;
		}

TABLE TR TD {
		font-size: 100%; line-height: 140%;
		margin:0;
		padding:2px 5px;
		border-bottom: 1px solid #CCC;
		}
		
TABLE#downloadinfo TR TD {
		border-bottom: 0;
		color: black;
		font-weight: normal;
}

/***************************************************
	FORMS
	 */
LABEL {
		display:block;
		float:left;
		width:120px;
		color:#4b626d;
		font-weight:bold;
		cursor:pointer;
		}

INPUT,
TEXTAREA {
		border: 2px solid #ccc;
		color: #999;
		font-size: 100%;
		margin:2px 0;
		}
	
/***************************************************
	WRAPPER
	 */
#wrapper {
	width:980px;
	margin: 0px auto;
	text-align:left;
	overflow:hidden;
	}

/***************************************************
	HEADER
	
	
	*/

#header {

	padding:33px 0 0 0;
	height:70px;
	}
.logo {
	float:left;
	width:150px;
	height:58px;
	background:url(../images/logo.png);
	_background:url(../images/logo.gif);
	text-indent:-9000px;
	}

/***************************************************
	MAIN MENU
	*/

#topmenu {
	margin:10px 0 0 0;
	float:right;
	}

#topmenu LI  {
	list-style:none;
	float:left;
	margin:0 0 0 15px;}
	
#topmenu A {
	font-size:120%;
	display:block;
	padding:5px 0 0 0;
	margin:0;
	color:#222;
	text-decoration:none;
	border-top:solid 3px #000;
	width:96px;
	}
	
#topmenu A:hover {
	border-top:solid 3px #bb3833;
	}

/***************************************************
	CONTENT
	
	The content div holds 3 column divs inside.
	
 	*/
#content {
	line-height:160%;
	background:#FFF url(../images/content-bottom.gif) bottom left no-repeat;
	overflow:hidden;
	font-size:120%;
	position:relative;
	height:1%;
	min-height:560px;
	padding:0 0 100px 0;
	}

.home #content {
	height:560px; 
	padding:0;
	}
.home #content #center-column P {
		font-size:100%;
	line-height:120%;
	color:#6d6e71;
	}

td.mwcform {
	text-align: left;
	margin-left: 30px;
	border: 0px;
}

	
#content H1,
#content H2,
#content H3,
#content H5 {
	color:#bb3833;
	text-transform:uppercase;
	}
	
#content H1 {
	font-size:180%;
	margin:10px 0;
	}
	
#content H2{
	font-size:140%;
	margin:10px 0;
	}
	
#content H3 {
	font-size:130%;
	margin:10px 0;
	}

#content H4 {
	color:#a19f7e;
	font-size:130%;
	}

#content H5 {
	font-size:130%;
	}
	
#content UL {
	padding:0 0 18px 10px;
	}	
	
#content UL LI {
	background:url(../images/bullet.gif) 0 6px no-repeat;
	padding:0 0 0 20px;
	list-style:none;
	margin:15px 0;
	}
	
#content OL LI {
	list-style:decimal outside;
	padding:0 0 0 0px;
	margin:15px 0;
	}		


/*
at the time of creation news-items are anything using the news module. This
includes press and events. Though it could be explanded at a later date.

*/	
	
#content DIV.news-item {
	margin:0 0 50px 0;
	}
/***************************************************
	COLUMNS
	
	The column sizes fluctuate based on the content they hold
	
	 */
	 
.home #left-column {margin:0 10px 0 0;}
.home #center-column {width:330px;margin:0 50px 0 0;padding:100px 0 0 0;}
.home #right-column {width:303px;}
	 	 
#left-column {
	width:275px; 
	margin:0 40px 0 0;
	}
	
.mwc #center-column {
	width:610px;
	margin:0 12px 0 0;
}

#center-column,
#right-column {
	width:310px;
	margin:0 12px 0 0;
	}
		
#left-column,
#center-column,
#right-column,	
#inner-content {
	float:left;
	overflow:hidden;
	}
	
#page-title {
	display:block;
	width:650px;
	margin:60px 0 30px 0;
	float:left;
	padding:0 0 30px 0;
	border-bottom:solid 1px #bb3833;
	}	
	
/***************************************************
	TAGS
	
	These are the images of tags that are used. 
	
	 */
	 
/*events is the white tag located on the homepage */	 
#events {
	width:160px;
	height:190px;
	margin:200px 0 0 40px;
	padding:60px 30px 0 20px;
	font-size:90%;
	line-height:140%;
	}
#events H3 A {
	text-decoration:none;
	}
/*callout is the little box that holds info - 
for example - the homepage download button */
		
.callout {
	background:#FFF;
	padding:15px 20px;
	border-right:solid 2px #e6e6e6;
	border-bottom:solid 2px #e6e6e6;
	position:absolute;
	right:0;
	bottom:30px;
	width:200px;
	line-height:140%;
	}
.callout P {
	margin:0;
	padding:0;
	}

/* the download tag is the download now image */	
.download-tag{
	margin:193px 0 0 20px;
	display:block;
	}	
	
/***************************************************
	FOOTER
	 */

#footer {
	clear:both;
	overflow:hidden;
	margin:20px 0;
	}
	
#footer P {
	clear:both;
	float:left;
	margin:5px 10px;
	padding:0;
	color:#d7d5d5;
	font-weight:bold;
	font-size:120%;
	}
	
.module-blurb {
	margin:0 30px 30px 0;
	}
	
/***************************************************
	PRODUCT PAGE
	
	The product pages is a departure from the rest of the site. So, 
	we need these to make it work.
	 */
	
.product #content {
	padding-left:30px;
	padding-right:30px;
	}
	
.product BLOCKQUOTE {
	font-size:170%;
	line-height:140%;

	margin:0 0 30px 0;
	color:#6d6e71;
	}
	
.product #right-column {
	width:275px ;
	margin:0 20px 0 0;
	}

.faq #center-column{
	width:475px ;
	margin:0 20px 0 0;
}

.product #center-column{
	width:275px ;
	margin:0 20px 0 0;
	}
	
.product #left-column {
	background:none;
	}
	
.product #page-title H1{
	margin:60px 0 0 210px;
	}
	
.product #page-title H2 {
	margin:0px 0 0 210px;
	color:#6d6e71;
	}

.product #page-title {
	width:100%;
	margin-top:20px;
	height:180px;
	}	

.product .callout H3 {
	line-height:100%;
	}
	
.product .callout {
	top:20px;
	bottom:auto;
	line-height:80%;
	right:60px;
	width:180px;
	}
	

.product #supported-os {
	font-size:130%;
	font-weight:bold;}
	
#errormsg {
        font-weight: bold;
        color: red;
}

#content #moduleid-news .full-width {
	width:650px;
}
