/* For XXL */
@media screen and (min-width:1400px) {
 
    .heightWrapper.height-xxl-75:before {
        padding-top: 75%;
    }

    .heightWrapper.height-xxl-50:before {
        padding-top: 50%;
    }

    .heightWrapper.height-xxl-25:before {
        padding-top: 25%;
    }
}

/* For XL */
@media screen and (max-width:1200px)  {

    label.counts-checkbox-master input[type=checkbox]~span:before{top:5px;}

        .goLiveFooter{align-items:start; flex-flow:column;}
        .goLiveFooter .LeftSide{display:flex; flex-flow:column; gap:2px; align-items: start; width: 100%;}
        .goLiveFooter .RightSide{width: 100%; justify-content: end;}

    body button,
    body button[type="submit"],
    body button[type="submit"].btn,
    body button[type="button"],
    body button[type="button"].btn,
    body input[type="submit"],
    body input[type="button"],
    body .form-group input[type="button"],
    body a.btn{min-width: 100px; padding: 8px 8px; height: 34px; border-radius: 5px;}

    i.c_icon.bg {
    width: 34px;
    height: 34px;}

    .researchNav.wrap ul li{flex-basis: calc(25% - 8px);}


    .searchWrapper input:not([type="submit"], [type="checkbox"], [type="radio"]){padding: 5px 27px 5px 33px;  border-radius: 5px; }
    body select, body form select, body select.form-select{padding: 5px 27px 5px 10px;  border-radius: 5px;}
    
    table th{padding: 10px 32px 10px 10px !important;}
    table td{padding: 6px 32px 6px 10px !important;}
    table th.sorting:after{top: 11px;}

    .tableFixHead thead th:first-child{left:0; z-index:6; background-color:var(--white);}
    .tableFixHead tbody td:first-child{position:sticky; left:0; z-index:6;}
    .tableFixHead tbody tr:nth-child(odd) td:first-child{background-color:#e5ecf3;}
    .tableFixHead tbody tr:nth-child(even) td:first-child{background-color:#eaf1f7;}
    .tableFixHead tfoot td:first-child{position:sticky; left:0; z-index:6;}


    .tableFixHead thead th:last-child{right:0; z-index:6; background-color:var(--white);}
    .tableFixHead tbody td:last-child{position:sticky; right:0; z-index:6;}
    .tableFixHead tbody tr:nth-child(odd) td:last-child{background-color:#e5ecf3;}
    .tableFixHead tbody tr:nth-child(even) td:last-child{background-color:#eaf1f7;}
    .tableFixHead tfoot td:last-child{position:sticky; right:0; z-index:6;}


    .searchWrapper:before{left: 9px;}

    .heightWrapper.height-xl-75:before {
        padding-top: 75%;
    }

    .heightWrapper.height-xl-50:before {
        padding-top: 50%;
    }

    .heightWrapper.height-xl-25:before {
        padding-top: 25%;
    }

    .heroBanner h1{font-size: 32px; line-height: 42px;}
    .heroBanner h1 span{font-size: 54px; line-height: 64px;}
    .bannerImages .bannerCTA{position:static; transform: translateX(0%); width:100%;}
    .Nventory_Register:after{display:none;}
    .Nventory_Register{display:flex; flex-flow:column; align-items: center; gap:8px; padding-bottom:18px; width: 100%;}
    .Nventory_Register h5{display:flex; flex-flow:row; color:var(--warning);}
    .Nventory_Register h5 span{color:var(--warning); width:auto; font-size: 26px; line-height: 32px; padding-left:8px;}
    .Nventory_Register ul li a span{ font-size: 16px; line-height: 20px;}
    .Nventory_Register ul li a i{width: 38px;height: 38px;}
    .Nventory_Register ul li a i img {width: 24px;height: 24px;}

    .keyBox{padding: 40px 20px;}
    .keyBox span { width: 60px; height: 60px; margin-bottom:15px;}
    .keyBox h4 {font-size: 20px; line-height: 26px;} 

    .headerFixed a.closePage{top: 13px;}
    .headerFixed{height: 60px;}
    .multiSteps{margin-top:0;}
    .multiSteps ul li{flex-grow:0;}
    .multiSteps ul li a,
    .multiSteps ul li.current a,
    .multiSteps ul li.done a{background:var(--white) !important; transition:var(--animation);} 
    .multiSteps ul li:not(.current) a{font-size:0; padding: 5px 0px 5px 31px; gap:0;}
    .multiSteps ul li.current a{color:var(--gray) !important;}

    .multiSteps ul li a:before{background-color:var(--gray); border:solid 4px var(--white); width: 16px; height: 16px;}
    .multiSteps ul li.current a:before{background-color:var(--primary); border:solid 4px var(--primaryLight);}
    .multiSteps ul li.done.current a:before{background-color:var(--success); border:solid 2px var(--successMedium);}
    .multiSteps ul li.done a:before{border:solid 2px var(--primaryLight);}
    .multiSteps ul li.done a:after{width: 13px; height: 13px; left: 6px; top:5px;}

    section.Unlock_Enventory .imageWrapper{width: 140px;}

    body input:not([type="submit"], [type="checkbox"], [type="radio"]), body form input:not([type="submit"], [type="checkbox"], [type="radio"]){padding: 5px 9px;}

    .whiteBox .boxContent{padding:12px;}
    .whiteBox h4{padding:12px 12px 12px 12px;}
    .counts-main-header .counts-main-header {padding: 12px 12px;}
    .whiteBox .boxContent{padding: 12px;}

}


/* For LG */
@media screen and (max-width:991px) {

    :root{
        --size_H1: 20px;
        --line_H1: 24px;
        --size_H2: 18px;
        --line_H2: 24px;
        --size_Display: 20px;
        --line_Display: 24px;
    }

    .bodyContent{height: calc(100vh - 44px);}

    .demographicRow .demographicCol{flex-basis:calc(50% - 24px);}
.demographicRow .demographicCol:nth-child(3){flex-basis:calc(50% - 24px);}

.browseWrapper{padding: 5px 12px;}
.browseWrapper:after{padding: 3px 15px 3px 35px;}
.browseWrapper:before{top: 11px;}
.forecastInfoReview{height:auto;}

.height-auto{height:auto !important;}

    body .headerFixed,
    body .headerFixed.closeMenu{padding: 10px 12px 10px 38px;}
.sidebar i#toggleMenu {display:inline-block;}

.rightAlign i#toggleMenu{display:inline-block;}
.topFixed .LeftSide{padding-left:38px;}
    body .headerFixed{padding: 10px 12px 10px 12px;}

.customerInfo .customerLogo{width: 32px; height: 32px;}
.customerInfo{gap:6px;}
.customerInfo .forecastInfo h2{font-size:14px; line-height:14px;}

body .headerFixed.forecastOutputHeader a.btn#btnCopyLink,
body .headerFixed.forecastOutputHeader a.btn.editForecast,
body .headerFixed.forecastOutputHeader a.btn#btnShareData,
body .geographySelection .map-info-head a.btn,
body .headerFixed.forecastOutputHeader .bttn.exportOpt a.btn{font-size:0; min-width:34px; gap:0;}

body .headerFixed.forecastOutputHeader + div.bodyContent .bodyRender .container-fluid{padding-left:0; padding-right:0;}

body .headerFixed.forecastOutputHeader + div.bodyContent .bodyRender .fill_inner{position:static;}




    .heightWrapper.height-lg-75:before {
        padding-top: 75%;
    }

    .heightWrapper.height-lg-50:before {
        padding-top: 50%;
    }

    .heightWrapper.height-lg-25:before {
        padding-top: 25%;
    }

    html, body{width:100vw; overflow-x:hidden; margin:0; padding:0;}

    .bodyContent{width: calc(100% - 12px);}
    
    body:after{content:""; position:absolute; left:0px; top:0; right:0; bottom:0; z-index:11; background-color:rgba(251,253,255,0.65); opacity:0; visibility:hidden; display:inline-block !important; transition:var(--animation); pointer-events:none;}
    body.closeMenu:after{ opacity:1; visibility:visible; left:100px; pointer-events:all; }


    footer.footer{width: 100%; transform:translateX(0px); left:0; transition: var(--animationSlow);}
    body.closeMenu footer.footer{width: 100%; transform:translateX(100px);}

    .headerFixed{width: 100%; transform:translateX(0px); left:0; transition: var(--animationSlow);}
    body.closeMenu .headerFixed{width: 100%; transform:translateX(100px);}

    .bodyContent.reseachPage{padding-left:0; padding-right:0;}
    .reseachPage .bodyRender{margin-top: 45px;}

    .Unlock_Enventory .Nventory_Register{align-items: start;}
    .Unlock_Enventory .Nventory_Register h5 span{padding-left:0;}
    .Unlock_Enventory .Nventory_Register h5{flex-flow:column;}
    section.Unlock_Enventory .Nventory_Register ul{margin-left:0;}

    body.landing.closeMenu{overflow-y:hidden;}
    body.landing > *{transform:translateX(0px); transition:var(--animation);}
    body.landing.closeMenu > *{transform:translateX(-300px); }
    body.landing.closeMenu:after{left:0; right:300px;}


    header.landingHeader .rightAlign nav{position:fixed; right:0; top:-6px; bottom:0; height: 100vh; width:300px; z-index:999; background-color:var(--primary); transform:translateX(300px); padding-top:50px; padding-bottom:50px;}
    body.landing.closeMenu header.landingHeader .rightAlign nav{transform:translateX(300px);}
    body.landing .topHeader nav ul{flex-flow:column; text-align:left; width:100%; gap:4px;}
    body.landing .topHeader nav ul li{width:100%;}
    body.landing .topHeader nav ul li a{width:100%; color:var(--white); padding:8px 16px; font-size: var(--size_H2); line-height: var(--line_H2); font-weight:400; border-top:solid 1px var(--primaryMedium);}
    body.landing .topHeader nav ul li:last-child a{border-bottom:solid 1px var(--primaryMedium);}

    .brandLogo{width:80px;}
    .heroBanner{ margin-top: 62px;}

    .exportElements label { flex-basis:100%;}

    .profileDetails .boxContent{padding-top: 24px;}
    .profileDetails h4{display:flex;}
    .userAvatarWrapper{position:relative; left:inherit; top:inherit; margin-bottom:20px;}
    .userAvatar,
    .userAvatarWrapper{width:90px; height:90px;}

    table td {padding: 2px 32px 2px 10px !important;}
    .LeftPnnl_inner ul{column-count:1;}
    .LeftPnnl_inner ul li {margin-bottom: 0;}
    .tabberSection > ul li{padding: 7px 12px 7px 12px;}
    .tabberSection > ul li.active{padding: 9px 12px 9px 12px;}
    .infoCard{padding: 8px 12px;}
    
}

/* For MD */
@media screen and (max-width:767px) {

    .researchNav.wrap ul li{flex-basis: calc(33.333333333333% - 8px);}

    .whiteBox h4{padding: 12px 18px 12px 18px;}
    
    .form-group{margin-bottom: 10px;}


    .heightWrapper.height-md-75:before {
        padding-top: 75%;
    }

    .heightWrapper.height-md-50:before {
        padding-top: 50%;
    }

    .heightWrapper.height-md-25:before {
        padding-top: 25%;
    }

    .cusRow.fill, .scrollerWrapper{gap: 6px;}

    #DataTableRowPerPage select{padding: 6px 12px 6px 6px;}
    .dataTables_info{display:none;}

    .bodyContent{height: calc(100vh - 72px);}
    .bodyContent:before {bottom: -70px;}
    footer.footer > div > div {flex-flow:column; justify-content:center; align-items:center; row-gap:8px;}

    
    .geographySelection{flex-flow:wrap;}

    .geographySelection .searchWrapper{flex-basis:calc(50% - 4px);}
    .geographySelection > .form-group{flex-basis:calc(50% - 4px);}

    body .geographySelection .map-info-head{flex-grow: 0 !important;}
    

    

    .searchWrapper{z-index:9999;}
    .searchWrapper:before{z-index: 10002; pointer-events:none;}
    .dataTables_filter{position:relative; z-index:9999; width:34px; height:34px; border-radius: 6px; background-color: var(--primaryLight);  }
    .dataTables_filter > label{position:fixed; right:25px; top:50px; left:25px; padding:18px; box-shadow:var(--shadowDropdown); background-color:var(--white); border-radius:10px; opacity:0; visibility:hidden; transition: var(--animation); transform:translateY(-10px);}
    .dataTables_filter.show > label{opacity:1; visibility:visible; transform:translateY(0px);}
    .dataTables_filter input:not([type="submit"], [type="checkbox"], [type="radio"]){padding: 5px 27px 5px 8px;}
    .dataTables_filter a{right: 33px;}

    .heroBanner h1 span {font-size: 34px;line-height: 44px;}
    .heroBanner h1 { font-size: 24px; line-height: 34px;}
    .bannerImages .bannerImageWrapper:before{width:26px;height:26px; border: solid 3px var(--successMedium);}
    .bannerImages .bannerImageWrapper:after{width: 40px;height: 40px;}
    .Nventory_Register h5{margin:0;}
    .Nventory_Register ul{gap: 8px}
    .Nventory_Register ul li a{ padding: 8px 20px 8px 8px; background-color: var(--grayLight); box-shadow:none;border-radius: 6px;}
    .Nventory_Register ul li a i {width: 28px;height: 28px; background-color: var(--bs-white);}
    .Nventory_Register ul li a i img {width: 18px;height: 18px;}
    .Nventory_Register ul li a span {font-size: 14px;line-height: 14px;}
    .Nventory_Register ul li a span span{font-size: 12px;line-height: 18px;}
    .contentWrapper p{font-size: 18px;line-height: 28px;}

    .heroBanner p{font-size: 18px;line-height: 28px;}
    .contentWrapper h4{font-size: 22px;line-height: 32px;}
    .contentWrapper h3{font-size: 30px;line-height: 40px;}
    section.Unlock_Enventory h3{font-size: 24px; line-height: 32px;}
    section.Unlock_Enventory p{font-size: 18px;line-height: 28px;}
    section.Unlock_Enventory .Nventory_Register{padding-top: 0; align-items: center;}
    section.Unlock_Enventory .Nventory_Register ul{flex-flow:row;}
    .Unlock_Enventory .Nventory_Register h5 { flex-flow: row;}
    section.Unlock_Enventory .imageWrapper { width: 100px;}

}

@media screen and (max-width:575px) {
    .modal-footer .exportBtnWrap a.dropdown-item{flex-flow:column; flex-grow: 1;}
    .researchNav.wrap ul li{flex-basis: calc(50% - 8px);}
}
/* For SM */
@media screen and (min-width:320px) {

    .heightWrapper.height-75:before {
        padding-top: 75%;
    }

    .heightWrapper.height-50:before {
        padding-top: 50%;
    }

    .heightWrapper.height-25:before {
        padding-top: 25%;
    }
}