infotech_growth : Technology « Templates « HTML / CSS






infotech_growth

    

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Intech Growth</title>
<style type='text/css'>
/* CSS Document */
body{padding:0px; margin:0px; background:#554D49; color:#B6B6B6; font:14px/20px Arial, Helvetica, sans-serif;}
div, p, ul, h2, h3, h4, img{padding:0px; margin:0px;}
ul{list-style-type:none;}

/*----TOP PANEL----*/
#maintopPan{height:322px; background:url(infotech_growth-images/topbg.gif) 0 0 repeat-x;}
#logoPan{width:778px; height:83px; position:relative; margin:0 auto; background:url(infotech_growth-images/logopanel-bg.gif) 0 0 no-repeat;}
#logoPan img{width:171px; height:42px; position:absolute; top:41px; left:304px;}

#headerPan{width:660px; height:189px; position:relative; margin:0 auto; background:url(infotech_growth-images/header.jpg) 100% 0 no-repeat; padding:16px 0 0;}
#headerPan ul{width:75px;}
#headerPan ul li{width:75px; height:51px;}
#headerPan ul li.sidenavpadding{padding:18px 0 0;}
#headerPan ul li.home a{width:75px; height:51px; display:block; background:url(infotech_growth-images/home-hover.gif) 0 0 no-repeat; text-indent:-20000px;}
#headerPan ul li.home a:hover{background:url(infotech_growth-images/home-hover.gif) 0 0 no-repeat;}

#headerPan ul li.aboutus a{width:75px; height:51px; display:block; background:url(infotech_growth-images/aboutus-normal.gif) 0 0 no-repeat; text-indent:-20000px;}
#headerPan ul li.aboutus a:hover{background:url(infotech_growth-images/aboutus-hover.gif) 0 0 no-repeat;}

#headerPan ul li.contact a{width:75px; height:51px; display:block; background:url(infotech_growth-images/contactus-normal.gif) 0 0 no-repeat; text-indent:-20000px;}
#headerPan ul li.contact a:hover{background:url(infotech_growth-images/contactus-hover.gif) 0 0 no-repeat;}

/*----TOP PANEL----*/

/*----MENU PANEL----*/
#menuPan{width:778px; height:34px; position:relative; margin:0 auto;}
#menuPan ul{width:570px; height:34px; position:absolute; top:0px; left:149px;}
#menuPan ul li{float:left; text-align:center; line-height:34px; font-weight:bold;}
#menuPan ul li.client{width:69px; height:34px; background:url(infotech_growth-images/client-hover.gif) 0 0 no-repeat #fff; color:#332D2B;}

#menuPan ul li.testimonials a{width:119px; height:34px; display:block; background:url(infotech_growth-images/testimonials-normal.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}
#menuPan ul li.testimonials a:hover{background:url(infotech_growth-images/testimonials-hover.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}

#menuPan ul li.services a{width:98px; height:34px; display:block; background:url(infotech_growth-images/services-normal.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}
#menuPan ul li.services a:hover{background:url(infotech_growth-images/services-hover.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}

#menuPan ul li.projects a{width:96px; height:34px; display:block; background:url(infotech_growth-images/projects-normal.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}
#menuPan ul li.projects a:hover{background:url(infotech_growth-images/projects-hover.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}

#menuPan ul li.solutions a{width:103px; height:34px; display:block; background:url(infotech_growth-images/solutions-normal.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}
#menuPan ul li.solutions a:hover{background:url(infotech_growth-images/solutions-hover.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}

#menuPan ul li.markets a{width:85px; height:34px; display:block; background:url(infotech_growth-images/market-normal.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}
#menuPan ul li.markets a:hover{background:url(infotech_growth-images/market-hover.gif) 0 0 no-repeat #fff; color:#332D2B; text-decoration:none;}

/*----/MENU PANEL----*/

/*----BODY TOP PANEL----*/
#mainbodytopPan{background:url(infotech_growth-images/bodytopbg.gif) 0 0 repeat-x #3B3532; color:#B6B6B6; margin:0 auto;}
#bodytopPan{width:588px; /*height:224px;*/ position:relative; margin:0 auto; padding:22px 95px 0;}

#bodytopPan h2{width:588px; height:60px; background:url(infotech_growth-images/image1.gif) 250px 25px no-repeat #3C3633; color:#D5D5D5; font-size:30px; line-height:60px; font-weight:normal;}

#bodytopPan p span.yellow{background:#3C3633; color:#FFD900;}
/*----/BODY TOP PANEL----*/

/*----BODY PANEL----*/
#mainbodyPan{background:url(infotech_growth-images/bodybg.gif) 0 0 repeat-x #554D49; color:#B6B6B6; margin:0 auto;}

#bodyPan{width:588px; /*height:400px;*/ background:url(infotech_growth-images/blog-header.jpg) 0 0 no-repeat; position:relative; margin:0 auto; padding:108px 95px 0;}

#bodyPan h3{width:500px; height:46px; display:block; background:#554D49; color:#D5D5D5; font:36px/46px Arial, Helvetica, sans-serif; font-weight:normal;}
#bodyPan h4{width:365px; height:54px; display:block; background:url(infotech_growth-images/date.gif) 0 0 no-repeat #554D49; color:#009FC2; font-size:14px; line-height:20px; font-weight:bold; text-transform:uppercase; padding:10px 0 0 52px;}
#bodyPan h4 span{background:#554D49; color:#F4D000; font-size:18px; font-weight:normal; text-transform:none;}

#bodyPan h5{width:375px; height:54px; float:left; display:block; background:url(infotech_growth-images/date2.gif) 0 0 no-repeat #554D49; color:#009FC2; font-size:14px; line-height:20px; font-weight:bold; text-transform:uppercase; padding:10px 0 0 52px; margin:0px;}
#bodyPan h5 span{background:#554D49; color:#F4D000; font-size:18px; font-weight:normal; text-transform:none;}

#bodyPan p{width:430px;}
#bodyPan p span{background:#554D49; color:#fff;}

#bodyPan p.img1{width:143px; height:106px; display:block; background:url(infotech_growth-images/img1.jpg) 0 0 no-repeat; position:absolute; top:189px; right:95px;}

#bodyPan p.caption{width:588px; height:30px; font-size:27px; line-height:20px; padding:10px 0;}

#bodyPan p.comments{width:100px; height:16px; float:left; display:block; background:url(infotech_growth-images/icon1.gif) 0 0 no-repeat #24201E; line-height:16px; color:#fff; padding:0 0 0 30px; margin:0 10px 0 0;}
#bodyPan p.comments span.no{width:23px; height:16px; background:#0F0F0F; color:#fff; margin:0 0 0 5px; text-align:center; padding:0 4px;}

#bodyPan p.continue{width:88px; height:16px; float:left; line-height:16px; font-family:"Trebuchet MS",Arial, Helvetica, sans-serif; margin:0 170px 0 0;}
#bodyPan p.continue a{width:88px; height:16px; display:block; background:url(infotech_growth-images/arrow-normal.gif) 75px 0 no-repeat #24201E; color:#009FC2; text-decoration:none; padding:0 0 0 10px;} 
#bodyPan p.continue a:hover{background:url(infotech_growth-images/arrow-hover.gif) 75px 0 no-repeat #24201E; color:#009FC2; text-decoration:none;} 

#bodyPan p.border{width:588px; height:40px; float:left; display:block; background:url(infotech_growth-images/dot-line.gif) 0 20px repeat-x; margin:5px 0 0;}

#bodyPan p.img2{width:143px; height:106px; display:block; background:url(infotech_growth-images/img2.jpg) 0 0 no-repeat; position:absolute; top:460px; right:95px;}

/*----FOOTER PANEL----*/
#footermainPan{height:132px; background:url(infotech_growth-images/footerbg.gif) 0 0 repeat-x #24201E; color:#fff; font:13px/20px "Trebuchet MS",Arial, Helvetica, sans-serif; clear:both; padding:86px 0 0;}

#footerPan{width:588px; position:relative; margin:0 auto;}

#footerPan ul{width:588px; height:20px; position:relative; margin:0 auto;}
#footerPan li{float:left; }
#footerPan ul li a{padding:0 10px 0; color:#fff; background:#24201E; text-decoration:none; font-size:12px;}
#footerPan ul li a:hover{text-decoration:underline;}

#footerPan p.copyright{width:250px; position:relative; margin:0 auto;}

#footerPan ul.templateworld{width:250px; background:#24201E; color:#fff; display:block; position:absolute; top:75px; left:200px; font-size:10px;}
#footerPan ul.templateworld li{height:20px;}
#footerPan ul.templateworld li a{background:#24201E; display:block; color:#fff; text-decoration:none; padding:0px;}
#footerPan ul.templateworld li a:hover{text-decoration:underline;}

#footerPanhtml{width:58px; height:23px; display:block; position:absolute; top:46px; left:200px;}
#footerPanhtml a{width:58px; height:23px; display:block; background:url(infotech_growth-images/html-normal.gif) 0 0 no-repeat #A79040; color:#685900; font-size:13px; line-height:23px; font-weight:bold; text-decoration:none;text-transform:uppercase; padding:0 0 0 10px;}
#footerPanhtml a:hover{background:url(infotech_growth-images/html-hover.gif) 0 0 no-repeat #D64F00; color:#24201E;}
#footerPancss{width:58px; height:24px; display:block; position:absolute; top:45px; left:270px;}
#footerPancss a{width:49px; height:24px; display:block; background:url(infotech_growth-images/css-normal.gif) 0 0 no-repeat #D64F00; color:#fff; font-size:13px; line-height:24px; font-weight:bold; text-decoration:none; text-transform:uppercase; padding:0 0 0 10px;}
#footerPancss a:hover{background:url(infotech_growth-images/css-hover.gif) 0 0 no-repeat #A79040; color:#fff; text-decoration:none;}
/*----/FOOTER PANEL----*/


</style>


</head>

<body>
<div id="maintopPan">
  <div id="logoPan">
    <a href="index.html"><img src="infotech_growth-images/logo.gif" title="Intech Growth" alt="Intech Growth" width="171" height="42" border="0" /></a> </div>
  <div id="headerPan">
    <ul>
    <li class="home"><a href="#">Home</a></li>
    <li class="aboutus sidenavpadding"><a href="#">About Us</a></li>
    <li class="contact sidenavpadding"><a href="#">Contact Us</a></li>
  </ul>
  </div>
  <div id="menuPan">
    <ul>
    <li class="client">Clients</li>
    <li class="testimonials"><a href="#">Testimonials</a> </li>
    <li class="services"><a href="#">Services</a></li>
    <li class="projects"><a href="#">Projects</a></li>
    <li class="solutions"><a href="#">Solutions</a></li>
    <li class="markets"><a href="#">Markets</a></li>
  </ul>
  </div>
</div>
<div id="mainbodytopPan">
  <div id="bodytopPan">
    <h2>why intech growth</h2>
  <p>Intech Growth is a <span class="yellow">free, tableless, W3C-compliant</span> web design layout by Template World. This template has been tested and proven compatible with all major browser environments and operating systems. You are free to modify the design to suit your tastes in any way you like.</p>
  <p>We only ask you to not remove <span class="yellow">"Design by Template World"</span> and the link http://www.templateworld.com from the footer of the template.</p>
  <p>If you are interested in seeing more of our free web template designs feel free to visit our website, Template World. We intend to add at least 25 new free templates in the coming month.</p>
  </div>
</div>
<div id="mainbodyPan">
  <div id="bodyPan">
    <h3>About community</h3>
  <h4>l robinson <br />
  <span>intech growth</span></h4>
  <p>Lorem ipsum dolor <span>sit amet, consectetuer</span> adipiscing elit. Praesent adipiscing ipsum id nislpo. Praesent quis magna vel neque porttitor mollis. In eleifend, risus et hendrerit tempor, purusur imperdiet augu, at ullamcorper eros magna id mauris.Nunc justo lectus, luctus vitae, porttito at, fermentum sit amet, ante</p>
  <p class="img1"><img src="infotech_growth-images/blank.gif" alt="" /></p>
  <p class="caption">porttito at fermentum sit amet ante magna idetu </p>
  <p class="comments">Comments <span class="no">12</span></p>
  <p class="continue"><a href="#">continue</a></p>
  <p class="border"><img src="infotech_growth-images/blank.gif" alt="" /></p>
  <h5>l robinson <br />
  <span>intech growth</span></h5>
  <p class="img2"><img src="infotech_growth-images/blank.gif" alt="" /></p>
  <p>Lorem ipsum dolor <span>sit amet, consectetuer</span> adipiscing elit. Praesent adipiscing ipsum id nislpo. Praesent quis magna vel neque porttitor mollis. In eleifend, risus et hendrerit tempor, purusur imperdiet augu, at ullamcorper eros magna id mauris.Nunc justo lectus, luctus vitae, porttito at, fermentum sit amet, ante</p>
  <p class="caption">porttito at fermentum sit amet ante magna idetu </p>
  <p class="comments">Comments <span class="no">15</span></p>
  <p class="continue"><a href="#">continue</a></p>
</div>
</div>
<div id="footermainPan">
  <div id="footerPan">
    <ul>
    <li><a href="#">About</a>| </li>
    <li><a href="#">Clients</a>| </li>
    <li><a href="#">Testimonials</a>| </li>
    <li><a href="#">Services</a>| </li>
    <li><a href="#">Projects</a>| </li>
    <li><a href="#">Solutions</a>| </li>
    <li><a href="#">markets</a></li>
    </ul>
    <p class="copyright">intech growth. All right reserved.</p>
  <div id="footerPanhtml"><a href="http://validator.w3.org/check?uri=referer" target="_blank">XHTML</a></div>
  <div id="footerPancss"><a href="http://jigsaw.w3.org/css-validator/check/referer" target="_blank">css</a></div>
    <ul class="templateworld">
    <li>design by:</li>
  <li><a href="http://www.templateworld.com" target="_blank">Template World</a></li>
  </ul>
  </div>
</div>
</body>
</html>

   
    
    
    
  








Related examples in the same category

1.brain_tech
2.metamorph_tech
3.freecss_electronics
4.smartphone
5.spacetravel
6.spacetravelisboring
7.RobotCC
8.science
9.software
10.Sphere
11.spiderdarker
12.techjunkie1-0
13.technicalsupport
14.techno
15.technological
16.web-tech
17.webtechnologies
18.worldofwarcraft
19.iPhoneSite
20.iphone
21.linuxblog
22.innovation