body { font-family: "Noto Sans Thai", sans-serif; font-weight: 300; font-style: normal; font-size: 14px; line-height: 1.5; padding: 0; margin: 0; color: var(--iq-body-text); background: var(--iq-white); }

a {text-decoration: none;}

header#main-header {
	position: relative;
	left: 0em;
	right: 0em;
	text-align: center;
	background-color: #ffffff;
	z-index: 999;
	-webkit-box-shadow: 0 0 1.875em 0 rgba(0, 0, 0, .1);
	-moz-box-shadow: 0 0 1.875em 0 rgba(0, 0, 0, .1);
	box-shadow: 0 0 1.875em 0 rgba(0, 0, 0, .1);
}
header .navbar-light .navbar-brand img.logo {
	width: 7em;
}
header#main-header.menu-sticky {
	-webkit-box-shadow: 0em 0em 1.875em 0em rgba(0, 0, 0, 0.4);
	-moz-box-shadow: 0em 0em 1.875em 0em rgba(0, 0, 0, 0.4);
	box-shadow: 0em 0em 1.875em 0em rgba(0, 0, 0, 0.4);
}
header#main-header.menu-sticky {
	position: fixed;
	top: 0;
	width: 100%;
	background: rgba(20, 20, 20, 0.5) !important;
	-webkit-box-shadow: 0 0 1.875em 0 rgba(0, 0, 0, .1);
	-moz-box-shadow: 0 0 1.875em 0 rgba(0, 0, 0, .1);
	box-shadow: 0 0 1.875em 0 rgba(0, 0, 0, .1);
	z-index: 999;
}
header .navbar .menu-header-menu-container,
header .navbar .menu-all-pages-container,
header .navbar .menu-testing-menu-container,
header .navbar .menu-short-container,
header .navbar .menu-main-menu-container {
	display: inline-block;
	width: 100%;
}
header .navbar ul.navbar-nav {
	display: block;
	text-align: left;
}
header .navbar ul li {
	list-style: none;
	margin-right: 1.125em;
	position: relative;
	transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	display: inline-block;
}
header .navbar ul li.menu-item a {
	font-size: 1em;
	font-weight: 400;
	color:var(--iq-dark);
	position: relative;
	padding: 0em .2em 0em 0.625em;
	/* line-height: 4.375em; */
	line-height: 2.5em;
	position: relative;
	z-index: 9;
	text-decoration: none;
	transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	text-transform: uppercase;
}
header .navbar ul li.menu-item a.btn {
	color:var(--iq-primary);
}
header .navbar ul li.menu-item a.btn:hover {
	color:var(--iq-white);
}

section#banners {
	padding-top: 75px;
}

.wrapper-container {
	padding-top: 25px;
	background-color: var(--iq-white);
}

.wrapper-container.p-none {
	padding-top: 0px;
}

li.menu-item.active a {
    color:var(--iq-dark);
}

.iq-search-bar .search-input {
	width: 100%;
	height: 2.5em;
	padding: 0.313em 0.938em 0.313em 2.5em;
	border: none;
	border-radius: 0;
	color: var(--iq-white);
	background: var(--iq-bg1);
}
.iq-search-bar .searchbox .search-link {
	position: absolute;
	left: 0.938em;
	top: 0.375em;
	font-size: 1em;
}
.nav-item span.dots {
	height: 0.625em;
	width: 0.625em;
	font-size: 0;
	text-align: center;
	padding: 0;
	position: absolute;
	top: 0.188em;
	right: 0.75em;
	border-radius: 50%;
	-webkit-border-radius: 50%;
}

