    @font-face {
        /* font-family: 'JFFlat-Regular';*/
        font-family: 'JFFlat-Regular';
        src: url('../../assets/fonts/JF-Flat-regular.eot?#iefix') format('embedded-opentype'), url('../../assets/fonts/JF-Flat-regular.woff') format('woff'), url('../../assets/fonts/JF-Flat-regular.ttf') format('truetype'), url('../../assets/fonts/JJF-Flat-regular.svg#JFFlat-Regular') format('svg');
        font-weight: normal;
        font-style: normal;
    }
    
    *[dir="rtl"] {
        font-family: 'JFFlat-Regular';
        font-size: 14px !important;
    }
    
    *[direction="rtl"] {
        font-family: 'JFFlat-Regular';
        font-size: 14px !important;
    }
    
    *[dir="ltr"] {
        font-family: 'Segoe UI';
        font-size: 11px !important;
    }
    
    *[direction="ltr"] {
        font-family: 'Segoe UI';
        font-size: 11px !important;
    }
    
    html {
        background-color: #ffffff;
        /*background-image:url(images/bg.jpg);
    font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif;
    */
    }
    
    body {
        /*
    font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif;
    */
        font-size: 16px;
        height: 100%;
        margin: 0 auto;
        padding-left: 0px;
        padding-right: 0px;
        /*width:990px;
    overflow-x: hidden; */
        width: 100%;
        /*    -moz-box-shadow: 0px 0px 51px #000000;
    -webkit-box-shadow: 0px 0px 51px #000000;
    box-shadow: 0px 0px 51px #000000; */
        /*	background: #dedede;

	margin: 5px 0 0 5px;
	padding: 0;*/
    }
    
    tr,
    td,
    th {
        margin: auto;
        /* font-size: 13px; */
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
    }
    
    table {
        /*  text-align: left;*/
        width: 99%;
        margin: auto;
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
    }
    
    textarea {
        /*  font-size: 12px; */
        width: auto;
    }
    
    input,
    select {
        /*  font-size: 12px; */
        /* border: 1px solid #CCCCCC;*/
        padding: 2px;
        width: auto;
        font-family: 'Segoe UI';
        max-width: 260px;
        min-width: 130px;
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
    }
    
    select {
        width: auto;
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
        /*  font-size: 12px; */
        font-family: 'Segoe UI';
        max-width: 260px;
        min-width: 130px;
    }
    
    option.inactive {
        text-decoration: line-through;
        color: gray;
    }
    
    input.big {
        width: 100%;
    }
    
    input.small {
        width: 100%;
        min-width: 120px;
    }
    
    a {
        color: #0c9df1d8;
        font-size: 14px;
        text-decoration: none;
    }
    
    .hdrlogo {
        float: left;
        padding-top: 5px;
        padding-left: 6px;
        display: none;
    }
    /*.logoout{ float:right; margin-top:-149px; } Changed by Joe */
    
    .logoout {
        float: right;
        margin-top: -60px;
    }
    
    .logoout a,
    .logoout a:visited,
    .logoout a:active,
    .logoout a:link {
        display: inline-block;
        -webkit-transition: .3s linear;
        -moz-transition: .2s linear;
        -o-transition: .2s linear;
        -ms-transition: .2s linear;
        transition: .2s linear;
        background: #0bb3f1;
        color: #FFF;
        padding: 8px 10px;
    }
    
    .logoout a:hover {
        background: #afafaf;
        text-decoration: none;
        color: #FFF;
    }
    
    a:link {
        text-decoration: none;
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
        display: inline-block;
        /*  background-color: #0bb3f1;
        border-top: 1px solid #0bb3f1;
        border-right: 1px solid #0bb3f1;
        border-bottom: 1px solid #0bb3f1;
        border-left: 1px solid #0bb3f1; */
        padding-left: 4px;
        padding-right: 4px;
        /*  color: #ffffff; */
        border-radius: 2px;
        height: auto;
        line-height: 22px;
    }
    
    a:active {
        color: #eff1f5;
        text-decoration: none;
        line-height: 22px;
    }
    
    a:hover,
    a:focus {
        color: #000000;
        /* text-decoration: underline;*/
        background-color: #ffffff;
        text-decoration: none;
        line-height: 22px;
    }
    
    .inactive {
        text-align: left;
        margin: 0 auto;
        background: url(images/right.png);
        background-position: 0 5px;
        background-repeat: no-repeat;
        padding: 7px 0 6px 29px;
        color: #ccc;
        text-decoration: none;
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
        /*  font-size: 12px; */
        display: inline-block;
        background-color: #f7f7f7;
        width: 100%;
        border: 1px dotted #FFF;
    }
    
    button {
        font-size: 13px;
        border: 1px #0066cc solid;
        padding: 2px 2px;
    }
    
    button img {
        padding: 2px;
        vertical-align: middle;
        height: 18px;
        width: 18px;
    }
    
    .callout_main {
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
        border: none;
        width: 100%;
        margin: 0 auto;
        padding: 0;
    }
    
    .callout_main tbody {
        padding: 8px;
    }
    
    .main_page {
        background-color: #f9f9f9;
        border: none;
        width: 100%;
        margin: 0;
        padding: 0;
        height: 100%;
    }
    
    .quick_menu {
        border-top: 0px solid #afafaf;
        margin: 0;
        padding: 0;
        /*text-align: right;*/
    }
    
    .quick_menu_selected {
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
        /*  font-size: 12px; */
        border: none;
        white-space: nowrap;
        margin: 2px;
        padding: 2px;
        color: #00cc00;
        font-weight: bolder;
    }
    
    .logoutBar {
        background: #0bb3f1;
        color: #FFF;
        border-bottom: 1px solid #aea594;
        width: 100%;
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
        font-weight: lighter;
        padding-top: 9px;
        display: none;
    }
    
    .bottomBar {
        background: #072246;
        margin: 0 auto;
        color: #FFF;
        margin-top: 5px;
        padding: 4px;
        width: 100%;
        display: none;
    }
    
    .bottomBarCell {
        /*  font-size: 12px; */
        line-height: 12px;
        display: none;
    }
    
    .bottomBar2 {
        background: none repeat scroll 0 0 #072246;
        color: #FFFFFF;
        margin: 5px auto 0;
        padding: 4px;
        width: 100%;
        display: none;
    }
    
    .logoutBarRight {
        text-align: right;
        display: none;
    }
    
    div.logoutBar {
        padding-right: 1em;
        background: #dedede;
        color: black;
        border-bottom: 1px solid #aea594;
        text-align: right;
        display: none;
    }
    
    div.logoutBar a {
        font-weight: normal;
        margin-left: 1em;
        color: #436976;
        background-color: transparent;
        display: none;
    }
    
    div.logoutBar img {
        vertical-align: top;
        display: none;
    }
    
    div.tabs {
        border-bottom: 0px solid #aea594;
        padding-top: 12 px;
        background-color: #0bb3f1;
        background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0485f3), to(#0bb3f1));
        /* Safari 5.1, Chrome 10+ */
        background: -webkit-linear-gradient(top, #0485f3, #0bb3f1);
        /* Firefox 3.6+ */
        background: -moz-linear-gradient(top, #0485f3, #0bb3f1);
        /* IE 10 */
        background: -ms-linear-gradient(top, #0485f3, #0bb3f1);
        /* Opera 11.10+ */
        background: -o-linear-gradient(top, #0485f3, #0bb3f1);
        display: none;
    }
    
    div.tabs a {
        border-bottom: 1px #FFF solid;
        padding: 8px 8px;
        font-weight: normal;
        background: white scroll repeat 0% 0%;
        color: #666;
        margin-right: 2px;
        height: 10px;
    }
    
    div.tabs a.selected {
        border-bottom: 1px #0bb3f1 solid;
        font-weight: normal;
        background: #0bb3f1;
        background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0485f3), to(#0bb3f1));
        /* Safari 5.1, Chrome 10+ */
        background: -webkit-linear-gradient(top, #0485f3, #0bb3f1);
        /* Firefox 3.6+ */
        background: -moz-linear-gradient(top, #0485f3, #0bb3f1);
        /* IE 10 */
        background: -ms-linear-gradient(top, #0485f3, #0bb3f1);
        /* Opera 11.10+ */
        background: -o-linear-gradient(top, #0485f3, #0bb3f1);
        color: #FFF;
    }
    
    div.tabs a.selected:hover {
        border-bottom: 1px #0bb3f1 solid;
        background: #0bb3f1;
        background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0485f3), to(#0bb3f1));
        /* Safari 5.1, Chrome 10+ */
        background: -webkit-linear-gradient(top, #0485f3, #0bb3f1);
        /* Firefox 3.6+ */
        background: -moz-linear-gradient(top, #0485f3, #0bb3f1);
        /* IE 10 */
        background: -ms-linear-gradient(top, #0485f3, #0bb3f1);
        /* Opera 11.10+ */
        background: -o-linear-gradient(top, #0485f3, #0bb3f1);
    }
    
    div.tabs a:hover {
        background: #5ca1fc;
        color: #FFF;
        /*	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#AFAFAF), to(#FFF));

    background: -webkit-linear-gradient(top, #AFAFAF, #FFF);

    background: -moz-linear-gradient(top, #AFAFAF, #FFF);

    background: -ms-linear-gradient(top, #AFAFAF, #FFF);

    background: -o-linear-gradient(top, #AFAFAF, #FFF); */
        border-bottom: 1px #AFAFAF solid;
        text-decoration: none;
    }
    
    .menu_group {
        background-color: #eeeeee;
        color: #072246;
        padding-left: 3px;
        padding-right: 3px;
        letter-spacing: 0.01em;
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
        /*  font-size: 12px; */
    }
    
    .menu_group_items {
        background-color: #f9f9f9;
        font-weight: normal;
        padding: 2px;
        border: 1px solid #b9babb;
        border-radius: 5px;
    }
    
    .menu_group_items img {
        display: none;
        visibility: hidden;
    }
    
    .menu_group_items a {
        -webkit-transition: .3s linear;
        -moz-transition: .3s linear;
        -o-transition: .3s linear;
        -ms-transition: .3s linear;
        transition: .3s linear;
        text-align: center;
        vertical-align: middle;
        margin: 0 auto;
        background-position: 0 5px;
        /* padding: 7px 0 6px 29px; */
        background: url(images/viewicon.png);
        background-repeat: no-repeat;
        background-position-y: center;
        background-size: 20px;
        background-position-x: 3px;
        color: #666;
        text-decoration: none;
        /*  font-size: 12px; */
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
        display: inline-block;
        background-color: #f9f9f9;
        width: 42%;
        max-width: 42%;
        border: 1px dotted #f9f9f9;
        height: 65px;
        border: #CCCCCC 1px solid;
        border-radius: 10px;
        margin: 8px;
        padding-top: 30px;
        padding-left: 20px;
        word-wrap: initial;
    }
    
    .menu_group_items a:hover {
        color: #f35b03;
        border: 1px solid #0695d0;
        background-color: #ebeaea;
        box-shadow: -5px 7px 0 0 #ebeaea;
    }
    
    #hotkeyshelp {
        text-align: right;
        font-weight: bolder;
    }
    
    #footer {
        position: relative;
        border-top: 6px solid #0bb3f1;
        bottom: -6px;
        margin: 0 auto;
        background-color: rgba(0, 0, 0, 0.65);
        width: 100%;
        padding: 25px;
        vertical-align: bottom;
        display: none;
    }
    
    .footer td a {
        color: #666666;
        font-size: 9px;
        display: none;
    }
    
    .footer {
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
        color: #cccccc;
        font-weight: normal;
        font-size: 12px;
        text-align: left;
        width: 100%;
        display: none;
    }
    
    .footer a {
        color: #cccccc;
        font-weight: normal;
        font-size: 12px;
        text-align: left;
        width: 100%;
        display: none;
    }
    
    .tableheader {
        font-weight: normal;
        background-color: #a09f9f;
        color: #ffffff;
        text-align: center;
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
        font-size: 14px;
        padding-top: 8px;
        padding-bottom: 8px;
    }
    
    .tableheader2 {
        font-weight: normal;
        background-color: #a09f9f;
        color: #ffffff;
        text-align: left;
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
        font-size: 14px;
        padding-top: 8px;
        padding-bottom: 8px;
    }
    
    .titletext {
        font-weight: bold;
        font-size: 12px;
        border-bottom: 2px solid #e2e1e1;
        padding: 5px;
        margin-top: -20px;
        width: 100%;
    }
    
    .headingtext {
        font-weight: bold;
        font-size: 12px;
        color: black;
    }
    
    .headingtext2 {
        font-size: 12px;
        color: black;
    }
    
    .headingtext3 {
        padding-top: 5px;
        padding-left: 5px;
    }
    
    .errortext {
        font-size: 13px;
        color: #ff0000;
        font-weight: bold;
    }
    
    .inputsubmit {
        /* font-size: 13px;
     font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif;
    border: 1px solid #0bb3f1;
    background-color: #0bb3f1;
    color: #FFF;
    min-width: 120px;
    padding: 6px;
    width: 100%;
    max-width: 200px;
    border-radius: 4px;
    */
        font-size: 12px;
        font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif;
        border: 1px solid #0bb3f1;
        background-color: #0bb3f1;
        color: #FFF;
        min-width: 100px;
        padding-left: 4px;
        padding-right: 4px;
        width: 180px;
        border-radius: 4px;
        -webkit-transition: .3s linear;
        -moz-transition: .2s linear;
        -o-transition: .2s linear;
        -ms-transition: .2s linear;
        transition: .2s linear;
        cursor: pointer;
        max-width: 200px;
    }
    
    .inputsubmit:hover {
        /* font-size: 13px;
 font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif;
    border: 1px solid #fff;
    background-color: #afafaf;
    color: #fff;
    padding: 6px;
    width: 150px;
    border-radius: 4px;
    cursor: pointer;
    */
        font-size: 12px;
        border: 1px solid #afafaf;
        background-color: #afafaf;
        padding-left: 4px;
        padding-right: 4px;
        width: 180px;
        border-radius: 4px;
        -webkit-transition: .3s linear;
        -moz-transition: .2s linear;
        -o-transition: .2s linear;
        -ms-transition: .2s linear;
        transition: .2s linear;
        cursor: pointer;
        max-width: 200px;
    }
    
    .ajaxsubmit {
        font-size: 12px;
        font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif;
        border: 1px solid #0bb3f1;
        background-color: #0bb3f1;
        color: #FFF;
        min-width: 120px;
        padding-left: 4px;
        padding-right: 4px;
        width: 180px;
        border-radius: 4px;
        -webkit-transition: .3s linear;
        -moz-transition: .2s linear;
        -o-transition: .2s linear;
        -ms-transition: .2s linear;
        transition: .2s linear;
        cursor: pointer;
        max-width: 200px;
    }
    
    .ajaxsubmit:hover {
        border: 1px solid #afafaf;
        background-color: #afafaf;
        padding-left: 4px;
        padding-right: 4px;
        width: 180px;
        border-radius: 4px;
        -webkit-transition: .3s linear;
        -moz-transition: .2s linear;
        -o-transition: .2s linear;
        -ms-transition: .2s linear;
        transition: .2s linear;
        cursor: pointer;
        max-width: 220px;
    }
    
    .oddrow {
        background-color: #eeeeee;
    }
    
    .evenrow {
        background-color: #dddddd;
    }
    
    .overduebg {
        background-color: #dd7777;
    }
    
    .overduefg {
        color: #dd7777;
    }
    
    .currentfg {
        color: #ff6666;
    }
    
    .redfg,
    a.redfg {
        color: red;
        font-weight: bold;
    }
    
    .settledbg {
        background-color: #00bb00;
    }
    
    .settledfg {
        color: #00bb00;
    }
    
    .inquirybg {
        background-color: #fdfeef;
    }
    
    .currencybg {
        background-color: #ee8888;
    }
    
    .stockmankobg {
        background-color: pink;
    }
    
    .stockmankofg {
        color: red;
    }
    
    table.tablestyle {
        border-collapse: collapse;
        border: 1px solid #e7e7e6;
        width: 100%;
    }
    
    table.tablestyle td {
        border-collapse: collapse;
        border: 1px solid #f5f5f4;
    }
    
    table.tablestyle2 {
        border-collapse: collapse;
        border: 1px solid #e7e7e6;
    }
    
    table.tablestyle2 td {
        border-collapse: collapse;
        border: 1px solid #f5f5f4;
    }
    
    table.tablestyle_inner {
        border-collapse: collapse;
        border: 1px solid #f9f9f9;
    }
    
    table.tablestyle_inner td {
        border-collapse: collapse;
        border: 1px solid #f9f9f9;
    }
    
    .tablestyle_noborder {
        padding: 3px;
    }
    
    .label {
        color: black;
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
        font-size: 13px;
        width: auto;
        min-width: 40px;
    }
    
    #logz {
        padding-top: 10px;
    }
    
    #loginscreen {
        /*background: #f5f5f5;
    background-image: url(images/ie3bg.png);*/
        background-position: center;
        background-repeat: no-repeat;
    }
    
    .loginz {
        -moz-border-radius: 20px;
        -webkit-border-radius: 20px;
        border-radius: 20px;
        background-color: rgba(238, 238, 238, 0.85);
        -moz-box-shadow: inset 0 0 5px #AEA594;
        -webkit-box-shadow: inset 0 0 5px #AEA594;
        box-shadow: inset 0 0 5px #AEA594;
        -webkit-transition: .3s linear;
        -moz-transition: .3s linear;
        -o-transition: .3s linear;
        -ms-transition: .3s linear;
        transition: .3s linear;
        width: 400px;
        margin: 0 auto;
    }
    
    .loginz:hover {
        background-color: rgba(238, 238, 238, 0.95);
    }
    
    .login {
        width: 470px;
        border: 1px solid #ccc;
        border-left: 20px solid #367cb5;
        background-color: #eeeeee;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        border-radius: 10px;
        margin-top: 30px;
        background-color: transparent;
    }
    
    .login td.tableheader {
        line-height: 40px;
        border: 1px solid #ccc;
    }
    
    .login select,
    .login input[type=text],
    input[type=password] {
        height: 25px;
        width: 365px;
        padding-left: 3px;
        box-sizing: border-box;
        border: 1px solid rgb(219, 219, 219);
        border-radius: 4px;
        background-color: #fff;
        outline: none;
    }
    
    .login input[type=button],
    input[type=submit] {
        background-color: #367cb5;
        border: none;
        border-radius: 4px;
        color: white;
        padding: 8px 16px;
        text-decoration: none;
        margin: 4px 2px;
        cursor: pointer;
    }
    
    .login td {
        border-collapse: collapse;
        border: 0px solid #cccccc;
        padding: 10px;
    }
    
    tr,
    td,
    th *[dir="ltr"] {
        font-size: 12px !important;
    }
    
    .amount {
        text-align: right;
    }
    
    input.amount {
        padding-right: 0px;
        border: 1px solid #CCCCCC;
        padding: 4px;
        width: auto;
        min-width: 130px;
    }
    
    .editbutton {
        color: #0000FF;
        background-color: transparent;
        border-style: none;
        text-decoration: underline;
        cursor: pointer;
    }
    
    .navibutton[disabled],
    .navibutton[disabled] span {
        color: #808080;
        text-decoration: none;
        cursor: auto;
    }
    
    button.navibutton {
        font-weight: bold;
        color: #000;
        padding: 0 3px;
        background-color: transparent;
        border-style: none;
        cursor: pointer;
    }
    
    .navibutton span {
        text-decoration: underline;
    }
    
    .navibar {
        padding: 0 3px;
        color: #000;
        border-collapse: collapse;
        background-color: #dedede;
    }
    
    .navibar tr td {
        border: none;
    }
    
    .listsubmit {
        display: none;
    }
    
    ul.ajaxtabs {
        padding: 3px 0 0 0;
        margin: 3px 3px 0 3px;
        /*  font-size: 12px; */
        font-weight: bold;
    }
    
    ul.ajaxtabs li {
        list-style: none;
        margin: 0;
        display: inline;
    }
    
    ul.ajaxtabs li button {
        background-color: #dedede;
        padding: 3px 8px;
        margin: 0px;
        border-top: 1px solid #aea594;
        border-right: 1px solid #aea594;
        border-bottom: none;
        border-left: none;
        font-weight: bold;
    }
    
    ul.ajaxtabs li button:hover {
        border-top: 1px solid #aea594;
        color: #FFFFFF;
    }
    
    div.spaceBox {
        background-color: #aea594;
        height: 8px;
        border-bottom: 1px solid #aea594;
        border-left: 1px solid #aea594;
        border-right: 1px solid #aea594;
        margin: 0 3px 0px 3px
    }
    
    div.contentBox {
        border: 1px solid #aea594;
        margin: 0 3px 3px 3px
    }
    
    ul.ajaxtabs li button.current,
    ul.ajaxtabs li button.current:hover {
        border-left: 1px solid #aea594;
        background-color: #aea594;
        color: #FFFFFF;
    }
    
    #hints {
        padding: 5px;
        border-bottom: 1px solid #aea594;
        margin: -4px -2px -2px;
        border: 1px solid #aea594;
        background-color: #FFFFE0;
        white-space: nowrap;
        display: none;
    }
    /*
	Calendar style
*/
    
    #CCIframe {
        display: none;
        left: 0px;
        position: absolute;
        top: 0px;
        height: 250px;
        width: 270px;
        z-index: 99;
    }
    
    #CC {
        position: absolute;
        background-color: #FFF;
        margin: 0;
        padding: 0;
        display: none;
        z-index: 100;
    }
    
    #CC table {
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
        /*  font-size: 12px; */
        border-left: 1px solid #336;
        border-right: 1px solid #336;
    }
    
    #CC th {
        font-weight: normal;
        text-align: center;
    }
    
    #CC th a {
        font-weight: normal;
        text-decoration: none;
        color: #FFF;
        padding: 1px;
    }
    
    #CC td {
        text-align: center;
    }
    
    #CC .header {
        background-color: #0bb3f1;
    }
    
    #CC .weekday {
        background-color: #eee;
        color: #000;
    }
    
    #CC .weekend {
        background-color: #FFC;
        color: #000;
    }
    
    #CC .weekno {
        background-color: #c0daf8;
        color: #555;
    }
    
    #CC .current {
        border: 1px solid #339;
        background-color: #0bb3f1;
        color: #FFF;
    }
    
    #CC .weekday,
    #CC .weekend,
    #CC .current {
        display: block;
        text-decoration: none;
        border: 1px solid #FFF;
        width: 2em;
    }
    
    #CC .weekday:hover,
    #CC .weekend:hover,
    #CC .current:hover {
        color: #FFF;
        background-color: #0bb3f1;
        border: 1px solid #999;
    }
    
    #CC .previous {
        text-align: left;
    }
    
    #CC .next {
        text-align: right;
    }
    
    #CC .previous,
    #CC .next {
        padding: 1px 3px 1px 3px;
        font-size: 1.4em;
    }
    
    #CC .previous a,
    #CC .next a {
        color: #FFF;
        text-decoration: none;
        font-weight: bold;
    }
    
    #CC .title {
        text-align: center;
        font-weight: bold;
        color: #FFF;
    }
    
    #CC .empty {
        background-color: #ddd;
        border: 1px solid #FFF;
    }
    
    div.err_msg {
        margin: auto;
        padding: 3px;
        border: 1px solid #cc3300;
        background-color: #ffcccc;
        color: #fcf7f6;
        text-align: center;
        bottom: 5px;
        left: 5px;
        position: fixed;
        /* Stay in place */
        z-index: 1;
        /* Sit on top */
        padding-top: 150px;
        /* Location of the box */
        width: 35%;
        /* Full width */
        height: 10%;
        /* Full height */
        /* Enable scroll if needed */
        background-color: #cc3300;
        /* Fallback color */
        background-color: rgba(248, 73, 4, 0.932);
        /* Black w/ opacity */
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        -webkit-animation-name: animatetop;
        -webkit-animation-duration: 1s;
        animation-name: animatetop;
        animation-duration: 1s;
        white-space: pre-wrap;
        margin-right: 25%;
        padding-bottom: 15px;
        padding-top: 15px;
        border-top: #cc3300 solid 30px;
        border-bottom: #cc3300 solid 30px;
        border-radius: 5px;
        cursor: pointer;
        animation: slide 3s linear forwards 5000ms;
    }
    /*
div.err_msg:active {
    animation: slide 1s linear forwards 10ms;
}
*/
    
    @keyframes slide {
        0% {
            left: 15%;
        }
        20% {
            left: 30%;
        }
        40% {
            left: 50%;
        }
        60% {
            left: 70%;
        }
        80% {
            left: 90%;
        }
        100% {
            left: 100%;
            overflow: hidden;
            opacity: 0;
            display: none;
            visibility: hidden;
        }
    }
    
    div.warn_msg {
        margin: auto;
        padding: 3px;
        border: 1px solid #eedf07;
        background-color: rgba(241, 245, 7, 0.788);
        color: #000000;
        text-align: center;
        bottom: 5px;
        left: 5px;
        position: fixed;
        /* Stay in place */
        z-index: 1;
        /* Sit on top */
        padding-top: 150px;
        /* Location of the box */
        width: 35%;
        /* Full width */
        height: 10%;
        /* Full height */
        /* Enable scroll if needed */
        background-color: #eedf07;
        /* Fallback color */
        background-color: rgba(241, 245, 7, 0.788);
        /* Black w/ opacity */
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        -webkit-animation-name: animatetop;
        -webkit-animation-duration: 1s;
        animation-name: animatetop;
        animation-duration: 1s;
        white-space: pre-wrap;
        margin-right: 25%;
        padding-bottom: 15px;
        padding-top: 15px;
        border-top: #eedf07 solid 30px;
        border-bottom: #eedf07 solid 30px;
        border-radius: 5px;
        cursor: pointer;
        animation: slide 3s linear forwards 5000ms;
    }
    
    div.note_msg {
        margin: auto;
        padding: 3px;
        border: 1px solid #058ee9;
        background-color: rgba(44, 193, 252, 0.932);
        color: #fcf7f6;
        text-align: center;
        bottom: 5px;
        left: 5px;
        position: fixed;
        /* Stay in place */
        z-index: 1;
        /* Sit on top */
        padding-top: 150px;
        /* Location of the box */
        width: 25%;
        /* Full width */
        height: 10%;
        /* Full height */
        /* Enable scroll if needed */
        background-color: #058ee9;
        /* Fallback color */
        background-color: rgba(44, 193, 252, 0.932);
        /* Black w/ opacity */
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        -webkit-animation-name: animatetop;
        -webkit-animation-duration: 1s;
        animation-name: animatetop;
        animation-duration: 1s;
        white-space: pre-wrap;
        margin-right: 25%;
        padding-bottom: 15px;
        padding-top: 15px;
        border-top: #058ee9 solid 30px;
        border-bottom: #058ee9 solid 30px;
        border-radius: 5px;
        cursor: pointer;
        animation: slide 3s linear forwards 5000ms;
    }
    
    @-webkit-keyframes animatetop {
        from {
            top: -90%;
            opacity: 0
        }
        to {
            top: 0;
            opacity: 1
        }
    }
    
    @keyframes animatetop {
        from {
            top: -90%;
            opacity: 0
        }
        to {
            top: 0;
            opacity: 1
        }
    }
    
    #title {
        margin-bottom: 10px;
        width: 100%;
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
    }
    
    #logzIn {
        border: 0 solid #F2F2F2;
        -moz-border-radius: 20px;
        -webkit-border-radius: 20px;
        border-radius: 20px;
        background-color: rgba(238, 238, 238, 0.85);
        -moz-box-shadow: inset 0 0 40px #7fd7f7;
        -webkit-box-shadow: inset 0 0 40px #7fd7f7;
        box-shadow: inset 0 0 40px #7fd7f7;
        -webkit-transition: .3s linear;
        -moz-transition: .3s linear;
        -o-transition: .3s linear;
        -ms-transition: .3s linear;
        transition: .3s linear;
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
    }
    
    #logzIn:hover {
        border: 0 solid #F2F2F2;
        -moz-border-radius: 20px;
        -webkit-border-radius: 20px;
        border-radius: 20px;
        background-color: rgba(250, 250, 250, 0.85);
        -moz-box-shadow: inset 0 0 20px #7fd7f7;
        -webkit-box-shadow: inset 0 0 20px #7fd7f7;
        box-shadow: inset 0 0 20px #7fd7f7;
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
    }
    
    #wrongz {
        -moz-border-radius: 25px;
        -webkit-border-radius: 25px;
        border-radius: 25px;
        background-color: rgba(255, 255, 255, 0.85);
        -webkit-transition: .3s linear;
        -moz-transition: .3s linear;
        -o-transition: .3s linear;
        -ms-transition: .3s linear;
        transition: .3s linear;
        width: 550px;
        padding: 50px;
        margin: 0 auto;
        margin-top: 25px;
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
    }
    
    #wrongz span {
        /* font-family: 'JFFlat-Regular', Tahoma, Helvetica, verdana, sans-serif; */
        font-size: 12px;
    }
    
    #wrongz span strong {
        color: #F00;
        /*  font-size: 12px; */
        margin-bottom: 10px;
        font-weight: normal;
    }
    
    #wrongz a {
        /*  font-size: 12px; */
        border: 1px solid #0bb3f1;
        background-color: #0bb3f1;
        color: #FFF;
        min-width: 108px;
        padding: 8px;
    }
    
    #wrongz a:hover {
        border: 1px solid #afafaf;
        background-color: #afafaf;
        color: #fff;
        padding: 8px;
        text-decoration: none;
    }
    
    #_stock_id_edit {
        float: left;
        padding: 5px;
    }
    
    #_stock_id_sel {
        float: left;
    }
    
    .rep_ie3 table {
        width: auto;
    }
    
    .rep_ie3 table a {
        -webkit-transition: .2s linear;
        -moz-transition: .2s linear;
        -o-transition: .2s linear;
        -ms-transition: .2s linear;
        transition: .2s linear;
        display: block;
        padding: 4px;
        width: 210px;
        border: 1px #eee solid;
        margin-top: 4px;
    }
    
    .rep_ie3 td {
        padding: 4px;
        width: auto;
    }
    
    .rep_ie3 table a:hover {
        background-color: #0bb3f1;
        color: #fff;
        text-transform: none;
        text-decoration: none;
    }
    
    .report_area {
        background: #eee;
        width: auto;
    }
    
    .report_area select {
        margin-top: 5px;
        margin-bottom: 5px;
        width: auto;
    }
    
    .report_area button {
        margin-bottom: 5px;
    }
    
    .modal {
        display: none;
        /* Hidden by default */
        position: fixed;
        /* Stay in place */
        z-index: 1;
        /* Sit on top */
        padding-top: 150px;
        /* Location of the box */
        left: 0;
        top: 0;
        width: 100%;
        /* Full width */
        height: 100%;
        /* Full height */
        overflow: auto;
        /* Enable scroll if needed */
        background-color: rgb(0, 0, 0);
        /* Fallback color */
        background-color: rgba(0, 0, 0, 0.4);
        /* Black w/ opacity */
    }
    
    .modal-close {
        -webkit-animation-name: mclose;
        -webkit-animation-duration: 0.4s;
        animation-name: mclose;
        animation-duration: 0.4s
    }
    /* Modal Content */
    
    .modal-content {
        position: relative;
        background-color: #fefefe;
        margin: auto;
        padding: 0;
        border: 1px solid #888;
        width: 70%;
        font-size: 20px;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        -webkit-animation-name: animatetop;
        -webkit-animation-duration: 0.4s;
        animation-name: animatetop;
        animation-duration: 0.4s
    }
    /* Add Animation

@-webkit-keyframes animatetop {
    from {
        top: -200px;
        opacity: 0
    }
    to {
        top: 0;
        opacity: 1
    }
}

@keyframes animatetop {
    from {
        top: -200px;
        opacity: 0
    }
    to {
        top: 0;
        opacity: 1
    }
}

*/
    /* The Close Button */
    
    .close {
        position: relative;
        color: #000;
        background-color: #fff;
        float: left;
        font-size: 30px;
        font-weight: bold;
        text-align: center;
        width: 30px;
        height: 30px;
        border-radius: 50px;
        z-index: 10000;
    }
    
    .close:hover,
    .close:focus {
        color: #555;
        text-decoration: none;
        cursor: pointer;
        border-radius: 50%;
    }
    
    .modal-header {
        padding: 10px 5px;
        background-color: #ff8401;
        color: white;
        font-size: 16px;
        height: 50px;
    }
    
    .modal-body {
        padding: 12px 12px;
        white-space: pre-wrap;
        font-size: 14px;
        color: #555;
        width: 100%;
    }
    
    .modal-footer {
        padding: 2px 16px;
        background-color: #5cb85c;
        color: white;
    }
    
    @-webkit-keyframes mclose {
        0% {
            left: 50%;
        }
        100% {
            left: 100%;
        }
    }
    
    @keyframes mclose {
        0% {
            left: 50%;
        }
        100% {
            left: 100%;
        }
    }