Cacher is the code snippet organizer for pro developers

/*ALSO USED NORMALIZE.CSS BUT DID NOT INCLUDE IT HERE*/

@font-face {
    font-family:"Flaticon";
    src: url("fonts/flaticon.eot");
    src: url("fonts/flaticon.eot#iefix") format("embedded-opentype"), url("fonts/flaticon.woff") format("woff"), url("fonts/flaticon.ttf") format("truetype"), url("fonts/flaticon.svg") format("svg");
    font-weight: normal;
    font-style: normal;
}
[class^="flaticon-"]:before, [class*=" flaticon-"]:before, [class^="flaticon-"]:after, [class*=" flaticon-"]:after {
    font-family: Flaticon;
    font-size: 30px;
    font-style: normal;
}
.flaticon-blood:before {
    content:"\e000";
}
.flaticon-bread4:before {
    content:"\e001";
}
.flaticon-coffee11:before {
    content:"\e002";
}
.flaticon-cool5:before {
    content:"\e003";
}
.flaticon-dessert:before {
    content:"\e004";
}
.flaticon-dish:before {
    content:"\e005";
}
.flaticon-drink14:before {
    content:"\e006";
}
.flaticon-favourites1:before {
    content:"\e007";
}
.flaticon-fork4:before {
    content:"\e008";
}
.flaticon-full5:before {
    content:"\e009";
}
.flaticon-glass20:before {
    content:"\e00a";
}
.flaticon-ice19:before {
    content:"\e00b";
}
.flaticon-italian1:before {
    content:"\e00c";
}
.flaticon-pizza3:before {
    content:"\e00d";
}
.flaticon-star2:before {
    content:"\e00e";
}
.flaticon-star39:before {
    content:"\e00f";
}
.flaticon-tall14:before {
    content:"\e010";
}
.flaticon-wine2:before {
    content:"\e011";
}
.flaticon-wine39:before {
    content:"\e012";
}
/*Main Styles*/
 body {
    font-family:'News Cycle', 'Open Sans', 'Helvetica', 'Helvetica Neue', Arial, sans-serif;
    letter-spacing: 1px;
    font-size: 16px;
}

.pure-g-r *, .pure-g * {
   font-family:'News Cycle', 'Open Sans', 'Helvetica', 'Helvetica Neue', Arial, sans-serif;
}
.nested {
    padding: 0 2em 0 0;
}
.nested:last-child {
    padding-right: 0;
}
/*Menu*/
 .home-menu.pure-menu-open {
    background: #EDEDF3;
}
.home-menu .pure-menu-heading {
    color: #2D3E50;
    float: left;
}
.home-menu li a {
    color: #2d3e50;
    background:#ffffff;
}
.home-menu li.pure-menu-selected a {
    color: #dc3d3a;
}
.home-menu li a:hover {
    background: #f8f8fb;
    color: #dc3d3a;
}
/*Buttons*/
 a.pure-button-primary {
    border-radius: 1px;
}
/*LOGO*/
 .logo-container {
    margin: 0 auto;
    max-width: 350px;
}

.logo-container img {
  padding: 10px 0;
}
/*SPLASH*/
 .splash-head {
    font-size: 150%;
    padding: .5em;
    border: none;
}
.splash {
    top:30px;
    width: 80%
}
.splash figure {
    margin-bottom: 20px;
}
.splash figure img {
    max-width: 80%;
    border: 6px solid #A4617F;
    border-radius: 50%;
}
.splash figure:last-child img {

}
.splash .pure-button-primary {
    font-size: 150%;
}
/* Menu Content*/
 .content-head {
    text-transform: none;
    margin: 1em 0;
}
.menu-category {
    margin: 0;
    padding-bottom: .2em;
    margin-bottom: .6em;
}
.content-subhead {
    font-family: Neucha;
}
.menu-items {
    display: table;
}
.menu-items.last {
    margin-bottom: 20px;
}
.row-item {
    display: table-row;
}
.menu-item, .menu-delimiter, .menu-price {
    display: table-cell;
}
.menu-item, .menu-price {
    width: auto;
    white-space: nowrap;
    position: relative;
    top: .5em;
}
.menu-item {
    padding-right: .2em;
}
.menu-price {
    padding-left: .2em;
}
.menu-delimiter {
    width: 100%;
    border-bottom: dashed 2px #7f8c8d;
}
/*BORDER STYLES*/
 .stretch {
    border-width: 10px;
    padding: 10px;
}
.image-red {
    -moz-border-image:url(img/red-dot@2x.png) 10 10 stretch;
    /* for Firefox */
    -webkit-border-image:url(img/red-dot@2x.png) 30 30 stretch;
    /* for Safari and Chrome */
    -o-border-image:url(img/red-dot@2x.png) 30 30 stretch;
    /* for Opera */
    border-image:url(img/red-dot@2x.png) 30 30 stretch;
}
.image-purple {
    -moz-border-image:url(img/purple-dot@2x.png) 10 10 stretch;
    /* for Firefox */
    -webkit-border-image:url(img/purple-dot@2x.png) 30 30 stretch;
    /* for Safari and Chrome */
    -o-border-image:url(img/purple-dot@2x.png) 30 30 stretch;
    /* for Opera */
    border-image:url(img/purple-dot@2x.png) 30 30 stretch;
}
@media (max-width: 767px) {
    .splash figure img {
        max-width: 200px;
    }
}

