- DARK CİTY CSS TASARIM,ŞEĞİR TASARIMI,KARANLIK ŞEHİR

DARK CİTY CSS TASARIM,ŞEĞİR TASARIMI,KARANLIK ŞEHİR

TASARIMIN ÜSTÜNE

<div id="wrap">
  <div id="header"><br />
    <h3>BEDAVASİTEM.FORUM.ST</h3>
    <p><strong>"BEDAVA SİTEM DESTEK FORUMU"</strong><br />
      (ELAN)</p>
  </div>
  <div id="nav">
    <ul>
      <li><a href="http://www.free-css.com/">.: index :. </a></li>
      <li><a href="http://www.free-css.com/">About</a></li>
      <li><a href="http://www.free-css.com/">Gallery</a></li>
      <li><a href="http://www.free-css.com/">Forum</a></li>
      <li><a href="http://www.free-css.com/">New</a></li>
      <li class="last"><a href="http://www.free-css.com/">contact</a></li>
    </ul>
  </div>
  <div id="left">
    <p class="title_left"><img src="http://img200.imageshack.us/img200/1930/arrowg2.gif" alt="" width="9" height="5" />
   information</p>
    <div class="news">
      <h3><img src="https://img.webme.com/pic/p/poniex/titre2.jpg" alt="" width="12" height="9" /> Gallery </h3>
      <ul>
        <li><a href="http://www.free-css.com/">Gallery 1</a></li>
        <li><a href="http://www.free-css.com/">Gallery 2</a></li>
        <li><a href="http://www.free-css.com/">Gallery 3</a></li>
        <li><a href="http://www.free-css.com/">Gallery 4</a></li>
        <li><a href="http://www.free-css.com/">Gallery 5</a></li>
        <li class="last"><a href="http://www.free-css.com/">Gallery 6</a></li>
      </ul>
      <p class="comment"><img src="https://img.webme.com/pic/p/poniex/arrow_or.gif" alt="" width="9" height="5" />
      Selection of march ... </p>
      <p class="comment"><img src="https://img.webme.com/pic/p/poniex/arrow_or.gif" alt="" width="9" height="5" />
      Selection of april ... </p>
      <p class="comment"><img src="https://img.webme.com/pic/p/poniex/arrow_or.gif" alt="" width="9" height="5" />
      Selection of may ... </p>
      <p class="comment">Reprehenderit in voluptate velit esse cillum dolore eu
      fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident,
      sunt in culpa qui officia deserunt mollit anim id est laborum."</p>
      <a href="http://www.free-css.com/">More Info...</a><br />
      <br />
    </div>
    <p class="text_left">Reprehenderit in voluptate velit esse cillum dolore eu
   fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt
   in culpa qui officia deserunt mollit anim id est laborum."</p>
    <p><a href="http://www.free-css.com/"><img  class="img" src="https://img.webme.com/pic/p/poniex/mail.jpg" alt="mail" width="64" height="52" /><br />
      </a><a href="http://validator.w3.org/check/referer"> Validate XHTML 1.0
   Strict</a><br />
      and Css <br />
    </p>
  </div>
  <div id="right">
    <p class="title_right"><img src="http://img200.imageshack.us/img200/1930/arrowg2.gif" alt="" width="9" height="5" />
   Some news</p>
    <h3 class="right_titre"> <img src="https://img.webme.com/pic/p/poniex/titre2.jpg" alt="" width="12" height="9" />
   About</h3>
    <div id="info">
      <h3> Minim veniam:</h3>
      <p> consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
      labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud
      exercitation ullamco laboris nisi ut<br />
      </p>
      <h3> Archives:</h3>
      <p><img src="https://img.webme.com/pic/p/poniex/arrow_or.gif" alt="" width="9" height="5" /> last news
      ( juin 2007)<br />
        <img src="https://img.webme.com/pic/p/poniex/arrow_or.gif" alt="" width="9" height="5" /> last news
      ( juillet 2007)<br />
        <img src="https://img.webme.com/pic/p/poniex/arrow_or.gif" alt="" width="9" height="5" /> last news
      (aout 2007)<br />
      </p>
    </div>
    <p > </p>
    <h3 class="right_titre"> <img src="https://img.webme.com/pic/p/poniex/titre2.jpg" alt="" width="12" height="9" />
   Minim veniam:</h3>
    <p > </p>
    <p class="right_texte" >"Lorem ipsum dolor sit amet, consectetur adipisicing
   elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
   enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut<br />
      <a href="http://www.free-css.com/">More Info...</a></p>
    <p > </p>
    <p class="right_texte" ><img src="https://img.webme.com/pic/p/poniex/feed.png" alt="feed" width="16" height="16" />
   Rss </p>
    <p class="small2" >"Lorem ipsum<a href="http://www.free-css.com/"> dolor sit
   amet</a>, consectetur " <br />
      quis nostrud exerci tation ullamcorper suscipit lobortis </p>
  </div>

TASARIMIN ALTINA

CSS BÖLÜMÜNE

h1#title{display: none;}
h2#title span {display: none;}
div.header{display: none;}
li.nav_element{list-style-type: none;}
li.nav_element{display: none;}

/* city - an open source xhtml/css website layout by Studio-plume.org kty
(aug 6, 2008)
 */

body {
margin: 0 auto;
padding: 0;
font: 0.7em "trebuchet ms",arial,sans-serif;
background: #000}

#wrap {
background: #000 url(https://img.webme.com/pic/p/poniex/deg_wrap.jpg) repeat-x center bottom ;
color: #aaa9a9;
border:  none;
margin: 0 auto;
width: 920px;
border-left: 1px #000 solid;
border-right: 1px #000 solid;}

/* header  */
#header {
clear: both;
padding: 0;
height: 260px;background-image: url(https://img.webme.com/pic/p/poniex/920.jpg);
background-repeat: no-repeat;}

#header h3 {
width: 350px;
margin: 0px 0px 0px 25px;
float: left;
font-family: "trebuchet ms",arial,sans-serif;font-size: 0.9em;}

