.survey-tabs{
    min-height: calc(100vh - 200px);
    display: flex;
}

.roi-form-banner{
    display:none
}

@media all and (-ms-high-contrast:none){
    *::-ms-backdrop, .survey-tabs { 
        align-items: stretch;
    } 

    *::-ms-backdrop, .survey-tabs::after{
        content: '';
        height: calc(100vh - 200px);
        visibility: hidden;
    }
}

.screen1{
    display:none
}

.roi-form .roi-screen{
    display: none;
    width:100%
}

.controlss-wrapper{
    margin-top:24px;
}

.controlss-wrapper.hide-controls{
    display:none 
}

.roi-form .roi-screen:first-child{
    align-items:center
}

.roi-form .roi-screen .input{
    position:relative;
    width:68%;
    border-left: 1px solid #E0E3E8;
    /*     padding-left:36px; */
    margin-left: 24px;
    /*     padding: 61px 0 61px 36px; */
}

.input .row-fluid .span8.center-align{
    margin: 0 auto;
}

.roi-form .roi-screen:first-child .input .go-to-questions-btn:hover, .roi-form .roi-screen:first-child .input .go-to-questions-btn:focus {
    background: #2e2d71;
    color: #fff;
    transform: scale(1.1);
    outline:none
}

.roi-form .roi-screen:first-child .input .error-message{
    font-family: Equip;
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    line-height: 22px;
    color: #F8485E;
    margin-left: 24px;
    display:none
}

.roi-form .roi-screen:first-child .input .error-message.show-error-msg{
    display:block
}

.roi-form .roi-screen:first-child .input input.error{
    border-color:#F8485E
}

.roi-form .roi-screen.animate-form,
.roi-form.animate-form{
    animation: fadeIn 2s;
}

@keyframes fadeIn {
    from {opacity: 0;}
    to {opacity: 1;}
}

.roi-form .roi-screen{
    /*   display: flex; */
    justify-content: center;
    align-items: center;
}

.roi-form .roi-screen > .label-wrapper, .roi-form .roi-screen:first-child > .label-wrapper {
    width:32%;
    font-family: EquipExtended;
    font-style: normal;
    font-weight: normal;
    font-size: 28px;
    line-height: 120%;
    color: #010716;
    position:relative;
    display: flex;
    flex-wrap: wrap;
}

.roi-form .roi-screen .label-wrapper label{
    order:1
}

.roi-form .roi-screen > .label-wrapper legend{
    order:0;
    font-family: Equip;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 120%;
    color: #2E008B;
    border: none;
    margin: 0 0 6px 0;
}

.roi-form .roi-screen .input .field-wrapper > label{
    font-size: 18px;
    line-height: 28px;
    color: #010716;
    font-weight: normal;
    display:block;
    margin-bottom: 24px;
}

.roi-form .roi-screen .input .field-wrapper > label span.info{
    color: #13294B;
    font-size: 12px;
    line-height: 28px;
    float: right;
}

.roi-form .roi-screen .input .field-wrapper .sub-label{
    margin-bottom:24px;
}

.survey-tabs .row-fluid{
    display: flex;
    align-items: center;
}

.survey-tabs .resultScreen  .row-fluid{
    align-items: flex-start;
}

.survey-tabs .resultScreen  .row-fluid > .span4{
    position: relative;
    top: -130px;
    right: 0;
    height: 700px;
}

.survey-tabs .resultScreen  .row-fluid > .span4.fixedBox{
    height: 100vh;
    position: fixed;
    right: 26px;
    top: 0;
    z-index: 999;
}

.hs_error_rollup{
    display:none
}

.pagination-page ul{
    padding: 0;
    list-style: none;
}

.pagination-page li {
    position:relative;
    width: 24px;
}

.pagination-page li span{
    font-weight: bold;
    font-size: 12px;
    line-height: 22px;
    color:#C4C9D2;
    border:1px solid #EFF1F4;
    border-radius:50%;
    width: 24px;
    height: 24px;
    display: block;
    text-align: center;
    margin-bottom: 24px;
}

.pagination-page li.active-page:hover span {
    background: #2e0088;
    color: #fff;
}

.pagination-page li:after {
    content: "";
    width: 1px;
    height: 24px;
    background: #EFF1F4;
    position: absolute;
    top: -24px;
    left: 0;
    right: 0;
    margin: auto;
}

.pagination-page li:first-child:after{
    content:none
}

.pagination-page li.active-page span{
    color:#2E008B;
    border:1px solid #2E008B;
}

.pagination-page li.active-page:after{
    background: #2E008B;
}

.roi-form .roi-screen .input{
    list-style:none;
    counter-reset: listStyle;
    padding: 24px 0 24px 36px;
    border-left: 1px solid #E0E3E8;
    margin-left: 24px;
}