@media screen and (min-width: 35.5em) {
    .pure-u-sm-1,
    .pure-u-sm-1-1,
    .pure-u-sm-1-2,
    .pure-u-sm-1-3,
    .pure-u-sm-2-3,
    .pure-u-sm-1-4,
    .pure-u-sm-3-4,
    .pure-u-sm-1-5,
    .pure-u-sm-2-5,
    .pure-u-sm-3-5,
    .pure-u-sm-4-5,
    .pure-u-sm-5-5,
    .pure-u-sm-1-6,
    .pure-u-sm-5-6,
    .pure-u-sm-1-8,
    .pure-u-sm-3-8,
    .pure-u-sm-5-8,
    .pure-u-sm-7-8,
    .pure-u-sm-1-12,
    .pure-u-sm-5-12,
    .pure-u-sm-7-12,
    .pure-u-sm-11-12,
    .pure-u-sm-1-24,
    .pure-u-sm-2-24,
    .pure-u-sm-3-24,
    .pure-u-sm-4-24,
    .pure-u-sm-5-24,
    .pure-u-sm-6-24,
    .pure-u-sm-7-24,
    .pure-u-sm-8-24,
    .pure-u-sm-9-24,
    .pure-u-sm-10-24,
    .pure-u-sm-11-24,
    .pure-u-sm-12-24,
    .pure-u-sm-13-24,
    .pure-u-sm-14-24,
    .pure-u-sm-15-24,
    .pure-u-sm-16-24,
    .pure-u-sm-17-24,
    .pure-u-sm-18-24,
    .pure-u-sm-19-24,
    .pure-u-sm-20-24,
    .pure-u-sm-21-24,
    .pure-u-sm-22-24,
    .pure-u-sm-23-24,
    .pure-u-sm-24-24 {
        display: inline-block;
        *display: inline;
        zoom: 1;
        letter-spacing: normal;
        word-spacing: normal;
        vertical-align: top;
        text-rendering: auto;
    }

    .pure-u-sm-1-24 {
        width: 4.1667%;
        *width: 4.1357%;
    }

    .pure-u-sm-1-12,
    .pure-u-sm-2-24 {
        width: 8.3333%;
        *width: 8.3023%;
    }

    .pure-u-sm-1-8,
    .pure-u-sm-3-24 {
        width: 12.5000%;
        *width: 12.4690%;
    }

    .pure-u-sm-1-6,
    .pure-u-sm-4-24 {
        width: 16.6667%;
        *width: 16.6357%;
    }

    .pure-u-sm-1-5 {
        width: 20%;
        *width: 19.9690%;
    }

    .pure-u-sm-5-24 {
        width: 20.8333%;
        *width: 20.8023%;
    }

    .pure-u-sm-1-4,
    .pure-u-sm-6-24 {
        width: 25%;
        *width: 24.9690%;
    }

    .pure-u-sm-7-24 {
        width: 29.1667%;
        *width: 29.1357%;
    }

    .pure-u-sm-1-3,
    .pure-u-sm-8-24 {
        width: 33.3333%;
        *width: 33.3023%;
    }

    .pure-u-sm-3-8,
    .pure-u-sm-9-24 {
        width: 37.5000%;
        *width: 37.4690%;
    }

    .pure-u-sm-2-5 {
        width: 40%;
        *width: 39.9690%;
    }

    .pure-u-sm-5-12,
    .pure-u-sm-10-24 {
        width: 41.6667%;
        *width: 41.6357%;
    }

    .pure-u-sm-11-24 {
        width: 45.8333%;
        *width: 45.8023%;
    }

    .pure-u-sm-1-2,
    .pure-u-sm-12-24 {
        width: 50%;
        *width: 49.9690%;
    }

    .pure-u-sm-13-24 {
        width: 54.1667%;
        *width: 54.1357%;
    }

    .pure-u-sm-7-12,
    .pure-u-sm-14-24 {
        width: 58.3333%;
        *width: 58.3023%;
    }

    .pure-u-sm-3-5 {
        width: 60%;
        *width: 59.9690%;
    }

    .pure-u-sm-5-8,
    .pure-u-sm-15-24 {
        width: 62.5000%;
        *width: 62.4690%;
    }

    .pure-u-sm-2-3,
    .pure-u-sm-16-24 {
        width: 66.6667%;
        *width: 66.6357%;
    }

    .pure-u-sm-17-24 {
        width: 70.8333%;
        *width: 70.8023%;
    }

    .pure-u-sm-3-4,
    .pure-u-sm-18-24 {
        width: 75%;
        *width: 74.9690%;
    }

    .pure-u-sm-19-24 {
        width: 79.1667%;
        *width: 79.1357%;
    }

    .pure-u-sm-4-5 {
        width: 80%;
        *width: 79.9690%;
    }

    .pure-u-sm-5-6,
    .pure-u-sm-20-24 {
        width: 83.3333%;
        *width: 83.3023%;
    }

    .pure-u-sm-7-8,
    .pure-u-sm-21-24 {
        width: 87.5000%;
        *width: 87.4690%;
    }

    .pure-u-sm-11-12,
    .pure-u-sm-22-24 {
        width: 91.6667%;
        *width: 91.6357%;
    }

    .pure-u-sm-23-24 {
        width: 95.8333%;
        *width: 95.8023%;
    }

    .pure-u-sm-1,
    .pure-u-sm-1-1,
    .pure-u-sm-5-5,
    .pure-u-sm-24-24 {
        width: 100%;
    }
}

