/* ==========================================================================
   960px - 12 columns - 20px gutter 
   ========================================================================== */

   /* Container */ 
   .container { width: 960px; margin: 0 auto; } 

   /* Global */ 
   [class*="grid-"] { float: left; display: inline; margin-left: 0; margin-right: 0; } 
   [class*="grid-"] img:not(.odyssey-banner){
    max-width:100%; 
    width:auto;
    margin: 0 auto;
   }
   .responsiveMenu { display:none; margin: 3px auto;}
   
   .group:before, .group:after { content: ""; display: table; line-height: 0; } 
   .group:after { clear: both; } 

   /* Nested elements */ 
   .alpha { margin-left: 0px; } 
   .omega { margin-right: 0px; } 

   /* Grids */ 
   .group .grid-1 {  width: 8.333333%; }
   .group .grid-2 {  width: 16.666666%; }
   .group .grid-3 {  width: 25%; }
   .group .grid-4 {  width: 33.333333%; }
   .group .grid-5 {  width: 41.666666%; }
   .group .grid-6 {  width: 50%; }
   .group .grid-7 {  width: 58.333333%; }
   .group .grid-8 {  width: 66.666666%; }
   .group .grid-9 {  width: 75%; }
   .group .grid-10 {  width: 83.333333%; }
   .group .grid-11 {  width: 91.666666%; }
   .group .grid-12 {  width: 100%; }

   /* Offset Extra Space */ 
   .group .offset-1 { padding-left: 8.333333%; }
   .group .offset-2 { padding-left: 16.666666%; }
   .group .offset-3 { padding-left: 24%; }
   .group .offset-4 { padding-left: 33.333333%; }
   .group .offset-5 { padding-left: 41.666666%; }
   .group .offset-6 { padding-left: 50%; }
   .group .offset-7 { padding-left: 58.333333%; }
   .group .offset-8 { padding-left: 66.666666%; }
   .group .offset-9 { padding-left: 75%; }
   .group .offset-10 { padding-left: 83.333333%; }
   .group .offset-11 { padding-left: 91.666666%; }


/* ==========================================================================
   768px - 12 columns - 20px gutter 
   ========================================================================== */

   @media (min-width: 768px) and (max-width: 959px) { 

   /* Container */ 
   .container { width: auto; max-width: 959px; margin: 0 auto; padding: 0 10px; } 

   /* Global */ 
   [class*="grid-"] { float: left; display: inline; margin-left: 0; margin-right: 0; } 

   }
   
    

/* ==========================================================================
   Mobile
   ========================================================================== */

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

   body { padding-left: 20px; padding-right: 20px; }

   /* Container */
   .container { width: auto; padding: 0 10px;}

   /* Global */
   [class*="grid-"] { display: block; margin-left: 0px; margin-right: 0px; }

   /* Grids */
   .group .grid-1,
   .group .grid-2,
   .group .grid-3,
   .group .grid-4,
   .group .grid-5,
   .group .grid-6,
   .group .grid-7,
   .group .grid-8,
   .group .grid-9,
   .group .grid-10,
   .group .grid-11,
   .group .grid-12 { width: 100%;}

   /* Offset Extra Space */
   .group .offset-1, 
   .group .offset-2, 
   .group .offset-3, 
   .group .offset-4, 
   .group .offset-5, 
   .group .offset-6, 
   .group .offset-7, 
   .group .offset-8, 
   .group .offset-9, 
   .group .offset-10, 
   .group .offset-11 { padding-left: 0; }

   }