﻿html,body 
{
    text-align:center;
    font-family:arial;
    font-size:12px;
    font-weight:normal;
    background: #555655 url('Images/bodyBg.gif') repeat-x;
    height:100%;
    margin:0;
    padding:0;
}
h1 
{
	color: #2cbc97;
}
h2
{
    font-size:18px;
}
img 
{
    border:0;
}
a
{
    text-decoration:none;
    color:White;
}
a:hover
{
    text-decoration:underline;
}
a:active
{
	outline: none !important;
}
:focus
{
  -moz-outline-style: none;
}
input, select, textarea 
{
	font-family: arial;
    font-size: 12px;
}
.clear
{
    clear:both;
}
.requiredField 
{
    float: left;
    width: 8px;
    margin-top: 4px;
    color: #f0464a;
}
.errors 
{
	background: #ffecec url('Images/ValidatorIcon.gif') no-repeat 10px 10px;
	width: 200px;
	border: 1px solid #8f2a2a;	
	color: #f0464a !important;
	padding: 10px 10px 10px 50px;
	font-weight: bold;
	margin: 0px;
	margin-bottom: 10px;
}
.errors ul
{
	margin: 0px 0px 0px -20px;
	.margin: 0px 0px 0px 23px;
	font-weight: normal;
}
.hidden 
{
	color: #f0464a !important;
	display: none;
}
.smart 
{
	display: none;
}
.info 
{
	position: absolute;
	margin-left:275px;
	width: 300px;
	margin-top:-30px;
	background: url('Images/info.gif') no-repeat;
	height: 20px;
	padding-left: 20px;
	
	/* For IE's */
	.position: absolute;
	.width: 300px;
	.margin-top: 3px;
	.background: url('Images/info.gif') no-repeat;
	.height: 20px;
	.padding-left: 20px;

}
.alert 
{
	position: absolute;
	width: 300px;
	margin-top: 3px;
	background: url('Images/alert.gif') no-repeat;
	height: 20px;
	padding-left: 20px;
}
.chklist input
{
	float: left !important;
	width: auto !important;
	margin: 3px 0px 0px 5px !important;
	.margin: 0px 0px 0px 2px !important;
}
.chklist label
{
	float: left !important;
	width: 300px !important;
	font-weight: normal !important;
	color: black !important;
	margin: 2px 0px 0px 5px !important;
}
.intCopyBreak
{
    margin:0px 0px 10px 0px;
}
.btnSubmit a{ 
    background:url('Images/btnSubmit.gif') repeat 0px 0px; 
    width: 71px; 
    height: 22px; 
    display: block;
    margin:5px 0px 5px 5px;
}
.btnSubmit span { 
    display: none; 
}
.btnSubmit a:hover { 
    background: url('Images/btnSubmit.gif') repeat -74px 0px; 
}
.titleH1 
{
	background-position: top right;
	background-repeat: no-repeat;	
	overflow: hidden;
	display: block;
	height: 0px;	
	padding-top: 32px;
}
.imgRight
{
    float:right;
    margin-left:15px;
    margin-bottom:5px;
    border:2px solid #3d3e3d;
}
.imgLeft
{
    float:left;
    margin-right:15px;
    margin-bottom:10px;
    border:2px solid #3d3d3d;
}
/* Default/Home Page */ 
#wrapper
{
    text-align:left;
    margin:0 auto;
    width:860px;
    height:auto;
}
#topBar
{
    width:100%;
    height:62px;   
}
#topBar .logoBox
{
    width:568px; height:62px;
    float:left;
    vertical-align:top;
}
#topBar .infoBox
{
    width:268px; height:62px;
    float:left;
    margin:5px 0px 0px 0px;
}
#main
{
    clear:both;
    color:White;
    width:860px;
    height:378px;
    background:#518269;
    margin:0px 0px 20px 0px;
}
#main .photos
{
    width:570px;
    height:100%;
    float:left;
}
#main .information
{
    float:left; 
    width:270px;
    height:358px;
    padding:10px;
}
#main .information .defaultHeader
{
    margin:10px 0px 0px 0px;
    .margin:7px 0px 0px 0px;
}
#main .information p
{
    line-height:14px;
}
#main .miniButtons
{
    width:284px; 
    height:86px;
    margin:18px 0px 0px -8px;
    .margin:-8px 0px 0px -8px;
    _position:absolute;
}

    #main .information a.pavers { 
        background:url('Images/miniPavers.gif') repeat 0px 0px; 
        width: 85px; 
        height: 86px; 
        display: block; 
        float:left;
    }
    #main .information a.pavers span { 
        display: none; 
    }
    #main .information a.pavers:hover { 
        background: url('Images/miniPavers.gif') repeat -95px 0px; 
    }
    #main .information a.lighting { 
        background:url('Images/miniLighting.gif') repeat 0px 0px; 
        width: 75px; 
        height: 86px; 
        display: block; 
        float:left;
    }
    #main .information a.lighting span { 
        display: none; 
    }
    #main .information a.lighting:hover { 
        background: url('Images/miniLighting.gif') repeat -85px 0px; 
    }
    #main .information a.landscaping { 
        background:url('Images/miniLandscaping.gif') repeat 0px 0px; 
        width: 124px; 
        height: 86px; 
        display: block; 
        float:left;
    }
    #main .information a.landscaping span { 
        display: none; 
    }
    #main .information a.landscaping:hover { 
        background: url('Images/miniLandscaping.gif') repeat -134px 0px; 
    }    