@media screen and (min-width: 48em) {
    .pure-u-med-1,
    .pure-u-med-1-1,
    .pure-u-med-1-2,
    .pure-u-med-1-3,
    .pure-u-med-2-3,
    .pure-u-med-1-4,
    .pure-u-med-3-4,
    .pure-u-med-1-5,
    .pure-u-med-2-5,
    .pure-u-med-3-5,
    .pure-u-med-4-5,
    .pure-u-med-5-5,
    .pure-u-med-1-6,
    .pure-u-med-5-6,
    .pure-u-med-1-8,
    .pure-u-med-3-8,
    .pure-u-med-5-8,
    .pure-u-med-7-8,
    .pure-u-med-1-12,
    .pure-u-med-5-12,
    .pure-u-med-7-12,
    .pure-u-med-11-12,
    .pure-u-med-1-24,
    .pure-u-med-2-24,
    .pure-u-med-3-24,
    .pure-u-med-4-24,
    .pure-u-med-5-24,
    .pure-u-med-6-24,
    .pure-u-med-7-24,
    .pure-u-med-8-24,
    .pure-u-med-9-24,
    .pure-u-med-10-24,
    .pure-u-med-11-24,
    .pure-u-med-12-24,
    .pure-u-med-13-24,
    .pure-u-med-14-24,
    .pure-u-med-15-24,
    .pure-u-med-16-24,
    .pure-u-med-17-24,
    .pure-u-med-18-24,
    .pure-u-med-19-24,
    .pure-u-med-20-24,
    .pure-u-med-21-24,
    .pure-u-med-22-24,
    .pure-u-med-23-24,
    .pure-u-med-24-24 {
        display: inline-block;
        *display: inline;
        zoom: 1;
        letter-spacing: normal;
        word-spacing: normal;
        vertical-align: top;
        text-rendering: auto;
    }

    .pure-u-med-1-24 {
        width: 4.1667%;
        *width: 4.1357%;
    }

    .pure-u-med-1-12,
    .pure-u-med-2-24 {
        width: 8.3333%;
        *width: 8.3023%;
    }

    .pure-u-med-1-8,
    .pure-u-med-3-24 {
        width: 12.5000%;
        *width: 12.4690%;
    }

    .pure-u-med-1-6,
    .pure-u-med-4-24 {
        width: 16.6667%;
        *width: 16.6357%;
    }

    .pure-u-med-1-5 {
        width: 20%;
        *width: 19.9690%;
    }

    .pure-u-med-5-24 {
        width: 20.8333%;
        *width: 20.8023%;
    }

    .pure-u-med-1-4,
    .pure-u-med-6-24 {
        width: 25%;
        *width: 24.9690%;
    }

    .pure-u-med-7-24 {
        width: 29.1667%;
        *width: 29.1357%;
    }

    .pure-u-med-1-3,
    .pure-u-med-8-24 {
        width: 33.3333%;
        *width: 33.3023%;
    }

    .pure-u-med-3-8,
    .pure-u-med-9-24 {
        width: 37.5000%;
        *width: 37.4690%;
    }

    .pure-u-med-2-5 {
        width: 40%;
        *width: 39.9690%;
    }

    .pure-u-med-5-12,
    .pure-u-med-10-24 {
        width: 41.6667%;
        *width: 41.6357%;
    }

    .pure-u-med-11-24 {
        width: 45.8333%;
        *width: 45.8023%;
    }

    .pure-u-med-1-2,
    .pure-u-med-12-24 {
        width: 50%;
        *width: 49.9690%;
    }

    .pure-u-med-13-24 {
        width: 54.1667%;
        *width: 54.1357%;
    }

    .pure-u-med-7-12,
    .pure-u-med-14-24 {
        width: 58.3333%;
        *width: 58.3023%;
    }

    .pure-u-med-3-5 {
        width: 60%;
        *width: 59.9690%;
    }

    .pure-u-med-5-8,
    .pure-u-med-15-24 {
        width: 62.5000%;
        *width: 62.4690%;
    }

    .pure-u-med-2-3,
    .pure-u-med-16-24 {
        width: 66.6667%;
        *width: 66.6357%;
    }

    .pure-u-med-17-24 {
        width: 70.8333%;
        *width: 70.8023%;
    }

    .pure-u-med-3-4,
    .pure-u-med-18-24 {
        width: 75%;
        *width: 74.9690%;
    }

    .pure-u-med-19-24 {
        width: 79.1667%;
        *width: 79.1357%;
    }

    .pure-u-med-4-5 {
        width: 80%;
        *width: 79.9690%;
    }

    .pure-u-med-5-6,
    .pure-u-med-20-24 {
        width: 83.3333%;
        *width: 83.3023%;
    }

    .pure-u-med-7-8,
    .pure-u-med-21-24 {
        width: 87.5000%;
        *width: 87.4690%;
    }

    .pure-u-med-11-12,
    .pure-u-med-22-24 {
        width: 91.6667%;
        *width: 91.6357%;
    }

    .pure-u-med-23-24 {
        width: 95.8333%;
        *width: 95.8023%;
    }

    .pure-u-med-1,
    .pure-u-med-1-1,
    .pure-u-med-5-5,
    .pure-u-med-24-24 {
        width: 100%;
    }
}

