body {padding:0; margin:0; line-height: 20px; background: url(../images/bg.gif);}
#frame body{background:#666;}

#wrapper {margin:0 auto;}

#content-container-bg {background: url(../images/header_shadow.png) repeat-x left top; background-position: 0px 0px; min-width: 1000px;}
#content-container {width: 960px; margin:0 auto;	}

#top {height: 169px; background: #2d2f32 url(../images/top.gif) repeat-x left top; clear: both; min-width: 1000px;}

#logo {width: 424px; height: 112px; float: left;}
#logo a {display: block;}

#top-right {width: 524px; height: 112px; float: left; padding-right: 12px;}
#top-right h3 {margin: 0; color: #458ac7;}	
#top-right span {margin: 0; color: #aaa; font-size: 12px; font-weight: bold;}	

#top-items {background: url(../images/light.png) no-repeat left top; width: 1000px; height: 112px; margin: 0 auto;	}

#navmenu-container {height: 57px; background: url(../images/navmenu_bg.png) repeat-x left top; padding: 0; margin: 0; clear: both; z-index: 999;}
	
#nav-menu {width: 960px; margin: 0 auto; padding-top: 9px; padding-left: 7px;	 z-index: 999; display: block;}

#content { padding-bottom: 18px;  padding-top: 3px;}
#content #left {width: 310px; float: left;}
#content  #main {width: 635px; float: left;}
	
/* for 3 equal columns, use this classes */
/* but you have to add the class "margin-left-15 to the 2nd and 3rd column. see layout.html */
#content .column-left, #content .column-center, #content .column-right {width: 310px; float: left;}

#header-bg {height: 279px; background: url(../images/header_bg.gif) repeat-x left top; min-width: 1000px;}	
#header-subpage-bg {height: 19px; background: url(../images/header_subpage_bg.gif) repeat-x left bottom;}	
#header-container {width: 960px; margin: 0 auto; height: 260px; padding-top: 19px; z-index: 0;}
#header-image-container {float: left; width: 572px; height: 242px; background: url(../images/header_image_container.png) no-repeat left top; z-index: 0;}
#header-description-container {float: left; z-index: 0; margin-left: 17px; color: #e6e6e6; overflow: hidden;}
#header-description-container h2 {color: #89bdf2;	}
#header-description-container .darker {color: #7ba1da;}
#header-description-container li {color: #e2e2e2; font-weight: bold; padding: 1px 0px;}
#header-description-container #header-description {overflow: hidden;}
#header-description-container .header-more {font-weight: bold; font-size: 14px; color: #fff;}
	
/*===============
BOX STYLES
*/

