.offer {
	max-width: 75rem;
	margin: 0 auto;
}

.offer-tabs {
	margin: var(--30px) var(--30px) 0 var(--30px);
}



.offer-tabs ul {
	max-width: 75rem;
	margin: 0 auto;
	list-style: none;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	grid-gap: var(--10px);
	background: #f8f8f8;
	position: relative;
	z-index: 1;
}
	.offer-tabs li {
		position: relative;
	}
		.offer-tabs a {
			width: 100%;
			padding: var(--20px) var(--15px);
			border: var(--2px) solid var(--color-base);
			border-bottom: 0;
			background: var(--color-grey-300);
			text-transform: uppercase;
			font-size: var(--18px);
			outline: none;
			transition: all .3s ease; 
			pointer-events: none;
			opacity: .6;
			display: block;
	    text-align: center;
	    font-weight: 500;
	    color: #000;
		}
		.offer-tabs a:hover {
			background: var(--color-grey-200);
		}
		.offer-tabs a.selected,
		.mode-resume .offer-tabs a[data-target="5"] {
			background: #fff;
			border-color: var(--color-grey-200);
			border-bottom-color: #fff;
		}
		.offer-tabs a.selected::after {
			display: block;
			height: var(--4px);
			content: "";
			background: #fff;
			position: absolute;
			bottom: var(---3px);
			right: var(--2px);
			left: var(--2px);
			pointer-events: none;
		}
		.offer-tabs a.selected,
		.offer-tabs a.actived {
			pointer-events: all;
			opacity: 1;
		}








	.step button {
		background: var(--color-grey-100);
		border: var(--2px) solid transparent;
		transition: all .3s ease;
		outline: 0;
		width: 100%;
	}
		.step button.selected {
			border-color: var(--color-amber-400);
    	background: #fff;
		}
		.step button:not(.selected):hover {
			border-color: var(--color-grey-400);
		}








.step {
	display: none;
	z-index: 0;
	background: #fff;
	margin-bottom: var(--15px);
	padding: var(--30px);
	border: var(--2px) solid var(--color-grey-200);
}
.step.open {
	display: block;
}
	.step header {
		color: #000;
	}
		.step h2 {
			font-weight: 500;
			font-size: var(--32px);
			line-height: var(--48px);
		}
		.step h3 {
			font-size: var(--19px);
			line-height: var(--28px);
			font-weight: normal;
		}
		.step strong {
			color: var(--color-pink-a400);
		}
		.step hr {
			margin: 0 0 var(--15px) 0;
		}
		.step:not([data-step="1"]) button {
			padding: var(--5px) var(--30px);
		}

.step.disabled {
	opacity: .6;
}
	.step.disabled h3 {
		display: none;
	}






.table-step {
	width: 100%;
}
	.table-step thead tr th {
		text-transform: uppercase;
		font-family: var(--font-secondary);
		font-weight: 600;
		padding: var(--15px);
		vertical-align: middle;
		font-size: var(--13px); 
		background: var(--color-grey-400);
		color: #000;
	}
	.table-step tbody tr td {
		font-size: var(--14px);
		background: #fff;
		padding: var(--4px) 0 var(--4px) var(--15px);
		vertical-align: middle;
		border-bottom: var(--2px) solid var(--color-grey-200);	
		transition: background .3s ease;
		color: #000;
		font-weight: 500;
	}
	.table-step tbody tr:not(.selected):hover td:not([rowspan]) {
		background: var(--color-grey-100);
		border-color: var(--color-grey-300);
	}
	.table-step tbody tr:not(.selected):hover button {
		background: var(--color-grey-300);
	}
	.table-step tbody tr:not(.selected) button:hover {
		border-color: var(--color-amber-400);
		background: #fff;
	}
	

	.table-step tbody tr.selected td:not([rowspan]) {
		background: var(--color-amber-50);
		border-color: var(--color-amber-100);
	}
	.table-step tbody tr.selected button {
		background: #fff;
	}
	.table-step tbody tr button.selected {
		background: var(--color-amber-800);
		border-color: var(--color-amber-800);
		color: #fff;
	}
	.table-step tbody tr.selected button:not(.selected):hover {
		border-color: var(--color-400);
	}




															
														/*			.table-step tbody tr:not(.selected):hover td:not([rowspan]) {
																																				background: var(--color-grey-100);
																																				border-color: var(--color-grey-300);
																																			}
																																			.table-step tbody tr:not(.selected):hover button {
																																				border-color: var(--color-amber-400);
																																				background: #fff;
																																			}
																																			.table-step tbody tr:not(.selected) button:hover {
																																				border-color: var(--color-amber-400);
																																				background: #fff;
																																			}
																																			

																																			.table-step tbody tr.selected td:not([rowspan]) {
																																				background: var(--color-amber-50);
																																				border-color: var(--color-amber-100);
																																			}
																																			.table-step tbody tr.selected button {
																																				background: #fff;
																																			}
																																			.table-step tbody tr button.selected {
																																				background: var(--color-amber-800);
																																				border-color: var(--color-amber-800);
																																				color: #fff;
																																			}
																																			.table-step tbody tr.selected button:not(.selected):hover {
																																				border-color: var(--color-400);
																																			}



*/














































	.table-step .min {
		width: 1%;
		text-align: center;
	}

	.table-step td.min {
		white-space: nowrap;
	}



