/* here you can put your own css to customize and override the theme */
button.counter:after {
  position: absolute;
  content:  attr(data-counter);
  padding: 5px 8px;
  margin: -20px 0 0 0px;
  line-height: 100%;
  border: 2px #fff solid;
  border-radius: 60px;
  background: #00c09e;
  transition:         0.1s linear;
  -o-transition:      0.1s linear;
  -ms-transition:     0.1s linear;
  -moz-transition:    0.1s linear;
  -webkit-transition: 0.1s linear;
  opacity: 0;
}

button.counter.selected:after 
{
    opacity: 1;
}

.tooltip.in
{
    opacity: 1;
    text-decoration:none;
    visibility: visible;
    overflow: visible;
    display: inline;
}

.tooltip-inner  {
    color: #FFFFFF;
    background: #4B8DF8;
    border: 0px solid #4B8DF8;
}

.tooltip-top {
    background: #4B8DF8;
    border-top: 1px solid #4B8DF8;
    border-right: 1px solid #4B8DF8;
}

//cropper
body {
  background-color: #fcfcfc;
}

.avatar-view {
  display: block;
  margin: 15% auto 5%;
  height: 220px;
  width: 220px;
  border: 3px solid #fff;
  border-radius: 5px;
  box-shadow: 0 0 5px rgba(0,0,0,.15);
  cursor: pointer;
  overflow: hidden;
}

.avatar-view img {
  width: 100%;
}

.avatar-body {
  padding-right: 15px;
  padding-left: 15px;
}

.avatar-upload {
  overflow: hidden;
}

.avatar-upload label {
  display: block;
  float: left;
  clear: left;
  width: 100px;
}

.avatar-upload input {
  display: block;
  margin-left: 110px;
}

.avatar-alert {
  margin-top: 10px;
  margin-bottom: 10px;
}

.avatar-wrapper {
  height: 600px;
  width: 100%;
  margin-top: 15px;
  box-shadow: inset 0 0 5px rgba(0,0,0,.25);
  background-color: #fcfcfc;
  overflow: hidden;
}

.avatar-wrapper img {
  display: block;
  height: auto;
  max-width: 100%;
}

.avatar-preview {
  float: left;
  margin-top: 15px;
  margin-right: 15px;
  border: 1px solid #eee;
  border-radius: 4px;
  background-color: #fff;
  overflow: hidden;
}

.avatar-preview:hover {
  border-color: #ccf;
  box-shadow: 0 0 5px rgba(0,0,0,.15);
}

.avatar-preview img {
  width: 100%;
}

.preview-lg {
  height: 184px;
  width: 184px;
  margin-top: 15px;
}

.preview-md {
  height: 100px;
  width: 100px;
  border-radius: 50% !important;
}

.preview-sm {
  height: 50px;
  width: 50px;
  
}

@media (min-width: 992px) {
  .avatar-preview {
    float: none;
  }
}

.avatar-btns {
  margin-top: 30px;
  margin-bottom: 15px;
}

.avatar-btns .btn-group {
  margin-right: 5px;
}

.loading {
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: #fff url("../img/loading.gif") no-repeat center center;
  opacity: .75;
  filter: alpha(opacity=75);
  z-index: 20140628;
}


.btn.customcolor {
  color: #333333;
  text-shadow: none;  
  background-color: #e5e5e5;
}
.btn.customcolor:hover, 
.btn.customcolor:focus, 
.btn.customcolor:active,
.btn.customcolor.active,
.btn.customcolor[disabled],
.btn.customcolor.disabled {  
  background-color: #0362fd !important;
  color: #fff !important;
  outline: none !important;
}

.btn-group .btn.customcolor.dropdown-toggle {
  background-color: #4d90fe !important;
}
.btn-group .btn.customcolor:hover, 
.btn-group .btn.customcolor:focus, 
.btn-group .btn.customcolor:active, 
.btn-group .btn.customcolor.active, 
.btn-group .btn.customcolor.disabled,
.btn-group .btn.customcolor[disabled] { 
  background-color: #0362fd !important;
  color: #fff !important;
  outline: none !important;
}