<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<html>
<!--By Leon Li-->
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<link rel="stylesheet" href="main.css?v=31">
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
<script src="https://code.jquery.com/jquery-1.12.3.min.js" integrity="sha256-aaODHAgvwQW1bFOGXMeX+pC4PZIPsvn2h1sArYOhgXQ=" crossorigin="anonymous"></script>
<script src="all.js"></script>
</head>
<body>
<div class="container" id="restarants">
<div class="row">
<div class="col-sm-3 col-md-3 hidden-xs">
<div class="type-table">
<ul>
<h1 class="type-table-h1">Sort By Type</h1>
<hr>
<li>All</li>
<li>Asian</li>
<li>BBQ</li>
<li>Burgers</li>
<li>Healthy</li>
<li>Pasta</li>
<li>Pizza</li>
<li>Sandwiches</li>
<li>Wraps</li>
</ul>
</div>
</div>
<div class="col-sm-8 col-md-8 col-xs-12 no-padding" id="menu">
<div class="features-table">
<ul>
<h1>Open Restaurants</h1>
<li name="restaurant">
<div class="row">
<div class="col-sm-3 col-md-2 col-xs-3"><img src='http://www.logospike.com/wp-content/uploads/2015/11/Logo_7_Eleven_03.jpg' class = "logo" /></div>
<div class="col-sm-6 col-md-6 col-xs-6 ">
7-Eleven<br>
6546 Trigo Road<br>
Isla Vista, CA 93117
</div>
</div>
</li>
<li name="restaurant">
<div class="row">
<div class="col-sm-3 col-md-2 col-xs-3"><img src='https://www.deliveryup.com/editable/images/logos/front/22.jpg' class = "logo" /></div>
<div class="col-sm-6 col-md-6 col-xs-6 ">
805 Kabob<br>
6578 Trigo Road<br>
Isla Vista, CA 93117
</div>
</div>
</li>
<li name="restaurant">
<div class="row">
<div class="col-sm-3 col-md-2 col-xs-3"><img src='https://www.deliveryup.com/editable/images/logos/front/14.jpg' class = "logo" /></div>
<div class="col-sm-6 col-md-6 col-xs-6 ">
Pho Bistro<br>
6578 Trigo Road<br>
Isla Vista, CA 93117
</div>
</div>
</li>
<li name="restaurant">
<div class="row">
<div class="col-sm-3 col-md-2 col-xs-3"><img src='https://www.deliveryup.com/editable/images/logos/front/5.png' class = "logo" /></div>
<div class="col-sm-6 col-md-6 col-xs-6 ">
Super Cuca's IV<br>
6527 Madrid Road<br>
Isla Vista, CA 93117
</div>
</div>
</li>
<li name="restaurant">
<div class="row">
<div class="col-sm-3 col-md-2 col-xs-3"><img src='http://www.habitburger.com/wp-content/themes/habitburger/images/logo-habit.jpg' class = "logo" /></div>
<div class="col-sm-6 col-md-6 col-xs-6 ">
The Habit Burger Grill<br>
888 Embarcadero del Norte #C<br>
Isla Vista, CA 93117
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</body>
</html>
li{
list-style:none;
}
h1{
font-size:21px !important;
}
.type-table-h1{
color: #fff;
}
.container{
padding: 15px 15px;
}
.type-table li {
color: #fc5e0f;
border-radius: 4px;
font-size: 14px;
padding: 4px 4px;
}
.type-table li:hover{
background: #ffd089;
opacity: 0.75;
border-radius: 8px;
cursor:pointer;
-webkit-transition: all .35s;
-moz-transition: all .35s;
transition: all .35s;
}
.features-table li {
/*background: #fcf0de none repeat scroll 0 0; */
background: #ffe0ba;
border-left: 2px solid #fca037;
border-right: 2px solid #fca037;
border-bottom: 2px solid #fca037;
border-top: 2px solid #fca037;
color: #4c493f;
font-size: 16px;
padding: 15px 24px;
opacity: 0.75;
margin-top:20px;
border-radius: 5px;
}
.features-table li:hover{
background: #ffd089;
cursor:pointer;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 0 30px 0 rgba(0, 0, 0, 0.5);
-webkit-transition: all .35s;
-moz-transition: all .35s;
transition: all .35s;
}
.features-table h1{
background: #ffeac9 none repeat scroll 0 0;
color: #8fc647;
border-left: 2px solid #fca037;
border-top: 2px solid #fca037;
border-right: 2px solid #fca037;
border-bottom: 2px solid #fca037;
font-weight: 600;
margin: 0;
padding: 19px 21px;
opacity: 0.8;
text-transform: uppercase;
}
.features-table h1 {
border-top-left-radius: 5px;
border-top-right-radius: 5px;
text-align:left;
}
img.logo{
border-style:double;
border-width: 1px;
border-color: gray;
width: 100%;
}
.fa.fa-check {
color: #2cc14f;
}
.fa.fa-times {
color: #BA5340;
}
.fa{
font-size:30px;
}
.no-padding{
padding:0;
}
ul{
padding:0;
}
body {
background: linear-gradient(rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.75)), url('food2.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center-top;
}
$(document).ready(function(){
$("[name=restaurant]").click(function(){
$("#menu").animate({
left: '1000px',
opacity: '0',
height: '250px',
width: '250px'
});
});
});
