@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;400&display=swap');
@import url('https://fonts.cdnfonts.com/css/helvetica-neue-5');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;400;500&display=swap');
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" integrity="sha512-oCtY3R5JxvLVyTNqKoK5YvOBZ+uCTPblO6+BwlR+OKWbif+gFqb2CyXp4i+dw/DuJ6oq6KjEkz2pCUi0jrGGIA==" crossorigin="anonymous" />

@font-face {
    font-family : Jeko-SemiBold;
    src: url(jeko-semibold.ttf)
}
ticket-dropdown-menu
@font-face {
    font-family : Jeko-ExtraBold;
    src: url(jeko-extrabold.ttf)
}
/* **********Styles for Header********** */

.custom-dropdown {
    position: absolute;
    top: 3.72%;
    left: 85%;
}

.custom-dropdown .dropdown-toggle {
    display: block;
    width: 100%;
    height: 100%;
    color: white;
    text-align: center;
    text-decoration: none;
    line-height: 51px; 
    cursor: pointer;
    position: relative;
    z-index: 1;
}
.custom-dropdown ul.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    width: 130px !important; 
    background-color: transparent; 
    list-style: none;
    padding: 0;
    margin: 0;
    min-width: 130px !important;
}

.custom-dropdown ul.dropdown-menu li {
    margin: 0;
    padding: 0;
}

.custom-dropdown ul.dropdown-menu li a {
    width: 138px;
    height: 35px;
    top: 3297px;
    left: 85px;
    background: rgba(233, 240, 248, 1);
    font-family: Inter;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0em;
    text-align: left;
    color: rgba(0, 0, 0, 1);
    display: block;
}
.custom-dropdown ul.dropdown-menu li:first-child a {
    border-radius: 6px 6px 0 0; /* Rounded corners for the first item */
}
.custom-dropdown ul.dropdown-menu li:last-child a {
    border-radius: 0 0 6px 6px; /* Rounded corners for the last item */
}
.custom-dropdown ul.dropdown-menu li:not(:last-child) {
    margin-bottom: 1px; /* Add margin to create space between items */
}
.custom-dropdown ul.dropdown-menu li:hover {
    background: rgba(255, 255, 255, 1);
    border-radius: 0; 
}
.custom-dropdown .dropdown-menu>li>a:focus,.custom-dropdown .dropdown-menu>li>a:hover {
    padding: 1px 18px;
    border: none;
    background: rgba(255, 255, 255, 1);
    border-radius: 0;
}
.nav-header-links {
    position: absolute; 
    top: 5.73%; 
    left: 44%; 
}
.nav-header-links a {
    margin-right: 30px; 
    color: rgba(0, 0, 0, 1);
    font-weight: 600; 
    line-height: 22.96px;
    font-size: 16px;
    font-family: 'jeko-regular';
}
.nav-header-links a:hover {
    background: rgba(255, 255, 255, 1);
    color: rgba(0, 0, 0, 1) !important;
}
.search-icon-container{
    width: 50px;
    height: 51px;
    top: 3.72%;
    left: 80%;
    border-radius: 10px;
    position: absolute;
    text-align: center;
    background: rgba(255, 255, 255, 1);
}
.profile-icon-container{
    width: 50px;
    height: 51px;
    top: 3.72%;
    left: 92%;
    background: rgba(0, 227, 140, 1);
    position: absolute;
    border-radius: 10px; 
    text-align: center;
}
.profile-icon-container:hover{
    background: rgba(83, 253, 152, 1);
}
.portal-button{
    height: 4.41%;
    top: 5.15%;
    font-family: 'jeko-regular';
    font-size: 16px;
    font-weight: 600;
    line-height: 23px;
    letter-spacing: 0em;
    text-align: center;
    border-radius: 50px;
    border-color: transparent;
    width: 6.36%;
    left: 21.44%;
    background: rgba(30, 46, 217, 1);
    color: rgba(255, 255, 255, 1);
    position: absolute;
}
.webshop-button{
    height: 4.41%;
    top: 5.15%;
    font-family: 'jeko-regular';
    font-size: 16px;
    font-weight: 600;
    line-height: 23px;
    letter-spacing: 0em;
    text-align: center;
    border-radius: 50px;
    border: transparent;
    width: 13.90%;
    left: 21.44%;
    background: rgba(30, 46, 217, 0.2);
    border: tansparent;
    position: absolute;
    padding-left: 70px;
    color: rgba(255, 255, 255, 1);
}
/* **********Styles for Header Mobile********** */
@media only screen and (max-width: 600px){
.custom-dropdown{
    width: 60px !important;
    height: 45px !important;
    left: 55%;
}
}

/* **********Styles for Cookie Consent Page and PopUp********** */
.cookies-consent-popup{
    display: none; 
    position: fixed; 
    top: 280px; 
    left: 50%;
    height: 396px; 
    width: 609px;  
    transform: translate(-50%, -50%);
    background-color: #FFFFFF; 
    box-shadow: 0px 4px 40px 0px #00000040;
}
p.cookies-body-background{
    position: absolute;
    width: 900px;
    height: 69px;
    top: 113px;
    left: 378px;
    position:fixed;
    font-family: jeko-semibold;
    font-size: 48px;
    font-weight: 600;
    line-height: 69px;
    letter-spacing: 0em;
    text-align: left;
    color: #000000;
}

p.cookies-header{
    width: 125px;
    height: 40px;
    position: fixed;
    top: 48px;
    left: 60px;
    font-family: Jeko-SemiBold;
    font-size: 32px;
    font-weight: 400;
    line-height: 40px;
    letter-spacing: 0em;
    text-align: left;
    color: #000000;
}

p.cookies-content{
    width: 489px;
    height: 220px;
    top: 100px;
    left: 60px;
    right: 60px;
    position: fixed;
    font-family: Inter;
    font-size: 18px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: 0em;
    text-align: left;
    color: #000000;
}

a.cookies-policy{
    color: #00CF80;
    text-decoration: none;
}

.cookies-close-button{
    position: fixed;
    width: 22px;
    height: 22px;
    top: 60px;
    right: 60px;
    left: 527px;
    cursor: pointer;
}

.cookies-button{
    position: fixed;
    display: table-row-group;
    text-align: center;
    font-family: Inter;
    text-decoration-color: #000000;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0em;
    width: 214px;
    height: 48px;
    top: 288px;
    padding: 4px 16px 4px 16px;
    border-radius: 6px;
    gap: 4px;
    cursor: pointer;
    background: #00E38C; 
    border: none;
}

.cookies-button:hover{
    background-color: #53FD98;
}

.cookies-button-left{
    left: 81px;
}

.cookies-button-right{
    left: 315px;
}

/* **********Cookies - CSS Styles for the Mobile Screens********** */

