.navbar.navbar-default {
     min-height: 100px;
    background-image: linear-gradient(to right, #00adef , #155c8a);
    background-repeat: no-repeat;
}

.r-menu-expand-icon {
    display: none !important;
}

.r-left .r-menu {
    padding-top: 78px;
    /* padding-bottom: 12px; */
}

img {
    width: 20px;
    height: 20px;
    object-fit: cover;
    vertical-align: middle;
    float: left;
    margin-right: 15px; /* Optional: adds space to the right of the image */
}
.r-menu-title {
    display: flex;
    align-items: center;  /* Vertically center the image and text */
    justify-content: center; /* Center the text within the span */
}

.r-menu-title img {
    margin-right: 10px; /* Adds space between the image and the text */
}

.r-left:not(.r-left-collapsed) .r-menu [data-menu-top] .menu-icon, .r-left:not(.r-left-collapsed) .r-menu [data-menu-inline] .menu-icon {
    margin-right: 12px;
}

.r-left:not(.r-left-collapsed) .r-menu [data-menu-top], .r-left:not(.r-left-collapsed) .r-menu [data-menu-inline] {
    padding: 0;
    font-size: 16px;
    padding: 4px 16px;
    margin: 0px 0px;
    margin-bottom: 1px;
    border-radius: 4px;
}

.nav-link.active {
    background-color: #007bff; /* Background color */
    color: white; /* Text color */
    display: flex; /* Ensure it behaves like a flex item */
    justify-content: center; /* Center the text if needed */
    align-items: center; /* Center the text vertically */
    width: 100%; /* Make the link span the full width of its parent */
    padding: 10px; /* Optional padding */
}

.r-vbar-page .r-left [data-logo-cell][data-logo-cell] {
    background-color: #252525;
    height: 40px;
    border: none;
    display: flex;
    align-items: stretch;
    align-self: stretch;
    flex-grow: 1;
    justify-content: center;
}

.r-vbar-page .r-left {
    background-color: #252525;

    height: 50px;  /* Set a fixed height */
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
    padding-bottom: 15px;

    text-align: center;  /* Center text horizontally */
    line-height: 50px;   /* Center text vertically (set to the same height) */
}

.navbar-brand {
    float: left;
    padding: 10px 10px;
    font-size: 18px;
    line-height: 16px;
    height: 100px;
    color: #00adef;
}

/* Flex container for aligning logo and text */
.navbar {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-top: 30px; /* 10px padding at the top */
}

/* Logo styling */
#navbarlogo {
  height: 60px; /* Logo size */
  width: auto;  /* Maintain aspect ratio */
  margin-right: 15px; /* Space between logo and text */
}

/* Stack "EnTelegent" and "Solutions" vertically */
.brand-text {
    font-family: 'Source Sans Pro', sans-serif;
    display: flex;
    flex-direction: column; /* Stacks children vertically */
    line-height: 1.2; /* Adjust spacing between lines */
}

/* Optional: Adjust text styling */
.entelegent-text {
    font-weight: bold; /* Makes "EnTelegent" bold */
    font-size: 1.2em; /* Adjust size if needed */
}

.solutions-text {
    font-size: 0.9em; /* Slightly smaller than "EnTelegent" */
    color: #00adef; /* Blue color */
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: Bold; /* Bold weight */
}

.r-menu-title {
    display: flex;            /* Enables flexbox for the container */
    align-items: center;      /* Vertically centers the image and text */
    justify-content: flex-start; /* Aligns both the image and text to the left */
    padding-left: 40px;   
}

.r-menu-title img {
    margin-right: 10px;       /* Adds space between the image and the text */
}

           .welcome-back {
            font-weight: bold;
            color: #ffffff;
            font-family: 'Source Sans Pro', sans-serif;
            font-size: 24px;
            padding-left: 40px; /* Left padding for the welcome back text */
        }

        .detailed-look {
            font-weight: normal;
            color: #ffffff;
            font-family: 'Source Sans Pro', sans-serif;
            font-size: 16px;
            padding-left: 40px; /* Left padding for the detailed look text */
        }
        