#mainInt
{
    float: left;
    clear:both;
    color:White;
    width:860px;
    height:auto;
    background:#ffffff url('Images/mainInt.gif') repeat-y;
    margin:0px 0px 20px 0px; 
}

#nav
{
    clear:both;
    width:870px;
    height:133px;
    margin:0px 0px 15px -6px;
}
#nav a
{
    float:left;
    text-align:left;
}
    #nav a.whatwedo { 
        background:url('Images/navWhatWeDo.gif') repeat 0px 0px; 
        width: 292px; 
        height: 133px; 
        display: block; 
    }
    #nav a.whatwedo span { 
        display: none; 
    }
    #nav a.whatwedo:hover { 
        background: url('Images/navWhatWeDo.gif') repeat -296px 0px; 
    }
    #nav a.askthedesigners{ 
        background:url('Images/navAskTheDesigners.gif') repeat 0px 0px; 
        width: 289px; 
        height: 133px; 
        display: block; 
    }
    #nav a.askthedesigners span { 
        display: none; 
    }
    #nav a.askthedesigners:hover { 
        background: url('Images/navAskTheDesigners.gif') repeat -299px 0px; 
    }
    #nav a.ourphilosophy{ 
        background:url('Images/navOurPhilosophy.gif') repeat 0px 0px; 
        width: 286px; 
        height: 133px; 
        display: block; 
    }
    #nav a.ourphilosophy span { 
        display: none; 
    }
    #nav a.ourphilosophy:hover { 
        background: url('Images/navOurPhilosophy.gif') repeat -302px 0px; 
    }
#navInt
{
    width:215px;
    height:100%;
    background:#518269;
    float:left;
    font-size:14px;
}
#navInt a
{
    color:#5dcb91;
    text-decoration:none;
}
#navInt a:hover
{
    text-decoration:underline;
}
#navInt .navWrap
{
    width:180px;
    margin:0 auto;
    padding-top:15px;
}
#navInt .navWrap .textLinks
{
    margin:0px 0px 10px 30px;
}
#navInt .navWrap .textLinks a
{
    color:#5dcb91;
    text-decoration:none;
    font-weight:bold;
}
#navInt .navWrap .textLinks a:hover
{
    text-decoration:underline;
}

    #navInt a.whatwedoInt{ 
        background:url('Images/intWhatWeDo.gif') repeat 0px 0px; 
        width: 105px; 
        height: 29px; 
        display: block; 
        margin:0px 0px 10px 0px;
    }
    #navInt a.whatwedoInt span { 
        display: none; 
    }
    #navInt a.whatwedoInt:hover { 
        background: url('Images/intWhatWeDo.gif') repeat -126px 0px; 
    }
    #navInt a.askthedesignersInt{ 
        background:url('Images/intAskTheDesigners.gif') repeat 0px 0px; 
        width: 165px; 
        height: 29px; 
        display: block; 
        margin:0px 0px 10px 0px;
    }
    #navInt a.askthedesignersInt span { 
        display: none; 
    }
    #navInt a.askthedesignersInt:hover { 
        background: url('Images/intAskTheDesigners.gif') repeat -180px 0px; 
    }
    #navInt a.ourphilosophyInt{ 
        background:url('Images/intOurPhilosophy.gif') repeat 0px 0px; 
        width: 125px; 
        height: 29px; 
        display: block; 
        margin:0px 0px 10px 0px;
    }
    #navInt a.ourphilosophyInt span { 
        display: none; 
    }
    #navInt a.ourphilosophyInt:hover { 
        background: url('Images/intOurPhilosophy.gif') repeat -143px 0px; 
    }
    #navInt a.checklistInt{ 
        background:url('Images/ctaChecklist.gif') repeat 0px 0px; 
        width: 149px; 
        height: 120px; 
        display: block;
        margin:5px 0px 10px 0px; 
    }
    #navInt a.checklistInt span { 
        display: none; 
    }
    #navInt a.checklistInt:hover { 
        background: url('Images/ctaChecklist.gif') repeat -149px 0px; 
    }
    #navInt a.calculatorInt{ 
        background:url('Images/ctaCalculator.gif') repeat 0px 0px; 
        width: 166px; 
        height: 117px; 
        display: block; 
        margin:5px 0px 10px 0px;
    }
    #navInt a.calculatorInt span { 
        display: none; 
    }
    #navInt a.calculatorInt:hover { 
        background: url('Images/ctaCalculator.gif') repeat -166px 0px; 
    }
    #navInt a.freedesignInt{ 
        background:url('Images/ctaFreeDesign2.gif') repeat 0px 0px; 
        width: 166px; 
        height: 145px; 
        display: block; 
        margin:5px 0px 10px 0px;
    }
    #navInt a.freedesignInt span { 
        display: none; 
    }
    #navInt a.freedesignInt:hover { 
        background: url('Images/ctaFreeDesign2.gif') repeat -166px 0px; 
    }
