.counter{
    color: #f27f21;
    font-family: 'Open Sans', sans-serif;
    text-align: center;
    height: 190px;
    width: 190px;
    padding: 30px 25px 25px;
    margin: 0 auto;
    border: 3px solid #f27f21;
    border-radius: 20px 20px;
    position: relative;
    z-index: 1;
  }
  .counter:before,
  .counter:after{
    content: "";
    background: #f3f3f3;
    border-radius: 20px;
    box-shadow: 4px 4px 2px rgba(0,0,0,0.2);
    position: absolute;
    left: 15px;
    top: 15px;
    bottom: 15px;
    right: 15px;
    z-index: -1;
  }
  .counter:after{
    background: transparent;
    width: 100px;
    height: 100px;
    border: 15px solid #f27f21;
    border-top: none;
    border-right: none;
    border-radius: 0 0 0 20px;
    box-shadow: none;
    top: auto;
    left: -10px;
    bottom: -10px;
    right: auto;
  }
  .counter .counter-icon{
    font-size: 35px;
    line-height: 35px;
    margin: 0 0 15px;
    transition: all 0.3s ease 0s;
  }
  .counter:hover .counter-icon{ transform: rotateY(360deg); }
  .counter .counter-value{
    color: #555;
    font-size: 30px;
    font-weight: 600;
    line-height: 20px;
    margin: 0 0 20px;
    display: block;
    transition: all 0.3s ease 0s;
  }
  .counter:hover .counter-value{ text-shadow: 2px 2px 0 #d1d8e0; }
  .counter h3{
    font-size: 17px;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0 0 15px;
  }
  .counter.blue{
    color: #5B9BD5;
    border-color: #5B9BD5;
  }
  .counter.blue:after{
    border-bottom-color: #5B9BD5;
    border-left-color: #5B9BD5;
  }
  .counter.orange{
    color: #ED7D31;
    border-color: #ED7D31;
  }
  .counter.orange:after{
    border-bottom-color: #ED7D31;
    border-left-color: #ED7D31;
  }
  .counter.yellow{
    color: #FFC000;
    border-color: #FFC000;
  }
  .counter.yellow:after{
    border-bottom-color: #FFC000;
    border-left-color: #FFC000;
  }
  .counter.green{
    color: #70AD47;
    border-color: #70AD47;
  }
  .counter.green:after{
    border-bottom-color: #70AD47;
    border-left-color: #70AD47;
  }
  .counter.pink{
    color: #F6B59A;
    border-color: #F6B59A;
  }
  .counter.pink:after{
    border-bottom-color: #F6B59A;
    border-left-color: #F6B59A;
  }
  .counter.gray{
    color: #ACACAC;
    border-color: #ACACAC;
  }
  .counter.gray:after{
    border-bottom-color: #ACACAC;
    border-left-color: #ACACAC;
  }
  @media screen and (max-width:990px){
    .counter{ margin-bottom: 40px; }
  }