/* imports two stylesheets to clean up clutter */ @import "ieReplace.css"; @import "architects.css"; @charset "UTF-8"; /* table of contents - Find these sections for easier navigation through the css file. */ /* ----- normal styled home page ----- */ /* ----- header ----- */ /* ----- top navigation ----- */ /* ----- flash slogans on inside pages ----- */ /* ----- logo flash movie ----- */ /* ----- content section ----- */ /* ----- spotlight boxes ----- */ /* ----- portfolio tabs ----- */ /* ----- home page portfolio gallery ----- */ /* ----- recent work page ----- */ /* ----- site info ----- */ /* colors ========================= orange: #F4951D grey: #666666 */ /* CSS Document */ * {margin: 0px; padding: 0px;} body, html {margin: 0px !important; padding: 0px !important;} a {outline: none;} body {background: #b4b4b4; font-size: 62.5%; line-height: 1.5em; font-family: "Lucida Grande",Arial, Helvetica, sans-serif} #wrapper { position: absolute; height:975px; width:100%; overflow: hidden; top: 0px; left: 0px; } #slide_box { height:100%; width:20000px; position: relative; margin:0px; padding:0px; z-index:10;} /* ----- =normal styled home page ----- */ #normal {width: 100%; height: 100%; position: absolute; left: 0; top:0px; left: 0px;} #architects {width: 100%; height: 100%; position: absolute; left: 0; top:0px; left: 3000px; background: #ffffff} .page_navigation {position: absolute; top:0px; left: 300px; height: 75px; width: 75px; z-index: 100; background: #33FF33} .page_navigation a {display: block; height: 100%; width: 100%;} /* ----- header ----- */ body.home2 .header {background: url(../images/header_bkg.jpg) repeat-x; height: 180px; width: 100%;} body.home2 .header h1 {background:url(../images/header.jpg) no-repeat left; height:180px; width: 100%; position: relative; z-index: 50} .header {background: url(../images/header_bkg.jpg) bottom left repeat-x; height: 75px; width: 100%;} .header h1 {background:url(../images/header.jpg) no-repeat bottom left; height:75px; width: 100%; position: relative; z-index: 50; margin: 0 !important; padding: 0 !important;} .header h1 a {display: block;height: 100%; width:100%; text-indent:-9999px;} body.home2 .top {background:url(../images/home_top.jpg) repeat-x; height: 262px; width: 100%;} .top {background:url(../images/inside_top.jpg) repeat-x; height: 126px; width: 100%;} #branding {background: url(../images/logo.png) bottom no-repeat; height: 195px; width: 367px; position: absolute; top: 0; left: 25px; z-index: 100} #branding h1 {height: 190px; width: 100%;} #branding h1 a {height: 190px; width: 100%; display: block;text-indent: -9999px;} /* ----- top navigation ----- */ body.home2 .top ul.navMain {height: 30px; width: 550px; float: left; list-style:none; margin: 1px 0 0 450px} *html body .navMain {position: relative; right: 450px } .top ul.navMain, .contentMain ul.navMain {height: 30px; width: 550px; float: left; list-style:none; margin: 1px 0 10px 450px; position: relative; bottom: 1px;} .top .navMain li, .contentMain .navMain li {height: 30px; display: block; float: left;} .top .navMain li a, .contentMain .navMain li a {display: block; height: 100%; width: 100%; text-indent: -9999px;} .top .navMain li.about, .contentMain .navMain li.about {background:url(../images/nav_top_about.png) no-repeat; width: 141px;} .top .navMain li.news, .contentMain .navMain li.news {background:url(../images/nav_top_news.png) no-repeat; width: 109px;} .top .navMain li.ourwork, .contentMain .navMain li.ourwork {background:url(../images/nav_top_ourwork.png) no-repeat; width: 68px;} .top .navMain li.testimonials, .contentMain .navMain li.testimonials {background:url(../images/nav_top_testimonials.png) no-repeat; width: 76px;} .top .navMain li.contact, .contentMain .navMain li.contact {background:url(../images/nav_top_contact.png) no-repeat; width: 74px;} .top .navMain li.blog, .contentMain .navMain li.blog {background:url(../images/nav_top_blog.png) no-repeat; width: 74px;} .top .navMain li.about a:hover, .contentMain .navMain li.about a:hover {background:url(../images/nav_top_about_on.png) no-repeat bottom; width: 141px;} .top .navMain li.news a:hover, .contentMain .navMain li.news a:hover {background:url(../images/nav_top_news_on.png) no-repeat bottom; width: 109px;} .top .navMain li.ourwork a:hover, .contentMain .navMain li.ourwork a:hover {background:url(../images/nav_top_ourwork_on.png) no-repeat bottom; width: 68px;} .top .navMain li.testimonials a:hover, .contentMain .navMain li.testimonials a:hover {background:url(../images/nav_top_testimonials_on.png) no-repeat bottom; width: 76px;} .top .navMain li.contact a:hover, .contentMain .navMain li.contact a:hover {background:url(../images/nav_top_contact_on.png) no-repeat bottom; width: 74px;} .top .navMain li.blog a:hover, .contentMain .navMain li.blog a:hover {background:url(../images/nav_top_blog_on.png) no-repeat bottom; width: 74px;} .top .navMain li.about:hover, .contentMain .navMain li.about:hover {background:url(../images/nav_top_about_bkg.png) no-repeat bottom;} .top .navMain li.news:hover, .contentMain .navMain li.news:hover {background:url(../images/nav_top_news_bkg.png) no-repeat bottom;} .top .navMain li.ourwork:hover, .contentMain .navMain li.ourwork:hover {background:url(../images/nav_top_ourwork_bkg.png) no-repeat bottom;} .top .navMain li.testimonials:hover, .contentMain .navMain li.testimonials:hover {background:url(../images/nav_top_testimonials_bkg.png) no-repeat bottom;} .top .navMain li.contact:hover, .contentMain .navMain li.contact:hover {background:url(../images/nav_top_contact_bkg.png) no-repeat bottom;} .top .navMain li.blog:hover, .contentMain .navMain li.blog:hover {background:url(../images/nav_top_blog_bkg.png) no-repeat bottom;} .slogan {background:url(../images/home_slogan.png) no-repeat; height: 106px; width: 365px; float: left; margin: 63px 0 0 556px; clear: left; text-indent: -9999px;} .ABCslogan {background:url(../images/conferenceBtn.png) no-repeat; height: 106px; width: 365px; float: left; margin: 53px 0 0 556px; clear: left; text-indent: -9999px;} .ABCslogan:hover {background:url(../images/conferenceBtnOver.png) no-repeat; height: 106px; width: 365px; float: left; margin: 53px 0 0 556px; clear: left; text-indent: -9999px;} .ABCslogan a { height: 106px; width: 365px; display: block; } /* flash slogans on inside pages */ #slogansMC {position: absolute; z-index: 75; height: 90px; width: 517px; top: 95px; left: 395px;} /* ----- spotlight boxes ----- */ body.home2 .spotlight {background: url(../images/home_spotlight_bkg.png) no-repeat; height: 174px; width: 251px; margin: 0 18px 0 0; float: left; position: relative; left: 32px; bottom: 34px; clear: none} body.home2 .spotlight h3 {height: 20px; margin: 20px 0 6px 20px} .contentMain .spotlight h3 {margin: 0} .spotlightDiv {width: 285px; float: left; clear: left; margin: 0 0 165px 0} .spotlight {background:url(../images/inside_spotlight_bkg.gif) no-repeat; height: 64px; width: 251px; margin: 0 0px 11px 34px; float: left; clear: left } .spotlightDropTop {background:url(../images/inside_spotlight_bkg.gif) no-repeat; height: 46px; width: 251px; margin: 0 0 0 34px; float: left; clear: left; position: relative; z-index: 100 } .spotlightDropTop:hover {background: url(../images/inside_spotlight_drop_bkg.gif)} body.home2 .spotlight h3 { height: 20px; margin: 20px 0 6px 20px; padding: 0} body.home2 .spotlight h3 a {display: block; height: 20px; width: 100%; text-indent: -9999px !important; padding: 0px !important; margin: 0px;} .spotlightDropTop h3 {text-indent:-9999px; height: 20px; margin:0; } .spotlight a {display: block; height:38px; width: 230px; text-indent: -9999px; padding: 20px 0 6px 20px} .spotlightDropTop a {display: block; height:20px; width: 220px; text-indent: -9999px; padding: 20px 0 6px 20px} .spotlight h3.webServices {background:url(../images/spotlight_webServices.gif) no-repeat; width: 141px} .spotlight h3.brandServices {background:url(../images/spotlight_brandServices.gif) no-repeat; width: 163px;} body.home2 .spotlight p a {text-indent: 0px} .spotlight h3.getStarted, .spotlightDropTop h3.getStarted {background:url(../images/spotlight_getStarted.gif) no-repeat; width: 121px} #displayBox {background:url(../images/inside_spotlight_drop_mid.gif) repeat-y; width: 251px;} .spotlight p, .spotlightDropTop p {color: #333333; line-height: 1.6em; margin: 0px 20px 0 20px!important; font-size: 1.2em;} .spotlight p a, .spotlightDropTop p a {color: #EC811D; text-decoration: none; text-indent: 0; display: inline; padding: 0px; margin: 0px} .spotlight p a:hover, .spotlightDropTop p a:hover {text-decoration: underline} .spotlightDropBottom {background:url(../images/inside_spotlight_dropBottom_bkg.gif) no-repeat; height: 18px; width: 251px} /* ----- portfolio tabs ----- */ .portfolio_tabs_home {background:url(../images/backhoe.png) no-repeat ; height: 291px; width: 373px; position: relative; bottom: 45px; float: left; clear: none} .portfolio_tabs {background: none; height: 150px; width: 373px; clear: left; position: relative; z-index: 100;float: left } .portfolio_tabs_home div a, .portfolio_tabs div a {display: block; height:100%; width: 100%; text-indent: -9999px; padding: 0px; margin: 0px} .portfolio_tabs_home div.logo_tab, .portfolio_tabs div.logo_tab{background:url(../images/home_tab_logo.png) no-repeat top right; height: 39px; width: 137px; position: relative; z-index: 75;} .portfolio_tabs_home div.web_tab, .portfolio_tabs div.web_tab {background:url(../images/home_tab_web.png) no-repeat top right; height: 39px; width: 130px; position: relative; z-index: 70; bottom: 8px} .portfolio_tabs_home div.brand_tab,.portfolio_tabs div.brand_tab {background:url(../images/home_tab_branding.png) no-repeat top right; height: 43px; width: 153px; position: relative; z-index: 65; bottom: 17px;} *html body .portfolio_tabs div.logo_tab {margin:0px; padding: 0px; bottom: 0} *html body .portfolio_tabs div.web_tab {margin:0px; padding: 0px; bottom: 25px} *html body .portfolio_tabs div.brand_tab {margin:0px; padding: 0px; bottom:60px} .tabPosition_home {position: relative; top: 138px; } .tabPosition {position: relative;top:15px; right: 34px} /* ----- content ----- */ home.contentMain {background:url(../images/content_bkg.jpg) bottom left no-repeat #ffffff; width: 100%;} .contentMain {background:url(../images/content_bkg.jpg) bottom left no-repeat #ffffff; width: 100%;padding: 0 0 100px 0} .contentMain p {margin: 5px 0 7px 0; color: #3b3b3b; font-size: 1.2em; line-height: 1.5em} .home_info {margin: 0 0 0 50px; float: left; width: 473px; clear: none} body.links .content_info {width: 550px} .content_info {margin: 65px 0 0 120px; float: left; width: 468px; clear: none;} .content_info p {margin: 5px 0 7px 0; color: #3b3b3b; font-size: 1.2em; line-height: 1.5em} .content_info p a {text-decoration:none; color: #F4951D; padding: 3px; } .content_info p a:hover {color:#F4951D; text-decoration: underline} .contentMain {clear: left;} .contentMain h3.flash {border-bottom: 2px solid #F4951D; width: 435px; margin: 0 0 8px 0; letter-spacing: 3px; height: 30px;padding: 0} .contentMain h3 { font-size: 1.5em; clear: both; padding: 20px 0 8px 0; color: #666666} .contentMain h4 {font-size: 1.2em; color: #F4951D; letter-spacing: 1px; margin: 0 0 2px 0} .content_info ul {margin: 5px 0 7px 0; color: #3b3b3b; font-size: 1.2em; line-height: 1.5em; list-style: none} .content_info ul a {text-decoration:none; color: #F4951D; padding: 3px; } .content_info ul a:hover {color:#F4951D; text-decoration: underline} #portfolioHeader h3.flash { width: 435px; margin: 0 0 8px 0; letter-spacing: 3px; height: 30px;} /* ----- site info ----- */ body.home2 #siteinfo {position: relative; top: 975px;} #siteinfo {color:#616161; margin: 0 0 20px 0 ; clear: both;padding: 0 0 20px 0} #siteinfo p {margin:12px 10px 0 0;text-align:right; font-size:11px; line-height:1.3em; float: right} .sitemap {width: 500px; display: block; margin:10px auto 0 auto; text-align:center;} .sitemap ul {display: inline-block; text-align: center; width: auto; margin:3px auto 0 auto} .sitemap li {list-style:none; display:inline; padding:1px 6px;} #secondNav {margin: 2px auto 0 auto} #dtp {background: url(../images/dtpBtn.jpg) no-repeat; height: 32px; width: 154px; margin: 10px auto} #dtp a {display: block; height: 100%; width: 100%; text-indent: -9999px} #dtp a:hover {background:url(../images/dtpBtn_over.jpg) no-repeat;} #siteinfo a {color:#616161; text-decoration:none;} #siteinfo a:hover { color:#333333; text-decoration:underline;} a#abcLogo {background: url(../images/abc_logo_gray.gif) no-repeat top left;position:absolute;width:86px;height:59px;text-indent:-9999px;margin:20px 0 0 10px; float: left} a:hover#abcLogo {background:url(../images/abc_logo.gif) no-repeat top left;} a#smpsLogo {background:url(../images/SMPS.gif) no-repeat top left; height: 47px; width: 154px; text-indent:-9999px; position:absolute;margin:20px 0 0 116px; float: left} a#smpsLogo:hover {background:url(../images/SMPS_on.gif) no-repeat top left;} /* ----- home page portfolio gallery ----- */ .homeGallery {background:url(../images/home_gallery_bkg.png) no-repeat; height: 163px; width: 342px; position: absolute; margin: 0 0 0 528px} .homeGallery p {width: 700px; height: 100px; overflow: hidden} .homeGallery p a { text-indent: 0; margin: 0px; pading: 0px; display: inline} .homeGallery p img {border: none} /* position: relative; */ .homeGallery .galleryLeft {float: left; background:url(../images/home_gallery_previous.jpg) no-repeat; height: 12px; width: 76px; position: relative; top: 50px; left: 26px; } .homeGallery .galleryLeft a {display: block; height: 100%; width: 100%; text-indent: -9999px; } .homeGallery .galleryLeft a:hover {background:url(../images/home_gallery_previous_on.jpg) no-repeat;} .homeGallery .galleryRight {float: right; background:url(../images/home_gallery_next.jpg) no-repeat; height: 12px; width: 48px; position: relative; top: 50px; right: 38px; } .homeGallery .galleryRight a {display: block; height:100%; width: 100%; text-indent: -9999px;} .homeGallery .galleryRight a:hover {background:url(../images/home_gallery_next_on.jpg) no-repeat;} /* ----- logo flash movie ----- */ #logoMovie {position: absolute; float: left; height: 395px; width: 456px} /* ----- recent work page ----- */ .content_info .recent {margin: 0 10px 8px 0; clear: both; float: left} /*----- Moustache Mayhem Link ----- */ #moustache {background:url(../images/mmLogo.png) no-repeat; height: 159px; width: 370px; position: absolute; z-index: 9999; top:238px; left:576px} #moustache a {display: block; height: 100%; width: 100%; text-indent: -9999px} /*----- web analysis form -----*/ #webAnalysis {background:url(../images/webAnalyser_inside.png) no-repeat; height: 131px; width: 131px; position: absolute; z-index: 9999; top: 487px; left: 209px} body.home2 #webAnalysis { top: 22px; left: 382px;background:url(../images/webAnalyser.png) no-repeat;} #webAnalysis a {display: block; height: 100%; width: 100%; text-indent: -9999px; cursor: pointer !important} #webAnalysis a:hover {background:url(../images/webAnalyser_on.png) no-repeat;} #analysis {width: 393px} #analysis fieldset {padding: 20px; margin: 10px 0 10px 0; width: 393px; background:#F7F7F7; border: 1px solid #E4E4E4; clear: left; position: relative;} #analysis label {font-size: 1.3em; height: 21px; padding: 6px ; color: #666666; margin: 0 0px 0 0; text-align: right; float: left; clear: left;} #analysis input { float: left; margin: 0 0 15px 0; } input, textarea {border: 1px solid #848484; font-family: "Lucida Grande",Arial, Helvetica, sans-serif ;font-size: 1.5em;height: 21px; padding: 5px; color:#616161;} textarea {height: 70px; } input:hover, textarea:hover {border: 1px solid #F4951D !important} input:focus, textarea:focus {border: 1px solid #F4951D !important; background: #FFEFB1; } #analysis fieldset legend {display: none} #analysis fieldset h3 {font-size: 1.6em; letter-spacing: .1em; height: 20px; display: block; margin: 0 0 7px 0; padding: 0px} #analysis #one label { width: 120px;} #analysis #one input { width: 232px;} #analysis #two label {width: 200px} #analysis #two input {width: 100px} #analysis #three label {width: 325px; text-align: left; padding: 5px 0 0 0} #analysis #three input, #analysis #three textarea {clear: left; width: 390px; margin: 3px 0 5px 0; clear: left; padding: 5px; font-size: 1.5em; float: left; font-family: "Lucida Grande",Arial, Helvetica, sans-serif } #analysis #three textarea {height: 70px; border: 1px solid #848484; color: #666666} .submitBTN {background:url(../images/submitBTN.gif) no-repeat; height: 42px; width: 98px; margin: 0 20px 0 90px; border: none} .resetBTN {background:url(../images/resetBTN.gif) no-repeat ; height: 42px; width: 98px; border: none } .findBTN {background: url(../images/fndBTN.gif) no-repeat; height: 37px; width: 87px; border: none} .submitBTN:hover, .resetBTN:hover, .findBTN:hover {border: none !important} .submitBTN:focus {border: none !important; background: url(../images/submitBTN.gif) no-repeat} .resetBTN:focus {border: none !important; background:url(../images/resetBTN.gif) no-repeat} .findBTN:focus {border: none !important; background:url(../images/findBTN.gif) no-repeat} .form-submit .submitBTN {margin: 0 20px 0 0 }