﻿/* This is a fixed-width and floated Three-Column layout.
   First, declare the max width in the body to include padding and
   border (if any). */
  
 html, body
{
	background-position: #000000;
	/*text-align: center; /* original
width:850px; */
	margin: 0;
	padding: 0;
	font-family: Verdana, "Lucida Sans Unicode" , Sans-Serif;
	font-size: small; /* Use keyword in combination with percentage. This will allow text sizing. */ /*font-size:12px;*/ /* Use pixels in combination with percentage. Will not allow text sizing. */
	background: #000000; 
	background-image: url(../../Images/backgroundmain.jpg);
	background-repeat: repeat-x;
	color: #FFFFFF;
	height: 100%;
} 

#train1
{
	width: 320px;
	background-color: #BA003B;
	float: left;
	padding: 10px;
}

#train2
{
	width: 250px;
	background-color: #BA003B;
	padding: 10px;
	float:right;
}

#trainWrapper
{
	width:680px;
	margin-left:auto;
	margin-right:auto;
}

#lessonContainer
{
	
}

#lesson1
{
	padding: 10px 10px 0px 10px;
	float:left;
	width:300px;
}

#lesson2
{
	float:right;
	width:300px;
	padding:0px 10px 10px 0px;
}

.quote
{
	text-align: center;
	color: #999999;
	font-size:80%;
}

#lessonText
{
	text-align:left;
	clear:both;
}

#lessonTopText
{
	margin-left:320px;
	text-align:left;
	padding:10px;
}

#aboutMain
{
	height: 100%;
	width:100%;
	clear:both;
}

#defaultMain
{
	float:left;
	width:260px;
	height:390px;
	margin-top:40px;
	padding-left:5px;
}

#aboutText
{
	padding:20px;
	text-align:left;
	margin-left:265px;
	width:495px;
}

#leftpad
{
	width: 50px;
	background-color: Green;
	float: left;
}

#center
{
	border: 2px outset #C0C0C0;
	margin: 0 auto;
	width: 804px;
}
    
/* Let's declare the basic rules for headings */ 
  h1 { 
    font-size:150%; 
    } 
	h2 { 
  font-size:140%; 
  } 
 h3 { 
  font-size:120%; 
  } 
  
  
/* Declare default paragraph styles  */
  p { 
    font-size:100%; 
    line-height:150%;
    display:block;
     } 

 /*By default, any images acting as link will be given a thin blue line by default.
   Therefore override this by giving images a border of 0*/
    img
    {
		border:0;
    }

/* Masthead. Considering Box Model, calculate width of 
   masthead =  1000 - (1px border, -10px padding, - 10px padding, - 1 border) = 978px.
   
   Note: It is more efficient to tile the background of the masthead and put the logo
         indepedently. The filesize will be smaller and the logo can be made selectable.
      
         
*/
   
   

   #masthead
{
	width: 800px; /*Since the declared paddings and borders is 0, the max width of header is 1000px. */
	/*border: solid thin #666666;
	border-bottom:none;*/
}
  #mastheadLogo  
	{	
	text-align:center;
	/*float: left;	
	width: 379px;
	height: 96px;
	margin: 20px 200px 0px 200px;*/
	}
	
    
  /*h1 selector for Masthead need to be float to the left
     becuase a login div will be placed on the right (of Masthead)*/
  #mastheadLogo h1
	{	
		float: left;	
		/*make sure there's no default or inherited margin and padding*/
		margin: 0;
		padding: 0;
	}
  #mastheadMain
	{
	float:right;
	width: 630px;
	height: 80px;
	/*background:url(/images/main/masthead_main.jpg);
	background-repeat:repeat-x;*/
	}
   
#mastheadMain a 	{
					text-decoration:none;
					}
					