.roi-form .roi-screen:first-child label h4{
    color:#4E5E78
}

.roi-form .inputs-list label{
    font-family: Equip;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 150%;
    color: #13294B;
}

.roi-form .inputs-list label input[type="radio"]{
    opacity: 0;
    position: absolute;
}

/*Email Screen*/
.roi-form .hs_email{
    flex-wrap: wrap;
}


.email-screen {
    width:100%;
    display:none
}

.email-screen .resilience-level{
    padding:36px;
    background:#F8F8F9;
    margin-top: 60px;
}

.resilience-level ul{
    padding-left:0;
    margin:0
}

.resilience-level ul li{
    display:inline-block;
    padding-right:24px;
    position: relative;
}



.resilience-level ul li h5{
    color: #8893A5;
    margin:0
}

.resilience-level ul li.result h5{
    color:#2E008B
}

.resilience-level ul li:after{
    content:"";
    position:absolute;
    width: 4px;
    height: 4px;
    background: #4E5E78;
    right: 10px;
    top: 0;
    bottom: 0;
    margin: auto;
    border-radius:50%
}

.resilience-level ul li:last-child:after{
    display:none
}

.resilience-level label{
    font-family: Equip;
    font-style: normal;
    font-weight: bold;
    font-size: 12px;
    line-height: 16px;
    color:#8893A5
}

.email-screen .sub-text{
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 130%;
    color: #8893A5;
}

.email-screen  .label-wrapper{
    margin-top:60px
}

.email-screen  .label-wrapper label{
    font-weight: normal;
    font-size: 20px;
    line-height: 140%;
    color: #010716;
    width:43%;
    float:left;
    margin-right:36px;
}

.email-screen  .label-wrapper legend{
    font-family: Equip;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 150%;
    color: #13294B;
    float:left;
    width:40%;
    border: none;
}

.roi-form .hs_email .input{
    width:71%;
    margin-top:36px;
}

.roi-form .roi-form-banner form fieldset{
    width:100%;
    max-width:none
}

.roi-form .roi-form-banner .input{
    margin: 0;
    padding: 0;
    width: 100%;
}

.roi-form .roi-form-banner fieldset.form-columns-2 .hs-form-field{
    width: calc(50% - 12px);
}

.roi-form .roi-form-banner fieldset.form-columns-2 .hs-form-field:first-child{
    margin-right: 24px;
}

.roi-form .roi-form-banner .input input{
    width: 100%;
    height: 60px;
    border: 1px solid #8893A5;
    padding: 18px 86px 18px 24px;
    border-radius: 40px;
    margin: 0;
    margin-bottom: 6px;
    box-shadow: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background:none;
    color:#fff;
    background:#451997
}

.roi-form .roi-form-banner .input input::placeholder {
    color: #C4C9D2;
}

.roi-form .roi-form-banner .input input:-webkit-autofill,
.roi-form .roi-form-banner .input input:-webkit-autofill:hover, 
.roi-form .roi-form-banner .input input:-webkit-autofill:focus{
    -webkit-box-shadow: 0 0 0 50px #451997 inset;/*your box-shadow*/
    -webkit-text-fill-color: #fff;
}

.roi-form .roi-form-banner .input li{
    display:block
}

.roi-form .roi-form-banner .input input:focus-visible{
    outline:none
}

.roi-form .roi-form-banner .input input[type="checkbox"] {
    display: none;
}

.roi-form .roi-form-banner .legal-consent-container{
    margin-top:24px;   
    color:#fff
}

.roi-form .roi-form-banner .legal-consent-container a{
    color: #fff;
    text-decoration: underline;
}

.roi-form .roi-form-banner .legal-consent-container ul.inputs-list{
    position:relative;
}

.roi-form .roi-form-banner .input input[type="checkbox"]+span{
    color: #D2D6DD;
    margin:0
}

