/*--------- globals -------------*/
* { margin:0; padding:0; outline:none;}

.clearAll { clear:both; font-size:1px; line-height:1px; height:.01em;}
.clearRule { clear:both; font-size:1px; line-height:1px; height:1px; border-bottom:1px solid #ecd56f; height:20px; margin-bottom:10px;}


p          { font-size:13px; line-height:19px; color:#5f5f5f;}
h1         { font-size:34px; line-height:36px; color:#c0a93e; padding:30px 0 10px 0; font-weight:normal;}
h2         { font-size:18px; line-height:20px; color:#ba891f; padding:15px 0 4px 0; margin-bottom:4px; font-weight:normal; border-bottom:1px solid #ecd56f;}
h3         { font-size:16px; line-height:26px; color:#5f5f5f; font-weight:normal;}


p a:link, p a:visited { color:#3e72a6;}
p a:hover, p a:active { color:#cb6000;}

ul  {}
li  { font-size:14px; line-height:16px; color:#5f5f5f; list-style:none; padding:4px 0 4px 20px; background: url(../images/ico-bullet.png) 6px 9px no-repeat;}


.imgBorder {border:2px solid #ecd56f;}
.padTop    {padding-top:10px;}
textarea, input, select { font-family:"Trebuchet MS", "Trebuchet MS Bold", "Trebuchet MS Bold Italic", "Trebuchet MS Italic";}

p.disclaimer {font-size:10px;}


/*--------- shell layout -------------*/
body          { background:#eee1a5 url(../images/shell-tileBody.png) center repeat-y; font-family:"Trebuchet MS", "Trebuchet MS Bold", "Trebuchet MS Bold Italic", "Trebuchet MS Italic";}
#header       { height:132px; width:100%; background:url(../images/shell-header.png) repeat-x;}
#headerShell  { height:132px; width:960px; margin:0 auto; background:url(../images/logo-waterview-dental.jpg) 0 0 no-repeat; position:relative;}

#contentAreaBack, #contentAreaTop { height:338px; width:100%;}
#contentAreaBack     { background: url(../images/shell-midTile.png) repeat-x;}
#contentAreaTop      { background: url(../images/shell-topNav.png) top center no-repeat;}

#content { width:820px; margin: 0 auto; position:relative;}




/*--------- top nav -------------*/
#topNav   { text-align:center; height:50px; width:820px;}
#topNav a { 
display:inline; height:20px; font-size:12px;; 
float:left; margin:20px 18px 0 16px; padding:0 3px 5px 3px; text-transform:uppercase;}

#topNav a:link, #topNav a:visited { text-decoration: none; border-bottom:5px solid #ecd56f; color:#3b3b3b;}
#topNav a:hover, #topNav a:active { text-decoration: none; border-bottom:5px solid #cb6000; color:#cb6000;}




/*--------- header -------------*/
#logo,#logo a  { width:300px; height:112px;}
#logo          { position:absolute; top:10px; left:60px;}
#logo a        { display:block;}

#topRtNav      { position:absolute; height:20px; width:400px; top:10px; right:70px; text-align:right; color:#76c8ff; line-height:24px;}
#topRtNav a    { text-transform:uppercase; color:#FFFFFF; font-size:11px; padding:0 2px 0 2px; margin:0 4px 0 4px; display:inline-block;}

#topRtNav a:link, #topRtNav a:visited { text-decoration: none; border-bottom:2px solid #145993;}
#topRtNav a:hover, #topRtNav a:active { text-decoration: none; border-bottom:2px solid #76c8ff;}




/*--------- footer -------------*/
#footer   { padding-top:20px; height:60px; clear:both;}
#footerL  { float:left; width:400px;}
#footerR  { float:right; width:400px; text-align:right;}




/*--------- collumns -------------*/
.colTwoL  { margin:0 0 0 70px; width:332px; float:left; display:inline;}
.colTwoR  { margin:0 0 0 40px; width:332px; float:left; display:inline;}
.colFull  { margin:0 0 0 70px; width:700px; float:left; display:inline;}
.colThin  { margin:0 0 0 70px; width:200px; float:left; display:inline;}
.colWide  { margin:0 0 0 0; width:525px; float:right; display:inline;}
.paperCol  { width:400px; padding:0 25px 0 20px; background:url(../images/paper-back-green.jpg) 0 50px no-repeat; float:left; min-height:300px}




/*--------- buttons -------------*/
.btn-blu        {margin:8px 0;}
.btn-blu a, .btn-blu span {display:block; height:43px; float:left; background-repeat:no-repeat;}
.btn-blu a      { text-decoration:none; background-image:url(../images/btn-blueL.png);}
.btn-blu a:hover, .btn-blu a:active, .btn-blu a:hover span, .btn-blu a:active span { background-position: 0 -42px; cursor:pointer;}

.btn-blu a span { background-image:url(../images/btn-blueR.png); width:18px;}
.btn-blu a b    { color:#004876; font-size:14px; padding:7px 6px 0 25px; float:left; font-weight:normal;}




/*--------- hero home page -------------*/
#heroPic { width:440px; height:340px; background:url(../images/home-hero.png) top right no-repeat; position:absolute; top:29px; right:-69px; z-index:10;}
#hero h3  { width:420px; padding:25px 0 0 20px;}




/*--------- testimonials -------------*/
.quoteHome    { width:350px; float:right; display:inline;}
.quote        { background:url(../images/ico-quoteOpen.png) 0 30px no-repeat; min-height:60px;}
.quote p      { padding:70px 0 0 40px; font-style:italic; font-size:18px; line-height:28px; color:#8d6104; font-family:Georgia, "Times New Roman", Times, serif;}
.quote p span { display:block; text-align:right;}




/*--------- before & after slide -------------*/
.slide     { width:163px; height:137px; float:left; text-align:center; background:url(../images/ico-slideBox.png) no-repeat;}
.slide p   { font-size:14px; font-style:italic; color:#333333; padding:12px 0 4px 0;}
.slide img { border:1px solid #e5d176; margin:4px 0 8px 0;}
.slidePadHome { margin:20px 0 10px 20px;}
.slidePadL    { margin:6px 0 8px 0;}
.slidePadR    { margin:6px 0 8px 5px;}

.slidePadHomeL, .slidePadHomeR { margin:2px 20px 6px 0;}
.paperCol p.drop  {margin:0 25px 15px 6px;}
.paperCol h3 {margin:0 25px 3px 6px;}




/*--------- procedures page -------------*/
.imgIntro      {margin:0;}
.imgIntro img  { float:left; margin:0 20px 0 0; border:2px solid #ecd56f;}
.imgIntro h3, .imgIntro p {}

.photoAlbum img { float:left; margin:0 10px 10px 0; border:2px solid #ecd56f;}



/*--------- staff page -------------*/
.listing      { width:280px; margin:40px 0 0 0px; float:right;}
.listing span { font-size:14px; line-height:18px; color:#1f6f9c; text-align:right; display:block; width:140px; float:left; padding:2px;}
.listing p    { width:120px; float:left; padding:2px;}
.listing i    { font-size:11px; width:100%; float:left; margin:2px 0;}



/*--------- contact page -------------*/
.contactForm          { margin-top:14px;}
.contactForm p        { margin:4px 0; height:28px; background:url(../images/form-1.png) top right no-repeat;}
.contactForm p span   { float:left; text-align:right; width:108px; padding:4px;} 
.contactForm p input  { float:right; width:173px; padding:5px 10px 8px 10px;}
.contactComment       { background:url(../images/form-2.png) 0 20px no-repeat;}
.contactComment textarea { width:322px; height:162px; padding:10px;}
.contactForm p input, .contactComment textarea { border:none; background:none; font-size:12px; color:#333333;}

.btnSubmit            { float:right; height:41px; width:100px; background:url(../images/btn-submit.png) 0 0 no-repeat; margin:10px 0 0 0; border:none;}
.btnSubmit:hover      { background-position:0 -41px; cursor:pointer;}