html {
	margin: 0;
	height:100%;
	min-height: 100%;
	box-sizing: border-box;
	scroll-behavior: smooth;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

*,*:before,*:after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

:root {
	--ukr-background-color-base: #003049;
	--ukr-color-base: #1C1C1C;
	/*
	--ukr-font-family-base: 'Poppins', Arial, Helvetica, sans-serif;
	--ukr-font-family-heading: 'Roboto', sans-serif;
	--ukr-font-family-heading2: 'Noto Serif', sans-serif;
	--ukr-font-family-heading3: 'Teko', sans-serif;
	--ukr-font-family-buttons: 'Montserrat', sans-serif;

	*/
    --ukr-font-family-base: 'Roboto', sans-serif;
	--ukr-font-family-heading: 'Roboto', sans-serif;
	--ukr-font-family-heading2: 'Roboto', sans-serif;
	--ukr-font-family-heading3: 'Roboto', sans-serif;
	--ukr-font-family-buttons: 'Roboto', sans-serif;

    --ukr-font-size-small: 14px;
	--ukr-font-size-base: 17px;
	--ukr-font-size-medium: 18px;
	--ukr-font-size-large: 24px;
	--ukr-font-size-xl: 32px;
	--ukr-font-size-buttons: 18px;

	--ukr-font-weight-regular: 400;
	--ukr-font-weight-medium: 500;
	--ukr-font-weight-bold: 700;
	
	--ukr-background-color-button1: #003049;
	--ukr-background-color-button1-hover: #f76e0b;
	--ukr-color-button1: #003049;
	--ukr-color-button1-hover: #fff;
	
	--ukr-background-color-button2: #003049;
	
}

body {
	background:#fff;
	height:100%;
	min-height: 100%;
	font-family: var(--ukr-font-family-base);
	font-weight: var(--ukr-font-weight-regular);
	color: var(--ukr-color-base);
	font-size: var(--ukr-font-size-small);
	margin: 0;
	padding: 0;
	line-height: 1.42;
}

.txtCol1{
	color: #003049;
	color: #1C1C1C;
	border-left: 20px solid #ffce00;
    border-bottom: 1px dashed #ffce00;
	
}
.txtCol2{
	color: #212325;/*blue*/
	color: #1C1C1C;
	border-left: 20px solid #212325;
    border-bottom: 1px dashed #212325;
}

.w10, .w20, .w25, .w30, .w33, .w40, .w50, .w60, .w70, .w80, .w90, .w100{width: 100%;}
.simple-list{
	margin-bottom: 20px;
}
.simple-list li{
    margin-left: 2rem;
	font-size: inherit;
	font-size: 1.25em;
    font-weight: 300;
}
input[type=email], input[type=number], input[type=tel], input[type=text], textarea{
    font-size: 1.2em;
    padding: 8px;
    border: 1px solid #e3e3e3;
    color: #000;
    width: 100%;
    height: 45px;
	padding-left: 12px;
	border-radius: 6px;
    margin-bottom: 20px;
	margin-top: 1px;
	font-family: 'Roboto';
    color: #727272;
	font-weight: 300;
}
input[type=email]:focus-visible, input[type=number]:focus-visible, input[type=tel]:focus-visible, input[type=text]:focus-visible, textarea:focus-visible{
	outline: none;
    border: 2px solid #e3e3e3;
}
input,
select {
  -webkit-background-clip: text !important;
  background-clip: text !important;
}
input:-internal-autofill-selected {
  background-color: #ffffff !important;
  color: #000000 !important;
  background-image: none !important;
}
.center{
	text-align:center;
}
.right{
	text-align:right;
}
.pa-top{
	top:0;
}
.pdr15{padding-right: 0;}
.pdl15{padding-left: 0;}
.mgr15{margin-right: 0;}
.mgl15{margin-left: 0;}
.cont{
	width:100%;
	margin:0 auto;
	padding:0 20px;
}
.clear,.clr:after,#benefits-box:after,#info-box:after{
	content: " ";
	float: none;
	clear: both;
	display: table;
}
.flex{
	display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
}
.unselectable {
	/*
	-webkit-user-select: none;
	-webkit-touch-callout: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	*/
}
.fl-l{
	float: left;
}
.fl-r{
	float: right;
	direction: rtl;
}
.error-message{
	color: #ff0404;
    font-family: var(--ukr-font-family-heading);
    font-size: 15px;
}
#header-headline{
	width: 100%;
    margin: 0 auto;
    text-align: center;
    padding: 20px 0;
}
#header-headline h1{
	
}
#header-sub{
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 10px;
}
#header-sub h2{
	color: #1C1C1C;
    margin: 0;
    padding: 0;
    text-align: center;
    font-size: 20px;
    font-weight: 600;
    width: 90%;
    margin-left: 5%;
	margin-top: 20px;
}
.c-form-box{

}
.c-form-box a{
    transition: all 0.2s ease;
    color: #4ca0a3;
}
.c-form-box a:hover{
    color: #29686a;
}
.c-form-box b{
    display: block;
    font-size: 13px;
    font-weight: var(--ukr-font-weight-regular);
    font-family: var(--ukr-font-family-heading);
}
.c-form-box b span{
    color: #ff6565;
}
/*----------- Section 1 ----------------*/
#ukr-section1{
	display: block;
    width: 100%;
    position: relative;
    margin: 0 auto;
	background-color: #fbfafb;
	padding-bottom: 80px;
}
.ukr-section1-cont{
	display: flex;
	position: relative;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin: 0 auto;
	padding: 0 20px;
	padding-top: 60px !important;
	z-index: 1;
    overflow: hidden;
}
.ukr-section1-cont:after{
    /*
	content: "";
	position: absolute;
    width: 100%;
	height: 32px;
	bottom: -1px;
    clip-path: ellipse(80% 100% at 50% 100%);
    left: 0;
	background: radial-gradient(#ffffff00 49%, #fff 50%);
    background-position: 50% 100%;
    background-size: 150% 200%;
	*/
}

.ukr-section1-sm2{
	display: block;
    position: relative;
    width: 100%;
}
.ukr-section1-col1{
	display: flex;
    position: relative;
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
	gap: 30px;
	margin-bottom: 40px;
}
.ukr-section1-col1-txt{
	display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap: 30px;
}
.ukr-section1-col1-txt h1{
	display: block;
    font-size: 42px;
    line-height: 46px;
    text-align: left;
    color: #003049;
    font-family: var(--ukr-font-family-heading2);
    font-weight: var(--ukr-font-weight-bold);
    font-weight: 900;
}
.ukr-section1-col1-txt h3{
	display: block;
    font-size: 24px;
    line-height: 30px;
    text-align: left;
}
.ukr-section1-col1-txt p{
	display: block;
    font-size: 17px;
    line-height: 24px;
    font-weight: var(--ukr-font-weight-regular);
    text-align: left;
}
.ukr-section1-col1-txt p b{
    font-size: 24px;
    line-height: 32px;
    font-family: var(--ukr-font-family-heading);
}
.ukr-section1-btn{
	display: block;
    position: relative;
    width: 100%;
	margin-top: 20px;
}
.ukr-section1-btn a i{
	margin-left: 8px;
    font-size: 21px;
}
.ukr-section1-btn i{
	margin-right: 8px;
    font-size: 22px;
}
.ukr-section1-col1-txt ul {
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    padding-left: 10px;
    row-gap: 15px;
   
}
.ukr-section1-col1-txt .m3 {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
}
.ukr-section1-col1-txt .mi3 {
    line-height: 16px;
	color: #003049;
	font-size: 28px;
	margin-right: 8px;
    
}
.ukr-section1-col1-txt .m3 h4 {
    font-size: 16px;
    line-height: 16px;
    font-weight: 400;
    margin: 0;
}

.bnn-btn{
	display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    font-size: 20px;
    color: #fff;
	font-weight: var(--ukr-font-weight-bold);
	font-family: var(--ukr-font-family-buttons);
    background-color: #17A628;
    height: 56px;
    border-radius: 6px;
	border: transparent;
	width: 100%;
    padding: 0 50px;
	transition: all 0.5s ease-in-out;
}
.bnn-btn:hover{
	background-color: #146219;
}
.ukr-section1-col2{
	display: block;
    position: relative;
    width: 100%;
    margin: 0 auto;
}

.ukr-section1-col2-img {
	display: flex;
    width: 100%;
    position: relative;
    justify-content: center;
}
/*
.ukr-section1-col2-img::before {
	content: "";
	display: block;
	padding-bottom: 100%;
}
.ukr-section1-col2-img::after {

}
*/
.ukr-section1-col2-img img {
	position: relative;
	top: 0; left: 0;
	width: 120%;
	height: 100%;
	object-fit: cover;
    max-width: 800px;
}

.vrm-content{
	display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
    align-content: flex-start;
    align-items: flex-start;
    width: 100%;
    gap: 5px;
}
.vrm-content label{
	font-size: 17px;
    font-weight: var(--ukr-font-weight-bold);
    line-height: 1;
    color: #1C1C1C;
   
}
.vrm-field{
    display: flex;
    align-items: center;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    border: 2px solid #000;
    border-radius: 8px;
	background-color: #FFE207;
	height: 76px;
	width: 100%;
    max-width: 320px;
}
.vrm-field div{
	display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
    align-items: center;
	padding: 8px 10px 3px 10px;
    height: 100%;
	width: 60px;
    border-right: 2px solid #000;
    justify-content: center;
}
.vrm-field .uk-flag{
    display: flex;
    position: relative;
    width: 35px;
    height: 25px;
    background-image: url(/hpi/v1/files/uk-flag.png);
    background-repeat: no-repeat;
    background-position: center;
	
}
.vrm-field .uk-txt{
	font-size: 22px;
    font-weight: var(--ukr-font-weight-bold);
    font-family: var(--ukr-font-family-heading3);
    text-align: center;
    line-height: 1;
}
#ukr-section1 .vrm-field input{
	border: none;
    background-color: #ffe207;
    padding: 0 15px;
	font-size: 40px !important;
    line-height: 40px; 
    width: 100%;
    margin: 0;
    font-weight: var(--ukr-font-weight-bold);
    border-radius: unset;
    font-family: var(--ukr-font-family-heading3);
	text-align: center;
	max-width: 250px;
	box-sizing: border-box;
	text-transform: uppercase;
}

#ukr-section1 .vrm-field input::placeholder {
  color: #727272;
  font-weight: bold;
  background-color: transparent;
  opacity: 1;
}
/*
#ukr-section1 .vrm-field input::-webkit-input-placeholder,
#ukr-section1 .vrm-field input::-moz-placeholder,
#ukr-section1 .vrm-field input:-ms-input-placeholder,
#ukr-section1 .vrm-field input::placeholder {
    color: #727272;
    opacity: 1;
    font-weight: var(--ukr-font-weight-bold); 
    background-color: transparent;
}
*/

/*
#vrmInput::placeholder {
    color: #727272;
    opacity: 1;
    font-weight: var(--ukr-font-weight-bold);
    font-weight: normal;
	background-color: transparent;
}*/
.ukr-section1-col3{
	display: flex;
    position: relative;
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
	gap: 10px;
	margin-bottom: 40px;
	border-top: 3px dashed #003049;
    padding-top: 25px;
}
.ukr-section1-col3 h2{
	display: block;
    font-size: 32px;
    line-height: 32px;
    text-align: left;
    color: #003049;
    font-family: var(--ukr-font-family-heading2);
}
.ukr-section1-col3 p{
	display: block;
    font-size: 18px;
    line-height: 24px;
    text-align: left;
    color: #1C1C1C;
    font-weight: var(--ukr-font-weight-medium);
    font-family: var(--ukr-font-family-heading2);
}
.ukr-section1-col3 ul{
	display: flex;
    position: relative;
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
    margin-top: 15px;
	flex-direction: row;
    flex-wrap: wrap;
}
.ukr-section1-col3 ul li{
	display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
	gap: 10px;
}
.ukr-section1-col3 ul li i{
	text-align: center;
    font-size: 22px;
    line-height: 1;
    color: #003049;
}
.ukr-section1-col3 ul h4{
	font-size: 16px;
    line-height: 1;
    font-weight: var(--ukr-font-weight-regular);
    font-family: var(--ukr-font-family-heading);
    color: #1C1C1C;
}

/*----------- End Section 1 ------------*/
/*----------- Section 2 ----------------*/
#ukr-section2{
	display: block;
    width: 100%;
    position: relative;
    margin: 0 auto;
    background-color: #fff;
    padding-top: 100px;
    margin-top: -150px;
    padding-bottom: 80px;
    z-index: 2;
    border-top-right-radius: 8rem;
}
.ukr-section2-content{
	display: flex;
    flex-direction: column;
    width: 100%;
}
.ukr-section2-title{
	display: block;
    position: relative;
    width: 100%;
	margin-bottom: 25px;
}
.ukr-section2-title h2{
	color: #807b84;
    font-size: 44px;
	font-weight: var(--ukr-font-weight-medium);
	font-family: var(--ukr-font-family-heading3);
	line-height: 1;
}

.ukr-section2-txt{
	display: block;
    width: 100%;
	font-family: var(--ukr-font-family-heading);
}
.ukr-section2-txt ul {
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    padding-left: 10px;
    row-gap: 15px;
	margin-top: 20px
}
.ukr-section2-txt ul li{
	
}
.ukr-section2-txt .m3 {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
}
.ukr-section2-txt .mi3 {
    line-height: 16px;
	color: #003049;
	font-size: 28px;
	margin-right: 8px;
    
}
.ukr-section2-txt .m3 h4 {
    font-size: 16px;
    line-height: 16px;
    font-weight: 400;
    margin: 0;
}

.ukr-section2-txt p{
	display: block;
    width: 100%;
    font-size: var(--ukr-font-size-base);
    font-weight: var(--ukr-font-weight-regular);
    opacity: 0.8;
    line-height: normal;
}
.ukr-section2-txt a em{
	color: #f76e0b;
	font-style: normal;
}
.ukr-section2-txt a em:hover{
	color: #be5000;
	text-decoration: underline;
}



/*----------- End Section 2 ------------*/
/*----------- Help Section -------------*/
.ukr-help-section {
	background-color: #fbfafb;
	padding: 60px 0;
	display: flex;
	justify-content: space-between;
}

.ukr-help-container {
  display: flex;
  flex-direction: row;
  max-width: 1400px;
  gap: 40px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: space-between;
}

.ukr-help-image {
	flex: 1 1 400px;
	overflow: hidden;
}	

.ukr-help-image img {
  width: 100%;
  height: auto;
  display: block;
}

