.content{
  width: 100%;
  margin: 0%;
  overflow: hidden;
  margin-bottom: 6%;
    font-family:tinos;
}
.content-body{
  margin: 2% 5%;
}
.content-header{
  width: 100%;
  height: 18vw;
}
.content-header img{
  width: 100%;
  max-width: 100%;
  height: auto;
  margin: 0;
}
.header-body{
    position: absolute;
    margin-top: 12%;
    width: 97%;
    margin-left: 3%;
    overflow: hidden;
    z-index: 0;
}
  .header-body h1{
    margin: 0%;
    color: white;
    text-align: center  ;
            font-size: 3vw;
  }

 .developers{
  width: 95%;
  margin-left: 2.5%;
  padding: 8% 0;
  overflow: hidden;
  font-family: montserrat;
}
.developers-header h3{
  text-align: center;
  margin: 0;
  font-size: 3vw;
   background: -webkit-linear-gradient(#c1b881, #85540f ,#c1b881);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  }
  .developers-header span{
  font-weight: lighter;
  font-size: 1.2vw;
  }
.dev-holder{
  border-bottom: 1px solid gray;
  width: 47%;
  margin: 1.5% ;
  float: left;
  height: 38vw;
  overflow: hidden;


}
.dev-holder:hover{

}
.dev-title{

  width: 96%;
  height:20%;
  padding:3% 2%;
}
.dev-title a{

  text-decoration: none;
}
.dev-title h3{
  font-size:1vw;
margin: 0;
  font-family: tinos;
  font-weight: bolder;
  color: black;

}
.dev-title p{
  margin: 0;
  margin-top: 2%;
  font-size:.8vw;
  color: black;

}
.dev-image2{
}
.dev-image{
    width: 100%;
    height:  29.725vw;
    position: relative;
    overflow: hidden;   

}
.dev-image img{
      position: absolute;
    top: 50%;
    left: 50%;
    bottom:  50%;
    right: 50%;
    color: white;
    width: auto;
    max-width: 100%;
    height: auto;
    max-height: 100%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}
 .dev-title h3:hover, .dev-image img:hover{
    opacity: .8;
  }
    @media only screen and (max-width: 768px) {
.content-header{
  margin-top: 9%;
}
.header-body{
      margin-top: 19%;
}
  .header-body h1{
        font-size: 8vw;
  }
   .dev-holder{
  box-shadow: 0 5px 10px rgba(0, 0, 0, .1);
  width: 30.33%;
  margin: 1.5%;
  float: left;
  height: 45vw;
  overflow: hidden;
  border-top-right-radius: .5em;
  border-top-left-radius:.5em;

}
.dev-holder:hover{
    border-top-right-radius:0em;
  border-top-left-radius:0em;
}
.dev-image2{

}
.dev-image{
    width: 100%;
    height:  60vw;
    position: relative;
    overflow: hidden;
    
}

  .houses{
    width: 55%;
    margin-left: 22.5%;
    height:  40vw;
    position: relative;
    overflow: hidden;
  }

  .header-dev h3{
        text-align: center;
    padding: 5% 0% 0% 0% ;
    font-weight: bolder;
    color: #004d80;
    font-size:6vw;
  }
    .header-dev p{
        text-align: center;
    font-size: 3vw;
    font-weight: normal;
    color: #666;
  }
    .dev-holder{
  box-shadow: 0 5px 10px rgba(0, 0, 0, .1);
  width: 90%;
  margin: 5%;
  float: left;
  height: 82vw;
  overflow: hidden;
  border-top-right-radius: .5em;
  border-top-left-radius:.5em;
}
.dev-title h3{
  font-size:4vw;
  margin-top:1%;
  color:#404040;
  font-family: tinos;
}
.dev-title p{
  margin-top: 1%;
  font-size:2.5vw;
  color: #666666;
font-family: tinos;
}
.developers-header h3{
  text-align: left;
  font-size: 6vw;
  font-weight: bolder;
  color: black;
  margin: 0% 1.5% ;
    margin-bottom:2.5%;
  }
  .developers-header span{
  font-weight: lighter;
  font-size: 3.5vw;
  }
}