#mastheadMain a:hover 	{
					
					}					
		

     /********************************************************************/
     /*                        Footer                      */
     /*******************************************************************/
	#footer
{
	clear:both;
	/*border-top: 1px #C9D7FE solid;
	background-color:#006600;*/
	text-align: center;
	/*background:url(../../Images/footer.jpg);*/
	width:804px;
	height:60px;
	border: 2px outset #C0C0C0;
	border-top:none;
	margin: 0 auto;
}
	#footer, #footer .sb-inner
{
	background: #333333;
}
	
	#footer p
	{
	color:#FFFFFF;
	font-size:85%;
	text-align:right;
	margin:0px;
	padding-right:10px;
	}

    #copyrightText
    {
	text-align:right;
	margin:0px;
	padding-right:50px;
	}
	
  
	 
    /************************************************************/
    /*                     Columns					         	*/
    /************************************************************/
	/* Container that holds all columns: left nav column, center column,
       and right nav column */ 
    #container
{
	background-color: #000000;
	clear: both;
	/*padding-bottom:4000px;
 	margin-bottom:-4000px;*/
 	overflow:hidden; 
 	
 	
}
     
    /*************************************************************/
    /*                         Center Column				     */
    /*************************************************************/   
      /*Content. The final width value of the content is somewhat
        dictated by the fact that we need to allow for existing
        border, padding and margins. Note that 1000 is the max width
        declared in the body selector */
     
     /*Column definition for the two-column layout */
     #content 
	  {
		/*font-size:85%;
		font-size:85%;*/
		padding-top:20px;
		padding-bottom:5px;
		height: 100%;
	  }       
    
     /*Column definition for the two-column layout */
     #content2 
	  {
	    font-size:95%;
	    width:774px;  /* 1000 - (lc 200 + 20) = 800  */
		padding:10px;
	  }     
  	
table
{
	margin-top: 5px;
	border-collapse: collapse;
	empty-cells: show;
}
table th
{
	border-color: #FFFFFF;
	border-bottom-style: solid;
	border-bottom-width: medium;
	font-size: 140%;
	font-weight: bolder;
}

table td
{
	border-color: #FFFFFF;
	border-bottom-style: solid;
	border-bottom-width: thin;
	padding: 5px;
	text-align:center;
}

td.subBorder
{
	border-color: #FFFFFF;
	border-left-style: solid;
	border-left-width: thin;
	
}

td.bottomBorder
{
	border-color: #FFFFFF;
	border-bottom-style: solid;
	border-bottom-width: medium;
	border-left-style: solid;
	border-left-width: thin;
}

td.bottomBorder2
{
	border-color: #FFFFFF;
	border-bottom-style: solid;
	border-bottom-width: medium;
}

.center
{
	text-align: center;
}
a
{
	color: #EA004D
}
a:visited
{
	color: #EA004D
}
#lessonMiddleLeft
{
	width:780px;
	padding-left:10px;
	padding-right:10px;
	vertical-align:middle;
}


.floatRight
{
	float: right;
}

.clearBoth
{
	clear:both;
}

.spacer
{
	clear:right;
}

#wrap
{
	padding: 0px 10px 0px 10px;
}

#middleText
{
	margin: 150px 0px 0px 25px;
	width:450px;	
	text-align:right;
	
}

img.centered
{
	/*display:block;
	margin-left:auto;
	margin-right:auto;*/
	padding: 5px;
}

.red
{
	color: #EA004D;
}

#mainQuote
{
	color: #CCCCCC;
	font-size: 125%;
	float: left;
	width: 300px;
	margin-top: 200px; /*margin-left:auto;
	margin-right:auto;*/
}

#mainQuote p
{
	font-size: 75%;
	font-weight: bold;
	font-style: italic;
}

#wrapper
{
	margin-left:0;
	margin-right:auto;
	
}

.installBackground {
    background-color:Gray;
    filter:alpha(opacity=10);
    opacity:0.7;
    /*position:absolute;*/
    top:0;
    left:0;
    width:30px;
    height:30px;
}
.centredHV {
    position:absolute;
    top: 200px;
    /*left: 50%;*/
    width:30em;
    height:18em;
    /*margin-top: -9em; set to a negative number 1/2 of your height*/
    /*margin-left: -15em; set to a negative number 1/2 of your width*/
}