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

body .visible-barnet, body .visible-hemelhempstead, body .visible-watford { display:none !important; } 
body .hidden-barnet, body .hidden-hemelhempstead, body .hidden-watford { display:inherit !important; } 
body.shop_barnet .hidden-barnet, 
body.shop_hemelhempstead .hidden-hemelhempstead, 
body.shop_watford .hidden-watford { display:none !important; }
body.shop_barnet .visible-barnet, 
body.shop_hemelhempstead .visible-hemelhempstead, 
body.shop_watford .visible-watford { display:inherit !important; }

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

body {
	color: #ffffff;
	font-family: 'Roboto';
}
h1 {
	color: #ffffff;
	font-family: 'Chewy';
	font-weight: normal;
}
h2 {
}
h3 {
	font-family: 'Chewy';
	font-weight: normal;
}
h4 {
}
body {
	background-color: #ea8a00;

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

	background-repeat: repeat;
	background-attachment: scroll;
}

header, #mobile-header {

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

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

.alert {text-align:center;}

.alert small { 
    font-size:60%;
    opacity:0.8;
}
/*---------------------resets/ display nones/ global---------------------*/
*{
    text-shadow: none !important;
    box-shadow: none !important;
}
.home h1, .contact-us h1, .home-about, #body-bottom-hr, 
.ct_header_row, .carousel-indicators, 
.main, .members .nav-list .logo, .carousel-caption {
    display: none;
}
#container, body{
    padding: 0;
}
footer{
    margin-top: 0;
}
.members #body .well .text-info, em { 
    color:#fff !important; 
}

.loyaltypoints_box {
	color:#fff;
    background:#0D9804 !important;
}
.loyaltypoints_box .row-credits .well {
    border:none;
    color:#333;
}

.home header{
    background-image: url("/myimages/305/zpos-bg-Slider_Background.jpg");
    background-attachment: scroll;
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
}	

/*---------------------fonts---------------------*/
a, a:hover, a:focus{
    color: #f3de28;
}
.navbar .brand, legend, .ctrl-offcanvas_productmenu_toggle .text-info,
.help-block, .section-.well .muted, .alert-info.well-login, .checkout .btn-link,
.voucher_box h5, .voucher_box .success span{
    color: #fff;
}
.popover,.gm-style-iw, .trigger-paymentmethod .muted, #responsive-food-menu .btn-navbar .text-info{
    color: #000;
}
legend{
    font-family: 'Chewy', sans-serif; 
    font-size: 25px; 
}
.menu h1{
    margin: 30px 0 20px;
    text-align: center;
    font-size: 70px;
    line-height: 100%;
}
/*---------------------containers---------------------*/
.welcome .navbar{
    margin-top: 0px;
}	
.welcome .navbar-inner .container{
 	position: relative;   
}
.welcome .main-menu a { display:none; }

