@font-face {
	font-family: OpenSans;
	src: url("../Assets/fonts/Google-OpenSans-Latin-Normal.woff2") format('woff2');
	font-weight: normal;
	font-display: swap;
}

@font-face {
	font-family: OpenSans;
	src: url("../Assets/fonts/Google-OpenSans-Regular.woff2") format('woff2');
	font-weight: normal;
	font-display: swap;
}

@font-face {
	font-family: OpenSans-SemiBold;
	src: url("../Assets/fonts/Google-OpenSans-SemiBold.woff2") format('woff2');
	font-weight: normal;
	font-display: swap;
}

@font-face {
	font-family: OpenSans-SemiBold;
	src: url("../Assets/fonts/Google-OpenSans-Latin-Semibold.woff2") format('woff2');
	font-weight: normal;
	font-display: swap;
}

:root {
	--primary-0: #55ae9b;
	--primary-1: #6cc0ae;
	--primary-2: #9dddcd;
	--primary-3: #b8e7d7;
	--primary-4: #dcf3eb;
	--primary-5: #f5f5f5;
	--white: #ffff;
	--black-1: #0d0c22;
	--black-2: #3d3d4e;
	--black-3: #6e6d7a;
	--black-4: #a9aab8;
	--black-5: #e2e2e2;
	--black-6: #636363;
	--grey-1: #84888f;
}

html {
	scroll-behavior: smooth;
}

h1,
h2,
h3,
h4 {
	font-family: sans-serif, OpenSans-SemiBold !important;
}

* {
	font-family: sans-serif, OpenSans;
}

a {
	color: var(--primary-0);
	text-decoration: none;
	font-weight: 600;
}

a:hover {
	opacity: 0.8;
}

body {
	/* width: 100vw; */
	margin: auto;
	/* overflow-x: hidden !important; */
	background-color: #f5f5f5 !important;
	/* max-width: 1920px; */
}

button {
	outline: none;
}

pre {
	margin-bottom: 0 !important;
}

pre>code {
	margin-bottom: 10px;
}


/* Prestilo del codigo y personalizado */
pre code {
	display: block;
	overflow-x: auto;
	padding: 1em;
	background: #000;
	color: #eaeaea;
	padding: 3px 5px;
	border-radius: 5px;
}


/* Estilo del codigo */
pre code.hljs {
	display: block;
	overflow-x: auto;
	padding: 1em
}

code.hljs {
	padding: 3px 5px
}

.hljs {
	background: #000;
	color: #eaeaea
}

.hljs-emphasis {
	font-style: italic
}

.hljs-strong {
	font-weight: 700
}

.hljs-comment,
.hljs-quote {
	color: #969896
}

.hljs-deletion,
.hljs-name,
.hljs-regexp,
.hljs-selector-class,
.hljs-selector-id,
.hljs-tag,
.hljs-template-variable,
.hljs-variable {
	color: #d54e53
}

.hljs-built_in,
.hljs-link,
.hljs-literal,
.hljs-meta,
.hljs-number,
.hljs-params,
.hljs-type {
	color: #e78c45
}

.hljs-attribute {
	color: #e7c547
}

.hljs-addition,
.hljs-bullet,
.hljs-string,
.hljs-symbol {
	color: #b9ca4a
}

.hljs-section,
.hljs-title {
	color: #7aa6da
}

.hljs-keyword,
.hljs-selector-tag {
	color: #c397d8
}

header {
	/* margin: auto; */
	display: block;
	/* width: 100%; */
	background-color: #ffffff;
	position: relative;
	z-index: 3;
}

header .navbar {
	margin: auto;
	display: flex;
	justify-content: center;
	padding: 0px 80px;
}

header .nav-container {
	display: grid;
	grid-template-columns: 70% 10% 20%;
	grid-template-rows: 72px;
	gap: 0px 0px;
	grid-auto-flow: row;
	grid-template-areas: "first-section separate second-section";
	width: 100%;
}

.first-section {
	grid-area: first-section;
	display: grid;
	grid-auto-columns: 1fr;
	grid-auto-rows: 1fr;
	grid-template-columns: 114px 223px 357px;
	grid-template-rows: 72px;
	gap: 0px 32px;
	grid-template-areas: "logo category-group search-bar";
}

.separate {
	grid-area: separate;
}

.second-section {
	grid-area: second-section;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-end;
}

.logo {
	grid-area: logo;
	cursor: pointer;
}

.category-group {
	grid-area: category-group;
	display: flex;
	align-items: center;
}

.category-group .fas.fa-bars,
.category-group .fas.fa-times {
	font-size: 32px;
	color: var(--primary-1);
	cursor: pointer;
}

.category-group .fas.fa-bars#menu-icon-shown {
	display: inline-block;
}

.category-group .fas.fa-bars#menu-icon-hidden {
	display: none;
}

.category-group .fas.fa-times {
	display: none;
}

.category-group p {
	margin-left: 13px;
	color: var(--black-6);
	font-style: normal;
	font-weight: 500;
	font-size: 30px;
	margin-top: 0px;
	margin-bottom: 0px;
}

.search-bar {
	grid-area: search-bar;
	display: flex;
	align-items: center;
	align-content: center;
	position: relative;
}

.search-bar .search-results {
	position: absolute;
	top: 100%;
	left: 0;
	background: #ffff;
	padding: 10px 15px;
	width: 100%;
	display: none;
	overflow-y: scroll;
	max-height: 450px;
}

.search-bar .search-results .search-result-title {
	padding: 7px 10px 2.5px 10px;
	font-size: 15px;
}

.search-bar .search-results .divider {
	width: 100%;
	height: 2px;
	border-width: 0;
	background: rgb(232, 232, 232);
}

.search-bar .search-results .list-result {
	list-style: none;
	margin: 0;
	padding: 0;
}

.search-bar .search-results .list-result .result-item {
	margin: 5px 0;
}

.search-bar .search-results .list-result .result-item .result-item-wrapper {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	color: #636363;
	cursor: pointer;
	margin: 25px 0;
}

.search-bar .search-results .list-result .result-item .result-item-wrapper:hover {
	background-color: var(--primary-3);
}

.search-bar .search-results .list-result .result-item .result-item-wrapper .title {
	font-size: 14px;
	font-weight: 500;
	margin-top: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}

.search-bar .search-results .list-result .result-item .result-item-wrapper .image {
	display: block;
	height: 70px;
	border-radius: 3px;
	background: grey;
	float: left;
	min-width: 70px;
	width: 70px;
	align-self: flex-start;
	object-fit: cover;
}

.search-bar .search-results .list-result .result-item .result-item-wrapper .content {
	margin-left: 10px;
	padding: 0 5px 5px 5px;
}

.search-bar .search-results .list-result .result-item .result-item-wrapper .content .desc {
	font-size: 12px;
	font-weight: 300;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}

.input-icon i.icon {
	top: 50%;
	position: absolute;
	color: var(--black-4);
	left: 10px;
	width: 14px;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
}

.sidenav-container .input-icon i.icon {
	padding-top: 0;
}

.input-field {
	width: 357px;
	padding: 10px 10px 10px 35px;
	border: none;
	background-color: #f3f3f3;
	border-radius: 10px;
}

.input-field:focus {
	border: none;
	outline: none;
}

.input-field::placeholder {
	color: var(--black-4);
	font-size: 16px;
	padding: 10px 10px 10px 10px;
}

.navbar .nav-container .logo {
	font-size: 40px;
	font-weight: 600;
	color: var(--primary-1);
	margin: 0px;
	display: flex;
	align-items: center;
}

.banner-link-facebook-mobile {
	display: none;
}

.button-form-campaign {
	position: absolute;
	top: 16%;
	right: 4%;
}

.button-form-campaign span {
	padding: 4px 8px;
	text-decoration: none;
	color: white;
	font-size: 12px;
	display: inline-block;
	background-color: #E51B28;
	font-weight: 600;
}

.button-form-campaign-mobile {
	position: absolute;
	top: 50%;
	right: 2%;
	height: 35%;
	width: 33.6%;
	transform: translate(0, -50%);
	text-align: center;
}

.button-form-campaign-mobile span {
	width: min-content;
	white-space: nowrap;
	padding: 0 6%;
	height: 100%;
	border-radius: 4px;
	line-height: 200%;
	box-shadow: 0px 4px 10px 0px #153A364D;
	text-decoration: none;
	color: white;
	font-size: 4vw;
	display: inline-block;
	background-color: #E51B28;
	font-weight: 700;
}


.banner-link-facebook {
	/* height: 100%; */
	/* padding: 5px 0; */
	margin-left: 20px;
}

.img-banner-link-facebook {
	/* object-fit: contain; */
	width: 100%;
	height: 100%;
}

.language {
	display: flex;
	align-items: center;
	margin-right: 25px;
}

.language .i-globe {
	color: var(--black-3);
}

.language .language-dropdown {
	margin-left: 10px;
	display: flex;
	align-items: center;
	cursor: pointer;
}

.language .language-dropdown p {
	font-size: 16px;
}

.language .language-dropdown i {
	margin-left: 10px;
	color: var(--black-3);
}

.language-dropdown-content {
	display: none;
	position: absolute;
	background-color: #f9f9f9;
	min-width: 160px;
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
	/* padding: 12px 16px; */
	top: 40px;
	z-index: 1;
	width: 140px;
}

.dropdown:hover .language-dropdown-content {
	display: block;
	background: #ffffff;
	box-shadow: 0px 0px 14px 1px rgba(0, 0, 0, 0.1);
	border-radius: 15px;
	/* padding: 24px; */
}

.language-dropdown-content .language-option {
	padding: 12px;
	cursor: pointer;
}

.language-dropdown-content .language-option:hover {
	background-color: var(--primary-4);
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
}

.language-dropdown-content .language-option:last-child:hover {
	background-color: var(--primary-4);
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
}

.primary-btn {
	background-color: var(--primary-1);
	color: white;
	border-radius: 10px;
	padding: 8px 18px 10px;
	border: none;
	box-shadow: none;
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
	height: 40px;
	margin-right: 16px;
	white-space: nowrap;
}

.outline-btn {
	font-weight: 600;
	background-color: white;
	color: var(--primary-1);
	border-radius: 10px;
	padding: 8px 18px 10px;
	border: 1px solid var(--primary-1);
	box-shadow: none;
	font-size: 16px;
	cursor: pointer;
	height: 40px;
	white-space: nowrap;
}

.outline-btn-2 {
	background: #ffffff;
	cursor: pointer;
	/* Grey 2 */
	border: 0.5px solid #acacb9;
	box-sizing: border-box;
	border-radius: 10px;
	padding: 12px 49px;
}

.primary-btn:hover,
.outline-btn:hover,
.outline-btn-2:hover,
.fb-btn:hover,
.btn-facebook:hover,
.btn-goolge:hover {
	opacity: 0.8;
}

.title1 {
	font-family: OpenSans;
	font-style: normal;
	font-weight: 600;
	font-size: 22px;
	margin: 0px;
	color: #313131;
}

.title2 {
	font-family: OpenSans-SemiBold;
	font-style: normal;
	font-weight: 600;
	font-size: 20px;
	margin: 0px;
	color: var(--black-1);
}

.title3 {
	font-family: OpenSans-SemiBold;
	font-style: normal;
	font-weight: 600;
	font-size: 16px;
	margin: 0px;
	color: var(--black-1);
}

.title3-a {
	font-family: OpenSans-SemiBold;
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	margin: 0px;
	color: var(--black-2);
}

.title4 {
	font-family: OpenSans-SemiBold;
	font-style: normal;
	font-weight: 600;
	font-size: 14px;
	margin: 0px;
	color: var(--black-1);
}

.body1 {
	font-family: OpenSans;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	margin: 0px;
	color: var(--black-1);
}

.body2 {
	font-family: OpenSans;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	margin: 0px;
	color: var(--black-1);
}

.body3 {
	font-family: OpenSans;
	font-style: normal;
	font-weight: normal;
	font-size: 13px;
	margin: 0px;
	color: var(--black-1);
}

.p-black1 {
	font-family: OpenSans;
	font-style: normal;
	font-weight: 600;
	font-size: 14px;
	margin: 0px;
	color: var(--black-1);
}

.p-black2 {
	font-family: OpenSans;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	margin: 0px;
	color: var(--black-1);
}

.flex-row {
	display: flex;
	flex-direction: row;
}

.flex-wrap {
	flex-wrap: wrap;
}

.c-pointer {
	cursor: pointer;
}

.figures {
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	color: var(--black-6);
}

.fb-btn {
	background-color: #408bc1;
	color: white;
	height: 20px;
	border: none;
	border-radius: 5px;
	margin-left: 20px;
	white-space: nowrap;
	display: flex;
	align-items: center;
	cursor: pointer;
}

.fb-btn i {
	font-size: 12px;
	margin-right: 5px;
}

.select-box {
	background: #ffffff;
	border: 0.5px solid #a9aab8;
	box-sizing: border-box;
	border-radius: 10px;
	width: 176px;
	height: 36px;
	padding-left: 14px;
	padding-right: 14px;
	outline: none;
	color: #3d3d4e;
}

.select-box:focus {
	border-color: var(--primary-0);
	box-shadow: 0px 0px 5px rgba(108, 192, 174, 0.3);
}

.divider {
	border: 2px solid #6cc0ae;
	border-radius: 5px;
	margin-top: 15px;
	margin-bottom: 20px;
}

.category-group {
	grid-area: category-group;
}

.sidenav {
	height: 100%;
	width: 0;
	position: fixed;
	z-index: 1500;
	top: 0px;
	left: 0;
	background-color: #ffffff;
	overflow-x: hidden;
	transition: 0.5s;
	/* padding-top: 20px; */
}

.sidenav .head-logo {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 12px;
}

.sidenav .head-logo .logo {
	font-size: 28px;
}

.sidenav-container {
	border-top: 1px solid #e9f4f0;
	padding-top: 20px;
	position: relative;
	padding-left: 12px;
	padding-right: 12px;
}

.sidenav-container .search-results .search-result-title {
	padding: 7px 10px 2.5px 10px;
	font-size: 15px;
}

.sidenav-container .search-results .divider {
	width: 100%;
	height: 2px;
	border-width: 0;
	background: rgb(232, 232, 232);
}

.sidenav-container .search-results {
	position: absolute;
	width: 100%;
	background: #fff;
	top: 70px;
	display: none;
	padding: 10px;
	left: 0;
	overflow-y: scroll;
	max-height: 450px;
	z-index: 10;
}

.sidenav-container .search-results .list-result {
	list-style: none;
	margin: 0;
	padding: 0;
}

.sidenav-container .search-results .list-result .result-item {
	margin: 5px 0;
}

.sidenav-container .search-results .list-result .result-item .result-item-wrapper {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	padding: 5px 14px;
	color: #636363;
	cursor: pointer;
	margin: 25px 0;
}

.sidenav-container .search-results .list-result .result-item .result-item-wrapper:hover {
	background-color: var(--primary-3);
}