@media only screen and (max-width: 600px) {

    p.cookies-body-background{
        position: relative;
        width: 300px;
        height: 35px;
        top: -30px;
        left: 47px;
        font-size: 20px;
        line-height: 30px;
    }

    .cookies-consent-popup{
        height: 265px; 
        width: 309px;  
    }

    p.cookies-header{
        width: 50%;
        height: 85px;
        top: 20px;
        left: 30px;
        font-size: 18px;
    }

    .cookies-consent-popup {
        top: 130px;
        position: relative;
    }

    .cookies-close-button{
        position: fixed;
        width: 11px;
        height: 11px;
        top: 35px;
        right: 30px;
        left: 270px;
    }

    p.cookies-content{
        width: 245px;
        height: 100px;
        font-size:10px;
        top: 65px;
        left: 30px;
        right: 30px;
        line-height: 16px;
    }

    .cookies-button{
        font-size: 7px;
        font-weight: 500;
        line-height: 16px;
        width: 100px;
        height: 26px;
        top: 210px;
    }
    
    .cookies-button-left{
        left: 45px;
    }

    .cookies-button-right{
        left: 160px;
    }
  }

/* **********Styles for Forgot Password page********** */

.forgot-password-page .hidden-print,.forgot-password-page .help-block,.forgot-password-page .forgot-password-heading {
    display: none;
}
.forgot-password-page {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0;
    text-align: center;
    padding: 20px;
    border-radius: 8px;
}
.forgot-password-Conf-page{
    display: flex;
    justify-content: center;
    align-items: center;
}
.forgot-password-container{
    text-align: center;
    padding: 20px;
    border-radius: 8px;
    margin: 198px auto 0;
}

.forgot-password-container .heading {
    font-family: Jeko-SemiBold !important;
    font-size: 48px;
    font-weight: 400;
    line-height: 57px;
    letter-spacing: 0em;
    text-align: center;
    color: rgba(0, 0, 0, 1);
    margin-bottom: 30px;
    transform: translate(0px, -100px);
}
.forgot-password-container .subtext{
    font-family: Jeko-SemiBold;
    font-size: 18px;
    font-weight: 400;
    line-height: 21px;
    letter-spacing: 0em;
    text-align: left;
    color: rgba(0, 0, 0, 1);
    margin: 0 auto;
    max-width: 400px;
    top: 32%;
    transform: translate(0px, -110px);
}
.forgot-password-page .form-group, .reset-password-page .form-group{
    text-align: left;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    margin: 0px auto 20px;
    max-width: 400px;
    position: relative;
}
.control-label, .reset-password-page .control-label{
    font-family: "inter" !important;
    font-weight: 400;
    line-height: 21.78px;
    color: rgba(0, 0, 0, 1);
    word-break: normal !important;
    width: 200px;
    text-align: left !important
}

.forgot-password-page .form-control, .reset-password-page .form-control{
    color: rgba(86, 101, 115, 1);
    background-color: rgba(233, 240, 248, 1) !important;
    border-color: #e9f0f8;
    border: 1px solid #ced4da;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    background-clip: padding-box;
    font-family: "Inter";
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0em;
    text-align: left;
    width: 371px;
    height: 48px;
    padding: 8px 12px;
    border-radius: 4px;
    gap: 8px;
}
.form-control:focus, .form-control:active{
   background-color: #fff !important;
   border: 2px solid rgba(30, 46, 217, 1);
   box-shadow: none !important;
   outline: none !important;
}

.forgot-password-page .btn.btn-primary{
    width: auto;
    height: 32px;
    padding: 4px 16px;
    border-radius: 6px;
    background-color: rgba(0, 227, 140, 1);
    color: rgba(0, 0, 0, 1);
    cursor: pointer;
    font-family: Inter;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0em;
    text-align: left;
    margin-left: 230px;
    border: none;
    background-image: none;
}
.btn.btn-primary:hover, .btn.btn-primary:active, .btn.btn-primary:focus{
    background-color: rgba(83, 253, 152, 1);
    background-image: none;
}
.btn.btn-primary:active, .btn.btn-primary:focus{
    border: none !important;
    background-image: none;
}
.forgot-password-page a{
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 30px;
    letter-spacing: 0em;
    text-align: left;
    color: rgba(219, 0, 33, 1);
} 
.forgot-password-page a:hover{
    color: rgba(219, 0, 33, 1);
}
.forgot-password-page .alert{
    padding: 0px;
    margin-bottom: 0px;
    border: none;
    border-radius: 0px;
    position: relative;
    top: 110px;
    left: -80px;
}
.forgot-password-container .heading{
    font-size: 45px;
}
.forgot-password-container .subtext{
    font-size: 17px;
}
.forgot-password-page .form-horizontal{
    transform: translate(0px, -110px);
}
.forgot-password-page .alert-danger {
    background-color: transparent;
    border-color: transparent;
    color: transparent;
    border: none;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    transform: translate(160px, -5px)
}
/* **********Styles for Forgot Password page for mobiles********** */

@media only screen and (max-width: 767px) {
.forgot-password-container .heading{
    transform: translate(0px, -140px);
}
.forgot-password-container .subtext{
    transform: translate(20px,-145px);
}
.forgot-password-page .form-horizontal{
    transform: translate(20px, -150px);
}
.forgot-password-page .form-control{
    width: 270px;
    height: 40px;
}
.forgot-password-page .btn.btn-primary{
    margin-left: 200px;
}
.forgot-password-page a{
    font-size: 14px;
}
.forgot-password-page .alert{
    position: relative;
    top: 95px;
    left: -70px;
}
.forgot-password-page .alert-danger{
    transform: translate(90px, -5px);
}
}

 /* **********Styles for Reset Password Confirmation page ********** */
