@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

:root {
    /*Colors Start*/
    /*<-==========================================->*/
    --clr-neutral-100: 0, 172, 77;
    --clr-neutral-200: #aaaaaa;
    --clr-neutral-400: #e2e2e3;
    --clr-Pink: #d71e66;
    --clr-green: #0cd149;
    --clr-orange: #ff6e54;
    --clr-red: #DC2525;
    --clr-purple: #9609CA;
    --clr-neutral-800: rgba(255, 255, 255, 0.8);
    --clr-neutral-900: rgba(0, 0, 0, 0.05);
    --clr-neutral-1000: rgba(0, 0, 0, 0.7);
    --BB-Color-Pink: #f594a6;
    --BB-Color1-Light-Purple: #a1adc4;
    --BB_Color1-Dark-Purple: #7a87a3;
    --clr-primary-200: #ffff;
    --clr-primary-300: #000000;
    --clr-primary-400: #ff0000;
    /*Colors End*/
    /*<-==========================================->*/
    /*Font size Start*/
    /*<-==========================================->*/
    --fs-normal: 1.6rem;
    --fs-700: 4rem;
    --fs-600: 2.3rem;
    --fs-500: 2rem;
    --fs-400: 1.9rem;
    --fs-300: 1.7rem;
    --fs-200: 14px;
    --fs-150: 13px;
    --fs-100: 12px;
    /*Font Size End*/
    /*<-==========================================->*/
    /*Font weight Start*/
    /*<-==========================================->*/
    --fw-400: 500;
    --fw-600: 600;
    --fw-700: 700;
    --fw-900: 900;
    /*Font weight End*/
    /*<-==========================================->*/
}

@font-face {
    font-family: AvenirNextLTPro-Regular;
    src: url(../../fonts/Montserrat-Regular.ttf);
}

/* <-==========================-> */
/* CSS REST */
/* Box sizing rules */
*,
*::before,
*::after {
    box-sizing: border-box;
}

/* Remove default margin */
body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
    margin: 0;
}

/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */
ul[role='list'],
ol[role='list'] {
    list-style: none;
}

/* Set core root defaults */
html:focus-within {
    scroll-behavior: smooth;
}

/* Set core body defaults */
body {
    min-height: 100vh;
    text-rendering: optimizeSpeed;
    line-height: 1.5;
}

/* A elements that don't have a class get default styles */
a:not([class]) {
    text-decoration-skip-ink: auto;
}

/* Make images easier to work with */
img,
picture {
    max-width: 100%;
    display: block;
}

/* Inherit fonts for inputs and buttons */
input,
button,
textarea,
select {
    font: inherit;
}