.roi-form .roi-form-banner .input input[type="checkbox"]+span:before, .roi-form .roi-form-banner .input input[type="checkbox"]+span:after {
    content: ' ';
    width: 24px;
    height: 24px;
    margin-right: 12px;
    background-size: 100%;
    background-repeat: no-repeat;
    top: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    position: absolute;
}
.roi-form .roi-form-banner .input input[type="checkbox"]+span:before {
    background-image: url(https://www.nagarro.com/hubfs/NagarroWebsiteRedesign-Aug2020/Assets/Images/Icons/checkbox-unchecked.svg);
    z-index: 2;

}

.roi-form .roi-form-banner .input input[type="checkbox"]+span:after {
    background-image: url(https://www.nagarro.com/hubfs/NagarroWebsiteRedesign-Aug2020/Assets/Images/Icons/checkbox-checked.svg);
    z-index: 1;
    opacity:0
}

.roi-form .roi-form-banner .input input[type="checkbox"]:checked+span:before {
    z-index: 1;
}

.roi-form .roi-form-banner .input input[type="checkbox"]:checked+span:after{
    opacity:1
}

.roi-form .roi-form-banner .legal-consent-container .hs-form-required{
    color: #f2545b;
}

.roi-form .roi-form-banner .hs-error-msgs li{
    display:inline-block;
}

.roi-form .hs_submit{
    height: 40px;
    width:100%
}

.roi-form .hs_submit input{
    background: #47D7AC;
    color:#13294B;
    padding:12px 27px;
    font-family: Equip;
    font-style: normal;
    font-weight: bold;
    font-size: 12px;
    line-height: 16px;
    border-radius: 48px;
    border: none;
    transition: all ease 300ms;
    width:100%
}

.roi-form .hs_submit input:hover, .roi-form .hs_submit input:focus {
    background: #badcd3;
    color: #13294b;
    transform: scale(1.1);
}


.roi-form form{
    position: relative;
    float:left;
    width:100%
}


.roi-form .hs_submit input:focus{
    outline:none
}


.roi-form .submitted-message{
    width:100%;
    background: #D1F5EA;
    padding: 18px 18px 18px 84px;
    border-radius: 60px;
    position:relative;
    font-family: Equip;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 150%;
    margin-top: 36px;
    float: left;
}

.roi-form .submitted-message p{
    margin:0
}

.roi-form .submitted-message:before{
    content:"";
    background:url(https://www.nagarro.com/hubfs/NagarroWebsiteRedesign-Aug2020/Assets/Images/ISV%20survey/form_submitted_check.svg) no-repeat;
    width:25px;
    height:14px;
    position:absolute;
    top:0;
    bottom:0;
    margin:auto;
    left:29px;
}

.roi-form .hs_email .input input:focus{
    outline:none
}

.roi-form .input input.error{
    border: 1px solid #F8485E;
}

.roi-form  ul.hs-error-msgs, .roi-form .hs_email ul.hs-error-msgs li, .roi-form .hs_error_rollup ul, .roi-form .hs_error_rollup ul li {
    padding: 0;
    margin: 0;
    border: none;
}

.roi-form  ul.hs-error-msgs li:before, .roi-form .hs_error_rollup ul li:before{
    content:none
}

.roi-form ul.hs-error-msgs li label, .roi-form .hs_error_rollup ul li label{
    font-family: Equip;
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    line-height: 22px;
    color:#F8485E
}

.roi-form  ul.hs-error-msgs li:hover, .roi-form .hs_error_rollup ul li:hover{
    background:none
}

/*  .roi-form .roi-screen:first-child .input input{
border: 1px solid #c4c9d2;
}
.roi-form .roi-screen:first-child .input input:focus{
border: 1px solid #13294b;
} */

.roi-form .roi-screen.animate-form,
.roi-form.animate-form{
    animation: fadeIn 600ms;
}

/*Range Slider*/
.range-slider {
    margin-bottom:60px;
    width: 100%;
    --primary-color: #0366d6;
    --value-offset-y: var(--ticks-gap);
    --value-active-color: white;
    --value-background: transparent;
    --value-background-hover: var(--primary-color);
    --value-font: 700 12px/1 Arial;
    --fill-color: var(--primary-color);
    --progress-background: #EFF1F4;
    --progress-radius: 48px;
    --track-height: calc(var(--thumb-size));
    --min-max-font: 12px Arial;
    --min-max-opacity: 0.5;
    --min-max-x-offset: 10%;
    --thumb-size: 24px;
    --thumb-color: white;
    --thumb-shadow: 0 0 3px rgba(0, 0, 0, 0.4), 0 0 1px rgba(0, 0, 0, 0.5) inset,
        0 0 0 99px var(--thumb-color) inset;
    --thumb-shadow-active: 0 0 0 calc(var(--thumb-size) / 4) inset
        var(--thumb-color),
        0 0 0 99px var(--primary-color) inset, 0 0 3px rgba(0, 0, 0, 0.4);
    --thumb-shadow-hover: var(--thumb-shadow);
    /*     --ticks-thickness: 1px; */
    --ticks-height: 5px;
    --ticks-gap: var(
        --ticks-height,
        0
    );
    /*     --ticks-color: silver; */
    --step: 1;
    --ticks-count: Calc(var(--max) - var(--min)) / var(--step);
    --maxTicksAllowed: 30;
    --too-many-ticks: Min(1, Max(var(--ticks-count) - var(--maxTicksAllowed), 0));
    --x-step: Max(
        var(--step),
        var(--too-many-ticks) * (var(--max) - var(--min))
        );
    --tickInterval: 100/ ((var(--max) - var(--min)) / var(--step)) * var(--tickEvery, 1);
    --tickIntervalPerc: calc(
        (100% - var(--thumb-size)) / ((var(--max) - var(--min)) / var(--x-step)) *
        var(--tickEvery, 1)
        );
    --value-a: Clamp(
        var(--min),
        var(--value, 0),
        var(--max)
    );
    --value-b: var(--value, 0);
    --text-value-a: var(--text-value, "");
    --completed-a: calc(
        (var(--value-a) - var(--min)) / (var(--max) - var(--min)) * 100
        );
    --completed-b: calc(
        (var(--value-b) - var(--min)) / (var(--max) - var(--min)) * 100
        );
    --ca: Min(var(--completed-a), var(--completed-b));
    --cb: Max(var(--completed-a), var(--completed-b));
    --thumbs-too-close: Clamp(
        -1,
        1000 * (Min(1, Max(var(--cb) - var(--ca) - 5, -1)) + 0.001),
        1
        );
    --thumb-close-to-min: Min(1, Max(var(--ca) - 2, 0));
    --thumb-close-to-max: Min(1, Max(98 - var(--cb), 0));
    display: inline-block;
    height: max(var(--track-height), var(--thumb-size));
    background: linear-gradient(to right, var(--ticks-color) var(--ticks-thickness), transparent 1px) repeat-x;
    background-size: var(--tickIntervalPerc) var(--ticks-height);
    background-position-x: calc( var(--thumb-size) / 2 - var(--ticks-thickness) / 2 );
    background-position-y: var(--flip-y, bottom);
    padding-bottom: 40px;
    padding-top: calc(var(--flip-y) * var(--ticks-gap));
    position: relative;
    z-index: 1;
}
.range-slider[data-ticks-position=top] {
    --flip-y: 1;
}
/* .range-slider::before, .range-slider::after {
--offset: calc(var(--thumb-size) / 2);
content: counter(x);
display: var(--show-min-max, block);
font: var(--min-max-font);
position: absolute;
bottom: var(--flip-y, -2.5ch);
top: calc(-2.5ch * var(--flip-y));
opacity: clamp(0, var(--at-edge), var(--min-max-opacity));
transform: translateX(calc(var(--min-max-x-offset) * var(--before, -1) * -1)) scale(var(--at-edge));
pointer-events: none;
} */
/* .range-slider::before {
--before: 1;
--at-edge: var(--thumb-close-to-min);
counter-reset: x var(--min);
left: var(--offset);
}
.range-slider::after {
--at-edge: var(--thumb-close-to-max);
counter-reset: x var(--max);
right: var(--offset);
} */
.range-slider__values {
    position: relative;
    top: 50%;
    line-height: 0;
    text-align: justify;
    width: 100%;
    pointer-events: none;
    margin: 0 auto;
    z-index: 5;
}
.range-slider__values::after {
    content: "";
    width: 100%;
    display: inline-block;
    height: 0;
    background: red;
}
.range-slider__progress {
    --start-end: calc(var(--thumb-size) / 2);
    --clip-end: calc(100% - (var(--cb)) * 1%);
    --clip-start: calc(var(--ca) * 1%);
    --clip: inset(-20px var(--clip-end) -20px var(--clip-start));
    position: absolute;
    left: var(--start-end);
    right: var(--start-end);
    top: calc( var(--ticks-gap) * var(--flip-y, 0) + var(--thumb-size) / 2 - var(--track-height) / 2 );
    height: calc(var(--track-height));
    background: var(--progress-background, #eee);
    pointer-events: none;
    z-index: -1;
    border-radius: var(--progress-radius);
    width:100%;
    left:0;
    top:0
}
.range-slider__progress::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    -webkit-clip-path: var(--clip);
    clip-path: var(--clip);
    top: 0;
    bottom: 0;
    background:#2E008B;
    box-shadow: var(--progress-flll-shadow);
    z-index: 1;
    border-radius: inherit;
}
.range-slider__progress::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    box-shadow: var(--progress-shadow);
    pointer-events: none;
    border-radius: inherit;
}
.range-slider > input {
    -webkit-appearance: none;
    width: 100%;
    height: var(--thumb-size);
    margin: 0;
    position: absolute;
    left: 0;
    top: 0;
    cursor: -webkit-grab;
    cursor: grab;
    outline: none;
    background: none;
}
.range-slider > input:not(:only-of-type) {
    pointer-events: none;
}
.range-slider > input::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 24px;
    height: 24px;
    background: #47D7AC;
    transform: scale(1.3);
    cursor: pointer;
    border-radius:50%;
    /*     cursor: col-resize; */
    pointer-events: auto;
    -webkit-transition: 0.1s;
    transition: 0.1s;
    border:0
}
.range-slider > input::-moz-range-thumb {
    -moz-appearance: none;
    appearance: none;
    width: 24px;
    height: 24px;
    background: #47D7AC;
    transform: scale(1.3);
    cursor: pointer;
    border-radius:50%;
    /*     cursor: col-resize; */
    pointer-events: auto;
    -webkit-transition: 0.1s;
    transition: 0.1s;
    border:0
}
.range-slider > input::-ms-thumb {
    appearance: none;
    width: 24px;
    height: 24px;
    background: #47D7AC;
    transform: scale(1.3);
    cursor: pointer;
    border-radius:50%;
    /*     cursor: col-resize; */
    pointer-events: auto;
    -webkit-transition: 0.1s;
    transition: 0.1s;
    border:0
}
.range-slider > input:hover {
    --thumb-shadow: var(--thumb-shadow-hover);
}
/* .range-slider > input:hover + output {
--value-background: var(--value-background-hover);
--y-offset: -5px;
color: var(--value-active-color);
box-shadow: 0 0 0 3px var(--value-background);
} */
.range-slider > input:active {
    --thumb-shadow: var(--thumb-shadow-active);
    cursor: -webkit-grabbing;
    cursor: grabbing;
    z-index: 2;
}
.range-slider > input:active + output {
    transition: 0s;
}
.range-slider > input:nth-of-type(1) {
    --is-left-most: Clamp(0, (var(--value-a) - var(--value-b)) * 99999, 1);
}
.range-slider > input:nth-of-type(1) + output {
    --value: var(--value-a);
    --x-offset: calc(var(--completed-a) * -1%);
}
.range-slider > input:nth-of-type(1) + output:not(:only-of-type) {
    --flip: calc(var(--thumbs-too-close) * -1);
}
.range-slider > input:nth-of-type(1) + output::after {
    content: var(--prefix, "") var(--text-value-a) var(--suffix, "");
}
.range-slider > input:nth-of-type(2) {
    --is-left-most: Clamp(0, (var(--value-b) - var(--value-a)) * 99999, 1);
}
.range-slider > input:nth-of-type(2) + output {
    --value: var(--value-b);
}
.range-slider > input:only-of-type ~ .range-slider__progress {
    --clip-start: 0;
}
.range-slider > input + output {
    --flip: 1;
    --x-offset: calc(var(--completed-b) * -1%);
    --pos: calc(
        ((var(--value) - var(--min)) / (var(--max) - var(--min))) * 100%
        );
    pointer-events: none;
    position: absolute;
    z-index: 5;
    padding: 2px 0px;
    left: var(--pos);
    transform: translate(var(--x-offset), calc( 150% * var(--flip) - (var(--y-offset, 0px) + var(--value-offset-y)) * var(--flip) ));
    transition: all 0.12s ease-out, left 0s;
}

.range-slider > input + output::after {
    content: var(--prefix, "") var(--text-value-b) var(--suffix, "");
    font: var(--value-font);
    font-weight: 800;
    font-size: 16px;
    line-height: 22px;
    color: #2E008B;
    text-shadow: 6px 0px 8px #ffffff, 0px 0px 4px rgb(255 255 255 / 25%), 0px 0px 20px #ffffff;
}

.range-slider .interval-ticks{   
    /*     display: flex; */
    width: 100%;
    padding: 0;
    position: absolute;
    bottom: -28px;
    text-align: center;
}

.range-slider .interval-ticks li{
    font-weight: normal;
    font-size: 12px;
    line-height: 22px;
    display:inline-block;
    flex-basis:100%;
    color: #8893A5;
    float:left
}

.range-slider .interval-ticks li:first-child{
    text-align:left
}

.range-slider .interval-ticks li:last-child{
    text-align:right
}

.result-value{
    font-family: EquipExtendedXbold;
    font-style: normal;
    font-weight: 800;
    font-size: 56px;
    line-height: 120%;
    color: #2E008B;
}

.gray-bg{
    background: #F8F8F9;
    padding:36px;
    border-radius: 12px;
}

.roi-form-banner{
    background: linear-gradient(
        180deg, rgba(51, 0, 139, 0.86) 0%, rgba(46, 0, 139, 0.94) 100%);
    width: 100%;
    position: absolute;
    left: 0;
    top: 90vh;
    z-index: 999;
    align-items: center;   
    height: 600px;
}

.roi-form .roi-screen .roi-form-banner .input{
    border:none
}

.roi-form .resultScreen{
    flex-wrap: wrap; 
    justify-content: left;
}

.resultScreen .last-screen-heading{
    margin-bottom: 12px;
}

.resultScreen .last-screen-text{
    font-size: 16px;
    line-height: 130%;
}

.overflow-hidden{
    overflow:hidden
}

.screenAfterForm{
    display:none
}

.resultScreen{
    padding-top: 60px;
}

.resultScreen .roi-value{
    margin-right:24px;
}

.resultScreen .roi-value, .resultScreen .payback-period{
    display: inline-block;
}

.roiResultsValue{   
    width: 100%;
}

.roiResultsValue h5{
    margin:0
}

/* .roi-form-banner{
display:none
}
*/

.roi-form-banner .row-fluid .span8.center-align{
    margin: 0 auto;
    float:none
}

.input-answers{
    width:100%
}

.input-answers .input-label{
    display:block;
}

.flex-wrapper{
    display: flex;
    flex-wrap: wrap;
}

.flex-wrapper .col {
    width: 23.076923077%;
    margin-left: 2.564102564%;
    margin-top:24px;
}

.flex-wrapper .col:nth-child(4n+1) {
    margin-left: 0;
}

.flex-wrapper .col:nth-child(-n+4) {
    margin-top: 0;
}

.fixedGraphic{
    position: relative;
    width: auto;
    height: 100%;
    z-index: 999;
}

.fixedGraphic svg{
    height: 127%;
    width: auto;
    right: 0;
    position: absolute;
    top: -5%;
}

.fixedBox .fixedGraphic{
    position: relative;
    width: auto;
    height: 96%;
    z-index: 999;
}

.fixedBox .fixedGraphic svg{
    height: 122.5%;
    width: auto;
    left: 0;
    position: absolute;
    top: -0.8%;
}



.body-container-wrapper{
    min-height: 0 !important;

    overflow:hidden
}

.body-container-wrapper.submitForm{
    max-height: calc(90vh + 600px);
}

.body-container-wrapper.full-height{
    max-height: none;
    overflow: visible;
}

.downloadPDF-section{
    border-top: 1px solid #000000;
    width:100%
}

.downloadPDF-section h3{
    margin: 12px 0 0 0;
}

.downloadButton{
    margin-top:48px;
    background:none
}

.barMargin{
    margin-top:calc(13vh - 75px);
    margin-bottom:calc(9vh - 40px);
}

input#testEngineerCost {
    border: 1px solid #c4c9d2;
    box-sizing: border-box;
    border-radius: 40px;
    padding: 18px 24px 18px 112px;
    color: #13294b;
    transition: border .3s;
    width: 100%;
    font-family: Equip;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 150%;
}