.reset-password-page{
    display: flex;
    justify-content: center;
    align-items: center;
}
.reset-password-page legend{
    font-family: Jeko-SemiBold !important;
    font-size: 48px;
    font-weight: 400;
    line-height: 57px;
    letter-spacing: 0em;
    text-align: center;
    border-bottom: none;
}
.reset-password-page .control-label{
    width: 300px;
    text-align: left;
    font-size: 18px;
}
.reset-password-page  .btn-primary{
    width: auto;
    height: 32px;
    padding: 4px 16px;
    border-radius: 4px;
    gap: 4px;
    background: rgba(0, 227, 140, 1);
    font-family: "inter";
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    font-width: 47px;
    font-height: 24px;
    font-color:  rgba(0, 0, 0, 1);
    position: absolute;
    left: 65%;
}
.reset-password-page .validation-summary-errors ul {
    list-style-type: none;
}
.reset-password-page .alert{
    padding: 0px;
    margin-bottom: 0px;
    border: none;
    transform: translate(-5%, 195px);
}
.reset-password-page .alert-danger {
    color: rgba(219, 0, 33, 1);
}
/* **********Styles for Reset Password page for mobiles********** */
@media only screen and (max-width: 600px){
.reset-password-page legend {
    font-size: 40px;
}
.reset-password-page .form-control {
    width: 320px;
}
}
 /* **********Styles for common  elements ********** 

#customer-portal .allactivetickets-table {
    padding-top: 50px;
    position: relative;
}
#customer-portal .view-select li{
    background-color: #E9F0F8;
    font-family: "inter";
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    width: auto;
    height: 48px;
    border-radius: 6px;
}
#customer-portal .entitylist-search {
    position: absolute;
    left: 0;
}
#customer-portal .entitylist-download{
    max-width: 153px;
    min-height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
}

#customer-portal .view-select.nav-pills{
    position:absolute;
    right:150px;
}
#customer-portal .grid-actions{
    margin-bottom:30px;
}

@media (max-width: 600px) {
.portalcontiner {
    padding-left: 80px;
    padding-right: 80px;
}
.section-header {
    margin-top: 0px;
}
.section-header h1 {
    margin-bottom: 30px;
}
.section-header a {
    float: none;
}


}
*/

 /* **********Styles for Home page ********** */

.home-heading {
    font-family: 'Jeko-SemiBold';
    font-size: 48px;
    font-weight: 400;
    line-height: 59px;
    letter-spacing: 0em;
    text-align: left;
    color: rgba(0, 0, 0, 1);
    position: absolute;
    top: 18%;
    left: 7.68%;
}
.headline-line {
    width: 36px;
    height: 3px;
    top: 30%;
    left: 7.68%;
    background: rgba(0, 227, 140, 1);
    position: absolute; 
}
.profile-icon-container .image-button {
    width: 18.48px; 
    height: 22px; 
    background: url('/profile-icon.png') no-repeat center center;
    background-size: cover; 
    border: none;
    cursor: pointer;
    position: absolute; 
    top: 50%; 
    left: 50%; 
    border-radius: 10px; 
    transform: translate(-50%, -50%);
}
.createticket-button {
    width: 10.76%;
    height: 9.74%;
    top: 19%;
    left: 81.55%;
    padding: 4px 16px;
    border-radius: 6px;
    gap: 4px;
    background: rgba(0, 227, 140, 1);
    text-align: center;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-family: Inter;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0em;
    color: rgba(0, 0, 0, 1) !important;
    position: absolute;
}
.createticket-button:hover, .createticket-button:active, .createticket-button:focus{
    background: rgba(83, 253, 152, 1);
}

.priority-text, .status-text {
    font-family: 'Jeko-SemiBold';
    font-size: 24px;
    font-weight: 400;
    line-height: 30px;
    letter-spacing: 0em;
    text-align: left;
    color: rgba(0, 0, 0, 1);
    padding: 10px;
    top: 0%;
    left: 5%;
    position: absolute;
}


.text-label {
    position: absolute;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    letter-spacing: 0em;
    text-align: left;
    color: rgba(0, 0, 0, 1);
}


.open-label{
    top: 31%;
    left: 10%;
}
.inprogress-label{
    top: 46%;
    left: 10%;
}
.completed-label{
    top: 62%;
    left: 10%;
}
.cancelled-label{
    top: 78%;
    left: 10%;
}
.ticket-map{
    width: 862px;
    height: 414px;
    top: 40%;
    left: 37.68%;
    border-radius: 10px;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px 0px 60px 10px rgba(0, 0, 0, 0.05);
    position: absolute;
}

.account-button {
  width: 50px;
  height: 51px;
  border-radius: 10px;
  background: rgba(0, 227, 140, 1);
  position: relative;
  display: inline-block;
  margin-right: 8px;
  margin-left: -5px;
}
.account-button:hover{
   background: rgba(0, 227, 140, 1);
}
.account-button img{
    transform: translate(-50%, -50%);
    cursor: pointer;
    position: relative;
    top: 50%;
    left: 50%;
}
.portal-dropdown{
    width: 70px;
    height: 51px;
    border-radius: 10px;
    background: rgba(30, 46, 217, 1);
}
.navbar-right{
    margin-right: 50px;
}
.navbar-inverse .navbar-nav .open .dropdown-menu > li > a{
    font-family: "inter" !important;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0em;
    text-align: left;
    color: rgba(0, 0, 0, 1) !important;
}
.navbar-nav>li>.dropdown-menu {
    margin-top: 0;
    border-top-right-radius: 6px;
    border-top-left-radius: 6px;
    border-bottom-right-radius: 6px;
    border-bottom-left-radius: 6px;
}

@media (min-width: 1200px){
.navbar-nav {
    margin-top: 25px !important;
    margin-right: 27px;
}
}
 /* **********Styles for Home page ********** */

#tickets-heading {
   font-family: "Jeko-SemiBold";
    font-size: 48px;
    font-weight: 400;
    line-height: 59px;
    letter-spacing: 0em;
    text-align: left;
    position: relative;
    top: 50px;
    left: 105px;
    width: 450px;
    height: 59px;
}
#tickets-heading:after {
    background-color: #00e38c;
    content: "";
    display: block;
    height: 2px;
    margin-top: 2rem;
    width: 46px;
}
#create-ticket:hover {
   background: rgba(83, 253, 152, 1);
}
#create-ticket {
    width: 147px;
    height: 68px;
    position: absolute;
    top: 190px;
    left: 87.5%;
    padding: 4px 16px;
    border-radius: 6px;
    gap: 4px;
    background: rgba(0, 227, 140, 1);
    font-family: Inter;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0em;
    text-align: center;
    border: none;
}
#ticket-dropdown {
    width: 168px;
    height: 48px;
    border-radius: 6px !important;
    font-family: "Inter";
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0em;
    text-align: left;
    background: rgba(233, 240, 248, 1);
    position: absolute;
    top: 290px;
    left: 86.5%
}
#ticket-dropdown select {
    width: 168px;
    height: 100%;
    border: none; /* Remove the default select border */
    background: rgba(233, 240, 248, 1); 
    font-family: "Inter";
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0em;
    text-align: center;
    border-radius: 6px !important;
}
#ticket-dropdown select:first-child {
    border-radius: 6px 6px 0 0; /* Top corners rounded for the first element */
}

