/* Gutters are not currently overridden in theme settings, but may be in theme CSS */

/* smalltouch_landscape one_col_vert */
@media only screen and (min-width:321px) and (max-width:480px) {
	.container {
		width: 100%
	}
	.two-sidebars .content-inner,
	.one-sidebar .content-inner,
	.region-sidebar-first,
	.region-sidebar-second {
		margin-left: 0;
		margin-right: 0
	}
	.region-sidebar-first {
		width: 50%
	}
	.region-sidebar-second {
		width: 50%
	}
	.one-sidebar .sidebar {
		width: 100%
	}
	.region-sidebar-first,
	.region-sidebar-second {
		overflow: hidden;
		margin-top: 20px;
		float: left;
		clear: none
	}
	.region-sidebar-first.block,
	.region-sidebar-second .block {
		width: 100%
	}
	.at-panel .region {
		display: inline;
		float: left
	}
	.four-4x25 > .panel-row > .region,
	.four-4x25 > .panel-row,
	.two-33-66 > .region,
	.two-brick > .panel-row > .region,
	.two-50 > .region,
	.two-66-33 > .region,
	.three-25-50-25 > .region,
	.three-50-25-25 > .region,
	.three-3x33 > .region,
	.three-25-25-50 > .region,
	.six-6x16 > .panel-row > .region,
	.six-6x16 > .panel-row,
	.five-5x20 > .panel-row > .region,
	.five-5x20 > .panel-row,
	.three-inset-right > .inset-wrapper,
	.three-inset-right > .inset-wrapper > .region,
	.three-inset-right > .region-three-inset-right-sidebar,
	.three-inset-left > .inset-wrapper,
	.three-inset-left > .inset-wrapper > .region,
	.three-inset-left > .region-three-inset-left-sidebar {
		float: none;
		display: block;
		width: 100%;
		clear: both
	}
}

/* tablet_portrait one_col_stack */
@media only screen and (min-width:481px) and (max-width:768px) {
	.container {
		width: 100%
	}
	/*
	div#content-column,
	div.content-inner,
	.sidebar-first div.content-inner,
	.sidebar-second div.content-inner,
	.two-sidebars div.content-inner,
	div.sidebar,
	.sidebar-first div.sidebar,
	.sidebar-second div.sidebar,
	.two-sidebars div.sidebar,
	div.region .block {
		float: none;
		clear: both;
		display: block;
		width: 100%;
		margin-left: 0;
		margin-right: 0
	}
	*/
	.at-panel .region {
		display: inline;
		float: left
	}
	.four-4x25 > .panel-row > .region,
	.two-brick > .panel-row > .region,
	.two-50 > .region,
	.three-50-25-25 > .region-three-50-25-25-second,
	.three-50-25-25 .region-three-50-25-25-third,
	.three-3x33 > .region,
	.five-5x20 > .panel-row > div.region {
		width: 50%
	}
	.four-4x25 > .panel-row,
	.three-25-50-25 > .region-three-25-50-25-first,
	.three-50-25-25 > .region-three-50-25-25-first,
	.three-3x33 > div.region-three-33-first,
	.three-25-25-50 > .region-three-25-25-50-first,
	.six-6x16 > .panel-row,
	.five-5x20 > div.panel-row,
	.five-5x20 > div.panel-row > div.region-five-fifth,
	.three-inset-right > .inset-wrapper > .region,
	.three-inset-left > .inset-wrapper > .region {
		float: none;
		display: block;
		width: 100%;
		clear: both
	}
	.two-33-66 > .region-two-33-66-first,
	.two-66-33 > .region-two-66-33-second {
		width: 33.333333%
	}
	.two-33-66 > .region-two-33-66-second,
	.two-66-33 > .region-two-66-33-first {
		width: 66.666666%
	}
	.two-brick > .panel-row {
		float: none
	}
	.three-25-50-25 > div.region-three-25-50-25-second,
	.three-25-25-50 > div.region-three-25-25-50-third {
		width: 75%
	}
	.three-25-50-25 > div.region-three-25-50-25-third,
	.three-25-25-50 > div.region-three-25-25-50-second,
	.three-inset-right > .region-three-inset-right-sidebar {
		width: 25%
	}
	.six-6x16 > .panel-row > .region {
		width: 50%;
		float: left
	}
	.three-inset-right > .inset-wrapper {
		width: 75%;
		float: left
	}
	.three-inset-left > .region-three-inset-left-sidebar {
		width: 25%;
		float: right
	}
	.three-inset-left > .inset-wrapper {
		width: 75%;
		float: right
	}
}