input#testEngineerCost:focus-visible{
    outline:0
}

input#testEngineerCost:focus{
    border: 1px solid #13294b;
    outline: 0;
}

/* Chrome, Safari, Edge, Opera */
input#testEngineerCost::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number]#testEngineerCost {
    -moz-appearance: textfield;
}

.costFieldWrapper{
    position:relative
}

.customDropdown{
    width: 74px;
    border-right: 1px solid #ccc;
    display: block;
    position: absolute;
    top: 18px;
    left: 24px;
    overflow:hidden;
    /*     background: url(https://www.nagarro.com/hubfs/NagarroWebsiteRedesign-Aug2020/Assets/Images/Icons/dropdown-arrow.png) no-repeat 70% center; */
}

.customDropdown select, .customDropdown option{
    font: -moz-pull-down-menu;
    font-size:16px;
}

.field-wrapper .dropdown{    
    box-sizing: border-box;   
    cursor: pointer;
    z-index: 999;
    /*     width: 108px; */
    background: none;
    border: none;
    color:#2E008B;
    height:26px;
}

.label-wrapper .small-text{
    margin-top:7px;
}

.field-wrapper .dropdown:focus-visible {
    outline: none;
}

.body-container-wrapper.full-height .row-fluid .survey-form-layout{
    padding-bottom:0
}

