Make some order in small devices header

NOTE: breaks the dropdown menu

Make some order in small devices header
NOTE: breaks the dropdown menu
92fd8622 · Mattia Migliorini · 83b33429 · 92fd8622 · 92fd8622 · 92fd8622
Commit 92fd8622 authored Nov 22, 2014 by Mattia Migliorini
Hide whitespace changes
Inline Side-by-side

Showing with 322 additions and 292 deletions

css/style.css css/style.css +198 -179

sass/style.scss sass/style.scss +122 -111

valencia.info valencia.info +2 -2

No files found.
--- a/css/style.css
+++ b/css/style.css
@@ -116,7 +116,7 @@ body {
  width: 100%;
 }
-/* line 67, ../sass/core/_core-grid.scss */
+/* line 77, ../sass/core/_core-grid.scss */
 .twelve-col .one-col,
 .twelve-col .two-col,
 .twelve-col .three-col,
@@ -1132,7 +1132,7 @@ body {
    width: 91.48936%;
  }
-  /* line 23, ../sass/core/_core-grid-desktop.scss */
+  /* line 26, ../sass/core/_core-grid-desktop.scss */
  .three-col:nth-child(1):nth-last-child(4),
  .three-col:nth-child(2):nth-last-child(3),
  .three-col:nth-child(3):nth-last-child(2),
@@ -1169,7 +1169,7 @@ body {
    margin-right: 2.21238%;
  }
-  /* line 46, ../sass/core/_core-grid-desktop.scss */
+  /* line 49, ../sass/core/_core-grid-desktop.scss */
  .twelve-col .three-col:nth-child(1):nth-last-child(4),
  .twelve-col .three-col:nth-child(2):nth-last-child(3),
  .twelve-col .three-col:nth-child(3):nth-last-child(2),
@@ -2079,7 +2079,7 @@ body {
 *
 * @section links
 */
-/* line 55, ../sass/core/_core.scss */
+/* line 67, ../sass/core/_core.scss */
 html, body, div, span, applet, object, iframe,
 h1, h2, h3, h4, h5, h6, p, blockquote, pre,
 a, acronym, address, big, cite, code,
@@ -2099,7 +2099,7 @@ time, mark, audio, video {
  vertical-align: baseline;
 }
-/* line 74, ../sass/core/_core.scss */
+/* line 75, ../sass/core/_core.scss */
 article, aside, details, figcaption, figure,
 footer, header, nav, section {
  display: block;
@@ -2126,50 +2126,58 @@ audio:not([controls]) {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 300;
-  src: url("http://themes.googleusercontent.com/static/fonts/ubuntu/v5/e7URzK__gdJcp1hLJYAEag.woff") format("woff");
+  src: url("https://themes.googleusercontent.com/static/fonts/ubuntu/v5/e7URzK__gdJcp1hLJYAEag.woff") format("woff");
 }
 @font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 400;
-  src: local("Ubuntu"), url("http://themes.googleusercontent.com/static/fonts/ubuntu/v5/mZSs29ggGoaqrCNB3kDfZQ.woff") format("woff");
+  src: local("Ubuntu"), url("https://themes.googleusercontent.com/static/fonts/ubuntu/v5/mZSs29ggGoaqrCNB3kDfZQ.woff") format("woff");
 }
 @font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 500;
-  src: local("Ubuntu Medium"), local("Ubuntu-Medium"), url("http://themes.googleusercontent.com/static/fonts/ubuntu/v5/I5PmmDkYShUQg-ah7wh25w.woff") format("woff");
+  src: local("Ubuntu Medium"), local("Ubuntu-Medium"), url("https://themes.googleusercontent.com/static/fonts/ubuntu/v5/I5PmmDkYShUQg-ah7wh25w.woff") format("woff");
 }
 @font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 700;
