diff --git a/core/themes/bartik/css/layout.css b/core/themes/bartik/css/layout.css
index 7dfddf7..a25fbc7 100644
--- a/core/themes/bartik/css/layout.css
+++ b/core/themes/bartik/css/layout.css
@@ -8,7 +8,7 @@ body,
 }
 #page-wrapper {
   min-height: 100%;
-  min-width: 960px;
+  
 }
 #header div.section,
 #featured div.section,
@@ -17,7 +17,8 @@ body,
 #triptych,
 #footer-columns,
 #footer {
-  width: 960px;
+  width: 100%;
+  max-width: 1200px; /* @TODO Find proper breakpoint */
   margin-left: auto;
   margin-right: auto;
 }
@@ -34,40 +35,6 @@ body,
 .without-secondary-menu .region-header {
   margin-top: 15px;
 }
-#secondary-menu {
-  position: absolute;
-  right: 0; /* LTR */
-  top: 0;
-  width: 480px;
-}
-#content,
-#sidebar-first,
-#sidebar-second,
-.region-triptych-first,
-.region-triptych-middle,
-.region-triptych-last,
-.region-footer-firstcolumn,
-.region-footer-secondcolumn,
-.region-footer-thirdcolumn,
-.region-footer-fourthcolumn {
-  display: inline;
-  float: left; /* LTR */
-  position: relative;
-}
-.one-sidebar #content {
-  width: 720px;
-}
-.two-sidebars #content {
-  width: 480px;
-}
-.no-sidebars #content {
-  width: 960px;
-  float: none;
-}
-#sidebar-first,
-#sidebar-second {
-  width: 240px;
-}
 #main-wrapper {
   min-height: 300px;
 }
@@ -75,26 +42,106 @@ body,
 .sidebar .section {
   padding: 0 15px;
 }
-.breadcrumb {
+#breadcrumb {
   margin: 0 15px;
 }
-.region-triptych-first,
-.region-triptych-middle,
-.region-triptych-last {
-  margin: 20px 20px 30px;
-  width: 280px;
-}
 #footer-wrapper {
-  padding: 35px 5px 30px;
+  padding: 35px 0 30px;
 }
-.region-footer-firstcolumn,
-.region-footer-secondcolumn,
-.region-footer-thirdcolumn,
-.region-footer-fourthcolumn {
-  padding: 0 10px;
-  width: 220px;
+#footer-wrapper .section {
+  box-sizing: border-box;
+  padding: 0 15px;
 }
-#footer {
-  width: 940px;
-  min-width: 920px;
+
+@media all and (min-width: 0) { /* @TODO Find proper breakpoint */
+  #secondary-menu {
+    position: absolute;
+    right: 0; /* LTR */
+    top: 0;
+    width: 480px;
+  }
 }
+
+@media all and (min-width: 560px) and (max-width:850px) {
+  #sidebar-first,
+  .region-triptych-first,
+  .region-triptych-middle,
+  .region-triptych-last,
+  .region-footer-firstcolumn,
+  .region-footer-secondcolumn,
+  .region-footer-thirdcolumn,
+  .region-footer-fourthcolumn {
+    display: inline;
+    float: left; /* LTR */
+    position: relative;
+  } 
+  .one-sidebar #sidebar {
+    width: 100%;
+  }
+  #sidebar-first,
+  #sidebar-second {
+    overflow: hidden;
+    width: 50%;
+  }
+}
+
+@media all and (min-width: 851px) { /* @TODO Find proper breakpoint */
+  #content,
+  #sidebar-first,
+  #sidebar-second,
+  .region-triptych-first,
+  .region-triptych-middle,
+  .region-triptych-last,
+  .region-footer-firstcolumn,
+  .region-footer-secondcolumn,
+  .region-footer-thirdcolumn,
+  .region-footer-fourthcolumn {
+    display: inline;
+    float: left; /* LTR */
+    position: relative;
+  }
+  .two-sidebars #content {
+    margin-left: 25%;
+    margin-right: 25%;
+    width: 50%;
+  }
+  .one-sidebar #content {
+    width: 75%;
+  }
+  .sidebar-first #content {
+    margin-left: 25%;
+    margin-right: 0;
+  }
+  .sidebar-second #content {
+    margin-right: 25%;
+    margin-left: 0;
+  }
+  #sidebar-first {
+    width: 25%;
+    margin-left: -100%;
+  }
+  #sidebar-second {
+    width: 25%;
+    margin-left: -25%;
+    clear: none;
+  }
+  .region-triptych-first,
+  .region-triptych-middle,
+  .region-triptych-last {
+    -moz-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    padding: 20px 20px 30px;
+    width: 33%;
+  }
+  .region-footer-firstcolumn,
+  .region-footer-secondcolumn,
+  .region-footer-thirdcolumn,
+  .region-footer-fourthcolumn {
+   -moz-box-sizing: border-box;
+   -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    padding: 0 10px;
+    width: 25%;
+  }
+}
\ No newline at end of file
diff --git a/core/themes/bartik/css/maintenance-page.css b/core/themes/bartik/css/maintenance-page.css
index c13c77b..e0c79c6 100644
--- a/core/themes/bartik/css/maintenance-page.css
+++ b/core/themes/bartik/css/maintenance-page.css
@@ -1,4 +1,3 @@
-
 body.maintenance-page {
   background-color: #fff;
   color: #000;
@@ -9,25 +8,19 @@ body.maintenance-page {
   margin-right: auto;
   min-width: 0;
   min-height: 0;
-  width: 800px;
   border: 1px solid #ddd;
   margin-top: 40px;
 }
 .maintenance-page #page {
-  margin: 20px 40px 40px;
+  margin: 10px;
 }
 .maintenance-page #main-wrapper {
   min-height: inherit;
 }
 .maintenance-page #header,