.pdfChart{
    visibility: hidden;
    height: 0;
    overflow:hidden
}

/* .pdfChart canvas{
max-width:100%
} */

.lowercase{
    text-transform: lowercase;
}

.show-pdf{
    display:none
}

.complexity-error-msg, .cost-error-msg{
    visibility:hidden;
    color: #F8485E
}

.cost-error-msg{
    font-family: Equip;
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    line-height: 22px;
    margin-top: 6px;
    margin-left: 24px;
}

a.prevQuestion{
    position: relative;
    width:40px;
    height:40px;
    float: left;
    margin-right: 6px;
    padding: 0;
}

a.nextQuestion{
    position: relative;
    padding-right: 46px;
}

a.nextQuestion:after, a.prevQuestion:after{
    content:"";
    position:absolute;
    background-image: url(https://www.nagarro.com/hubfs/NagarroWebsiteRedesign-Aug2020/Assets/Images/Icons/blue-arrow.svg);
    background-repeat: no-repeat;
    width: 13px;
    height: 13px;
    background-size: 100% auto;
    top: calc(50% - 6.5px);
    right: calc(50% - 5px);

}

a.nextQuestion:after{
    transform: rotate(180deg);
    top: 12px;
    right: 22px;
}

a.nextQuestion.disabled{
    background: #EFF1F4;
    color: #fff;
    cursor: default;
    pointer-events: none;
}

a.nextQuestion.disabled:after{
    opacity:0.1
}

input#testEngineerCost.error{
    border:1px solid #f8485e
}