#ticket-dropdown select:last-child {
    border-radius: 0 0 6px 6px; /* Bottom corners rounded for the last element */
}
#ticket-dropdown select option {
    width: 35px; /* Set the width of each option */
}
#ticket-section{
    position: relative;
}
.priorities-element{
    width: 275px;
    height: 207px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px 0px 60px 10px rgba(228, 237, 237, 0.6);
    position: relative;
    top: 80px;
    left: 104px;
}
.priority-label{
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    letter-spacing: 0em;
    text-align: left;
    color: rgba(0, 0, 0, 1);
}
.priority-label .high{
    position: absolute;
    top: 100px;
    left: 75%;
}
.priority-label .low{
    position: absolute;
    top: 120px;
    left: 75%;
}
.priority-label .normal{
    position: absolute;
    top: 140px;
    left: 75%;
}
.section-title {
    font-family: "Jeko-SemiBold";
    font-size: 24px;
    font-weight: 400;
    line-height: 29.64px;
    letter-spacing: 0em;
    text-align: left;
}
.status-element {
    width: 275px;
    height: 234px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px 0px 60px 10px rgba(228, 237, 237, 0.6);
    position: RELATIVE;
    top: 80px;
    left: 104PX;
}
.map-element {
    width: 1390px;
    height: 414px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px 0px 60px 10px rgba(0, 0, 0, 0.05);
    position: relative;
    top: -330px;
    left: 399px;
}
#nocases-section {
    width: 20.05%;
    height: 414px;
    top: 380px;
    left: 7%;
    border-radius: 10px;
    position: absolute;
    text-align: center;
display:none;
}
#nocases-section img{
    margin-top: 40px;
    width: 140px;
    height: 164px;
}
#nocases-section p{
    margin-top: 40px;
    font-family: 'inter';
    font-weight: 400;
    font-size: 18px;
    line-height: 30px;
}
.nocases-msg{
    position: absolute;
    top: 920px;
    left: 40%;
}
.nocases-msg p{
    font-family: Inter;
    font-size: 18px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: 0em;
    text-align: left;
    colour: rgba(0, 0, 0, 1);
}
.ticket-update {
    width: 350px;
    height: 46px;
    top: 831px;
    left: 7%;
    font-family: "Jeko-SemiBold";
    font-size: 32px;
    font-weight: 600;
    line-height: 46px;
    letter-spacing: 0em;
    text-align: left;
    color: rgba(0, 0, 0, 1);
    position: absolute;
}
.all-active-tickets {
    width: 200px;
    height: 22px;
    top: 873px;
    left: 70%;
    position: absolute;
}
.all-active-tickets a{
    font-family: Inter;
    font-size: 18px;
    font-weight: 500;
    line-height: 22px;
    letter-spacing: 0em;
    text-align: left;
    color: rgba(0, 207, 128, 1) !important;
}
.ticketupdate-section #ticket-dropdown{
    top: 850px;
}
#content-placeholder{
    position: absolute;
    top: 950px;
    left: 7%;
    width: 87.5%;
}