@media screen and (min-width: 58em) {
    .pure-u-lrg-1,
    .pure-u-lrg-1-1,
    .pure-u-lrg-1-2,
    .pure-u-lrg-1-3,
    .pure-u-lrg-2-3,
    .pure-u-lrg-1-4,
    .pure-u-lrg-3-4,
    .pure-u-lrg-1-5,
    .pure-u-lrg-2-5,
    .pure-u-lrg-3-5,
    .pure-u-lrg-4-5,
    .pure-u-lrg-5-5,
    .pure-u-lrg-1-6,
    .pure-u-lrg-5-6,
    .pure-u-lrg-1-8,
    .pure-u-lrg-3-8,
    .pure-u-lrg-5-8,
    .pure-u-lrg-7-8,
    .pure-u-lrg-1-12,
    .pure-u-lrg-5-12,
    .pure-u-lrg-7-12,
    .pure-u-lrg-11-12,
    .pure-u-lrg-1-24,
    .pure-u-lrg-2-24,
    .pure-u-lrg-3-24,
    .pure-u-lrg-4-24,
    .pure-u-lrg-5-24,
    .pure-u-lrg-6-24,
    .pure-u-lrg-7-24,
    .pure-u-lrg-8-24,
    .pure-u-lrg-9-24,
    .pure-u-lrg-10-24,
    .pure-u-lrg-11-24,
    .pure-u-lrg-12-24,
    .pure-u-lrg-13-24,
    .pure-u-lrg-14-24,
    .pure-u-lrg-15-24,
    .pure-u-lrg-16-24,
    .pure-u-lrg-17-24,
    .pure-u-lrg-18-24,
    .pure-u-lrg-19-24,
    .pure-u-lrg-20-24,
    .pure-u-lrg-21-24,
    .pure-u-lrg-22-24,
    .pure-u-lrg-23-24,
    .pure-u-lrg-24-24 {
        display: inline-block;
        *display: inline;
        zoom: 1;
        letter-spacing: normal;
        word-spacing: normal;
        vertical-align: top;
        text-rendering: auto;
    }

    .pure-u-lrg-1-24 {
        width: 4.1667%;
        *width: 4.1357%;
    }

    .pure-u-lrg-1-12,
    .pure-u-lrg-2-24 {
        width: 8.3333%;
        *width: 8.3023%;
    }

    .pure-u-lrg-1-8,
    .pure-u-lrg-3-24 {
        width: 12.5000%;
        *width: 12.4690%;
    }

    .pure-u-lrg-1-6,
    .pure-u-lrg-4-24 {
        width: 16.6667%;
        *width: 16.6357%;
    }

    .pure-u-lrg-1-5 {
        width: 20%;
        *width: 19.9690%;
    }

    .pure-u-lrg-5-24 {
        width: 20.8333%;
        *width: 20.8023%;
    }

    .pure-u-lrg-1-4,
    .pure-u-lrg-6-24 {
        width: 25%;
        *width: 24.9690%;
    }

    .pure-u-lrg-7-24 {
        width: 29.1667%;
        *width: 29.1357%;
    }

    .pure-u-lrg-1-3,
    .pure-u-lrg-8-24 {
        width: 33.3333%;
        *width: 33.3023%;
    }

    .pure-u-lrg-3-8,
    .pure-u-lrg-9-24 {
        width: 37.5000%;
        *width: 37.4690%;
    }

    .pure-u-lrg-2-5 {
        width: 40%;
        *width: 39.9690%;
    }

    .pure-u-lrg-5-12,
    .pure-u-lrg-10-24 {
        width: 41.6667%;
        *width: 41.6357%;
    }

    .pure-u-lrg-11-24 {
        width: 45.8333%;
        *width: 45.8023%;
    }

    .pure-u-lrg-1-2,
    .pure-u-lrg-12-24 {
        width: 50%;
        *width: 49.9690%;
    }

    .pure-u-lrg-13-24 {
        width: 54.1667%;
        *width: 54.1357%;
    }

    .pure-u-lrg-7-12,
    .pure-u-lrg-14-24 {
        width: 58.3333%;
        *width: 58.3023%;
    }

    .pure-u-lrg-3-5 {
        width: 60%;
        *width: 59.9690%;
    }

    .pure-u-lrg-5-8,
    .pure-u-lrg-15-24 {
        width: 62.5000%;
        *width: 62.4690%;
    }

    .pure-u-lrg-2-3,
    .pure-u-lrg-16-24 {
        width: 66.6667%;
        *width: 66.6357%;
    }

    .pure-u-lrg-17-24 {
        width: 70.8333%;
        *width: 70.8023%;
    }

    .pure-u-lrg-3-4,
    .pure-u-lrg-18-24 {
        width: 75%;
        *width: 74.9690%;
    }

    .pure-u-lrg-19-24 {
        width: 79.1667%;
        *width: 79.1357%;
    }

    .pure-u-lrg-4-5 {
        width: 80%;
        *width: 79.9690%;
    }

    .pure-u-lrg-5-6,
    .pure-u-lrg-20-24 {
        width: 83.3333%;
        *width: 83.3023%;
    }

    .pure-u-lrg-7-8,
    .pure-u-lrg-21-24 {
        width: 87.5000%;
        *width: 87.4690%;
    }

    .pure-u-lrg-11-12,
    .pure-u-lrg-22-24 {
        width: 91.6667%;
        *width: 91.6357%;
    }

    .pure-u-lrg-23-24 {
        width: 95.8333%;
        *width: 95.8023%;
    }

    .pure-u-lrg-1,
    .pure-u-lrg-1-1,
    .pure-u-lrg-5-5,
    .pure-u-lrg-24-24 {
        width: 100%;
    }
}

