home *** CD-ROM | disk | FTP | other *** search
/ Cricao de Sites - 650 Layouts Prontos / WebMasters.iso / Templates / CSS / fluidity2 / fluidity2.css next >
Encoding:
Cascading Style Sheet File  |  2006-12-01  |  3.4 KB  |  96 lines

  1. /* A fluid template for business or fun */
  2. /* By Dave Reeder, www.davereederdesign.com */
  3.  
  4. body { margin: 0; padding: 0; background: #111; }
  5.  
  6. * {margin: 0; padding: 0; border: 0; font-family: Verdana, Arial, sans-serif; }
  7.  
  8.  
  9. /*----------------------------------------------Basic styles------------------------------------------------*/
  10.  
  11. p, h1, h2, h3, span#copyright { margin: 0 10px; color: #fff; font-weight: normal}
  12. h1, h2, h3, h4 {margin-top: 5px; color: #CCFF00; font-style: italic}
  13.  
  14. p { font-size: 0.75em; line-height: 1.6em; text-align: justify }
  15. h1 {float: left; font-style: italic; margin-top: 40px; margin-left: 30px; font-size: 1.75em; line-height: 1.75em; letter-spacing: 0.20em}    /* site heading */
  16. h1 a {color: #333; text-decoration: none}
  17. h1 a:hover {color: #333; text-decoration: underline}
  18.  
  19. h2 { font-size: 1.30em; line-height: 2.40em }    /* site heading */
  20. h3 { font-size: 0.90em; line-height: 1.60em }                /* sub headings */
  21. span#copyright { font-size: 13px; line-height: 35px; color: #000 }
  22.  
  23. div { padding: 10px 0;}
  24.  
  25. a {color: #00CCFF; text-decoration: none; font-style: italic}
  26. a:hover {color: #fff; text-decoration: underline}
  27.  
  28. ul, ol {margin: 10px; color: #fff; font-size: 0.70em; line-height: 1.6em}
  29. ul {list-style: square inside}
  30. ol {list-style: decimal inside}
  31. em {font-weight: bold; font-style: normal}
  32.  
  33.  
  34. /*---------------------------------------------Layout------------------------------------------------------*/
  35.  
  36. #hdr {
  37.     padding: 0;
  38.     width: 100%;
  39.     background: url(images/hdrgrn.jpg) repeat-x 0 bottom #CCFF00;
  40.     height: 200px;
  41. }
  42.  
  43. .rowcontainer {    /* Used to keep the divs in a row.  you can use this for any size of divs */
  44.     float: left;
  45.     margin-top: 5px;
  46.     width: 100%;
  47.     overflow: hidden;
  48.     background: #222;
  49. }
  50.  
  51. #navbar {position: relative; width: 100%; height: 2.0em; background: #111}
  52.  
  53. #bttmbar {float: left; width: 100%; height: 4em; line-height: 4em; text-align: center; font-size: 0.80em; background: url(images/hdrgrn.jpg) repeat-x 0 50% #CCFF00; overflow: hidden}
  54. #bttmbar a {color: #000; text-decoration: underline; font-style: normal}
  55. #bttmbar a:hover {text-decoration: none}
  56.  
  57. /*---------------------------------------------Main Nav------------------------------------------------------*/
  58.  
  59. ul#nav {margin: 0; position: absolute; bottom: 0; left: 10px; list-style: none inside; background: #111}
  60. ul#nav li {float: left; margin-right: 1px}
  61.  
  62. ul#nav a {
  63.     font-weight: bold;
  64.     display: block;
  65.     width: 8em;
  66.     height: 2.50em; 
  67.     line-height: 2.50em;
  68.     padding-left: 10px;
  69.     text-decoration: none
  70. }
  71.  
  72. ul#nav li a:link, ul#nav li a:visited  {
  73.     background: #444;
  74.     color: #fff
  75. }
  76.  
  77. ul#nav li a:hover, ul#nav li a:active {
  78.     color: #00CCFF;
  79.     background: #555
  80. }
  81.  
  82. ul#nav li a.current {background: #CCFF00; color: #000}
  83. ul#nav li a.current:hover {background: #CCFF00; color: #00CCFF}
  84.  
  85. /*---------------Columns: Note they dont add up to 100%, this is intentional to avoid problems!-----------*/ 
  86.  
  87.  
  88. .fullcolumn {float: left; width: 99%;}        /* Full width column for a one column site */
  89.  
  90. .threequartercolumn {float: left; width: 74%;}        /* Three quarter width column for a two column site, pair with the onethirdcolumn div class */
  91.             
  92. .halfcolumn {float: left; width: 49%;}        /* Half width column for a two column site. */
  93.  
  94. .onethirdcolumn {float: left; width: 33%; }        /* One third width column for a three column site */
  95.  
  96. .onequartercolumn {float: left; width: 24.5% }        /* One quarter width column for a four column site */