@charset "utf-8";

html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,
del,dfn,em,font,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td{
margin:0;
padding:0;
font-weight:inherit;
font-style:inherit;
font-family:inherit;
text-align:left;
}

/********************************************************
 Modify the styles below to customize your site's design. 
 ********************************************************/

/* base styles */
body{
font-family:Arial, Helvetica, sans-serif; /* base font */
font-size:12px;                           /* base font-size */
color:#4a4a4a;
background:#d6bd88 url(../images/bg.png) 0 0 repeat-x;
text-align:center; /* for centering layouts (remove if not desired) */
}

blockquote{
margin:10px;
}

blockquote em{
float:left;
margin-top:-10px;
margin-left:10px;
}

/* By only applying the margin to the bottom, spacing between
   these common block-level elements remains consistent and
   headings can be flush with the following content if desired. */
p,ul,ol,table,form,blockquote{
margin-bottom:10px;
text-align:left;
}

/* heading styles */
h1,h2,h3,h4,h5,h6{
color:#06C;
font-weight:bold;
}
h1{
color:#f3f3f3;
font-size:20px;
margin-bottom:15px;
margin-left:2px;
}
h2{
font-size:14px;
margin-bottom:3px;
}
h3{
font-size:14px;
color:#333;
}
h4,h5,h6{
font-size:14px;
}

/* hyperlink styles */
a{
color:#06C;
text-decoration:underline;
}
a:hover{
color:#FFCC00;
}

/* list styles */
ul{
list-style:none;
}
#content li{
padding:3px;
}
#content ul li{
padding-left:20px; /* custom bullet (because FF has ugly bullets) */
}
ol{
list-style-position:inside;
}
li ol{
padding-left:20px;
}
/* nested lists */
li ol, li ul{
margin-bottom:0;
}
#content ul li{
color:#4a4a4a;
background:url(../images/bullet-default.gif) 0 2px no-repeat;
}
#content li ul li{
background:url(../images/bullet-default.gif) 0 2px no-repeat;
}
/* table styles */
td{
vertical-align:top; /* 99% of the time, you really want this */
}

/* A class is used for formatting tables so nothing weird happens
   when someone wants to use a table for layout. */
table.dataTable{
}
.dataTable caption{
color:#06C;
font-weight:bold;
font-size:14px;
}
.dataTable th, .dataTable td{
text-align:center;
padding:5px;
}
.dataTable th{
font-weight:bold;
color:#fff;
background:#06C;
}
.dataTable td{
border-bottom:1px solid #ccc;
}

table.internetSpecial{
margin-left:82px;
border:1px solid #999999;
background:#fff1d0;
}
.internetSpecial td{
padding:5px;
}
.internetSpecial h2, .internetSpecial h3, .internetSpecial p{
text-align:center;
margin-bottom:0;
} 
table.internetSpecialNav{
border:1px solid #999999;
background:#fff1d0;

}
.internetSpecialNav td{
padding:5px;
}
#leftnav .internetSpecialNav h2, #leftnav .internetSpecialNav h3, #leftnav .internetSpecialNav p{
text-align:center;
margin:0;
} 
#leftnav .internetSpecialNav h2{
color:#06C;
}
#leftnav .internetSpecialNav h3{
color:#333;
}
table.freeEstimateNav{
border:1px solid #999999;
background:#010655 url(../images/free-estimate2.gif) repeat-x;
}
.freeEstimateNav td{
padding:5px;
}
#leftnav .freeEstimateNav h2, #leftnav .freeEstimateNav h3, #leftnav .freeEstimateNav p{
text-align:center;
margin:0;
} 
#leftnav .freeEstimateNav h2 a, #leftnav .freeEstimateNav p a{
color:#F7A21B;
}

#leftnav .freeEstimateNav h2 a:hover, #leftnav .freeEstimateNav p a:hover{
color:#ffcc00;
}

