/* Normal desktop :1200px. */
@media (min-width: 1200px) and (max-width: 1500px) {
	.slider-height {
		min-height: 700px;
	}

	.btn.btn-icon.btn-icon-white {
		display: none;
	}

	.header-padding {
		padding: 0 5px;
	}

	.header-padding .header-right {
		margin-left: 0;
		margin-top: 25px;
	}

	.slider-height-2 {
		min-height: 920px;
	}

	.slider-right-2 {
		padding-top: 50px;
	}

	.slider-active:hover button.slick-prev {
		left: 15px;
	}

	.slider-active:hover button.slick-next {
		right: 15px;
	}

	.hire-text-2 {
		padding-left: 50px;
		padding-right: 50px;
		padding-top: 100px;
		padding-bottom: 100px;
	}

	.header-info4 span:last-child {
		display: none;
	}

	.header__menu4 ul li {
		margin-left: 20px;
	}

	.header-button {
		padding-left: 15px;
	}

	.header-lang span {
		display: none;
	}

	.about-exp {
		bottom: 30px;
		left: 30px;
	}


}


/* Normal desktop :992px. */
@media (min-width: 992px) and (max-width: 1200px) {
	.header-2-icon {
		display: none;
	}

	.nav-search.search-trigger.header-2-icon {
		display: none;
	}

	.slider-height {
		min-height: 700px;
	}

	.header-padding {
		padding: 0 0;
	}

	.breadcrumb-bg {
		padding: 100px 0;
	}

	.about-title h1 {
		font-size: 45px;
	}

	.about-text.mb-50 {
		margin-bottom: 30px;
	}

	.btn.btn-icon.btn-icon-white {
		display: none;
	}

	.header__menu.header-menu-white ul li:first-child {
		margin-left: 0;
	}

	.slider-height-2 {
		min-height: 800px;
	}

	.header__menu ul li {
		margin-left: 15px;
	}

	.header-right {
		margin-left: 30px;
	}

	.section-text-small h1 {
		font-size: 40px;
	}

	.header-cta-info.header-cta-info-3 {
		margin-right: 43px;
	}

	.slider-right-2 {
		padding-top: 90px;
	}

	.hero-slider-caption-2 h1 {
		font-size: 69px;
	}

	.hero-slider-caption h1 {
		font-size: 58px;
	}

	.medical-icon-brand {
		display: none;
	}

	.about-exp {
		bottom: 30px;
		left: 30px;
	}

	.service-content h3 {
		font-size: 24px;
	}

	.feature-box {
		margin-top: 0;
	}

	.service-box-3 .service-thumb img {
		width: 100%;
	}

	.service-box-3 .service-content {
		padding-top: 30px;
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 15px;
	}

	.single-membership-box h3 {
		font-size: 23px;
	}

	.hire-left-img {
		width: 33.333333%;
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center center;
	}

	.hire-text-2 {
		padding-left: 50px;
		padding-right: 50px;
		padding-top: 80px;
		padding-bottom: 80px;
	}

	.hire-right-img {
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center center;
		width: 33.333333%;
	}

	.counter-text p {
		padding: 0 0px;
	}

	.service-box-3 .service-content h3 {
		font-size: 22px;
	}

	.section-text.section-text-white h1 {
		font-size: 47px;
	}

	.team-member-info h3 {
		font-size: 24px;
	}

	.single-membership-box {
		padding: 35px;
		padding-bottom: 14px;
	}

	.appoint-button {
		text-align: center;
	}

	.appoinment-right {
		display: none;
	}

	.appoinment-box-content {
		padding: 70px;
	}

	.team-author-info {
		width: 189%;
	}

	.membership-box {
		padding-left: 70px;
		padding-right: 70px;
	}

	.price-content {
		padding: 21px;
		padding-right: 15px;
	}

	.service-box-2 {
		padding: 41px;
		padding-bottom: 36px;
	}

	.service-content.service-content-2 p {
		padding-right: 0;
	}

	.testi-content-2 p {
		padding-right: 0;
	}

	.testi-content-2 h3 {
		font-size: 22px;
	}

	.team-link {
		right: 0;
	}

	.hero-slider-caption p {
		padding-right: 100px;
	}

	.about-front-img img {
		width: 100%;
	}

	.about-right-side {
		padding-left: 0px;
		padding-top: 0;
	}

	.about-text p {
		padding-right: 0;
	}

	.about-shape {
		top: 0;
	}

	.cta-satisfied {
		padding-left: 0;
	}

	.pricing-box {
		padding: 24px;
		background: #fff;
	}

	.latest-news-content {
		padding-right: 79px;
	}

	.latest-news-thumb img {
		width: 100%;
	}

	.latest-news-box-2 .latest-news-content-box {
		padding: 0 40px;
	}

	.footer-newsletter input {
		padding: 0 30px;
	}

	.analysis-area .nav-item a.nav-link {
		padding: 54px;
	}

	.analysis-area .nav-item {
		margin-right: 24px;
	}

	.analysis-chart img {
		width: 100%;
	}

	.analysis-bg-icon img {
		width: 61%;
	}

	.analysis-area {
		padding-bottom: 200px;
	}

	.ser-fea-box {
		margin-right: 25px;
	}

	.more-service-title {
		margin-left: 1px;
	}

	.ser-form-btn {
		display: none;
	}

	.banner-widget img {
		width: 100%;
	}

	.single-couter p {
		padding-right: 0;
	}

	.medical-icon-brand-3 {
		display: none;
	}

	.service-widget {
		padding: 25px;
		padding-top: 25px;
	}

	.service-widget .widget-title {
		font-size: 22px;
	}

	.team-box-3 .team-member-info h3 {
		font-size: 22px;
	}

	.more-service-list ul li a {
		display: block;
	}

	.more-service-icon {
		margin-bottom: 12px;
	}

	.doctor-detials-lan ul li a {
		margin-right: 5px;
		margin-bottom: 8px;
	}

	.section-title h1 {
		font-size: 45px;
	}

	.hire-text p {
		padding-right: 0;
	}

	.hire-text h1 {
		font-size: 32px;
		margin-bottom: 15px;
	}

	.hire-text {
		padding-top: 20px;
		padding-left: 30px;
	}

	.header-info4 span:last-child {
		display: none;
	}

	.about-overlap__thumb {
		display: none;
	}

	.call-btn {
		right: 0;
		left: 0;
		text-align: center;
	}

	.header-cta-info-3.cta-info-address {
		display: none;
	}

	.header-phone {
		display: none;
	}


}


