.info_box {

  width: 80%;

  margin: auto;

  margin-top: 1em;

  margin-bottom: 2em;

  border: 3px solid white;

  border-radius: 5px;

  background-color: silver;

    /* IE10 Consumer Preview */ 

  background-image: -ms-linear-gradient(top, #FFFFFF 0%, #CCCCCC 60%, #C0C0C0 100%);



  /* Mozilla Firefox */ 

  background-image: -moz-linear-gradient(top, #FFFFFF 0%, #CCCCCC 60%, #C0C0C0 100%);



  /* Opera */ 

  background-image: -o-linear-gradient(top, #FFFFFF 0%, #CCCCCC 60%, #C0C0C0 100%);



  /* Webkit (Safari/Chrome 10) */ 

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #FFFFFF), color-stop(0.6, #CCCCCC), color-stop(1, #C0C0C0));



  /* Webkit (Chrome 11+) */ 

  background-image: -webkit-linear-gradient(top, #FFFFFF 0%, #CCCCCC 60%, #C0C0C0 100%);



  /* W3C Markup, IE10 Release Preview */ 

  background-image: linear-gradient(to bottom, #FFFFFF 0%, #CCCCCC 60%, #C0C0C0 100%);



  -webkit-box-shadow: 3px 4px 5px 0px rgba(0, 0, 0, 0.55);

  -moz-box-shadow:    3px 4px 5px 0px rgba(0, 0, 0, 0.55);

  box-shadow:         3px 4px 5px 0px rgba(0, 0, 0, 0.55);

}



.info_text {

  padding: 1em;

  padding-top: 0;

}

.info_box_photo {

  width: 100%;

}





.eightypc {

  padding-top: 5em;

}



.colors {

  width: 83%;

  margin: auto;

  max-width: 700px;

}



.dark {

  color: #000;

}



/*Adjust padding at top when no js*/

.no-js .eightypc {

  padding-top: 12em;

}



.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}.clearfix:after{clear:both;content:' ';display:block;font-size:0;line-height:0;visibility:hidden;width:0;height:0}* html .clearfix,*:first-child+html .clearfix{zoom:1}



/* ==========================================================================

   Media Queries

   ========================================================================== */



/*Adjust padding at top when no js*/

@media only screen and (min-width: 345px) {

  .no-js .eightypc {

    padding-top: 8em;

  }

}



/* Below 625px */



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

div[class^="box"] h2 {

    font-size: 1em;

  }

}



/* Below 1300px */



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

.colors {

    width: 90%;

 }

}



/* Large screens*/



@media only screen and (min-width: 1300px) {

  .colors {

    width: 1230px;

  }

  .info_box {

    width: 45%;

    float: left;
    margin-right:4%;

  }

}