body{
  font-family: 'RalewayRegular';
  font-weight: normal;
  font-style: normal;
}
img {
  max-width:100%;
}
a,
a:link {
  text-decoration: none;
}
a:hover,
a:focus {
  color: #000;
  outline: none;
}

.menu {
  list-style: none;
  padding: 0;
  display: inline-block;
}
.menu> li {
  float: left;
  margin-right: 1em;
  margin-top: 2em;
}
.header{
  background-color:grey;
  text-align:center;
  border-style:solid;

}

.column1,
.column2,
.column3 {
  float: left;
  margin: 10px 10px 40px;
}
.column1 {
  width: calc(33.33333333% - 20px);
}
.column2 {
  width: calc(66.6666667% - 20px);
}
.wrap{
  margin:40px auto;
  width:100%;
  max-width:1000px;
}
p{
  max-width:350px;
}
.contact,
form{
  float: left;
  width:100%;
}

.title{
  margin: 0;
}
.boxes {
  margin-right: -10px;
}
.big-box,
.little-box {
  background-color: #ADD8E6;
  box-sizing: border-box;
  border:2px solid #0000A0;
  color: black;
  float: left;
  margin-right: 10px;
  padding: 20px;
}
.big-box {
  border:2px solid #0000A0;
  width: calc(66.66666667% - 10px);
  height: 300px;
}
.little-box {
  border:2px solid #0000A0;
  margin-bottom: 10px;
  width: calc(33.33333333% - 10px);
  height: 145px;
}
.project7{
  background-color: white;
}
.project8{
  background-color: white;
  background-size:cover
}
.project9{
  background-image:url(http://ux.walkme.com/wp-content/uploads/2014/04/UX-Inforgraphic.png);
  background-size:cover
}
.project10{
  background-image:url(../img/lamb.jpg);
  background-size:cover
}
.project11{
  background-image:url(../img/fig.jpg);
  background-size:cover
}
.project12{
  background-image: url(../img/peach.jpg);
  background-size:cover
}