style/turquoiseswirls/index.html

   1 <!DOCTYPE html>
   2 <html xmlns="http://www.w3.org/1999/xhtml"
   3       lang="en">
   4   <head>
   5     <meta charset="UTF-8"/>
   6     <title>my title</title>
   7     <link rel="stylesheet" href="style.css" type="text/css" media="screen" />
   8     <link rel="stylesheet" type="text/css" href="print.css" media="print" />
   9     <!--[if IE]><script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
  10   </head>
  11
  12   <body>
  13
  14     <div id="wrapper">
  15
  16       <header>
  17         <h1 id="sitename"><a href="#">Turquoise Swirls</a></h1>
  18         <div id="description">Your interesting &amp; compelling tag line</div>
  19         <div id="top">
  20           <nav>
  21             <ul>
  22               <li><a href="#">Home</a></li>
  23               <li><a href="#">About</a></li>
  24               <li><a href="#">Contact</a></li>
  25               <li><a href="#">Support</a></li>
  26             </ul>
  27           </nav>
  28         </div>
  29       </header>
  30
  31       <section>
  32
  33         <div id="container">
  34           <div id="content">
  35
  36             <article>
  37               <h2><a href="#" rel="bookmark">Your Awesome Article Title</a></h2>
  38               <div class="entry">
  39                 <p>
  40                   Lorem ipsum pri at agam postulant. Vis option
  41                   euismod ut, mucius nominavi noluisse vim in, his ne
  42                   mediocrem qualisque necessitatibus. Has at ubique
  43                   utroque molestie, <a href="#">vim ne ceteros
  44                   ponderum</a> hendrerit. No everti singulis
  45                   disputationi eam, minim iusto cu usu, sint nulla
  46                   harum duo ei. Ut vidit cotidieque ullamcorper mea,
  47                   dolorem oportere vulputate ea mei, eu ius error
  48                   perpetua theophrastus.
  49                 </p>
  50                 <img src="images/turquoise-stone.png" alt=""
  51                      class="alignright framed" />
  52                 <p>
  53                   Quis quaerendum pri no, sit ad noster timeam. An pro
  54                   consul concludaturque, no possim impetus mei. Facer
  55                   oblique referrentur te qui, ornatus postulant
  56                   evertitur ius ea. No sed vero aperiri equidem, pri
  57                   et perpetua erroribus accusamus, doctus menandri ad
  58                   qui. Natum dicunt delenit te vim, has te decore
  59                   deseruisse. Quot malorum legendos ut est, urbanitas
  60                   interpretaris id qui, duo populo animal
  61                   conclusionemque ne.
  62                 </p>
  63                 <p>
  64                   Iriure postulant pro ad. Wisi delectus legendos an
  65                   duo, alia utroque recteque no mel, te sed porro
  66                   alienum. Vix tale suavitate incorrupte at, viris
  67                   tractatos incorrupte pri ad. Veri putant volutpat
  68                   his ad, no doming deserunt persecuti eum, ad nobis
  69                   essent sed. Ad vis mandamus expetenda, salutandi
  70                   iracundia repudiandae mei ei. Alii pericula
  71                   abhorreant mei an, vix dignissim consequuntur ex,
  72                   alienum invenire posidonium nam ei.
  73                 </p>
  74                 <blockquote>
  75                   Minim elitr congue eu mea, quo minimum verterem
  76                   gloriatur in, ex alia cotidieque complectitur
  77                   qui. Eu sit idque quodsi constituto, ex mea omnesque
  78                   adolescens. Sit id fabulas eligendi suscipiantur, eu
  79                   natum perfecto sit, at brute option lucilius mea. Te
  80                   malis disputationi has, ex eum habeo sententiae. An
  81                   est meliore denique voluptatibus, nam putent
  82                   voluptua inciderint in, ne simul graeci nonummy vel.
  83                 </blockquote>
  84                 <p>
  85                   Quod malorum delectus ne duo, an pri facer doming
  86                   quaeque, ancillae omnesque his ei. At sed nibh illum
  87                   placerat. At quod appareat reprehendunt vim, te pri
  88                   velit nonumy antiopam. Exerci placerat est no, cu
  89                   quo affert vidisse democritum. Debitis maiestatis
  90                   referrentur qui ad. Sonet praesent intellegebat mei
  91                   ex, duo meis epicurei cu. Idque volutpat sadipscing
  92                   ut est, eos eu alienum oportere, eum ea dicat ignota
  93                   persequeris.
  94                 </p>
  95                 <p>
  96                   Veritus menandri referrentur est cu. Eos ea mazim
  97                   elaboraret delicatissimi, puto nostrud platonem vis
  98                   an. Mea eirmod torquatos et, ad sonet minimum mea,
  99                   mei eu causae eruditi intellegat. Velit vitae ridens
 100                   et vel, commodo suscipit persequeris sea id, iudico
 101                   persius eruditi in vel. Magna eloquentiam mei et,
 102                   quo erat vituperatoribus ea, in sale audiam quo. Ad
 103                   eum illum tantas volumus, iriure feugiat recteque ei
 104                   est.
 105                 </p>
 106               </div>
 107             </article>
 108
 109           </div><!-- #content-->
 110         </div><!-- #container-->
 111
 112         <aside id="left"><!-- start left sidebar -->
 113           <div class="box">
 114             <h3>Main Menu</h3>
 115             <div class="inner">
 116               <ul>
 117                 <li><a href="#">Products</a></li>
 118                 <li><a href="#">Support</a></li>
 119                 <li><a href="#">Popular Uses</a></li>
 120               </ul>
 121             </div>
 122           </div><!-- .box -->
 123
 124           <div class="box">
 125             <h3>Our Sponsor</h3>
 126             <div class="inner">
 127               <br />
 128               <a href="#"><img src="images/ad600.jpg" alt="" class="aligncenter" /></a>
 129               <br />
 130             </div>
 131           </div><!-- .box -->
 132
 133         </aside><!-- end left sidebar -->
 134
 135         <aside id="right"><!-- start right sidebar -->
 136
 137           <div class="box">
 138             <h3>Connect With Us</h3>
 139             <div class="inner">
 140               <ul>
 141                 <li><a href="#">Twitter</a></li>
 142                 <li><a href="#">Facebook</a></li>
 143               </ul>
 144             </div>
 145           </div><!-- .box -->
 146
 147           <div class="box">
 148             <h3>Recent Articles</h3>
 149             <div class="inner">
 150               <ul>
 151                 <li><a href="#">How To Clean Anything</a></li>
 152                 <li><a href="#">Get The Most Out of Widgets</a></li>
 153               </ul>
 154             </div>
 155           </div><!-- .box -->
 156
 157           <div class="box">
 158             <h3>Recommended</h3>
 159             <div class="inner">
 160               <br />
 161               <a href="#"><img src="images/ad125.jpg" alt="" class="aligncenter" /></a>
 162               <br />
 163               <a href="#"><img src="images/ad125.jpg" alt="" class="aligncenter" /></a>
 164               <br />
 165               <a href="#"><img src="images/ad125.jpg" alt="" class="aligncenter" /></a>
 166               <br />
 167             </div>
 168           </div><!-- .box -->
 169
 170         </aside><!-- end right sidebar -->
 171
 172       </section>
 173
 174       <footer>
 175         <div id="copyright">
 176           <span>© 2010 All rights reserved <a href="#">yoursite.com</a></span>
 177         </div>
 178       </footer>
 179
 180     </div><!-- #wrapper -->
 181     <!-- Free template created by http://freehtml5templates.com -->
 182   </body>
 183 </html>