.ukr-help-content {
  flex: 1 1 400px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.help-step-box{
	display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
}
.ukr-help-content h2 {
  font-size: 32px;
  line-height: 1.3;
  margin-bottom: 20px;
  font-weight: 700;
  color: #000;
}
.ukr-help-content h3 {
	display: flex;
    font-size: 22px;
    line-height: 1.3;
    margin-bottom: 15px;
    font-weight: var(--ukr-font-weight-bold);
    color: #003049;
    flex-direction: row;
    align-items: center;
}
.help-icon1, .help-icon2, .help-icon3{
	display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    width: 25px;
    height: 25px;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAM1BMVEVHcEwAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEmZT8OXAAAAEXRSTlMAlokYughbZDPgJdFvS8Or7djGeP0AAAFkSURBVDjLdVNZosQgCAMR627vf9qHuHSbx0enThNIogKMonQ+qhI8y+Fzje4FMBnY72LI5vaRSjGBONldiSmYUuaYGBAzQW4XpWWgjBiirg7tltNNFqWsc90CRAztIZtawAjmWAA0tOWsN4NQ9ohpqqTUWkplGWfeI5SG1fcfX3ECrhEKMG0QgJt5A/qIGHhL7P4+AJNXqFFz/ACGAFEigXn7AyBBkeg3lntQCsABKKjtpQNVNJXVCPQxOAyXpml3EOMItGuQ/rZMzTrz5oK7C+shzFRlq0/5iPvMoDSQv4Q51wc01/Oxmn20PTEngxejWPBJ/YSKWINqT35JmIuxXd65EYdbpJFEE4nP8yAy23GtZYdz5WvNNcve3whe+Ggvmxalh7+37HyT4jzFyUiP43VRhO+G/iM46WHgfXOET7Z6Xy1pj085IYq77ldfvxU7t1u0NcLvyiEzywP+LcLzxOfF/wMEFQwD8GStgwAAAABJRU5ErkJggg==");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
	margin-right: 8px;
}
.help-icon2{
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAANlBMVEVHcEwAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEnR72C1AAAAEXRSTlMAeIjdaZpT6r1vri4bzPgIQIddUoMAAAEISURBVDjLzVLbloQgDKP0CgjI///sgqLL2XHmdTYPKmkkodS5/4RNIkNHSE/VKqZYsu9g5O3lZ1ATjwyn2KssxQTAyslRy9ngBGsmSXMfMA/H57Z79hMc2bCoeanOwofYkNG1ulBipdgaQLJrQxoVqb89UgiEfqHaEFQEoExOkJRZCeWmell3JzEzEjoj7XE3JbupLtiVY9QUoUAJPHw5FLgo6AYydlUD9L8Cf1H+PCMgR9xWi4u62xl6R9aQF/UHyzHfQHJrWT4NxW62P9DYTogbTydzibeA5jWn0dc2JuAA3YIwb/kSzGV4shiCV4vLJrlSazks6CVoOCyiWTws3o4RPfTv6/gBEmULxDOby0EAAAAASUVORK5CYII=");
}
.help-icon3{
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAOVBMVEVHcEwAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEkAMEm52r6xAAAAE3RSTlMAeVW7ZiKpEMwIMIqZScRcbz3fbKIwOgAAAQ1JREFUOMudk9uShCAMRBPuBILo/3/sQrwx4zC7tf1AWZWj6XQQ4H/yTXFepqCbXJwiee1n1OsMcFbqC8wB6vXFzIGM7X3zBnByIu4tsoI3wOu0WlE8TAKqERgt2xK6XHz5/i/RyWTTJLOOZSxbSbLoEyEHjM8kAZfrBaMJ2ByyZ7+lXssxG4A6AXoCkM0nxzdgEnwFfPFKUXtQIvswqdAj6goRRfQYUzKPYR4Ucj/DPGZEZsYszfYWsix9Ay6lZPoXw24y8T4Mjx5gaJNJ6lf8VNSh7RiTWhCu8hXUElqPtOE5ZqaMrjZHr7fl3nhrkSsMQNt3v5QXcJis94ZSacGtbxdGa//95/V/+89/AKBHCU+M/NzSAAAAAElFTkSuQmCC");
}
.ukr-help-content p {
  font-size: 16px;
  color: #1C1C1C;
  line-height: 1.5;
}

.ukr-help-buttons {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

.ukr-btn-primary {
	background: #17A628;
	color: #fff;
	padding: 12px 50px;
	font-size: 16px;
	font-weight: var(--ukr-font-weight-bold);
	font-family: var(--ukr-font-family-buttons);
	border-radius: 999px;
	text-decoration: none;
	transition: background 0.3s;
}

.ukr-btn-primary:hover {
  background: #255c5e;
}

.ukr-btn-outline {
	background: transparent;
	color: #17A628;
	padding: 12px 24px;
	font-size: 16px;
	font-weight: var(--ukr-font-weight-bold);
	font-family: var(--ukr-font-family-buttons);
	border: 2px solid #17A628;
	border-radius: 999px;
	text-decoration: none;
	transition: all 0.3s;
}

.ukr-btn-outline:hover {
  background: #255c5e;
  color: #fff;
}

/*----------- End Help Section ---------*/



/*----------- Feature Section ----------*/
.ukr-feature-section {
	background: #efefef;
	padding: 80px 0;
	text-align: center;
	/*
	background-image: url(/hpi/v1/files/featuresectionbg2.png);
	background-size: cover;
	background-position: center;
	*/
}

.ukr-feature-wrapper {
  max-width: 1100px;
  margin: 0 auto;
}

.ukr-feature-section h2 {
    display: block;
    font-size: 42px;
    line-height: 44px;
    text-align: center;
    color: #003049;
    font-family: var(--ukr-font-family-heading2);
    font-weight: var(--ukr-font-weight-medium);
	margin-bottom: 40px;
}

.ukr-subtext {
	font-size: 17px;
	font-weight: var(--ukr-font-weight-medium);
	margin-bottom: 40px;
	color: #1C1C1C;
	opacity: 0.9;
}
.ukr-feature-buttons {
   display: flex;
    gap: 16px;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}
.ukr-btn-feature {
	background: #003049;
    color: #fff;
    padding: 12px 0;
    width: 100%;
    max-width: 600px;
    font-size: 18px;
    font-weight: var(--ukr-font-weight-bold);
	font-family: var(--ukr-font-family-buttons);
    border-radius: 999px;
    text-decoration: none;
    transition: all 0.3s;
}

.ukr-btn-feature:hover {
  background: #f76e0b;
}

.ukr-feature-grid {
	display: flex;
    gap: 30px;
    flex-wrap: wrap;
    margin-top: 60px;
    align-items: center;
    justify-content: center;
	padding: 0 20px;
}

.ukr-feature-card {
	background: #ffffff;
	border-radius: 16px;
	padding: 30px 15px;
	width: 100%;
	max-width: 300px;
	text-align: center;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
	display: flex;
	flex-direction: column;
	align-items: center;
    transition: transform 0.3s;
}
/*
.ukr-feature-card:hover {
	transform: scale(1.02)
}
*/
/* Icon container like the circle in your example */
.ukr-feature-icon {
	width: 100%;
    max-width: 110px;
    height: auto;
	border-radius: 50%;
	border: 1px solid #c9c9c9;
    box-shadow: 0px 0 8px 2px #c9c9c9;
 /* background: #f3faff;  Light blue tint or use white if preferred */
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 45px;
	overflow: hidden;
}
.ukr-feature-numb {
	width: 100px;
	height: 100px;
	border-radius: 50%;
    background: linear-gradient(310deg, #003049, #003049);
    color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 45px;
	overflow: hidden;
}
.ukr-feature-numb h4{
    font-size: 36px;
    font-weight: var(--ukr-font-weight-medium);
    font-family: var(--ukr-font-family-heading2);
}

.ukr-feature-icon img {
     display: flex;
    width: 100%;
    padding: 20%;
    height: auto;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
}

/* Title */
.ukr-feature-card h3 {
    font-size: 20px;
    line-height: 23px;
    font-family: var(--ukr-font-family-heading);
    font-weight: var(--ukr-font-weight-bold);
    margin-bottom: 20px;
    color: #1C1C1C;
}

/* Description */
.ukr-feature-card p {
    font-size: 14px;
    color: #1C1C1C;
    line-height: 1.2;
}

/*----------- ukr-carousel-section ---------*/
.ukr-carousel-section {
	background: #fbfafb;
    padding: 0;
    overflow: hidden;
    position: relative;
	/*
	background-image: url(/hpi/v1/files/carousel-section-mobile-bg.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
	*/
}
.ukr-carousel-title{
	display: block;
    position: relative;
    width: 100%;
    background: #fff;
    padding: 0 20px;
    padding-top: 90px;
    padding-bottom: 150px;
    border-top-right-radius: 8rem;
	text-align: center;
}

.ukr-carousel-title h2 {
    font-size: 32px;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 40px;
}
.ukr-carousel-title p {
	font-size: 17px;
    font-weight: 800;
    margin-bottom: 40px;
    color: #1C1C1C;
    opacity: 0.9;
}
.ukr-carousel-wrapper {
	position: relative;
	width: 100%;
	margin: 0 auto;
}
.ukr-carousel-track {
	position: relative;
}
.ukr-slide {
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	visibility: hidden;
	transition: opacity 1s ease-in-out;
	padding: 100px 25px 90px 25px;
	touch-action: pan-y;
	
}
.slidebg1, .slidebg2, .slidebg3, .slidebg4{
	background-image: url(/hpi/v1/files/carousel-section-mobile-bg1.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.slidebg2{
	background-image: url(/hpi/v1/files/carousel-section-mobile-bg2.jpg);
}
.slidebg3{
	background-image: url(/hpi/v1/files/carousel-section-mobile-bg3.jpg);
}
.slidebg4{
	background-image: url(/hpi/v1/files/carousel-section-mobile-bg4.jpg);
}
.ukr-slide.active {
	opacity: 1;
	visibility: visible;
	position: relative;
}
.ukr-slide-content {
	position: relative;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    margin: 0 auto;
    width: 100%;
	overflow: hidden;
	padding: 0 15%;
	gap: 40px;
	overflow: visible;
}
.ukr-slide-one {
	
}
.ukr-slide-img {
	position: relative;
    display: block;
    width: 100%;
    max-width: 240px;
    margin: 0 auto;
	transform: translateY(-40px);
	transition: transform 1s ease-in-out;
}
.ukr-slide-img>div {
	position: relative;
    display: block;
	width: 100%;
	overflow: hidden;
}
.ukr-slide-img > div > img:nth-child(1) {
	position: relative;
    display: block;
    width: 100%;
    height: 100%;
    aspect-ratio: 634 / 1320;
    z-index: 10;
    overflow: hidden;
}
.ukr-slide-img > div > img:nth-child(2) {
	position: absolute;
    display: block;
    top: 10%;
    left: 2%;
    width: 96%;
    height: 80%;
    object-fit: cover;
    z-index: 8;
}

.ukr-slide-text {
	display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap: 22px;
	background: #fff;
    border-radius: 8px;
    padding: 50px 15px;
	/*box-shadow: inset 2px 2px 9px 1px rgb(0 63 92), inset -2px -2px 9px 1px rgb(0 63 92);*/
    box-shadow: 0 0 10px 3px #ccc;
	transform: translateY(40px);
	transition: transform 0.8s ease-in-out;
}
.ukr-slide-text span{
	position: relative;
	width: 60%;
	height: 3px;
	background-color: #a0a0a0;
	/*margin: 0 auto;*/
}
.ukr-slide-text > div{
	display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
	gap: 18px;
}
.ukr-slide-text h3 {
	font-size: 24px;
    font-weight: 700;
    line-height: 28px;
    text-align: left;
}
.ukr-slide-txt-content {
	display: block;
    width: 100%;
}
.ukr-slide-txt-content p {
	font-size: 16px;
    line-height: 22px;
    font-weight: 400;
    /*opacity: 0.8;*/
}
.ukr-slide-four {
	
}
.ukr-pagination {
	position: relative;
    display: flex;
    justify-content: center;
    gap: 10px;
    z-index: 2;
	padding: 25px 0;
    transform: translateY(-50px);
    background-color: rgb(0 0 0 / 20%);
}
.ukr-dot {
	width: 30px;
	height: 5px;
	background-color: #ccc;
	cursor: pointer;
}
.ukr-dot.active {
	background-color: #003049;
}
.ukr-nav-btn {
	position: absolute;
    display: flex;
    top: 50%;
    transform: translateY(-50%);
	background: rgb(142 142 142 / 50%);
    border: none;
    color: #fff;
    width: 50px;
    height: 50px;
    font-size: 20px;
	font-weight: var(--ukr-font-weight-bold);
	font-family: var(--ukr-font-family-buttons);
    cursor: pointer;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
	z-index: 10;
}
.ukr-nav-btn.prev {
	left: 15px;
}
.ukr-nav-btn.next {
	right: 15px;
}
.ukr-nav-btn i{
	font-size: 30px;
}
.ukr-carousel-service-btn{
	background: linear-gradient(to bottom, #fbfafb 0%, #fff3e7 30%, #fff 100%);
    display: flex;
    position: relative;
    width: 100%;
    align-items: center;
    justify-content: center;
    padding: 80px 0;
}
.carousel-link-btn{
	display: flex;
    position: relative;
	font-size: 18px;
    font-weight: var(--ukr-font-weight-bold);
	font-family: var(--ukr-font-family-buttons);
	color: #fff;
    background-color: #f76e0b;
    height: 50px;
    width: 100%;
    max-width: 500px;
    align-items: center;
    text-align: center;
    border: 2px solid #f76e0b;
    margin: 0 auto;
    justify-content: center;
    border-radius: 25px;
	transition: 0.4s easy-in-out;
}
.carousel-link-btn:hover {
    transform: scale(1.05);
    /* color: #038deb; */
}
.carousel-link-btn i {
	margin-left: 8px;
    font-size: 21px;
}
.anim-translateImg {
  transform: translateY(0px) !important;
}
.anim-translateTxt {
  transform: translateY(0px) !important;
}
/*----------- End ukr-carousel-section ---------*/
/*----------- ukr-carousel-section2 ---------*/
.ukr-carousel-section2 {
	background: #fbfafb;
    padding: 0;
    overflow: hidden;
    position: relative;
}

.ukr-carousel-wrapper2 {
	position: relative;
	width: 100%;
	margin: 0 auto;
}
.ukr-carousel-track2 {
	position: relative;
    margin-top: 60px;
}
.ukr-slide2 {
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	visibility: hidden;
	padding: 0 25px;
	touch-action: pan-y;
	transition: opacity 0.15s ease-out, visibility 0s linear 0.15s;
}
.ukr-slide2.active {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	position: relative;
	transition: opacity 0.8s ease-in;
}
.ukr-slide-content2 {
	position: relative;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    margin: 0 auto;
    width: 100%;
	overflow: hidden;
	padding: 0 15px;
	gap: 40px;
	overflow: visible;
}

.ukr-nav-btn2 {
	position: absolute;
    display: flex;
    top: 64%;
    transform: translateY(-50%);
    background: #fff;
    border: none;
    color: #232930;
    width: 40px;
    height: 40px;
    font-size: 18px;
	font-weight: var(--ukr-font-weight-bold);
	font-family: var(--ukr-font-family-buttons);
    cursor: pointer;
    border-radius: 50%;
    align-items: center;
    justify-content: center;
	z-index: 10;
}
.ukr-nav-btn2.prev {
	left: 15px;
}
.ukr-nav-btn2.next {
	right: 15px;
}
.ukr-nav-btn2 i{
	font-size: 26px;
}

.anim-translate2 {
  transform: translateX(0px) !important;
  
}
.ukr-dot-hidden {
  display: none !important;
}

/*----------- End ukr-carousel-section2 ---------*/


/*----------- ukr-carousel-section3 ---------*/

.ukr-carousel-section3{
	background: #fbfafb;
    overflow: hidden;
    position: relative;
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
	padding-top: 80px;
}
.ukr-carousel-section3-content{
	display: block;
    width: 100%;
    margin: 0 auto;
    position: relative;
}

/*----------- End ukr-carousel-section3 ---------*/


#inf-head{
	display: block;
    width: 100%;
    height: 40px;
    margin: 0 auto;
    background: #003049;
    text-align: center;
}
.inf-head-txt{
	display: block;
    width: 100%;
    height: 100%;
    margin: 0 auto;
}
.inf-head-txt h3{
	font-size: 1em;
    font-weight: 400;
	line-height: 40px;
    color: #fff;
	font-weight: bold;
}
#main{
	display: block;
	position: relative;
	width: 100%;
	margin: 0 auto;
	background: none;
    padding-top: 40px;
	padding-bottom: 40px;
}
.main-txt{
	position: relative;
    width: 100%;
    padding: 0;
    z-index: 1;
}
.main-txt h3 {
    font-size: 26px;
    line-height: 30px;
    margin-bottom: 15px;
    text-align: left;
    color: #fff;
    font-weight: 400;
}
.main-txt h4 {
    font-size: 20px;
    line-height: 26px;
    margin-bottom: 15px;
    text-align: left;
    color: #fff;
    font-weight: 400;
}
.main-txt p {
    font-size: 18px;
    line-height: 24px;
    margin-bottom: 15px;
    text-align: left;
    color: #fff;
    font-weight: 400;
}
.main-txt-title{
	width: 100%;
    margin-bottom: 25px;
}
.main-txt-title h1{
	font-size: 40px;
    color: #fff;
    line-height: 50px;
    font-weight: 500;
}
.main-txt-content {
    display: flex;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    border-radius: 18px;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: center;
    align-items: stretch;
}
.main-col1{
	display: block;
    position: relative;
    width: 100%;
    margin: 0 auto;
    text-align: center;
	padding-top: 8px;
	padding-bottom: 20px;
	font-family: "Roboto", sans-serif;
}
.main-col1 ul{
	display: flex;
    width: 100%;
    flex-direction: row;
    align-items: flex-end;
    flex-wrap: nowrap;
    justify-content: space-between;
}
.main-col1 ul li{
	color: #fff;
}
.main-col1 .m1{
	display: flex;
    align-items: center;
    height: 100%;
	padding-right: 4px;
}
.main-col1 .m2{
	display: flex;
    align-items: center;
    height: 100%;
}
.main-col1 .m3{
	display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
	padding-left: 4px;
}
.main-col1 h1{
	font-size: 8em;
    line-height: 0.9;
    font-weight: 600;
}
.main-col1 h3{
	display: flex;
    position: relative;
    font-size: 4em;
    text-align: left;
    bottom: 2px;
    line-height: 1;
    width: fit-content;
    font-weight: 500;
    flex-direction: column;
    align-items: flex-start;
}
.main-col1 h3 span{
	font-size: 0.7em;
}
.main-col1 h4{
	display: block;
    position: relative;
    font-size: 25px;
    line-height: 1.1;
    bottom: 6px;
	font-weight: 600;
	text-align: left;
}

.main-col2{
	background: #fff;
    color: #003049;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
    width: 100%;
    text-align: center;
}
.main-col2 h3{
	font-size: 37px;
    line-height: 0.8;
    text-transform: uppercase;
    padding: 15px 0;
    font-weight: 600;
}
.main-btn{
	display: block;
    position: absolute;
    width: max-content;
    margin: 0 auto;
    left: calc(50% - 90px);
    bottom: -22px;
}
.m-btn{
	position: relative;
    z-index: 2;
    overflow: hidden;
    display: flex;
    text-transform: uppercase;
    background-color: #003049;
    color: #fff;
    height: 44px;
    line-height: 44px;
    font-size: 18px;
	font-weight: var(--ukr-font-weight-bold);
	font-family: var(--ukr-font-family-buttons);
    padding: 0 15px;
    border-radius: 22px;
    padding-left: 22px;
    width: 180px;
    
    align-items: center;
    flex-wrap: wrap;
    flex-direction: row;
    transition: 0.3s ease-in-out;
    justify-content: center;
	outline: 4px solid #fff;
	cursor: pointer;
}

.hover_effect.m-btn {
	background-color: #134938;
}
.b-btn{
	position: relative;
    z-index: 2;
    overflow: hidden;
    display: flex;
    text-transform: uppercase;
    background-color: #fff;
    color: #444;
    height: 32px;
    line-height: 24px;
    font-size: 14px;
    border-radius: 17px;
    border: 2px solid #003049;
    font-weight: var(--ukr-font-weight-bold);
	font-family: var(--ukr-font-family-buttons);
    align-items: center;
    flex-wrap: wrap;
    flex-direction: row;
    transition: 0.3s ease-in-out;
    justify-content: center;
    outline: 5px solid #fff;
    cursor: pointer;
    border-top-width: thick;
	width: 160px;
}

.hover_effect.b-btn {
	background: #1d1c1f;
    color: #fff;
}
.g-btn{
	display: flex;
	position: relative;
	align-items: center;
    flex-wrap: wrap;
    flex-direction: row;
	justify-content: center;
    font-family: 'Cabin';
	text-transform: uppercase;
	font-size: 18px;
	font-weight: var(--ukr-font-weight-bold);
	font-family: var(--ukr-font-family-buttons);
	height: 50px;
    line-height: 50px;
    padding: 0 15px;
	padding-left: 22px;
    border-radius: 6px;
	z-index: 2;
    overflow: hidden;
    transition: 0.3s ease-in-out;
	cursor: pointer;
}
.g-btn i{
	margin-left: 8px;
    font-size: 21px;
}
.g-btn i.revers{
	transform: rotate(180deg);
    margin-left: 0;
    margin-right: 8px;
}
.gray{
	background-color: #212325; /*green*/
    color: #fff;
}
.green{
	background-color: #003049; /*green*/
    color: #fff;
}
.red{
	background-color: #fe7e7e; /*red*/
    color: #fff;
}
.org{
	background-color: #003049; /*orange*/
    color: #fff;
}
.search-symb{
	font-size: 28px;
}
.hover_effect.gray {
	background-color: #003049;
	border: 1px solid #fff;
}
.hover_effect.green {
	background-color: #212325;
}
.hover_effect.red {
	background-color: #ff0000;
}
.hover_effect.org {
	background-color: #212325;
}
.hover_effect .search-symb{
	transform: scale(1.1) rotate(90deg);
}
.arrcol-m svg{
	position: relative;
	top: 4px;
	fill: #fff;
	transition: 0.3s ease-in-out;
	margin-left: 10px;
}
.hover_effect .arrcol-m svg{
	margin-left: 14px;
}
.arr-right svg{
	position: relative;
	top: 4px;
	fill: #fff;
	transition: 0.3s ease-in-out;
	margin-left: 10px;
}
.hover_effect .arr-right svg{
	margin-left: 14px;
}
.arr-left svg{
	position: relative;
	top: 4px;
	fill: #fff;
	transform: rotate(180deg);
	margin-right: 10px;
	transition: 0.3s ease-in-out;
}
.hover_effect .arr-left svg{
	margin-right: 14px;
}


.main-img{
	display: block;
    position: relative;
    width: 100%;
    margin: 0 auto;
    text-align: center;
}
.main-img-center{
	display: block;
    position: relative;
    width: 100%;
    max-width: 520px;
    margin: 0 auto;
    text-align: center;
    vertical-align: middle;
}
.main-img-center img{
	position: relative;
    width: 100%;
    max-width: 100%;
    z-index: 2;
}
.main-img-left{
	display: block;
    position: absolute;
    top: 175px;
    left: 5%;
    width: 100%;
    max-width: 300px;
    z-index: 5;
}
.main-img-left img{
	display: block;
    position: relative;
    width: 100%;
	z-index: 3;
}
.main-img-right{
	display: block;
    position: absolute;
    z-index: 4;
    width: 360px;
    top: 255px;
    left: 31%;
}
.main-img-right img{
	display: block;
    position: relative;
    width: 100%;
	z-index: 3;
}
.th-btn{
	position: relative;
    z-index: 2;
    overflow: hidden;
    display: inline-block;
    text-transform: uppercase;
    background-color: #003049;
    color: #fff;
    font-family: 'Cabin';
    font-size: 18px;
    padding: 15px 30px;
    border-radius: 5px;
    letter-spacing: 0;
    width: fit-content;
}
.th-btn:before, .th-btn:after{
	content: "";
    position: absolute;
    height: 100%;
    top: 0;
    left: 0;
    width: 50.1%;
    background-color: #72406c;
    z-index: -1;
    transition: all 0.4s ease-out;
    border-radius: 0;
}
.th-btn:before{
	transform: scale(0) rotate(0);
}
.th-btn:after{
	transform: scale(0) rotate(0);
    left: unset;
    right: 0;
}
.th-btn:hover::before, .th-btn:hover:after, .th-btn.active::before, .th-btn.active:after {
    border-radius: 0;
    transform: scale(1) rotate(360deg);
}
.tfs-button-1{
	display: block;
    position: relative;
    bottom: 0;
    left: 0;
    width: 100%;
}

.ct-btn{
    position: relative;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
    align-items: center;
	justify-content: center;
    width: 100%;
    text-transform: uppercase;
    font-family: var(--ukr-font-family-buttons);
    font-size: var(--ukr-font-size-buttons);
    font-weight: var(--ukr-font-weight-bold);
    line-height: 17px;
    height: 40px;
    border-radius: 20px;
    border: 2px solid;
    overflow: hidden;
    transition: 0.3s ease-in-out;
    
}
.btcol1, .btcol2,.btcol3 {
	background-color: transparent;
    color: var(--ukr-color-button1);
    border-color: var(--ukr-background-color-button1);
	max-width: 350px;
}

.btcol1:hover, .btcol2:hover, .btcol3:hover {
	background-color: var(--ukr-background-color-button1-hover);
    color: var(--ukr-color-button1-hover);
	transform: translateY(-5px);
}
.btcol3{
	 max-width: 90%;
}
.link-btn{
	display: flex;
    position: relative;
    font-size: 18px;
    color: #fff;
    font-weight: 600;
    transition: 0.4s easy-in-out;
    background-color: #f76e0b;
    height: 50px;
    width: 100%;
    max-width: 1130px;
    align-items: center;
    text-align: center;
    border: 2px solid #f76e0b;
    margin: 0 auto;
    justify-content: center;
    border-radius: 25px;
}
.link-btn:hover{
	transform: scale(1.05);
    /*color: #038deb;*/
}

/*====== Main banner==========*/
#main-banner{
	display: block;
    position: relative;
    width: 100%;
    margin: 0 auto;
    background: #003049;
    margin-bottom: 25px;
    container-type: inline-size;
}
.main-banner-container{
    display: flex;
    position: relative;
    flex-direction: column;
    flex-wrap: nowrap;
    width: 100%;
    margin-top: 4cqw;
    margin-bottom: 8cqw;
}
.main-banner-txt{
	position: relative;
    width: 100%;
    padding: 0;
    z-index: 1;
}
.main-banner-txt-title{
	width: 100%;
    margin-bottom: 25px;
}
.main-banner-txt-title h1{
	font-size: 40px;
    color: #fff;
    line-height: 50px;
    font-weight: 500;
}
.main-banner-txt-content {
    position: relative;
    container-type: inline-size;
    container-name: main-banner;
    display: flex;
    width: clamp(150px, 100%, 550px);
    flex-direction: column;
    left: 50%;
    transform: translateX(-50%);
}

.main-banner-txt-box {
    position: relative;
    display: flex;
    width: 100%;
    border: 2px solid #fff;
    margin: 0 auto;
    text-align: center;
    border-radius: 8px;
    padding: clamp(3px, 3vw, 10px);
    flex-direction: column;
    flex-wrap: wrap;
    align-content: center;
    align-items: stretch;
	
}
.main-banner-col1{
	display: block;
    position: relative;
    width: 100%;
    margin: 0 auto;
    text-align: center;
	padding-bottom: 4cqw;
	font-family: "Cabin", sans-serif;
}
.main-banner-col1 ul{
	display: flex;
    width: 100%;
    flex-direction: row;
    align-items: flex-end;
    flex-wrap: nowrap;
    justify-content: space-between;
}
.main-banner-col1 ul li{
	color: #fff;
}
.main-banner-col1 .m1{
	display: flex;
    align-items: center;
    height: 100%;
	padding-right: 1cqw;
}
.main-banner-col1 .m2{
	display: flex;
    align-items: center;
    height: 100%;
}
.main-banner-col1 .m3{
	display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-start;
	padding-left: 4px;
}
.main-banner-col1 h1{
    line-height: 0.9;
    font-weight: 600;
    font-size: 20cqw;
}
.main-banner-col1 h3{
	display: flex;
    position: relative;
    text-align: left;
    bottom: 2px;
    line-height: 1;
    width: fit-content;
    font-weight: 500;
    flex-direction: column;
    align-items: flex-start;
    font-size: 12cqw;
}
.main-banner-col1 h3 span{
	font-size: 0.4em;
}
.main-banner-col1 h4{
	display: block;
    position: relative;
    font-size: 25px;
    line-height: 1;
    bottom: 1cqw;
	font-weight: 600;
	text-align: left;
    font-size: 4.5cqw;
}
.main-banner-col2{
	background: #fff;
    color: #777777;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
    width: 100%;
    text-align: center;
}
.main-banner-col2 h3{
	line-height: 0.8;
    text-transform: uppercase;
    padding: 5cqw 0;
    font-weight: 600;
    font-size: 5.5cqw;
    transform: translateX(8cqw);
}
.main-banner-btn{
	display: block;
    position: absolute;
    width: max-content;
    margin: 0 auto;
    left: calc(50% - 80px);
    bottom: -17px;
}

.arrcol-m svg{
	position: relative;
	top: 4px;
	fill: #fff;
	transition: 0.3s ease-in-out;
	margin-left: 10px;
}

.hover_effect .arrcol-m svg{
	margin-left: 14px;
}
.main-banner-img{
	display: block;
    position: relative;
    width: 100%;
    margin: 0 auto;
    text-align: center;
}
.main-banner-img-center{
	display: block;
    position: relative;
    width: 100%;
    max-width: 520px;
    margin: 0 auto;
    text-align: center;
    vertical-align: middle;
}
.main-banner-img-center img{
	position: relative;
    width: 100%;
    max-width: 100%;
    z-index: 2;
}
.main-banner-img-left{
    position: relative;
    top: 0cqw;
    left: -14cqw;
    width: 100%;
    max-width: 52cqw;
    z-index: 5;
}
.main-banner-img-left img{
    position: relative;
    width: 100%;
	z-index: 3;
}
.main-banner-img-right{
    display: block;
    position: absolute;
    z-index: 4;
    width: 100%;
    top: 29cqw;
    left: 17cqw;
    max-width: 85cqw;
}
.main-banner-img-right img{
    position: relative;
    width: 100%;
	z-index: 3;
}

/*====== Pre-Sell==========*/
.presell-col1{
	width: 100%;
}
.presell-col1 h2{
	text-align: center;
    color: #fff;
    width: 100%;
    font-family: 'Roboto';
    font-size: 32px;
    font-weight: 600;
    line-height: 36px;
	text-shadow: 0 1px 3px #444;
}
.presell-col1 h2 span{
	display: inline-block;
}
.presell-col1 h3{
	font-size: 24px;
    color: #fff;
    font-weight: 400;
    padding-top: 5px;
	text-shadow: 0 1px 3px #444;
}
.presell-col1 ul{
	display: flex;
    justify-content: flex-start;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    margin-top: 15px;
	margin-bottom: 20px;
	padding-left: 25px;
	color: #fff;
	text-shadow: 0 1px 1px #444;
}
.presell-col1 .m3{
	display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
	margin-bottom: -5px;
}
.m3 h4{
	/*color: #fff;*/
    font-size: 16px;
}
.mi3{
	margin-right: 5px;
    font-size: 22px;
}
.presell-btn{
	width: fit-content;
    display: block;
    position: relative;
    margin: 0 auto;
}
.presell-gray-btn{
	position: relative;
    z-index: 2;
    overflow: hidden;
    display: flex;
    text-transform: uppercase;
    background-color: #212325;
    color: #fff;
    font-family: 'Cabin';
   height: 50px;
    line-height: 50px;
    font-size: 20px;
    padding: 0 15px;
    padding-left: 22px;
    max-width: 250px;
    font-weight: 600;
    align-items: center;
    flex-wrap: wrap;
    flex-direction: row;
    border-radius: 4px;
    transition: 0.3s ease-in-out;
    justify-content: center;
}
.hover_effect.presell-gray-btn {
	background-color: #003049;
	border: 1px solid #fff;
}
.presell-col2{
	width: 100%;
    max-width: 600px;
    margin: 0 auto;
    margin-top: 10px;
}
.presell-col2 a{
	color: #003049;
}
.presell-col2 a:hover{
	color: #a7e4ff;
    text-decoration: underline;
}

.presell-col2 p{
    font-size: 13px!important;
    color: #666666;
    line-height: 1!important;	
}

/*=================================*/
.small-bg-section{
	display: block;
    width: 100%;
    background-color: #f76e0b;
    background-image: url(/hpi/v1/files/bg-setciton4.png);
    height: 100px;
}
.presell-col3{
    display: block;
    position: relative;
    width: 100%;
    left: 50%;
    transform: translateX(-50%);
    max-width: 460px;
}
/*=================================*/
.fuel-info{
	display: block;
    width: 100%;
    margin-top: 30px;
    margin-bottom: 30px;
}
.fuel-form{
	display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: stretch;
    width: 100%;
    position: relative;
}
.fuel-entry-data{
	display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    max-width: 200px;
    margin-right: 15px;
}
.fuel-entry-data label{
	display: block;
    width: 100%;
    font-size: 16px;
    /*color: #fff;*/
    font-weight: 600;
    margin-bottom: 5px;
}
.dtr-data a, .styled-table td a{
	display: flex;
    color: #5b4e48;
    text-decoration: underline;
    line-height: 1;
    font-size: 14px;
    font-weight: var(--ukr-font-weight-bold);
    font-family: var(--ukr-font-family-heading);
	
}
.dtr-data a:before, .styled-table td a:before{
	content: "";
    display: inline-block;
    position: relative;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAAKlBMVEVbTkhHcExbTkhbTkhbTkhbTkhbTkhbTkhbTkhbTkhbTkhbTkhbTkhbTkiGo3BqAAAADnRSTlP9AFfqb54yw9gOhh+yRNiGeXYAAADvSURBVBjTYxAEgl0NHKtBNAMQSzGHuBoshHICVgoKzmKFcESYQEoUHMGcyYGCqkGCopZgjsJGUfaCQGkmMCdCMMFRhE2wFcw5I+ggKMgCpECc44IKEyWZBGvAnMWCk8vSLQWtwJwERbEGjkQhNjBHvFNQLFFwRiGYI8YFsnRBIsQ5IBosAuKAVADVQjiyLIKCDhchnKwGho3SDBzLQJx05pDLB2VsXQ3KBBmkLRQFhZgUgETzRgYRTqDiwzZAYrIjgxDIa5utQd5TZBAMKJooKHtRUFKdFWiAUAFHlIvL0gZ2RZDR0q4VBsztIRsFBQEtTjYSbvtWKQAAAABJRU5ErkJggg==);
    background-repeat: no-repeat;
    background-size: cover;
	width: 18px;
    height: 18px;
    vertical-align: middle;
    top: -2px;
    margin-right: 3px;
}

/*=================================*/

#benefits{
	display: block;
    position: relative;
    width: 100%;
    background: #f8f8f8;
    /*background-image: linear-gradient(180deg, #f7f7f7 60%, rgba(255, 255, 255, 0) 60%);*/
    padding: 80px 0;
}
.benefits-container{
	display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
    position: relative;
	color: #1d242d;
}
.benefits-tile{
	display: block;
    text-align: left;
    width: 100%;
    margin-bottom: 20px;
}
#benefits h2{
    font-size: 42px;
    text-align: center;
    margin-bottom: 30px;
    font-weight: var(--ukr-font-weight-bold);
    font-family: var(--ukr-font-family-heading2);

}
#benefits-box{
	display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
    position: relative;
	margin-top: 20px;
}
.benefits-box{
	display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
    position: relative;
}
.benefits-box > div{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.benefits-box img{
    width:100%;
    height:auto;
    max-width: 1113px;
}
.benefits-box-content{
	display: flex;
	margin-left: 0;
	margin-right: 0;
    overflow: hidden;
	background-color: #003049;
    background-image: url(/hpi/v1/files/feature_card_bg.png);
    background-position: right bottom;
    background-size: cover;
	border: 1px solid  #e6e6e6;
	border-radius: 10px 10px 10px 10px;
	border-radius: 10px;
	width: 100%;
	margin-bottom: 20px;
    
}
.bnf-card{
	display: flex;
    position: relative;
    flex-direction: column;
    align-items: center;
    width: 100%;
    justify-content: flex-start;
	height: 100%;
    padding: 0 20px;
    padding-top: 40px;
    padding-bottom: 15px;
}
.bnf-card:before{
	content: '';
    height: 100%;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: #fff;
    border: 1px solid #e6e6e6;
    border-radius: inherit;
    z-index: 0;
    transition: 0.4s ease-in-out;
}
.hover_effect .bnf-card:before{
    transform: translate(0px, 100%);
}
.hover_effect .txtCol1, .hover_effect .txtCol2, .hover_effect .txtCol3, .hover_effect .txtCol4, .hover_effect .txtCol5, .hover_effect .txtCol6, .hover_effect .txtCol7{
	color: #fff;
}
.bnf-title{
	display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    position: relative;
    margin-top: 35px;
    margin-bottom: 15px;
	transition: 0.4s ease-in-out;
}
#benefits-box h3 {
    margin-bottom: 10px;
    font-size: 22px;
    font-weight: 600;
    display: block;
    text-align: center;
	vertical-align: top;
}
.bnf-description{
	display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    position: relative;
    margin-top: 5px;
    margin-bottom: 10px;
	transition: 0.4s ease-in-out;
}
#benefits-box p{
    width: 100%;
    text-align: center;
    vertical-align: top;
    font-size: 16px;
    line-height: 26px;
    display: inline-block;
}
/*=================================*/
.other-service{
	display: block;
    width: 100%;
    position: relative;
    margin: 0 auto;
	margin-bottom: 15px;
    margin-top: 25px;
    padding: 30px 10px;
    padding-top: 0;
    border-top: 10px solid #f86e0a;
    border-bottom: 10px solid #f86e0a;
    box-shadow: 0 0 9px 4px rgb(190 181 147 / 50%);
	background-color: #fbfbfb;
    overflow: hidden;
}
.other-service h3{
	margin-bottom: 10px;
    font-size: 18px;
    font-weight: 600;
    display: block;	
}
.offer-list{
	display: flex;
    position: relative;
    width: 100%;
    margin: 0 auto;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}
.offer-list li{
	display: flex;
    position: relative;
    width: 100%;
    flex-direction: column;
	align-items: center;
}
.offer-list-box-content {
	display: inline-block;
	padding: 10px 15px;
	background: #fff6f0;
	border-radius: 14px;
	padding: 10px 16px;
	box-shadow: 0 4px 10px rgba(255, 147, 68, 0.2);
	border: 2px solid #003049;
	max-width: 360px;
	transition: all 0.2s ease-in-out;
}

