site/reservoir.css

   1 /*-----------------------------------------------------------------------------
   2 This is derivative work from the layout reservoir by Rob Chandanais, stolen
   3 with his explicit consent:
   4
   5 [Please feel free to borrow, steal, abduct, and/or torture
   6 the documents contained in the Layout Reservoir.
   7 Though you need not give credit to BlueRobot.com, a comment
   8 in your source code would help other developers to find
   9 this resource. Enjoy.]
  10         -- http://www.bluerobot.com/web/layouts/,
  11            Thu Dec 9 03:43:45 EST 2004
  12
  13 Have a look at http://bluerobot.com/ !
  14 ----------------------------------------------------------------------------*/
  15
  16 body {
  17         margin:0px;
  18         padding:0px;
  19         color:#333;
  20         background-color:white;
  21         }
  22
  23 h1 {
  24         margin:0px 0px 2px 0px;
  25         line-height:11px;
  26         font-weight:600;
  27         font-size:12pt;
  28         }
  29
  30 .footer {
  31         margin:0px
  32         line-height:11px
  33         font-weight:600;
  34         font-size:12pt;
  35 }
  36
  37 h2 {
  38         margin:0px 0px 15px 0px;
  39         padding:0px;
  40         line-height:28px;
  41         font-weight:900;
  42         color:#ccc;
  43         }
  44 p {
  45         margin:0px 0px 16px 0px;
  46         padding:0px;
  47         }
  48
  49 a {
  50         color:#09c;
  51         text-decoration:none;
  52         font-weight:600;
  53         }
  54
  55 a:link {color:#09c;}
  56 a:visited {color:#07a;}
  57 a:hover {background-color:#eee;}
  58
  59 #Menu a:hover {color:#09e;}
  60
  61 #Header {
  62         margin:50px 0px 10px 0px;
  63         padding:17px 0px 0px 20px;
  64         /* For IE5/Win's benefit height = [correct height] + [top padding] +
  65         [top and bottom border widths] */
  66         height:33px; /* 14px + 17px + 2px = 33px */
  67         border-style:solid;
  68         border-color:black;
  69         border-width:1px 0px; /* top and bottom borders: 1px; left and right
  70         borders: 0px */
  71         line-height:11px;
  72         background-color:#eee;
  73
  74 /* Here is the ugly brilliant hack that protects IE5/Win from its own
  75 stupidity. Thanks to Tantek Celik for the hack and to Eric Costello
  76 for publicizing it. IE5/Win incorrectly parses the "\"}"" value, prematurely
  77 closing the style declaration. The incorrect IE5/Win value is above,
  78 while the correct value is below. See http://glish.com/css/hacks.asp
  79 for details. */
  80         voice-family: "\"}\"";
  81         voice-family:inherit;
  82         height:14px; /* the correct height */
  83         }
  84
  85 #Footer {
  86         margin:30px 0px 10px 0px;
  87         padding:17px 0px 0px 20px;
  88         /* For IE5/Win's benefit height = [correct height] + [top padding] +
  89         [top and bottom border widths] */
  90         height:33px; /* 14px + 17px + 2px = 33px */
  91         border-style:solid;
  92         border-color:black;
  93         border-width:1px 0px; /* top and bottom borders: 1px; left and right
  94         borders: 0px */
  95         line-height:11px;
  96         background-color:#eee;
  97         voice-family: "\"}\"";
  98         voice-family:inherit;
  99         height:14px; /* the correct height */
 100         }
 101 }
 102
 103
 104 /* I've heard this called the "be nice to Opera 5" rule. Basically, it
 105 feeds correct length values to user agents that exhibit the parsing error
 106 exploited above yet get the CSS box model right and understand the CSS2
 107 parent-child selector. ALWAYS include a "be nice to Opera 5" rule every
 108 time you use the Tantek Celik hack(above). */
 109 body>#Header {height:14px;}
 110
 111 .content {
 112         margin:0px 50px 20px 250px;
 113         padding:10px;
 114         position:relative;      /* Position is declared "relative"
 115                                 to gain control of stacking order (z-index). */
 116         width:auto;
 117         min-width:220px;
 118         border:1px solid black;
 119         background-color:white;
 120         z-index:3;              /* This allows the content to overlap
 121                                 the right menu in narrow windows
 122                                 in good browsers. */
 123         }
 124
 125 .content2 {
 126         margin:0px 50px 10px 250px;
 127         padding:10px;
 128         position:relative;      /* Position is declared "relative"
 129                                 to gain control of stacking order (z-index). */
 130         width:auto;
 131         min-width:220px;
 132         min-height:140px;
 133         border:1px solid black;
 134         background-color:white;
 135         z-index:3;              /* This allows the content to overlap
 136                                 the right menu in narrow windows
 137                                 in good browsers. */
 138         }
 139
 140 .minititle {
 141         margin:0px 0px 10px 0px;
 142 //      font-weight:600;
 143 }
 144
 145 .thumbnail {
 146         float:left;
 147         margin:0px 50px 10px 0px;
 148         color:#fff;
 149 }
 150
 151 .nocolor {
 152         color:#fff;
 153 }
 154
 155 #Menu {
 156         position:absolute;
 157         top:100px;
 158         left:20px;
 159         width:210px;
 160         padding:10px;
 161         background-color:#eee;
 162         border:1px dashed #999;
 163         line-height:17px;
 164 /* Again, the ugly brilliant hack. */
 165         voice-family: "\"}\"";
 166         voice-family:inherit;
 167         width:190px;
 168         }
 169
 170 #Logo {
 171         position:absolute;
 172         top:270px;
 173         left:20px;
 174
 175         width:190px;
 176 }
 177
 178 /* Again, "be nice to Opera 5". */
 179 body>#Menu {width:190px;}