/* 
Author: Graphic D-Signs
Client: Castle Point
Date: April 2010
Website: http://graphicd-signs.com
*/

@import url(reset.css);

img, div { behavior: url(../iepngfix.htc) }
body { font-family: Verdana, Geneva, sans-serif; font-size: 12px; color: #ffffff; background: url(../images/bg2.jpg) no-repeat top #0d1d00; margin: 0; padding: 0; }
#container { position: relative; width: 965px; margin: 0 auto; padding: 0; }
h4 { margin: 0 0 0 0; }
.clear { clear: both; }

/* Header Styles */

#logo { width: 295px; height: 347px; }
#logo h1 { position: relative; width: 295px; height: 347px; z-index: 400; margin: -10px 0 0 75px; }
#logo h1 a { position: relative; z-index: 401; width: 295px; height: 347px; background: url(../images/logo.png) no-repeat; text-indent: -9999px; display: block; }
#nav { position: relative; z-index: 201; width: 965px; height: 76px; margin: 0 0 0 -40px; }
#nav ul { overflow: hidden; padding: 0; float: right; }
#nav ul li { float: left; padding: 0 0 0 0; margin: 30px 0 0 0; }
#banner { position: relative; width: 965px; height: 316px; z-index: 100; margin: 33px 0 0 10px; }
#insideBanner { position: relative; width: 965px; height: 254px; margin: 33px 0 0 10px; }

/* Navigation Styles */

#nav li#home { width: 86px; height: 55px; background: url(../images/nav/home.jpg) no-repeat; text-indent: -9999px; }
#nav li#about { width: 104px; height: 55px; background: url(../images/nav/about.jpg) no-repeat; text-indent: -9999px; }
#nav li#testimonials { width: 121px; height: 55px; background: url(../images/nav/testimonials.jpg) no-repeat; text-indent: -9999px; }
#nav li#services  { width: 101px; height: 55px; background: url(../images/nav/services.jpg) no-repeat; text-indent: -9999px; }
#nav li#gallery { width: 99px; height: 55px; background: url(../images/nav/gallery.jpg) no-repeat; text-indent: -9999px; }
#nav li#contact { width: 100px; height: 55px; background: url(../images/nav/contact.jpg) no-repeat; text-indent: -9999px; }

#nav li#home a { width: 86px; height: 55px; display: block; }
#nav li#about a { width: 104px; height: 55px; display: block; }
#nav li#testimonials a { width: 121px; height: 55px; display: block; }
#nav li#services a { width: 101px; height: 55px; display: block; }
#nav li#gallery a { width: 99px; height: 55px; display: block; }
#nav li#contact a { width: 100px; height: 55px; display: block; }

#nav li#home a:hover { width: 86px; height: 55px; background: url(../images/nav/homeOver.jpg) no-repeat; }
#nav li#about a:hover { width: 104px; height: 55px; background: url(../images/nav/aboutOver.jpg) no-repeat; }
#nav li#testimonials a:hover { width: 121px; height: 55px; background: url(../images/nav/testimonialsOver.jpg) no-repeat; }
#nav li#services a:hover { width: 101px; height: 55px; background: url(../images/nav/servicesOver.jpg) no-repeat; }
#nav li#gallery a:hover { width: 99px; height: 55px; background: url(../images/nav/galleryOver.jpg) no-repeat; }
#nav li#contact a:hover { width: 100px; height: 55px; background: url(../images/nav/contactOver.jpg) no-repeat; }

/* Main Content Styles */

.contentboxTop { width: 550px; height: 13px; background: url(../images/contentboxTop.png) no-repeat; }
.contentboxMiddle { position: relative; z-index: 2; width: 550px; max-height: 100%; margin: 0 0 0 0; background: url(../images/contentboxMiddle.png) repeat-y; }
.contentboxBottom { position: relative; z-index: 800; width: 550px; height: 113px; padding: 0 0 0 0; background: url(../images/contentboxBottom2.png) no-repeat; }
.contentboxBottom2 { position: relative; z-index: 800; width: 550px; height: 13px; background: url(../images/contentboxBottom.png) no-repeat; }
.contentboxMiddle a { color: #30530C; text-decoration: none; font-weight: bold; }
.contentboxMiddle a:hover { color: #4EBFEE; }

#mainContent { position: relative; width: 965px; margin: 1px 0 0 0; padding: 0 0 34px 0; overflow: hidden; clear: both; }
#content { width: 551px; float: left; margin: 0 0 0 13px; color: #133401; }
#content img { float: right; }
h2#header1 { background: url(../images/oneStop.png) no-repeat; width: 558px; height: 59px; text-indent: -9999px; margin: 5px 0 0 0; padding: 0 0 4px 0; }
#content p { padding: 0 20px 0 20px; line-height: 19px; }
#social { width: 518px; height:  81px; margin: 0; float: left; }
#social ul { overflow: hidden; padding: 0; float: left; }
#social ul li { float: left; padding: 28px 0 0 2px; }
#social lI#add { width: 150px; height: 80px; background: url(../images/addUs.png) no-repeat; text-indent: -9999px; }
#sidebar { width: 383px; float: right; margin: -60px 0 0 0; }
#sidebar #box1 { width: 383px; height: 208px; background: url(../images/browseBox.png) no-repeat; }
#dropdown { position: relative; top: 160px; left: 30px; }
#sidebar h2 { width: 180px; height: 80px; background: url(../images/testimonials.png) no-repeat; text-indent: -9999px; padding: 17px 0 0 13px; }
#sidebar #box2  { width: 383px; margin: -20px 0 0 0; }
#sidebar #box2  p { width: 197px; padding: 10px 15px 0 10px; line-height: 19px; }
#sidebar #box2 img { position: relative; margin: -255px 0 0 50px; width: 197px; float: right;}
#sidebar #box2 a { color: #0F245A; }
#sidebar #box2 a:hover { color: #42BDEE; }

.sidebarContentboxTop { width: 383px; height: 14px; background: url(../images/smallContentBoxTop.png) no-repeat; }
.sidebarContentboxMiddle { width: 383px; height: 100%; background: url(../images/smallContentBoxMiddle.png) repeat-y; }
.sidebarContentboxBottom { width: 383px; height: 14px; background: url(../images/smallContentBoxBottom.png) no-repeat; }

/* Inside Styles */

#mainContentInner { position: relative; width: 965px; margin: 8px 0 0 0; padding: 0 0 34px 0; overflow: hidden; clear: both; }
#contentInner { width: 654px; float: left; margin: 25px 0 0 13px; color: #133401; }
#contentInner p { margin: -2px 0 0 0; padding: 0 20px 0 20px; line-height: 19px; }
.insideHeader { padding: 13px 0 20px 20px; color: #24334F; font-size: 14px; }
#sidebarInner { width: 284px; float: right; margin: 0 0 0 0; }
#box3 { width: 282px; height: 529px; background: url(../images/moreInfo.png) no-repeat; padding: 145px 0 0 20px ; }
#box3 ul { padding: o; overflow: hidden; }
#box3 ul li { list-style: inside url(../images/arrow.png); padding: 5px 0 5px 15px; }
#box3 li a { color: #ffffff; text-decoration: none; font-weight: normal; }
#box3 li a:hover { color: #064278; text-decoration: none; font-weight: normal; }

#box4 { width: 282px; height: 380px; background: url(../images/servicesInfo.png) no-repeat; padding: 145px 0 0 20px ; }
#box4 ul { padding: o; overflow: hidden; }
#box4 ul li { list-style: inside url(../images/arrow.png); padding: 5px 0 5px 15px; }
#box4 li a { color: #ffffff; text-decoration: none; font-weight: normal; }
#box4 li a:hover { color: #064278; text-decoration: none; font-weight: normal; }

#testimonial { width: 234px; height: 239px; margin: 20px 0 0 0; background: url(../images/grass-testimonial.png) no-repeat; }
#testimonial p { width: 140px; padding: 35px 0 0 48px; line-height: 12px; }
#testimonial a { color: #ffffff; text-decoration: none; font-weight: bold; margin: 0 0 0 10px; }
#testimonial a:hover { color: #4EBFEE; }
.insideList { padding: 0; overflow: hidden; }
.insideList li { padding: 8px; margin: 0 0 0 15px; list-style: inside circle url(../images/leaf.png); }
.insideList a { text-decoration: none; color: #163157; }
.insideList a:hover { color: #23420E; }
h4 { margin: 0 0 0 20px; padding: 10px 0 10px 0; }

#insideContentHeader { width: auto; height: auto; margin: 0 0 0 20px; font-style: normal; }

/* separate lists from subsequent content */
div.outerwrap { }
/* position list chunks side by side */
div.wrapper { float: left; width: 26em; margin: 0 0 0 1em; }
/* clear float after lists */
br { clear: left; }
/* remove default spacing  to 
promote cross-browser consistency */
.wrapper ol { margin: 2px 0 0 0; padding: 1px; list-style: none; list-style-type: none; }
/* suppress normal list item numbering */
.wrapper ol li { list-style: inside circle url(../images/leaf.png); }
.wrapper li { line-height: 19px; padding: 8px; }
/* generate new item numbers that 
continue from one list to the next */
ol li:before { list-style: inside circle; }

.insideContentboxTop { width: 654px; height: 12px; background: url(../images/contentboxinnerTop.png) no-repeat; }
.insideContentboxMiddle { width: 654px; min-height: 477px; height: 100%; background: url(../images/contentboxinnerMiddle.png) repeat-y; }
.insideContentboxBottom { width: 654px; height: 12px; background: url(../images/contentboxinnerBottom.png) no-repeat; }

#gallery { width: 842px; height: 486px; position: relative; margin: 10px 0 0 10px; }

/* Contact Form */

.myform { width: 650px; padding: 5px; min-height: 720px; }
#stylized h1 { font-size: 14px; font-weight: bold; margin-bottom: 8px; }
#stylized p { font-size: 11px; color: #666666; margin-bottom: 20px; border-bottom: solid 1px #b7ddf2; padding-bottom: 10px; }
#stylized label { display: block; font-weight: bold; text-align: right; width: auto; float: left; margin: 8px 0 0 0; }
#stylized input { float: left; font-size: 12px; padding: 5px 10px; border: solid 1px #30530C; width: 200px; margin: 2px 0 30px 10px; }
#stylized textarea { float: left; font-size: 12px; padding: 5px 10px; border: solid 1px #30530C; width: 200px; margin: 2px 0 20px 10px; }
#stylized button { clear: both; margin-left: 150px; width: 125px; height: 15px; background: #666666; text-align: center; line-height: 31px; color: #FFFFFF; font-size: 11px; font-weight: bold; }
#stylized .submit { margin: 0 0 0 23em; }
.capcha { margin: 0 0 0 23em; padding: 0 0 15px 0; }

#checks { margin: 0 0 20px 23em; padding: 0 0 0 0; border: none; }
#checks label { margin: 15px 0 0 -80px; width: 280px; text-align: left; padding: 0 0 2px 0;; top: 0; bottom: 0; }
#checks input { margin: -10px 0 0 -100px; padding: 0; top: 0; bottom: 0; border: none; }

/*-----------------------------------*/
/* Forms Styles 
/*-----------------------------------*/

form,input,select,textarea { margin: 0; padding: 0; }
div.box { margin: 0 auto; width: 600px; position: relative; top: 0px; }
div.box h3 { font-size: 18px; text-transform: uppercase; padding: 5px 0 5px 5px; }
div.box label { width: 100%; display: block; padding: 10px 0 10px 0; }
div.box label span { display: block; float: left; width: 170px; text-align: right; padding: 5px 20px 0 0; }
div.box .input_text { padding: 5px 5px; }
div.box .message { padding: 7px 7px; width: 350px; background: #262626; overflow: hidden; height: 150px; }
div.box .button { margin: 0 0 10px 0; padding: 4px 7px; border: 0px; position: relative; top: 10px; left: 192px; background: #32364D; color: #ffffff; }
#checks { }
.recaptchatable #recaptcha_response_field  { margin: 0 0 0 0px; left: -5px; }
label.error { float: none; color: red; padding-left: .5em; vertical-align: top; width: 160px; margin: -30px 0 0 75px; }

div.box2 { width: 600px; position: relative; top: 0px; }
div.box2 label { display: block; padding: 10px 0 10px 0; }
div.box2 label span { display: block; float: left; text-align: right; padding: 5px 20px 0 0; }
div.box2 .input_text { padding: 5px 5px; }
div.box2 .button { margin: 0 0 10px 0; padding: 7px 7px; border: 0px; position: relative; background: #32364D; color: #ffffff; }

/* Footer Styles */

#footer { margin: 0 auto !important; position: relative; width: 965px; height: 58px; background: url(../images/footerBg.png) no-repeat; padding: 0 0 5px 0; }
#footer p { padding: 23px 0 0 30px; width: 960px !important; letter-spacing: -.5px; }
#footer a { color: #ffffff; text-decoration: none; }
#footer a:hover { color: #8AC1B7; }

/*-----------------------------------*/
/* Toggle Styles 
/*-----------------------------------*/

h5.trigger { padding: 0 0 0 50px; margin: 0 0 5px 5px; background: url(../images/h2_trigger_a.gif) no-repeat #6F8E61; height: 20px; width: 594px; color: #F3F1EA; font-size: 13px; font-weight: 100; float: left; }
h5.trigger a { text-decoration: none; display: block; color: #F3F1EA; font-size: 17px; font-weight: 600; }
h5.trigger a:hover { color: #000000; }
.trigger:hover { color: #000000; }
h5.active { background-position: left bottom; } /*--When toggle is triggered, it will shift the image to the bottom to show its "opened" state--*/
.toggle_container { margin: 0 0 5px 5px; padding: 0; border-top: 1px solid #d6d6d6; background: #F3F1EA; overflow: hidden; font-size: 1.2em; width: 645px; clear: both; }
.toggle_container .block { /*padding: 20px; /*--Padding of Container--*/ /*background: url(../images/toggle_block_btm.gif) no-repeat left bottom; /*--Bottom rounded corners--*/ }

h5.trigger2 { padding: 0px; margin: 0 0 5px 5px; height: 20px; width: 661px; font: bold 13px/25px Helvetica, Arial, sans-serif; color: #622125; float: left; }
h5.trigger2 a { text-decoration: none; display: block; color: #F3F1EA; font-size: 17px; font-weight: 600; }
h5.trigger2 a:hover { color: #000000; }
.trigger2:hover { color: #000000; }
h5.active { background-position: left bottom; } /*--When toggle is triggered, it will shift the image to the bottom to show its "opened" state--*/
.toggle_container2 { margin: 0 0 5px 5px; padding: 0; border-top: 1px solid #d6d6d6; overflow: hidden; font-size: 1.2em; width: 710px; clear: both; }
.toggle_container2 .block2 { /*padding: 20px; /*--Padding of Container--*/ /*background: url(../images/toggle_block_btm.gif) no-repeat left bottom; /*--Bottom rounded corners--*/ }

.seo th { border-bottom: 1px solid #D6D6CA; border-right: 1px solid #D6D6CA; border-top: 1px solid #D6D6CA; color: #ffffff; padding: 4px 2px; font-size: 14px; text-align: center; }
.seo tr { border-right: 1px solid #C1DAD7; border-bottom: 1px solid #C1DAD7; border-top: 1px solid #C1DAD7; text-align: left; padding: 6px 6px 6px 12px; background: #6F8E61; }
.seo td { border-right: 1px solid #D6D6CA; border-bottom: 1px solid #D6D6CA; background: #fff; line-height: 16px; text-align: center; font-size: 11px; padding: 6px 4px; }


/*****************************/
/*   Portfolio Styles	    */
/***************************/

#portNav { position: relative; top: 53px; left: 0; padding: 0 0 60px 0; margin: 15px 0 0 135px; z-index: 1000000 !important; }
.portNav { position: absolute; margin: 0; padding: 0; list-style: none; z-index: 10000 !important; top: 0; font-size: 12px; }
.portNav li { float: left; text-align: center; font-size: 12px;  }
.portNav li a { display: block; text-indent: -9999px; vertical-align: middle; height: 64px; text-decoration: none; text-align: center; outline: none; font-size: 12px; }

/* Landscape Design Button */
.portNav li a.nav8 { width: 183px; background: url(../images/galleryNav.png) no-repeat 0px 0; }
.portNav li a.nav8:hover, .portNav li.active a.nav8 { background-position: 0px -64px; }

/* Pavers / Retaining Walls Button */
.portNav li a.nav9 { width: 230px; background: url(../images/galleryNav.png) no-repeat -183px 0; }
.portNav li a.nav9:hover, .portNav li.active a.nav9 { background-position: -183px -64px; }

/* Fencing Button */
.portNav li a.nav10 { width: 102px; background: url(../images/galleryNav.png) no-repeat -413px 0; }
.portNav li a.nav10:hover, .portNav li.active a.nav10 { background-position: -413px -64px; }

/* Drainage / Grading Button */
.portNav li a.nav11 { width: 171px; background: url(../images/galleryNav.png) no-repeat -515px 0; }
.portNav li a.nav11:hover, .portNav li.active a.nav11 { background-position: -515px -64px; }

#galleryContent { position: relative; width: 945px; height: 495px; background: url(../images/galleryBG.jpg) no-repeat; top: -10px; }
.galImages { position: relative; margin: 0 0 0 40px; top: 10px; }
#galContainer { position: absolute; width: 880px; height: 560px; top: 115px; left: 20px; }
#galContainer h3 { padding: 0 0 10px 0; }

#gallery { position: relative; width: 942px; height: 784px; background: url(../images/galleryBG.png) no-repeat; }
#galHeader { position: absolute; top: 50px; left: 210px; }