#testimonials
{
    width:645px;
    height:70px;
    float:left;
}
#copyInt
{
    width:595px;
    _width:581px;
      min-height:359px;
      height:auto !important;
      height:359px;
    padding:25px;
    float:left;
    color:Black;
    background:white;
}
#copyInt .pageHeader
{
    float:right;
}
#copyInt p
{
    text-align:justify;
    line-height:19px;
}
#copyInt a
{
	color: #518269;
}
#tipsBar
{
    width:860px;# /* Float # sign is for safari */
    /*height:60px;*/
    margin:-13px 0px 0px 0px;
}
#tipsBar .title
{
	font-weight: bold;
	font-size: 14px;
	color: White;
}
#tipsBar .description
{
	font-size: 12px;
	color: White;
}
#tipsBar .totw
{
    float:left;
    width:428px;
    height:auto;
    margin:4px 0px 8px 0px;
}
#tipsBar .totw .right
{
	float: left;
	width: 300px;
}
#tipsBar .totw p
{
    float:left;
    color:White;
    width:280px;
    .margin:10px 0px 0px 0px;
}
#tipsBar .imgTotw
{
    float:left;
    width:110px; height:51px;
    padding:0px 10px 0px 0px;
}
#tipsBar .freeDesign
{
    float:left;
    width:413px;
    height:120px;
    margin:0px 0px 0px 0px;
}
#tipsBar a.ctadesign
{
    background:url('Images/ctaFreeDesign.gif') repeat 0px 0px; 
    width: 368px; 
    height: 80px; 
    display: block; 
    margin:-7px 0px 0px 30px;
    .margin:0px 0px 0px 30px;
}
#tipsBar a.ctadesign span { 
    display: none; 
}
#tipsBar a.ctadesign:hover { 
    background: url('Images/ctaFreeDesign.gif') repeat -373px 0px; 
}
#tipsBar a.ctacalc
{
    background:url('Images/ctaChecklist2.gif') repeat 0px 0px; 
    width: 368px; 
    height: 120px; 
    display: block; 
    margin:-7px 0px 0px 30px;
    .margin:0px 0px 0px 30px;
}
#tipsBar a.ctacalc span { 
    display: none; 
}
#tipsBar a.ctacalc:hover { 
    background: url('Images/ctaChecklist2.gif') repeat -369px 0px; 
}
#tipsBar a.ctatips
{
    background:url('Images/ctaTOTW.gif') repeat 0px 0px; 
    width: 241px; 
    height: 29px; 
    display: block; 
    float:right;
    margin:5px 5px 0px 0px;
}
#tipsBar a.ctatips span { 
    display: none; 
}
#tipsBar a.ctatips:hover { 
    background: url('Images/ctaTOTW.gif') repeat -251px 0px; 
}
.makeflush
{
    _margin:-8px 0px 0px 0px;
}
#samples
{
    float:left;
    width:580px;
    
}
.sample 
{
	float: left;
	width: 120px !important;
	height: 80px !important;
	.overflow: hidden;
	border: 3px solid white;
	margin: 5px 9px 15px 7px !important;
	_margin: 5px 11px 15px 4px !important;	
}
#ctas
{
    float:left;
    width:580px;
}
#ctas a.ctacommercial
{
    background:url('Images/ctaCommercial.gif') repeat 0px 0px; 
    width: 280px; 
    height: 129px; 
    display: block; 
    float:left;
}
#ctas a.ctacommercial span { 
    display: none; 
}
#ctas a.ctacommercial:hover { 
    background: url('Images/ctaCommercial.gif') repeat -316px 0px; 
}
#ctas a.ctainsurance
{
    background:url('Images/ctaInsurance.gif') repeat 0px 0px; 
    width: 280px; 
    height: 129px; 
    display: block; 
    float:left;
}
#ctas a.ctainsurance span { 
    display: none; 
}
#ctas a.ctainsurance:hover { 
    background: url('Images/ctaInsurance.gif') repeat -311px 0px; 
}
#specials
{
    float:right;
    width:260px;
    height:auto;
    background:#518269;
    margin:0px 0px;
    padding:10px;
    color:White;
}
    #specials a.moredetails { 
        background:url('Images/buttonContactUs.gif') repeat 0px 0px; 
        width: 135px; 
        height: 29px; 
        display: block;
        float:right; 
        margin:0px 10px 0px 0px;
    }
    #specials a.moredetails span { 
        display: none; 
    }
    #specials a.moredetails:hover { 
        background: url('Images/buttonContactUs.gif') repeat -145px 0px; 
    }