.menu-right .nav-item span.dots {
	right: 0;
}
.navbar-right li .iq-sub-dropdown .iq-sub-card {
	position: relative;
	font-size: inherit;
	padding: 0.938em 0.938em;
	line-height: normal;
	color: inherit;
	text-align: left;
	display: inline-block;
	width: 100%;
	border: 0.063em solid;
	border-image-slice: 0.063em;
	border-width: 0 0 0.063em 0;
	border-image-source: linear-gradient(to right, rgba(209, 208, 207, 0.6), rgba(209, 208, 207, 0.3), rgba(209, 208, 207, 0));
}
.iq-sub-card.setting-dropdown {
	padding: 0.938em 0.938em 0.938em 0 !important;
}
.navbar-right li .iq-sub-dropdown a.iq-sub-card:last-child {
	border-bottom: 0;
}
.navbar-right .iq-sub-dropdown .iq-card-body div {
	border-radius: 0;
}
.navbar-right .iq-show .iq-sub-dropdown,
.iq-show .search-box {
	opacity: 1;
	visibility: visible;
	transform: translate(0, 0);
}
.navbar-right .iq-sub-dropdown {
	width: 18.75em;
	opacity: 0;
	visibility: hidden;
	position: absolute;
	top: 100%;
	right: 0.938em;
	background: var(--iq-bg1);
	transform: translate(0, 4.375em);
	-webkit-transform: translate(0, 4.375em);
	transition: all 0.3s;
	padding: 0;
	-webkit-box-shadow: 0em 0 1.25em 0 rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 0em 0 1.25em 0 rgba(0, 0, 0, 0.5);
	box-shadow: 0em 0 1.25em 0 rgba(0, 0, 0, 0.5);
	-webkit-transition: all 0.3s ease-out 0s;
	-moz-transition: all 0.3s ease-out 0s;
	-ms-transition: all 0.3s ease-out 0s;
	-o-transition: all 0.3s ease-out 0s;
	transition: all 0.3s ease-out 0s;
	z-index: 1;
}

.text-primary {
  color: var(--iq-primary) !important;
}

.text-secondary {
  color: var(--iq-secondary) !important;
}

.text-success {
  color: var(--iq-success) !important;
}

.text-info {
  color: var(--iq-info) !important;
}

.text-warning {
  color: #ffc107 !important;
}

.text-danger {
  color: var(--iq-danger) !important;
}

.text-light {
  color: var(--iq-light) !important;
}

.text-dark {
  color: var(--iq-dark) !important;
}

.text-gray {
  color: var(--iq-gray) !important;
}

.text-gray-90 {
  color: var(--iq-gray-90) !important;
}

.text-gray-10 {
  color: var(--iq-gray-10) !important;
}

.text-orange {
  color: var(--iq-orange) !important;
}

.text-blue {
  color: var(--iq-blue) !important;
}

.bg-teal {
  background-color: var(--bs-teal) !important;
}

.bg-indigo {
  background-color: var(--bs-indigo) !important;
}

.bg-magenta {
  background-color: var(--bs-magenta) !important;
}

.bg-pink {
  background-color: var(--bs-pink) !important;
}

.bg-primary {
  background-color: var(--iq-primary) !important;
}

.bg-secondary {
  background-color: var(--iq-secondary) !important;
}

.bg-success {
  background-color: var(--iq-success) !important;
}

.bg-info {
  background-color: var(--iq-info) !important;
}

.bg-danger {
  background-color: var(--iq-danger) !important;
}

.bg-light {
  background-color: var(--iq-light) !important;
}

.bg-dark {
  background-color: var(--iq-dark) !important;
}

.bg-secondary-light {
  background-color: var(--iq-secondary-light) !important;
}

.bg-gray-90 {
  background-color: var(--iq-gray-90) !important;
}

.bg-gray-10 {
  background-color: var(--iq-gray-10) !important;
}

.bg-orange {
  background-color: var(--iq-orange) !important;
}

.bg-purple {
  background-color: var(--bs-purple) !important;
}

.bg-brown {
  background-color: var(--iq-brown) !important;
}

.bg-blue {
  background-color: var(--iq-blue) !important;
}