.sidenav-container .search-results .list-result .result-item .result-item-wrapper .image {
	display: block;
	height: 70px;
	border-radius: 3px;
	background: grey;
	float: left;
	width: 100px;
	min-width: 100px;
	align-self: flex-start;
}

.sidenav-container .search-results .list-result .result-item .result-item-wrapper .content {
	margin-left: 10px;
	padding: 0 5px 5px 5px;
}

.sidenav-container .search-results .list-result .result-item .result-item-wrapper .title {
	font-size: 14px;
	margin-top: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}

.sidenav-container .search-results .list-result .result-item .result-item-wrapper .content .desc {
	font-size: 12px;
	font-weight: 300;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}

.sidenav #closebtn {
	font-size: 20px;
	display: none;
	color: #414042;
	transform: rotate(90deg);
	cursor: pointer;
}

.avatar-author {
	border-radius: 50%;
}

.banner_toplist_desktop {
	display: block;
}

.banner_toplist_mobile {
	display: none;
}



@media screen and (max-height: 450px) {
	.sidenav {
		padding-top: 15px;
	}

	.sidenav a {
		font-size: 18px;
	}
}

@media only screen and (max-width: 1920px) {
	.sidenav {
		display: none;
	}

	.category-group .fas.fa-bars#menu-icon-hidden {
		display: none;
	}
}

@media only screen and (max-width: 1240px) {

	header .navbar,
	.homepage-container,
	.footer {
		padding: 20px 40px !important;
	}
}

@media only screen and (max-width: 1160px) {

	header .navbar,
	.homepage-container,
	.footer {
		padding: 20px 20px !important;
	}
}

@media only screen and (max-width: 850px) {
	.category-group .fas.fa-bars#menu-icon-hidden {
		display: block !important;
	}

	.language {
		display: none;
	}

	.banner_toplist_desktop {
		display: none;
	}

	.banner_toplist_mobile {
		display: block;
		width: 100%;
	}

	.banner {
		flex-direction: column;
		text-align: center;
	}

	.banner .primary-btn {
		margin-top: 12px;
	}

	.norms {
		margin-top: 30px !important;
	}

	.pagination .item {
		width: 36px !important;
		height: 36px;
		font-size: 16px !important;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.norms p {
		font-size: 14px !important;
	}

	.ft-slogan {
		width: 100% !important;
		text-align: left;
		font-size: 14px;
	}

	.ft-list-ul>li>a {
		color: #313131 !important;
		font-style: normal;
		font-size: 14px;
	}

	.wrap-icon {
		margin-top: 22px !important;

	}
}

.search-container-mobile {
	display: flex;
	justify-content: center;
	margin-bottom: 10px;
}

.search-container-mobile .search-bar-mobile.input-icon {
	width: 100% !important;
	display: flex;
	align-items: center;
	position: relative;
}

.search-container-mobile .search-bar-mobile .input-field {
	width: 100% !important;
}

.language-dropdown.mobile,
.menu-dropdown.mobile {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	cursor: pointer;
	align-items: center;
	/* padding: 20px 20px 10px; */
	cursor: pointer;
	width: 100%;
	height: 48px;
}

.menu-dropdown.mobile {
	padding-bottom: 0px;
}

.language-dropdown.mobile i,
.menu-dropdown.mobile i {
	color: #6e6d7a;
}

.menu-dropdown-title {
	font-size: 24px;
}

.language-dropdown.mobile .fa-chevron-down,
.menu-dropdown.mobile .fa-chevron-down {
	display: block;
}

.language-dropdown.mobile .fa-chevron-up,
.menu-dropdown.mobile .fa-chevron-up {
	display: none;
}

.language-dropdown.mobile p,
.menu-dropdown.mobile p {
	text-decoration: none;
	font-size: 15px;
	font-weight: 600;
	color: #3d3d4e;
	display: block;
	transition: 0.3s;
}

.gray-divider {
	width: 100%;
	height: 0.5px;
	background-color: #d8d8d8;
	margin-top: 20px;
	margin-bottom: 30px;
}

#list-language {
	padding: 0px 12px;
}

#list-language .language-item {
	/* padding: 12px 0px; */
	display: flex;
	width: 100%;
	height: 48px;
	align-items: center;
	/* padding-bottom: 30px; */
}

#list-language .language-item i {
	color: #6e6d7a;
	margin-right: 11px;
	visibility: hidden;
}

#list-language .language-item.active i {
	visibility: visible;
}

#list-tags,
#list-language {
	display: none;
}

#list-tags {
	margin-top: 20px;
}

.current-user-mobile {
	padding: 0px 12px;
	/* margin-top: 27px; */
	justify-content: space-between;
}

.current-user-mobile,
.current-user-mobile .user {
	display: flex;
	flex-direction: row;
	align-items: center;
	cursor: pointer;
	padding: 5px 0;
}

.current-user-mobile .wrap-avatar {
	width: 34px;
	height: 34px;
}

.current-user-mobile .text-name {
	font-size: 15px;
}

.current-user-mobile .icon-down #user-fa-chevron-down {
	display: block;
}

.current-user-mobile .icon-down #user-fa-chevron-up {
	display: none;
}

.user-dropdown-content-mobile {
	display: none;
	color: #3d3d4e;
	padding: 0 17px;
}

.user-dropdown-content-mobile .user-option {
	margin-top: 27px;
	padding: 0px 12px;
}

.user-dropdown-content-mobile .gray-divider {
	margin-top: 27px;
	width: 90%;
}

.figure-style {
	height: 32px;
	justify-content: flex-end;
	margin-top: 15px;
}

.banner-text {
	margin-top: 0px;
	margin-bottom: 0px;
	font-family: OpenSans;
	font-style: normal;
	font-weight: normal;
	font-size: 15px;
}

.thumnail {
	width: 187px;
	height: 120px;
	object-fit: cover;
}

@media only screen and (max-width: 760px) {
	header .navbar {
		padding: 0px 12px !important;
	}

	header .navbar .logo {
		font-size: 24px;
		font-style: normal;
		font-weight: 600;
		font-family: OpenSans;
		padding: 12px;
	}

	.banner {
		padding: 20px 12px !important;
	}

	.second-section .primary-btn,
	.second-section .outline-btn {
		display: none;
	}

	.nav-container {
		display: grid !important;
		grid-template-columns: 100% !important;
		grid-template-rows: 48px !important;
		grid-auto-columns: 1fr;
		grid-auto-rows: 1fr;
		gap: 0px 0px !important;
		grid-auto-flow: row !important;
		grid-template-areas: "first-section" !important;
		align-items: center !important;
	}

	.first-section {
		display: grid;
		grid-template-columns: 20% 1fr 20%;
		grid-template-rows: 1fr;
		gap: 0px 0px;
		grid-auto-flow: row;
		grid-template-areas: "logo . category-group";
		grid-area: first-section;
	}

	.category-group {
		justify-content: flex-end;
	}

	.category-group p {
		display: none;
	}

	.tags-authors-otherNews {
		grid-template-columns: auto !important;
		grid-auto-rows: auto !important;
	}

	.authors {
		margin-right: 20px;
	}

	/* .news-description {
    display: none;
  } */
	/* .news-item img.thumnail {
    width: 106px;
    height: 68px;
    cursor: pointer;
  } */
	.title2 {
		font-size: 15px;
	}

	.current-user {
		display: none !important;
	}
}

.small-information {
	align-items: center;
}

@media only screen and (max-width: 550px) {
	.fb-btn {
		margin-left: 0px;
		float: left;
	}

	.btn-container {
		width: 100%;
	}
}

@media only screen and (max-width: 972px) {
	.button-form-campaign {
		top: 16%;
		right: 4%;
		text-align: center;
	}

	.button-form-campaign span {
		width: min-content;
		line-height: 200%;
		white-space: nowrap;
		font-size: 16px;
		padding: 2px 10px;
	}
}

.work-break {
	word-wrap: break-word;
	width: 100%;
}

.mg-0 {
	margin: 0px;
}

.mr-0 {
	margin-right: 0px;
}

.mt-0 {
	margin-top: 0px;
}

.ml-0 {
	margin-left: 0px;
}

.mb-0 {
	margin-bottom: 0px;
}

.ml-3per {
	margin-left: 3%;
}

.ml-10per {
	margin-left: 10%;
}

.mt-4 {
	margin-top: 4px;
}

.mr-5 {
	margin-right: 5px;
}

.mt-6 {
	margin-top: 6px;
}

.mr-15-important {
	margin-right: 15px !important;
}

.mt-8 {
	margin-top: 8px;
}

.mt-12 {
	margin-top: 12px;
}

.ml-12 {
	margin-left: 12px;
}

.mt-14 {
	margin-top: 14px;
}

.mt-16 {
	margin-top: 16px;
}

.mb-16 {
	margin-bottom: 16px;
}

.mb-4 {
	margin-bottom: 4px;
}

.mt-17 {
	margin-top: 17px;
}

.mt-18 {
	margin-top: 18px;
}

.mb-18 {
	margin-bottom: 18px;
}

.mt-20 {
	margin-top: 20px;
}

.mr-20 {
	margin-right: 20px;
}

.ml-20 {
	margin-left: 20px;
}

.ml-40 {
	margin-left: 40px;
}

.mb-20 {
	margin-bottom: 20px;
}

.mt-30 {
	margin-top: 30px;
}

.mb-30 {
	margin-bottom: 30px;
}

.pd-0 {
	padding: 0px;
}

.pdl-0 {
	padding-left: 0px;
}

.pdr-0 {
	padding-right: 0px;
}

.pdt-0 {
	padding-top: 0px;
}

.pdb-0 {
	padding-bottom: 0px;
}

.pdr-12 {
	padding-right: 12px;
}

.pdl-12 {
	padding-left: 12px;
}

.pdr-15 {
	padding-right: 15px;
}

.fontsize-26 {
	font-size: 26px;
}

.fontsize-12 {
	font-size: 12px;
}

.quote-text {
	margin: 0px;
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	line-height: 24px;
	color: var(--black-2);
	margin-top: 15px;
}

.color-primary-0 {
	color: var(--primary-0);
}

.color-black-2 {
	color: var(--black-2);
}

.align-items-center {
	display: flex;
	align-items: center;
}

.align-items-center-grid {
	align-items: center;
}

.justify-space-between {
	display: flex;
	justify-content: space-between;
}

.justify-center {
	display: flex;
	justify-content: center;
}

.flex-column {
	display: flex;
	flex-direction: column;
}

.w-100per {
	width: 100%;
}

.w-90per {
	width: 90%;
}

.w-50per {
	width: 50%;
}

.underline-text {
	text-decoration: underline;
}

.pos-relative {
	position: relative;
}

.radius-50 {
	border-radius: 100%;
}

.radius-10px {
	border-radius: 10px;
}

.radius-20px {
	border-radius: 20px;
}

.img-8px {
	width: 8px;
	height: 8px;
}

.img-16px {
	width: 16px;
	height: 16px;
}

.img-22px {
	width: 22px;
	height: 22px;
}

.img-26px {
	width: 26px;
	height: 26px;
}

.img-32px {
	width: 32px;
	height: 32px;
}

.img-80px {
	width: 80px;
	height: 80px;
}

.img-104px {
	width: 104px;
	height: 104px;
}

.img-100per {
	width: 100%;
	height: 100%;
}

.ellipsis {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.ellipsis-1 {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	/* number of lines to show */
	-webkit-box-orient: vertical;
}

.ellipsis-2 {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	/* number of lines to show */
	-webkit-box-orient: vertical;
}

.ellipsis-3 {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	/* number of lines to show */
	-webkit-box-orient: vertical;
}

.fweight-60 {
	font-weight: 600;
}

.fweight-normal {
	font-weight: normal;
}

.line-height-22 {
	line-height: 22px;
}

.opensans {
	font-family: OpenSans;
}

.gap-30 {
	gap: 30px;
}

.normal-a-tag {
	color: #3d3d4e !important;
	font-weight: normal;
}

.text-align-center {
	text-align: center;
}

.w3-modal {
	z-index: 10;
}

.banner {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 33px;
	background-color: #e9f4f0;
}

.banner h2 {
	color: #0d0c22;
}

#body {
	background-color: var(--primary-5);
}

p {
	margin: 0px;
}

.header-container {
	height: 72px;
	background-color: white;
	/* width: 100%; */
	gap: 20px;
	padding: 0px 80px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	z-index: 2;
	position: relative;
}

.logo-category-search {
	display: flex;
	flex-direction: row;
	align-items: center;
}

.logo {
	font-family: OpenSans;
	font-style: normal;
	font-weight: 600;
	font-size: 40px;
	color: #6cc0ae !important;
	margin-right: 31px;
}

.category {
	display: flex;
	flex-direction: row;
	align-items: center;
	margin-right: 38px;
}

.category .title {
	font-size: 32px;
	margin-left: 7.5px;
}

.category .dropdown i#menu-icon-shown,
i#menu-icon-hidden {
	font-size: 32px !important;
	color: #6cc0ae;
	margin-right: 13px;
	cursor: pointer;
}

i#menu-icon-hidden {
	display: none;
}

.category .dropdown i#menu-icon-shown {
	display: block;
}

.category p {
	font-family: OpenSans;
	font-style: normal;
	font-weight: 600;
	font-size: 36px;
	color: #636363;
}

.dropdown {
	position: relative;
	display: inline-block;
}

.dropdown>i#menu-icon#shown {
	position: relative;
	display: inline-block;
	/* visibility: visible; */
}

.dropdown>i#hidden {
	position: relative;
	display: none;
	/* visibility: hidden; */
}

.dropdown-content {
	display: none;
	position: absolute;
	background-color: #f9f9f9;
	min-width: 673px;
	box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
	padding: 12px 16px;
	z-index: 1;
	max-width: 673px;
}

.dropdown:hover .dropdown-content {
	display: block;
	background: #ffffff;
	box-shadow: 0px 0px 14px 1px rgba(0, 0, 0, 0.1);
	border-radius: 15px;
	padding: 24px;
}

.language-signin-signup {
	display: flex;
	flex-direction: row;
	align-items: center;
	height: 100%;
}

.language-signin-signup .dropdown {
	display: flex;
	flex-direction: row;
	align-items: center;
	height: 100%;
}

.language-signin-signup .language-dropdown-content {
	top: 55px;
}

.language {
	height: 100%;
}

.current-user {
	display: flex;
	align-items: center;
	display: none;
	height: 100%;
	position: relative;
}

.wrap-avatar {
	width: 26px;
	height: 26px;
}

.user-avatar {
	width: 100%;
	border-radius: 100%;
}

.text-name {
	margin-left: 10px;
	white-space: nowrap;
	font-weight: 600;
	font-size: 14px;
	line-height: 22px;
	color: #3d3d4e;
	margin-right: 20px;
}

.icon-down {
	color: #6e6d7a;
}

.current-user:hover .user-dropdown-content {
	display: block;
}

.user-dropdown-content {
	display: none;
	position: absolute;
	min-width: 160px;
	background: #ffffff;
	box-shadow: 0px 0px 14px 1px rgba(0, 0, 0, 0.1);
	top: 55px;
	z-index: 1;
	width: 210px;
	border-radius: 15px;
	padding: 10px 0px;
}