#leftnav .freeEstimate h2 a{
color:#06C;
}
#leftnav .freeEstimateNav h3{
color:#fff;
}
table.photoGallery{
border:1px solid #999999;
background:#fff1d0;
}
.photoGallery td{
padding:5px;
}
#leftnav .photoGallery h2, #leftnav .photoGallery h3, #leftnav .photoGallery p{
text-align:center;
margin:0;
} 
#residential-banner-pushdown{
margin-top:355px;
}


/* other miscallaneous styles */
strong,b{
color:#06C;
font-weight:bold;
}
em,i{
color:#000;
font-style:italic;
}
hr{
height: 0;
border: 0;
width:100%;
border-bottom: 1px solid #ccc;
margin:6px 8%;
}

/* common floats used for formatting and images */
.right{
float:right;
margin:0 0 0 10px;
}

.right-sp{
float:right;
margin:10px 0 10px 10px;
}

.left{
float:left;
margin:0 10px 10px 0;
}

.clear{
clear:both;
}

/* Begin your layout styles here. Override default styles where necessary. */
#outer-wrap{
background:url(../images/outer-bg.png) center 0 repeat-y;
}
#wrap{
width:900px;
margin:0 auto;
text-align:left;
background:url(../images/content-bg.png) 0 0 repeat-y;
min-height:450px;
border-bottom:2px solid #9f8448;
}
#header-wrap{
background:url(../images/header-bg.jpg) center 0 no-repeat;
height:290px;
}
#header{
width:900px;
height:290px;
margin: 0 auto;
}
#topnav{
float:right;
width:533px;
margin:0;
padding:0;
}
#professional{
float:right;
font-size:14px;
color:#0e5d89;
letter-spacing:1px;
margin-top:8px;
margin-right:3px;
width:230px;
}
#phone{
float:right;
font-size:15px;
color:#f8f8f8;
font-weight:bold;
margin-top:33px;
width:500px;
}
#logo{
float:left;
width:267px;
margin:0;
padding:0;
}
#content{
float:right;
background:url(../images/content-title.png) 0 0 no-repeat;
min-height:400px;
width:677px;
padding:15px;
padding-top:9px;
}
#leftnav{
float:left;
background:url(../images/leftnav-title.png) 0 0 no-repeat;
min-height:400px;
width:183px;
padding-top:19px;
padding-left:9px;
padding-right:1px;
}
#leftnav h3{
color:#FFFFFF;
margin-left:12px;
margin-bottom:10px;
font-size:12px;
}
#navigation ul{
display:none;
}
#navigation ul li a{
color:#2c6eb0;
text-decoration:none;
padding-top:4px;
padding-bottom:4px;
padding-right:10px;
padding-left:13px;
font-size:11px;
display:block;
background:url(../images/mini-play-orange.png) 0 6px no-repeat;
}
#navigation ul li a:hover{
background:url(../images/mini-play-orange-hover.png) 0 6px no-repeat;
}
#navigationul{
line-height:14px;
padding:0;
margin:0;
}
#navigation ul li{
border-bottom: 1px solid #e7e7e7;
background:url(../images/leftnav-li-bg.png) 0 bottom repeat-x;
padding:0;
margin:0;
}
#navigation ul li:hover{
background:#fff url(../images/leftnav-li-bg-hover.png) 0 bottom repeat-x;
}
#navigation ul li a:hover{
color:#2c6eb0;
}
#leftnav p{
padding-left:5px;
margin-bottom:4px;
}
#leftnav b, #leftnav strong{
color:#160e05;
}
#leftnav .title{
background:url(../images/subhead.png) 0 0 repeat-x;
padding-top:3px;
padding-bottom:3px;
padding-left:13px;
}
#leftnav .title:hover{
cursor:pointer;
}
#leftnav .title strong, #leftnav .title strong a{
font-size:12px;
color:#fff;
}
#leftnav .title strong:hover, #leftnav  a:hover{
color:#ffcc00;
text-decoration:none;
}
#leftnav  a{
text-decoration:none;
}
#leftnav-height{
height:30px;
}
#footer{
height:20px;
margin: 0 auto;
color:#986735;
padding-top:5px;
border:#c0a56b 1px solid;
margin-bottom:0px;
background-color:#e5d2aa;
}
#footer-right{
float:right;
margin-right:10px;
}
#footer-left{
float:left;
margin-left:10px;
}
#footer a{
color:#986735;
text-decoration:none;
}
#footer a:hover{
color:#fff;
}
#footer2{
border-top: 1px solid #c0a56b;
margin: 0 auto;
width:900px;
min-height:100px;
font-size:11px;
color:#986735;
padding-top:5px;
}
#footer2 a{
color:#7b4d1e;
}
#footer2 a:hover{
color:#FFFFFF;
}
#footer2 b, #footer2 strong{
color:#986735;
}
#footer3{
margin:0 auto;
text-align:center;
margin-bottom:0px;
color:#5e3f1f;
padding-left:30px;
background:#f0e9d8;
padding:10px;
border:#c0a56b 1px solid;
}
#footer3 b, #footer3 strong{
color:#06C;
}
#top-links-h1{
margin-top:30px;
margin-left:30px;
}
#top-links-h1 h1{
margin:0;
}
#top-links-h1 h1 a{
color:#f3f3f3;
text-decoration:none;
}
#top-links-h1 h1 a:hover{
text-decoration:underline;
}
#top-links{
margin-top:10px;
margin-left:47px;
}
#top-links p a{
font-weight:bold;
font-size:15px;
line-height:8px;
color:#ffe2a4;
text-decoration:none;
}
#top-links p a:hover{
color:#FFFFFF;
}
#video{
margin-left:80px;
}
#vmag{
float:right;
background:url(../images/vmag-img.jpg);
height:160px;
width:250px;
margin-bottom:5px;
}
#vmag a{
float:right;
padding-right: 70px;
padding-top:-20px;
}
#vmag p, #vmag strong{
float:right;
color:#000;
margin-right:38px;
margin-top:120px;
}

