/*
99Lime.com HTML KickStart by Joshua Gatcke kickstart-grids.css
DO NOT EDIT THIS FILE unless you know what you are doing.
*/
/*---------------------------------
GRID/COLUMNS
-----------------------------------
tinyfluidgrid.com & girlfriendnyc.com with changes by 99Lime
-----------------------------------*/
.grid{
max-width:100% !Important;
margin:0 auto;
padding:0;
}
.row{
display:block;
overflow:hidden;
clear:both;
}
*[class*="col_"].alpha{margin-left:10px;}
*[class*="col_"].omega{margin-right:10px;}
.col_1 { width: 100%; }
.col_1p { width: 80%; padding-left: 10%; padding-right: 10%; }
.col_2 { width: 49.8%; }
.col_2p { width: 45.99%; padding: 2%; }
.col_2e { width: 48%; padding-left: 2%; }
.col_2d { width: 45.99%; padding-right: 2%; }
.col_2ed { width: 45.99%; padding-right: 2%; padding-left: 2%; }
.col_3 { width: 33.33333333333333%; }
.col_3p { width: 29.3%; padding: 2%; }
.col_3m { width: 29.3%; margin: 2%; }
.col_3 { width: 33.33333333333333%; }
.col_3 { width: 33.33333333333333%; }
.col_4 { width: 25%; }
.col_4p { width: 21.0%; padding: 2%; }
.col_4m { width: 21.0%; margin: 2%; }
.col_5 { width: 20%; }
.col_5p { width: 16%; padding: 2%; }
.col_6 { width: 16.66666666666667%; }
.col_7 { width: 14.28571428571429%; }
.col_8 { width: 12.5%; }
.col_9 { width: 11.11111111111111%; }
.col_10 { width: 10%; }
.col_11 { width: 9.090909090909091%; }
.col_12 { width: 8.333333333333333%; }
.col__1 { width: 1%; }
.col__2 { width: 1.5%; }
.col__3 { width: 2.5%; }
.col__4 { width: 3.5%; }
.col__5 { width: 4.5%; }
.col__10 { width: 9.5%; }
.col__15 { width: 14.5%; }
.col__20 { width: 20%; }
.col__25 { width: 25%; }
.col__30 { width: 30%; }
.col__35 { width: 35%; }
.col__37 { width: 37%; }
.col__40 { width: 39%; }
.col__45 { width: 44%; }
.col__50 { width: 49%; }
.col__55 { width: 55%; }
.col__60 { width: 60%; }
.col__65 { width: 65%; }
.col__70 { width: 70%; }
.col__75 { width: 75%; }
.col__80 { width: 80%; }
.col__85 { width: 85%; }
.col__90 { width: 90%; }
.col__95 { width: 95%; }
*[class*="col_"]{
margin-left: 0;
margin-right: 0;
margin-top:0;
margin-bottom:0;
float: left;
display: block;
}
.grid img{
max-width: 100% !Important;
height:auto;
}
.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}
.clearfix:after{clear:both;content:' ';display:block;font-size:0;line-height:0;visibility:hidden;width:0;height:0}
* html .clearfix, *:first-child+html .clearfix{zoom:1}
/* Viewable Grids
To view your grids, add the class .visible to any grid container.
This will add a background color so you can see the layout of your grids.
*/
*[class*="col_"].visible{
border:1px solid #ccc;
}
.visivel{
border:1px solid #646473;
margin: -2px;
}
.margem{
margin: 2%;
}
.margem10{
margin: 10%;
}
.margem20{
margin: 20%;
}
.margem_esq20{
margin-left: 20%;
}
.margem_esq10{
margin-left: 10%;
}
.margem_dir20{
margin-right: 20%;
}
.margem_dir10{
margin-right: 10%;
}
.espaco{
padding: 2%;
}
.espaco10{
padding: 10%;
}
.espaco16{
padding: 16%;
}
.espaco20{
padding: 20%;
}
.espaco_esq20{
padding-left: 20%;
}
.espaco_esq16{
padding-left: 16%;
}
.espaco_esq10{
padding-left: 10%;
}
.espaco_dir20{
padding-right: 20%;
}
.espaco_dir16{
padding-right: 16%;
}
.espaco_dir10{
padding-right: 10%;
}
.bg_gda{
background: linear-gradient(170deg, #02aed1 0%,#12293a 100%); color:#fff;
}
.bg_gdac{
background: linear-gradient(180deg, #02aed1 0%,#c5dced 100%); color:#fff;
}
.bg_gdv{
background: linear-gradient(170deg, #b4e7c9 0%,#1e442e 100%); color:#fff;
}
.bg_cinza{
background-color: #dddddd;
}
.bg_cinza_c{
background-color: #e8eaea;
}
.bg_cinza_e{
background-color: #767a7c;
}
.bg_azul{
background-color: #66a8cc;
}
.bg_azul_m{
background-color: #84b0e8;
}
.bg_azul_c{
background-color: #cad3ff;
}
.bg_azul_e{
background-color: #1e415b; color:#fff;
}
.bg_verde{
background-color: #b9e1ca;
}
.bg_verde_c{
background-color: #d2ecdd;
}
.bg_verde_e{
background-color: #112218; color:#fff;
}
.br50{
border-radius: 50%;
}
.br20{
border-radius: 20px;
}
.br10{
border-radius: 10px;
}
.br6{
border-radius: 6px;
}
div.sombra {
box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1), 0 6px 20px 0 rgba(0, 0, 0, 1.3);
}
}
.90 {
width:90%;
height:auto%;
}
.tramparente {
opacity: 1.0;
}
.tramparente:hover {
opacity: 0.8;
}
.centro{
text-align: center;
}
.dir{
text-align: right;
}
.dir24{
text-align: right; padding-right:24px;
}
.esq24{
text-align: left; padding-left:24px;
}
.z{
z-index: 90;
}
/*---------------------------------
Responsive Grid Media Queries - 1280, 1024, 768, 480
1280-1024 - desktop (default grid)
1024-768 - tablet landscape
768-480 - tablet
480-less - phone landscape & smaller
-----------------------------------*/
@media all and (min-width: 1024px) and (max-width: 1280px) {
.grid *[class*="col_"]{}
.grid{max-width: 100%;}
.show-desktop {display:block;}
.hide-desktop {display:none;}
.show-tablet {display:none;}
.hide-tablet {display:block;}
.show-phone {display:none;}
.hide-phone {display:block;}
}
@media all and (min-width: 768px) and (max-width: 1024px) {
.grid *[class*="col_"]{}
.grid{max-width: 100%;}
.show-desktop {display:none;}
.hide-desktop {display:block;}
.show-tablet {display:block;}
.hide-tablet {display:none;}
.show-phone {display:none;}
.hide-phone {display:block;}
.espaco_esq20{
padding-left: 4%;
}
.espaco_esq10{
padding-left: 2%;
}
.espaco_dir20{
padding-right: 4%;
}
.espaco_dir10{
padding-right: 2%;
}
.espaco10{
padding: 2%;
}
.espaco20{
padding: 4%;
}
}
@media all and (min-width: 480px) and (max-width: 768px) {
.grid *[class*="col_"]{
float:none;
width:auto;
clear:both;
display:block;
}
/* columns inside of columns */
.grid *[class*="col_"] [class*="col_"]{
margin-left:0;
margin-right:0;
width:100%;
}
.grid {max-width: 100%;}
.show-desktop {display:none;}
.hide-desktop {display:block;}
.show-tablet {display:block;}
.hide-tablet {display:none;}
.show-phone {display:none;}
.hide-phone {display:block;}
.espaco_esq20{
padding-left: 4%;
}
.espaco_esq10{
padding-left: 2%;
}
.espaco_dir20{
padding-right: 4%;
}
.espaco_dir10{
padding-right: 2%;
}
.espaco10{
padding: 2%;
}
.espaco20{
padding: 4%;
}
}
@media all and (max-width: 480px) {
.grid *[class*="col_"]{
float:none;
width:auto;
clear:both;
display:block;
}
/* columns inside of columns */
.grid *[class*="col_"] [class*="col_"]{
margin-left:0;
margin-right:0;
width:100%;
}
.grid {max-width: 100%;/*320*/}
.show-desktop {display:none;}
.hide-desktop {display:block;}
.show-tablet {display:none;}
.hide-tablet {display:block;}
.show-phone {display:block;}
.hide-phone {display:none;}
.espaco_esq20{
padding-left: 2%;
}
.espaco_esq10{
padding-left: 1%;
}
.espaco_dir20{
padding-right: 2%;
}
.espaco_dir10{
padding-right: 1%;
}
}