/*********************** 
|                      |
|     Website Width    |
|                      |
***********************/
/*  Default site width  */

/*
    Change this and the sites width will change.
    Dont change this width, give the id tags a width and if that doesnt work
    add the the "!important" style-code to the width to overide this default width.
*/

/* This one is specific to pages tagged with a class. Its for the Cart */
.cart-page .csc-default { 
    max-width: 80px;
}
.csc-default { 
    max-width: 80%;
}

/*********************** 
|                      |
|      Navigation      |
|                      |
***********************/

#logo img {
}

#header {
    width: 100%;
}

#nav {
 	display: none;
    position: absolute;
    top: 86px;
    right: 10%;
    z-index: 100000;
    background: #351d0a;
    width: 100%;
    max-width: 400px;
}

#nav ul {
    float: none;
    display: block;
}

#nav ul li {
    float: none;
    width: 100%;
    position: relative;
}

#nav ul li > span {
    position: absolute;
    right: 0;
}

.prod_list_linkwrap {
    min-height: 50px;
    display: block;
}

#nav ul li a:link, 
#nav ul li a:visited, 
#nav ul li a:active,
#nav ul li ul li a:link,
#nav ul li ul li a:active,
#nav ul li ul li a:visited {
    padding: 10px 20px;
    line-height: 1;
    font-size: 16px;
}

#nav ul li a:hover {
    color: #fff;
    background-color: #f38b00;
}

#nav ul li:hover {
    position: relative;
    top: 0;
    left: 0;
    background-color: #351d0a;
    display: block;
}

#nav ul li:hover ul {
    display: none; 
}

#nav ul li:hover > ul {
    position: relative;
    top: 0;
    background: transparent;
}

#nav ul li ul {
    position: relative;
    display: none;
    width: 100%;
}

#nav ul li ul li {
    width: 100%;
    border: none;
}

#nav ul li a:link, 
#nav ul li a:visited, 
#nav ul li a:active {
    display: inline-block;
    width: 80%;
    margin-right: 0;
    vertical-align: top;
    box-sizing: border-box;
}

#nav ul li ul li a:link,
#nav ul li ul li a:active,
#nav ul li ul li a:visited {
    width: 100%;
    display: block;
    background-color: #f38b00;
}

#nav ul li .m_expand {
    display: inline-block;
    width: 20%;
    margin-right: 0;
    vertical-align: top;
    box-sizing: border-box;
    background: url(images/icons/arrow-down.png) no-repeat center center;
    height: 36px;
}

#nav ul li.expanded .m_expand {
    background: transparent url(images/icons/arrow-up.png) no-repeat center center;
}

#smallmenu {
	display: inline-block;
}


/* Front Page */


.csc-default .tx-dce-pi1 {
    padding: 0;
}

#c9.csc-default .tx-dce-pi1,
#c2.csc-default .tx-dce-pi1 {
    max-width: 80%;
    padding: 0;
}

#frontpage-linkbuttons .three-button-container .column.twocolumns .image-button h2 {
    padding: 0;
    font-size: 26px;
}

#frontpage-linkbuttons .three-button-container .column.twocolumns .subcolumn1 h3,
#frontpage-linkbuttons .three-button-container .column.twocolumns .subcolumn2 h3 {
    font-size: 24px;
}

.twocolumns p {
    height: auto;
    padding: 0;
}

#c2 .columns2 .c2_c1,
#c2 .columns2 .c2_c2 {
    padding: 20px 0;
    width: 39%;
    box-sizing: border-box;
}

#c2 .columns2 p {
    font-size: 12px;
}

#frontpage-linkbuttons .three-button-container .column.twocolumns {
    width: 100%;
    margin: 0;
    max-height: 100%;
    margin: 10px 0;
    background: #f38b00;
}

.twocolumns img {
    display: none;
}

#frontpage-linkbuttons {
    margin: 0;
    padding: 0;
}

#frontpage-linkbuttons .twocolumns .image-button {
    padding: 20px;
}

.twocolumns .image-button > p {
    display: block;
    margin: 0;
}

.three-button-container {
    padding: 10px 0;
}

#frontpage-linkbuttons .twocolumns .subcolumn1,
#frontpage-linkbuttons .twocolumns .subcolumn2 {
    display: none;
}

#frontpage-linkbuttons .three-button-container .column:hover > .image-button p,
#frontpage-linkbuttons .three-button-container .column:hover > .image-button h2 {
    opacity: 1;
    color: #fff;
}

#frontpage-linkbuttons .three-button-container .column:hover > .image-button {
    background: #351d0a;
}

#footer .footer-left, #footer .footer-right, #footer .footer-center {
    width: 100%;
    float: none;
    padding: 10px 20px;
    box-sizing: border-box;
    text-align: center;
}

#footer .footer-center .terms {
    line-height: 1;
}