/* สีchat */
.bg-purple-1 { background-color: #4B0082; } /* อินดิโก้เข้ม */
.bg-purple-2 { background-color: #6A0DAD; }
.bg-purple-3 { background-color: #9370DB; } /* ไลแลค */
.bg-purple-4 { background-color: #B19CD9; } /* ม่วงอ่อน แต่ยังไม่ขาว */
.bg-purple-5 { background-color: #D8BFD8; } /* ใกล้ขาวสุดที่จะไม่ขาว */

.bg-blue-1 { background-color: #001f3f; }
.bg-blue-2 { background-color: #0074D9; }
.bg-blue-3 { background-color: #3399FF; }
.bg-blue-4 { background-color: #66B2FF; }
.bg-blue-5 { background-color: #99CCFF; }

.bg-brown-1 { background-color: #993333; }
.bg-brown-2 { background-color: #732626; }
.bg-brown-3 { background-color: #4d1919; }
.bg-brown-4 { background-color: #d37878; }
.bg-brown-5 { background-color: #3a1313; }

.bg-orange-1 { background-color: #ff3300; }
.bg-orange-2 { background-color: #ff6600; }
.bg-orange-3 { background-color: #ff704d; }
.bg-orange-4 { background-color: #cc2900; }
.bg-orange-5 { background-color: #ff8533; }

.bg-success-1 { background-color: #009933; }
.bg-success-2 { background-color: #669900; }
.bg-success-3 { background-color: #86b300; }
.bg-success-4 { background-color: #2eb82e; }
.bg-success-5 { background-color: #336600; }

.bg-pink-1 { background-color: #ff66cc; }
.bg-pink-2 { background-color: #ff33cc; }
.bg-pink-3 { background-color: #ff99cc; }
.bg-pink-4 { background-color: #ff3399; }
.bg-pink-5 { background-color: #ff3385; }

/* สีรวม */
.bg-magenta-1 { background-color: #996600; }
.bg-magenta-2 { background-color: #e68a00; }
.bg-magenta-3 { background-color: #ffbb33; }
.bg-magenta-4 { background-color: #ff3333; }
.bg-magenta-5 { background-color: #999966; }

.bg-teal-1 { background-color: #00b386; }
.bg-teal-2 { background-color: #009999; }
.bg-teal-3 { background-color: #669999; }
.bg-teal-4 { background-color: #2eb8b8; }
.bg-teal-5 { background-color: #006666; }

.bg-dark-1 { background-color: #090909; }
.bg-dark-2 { background-color: #333333; }
.bg-dark-3 { background-color: #33334d; }
.bg-dark-4 { background-color: #003300; }
.bg-dark-5 { background-color: #39004d; }

.bg-indigo-1 { background-color: #3399ff; }
.bg-indigo-2 { background-color: #6699ff; }
.bg-indigo-3 { background-color: #1ac6ff; }
.bg-indigo-4 { background-color: #4da6ff; }
.bg-indigo-5 { background-color: #00e6e6; }

/* ...ทำแบบนี้สำหรับแต่ละโทนที่คุณต้องการ */


.swiper {
    width: 100%;
    height: 100%;
}

.swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: .5rem 0 2.5rem;
}

.swiper-slide img {
    object-fit: cover;
    /* height: 170px; */
}

.swiper-slide img.instructor {
    object-fit: contain;
    height: 240px;
    margin-top: 10px;
}

.swiper-slide .card {
    border-radius: 10px;
    -webkit-box-shadow: 0px 4px 8px 0 rgba(0, 0, 0, .15);
	-moz-box-shadow: 0px 4px 8px 0 rgba(0, 0, 0, .15);
	box-shadow: 0px 4px 8px 0 rgba(0, 0, 0, .15);
	height: 380px;
	min-width:100%;
}

.swiper-slide .card-footer {
  padding-top: 0px;
  border-top: 0px;
  background-color: #ffffff;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.swiper-slide .card-img-top {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.swiper-button-next,
.swiper-button-prev {
    background-color: #ffffff;
    border-radius: 50%;
    width: var(--swiper-navigation-size);
    height: var(--swiper-navigation-size);
}

.swiper-button-next:after,
.swiper-button-prev:after {
    font-size: 1.5rem;
}

.slide-title {
	font-size: 16pt;font-weight: bold;
}

#categories {
	width: 100%;
	background-color: var(--iq-primary-hover);
	padding: 30px 0px 0px;
	margin-top: 20px;
}

#categories a.items {
	background-color: #ffffff;
	width: 100%;
	font-size: 14pt;
	margin-top: 30px;
	padding: 10px;
	border-radius: 999px;
	text-align: center;
	cursor: pointer;
	text-decoration: none;
	color: #000000;
}

#instructors {
	margin-top: 40px;
}

#others .swiper-slide img {
	height: 140px;
}

.container-p-y:not([class^=pt-]):not([class*=" pt-"]) {
  padding-top: 1.5rem !important;
}
.container-p-y:not([class^=pb-]):not([class*=" pb-"]) {
  padding-bottom: 1.5rem !important;
}

.px-sm-0 {
  padding-right: 0 !important;
  padding-left: 0 !important;
}
.px-sm-50 {
  padding-right: 0.125rem !important;
  padding-left: 0.125rem !important;
}
.px-sm-1 {
  padding-right: 0.25rem !important;
  padding-left: 0.25rem !important;
}
.px-sm-1_5 {
  padding-right: 0.375rem !important;
  padding-left: 0.375rem !important;
}
.px-sm-2 {
  padding-right: 0.5rem !important;
  padding-left: 0.5rem !important;
}
.px-sm-3 {
  padding-right: 0.75rem !important;
  padding-left: 0.75rem !important;
}
.px-sm-4 {
  padding-right: 1rem !important;
  padding-left: 1rem !important;
}
.px-sm-5 {
  padding-right: 1.25rem !important;
  padding-left: 1.25rem !important;
}
.px-sm-6 {
  padding-right: 1.5rem !important;
  padding-left: 1.5rem !important;
}
.px-sm-7 {
  padding-right: 1.75rem !important;
  padding-left: 1.75rem !important;
}
.px-sm-8 {
  padding-right: 2rem !important;
  padding-left: 2rem !important;
}
.px-sm-9 {
  padding-right: 2.25rem !important;
  padding-left: 2.25rem !important;
}
.px-sm-10 {
  padding-right: 2.5rem !important;
  padding-left: 2.5rem !important;
}
.px-sm-11 {
  padding-right: 2.75rem !important;
  padding-left: 2.75rem !important;
}
.px-sm-12 {
  padding-right: 3rem !important;
  padding-left: 3rem !important;
}

.app-brand {
  display: flex;
  flex-grow: 0;
  flex-shrink: 0;
  overflow: hidden;
  line-height: 1;
  min-height: 1px;
  align-items: center;
}

.cursor-pointer {
  cursor: pointer !important;
}

.cursor-move {
  cursor: move !important;
}

.mt-6 {
  margin-top: 1.5rem !important;
}

.mt-7 {
  margin-top: 1.75rem !important;
}

.mt-8 {
  margin-top: 2rem !important;
}

.mt-9 {
  margin-top: 2.25rem !important;
}

.mt-10 {
  margin-top: 2.5rem !important;
}

.mt-11 {
  margin-top: 2.75rem !important;
}

.mt-12 {
  margin-top: 3rem !important;
}

.mb-6 {
  margin-bottom: 1.5rem !important;
}

.mb-7 {
  margin-bottom: 1.75rem !important;
}

.mb-8 {
  margin-bottom: 2rem !important;
}

.mb-9 {
  margin-bottom: 2.25rem !important;
}

.mb-10 {
  margin-bottom: 2.5rem !important;
}

.mb-11 {
  margin-bottom: 2.75rem !important;
}

.mb-12 {
  margin-bottom: 3rem !important;
}

.my-6 {
  margin-top: 1.5rem !important;
  margin-bottom: 1.5rem !important;
}

.my-7 {
  margin-top: 1.75rem !important;
  margin-bottom: 1.75rem !important;
}

.my-8 {
  margin-top: 2rem !important;
  margin-bottom: 2rem !important;
}

.my-9 {
  margin-top: 2.25rem !important;
  margin-bottom: 2.25rem !important;
}

.my-10 {
  margin-top: 2.5rem !important;
  margin-bottom: 2.5rem !important;
}

.my-11 {
  margin-top: 2.75rem !important;
  margin-bottom: 2.75rem !important;
}

.my-12 {
  margin-top: 3rem !important;
  margin-bottom: 3rem !important;
}

.btn-magenta {
  color: #fff;
  background-color: var(--bs-magenta);
  border-color: var(--bs-magenta);
}
.btn-magenta:hover {
  color: #fff;
  background-color: var(--bs-magenta);
  border-color: var(--bs-magenta);
}

.btn-purple {
  color: #fff;
  background-color: var(--bs-purple);
  border-color: var(--bs-purple);
}
.btn-purple:hover {
  color: #fff;
  background-color: var(--bs-purple);
  border-color: var(--bs-purple);
}
.btn-favourite {
	display: flex !important;
	align-items: center !important;
	background-color: #3d426c;
	color: #ffffff;
	padding: 4px 8px;
	border-radius: 5px;
	border: 1px solid #ffffff;
	min-width: 70px;
	cursor: pointer;
}
.btn-favourite.active {
	background-color: var(--iq-info);
	cursor: default;
}
.btn-favourite .text {
	font-size: .625rem;
}

.btn-favourite2 {
	display: flex !important;
	align-items: center !important;
	background-color: var(--iq-white);
	color: var(--iq-gray);
	padding: 4px 8px;
	border-radius: 5px;
	border: 1px solid var(--iq-gray);
	min-width: 70px;
	height: 24px;
	cursor: pointer;
}
.btn-favourite2.active {
	background-color: var(--iq-info);
	border: 1px solid var(--iq-info);
	color: var(--iq-white);
	cursor: default;
}
.btn-favourite2 .text {
	font-size: .625rem;
}

.input-group.input-group-merge > :not(:first-child):not(.dropdown-menu):not(.btn):not(.dropdown-menu + .form-control):not(.btn + .form-control):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
  margin-inline-start: calc((2px + var(--bs-border-width)) * -1);
}
.input-group.input-group-merge:focus-within > .form-control:first-child,
.input-group.input-group-merge:focus-within > .form-select:first-child {
  padding-inline: calc(0.9375rem - 2px);
}
.input-group.input-group-merge.input-group-sm:focus-within > .form-control:first-child,
.input-group.input-group-merge.input-group-sm:focus-within > .form-select:first-child {
  padding-inline: calc(0.9375rem - 2px);
}
.input-group.input-group-merge .input-group-text:first-child {
  border-inline-end: 0;
}
.input-group.input-group-merge .input-group-text:last-child {
  border-inline-start: 0;
}
.input-group.input-group-merge .form-control:not(:first-child) {
  border-inline-start: 0;
}
.input-group.input-group-merge .form-control:not(:last-child) {
  border-inline-end: 0;
}
.input-group.input-group-merge .form-control:not(textarea):not(:first-child) {
  padding-inline-start: 0 !important;
}
.input-group.input-group-merge .form-control:not(textarea):not(:last-child) {
  padding-inline-end: 0 !important;
}
.input-group.input-group-merge.disabled, .input-group.input-group-merge[disabled] {
  margin-inline: 0 !important;
}

.input-group-sm > .input-group-text i {
  font-size: 1.125rem;
}

html:not([dir=rtl]) .input-group-merge .input-group-text:first-child {
  border-right: 0;
}
html:not([dir=rtl]) .input-group-merge .input-group-text:last-child {
  border-left: 0;
}
html:not([dir=rtl]) .input-group-merge.disabled > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
  margin-left: 0 !important;
}

.divider {
  display: block;
  text-align: center;
  margin: 1rem 0;
  overflow: hidden;
  white-space: nowrap;
}
.divider .divider-text {
  position: relative;
  display: inline-block;
  font-size: 0.9375rem;
  color: #384551;
  padding: 0rem 0.677rem;
}
.divider .divider-text i {
  font-size: 1rem;
}
.divider .divider-text:before, .divider .divider-text:after {
  content: "";
  position: absolute;
  top: 50%;
  width: 100vw;
  border-top: 1px solid rgba(34, 48, 62, 0.12);
}
.divider .divider-text:before {
  right: 100%;
}
.divider .divider-text:after {
  left: 100%;
}
.divider.text-start .divider-text {
  padding-left: 0;
}
.divider.text-end .divider-text {
  padding-right: 0;
}
.divider.text-start-center .divider-text {
  left: -25%;
}
.divider.text-end-center .divider-text {
  right: -25%;
}
.divider.divider-dotted .divider-text:before, .divider.divider-dotted .divider-text:after {
  border-style: dotted;
  border-width: 0 1px 1px;
  border-color: rgba(34, 48, 62, 0.12);
}
.divider.divider-dashed .divider-text:before, .divider.divider-dashed .divider-text:after {
  border-style: dashed;
  border-width: 0 1px 1px;
  border-color: rgba(34, 48, 62, 0.12);
}

[dir=rtl] .divider.text-start-center .divider-text {
  right: -25%;
  left: auto;
}
[dir=rtl] .divider.text-end-center .divider-text {
  left: -25%;
  right: auto;
}
[dir=rtl] .divider.text-start .divider-text {
  padding-right: 0;
  padding-left: 0.677rem;
}
[dir=rtl] .divider.text-end .divider-text {
  padding-left: 0;
  padding-right: 0.677rem;
}

.divider.divider.divider-secondary .divider-text:before, .divider.divider.divider-secondary .divider-text:after {
  border-color: #8592a3;
}

.divider.divider.divider-success .divider-text:before, .divider.divider.divider-success .divider-text:after {
  border-color: #71dd37;
}

.divider.divider.divider-info .divider-text:before, .divider.divider.divider-info .divider-text:after {
  border-color: #03c3ec;
}

.divider.divider.divider-warning .divider-text:before, .divider.divider.divider-warning .divider-text:after {
  border-color: #ffab00;
}

.divider.divider.divider-danger .divider-text:before, .divider.divider.divider-danger .divider-text:after {
  border-color: #ff3e1d;
}

.divider.divider.divider-dark .divider-text:before, .divider.divider.divider-dark .divider-text:after {
  border-color: #2b2c40;
}

.divider.divider.divider-gray .divider-text:before, .divider.divider.divider-gray .divider-text:after {
  border-color: rgba(34, 48, 62, 0.5);
}

.navbar-dropdown.dropdown-user .dropdown-menu {
  min-width: 14rem;
}


.dropup,
.dropend,
.dropdown,
.dropstart,
.dropup-center,
.dropdown-center {
  position: relative;
}

.dropdown-toggle {
  white-space: nowrap;
}
.dropdown-toggle::after {
  display: inline-block;
  margin-left: 0.5em;
  vertical-align: middle;
  content: "";
  margin-top: -0.29425em;
  margin-left: 0.8em;
  width: 0.55em;
  height: 0.55em;
  border: 2px solid;
  border-top: 0;
  border-left: 0;
  transform: rotate(45deg);
}
[dir=rtl] .dropdown-toggle::after {
  margin-right: 0.8em !important;
  margin-left: 0 !important;
}
.dropdown-toggle:empty::after {
  margin-left: 0;
}

.dropdown-menu {
  --bs-dropdown-zindex: 1000;
  --bs-dropdown-min-width: 10rem;
  --bs-dropdown-padding-x: 0;
  --bs-dropdown-padding-y: 0.5rem;
  --bs-dropdown-spacer: 0.125rem;
  --bs-dropdown-font-size: 0.9375rem;
  --bs-dropdown-color: var(--bs-body-color);
  --bs-dropdown-bg: #fff;
  --bs-dropdown-border-color: #e4e6e8;
  --bs-dropdown-border-radius: var(--bs-border-radius);
  --bs-dropdown-border-width: 0;
  --bs-dropdown-inner-border-radius: 0;
  --bs-dropdown-divider-bg: #e4e6e8;
  --bs-dropdown-divider-margin-y: 0.5rem;
  --bs-dropdown-box-shadow: 0 0.25rem 0.75rem 0 rgba(34, 48, 62, 0.14);
  --bs-dropdown-link-color: #384551;
  --bs-dropdown-link-hover-color: #384551;
  --bs-dropdown-link-hover-bg: rgba(34, 48, 62, 0.06);
  --bs-dropdown-link-active-color: #696cff;
  --bs-dropdown-link-active-bg: rgba(105, 108, 255, 0.16);
  --bs-dropdown-link-disabled-color: #a7acb2;
  --bs-dropdown-item-padding-x: 1.25rem;
  --bs-dropdown-item-padding-y: 0.543rem;
  --bs-dropdown-header-color: rgba(34, 48, 62, 0.6);
  --bs-dropdown-header-padding-x: 1.25rem;
  --bs-dropdown-header-padding-y: 0.5rem;
  position: absolute;
  z-index: var(--bs-dropdown-zindex);
  display: none;
  min-width: var(--bs-dropdown-min-width);
  padding: var(--bs-dropdown-padding-y) var(--bs-dropdown-padding-x);
  margin: 0;
  font-size: var(--bs-dropdown-font-size);
  color: var(--bs-dropdown-color);
  text-align: left;
  list-style: none;
  background-color: var(--bs-dropdown-bg);
  background-clip: padding-box;
  border: var(--bs-dropdown-border-width) solid var(--bs-dropdown-border-color);
  border-radius: var(--bs-dropdown-border-radius);
}
.dropdown-menu[data-bs-popper] {
  top: 100%;
  left: 0;
  margin-top: var(--bs-dropdown-spacer);
}

.dropdown-menu-start {
  --bs-position: start;
}
.dropdown-menu-start[data-bs-popper] {
  right: auto;
  left: 0;
}

.dropdown-menu-end {
  --bs-position: end;
}
.dropdown-menu-end[data-bs-popper] {
  right: 0;
  left: auto;
}

@media (min-width: 576px) {
  .dropdown-menu-sm-start {
    --bs-position: start;
  }
  .dropdown-menu-sm-start[data-bs-popper] {
    right: auto;
    left: 0;
  }
  .dropdown-menu-sm-end {
    --bs-position: end;
  }
  .dropdown-menu-sm-end[data-bs-popper] {
    right: 0;
    left: auto;
  }
}
@media (min-width: 768px) {
  .dropdown-menu-md-start {
    --bs-position: start;
  }
  .dropdown-menu-md-start[data-bs-popper] {
    right: auto;
    left: 0;
  }
  .dropdown-menu-md-end {
    --bs-position: end;
  }
  .dropdown-menu-md-end[data-bs-popper] {
    right: 0;
    left: auto;
  }
}
@media (min-width: 992px) {
  .dropdown-menu-lg-start {
    --bs-position: start;
  }
  .dropdown-menu-lg-start[data-bs-popper] {
    right: auto;
    left: 0;
  }
  .dropdown-menu-lg-end {
    --bs-position: end;
  }
  .dropdown-menu-lg-end[data-bs-popper] {
    right: 0;
    left: auto;
  }
}
@media (min-width: 1200px) {
  .dropdown-menu-xl-start {
    --bs-position: start;
  }
  .dropdown-menu-xl-start[data-bs-popper] {
    right: auto;
    left: 0;
  }
  .dropdown-menu-xl-end {
    --bs-position: end;
  }
  .dropdown-menu-xl-end[data-bs-popper] {
    right: 0;
    left: auto;
  }
}
@media (min-width: 1400px) {
  .dropdown-menu-xxl-start {
    --bs-position: start;
  }
  .dropdown-menu-xxl-start[data-bs-popper] {
    right: auto;
    left: 0;
  }
  .dropdown-menu-xxl-end {
    --bs-position: end;
  }
  .dropdown-menu-xxl-end[data-bs-popper] {
    right: 0;
    left: auto;
  }
}
.dropup .dropdown-menu[data-bs-popper] {
  top: auto;
  bottom: 100%;
  margin-top: 0;
  margin-bottom: var(--bs-dropdown-spacer);
}
.dropup .dropdown-toggle::after {
  display: inline-block;
  margin-left: 0.5em;
  vertical-align: middle;
  content: "";
  margin-top: 0.26675em;
  margin-left: 0.8em;
  width: 0.55em;
  height: 0.55em;
  border: 2px solid;
  border-bottom: 0;
  border-left: 0;
  transform: rotate(-45deg);
}
[dir=rtl] .dropup .dropdown-toggle::after {
  margin-right: 0.8em !important;
  margin-left: 0 !important;
}
.dropup .dropdown-toggle:empty::after {
  margin-left: 0;
}

.dropend .dropdown-menu[data-bs-popper] {
  top: 0;
  right: auto;
  left: 100%;
  margin-top: 0;
  margin-left: var(--bs-dropdown-spacer);
}
.dropend .dropdown-toggle::after {
  display: inline-block;
  margin-left: 0.5em;
  vertical-align: middle;
  content: "";
  border-top: 0.55em solid transparent;
  border-right: 0;
  border-bottom: 0.55em solid transparent;
  border-left: 0.55em solid;
}
.dropend .dropdown-toggle:empty::after {
  margin-left: 0;
}
.dropend .dropdown-toggle::after {
  vertical-align: 0;
}

.dropstart .dropdown-menu[data-bs-popper] {
  top: 0;
  right: 100%;
  left: auto;
  margin-top: 0;
  margin-right: var(--bs-dropdown-spacer);
}
.dropstart .dropdown-toggle::after {
  display: inline-block;
  margin-left: 0.5em;
  vertical-align: middle;
  content: "";
}
.dropstart .dropdown-toggle::after {
  display: none;
}
.dropstart .dropdown-toggle::before {
  display: inline-block;
  margin-right: 0.5em;
  vertical-align: middle;
  content: "";
  border-top: 0.55em solid transparent;
  border-right: 0.55em solid;
  border-bottom: 0.55em solid transparent;
}
.dropstart .dropdown-toggle:empty::after {
  margin-left: 0;
}
.dropstart .dropdown-toggle::before {
  vertical-align: 0;
}

.dropdown-divider {
  height: 0;
  margin: var(--bs-dropdown-divider-margin-y) 0;
  overflow: hidden;
  border-top: 1px solid var(--bs-dropdown-divider-bg);
  opacity: 1;
}

.dropdown-item {
  display: block;
  width: 100%;
  padding: var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);
  clear: both;
  font-weight: 400;
  color: var(--bs-dropdown-link-color);
  text-align: inherit;
  white-space: nowrap;
  background-color: transparent;
  border: 0;
  border-radius: var(--bs-dropdown-item-border-radius, 0);
}
.dropdown-item:hover, .dropdown-item:focus {
  color: var(--bs-dropdown-link-hover-color);
  background-color: var(--bs-dropdown-link-hover-bg);
}
.dropdown-item.active, .dropdown-item:active {
  color: var(--bs-dropdown-link-active-color);
  text-decoration: none;
  background-color: var(--bs-dropdown-link-active-bg);
}
.dropdown-item.disabled, .dropdown-item:disabled {
  color: var(--bs-dropdown-link-disabled-color);
  pointer-events: none;
  background-color: transparent;
}

.dropdown-menu.show {
  display: block;
}

.dropdown-header {
  display: block;
  padding: var(--bs-dropdown-header-padding-y) var(--bs-dropdown-header-padding-x);
  margin-bottom: 0;
  font-size: 0.8125rem;
  color: var(--bs-dropdown-header-color);
  white-space: nowrap;
}

.dropdown-item-text {
  display: block;
  padding: var(--bs-dropdown-item-padding-y) var(--bs-dropdown-item-padding-x);
  color: var(--bs-dropdown-link-color);
}

.dropdown-menu-dark {
  --bs-dropdown-color: rgba(34, 48, 62, 0.3);
  --bs-dropdown-bg: rgba(34, 48, 62, 0.8);
  --bs-dropdown-border-color: #e4e6e8;
  --bs-dropdown-box-shadow: ;
  --bs-dropdown-link-color: rgba(34, 48, 62, 0.3);
  --bs-dropdown-link-hover-color: #fff;
  --bs-dropdown-divider-bg: #e4e6e8;
  --bs-dropdown-link-hover-bg: rgba(255, 255, 255, 0.15);
  --bs-dropdown-link-active-color: #696cff;
  --bs-dropdown-link-active-bg: rgba(105, 108, 255, 0.16);
  --bs-dropdown-link-disabled-color: rgba(34, 48, 62, 0.5);
  --bs-dropdown-header-color: rgba(34, 48, 62, 0.5);
}



.dropdown-menu li { width: 100% !important; }


.person-profile .card {
	border-radius: 10px;
    -webkit-box-shadow: 0px 4px 8px 0 rgba(0, 0, 0, .15);
	-moz-box-shadow: 0px 4px 8px 0 rgba(0, 0, 0, .15);
	box-shadow: 0px 4px 8px 0 rgba(0, 0, 0, .15);
}

.person-profile .title {
	text-align: center;
	padding-bottom: 20px;
	margin-bottom: 20px;
	border-bottom: 1px solid var(--iq-secondary-light);
}

.person-profile .title img {
	width: 100%;
}

.person-profile .person-name {
	font-weight: bold;
	font-size: 20px;
}

.person-profile .person-position {
	color: var(--iq-blue);
}

.person-profile .person-items {
	text-align: left;
}

.person-profile .person-items svg {
	color: var(--iq-blue);
}

.person-profile .person-items .text {
	font-size: 18px;
}

.bg-teaser {
	background-color: var(--iq-primary-hover);
	margin-bottom: 30px;
}

.bg-video-play {
	background-color: var(--iq-black);
	margin-bottom: 30px;
}

.pre-block {
	width: 100%;
	height: auto;
	padding: 0px;
	overflow: hidden;
	white-space: pre-wrap;
	white-space: -moz-pre-wrap !important;
	white-space: -pre-wrap;
	white-space: -o-pre-wrap;
	word-wrap: break-word;
}

.btn-close-wh {
  box-sizing: content-box;
  width: 1em;
  height: 1em;
  padding: 0.25em 0.25em;
  color: #000;
  background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
  border: 0;
  border-radius: 0.25rem;
  opacity: 0.5;
}

.modal-header .btn-close-wh {
  padding: 0.5rem 0.5rem;
  margin: -0.5rem -0.5rem -0.5rem auto;
}

.shadow-md {
  box-shadow: 0 0.175rem 0.75rem rgba(0, 0, 0, 0.125) !important;
}

.circle-24 { width: 24px;height: 24px; }
.circle-32 { width: 32px;height: 32px; }
.circle-48 { width: 48px;height: 48px; }
.circle-56 { width: 56px;height: 56px; }

.w-100px { width: 100px !important; }
.w-120px { width: 120px !important; }
.w-150px { width: 150px !important; }

.fs-7 { font-size: .825rem !important; }
.fs-8 { font-size: .75rem !important; }
.fs-9 { font-size: .625rem !important; }

.btn-info, .btn-info:hover, .btn-info:focus {
  color: #fff;
}

.forum .post {
	color: var(--iq-secondary);
}

.forum .post-footer {
	border-top: 1px solid #dee2e6 !important;
	padding-top: 10px;
	text-align: right !important;
}

.forum .reply {
	border: 1px solid var(--iq-gray-20);
}

.forum .reply .reply-header {
	background-color: var(--iq-gray-10);
	color: var(--iq-secondary);
	padding: 10px 15px;
	font-weight: bold;
}

.forum .reply .reply-detail {
	padding: 15px;
	color: var(--iq-secondary);
}

.forum .avatar {
	border-radius: 50% !important;
	font-weight: bold;
	font-size: 1.25rem;
	color: #fff;
	align-items: center;
	justify-content: center;
}