@import url("fonts.css");
@import url("font-awesome/css/font-awesome.min.css");


footer,  {
   margin: 0;
   padding: 0;
   border: 0;
   outline: 0;
   font-size: 100%;
   vertical-align: baseline;
   background: transparent;
}


footer {
   display: block;
}


/* 1. Basico  ------------------------------------------------------- */

*,
*:before,
*:after {
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
}

/*  2. Listas  --------------------------------------------------------- */

ul, ol { margin-bottom: 24px; margin-top: 12px; }
ul { list-style: none  }
ol { list-style: decimal; }
ol, ul.square, ul.circle, ul.disc { margin-left: 17px; }
ul.square { list-style: square }
ul.circle { list-style: circle }
ul.disc { list-style: disc }
ul li { padding-left: 4px; }
ul.large li { }
li p { }
ul ul, ul ol,
ol ol, ol ul { margin: 6px 0 6px 17px; }
ul ul li, ul ol li,
ol ol li, ol ul li { }


/* default
--------------------------------------------------------------- */
.row {
   width: 94%;
   max-width: 1008px;
   margin: 0 auto;
}
/* fixed width for IE8 */
.ie .row { width: 1000px; }

.narrow .row { max-width: 980px; }

.row .row { 
	width: auto; 
	max-width: none; 
	margin: 0 -18px; 
}

/* row clearing */
.row:before,
.row:after {
    content: " ";
    display: table;
}
.row:after { clear: both; }


/* column widths */
.one, .row .one        { width: 8.33333%; }
.two, .row .two        { width: 16.66667%; }
.three, .row .three    { width: 25%; }
.four, .row .four      { width: 33.33333%; }
.five, .row .five      { width: 41.66667%; }
.six, .row .six        { width: 50%; }
.seven, .row .seven    { width: 58.33333%; }
.eight, .row .eight    { width: 66.66667%; }
.nine, .row .nine      { width: 75%; }
.ten .row .ten         { width: 83.33333%; }
.eleven, .row .eleven  { width: 91.66667%; }
.twelve, .row .twelve  { width: 100%; }

/* Left clearing for block grid columns - columns that changes width in
different screen sizes. Allows columns with different heights to align
properly.
--------------------------------------------------------------------- */
.first { clear: left; }   /* first column in default screen */
.s-first { clear: none; } /* first column in smaller screens */

/* smaller screens
--------------------------------------------------------------- */
@media only screen and (max-width: 900px) {

   /* block grids on small screens */
   .s-bgrid-sixths [class*="column"]   { width: 16.66667%; }
   .s-bgrid-quarters [class*="column"] { width: 25%; }
   .s-bgrid-thirds [class*="column"]   { width: 33.33333%; }
   .s-bgrid-halves [class*="column"]   { width: 50%; }

   /* block grids left clearing */
   .first { clear: none; }
   .s-first { clear: left; }

}

/* screenwidth less than 768px - mobile/smaller tablets
--------------------------------------------------------------- */
@media only screen and (max-width: 767px) {

   .row {
	   width: 480px;
	   margin: 0 auto;
      padding: 0;
	}
   .column, .columns {
	   width: auto !important;      
	   float: none;
	   margin-left: 0;
	   margin-right: 0;
      padding: 0 30px;
   }
   .row .row { 
   	width: auto; 
   	max-width: none; 
   	margin: 0 -30px; 
   }

/* screenwidth less than or equal 480px - mobile wide
--------------------------------------------------------------- */
@media only screen and (max-width: 480px) {

   .row { width: auto; }

}

/* larger screens
--------------------------------------------------------------- */
@media screen and (min-width: 1200px) {

   .wide .row { max-width: 1180px; }

}