@media only screen and (min-device-width: 0px) and (max-device-width: 480px){
  body {
    overflow: none;
  }
  
   .nav{
    height:20vh;
width:100vw;	
float:left;
background:#282828;
  }
  
  .nav ul{
	  display:none;
  }
  
  .logo{
	  width:60%;
	  margin-left:10%;
  }
  
  .main{
float:left;
  margin:0;
  padding:0;
  height: 80vh;
  width: 100%;
background:rgba(52,52,52,0.7);
display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -webkit-box-align: center;
  align-items: center;
  justify-content: center;
  text-decoration:none;
  
}

  
  .mobile {
    height: 100vh;
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
  	background-image:url("https://images.unsplash.com/photo-1444483911532-30de7b1b0aaf?crop=entropy&fit=crop&fm=jpg&h=675&ixjsv=2.1.0&ixlib=rb-0.3.5&q=80&w=875");
	background-size:cover;
	display:block;
  }
  .mobile .header {
    margin-top: 0;
    margin-left: 0;
    height: 15vh;
    width: 100%;
    float: left;
    background: #222;
	display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -webkit-box-align: center;
  align-items: center;
  justify-content: center;
  text-decoration:none;
  }
  
  .mobile .header a:nth-child(1){
  width: 70%;
    height: 100%;
	float:left;
	color:#555;
	display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -webkit-box-align: center;
  align-items: center;
  justify-content: center;
  text-decoration:none;
  }
  
  .mobile .header a:nth-child(2){
  width: 80%;
    height: 100%;
	float:left;
	display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -webkit-box-align: center;
  align-items: center;
  justify-content: center;
  text-decoration:none;
  }
  
  .mobile .header img {
    width: 80%;
    height: 90%;
    float: left;
  }
  
  .mobile .body {
    margin-top: 0;
    margin-left: 0;
    height: 85%;
    width: 100%;
    float: left;
  
    list-style: none;
    overflow: none;
  }
  
  .menuList{
  background: rgba(228, 228, 215, 1);
  width:70vw;
  height:85vh;
  display:none;
  position:absolute;
  top:15%;
left:0%;
opacity:1;
float:left;
  }
  
  
  .mobile .menuList  .list {
    margin: 1.5% 2%;
    height: 18.5%;
    width: 96%;
    float: left;
    background: rgba(228, 228, 215, 1);
	 display: flex;
  align-items: center;
	
  }
  .mobile .menuList .list i {
    width: 15%;
	margin-left:5%;
    text-align: center;
    float: left;
    color: #222;
    text-decoration: none;
    font-size: 2em;
	
  }
  .mobile .menuList .list a {
    width: 80%;
    float: left;
    text-align: center;
    color: #222;
    text-decoration: none;
    font-size: 1.5em;
    font-family: 'permanent marker';
	
  }
  
  
  
  .mobile .body .list {
    margin: 1% 2%;
    height: 15%;
    width: 96%;
    float: left;
    background: rgba(255, 255, 255, 0.35);
	 display: flex;
  align-items: center;
	
  }
  .mobile .body .list i {
    width: 15%;
	margin-left:5%;
    text-align: center;
    float: left;
    color: #fff;
    text-decoration: none;
    font-size: 4em;
	
  }
  .mobile .body .list a {
    width: 80%;
    float: left;
    text-align: center;
    color: #fff;
    text-decoration: none;
    font-size: 1.5em;
    font-family: 'permanent marker';
	
  }
  
  .mobile .body .listM {
    margin: 1% 2%;
    height: 15%;
    width: 96%;
    float: left;
    background: rgba(255, 255, 255, 0.35);
	 display: flex;
  align-items: center;
	
  }
  .mobile .body .listM i {
    width: 15%;
	margin-left:5%;
    text-align: center;
    float: left;
    color: #fff;
    text-decoration: none;
    font-size: 4em;
	
  }
  .mobile .body .listM a {
    width: 100%;
    float: left;
    text-align: center;
    color: #fff;
    text-decoration: none;
    font-size: 1.5em;
    font-family: 'permanent marker';
	
  }
  
  .mobile .body .list1 {
    margin: 1% 2%;
    height: 30%;
    width: 96%;
    float: left;
    background: rgba(255, 255, 255, 0.35);
	
	
  }
  .mobile .body .list1 h2 {
    width:100%;
    text-align: center;
    float: left;
    color: #fff;
    text-decoration: none;
    font-size: 2em;
	margin-top:0;
	font-family: 'Satisfy';
	
  }
  .mobile .body .list1 p {
    width:100%;
    float: left;
    text-align: center;
    color: #fff;
    text-decoration: none;
    font-size: 1em;
    font-family: 'permanent marker';
	margin-top:0;
	padding-top:0;
  }
  
  .mobile .body .list2{
    margin: 1% 2%;
    height: 50%;
    width: 96%;
    float: left;
    background: rgba(255, 255, 255, 0.35);
	
	
  }
  
  .list2 iframe{
  height:100%;
  width:100%;
  }
  
  .inner{
  margin-top: 0;
    margin-left: 0;
    height: auto;
    width: 100%;
    float: left;
	 
    list-style: none;
    overflow: none;
  }
  
  .inner .left{
      float: left;
   
	width:100%;
	height:100%;
	color: #fff;
  text-align:center;
  font-family:'ribeye';
  }
 
 .mobile .body   h2{
 
  font-size: 2em;
  
  color: #fff;
  text-align:center;
  font-family:'permanent marker';
}


.inner .carousel h1 {
 
  font-size: 2em;
  
  color: #fff;
  text-align:center;
  font-family:'ribeye';
}

 .inner .carousel a {
  height: 100%;
  width: 50%;
  float: left;
  text-align: center;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -webkit-box-align: center;
  align-items: center;
  justify-content: center;
  text-decoration:none;
}

 .inner .carousel .afran {
  height: 10%;
  width: 100%;
  float: left;
  text-align: center;
}


.inner .carousel h4 {
  border: 2px solid #fff;
  font-weight: 700;
  padding: 2%;
  font-size: 1em;
  text-decoration: none;
  color: #fff;
  float: left;
  width: 45%;
  text-align:center;
  font-family: "permanent marker";
}

 .inner .carousel .afran h4 {
  border: 2px solid #fff;
  font-weight: 700;
  padding: 2%;
  font-size: 1em;
  text-decoration: none;
  color: #fff;
  float: left;
  width: 49%;
  font-family: "permanent marker";
}

.inner .carousel h4:hover {
  background-color: #fff;
  color: #b2b094;
  border: 2px solid #b2b094;
}

.formL, .formR{
width:100%;
}
 
.formL input{
width:85%;
margin-left:8%;
margin-right:7%;
margin-top:2%;
margin-bottom:4%;
float:left;
padding:1.3%;
font-family:"permanent marker";
color:#000;
text-align:center;
  font-size:1em;
}

.formL .select{
width:85%;
margin-left:8%;
margin-right:3%;
margin-top:2%;
margin-bottom:4%;
float:left;
padding:1.3%;
font-family:"permanent marker";
color:#000;
text-align:center;
  font-size:1em;
}

.formR .submit{
width:85%;
margin-left:8%;
margin-right:8.5%;
margin-top:2.5%;
margin-bottom:1%;
padding-left:1%;
padding-right:1%;
padding-top:5%;
padding-bottom:5%;
background:none;
float:left;
font-family:"permanent marker";
font-weight:700;
color:#fff;
text-align:center;
  font-size:1em;
  border:3px solid #fff;
}

.formR textarea{
width:87%;
margin-left:6%;
margin-right:6%;
margin-top:1%;
margin-bottom:1%;
float:left;
font-family:"permanent marker";
color:#000;
text-align:center;
  font-size:1em;
} 

.body .Item{
text-align:center;
width:100%;
color:#fff;
}

.body .Item h3{
font-family:'ribeye';
}
 
.body .Item  p{
font-family:'permanent marker';
color:#f4dd99;
}  
 
.body .Item ul li{
font-family:'ribeye';
border-bottom:1px solid #fff;
} 

.body .Item ul li p{
font-family:'permanent marker';
color:#f4dd99;
} 

.body .Item ul{
 margin: 1.5% 2%;
    
    width: 96%;
    float: left;
     background: rgba(255, 255, 255, 0.35);
}

 
}