.welcome #logo{
    position: absolute;
    top: 3px;
    right: -5%;
    z-index: 2;
}
#container{
    width: 100%;
    border-radius: 0;
    background: none;
}
#body, #responsive-food-menu, .navbar, footer .row-fluid, .welcome .ct_header_row{
    max-width: 1170px;
    margin: 0 auto;
}
#body{
    margin: 20px auto;   
    overflow: hidden;
}
.home #body{
    max-width: 1920px;
    margin-top: 0;
    margin-bottom: 0;
}
.well{
    background: #ed1b22;
    border-color: #f17b00;
}
.ct_details_bar{
    line-height: 30px;
}
.hero-unit{
    background: url('/myimages/305/members_background.png');
    padding-top: 80px;
    padding-bottom: 40px;
}
.hero-unit a{
    color: #ED1B22;    
}
.hero-unit p, .hero-unit h1, .hero-unit a{
    text-shadow: 2px 2px 3px rgba(0,0,0,0.3)!important;
}
/*---------------------desktop logo---------------------*/
.logo{
    height: 40px;
    background: none;
    position: relative;   
    text-align: center;
    z-index: 5;
}
.logo a{
    background: none !important;
    margin: -50px 0;
}	
.logo img{
    max-width: 70% !important;   
}
.home .logo img{
    max-width: 100% !important;   
}
/*---------------------tablet logo---------------------*/
.logo.hidden-desktop{
    height: auto;
    background: none;
    text-align: center;
}
.logo.hidden-desktop a{
    margin: 0;
}	
.logo.hidden-desktop a#opening-status{
    left: 50%;
    bottom: 9px;
}
.logo.hidden-desktop .ct_user_status{
    font-size: 100%;
    bottom: 41px;
}
/*---------------------nav styles---------------------*/
.navbar{
    margin-bottom: 0  !important;
}
.navbar-inner{
    background: #ed1b22;
    border: none;
    padding: 0;
}
header .navbar-inner{
    border-radius: 0 0 10px 10px;   
}
header .navbar-inner .container{
    position: relative;   
}
.navbar .nav{
    width: 100%;
}
.navbar .nav>li>a{
    background: #ed1b22;
    color: #fff;
    font-family: 'Chewy', sans-serif;
    font-size: 35px;
    line-height: 40px;
    text-transform: uppercase;
}
.navbar .nav>.active>a, .navbar .nav>.active>a:hover,
.navbar .nav>.active>a:focus, .navbar .nav>li>a:focus,
.navbar .nav>li>a:hover, .navbar .nav li.dropdown.open>.dropdown-toggle,
.navbar .nav li.dropdown.active>.dropdown-toggle,
.navbar .nav li.dropdown.open.active>.dropdown-toggle{
    color: #f3de28;
    background: #ed1b22;
}
/*---------------------caret colour---------------------*/
.navbar .nav li.dropdown > .dropdown-toggle .caret,
.navbar .nav li.dropdown.open>.dropdown-toggle .caret,
.navbar .nav li.dropdown.open.active>.dropdown-toggle .caret{
    border-top: 6px solid #fff;
    margin-top: 15px;
}
.navbar .nav li.dropdown > .dropdown-toggle:hover > .caret,
.navbar .nav li.dropdown.open > .dropdown-toggle .caret,
.navbar .nav li.dropdown>a:hover .caret,
.navbar .nav li.dropdown>a:focus .caret,
.navbar .nav li.dropdown.active>.dropdown-toggle .caret{
    border-top: 6px solid #f3de28;
}
/*---------------------nav list---------------------*/
.nav-list>li>a{
    color: #fff;
    font-family: 'Chewy', sans-serif;
}
.nav-list>li>a:hover, .nav-list>li>a:focus{
    background: none;
    color: #f3de28;
}
.nav-list>.active>a, .nav-list>.active>a:hover, .nav-list>.active>a:focus{
    background: none;
    color: #f3de28;
}
.nav-list .muted, .nav-header{
 	color: #f3de28;
}
/*---------------------nav button---------------------*/
.navbar .btn-navbar{
    background: none;
    text-shadow: none;
    border-color: white;
}
.navbar .btn-navbar:hover, .navbar .btn-navbar:focus,
.navbar .btn-navbar:active, .navbar .btn-navbar.active,
.navbar .btn-navbar.disabled, .navbar .btn-navbar[disabled]{
    background:#000;
}
/*---------------------dropdown menu---------------------*/
.dropdown-menu{
    background: #ed1b22;
}
.dropdown-menu>li>a{
    color: #fff;
    font-family: 'Chewy', sans-serif;
    font-size: 20px;
}
.dropdown-menu>li>a:hover{
    background: #ed1b22;
    color: #f3de28;
}
/*---------------------opening status---------------------*/
#opening-status{
    position: absolute;
    bottom: -40px;
    right: 30px;
    font-family: 'Chewy', sans-serif;
    font-size: 20px;
    border-radius: 0 0 6px 6px;
}
.status-CLOSED{
    color: white !important;
    background: #c01814;
}
.status-OPEN{
    color: white !important;
    background: #00a651;
}
/*---------------------details bar---------------------*/
.ct_details_bar{  
    background: #b80f15;
    background: -moz-linear-gradient(top, #b80f15 1%, #ee1b22 100%);
    background: -webkit-linear-gradient(top, #b80f15 1%,#ee1b22 100%);
    background: linear-gradient(to bottom, #b80f15 1%,#ee1b22 100%);
    padding: 10px;
    box-sizing: border-box;
}
/*---------------------slider---------------------*/
.carousel-inner {
    width: 70%;
    margin: 100px auto 0;
}
.carousel-control{
    background: none;
    border: none;
    font-size: 170px;
    font-family: 'Chewy', sans-serif;
    line-height: 0;
    left: 10%;
}
.carousel-control.right{
    right: 10%;   
}
/*---------------------postcode box---------------------*/
.mod_postcode_box{
    background: #c01814;
    border: none;
    border-radius: 0;
}
.mod_postcode_box .lead{
    font-family: 'Chewy', sans-serif;
    font-size: 37px;
    line-height: 100%;
    text-transform: uppercase;
    padding-top: 19px;
}
.mod_postcode_box .lead, .mod_postcode_box .col3{
    color: #fff;
}
.mod_postcode_box .input-append{
    padding: 5px 0;
    width: 100%;
}
.mod_postcode_box input, .mod_postcode_box .btn{
    height: 35px;
    border: none;
    border-radius: 0 !important;
    margin-bottom: 10px;
}
/*---------------------table stripped fix---------------------*/
table, .table-striped tbody>tr:nth-child(odd)>td,
.table-striped tbody>tr:nth-child(odd)>th,
.table-hover tbody tr:hover>td, .table-hover tbody tr:hover>th{
    background: #fff;
    color: #000;
}
.box-delivery-information table, .box-delivery-information .table-striped tbody>tr:nth-child(odd)>td,
.box-delivery-information .table-striped tbody>tr:nth-child(odd)>th,
.box-delivery-information .table-hover tbody tr:hover>td, .box-delivery-information .table-hover tbody tr:hover>th{
    background: #fff;
    color: #000;
}
.well-basket{
    background: #fff;
    color: #000;
}
/*---------------------menu page popovers---------------------*/
.popover .popover-title{
    background: #e14700;
    color: #fff;
}
#responsive-food-menu {
    left: initial !important;   
}
#responsive-food-menu .navbar-inner{
    padding-right: 20px;   
}
.menu .navbar .brand{
    margin-left: 0;
}	
/*---------------------modal---------------------*/
.modal-header{
    background: #ed1b22;
    color: #fff;
}
.modal-body{
    background: #fff;
    color: #000;
}
.modal-footer{
    background: #f3de28;
    color: #222;
}
.modal fieldset{
    background: #fff;
    border: none;
}
/*---------------------alerts & buttons---------------------*/
.btn{
    background-image: none;
}
.alert, .alert.alert-info.how-im-ordering{
    color: #fff;
    background: #000;
    border: none;
}
/*--------success--------*/
.btn-success, .alert.alert-success{
    background: #12BB12;
}
.btn-success:hover, .btn-success:focus, .btn-group.open .btn-success.dropdown-toggle{
    background: #008800;
}
/*--------primary--------*/
.btn-primary, .alert.alert-primary{
    background: #2357ce;
}
.btn-primary:hover, .btn-primary:focus{
    background: #00249B;
}
/*--------info--------*/
.btn-info, .alert.alert-info{
    background: #70afeb;
}
.btn-info:hover, .btn-info:focus{
    background: #5796D2;
}
/*--------danger--------*/
.btn-danger, .alert.alert-danger{
    background: #b30000;
}
.btn-danger:hover, .btn-danger:focus{
    background: #800000;
}
/*--------warning--------*/
.btn-warning, .alert.alert-warning{
    background: #FF871A;
}
.btn-warning:hover, .btn-warning:focus{
    background: #CC5400;
}
/*---------------------footer---------------------*/
footer{
    background: #ee1b22;
    background: -moz-linear-gradient(top, #ee1b22 1%, #b80f15 100%);
    background: -webkit-linear-gradient(top, #ee1b22 1%,#b80f15 100%);
    background: linear-gradient(to bottom, #ee1b22 1%,#b80f15 100%);
    padding: 10px;
    box-sizing: border-box;
}
.cards, .vendor{
    padding-top: 5px;
}
/*---------------------fixes---------------------*/
.ui-tabs-menu.ui-tabs.ui-widget.ui-widget-content.ui-corner-all {
    border-top-right-radius: 0;
    border-top-left-radius: 0;
}
.chilli-img{
    margin-top: 25px;   
}
.left-img, .right-img{
    position: relative;   
}
.pizza-img{
    position: absolute;
    top:10px;
    left: -150px;
    z-index: 0;
    transition: all 6s linear;
    -webkit-transition: all 6s linear;
    -moz-transition: all 6s linear;
}
.burger-img{
    position: absolute;
    top:20px;
    right: -150px;
    z-index: 0;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;

}
.img-left, .img-right{
    position:relative;
    z-index: 1;
}
.right-img:hover .burger-img{ 	
    -webkit-transform: translate(50px); 
    -ms-transform: translate(50px); 
    transform: translate(50px); 
}
.left-img:hover .pizza-img{ 	 
    -webkit-transform: rotate(360deg); 
    -ms-transform: rotate(360deg); 
    transform: rotate(360deg);
}
.members .hero-unit .span4.hidden{
    height: 75px;   
}
.img-rounded img{
    border-radius: 6px;
}	
.ui-tabs-menu, .row-product:hover, .row-odd{
 	background: #ed1b22;    
}
.menu .ui-widget-content {
    color: #fff;
}
.menu .ui-widget-content{
 	border: none;   
}

.branch_finder_box .lead {
    color:#fff;
}
#welcome-row-fluid-outer h2 {
    font-size:27px;
    text-align: center;
}
.welcome .branch-select {
    margin-bottom: 15px;
}
#welcome-row-fluid-outer h1 {
    font-size: 73.5px;
    line-height: 100%;
    text-align: center;
}
.welcome footer {
    width: 100%;
}
#responsive-food-menu .btn-navbar {
    background: #f3de28;
}

.btn, input, .branch_finder_box .lead,
.welcome .branch-select, #welcome-row-fluid-outer h2 {
    font-family: 'Chewy';
}	
 .branch_finder_box .lead{
    font-size: 27px; 
 }	
