﻿body
{
    font-family: Georgia, serif;
    font-size: 10pt;
    margin-top: 10px;
    color: black;
    background: url(/images/BG_damask.jpg);
    text-align: center;
}
a img {border: none;}

a:link, a:hover, a:visited, a:active
{
    color: #5C3921;
   
    font-weight: bold;
}
a:hover
{
    color: Black;
}
h1, h2, h3, h4, h5, p, ul
{
    margin: 0 0 10px 0; font-weight: normal;
}
h1
{   font-size: 28px;
    font-style: italic;
}
h2
{
    font-style: italic;
    font-size: 22px;
}
h3
{
    font-size: 16px;
    color: #371402;
}
p
{
    font-size: 12px;
}
ul
{
    text-align: left;
    padding: 0;
}
li
{
    margin-left: 20px;
}
p.clear
{
    clear: both;
    padding: 0;
    margin: 0;
}

#AllContent
{
    margin-right: auto;
    margin-left: auto;
    width: 978px;
    text-align: left;
    position: relative;
    background: url(/images/BG_content.jpg) top center no-repeat #ffe9cd;
    border: solid 1px #b6885f;
    -moz-border-radius-topleft: 6px;
    -moz-border-radius-topright: 6px;
}
div#bottomBrownSides
{  width: 1000px;
    background: url(/images/bottomBrownSides.png) bottom center no-repeat;
    display: block; margin-left: auto; margin-right: auto}
.rightCol
{float: right; }
.half
{width: 50%;}

/*-----------------------------Header-----------------------------*/
.logo
{
    float: left;
    margin: -10px 0 0 -10px;
}
.logo img
{
    border: none;
}
.logotype
{
    float: left;
    padding: 15px 0 0 14px;
}
#header
{
    height: 134px;
    width: 978px;
}
#nav
{
    width: 819px;
    float: left;
    background: url(/images/nav_bg.png) no-repeat top left;
    margin: 7px 0 0 13px;
    height: 25px;
}

#nav a
{
    padding: 0;
    margin: 5px 11px 0 11px;
    font-size: 13px;
    display: inline;
    font-weight: bold;
    float: left;
    text-transform: uppercase;
    text-decoration: none;
}
#nav img
{
    margin-top: -5px;
    float: left;
}
#nav a:hover, #nav a:visited, #nav a:active
{
    text-decoration: none;
    color: #5C3921;
}

#nav a:hover
{
    color: Black;
}
#nav a.facebookLink
{
    float: left;
    margin: 2px 0 0 15px;
}
#nav a.facebookLink img
{
    border: none;
    margin: 0;
}
/*-----------------------------Page Content-----------------------*/
.pageContent
{
    clear: both;
    overflow: visible;
    width: 954px;
    padding: 0 12px 15px 12px;
    min-height: 400px;
}

/*-----------------------------Footer-----------------------------*/
#Footer
{ padding: 10px 0;
    text-align: center;
    margin-bottom: 10px;
    clear: both;
    background: #4f2c15;
    width:1000px;
    display: block;
    margin-left: auto; margin-right: auto;
}
#Footer a, #Footer
{color: White}
#Footer .links { text-transform: lowercase; }

/*----------------------------Columns----------------------------*/
.oneColumn, .oneColumnLast
{
    background: url(/images/brown_bg.png) repeat;
    width: 255px;
    float: left;
    margin: 10px 13px 10px 0;
    padding: 20px;
    border: outset 1px #f0dbbc;
    float: left;
}

.oneColumnLast
{
    margin-left: 0;
}

.oneColumn img, .oneColumnLast img
{
    display: block;
    margin-left: auto;
    margin-right: auto;
    border: 0;
    margin-bottom: 15px;
}

.twoColumn
{
    width: 578px;
    padding: 20px;
    margin: 10px 0 10px 0;
    float: left;
    border: outset 1px #f0dbbc;
    background: url(/images/brown_bg.png) repeat;
}
.threeColumn
{
    width: 888px;
    padding: 20px;
    margin: 10px 0 10px 0;
    float: left;
    border: outset 1px #f0dbbc;
    background: url(/images/brown_bg.png) repeat;
}

/*-----NEw Columns------*/
div.threeCol {background: url(/images/columns/3col_expand.png) top left repeat-y; float: left;}
div.threeCol div, div.oneTwoCol div.left {width: 272px; margin: 0 9px; padding: 14px; float: left;}
div.threeCol div img {margin-bottom: 15px;}
div.fullPageCol {background: url(/images/columns/fullPageCol_expand.png) top left repeat-y; padding: 23px; width: 908px; float: left }
div.fullPageCol .left {float: left;}
div.fullPageCol .right {float: right;}
div.fullPageCol .left ul, div.fullPageCol .right ul {list-style: none;}
.bottomCap {margin-bottom:15px;}
.bottomCap, .topCap
{float: left;}
div.threeCol div p
{text-align: justify}
div.oneTwoCol
{ background: url(/images/columns/oneTwoCol_expand.png) top left repeat-y; }
div.oneTwoCol div.right
{width:590px; margin: 0 9px; padding:14px; float: left}