.offer-list-card {
  display: flex;
  align-items: center;
  text-decoration: none;
  color: #ffffff;
}

.offer-list-img {
  flex: 0 0 50px;
  height: 50px;
  background: #fff;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 15px;
  
}

.offer-list-img img {
	width: 40px;
    height: 40px;
    border-radius: 5px;
}

.offer-list-txt {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
}
.offer-list-title{
	display: block;
    width: 100%;
    text-align: left;
}
.offer-list-title h4 {
	font-size: 16px;
    color: #003049;
    margin: 0;
    line-height: 1;
    font-family: var(--ukr-font-family-heading);
    font-weight: var(--ukr-font-weight-bold);
}
.offer-list-comment{
	display: flex;
    flex-direction: row;
    justify-content: flex-start;
    width: 100%;
}
.offer-list-comment span {
	font-size: 16px;
    color: #848484;
    line-height: 16px;
    text-align: left;
    font-family: var(--ukr-font-family-heading3);
    font-weight: var(--ukr-font-weight-regular);
}
.offer-list-box-content:hover {
	transform: translateY(2px);
	box-shadow: 0 6px 16px rgba(255, 147, 68, 0.3);
}
.offer-list-box-content:active {
	transform: translateY(1px);
	box-shadow: 
		inset 0 2px 4px rgba(0, 0, 0, 0.5),
		0 2px 4px rgba(0, 0, 0, 0.3);
}
.offer-list2-box-content{
	display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
	max-width: 450px;
    gap: 15px;
    padding: 10px 12px 17px 12px;
    border: 1px solid #e76b5e;
    border-radius: 14px;
}
.offer-list2-img{
	display: flex;
    align-items: center;
    justify-content: center;
	width: 80px;
    height: 80px;
    border-radius: 50%;
    background-color: #e76b5e;
    box-shadow: #c0392b 0px 7px 2px, #000 0px 8px 5px;
}
.offer-list2-img img{
	display: flex;
    align-items: center;
    justify-content: center;
    width: 80%;
    height: 80%;
    border-radius: 50%;
	box-shadow: #c0392b 0px 3px 2px, #000 1px 4px 2px;
}
a.offer-list-card2{
	display: flex;
    background-color: #e74c3c;
    color: #fff;
    position: relative;
    border: none;
    padding: 10px;
    font-weight: bold;
    text-transform: uppercase;
    transition: 0.2s;
    border-radius: 5px;
    opacity: 0.8;
    letter-spacing: 1px;
    width: calc(100% - 90px);
    height: 70px;
    box-shadow: #a21c0e 0px 7px 2px, #000 0px 8px 5px;
    align-items: center;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: center;
}
a.offer-list-card2 h4{
	display: block;
    font-size: 16px;
    line-height: 18px;
    color: #fff;
    margin-bottom: 5px;
    width: 100%;
}
a.offer-list-card2 span{
	display: block;
    width: 100%;
    font-size: 12px;
    line-height: 1;
    text-transform: capitalize;
}

a.offer-list-card2:hover {
	opacity: 1;
	top: 1px;
    box-shadow: #c0392b 0px 6px 2px, #000 0px 6px 5px;
}

a.offer-list-card2:active {
  top: 4px;
  box-shadow: #c0392b 0px 3px 2px,#000 0px 3px 5px;
}


.ofCol1{
	color: #003049;/*orange*/
}
.ofCol2{
	color: #003049;/*blue*/
}
.ofCol3{
	color: #4877a5;/*purple*/
}
.ofCol4{
	color: #72406c;/*green*/
}
.ofCol5{
	color: #7b7b7b;
}
.ofCol6{
	color: #7b7b7b;
}





.off_img_type2{
	right: 3.5cqw;
    left: unset;
}
.off_title_type2{
    left: unset;
    right: 26cqw;
}
.off_txt_type2{
    left: unset;
    right: 28cqw;
}
.btn-cancel{
	    display: flex;
    flex-direction: row;
    align-items: center;
    font-size: 14px;
    color: #fff;
    line-height: 31px;
    padding: 0 70px;
    background: #ff4343;
    font-weight: 600;
    width: fit-content;
    margin-top: 10px;
}

.btn-cancel span{
	content: "";
    display: flex;
    flex-direction: row;
    align-items: center;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYBAMAAAASWSDLAAAAKlBMVEVHcEz///////////////////////////////////////////////////+LBpLMAAAADXRSTlMARIcZWCbolAfXwv5JBdBgegAAAEpJREFUGNNjYKASKEbmTDuAxJm7vQFIBhqLNgoKCubeXQzk6Lpcir179+7eu9cOwDlAAFSI4AAV4uAgKwMZgGI0iqXYnFNMFe8CACXIPUMMRnbhAAAAAElFTkSuQmCC);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 18px;
    height: 18px;
    margin-left: 8px;
}
.btn-cancel:hover{
	 background: #ad0000;
}

#banner{
	display: block;
    width: 100%;
    height: auto;
    padding-top: 100px;
    padding-bottom: 80px;
    background-image: url(/hpi/v1/files/banner-bg.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
.banner-container{
	display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
}
.banner-col1{
	display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
	margin-bottom: 20px;
}
.banner-col1 a{
	display: block;
    text-align: center;
    font-size: 20px;
    font-weight: 600;
    color: #72406c;
    margin-bottom: 20px;
	transition: all 0.4s ease-out;
}
.banner-col1 a:hover{
	 color: #c5c6c5;
	 margin-bottom: 20px;
}
.banner-col1 h2{
	font-size: 33px;
    font-weight: 600;
    line-height: 36px;
	text-align: center;
	color: #fff;
	margin-bottom: 20px;
}
.banner-col2{
	display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
}
.banner-txt-btn{
	display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
}
.th-btn-bn{
	position: relative;
    z-index: 2;
    overflow: hidden;
    display: inline-block;
    text-transform: uppercase;
    background-color: #72406c;
    color: #fff;
    font-family: 'Cabin';
    font-size: 16px;
    padding: 15px 30px;
    border-radius: 5px;
    letter-spacing: 0;
    width: fit-content;
	font-weight: 600;
}

.th-btn-bn:before, .th-btn-bn:after{
	content: "";
    position: absolute;
    height: 100%;
    top: 0;
    left: 0;
    width: 50.1%;
    background-color: #003049;
    z-index: -1;
    transition: all 0.4s ease-out;
    border-radius: 0;
}
.th-btn-bn:before{
	transform: scale(0) rotate(0);
}
.th-btn-bn:after{
	transform: scale(0) rotate(0);
    left: unset;
    right: 0;
}
a.th-btn-bn:hover {
	color: #fff !important;
	font-weight: 600;
	transition: all 0.4s ease-out;
}
.th-btn-bn:hover::before, .th-btn-bn:hover:after, .th-btn-bn.active::before, .th-btn-bn.active:after {
    border-radius: 0;
    transform: scale(1) rotate(360deg);
}
/*=================================*/

#thx-txt{
	display: block;
    width: 100%;
    height: auto;
	padding-top: 100px;
    padding-bottom: 100px;
    background: linear-gradient(to bottom, #fbfafb 0%, #ffefde 50%, #fff 100%);
}
.thx-txt-container{
	display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
}
.thx-txt-col1{
	display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
	text-align: center;
}

#thx-txt a{
	color: #003049;
	transition: all 0.5s ease-in-out;
}
#thx-txt a:hover{
	color: #f76e0b;
}
#thx-txt p{
	display: inline-block;
	font-size: 1rem;
    line-height: 1.5rem;
	max-width: 1400px;
}
/*=================================*/
#ukr-services{
	display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
	color: #1d242d;
	padding: 60px 0;
}
.service-list{
	display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin: 0 auto;
    gap: 30px !important;
    margin-top: 30px !important;
    margin-bottom: 30px !important;
    justify-content: center !important;
    flex-wrap: wrap;
}
.ukr-services-title{
	display: block;
	position: relative;
	width: 100%;
}
.ukr-services-title h2{
	font-size: 32px;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 40px;
}
.ukr-service-cards-holder{
	display: flex;
    flex-direction: column;
    align-items: center;
	 width: 100%;
    gap: 50px;
}
.grptype2{
	display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    gap: 50px;
    flex-wrap: wrap;
}
.serv-bg1, .serv-bg2{
	display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    height: auto;
    color: #1C1C1C;
    padding: 20px 15px;
    max-width: 380px;
    border-bottom: 12px solid #ffad45;
    border-top: 15px solid #ffad45;
    border-left: 1px solid #ffad45;
    border-right: 1px solid #ffad45;
    border-radius: 20px;
	box-shadow: 0 0 0 4px rgba(255, 147, 68, 0.15), 0 12px 24px rgba(0, 0, 0, 0.2);
	transform: translateX(80px);
	transition: all 0.8s ease-in-out;
}

.serv-bg1-title{
	display: block;
    margin-top: 60px;
    text-align: center;
	margin-bottom: 20px;
}
.serv-bg1-title h2{
	font-size: 34px;
    font-weight: 700;
    line-height: 50px;
    text-align: center;
    margin-bottom: 20px;
}
.serv-bg1-title p{
	display: block;
    font-size: 16px;
    line-height: 26px;
}
.services-col1{
	display: flex;
    flex: 1 0 50%;
    gap: 25px;
	padding-top: 45px;
    position: relative;
    width: 100%;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
}
.services-col1 h3{
	font-size: 22px;
    font-weight: var(--ukr-font-weight-bold);
    font-family: var(--ukr-font-family-heading2);
    line-height: 28px;
    text-align: left;
}
.services-col1 p{
    font-size: 16px;
    line-height: 20px;
    margin-bottom: 12px;
    font-weight: 600;
	opacity: 0.8;
}
.services-col1 p span{
	display: block;
    font-size: 14px;
    font-weight: lighter;
	font-family: 'Roboto';
}
.services-col1-cont{
	display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
	padding: 30px 20px;
}
.services-txt-content{
	display: block;
    width: 100%;
    margin-bottom: 10px;
}
.services-col1 ul{
	display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    width: 100%;	
}
.services-col1 ul li{
	display: inline-block;
    line-height: 18px;
    font-size: 14px;
    font-weight: 300;
    margin-bottom: 10px;
	font-family: 'Roboto';
}

.services-col2 {
    display: flex;
    position: relative;
	width: 90%;
    aspect-ratio: 700 / 700;
    border-radius: 50%;
    overflow: hidden;
    box-shadow: 4px 5px 11px 5px #ffc451;
}
.services-col2 img {
    position: absolute;
    height: 90%;
    width: 90%;
    top: 5%;
    left: 5%;
    object-fit: cover;
    border-radius: 50%;
}
.service-btn{
    background: linear-gradient(to bottom, #ffffff 0%, #9adbf3 30%, #fff 100%);
	display: flex;
    position: relative;
    width: 100%;
    align-items: center;
    justify-content: center;
	 padding: 80px 0;
}
.mi4{
	margin-right: 4px;
    font-size: 18px;
}
.tfs-button-2 {
  text-align: center;
  margin-top: 0px;
}

.tfs-button-2 .svr-btn {
  display: inline-block;
  padding: 12px 28px;
  font-size: 16px;
  font-weight: bold;
  color: #003049;
  border: 2px solid #003049;
  border-radius: 28px;
  background-color: transparent;
  transition: all 0.3s ease;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  text-decoration: none;
}

.tfs-button-2 .svr-btn:hover {
  background-color: #003049;
  color: #fff;
  /*transform: scale(1.05);*/
  box-shadow: 0 8px 20px rgba(255, 147, 68, 0.3);
}
.tfs-button-2 .svr-btn:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(255, 147, 68, 0.4);
}

/*=================================*/
#ukr-section3, #ukr-section5{
	display: block;
    width: 100%;
    position: relative;
    background: #003049;
    margin: 0 auto;
    padding: 40px 0;
	background: linear-gradient(to bottom, #d4c2a2, #c2ae91);
}
#ukr-section5{
    background: #72406c;
}
.ukr-section3-container{
	display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
    position: relative;
	color: #1d242d;
}
.ukr-section3-tile{
	display: block;
    text-align: left;
    width: 100%;
}
#ukr-section3 h2, #ukr-section5 h2{
	display: block;
    text-align: center;
    font-family: 'Roboto';
    color: #fff;
    font-size: 30px;
    font-weight: 500;
    line-height: 30px;
    padding: 0 30px;
    margin-bottom: 20px;
}
#ukr-section3 h3, #ukr-section5 h3{
	font-size: 18px;
    /*background: #fff;*/
    border-radius: 15px;
    /*font-weight: 600;*/
	padding: 0 30px;
    line-height: 30px;
    text-align: center;
    margin: 0 auto;
    margin-bottom: 32px;
    width: fit-content;
	padding: 0;
}

#ukr-section3-box, #ukr-section5-box{
	display: flex;
	position: relative;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
	max-width: 500px;
    gap: 50px;
}

.circular-hole {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    position: absolute;
    top: 15px;
    right: 15px;
    background: radial-gradient(circle at center, 
        rgba(30, 20, 15, 0.9) 25%, /* Deep center */
        rgba(70, 55, 40, 0.7) 50%, 
        rgba(150, 130, 100, 0.9) 85%, 
        rgba(232, 219, 197, 1) 100% /* Match background */
    );
    box-shadow: 6px 6px 12px rgba(0, 0, 0, 0.3), 2px 3px 3px 0px rgb(0, 0, 0, 0.6);
}
.circular-hole i {
  position: absolute;
    width: 60%;
    height: 60%;
    background: radial-gradient(circle at center, rgba(10, 5, 2, 0.9) 15%, rgba(40, 30, 20, 0.8) 50%, rgba(90, 75, 55, 0.6) 85%);
    border-radius: 50%;
    top: 18%;
    left: 20%;
    box-shadow: inset 4px 4px 10px rgba(0, 0, 0, 0.6);
}
.circular-hole span {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    box-shadow: 
        inset -3px -3px 6px rgba(255, 255, 255, 0.5); 
}

.ukr-section3-box-content, .ukr-section5-box-content{
	display: flex;
    margin-left: 0;
    margin-right: 0;
    overflow: hidden;
    background-color: #fff;
    width: 100%;
    background: linear-gradient(to bottom, #f9eedb, #f4e7d4);
    background-blend-mode: soft-light;
    border-radius: 30px;
    box-shadow: 12px 12px 25px rgba(0, 0, 0, 0.6), -8px -8px 15px rgba(255, 255, 255, 0.6), inset 6px 6px 12px rgba(0, 0, 0, 0.3), inset -6px -6px 12px rgba(255, 255, 255, 0.5);
}
.section3-card{
	display: flex;
    position: relative;
    flex-direction: column;
    align-items: center;
    width: 100%;
    justify-content: flex-start;
    height: 100%;
    padding: 22px;
}
.sect3-bord{
	display: block;
    position: relative;
    width: 100%;
    height: 100%;
    padding: 13px;
    border-radius: 17px;
    background: linear-gradient(to bottom, #e6c15b, #d4ac4a);
    box-shadow: 5px 5px 6px 0px #000;
}

.sect3-bord::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
   /*background: url('https://www.transparenttextures.com/patterns/beige-paper.png');*/ /* Matte texture */
    opacity: 0.1; /* Adjust texture visibility */
}
.section3-title{
	display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    position: relative;
	transition: 0.4s ease-in-out;
	color: #000;
	margin-top: 25px;
}

#ukr-section3-box h3 {
    margin-bottom: 30px;
    font-size: 24px;
    /*font-weight: 500;*/
    display: block;
    text-align: center;
    vertical-align: top;
	width: 72%;
}
#ukr-section5-box h3 {
    margin-bottom: 15px;
    font-size: 22px;
    line-height: 26px;
    font-weight: 500;
    display: block;
    width: fit-content;
}
.section3-description{
	display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    position: relative;
    border-radius: 8px;
    background: linear-gradient(to bottom, #f9eedb, #f4e7d4);
    background-blend-mode: soft-light;
    transition: 0.4sease-in-out;
    color: #1d242d;
    padding: 10px;
    box-shadow: 2px 2px 4px 0px #000;
}
.section3-bottom-line, .section3-top-line{
	display: block;
    width: 70%;
    height: 4px;
    position: absolute;
    background: #72406c;
    bottom: 15px;
}
.section3-top-line{
    top: 15px;
}
#ukr-section3-box p{
	width: 100%;
    text-align: center;
    font-size: 15px;
    line-height: 20px;
    display: inline-block;
	opacity: 0.7;
	padding-bottom: 10px;
}
#ukr-section5-box p{
	width: 100%;
    text-align: center;
    vertical-align: top;
    font-size: 15px;
    line-height: 20px;
    display: inline-block;
    font-weight: 300;
}
#ukr-section3-box p:last-child, #ukr-section5-box p:last-child{
	margin-bottom: 50px;
}
#ukr-section3-box p:last-child{
	margin-bottom: 15px;
}
.sect3-btn{
	display: block;
    position: absolute;
    bottom: 20px;
}
.footer-btn{
	display: block;
    position: absolute;
    bottom: 35px;
}
.gri-btn{
	position: relative;
    z-index: 2;
    overflow: hidden;
    display: flex;
    text-transform: uppercase;
    font-family: 'Cabin';
    font-size: 18px;
    padding: 5px 30px;
    border-radius: 5px;
    letter-spacing: 0;
    width: fit-content;
    font-weight: 600;
    align-items: center;
    flex-wrap: nowrap;
    flex-direction: row;
    transition: 0.3s ease-in-out;
	background-color: #3e3e3e;
    color: #fff;
	margin-top: 20px;
	padding-left: 30px;
    padding-right: 22px;
	cursor: pointer;
}
.org-btn{
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    font-size: 14px;
    color: #fff;
    font-weight: var(--ukr-font-weight-bold);
    font-family: var(--ukr-font-family-buttons);
    background-color: #003049;
    height: 44px;
    border-radius: 22px;
    border: transparent;
    width: 100%;
	cursor: pointer;
	text-transform: uppercase;
	z-index: 2;
	overflow: hidden;
    transition: all 0.5s ease-in-out;
	max-width: 350px;
}
.org-btn i{
	margin-left: 8px;
    font-size: 21px;
}
.org-btn:hover {
    background-color: #f76e0b;
}

/*

.hover_effect.org-btn {
	background-color: #f76e0b;
	border: 1px solid #fff;
}
*/
.arr-set3 svg{
	position: relative;
    margin-left: 10px;
    top: 2px;
	fill: #fff;
    transition: 0.3s ease-in-out;
}
.hover_effect.gri-btn {
	background-color: #717171;
}
.hover_effect .arr-set3 svg{
	margin-left: 14px;
}

.arr-foot svg{
	position: relative;
    margin-left: 10px;
    top: 2px;
	fill: #fff;
    transition: 0.3s ease-in-out;
}

.hover_effect .arr-foot svg{
	margin-left: 14px;
}

.section3-bg{
	display: block;
    margin: 0 auto;
    margin-top: 20px;
    width: 80%;
    text-align: center;
}
.section3-bg a{
	color: #fff;
    font-size: 16px;
}
.section3-bg a span{
	text-decoration: underline;
}
.section3-bg a:hover{
	color: #dcd3d3;
}
.aw-s3{
    display: inline-block;
    position: relative;
    padding-left: 4px;
    font-size: 26px;
    text-decoration: none;
    top: 4px;	
}
/*=================================*/
#ukr-section4{
	display: block;
    width: 100%;
    position: relative;
	background-color: #f8faff;
    margin: 0 auto;
    padding: 100px 0;
}

.ukr-section4-colums{
	display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    position: relative;
    margin: 0 auto;
	gap: 30px;
	max-width: 520px;
}
.ukr-section4-container{
	display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
    position: relative;
	color: #1d242d;
	gap: 15px;
}
.ukr-section4-tile{
	display: block;
    text-align: left;
    width: 100%;
}
.ukr-section4-tile h2{
	display: block;
    font-size: 32px;
    line-height: 38px;
    text-align: center;
    color: #003049;
    font-family: var(--ukr-font-family-heading2);
	font-weight: var(--ukr-font-weight-bold);
    margin-bottom: 40px;
}
.ukr-section4-tile p{
	font-size: 17px;
    font-weight: var(--ukr-font-weight-medium);
    margin-bottom: 40px;
    color: #1C1C1C;
    opacity: 0.9;
}

#ukr-section4 h3{
	font-size: 18px;
    background: #fff;
    border-radius: 15px;
    font-weight: 600;
    line-height: 30px;
    padding: 0 30px;
    text-align: center;
    margin: 0 auto;
    margin-bottom: 32px;
    width: fit-content;
	color: #1C1C1C;
}
#ukr-section4-box{
	display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
    position: relative;
	margin-top: 20px;
}

#ukr-section4-box p{
	width: 100%;
    font-size: 20px;
    line-height: 30px;
    font-weight: 500;
    text-align: justify;
    font-size: 17px;
    line-height: 24px;
    margin-bottom: 12px;
    font-weight: 600;
    opacity: 0.8;
}
.ukr-section4-col2{
	display: flex;
    width: 100%;
    margin: 0 auto;
    vertical-align: middle;
    align-items: center;
    gap: 15px;
    overflow: hidden;
    justify-content: space-around;
    flex-wrap: wrap;
}
.ukr-section4-col2-img{
	display: flex;
    position: relative;
    width: 80px;
    height: 80px;
    background: #fff;
    overflow: hidden;
    border-radius: 10px;
    padding: 8px;
    align-items: center;
    justify-content: center;
}
.ukr-section4-col2-img img{
	position: relative;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
}
.section4-btn{
	display: block;
    position: relative;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    margin-top: 30px;
}
.white-btn{
	position: relative;
    z-index: 2;
    margin: 0 auto;
    overflow: hidden;
    display: flex;
    text-transform: uppercase;
    font-family: 'Cabin';
    font-size: 22px;
    padding: 12px 30px;
    border-radius: 5px;
    letter-spacing: 0;
    width: fit-content;
    font-weight: 600;
    align-items: center;
    flex-wrap: nowrap;
    flex-direction: row;
    transition: 0.3s ease-in-out;
    background-color: #fff;
    color: #212325;
    margin-top: 20px;
    padding-left: 30px;
    padding-right: 22px;
}

.arr-set4 svg{
	position: relative;
    margin-left: 10px;
    top: 4px;
	fill: #212325;
    transition: 0.3s ease-in-out;
}
.hover_effect.white-btn {
	background-color: #212325;
	color: #fff;
}
.hover_effect .arr-set4 svg{
	margin-left: 14px;
	fill: #fff;
}
/*=================================*/
#ukr-section6{
	display: block;
    position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 100px 0;
	background-image: url(/hpi/v1/files/bg-setciton4.png);
	background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
	border-top-right-radius: 8rem;
    padding-top: 170px;
	/*background: linear-gradient(to bottom, #ffffff 0%, #fbfafb 50%, #fff 100%);*/
	
}
.ukr-section6-container{
	display: block;
    width: 100%;
}
#ukr-section6-box{
	display: block;
    width: fit-content;
	border: 2px dashed #003049;
    padding: 14px;
    border-radius: 6px;
}
#ukr-section6-box p{
	width: 100%;
    text-align: center;
    vertical-align: top;
    font-size: 16px;
    line-height: 20px;
    display: inline-block;
    padding-bottom: 10px;
}
#ukr-section6-box a{
	color: #0174f8;
    padding-left: 3px;
    text-decoration: underline;
}
#ukr-section6-box a:hover{
	color: #004a7c;
    text-decoration: none;
}
/*=================================*/
#ukr-section7{
	display: block;
    position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 100px 0;
    z-index: 2;
    background: #fff;
}
#ukr-section7-box{
	display: block;
    position: relative;
    width: 100%;
    margin: 0 auto;
}
.ukr-section7-box-content{
	display: flex;
    position: relative;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
}
.section7-card1{
	display: flex;
    position: relative;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
    margin: 0 auto;
    padding-bottom: 60px;
}
.section7-card2{
	display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
	gap: 60px;
}
#ukr-section7-box h2{
	display: block;
    text-align: left;
	color: #807b84;
    font-size: 44px;
    font-weight: var(--ukr-font-weight-medium);
    font-family: var(--ukr-font-family-heading3);
    line-height: 1;
}
.section7-card1 h2{
	margin-bottom: 27px;
}
.section7-card1 p{
	display: block;
    font-size: 16px;
    text-align: left;
    width: 100%;
    max-width: 500px;
    padding-bottom: 20px;
}
.lat-line{
	display: flex;
    align-items: center;
    flex-direction: row;
    flex-wrap: nowrap;
    width: 100%;
    text-align: center;
    margin: 0 auto;
	line-height: 28px;
	margin-bottom: 40px;
}
.lat-line::before{
	content: "";
    display: inline-block;
    position: relative;
    background: #ccc;
    width: calc(50% - 285px);
    height: 1px;
    margin-right: 25px;
    vertical-align: middle;
}
.lat-line::after{
	content: "";
    display: inline-block;
    position: relative;
    background: #ccc;
    width: calc(50% - 285px);
    height: 1px;
    margin-left: 25px;
    vertical-align: middle;
}
.four-step{
	display: flex;
    position: relative;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
	gap: 40px;
}
.four-step-box{
	display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    vertical-align: middle;
    width: 100%;
    text-align: center;
    gap: 15px;
    box-shadow: 0 4px 12px rgb(255 147 68 / 60%);
    border-radius: 16px;
    overflow: hidden;
    padding: 25px 0 35px 0;
    max-width: 490px;
}
.four-step-box img{
    display: block;
    position: relative;
    width: 100%;
    margin: 0 auto;
    max-width: 225px;
    height: auto;
    margin-bottom: 25px;
    border-radius: 50%;
    /* border: 1px solid #003049; */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}
.four-step-box h3{
	display: block;
    width: 100%;
    font-size: 24px;
    font-family: var(--ukr-font-family-heading3);
    font-weight: var(--ukr-font-weight-medium);
	color: var(--ukr-background-color-base);
}
.four-step-box p{
	display: block;
    width: 70%;
    font-size: var(--ukr-font-size-base);
    font-weight: var(--ukr-font-weight-regular);
	opacity: 0.8;
}
/*=================================*/

.ukr-section8{
	display: block;
    position: relative;
    width: 100%;
	background-color: #edf8f1;
    margin: 0 auto;
    padding: 100px 0;
}
.ukr-section8-box{
	display: flex;
    position: relative;
    width: 100%;
    margin: 0 auto;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    gap: 30px;
    justify-content: space-around;
}
.ukr-section8-tile{
	display: block;
    position: relative;
    width: 100%;
    text-align: center;
    margin: 0 auto;
}
.ukr-section8-tile h2{
	display: block;
    font-size: 32px;
    line-height: 38px;
    text-align: center;
    color: #003049;
    font-family: var(--ukr-font-family-heading2);
    margin-bottom: 40px;
}
.ukr-section8-tile h3{
	font-size: 20px;
	margin-bottom: 25px;
	line-height: 1.2;
	font-weight: var(--ukr-font-weight-medium);
    font-family: var(--ukr-font-family-heading);
}

