/* HTML5 RESET */
* {margin:0; padding:0;}
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {margin:0; padding:0; border:0; outline:0; font-size:100%; background:transparent;}
body {line-height:1;}
article,aside,details,figcaption,figure, footer,header,hgroup,menu,nav,section,summary { display:block;}
ol, ul { list-style: none; }
input, select {vertical-align:middle;}
a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; cursor: pointer; }

table {border-collapse: collapse; border-spacing: 0;}
th {font-weight: bold; vertical-align: bottom;}
td {font-weight: normal; vertical-align: top;}

/* BASIC COLORS AND FONTS */
body, select, input, textarea {color: #444;}
body {font: 13px Helmet, Freesans, sans-serif; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; }
a:link {-webkit-tap-highlight-color: #40413d;}
input:-moz-placeholder { color:#a9a9a9; }
textarea:-moz-placeholder { color:#a9a9a9; }

.ascuns {position: relative !important; width:0 !important; height:0 !important; padding:0 !important; margin:0 !important; border:0 none !important; overflow:hidden !important;}

/* IMAGES */
img {vertical-align: bottom;}
img.auto-scale {max-width: 100%; height: auto; }
img.full-width {width:100%; height:auto;}
img.img-left {float: left; margin: 10px 10px 10px 0px;}
img.img-right {float: right; margin: 10px 0px 10px 10px;}

.button.full-width, button.full-width, input[type="submit"].full-width, input[type="reset"].full-width, input[type="button"].full-width {
    width: 100%; padding-left: 0 !important; padding-right: 0 !important; text-align: center;
}

/* CLEAR */
.container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix:before, .clearfix:after, .row:before, .row:after { content: '\0020'; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }
.row:after, .clearfix:after { clear: both; }
.row, .clearfix { zoom: 1; }
.clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0;}

/* GRID */
.container { position: relative; width: 980px; margin: 0 auto; padding: 0; }
.column, .columns, .col, .cols { float: left; display: inline; margin-left: 1%; margin-right: 1%; }
.row { margin-bottom: 10px; }

.one.column, .one.columns, .one.col, .one.cols { width: 3%; }
.two.columns, .two.cols { width: 8%; }
.three.columns, .three.cols { width: 13%; }
.four.columns, .four.cols { width: 18%; }
.five.columns, .five.cols { width: 23%; }
.six.columns, .six.cols { width: 28%; }
.seven.columns, .seven.cols { width: 33%; }
.eight.columns, .eight.cols { width: 38%; }
.nine.columns, .nine.cols { width: 43%; }
.ten.columns, .ten.cols { width: 48%; }
.eleven.columns, .eleven.cols { width: 53%; }
.twelve.columns, .twelve.cols { width: 58%; }
.thirteen.columns, .thirteen.cols { width: 63%; }
.fourteen.columns, .fourteen.cols { width: 68%; }
.fifteen.columns, .fifteen.cols { width: 73%; }
.sixteen.columns, .sixteen.cols { width: 78%; }
.seventeen.columns, .seventeen.cols { width: 83%; }
.eighteen.columns, .eighteen.cols { width: 88%; }
.nineteen.columns, .nineteen.cols { width: 93%; }
.twenty.columns, .twenty.cols { width: 98%; }

.half.column, .half.col {width: 48%}
.one-third.column, .one-third.col {width: 31.3333333333%}
.two-thirds.column, .two-thirds.col {width: 64.6666666667%}

.offset-by-one { padding-left: 5%;  }
.offset-by-two { padding-left: 10%; }
.offset-by-three { padding-left: 15%; }
.offset-by-four { padding-left: 20%; }
.offset-by-five { padding-left: 25%; }
.offset-by-six { padding-left: 30%; }
.offset-by-seven { padding-left: 35%; }
.offset-by-eight { padding-left: 40%; }
.offset-by-nine { padding-left: 45%; }
.offset-by-ten { padding-left: 50%; }
.offset-by-eleven { padding-left: 55%; }
.offset-by-twelve { padding-left: 60%; }
.offset-by-thirteen { padding-left: 65%; }
.offset-by-fourteen { padding-left: 70%; }
.offset-by-fifteen { padding-left: 75%; }
.offset-by-sixteen { padding-left: 80%; }
.offset-by-seventeen { padding-left: 85%; }
.offset-by-eighteen { padding-left: 90%; }
.offset-by-nineteen { padding-left: 95%; }

.cs, .css { float: left; display: inline; margin-left: 0.2%; margin-right: 0.2%; }

.one.cs, .one.css { width: 4.60%; }
.two.css { width: 9.6%; }
.three.css { width: 14.6%; }
.four.css { width: 19.6%; }
.five.css { width: 24.6%; }
.six.css { width: 29.6%; }
.seven.css { width: 34.6%; }
.eight.css { width: 39.6%; }
.nine.css { width: 44.6%; }
.ten.css { width: 49.6%; }
.eleven.css { width: 54.6%; }
.twelve.css { width: 59.6%; }
.thirteen.css { width: 64.6%; }
.fourteen.css { width: 69.6%; }
.fifteen.css { width: 74.6%; }
.sixteen.css { width: 79.6%; }
.seventeen.css { width: 84.6%; }
.eighteen.css { width: 89.6%; }
.nineteen.css { width: 94.6%; }
.twenty.css { width: 99.6%; }

.half.cs {width: 49.6%}
.one-third.cs {width: 32.9333333333%}
.two-thirds.cs {width: 66.2666666667%}

.css.offset-by-one { padding-left: 5%;  }
.css.offset-by-two { padding-left: 10%; }
.css.offset-by-three { padding-left: 15%; }
.css.offset-by-four { padding-left: 20%; }
.css.offset-by-five { padding-left: 25%; }
.css.offset-by-six { padding-left: 30%; }
.css.offset-by-seven { padding-left: 35%; }
.css.offset-by-eight { padding-left: 40%; }
.css.offset-by-nine { padding-left: 45%; }
.css.offset-by-ten { padding-left: 50%; }
.css.offset-by-eleven { padding-left: 55%; }
.css.offset-by-twelve { padding-left: 60%; }
.css.offset-by-thirteen { padding-left: 65%; }
.css.offset-by-fourteen { padding-left: 70%; }
.css.offset-by-fifteen { padding-left: 75%; }
.css.offset-by-sixteen { padding-left: 80%; }
.css.offset-by-seventeen { padding-left: 85%; }
.css.offset-by-eighteen { padding-left: 90%; }
.css.offset-by-nineteen { padding-left: 95%; }

@media only screen and (min-width: 768px) and (max-width: 959px) {
    .container { width: 100%; }
}

@media only screen and (max-width: 767px) {
    .container { position: relative; width: 100%; margin: 0 auto; padding: 0; }
    .column, .columns, .cs, .css { margin: 5px 3%;}
    .one.column, .one.columns, .one-third.column, .two-thirds.column, .two.columns, .three.columns, .four.columns, .five.columns, .six.columns, .seven.columns, .eight.columns, .nine.columns, .ten.columns, .eleven.columns, .twelve.columns, .thirteen.columns, .fourteen.columns, .fifteen.columns, .sixteen.columns, .seventeen.columns, .eighteen.columns, .nineteen.columns, .twenty.columns{ width: 94%; }
    .one.cs, .one.css, .one-third.cs, .two-thirds.cs, .two.css, .three.css, .four.css, .five.css, .six.css, .seven.css, .eight.css, .nine.css, .ten.css, .eleven.css, .twelve.css, .thirteen.css, .fourteen.css, .fifteen.css, .sixteen.css, .seventeen.css, .eighteen.css, .nineteen.css, .twenty.css{ width: 94%; }
    .offset-by-one, .offset-by-two, .offset-by-three, .offset-by-four, .offset-by-five, .offset-by-six, .offset-by-seven, .offset-by-eight, .offset-by-nine, .offset-by-ten, .offset-by-eleven, .offset-by-twelve, .offset-by-thirteen, .offset-by-fourteen, .offset-by-fifteen, .offset-by-sixteen, .offset-by-seventeen, .offset-by-eighteen, .offset-by-nineteen { padding-left: 0; }
}

@media only screen and (min-width: 1230px) {
    .container { width: 1230px; }
    .container.sh { border: 1px solid #c4c4c4; border-top: none; -webkit-box-shadow: 0 1px 10px rgba(0,0,0,0.3); -moz-box-shadow: 0 1px 10px rgba(0,0,0,0.3); box-shadow: 0 1px 10px rgba(0,0,0,0.3); }
}
