/* Initial body */
body {
  left: 0;
  margin: 0;
  overflow: hidden;
  position: relative;
}

/* Initial menu */
.menu {
  background: #202024 url('assets/pin.jpg') repeat left top;
  left: -285px;  /* start off behind the scenes */
  height: 100%;
  position: fixed;
  width: 285px;
}

/* Basic styling */

.indexpage {
  background-image: url('assets/bg.jpg'); 
  height: 100%;
  -webkit-background-size: cover;
     -moz-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
}

.menu ul {
  border-top: 2px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.menu li {
  border-bottom: 2px;
  font-family: 'Open Sans', sans-serif;
  line-height: 45px;
  padding-bottom: 3px;
  padding-left: 20px;
  padding-top: 3px;
}

.menu a {
  color: #FFF;
  font-size: 17px;
  text-shadow: 2px 2px #4c4c4c;
  text-decoration: none;
  text-transform: uppercase;
}

.icon-close {
  color: #FFF;
  cursor: pointer;
  font-family: 'Open Sans', sans-serif;
  font-size: 17px;
  padding-bottom: 25px;
  padding-left: 25px;
  padding-top: 25px;
  text-shadow: 2px 2px #4c4c4c;
  text-decoration: none;
  text-transform: uppercase;
}

.icon-menu {
  color: #fff;
  cursor: pointer;
  width: 300px;
  font-family: 'Open Sans', sans-serif;
  font-size: 21px;
  text-shadow: 2px 2px #4c4c4c;
  padding-bottom: 25px;
  padding-left: 25px;
  padding-top: 25px;
  text-decoration: none;
  text-transform: uppercase;
}

.social-menu {
  color: #fff;
  cursor: pointer;
  width: 300px;
  font-family: 'Open Sans', sans-serif;
  font-size: 21px;
  padding-bottom: 20px;
  padding-left: 25px;
  padding-top: 20px;
  text-decoration: none;
  text-transform: uppercase;
}

.email-menu {
  color: #fff;
  cursor: pointer;
  width: 300px;
  font-family: 'Open Sans', sans-serif;
  font-size: 17px;
  padding-bottom: 20px;
  padding-left: 25px;
  padding-top: 10px;
  text-decoration: none;
  text-transform: uppercase;
}

.icon-menu i {
  margin-right: 7px;
}

.aboutpage {
  background-image: url('assets/aboutbg.jpg'); 
  height: 100%;
  -webkit-background-size: cover;
     -moz-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
}

.productpage {
  background-image: url('assets/productsbg.jpg'); 
  height: 100%;
  -webkit-background-size: cover;
     -moz-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
}

.projectpage {
  background-image: url('assets/projectbg.jpg'); 
  height: 100%;
  -webkit-background-size: cover;
     -moz-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
}

.contactpage {
  background-image: url('assets/contactbg.jpg'); 
  height: 100%;
  -webkit-background-size: cover;
     -moz-background-size: cover;
       -o-background-size: cover;
          background-size: cover;
}