/* 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 {color: #03f;}
a:hover {color: #69f;}
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: 100%; 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%; }

@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 { 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%; }
.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; }
}