.user-dropdown-content .user-option {
	padding: 14px 20px;
	white-space: nowrap;
	cursor: pointer;
}

.user-dropdown-content .user-option-selected,
.user-dropdown-content .user-option:hover {
	background-color: #dcf3eb;
}

.categories-tags {
	cursor: pointer;
	background: #ebebeb;
	border-radius: 10px;
	padding: 6px 12px;
	display: inline-block;
	margin-right: 5px;
	margin-bottom: 10px;
}

.categories-tags a {
	color: #636363 !important;
	font-weight: normal;
	font-size: 13px;
}

/*




 */

.content-container {
	width: 100%;
	padding: 40px 80px;
	display: flex;
	flex-direction: row;
	gap: 30px;
}

.half-left-container {
	width: 50%;
	display: flex;
	flex-direction: column;
	/* gap: 50px; */
}

.half-left-container .news-item {
	display: flex;
	flex-direction: row;
}

.half-left-container .news-item .news-information {
	margin-left: 20px;
}

/* .news-item {
  display: flex;
  flex-direction: row;
  margin-bottom: 40px;
  cursor: pointer;
} */

/* .news-information {
  margin-left: 20px;
  margin-right: 20px;
} */

.avatar-datetime,
.views,
.comments {
	margin-right: 20px;
	align-items: center;
}

.avatar-datetime .author-avatar {
	margin-right: 10px;
	border-radius: 50%;
	width: 22px;
	height: 22px;
}

/* .news-information .news-description {
  font-size: 14px;
  text-align: justify;
  color: var(--black-1);
  margin-top: 10px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
} */

.sm-icon {
	/* position: absolute; */
	/* width: 100%; */
	color: var(--black-6);
	margin-right: 5px;
}

.half-right-container {
	width: 50%;
	display: flex;
	flex-direction: column;
	gap: 37px;
}

.tag-col {
	width: 50%;
}

.top-authors {
	display: flex;
	justify-content: space-between;
}

a.title2.c-pointer {
	color: #0d0c22 !important;
}

@media only screen and (max-width: 1310px) {

	.header-container,
	.content-container {
		padding: 0px 12px;
		/* padding: 0px; */
	}

	.content-container {
		margin-top: 22px;
		gap: 0px;
	}

	.category .dropdown i#menu-icon-shown,
	.category,
	.search-bar,
	.language-signin-signup {
		display: none !important;
	}

	#menu-icon-hidden {
		display: block !important;
	}

	.sidenav {
		display: block !important;
	}

	.logo-category-search {
		width: 100%;
		justify-content: space-between;
	}

	.half-right-container {
		margin-right: 30px;
	}

	.w-100per.flex-row.gap-30 {
		gap: 10px;
	}
}

/* @media only screen and (max-width: 1220px) {

}
@media only screen and (max-width: 1160px) {
} */
@media only screen and (max-width: 1220px) {
	.logo {
		font-size: 28px;
	}

	#menu-icon-hidden {
		font-size: 20px;
	}

	.banner h2 {
		font-size: 22px;
	}

	.banner button {
		font-size: 14px;
		height: 34px;
		display: flex;
		align-items: center;
	}

	.content-container {
		gap: 20px;
	}

	.half-right-container {
		width: 46%;
	}

	/* .news-information {
    margin-right: 0px;
  } */
	.thumnail {
		width: 130px;
		height: 80px;
	}

	.w-100per.flex-row.gap-30 {
		display: flex;
		flex-direction: column;
	}

	.tag-col {
		width: 100%;
	}
}

@media only screen and (max-width: 1090px) {

	/* .news-information .news-description {
    display: none;
  } */
	.btn-container .fb-btn {
		margin-left: 0px;
	}

	/* .small-information.flex-row {
    flex-direction: column;
    display: flex;
  } */
	/* .small-information.flex-row .flex-row,
  .small-information.flex-row .btn-container {
    width: 60%;
    display: flex;
    justify-content: left;
    font-size: 12px;
  } */
	.small-information.flex-row .btn-container {
		margin-top: 6px;
	}

	.views.flex-row {
		margin-left: 10px;
	}

	.form-submit-btn {
		width: 100%;
		margin: 4px 0;
	}
}

@media only screen and (max-width: 960px) {
	.content-container {
		flex-direction: column;
		align-items: center;
	}

	.half-left-container {
		width: 100%;
	}

	.half-right-container {
		width: 100%;
		margin-right: 0px;
	}

	/* .news-information {
    margin-left: 10px !important;
    word-wrap: break-word;
  } */
	.small-information.flex-row {
		flex-direction: row;
		word-break: normal;
	}

	.btn-container {
		margin-top: 6px;
	}

	.divider {
		width: 100%;
	}

	.tag-col {
		width: 90%;
	}

	/* .news-information {
    margin-left: 10px;
  } */
	.first-btn.first {
		/* display: inline !important; */
		justify-content: center;
		/* width: 149px !important;*/
		height: 28px !important;
		font-size: 14px !important;
		padding: 17px 10px !important;
		text-overflow: ellipsis;
		white-space: nowrap;
		margin-left: 7px;
		margin-right: 7px !important;
	}

	.second-btn.second,
	.third-btn.third {
		padding: 17px 12px !important;
		height: 28px !important;
		font-size: 14px !important;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.norms {
		margin: 0px 12px;
	}

	.quote-text {
		/* margin: 0px 12px; */
	}
}

@media screen and (max-width: 600px) {
	.banner h2 {
		font-size: 4.26vw;
		line-height: 6.4vw;
	}

	.banner .ml-10per {
		margin-left: 0;
	}

	.banner .primary-btn {
		margin-top: 3.2vw;
		font-size: 3.73vw;
		padding: 2.1vw 1.6vw 2.1vw;
	}
}

@media only screen and (max-width: 500px) {
	.small-information.flex-row {
		flex-direction: column !important;
		display: contents;
	}

	.small-information.flex-row .flex-row,
	.small-information.flex-row .btn-container {
		width: 60%;
		display: flex;
		justify-content: left;
		font-size: 12px;
	}
}

@media only screen and (max-width: 320px) {
	.small-information.flex-row .flex-row {
		flex-wrap: wrap;
	}

	.first-btn.first {
		padding: 17px 10px !important;
	}

	.second-btn.second,
	.third-btn.third {
		padding: 17px 12px !important;
	}
}

.pagination {
	display: flex;
	justify-content: center;
	margin-top: 40px;
}

.pagination .item {
	text-align: center;
	padding: 5px 0px;
	width: 40px;
	margin: 0px 5px;
	box-sizing: border-box;
	border-radius: 10px;
	border: 1px solid #a9aab87a;
	font-size: 20px;
	cursor: pointer;
}

.pagination .item-select {
	background-color: #6cc0ae;
	border: 1px solid #6cc0ae;
	color: white;
}

.norms {
	display: flex;
	flex-direction: column;
	justify-content: center;
	text-align: center;
	margin-top: 35px;
	padding-bottom: 75px;
}

.buttons {
	display: flex;
	margin: auto;
	margin-bottom: 20px;
}

.author-buttons {
	display: flex;
	/* margin: auto; */
	margin-bottom: 20px;
	margin-top: 16px;
}

.buttons .first-btn.first {
	margin: 0;
	height: 38px;
	background-color: #24cb99;
	border-radius: 10px;
	font-style: normal;
	font-weight: 600;
	font-size: 14px;
	/* identical to box height, or 150% */
	display: flex;
	align-items: center;
	text-align: center;
	color: white;
	padding: 0px 31px;
	margin-right: 12px;
}

.buttons .second-btn.second {
	margin: 0;
	height: 38px;
	background: #008cf1;
	border-radius: 10px;
	font-style: normal;
	font-weight: 600;
	font-size: 14px;
	/* identical to box height, or 150% */
	display: flex;
	align-items: center;
	text-align: center;
	color: white;
	padding: 0px 31px;
	margin-right: 12px;
}

.buttons .third-btn.third {
	margin: 0;
	height: 38px;
	background: #49b3ff;
	border-radius: 10px;
	font-style: normal;
	font-weight: 600;
	font-size: 14px;
	/* identical to box height, or 150% */
	display: flex;
	align-items: center;
	text-align: center;
	color: white;
	padding: 0px 31px;
	margin-right: 12px;
}

footer {
	background-color: #ebebeb;
}

.footer {
	display: flex;
	margin-top: 60px;
	padding: 47px 80px;
}

.ft-logo {
	font-size: 40px;
	font-weight: 600;
	color: var(--primary-1);
	margin: -10px 0px 0px 0px;
	display: flex;
	align-items: center;
}

.ft-slogan {
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	margin-top: 10px;
}

.ft-content {
	flex-grow: 1;
	display: flex;
	flex-direction: column;
	padding: 5px;
	flex-basis: 25%;
	color: #31313e;
	margin-top: 48px;
}


.ft-content:nth-child(2) {
	margin-left: 50px;
}

.wrap-icon {
	margin-top: 35px;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 20px;
}

/* .ft-icon {
	margin-right: 20px;
} */

.ft-title {
	margin: 0;
	font-weight: 500;
	font-size: 20px;
	line-height: 24px;
	margin-bottom: 16px;
}

@media screen and (max-width: 600px) {
	.ft-title {
		font-size: 4.8vw;
		margin-bottom: 5.33vw;
	}

	.other-news+.slim-devider {
		margin-top: 6vw !important;
	}

	.ft-content+.slim-devider {
		margin-bottom: 0 !important;
	}
}

.ft-list-ul {
	line-height: 34px;
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}

.ft-list-ul li {
	cursor: pointer;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
}

@media only screen and (max-width: 600px) {
	.banner h2 {
		font-size: 17.5px;
		width: 70vw;
		line-height: 1.7;
		margin: 10px 0;
	}

	.work-break {
		word-wrap: break-word;
		width: 95%;
	}

	.footer {
		display: flex;
		flex-direction: column;
	}

	.ft-content {
		margin-top: 5px;
		margin-left: 5px;
	}

	.ft-content:nth-child(2) {
		margin-top: 25px;
		margin-left: 5px;
	}

	.ft-title {
		margin-bottom: 12px;
		font-size: 17.5px;
	}
}

.title1.mb-30.mt-0 {
	margin-top: 30px;
}

.modal-content {
	width: 460px;
	margin: auto;
	background-color: #fdfdfd;
	position: relative;
	padding: 0;
	outline: 0;
	box-shadow: 0 4px 10px 0 rgb(0 0 0 / 20%), 0 4px 20px 0 rgb(0 0 0 / 19%);
	text-align: center;
	border-radius: 20px;
}

.modal-content .modal-close-button {
	cursor: pointer;
	padding: 12px;
	font-size: 25px;
}

.modal-content .modal-close-button:hover {
	opacity: 0.8;
}

.modal-content .modal-content-container {
	padding: 30px 40px;
}

.form-input-field {
	width: 380px;
	height: 48px;
	background: #ffffff;
	/* Grey 2 */
	border: 0.5px solid #a9aab8;
	box-sizing: border-box;
	border-radius: 10px;
	outline: none;
	margin-bottom: 16px;
	padding-left: 18px;
}

.form-input-field:focus {
	border-color: var(--primary-0);
	box-shadow: 0px 0px 5px rgba(108, 192, 174, 0.3);
}

.form-submit-btn:hover {
	opacity: 0.8;
}

.center-box {
	width: 460px;
	height: 322px;
	margin: auto;
	background: #fdfdfd;
	box-shadow: 2px 2px 12px rgba(0, 0, 0, 0.1);
	border-radius: 20px;
	margin-top: 210px;
	text-align: center;
}

.center-box .center-box-content {
	display: flex;
	justify-content: center;
	flex-direction: column;
	padding: 30px 40px;
}

@media only screen and (max-width: 600px) {
	.form-input-field {
		width: 100%;
	}

	.w3-modal {
		border-top: 0.5px solid #d8d8d8;
		width: 100%;
		position: absolute;
		top: 72px;
		padding-top: 0px;
		background-color: white !important;
	}

	.modal-content {
		width: 100%;
		margin: auto;
		background-color: #fdfdfd;
		position: relative;
		padding: 0;
		outline: 0;
		box-shadow: none;
		text-align: center;
		border-radius: 0px;
	}

	.outline-btn-2.w-100per {
		color: #3d3d4e;
		font-style: normal;
		font-weight: 600;
		font-size: 14px;
		padding: 10px 6px;
	}

	.modal-content .modal-content-container {
		padding: 0px 24px;
	}

	.modal-note {
		font-size: 13px;
	}

	.modal-note a {
		text-decoration: underline;
	}

	.modal-content .modal-close-button {
		cursor: pointer;
		padding-right: 30px;
		margin-top: -30px;
		font-size: 30px;
		color: #979797;
	}

	.modal-content .modal-close-button:hover {
		color: #6e6e6e;
	}

	#reset-password-body {
		background-color: white !important;
	}

	.center-box {
		box-shadow: none;
		height: 100%;
		width: 100%;
		margin-top: 0px;
		border-radius: 0px;
		border-top: 0.5px solid #d8d8d8;
	}

	.center-box .center-box-content {
		padding: 30px 23px;
	}

	.form-input-field {
		width: 100%;
	}
}

.login-page-mobile {
	border-top: 0.5px solid #d8d8d8;
	padding: 50px 24px;
	/* margin-top: 20px; */
	display: flex;
	flex-direction: column;
	justify-content: center;
	text-align: center;
	height: 100%;
}

.login-page-mobile .form-input-field {
	width: 100%;
}

.login-page-mobile .outline-btn-2 {
	font-weight: 600;
	font-size: 14px;
	color: #3d3d4e;
	display: flex;
	align-items: center;
	justify-content: center;
}

#btnregister {
	display: block;
}

/*


sub-category, super-categor

 */

.sub-category-container,
.super-category-container {
	padding: 40px 80px;
	height: 100%;
}

.sub-category-content,
.super-category-content {
	width: 100%;
	display: grid;
	grid-template-columns: 3fr 1fr;
	grid-template-rows: 100%;
	gap: 0px 30px;
	grid-template-areas: "card-news topicThumbnail-orders-relativeTopics";
}

.card-news {
	grid-area: card-news;
	margin-right: 20px;
}

.card-news-title {
	font-size: 21px;
	font-weight: 600;
	display: flex;
	flex-direction: row;
	gap: 10px;
}

.author-title {
	size: 14px;
	font-weight: 400;
	line-height: 22px;
}

.author-description {
	margin: 0 auto;
}

.infor {
	margin-left: 26px;
}

.topicThumbnail-orders-relativeTopics {
	grid-area: topicThumbnail-orders-relativeTopics;
}

.social-button {
	display: flex;
	flex-direction: row;
}

.first-btn {
	background: #008cf1;
	cursor: default;
}

.second-btn {
	background: #24cb99;
	cursor: default;
}

.third-btn {
	background: #49b3ff;
	cursor: default;
}

.first-btn,
.second-btn,
.third-btn {
	border-radius: 10px;
	padding: 7px 25px;
	color: white;
	display: flex;
	align-items: center;
	margin-right: 12px;
	font-weight: normal;
	font-size: 14px;
}

