body
        {
            background: white;
        }
        .c-50 {
            background-image: linear-gradient(-37deg, #a67f66 0%, #c49a7f 19%, #a2795e 40%, #a47c62 66%, #ebc5a4 100%);
            border-radius: 20px 20px 0 0;
            border-radius: 20px 20px 0px 0px;
        }
        .c-150 {
            background-image: linear-gradient(-50deg, #9fa6ac 0%, #868c94 40%, #c4cbd1 79%, #b3bbc0 100%);
            border-radius: 20px 20px 0 0;
            border-radius: 20px 20px 0px 0px;
        }
        .c-250 {
            background-image: linear-gradient(-25deg, #efda86 0%, #c69637 40%, #fef2ae 79%, #d3cc72 100%);
            border-radius: 20px 20px 0 0;
            border-radius: 20px 20px 0px 0px;
        }
        .c-500 {
            background-image: linear-gradient(-50deg, #70beff 0%, #6999da 40%, #bae2ff 79%, #d3e9f8 100%);
        }
        .c-50,
        .c-150,
        .c-250,
        .c-500 {
            width: 100%;
            height: 100%;
            display: flex;
            /*flex-direction: column;*/
            align-items: center;
            justify-content: center;
            background: transparent;
            color: #000;
        }
        .calculate {
            text-align: center;
            padding-bottom: 20px;
            max-width: 900px;
            margin: 0 auto;
        }
        .calculate-wrap {
            /*height: 140px;*/
            display: flex;
            flex-direction: column;
            align-items: center;
            margin-top: 25px;
        }
        .calculate-amount {
            font-size: 14px;
            font-weight: 400;
            font-family: Roboto, sans-serif;
            line-height: 26px;
        }
        .calculate-text {
            color: #000;
            font-weight: 700;
            font-family: Roboto, sans-serif;
            font-size: 45px;
            margin: 0;
            text-align: left;
        }
        .calculate-text2 {
            color: #1670c0;
            font-weight: 700;
            font-family: Roboto, sans-serif;
            font-size: 45px;
            margin: 0;
            text-align: center;
        }
        @media screen and (min-width: 280px) and (max-width: 600px)  {
   		.calculate-text2 {
            color: #000;
            font-weight: 700;
            font-family: Roboto, sans-serif;
            font-size: 15px;
            margin: 0;
            text-align: center;
        }
}
        .calculate-input {
            background: transparent;
            border: none;
            color: #448ccb;
            font-weight: 700;
            font-family: Roboto, sans-serif;
            font-size: 45px;
            outline: none;
            
            text-align: center;
        }
        @media screen and (min-width: 280px) and (max-width: 600px)  {
		 .calculate-input {
            background: transparent;
            border: none;
            color: #000;
            font-weight: 700;
            font-family: Roboto, sans-serif;
            font-size: 15px;
            outline: none;
            text-align: center;
        }
}
        input.calculate-input {
            width: 215px;
        }
        @media screen and (min-width: 280px) and (max-width: 600px)  {
  		input.calculate-input {
            width: 75px;
        }
}
        .calculate-slider {
            padding: 0 60px;
        }
        .calculate-inner {
            /*display: flex;
            justify-content: space-between; */
            padding: 0 90px;
        }
        .calculate-block {
            color: #0085ff;
            font-weight: 700;
            font-family: Roboto, sans-serif;
            font-size: 45px;
            margin: 0;
            text-align: right;
            margin-top: -70px;
        }
        @media screen and (min-width: 280px) and (max-width: 600px)  {
  .calculate-block {
            color: #023f90;
            font-weight: 700;
            font-family: Roboto, sans-serif;
            font-size: 20px;
            margin: 0;
            text-align: center;
        }
}
        .calculate-block span {
            color: #023f90;
            font-weight: 700;
            font-family: Roboto, sans-serif;
            font-size: 45px;
            margin: 0;
            text-align: left;
        }
        .calculate-btn {
            font-family: "Roboto", sans-serif;
            font-weight: 700;
            text-decoration: none;
            text-transform: uppercase;
            color: white !important;
            width: 324px;
            display: inline-block;
            padding: 15px;
            border-radius: 10px;
            background-color:  #023b87 !important; 
        }
        .calculate-btn:hover {
            font-family: "Roboto", sans-serif;
            font-weight: 700;
            text-decoration: none;
            text-transform: uppercase;
            color: white !important;
            width: 324px;
            display: inline-block;
            padding: 15px;
            border-radius: 10px;
            background-color:  #ffc000 !important; 
        }
        @media screen and (min-width: 280px) and (max-width: 600px)  {
  .calculate-btn {
            font-family: "Roboto", sans-serif;
            font-weight: 700;
            text-decoration: none;
            text-transform: uppercase;
            color: #000;
            background-color: #000;
            width: 200px;
            display: inline-block;
            padding: 15px;
            border-radius: 10px;
        }
}
        .calculate-btn-wrapper {
            margin: 0px 0;
            visibility: hidden;
        }
        .noUi-handle {
            background: #0085ff;
            box-shadow: 0 11px 19px 0 rgba(12,71,124,0.48);
            border-radius: 50%;
            border: none;
            outline: none;
            cursor: pointer;
        }
        .noUi-handle:before {
            width: 20px;
            height: 20px;
            border-radius: 50%;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
        }
        .noUi-handle:after {
            display: none;
        }
        .noUi-horizontal .noUi-handle {
            width: 52px;
            height: 52px;
            top: -21px;
        }
        .noUi-target {
            background: #a1afc3;
            border: none;
            box-shadow: none;
            outline: none;
        }
        .noUi-connects {
            border-radius: 10px;
        }
        @media screen and (min-width: 280px) and (max-width: 600px)  {
  			.noUi-connects {
            border-radius: 10px;
            margin-top: 20px;
        }
}
        .noUi-connect {
            background: #0085ff;
        }
        .noUi-horizontal .noUi-tooltip {
            font-weight: 700;
            font-size: 14px;
            color: #1a273a;
            line-height: 26px;
            text-align: center;
            background: #000;
            box-shadow: 0 11px 28px 0 rgba(255,255,255,0.3);
            padding: 5px 11px;
            border: none;
            border-radius: 20px;
            text-transform: uppercase;
            font-family: "Roboto", sans-serif;
            display: none;
        }
        .noUi-horizontal .noUi-tooltip:after {
            position: absolute;
            content: '';
            width: 10px;
            height: 10px;
            left: 50%;
            transform: translateX(-50%) rotate(45deg);
            bottom: -5px;
            background: #000;
        }
        .cllabel
        {
            display: block;
            font-size: 20px;
        }
        @media screen and (min-width: 280px) and (max-width: 600px)  {
  .cllabel
        {
            display: block;
            font-size: 11px;
        }
}
        .vs img
        {
            border-bottom: 1px solid #777;
            padding-bottom: 25px;
        }
        .calheading
        {
            margin-top: 0;
            color: #448ccb;
            text-align: left;
            margin-bottom: 30px;
        }
        @media only screen and (max-width: 600px) {
         .calheading{
                margin-top: 0;
                color: #448ccb;
                text-align: center;
                margin-bottom: 25px;
                font-size: 18px !important;
        }
        }
        
        
        
        .mainbox
        {
           /* background-image: url(img/bgimg.png);
            background-repeat: no-repeat;
            background-size: cover; */
            width: 100%;
            height: auto;
            padding-top: 50px;
        }
        
        
         @media only screen and (max-width: 600px) {
         .mainbox
        {
           /* background-image: url(img/bgimg.png);
            background-repeat: no-repeat;
            background-size: cover; */
            width: 100%;
            height: auto;
            padding-top: 25px;
        }
         }