/* Tablet desktop :768px. */
@media (min-width: 768px) and (max-width: 991px) {
	.header-address {
		display: none;
	}

	.header-menu-area.header-padding.transparrent-header {
		padding: 25px 10px;
	}

	.hero-text.hero-text-2 {
		padding-top: 150px;
	}

	.header-cta-info {
		margin-right: 16px;
	}

	.header-menu-area.header-menu-blue {
		padding: 0;
		background: 0;
	}

	.medical-icon-brand {
		display: none;
	}

	.mobile-menu.mobile-menu-blue.mean-container a.meanmenu-reveal {
		margin-top: -55px;
	}

	.membership-area.membership-bg {
		background-size: cover;
	}

	.hire-text-2 {
		padding: 100px;
	}

	.hire-left-img {
		position: static;
		width: 100%;
		height: 100%;
		background-repeat: no-repeat;
		min-height: 500px;
	}

	.hire-right-img {
		position: static;
		width: 100%;
		height: 100%;
		background-repeat: no-repeat;
		min-height: 500px;
	}

	.header-padding {
		padding: 0 30px;
		padding-top: 45px;
	}

	.top-bar-3 {
		padding-bottom: 12px;
	}

	.slider-height-2 {
		background-repeat: no-repeat;
	}

	.slider-right-2 {
		padding-top: 50px;
		padding-bottom: 70px;
	}

	.header-info span {
		margin-right: 30px;
	}

	.slider-height {
		min-height: 620px;
	}

	.main-menu ul li:last-child {
		margin-right: 0;
	}

	.about-area-mid {
		padding-top: 50px;
	}

	.about-text p {
		padding-right: 0;
	}

	.pricing-menu.f-right {
		float: none;
		display: inline-block;
		margin-bottom: 30px;
	}

	.hero-slider-caption h1 {
		font-size: 52px;
	}

	.service-box-3 .service-thumb img {
		width: 100%;
	}

	.service-box-3 .service-content {
		padding: 27px;
		padding-bottom: 10px;
	}

	.section-text.section-text-white h1 {
		font-size: 53px;
	}

	.review-box {
		margin-bottom: 30px;
	}

	.about-exp {
		bottom: 30px;
		left: 30px;
	}

	.mission-about-text p {
		padding-right: 61px;
	}

	.membership-review {
		padding-bottom: 60px;
	}

	.faq-left-box {
		display: none;
	}

	.price-content {
		padding: 30px;
		padding-right: 38px;
	}

	.section-title.section-title-m-0 {
		margin-bottom: 0;
	}

	.appoinment-box-content {
		padding: 35px;
	}

	.appoinment-right {
		display: none;
	}

	.appoint-button {
		text-align: center;
	}

	.appoinment-form-box-option {
		padding-bottom: 6px;
	}

	.appoint-ment-icon {
		margin-right: 20px;
	}

	.appointment-form-2 input::placeholder {
		font-size: 21px;
	}

	.about-front-img img {
		width: 100%;
	}

	.about-right-side {
		padding-left: 0;
		padding-top: 20px;
	}

	.service-box {
		padding: 36px;
	}

	.service-box-2 {
		padding: 80px;
		padding-bottom: 72px;
	}

	.team-author-info {
		width: 164%;
	}

	.cta-satisfied {
		padding-left: 0;
	}

	.latest-news-thumb img {
		width: 100%;
	}

	.latest-news-box-2 .latest-news-content {
		padding: 25px;
		padding-bottom: 3px;
	}

	.team-link {
		right: 0;
	}

	.testi-content p {
		padding: 0;
	}

	.analysis-area .nav-item a.nav-link {
		padding: 17px;
	}

	.analysis-area .nav-item {
		margin-right: 17px;
	}

	.analysis-area .nav.nav-pills {
		margin-top: -100px;
	}

	.testi-box {
		margin-bottom: 97px;
	}

	.analysis-chart {
		display: none;
	}

	.analysis-area {
		padding-bottom: 110px;
	}

	.mk-call-btn {
		display: none;
	}

	.banner-widget {
		text-align: center;
	}

	.footer-contact-info {
		margin-top: 0;
	}

	.medical-icon-brand-2 {
		display: none;
	}

	.breadcrumb-bg {
		padding: 100px 0;
	}

	.counter-text p {
		padding: 0 20px;
	}

	.doctor-detials-lan ul li a {
		margin-right: 5px;
		margin-bottom: 8px;
	}

	.section-title h1 {
		font-size: 40px;
	}

	.page-title h1 {
		font-size: 42px;
	}

	.calculate-section .section-text p {
		padding-right: 0;
	}

	.hire-img img {
		width: 100%;
	}

	.service-widget .widget-title {
		font-size: 30px;
	}

	.product-list-content.pt-10.mb-30 {
		padding-top: 0;
	}


	.header-menu-area {
		padding-top: 15px;
	}


}