.first-btn:hover,
.second-btn:hover,
.third-btn:hover {
	opacity: 0.8;
}

@media only screen and (max-width: 972px) {

	.sub-category-content,
	.super-category-content {
		display: unset;
	}

	.card-news {
		margin-right: 0px;
	}

	.first-btn,
	.second-btn,
	.third-btn {
		padding: 5px 10px;
		justify-content: center;
	}
}

@media only screen and (max-width: 760px) {

	.sub-category-container,
	.super-category-container {
		padding: 40px 15px !important;
	}

	.first-btn.mobile,
	.second-btn.mobile,
	.third-btn.mobile {
		width: 65px !important;
		height: 20px !important;
		font-size: 12px;
	}
}

@media only screen and (max-width: 600px) {

	.sub-category-container,
	.super-category-container {
		padding: 5.33vw 4.8vw 0 !important;
	}
}

/*





 */

/* news-details */

.my-wrapper {
	width: 95%;
	margin: auto;
	overflow: hidden;
}

.news-detail-container {
	padding: 40px 80px;
	height: 100%;
}

.news-detail-content {
	width: 100%;
	display: flex;
	justify-content: space-between;
}

.news-detail {
	width: calc(70% - 30px);
	margin-right: 30px;
}

.other-news {
	width: 30%;
}

.news-detail-title {
	font-weight: 600;
	font-size: 30px;
}

.news-detail-description {
	margin-top: 23px;
	/* font-weight: 600; */
	font-size: 15px;
	line-height: 1.5;
}

.news-detail-description ul {
	list-style: unset;
}

.news-detail-description>p {
	user-select: none;
}

.slim-devider {
	width: 100%;
	height: 0.5px;
	background-color: #a9aab8;
}

@media screen and (max-width: 600px) {
	.news-detail-title {
		line-height: 7.2vw;
		font-size: 5.3vw;
	}

	.news-detail-description {
		font-size: 4.26vw;
		line-height: 5.86vw;
		margin-top: 4.8vw;
	}

	.news-detail-description p span {
		font-size: 4.26vw !important;
		line-height: 7.86vw !important;
	}



	.slim-devider {
		width: 100%;
		height: 0.5px;
		margin-top: 5.3vw !important;
		margin-bottom: 5.3vw !important;
		background-color: #d8d8d8;
	}
}

.news-detail-student-slider-container {
	position: relative;
}

.news-detail-student-slider {
	margin-top: 30px;
	overflow-x: hidden;
	overflow-y: hidden;
	position: relative;
}

.horizon-prev {
	position: absolute;
	top: 48%;
	left: 10px;
	cursor: pointer;
}

.horizon-next {
	position: absolute;
	top: 48%;
	right: 10px;
	cursor: pointer;
}

.student-item {
	background-color: white;
	padding: 10px 25px;
	border-radius: 10px 80px 10px 10px;
	width: 346px;
	line-height: 16px;
	font-size: 12px;
	/* margin-right: 30px; */
	margin-right: 10px;
}

.student-avatarSummary {
	display: flex;
	align-items: center;
}

.student-avatar {
	width: 74px;
	height: 70px;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
	border-radius: 20px;
	margin-right: 10px;
}

.student-avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.student-name {
	line-height: 22px;
	font-weight: 600;
}

.student-level {
	font-size: 12px;
	line-height: 16px;
}

.star-rate {
	margin-top: 10px;
}

.student-skill {
	display: flex;
}

.student-summary-label,
.student-skill-label {
	font-weight: 600;
	margin-right: 5px;
	line-height: 16px;
	/* width: fit-content; */
	width: 80px;
}

.student-skill-value {
	margin-left: 10px;
	width: 70%;
}

.line-rate-item {
	height: 20px;
	display: flex;
	align-items: center;
	margin-top: 1px;
}

.line-rate {
	width: 100%;
	height: 6px;
	border-radius: 10px;
	background-color: #f3f3f3;
}

.line-rate-value {
	height: 100%;
	border-radius: 10px;
	background-color: var(--primary-0);
}

.news-detail-qa {
	margin-top: 40px;
}

.news-detail-qa-title {
	font-weight: 600;
	font-size: 22px;
}

.news-detail-qa-menu {
	position: fixed;
	top: 180px;
	left: 2%;
}

@-webkit-keyframes menuBouncing {
	from {
		opacity: 0;
		-webkit-transform: translateY(100%);
		transform: translateY(100%);
	}

	to {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
}

.news-detail-qa-menu-mobile-fixed {
	position: fixed !important;
	bottom: 5px;
	top: unset !important;
	left: 20px;
	height: 50px;
	-webkit-animation: menuBouncing 0.6s ease-in-out;
	-moz-animation: menuBouncing 0.6s ease-in-out;
	-o-animation: menuBouncing 0.6s ease-in-out;
	animation: menuBouncing 0.6s ease-in-out;
}

.news-detail-qa-number {
	width: 30px;
	height: 30px;
	margin-top: 5px;
	border-radius: 100%;
	background-color: var(--primary-0);
	display: flex;
	justify-content: center;
	align-items: center;
	color: white;
	cursor: pointer;
}

.news-detail-qa-content {
	margin-top: 24px;
}

.news-detail-qa-item {
	background-color: white;
	border-radius: 20px;
	padding: 20px;
	margin-bottom: 30px;
}

.news-detail-qa-item ul {
	list-style: unset;
}

.news-detail-description a,
.news-detail-description a *,
.news-detail-qa-item a,
.news-detail-qa-item a * {
	color: var(--primary-0);
	text-decoration: none;
	font-weight: 600;
}

/* .news-detail-qa-item p,
.news-detail-qa-item p span {
  line-height: 30px !important;
} */

.news-detail-qa-item-title {
	display: flex;
	align-items: center;
	font-weight: 600;
	font-size: 20px;
}

.news-detail-qa-item-number {
	margin-right: 10px;
	width: 25px;
	height: 25px;
	border-radius: 10px;
	background-color: var(--primary-0);
	display: flex;
	justify-content: center;
	align-items: center;
	color: white;
}

.news-detail-qa-item-author {
	margin-top: 20px;
	max-width: 386px;
	width: 50%;
	background-color: #fbfbfb;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.05);
	border-radius: 20px;
	padding: 17px;
	display: flex;
	align-items: center;
	cursor: pointer;
}

.news-detail-qa-item-author-avatar {
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
	border-radius: 100%;
	margin-right: 17px;
}

.news-detail-social {
	display: flex;
	margin: 30px -10px 20px;
}

@media screen and (max-width: 600px) {
	.news-detail-qa {
		margin-top: 8vw;
	}

	.news-detail-qa-title {
		font-size: 4.27vw;
		line-height: 5.6vw;
		color: #313131;
	}

	.news-detail-qa-item {
		margin-bottom: 6.4vw;
		padding: 5.3vw 3.2vw;
	}

	.news-detail-social {
		margin: 0;
	}

	.news-detail-social>div {
		margin-left: 0 !important;
	}
}

.news-detail-social-button {
	width: 221px;
	height: 40px;
	border-radius: 10px;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	color: white;
	font-weight: 600;
	margin: 0px 12px;
	cursor: pointer;
}

.btn-facebook {
	background-color: #408bc1;
}

.btn-goolge {
	background-color: #d9534f;
}

.news-detail-tags {
	display: flex;
	flex-wrap: wrap;
	margin: 0px -12px 30px -12px;
}

.news-detail-tags-item {
	background: #e8e8e8;
	border-radius: 10px;
	height: 30px;
	margin: 0px 12px 10px;
	line-height: 22px;
	padding: 0px 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
}

.news-detail-comment-input-box {
	width: 100%;
	height: 100px;
	border: 0.5px solid #a3a3a3;
	box-sizing: border-box;
	border-radius: 10px;
	padding: 10px;
	resize: none;
	outline: none;
	margin-top: 20px;
}

.news-detail-login-facebook-button {
	margin-top: 10px;
	width: fit-content;
	height: 38px;
	line-height: 22px;
	border-radius: 10px;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	color: white;
	font-weight: 600;
	padding: 0px 10px;
	cursor: pointer;
	margin-bottom: 20px;
}

.news-detail-comment-title {
	margin-top: 30px;
	font-weight: 600;
	font-size: 16px;
	line-height: 24px;
}

@media screen and (max-width: 600px) {
	.news-detail-tags {
		margin: 0;
	}

	.news-detail-tags-item {
		margin: 4.27vw 1.6vw 0 0;
	}

	.news-detail-comment-input-box {
		margin-top: 0;
	}

	.news-detail-comment-title {
		margin-top: 6px;
	}
}

.news-detail-comment-item {
	margin-top: 30px;
	display: grid;
	grid-template-columns: 55px 1fr;
}

.news-detail-comment-item-avatar {
	width: 44px;
	height: 44px;
	overflow: hidden;
	border-radius: 100%;
	margin-right: 12px;
}

.news-detail-comment-item-nameDate {
	display: flex;
}

.news-detail-comment-item-name {
	font-weight: 600;
	line-height: 22px;
	margin-right: 12px;
	cursor: pointer;
}

.news-detail-comment-item-date {
	line-height: 22px;
	font-size: 12px;
}

.news-detail-comment-item-content {
	line-height: 19px;
	font-size: 13px;
}

.other-news-title {
	margin-top: 48px;
	font-weight: 600;
	font-size: 22px;
	line-height: 30px;
}

.other-news-item {
	display: flex;
	/* align-items: center; */
	margin-top: 30px;
	cursor: pointer;
}

@media screen and (max-width: 600px) {
	.other-news-title {
		margin-top: 4.8vw;
		font-size: 4.8vw;
		color: #313131;
	}

	.other-news-item {
		margin-top: 5.33vw;
	}
}

.other-news-item-avatar {
	width: 110px;
	height: 70px;
	overflow: hidden;
	border-radius: 10px;
	margin-right: 12px;
	min-width: 110px;
	min-height: 70px;
}

.other-news-summary {
	width: calc(100% - 122px);
}

.other-news-summary-title {
	font-weight: 600;
}

/* .news-information {
  margin-left: 20px;
} */

.avatar-datetime,
.views,
.comments {
	margin-right: 20px;
	align-items: center;
	margin-top: 6px;
}

@media only screen and (min-width: 1921px) {
	body {
		margin: auto;
	}

	.news-detail-qa-menu {
		left: auto;
	}
}

@media only screen and (max-width: 1240px) {
	.news-detail-container {
		padding: 40px 40px;
	}

	.news-detail-qa-content {
		position: relative;
	}

	.news-detail-qa-menu {
		display: flex;
		position: absolute;
		top: -20px;
	}

	.news-detail-qa-number {
		margin-right: 5px;
	}
}

@media only screen and (max-width: 1160px) {
	.news-detail-container {
		padding: 40px 20px;
	}
}

@media only screen and (max-width: 600px) {
	.news-detail-container {
		padding: 5.33vw 4.8vw 0;
	}

	.norms .buttons {
		margin-bottom: 0;
	}

	.norms {
		padding-bottom: 8vw;
	}
}

@media only screen and (max-width: 972px) {
	.news-detail-content {
		flex-direction: column;
	}

	.my-wrapper {
		/* max-width: 350px; */
	}

	.news-detail {
		width: 100%;
		margin-right: 0px;
	}

	.other-news {
		width: 100%;
	}

	.other-news-top-image {
		display: none;
	}
}

@media only screen and (max-width: 670px) {
	.news-detail-qa-item-author {
		width: unset;
		max-width: unset;
	}
}

/*


account



*/

.account-container {
	width: 100%;
	margin-top: 40px;
}

.account-content {
	display: flex;
	flex-direction: row;
	margin: 0px auto;
	max-width: 1310px;
	padding: 0px 15px;
}

.account-content .left-container,
.account-content .right-container {
	background: #ffffff;
	height: 100%;
	border-radius: 20px;
	padding: 20px 25px 70px 25px;
}

.account-content .right-container-w-post {
	background: #ffffff;
	height: 100%;
	border-radius: 20px;
	/* display: none; */
}

.left-container {
	user-select: none;
	width: 298px;
	min-width: 298px;
	display: flex;
	flex-direction: column;
	text-align: center;
	margin-right: 30px;
	padding: 40px 0px;
	transition: 500ms;
}

.wrap-menu-responsive {
	display: none;
}

.right-container,
.right-container-w-post {
	width: 100%;
}

.right-container .form-title {
	margin: 5px 0;
}

.left-content {
	display: flex;
	justify-content: center;
}

.account-avatar {
	width: 108px;
	height: 108px;
	border-radius: 50%;
}

.avatar-container {
	position: relative;
	width: 108px;
	height: 112px;
	/* display: block; */
}

.avatar-mobile-container {
	display: none;
}

.edit-round-btn {
	width: 24px;
	height: 24px;
	background-color: #6cc0ae;
	border-radius: 50%;
	position: absolute;
	right: 10px;
	bottom: 0px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.action-container {
	text-align: left;
	margin-top: 36px;
	padding: 40px 31px;
}

.action-container>.title3.tablinks.selected {
	text-decoration: none;
	color: #3d3d4e !important;
	font-weight: 600 !important;
	font-family: OpenSans-SemiBold;
}

.action-container>.title3.tablinks {
	text-decoration: none;
	color: #6e6d7a !important;
	cursor: pointer;
	font-weight: normal !important;
	font-family: OpenSans;
}

.action-container>.title3.tablinks {
	padding: 10px 0px;
	border-bottom: 0.5px solid #e2e2e2;
}

.action-container>.title3.tablinks:last-child {
	border-bottom: none;
}

.action-container>p>a:hover {
	text-decoration: none;
	color: #3d3d4e !important;
}

.form-account {
	padding: 30px 23px;
	display: flex;
	flex-direction: column;
	display: none;
}

.form-account-information {}

.form-account .form-title {
	margin: 0px;
	padding: 0px 0px 10px;
}

.form-account .form-input-field {
	width: 493px;
	height: 40px;
}

.form-account .form-input-field:focus {
	border-color: var(--primary-0);
	box-shadow: 0px 0px 5px rgba(108, 192, 174, 0.3);
}

.form-account .form-submit-btn {
	width: 150px;
}

.posts-container {
	padding: 20px 30px 27px;
}

.posts-container .title2 {
	margin-bottom: 20px;
}

.posts-container .filter-container {
	width: 100%;
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
}

.posts-container .filter-container .filter-btn {
	width: 109px;
	height: 36px;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-right: 0px;
}

.posts-container .filter-container .select-box {
	margin: 0px 16px 0px 0px !important;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
	white-space: nowrap;
}

.posts-container .filter-container .select-box:focus {
	border-color: var(--primary-0);
	box-shadow: 0px 0px 5px rgba(108, 192, 174, 0.3);
}

.posts-container>.space-line-option {
	width: 100%;
	margin: 0px;
	margin-top: 30px;
}

.table-container {
	margin-top: 30px;
}

.striped-table {
	width: 100%;
	background: #edf7f5;
	border-radius: 10px 10px 0px 0px;
	border-spacing: 0px;
}

.striped-table>thead>tr>th {
	padding: 16px;
	text-align: left;
	font-size: 14px;
	color: #3d3d4e;
}

.striped-table>tbody>tr>td {
	background: #edf7f5;
	padding: 16px;
	font-size: 14px;
	color: #3d3d4e;
}

.striped-table>tbody>tr:nth-of-type(odd)>td {
	background-color: white !important;
}

.status-tag {
	border-radius: 20px;
	width: 110px;
	height: 24px;
	/* padding     : 5px 20px; */
	display: flex;
	align-items: center;
	justify-content: center;
}

.status-tag.waiting {
	background: #f7d4d0;
}

.status-tag.published {
	background: #6cc0ae7e;
	border-radius: 20px;
}

.dropdown-toggle.select-box {
	position: relative;
}

.dropdown-years {
	right: 50px;
}

.dropdown-month {
	left: 70px;
}

.dropdown-month,
.dropdown-years {
	max-height: 300px;
	overflow-y: auto;
	background: #fbfcfd;
	display: none;
	position: absolute;
	z-index: 11;
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
	border-radius: 10px;
	padding: 5px 5px;
	width: 100px;
	top: 40px;
	/* left: 100px; */
}

.dropdown-month .month-item,
.dropdown-years .year-item {
	padding: 5px;
	color: black;
	font-weight: normal;
	cursor: pointer;
}

.dropdown-month .month-item:hover,
.dropdown-years .year-item:hover {
	background-color: #dcf3eb;
}

.dropdown-month .current-month,
.dropdown-years .current-year {
	background-color: #dcf3eb;
}

.dropdown-calendar {
	background: #fbfcfd;
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
	border-radius: 10px;
	display: none;
	position: absolute;
	z-index: 10;
}

.dropdown-calendar.show {
	display: block;
}

.dropdown-calendar .calendar {
	width: 350px;
}

.dropdown-calendar .calendar .month-year {
	background-color: #dcf3eb;
	padding: 17px 32px;
	display: flex;
	justify-content: space-between;
	flex-direction: row;
}

.dropdown-calendar .calendar .month-year .month,
.dropdown-calendar .calendar .month-year .year {
	border: none;
	background-color: transparent;
	outline: none;
	font-size: 14px;
	line-height: 19px;
	display: flex;
	align-items: center;
	text-align: center;
	color: #53596f;
}

.dropdown-calendar .calendar .weekdays {
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	padding: 20px 19px;
	font-weight: 600;
	font-size: 12px;
	color: #53596f;
}

.days,
.days-mobile {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	padding: 10px 12px;
	justify-content: center;
}

.days div,
.days-mobile div {
	font-size: 14px;
	margin: 9px 7px;
	width: 30px;
	height: 30px;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	border-radius: 50%;
	/* transition  : background-color 0.2s; */
}

.days div:hover:not(.today),
.days-mobile div:hover:not(.today) {
	border-radius: 50%;
	background: #dcf3eb;
	cursor: pointer;
}

.prev-date,
.next-date {
	opacity: 0.5;
}

.today {
	background-color: #6cc0ae;
	color: white;
}

.list-filter {
	background: #fbfcfd;
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
	border-radius: 10px;
	width: 176px;
	height: 80px;
	position: absolute;
	display: none;
}

.list-filter-responsive {
	background: #fbfcfd;
	box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
	border-radius: 10px;
	width: 176px;
	height: 80px;
	position: absolute;
	display: none;
}

.list-filter-responsive .filter-item,
.list-filter .filter-item {
	padding: 10px 17px;
	margin: 1.25px;
}

.list-filter-responsive .filter-item:hover,
.list-filter .filter-item:hover {
	background-color: #dcf3eb;
	cursor: pointer;
}

.list-filter-responsive .filter-item:last-child:hover,
.list-filter .filter-item:last-child:hover {
	border-radius: 0px 0px 10px 10px;
}

.list-filter-responsive .filter-item:first-child:hover,
.list-filter .filter-item:first-child:hover {
	border-radius: 10px 10px 0px 0px;
}

#settings,
#change-password {
	display: block;
}

#information {
	display: block;
}

