/* CSS Document */

/* Standard Building Blocks ++++++++++++++++++++++++ 
-----------------------------------------------------
------------------------------------------------------*/
body { font: 12px/24px Lucida Sans Unicode, verdana, arial, sans-serif; 
	  text-align: left; margin: 0 0 0 0; color: #FFFFFF; }
.left { float: left; }
.right { float: right; }
p { padding: 0; margin: 8px 0; }
a:link, a:visited { color: #CAEEFF; text-decoration: underline;  }
a:hover { color: #8AD9FF; }
.highlighttext { color: #8AD9FF;  }

/* Main Containing Div, Positions Body of Site*/
#MasterContain { width: 840px; margin: 10px auto; }

/* Clearfix - Wraps Containers Fully - Props out to Tony Aslett for this one*/
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix {display: inline-table;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
/* Clearfix - Wraps Containers - End */

abbr, acronym { border-bottom : 1px dashed #FFFFFF; cursor : help; font-weight: bold;}
/*-----------------------------------------------------------------------------------------------------------------*/






/* The H Family ------------------------------------------------------------- 
Starting with the Ffatri Fenter logo at the top */
h1 { background: url(images/logotop.gif) no-repeat; height: 23px; width: 263px; float: right; margin: 20px 30px 0 0; padding: 0;  }
/* Then the top of the box */
h2 { background: url(images/bck-top-bar.jpg) no-repeat; width: 840px; height: 34px; margin: 0; padding: 0; clear: both; }
/* This goes into the Main Area and is the holder for the navigation */
h1 span, h2 span, #topbanner span  { display: none; }




/* This is where everything in the box area is held -------------------------------------- */
#MainArea { background: url(images/bck-middle.jpg) repeat-y; padding: 9px 35px; margin: 0; display:block; }




#quicklinks { float: left; width: 200px; }




/* THIS IS THE MAIN NAVIGATOR WHICH IS ON THE TOP OF THE PAGE AND GUIDES PEOPLE FROM ONE PAGE TO ANOTHER AND ANOTHER*/
#MainNav { width: 130px; height: 121px; background: url(images/navigator.gif) no-repeat; margin: 50px 0 0 6px; padding: 0; position: relative; float: left; }	
#MainNav span {display: none;}
#MainNav ul {list-style-type: none;}
#MainNav li {margin: 0; padding: 0; list-style: none; position: absolute; }
#MainNav li, #MainNav a { display: block;}
#home {left: 0; top: 0;  width: 130px; height: 26px;}
#about {left: 0; top: 26px;  width: 130px; height: 22px;}
#projects {left: 0; top: 48px;  width: 130px; height: 23px;}
#success {left: 0; top: 71px;  width: 130px; height: 22px;}
#contact {left: 0; top: 93px;  width: 130px; height: 28px;}
#home a {height: 26px;}
#about a {height: 22px;}
#projects a {height: 23px;}
#success a {height: 22px;}
#contact a {height: 28px;}  
#home a:hover {background: transparent url(images/navigator.gif) 0 -121px no-repeat;}
#about a:hover {background: transparent url(images/navigator.gif) 0 -147px no-repeat;}
#projects a:hover {background: transparent url(images/navigator.gif) 0 -170px no-repeat;}
#success a:hover {background: transparent url(images/navigator.gif) 0 -192px no-repeat;}
#contact a:hover {background: transparent url(images/navigator.gif) 0 -214px no-repeat;}
/* --------------------------------------------------------------------
--------------------------------------------------------------------------------------------------------- */



#topbanner { background: url(images/banner.gif) no-repeat; width: 758px; height: 178px; margin: 0 0 0 3px; padding: 0; border: #34699E 1px solid; }
#topbanner p { font-size: 12px; font-weight: normal; float: left; width: 200px; margin: 120px 0 0 90px; padding: 0; color: #A8C4DF; }
#topbanner br { margin: 4px 0 0 0; }
#quicklinks { width: 206px; background: #0095D9; font: 12px/22px Lucida Sans Unicode, verdana, arial, sans-serif; color: #FFFFFF; }
#topbanner img { float: right; width: 302px; height: 176px; margin: 1px 2px 0 0; padding: 0; }



/* LEFT PANEL IS WHERE THE MAIN TEXTUAL CONTENT IS HELD ------------ */
#LeftPanel { width: 410px; padding: 5px 15px 0 10px; margin: 0; float: left; }
#LeftPanel img { margin: 8px 8px 8px 0; padding: 1px; background: #006A9D; border: #2FBBFF 1px solid; float: left; }
h3 { font-size: 18px; font-weight: bold; margin: 6px 0; }
h4{ font-size: 14px; font-weight: bold; margin: 4px 0; color: #8AD9FF; }
#LeftPanel ul { margin: 0; padding: 0 0 9px 25px; }
#LeftPanel li { margin: 0 0 9px 0; }





/* Right Panel - Holds Images, Case Study etc. --------------------- */
#RightPanel { width: 300px; padding: 0; margin: 0 7px 0 0; float: right; text-align: right; }
#RightPanel img { float: right;  }
.rightplogos { margin: 15px 0; padding: 1px; background: #006A9D; border: #2FBBFF 1px solid; }
#RightPanel strong { font-size: 14px; }





/* SWITCH LANGUAGE ---------------------------------
Switched page language between Welsh and English -------------------------------------- */
#SwitchLanguage { background: url(images/bck-bott-bar.jpg) no-repeat; width: 760px; height: 34px; padding: 25px 40px 0px 40px; color: #427BB5; text-align: right; }
#SwitchLanguage a:link { color: #6699FF; text-decoration: none;}
#SwitchLanguage a:visited { color: #427BB5; text-decoration: none; }
#SwitchLanguage img { border: none; }


/* PAGE FOOTER ---------------------------------
And this also holds the bottom of the box together -------------------------------------- */
#Footer { width: 760px; height: 34px; padding: 0px 40px; color: #427BB5; text-align: right; }
#Footer a:link, #Footer a:visited { color: #6699FF; }




#flashbar { width: 385px; float: left;   }



#lights { margin: 0 0 10px 0; clear: both; }