#container{
  /*background-image:url(../images/features/coverart.jpg);*/
}

main{
  padding-top:10%;
}

.feature{
  position:relative;
  margin-bottom:8%;
}

h2 img{
  max-width:756px;
  width:100%;
  margin-left:-8%;
}

.feature p{
  padding:0.5%;
  transform:scale(1,1.002);
  text-align: justify;
}
.screenshot{
  text-align:center;
}

.screenshot img{
  margin:0.3%;
  width:31.5%;
  border:1px #502 solid;
}

#f1{
  margin-top:-5%;
}
#f3{
  margin-top:10%;
}
#f3 p{
  width:60%;
}
#f3 #bg_image{
  position:absolute;
  top:-1%;
  width:60%;
  right:0;
  z-index:-1
}


.bt_detail{
  display:block;
  width:50%;
  margin:2% auto;
  background-color:#999;
  background:linear-gradient(to bottom,#FFF,#999);
  padding:1%;
  text-align:center;
  color:#222;
  text-decoration:none;
  border:1px #DDD solid;
  box-shadow:0 0 3px #FFF inset;
}

/*----Media Query----*/
@media screen and (max-width:768px){
  main{
    padding-top:40%;
  }

  h2 img{
    margin-left:-9%;
  }

  .bt_detail{
    width:60%;
  }
}

@media screen and (max-width:639px){
  main h1{
    font-size:300%;
  }

  h2 img{
    width:110%;
  }

  .feature p{
    text-shadow:0 0 3px #000,0 0 3px #000,0 0 3px #000;
  }
  #f3 #bg_image{
    top:27%;
  }
  .bt_detail{
    width:97%;
  }
}