/*  Plugin: prettyTag (Auto Colored Tags)
 *   Frameworks: jQuery 3.3.1 
 *   Author: Asif Mughal
 *   GitHub: https://github.com/CodeHimBlog
 *   URL: https://www.codehim.com
 *   License: MIT License
 *   Copyright (c) 2018 - Asif Mughal
 */
/* File: prettytag.css*/

/*Style for An Unordered list */
.cloud-tags{
   list-style: none; 
   border-bottom: 1px dotted #ccc;
   padding: 13px;
 }

/* list item into cloud tags */
.cloud-tags li {
   display: inline-block;
   margin: 0;
   padding: 0;
}

/* style of tag with anchor link */
.cloud-tags li a{
   display: inline-block;
   padding: 8px;
   text-shadow: 1px 0.01px rgba(0, 0, 0, 0.15);
   border-radius: 6px;
   margin-bottom: 2px;
   text-decoration: none;
   color: #fff;
   transition: .2s;
   outline: 0;
   margin: 5px;
}

/* hover looking for cloud tags*/
.cloud-tags li a:hover{
   transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
   transition: .2s;
  -webkit-transition: .2s;
  -moz-transition: .2s;
   opacity: 1;
  -webkit-opacity: 1;
  -moz-opacity: 1;
}

/*tag close button (for input tagging mode)*/
.cloud-tags span{
  padding: 0 5px;
  cursor: pointer;

}
/* tag close button hover style */
.cloud-tags span:hover{
  background: #f2f2f2;
}

/* area where new tags show when user enter tag  name into input field*/
.show-input-tags {
   position: relative;
}

/* Input for tags */
.codehim-input-tags{
   padding: 10px;
   border: 1px solid #ccc;
   margin: 0 10px;
   width: auto;
   box-sizing: border-box;
}