@Import url('reset.css');

*, html, body
{
    background: #c6ddde url('Images/body_bg.jpg') repeat-x Top Left;
    width: 100%;
}
body
{
    background: #c6ddde url('Images/body_bg.jpg') repeat-x;
    font-family: Georgia, Times New Roman;
    color: #78807e;
}
#container
{
    background: url('Images/content_bg.jpg') no-repeat right 400px;
    position: relative;
    width: 970px;
    margin: 0 auto;
    overflow: hidden;
}
#header
{
    position: relative;
    background: #c6ddde url('Images/header_bg.jpg') no-repeat top center;
    height: 159px;
}
#header .logo
{
    margin: 35px 0 0 35px;
    display: inline-block;
    width: 329px;
    height: 93px;
}
#header .contact
{
    position: absolute;
    top: 0;
    right: 0;
    text-align: right;
    font-size: .8em;
    font-weight: bold;
    margin: 5px 70px 0 0;
}
#outerContainer
{
    width: 880px;
    background: #FFF;
    margin: 0 auto;
    padding: 10px;
}
#innerContainer
{
    position: relative;
    background: #FFF url(images/nav_bg.jpg) repeat-y right -10px;
}
#content
{
    width: 652px;
    float: left;
}
#nav
{
    position: relative;
    float: right;
    width: 216px;
    text-align: right;
    padding: 10px 0 155px 0;
    color: #FFF;
}
#innerContainer .tree
{
    position: absolute;
    bottom: 0px;
    right: 0;
    background: url('Images/nav_tree.jpg') no-repeat;
    display: inline-block;
    width: 155px;
    height: 89px;
}
#footerContainer
{
    position: relative;
    width: 900px;
    margin: 0 auto;
}
#footer
{
    height: 244px;
    background: #c6ddde url('Images/footer_bg.jpg') no-repeat top center;
    clear: both;
}
h1
{
    text-align: center;
    font-style: italic;
    font-size: 1.5em;
    background: url('Images/line.png') no-repeat center bottom;
    padding-bottom: 40px;
}
h2
{
    font-style: italic;
    font-size: 1.2em;
    margin: 10px;
}
a
{
    color: #bfc6b3;
    text-decoration: underline;
}
#content img
{
    border: double 3px #78807e;
}
#main_image img
{
    border: none;
}
.letter_a span, .letter_e span, .letter_f span, .letter_p span, .letter_w span, letter_u span
{
    display: none;
}
.letter_a, .letter_e, .letter_f, .letter_p, .letter_w, .letter_u
{
    display: block;
    float: left;
    margin: 0 5px 0 0;
}
.letter_a
{
    width: 71px;
    height: 38px;
	background: url('../../Images/Letters/A.png') no-repeat;
}
.letter_e
{
    width: 48px;
    height: 38px;
	background: url('../../Images/Letters/E.png') no-repeat;
}
.letter_f
{
    width: 64px;
    height: 38px;
	background: url('../../Images/Letters/F.png') no-repeat;
}
.letter_p
{
    width: 60px;
    height: 38px;
	background: url('../../Images/Letters/p.png') no-repeat;
/*	padding: 20px 0 0 35px;*/
}
.letter_u
{
    width: 55px;
    height: 41px;
	background: url('../../Images/Letters/U.png') no-repeat;
}
.letter_w
{
    width: 83px;
    height: 44px;
	background: url('../../Images/Letters/W.png') no-repeat;
}
.clear
{
    clear: both;
}
.quotes
{
    display: inline-block;
    width: 200px;
    padding: 10px 0 10px 36px;
	background: #f2f5f4 url('Images/quote.png') no-repeat 5px 5px;
}
blockquote
{
	line-height: 1.5em;
	font-size: 1em;
	font-weight: bold;
	font-style: italic;
}
.line_dark
{
	background: url('Images/line_dark.png') no-repeat center top;
	width: 100%;
	height: 23px;
	margin: 10px 0 20px 0;
}
.colored
{
    /*background: #f7fcfc url('Images/flower_white.png') no-repeat -100px -100px;*/
}
.float-left
{
    float: left;
}
.float-right
{
    float: right;
}
.align-center
{
    text-align: center;
}
.type
{
    font-size: .8em;
    font-style: italic;
}
#nav a
{
    font-size: .9em;
    font-weight: bold;
    letter-spacing: .07em;
    color: #FFF;
    text-decoration: none;
}
#nav ul li
{
    width: 120px;
    margin: 12px 0;
    display: inline-block;
    padding-right: 40px;
}
#nav ul li:hover
{
    background: url('Images/nav_selected.png') no-repeat right top;
}
body#main_home li#homenav,
body#main_about li#aboutnav,
body#main_services li#servicesnav,
body#main_portfolio li#portfolionav,
body#main_contact li#contactnav,
body#main_news li#newsnav,
body#main_community li#communitynav
{
    background: url('Images/nav_selected.png') no-repeat right top;
}
#main_title
{
    display: inline-block;
    color: #FFF;
    width: 632px;
    background: #ccdbb4 url('Images/flower.png') no-repeat -100px -23px;
    padding: 10px;
}
#main_title p
{
    font-style: italic;
    font-size: 1.2em;
    line-height: 1.3em;
    margin: 10px 0;
}
#main_image
{
    width: 404px;
    height: 390px;
    float: right;
    margin: 10px 0 0 10px;
}
#main_right
{
    width: 490px;
    float: right;
}
#main_left
{
    display: inline-block;
    width: 150px;
    float: left;
    margin: 10px 0 0 0;
    height: 100%;
}
#main_left_front
{
    display: inline-block;
    width: 236px;
    float: left;
    margin: 10px 0 0 0;
    background: #FFF url('Images/Vine_Green.png') repeat-y top left;
    height: 100%;
}
#main_left_front .main
{
    line-height: 1.5em;
    font-weight: bold;
    display: inline-block;
    margin: 158px 0;
    text-align: center;
}
#main_left_front .letter_p
{
    display: inline;
    float: none;
    margin: 0;
    padding: 20px 0 0 30px;
}
#content .mainText
{
    margin-top: 10px;
}
.mainText p
{
    width: 470px;
    margin: 0 0 30px 0;
    padding: 10px;
    line-height: 1.3em;
    letter-spacing: .03em;
}
.title
{
    color: #bfc6b3;
    font-size: .8em;
    clear: both;
    float: left;
    margin: 0px 10px 15px 10px;
    font-weight: bold;
}
.newsBlock
{
    margin: 20px 0;
}
.newsBlock p
{
    display: inline-block;
    width: 458px;
    padding: 0px 0px 0px 30px;
    margin: 0;
}
.mainText ul, .main_left ul
{
    margin: 0 0 0 25px;
}
.mainText ul li, .main_left ul li
{
    margin: 10px 10px;
}
.mainText img
{
    margin: 10px;
}
#footer .members
{
    float: right;
    width: 300px;
    margin: 100px 0 0 0;
}
#footer .members li
{
    padding: 10px 0 0 10px;
    float: right;
    display: inline-block;
    height: 66px;
    width: 66px;
}
#footer .contact
{
    position: absolute;
    bottom: 0;
    left: 0;
    display: inline-block;
    float: left;
    width: 400px;
    font-size: .8em;
    font-weight: bold;
}

