/* 
== GENERAL ====================================================================================

- NORTHLANDCOLLEGE.EDU
- GLOBAL GRIDS
- Created by: Northland Community and Technical College

== NOTES ======================================================================================

- Use for global content grid layouts


== UPDATE INFO ================================================================================

Last updated: 06/24/2011
Last update by: Chad Sperling


== TABLE OF CONTENTS ==========================================================================

01: GRID RESETS
02: GRID TYPES (full or float)
03: FLOAT GRID
04: FULL GRID

============================================================================================== */


/*
###########################################################################################################################################
###########################################################################################################################################
	
	01: GRID RESETS
	
###########################################################################################################################################
###########################################################################################################################################*/

/* GRID RESETS - Clearfix
---------------------------------------------------------------------------------------------------------- */ 
.clearfix:after {
	clear: both;
	content:' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;}
.clearfix { display: inline-block;}
* html .clearfix { height: 1%;}
.clearfix {display: block;}



/*
###########################################################################################################################################
###########################################################################################################################################
	
	02: NEW!!! GRID STRUCTURE 2.0 (9/27/2012)
	
###########################################################################################################################################
###########################################################################################################################################*/

/* GRID LAYOUT - Padded980 - 28 Columns ~ Margin left: 15px ~ Margin right: 15px
---------------------------------------------------------------------------------------------------------- */ 
.GRID-Padded980 				{ overflow: hidden; margin:0px; padding-top: 15px; padding-bottom: 15px;}

.GRID-Padded980 .column 		{ margin: 0 15px 0 15px; overflow: visible; float: left; display: inline;}
.GRID-Padded980 .row 			{ width: 980px; margin: 0 auto; overflow: visible;}
.GRID-Padded980 .row.FullWidth 	{ margin: 0 -15px 0 -15px; width: auto; display: inline-block;}

.GRID-Padded980 .grid-1 		{ width: 5px;}
.GRID-Padded980 .grid-2 		{ width: 40px;}
.GRID-Padded980 .grid-3 		{ width: 75px;}
.GRID-Padded980 .grid-4 		{ width: 110px;}
.GRID-Padded980 .grid-5 		{ width: 145px;}
.GRID-Padded980 .grid-6 		{ width: 180px;}
.GRID-Padded980 .grid-7 		{ width: 215px;}
.GRID-Padded980 .grid-8 		{ width: 250px;}
.GRID-Padded980 .grid-9 		{ width: 285px;}
.GRID-Padded980 .grid-10 		{ width: 320px;}
.GRID-Padded980 .grid-11 		{ width: 355px;}
.GRID-Padded980 .grid-12 		{ width: 390px;}
.GRID-Padded980 .grid-13 		{ width: 425px;}
.GRID-Padded980 .grid-14 		{ width: 460px;}
.GRID-Padded980 .grid-15 		{ width: 495px;}
.GRID-Padded980 .grid-16 		{ width: 530px;}
.GRID-Padded980 .grid-17 		{ width: 565px;}
.GRID-Padded980 .grid-18 		{ width: 600px;}
.GRID-Padded980 .grid-19 		{ width: 635px;}
.GRID-Padded980 .grid-20 		{ width: 670px;}
.GRID-Padded980 .grid-21 		{ width: 705px;}
.GRID-Padded980 .grid-22 		{ width: 740px;}
.GRID-Padded980 .grid-23 		{ width: 775px;}
.GRID-Padded980 .grid-24 		{ width: 810px;}
.GRID-Padded980 .grid-25 		{ width: 845px;}
.GRID-Padded980 .grid-26 		{ width: 880px;}
.GRID-Padded980 .grid-27 		{ width: 915px;}
.GRID-Padded980 .grid-28 		{ width: 950px;}
.GRID-Padded980 .grid-980		{ width: 980px;}


/* GRID LAYOUT - FullWidth980
---------------------------------------------------------------------------------------------------------- */ 





/*
###########################################################################################################################################
###########################################################################################################################################
	
	01: CONTENT(colMain) GRIDS
	
###########################################################################################################################################
###########################################################################################################################################
*/

/* CONTENT(colMain) GRIDS - Full (982 px)
---------------------------------------------------------------------------------------------------------- 
.row {position:relative; margin-left:-20px;}

.GRID-1 .row {width: 37px;}
.GRID-2 .row {width: 74px;}
.GRID-3 .row {width: 111px;}
.GRID-4 .row {width: 148px;}
.GRID-5 .row {width: 185px;}
.GRID-6 .row {width: 222px;}
.GRID-7 .row {width: 259px;}
.GRID-8 .row {width: 296px;}
.GRID-9 .row {width: 333px;}
.GRID-10 .row {width: 370px;}
.GRID-11 .row {width: 407px;}
.GRID-12 .row {width: 444px;}
.GRID-13 .row {width: 481px;}
.GRID-14 .row {width: 518px;}
.GRID-15 .row {width: 555px;}
.GRID-16 .row {width: 592px;}
.GRID-17 .row {width: 629px;}
.GRID-18 .row {width: 666px;}
.GRID-19 .row {width: 703px;}
.GRID-20 .row {width: 740px;}
.GRID-21 .row {width: 777px;}
.GRID-22 .row {width: 814px;}
.GRID-23 .row {width: 851px;}
.GRID-24 .row {width: 888px;}
.GRID-25 .row {width: 925px;}
.GRID-26 .row {width: 962px;}


.col { padding-left:20px; float:left; position:relative;}
.col.first {padding-left:0px !important;}
.col.divide {padding-left:0px !important;}
.col.bottom {margin-top:20px !important;}
.col.compact{padding-left:15px !important;}

.col.bump { padding-bottom:25px !important;}

.GRID-1 {width: 17px;}
.GRID-2 {width: 54px;}
.GRID-3 {width: 91px;}
.GRID-4 {width: 128px;}
.GRID-5 {width: 165px;}
.GRID-6 {width: 202px;}
.GRID-7 {width: 239px;}
.GRID-8 {width: 276px;} .GRID-8compact{width: 304px;}
.GRID-9 {width: 313px;}
.GRID-10 {width: 350px;}
.GRID-11 {width: 387px;} .GRID-11extended{width: 397px;}
.GRID-12 {width: 424px;}
.GRID-13 {width: 461px;} .GRID-13compact{width: 481px;}
.GRID-14 {width: 498px;}
.GRID-15 {width: 535px;}
.GRID-16 {width: 572px;}
.GRID-17 {width: 609px;}
.GRID-18 {width: 646px;}
.GRID-19 {width: 683px;}
.GRID-20 {width: 720px;}
.GRID-21 {width: 757px;}
.GRID-22 {width: 794px;}
.GRID-23 {width: 831px;}
.GRID-24 {width: 868px;}
.GRID-25 {width: 905px;}
.GRID-26 {width: 942px;}
*/ 





/*
###########################################################################################################################################
###########################################################################################################################################
	
	02: GRID TYPES
	
###########################################################################################################################################
###########################################################################################################################################
*/

.GRID-LMain						{ position:relative; float:left; margin: 0 auto 0  auto; padding: 0px; max-width:740px; }
.GRID-RMain		 				{ position:relative; float:left; margin: 0 auto 0  auto; padding: 0px; max-width:770px; }
.GRID-Full 						{ position:relative; float:left; margin: 0 auto 0  auto; padding: 0px; max-width:982px; }

.GRID-LMain.wide 				{ margin-left: -15px; width: 742px;}
.GRID-LMain.float 				{ margin-left: 0px; width: 712px;}

.GRID-RMain.full 				{ margin: 0 0 0 -15px; padding: 0px; width: 770px;}
.GRID-RMain.float 				{ margin: 0px; padding: 0px; width: 740px;}

/*.GRID-Full.wide 				{ margin-left: -15px; width: 982px;}*/
.GRID-Full.float 				{ margin-left: 0px; width: 952px;}



/*
###########################################################################################################################################
###########################################################################################################################################
	
	03: FLOAT GRID
	
###########################################################################################################################################
###########################################################################################################################################
*/

/* GRID SYSTEMS - Full Float (952 px) Framework
---------------------------------------------------------------------------------------------------------- */ 
.GRID-Full.float .col_1, 
.GRID-Full.float .col_2, 
.GRID-Full.float .col_3, 
.GRID-Full.float .col_4, 
.GRID-Full.float .col_5, 
.GRID-Full.float .col_6, 
.GRID-Full.float .col_7, 
.GRID-Full.float .col_8, 
.GRID-Full.float .col_9, 
.GRID-Full.float .col_10, 
.GRID-Full.float .col_11,
.GRID-Full.float .col_12,
.GRID-Full.float .col_13,
.GRID-Full.float .col_14,
.GRID-Full.float .col_15, 
.GRID-Full.float .col_16, 
.GRID-Full.float .col_17, 
.GRID-Full.float .col_18, 
.GRID-Full.float .col_19, 
.GRID-Full.float .col_20, 
.GRID-Full.float .col_21, 
.GRID-Full.float .col_22, 
.GRID-Full.float .col_23, 
.GRID-Full.float .col_24, 
.GRID-Full.float .col_25, 
.GRID-Full.float .col_26, 
.GRID-Full.float .col_27 		{ display: inline; float: left; margin-right: 20px;}

.GRID-Full.float .col_1.last,
.GRID-Full.float .col_2.last,
.GRID-Full.float .col_3.last,
.GRID-Full.float .col_4.last,
.GRID-Full.float .col_5.last,
.GRID-Full.float .col_6.last,
.GRID-Full.float .col_7.last,
.GRID-Full.float .col_8.last,
.GRID-Full.float .col_9.last,
.GRID-Full.float .col_10.last,
.GRID-Full.float .col_11.last,
.GRID-Full.float .col_12.last,
.GRID-Full.float .col_13.last,
.GRID-Full.float .col_14.last,
.GRID-Full.float .col_15.last,
.GRID-Full.float .col_16.last,
.GRID-Full.float .col_17.last,
.GRID-Full.float .col_18.last,
.GRID-Full.float .col_19.last,
.GRID-Full.float .col_20.last,
.GRID-Full.float .col_21.last,
.GRID-Full.float .col_22.last,
.GRID-Full.float .col_23.last,
.GRID-Full.float .col_24.last,
.GRID-Full.float .col_25.last,
.GRID-Full.float .col_26.last,
.GRID-Full.float .col_27.last	{ margin-right: 0px !important;}

/* Column Widths */
.GRID-Full.float .col_1		{width: 16px;}
.GRID-Full.float .col_2		{width: 52px;}
.GRID-Full.float .col_3		{width: 88px;}
.GRID-Full.float .col_4		{width: 124px;}
.GRID-Full.float .col_5		{width: 160px;}
.GRID-Full.float .col_6		{width: 196px;}
.GRID-Full.float .col_7		{width: 232px;}
.GRID-Full.float .col_8		{width: 268px;}
.GRID-Full.float .col_9		{width: 304px;}
.GRID-Full.float .col_10	{width: 340px;}
.GRID-Full.float .col_11	{width: 376px;}
.GRID-Full.float .col_12	{width: 412px;}
.GRID-Full.float .col_13	{width: 448px;}
.GRID-Full.float .col_14	{width: 484px;}
.GRID-Full.float .col_15	{width: 520px;}
.GRID-Full.float .col_16	{width: 556px;}
.GRID-Full.float .col_17	{width: 592px;}
.GRID-Full.float .col_18	{width: 628px;}
.GRID-Full.float .col_19	{width: 664px;}
.GRID-Full.float .col_20	{width: 700px;}
.GRID-Full.float .col_21	{width: 736px;}
.GRID-Full.float .col_22	{width: 772px;}
.GRID-Full.float .col_23	{width: 808px;}
.GRID-Full.float .col_24	{width: 844px;}
.GRID-Full.float .col_25	{width: 880px;}
.GRID-Full.float .col_26	{width: 916px;}
.GRID-Full.float .col_27	{width: 952px;}





/*
###########################################################################################################################################
###########################################################################################################################################
	
	04: FULL GRID
	
###########################################################################################################################################
###########################################################################################################################################
*/

/* GRID SYSTEMS - Full Wide (982 px) Framework
---------------------------------------------------------------------------------------------------------- */ 

/* =Containers
--------------------------------------------------------------------------------*/
.GRID-Full.wide {
	margin-left: auto;
	margin-right: auto;
	width: 982px; }

/* =Grid >> Global
--------------------------------------------------------------------------------*/
.GRID-Full.wide .col_1, .GRID-Full.wide .col_2, .GRID-Full.wide .col_3, .GRID-Full.wide .col_4, .GRID-Full.wide .col_5, .GRID-Full.wide .col_6, .GRID-Full.wide .col_7, .GRID-Full.wide .col_8, .GRID-Full.wide .col_9, .GRID-Full.wide .col_10, .GRID-Full.wide .col_11, .GRID-Full.wide .col_12, .GRID-Full.wide .col_13, .GRID-Full.wide .col_14, .GRID-Full.wide .col_15, .GRID-Full.wide .col_16, .GRID-Full.wide .col_17,.GRID-Full.wide.col_18, .GRID-Full.wide .col_19, .GRID-Full.wide .col_20, .GRID-Full.wide .col_21, .GRID-Full.wide .col_22, .GRID-Full.wide .col_23, .GRID-Full.wide .col_24, .GRID-Full.wide .col_25, .GRID-Full.wide .col_26 {
	display: inline; float: left; margin-left: 20px;}

/* =Grid >> 26 Columns
--------------------------------------------------------------------------------*/	
.GRID-Full.wide .col_1		{ width:17px;}
.GRID-Full.wide .col_2		{ width:54px;}
.GRID-Full.wide .col_3		{ width:91px;}
.GRID-Full.wide .col_4		{ width:128px;}
.GRID-Full.wide .col_5		{ width:165px;}
.GRID-Full.wide .col_6		{ width:202px;}
.GRID-Full.wide .col_7		{ width:239px;}
.GRID-Full.wide .col_8		{ width:276px;}
.GRID-Full.wide .col_9		{ width:313px;}
.GRID-Full.wide .col_10		{ width:350px;}
.GRID-Full.wide .col_11		{ width:387px;}
.GRID-Full.wide .col_12		{ width:424px;}
.GRID-Full.wide .col_13		{ width:461px;}
.GRID-Full.wide .col_14		{ width:498px;}
.GRID-Full.wide .col_15		{ width:535px;}
.GRID-Full.wide .col_16		{ width:572px;}
.GRID-Full.wide .col_17		{ width:609px;}
.GRID-Full.wide .col_18		{ width:646px;}
.GRID-Full.wide .col_19		{ width:683px;}
.GRID-Full.wide .col_20		{ width:720px;}
.GRID-Full.wide .col_21		{ width:757px;}
.GRID-Full.wide .col_22		{ width:794px;}
.GRID-Full.wide .col_23		{ width:831px;}
.GRID-Full.wide .col_24		{ width:868px;}
.GRID-Full.wide .col_25		{ width:905px;}
.GRID-Full.wide .col_26		{ width:942px;}

/* =Grid >> 26 Columns - no left margin
--------------------------------------------------------------------------------*/
.GRID-Full.wide .mcol_1		{ margin-left:57px; margin-left: 0px;}
.GRID-Full.wide .mcol_2		{ margin-left:94px; margin-left: 0px;}
.GRID-Full.wide .mcol_3		{ margin-left:131px; margin-left: 0px;}
.GRID-Full.wide .mcol_4		{ margin-left:168px; margin-left: 0px;}
.GRID-Full.wide .mcol_5		{ margin-left:205px; margin-left: 0px;}
.GRID-Full.wide .mcol_6		{ margin-left:242px; margin-left: 0px;}
.GRID-Full.wide .mcol_7		{ margin-left:279px; margin-left: 0px;}
.GRID-Full.wide .mcol_8		{ margin-left:316px; margin-left: 0px;}
.GRID-Full.wide .mcol_9		{ margin-left:353px; margin-left: 0px;}
.GRID-Full.wide .mcol_10	{ margin-left:390px; margin-left: 0px;}
.GRID-Full.wide .mcol_11	{ margin-left:427px; margin-left: 0px;}
.GRID-Full.wide .mcol_12	{ margin-left:464px; margin-left: 0px;}
.GRID-Full.wide .mcol_13	{ margin-left:501px; margin-left: 0px;}
.GRID-Full.wide .mcol_14	{ margin-left:538px; margin-left: 0px;}
.GRID-Full.wide .mcol_15	{ margin-left:575px; margin-left: 0px;}
.GRID-Full.wide .mcol_16	{ margin-left:612px; margin-left: 0px;}
.GRID-Full.wide .mcol_17	{ margin-left:649px; margin-left: 0px;}
.GRID-Full.wide .mcol_18	{ margin-left:686px; margin-left: 0px;}
.GRID-Full.wide .mcol_19	{ margin-left:723px; margin-left: 0px;}
.GRID-Full.wide .mcol_20	{ margin-left:760px; margin-left: 0px;}
.GRID-Full.wide .mcol_21	{ margin-left:797px; margin-left: 0px;}
.GRID-Full.wide .mcol_22	{ margin-left:834px; margin-left: 0px;}
.GRID-Full.wide .mcol_23	{ margin-left:871px; margin-left: 0px;}
.GRID-Full.wide .mcol_24	{ margin-left:908px; margin-left: 0px;}
.GRID-Full.wide .mcol_25	{ margin-left:945px; margin-left: 0px;}
.GRID-Full.wide .mcol_26	{ margin-left:982px; margin-left: 0px;}




/* GRID SYSTEMS - Right Main Wide (982 px) Framework
---------------------------------------------------------------------------------------------------------- */ 
.GRID-RMain.float .col_1, 
.GRID-RMain.float .col_2, 
.GRID-RMain.float .col_3, 
.GRID-RMain.float .col_4, 
.GRID-RMain.float .col_5, 
.GRID-RMain.float .col_6, 
.GRID-RMain.float .col_7, 
.GRID-RMain.float .col_8, 
.GRID-RMain.float .col_9, 
.GRID-RMain.float .col_10			{ display: inline; float: left; margin-left: 20px; }

.GRID-RMain.float .first			{ margin-left: 0px !important;}
.GRID-RMain.float .last				{ }

/* Column Widths */
.GRID-RMain.float .col_1			{ width:55px; }
.GRID-RMain.float .col_2			{ width:130px; }
.GRID-RMain.float .col_3			{ width:205px; }
.GRID-RMain.float .col_4			{ width:280px; }
.GRID-RMain.float .col_5			{ width:360px; }
.GRID-RMain.float .col_6			{ width:430px; }
.GRID-RMain.float .col_7			{ width:505px; }
.GRID-RMain.float .col_8			{ width:580px; }
.GRID-RMain.float .col_9			{ width:655px; }
.GRID-RMain.float .col_10			{ width:730px; }













/* CONTENT(colMain) GRIDS - Full (982 px)
---------------------------------------------------------------------------------------------------------- 
.col { margin-right:10px; float:left; position:relative;}
.col.first {padding-left:0px !important;}
.col.divide {padding-left:0px !important;}
.col.bottom {margin-top:20px !important;}
.col.compact{padding-left:15px !important;}

.col.bump { padding-bottom:25px !important;}


.GRID-Full .GRID-1 {width: 17px;}
.GRID-2 {width: 54px;}
.GRID-3 {width: 91px;}
.GRID-4 {width: 128px;}
.GRID-5 {width: 165px;}
.GRID-6 {width: 202px;}
.GRID-7 {width: 239px;}
.GRID-8 {width: 276px;} .GRID-8compact{width: 304px;}
.GRID-9 {width: 313px;}
.GRID-10 {width: 350px;}
.GRID-11 {width: 387px;} .GRID-11extended{width: 397px;}
.GRID-12 {width: 424px;}
.GRID-13 {width: 461px;} .GRID-13compact{width: 481px;}
.GRID-14 {width: 498px;}
.GRID-15 {width: 535px;}
.GRID-16 {width: 572px;}
.GRID-17 {width: 609px;}
.GRID-18 {width: 646px;}
.GRID-19 {width: 683px;}
.GRID-20 {width: 720px;}
.GRID-21 {width: 757px;}
.GRID-22 {width: 794px;}
.GRID-23 {width: 831px;}
.GRID-24 {width: 868px;}
.GRID-25 {width: 905px;}
.GRID-26 {width: 942px;}*/