/*Base on Eric Meyer Css Reset  */

 /**
 * Initialization all html tag default value
 */

 div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
   margin: 0;
   padding: 0;
   border: 0;
   vertical-align: baseline;
 }

 /* Initialization tag
   ========================================================================== */

 /**
 * HTML5 display-role reset for older browsers
 */

 article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
   display: block;
 }

 html, body {
   margin: 0;
   padding: 0;
   /* height: 100%; */
   /* overflow-x: hidden; */
 }

 /**
 * setting page default font siez
 * font-size: 62.5%; -->  10 ÷ 16 × 100% = 62.5%
 */

 html {
   font-size: 62.5%;
   -ms-text-size-adjust: 100%;
   -webkit-text-size-adjust: 100%;
 }

 body {
   font-size: 13px;
   font-size: 1.3rem;
   color: #333;
   line-height: 1.6;
   font-style: normal;
   font-weight: 400;
   font-family: Microsoft Ya Hei, '微软雅黑', tahoma, arial, 'Hiragino Sans GB', sans-serif;
   background: #f7f7f7;
 }

 ol, ul {
   list-style: none;
 }

 blockquote, q {
   quotes: none;
 }

 blockquote:before, blockquote:after, q:before, q:after {
   content: '';
   content: none;
 }

 table {
   border-collapse: collapse;
   border-spacing: 0;
 }

 hr {
   height: 0;
 }

 /* Embedded content
   ========================================================================== */

 img, embed, object {
   display: block;
   max-width: 100%;
   height: auto;
   border: 0;
 }

 svg:not(:root) {
   overflow: hidden;
 }

 /* Forms
   ========================================================================== */

 input, select {
   vertical-align: middle;
 }

 input, button, textarea, select, optgroup, option {
   font-family: inherit;
   font-size: inherit;
   font-style: inherit;
   font-weight: inherit;
 }

 button, input, optgroup, select, textarea {
   margin: 0;
 }

 input[type="submit"], input[type="radio"], input[type="checkbox"], input[type="button"], input[type="reset"] {
   cursor: pointer;
 }

 input[type="radio"], input[type="checkbox"] {
   padding: 0;
 }

 button, select {
   cursor: pointer;
 }

 /* Links
   ========================================================================== */

 a {
   text-decoration: none;
   background-color: transparent;
 }

 a:active, a:hover {
   outline: 0;
 }

 /* lists
   ========================================================================== */

 /**
 * clear ol, ul list style
 */

 ul, li, ol {
   list-style: none;
 }

 /* box-sizing
   ========================================================================== */

 /**
 * clear all box-sizing setting
 */

 * {
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
 }

 *:before, *:after {
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
 }

 /* datepicker reset */

 .ui-datepicker {
   width: 100%;
 }

 .ui-widget.ui-widget-content {
   border: 0;
 }

 .ui-widget-header, .ui-widget-content .ui-state-default {
   border: 0;
   background: none;
 }

 .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {
   background: #ff5f02;
 }

 .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
   background: #e4f0f4;
 }

 .ui-datepicker-prev span, .ui-datepicker-next span {
   background-image: none !important;
   font-weight: bold;
 }

 .ui-datepicker-prev:before, .ui-datepicker-next:before {
   position: absolute;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   display: flex;
   font-weight: normal;
   align-items: center;
   justify-content: center;
   color: #0071bd;
   width: 2.8em;
   height: 2.8em;
 }

 /* .ui-datepicker-prev:before {
   content: "<";
 }

 .ui-datepicker-next:before {
   content: ">";
 } */

 .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
   margin-top: -8px;
 }

 .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next, .ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span {
   width: 2.8em;
   height: 2.8em;
 }

 .ui-datepicker .ui-datepicker-prev span {
   background-image: url(../images/history_pagination_pre.png) !important;
   background-position: 0px 0px !important;
   /* margin-top: -15px; */
   top: 40%;
 }

 .ui-datepicker .ui-datepicker-next span {
   background-image: url(../images/history_pagination_next.png) !important;
   background-position: 0px 0px !important;
   /* margin-top: -15px; */
   top: 40%;
 }

 .ui-datepicker td span, .ui-datepicker td a {
   text-align: center;
 }

 /*boat*/

 .bounceInRight {
   -webkit-animation-name: bounceInRight;
   animation-name: bounceInRight;
   -webkit-animation-duration: 1s;
   animation-duration: 1s;
   -webkit-animation-fill-mode: both;
   animation-fill-mode: both;
 }

 .bounceInRight2 {
   -webkit-animation-name: bounceInRight;
   animation-name: bounceInRight;
   -webkit-animation-duration: 1.2s;
   animation-duration: 1.2s;
   -webkit-animation-fill-mode: both;
   animation-fill-mode: both;
 }

 @-webkit-keyframes bounceInRight {
   0%, 60%, 75%, 90%, 100% {
     -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
     transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
   }
   0% {
     opacity: 0;
     -webkit-transform: translate3d(3000px, 0, 0);
     transform: translate3d(3000px, 0, 0);
   }
   60% {
     opacity: 1;
     -webkit-transform: translate3d(0px, 0, 0);
     transform: translate3d(0px, 0, 0);
   }
   75% {
     -webkit-transform: translate3d(0px, 0, 0);
     transform: translate3d(0px, 0, 0);
   }
   90% {
     -webkit-transform: translate3d(0px, 0, 0);
     transform: translate3d(0px, 0, 0);
   }
   100% {
     -webkit-transform: none;
     transform: none;
   }
 }

 @keyframes bounceInRight {
   0%, 60%, 75%, 90%, 100% {
     -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
     transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
   }
   0% {
     opacity: 0;
     -webkit-transform: translate3d(3000px, 0, 0);
     transform: translate3d(3000px, 0, 0);
   }
   60% {
     opacity: 1;
     -webkit-transform: translate3d(0px, 0, 0);
     transform: translate3d(0px, 0, 0);
   }
   75% {
     -webkit-transform: translate3d(0px, 0, 0);
     transform: translate3d(0px, 0, 0);
   }
   90% {
     -webkit-transform: translate3d(0px, 0, 0);
     transform: translate3d(0px, 0, 0);
   }
   100% {
     -webkit-transform: none;
     transform: none;
   }
 }

 .bounceInUp01 {
   -webkit-animation-name: bounceInUp;
   animation-name: bounceInUp;
   -webkit-animation-duration: 1s;
   animation-duration: 1s;
   -webkit-animation-fill-mode: both;
   animation-fill-mode: both;
 }

 .bounceInUp02 {
   -webkit-animation-name: bounceInUp;
   animation-name: bounceInUp;
   -webkit-animation-duration: 1.2s;
   animation-duration: 1.2s;
   -webkit-animation-fill-mode: both;
   animation-fill-mode: both;
 }

 .bounceInUp03 {
   -webkit-animation-name: bounceInUp;
   animation-name: bounceInUp;
   -webkit-animation-duration: 1.3s;
   animation-duration: 1.3s;
   -webkit-animation-fill-mode: both;
   animation-fill-mode: both;
 }

 .bounceInUp04 {
   -webkit-animation-name: bounceInUp;
   animation-name: bounceInUp;
   -webkit-animation-duration: 1.5s;
   animation-duration: 1.5s;
   -webkit-animation-fill-mode: both;
   animation-fill-mode: both;
 }

 .bounceInUp05 {
   -webkit-animation-name: bounceInUp;
   animation-name: bounceInUp;
   -webkit-animation-duration: 1.7s;
   animation-duration: 1.7s;
   -webkit-animation-fill-mode: both;
   animation-fill-mode: both;
 }

 .bounceInUp06 {
   -webkit-animation-name: bounceInUp;
   animation-name: bounceInUp;
   -webkit-animation-duration: 1.9s;
   animation-duration: 1.9s;
   -webkit-animation-fill-mode: both;
   animation-fill-mode: both;
 }

 .bounceInUp07 {
   -webkit-animation-name: bounceInUp;
   animation-name: bounceInUp;
   -webkit-animation-duration: 2s;
   animation-duration: 2s;
   -webkit-animation-fill-mode: both;
   animation-fill-mode: both;
 }

 .bounceInUp08 {
   -webkit-animation-name: bounceInUp;
   animation-name: bounceInUp;
   -webkit-animation-duration: 2.3s;
   animation-duration: 2.3s;
   -webkit-animation-fill-mode: both;
   animation-fill-mode: both;
 }

 .bounceInUp09 {
   -webkit-animation-name: bounceInUp;
   animation-name: bounceInUp;
   -webkit-animation-duration: 2.5s;
   animation-duration: 2.5s;
   -webkit-animation-fill-mode: both;
   animation-fill-mode: both;
 }

 .bounceInUp10 {
   -webkit-animation-name: bounceInUp;
   animation-name: bounceInUp;
   -webkit-animation-duration: 2.8s;
   animation-duration: 2.8s;
   -webkit-animation-fill-mode: both;
   animation-fill-mode: both;
 }

 @-webkit-keyframes bounceInUp {
   0%, 60%, 75%, 90%, 100% {
     -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
     transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
   }
   0% {
     opacity: 0;
     -webkit-transform: translate3d(0, 300px, 0);
     transform: translate3d(0, 300px, 0);
   }
   60% {
     opacity: 1;
     -webkit-transform: translate3d(0, 0px, 0);
     transform: translate3d(0, 0px, 0);
   }
   75% {
     -webkit-transform: translate3d(0, 0px, 0);
     transform: translate3d(0, 0px, 0);
   }
   90% {
     -webkit-transform: translate3d(0, 0px, 0);
     transform: translate3d(0, 0px, 0);
   }
   100% {
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
   }
 }

 @keyframes bounceInUp {
   0%, 60%, 75%, 90%, 100% {
     -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
     transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
   }
   0% {
     opacity: 0;
     -webkit-transform: translate3d(0, 300px, 0);
     transform: translate3d(0, 300px, 0);
   }
   60% {
     opacity: 1;
     -webkit-transform: translate3d(0, 0px, 0);
     transform: translate3d(0, 0px, 0);
   }
   75% {
     -webkit-transform: translate3d(0, 0px, 0);
     transform: translate3d(0, 0px, 0);
   }
   90% {
     -webkit-transform: translate3d(0, 0px, 0);
     transform: translate3d(0, 0px, 0);
   }
   100% {
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
   }
 }

 .chartBounceInUp {
   -webkit-animation-name: chartBounceInUp;
   animation-name: chartBounceInUp;
   -webkit-animation-duration: 1s;
   animation-duration: 1s;
   -webkit-animation-fill-mode: both;
   animation-fill-mode: both;
 }

 @-webkit-keyframes chartBounceInUp {
   0%, 60%, 75%, 90%, 100% {
     -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.85, 1.000);
     transition-timing-function: cubic-bezier(0.215, 0.610, 0.85, 1.000);
   }
   0% {
     opacity: 0;
     -webkit-transform: translate3d(0, 10px, 0);
     transform: translate3d(0, 10px, 0);
   }
   60% {
     opacity: 1;
     -webkit-transform: translate3d(0, 0px, 0);
     transform: translate3d(0, 0px, 0);
   }
   75% {
     -webkit-transform: translate3d(0, 0px, 0);
     transform: translate3d(0, 0px, 0);
   }
   90% {
     -webkit-transform: translate3d(0, 0px, 0);
     transform: translate3d(0, 0px, 0);
   }
   100% {
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
   }
 }

 @keyframes chartBounceInUp {
   0%, 60%, 75%, 90%, 100% {
     -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.85, 1.000);
     transition-timing-function: cubic-bezier(0.215, 0.610, 0.85, 1.000);
   }
   0% {
     opacity: 0;
     -webkit-transform: translate3d(0, 10px, 0);
     transform: translate3d(0, 10px, 0);
   }
   60% {
     opacity: 1;
     -webkit-transform: translate3d(0, 0px, 0);
     transform: translate3d(0, 0px, 0);
   }
   75% {
     -webkit-transform: translate3d(0, 0px, 0);
     transform: translate3d(0, 0px, 0);
   }
   90% {
     -webkit-transform: translate3d(0, 0px, 0);
     transform: translate3d(0, 0px, 0);
   }
   100% {
     -webkit-transform: translate3d(0, 0, 0);
     transform: translate3d(0, 0, 0);
   }
 }

 .center {
   position: absolute;
   margin: 0 auto;
   width: 100%;
   /* border: 1px solid red; */
   padding: 10px;
   z-index: 99999;
 }

 .loading-bro {
   z-index: 99999;
   /* position: absolute; */
   margin: 50px auto;
   width: 150px;
   background: rgba(0, 0, 0, 0.5);
   padding: 16px;
   border-radius: 5px;
   display: block;
   /* top: 50%; */
   /* left: 50%; */
   /* margin: 50px 0px 0px -25%; */
 }

 .loading-bro>h1 {
   text-align: center;
   font-size: 15px;
   margin-bottom: 1em;
   font-weight: 300;
   color: #fff;
 }

 #load {
   width: 120px;
   animation: loading 3s linear infinite;
 }

 #load #loading-inner {
   stroke-dashoffset: 0;
   stroke-dasharray: 240;
   stroke-width: 10;
   stroke-miterlimit: 10;
   stroke-linecap: round;
   animation: loading-circle 2s linear infinite;
   stroke: #fff;
   fill: transparent;
 }

 @keyframes loading {
   0% {
     transform: rotate(0);
   }
   100% {
     transform: rotate(360deg);
   }
 }

 @keyframes loading-circle {
   0% {
     stroke-dashoffset: 0;
   }
   100% {
     stroke-dashoffset: -480;
   }
 }