/* CSS Document */

body, html { background: #d8d8d8; margin: 0px; color: #4d4d4d; font-family: Arial, Helvetica, sans-serif; }

a { cursor: pointer; }

h1 { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 16px; padding: 0px; margin: 20px 0px 0px 0px; font-weight: bold; text-transform: uppercase; }

h2, .h2 { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 14px; color: #777; padding: 0px; margin: 20px 0px 0px 0px; font-weight: bold; text-transform: uppercase; }

#navbar, #secondaryNav { font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 14px; font-weight: normal; }

p, #content ul, ul.formatted { font-size: 12px; line-height: 200%; margin: 12px 0px 0px 0px; }

span#loginInstructions a, p a, #content ul a, #content h1 a, #content h2 a, li.comment a { font-weight: bold; color: #4d4d4d; text-decoration: none; border-bottom: 1px dashed #4d4d4d; }

span#loginInstructions a:hover, p a:hover, #content ul a:hover, #content h1 a:hover, #content h2 a:hover,  li.comment a:hover { border-bottom: #b4c183 solid 1px; color: #b4c183;  }

#content ul { list-style: circle; margin: 0px 0px 0px 16px; padding: 0px; }

#content ul li { text-indent: -10px; padding-left: 10px; margin: 0px; }

#content ul.easySlider li { text-indent: 0px; padding: 0px; }

#container { width: 960px; margin: 0 auto; }

#header { width: 900px; height: 110px; padding: 30px 30px 0px 30px; background: url(/img/bgHeader.png) no-repeat; float: left; }

#logo { width: 200px; height: 80px; margin: 30px 0px 0px 20px; float: left; }

a img { border: none; }

#secondaryNav { width: 660px; height: 20px; margin: 30px 0px 0px 0px; line-height: 20px; float: left; font-size: 14px; text-transform: lowercase; }

#secondaryNav .secondaryItem { float: right; margin-left: 30px; }

#secondaryNav a, #navbar a { color: #4d4d4d; text-decoration: none; }

#secondaryNav a:hover, #secondaryNav span:hover { text-decoration: underline; }

#navbar { float: left; width: 660px; height: 30px; margin: 25px 0px 0px 0px; font-size: 14px; }

#navbar ul, #navbar ul li { margin: 0px 0px 0px 0px; padding: 0px; list-style: none; height: 30px; text-align: center; }

#navbar ul { float: right; }

#navbar ul li { float: left; display: inline-block; margin: 0px 0px 0px 53px; line-height: 20px; }

#navbar ul li a { padding-top: 0px; text-decoration: none; colordisplay: inline-block; cursor: pointer; padding-left: 0px; *display: inline-block; *vertical-align: bottom; }

#navbar ul .navhome a, #navbar ul .navhome:hover a, #navbar ul li:hover a { padding: 0px 0px 2px 0px; border-bottom: #b4c183 3px solid; }

#content { width: 900px; float: left; padding: 30px 30px 10px 30px; background: url(/img/bgContent.png) repeat-y; }

#contentCap { width: 900px; float: left; height: 50px; padding: 0px 30px; background: url(/img/bgFooter.png) no-repeat; }

#footer { width: 930px; margin: 10px 0px 20px 30px; float: left; min-height: 100px; }

#columnLeft { width: 298px; float: left; min-height: 10px; margin: 0px 0px 0px 20px; }

#columnRight { width: 522px; float: left; min-height: 10px; margin: 0px 0px 0px 40px; }

#columnWide { width: 860px; margin: 0px 0px 0px 20px; }

#homeSplash { width: 522px; height: 300px; background: url(/img/bgHomeSplash.png) no-repeat; padding: 33px 30px 37px 30px; margin: -10px 0px 0px -10px; overflow: hidden; }

#slider { width: 522px; height: 300px; }

#slider ol, #slider ul, #slider li { margin: 0px; padding: 0px; list-style: none; height: 300px; width: 522px; overflow: hidden; }

#recentProjectsSlider ol, #recentProjectsSlider ul, #recentProjectsSlider li { padding: 0px; margin: 0px; height: 160px; width: 160px; overflow: hidden; list-style: none; }

#footer #recentProjects { min-height: 200px; float: left; width: 180px; padding: 0 10px; margin: 0px 7px 0px 40px; }

#recentProjectsSlider { width: 160px; max-width: 160px; overflow: hidden; height: 200px; margin: 0px 0px 5px -20px; padding: 3px 20px 7px 20px; background: url(/img/bgRecentProjects.png) no-repeat; }

#recentProjectsMask { width: 160px; overflow: hidden; }

#recentProjects img { width: 160px; height: 100px; margin: 0px 0px 10px 0px; float: left; }

#recentProjectsSlider li span.recentProjectsInfo { line-height: 200%; width: 160px; height: 50px; font-size: 12px; display: block; float: left; color: #4d4d4d; }

ol#controls { margin: 5px 0 0 236px; padding: 0; max-height: 10px; height: 10px; overflow: hidden; }

ol#recentProjectsControls li, ol#controls li { margin: 0; padding: 0; float: left; list-style: none; height: 10px; width: 10px; line-height: 100px; }

#recentProjectsControls { margin: -10px 0px 0px 60px; padding: 0px; }

ol#controls li a { float: left; height: 10px; line-height: 100px; border: none; background: url(/img/btnSwitcher.png) -10px -10px no-repeat; color: #555; padding: 0 0px; text-decoration: none; }

ol#controls li.current a { background: url(/img/btnSwitcher.png) 0px -10px no-repeat; color: #fff; }

ol#recentProjectsControls li a {float: left; height: 10px; line-height: 100px; border: none; background: url(/img/btnSwitcher.png) -10px 0px no-repeat; padding: 0 0px; text-decoration: none; overflow: hidden; }

ol#recentProjectsControls li.current a { background: url(/img/btnSwitcher.png) 0px 0px no-repeat; color: #fff; }

ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus, ol#recentProjectsControls li a:focus { outline: none; }

#footer #info { font-size: 12px; line-height: 200%; min-height: 200px; float: left; width: 298px; margin: 0px 0px 0px 20px; }

#footer h1 { margin: 4px 0px 0px 0px; padding-bottom: 5px; }

#footer #emailForm { min-height: 200px; float: left; width: 320px; margin: 0px 0px 0px 40px; }

#footer #info ul, #footer #info li { display: block; margin: 0px; padding: 0px; width: 95px; float: left; list-style: none; font-weight: bold; }

#footer #info #secondaryInfo { width: 198px; float: left; }

#footer #info #copyright { width: inherity; float: left; margin: 40px 0px 10px 0px; height: 30px; }

#footer a { color: #4d4d4d; text-decoration: none; }

#footer a:hover { text-decoration: underline; }

#emailFooter input.footerInputEmail, #emailFooter textarea, .txtInput { width: 306px; height: 24px; background: #f9f9f9; border: 1px solid #b6b6b6; padding: 0px 0px 0px 2px; }

#emailFooter input.footerInputEmail:hover, #emailFooter textarea:hover, #emailFooter input.footerInputEmail:focus, #emailFooter textarea:focus, .txtInput:hover, .txtInput:focus { border-color: #693; }

#emailFooter textarea { height: 53px; width: 308px; resize: none; padding: 0px;  }

.inputError { border: 1px solid #C00 !important; }

.inputErrorLabel { font-weight: bold; color: #C00; }

#emailSent { display: none; }

#emailSent img { width: 64px; height: 64px; float: left; margin: 5px 0px 0px 123px; }

#emailSent p { width: 310px; float: left; }

#emailFooter div { font-size: 12px; line-height: 29px; height: 24px; margin: 5px 0px 1px 0px; }

.btnFooterEmail { font-size: 12px !important; color: #4d4d4d; display: block; text-align: center; background: url(/img/btnSubmit.png) no-repeat; width: 70px; height: 20px; line-height: 20px; margin-top: 12px; cursor: pointer; padding: 0px; border: 0px; }

.btnFooterEmail:hover { background-position: center; }

.btnFooterEmail:active { background-position: bottom; }

#overlay { width: 100%; height: 100%; position: fixed; left: 0px; background: #000; z-index: 100; display: none; }

.overlay { cursor: pointer; }

.popOver { display: none; z-index: 200; position: fixed; top: 0; margin: 200px 0px 0px 0px; *margin: 0px 0px 0px -750px; left: calc(50vw - 250px); cursor: default; width: 500px; min-height: 40px; background: #fff; -moz-box-shadow: #666 0 2px 10px; -webkit-box-shadow: #666 0 2px 10px; -khtml-box-shadow: #666 0 2px 10px; box-shadow: #666 0 2px 10px; }

.popOverTall { margin-top: 60px; }

div.popOver { display: none; padding: 20px; }

.popOver div { display: none; }

.popOver h1 { margin-top: 0px; }

.popOverClose { width: 40px !important; height: 40px !important; float: right; padding: 0 !important; background: url(/img/btnClose.png) no-repeat; margin: -38px; cursor: pointer; }

.popOverClose:hover { background-position: center; }

.popOverClose:active { background-position: bottom; }

.closeLink { position: absolute; width: 100px; margin: -20px 0px 0px 400px; text-align: right; }

.loginLabel { display: block; font-size: 12px; margin: 15px 0px 0px 0px; line-height: 200%; }

#btnLogin { margin-top: 20px; }

#checkboxRememberUser { margin-top: -16px; float: right; }

#labelForLoginCheckbox { margin-top: -22px; margin-right: 20px; float: right; text-align: right; }

#loginForm { width: 310px; height: 150px; display: block; }

#visibilityToggle { display: block; margin-top: -21px; margin-left: 280px; position: fixed; background-image: url(/img/visibilityToggle.svg); background-position: bottom center; background-size: 100%; background-repeat: no-repeat; width: 16px; height: 16px; cursor: pointer; opacity: 0.5; }
#visibilityToggle:hover { opacity: 1; }
.passwordVisibile { background-position: top center !important; }

#loginInstructions { width: 150px; min-height: 100px; display: block; position: absolute; margin: -160px 0px 0px 350px; font-size: 12px; line-height: 200%; }

#loginInstructions div { display: inline; }

.unselectedInput { color: #999; }

.incompatibilityWarning { width: 900px; background: #ffb57c; height: 40px; -moz-box-shadow: #666 0 2px 10px; -webkit-box-shadow: #666 0 2px 10px; -khtml-box-shadow: #666 0 2px 10px; box-shadow: #666 0 2px 10px; position: fixed; margin: 0px 0px 0px 30px; }

.incompatibilityWarning img { float: left; width: 34px; height: 34px; margin: 3px 0px 0px 10px; }

.incompatibilityWarning span { float: left; width: 800px; font-weight: bold; font-size: 14px; line-height: 34px; color: #000; height: 34px; margin: 3px 0px 0px 10px; }

.alert { font-weight: bold; color: #d00; }

#servicesSelector { width: 880px; height: 100px; margin: 40px 0px 40px -10px; }

.serviceSelector { width: 286px; height: 100px; background: url(/img/bgServicesSelector.png) no-repeat; cursor: pointer; float: left; }

.serviceSelector h2 { line-height: 100px; text-align: center; padding: 0px; margin: 0px; }

.serviceSelected h2 { color: #4d4d4d; font-size: 16px; }

#serviceInfoContainer { min-height: 300px; }

#selectWeb { padding: 0px 0px 0px 11px; background-position: top left; }

#selectWeb:hover, #selectWeb.serviceSelected { background-position: bottom left !important; }

#selectLogo { padding: 0px 0px 0px 0px; background-position: top center; }

#selectLogo:hover, #selectLogo.serviceSelected { background-position: bottom center; }

#selectPrint { padding: 0px 0px 0px 11px; background-position: top right; }

#selectPrint:hover, #selectPrint.serviceSelected { background-position: bottom right; }

.serviceDiv { display: none; }

.serviceDivActive { display: block; }

span.sideNote { float: right; text-align: right; margin: -19px 0px 0px 0px; font-size: 12px; color: #777; text-transform: uppercase; }

span.sideNote a { display: inline-block; margin-left: 20px; color: #777; border-bottom: #777 dashed 1px; text-decoration: none; }

span.sideNote a:hover { border-bottom: #b4c183 solid 1px; color: #b4c183; }

.serviceHeader { height: 50px; width: 522px; margin: 20px 0px 0px 0px; float: left; }

.serviceHeader img { float: left; display: block; width: 50px; height: 50px; }

.serviceHeader .h2 { line-height: 22px; float: left; display: block; margin: 0px 0px 0px 10px; padding: 0px; }

#serviceInfoContainer p { width: 462px; float: left; margin: -27px 0px 0px 60px; }

#serviceDivContainer { width: 522px; min-height: 360px; float: left; }

#serviceQuickQuote { width: 298px; margin: 0px 0px 0px 40px; float: left; }

#serviceQuickQuote h2 { margin: 0px; padding: 0px; line-height: 22px; }

#serviceQuickQuote input { width: 296px; height: 24px; background: #fff; border: 1px solid #b6b6b6; padding: 0px 0px 0px 0px; margin: 10px 0px 0px 0px; }

#serviceQuoteForm { margin: 0px 0px 40px 0px; }

#btnServiceRequestAQuote { text-align: center; line-height: 48px; border-bottom: none; margin: -24px 0px 12px 8px; height: 48px; width: 298px; background: url(/img/btnRequestAQuote.png) bottom center no-repeat; }

#btnServiceRequestAQuote:active { background-position: center top; }

#btnServiceRequestAQuote a { border: none !important; width: 298px; height: 48px; display: block; }

.serviceFolioLink a { width: 298px; height: 300px; float: left; display: none; }

#serviceFolioOverlay { background: url(/img/serviceFolioOverlay.png) no-repeat; margin: -300px 0px 0px 0px; }

#portfolioInstructions { height: 70px; margin: 10px 0px 0px 0px; padding: 0px; width: 298px; float: left; font-size: 11px; line-height: 150%; color: #777; }

#thumbs { margin: 7px 0px 0px 0px; padding: 0px; text-indent: 0px; list-style: none; width: 306px; float: left; min-height: 350px; }

#thumbs ul { margin: 0px; paddign: 0px; }

#thumbs li { width: 62px; height: 62px; background: #eee; list-style: none; display: inline block; float: left; padding: 0px !important; margin: 0px 8px 8px 0px !important; text-indent: 0px !important; border: 3px solid #fff; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-box-shadow: #999 0 2px 10px; -moz-box-shadow: #999 0 2px 10px; box-shadow: #999 0 2px 10px; }

#thumbs a img { width: 62px !important; height: 62px !important; margin: 0px; }

.selected { border-color: #666 !important; -webkit-box-shadow: #666 0 2px 3px !important; -moz-box-shadow: #666 0 2px 3px !important; box-shadow: #666 0 2px 3px !important; }

#thumbs a { border: 0px !important; }

#thumbs li:hover { border-color: #999; }

.portfolioPrevLink, .portfolioNextLink { background: url(/img/btnPrevNext.png) no-repeat; display: block; width: 40px; height: 40px; line-height: 100px; overflow: hidden; }

.portfolioPrevLink { float: left; background-position: top left; }

.portfolioNextLink { float: right; background-position: top right; }

.portfolioPrevLink:hover { background-position: left center; }

.portfolioNextLink:hover { background-position: right center; }

.portfolioPrevLink:active { background-position: left bottom; }

.portfolioNextLink:active { background-position: right bottom; }

ul.thumbs { height: 310px; }

.pagination { width: 298px; height: 40px; float: left; line-height: 100px; *line-height: 40px; overflow: hidden; }

#portfolioSelector { width: 298px; height: 40px; padding: 10px 5px; background: url(/img/bgPortfolioNavigation.png) no-repeat; margin: 13px 0px 0px -5px; }

.portfolioSelector { -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; width: 99px; height: 40px; background: url(/img/btnPortfolioNavigation.png) top repeat-x; float: left; cursor: pointer; text-align: center; margin: 0px; padding: 0px; line-height: 40px; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 16px; font-weight: bold; text-transform: uppercase; display: block; text-decoration: none; color: #4d4d4d; }

.portfolioSelector:hover, .portfolioSelected { background: url(/img/btnPortfolioNavigation.png) bottom repeat-x; }

.portfolioSelected { color: #b4c183; }

.portfolioSelector .portfolioTip { width: 240px; height: 20px; background: #eee; position: relative; line-height: 20px; font-size: 12px; display: block; opacity: 0; visibility: hidden; color: #4d4d4d; font-weight: normal; border: 3px solid #fff; -moz-box-shadow: #999 0 2px 7px; -webkit-box-shadow: #999 0 2px 7px; -khtml-box-shadow: #999 0 2px 7px; box-shadow: #999 0 2px 7px; margin: -60px 0px 0px -74px; -moz-transition-delay: 1.0s; -webkit-transition-delay: 1.0s; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; }

.portfolioSelector:hover .portfolioTip { opacity: 0.9; visibility: visible; margin: -75px 0px 0px -74px; }

#portfolioLogo { width: 98px; margin: 0px 1px; }

.slideshow-container { width: 522px; height: 340px; padding: 10px 10px 20px 10px; background: url(/img/bgPortfolioSlide.png) no-repeat; margin: -10px; }

div.caption, .pagination { background: #f7f7f7; }

#caption { height: 100px; margin: 20px 0px 0px 0px; width: 522px; }

#caption h2, #caption p { margin: 0px 0px 0px 0px; line-height: 18px; }

#slideshow img { width: 500px; height: 320px; margin: 11px 0px 0px 7px; *background: url(/img/bgPortfolioSlide.png) no-repeat -10px -22px; }

a.advance-link { underline: 0px; text-decoration: none; cursor: default; }

.testimonial { font-size: 11px; /*font-variant: small-caps;*/ font-style: italic; }

p#sidebarContact b { width: 20px; display: inline-block; }

.hideOldIE { *display: none; *visibility: hidden; }

#contactMail input.contactInput, #contactMail textarea { width: 520px; height: 24px; background: #f9f9f9; border: 1px solid #b6b6b6; padding: 0px 0px 0px 0px; }

#contactMail input.contactInput:hover, #contactMail textarea:hover, #contactMail input.contactInput:focus , #contactMail textarea:focus { background: #eee; border-color: #693; }

#contactMail textarea { height: 100px; resize: none; padding: 0px;  }

.inputError { border: 1px solid #C00 !important; }

.inputErrorLabel { font-weight: bold; color: #C00; }

input:focus, textarea:focus { outline: none; }

#contactSent { display: none; }

#contactSent img { width: 64px; height: 64px; float: left; margin: 5px 0px 0px 229px; }

#contactSent p { width: 522px; float: left; }

#contactMail div { font-size: 12px; line-height: 29px; height: 24px; margin: 5px 0px 1px 0px; }

.btnContact { font-size: 12px !important; color: #4d4d4d; display: block; text-align: center; background: url(/img/btnSubmit.png) no-repeat; width: 70px; height: 20px; line-height: 20px; margin-top: 12px; cursor: pointer; padding: 0px; border: 0px; }

.btnContact:hover { background-position: center; }

.btnContact:active { background-position: bottom; }

#registrationForm input.txtInput { display: block; margin-bottom: 10px; }

.clientGallery { display: block; float: left; width: 860px; }

.clientGallery img { float: left; max-width: 165px; max-height: 260px; border: 3px solid #fff; -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-box-shadow: #999 0 2px 10px; -moz-box-shadow: #999 0 2px 10px; box-shadow: #999 0 2px 10px; margin: 10px 40px 30px 0px; background: #eee; }

.clientGallery img:hover { border-color: #666; -webkit-box-shadow: #666 0 2px 3px; -moz-box-shadow: #666 0 2px 3px; box-shadow: #666 0 2px 3px; }

/*disable live chat till it's workign normal*/
#liveChat { display: none; }

/* Special for blog */
.entry img { max-width: 522px !important; }
.entry p { text-align: justify; }
#columnRight div.navigation a { color: #999; text-decoration: none; border-bottom: 1px dashed #999; font-weight: bold; font-size: 12px; text-transform: uppercase; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; display: inline-block; }
#columnRight div.navigation a:hover { color: #b4c183; border-bottom: #b4c183 solid 1px; }
.navigation .alignright { float: right; }
.navigation .alignleft { float: left; }
#columnRight div.navigation { width: 520px; display: block; height: 30px; }
.type-post small { margin-top: 20px; }
.avatar { display: none; }
li.comment, li.pingback { font-size: 12px; margin-top: 20px; width: 502px; padding: 10px; }
li.even { background-color: #eee; }
ol.commentlist { list-style: none; text-indent: 0px; margin: 0px; padding: 0px; width: 522px; }
ul.children { list-style: none !important; margin-left: 20px !important; }
ul.children li.comment, ul.children li.pingback { width: 440px; margin-top: 30px !important; padding: 10px !important; padding-left: 30px !important; }
.depth-3 { margin-left: -40px !important; }