.box-confirm{
    display: none;
    opacity: 0;
    position: fixed;
    color:#501704;
    background-color: #e0e0e0ec;
    width: 280px;
    min-height: 280px;
    z-index: 10;
    left: 50%;
    top: 25%;
    transition-duration: 1s;
}
.btn-gray{
    -webkit-filter: grayscale(100%)!important;
    filter: grayscale(100%)!important;
}
.none-gray{
    -webkit-filter: grayscale(0)!important;
    filter: grayscale(0)!important;
}
.eye-activy{
    border:  2px solid #2daa37!important;
    border-bottom: 10px solid #045011!important;
}

:root {
    --x: 1px;
    --y: 1px;
    --boxvoicedisplay: none;
}
.box-voice {
    display: var(--boxvoicedisplay);
    left: var(--x);
    top: var(--y);
    padding: 3px;
    position: absolute;
    z-index:5;
    background-color: #e0e0e0ec;
}
.box-help{
    display: none;
    opacity: 0;
    position: absolute;
    color:#501704;
    background-color: #e0e0e0ec;
    width: 280px;
    min-height: 280px;
    z-index: 10;
    left: 50%;
    top: 21%;
    transition-duration: 1s;
}


 #search-modal .modal-content{
        background-color: #fff0!important;
  }
  .cf:before, .cf:after{
    content:"";
    display:table;
  }

  .cf:after{
    clear:both;
  }

  .cf{
    zoom:1;
  }

  /*-------------------------------------*/

  .form-wrapper {
    display: flex;
      width: 100%;
      padding: 15px;
      background: #444;
      background: rgba(0,0,0, 0.2)!important;
      -moz-border-radius: 10px;
      -webkit-border-radius: 10px;
      border-radius: 10px;
      -moz-box-shadow: 0 1px 1px rgba(0,0,0,.4) inset, 0 1px 0 rgba(255,255,255,.2);
      -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.4) inset, 0 1px 0 rgba(255,255,255,.2);
      box-shadow: 0 1px 1px rgba(0,0,0,.4) inset, 0 1px 0 rgba(255,255,255,.2);
  }

  .form-wrapper input {
      width: 85%;
      height: 40px;
      padding: 10px 5px!important;
      float: left;
      font: bold 15px 'lucida sans', 'trebuchet MS', 'Tahoma';
      border: 0;
      background: #eee;
      -moz-border-radius: 3px 0 0 3px;
      -webkit-border-radius: 3px 0 0 3px;
      border-radius: 3px 0 0 3px;
  }

  .form-wrapper input:focus {
      outline: 0;
      background: #fff;
      -moz-box-shadow: 0 0 2px rgba(0,0,0,.8) inset;
      -webkit-box-shadow: 0 0 2px rgba(0,0,0,.8) inset;
      box-shadow: 0 0 2px rgba(0,0,0,.8) inset;
  }

  .form-wrapper input::-webkit-input-placeholder {
     color: #999;
     font-weight: normal;
     font-style: italic;
  }

  .form-wrapper input:-moz-placeholder {
      color: #999;
      font-weight: normal;
      font-style: italic;
  }

  .form-wrapper input:-ms-input-placeholder {
      color: #999;
      font-weight: normal;
      font-style: italic;
  }

  .form-wrapper button {
      overflow: visible;
      position: relative;
      float: right;
      border: 0;
      padding: 0;
      cursor: pointer;
      height: 40px;
      width: 110px;
      font: bold 15px/40px 'lucida sans', 'trebuchet MS', 'Tahoma';
      color: #fff;
      text-transform: uppercase;
      background: #d83c3c;
      -moz-border-radius: 0 3px 3px 0;
      -webkit-border-radius: 0 3px 3px 0;
      border-radius: 0 3px 3px 0;
      text-shadow: 0 -1px 0 rgba(0, 0 ,0, .3);
  }

  .form-wrapper button:hover{
      background: #e54040;
  }

  .form-wrapper button:active,
  .form-wrapper button:focus{
      background: #c42f2f;
  }

  .form-wrapper button:before {
      content: '';
      position: absolute;
      border-width: 8px 8px 8px 0;
      border-style: solid solid solid none;
      border-color: transparent #d83c3c transparent;
      top: 12px;
      left: -6px;
  }

  .form-wrapper button:hover:before{
      border-right-color: #e54040;
  }

  .form-wrapper button:focus:before{
      border-right-color: #c42f2f;
  }

  .form-wrapper button::-moz-focus-inner {
      border: 0;
      padding: 0;
  }