.select-box-mobile,
.select-box-mobile_custom {
	cursor: pointer;
	border-color: transparent !important;
	background-color: white;
	width: 100% !important;
	border-radius: 10px;
	height: 40px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 9px 17px;
	margin-bottom: 16px;
}

@media only screen and (min-width: 601px) {
	.window-device {
		display: block;
	}

	.mobile-device {
		display: none;
	}
}

@media only screen and (max-width: 670px) {

	/* .window-device {
    display: none;
  } */
	.mobile-device {
		display: block;
	}

	.account-content {
		width: 100%;
		padding: 0px 12px;
		display: flex;
		flex-direction: column;
	}

	.select-box-mobile,
	.select-box-mobile_new {
		cursor: pointer;
		border-color: transparent !important;
		background-color: white;
		width: 100% !important;
		border-radius: 10px;
		height: 40px;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 9px 17px;
		margin-bottom: 16px;
	}

	.avatar-container-bg {
		display: flex;
		/* flex-direction: column; */
		justify-content: center;
	}

	.information-container {
		background: #ffffff;
		border-radius: 10px;
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
		justify-content: center;
		text-align: center;
		padding: 20px 12px;
	}

	.avatar-container {
		display: flex;
		justify-content: center;
		margin-bottom: 16px;
	}

	.form-account-mobile {
		text-align: left;
		margin-top: 20px;
	}

	.title4.form-title {
		margin-bottom: 10px;
	}

	.form-input-field {
		width: 100% !important;
		height: 40px;
		color: #3d3d4e;
	}

	.list-filter {
		top: 45px;
		width: 100% !important;
		z-index: 3;
		height: fit-content;
	}

	.calendar-container button,
	.status-container button,
	.payment-container button {
		width: 100% !important;
		margin: 20px 0px 0px;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.calendar-container,
	.status-container,
	.payment-container {
		position: relative;
	}

	.payment-container {
		margin-bottom: 20px;
	}

	.filter-container {
		border-bottom: 0.5px solid #a9aab8;
		display: none;
	}
}

.post-card-item {
	background-color: #f5fbf9;
	padding: 26px 12px;
}

.post-card-item:nth-of-type(even) {
	background-color: white;
}

.post-card-item:first-child {
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	/* margin-top          : 10px; */
}

.post-card {
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	background-color: white;
	padding-top: 1px;
}

.user-post-container {
	text-align: start;
	/* display: none; */
}

.pen-icon-edit {
	font-size: 11px;
	color: white;
}

.wrap-title {
	align-items: center;
}

.wrap-title img {
	cursor: pointer;
}

@media only screen and (min-width: 601px) {
	.account-content {
		width: 100%;
		padding: 0px 12px;
		display: flex;
		flex-direction: column;
	}
}

.wrap-top-infor {
	margin-bottom: 20px;
	display: none;
}

@media only screen and (max-width: 960px) {
	.list-filter-responsive {
		top: 45px;
		width: 100% !important;
		z-index: 3;
		height: fit-content;
	}

	.wrap-menu-responsive {
		display: block;
	}

	.left-container {
		display: none;
	}

	.account-container {
		margin-top: 24px;
	}

	.wrap-top-infor {
		display: block;
	}
}

@media only screen and (min-width: 961px) {
	.left-container {
		display: block !important;
	}

	.account-content {
		display: flex;
		flex-direction: row;
	}

	.account-container {
		margin-top: 40px;
	}
}

@media only screen and (max-width: 1120px) {
	.margin-image {
		margin-left: 10px;
	}

	.select-box {
		width: auto !important;
	}
}

.displayNone {
	display: none;
}

/*


aboutUs


 */

.image-banner {
	position: relative;
	width: 100%;
}

.image-banner .banner-child {
	position: absolute;
	top: 0;
	width: 100%;
	color: #313131;
}

.wrap-content-about-us {
	margin-bottom: 60px;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 0px 12px;
	max-width: 1110px;
	margin-left: auto;
	margin-right: auto;
}

.about-title {
	width: 80%;
	margin-top: 60px;
	text-align: center;
	font-weight: 600;
	font-size: 30px;
	line-height: 41px;
	color: #313131;
}

.div-space-title {
	height: 5px;
	width: 80px;
	background: #6cc0ae;
	border-radius: 50px;
	margin-top: 10px;
}

.ab-description {
	margin-top: 40px;
	text-align: center;
}

.ab-content-2 {
	width: 80%;
	margin-top: 60px;
	font-weight: 600;
	font-size: 22px;
	line-height: 30px;
	text-align: center;
	color: #313131;
}

.ab-description-2 {
	display: flex;
	justify-content: space-between;
	margin-top: 60px;
}

.ab-description-2 .container-square-1 {
	width: 48%;
	display: flex;
}

.container-square-1 .ab-icon {
	width: 72px;
	min-width: 72px;
	background: #dcf3eb;
	height: 72px;
	border-radius: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-right: 17px;
	margin-left: 10px;
}

.container-square-1 .text-square1 {
	display: flex;
	flex-direction: column;
}

.text-square1 .ab-square-title {
	font-weight: 600;
	font-size: 16px;
	line-height: 24px;
}

.text-square1 .ab-square-description {
	font-size: 14px;
	line-height: 22px;
	color: #6e6d7a;
	margin-top: 10px;
}

.ab-description-3 {
	line-height: 22px;
	text-align: justify;
	color: #313131;
	margin-top: 60px;
}

.Tags {
	margin-top: 60px;
	font-weight: 600;
	font-size: 30px;
	line-height: 41px;
	text-align: center;
	color: #313131;
}

.wrap-tags {
	margin-top: 43px;
	display: flex;
	flex-direction: row;
	flex-flow: row wrap;
	justify-content: center;
}

.wrap-tags .tag-item {
	cursor: pointer;
	font-size: 14px;
	line-height: 22px;
	display: flex;
	align-items: center;
	background: #ebebeb;
	height: 32px;
	padding: 0px 18px;
	border-radius: 10px;
	margin-left: 11px;
	white-space: nowrap;
	margin-bottom: 12px;
}

.ab-wrap-end {
	margin-top: 5px;
}

.ab-wrap-end .kinhnghiemthucte {
	padding: 7px 32px;
	background-color: #24cb99;
	border-radius: 10px;
	color: white;
}

.ab-wrap-end .tuvan {
	padding: 7px 36px;
	background-color: #008cf1;
	color: white;
	border-radius: 10px;
	margin: 0px 12px;
}

.ab-wrap-end .uytin {
	padding: 7px 39px;
	background-color: #49b3ff;
	color: white;
	border-radius: 10px;
}

.description-end {
	margin-top: 20px;
	font-size: 16px;
	line-height: 24px;
	text-align: center;
}

.div-space-end {
	width: 100%;
	height: 1px;
	background-color: #d8d8d8;
	margin: 30px 0px;
}

.full-width {
	width: 100%;
}

.width-44 {
	width: 44px;
}

.policy-intro {
	font-size: 16px;
	line-height: 24px;
	padding-top: 10px;
}

.policy-group-row {
	margin: 20px 0;
}

.policy-title {
	font-size: 18px;
	line-height: 24px;
	font-weight: bold;
}

.policy-desc {
	font-size: 16px;
	line-height: 24px;
}

.policy-group-row ul li {
	font-size: 16px;
	line-height: 24px;
}


@media only screen and (max-width: 600px) {
	.wrap-content-about-us {
		margin-bottom: 30px;
	}

	.about-title {
		margin-top: 30px;
		font-size: 25px;
		width: 90vw;
	}

	.ab-description {
		font-size: 14px;
		text-align: justify;
	}

	.Tags {
		margin-top: 30px;
	}

	.ab-description-2 {
		display: flex;
		flex-direction: column;
		margin-top: 0px;
	}

	.ab-content-2 {
		margin-top: 30px;
		font-size: 20px;
		font-weight: 501;
		width: 70vw;
	}
}

.ab-description-3 {
	margin-top: 30px;
}

.container-square-1 {
	width: 100% !important;
	margin-top: 30px;
}

.wrap-quare-receive {
	margin-top: 0px !important;
}

.wrap-tags {
	margin-top: 30px;
}

*,
:after,
:before {
	box-sizing: border-box;
}

.pull-left {
	float: left;
}

.pull-right {
	float: right;
}

.clearfix:after,
.clearfix:before {
	content: "";
	display: table;
}

.clearfix:after {
	clear: both;
	display: block;
}

.pos-absolute {
	position: absolute;
}

.calendara {
	z-index: 10;
	width: 300px;
	font-size: 100%;
	margin: 5px auto 0;
	perspective: 1000px;
	cursor: default;
	position: absolute;
	top: 0;
	display: none;
}

.calendara .header {
	height: 48px;
	position: relative;
	color: #53596f;
}

.calendara .header .text {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #308ff0;
	background: #dcf3eb;
	border-radius: 10px 10px 0px 0px;
	padding: 15px;
	backface-visibility: hidden;
	/* opacity: 0; */
}

.calendara .header .text>span {
	text-align: center;
	display: block;
}

.calendara .header.active .text {
	/* transform: rotateX(0deg); */
	opacity: 1;
}

.months {
	width: 100%;
	height: fit-content;
	position: relative;
}

.months .hr {
	height: 1px;
	margin: 15px 0;
	background: #ccc;
}

.month {
	padding: 15px;
	width: inherit;
	height: inherit;
	background: #fff;
	position: absolute;
	backface-visibility: hidden;
	transition: all 0.01s ease-in-out 0s;
	box-shadow: 0px 5px 8px rgba(0, 0, 0, 0.1);
}

.months[data-flow="left"] .month {
	transform: rotateY(-180deg);
}

.months[data-flow="right"] .month {
	transform: rotateY(180deg);
}

.table {
	width: 100%;
	font-size: 12px;
	font-weight: 400;
	display: table;
}

.table .row {
	display: table-row;
}

.table .row.head {
	color: #53596f;
	text-transform: uppercase;
	font-weight: 600;
}

.table .row .cell {
	width: 14.28%;
	padding: 5px;
	text-align: center;
	display: table-cell;
}

.table .row .cell.disable {
	color: #9897a0;
}

.table .row .cell span {
	display: block;
	width: 28px;
	height: 28px;
	color: #53596f;
	line-height: 28px;
	/* transition: color, background 0.4s ease-in-out 0s; */
}

.table .row .cell.curent span {
	border: 1px solid #6cc0ae;
	border-radius: 100px;
}

.table .row .cell.curent span:hover {
	color: #fff;
	background-color: #6cc0ae;
	border-radius: 100px;
}

.table .row .cell.active span,
.table .row .cell.active span:hover {
	color: #fff;
	background-color: #6cc0ae;
	border-radius: 100px;
}

.table .row .cell span:hover {
	background-color: #dcf3eb;
	border-radius: 100px;
	cursor: pointer;
}

.months .month[data-active="true"] {
	transform: rotateY(0);
}

.header [data-action] {
	color: inherit;
	position: absolute;
	top: 50%;
	margin-top: -20px;
	width: 40px;
	height: 40px;
	z-index: 10;
	opacity: 0;
	transition: all 0s ease-in-out 0s;
}

.header [data-action]>i {
	width: 20px;
	height: 20px;
	display: block;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-top: -10px;
	margin-left: -10px;
	font-size: 10px;
}

.header [data-action]>i:before,
.header [data-action]>i:after {
	top: 50%;
	margin-top: -1px;
	content: "";
	position: absolute;
	height: 2px;
	width: 20px;
	border-top: 2px solid;
	border-radius: 2px;
}

.header [data-action*="prev"] {
	left: 15px;
}

.header [data-action*="next"] {
	right: 15px;
}

.header [data-action*="prev"]>i:before,
.header [data-action*="prev"]>i:after {
	left: 0;
}

.header [data-action*="prev"]>i:before {
	top: 3px;
	transform: rotate(-45deg);
}

.header [data-action*="prev"]>i:after {
	top: auto;
	bottom: 3px;
	transform: rotate(45deg);
}

.header [data-action*="next"]>i:before,
.header [data-action*="next"]>i:after {
	right: 0;
}

.header [data-action*="next"]>i:before {
	top: auto;
	bottom: 3px;
	transform: rotate(-45deg);
}

.header [data-action*="next"]>i:after {
	top: 3px;
	transform: rotate(45deg);
}

.header.active [data-action="prev-month"] {
	opacity: 1;
	display: flex;
	align-items: center;
}

.header.active [data-action="next-month"] {
	opacity: 1;
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

/* CUSTOM NEW HOME */

.bg-white {
	background-color: white;
}

.pb-10 {
	padding-bottom: 10px;
}

.mt-22 {
	margin-top: 22px;
}

.mt-35 {
	margin-top: 35px;
}

.mt-56 {
	margin-top: 35px;
}

.mr-10 {
	margin-right: 10px;
}

.mb-10 {
	margin-bottom: 10px;
}

.mb-24 {
	margin-bottom: 24px;
}

.d-grid {
	display: grid;
}

.w-60per {
	width: 60%;
}

.d-flex {
	display: flex;
}

.d-block {
	display: block;
}

.d-block-important {
	display: block !important;
}

.gird-col-7-3 {
	grid-template-columns: 70% 30%;
	align-items: start;
}

.grid-col-2 {
	grid-template-columns: auto auto;
}

.grid-gap-col-14 {
	grid-column-gap: 14px;
}

.jc-between {
	justify-content: space-between;
}

.jc-evenly {
	justify-content: space-evenly;
}

.jc-center {
	justify-content: center;
}

.jc-end {
	justify-content: flex-end;
}


.flex-wrap {
	flex-wrap: wrap;
}

.size_img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media screen and (max-width: 800px) {
	.d-block-md {
		display: block;
	}

	.w-100-md {
		width: 100%;
	}

	.jc-start-md {
		justify-content: flex-start;
	}

	.grid-col-1-md {
		grid-template-columns: 1fr;
	}

	.mt-14-md {
		margin-top: 14px;
	}

	.mt-24-md {
		margin-top: 24px;
	}
}

@media screen and (max-width: 640px) {
	.mr-0-sm {
		margin-right: 0;
	}
}

/* COMPONENT TAGS */

.tags_section {
	display: block;
	font-size: 14px;
	line-height: 19px;
	color: var(--black-6);
	font-weight: normal;
	border: 1px solid var(--black-4);
	padding: 6px 10px;
	border-radius: 50px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	-ms-border-radius: 50px;
	-o-border-radius: 50px;
}

/* COMPONENT LINE GREY */

.line-grey {
	border: none;
	outline: none;
	width: 100%;
	height: 1px;
	background: var(--black-4);
}

/* COMPONENT SECTION ITEM --- HOME */

.section_item .wrap-title_section .title_section {
	font-weight: 600;
	font-size: 28px;
	line-height: 38px;
	color: var(--primary-0);
	position: relative;
	padding-left: 13px;
}

.section_item .wrap-title_section .title_section:before {
	position: absolute;
	content: "";
	height: 100%;
	width: 5px;
	background: var(--primary-0);
	top: 0;
	left: 0;
	border-radius: 50px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	-ms-border-radius: 50px;
	-o-border-radius: 50px;
}

/* COMPONENT SIDEBAR ITEM */

.siderbar_item .siderbar_item-title {
	margin: 0;
	font-weight: 600;
	font-size: 22px;
	line-height: 30px;
	color: var(--black-2);
}

/* COMPONENT CARD FULLROW SIDEBAR */

.card_sidebar {
	display: block;
}

.card_sidebar .card_sidebar-thumbnail {
	width: 110px;
	height: 70px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
	overflow: hidden;
}

.card_sidebar .card_sidebar-title {
	color: #313131;
	font-size: 15px;
	line-height: 25px;
	font-weight: normal;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

/* COMPONENT CARD THUMBNAIL SIDEBAR */

.card_sidebar-thumbnail {
	display: block;
	width: 100%;
}

.card_sidebar-thumbnail .thumbnail {
	width: 100%;
	height: 190px;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	-ms-border-radius: 15px;
	-o-border-radius: 15px;
	overflow: hidden;
}

.card_sidebar-thumbnail .card_sidebar-thumbnail-title {
	font-weight: normal;
	font-size: 16px;
	line-height: 23px;
	color: var(--black-1);
	font-weight: 400;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

/* COMPONENT CARD FULLROW SIDEBAR - CARD TALK SHOW */

.siderbar_item.talkShow .siderbar_item-body {
	background-color: #edf9f5;
	padding: 24px 20px;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	-ms-border-radius: 20px;
	-o-border-radius: 20px;
	padding-bottom: 40px;
}

/* COMPONENT AUTHOR */

.author-col {
	padding: 20px;
	border: 1px solid var(--black-4);
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	-ms-border-radius: 20px;
	-o-border-radius: 20px;
}

/* COMPONENT CARD NEWS */

.news-item {
	display: grid;
	grid-template-columns: auto 1fr;
	grid-column-gap: 20px;
	margin-bottom: 44px;
}

.news-item .wrap_thumbnail {
	display: block;
	width: 238px;
	height: 152px;
	overflow: hidden;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
}

.news-item .wrap_thumbnail img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.news-item .fb-btn {
	font-size: 11px;
}

.news-item .news-information {
	width: 100%;
}

.news-item .news-information .title-news-information {
	margin: 0;
	font-weight: 600;
	font-size: 20px;
	line-height: 27px;
	color: #0d0c22;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.news-item .news-information .news-description {
	font-size: 14px;
	text-align: justify;
	color: var(--black-1);
	margin-top: 10px;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	/* max-height: 68px; */
	max-height: 92px;
}

.news-item:hover .wrap_thumbnail img {
	transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-ms-transition: all 0.5s;
	-o-transition: all 0.5s;
}

@media screen and (max-width: 640px) {
	.news-item {
		grid-column-gap: 12px;
		margin-bottom: 25px;
	}

	.news-item .wrap_thumbnail {
		width: 28.3vw;
		height: 18.1vw;
	}

	.news-item .news-information .title-news-information {
		font-size: 4vw;
		line-height: 5.33vw;
	}

	.news-item .news-information .news-description {
		display: none;
	}

	.news-item .customMoreInfo {
		width: 100% !important;
		display: flex;
		justify-content: space-between !important;
		margin: 5px 0;
	}

	.news-item .customMoreInfo>div {
		margin: 0;
		width: unset !important;
	}
}

@media screen and (max-width: 600px) {
	.news-item {
		margin-bottom: 8vw;
	}
}

/* HOME */

.sidebar-new {
	padding-right: 25px;
}

@media screen and (max-width: 800px) {
	.sidebar-new {
		padding-right: 0;
	}

	.banner-link-facebook {
		display: none;
	}

	.banner-link-facebook-mobile {
		/* margin-top: 10px; */
		display: block;
	}


}

/* CSS SLIDER */

.slider-container {
	width: 100%;
	height: 220px;
	margin: auto;
	display: block;
	overflow: hidden;
	position: relative;
}

.slider-container .slider {
	position: absolute;
	left: 0;
	top: 0;
	min-width: 100%;
	height: 100%;
	display: flex;
	cursor: pointer;
	transition-timing-function: linear;
	z-index: 1;
}

.slider-container .slide:not(:last-child) {
	margin-right: 15px;
}

.slider-container .slider-control {
	position: absolute;
	z-index: 2;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	cursor: pointer;
}

.slider-container .slider-control.control-previous {
	left: 0;
}

.slider-container .slider-control.control-next {
	right: 0;
}

/* ========================= */

.card_slider_home {
	width: 230px;
	height: 100%;
}

.card_slider_home .card_slider_home-body {
	width: 100%;
	height: 100%;
	display: block;
}

.card_slider_home .card_slider_home-body .card_slider_home-thumbnail {
	width: 100%;
	height: 135px;
	border-radius: 15px;
	overflow: hidden;
}

.card_slider_home .card_slider_home-body .card_slider_home-title {
	margin-top: 16px;
	font-weight: normal;
	font-size: 16px;
	line-height: 21px;
	color: var(--black-1);
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
	font-weight: 500;
}

.wrap_sidebar_details {
	width: 30%;
}

@media screen and (max-width: 957px) {
	.wrap_sidebar_details {
		width: 100%;
	}
}

.wrap_sidebar_details .other-news {
	width: 100%;
}

.news-detail-qa-item img {
	margin-top: 20px 0;
	/* width: 100% ; */
	max-width: 100%;
	height: auto;
	object-fit: cover;
	border-radius: 10px;
}

@media screen and (min-width: 600px) {
	.footer {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		/* grid-template-columns: repeat(auto-fit, minmax(30px, max-content)); */
		grid-column-gap: 25px;
	}
}

@media screen and (min-width: 1200px) {
	.footer {
		display: grid;
		grid-template-columns: repeat(5, 1fr);
		grid-column-gap: 25px;
	}
}

.btn_reply {
	cursor: pointer;
	color: #337ab7;
	font-size: 14px;
}

.btn_reply:hover {
	text-decoration: underline;
}

.news-detail-comment-item_reply {
	margin-left: 50px;
}

.news-detail-comment-item .wrap_fromReply .content_reply {
	width: 100%;
	padding: 0;
}

.btn_submit_form {
	border: none;
	outline: none;
	background-color: #337ab7;
	color: white;
	font-size: 14px;
	font-weight: 500;
	border-radius: 5px;
	padding: 5px 15px;
	cursor: pointer;
}

.ml-5 {
	margin-left: 5px;
}

.wrap_fromReply {
	display: none;
}

input[name="open_formReply"]:checked+.wrap_fromReply {
	display: block;
}

@media only screen and (max-width: 440px) {
	.student-item {
		width: -webkit-fill-available;
		/* margin-right: 0; */
		width: 85.3vw;
	}
}

.logo-img-sidenav {
	width: 200px;
}

.btn_loadmore {
	color: white;
	background: #24cb99;
	width: 100px;
	height: 40px;
	border-radius: 5px;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 14px;
}

@media screen and (max-width: 500px) {
	.btn_loadmore {
		width: 90px;
		height: 35px;
		font-size: 12px;
	}
}

/* PAGE DETAILS CUSTOM */

.page_details .slider-container {
	height: 250px;
}

@media screen and (max-width: 600px) {
	.mb-0-sm {
		margin-bottom: 0 !important;
	}
}

.container_app {
	width: 100%;
	max-width: 1400px;
	margin-left: auto;
	margin-right: auto;
}

/* form_createArticle_user */

.form_createArticle_user .formActicle-2-col {
	grid-template-columns: 200px 1fr;
}

@media screen and (max-width: 600px) {
	.form_createArticle_user .formActicle-2-col {
		grid-template-columns: 1fr;
	}

	.form_createArticle_user .formActicle-2-col .title_row {
		margin-bottom: 10px;
		margin-top: 20px;
	}
}

.btn-primary {
	border: none;
	outline: none;
	cursor: pointer;
	display: block;
	padding: 5px 10px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
	background-color: var(--primary-1);
	color: white;
	font-weight: 500;
}

.btn-secondary {
	cursor: pointer;
	display: block;
	padding: 5px 10px;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
	background-color: #008cf1;
	color: white;
	font-weight: 500;
}

.mb-30 {
	margin-bottom: 30px;
}

.style-input {
	border: none;
	outline: none;
	border: 1px solid #ced4da;
	color: #495057;
	padding: 5px 10px;
}

.wrap_thumbnail_form {
	width: 200px;
	height: 200px;
	display: block;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
	cursor: pointer;
	overflow: hidden;
}

.wrap_thumbnail_form img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.form_createArticle_user .title_row {
	color: #212529;
	font-size: 16px;
}

.btn-toggle {
	width: 200px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
	cursor: pointer;
	color: var(--primary-1);
	border: 2px solid var(--primary-1);
	font-weight: 500;
	text-align: center;
	font-size: 15px;
}

.btn-toggle:hover {
	background-color: var(--primary-1);
	color: white;
}

.page_account .btn-toggle {
	width: 100%;
	margin: 0 10px;
}

@media screen and (max-width: 600px) {
	.page_account .btn-toggle {
		width: 100%;
		margin: 0 5px;
	}

	.btn-toggle {
		font-size: 12px;
	}
}

.page_account .form_createArticle_user {
	display: none;
}

input[name="tab_create_article"][id="tab_title"]:checked~.wrap_button_control_form .btn-title-form,
input[name="tab_create_article"][id="tab_content"]:checked~.wrap_button_control_form .btn-content-form,
input[name="tab_create_article"][id="tab_category"]:checked~.wrap_button_control_form .btn-category-form,
input[name="tab_create_article"][id="tab_seo"]:checked~.wrap_button_control_form .btn-seo-form {
	background-color: var(--primary-1);
	color: white;
}

input[name="tab_create_article"][id="tab_title"]:checked~.wrap_content_form .content_tab-title,
input[name="tab_create_article"][id="tab_content"]:checked~.wrap_content_form .content_tab-content,
input[name="tab_create_article"][id="tab_category"]:checked~.wrap_content_form .content_tab-category,
input[name="tab_create_article"][id="tab_seo"]:checked~.wrap_content_form .content_tab-seo {
	display: block;
}

input[id="open_optionAccount"]:checked~.list-filter-responsive {
	display: block;
}

.text-black {
	color: black;
}

.fw-normal {
	font-weight: normal;
}

.d-none-mobile {
	display: block;
}

.d-none {
	display: none;
}

.mr-15 {
	margin-right: 15px;
}

@media screen and (max-width: 670px) {
	.d-none-mobile {
		display: none;
	}
}

.btn-submit {
	width: 120px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: white;
	background-color: var(--primary-1);
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
	border: none;
	outline: none;
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
}

.btn-reset {
	cursor: pointer;
	width: 120px;
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	color: white;
	background-color: #dc3545;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
	border: none;
	outline: none;
	font-size: 14px;
	font-weight: 500;
}

.option_checkbox {
	display: grid;
	grid-template-columns: 30px 1fr;
	align-items: center;
	position: relative;
	margin-bottom: 5px;
}

.option_checkbox .nameOption {
	color: #212529;
	font-size: 15px;
	font-weight: 500;
	cursor: pointer;
}

.option_checkbox .nameOption:hover {
	text-decoration: underline;
}

.title-small {
	font-size: 12px;
	color: #212529;
}

.grid-col-2-100px {
	grid-template-columns: 100px 1fr;
}

.gird-gap-col-10 {
	grid-gap: 10px;
}

/* BUTTON ICON */

.btn_icon {
	border: none;
	outline: none;
	cursor: pointer;
	background-color: #828282;
	width: 30px;
	height: 29px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	-ms-border-radius: 5px;
	-o-border-radius: 5px;
}

.btn_icon:hover {
	background-color: var(--primary-1);
}

.btn_icon img {
	width: 13px;
	height: 16px;
}

/* END */

.btn_icon.btn_edit {
	background-color: #f7d4d0;
}

.btn_icon.btn_edit:hover {
	background-color: #fb8678;
}

.btn_icon.btn_edit img {
	width: 15px;
	height: 15px;
}

.text-center {
	text-align: center;
}

.text-center-important {
	text-align: center !important;
}

/* REFACTOR UI */
.line_mobile {
	display: none;
}

.select-language-popup {
	position: fixed;
	right: 20px;
	top: 30%;
	z-index: 9999;
}

.select-language-popup.hidden-popup {
	transform: translateX(100%);
}

.select-language-popup .list-language {
	list-style: none;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	position: relative;
}

.select-language-popup .list-language .btn-choose-language {
	display: none;
}

.select-language-popup .list-language .language-item {
	margin: 10px 0;
}

.select-language-popup .list-language .language-item .language-image-wrapper {
	width: 40px;
	height: 40px;
	background-color: var(--white);
	display: flex;
	justify-content: center;
	align-items: center;
	border: 1px solid var(--grey-1);
	border-radius: 5px;
	padding: 15px 2.5px 22px 2.5px;
}

.select-language-popup .list-language .language-item .language-image-wrapper.active {
	background: var(--primary-3);
}

.select-language-popup .list-language .language-item .language-item-image {
	width: 25px;
	height: 16px;
	object-fit: cover;
}

@media screen and (max-width: 600px) {
	.breakLine-sm::after {
		content: "";
		display: block;
	}

	.line_mobile {
		display: block;
		width: calc(100% + 4.8vw + 4.8vw);
		height: 7px;
		background-color: #ededed;
		margin-top: 8vw;
		margin-left: -4.8vw;
	}
}

/* PAGE CATEGORY */
.page_article .ft-content:nth-child(2),
.page_category .ft-content:nth-child(2) {
	margin-left: 0;
}

.page_article .line_mobile {
	margin-bottom: 7vw;
}

.d-none-md {
	display: none;
}

.d-none-sm {
	display: block;
}

@media screen and (max-width: 956px) {
	.d-none-md {
		display: block;
	}

	.d-none-sm {
		display: none !important;
	}

	.avatar-mobile-container {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		height: 112px;
		margin: 25px 0;
	}

	.avatar-mobile-container .avatar-mobile-wrapper {
		position: relative;
		width: fit-content;
		height: auto;
	}

	.avatar-mobile-container .avatar-mobile-wrapper>form {
		position: absolute;
		top: calc(100% / 4 * 2.5);
		right: 0;
	}

	.avatar-mobile-container .avatar-mobile-wrapper .edit-round-btn {
		position: unset;
	}
}

.page_category .wrap_box_tags_category {
	display: flex;
	flex-wrap: wrap;
	margin-top: 15px;
}

.page_category .wrap_box_tags_category+.divider {
	margin-top: 5px;
}

@media only screen and (max-width: 600px) {
	.ab-description {
		text-align: justify;
	}

	.w3-modal {
		background-color: white !important;
		/* top: 80px; */
	}

	.modal-content {
		width: 100%;
		margin: auto;
		background-color: #ffffff;
		position: relative;
		padding: 0;
		outline: 0;
		box-shadow: none;
		text-align: center;
		border-radius: 0px;
	}

	.banner .primary-btn {
		margin-top: 12px;
		padding: 20px 15px;
	}

	.form-account .form-submit-btn {
		width: 100%;
		font-size: 14px;
		margin-top: 20px;
	}

	.select-language-popup {
		position: fixed;
		left: 100%;
		z-index: 9999;
		transition: all 0.5s;
	}

	.select-language-popup.show-popup {
		left: calc(100% - 40px);
	}

	.select-language-popup .list-language {
		list-style: none;
		margin: 0;
		padding: 0;
		box-sizing: border-box;
		position: relative;
	}

	.select-language-popup .list-language .btn-choose-language {
		position: absolute;
		right: 100%;
		top: 0;
		padding: 8px;
		background-color: var(--grey-1);
		width: 40px;
		height: 40px;
		color: var(--white);
		display: flex;
		justify-content: center;
		align-items: center;
		border-top-left-radius: 5px;
		border-bottom-left-radius: 5px;
		cursor: pointer;
	}

	.select-language-popup .list-language .language-item {
		margin: 10px 0;
	}

	.select-language-popup .list-language .language-item .language-image-wrapper {
		width: 40px;
		height: 40px;
		background-color: var(--white);
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 0;
		border: none;
	}

	.select-language-popup .list-language .language-item .language-image-wrapper.active {
		background: var(--primary-3);
	}

	.select-language-popup .list-language .language-item .language-item-image {
		width: 20px;
		height: 16px;
		object-fit: cover;
	}
}

@media only screen and (max-width: 375px) {
	.norms {
		width: 100%;
		margin: 0;
	}

	.norms .buttons {
		width: 100%;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
	}

	.norms .buttons>div {
		margin: 7px 6px !important;
		width: 45%;
	}

	.student-summary-label,
	.student-skill-label {
		width: 85px;
	}
}

.page_article .slim-devider,
.page_details .slim-devider {
	display: none;
}

@media screen and (max-width: 600px) {
	.ab-description {
		text-align: justify;
	}

	.page_article .slim-devider,
	.page_details .slim-devider {
		display: block;
	}
}

blockquote {
	position: relative;
}

blockquote:after {
	position: absolute;
	height: 100%;
	width: 5px;
	background: #cccccc;
	content: "";
	top: 0;
	left: -20px;
}

.breadcrumbs {
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	margin-bottom: 10px;
	margin-top: 10px;
}

.breadcrumbs .breadcrumbs-line {
	margin-left: 10px;
	margin-right: 10px;
	color: var(--primary-1);
	margin-top: 2px;
}

.breadcrumbs .breadcrumbs-txt {
	color: var(--primary-1);
	font-size: 18px;
	padding-bottom: 3px;
}

@media screen and (max-width: 600px) {
	.breadcrumbs .breadcrumbs-line {
		font-size: 3.73vw;
		margin-top: 0px;
	}

	.breadcrumbs .breadcrumbs-txt {
		font-size: 3.73vw;
		padding-bottom: 0px;
	}
}

.pointer {
	cursor: pointer;
}

/* FIX TABLE ARTICLE */
.page_details .wrap_table {
	width: 100%;
	overflow-x: auto;
	margin-left: auto;
	margin-right: auto;
}

.page_details .wrap_table table {
	margin-left: auto;
	margin-right: auto;
	max-width: 100%;
}

@media screen and (min-width: 1400px) {
	.page_details .wrap_table {
		width: 500px;
	}
}

@media screen and (max-width: 1400px) {
	.page_details .wrap_table {
		width: 500px;
	}
}

@media screen and (max-width: 1150px) {
	.page_details .wrap_table {
		width: 400px;
	}
}

@media screen and (max-width: 1050px) {
	.page_details .wrap_table {
		width: 350px;
	}
}

@media screen and (max-width: 972px) {
	.page_details .wrap_table {
		width: 80vw;
	}

	.page_details .wrap_table table {
		max-width: unset;
	}
}

.page_details .news-detail-description,
.page_details .news-detail-qa-item {
	font-family: sans-serif, OpenSans !important;
}

.page_details .news-detail-qa-item h2,
.page_details .news-detail-qa-item h2 span {
	font-weight: bold;
	font-size: 24px !important;
	line-height: 29px !important;
}

.page_details .news-detail-qa-item h3,
.page_details .news-detail-qa-item h3 span {
	font-weight: bold;
	font-size: 20px !important;
	line-height: 25px !important;
}

.page_details .news-detail-qa-item h4,
.page_details .news-detail-qa-item h4 span {
	font-weight: bold;
	font-size: 18px !important;
	line-height: 23px !important;
}

.page_details .news-detail-qa-item p,
.page_details .news-detail-qa-item span {
	font-size: 16px !important;
	line-height: 26px !important;
}

.page_details .news-detail-qa-item ul {
	font-size: 16px !important;
	line-height: 26px !important;
}

.page_details .news-detail-qa-item li {
	margin: 10px 0;
}

/* .size-detail-image:first-child{
	width: 200px;
} */

@media screen and (max-width: 600px) {

	.page_details .news-detail-qa-item h2,
	.page_details .news-detail-qa-item h2 span {
		font-weight: bold;
		font-size: 6.4vw !important;
		line-height: 7.3vw !important;
		text-align: start !important;
	}

	.page_details .news-detail-qa-item h3,
	.page_details .news-detail-qa-item h3 span {
		font-size: 5.33vw !important;
		line-height: 6.6vw !important;
	}

	.page_details .news-detail-qa-item h4,
	.page_details .news-detail-qa-item h4 span {
		font-weight: bold;
		font-size: 4.8vw !important;
		line-height: 6.1vw !important;
	}

	.page_details .news-detail-qa-item p,
	.page_details .news-detail-qa-item span {
		font-size: 4.26vw !important;
		line-height: 7.6vw !important;
	}

	.page_details .news-detail-qa-item ul {
		font-size: 4.26vw !important;
		line-height: 7.6vw !important;
	}
}

.btn_openToc,
.overlay_toc {
	display: none;
}

@media screen and (max-width: 600px) {
	/* .wrap_toc {
    display: none;
  } */

	.wrap_toc_mobile {
		position: fixed;
		display: block;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		-webkit-transform: translate(-50%, -50%);
		-moz-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		-o-transform: translate(-50%, -50%);
		background-color: white;
		z-index: 4;
		width: 90%;
		height: 0;
		overflow-y: scroll;
		border-radius: 5px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		-ms-border-radius: 5px;
		-o-border-radius: 5px;
		padding-right: 15px;
	}
}

/* CUSTOM TOC SIDEBAR */
.news-detail-qa-menu {
	display: none;
}

.news-detail-container {
	/* padding-left: 300px; */
	position: relative;
	display: grid;
	grid-template-columns: 300px 1fr;
}

.wrap_toc {
	position: sticky;
	top: 20px;
	width: 280px;
	max-height: 90vh;
	overflow-y: scroll;
	background-color: white;
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	-ms-border-radius: 20px;
	-o-border-radius: 20px;
	padding: 10px;
	-webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.24);
	-moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.24);
	box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.24);
}

.wrap_toc::-webkit-scrollbar {
	display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.wrap_toc {
	-ms-overflow-style: none;
	/* IE and Edge */
	scrollbar-width: none;
	/* Firefox */
}

.wrap_toc.fixed_toc {
	position: fixed;
	top: 0;
	left: unset;
	transform: translate(calc(-100% - 20px), 20px);
	-webkit-transform: translate(calc(-100% - 20px), 20px);
	-moz-transform: translate(calc(-100% - 20px), 20px);
	-ms-transform: translate(calc(-100% - 20px), 20px);
	-o-transform: translate(calc(-100% - 20px), 20px);
}

.wrap_toc ol {
	padding-left: 30px;
}

.wrap_toc .title_toc {
	font-size: 20px;
	font-weight: bold;
	padding-left: 15px;
	margin-top: 10px;
	margin-bottom: 15px;
}

.wrap_toc .title_toc i {
	margin-right: 5px;
}

.wrap_toc li {
	position: relative;
	padding-left: 5px;
	margin-bottom: 5px;
}

.wrap_toc li:hover {
	text-decoration: underline;
}

.wrap_toc li a {
	color: #0d0c22;
	font-weight: 500;
}

.wrap_toc li::before {
	position: absolute;
	content: "";
	width: 27px;
	height: 27px;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	top: 0;
	left: 0;
	z-index: 1;
	transform: translate(-94%, -6%);
	-webkit-transform: translate(-94%, -6%);
	-moz-transform: translate(-94%, -6%);
	-ms-transform: translate(-94%, -6%);
	-o-transform: translate(-94%, -6%);
}

.wrap_toc li::marker {
	font-size: 16px;
	position: relative;
	z-index: 2;
	margin-right: 10px;
	color: var(--primary-1);
	font-weight: 500;
}

.wrap_toc .wrap_title_toc .btn_close_toc {
	display: none;
}

@media screen and (max-width: 972px) {
	.news-detail-container {
		padding-left: 20px;
		grid-template-columns: 1fr;
		padding: 0;
	}

	.btn_openToc {
		position: fixed;
		top: 50%;
		right: 15px;
		font-size: 20px;
		transform: translateY(-50);
		-webkit-transform: translateY(-50);
		-moz-transform: translateY(-50);
		-ms-transform: translateY(-50);
		-o-transform: translateY(-50);
		z-index: 2;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 50px;
		height: 50px;
		background-color: var(--primary-1);
		color: white;
		cursor: pointer;
		border-radius: 5px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		-ms-border-radius: 5px;
		-o-border-radius: 5px;
	}

	.wrap_toc {
		position: fixed;
		top: 0;
		left: unset;
		right: 0;
		width: 350px;
		max-height: unset;
		height: 100vh;
		z-index: 4;
		transform: translateX(100%);
		-webkit-transform: translateX(100%);
		-moz-transform: translateX(100%);
		-ms-transform: translateX(100%);
		-o-transform: translateX(100%);
		border-radius: 20px 0 0 20px;
		-webkit-border-radius: 20px 0 0 20px;
		-moz-border-radius: 20px 0 0 20px;
		-ms-border-radius: 20px 0 0 20px;
		-o-border-radius: 20px 0 0 20px;
	}

	.wrap_toc .wrap_title_toc {
		display: flex;
		width: 100%;
		justify-content: space-between;
		align-items: center;
	}

	.wrap_toc .wrap_title_toc .btn_close_toc {
		font-size: 20px;
		transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
		-moz-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		-o-transform: translateY(-50%);
		display: block;
	}

	.overlay_toc {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, 0.1);
		z-index: 3;
		display: none;
	}

	input[id="openToc"]:checked~.overlay_toc {
		display: block;
	}

	input[id="openToc"]:checked~.wrap_toc {
		transform: translateX(0%);
		-webkit-transform: translateX(0%);
		-moz-transform: translateX(0%);
		-ms-transform: translateX(0%);
		-o-transform: translateX(0%);
		transition: all 0.5s;
		-webkit-transition: all 0.5s;
		-moz-transition: all 0.5s;
		-ms-transition: all 0.5s;
		-o-transition: all 0.5s;
	}
}

@media screen and (max-width: 600px) {
	.btn_openToc {
		right: 10px;
		font-size: 20px;
		width: 40px;
		height: 40px;
		opacity: 0.7;
	}

	.wrap_toc {
		width: 80%;
	}
}

.wrap_hidden_fixed_toc {
	position: relative;
}

.wrap_hidden_fixed_toc .hidden_fixed_toc {
	position: absolute;
	bottom: 0px;
	left: 0;
	width: 100%;
	height: 2px;
	background-color: black;
	opacity: 0;
}

.wrap_sidebar_details .normal-a-tag:hover,
.topicThumbnail-orders-relativeTopics .normal-a-tag:hover {
	color: var(--primary-1) !important;
	opacity: 1 !important;
}

.hidden_for_SEO {
	position: absolute;
	opacity: 0;
	z-index: -1;
}

/* FIX BANNER ABOUT US */
.banner_aboutus {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top;
	height: 600px;
	position: relative;
}

.banner_aboutus .overlay_banner {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.4);
}

