#page{background-color:#272727; color:#eee}
	
	.contact-form__footer{padding:10px 0}
	.contact-form__footer .h52{padding-bottom:15px; display:block}
	.footer-section{padding:30px 0; padding-top:50px}
	.contact-form__footer input.theme-btn, .contact-form__footer input.theme-btn2{padding:7px 35px; width:220px; margin:0 auto; color:#fff; background:#f3a61d !important ;font-style:normal; display:block }
	.contact-form__footer input, .contact-form__footer textarea{color:#eee; font-size:14px;padding-top:10px; padding-bottom:10px; background: #272727 !important; border-radius:5px; border-color:transparent ;font-style:italic}
    .contact-form__footer input.theme-btn:hover{color:#eee; font-weight:600;width:250px}
	
	/* Placeholder chung */
.wpcf7 form input::placeholder,
.wpcf7 form textarea::placeholder {
  color: #7a7a7a !important; /* đổi màu tại đây */
  
}

/* Webkit (Chrome, Safari) */
.wpcf7 form input::-webkit-input-placeholder,
.wpcf7 form textarea::-webkit-input-placeholder {
  color: #7a7a7a !important;
}
.wpcf7-form .form-control{color:#eee }
/* Firefox */
.wpcf7 form input::-moz-placeholder,
.wpcf7 form textarea::-moz-placeholder {
  color: #7a7a7a !important; 
}
	.contact-details i, .contact-details span{color:#f3a61d}
	.contact-details i{font-size:18px; vertical-align:middel; width:45px; float:left}
	.contact-info__left h2{font-weight:normal; margin-bottom:10px; color:#fff; margin-top:10px;}
	.contact-details {
	  list-style: none;
	  padding: 0;
	  margin: 0;
	}
.content-lines-wrapper {
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
}.content-lines-inner {
  position: absolute;
  width: 1170px;
  left: 50%;
  margin-left: -585px;
  top: 0;
  height: 100%;
  border-left: 1px solid #383838;
  border-right: 1px solid #383838;
  border-bottom: 1px solid #383838;
}.content-lines {
  position: absolute;
  left: 33.333333%;
  right: 33.333333%;
  height: 100%;
  border-left: 1px solid #383838;
  border-right: 1px solid #383838;
}

#sidebarPopup{background-color: rgba(0, 0, 0, 0.85);}

.vertical-bootstrap-menu .nav-link, .dropdown-item{color:#999 }
.nav-link:hover {
	color: #fff;
}
.vertical-bootstrap-menu .nav-link:hover{background-color:transparent}
.sidebar-popup .btn-close:hover{background-color:#2b2b2b}
.vertical-bootstrap-menu .dropdown-menu {
  display: block !important;     /* luôn hiển thị menu con */
  position: static !important;   /* bỏ vị trí tuyệt đối của dropdown bootstrap */
  float: none;                   /* bỏ float mặc định */
  width: 100%;                   /* full chiều ngang khối cha */
  margin-top: 5px;
  padding-left: 20px;            /* lùi vào 20px */
  border-left: 0px solid #dee2e6;
  background: transparent;       /* bỏ nền dropdown */
  box-shadow: none;              /* bỏ đổ bóng */
}
.vertical-bootstrap-menu .nav-link {
  display: block;
  color: #999;
  padding: 8px 12px;
}
.vertical-bootstrap-menu .nav-link:hover {
  color: #fff;
  text-decoration: none;
}
.dropdown-item:hover {
  color: #fff; background-color:transparent 
}
.offcanvas-body{padding:0 40px}
#offcanvasNavbarLabel, #offcanvasNavbarLabel img{margin:0 auto;  display:block; height:95px; width:auto }
.contact-details li {
  display: flex;
  align-items: center; /* Icon và nội dung căn giữa theo chiều dọc */
  gap: 10px; /* khoảng cách icon và nội dung */
  margin-bottom: 12px;
}

.contact-details i {
  font-size: 28px;
  color: #f3a61d;
  width: 20px; /* đảm bảo icon đều nhau */
  text-align: center;
  flex-shrink: 0; /* icon không co lại */
}


.contact-info2 {
  display: flex;
  flex-direction: column;
  left: center;
  text-align: left;
  padding: 5px 10px;
  position: relative;

}
.contact-details a {
  color: #fff;
  text-decoration: none;
}
.contact-details a:hover {
  color: #f3a61d;
}

#logoipm{width: 200px;
  height: 115px;
  float: left;
  margin-top: 5px;
  background: url(images/logo-ipm.png) center center no-repeat;
    background-color: rgba(0, 0, 0, 0);
    background-size: auto;
  background-size: 100%;
  border-right: 1px solid #f5be5f;
  border-left: 1px solid #f5be5f;
  border-bottom: 1px solid #f5be5f;
  background-color: rgb(30,40,66,0.5);
}.contact-form__footer,.contact-info__left{max-width:90%; margin:0 auto;margin-bottom:10px; padding-left:0px; padding-right:0 }
.header2 .nav-right .sidebar-btn span {
    border-color: #f3a61d;
  }
  .header2 .mn-w{background:transparent; border:0; height:85px; width:auto; padding:0; float:right}
  .header2 .navbar-expand-lg .offcanvas .offcanvas-body{display:block}
  .header2 .nav-right .sidebar-btn span{width:42px}
  .header2 {
	  position: relative;
	  width: 100%; background:#111111
  }
  .header2 .nav-right{display:block}
  .header2 .nav-right .sidebar-btn span{margin-top:1px; margin-bottom:9px}
  .duong_dan_breadcrumb{
	display: block;
	overflow: hidden;
	margin: 0;
	line-height: 32px;
	padding-bottom:50px; position:relative; z-index:9; padding-top:10px
	}
	ul.crumbs{margin-left:0px}
	.duong_dan_breadcrumb li a{
	display: inline-block;
	white-space: nowrap;
	font-size: 14px;
	color: #f3a61d; 
	padding: 0 10px 0 0;
	}
	.duong_dan_breadcrumb li{
	display: inline-block;
	vertical-align: middle;
	overflow: hidden;
	font-size:14px
	} 
	.duong_dan_breadcrumb span{
	display: inline-block;
	font-size: 14px;
	color: #c5a47e; 
	line-height: 1;
	padding-right: 7px;}
	.title1, .title2{z-index: 2; position: relative }
.title1 {
  text-align: center;
  color: #fff;
  padding-bottom: 20px;
}
.title1 h1{color:#fff; font-family: 'YenTu', cursive;
  font-size: 75px;}
.title1 span {
  color: #f3a61d;
}

.blog-sidebar .widget {
  background: #171717;
  padding: 30px;
  margin-bottom: 30px;
  border-radius: 15px;
}
.blog-sidebar .widget .widget-title {
  padding-bottom: 10px;
  margin-bottom: 30px;
  position: relative;
  font-size: 22px;
  color: #fff;
  font-weight: 700;
}.blog-sidebar .widget .category-list a {
  display: block;
  padding: 10px 0;
  font-weight: 500;
  color: #eee;
  border-bottom: 1px solid var(--border-info-color);
  transition: var(--transition);
}.blog-sidebar .widget .recent-post-img img {
  width: 75px;
  border-radius: 15px;
}.blog-sidebar .widget .recent-post-info {
  flex: 1;
}.blog-sidebar .widget .recent-post-info h6 {
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 4px;
}
.blog-sidebar .widget .recent-post-info h6 a{color:#fff}
.blog-sidebar .widget .recent-post-info h6 a:hover{color:#f3a61d}

.gioithieu::before {
  content: ' ';
  height: 105%;
  width: 80%;
  right: 0;
  position: absolute;
  background: #000;
  z-index: -1;
}.gioithieu {
  position: relative;
  margin-top: 25px;
}

/*Contact*/

#bd{line-height:0}

.contact-section2{
	padding:50px 0; padding-top:0px;  
	background-color:#272727; position: relative;
}
.contact-section2:before{
	background-image: url("https://demo.ipmvietnam.com.vn/wp-content/themes/ipm/assets/img/shape/bg-contact.png");
    background-repeat: no-repeat;
    content:"";
    background-size: auto; opacity: .45; 
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; z-index: 0;
    background-position: top center;
}
.read-more__link{color:#f3a61d; font-style:normal}
/*===================
45. Contact us css 
=====================*/

.contact-content {
  margin-bottom: 0px; padding:35px 0
}
  .container, .container-sm, .container-md, .container-lg, .container-xl {
 
    z-index: 1;
    position: relative;
  }
.title1, .title2{z-index: 2; position: relative }
.title1 {
  text-align: center;
  color: #fff;
  padding-bottom: 20px;
}
.title1 h1{color:#fff; font-family: 'YenTu', cursive;
  font-size: 75px;}

.title1 span {
  color: #f3a61d;
}
.title2 {
  font-size: 18px;
  text-align: center;
  color: #fff;
  padding-bottom: 20px;
}
.contact-info3 {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 15px;
  padding: 30px 20px;
  position: relative;
  margin-bottom: 25px;
  border-radius: 50px;
  background:#191919;
  transition: var(--transition);
}

.contact-info3:hover{
  transform: translateY(-8px)
}

.contact-info3 .icon{
  font-size: 35px;
  color: #fff;
  width: 70px;
  height: 70px;
  line-height: 70px;
  text-align: center;
  border-radius: 50px;
  background: var(--theme-color);
  position: relative;
}

.contact-info3 .icon::before{
  content: "";
  position: absolute;
  inset: -5px;
  border: 2px dashed var(--theme-color);
  border-radius: 50px;
}

.contact-info3 .content h5 {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 8px;
  color:  #f2f2f2;
}

.contact-info3 .content p{
  color: #eee;
  font-weight: 500;
  font-size: 16px;
}
.contact-info3 .icon::before {
  content: "";
  position: absolute;
  inset: -5px;
  border: 2px dashed var(--theme-color);
  border-radius: 50px;
}


.contact-content .row {
  display: flex;
  flex-wrap: wrap; /* đảm bảo responsive trên mobile */
}

.contact-content .col-md-3 {
  display: flex;
  margin-bottom: 20px; /* khoảng cách giữa các hàng */
}

.contact-info3 {
  display: flex;
  align-items: center; /* căn giữa icon và content theo chiều dọc */
  padding: 15px;
  flex: 1; /* làm đầy chiều cao cột */
  height: 100%; /* đảm bảo Flexbox cột kéo theo */
}

.contact-info3 .icon {
  font-size: 30px;
  margin-right:0px; margin-top:30px;
  flex-shrink: 0; /* icon không bị co lại */
}

.contact-info3 .content h5 {
  margin: 0 0 5px;
  font-size: 16px;
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 8px;   color:#f2f3f2;

} 

.contact-info3 .content p {
  margin: 0;
}
/*End CT*/

/*About us*/
  .title11{text-align:left}
  .title11 h2{color:#f3a61d; font-family: 'YenTu', cursive;
  font-size: 55px;}
  .content_about{color:#fff}


.pagination a,
.pagination span {
  display: inline-block;
  min-width: 36px;
  height: 36px;
  line-height: 36px;
  text-align: center;
  border-radius: 9px;
  border: 0px solid #ddd;
  color: #333;
  text-decoration: none;
  font-size: 15px;
  transition: all 0.3s ease; background:#eee; margin-left:2px; margin-right:2px;
}

.pagination a:hover {
  background-color: #f3a61d;
  color: #fff;
  border-color: #f3a61d;
  box-shadow: 0 2px 6px rgba(0, 120, 255, 0.3);
}

.pagination .current {
  background-color: #f3a61d;
  color: #fff;
  border-color: #f3a61d;
  font-weight: 600;
  box-shadow: 0 2px 6px rgba(0, 120, 255, 0.3);
}

.pagination .next i, .pagination .prev i {
  vertical-align: middle;
  font-size: 14px;
}

.pagination .next span, .pagination .prev span{
  background-color: #eee;
  color: #111;
}

.pagination .next:hover span, .pagination .prev:hover span{
  background-color: #f3a61d;
  color: #fff;
}
/* --- Container 3 cột --- */
#latest-posts {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  justify-content: left;
  padding: 50px 20px;
}

#latest-posts .post-box {
  background: #171717;
  border-radius: 12px;
  overflow: hidden;
  flex: 0 0 calc(33.333% - 20px); /* 3 cột */
  display: flex;
  flex-direction: column;
  transition: transform 0.4s ease, box-shadow 0.4s ease;
  position: relative; margin-bottom:10px;
}
.readMore a i{transform: rotate(-40deg)}
.readMore a:hover i{transform: rotate(0deg)}
/* --- Hover hiệu ứng nổi bật --- */
#latest-posts .post-box:hover {
  transform: translateY(-10px);
  box-shadow: 0 20px 40px rgba(243,166,29,0.5);
}

/* --- Ảnh bài viết --- */
.post-img {
  overflow: hidden;
  position: relative;
}

.post-img img {
  width: 100%;
  height: auto;
  display: block;
  transition: transform 0.5s ease, filter 0.5s ease;
}

.post-box:hover .post-img img {
  transform: scale(1.08) rotate(1deg);
  filter: brightness(1.1) contrast(1.05);
}

/* --- Nội dung --- */
.post-data {
  padding: 20px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.post-title a {
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  transition: color 0.3s ease;
}

.post-box:hover .post-title a {
  color: #f3a61d;
}

.post-info {
  font-size: 14px;
  color: #aaa;
  margin-bottom: 15px;
}

.post-excerpt {
  color: #ddd;
  flex: 1;
  font-size: 14px;
  line-height: 1.6;
  margin-bottom: 15px;
}

.readMore a {
  display: inline-block;
  padding: 8px 18px;
  background: #f3a61d;
  color: #272727;
  border-radius: 30px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
}

.readMore a:hover {
  background: #fff;
  color: #f3a61d;
  transform: scale(1.05);
}

.readMore {
  text-align: center;
}

.readMore a {
  display: inline-block;
  padding: 8px 20px;
  background: #f3a61d;
  color: #272727;
  border-radius: 30px;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
}

.readMore a:hover {
  background: #fff;
  color: #f3a61d;
  transform: scale(1.05);
}


/* --- Responsive --- */
@media (max-width: 992px) { 
  #latest-posts .post-box {
    flex: 0 0 calc(50% - 20px); /* 2 cột tablet */
  }
}

@media (max-width: 480px) {
  #latest-posts .post-box {
    flex: 0 0 100%; /* 1 cột mobile */
  }
}


.pagination a,
.pagination span {
  display: inline-block;
  min-width: 36px;
  height: 36px;
  line-height: 36px;
  text-align: center;
  border-radius: 9px;
  border: 0px solid #ddd;
  color: #333;
  text-decoration: none;
  font-size: 15px;
  transition: all 0.3s ease; background:#eee; margin-left:2px; margin-right:2px;
}

.pagination a:hover {
  background-color: #f3a61d;
  color: #fff;
  border-color: #f3a61d;
  box-shadow: 0 2px 6px rgba(0, 120, 255, 0.3);
}

.pagination .current {
  background-color: #f3a61d;
  color: #fff;
  border-color: #f3a61d;
  font-weight: 600;
  box-shadow: 0 2px 6px rgba(0, 120, 255, 0.3);
}

.pagination .next i, .pagination .prev i {
  vertical-align: middle;
  font-size: 14px;
}

.pagination .next span, .pagination .prev span{
  background-color: #eee;
  color: #111;
}

.pagination .next:hover span, .pagination .prev:hover span{
  background-color: #f3a61d;
  color: #fff;
}

.doiNgu {
    padding-top: 50px;
  }
.imgDoiNgu {
  position: relative;
  width: 525px;
  height: 438px;
  margin: 0 auto;
}
.d-flex {
  display: flex !important;
}
.imgDoiNgu .imgSlide1 img {
  filter: brightness(100%);
}
.imgDoiNgu img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(50%);
}
.imgDoiNgu .imgSlide {
  position: absolute;
  top: 0; left: 0;
  width: 100%;
  height: 100%;
  transform: rotateY(0deg) scale(0.9);
  transition: all 1.2s ease-in-out;
}



.imgDoiNgu .imgSlide-active {
  opacity: 1;
  transform: rotateY(360deg) scale(1);
  
}
 .doiNgu .contentImg, .doiNgu .slideDoiNgu {
  flex: 0 0 50%;
}.imgDoiNgu {
  position: relative;
  width: 525px;
  height: 438px;
  margin: 0 auto;
}

.imgDoiNgu-rotate-90:before {
	transform: rotate(90deg)
}

.imgDoiNgu .imgSlide1 {
	width: 300px;
	height: 210px;
	left: 0;
	top: 125px
}

.imgDoiNgu .imgSlide2 {
	width: 151px;
	height: 105px;
	left: 222px;
	top: 0
}

.imgDoiNgu .imgSlide3 {
	width: 136px;
	height: 95px;
	top: 145px;
	left: 364px
}

.imgDoiNgu .imgSlide4 {
	width: 134px;
	height: 94px;
	left: 391px;
	top: 276px
}

.imgDoiNgu .imgSlide5 {
	width: 120px;
	height: 84px;
	top: 354px;
	left: 224px
}

.imgTeamSp {
	display: none
}

.imgTeamSp .slick__arrow {
	color: #fff
}


@media (max-width:575.98px) {

	

	.mAboutUs {
		height: auto;
		padding-bottom: 130px
	}

	.mAboutUs .mLogo img {
		width: 132px;
		height: 122px
	}

	

	.doiNgu .contentImg {
		margin-bottom: 60px
	}

	.arrowControl {
		padding-top: 0
	}

	.doiNgu .content {
		padding: 0
	}

	.doiNgu .contentImg .mTitle {
		text-align: center
	}

	.mDoiNgu .mTitle,
	.textDoiNgu {
		text-align: justify
	}

	.imgTeamSp {
		margin-top:30px; display: block; 
	}
	.teamPc{display:none}
	.imgTeamSp .mTitle {
		text-align: center;
		font-size: 66px;
		line-height: normal
	}

	.imgTeamSp .imgSlide img {
		width: 100%
	}

	.imgTeamSp .textDoiNgu {
		margin-bottom: 30px
	}

	.imgSlideSp {
		margin-bottom: 55px
	}

	.imgTeamPc {
		display: none !important
	}

	.mDoiNgu .nextPage {
		position: absolute
	}

	.imgTeamSp .imgSlide img {
		filter: blur(8px)
	}

	.imgTeamSp .slick-active.imgSlide img {
		filter: blur(0)
	}

	.imgTeamSp .slick__arrow {
		font-size: 28px;
		padding: 0;
		margin: 0
	}

	.imgTeamSp .slick__arrow.slick__prev {
		left: 5px
	}

	.imgTeamSp .slick__arrow.slick__next {
		right: 5px
	}

	

	.slider-inner {
		width: 100% !important;
		height: 100% !important
	}

	.slider-origin {
		margin-top: 130px !important
	}

	.slider-item.active {
		left: -125%;
		width: 200px;
		height: 146px
	}

	.slider-item {
		width: 120px;
		height: 87px;
		bottom: 45%
	}

	.imgDoiNgu {
		width: 100%;
		height: 287px
	}

	.imgDoiNgu .imgSlide {
		border-radius: 10px
	}

	.imgDoiNgu .imgSlide1 {
		width: 221px;
		height: 138px;
		top: 82px
	}

	.imgDoiNgu .imgSlide2 {
		width: 113px;
		height: 70px;
		left: 165px
	}

	.imgDoiNgu .imgSlide3 {
		width: 101px;
		height: 62px;
		top: 95px;
		right: 20px;
		left: auto
	}

	.imgDoiNgu .imgSlide4 {
		width: 100px;
		height: 61px;
		right: 0;
		bottom: 45px;
		left: auto;
		top: auto
	}

	.imgDoiNgu .imgSlide5 {
		width: 90px;
		height: 55px;
		left: 165px;
		top: 250px
	}
	.imgTeamSp .imgSlide.imgSlide-active img {
		filter: blur(0px);
	}.slick__arrowImg {
	position: absolute;
	top: calc(50% - 20px);
	color: #000;
	font-size: 40px;
	margin: 5px;
	padding: 4px 7px;
	display: inline-block;
	z-index: 1;
	cursor: pointer
}

.slick__arrowImg svg {
	color: #fff
}

.slick__prevImg {
	left: 0
}

.slick__nextImg {
	right: 0
}

.slick-dotted .slick-slider {
	margin-bottom: 30px
}

.slick-dots {
	position: absolute;
	bottom: -35px;
	display: flex !important;
	width: 100%;
	padding: 0;
	margin: 0;
	list-style: none;
	text-align: center
}

.slick-dots li {
	position: relative;
	display: inline-block;
	margin: 0 5px;
	padding: 0;
	cursor: pointer
}

.slick-dots li button {
	font-size: 0;
	display: block;
	padding: 0;
	border: 0;
	outline: none;
	width: 10px !important;
	height: 10px !important;
	border-radius: 100%;
	background: #b3b3b3
}

.slick-dots li.slick-active button,
.slick-dots li:hover button {
	background: #fff;
	box-shadow: 0 0 0 2px #fff
}

}	
svg:not(:root).svg-inline--fa,
svg:not(:host).svg-inline--fa {
	overflow: visible;
	box-sizing: content-box;
}

.slick__arrowImg svg {
	color: #fff;
}

.svg-inline--fa {
	display: var(--fa-display, inline-block);
	height: 1em;
	overflow: visible;
	vertical-align: -0.125em;
}