﻿ 

.mytooltip + .tooltip > .tooltip-inner {
    background-color: #F10A1B;
    color: white;
    border: 1px solid red;
    padding: 5px;
}



.BottomHeadingwhite {
    font-family: 'Metropolis','Roboto','Open Sans';
    font-size: 18px;
    font-weight: 400;
    color: white;
    align-content: center;
    align-items: center;
}

.BSubHeadingwhite {
    font-family: 'Metropolis','Roboto','Open Sans';
    font-size: 16px;
    font-weight: 300;
    color: white;
}

label {
    display: block;
    margin-bottom: 8px;
}

.SideMenufont {
    font-family: 'Metropolis','Roboto','Open Sans';
    font-size: 14px;
    font-weight: 300;
    color: white;
    cursor: pointer;
}


.Linkfont {
    font-family: 'Metropolis','Roboto','Open Sans';
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    color: red;
}

.sectionbold {
    font-family: 'Metropolis','Roboto','Open Sans';
    font-size: 14px;
    font-weight: 600;
    color: #5a5858;
}

.sectionnormal {
    font-family: 'Metropolis','Roboto','Open Sans';
    font-size: 14px;
    font-weight: 400;
    color: #5a5858;
}

.chartWithMarkerOverlay {
    position: relative;
    width: 700px;
}

.overlay-text {
    width: 200px;
    height: 200px;
    position: absolute;
    top: 50px; /* chartArea top */
    left: 200px; /* chartArea left */
}

.overlay-marker {
    width: 50px;
    height: 50px;
    position: absolute;
    top: 53px; /* chartArea top */
    left: 528px; /* chartArea left */
}

/* Main content */
.main {
    margin-left: 200px; /* Same as the width of the sidenav */
    font-size: 20px; /* Increased text to enable scrolling */
    padding: 0px 10px;
}

/* Optional: Style the caret down icon */
.fa-caret-down {
    float: right;
    padding-right: 8px;
}


.Adminsidenav {
    height: 100%; /* Full-height: remove this if you want "auto" height */
    position: fixed; /* Fixed Sidebar (stay in place on scroll) */
    z-index: 2; /* Stay on top */
    top: 0; /* Stay at the top */
    left: 0;
    width: 250px;
    background-color: #f8f9fa; /* Black */
    overflow-x: hidden; /* Disable horizontal scroll */
    padding-top: 20px;
}
.nav {
    list-style: none;
    text-align: center;
    padding: 0;
    margin: 0;
    text-decoration: none;
    font-family: 'Roboto','Open Sans';
    background-color: #404040;
    position: fixed;
    top: 0;
    width: 100%;
    font-size: 18px;
    font-weight: 400;
}



html, body {
    margin: 0;
    padding: 0;
    height: 100%
}

.responsive {
    width: 100%;
    height: auto;
}

nav {
    box-shadow: 2px 2px whitesmoke;
}

.bg-dng {
    color: #be0030;
}

.bg-green {
    color: #be0030;
    background-color: #be0030;
}

.bg-blue {
    color: #1c176b;
    background-color: #1c176b;
}


.vseperator {
   height:20px;
}

.modal-content {
    border-radius: 0px !important;
    border: 0px !important;
}

.bgoppositetheme {
    color: #283d6b;
}



.AccTitle {
    font-family: 'Metropolis','Roboto','Open Sans';
    font-size: 24px;
    font-weight: 500;
    color: white;
}

.MenuRow {
    cursor: pointer;
    height: 35px;
}

.Myimg {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 40%;
}
 


.LeftBlankDivBorder {
    border-bottom: thin;
    border-left: none;
    border-right: thin;
    border-top: thin;
    border-bottom-style: ridge;
    border-top-style: ridge;
    border-right-style: ridge;
}

.RightBlankDivBorder {
    border-bottom: thin;
    border-right: none;
    border-left: thin;
    border-top: thin;
    border-bottom-style: ridge;
    border-top-style: ridge;
    border-left-style: ridge;
}

.TopAndBottomBorder {
    border-bottom: thin;
    border-right: none;
    border-left: none;
    border-top: thin;
    border-bottom-style: ridge;
    border-top-style: ridge;
    border-color: whitesmoke;
}