#footer .footer-right .icon li {
    display: inline-block;
    float: none;
    margin-right: -4px;
    vertical-align: middle;
}

#c2 .columns2 .c2_c1 a:link, #c2 .columns2 .c2_c1 a:active, #c2 .columns2 .c2_c1 a:visited,
#c2 .columns2 .c2_c2 a:link, #c2 .columns2 .c2_c2 a:active, #c2 .columns2 .c2_c2 a:visited {
    margin-top: 0;
    float: none;
}

#c2 .columns2 h3 {
    font-family: 'Libre Baskerville', serif;
    font-size: 27px;
}

#c75 {
    max-width: 100%;
}

.log-in {
    top: 100px;
    width: 30%;
}

.log-in h5 {
    padding: 0;
}

.log-in a:link, .log-in a:visited, .log-in a:active {
    width: 100%;
    margin: 0;
    box-sizing: border-box;
}

/* Food Categories */

#food-categories {
    max-width: 80%;
}

#food-categories .image-button img {
    display: none;
}

#food-categories .three-button-container .column {
    background: #f38b00 url(images/icons/double-right-arrow.png) center right no-repeat;
}

#food-categories .image-button a {
    padding: 20px;
    box-sizing: border-box;
}

#food-categories .three-button-container .column .image-button h3 {
    padding: 0;
}

#food-categories .image-container {
    display: none;
}

#food-categories .image-button a:hover > h3 {
    opacity: 1;
}

#food-categories .image-button a:hover {
    background: #351d0a url(images/icons/double-right-arrow.png) center right no-repeat;
    color: #fff;
}

#food-categories .three-button-container .column {
    width: 100%;
    box-sizing: border-box;
    margin: 10px 0 0 0;
}

#shop-footer .columns2 .c2_c1 {
    display: none;
}

#shop-footer .columns2 .c2_c2 {
    width: 100%;
}

#delivery-location {
    max-width: 80%;
    width: 100%;
    margin: 0 auto;
}

#delivery-container #food-codes ul li {
    width: 50%;
    margin-bottom: 10px;
    padding: 0 2% 0 0;
}

#delivery-container #food-codes .fc_reset {
    position: relative;
    right: 0;
    bottom: 0;
    margin-top: 20px;
}

.tx-ocushop .backwrap,
#header,
#shop-header {
    max-width: 80%;
}

#food-categories ul li.product_container {
    width: 44%;
    margin: 1% 3%;
}

.information-container { 
    display: none;
}

#information-description {
    margin: 0 auto;
    float: none;
    width: 100%;
    max-width: 80%;
}

#shop-plugin #buy {
    float: none;
    width: 100%;
}

#shop-plugin #buy #quantity {
    text-align: right;
    width: 100%;
}

#shop-plugin #buy #price {
    position: relative;
    right: 0;
    top: 0;
}

/* About */

#testimonials #landingcubewrap {
    max-width: 80%;
}

#landingcubewrap .csc-default {
    width: 100%;
    display: block;
    margin: 0 auto 10px auto;
    max-width: 80%;
}

#testimonials #landingcubewrap .csc-default {
    width: 100%;
    max-width: 50%;
    display: inline-block;
    margin: 0;
    margin-right: -4px;
    box-sizing: border-box;
    padding: 10px;
}

#landingcubewrap .csc-default .tx-dce-pi1 {
    padding: 0;
}

#testimonials #landingcubewrap .column {
    padding: 20px;
    background-image: url();
}

#landingcubewrap .column {
    padding: 20px;
    background-image: url(images/icons/double-right-arrow.png);
    background-position: right center;
    background-repeat: no-repeat;
    min-height: 0;
}

#landingcubewrap .column:hover {
    background-color: #351d0a;
    color: #fff;
}

#testimonials #landingcubewrap .column:hover {
    background-color: #f38b00;
    color: #fff;
}

#landingcubewrap .column h3 {
    margin: 0;
    padding: 0;
    width: 100%;
    text-align: left;
    border: none;
}

#landingcubewrap .column p {
    display: none;
} 

#testimonials #landingcubewrap .column p {
    display: block;
}

#quantity_price {
    text-align: right;
}

#shop-plugin #buy #quantity,
#shop-plugin #buy #price {
    width: auto;
    display: inline-block;
}

#shop-footer .columns2 .c2_c2 .links h3 a {
    width: auto;
}

.find-stores {
    max-width: 80%;
}

.find-stores #storelistings .list-store {
    width: 47%;
}

.mfp-content {
    max-width: 500px;
    width: 100% !important;
}

#c9 {
    background-size: 880px auto;
}

#c9 .columns2 {
    padding: 0;
}

#c9 .columns2 .c2_c1,
#c9 .columns2 .c2_c2 {
    float: none;
    width: 100%;
}

