@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap);

:root {
    --color1: #92a207;
    --color2: #e63f53;
    --color3: #2b8e60;
    --color4: #37d68d;
    --color5: #1a1a1a;
    --gradient: linear-gradient(238deg, #4D8AFF -8%, #47E5B4 112%);
    --p-color: #333333;
}


body {
    font-family: "Poppins", sans-serif;
    line-height: 1.5 !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.required-lbl {
    color: #ff0000 !important;
}

#togglePassword {
    transition: color 0.3s ease;
    cursor: pointer;
}

/* .modal-header {
    background: #4eb7b9 !important;
    color: #fff !important;
} */

.modal-header {
    background: #92a207 !important;
    color: #fff !important;
}

/* modify font-family of all text related html elements including the value of the textarea, inputs and selects  to Poppins */
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video,
textarea,
input,
select {
    font-family: "Poppins", sans-serif !important;
}

.form-check-input:disabled {
    opacity: .6 !important;
}

.form-check-input:disabled~.form-check-label,
.form-check-input[disabled]~.form-check-label {
    opacity: .7 !important;
}

/* SCREEN LOADER */

#screen-loader {
    z-index: 999;
    background-color: #fff;
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
}

.boxes {
    height: 32px;
    width: 32px;
    position: relative;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    margin-top: 32px;
    -webkit-transform: rotateX(60deg) rotateZ(45deg) rotateY(0deg) translateZ(0px);
    transform: rotateX(60deg) rotateZ(45deg) rotateY(0deg) translateZ(0px);
}

.boxes .box {
    width: 32px;
    height: 32px;
    top: 0px;
    left: 0;
    position: absolute;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
}



.boxes .box:nth-child(1) {
    -webkit-transform: translate(100%, 0);
    transform: translate(100%, 0);
    -webkit-animation: box1 1s linear infinite;
    animation: box1 1s linear infinite;
}

.boxes .box:nth-child(2) {
    -webkit-transform: translate(0, 100%);
    transform: translate(0, 100%);
    -webkit-animation: box2 1s linear infinite;
    animation: box2 1s linear infinite;
}

.boxes .box:nth-child(3) {
    -webkit-transform: translate(100%, 100%);
    transform: translate(100%, 100%);
    -webkit-animation: box3 1s linear infinite;
    animation: box3 1s linear infinite;
}

.boxes .box:nth-child(4) {
    -webkit-transform: translate(200%, 0);
    transform: translate(200%, 0);
    -webkit-animation: box4 1s linear infinite;
    animation: box4 1s linear infinite;
}



.boxes .box>div {
    background: #5C8DF6;
    --translateZ: 15.5px;
    --rotateY: 0deg;
    --rotateX: 0deg;
    position: absolute;
    width: 100%;
    height: 100%;
    background: #5C8DF6;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    -webkit-transform: rotateY(var(--rotateY)) rotateX(var(--rotateX)) translateZ(var(--translateZ));
    transform: rotateY(var(--rotateY)) rotateX(var(--rotateX)) translateZ(var(--translateZ));
}

.boxes .box>div:nth-child(1) {
    top: 0;
    left: 0;
    background: #5C8DF6;
}

.boxes .box>div:nth-child(2) {
    background: #145af2;
    right: 0;
    --rotateY: 90deg;
}

.boxes .box>div:nth-child(3) {
    background: #447cf5;
    --rotateX: -90deg;
}

.boxes .box>div:nth-child(4) {
    background: #DBE3F4;
    top: 0;
    left: 0;
    --translateZ: -90px;
}


@keyframes box1 {

    0%,
    50% {
        transform: translate(100%, 0);
    }

    100% {
        transform: translate(200%, 0);
    }
}

@keyframes box2 {
    0% {
        transform: translate(0, 100%);
    }

    50% {
        transform: translate(0, 0);
    }

    100% {
        transform: translate(100%, 0);
    }
}

@keyframes box3 {

    0%,
    50% {
        transform: translate(100%, 100%);
    }

    100% {
        transform: translate(0, 100%);
    }
}

@keyframes box4 {
    0% {
        transform: translate(200%, 0);
    }

    50% {
        transform: translate(200%, 100%);
    }

    100% {
        transform: translate(100%, 100%);
    }
}

.sp-nav-dd.dropdown-toggle::after {
    top: 9px !important;
    position: absolute !important;
    right: -2px !important;
}

.main-logo-icon img,
.main-logo img{
    /* background-color: var(--color1) !important; */
    border-radius: 10px;
}

#shrink-text{
    font-size: 95% !important;
}


/* ////////////////////////////
   | override bootstrap colors |
   \\\\\\\\\\\\\\\\\\\\\\\\\\\\
*/
.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #92a207 !important;
  --bs-btn-border-color: #92a207 !important;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #e63f53 !important;
  --bs-btn-hover-border-color: #e63f53 !important;
  --bs-btn-focus-shadow-rgb: 49,132,253;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #92a207 !important;
  --bs-btn-active-border-color: #92a207 !important; 
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #92a207 !important;
  --bs-btn-disabled-border-color: #92a207 !important;
}

.active > .page-link, .page-link.active {
  z-index: 3;
  background-color: #92a207 !important;
  border-color: #92a207 !important;
}

.breadcrumb .breadcrumb-item a {
  color: #92a207 !important;
}