/** @file Positioning for responsive layout .  Define CSS classes to create a table-free, 3-column, 2-column, or single column layout depending on whether blocks are enabled in the left or right columns.  This layout uses the Zen Grids plugin for Compass: http://zengrids.com */
/* Center the page. */
/* #page, .region-bottom */
#header, #main, .drupalgive-inner, #content-bottom-inner, #footer { /* For screen sizes larger than 1200px, prevent excessively long lines of text by setting a max-width. */ margin-left: auto; margin-right: auto; max-width: 992px; min-width: 252px; }

/* Apply the shared properties of grid items in a single, efficient ruleset. */
#header, #content, #content-bottom-inner, #navigation, .region-sidebar-first, .region-sidebar-second { padding-left: 15px; padding-right: 15px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; word-wrap: break-word; }

/* Containers for grid items and flow items. */
#header:before, #header:after, #main:before, #main:after, .drupalgive-inner:before, .drupalgive-inner:after, #content-bottom-inner:before, #content-bottom-inner:after, #footer:before, #footer:after { content: ""; display: table; }
#header:after, #main:after, .drupalgive-inner:after, #content-bottom-inner:after, #footer:after { clear: both; }

/* !----- mobile viewport ----- */
@media all and (max-width: 767px) { #header-wrap, #main, #content-bottom { width: auto; padding-right: 22px; padding-left: 22px; } }
/* !----- mobile landscape viewport ----- */
@media all and (min-width: 480px) and (max-width: 767px) { #header-wrap, #main, #content-bottom, #footer { width: auto; padding-right: 28px; padding-left: 28px; }
  #main { padding-top: 3em; /* Move all the children of #main down to make room. */ position: relative; }
  #navigation { position: absolute; top: 0; /* Move the navbar up inside #main's padding. */ height: 3em; width: 100%; } }
/* !----- tablet viewport ----- */
@media all and (min-width: 768px) and (max-width: 991px) { #header-wrap, #main, #content-bottom, #footer { width: auto; padding-right: 28px; padding-left: 28px; }
  /* Use 3 grid columns for smaller screens. */
  /* The layout when there is only one sidebar, the left one. */
  .sidebar-first #content { /* Span 2 columns, starting in 2nd column from left. */ float: left; width: 75%; margin-left: 25%; margin-right: -100%; }
  .sidebar-first .region-sidebar-first { /* Span 1 column, starting in 1st column from left. */ float: left; width: 25%; margin-left: 0%; margin-right: -25%; }
  /* The layout when there is only one sidebar, the right one. */
  .sidebar-second #content { /* Span 2 columns, starting in 1st column from left. */ float: left; width: 66.66667%; margin-left: 0%; margin-right: -66.66667%; }
  .sidebar-second .region-sidebar-second { /* Span 1 column, starting in 3rd column from left. */ float: left; width: 33.33333%; margin-left: 66.66667%; margin-right: -100%; }
  /* The layout when there are two sidebars. */
  .two-sidebars #content { /* Span 2 columns, starting in 2nd column from left. */ float: left; width: 75%; margin-left: 25%; margin-right: -100%; }
  .two-sidebars .region-sidebar-first { /* Span 1 column, starting in 1st column from left. */ float: left; width: 25%; margin-left: 0%; margin-right: -25%; }
  .two-sidebars .region-sidebar-second { /* Start a new row and span all 3 columns. */ float: left; width: 75%; margin-left: 25%; margin-right: -100%; clear: left; } }
/* !----- desktop viewport ----- */
@media all and (min-width: 992px) { #header-wrap, #main, #content-bottom, #footer { width: auto; padding-right: 48px; padding-left: 48px; }
  /* Use 5 grid columns for larger screens. */
  /* The layout when there is only one sidebar, the left one. */
  .sidebar-first #content { /* Span 4 columns, starting in 2nd column from left. */ float: left; width: 75%; margin-left: 25%; margin-right: -100%; }
  .sidebar-first .region-sidebar-first { /* Span 1 column, starting in 1st column from left. */ float: left; width: 25%; margin-left: 0%; margin-right: -25%; }
  /* The layout when there is only one sidebar, the right one. */
  .sidebar-second #content { /* Span 4 columns, starting in 1st column from left. */ float: left; width: 66.66667%; margin-left: 0%; margin-right: -66.66667%; }
  .sidebar-second .region-sidebar-second { /* Span 1 column, starting in 5th column from left. */ float: left; width: 33.33333%; margin-left: 66.66667%; margin-right: -100%; }
  /* The layout when there are two sidebars. */
  .two-sidebars #content { /* Span 3 columns, starting in 2nd column from left. */ float: left; width: 50%; margin-left: 16.66667%; margin-right: -66.66667%; }
  .two-sidebars .region-sidebar-first { /* Span 1 column, starting in 1st column from left. */ float: left; width: 16.66667%; margin-left: 0%; margin-right: -16.66667%; }
  .two-sidebars .region-sidebar-second { /* Span 1 column, starting in 5th column from left. */ float: left; width: 33.33333%; margin-left: 66.66667%; margin-right: -100%; }
  /* team pages */
  .node-type-team.two-sidebars #content { /* Span 3 columns, starting in 2nd column from left. */ float: left; width: 58.33333%; margin-left: 16.66667%; margin-right: -75%; }
  .node-type-team.two-sidebars .region-sidebar-first { /* Span 1 column, starting in 1st column from left. */ float: left; width: 16.66667%; margin-left: 0%; margin-right: -16.66667%; }
  .node-type-team.two-sidebars .region-sidebar-second { /* Span 1 column, starting in 5th column from left. */ float: left; width: 25%; margin-left: 75%; margin-right: -100%; } }