DESCRIPTION

basic.css is a css file for fast web development,supposed to work withnormalize.css

Now,the source code

@charset "utf-8";
/* basic.css 
* by ZHAO Xudong,zxdong@gmail.com
* /html5/basic-css/
supposed to work with normalize.css
* for fast web development
* all lower case
*/
/* float */
.fleft {
 float:left;
}
.fright {
 float:right;
}
.alignleft {
 text-align:left;
}
.alignright {
 text-align:right;
}
.aligncenter {
 text-align:center;
}
/* clear */
.clear {
 clear:both;
}
.clear-left {
 clear:left;
}
.clear-right {
 clear:right;
}
/* layout */
.centered {
 width:1000px;
 margin-left:auto;
 margin-right:auto;
 position:relative;
}
/* Image replacement */
.ir {
  border: 0;
  font: 0/0 a;
  text-shadow: none;
  color: transparent;
  background-color: transparent;
}
/* padding */
.sep {
 height:10px;
}
.padding {
 padding:10px;
}
.paddinglr {
 padding-left:10px;
 padding-right:10px;
}
.paddingtb {
 padding-top:10px;
 padding-bottom:10px;
}
.paddingl {
 padding-left:10px;
}
.paddingr {
 padding-right:10px;
}
.paddingt {
 padding-top:10px;
}
.paddingb {
 padding-bottom:10px;
}
/* border */
.border {
 border:1px solid #666;
}
.bordert {
 border-top:1px solid #666;
}
.borderb {
 border-bottom:1px solid #666;
}
.borderl {
 border-left:1px solid #666;
}
.borderr {
 border-right:1px solid #666;
}
/* box shadow */
.box-shadow {
 box-shadow:0 3px 3px rgba(0,0,0,.4);
}
/* text color */
.color-red {
 color:#c00;
}
.color-green {
 color:#060;
}
.color-yellow {
 color:#ff0;
}
.color-black {
 color:#000;
}
.color-white {
 color:#fff;
}
.color-grey {
 color:#888;
}
/* text-shadow */
.text-shadow {
 text-shadow:0 0 1px rgba(0,0,0,.4);
}
/* font */
.bold {
 font-weight:bold;
}
/* btn */
.btn {
 display:inline-block;
 vertical-align:top;
 line-height:2em;
 font-size:1em;
 padding:0 2em;
 cursor:pointer;
 border-radius:4px;
 text-decoration:none;
 text-shadow:0 1px 0 rgba(0,0,0,.3);
}
/* 
* btn color 
* from http://nicolasgallagher.com/pure-css-speech-bubbles/demo/ 
*/
.btn-green {
 color:#eee;
 background:#5a8f00; 
 background:-webkit-gradient(linear, 0 0, 0 100%, from(#b8db29), to(#5a8f00));
 background:-moz-linear-gradient(#b8db29, #5a8f00);
 background:-o-linear-gradient(#b8db29, #5a8f00);
 background:linear-gradient(#b8db29, #5a8f00);
}
.btn-green:hover {
 color:#eee;
 background:#b8db29; 
 background:-webkit-gradient(linear, 0 0, 0 100%, from(#5a8f00), to(#b8db29));
 background:-moz-linear-gradient(#5a8f00, #b8db29);
 background:-o-linear-gradient(#5a8f00, #b8db29);
 background:linear-gradient(#5a8f00, #b8db29);
}
.btn-primarylue {
 color:#eee;
 background:#075698;
 background:-webkit-gradient(linear, 0 0, 0 100%, from(#2e88c4), to(#075698));
 background:-moz-linear-gradient(#2e88c4, #075698);
 background:-o-linear-gradient(#2e88c4, #075698);
 background:linear-gradient(#2e88c4, #075698);
}
.btn-primarylue:hover {
 color:#eee;
 background:#2e88c4; 
 background:-webkit-gradient(linear, 0 0, 0 100%, from(#075698), to(#2e88c4));
 background:-moz-linear-gradient(#075698, #2e88c4);
 background:-o-linear-gradient(#075698, #2e88c4);
 background:linear-gradient(#075698, #2e88c4);
}
.btn-red {
 color:#eee;
 background:#c81e2b;
 background:-webkit-gradient(linear, 0 0, 0 100%, from(#f04349), to(#c81e2b));
 background:-moz-linear-gradient(#f04349, #c81e2b);
 background:-o-linear-gradient(#f04349, #c81e2b);
 background:linear-gradient(#f04349, #c81e2b);
}
.btn-red:hover {
 color:#eee;
 background:#f04349;
 background:-webkit-gradient(linear, 0 0, 0 100%, from(#c81e2b), to(#f04349));
 background:-moz-linear-gradient(#c81e2b, #f04349);
 background:-o-linear-gradient(#c81e2b, #f04349);
 background:linear-gradient(#c81e2b, #f04349);
}
.btn-orange {
 color:#fff;
 text-shadow:none;
 background:#f3961c; 
  background:-webkit-gradient(linear, 0 0, 0 100%, from(#f9d835), to(#f3961c));
 background:-moz-linear-gradient(#f9d835, #f3961c);
 background:-o-linear-gradient(#f9d835, #f3961c);
 background:linear-gradient(#f9d835, #f3961c);
}
.btn-orange:hover {
 color:#222;
 background:#f9d835; 
  background:-webkit-gradient(linear, 0 0, 0 100%, from(#f3961c), to(#f9d835));
 background:-moz-linear-gradient(#f3961c, #f9d835);
 background:-o-linear-gradient(#f3961c, #f9d835);
 background:linear-gradient(#f3961c, #f9d835);
}
.btn-primarylack {
 color:#eee;
 background:#555; 
  background:-webkit-gradient(linear, 0 0, 0 100%, from(#333), to(#555));
 background:-moz-linear-gradient(#333, #555);
 background:-o-linear-gradient(#333, #555);
 background:linear-gradient(#333, #555);
}
.btn-primarylack:hover {
 color:#fff;
 background:#333; 
  background:-webkit-gradient(linear, 0 0, 0 100%, from(#555), to(#333));
 background:-moz-linear-gradient(#555, #333);
 background:-o-linear-gradient(#555, #333);
 background:linear-gradient(#555, #333);
}
.btn-grey {
 color:#333;
 background:#ccc; 
  background:-webkit-gradient(linear, 0 0, 0 100%, from(#999), to(#ccc));
 background:-moz-linear-gradient(#999, #ccc);
 background:-o-linear-gradient(#999, #ccc);
 background:linear-gradient(#999, #ccc);
}
.btn-grey:hover {
 color:#111;
 background:#999; 
  background:-webkit-gradient(linear, 0 0, 0 100%, from(#ccc), to(#999));
 background:-moz-linear-gradient(#ccc, #999);
 background:-o-linear-gradient(#ccc, #999);
 background:linear-gradient(#ccc, #999);
}
/* font size */
.font24 {
 font-size:2.4em;
}
.font20 {
 font-size:2em;
}
.font18 {
 font-size:1.8em;
}
.font16 {
 font-size:1.6em;
}
.font12 {
 font-size:1.2em;
}
.font9 {
 font-size:.9em;
}
.font8 {
 font-size:.8em;
}
.font7 {
 font-size:.7em;
}
.font6 {
 font-size:.6em;
}
/* display */
.iblock {
 display:inline-block;
 vertical-align:top;
}
.block {
 display:block;
}
.hide {
 display:none;
}
.hidden {
 visibility:hidden;
}