.ukr-section8-box-content{
	display: flex;
    position: relative;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    gap: 24px;
}

.section8-card1 {
	position: relative;
	width: 100%;
    max-width: 350px;
	background: #111;
	border: 1px solid #003049;
	border-radius: 8px;
	color: #fff;
	overflow: hidden;
	padding: 20px;
	background: linear-gradient(135deg, #2c2c2c 50%, #000000 50%);
	box-shadow: 0 0 15px rgba(0,0,0,0.4);
}

.section8-card1::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(135deg, rgba(255,255,255,0.05) 50%, transparent 50%);
	pointer-events: none;
	z-index: 1;
}

.section8-card1 div:first-of-type{
	display: block;
    position: absolute;
    top: 0;
	left: 30%;
    width: 40%;
    margin: 0 auto;
    height: 14px;
    background-color: #000;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}

.sect8-title h4 {
  font-size: 14px;
  color: #ccc;
  margin: 0;
  margin-bottom: 10px;
  border-bottom: 1px solid #444;
  padding-bottom: 5px;
}

.sect8-offer h4 {
    display: block;
    width: 100%;
    color: #807b84;
    font-size: 22px;
    border-bottom: 2px solid #003049;
    font-weight: var(--ukr-font-weight-bold);
    font-family: var(--ukr-font-family-buttons);
    margin-bottom: 15px;
}

.sect8-offer h3 {
	display: block;
	font-size: 43px;
	text-align: center;
	line-height: 1;
	margin-top: 40px;
	color: #003049;
	margin-bottom: 10px;
	font-family: var(--ukr-font-family-heading);
}
.sect8-offer h3 span{
	display: block;
	text-align: center;
	color: #807b84;
    font-size: 22px;
    font-weight: var(--ukr-font-weight-medium);
    font-family: var(--ukr-font-family-heading3);
    line-height: 1;
}

.sect8-offer p {
	display: block;
    width: 100%;
    color: #807b84;
    font-size: 15px;
    line-height: 16px;
}

.sect8-list1 ul {
	padding: 0;
	display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    width: 100%;
    margin: 20px auto;
}

.sect8-list1 ul li {
	font-size: 16px;
	color: #cecdcd;
	display: flex;
	align-items: center;
}

.sect8-list1 ul li i {
	margin-right: 8px;
	font-size: 22px;
}
.sect8-list1 ul h4{
	font-size: 16px;
    font-family: var(--ukr-font-family-heading);
    font-weight: var(--ukr-font-weight-medium);
}
.section8-btn {
	display: block;
    position: absolute;
    bottom: 20px;
}

.section8-btn .org-btn {
	display: inline-block;
	background-color: #003049;
	color: #fff;
	font-weight: bold;
	padding: 0 25px;
    height: 44px;
    line-height: 44px;
    border-radius: 22px;
	text-decoration: none;
	text-transform: uppercase;
	transition: background 0.3s ease;
}

.section8-btn .org-btn:hover {
  background-color: #e26600;
}

.sect8-list1 .mi8a{
	color: #f75454;
}
.sect8-list1 .mi8{
	color: #003049;
}

.section8-back-info{
	display: block;
    position: relative;
    margin: 0 auto;
    text-align: center;
    width: 100%;
	margin-top: 15px;
}
.section8-back-info p{
	font-size: 16px;
    padding-bottom: 5px;
    font-weight: 600;
    opacity: 0.7;
    
}
.section8-btn{
	display: block;
    position: relative;
    margin: 0 auto;
}

#up-arrow{
	display: block;
	position: relative;
	width: 100%;
	margin: 0 auto;
}

#up-arrow>div{
	display: flex;
	position: relative;
	width: 100%;
	margin: 0 auto;
	justify-content: center;
	transform: translateY(28px);
	align-items: flex-end;
}
#up-arrow span{
	display: flex;
	position: relative;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAAwCAMAAAB64Ok7AAACLlBMVEVHcEx+mKW2uboQg7gVksrX4+gTldAUib0SdaIeoduYp66YmpsSh70NjcoQfrEQh74dhrUcj8IqntGfpamSnqPHycqys7OxsrK3ubqys7S/wMCjpqjFxsezt7kSf7IRmdYheaEVjsQdgKshj78Qe6wLi8mrrKwilsmjpKWgoaIWnNeZmpuKkpa5ubkvo9epqqu6ubmjpKWtv8igpKews7S0t7qgoaESltETfKsRmtgReqoTjsUNjssUeKYUiL0Pe60SeaYUkssQbpoSgLO8vLy/2eQOh70dgq8YdZ/S09Iei7w6j7MmotWio6QzseMtlsMlothEoMipqqosseY0ptcvr+KcnZ+mp6fDxMW1tra1tbWnqKq5ubi+vr62uLjLy8vAwcG1trfR0dIQks4SdqMOicMQkswUkskPjMdcqcgendYNhr88sN+ErLwVndlErdgsnNA1ncuhqKyXmJgmte7DxMTCwsOtr7BWrtGIq7qurq+9vr5zrcarrKyysrLAwcHO0NAOj80OlNIPltUNktEKisgPl9YOldQPmdgQm9oLjMsTmNUTl9QLi8kZot4Nkc/Hx8jX19cTltMMjswOjcoJiMbf4OAzv/XQ0NHY2drc3d21t7jU1NXLy8wVn9wWm9fj4+Qhp+ERk88gpN/BwcIUndrExcbOzs8RldMpvfYluvQanNcqruYrtu2pqqu6u7va29u9vsA0ue6ur7Axu/Hn5+iXqLAJg7+6s7F8s8n/zucRAAAAgXRSTlMAAgmRtwXJWx3+HS+D8nGySTS6hEvP/W7KkrhZ3ido6waYJlJi97+OJJ/r/RQa1ov30D2vrJ7w3Sn0TYj8DGpdPr8WfU8ynSwT+HkMn3HJR+AkPOSLrN798sJdaO/igb6DWNz2L9rRpt+87sN31vVP0Gqc0Oyr6+Xw99Z2PNvMj/MRSnWXAAADnklEQVRIx52W91cTWRTHHyGFEJpILwILCCzSEcu6olgowgqCvbu9r27X3XXfZFJnUiYZUic9zAQiXXf1v/O9xHM8IgmZuT+8yTtzPu/ed+/33gkAQHEuD0i2vOuX0s+eHgmnVA/j9Wzl5GTlWdHwnVuNANzw+FyuDaFaJNsXEOqArMHrCoddzLVOcbDm76oR2aA9Ddv3i3StGdnW3Oc5Xzjs4+wHxV66fv2fG5ser8/nFeKiYdC1PvQ7L3CcwPu7RMOHHvdfqYrb7XH/WoX4Umtu+bvX/P7tq11SZFYR9/98pbt7RppSb9p/G1jvvyRR4n2BAOPja2XS+qNGYMIurk4aPRP3eDkP86skuLOKFwJXb/vuSaIPbtoDVfV3vZ1S4P1+XohXN/qeSKrWut0TqAUP7kpgZdcFD8MNg3tMoQiqObUW1sQ3AxuuOtDIPM2dLZtvRWtjQ4BfG+FeVALwYKM+Z7hjZWUBKCoZfntI0/Di3x5ZA1OTM1weeb58+a/+zQHUjYddzKCstu72Hv3xcYtS/uX5cwBcmI06nrvn/3yJp1c9572PjqjNzn6gDC6ZgvQgAHNq+H901b36agBn7ZoXDd/CQ1nZ1iaT0WgKqdDPi0FoWXQ+c6/8gStUw93Zq4E+Mhn1eiN1Em8eLkFogazVvfzJHABD/OHsbMFpk16vpaip1G7BBKMstFnoLfcvPyKJDmeva5NJr9VSdNGbZFPQAc02GwtR6N9VrD3KJiccstZA0fnpvaKXcFJRnRPaIBtDof/Xl5k9qsRuCb3jDQsUP5EwlNBZzE4IzaGt5dXvM6b65LEUSyfy3xat7UzL6XYdwlnIRp+5V7/OkCk5DvldNm0HLDpdindG3CuXL+zCqppwlg27sIg2Y9wCE+bk1vL0+5pKu0VsNH+Xkw84Mc6qk6x8+uJOKRcdS7k1kHS0aNc7jZ4w6xYX2Zj6w307JKU6glAcMkHZzmRI5vFiTMOY9V26TGkyarXYLUHDkoxlPPWVcyfd3Ko0GjFpIMgEfaIti4DGSlGPLLJq6w+qVLzjRUeMegMmCZKkHcXHs8u+pBg5t6hjwY59qpYvEqmLEhglKOLzz/YaKwXn2806XTJiXaJJhJAps5EOiiydyGEqFZR8226hI7FgKGFDBiFEKPVpSa5TraCttFgdQd5DlMNBh5LBkPyomC/A2GjpN5FIzIotKT8l+gsyUdZR3jvbWz41DiT92chTyBRZXr8GMV1Wh2Gi5DYAAAAASUVORK5CYII=);
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	background-size: contain;
    width: 60px;
    aspect-ratio: 60 / 48;
}

#up-arrow b{
	font-size: 20px;
	color: #003049;
	line-height: 1;
	background-color: #fff;
	transform: translate(-30px, -15px);
}
#up-arrow sup{
	
}



/*=================================*/
#ukr-section9{
	display: block;
    position: relative;
    width: 100%;
    background-image: url(/hpi/v1/files/bg-setciton4.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
	margin: 0 auto;
    padding: 50px 0;
}
#ukr-section9-box{
	display: block;
    position: relative;
    width: 100%;
   
}
.ukr-section9-box-content{
	display: block;
    position: relative;
    width: 100%;
}
.section9-card{
	display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    max-width: 800px;
    border: 2px solid #444;
    padding: 25px 0;
    border-radius: 6px;
	color: #707070;
	margin: 0 auto;
}
.section9-card h2{
	font-size: 28px;
    margin-bottom: 20px;
    font-weight: 500;
	line-height: 1;
	text-align: center;
	padding: 0 15px;
}
.section9-card p{
	font-size: 16px;
    line-height: 30px;
	
	text-align: center;
	padding: 0 15px;
}
.section9-card a{
	color: #003049;
    font-weight: bold;
}
.section9-card a:hover{
	color: #f76e0b;
}

/*=================================*/

#ukr-section10{
	display: block;
    position: relative;
    width: 100%;
	margin: 0 auto;
}
.ukr-section10-content{
	display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    width: 100%;
}
.ukr-section10-row1{
	display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    background: linear-gradient(135deg, #f25c2c, #003049);
    padding-top: 60px;
    padding-bottom: 70px;
    border-top-right-radius: 5rem;
}
.ukr-section10-row1 h2{
	font-size: 28px;
    line-height: 34px;
    text-align: center;
    margin-bottom: 35px;
    color: #fff;
    font-weight: var(--ukr-font-weight-bold);
    font-family: var(--ukr-font-family-buttons);
}
.ukr-section10-row1 p{
	font-size: 20px;
    line-height: 24px;
    text-align: center;
	margin: 0 auto;
    margin-bottom: 35px;
    color: #fff;
    font-weight: 500;
    font-family: var(--ukr-font-family-heading);
	max-width: 768px;
}
.ukr-section10-btn{
	display: flex;
    position: relative;
    justify-content: center;
    width: 100%;
    margin-top: 70px;
}
.wth-btn{
	display: inline-block;
    background: #fff;
    color: #f25c2c;
	font-size: 17px;
    font-weight: 600;
    padding: 12px 24px;
    border-radius: 6px;
    text-decoration: none;
    transition: background 0.3s ease;
}
.wth-btn:hover{
	background: #f0f0f0;
}
.ukr-section10-row2{
	display: block;
    width: 100%;
    border-top-left-radius: 5rem;
    background-color: #f2f2f2;
    padding: 60px 0;
}
.ukr-section10-row2 p{
	display: block;
    margin: 0 auto;
    width: 100%;
	font-size: 15px;
    max-width: 600px;
    margin-top: 30px;
    font-weight: var(--ukr-font-weight-medium);
    font-family: var(--ukr-font-family-heading);	
}
.ukr-section10-row2 a{
	color: #fc853e;
    font-style: normal;
}
.ukr-section10-row2 a em{
    font-style: normal;
}
.ukr-section10-row2 a:hover{
	color: #be5000;
    text-decoration: underline;
}
.ukr-section10-row2 ul{
	display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    width: 100%;
	color: #807b84;
	font-size: 25px;
    line-height: 30px;
	overflow: hidden;
    flex-wrap: nowrap;
}
.ukr-section10-row2 ul li{
	display: inline-block;
    position: relative;
    height: 100%;
    color: #807b84;
}
.ukr-section10-row2 ul li a{
	font-size: 20px;
    line-height: 30px;
    text-align: center;
    font-weight: var(--ukr-font-weight-bold);
    font-family: var(--ukr-font-family-buttons);
	color: #807b84;
	transition: color 0.5s ease;
}
.ukr-section10-row2 ul li a:hover{
	
}
/*=================================*/

#ukr-info{
	display: block;
    position: relative;
    width: 100%;
	padding: 40px 0;
}
.ukr-info-container{
	display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
    position: relative;
	color: #1d242d;
}
.ukr-info-tile{
	display: block;
    text-align: left;
    width: 100%;
    margin-bottom: 20px;
}
#ukr-info h2{
	font-size: 28px;
    font-weight: 600;
    text-align: center;
}
#ukr-info-box{
	display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
    position: relative;
	margin-top: 20px;
}
.ukr-info-bg{
	display: block;
    margin: 0 auto;
    margin-top: 30px;
    width: 100%;
    text-align: center;
    border: 1px solid #003049;
    border-radius: 6px;
    padding: 15px;
}
.ukr-info-bg p{
	display: block;
    width: 100%;
    text-align: center;
    font-size: 16px;
    margin: 0 auto;
	opacity: 0.6;
}
.ukr-info-bg a{
	color: #003049;
}
.ukr-info-bg a:hover{
	color: #212325;
	font-size: 16px;
}
.ukr-info-box-content{
	display: flex;
	margin-left: 0;
	margin-right: 0;
    overflow: hidden;
	background-color: #003049;
	border: 1px solid  #e6e6e6;
	border-radius: 10px 10px 10px 10px;
	border-radius: 10px;
	width: 100%;
	margin-bottom: 20px;
}
.ukr-info-card{
	display: flex;
    position: relative;
    flex-direction: column;
    align-items: center;
    width: 100%;
    justify-content: flex-start;
	height: 100%;
    padding: 0 20px;
    padding-top: 40px;
    padding-bottom: 15px;
}
.ukr-info-card:before{
	content: '';
    height: 100%;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    background-color: #fff;
    border: 1px solid #e6e6e6;
    border-radius: inherit;
    z-index: 0;
    transition: 0.4s ease-in-out;
}
.hover_effect .ukr-info-card:before{
    transform: translate(100%, 0px);
}
.ukr-info-img{
	display: flex;
	position: relative;
	color: #622100;
	background-color: #003049;
	border: 0;
    width: 100px;
    height: 100px;
    margin: 0;
    align-self: center;
	border-radius: 50%;
	text-align: center;
	background-clip: inherit;
	z-index: 1;
	align-items: center;
    justify-content: center;
	font-size: 50px;
    line-height: 1;
    font-style: normal;
    font-weight: 600;
	transition: 0.4s ease-in-out;
	opacity: 0.6;
}
.hover_effect .ukr-info-box-content{
	color: #1d242d;
}
.hover_effect .ukr-info-img{
	background-color: #1d242d;
	color: #fff;
}
.ukr-info-title{
	display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    position: relative;
    margin-top: 35px;
    margin-bottom: 15px;
	transition: 0.4s ease-in-out;
	color: #1d242d;
}
.hover_effect .ukr-info-title{
	color: #fff;
}
#ukr-info-box h3 {
    margin-bottom: 10px;
    font-size: 22px;
    font-weight: 600;
    display: block;
    text-align: center;
	vertical-align: top;
}
.ukr-info-description{
	display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    position: relative;
    margin-top: 5px;
    margin-bottom: 10px;
	transition: 0.4s ease-in-out;
	color: #1d242d;
}
.hover_effect .ukr-info-description{
	color: #fff;
}
#ukr-info-box p{
    width: 100%;
    text-align: center;
    vertical-align: top;
    font-size: 16px;
    line-height: 26px;
    display: inline-block;
}

/*----------------------------*/

 #ukr-faqs {
    display: block;
    width: 100%;
    position: relative;
    margin: 0 auto;
    padding: 100px 0;
}

.ukr-faqs-container {
	display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    position: relative;
    margin: 0 auto;
    gap: 30px;
}
.ukr-faqs-colums{
	display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    position: relative;
    margin: 0 auto;
    gap: 30px;
}
.ukr-faqs-tile{
	width: 100%;
    margin: 0 auto;
	text-align: center;
}
.ukr-faqs-tile h2 {
	display: block;
    font-size: 32px;
    line-height: 38px;
    text-align: center;
    color: #003049;
    font-family: var(--ukr-font-family-heading2);
    font-weight: var(--ukr-font-weight-bold);
    margin-bottom: 40px;
}
.ukr-faqs-tile p {
	font-size: 18px;
    font-weight: var(--ukr-font-weight-medium);
	font-family: var(--ukr-font-family-heading);
    color: #1C1C1C;
    opacity: 0.9;
}
.ukr-faqs-content{
	display: block;
    width: 100%;
    max-width: 800px;
}

.faq-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.faq-list li{
	
}

.tips-sect{
	display: block;
    width: 100%;
}
.tips-sect h3{
	font-size: 22px;
    line-height: 1;
    text-align: center;
    border: 1px solid #003049;
    padding: 12px 0;
    background: #003049;
    color: #fff;
    border-radius: 6px;
    margin-bottom: 20px;
    margin-top: 25px;
}
.faq-question {
  background: white;
  border: 2px solid #003049;
  border-radius: 8px;
  padding: 15px;
  width: 100%;
  text-align: left;
  font-weight: bold;
  color: #00544f;
  font-size: 16px;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  transition: background 0.3s;
}

.faq-question.active {
	background-color: #d5e8f3;
}

.faq-question .faq-icon {
  transition: transform 0.3s ease;
  font-size: 1.2em;
}
.faq-question.active .faq-icon {
  transform: rotate(180deg);
}

/*
.faq-question:not(.active) .faq-icon {
  transform: rotate(180deg);
}
*/
.faq-answer {
  padding: 0 15px 15px;
  display: none;
  /*background: #ffffff;*/
  border-left: 2px solid #003049;
  border-right: 2px solid #003049;
  border-bottom: 2px solid #003049;
  border-radius: 0 0 8px 8px;
  color: #1C1C1C;
  margin-bottom: 15px;
}
.faq-answer p {
	font-size: 16px;
	
}
.faq-answer.show {
  display: block;
}

/*----------------------------*/
/* ========= Simle report =========== */

#simple-report{
	display: block;
    width: 100%;
    position: relative;
    margin: 0 auto;
   /*
    padding: 100px 0;
    background-color: #f8faff;
    */
}
.simple-report-cont{
    width: 100%;
    margin: 0 auto;
    max-width: 1440px;
    padding: 0 15px;
}
#repeat-check{
	display: block; /*display: none;*/
    position: relative;
    width: 100%;
    /*max-width: 800px;*/
    margin: 0 auto;
    text-align: center;
    margin-bottom: 100px;
	border-bottom: 2px solid #ffffff;
    padding: 150px 15px;
    background-color: #f8faff;
	/*opacity: 0;*/
	animation: fadeIn 0.8s ease-in-out;
}

.repeat-check-content{
	display: flex;
    flex-direction: column;
    align-items: center;
    gap: 50px;
    width: 100%;
}
.repeat-check-title{
	display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
    width: 100%;
}
.repeat-check-title h1{
	font-size: 26px;
    line-height: 28px;
    font-family: var(--ukr-font-family-heading);
    font-weight: var(--ukr-font-weight-medium);
    margin-bottom: 15px;
    color: #a70000;
}
.repeat-check-title p{
	font-size: 16px;
    line-height: 20px;
    font-family: var(--ukr-font-family-heading2);
    font-weight: var(--ukr-font-weight-regular);
}
.repeat-check-form{
	display: flex;
    position: relative;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    margin: 0 auto;
}
#repeat-check .vrm-field input {
    border: none;
    background-color: #ffe207;
    padding: 0 15px;
    font-size: 48px !important;
    line-height: 48px;
    width: 100%;
    margin: 0;
    font-weight: var(--ukr-font-weight-medium);
    border-radius: unset;
    font-family: var(--ukr-font-family-heading3);
    text-align: center;
    max-width: 250px;
    box-sizing: border-box;
    text-transform: uppercase;
	color: inherit;
    position: relative;
    top: 3px;
}

#report-out-data{
	display: block; /*display: none;*/
    position: relative;
    width: 100%;
    /*max-width: 800px;*/
    margin: 0 auto;
    text-align: center;
    margin-bottom: 100px;
    background-color: #f8faff;
	border-bottom: 2px solid #ffffff;
    padding: 150px 15px;
    padding-top: 50px;
	/*opacity: 0;*/
	animation: fadeIn 0.8s ease-in-out;
}
.sim-report-content{
	display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
	gap: 60px;
	flex-wrap: nowrap;
}
.valid-vrm{
	display: flex;
    position: relative;
    width: 100%;
    height: calc(100vh - 180px);
    height: calc(100dvh - 180px);
    text-align: center;
    margin: 0 auto;
    justify-content: flex-start;
    flex-direction: column;
    align-items: center;
    gap: 30px;
    /*margin-bottom: 80px;*/
}
.vrm-valid-data{
    display: flex;
    position: relative;
    width: 100%;
    text-align: center;
    margin: 0 auto;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}
.vrm-valid-field{
	display: flex;
    align-items: center;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    border: 2px solid #000;
    border-radius: 8px;
    background-color: #FCBF49;
    height: 76px;
    width: 100%;
    max-width: 320px;
}
.vrm-valid-field div{
	display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
    align-items: center;
	padding: 8px 10px 3px 10px;
    height: 100%;
	width: 60px;
    border-right: 2px solid #000;
    justify-content: center;
}
.vrm-valid-field .uk-flag{
    display: flex;
    position: relative;
    width: 35px;
    height: 25px;
    background-image: url(/hpi/v1/files/uk-flag.png);
    background-repeat: no-repeat;
    background-position: center;
	
}
.vrm-valid-field .uk-txt{
	font-size: 22px;
    font-weight: var(--ukr-font-weight-bold);
    font-family: var(--ukr-font-family-heading3);
    text-align: center;
    line-height: 1;
}
.vrm-valid-field h2{
	border: none;
   /* background-color: #FCBF49;*/
    padding: 0 15px;
	font-size: 46px !important;
    line-height: 46px; 
    width: 100%;
    margin: 0;
    font-weight: var(--ukr-font-weight-medium);
    border-radius: unset;
    font-family: var(--ukr-font-family-heading3);
	text-align: center;
	max-width: 250px;
	box-sizing: border-box;
	text-transform: uppercase;
	top: 2px;
    position: relative;
}
#report-date{
    display: block;
    position: relative;
    font-size: 15px;
    font-weight: var(--ukr-font-weight-bold);
    font-family: var(--ukr-font-family-heading2);
    text-align: center;
    margin-top: 10px;
}
#vehicle-full-model{
    width: fit-content;
    display: block;
    position: relative;
    font-size: 18px;
    font-weight: var(--ukr-font-weight-medium);
    font-family: var(--ukr-font-family-heading2);
    text-align: center;
    margin-top: 18px;
    color: #fff;
    background: #000;
    padding: 10px 15px;
}
.vrm-valid-txt{
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;

}
#small-section{
    width: 100%;
    margin: 0 auto;
    
}
.small-info-conatiner{
    display: flex;
    position: relative;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
}
#vehicle-logo{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
   /* margin-top: 15px;*/
    overflow: hidden;
}
#vehicle-logo img{
    display: block;
    position: relative;
    width: 110%;
    max-width: 700px;
    top: 0px;
}
.logo-title-image{

}

.sim-report-data{
	display: block;
    position: relative;
    width: 100%;
    margin: 0 auto;
}
.sim-report-data-content{
	display: flex;
	flex-direction: column;
    position: relative;
    width: 100%;
    margin: 0 auto;
    justify-content: center;
	flex-wrap: nowrap;
	gap: 30px;
}
.sim-report-data-title{
	display: flex;
    position: relative;
    width: 100%;
    margin: 0 auto;
    justify-content: center;
    flex-direction: column;
	flex-wrap: nowrap;
	gap: 15px;
	align-items: center;
}
.sim-report-data-title h1{
    font-size: 36px;
    line-height: 1;
    font-family: var(--ukr-font-family-base);
    font-weight: 900;
    margin-bottom: 0;
}

.sim-report-data-title span{
	color: #E63946;
}
.sim-report-data-title h3{
    font-size: 20px;
    line-height: 1;
    font-family: var(--ukr-font-family-base);
    font-weight: var(--ukr-font-weight-bold);
}
.sim-report-data-title p{
	font-size: 16px;
    line-height: 20px;
    font-family: var(--ukr-font-family-heading2);
    font-weight: var(--ukr-font-weight-regular);
}
.sim-report-btn{
	display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-width: 400px;
    margin-top: 10px;
}
#sim-report-data button{
	
}
.dwn-btn{
	display: flex;
    position: relative;
    flex-direction: row;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
    text-align: center;
    height: 46px;
    border-radius: 8px;
    border: transparent;
    overflow: hidden;
    color: #fff;
	cursor: pointer;
    font-size: 20px;
    font-weight: var(--ukr-font-weight-bold);
    font-family: var(--ukr-font-family-buttons);
    justify-content: center;
}
#dwn-sim-report{
	background-color: #f17373;
}
#dwn-sim-report:hover{
	background-color: #a34e4e;
}
#dwn-sim-report i {
    margin-right: 8px;
    font-size: 20px;
}
#redirect-full-report{
	background-color: #17A628;
    margin-top: 15px;
}
#redirect-full-report:hover{
	background-color: #146219;
}
#redirect-full-report i{
	margin-right: 8px;
    font-size: 20px;
}

.fdw-btn, .dw-btn{
    display: flex;
    position: relative;
    flex-direction: row;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
    text-align: center;
    height: 46px;
    border-radius: 8px;
    border: transparent;
    overflow: hidden;
    color: #fff;
    background-color: #17A628;
	cursor: pointer;
    font-size: 20px;
    font-weight: var(--ukr-font-weight-bold);
    font-family: var(--ukr-font-family-buttons);
    justify-content: center;
}
.dw-btn{
    max-width: 400px;
}
.fdw-btn:hover, .dw-btn:hover{
    background-color: #146219;
}
.fdw-btn:active, .dw-btn:active{
    background-color: #146219;
    top 2px;
}
.simple-link{

}
.simple-link:hover{
    
}

