@import url(https://fonts.googleapis.com/css?family=Lato|Aleo|Aleo|Aleo|Aleo);

body .visible-gravesend { display:none !important; } 
body .hidden-gravesend { display:inherit !important; } 
body.shop_gravesend .hidden-gravesend { display:none !important; }
body.shop_gravesend .visible-gravesend { display:inherit !important; }

.visible-guest { display:initial !important; }
.hidden-guest { display:none !important; }
.visible-user { display:none !important; }
.hidden-user { display:initial !important; }

body {
	font-family: 'Lato';
}
h1 {
	font-family: 'Aleo';
}
h2 {
	font-family: 'Aleo';
}
h3 {
	font-family: 'Aleo';
}
h4 {
	font-family: 'Aleo';
}
body {
	background-color: #000000;

	/*background-image: url("/myimages/731/zpos-bg-HunkyDory_BGbottomV2.jpg");*/
	background-image: url("//cdn1.zfood.co.uk/731/images/zpos-bg-HunkyDory_BGbottomV2.jpg?auto=compress");

	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center top;
	background-size: cover;
}

header, #mobile-header {

	background-image:none;
	background-attachment: scroll;
}

/* Mobile */
.mobile .km-content {
}
.mobile #mobile-header {
}

/* DISPLAY NONES ----------------------------------------------- */
.row_phones, .page_home #body h1, .ct_header_row, .span4.column_modules, .navbar .caret, .home-about, #body-bottom-hr, .contact-us h1, .checkout .span9, hr, .menu h1 {
    display: none;
}


/* GENERAL / WIDTHING ----------------------------------------------- */
[class^="icon-"], [class*=" icon-"] { /* icons */
    background-image: url(//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/img/glyphicons-halflings-white.png);  
}

body {
 	padding-bottom: 0;
}

#container {
 	background: none;
    box-shadow: none;
    width: 100%;
    padding: 0;
}
.detailsBarCenter, header, footer, #body, .BannerInserts, .LoyPointsSection, .menu .navbar-inner {
 	max-width: 1170px;
    margin: 0 auto;
}
input, select, .btn {
 	border-radius: 0 !important;   
}
a {
 	color: #ffcc00;
}
a:hover, a:focus {
 	color: #ffae00;
}
.well {
    border: none;
    box-shadow: none;
    border-radius: 0; 
    background: white;
}
.website-image {
    text-align: center;   
}
.home h1, .home h2, .modal-header, .modal-footer {
 	color: white;   
}
.status-OPEN {
 	color: #85c441 !important;
}

/* ALERTS (so postcode box stylin will overwrite) ----------------------------------------------- */
.modal {
    border-radius: 0;
    border: none;
    box-shadow: none;   
}
.modal-header, .modal-footer {
 	border-radius: 0;
    border: none; 
    background: #a1070e;
}
.modal-body {
 	background: white;
    color: black;
}
.alert {
    border: none;
	border-radius: 0;
    background: #e5c529;
    color: black;
    text-shadow: none;
    
}
.delivery_deal_modal .modal-footer {
    display: none;
}
.alert-error, .alert-danger {
	background: #ce3434;
    color: white;
}
.alert-warning {

}
.alert-success {
	background: #648e25;
}
.alert-info {
	background: #75a6e5;
}

.dropdown-menu { 
	width: 100%;
    border-radius: 0;
    left: 14px;
    border: none;
}
.dropdown-menu>li>a {
    padding: 4px 0px;
    text-align: center;
}
.dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus, .dropdown-submenu:hover>a, .dropdown-submenu:focus>a { /* hover highlight */
	background: #ba131a;
}

/* HEADER / NAV BAR ----------------------------------------------- */
header .navbar {
 	margin: 25px 0 !important; 
}