@media screen and (max-width: 1100px) {
	.banner_aboutus {
		height: 500px;
	}
}

@media screen and (max-width: 600px) {
	.banner_aboutus {
		height: 55.3vw;
	}
}

.post-thumbnail {
	max-width: 100%;
	display: block;
	margin: auto;
	border-radius: 10px;
}

.thumbnail-container {
	margin-top: 20px;
	margin-bottom: 20px;
}

figure.image {
	margin: 20px auto;
}

figure.image>figcaption {
	text-align: center;
	margin-top: 5px;
}

/* ***** NEW HOME ****** */

ul {
	list-style: none;
}

.wrap_menu_new {
	padding-left: 80px;
	padding-right: 80px;
	height: 60px;
	width: 100%;
	display: flex;
	position: relative;
}

.wrap_menu_new .menu_new {
	border-top: 0.5px solid #d8d8d8;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	list-style: none;
	padding: 0;
	margin: 0;
	overflow-x: hidden;
}

.wrap_menu_new .menu_new .menu_new_item {
	margin-right: 50px;
	position: relative;
	height: 40px;
	white-space: nowrap;
}

/* .wrap_menu_new .menu_new .menu_new_item:hover .sub_menu {
	display: block;
} */

.wrap_menu_new .menu_new .menu_new_item:last-child {
	margin-right: 0;
}

