.cf-course-circle {
    display: inline-block;
    position: relative;
    text-align: center;
  }
  .cf-course-circle-cancel {
    display: inline-block;
    position: relative;
    text-align: center;
  }
  .cf-course-com-itop i{
    font-size: 1em !important;
    color: #ffffff !important;
  }
  
  .cf-course-circle canvas {
    vertical-align: top;
    height: 30px !important;
    width: 30px !important;
  }
  .cf-course-circle-cancel canvas {
    vertical-align: top;
    height: 30px !important;
    width: 30px !important;
  }
  .cf-course-circle-cancel canvas {
    height: 68px !important;
    width: 68px !important;
  }
  

  .cf-course-circle strong {
    position: absolute !important;
    top: 8px !important;
    left: 0 !important;
    width: 100% !important;
    text-align: center !important;
    color: #ffffff !important;
    font-size: 0.5em !important;
  }
  .cf-course-circle-cancel strong {
    position: absolute !important;
    top: 8px !important;
    left: 0 !important;
    width: 100% !important;
    text-align: center !important;
    color: #ffffff !important;
    font-size: 0.5em !important;
  }
  .cf-course-circle-cancel strong {
    top: 21px !important;
    font-size: 0.8em !important;
  } 
  
  .cf-course-circle strong i {
  font-weight: normal !important;
  font-size: 1em !important;
  color:  #ffffff !important;
  }
  .cf-course-circle-cancel strong i {
    font-weight: normal !important;
    font-size: 1em !important;
    color:  #ffffff !important;
    }
    
  .cf-course-circle-cancel strong a {
    font-size: 2em !important;
    }
    .cf-course-circle-cancel strong  i {
      font-size: 1.2em !important;
      font-weight: bold !important;
      color:  #ffffff !important;
      }
  
  .cf-course-circle span {
    display: block !important;
    color: #aaa !important;
    margin-top: 12px !important;
  }
  .cf-course-circle-cancel span {
    display: block !important;
    color: #aaa !important;
    margin-top: 12px !important;
  }
  @media only screen and (  min-width:500px )
  {
    .cf-course-circle canvas {
      height: 48px !important;
      width: 48px !important;
    }
    .cf-course-circle-cancel canvas {
      height: 48px !important;
      width: 48px !important;
    }
    
    .cf-course-circle strong {
      top: 15px !important;
      font-size: 0.7em !important;
    }
    .cf-course-circle-cancel strong {
      top: 15px !important;
      font-size: 0.7em !important;
    }
    .cf-course-circle-cancel canvas {
      height: 91px !important;
      width: 91px !important;
    }
    
    .cf-course-circle-cancel strong {
      top: 47px !important;
      font-size: 0.7em !important;
    } 
  
  }