@import url("reset.css");
@import url("unsemantic.css");
@import url("font-awesome.min.css");


html{
  
}

body {
  margin:0 auto;
  font:400 16px/20px 'PT Sans', serif;
  color:#333;
  background:#f4f2ee url(../img/body-bg.gif) repeat-x 0 190px;
}

.grid-container{
  position:relative;
}

/* ---------- base ---------- */
ul, ol{
	margin:0;
  padding:0;
}

h2{
  margin-bottom:10px;
  font:700 24px/28px 'PT Sans', serif;
  color:#4877d2;
}

p{
  margin-bottom:30px;  
}

form{
	margin-bottom: 30px;
}

label{
  display: block;		
	width: 100%;
  margin-bottom:10px;
  font-weight:700;
}

input, textarea{
  width:90%;
  margin-bottom:20px;
  padding:10px 6px;
  font:400 16px/20px 'PT Sans', serif;
  color:#333;
  border:1px solid #ddd;
}

.button {
  display:block;
  width:auto;
  max-width:164px;
	margin:0;
	padding: 10px 20px 11px;  
  font:400 16px/20px 'PT Sans', serif;
  color:#fff;  
  text-align:center;
	text-decoration:none;	
	cursor: pointer;
  border:none;
	background-color:#4877d2;	
	-webkit-transition: background-color 0.15s ease-in-out;
	-moz-transition: background-color 0.15s ease-in-out;
	-o-transition: background-color 0.15s ease-in-out;
	transition: background-color 0.15s ease-in-out;
  -webkit-appearance: none;
}

.button:hover, .button:focus {
	background-color: #416bbe;
}

.button:active {
	-webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2) inset;
	-moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2) inset;
	box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2) inset;
}

.map{
  width:100%;
  height:28em;
}

/* ---------- end base ---------- */

#header{
  padding:10px 0;
}

#logo{
  float:left;  
}

#logo a{
  display:block;
  width:145px;
  height:50px;
  text-indent:-9999px;
  background:url('../img/logo-sm-b.png') no-repeat;
}

/*
logo-sm - 50x45
logo - 317x110
*/

#social{
  float:right;
  color:#4877d2;
  line-height:24px;
  display:none;
}

.media{
  float:left;
  list-style:none;
}

.media li{
  display:inline-block;
  padding:0 4px;
}

.media li a{
  display:block;
  font-size:20px;
  color:#4877d2;
  text-decoration:none;
}

.media li a:hover{
  color:#416bbe;
}

.phone{
  float:left;
  display:inline-block;
  margin-left:20px;
  padding-left:20px;
  font:700 18px/24px 'PT Sans', serif;
  background:url(../img/phone-icon.png) no-repeat;
}

.phone p { 
  margin-bottom:0;
}

#nav-toggle {
  display: block;
  float:right;
  text-indent: -9999px;
  background-image: url("../img/nav-toggle.png");
  width: 30px;
  height: 30px;
  margin:10px 0 0;
  background-size:100%;  
}

.opened + #nav-toggle {
  background-position: 0 -30px;
}

#primary-nav{
  float:none;
}
#primary-nav .menu {
	list-style: none;	
}

#primary-nav.opened .menu{
  position:absolute;
  z-index:30;
  top:60px;
  left:0;
  float:none;
  width:100%;
  margin:0;  
  background-color:#f4f2ee;
}

#primary-nav.closed .menu{
  display:none;
}

#primary-nav .menu li{
  display:block;
  padding:0;
}

#primary-nav .menu li a {
	display: block;
	padding:4px 12px;
	font:700 18px/24px 'PT Sans', serif;
  color:#d52c24;
  text-decoration:none;
}

#primary-nav .menu li a.active{
  color: #fff;
  background-color:#d52c24;
}

#primary-nav li a:hover,
#primary-nav li a:focus {
	color: #fff;
  text-shadow: 1px 1px 2px rgba(201, 42, 35, 0.21);
	background-color: #d52c24;
}


/* -------- slide styles -------- */

#slide-wrap {
  width:100%;  
  position:relative;
  padding-bottom:40px;
}

#slide{
  position:relative;
  width:100%;
  max-width:940px;
  margin:0 auto;
  background-color:#e6e6e6;
  -webkit-box-shadow: 0px 2px 8px rgba(50, 50, 50, 0.25);
  -moz-box-shadow:    0px 2px 8px rgba(50, 50, 50, 0.25);
  box-shadow:         0px 2px 8px rgba(50, 50, 50, 0.25);
}

.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
}

.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  margin-bottom:0;
  left: 0;
  top: 0;
}

.rslides li:first-child {
  position: relative;
  display: block;
  float: left;
}

.rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
}

.rslides_nav {
  position:absolute;
  top:41%;
  left: 0;
  z-index:3;
  width:38px;
  height: 61px;
  text-decoration:none;
  text-indent:-9999px;
  background:url("../img/rslides-nav.png") no-repeat;
  overflow:hidden;
}

