﻿::-webkit-input-placeholder { /* Safari, Chrome and Opera */
    color: darkgray;
    font-style: italic;
}

:-moz-placeholder { /* Firefox */
    color: darkgray;
    font-style: italic;
}

:-ms-input-placeholder { /* IE 10+ */
    color: darkgray;
    font-style: italic;
}

:-ms-input-placeholder { /* Edge */
    color: darkgray;
    font-style: italic;
}

::placeholder { /* Default */
    color: darkgray;
    font-style: italic;
}



.img_g2t {
    width: 18px;
    opacity: 0.8;
    transition: 0.3s ease;
}
    .img_g2t:hover {
        -webkit-transform: scale(1.4);
        -ms-transform: scale(1.4);
        transform: scale(1.4);
        opacity: 1;
        transition: 0.3s ease;
    }

.img_navgo {
    width: 14px;
    opacity: 1;
    transition: 0.3s ease;
}
    .img_navgo:hover {
        -webkit-transform: scale(1.3);
        -ms-transform: scale(1.3);
        transform: scale(1.3);
        opacity: 1;
        transition: 0.3s ease;
    }

/*.usermessage {
    width: 80%;
    text-align: center;
    font-size: 11pt;
    font-weight: bold;
    margin-left: 20px;
    margin-right: 20px;
}*/

.siteHeader {
    font-family: Lato;
    font-size: 12.5pt;
    letter-spacing:3.0pt;
    color: red;
    font-weight: normal;
}

.labelStandard {
    font-family: Lato;
    font-size: 9.5pt;
    /*letter-spacing:1.0pt;*/
}

.textboxStandard {
    border: none;
    border-radius: 0px;
    background-color: #F0F0F0;
    padding: 5px;
    width: 90%;
    font-size: 9.5pt;
    outline: none
}

.textboxDate, select:focus {
    width: 100px;
    max-width: 100px;
    font-family: Lato;
    text-align: center;
    border: 1px solid #BDBDBC;
    border-radius: 0px;
    background-color: white;
    padding: 5px;
    font-size: 9pt;
    outline: none;
    /*letter-spacing:1.0pt;*/
}

.ddlStandard, select:focus {
    border: 1px solid gray;
    border: 1px solid gray;
    border-radius: 0px;
    padding: 5px;
    font-size: 9pt;
    background-color: white;
    text-align: left;
    min-width: 200px;
}

.ddlStandard option {
    background-color: white;
}

select:focus {
    outline: 0;
}

select {
    border: none;
    outline: none;
    border-radius: 0px 0px 0px 0px;
    scroll-behavior: smooth;
}

.textbox-otp {
    display: flex;
    color: red;
    align-self: center;
    width: 90%;
    max-width: 200px;
    min-width: 150px;
    height: 30px;
    font-size: 14pt;
    text-align: center;
    font-weight: bold;
    border: none;
    border-radius: 0px;
    background-color: #F0F0F0;
    padding: 8px;
    letter-spacing: 10pt;
}

.usermessage {
    width: 80%;
    text-align: center;
    font-size: 11pt;
    font-weight: bold;
    margin-left: 20px;
    margin-right: 20px;
}

.dvShowArchived {
    padding: 5px 0px 5px 0px;
}
.chkShowArchived {
    color: blue;
    font-size: 10.2pt;
    font-family: Lato;
    letter-spacing: 0.5pt;
}

.dvNewTask {
    padding: 5px 0px 5px 0px;
}
.lnkNewTask {
    Font-Size: 10.2pt;
    text-align: left;
    margin-left: 2px;
    color: blue;
    font-family: Lato;
    letter-spacing:0.5pt;
}

.float_top {
    position: fixed;
    z-index: 1;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 60px;
    background-color: #54acd1;
    /*background-color: #54acd1;*/
    text-align: left;
    vertical-align: middle,central;
    /*border-bottom-color: black;*/
    border-width: 0px;
    border-style: none;
    color: darkslategrey;
    font-size: 14pt;
    font-weight: bold;
    font-family: Lato;
}

.DashBoardKPI {
    border-style: solid;
    border-width: 1px;
    border-color: #AED6F1;
    /*border-radius: 6px 6px 6px 6px;*/
    text-align: center;
    box-shadow: #f2f2f0 4px 4px;
}

.gridDeleteButton{
    background-color:red;
    border:0px solid red;
    border-radius:4px 4px 4px 4px;
    color:white;
    font-weight:bold;
    height:25px;
}

