Skip to content
Permalink
Branch: master
Find file Copy path
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
550 lines (471 sloc) 12.6 KB
<!DOCTYPE html>
<html>
<head>
<title> 404 - Not Found </title>
<link rel="stylesheet" href="food.css" charset="utf-8"/>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Montserrat:bold">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Raleway:light">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Sacramento">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.10/css/all.css" integrity="sha384-+d0P83n9kaQMCwj8F4RJB66tzIwOKmrdb46+porD/OvrJ+37WqIM7UoBtwHO6Nlg" crossorigin="anonymous">
<link href="css/logoiconfont.css" rel="stylesheet">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
html, body {
max-width: 100%;
overflow-x: hidden;
}
h1 {
text-align: center;
font-family: 'Montserrat';
}
h2 {
font-family: 'Montserrat';
}
#colorChangeRed {
color: #bc2405;
}
/*.carousel .item {
height: inherit;
}
.item img {
position: absolute;
top: 0;
left: 0;
min-height: inherit;
}*/
#colorChangeOrange {
color: #f2a91a;
}
#pic {
width: 240px;
height: 320px;
margin-left: auto;
margin-right: auto;
display: block;
}
.border {
border: 2px solid black;
overflow: hidden;
display: inline-block;
width: 23%;
height: 23%;
position: relative;
background-color: black;
}
.foods {
/*padding-left: 3px;
padding-right: 3px;
padding-top: 3px;
padding-bottom: 3px;*/
width: 100%;
height: 100%;
transition: transform .2s;
opacity: 1;
backface-visibility: hidden;
}
.middle {
transition: .5s ease;
opacity: 0;
position: absolute;
top: 75%;
left: 50%;
align-items: center;
transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
text-align: center;
}
.border:hover .foods {
transform: scale(1.5);
opacity: 0.5;
}
.border:hover .middle {
opacity: 1;
}
.foodCaption {
transition: .5s ease;
opacity: 0;
position: absolute;
text-align: left;
top: 3%;
left: 3%;
}
.border:hover .foodCaption {
opacity: 1;
}
.text {
/*background-color: #4CAF50;*/
border: 2px solid white;
opacity: 1;
color: white;
font-size: 10px;
padding: 5px 8px;
font-family: 'Montserrat';
}
.textCaption {
opacity: 1;
color: white;
font-size: 25px;
font-family: 'Sacramento';
}
.emph {
font-weight: bold;
}
.und {
text-decoration: underline;
}
.ital {
font-style: italic;
}
.centerMe {
text-align: center;
}
.left {
text-align: left;
}
.container .navbar-header .navbar-brand {
color: #bcc0c6;
font-family: 'Montserrat';
font-size: 35px;
margin-top: 6px;
margin-left: 10px;
}
#masterpieceTitle {
font-size: 95px;
font-family: 'Sacramento';
/*text-align: center;*/
/*margin-left: 50%
margin-right: 50%;*/
left: 50%;
margin-right: -50%;
}
.hideMe {
opacity: 0;
}
#home {
background-color: #eda61a;
padding-top: 16%;
padding-bottom: 16%;
margin-bottom:30px;
}
#aboutMe {
background-color: white;
/*padding-top: 3%;*/
padding-bottom: 3%;
}
#skills {
background-color: #eda61a;
padding-top: 3%;
padding-bottom: 3%;
}
#work {
background-color: white;
padding-top: 3%;
padding-bottom: 3%;
}
#exp {
background-color: #eda61a;
padding-top: 3%;
padding-bottom: 3%;
}
#achieve {
background-color: white;
padding-top: 3%;
padding-bottom: 3%;
}
#projects {
background-color: white;
padding-top: 6%;
padding-bottom: 3%;
}
#educ {
background-color: #eda61a;
padding-top: 3%;
padding-bottom: 3%;
}
#buttonFooter {
background-color: #bc2405;
border: solid #bc2405;
/*color: rgb(28,31,39);*/
color: white;
font-family: 'Montserrat';
border-radius: 24px;
}
#butSubmit {
background-color: #bc2405;
border: solid #bc2405;
color: white;
font-family: 'Montserrat';
border-radius: 5px;
}
#foot {
font-family: 'Raleway';
padding-top: 10px;
padding-bottom: 10px;
}
.customBulletRight {
display: block;
}
.customBulletRight:before {
content: "\e080";
font-family: 'Glyphicons Halflings';
font-size: 9px;
float: left;
margin-top: 4px;
margin-left: -17px;
color: rgb(28,31,39);
}
#buttonFooter:hover {
border: solid #3f3d3e;
background-color: #3f3d3e;
color: #bcc0c6;
}
#tt thead th {
background-color: rgb(28,31,39) !important;
color: #bcc0c6 !important;
}
.container .navbar-collapse-collapse .nav .navbar-nav .navbar-right .hoverThis:hover {
color: black;
}
.down {
color: rgb(28,31,39);
}
.dropcaps:first-letter {
margin: 0.08em 0 -0.05em 0;
padding: 0 0.065em 0 0;
font-size: 5em;
line-height: 0.85em;
float: left;
}
.justify {
text-align: justify;
}
.hrSpec {
margin-top: 20px;
margin-bottom: 50px;
}
#tableC {
width: auto !important;
}
.tableCenter {
text-align: center;
}
.dontChangeColor {
color: inherit;
}
.dontChangeColor:hover {
color: inherit;
}
/*
.navbar-brand,
.navbar-nav li a {
height: 80px;
line-height: 200px;
padding-top: 0 50px;
}*/
/* Center the loader */
#loader {
position: absolute;
left: 50%;
top: 50%;
z-index: 1;
width: 150px;
height: 150px;
margin: -75px 0 0 -75px;
border: 6px solid #f3f3f3;
border-radius: 50%;
/*border-top: 6px solid #eda61a;*/
border-top: 6px solid #bc2405;
width: 80px;
height: 80px;
-webkit-animation: spin 2s linear infinite;
animation: spin 1s linear infinite;
}
@-webkit-keyframes spin {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
/* Add animation to "page content" */
.animate-bottom {
position: relative;
-webkit-animation-name: animatebottom;
-webkit-animation-duration: 1s;
animation-name: animatebottom;
animation-duration: 1s
}
@-webkit-keyframes animatebottom {
from { bottom:-100px; opacity:0 }
to { bottom:0px; opacity:1 }
}
@keyframes animatebottom {
from{ bottom:-100px; opacity:0 }
to{ bottom:0; opacity:1 }
}
#myDiv {
display: none;
}
#hrJumbo {
border-color: rgb(28,31,39);
}
/*.carousel-inner > .item > img,
.carousel-inner > .item > a > img {
width: 100%;
height: 80% !important;
margin-top: 0px;
}
.carousel-caption {
margin-bottom: 110px !important;
}
.carousel-indicators {
text-align: center;
float: right;
right: 2% !important;
left: inherit;
margin-bottom: 90px !important;
}
#titleId {
display: block !important;
margin-left: auto !important;
margin-right: auto !important;
position: absolute;
z-index: 10;
}*/
</style>
</head>
<body onload="onload();" data-spy="scroll" data-target=".navbar" data-offset="50">
<div id="loader"></div>
<div style="display:none;" id="myDiv" class="animate-bottom">
<div>
<header>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div id="navbar" class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<!--<a class="navbar-brand">
<div class="dropdown">
<img src="menu.png" alt="menu" height="30px" width="30px">
<ul class="dropdown-menu" role="menu" aria-labelledby="menu1">
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">HTML</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">CSS</a></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">JavaScript</a></li>
<li role="presentation" class="divider"></li>
<li role="presentation"><a role="menuitem" tabindex="-1" href="#">About Us</a></li>
</ul>
</div>
</a>-->
<div id="navbar" class="navbar-collapse-collapse">
<ul class="nav navbar-nav navbar-left">
<li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" href="#"><img src="img/menu.png" alt="menu" height="30px" width="30px"></a>
<ul class="dropdown-menu">
<li><a href="#">Blog</a></li>
<li><a href="#">Reviews</a></li>
<li><a href="#">Masterpieces</a></li>
<li role="presentation" class="divider"></li>
<li><a href="#">About</a></li>
</ul>
</li>
<li class="navbar-brand">HEAVEN'S TASTES</li>
</ul>
</div>
</div>
<!--<div id="navbar" class="navbar-collapse-collapse">
<ul class="nav navbar-nav navbar-center">
<li class="hoverThis"><a href="#projects">
<img src="chefLogo.png" alt="chef_logo" id="logo" height="20%" width="20%"/>
</a></li>
</ul>
</div>-->
<div id="navbar" class="navbar-collapse-collapse">
<ul class="nav navbar-nav navbar-right">
<li class="hoverThis"><a href="https://www.facebook.com/" target="_blank"><img src="img/facebook.png" alt="fb" height="35px" width="35px"></a></li>
<li class="hoverThis"><a href="https://www.twitter.com/" target="_blank"><img src="img/twit.png" alt="twitter" height="35px" width="35px"></a></li>
<li class="hoverThis"><a href="https://www.instagram.com/" target="_blank"><img src="img/instagram.png" alt="insta" height="35px" width="35px"></a></li>
</ul>
</div>
</div>
</nav>
</header>
<section class="background1 section-padding">
<div class="constr" style="margin-top: 8%; margin-left:12%">
<h3>Error 404 - Page Not Found</h3>
Sorry, but this page is still under construction. Please check back again later.
</div>
</section>
<br>
<br>
<br>
<footer class="background2 footer-padding">
<div class="container">
<div class="row">
<div class="col-sm-8 col-sm-offset-2 text-small text-center">
<button id="buttonFooter" type="button" class="btn btn-primary btn-up-footer btn-lg round scroll-top" onclick="self.close()">CLOSE</button>
</div><!-- /.column -->
</div><!-- /.row -->
</div><!-- /.container -->
</footer>
</div>
<div>
<script>
// Add slideDown animation to Bootstrap dropdown when expanding.
$('.dropdown').on('show.bs.dropdown', function() {
$(this).find('.dropdown-menu').first().stop(true, true).slideDown();
});
// Add slideUp animation to Bootstrap dropdown when collapsing.
$('.dropdown').on('hide.bs.dropdown', function() {
$(this).find('.dropdown-menu').first().stop(true, true).slideUp();
});
$(document).ready(function(){
$('body').scrollspy({target: ".navbar", offset: 50});
$("#navbar a").on('click', function(event) {
if (this.hash !== "") {
event.preventDefault();
var hash = this.hash;
$('html, body').animate({
scrollTop: $(hash).offset().top
}, 800, function(){
window.location.hash = hash;
});
} // End if
});
});
/* ---- nav smooth scroll ---- */
$(document).ready(function() {
$('.scroll-link').on('click', function(event){
event.preventDefault();
var sectionID = $(this).attr("data-id");
scrollToID('#' + sectionID, 750);
});
$('.scroll-top').on('click', function(event) {
event.preventDefault();
$('html, body').animate({scrollTop:0}, 1200);
});
});
/* ---- navbar offset ---- */
function scrollToID(id, speed){
var offSet = 69;
var targetOffset = $(id).offset().top - offSet;
$('html,body').animate({scrollTop:targetOffset}, speed);
}
var myVar;
function onload() {
myVar = setTimeout(showPage, 1500);
}
function showPage() {
document.getElementById("loader").style.display = "none";
document.getElementById("myDiv").style.display = "block";
}
</script>
</body>
</html>
You can’t perform that action at this time.