.text-primary{
    color: var(--primary-color) !important;
}

div.error{
    color:var(--primary-color) !important;
    font-size: .7rem;
}

::placeholder {
    color: rgb(148, 147, 147);
    opacity: 1; /* Firefox */
  }
  
  ::-ms-input-placeholder { /* Edge 12 -18 */
    color: rgb(148, 147, 147);
  }

  .fa-angles-right, .fa-angle-right{
    color: var(--primary-color) !important;
  }

  .banner-inner-area {
 
    padding: 50px 0;
}


 
#carousel input[type="radio"][id^="cb"] {
  display: none;
}

#carousel label {
  
  padding: 5px;
  display: block;
  position: relative;
  margin: 10px;
  cursor: pointer;
}
#character{
  opacity: 0;
}

#carousel label:before {
  background-color: white;
  color: white;
  content: " ";
  display: block;
  border-radius: 50%;
  
  position: absolute;
  top: -5px;
  left: -5px;
  width: 25px;
  height: 25px;
  text-align: center;
  line-height: 28px;
  transition-duration: 0.4s;
  transform: scale(0);
  z-index: 100;
}

#carousel label img {
  height: 60px;
  width: auto;
  transition-duration: 0.2s;
  transform-origin: 50% 50%;
  filter: brightness(55%);
}



#carousel :checked + label {
  border-color: #ddd;
}

#carousel :checked + label:before {
  content: "✓";
  background-color: #F82296;
  transform: scale(1.1);
 
}

#carousel :checked + label img {
  transform: scale(1.2);
  box-shadow: 0 0 5px #000;
  z-index: -1;
  filter: brightness(100%);
}

label{
  color: #979797;
}

::placeholder {
  color: #ababab !important;
  opacity: 1; /* Firefox */
}

::-ms-input-placeholder { /* Edge 12 -18 */
  color: #ababab  !important;
}

/* radio button */

div.options > label > input {
  visibility: hidden;
}

div.options > label {
  display: block;
  margin: 0 0 0 -10px;
  padding: 0 0 20px 0;  
  height: 20px;
  width: 150px;
  
}

div.options > label > img {
  display: inline-block;
  padding: 0px;
  height:30px;
  width:30px;
  background: none;
}

div.options > label > input:checked +img {  
  background: url(http://cdn1.iconfinder.com/data/icons/onebit/PNG/onebit_34.png);
  background-repeat: no-repeat;
  background-position:center center;
  background-size:30px 30px;
}

/* <label title="item3">
        <input type="radio" name="foo" value="2" />
        Item 3
        <img />
    </label> */