ul#filter, ul.tabs
{
    text-align: right;
    margin: 0;
}
ul#filter li, ul.tabs li
{
    margin: 10px 0;
}
ul#filter a, ul.tabs a
{
    color: #78807e;
    text-decoration: none;
}
ul#filter li.current a, ul#filter a:hover, ul.tabs li.current a, ul.tabs a:hover
{
    font-weight: bold;
}
ul#filter li.current a, ul.tabs li.current a
{
    font-weight: bold;
}
.portfolio
{
    list-style: none;
    margin: 0;
    width: 490px;
}
.portfolio li  
{
	float: left; 
	padding: 5px 6px 5px 5px;
	width: 205px;
    margin: 0px 15px 10px 15px;
}
.portfolio a
{
    color: #78807e;
    display: block;
    width: 100%;
}
.portfolio a:hover
{
    text-decoration: none;
}
.portfolio img
{
    display: block;
    margin: 0;
}

/***************    Contact Form    *****************/
#contact_form
{
    margin: 0 0 0 65px;
    width: 210px;
}
#contact_form p
{
    margin: 0;
    padding: 0;
    width: 210px;
}
span.error
{
	display:none;
	color: #f24949;
}
#contact_form input, #contact_us textarea, .message_box
{
	width: 200px;
    background: #fff url('images/input_shadow.jpg') repeat-x top center;
	border: 1px solid #95b6b8;
	padding: 4px;
	color: #78807e;
	margin-bottom: 5px;
}
#contact_form input.button
{
    display: inline-block;
    color: #78807e;
    border: none;
    height: 35px;
    width: 125px;
    text-align: center;
    font-weight: bold;
    margin-right: 10px;
    cursor: pointer;
    background: #fff;
    background: url('images/SendBtn.png') no-repeat bottom center;
}
#contact_form input.button:hover
{
    color: #8ba69f;
    background: url('images/SendBtn_High.png') no-repeat bottom center;
}
p#submit
{
    text-align:center;
}