.ct_details_bar {
    color: white;
 	background: black;
    min-height: 42px;
    line-height: 42px;
}
#logo {
 	max-width: 250px;
    display: inline-block;
}
.navbar .main-menu li, .navbar .nav a { /*navbar center */
    display: inline-block;
    text-align: center;
    float: none;
}
#opening-status {
    text-shadow: none;
    font-size: 27px;
    line-height: 37px;
    text-transform: capitalize;
    font-weight: bold;
    padding: 0 0 0 10px;
    margin-left: 0;
}
header, .ct_details_bar { /*ensures navbar always remains on top of slideshow */
    z-index: 999;
    position: relative;   
}
.navbar .nav { 
    text-align: center;
    float: none;
    float: right;
    margin: 0;
}   
header .navbar .navbar-inner { /* style nav bar */
    display: inline-block;
    float: right;
    background: none;
    background-image: none;
    border: none;
    min-height: 57px;
    padding: 0;
    box-shadow: none;
}
.navbar .nav>li {
 	padding: 0 10px;   
}
.navbar .nav>li>a /*style nav links*/ {
    text-shadow: 0 1px 0 #000000;
    line-height: 37px;
    font-size: 27px;
    font-weight: bold;
    color: white;
    padding: 0;
}
.navbar .nav>li>a:hover, .navbar .nav>li>a:focus, .nav-collapse .nav>li>a:hover, .nav-collapse .nav>li>a:focus {
    color: #ffcc00;
    background: none;
}
.navbar .nav li.dropdown.open>.dropdown-toggle, .navbar .nav li.dropdown.active>.dropdown-toggle, .navbar .nav li.dropdown.open.active>.dropdown-toggle, .navbar .nav>.active>a, .navbar .nav>.active>a:hover, .navbar .nav>.active>a:focus { /* remove default active link box-shadow */
	box-shadow: none; 
    background: none;
    color: #ffcc00;
}
.navbar-inner small, .navbar-inner small:hover, .navbar-inner small:focus {
 	font-size: 12px;
    display: block;
    line-height: 1;
    color: #a7a6a5;
}
.dropdown-menu { /*dropdown menu for ordering*/
    max-width: 200px;
}
.dropdown-menu>li>a {
    padding: 4px 0px;
    text-align: center;
}

.navbar .btn-navbar, .navbar .btn-navbar:hover, .navbar .btn-navbar:focus { /*mobile navbar burger*/
    text-shadow: none;
    box-shadow: none;
    padding: 10px;
    margin-bottom: 5px;
    background: none;
}

.navbar .btn-navbar .icon-bar {
    width: 30px;
    height: 4px;
    margin-bottom: 6px;
}

.navbar .btn-navbar:hover .icon-bar, .navbar .btn-navbar:focus .icon-bar {
    background: #ffc700;
}

.uk-offcanvas-bar {

}
.uk-nav-offcanvas>.uk-open>a, html:not(.uk-touch) .uk-nav-offcanvas>li>a:focus, html:not(.uk-touch) .uk-nav-offcanvas>li>a:hover {

}

/* fix main navbar dropdown menu */
.navbar .dropdown-menu li {
 	display: list-item;
}
.navbar .dropdown-menu li > a {
    display: block;
}

/* SLIDESHOW  ----------------------------------------------- */
.column_slideshow {
 	width: 100%;
    /*margin: -80px 0 0 0;*/
    margin: -108px 0 0 0;
}
.carousel {
 	margin: 0;   
}
.carousel-control {
 	background: transparent;
    border: none;
    font-size: 115px;
	color: #666766;
    opacity: 1;
}
.carousel-control:hover, .carousel-control:focus {
 	color:  #c0c0c0;  
}

/* HOMEPAGE BANNER POSITIONING ----------------------------------- */
.BannerArea {
    background: #a60002 url(//cdn1.zfood.co.uk/731/images/zpos-bg-HunkyDory_BGbottomV2.jpg?auto=compress) no-repeat center ; 
    background-size: cover;
    border-top: 12px solid #ffc700;
}
.BannerInserts {
 	position: relative;   
}
.HomeBanner1Insert, .HomeBanner2Insert {
	width: 413px !important;   
}
.BannerInserts {
    height:auto;   
}
.HomeBanner1Insert, .HomeBanner2Insert {
    position: relative;
    overflow: hidden;
}
.HomeBanner1, .HomeBanner2 {
    top: 0;
    left: 0;
}
.HomeBanner1Insert:hover .HomeBanner1 img, .HomeBanner2Insert:hover .HomeBanner2 img  {
    -webkit-transform: scale(1.025);
}
.HomeBanner1 img, .HomeBanner2 img {
    -webkit-transition: 0.6s ease;
 	transition: 0.6s ease; 
}