#left-box{
float:left;
background:#062134;
color:#fff;
margin:10px;
border:#0E5D8A 1px solid;
width:200px;
height:174px;
}
#left-box a{
color:#fff;
font-weight:bold;
display:block;
text-align:center;
background:#062134;
text-decoration:none;
}
#left-box h2{
padding-top:4px;
padding-bottom:4px;
font-size:12px;
border-bottom:#0E5D8A 1px solid;
margin-bottom:0px;
}
#left-box a:hover{
color:#ffe2a4;
}

#left-col{
float:left;
margin-right:20px;
margin-left:0px;
}

#index-banner{
float:left;
border:1px solid #0E5D8A;
background:#062134;
margin-left:10px;
margin-top:10px;
margin-bottom:0px;
width:190px;
padding:5px;
text-align:center;
}
#index-banner strong{
text-align:center;
color:#fff;
font-weight:bold;
}
#index-banner p{
text-align:center;
color:#fff;
}
#index-banner a{
text-align:center;
color:#fff1d0;
text-decoration:none;
margin-bottom:0px;
}
#index-banner a:hover, #index-banner h3 a:hover{
color:#ffcc00;
text-decoration:none;
}
#index-banner h3, #index-banner h3 a{
color:#fff1d0;
font-weight:bold;
text-align:center;
font-size:16px;
text-decoration:none;
}

.gate-design{
float:left;
margin-left:10px;
margin-bottom:10px;
border:#333 1px solid;
}
.left-rule{
float:left;
width:340px;
}
.left-rule-full{
float:left;
width:580px;
}

.contact{
background: #f1f6fa;
border: #2e97ff 1px solid;
text-align:center;
padding-left:80px;
padding-right:100px;
}

#gallery1 a{
}
#gallery1 img {
	margin: 12px;
}