p#success
{
	display: none; 
	text-align: center; 
	margin-bottom: 20px;
	cursor: pointer;
}
/***************    END Contact Form    *****************/

#imgPreviewWithStyles {
    background: #222;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    padding: 15px;
    z-index: 999;
    border: none;
}






/* root element for tabs  
ul.tabs { 
	list-style:none; 
	margin:0 !important; 
	padding:0;	
	border-bottom:1px solid #666;	
	height:30px;
}
*/
/* single tab 
ul.tabs li { 
	float:left;	 
	text-indent:0;
	padding:0;
	margin:0 !important;
	list-style-image:none !important; 
}
*/
/* link inside the tab. uses a background image 
ul.tabs a { 
	background: url(/tools/img/tabs/blue.png) no-repeat -420px 0;
	font-size:11px;
	display:block;
	height: 30px;  
	line-height:30px;
	width: 134px;
	text-align:center;	
	text-decoration:none;
	color:#333;
	padding:0px;
	margin:0px;	
	position:relative;
	top:1px;
}

ul.tabs a:active {
	outline:none;		
}
*/
/* when mouse enters the tab move the background image 
ul.tabs a:hover {
	background-position: -420px -31px;	
	color:#fff;	
}
*/
/* active tab uses a class name "current". it's highlight is also done by moving the background image. */
ul.tabs a.current, ul.tabs a.current:hover, ul.tabs li.current a 
{
    text-decoration: none;
	font-weight: bold;
}

/* Different widths for tabs: use a class name: w1, w2, w3 or w2 */


/* width 1 
ul.tabs a.s 			{ background-position: -553px 0; width:81px; }
ul.tabs a.s:hover 	{ background-position: -553px -31px; }
ul.tabs a.s.current  { background-position: -553px -62px; }
*/
/* width 2 
ul.tabs a.l 			{ background-position: -248px -0px; width:174px; }
ul.tabs a.l:hover 	{ background-position: -248px -31px; }
ul.tabs a.l.current  { background-position: -248px -62px; }
*/

/* width 3 
ul.tabs a.xl 			{ background-position: 0 -0px; width:248px; }
ul.tabs a.xl:hover 	{ background-position: 0 -31px; }
ul.tabs a.xl.current { background-position: 0 -62px; }
*/

/* initially all panes are hidden */ 
div.panes div.pane {
	display:none;		
}