/* small mobile :320px. */
@media (max-width: 767px) {
	.header-menu-area {
		padding-top: 15px;
	}

	.header-menu-area.header-menu-blue {
		padding: 25px 0;
		background: 0;
		padding: 0;
	}

	.medical-icon-brand {
		display: none;
	}

	.mobile-menu.mobile-menu-blue.mean-container a.meanmenu-reveal {
		margin-top: -54px;
	}

	.top-bar-white.top-bar-3 {
		padding-bottom: 12px;
	}

	.hero-text-box {
		padding-right: 0;
		padding: 30px;
	}

	.hero-slider-caption p {
		margin-bottom: 0px;
	}

	.slider-height-3 .hero-slider-caption h1 {
		font-size: 38px;
	}

	.about-right-content {
		padding-right: 0;
	}

	.service-box-3 .service-thumb img {
		width: 100%;
	}

	.medical-icon-brand-2 {
		display: none;
	}

	.hero-slider-caption h1 {
		font-size: 40px;
	}

	.slider-right-2 {
		padding-top: 50px;
		padding-bottom: 50px;
	}

	.appoint-ment-icon {
		margin-right: 25px;
		display: none;
	}

	.caregive-box {
		padding: 30px;
		padding-bottom: 0px;
	}

	.nice-select.postform .current {
		font-size: 18px;
	}

	.search-form h3 {
		font-size: 30px;
	}

	.feature-box {
		margin-top: 0;
	}

	.hero-text.hero-text-2 {
		padding-top: 150px;
	}

	.header-menu-area.header-padding {
		padding: 0;
		padding-top: 25px;
	}

	.slider-height {
		min-height: 590px;
	}

	.hero-slider-caption {
		margin-bottom: 30px;
	}

	.about-front-img img {
		width: 100%;
	}

	.about-shape img {
		width: 100%;
	}

	.about-shape {
		top: -65px;
	}

	.about-right-side {
		padding-left: 0;
		padding-top: 0;
	}

	.about-title h1 {
		font-size: 36px;
	}

	.team-link {
		right: 20px;
	}

	.section-title h1 {
		font-size: 32px;
	}

	.feature-box {
		padding: 27px;
		margin-bottom: 30px;
	}

	.cta-satisfied {
		padding-left: 0;
	}

	.single-satisfied h5 {
		font-size: 14px;
		display: block;
		width: 100%;
	}

	.single-satisfied h5,
	.single-satisfied p {
		width: 100%;
	}

	.pricing-menu a.nav-link {
		padding: 30px 44px;
	}

	.mk-call-btn {
		display: none;
	}

	.meta-date {
		margin-right: 15px;
	}

	.about-text-list ul li i {
		float: left;
	}

	.mission-vision-list {
		padding-right: 0;
	}

	.hire-text {
		padding: 25px;
	}

	.hire-text h1 {
		font-size: 30px;
		margin-bottom: 20px;
	}

	.hiring-area {
		padding-bottom: 120px;
	}

	.mv-text p {
		padding-right: 0;
		padding: 0;
	}

	.about-text.mission-about-text p {
		padding-right: 0;
	}

	.appoinment-box-content {
		padding: 25px;
	}

	.appointment-form-2 input::placeholder {
		font-size: 18px;
	}

	.appoinment-right img {
		display: none;
	}

	.service-box-2 {
		padding: 30px;
		padding-bottom: 30px;
	}

	.service-box-2 .service-thumb {
		position: relative;
		z-index: 9;
	}

	.service-big-number {
		font-size: 145px;
	}

	.service-content-2 h3 {
		font-size: 26px;
	}

	.testi-content-2 p {
		line-height: 26px;
		padding-right: 0;
	}

	.testi-author-desination-2 h4 {
		font-size: 17px;
		margin-bottom: 11px;
	}

	.news-letter-box {
		padding: 30px;
	}

	.subscribe-form form button {
		position: static;
		margin-top: 10px;
	}

	.latest-news-thumb img {
		width: 100%;
	}

	.emmergency-call span {
		font-size: 30px;
	}

	.footer-contact-info {
		margin-top: -190px;
	}

	.team-author-info {
		width: 170%;
	}

	.latest-news-box-2 .latest-news-content {
		padding: 20px;
		padding-bottom: 5px;
	}

	.testi-content-2 h3 {
		font-size: 20px;
	}

	.footer-co-content h4 {
		font-size: 22px;
	}

	.footer-contact-info {
		padding: 20px;
		padding-bottom: 30px;
		margin-top: -138px;
	}

	.footer-newsletter {
		display: none;
	}

	.footer-contact-info-3 .footer-contact-content p {
		padding-right: 0;
	}

	.breadcrumb-bg {
		padding-top: 130px;
		padding-bottom: 150px;
	}

	.page-title h1 {
		font-size: 35px;
		margin-bottom: 20px;
	}

	.small-text {
		font-size: 18px;
		font-weight: 500;
		margin-bottom: 0;
	}

	.mv-title p {
		padding-right: 0;
	}

	.calculate-content {
		padding: 25px;
	}

	.about-title.news-letter-title h1 {
		font-size: 29px;
	}

	.single-couter {
		text-align: center;
	}

	.appoinment-content {
		padding: 20px;
	}

	.appoinment-content h1 {
		font-size: 30px;
	}

	.testi-content p {
		padding: 0;
	}

	.testi-author-title {
		font-size: 21px;
	}

	.testi-bg-icon img {
		width: 100%;
	}

	.testi-content p {
		font-size: 17px;
		line-height: 26px;
	}

	.testi-bg-icon {
		top: 28px;
	}

	.analysis-bg-icon {
		display: none;
	}

	.analysis-chart {
		display: none;
	}

	.ser-fea-box {
		margin-right: 0;
		margin-bottom: 30px;
	}

	.service-chart img {
		width: 100%;
	}

	.service-doctors img {
		width: 100%;
	}

	.download-box {
		padding: 18px 10px;
	}

	.download-area a img {
		margin-right: 16px;
	}

	.banner-widget img {
		width: 100%;
	}

	.ser-form-btn {
		margin-bottom: 0;
		display: none;
	}

	.footer-contact-info {
		margin-top: 0;
	}

	.widget {
		padding: 20px;
	}

	.single-couter.counter-box {
		margin-bottom: 40px;
	}

	.membership-box {
		padding-left: 15px;
		padding-right: 15px;
	}

	.single-membership-box {
		padding: 20px;
	}

	.membership-area.membership-bg {
		background-size: cover;
		background-position: center center;
	}

	.pricing-area nav.pricing-nav .nav-item.nav-link.active {
		padding-right: 40px;
		padding-left: 40px;
	}

	.faq-right-box .btn-link::before {
		display: none;
	}

	.faq-left-box {
		margin-bottom: 300px;
	}

	.footer-contact-info.footer-contact-info-3 {
		padding: 0;
	}

	.about-text p {
		padding-right: 0;
	}

	.pricing-menu.f-right {
		float: none;
		display: inline-block;
		margin-bottom: 30px;
	}

	.pricing-box {
		padding: 40px 30px;
		background: #fff;
	}

	.recent-news-list {
		padding: 30px;
	}

	.emmergency-call-icon {
		margin-bottom: 10px;
	}

	.team-thumb {
		display: inline-block;
	}

	.btn.gray-btn-border {
		padding: 23px 35px;
	}

	.btn.green-bg-btn {
		padding: 23px 35px;
	}

	.service-content.service-content-2 p {
		padding-right: 0;
	}

	.testi-author-icon-2 {
		margin-right: 15px;
	}

	.footer-co-content {
		overflow: hidden;
	}

	.hire-left-img {
		position: static;
		width: 100%;
		height: 100%;
		background-repeat: no-repeat;
		min-height: 400px;
		background-position: center top;
	}

	.hire-right-img {
		position: static;
		width: 100%;
		height: 100%;
		background-repeat: no-repeat;
		min-height: 400px;
		background-position: center top;
	}

	.hire-text.hire-text-2 {
		padding: 30px;
	}

	.hiring-area.pos-rel {
		padding-bottom: 0;
	}

	.portfolio-filter button {
		padding-bottom: 15px;
		padding-top: 0;
		padding-left: 10px;
		padding-right: 10px;
	}

	.portfolio-filter button::before {
		display: none;
	}

	.single-satisfied h1 {
		float: none;
	}

	.analysis-area .nav-item {
		margin-right: 0;
		width: 100%;
	}

	.analysis-area .nav-item a.nav-link {
		padding: 70px 15px;
	}

	.section-text-green p {
		padding-right: 0;
	}

	.appointment-area {
		background-size: cover;
		background-position: center center;
	}

	.video-btn {
		height: 70px;
		width: 70px;
		line-height: 70px;
	}

	.contact-form input {
		padding: 0 65px;
	}

	.contact-form textarea {
		padding: 30px 65px;
	}

	.counter-text p {
		padding: 0;
	}

	.doctor-detials-lan ul li a {
		margin-right: 5px;
		margin-bottom: 8px;
	}

	.more-service-list ul li a {
		display: block;
	}

	.service-widget {
		padding: 30px;
		padding-top: 30px;
	}

	.team-box-3 .team-member-info h3 {
		font-size: 22px;
	}

	.service-widget .widget-title {
		font-size: 26px;
	}

	.doctor-details-title {
		font-size: 24px;
		margin-left: 0;
		margin-top: 10px;
	}

	.facalty-text p {
		padding-right: 0;
		padding-left: 0;
	}

	.calculate-box .nice-select {
		padding-left: 15px;
	}

	.calculate-form input {
		padding-left: 15px;
	}

	.download-area a span.download-size {
		display: none;
	}

	.more-service-title {
		margin-left: 0;
		margin-top: 10px;
	}

	.product-list-content {
		padding-top: 0;
	}

	.appointment-form-3 textarea {
		padding-left: 15px;
	}

	.footer-widget {
		padding-left: 0;
	}

	.about-exp {
		bottom: 30px;
		left: 30px;
	}

	.footer-social a {
		margin-left: 0;
		margin-right: 20px;
	}

	.footer-social {
		margin-top: 12px;
	}

}