/* Remove all animations, transitions and smooth scroll for people that prefer not to see them */
@media (prefers-reduced-motion: reduce) {
    html:focus-within {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

p,
label {
    font-size: 16px;
}

/* CSS REST End*/
/* <-==========================-> */

html {
    font-size: 62.5%;
}

body {
    font-family: AvenirNextLTPro-Regular, Arial, Helvetica, sans-serif;
    font-weight: var(--fw-400);
    background: #f5f5f5;
    line-height: 1.6;
    color: var(--clr-primary-300);
    height: 100%;
    margin: 0;
    width: 100%;
    display: flex;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    flex-direction: column;
    position: relative;
}

#mainSection {
    width: 100%;
    display: flex;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    flex-direction: column;
    position: relative;
    min-height: 100vh;
}

h1,
h2,
h3 {
    line-height: 1.1;
}

h2 {
    font-size: var(--fs-700);
    color: var(--clr-neutral-200);
}


.height-86 {
    height: 86%;
}

/* Parent Elements access different inheritance properties */
/* <-==========================-> */
.parentVal {
    --gap: 0.5rem
}

.MyRewards {
    --gap: 4rem;
}

.txtBoxes {
    --gap: .4rem;
    --value-pad: 1.75rem;
    --borderColorSet: rgba(var(--clr-neutral-100), 1);
}

.parentVal {
    --borderColorSet: rgba(var(--clr-neutral-100), 1);
}

.txtBoxesPass {
    --marginValue: 12px;
}

.setRelative {
    position: relative !important;
}

.parentAbsolute {
    --AbsTop: 0%;
    --AbsLeft: 50%;
    --AbsTransLate: -50%;
}

.parentAbsoluteLogin {
    --AbsTop: 50%;
    --AbsLeft: 50%;
    --AbsTransLate: -50%;
}

.RewardsCard {
    --AbsTop: unset;
    --AbsLeft: 50%;
    --AbsBottom: -15%;
    --AbsTransLate: -50%;
}

.thumbsUp {
    --AbsTop: -5px;
    --AbsLeft: 50%;
    --AbsTransLate: -50%;
}

.UserNameCircle {
    --AbsLeft: 15%;
    --borderColorSet: var(--clr-primary-200);
}

.objectPosition {
    object-fit: cover;
    object-position: 100%;
}

.objectAltPosition {
    object-fit: cover;
    object-position: top;
}

.radioBtnParent {
    --marginTValue: 25px;
}

.headerParent {
    --heightValSet: 30vh;
}

.MyRewards {
    --heightValSet: 18.5vh
}

.IndividualRewardCard {
    --heightValMax: 26rem
}

.elementAbsolute {
    position: absolute;
    top: var(--AbsTop);
    bottom: var(--AbsBottom), unset;
    left: var(--AbsLeft);
    transform: translate(var(--AbsTransLate), var(--AbsTransLate));
    -ms-transform: translate(var(--AbsTransLate), var(--AbsTransLate));
    -webkit-transform: translate(var(--AbsTransLate), var(--AbsTransLate));
}

.modalParent {
    --borderColorSet: var(--clr-primary-200);
}

.SelectParent {
    --clr-Select-100: var(--clr-primary-200);
    --clr-Select-200: rgba(var(--clr-neutral-100), 1);
    --value-pad: 20px;
}

.btnCancel {
    --clr-Select-333: var(--clr-neutral-200);
    --clr-Select-fff: var(--clr-primary-200);
}

.navigateMenu {
    --gap: 0;
}

.navWrapper {
    height: 6.3rem;
}

.navigateMenu {
    width: 100%;
    height: 5.6rem;
    display: flex;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    justify-content: center;
    align-items: center;
}

.modalCompleteEl {
    --value-pad: 5rem;
    --borderColorSet: rgba(var(--clr-neutral-100), 1);
}

.PersonalSelectAlt {
    --borderColorSet: rgba(var(--clr-neutral-100), 1);
}

.parentAvailability {
    --value-pad: 1.2rem
}

.parentBtnCal {
    --borderColorSet: var(--clr-primary-300);
}

.welcomeParent {
    --marginTValue: 2rem;
}

.parentVal {
    --value-pad: 1rem
}

.parentQuestionnaireComp {
    --value-pad: 1.8rem;
    --marginValue: 25px;
    --marginTValue: 160px;
}

.navigateMenu {
    --gap: 0;
}


/* Add spacing For each child except first-child */
/* <-==========================-> */

h1:focus {
    outline: none;
}

a, .btn-link {
    color: #0071c1;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.content {
    padding-top: 1.1rem;
}

.valid.modified:not([type=checkbox]) {
    outline: 0;
    box-shadow: rgba(var(--clr-neutral-100), .6) 0px 1px 4px;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

a {
    text-decoration: none !important;
}

article {
    padding: 0;
}

.TreatmentAdvise a:not([href]):not([class]), .TreatmentAdvise a:not([href]):not([class]):hover {
    text-decoration: none;
    color: rgba(var(--clr-neutral-100),1);
}

a:not([href]):not([class]), a:not([href]):not([class]):hover {
    text-decoration: none;
    color: #000;
}

.validation-errors {
    display: inline-block;
    margin: 1rem auto;
    max-width: 46rem;
    list-style: none;
    padding: 0;
}

.validation-message {
    font-size: var(--fs-200);
    background: #E5383B;
    border-radius: 1.2rem 0 1.2rem 0;
    -moz-border-radius: 1.2rem 0 1.2rem 0;
    -webkit-border-radius: 1.2rem 0 1.2rem 0;
    color: #f4f4f4;
    padding: 0.6rem 2rem;
    margin: 1rem 0;
    border: 1px solid #E5383B;
    transition: all .25s ease-in;
}

.Set_fixedPosition {
    position: fixed;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
}
/*Media Queries Start*/
/*<-==========================================->*/
@media (max-width: 1800px), (max-width: 1700px), (max-width: 1600px), (-webkit-device-pixel-ratio: 1.1), (-webkit-device-pixel-ratio: 1.25), (-webkit-device-pixel-ratio: 1.5) {
}

@media(max-width:1305px) {
}

@media (max-width: 1250px), (-webkit-device-pixel-ratio: 1.75), (-webkit-device-pixel-ratio: 2) {
}

@media(max-width:1200px) {

   
}


@media screen and (min-width: 960px) {

    html {
        font-size: 75%;
    }

    .LoginHeadWrap .logo {
        width: 25rem;
        padding-top: 2px;
        margin: .5rem 0 0 3rem;
        display: inline-block;
    }

    .LoginHeadWrap {
        height: 100%;
    }

    .PersonalSelect {
        width: 30rem;
    }

    .font-Size-verySmall {
        font-size: var(--fs-300);
    }

    .MoreIcons {
        width: 5rem;
        height: 5rem;
    }

    .navWrapper {
        height: 6.3rem;
    }



    .Curved_Top {
        z-index: 9000;
        position: fixed;
        top: 0;
        right: 0;
    }

    .navigateMenu > .flex-flow {
        align-items: center;
    }

    .navigateMenu .imgIconS {
        
        width: fit-content;
    }

    .navigateMenu .svgIconImg {
        width: 5rem;
    }

    .Center_w_Margin--LG {
        margin: 0 auto;
    }
}

@media (max-width: 768px) {


}

@media (max-width: 600px) {

    .deskContent {
        display: inline-block;
    }

    .theHeader h3 {
        margin: 0 auto;
        text-align: center;
    }

    div.txtBoxes {
        --value-pad: .25rem;
    }

    div.padding-R, div.padding-L {
        padding-right: var(--value-pad, 12px);
        padding-left: var(--value-pad, 12px);
    }

    .Validation .width-75 {
        width: fit-content;
    }

    .Set_fixedPosition {
        transform: translate(-50%, 0%);
        -webkit-transform: translate(-50%, 0%);
        -ms-transform: translate(-50%, 0%);
    }

    .Dischem_Logo {
        margin: 1rem auto 0 auto;
    }
}

@media (max-width: 360px) {
    html {
        font-size: 51%;
    }

    .minClamp {
        min-width: unset;
    }

    label.min_Width160 {
        min-width: 12rem;
    }

}

/*Media Queries End*/
/*<-==========================================->*/
