Chris@2: /* smalltouch_landscape one_col_vert */
Chris@2: @media only screen and (min-width:321px) and (max-width:480px) {
Chris@2: #page-wrapper {width:100%}
Chris@2: .two-sidebars #content,.one-sidebar #content,#sidebar-first,#sidebar-second {margin-left: 0; margin-right: 0}
Chris@2: #sidebar-first {width: 50%}
Chris@2: .one-sidebar #sidebar-first {width: 100%;}
Chris@2: #sidebar-second {width: 50%}
Chris@2: #sidebar-first,#sidebar-second {overflow: hidden; margin-top: 20px; float: left; clear: none}
Chris@2: #sidebar-first .section {margin-right: 5px; margin-left: 0;}
Chris@2: .one-sidebar #sidebar-first .section {margin-right: 0; margin-left: 0;}
Chris@2: #sidebar-second .section {margin-right: 0; margin-left: 5px;}
Chris@2: #top-columns .column-block-wrapper {width: 100% !important; margin-top: 1em;}
Chris@2: #top-columns .column-block-wrapper .column-block {height: auto ; margin: 0 !important;}
Chris@2: #bottom-columns .column-block-wrapper {width: 100% !important; margin-top: 1em;}
Chris@2: #bottom-columns .column-block-wrapper .column-block {height: auto ; margin: 0 !important;}
Chris@2: #footer-columns .column-block-wrapper {width: 100% !important; margin-top: 1em;}
Chris@2: #footer-columns .column-block-wrapper .column-block {height: auto ; margin: 0 !important;}
Chris@2: }
Chris@2: /* tablet_portrait one_col_vert */
Chris@2: @media only screen and (min-width:481px) and (max-width:768px) {
Chris@2: #page-wrapper {width:90%}
Chris@2: .two-sidebars #content,.one-sidebar #content,#sidebar-first,#sidebar-second {margin-left: 0; margin-right: 0}
Chris@2: #sidebar-first {width: 50%}
Chris@2: .one-sidebar #sidebar-first {width: 100%;}
Chris@2: #sidebar-second {width: 50%}
Chris@2: #sidebar-first,#sidebar-second {overflow: hidden; margin-top: 20px; float: left; clear: none}
Chris@2: #sidebar-first .section {margin-right: 5px; margin-left: 0;}
Chris@2: .one-sidebar #sidebar-first .section {margin-right: 0; margin-left: 0;}
Chris@2: #sidebar-second .section {margin-right: 0; margin-left: 5px;}
Chris@2: #top-columns .column-block-wrapper {width: 100% !important; margin-top: 1em;}
Chris@2: #top-columns .column-block-wrapper .column-block {height: auto ; margin: 0 !important;}
Chris@2: #bottom-columns .column-block-wrapper {width: 100% !important; margin-top: 1em;}
Chris@2: #bottom-columns .column-block-wrapper .column-block {height: auto ; margin: 0 !important;}
Chris@2: #footer-columns .column-block-wrapper {width: 100% !important; margin-top: 1em;}
Chris@2: #footer-columns .column-block-wrapper .column-block {height: auto ; margin: 0 !important;}
Chris@2: }
Chris@2: /* tablet_landscape three_col_grail */
Chris@2: @media only screen and (min-width:769px) and (max-width:1024px) {
Chris@2: #page-wrapper {width:90%}
Chris@2: .two-sidebars #content .section {margin-left: 20%; margin-right: 20%}
Chris@2: .one-sidebar #content .section {margin-left: 20%;}
Chris@2: .sidebar-second #content .section {margin-left: 0; margin-right: 20%;}
Chris@2: #sidebar-first .section {margin-left: 0; margin-right: 10px;}
Chris@2: #sidebar-second .section {margin-right: 0; margin-left: 10px;}
Chris@2: #sidebar-first {width: 20%; margin-left: -100%}
Chris@2: #sidebar-second {width: 20%; margin-left: -20%}
Chris@2: }
Chris@2: /* bigscreen three_col_grail */
Chris@2: @media only screen and (min-width:1025px) {
Chris@2: #page-wrapper {width:90%}
Chris@2: .two-sidebars #content .section {margin-left: 25%; margin-right: 25%}
Chris@2: .one-sidebar #content .section {margin-left: 25%;}
Chris@2: .sidebar-second #content .section {margin-left: 0; margin-right: 25%;}
Chris@2: #sidebar-first .section {margin-left: 0; margin-right: 10px;}
Chris@2: #sidebar-second .section {margin-right: 0; margin-left: 10px;}
Chris@2: #sidebar-first {width: 25%; margin-left: -100%}
Chris@2: #sidebar-second {width: 25%; margin-left: -25%}
Chris@2: }