.rslides_nav.next{
  background-position:right top;
  left:auto;
  right:0;
}

.rslides_tabs{
  position:relative;
  z-index:20;
  margin:-20px 0 0;
  list-style:none;  
  text-align:center;
  overflow:hidden;
}

.rslides_tabs li{
  display:inline-block;
  width:10px;
  height:11px;
  margin:0 5px;
  background:url("../img/rslides-pager.png") no-repeat 0 0;
  text-indent:-9999px;
}

.rslides_tabs li a{
  display:block;
  width:10px;
  height:11px;
}

.rslides_tabs li.rslides_here{
  background-position:0 -11px;
} 

#intro{
  position:relative;
  padding-bottom:60px;
  color:#333;  
}

#intro .content{
  width:100%;
  padding:40px 10px;
  background-color:#fff;
  -webkit-box-shadow: 0px 2px 8px rgba(50, 50, 50, 0.25);
  -moz-box-shadow:    0px 2px 8px rgba(50, 50, 50, 0.25);
  box-shadow:         0px 2px 8px rgba(50, 50, 50, 0.25);
  box-sizing:border-box;
}

#page{
  position:relative;
  margin-bottom:20px;
}

#page .content{
  width:100%;
  padding:40px 10px;
  background-color:#fff;
  -webkit-box-shadow: 0px 2px 8px rgba(50, 50, 50, 0.25);
  -moz-box-shadow:    0px 2px 8px rgba(50, 50, 50, 0.25);
  box-shadow:         0px 2px 8px rgba(50, 50, 50, 0.25);
  box-sizing:border-box;
}

#page .content p img{
  width:100%;
  max-width:342px;
  margin-top:10px;
}

#page .content a{
  color:#4877d2;
  text-decoration:none;
}

#page .content a:hover{
  color:#416bbe;
}

.food:last-of-type{
  margin-bottom:40px;
}

.food h2{
  margin:30px 0 4px;
  text-align:center;
}

.food .notes{
  margin-bottom:20px;
  font-size:16px;
  font-style:italic;
  font-weight:bold;
  text-align:center;  
}

.food ul{
  list-style:none;
}

.food li{
  display:inline-block;  
  width:100%;
}

.food li .item{ 
  margin-bottom:10px;
  background:url(../img/dotted-blue.png) repeat-x 0% 100%;
}

.food li .item strong{
  display:inline;
  position:relative;
  background:#fff;
}

.food li .item span{
  float:right;  
  font-weight:bold;
  padding-left:10px;
  background:#fff;
}

.food li .secondary{
  width:100px;
  padding-left:0;
}

.food .item-note{
  font-size:12px;
  font-style:italic;  
}


#footer{
  position:relative;
  padding:20px 0;
  background-color:#d52c24;
  border-top:4px solid #4877d2;
  text-align:center;
}

#footer .title, #footer .contact{
  font:300 18px/20px 'Lato', sans-serif; 
  color:#fff;
}

#footer .slogan{
  font:300 14px/20px 'Lato', sans-serif; 
  color:#fff;
}

#footer .copy{
  margin-top:12px;
  font:400 16px/24px 'PT Serif', serif; 
  color:#fff;
}

#footer p a{
  color:#fff;
}

#footer p a:hover{
  color:#ffb4b0;
}

/* ------------ media queries styles ------------ */  
@media only screen and (min-width: 480px) {  
  
  
  #intro h2{
    padding-top:0;    
  }
  
  #intro .featured{
    padding:0 10px;
  }  
}

@media only screen and (min-width: 600px) {  
  #page .content{
    padding:60px;    
  }  
 
}

@media only screen and (min-width: 768px) {	
  #logo a{
    width:217px;
    height:75px;
    background:url('../img/logo-md.png') no-repeat;
  }
  #social{
    display:block;
  }  
  
  #nav-toggle{
    display:none;
  }
  
  #primary-nav{
    float:right;
    margin-top:20px;
  }
  
  #primary-nav.closed .menu{
    display:block;
  }
  
  #primary-nav .menu li{
    display:inline-block;
  }
  
  #primary-nav .menu li a{    
    font-weight:700;
    font-size:18px;
    line-height:24px;
  }

  #primary-nav .menu li a:hover, #primary-nav .menu li a.active{
    background-color:#d2181b;
    border-radius:4px;  
  }
  
  #primary-nav .menu li a.active:hover{
    background-color:#d2181b;
    border-radius:4px; 
  }
  
  #slide-wrap {
    padding-bottom:0;
  }
  
  #intro .content{
    background-color:transparent;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
    box-shadow:none;
  }
}

@media only screen and (min-width: 800px) {	
    
}

@media only screen and (min-width: 1020px) {
  #logo a{
    width:317px;
    height:110px;
    background:url('../img/logo.png') no-repeat;
  }
  
  #primary-nav{
    margin-top:46px;
  }
}