html,body{
    margin:0;
    padding:0;
    height:100%;
}
html {
    font-size: 100%;
}

*::-webkit-scrollbar { width: 6px; height: 6px; /*background: #F1F1F1;*/ background: transparent;}
*::-webkit-scrollbar-button { width: 6px; height: 6px; background: transparent;}
*::-webkit-scrollbar-track { /*background: #C7EDFC;*/ /*background: #D1E0ED;*/ background: transparent; }
*::-webkit-scrollbar-track-piece  {/*4*/}
*::-webkit-scrollbar-thumb { background: #7f7f7f; border-radius: 6px; }
*::-webkit-scrollbar-corner {/*6*/}
*::-webkit-resizer {/*7*/}

/* fonts */
/*@font-face{ font-family: "web";  src: url('fonts/PFdindisplayPro-Regular.woff') format('woff');}
@font-face{ font-family: "bold"; src: url('fonts/PFdindisplayPro-Bold.woff') format('woff');}*/

/* @font-face {
    font-family: 'web';
    src: url('fonts/Open_Sans/OpenSans-Regular.ttf') format('truetype');
    font-weight: normal;  font-style: normal;
} */
/* @font-face {
    font-family: 'web-light';
    src: url('fonts/Open_Sans/OpenSans-Light.ttf') format('truetype');
    font-weight: normal;  font-style: normal;
} */
/* @font-face {
    font-family: 'bold';
    src: url('fonts/MyriadPro-Bold.otf') format('truetype');
} */
/* @font-face {
    font-family: 'h';
    src: url('fonts/Open_Sans/OpenSans-Semibold.ttf') format('truetype');
} */

@font-face {
    font-family: 'web-light';
    src: url('fonts/roboto/Roboto-Light.woff2');
    src: url('fonts/roboto/Roboto-Light.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
  }
  @font-face {
    font-family: 'web';
    src: url('fonts/roboto/Roboto-Light.woff2');
    src: url('fonts/roboto/Roboto-Light.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
  }
  @font-face {
    font-family: 'bold';
    src: url('fonts/roboto/Roboto-Medium.woff2');
    src: url('fonts/roboto/Roboto-Medium.woff2') format('woff2');
    /* font-weight: 500; */
    /* font-style: normal; */
  }
  @font-face {
    font-family: 'h';
    src: url('fonts/roboto/Roboto-Medium.woff2');
    src: url('fonts/roboto/Roboto-Medium.woff2') format('woff2');
    /* font-weight: 500; */
    /* font-style: normal; */
  }

/*@font-face {
    font-family: 'Textbook New';
    src: local('☺'), local('Textbook New'), local('TextbookNew');
    src: url('fonts/TextbookNew.woff') format('woff'),
         url('fonts/TextbookNew.ttf') format('truetype');
    font-weight: normal;  font-style: normal;
}
@font-face {
    font-family: 'web';
    src: local('☺'), local('web'), local('TextbookNew');
    src: url('fonts/TextbookNew-Light.woff') format('woff'),
         url('fonts/TextbookNew-Light.ttf') format('truetype');
    font-weight: normal;  font-style: normal;
}
@font-face {
    font-family: 'Textbook New Bold';
    src: local('☺'), local('Textbook New Bold'), local('TextbookNew');
    src: url('fonts/TextbookNew-Bold.woff') format('woff'),
         url('fonts/TextbookNew-Bold.ttf') format('truetype');
    font-weight: normal;  font-style: normal;
}

@font-face {
    font-family: 'Open Sans';
    src: local('☺'), local('Open Sans'), local('OpenSans');
    src: url('fonts/opensans-regular-webfont.eot');
    src: url('fonts/opensans-regular-webfont.eot?#iefix') format('embedded-opentype'),
        url('fonts/opensans-regular-webfont.woff') format('woff'),
        url('fonts/opensans-regular-webfont.ttf') format('truetype');
    font-weight: normal;  font-style: normal;
}
@font-face {
    font-family: 'Open Sans Light';
    src: local('☺'), local('Open Sans'), local('OpenSans');
    src: url('fonts/opensans-light-webfont.eot');
    src: url('fonts/opensans-light-webfont.eot?#iefix') format('embedded-opentype'),
        url('fonts/opensans-light-webfont.woff') format('woff'),
        url('fonts/opensans-light-webfont.ttf') format('truetype');
    font-weight: normal;  font-style: normal;
}*/

body{
    font-family: 'web-light', 'web', Tahoma;
    font-size: 13px;
    line-height: 1.25; 
    /* letter-spacing: -0.20px; */
    color: #454545;
}
a{color:#007FC0;}
a:hover{color: #51A7E8;}
b,strong{
    font-weight: normal;
    font-family: "bold";
    font-weight: 300;
    font-size: 14px;
    letter-spacing: 0px; 
}
optgroup{
    font-family: "h", Tahoma;
    color:#000;
}
optgroup option{
    font-family: "web", Tahoma;
    color:#454545;
}

*{outline: none;}
*:focus {outline: 0;}
img{border:none;}
h1,h2,h3{
    line-height: 1;
    letter-spacing: -0.50px;    
    font-weight: normal;
    font-family: "h", Tahoma;
    font-weight: 300;
    color: #000;
}
h1{font-size: 21px; padding: 6px 0 5px; margin: 0px 0 5px;}
h2{font-size: 19px; padding: 5px 0 5px; margin: 0px 0 5px;}
h3{font-size: 16px; padding: 4px 0 3px; margin: 0px 0 3px;}

hr{border-left:none; border-right:none; border-top:1px solid #DDD; border-bottom:1px solid #F6F6F6;}
fieldset{
    /* border: 1px solid #D0D0BF; */
    border: 1px solid #ccc;
    border-radius: 10px;
    margin-bottom: 5px;
    padding: 4px 8px 8px 8px;
}
legend{
    color: #454545;
    margin-left: 4px;   
}
pre{
    font: 11px "Lucida Console" !important;
    /*font: 11px "Helvetica Neue", "Helvetica", "Arial", sans-serif;*/
    letter-spacing: 0px;
    color: #222;
}
code{
    font-family: inherit;
    font-size: 14px;
    line-height: 16px;
    /*letter-spacing: 0px;*/
    color: #222;
}
table{
    border-spacing: 0px;
}

input, select, textarea, button{
    font-family:inherit;
    font-family: 'web-light';
}
/*************************** input ***********************************/
input[type="text"],input[type="number"],input[type="file"],input[type="password"],textarea,select{
    position: relative;
    background: #FFF;
    letter-spacing: -0.30px;
    word-spacing: 2px;
    color: #000;
    min-width: 210px;
    font-size: 1em;
    font-family: 'web-light', 'web', Tahoma;
    height: 21px;
    padding: 0 3px;
    margin: 0px 0px 4px;    
    vertical-align: middle;
    border-left: 1px solid transparent;
    border-top: 1px solid transparent;
    border-right: 1px solid transparent;
    /* border-bottom: 1px dotted #BBB; */
    border-bottom: 1px solid #ccc;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}
input[type="range"]{
    margin: 0px 0px 4px;
    border: 1px solid transparent;
}
input[type="number"]{
    min-width: 60px;
}
label{
    display: inline-block;
    padding: 1px 4px 1px 0;    
    color: #454545;
}
label:hover{
    cursor: pointer;
    /*background: #E8F3FB;*/
    background: #E8F3FF;
}
label:disabled:hover{
    background: #F6F6F6 !important;
}
label input[type="checkbox"]{
    float: left;
    margin-top: 3px;
    margin-bottom: -2px;
}
input[type="text"]:focus,input[type="number"]:focus,input[type="file"]:focus,input[type="password"]:focus,textarea:focus,select:focus{
    /*background: #FFFFD9;*/
    /* background: #FFFFCA; */
    /*box-shadow: 0px 0px 3px #FAFA8F inset;*/
    /*background: #F2FAFF;*/
    /*border:1px solid #599CFF;*/
    /* border-bottom: 1px solid #599CFF; */
    /*border-bottom: 1px solid #C18C00;*/
    /*box-shadow: 0px 0px 5px #8CCAD9;*/
}


select{
    min-width: 180px;
}
textarea{
    min-width: 210px;
    max-width: 360px;    
    line-height: 15px;
    padding: 2px 4px;
    min-height: 54px;
    max-height: 200px;
    border-left: 1px dashed #EEE;
    border-top: 1px dashed #EEE;
    border-right: 1px dashed #EEE;    
}
/*******************************  button *******************************/
button,input[type="submit"]{
    z-index: 1;
    position: relative;
    cursor: pointer;
    height: 28px;  
    font-size: 12px;
    padding: 0px 14px 0px;
    min-width: 100px;
    /*background: #599CFF;*/
    /*background: #4285f4;
    text-shadow: 0px -1px 0px #0A73DC;*/
    /* background: #7f7f7f; */
    /* background: #bcbcbc;
    color: #FFF; */
    background-color: rgba(210, 210, 215, 0.64);
    color: rgba(0, 0, 0, 0.56);
    border: 1px solid transparent;  
    /* border-radius: 7px; */
    border-radius: 15px;
    /* text-transform: uppercase; */
    transition-property: background , color, opacity;
    transition-duration: 0.1s, 0.1s, 0.1s;
    transition-delay: 0s, 0s, 0s;
}
button:hover,input[type="submit"]:hover{
    /*background: #6FA8FF;*/
    /*background: #3B78E7;*/
    /* background: #5f5f5f; */
    /* color: #5f5f5f; */
    background-color: rgba(230, 230, 234, 0.698);
    color: rgba(0, 0, 0, 0.75);
}
button:active,input[type="submit"]:active{
    /*background: #3367D6;
    box-shadow: 0px 0px 0px 1px #61A5F8 inset;*/
    /* box-shadow: 0px 0px 0px 1px #9f9f9f inset; */
    /* background: #5f5f5f; */
}

button:disabled,input[type="submit"]:disabled{
    background: #EEE;
    color: #ABABAB;
    /* border: 1px solid #CCC; */
    /*border-radius: 3px;*/
    /* text-shadow: 0px 1px 1px #FFF; */
    /* box-shadow: 0px 0px 1px 1px #EEE inset; */
}
button:disabled:hover,input[type="submit"]:disabled:hover{
    cursor: not-allowed;
}
sup{
    background: #DAE6FA;
    color: #0046D5;
    font-size: 10px;
    margin-left: 3px;
    text-shadow: none;
    padding: 0px 3px;
    border-radius: 2px;
    border: 1px solid #D6E3EC;
}
*:disabled{
    cursor: not-allowed !important;
}
.disabled{
    pointer-events:none !important;
    cursor: not-allowed !important;
    color: #ABABAB !important;
    background: none !important;
}
.disabled:hover{
    background: none !important;
    color: #ABABAB !important;
}

input:disabled+label, input:disabled+label:hover {
    color: #ABABAB;
    background: none;
    cursor: not-allowed;
}
input:read-only, input:read-only:focus, input:disabled,
/*select:read-only,select:read-only:focus,select:disabled,*/
select:disabled,
textarea:read-only, textarea:read-only:focus, textarea:disabled{
    background: #F9F9F9;
    /*border:1px solid #CCC;*/
    border-left: 1px solid #F6F6F6;
    border-top: 1px solid #F6F6F6;
    border-right: 1px solid #F6F6F6;
    border-bottom: 1px dotted #DDD;
    box-shadow: none;
    color: #ABABAB;    
}
input:read-only:hover,input:read-only:disabled{
    cursor: not-allowed;
}
/*---------- tooltip ------------*/
.ui-tooltip {
    /* background: rgba(0,0,0, 0.7); */
    background-color: #51515199;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    font: 12px "web", Tahoma;
    line-height: 14px;
    color: #FFF;
    padding: 8px 12px;
    position: absolute !important;
    z-index: 9999;
    max-width: 480px;
    /* text-shadow: 0px 1px 1px #111; */
}
body .ui-tooltip {
    /* border: 1px solid #FFF; */
    border-radius: 10px;
}
.title:hover{
    cursor: help; 
} 
.hover-first-login:hover {
    background: #7f7f7f !important;
    color: white !important;
}