#dropdown-container select {
    width: 100%;
    height: 100%;
    border: none; /* Remove the default select border */
    background: transparent;  Make the select background transparent */
    font-family: "Inter";
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    letter-spacing: 0em;
    text-align: left;
}
.status-labels {
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    letter-spacing: 0em;
    text-align: left;
    color: rgba(0, 0, 0, 1);
    margin-left: 20px;
}
.incidents-count {
    font-family: 'jeko-regular';
    font-size: 40px;
    font-weight: 400;
    line-height: 69px;
    letter-spacing: 0em;
    text-align: left;
    color: rgba(0, 0, 0, 1);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.status-bar {
    height: 10px;
    width: 36.49%;
    background: rgba(231, 231, 230, 1);
 }
.open-section {
      display: flex;
      align-items: center; 
   }

.inprogress-section {
      display: flex;
      align-items: center; 
   }

.completed-section {
      display: flex;
      align-items: center; 
   }

.cancelled-section {
      display: flex;
      align-items: center; 
   }
.open-statusbar{
    margin-left: 60px;
}
.inprogress-statusbar {
    margin-left: 16px;
}
.completed-statusbar {
     margin-left: 18px;
}
.cancelled-statusbar {
     margin-left: 25px;
}
.status-count {
    margin-left: 10px;
}
.open-statusbar {
    height: 10px;
    width: 36.49%;
}
.completed-statusbar {
     height: 10px;
    width: 36.49%;
}
.inprogress-statusbar {
    height: 10px;
    width: 36.49%;
}
.cancelled-statusbar {
    height: 10px;
    width: 36.49%;
}
.no-cases {
        position: relative; 
    }

.no-cases img {
        position: absolute; 
        top: 20px; 
}
.square {
    width: 15px;
    height: 15px;
    border-radius: 3px;  
    cursor: pointer;
}
.high-square {
    background: rgba(244, 119, 56, 1);
}
.chart-container {
    width: 160px;
    height: 160px;
    position: relative;
    margin-left: 10px;
}

.priority-status {
    display: flex;
    align-items: center;
    gap: 24px;
}
.highprority-section {
    display: flex;
    align-items: center;
    margin-bottom: 100px;
    gap: 10px;
}
.normalprority-section {
    display: flex;
    align-items: center;
    margin-bottom: 50px;
    gap: 10px;
    margin-left: -81px;
}
.lowprority-section {
    display: flex;
    align-items: center;
    margin-left: -98px;
    margin-bottom: 0px;
    gap: 10px;
}
.normal-square{
    background: rgba(255, 229, 100, 1);
}
.low-square{
    background: rgba(164, 131, 255, 1);
}
.map-header {
    display: flex;
    align-items: center;
    gap: 20px;
    height: 35px;
    margin-left: 15px;
}
.map-high {
    display: flex;
    align-items: center;
    gap: 5px;
}
.map-square {
    width: 15px;
    height: 15px;
    border-radius: 3px;
}
.square-high {
    background: rgba(244, 119, 56, 1);
}
.square-normal {
    background: rgba(255, 229, 100, 1);
}
.square-low {
    background: rgba(164, 131, 255, 1);
}
.map-normal {
    display: flex;
    align-items: center;
    gap: 5px;
}
.map-low {
    display: flex;
    align-items: center;
    gap: 5px;
}
.priority-status ul li{
    width: 15px;
    height: 15px;
    background: rgba(244, 119, 56, 1);
    cursor: pointer;
    border-radius: 3px;
    transition: 0.5s;
}
.priority-status ul li .content{
     position: absolute;
     width: 520px;
     background: rgba(37, 44, 51, 1);
     bottom: 55px;
     border-radius: 6px;
     visibility: hidden;
     opacity: 0;
    transition: 0.5s;
}
.priority-status ul li .entitylist{
    background: rgba(37, 44, 51, 1);
}
.priority-status ul li:hover .content{
    visibility: visible;
    opacity: 1;
}
.prioritypopup .pagination>.active>a,
   .prioritypopup .pagination>.active>a:focus,
   .prioritypopup .pagination>.active>a:hover {
    background-color: #566573 !important;
    }
/**********Styles for Ticket Flyout responsivness********** */
.ticket-dropdown-menu a{
    position: relative;
    left: 10%;
 padding: 300px 170px 0px; 
  display: inline-block;
  margin-top:30px;
  color: #333;
  font-family: Jeko;
  font-size: 20px;
  font-weight: 400;
  text-align: center;
}
.ticket-dropdown-menu img {  
 margin-top: -106px;
 margin-left: 21px;
display: flex; 
align: center;
}

.ticket-dropdown-menu {
   display: none;
  position: absolute;
  background-color: white;
  min-width:2000px;
  height: 400px;
  flex-shrink: 0;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  margin-left:-1180px;
  top: -60px;
  z-index: -1;
}

@media (min-width: 1900px) and (max-width: 1930px){
.ticket-dropdown-menu {
   display: none;
  position: absolute;
  background-color: white;
  min-width:2000px;
  height: 400px;
  flex-shrink: 0;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  margin-left:-1180px;
  top: -60px;
  z-index: -1;
}
}

@media (min-width: 2500px) and (max-width: 2570px){

.ticket-dropdown-menu {
   display: none;
  position: absolute;
  background-color: white;
  min-width:5000px;
  height: 400px;
  flex-shrink: 0;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  margin-left:-1979px;
  top: -60px;
  z-index: -1;
}
} 
@media (min-width: 1700px) and (max-width: 1750px){
.ticket-dropdown-menu {
   display: none;
  position: absolute;
  background-color: white;
  min-width:5000px;
  height: 400px;
  flex-shrink: 0;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  margin-left: -1231px;
  top: -60px;
  z-index: -1;
 }
} 

@media (min-width: 1500px) and (max-width: 1610px){
    .ticket-dropdown-menu {
       display: none;
       position: absolute;
        background-color: white;
        min-width: 3000px;
        height: 400px;
        flex-shrink: 0;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        margin-left: -982px;
        top: -60px;
        z-index: -1;
        }
.ticket-dropdown-menu a{
    position: relative;
    left: 10%;
 padding: 300px 170px 0px;
  display: inline-block;
  margin-top:30px;
  color: #333;
  font-family: Jeko;
  font-size: 20px;
  font-weight: 400;
  text-align: center;
}
} 
@media (min-width: 1400px) and (max-width: 1499px){
 .ticket-dropdown-menu {
       display: none;
       position: absolute;
        background-color: white;
        min-width: 3000px;
        height: 400px;
        flex-shrink: 0;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        margin-left: -982px;
        top: -60px;
        z-index: -1;
        }
}
 @media (min-width: 1200px) and (max-width: 1300px){
 .ticket-dropdown-menu {
       display: none;
       position: absolute;
        background-color: white;
        min-width: 3000px;
        height: 400px;
        flex-shrink: 0;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        margin-left: -982px;
        top: -60px;
        z-index: -1;
        }

.ticket-dropdown-menu a{
    position: relative;
   left:20%;
   padding: 300px 120px 0px;
  display: inline-block;
  margin-top:30px;
  color: #333;
  font-family: Jeko;
  font-size: 20px;
  font-weight: 400;
  text-align: center;
}
}



 /**********Styles for Account Flyout responsivness********** */

    .account-dropdown-menu a {
        position:relative;
        left:10%;
        padding: 300px 170px 0px;
        display: inline-block;
        margin-top:30px;
        color: #333;
        font-family: Jeko;
        font-size: 20px;
        font-weight: 400;
        text-align: center;
       }
    .account-dropdown-menu img {  
        margin-top: -106px;
        margin-left: 21px;
        display: flex; 
        align: center;
       }

@media (min-width: 1900px) and (max-width: 1930px){
    .account-dropdown-menu{
        display: none;
        position: absolute;
        background-color: white;
        min-width:2000px;
        height: 400px;
        flex-shrink: 0;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        margin-left:-1180px;
        top: -60px;
        z-index: -1;
        }   
}

@media (min-width: 1700px) and (max-width: 1750px){
    .account-dropdown-menu{
         display: none;
        position: absolute;
        background-color: white;
        min-width:2000px;
        height: 400px;
        flex-shrink: 0;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        margin-left:-982px;
        top: -60px;
        z-index: -1;
    }
}
@media (min-width: 1700px) and (max-width: 1750px){
      .account-dropdown-menu{
         display: none;
        position: absolute;
        background-color: white;
        min-width:2000px;
        height: 400px;
        flex-shrink: 0;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        margin-left:-982px;
        top: -60px;
        z-index: -1;
    }
}
@media (min-width: 1500px) and (max-width: 1610px){
      .account-dropdown-menu{
         display: none;
        position: absolute;
        background-color: white;
        min-width:2000px;
        height: 400px;
        flex-shrink: 0;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        margin-left:-982px;
        top: -60px;
        z-index: -1;
    }
}
@media (min-width: 1400px) and (max-width: 1499px) {
    .account-dropdown-menu {
        display: none;
        position: absolute;
        background-color: white;
        min-width: 2000px;
        height: 400px;
        flex-shrink: 0;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        margin-left: -982px;
        top: -60px;
        z-index: -1;
    }

    .account-dropdown-menu a {
        position: relative;
        left: 25%;
        padding: 300px 120px 0px;
        display: inline-block;
        margin-top: 30px;
        color: #333;
        font-family: Jeko;
        font-size: 20px;
        font-weight: 400;
        text-align: center;
    }
}
@media (min-width: 2500px) and (max-width: 2570px) {
    .account-dropdown-menu {
        display: none;
        position: absolute;
        background-color: white;
        min-width: 5000px;
        height: 400px;
        flex-shrink: 0;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        margin-left: -1979px;
        top: -60px;
        z-index: -1;
    }
}

 @media (min-width: 1200px) and (max-width: 1300px) {
    .account-dropdown-menu {
        display: none;
        position: absolute;
        background-color: white;
        min-width: 2000px;
        height: 400px;
        flex-shrink: 0;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        margin-left: -751px;
        top: -60px;
        z-index: -1;
    }

    .account-dropdown-menu a {
        position: relative;
        left: 20%;
        padding: 300px 120px 0px;
        display: inline-block;
        margin-top: 30px;
        color: #333;
        font-family: Jeko;
        font-size: 20px;
        font-weight: 400;
        text-align: center;
    }
}

/********************************Styles for Quotes ************************************/
.quotes-table{
    position:relative;
    top: 350px;
    left: 125px;
    width: 88%;
    background: transparent; 
 }

/********************************Common Styles for Buttons ************************************/
#customer-portal .btn-primary {
    min-height: 48px;
    padding: 4px 16px;
    border-radius: 6px;
    background: #00E38C;
    line-height: 42px;
    box-shadow: none;
}
#customer-portal .btn-primary:hover {
    background: #53FD98;
}
#customer-portal .btn:focus, #customer-portal .btn.focus, #customer-portal .btn:active:focus, 
#customer-portal .btn:active.focus, #customer-portal .btn.active:focus, 
#customer-portal .btn.active.focus {
 outline: unset;
}
#customer-portal  .section-header a:hover,#customer-portal  .section-header a:focus {
    color: #000;
    }