-  src: local("Ubuntu Bold"), local("Ubuntu-Bold"), url("http://themes.googleusercontent.com/static/fonts/ubuntu/v5/trnbTfqisuuhRVI3i45C5w.woff") format("woff");
+  src: local("Ubuntu Bold"), local("Ubuntu-Bold"), url("https://themes.googleusercontent.com/static/fonts/ubuntu/v5/trnbTfqisuuhRVI3i45C5w.woff") format("woff");
 }
 @font-face {
  font-family: 'Ubuntu';
  font-style: italic;
  font-weight: 300;
-  src: local("Ubuntu Light Italic"), local("Ubuntu-LightItalic"), url("http://themes.googleusercontent.com/static/fonts/ubuntu/v5/j-TYDdXcC_eQzhhp386SjT8E0i7KZn-EPnyo3HZu7kw.woff") format("woff");
+  src: local("Ubuntu Light Italic"), local("Ubuntu-LightItalic"), url("https://themes.googleusercontent.com/static/fonts/ubuntu/v5/j-TYDdXcC_eQzhhp386SjT8E0i7KZn-EPnyo3HZu7kw.woff") format("woff");
 }
 @font-face {
  font-family: 'Ubuntu';
  font-style: italic;
  font-weight: 400;
-  src: local("Ubuntu Italic"), local("Ubuntu-Italic"), url("http://themes.googleusercontent.com/static/fonts/ubuntu/v5/GZMdC02DTXXx8AdUvU2etw.woff") format("woff");
+  src: local("Ubuntu Italic"), local("Ubuntu-Italic"), url("https://themes.googleusercontent.com/static/fonts/ubuntu/v5/GZMdC02DTXXx8AdUvU2etw.woff") format("woff");
 }
 @font-face {
  font-family: 'Ubuntu';
  font-style: italic;
  font-weight: 500;
-  src: local("Ubuntu Medium Italic"), local("Ubuntu-MediumItalic"), url("http://themes.googleusercontent.com/static/fonts/ubuntu/v5/NWdMogIO7U6AtEM4dDdf_T8E0i7KZn-EPnyo3HZu7kw.woff") format("woff");
+  src: local("Ubuntu Medium Italic"), local("Ubuntu-MediumItalic"), url("https://themes.googleusercontent.com/static/fonts/ubuntu/v5/NWdMogIO7U6AtEM4dDdf_T8E0i7KZn-EPnyo3HZu7kw.woff") format("woff");
 }
 @font-face {
  font-family: 'Ubuntu';
  font-style: italic;
  font-weight: 700;
-  src: local("Ubuntu Bold Italic"), local("Ubuntu-BoldItalic"), url("http://themes.googleusercontent.com/static/fonts/ubuntu/v5/pqisLQoeO9YTDCNnlQ9bfz8E0i7KZn-EPnyo3HZu7kw.woff") format("woff");
+  src: local("Ubuntu Bold Italic"), local("Ubuntu-BoldItalic"), url("https://themes.googleusercontent.com/static/fonts/ubuntu/v5/pqisLQoeO9YTDCNnlQ9bfz8E0i7KZn-EPnyo3HZu7kw.woff") format("woff");
 }
 /* line 142, ../sass/core/_core.scss */
 html {
  -moz-transition: background-position 100 ease;
@@ -2202,7 +2210,7 @@ blockquote {
  margin: 28px 20px;
 }
-/* line 170, ../sass/core/_core.scss */
+/* line 172, ../sass/core/_core.scss */
 blockquote:before,
 blockquote:after,
 q:before, q:after {
@@ -2221,7 +2229,7 @@ figure {
  margin: 0;
 }
-/* line 186, ../sass/core/_core.scss */
+/* line 187, ../sass/core/_core.scss */
 abbr,
 acronym {
  cursor: help;
@@ -2237,20 +2245,20 @@ a:focus {
  outline: thin dotted;
 }
-/* line 199, ../sass/core/_core.scss */
+/* line 200, ../sass/core/_core.scss */
 a:hover,
 a:active {
  outline: 0;
 }
-/* line 204, ../sass/core/_core.scss */
+/* line 205, ../sass/core/_core.scss */
 a:link,
 a:visited {
  color: #dd4814;
  text-decoration: none;
 }
-/* line 210, ../sass/core/_core.scss */
+/* line 212, ../sass/core/_core.scss */
 a:hover,
 a:active,
 a:focus {
@@ -2267,7 +2275,7 @@ nav ul li h2 a:after {
  content: "\0000a0›";
 }
-/* line 220, ../sass/core/_core.scss */
+/* line 222, ../sass/core/_core.scss */
 nav ul li a:after,
 .carousel ul li a:after,
 ul li p a:after {
@@ -2277,14 +2285,14 @@ ul li p a:after {
 /**
 * Lists
 */
-/* line 228, ../sass/core/_core.scss */
+/* line 229, ../sass/core/_core.scss */
 ol,
 ul {
  margin-left: 20px;
  margin-bottom: 20px;
 }
-/* line 234, ../sass/core/_core.scss */
+/* line 237, ../sass/core/_core.scss */
 ol ol,
 ul ul,
 ol ul,
@@ -2292,7 +2300,7 @@ ul ol {
  margin-bottom: 0;
 }
-/* line 239, ../sass/core/_core.scss */
+/* line 240, ../sass/core/_core.scss */
 nav ul,
 nav ol {
  list-style: none;
@@ -2337,7 +2345,7 @@ img.right {
 *
 * @section type
 */
-/* line 274, ../sass/core/_core.scss */
+/* line 279, ../sass/core/_core.scss */
 h1,
 h2,
 h3,
@@ -2389,7 +2397,7 @@ h6 {
  text-transform: uppercase;
 }
-/* line 319, ../sass/core/_core.scss */
+/* line 320, ../sass/core/_core.scss */
 p,
 li {
  font-size: 1em;
@@ -2399,13 +2407,13 @@ li {
  padding: 0;
 }
-/* line 328, ../sass/core/_core.scss */
+/* line 329, ../sass/core/_core.scss */
 h2 span,
 h1 span {
  display: block;
 }
-/* line 331, ../sass/core/_core.scss */
+/* line 334, ../sass/core/_core.scss */
 p + h2,
 ul + h2,
 ol + h2,
@@ -2418,7 +2426,7 @@ header nav a:link {
  font-weight: normal;
 }
-/* line 338, ../sass/core/_core.scss */
+/* line 341, ../sass/core/_core.scss */
 p + h3,
 ul + h3,
 ol + h3,
@@ -2426,7 +2434,7 @@ pre + h3 {
  margin-top: 0.78261em;
 }
-/* line 343, ../sass/core/_core.scss */
+/* line 346, ../sass/core/_core.scss */
 p + h4,
 ul + h4,
 ol + h4,
@@ -2470,13 +2478,13 @@ ins {
  text-decoration: none;
 }
-/* line 369, ../sass/core/_core.scss */
+/* line 370, ../sass/core/_core.scss */
 small,
 .smaller {
  font-size: 13px;
 }
-/* line 372, ../sass/core/_core.scss */
+/* line 373, ../sass/core/_core.scss */
 sub,
 sup {
  font-size: 75%;
@@ -2548,7 +2556,7 @@ blockquote small {
 *
 * @section forms
 */
-/* line 424, ../sass/core/_core.scss */
+/* line 427, ../sass/core/_core.scss */
 button,
 input,
 select,
@@ -2565,13 +2573,13 @@ select {
  font-weight: 300;
 }
-/* line 439, ../sass/core/_core.scss */
+/* line 440, ../sass/core/_core.scss */
 button,
 input {
  line-height: normal;
 }
-/* line 442, ../sass/core/_core.scss */
+/* line 445, ../sass/core/_core.scss */
 button,
 input[type="button"],
 input[type="reset"],
@@ -2581,7 +2589,7 @@ input[type="submit"] {
  *overflow: visible;
 }
-/* line 450, ../sass/core/_core.scss */
+/* line 451, ../sass/core/_core.scss */
 input[type="checkbox"],
 input[type="radio"] {
  box-sizing: border-box;
@@ -2608,7 +2616,7 @@ input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
 }
-/* line 469, ../sass/core/_core.scss */
+/* line 470, ../sass/core/_core.scss */
 button::-moz-focus-inner,
 input::-moz-focus-inner {
  border: 0;
@@ -2646,7 +2654,7 @@ form fieldset li:first-child {
  margin-top: 0;
 }
-/* line 498, ../sass/core/_core.scss */
+/* line 501, ../sass/core/_core.scss */
 form input[type="text"],
 form input[type="email"],
 form input[type="tel"],
@@ -2664,7 +2672,7 @@ form textarea {
  padding: 0.6956522em 0.869565em;
 }
-/* line 513, ../sass/core/_core.scss */
+/* line 514, ../sass/core/_core.scss */
 form input:focus,
 form textarea:focus {
  border: 1px solid #dd4814;
@@ -2681,7 +2689,7 @@ form input[type="checkbox"], form input[type="radio"] {
  width: auto;
 }
-/* line 523, ../sass/core/_core.scss */
+/* line 524, ../sass/core/_core.scss */
 form input[type="checkbox"] + label,
 form input[type="radio"] + label {
  display: inline;
@@ -2961,7 +2969,7 @@ p {
  color: #fff;
  padding: 0;
 }
-/* line 66, ../sass/core/_core-templates.scss */
+/* line 67, ../sass/core/_core-templates.scss */
 .audience-consumer .quote-right-top p a,
 .audience-consumer .quote-right p a {
  color: #fff;
@@ -3172,7 +3180,7 @@ p {
 /* misc colours */
 /* This is the global link color, mainly used for links in content */
 /* grid variables */
-/* line 5, ../sass/core/patterns/_structure.scss */
+/* line 9, ../sass/core/patterns/_structure.scss */
 .wrapper,
 header.banner .nav-primary,
 nav div.footer-a div,
@@ -3238,7 +3246,7 @@ nav div.footer-a div,
    margin: 10px 0 30px;
  }
-  /* line 64, ../sass/core/patterns/_structure.scss */
+  /* line 65, ../sass/core/patterns/_structure.scss */
  .three-col,
  .med-six-col .three-col {
    width: 23.30%;
@@ -3329,7 +3337,7 @@ img.touch-border {
  margin-bottom: -3px;
 }
-/* line 21, ../sass/core/patterns/_helpers.scss */
+/* line 22, ../sass/core/patterns/_helpers.scss */
 .accessibility-aid,
 .off-left {
  position: absolute;
@@ -3348,13 +3356,13 @@ a.external {
  background-repeat: no-repeat;
 }
-/* line 36, ../sass/core/patterns/_helpers.scss */
+/* line 37, ../sass/core/patterns/_helpers.scss */
 .opera-mini a.external,
 .no-svg a.external {
  background-image: url("//assets.ubuntu.com/sites/ubuntu/latest/u/img/external-link-orange.png");
 }
-/* line 39, ../sass/core/patterns/_helpers.scss */
+/* line 40, ../sass/core/patterns/_helpers.scss */
 .text-center,
 .align-center {
  text-align: center;
@@ -3453,7 +3461,7 @@ img.priority-0 {
  left: -999em;
 }
-/* line 99, ../sass/core/patterns/_helpers.scss */
+/* line 100, ../sass/core/patterns/_helpers.scss */
 .priority-0,
 .not-for-small {
  position: absolute;
@@ -3476,7 +3484,7 @@ img.priority-0 {
  width: 100%;
  height: 100%;
 }
-/* line 121, ../sass/core/patterns/_helpers.scss */
+/* line 122, ../sass/core/patterns/_helpers.scss */
 .video-container + h3, .video-container + .video-title {
  margin-top: 20px;
 }
@@ -3487,7 +3495,7 @@ img.priority-0 {
    margin-right: -30px;
  }
-  /* line 131, ../sass/core/patterns/_helpers.scss */
+  /* line 132, ../sass/core/patterns/_helpers.scss */
  .pull-bottom-right,
  .pull-bottom-left {
    position: static;
@@ -3509,14 +3517,14 @@ img.priority-0 {
    left: auto;
  }
-  /* line 152, ../sass/core/patterns/_helpers.scss */
+  /* line 153, ../sass/core/patterns/_helpers.scss */
  .priority-0,
  .not-for-small {
    position: relative;
    left: auto;
  }
-  /* line 158, ../sass/core/patterns/_helpers.scss */
+  /* line 159, ../sass/core/patterns/_helpers.scss */
  .for-mobile,
  .for-small {
    position: absolute;
@@ -3564,7 +3572,7 @@ img.priority-0 {
    margin-right: -40px;
  }
-  /* line 200, ../sass/core/patterns/_helpers.scss */
+  /* line 201, ../sass/core/patterns/_helpers.scss */
  .for-tablet,
  .for-medium {
    display: none;
@@ -3575,7 +3583,7 @@ img.priority-0 {
    border: 0;
  }
 }
-/* line 3, ../sass/core/patterns/_typography.scss */
+/* line 4, ../sass/core/patterns/_typography.scss */
 .caps-centered,
 .muted-heading {
  font-size: .875em;
@@ -3591,7 +3599,7 @@ p.intro {
  line-height: 1.4;
 }
-/* line 17, ../sass/core/patterns/_typography.scss */
+/* line 18, ../sass/core/patterns/_typography.scss */
 .row div p:last-child,
 .row div ul:last-child {
  margin-bottom: 0;
@@ -3643,7 +3651,7 @@ p.intro {
    font-size: 1em;
  }
-  /* line 63, ../sass/core/patterns/_typography.scss */
+  /* line 66, ../sass/core/patterns/_typography.scss */
  p,
  li,
  code,
@@ -3694,7 +3702,7 @@ header.banner .nav-primary ul li {
 header.banner .nav-primary ul li:last-child {
  border-right: 1px solid #c64012;
 }
-/* line 36, ../sass/core/patterns/_header.scss */
+/* line 37, ../sass/core/patterns/_header.scss */
 header.banner .nav-primary ul li a:link,
 header.banner .nav-primary ul li a:visited {
  font-size: 14px;
@@ -3753,7 +3761,7 @@ header.banner .no-script {
  display: none;
 }
-/* line 90, ../sass/core/patterns/_header.scss */
+/* line 91, ../sass/core/patterns/_header.scss */
 .opera-mini header.banner .nav-toggle,
 .no-svg header.banner .nav-toggle {
  background-image: url(//assets.ubuntu.com/sites/ubuntu/latest/u/img/icons/navigation-menu-plain.png);
@@ -3780,7 +3788,7 @@ header nav ul.active {
  display: block;
 }
-/* line 110, ../sass/core/patterns/_header.scss */
+/* line 113, ../sass/core/patterns/_header.scss */
 header.banner .nav-primary ul li,
 header.banner .nav-primary ul li a:link,
 header.banner .nav-primary ul li a:visited,
@@ -3815,7 +3823,7 @@ header.banner .nav-primary ul li:last-child {
  border: 0;
 }
-/* line 137, ../sass/core/patterns/_header.scss */
+/* line 140, ../sass/core/patterns/_header.scss */
 header.banner nav.nav-primary ul li a:link,
 header.banner .nav-primary ul li a:visited,
 header.banner .nav-primary ul li a:hover,
@@ -3869,20 +3877,20 @@ html.no-svg #menu.active:after, .opera-mini #menu.active:after {
  font-size: 14px;
  margin-right: 15px;
 }
-/* line 186, ../sass/core/patterns/_header.scss */
+/* line 187, ../sass/core/patterns/_header.scss */
 .nav-secondary ul li a:link,
 .nav-secondary ul li a:visited {
  color: #333;
  font-size: 14px;
  float: left;
 }
-/* line 193, ../sass/core/patterns/_header.scss */
+/* line 194, ../sass/core/patterns/_header.scss */
 .nav-secondary ul li a:hover,
 .nav-secondary ul li a:active {
  color: #dd4814;
  text-decoration: none;
 }
-/* line 200, ../sass/core/patterns/_header.scss */
+/* line 202, ../sass/core/patterns/_header.scss */
 .nav-secondary ul li,
 .nav-secondary ul li.active a:link,
 .nav-secondary ul li.active a:visited {
@@ -3893,14 +3901,14 @@ html.no-svg #menu.active:after, .opera-mini #menu.active:after {
 .nav-secondary ul.breadcrumb {
  margin-left: 20px;
 }
-/* line 210, ../sass/core/patterns/_header.scss */
+/* line 212, ../sass/core/patterns/_header.scss */
 .nav-secondary ul.breadcrumb li,
 .nav-secondary ul.breadcrumb li a:link,
 .nav-secondary ul.breadcrumb li a:visited {
  color: #888888;
  margin-right: 8px;
 }
-/* line 217, ../sass/core/patterns/_header.scss */
+/* line 218, ../sass/core/patterns/_header.scss */
 .nav-secondary ul.breadcrumb li.active a:link,
 .nav-secondary ul.breadcrumb li.active a:visited {
  color: #dd4814;
@@ -3981,7 +3989,7 @@ html.no-svg header.banner .nav-primary.nav-right .logo-ubuntu, .opera-mini heade
 }
 @media only screen and (max-width: 295px) {
-  /* line 304, ../sass/core/patterns/_header.scss */
+  /* line 305, ../sass/core/patterns/_header.scss */
  header.banner .nav-primary.nav-right .logo-ubuntu,
  header.banner .logo-ubuntu {
    -moz-background-size: 20px 20px;
@@ -4024,7 +4032,7 @@ html.no-svg header.banner .logo-ubuntu, .opera-mini header.banner .logo-ubuntu {
    float: left;
  }
-  /* line 338, ../sass/core/patterns/_header.scss */
+  /* line 339, ../sass/core/patterns/_header.scss */
  header nav ul.active li:last-child a:link,
  header nav ul.active li:last-child a:visited {
    border-bottom: 0;
@@ -4036,14 +4044,14 @@ html.no-svg header.banner .logo-ubuntu, .opera-mini header.banner .logo-ubuntu {
    width: 100%;
  }
-  /* line 349, ../sass/core/patterns/_header.scss */
+  /* line 350, ../sass/core/patterns/_header.scss */
  header.banner .nav-primary ul li.active a:link,
  header.banner .nav-primary ul li.active a:visited {
    color: #333;
    font-weight: 700;
  }
-  /* line 356, ../sass/core/patterns/_header.scss */
+  /* line 359, ../sass/core/patterns/_header.scss */
  header.banner .nav-primary ul li,
  header.banner .nav-primary ul li a:link,
  header.banner .nav-primary ul li a:visited,
@@ -4060,7 +4068,7 @@ html.no-svg header.banner .logo-ubuntu, .opera-mini header.banner .logo-ubuntu {
    width: 100%;
  }
-  /* line 370, ../sass/core/patterns/_header.scss */
+  /* line 373, ../sass/core/patterns/_header.scss */
  header.banner .nav-primary ul li a:link,
  header.banner .nav-primary ul li a:visited,
  header.banner .nav-primary ul li a:hover,
@@ -4071,7 +4079,7 @@ html.no-svg header.banner .logo-ubuntu, .opera-mini header.banner .logo-ubuntu {
    font-size: 1em;
  }
-  /* line 380, ../sass/core/patterns/_header.scss */
+  /* line 381, ../sass/core/patterns/_header.scss */
  header.banner .nav-primary ul li:nth-last-child(-n+2) a:link,
  header.banner .nav-primary ul li:nth-last-child(-n+2) a:visited {
    border: 0;
@@ -4090,7 +4098,7 @@ html.no-svg header.banner .logo-ubuntu, .opera-mini header.banner .logo-ubuntu {
    background-color: #dddddd;
  }
-  /* line 393, ../sass/core/patterns/_header.scss */
+  /* line 396, ../sass/core/patterns/_header.scss */
  header.banner nav.nav-primary ul li a:link,
  header.banner .nav-primary ul li a:visited,
  header.banner .nav-primary ul li a:hover,
@@ -4136,7 +4144,7 @@ html.no-svg header.banner .logo-ubuntu, .opera-mini header.banner .logo-ubuntu {
    margin: 0;
    float: left;
  }
-  /* line 428, ../sass/core/patterns/_header.scss */
+  /* line 430, ../sass/core/patterns/_header.scss */
  .nav-secondary ul.second-level-nav li a,
  .nav-secondary ul.second-level-nav li a:link,
  .nav-secondary ul.second-level-nav li a:visited {
@@ -4148,7 +4156,7 @@ html.no-svg header.banner .logo-ubuntu, .opera-mini header.banner .logo-ubuntu {
    padding: 10px 10px 10px 20px;
    width: 100%;
  }
-  /* line 440, ../sass/core/patterns/_header.scss */
+  /* line 442, ../sass/core/patterns/_header.scss */
  .nav-secondary ul.second-level-nav li.active a,
  .nav-secondary ul.second-level-nav li.active a:link,
  .nav-secondary ul.second-level-nav li.active a:visited {
@@ -4173,7 +4181,7 @@ html.no-svg header.banner .logo-ubuntu, .opera-mini header.banner .logo-ubuntu {
    float: left;
    padding-left: 30px;
  }
-  /* line 462, ../sass/core/patterns/_header.scss */
+  /* line 464, ../sass/core/patterns/_header.scss */
  .nav-secondary ul.third-level-nav li a,
  .nav-secondary ul.third-level-nav li a:link,
  .nav-secondary ul.third-level-nav li a:visited {
@@ -4185,7 +4193,7 @@ html.no-svg header.banner .logo-ubuntu, .opera-mini header.banner .logo-ubuntu {
    width: 100%;
    height: 100%;
  }
-  /* line 473, ../sass/core/patterns/_header.scss */
+  /* line 475, ../sass/core/patterns/_header.scss */
  .nav-secondary ul.third-level-nav li.active a,
  .nav-secondary ul.third-level-nav li.active a:link,
  .nav-secondary ul.third-level-nav li.active a:visited {
@@ -4225,7 +4233,7 @@ html.no-svg header.banner .logo-ubuntu, .opera-mini header.banner .logo-ubuntu {
    height: 40px;
    margin: 0;
  }
-  /* line 510, ../sass/core/patterns/_header.scss */
+  /* line 512, ../sass/core/patterns/_header.scss */
  .nav-secondary ul.breadcrumb li a,
  .nav-secondary ul.breadcrumb li a:link,
  .nav-secondary ul.breadcrumb li a:visited {
@@ -4244,7 +4252,7 @@ html.no-svg header.banner .logo-ubuntu, .opera-mini header.banner .logo-ubuntu {
  .nav-secondary ul.breadcrumb li.active {
    margin-top: 12px;
  }
-  /* line 527, ../sass/core/patterns/_header.scss */
+  /* line 529, ../sass/core/patterns/_header.scss */
  .nav-secondary ul.breadcrumb li.active a,
  .nav-secondary ul.breadcrumb li.active a:link,
  .nav-secondary ul.breadcrumb li.active a:visited {
@@ -4275,7 +4283,7 @@ html.no-svg header.banner .logo-ubuntu, .opera-mini header.banner .logo-ubuntu {
  .nav-secondary ul.breadcrumb li + li {
    display: none;
  }
-  /* line 559, ../sass/core/patterns/_header.scss */
+  /* line 561, ../sass/core/patterns/_header.scss */
  .nav-secondary ul.breadcrumb li + li a:link,
  .nav-secondary ul.breadcrumb li + li a:active,
  .nav-secondary ul.breadcrumb li + li a:visited {
@@ -4285,7 +4293,7 @@ html.no-svg header.banner .logo-ubuntu, .opera-mini header.banner .logo-ubuntu {
  .nav-secondary ul.breadcrumb li + li a.after {
    background-image: none;
  }
-  /* line 572, ../sass/core/patterns/_header.scss */
+  /* line 574, ../sass/core/patterns/_header.scss */
  .nav-secondary.open ul.breadcrumb li a:after,
  .nav-secondary.open ul.breadcrumb li a:link:after,
  .nav-secondary.open ul.breadcrumb li a:visited:after {
@@ -4300,7 +4308,7 @@ html.no-svg header.banner .logo-ubuntu, .opera-mini header.banner .logo-ubuntu {
    background-image: url(//assets.ubuntu.com/sites/ubuntu/latest/u/img/patterns/nav-up-arrow.svg);
    margin-top: -7px;
  }
-  /* line 584, ../sass/core/patterns/_header.scss */
+  /* line 586, ../sass/core/patterns/_header.scss */
  .nav-secondary.open ul.second-level-nav,
  .nav-secondary.open ul.third-level-nav,
  .nav-secondary.open ul.breadcrumb li + li {
@@ -4339,7 +4347,7 @@ html.no-svg header.banner .logo-ubuntu, .opera-mini header.banner .logo-ubuntu {
  html.no-svg .nav-secondary ul.breadcrumb li .after, .opera-mini .nav-secondary ul.breadcrumb li .after {
    background-image: url(//assets.ubuntu.com/sites/ubuntu/latest/u/img/patterns/nav-down-arrow.png);
  }
-  /* line 625, ../sass/core/patterns/_header.scss */
+  /* line 627, ../sass/core/patterns/_header.scss */
  html.no-svg .nav-secondary ul.breadcrumb.open ul.breadcrumb li a:after,
  html.no-svg .nav-secondary ul.breadcrumb.open ul.breadcrumb li a:link:after,
  html.no-svg .nav-secondary ul.breadcrumb.open ul.breadcrumb li a:visited:after, .opera-mini .nav-secondary ul.breadcrumb.open ul.breadcrumb li a:after,
@@ -4360,7 +4368,7 @@ html.no-svg header.banner .logo-ubuntu, .opera-mini header.banner .logo-ubuntu {
  html.no-svg .nav-secondary ul.breadcrumb li .after, .opera-mini .nav-secondary ul.breadcrumb li .after {
    background-image: url(//assets.ubuntu.com/sites/ubuntu/latest/u/img/patterns/nav-down-arrow.png);
  }
-  /* line 646, ../sass/core/patterns/_header.scss */
+  /* line 648, ../sass/core/patterns/_header.scss */
  html.no-svg .nav-secondary ul.breadcrumb.open ul.breadcrumb li a:after,
  html.no-svg .nav-secondary ul.breadcrumb.open ul.breadcrumb li a:link:after,
  html.no-svg .nav-secondary ul.breadcrumb.open ul.breadcrumb li a:visited:after, .opera-mini .nav-secondary ul.breadcrumb.open ul.breadcrumb li a:after,
@@ -4434,7 +4442,7 @@ html.no-svg header.banner .logo-ubuntu, .opera-mini header.banner .logo-ubuntu {
    border-left: 1px solid #C64012;
  }
-  /* line 722, ../sass/core/patterns/_header.scss */
+  /* line 725, ../sass/core/patterns/_header.scss */
  header.banner .nav-primary ul li a:active,
  header.banner .nav-primary ul li a:hover,
  header.banner .nav-primary ul li a:visited,
@@ -4497,7 +4505,7 @@ html.no-svg header.banner .logo-ubuntu, .opera-mini header.banner .logo-ubuntu {
    display: block;
  }
-  /* line 782, ../sass/core/patterns/_header.scss */
+  /* line 783, ../sass/core/patterns/_header.scss */
  header.banner .nav-primary,
  #nav-global .nav-global-wrapper {
    width: 984px;
@@ -4568,7 +4576,7 @@ header.banner .nav-primary li ul li {
  float: none;
 }
-/* line 841, ../sass/core/patterns/_header.scss */
+/* line 842, ../sass/core/patterns/_header.scss */
 header.banner .nav-primary li ul li a:link,
 header.banner .nav-primary li ul li a:visited {
  border: 0;
@@ -4587,14 +4595,14 @@ header.banner .nav-primary li ul li a:hover {
  color: #DD4814;
 }
-/* line 854, ../sass/core/patterns/_header.scss */
+/* line 856, ../sass/core/patterns/_header.scss */
 header.banner .nav-primary li ul li.first a:link,
 header.banner .nav-primary li ul li.first a:visited,
 header.banner .nav-primary li ul li:first-of-type a:link {
  padding: 10px 14px;
 }
-/* line 859, ../sass/core/patterns/_header.scss */
+/* line 860, ../sass/core/patterns/_header.scss */
 header.banner .nav-primary li ul li.active a:link,
 header.banner .nav-primary li ul li.active a:visited {
  background: none repeat scroll 0 0 transparent !important;
@@ -4608,7 +4616,7 @@ header.banner .nav-primary li ul .promo {
  padding: 15px 0 0;
 }
-/* line 869, ../sass/core/patterns/_header.scss */
+/* line 870, ../sass/core/patterns/_header.scss */
 header.banner .nav-primary li ul .promo a:link,
 header.banner .nav-primary li ul .promo a:visited {
  background: none repeat scroll 0 0 transparent;
@@ -4659,13 +4667,13 @@ html.lt-ie8 header.banner .nav-primary li:hover ul {
  display: none;
 }
-/* line 3, ../sass/core/patterns/_search.scss */
+/* line 4, ../sass/core/patterns/_search.scss */
 .header-search,
 #box-search {
  padding: 7px 0 7px 14px;
  overflow: hidden;
 }
-/* line 8, ../sass/core/patterns/_search.scss */
+/* line 9, ../sass/core/patterns/_search.scss */
 .header-search input[type="search"],
 .header-search input[type="text"],
 #box-search input[type="search"],
@@ -4781,13 +4789,13 @@ header.banner .search-toggle {
  width: 24px;
 }
-/* line 95, ../sass/core/patterns/_search.scss */
+/* line 96, ../sass/core/patterns/_search.scss */
 .search-toggle:link,
 .search-toggle:active {
  outline: none;
 }
-/* line 100, ../sass/core/patterns/_search.scss */
+/* line 101, ../sass/core/patterns/_search.scss */
 #box-search,
 .header-search {
  background: #f0f0f0;
@@ -4802,14 +4810,14 @@ header.banner .search-toggle {
  z-index: 3;
 }
-/* line 114, ../sass/core/patterns/_search.scss */
+/* line 116, ../sass/core/patterns/_search.scss */
 #box-search.active,
 .header-search.active,
 .header-search.open {
  display: block;
 }
-/* line 118, ../sass/core/patterns/_search.scss */
+/* line 119, ../sass/core/patterns/_search.scss */
 #box-search div,
 .header-search div {
  -moz-box-shadow: inset 0 -4px 4px -4px rgba(0, 0, 0, 0.3), inset 0 5px 5px -5px rgba(0, 0, 0, 0.3);
@@ -4821,7 +4829,7 @@ header.banner .search-toggle {
  z-index: 1;
 }
-/* line 128, ../sass/core/patterns/_search.scss */
+/* line 129, ../sass/core/patterns/_search.scss */
 #box-search form input[type="search"],
 .header-search form input[type="search"] {
  font-size: 1.14286em;
@@ -4846,7 +4854,7 @@ header.banner .search-toggle {
  width: 100%;
 }
-/* line 147, ../sass/core/patterns/_search.scss */
+/* line 148, ../sass/core/patterns/_search.scss */
 .yes-js .header-inner #box-search,
 .yes-js .header-inner .header-search {
  display: none;
@@ -4885,7 +4893,7 @@ header.banner .search-toggle {
  }
 }
 @media only screen and (min-width: 960px) {
-  /* line 189, ../sass/core/patterns/_search.scss */
+  /* line 190, ../sass/core/patterns/_search.scss */
  #box-search,
  .header-search {
    background: none;
@@ -4899,7 +4907,7 @@ header.banner .search-toggle {
    padding-top: 7px;
    max-width: 220px;
  }
-  /* line 202, ../sass/core/patterns/_search.scss */
+  /* line 203, ../sass/core/patterns/_search.scss */
  #box-search form input[type="text"],
  #box-search form input[type="search"],
  .header-search form input[type="text"],
@@ -4980,7 +4988,7 @@ header.banner .search-toggle {
  }
 }
 @media only screen and (min-width: 984px) {
-  /* line 281, ../sass/core/patterns/_search.scss */
+  /* line 282, ../sass/core/patterns/_search.scss */
  #box-search,
  .header-search {
    display: block;
@@ -5004,7 +5012,7 @@ body.search-results .nav-secondary,
 body.search-no-results .nav-secondary {
  display: none;
 }
-/* line 311, ../sass/core/patterns/_search.scss */
+/* line 312, ../sass/core/patterns/_search.scss */
 body.ubuntu-search section > h1,
 body.ubuntu-search section article h1,
 body.search-results section > h1,
@@ -5238,9 +5246,9 @@ footer.global {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
-  -moz-box-shadow: inset 0 2px 2px -1px lightgray;
+  -moz-box-shadow: inset 0 2px 2px -1px lightgrey;
-  -webkit-box-shadow: inset 0 2px 2px -1px lightgray;
+  -webkit-box-shadow: inset 0 2px 2px -1px lightgrey;
-  box-shadow: inset 0 2px 2px -1px lightgray;
+  box-shadow: inset 0 2px 2px -1px lightgrey;
  background: none;
  border-top: 0;
  clear: both;
@@ -5263,7 +5271,7 @@ footer.global .legal {
  clear: both;
  min-height: 40px;
 }
-/* line 31, ../sass/core/patterns/_footer.scss */
+/* line 32, ../sass/core/patterns/_footer.scss */
 footer.global .legal p,
 footer.global .legal ul {
  padding-left: 0;
@@ -5349,7 +5357,7 @@ footer.global .top-link {
  -moz-box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.3) inset;
  -webkit-box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.3) inset;
  box-shadow: 0 -4px 4px -4px rgba(0, 0, 0, 0.3) inset;
-  background: none repeat scroll 0 0 transparent;
+  background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
  border: 0 none;
  float: left;
  font-size: 0.75em;
@@ -5513,7 +5521,7 @@ html.no-svg footer.global .top-link a, .opera-mini footer.global .top-link a {
  margin-bottom: 0.75em;
  font-weight: normal;
 }
-/* line 70, ../sass/core/patterns/_contextual-footer.scss */
+/* line 72, ../sass/core/patterns/_contextual-footer.scss */
 #context-footer .list a:after,
 #context-footer a.link-arrow:after,
 #context-footer nav ul li h2 a:after {
@@ -5564,7 +5572,7 @@ html.no-svg footer.global .top-link a, .opera-mini footer.global .top-link a {
    margin: 0 -40px 40px;
  }
 }
-/* line 3, ../sass/core/patterns/_buttons.scss */
+/* line 9, ../sass/core/patterns/_buttons.scss */
 a.link-cta-ubuntu,
 a.link-cta-canonical,
 a.link-cta-inverted,
@@ -5596,7 +5604,7 @@ form input[type="submit"] {
  text-align: center;
 }
-/* line 29, ../sass/core/patterns/_buttons.scss */
+/* line 30, ../sass/core/patterns/_buttons.scss */
 a.cta-large,
 button.cta-large {
  font-size: 1.28571em;
@@ -5604,7 +5612,7 @@ button.cta-large {
  padding: 10px 20px;
 }
-/* line 35, ../sass/core/patterns/_buttons.scss */
+/* line 38, ../sass/core/patterns/_buttons.scss */
 a.link-cta-canonical,
 button.cta-canonical,
 form button.cta-canonical[type="submit"],
@@ -5613,21 +5621,21 @@ form input.cta-canonical[type="submit"] {
  color: #fff;
 }
-/* line 43, ../sass/core/patterns/_buttons.scss */
+/* line 44, ../sass/core/patterns/_buttons.scss */
 a.link-cta-inverted,
 button.cta-inverted {
  background: #fff;
  color: #333333;
 }
-/* line 49, ../sass/core/patterns/_buttons.scss */
+/* line 50, ../sass/core/patterns/_buttons.scss */
 .row-enterprise a.link-cta-canonical,
 .row-enterprise button.link-cta-canonical {
  background: #fff;
  color: #772953;
 }
-/* line 55, ../sass/core/patterns/_buttons.scss */
+/* line 59, ../sass/core/patterns/_buttons.scss */
 a.link-cta-ubuntu:hover,
 a.link-cta-ubuntu:hover,
 button.cta-ubuntu:hover,
@@ -5637,14 +5645,14 @@ form input[type="submit"]:hover {
  text-decoration: none;
 }
-/* line 64, ../sass/core/patterns/_buttons.scss */
+/* line 65, ../sass/core/patterns/_buttons.scss */
 a.link-cta-canonical:hover,
 button.cta-canonical:hover {
  background: #5f2143;
  text-decoration: none;
 }
-/* line 70, ../sass/core/patterns/_buttons.scss */
+/* line 73, ../sass/core/patterns/_buttons.scss */
 a.link-cta-inverted:hover,
 .row-enterprise a.link-cta-canonical:hover,
 button.cta-inverted:hover,
@@ -5653,7 +5661,7 @@ button.cta-inverted:hover,
  text-decoration: underline;
 }
-/* line 78, ../sass/core/patterns/_buttons.scss */
+/* line 81, ../sass/core/patterns/_buttons.scss */
 a.cta-deactivated,
 a.cta-deactivated:hover,
 button.cta-deactivated,
@@ -5664,7 +5672,7 @@ button.cta-deactivated:hover {
 }
 @media only screen and (min-width: 768px) {
-  /* line 89, ../sass/core/patterns/_buttons.scss */
+  /* line 95, ../sass/core/patterns/_buttons.scss */
  a.link-cta-ubuntu,
  a.link-cta-canonical,
  a.link-cta-inverted,
@@ -5676,7 +5684,7 @@ button.cta-deactivated:hover {
  }
 }
 @media only screen and (min-width: 984px) {
-  /* line 106, ../sass/core/patterns/_buttons.scss */
+  /* line 112, ../sass/core/patterns/_buttons.scss */
  a.link-cta-ubuntu,
  a.link-cta-canonical,
  a.link-cta-inverted,
@@ -5687,7 +5695,7 @@ button.cta-deactivated:hover {
    width: auto;
  }
 }
-/* line 4, ../sass/core/patterns/_forms.scss */
+/* line 6, ../sass/core/patterns/_forms.scss */
 form input,
 form select,
 form textarea {
@@ -5700,7 +5708,7 @@ form textarea {
 form .fieldset-submit ul {
  margin-bottom: 0;
 }
-/* line 16, ../sass/core/patterns/_forms.scss */
+/* line 18, ../sass/core/patterns/_forms.scss */
 form fieldset .mktError,
 form fieldset .errMsg,
 form fieldset .reqMark {
@@ -5818,7 +5826,7 @@ form fieldset .mktFormMsg {
  background-color: rgba(255, 255, 255, 0.6);
  text-align: center;
 }
-/* line 118, ../sass/core/patterns/_rows.scss */
+/* line 119, ../sass/core/patterns/_rows.scss */
 .row-aux h2,
 .row-aux p {
  text-align: left;
@@ -5890,7 +5898,7 @@ form fieldset .mktFormMsg {
    border: 0;
  }
 }
-/* line 3, ../sass/core/patterns/_image-centered.scss */
+/* line 6, ../sass/core/patterns/_image-centered.scss */
 .row.row-image-centered,
 div.box-image-centered,
 div.row-image-centered,
@@ -5915,7 +5923,7 @@ div.row.row-image-centered {
  padding-top: 0;
 }
-/* line 29, ../sass/core/patterns/_image-centered.scss */
+/* line 30, ../sass/core/patterns/_image-centered.scss */
 div.row-image-centered div,
 div.row-image-centered span,
 div.box-image-centered div,
@@ -5941,7 +5949,7 @@ div.row.row-image-centered span img {
  margin: 0 auto;
  margin-bottom: 20px;
 }
-/* line 48, ../sass/core/patterns/_image-centered.scss */
+/* line 50, ../sass/core/patterns/_image-centered.scss */
 div.row-image-centered p,
 div.row-image-centered h2,
 div.row-image-centered h3,
@@ -5955,7 +5963,7 @@ div.row.row-image-centered h3 {
 }
 @media only screen and (min-width: 768px) {
-  /* line 57, ../sass/core/patterns/_image-centered.scss */
+  /* line 59, ../sass/core/patterns/_image-centered.scss */
  div.row-image-centered,
  div.row.row-image-centered,
  div.box-image-centered {
@@ -5973,7 +5981,7 @@ div.row.row-image-centered h3 {
    display: table-cell;
    position: relative;
  }
-  /* line 69, ../sass/core/patterns/_image-centered.scss */
+  /* line 71, ../sass/core/patterns/_image-centered.scss */
  div.row-image-centered div p,
  div.row-image-centered div h2,
  div.row-image-centered div h3,
@@ -6025,7 +6033,7 @@ div.row.row-image-centered h3 {
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
  }
-  /* line 108, ../sass/core/patterns/_image-centered.scss */
+  /* line 109, ../sass/core/patterns/_image-centered.scss */
  .align-vertically img,
  .align-vertically div {
    -ms-transform: translateY(-50%);
@@ -6041,7 +6049,7 @@ div.box-image-centered {
 }
 @media only screen and (min-width: 768px) {
-  /* line 125, ../sass/core/patterns/_image-centered.scss */
+  /* line 128, ../sass/core/patterns/_image-centered.scss */
  .row.row-image-centered,
  div.box-image-centered,
  div.row-image-centered,
@@ -6049,7 +6057,7 @@ div.box-image-centered {
    padding: 30px;
  }
-  /* line 132, ../sass/core/patterns/_image-centered.scss */
+  /* line 137, ../sass/core/patterns/_image-centered.scss */
  div.box-image-centered div + span img,
  div.row-image-centered div + span img,
  div.row.row-image-centered div + span img,
@@ -6062,7 +6070,7 @@ div.box-image-centered {
  }
 }
 @media only screen and (min-width: 984px) {
-  /* line 147, ../sass/core/patterns/_image-centered.scss */
+  /* line 150, ../sass/core/patterns/_image-centered.scss */
  .row.row-image-centered,
  div.row-image-centered,
  div.row.row-image-centered,
@@ -6082,7 +6090,7 @@ div.box-image-centered {
    display: table-cell;
    position: relative;
  }
-  /* line 160, ../sass/core/patterns/_image-centered.scss */
+  /* line 162, ../sass/core/patterns/_image-centered.scss */
  .row.row-image-centered div p,
  .row.row-image-centered div h2,
  .row.row-image-centered div h3,
@@ -6271,18 +6279,18 @@ div.box-image-centered {
 .resource h2 {
  padding-right: 20px;
 }
-/* line 125, ../sass/core/patterns/_boxes.scss */
+/* line 126, ../sass/core/patterns/_boxes.scss */
 .resource.five-col h2 a:link,
 .resource.five-col h2 a:visited, .resource.four-col h2 a:link,
 .resource.four-col h2 a:visited {
  font-size: inherit !important;
 }
-/* line 132, ../sass/core/patterns/_boxes.scss */
+/* line 133, ../sass/core/patterns/_boxes.scss */
 .resource.four-col h2 a:link,
 .resource.four-col h2 a:visited {
  font-size: 1.125em;
 }
-/* line 139, ../sass/core/patterns/_boxes.scss */
+/* line 140, ../sass/core/patterns/_boxes.scss */
 .resource.twelve-col h2 a:link,
 .resource.twelve-col h2 a:visited {
  font-size: 1.40625em;
@@ -6440,7 +6448,7 @@ div > .arrow-left {
    visibility: visible;
  }
 }
-/* line 3, ../sass/core/patterns/_lists.scss */
+/* line 5, ../sass/core/patterns/_lists.scss */
 .list,
 .list-ubuntu,
 .list-canonical {
@@ -6455,7 +6463,7 @@ div > .arrow-left {
  margin-bottom: 0;
  padding: 10px 0;
 }
-/* line 15, ../sass/core/patterns/_lists.scss */
+/* line 16, ../sass/core/patterns/_lists.scss */
 .list li:last-of-type,
 .list li.last-item,
 .list-ubuntu li:last-of-type,
@@ -6473,7 +6481,7 @@ div > .arrow-left {
  padding: 10px 0;
 }
-/* line 28, ../sass/core/patterns/_lists.scss */
+/* line 29, ../sass/core/patterns/_lists.scss */
 .list-spaced article,
 .list-spaced li {
  padding: 30px 0;
@@ -6484,7 +6492,7 @@ nav .list a {
  display: block;
 }
-/* line 37, ../sass/core/patterns/_lists.scss */
+/* line 38, ../sass/core/patterns/_lists.scss */
 .list-ubuntu li,
 .list-canonical li {
  background-repeat: no-repeat;
@@ -6512,7 +6520,7 @@ nav .list a {
  background-image: url("//assets.ubuntu.com/sites/ubuntu/latest/u/img/patterns/tick-darkaubergine.svg");
 }
-/* line 52, ../sass/core/patterns/_lists.scss */
+/* line 53, ../sass/core/patterns/_lists.scss */
 .vertical-divider .list-canonical li,
 .vertical-divider .list-ubuntu li {
  padding-left: 25px;
@@ -6545,7 +6553,7 @@ html.no-svg .list-dark li,
  margin-left: 0;
 }
-/* line 82, ../sass/core/patterns/_lists.scss */
+/* line 83, ../sass/core/patterns/_lists.scss */
 .row .combined-list ul,
 .row .combined-list div {
  margin-bottom: 0;
@@ -6555,7 +6563,7 @@ html.no-svg .list-dark li,
  border-bottom: 1px dotted #888888;
  padding-bottom: 10px;
 }
-/* line 92, ../sass/core/patterns/_lists.scss */
+/* line 93, ../sass/core/patterns/_lists.scss */
 .row .combined-list div.last-col,
 .row .combined-list ul.last-col {
  margin-bottom: 20px;
@@ -6580,7 +6588,7 @@ html.no-svg .list-dark li,
 }
 @media only screen and (min-width: 768px) {
-  /* line 117, ../sass/core/patterns/_lists.scss */
+  /* line 118, ../sass/core/patterns/_lists.scss */
  .row .combined-list ul,
  .row .combined-list div {
    margin-bottom: 20px;
@@ -6667,11 +6675,10 @@ ul.inline-logos img {
    display: inline-block;
    height: auto;
    margin: 20px 0;
-    border-right: 1px dotted #bbb;
    line-height: 60px;
    padding: 0 40px;
  }
-  /* line 72, ../sass/core/patterns/_inline-logos.scss */
+  /* line 71, ../sass/core/patterns/_inline-logos.scss */
  ul.inline-logos li img {
    float: none;
    vertical-align: middle;
@@ -6680,7 +6687,7 @@ ul.inline-logos img {
  }
 }
 @media only screen and (min-width: 984px) {
-  /* line 85, ../sass/core/patterns/_inline-logos.scss */
+  /* line 84, ../sass/core/patterns/_inline-logos.scss */
  .inline-icons {
    text-align: left;
    margin-bottom: 20px;
@@ -6726,7 +6733,7 @@ blockquote.pull-quote.js {
  padding-left: 60px;
  display: table-cell;
 }
-/* line 41, ../sass/core/patterns/_blockquotes.scss */
+/* line 42, ../sass/core/patterns/_blockquotes.scss */
 blockquote.quote-canonical, blockquote.quote-canonical-white {
  font-size: 1.14286em;
  margin-bottom: 0.75em;
@@ -6859,7 +6866,7 @@ html.no-svg blockquote.quote-right-bottom,
  padding: 0;
 }
-/* line 177, ../sass/core/patterns/_blockquotes.scss */
+/* line 178, ../sass/core/patterns/_blockquotes.scss */
 blockquote.quote-canonical,
 blockquote.quote-canonical-white {
  background: none;
@@ -6887,7 +6894,7 @@ blockquote.quote-canonical-white {
    margin-bottom: 0.48329em;
  }
-  /* line 206, ../sass/core/patterns/_blockquotes.scss */
+  /* line 207, ../sass/core/patterns/_blockquotes.scss */
  blockquote.pull-quote p,
  .row-quote blockquote p {
    padding-left: 0;
@@ -6906,7 +6913,7 @@ blockquote.quote-canonical-white {
    text-indent: 0;
  }
-  /* line 222, ../sass/core/patterns/_blockquotes.scss */
+  /* line 223, ../sass/core/patterns/_blockquotes.scss */
  blockquote.pull-quote p span,
  .row-quote blockquote p span {
    top: 5px;
@@ -6927,7 +6934,7 @@ blockquote.quote-canonical-white {
    text-indent: -10px;
  }
-  /* line 247, ../sass/core/patterns/_blockquotes.scss */
+  /* line 248, ../sass/core/patterns/_blockquotes.scss */
  blockquote.pull-quote p span,
  .row-quote blockquote p span {
    top: 10px;
@@ -7115,7 +7122,7 @@ html.yui3-js-enabled .accordion-button.active {
    *zoom: 1;
    padding: 20px 40px 0;
  }
-  /* line 47, ../sass/core/_core-mixins.scss */
+  /* line 48, ../sass/core/_core-mixins.scss */
  .tabbed-content:before, .tabbed-content:after {
    content: "";
    display: table;
@@ -7167,7 +7174,7 @@ html.yui3-js-enabled .accordion-button.active {
  padding-bottom: 40px;
 }
-/* line 7, ../sass/core/patterns/_vertical-divider.scss */
+/* line 8, ../sass/core/patterns/_vertical-divider.scss */
 .vertical-divider div,
 .vertical-divider li {
  border-right: 0;
@@ -7191,14 +7198,14 @@ html.yui3-js-enabled .accordion-button.active {
 }
 @media only screen and (max-width: 767px) {
-  /* line 28, ../sass/core/patterns/_vertical-divider.scss */
+  /* line 29, ../sass/core/patterns/_vertical-divider.scss */
  .vertical-divider > div,
  .vertical-divider > li {
    border-bottom: 1px dotted #888888;
    padding-bottom: 20px;
  }
-  /* line 34, ../sass/core/patterns/_vertical-divider.scss */
+  /* line 36, ../sass/core/patterns/_vertical-divider.scss */
  .vertical-divider div:last-of-type,
  .vertical-divider li:last-of-type,
  .inline-icons li:last-of-type {
@@ -7211,7 +7218,7 @@ html.yui3-js-enabled .accordion-button.active {
    padding-bottom: 0;
  }
-  /* line 45, ../sass/core/patterns/_vertical-divider.scss */
+  /* line 46, ../sass/core/patterns/_vertical-divider.scss */
  .equal-height div,
  .equal-height li {
    height: auto !important;
@@ -7223,7 +7230,7 @@ html.yui3-js-enabled .accordion-button.active {
    padding-bottom: 60px;
  }
-  /* line 65, ../sass/core/patterns/_vertical-divider.scss */
+  /* line 66, ../sass/core/patterns/_vertical-divider.scss */
  .vertical-divider > div,
  .vertical-divider > li {
    border-right: 1px dotted #888888;
@@ -7234,7 +7241,7 @@ html.yui3-js-enabled .accordion-button.active {
    padding-right: 20px;
    vertical-align: top;
  }
-  /* line 76, ../sass/core/patterns/_vertical-divider.scss */
+  /* line 81, ../sass/core/patterns/_vertical-divider.scss */
  .vertical-divider > div:last-child,
  .vertical-divider > li:last-child,
  .vertical-divider > div.last-col,
@@ -7244,7 +7251,7 @@ html.yui3-js-enabled .accordion-button.active {
    border-right: 0;
    padding-right: 0;
  }
-  /* line 86, ../sass/core/patterns/_vertical-divider.scss */
+  /* line 91, ../sass/core/patterns/_vertical-divider.scss */
  .vertical-divider > div:first-child,
  .vertical-divider > li:first-child,
  .vertical-divider > div.first-col,
@@ -7323,7 +7330,7 @@ html.yui3-js-enabled .accordion-button.active {
 .slider .slide p {
  width: 350px;
 }
-/* line 71, ../sass/core/patterns/_slider.scss */
+/* line 72, ../sass/core/patterns/_slider.scss */
 .slider .arrow-prev,
 .slider .arrow-next {
  font-size: 5em;
@@ -7332,19 +7339,19 @@ html.yui3-js-enabled .accordion-button.active {
  color: #888888;
  outline: 0;
 }
-/* line 80, ../sass/core/patterns/_slider.scss */
+/* line 81, ../sass/core/patterns/_slider.scss */
 .slider .arrow-prev:hover,
 .slider .arrow-next:hover {
  text-decoration: none;
  color: #333333;
 }
-/* line 86, ../sass/core/patterns/_slider.scss */
+/* line 87, ../sass/core/patterns/_slider.scss */
 .slider .arrow-prev:active,
 .slider .arrow-next:active {
  padding-top: 1px;
  text-decoration: none;
 }
-/* line 92, ../sass/core/patterns/_slider.scss */
+/* line 93, ../sass/core/patterns/_slider.scss */
 .slider .arrow-prev:focus,
 .slider .arrow-next:focus {
  text-decoration: none;
@@ -7407,7 +7414,7 @@ html.yui3-js-enabled .accordion-button.active {
  margin-bottom: 0;
 }
-/* line 55, ../sass/core/patterns/_tooltips.scss */
+/* line 56, ../sass/core/patterns/_tooltips.scss */
 .yui3-tooltip .yui3-widget-ft,
 .yui3-tooltip .yui3-widget-ft div {
  position: absolute;
@@ -7418,7 +7425,7 @@ html.yui3-js-enabled .accordion-button.active {
  font-size: 0;
 }
-/* line 65, ../sass/core/patterns/_tooltips.scss */
+/* line 66, ../sass/core/patterns/_tooltips.scss */
 .yui3-tooltip .yui3-tooltip-align-bottom .yui3-widget-ft,
 .yui3-tooltip .yui3-tooltip-align-bottom .yui3-widget-ft div {
  top: -10px;
@@ -7545,7 +7552,7 @@ h1 small, h2 small {
  background: #ed6637;
 }
-/* line 14, ../sass/style.scss */
+/* line 15, ../sass/style.scss */
 a::selection, a *::selection {
  background: #888888;
 }
@@ -7564,7 +7571,7 @@ input[type=text]::-ms-reveal {
  height: 0;
 }
-/* line 23, ../sass/style.scss */
+/* line 26, ../sass/style.scss */
 input[type="search"]::-webkit-search-decoration,
 input[type="search"]::-webkit-search-cancel-button,
 input[type="search"]::-webkit-search-results-button,
@@ -7593,47 +7600,57 @@ body.node-type-community-page {
 header.banner {
  margin-bottom: 0;
 }
-/* line 48, ../sass/style.scss */
+/* line 47, ../sass/style.scss */
+header.banner .search-toggle {
+  position: static;
+  float: right;
+}
+/* line 51, ../sass/style.scss */
+header.banner .nav-toggle {
+  position: static;
+  float: left;
+}
+/* line 57, ../sass/style.scss */
 header.banner .nav-primary ul li a {
  line-height: 17px;
 }
-/* line 53, ../sass/style.scss */
+/* line 62, ../sass/style.scss */
 header.banner.inverted {
  background: #f7f7f7;
  margin-bottom: 20px;
 }
-/* line 58, ../sass/style.scss */
+/* line 67, ../sass/style.scss */
 header.banner.inverted .nav-primary ul {
  border-color: white;
  margin-top: 1px;
 }
-/* line 63, ../sass/style.scss */
+/* line 72, ../sass/style.scss */
 header.banner.inverted .nav-primary ul li, header.banner.inverted .nav-primary ul li:last-child {
  border-color: #eaeaea;
 }
-/* line 67, ../sass/style.scss */
+/* line 77, ../sass/style.scss */
 header.banner.inverted .nav-primary ul li a:link, header.banner.inverted .nav-primary ul li a:visited {
  border-color: white;
  color: #6f6f6f;
 }
-/* line 72, ../sass/style.scss */
+/* line 81, ../sass/style.scss */
 header.banner.inverted .nav-primary ul li a:hover {
  background: #eaeaea;
  color: #454545;
 }
-/* line 80, ../sass/style.scss */
+/* line 90, ../sass/style.scss */
 header.banner.inverted .nav-primary a.active, header.banner.inverted .nav-primary a:active {
  border-color: #eaeaea;
  background: #eaeaea;
 }
-/* line 88, ../sass/style.scss */
+/* line 97, ../sass/style.scss */
 header.banner.inverted .header-search {
  overflow: hidden;
  padding: 4px 0 0 14px;
  max-width: 240px;
  float: right;
 }
-/* line 94, ../sass/style.scss */
+/* line 103, ../sass/style.scss */
 header.banner.inverted .header-search input[type="search"] {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
@@ -7650,7 +7667,7 @@ header.banner.inverted .header-search input[type="search"] {
  width: 100%;
  border: none;
  margin-bottom: 0;
-  background-color: transparent;
+  background-color: rgba(0, 0, 0, 0);
  -webkit-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.2);
  -mox-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.2);
  -ms-box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.2);
@@ -7661,7 +7678,7 @@ header.banner.inverted .header-search input[type="search"] {
  padding: .5em 2.5em .5em .5em;
  color: #555;
 }
-/* line 111, ../sass/style.scss */
+/* line 120, ../sass/style.scss */
 header.banner.inverted .header-search input[type="search"]:focus {
  background: rgba(0, 0, 0, 0.05);
 }
@@ -7681,7 +7698,7 @@ header.banner.inverted .header-search input[type="search"]::-moz-placeholder {
 header.banner.inverted .header-search input[type="search"]:-ms-input-placeholder {
  color: #555555;
 }
-/* line 117, ../sass/style.scss */
+/* line 126, ../sass/style.scss */
 header.banner.inverted .header-search button[type="submit"] {
  padding: 5px 2px;
  line-height: 0;
@@ -7691,11 +7708,13 @@ header.banner.inverted .header-search button[type="submit"] {
  background: none;
  overflow: visible;
 }
-/* line 129, ../sass/style.scss */
+@media only screen and (min-width: 768px) {
-header.banner .site-name {
+  /* line 138, ../sass/style.scss */
-  float: right;
+  header.banner .site-name {
+    float: right;
+  }
 }
-/* line 131, ../sass/style.scss */
+/* line 142, ../sass/style.scss */
 header.banner .site-name .logo-ubuntuit {
  font-size: 2.4em;
  margin-bottom: 0;

--- a/sass/style.scss
+++ b/sass/style.scss
@@ -8,13 +8,13 @@
 // Override default text selection color
 ::selection {
-    background:lighten($ubuntu-orange, 10%);
+	background:lighten($ubuntu-orange, 10%);
 }
 a {
-    &::selection,
+	&::selection,
-    & *::selection {
+	& *::selection {
-        background:$warm-grey;
+		background:$warm-grey;
-    }
+	}
 }
 // Remove unwanted "x"es from search box (webkit and ie)
@@ -26,117 +26,128 @@ input[type="search"]::-webkit-search-results-button,
 input[type="search"]::-webkit-search-results-decoration { display: none; }
 .logo {
-    position:absolute;
+	position:absolute;
-    top:0;
+	top:0;
-    left:0;
+	left:0;
-    z-index:10;
+	z-index:10;
-    body.toolbar & {
+	body.toolbar & {
-        top:30px;
+		top:30px;
-    }
+	}
 }
 // Custom background for community pages
 body.node-type-community-page {
-    background: url("../img/dotted.png") repeat scroll 0 0 #F5F6F7;
+	background: url("../img/dotted.png") repeat scroll 0 0 #F5F6F7;
 }
 header.banner {
-    margin-bottom:0;
+	margin-bottom:0;
-    .nav-primary {
+	.search-toggle {
-        ul li a {
+		position: static;
-            line-height: 17px;
+		float: right;
-        }
+	}
-    }
+	.nav-toggle {
+		position: static;
-    &.inverted {
+		float: left;
-        background: $light-grey;
+	}
-        margin-bottom:20px;
+	.nav-primary {
-        .nav-primary {
+		ul li a {
-            ul {
+			line-height: 17px;
-                border-color:lighten($light-grey, 10%);
+		}
-                margin-top:1px;
+	}
-                li {
+	&.inverted {
-                    &, &:last-child {
+		background: $light-grey;
-                        border-color:darken($light-grey, 5%);
+		margin-bottom:20px;
-                    }
-                    a {
+		.nav-primary {
-                        &:link,
+			ul {
-                        &:visited {
+				border-color:lighten($light-grey, 10%);
-                            border-color:lighten($light-grey, 7%);
+				margin-top:1px;
-                            color:darken($warm-grey, 10%);
-                        }
+				li {
-                        &:hover {
+					&, &:last-child {
-                            background:darken($light-grey, 5%);
+						border-color:darken($light-grey, 5%);
-                            color:lighten($cool-grey, 7%);
+					}
-                        }
+					a {
-                    }
+						&:link,
-                }
+						&:visited {
-            }
+							border-color:lighten($light-grey, 7%);
-            a {
+							color:darken($warm-grey, 10%);
-                &.active,
+						}
-                &:active {
+						&:hover {
-                    border-color:darken($light-grey, 5%);
+							background:darken($light-grey, 5%);
-                    background:darken($light-grey, 5%);
+							color:lighten($cool-grey, 7%);
-                }
+						}
-            }
+					}
-        }
+				}
+			}
-        .header-search {
+			a {
-            overflow:hidden;
+				&.active,
-            padding: 4px 0 0 14px;
+				&:active {
-            max-width:240px;
+					border-color:darken($light-grey, 5%);
-            float:right;
+					background:darken($light-grey, 5%);
+				}
-            input[type="search"] {
+			}
-                @include box-sizing(border-box);
+		}
-                -webkit-appearance:none;
-                float:left;
+		.header-search {
-                display:block;
+			overflow:hidden;
-                @include font-size(16);
+			padding: 4px 0 0 14px;
-                height:2.1em;
+			max-width:240px;
-                @include rounded-corners(4px);
+			float:right;
-                width:100%;
-                border:none;
+			input[type="search"] {
-                margin-bottom:0;
+				@include box-sizing(border-box);
-                background-color: rgba(0, 0, 0, 0);
+				-webkit-appearance:none;
-                @include box-shadow(inset 0 1px 4px rgba(0,0,0,.2));
+				float:left;
-                @include transition(); // Use defaults
+				display:block;
-                padding:.5em 2.5em .5em .5em;
+				@include font-size(16);
-                color:#555;
+				height:2.1em;
+				@include rounded-corners(4px);
-                &:focus {
+				width:100%;
-                    background: rgba(0, 0, 0, 0.05);
+				border:none;
-                }
+				margin-bottom:0;
+				background-color: rgba(0, 0, 0, 0);
-                @include placeholder(#555);
+				@include box-shadow(inset 0 1px 4px rgba(0,0,0,.2));
-            }
+				@include transition(); // Use defaults
-            button[type="submit"] {
+				padding:.5em 2.5em .5em .5em;
-                padding:5px 2px;
+				color:#555;
-                line-height:0;
-                float:left;
+				&:focus {
-                margin-left:-40px;
+					background: rgba(0, 0, 0, 0.05);
-                display:block;
+				}
-                background:none;
-                overflow:visible;
+				@include placeholder(#555);
-            }
+			}
-        }
+			button[type="submit"] {
-    }
+				padding:5px 2px;
+				line-height:0;
-    .site-name {
+				float:left;
-        float:right;
+				margin-left:-40px;
-        .logo-ubuntuit {
+				display:block;
-            font-size: 2.4em;
+				background:none;
-            margin-bottom:0;
+				overflow:visible;
-            position:relative;
+			}
-            text-transform:lowercase;
+		}
-            margin:0;
+	}
-            display:inline-block;
-            margin-left:20px;
+	.site-name {
-            font-weight:300;
+		@media #{$breakpoint-medium} {
-        }
+			float:right;
-    }
+		}
+		.logo-ubuntuit {
+			font-size: 2.4em;
+			margin-bottom:0;
+			position:relative;
+			text-transform:lowercase;
+			margin:0;
+			display:inline-block;
+			margin-left:20px;
+			font-weight:300;
+		}
+	}
 }
--- a/valencia.info
+++ b/valencia.info
@@ -10,8 +10,8 @@ engine = phptemplate
 stylesheets[all][] = css/style.css
 ; SCRIPTS
-scripts[] = js/yui-min.js
+;scripts[] = js/yui-min.js
-scripts[] = js/core.js
+;scripts[] = js/core.js
 ; CORE REGIONS
 regions[page_top] = Page Top