/*
##########################################
# THIS IS MAIN TITLE 
##########################################
gr-main = Grid main box
gr-bd = Grid counting box
gr-b = Grid box
gr-in = Grid inner box
gutter = Space between to grid
*/
.gr-main{ /*overflow:hidden;*/ min-height:1px; }
.gr-bd 	{ /*overflow:hidden;*/ min-height:1px; }
.gr-b 	{ float:left; margin-bottom:1px; min-height:1px; }
.gr-bd .hr-line { height:15px; }
.gr-in {  }
/*
******************************************
* GRIDS
******************************************
*/
.gr-2 .gr-b { width:50%; }
.gr-3 .gr-b { width:33.30%; }
.gr-4 .gr-b { width:24.98%; }
.gr-5 .gr-b { width:20%; }
.gr-6 .gr-b { width:16.66%; }
.gr-7 .gr-b { width:14.28%; }/*bug in IE6*/
.gr-8 .gr-b { width:12.5%; }
.gr-9 .gr-b { width:11.11%; }
.gr-10 .gr-b { width:10%; }
/*
******************************************
*CUSTOM GRIDS
******************************************
*/
.gr-cus-typ1 .gr-b-l{width:70%;}
.gr-cus-typ1 .gr-b-r{width:30%;}

.gr-cus-typ2 .gr-b-l{width:25%;}
.gr-cus-typ2 .gr-b-r{width:50%;}

/* 
GRID GUTTER
==========================================*/
.gutter-1 { margin-left:-1px; }
.gutter-1 .gr-in { margin-left:1px; }

.gutter-2 { margin-left:-2px; }
.gutter-2 .gr-in { margin-left:2px; }

.gutter-10 { margin-left:-10px; }
.gutter-10 .gr-in { margin-left:10px; }

.gutter-15 { margin-left:-15px; }
.gutter-15 .gr-in { margin-left:15px; }

.gutter-20 { margin-left:-20px; }
.gutter-20 .gr-in { margin-left:20px; }

.gutter-25 { margin-left:-25px; }
.gutter-25 .gr-in { margin-left:25px; }

.gutter-30 { margin-left:-30px; }
.gutter-30 .gr-in { margin-left:30px; }

.gutter-40 { margin-left:-40px; }
.gutter-40 .gr-in { margin-left:40px; }

.gutter-50 { margin-left:-50px; }
.gutter-50 .gr-in { margin-left:50px; }