.btn, .input-append input {
    font-size: 20px;
}	
/*---------------------media queries---------------------*/

@media (max-width: 1325px) {
    .welcome #logo {
        display: none !important;   
    }
    
    #welcome-row-fluid-outer h1 {
        font-size: 69px;
    }
}

/*---------------------large desktop---------------------*/
@media (max-width: 1200px) {
    .navbar .nav{
        margin: 0;
        padding-right: 0!important;
    }
    .navbar .nav>li>a{
        font-size: 25px;
    }
    .pizza-img, .burger-img{ 	 
        display: none;
    }
    .website-image{
        text-align: center;
    }
    #responsive-food-menu {
        left: 0!important;
    }
    
    .welcome #body {
		padding: 0 10px;
    }
}

/*---------------------portrait table and landscape desktop---------------------*/
@media (min-width: 768px) and (max-width: 979px) {
    .navbar .nav{
        float: none;
        text-align: center;
    }
    .nav-collapse .dropdown-menu a{
        color: #fff;
    }
    .nav-collapse .dropdown-menu a:hover, .nav-collapse .dropdown-menu a:focus{
        background: #ed1b22;
        color: #f3de28;
    }
    header .navbar-inner{
        border-radius: 0;   
        padding-bottom: 10px;
    }
    #opening-status{
        position: static;
        border-radius: 0;
        margin-left: 10px;
    }
    .logo{
        display: none;   
    }
    .carousel-inner {
        width: 100%;
        margin: 20px auto;
    }
    .carousel-inner>.item>img, .carousel-inner>.item>a>img{
     	margin-left: -20px;   
    }
    .welcome #logo{
     	position: static;   
    }
}
@media (min-width: 979px) {
     
    .navbar .nav, .navbar .nav>li {
        float:none !important;
        display:inline-block;
        padding: 0 15px;
    }
    .navbar-inner {
        text-align:center;
    }
    .navbar .nav>li{
        float: left !important;   
    }
}