@media only screen and (min-device-width: 480px) and (max-device-width: 780px){

  body {
    overflow: none;
  }
  .nav{
    height:20vh;
width:100vw;	
float:left;
background:#282828;
  }
  
  .nav ul{
	  display:none;
  }
  
  .logo{
	  width:60%;
	  margin-left:10%;
  }
  
  .main{
float:left;
  margin:0;
  padding:0;
  height: 80vh;
  width: 100%;
background:rgba(52,52,52,0.7);
display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -webkit-box-align: center;
  align-items: center;
  justify-content: center;
  text-decoration:none;
  
}
  .mobile {
    height: 100vh;
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    background-image:url("lal1.jpg");
	background-size:cover;
	display:block;
  }
  .mobile .header {
    margin-top: 0;
    margin-left: 0;
    height: 15vh;
    width: 100%;
    float: left;
    background: #222;
	display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -webkit-box-align: center;
  align-items: center;
  justify-content: center;
  text-decoration:none;
  }
  
  .mobile .header a:nth-child(1){
  width: 60%;
    height: 100%;
	float:left;
	color:#555;
	
	display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -webkit-box-align: center;
  align-items: center;
  justify-content: center;
  text-decoration:none;
  }
  
  .mobile .header a:nth-child(1) .fa{
	font-size:2em;
  }
  
  .mobile .header a:nth-child(2){
  width: 80%;
    height: 100%;
	float:left;
	display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -webkit-box-align: center;
  align-items: center;
  justify-content: center;
  text-decoration:none;
  }
  
  .mobile .header img {
    width: 80%;
    height: 90%;
    float: left;
  }
  
  .menuList{
  background: rgba(228, 228, 215, 1);
  width:70vw;
  height:85vh;
  display:none;
  position:absolute;
  top:15%;
left:0%;
opacity:1;
float:left;
  }
  
  .mobile .body   h2{
 
  font-size: 2em;
  
  color: #fff;
  text-align:center;
  font-family:'ribeye';
}
  
  .mobile .menuList  .list {
    margin: 1.5% 2%;
    height: 18.5%;
    width: 96%;
    float: left;
    background: rgba(228, 228, 215, 1);
	 display: flex;
  align-items: center;
	
  }
  .mobile .menuList .list i {
    width: 15%;
	margin-left:5%;
    text-align: center;
    float: left;
    color: #222;
    text-decoration: none;
    font-size: 2em;
	
  }
  .mobile .menuList .list a {
    width: 80%;
    float: left;
    text-align: center;
    color: #222;
    text-decoration: none;
    font-size: 1.5em;
    font-family: 'permanent marker';
	
  }
  
  .mobile .body {
    margin-top: 0;
    margin-left: 0;
    height: 85vh;
    width: 100%;
    float: left;
    background: #6a6a6a;
    list-style: none;
    overflow: none;
  }
  .mobile .body .list {
    margin: 1% 2%;
    height: 18%;
    width: 96%;
    float: left;
    background: rgba(255, 255, 255, 0.5);
	 display: flex;
  align-items: center;
	
  }
  .mobile .body .list i {
    width: 15%;
	margin-left:5%;
    text-align: center;
    float: left;
    color: #fff;
    text-decoration: none;
    font-size: 3em;
	
  }
  .mobile .body .list a {
    width: 80%;
    float: left;
    text-align: center;
    color: #fff;
    text-decoration: none;
    font-size: 2.5em;
    font-family: 'permanent marker';
	
  }
  
  .inner{
  margin-top: 0;
    margin-left: 0;
    height: 34.5vh;
    width: 100%;
    float: left;
	background: url(http://media-cdn.tripadvisor.com/media/photo-s/05/60/9d/1b/spicy-piri-piri-chicken.jpg);
  background-size: 110%;
    list-style: none;
    overflow: none;
  }
  
  .inner .left{
      float: left;
    background: rgba(178, 178, 178, 0.45);
	width:100%;
	height:100%;
	color: #fff;
  text-align:center;
  font-family:'ribeye';
  }
  
  .inner .carousel h1 {
 
  font-size: 4em;
  
  color: #fff;
  text-align:center;
  font-family:'ribeye';
}

  
  .inner .carousel{
      float: left;
    background: rgba(178, 178, 178, 0.45);
	width:100%;
	height:100%;
  }
  
  .inner .carousel .h2div {
  height: 90%;
  width: 100%;
  float: left;
  font-size: 3em;
  margin-top: 7.5%;
}

 .inner .carousel .h2div1 {
  height: 90%;
  width: 100%;
  float: left;
  font-size: 3em;
  margin-top: 7.5%;
}

.carousel {
	 display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-align-items: center;
  -webkit-box-align: center;
  align-items: center;
  justify-content: center;
  text-decoration:none;
  }
  

 .inner .carousel a {
  height: 10%;
  width: 50%;
  float: left;
  text-align: center;
}

 .inner .carousel .afran {
  height: 10%;
  width: 100%;
  float: left;
  text-align: center;
}

.inner .carousel h4 {
  border: 2px solid #fff;
  font-weight: 700;
  padding: 2%;
  font-size: 1em;
  text-decoration: none;
  color: #fff;
  float: left;
  width: 40%;
  margin-top: 10%;
  margin-left: 30%;
  margin-right: 30%;
  font-family: "permanent marker";
  
}

 .inner .carousel .afran h4 {
  border: 2px solid #fff;
  font-weight: 700;
  padding: 2%;
  font-size: 1em;
  text-decoration: none;
  color: #fff;
  float: left;
  width: 40%;
  margin-top: 5%;
  margin-left: 30%;
  margin-right: 30%;
  font-family: "permanent marker";
}

.inner .carousel h4:hover {
  background-color: #fff;
  color: #b2b094;
  border: 2px solid #b2b094;
}
  
 .mobile .body .list1 {
    margin: 1% 2%;
    height: 20%;
    width: 96%;
    float: left;
    background: rgba(255, 255, 255, 0.35);
	
	
  }
  .mobile .body .list1 h2 {
    width:100%;
    text-align: center;
    float: left;
    color: #fff;
    text-decoration: none;
    font-size: 2em;
	
  }
  .mobile .body .list1 p {
    width:100%;
    float: left;
    text-align: center;
    color: #fff;
    text-decoration: none;
    font-size: 1em;
    font-family: 'permanent marker';
	
  }
  
  .mobile .body .list2{
    margin: 1% 2%;
    height: 30%;
    width: 96%;
    float: left;
    background: rgba(255, 255, 255, 0.35);
	
	
  }
  
  .list2 iframe{
  height:100%;
  width:100%;
  } 
  
  .body .Item{
text-align:center;
width:100%;
color:#fff;
}

.body .Item h3{
font-family:'ribeye';
}
 
.body .Item  p{
font-family:'permanent marker';
color:#f4dd99;
}  
 
.body .Item ul li{
font-family:'ribeye';
border-bottom:1px solid #fff;
} 

.body .Item ul li p{
font-family:'permanent marker';
color:#f4dd99;
} 

.body .Item ul{
 margin: 1.5% 2%;
    
    width: 96%;
    float: left;
     background: rgba(255, 255, 255, 0.35);
}
  
}