-.maintenance-page #messages,
-.maintenance-page #main {
+.maintenance-page #messages {
   width: auto;
 }
-.maintenance-page #header div.section,
-.maintenance-page #main {
-  width: 700px;
-}
 .maintenance-page #main {
   margin: 0;
 }
@@ -61,7 +54,21 @@ body.maintenance-page {
 .maintenance-page #messages div.messages {
   margin: 0;
 }
-.maintenance-page #messages div.section {
-  padding: 0;
-  width: auto;
+@media all and (min-width: 800px) {
+  .maintenance-page #page-wrapper {
+    width: 800px;
+  }
+  .maintenance-page #header div.section,
+  .maintenance-page #main {
+    width: 700px;
+  }
+  .maintenance-page #messages div.section {
+    padding: 0;
+    width: auto;
+  }
+}
+@media all and (min-width: 600px) { /* @TODO find the proper breakpoint */
+  .maintenance-page #page {
+    margin: 20px 40px 40px;
+  }
 }
diff --git a/core/themes/bartik/css/style.css b/core/themes/bartik/css/style.css
index 72f776d..6864e62 100644
--- a/core/themes/bartik/css/style.css
+++ b/core/themes/bartik/css/style.css
@@ -1601,3 +1601,24 @@ div.admin-panel .description {
   border-top: 1px solid #d6d6d6;
   margin: 0;
 }
+@media all and (max-width: 532px) { /* @TODO Find proper breakpoint */
+ /** Main menu **/
+  #main-menu-links { text-align: center; }
+  #main-menu-links li {
+    float: none;
+    display: inline-block;
+  }
+  #main-menu-links a {
+    float: none;
+    display: block;
+    border-radius: 5px;
+    border-radius: 5px;
+    -moz-border-radius: 5px;
+    -moz-border-radius: 5px;
+    height: 1.8em;
+    line-height: 1.8em;
+    margin-bottom: 5px;
+    padding: 0 0.4em;
+
+  }
+}
diff --git a/core/themes/bartik/templates/page.tpl.php b/core/themes/bartik/templates/page.tpl.php
index f753093..7d0ba6f 100644
--- a/core/themes/bartik/templates/page.tpl.php
+++ b/core/themes/bartik/templates/page.tpl.php
@@ -4,9 +4,9 @@
  * @file
  * Bartik's theme implementation to display a single Drupal page.
  *
- * The doctype, html, head, and body tags are not in this template. Instead
- * they can be found in the html.tpl.php template normally located in the
- * core/modules/system directory.
+ * The doctype, html, head and body tags are not in this template. Instead they
+ * can be found in the html.tpl.php template normally located in the
+ * modules/system directory.
  *
  * Available variables:
  *
@@ -54,10 +54,10 @@
  *   prominently.
  * - $tabs (array): Tabs linking to any sub-pages beneath the current page
  *   (e.g., the view and edit tabs when displaying a node).
- * - $action_links (array): Actions local to the page, such as 'Add menu' on
- *   the menu administration interface.
+ * - $action_links (array): Actions local to the page, such as 'Add menu' on the
+ *   menu administration interface.
  * - $feed_icons: A string of all feed icons for the current page.
- * - $node: The node entity, if there is an automatically-loaded node
+ * - $node: The node object, if there is an automatically-loaded node
  *   associated with the page, and the node ID is the second argument
  *   in the page's path (e.g. node/12345 and node/12345/revisions, but not
  *   comment/reply/12345).
@@ -83,13 +83,11 @@
  * @see template_process()
  * @see bartik_process_page()
  * @see html.tpl.php
- *
- * @ingroup themeable
  */
 ?>
 <div id="page-wrapper"><div id="page">
 
