@media only screen and (max-width:1200px) {
	
	#header #menu li {padding: 0 10px;}
	#header #menu li a {font-size: 13px;}
	#header #logo {bottom: -10px; max-width: 145px;}

	#info-box {font-size: 12px;}
}


@media only screen and (max-width:992px) {
	#slider li {height: 450px}
	#info-box {text-align: center;}
	#info-box .right {border: none; text-align: center;}

	#story {height: 540px; margin-bottom: 205px;}
	#story .inside {margin: 400px 0 -205px;}
	
	#header #menu {text-align: right;}
	#header #menu li {padding: 0 8px;}
	#header #menu li a {font-size: 12px;}

	#image-grid-2 {}
	#image-grid-2 .bg-gray {top: -200px; height: 700px;}

	#map {background-size: auto 400px; background-repeat: no-repeat; background-position: center top; background-color: #C7C7C7;}
	#map .inside {margin-top: 200px;}

	.special {max-width: 500px; margin: 0 auto 50px;}

	#story .modal img {max-width: 200px;}
}


@media only screen and (max-width:767px) {

	body {min-width: 320px; padding-top: 50px;}

	.divider {border-bottom: 1px solid #CCC;}

	#header {height: 50px;}
	#header .container {height: 50px;}
	#header #logo {width: 120px; bottom: -7px;}
	#header .btn {font-size: 12px; float: right;}

	#info-box {line-height: 22px;}
	#info-box .left {padding-top: 15px; display: none;}
	#info-box .right {padding-top: 15px; padding-bottom: 15px;}

	.spacer90 {height: 60px;}
	.spacer75 {height: 40px;}
	
	.text-center-xs {text-align: center;}

	#slider li {height: 200px;}

	#specials {border-bottom: 1px solid #EEE;}
	#specials h2 {font-size: 20px; padding: 0 0 10px; margin: 5px 0 0;}
	#specials h3 {font-size: 14px; color: #222; padding: 0; margin: 0;}
	#specials p {font-size: 16px;}
	#specials .special {margin-bottom: 30px; font-size: 13px; color: #777}
	#specials .location-select {color: #AAA; font-size: 13px; font-family: 'Ropa Sans', serif; border: 1px solid #DDD; padding: 2px 5px; top: -3px; position: relative; margin-left: 10px; text-transform: uppercase;}
	
	#image-grid-1 .bg-gray {top:-80px; height: 250px}
	#image-grid-2 {padding: 0;}
	#image-grid-2 .bg-gray {top: 30px;}

	.image-grid .image.tall {height: 190px; width: 100%; }
	.image-grid .image.square {width: 100%; height: 90px;}
	.image-grid .image.wide {width: 100%; height: 90px;}
	.image-grid .row {margin-left: -5px; margin-right: -5px;}
	.image-grid .col {padding-left: 5px; padding-right: 5px;}
	.image-grid .spacer30 {height: 10px;}

	#our-menu {text-align: center;}
	.panel {box-shadow: none; border: none; margin-bottom: 10px; }
	.panel a {display: block; font-family:'Ropa Sans', serif; text-transform: uppercase; letter-spacing: 1px; font-size: 16px;}
	.panel-default>.panel-heading {background: transparent; border-radius: 0; border: 1px solid #93703A; box-shadow: none; background: #F4F4F4;}
	
	#story {height: 200px; background-size: auto 300px; display: none;}
	#story .inside {padding: 30px; margin-top: 200px;}

	#map .inside {padding: 30px;}

	#instagram {display: none;}

	#catering h3 {font-size: 20px;}
	#catering .inside {padding: 30px; background: #FFF;}

	#order {min-height: 0; padding-bottom: 50px;}
	#order h1 {text-align: center; font-size: 17px; padding: 0; margin: 0;}
	#order h1 small {display: block; padding: 10px 0 0;}
	#order .cart {padding: 0;}
	#order .cart .inside {padding: 30px 10px 10px;}
	#order .cart h3 {padding-bottom: 20px;}
	#order .cart h4 {font-size: 11px; line-height: 39px; padding: 0; margin: 0;}
	#order .panel-heading {text-align: center;}
	#order .panel-body {padding: 15px 0;}
	#order .item {border-bottom: 1px solid #EEE; position: relative; padding: 20px 10px}
	#order .item:hover, #order .item.active {padding-left: 10px;}
	#order .actions .form-group {margin-right: 0;}
	#order .item p {font-size: 13px;}
	#order .item .details p {font-size: 12px; color: #999; margin-top: 5px;}
	#order .fa-chevron-down {color: #b9874d;}


	#order #breadcrumbs {font-size: 10px; margin: 0; line-height: 40px; color: #DDD; display: none;}
	#order #breadcrumbs i {display: none;}
}