@media screen and (min-width: 75em) {
    .pure-u-xl-1,
    .pure-u-xl-1-1,
    .pure-u-xl-1-2,
    .pure-u-xl-1-3,
    .pure-u-xl-2-3,
    .pure-u-xl-1-4,
    .pure-u-xl-3-4,
    .pure-u-xl-1-5,
    .pure-u-xl-2-5,
    .pure-u-xl-3-5,
    .pure-u-xl-4-5,
    .pure-u-xl-5-5,
    .pure-u-xl-1-6,
    .pure-u-xl-5-6,
    .pure-u-xl-1-8,
    .pure-u-xl-3-8,
    .pure-u-xl-5-8,
    .pure-u-xl-7-8,
    .pure-u-xl-1-12,
    .pure-u-xl-5-12,
    .pure-u-xl-7-12,
    .pure-u-xl-11-12,
    .pure-u-xl-1-24,
    .pure-u-xl-2-24,
    .pure-u-xl-3-24,
    .pure-u-xl-4-24,
    .pure-u-xl-5-24,
    .pure-u-xl-6-24,
    .pure-u-xl-7-24,
    .pure-u-xl-8-24,
    .pure-u-xl-9-24,
    .pure-u-xl-10-24,
    .pure-u-xl-11-24,
    .pure-u-xl-12-24,
    .pure-u-xl-13-24,
    .pure-u-xl-14-24,
    .pure-u-xl-15-24,
    .pure-u-xl-16-24,
    .pure-u-xl-17-24,
    .pure-u-xl-18-24,
    .pure-u-xl-19-24,
    .pure-u-xl-20-24,
    .pure-u-xl-21-24,
    .pure-u-xl-22-24,
    .pure-u-xl-23-24,
    .pure-u-xl-24-24 {
        display: inline-block;
        *display: inline;
        zoom: 1;
        letter-spacing: normal;
        word-spacing: normal;
        vertical-align: top;
        text-rendering: auto;
    }

    .pure-u-xl-1-24 {
        width: 4.1667%;
        *width: 4.1357%;
    }

    .pure-u-xl-1-12,
    .pure-u-xl-2-24 {
        width: 8.3333%;
        *width: 8.3023%;
    }

    .pure-u-xl-1-8,
    .pure-u-xl-3-24 {
        width: 12.5000%;
        *width: 12.4690%;
    }

    .pure-u-xl-1-6,
    .pure-u-xl-4-24 {
        width: 16.6667%;
        *width: 16.6357%;
    }

    .pure-u-xl-1-5 {
        width: 20%;
        *width: 19.9690%;
    }

    .pure-u-xl-5-24 {
        width: 20.8333%;
        *width: 20.8023%;
    }

    .pure-u-xl-1-4,
    .pure-u-xl-6-24 {
        width: 25%;
        *width: 24.9690%;
    }

    .pure-u-xl-7-24 {
        width: 29.1667%;
        *width: 29.1357%;
    }

    .pure-u-xl-1-3,
    .pure-u-xl-8-24 {
        width: 33.3333%;
        *width: 33.3023%;
    }

    .pure-u-xl-3-8,
    .pure-u-xl-9-24 {
        width: 37.5000%;
        *width: 37.4690%;
    }

    .pure-u-xl-2-5 {
        width: 40%;
        *width: 39.9690%;
    }

    .pure-u-xl-5-12,
    .pure-u-xl-10-24 {
        width: 41.6667%;
        *width: 41.6357%;
    }

    .pure-u-xl-11-24 {
        width: 45.8333%;
        *width: 45.8023%;
    }

    .pure-u-xl-1-2,
    .pure-u-xl-12-24 {
        width: 50%;
        *width: 49.9690%;
    }

    .pure-u-xl-13-24 {
        width: 54.1667%;
        *width: 54.1357%;
    }

    .pure-u-xl-7-12,
    .pure-u-xl-14-24 {
        width: 58.3333%;
        *width: 58.3023%;
    }

    .pure-u-xl-3-5 {
        width: 60%;
        *width: 59.9690%;
    }

    .pure-u-xl-5-8,
    .pure-u-xl-15-24 {
        width: 62.5000%;
        *width: 62.4690%;
    }

    .pure-u-xl-2-3,
    .pure-u-xl-16-24 {
        width: 66.6667%;
        *width: 66.6357%;
    }

    .pure-u-xl-17-24 {
        width: 70.8333%;
        *width: 70.8023%;
    }

    .pure-u-xl-3-4,
    .pure-u-xl-18-24 {
        width: 75%;
        *width: 74.9690%;
    }

    .pure-u-xl-19-24 {
        width: 79.1667%;
        *width: 79.1357%;
    }

    .pure-u-xl-4-5 {
        width: 80%;
        *width: 79.9690%;
    }

    .pure-u-xl-5-6,
    .pure-u-xl-20-24 {
        width: 83.3333%;
        *width: 83.3023%;
    }

    .pure-u-xl-7-8,
    .pure-u-xl-21-24 {
        width: 87.5000%;
        *width: 87.4690%;
    }

    .pure-u-xl-11-12,
    .pure-u-xl-22-24 {
        width: 91.6667%;
        *width: 91.6357%;
    }

    .pure-u-xl-23-24 {
        width: 95.8333%;
        *width: 95.8023%;
    }

    .pure-u-xl-1,
    .pure-u-xl-1-1,
    .pure-u-xl-5-5,
    .pure-u-xl-24-24 {
        width: 100%;
    }
}
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/*
 * -- BASE STYLES --
 * Most of these are inherited from Base, but I want to change a few.
 */