.sim-out-data{
	display: flex;
    position: relative;
    flex-direction: column;
    align-items: center;
    width: 100%;
    gap: 60px;
}

.vehicle-section {
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    /* border-bottom: 1px solid #bbb;*/
	/*margin-bottom: 70px;
	background-color: #fafafa;
	border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
	*/
}
/*
.dividing-line{
    display: block;
    position: relative;
    width: calc(100% + 30px);
    left: -15px;
    height: 1px;
    background-color: #838383;
    margin-top: 110px;
}*/
.vhs-title-section{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    margin-bottom: 50px;
}

.vhs-title-section h2 {
    margin: 0 auto;
    margin-top: 0;
    font-size: 15px;
    line-height: 1;
    color: #fff;
    font-weight: var(--ukr-font-weight-bold);
    font-family: var(--ukr-font-family-buttons);
    text-transform: uppercase;
    background: #E63946;
    padding: 5px 15px;
    position: relative;
    width: calc(100% + 30px);
    left: -15px;
    margin-bottom: -2px;
}
.bardiv{
    width: calc(100% + 30px);
    display: none;
    position: relative;
    margin: 0 auto;
    left: -15px;
    height: 4px;
    background-color: #E63946;
}
.vhs-content-section, .vhs-content-section-col1 {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
}
.vhs-content-section-SM2V, .vhs-content-section-SM2O {
     display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    width: 100%;
    gap: 40px;
}
.vhs-content-section-SM2O p{
    width: 100%;
}
.vhs-col-section{
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
}
.vhs-col-section p{
    font-size: 14px;
   /* font-family: var(--ukr-font-family-heading);*/
    font-weight: var(--ukr-font-weight-regular);
    text-align: left;
    width: 100%;
}
.vhs-col1-section{
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 40px;
    overflow: hidden;

}
.sml-col1-section{
    display: flex;
    width: 60%;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    overflow: hidden;
}
.sml-col2-section{
    display: flex;
    width: 100%;
    max-width: fit-content;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border-radius: 6px;
    border: 2px dotted #1C1C1C;
}

.vhs-col1-section > div{
    display: flex;
    width: 100%;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    gap: 8px;
}
.vhs-col1-section h3{
    font-size: 18px;
    color: #4ca0a3;
    font-family: var(--ukr-font-family-buttons);
}
.vhs-col2-section{
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 25px;
}
.vhs-col3-section{
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;

}
.vhs-col3-section p{
    font-size: 14px;
    text-align: left;
    font-weight: var(--ukr-font-weight-regular);
    width: 100%;
    color: #1C1C1C;
}
.vhs-col3-section a, .vhs-col-section a{
   text-transform: uppercase;
    font-weight: var(--ukr-font-weight-bold);
    font-family: var(--ukr-font-family-heading);
    color: #4ca0a3;
}
.vhs-col3-section a:hover, .vhs-col-section a:hover{
    color: #29686a;
    text-decoration: underline;
}

.vhs-col4-section{
    display: flex;
    width: 100%;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    gap: 25px;
}
.vhs-col4-section h4{
    font-size: 18px;
    font-family: var(--ukr-font-family-heading);
    font-weight: var(--ukr-font-weight-bold);
}
.v5content{
    display: flex;
    width: 100%;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 25px;
}

.vhs-col4-section p{
    font-size: 14px;
    font-family: var(--ukr-font-family-heading);
    font-weight: var(--ukr-font-weight-medium);
}
.vehicle-section-image {
	width: 90%;
    max-width: 650px;
    height: auto;
    margin: 10px 0 10px 0;
	opacity: 1;
}
.vehicle-base-image{
    width: 130%;
    max-width: 800px;
    height: auto;
    margin: 10px 0 10px 0;
	opacity: 1;
}

.vehicle-section-table {
	width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    font-family: var(--ukr-font-family-heading);
    font-weight: var(--ukr-font-weight-medium);
	background: #fff;
}

.vehicle-section-table td {
	display: block;
	padding: 3px 10px;
	text-align: right;
	/*border-bottom: 1px solid #ccc;
	font-size: 15px*/;
}
.vehicle-section-table td:first-child {
  /*font-weight: bold;
  width: 40%;*/
  text-align: left;
}

.vehicle-section-table tr:nth-child(even) {
  background-color: #f2f2f2; /* light gray rows */
}
/*
.vehicle-section-table tr:hover {
	background-color: #f0f0f0;
}
*/
.vehicle-section-table td:last-child{
	color: #222;
}

.vehicle-section-table td:last-child:contains("N/A") {
	color: #aaa;
	font-style: italic;
}
.small-table{
    width: 100%;
    border-collapse: collapse;
    font-size: 16px;
    font-family: var(--ukr-font-family-heading);
    font-weight: var(--ukr-font-weight-medium);
    max-width: fit-content;
    border-radius: 6px;
    line-height: 1;
}
.small-table tr:first-child td,
.small-table tr:first-child th {
    padding-top: 10px;
}
.small-table tr:last-child td,
.small-table tr:last-child th {
     padding-bottom: 10px;
}

.small-table td {
	padding: 2px 8px;
	text-align: right;
	
}
.small-table td:first-child {
    text-align: left;
    padding-left: 10px;
}
.small-table td:last-child {
    font-weight: var(--ukr-font-weight-bold);
    padding-right: 10px;
    padding-left: 0;
}
.small-table tr:not-last-child {
    margin-bottom: 5px
}

.blurred-value {
	color: transparent;
	text-shadow: 0 0 5px rgba(0, 0, 0, 0.7);
	filter: blur(1px);
	letter-spacing: 2px;
	user-select: none;
}
.vehicle-blurred-section:hover .blurred-value {
	cursor: not-allowed;
	opacity: 0.8;
}
.in-report-btn{
	display: flex;
    position: relative;
    width: 100%;
    justify-content: center;
    /*
    display: block;
    position: relative;

    width: 100%;
    margin: 0 auto;
    max-width: 400px;
    padding: 0 15px;
    margin-bottom: 35px;
    */
}
.dwn-btn.to-full-report{
	
}
.in-report-btn button{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 50px;
	padding: 0 20px;
    max-width: 300px;
	font-size: 18px;
	font-weight: bold;
	font-family: inherit;
	color: #fff;
	background-color: #17A628;
	border: none;
	border-radius: 8px;
	cursor: pointer;
	transition: all 0.2s ease;
	/*box-shadow: 0 6px 0 #0c6b18; /* initial base shadow */
	position: relative;
	top: 0;
}

.in-report-btn button:hover{
	background-color: #146219;
}

.in-report-btn button:active {
    background-color: #146219;
    top: 3px;
}
.in-report-btn button i{
	margin-left: 8px;
    font-size: 25px;
}
.ncap-stars {
	display: flex;
	align-items: center;
	gap: 2px;
    background-color: #fff;
    padding: 10px 20px;
   /* margin-bottom: 50px;*/
    box-shadow: 0px 0px 10px 3px #ccc;
    border-radius: 6px;
}

.ncap-stars span:first-child{
    font-size: 18px;
    margin-right: 10px;
    font-weight: bold;
}
.star {
    font-size: 36px;
    color: #ffcd1d;
    position: relative;
    display: inline-block;
    width: 28px;
}

.star.full::before {
	content: '★';
}

.star.empt::after {
	content: '☆';
	color: #ccc;
    position: absolute;
    top: -26px;
    left: 0;
}

.star.half::before {
	content: '★';
	position: absolute;
    top: -26px;
    left: 0;
	width: 50%;
	overflow: hidden;
    z-index: 2;
}

.star.empty::before {
	content: '☆';
	color: #ccc;
    position: absolute;
    top: -22px;
    left: 0;
}
.co2-label{
    margin-bottom: 8px;
    font-weight: bold;
    font-size: 17px;
    color: #fff;
    padding: 10px 25px;
    margin-top: 45px;
}
.mot-progress-bar{
    width: 100%;
    background-color: #b6b6b6;
	border-radius: 10px;
}
.mot-progress-bar-fill{
    height: 20px;
    background-color: #0b585a;
    border-radius: 10px;
    text-align: right;
    color: #fff;
    padding-right: 10px;
    font-size: 14px;
}

.mot-test-table {
	width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    font-family: var(--ukr-font-family-heading);
    font-weight: var(--ukr-font-weight-medium);
	background: #fff;
    border-top: 5px solid #003049;
    border-bottom: 2px solid #003049;
    
}
.vehicle-record-card{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    width: 100%;
}

.mot-test-table td, .mot-test-table th{
    text-align: right;
    align-items: center;
    padding: 3px 10px;
	text-align: right;
}
.mot-test-table td:first-child{
  /*font-weight: bold;
  width: 40%;*/
  text-align: left;
}

.mot-test-table tr:nth-child(even) {
  background-color: #f2f2f2; /* light gray rows */
}

.mot-test-table td:last-child{
	color: #222;
}
.mot-test-table th:first-child {
    text-align: left;
}
.mot-test-table th:last-child {
    text-align: right;
}

.mot-test-table td:last-child:contains("N/A") {
	color: #aaa;
	font-style: italic;
}

.mot-label-col, .write-label-col {
	width: 25%;
    min-width: 120px;
    white-space: nowrap;
    font-weight: bold;
}
..write-label-col{
    width: 40%;
}
.mot-result-pass {
	color: green;
}

.mot-result-fail {
	color: red;
}

.advice-row {
	background-color: #e7f7e7;
}

.fail-row {
	background-color: #fceaea;
}
/*
.mot-test-table td {
	padding: 10px;
	vertical-align: top;
}

.mot-label-col {
	width: 40%;
	font-weight: bold;
	background-color: #f7f7f7;
	white-space: nowrap;
}*/
.mot-advice-label {
	background-color: #28a745;
	color: #fff;
	padding: 10px 15px;
	font-size: 18px;
	font-weight: bold;
	border-radius: 4px;
	display: inline-block;
}

.mot-advice-text {
	font-size: 16px;
	padding: 10px 15px;
}

.mot-failure-label {
	background-color: #dc3545;
	color: #fff;
	padding: 10px 15px;
	font-size: 18px;
	font-weight: bold;
	border-radius: 4px;
	display: inline-block;
}

.mot-failure-text {
	font-size: 16px;
	padding: 10px 15px;
}
.advice-failure-container {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 10px 0;
}

.type-failure {
	font-weight: bold;
	color: #222;
	font-size: 16px;
}

.content-failure {
	font-size: 15px;
	/*background-color: #f5f5f5;*/
	padding: 6px 10px;
	border-radius: 4px;
}
.failure-label, .advice-label {
	background-color: #ff7f7f;
    color: #000000;
    font-weight: bold;
    font-size: 16px;
    padding: 5px 10px;
    border-radius: 5px;
}

.advice-label {
	background-color: #4ce54c;
}
.mot-header-label {
	font-weight: bold;
	font-size: 18px;
	padding: 12px 15px;
	vertical-align: middle;
}

.mot-header-pass {
	color: #28a745;
}

.mot-header-fail {
	color: #dc3545;
}

.status-box {
	background-color: #28a745;
	color: white;
	border-radius: 10px;
	padding: 15px;
	margin-bottom: 15px;
	text-align: center;
}

.status-icon {
	font-size: 30px;
	margin-bottom: 5px;
}

.status-label {
	font-weight: bold;
	font-size: 20px;
}

.status-subtext {
	font-size: 14px;
}

.vhs-col5-section{
    display: flex;
    flex-direction: column;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
    /*margin-bottom: 45px;*/
    gap: 25px;
}
.vhs-col6-section, .vhs-col7-section{
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}
.vhs-col7-section{
    align-items: flex-start;
}
.taxstatus-box, .motstatus-box, .destructionstatus-box{
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    background-color: #b6b6b6;
    padding: 5px 10px;
    width: 90%;
    border-radius: 6px;
    gap: 10px;
}
.motstatus-box{

}
.destructionstatus-box{
    width: 100%;
    padding: 10px 10px;
}

.taxstatus-box .no-data{
   background-color: #b6b6b6;
   color:#e7d808; 
}
.vhs-col5-section i, .destructionstatus-box i{
    width: 50px;
    height: 50px;
    font-size: 40px;
    color: #fff;
}
.taxstatus-box-details, .motstatus-box-details, .destructionstatus-box-details{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    flex-wrap: nowrap;
    color: #fff;
}
.destructionstatus-box-details{
    text-align: left;
    font-size: 12px;
}
    
.taxstatus-box-details h2, .motstatus-box-details h2, .destructionstatus-box-details h2{
    background: inherit;
    color: inherit;
    font-size: 24px;
    margin: 0;
    text-align: left;
    padding: 0;
    border: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
.destructionstatus-box-details h2{
    font-size: 18px;
}
.taxstatus-box-details span, .motstatus-box-details span{

}
.passed{
    background-color: #11a219;
}
.motfailed{
    background: red;
}
.unknown{
   background-color: #b6b6b6; 
}
.category-safe { 
    color: #11a219;
    font-weight: bold; 
}
.category-warning { 
    color: red; 
    font-weight: bold; 
}
.category-unknown { 
    color: #b6b6b6; 
    font-weight: bold; 
}


.anomaly-detected, .anomaly-clear {
	color: white;
	background: red;
	padding: 3px 10px;
	border-radius: 4px;
}
.anomaly-clear {
	background: green;
}
.view-history-link{
    font-weight: var(--ukr-font-weight-bold);
    font-family: var(--ukr-font-family-heading);
    color: #4ca0a3;
}
.view-history-link:hover{
    color: #29686a;
    text-decoration: underline;
}

.mileage-chart{
    display: flex;
    width: 100%;
    height: auto;
}
#mileageChart{
    display: block;
    width: 100% !important;
}
.blurred-cell {
	color: transparent;
	text-shadow: 0 0 10px rgba(0,0,0,0.5);
	user-select: none;
}

.feature-category {
    display: flex;
    margin-bottom: 10px;
    width: 100%;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}

.feature-category h3 {
    border-bottom: 2px solid #4ca0a3;
    padding-bottom: 5px;
    width: 100%;
    text-align: left;
    font-size: 18px;
    color: #4ca0a3;
    font-family: var(--ukr-font-family-buttons);
}

.feature-table {
	width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    font-family: var(--ukr-font-family-heading);
    font-weight: var(--ukr-font-weight-medium);
    background: #fff;
}
.feature-table td:first-child, .feature-table th:first-child {
    text-align: left;
}
.feature-table tr:nth-child(even) {
    background-color: #f2f2f2;
}

.feature-table th, .feature-table td {
    padding: 5px 12px;
	border: 1px solid #ddd;
	text-align: right;
}

.feature-table th {
	background-color: #f0f0f0;
}

.vrm-warning-container{
    display: flex;
    position: relative;
    flex-direction: column;
    align-items: flex-start;
    width: calc(100% + 10px);
    margin: 0 auto;
    overflow: hidden;
    gap: 10px;
    background-color: #fff;
    padding: 10px 10px;
    border-radius: 6px;
    left: -5px;
    box-shadow: 0px 0px 5px 3px #ccc;
}
.vrm-row{
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    width: 100%;
    gap: 5px;
}
.vrm-row > div{
   display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    justify-content: center;
    gap: 10px;
}
.vrm-row > div:last-child{
    border-bottom: 1px solid #ccc; 
}
.vrm-row > div > p{
    display: flex;
    flex-direction: column;
    align-items: center;
    width: fit-content;
    line-height: 26px;
    font-weight: var(--ukr-font-weight-bold);
    color: #6f6f6f;
    font-size: 14px;
}
.vrm-row > div > p > i{
    font-size: 12px;
    font-style: normal;
    font-weight: var(--ukr-font-weight-medium);
    color: #000;
    transform: translateY(5px);
}
.vrm-row > div > p > span{
    font-size: 16px;
    font-weight: var(--ukr-font-weight-bold);
    color: #fff;
    padding: 2px 20px;
    border-radius: 5px;
}
.vrm-row > div > span{

}
.vrm-row h3{
    display: inline-block;
    width: 100%;
    text-align: left;
    font-size: 15px;
    color: red;
    font-weight: var(--ukr-font-weight-medium);
    border-bottom: 1px solid #ccc;
    line-height: 19px;
    padding-bottom: 2px;

}
.vrm-row h3 b{
    color: #6f6f6f;
    font-size: 13px;
}
.vrm-block{

}
.requested{
    background: red;
}
.latest{
    background: #eca307;
}

.model-title{

}
.vrm-separator{
    position: relative;
    transform: translateY(10px);
    font-size: 18px;
    font-weight: var(--ukr-font-weight-bold);
}

.vrm-note{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    font-size: 13px;
    line-height: 14px;
    gap: 5px;
}
.vrm-note p{
    text-align: left;
    font-weight: var(--ukr-font-weight-medium);
}
.vrm-note p b, .vrm-note span b{
    color: #6f6f6f;
}
.vrm-note span{
    text-align: left;
    font-size: 12px;
}



/*------------blocker------------------*/
#refresh-blocker{
    display:none;
    position:fixed;
    top:0; 
    left:0; 
    width:100%; 
    height:100%; 
    background:rgba(0,0,0,0.8); 
    color:white; z-index:9999; 
    justify-content:center; 
    align-items:center; 
    flex-direction:column; 
    text-align:center;
}
#refresh-blocker p{
    font-size:1.5rem;
}
#refresh-blocker button{
    margin:10px; 
    padding:10px 20px;
}


/*------------------------------------*/
#footer{
    color: #000;
    background-color: #fff;
    text-align: center;
    padding: 1em 0;
	padding-top:3rem;
}
#footer p{
    margin: 0 0 10px;
}
#footer a:hover ,#a-footer a:hover{
    text-decoration: underline;
}
#footer a{
    color: #337ab7;
    text-decoration: none;
}
/*
#contacts, #refunds{
	display: block;
    position: relative;
    width: 100%;
    padding-top: 40px;
}
*/
#contacts, #refunds {
    display: block;
    position: relative;
    width: 100%;
    margin: 0 auto;
    background-color: #fff;
    padding-top: 60px;
    margin-top: -150px;
    padding-bottom: 80px;
    z-index: 2;
    border-top-right-radius: 8rem;
}
.hpi-contact-btn{
    display: flex;
    justify-content: flex-start;
    width: 100%;
}
.cnt-btn{
    display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 46px;
	padding: 0 20px;
    max-width: 300px;
	font-size: 16px;
	font-weight: bold;
	font-family: inherit;
	color: #fff;
	background-color: #17A628;
	border: none;
	border-radius: 8px;
	cursor: pointer;
	transition: all 0.2s ease;
	position: relative;
	top: 0;
}
.cnt-btn:hover{
    background-color: #146219;
}

.cnt-btn:active {
    background-color: #146219;
     top: 2px;
}

.cnt-btn i{
	margin-left: 8px;
    font-size: 25px;
}
.offerlink{
    background-color: #17A628;
    max-width: 400px;
}
.offerlink i{
    margin: 0 8px;
    font-size: 20px;
}
.offerlink:hover{
	 background-color: #146219;
}

.offerlink:active {
   background-color: #146219;
  top: 2px;
}

#a-box {
    background-color: #fff;
    background-clip: padding-box;
    position: relative;
    width: 100%;
	padding: 5px;
	margin: 0 auto;
	max-width: 1000px;
}
#pro-bar {
    background: #e4e4e4;
    text-align: center;
    margin: 10px auto;
    position: relative;
    height: 20px;
	border-radius: 6px;
	-webkit-border-radius: 6px;
	
}
#pro-visual{
    background: #003049;
    height: 20px;
	transition: width 1s ease-out 0s;
	-webkit-transition: width 1s ease-out 0s;
	border-radius: 6px 0 0 6px;
	-webkit-border-radius: 6px 0 0 6px;
	    -webkit-transition: width .6s ease;
    -o-transition: width .6s ease;
    transition: width .6s ease;
}
#pro-txt{
    color: #000;
    font-size: .8em;
    display: inline;
	position: absolute;
    top: 2px;
    left: calc(50% - 20px);	
}
#pro-visual:after {
    content: "";
    position: absolute;
    top: 0px;
    left: 0px;
    width: 0%;
    height: 100%;
    background-color: rgba(255,255,255,0.4);
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
	-webkit-animation: glint 2.5s infinite;
   animation: glint 2.5s infinite;
}
#a-footer{
    color: #444;
    text-align: center;
    font-size: 1em;
    margin-top: 1.3em;
}
#a-footer>div{
    width: auto;
    text-align: center;
    margin: 1em auto .8em auto;
    position: relative;
    display: inline-block;
    padding-left: 17px;
	margin-bottom: 0;
	
}
#a-footer a {
    color: #337ab7;
    text-decoration: none;
}
#a-footer>div:before {
    content: '';
    display: block;
    width: 15px;
    height: 15px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAQCAMAAAARSr4IAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAhUExURQAAAB08Qh08Qh08Qh08Qh08Qh08Qh08Qh08Qh08Qh08QsPIo4UAAAAKdFJOUwBiMK7e6UApOtHmaYucAAAATElEQVQI133OWwrAMAhE0ZloXrP/BTc2DYTS9P7IQRABgF3qxBMld2nZ1YAmn6qyGKZ6syyWGImyNDIxDWrrQHJnBvJ5+2Y8+Xn5twv3owRdsq7ZOgAAAABJRU5ErkJggg==) no-repeat 0 1px;
    position: absolute;
    top: -1px;
    left: 0;
}
#b-footer{
    color: #444;
    text-align: center;
    font-size: .875em;
}
#b-footer>div{
    width: auto;
    text-align: center;
    margin: 1em auto .8em auto;
    position: relative;
    display: inline-block;
    margin-top: 5px;
}
#b-footer a {
    color: #337ab7;
    text-decoration: none;
}
#qB{
  
	padding-bottom: 10px;
}
#qB h2{
	display: inline-block;
    position: relative;
    padding: 4px 0;
    margin-bottom: 5px;
    width: 100%;
    font-size: 1.55em;
    line-height: 1.3;
    font-weight: 500;
    text-align: left;
}

#qB>.error h2{
    color: #f00;
	animation:  blink 0.5s ease-in-out 5 alternate;
	-webkit-animation: blink 0.5s ease-in-out 5 alternate;
}
.error h2, .error legend, .error label{
    color: #f00;
	animation:  blink 0.5s ease-in-out 5 alternate;
	-webkit-animation: blink 0.5s ease-in-out 5 alternate;
}
.gen-error h2{
    color: #f00;
	animation:  blink 0.5s ease-in-out 5 alternate;
	-webkit-animation: blink 0.5s ease-in-out 5 alternate;
}
.s-list{
	list-style: none;
	font-size: 16px;
    line-height: 1.3;
}
.s-list li {
	position: relative;
    padding: 0.4em 1em 0.4em 40px;
    cursor: pointer;
    display: block;
    width: 100%;
    color: #1C1C1C;
    margin: 0 auto 0.4em;
	border-radius: 0.363636em;
}
#qB .in-block li{
	display:inline-block;
	width:auto;
}
.s-list li p {
}
.s-list li:hover {
    -webkit-box-shadow: none;
    box-shadow: none;
    background-color: #f3f2f1;
}
.s-list li:before{
    position: absolute;
    top: 50%;
    left: 7px;
    display: block;
    content: '';
    background: #fff;
	width: 22px;
    height: 22px;
    margin-top: -11px;
    border-radius: 50%;
    -webkit-box-shadow: 0 0 0 4px #fff inset,0 0 0 2px currentcolor;
    box-shadow: 0 0 0 4px #fff inset,0 0 0 2px currentcolor;
}
.s-list li:hover:before {
    background: #000;
}
.s-list .selected:before{
    -webkit-transition-duration: .1s;
    transition-duration: .1s;
    background: #003049;
    -webkit-box-shadow: 0 0 0 5px #fff inset,0 0 0 5px #fff inset,0 0 0 2px currentcolor;
    box-shadow: 0 0 0 5px #fff inset,0 0 0 5px #fff inset,0 0 0 2px currentcolor;
}
.s-list .selected {
    -webkit-box-shadow: 0 0 0 2px #2b8cc4 inset;
    box-shadow: 0 0 0 2px #2b8cc4 inset;
    background-color: #eaf4f9;
    padding-right: 35px;
	font-weight: 600;
}
.s-list .selected p{
}
#qB #g-icons{

}
#qB #g-icons h2{
	text-align:center;
}

#qB .col2-list li{
	width: 48%;
    display: inline-block;
}
#qB .col2-list li:nth-child(odd){
    margin-right: 2%;
}
#nav button,#pre-sell button{
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}
#nav .btn, #pre-sell .btn,#contact-us-box .btn ,#thx-box  .btn, #addresses-step .btn,#declaration-step .btn, #search_address,#search_address_alternative, #select_address, #to_the_start{
    font-size: 1.4em;
    width: 100%;
    white-space: normal;
    color: #fff;
	-webkit-border-radius: .1em;
    border-radius: .1em;
    text-align: center;
    cursor: pointer;
    padding: .5em .8em .7em .8em;
	padding-top: 6px;
    padding-bottom: .4em;
    background-color: #00703c;
    box-shadow: 0 2px 0 #002d18;
    border: 0;
}
#nav .btn i,#pre-sell .btn i{
    display: block;
    font-size: .5em;
    margin-top: .1em;
	text-align: center;
}
#nav .nav-prev{
	padding-left: 5px;
    color: #003049;
    border: none;
    cursor: pointer;
    margin-top: 10px;
    background: none;
    font-size: 1.2em;
}
#nav .nav-prev:before{
	content: "";
    display: inline-block;
    position: relative;
    padding-left: 20px;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAPBAMAAADJ+Ih5AAAAG1BMVEVHcEz/k0T/k0T/k0T/k0T/k0T/k0T/k0T/k0R7DikHAAAACHRSTlMAlafoPAS/eJbdAs4AAABbSURBVAjXY2BAACcLIwcQHdjR0dEYAGRIdHQkdwgwMLB0dDSFdbQwMDB1dKhWdDQxMDB3NIV3dDQzMHB0tHoAlYNEGhnBIkA1AhIgNUBdjWwgXXBzECbD7YICAC+JHrvdrUvVAAAAAElFTkSuQmCC);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 14px;
    height: 14px;
    margin-right: 5px;
	top: 1px;
}

