		body{
			background-color:#c5e4d7;
		}
		.registration-container {	
			margin: 120px 0;
			border-radius: 40px;
			  
			background: #fff;
			padding: 40px;
			box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
			max-width: 600px;
			width: 100%;
	  
        }
        .tabs .nav-link {
            flex: 1;
            text-align: center;
        }
        .btn-primary {
            background-color: #28a745;
            border: none;
        }
        .btn-primary:hover {
            background-color: #218838;
        }
        .text-muted {
            font-size: 0.9rem;
        }
        .pagination {
            justify-content: center;
            margin-top: 10px;
        }
		#text_sign_up{
			font-size: 32px;
			font-weight: 700;
		}
		.text_2{
			font-size: 16px;
		}
		.form-control:focus {
		  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.25);
		  border-color: #2f9c63;
		}
		.mb_20{
			margin-bottom:32px !important;
		}
		.mb_10{
			margin-bottom:10px !important;
		}
		/*-------------------------------------------------------------------------------------------------------*/
		
		.nav-tabs {
			background-color: #F5F7F9;
			display: flex;
			justify-content: center;
			padding: 10px;
			border-radius: 10px;
			gap: 10px;
		}

		.nav-tabs .nav-item {
			flex: 1;
		}

		.nav-tabs .nav-link {
			background-color: #ffffff;
			border: none;
			border-radius: 10px;
			color: #2f9c63;
			font-weight: bold;
			text-align: center;
			padding: 20px;
			transition: all 0.3s ease;
			width: 100%;
		}

		.nav-tabs .nav-link.active {
			background-color: #2f9c63;
			color: #ffffff;
		}

		.nav-tabs .nav-link:hover {
			/*background-color: #e9f5f0;
			color: #2f9c63;*/
			
			background-color: #2f9c63;
			color: #ffffff;
	
		}

		/*-------------------------------------------------------------------------------------------------------*/
		
		.but_sign_up{
			font-size: 16px;
			font-weight: 600;
			padding: 22px;
			border-radius: 10px;
		}
		
		.btn-green {
		  background-color: #2f9c63;
		  color: #fff;
		  border: none;
		  transition: background-color 0.3s ease;
		}
		.btn-green:hover {
		  background-color: #218b54;
		  color: #fff;
		}
		.form-label{
			position: absolute;
			top: -12px;
			left: 13px;
			background-color: #fff;
			color: #b4bcc3;
		}
		.input_style{
			padding: 20px 16px;
			border-radius: 10px;
		}
		.mr_20{
			margin-right:20px;
		}
		.fog_pass_btn:hover{
			text-decoration: none !important;
			color: #218b54;
		}
		.fog_pass_btn{
			font-weight: 700;
		}
		.text-green {
		  color: #2f9c63;
		  text-decoration: none;
		}
		.text-green:hover {
		  text-decoration: underline;
		}
		
		/*-----------------------------------------------------------------------------------------------*/
		/*pagination*/
		
		.pagination {
		  display: flex;
		  gap: 8px; /* Расстояние между точками */
		  justify-content: center; /* Центрирование */
		  align-items: center;
		}

		.dot {
		  width: 10px; /* Диаметр точки */
		  height: 10px;
		  border-radius: 50%; /* Превращение в круг */
		  background-color: #d3e9d2; /* Цвет неактивных точек */
		}

		.dot.active {
		  width: 40px; /* Увеличенный размер активной точки */
		  border-radius: 10px; /* Превращение в капсулу */
		  background-color: #2f9c63; /* Цвет активной точки */
		}

		/*-----------------------------------------------------------------------------------------------*/
		.nav-tabs{
			flex-direction: row;
		}
		
		/*-----------------------------------------------------------------------------------------------*/
		/*code*/
		.code-input-wrapper {
		  position: relative;
		  display: inline-block;
		  width: 100%; /* Ширина поля ввода */
		  height: 62px; /* Высота поля ввода */
		  border: 1px solid #ccc;
		  border-radius: 10px; 
		  background: #fff;
		  overflow: hidden;
		}

		.form-control-code {
		  position: absolute;
		  top: 0;
		  left: 0;
		  width: 100%;
		  height: 100%;
		  text-align: center; /* Центрирование текста */
		  letter-spacing: 20px; /* Расстояние между символами */
		  font-size: 18px; /* Размер шрифта */
		  border: none;
		  outline: none;
		  background: transparent;
		  color: #000;
		}

		.placeholder-dashes {
		  position: absolute;
		  top: 50%;
		  left: 50%;
		  transform: translate(-50%, -50%);
		  display: flex;
		  justify-content: center;
		  width: 80%; /* Ширина линии из черточек */
		  color: #999; /* Цвет черточек */
		  pointer-events: none; /* Отключение взаимодействия */
		  gap: 28px;
		}

		.placeholder-dashes span {
		  font-size: 19px;
		}
		
		/*---------------------------------------------------------------------------------------*/
		.password-wrapper {
		  position: relative;
		}
		.password-wrapper .toggle-password {
		  position: absolute;
		  top: 50%;
		  right: 10px;
		  transform: translateY(-50%);
		  cursor: pointer;
		  font-size: 1.2rem;
		  color: #6c757d;
		}
		.fa-eye:before {
			content: "\f070";
			color: #c5cacf;
		}
		.fa-eye-slash:before {
			content: "\f070";
			color: #c5cacf;
		}
		/*---------------------------------------------------------------------------------------*/
		.dot_to_step_1, .dot_to_step_2, .dot_to_step_3, .company_dot_to_step_1, .company_dot_to_step_2, .company_dot_to_step_3, .company_dot_to_step_4{
			cursor:pointer;
		}
		
		.btn-gray {
			background-color: #f5f7f9;
			color: #2f9c63;
			border: none;
			transition: background-color 0.3s ease;
		}
		.btn-gray:hover {
		  background-color: #ebebeb;
		  color: #fff;
		}

/*-------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------*/
/*-------------------------------------------------------------------------------------------------------*/
	
@media (min-width: 320px) and (max-width: 767px) {
	.content{
		height: auto;
	}
	.but_sign_up{
		font-size: 14px;
		font-weight: 600;
		padding: 22px;
		border-radius: 10px;
	}
	.registration-container {
		margin: 88px 0 35px 0;
		border-radius: 40px;
		background: #fff;
		padding: 20px 10px;
		box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
		max-width: 600px;
		width: 100%;
	}
	#text_sign_up {
		font-size: 24px;
		font-weight: 700;
	}
	.text_2{
		font-size: 14px;
	}
	.mr_20{
		margin-right:0;
	}
	.fog_pass_btn{
		font-weight: 600;
		font-size: 14px;
	}
	.nav-tabs{
		flex-direction: column;
	}
}		