@media(max-width:1300px) and (min-width:1200px){
    .result-value{
        font-size: 46px;
    }
}

@media(max-width:1024px){    

    .survey-tabs .row-fluid{
        display:block
    }

    .survey-tabs .row-fluid .span1, .survey-tabs .row-fluid .span11{
        width:100%;
        margin:0
    }
    .pagination-page ul{
        display: flex;
    }

    .pagination-page li {
        margin-right: 0;
        display: inline-block;
        margin-bottom: 0;
        flex-grow: 1;
        width:auto;
        height:24px;
    }

    .pagination-page li:first-child{
        margin:0;
        flex-grow: 0;
    } 

    .pagination-page li span{
        margin:0;
        z-index: 1;
        background: #fff;
        position: relative;
        margin: 0 auto;
        float:right
    }

    .pagination-page li:after {
        width: 100%;
        height: 1px;
        top: 0;
        bottom: 0;
        margin: auto 0;
        left: 0;
    }


    .roi-form {
        padding-left: 0;
    }

    /*     .roi-form .roi-screen:first-child{
    display: block;
} */

    .roi-form .roi-screen>.label-wrapper, .roi-form .roi-screen:first-child>.label-wrapper{
        width: 65%;
        margin: 0 auto
    }

    .roi-form .roi-screen:first-child .input, .roi-form .roi-screen .input {
        width: calc(100% + 168px);
        margin: 0;
        border: none;
        padding: 0;       
        padding: 24px 17.5%;
        padding-left: calc(17.5% + 60px);
        padding-right: calc(17.5% + 60px);
        margin-left: -84px;
        margin-top: 48px;
        min-height: calc(100vh - 369px);
        margin-right: -84px;
    }

    .roi-form .roi-screen>.label-wrapper label, .roi-form .roi-screen:first-child>.label-wrapper label {
        font-style: normal;
        font-weight: 500;
        font-size: 22px;
        line-height: 120%;
    }

    .pagination-page{
        width: 65%;
        margin: 0 auto 48px;
    }

    .roi-form .roi-screen{
        flex-direction: row;
        flex-wrap: wrap;
    }   

    .roi-form  .submitted-message{
        width: 100%;
        margin-left: auto;
        float: none;
        margin-right: auto;
        display: block;
    }

    .roi-form .hs_email .input{
        width:100%
    }


    .roi-form .hs_submit input{
        width:100%
    }


    .roi-form .submitted-message{
        font-size:12px;
        padding-left:74px;
    }

    .roi-form .email-screen{
        width:65%;
        margin: 0 auto
    }

    .roi-form .hs_email{
        width: 65%;
        margin: 0 auto;
    }

    .roi-form .hs_email .input input{
        margin-bottom:12px;
        padding-right:24px;
    }

    .email-screen .label-wrapper {
        margin-top: 36px;
    }

    .resilience-level ul li{
        display:none
    }

    .resilience-level ul li.result{
        display:block
    }

    .resilience-level ul li.result h5{
        font-family: EquipExtended;
        font-style: normal;
        font-weight: normal;
        font-size: 40px;
        line-height: 100%;
    }

    .resilience-level ul li:after{
        display:none
    }

    .roi-form .roi-screen.animate-form,
    .roi-form.animate-form{
        animation: fadeIn 600ms;
    }

    .landing-page{
        display: block;
        top: 10vh;
    }

    .roi-form .hs_email ul.hs-error-msgs li label.hs-error-msg,  .roi-form .hs_email ul.hs-error-msgs li label.hs-error-msg:hover,  .roi-form .hs_email ul.hs-error-msgs li label.hs-error-msg:focus{
        padding: 0 21px 10px 24px;
        border: none;
    }

    .row-fluid .span11.landing-page--content{
        width: 65%;
        margin: 0 auto;
        float: none;
    }

    .roi-form .roi-screen:first-child .input, .roi-form .roi-screen .input{
        width: 65%;
        padding-left: 0;
        padding-right: 0;
    }

    .roi-form .roi-screen .input .span8{
        width:100%
    }

    .fixedGraphic{
        display:none
    }

    .resultScreen .row-fluid .span8 {
        margin: 0 auto !important;
        float: none;
        width: 90%;
    }

    .contactSection .span7{
        width: 90%;
        margin: 0 auto !important;
        float: none;
    }

    .roi-form-banner .row-fluid .span8.center-align{
        width: 90%;
    }



}
@media screen and (orientation:landscape)
    and (max-device-width: 1023px) {
        .body-container-wrapper .row-fluid .no-float.page-center {
            min-height: 100vh;
        }
}