#alternative_search{
	font-size: 15px;
    text-align: center;
    color: #337ab7;
    font-weight: 600;
    text-decoration: underline;
	margin-top: 20px;
}
.prevAddrDesc{
    margin: 5px 0;
}
#continue,#finish,#prev,#tcpa{
	display:none;
}
#qB #h-desc li{
	padding: .4em 1em .4em 0;
	overflow: hidden;
}
#qB #h-desc li p{
	padding-left: 40px;
	font-size: 17px;
}
#qB #h-desc li:before{
    width: 22px;
    height: 22px;
    margin-top: -11px;
    border: 3px solid #fff;
    border-radius: 2px;
	-webkit-border-radius: 2px;
    -webkit-box-shadow: 0 0 0 1px currentcolor inset,0 0 0 1px currentcolor,0 0 0 2px #ccc;
    box-shadow: 0 0 0 1px currentcolor inset,0 0 0 1px currentcolor,0 0 0 2px #ccc;
	top: 1.025em;
    -webkit-transform: none !important;
    transform: none !important;
}
#qB #h-desc li.selected{
	font-weight: bold;
    overflow: hidden;
    font-size: 20px;
    background-image: none;
    box-shadow: none;
	-webkit-box-shadow: none;
}
#qB #h-desc li.selected:before{
    -webkit-transition: none;
    transition: none;
    background: #fff url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2216%22%20viewBox%3D%220%200%2020%2016%22%3E%3Cpath%20fill%3D%22%23178B17%22%20fill-rule%3D%22evenodd%22%20d%3D%22M3%205L8%2010%2017%200%2020%203%208%2016%200%208z%22%2F%3E%3C%2Fsvg%3E") no-repeat 49.9% 50%;
    background-size: 16px auto;
    border: none;
    -webkit-box-shadow: 0 0 0 1px currentcolor;
    box-shadow: 0 0 0 1px currentcolor;
}
#qB #h-desc li:after {
	content:"";
    display: block;
    font-size: 14px;
    font-weight: 400;
    border-top: solid 1px #ccc;
    padding-top: .5em;
    padding-bottom: .5em;
    margin-top: .5em;
    padding-left: 1em;
    padding-right: 1em;
    width: calc(100% + 1.5em);
    margin-bottom: -.6em;
    background: #fff;
}
#qB #h-desc li:nth-child(1):after{
    content: 'Allows someone to make decisions on your behalf if you are no longer able to';
}
#qB #h-desc li:nth-child(2):after{
    content: 'Identical wills, usually chosen by couples that share the same wishes';
}
#qB #h-desc li:nth-child(3):after{
    content: 'Included within a will to protect your assets & distribute them to your loved ones';
}
#qB #h-desc li:nth-child(4):after{
    content: 'Having the legal document written by a professional';
}

.alert-static {
    background-color: #8c8c8c;
    padding: .6em;
    border-radius: 6px;
	margin: 2em 0;
    clear: both;
}
.alert-static p {
    color: #fff;
    text-align: center;
    margin: 0;
    font-weight: 700;
    font-size: .9em;
}
.input-wrapper{
	margin-bottom:10px;
}
input,select,textarea{
    margin-bottom: 5px;
    width: 100%;
    padding: 0 10px;
    margin-top: 10px;
    color: #444;
	font-family: inherit;
    font-size: inherit;
    line-height: inherit;
	height: 45px;
	
}
#contact-us-box .btn{
	height:auto;
}
input.text{
    height: 45px;
}
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{background-color: #fff; color:#727272}
input::-moz-placeholder,textarea::-moz-placeholder{background-color: #fff; color:#727272}
input:-ms-input-placeholder,textarea:-ms-input-placeholder{background-color: #fff; color:#727272}
input::-ms-input-placeholder,textarea::-ms-input-placeholder{background-color: #fff; color:#727272}
input::placeholder,textarea::placeholder{background-color: #fff; color:#727272}
textarea {
	height:auto;
}

select {
    font-weight: 400;
    box-sizing: border-box;
    max-width: 100%;
    height: 45px;
    height: 2.5rem;
    padding: 5px;
    border: 1px solid #e3e3e3;
	font-size: 1.1875rem;
    line-height: 1.25;
	width: auto;
	border-radius: 6px;
	background: inherit;
	min-width: 110px;
	font-family: var(--ukr-font-family-heading);
}
input::selection {
   background-color: #fff;
   border: 1px solid #e3e3e3;
}
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
 background-color: #fff;
 border: 1px solid #e3e3e3;
}
.alert-animate{
    padding: 2px;
    -webkit-animation: loader-fader 5s ease-out infinite forwards;
    animation: loader-fader 5s ease-out infinite forwards;
    margin-bottom: .4em;
}
.alert-animate p {
    margin: .6em;
    font-size: .9em;
}
@-webkit-keyframes loader-fader{0%{background:#fff;color:#fff}10%{background:#ff9800;color:#fff}80%{background:#ff9800;color:#fff}100%{background:#fff;color:#444}}@keyframes loader-fader{0%{background:#fff;color:#fff}10%{background:#ff9800;color:#fff}80%{background:#ff9800;color:#fff}100%{background:#fff;color:#444}}

#tcpa, .additional-info{
    padding-top: 1em;
    color: gray;
	font-size: 13px;
}
.additional-info ul{
	margin-bottom: 20px;
}
.additional-info ul li{
    margin-left: 2rem;
	font-size: .8rem;
}
.additional-info img{
    width: 100%;
    height: auto;
	max-width: 330px;
}
.additional-info a{
	color: #003049;
	text-decoration: underline;
}
.additional-info a:hover{
	color: #f6a166;
	text-decoration: none;
}
.additional-info p{
	font-size: 14px;
}
#qB .input-wrapper label{
    position: relative;
    font-size: 1.1875rem;
    margin-bottom: -10px;
    display: block;
    z-index: 2;
    margin-left: 12px;
    background: #fff;
    width: fit-content;
    padding: 0 10px;
    font-weight: lighter;
	line-height: 1;
}
#qB>div{
	display:block;
    transition: opacity 0.8s ease-out;
    opacity: 0; 
    height: 0;
    overflow: hidden;
}
#qB>:first-child , #qB .show{
    opacity: 1;
    height: auto;
	animation:  fInR 0.5s ease-out 1 forwards;
	-webkit-animation: fInR 0.5s ease-out 1 forwards;
}
#loading-step>div,#f-loading-step>div,#loading-step-payment>div{
    color: #000;
    text-align: center;
    background: url(/hpi/v1/files/loader-squares.gif) no-repeat center center;
    height: 200px;
    margin-top: 1.5em;
    background-size: 40%;
}
.loading-holder>div{
	display:none;
}
#loading-step-payment{
	display:none;
}
.error-msg {
    color: red;
    font-size: 13px;
    line-height: 15px;
	margin-top: -15px;
}

/*-----------*/
#thx{
	display:none;
	text-align:center;
	margin-bottom: 100px;
}

#thx p {
    margin-bottom: 0.5em;
	font-size: 14px;
}
#thx p b{
    font-weight: 500;
}
#details-cont{
    margin-bottom: 300px;
}
#res-cont{
	text-align: center;
	margin-bottom: 300px;
}
#err-cont{
	
}
#err-cont a{
	color: #003049;
}
#err-cont a:hover{
	color: #07b1c8;
}
#thx-box {
	display:none;
}
#thx-box h2 {
    font-size: 32px;
    color: #1d242d;
    margin-bottom: 20px;
	font-family: var(--ukr-font-family-buttons);
    font-weight: var(--ukr-font-weight-bold);
}
#thx .h2vers1{
	border-top: 10px solid #f86e0a;
    padding: 15px 10px;
    background: #5b4e48;
    width: fit-content;
    line-height: 30px;
    font-size: 22px;
    color: #e7e7e7;
    width: 100%;
    border-bottom: 2px solid #c4c4c4;
    box-shadow: 0 3px 6px 1px #ccc;
    border-left: 0;
    text-align: left;
}
#thx .h2vers1 span{
	display: block;
    position: relative;
    color: #e7e7e7;
    font-family: var(--ukr-font-family-base);
    line-height: 1.2;
    font-weight: 400;
    padding-top: 10px;
    font-size: 0.8em;
}

#thx .h3vers1{
	display: flex;
    position: relative;
    padding: 15px;
    left: -10px;
    border-bottom: 2px solid #c4c4c4;
    box-shadow: 0 3px 6px 1px #ccc;
    background-color: #5b4e48;
    margin-bottom: 25px;
    line-height: 24px;
    width: calc(100% + 20px);
    vertical-align: middle;
    align-items: center;
    text-align: center;
    font-weight: var(--ukr-font-weight-medium);
    color: #e7e7e7;
    border: 0;
    border-radius: 0;
	height: 80px;
}

#thx-box .h3ord{
    text-align: center;
    font-size: 24px;
    font-weight: 500;
}
#thx-box p {
    margin: 1em;
    font-size: 1.2em;
    color: #000;
    text-align: center;
}
#thx-box .bolt-p{
	font-weight: 500;
}
#thx-box .bolt-p b{
	display: inline-block;
    color: #003049;
    background: #f6f6f6;
    border-radius: 0;
    padding: 0 15px;
    border-left: 1px solid #003049;
    font-weight: 500;
    font-family: 'Roboto';
}
/*==========================*/
#thx {
    text-align: left;
	min-height: 50vh;
}
#thx h2 {
    padding: 15px 10px;
    width: fit-content;
    line-height: 30px;
    font-size: 22px;
	font-family: var(--ukr-font-family-heading2);
	color: #2e434b;
    width: 100%;
    text-align: center;
}
#thx .h2vers1{
    width: fit-content;
    line-height: 30px;
    font-size: 22px;
	font-family: var(--ukr-font-family-heading2);
    color: #2e434b;
    width: 100%;
}
#thx h2 span {
	display: inline-block;
    position: relative;
    color: #c4c4c4;
    font-family: var(--ukr-font-family-heading);
    padding-left: 10px;
}
#thx .h2vers1 span {
	display: block;
    position: relative;
    color: #c4c4c4;
    font-family: var(--ukr-font-family-heading);
    line-height: 1.2;
    font-weight: 400;
    padding-top: 10px;
}
#thx u {
    /*border-top: 1px solid #ff5722;
    border-bottom: 1px solid #ff5722;*/
    text-decoration: none;
    padding: 2px 0;
    font-size: 16px;
}

#thx .h3vers1 {
	display: flex;
    position: relative;
    padding: 15px;
    left: -10px;
    border-bottom: 2px solid #c4c4c4;
    box-shadow: 0 3px 6px 1px #ccc;
    background-color: #5b4e48;
    margin-bottom: 25px;
    line-height: 24px;
    width: calc(100% + 20px);
    vertical-align: middle;
    align-items: center;
    text-align: center;
    font-weight: bold;
    color: #fff;
	border: 0;
    border-radius: 0;
}

/*---------------------*/
#ch-addr-box{
    padding: 30px 10px;
    margin-bottom: 35px;
	border-bottom: 10px solid #f86e0a;
    box-shadow: 0 0 9px 4px rgb(190 181 147 / 50%);
}
#ch-addr-box p{
	font-size:14px!important;
}
#ch-addr-box p b{
	color: #ff5c6d;
    font-weight: 500;
}
#ch-addr-box u{
	/*border-top: 1px solid #fffdfb;
    border-bottom: 1px solid #fffdfb;*/
    text-decoration: none;
    padding: 2px 0;
	font-size: 16px;
}
#ch-addr-box a{
	color: #f86e0a;
	font-family: var(--ukr-font-family-heading);
}
#ch-addr-box a:hover{
	color: #f6a166;
}
#ch-addr-box .underl-p{
    border-bottom: 1px solid #f86e0a;
    width: fit-content;
    padding: 0;
    margin-bottom: 10px;
    line-height: 26px;
}
#ch-addr-box .underl-p b {
	display: inline-block;
    color: #c4c4c4;
    background: #5b4e48;
    border-radius: 0;
    padding: 0 15px;
	font-family: var(--ukr-font-family-heading);
}
/*---------------------*/

.overlay:before {
	display: inline-block;
	vertical-align: middle;
	height: 100%;
	content: "";
}
.overlay{
	display:block;
	position: fixed;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	bottom:0;
	right:0;
	line-height: 1;
	z-index: 100000;
	overflow: auto;
	text-align: center;
	transition: opacity 1.5s ease-out;
	animation:  zoomIn 0.5s ease 1 forwards;
	-webkit-animation: zoomIn 0.5s ease 1 forwards;
	background:rgba(255,255,255,.8);
	
}
.overlay>div {
    display: inline-block;
    vertical-align: middle;
    width: 90%;
    max-width: 600px;
    margin: 0 auto;
    padding: 25px 15px 20px;
    text-align: center;
    background: #fff;
    font-size: 14px;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    box-shadow: 0 0 3px 0px rgba(0, 0, 0, .2);
    -webkit-box-shadow: 0 0 3px 0px rgba(0, 0, 0, .2);
    position: relative;
    z-index: 1;
    border: 1px solid rgba(0,0,0,.2);
	position:relative;
}
/*--------------------------*/



#qB>#pre-sell{
	display:none;
	padding-top: 20px;
}
#pre-sell h2{
	text-align: center;
}
#pre-sell p{
	font-size:1rem;
	margin-bottom:10px;
}
#pre-sell ul{
	margin: 10px;
}
#pre-sell ul li{
	list-style-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAAQCAMAAADH72RtAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAkUExURQAAAH2wDn2wDn2wDn2wDn2wDn2wDn2wDn2wDn2wDn2wDn2wDqH6+A8AAAALdFJOUwBvg5guruXPFj1VCYXcawAAAFxJREFUGNNdj0kSACEIAwF3+f9/xwg1BXqKLa2RKK6tJe1pdtWRSNOH7AO0RgeAX6dFwAf0ibRssMLZnm6HoR6oWxI4phdMy3WW34jTu+R/xFEsa6i+VTh/mkPZD+nQA5xZsrpXAAAAAElFTkSuQmCC);
    margin-left: 2rem;
	font-size: 1rem;
}
#pre-sell button{
	
}

#top-phone{
    font-weight: 600;
    color: #3182c9;
    text-decoration: none;
    text-align: center;
    display: block;
    margin-top: 5px;
}
#callbackform{
	display: flex;
    flex-direction: column;
    width: 100%;
    padding: 25px 20px 35px 20px;
}
#callbackform .callbackform-row1{
	display: flex;
    flex-direction: column;
    width: 100%;
	gap: 30px;
}
#callbackform .callbackform-col1{
	display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    margin: 0 auto;
    gap: 20px;
}
#callbackform .callbackform-col1 h2{
	color: #807b84;
    font-size: 44px;
    font-weight: var(--ukr-font-weight-medium);
    font-family: var(--ukr-font-family-heading3);
    line-height: 1;
    width: 100%;
    text-align: left;
}
#callbackform .callbackform-col2{
	display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
    gap: 10px;
}
#callbackform label{
	display: inline-block;
    position: relative;
    width: 100%;
    text-align: left;
    padding-left: 3px;
    font-size: 16px;
    color: #727272;
}
#callbackform textarea{
	margin-bottom: 2px;
    margin-top: 1px;
    padding: 8px;
    padding-left: 12px;
    font-size: 1.2em;
    
    font-family: 'Roboto';
    color: #727272;
}

#callbackform b{
	display: block;
    width: 100%;
    text-align: left;
    margin: 0;
    font-size: 13px;
    color: #727272;
    font-weight: 400;
   
}
#callbackform p{
	display: block;
    width: 100%;
    text-align: left;
    margin: 0;
    font-size: 16px;
    color: #727272;
	line-height: 24px;
	
}
#callbackform p a{
    color: #003049;
	font-weight: 600;
}
#callbackform p a:hover{
    color: #212325;
}
#callbackform label span, #callbackform b span{
	display: inline-block;
	margin: 0 2px;
    color: #e30000;
}
.sfrom-succes-message-anime{
	display: block;
}
#sfrom-succes-message{
	background-color: #cef4a9;
    border-left: 5px solid #85c14b;
    color: #000;
    padding: 5px 15px;
    margin: 0 0 10px 0;
    position: relative;
}
#sfrom-succes-message p{
	color: #000;
    display: flex;
    flex-direction: row;
    align-content: center;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
}
#sfrom-succes-message p span{
	content: "";
    display: inline-block;
    position: relative;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAMAAADXqc3KAAAAP1BMVEVHcEwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAC6E+JdAAAAFHRSTlMAEVH854j0CKdmP5lwzjV2tx/cKScdU1EAAACJSURBVCjPrZHJDoMwDETJgrNAKND5/2+tAxJLOodWYi6OniN7bHfdMzKG8+Qtw1MRykfnGDczKF9W4EX42wOR/Ve+Hk5zr0pb/QK46XQnUI36ihqHS4HsFKgVq8HfRrY1I1kbIDUrqMVq1od2Wuz6HqHfuJClDmgsHape6VLDDAn0OqHEP+/5qz7/tgZ4If18AwAAAABJRU5ErkJggg==);
    background-repeat: no-repeat;
    background-size: cover;
    width: 18px;
    height: 18px;
    margin-right: 10px;
}
.btn-cont{
	display: flex;
    flex-direction: row;
    align-items: center;
    position: relative;
    width: 100%;
    margin: 20px 0 25px 0;
}
.attention-cont{
    border: none;
    cursor: pointer;
    margin: 15px 0;
    font-size: 1rem;
    font-weight: 600;
	padding: 6px;
	margin-top: -10px;
    opacity: 0.87;
}
.attention-cont:before{
	content: "";
    display: inline-block;
    position: relative;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAMAAAANmfvwAAAA4VBMVEVHcEy9vb1VVVXl5eVFRUU1NTU+Pj4ODg7X19cEBAQJCQlRUVG6urpLS0vHx8eBgYGampqBgYGLi4t1dXUoKChKSkpbW1s7OzsEBAQdHR0CAgJtbW2np6eTk5OdnZ1/f3/Y2NihoaHs7OxwcHCUlJRgYGAvLy84ODiqqqqKiootLS0aGhqJiYmMjIxcXFxDQ0MyMjIhISGLi4tqampra2t8fHxQUFB3d3dxcXFZWVkyMjI+Pj5HR0c0NDRQUFBVVVU3NzcSEhLExMQAAAC/v7+5ubkoKCgYGBgAABkAGT0AAACiNlaCAAAASXRSTlMAFKoEp7p85iL++7A+txsxEVd1cNufYZ/z0O9+WFdigykaCppuoMGzS2rU4GI7g4Ody06PL3icOV6Kq3J0ppCPq/Iw/jU2ynP9dDdYhAAAAaFJREFUOMttVNd2wjAMFSsDKIQZVsveUEiZpXTScY7//4Mq23EiB/SQ3KtcR7IlGSA0p+p6ZqNheuujA7csP2bEUvkrQUwTCFFMVzzZwm2eVn/G6mRKUYEqdsKVPCh+SApHM1QUOR916aJuivvairbIiuV6vZSoxL0PEls1xFPyv53E9wjtjoBxhEXp/ZJ5ZiUbILzjIKsA2qOUvPs0g3jivzu+z5WSD59atlidSzM2VIm/Scle8T5mY8EijC0zRFso/iM2smesHJbhkytqucAxwwOFX/4IjO+OxUNeYcwDrMdz6JpwSSvkuEUT8NwMcvAzGhfgBcNGJVPGBlGJHgh6NutBJJDH7CQtcb9PGaZb5w8aHBIJ0FNL6keHiu2WaL7xY0kvAMBQO5YNSixRxosV9LDWs1ZaNgFvhoxyFrikSs96orqiqFIpMzZXuw5aSvxONSnEjFWOlr1D2rsUHT7a3gBtMX3akDhjbUgAmnLUgjnOV/h0XjZ0UUG229w1zmfDnUt2jIx9Kjr2o9z15aGJRsubN4xTfa3zK6j+WqVX0D/fm2y9H4h3qAAAAABJRU5ErkJggg==);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    width: 20px;
    height: 20px;
    margin-right: 6px;
    top: 5px;
}
.address-cont{
    background: transparent url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAmCAMAAACWCLnmAAAANlBMVEVHcEwzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMPiRcpAAAAEXRSTlMA4UifkNc4724IU3sexD20EpsnPKsAAACvSURBVDjL7dPNDoMgEEbRQaD8q9/7v2ypRBTLoKuuelbG3BAGlKgVFuqKQU3lyQLJ9ZIZkGUNZCIOEoWNebGJxM73kkC04BC+k7xIwpm8JD6/0GilNnG0ClzptT0Yg47zYC/0HYNN4Nh9s+CVwRRGPrcRF6kGkqWHHG9PEgyjjqRxO/Xvk2ObbDKX+ckJNqm3/08uR8cls582vv5c9U18+FXaYIeCJYEbIu/VDEG/AUL2Kv54CDD+AAAAAElFTkSuQmCC) no-repeat 0 center;
    border: none;
    cursor: pointer;
    margin: 15px 0;
    font-size: 1rem;
    font-weight: 600;
	padding: 6px;
    padding-left: 48px;
}
#current_address_info{
    padding: 10px;
    padding-left: 16px;
    margin: 10px 0;
}
#current_address_info p{
	font-size: 1.2rem;
    border-bottom: 1px solid #003049;
    padding: 10px;
    padding-left: 16px;
    margin: 10px 0;
}
#new_address_info{
    font-size: 1.2rem;
    border-left: 8px solid #003049;
    padding: 10px;
    padding-left: 16px;
    margin: 10px 0;
}
#dob_holder>div{
	width:52px;
	display: inline-block;
    margin-right: 10px;
	vertical-align: top;
}
#dob_holder>div:last-child{
	width: 68px;
    margin-right: 0;
}

.months_years>div{
	width:52px;
	display: inline-block;
    margin-right: 10px;
	vertical-align: top;
}
#addresses-step{
	display:none;
}

#allAddresses-cont{
	display:none;
}
.allAddresses-cont-div{
	margin-bottom: 15px;
}
.allAddresses-cont-div h4{
    background: #eee;
    padding: 3px 10px;
    margin: 3px 0;
}
.allAddresses-cont-div .address-cont{
	margin:0;
}
.ch-adrrs{
    font-weight: 600;
    margin-top: 10px;
    background: #eee;
    display: inline-block;
    background: #1C1C1C;
    color: #fff;
    padding: 6px 10px;
    -webkit-border-radius: 0.1em;
    border-radius: 0.1em;
}
#add-addrs{
	display:none;
}
#submit-address{
	display:none;
}
#submit-time{
	display:none;
}
#prev_addrrs{
	display:none;
}
#submit-all-add{
	display:none
}
#declaration-step{
	display:none;
}