.BottomDivBorder {
    border-bottom: thin;
    border-right: none;
    border-left: none;
    border-top: none;
    border-bottom-style: Solid;
    border-color: whitesmoke;
}



.LeftBlankGreenBorder {
    border-bottom: thin;
    border-left: none;
    border-right: thin;
    border-top: thin;
    border-bottom-style: dotted;
    border-top-style: dotted;
    border-right-style: dotted;
    border-color: #66af5c;
}

.RightBlankGreenBorder {
    border-bottom: thin;
    border-right: none;
    border-left: thin;
    border-top: thin;
    border-bottom-style: dotted;
    border-top-style: dotted;
    border-left-style: dotted;
    border-color: #66af5c;
}

.NoBorder {
    border-bottom: none;
    border-right: none;
    border-left: none;
    border-top: none;
}


.FullBorderDotted {
    border-bottom: thin;
    border-right: thin;
    border-left: thin;
    border-top: thin;
    border-bottom-style: dotted;
    border-top-style: dotted;
    border-left-style: dotted;
    border-right-style: dotted;
    border-color: #66af5c;
}


.FullBorderSolid {
    border-bottom: thin;
    border-right: thin;
    border-left: thin;
    border-top: thin;
    border-bottom-style: ridge;
    border-top-style: ridge;
    border-left-style: ridge;
    border-right-style: ridge;
    border-color: whitesmoke;
}

.FullDivBorderSolid {
    border-bottom: thin;
    border-right: thin;
    border-left: thin;
    border-top: thin;
    border-bottom-style: inset;
    border-top-style: inset;
    border-left-style: inset;
    border-right-style: inset;
    border-color: whitesmoke;
}



#FullPage {
    min-height: 80vh;
}

.ShieldFont {
    font-size: 60px;
    font-weight: 300;
    color: #da0460;
}

.Heading {
    font-family: 'Metropolis','Roboto','Open Sans';
    font-size: 64px;
    font-weight: 500;
    color: #283d6b;
}

.ProdTitle {
    font-family: 'Metropolis','Roboto','Open Sans';
    font-size: 30px;
    font-weight: 500;
    color: #283d6b;
}

.ProdDesc {
    font-family: 'Metropolis','Roboto','Open Sans';
    font-size: 16px;
    font-weight: 400;
    color: #283d6b;
}

.ProdDescMed {
    font-family: 'Metropolis','Roboto','Open Sans';
    font-size: 14px;
    font-weight: 300;
    color: #283d6b;
}

.ProdDescSmall {
    font-family: 'Metropolis','Roboto','Open Sans';
    font-size: 12px;
    font-weight: 300;
    color: #283d6b;
}

.ContentSmall {
    font-family: 'Metropolis','Roboto','Open Sans';
    font-size: 12px;
    font-weight: 300;
    color: #000;
}

.ContentMed {
    font-family: 'Metropolis','Roboto','Open Sans';
    font-size: 12px;
    font-weight: 400;
    color: #000;
}

.LinkBlueFont {
    font-family: 'Metropolis','Roboto','Open Sans';
    font-size: 14px;
    font-weight: 300;
    color: #283d6b;
}
.wrapper {
    position: relative;
}

 .wrapper span {
        position: absolute;
        top: -3px;
        right: -5px;
        color: #202C4D;
        border: #08174a;
        border-radius: 80%;
        height: 16px;
        width: 16px;
        background: #9cc5ea;
    }




#topheader .navbar-nav li.active > a {
    
    color: white;
}



.modal-header {
    display: block !important;
}

.modal-title {
    float: left;
}

.modal-header .close {
    float: right;
}
.fixed-element {
    margin-top: 70px;
}

.icon-bar {
    width: 100%;
    background-color: #555;
    overflow: auto;
}


.ToolbarColor {
    width: 100%;
    background-color: #b59a81;
    overflow: auto;
}

.KeypadButtons {
    font-family: 'Metropolis','Poppins','Roboto','Open Sans','Arial','sans-serif';
    font-size: 20px;
    font-weight: 500;
    color: white;
    width: 80px;
    height: 60px;
    background-color: #08174a;
}

.FunctionButtons {
    font-family: 'Metropolis','Poppins','Roboto','Open Sans','Arial','sans-serif';
    font-size: 20px;
    font-weight: 500;
    color: black;
    width: 80px;
    height: 60px;
    background-color: #eceded;
}


