/**
 * @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 {
	/* 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: 960px;
}
#bottom-container {
	width: 100%;
	height: 296px;
	background: url(/sites/all/themes/chargrill/images/background-footer-checker.gif) top repeat-x;
}
@media all and (max-width: 480px), only screen and (max-device-width: 640px) {
#bottom-container {
	width: 100%;
	height: 518px;
	background: url(/sites/all/themes/chargrill/images/background-footer-checker-mobile.gif) top repeat-x;
}
#block-block-2 {
	float: left;
	position: relative;
	font-size: 1.4em !important;
	margin-bottom: 6px;
	margin-top: 6px;
	width: 110px;
	padding-left: 12px;
}
#block-block-2 a:link, #block-block-2 a:visited {
	width: 100px !important;
	padding: 3px 0 !important;
}
#block-block-8 p {
	line-height: 1.4em;
}

#page #main #content {
  padding-left: 2px !important;
  padding-right: 2px !important;
}
#webform-client-form-33 .webform-component--other-drinks {
padding-top: 0 !important;
}
#edit-submitted-milkshakes td, #edit-submitted-drinks td, #edit-submitted-other-drinks td {
padding-right: 0 !important;
padding-bottom: 0.5em !important;
line-height: 1em;
}

.webform-component--order-menu--steak-sand:before, .webform-component--order-menu--steak-sand-jr:before, .webform-component--order-menu--grilled-chicken-sandwich:before, .webform-component--order-menu--char-burgers:before, .webform-component--order-menu--bar-b-que-sandwich:before, .webform-component--order-menu--cheese-burgers:before, .webform-component--order-menu--hot-dogs:before, .webform-component--order-menu--garden-salad:before{
content: none !important;
}

}
/*
 * Apply the shared properties of grid items in a single, efficient ruleset.
 */

#header, #content, #navigation, .region-sidebar-first, .region-sidebar-second, #footer {
	padding-left: 0px;
	padding-right: 0px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	word-wrap: break-word;
	_display: inline;
	_overflow: hidden;
	_overflow-y: visible;
}
/*
 * Containers for grid items and flow items.
 */

#header, #main, #footer {
 *position: relative;
 *zoom: 1;
}
#header:before, #header:after, #main:before, #main:after, #footer:before, #footer:after {
	content: "";
	display: table;
}
#header:after, #main:after, #footer:after {
	clear: both;
}
#header p, .region-highlighted p {
	margin-bottom: 0;
	margin-top: 0;
}

/*
 * Navigation bar
 */

@media all and (min-width: 480px) {
#main {
	position: relative;
}
#navigation {
	top: 0; /* Move the navbar up inside #main's padding. */
	width: 100%;
	font-size: 1.4em;
}
#navigation p {
	margin-bottom: 0;
	margin-top: 0;
}


}


/*
 * Use 3 grid columns for smaller screens.
 */

@media all and (min-width: 480px) and (max-width: 959px) {
/*
   * 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: 66.667%;
 margin-left: 33.333%;
 margin-right: -100%;
}
.sidebar-first .region-sidebar-first { /* Span 1 column, starting in 1st column from left. */
 float: left;
 width: 33.333%;
 margin-left: 0%;
 margin-right: -33.333%;
}
/*
   * 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.667%;
 margin-left: 0%;
 margin-right: -66.667%;
}
.sidebar-second .region-sidebar-second { /* Span 1 column, starting in 3rd column from left. */
 float: left;
 width: 33.333%;
 margin-left: 66.667%;
 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: 66.667%;
 margin-left: 33.333%;
 margin-right: -100%;
}
.two-sidebars .region-sidebar-first { /* Span 1 column, starting in 1st column from left. */
 float: left;
 width: 33.333%;
 margin-left: 0%;
 margin-right: -33.333%;
}
.two-sidebars .region-sidebar-second { /* Start a new row and span all 3 columns. */
 float: left;
 width: 100%;
 margin-left: 0%;
 margin-right: -100%;
 *position: relative;
 *zoom: 1;
 padding-left: 0;
 padding-right: 0;
 clear: left;
}
.two-sidebars .region-sidebar-second:before, .two-sidebars .region-sidebar-second:after {
 content: "";
 display: table;
}
.two-sidebars .region-sidebar-second:after {
 clear: both;
}
.two-sidebars .region-sidebar-second .block {
 padding-left: 10px;
 padding-right: 10px;
 -moz-box-sizing: border-box;
 -webkit-box-sizing: border-box;
 -ms-box-sizing: border-box;
 box-sizing: border-box;
 word-wrap: break-word;
 _display: inline;
 _overflow: hidden;
 _overflow-y: visible;
}
.two-sidebars .region-sidebar-second .block:nth-child(3n+1) { /* Span 1 column, starting in the 1st column from left. */
 float: left;
 width: 33.333%;
 margin-left: 0%;
 margin-right: -33.333%;
 clear: left;
}
.two-sidebars .region-sidebar-second .block:nth-child(3n+2) { /* Span 1 column, starting in the 2nd column from left. */
 float: left;
 width: 33.333%;
 margin-left: 33.333%;
 margin-right: -66.667%;
}
.two-sidebars .region-sidebar-second .block:nth-child(3n) { /* Span 1 column, starting in the 3rd column from left. */
 float: left;
 width: 33.333%;
 margin-left: 66.667%;
 margin-right: -100%;
}
#webform-component-order-menu .webform-component-select label {
	font-size: 100% !important;
}
}

/*
 * Use 5 grid columns for larger screens.
 */

@media all and (min-width: 960px) {
/*
   * 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: 80%;
	margin-left: 20%;
	margin-right: -100%;
}
.sidebar-first .region-sidebar-first { /* Span 1 column, starting in 1st column from left. */
	float: left;
	width: 20%;
	margin-left: 0%;
	margin-right: -20%;
}
/*
   * 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: 80%;
	margin-left: 0%;
	margin-right: -80%;
}
.sidebar-second .region-sidebar-second { /* Span 1 column, starting in 5th column from left. */
	float: left;
	width: 20%;
	margin-left: 80%;
	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: 60%;
	margin-left: 20%;
	margin-right: -80%;
}
.two-sidebars .region-sidebar-first { /* Span 1 column, starting in 1st column from left. */
	float: left;
	width: 20%;
	margin-left: 0%;
	margin-right: -20%;
}
.two-sidebars .region-sidebar-second { /* Span 1 column, starting in 5th column from left. */
	float: left;
	width: 20%;
	margin-left: 80%;
	margin-right: -100%;
}
}