/*----------------------------- Home ------------------------------*/
#HomeContent
{
    text-align: center;
}
#homeRight
{
    width: 310px;
    float: right;
    margin: 8px 0 10px 0;
}
#homeRight div
{
    background: url(/images/white_BG.png) top left repeat;
    padding: 0 5px 4px 5px;
}
#homeRight h3
{
    margin-bottom: 0;
     font-size:14px; font-weight: bold
}
#homeLeft
{
    width: 605px;
    float: left;
    margin: 0 15px 0 0;
}
#homeLeft .slideshow
{
    width: 605px;
    height: 350px;
    position: relative;
    margin-top: -27px;
    z-index: 499;
    overflow: hidden;
}
#homeRight ul
{
    text-align: left;
    width: 200px;
    margin-left: 10px;
}
#homeRight ul.left
{
    float: left;
}
#homeRight ul.right
{
    float: right;
}
#homeRight h2
{
    clear: both;
}
#homeRight ul.boardMember
{
    text-align: center;
    width: 420px;
}
#logos
{
    margin: 0 0 -15px -12px;
    background: url(/images/logo_bar_02.jpg) top left no-repeat #fef2e2;
    width: 978px;
    min-height: 293px;
    clear: both;
}
#logos div
{
    float: right;
    width: 415px;
    margin: 30px 15px 0 0;
}
#logos ul
{
    text-align: center;
    list-style: none;
}
#logos ul, #logos li
{
    margin: 0 0 6px 0;
    padding-left: 0;
}
h1.awardWinning
{
    position: relative; /* allows child element to be placed positioned wrt this one */
    overflow: hidden; /* don’t let content leak beyond the header - not needed as height of anchor will cover whole header */
    padding: 0; /* needed to counter the reset/default styles */
    z-index: 500;
}

h1.awardWinning a
{
    position: absolute; /* defaults to top:0, left:0 and so these can be left out */
    height: 0; /* hiding text, prevent it peaking out */
    width: 100%; /* 686px; fill the parent element */
    background-position: left top;
    background-repeat: no-repeat;
    top: 0;
    left: 0;
    cursor: default;
}

h1#awardWinning
{
    height: 77px; /* height of replacement image */
}

h1#awardWinning a
{
    padding-top: 77px; /* height of the replacement image */
    background-image: url(/images/awardWinning.png); /* the replacement image */
}



/*--------------------------------Contact--------------------------------*/
#Contact
{
    padding-top: 50px;
    float: right;
    margin: 0px 30px 0 20px;
    width: 600px;
}
#Contact, #Contact p
{
    font-size: 8pt;
    font-weight: bold;
}
#Contact p
{
    margin-top: 12px;
}
#Contact a:link, #Contact a:hover, #Contact a:visited, #Contact a:active
{
    color: #6f4e38;
}
.contactSocialLinks
{
    text-align: center;
}
.contactSocialLinks h2
{
    border-top: 1px black solid;
    margin-top: 10px;
    padding-top: 5px;
}
.contactPool
{margin-bottom:15px;}


/*-------------------------------Services---------------------------------*/
#Services h3
{
    margin-top: 10px;
}
#Services p
{
    margin-top: 0px;
}


.address
{
    font-weight: bold;
    font-size: 12px;
}

/*--------------------------------- Portfolio --------------------------*/
#gallery
{
    display: block;
    min-height: 540px;
    margin-top: 5px;
    text-align: center;
}
.portfolioThumbs
{
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
    padding: 0 75px;
}

.portfolioThumbs p
{
    font-size: 9px;
    float: left;
    margin: 5px;
    width: 75px;
}


.navigation a, .content a
{
    text-decoration: none;
}


#aquascapesThumbs, #constructionThumbs, #masonryBarGrillsThumbs, #barGrillsThumbs, #plantingsThumbs
{
    width: 210px;
    float: left;
}
#aquascapesThumbs ul, #constructionThumbs ul, #masonryBarGrillsThumbs ul, #barGrillsThumbs ul, #plantingsThumbs ul
{
    list-style: none;
    margin: 0;
    background: #F4EBC5;
}
#aquascapesThumbs li, #constructionThumbs li, #masonryBarGrillsThumbs li, #barGrillsThumbs li, #plantingsThumbs li
{
    float: left;
    margin: 5px 5px 0 0;
    height: 65px;
    width: 65px;
}