@media (max-width: 576px) {
	.basic-login {
		max-width: 100%;
	}

	.basic-login {
		padding: 1.5rem 0.5rem 1.5rem 0.5rem;
		max-width: 100%;
	}
}

@media (max-width: 767px) {

	.forgot-login {
		float: none;
	}

	.log-rem {
		float: none;
		margin-bottom: 10px;
		display: block;
	}

	.page-title h1,
	.breadcrumb-bg .page-title h1,
	.display-4.fw-bold {
		font-size: 1.5rem !important;
		line-height: 1.2;
	}

	.page-title .small-text,
	.breadcrumb-bg .small-text {
		font-size: 1rem !important;
	}

	.breadcrumb-bg {
		background-size: cover !important;
		background-position: center !important;
		min-height: 180px !important;
		padding-top: 40px !important;
		padding-bottom: 40px !important;
	}
}

/* Large Mobile :480px. */
@media only screen and (min-width: 480px) and (max-width: 767px) {
	.btn.gray-btn-border {
		padding: 23px 60px;
	}

	.btn.green-bg-btn {
		padding: 23px 60px;
	}

	.h4hero-content>p {
		padding-right: 0;
	}

}

@media (min-width: 992px) and (max-width: 1200px) {
	.hero-area .display-3 {
		font-size: 2.5rem !important;
	}

	.hero-area h4 {
		font-size: 1.2rem !important;
	}

	.hero-area .card {
		padding: 28px 18px !important;
		max-width: 95% !important;
	}

	.layanan-box {
		min-height: 180px !important;
		padding: 1.2rem !important;
	}

	.layanan-box img {
		width: 32px !important;
		height: 32px !important;
	}
}