.dvDivDefault, defaultfont {
    display: flex;
    flex-direction: column;
    gap: 8px;
    justify-content: center;
    justify-self: center;
    margin-right: auto;
    margin-left: auto;
    width: 98%;
    text-align: center;
}

.rptTable {
    border: none;
    /*border: 1px solid lightgrey;*/
    /*border-radius: 4px 4px 4px 4px;*/
    border-collapse: collapse;
    margin-left: 0px;
}

.rptTableX {
    margin-left: auto;
    margin-right: auto;
    width: 98%;
}

.rptTRHeaderX, defaultfont {
    display: grid;
    grid-template-columns: repeat(var(--table-cols), 1fr);
    vertical-align: top;
    text-align: left;
    background-color: #F2F3F4;
    border: 1px solid #BDBDBD;
    text-align: left;
}

.rptTRItemX, defaultfont {
    display: grid;
    grid-template-columns: repeat(var(--table-cols), 1fr);
    background-color: white;
}

.rptTDItemX, defaultfont {
    overflow: hidden; /* Hide overflowing content */
    /*white-space: nowrap;*/ /* Prevent wrapping of long content */
    text-overflow: ellipsis;
    font-size: 10pt;
    color: #585858;
    text-align: left;
}

.rptTRHeader {
    vertical-align: middle;
    /*margin: 8px 8px 8px 8px;*/
    text-align: left;
    background-color: #F2F3F4;
    border: 1px solid #BDBDBD;
    font-size: 10pt;
}

.rptTRItem {
    text-align: left;
    vertical-align: middle;
    font-size: 9pt;
    /*padding*/: 4px 0px 4px 0px;
    margin: 4px 2px 4px 2px;
    background-color: white;
    color: #848484;
    border-bottom: solid;
    border-bottom-width: 1px;
    border-bottom-color: #F2F3F4;
    padding: 4px 0px 4px 0px;
}

.rptTDItem {
    text-align: left;
    vertical-align: middle;
    font-size: 9pt;
    /*padding: 4px 0px 4px 0px;*/
    margin: 4px 2px 4px 2px;
    color: #6b6b6b;
    border-bottom: solid;
    border-bottom-width: 1px;
    border-bottom-color: #F2F3F4;
}

.rptTRAltItem {
    background-color: white;
    color: #848484;
    vertical-align: middle;
}

.rptTRSpan {
    margin-left: 0px;
    font-size: 9pt;
    color: #333333;
    font-weight: bold;
    text-align: left;
    border-width: 0px;
}

.rptHeaderSpan {
    margin: 8px 0px 8px 4px;
    font-size: 10pt;
    color: #6b6b6b;
    font-weight: bold;
    text-align: left;
    border-width: 0px;
}

.rptTDHeader {
    text-align: left;
    margin: 8px 0px 8px 0px;
    padding-bottom: 5px;
    padding-top: 5px;
    font-size: 10pt;
}

.divFrameMain {
    /*background-color: #AED6F1;*/
    border: solid;
    border-width: 2px;
    border-color: #AED6F1;
    background-color: white;
    border-radius: 0px 0px 0px 0px;
    /*border-radius: 4px 4px 4px 4px;*/
    text-align: left;
    margin: 0 auto;
    width: 98%;
    padding: 0px;
}

.divFrameHeader {
    background-color: #AED6F1;
    border: none;
    text-align: center;
    padding-top: 2px;
    padding-bottom: 4px;
}

.divFrameHeaderText {
    background-color: #AED6F1;
    color: white;
    font-weight: normal;
    font-size: 11pt;
    text-align: left;
    vertical-align: middle;
    letter-spacing:1.5pt;
    font-family: Lato;
}

.divContentNormal {
    border: solid;
    border-width: 2px;
    border-color: #AED6F1;
    background-color: white;
    /*box-shadow: 5px 5px 5px #C8C8C8;*/
    /*border-radius: 4px 4px 4px 4px;*/
    /*margin: 5px 5px 5px 5px;*/
    text-align: left;
    /*font-family: Calibri, Trebuchet MS;*/
    margin: 0 auto;
}