body {
    line-height: 1.7em;
    color: #7f8c8d;
    font-size: 13px;
}

h1,
h2,
h3,
h4,
h5,
h6,
label {
    color: #34495e;
}

.pure-img-responsive {
    max-width: 100%;
    height: auto;
}

/*
 * -- LAYOUT STYLES --
 * These are some useful classes which I will need
 */
.l-box {
    padding: 1em;
}

.l-box-lrg {
    padding: 2em;
    border-bottom: 1px solid rgba(0,0,0,0.1);
}

.is-center {
    text-align: center;
}



/*
 * -- PURE FORM STYLES --
 * Style the form inputs and labels
 */
.pure-form label {
    margin: 1em 0 0;
    font-weight: bold;
    font-size: 100%;
}

.pure-form input[type] {
    border: 2px solid #ddd;
    box-shadow: none;
    font-size: 100%;
    width: 100%;
    margin-bottom: 1em;
}

/*
 * -- PURE BUTTON STYLES --
 * I want my pure-button elements to look a little different
 */
.pure-button {
    background-color: #47689C;
    color: white;
    padding: 0.5em 2em;
    border-radius: 5px;
}

a.pure-button-primary {
    background: white;
    color: #47689C;
    border-radius: 5px;
    font-size: 120%;
}


/*
 * -- MENU STYLES --
 * I want to customize how my .pure-menu looks at the top of the page
 */

.home-menu {
    padding: 0.5em;
    text-align: center;
    box-shadow: 0 1px 1px rgba(0,0,0, 0.10);
}
.home-menu.pure-menu-open {
    background: #2d3e50;
}
.pure-menu.pure-menu-open.pure-menu-fixed {
    /* Fixed menus normally have a border at the bottom. */
    border-bottom: none;
    /* I need a higher z-index here because of the scroll-over effect. */
    z-index: 4;
}

.home-menu .pure-menu-heading {
    color: white;
    font-weight: 400;
    font-size: 120%;
}

.home-menu .pure-menu-selected a {
    color: white;
}

.home-menu a {
    color: #6FBEF3;
}
.home-menu li a:hover,
.home-menu li a:focus {
    background: none;
    border: none;
    color: #AECFE5;
}


/*
 * -- SPLASH STYLES --
 * This is the blue top section that appears on the page.
 */

.splash-container {
    background: #222E3E;
    z-index: 1;
    overflow: hidden;
    /* The following styles are required for the "scroll-over" effect */
    width: 100%;
    height: 88%;
    top: 0;
    left: 0;
    position: fixed !important;
}

.splash {
    /* absolute center .splash within .splash-container */
    width: 80%;
    height: 50%;
    margin: auto;
    position: absolute;

 top: -50px; left: 0; bottom: 0; right: 0;
    text-align: center;
    text-transform: uppercase;
}

/* This is the main heading that appears on the blue section */
.splash-head {
    font-size: 20px;
    font-weight: bold;
    color: white;
    border: 3px solid white;
    padding: 1em 1.6em;
    font-weight: 100;
    border-radius: 5px;
    line-height: 1em;
}

/* This is the subheading that appears on the blue section */
.splash-subhead {
    color: white;
    letter-spacing: 0.05em;
    opacity: 0.8;
}

/*
 * -- CONTENT STYLES --
 * This represents the content area (everything below the blue section)
 */
.content-wrapper {
    /* These styles are required for the "scroll-over" effect */
    position: absolute;
    top: 87%;
    width: 100%;
    min-height: 12%;
    z-index: 2;
    background: white;

}

/* This is the class used for the main content headers (<h2>) */
.content-head {
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin: 2em 0 1em;
}

/* This is a modifier class used when the content-head is inside a ribbon */
.content-head-ribbon {
    color: white;
}

/* This is the class used for the content sub-headers (<h3>) */
.content-subhead {
    color: #47689C;
}
    .content-subhead i {
        margin-right: 7px;
    }

/* This is the class used for the dark-background areas. */
.ribbon {
    background: #2d3e50;
    color: #aaa;
}

/* This is the class used for the footer */
.footer {
    background: #111;
}

/*
 * -- TABLET (AND UP) MEDIA QUERIES --
 * On tablets and other medium-sized devices, we want to customize some
 * of the mobile styles.
 */
@media (min-width: 48em) {

    /* We increase the body font size */
    body {
        font-size: 16px;
    }
    /* We want to give the content area some more padding */
    .content {
        padding: 1em;
    }

    /* We can align the menu header to the left, but float the
    menu items to the right. */
    .home-menu {
        text-align: left;
    }
        .home-menu ul {
            float: right;
        }

    /* We increase the height of the splash-container */
/*    .splash-container {
        height: 500px;
    }*/

    /* We decrease the width of the .splash, since we have more width
    to work with */
    .splash {
        width: 50%;
        height: 50%;
    }

    .splash-head {
        font-size: 250%;
    }


    /* We remove the border-separator assigned to .l-box-lrg */
    .l-box-lrg {
        border: none;
    }

}

/*
 * -- DESKTOP (AND UP) MEDIA QUERIES --
 * On desktops and other large devices, we want to over-ride some
 * of the mobile and tablet styles.
 */