@media (min-width: 1200px) and (max-width: 1500px) {
	.hero-area .display-3 {
		font-size: 2.8rem !important;
	}

	.hero-area h4 {
		font-size: 1.3rem !important;
	}

	.hero-area .card {
		padding: 32px 24px !important;
		max-width: 90% !important;
	}

	.layanan-box {
		min-height: 190px !important;
		padding: 1.5rem !important;
	}

	.layanan-box img {
		width: 36px !important;
		height: 36px !important;
	}
}

@media (max-width: 767.98px) {

	/* Hero Section */
	.hero-area {
		min-height: 340px !important;
		padding: 0 !important;
	}

	.hero-area .display-3 {
		font-size: 2rem !important;
	}

	.hero-area h4 {
		font-size: 1.1rem !important;
	}

	.hero-area .card {
		padding: 18px 8px !important;
		max-width: 100% !important;
	}

	.hero-area .col-lg-6 {
		padding: 10px !important;
	}

	.hero-area .p-4 {
		padding: 1rem !important;
	}

	.hero-area .mb-3,
	.hero-area .mb-4,
	.hero-area .mb-5 {
		margin-bottom: 0.8rem !important;
	}

	.hero-area h2,
	.hero-area .fw-bold {
		font-size: 1.2rem !important;
	}

	.hero-area h6 {
		font-size: 0.98rem !important;
	}

	.hero-area .btn,
	.hero-area .btn-block {
		font-size: 0.98rem !important;
		padding: 10px 12px !important;
		border-radius: 8px !important;
	}

	.layanan-box {
		min-height: 170px !important;
		padding: 0.7rem !important;
	}

	.layanan-box img {
		width: 24px !important;
		height: 24px !important;
	}

	.hero-area .row {
		min-height: unset !important;
	}

	.review-area h2 {
		font-size: 1.2rem !important;
	}

	.review-area .p-4 {
		padding: 1rem !important;
	}

	.review-area .fal {
		font-size: 1.5rem !important;
	}

	.review-area h3 {
		font-size: 1.2rem !important;
	}

	.review-area p {
		font-size: 0.95rem !important;
	}

	.review-area .mb-4 {
		margin-bottom: 1rem !important;
	}
}