.wrap_menu_new .menu_new_link {
	font-size: 16px;
	line-height: 24px;
	color: #3d3d4e;
	font-weight: 400;
	opacity: 1 !important;
	height: 100%;
	display: flex;
	align-items: center;
}

.wrap_menu_new .menu_new .menu_new_link:hover {
	color: var(--primary-0);
}

.wrap_menu_new .sub_menu {
	display: none;
	width: 270px;
	left: -10px;
	position: absolute;
	background-color: white;
	padding: 0;
	box-shadow: 0px 0px 14px 1px rgba(0, 0, 0, 0.1);
	/* padding: 0 10px; */
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	-o-border-radius: 10px;
}

.wrap_menu_new .sub_menu .sub_menu_item:hover {
	background: var(--primary-2);
}

.wrap_menu_new .sub_menu .sub_menu_item:hover .menu_new_link:hover {
	color: black;
}

.wrap_menu_new .sub_menu .sub_menu_item {
	width: 100%;
	height: 40px;
	padding: 10px;
}

/* ****** TAGS ****** */
.wrap_box_tags .box_tags {
	display: flex;
	flex-wrap: wrap;
	position: relative;
	padding-bottom: 7px;
	margin-top: 10px;
}

.wrap_box_tags .box_tags .news-detail-tags-item,
.news-detail-tags-item.tagsStyle_2 {
	margin: 0;
	margin-right: 10px;
	margin-bottom: 10px;
}