/* tablet_landscape three_col_grail */
@media only screen and (min-width:769px) and (max-width:1024px) {
	.container {
		width: 100%
	}
	#content-column,
	.content-column,
	div.sidebar {
		float: left;
		clear: none
	}
	.two-sidebars .content-inner {
		margin-left: 20%;
		margin-right: 20%
	}
	.sidebar-first .content-inner {
		margin-left: 20%;
		margin-right: 0
	}
	.sidebar-second .content-inner {
		margin-right: 20%;
		margin-left: 0
	}
	.region-sidebar-first {
		width: 20%;
		margin-left: -100%
	}
	.region-sidebar-second {
		width: 20%;
		margin-left: -20%
	}
	.at-panel .region {
		display: inline;
		float: left
	}
	.four-4x25 > .panel-row > .region,
	.four-4x25 > .panel-row {
		width: 50%;
		float: left
	}
	.two-33-66 > .region-two-33-66-first,
	.two-66-33 > .region-two-66-33-second,
	.three-3x33 > .region,
	.five-5x20 > .row-2 > .region,
	.three-inset-right > .inset-wrapper > div.region-three-inset-right-inset,
	.three-inset-left > .inset-wrapper > div.region-three-inset-left-inset {
		width: 33.333333%
	}
	.two-33-66 > .region-two-33-66-second,
	.two-66-33 > .region-two-66-33-first,
	.three-inset-right > .inset-wrapper > div.region-three-inset-right-middle,
	.three-inset-left > .inset-wrapper > div.region-three-inset-left-middle {
		width: 66.666666%
	}
	.two-brick > .panel-row {
		float: none
	}
	.two-brick > .panel-row > .region,
	.two-50 > .region,
	.three-25-50-25 > div.region-three-25-50-25-second,
	.three-50-25-25 > div.region-three-50-25-25-first,
	.three-25-25-50 > div.region-three-25-25-50-third,
	.five-5x20 > .row-1 > .region {
		width: 50%
	}
	.three-25-50-25 > .region,
	.three-50-25-25 > .region,
	.three-25-25-50 > .region,
	.three-inset-right > .region-three-inset-right-sidebar,
	.three-inset-left > .region-three-inset-left-sidebar {
		width: 25%
	}
	.six-6x16 > .panel-row {
		width: 33.333333%;
		float: left
	}
	.six-6x16 > .panel-row > .region {
		float: none;
		display: block;
		width: 100%;
		clear: both
	}
	.five-5x20 > .row-1 {
		width: 40%
	}
	.five-5x20 > .row-2 {
		width: 60%
	}
	.five-5x20 > .panel-row {
		float: left
	}
	.three-inset-right > .inset-wrapper {
		width: 75%;
		float: left
	}
	.three-inset-right > .inset-wrapper > .region,
	.three-inset-left > .inset-wrapper > .region {
		width: 100%
	}
	.three-inset-left > .region-three-inset-left-sidebar,
	.three-inset-left > .inset-wrapper,
	.three-inset-left > .inset-wrapper > .region-three-inset-left-middle {
		float: right
	}
	.three-inset-left > .inset-wrapper {
		width: 75%
	}
}

/* bigscreen three_col_grail */
@media only screen and (min-width:1025px) {
	.container {
		width: 1024px
	}
	#content-column,
	.content-column,
	div.sidebar {
		float: left;
		clear: none
	}
	.two-sidebars .content-inner {
		margin-left: 25%;
		margin-right: 25%
	}
	.sidebar-first .content-inner {
		margin-left: 25%;
		margin-right: 0
	}
	.sidebar-second .content-inner {
		margin-right: 25%;
		margin-left: 0
	}
	.region-sidebar-first {
		width: 25%;
		margin-left: -100%
	}
	.region-sidebar-second {
		width: 25%;
		margin-left: -25%
	}
	.at-panel .region {
		display: inline;
		float: left
	}
	.four-4x25 > .panel-row > .region,
	.four-4x25 > .panel-row {
		width: 50%;
		float: left
	}
	.two-33-66 > .region-two-33-66-first,
	.two-66-33 > .region-two-66-33-second,
	.three-3x33 > .region,
	.five-5x20 > .panel-row > .region,
	.three-inset-right > .inset-wrapper > div.region-three-inset-right-inset,
	.three-inset-left > .inset-wrapper > div.region-three-inset-left-inset {
		width: 33.333333%
	}
	.two-33-66 > .region-two-33-66-second,
	.two-66-33 > .region-two-66-33-first,
	.three-inset-right > .inset-wrapper > div.region-three-inset-right-middle,
	.three-inset-left > .inset-wrapper > div.region-three-inset-left-middle {
		width: 66.666666%
	}
	.two-brick > .panel-row {
		float: none
	}
	.two-brick > .panel-row > .region,
	.two-50 > .region,
	.three-25-50-25 > div.region-three-25-50-25-second,
	.three-50-25-25 > div.region-three-50-25-25-first,
	.three-25-25-50 > div.region-three-25-25-50-third,
	.five-5x20 > .row-1 div.region-five-first,
	.five-5x20 .row-1 div.region-five-second {
		width: 50%
	}
	.three-25-50-25 > .region,
	.three-50-25-25 > .region,
	.three-25-25-50 > .region,
	.three-inset-right > .region-three-inset-right-sidebar,
	.three-inset-left > .region-three-inset-left-sidebar {
		width: 25%
	}
	.six-6x16 > .panel-row {
		width: 33.333333%;
		float: left
	}
	.six-6x16 > .panel-row > .region,
	.five-5x20 > .panel-row {
		float: none;
		display: block;
		width: 100%;
		clear: both
	}
	.three-inset-right > .inset-wrapper {
		width: 75%;
		float: left
	}
	.three-inset-right > .inset-wrapper > .region,
	.three-inset-left > .inset-wrapper > .region {
		width: 100%
	}
	.three-inset-left > .region-three-inset-left-sidebar,
	.three-inset-left > .inset-wrapper,
	.three-inset-left > .inset-wrapper > .region-three-inset-left-middle {
		float: right
	}
	.three-inset-left > .inset-wrapper {
		width: 75%
	}
}