@media (min-width: 768px) and (max-width: 991.98px) {
	.review-area h2 {
		font-size: 1.4rem !important;
	}

	.review-area .p-4 {
		padding: 1.2rem !important;
	}

	.review-area .fal {
		font-size: 1.8rem !important;
	}

	.review-area h3 {
		font-size: 1.4rem !important;
	}
}

/* Tombol Selengkapnya agar tidak overflow */
.layanan-box .btn {
	width: 100%;
	box-sizing: border-box;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	display: block;
	margin: 0 auto;
	padding-left: 0.5rem;
	padding-right: 0.5rem;
}

/* Grid layanan: 2 kolom pada layar 992-1200px */
@media (min-width: 992px) and (max-width: 1200px) {
	.hero-area .row>.col-md-4 {
		flex: 0 0 50%;
		max-width: 50%;
	}
}

/* Grid layanan: 3 kolom pada layar >1200px */
@media (min-width: 1201px) {
	.hero-area .row>.col-md-4 {
		flex: 0 0 33.3333%;
		max-width: 33.3333%;
	}
}

/* Pastikan .layanan-box padding cukup */
.layanan-box {
	padding: 1.2rem !important;
	min-width: 0;
	word-break: break-word;
}

@media (max-width: 767.98px) {
	.about-area {
		padding-top: 2.5rem !important;
		padding-bottom: 1.5rem !important;
	}

	.about-title h2 {
		font-size: 1.2rem !important;
	}

	.about-title h5 {
		font-size: 0.98rem !important;
	}

	.about-text p {
		font-size: 0.97rem !important;
		line-height: 1.5 !important;
	}

	.feature-box {
		padding: 1rem !important;
	}

	.feature-small-icon .fa-3x {
		font-size: 1.7rem !important;
	}

	.feature-small-content h5 {
		font-size: 1.05rem !important;
	}

	.about-right-side {
		padding-top: 0 !important;
	}

	.about-area .pl-3 {
		padding-left: 1rem !important;
	}

	.about-area ul li {
		font-size: 0.97rem !important;
	}
}