@media(min-width:1024px){
    .hide-desktop{
        display:none !important
    }
}

@media(max-width: 1023px) {
    .hide-mobile{
        display:none !important
    }

    a.nextQuestion {
        width: 100%;
    }

    .fixedGraphic{
        display:none
    }

    .roi-form .roi-screen:first-child .input, .roi-form .roi-screen .input {

        margin-left: -60px;
        margin-right: -60px;
    }
    .gray-bg{
        padding: 24px;
    }

    .result-value{
        font-size: 48px;
    }

    .both-active a.nextQuestion{
        width: calc(100% - 48px);
    }

}

@media(max-width:767px){

    /*     .pdfChart > div{
    height:200px !important
} */

    .pagination-page, .roi-form .roi-screen>.label-wrapper, .roi-form .roi-screen:first-child>.label-wrapper{
        width: 100%;

    }

    .roi-form .roi-screen:first-child .input, .roi-form .roi-screen .input{
        margin-left:-24px;
        margin-right:-24px;
        width:calc(100% + 48px);
        padding: 24px;
    }

    .roi-form .roi-screen:first-child .input .go-to-questions-btn{
        right: 35px;
    }

    .roi-form .submitted-message{
        font-size:14px;
    }

    .email-screen .resilience-level{
        margin-top:36px;
    }

    .roi-form .email-screen,  .roi-form .hs_email, .roi-form .hs_submit{
        width:100%
    }
    .roi-form  .submitted-message{
        width: 100%;
    }

    .row-fluid .span11.landing-page--content{
        width:100%
    }

    .resultScreen .roi-value, .resultScreen .payback-period {
        margin: 0;
        margin-top: 12px;
        width: 100%;
        text-align: center;
    }

    .result-value{
        font-size: 44px;
    }

    .flex-wrapper .col{
        width: 48.717948718%;
    }

    .flex-wrapper .col:nth-child(-n+4) {
        margin-top: 24px;
    }

    .flex-wrapper .col:nth-child(-n+2) {
        margin-top: 0;
    }
    .flex-wrapper .col:nth-child(2n+1) {
        margin-left: 0;
    }

    .resultScreen .row-fluid .span8{
        width: 100%;
    }
}