.portalcontainer .btn-primary:active:hover,.portalcontainer .btn-primary:active:focus {
    color: #000;
}
.portalcontainer .btn:hover,.portalcontainer .btn:focus,.portalcontainer .btn.focus, .portalcontainer .btn:active {
    box-shadow: none !important;
}
 /* **********Styles for Model Contents ********** */
#customer-portal .modal-title {
    color: #000;
    font-size: 32px !important;
    font-weight: 400;
    line-height: normal;
}
/********************************Common Styles for Pagination ************************************/
#customer-portal .entity-pager-prev-link {
    text-indent: -9999px;
    overflow: hidden;
    display: block;
    background: url('/Left-Arrow.png') no-repeat center;
    position: relative;
}
#customer-portal .entity-pager-next-link {
    text-indent: -9999px;
    overflow: hidden;
    display: block;
    background: url('/Right-Arrow.png') no-repeat center;
}
#customer-portal .pagination > .active > a {
    border-radius: 3px;
    background-color: rgba(233, 240, 248, 1) !important;
}
#customer-portal .pagination > li > a {
    width: 36px;
    height: 36px;
}
#customer-portal .view-pagination {
    text-align: center;
}
#customer-portal .pagination>.active>a,#customer-portal .pagination>.active>a:focus,#customer-portal .pagination>.active>a:hover {
    background: #E9F0F8;
}
#customer-portal .pagination>.active>a,#customer-portal .pagination>.active>a:hover, 
.pagination>.active>a:focus, .pagination>.active>span, 
#customer-portal .pagination>.active>span:hover,#customer-portal .pagination>.active>span:focus {
    color: #000000 !important;
    border-radius: 3px !important;
}
#customer-portal .pagination>.active>a,#customer-portal .pagination>.active>a:focus,#customer-portal .pagination>.active>a:hover {
    background-color: #E9F0F8 !important;
}
#customer-portal .pagination>li>a:hover,#customer-portal .pagination>li>a:focus, 
#customer-portal .pagination>li>span:hover,#customer-portal .pagination>li>span:focus {
    color: #000000 !important;
}
/********************************Common Styles for Entitylist ************************************/
#customer-portal .entitylist {
    background: unset;
}
#customer-portal .grid-actions {
    background: unset;
}
#customer-portal  .table>thead:first-child>tr:first-child>th {
    border-bottom: none;
    background: rgba(233, 240, 248, 1);
    border-right: 2px solid transparent;
    border-radius: 6px;
    height: 48px;
    vertical-align: middle;
}
#customer-portal .grid-actions {
    border-bottom: unset;
}
#customer-portal .fa-arrow-up:before { 
    display: none;
}
#customer-portal .table>thead>tr>th{
   font-family: "inter";
   font-size: 18px;
   font-weight: 500;
   line-height: 22px;
   letter-spacing: 0em;
   color: rgba(0, 0, 0, 1);
}
#customer-portal .table>tbody>tr>td {
   font-family: Inter;
   font-size: 18px;
   font-weight: 400;
   line-height: 22px;
   letter-spacing: 0em;
   text-align: left;
}
#customer-portal .sort-enabled .fa-arrow-down, .sort-enabled .fa-arrow-up {
   display: none;
}
#customer-portal .sort-enabled.sort-asc a::after {
   content: ""; 
   display: inline-block;
   width: 20px; 
   height: 15px; 
   background: url('/SortUp-Arrow.png') 90% center no-repeat;
   margin-right: 5px; 
   float: right;
   margin-top: 0px;
}
#customer-portal .sort-enabled.sort-desc a::after {
   content: ""; 
   display: inline-block;
   width: 10px;
   height: 10px; 
   background: url('/SortDown-Arrow.png') 90% center no-repeat;
   margin-right: 5px; 
   background-size:contain;
   float: right;
   margin-top: 5px;
}
#customer-portal tr:nth-child(even) {
    background: unset;
}
#customer-portal .table>tbody>tr>td {
    border-bottom: 1px solid #ddd;
    vertical-align: middle;
    border-top: unset;
}
#customer-portal .dropdown-menu>.active>a, 
#customer-portal .dropdown-menu>.active>a:focus, 
#customer-portal .dropdown-menu>.active>a:hover {
   border: unset !important;
}
#customer-portal .dropdown-menu>li>a {
    margin-left: 0px;
}
/********************************Common Styles for Forms ************************************/
#customer-portal .form-control:not(input[readonly="readonly"]) {
    color: #000000;
    border-radius: 4px;
    background: #E9F0F8 !important;
    padding: 11px 11px;
    color: #000;
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; 
    min-height: 48px;
}
#customer-portal .form-control:not(input[readonly="readonly"]) {
    border: 1px solid #E9F0F8 !important;
    padding: 11px 11px;
}
#customer-portal input.form-control:not(input[readonly="readonly"]) {
    border: 1px solid #1E2ED9;
}
#customer-portal .form-control:focus,#customer-portal .form-control:active {
    background-color: #fff !important;
    border: 2px solid rgba(30, 46, 217, 1) !important;
    box-shadow: none !important;
    outline: none !important;
}
#customer-portal .fa-search:before {
    content: "";
    display: inline-block;
    width: 22px;
    height: 22px;
    background: url(/search.png) center center no-repeat;
    background-size: contain;
}
#customer-portal .form-control { 
    box-shadow: unset !important;
}
#customer-portal .crmEntityFormView {
    border: transparent !important;
}
/********************************Common Styles for components ************************************/
.portalcontainer {
    padding-left: 100px;
    padding-right: 100px;
    padding-bottom: 100px;
    min-height: 76vh;
}
.section-header {
    margin-top: 72px;
}
.section-header a, .section-header h1{
   display: inline-block; 
}
.section-header a {
    float: right;
    padding: 25px;
    background: #00E38C;
    border-radius: 6px;
    color: #000;
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    margin-top: 15px;
}
.portalcontainer .crmEntityFormView {
    border: none;
}
.section-header a:hover {
    background: #53FD98;
}
.portal-header:after {
    background-color: #00e38c;
    content: "";
    display: block;
    height: 3px;
    margin-top: 2rem;
    width: 36px;
}
.portalcontainer .dropdown-menu {
    padding: 0px 0;
}
.portalcontainer .fa-chevron-circle-down.fa-fw{
                display: none;
 }
.portalcontainer .view-grid .dropdown.action>.btn {
    display: none;
    }
.portalcontainer .view-grid .dropdown.action .dropdown-menu {
    display: block;
    position: static !important;
    position: initial !important;
    border: 0;
    background: transparent;
    box-shadow: none;
    text-align: center;
    max-width: 50px;
    min-width: 50px;
    width: 50px;
    left: auto !important;
    top: auto !important;
    background: none !important;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-right: 20px;
 }
