@media (max-width: 1397px) {
	.header-helloImg img {
		width: 100%;
	}
	.header-img{
	max-width: 400px; width: 100%;
	}
	.card-title {
		font-size: 17px;
	}

	.news {
		padding: 20px;
		width: 100%;
		border-radius: 30px;
	}

	.bottom-news .padding-news {
		display: flex;
		flex-direction: column;
		justify-content: start;
		align-items: start;
		position: relative;
		left: -14%;
	}

	.padding-news {
		margin-right: 0;
	}

	.bottom-news img {
		margin-bottom: 5px;
		width: 100%;
		margin-right: 0;
		margin-top: 0;
	}
}

@media (max-width: 1200px) {
	.news-content {
		display: grid;
		grid-template-areas: 'area1 area1 area1 area1 area1 area1''area2 area2 area2 area2 area2 area2''area3 area3 area3 area3 area3 area3''title title title title title title''area5 area5 area6 area6 area7 area7';
		grid-gap: 10px;
		padding: 10px;
	}

	.news {
		grid-area: area1;
		padding: 20px;
		border-radius: 10px;
		padding: 0;
		border: 1.5px solid #e4e4e5;
		border-radius: 20px;
		display: flex;
		padding-top: 0px !important;
		flex-direction: column !important;
	}

	.news img {
		padding: 20px;
		width: 100%;
		border-radius: 30px;
		margin-right: 0;
		margin-bottom: 0;
		height: auto !important;
	}
}

@media (max-width: 991px) {
	.bottom-news .padding-news {
		display: flex;
		flex-direction: column;
		justify-content: start;
		align-items: start;
		position: relative;
		left: 0;
	}

	.header {
		padding-top: 0;
	}
	.header-img{
	max-width: 300px; width: 100%;
	}

	.nav-top {
		padding-left: 10px;
		padding-right: 15px;
		background: #fff;
		border-bottom-right-radius: 5px;
		border-bottom-left-radius: 5px;
	}

	.header-text-container {
		margin-top: 70px;
	}

	#menuToggle {
		position: relative;
		top: 40px;
		right: 0;
		z-index: 1;
		-webkit-user-select: none;
		user-select: none;
	}

	.header-title {
		font-family: var(--font-family);
		font-weight: 700;
		font-size: 25px;
		line-height: 140%;
		color: var(--white);
		margin-bottom: 16px;
	}

	#menuToggle a {
		text-decoration: none;
		color: #232323;
		transition: color 0.3s ease;
	}

	#menuToggle a:hover {
		color: tomato;
	}

	#menuToggle input {
		display: block;
		width: 40px;
		height: 40px;
		position: absolute;
		left: 0%;
		bottom: 35px;
		cursor: pointer;
		opacity: 0;
		/* hide this */
		z-index: 2;
		/* and place it over the hamburger */
		-webkit-touch-callout: none;
	}

	/* * Just a quick hamburger */
	#menuToggle span {
		width: 33px;
		height: 4px;
		margin-bottom: 5px;
		left: 0%;
		bottom: 35px;
		position: relative;
		background: black;
		border-radius: 3px;
		display: block;
		z-index: 1;
		transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), opacity 0.55s ease;
	}

	#menuToggle span:first-child {
		transform-origin: 0% 0%;
	}

	#menuToggle span:nth-last-child(2) {
		transform-origin: 0% 100%;
	}

	#menuToggle input:checked~span {
		opacity: 1;
		transform: rotate(45deg) translate(-2px, -1px);
		background: #232323;
	}

	#menuToggle input:checked~span:nth-last-child(3) {
		opacity: 0;
		transform: rotate(0deg) scale(0.2, 0.2);
	}

	#menuToggle input:checked~span:nth-last-child(2) {
		transform: rotate(-45deg) translate(10px, -3px);
	}

	#menu {
		position: fixed;
		margin: 0;
		padding: 10px;
		padding-top: 10px;
		display: block;
		width: 100%;
		background: #ededed;
		list-style-type: none;
		-webkit-font-smoothing: antialiased;
		transform-origin: 0% 0%;
		left: 0;
		top: -300px;
		transform: translate(-10%, -200%);
		transition: all 0.5s;
	}

	#menu li {
		font-size: 18px;
		line-height: normal;
		color: var(--font-dark);
		padding: 18px 10px;
		border-bottom: solid 1px #413636;
		transition: all 1s;
	}

	#menu li:hover {
		border-bottom: solid 1px #413636;
		background-color: #ffffff;
	}

	.btnReg {
		font-size: 25px;
		border-radius: 20px;
		width: 200px;
		height: 58px;
		background: var(--white);
		font-family: var(--font-family);
		font-weight: 400;
		color: var(--main-color);
		transition: all 0.5s;
	}

	.start {
		font-weight: 700;
		width: 400px;
		box-shadow: 0 4px 8px 0 rgba(255, 255, 255, 0.3);
		background: var(--white);
	}

	#menuToggle input:checked~ul {
		transform: translate(0, 0%);
		top: 0;
	}

	.container {
		padding-left: 0px;
		padding-right: 0px;
	}

	.nav {
		position: fixed;
		right: 0;
		left: 0;
		z-index: 51;
	}

	/*main*/
	.card-text {
		font-size: 14px;
	}

	.news-content {
		display: grid;
		grid-template-areas: 'area1 area1 area1 area1 area1 area1''area2 area2 area2 area2 area2 area2''area3 area3 area3 area3 area3 area3''title title title title title title''area5 area5 area5 area5 area5 area5''area6 area6 area6 area6 area6 area6''area7 area7 area7 area7 area7 area7';
		grid-gap: 10px;
		padding: 10px;
	}

	.bottom-news {
		display: flex;
		flex-direction: column;
		justify-content: center;
		/* align-items: center;
      */
		margin-bottom: 5px !important;
		align-items: start;
	}

	.news:nth-child(1) {
		padding-top: 0px !important;
	}

	/*end main*/
	/*start section*/
	.start-section h1 {
		margin-bottom: 30px;
		text-align: center;
	}

	.header .text1 {
		font-size: 2.6vw;
		font-weight: 900;
	}
}

