.header-md {
border-bottom:4px solid #F9A825 !important; position:relative;  
  }
.header-md:before {
  position:absolute; display:block; content:''; border-bottom:4px solid #F9A825 !important; height:100%; width:100%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;
  }

/*.header-md .navbar-nav > li > a { color:#F9A825; font-weight:bold}
*/
.bg-black .nav-primary > ul.nav-main > li:hover > a,
.bg-black .nav-primary > ul.nav-main > li:focus > a,
.bg-black .nav-primary > ul.nav-main > li:active > a,
.bg-black .nav-primary > ul.nav-main > li.active > a {
  background: linear-gradient(to right, #F9A825, #e3b05d)
}
.bg-black {
  background-color: #666666;
}

h3 { color: #333 }

.red { color:#F9A825}
.red:hover { color:#F9A825}

.marquee {background-color:#464646; color:#FFEB75}

.panel .tablethinred .table thead > tr > th {background-color:#F9A825; border-top:2px solid #F9A825;}
.tablethinred tr.panel-heading { color:#ffffff;}
.panel-default .panel-heading {background-color: #F9A825;color:#ffffff;}
.headerdivhr { border-top:1px solid #E2DEBE ; margin:3px 0px}
.headerdivline { color:#E0AEAE}

.panel-default .panel-heading a { color:#F9A825; }

.btn-danger {background-color: #F9A825; border-color: #F9A825;}
.btn-danger:hover,
.btn-danger:focus,
.btn-danger:active,
.btn-danger.active,
.open .dropdown-toggle.btn-danger {
  background-color: #f59210;
  border-color: #f59210;
}

.bg-danger {
  background-color: #F9A825;
}

.text-danger {
  color: #f03f3c;
}
.text-danger-lt {
  color: #c4a13f;
}
.text-danger-lter {
  color: #d7b147;
}
.text-danger-dk {
  color: #a7872c;
}
.text-danger-dker {
  color: #957927;
}

.text-black {
  color: #000;
}

.themecolor { color:#F9A825}
.themecolor2 { color:#000}
.themecolor3 { color:#FBB02F}


.btn-tool.fx.on { background:url(../images/toolicon_fx-on.png) no-repeat 50% 50%; background-size: 30px 30px; background-color:#F9A825; border:#F9A825}
.btn-tool.card.on { background:url(../images/toolicon_card-on.png) no-repeat 50% 50%;background-size: 30px 30px; background-color:#F9A825; border:#F9A825}
.btn-tool.upop.on { background:url(../images/toolicon_upop-on.png) no-repeat 50% 50%;background-size: 30px 30px; background-color:#F9A825; border:#F9A825}

.btn-tool.fx.off { background:url(../images/toolicon_fx-off.png) no-repeat 50% 50%; background-size: 30px 30px; background-color:rgba(0, 0, 0, 0.2); border:#575757}
.btn-tool.card.off { background:url(../images/toolicon_card-off.png) no-repeat 50% 50%; background-size: 30px 30px; background-color:rgba(0, 0, 0, 0.2); border:#575757}
.btn-tool.upop.off { background:url(../images/toolicon_upop-off.png) no-repeat 50% 50%; background-size: 30px 30px; background-color:rgba(0, 0, 0, 0.2); border:#575757}

.closewindow { background:#464646; border-bottom:#F9A825 4px solid; color:#fff; padding:5px; font-size:14px; height:35px}

.slimScrollDiv{
  height:100% !important;
}

/*Login*/

.loginlogo { width:332px; text-align:center; margin:50px auto 20px;}
.loginlogo img { width:330px}

.btnLogin {
  margin-left:12px;
    float:right;
  -moz-box-shadow:inset 0px 1px 0px 0px #f59210;
  -webkit-box-shadow:inset 0px 1px 0px 0px #f59210;
  box-shadow:inset 0px 1px 0px 0px #f59210;
  background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f59210), color-stop(1, #f59210) );
  background:-moz-linear-gradient( center top, #f59210 5%, #f59210 100% );
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f24537', endColorstr='#f59210');
  background-color:#f59210;
  -webkit-border-top-left-radius:5px;
  -moz-border-radius-topleft:5px;
  border-top-left-radius:5px;
  -webkit-border-top-right-radius:5px;
  -moz-border-radius-topright:5px;
  border-top-right-radius:5px;
  -webkit-border-bottom-right-radius:5px;
  -moz-border-radius-bottomright:5px;
  border-bottom-right-radius:5px;
  -webkit-border-bottom-left-radius:5px;
  -moz-border-radius-bottomleft:5px;
  border-bottom-left-radius:5px;
  text-indent:0;
  border:1px solid #f59210;
  display:inline-block;
  color:#ffffff;
  font-family:Arial;
  font-size:14px;
  font-weight:bold;
  font-style:normal;
  height:30px;
  width:80px;
  text-decoration:none;
  text-align:center;
  text-shadow:1px 1px 0px #f59210;
  cursor:pointer;
}
.btnLogin:hover {
  background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f59210), color-stop(1, #f59210) );
  background:-moz-linear-gradient( center top, #f59210 5%, #f24537 100% );
  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f59210', endColorstr='#f59210');
  background-color:#f59210;
}.btnLogin:active {
  position:relative;
  top:1px;}
  


/*table*/
.table_theme_css{
    border-bottom:2px solid #F9A825;

}

.table_theme_css > li > a:hover{
    background-color:#F9A825; font-weight:bold;
   
    color:#ffff;
}
.table_theme_css > li.tab_active > a{
  color:#ffff;
  background: linear-gradient(to right, #F9A825, #e3b05d);
  
}


#bene_table tr:nth-child(even) {background-color: #f2f2f2;}



#bene_table tr.header, #bene_table tbody > tr:hover td{
   
    background-color: #f2c67f !important
}
#bene_table thead,#bene_search_table thead{
    /*background-color:#F9A825; border-top:2px solid #F9A825;*/
     color:#0a0000;

}


.select_file th{
    background-color:#f59210 !important;
    color:#ffff !important;
}

/*CNY & Global remit*/
.col-sm-9 > hr,.panel-body > hr {
  background-color: #F9A825 !important;
}
.toggle {
  display:inline-block;
   position: relative;
  
  top:-8px;
   width: 100px;
   height: 30px;
   padding: 3px;
   margin: auto;
   border-radius: 50px;
   cursor: pointer;
}
.toggle-input,.portal-input {
   position: absolute;
   top: 0;
   left: 0;
   opacity: 0;
}
.toggle-label {
   position: relative;
   display: block;
   height: inherit;
   font-size: 12px;
   background: red;
   border-radius: inherit;
    width:100px;
   box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12), inset 0 0 3px
   rgba(0, 0, 0, 0.15);
}
.toggle-label:before,
.toggle-label:after {
   position: absolute;
   top: 50%;
   color: black;
   margin-top: -.5em;
   line-height: 1;
}
.toggle-label:before {
   content: attr(data-off);
   right: 11px;
   color: #fff;
   text-shadow: 0 1px rgba(255, 255, 255, 0.5);
}
.toggle-label:after {
   content: attr(data-on);
   left: 11px;
   color: #fff;
   text-shadow: 0 1px rgba(0, 0, 0, 0.2);
   opacity: 0;
}

.toggle-input:checked~.toggle-label {
  width:100px;
   background: #f59210;
}

.portal-input:checked~.toggle-label {
  width:100px;
   background: #f59210;
}

.toggle-input:checked~.toggle-label:before,.portal-input:checked~.toggle-label:before {
   opacity: 0;
}
.toggle-input:checked~.toggle-label:after,.portal-input:checked~.toggle-label:after {
   opacity: 1;
}
.toggle-handle {
   position: absolute;
   top: 6px;
   left: 6px;
   width: 24px;
   height: 24px;
   background: linear-gradient(to bottom, #FFFFFF 40%, #f0f0f0);
   border-radius: 50%;
}
.toggle-handle:before {
   position: absolute;
   top: 50%;
   left: 50%;
   margin: -6px 0 0 -6px;
   width: 16px;
   height: 16px;
}
.toggle-input:checked~.toggle-handle,.portal-input:checked~.toggle-handle {
   left: 75px;
   box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
}

/* Transition*/
.toggle-label,
.toggle-handle {
   transition: All 0.3s ease;
   -webkit-transition: All 0.3s ease;
   -moz-transition: All 0.3s ease;
   -o-transition: All 0.3s ease;
}

.desc_tab{
  min-width:250px;
  max-width:400px;
  min-height:100px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  font-size:17px;
  font-weight:bold;
  background-color:#fff;
  margin:10px;
  border-radius: 15px;
  padding:10px;
    
}



.fx_stepline,.stepline {
      position: absolute;
      right: -50%;
      left: 50%;
      width: 100%;
      height: 8px;
      background-color: #cbc4ae;
      /*z-index: -1;*/
    
  }
.fx_active-startline, .active-startline {
      position: absolute;
   
      left: 15px;
      width: 100%;
      height: 8px;
      background:linear-gradient( #F9A825, #e3b05d);
      /*z-index: -1;*/
      border-radius:12px;
    
  }

.fx_step-button{
    min-width:140px !important;
    height:45px !important;
    border-radius:8px !important;
    font-size:15px;
    color:#ffffff;
}

.fx_endline , .endline{
      position: absolute;
      right: 15px;
      width: 100%;
      height: 8px;
      background-color: #cbc4ae;
      /*z-index: -1;*/
      border-radius:12px;
    
}

.active-icon {
      border: 8px solid #F9A825 !important;
      background-color: #fff !important;
  }
  
.stepicon {
      position: absolute;
      width: 30px;
      height: 30px;
      border: 8px solid #F9A825;
      background-color: #fefefe;
      border-radius: 50%;
      z-index: 1;
    
}

.active-line {
      background:linear-gradient( #F9A825, #e3b05d);
} 

.fx-active-title, .active-title {
    background:linear-gradient( #F9A825, #e3b05d);
    color: #ffffff;
    margin-top: -50px;
    border-radius:12px;
    
}



.step_progress,.bene_progress {
    height: 20px;
    background-color: #f4e3bf;
    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
    overflow: visible;
    border-radius: 20px;
    margin: 10px 20px;
}


.step_progress .progress-bar,.bene_progress .bene_progress-bar  {
    position: relative;
    float: left;
    width: 0;
    height: 100%;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    text-align: center;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .15);
    -webkit-transition: width .6s ease;
    -o-transition: width .6s ease;
    transition: width .6s ease;
    border-radius: 20px;
    background-color: #F9A825;
}


.progress-value,.bene_progress-value {
    
   
    border-radius:15px;
    display: block;
    height: 42px;
    line-height: 38px;
    width: 180px;
    text-align: center;
    font-size: 14px;
    
    padding: 2px;
    /*background-color: #d80029;*/
    background:linear-gradient( #F9A825, #e3b05d);
    color: #ffffff;
    /*position: absolute;*/
    margin:auto;

   
}



@keyframes progress-bar-stripes {
    from {
        background-position: 35px 0;
    }
    to {
        background-position: 0 0;
    }
}

@keyframes bene_progress-bar-stripes {
    from {
        background-position: 35px 0;
    }
    to {
        background-position: 0 0;
    }
}

.progress-bar-striped, .progress-striped .progress-bar,.bene_progress-bar-striped, .bene_progress-striped .bene_progress-bar {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, .15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, .15) 75%, transparent 75%, transparent);
    -webkit-background-size: 35px 35px;
    background-size: 35px 35px;
}

.progress-bar.active, .progress.active .progress-bar,.bene_progress-bar.active, .bene_progress.active .bene_progress-bar  {
    -webkit-animation: progress-bar-stripes 2s linear infinite;
    -o-animation: progress-bar-stripes 2s linear infinite;
    animation: progress-bar-stripes 2s linear infinite;
    animation-duration: 2s;
    animation-timing-function: linear;
    animation-delay: 0s;
    animation-iteration-count: infinite;
    animation-direction: normal;
    animation-fill-mode: none;
    animation-play-state: running;
    animation-name: progress-bar-stripes;
}

.btn-file{
        min-width:100px !important;
        min-height:30px !important;
        border-radius:8px !important;
        background-color: #F9A825 !important;
        border-color: #F9A825 !important;
        font-size:14px;
        color:#ffffff !important;

}

.btn-file:hover{
       
        background-color: #f59210 !important;
        border-color: #f59210 !important;
        color:#ffffff !important;

}

.remit-button{
        min-width:240px !important;
        height:45px !important;
        margin:20 auto !important;
        line-height:40px;
        border-radius:8px !important;
        font-size:20px;
        color:#ffffff !important;
        background-color:#F9A825;
}

.glyphicon-chevron-left,.glyphicon-chevron-right{
  color:#F9A825;
}

.fx_add_account-button{
    min-width:170px !important;
    height:45px !important;
    margin:10 auto !important;
    line-height:40px;
    border-radius:8px !important;
    font-size:14px;
    color:#ffffff !important;
    background-color:#F9A825 !important;
}


.fx_add_account-button:hover{
    color:#ffffff !important;
    background-color:#f59210 !important;
}


.fx_account-button{
    width:170px !important;
    height:45px !important;
    margin:10 auto !important;
    line-height:40px;
    border-radius:8px !important;
    font-size:14px;
    color:#ffffff;

  }


.step-input-currency{
    min-width:55px;
    /*background-color: #e8e5e5 !important;*/
    color:#000000;
    font-size:16px;
    border-radius:5px;
    text-align:center;
    height:45px;
    padding-right:17px;
    overflow:hidden;
  }


.step-input-typing{
    min-width:55px;
    
    color:#000000;
    font-size:16px;
    border-radius:5px;
    text-align:center;
    height:45px;
  }


#payer_account_modal .panel-body{
  padding:10px 15px !important;
}

@media screen and (max-width: 500px)  {
              
               
    .preview_div .col-xs-6{

            width:100%;
    }

    .bank_details_priority .col-xs-6 .col-xs-12{
        padding-left:0px;
    }
              
}


.preview_div label{
    /*font-size: 14px !important;*/
    word-wrap:break-word; 
    word-break:break-word !important;
    
}


/*dashboard*/

.panClip .circular,.panClip .clipBox .clipLeft,
.panClip .clipBox .clipRight {
    
    background-color: #f59210;
    
}


/* 定义抖动动画 */ 
@keyframes shake { 0% { transform: translate(0, 0); } 25% { transform: translate(2px, 0); } 50% { transform: translate(0, 2px); } 75% { transform: translate(-2px, 0); } 100% { transform: translate(0, -2px); } }

/* 为数字元素添加抖动动画 */ 
.shake { animation: shake 300ms ease-in-out; color: red}


.code-box {
      display: flex;
      justify-content: space-between;
      width: 330px;
      margin: 0px auto;
      position: relative;
    }

    .code-box .code-item {
      width: 50px;
      height: 50px;
      background-color: #fff;
      border-radius: 5px 5px;
      text-align: center;
      line-height: 50px;
      font-size: 24px;
      color: #000;
      font-weight: bold;
      border: 1px solid rgb(209, 209, 209);
      transition: border 0.3s;
      box-sizing: border-box;
    }

    .code-box .code-input {
      position: absolute;
      width: 100%;
      height: 100%;
      opacity: 0;
    }

    .code-box .active {
      border: 3px solid #1E80FF !important;
    }

      .toggle {
        display:inline-block;
         position: relative;
        
        top:-8px;
         width: 100px;
         height: 30px;
         padding: 3px;
         margin: auto;
         border-radius: 50px;
         cursor: pointer;
      }
      .toggle-input {
         position: absolute;
         top: 0;
         left: 0;
         opacity: 0;
      }
      .toggle-label {
         position: relative;
         display: block;
         height: inherit;
         font-size: 12px;
         background: red;
         border-radius: inherit;
         box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.12), inset 0 0 3px
         rgba(0, 0, 0, 0.15);
      }
      .toggle-label:before,
      .toggle-label:after {
         position: absolute;
         top: 50%;
         color: black;
         margin-top: -.5em;
         line-height: 1;
      }
      .toggle-label:before {
         content: attr(data-off);
         right: 11px;
         color: #fff;
         text-shadow: 0 1px rgba(255, 255, 255, 0.5);
      }
      .toggle-label:after {
         content: attr(data-on);
         left: 11px;
         color: #fff;
         text-shadow: 0 1px rgba(0, 0, 0, 0.2);
         opacity: 0;
      }
      .toggle-input:checked~.toggle-label {
         background: green;
      }
      .toggle-input:checked~.toggle-label:before {
         opacity: 0;
      }
      .toggle-input:checked~.toggle-label:after {
         opacity: 1;
      }
      .toggle-handle {
         position: absolute;
         top: 6px;
         left: 6px;
         width: 24px;
         height: 24px;
         background: linear-gradient(to bottom, #FFFFFF 40%, #f0f0f0);
         border-radius: 50%;
      }
      .toggle-handle:before {
         position: absolute;
         top: 50%;
         left: 50%;
         margin: -6px 0 0 -6px;
         width: 16px;
         height: 16px;
      }
      .toggle-input:checked~.toggle-handle {
/*         left: 69px;*/
         box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2);
      }

      /* Transition*/
      .toggle-label,
      .toggle-handle {
         transition: All 0.3s ease;
         -webkit-transition: All 0.3s ease;
         -moz-transition: All 0.3s ease;
         -o-transition: All 0.3s ease;
      }


      
.search-typing{
    min-width:70px;
    border-radius:5px;
    text-align:left;
    height:35px;
    line-height:35px;
    font-size:14px;
    padding-left:5px;
   
  }

  .search_table  div{
  
    padding-bottom:5px;
  }

  .search_table  div > label{
   margin-left:15px;
  }

  .input-group-addon{
    
    min-width:20px;
  }
  .search_table .row{
    min-width:230px;
  }


  .input-group{
    margin-left:15px;
    margin-right:15px;
  }


  .dropdown_ul > li{
    margin:8px;
   
    width: auto

  }

  .panel-heading .nav-tabs{
    height: auto !important;
  }

.rate-tabs > li.active > a, .rate-tabs > li.active > a:hover, .rate-tabs > li.active > a:focus{
    font-weight: bold;
    color:#ffffff;
    background-color: #F9A825;
}
.rate-tabs > li > a,.rate-tabs > li > a:hover, .rate-tabs > li > a:focus{
    color:#ffffff;
    background-color: #edbe70;
}





div:where(.swal2-container) .swal2-html-container{
    font-size:1.8em !important;
}

.swal2-success-ring{
border: 0.35em solid #F9A825 !important;

}

div:where(.swal2-icon).swal2-success{
    border-color: #F9A825 !important;
    color: #F9A825 !important;
}

div:where(.swal2-icon).swal2-success [class^=swal2-success-line]{
    background-color: #F9A825 !important;
}

div:where(.swal2-icon).swal2-warning{
    border-color: #F9A825 !important;
    color: #F9A825 !important;
}

.swal2-icon-show{
	margin: 10px auto !important;
}

div:where(.swal2-container) div:where(.swal2-popup){
    width: 60em !important;
    border-radius: 30px !important;
    background: #FFFFFF;
    box-shadow: 0px 1px 10px -5px #00000040;

    
}

.swal2-modal .swal2-title{
  font-size: 20px !important;
}


.swal2-confirm{
  width: 180px;
  height: 48px;
  padding: 5px 16px 5px 16px;
  gap: 20px;
  border-radius: 100px;
  background: #F9A825;
  border: 0;
  color:#FFFFFF;
  font-size: 1.8em;
}

.swal2-cancel{
  width: 180px;
  height: 48px;
  padding: 5px 16px 5px 16px;
  gap: 20px;
  border-radius: 100px;
  
  border: 0;
  color:#FFFFFF;
  font-size: 1.8em;
}

body.swal2-height-auto{
  height: 100% !important;
}

body.swal2-shown:not(.swal2-no-backdrop):not(.swal2-toast-shown){
  height: 100% !important;
}