css/blog-old-ie.css

   1 * {
   2     -webkit-box-sizing: border-box;
   3     -moz-box-sizing: border-box;
   4     box-sizing: border-box;
   5 }
   6
   7 a {
   8     text-decoration: none;
   9     color: rgb(61, 146, 201);
  10 }
  11
  12 a:hover,
  13 a:focus {
  14     text-decoration: underline;
  15 }
  16
  17 h3 {
  18     font-weight: 100;
  19 }
  20
  21 /* LAYOUT CSS */
  22
  23 .pure-img-responsive {
  24     max-width: 100%;
  25     height: auto;
  26 }
  27
  28 #layout {
  29     padding: 0;
  30 }
  31
  32 .header {
  33     text-align: center;
  34     top: auto;
  35     margin: 3em auto;
  36 }
  37
  38 .sidebar {
  39     background: rgb(61, 79, 93);
  40     color: #fff;
  41 }
  42
  43 .brand-title,
  44 .brand-tagline {
  45     margin: 0;
  46 }
  47
  48 .brand-title {
  49     text-transform: uppercase;
  50 }
  51
  52 .brand-tagline {
  53     font-weight: 300;
  54     color: rgb(176, 202, 219);
  55 }
  56
  57 .nav-list {
  58     margin: 0;
  59     padding: 0;
  60     list-style: none;
  61 }
  62
  63 .nav-item {
  64     display: inline-block;
  65     *display: inline;
  66     zoom: 1;
  67 }
  68
  69 .nav-item a {
  70     background: transparent;
  71     border: 2px solid rgb(176, 202, 219);
  72     color: #fff;
  73     margin-top: 1em;
  74     letter-spacing: 0.05em;
  75     text-transform: uppercase;
  76     font-size: 85%;
  77 }
  78
  79 .nav-item a:hover,
  80 .nav-item a:focus {
  81     border: 2px solid rgb(61, 146, 201);
  82     text-decoration: none;
  83 }
  84
  85 .content-subhead {
  86     text-transform: uppercase;
  87     color: #aaa;
  88     border-bottom: 1px solid #eee;
  89     padding: 0.4em 0;
  90     font-size: 80%;
  91     font-weight: 500;
  92     letter-spacing: 0.1em;
  93 }
  94
  95 .content {
  96     padding: 2em 1em 0;
  97 }
  98
  99 .post {
 100     padding-bottom: 2em;
 101 }
 102
 103 .post-title {
 104     font-size: 2em;
 105     color: #222;
 106     margin-bottom: 0.2em;
 107 }
 108
 109 .post-avatar {
 110     border-radius: 50px;
 111     float: right;
 112     margin-left: 1em;
 113 }
 114
 115 .post-description {
 116     font-family: Georgia, "Cambria", serif;
 117     color: #444;
 118     line-height: 1.8em;
 119 }
 120
 121 .post-meta {
 122     color: #999;
 123     font-size: 90%;
 124     margin: 0;
 125 }
 126
 127 .post-category {
 128     margin: 0 0.1em;
 129     padding: 0.3em 1em;
 130     color: #fff;
 131     background: #999;
 132     font-size: 80%;
 133 }
 134
 135 .post-category-design {
 136     background: #5aba59;
 137 }
 138
 139 .post-category-pure {
 140     background: #4d85d1;
 141 }
 142
 143 .post-category-yui {
 144     background: #8156a7;
 145 }
 146
 147 .post-category-js {
 148     background: #df2d4f;
 149 }
 150
 151 .post-images {
 152     margin: 1em 0;
 153 }
 154
 155 .post-image-meta {
 156     margin-top: -3.5em;
 157     margin-left: 1em;
 158     color: #fff;
 159     text-shadow: 0 1px 1px #333;
 160 }
 161
 162 .footer {
 163     text-align: center;
 164     padding: 1em 0;
 165 }
 166
 167 .footer a {
 168     color: #ccc;
 169     font-size: 80%;
 170 }
 171
 172 .footer .pure-menu a:hover,
 173 .footer .pure-menu a:focus {
 174     background: none;
 175 }
 176
 177 .content {
 178     padding: 2em 3em 0;
 179     margin-left: 25%;
 180 }
 181
 182 .header {
 183     margin: 80% 2em 0;
 184     text-align: right;
 185 }
 186
 187 .sidebar {
 188     position: fixed;
 189     top: 0;
 190     bottom: 0;
 191 }