#head-contacts{
    font-size: 12px;
    margin-top: 3px;
    text-align: right;
}
#head-contacts p {
    line-height: 1.2;
}
#head-phone-number:before {
    content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAMAAAAolt3jAAAAXVBMVEVHcEzn5+fg4ODm5uZ9fX0pKSkYGBiampqvr68ICAgzMzPV1dUgICA8PDxHR0ctLS1paWkODg5PT0/d3d2mpqZnZ2e+vr7AwMAZGRk+Pj51dXWCgoIAAACPj48AAAAzZt4jAAAAHnRSTlMABhcKf9fjYUnzxibfw7fQke+pIVeXQDrovIh3/W4drZYFAAAAeklEQVQI10WNVxKEMAxDlZgUSCiB7UX3PyYOWWbfh2yNLRtozP7bmrgY1bR8stV6I2cDo+1AlZ5kFillw9ADrAi2lQl86wpdqjcm4kUEcjxOSrayAp7s2o/6AXfNhtMoHevcPpw0f1U/asbZ/7wy/fajO+wFJ+FZfAR2NikIEFTkEtYAAAAASUVORK5CYII=);
    vertical-align: middle;
    margin-right: 5px;
}
#work-time {
    margin-right: 3px;
}
#work-time:before {
    content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAS1BMVEVHcEwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAC3i/cDAAAAGHRSTlMALuJB2IpNxwTufWUHlDhzn1JJvyIbEWq6kOOcAAAAjklEQVQY002OVxLEIAxDsTEttIQ03/+ka8im6AOhN7ZHSnV5Xav26pEmZ4wj/eSwwHlCC3+S0GYWGYtpAOsiD0VnB5gIJVFgpGkAmS/blhIw5wFm5r37zjxfK8zQXSauFW/X2D2u9u6m8VDqQP1WNdQaGfWRkV6fCDlIk7nc0WEtIZSKDi6wyHGQv1/k+QHBGQanI3NffQAAAABJRU5ErkJggg==);
    vertical-align: middle;
    margin-right: 3px;
    margin-left: 3px;
}
#head-email:before {
    content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAAOCAMAAAD6xte7AAAAS1BMVEVHcEwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAC3i/cDAAAAGHRSTlMARuHpOPBZITDcltiDP3v3S+PLZ3FPE7bxcQoPAAAAi0lEQVQY002OWRLEIAgFn0YluMQlG/c/6TiZMk5X8UFDwUPioJcJB1YI4klNyAuDXTsw2dvZsJCR7VWHFDBsQZGx6cRhrbAKULK/Cqt+HFzuDU77HQ2H2DeUePy5pH2NwXOaLvXPe68o5ufKowB6ThiY/pcoz9CbJWgsvt6XGVw3x9oD5xb0ILQs5wd4BwblNoHdUwAAAABJRU5ErkJggg==);
    vertical-align: middle;
    margin-right: 5px;
}
textarea{
    overflow: auto;
    min-height: 80px;
    margin-bottom: 20px;
}
#callbackform h5 {
    color: #a8a8a8;
    font-weight: normal;
	margin-top:10px;
}
.moblic-foot {
    background: #f3f2f1;
    color: #1C1C1C;
    text-align: center;
    padding: 1rem 0;
    border-top: 1px solid #dcdcdc;
}
#footer-about {
    border-bottom: 1px solid #e3e3e3;
    margin-bottom: 40px;
    padding-bottom: 20px;
}
#footer-about h2 {
    margin-bottom: 20px;
}
.moblic-foot a {
    display: inline-block;
    margin: 0 7px;
    color: #6c6c6c;
}
#moblic-menu:before {
    content: "\2630";
    display: inline-block;
    vertical-align: middle;
    color: #767676;
    font-size: 30px;
    line-height: 1;
    font-weight: 900;
    position: absolute;
    left: 22px;
}
.moblic-head {
    width: 100%;
	height: auto;
    line-height: 58px;
    font-size: 14px;
    background-color: #1a1b20;
    -webkit-box-shadow: 0 1px 0 0 rgb(0 0 0 / 20%);
    box-shadow: 0 1px 0 0 rgb(0 0 0 / 20%);
    padding: 0 10px;
    text-align: right;
}
.moblic-head #moblic-h-logo {
    width: 46%;
    float: left;
    text-align: left;
}
.moblic-head #moblic-h-logo a {
    display: block;
}
.moblic-head img {
    vertical-align: middle;
    max-width: 134px;
    height: auto;
}
#moblic-menu {
    display: inline-block;
    vertical-align: middle;
    width: 30px;
    height: 25px;
    position: relative;
    margin-right: 10px;
    margin-top: -10px;
    cursor: pointer;
}
#moblic-dllist {
    display: none;
    position: relative;
    float: right;
    text-align: right;
    width: fit-content;
    top: 6px;
	top: -6px;
}
#moblic-dllist ul {
    list-style: none;
    display: inline-block;
    vertical-align: middle;
}
#moblic-dllist ul li {
    position: relative;
    display: inline-block;
    text-align: center;
}
#moblic-dllist ul li a {
    display: block;
    padding: 0 5px;
    color: #a2a2a2;
    white-space: nowrap;
    text-decoration: none;
    text-transform: none;
    font-size: 14px;
    font-weight: 500;
}
#moblic-nllist {
    display: none;
    position: fixed;
    z-index: 1000;
    top: -100%;
    right: 0;
    width: 100%;
    padding: 0 1.5rem;
    border-bottom: 2px solid #babdd1;
    transition: top .3s;
}
#moblic-nllist.moblic-shoit {
    display: block;
    top: 60px;
    box-shadow: 0 3px 3px rgb(0 0 0 / 15%);
    -webkit-box-shadow: 0 0 5px 1px rgb(0 0 0 / 15%);
    background-color: #f3f2f2;
	top: 80px;
}
#moblic-nllist.moblic-shoit ul {
    display: block!important;
    padding: 4px 0;
}
#moblic-nllist.moblic-shoit ul li {
    display: block!important;
    position: relative;
    white-space: nowrap;
    text-decoration: none;
    font-weight: 300;
    text-align: left;
    font-size: 16px;
    line-height: 2;
    padding: 2px 0;
    margin: 3px 0 3px 0;
    transition: all 0.5s ease-in-out;
}
#moblic-nllist.moblic-shoit ul li a {
	display: block;
    text-transform: none;
    padding: 0 5px;
    color: #1765a9;
    white-space: nowrap;
    /* text-decoration: none; */
    font-weight: 600;
    line-height: 2;
    /* text-transform: uppercase; */
    transition: all 0.5s ease-in-out;
}
.moblic-services {
    text-align: left;
    padding-top: 100px;
    padding-bottom: 100px;
}
.moblic-services-head {
    margin-bottom: 40px;
}
.moblic-services-head h2, .simple-text h2 {
    font-size: 1.8rem;
    font-weight: 600;
    margin: 0 0 10px;
    line-height: 1;
	text-align: center;
}
.moblic-services-box {
    display: inline-block;
    padding: 20px;
    vertical-align: top;
    margin-top: 20px;
}
.moblic-services-box h2, .moblic-advantages-box h2 {
    font-size: 1.4rem;
    font-weight: 600;
    margin: 0 0 1rem;
    line-height: 1;
    color: #1565ab;
	border-top: 1px solid #e1e1e1;
	padding-top: 20px;
}
.moblic-services-box p, .moblic-advantages-box p, .simple-text p {
    font-size: 16px;
    opacity: .7;
}
.moblic-services-box:after, .moblic-quote-list>li:after {
    content: " ";
    float: none;
    clear: both;
    display: table;
}
.moblic-services-box p, .moblic-advantages-box p, .simple-text p {
    font-size: 16px;
    opacity: .7;
}
.sub-btn{
	position: relative;
    z-index: 2;
    overflow: hidden;
    display: inline-block;
    text-transform: uppercase;
    background-color: #003049;
    color: #fff;
    font-size: 16px;
    padding: 12px 40px;
    border-radius: 5px;
    letter-spacing: 0;
    width: fit-content;
	border: none;
    height: auto;
	cursor: pointer;
	margin: 0;
	font-weight: 600;
}
.sub-btn:before, .sub-btn:after{
	content: "";
    position: absolute;
    height: 100%;
    top: 0;
    left: 0;
    width: 50.1%;
    background-color: #72406c;
    z-index: -1;
    transition: all 0.4s ease-out;
    border-radius: 0;
}
.sub-btn:before{
	transform: scale(0) rotate(0);
}
.sub-btn:after{
	transform: scale(0) rotate(0);
    left: unset;
    right: 0;
}
.sub-btn:hover::before, .sub-btn:hover:after, .sub-btn.active::before, .sub-btn.active:after {
    border-radius: 0;
    transform: scale(1) rotate(360deg);
}
#ukr-fxcookie {
	padding: 1rem;
    background-color: #fffdf6;
    opacity: 1;
    width: 100%;
    text-align: center;
    position: fixed;
    bottom: 0;
    box-shadow: 0 -2px 5px rgba(0, 0, 0, .3);
	z-index: 1011;
}
#ukr-fxcookie>div {
    position: relative;
    padding: 5px 16px;
}
#ukr-fxcookie span {
	font-size: 13px;
    font-weight: 300;
    display: inline-block;
    vertical-align: middle;
    color: #444;
	max-width: 90%;
}
#ukr-fxcookie span a{
    display: inline-block;
    color: #212325;
    text-decoration: underline;
}
#ukr-fxcookie span a:hover{
	color: #003049;
	text-decoration: none;
}
#ukr-fxcookie .btn {
    display: block;
    width: fit-content;
    line-height: 1;
    background: none;
    margin: 0 auto;
    margin-top: 10px;
    padding: 3px 5px;
    border: 1px solid #003049;
    border-radius: 2px;
    font-size: 13px;
    color: #003049;
    cursor: pointer;
}
#ukr-fxcookie>div:after {
   content: "x";
    vertical-align: middle;
    position: absolute;
    right: -5px;
    top: -5px;
    cursor: pointer;
    color: #003049;
    border: 1px solid #003049;
    padding: 0 5px;
    border-radius: 2px;
    opacity: .7;
    font-size: 15px;
    line-height: 1;
    padding-bottom: 3px;

}
.clm-rev{
	flex-direction: column-reverse;
}

/*========== loading spiner =============*/
#loading-spinner {
	position: fixed;
	top: 0;
	left: 50%;
	width: 100%;
	transform: translate(-50%, 0);
	z-index: 1000;
	margin: 0 auto;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.85);
	animation: fadeIn 0.8s ease-in-out;
}
#loading-spinner h3{
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, 0%);
	font-size: 14px;
    font-weight: 400;
	color: #fff;
	width: 100%;
	line-height: 1;
	text-align: center;
}
#loading-spinner>div{
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, 0%);
}
.loader {
	display: inline-block;
	font-size: 34px;
	width: 18px;
	height: 18px;
	border-radius: 50%;
	position: relative;
	text-indent: -9999em;
	animation: mulShd8Spin 1.1s infinite ease;
	transform: translateZ(0);
}
.green-icon{
    color: #11a219;
}
.red-icon{
    color: #dc3545;
}
.yeloow-icon{
    color: #dc3545;
}

/*========== keyframes ==================*/

@keyframes mulShd8Spin {
	  0%,
	  100% {
		box-shadow: 0em -2.6em 0em 0em #fff, 1.8em -1.8em 0 0em rgba(255,255,255, 0.2), 2.5em 0em 0 0em rgba(255,255,255, 0.2), 1.75em 1.75em 0 0em rgba(255,255,255, 0.2), 0em 2.5em 0 0em rgba(255,255,255, 0.2), -1.8em 1.8em 0 0em rgba(255,255,255, 0.2), -2.6em 0em 0 0em rgba(255,255,255, 0.5), -1.8em -1.8em 0 0em rgba(255,255,255, 0.7);
	  }
	  12.5% {
		box-shadow: 0em -2.6em 0em 0em rgba(255,255,255, 0.7), 1.8em -1.8em 0 0em #fff, 2.5em 0em 0 0em rgba(255,255,255, 0.2), 1.75em 1.75em 0 0em rgba(255,255,255, 0.2), 0em 2.5em 0 0em rgba(255,255,255, 0.2), -1.8em 1.8em 0 0em rgba(255,255,255, 0.2), -2.6em 0em 0 0em rgba(255,255,255, 0.2), -1.8em -1.8em 0 0em rgba(255,255,255, 0.5);
	  }
	  25% {
		box-shadow: 0em -2.6em 0em 0em rgba(255,255,255, 0.5), 1.8em -1.8em 0 0em rgba(255,255,255, 0.7), 2.5em 0em 0 0em #fff, 1.75em 1.75em 0 0em rgba(255,255,255, 0.2), 0em 2.5em 0 0em rgba(255,255,255, 0.2), -1.8em 1.8em 0 0em rgba(255,255,255, 0.2), -2.6em 0em 0 0em rgba(255,255,255, 0.2), -1.8em -1.8em 0 0em rgba(255,255,255, 0.2);
	  }
	  37.5% {
		box-shadow: 0em -2.6em 0em 0em rgba(255,255,255, 0.2), 1.8em -1.8em 0 0em rgba(255,255,255, 0.5), 2.5em 0em 0 0em rgba(255,255,255, 0.7), 1.75em 1.75em 0 0em #fff, 0em 2.5em 0 0em rgba(255,255,255, 0.2), -1.8em 1.8em 0 0em rgba(255,255,255, 0.2), -2.6em 0em 0 0em rgba(255,255,255, 0.2), -1.8em -1.8em 0 0em rgba(255,255,255, 0.2);
	  }
	  50% {
		box-shadow: 0em -2.6em 0em 0em rgba(255,255,255, 0.2), 1.8em -1.8em 0 0em rgba(255,255,255, 0.2), 2.5em 0em 0 0em rgba(255,255,255, 0.5), 1.75em 1.75em 0 0em rgba(255,255,255, 0.7), 0em 2.5em 0 0em #fff, -1.8em 1.8em 0 0em rgba(255,255,255, 0.2), -2.6em 0em 0 0em rgba(255,255,255, 0.2), -1.8em -1.8em 0 0em rgba(255,255,255, 0.2);
	  }
	  62.5% {
		box-shadow: 0em -2.6em 0em 0em rgba(255,255,255, 0.2), 1.8em -1.8em 0 0em rgba(255,255,255, 0.2), 2.5em 0em 0 0em rgba(255,255,255, 0.2), 1.75em 1.75em 0 0em rgba(255,255,255, 0.5), 0em 2.5em 0 0em rgba(255,255,255, 0.7), -1.8em 1.8em 0 0em #fff, -2.6em 0em 0 0em rgba(255,255,255, 0.2), -1.8em -1.8em 0 0em rgba(255,255,255, 0.2);
	  }
	  75% {
		box-shadow: 0em -2.6em 0em 0em rgba(255,255,255, 0.2), 1.8em -1.8em 0 0em rgba(255,255,255, 0.2), 2.5em 0em 0 0em rgba(255,255,255, 0.2), 1.75em 1.75em 0 0em rgba(255,255,255, 0.2), 0em 2.5em 0 0em rgba(255,255,255, 0.5), -1.8em 1.8em 0 0em rgba(255,255,255, 0.7), -2.6em 0em 0 0em #fff, -1.8em -1.8em 0 0em rgba(255,255,255, 0.2);
	  }
	  87.5% {
		box-shadow: 0em -2.6em 0em 0em rgba(255,255,255, 0.2), 1.8em -1.8em 0 0em rgba(255,255,255, 0.2), 2.5em 0em 0 0em rgba(255,255,255, 0.2), 1.75em 1.75em 0 0em rgba(255,255,255, 0.2), 0em 2.5em 0 0em rgba(255,255,255, 0.2), -1.8em 1.8em 0 0em rgba(255,255,255, 0.5), -2.6em 0em 0 0em rgba(255,255,255, 0.7), -1.8em -1.8em 0 0em #fff;
	  }
}

@keyframes fadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

/*========== keyframes ==================*/

@media screen and (min-width:300px) {
	.moblic-head {
		font-size: 16px;
	}
	#qB #g-icons ul{
		max-width: calc(300px + 15%);
		margin: 0 auto;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-flow: row nowrap;
		flex-flow: row nowrap;
		-webkit-box-pack: justify;
		-ms-flex-pack: justify;
		justify-content: space-between;
	}
	#qB #g-icons li{
		padding: 0;
		text-align: center;
		cursor: pointer;
		border: none;
		-webkit-box-shadow: none;
		box-shadow: none;
		background: 0 0;
				width: 49%;
		max-width: 150px;
		margin: 0 0 10px;
	}
	#qB #g-icons li p{
		color: #fff;
		background-color: #113451;
		position: relative;
		text-align: center;
		display: inline-block;
		margin-top: -20px;
		padding: .3em 1.2em .4em 40px;
		border-radius: 4px;
		-webkit-box-shadow: none;
		box-shadow: none;
	}
	#qB #g-icons li:before {
		position: static;
		-webkit-box-shadow: none;
		box-shadow: none;
		display: block;
		margin: 0 auto;
		content: '';
		border-radius: 50%;
		background-size: auto 85%;
		padding-top: 100%;
		width: 100%;
		height: 0;
		background: #1a4f7b no-repeat 50% 100%;
		background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22146%22%20height%3D%22128%22%20viewBox%3D%220%200%20146%20128%22%3E%3Cpath%20fill%3D%22%23DFF2FD%22%20d%3D%22M9%20106c9.695-6.126%2044.65-14.322%2045-20-.35.207-.35-3.34%200-5h5s.893.953%200-7c-.243.326-6.305-1.273-7-13%20.412-.421-4.141%201.103-5-6%20.39-5.249-3.493-9.581%202-13l-3-8c.254.214-5.429-30.576%2011-26C50.018-.248%2095.983-8.438%2099%2018c-.03-.451%202.098%2013.58%200%2023-.03.183%206.682-.589%202%2012%20.193.237-2.269%209.465-6%208-.058-.607.56%2011.069-6%2013%20.592.048%201.017%206.262%201%207h6s.117%205.88%200%206c4.775%205.013%2039.236%2010.411%2045%2019%205.094%206.572%205%2012.397%205%2022H1s-1.309-16.325%208-22z%22%2F%3E%3C%2Fsvg%3E");
	}
	#qB #g-icons li+li:before{
		background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22131%22%20height%3D%22128%22%20viewBox%3D%220%200%20131%20128%22%3E%3Cpath%20fill%3D%22%23DFF2FD%22%20d%3D%22M120%20104c-10.76-3.186-21.638-6.81-26-10-3.796-1.913-2.784-5.453-4-8%20.628.684-5.705-2.168-8-2%200%200%20.314-6.636%200-7%209.006-1.777%2019-6%2019-6s-3.134-8.794-3-9c.206.206%204.772%205.5%207%207%20.267-.39-6.691-13.64-8-28-2.664-14.822-3.546-22.15-5-26-1.844-3.197-4.08-7.98-8-10-3.748-2.721-10.474-5.042-19-5-8.133.044-13.391%202.158-17%205-3.5%202.141-6.017%206.804-7%2010-2.316%203.85-2.478%207.737-5%2026-2.887%2017.8-9.131%2027.61-9%2028%202.367-1.5%207.286-7.435%207-7-.222%202.355-3%209-3%209s7.169%204.257%2019%206c-.135.237%200%207%200%207-2.154-.168-8.027%202.684-8%202-.623%202.547-1.424%206.346-4%208-2.863%202.93-12.994%206.196-26%2010-12.96%204.145-10.9%2023.736-11%2024h130c.044-.264-.005-20.473-11-24z%22%2F%3E%3C%2Fsvg%3E");
	}
	#qB #g-icons li p:before {
		position: absolute;
		top: 50%;
		left: 7px;
		display: block;
		content: '';
		background: #fff;
		width: 22px;
		height: 22px;
		margin-top: -11px;
		border-radius: 50%;
		-webkit-box-shadow: 0 0 0 4px #fff inset,0 0 0 5px currentcolor inset,0 0 0 1px currentcolor,0 0 0 2px #ccc;
		box-shadow: 0 0 0 4px #fff inset,0 0 0 5px currentcolor inset,0 0 0 1px currentcolor,0 0 0 2px #ccc;
		margin-top: 0;
		-webkit-transition: -webkit-transform .2s ease-in-out;
		transition: -webkit-transform .2s ease-in-out;
		transition: transform .2s ease-in-out;
		transition: transform .2s ease-in-out,-webkit-transform .2s ease-in-out;
		-webkit-transform: translateY(-50%) scale(.7);
		transform: translateY(-50%) scale(.7);
	}
	#qB #g-icons li p:after {
		position: absolute;
		bottom: 98%;
		left: 50%;
		margin-left: -10px;
		content: '';
		border: transparent solid 10px;
		border-bottom-color: #113451;
		width: 0;
		height: 0;
	}
	#qB #g-icons li.selected p{
		background-color: #1e9065;
	}
	#qB #g-icons li.selected p:after {
		border-bottom-color: #1e9065;
	}
	#qB #g-icons li.selected p:before {
		width: 14px;
		height: 22px;
		margin-top: -14px;
		margin-left: 4px;
		-webkit-transition: none;
		transition: none;
		-webkit-transform: rotate(45deg);
		transform: rotate(45deg);
		border: solid #fff;
		border-width: 0 5px 5px 0;
		border-radius: 0 0 0 4px;
		background: 0 0;
		-webkit-box-shadow: none;
		box-shadow: none;
	}
    .main-banner-txt-box {
        border: 4px solid #fff;
        border-radius: 18px;
        transform: translateY(32cqw);
        margin-top: clamp(-60px, -22cqw, -67cqw);
    }
    .ct-btn {
    }
    .arrcol1 svg, .arrcol2 svg {
        width: inherit;
        height: inherit;
    }
    .org-btn {
        font-size: 18px;
    }
}
@media screen and (min-width:400px) {
	.ukr-carousel-title {
		padding-bottom: 200px;
	}
/*==========simple reoprt==========*/
	.vehicle-section-table td {
		display: table-cell;
	}	
}
@media screen and (min-width:480px) {
	.main-banner-txt-box {
        transform: translateY(27cqw);
        margin-top: clamp(-92px, -22cqw, -67cqw);
    }
    .main-banner-col1 {
        padding-bottom: 2cqw;
    }
    .main-banner-btn {
        left: calc(50% - 100px);
        bottom: -22px;
    }
    .b-btn{
        height: 44px;
        line-height: 39px;
        font-size: 18px;
        border-radius: 22px;
        border: 2px solid #003049;
        outline: 8px solid #fff;
        border-top-width: thick;
        width: 200px;
    }
    
    #qB #h-desc li p{
		font-weight: bold;
		overflow: hidden;
		font-size: 20px;
	}
	#qB #h-desc li:after {
		padding-left: 40px;
	}
	.alert-static {
		margin: .4em 0 .2em 0;
	}
	.inf-head-txt h3 {font-size: 1.3em;}
	.small-table td:first-child {
        width: 30%;
    }
    .small-table {
       
    }

}
@media screen and (min-width:641px) {
	.moblic-head {
		padding: 0 15px;
	}
	.w10{width: 10%;}
	.w20{width: 20%;}
	.w30{width: 30%;}
	.w33{width: 33.1C1C1C3%;}
	.w40{width: 40%;}
	.w50{width: 50%;}
	.w60{width: 60%;}
	.w70{width: 70%;}
	.w80{width: 80%;}
	.w90{width: 90%;}
	.w100{width: 100%;}
	
	.pdr15{padding-right: 15px;}
	.pdl15{	padding-left: 15px;}
	.mgr15{margin-right: 15px;}
	.mgl15{margin-left: 15px;}
	.flex{
		display: flex;
		flex-direction: row;
		align-items: center;
		flex-wrap: nowrap;
	}
/*================================*/
	
	.main-banner-txt-box {
        transform: translateY(27cqw);
        margin-top: clamp(-92px, -22cqw, -67cqw);
    }
    .main-banner-col1 {
        padding-bottom: 2cqw;
    }
	
/*=================================*/
	.benefits-bg, .refunds-bg, .services-bg, .fuelprice-bg, .valuationdata-bg{
		height: 650px;
		background-position: 56% 40%;
	}
	.benefits-bg:before, .refunds-bg:before, .services-bg:before, .fuelprice-bg:before, .valuationdata-bg:before{
		padding-top: 650px;
	}
	#benefits-box {
		display: flex;
		flex-direction: row;
		align-items: stretch;
		flex-wrap: wrap;
		width: 100%;
		position: relative;
		margin-top: 20px;
		align-content: space-between;
		justify-content: center;
	}
	.benefits-box-content {
		width: calc(50% - 20px);
		margin-bottom: 20px;
		margin-right: 10px;
		margin-left: 0;
	}
	
	.benefits-box-content:nth-child(2){
		margin-right: 0;
		margin-left: 10px;
	}
	.benefits-box-content:nth-child(4){
		margin-right: 0;
		margin-left: 10px;
	}
/*================================*/
	.other-service{
		margin-bottom: 15px;
		margin-top: 25px;
	}
	.other-service h3{
		margin-bottom: 10px;
		font-size: 18px;
	}
	.nice-list{
		display: flex;
        flex-direction: row;
        align-items: stretch;
        flex-wrap: wrap;
        width: 100%;
        position: relative;
        justify-content: space-between;
	}
	.nice-list li{
		width: calc(50% - 10px);
	}
	.nice-list-box-content{
		height: 100%;
	}
	.nice-list-card{}
	.nice-list-title{}
	.nice-list-title h3{
		font-size: 18px;
		font-weight: 500;
	}
/*=================================*/
	.relate-container {
		display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
	}
	.relate-col1, .relate-col2 {
		display: flex;
		flex-direction: row;
		align-items: center;
		width: 50%;
		margin-bottom: 0;
	}
	.relate-cont {
		display: flex;
		flex-direction: row;
		align-items: center;
		margin-right: 10px; 
	}
	.relate-box2 {
		margin-left: -100px;
	}
	.relate-cont2 {
		margin-left: 10px;
	}
	.relate-txt-title{
		margin-bottom: 40px;
	}
	.relate-txt-title h2{
		font-size: 38px;
		line-height: 70px;
	}
	.relate-txt-content p{
		margin-bottom: 25px;
	}
	
/*================================*/
	.banner-col1 {
		width: 82%;
		margin-bottom: 25px;
		max-width: 1248px;
	}
	.banner-col1 h2{
		font-size: 38px;
        line-height: 56px;
        margin-bottom: 30px;
	}
/*================================*/
	.serv-bg1-title h2{
		font-size: 40px;
		line-height: 60px;
	}
	.serv-bg1-title p{
		font-size: 16px;
		
	}
	
/*================================*/
	#ukr-info {
		padding-top: 80px;
		padding-bottom: 80px;
	}
	.ukr-info-tile {
		margin-bottom: 45px;
	}
	#ukr-info h2 {
		font-size: 38px;
		line-height: 60px;
		text-align: center;
	}
	#ukr-info-box {
		display: flex;
		flex-direction: row;
		align-items: stretch;
		justify-content: space-between;
		flex-wrap: nowrap;
		margin-top: 0;
	}
	.ukr-info-box-content {
		width: 33.1C1C1C%;
		margin-bottom: 0;
	}
/*================================*/
	#contacts, #refunds {
		padding-top: 70px;
	}
	#callbackform {
		padding: 40px 25px 40px 25px;
	}
	#thx-box h2 {
		font-size: 38px;
		margin-bottom: 25px;
		line-height: 60px;
	}
	#callbackform p {
		line-height: 27px;
	}
/*================================*/

	.moblic-services-box {
		max-width: 660px;
		width: 100%;
		text-align: left;
	}
	.main-txt-title {
		width: 65%;
		margin-bottom: 35px;
	}
	.main-txt-title h1 {
		font-size: 40px;
		line-height: 56px;
	}
	.main-txt-content {}
	.main-txt p {
		font-size: 18px;
		line-height: 24px;
	}
	#details-cont, #res-cont{
		margin-bottom: 320px;
	}
	#thx p {
		margin-bottom: 1em;
		font-size: 16px;
	}