.portalcontainer .view-grid th[aria-label="Actions"] {
    width: 2% !important;
}
 .portalcontainer .view-grid .dropdown.action .dropdown-menu li {
    display: inline-block;
    text-align: center;
 }
.portalcontainer.view-grid .dropdown.action .dropdown-menu li a {
    font-size: 0px;
    padding: 2px;
    margin: 0;
 }
.portalcontainer .view-grid .dropdown.action .dropdown-menu li a>span {
    font-size: 18px;
}
 .portalcontainer .view-grid .dropdown.action .dropdown-menu li a:hover {
    color: #008C95;
    background: transparent;
 }
.portalcontainer .fa-info-circle:before {
    content: ""; 
    display: inline-block;
    background: url('/Right-Arrow.png') center center no-repeat !important;
    background-size: cover;
    border: none;
    cursor: pointer;
    background-color: rgba(0, 227, 140, 1) !important;
    width: 27px;
    height: 27px;
    border-radius: 6px;
    padding: 18px 20px;
}
.portalcontainer .dropdown-menu .details-link {
    font-size: 0px;
    border:0;
}
.portalcontainer .details-link:hover{
    border:0;
    padding:8px;
}
.portalcontainer .entity-grid .message {
    text-align: center;
    color: #000;
    font-family: Inter;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    white-space: break-spaces;
}
.portalcontainer .selected-view.dropdown-toggle:focus, 
.portalcontainer .selected-view.dropdown-toggle:hover {
    outline: transparent;
    background-color: #E9F0F8;
    color: #000000;
    border-radius: 6px;
}
.portalcontainer .nav > li > a:focus,.portalcontainer .nav > li > a:hover,
.portalcontainer .nav>li>a:hover,.portalcontainer .nav>li>a:focus   {
    background-color: #E9F0F8;
}
.portalcontainer .form-control {
    transition: unset;
}
.portalcontainer .btn-info {
    border-radius: 6px;
    background: #BECBD9;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    font-family: "Inter";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    width: 175px;
    justify-content: center;
}
#customer-portal .btn-info:active, #customer-portal .btn-info:hover, #customer-portal .btn-info:focus {
    border-radius: 6px;
    background: #00E38C;
    height: 48px;
    display: inline-flex;
    align-items: center;
    font-family: "Inter";
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 24px;
    box-shadow: unset;
}
#customer-portal .btn-info:active:hover, #customer-portal .btn-info:active:focus, #customer-portal .btn-info:active.focus, #customer-portal .btn-info.active:hover, #customer-portal .btn-info.active:focus, #customer-portal .btn-info.active.focus, #customer-portal .open>.btn-info.dropdown-toggle:hover, #customer-portal .open>.btn-info.dropdown-toggle:focus, #customer-portal .open>.btn-info.dropdown-toggle.focus {
    color: #000000;
    background-color: #00E38C;
    border-color: unset;
}

/********************************Common Styles for mobile components ************************************/
@media (max-width: 600px) { 
.portalcontainer {
    padding-left: 15px;
    padding-right: 15px;
}
.section-header a  {
    width: 100%;
    text-align: center;
}
.section-header {
    margin-top: 0px;
}
}
/********************************Styles for Home Page ************************************/
.homepage-row {
    display: flex;
    margin-top: 30px;
}
.homepage-map {
      width: 100%;
      min-height: 410px;
      margin-left: 20px;
      border-radius: 10px;
      background: #FFF;
      box-shadow: 0px 0px 60px 10px rgba(0, 0, 0, 0.05);
      margin-top: 80px;
}
.map-legends {
     display: inline-flex;
     margin-bottom: 17px;
     margin-top: 16px;
     margin-left: 20px;
     font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
}    
.highlegend, .normallegend, .lowlegend{
    display: inline-flex;
    margin-right: 20px;
    align-items: center;
}
.square-legend {
    width: 15px;
    height: 15px;
    margin-right: 7px;
    border-radius: 3px;
    text-align: center;
}
.highlegend .square-legend {
     background: #F47738;
}
.normallegend .square-legend {
    background: #FFE564;
}
.lowlegend .square-legend {
    background: #A483FF;
}
.progressbar {
    width: 100px;
    height: 10px;
    background: #E7E7E6;
}
.section-status {
    padding-left: 20px;
    padding-right: 30px;
}
.bar {
    height:auto;
    margin-bottom: 15px;
    padding-bottom:20px;
    position: relative;
    font-family: Inter;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
}
.bar > p, .bar > span{
float:left;
}
.bar > div{
float:right;
display:flex;
align-items:center;
}
.bar  > div p, .bar  > div span{
    padding-left:10px;
    width:35px;
}

    
.progressbar {
    width: 100px;
    height: 10px;
    background: #E7E7E6;
}
/********************************Styles for Home Pgge Empty state ************************************/
.noCases {
    text-align: center;
    margin-top: 145px;
    margin-right: 20px;
}
.noCases .headline, .section-ticketupdate .headline {
    color: #000;
    text-align: center;
    font-family: Inter;
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 30px;
}
.noCases img {
    margin-bottom: 65px;
}
.section-priority, .section-status, .noCases, #ticketupdate-table, .alltickets-link,.section-ticketupdate .headline, .homepage-row .custom-select  {
    display: none;
}
/********************************Styles for Home Pgge Empty state Responsiveness ************************************/
@media (max-width: 600px) { 
.homepage-row {
    display: flex;
    flex-direction: column;
}
.noCases {
    margin-top: 0px;
    margin-right: 0px;
}

}
/********************************Styles for Create Case Page ************************************/


/********************************Styles for Help Page ************************************/
.headline .xrm-attribute-value{
    font-family: Inter;
    font-size: 18px;
    font-weight: 400;
    line-height: 22px;
    letter-spacing: 0em;
    text-align: left;
    margin-top: 45px;
}
/********************************Styles for Feedback Page ************************************/
.feedback-response {
    display: flex;
    justify-content: space-between;
    margin-top: 45px;
}
.feedback-response a {
    font-family: Inter;
    font-size: 18px;
    font-weight: 400;
    line-height: 22px;
    display: inline-block;
    text-align: center;
    padding-top:26px;
}
.feedback-response a.very-satisfied, .very-satisfied {
    background: url("/satisfied.png") center top no-repeat;
}
.feedback-response a.very-satisfied:hover, .feedback-response a.very-satisfied:active {
    background: url("/Satisfied_hover.png") center top no-repeat;
}
.feedback-response a.neutral {
    background: url("/neutral.png") center top no-repeat;
}
.feedback-response a.neutral:hover, .feedback-response a.neutral:active {
    background: url("/Neutral_hover.png") center top no-repeat;
}
.feedback-response a.dissatisfied {
    background: url("/dissatisfied.png") center top no-repeat;
}
.feedback-response a.dissatisfied:hover, .feedback-response a.dissatisfied:active {
    background: url("/Dissatisfied_hover.png") center top no-repeat;
}