.span2.PostcodeBoxInsert {
    right: 250px;
    position: absolute; 
}

.LoyPointsSection {
 	font-family: "Aleo", serif;
    text-align: center;
    color: white;
    line-height: 35px;
    margin-top: 73px;
}
.LoyPointsTitle {
    text-transform: uppercase;
    font-size: 39px;
    font-weight: bold;
}
.LoyPointsDesc {
 	font-size: 24px;
    margin-bottom: 57px;
}
.LoyPointsDesc a {
 	color: #fded04; 
}
.LoyPointsDesc a:hover,.LoyPointsDesc a:focus {
 	color: #ffc51c;
    text-decoration: none;
}


/* POSTCODE BOX  ----------------------------------------------- */
.mod_postcode_box {
    position: relative;
    z-index: 1;
 	width: 325px;
    height: 269px;
    margin-top: 110px;
    padding: 57px;
    background: white;
}
.mod_postcode_box > .input-append {
 	margin-bottom: 24px;
}
.mod_postcode_box .lead, .mod_postcode_box .postcodeRed, .members legend  {
 	text-transform: uppercase;
    font-family: "Aleo", sans-serif;
    font-weight: bold;
}
.mod_postcode_box .lead {
    color: black;
    font-size: 51px;
}
.mod_postcode_box .postcodeRed {
    color: #ba131a;
    font-size: 30px;
    font-style: italic;
    margin-bottom: 27px;
}
.mod_postcode_box .col.col3 .muted {
    font-size: 14px;
    color: black;
}
.input-append .btn-group {
 	margin-left: 0;   
}
#mod_postcode_box_pc, .input-append .btn-group:last-child>.dropdown-toggle {
	border-radius: 0;
    display: block;
    font-family: "Lato", sans-serif;
}
#mod_postcode_box_pc {
	border: 2px solid #959595;
    width: 391px;
    height: 41px;
    padding: 12px 0;
    color: #666766;
    font-size: 19px;
    font-weight: bold;
}
.input-append .btn-group:last-child>.dropdown-toggle {
    width: 325px;
    height: 41px;
    background: #ba131a;
    color: white;
    margin-top: 13px;
    font-weight: bold;
    font-size: 18px;
    text-transform: capitalize;
}
.home .btn-group.open .btn-success.dropdown-toggle {
    background: #8e0f14;
}


/* WEBSITE BUTTONS / LABELS  ----------------------------------------------- */
.btn, .btn-group, .btn-group>.btn:first-child, .btn-group>.btn:last-child {
    text-shadow: none;
    background-image: none;
    border: none;
    box-shadow: none;
    border-radius: 0;
}
.btn-default {
	background: #eaeaea;
}
.btn-default:hover, .btn-default:focus {
	background: #c3c2c2;
}
.btn-primary {
	background: #659cd5;
}
.btn-primary:hover, .btn-primary:focus {
  background: #497db2;
}
.btn-success {
  	background: #23992c;
}
.btn-success:hover, .btn-success:focus, .btn-group.open .btn-success.dropdown-toggle {
 	background: #198221;
}
.text-success {
	color: #23992c;
}
.btn-danger {
   	background: #d9322b;
}
.btn-danger:hover, .btn-danger:focus {
	background: #b6211b;
}
.text-error {
  	color: #d9322b;
}
.btn-warning {
	background: #ffa500;
}
.btn-warning:hover, .btn-warning:focus {
   background: #d18700;
}
.text-warning {
   color: #d88a02;
}
.btn-info {
    background: #4388b1;
}
.btn-info:hover, .btn-info:focus {
	background: #317096;
}
.text-info {
   color: #317096;
}
.btn-inverse {
   background: #585858; 
}
.btn-inverse:hover, .btn-inverse:focus {
   background: #414141; 
}
.btn-link {
 	color: #262626;
}
.btn-link:hover, .btn-link:focus {
    color: black;   
}
    
/* CHECKOUT MODAL STYLING  ----------------------------------------------- */

