 
body {
background-color: #000000;
background-image: url("back_new.jpg");
background-attachment: fixed;
background-position: center;
background-repeat: repeat-y;
font-family: Verdana, Arial, sans-serif;
font-size: 93%; /*leave this...it sets the overall size of your fonts.*/
color: #73100B;
margin:auto;
padding: 0;
text-align:left;
}
 

/* this area below is for your  Link-text and headings. You can change the font type and size, the color of each of them
as well as the a:hover, which is the text for a link, once the pointer passes over it*/

a { font-family: Verdana, Arial, sans-serif; 
font-size: 100%; color: #660066; 
text-decoration: underline;
}
  
a:hover { font-family: Verdana, Arial, sans-serif;
font-size: 100%; 
background-color: #ffffc0;
color: #ff00ff;
}

  
/*the font size is 100% of the body font setting So while it says 100%, that is actually 100% of 93%. No need to touch this if you dont want to */

table {
font-size:100%; /*leave this font size, change the individual cells below, if the default size isnt to your liking*/
color:inherit;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
  
  
/*class to set thinner horizontal rule. Change color if you like.*/

hr{
border: 0;
color:inherit;
background-color: #000;
height: 0px;
width: 80%;
text-align: center;
}

/* ---------------------------------------------------- Colours of Table sections ----------------------------------------------  */ 

/* Background around 'tesla legacy' 'A' */ 

td.header {
border-left: 3px solid #000000;
background-color:#ffffd0;
font-size: 93%; 
}

/* Background around 'left middle section' 'B'  */ 
td.left_middle {
border-left: 3px solid #000000;
background-color:#ffffd0;
font-size: 93%; 
}

/* Background around 'middle main text area' 'C' */ 
td.middle {
background-color:#ffffd0;
font-size: 93%; 
}

/* Background around 'right middle section' 'D' */ 
td.right_middle {
background-color:#ffffd0;
font-size: 93%; 
}

/* Background around 'Upper bottom 'E''  */ 
td.upper_bottom {
border-left: 3px solid #000000;
background-color:#ffffd0;
font-size: 93%; 
}

/* Background around 'Lower bottom 'F''  */ 
td.lower_bottom {
border-left: 3px solid #000000;
background-color:#ffffd0;
font-size: 93%; 
}

/* --------------------------------------------------- End of Table sections -------------------------------------------------------  */ 

  
/* -------------------------------------Takes away the styling for anchor links------------------------------------------------------ */

a.jumplink{
text-decoration: none;
font-size: 100%; 
background-color: transparent;
color: #ff0000;
}
  
a:hover.jumplink  {
  text-decoration: none;
    font-size: 100%; 
  background-color: transparent;
  color: #ff0000;
}


/* ---------------------this sets the background color of the navigation box underneath the Tesla Legacy banner ------------------------ */

#nav ul {
	float: right;
	list-style: none;
	background: #000000;
	width: 100%;		
	padding: 0;	margin: 0 0 0 0px;
	height: 30px;
	display: inline;
	text-transform: uppercase;
}
#nav ul li {
	display: inline;
	margin: 0; padding: 0;
}
#nav ul a {
	width: auto;
	margin: 0;
	padding: 0 15px;/*this is the gap between the text, and the border*/
	border-top: none;	
	border-right: none;	
	border-left: none;	
	border-bottom: none;
	color: #ffffd9; /* text color underneath the Tesla Legacy banner*/
	font: bold 11px/31px  Verdana, arial, sans-serif; /* sets the font type and size*/
	text-transform: uppercase; /*delete if you dont want uppercase*/
	text-decoration: none;	
	letter-spacing: 1px;
}


/*-------------------------------------------this is where you change the color to brown when the navagation (nav) links above are hovered over*/

#nav ul a:hover, 
#nav ul a:active {
	color: #6e3127; 
	background-color: #000000;
	font: bold 11px/31px  Verdana, arial, sans-serif; /* altered from just bold sets the font type and size*/
}





/* -----***********************************************************************************************************----- */

/* ---------------------this sets the background color of the navigation box at the bottom of the page ------------------ */



/* ---------------------using the class 'nav' throws errors up if you use it twice ------------------------ */
/* ---------------------so I just call it nav2 the second time------------------------ */
#nav2 ul {
	float: right;
	list-style: none;
	background: #000000;
	width: 100%;		
	padding: 0;	margin: 0 0 0 0px;
	height: 30px;
	display: inline;
	text-transform: uppercase;
}
#nav2 ul li {
	display: inline;
	margin: 0; padding: 0;
}
#nav2 ul a {
	width: auto;
	margin: 0;
	padding: 0 15px;/*this is the gap between the text, and the border*/
	border-top: none;	
	border-right: none;	
	border-left: none;	
	border-bottom: none;
	color: #ffffd9; /* text color underneath the Tesla Legacy banner*/
	font: bold 11px/31px  Verdana, arial, sans-serif; /* sets the font type and size*/
	text-transform: uppercase; /*delete if you dont want uppercase*/
	text-decoration: none;	
	letter-spacing: 1px;
}

/*------------------------  this ichanges the color to brown when the navagation links (nav2) above are hovered over*/

#nav2 ul a:hover, 
#nav2 ul a:active {
	color: #6e3127; 
	background-color: #000000;
	font: bold 11px/31px  Verdana, arial, sans-serif; /* altered from just bold sets the font type and size*/
}


/* ---------------------------------------------------------------------------- Textboxes --------------------------------------------- */



/*** right column Full width box.
Change the colors to suit. The standard box has a white background, and the
box2 has a colored background ***

IE has difficulty with dashed and dotted. Dotted will show as dashed, and dashed can be dodgy anyway. 
So you are far better to use the solid property, as I have done here. At least you know you will get the same display in
every browser. Maybe Microsoft will produce a decent standards compliant browser ones day...but I doubt it*/


div.full-width-box {
   background-color: #ffffd0;
	margin: 15px 0px 10px 0px;
	padding: 15px;
   border: 1px solid #73100B;
	
}

div.center-box {
   width: 50%;
   background-color: #ffffd0;
	margin-left:auto;
	margin-right:auto;
	padding: 15px;
   border: 1px solid #73100B;
	
}

div.full-width-box2 {
   background-color: #ffffd0;
	margin: 15px 0px 10px 0px;
	padding: 15px;
   border: 1px solid #73100B;
	
}
	
/*** right column Half of width box left ***/
div.half-width-box-left {
   background-color: #ffffd0;
	margin: 5px 5px 5px 5px;
	border: 1px solid #73100B;
	padding: 10px;
	width: 40%;
	float: left;
	
}
/*** right column Half of width box right ***/
div.half-width-box-right {
   background-color: #ffffd0;
	margin: 5px 5px 5px 5px;
	border: 1px solid #73100B;
	padding: 10px;
	width: 40%;
	float: right;
	
}



/* the border of the image inside your half width textbox can be changed.
Its set to #5F8B8C at the moment. You can also change the solid
to either dashed or dotted if you want to*/

/*** Picture inside the text ***/
.img-float-left {
	float: left;
	padding: 2px;
	margin-right: 5px;
	border: 2px solid #73100B;
}
.img-float-right {
	float: right;
	padding: 2px;
	margin-left: 5px;
	border: 2px solid #73100B;
}
/*** Clearing of a float ***/
div.clear {
	clear: both;
	width: 100%;
	height: 1px;
}


