WorderExpress

skycolored

Önizleme:

.image
	{
		display: inline-block;
	}
	
	.image img
	{
		display: block;
		width: 100%;
	}
	
	.image-full
	{
		display: block;
		width: 100%;
		margin: 0 0 0 0;
	}
	
	.image-left
	{
		float: left;
		margin: 0 2em 2em 0;
	}
	
	.image-centered
	{
		display: block;
		margin: 0 0 2em 0;
	}
	
	.image-centered img
	{
		margin: 0 auto;
		width: auto;
	}

/*********************************************************************************/
/* List Styles                                                                   */
/*********************************************************************************/

ul.style2
	{
		margin: 0;
		padding-top: 1em;
		list-style: none;
	}
	
	ul.style2 li
	{
		border-top: 1px solid rgba(0,0,0,0.08);
		padding: 0.80em 0 0.80em 0;
		font-family: 0.80em;
	}
	
	ul.style2 li:before
	{
		display: inline-block;
		padding: 4px;
		background: #DB3256;
	}
	
	ul.style2 a
	{
		display: inline-block;
		color: #35514f;
	}
	
	ul.style2 li:first-child
	{
		border-top: 0;
		padding-top: 0;
	}

/*********************************************************************************/
/* Social Icon Styles                                                            */
/*********************************************************************************/