/*LOYALTY POINTS BOX ----------------------------------------------- */
.loyaltypoints_box {
    background:#000 !important;

}
.loyaltypoints_box .row-credits .well { /* border around counters */
    
}
.loyaltypoints_box .row-credits { /*points counter */
     
}
.loyaltypoints_box .ui-widget-header {
    border: none;
   
}
.loyaltypoints_box .btn-link {
    
}
.loyaltypoints_box .btn-link:hover, .loyaltypoints_box .btn-link:focus {
     
}
/*--- loyalty points/credit card ----*/
.loyaltypoints_box .lead, 
.loyaltypoints_box .ctl-pointsoptions a, 
.loyaltypoints_box label.checkbox.text-left, 
.loyaltypoints_box p, .checkout button small,
.ui-helper-block .muted{
    color: #fff !important;
}
.lead.well-white{
    color: #000 !important;
}

/* MENU PAGE  ----------------------------------------------- */
.menu-count-2 .well {
 	 background: black;  
}
.menu .navbar-affix-container .text-info {
 	color: white;   
}
.menu .navbar-affix-container .text-info:hover, .menu .navbar-affix-container .text-info:focus {
 	color: #d3d3d3;   
}
.how-im-ordering {
    color: white;
 	background: black;   
}
.menu h5 {
    font-size: 18px;
    line-height: 30px;   
}
.menu ul li {
    line-height: 1.5;   
}
.menu .description {
    font-size: 16px;   
}
#editProductModal .media-heading, #editSpecialDealModal .media-heading {
	text-align: center;
}
#editProductModal .media-body {
    text-align: center;
}
#editProductModal .media-body ul {
    text-align: center;
    list-style: none;
    margin: 0;
}
#editSpecialDealModal ul {
    text-align: center;
    list-style: none;
}
#editSpecialDealModal small, #editProductModal small, .media-body ul li {
    font-size: 15px;
}
.row-product:hover {
 	background: transparent;   
}

#responsive-food-menu {
 	margin: 0;
    background: #ba131a;
}

#responsive-food-menu  .navbar-inner {
 	border-radius: 0;
    background: #ba131a;
    border: none;
}
#responsive-food-menu .brand {
    text-shadow: none;
    color: white;   
}

.navbar-search .search-query {
 	border-radius: 0;   
}

.ui-tabs-menu, #ui-tabs-1, .menu .ui-widget-header { /*ui-widget-header recolours the menu navbar background due to themeroller error */
 	border: none;
    background: white;
    padding: 0;
}

.uk-offcanvas-bar{
	background: #ba131a;
    color: white;
}
.uk-offcanvas-bar-flip {
    background: white;
    color: black;
}

.popover {
     border-radius: 0;
    border: none;
    background: black;
    color: white;
}
.popover-title {
    background: #ba131a;
    color: white;
    border-radius: 0;
}

/* MEMBERS  ----------------------------------------------- */
.hero-unit a {
    color: #8d2626;
}
.hero-unit a:hover, .hero-unit a:focus {
    color: #5c1010;
}

.sidebar-nav {
 	background: black; 
    text-shadow: none;
    box-shadow: none;
    color: white;
}
.sidebar-nav .nav>li>a{
 	color: white;
    text-shadow: none;
}
.sidebar-nav .nav>li>a:hover, .sidebar-nav .nav>li>a:focus,
.sidebar-nav .nav-list>.active>a, .sidebar-nav .nav-list>.active>a:hover, .sidebar-nav .nav-list>.active>a:focus{
    background: #ba131a;
    color: white;
}
.sidebar-nav .nav-header {
 	color: #ffcc00;
    text-shadow: none;
    
}

/* ORDER PAGE  ----------------------------------------------- */
.hero-unit {
	background: #ffcc00;
    color: black;
}
.jumbotron-order-complete {
    background: white;
    color: black;
    padding: 30px 0;
}

.well-login, .voucher_box, .loyaltypoints_box {
   	background: #ffb200;
    color: black;
}
.checkout .marginbottom15 .muted {
 	color: white;   
}

/* ADDITIONAL CHANGES  ----------------------------------------------- */
footer {
 	margin-top: 50px; 
}
footer .muted {
 	color: white;
    font-size: 13px;
}
legend {
	border-bottom: 1px solid #8f0100;
}
.table-bordered .ui-state-highlight {

}
.table-hover tbody tr:hover>td, .table-hover tbody tr:hover>th { /*table row highlight colour*/
	background: transparent;
}