.wrap_box_tags .box_tags .news-detail-tags-item a,
.news-detail-tags-item.tagsStyle_2 a {
	font-weight: 400;
	color: #636363;
	margin: 0;
	opacity: 1 !important;
}

.wrap_box_tags .box_tags .news-detail-tags-item:hover a,
.news-detail-tags-item.tagsStyle_2:hover a {
	color: var(--primary-0);
}

.wrap_box_tags .lineBoxTags {
	width: 100%;
	height: 4px;
	background-color: var(--primary-0);
	margin: 0;
	position: absolute;
	bottom: 0;
	border-radius: 40px;
	-webkit-border-radius: 40px;
	-moz-border-radius: 40px;
	-ms-border-radius: 40px;
	-o-border-radius: 40px;
}

@media screen and (max-width: 800px) {
	.wrap_box_tags {
		padding-top: 15px;
		position: relative;
	}

	.wrap_box_tags::after {
		content: "";
		position: absolute;
		width: 100%;
		height: 5px;
		background: #ededed;
		top: 0;
	}
}





.wrap_menu_new #menu_prev_btn,
.wrap_menu_new #menu_next_btn {
	outline: none;
	border: none;
	background: transparent;
	padding: 0 10px;
	cursor: pointer;
}

.wrap_menu_new #menu_prev_btn:hover,
.wrap_menu_new #menu_next_btn:hover {
	color: var(--primary-0);
	font-weight: bold;
}

/* WRAP MENU MOBILE */
.wrap_menu_dropdownMobile .menuLinkMobile {
	width: 100%;
	height: 40px;
	display: flex;
	align-items: center;
	font-size: 14px;
	color: #3d3d4e;
	font-weight: 400;
	padding-left: 10px;
	position: relative;
	cursor: pointer;
}

.menuLinkMobile a {
	flex-grow: 1;
}

.menuLinkMobile label {
	height: 100%;
	flex-grow: 2;
}

.wrap_menu_dropdownMobile .menuLinkMobile:hover {
	background: var(--primary-0);
	color: white;
}

.wrap_menu_dropdownMobile .menuLinkMobile i {
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%) rotate(0);
	-webkit-transform: translateY(-50%) rotate(0);
	-moz-transform: translateY(-50%) rotate(0);
	-ms-transform: translateY(-50%) rotate(0);
	-o-transform: translateY(-50%) rotate(0);
}

.wrap_menu_dropdownMobile .wrapSubmenuItem {
	padding-left: 20px;
	height: auto;
	max-height: 0;
	overflow: hidden;
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-ms-transition: all 0.5s;
	-o-transition: all 0.5s;
}

input[name="openMenuItem"]:checked~.wrapSubmenuItem {
	max-height: 100vh;
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-ms-transition: all 0.5s;
	-o-transition: all 0.5s;
}

input[name="openMenuItem"]:checked~.menuLinkMobile i {
	transform: translateY(-50%) rotate(180deg);
	-webkit-transform: translateY(-50%) rotate(180deg);
	-moz-transform: translateY(-50%) rotate(180deg);
	-ms-transform: translateY(-50%) rotate(180deg);
	-o-transform: translateY(-50%) rotate(180deg);
}

.txt_category_mobile {
	font-weight: 600;
	font-size: 15px;
	line-height: 20px;
	color: #3d3d4e;
	margin-bottom: 10px;
	margin-top: 15px;
}

blockquote {
	font-size: 1.4em;
	margin: 12px auto;
	font-style: italic;
	color: #555555;
	padding-top: 35px;
	padding-left: 35px;
	padding-right: 15px;
	border-left: 8px solid #78c0a8;
	line-height: 1.6;
	position: relative;
	background: #ededed;
}

/***** BLOCKQUOTE ****/

blockquote::before {
	font-family: Arial;
	content: "\201C";
	color: #78c0a8;
	font-size: 4em;
	position: absolute;
	left: 5px;
	top: -25px;
}

blockquote p,
blockquote span {
	background-color: transparent !important;
}

blockquote::after {
	content: "";
	display: none;
}

.news-detail p,
.news-detail p *,
.news-detail-description p,
.news-detail-description p * {
	text-align: justify !important;
}

.test {
	position: relative;
	width: 100%;
}

/*
.marquee {
	user-select: none;
	--gap: 2rem;
	display: flex;
	overflow: hidden;
	gap: var(--gap);
	font-size: 20px;
	position: absolute;
	width: 85%;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	color: white;
	right: 0;
	z-index: 1;

}

.marqueeContent {
	flex-shrink: 0;
	display: flex;
	justify-content: space-around;
	min-width: 100%;
	gap: var(--gap);
	animation: scroll 10s linear infinite;
	font-weight: 400;
}

@keyframes scroll {
	from {
		transform: translateX(0);
	}

	to {
		transform: translateX(calc(-100% - var(--gap)));
	}
}

.rs-marquee-mobile {
	display: none;
}

.rs-marquee {
	display: block;
}

@media screen and (max-width: 900px) {
	.rs-image-desktop {
		width: 85vw;
	}

	.rs-marquee-mobile {
		display: block;
	}

	.marquee {
		font-size: 15px;
		width: 80vw;
	}

	.rs-marquee {
		display: none;
	}
} */



.bannerText {
	font-size: clamp(0.7rem, 2.5vw, 1.5rem);
	position: absolute;
	top: 50%;
	left: 55%;
	transform: translate(-50%, -50%);
	white-space: nowrap;
	text-align: center;
	text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
	z-index: 35;
	overflow: hidden;
}

.bannerText p {
	color: white;
	font-weight: bold;
}

.bannerText span {
	color: orange;
	font-weight: bold;
	animation: blinking 1s infinite alternate;
}

.bannerImage {
	width: 100%;
	height: 100%;
	/* max-width: 90vw;
    max-height: 200px; */
	object-fit: contain;
	border-radius: 5px;
}

.close {
	position: absolute;
	top: 0em;
	right: 1em;
	z-index: 36;
	width: 0;
	height: 0;
	cursor: pointer;
}

.close::before {
	content: '\00D7';
	color: white;
	display: block;
	text-align: center;
	line-height: 1em;
	width: 1em;
	height: 1em;
	background-color: #192d45;
	border-radius: 5px;
	margin-top: -20px;
}

.close:checked+div {
	display: none;
}

.close:checked {
	display: none;
}

.break {
	display: none;
}

.contact-form {
	margin: 60px 0;
	padding: 48px;
	max-width: 1240px;
	margin-left: auto;
	margin-right: auto;
	background: white;
	border-radius: 8px;
}

.contact-title {
	width: 100%;
	text-align: center;
	font-weight: 600;
	font-size: 30px;
	line-height: 41px;
	color: #313131;

}

.contact-container {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-gap: 50px;
	margin-top: 50px;
}

.contact-map {
	width: 100%;
}

.contact-map p {
	font-size: 18px;
	font-weight: 600;
	color: #3d3d4e;
	margin-bottom: 20px;
}

.contact-submit h3 {
	font-size: 18px;
	font-weight: 600;
	color: #3d3d4e;
	margin-bottom: 20px;
	margin-top: 0;
}

.contact-info {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.contact-social {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 15px;
}

.contact-info h2 {
	font-size: 18px;
	font-weight: 600;
	color: #3d3d4e;
}

.contact-item {
	width: 100%;
	margin-bottom: 15px;
}

.contact-item input {
	width: 100%;
	outline: none;
	padding: 8px 10px;
	border-radius: 8px;
	border: 1px solid #a3a3a3;
	margin-top: 8px;
}

.contact-item p {
	font-size: 16px;
	font-weight: 500;
}

.flex-contact {
	display: flex;
	gap: 20px;
	justify-content: space-between;
	align-items: center;
	/* flex-wrap: wrap; */
}

.contact-button {
	border: none;
	padding: 8px 40px;
	float: right;
	background: #0B544C;
	border-radius: 8px;
	color: white;
	font-size: 16px;
	font-weight: 700;
	margin-top: 20px;
	cursor: pointer;
}

@media screen and (min-width: 820px) {
	.rs-image-desktop {
		max-width: 1000px;
		min-width: 800px;
	}

	.bannerImage {
		/* aspect-ratio: 13; */
	}

	.desktop {
		display: none;
	}

	.mobile {
		display: block;
	}


}

@media screen and (max-width: 1310px) {
	.wrap_menu_new {
		display: none;
	}
}

@media screen and (max-width: 820px) {
	.bannerImage {
		/* aspect-ratio: 7.8; */
		width: 100%;
	}

	.desktop {
		display: block;
	}

	.mobile {
		display: none;
	}

	.break {
		display: block;
	}

	.contact-container {
		grid-template-columns: 1fr
	}

	.contact-form {
		padding-left: 30px;
		padding-right: 30px;
	}
}

@keyframes blinking {
	0% {
		text-shadow:
			-1px -1px 0 white,
			1px -1px 0 white,
			-1px 1px 0 white,
			1px 1px 0 white;
		color: yellow;
	}

	100% {
		text-shadow:
			-1px -1px 0 #000,
			1px -1px 0 #000,
			-1px 1px 0 #000,
			1px 1px 0 #000;
		color: orange;
	}
}

/*  */

.btnCustomArticle {
	-webkit-animation: heartbeat 1.5s ease-in-out infinite both;
	animation: heartbeat 1.5s ease-in-out infinite both;
	color: white !important;
}

@-webkit-keyframes heartbeat {
	from {
		-webkit-transform: scale(1);
		transform: scale(1);
		-webkit-transform-origin: center center;
		transform-origin: center center;
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}

	10% {
		-webkit-transform: scale(0.91);
		transform: scale(0.91);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
	}

	17% {
		-webkit-transform: scale(0.98);
		transform: scale(0.98);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}

	33% {
		-webkit-transform: scale(0.87);
		transform: scale(0.87);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
	}

	45% {
		-webkit-transform: scale(1);
		transform: scale(1);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
}

@keyframes heartbeat {
	from {
		-webkit-transform: scale(1);
		transform: scale(1);
		-webkit-transform-origin: center center;
		transform-origin: center center;
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}

	10% {
		-webkit-transform: scale(0.91);
		transform: scale(0.91);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
	}

	17% {
		-webkit-transform: scale(0.98);
		transform: scale(0.98);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}

	33% {
		-webkit-transform: scale(0.87);
		transform: scale(0.87);
		-webkit-animation-timing-function: ease-in;
		animation-timing-function: ease-in;
	}

	45% {
		-webkit-transform: scale(1);
		transform: scale(1);
		-webkit-animation-timing-function: ease-out;
		animation-timing-function: ease-out;
	}
}


.desktop-top-banner {
	display: block;
}

.mobile-top-banner {
	display: none;
}

.desktop-footer-banner {
	display: block;
}

.mobile-footer-banner {
	display: none;
}

@media screen and (max-width: 600px) {
	.desktop-top-banner {
		display: none;
	}

	.mobile-top-banner {
		display: block;
	}

	.desktop-footer-banner {
		display: none;
	}

	.mobile-footer-banner {
		display: block;
	}
}

.banner_toplist {
	display: none;
}

.quote {
	position: relative;
	padding: 15px 30px;
}

.quote::before,
.quote::after {
	font-weight: bold;
	font-size: 40px;
	position: absolute;
}

.quote::before {
	content: open-quote;
	line-height: 1;
	top: 0;
	left: 0px;
}

.quote::after {
	content: close-quote;
	line-height: 0px;
	right: 0px;
	bottom: 0px;
}
