/* visited link */
.btn:visited {
    color: #666666;\
    text-decoration:none;
}

/* mouse over link */
.btn:hover {
    color: #FF5800;
    text-decoration:none;
}

/* selected link */
.btn:active {
    color: #FF5800;
    text-decoration:none;
}
#wayfinding {
  position: static;
  padding-top:50px;
  width:710px;
  z-index: auto;
}

#wayfinding span{
  color: #FF5800;
  text-align: right;
  font-size: 20px;
  font-weight: normal;
  font-family: "Helvetica", "Arial", "sans serif";

}

#wabout_us span{
  color: #FF5800;
  text-align: right;
  font-size: 20px;
  font-weight: normal;
  font-family: "Helvetica", "Arial", "sans serif";

}

.works {
  display: inline-block;
  position: relative;
  vertical-align:left;
}

.works__image {
  width: 200px;
  height: 200px;
  margin-right:5px;
  margin-bottom: 5px;
  display: block; 
}
  
.works__body {
  width: 110px;
  height: 110px;
  background: rgba(0, 0, 0, 0.8);
  bottom: 0;
  color: white;
  font-size: 1em;
  left: 0;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  text-align: right;
  top: 0;
  right: 0;
  -webkit-transition: 0.6s;
  transition: 0.6s;
}

.works__body:hover { opacity: 1; }

.works__body:after,
.works__body:before {
  content: '';
  opacity: 0;
  position: absolute;
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  -webkit-transition: 0.6s 0.2s;
  transition: 0.6s 0.2s;
}


.works__body:hover:after,
.works__body:hover:before {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}

.works__body h2 { /*project title*/
  text-align: right;
  font-size: 10px;
  font-weight:bolder;
  font-family: "Helvetica", "Arial", "sans serif";

 }

#project_wrapper{
  display: block;
  position: relative;
  width: 710px;
  top:250px;
}

.media__body {
  width: 230px;
  height: 230px;
  background: rgba(0, 0, 0, 0.8);
  bottom: 0;
  color: white;
  font-size: 1em;
  left: 0;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  text-align: right;
  top: 0;
  right: 0;
  -webkit-transition: 0.6s;
  transition: 0.6s;
}

.media__body:hover { opacity: 1; }

.media__body:after,
.media__body:before {
  content: '';
  opacity: 0;
  position: absolute;
  -webkit-transform: scale(1.5);
  -ms-transform: scale(1.5);
  transform: scale(1.5);
  -webkit-transition: 0.6s 0.2s;
  transition: 0.6s 0.2s;
}


.media__body:hover:after,
.media__body:hover:before {
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  opacity: 1;
}

.media__body h2 { /*project title*/
  padding-top: 130px;
  padding-right: 15px;
  padding-left: 20px;
  line-height: 10px;
  text-align: right;
  font-size: 20px;
  font-weight:bolder;
  font-family: "Helvetica", "Arial", "sans serif";

 }

.media__body p { /*project description*/
  padding-right: 15px;
  padding-left: 15px;
  line-height: 14px;
  text-align: right;
  font-size: 12px;
  color: grey;
  font-weight: normal;
  font-family: "Helvetica", "Arial", "sans serif";
 }


.hidden{
  visibility:hidden;
  display: none;
}


.project__media{
  width: 230px;
  height: 230px;
  overflow:hidden;
  display: inline-block;
  position: relative;

}

.project__media img{
  height: 230px;
  width: 230px;
  left:auto
  position: relative;
  background-size: cover;
}
.overlay{
  background-color: #fff;
  opacity: 1;
  width: 100%;
  height: 100%;
}