

html {
  margin: 0;
  padding: 0;
  font-family: 'Spartan', sans-serif;
}

body {
  margin: 0;
  padding: 0;
  background-image: url("../../media/bg1.jpg");
  background-repeat: no-repeat;
  background-position: center top;
  font-family: 'Spartan', sans-serif;
}

nav,
.navbar-toggle {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

nav {
  position: fixed;
  z-index: 10;
  background-color: rgba(255,255,255, 0.90);
  width: 100%;
  height: 100%;
  text-align: center;
  display: table;
  color: #000000;
    top: 0
}

.nav-hide { display: none; }

nav ul {
  position: fixed;
  left: -12%;
  top: 60px;
  width: 100%;
  display: table-cell;
  vertical-align: middle;
}

nav ul li { list-style: none; }

nav ul li a {
  font-size: 26px;
  color: inherit;
  font-weight: bolder;
  text-decoration: none;
  font-weight: 300;
  line-height: 200%;
  color: rgba(0,0,0,1.00)
}

@media (min-width: 960px) {
    
nav ul li a {
  font-size: 46px;
  line-height: 150%;
}
    
}

nav ul li a:hover {
  color: rgba(153,153,102,1.00)
}

.navbar-toggle {
  position: absolute;
  top: 20px;
  left: 8%;
  width: 69px;
  height: 69px;
  z-index: 20;
  cursor: pointer;
}

@media (min-width: 960px) {
    
nav ul {
  position: fixed;
  left: -6%;
  top: 140px;
  width: 100%;
  display: table-cell;
  vertical-align: middle;
}

.navbar-toggle {
  position: absolute;
  top: 86px;
  left: 18%;
  width: 69px;
  height: 69px;
  z-index: 20;
  cursor: pointer;
}
    
}

.bar1,
.bar2,
.bar3 {
  width: 100%;
  height: 8px;
  margin-bottom: 15px;
  background-color: #000000;
  transition: all 0.3s ease-in-out;
}

.navbar-on .bar1,
.navbar-on .bar2,
.navbar-on .bar3 { background-color: #000000 }

.navbar-on .bar1 {
  transform-origin: 5% 40%;
  transform: rotate(45deg);
}

.navbar-on .bar3 {
  transform-origin: 5% 40%;
  transform: rotate(-45deg);
}

.navbar-on .bar2 { background-color: transparent; }

/*####### Layout #######*/

#home-container {margin: 100px 0 0 0}

.home {width: 100%; height: 600px; background: url("../../media/chiaki-nagata-home-.png"); background-repeat: no-repeat; background-position: -50px 200px; background-size: 500px auto}

.home h1 {font-size: 4em; padding: 0 0 10px 20px; line-height: 100%; font-weight: 300 !important; position: relative;top: -100px}

.home h2 {font-size: 1.93em; padding: 0 0 10px 22px; line-height: 100%; font-weight: 300 !important; position: relative;top: -145px}

hr{width: 100%; padding: 4px 0; background: rgba(153,153,102,1.00); border: none; margin: 30px auto}

a.footer {font-size: 0.9em; text-decoration: none; color: #000000}

@media (min-width: 960px) {

.home {width: 100%; height: 600px; background: url("../../media/chiaki-nagata-home-.png"); background-repeat: no-repeat; background-position: 120px bottom}

.home h1 {font-size: 6em; padding: 0; line-height: 100%; font-weight: 300 !important; position: relative; top: -110px}
    
.home h2 {font-size: 2.87em; padding: 0 0 0 6px; line-height: 100%; font-weight: 300 !important; position: relative; top: -165px}
    
}
