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 {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
    font-family: "Circular Std", "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: rgba(24, 24, 24, 0.7);
    font-size: 15px;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}

@font-face{font-display:swap;font-family:"Circular Std";font-style:normal;font-weight:normal;src:url('/fonts/CircularStd-Book.woff') format('woff'), url('/fonts/CircularStd-Book.woff2') format('woff2'), url('/fonts/CircularStd-Book.ttf') format('truetype');}
@font-face{font-display:swap;font-family:"Circular Std";font-style:italic;font-weight:normal;src:url('/fonts/CircularStd-BookItalic.woff') format('woff'), url('/fonts/CircularStd-BookItalic.woff2') format('woff2'), url('/fonts/CircularStd-BookItalic.ttf') format('truetype');}
@font-face{font-display:swap;font-family:"Circular Std";font-style:normal;font-weight:bold;src:url('/fonts/CircularStd-Bold.woff') format('woff'), url('/fonts/CircularStd-Bold.woff2') format('woff2'), url('/fonts/CircularStd-Bold.ttf') format('truetype');}
@font-face{font-display:swap;font-family:"Circular Std";font-style:italic;font-weight:bold;src:url('/fonts/CircularStd-BoldItalic.woff') format('woff'), url('/fonts/CircularStd-BoldItalic.woff2') format('woff2'), url('/fonts/CircularStd-BoldItalic.ttf') format('truetype');}

.mt15{ margin-top: 15px;}
.mt20{ margin-top: 20px;}
.mt30{ margin-top: 30px;}
.mt40{ margin-top: 40px;}
.mb20{ margin-bottom: 20px;}
.mb40{ margin-bottom: 40px;}
.pt-60{padding-top: 60px;}
.pt-80{padding-top: 80px;}
.pb-80{padding-bottom: 80px;}
.pt-40{padding-top: 40px;}
.pt-15{padding-top: 15px;}
.pt-4{padding-top: 4px;}
.pt-8{padding-top: 8px;}
.pb-8{padding-bottom: 8px;}
.pb-30{padding-bottom: 30px;}
.pb-20{padding-bottom: 20px;}
.pb-0{padding-bottom: 0px !important;}
.pb-40{padding-bottom: 40px;}
.pb-60{padding-bottom: 60px;}
.px-20{padding-left:20px; padding-right: 20px; }
.privacyText{ font-size: 12px; text-align: center;}
.privacyText a{font-size: 12px; float: none !important; background-size: 1px 1px !important;}
.alignCenter { text-align: center}
.alignLeft {text-align: left}
.alignRight {text-align: right}
.flex{ display: flex;}

.col-md-2{ width: 16.66%; float: left;}
.col-md-3{ width: 25%; float: left;}
.col-md-6{ width: 50%; float: left;}
.col-md-9{ width: 75%; float: left;}
.col-md-10{ width: 83.33%; float: left;}
.col-md-12{ width: 100%; float: left;}

.container {
    padding: 30px 0px 40px;
}

a{
    color: rgba(24, 24, 24, 0.7);
    font-size: 15px;
    text-decoration: none;
}
/*Become a Member Styles Start Here*/
.loginFormContainer{
    max-width: 550px;
    margin: 0 auto;
}
.loginFormContainer .signupMsg{
    max-width: 335px;
    margin: 30px auto;
    text-align: center;
}
.loginFormContainer .signupMsg a{
    color: rgba(75, 129, 159, 1);
    font-weight: 700;
}
/*Login Form Cotainer new design styles code end here*/
.loginFormContainer a{
    background-image: linear-gradient(to right, black 33%, rgba(255,255,255,0) 0%);
    background-position: bottom;
    background-size: 5px 1px;
    background-repeat: repeat-x;
    padding: 5px 0 4px;
    margin: 0 0 20px;
    display: inline-block;
}

h1{
    font-size: 80px;
    letter-spacing: -2px;
    line-height: normal;
    font-weight: 700;
    text-align: center;
    color: rgba(24, 24, 24, 1);
    padding: 80px 0 70px !important;
}

