/*
Palette colors

222222; -- top and bottom space

2A2A2A; -- Gray exactly in between 222222 and 333333

333333; -- center space slightly lighter gray


732119; -- dark red

AC4219; -- light red

D37F37;  -- orange color

dadabe; -- light beige color works well with the orange

888873; -- darker complement color to the light beige


*/



/* Remove browser styles */
* {
	margin: 0;
	padding: 0;

}


body {
background: #1c1c1c; margin: 0pt;
	text-align: justify;
	background-repeat: no-repeat;
	background-attachment: fixed;
	font-size:14px;
	color: #dadabe;	
  font: normal 12px "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
}

.wrap {
	padding: 0px;
	width: 720px;
	margin-top: 0px;
	border: solid 1px #000;
	border-top: solid 1px #000;
	background-color: #fff;
	text-align: left;
}

a {
	text-decoration: none;
	color: #dadabe;
}

a:hover
{
	color: #dadabe;
	text-decoration: underline;
}

.doubleSpace {
	line-height: 1.7em;
}


#ribbon {
position:absolute; 
left:0px; 
top:0px; 
margin:0px; 
padding:0px; 
float: left; 
position:fixed;
z-index:10;
}



/*  Major layout containers */

#header {
	background-color: #3B3B3B;
	height: 154px;
}

#header_content {
	margin-left: 70px;
	margin-top: 16px;
}

.header_border {
background-color: #732119;
width:100%;
height: 10px;
background: url(../images/top_gradient1.png);
}


.navBar {
		background: url(/images/navBarBG.png) no-repeat 60px 0;;
    background-color: #2A2A2A; 
		/*float:left;	*/
    font-size: 14px;
    text-align: center;
    text-shadow: 2px 2px 2px #222222;
    font-weight: bold;
    padding-bottom: 0px;
    padding-top: 0px;
    padding-left:60px;
    margin-left: 0px;
    margin-bottom: 30px;
    height: 30px;
    width: 660px;
}

/* Fixes the menu in the potion store */
div.narrow div.navBar {
	float:left;
}


.navBar div { 
  /*  background-color:#fff; */
	float:left;	
	line-height: 1.8em;
	width:150px; 
	height:30px;
	text-indent:0;
	text-align:center;
	padding-top:0px;
	/*border: 1px solid #fff; */

}
 
.navBar div a {
    text-decoration: none;
     color: #888873;
}
.navBar div a:hover {
    color: #dadabe;
    font-weight: bold;
}

#headerContentMargin {
	background-color: #333333;
}


#contentRow {
  margin-left:60px;
  margin-right:60px;
}

#leftColumn {
	position:relative; 
	top:20px; 
	left:40px; 
	width:180px;
	height:220px;
	float:left; 
	padding-top:20px;
	padding-right:20px;
	background: url(../images/leftColumnBG.jpg);
	background-image: no-repeat;
}

#rightColumn {
	position:relative; 
	left:80px; 
	top:0px; 
	width:500px; 
	float:left; 	
	margin-bottom:30px;
	padding-left:40px; 
	padding-right:20px; 
}


.buttonFrame {
	height: 60px;
	margin-bottom:40px;
}

.buttonTitle	{ 
	font-size:17px; 
}

img {
  border:0;
}


/* ---------- Colours ------------------- */

.color1 {
	color:#D37F37;
}

.color2 {
	color:#888873;
}

.color3 {
	color:#dadabe;
}


.contentBGColor {
	background-color: #333333;
}

.testingBGColor {
	background-color: #FFFFFF;
}

.headerFooterBGColor {
	background-color: #222222;
}

/* ---------- End Colours ------------------- */





.buttonText {
	margin-top:5px;
	height:0px; 
	left: 0px; 
	width:110px; 
	position:relative; 
	text-align:right;
	float:left;
}

.buttonImage {
	float:right;
}

#previewBox {
	padding-left:10px; 
	padding-top:1px; 
	padding-bottom:1px; 
	padding-right:10px;
	color:#black;
	text-align:justify;
	border-color:#732119;
	border-width:5px;
	border-style:solid;
}


.title {
	font-size:2.6em;
	
}

.subTitle {
	font-size:2.0em;
	
}


.titleFont {
	font-family: "Times New Roman", Times, Georgia, Serif;
}

.contentFont {
  font: normal 12px "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
}

.newSection {
	margin-top:40px;
}

a:hover#arrow {
	color:#888873;
}

#arrow { 
	padding-right:7px; 
	white-space:nowrap; 
	background:url(../images/arrow.gif) no-repeat 100% ;
	_zoom:1; 
}

.screenshots {
  padding-left:70px;
  padding-top:10px;
  padding-bottom:20px;
  background-color: #2A2A2A;
}

#screenShotTitle {
  
	padding-left:0px;
  padding-bottom:10px;
	margin-bottom:10px;
}


.screenshotContainer {	

	float:left;
}

.proScreenshotPadding {
	padding-left:45px;
}

.screenshotCaption {
	padding-top:10px;
	text-align:center;
	color:#dadabe;
}

#requires105 {
	margin-top:0px; 
	margin-bottom:0px; 
	font-size:8pt;
	text-align:center; 
	position: relative; 
	left: 0px; 
	top: 0px;
	width:200px;
}

ul li { line-height:1.7em; }

#videos {
width:900px;
height:350px;
background-color:#555555; 
}

#videosTitle {
	padding-left:60px;
	clear:left;
}

#screenShotTitle {
	padding-left:0px;
  text-align:center;
}


.screenShotSubTitle {
	padding-left:10px;
	padding-top:5px;
	padding-bottom:5px;
}



.videoBlock {
	
}


#memberVideo {
	margin-left:100px;
	padding-bottom:20px;
	padding-left:0px;
	height:543px;
	width:740px;
}


#publicVideo {
	margin-left:0px;
	padding-bottom:20px;
	padding-left:280px;
	height:425;
	width:596px;
	float:left; 
}

.copyText {
  font: normal 14px "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
  padding-bottom: 10px;
}

.mainHeaderRow {
  height:40px;
  text-align:center;
  background:url(../images/releaseNotes/mainHeaderRow.jpg) no-repeat;
  background-position:0px 0px;
  padding-left:0px;
  margin-top:20px;
  padding-top:5px;
  padding-bottom:20px;
  
  text-shadow: 1px 1px 1px #111111;
}

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


#footer {
	position:relative;
	width:100%;
	background-color: #222222;
	margin-top:  0px;
	clear:left;
  border-top:  solid 1px #2A2A2A;
 
}

#footer_content {
	margin-left: 30px;
	background:url(../images/contact.png) no-repeat bottom left;
}

#contactBlock {
 
	text-align:left; 
	margin-top:30px; 
	padding-left:40px; 
	padding-bottom: 5px;
	font-size:10pt; 
	width:180px;
	height: 30px;
	
  background-position:0px 0px;
	position: relative; 
}

.footer_border {
background-color: #732119;
width:100%;
height: 10px;
background: url(../images/top_gradient1.png);
}