-  <div id="header" class="<?php print $secondary_menu ? 'with-secondary-menu': 'without-secondary-menu'; ?>"><div class="section clearfix">
+  <header id="header" role="banner" class="<?php print $secondary_menu ? 'with-secondary-menu': 'without-secondary-menu'; ?>"><div class="section clearfix">
 
     <?php if ($logo): ?>
       <a href="<?php print $front_page; ?>" title="<?php print t('Home'); ?>" rel="home" id="logo">
@@ -100,7 +98,7 @@
     <?php if ($site_name || $site_slogan): ?>
       <div id="name-and-slogan"<?php if ($hide_site_name && $hide_site_slogan) { print ' class="element-invisible"'; } ?>>
 
-        <?php if ($site_name): ?>
+        <hgroup<?php if ($site_name): ?>>
           <?php if ($title): ?>
             <div id="site-name"<?php if ($hide_site_name) { print ' class="element-invisible"'; } ?>>
               <strong>
@@ -118,6 +116,7 @@
           <div id="site-slogan"<?php if ($hide_site_slogan) { print ' class="element-invisible"'; } ?>>
             <?php print $site_slogan; ?>
           </div>
+        </hgroup>  
         <?php endif; ?>
 
       </div> <!-- /#name-and-slogan -->
@@ -126,7 +125,7 @@
     <?php print render($page['header']); ?>
 
     <?php if ($main_menu): ?>
-      <div id="main-menu" class="navigation">
+      <nav id="main-menu" role="navigation" class="navigation">
         <?php print theme('links__system_main_menu', array(
           'links' => $main_menu,
           'attributes' => array(
@@ -139,11 +138,11 @@
             'class' => array('element-invisible'),
           ),
         )); ?>
-      </div> <!-- /#main-menu -->
+      </nav> <!-- /#main-menu -->
     <?php endif; ?>
 
     <?php if ($secondary_menu): ?>
-      <div id="secondary-menu" class="navigation">
+      <nav id="secondary-menu" role="navigation" class="navigation">
         <?php print theme('links__system_secondary_menu', array(
           'links' => $secondary_menu,
           'attributes' => array(
@@ -156,10 +155,10 @@
             'class' => array('element-invisible'),
           ),
         )); ?>
-      </div> <!-- /#secondary-menu -->
+      </nav> <!-- /#secondary-menu -->
     <?php endif; ?>
 
-  </div></div> <!-- /.section, /#header -->
+  </div></header> <!-- /.section, /#header -->
 
   <?php if ($messages): ?>
     <div id="messages"><div class="section clearfix">
@@ -175,15 +174,11 @@
 
   <div id="main-wrapper" class="clearfix"><div id="main" class="clearfix">
 
-    <?php print $breadcrumb; ?>
-
-    <?php if ($page['sidebar_first']): ?>
-      <div id="sidebar-first" class="column sidebar"><div class="section">
-        <?php print render($page['sidebar_first']); ?>
-      </div></div> <!-- /.section, /#sidebar-first -->
+    <?php if ($breadcrumb): ?>
+      <div id="breadcrumb"><?php print $breadcrumb; ?></div>
     <?php endif; ?>
 
-    <div id="content" class="column"><div class="section">
+    <div id="content" role="main" class="column"><div class="section">
       <?php if ($page['highlighted']): ?><div id="highlighted"><?php print render($page['highlighted']); ?></div><?php endif; ?>
       <a id="main-content"></a>
       <?php print render($title_prefix); ?>
@@ -209,10 +204,16 @@
 
     </div></div> <!-- /.section, /#content -->
 
+    <?php if ($page['sidebar_first']): ?>
+      <aside id="sidebar-first" class="column sidebar" role="complementary"><div class="section">
+        <?php print render($page['sidebar_first']); ?>
+      </div></aside> <!-- /.section, /#sidebar-first -->
+    <?php endif; ?>
+    
     <?php if ($page['sidebar_second']): ?>
-      <div id="sidebar-second" class="column sidebar"><div class="section">
+      <aside id="sidebar-second" class="column sidebar" role="complementary"><div class="section">
         <?php print render($page['sidebar_second']); ?>
-      </div></div> <!-- /.section, /#sidebar-second -->
+      </div></aside> <!-- /.section, /#sidebar-second -->
     <?php endif; ?>
 
   </div></div> <!-- /#main, /#main-wrapper -->
@@ -237,9 +238,9 @@
     <?php endif; ?>
 
     <?php if ($page['footer']): ?>
-      <div id="footer" class="clearfix">
+      <footer id="footer" role="contentinfo" class="clearfix">
         <?php print render($page['footer']); ?>
-      </div> <!-- /#footer -->
+      </footer> <!-- /#footer -->
     <?php endif; ?>
 
   </div></div> <!-- /.section, /#footer-wrapper -->