h2{
    font-size: 20px;
    color: #181818;
    font-weight: 700;
    margin: 0 0 20px;
}
p{ font-size: 18px; color: #181818; line-height: 25px;}
.supportContainer h2{padding: 9px 0 0; font-size: 28px;}
/*Support Container new desing code start here*/
.supportContainer .needSprtCont p{font-size: 12px; color: rgba(24, 24, 24, 0.7); font-weight: 400;line-height: 17px; position: relative; padding: 0px;}
.supportContainer .needSprtCont{display: block; margin-bottom: 15px;}
.supportContainer .needSprtCont h2{margin-bottom: 5px;}

.button{
    border: 2px solid rgba(24, 24, 24, 0.13);
    box-sizing: border-box;
    border-radius: 50px;
    font-size: 15px;
    line-height: 20px;
    width: 100%;
    background: #fff;
    padding: 8px 0 13px;
    font-weight: 700;
    color: #181818;
    max-width: 335px;
    cursor: pointer;
    display: inline-block;
}
/*Support Container new desing code end here*/
.login{ background: #FE5F10; opacity: 0.4; color: #fff; padding-top: 13px; border: 2px solid rgba(254, 95, 16, 1);}
.login.active{opacity: 1;}
.googleIcon{ background: url("/img/googleIcon.svg") no-repeat; width: 20px; height: 20px; display: inline-block; position: relative; padding: 0px 15px 0 0; top: 5px; right: 10px;}
.appleIcon{ background: url("/img/appleIcon.svg") no-repeat; width: 24px; height: 24px; display: inline-block; position: relative; padding: 0px 15px 0 0; top: 5px; right: 10px;}
.microsoftIcon{ background: url("/img/microsoftIcon.svg") no-repeat; width: 20px; height: 20px; display: inline-block; position: relative; padding: 0px 15px 0 0; top: 5px; right: 10px;}
.orText{ background: #fff; position: relative; top: 7px; padding: 0px 10px 0; font-size: 15px; color: rgba(24, 24, 24, 0.7);}
.borderBottom{ border-bottom: 1px solid rgba(24, 24, 24, 0.13); width: 47%;}
.illustration{ background: url("/img/Illustration.svg") no-repeat bottom; width: 100%; height: 130px; margin: 150px 0 60px;}
/*Support Container Icons new desing styles code start here*/
.icon { background: #FE5F10 url("img/chat_icn.svg") no-repeat center; width: 50px; height: 50px; border-radius: 50px; display: inline-block; margin: 0 10px 0 0;}
.icon.callIcon{ background-image: url("/img/saleIcon.svg");}
.icon.emailIcon{ background-image: url("/img/email.svg")}
.icon.smsIcon{ background-image: url("img/sms_icn.svg");}
.supportContainer div{ display: flex; align-items: center; padding: 0 0 20px 0;}
/*Support Container Icons new desing styles code end here*/
.strip{border-bottom: 1px solid rgba(24, 24, 24, 0.13);}
.socialIcon a{padding: 0 8px 0 0; display: inline-block; outline: none;}
.NotificationBanner{ background: #181818;}
.NotificationBanner a{ color: #fff; font-size: 12px; background-image: linear-gradient(to right, white 33%, rgba(255,255,255,0) 0%);
    background-position: bottom;
    background-size: 4px 1px;
    background-repeat: repeat-x;
    padding-bottom: 3px;}
.notification{ background: #242424; width: 100%; border-radius: 8px; color: #fff; font-size: 15px; font-weight: 700; display: inline-block; position: relative; margin: 11px 0 8px; max-width: 337px; line-height: 23px;}
.notification span{font-size: 12px; font-weight: normal; display: inline-block;}
.notificationIcon{background: url("/img/Bell.svg") no-repeat center; width: 33px; height: 35px; display: inline-block; padding: 52px 0 13px; float: left; width: 20%; position: relative; top: -8px;}
.notification .col-md-3{ width: 21%; float: left;}
.notification .col-md-9{ width: 62%; float: left;}
.notification.loginNotification{ line-height: 20px;}
.notification.loginNotification .pt-15{ padding-top: 10px;}
.closeIcon{background: url("/img/Close.svg") no-repeat center; width: 12px; height: 12px; display: inline-block; position: absolute; right: 40px; top: 10px; right: 25px; top: 32px; cursor: pointer;}
.accountUpdate{background: url("/img/accountUpdateIcon.svg") no-repeat center !important;}
.showMobile {display: none;}
.logo img{ width: 123px;}
.floating-input[disabled]{ background: rgba(24, 24, 24, 0.06) url("/img/lockIcon.svg") no-repeat 355px center; opacity: 0.6;}
.floating-input[disabled]:focus ~ label, .floating-input[disabled]:not(:placeholder-shown) ~ label{ opacity: 0.6;}
/****  floating-Lable style start ****/
.floating-label {
    position:relative;
    margin-bottom:0px;
    text-align: left;
}
.floating-input {
    background: rgba(24, 24, 24, 0.06); border: none; border-radius: 15px; width: 100%; margin: 10px 0; padding: 34px 20px 19px; font-size: 15px; color: rgba(24, 24, 24, 1);
}
.supportContainer{
    font-size: 18px;
    font-weight: 700;
    color: rgba(24, 24, 24, 1);
    display: inline-block;
    width: 100%;
}
.footer p{ font-size: 15px; color: rgba(24, 24, 24, 0.7);}

.floating-input:focus {
    outline:none;
}

label {
    color:rgba(24, 24, 24, 0.7);
    font-size:15px;
    font-weight:normal;
    position:absolute;
    pointer-events:none;
    left:20px;
    top:36px;
    transition:0.2s ease all;
    -moz-transition:0.2s ease all;
    -webkit-transition:0.2s ease all;
}

.floating-input:focus ~ label, .floating-input:not(:placeholder-shown) ~ label {
    top:29px;
    font-size:12px;
    color:rgba(24, 24, 24, 0.7);
}

/* active state */
.floating-input:focus ~ .bar:before, .floating-input:focus ~ .bar:after {
    width:50%;
}
*, *:before, *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
label.error {
    font-size:12px; position: inherit; top: 0px !important; text-align: left !important; left: 0px !important; color: rgba(238, 49, 49, 1) !important; margin-bottom: 15px; display: inline-block;
}
.floating-input.error{ border: 2px solid rgba(238, 49, 49, 1); background: rgba(238, 49, 49, 0.05);}
.strip.mb40{ margin-bottom: 60px;}
.strip.mt20{ margin-top: 40px;}
.strip.mt40{ margin-top: 60px;}
.logo.px-20, .footer.px-20, .backToProfile.px-20{ padding-left: 60px; padding-right: 60px;}
span.description{ font-size: 18px; letter-spacing: 0px; display: block; font-weight: normal; padding: 10px 0 0; line-height: normal;}
.passwordText{ font-size: 18px; padding: 12px 0;}
.customError{position: inherit; top: 0px !important; margin-bottom: 15px; left: 0; display: inline-block; font-size: 12px; color: rgba(238, 49, 49, 1) !important;}
a.loginLink{ position: absolute; right: 5px; bottom: -7px; font-size: 12px; padding-bottom: 5px !important;}
.login.active {opacity: 1;}
.loginFormContainer a.oauthLogin{ background: none; padding: 8px 0 13px; margin: 0; text-align: center}
.loginFormContainer a.microsoftLogin{ background: none; padding: 8px 0 13px; margin: 0; text-align: center}
/*Support Container new desing styles code start here*/
.supportContainer a{ display: contents; color: rgba(24, 24, 24, 1);line-height: 18px;}
.supportContainer a .sprt-sub-txt{display: contents; font-weight: 400; font-size: 12px; color: rgba(24, 24, 24, 0.7)}
/*Support Container new desing styles code end here*/
.backToProfile a{color: rgba(24, 24, 24, 1);}
.backToProfile img{ position: relative; top: 2px; padding: 0 13px 0 0;}
a.logoutLink{ float: right; padding: 3px 0 0;}
.heading {font-size: 25px; font-weight: 700; color: #181818; letter-spacing: -0.2px; line-height: 40px; padding: 0px 0 25px;}
.heading span{ font-size: 18px; font-weight: normal; color: rgba(24, 24, 24, 0.7);}
.notification .col-md-3 span{ width: 100%; top: 0px; padding: 62px 0 18px;}

/*Become a Member Modal new design styles start here*/
.becomeMemberContainer {
    height: 240px;
}
.becomeMemberContainer .becomeMemberCards{
    border: 1px solid #ECEBE1;
    border-radius: 15px;
    position: relative;
    -webkit-align-items: flex-start;
    -webkit-box-align: flex-start;
    -ms-flex-align: flex-start;
    align-items: flex-start;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 95px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    padding: 0px 15px;
    position: relative;
    width: 120px;
}
.becomeMemberContainer .becomeMemberHng{
    text-align: center;
    font-weight: 700;
    font-size:22px;
    color: #181818D9;
    margin-bottom: 30px;
}
.becomeMemberContainer .becomeMemberCards:hover{
    border: 1px solid #929292;
    cursor: pointer;
}
.becomeMemberContainer .becomeMemberCards p{
    font-size: 12px;
    line-height: 1.25;
    font-weight: 600;
    color: #181818;
    display: block;
    position: absolute;
    text-align: left;
    max-width: 70px;
    text-align: left;
    bottom: 13px;
}
.becomeMemberContainer .becomeMemberCards img.becomeMemberCardsArw{
    position: absolute;
    right: 15px;
    bottom: 15px;
    height: 11px;
}
.becomeMemberContainer .becomeMemberCards img.becomeMemberCardsIcn{
    height: 25px;
    position: absolute;
    top: 12px;
}
.becomeMemberContainer .becomeMemberCards img.order_icn{
    height: 30px;
}
.overflowModal {
    position: fixed;
    inset: 0px;
    background-color: rgba(24, 24, 24, 0.7);
    opacity: 1;
    transition: opacity 350ms ease-in-out 100ms;
    z-index: 9;
    display: none;
}
.becomeMemberModals {
    border-radius: 0px;
    bottom: 0px;
    box-shadow: rgba(0, 0, 0, 0.25) 0px 4px 4px;
    display: none;
    height: 100%;
    padding: 100px 60px;
    position: fixed;
    right: 0px;
    top: 0px;
    width: 480px;
    background: rgb(255, 255, 255);
    color: rgb(24, 24, 24);
    animation: 350ms ease-in 0s 1 normal none running animation-esjels;
    text-align: center;
    z-index: 99;
}
.becomeMemberModals .closeIcon{background: url("img/close_icn.svg") no-repeat center; width: 12px; height: 12px; display: inline-block; position: absolute; right: 40px; top: 10px; right: 25px; top: 32px; cursor: pointer;}
.becomeMemberModals .overflowModalHdng {
    font-size: 19px;
    font-weight: 700;
    margin-top: 20px;
}
.becomeMemberModals .overflowModalSubHdng {
    font-size: 16px;
    font-weight: 700;
    margin-top: 20px;
}
.becomeMemberModals .overflowModalDesc {
    font-size: 15px;
    margin-top: 10px;
    line-height: 22px;
    color: #181818;
    margin-bottom: 60px;
}
.becomeMemberModals span.gotItBtn{ background: none; padding: 8px 13px; margin: 0; text-align: center}

/*Become a Member Modal new design styles end here*/
@media screen and (max-width: 1200px) {
    .supportContainer{ font-size: 15px;}
    .supportContainer h2{ padding: 14px 0 0; font-size: 21px;}
}
@media screen and (max-width: 991px) {
    .col-sm-12{width: 100%;}
    .col-sm-4{width: 33.33%;}
    /*Become a Member Modal new design styles start here*/
    .becomeMemberModals{width: 100%;}
    /*Become a Member Modal new design styles end here*/
}
@media screen and (max-width: 768px) {
    h1{
        font-size: 40px;
        letter-spacing: -2px;
        line-height: 40px;
        font-weight: 700;
        padding: 40px 0 40px !important;
    }
    .logo.px-20, .footer.px-20, .backToProfile.px-20{ padding-left: 40px; padding-right: 40px;}
    .supportContainer{ font-size: 15px;}
    /*Support Container new design styles start here*/
    .supportContainer h2{ font-size: 25px;}
    /*Support Container new design styles end here*/
    .showMobile{ display: inline-block;}
    .hideMobile{ display: none !important;}
    .strip.mb40{ margin-bottom: 50px;}
    .strip.mt20{ margin-top: 30px;}
    .strip.mt40{ margin-top: 50px;}
    .footer p{ padding-top: 15px;}
    .illustration{ margin: 10px 0 60px;}
    .button{ max-width: 100%;}
    .loginFormContainer a{padding: 5px 0 2px; margin: 0px; line-height: 23px;}
    .passwordText{ font-size: 15px; padding: 6px 0;}
    span.description{padding: 20px 0 0;}
    a.loginLink{ bottom: 12px; padding-bottom: 0 !important;}
    .heading {font-size: 20px; font-weight: 700; color: #181818; letter-spacing: -0.2px; line-height: 32px; padding: 20px 0 15px;}
    .heading span{ font-size: 15px; font-weight: normal; color: rgba(24, 24, 24, 0.7);}
}
@media screen and (max-width: 667px) {
    .col-md-3, .col-md-6{width: 100%; float: left;}
    /*Become a Member Styles New Desing Start Here*/
    .becomeMemberContainer .col-md-3{width: 125px; float: left;}
    .becomeMemberRows {
        -ms-overflow-style: none; /* for Internet Explorer, Edge */
        scrollbar-width: none; /* for Firefox */
        overflow-y: scroll;
    }
    .becomeMemberRows::-webkit-scrollbar {
        display: none; /* for Chrome, Safari, and Opera */
    }
    .becomeMemberRowsInner{width: 500px;}
    .becomeMemberContainer {
        height: 220px;
    }
    /*Become a Member Styles New Desing End Here*/
}
@media screen and (max-width: 414px) {
    .illustration {margin: 30px 0 60px;}
    .floating-input{ margin: 5px 0;}
    label{ top: 31px;}
    .floating-input:focus ~ label, .floating-input:not(:placeholder-shown) ~ label{ top: 24px;}
    .alignCenter{ text-align: left;}
    .supportContainer h2{padding: 15px 0 0;}
    .strip.mb40{ margin-bottom: 40px;}
    .strip.mt20{ margin-top: 20px;}
    .strip.mt40{ margin-top: 40px;}
    .logo.px-20, .footer.px-20, .backToProfile.px-20{ padding-left: 20px; padding-right: 20px;}
    .footerLogo{ position: relative;}
    .footer p{ position: absolute;}
    .verificationText{ text-align: center;}
    .logo img{width: 105px;}
    .col-xs-12{width:100%}.col-xs-11{width:91.66666667%}.col-xs-10{width:83.33333333%}.col-xs-9{width:75%}.col-xs-8{width:66.66666667%}.col-xs-7{width:58.33333333%}.col-xs-6{width:50%}.col-xs-5{width:41.66666667%}.col-xs-4{width:33.33333333%}.col-xs-3{width:25%}.col-xs-2{width:16.66666667%}.col-xs-1{width:8.33333333%}
    a.logoutLink{ padding: 1px 0 0;}
    .floating-input[disabled]{ background-position: 328px center;}
    /*Become a Member Styles New Desing Start Here*/
    .becomeMemberModals{
        padding: 60px 10px;
    }
    /*Become a Member Styles New Desing End Here*/
}
@media screen and (max-width: 360px) {
    .floating-input[disabled]{ background-position: 276px center;}
}
@media screen and (max-width: 320px) {
    .floating-input[disabled]{ background-position: 240px center;}
}