.divContainerHeader {
    border: none;
    /*border-radius: 4px 4px 0px 0px;*/
    border-width: 0px;
    /*border-color: lightgray;*/
    background-color: #AED6F1;
    /*box-shadow: 0px 0px 0px #ffffff;*/
    margin: -3px 0px 0px -3px;
    padding: 0px 0px 0px 0px;
    /*min-height: 25px;*/
    height: 25px;
    /*min-width: 100px;*/
    width: 100.5%;
    text-align: center;
    vertical-align: top;
    /*font-family: Calibri, Trebuchet MS;*/
}

.divContainerheaderText {
    background-color: #AED6F1;
    color: white;
    font-weight: bold;
    font-size: 10.5pt;
    text-align: left;
    vertical-align: middle;
    /*height: 100%;*/
    margin: 10px 10px 10px 10px;
    width:100%;
}

.csLogo {
    width: 84px;
    padding-top:5px;
}

.csImageDocView {
    /*width: 90%;
    max-width: 900px;
    max-height: 650px;*/
    border: none;
    padding: 4px 4px 4px 4px;
    border-radius: 2px 2px 2px 2px;
}

.csLogo_GMT {
    height: 25px;
}

.trustedsite_logo {
    width: 90px;
    height: 15px;
    margin-top:10px;
}

.payment-logo {
    width: 250px;
    height: 250px;
}

.dvDivDefault {
    display: flex;
    flex-direction: column;
    gap: 8px;
    justify-content: center;
    justify-self: center;
    margin-right: auto;
    margin-left: auto;
    width: 95%;
    text-align: center;
    max-width: 800px;
}

.boxheader {
    text-align: center;
    /*border: 1px solid lightgray;*/
    border-radius: 8px 8px 8px 8px;
    background-color: #F8F9F9;
}

.dvHeader {
    width: 98%;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    border-radius: 0px 0px 0px 0px;
    color: white;
    font-size: 11pt;
    letter-spacing: 4px;
}

.dvHeaderExp {
    font-size: 12pt;
    font-weight: bold;
    padding-right: 4px;
}

.dvHeaderExp {
    font-size: 12pt;
    font-weight: bold;
    padding-right: 4px;
}

.usermessage {
    font-family: Lato;
    font-size: 9.5pt;
    font-weight: normal;
    text-align: center;
    letter-spacing:1.0pt;
}

.fade-in {
    animation: fadeIn 4s;
}

