@charset "utf-8";
/* CSS Document */

/**************basic code for every page*************/
body
{
	background-image:url(images/bg3.jpg);
	background-attachment:fixed;
	width:90%;
	margin: 0 auto;
	font-family: Arial;
	background-color :#E29A65;

}

#img 
{
	align-items : center ;
	margin: 0 auto ;
	padding :1%;
	height :200;
	width :100;
}
.navigation
{
	text-align:center;
}

#text1
{
	font-family:Tohama; 
	font-size:14px; 
	text-align:right;
}

#text2
{
	font-family:Tahoma; 
	font-size:14px; 
	text-align:left;
}
#h3
{
	text-align: center;
}
#map1, #map2, #map3, #map4
{ width:23%;
	padding:1%;
  height:auto;
float: left;
text-align:center;}

#photos1, #photos2, #photos3, #photos4
{
width:23%;
	padding:1%;
  height:auto;
float: left;
text-align:center;	
}

#menu1 ,#menu2, #menu3, #menu4
{
	width:23%;
	padding:1%;
  height:auto;
float: left;
}

#picture1, #picture2, #picture3, #picture4, #picture5
{
	width:23%;
	padding:2%;
  height:auto;
float: left;
text-align:center;
}

#aboutme 
{
width:80%;
float:right ;
display:flex;
padding : 5% 0 ;
text-align:center;
margin : 100;
 
}

#gambar {
width:100%;
height:auto;
float : center ;
}

h1 {
	
	text-align:center;
	font-size :30px;
	color:#0B0A0A;
	font-family:antonim;
	padding-bottom: 2% 0;
	margin-right: 30%; 
}

a {
color: #006;
text-decoration:none;
}

a:hover {
color: #F60;
}

sushi king{
	align-content: center;
}

form-container{
	align-content: center;
	
}
#footer
{
	width:100%;
	float:left;
	text-align:center;
}

/**************Embed the font for header*************/

@font-face 
{
  font-family: "vibes";
  src:url(font/GreatVibes-Regular.ttf);
}

h1 
{
  font-family: vibes;
  font-size: 25px;
}

/**************creating the hover opacity image *************/

.container {
  position: relative;
  width: 50%;
}

.image {
  opacity: 1;
  display: block;
  width: 100%;
  height: auto;
  transition: .5s ease;
  backface-visibility: hidden;
}

.middle {
  transition: .5s ease;
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}

.container:hover .image {
  opacity: 0.3;
}

.container:hover .middle {
  opacity: 1;
}

.text {
font-family:tahoma;
  background-color: #00C;
  color: white;
  font-size: 16px;
  padding: 16px 32px;
}

.text_a {
font-family:tahoma;
  background-color: #000;
  color: white;
  font-size: 16px;
  padding: 16px 32px;
}