/* The spinner */
.loader {
  border: 16px solid #f3f3f3; /* Light grey */
  border-top: 16px solid #3498db; /* Blue */
  border-radius: 50%;
  width: 120px;
  height: 120px;
  animation: spin 2s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

@keyframes spinner {
    to {transform: rotate(360deg);}
  }
  
  .spinner,
  .spinner:before {
    width: 20px;
    height: 20px;
    box-sizing: border-box;
  }
  
  .spinner:before {
    content: '';
    display: block;
    border-radius: 50%;
    border: 2px solid #ccc;
    border-top-color: #333;
    animation: spinner .6s linear infinite;
  }
  
  .spinner-absolute {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -10px;
    margin-left: -10px;
  }
  
  /* Animations */
  
  .spinner-add,
  .spinner-remove {
    animation-fill-mode: both;
    animation-duration: .4s;
  }
  
  .spinner-add {
    animation-name: spinner-add;
  }
  
  @keyframes spinner-add {
    from {transform: scale(0);}
    to {transform: scale(1);}
  }
  
  .spinner-remove {
    animation-name: spinner-remove;
  }
  
  @keyframes spinner-remove {
    to {transform: scale(0);}
  }
  
  #hwcc_image_gallery ul {
    list-style-type: none !important;
    margin-left: 0 !important;

  }
  #hwcc_image_gallery li {
    list-style-type: none !important;
    float: left !important;
    padding-right: 10px !important; 
  }