@media (max-width: 979px) {
    .welcome #logo{
     	position: static;
        text-align: center;
        display: block !important;
    }
    #welcome-row-fluid-outer h1 {
        font-size: 56px !important;
        line-height: 100%;
        margin-top: 20px;
    }
    .welcome header { display:none !important; }
}
/*---------------------landscape phone and portrait tablet---------------------*/
@media (max-width: 767px) {
    #mobile_food_menu_nav .zp-ctl-categories {
        color: #fff !important;
    }
    .ui-tabs-vertical .ui-tabs-panel {
        width: 100% !important;
    }
    .logo.hidden-desktop{
     	padding: 10px;   
    }
    #body{
        margin: 10px 10px;
    }
    .home #body{
        margin: 0 10px;
    }
    .navbar .nav{
        float: none;
        text-align: center;
    }
    .nav-collapse .dropdown-menu a{
        color: #fff;
    }
    .nav-collapse .dropdown-menu a:hover, .nav-collapse .dropdown-menu a:focus{
        background: #ed1b22;
        color: #f3de28;
    }
    header .navbar-inner{
        border-radius: 0; 
        padding-bottom: 10px;
    }
    #opening-status{
        position: static;
        border-radius: 0;
        margin-left: 10px;
    }
    .logo{
        display: none;   
    }
    .carousel-inner {
        width: 100%;
        margin: 20px auto;
    }
    .carousel-inner>.item>img, .carousel-inner>.item>a>img{
     	margin-left: -20px;   
    }
    .left-img{
        margin-bottom: 20px;   
    }
    .left-img, .right-img{
        text-align: center;   
    }
    .how-im-ordering h2{
        font-size: 20px;
        line-height: 100%;
    }
    .tl, .tr, .copyright{
        text-align: center !important;
        padding: 0;
    }
    footer .tl, footer .tr, .copyright{
        padding: 20px 0;
    }
    .homedisc.visible-phone {
        text-align: center !important;
        margin: 0 auto;
        margin-bottom: 20px;
    }

}
@media (min-width: 481px) and (max-width: 768px) {
    .img-left, .img-right {
        position: relative;
        z-index: 1;
        margin-bottom: 20px;
    }
}
/*---------------------landscape phone and down---------------------*/
@media (max-width: 480px) {
    #myCarousel, .ct_details_bar, .home .span4.left-img,  .input-append .btn.hidden{
        display: none;   
    }
    .mod_postcode_box input,
    .mod_postcode_box .btn-group .btn,
    .form-horizontal .input-append input,
    .input-append input,
    .input-append .btn,
    .branch_finder_box > .input-append{
        max-width: initial;
        width: 100% !important;
        border-radius: 0;
    }
    .mod_postcode_box .btn-group,
    .form-horizontal .input-append .btn,
    .input-append .btn {
        margin-left: 0;
        margin-top: 0;
        display: block;
    }
    .input-append .btn{
        margin-top: 10px;
    }	
    .home #body{
        padding: 20px 10px;   
    }
    .mod_postcode_box .input-append input{
        width: 153px;
    }
    .mod_postcode_box .btn-group>.btn{
     	font-size: 26px;   
    }
    .mod_postcode_box input, .mod_postcode_box .btn {
        height: 50px;
    }
}
    

