World Group
Design "World Group"
<---- Zurück
Infos zum diesem Design:
Das Design ist ein simples,aber auch sehr elegantes. Man kann es so ziemlich für alle Themenbereiche einsetzten.
Ihr dürft alle Grafiken austauschen! - Das Copyright von turbopage muss stehen bleiben!
Text über dem Design:
<head>
<link rel="stylesheet" type="text/css" href="http://www.loaditup.de/files/772845_bc69pdupaz.css" />
<script type="text/javascript" src="http://www.loaditup.de/files/772837_bzr73gqufm.js"></script>
<script type="text/javascript" src="http://www.loaditup.de/files/772840_k687dy6vk9.js"></script>
<script type="text/javascript" src="http://www.loaditup.de/files/772839_26vbhmmss9.js"></script>
<script type="text/javascript" src="http://www.loaditup.de/files/772838_qa5w4rbnkg.js"></script>
<script type="text/javascript" src="http://www.loaditup.de/files/772841_dkg9fg2s4d.js"></script>
</head>
<body>
<div class="main">
<div class="headeri">
<div class="headeri_resize">
<div class="logo">
<h1><a href="index.html">World<span>Group</span></a></h1>
</div>
<div class="clr"></div>
<div class="menu_nav">
<ul>
<li class="active"><a href="index.html"><span>Home Page</span></a></li>
<li><a href="support.html"><span>Support</span></a></li>
<li><a href="about.html"><span>About Us</span></a></li>
<li><a href="blog.html"><span>Blog</span></a></li>
<li><a href="contact.html"><span>Contact Us</span></a></li>
</ul>
</div>
<div class="clr"></div>
<div class="slider">
<div id="coin-slider"> <a href="#"><img src="http://www.loaditup.de/files/772836_sdf6fw664q.jpg" width="960" height="360" alt="" /><span><big>Sed condimentum justo sit amet urna ornare euismod.</big><br />
Tusce nec iaculis risus hasellus nec sem sed tellus malesuada porttitor. Mauris scelerisque feugiat ante in vulputate. Nam sit amet ullamcorper tortor. Phasellus posuere facilisis cursus. Nunc est lorem, dictum at scelerisque sit amet, faucibus et est. Proin mattis ipsum quis arcu aliquam molestie.</span></a>
<a href="#"><img src="http://www.loaditup.de/files/772834_7nnqnf9puq.jpg" width="960" height="360" alt="" /><span><big>Amet urna ornare euismodSed condimentum.</big><br />
Tusce nec iaculis risus hasellus nec sem sed tellus malesuada porttitor. Mauris scelerisque feugiat ante in vulputate. Nam sit amet ullamcorper tortor. Phasellus posuere facilisis cursus. Nunc est lorem, dictum at scelerisque sit amet, faucibus et est. Proin mattis ipsum quis arcu aliquam molestie.</span></a> <a href="#"><img src="http://www.loaditup.de/files/772835_y293wrh5y8.jpg" width="960" height="360" alt="" /><span><big>Sed condimentum justo sit amet urna ornare euismod.</big><br />
Tusce nec iaculis risus hasellus nec sem sed tellus malesuada porttitor. Mauris scelerisque feugiat ante in vulputate. Nam sit amet ullamcorper tortor. Phasellus posuere facilisis cursus. Nunc est lorem, dictum at scelerisque sit amet, faucibus et est. Proin mattis ipsum quis arcu aliquam molestie.</span></a> </div>
<div class="clr"></div>
</div>
<div class="clr"></div>
</div>
</div>
<div class="content">
<div class="content_resize">
<div class="mainbar">
<div class="article">Text unter dem Design:
</div></div>
<div class="sidebar">
<div class="gadget">
<h2 class="star"><span>Sidebar</span> Menu</h2>
<div class="clr"></div>
<ul class="sb_menu">
<li><a href="#">Home</a></li>
<li><a href="#">TemplateInfo</a></li>
<li><a href="#">Style Demo</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Archives</a></li>
<li><a href="#">Web Templates</a></li>
</ul>
</div>
<div class="gadget">
<h2 class="star"><span>Sponsors</span></h2>
<div class="clr"></div>
<ul class="ex_menu">
<li><a href="#">Lorem ipsum dolor</a><br />
Donec libero. Suspendisse bibendum</li>
<li><a href="#">Dui pede condimentum</a><br />
Phasellus suscipit, leo a pharetra</li>
<li><a href="#">Condimentum lorem</a><br />
Tellus eleifend magna eget</li>
<li><a href="#">Fringilla velit magna</a><br />
Curabitur vel urna in tristique</li>
<li><a href="#">Suspendisse bibendum</a><br />
Cras id urna orbi tincidunt orci ac</li>
<li><a href="#">Donec mattis</a><br />
purus nec placerat bibendum</li>
</ul>
</div>
</div>
<div class="clr"></div>
</div>
</div>
<div class="fbg">
<div class="fbg_resize2">
<div class="fbg_resize">
<div class="col c1">
<h2><span>Image</span> Gallery</h2>
<a href="#"><img src="http://www.loaditup.de/files/772846_fkxctumaxp.jpg" width="75" height="75" alt="" class="gal" /></a>
<a href="#"><img src="http://www.loaditup.de/files/772846_fkxctumaxp.jpg" width="75" height="75" alt="" class="gal" /></a>
<a href="#"><img src="http://www.loaditup.de/files/772846_fkxctumaxp.jpg" width="75" height="75" alt="" class="gal" /></a>
<a href="#"><img src="http://www.loaditup.de/files/772846_fkxctumaxp.jpg" width="75" height="75" alt="" class="gal" /></a>
<a href="#"><img src="http://www.loaditup.de/files/772846_fkxctumaxp.jpg" width="75" height="75" alt="" class="gal" /></a>
<a href="#"><img src="http://www.loaditup.de/files/772846_fkxctumaxp.jpg" width="75" height="75" alt="" class="gal" /></a> </div>
<div class="col c2">
<h2><span>Services</span> Overview</h2>
<p>Curabitur sed urna id nunc pulvinar semper. Nunc sit amet tortor sit amet lacus sagittis posuere cursus vitae nunc.Etiam venenatis, turpis at eleifend porta, nisl nulla bibendum justo.</p>
<ul class="fbg_ul">
<li><a href="#">Lorem ipsum dolor labore et dolore.</a></li>
<li><a href="#">Excepteur officia deserunt.</a></li>
<li><a href="#">Integer tellus ipsum tempor sed.</a></li>
</ul>
</div>
<div class="col c3">
<h2><span>Contact</span> Us</h2>
<p>Nullam quam lorem, tristique non vestibulum nec, consectetur in risus. Aliquam a quam vel leo gravida gravida eu porttitor dui.</p>
<p class="contact_info"> <span>Address:</span> 1458 TemplateAccess, USA<br />
<span>Telephone:</span> +123-1234-5678<br />
<span>FAX:</span> +458-4578<br />
<span>Others:</span> +301 - 0125 - 01258<br />
<span>E-mail:</span> <a href="#">mail@yoursitename.com</a> </p>
</div>
<div class="clr"></div>
</div>
</div>
</div>
<div class="footer">
<div class="footer_resize">
<p class="lf">© <a href="#">Deine Seite</a> // Für den HpBk umgecodet von: <a href="http://turbopage.de.tl">Turbopage</a></p>
<p class="rf">Get More <a target="_blank" href="http://www.free-css.com/">Free CSS Templates</a> By <a target="_blank" href="http://www.dreamtemplate.com/">DreamTemplate</a></p>
<div style="clear:both;"></div>
</div>
</div>
</div>
</body>
</html>
CSS-Code ohne Styletags:
*Dieses Design wurde von www.turbopage.de.tl für den HpBk umgecodet*
*Wir bieten in unserer Designerbase noch viele weitere kostenlose Designs an*
***www.turbopage.de.tl***
------------------------------------------------------------------------
#extraDiv1 {display: none;} #extraDiv2 {display: none;} #extraDiv3 {display: none;} #extraDiv4 {display: none;} #extraDiv5 {display: none;} #extraDiv6 {display: none;} #pre_header {display: none;} #post_header {display: none;} #pre_content {display: none;} #nav{display: none;} div.header{display: none;} h1#title{display: none;} h2#title span {display: none;}
table[height="102"] { margin: auto; }
#webme_footer_textlink_dont_hide {
width: 550px;
color: black;
background-color: transparent;
display: block;
margin: auto; }
div#webme_sky_ad{
width: 200px;
position: absolute;
top: 175px;
margin-left: 505px;
right: 0;
left: 50%;
}
body {
margin:0;
padding:0;
width:100%;
color:#6e6e6e;
font:normal 12px/1.5em "Liberation sans", Arial, Helvetica, sans-serif;
}
html, .main {
padding:0;
margin:0;
}
.main {
background:#efefef url(http://www.loaditup.de/files/772828_h7dk5dfbhb.gif) repeat-x left top;
}
.clr {
clear:both;
padding:0;
margin:0;
width:100%;
font-size:0;
line-height:0;
}
h2 {
margin:8px 0;
padding:8px 0;
font-size:24px;
font-weight:normal;
color:#3f3f3f;
}
p {
margin:8px 0;
padding:0 0 8px 0;
}
a {
color:#be3131;
text-decoration:underline;
}
.headeri, .content, .menu_nav, .fbg, .footer, form, ol, ol li, ul, .content .mainbar, .content .sidebar {
margin:0;
padding:0;
}
.headeri {
}
.headeri_resize {
margin:0 auto;
padding:0;
width:960px;
}
.logo {
padding:0;
float:left;
width:auto;
height:113px;
}
h1 {
margin:0;
padding:27px 0 0;
font-size:65px;
font-weight:normal;
line-height:1.2em;
text-transform:none;
text-align:center;
}
h1 a, h1 a:hover {
color:#be3131;
text-decoration:none;
}
h1 span {
}
h1 small {
display:block;
font-size:18px;
line-height:1.2em;
letter-spacing:normal;
text-transform:none;
color:#8a98a5;
}
.slider {
padding:0 0 27px;
background:url(http://www.loaditup.de/files/772829_3tw2y5d2pk.gif) no-repeat left bottom;
}
.rss {
padding:18px 20px 0 0;
float:right;
width:auto;
}
.rss p {
margin:0;
padding:0;
float:right;
width:auto;
color:#fff;
font-size:13px;
line-height:1.5em;
font-weight:bold;
}
.rss a {
color:#fff;
text-decoration:none;
}
.rss a:hover {
text-decoration:underline;
}
.rss img {
margin:-3px 0 -3px 6px;
border:none;
}
.menu_nav {
margin:0 auto;
padding:0;
height:66px;
background:url(http://www.loaditup.de/files/772830_tm65z8z347.gif) no-repeat left top;
}
.menu_nav ul {
list-style:none;
padding:0;
height:66px;
float:left;
}
.menu_nav ul li {
margin:0;
padding:0;
float:left;
}
.menu_nav ul li a {
display:block;
margin:0;
padding:28px 0 15px;
width:192px;
font-size:16px;
line-height:20px;
font-weight:normal;
color:#4c4c4c;
text-decoration:none;
text-align:center;
text-transform:uppercase;
}
.menu_nav ul li.active a, .menu_nav ul li a:hover {
text-decoration:none;
color:#4c4c4c;
}
.content {
padding:18px 0 0;
}
.content_resize {
margin:0 auto;
padding:0;
width:960px;
}
.content .mainbar {
margin:0;
padding:0;
float:left;
width:660px;
}
.content .mainbar h2 {
margin-bottom:0;
padding-bottom:0;
font-size:27px;
line-height:1.2em;
color:#232323;
}
.content .mainbar div.img {
padding:12px 0 0;
float:left;
}
.content .mainbar img {
}
.content .mainbar img.fl {
margin:0;
padding:1px;
background:#fff;
border:1px solid #c4c4c4;
}
.content .mainbar .article {
margin:0 0 32px;
padding:0;
}
.content .mainbar .post_content {
float:right;
width:460px;
}
.content .mainbar .post_content strong {
color:#3f3f3f;
}
.content .sidebar {
padding:0;
float:right;
width:260px;
}
.content .sidebar .gadget {
margin:0 0 12px;
padding:0 20px 24px 20px;
border:1px solid #dcdcdc;
}
.content .sidebar h2 {
color:#3f3f3f;
}
ul.sb_menu, ul.ex_menu {
margin:0;
padding:0;
list-style:none;
color:#959595;
}
ul.sb_menu li, ul.ex_menu li {
margin:0;
}
ul.sb_menu li {
padding:4px 0;
width:220px;
}
ul.ex_menu li {
padding:4px 0;
}
ul.sb_menu li a {
color:#9a9a9a;
text-decoration:none;
margin-left:-16px;
padding:4px 8px 4px 16px;
}
ul.ex_menu li a {
font-weight:bold;
color:#161616;
text-decoration:none;
}
ul.sb_menu li a:hover, ul.ex_menu li a:hover {
color:#be3131;
font-weight:bold;
text-decoration:none;
}
p.spec {
padding:0 0 16px;
}
.content p.pages {
margin:0;
padding:24px 20px;
font-size:11px;
color:#929292;
text-align:left;
background:repeat-x left top;
}
.content p.pages span, .content p.pages a {
padding:8px 12px;
text-decoration:none;
}
.content p.pages span, .content p.pages a:hover {
color:#fff;
background:#be3131;
border:1px solid #be3131;
}
.content p.pages a {
color:#929292;
border:1px solid transparent;
}
.content p.pages small {
font-size:12px;
float:right;
}
.content .mainbar .comment {
margin:0;
padding:16px 0 0 0;
}
.content .mainbar .comment img.userpic {
border:1px solid #dedede;
margin:10px 16px 0 0;
padding:0;
float:left;
}
.fbg {
padding:16px 0 0;
}
.fbg_resize {
margin:0 auto;
width:918px;
padding:16px 20px;
background:#dce0e5 url(http://www.loaditup.de/files/772832_33n9dykyne.gif) repeat-x left top;
border:1px solid #fff;
}
.fbg_resize2 {
border:1px solid #dcdcdc;
width:960px;
margin:0 auto;
}
.fbg h2 {
color:#232323;
padding-bottom:24px;
}
.fbg img.gal {
margin:0 8px 8px 0;
padding:0;
background-color:#fff;
border:1px solid #dfdfdf;
}
.fbg .col {
margin:0;
float:left;
}
.fbg .c1 {
padding:0 16px 0 0;
width:280px;
}
.fbg .c2 {
padding:0 36px 0 16px;
width:280px;
}
.fbg .c3 {
padding:0 0 0 16px;
width:274px;
}
.fbg .fbg_ul {
margin:0;
padding:0;
list-style:none;
}
.fbg .fbg_ul li {
margin:0;
padding:0;
list-style:none;
}
.fbg .fbg_ul li a {
display:block;
margin:0;
padding:2px 0 2px 12px;
color:#929292;
text-decoration:none;
background:url(http://www.loaditup.de/files/772833_7bnv2cf8r9.gif) no-repeat left center;
}
.fbg .fbg_ul li a:hover {
color:#be3131;
text-decoration:underline;
}
.fbg p.contact_info {
line-height:1.8em;
}
.fbg p.contact_info a {
color:#be3131;
text-decoration:underline;
}
.fbg p.contact_info span {
display:block;
float:left;
width:74px;
font-weight:bold;
color:#232323;
}
ol {
list-style:none;
}
ol li {
display:block;
clear:both;
}
ol li label {
display:block;
margin:0;
padding:16px 0 0 0;
}
ol li input.text {
width:480px;
border:1px solid #c0c0c0;
margin:0;
padding:5px 2px;
height:16px;
background-color:#fff;
}
ol li textarea {
width:480px;
border:1px solid #c0c0c0;
margin:0;
padding:2px;
background-color:#fff;
}
ol li .send {
margin:16px 0 0 0;
}
.footer {
}
.footer_resize {
margin:0 auto;
padding:0 20px 12px;
width:920px;
line-height:1.5em;
color:#6b6b6b;
}
.footer_resize p {
margin:24px 0;
padding:0;
line-height:normal;
white-space:nowrap;
text-indent:inherit;
}
.footer_resize a {
color:#be3131;
font-weight:normal;
margin:0;
padding:0;
border:none;
text-decoration:underline;
background-color:transparent;
}
.footer_resize a:hover {
color:#be3131;
background-color:transparent;
text-decoration:none;
}
.footer_resize .lf {
float:left;
}
.footer_resize .rf {
float:right;
}
a {
outline:none;
}