.OrderTable {
    font-family: 'Metropolis','Roboto','Open Sans';
    font-size: 14px;
    font-weight: 400;
    color: #08174a;
    background-color: white;
}

.OrderTableHead {
    font-family: 'Metropolis','Roboto','Open Sans';
    font-size: 14px;
    font-weight: 400;
    color: #3c5a9b;
    background-color: whitesmoke;
}

 

.bootbox .modal-header {
    flex-direction: row-reverse;
}




.facolor {
    cursor: pointer;
    color: #be0030;
}

 
.cellContainerThreeInARow {
    width: 32.8%;
    float: left;
}
 
.DivFourInARow {
    width:23.8%;
    float: left;
    
}

.GreyTitle {
    font-family: 'Metropolis','Poppins','Roboto','Open Sans','Arial','sans-serif';
    font-size: 16px;
    font-weight: 500;
    color: #c5c5c5;
}

.DivTwoInARow {
    width: 50%;
    float: left;
}

.DivThreeInARow {
    width: 32%;
    float: left;
}

 
#SubTotalDiv {
    line-height: 2;
    text-align: center;
    color: white;
    font-size: 30px;
    font-family: sans-serif;
    font-weight: bold;
    text-shadow: 0 1px 0 #84BAFF;
    box-shadow: 0 0 2px #e0dfdf;
}

bottom-border {
    border: none;
    border-bottom: 3px solid dimgray; /* Change color as needed */
    outline: none;
    border-radius: 0;
    background-color: transparent;
    transition: border-bottom 0.3s;
}

.bottom-border:focus {
    border-bottom: 2px solid blue; /* Change color for focus state */
    box-shadow: none; /* Remove box-shadow on focus */
}

.gradient-button {
    display: inline-block;
    padding: 10px 20px;
    font-size: 16px;
    color: #fff;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    border-radius: 5px;
    background: linear-gradient(to right, #3f3b59,#3f3b59);
    border: none;
    transition: background 0.3s ease;
}


.RegTitleMain {
    font-family: 'Questrial','Lato','Poppins','Open Sans';
    font-size: 30px;
    font-weight: 700;
}


.whychoose {
    font-family: 'Metropolis','Figtree';
    font-size: 18px;
    font-weight: 300;
}

.whychoosetitle {
    font-family: 'Metropolis','Figtree';
    font-size: 20px;
    font-weight: 700;
}

.maincontent {
    color: white;
    font-family: 'Metropolis','Figtree','Montserrat','Roboto','Lato','Poppins','Open Sans';
    font-size: 28px;
    font-weight: 500;
}

.MainIconTitle {
    color: black;
    font-family: 'Metropolis','Figtree','Montserrat','Roboto','Lato','Poppins','Open Sans';
    font-size: 22px;
    font-weight: 500;
}

.slide-text {
    position: absolute;
    left: 55px;
    top: 80px;
    font-family: 'Metropolis','Figtree','Montserrat','Lato','Poppins','Open Sans';
    font-size: clamp(36.954px, 2.31rem + ((1vw - 3.2px) * 2.425), 52px);
    font-weight: 500;
    color: white;
    padding-left: 50px;
    z-index: 1;
}

.product-highlight {
    font-family: 'Metropolis','Figtree','Montserrat','Lato','Poppins','Open Sans';
    font-size: clamp(36.954px, 2.31rem + ((1vw - 3.2px) * 2.425), 52px);
    font-weight: 500;
    color: white;
}

.product-title {
    font-family: 'Metropolis','Figtree','Montserrat','Lato','Poppins','Open Sans';
    font-size: clamp(24.954px, 2.31rem + ((1vw - 3.2px) * 2.425),46px);
    font-weight: 600;
    color: white;
}


.product-points {
    font-family: 'Metropolis','Figtree','Montserrat','Lato','Poppins','Open Sans';
    font-size: clamp(24.954px, 2.31rem + ((1vw - 3.2px) * 2.425),36px);
    font-weight: 400;
    color: white;
}

.product-para {
    font-family: 'Metropolis','Figtree','Montserrat','Lato','Poppins','Open Sans';
    font-size: clamp(16.954px, 2.31rem + ((1vw - 3.2px) * 2.425),30px);
    font-weight: 400;
    color: white;
}