/*================================*/
	.ukr-section1-col3 ul li{
		width: calc(50% - 15px)
	}
	
	
}
@media screen and (min-width:767px) {
	.cont{
		padding: 0 35px;
	}
	#moblic-nllist.moblic-shoit {
		display: none;
	}
	.moblic-head {
		height: 75px;
	}
	.moblic-head #moblic-h-logo {
		width: 14%;
	}
	#moblic-menu {
		display: none;
	}
	#moblic-dllist {
		display: inline-block;
	}
	#moblic-nllist {
		position: static;
		right: 0;
		flex: 1;
		width: auto;
		max-width: 100%;
		height: auto;
		padding: 0;
		padding-right: 2rem;
		box-shadow: none;
		-webkit-box-shadow: none;
	}
	.ukr-feature-grid {
		display: flex;
        /*gap: 40px;*/
        margin-top: 70px;
        justify-content: center;
        flex-direction: row;
        align-items: stretch;

	}

	.ukr-feature-card {
        width: calc(50% - 40px);
        min-width: 340px;
        max-width: 360px;
	}
	
	
	/*----------- Section 1 ----------------*/
	#ukr-section1{
	}
	.ukr-section1-cont{
		padding: 0 35px;
        padding-top: 80px !important;
	}
	.ukr-section1-col1{
		margin-top: 20px;
		gap: 50px;
        height: unset;
    
	}
	.ukr-section1-col1-txt{
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		width: 100%;
		gap: 30px;
	}
	.ukr-section1-col1-txt h1{
		display: block;
		font-size: 36px;
		line-height: 40px;
		text-align: left;
	}
	.ukr-section1-col1-txt p{
		display: block;
		font-size: 17px;
		line-height: 24px;
		font-weight: var(--ukr-font-weight-regular);
		text-align: left;
	}
	.ukr-section1-btn{
		max-width: 350px;
	}
	.ukr-section1-col2-img::before {
		padding-bottom: 25px; 
	}
	.ukr-section1-col2-img::after {
		display: none;
	}
	.ukr-section1-col2-img img {
		position: relative;
		z-index: -1;
		overflow: visible;
	}
	.ukr-section1-col3 p {
		width: 100%;
		max-width: 550px;
	}

	/*----------- End Section 1 ------------*/
    /*----------- Simple Report ------------*/
    .simple-report-cont{
        padding: 0 35px;
    }
    .small-table td:first-child {
        width: 30%;
    }
    .small-table {
      
    }
    .sml-col1-section {
        width: 40%;
    }
     /*--------- END Simple Report -----------*/
	
	.main-txt-title {
		width: 65%;
		margin-bottom: 35px;
	}
	.main-txt-title h1 {
		font-size: 46px;
		line-height: 58px;
	}
	.main-txt-content {
		
	}
	.main-txt p {
		font-size: 18px;
		line-height: 26px;
		margin-bottom: 10px;
	}
	.main-txt h3 {
		font-size: 24px;
		line-height: 32px;
		margin-bottom: 8px;
		margin-top: 18px;
	}
	.main-img-center{max-width: 720px;}
	#details-cont, #res-cont{margin-bottom: 330px;}

    .main-banner-txt-content { width: clamp(150px, 100%, 490px); }
    .main-banner-txt-box {
        transform: translateY(50cqw);
        margin-top: -200px;
    }
    .presell-col3{
        left: 0;
        transform: translateX(14px);
        max-width: 500px;
    }
    .main-banner-img-left {
        top: 0;
        left: -37cqw;
        max-width: 62cqw;
    }
    
    .main-banner-img-right {
        top: 44cqw;
        left: 42cqw;
        max-width: 75cqw;
    }
    
	/*=======================================*/
	#ukr-section3-box{
		display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: stretch;
	}
	
	#ukr-section3 h2, #ukr-section5 h2 {
		font-size: 36px;
		font-weight: 600;
		margin-bottom: 30px;
	}
		
	.ukr-section4-colums {
		max-width: unset;
		gap: 50px;
    }
	.ukr-section4-container {
        display: flex;
        align-items: center;
	}
	.ukr-section4-tile {
		text-align: center;
	}
	.ukr-section4-col2{
		
	}
	.section4-btn {
	}
	
	#ukr-section4 h3 {
		text-align: left;
		margin: 0;
		margin-bottom: 32px;
	}
	#ukr-section4 h2 {
		text-align: center;
		padding: 0;
	}
	
	
	#ukr-section5-box{
		display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: stretch;
        justify-content: space-between;
	}
	.ukr-section5-box-content{
		width: calc(50% - 12px);
	}
	/*=======================================*/
	.four-step {
		display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: space-between;
        align-items: stretch;
	}
	.four-step-box {
		width: calc(50% - 20px);
	}
	.lat-line {
		margin-bottom: 70px;
	}
	.section7-card1 p {
		width: 70%;
		max-width: 70%;
	}
	/*=======================================*/
	.presell-col1{
		width: 70%;
	}
	.presell-col1 h2 {
		text-align: left;
	}
	.presell-col1 h3 {
		margin: 0;
		text-align: left;
	}
	.presell-col1 ul {
		padding-left: 0;
	}
	.presell-btn {
		margin: 0;
	}
	.presell-col2{
		max-width: 650px;
        margin: 0;
        margin-top: 15px;
	}
	.presell-col2 p{
		text-align: left;
		padding-bottom: 10px;
	}
	/*=======================================*/
	#info{
		padding: 2rem 0;
	}
	#info-box>div{
		width: 26%;
		margin-left: 10%;
	}
	#info-box>div:first-of-type {
		margin-left: 0;
	}
	#info-box>div>span {
		-webkit-transform: none;
		transform: none;
		margin: 0 auto;
	}
	#info-box>div>p{
		clear: left;
		font-size: 1em;
		margin-top: 1.4em;
		text-align: center;
		margin: 1em 0 0 0;
		float: none;
	}
	#a-box{
		/*width: 65%;*/
		min-height: 400px;
	}
	#a-footer>div{
		margin-top: .4em;
	}
	#thx .h2vers1{
		font-size: 26px;
	}
	
	#thx h2 {
		font-size: 26px;
	}
	#thx .h2vers1 {
		padding-left: 30px;
	}
	#thx .h3vers1 {
		padding: 20px;
		left: -20px;
		margin-bottom: 25px;
		line-height: 30px;
		width: calc(100% + 40px);
		padding-left: 30px;
	}
	#ch-addr-box p{
		font-size:16px!important;
		font-weight: 300;
	}
	
	
	.checkbox-group, .radio-group {
		font-size: 22px;
	}
	.s-list{
		font-size: 22px;
	}
	#nav .btn{
		font-size: 2.2em;
	}
	.alert-static p {
		font-size: 1em;
	}
	.alert-animate p {
		font-size: 1em;
	}
	.ukr-service-cards-holder {
		gap: 80px;
	}
	.grptype2, .clm-rev {
		display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		align-items: stretch;
		justify-content: space-evenly;
    }
	.ukr-services-title h2{
		text-align: center;
		font-size: 40px;
	}
	.ukr-subtext {
		text-align: center;
	}
	.service-list {
		display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: stretch;
	}
	.serv-bg1, .serv-bg2{
		width: calc(50% - 40px);
	}
	.services-col2{
		/*flex: 1 0 10%;*/
		height: auto;
	}
	.services-col1{
		align-items: flex-start;
	}

	
	
/*===== Carousel       ========*/
	.ukr-carousel-title {
        padding-bottom: 110px;
    }
	.ukr-carousel-track {
	}
	.ukr-slide-content{
		display: flex;
		flex-direction: row;
		align-items: center;
	}
	.ukr-slide-img {
		width: 50%;
	}
	.ukr-slide-text {
		display: flex;
		flex-direction: row;
		align-items: center;
		width: 70%;
		padding: 50px 30px;
		transform: translateY(0);
        transform: translateX(40px);
	}
	.ukr-slide-text span {
		display: none;
		top: 7px;
		width: 3px;
		padding-top: 60%;
		height: 100%;
	}
	.ukr-slide-text > div {	
		
	}
	.anim-translateTxt {
	  transform: translateX(0px) !important;
	}
}

@media screen and (min-width:992px) {
	.cont{
		/*max-width:992px;*/
	}
    .ukr-section1-cont {
        display: flex;
        padding: 0 40px;
        flex-direction: row;
        align-items: flex-start;
        flex-wrap: nowrap;
        justify-content: space-between;
		max-width: 1400px;
    }
	.ukr-section1-sm2 {
		width: 100%;
    }
    .ukr-section1-col3 {
        width: 200%;
    }
	
	.ukr-section1-col2-img::before {
		padding-bottom: 25px; 
	}
	.ukr-section1-col3 ul li {
        width: calc(33% - 30px);
    }
	.ukr-section2-content{
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		gap: 25px;
	}
	.ukr-section2-title{
		width: 50%;
		margin-bottom: 0;
	}
	.ukr-section2-txt{
		
	}
	.ukr-section2-title h2{
		text-align: center;
	}
	.ukr-feature-grid {
		display: flex;
        gap: 30px;
        margin-top: 80px;
		padding: 0;
	}
	.ukr-section10-row1{
		border-top-right-radius: 8rem;
	}
	.ukr-section10-row2{
		border-top-left-radius: 8rem;
	}
	
	.ukr-section10-row2 ul {
		gap: 40px;
		font-size: 32px;
		line-height: 36px;
	}
	.ukr-section10-row2 ul li a {
		font-size: 24px;
		line-height: 36px;
	}
	
/*================================*/
    .valid-vrm{
        display: flex;
        justify-content: center;
        flex-direction: row;
        align-items: flex-start;
        gap: 80px;
        margin-bottom: 100px;
        height: unset;
    }
    .vhs-content-section, .vhs-content-section-SM2O {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: 50px;
    }
    .small-info-conatiner{
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
    }
    .sim-report-data-title h1{
        font-size: 52px;
    }
    .sml-col1-section{
        width: 50%;
    }
    .sml-col2-section{
        width: fit-content;
    }
    .small-table {
       
    }
    .small-table td {
        padding: 2px 10px;
    }
    
     .vhs-col-section p, .vhs-col4-section p, .vhs-col3-section p{
        font-size: 16px;
    }
    .vhs-col1-section{
        display: flex;
        width: calc(50% - 25px);
    }
    .vhs-col2-section{
        display: flex;
        width: calc(50% - 25px);
    }
    .vehicle-section-image {
        width: 130%;
        max-width: 800px;
        height: auto;
        margin: 0; 
    }
    .ncap-stars {
        padding: 15px 30px;
        margin-bottom: 50px;
    }
    .ncap-stars span:first-child{
        font-size: 24px;
        margin-right: 23px;
    }
    .star {
        font-size: 60px;
        width: 50px;
    }
    .star.empt::after, .star.half::before, .star.empty::before  {
        top: -42px;
        left: 0;
    }

    .in-report-btn{
        justify-content: flex-end;
    }
    .vehicle-section-table, .mot-test-table{
        font-size: 15px;
    }
    
    .co2-label {
        font-size: 24px;
    }

    .vhs-col5-section {
        display: flex;
        flex-direction: row;
    }
    
/*================================*/
	.main-banner-txt-content {
        width: clamp(150px, 100%, 570px);
    }
	.main-banner-txt-box {
		transform: translateY(250px);
        margin-top: -200px;
    }
	.main-banner-col1 {
		padding-bottom: 15px;
    }
	.main-txt h3 {
		font-size: 26px;
		line-height: 35px;
		margin-bottom: 8px;
		margin-top: 18px;
	}
	.main-banner-col1 .m1 {
		padding-right: 10px;
	}
	
	.main-banner-col1 h1 {
		font-size: 105px;
	}
	.main-banner-col1 h3 {
		font-size: 60px;
	}
	.main-banner-col1 h4{
		font-size: 24px;
		bottom: 7px;
	}
	.main-banner-col2 h3 {
		padding: 24px 0;
		font-size: 34px;
		transform: translateX(30px);
	}
/*================================*/
	.ukr-section4-colums{}
	.ukr-section4-container {}
	.section4-btn {}
	#ukr-section4 h3 {}
	#ukr-section4 h2 {}
	#ukr-section5-box {
        flex-wrap: nowrap;
    }
	.ukr-section5-box-content {
        width: calc(25% - 12px);
    }
	.four-step-box {}
	.section7-card1 p {
		width: 80%;
		max-width: 80%;
	}
/*================================*/
	.ukr-section8-box-content{
		display: flex;
		flex-direction: row;
		flex-wrap: wrap;
		align-items: stretch;
		gap: 30px;
		justify-content: center;
	}
	.section8-card1, .section8-card2, .section8-card3{
		width: calc(50% - 25px);
	}

/*================================*/
	.benefits-bg, .refunds-bg, .services-bg, .fuelprice-bg, .valuationdata-bg{
		height: 700px;
		background-position: 60% 40%;
	}
	.benefits-bg:before, .refunds-bg:before, .services-bg:before, .fuelprice-bg:before, .valuationdata-bg:before{
		padding-top: 700px;
	}
	.benefits-tile{
		margin-bottom: 40px;
	}
	#benefits h2{
		font-size: 42px;
	}
	#benefits-box {
		display: flex;
		flex-direction: row;
		align-items: stretch;
		flex-wrap: wrap;
		width: 100%;
		position: relative;
		margin-top: 20px;
		align-content: space-between;
		justify-content:  space-between;
	}
	.benefits-box-content {
		width: calc(25% - 20px);
		margin-bottom: 0;
		margin-right: 10px;
		margin-left: 10px;
	}
	
	.benefits-box-content:last-child{
		margin-right: 0;
		margin-left: 10px;
	}
	.benefits-box-content:first-child{
		margin-right: 10px;
		margin-left: 0;
	}
	.benefits-box-content:nth-child(2) {
        margin-right: 10px;
        margin-left: 10px;
    }
/*================================*/

	.other-service{margin-bottom: 15px;margin-top: 25px;}
	.other-service h3{font-size: 24px;}
	.offer-list{
		display: flex;
		flex-direction: row;
		align-items: stretch;
		justify-content: space-between;
		flex-wrap: wrap;
	}
	.offer-list li {
		display: flex;
		align-items: flex-start;
		width: calc(50% - 10px);
		flex-wrap: wrap;
	}
	
	.btn-cancel {
		font-size: 16px;line-height: 30px;
	}
	.banner-col1 {
		width: 60%;
	}
	.main-txt-title {
		width: 65%;
		margin-bottom: 35px;
	}
	.main-txt-title h1 {
		font-size: 50px;
		line-height: 70px;
	}
	.moblic-services-box {
		text-align: left;
		margin-top: 0;
		width: calc(33.33% - 5px);
	}
	.grptype2, .clm-rev {}
	.services-col1 h2{
		font-size: 22px;
		line-height: 28px;
	}
	.serv-bg1{}
	.serv-bg2{}
	#callbackform .callbackform-row1{
		display: flex;
        flex-direction: row;
        justify-content: space-between;
        gap: 25px;
	}
	#callbackform .callbackform-col1{
		width: 50%;
        margin-bottom: 0;
	}
	
	#callbackform .callbackform-col2{}
	#thx p {
		font-size: 16px;
	}
}

@media screen and (min-width:1200px) {
	.cont{
		padding: 0 40px
	}
    /*
	.ukr-section1-cont {
        display: flex;
        padding: 0 40px;
        flex-direction: row;
        align-items: flex-start;
        flex-wrap: nowrap;
        justify-content: space-between;
		max-width: 1400px;
    }
	.ukr-section1-sm2 {
		width: 100%;
    }*/
	.pza{
		position: absolute;
		top: 0;
		right: 0;
		width: 50%;
	}
    .ukr-section1-col3 {
        width: 100%;
    }
	.ukr-section1-col3 ul li {
		width: calc(25% - 15px);
    }
	.ukr-section1-col2 {
        position: absolute;
        top: 0;
        right: 0;
    }
	.ukr-section1-col2-img{
		overflow: hidden;
	}
	.ukr-section1-col2-img img {
		float: right;
		left: unset;
		/*right: -10%;*/
		width: 110%;
	}
	.ukr-section1-col2-img::before {
		padding-bottom: 40px; 
	}
    .ukr-feature-grid {
        display: flex;
        gap: 30px;
        margin-top: 80px;
        padding: 0;
    }
    .ukr-feature-card {
        width: calc(25% - 40px);
        min-width: 230px;
        max-width: 450px;
    }
	
    /*----------- Simple Report ------------*/
    .simple-report-cont{
        padding: 0 40px;
    }
    #report-out-data, #repeat-check{
        padding: 100px 40px;
    }

    .bardiv {
        width: calc(100% + 80px);
        height: 5px;
       /* background-color: #E63946;*/
        left: -40px;
        margin-bottom: 50px;
    }
    .vhs-title-section h2 {
        /*width: 60%;*/
        position: relative;
        width: calc(100% + 80px);
        left: -40px;
    }

    .sml-col1-section{
        width: 50%;
    }


    .small-table {
        
    }
    .small-table td {
        padding: 3px 10px;
    }


    /*--------- END Simple Report -----------*/
	.ukr-feature-section {
		padding: 100px 0;
	}
	.relate-box2 {
        margin-left: -250px;
    }
	.main-bg {
		height: 800px;
		background-position: 50% 50%;
	}
	.main-bg:before {
		padding-top: 800px;
	}
	.main-txt-title {
		width: 65%;
		margin-bottom: 50px;
	}
	.main-img-center{max-width: 790px;}
	.benefits-bg, .services-bg, .fuelprice-bg, .valuationdata-bg{
		height: 700px;
		background-position: 50% 37%;
	}
	.benefits-bg:before, .services-bg:before, .fuelprice-bg:before, .valuationdata-bg:before{
		padding-top: 700px;
	}
	.ukr-section4-container {
		
	}
	.ukr-section4-col2{
		
	}
	.ukr-section4-col2-img {
		width: 100px;
		height: 100px;
	}
	
	#ukr-section3 h2, #ukr-section5 h2 {
		font-size: 42px;
        margin-bottom: 45px;
        margin-top: 40px;
	}
	#ukr-section3-box, #ukr-section5-box {
		max-width: unset;
	}
	.ukr-section3-box-content{
		width: calc(33% - 30px);
	}
	.info-bg {margin-top: 60px; width: 58%;}
	#a-box{	}
	#details-cont, #res-cont{margin-bottom: 350px;}
	
	.four-step-box {
		width: calc(25% - 40px);
        
	}
	.serv-bg1, .serv-bg2{
		width: calc(33% - 60px);
	}
	.ukr-section10-row2 p{
		font-size: 16px;
	}
	.slidebg1, .slidebg2, .slidebg3, .slidebg4{
		background-image: url(/hpi/v1/files/carousel-section-mobile-bg5.jpg);
	}
	.slidebg2{
		background-image: url(/hpi/v1/files/carousel-section-mobile-bg6.jpg);
	}
	.slidebg3{
		background-image: url(/hpi/v1/files/carousel-section-mobile-bg7.jpg);
	}
	.slidebg4{
		background-image: url(/hpi/v1/files/carousel-section-mobile-bg8.jpg);
	}
	
}
@media screen and (min-width:1400px) {
	.cont{
		max-width:1440px;
		padding: 0 60px
	}
	.ukr-section1-sm2 {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
	}
	.ukr-section1-col1 {
		float: right;
		width: 100%;
        max-width: 670px;
		padding-right: 50px;
	}
	.ukr-section1-col2-img::before {
		padding-bottom: 60px; 
	}
	.ukr-section1-col2-img img{
		width: 115%;
        max-width: 800px;
	}
	.ukr-section1-col1-txt {
		gap: 50px;
	}
	.ukr-section1-col1-txt h1 {
		font-size: 48px;
		line-height: 56px;
		font-weight: bold;    
	}
	.ukr-feature-section {
		padding: 120px 0;
	}
	.ukr-feature-card {
		width: calc(25% - 45px);
        flex: 1 1 285px;
    }
	.ukr-section2-content{
		padding-top: 60px;
	}
	.ukr-section2-title h2, #ukr-section7-box h2{
		font-size: 52px;
	}
	
	#callbackform .callbackform-col1 h2{
		font-size: 52px;
	}
	.ukr-section2-title h2 {
        font-size: 52px;
    }
	.ukr-section8-tile h3{
		font-size: 24px;
		margin-bottom: 35px;
	}
/*================================*/
    /*----------- Simple Report ------------*/
    .simple-report-cont{
        padding: 0 50px;
    }
     #report-out-data, #repeat-check{
        padding: 100px 50px;
    }
    .bardiv {
        width: calc(100% + 100px);
        height: 10px;
        left: -50px;
        margin-bottom: 50px;
    }
    .vhs-title-section h2 {
        position: relative;
        width: calc(100% + 100px);
        left: -50px;
        font-size: 15px;
        padding: 5px 0;
    }
     .sml-col1-section{
        width: 50%;
    }
    .sml-col2-section{
        border: 3px dotted #1C1C1C;
    }
    .small-table {
        
    }
    .small-table td {
       
    }
    .small-table tr:first-child td, .small-table tr:first-child th {
        padding-top: 10px;
    }
    .small-table tr:last-child td, .small-table tr:last-child th {
        padding-bottom: 10px;
    }
    
    /*--------- END Simple Report -----------*/
	.main-bg-ct, .main-bg-rf{
		height: 400px;
		background-position: 50% 64%;
	}
	.main-bg-ct:before, .main-bg-rf:before{		
		padding-top: 400px;
	}
	.main-txt-title-ct{
		padding-left: 0;
	}
	.main-txt-title-ct h1{
		font-size: 54px;
	}
	.main-txt p {
		font-size: 20px;
		line-height: 30px;
	}
	.main-txt h3 {
		font-size: 30px;
		line-height: 40px;
		margin-top: 20px;
	}
	
/*================================*/
	
	.main-txt-title {
		width: 65%;
		margin-bottom: 60px;
	}
    .main-banner-txt-content {
        width: clamp(150px, 100%, 670px);
    }

    .main-banner-txt-box {
        transform: translateY(260px);
        margin-top: -200px;
    }
    .main-banner-col1{
        padding-bottom: 10px;
    }
    .main-banner-col1 ul {
        justify-content:  space-evenly;
    }
    .main-banner-col1 .m1{
        padding-right: 10px;
    }
    .main-banner-col1 h1 {
        font-size: 115px;
        line-height: 0.9;
    }
    .main-banner-col1 h4 {
        line-height: 1;
        bottom: 8px;
        font-size: 30px;
    }
    .main-banner-col1 h3 {
        font-size: 70px;
        bottom: 1px;
    }
    .main-banner-col1 h3 span {
        font-size: 0.4em;
    }
    .main-banner-col2 h3 {
        line-height: 0.8;
        padding: 25px 0;
        font-size: 38px;
        transform: translateX(-5px);
    }

    .main-banner-img-left {
        left: -185px;
        max-width: 300px;
    }
    .main-banner-img-right {
        top: 200px;
        left: 400px;
        max-width: 420px;
    }

	.benefits-bg, .services-bg, .fuelprice-bg, .valuationdata-bg{
		height: 800px;
		background-position: 50% 37%;
	}
    #benefits h2, .ukr-feature-section h2 {
		font-size: 48px;
	}
	.benefits-bg:before, .services-bg:before, .fuelprice-bg:before, .valuationdata-bg:before{
		padding-top: 800px;
	}
	#details-cont, #res-cont{
		margin-bottom: 400px;
	}
	.main-img-center{max-width: 910px;}
	
	
}


@-webkit-keyframes spin {
	0% {transform: rotate(0);}
	100% {transform: rotate(360deg);}
}
@keyframes spin {
	0% {transform: rotate(0);}
	100% {transform: rotate(360deg);}
}
@-webkit-keyframes jumpAni {
	0% {transform: translateY(0);}
	40% {transform: translateY(-30px);}
	100% {transform: translateY(0);}
}
@keyframes jumpAni {
	0% {transform: translateY(0);}
	40% {transform: translateY(-30px);}
	100% {transform: translateY(0);}
}


@-webkit-keyframes fInR {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fInR {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes glint { 0% { background-color: rgba(255,255,255,0.4); } 100% { width: 100%;background-color: rgba(255,255,255,0); } }
@-webkit-keyframes glint { 0% { background-color: rgba(255,255,255,0.4); } 100% { width: 100%;background-color: rgba(255,255,255,0); } }
@-webkit-keyframes pulse{from{ -webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}10%{ -webkit-transform:scale3d(1.05,1.05,1.05);transform:scale3d(1.05,1.05,1.05)}
15%{ -webkit-transform:scale3d(0.90,0.90,0.90);transform:scale3d(0.90,0.90,0.90)}40%{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}to{-webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}
}
@keyframes pulse{from{transform:scale3d(1,1,1)}10%{transform:scale3d(1.05,1.05,1.05)}
15%{transform:scale3d(0.90,0.90,0.90)}40%{transform:scale3d(1,1,1)}to{transform:scale3d(1,1,1)}
}
@-webkit-keyframes pulseSmooth{0%{-webkit-transform:translate3d(0,0,0) scale(1);transform:translate3d(0,0,0) scale(1)}33.1C1C1C3%{-webkit-transform:translate3d(0,0,0) scale(1.1);transform:translate3d(0,0,0) scale(1.1)}66.6666%{-webkit-transform:translate3d(0,0,0) scale(1);transform:translate3d(0,0,0) scale(1)}100%{-webkit-transform:translate3d(0,0,0) scale(1);transform:translate3d(0,0,0) scale(1)}}@keyframes pulseSmooth{0%{-webkit-transform:translate3d(0,0,0) scale(1);transform:translate3d(0,0,0) scale(1)}33.1C1C1C3%{-webkit-transform:translate3d(0,0,0) scale(1.1);transform:translate3d(0,0,0) scale(1.1)}66.6666%{-webkit-transform:translate3d(0,0,0) scale(1);transform:translate3d(0,0,0) scale(1)}100%{-webkit-transform:translate3d(0,0,0) scale(1);transform:translate3d(0,0,0) scale(1)}}
.pulse{
	animation-iteration-count: infinite;
    animation-duration: 2s;
    animation-name: pulse;
	-webkit-animation-iteration-count: infinite;
    -webkit-animation-duration: 2s;
    -webkit-animation-name: pulse;
}
.pulse-once{
	animation-iteration-count: 1;
    animation-duration: 3s;
    animation-name: pulse;
	-webkit-animation-iteration-count: 1;
    -webkit-animation-duration: 3s;
    -webkit-animation-name: pulse;
}
.pulse-once-smooth{
	animation-iteration-count: 1;
    animation-duration: 2s;
    animation-name: pulseSmooth;
	-webkit-animation-iteration-count: 1;
    -webkit-animation-duration: 2s;
    -webkit-animation-name: pulseSmooth;	
}
@-webkit-keyframes bounce {
  from, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-4px,0);
    transform: translate3d(0,-4px,0);
  }
}

@keyframes bounce {
  from, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
  }

  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0,-4px,0);
    transform: translate3d(0,-4px,0);
  }
}
.sAnim{
	animation:  bounce 1.4s ease-out 7 forwards;
	-webkit-animation:  bounce 1.4s ease-out 7 forwards;
}
@keyframes blink {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}
@-webkit-keyframes blink {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}
#st-pay, #stopformwrapper{
	display:none;
	text-align:center;
	padding: 20px 0;
}
#st-pay form {
	display: inline-block;
  width: 30vw;
  min-width: 500px;
  align-self: center;
  /*box-shadow: 0px 0px 0px 0.5px rgba(50, 50, 93, 0.1),
    0px 2px 5px 0px rgba(50, 50, 93, 0.1), 0px 1px 1.5px 0px rgba(0, 0, 0, 0.07);
  border-radius: 7px;*/
  padding: 20px;
}

#st-pay .hidden {
  display: none;
}

#st-pay #payment-message {
  color: rgb(105, 115, 134);
  font-size: 16px;
  line-height: 20px;
  padding-top: 12px;
  text-align: center;
}

#st-pay #payment-element {
  margin-bottom: 24px;
}

/* Buttons and links */
#st-pay button {
  background: #00703c;
  font-family: inherit;
  color: #ffffff;
  border-radius: 4px;
  border: 0;
  padding: 12px 16px;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  display: block;
  transition: all 0.2s ease;
  box-shadow: 0px 4px 5.5px 0px rgba(0, 0, 0, 0.07);
  width: 100%;
}
#st-pay button:hover {
  filter: contrast(115%);
}
#st-pay button:disabled {
  opacity: 0.5;
  cursor: default;
}

/* spinner/processing state, errors */
.spinner,
.spinner:before,
.spinner:after {
  border-radius: 50%;
}
.spinner {
  color: #ffffff;
  font-size: 22px;
  text-indent: -99999px;
  margin: 0px auto;
  position: relative;
  width: 20px;
  height: 20px;
  box-shadow: inset 0 0 0 2px;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}
.spinner:before,
.spinner:after {
  position: absolute;
  content: "";
}
.spinner:before {
  width: 10.4px;
  height: 20.4px;
  background: #5469d4;
  border-radius: 20.4px 0 0 20.4px;
  top: -0.2px;
  left: -0.2px;
  -webkit-transform-origin: 10.4px 10.2px;
  transform-origin: 10.4px 10.2px;
  -webkit-animation: loading 2s infinite ease 1.5s;
  animation: loading 2s infinite ease 1.5s;
}
.spinner:after {
  width: 10.4px;
  height: 10.2px;
  background: #5469d4;
  border-radius: 0 10.2px 10.2px 0;
  top: -0.1px;
  left: 10.2px;
  -webkit-transform-origin: 0px 10.2px;
  transform-origin: 0px 10.2px;
  -webkit-animation: loading 2s infinite ease;
  animation: loading 2s infinite ease;
}

@-webkit-keyframes loading {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes loading {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@media only screen and (max-width: 600px) {
  #st-pay form {
    width: 80vw;
    min-width: initial;
  }
}

@media print {
  .ukr-help-section, #ukr-section4, #btn-home, #loading-spinner {
    display: none !important;
  }
}