/******************************Styles for Global Search Page*********************************/
#content_form {    
    padding-bottom: 50px;        
    min-height: 76vh;
}
#bar .search-btn {
    width: 28px;
    height: 29px;
    background: rgba(0, 227, 140, 1);
    gap: 0px;
    border-radius: 0px 6px 6px 0px;
    margin-top: 3px;
    left: -53px;
    top: 0px;
    right: 0px;
}
#bar .fa-search:before {
    content: "";
    display: inline-block;
    width: 14px;
    height: 14px;
    background: url(/globalsearch-search.png) center center no-repeat;
    background-size: contain;
    margin-left: -5px;
    top : -2px;
    position : relative;
}
.handlebars-search-container{
    margin-right: 100px;
    margin-left: 100px;
}
#content_form .breadcrumb {
    display : none;
}
#content_form .row {
    margin-right: -30px;
}
.panel {
    -webkit-box-shadow: 0 0px 0px transparent;
    box-shadow: 0px 0px 60px 10px rgba(228, 237, 237, 0.6) !important;
    border-radius: 10px;
}
.panel-default {
    border-color : transparent;
}
.facet-list-group-item.active .facet-list-group-item-title {
    font-weight: 400;
}
.radio input[type="radio"] {
    display : none;
}
.radio label {
    padding-left : 0px;
}
#content_form .panel-default>.panel-heading {
    background: rgba(255, 255, 255, 1) !important;
    border: none;
    height: 34px;
    font-family: Jeko-Semibold;
    font-size: 24px;
    font-weight: 600;
    line-height: 34px;
    letter-spacing: 0em;
    text-align: left;
    margin-left: 25px;
    border-radius: 10px;
}
#content_form .search-results {
    margin-left: 20px;
    margin-top: 117px;
    width: 100%;
}
.facets {
    margin-top: 277px;
}
.search-results ul {
    list-style: none;
    margin: -10px;
    padding: 0;
    margin-top: 36px;
}
.rating-facet-group {
    display : none;
}
.facet-view:nth-of-type(3) {
    display: none;
}
#content_form .search-results h2 {
    margin-bottom: 36px;
    word-wrap: break-word;
    font-family: 'Jeko-Semibold';
    font-size: 48px;
    font-weight: 400;
    line-height: 59px;
    letter-spacing: 0em;
    text-align: left;
    font-family: Jeko-Semibold;
}
#content_form .search-results h2:after {
    background-color: #00e38c;
    content: "";
    display: block;
    height: 3px;
    margin-top: 2rem;
    width: 36px;
}
#content_form .page-header{
    border: none;
    border-block-color: transparent;
    padding-bottom: 1px;
}
#content_form .breadcrumb {
    font-family: inter;
}
#content_form .facet-list-group-item {
    font-family: Inter;
    height: 32px;
    font-size: 16px;
    font-weight: 400;
    line-height: 19px;
    letter-spacing: 0em;
    text-align: left;
    margin-left: 25px;
    margin-right: 25px
}
#content_form h3 a {
    font-family: Inter;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0em;
    text-align: left;
    color: rgba(0, 207, 128, 1);
}
#content_form h3 a:hover {
    color: #00CF80;
}
#content_form .search-results li .fragment {
    display: none;
}
#content_form p.fragment:after{
    border: 0.5px solid rgba(0, 0, 0, 1);
}
#content_form .pagination>.active>span{
    color: #000000 !important;
    border-radius: 3px !important;
    background-color: #E9F0F8 !important;
}
#content_form .pagination>li:first-child>span, #content_form .pagination>li:first-child>a {
    content: "\f100";
    font-family: 'FontAwesome';
    font-size: 20px;
    color: black;
}
#content_form .pagination>li:nth-child(2)>span, #content_form .pagination>li:nth-child(2)>a {
    content: "\f100";
    font-family: 'FontAwesome';
    font-size: 20px;
    color: black;
}
#content_form .pagination>li:first-child>span::after {
    text-indent: -9999px;
    overflow: hidden;
    display: block;
    background: url('/Left-Arrow.png') no-repeat center;
    position: relative;
}
#content_form .pagination>li:last-child>a::before {
    text-indent: -9999px;
    overflow: hidden;
    display: block;
    background: url('/Right-Arrow.png') no-repeat center;  
}
#content_form .pagination>li:last-child>a {
    content: "\f101"; 
    font-family: FontAwesome;
    font-size: 20px;
    color: black;
}
#content_form .pagination>li:nth-last-child(2)>a {
    content: "\f101"; 
    font-family: FontAwesome;
    font-size: 20px;
    color: black;
}
#content_form .pagination>li:nth-last-child(2):not(:last-child)>span {
    content: "\f100";
    font-family: 'FontAwesome';
    font-size: 20px;
    color: black;
}
#content_form .pagination>.active>a {
    border-radius: 3px;
    background-color: rgba(233, 240, 248, 1) !important;
}
#content_form .pagination>li>a {
    width: 36px;
    height: 36px;
}
#content_form .pagination>li:previous-child>span {
    text-indent: -9999px;
    overflow: hidden;
    display: block;
    background: url('/Left-Arrow.png') no-repeat center;
    position: relative;
}
#content_form [area-label="Next page"] {
    text-indent: -9999px;
    overflow: hidden;
    display: block;
    background: url('/Right-Arrow.png') no-repeat center;
}
#search_sort_options {
    display: none;
}
#content_form .facet-list-group-item:hover {
    background: rgba(233, 240, 248, 1);
    height: 32px;
}
#content_form .btn-default {
    min-height: 48px;
    padding: 14px 16px;
    border-radius: 6px;
    background: #00E38C;
    box-shadow: none !important;
}
#content_form .panel-default>.panel-body,.list-group-item {
    border-radius: 10px;
}
:focus-visible {
    outline: none !important;
}
@media (max-width: 992px){
.handlebars-search-container{
    margin-right: 15px;
    margin-left: 0px;
}
.facets {
    margin-top: 0px;
}
#content_form .search-results h2 {
    font-size: 25px; 
    margin-bottom: 10px;
}
#content_form .search-results {
    margin-left: 10px;
    margin-top: -15px;
}
.search-results .page-header {
    display : flex;
}
}

@media screen and (width: 1024px) {
    #content_form .col-md-3 {
    width: 100%;
    }
    #content_form .facets {
    margin-top: 15px;
    }
}

/****************************** Logo - Mobile ***************************/ 
@media (max-width: 992px){
.Headeryunexlogo .xrm-attribute-value img {
    margin-left: 15px !important;
}
}