.products .box {
    width: 23%;
    border: 1px solid #ccc;
    box-shadow: 1px 1px 9px -1px #cccccc;
    margin: 0px 5px;
    display: inline-block;
    transition: all 0.4s ease-in-out;
    background-color: white;
  }
  .products .box .box-title {
    padding: 2.5rem 0rem;
    text-align: center;
    position: relative;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f5f5f5+0,fcfcfc+50,f5f5f5+100 */
    background: #f5f5f5;
    /* Old browsers */
    background: -moz-linear-gradient(top, #f5f5f5 0%, #fcfcfc 50%, #f5f5f5 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #f5f5f5 0%, #fcfcfc 50%, #f5f5f5 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #f5f5f5 0%, #fcfcfc 50%, #f5f5f5 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f5f5f5', endColorstr='#f5f5f5', GradientType=0);
    /* IE6-9 */
  }
  .products .box .box-title h4 {
    color: #263239;
     margin: 0px auto;
    font-size: 1rem !important;
    transition: all 0.4s ease-in-out;
    display:block;
  }
  .products .box .box-title:after {
    color: #27aae1;
    content: ' ';
    border-bottom: 8px solid #27aae1;
    display: block;
    width: 100%;
    position: absolute;
    bottom: 0px;
  }
  .products .box .box-container .box-price-holder {
    text-align: center;
  }
  .products .box .box-container .box-price-holder .box-price {
    color: #515151;
    font-size: 1.5rem;
    display: block;
    font-weight: 700;
  }
  .products .box .box-container .box-price-holder .box-subtitle {
    color: #ccc;
    display: block;
    font-size: 1.2rem;
  }
  .products .box .box-container .box-list {
    list-style-type: none;
    font-size: 1.3rem;
    text-align: center;
    padding: 0px;
    display: block;
    min-height: 150px;
  }
  .products .box .box-container .box-list li {
    margin: 15px 0px;
    color: #515151;
  }
  .products .box .box-container .box-button-holder {
    text-align: center;
    display:block;
    margin:25px auto;
  }
  .products .box .box-container .box-button-holder .box-button {
    background: #27aae1;
    border: 0px;
    border-radius: 4px;
    padding: 10px 15px;
    font-size: 1.8.rem;
    color: #fff;
  }
  /*color pattern*/
  .products .blue,
  .products .box.blue strong {
    color: #27aae1;
  }
  .products .green,
  .products .box.green strong {
    color: #008000;
  }
  .products .orange,
  .products .box.orange strong {
    color: #FFA500;
  }
  .products .red,
  .products .box.red strong {
    color: #FF0000;
  }
  .products .box.blue .box-title:after {
    border-color: #27aae1;
  }
  .products .box.blue .box-container .box-button-holder .box-button {
    background: #27aae1;
  }
  .products .box.green .box-title:after {
    border-color: #008000;
  }
  .products .box.green .box-container .box-button-holder .box-button {
    background: #008000;
  }
  .products .box.orange .box-title:after {
    border-color: #FFA500;
  }
  .products .box.orange .box-container .box-button-holder .box-button {
    background: #FFA500;
  }
  .products .box.red .box-title:after {
    border-color: #FF0000;
  }
  .products .box.red .box-container .box-button-holder .box-button {
    background: #FF0000;
  }
  .products .box.active {
    padding-bottom: 30px;
    margin-top: 0px;
    margin-bottom: 0px;
  }
  .products .box.active .box-title {
    padding-top: 70px;
  }
  .products {
    height: 300px;
    margin-top: 10px;
    margin-left:20px;
    font-family: Arial;
    display: block;
    height: 100%;
  }
  
  .upload-btn-wrapper {
      position: relative;
      overflow: hidden;
      display: inline-block;
  }
  
  .btn-upload {
      border: 1px solid #0eb2d6;
      color: #0eb2d6;
      background-color: white;
      padding: 8px 30px;
      border-radius: 8px;
      font-size: 20px;
      font-weight: normal;
      cursor:pointer;
  }
  
  .upload-btn-wrapper input[type=file] {
      font-size: 100px;
      position: absolute;
      left: 0;
      top: 0;
      opacity: 0;
  } 
  
  .products .boxempty {
    width: 31%;
    margin: 0px 5px;
    display: inline-block;
    transition: all 0.4s ease-in-out;
    background-color: white;
  }
  .products .boxempty .box-title {
    padding: 2.5rem 0rem;
    text-align: center;
    position: relative;
  }
  .products .boxempty .box-title h4 {
    color: #515151;
    margin: 0px auto;
    font-size: 1rem !important;
    transition: all 0.4s ease-in-out;
    display:block;
  }
  .products .boxempty .box-title:after {
    color: #27aae1;
    content: ' ';
    display: block;
    width: 100%;
    position: absolute;
    bottom: 0px;
  }
  .products .boxempty .box-container .box-price-holder {
    text-align: center;
  }
  .products .boxempty .box-container .box-price-holder .box-price {
    color: #515151;
    font-size: 1.5rem;
    display: block;
    font-weight: 700;
  }
  .products .boxempty .box-container .box-price-holder .box-subtitle {
    color: #ccc;
    display: block;
    font-size: 1.2rem;
  }
  .products .boxempty .box-container .box-list {
    list-style-type: none;
    font-size: 1.3rem;
    text-align: center;
    padding: 0px;
    display: block;
    min-height: 150px;
  }
  .products .boxempty .box-container .box-list li {
    margin: 15px 0px;
    color: #515151;
  }
  .products .boxempty .box-container .box-button-holder {
    text-align: center;
    display:block;
    margin:25px auto;
  }
  .products .boxempty .box-container .box-button-holder .box-button {
    border: 0px;
    border-radius: 4px;
    padding: 10px 15px;
    font-size: 1.8.rem;
    color: #fff;
  }
  
  div.box-title > i {
    margin-left:30px;
  }