/* ---------- Standard Site Classes ---------- */ html, body {margin: 0; padding: 0; height: 100%;} form, fieldset, p, div, h1, h2, h3, h4, h5, h6 {margin: 0px; padding: 0px; font-weight: normal;} body {font-family: Century Gothic, arial, Verdana, sans-serif; font-size: 12px; line-height: 1.4; background-repeat: repeat-x; background-image: url(../images/gradient.gif);} img {border:0px;} p {padding:0px; margin:0px;} body {color: #7A7A7A;} /* ----- Wrap - Layout/Position ID Tag -----*/ #wrap { background-repeat: repeat; background-image: url(../images/logo-repeat.png); position: relative; width: 100%; height: 100%; margin: 0 auto; } /* ----- Center This - Layout/Position ID Tag -----*/ #center_this { background-repeat: no-repeat; background-image: url(../images/page-area.png); text-align: center; vertical-align:top; position: absolute; top: 50%; left: 50%; height: 730px; margin-top: -365px; /* Note (must be 50% of the content height) */ width: 1024px; margin-left: -512px; /* Note (must be 50% of the content width) */ } /* ----- Main Tags -----*/ h1{font-size: 16px; color: #7A7A7A; line-height: 1; padding-bottom:7px;} h2{font-size: 12px; color: #FF7100; font-weight:bold;} a:link {color: #7A7A7A; text-decoration: none;} a:visited {color: #7A7A7A; text-decoration: none;} a:active {color: #7A7A7A; text-decoration: none;} a:hover {color: #A7C300; text-decoration: underline;} p{padding-bottom: 7px; padding-top:2px;} /* ===================================== */ /* Structure Here */ #Box{position:absolute; top:127px; left:103px; width:856px; height:539px; text-align:left;} #BoxIn{position:relative; left:12px; top:12px; width:832px; height:479px;} #Content{width:642px; height: 467px; float:left;} /* ===================================== */ /* Side Menu Backgrounds */ #SideMenu{width:190px; height: 479px; float:right; position:relative; background-image: url(../images/gray-bkg.png); background-repeat: repeat; font-size:14px;} #SideMenu ul{margin-left:7px; margin-top:7px; padding:0;} #SideMenu li{margin-left:15px; list-style-image: url(../images/m-j-h.png); list-style-type: none;} #SideMenu a:link {color: #7A7A7A; text-decoration: none;} #SideMenu a:visited {color: #7A7A7A; text-decoration: none;} #SideMenu a:active {color: #7A7A7A; text-decoration: none;} #SideMenu a:hover {color: #333333; text-decoration: underline;} /* ===================================== */ /* Side Menu Backgrounds */ #SideMenuBkg {height: 479px;} #SideMenuBkg.Home{background-image: url(../images/menu-bkg/home-bkg.png); background-repeat: no-repeat; background-position: right top;} #SideMenuBkg.Testimonials{background-image: url(../images/menu-bkg/testimonials-bkg.png); background-repeat: no-repeat; background-position: right top;} #SideMenuBkg.About{background-image: url(../images/menu-bkg/about-bkg.png); background-repeat: no-repeat; background-position: right top;} #SideMenuBkg.Contact{background-image: url(../images/menu-bkg/contact-bkg.png); background-repeat: no-repeat; background-position: right top;} #SideMenuBkg.GeneralCarpentry{background-image: url(../images/menu-bkg/carpentry-bkg.png); background-repeat: no-repeat; background-position: right top;} #SideMenuBkg.WoodFlooring{background-image: url(../images/menu-bkg/wood-flooring-bkg.png); background-repeat: no-repeat; background-position: right top;} #SideMenuBkg.Joinery{background-image: url(../images/menu-bkg/joinery-bkg.png); background-repeat: no-repeat; background-position: right top;} #SideMenuBkg.FittedUnits{background-image: url(../images/menu-bkg/fitted-units-bkg.png); background-repeat: no-repeat; background-position: right top;} #SideMenuBkg.Kitchens{background-image: url(../images/menu-bkg/kitchens-bkg.png); background-repeat: no-repeat; background-position: right top;} #SideMenuBkg.Decking{background-image: url(../images/menu-bkg/decking-bkg.png); background-repeat: no-repeat; background-position: right top;} /* ===================================== */ /* Main Navigation */ #Nav{ position:relative; top:0px; left:12px; padding-top:17px; letter-spacing: 2pt; font-weight: bold; font-size: 16px; width:856px; height:31px; clear:both; background-image: url(../images/nav-bkg.png); background-repeat: no-repeat; background-position: left bottom; } #Nav ul{margin-left: 0px; margin-top:2px; padding-left: 0; display: inline;} #Nav ul li {margin-left: 0; padding: 0px 4px 0px 16px; border-left: 2px solid #6ABD46; list-style: none; display: inline;} #Nav li.first {margin-left: 0; border-left: none; list-style: none; display: inline;} #Nav a:link {color: #FFFFFF; text-decoration: none;} #Nav a:visited {color: #FFFFFF; text-decoration: none;} #Nav a:active {color: #FFFFFF; text-decoration: none;} #Nav a:hover {color: #6ABD46; text-decoration: none;} /* ===================================== */ /* Text Boxes */ #TextBox{text-align:left;} #TextBox p{padding-left:6px; margin-top: 6px; padding-right: 6px; padding-bottom:0px;} #TextBox ul{padding:0px; margin:0px;} #TextBox li{padding:0px; list-style:none; padding-left:7px;} #TextBox.Home{width:385px; float:right; position:relative; margin-right:22px;} #TextBox.Testimonials{width:400px; float:right; position:relative; margin-right:22px;} #TextBox.About{width:385px; float:right; position:relative; margin-right:22px;} #TextBox.Contact{width:385px; float:right; position:relative; margin-right:22px;} #TextBox.Mail{width:190px; position:absolute; left: 15px; top:190px; z-index:4;} #TextBox.Telecoms{width:190px; position:absolute; left: 15px; top:320px; z-index:5;} .TelRt{left:70px; position:absolute;} #TextBox.GeneralCarpentry{width:612px; float:right; position:relative; margin-right:22px; top:365px;} #TextBox.WoodFlooring{width:612px; float:right; position:relative; margin-right:22px; margin-top:365px;} #TextBox.Joinery{width:612px; float:right; position:relative; margin-right:22px; margin-top: 365px;} #TextBox.FittedUnits{width:612px; float:right; position:relative; margin-right:22px; margin-top: 365px;} #TextBox.Kitchens{width:612px; float:right; position:relative; margin-right:22px; margin-top: 365px;} #TextBox.Decking{width:612px; float:right; position:relative; margin-right:22px; margin-top: 365px;} /* ===================================== */ /* Text Boxes Headers */ #Header{width:100%; height:20px; background-image: url(../images/gray-bkg.png); background-repeat: repeat; padding-top:5px; padding-left:6px;} #Header h1{font-weight:bold; color:#FFFFFF;} /* ===================================== */ /* Absolute Position Home Images */ #Home-1{position:absolute; left:-25px; top:155px; z-index:4;} #Home-2{position:absolute; left:250px; top:218px; z-index:5;} #Home-3{position:absolute; left:430px; top:319px; z-index:6;} /* ===================================== */ /* Absolute Position General Carpentry Images */ #GC-1 {position:absolute; left:20px; top:120px; z-index:5;} #GC-2 {position:absolute; left:360px; top:25px; z-index:6;} #GC-3 {position:absolute; left:290px; top:160px; z-index:7;} /* ===================================== */ /* Absolute Position Joinery Images */ #Joinery-1 {position:absolute; left:5px; top:125px; z-index:5;} #Joinery-2 {position:absolute; left:350px; top:125px; z-index:6;} #Joinery-3 {position:absolute; left:430px; top:0px; z-index:7;} /* ===================================== */ /* Absolute Position Decking Images */ #Decking-1 {position:absolute; left:0px; top:190px; z-index:5;} #Decking-2 {position:absolute; left:310px; top:130px; z-index:6;} #Decking-3 {position:absolute; left:255px; top:20px; z-index:7;} #Decking-4 {position:absolute; left:395px; top:7px; z-index:8;} /* ===================================== */ /* Absolute Position Wooden Flooring Images */ #WF-1 {position:absolute; left:60px; top:125px; z-index:5;} #WF-2 {position:absolute; left:320px; top:10px; z-index:6;} #WF-3 {position:absolute; left:-10px; top:195px; z-index:7;} #WF-4 {position:absolute; left:330px; top:200px; z-index:8;} /* ===================================== */ /* Absolute Position Kitchen Images */ #Kitchen-1{position:absolute; left:130px; top:120px; z-index:4;} #Kitchen-2{position:absolute; left:411px; top:7px; z-index:5;} #Kitchen-3{position:absolute; left:-25px; top:150px; z-index:6;} #Kitchen-4{position:absolute; left:270px; top:-10px; z-index:7;} #Kitchen-5{position:absolute; left:420px; top:195px; z-index:8;} /* ===================================== */ /* Absolute Position About Images */ #FittedUnits-1{position:absolute; left:420px; top:-3px; z-index:4;} #FittedUnits-2{position:absolute; left:50px; top:115px; z-index:5;} #FittedUnits-3{position:absolute; left:350px; top:127px; z-index:6;} /* ===================================== */ /* Absolute Position About Images */ #About{position:absolute; left:-20px; top:150px; z-index:4;} /* ===================================== */ /* Absolute Position */ #Van{position:absolute; left:637px; top:405px; z-index:2;} #Logo{position:absolute; left:-27px; top:-48px; z-index:3;} /* ===================================== */ /* Contact Element */ #Button{z-index:11;} /* ===================================== */ /* Footer */ #Footer{position:absolute; right:30px; top:555px; color:#000000; font-size:10px;} #Footer a:link {color: #6ABD46; text-decoration: none;} #Footer a:visited {color: #6ABD46; text-decoration: none;} #Footer a:active {color: #6ABD46; text-decoration: none;} #Footer a:hover {color: #FFFFFF; text-decoration: none;}