* {margin: 0; padding: 0;} body {background:url(images/background.jpg) #fdfaec; background-repeat: repeat-x; font-family: Helvetica, Arial, Courier, sans-serif; color:#222; font-size:62.5%;} h1 {font-size:2.6em; margin-bottom:5px; color:#3b5a11;} h2 {margin-bottom:10px; font-size:2.1em;} h3 {margin-bottom:10px; font-size:1.8em;} h2 a, h3 a, h4 a {border:none; color:#222;} h2 a:hover, h3 a:hover, h4 a:hover {border:none;} #services h3 {float:left; width:455px;} h4 {margin-bottom:10px; font-size:1.5em;} hr {background:#ccc; margin: 10px 0; border:none; height:1px;} .fl {float:left; display:inline;} .fr {float:right; display:inline;} img.fl {margin-right:10px;} a {outline:none; color:#3b5a11; text-decoration:none;} a:hover {text-decoration: underline;} img {border:none;} .noborder {border:none;} a:hover.noborder {border:none;} p {font-size:1.4em; line-height:1.4em; margin-bottom:10px;} ul {margin:0 0 10px 20px;} ul li {font-size:1.4em; line-height:1.4em; list-style-image:url(images/bullet.jpg);} .flimg {border:5px solid #dbedbd; float: left; margin: 0 10px 10px 0;} .frimg {border:5px solid #dbedbd; float: right; margin: 0 0px 10px 10px;} /*===================================== ======= GENERAL =====================================*/ #phplive_btn {position: absolute; right:15px;} #logo {display:block; background:url(images/logo.png); width:275px; height:114px; z-index: 10; position: relative; left: 95px; float: left;} #number {float:right; font-size: 3.5em; color:#505f2a; margin: 35px 150px 0 0; font-weight:bold;} #leaves{background:url(images/leaves.png); width:165px; height:849px; position: absolute; z-index: 1; left:-66px; top:0px;} #leaves2 {background:url(images/leaves2.png); width:168px; height:262px; position: absolute; z-index: 1; right:-5px; top:0px;} #leaves3 {background:url(images/leaves2.png); width:168px; height:262px; position: absolute; z-index: 1; right:-5px; top:-25px;} #content {position: relative; z-index: 10; margin: 0 auto; width:900px;} #topContent {background:url(images/topcontent.png); width:900px; height:39px; position: relative; z-index: 10;} #middleContent {background:url(images/middlecontent.png); width:820px; padding: 0 40px; overflow: hidden; position: relative; z-index: 10; min-height: 615px} #bottomContent {background:url(images/bottomcontent.png); width:900px; height:36px; position: relative; z-index: 10;} #mainContent {width:580px; float:left;} #subContent {width:220px; float:right;} #slideBack {background:url(images/slideback.jpg); width:640px; height:300px; margin: 0 auto 40px; padding: 15px 71px 17px 74px; position: relative; z-index: 10;} .learnMoreBtn {background:url(images/learnmore_btn.png); display: block; height: 31px; text-indent: -9999px; width:133px;} .learnMoreBtn:hover {background-position: 0 100%; border:none;} .pageheader {position: relative; z-index: 10; display: block; margin-bottom: 10px;} .teamMember {background: #dbedbd; border:5px solid #dbedbd; display:block; float:left; margin: 0 18px 15px 0px; min-height:173px;} .teamMember .name {color:#4a7015; display: block; font-size: 1.2em; font-weight: bold;} .teamMember .title {color:#222;} .teamMember:hover {text-decoration: none;} #addressCharlotte {float: left; margin-right: 10px; width: 245px;} .address {background:#f3f3f3; border: 1px solid #ccc; font-size:1.4em; height:109px; line-height: 1.4em; margin-bottom: 10px; padding: 10px;} #charlotteMap {margin-right:10px;} .map {border:5px solid #dbedbd; float: left; width: 266px;} #contactForm, #response {background:#f3f3f3; border: 1px solid #ccc; float: left; margin-top: 10px; padding: 10px; width:540px;} #contactForm p {width:195px;} #contactForm label {display: block; width: 95px;} input {width:195px;} #submit {background:url(images/send.png); border: 0px solid #fff; cursor: pointer; min-height: 28px; position: relative; text-indent: -9999px; top:10px; width:75px;} #submit:hover {background-position: 0 100%;} table {border-collapse: collapse; border-right: 1px solid #ccc; border-top:1px solid #ccc; font-size: 1.4em; width: 100%;} .highlight {background-color: #e3f1ce !important;} .odd {background-color:#eee;} td {border-bottom:1px solid #ccc; border-left:1px solid #ccc; padding:5px;} th {border-bottom:1px solid #ccc; border-left:1px solid #ccc; padding:5px;} .credential img {border:5px solid #dbedbd; margin-bottom: 10px; margin-right: 70px; vertical-align: middle;} .credential img:hover {border: 5px solid #95c349;} /*===================================== ======= NAVIGATION =====================================*/ #navigation {float:right; list-style-type: none; margin: 5px 0 0 0; width:685px; position: relative; z-index: 11;} #navigation li {float:left; display: inline; margin: 0 10px; position: relative;} #navigation #services {} #navigation #services a {background:url(images/btn_services.png); z-index: 12; position: relative;} #navigation #gallery a {background:url(images/btn_gallery.png);} #navigation #ourteam a {background:url(images/btn_ourteam.png);} #navigation #contactus a {background:url(images/btn_contactus.png);} #navigation #home a {background:url(images/btn_home.png);} #navigation li a {width:117px; height:36px; text-indent: -9999px; display: block;} #navigation li a:hover {background-position:0 100% !important;} #navigation li.serviceshover a {background-position:0 100% !important;} #home_page #navigation #home a {background-position: 0 100%;} #services_page #navigation #services a {background-position: 0 100%;} #ourteam_page #navigation #ourteam a {background-position: 0 100%;} #contactus_page #navigation #contactus a {background-position: 0 100%;} #gallery_page #navigation #gallery a {background-position: 0 100%;} #navigation #services .subMenu {position: absolute; z-index: 11; background: #b6e734; top:31px; left:-34px; padding:5px 0; -moz-border-radius:4px;} #navigation #services .subMenu li {margin: 0; background: #b6e734; display: block; float: none;} #navigation #services .subMenu a {background: none; text-indent: 0; font-size:0.8em; height:auto; width:125px; padding: 0 10px;} #navigation #services .subMenu li.odd {background:#aede32;} #navigation #services .subMenu li a:hover {background:#deff85; text-decoration: none;} /*===================================== ======= TESTIMONIAL =====================================*/ @font-face { font-family: Handwritten; src: url('/TalkingToTheMoon.ttf'); } #letterWrapper {background:url(/images/pagemid.jpg); } #letter {background:url(/images/pagetop.jpg) no-repeat; padding:40px 60px 40px 40px; position: relative;min-height:904px;} #letterBottom {background:url(/images/pagebottom.jpg); position: absolute; width:580px; height: 413px; bottom: 0; left:0;} #letterText {font-family: Handwritten; position: relative;} #letterText p {line-height: 1.6em; font-size:1.5em;} /*===================================== ======= CTA =====================================*/ #stormCTA {background:url(images/storm_damage_cta.png); width:180px; height:109px; margin-bottom:15px; padding: 90px 20px 0; position:relative; z-index: 10;} #stormCTA p {font-size: 1.1em;} #timelapseCTA {background:url(images/timelapse_cta.png); display: block; height:151px; width: 138px; margin-bottom:15px; padding: 44px 64px 0 20px; position: relative; z-index: 10;} #timelapseCTA p {color:#222; font-size: 1.1em;} #timelapseCTA:hover {text-decoration: none;} #credentialsCTA {background:url(images/credentials_cta.png); height:109px; width:180px; padding: 90px 20px 0; position: relative; z-index: 10;} #credentialsCTA p {font-size:1.1em;} #testimonialsCTA {background:url(images/testimonials_cta.png); height:109px; width:180px; padding: 50px 20px 39px; position: relative; z-index: 10;} #testimonialsCTA p {font-size:1.1em;} #testimonialsCTA .learnMoreBtn {position: relative; top: 55px;} /*===================================== ======= GALLERY =====================================*/ #galleryThumbs {list-style-type:none; overflow:hidden;} #galleryThumbs li { list-style-image:none; float:left;} #galleryThumbs li a {border:3px solid #dbedbd; display:block;width:74px; height:75px; margin:5px; cursor:pointer;} #galleryThumbs li a:hover {border:3px solid #95c349;} #galleryLarge {border: 5px solid #dbedbd; position:relative; width:553px;} #galleryLarge img{display:block;} #galleryCaption {background-color:#eee; border:1px solid #ccc; margin-top:10px; padding:10px;} /*===================================== ======= FOOTER =====================================*/ #footerWrapper {background-color:#8cba41; border-top:3px solid #fff; min-height:130px;} #footer {width:960px; margin: 0 auto; overflow:hidden; position:relative;} #footerInfo {float:left;} #footerLinks {list-style-type:none; margin: 0 0 10px 0; overflow:hidden;} #footerLinks li {float:left; display:inline; font-size:1.2em; margin-top:10px; padding:0 10px; width:104px; font-weight:bold;} #footerLinks li:first-child {border-left:none;} #footerLinks li a {color:#fff; text-decoration:none; border:none;} #footerLinks li a:hover {text-decoration:underline;} #footerLinks li ul {margin-top:-5px;} #footerLinks li ul li {display:block; font-size:0.8em; float:none; border:none; line-height:0.6em; margin-left:-30px; font-weight:normal; width:auto; list-style-image:none;} #footerLinks li ul li a {border:none;} #footerIconsWrapper {position: absolute; top:120px; left:70px;} #footerIcons {width:160px;} #footerIcons a {border:none;} .footerContact {float:right; margin-top:10px; width:170px;} .footerContact p {line-height:1.4em; font-size:1.1em; margin-bottom:0; padding-right:10px} #handsoncharlotte {overflow:hidden; padding:5px; width:300px; position:absolute; top:1px; left:170px; background-color:#fff; line-height:1.7em; -moz-border-radius:5px; -webkit-border-radius:5px; font-size:1.2em; line-height:1.5em;} #footerAssociates {float: right; height:100px; margin-top:75px; width:550px;} #footerAssociates img {display: block; float: left; margin-right:10px; margin-bottom: 10px;} /*===================================== ======= TWITTER =====================================*/ #twitterUpdates {float:right; width:340px; margin:10px 0;} #twitterUpdates h2 {font-size:1.4em; margin-left:20px} #twitterUpdates ul {font-size:0.8em;} #twitterUpdates ul li {list-style-type:none; list-style-image:none; background-color:#d6e6a0; padding:5px; margin:5px 0; -moz-border-radius:5px; -webkit-border-radius:5px;} #twitter-link {background:url(images/followtwitter.png); width:160px; height:27px; text-indent:-9999px; display:block; border: none; margin-left:20px;} /*===================================== ======= DROPCAM =====================================*/ .cameraThumb {float: left; margin: 5px;} .cameraThumb p {margin: 0;} .cameraImage {width:263px; height:196px; background: #000;} /*===================================== ======= CODA SLIDER =====================================*/ /* Most common stuff you'll need to change */ .coda-slider {} /* Use this to keep the slider content contained in a box even when JavaScript is disabled */ .coda-slider-no-js .coda-slider { height: 200px; overflow: auto !important; padding-right: 20px } /* Change the width of the entire slider (without dynamic arrows) */ .coda-slider, .coda-slider .panel { width: 553px } /* Change margin and width of the slider (with dynamic arrows) */ .coda-slider-wrapper.arrows .coda-slider, .coda-slider-wrapper.arrows .coda-slider .panel { width: 553px } .coda-slider-wrapper.arrows .coda-slider { margin: 0 10px } /* Arrow styling */ .coda-nav-left a, .coda-nav-right a {} /* Tab nav */ .coda-nav ul li a.current { background: #9fd63d; font-weight:bold; border:none; color:#537e17; } /* Panel padding */ .coda-slider .panel-wrapper { padding: 20px } /* Preloader */ .coda-slider p.loading { padding: 20px; text-align: center } /* Don't change anything below here unless you know what you're doing */ /* Tabbed nav */ .coda-nav ul { clear: both; display: block; margin: auto; overflow: hidden } .coda-nav ul li { display: inline } .coda-nav ul li a { background: #537e17; color: #fff; display: block; float: left; margin-right: 1px; padding: 3px 6px; text-decoration: none; border:none; } /* Miscellaneous */ .coda-slider-wrapper { clear: both; overflow: auto } .coda-slider { float: left; overflow: hidden; position: relative } .coda-slider .panel { display: block; float: left } .coda-slider .panel-container { position: relative } .coda-nav-left { float: left } .coda-nav-right { float: right } .coda-nav-left a, .coda-nav-right a { display:inline; text-align: center; text-decoration: none; border:none; } /*============================*/ /*=== Custom Slider Styles ===*/ /*============================*/ #slider-wrapper { background:url(images/slider.png) no-repeat; width:998px; height:392px; margin:0 auto; padding-top:74px; margin-top:50px; } #slider { position:relative; width:640px; height:300px; background:url(/includes/js/nivo/images/loading.gif) no-repeat 50% 50%; } #slider img { position:absolute; top:0px; left:0px; display:none; } #slider a { border:0; display:block; } .nivo-controlNav { position:absolute; left:260px; bottom:-42px; } .nivo-controlNav a { display:block; width:22px; height:22px; background:url(/includes/js/nivo/images/bullets.png) no-repeat; text-indent:-9999px; border:0; margin-right:3px; float:left; } .nivo-controlNav a.active { background-position:0 -22px; } .nivo-directionNav a { display:block; width:30px; height:30px; background:url(/includes/js/nivo/images/arrows.png) no-repeat; text-indent:-9999px; border:0; } a.nivo-nextNav { background-position:-30px 0; right:15px; } a.nivo-prevNav { left:15px; } .nivo-caption { text-shadow:none; font-family: Helvetica, Arial, sans-serif; } .nivo-caption a { color:#efe9d1; text-decoration:underline; }