@media (min-width: 768px) and (max-width: 991.98px) {
	.about-title h2 {
		font-size: 1.4rem !important;
	}

	.feature-small-icon .fa-3x {
		font-size: 2rem !important;
	}

	.feature-box {
		padding: 1.2rem !important;
	}
}

@media (max-width: 767.98px) {

	/* Sertifikasi & Slogan */
	.certification-slogan-section h2 {
		font-size: 1.1rem !important;
	}

	.iso-certification-modern,
	.slogan-card-modern {
		padding: 1rem !important;
		min-height: 120px !important;
	}

	.iso-icon-wrapper,
	.slogan-icon {
		width: 44px !important;
		height: 44px !important;
		font-size: 1.2rem !important;
	}

	.iso-certification-modern h4,
	.slogan-card-modern h5 {
		font-size: 1rem !important;
	}

	.iso-certification-modern p,
	.slogan-card-modern p {
		font-size: 0.92rem !important;
	}

	.iso-badge {
		font-size: 0.8rem !important;
		padding: 3px 10px !important;
	}

	/* FAQ */
	.faq-left-box {
		margin-bottom: 1.5rem !important;
		height: auto !important;
	}

	.faq-video-container {
		height: 180px !important;
		min-height: 120px !important;
	}

	.about-title.mb-45 h2 {
		font-size: 1.1rem !important;
	}

	.faq-right-box .card {
		margin-bottom: 0.7rem !important;
	}

	.faq-right-box .card-header h5 {
		font-size: 1rem !important;
	}

	.faq-right-box .card-body p,
	.faq-right-box .card-body ol {
		font-size: 0.95rem !important;
	}

	/* Brand Area */
	.brand-carousel .item img {
		max-height: 38px !important;
	}

	.brand-carousel .item {
		padding-left: 0.5rem !important;
		padding-right: 0.5rem !important;
	}

	.brand-carousel {
		margin-bottom: 1rem !important;
	}

	.py-5 {
		padding-top: 1.5rem !important;
		padding-bottom: 1.5rem !important;
	}
}