/* 404  ----------------------------------------------- */
.error-500 #body{
    color: white;
}
.page_error-404 .text-error {
	 color: white;
}

/* CONTACT PAGE  ----------------------------------------------- */
.contact-us .ui-widget-header {
 	background: black;
    color: white;
}

/* T&CS PAGE  ----------------------------------------------- */
.page_information .page-header, #info-company-information {
    color: white;
    text-align: center;
}
.page_information .page-header {
    border: none; 
}
.page_information .official-document {
    font-family: "Arial", sans-serif;   
}
    
/* REVIEW PAGE  ----------------------------------------------- */
.page-review-order {
 
}
.page-review-order .lead {

}

@media (max-width: 1300px) {
	.navbar {
     	padding: 0 15px;   
    }
    .ct_details_bar {
     	width: 100%;   
    }
    .ct_user_status small, .ct_local_branch_details small {
     	padding: 0 15px;  
    }
    .BannerInserts {
     	max-width: 90%;   
    }
    
    .LoyPointsSection {
     	padding: 0 10px;   
    }
    
    footer {
     	padding: 0 20px 0;     
    }
    .nav-collapse .dropdown-menu {
     	margin: 0;   
    }
}

@media (max-width: 1150px) {
     .HomeBanner2 {
      	margin-left: 0 !important;   
     }
     header .navbar {
        text-align: center;
         background: black;
         margin-top: 0 !important;
         padding-top: 25px;
     }	
     header .navbar .navbar-inner {
      	float: none;
        display: block;
     }
    .navbar .nav {
     	float: none;   
    }
    #logo {
        display: block;
     	margin-bottom: 30px;
        max-width: 100%;
        text-align: center;
    }
    #logo img {
     	max-width: 300px;
    }
    .column_slideshow {
     	margin-top: -40px;   
    }

    footer .row-fluid > div {
     	display: block; 
        width: 100% !important;
        text-align: center !important; 
        margin-top: 10px;
    }
    
    .nav-collapse .dropdown-menu a {
        color: #a7a6a5; 
        margin-bottom: 0 !important;
        line-height: 1;
    }
    .nav-collapse .dropdown-menu .home-delivery {
        padding-top: 12px !important;   
    }
    .nav-collapse .dropdown-menu a:hover,.nav-collapse .dropdown-menu a:focus {
        color: #ffcc00;
    	background: none;
    }	
}

/* Portrait tablet to landscape and desktop */
@media (max-width: 979px) {
	#logo {
     	display: inline-block;
        max-width: 300px;
    }
    .home #logo {
     	padding-bottom: 30px;   
    }
    header .navbar-inner {
     	display: block;
        margin-top: -40px;
    }
    .navbar .main-menu li, .navbar .nav a {
     	display: block;
        margin-bottom: 10px;
    }
    .BannerInserts {
        max-width: 100%;
    }
    .span2.PostcodeBoxInsert {
     	width: 100%;
        position: initial;
    }
    .mod_postcode_box {
     	margin-top: 0;
        max-width: 100%;
        width: 100%;
        padding: 40px 0 20px;
    }
    .home .input-append .btn-group, .home .input-append .btn-group:last-child>.dropdown-toggle {
     	width: 100%;   
    }
    .HomeBanner1Insert, .HomeBanner2Insert {
        margin-top: 15px; 
    }
    
    .mod_postcode_box .input-append {
     	display: block;  
        padding: 0 15px;
    }
    #mod_postcode_box_pc {
     	width: 100%; 
    }
    
    .HomeBanners {
        text-align: center !important;   
    }
	.HomeBanners > div {
     	float: none !important;
    }
    .HomeBanner1Insert {
        margin-right: 10px;
    }
    .HomeBanner1Insert, .HomeBanner2Insert {
     	width: 40% !important;
        display: inline-block !important;
    }
    footer {
        margin-top: 15px;   
    }
    footer .span4 {
        margin-bottom: 5px;
    }
    
    .LoyPointsSection {
     	margin: 30px 0 18px;   
    }
    .LoyPointsDesc {
     	margin-bottom: 0;
        font-size: 20px;
    }
    .LoyPointsTitle {
        font-size: 28px;   
    }
}
 