@media (min-width: 78em) {
    /* We increase the header font size even more */
    .splash-head {
        font-size: 300%;
    }
}

<!doctype html>
<html lang="en">


<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Dev Pizza Camp</title>
    <meta name="description" content="Pizza is for Programmers">
    <link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.4.2/pure-min.css">
    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="css/pure-pizza.css">
    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css">
    <link href='http://fonts.googleapis.com/css?family=News+Cycle:400,700|Neucha' rel='stylesheet' type='text/css'>

</head>

<body>
    <header[role="menu" ] class="header">
        <nav class="home-menu pure-menu pure-menu-open pure-menu-horizontal pure-menu-fixed">
            <a class="pure-menu-heading" href="#">DEV PIZZA CAMP</a>
            <ul>
                <li class="pure-menu-selected"><a href="#">Menu</a>
                </li>
                <li><a href="#">About</a>
                </li>
                <li><a href="#">Place Order!</a>
                </li>
            </ul>
            <section class="logo-container">
                <img src="css/img/DevPizzaCamp_@2x.png" alt="Dev Pizza Camp" width="350" title="Dev Pizza Camp- Pizza is for Programmers" />
            </section>
        </nav>

        </header>

        <section class="splash-container">
            <div class="splash">
                <h1 class="splash-head">TRY OUR NEW SELECTIONS TODAY!</h1>
                <section class="pure-g-r">
                    <figure class="pure-u-1-4">
                        <img src="css/img/pizza-1.png" alt="Pepperoni & Procs Pizza" title="Pepperoni & Procs Pizza" />
                        <figcaption>Pepperoni & Procs</figcaption>
                    </figure>
                    <figure class="pure-u-1-4">
                        <img src="css/img/salad.png" alt="Array of Veggies Salad" title="Array of Veggies Salad" />
                        <figcaption>Array of Veggies Salad</figcaption>
                    </figure>
                    <figure class="pure-u-1-4">
                        <img src="css/img/pizza-2.png" alt="Strings & Cheese Pizza" title="Strings & Cheese Pizza" />
                        <figcaption>Strings & Cheese</figcaption>
                    </figure>
                    <figure class="pure-u-1-4">
                        <img src="css/img/dessert.png" alt="Ruby Red Cheesecake" title="Ruby Red Cheesecake" />
                        <figcaption>Ruby Red Cheesecake</figcaption>
                    </figure>
                </section>
                <p>
                    <a href="#" class="pure-button pure-button-primary">Order Now!</a>
                </p>
            </div>
        </section>

        <div class="content-wrapper">
            <div class="content">
                <h2 class="content-head is-center">Pizza is for {Programmers}</h2>

                <div class="pure-g">
                    <div class="l-box pure-u-1 pure-u-med-1-2 pure-u-lrg-1-3">
                        <h1 id="drinks" class="menu-category">Beverages</h1>
                        <h2 class="content-subhead">
                            <i class="flaticon-cool5"></i>
                            Cold Drinks
                        </h2>
                        <div class="menu-items">
                            <div class="row-item">
                                <div class="menu-item">thread-monade</div>
                                <div class="menu-delimiter"></div>
                                <div class="menu-price">$2.99</div>
                            </div>
                        </div>
                        <div class="menu-items">
                            <div class="row-item">
                                <div class="menu-item">soda push 'n pop</div>
                                <div class="menu-delimiter"></div>
                                <div class="menu-price">$1.99</div>
                            </div>
                        </div>
                        <div class="menu-items last">
                            <div class="row-item">
                                <div class="menu-item">slice tea</div>
                                <div class="menu-delimiter"></div>
                                <div class="menu-price">$2.99</div>
                            </div>
                        </div>

                        <h2 class="content-subhead">
                            <i class="flaticon-coffee11"></i>
                            Hot Drinks
                        </h2>
                        <div class="menu-items">
                            <div class="row-item">
                                <div class="menu-item">coffeescript</div>
                                <div class="menu-delimiter"></div>
                                <div class="menu-price">$1.99</div>
                            </div>
                        </div>
                        <div class="menu-items last">
                            <div class="row-item">
                                <div class="menu-item">erb-al tea</div>
                                <div class="menu-delimiter"></div>
                                <div class="menu-price">$1.89</div>
                            </div>
                        </div>

                        <section class="alcohol stretch image-red">
                            <h2 class="content-subhead">
                                <i class="flaticon-full5"></i>
                                Beer, Wine, & Liquor
                            </h2>
                            <div class="menu-items">
                                <div class="row-item">
                                    <div class="menu-item">wine by the class</div>
                                    <div class="menu-delimiter"></div>
                                    <div class="menu-price">$5.50</div>
                                </div>
                            </div>
                            <div class="menu-items">
                                <div class="row-item">
                                    <div class="menu-item">cocktail recursion</div>
                                    <div class="menu-delimiter"></div>
                                    <div class="menu-price">$8.99</div>
                                </div>
                            </div>
                            <div class="menu-items">
                                <div class="row-item">
                                    <div class="menu-item">beer by the model</div>
                                    <div class="menu-delimiter"></div>
                                    <div class="menu-price">$3.99</div>
                                </div>
                            </div>

                        </section>
                    </div>
                    <div class="l-box pure-u-1 pure-u-med-1-2 pure-u-lrg-2-3">
                        <div class="pure-g">
                            <div class="l-box pure-u-1 pure-u-med-1-1 pure-u-lrg-1-2 nested">
                                <h1 id="pizzas" class="menu-category">
                                    <i class="flaticon-italian1"></i>
                                    Pizza
                                </h1>
                                <h2 class="content-subhead">
                                    Whole Pies
                                </h2>
                                <div class="menu-items">
                                    <div class="row-item">
                                        <div class="menu-item">pepperoni & procs</div>
                                        <div class="menu-delimiter"></div>
                                        <div class="menu-price">$12.99</div>
                                    </div>
                                </div>
                                <div class="menu-items">
                                    <div class="row-item">
                                        <div class="menu-item">strings & cheese</div>
                                        <div class="menu-delimiter"></div>
                                        <div class="menu-price">$10.99</div>
                                    </div>
                                </div>
                                <div class="menu-items">
                                    <div class="row-item">
                                        <div class="menu-item">margherita module</div>
                                        <div class="menu-delimiter"></div>
                                        <div class="menu-price">$8.99</div>
                                    </div>
                                </div>

                                <div class="menu-items">
                                    <div class="row-item">
                                        <div class="menu-item">roasted recursion</div>
                                        <div class="menu-delimiter"></div>
                                        <div class="menu-price">$13.99</div>
                                    </div>
                                </div>
                                <div class="menu-items">
                                    <div class="row-item">
                                        <div class="menu-item">ground lambda</div>
                                        <div class="menu-delimiter"></div>
                                        <div class="menu-price">$14.99</div>
                                    </div>
                                </div>
                                <div class="menu-items">
                                    <div class="row-item">
                                        <div class="menu-item">array of veggies</div>
                                        <div class="menu-delimiter"></div>
                                        <div class="menu-price">$9.99</div>
                                    </div>
                                </div>
                                <div class="menu-items">
                                    <div class="row-item">
                                        <div class="menu-item">hash & cheese</div>
                                        <div class="menu-delimiter"></div>
                                        <div class="menu-price">$10.99</div>
                                    </div>
                                </div>
                                <div class="menu-items">
                                    <div class="row-item">
                                        <div class="menu-item">block o' cheese</div>
                                        <div class="menu-delimiter"></div>
                                        <div class="menu-price">$10.99</div>
                                    </div>
                                </div>
                                <div class="menu-items">
                                    <div class="row-item">
                                        <div class="menu-item">arugulas & parameters</div>
                                        <div class="menu-delimiter"></div>
                                        <div class="menu-price">$9.99</div>
                                    </div>
                                </div>
                                <div class="menu-items last">
                                    <div class="row-item">
                                        <div class="menu-item">puts 'n peppers</div>
                                        <div class="menu-delimiter"></div>
                                        <div class="menu-price">$8.99</div>
                                    </div>
                                </div>


                                <h2 class="content-subhead">
                                    <i class="flaticon-pizza3"></i>
                                    By-The-Slice
                                </h2>
                                <p>ask your server for today's selection</p>
                            </div>

                            <div class="l-box pure-u-1 pure-u-med-1-1 pure-u-lrg-1-2 nested">
                                <h1 id="sides-salads" class="menu-category">
                                    <i class="flaticon-dish"></i>
                                    Sides & Salads
                                </h1>


                                <div class="menu-items">
                                    <div class="row-item">
                                        <div class="menu-item">roasted call-iflower</div>
                                        <div class="menu-delimiter"></div>
                                        <div class="menu-price">$3.99</div>
                                    </div>
                                </div>
                                <div class="menu-items">
                                    <div class="row-item">
                                        <div class="menu-item">sauteed swiss char</div>
                                        <div class="menu-delimiter"></div>
                                        <div class="menu-price">$5.99</div>
                                    </div>
                                </div>
                                <div class="menu-items">
                                    <div class="row-item">
                                        <div class="menu-item">array of veggies salad</div>
                                        <div class="menu-delimiter"></div>
                                        <div class="menu-price">$7.99</div>
                                    </div>
                                </div>
                                <div class="menu-items last">
                                    <div class="row-item">
                                        <div class="menu-item">chompped salad</div>
                                        <div class="menu-delimiter"></div>
                                        <div class="menu-price">$8.99</div>
                                    </div>
                                </div>
                                <h1 id="desserts" class="menu-category">
                                    <i class="flaticon-ice19"></i>
                                    Desserts
                                </h1>
                                <div class="menu-items">
                                    <div class="row-item">
                                        <div class="menu-item">ruby red cheesecake</div>
                                        <div class="menu-delimiter"></div>
                                        <div class="menu-price">$6.99</div>
                                    </div>
                                </div>
                                <div class="menu-items">
                                    <div class="row-item">
                                        <div class="menu-item">va-nil-la ice cream</div>
                                        <div class="menu-delimiter"></div>
                                        <div class="menu-price">$4.99</div>
                                    </div>
                                </div>
                                <div class="menu-items last">
                                    <div class="row-item">
                                        <div class="menu-item">key & value lime pie</div>
                                        <div class="menu-delimiter"></div>
                                        <div class="menu-price">$5.99</div>
                                    </div>
                                </div>
                                <section class="specials stretch image-purple">
                                    <h2 class="content-subhead">
                                        <i class="flaticon-favourites1"></i>
                                        Specials
                                    </h2>

                                    make sure to ask your server about our daily specials!
                                </section>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="footer l-box is-center">
                Pizza is for {Programmers} &nbsp; &nbsp; &nbsp Copyright © 2014 Caroline Artz
            </div>

        </div>

</body>

</html>