.box, .box-2, .box-3 {margin-top: 15px; float: left;}
.box-top {width: 310px; height: 5px; background: url(../images/box_top.png) no-repeat top; float: left; overflow: hidden;}
.box-center {width: 310px; float: left;	 background: url(../images/box_content_bg.png) repeat-y top;}
.box-content-container {padding: 0px 5px; width: 300px; float: left;}
.box-content {background: #f2f2f2; float: left;}
.box-padding {background: #f2f2f2 url(../images/box_content.png) repeat-x top; padding: 20px 20px; padding-bottom: 20px; padding-top: 0px; float: left; width: 260px;}
.box-padding p  {padding-top: 8px; margin: 0px;}
.box-padding h2, .box-padding h3  {background: url(../images/h2_bottom.gif) repeat-x bottom; margin-top: 0px; margin-bottom: 7px; padding-bottom: 6px; padding-top: 11px; margin-top: 10px; margin-bottom: 0;}
.box-padding h3.small{font-size:13px; margin:15px 0 2px 0; padding:0;}
.box-padding .posted {background-color: #5588bb; border: 1px #337799 solid; padding-left: 10px; font-size: 11px; margin-top: 20px; color: #fff; font-weight: bold;}

.box-header, .box-2-header, .box-3-header {clear: both; width: 300px; /* let's take off 10px for the box-border giving us 300px */float: left; height: 45px; background: url(../images/box_header.png) repeat-x top;}
.box-header h2, .box-2-header h2, .box-3-header h2 {margin: 0; padding-top: 11px; padding-left: 10px; font-size: 20px; font-family: "Lucida Grande",sans-serif;}
.box-content .box-padding img{display: block;}
.box-prefooter {color: #888; font-size: 12px;}
.box-prefooter-padding {float: left; padding: 0px 20px; padding-bottom: 10px;}
.box-footer {width: 100%; height: 44px; background: url(../images/box_footer.gif) repeat-x top; font-weight: bold; font-size: 11px; float: left; line-height: 26px;}
.box-footer-padding {padding: 10px 8px;}
.box-footer .comments {background: url(../images/comments.png) no-repeat left top; padding-left: 9px;}
.box-footer .comments a {color: #999;}
.box-footer .comments span {padding-left: 15px; color: #888;}
.box-footer .post {margin-left: 20px;}
.box-footer .post .button, .box-footer .post .button-light {margin-right: 0;}
	
	
.box-bottom  {width: 310px; height: 5px; background: url(../images/box_bottom.png) no-repeat top; float: left; overflow:hidden;}
	
/* larger box  */
	
.box-2 .box-top {width: 635px; background: url(../images/box_2_top.png) no-repeat top;}
.box-2 .box-center {width: 635px; float: left; background: url(../images/box_2_content_bg.png) repeat-y top;}
.box-2 .box-header {width: 625px;}				
.box-2 .box-content-container  {width: 625px; }
.box-2 .box-content {width: 625px; }
.box-2 .box-padding  {width: 585px; }
.box-2 .box-padding img{margin:15px 15px 10px 15px;}
.box-2 .box-bottom  {width: 635px; background: url(../images/box_2_bottom.png) no-repeat top;}
	
/* largest box */
	
.box-3 .box-top {width: 960px; background: url(../images/box_3_top.png) no-repeat top;}
.box-3 .box-center {width: 960px; float: left; background: url(../images/box_3_content_bg.png) repeat-y top;}
.box-3 .box-header {width: 950px;}				
.box-3 .box-content-container  {width: 950px; }
.box-3 .box-content {width: 950px; }
.box-3 .box-padding  {width: 910px; }
.box-3 .box-bottom  {width: 960px; background: url(../images/box_3_bottom.png) no-repeat top;}
	
/* footer theme */

#footer {margin: 0 auto; font-size: 11px;}

.menu {margin: 0; padding: 0; list-style: none; margin-top: 20px;}
.menu li {float: left; padding: 0 10px; margin: 0;}
.menu li a {padding: 0; margin-top: 20px;}
.menu li a.current {font-weight: bold;}

/* porfolio styles */

.portfolio-item ul {list-style: none; margin: 0; margin-top: 10px;}
.portfolio-item ul li {padding: 2px 0px 2px 15px; background: url(../images/arrow.gif) no-repeat left; font-weight:100;}
.portfolio-image, .portfolio-description {float: left;}
.portfolio-image {width: 270px;}
.portfolio-description {width: 305px; margin-left:10px; padding-top:15px;}


.vertical-menu {list-style: none; padding: 0; margin: 0;}
.vertical-menu li {float: left; width: 100%; background:url(../images/dotted_border.png) repeat-x bottom left;}
.vertical-menu li a {display: block; padding: 5px 0px 5px 15px;background:url(../images/dotted_arrow.png) no-repeat left;}

.testimonial {width: 100%;}
#content .testimonial blockquote {margin: 0; padding:0px 0px 0px 30px; background:url(../images/quote.png) no-repeat 0px 20px;}
#content .testimonial blockquote p.quote{text-align:left; font-size:17px; color:#777; font-family:Georgia, "Times New Roman", Times, serif; font-style:italic;	}
#content .testimonial blockquote p.author{text-align:right; font-size:12px; color:#999; font-weight:bold; font-family: Tahoma, arial; font-style:normal;	}

/*misc */

.clear {clear: both;}

.float-left {float: left;}
.float-right {float: right;}

.display-none {display: none;}

.image-margin-left {margin:0 10px 3px 0;}
.image-margin-right {margin:0 0 3px 10px;}
.image-left, .image-border, .image-right{padding:3px; margin:0 10px 3px 0; border:1px #ccc solid; background: #fdfdfd;}

.image-border {margin:0;}
.image-right {margin:0 0 3px 10px;}
.image-left-small, .image-right-small, .image-border-small {padding:3px 3px; margin:0 10px 0 0; border:1px #aaa solid; background: #fdfdfd;}
.image-right-small {margin:0 0 0 3px;}
.image-border-small {background:#fff;}

.center-content h2 {margin-top: 10px;}

.padding-7 {padding: 7px;}
.padding-8 {padding: 7px;}
.padding-10 {padding: 10px;}
.padding-15 {padding: 15px;}
.padding-20 {padding: 20px;}
.padding-top-20 {padding-top: 20px;}
.margin-left-5 {margin-left: 5px;}
.margin-right-5 {margin-right: 5px;}
.margin-left-15 {margin-left: 15px;}
.margin-right-15 {margin-right: 15px;}

.textblock {border: 1px #bbb solid; padding: 10px; background-color: #f9f9f9; margin-top: 10px;}

.more {font-weight: bold;}

/* CSS sliding doors button */

a.button, a.button-light,a.button-header { /* Sliding right image */ background: transparent url('../images/button.gif') no-repeat scroll top right;  display: block; float: left; height: 27px; margin-right: 6px; padding-right: 20px; text-decoration: none; font-size:12px; font-weight:bold;}
a.button span, a.button-light span, a.button-header span {background: transparent url('../images/button.gif') no-repeat;  display: block; line-height: 16px; /* CHANGE THIS VALUE ACCORDING TO BUTTON HEIGHT */ padding: 6px 0 5px 18px; color: #fff;} 
a.button:hover, a.button-light:hover, a.button-header:hover  {background-position: right -155px;}
a.button:hover span, a.button-light:hover span, a.button-header:hover span {background-position: left -155px;}
a.button-light{background: transparent url('../images/button_2.gif') no-repeat scroll top right; }
a.button-light span {color: #777;background: transparent url('../images/button_2.gif') no-repeat; }
a.button-header {background: transparent url('../images/button_header.gif') no-repeat scroll top right; }
a.button-header span {
background: transparent url('../images/button_header.gif') no-repeat; }

/* Easy Slider */

#slider{margin:0; padding:0; position: relative; left: 0px;}	
#slider ul, #slider li{margin:0; padding:0; list-style:none;}
#slider li{ width:552px;height:222px;}	
	
#prevBtn, #nextBtn{ display:block; width:37px; height:45px; position:relative; left:465px; top:-12px;	 float: left;margin-top: -37px;}	
#nextBtn{ left:468px;}														
#prevBtn a, #nextBtn a{  display:block; width:37px; height:40px; background:url(../images/arrow_left.png) no-repeat 0 0;	}	
#prevBtn a:hover, #nextBtn a:hover {background-position: left -40px;}
#nextBtn a{ background:url(../images/arrow_right.png) no-repeat 0 0;	}												

/* use form-button class for input button tags. */

input.form-button {padding: 5px 15px; font: bold 1em arial, sans-serif; cursor: pointer; color: red; background-color: #222; border-width: 1px; border-style: solid; border-color: #ccc #bbb #bbb #ccc; background: url(../images/gradient.gif) repeat-x;}

/* search block style */
#top-right .container-inline {margin: 0; padding: 0;}
#top-right {float: right;}

#block-search {float: right; margin-top: 28px; width: 271px; height: 73px; padding: 0;}
#block-search .content {padding: 0;	 padding-left: 0px;	 padding-right: 5px;}
#block-search h2 {display: none;}
#block-search .form-item {margin: 0; padding: 0;float: left;}
#block-search #edit-search-wrapper {background: url(../images/search_field.png) no-repeat top left; width: 181px; height: 23px; padding: 6px 3px;}
#block-search #edit-search  {border: none; width: 175px; margin: 0; background: none; color: #999;	 outline: none;}
#block-search  .form-submit {height: 33px; background: url(../images/search_button.png) no-repeat top left; margin-top: 0px; width: 67px; border: none; margin-left: 6px; font-weight: bold; color: #aaa; padding-top: 0;}


/*=================================
Superfish
*/

/*** ESSENTIAL STYLES ***/
.sf-menu, .sf-menu * {margin:0; padding:0; list-style:none;}
.sf-menu {
	line-height:	1.0;
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			10em; /* left offset of submenus need to match (see below) */
	
}
.sf-menu ul li {
	width:			100%;
	
}
.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
	
}
.sf-menu li {
	float:			left;
	position:		relative;
	z-index: 11;

}

.sf-menu li li {
	width: 200px;
	z-index: 11;
}

.sf-menu a {
	display:		block;
	position:		relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0px;
	top:			48px; /* match top ul list item height */
	z-index:		99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			202px; /* match ul width */
	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			202px; /* match ul width */
	top:			0;
	
}

/*** DEMO SKIN ***/
.sf-menu {
	float:			left;
	margin-bottom:	1em;
	padding-right: 2px;
	background: url(../images/menu_border.gif) no-repeat right top;
	
}
.sf-menu a {
	background: url(../images/menu_border.gif) no-repeat left top;
	padding: 		18px 30px 17px 30px;
	text-decoration:none;
}
.sf-menu li li a {
	padding: 		12px 20px 12px 20px;
}

.sf-menu .current {
	background: url(../images/navmenu_current2.png) no-repeat left top;
}

.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	color: #999;
	font-weight: bold;
}


.sf-menu li li  a{
	background: #2e2e2e url(../images/border_top.gif) repeat-x left top;
}
.sf-menu li li {
	border-right: 1px #1d1d1d solid;
	padding-left: 2px;
	background: #222 url(../images/border_left.gif) no-repeat left top;
}
.sf-menu ul {
	border-bottom: 1px #1d1d1d solid;
	width: 203px;
}
.sf-menu li li li {
	border-right: 1px #1d1d1d solid;
	padding-left: 2px;
	background: #222 url(../images/border_left.gif) no-repeat left top;
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
	background: url(../images/navmenu_current2.png) no-repeat left top;
	outline:0;
	color: #999;
}



.sf-menu li li a, .sf-menu li li a:visited  { /* visited pseudo selector so IE6 applies text colour*/
	color: #b7b7b7;
	font-weight: bold;

}



.sf-menu li li:hover, .sf-menu li li.sfHover,
.sf-menu li li a:focus, .sf-menu li li a:hover, .sf-menu li li a:active {
	outline: 0;
}

.sf-menu li li a:focus, .sf-menu li li a:hover, .sf-menu li li a:active {
	background: #272727 url(../images/border_top_hover.gif) repeat-x left top;
}


/*** arrows **/
.sf-menu a.sf-with-ul {
	padding-right: 	2.25em;
	min-width:		1px; /* trigger IE7 hasLayout so spans position accurately */
}
.sf-sub-indicator {
	position:		absolute;
	display:		block;
	right:			11px;
	top:			23px; /* IE6 only */
	width:			10px;
	height:			10px;
	text-indent: 	-999em;
	overflow:		hidden;
	background:		url('../images/arrows-menu.gif') no-repeat -0px -100px; /* 8-bit indexed alpha png. IE6 gets solid image only */
}

.sf-menu li li .sf-sub-indicator {
	top:			15px; /* IE6 only */
}

a > .sf-sub-indicator {  /* give all except IE6 the correct values */
	top:			20px;
	background-position: 0 -100px; /* use translucent arrow for modern browsers*/
}

.sf-menu li li a > .sf-sub-indicator {  /* give all except IE6 the correct values */
	top:			13px;
}

/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
	background-position: -10px -100px; /* arrow hovers for modern browsers*/
}

/* point right for anchors in subs */
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
	background-position: -10px 0; /* arrow hovers for modern browsers*/
}

/*** shadows for all but IE6 ***/
.sf-shadow ul {
	background:	url('../images/shadow.png') no-repeat bottom right;

}
.sf-shadow ul.sf-shadow-off {
	background: transparent;
}
