* {	padding: 0;	margin: 0; border: 0; }
body, html {
	color: #8b8b8b;
	font-family: Arial, Tahoma, sans-serif;
	text-align: center; /*** Centers design in old IE versions ***/
	height: 100%;
	background-color:#efefef;
}
body {	font-size: 11px; line-height: 15px; }
.head {
	height: 10px; font-size: 12px; }
.icon {
	height: 20px;
	width: 12px;
	padding: 2px;
}
p {	padding: 7px 0 7px 0; }
a {	color: #8b8b8b;
	text-decoration: underline ;
}
a:hover {
	color: #8b8b8b;
	background-color: #fff;
	text-decoration: none;	
}

li {
	margin-bottom: 0px;
	padding-bottom: 5px;
	list-style-position: outside;
	margin-left: 5px;
}
ul {
     margin: 0px 0px 0px 10px ;
     padding: 7px 0px 7px ;
     border-width: 0px ;
	 list-style: inside;
}

h1 {
	font-size: 15px;
	color: #9aca3c;
	padding-top: 10px;
}
h2 {
	font-size: 13px;
	font-weight: normal;
	line-height: 16px;
	padding: 7px 0 7px 0;
}

#twitter a {
	color:#333;
}
#twitter a:hover {
	color:#333;
	background-color:#FFF;
}

.header {
	font-size: 15px;
	font-weight: normal;
	padding-bottom: 30px;
}
.form {
	font-size: 11px;
	color:#000000;
}
.red {
	font-size: 11px;
	color:#C00;
}
.clear { clear: both; }

#OutermainContainer {
	width: 780px;
	margin: 0 auto; /*** Centers the design ***/
	min-height: 100%;
	background-color: #FFF;
	background-image: url(images/edge.gif);
	background-repeat: repeat-y;
	padding-left: 0px;
	padding-right: 0px;
}
* html #OutermainContainer {
	height: 100%;  /*** IE doesn't support min-height, but instead it handles height as min-height so we need to hack the height ***/
}

#mainContainer {
	width: 780px;
	min-height: 100%;
	text-align: left; /*** Because centered the text in body have to move the text back to left aligning ***/
	padding-left: 0px; 
	padding-bottom: 0px;
	background-image: url(images/top.gif);
	background-repeat: no-repeat;
}
* html #mainContainer {
	height: 100%;  /*** IE doesn't support min-height, but instead it handles height as min-height so we need to hack the height ***/
}

/*********************************************** LAYOUT ***************************************************/

#container { 
	width: 780px;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	text-align: left; /* this overrides the text-align: center on the body element. */
}
#sidebar1 {
	float: left; /* since this element is floated, a width must be given */
	width: 200px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width - was 240 */ 
	padding-top: 115px;
	height: 150px;
}
#mainContent { 
	margin-left: 245px; /* the left margin on this div element creates the column down the left side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	padding-right: 70px;
	padding-left: 0px;
	margin-bottom: 80px;
	padding-top: 155px;
}
#mainContent-websites { 
	margin-left: 245px;
	padding-right: 50px;
	padding-left: 0px;
	margin-bottom: 80px;
	padding-top: 155px;
}

.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}

#twit a {
	text-decoration: underline;
	color:#282828;
}
#twit a:hover{
	background-color: #fff;
	color:#FFFFFF;
	text-decoration: none;
}

#mainContent a {
	text-decoration: underline;	color:#282828;
}
#mainContent a:hover{
	background-color: #282828;
	color:#FFF;
	text-decoration: none;
}

#mainContent-websites a {
	text-decoration: underline;	color:#282828;
}

#mainContent-websites a:hover{
	background-color: #282828;
	color:#FFF;
	text-decoration: none;
}

.cleaner {
	clear: both;
	height: 1px;
	font-size: 1px;
	border: none;
	margin:0; padding:0;
	background: transparent;
}


/*********************************** MENU *******************************************/
#nav-menu {
	width: 130px;
	padding-left: 49px;
	padding-top: 0px;
}



#home {
	width: 61px;
}
#home a {
	height: 19px;
	display: block;
	background-image:url(images/menu/home.gif);
	background-repeat:no-repeat;
}
#home a:hover {
	background-image:url(images/menu/home_o.gif);
	background-repeat:no-repeat;
}
#home-s a {
	width: 61px;
	height: 19px;
	display: block;
	background-image:url(images/menu/home_s.gif);
	background-repeat:no-repeat;
}
#home-s a:hover {
	background-image:url(images/menu/home_o.gif);
	background-repeat:no-repeat;
}