@media (max-width: 767.98px) {
	.py-5.text-center h2 {
		font-size: 1.2rem !important;
	}

	.py-5.text-center h5 {
		font-size: 0.98rem !important;
	}

	.footer-bg,
	.footer-bg.py-5 {
		padding-top: 1rem !important;
		padding-bottom: 1rem !important;
	}

	.footer-top,
	.footer-bottom {
		padding-top: 0.3rem !important;
		padding-bottom: 0.3rem !important;
	}

	.footer-padahalaman,
	.footer-kunjungi-kami {
		display: none !important;
	}
}

@media (max-width: 767.98px) {
	.basic-login {
		max-width: 98vw !important;
		padding: 1.2rem 0.7rem 1.2rem 0.7rem !important;
		border-radius: 12px !important;
	}

	.basic-login h3 {
		font-size: 1.1rem !important;
		margin-bottom: 1.1rem !important;
	}

	.input-group-text,
	.input-group .form-control,
	.input-group .password-toggle {
		font-size: 0.98rem !important;
		padding: 0.5rem 0.7rem !important;
	}

	.bt-btn.bt-btn-sec,
	.bt-btn.bt-btn-sec:focus,
	.bt-btn.w-100 {
		font-size: 0.95rem !important;
		padding: 0.6rem 0 !important;
		border-radius: 7px !important;
	}

	.or-divide {
		margin: 1.1rem 0 1rem 0 !important;
	}

	.or-divide span {
		padding: 0 0.7rem !important;
		font-size: 1rem !important;
		line-height: 1.5 !important;
	}

	.or-divide:before,
	.or-divide:after {
		border-bottom: 2px solid #e3eefd !important;
		margin: 0 0.2rem !important;
	}

	.invalid-feedback {
		font-size: 0.92rem !important;
	}

	.log-rem label,
	.forgot-login a {
		font-size: 0.93rem !important;
	}
}

@media (max-width: 767.98px) {
	.top-bar-white .img-fluid {
		max-height: 32px !important;
		max-width: 90vw !important;
	}
}