css/tritium4.css

   1 html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6,
   2 p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em,
   3 img, ins, q, small, strong, sub, sup, dl, dt, dd, ol, ul, li,
   4 fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td
   5 {
   6         margin: 0;
   7         padding: 0;
   8         border: 0;
   9 }
  10
  11 article, aside, figure, figure img, figcaption, hgroup,
  12 footer, header, nav, section, video, object
  13 {
  14         display: block;
  15 }
  16
  17 a img
  18 {
  19         border: 0;
  20 }
  21
  22 a:focus,a:hover
  23 {
  24         color: #039;
  25 }
  26
  27 a
  28 {
  29         color: #456;
  30         text-decoration: none;
  31 }
  32
  33 a:hover
  34 {
  35         text-decoration: underline;
  36 }
  37
  38 .hr
  39 {
  40         border-bottom: 1px solid #DDDDDD;
  41         margin-bottom: 3px;
  42         margin-top: 2px;
  43         margin-left: -3px;
  44 }
  45
  46 li
  47 {
  48         list-style: none;
  49 }
  50
  51 .huge, h1
  52 {
  53         text-shadow: rgba(215,215,215,0.3) 5px 5px 8px;
  54         -moz-user-select: none;
  55         -khtml-user-select: none;
  56         -webkit-user-select: none;
  57         cursor: default;
  58         font: normal 90% "Lobster", sans-serif;
  59         font-size: 68px;
  60         color: #555;
  61         letter-spacing: -1px;
  62         padding: 0 20px;
  63         text-align: center;
  64 }
  65
  66 .large, h2
  67 {
  68         text-shadow: rgba(215,215,215,0.3) 4px 4px 7px;
  69         -moz-user-select: none;
  70         -khtml-user-select: none;
  71         -webkit-user-select: none;
  72         cursor: default;
  73         font: normal 90% "Lobster", sans-serif;
  74         font-size: 42px;
  75         color: #555;
  76         line-height: 48px;
  77         letter-spacing: -1px;
  78         text-align: center;
  79 }
  80
  81 .big, h3
  82 {
  83         font-size: 26px;
  84         line-height: 36px;
  85 }
  86
  87 .normal, body
  88 {
  89         font: normal 80% "Cantrell", sans-serif;
  90 }
  91
  92 .small, small
  93 {
  94         font-size: 13px;
  95         line-height: 18px;
  96 }
  97
  98 .left,.alignleft
  99 {
 100         float: left;
 101 }
 102
 103 .right,.alignright
 104 {
 105         float: right;
 106 }
 107
 108 .clear,.clearer
 109 {
 110         clear: both;
 111 }
 112
 113 .clearer
 114 {
 115         display: block;
 116         font-size: 0;
 117         line-height: 0;
 118         height: 0;
 119 }
 120
 121 .comment-parent, .comment-single
 122 {
 123         margin-top: 15px;
 124         margin-bottom: 15px;
 125 }
 126
 127 .comment-list ul.children, #comments #respond ul
 128 {
 129         margin: 0 0 0 130px;
 130 }
 131
 132 .comment-list ul.children ul.children
 133 {
 134         margin-left: 15px;
 135 }
 136
 137 .comment-list ul.children li
 138 {
 139         background: url('/css/comment-reply.gif') no-repeat left top;
 140         margin: 0;
 141         padding: 10px 0 0 15px;
 142 }
 143
 144 .comment-list ul.children .comment-body
 145 {
 146         background: #FCFCFC;
 147 }
 148
 149 .comment-author
 150 {
 151         padding-top: 2px;
 152 }
 153
 154 .comment-text p
 155 {
 156         margin-bottom: 0.8em;
 157         padding-left: 4px;
 158 }
 159
 160 .comment .post-date, .comment-author
 161 {
 162         font-size: 0.85em;
 163 }
 164
 165 .comment .post-date .right a
 166 {
 167         color: #BBB;
 168 }
 169
 170 .comment .post-date .right a:hover
 171 {
 172         color: #234;
 173 }
 174
 175 .comment-body
 176 {
 177         border-radius: 0px 10px 10px 10px;
 178         box-shadow: 2px 2px 5px rgba(15,15,15,0.1);
 179         -moz-border-radius: 0px 10px 10px 10px;
 180         -moz-box-shadow: 2px 2px 5px rgba(15,15,15,0.1);
 181         -webkit-border-radius: 0px 10px 10px 10px;
 182         -webkit-box-shadow: 2px 2px 5px rgba(15,15,15,0.1);
 183         background: #FFF;
 184         border: 1px solid #DDD;
 185         padding: 1px 12px 0 3px;
 186 }
 187
 188 .comment-arrow
 189 {
 190         background: url('/css/comment-arrow.gif') no-repeat left top;
 191         display: block;
 192         float: left;
 193         height: 35px;
 194         margin: 15px 0 -45px -23px;
 195         position: absolute;
 196         width: 20px;
 197 }
 198
 199 .comment-list-wrapper
 200 {
 201         border-radius: 15px;
 202         box-shadow: 3px 3px 7px rgba(15,15,15,0.3);
 203         -moz-border-radius: 15px;
 204         -moz-box-shadow: 3px 3px 7px rgba(15,15,15,0.3);
 205         -webkit-border-radius: 15px;
 206         -webkit-box-shadow: 3px 3px 7px rgba(15,15,15,0.3);
 207         background: #F6F6F6;
 208         margin: 10px 0 0;
 209         padding: 5px 12px 10px 7px;
 210 }
 211
 212 .comment-input-text textarea
 213 {
 214         width: 80%;
 215 }
 216
 217 .comment-list
 218 {
 219         margin: 0;
 220         padding: 0;
 221 }
 222
 223 .comment-list li
 224 {
 225         list-style: none;
 226 }
 227
 228 .comment-list ul
 229 {
 230         margin-bottom: 0;
 231 }
 232
 233 .comment-gravatar
 234 {
 235         margin-bottom: 3px;
 236 }
 237
 238 .comment-content-wrapper
 239 {
 240         float: right;
 241         width: 552px;
 242 }
 243 .comment-profile-wrapper
 244 {
 245         text-align: center;
 246         width: 105px;
 247 }
 248
 249 ::selection      {background: rgba(175,175,175,0.4);}
 250 ::-moz-selection {background: rgba(175,175,175,0.4);}
 251
 252 body
 253 {
 254         -webkit-font-smoothing: subpixel-antialiased;
 255         height: 100%;
 256         margin: 0;
 257         padding: 36px 36px 0;
 258         background: #888888;
 259         position: relative;
 260         margin: 0 auto;
 261         width: 696px;
 262 }
 263
 264 /*
 265         2-column, 320 px layout for smartphones
 266         ---------------------------------------
 267         1      2
 268         120px  264px   (24px gutters)
 269 */
 270 @media only screen and (max-width: 767px)
 271 {
 272         body
 273         {
 274                 padding: 18px 18px 0;
 275                 width: 264px;
 276         }
 277         .comment-arrow
 278         {
 279                 margin: 15px 0 -45px -18px;
 280                 width: 15px;
 281         }
 282         .comment-content-wrapper
 283         {
 284                 float: right;
 285                 width: 165px;
 286         }
 287         .comment-profile-wrapper
 288         {
 289                 text-align: center;
 290                 width: 55px;
 291         }
 292         .normal, body
 293         {
 294                 font: normal 67% "Cantrell", sans-serif;
 295         }
 296 }
 297
 298 /*
 299         8-column, 1224 px layout for desktops and laptops
 300         ------------------------------------------------------------------------
 301         1      2      3      4      5      6      7      8
 302         120px  264px  408px  552px  696px  840px  984px  1128px   (24px gutters)
 303 */
 304 @media only screen and (min-width: 1224px)
 305 {
 306         body
 307         {
 308                 padding: 28px 28px 0;
 309                 width: 1128px;
 310         }
 311         .comment-content-wrapper
 312         {
 313                 float: right;
 314                 width: 984px;
 315         }
 316         .comment-profile-wrapper
 317         {
 318                 text-align: center;
 319                 width: 105px;
 320         }
 321         .normal, body
 322         {
 323                 font: normal 80% "Cantrell", sans-serif;
 324         }
 325 }
 326
 327 /*
 328         12-column, 1824 px layout for gigantic screens   (24px gutters)
 329         ---------------------------------------------------------------------------------------
 330         1      2      3      4      5      6      7      8       9       10      11      12
 331         120px  264px  408px  552px  696px  840px  984px  1128px  1272px  1416px  1560px  1704px
 332 */
 333 @media only screen and (min-width: 1824px)
 334 {
 335         body
 336         {
 337                 padding: 48px 48px 0;
 338                 width: 1704px;
 339         }
 340         .comment-content-wrapper
 341         {
 342                 float: right;
 343                 width: 1560px;
 344         }
 345         .comment-profile-wrapper
 346         {
 347                 text-align: center;
 348                 width: 105px;
 349         }
 350         .normal, body
 351         {
 352                 font: normal 90% "Cantrell", sans-serif;
 353         }
 354 }