#header p {
width: 400px;
float: left;
text-align: left;
color: #fff;
margin: 70px 0px 0px 350px;
font-size: 0.9em;
line-height: 1.2em;height: 35px;background-color: inherit;}

/*  navigation  */

#nav {
font-size: 1.2em;font-weight: bold;margin-top: -42px;width: 600px;height: 25px;margin-left: 180px;}

#nav ul {
  margin : 0;
  padding : 0;
  list-style : none;
  text-align: center;font-variant: small-caps;
font-weight: bold;}

#nav li {
  float : left;
  font-family: "trebuchet ms",arial,sans-serif;
 }

#nav a {
  display : block;
  padding :  10px;
  color : #FFF;
  text-decoration : none;width: 75px;background-color: inherit;color: #000;
padding: 0px 10px 0px 10px;}

#nav a:hover {
  color : #8E8E6A;background-color: inherit;color: #fff;}

/* content  */

#content {

padding: 0 10px 0 10px;
line-height: 1.4em;
text-align: left;background-color: #161616;width: 470px;margin-top: 7px;float: left;background-image: url(https://img.webme.com/pic/p/poniex/ht_center2.jpg);background-repeat: no-repeat;background-position: center top;
margin-left: 15px;}

#content h2 {
font-size: 1.2em;
margin: 20px 0em 0em 0em;
font-family: "trebuchet ms",arial,sans-serif;
height: 21px;}

#content img {
padding: 0px;
display:inline;
padding-right: 3px;
margin-left: 8px;}

.left_articles {
      margin: 15px 15px 0px 0em;
      color: #fff;
      padding: 15px 0px 10px;text-align: justify;background-color: inherit;}.comment {  padding: 0 0 0 12px;
line-height: 1.4em;}
      
      .bigimage {
         float: left;
         clear: left;
         margin: 8px;border: none;}

h3 {
font-size: 1.1em;
margin: 0em 0em 25px;
font-family: "trebuchet ms",arial,sans-serif;text-transform: uppercase;width: 196px;
color: #fff;}

a {
text-decoration: none;
color: #657536;background-color: inherit;}

a:hover {
text-decoration: underline;
color: #819545;background-color: inherit;}

/* left side  */

#left {

float: left;
margin: 12px 0em 20px 10px;
list-style: none;background-position: left top;background-color: #161616;background-image: url(https://img.webme.com/pic/p/poniex/ht_menu2.jpg);background-repeat: no-repeat;height: auto;
width: 185px;}

.text_left{margin: 35px 0em 10px;width: 175px;
color: #aaa9a9;line-height: 1.2em;padding-left: 2px;background-repeat: no-repeat;background-position: top center;background-color: #232325;border: 1px #2e2e2e dashed;}

.news {
margin: 35px 0em 10px 0px;width: 175px;
color: #fff;line-height: 1.2em;background-repeat: no-repeat;background-position: top center;background-color: #232325;border: 1px #2e2e2e dashed;}

/* right side  */

#right {

float: right;
width: 206px;
margin: 10px 0em;
padding: 0;
font-size: 1em;list-style: none;background-position: left top;background-color: #161616;background-image: url(https://img.webme.com/pic/p/poniex/ht_right2.jpg);background-repeat: no-repeat;}

.right_titre{
margin: 0em 0em 0em 30px;
text-align: center;width: 150px;}

.right_texte{
margin: 0em 0em 0em 5px;
text-align: left;width: 150px;

}

#info {
float: right;
width: 170px;
margin: 18px 15px 10px 5px;
padding: 3px;
line-height: 1.5em;
text-align: left;background-color: #667731;}

#info p {
margin: 0em 0em 0em 2px;
font-style: italic;
color: #fff;
background-color: #566529;
padding: 3px;}

#info h3 {
margin: 0em 0em 0em 5px;
text-align: center;width: 150px;
font-size: 0.9em;
font-style: italic;
color: #fff;}

/* footer part  */

#footer {
clear: both;
margin: auto 0em auto;
padding: 0;
width: 920px;
text-align: center;
color: #a5a5a5;
font-size: 0.9em;background: #000 url(https://img.webme.com/pic/p/poniex/bg_footer.jpg) no-repeat left center ;border: none;height: 36px;
}

#footer a {
color: #ccc;
text-decoration: none;background-color: inherit;}

#footer a:hover {
text-decoration: underline;
}
.text_footer {
font-size: 0.9em;
padding-top: 10px;}

/* others  */

.title_left {
font-size: 0.9em;
margin: 15px 0em 25px 10px;
font-family: "trebuchet ms",arial,sans-serif;text-transform: uppercase;color: #7e9144;padding-left: 30px;}

.title_right {
font-size: 0.8em;
margin: 24px 0em 25px 10px;
font-family: "trebuchet ms",arial,sans-serif;text-transform: uppercase;color: #7e9144;padding-left: 30px;}

.left {
margin: 0px 7px 0px;
float: left;
}

.right {
margin: 0px 7px 0px 5px;
float: right;
}

.small {
font-size: 0.85em;
padding-top: 10px;
color: #4f4f53;
text-align: center;}

.small2 {
font-size: 0.85em;
padding-top: 10px;
color: #aaa9a9;
text-align: left;}

.bold {
font-weight: bold;
}

.img {border: none;}