ul.contact
	{
		margin: 0;
		padding: 0em 0em 0em 0em;
		list-style: none;
	}
	
	ul.contact li
	{
		display: inline-block;
		padding: 0em 0.30em;
		font-size: 1em;
	}
	
	ul.contact li span
	{
		display: none;
		margin: 0;
		padding: 0;
	}
	
	ul.contact li a
	{
		color: #FFF;
	}
	
	ul.contact li a:before
	{
		display: inline-block;
		background: #3f3f3f;
		width: 40px;
		height: 40px;
		line-height: 40px;
		text-align: center;
		color: #FFFFFF;
	}
	
	ul.contact li a.icon-twitter:before { background: #2DAAE4; }
	ul.contact li a.icon-facebook:before { background: #39599F; }
	ul.contact li a.icon-dribbble:before { background: #C4376B;	}
	ul.contact li a.icon-tumblr:before { background: #31516A; }
	ul.contact li a.icon-rss:before { background: #F2600B; }

/*********************************************************************************/
/* Button Style                                                                  */
/*********************************************************************************/

.button
	{
		display: inline-block;
		margin-top: 2em;
		padding: 1em 2em 1em 2em;
		background: #eeab41;
		letter-spacing: 0.20em;
		text-decoration: none;
		text-transform: uppercase;
		font-weight: 400;
		font-size: 0.90em;
		color: #FFF;
	}
	
	.button:before
	{
		display: inline-block;
		background: #FFC31F;
		margin-right: 1em;
		width: 40px;
		height: 40px;
		line-height: 40px;
		border-radius: 20px;
		text-align: center;
		color: #272925;
	}
		
/*********************************************************************************/
/* 4-column                                                                      */
/*********************************************************************************/

.box1,
	.box2,
	.box3,
	.box4
	{
		width: 235px;
	}
	
	.box1,
	.box2,
	.box3
	{
		float: left;
		margin-right: 20px;
	}
	
	.box4
	{
		float: right;
	}
	
/*********************************************************************************/
/* 3-column                                                                      */
/*********************************************************************************/

.boxA,
	.boxB,
	.boxC
	{
		width: 320px;
	}

.boxA,
	.boxB
	{
		float: left;
		margin-right: 20px;
	}
	
	.boxC
	{
		float: right;
	}

/*********************************************************************************/
/* 2-column                                                                      */
/*********************************************************************************/

.tbox1,
	.tbox2
	{
		width: 490px;
	}
	
	.tbox1
	{
		float: left;
	}

.tbox2
	{
		float: right;
	}

/*********************************************************************************/
/* Header                                                                        */
/*********************************************************************************/

#header-wrapper
	{
		overflow: hidden;
	}

#header
	{
		overflow: hidden;
		position: relative;
		padding: 5em 0em;
	}

/*********************************************************************************/
/* Logo                                                                          */
/*********************************************************************************/

#logo
	{
		position: absolute;
		top: 2.5em;
		left: 0;
	}
	
	#logo h1
	{
		background: #eeab41;
		padding: 0.20em 0.50em;
		letter-spacing: 0.10em;
		font-size: 2.5em;
		font-weight: 600;
	}
	
	#logo a
	{
		text-decoration: none;
		text-transform: uppercase;
		color: #FFF;
	}

/*********************************************************************************/
/* Menu                                                                          */
/*********************************************************************************/

#menu
	{
		position: absolute;
		top: 3.5em;
		right: 0;
	}
	
	#menu ul
	{
		display: inline-block;
	}
	
	#menu li
	{
		display: block;
		float: left;
		text-align: center;
	}
	
	#menu li a, #menu li span
	{
		padding: 1em 1.5em;
		letter-spacing: 0.10em;
		text-decoration: none;
		text-transform: uppercase;
		font-size: 0.90em;
		color: #204c48;
	}
	
	#menu li:hover a, #menu li.active a, #menu li.active span
	{
	}
	
	#menu .current_page_item a
	{
	}
	
	#menu .icon
	{
	}

/*********************************************************************************/
/* Banner                                                                        */
/*********************************************************************************/

#banner
	{
		border-top: 20px solid #FFF;
		border-left: 20px solid #FFF;
		border-right: 20px solid #FFF;
	}

#banner img
	{
	}

/*********************************************************************************/
/* Page                                                                          */
/*********************************************************************************/

#page-wrapper
	{
		overflow: hidden;
		padding: 5em 0em;
		background: #FFF;
	}

#page
	{
		margin-bottom: 5em;
		padding-bottom: 4em;
		border-bottom: 1px solid rgba(0,0,0,0.08);
		text-align: center;
	}

#page h2
	{
		padding-bottom: 0.50em;
		text-transform: uppercase;
		font-size: 2.6em;
		font-weight: 300;
	}

/*********************************************************************************/
/* Content                                                                       */
/*********************************************************************************/

#content
	{
	}

/*********************************************************************************/
/* Sidebar                                                                       */
/*********************************************************************************/

#sidebar
	{
	}

/*********************************************************************************/
/* Featured                                                                      */
/*********************************************************************************/

#featured
	{
		overflow: hidden;
	}

#featured h2
	{
		padding-bottom: 1em;
		text-transform: uppercase;
		font-size: 1.8em;
		font-weight: 300;
	}

#featured img
	{
		margin-bottom: 2em;
	}

/*********************************************************************************/
/* Portfolio                                                                     */
/*********************************************************************************/

#portfolio
	{
		overflow: hidden;
		padding: 5em 0em;
	}

#portfolio h2
	{
		padding-bottom: 1em;
		text-transform: uppercase;
		font-size: 1.8em;
		font-weight: 300;
	}

#portfolio p
	{
		letter-spacing: 0.10em;
	}

/*********************************************************************************/
/* Footer                                                                        */
/*********************************************************************************/

#footer
	{
		overflow: hidden;
		padding: 5em 0em;
		border-top: 1px solid rgba(0,0,0,0.08);
	}
	
	#footer .boxA,
	#footer .boxB,
	#footer .boxC
	{
	}
	
	#footer .boxA
	{
		width: 260px;
		padding: 3em 30px;
		background: rgba(255,255,255,0.4);
	}
	
	#footer .boxA h3
	{
		margin-bottom: 1.5em;
		border-bottom: 1px solid rgba(0,0,0,0.08);
	}
	
	#footer img
	{
		margin-bottom: 2em;
	}
	
	#footer h3
	{
		padding-bottom: 1em;
		text-transform: uppercase;
		font-size: 1.8em;
		font-weight: 300;
	}
	
	#footer .link
	{
		display: block;
		padding-top: 1em;
		text-transform: uppercase;
		text-decoration: none;
		font-weight: 700;
		color: rgba(0,0,0,0.8);
	}
	
/*********************************************************************************/
/* Copyright                                                                     */
/*********************************************************************************/

#copyright
	{
		overflow: hidden;
		padding: 5em 0em;
		border-top: 1px solid rgba(0,0,0,0.08);
	}
	
	#copyright p
	{
		letter-spacing: 0.20em;
		text-align: center;
		text-transform: uppercase;
		font-size: 0.90em;
		color: rgba(0,0,0,0.8);
	}
	
	#copyright a
	{
		text-decoration: none;
		color: rgba(0,0,0,1);
	}

</style>
<span style="font-family: Tahoma;">
<div id="header-wrapper">
	<div id="header" class="container">
		<div id="logo">
			<h1><a href="#">Sky-Colored</a></h1>
		</div>
		<div id="menu">
			<ul>
				<li><a href="#" accesskey="1" title="">Homepage</a></li>
				<li><a href="#" accesskey="2" title="">Our Clients</a></li>
				<li><a href="#" accesskey="3" title="">About Us</a></li>
				<li><a href="#" accesskey="4" title="">Careers</a></li>
				<li><a href="#" accesskey="5" title="">Contact Us</a></li>
			</ul>
		</div>
	</div>
	<div id="banner" class="container">
		<img src="https://img.webme.com/pic/w/worderexpress/skycolored_img02.jpg" alt="" class="image image-full" />
	</div>
</div>
<div id="page-wrapper">
	<div id="page" class="container">
		<h2>Welcome to our website</h2>
		<p>SAYFA İÇERİĞİNİZ BURAYA GELECEKTİR.<br />This is <strong>Sky-Colored</strong>, a free, fully standards-compliant CSS template designed by <a href="http://www.freecsstemplates.org/" rel="nofollow">FreeCSSTemplates.org</a>. The photos in this template are from <a href="http://fotogrph.com/"> Fotogrph</a>. This free template is released under a <a href="http://creativecommons.org/licenses/by/3.0/">Creative Commons Attributions 3.0</a> license, so you are pretty much free to do whatever you want with it (even use it commercially) provided you keep the links in the footer intact. Aside from that, have fun with it <img src="//theme.webme.com/smiles/smiley.gif" border="0" width="15" height="15" alt="" /> </p>		
	</div>
	<div id="featured" class="container">
		<div class="tbox1">
			<h2>Integer gravida nibh quis</h2>
			<img src="https://img.webme.com/pic/w/worderexpress/skycolored_img04.jpg" alt="" />
			<p>In posuere eleifend odio. Quisque semper augue mattis wisi. Maecenas ligula. Pellentesque viverra vulputate enim. Aliquam erat volutpat. Pellentesque tristique ante ut risus. Quisque dictum.</p>
			<a href="#" class="button">Etiam posuere</a>
		</div>
		<div class="tbox2">
			<h2>Praesent scelerisque</h2>
			<img src="https://img.webme.com/pic/w/worderexpress/skycolored_img04.jpg" width="490" height="250" alt="" />
			<p>In posuere eleifend odio. Quisque semper augue mattis wisi. Maecenas ligula. Pellentesque viverra vulputate enim. Aliquam erat volutpat. Pellentesque tristique ante ut risus. Quisque dictum.</p>
			<a href="#" class="button">Etiam posuere</a>
		</div>
	</div>
</div>
<div id="portfolio" class="container">
	<div class="box1">
		<h2>Nulla luctus eleifend</h2>
		<ul class="style2">
			<li><a href="#">Semper egetmi dolore</a></li>
			<li><a href="#">Quam turpis feugiat</a></li>
			<li><a href="#">Amet hendrerit lectus</a></li>
			<li><a href="#">Consequat phasellus</a></li>
		</ul>
	</div>
	<div class="box2">
		<h2>Fusce ultrices fringilla</h2>
		<p>Posuere eleifend odio quisque semper augue mattis wisi maecenas ligula.</p>
		<a href="#" class="button">Etiam posuere</a>
	</div>
	<div class="box3">
		<h2>Etiam posuere augue</h2>
		<p>Posuere eleifend odio quisque semper augue mattis wisi maecenas ligula</p>
		<a href="#" class="button">Etiam posuere</a>
	</div>
	<div class="box4">
		<h2>Donec dictum metus</h2>
		<p>Posuere eleifend odio quisque semper augue mattis wisi maecenas ligula</p>
		<a href="#" class="button">Etiam posuere</a>
	</div>
</div>
<div id="footer" class="container">
	<div class="boxA">
		<h3>Maecenas lectus</h3>
		<p>Donec leo, vivamus fermentum nibh in augue praesent a lacus at urna congue rutrum vivamus fermentum. Maecenas ligula. Pellentesque viverra vulputate enim. Quisque semper augue mattis.</p>
		<a href="#" class="button">Read More</a>
	</div>
	<div class="boxB">
		<img src="https://img.webme.com/pic/w/worderexpress/skycolored_img03.jpg" width="320" height="180" alt="" />
		<h3>Integer gravida</h3>
		<p>Donec leo, vivamus fermentum nibh in augue praesent a lacus at urna congue rutrum.</p>
		<a href="#" class="button">Read More</a>
	</div>
	<div class="boxC">
		<img src="https://img.webme.com/pic/w/worderexpress/skycolored_img03.jpg" width="320" height="180" alt="" />
		<h3>Etiam posuere</h3>
		<p>Donec leo, vivamus fermentum nibh in augue praesent a lacus at urna congue rutrum.</p>
		<a href="#" class="button">Read More</a>
	</div>
</div>
<div id="copyright" class="container">
	<p>Copyright (c) 2013 Sitename.com. All rights reserved. | Photos by <a href="http://fotogrph.com/">Fotogrph</a> | Design by <a href="http://www.freecsstemplates.org/" rel="nofollow">FreeCSSTemplates.org</a>.</p>
</div>
</span>

Kod:

Tasarımın Üstü;

Tasarımın Altı

</p>		
	</div>
	<div id="featured" class="container">
		<div class="tbox1">
			<h2>Integer gravida nibh quis</h2>
			<img src="https://img.webme.com/pic/w/worderexpress/skycolored_img04.jpg" alt="" />
			<p>In posuere eleifend odio. Quisque semper augue mattis wisi. Maecenas ligula. Pellentesque viverra vulputate enim. Aliquam erat volutpat. Pellentesque tristique ante ut risus. Quisque dictum.</p>
			<a href="#" class="button">Etiam posuere</a>
		</div>
		<div class="tbox2">
			<h2>Praesent scelerisque</h2>
			<img src="https://img.webme.com/pic/w/worderexpress/skycolored_img04.jpg" width="490" height="250" alt="" />
			<p>In posuere eleifend odio. Quisque semper augue mattis wisi. Maecenas ligula. Pellentesque viverra vulputate enim. Aliquam erat volutpat. Pellentesque tristique ante ut risus. Quisque dictum.</p>
			<a href="#" class="button">Etiam posuere</a>
		</div>
	</div>
</div>
<div id="portfolio" class="container">
	<div class="box1">
		<h2>Nulla luctus eleifend</h2>
		<ul class="style2">
			<li><a href="#">Semper egetmi dolore</a></li>
			<li><a href="#">Quam turpis feugiat</a></li>
			<li><a href="#">Amet hendrerit lectus</a></li>
			<li><a href="#">Consequat phasellus</a></li>
		</ul>
	</div>
	<div class="box2">
		<h2>Fusce ultrices fringilla</h2>
		<p>Posuere eleifend odio quisque semper augue mattis wisi maecenas ligula.</p>
		<a href="#" class="button">Etiam posuere</a>
	</div>
	<div class="box3">
		<h2>Etiam posuere augue</h2>
		<p>Posuere eleifend odio quisque semper augue mattis wisi maecenas ligula</p>
		<a href="#" class="button">Etiam posuere</a>
	</div>
	<div class="box4">
		<h2>Donec dictum metus</h2>
		<p>Posuere eleifend odio quisque semper augue mattis wisi maecenas ligula</p>
		<a href="#" class="button">Etiam posuere</a>
	</div>
</div>
<div id="footer" class="container">
	<div class="boxA">
		<h3>Maecenas lectus</h3>
		<p>Donec leo, vivamus fermentum nibh in augue praesent a lacus at urna congue rutrum vivamus fermentum. Maecenas ligula. Pellentesque viverra vulputate enim. Quisque semper augue mattis.</p>
		<a href="#" class="button">Read More</a>
	</div>
	<div class="boxB">
		<img src="https://img.webme.com/pic/w/worderexpress/skycolored_img03.jpg" width="320" height="180" alt="" />
		<h3>Integer gravida</h3>
		<p>Donec leo, vivamus fermentum nibh in augue praesent a lacus at urna congue rutrum.</p>
		<a href="#" class="button">Read More</a>
	</div>
	<div class="boxC">
		<img src="https://img.webme.com/pic/w/worderexpress/skycolored_img03.jpg" width="320" height="180" alt="" />
		<h3>Etiam posuere</h3>
		<p>Donec leo, vivamus fermentum nibh in augue praesent a lacus at urna congue rutrum.</p>
		<a href="#" class="button">Read More</a>
	</div>
</div>
<div id="copyright" class="container">
	<p>Copyright (c) 2013 Sitename.com. All rights reserved. | Photos by <a href="http://fotogrph.com/">Fotogrph</a> | Design by <a href="http://www.freecsstemplates.org/" rel="nofollow">FreeCSSTemplates.org</a>.</p>
</div>
</span>

CSS kısmı

html, body
	{
		height: 100%;
	}
	
	body
	{
		margin: 0px;
		padding: 0px;
		background: #d4e5f2;
		font-family: 'Source Sans Pro', sans-serif;
		font-size: 12pt;
		font-weight: 300;
		color: #000000;
	}
	
	
	h1, h2, h3
	{
		margin: 0;
		padding: 0;
	}
	
	p, ol, ul
	{
		margin-top: 0;
	}
	
	ol, ul
	{
		padding: 0;
		list-style: none;
	}
	
	p
	{
		line-height: 180%;
	}
	
	strong
	{
	}
	
	a
	{
		color: #151515;
	}
	
	a:hover
	{
		text-decoration: none;
	}
	
	.container
	{
		overflow: hidden;
		margin: 0em auto;
		width: 1000px;
	}
	
/*********************************************************************************/
/* Image Style                                                                   */
/*********************************************************************************/

.boxA,
	.boxB,
	.boxC
	{
		width: 320px;
	}

.boxA,
	.boxB
	{
		float: left;
		margin-right: 20px;
	}
	
	.boxC
	{
		float: right;
	}

.tbox1,
	.tbox2
	{
		width: 490px;
	}
	
	.tbox1
	{
		float: left;
	}

.tbox2
	{
		float: right;
	}

#header-wrapper
	{
		overflow: hidden;
	}

#header
	{
		overflow: hidden;
		position: relative;
		padding: 5em 0em;
	}

#banner
	{
		border-top: 20px solid #FFF;
		border-left: 20px solid #FFF;
		border-right: 20px solid #FFF;
	}

#banner img
	{
	}

#page-wrapper
	{
		overflow: hidden;
		padding: 5em 0em;
		background: #FFF;
	}

#page
	{
		margin-bottom: 5em;
		padding-bottom: 4em;
		border-bottom: 1px solid rgba(0,0,0,0.08);
		text-align: center;
	}

#page h2
	{
		padding-bottom: 0.50em;
		text-transform: uppercase;
		font-size: 2.6em;
		font-weight: 300;
	}

#content
	{
	}

#sidebar
	{
	}

#featured
	{
		overflow: hidden;
	}

#featured h2
	{
		padding-bottom: 1em;
		text-transform: uppercase;
		font-size: 1.8em;
		font-weight: 300;
	}

#featured img
	{
		margin-bottom: 2em;
	}

#portfolio
	{
		overflow: hidden;
		padding: 5em 0em;
	}

#portfolio h2
	{
		padding-bottom: 1em;
		text-transform: uppercase;
		font-size: 1.8em;
		font-weight: 300;
	}

#portfolio p
	{
		letter-spacing: 0.10em;
	}

Yeni Eklenen Sayfalar

En son eklenen sayfaları burada bulabilirsiniz.

ŞUBAT08

Tasarım: wellformed

Önizleme...Devamını Oku -->
ŞUBAT08

Tasarım: complete

Önizleme...Devamını Oku -->
OCAK26

Tasarım: redmarket

Önizleme...Devamını Oku -->
OCAK26

Tasarım: skycolored

Önizleme...Devamını Oku -->
OCAK26

Değişen Sayfa Title Kodu

Önizleme: Bu sitenin title'ında uygulanmaktadır...Devamını Oku -->

COPYRIGHT (c) 2014 - 2014 worderexpress.tr.gg. Tüm hakları saklıdır.Tasarım FreeCSSTemplates.org'a aittir. | Fotoğraflar Fotogrph'a aittir. Bu gün 4 (6 tık) kişi buradaydı! Şu ana kadar 6711 (11100 tık) kişi bu sayfayı ziyaret etti.

Toplist - Yan Bağlantılar

skycolored

WorderExpress

skycolored

Yeni Eklenen Sayfalar

Tasarım: wellformed

Tasarım: complete

Tasarım: redmarket

Tasarım: skycolored

Değişen Sayfa Title Kodu