body{
  font-family: 'Playfair Display', 'Roboto', sans-serif;
  color: #323333;
  margin: 0;
}

.hamburger{
  display:none;
}

.line{
  display:none;
}

header{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  margin-top:1em;
}

h1{
  font-size: 160%;
  letter-spacing:.35em;
  margin-bottom:0;
  padding-bottom: 0;
  margin-left: 1.25em;
  opacity:.6;
}

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

a:hover{
  opacity: .8;
}

.active{
  text-decoration:underline;
}

.menu{
  position:relative;
}

ul{
  list-style-type:none;
  margin-right: 4em;
}

li{
  display:inline-block;
  font-size: 90%;
  margin-left: 2.25em;
  margin-bottom: 0;
  letter-spacing: .15em;
  opacity: .8;
}

.IndexGallery{
  width: 100%;
  margin-top:1em;
  text-align:center;
  margin-bottom: 1em;
  font-size:0;
}

.IndexGallery > img{
    width: 22%;
    border:.3em solid #323333;
    padding:0;
    margin:0;
}

footer{
  display:flex;
  flex-flow: row wrap-reverse;
  justify-content:center;
  margin: .75em;
  margin-right: 1.5em;
  margin-left: 1.5em;
  font-size: 80%;
  align-items:center;
  text-align:center;
}

.socialicons img{
  margin: .3em;
  opacity: .5;
  width:20px;
}

.socialicons{
  width:100%;
  display:flex;
  justify-content:center;
}

.social{
  margin:.2em;
}

.gallery{
  display:flex;
  justify-content:center;
  flex-flow:row wrap;
  margin:5em;
  margin-top:1em;
  margin-bottom: 1em;
}

.gallery img{
  margin-left:1em;
  margin-bottom:1em;
  height:200px;
}

.about{
  display:flex;
  justify-content:center;
  margin-top:2em;
}

.urban{
  height: 450px;
 margin-bottom:10em;
 margin-right:3em;
}

.cv{
 font-size:90%;
 margin-right:2em;
 margin-left:2em;
}

.cv>p{
     margin-top:0;
}

h3{
  letter-spacing: .15em;
}

.statement{
  display:flex;
  justify-content:center;
  text-align:left;
  margin-top:2em;
  margin-left: 10em;
  margin-right:10em;
}

.statement > p{
  max-width: 400px;
  margin: 0 auto;
  text-align:left;
  margin-bottom:2em;
}


.aboutimage{
  height:300px;
  width:400px;
  margin-right:2em;
  margin-bottom:5em;
}
/*---------Form Style*---------*/

.contact{
  display:block;
  text-align:center;
  margin-top:2em;
  margin-bottom:2em;
}

.contact > img{
  height:400px;
  margin-right:2em;
}

#formImage{
  height:500px;
  margin-right: 1em;
}

#formDiv{
  display:flex;
  flex-flow:row wrap;
  justify-content:center;
  width:800px;
  margin: 0 auto;
  margin-top: 2.5em;
}

#formImage{
  height:500px;
}

form input{
  margin:1em;
  display:block;
  border: 1.5px solid #45372e;
}

 .inputSame{
  width: 400px;
  height: 35px;
  font-size:70%;
}

.Message{
  width:400px;
  height: 100px;
  border: 1.5px solid #45372e;
  display:block;
  margin:1em;
  font-size:70%;
}

.Submit{
  color:#45372e;
  text-transform:uppercase;
  float:right;
  background-color:#fff;
  height:3em;
  width: 7em;
  font-size: 75%;
}

.form{
  display:block;
}

.form > p{
  text-align:left;
  display:block;
  clear:both;
  margin:1.25em;
}

/*--------------MEDIA----------------*/
@media screen and (max-width:960px){
  li{
    margin-left:1em;
  }

  h1{
    margin-left:1em;
  }

.cv{
  margin:1em;
}

.statement{
  display:flex;
  flex-flow:column-reverse wrap;
}

.aboutimage{
  height:300px;
  width:400px;
  margin-bottom:1em;
  margin:0 auto;
}
}
@media screen and (max-width: 860px){

    header{
    margin:auto;
    text-align:center;
    display:block;
  }

  .hamburger{
    padding: 15px;
    display:inline-block;
  }

  .line{
    border-bottom: 3px solid #323333;
    width: 35px;
    margin-top:.6em;
    display:block;
  }

  .menu{
    height:0;
    overflow:hidden;
    transition: height 0.3s;
  }

  .open{
    height:325px;
  }

  h1{
    font-size:160%;
    margin-top:.5em;
    display:block;
    margin-left: 1.25em;
    margin-right: 1.25em;
  }

   li{
     margin:1.25em;
     font-size:120%;
     display:block;
   }

   ul{
     margin:auto;
     text-align:center;
     padding-left:0;
   }

   ul > li > ul {
     display:block;
   }

   ul> li> ul> li{
     display:block;
   }


   .one{
     display:none;
   }

   .about{
     display:flex;
     flex-flow:column wrap;
     justify-content:center;
     margin-top:0;
   }

   .urban{
     width:300px;
     height:250px;
     margin:0 auto;
     margin-bottom:2em;
   }

  .cv{
    font-size:90%;
    clear:none;
    text-align:center;
    margin: 1em;

   }

   .IndexGallery > img{
       width: 32%;
       border:.1em solid #323333;
       padding:0;
   }

   .gallery{
     display:flex;
     justify-content:center;
     margin: 0;
   }

   .gallery > img{
     margin:0 auto;
    width:200px;
   }

   footer{
     display:flex;
     justify-content:center;
     flex-flow: row wrap-reverse;
     font-size:70%;
   }

   .socialicons{
     display:flex;
     justify-content:center;
   }

   .urban{
     display:none;
   }

   .aboutimage{
     height:200px;
     width:300px;
   }

   .statement{
     font-size:100%;
     clear:none;
     text-align:center;
     margin: 2em;
   }

   .contact > img{
     height:300px;
     margin:0 auto;
   }
}

@media screen and (max-width: 500px){

  .two{
    display:none;
  }

  .three{
    display:none;
  }

  .IndexGallery > img{
      width: 80%;
      padding:0;
      border: 0;
  }

  h1{
    font-size:150%;
  }

  .gallery{
    display:flex;
    justify-content:center;
    margin: 0;
  }

  .gallery > img{
    margin:0 auto;
   width:200px;
  }

  .aboutimage{
    display:none;
  }
}