.tpWrapper
{
    width: 936px;
    margin-left:9px;
}
ul.thumbs img, #gallery img
{
    border: none;
}
#gallery img
{
    margin-top: 4px;
}
.ss-controls a, .nav-controls a
{
    text-decoration: none;
    font-weight: bold;
    width: 55px;
    padding: 5px 10px;
    display: block;
    float: left;
    background: #F4EBC5;
    margin: 5px 5px 5px 0;
    font-size: 11px;
    float: left;
}

div.slideshow a.advance-link:hover, div.slideshow a.advance-link:active, div.slideshow a.advance-link:visited
{
    text-decoration: none;
}

div.pagination a, div.pagination span.current, div.pagination span.ellipsis
{
    border: outset 1px #f0dbbc;
    display: block;
    float: left;
    margin: 4px 5px 5px 0px;
    padding: 5px 7px;
    font-size: 11px;
    font-weight: normal;
    color: black;
    background: url(/images/brown_bg.png) top left repeat;
}

div.pagination span.current
{
    font-weight: bold;
    background: url(/images/white_bg.png) top left repeat;
    color: black;
    border: outset 1px #002b3e;
}


/* .ajax__tab_header - A container element that wraps all of the tabs at the top of the TabContainer. Child CSS classes:.ajax__tab_outer. */
/* .ajax__tab_outer - An outer element of a tab, often used to set the left-side background image of the tab.Child CSS classes: .ajax__tab_inner. */
/* .ajax__tab_inner	 - An inner element of a tab, often used to set the right-side image of the tab. Child CSS classes:.ajax__tab_tab. */
/* .ajax__tab_tab - An element of the tab that contains the text content. Child CSS classes:none. */
/* .ajax__tab_body - A container element that wraps the area where a TabPanel is displayed. Child CSS classes: none. */
/* .ajax__tab_hover - This is applied to a tab when the mouse is hovering over. Child CSS classes:.ajax__tab_outer. */
/* .ajax__tab_active - This is applied to a tab when it is the currently selected tab. Child CSS classes:.ajax__tab_outer. */

/* AJAX Tab - Backgrounds */
.showcase .ajax__tab_header
{
    background: url(/images/TabStyles/tab-line.png) repeat-x bottom;
}
.showcase .ajax__tab_outer
{
    background: url(/images/TabStyles/tab-right.png) no-repeat right;
}
.showcase .ajax__tab_inner
{
    background: url(/images/TabStyles/tab-left.png) no-repeat;
}
.showcase .ajax__tab_tab
{
    background: url(/images/TabStyles/tab.png) repeat-x;
}
.showcase .ajax__tab_hover .ajax__tab_outer
{
    background: url(/images/TabStyles/tab-active-right.png) no-repeat right;
}
.showcase .ajax__tab_hover .ajax__tab_inner
{
    background: url(/images/TabStyles/tab-active-left.png) no-repeat;
}
.showcase .ajax__tab_hover .ajax__tab_tab
{
    background: url(/images/TabStyles/tab-active.png) repeat-x;
}
.showcase .ajax__tab_active .ajax__tab_outer
{
    background: url(/images/TabStyles/tab-active-right.png) no-repeat right;
}
.showcase .ajax__tab_active .ajax__tab_inner
{
    background: url(/images/TabStyles/tab-active-left.png) no-repeat;
}
.showcase .ajax__tab_active .ajax__tab_tab
{
    background: url(/images/TabStyles/tab-active.png) repeat-x;
}

.showcase .ajax__tab_header
{
    font-family: verdana,tahoma,helvetica;
    font-size: 11px;
}

.showcase .ajax__tab_outer
{
    height: 29px;
    margin: 0 5px 0 0;
}

.showcase .ajax__tab_inner
{
    padding-left: 3px;
}

.showcase .ajax__tab_tab
{
    padding: 8px 10px;
    margin: 0;
}

.showcase .ajax__tab_body
{
    font-family: verdana,tahoma,helvetica;
    font-size: 10pt;
     padding: 8px;
    background: url(/images/white_BG.png) top left repeat;
    border-left: 1px #e4c8a3 solid;
    border-right: 1px #e4c8a3 solid;
    border-bottom: 1px #e4c8a3 solid;
    margin-bottom:15px;
}

.showcase .ajax__tab_body
{
    border-color: #ecdc96;
}
.showcase .ajax__tab_active
{
    font-weight: bold;
}


/*------------------------------- Philosophy --------------------------------*/
.quote {margin: 10px 0 20px 0}
