home *** CD-ROM | disk | FTP | other *** search
/ Cricao de Sites - 650 Layouts Prontos / WebMasters.iso / Templates / CSS / SimpleBlog / images / SimpleBlog.css < prev   
Encoding:
Cascading Style Sheet File  |  2006-11-27  |  6.3 KB  |  315 lines
  1. /********************************************
  2.    AUTHOR:              Erwin Aligam 
  3.    WEBSITE:               http://www.styleshout.com/
  4.    TEMPLATE NAME:     SimpleBlog 1.0
  5.     TEMPLATE CODE:     S-0007
  6.    VERSION:          1.0              
  7.  *******************************************/
  8.  
  9. /********************************************
  10.    HTML ELEMENTS
  11. ********************************************/ 
  12.  
  13. /* Top Elements */
  14. * { margin: 0; padding: 0; }
  15.  
  16. body {
  17.     background: #FFF;
  18.     font: normal 70%/1.5em Verdana, Tahoma, Verdana, sans-serif;
  19.     color: #333; 
  20.     text-align: center;
  21. }
  22. /* links */
  23. a {
  24.     background: inherit;
  25.     text-decoration: none;
  26.     color: #667F99;    
  27. }
  28. a:hover {
  29.     background: inherit;
  30.     color: #996800; 
  31. }
  32. /* headers */
  33. h1, h2, h3 {
  34.     font-family: Verdana, Tahoma, 'Trebuchet MS', Sans-serif;
  35.     font-weight: Bold;         
  36. }
  37. h1 { font-size: 120%; }
  38. h2 { font-size: 110%; text-transform: uppercase; }
  39. h3 { font-size: 110%; color: #007E80; }
  40.  
  41. h1, h2, h3, p {
  42.     margin: 0;
  43.     padding: 10px;        
  44. }
  45. ul, ol {
  46.     margin: 10px 20px;
  47.     padding: 0 20px;
  48. }
  49.  
  50. /* images */
  51. img {
  52.     border: 2px solid #CCC;
  53. }
  54. img.float-right {
  55.   margin: 5px 0px 5px 10px;  
  56. }
  57. img.float-left {
  58.   margin: 5px 10px 5px 0px;
  59. }
  60.  
  61. code {
  62.   margin: 5px 0;
  63.   padding: 10px;
  64.   text-align: left;
  65.   display: block;
  66.   overflow: auto;  
  67.   font: 500 1em/1.5em 'Lucida Console', 'courier new', monospace ;
  68.   /* white-space: pre; */
  69.   background: #FAFAFA;
  70.   border: 1px solid #f2f2f2;  
  71. }
  72. acronym {
  73.   cursor: help;
  74.   border-bottom: 1px solid #777;
  75. }
  76.  
  77. /* blockquote */
  78. blockquote {
  79.     margin: 10px;
  80.      padding: 0 0 0 28px;  
  81.    border: 1px solid #f2f2f2; 
  82.       background: #FAFAFA url(quote.gif) no-repeat 5px 5px;    
  83. }
  84.  
  85. /* form elements */
  86. form {
  87.     margin:10px; padding: 0 5px;
  88.     border: 1px solid #f2f2f2; 
  89.     background-color: #FAFAFA; 
  90. }
  91. label {
  92.     display:block;
  93.     font-weight:bold;
  94.     margin:5px 0;
  95. }
  96. input {
  97.     padding:2px;
  98.     border:1px solid #eee;
  99.     font: normal 1em Verdana, sans-serif;
  100.     color:#777;
  101. }
  102. textarea {
  103.     width:400px;
  104.     padding:2px;
  105.     font: normal 1em Verdana, sans-serif;
  106.     border:1px solid #eee;
  107.     height:100px;
  108.     display:block;
  109.     color:#777;
  110. }
  111. input.button { 
  112.     margin: 0; 
  113.     font: bolder 12px Arial, Sans-serif; 
  114.     border: 1px solid #CCC; 
  115.     padding: 2px 3px; 
  116.     background: #FFF;
  117.     color: #275F6C;
  118. }
  119. /* search form */
  120. form.search {
  121.     padding: 0; margin: 0; 
  122.     vertical-align: bottom;
  123.     border: none;
  124.     background-color: transparent;
  125. }
  126. form.search input.textbox { 
  127.     margin: 0; padding: 1px;
  128.     width: 120px;
  129.     border: 1px solid #CCC; 
  130.     background: #FFF;
  131.     color: #333; 
  132. }
  133. form.search input.button {
  134.     height: 20px;
  135.     padding: 1px 3px;
  136.     width: 60px;
  137. }
  138.  
  139. /********************************************
  140.    LAYOUT
  141. ********************************************/ 
  142. #wrap {
  143.     width: 833px;
  144.     background: url(bg.jpg) repeat-y center top;
  145.     margin: 0 auto;
  146.     text-align: left;
  147. }
  148. #content-wrap {
  149.     position: relative;
  150.     width: 91%;
  151.     margin: 0 auto;
  152.     padding: 0;    
  153. }
  154. /* header */
  155. #header {
  156.     position: relative;
  157.     width: 833px;
  158.     height: 100px;
  159.     background: #FFF url(header.jpg) no-repeat center top;
  160.     margin: 0; padding: 0;
  161.     font-size: 14px;
  162.     color: #FFF;
  163. }
  164. #header h1#logo {
  165.     position: absolute;
  166.     margin: 0; padding: 0;
  167.     font: bold 42px 'Trebuchet MS', Arial, Sans-serif;
  168.     letter-spacing: -2px;
  169.     color: #FFF;
  170.     text-transform: none;
  171.     
  172.     /* change the values of top and Left to adjust the position of the logo*/
  173.     top: 19px; left: 53px;    
  174. }
  175. #header h2#slogan {
  176.     position: absolute;
  177.     z-index: 9999999;
  178.     margin: 0; padding: 0;
  179.     font: bold 12px 'Trebuchet MS', Arial, Sans-serif;
  180.     text-transform: none;
  181.     color: #FFF;
  182.     
  183.     /* change the values of top and Left to adjust the position of the slogan*/
  184.     top: 65px; left:75px;            
  185. }
  186. #header #searchform {
  187.     float: right;
  188.     padding: 45px 40px 0 0;
  189.     display: inline;
  190. }
  191. /* menu */
  192. #menu {
  193.     clear: both;
  194.     width: 833px;
  195.     height: 26px;
  196.     background: #FFF url(menubg.jpg) repeat-y;
  197.     margin: 0;
  198.     font: bolder 12px/26px Tahoma, Verdana, Arial, Sans-Serif;            
  199. }
  200. #menu ul{
  201.     margin: 0; padding: 0 0 0 35px;
  202. }
  203. #menu ul li {
  204.     float: left;
  205.     list-style: none;        
  206. }
  207. #menu ul li a {
  208.     display: block;
  209.     text-decoration: none;    
  210.     padding: 0 10px;
  211.     background: inherit;
  212.     color: #FFF;
  213. }
  214. #menu ul li a:hover {
  215.    background: #FFF; 
  216.     color: #333;  
  217. }
  218. #menu ul li#current a {    
  219.     background: #30899F; 
  220.     color: #FFF;    
  221. }
  222.  
  223. /* Main */
  224. #main {
  225.     float: left;    
  226.     width: 72%;
  227.     padding: 0;    margin: 0;    
  228. }
  229. #main h1 {
  230.     color: #667F99; 
  231.     border-bottom: 1px solid #CCCCCC;
  232.     background: #F6F6F6 url(arrow.gif) no-repeat 5px 50%;    
  233.     padding: 3px 0 3px 20px;    
  234.     margin: 10px 0 0 0;
  235. }
  236.  
  237. .post-footer {
  238.     background-color: #FAFAFA;
  239.     padding: 5px; margin: 20px 10px 0 10px;
  240.     border: 1px solid #f2f2f2;
  241.     font-size: 95%;    
  242. }
  243. .post-footer .date {
  244.     background: url(clock.gif) no-repeat left center;
  245.     padding-left: 20px; margin: 0 10px 0 5px;
  246. }
  247. .post-footer .comments {
  248.     background: url(comment.gif) no-repeat left center;
  249.     padding-left: 20px; margin: 0 10px 0 5px;
  250. }
  251. .post-footer .readmore {
  252.     background: url(page.gif) no-repeat left center;
  253.     padding-left: 20px; margin: 0 10px 0 5px;
  254. }
  255.  
  256. /* sidebar */
  257. #sidebar {
  258.     float: right;
  259.     width: 26%;
  260.     padding: 0; margin: 0;        
  261. }    
  262. #sidebar h1 {
  263.     margin: 10px 0 0 0; 
  264.     padding: 3px 10px; 
  265.     font: bold 120% Tahoma, Verdana, Sans-Serif;    
  266.     color: #FFF;    
  267.     background: #B6B8BB;    
  268. }
  269. #sidebar ul.sidemenu {
  270.     list-style: none;
  271.     text-align: left;
  272.     margin: 3px 0px 8px 0; padding: 0;
  273.     text-decoration: none;    
  274. }
  275. #sidebar ul.sidemenu li {
  276.     border-bottom: 1px solid #EFF0F1;
  277.     background: url(bullet.gif) no-repeat 2px 3px ;
  278.     padding: 2px 0 2px 25px;
  279.     margin: 0 2px;             
  280. }
  281.  
  282. * html body #sidebar ul.sidemenu li { height: 1%; }
  283.  
  284. #sidebar ul.sidemenu a {
  285.     font-weight: bold;
  286.     padding: 2px 0;         
  287.     background: none;
  288. }
  289.  
  290. /* footer */
  291. #footer {
  292.     clear: both;
  293.     color: #66737B;
  294.     font: normal 90% Verdana, Tahoma, sans-serif;
  295.     background: #FFF url(footerbg.jpg) no-repeat center top;    
  296.     width: 833px;
  297.     height: 60px;
  298.     text-align: center;
  299.     padding: 8px 0 0 0;
  300.     margin: 0 auto;    
  301. }
  302. #footer a { text-decoration: none; }
  303.  
  304. /* alignment classes */
  305. .float-left  { float: left; }
  306. .float-right { float: right; }
  307. .align-left  { text-align: left; }
  308. .align-right { text-align: right; }
  309.  
  310. /* additional classes */
  311. .clear { clear: both; }
  312. .gray { color: #CCC; }
  313.  
  314.  
  315.