@charset "utf-8";
body  {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	margin: 0; 
	padding: 0;
	color: #000000;
}
#topbg { width : 932px; height:17px;background-image : url(../images/bodybg-top-grey.gif);margin:0 auto;margin-top:30px;} 
#botbg { width : 932px; height:17px;background-image : url(../images/bodybg-bot-grey.gif);margin:0 auto;margin-bottom:30px;} 
 #container { 
	width: 932px;  
	background: url(../images/bodybg-cen-grey.gif) repeat-y;
	margin: 0 auto;
} 

/* HEADER START*/

#header {} 
.box {float:left;padding-left:50px;margin-top:40px;position:relative;}
.search { width : 247px; height:31px;background-image : url(../images/search-bg.gif);float:left;}
.search input {background:none;border:0px;height:22px;width:240px;color:#ffffff;margin-left:5px;margin-top:5px;}
.submit { width : 41px; height:31px;background-image : url(../images/gobutton.gif);float:left;}
.submit input {background:none;border:0px;height:27px;width:41px;font-size:0px;cursor:pointer;}
.logo { width : 252px;height : 92px;margin-top : 15px;padding-left : 30px;float:left;}
.logo a img {border:0px;}
#header h1 {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	padding: 10px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
}

.syn-logo {width:168px;height:40px;float:left;padding-left:110px;padding-top:10px;border:0px;}
.syn-logo a img {border:0px;}
.access {float:right;padding-right:45px;padding-top:20px;}
.access ul {display:block;list-style-type:none;}
.access ul li {float:left;padding:10px 0px 0px 10px; }
.access ul li a {border:0px;}
.access ul li a img {border:0px;}
.separator {width:10px;}
/*.small {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:20px;color:#000000;}
.big {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:24px;color:#000000;}
.bigger {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:28px;color:#000000;}*/
#WB {background:url(../images/colour_whibla_new.gif) no-repeat;margin-top:10px;}
#YB {background:url(../images/colour_yelbla_new.gif) no-repeat;margin-top:10px;}
#OB {background:url(../images/colour_grebla_new.gif) no-repeat;margin-top:10px;}
#BY {background:url(../images/colour_blayel_new.gif) no-repeat;margin-top:10px;}
.menu-bg { width:846px; height:42px; background:url(../images/menu-bg.gif) no-repeat;margin:0 auto;}
.menu-bg ul {width:550px;display:block;list-style-type:none;padding-left:175px;text-align:center;}
.menu-bg ul li {float:left;width:auto;padding:10px 20px 10px 10px;margin:0 5px 0 0;text-align:center;}
/*.menu-bg ul li:hover {background:#001577;height:22px;}*/
.menu-bg ul li a {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:14px;color:#000000;text-decoration:none;font-weight:normal;text-align:center;}
body#home li#honav  {background:url(../images/menu-hover.gif) no-repeat;height:42px;color:#ffffff}
body#home li#honav a  {color:#ffffff}
body#home li#abnav:hover, li#galnav:hover, li#usenav:hover, li#connav:hover  {background:url(../images/menu-hover.gif) no-repeat;height:42px;color:#ffffff}
body#home li#abnav a:hover, li#usenav a:hover, li#galnav a:hover, li#connav a:hover  {color:#ffffff}

body#about li#abnav  {background:url(../images/menu-hover.gif) no-repeat;height:42px;color:#ffffff}
body#about li#abnav a  {color:#ffffff}
body#about li#honav:hover, li#galnav:hover, li#usenav:hover, li#connav:hover  {background:url(../images/menu-hover.gif) no-repeat;height:42px;color:#ffffff}
body#about li#honav a:hover, li#galnav a:hover, li#usenav a:hover, li#connav a:hover  {color:#ffffff}

body#gallery li#galnav  {background:url(../images/menu-hover.gif) no-repeat;height:42px;color:#ffffff}
body#gallery li#galnav a  {color:#ffffff}
body#gallery li#abnav:hover, li#honav:hover, li#usenav:hover, li#connav:hover  {background:url(../images/menu-hover.gif) no-repeat;height:42px;color:#ffffff}
body#gallery li#abnav a:hover, li#honav a:hover, li#usenav a:hover, li#connav a:hover  {color:#ffffff}

body#useful li#usenav  {background:url(../images/menu-hover.gif) no-repeat;height:42px;color:#ffffff}
body#useful li#usenav a  {color:#ffffff}
body#useful li#abnav:hover, li#honav:hover, li#galnav:hover, li#connav:hover  {background:url(../images/menu-hover.gif) no-repeat;height:42px;color:#ffffff}
body#useful li#abnav a:hover, li#honav a:hover, li#galnav a:hover, li#connav a:hover  {color:#ffffff}

body#contact li#connav  {background:url(../images/menu-hover.gif) no-repeat;height:42px;color:#ffffff}
body#contact li#connav a  {color:#ffffff}
body#contact li#honav:hover, li#galnav:hover, li#usenav:hover, li#abnav:hover  {background:url(../images/menu-hover.gif) no-repeat;height:42px;color:#ffffff}
body#contact li#honav a:hover, li#galnav a:hover, li#usenav a:hover, li#abnav a:hover  {color:#ffffff}


/*SIDEBAR START*/
#sidebar1 {
	float: right; /* since this element is floated, a width must be given */
	width: 208px; /* 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 */
	 /* the background color will be displayed for the length of the content in the column, but no further */
	padding:10px 45px 0px 10px;
}

