/* * - * * - * * - * * - * * - * * - */
/*- - - - - - Custome CSS - - - - - -*/
/* * - * * - * * - * * - * * - * * - */

/* - - - - Typography - - - -  */

.text-transform-none { text-transform: none !important; }


/* - - - - Font Sizes - - - -  */

.font-8 { font-size: 8px !important; }
.font-9 { font-size: 9px !important; }
.font-10 { font-size: 10px !important; }
.font-11 { font-size: 11px !important; }
.font-12 { font-size: 12px !important; }
.font-13 { font-size: 13px !important; }
.font-14 { font-size: 14px !important; }
.font-15 { font-size: 15px !important; }


/* - - - - Text Colors - - - -  */

.text-grey-light { color: #8f8a8a !important; }
.text-grey-dark { color: #343a40 !important; }
.text-grey { color: #686868 !important; }
.text-green { color: #28a745 !important; }
.text-light-green { color: #8CC152 !important; }


/* - - - - Line Height - - - -  */

.lh-20px { line-height: 20px !important; }
.lh-25px { line-height: 25px !important; }
.lh-50px { line-height: 50px !important; }

.txt-dec-none > li { text-decoration: none; }

/* - - - - Background Colors - - - -  */

.bg-grey { background: #686868 !important; }
.bg-grey-01 { background-color: #e7ede1 !important; }
.bg-white-01 { background-color: #fcfcfc !important; }
.bg-light-green { background: #e7ede1 !important; }
.bg-green-transparent { background: #8cd33f78 !important; }
.bg-grey-transparent { background: #5e5e5e96 !important; }

/* - - - - Width & height in percentage - - - - */
.width-10 { width: 10%; }
.width-20 { width: 20%; }
.width-30 { width: 30%; }
.width-40 { width: 40%; }
.width-50 { width: 50%; }
.width-60 { width: 60%; }
.width-70 { width: 70%; }
.width-80 { width: 80%; }
.width-90 { width: 90%; }
.width-100 { width: 100%; }


.height-10 { height: 10% !important; }
.height-20 { height: 20% !important; }
.height-30 { height: 30% !important; }
.height-40 { height: 40% !important; }
.height-45 { height: 45% !important; }
.height-50 { height: 50% !important; }
.height-51 { height: 51% !important; }
.height-60 { height: 60% !important; }
.height-70 { height: 70% !important; }
.height-80 { height: 80% !important; }
.height-85 { height: 85% !important; }
.height-90 { height: 90% !important; }
.height-100 { height: 100% !important; }

.min-height-10 { height: 10%; }
.min-height-20 { height: 20%; }
.min-height-30 { height: 30%; }
.min-height-40 { height: 40%; }
.min-height-50 { height: 50%; }
.min-height-60 { height: 60%; }
.min-height-70 { height: 70%; }
.min-height-80 { height: 80%; }
.min-height-90 { height: 90%; }
.min-height-100 { height: 100%; }


/* - - - - Width in pixels - - - - */
.width-auto { width: auto !important; }
.width-310px { width: 310px; }
.width-320px { width: 320px; }
.width-330px { width: 330px; }
.width-340px { width: 340px; }
.width-350px { width: 350px; }

.height-155px { height: 155px !important; }
.height-310px { height: 310px !important; }
.height-320px { height: 320px !important; }
.height-330px { height: 330px !important; }
.height-340px { height: 340px !important; }
.height-350px { height: 350px !important; }
.height-617px { height: 617px !important; }
.height-620px { height: 620px !important; }
.height-750px { height: 750px !important; }


/* - - - - Margins & Paddings - - - - */

.mt-155px { margin-top: 155px !important; }
.mt-350px { margin-top: 350px !important; }
.mt-360px { margin-top: 360px !important; }
.mt-370px { margin-top: 370px !important; }
.mt-380px { margin-top: 380px !important; }
.mt-390px { margin-top: 390px !important; }
.mt-400px { margin-top: 400px !important; }

.ml-20px { margin-left: 20px !important; }
.mr-20px { margin-right: 20px !important; }

.py-5px { padding-top: 5px !important; padding-bottom: 5px !important; }
.px-5px { padding-right: 10px !important; padding-left: 10px !important; }


.top-180px { top: 180px !important; }
.right-20px { right: 20px !important; }
.right-50px { right: 50px !important; }
.right-55px { right: 55px !important; }

/* - - - - Button Styles - - - - */
.vbtn-red-xxsm { 
    font-size: 12px;
    color: #ffffff !important;
    background-color: #dc3545;
    border-color: #dc3545;
    padding: 5px 10px !important;
}
.vbtn-red-xxsm:hover { 
    background-color: #dc3545;
    border-color: #dc3545;
}
.vbtn-red-xxsm:focus { 
   background-color: #dc3545;
    border-color: #dc3545;
}

.vbtn-green { 
    background-color: #8CC152 !important;
    border: 1px solid #7bb53d !important;
}

.vbtn-green-xxsm {
    font-size: 12px;
    color: #000000 !important;
    background-color: #e7ede1 !important;
    border: 1px solid #92cd51 !important;
    padding: 5px 10px !important;
}
.vbtn-green-xxsm:hover { 
    background-color: #8CC152 !important;
}
.vbtn-green-xxsm:focus { 
    background-color: #8CC152 !important;
}
/*.vbtn-xxsm:active { 
    color: #ffffff !important;
    background-color: #e7ede1 !important;
}*/

.vbtn-xxsm {
    font-size: 12px;
    color: #000000 !important;
    background-color: #e7ede1 !important;
    border: 1px solid #92cd51 !important;
    padding: 5px 10px !important;
}
.vbtn-xxsm:hover {
    background-color: #8CC152 !important;
}
.vbtn-xxsm:focus { 
    background-color: #8CC152 !important;
}
/*.vbtn-xxsm:active { 
    color: #ffffff !important;
    background-color: #e7ede1 !important;
}*/


/* - - - - Border - - - -  */

.br-01-1px { border: 1px solid #cdd1c9 !important; }


/* - - - - Border Radius - - - -  */

.br-radius-5px { border-radius: 5px !important; }
.br-radius-6px { border-radius: 6px !important; }
.br-radius-7px { border-radius: 7px !important; }
.br-radius-8px { border-radius: 8px !important; }
.br-radius-9px { border-radius: 9px !important; }
.br-radius-10px { border-radius: 10px !important; }
.br-radius-1 { border-radius: 1rem !important; }
.br-radius-2 { border-radius: 2rem !important; }
.br-radius-3 { border-radius: 3rem !important; }
.br-radius-4 { border-radius: 4rem !important; }
.br-radius-5 { border-radius: 5rem !important; }

.br-tl-radius-10px { border-top-left-radius: 10px !important; }
.br-tl-radius-15px { border-top-left-radius: 15px !important; }

.br-tr-radius-10px { border-top-right-radius: 10px !important; }
.br-tr-radius-15px { border-top-right-radius: 15px !important; }

/* - - - - Dividers - - - -  */

.divider-1 {
    height: 1px;
    display: block;
    background-color: #d6e1ca;
    margin-top: 10px;
    margin-bottom: 10px;
}

/* - - - - Custom Header - - - - */
.vheader {
    background-color: #ffffff;
    position: fixed;
    top: 10px;
    left: 10px;
    right: 10px;
    height: 50px;
    z-index: 99;
    transition: all 300ms ease;
    border-bottom: solid 1px rgba(0, 0, 0, 0.08);
    border-radius: 7px;
    -webkit-box-shadow: -1px 1px 3px 0px rgba(61,61,61,0.5);
    -moz-box-shadow: -1px 1px 3px 0px rgba(61,61,61,0.5);
    box-shadow: -1px 1px 3px 0px rgba(61,61,61,0.5);
}

.vheader-search { 

    position: fixed !important;
    height: 70px !important;
    z-index: 99 !important;
    transition: all 300ms ease !important;
    padding-top: 10px !important;
    /*border-bottom: solid 1px rgba(0, 0, 0, 0.08);*/
    border-radius: 7px !important;
    /*-webkit-box-shadow: -1px 1px 3px 0px rgba(61,61,61,0.5);
    -moz-box-shadow: -1px 1px 3px 0px rgba(61,61,61,0.5);
    box-shadow: -1px 1px 3px 0px rgba(61,61,61,0.5);*/
}

.vheader-fixed {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99;
    transition: all 300ms ease;
}

.vfooter-bar{
    position: fixed;
    bottom: 0px;
    left: 0px;
    right: 0px;
    z-index: 98;
    background-color: #fcfcfc;
    display: flex;
    min-height: 61px;
    border-top: solid 1px rgba(0, 0, 0, 0.05);
    text-align: center;
    box-shadow: 0 -5px 15px 0 rgb(0 0 0 / 9%) !important;
    transition: transform 350ms ease !important;
}


/* - - - - Box Shadow - - - -  */

.bx-shadow-01 { 
    -webkit-box-shadow: -1px 1px 3px 0px rgba(61,61,61,0.5);
    -moz-box-shadow: -1px 1px 3px 0px rgba(61,61,61,0.5);
    box-shadow: -1px 1px 3px 0px rgba(61,61,61,0.5);
}
.bx-shadow-02 { 
    -webkit-box-shadow: 0px -3px 14px 1px rgba(0,0,0,0.54);
    -moz-box-shadow: 0px -3px 14px 1px rgba(0,0,0,0.54);
    box-shadow: 0px -3px 14px 1px rgba(0,0,0,0.54);
}
.bx-shadow-03 { 
    -webkit-box-shadow: 0 4px 24px 0 rgb(0 0 0 / 10%) !important;
    -moz-box-shadow: 0 4px 24px 0 rgb(0 0 0 / 10%) !important;
    box-shadow: 0 4px 24px 0 rgb(0 0 0 / 10%) !important;
}


/* - - - - Fixed Content - - - -  */

.content-fixed { 
    position: fixed;
    bottom: 0px;
    left: 0px;
    right: 0px;
    z-index: 98;
    background-color: #fcfcfc;
    /*border-top: solid 1px rgba(0, 0, 0, 0.05);*/
    box-shadow: 0 -5px 15px 0 rgb(0 0 0 / 9%) !important;
    transition: transform 350ms ease !important;
}

/* - - - - Dropdown CSS - - - -  */
.dropbtn {
    color: white;
    /*padding: 16px;*/
    font-size: 16px;
    border: none;
    cursor: pointer;
}

/*.dropbtn:hover, .dropbtn:focus {
  background-color: #2980B9;
  border-radius: 100%;
}*/

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    top: 10px;
    right: 15px;
    width: fit-content;
    position: absolute;
    background-color: #ffffff;
    min-width: 160px;
    overflow: auto;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

.dropdown-content a {
  color: black;
  padding: 5px 15px !important;
  text-decoration: none;
  display: block;
}

/*.dropdown a:hover {
    background-color: #ddd;
}*/

.show {display: block;}