/**************** ********************************************************************************************************* Project: One City Mortgage Level: Global Styles Author: Rob McKenzie Date: 20th December 2009 Company: Grow Media Website: http://www.growmedia.ca Contents 01 - GENERAL 02 - HEADER 02.01 - MAIN NAVIGATION 03 - BODY 04 - FOOTER 05 - COPYRIGHT Colors Used Green : #9bbd05 Light Grey: #d9d9d9 /**************** ********************************************************************************************************* 01 - GENERAL ********************************************************************************************************* ****************/ *{margin:0;padding:0} html{background:#141414} body{position:relative;font-size:87.5%;font-family:Helvetica,Arial,sans-serif} div#wrapper{background:#ededed url(_images/_general/main-back-slice.gif) repeat-x 0 0;position:relative;min-height:571px;height:auto !important;height:571px} em{color:red;font-weight:700} /**************** ********************************************************************************************************* 02 - HEADER ********************************************************************************************************* ****************/ div#header{width:878px;margin:0 auto;position:relative;z-index:30} h1{background:url(_images/_header/one-city-logo.png) no-repeat 0 0;text-indent:-999em;width:161px;height:49px;position:absolute;top:44px;left:10px;cursor:pointer} a#homeLink{display:block;position:absolute;width:161px;height:49px;top:44px;left:6px;text-indent:-999em} /* 02.01 - MAIN NAVIGATION */ ul#mainNavigation{position:absolute;top:48px;right:27px;list-style:none} ul#mainNavigation li{float:left} ul#mainNavigation li a{display:block;height:49px;background-position:0 0;background-repeat:no-repeat;text-indent:-999em;outline:none} ul#mainNavigation li a:hover, ul#mainNavigation li a.active{background-position:0 -49px} a#home{width:48px;background:url(_images/_header/_navigation/nav-01-home.png) no-repeat} a#whoWeAre{width:98px;background:url(_images/_header/_navigation/nav-02-who-we-are.png)} a#whatWeDo{width:99px;background:url(_images/_header/_navigation/nav-03-what-we-do.png)} a#getAQuote{width:96px;background:url(_images/_header/_navigation/nav-04-get-a-quote.png)} a#realEstateAgents{width:127px;background:url(_images/_header/_navigation/nav-05-real-estate-agents.png)} a#happyCustomers{width:135px;background:url(_images/_header/_navigation/nav-06-happy-customers.png)} /**************** ********************************************************************************************************* 03 - BODY ********************************************************************************************************* ****************/ div#body{width:878px;margin:0 auto;background:url(_images/_body/body-content-drop-shadow.png) no-repeat 0 146px;position:relative;padding:145px 0 40px 0;z-index:15} div#bodyContent{border:1px solid #e6e6e6;background:#fff;width:840px;margin:0 10px;top:10px;position:relative;z-index: 20;min-height:315px;height:auto !important;height:315px;padding-top:30px;padding-bottom:40px;} /* CONTENT TAGS - MOVE OVER 350px */ div#bodyContent h2, div#bodyContent h3, div#bodyContent h4, div#bodyContent p, form#homeGetAQuote{position:relative;left:350px;width:420px;} /* HEADERS: h2, h3 */ div#bodyContent h2, div#bodyContent h3, div#bodyContent h4{line-height:1.3em} div#bodyContent h2{color:#b7b7b7;font-size:2.429em;background:url(_images/_body/horizontal-dotted-divider.gif) no-repeat 1px 100%;padding:0 0 15px 0;margin-bottom:20px} div#bodyContent h3{color:#202020;font-size:1.714em;margin-bottom:20px} div#bodyContent h4{color:#9bbd05;font-size:1.714em;margin-bottom:14px} /* BODY CONTENT PARAGRAPH: p */ div#bodyContent p{color:#585858;font-size:1em;line-height:1.5em;margin-bottom:1.5em;} div#bodyContent p.error{color:red} /* BODY CONTENT PARAGRAPH: a */ div#bodyContent a{color:#9bbd05;text-decoration:none} div#bodyContent a:hover{text-decoration:underline} /* GET A QUOTE LINK */ a.getAQuoteToday{position:absolute;right:0;top:470px;text-indent:-999em;display:block;width:282px;height:41px;background:url(_images/_body/button-get-a-quote.png) no-repeat 0 0;outline:none;z-index:30} a.getAQuoteToday:hover{background-position:0 -41px} div#bodyContent a.getAQuoteToday{position:relative;left:585px;top:auto} div#bodyContent a.getAQuoteToday:hover{} /* GET A QUOTE - FORM */ form#homeGetAQuote{background:url(_images/_body/horizontal-dotted-divider.gif) no-repeat 1px 0;padding-top:30px} form#homeGetAQuote ol{list-style:none} label{text-transform:uppercase;font-size:0.714em;color:#585858;float:left;width:70px;margin:21px 10px 0 10px;} label#zipCodeLabel{width:60px;margin-left:40px} fieldset{border:1px solid #ececec;margin-bottom:1.5em;padding:0 0 17px 10px;clear:both;} fieldset#submit{border:none;padding:0;} fieldset#typeOfLoan label{display:inline;float:none;width:auto;} legend{color:#8dc63f;font-size:0.857em;font-weight:700;padding:0 10px;} li#zipCodeContainer{float:left;} li#stateContainer{float:left} input.textInput{border:1px solid #bebebe;height:15px;padding:5px;color:#585858;width:285px;margin-top:12px;} input#zipCode{width:129px} input#propertyValue, input#loanAmount{margin-left:10px;width:365px} input.checkBox{margin:10px 10px 0 10px} ol#checkBoxColumn01, ol#checkBoxColumn02{float:left} ol#checkBoxColumn02{margin-left:50px} select.selectInput{margin-top:16px} textarea{height:70px;width:285px;border:1px solid #bebebe;padding:5px;color:#585858;margin-top:12px} input.submitButton{float:right;} /* FLOATING CITY */ img#floatingCity{position:absolute;left:35px;top:145px;z-index:30} /* CITY SCAPE */ img.cityScape{position:absolute;top:365px;z-index:10} img#cityScape01{left:10%;} img#cityScape02{right:10%;} /**************** ********************************************************************************************************* 04 - FOOTER ********************************************************************************************************* ****************/ div#footer{height:197px;background:url(_images/_footer/footer-back-slice.gif) repeat-x 0 0} div#footer ul{list-style:none;width:878px;margin:0 auto;position:relative} div#footer ul li{float:left;width:270px;margin-top:18px;margin-right:10px;padding:12px 0 0 12px;} div#footer ul li h4 a{height:29px;width:270px;text-indent:-999em;display:block;background-position:0 0;background-repeat:no-repeat} div#footer ul li h4 a:hover{background-position:0 -29px} a#twitter{background:url(_images/_footer/footer-header-twitter.png)} a#facebook{background:url(_images/_footer/footer-header-facebook.png)} div#footer ul li#footerContact{position:absolute;margin-right:0;right:15px;width:240px;height:180px;background:url(_images/_footer/footer-contact-background.png) no-repeat 0 0;} div#footer ul li h4#contactus{background:url(_images/_footer/footer-header-contact.png) no-repeat 0 0;width:240px;height:29px;text-indent:-999em} div#footer ul li p{color:#5c5c5c;margin-left:43px;line-height:1.5em;margin-top:8px} div#footer ul li p#telephone{color:#fff;margin-top:0} div#footer ul li p#sendEmail{margin-top:0} div#footer ul li p#sendEmail a{color:#9bbd05;text-decoration:none} div#footer ul li p#sendEmail a:hover{text-decoration:underline} /**************** ********************************************************************************************************* 05 - COPYRIGHT ********************************************************************************************************* ****************/ div#copyright{} div#copyright ul{list-style:none;width:878px;margin:0 auto;position:relative} div#copyright ul li{position:absolute;right:27px;top:20px;background:url(_images/_copyright/copyright-dotted-divider.gif) no-repeat 0 0;width:401px;padding-top:10px} div#copyright ul li p{font-size:0.714em;color:#545454;text-align:right;padding-bottom:10px;line-height:1.3em} div#copyright a{color:#fff;text-decoration:none} div#copyright a:hover{text-decoration:underline}