/*
* Amazium (http://www.amazium.co.uk)
* Copyright 2010 - 2013, Mike Ballan
* Licensed under MIT (https://github.com/OwlyStuff/Amazium/blob/master/LICENSE)
*/


/***********************************************
Screen 1200px+
***********************************************/
@media only screen and (min-width: 960px) {

.row                                            { margin:0 auto; width:960px; display:table; }
.row .row                                       { margin:0 -16px; width:auto; display:inline-block; }

.grid_1                                         { width:48px; margin:0 16px; float:left; display:inline; }
.grid_2                                         { width:128px; margin:0 16px; float:left; display:inline; }
.grid_3                                         { width:208px; margin:0 16px; float:left; display:inline; }
.grid_4                                         { width:288px; margin:0 16px; float:left; display:inline; }
.grid_5                                         { width:368px; margin:0 16px; float:left; display:inline; }
.grid_6                                         { width:448px; margin:0 16px; float:left; display:inline; }
.grid_7                                         { width:528px; margin:0 16px; float:left; display:inline; }
.grid_8                                         { width:608px; margin:0 16px; float:left; display:inline; }
.grid_9                                         { width:688px; margin:0 16px; float:left; display:inline; }

.grid_10                                        { width:768px; margin:0 16px; float:left; display:inline; }
.grid_11                                        { width:848px; margin:0 16px; float:left; display:inline; }
.grid_12                                        { width:1170px; margin:0 16px; float:left; display:inline; }

.grid_9fixed                                    { width:668px; margin:0 16px; float:left; display:inline; }
.grid_3fixed                                    { width:228px; margin:0 16px; float:left; display:inline; }

.offset_1                                       { margin-left:96px; }
.offset_2                                       { margin-left:176px; }
.offset_3                                       { margin-left:256px; }
.offset_4                                       { margin-left:336px; }
.offset_5                                       { margin-left:416px; }
.offset_6                                       { margin-left:496px; }
.offset_7                                       { margin-left:576px; }
.offset_8                                       { margin-left:656px; }
.offset_9                                       { margin-left:736px; }
.offset_10                                      { margin-left:816px; }
.offset_11                                      { margin-left:896px; }


.show-mobile                                    { display:none !important; }
.show-tablet                                    { display:none !important; }
.show-screen                                    { display:inherit; }

.hide-mobile                                    { display:inherit !important; }
.hide-tablet                                    { display:inherit !important; }
.hide-screen                                    { display:none !important; }

}

/***********************************************
Tablet (Smaller than 959px)
***********************************************/
@media only screen and (min-width: 768px) and (max-width: 959px) {

.row                                            { width:96%; margin:0 auto;}
.row .row                                       { margin:0 -14px; }
        
.grid_1, .grid_2, .grid_3, .grid_4,
.grid_5, .grid_6, .grid_7, .grid_8,
.grid_9, .grid_10, .grid_11, .grid_12           { width:100%; margin:10px 0 0 0; float:none; display:block; }

    
.show-mobile                                    { display:none !important; }
.show-tablet                                    { display:inherit !important; }
.show-screen                                    { display:none !important; }
    
.hide-mobile                                    { display:inherit !important; }
.hide-tablet                                    { display:none !important; }
.hide-screen                                    { display:inherit !important; }

}



/***********************************************
Mobile
***********************************************/
@media only screen and (max-width: 767px) {

.row                                            { padding:0 16px; width:100%; display:block; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; }
.row .row                                       { margin:0; padding:0; width:100%; display:block; }

.grid_1, .grid_2, .grid_3, .grid_4,
.grid_5, .grid_6, .grid_7, .grid_8,
.grid_9, .grid_10, .grid_11, .grid_12           { width:100%; margin:10px 0 0 0; float:none; display:block; }

.grid_6_mobile                                  { width:48%; }
.grid_6_mobile:nth-child(odd)                   { width:48%; float:left; }
.grid_6_mobile:nth-child(even)                  { float:right; }

.show-mobile                                    { display:inherit !important; }
.show-tablet                                    { display:none !important; }
.show-screen                                    { display:none !important; }
    
.hide-mobile                                    { display:none !important; }
.hide-tablet                                    { display:inherit !important; }
.hide-screen                                    { display:inherit !important; }

}



/***********************************************
Clean up
***********************************************/
.container:after                                { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; } 
.clearfix:before,
.clearfix:after,
.row:before,
.row:after                                      { content:'\0020'; display:block; overflow:hidden; visibility:hidden; width:0; height:0; }
.row:after, .clearfix:after                     { clear:both; }
.row, 
.clearfix                                       { zoom:1; }
.clear                                          { clear:both; display:block; overflow:hidden; visibility:hidden; width:0; height:0; }