.fade-inX {
    animation: fadeInX 1s;
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fadeOut {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes fadeInX {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fadeOutX {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}


.txtStandard {
    border: none;
    /*border: 1px solid gray;*/
    border-radius: 0px;
    /*border-radius: 8px;*/
    background-color: #F0F0F0;
    padding: 5px;
    width: 95%;
    font-family:Lato;
    font-size: 9.5pt;
    outline: none
}

.chkStandard {
    display: flex;
    flex-direction: column;
    gap: 6px;
    justify-content: left;
}

.btnManageClaim {
    height: 25px;
    /*min-width: 150px;*/
    background-color: #54acd1;
    font-size: 10pt;
    border-style: none;
    color: white;
    /*border-radius: 5px 5px 5px 5px;*/
}

.btnEFC {
    height: 40px;
    width: 400px;
    background-color: #54acd1;
    font-size: 14pt;
    border-style: none;
    color: salmon;
    font-weight: bold;
}

.btnStandard {
    height: 26px;
    min-width: 120px;
    background-color: #54acd1;
    font-size: 10.5pt;
    font-family: Lato;
    letter-spacing: 1.2pt;
    font-weight: normal;
    border-style: none;
    border-width: 0px;
    color: white;
    text-align: center;
    border-radius: 3px 3px 3px 3px;
    margin: 4px 0px 4px 0px;
}

.btnAttractX {
    height: 22px;
    min-width: 80px;
    background-color: #54acd1;
    font-size: 9.4pt;
    font-family: Lato;
    letter-spacing: 0.5pt;
    font-weight: normal;
    border-style: none;
    border-width: 0px;
    color: white;
    text-align: center;
    border-radius: 2px 2px 2px 2px;
    margin: 4px 0px 4px 0px;
}

.round-button {
    display: block;
    width: 22px;
    height: 22px;
    /*line-height: 50px;*/
    border: none;
    border-radius: 50%;
    /*color: #79828B;*/
    text-align: center;
    text-decoration: none;
    background: lightgray;
    /*box-shadow: 0 0 3px gray;*/
    /*font-size: 20px;
    font-weight: bold;
    text-align: center;*/
    align-content: center;
    align-items: center;
    align-self: center;
    vertical-align: middle;
}

.textbox-standard {
    color: black;
    width: 150px;
    height: 25px;
    font-size: 10pt;
}

.textbox-signature {
    color: red;
    width: 350px;
    height: 30px;
    font-size: 16pt;
    font-family:Lucida Handwriting;
    font-weight:bold;
}

.label-summary {
    /*font-family: Verdana;*/
    color: #494949;
    font-size: 9pt;
    margin-left: 2px;
}

.ReportFilterControls {
    color: #494949;
    font-size: 9.5pt;
    margin: 10px 10px 10px 0px;
}

.ReportFilterDivs {
    margin: 10px 10px 10px 10px;
    vertical-align: middle;
}

.textbox-multiline {
    color: black;
    width: 500px;
    height: 100px;
    font-size: 9pt;
}

.label-standard {
    font-size: 10pt;
    font-weight: normal;
    font-family:Lato;
}

.label-attract{
    font-size:10pt;
    font-weight:bold;
}

.csProgress {
    border-style: none;
    /*border-width: 1px;*/
    background-color: #DAF3DA;
    border-radius: 4px 4px 4px 4px;
}

.label-progress {
    font-size: 10pt;
    font-weight: normal;
    border-style: none;
    /*border-width: 1px;*/
    /*background-color: #DAF7A6;*/
    border-radius: 4px 4px 4px 4px;
    color: lightgray;
}

.ddl-standard {
    font-family: Lato;
    font-size: 10pt;
}

.expandcollapse {
    font-family: Lato;
    font-size: 10pt;
    color: blue;
}
.expandcollapsetext {
    font-family: Lato;
    font-size: 9pt;
    color: blue;
    background-color:aliceblue;
    border-style:solid;
    border-width:1px;
    border-color:lightgray;
    border-radius:5px 5px 5px 5px;
}

ajax__myTab .ajax__tab_header {
    font-family: Lato;
    font-size: 10pt;
    font-weight: normal;
    color: #2E2E2E;
    outline: 0;
    border-bottom: solid 1px #E1E0DF;
}

.ajax__myTab .ajax__tab_outer {
    padding-right: 4px;
    height: 26px;
    background-color: #E1E0DF;
    color: #2E2E2E;
    outline: 0;
    margin-right: 2px;
    border-right: solid 1px #E1E0DF;
    border-top: solid 1px #E1E0DF;
    font-family: Lato;
    font-size: 10pt;
    font-weight: normal;
}

.ajax__myTab .ajax__tab_inner {
    padding-left: 3px;
    background-color: #E1E0DF;
    color: #2E2E2E;
    outline: 0;
    font-family: Lato;
    font-size: 10pt;
    font-weight: normal;
}

.ajax__myTab .ajax__tab_tab {
    height: 14px;
    padding: 4px;
    margin: 0;
    color: #2E2E2E;
    outline: 0;
    font-family: Lato;
    font-size: 10pt;
    font-weight: normal;
}

.ajax__myTab .ajax__tab_hover .ajax__tab_outer {
    background-color: #fff;
}

.ajax__myTab .ajax__tab_hover .ajax__tab_inner {
    background-color: #fff;
}

.ajax__myTab .ajax__tab_hover .ajax__tab_tab {
}

.ajax__myTab .ajax__tab_active .ajax__tab_outer {
    background-color: #fff;
    border-left: solid 1px #E1E0DF;
    color: #2E2E2E;
    outline: 0;
}

.ajax__myTab .ajax__tab_active .ajax__tab_inner {
    background-color: #fff;
    color: #2E2E2E;
    outline: 0;
}

.ajax__myTab .ajax__tab_active .ajax__tab_tab {
}

.ajax__myTab .ajax__tab_body {
    font-family: Lato;
    font-size: 10pt;
    border: 1px solid #E1E0DF;
    border-top: 0;
    padding: 8px;
    background-color: #ffffff;
    color: #2E2E2E;
    outline: 0;
}

.switch {
    position: relative;
    display: inline-block;
    width: 42px;
    height: 22px;
    top: 0px;
    /*left: 848px;*/
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    left: 4px;
    bottom: 1px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked + .slider {
    background-color: #AED6F1;
}

input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
    -webkit-transform: translateX(16px);
    -ms-transform: translateX(16px);
    transform: translateX(16px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 25px;
}

    .slider.round:before {
        border-radius: 50%;
    }

