/*start image editor*/    
    /*webkit range*/
      input[type=range]{
      margin-top:-1px;
    -webkit-appearance: none;
}

input[type=range]::-webkit-slider-runnable-track {
    width: 160px;
    height: 1px;
    background: #fff;
    border: none;
    margin-top:0;
}

input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
     border: 2px solid white;
    height: 14px;
    width: 14px;
    border-radius: 50%;
    background: #000000;
    margin-top: -7px;
}

input[type=range]:focus {
    outline: none;
}

input[type=range]:focus::-webkit-slider-runnable-track {
    background: #fff;
}
/*Firefox range*/
input[type=range]{
    /* fix for FF unable to apply focus style bug  */
    width: 160px;
    -webkit-appearance: none;
}
@-moz-document url-prefix() {
    input[type=range]{
        margin-top: 12px;
    display:inline-block;
    float:left;
    }
}

input[type=range]::-moz-range-track {
    width: 160px;
    height: 1px;
    background: #ffffff;
    border: none;
}

input[type=range]::-moz-range-thumb {
    border: 2px solid white;
    height: 14px;
    width: 14px;
    border-radius: 50%;
    background: #000000;
}
input[type=range]:focus::-moz-range-track {
    background: #fff;
}
/*image editor*/
      .image-editor .cropit-image-preview {
        background-color: #f8f8f8;
        background-size: cover;
        cursor: move;
        width: 292px;
        height: 292px; 
        /*border-radius:  50%; */
      }

      .image-editor .cropit-image-background {
        opacity: .2;
        cursor: auto;
      }

      .image-editor .image-size-label {
        float:left;
        display:inline-block;
        height: 20px;
        line-height: 20px;
        margin:0px;
      }
      .image-editor .image-size-label i {
         display:inline-block;
         line-height: 43px;
      }
      .image-editor .cropit-image-input {
      position:absolute;
      z-index:2;
        display: inline-block !important;
        width: 357px !important;
        height: 57px !important;
        opacity: 0 !important;
         overflow: hidden !important;
         cursor:pointer;
         background:red;
         font-size:30px;
         top:-20px;
         left:-200px;
      }
      .image-editor .upload, #save_profile_image, #save_cover_image {
      position:absolute;
      left:10px; 
      bottom:10px; 
      z-index:10;
      display: inline-block !important;
    width: auto;
    height: 35px;
    overflow: hidden !important;
    margin:2px 0px !important;
    padding: 0 15px;
    font-size: 16px;
    line-height: 35px;
    background: transparent;
    color:white;
    border: 1px solid white;
    border-radius:  35px; 
    transition: all 0.4s ease; 
    }
    .image-editor .upload:hover, #save_profile_image:hover, #save_cover_image:hover {
    background: #c82627;
    }
    #logo_s,#logo_m,#logo_l, #logo_frame, #logo_toggle, #cover_toggle {
    border:1px solid white; 
    width:25px; 
    height:25px;
     line-height:25px;
      text-align:center; 
      color:white; 
      cursor:pointer; 
      float:left;
      border-radius:  50%; 
      margin-bottom:10px;
      background: transparent;
      transition: all 0.4s ease; 
    }
    #logo_toggle, #cover_toggle {
    background: transparent url(../../admin/images/icons/visible.png) no-repeat center center; 
    }
    
    #logo_s:hover,#logo_m:hover,#logo_l:hover, #logo_frame:hover { 
    background: #c82627;
    opacity:1;
    }
    #logo_toggle:hover, #cover_toggle:hover {
    background: #c82627 url(../../admin/images/icons/visible.png) no-repeat center center; 
    opacity:1;
    }
    .header_content_align{
     float:left; 
     margin:10px 0px; 
     margin-top:0px; 
     color: #777; 
     font-size:25px; 
     margin-left:20px;
    }
     .header_content_align i {
      transition: all 0.4s ease; 
     }
      .header_content_align i:hover {
        color:#c82627;
      }