/* Push "Follow Us" to the right by 50px */
li > a[title="Follow Us"] .r-menu-title {
    margin-left: 12px;
}
        
   /* Center the submenu container */
#submenu50 {
    display: flex; /* Display icons in a row */
    flex-wrap: wrap; /* Allow wrapping if there are many icons */
    gap: 2px; /* Add spacing between icons */
    padding-left: 0; /* Remove default padding */
    list-style: none; /* Remove bullet points */
    justify-content: center; /* Center icons horizontally */
    margin: 0 auto; /* Center the container itself */
    width: fit-content; /* Ensure the container only takes up as much width as needed */
}

/* Ensure list items are inline and have no margin */
#submenu50 li {
    display: inline-block; /* Ensure list items are inline */
    margin: 0; /* Remove default margin */
}

/* Set icon size and alignment */
.menu-icon {
    width: 14px; /* Set icon size */
    height: 14px;
    vertical-align: middle; /* Align icons properly */
}

/* Override the collapse class behavior */
#submenu50.collapse {
    display: block !important; /* Force the element to be visible */
    height: auto !important; /* Ensure the height is not collapsed */
    visibility: visible !important; /* Ensure the element is visible */
}

/* Reduce spacing for LinkedIn item */
#itemlink49 {
    margin: 0;
    padding: 0;
    margin-left: -70px; /* Move the first icon further to the left */
}

#itemlink49 a {
    margin: 0;
    padding: 0;
}

#itemlink49 .menu-icon {
    width: 20px;
    height: 20px;
    margin-right: 0px;
}

/* Reduce spacing for LinkedIn item */
#itemlink51 {
    margin: 0;
    padding: 0;
    margin-left: 0px; /* Move the first icon further to the left */
}

/* Reduce spacing for X (Twitter) item */
#itemlink51 {
    margin: 0;
    padding: 0;
}

#itemlink51 .menu-icon {
    width: 20px;
    height: 20px;
    margin-right: 5px;
}

/* Reduce spacing for LinkedIn item */
#itemlink52 {
    margin: 0;
    padding: 0;
    margin-left: 0px; /* Move the first icon further to the left */
}

/* Reduce spacing for X (Twitter) item */
#itemlink52 {
    margin: 0;
    padding: 0;
}

#itemlink52 .menu-icon {
    width: 20px;
    height: 20px;
    margin-right: 5px;
}


.support-info {
            position: absolute;
            bottom: 0;
            left: 0;
            padding-left: 22px;
            font-weight: bold;
            color: black;
            width: 100%; /* Ensure it spans the full width */
        }
        
thead {
    background-color: #155c8a;
}

.text-label {
  color: #fff;
}

.panel-default > .panel-heading {
background: #155c8a;
}

/* Center the loader */
#loader {
  position: absolute;
  left: 50%;
  top: 300px;
  z-index: 1;
  width: 80px;
  height: 80px;
  margin: -76px 0 0 -76px;
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* Add animation to "page content" */
.animate-bottom {
  position: relative;
  -webkit-animation-name: animatebottom;
  -webkit-animation-duration: 1s;
  animation-name: animatebottom;
  animation-duration: 1s
}

@-webkit-keyframes animatebottom {
  from { bottom:-100px; opacity:0 } 
  to { bottom:0px; opacity:1 }
}

@keyframes animatebottom { 
  from{ bottom:-100px; opacity:0 } 
  to{ bottom:0; opacity:1 }
}

h4.panel-title a {
  color: white;
  text-decoration: none;
}

li[role="presentation"] a {
    color: white;
}

li[role="presentation"].active a,
li[role="presentation"] a.active {
    color: black !important;
}

.dropdown-menu {
    color: #000;
}

.r-vbar-page .r-left [data-logo-cell][data-logo-cell] {
    background-color: #f9f9f9;
    height: 124px;
    border: none;
    display: flex;
    align-items: stretch;
    align-self: stretch;
    flex-grow: 1;
    justify-content: center;
}

.r-left .r-menu {
    padding-top: 0px;
    /* padding-bottom: 12px; */
}