/* Theme Name: Urban Design & Build Theme URI: http://www.urbandesignid.com Description: Interior Design Version: 1.0 Author: Keefe Au Author URL: http://aukeefe.carbonmade.com */ /* RESET */ html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input { margin: 0; padding: 0; } h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th { font-size: 1em; font-weight: normal; font-style: normal; } fieldset,img { border: none; } caption,th { text-align: left; } /* LAYOUT */ .clear { clear: both; } /* TYPE */ body { font: 75%/170% Arial, Verdana, sans-serif; color: #979783; background:url(../images/bgpattern.jpg) repeat; text-align: center; } input, textarea { font-family: Arial, Helvetica, sans-serif; font-size: 100%; } p { color: #99998c; line-height:1.52em; font-family: Arial, Verdana, sans-serif; font-size: 96%; } a { text-decoration:none; cursor:pointer; color:#217290; } a:hover { text-decoration:none; color:#a9adae; } a:visited {text-decoration:none; } /* container */ #container { width:1000px; margin: 0 auto; text-align: left; } /* header */ #header { width:1000px; height:142px; margin-top:35px; position: relative; } #tp_grdsh { background:url(../images/tp_grdshd.png) no-repeat; width:1000px; height:20px; position:relative; _background:transparent url(http://www.urbandesignid.com/assets/images/blank.gif) repeat 0 0; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='http://www.urbandesignid.com/assets/images/tp_grdshd.png'); } #tplfsd_grd { background:url(../images/tplfsd_grd.png) no-repeat; width:20px; height:122px; position:relative; float:left; _background:transparent url(http://www.urbandesignid.com/assets/images/blank.gif) repeat 0 0; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='http://www.urbandesignid.com/assets/images/tplfsd_grd.png'); } #tprgsd_grd { background:url(../images/tprgsd_grd.png) no-repeat; width:20px; height:122px; position:relative; float:right; _background:transparent url(http://www.urbandesignid.com/assets/images/blank.gif) repeat 0 0; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='http://www.urbandesignid.com/assets/images/tprgsd_grd.png'); } #tp_bg { background:url(../images/tp_wdbg.jpg) no-repeat; width:960px; height:122px; float:left; position:relative; } #logo a { background:url(../images/udb_logo.png) no-repeat; width:287px; height:80px; position: absolute; text-indent:-900em; overflow:hidden; top:19px; right:16px; _background:transparent url(../images/blank.gif) repeat 0 0; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='../images/udb_logo.png'); } #logo.home a { cursor: default !important; } /* navigation */ #navigation { width: 610px; height: 122px; position: relative; left:23px; } #navigation #nav { margin: 0; padding: 0; } #navigation #nav li { display: inline; } #navigation #nav li a { background:url(../images/menu.png) no-repeat; float:left; height: 122px; overflow: hidden; } /* OVER STATES */ #navigation #nav li#nav-home a:hover { background-position: 0 -122px; width:78px; height:122px; } #navigation #nav li#nav-portfolio a:hover { background-position: -78px -122px; width:102px; height:122px; } #navigation #nav li#nav-services a:hover { background-position: -180px -122px; width:102px; height:122px; } #navigation #nav li#nav-about a:hover { background-position: -282px -122px; width:106px; height:122px; } #navigation #nav li#nav-enquiry a:hover { background-position: -388px -122px; width:98px; height:122px; } #navigation #nav li#nav-contact a:hover { background-position: -486px -122px; width:124px; height:122px; } /* ON STATES */ #navigation #nav li#nav-home a { background-position: 0 0; width:78px; height:122px; } #navigation #nav li#nav-portfolio a { background-position: -78px 0; width:102px; height:122px; } #navigation #nav li#nav-services a { background-position: -180px 0; width:102px; height:122px; } #navigation #nav li#nav-about a { background-position: -282px 0; width:106px; height:122px; } #navigation #nav li#nav-enquiry a { background-position: -388px 0; width:98px; height:122px; } #navigation #nav li#nav-contact a { background-position: -486px 0; width:124px; height:122px; } /* DOWN STATES */ #navigation.home #nav li#nav-home a { background-position: 0 -244px; width:78px; height:122px; cursor: default !important; } #navigation.portfolio #nav li#nav-portfolio a { background-position: -78px -244px; width:102px; height:122px; cursor: default !important; } #navigation.services #nav li#nav-services a { background-position: -180px -244px; width:102px; height:122px; cursor: default !important; } #navigation.about #nav li#nav-about a { background-position: -282px -244px; width:106px; height:122px; cursor: default !important; } #navigation.enquiry #nav li#nav-enquiry a { background-position: -388px -244px; width:98px; height:122px; cursor: default !important; } #navigation.contact #nav li#nav-contact a { background-position: -486px -244px; width:124px; height:122px; cursor: default !important; } /* content */ #content { width: 1000px; height:425px; margin: 0 auto; position: relative; } #mdlfsd_grd { background:url(../images/mdlfsd_grd.png) no-repeat; width:20px; height:425px; position:relative; float:left; _background:transparent url(http://www.urbandesignid.com/assets/images/blank.gif) repeat 0 0; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='http://www.urbandesignid.com/assets/images/mdlfsd_grd.png'); } #mdrgsd_grd { background:url(../images/mdrgsd_grd.png) no-repeat; width:20px; height:425px; position:relative; float:right; _background:transparent url(http://www.urbandesignid.com/assets/images/blank.gif) repeat 0 0; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='http://www.urbandesignid.com/assets/images/mdrgsd_grd.png'); } #md_bg { background:url(../images/md_wdbg.jpg) no-repeat; width:960px; height:425px; float:left; position:relative; } #home_flash { width:520px; height:345px; position:relative; margin:0; left:23px; float:left; } #intro { width: 437px; height:345px; position:relative; margin:0; float:right; right:0; background-color:#363533; } .intro-text { text-align:justify; width:350px; font-size:99%; line-height:1.2em; margin-top: 60px; margin-right: 10px; margin-bottom: 15px; margin-left: 50px; } #intro-img { background:url(../images/intro-title.jpg) no-repeat; width:320px; height:60px; position:absolute; top:2px; left:61px; text-indent:-900em; } #enquiry-box { width: 549px; height:425px; position:relative; margin:0; float:right; right:0; background-color:#363533; } #enquiry-imgbox { width: 411px; height:425px; position:relative; background-color:#2385aa; float:left; } #enquiry-img { background:url(../images/img_design04.jpg) no-repeat; width:360px; height:425px; position:absolute; left:0; border-right: 20px solid #185c74; } #contact-box { width: 509px; height:345px; position:relative; margin:0; float:left; right:0; background-color:#363533; } #contact-imgbox { width: 451px; height:345px; position:relative; background-color:#327f9c; float:right; } #contact-img { background:url(../images/img_design02.jpg) no-repeat; width:400px; height:345px; position:absolute;right:0; border-left: 32px solid #185c74; } #about-box { width: 655px; height:380px; position:relative; margin:0; float:right; right:0; background-color:#363533; } #about-imgbox { width: 305px; height:380px; position:relative; background-color:#185c74; float:left; } #about-img { background:url(../images/img_design01.jpg) no-repeat; width:270px; height:380px; position:absolute; border-right: 15px solid #378eaf; } #services-box { width: 305px; height:350px; position:relative; margin:0; float:left; right:0; background-color:#363533; } #services-imgbox { width: 655px; height:350px; position:relative; background-color:#185c74; float:right; } #services-img { background:url(../images/img_design03.jpg) no-repeat; width:600px; height:350px; position:absolute; right:0; border-left: 20px solid #2385aa; } #services-list { width: 280px; position: relative; top:30px; left:23px; margin-left: 0; padding-left: 0; } ul#services-list { padding-left: 10px; background-image:url(../images/bullet.gif) no-repeat; background-position: 0 .2em; } #services-list li { font: 105%/170% Arial, Verdana, sans-serif; line-height:1em; margin:.6em; padding:.5em; text-align:left;} .about-text { margin: 35px 50px 25px 50px; text-align:justify; } .contact-text { margin: 40px 50px 25px 50px; font: 105%/170% Arial, Verdana, sans-serif;} .em-title {font: 120%/170% Arial, Verdana, sans-serif; color:#abab9a; } .intro-title {font: 155%/170% Arial, Verdana, sans-serif; color:#abab9a; } .ct-text { margin: 40px 50px 25px 50px; font: 105%/170% Arial, Verdana, sans-serif;} .numb {font: bold 110%/170% Arial, Verdana, sans-serif; } #portfolio-flash { width:960px; height:425px; position:relative; margin:0; } /* footer */ #footer { width: 1000px; height: auto; margin-bottom:35px; position: relative; } #bm_grdsh { background:url(../images/bm_grdshd.png) no-repeat; width:1000px; height:20px; position:relative; _background:transparent url(http://www.urbandesignid.com/assets/images/blank.gif) repeat 0 0; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='http://www.urbandesignid.com/assets/images/bm_grdshd.png'); } #bmlfsd_grd { background:url(../images/bmlfsd_grd.png) no-repeat; width:20px; height:42px; position:relative; float:left; _background:transparent url(http://www.urbandesignid.com/assets/images/blank.gif) repeat 0 0; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='http://www.urbandesignid.com/assets/images/bmlfsd_grd.png'); } #bmrgsd_grd { background:url(../images/bmrgsd_grd.png) no-repeat; width:20px; height:42px; position:relative; float:right; _background:transparent url(http://www.urbandesignid.com/assets/images/blank.gif) repeat 0 0; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=crop,src='http://www.urbandesignid.com/assets/images/bmrgsd_grd.png'); } #bm_bg { background:url(../images/bm_wdbg.jpg) no-repeat; width:960px; height:42px; float:left; position:relative; } #cpy { width: 180px; height:20px; position: absolute; top:1px; float:right; right:7px; } #cpy li { display:inline; font: 85%/170% "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif; color: #403f3d; }