@charset "utf-8";
/* CSS Document */

/* Table of Contents
-----------------------------------------------------------------------------
	1. Mobile
	2. Large Mobile
	3. iPad
	4. large desktop
	5. Other
*/
html, body{-webkit-appearance:none; border:none; -webkit-text-size-adjust:none; -webkit-border-radius: 0;}
input[type="text"], input[type="submit"], input[type="button"], input[type="password"], input[type="email"], input[type="tel"], input[type="search"], textarea{-webkit-border-radius: 0;}
.menu-trigger{display: none;}
#inner-container.menus{padding-bottom: 40px;}
/* 1. Mobile responsive css 640px
------------------------------------------------------------------------------*/
@media (max-width:640px) {
	body{min-width: inherit;}
	img{max-width: 100%;}
	.container{padding: 0 15px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
	h1{font-size: 28px; line-height: 34px;}
	h2{font-size: 18px;}

	/* header */
	header .container{width: 100%;}	
	.header-wrap{height: 85px;}
	.header-wrap.scroll{height: 80px;}
	.header-wrap.home-scroll{height: 80px;}
	header:before{height: 10px; background-size: contain; bottom: -5px;}
	header.sticky .brand{width: 180px; padding-top: 10px;}
	header .brand{width: 180px; padding-top: 10px;}
	header .nav-right{width: 100%; padding: 0; float: none; text-align: left;}
	header .nav-right .nav-top{padding: 28px 10px; background: rgba(16,73,158,.7);}
	header .nav-bottom{padding: 0;}
	header nav{height: 100%; text-align: left;}
	header nav ul li{display: block; margin: 0;}
	header nav ul li a{font-size: 16px;}
	header.sticky nav ul li a{font-size: 16px;}

	body.scroll-hidden{overflow: hidden; position: fixed; width: 100%;}
	header{min-height: 80px; z-index: 9999;}
	.menu-trigger{display: block;}
	.menu-trigger{display: block;width: 40px;height: 40px;position: absolute;-ms-touch-action: manipulation;touch-action: manipulation;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;background-image: none;white-space: nowrap;z-index: 999999;right: 15px;top: 20px;-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;}
	.menu-trigger.open{position: fixed;}
	.menu-trigger span, .menu-trigger span:after, .menu-trigger span:before{background: #10499e;height: 2px;-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;} 
	.menu-trigger span{position: absolute;display: block;width: 20px;left: 50%;top: 50%;transform: translate(-50% , -50%);-webkit-transform: translate(-50% , -50%);-moz-transform: translate(-50% , -50%)}
	.menu-trigger span:after, .menu-trigger span:before{content: '';position: absolute;left: 0;width: 100%;}
	.menu-trigger span:before{top: -6px;}
	.menu-trigger span:after{bottom: -6px;}
	.menu-trigger.open span{background-color: rgba(0,0,0,.0)}
	.menu-trigger.open span:before{top: 0;transform: rotate(45deg);-webkit-transform: rotate(45deg);background: #fff}
	.menu-trigger.open span:after{top: 0;transform: rotate(-45deg);-webkit-transform: rotate(-45deg);background: #fff}
	.nav-right.open{left: 0; position: fixed;}
	.nav-right{padding: 0; float: none; background:rgba(255,255,255,.95);position: fixed;top: 0;width: 100%;height: 100%;left: -100%;box-sizing: border-box;z-index: 99999;overflow-y: auto;-webkit-overflow-scrolling: touch;-webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;margin-right: 40px;}
	.nav-right ul{border-top: 1px solid rgba(255,255,255,.8); padding: 20px;}
	.nav-right ul li{margin: 0 7px; display: block; padding: 7px 0;}
	header .call-location:hover ul{padding: 0; display: none; opacity: 0;}
	header .call-location ul{display: none; opacity: 0;}
	header .call-location.active ul{display: block; opacity: 1;}
	header .social-media .fb{background-image: url(../images/site/header_sm_icon_fb_white.png); width: 12px;}
	header .social-media .yelp{background-image: url(../images/site/header_sm_icon_yelp_white.png); margin-left: 10px;}
	header .social-media a.fb:hover{background-image: url(../images/site/header_sm_icon_fb_white.png);}	
	header .social-media a.yelp:hover{background-image: url(../images/site/header_sm_icon_yelp_white.png);}

	/* footer */
	footer{padding: 25px 0 15px;}
	footer .container{width: 100%;}
	footer:after{height: 10px; background-size: contain;}
	footer .left{width: 100%; margin-bottom: 10px; padding-bottom: 15px; text-align: center;}
	footer .left:after{width: 100%; height: 1px; top: inherit; margin-top: 0; bottom: 0;}
	footer .brand img{max-width: 80%;}
	footer ul li{margin-left: 15px;}
	footer ul li a{font-size: 14px;}
	footer .right{width: 100%;}
	footer p{float: none; text-align: center;}

	/*----------home-page-------------*/
	#home-container .banner .controls a{width: 60px; height: 60px;}
	#home-container .banner .controls .prev:after{background-size: 18px; width: 9px; margin-top: -20px;}
	#home-container .banner .controls .next:after{background-size: 18px; width: 9px; margin-top: -20px;}
	#home-container .banner{height: auto;}
	#home-container .banner li{height: auto;}
	#home-container .locations h2{margin-bottom: 20px; }
	#home-container .locations .block{margin-right: 15px; margin: 20px 15px 0;}
	#home-container .locations .block.mr0{margin-right: 15px !important;}
	#home-container .locations .block .orig-badge{top: -20px; left: -20px; width: 60px; height: 60px;}
	#home-container .locations .block .orig-badge img{max-width: 60px;}
	#home-container .our-story{padding: 25px 0;}
	#home-container .our-story:before, #home-container .our-story:after{height: 10px; background-size: contain;}
	#home-container .our-story h1{margin-bottom: 20px;}
	#home-container .our-story p{font-size: 14px; line-height: 22px;}
	#home-container .homemade-callout .left img{margin: 0 auto; max-width: 90%;}
	#home-container .homemade-callout .right img{margin: 0 auto; max-width: 90%;}

	#inner-container .mainbar{width: 100%; margin: 0; padding: 30px 0;}

	/*----------about-us-page-----------*/
	#inner-container.about .small-container{max-width: 100%; text-align: center; padding: 0 15px;}
	#inner-container .mainbar{width: 100%; margin-left: 0; padding-left: 0px; text-align: left; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
	#inner-container .sidebar{width: 200px; margin-top: 40px; padding-bottom: 10px;}
	#inner-container .sidebar-nav{width: 164px;}

	/*---------contact-page----------------------*/
	#inner-container.contact-form .form-container h3{margin-bottom: 20px;}
	#inner-container .contact-locations h3{margin-bottom: 22px;}
	#inner-container .contact-locations .address{width: 220px; border-bottom: 0; border-right: 1px solid #b28d2a; padding: 0 0px 20px; margin: 20px 0px 0 0px;}
	#inner-container .contact-locations .address:nth-child(3){border-right: 0;}	
	#inner-container .form-container label{margin-top: 0;}
	.dform_container select{width: 100% !important;}

	/*----------careers-page-----------*/	
	#inner-container.carrers .small-container{padding: 0 15px; padding-top: 30px;}
	#inner-container .carrers-position .left{width: 100%; padding: 20px 30px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
	#inner-container .carrers-position .right{width: 80%; margin-bottom: 20px;}
	#inner-container.job-application .small-container{max-width: 100%; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; padding: 0 15px; }
	#job_application{text-align: left;}
	#job_application .field-title{width: 100%; margin-left: 0 !important;}
	#job_application .employer-field{width: 100%; margin-left: 0;}
	#job_application .certify-detail{width: 100%; margin: 0; margin-bottom: 20px;}
	#job_application .column{max-width: 100%;}
	#job_application .dform_label{font-size: 14px;}
	#inner-container .customSelect{font-size: 12px; background-size: 12px;}
	#job_application .employer-field em{padding-left: 0;}
	#job_application #forms_field_14 .column{margin-bottom: 15px;}
	#job_application #forms_field_10 .column:nth-child(2){width: 100% !important; margin-left: 0;}
	#job_application #forms_field_178 .column:nth-child(1){max-width: 60%;}
	#job_application #forms_field_178 .column:nth-child(2){max-width: 36%; margin-left: 4%;}
	#job_application #forms_field_178 .column:nth-child(3){margin-left: 0; max-width: 60%;}
	#job_application #forms_field_178 .column:nth-child(4){max-width: 36%;}
	#job_application #forms_field_49 .dform_label{margin-bottom: 70px !important;}
	#job_application #forms_field_31 .column:nth-child(2){max-width: 160px;}
	#job_application #forms_field_50 .checkboxes li{width: 100%; display: block;}
	#job_application #forms_field_50 .checkboxes li label{font-size: 14px;}
	#job_application #forms_field_56 .column:nth-child(1){max-width: 30%;}
	#job_application #forms_field_56 .column:nth-child(2){max-width: 32%;}
	#job_application #forms_field_56 .column:nth-child(3){max-width: 32%; margin-left: 2%;}
	#job_application #forms_field_56 em{font-size: 13px;}
	#job_application #forms_field_97 .column, #job_application #forms_field_105 .column, #job_application #forms_field_90 .column, #job_application #forms_field_83 .column, #job_application #forms_field_112 .column, #job_application #forms_field_119 .column, #job_application #forms_field_127 .column, #job_application #forms_field_134 .column, #job_application #forms_field_141 .column, #job_application #forms_field_149 .column, #job_application #forms_field_156 .column, #job_application #forms_field_163 .column{max-width: 100%;}
	#job_application #forms_field_86 .column:nth-child(1), #job_application #forms_field_108 .column:nth-child(1), #job_application #forms_field_130 .column:nth-child(1), #job_application #forms_field_152 .column:nth-child(1){max-width: 100%;}
	#job_application #forms_field_87, #job_application #forms_field_109, #job_application #forms_field_152  .column:nth-child(1), #job_application #forms_field_130 .column:nth-child(1){max-width: 100%;}
	#job_application #forms_field_86 .column:nth-child(2), #job_application #forms_field_108 .column:nth-child(2), #job_application #forms_field_130 .column:nth-child(2), #job_application #forms_field_152 .column:nth-child(2){max-width: 48%;}
	#job_application #forms_field_86 .column:nth-child(3), #job_application #forms_field_108 .column:nth-child(3), #job_application #forms_field_130 .column:nth-child(3), #job_application #forms_field_152 .column:nth-child(3){max-width: 48%; margin-left: 4%;}
	#job_application #forms_field_179 .column:nth-child(1), #job_application #forms_field_180 .column:nth-child(1), #job_application #forms_field_181 .column:nth-child(1), #job_application #forms_field_182 .column:nth-child(1){max-width: 48%;}
	#job_application #forms_field_179 .column:nth-child(2), #job_application #forms_field_180 .column:nth-child(2), #job_application #forms_field_181 .column:nth-child(2), #job_application #forms_field_182 .column:nth-child(2){max-width: 48%; margin-left: 4%;}
	#job_application #forms_field_31{overflow: scroll; }
	#job_application #forms_field_31 > .dform_container{width: 565px;}
	#job_application #forms_field_90, #job_application #forms_field_112, #job_application #forms_field_134, #job_application #forms_field_156{margin-bottom: 10px !important;}


	/*------------locattion-page--------------*/
	#inner-container .main-heding{padding: 36px 0;}
	#inner-container .locations-block{margin-top: 30px;}
	#inner-container .locations-block .block{margin: 0 15px 30px;}
	#inner-container .small-container{text-align: center; padding: 0 15px;}
	#inner-container.location-detail .mainbar{margin-left: 0px; width: 100%; text-align: left;}
	#inner-container .sidebar .block .orig-badge{top: -20px; left: -20px; width: 60px; height: 60px;}

	/*----------menu-page-----------*/
	#inner-container.menus .container{padding: 0 15px;}
	#inner-container .quick-detail{max-width: 100%; padding: 0 15px;}
	#inner-container .sab-navigation{margin-bottom: 40px;}
	#inner-container .sab-navigation li{margin: 0 14px; padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid #e9e7dc; display: block;}
	#inner-container .sab-navigation li a{font-size: 16px;}
	#inner-container .menus-section .sandwiches-cate .col{width: 190px; border-right: 0; border-bottom: 1px solid #e7e4e1; margin: 0 5px; padding: 15px;}
	#inner-container .menus-section .sandwiches-cate .col:last-child{border-bottom-width: 0;}
	#inner-container .menus-section.beer .col{width: 100%;}
	#inner-container .menus-section{margin-top: 0; margin-bottom: 40px;}
	#inner-container .menus-section.sandwiches{padding: 0;}
	#inner-container .menus-section.sandwiches .sandwiches-cate{width: 100%; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
	#inner-container .menus-section .category h2:after{width: 20px; right: -25px;}
	#inner-container .menus-section .category h2:before{width: 20px; left: -25px;}
	#inner-container .menus-section .line em{display: block; border-right-width: 0; padding-right: 0; padding-bottom: 5px;}
	#inner-container .menus-section .row:last-child .col{float: none; display: inline-block; margin: 0 auto; width: 100%; margin-bottom: 10px;}
}

/* 2. Large Mobile responsive css 640px
------------------------------------------------------------------------------*/
@media (min-width:641px) and (max-width:767px) {
	body{min-width: inherit;}
	img{max-width: 100%;}
	.container{padding: 0 15px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
	h1{font-size: 32px; line-height: 36px;}
	h2{font-size: 20px;}

	/* header */
	header .container{width: 100%;}	
	.header-wrap{height: 113px;}
	.header-wrap.home-scroll{height: 100px;}
	header .brand{width: 180px; padding-top: 20px;}
	header .nav-right{width: calc(100% - 180px); padding: 13px 0 25px;}
	header .nav-bottom{padding: 20px 0 0;}
	header nav ul li{margin: 0 10px 0 15px;}
	header nav ul li a{font-size: 16px;}
	header.sticky nav ul li a{font-size: 16px;}
	/* footer */
	footer .container{width: 100%;}
	footer .left{width: 37%;}
	footer .brand img{max-width: 80%;}
	footer ul li{margin-left: 15px;}
	footer ul li a{font-size: 14px;}
	footer .right{width: 62%;}

	/*----------home-page-------------*/
	#home-container .banner{height: auto;}
	#home-container .banner li{height: auto;}
	#home-container .locations h2{margin-bottom: 20px; }
	#home-container .locations .block{margin-right: 15px; margin: 20px 15px 0;}
	#home-container .locations .block .orig-badge{top: -20px; left: -20px; width: 60px; height: 60px;}
	#home-container .locations .block .orig-badge img{max-width: 60px;}
	#home-container .our-story{padding: 45px 0;}
	#home-container .our-story h1{margin-bottom: 20px;}
	#home-container .our-story p{font-size: 14px; line-height: 22px;}
	#home-container .homemade-callout .left img{margin: 0 auto; max-width: 90%;}
	#home-container .homemade-callout .right img{margin: 0 auto; max-width: 90%;}
	
	/*----------about-us-page-----------*/
	#inner-container .mainbar{width: 100%; margin: 0; padding: 40px 0;}
	#inner-container.about .small-container{max-width: 100%;}
	#inner-container .mainbar{width: calc(100% - 205px); margin-left: 0; padding-left: 20px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
	#inner-container .sidebar{width: 200px;}
	#inner-container .sidebar-nav{width: 164px;}

	/*---------contact-page----------------------*/
	#inner-container .contact-locations .address{width: 31%;}

	/*----------careers-page-----------*/	
	#inner-container .carrers-position .left{width: 58%; padding: 0 30px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
	#inner-container .carrers-position .right{width: 40%;}
	#inner-container.job-application .small-container{max-width: 100%; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
	#job_application .field-title{width: 100%; margin-left: 0 !important;}
	#job_application .employer-field{width: 100%; margin-left: 0;}
	#job_application .certify-detail{width: 100%;}
	#job_application .column{max-width: 240px;}
	#job_application #forms_field_178 .column:nth-child(1){max-width: 120px;}
	#job_application #forms_field_178 .column:nth-child(3){margin-left: 81px;}
	#job_application #forms_field_178 .column:nth-child(4){max-width: 100px;}
	#job_application #forms_field_31 .column:nth-child(2){max-width: 160px;}
	#job_application #forms_field_50 .checkboxes li{width: 32%; vertical-align: top;}
	#job_application #forms_field_50 .checkboxes li label{font-size: 14px;}
	#job_application #forms_field_97 .column, #job_application #forms_field_105 .column, #job_application #forms_field_90 .column, #job_application #forms_field_83 .column, #job_application #forms_field_112 .column, #job_application #forms_field_119 .column, #job_application #forms_field_127 .column, #job_application #forms_field_134 .column, #job_application #forms_field_141 .column, #job_application #forms_field_149 .column, #job_application #forms_field_156 .column, #job_application #forms_field_163 .column{max-width: 275px;}

	/*------------locattion-page--------------*/
	#inner-container .locations-block{margin-top: 30px;}
	#inner-container .locations-block .block{margin: 0 15px 30px;}
	#inner-container.location-detail .mainbar{margin-left: 0px; width: calc(100% - 255px);}
	#inner-container .sidebar .block .orig-badge{top: -20px; left: -20px; width: 70px; height: 70px;}

	/*----------menu-page-----------*/
	#inner-container .sab-navigation{margin-bottom: 40px;}
	#inner-container .menus-section{margin: 0 auto; margin-bottom: 40px;}
	#inner-container .sab-navigation li{margin: 0 14px;}
	#inner-container .sab-navigation li a{font-size: 16px;}
	#inner-container .menus-section .sandwiches-cate .col{width: 190px; border-right: 0; border-bottom: 1px solid #e7e4e1; margin: 0 5px; padding: 20px 10px;}
	#inner-container .menus-section .sandwiches-cate .col:last-child{border-bottom-width: 0;}
}

/* 3. iPad responsive css 768px to 959px
------------------------------------------------------------------------------*/
@media (min-width:768px) and (max-width:959px) {
	body{min-width: inherit;}
	img{max-width: 100%;}
	.container{padding: 0 15px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
	h1{font-size: 36px; line-height: 40px;}
	h2{font-size: 22px;}

	/* header */
	header .container{width: 100%;}
	.header-wrap{height: 124px;}
	.header-wrap.home-scroll{height: 115px;}
	header .brand{width: 220px; padding-top: 20px;}
	header .nav-right{width: calc(100% - 220px); padding: 13px 0 35px;}
	header .nav-bottom{padding: 20px 0 0;}
	header nav ul li{margin: 0 10px 0 20px;}
	header nav ul li a{font-size: 20px;}
	/* footer */
	footer .container{width: 100%;}
	footer .left{width: 37%;}
	footer .brand img{max-width: 80%;}
	footer .right{width: 62%;}

	/*----------home-page-------------*/
	#home-container .banner{height: auto;}
	#home-container .banner li{height: auto;}
	#home-container .locations .block{max-width: 27%; margin-right: 15px;}
	#home-container .locations .block .orig-badge{top: -20px; left: -20px; width: 60px; height: 60px;}
	#home-container .locations .block .orig-badge img{max-width: 60px;}
	#home-container .homemade-callout .left img{margin: 0 auto;}
	#home-container .homemade-callout .right img{margin: 0 auto;}

	/*----------about-us-page-----------*/
	#inner-container.about .small-container{max-width: 100%;}
	#inner-container .mainbar{width: calc(100% - 225px); margin-left: 0; padding-left: 20px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}

	/*---------contact-page----------------------*/
	#inner-container .contact-locations .address{width: 31%;}

	/*----------careers-page-----------*/	
	#inner-container .carrers-position .left{width: 58%; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
	#inner-container .carrers-position .right{width: 40%;}
	#inner-container.job-application .small-container{max-width: 665px;}

	/*------------locattion-page--------------*/
	#inner-container .locations-block{margin-top: 30px;}
	#inner-container .locations-block .block{margin: 0 15px 30px;}
	#inner-container.location-detail .mainbar{margin-left: 0px; width: calc(100% - 255px);}
	#inner-container .sidebar .block .orig-badge{top: -30px; left: -30px; width: 80px; height: 80px;}

	/*----------menu-page-----------*/
	#inner-container .sab-navigation{margin-bottom: 40px;}
	#inner-container .menus-section{margin: 0 auto; margin-bottom: 40px;}
	#inner-container .sab-navigation li{margin: 0 10px;}
	#inner-container .sab-navigation li a{font-size: 22px;}
	#inner-container .menus-section .sandwiches-cate .col{width: 150px;}

}

/* 4. large desktop responsive css 960px to 990px
------------------------------------------------------------------------------*/
@media (min-width:960px) and (max-width:990px) {	
	.container{padding: 0 15px; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
	header .container{width: 100%;}
	header .nav-right{width: 640px;}
	footer .container{width: 100%;}
	footer .left{width: 360px;}
	#inner-container.about .small-container{max-width: 100%;}
	#inner-container .carrers-position .left{width: 58%; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
	#inner-container .carrers-position .right{width: 40%;}
	#inner-container.job-application .small-container{max-width: 665px;}
	#inner-container.location-detail .mainbar{margin-left: 0;}
	#inner-container .sab-navigation li{margin: 0 18px;}
	#inner-container .menus-section .sandwiches-cate .col{width: 200px;}
}

/* 5. Other media-query
------------------------------------------------------------------------------*/
@media (max-width: 480px){
	#inner-container.contact-form .form-container .column{width: 100% !important;}
	#inner-container .contact-locations .address{border-bottom: 1px solid #b28d2a; border-right: 0; margin: 20px 10px 0 10px;}
	
}

@media (max-width: 1024px){
	#home-container .banner{height: 486px;}
	
}

@media (max-width: 640px) {
#home-container .banner {height: 58vw !important;}
#home-container .banner li {height: 75vw !important;}
#home-container .banner li img {width: 116%;position: relative;right: 8%;max-width: 116%;}
}