#message {
    visibility:hidden;
    width:100%;
    text-align: center;
    color:white;
    font-weight:bold;
}

#message a {
    color:white;
    text-decoration: underline;
}

.icon-medium {
    width: 150px;
}

.tick {
    color:darkgreen;
    cursor: pointer;
}

.cross {
    color:darkred;
    cursor:pointer;
}

.jsontick {
    color:darkgreen;
    cursor: pointer;
}

.jsoncross {
    color:darkred;
    cursor:pointer;
}

.hidden {
    display:none;
}

.editable {
    cursor:pointer;
}
.editable:hover {
    border:1px solid red;
}

.jsoneditable {
    cursor:pointer;
}
.jsoneditable:hover {
    border:1px solid red;
}


.description {
    font-size:0.75em;
}

.numberCircle.s20 {width:20px;height:20px;}
.numberCircle.s30 {width:30px;height:30px;}
.numberCircle.red { color:red !important;  border-color:red !important; }
.numberCircle.green { color:green !important; border-color:green !important;}
.numberCircle.blue { color:#007bff !important; !important; border-color:#007bff !important;}

.numberCircle {
    display:inline-block;
    border-radius: 50%;
    behavior: url(PIE.htc); /* remove if you don't care about IE8 */
    border: 2px solid;
    text-align: center;
}

.fixheader {
    overflow: hidden;
    position: fixed;
    background-color: rgb(255, 255, 255);
    top: 0;
    width: 100%;
    box-shadow: 1px 3px 4px rgb(163, 163, 163);
    z-index:10;
  }

  .fixheader a {
    float: left;
    display: block;
    color: #1100ff;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 17px;
  }
  
.center {
    text-align: center;
    margin: auto;
}

.highlights {
    width: 100%;
    margin: 2.5rem 0;
    display: -moz-flex;
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    -moz-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -moz-align-items: -moz-stretch;
    -webkit-align-items: -webkit-stretch;
    -ms-align-items: -ms-stretch;
    align-items: stretch; }
    .highlights > * {
        -moz-flex-shrink: 1;
        -webkit-flex-shrink: 1;
        -ms-flex-shrink: 1;
        flex-shrink: 1;
        -moz-flex-grow: 0;
        -webkit-flex-grow: 0;
        -ms-flex-grow: 0;
        flex-grow: 0; }
    .highlights > * {
        width: 33.3333333333%; }
    .highlights > * {
        padding: 1.5rem;
        width: calc(33.3333333333% + 1rem); }
    .highlights > :nth-child(-n + 3) {
        padding-top: 0; }
    .highlights > :nth-last-child(-n + 3) {
        padding-bottom: 0; }
    .highlights > :nth-child(3n + 1) {
        padding-left: 0; }
    .highlights > :nth-child(3n) {
        padding-right: 0; }
    .highlights > :nth-child(3n + 1),
    .highlights > :nth-child(3n) {
        width: calc(33.3333333333% + -0.5rem); }
    .highlights .content {
        border-radius: 4px;
        height: 10rem;
        padding: 3rem;
        text-align: center; }
        .highlights .content .icon {
        font-size: 5rem; }
    .highlights > div > :last-child {
        margin-bottom: 0; }
    

.highlights .content {
    background: #ffffff;
    box-shadow: 0px 0px 20px 2px rgb(53, 48, 97); 
}

.wrapper {
    padding: 2rem 0 1rem 0 ;
    position: relative;
    z-index: 1; }
    @media screen and (max-width: 1280px) {
        .wrapper {
        padding: 4rem 0 2rem 0 ; } }
    @media screen and (max-width: 736px) {
        .wrapper {
        padding: 3rem 0 1rem 0 ; } }
    @media screen and (max-width: 480px) {
        .wrapper {
        padding: 2rem 0 0.1rem 0 ; } 
}
.inner {
    margin: 0 auto;
    width: 75rem;
    max-width: calc(100% - 6rem); }
    @media screen and (max-width: 480px) {
        .inner {
        max-width: calc(100% - 3rem); } 
}

.snapshot:hover{
    transform: scale(10, 10);
    margin-left: 100px;
    margin-right: 100px;
   /* -moz-box-shadow:    0 0 50px red;
   -webkit-box-shadow: 0 0 50px red; */
   box-shadow:         0 0 5px grey;  
}

#table_deals {
    margin-left:auto;
    margin-right:auto;
}

.disabledField {
    color:grey;
    border: none;
}

.remarks {
    max-width:350px;
}

.DATE-NOTSET { color:red; font-weight: bold;}
.DATE-LATE { color:red; font-weight: bold;}
.DATE-NEXT7 { color:orange;}

.reportCCY { font-weight: bold; cursor: pointer; }