/*
	
	DO NOT EDIT THIS FILE unless you know what you are doing. 
*/
/*---------------------------------
	GRID/COLUMNS
-----------------------------------
	tinyfluidgrid.com
	& girlfriendnyc.com
	with changes by Naho Nakashima
-----------------------------------*/
 
.grid{
margin:0 auto;
padding:0 7%;
}

.full{
width:100%;
margin:0;

}

.row{
display:block;
overflow:hidden;

}

*[class*="col_"].alpha{margin-left:0; }
*[class*="col_"].omega{margin-right:0; }
 
.col_1  { width: 6.6666666666667%; }
.col_2  { width: 15%; }
.col_3  { width: 23.333333333333%;  }
.col_4  { width: 31.666666666667%; }
.col_5  { width: 40%; }
.col_6  { width: 48.333333333333%; }
.col_7  { width: 56.666666666667%; }
.col_8  { width: 65%; }
.col_9  { width: 73.333333333333%;}
.col_10 { width: 81.666666666667%; }
.col_11 { width: 90%; }
.col_12 { width: 98.333333333333%;  }
.fullcol {
   width: 98.333333333333%;
   margin:0 auto;
clear:both;

}
   /* .fullcol img {
        width: 100%;
    }*/


*[class*="col_"]{
margin-left: 0.83333333333333%;
margin-right: 0.83333333333333%;
margin-top:0.5em;
margin-bottom:0.5em;
float: left;
display: block;
}

#header *[class*="col_"], #footer *[class*="col_"] {
    padding: 0 ;

}

.grid img{
max-width: 100%;
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. 
*/
.visible *[class*="col_"]{border:solid 1px lime;

}


/*---------------------------------
	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: 1025px)  {
	.grid *[class*="col_"],  .full *[class*="col_"]{}
	.grid{}
    #page-wrap{
    font-size:14px;
    line-height:1.5em;
    max-width:1400px;
}
}

@media all and (min-width: 761px) and (max-width: 1024px) {
	.grid {
        padding: 0 1%;
    }
	
	.grid *[class*="col_"] [class*="col_"], .full *[class*="col_"] [class*="col_"]{
	margin-left:0;
	margin-right:0;

	}
     #page-wrap{
    font-size:13px;
    line-height:1.5em;
}
}


@media all and (min-width: 480px) and (max-width: 760px) {
    .grid {
        padding: 0 1%;
    }

	.grid *[class*="col_"], .full *[class*="col_"] {
	float:none;
	width:auto;
	clear:both;
	display:block;
	}
	/* columns inside of columns */
	.grid *[class*="col_"] [class*="col_"], .full *[class*="col_"] [class*="col_"]{
	margin-left:0;
	margin-right:0;
	width:100%;
	}
     #page-wrap{
    font-size:12px;
    line-height:1.5em;
}
}

@media all and (max-width: 479px) {
    .grid {
        padding: 0 1%;
    }
	.grid *[class*="col_"],.full *[class*="col_"]{
	float:none;
	width:auto;
	clear:both;
	display:block;
 
	}
	/* columns inside of columns */
	.grid *[class*="col_"] [class*="col_"], .full *[class*="col_"] [class*="col_"]{
	margin-left:0;
	margin-right:0;
	width:100%;
	}
     #page-wrap{
    font-size:11px;
    line-height:1.5em;
}

}