.groups {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-template-rows: 1fr;
	grid-gap: var(--10px);
}
	.groups button {
		display: block;
		font-size: var(--25px);
		padding: var(--50px) var(--10px);
	}






footer.resume {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	padding: var(--15px) var(--60px);
	background: #333;
	color: #fff;
	transform: translateY( 100% );
	transition: all .3s ease;
}
	footer.resume .box {
		max-width: 75rem;
		margin: 0 auto;
		display: grid;
		grid-template-columns: auto 1fr;
		grid-gap: var(--10px);
		color: #fff;
		font-size: var(--28px);
		font-weight: 500;
	  line-height: var(--42px);
		text-align: right;
	}
	footer.resume .buttons > * {
		float: left;
		margin-right: var(--10px);
	}
body.show-resume footer.resume {
	transform: translateY( 0 );
}
body.show-resume {
	padding-bottom: var(--100px);
}














.mode-resume .step {
	display: block;
	border-top: 0;
	border-bottom: 0;
	margin: 0;
	/*cursor: pointer;*/
	padding-top: var(--15px);
	padding-bottom: var(--30px);
}
.mode-resume .step[data-step="5"] {
	padding-top: var(--45px);
}
.mode-resume .step:last-child {
	border-bottom: var(--2px) solid var(--color-grey-200);
}
.mode-resume .hide-resume,
.mode-resume h3 {
	display: none;
}
.mode-resume h2 {
	font-size: var(--26px);
	line-height: var(--32px);
}

.mode-resume .step header,
.mode-resume .step main {
	/*pointer-events: none;*/
}
.mode-resume .step main {
	cursor: pointer;
}


	.mode-resume .step:not([data-step="1"]) button:not(.selected) {
		opacity: 0;
	}



.mode-resume .step:not([data-step="5"]):hover .groups button,
.mode-resume .step:not([data-step="5"]):hover .table-step td {
background: var(--color-blue-50);
border-color: var(--color-blue-100);
}



.mode-resume .table-step tbody tr.selected td {
		background: #fff;
		border-color: var(--color-grey-200);
	}


.mode-resume .table-step tbody tr button.selected {
	background: #fff;
	border-color: var(--color-grey-400);
	color: #000;
}


.mode-resume .groups button.selected {
	font-size: var(--14px);
  background: #fff;
  padding: var(--13px) 0 var(--13px) var(--15px);
  vertical-align: middle;
  border: 0;
  border-bottom: var(--2px) solid var(--color-grey-200);
  transition: background .3s ease;
  color: #000;
  font-weight: 500;
  grid-column: span 4;
  text-align: left;
  display: block;


}

.mode-resume footer.resume {
	display: block;
}


.special-form input,
.special-form select {
	border-top: 0 !important;
	border-left: 0 !important;
	border-right: 0 !important;
	border-bottom-color: var(--color-grey-100);
	padding-left: 0;
	border-radius: 0;
	font-size: var(--20px);
	min-height: var(--36px);
	height: var(--36px);
	line-height: var(--10px);
	padding: 0;
	margin-bottom: var(--15px);
}

.step .total,
.step .total:hover,
.step .total:focus {
	border: 0;
	border-bottom: var(--2px) solid #ffc928;
	text-align: right;
	font-size: var(--24px);
}






.btn-white {
	background: #fff;
	border-color: #fff;
	color: #000;
}

.btn-white:hover {
	background: var(--color-50);
	border-color: var(--color-50);
	color: #000;
}




.status {
	color: #000 !important;
	font-weight: 500;
}
	.status-1 {
		background: var(--color-amber-100) !important;
	}
	.status-2 {
		background: var(--color-blue-100) !important;
	}
	.status-3 {
		background: var(--color-green-a100) !important;
	}
	.status-4 {
		background: var(--color-red-100) !important;
	}







@media (max-width: 1024px)  {
	
	.offer-tabs {
		margin: var(--30px) var(--15px) 0 var(--15px);
	}

.offer-tabs ul {
	grid-gap: var(--4px);
}

	.step {
	padding: var(--15px);
	}
	.step h2 {
    font-size: var(--20px);
    line-height: var(--24px);
}
.step h3 {
    font-size: var(--16px);
    line-height: var(--21px);
}


.groups {
	grid-template-columns: 1fr;
}
.groups button {
	padding: var(--20px) var(--5px);
	font-size: var(--18px);
}




}

input[type="file"] {
    padding: 3px 0 0 4px;
    line-height: 2;
}