#websites {
	width: 95px;
	margin-left: 1px;	
}
#websites a {
	height: 22px;
	margin-left: 0px;
	display:block;
	background-image:url(images/menu/websites.gif);
	background-repeat:no-repeat;
}
#websites a:hover {
	background-image:url(images/menu/websites_o.gif);
	background-repeat:no-repeat;
}
#websites-s {
	width: 95px;
	margin-left: 1px;	
}
#websites-s a {
	height: 22px;
	margin-left: 0px;
	display:block;
	background-image:url(images/menu/websites_s.gif);
	background-repeat:no-repeat;
}
#websites-s a:hover {
	background-image:url(images/menu/websites_o.gif);
	background-repeat:no-repeat;
}
#printed {
	width: 70px;
	margin-left: 5px;
}
#printed a {
	height: 24px;
	margin-left: 0px;
	display: block;
	background-image:url(images/menu/printed.gif);
	background-repeat:no-repeat;
}
#printed a:hover {
	background-image:url(images/menu/printed_o.gif);
	background-repeat:no-repeat;
}
#printed-s {
	width: 70px;
	margin-left: 5px;
}
#printed-s a {
	height: 24px;
	margin-left: 0px;
	display: block;
	background-image:url(images/menu/printed_s.gif);
	background-repeat:no-repeat;
}
#printed-s a:hover {
	background-image:url(images/menu/printed_o.gif);
	background-repeat:no-repeat;
}

#visuals {
	width: 75px;
	margin-left: 7px;
}
#visuals a {
	height: 22px;
	display:block;
	background-image:url(images/menu/visuals.gif);
	background-repeat:no-repeat;
}
#visuals a:hover {
	background-image:url(images/menu/visuals_o.gif);
	background-repeat:no-repeat;
}
#visuals-s {
	width: 75px;
	margin-left: 7px;
}
#visuals-s a {
	height: 22px;
	display:block;
	background-image:url(images/menu/visuals_s.gif);
	background-repeat:no-repeat;
}
#visuals-s a:hover {
	background-image:url(images/menu/visuals_o.gif);
	background-repeat:no-repeat;
}

#branding {
	width: 95px;
	margin-left: 12px;
}
#branding a {
	height: 24px;
	display:block;
	background-image:url(images/menu/branding.gif);
	background-repeat:no-repeat;
}
#branding a:hover {
	background-image:url(images/menu/branding_o.gif);
	background-repeat:no-repeat;
}
#branding-s {
	width: 95px;
	margin-left: 12px;
}
#branding-s a {
	height: 24px;
	display:block;
	background-image:url(images/menu/branding_s.gif);
	background-repeat:no-repeat;
}
#branding-s a:hover {
	background-image:url(images/menu/branding_o.gif);
	background-repeat:no-repeat;
}



#contact {
	width: 80px;
	margin-left: 14px;
}
#contact a {
	height: 24px;
	margin-left: 0px;
	display:block;
	background-image:url(images/menu/contact.gif);
	background-repeat:no-repeat;
}
#contact a:hover {
	background-image:url(images/menu/contact_o.gif);
	background-repeat:no-repeat;
}
#contact-s {
	width: 80px;
	margin-left: 14px;
}
#contact-s a {
	height: 24px;
	margin-left: 0px;
	display:block;
	background-image:url(images/menu/contact_s.gif);
	background-repeat:no-repeat;
}
#contact-s a:hover {
	background-image:url(images/menu/contact_o.gif);
	background-repeat:no-repeat;
}

	
/************************** FOOTER **************************/
#footer2 {
	width: 780px;
	height: 70px; /*** Height of the footer not be flexible. If you add so much content to the footer that it extends more than set height get vertical scrollbar and content overflow
	footer if you don't set overflow to hidden ***/
	margin: 0 auto;
	margin-top: -70px; /*** By using a negative margin-top we now move the footer up the same amount as the footer height to avoid vertical scrolling.
	If use borders and padding on footer need to calculate this in your negative margin-top value also. ***/
	text-align: right;
	padding: 0px;
}
#footer2 a {
	color: #9aca3c;
	text-decoration: underline;
	padding-right: 0px;	
}
#footer2 a:hover {
	color: #9aca3c;
	text-decoration: none;
}
.cop {
	color: #bcbdbd;
	text-decoration: none;
	line-height: 15px;
	padding-left: 0px;
}
.des {
	color: #bcbdbd;
	text-decoration: none;
	padding-right: 0px;
}


#footer-copyright {
	float: right;
	width: 290px; height: 50px;
	padding-left: 0px; padding-right: 33px;
	padding-top: 0px;
}
.footer-name {
	height: 50px;
	padding-top: 15px;
	float: left;
	width: 59px;
	display:block;
}


/************************** TABLE **************************/
.cell1a {
	float: left;
	width: 207px;
	height: 235px;
}
.cell1b {
	float: left;
	width: 207px;
	margin-left: 40px;
	height: 235px;
}
.cell2a {
	float: left;
	width: 207px;
	height: 255px;
}
.cell2b {
	float: left;
	width: 207px;
	margin-left: 40px;
	height: 255px;
}
.cell3a {
	float: left;
	width: 207px;
	height: 258px;
}
.cell3b {
	float: left;
	width: 207px;
	margin-left: 40px;
	height: 258px;
}


.row1 {
	width: 480px;
	height: 235px;
}
.row2 {
	width: 480px;
	height: 255px;
}
.row3 {
	width: 480px;
	height: 258px;
}


.cell-cont {
	float:left;
	width: 110px;
	height: 30px;
}
.cell2-cont {
	float:left;
	width: 110px;
	height: 30px;
}
.startCell-cont {
	clear:both;
	float:left;
	width:25%;
}
.row-cont {
	margin-top:10px;
	height:20px;
}
.row2-cont {
	margin-top: 105px;
	padding-top: 10px;
	height:30px;
}