#c9 .columns2 .c2_c1 {
    display: none;
}

.region-list {
    background: transparent;
    height: auto;
}

.region-list ul {
    background: transparent;
    position: relative;
    top: 0;
    margin: 0 auto;
}

.region-list ul li {
    position: relative;
    width: auto;
    height: auto;
    margin-bottom: 20px;
}

.region-list form {
    height: auto;
    background: transparent;
    padding: 0;
}

.region-list ul li a {
    padding: 0;
    border: none;
    display: block;
    background-color: #f38b00;
    padding: 20px;
}

.region-list ul li a:hover {
    background: #351d0a;
    color: #fff;
}

.region-list ul li.region1 a,
.region-list ul li.region2 a,
.region-list ul li.region3 a,
.region-list ul li.region4 a,
.region-list ul li.sister-stores a {
    position: relative;
    top: 0;
    left: 0;
}

.region-list ul li.region1:hover,
.region-list ul li.region2:hover,
.region-list ul li.region3:hover,
.region-list ul li.region4:hover,
.region-list ul li.sister-stores:hover {
    background: transparent;
}

#c66 {
    max-width: 80%;
}

.tx-wishbonelocations #search-form #storesearch-submit {
    background-color: #351d0a;
}

.region-list form input[type="text"] {
    width: 80%;
    display: inline-block;
    margin-right:-4px;
    vertical-align: middle;
    box-sizing: border-box;
    padding: 10px;
}

.tx-wishbonelocations #search-form #storesearch-submit {
    width: 20%;
    display: inline-block;
    margin-right:-4px;
    vertical-align: middle;
    box-sizing: border-box;
    padding: 10px;
}

.tx-wishbonelocations #search-form #storesearch-submit:hover {
    background-color: #f38b00;
}

#c24.csc-default .tx-dce-pi1 {
    max-width: 100%;
}

.columns2 .c2_c2 .links .foodbutton-left, .columns2 .c2_c2 .links .foodbutton-right {
    padding: 0;
}

#account-page .profile-buttons {
    width: 100%;
}

#account-page .profile_submit {
    display: block;
}

#account-page .profile_submit .profilebutton {
    width: 100%;
}

#account-page .account-section-header .section-description {
    margin-left: 0;
}

#textpageheading {
    display: none;
}

#textpagecontent {
    width: 100%;
    float: none;
    max-width: 100%;
    margin-top: 50px;
}

#c76 {
    max-width: 100%;
}

.news-list-item {
    width: 50%;
}

#c2 .columns2 .c2_c1 {
    padding-right: 10px;
    box-sizing: border-box;
} 

#c2 .columns2 .c2_c2 {
    padding-left: 10px;
    box-sizing: border-box;
}

#food-categories ul li.product_container a:hover img {
    opacity: 1;
}

#food-categories ul li.product_container a:hover div p {
    color: #000;
}

.news-single-item .news-information, .news-single-item .news-video-trigger {
    width: 100%;
    margin: 0 auto;
    display: block;
    padding: 0;
}

.news-single-item {
    max-width: 80%;
    margin: 0 auto;
}

.news-single-img {
    margin: 0;
}

#frontpage-linkbuttons .image-button a {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
}

#category-intro {
    max-width: 80%; 
}

#c60 #editorder-button,
#c60 #confirm-button {
    width: 100%;
    margin: 0 auto;
}

#c60 #confirmorder-buttons a {
    float: none;
    width: 100%;
    margin: 0;
}

#checkout-table .showcheckout-productname p, #checkout-table .showcheckout-producttotal p,
#checkout-table .showcart-total p, #checkout-table .showcheckout-subtotallabel p, #checkout-table .showcart-subtotallabel p, #checkout-table .showcart-subtotalprice p {
    font-size: 12px;
}

#c60 #checkout-table tbody tr td.showcheckout-productname {
    min-width: 90px;
}

#c60 #checkout-table tbody tr td.showcheckout-removeitem {
    max-width: 100%;
    min-width: 60px;
}

a.second_button, .second_button {
    width: 100%;
    margin: 0 auto 10px auto;
    box-sizing: border-box;
    text-align: center;
    height: auto;

}

#c60 .fieldwrap,
#c148 .fieldwrap {
    width: 100%;
    margin: 0 auto 10px auto;
    display: block;
}

#c60 .fieldwrap input, 
#c148 .fieldwrap input {
    box-sizing: border-box;
    width: 100%;
    float: none;
}

#c60 #voucher_submit {
    position: relative;
    top: 0;
}

#c60 #voucher_submit_btn {
    float: none;
    left: 0;
}

#c60 .fieldwrap.right input,
#c148 .fieldwrap.right input {
    float: none;
}

#c60 .checkoutbutton {
    width: 100%;
    float: none;
    box-sizing: border-box;
}