#footer 
{
	color: White; 
	margin: 20px 0px 10px 0px;
	line-height: 19px;
}
/* Paging */
#paging 
{
	margin-top: 10px;
}
#paging .btnPrev
{
	float: left;
	margin-right: 2px;
}
#paging .btnNext
{
	float: left;
	margin-left: 2px;
}
#paging .pageNumber 
{
	float: left;
	margin: 0px 1px;
}
/* Question */
.qa 
{
	margin-bottom: 10px;
}
.qa .question
{
	margin-bottom: 10px;
	font-weight: bold;
}
.qa .name 
{
	float: left;
}
.qa .date
{
	float: left;
	font-style: italic;
	margin-left: 5px;
}
.qa .answer 
{
	margin-top: 10px;
}
.qa .link 
{
	margin-top: 10px;
}
.questionForm label 
{
    float: left;
    width: 70px;
    margin-top: 4px;
}
.questionForm input
{
	margin-top: 2px;
}
.questionForm textarea
{
	width: 100%;
    height: 100px;
	margin-top: 2px;
	margin-left: 8px;
}
/* Calculator */
#calculator
{
}
#calculator .stats
{
}
#calculator .stats .total
{
    background:#b9ffda; 
    padding:4px;
    margin:5px 0px 0px 0px; 
    border-top:1px solid #518269;
    width:auto;
}
#calculator .stats label 
{
	float: left;
	width: 230px;
	margin-top: 4px;
    color:#518269;
    font-weight:bold;
}
#calculator .stats input, #calculator .stats span
{
	float: left;
	width: 50px;
	text-align: right;
	margin-top: 2px;
}
#calculator .realtime
{
    background: url('Images/calculatorBg.gif') no-repeat;
    width:306px;
    height:311px;
    margin:0 auto;
}
#calculator .realtime label
{
}
#calculator .realtime input
{
    width:30px;
    text-align:right;
    margin:110px 0px 75px 205px;
}
#calculator .realtime .results
{
    color:White;
    font-weight:bold;
    font-size:13px;
    margin-left:35px;
}
#calculator .realtime .results .underline
{
    color: #5dcb91;
    font-weight: bold;
    text-decoration: underline;
}
#calculator .realtime span
{
}
#calculator span
{
    margin: 3px 0px 0px 1px;
    .margin: 3px 0px 0px 2px;    
}
/* Free Design */
.freeDesign
{
    margin:0px 0px 10px 0px;
    float:left;
}
.freeDesign label
{
    color:#518269;
    font-weight:bold;
    float:left;
    width:145px;
    margin-top: 3px;
}
.freeDesign input
{
    width:175px;
    margin:0px 0px 10px 0px;
}
.freeDesign select
{
    width:179px;
    margin:0px 0px 10px 0px;
}
.freeDesign textarea
{
	width:320px;
    height:100px;
}
/* Free Design */
.rfpForm label
{
    color:#518269;
    font-weight:bold;
    float:left;
    width:75px;
    margin-top: 3px;
}
.rfpForm input
{
    width:175px;
    margin:0px 0px 10px 0px;
}
.rfpForm select
{
    width:179px;
    margin:0px 0px 10px 0px;
}
/* Contact */
.contactForm label 
{
    color:#518269;
    font-weight:bold;
    float:left;
    width:75px;
    margin-top: 3px;
}
.contactForm input
{
	width:175px;
    margin:0px 0px 10px 0px;
}
.contactForm textarea
{
	width: 350px;
    height: 100px;
	margin:0px 0px 10px 0px;
}
/* Meet the Designers */
#submitQ
{
}
#submitQ label
{
    color:#518269;
    font-weight:bold;
}

#VCFLink
{
    cursor:pointer;
}