/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
	body {
     	padding: 0;   
    }
    .navbar {
     	margin-top: 18px;   
    }
    .ct_details_bar {
        line-height: 2;
    }
    .ct_user_status, .ct_local_branch_details {
     	text-align: center !important;   
    }
    #logo img {
        max-width: 90%;
    }
    #order-empty {
     	margin-bottom: 10px;   
    }
}
 
/* Landscape phones and down */
@media (max-width: 480px) {
    .carousel-control {
        font-size: 55px;
    }	
    .mod_postcode_box .lead {
     	font-size: 40px;
    }
    .mod_postcode_box {
     	padding: 20px 0 ;   
    }
   .postcodeRed {
    	font-size: 24px;
       margin-bottom: 0;
   }
    
    #mod_postcode_box_pc {
     	width: 100%; 
    }
    .ct_user_status {
     	line-height: 1.2;
        margin-top: 15px;
    }
	.ct_local_branch_details {
     	display: none !important;   
    }

}

.menu-title{
    color: #9c0d13;
    text-align: center;
    text-transform: uppercase;
    padding: 5px 10px !important;
    box-sizing: border-box;
}	
.ui-tabs-nav li a {
    font-size: 18px;
    line-height: 25px;
}



/**ACCORDION****/
.tb-nav.tb-nav-tabs ,
.menu #body brand, .ctrl-offcanvas_productmenu_toggle_bridge_mobile2_ { display:none !important; }
.ui-tabs-vertical .ui-tabs-panel { width:100% !important; }
.accordion-inner { padding: 15px 30px; }
.accordion-inner { background: transparent; }
.accordion-inner .row-product { padding-top:10px; padding-bottom:10px; }
#menu-accordion .ui-widget-header { background:none; border:none; }
.accordion-body { background:#fff; }
.accordion-group { border:none; margin-bottom:0px; }
.accordion-toggle {
    border-radius: 2px !important;
    background-color: #FFFFFF;
    text-align:center;
    border: 1px solid #000000 !important;
}
.accordion-toggle .ui-widget-header {
 	color: #333333;  
}
.accordion-body {
    border-radius: 0px !important;
    background-color: #fff;
}
.active-toggle,
.accordion-toggle:active {
    background: #ffc700 !important;
    color: #333333 !important;
}
.active-toggle:hover,
.accordion-toggle:active:hover {
    background: #ffc700 !important; 
    color: #333333 !important;
}
.accordion-toggle:hover,
.accordion-toggle:focus {
    background:#ffc700;
    color:#333333;
}
.active-toggle h3,
.accordion-toggle:hover h3,
.accordion-toggle:active h3,
.accordion-toggle:focus h3 {
    color:#000;
}
.accordion-toggle .fa { display:none !important; }
.ui-tabs-vertical .ui-tabs-panel,
.ui-tabs-menu,
#ui-tabs-1 { padding:0px !important; border:none;}
.ui-tabs-menu { background: none !important; border: none !important; }
.ui-tabs-menu h3 { font-size:20px; }
.loading { text-align:center; }
.loader {
	color: #FFFFFF !important;
    font-size:65px;
    margin:0 auto;
    padding:35px;
    text-align:center;
}
#responsive-food-menu
.ui-tabs-menu { opacity:0; }
.minus,.plus { line-height:40px;float:right; color:#fff; font-weight:bold; }
.accordion-heading h3 .fa { float: right; line-height: 40px; }
#responsive-food-menu {
	border-radius: 10px !important;
}
.navbar-affix-container {
    margin-bottom: 10px !important;
}
#responsive-food-menu.navbar {
    padding-bottom: 7px !important;
}
#menu-accordion .cat-desc {
    border: 1px solid #fff;
    background: #F7BF29;
    color: #444;
    padding: 10px 20px;
}
.accordion-inner {
    padding: 30px;
}
#mobile_food_menu_nav .zp-ctl-categories {
    display: none !important;
}

/* Menu Offers */
.product-343891,
.product-343889, 
.prod-cat-27194,
.product-343890
{
    display: none !important;
}