@media (max-width:480px){   

    .roi-form-banner{
        height: 700px;
    }

    .body-container-wrapper.submitForm{
        max-height: calc(90vh + 700px);
    }

    .body-container-wrapper.submitForm.full-height {
        max-height: none;
        overflow: visible;
    }
}

@media print {
    @page {
        margin: 0.5cm;
        size: A4;
        margin: 0;
    }
    html, body {
        width: 210mm;
        height: 297mm;
    }
    .hide-pdf{
        display:none
    }

    .show-pdf{
        display:block !important
    }

    .fixedGraphic, .footer-bottom-right{
        display:none !important
    }

    .downloadPDF-section{
        display:none
    }

    .result-value{
        -webkit-print-color-adjust: exact; 
        color:#2E008B !important;
    }
    a[href]:after {
        content: ' (' attr(href) ')';
        word-wrap: break-word;
        word-break: break-all;
        white-space: normal;
    }



    .roi-form .submitted-message, .contactSection, .ft-insights-container{
        display:none !important
    }

    .resultScreen .roi-value, .resultScreen .payback-period{
        width:auto;
        border:1px solid #F8F8F9
    }

    .pdfChart{
        visibility: visible;
        height: auto;
    }

    .desktopChart{
        display:none !important
    }

    .print-clear{clear: both;}

    .other-pages{
        page-break-before: always;
        height:0.5cm
    }

    .barMargin{
        margin-top: 0.5cm;
        margin-bottom: 0.5cm;
    }

    /*     .graph-heading{
    margin-top:0 !important
} */

    .resultScreen {
        padding-top: 0px;
    }

}

@media print and (orientation: landscape) { 
    .other-pages-landscape{
        page-break-before: always;
        height:0.5cm
    }

    /*     .pdfChart, .lineChart{
    height:500px !important;
    padding-top:80px
} */

}

@media print and (orientation: portrait) {
    .portrait-print{
        height:75vh;
        display:block;
        border:1px solid #ccc;
        page-break-after:always
    }
    .portrait-print-half{
        height:45vh;
        display:block;
        border:2px solid #ccc
    }
    @-moz-document url-prefix() { 
        .portrait-print{
            height:98vh;       
            border:2px solid #ccc
        }

        .portrait-print-half{
            padding-top:0.5cm
        }
    }   




    #myChart{
        height:8cm !important
    }

    .mt-20 {
        margin-top: 1cm !important;
    }
    .mb-10 {
        margin-top: 0.5cm !important;
    }

    /*     .pdfChart{
    width: 26vw !important;
    transform: rotate(-90deg);
}*/

    /*     .pdfChart canvas{
    height: 400px !important;

}  */

    .roiResultsValue{
        display: flex;
    }

    .resultScreen .roi-value{
        margin-right:24px;
    }

}