.social_media_links  {
    max-width:1000px;
    margin:0 auto;
    padding:10px 0;
    text-align:center;
}
.social_media_links img { max-width:32px; }
.social_media_links img:hover { max-width:32px; }
.social_media_links small { display:none; }
.social_media_links a {
    background-color: transparent;
    background: none !important;
    border: none !important;
    box-shadow: none;
    padding:0px;
    width:45px !important;
}

body.page_ios-apple-app ,
body.page_ios-android-app {
    display:none;
    background:#fff;
}



/* WELCOME PAGE - RESPONSIVE FIXES ---- */
@media (max-width: 979px)  {
    .page_welcome #welcome-row-fluid-outer > .span4,
    .page_welcome #welcome-row-fluid-outer > .span8 {
       	display: block;
    	width: 100%;
        margin: 0 auto;
	text-align: center;
    }
    
    .page_welcome #welcome-row-fluid-outer > .span4 .branch-select:first-child {
     	margin-top: 20px;   
    }
    
    .page_welcome #welcome-row-fluid-outer > .span4 .branch-select,
    .page_welcome .branch_finder_box {
        box-sizing: border-box;
	    max-width: 600px;
   		margin: 0 auto 10px;
    }
    
        .branch_finder_box > .input-append {
        width: 50%;
    }
}

@media (max-width: 767px)  {
    .page_welcome .navbar h1 ,
    #welcome-row-fluid-outer h1,
    #welcome-row-fluid-outer h2 {
     	text-align: center;   
    } 
}

@media (max-width: 550px) {
 	#branch_finder_box_pc {
        width: 70% !important;
        display: inline-block;
    }
    #branch_finder_box_submit {
        display: inline-block;
        margin: 0;
        width: 30% !important;
    }
    .branch_finder_box > .input-append {
     	width: 80%;   	
    }
}

#logo .branch-select {
	display: none;
}
.shop_hemelhempstead #container-category-25345,
.shop_hemelhempstead #container-category-25346,
.shop_hemelhempstead #container-category-25347,
.shop_hemelhempstead #container-category-25348{
    display: none;
}

.selected-no-salad {
display: none;
}

p.alert-19765 > small {
font-size: 100%;
}