@media (max-width: 767px) {
	.test-section {
		flex-direction: column-reverse;
	}

	.container {
		padding-left: 20px;
		padding-right: 20px;
		max-width: 1000px;
		width: 100%;
	}

	.bnt-hide2 {
		display: block;
		margin-top: 50px;
		width: 100%;
		text-align: center;
	}

	.autorization-form label {
		padding: 22px 15px;
	}

	.bnt-hide {
		display: none;
	}

	.start {
		display: none;
	}

	.start2 {
		display: block;
		width: 100%;
		margin-bottom: 40px;
		margin-top: 40px;
	}

	.header-title {
		text-align: center;
		font-size: 35px;
	}

	.header-text {
		text-align: center;
		font-size: 21px;
	}

	/*main*/
	.card-text {
		font-size: 16px;
	}

	/*end main*/
	/*challenge*/
	.ellipse3 {
		display: none;
	}

	.ellipse4 {
		display: none;
	}

	.header-img {
		max-width: 300px;
		width: 100%;
	}

	.header .text1 {
		text-align: center;
		font-size: 23px;
	}

	.header .text2 {
		font-size: 16px;
		margin-bottom: 20px;
		text-align: center;
	}
}

@media (max-width: 575px) {
	.container {
		max-width: 1000px !important;
		width: 100% !important;
	}

	.header-title {
		text-align: center;
		font-size: 28px;
	}

	.header-text {
		text-align: center;
		font-size: 18px;
	}

	/*start table-word*/
	.main-Online-courses-text {
		font-size: 19px;
	}

	.ellipse {
		display: none;
	}

	.challenge-content_lineOne {
		position: relative;
		width: 1px;
		height: 90%;
		border: 1px dashed rgba(51, 51, 51, 0.2);
	}

	.bottom-full-news__img {
		display: none;
	}

	.bottom-full-news {
		height: auto;
	}

	.start-section__item {
		border-radius: 20px;
		padding: 40px;
		max-width: 377px;
		height: 50px;
		background: var(--white);
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		color: #fff;
		transition: all 0.5s;
		position: relative;
		box-shadow: 0 2px 4px 0 rgba(255, 138, 66, 0.15);
	}

	.start-section__img {
		height: 80px;
	}

	.start-section__img img {
		height: 80px;
		padding: 10px;
	}

	.start-section__item h3 {
		font-family: var(--font-family);
		font-weight: 400;
		font-size: 14px;
		text-align: center;
		color: #000;
		margin-bottom: 0;
	}

	.start-section__item::after {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 1;
		opacity: 0;
		transition: all 0.3s;
		border-radius: 20px;
		border: 3px solid rgba(179, 20, 20, 0.5);
		transform: scale(1.1, 1.2);
	}

	.header .text1 {
		text-align: center;
		font-size: 18px;
	}
}

@media (max-width: 404px) {
	.dHide {
		display: none;
	}

	.challenge-content_title {
		font-size: 17px;
	}

	.start-section__item h3 {
		font-family: var(--font-family);
		font-weight: 400;
		font-size: 13px;
		text-align: center;
		color: #000;
		margin-left: 5px;
	}

	.start-section__item {
		height: 90px;
	}
}

@media (max-width: 305px) {}

@media (max-width: 268px) {}