.log-in a:link,
.log-in a:visited,
.log-in a:active {
    padding: 14px 20px 14px 10%;
}
.log-in a:hover {
    cursor: pointer;
}

#account-page .fieldwrap {
    width: 100%;
    margin-right: 0px;
} 

#account-page .fieldwrap input {
    width: 100%;
}

#account-page .profile_back,
#account-page .profile_reorder {
    display: block;
    width: 100%;
}

#account-page .profile_back a,
#account-page .profile_reorder a {
    display: block;
    width: 100%;
    box-sizing: border-box;
    text-align: center;
}

#c116 {
    max-width: 100%;
}

#main #c61,
#main div#c148 {
    max-width: 80%;
    margin: 0 auto;
}

.tx-felogin-pi1 #login-submit {
    width: 100%;
    margin: 0 auto;
    display: block;
    box-sizing: border-box;
    float: none;
}

.tx-felogin-pi1 #registerhere {
    padding: 20px 0;
}

#c60 .check {
    float: none;
}

#account-page #orderitems thead tr th, #account-page #orderhistory_table thead tr th {
    font-size: 12px;
}

#account-page .profile_address {
    margin-top: 20px;
    width: 100%;
}

#account-page #orderitems td {
    font-size: 12px;
}

.tx-ocushop > a:link,
.tx-ocushop > a:active,
.tx-ocushop > a:visited {
    width: 80%;
    margin: 0 10% 20px 10%;
}

#shop-footer .columns2 .c2_c2 .links h3 {
    margin-right: 0;
}

#c9 .columns2 .c2_c2 .links h3 {
    margin-right: 0;
}

#c9 .columns2 .c2_c2 .links h3 a {
    width: 100%;
}

.tx-ocushop .backwrap a:link, .tx-ocushop .backwrap a:active, .tx-ocushop .backwrap a:visited {
    width: 100%;
}

/* Delivery Responsive */

.deliveryresponsive {
    display: block;
}

.deliverycalendar {
    display: none;
}

.deliveryresponsive .resp-calendar-scrollbuttons {
    font-size: 0;
}

.deliveryresponsive .resp-left,
.deliveryresponsive .resp-right,
.deliveryresponsive .resp-scroll-container {
    display: inline-block;
    vertical-align: middle;
}

.deliveryresponsive .resp-left, 
.deliveryresponsive .resp-right {
    width: 10%;
    text-align: center;
    font-size: 16px;
    cursor: pointer;
}

.deliveryresponsive .resp-scroll-container {
    max-width: 80%;
    width:100%;
    overflow: hidden;
    font-size: 12px;
    border: #333 1px solid;
    box-sizing: border-box;
    transform: translateZ(0); /* hack to force GPU accel for smooth js scrolling on mobile */
}

.deliveryresponsive .resp-scroll {
    font-size: 0;
    display: block;
    width: 2520%;
}

.deliveryresponsive .resp-scroll .resp-day-option {
    padding: 20px 0;
    width: 1%;
    box-sizing: border-box;
    text-align: center;
    display: inline-block;
    font-size: 12px;
    /*border: 1px solid #333;*/
    /*border-right: none;*/
    border-right:1px solid #333;
    cursor:pointer;
}

.deliveryresponsive .resp-scroll .resp-day-option:hover {
    background-color: #f38b00;
}

.resp-time-option.resp-avail:hover {
    background-color: #f38b00;
}

.deliveryresponsive .resp-scroll .resp-day-option:last-child {
   /* border-right: 1px solid #333;*/
    border-right: none;
}

.deliveryresponsive .resp-time-option {
    box-sizing: border-box;
    padding: 20px;
    font-size: 0;
    border: 1px solid #333;
    border-bottom: 0px solid transparent;
    cursor:pointer;
}

.deliveryresponsive .resp-time-option:last-child {
    border-bottom: 1px solid #333;
}

.deliveryresponsive .resp-time-option > span {
    display: inline-block;
    font-size: 12px;
    vertical-align: middle;
    width: 50%;
}

.deliveryresponsive .resp-time-option .resp-timespan {
    text-align: left;
}

.deliveryresponsive .resp-time-option .resp-status {
    text-align: right;
}

.deliveryresponsive .resp-avail {
    background-color: #fff;
}

.deliveryresponsive .selected {
    background-color: #f38b00;
}

.deliveryresponsive .resp-closed {
    background-color: #eee;
    color: #aaa;
}

.deliveryresponsive .responsive-timepicker,
.deliveryresponsive .responsive-datepicker,
.deliveryresponsive #deliveryinstructions {
    padding: 20px 0;
}

#editorder-button a:link, #editorder-button a:active, #editorder-button a:visited,
#c60 .checkoutbutton, #c148 .registrationbutton {
    width: 100%;
    box-sizing: border-box;
    margin: 0;
}