.sidebox-top {width:208px; height:6px;background:url(../images/sidebox-top.gif) no-repeat;}
.sidebox-cen {width:208px;background:url(../images/sidebox-cen.gif) repeat-y;}
.sidebox-cen span {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:16px;color:#001577;text-align:left;padding:10px 0px 10px 10px;font-weight:bold;}
.sidebox-cen p {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:13px;color:#000000;text-align:left;padding:0px 10px 10px 10px;}
.sidebox-bot {width:208px; height:6px;background:url(../images/sidebox-bot.gif) no-repeat;}
p {margin:0;padding:0;}
.read { font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:12px;color:#001577;font-weight:bold;text-decoration:underline;text-align:right;}

/*SIDEBAR END*/


#mainContent { width:620px;float:left;position:relative;
 /* 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: 0 0 0 42px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
} 
#mainContent h1 {padding:5px 0px 10px 0px;margin:0;font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:24px;color:#001577;text-align:left;}
#mainContent h5 {padding:5px 0px 10px 0px;margin:0;font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:16px;color:#001577;text-align:left;}
#bodytext {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:13px;color:#000000;text-align:left;padding:0px 10px 10px 0px;}
#mainContent p span input {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:13px;color:#000000;text-align:left;}
#mainContent p span textarea {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:13px;color:#000000;text-align:left;}
#mainContent h2 {padding:10px 0px 10px 0px;margin:0;font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:18px;color:#001577;text-align:left;font-weight:normal;}
/*.mainContent p {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:13px;color:#000000;text-align:left;padding:10px 10px 10px 10px;}*/
.bodytext {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:13px;color:#000000;text-align:left;padding:0px 10px 10px 0px;}

#footer { 
	width:830px;padding: 0 10px 0px 20px;margin:20px 0 0 0; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	 
} 

.spacer {background:url(../images/separator-line.png) no-repeat;width:846px;height:1px;margin-top:15px;margin-left:30px;}

.link {width:580px;}
.link p {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:13px;color:#000000;text-align:left;padding: 0px 0 10px 30px;
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	 /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}

.link p a {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:13px;text-decoration:none;color:#000000;text-align:left;padding: 10px 0 10px 0px;
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	 /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}

.copyright {width:250px;float:right;}

.copyright p {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:13px;color:#000000;text-align:right;
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	 /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}

.copyright p a {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;font-size:13px;text-decoration:none;color:#000000;text-align:left;
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	 /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}


.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}
.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;
}

.clear {clear:both;}



.normalview p{ /*CSS to return page to default setting (with no additional CSS rules added)*/

}

.largeview p{ /*CSS for "large font" setting*/
font-size: 16px;
}

.xlargeview p{ /*CSS for "extra large font" setting*/
font-size: 18px;
}