/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/
@font-face {
  font-family: 'SVN-Poppins';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(fonts/SVN-Poppins.ttf) format('woff2');
}
@font-face {
  font-family: 'SVN-Poppins';
  font-style: normal;
  font-weight: 100;
  font-display: swap;
  src: url(fonts/SVN-PoppinsMedium.ttf) format('woff');
}
@font-face {
  font-family: 'SVN-Poppins';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(fonts/SVN-PoppinsLight.ttf) format('woff');
}
@font-face {
  font-family: 'SVN-Poppins';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(fonts/SVN-PoppinsSemiBold.ttf) format('woff2');
}
@font-face {
  font-family: 'SVN-Poppins';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url(fonts/SVN-Poppins.ttf) format('woff');
}
@font-face {
  font-family: 'SVN-Poppins';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/SVN-PoppinsBold.ttf) format('woff');
}
@font-face {
  font-family: 'SVN-Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/SVN-PoppinsBold.ttf) format('woff');
}
@font-face {
  font-family: 'SVN-Poppins';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url(fonts/SVN-PoppinsBold.ttf) format('woff');
}
@font-face {
  font-family: 'SVN-Poppins';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(fonts/SVN-PoppinsSemiBold.ttf) format('woff2');
}


body, #masthead ul li a, h1, h2, h3, h4, h5, h6, .heading-font, .off-canvas-center .nav-sidebar.nav-vertical > li > a, li.tab.has-icon a {font-family: 'SVN-Poppins' !important;}
h1, h2, h3, h5, h6, .heading-font {
    font-weight: 800 !important;
}
/* css topbar */
.header-top {
    background-image: linear-gradient(90deg,#61c73f,#1f8538);
}
a.icon.primary.button.circle {
    background-color: #2ba91c61 !important;
    border: none;
	margin-right: 5px;
}
/* a.icon.primary.button.circle i {
	top: -1px;
} */
.html .social-icons {
	font-size: 0.85em;
}

span.email-topbar {
    position: relative;
}
span.email-topbar {
    border-right: 1px solid #e8e7e7;
    padding-right: 15px;
    margin-right: 15px;
}
span.email-topbar .fa.fa-envelope-o {
    font-family: "Font Awesome 5 Free";
    font-weight: 400;
    position: absolute;
    padding-top: 6px;
    margin-left: -24px;
}
strong.hotline-topbar {
	background: #4CAF41;
	border-radius: 16px;
	padding: 2px 16px;
	margin-left: 10px;
}
span.phone-topbar {
	background-image: url(/wp-content/uploads/2021/08/f-icon-phone.png);
	background-repeat: no-repeat;
	background-size: 12px;
	background-position: left;
	padding-left: 22px;
}

/* css header */
div#masthead {
    background-color: #fff;
}
/* div#masthead ul.header-nav.header-nav-main.nav.nav-right.nav-spacing-large.nav-uppercase a.nav-top-link {
	letter-spacing: .08em !important;
	color: #262f5a;
} */
div#masthead ul.header-nav.header-nav-main.nav.nav-right.nav-spacing-large.nav-uppercase li.menu-item a.nav-top-link {

	font-weight: 700;
}

.lienhe-menu a.nav-top-link {
    border: 2px solid #1f8538;
    border-radius: 20px;
    padding: 7px 14px;
	color: #1f8538 !important;
}
.logo-left .logo {margin-right:0;}

.lienhe-menu a.nav-top-link:hover {
    color: #fff !important;
    border: 2px solid #fff;
    background-image: linear-gradient( 
90deg
, #5fc53f, #218738);
}
.nav-dropdown {min-width: 300px;}
ul.sub-menu.nav-dropdown.nav-dropdown-default {
    border: none;
    box-shadow: 0px 0px 15px 0px rgb(0 0 0 / 10%);
    padding: 0px;
	border-top: 3px solid #1f8538;
}
ul.sub-menu.nav-dropdown.nav-dropdown-default li:hover {
    background-color: #1f8538;
}
ul.sub-menu.nav-sidebar-ul.children li:before {
    content: "-";
    padding-top: 6px;
	padding-left: 4px;
    position: absolute;
}
ul.sub-menu.nav-sidebar-ul.children {
	padding-left: 16px;
}
ul.sub-menu.nav-dropdown.nav-dropdown-default li:hover a {
    color: #fff;
	border-bottom: none;
}
.nav-dropdown-has-arrow li.has-dropdown:after {
    border-bottom-color: #fff0;
}
.nav-dropdown-has-arrow li.current-dropdown.has-dropdown:before, .nav-dropdown-has-arrow li.current-dropdown.has-dropdown:after {opacity: 0;}
ul.sub-menu.nav-dropdown.nav-dropdown-default li a {
    color: #262f5a;
    font-weight: 100;
	font-size: 15px;
}

/* css trang chủ */
.title-all h2 {text-align: center;font-size: 32px;}
.web-st-2-title h2 {font-size: 24px;}


/* css section-1 - banner */
.section-1 .text-banner p.title-banner {font-size: 20px;color: #fff;}
.section-1 .text-banner h3 {color: #F9C900;font-weight: 600;}
.section-1 .text-banner p {color: #fff;}
.section-1 .flickity-prev-next-button {width; 46px !important;}

/* css section-2 */
blockquote.wp-block-quote.st-2-title {
    border-left: none;
	padding-left: 0px;
}
blockquote.wp-block-quote.st-2-title p {
	margin-bottom: 0;
	font-size: 16px;
	font-style: initial;
	text-transform: uppercase;
	font-weight: 700;
	color: #262f5a;
}
blockquote.wp-block-quote.st-2-title h3 {
	font-size: 32px;
	font-style: initial;
}
.section-2 .icon-box-text.last-reset p {
	padding-top: 8px;
}
a.button.primary.st-2-btn {
	background-image: linear-gradient(90deg, #5fc53f, #218738);
/* 	box-shadow: 0px 15px 35px rgb(0 0 0 / 10%); */
	border: none;
}
a.button.primary.st-2-btn:hover, .section-7 button.button.is-link.is-small.mb-0:hover {
    background-image: linear-gradient(
90deg
, #218738, #5fc53f);
}
a.button.primary.st-2-btn span {
    line-height: 32px;
}

.st-2-box .icon-box-img {
	margin-bottom: 0px;
}
.st-2-box .icon-inner {
    width: 84px;
    height: 84px;
    border-radius: 50%;
    box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%);
}
.st-2-box .icon-inner img {
	padding-top: 0px;
}
.st-2-box p {
    font-size: 15px;
}


/* css section-3 */
.section-3 .box-text-3 {
    padding: 0px 8px 8px 8px;
}
.section-3 .st-3-title-box p {padding-top: 24px;}
.section-3 .box-text-3 p {
	margin-bottom: 0;
	overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
	padding-bottom: 5px;
	font-size: 15px;
}
.section-3 .st-3-box-shadow .col-inner .row {
	background-color: #fff;
}
.section-3 .st-3-box-shadow .col-inner .row:hover {
	box-shadow: 0px 15px 35px rgb(0 0 0 / 10%);
}
.section-3 .st-3-box-shadow .col-inner .row .img-inner.dark, .section-3 .st-3-box-shadow .col-inner .row {
    border-radius: 16px;
}
.text.st-3-text p {font-weight: 700;}
.section-3 i.icon-angle-right {
    background-image: linear-gradient(90deg,#61c73f,#1f8538);
    border-radius: 50%;
    color: #fff;
	width: 15px;
    height: 15px;
}
.st-3-btn-bg span {
    color: #308C3F;
}


/* css section-4 */
.st-4-title p, .st-4-title h2 {
    color: #fff;
	font-weight: 700;
}
.section-4 .st-4-box .icon-box-img .icon {
    background: #fff;
    padding: 10px;
    border-radius: 50%;
    box-shadow: 0 5px 62px 0 rgb(2 55 102 / 19%);
}
.section-4 .st-4-box .icon-box-img .icon img {
	padding-top: 0px;
}
.st-4-box-text h3 {
	margin-bottom: -8px;
	display: inline-flex;
}
.st-4-box-text h3 span.count-up {
    font-size: 40px;
    margin-bottom: -8px;
    color: #fff400;
    font-weight: 800;
}
.section-4 .icon-box-left .icon-box-img+.icon-box-text {
    padding-left: 1.8em;
}
.section-4 .st-4-box p {
    color: #fff;
    font-size: 18px;
}
span.daucong {
    color: #fff400;
    font-size: 36px;
    margin-top: -6px;
}


/* row-4 section-logo */
.section-logo {
    margin-top: -140px;
}
.section-logo .st-4-row-logo {
	background: #fff;
    box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%);
    border-radius: 16px;
}
.st-4-row-logo-row {
	padding: 50px !important;
}
.section-logo .st-4-row-logo .col-inner .img-inner.dark {
    box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%);
    border-radius: 10px;
    padding: 20px;
	width: 100%;
    height: 80px;
	line-height: 30px;
}
.st-logo-title h2{
	text-transform: uppercase;
    font-size: 24px;
    font-weight: 600;
	text-align: center;
}



/* css setion-5 */
.section-5 .st-5-title {
	text-align: center;
}
.st-5-title p {
	font-size: 18px;
	text-transform: uppercase;
	margin-bottom: 8px;
	font-weight: 700;
}
.st-5-text-banner, .st-5-text-banner .bg.fill.bg-fill.bg-loaded, .st-5-text-banner .banner-layers.container .fill.banner-link {
    border-radius: 20px;
}
.section-5 .st-5-text-banner p.uppercase b {
    font-size: 14px;
    background: rgba( 255, 255, 255, 0.25 );
    backdrop-filter: blur( 4px );
    border-radius: 50px;
    border: 1px solid rgba( 255, 255, 255, 0.18 );
    padding: 2px 10px;
	font-weight: 500;
}
.st-5-text-banner:hover .st-5-text-left {
    transform: translateX(8px);
    transition: 0.8s;
/*     box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%); */
}
.section-5 .st-5-text-banner h4 {
	font-size: 18px;
	font-weight: 200;
}
.section-5 .st-5-text-banner .fill.banner-link {
	background-image: linear-gradient(to top, #0000007a , #00000000);
}
.section-5 p.uppercase b {
    color: #fff;
}
p.showhover {
    position: absolute;
    width: 50px;
    height: 50px;
    line-height: 48px;
    right: 25px;
    bottom: 10px;
    color: #fff;
    background: rgba( 255, 255, 255, 0.40 );
    backdrop-filter: blur( 6.5px );
    border-radius: 50%;
    border: 1px solid rgba( 255, 255, 255, 0.18 );
    font-size: 24px;
    text-align: center;
}

p.showhover, .section-5 p.from_the_blog_excerpt {
    display: none;
}

.section-5 .col-inner a:hover p.showhover {
    display: block;
}
/* // dự án show bài viết mới */
.section-5 .image-cover {
    border-radius: 16px;
}
.section-5 p.cat-label.is-xxsmall.op-7.uppercase {
    font-size: 14px;
    background: rgba( 255, 255, 255, 0.25 );
    backdrop-filter: blur( 4px );
    border-radius: 50px;
    border: 1px solid rgba( 255, 255, 255, 0.18 );
    padding: 2px 8px;
    font-weight: 700;
    color: #fff;
}
.section-5  .overlay {
    background-image: linear-gradient(to top, #0000007a , #00000000) !important;
}
.section-5 h5.post-title.is-large {
    font-size: 18px;
    padding-top: 6px;
	width: 82%;
}
.section-5 .col-inner a:hover .box-text.text-left {
    transform: translateX(14px);
    transition: 0.8s;
/*     box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%); */
}


/* css section-6 */
.section-6 .st-6-col .col-inner {
	background-color: #fff;
	border-radius: 13px;
	padding: 18px;
}
.section-6 .st-6-text p {
	border-bottom: 1px solid #e6eae6;
	padding-bottom: 16px;
}
.st-6-text p {
    background-image: url(https://jptmedia.com/wp-content/uploads/2021/08/section-3-icon-title.png);
    background-repeat: no-repeat;
    background-size: 30px;
    background-position: left top;
    padding-left: 37px;
}
.section-6 .st-6-col .st-6-icon-box h3 {
	margin-bottom: 0;
	font-size: 16px;
}
.section-6 .st-6-col .st-6-icon-box p {
	font-size: 16px;
}


/* css section-7 */
.section-7 {background-color: #f9f9f9;}
.section-7 .st-blog .box-text .button {
    margin-top: 1em;
    float: right;
    font-weight: 600;
    background-image: url(/wp-content/uploads/2021/08/btn-blog.png);
    background-repeat: no-repeat;
    background-size: 13px;
    background-position: right;
    padding-right: 18px;
    font-style: italic;
    text-transform: inherit;
}
.section-7 .col.post-item .col-inner {
    background-color: #fff;
}
.section-7 .col.post-item.is-selected .col-inner, .section-7 .col.post-item.is-selected .col-inner .image-cover {
	border-radius: 16px;
}
.section-7 .col.post-item.is-selected .col-inner:hover {
    box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%);
}
.section-7 .box-text.text-left {
    padding: 10px 15px;
}
.badge-frame .badge-inner, .badge-outline .badge-inner {
	color: #ecb519 !important;
}
.has-hover:hover .badge-outline .badge-inner {
	border-color: #ecb519 !important;
	background-color: #fff !important;
	
}

.section-7 .box-text-inner.blog-post-inner {
    padding: 8px 0;
}
.section-7 .box-text-inner.blog-post-inner h5, .section-7 .box-text-inner.blog-post-inner p {
	line-height: 28px; 
}
.section-7 li.dot.is-selected {
    background-color: #308c3fad !important;
}
.section-7 button.button.is-link.is-small.mb-0 {
    background-image: linear-gradient( 
90deg
 , #5fc53f, #218738);
/*     box-shadow: 0px 15px 35px rgb(0 0 0 / 10%); */
    border: none;
    color: #fff;
    border-radius: 20px;
    padding: 0 15px;
}
.section-7 path.arrow {
    color: #fff;
}
.section-7 svg.flickity-button-icon {
    background-image: linear-gradient( 
90deg
 ,#61c73f,#1f8538);
    border: none !important;
}

button.flickity-button.flickity-prev-next-button.next, button.flickity-button.flickity-prev-next-button.previous {
    opacity: 1 !important;
}



/* css section-footer */
.section-footer .mota p, .section-footer h3, .section-footer li, .section-footer a {
	color: #fff;
}
.section-footer .mota p, .section-footer li, .section-footer a {
	font-size: 14px
}
a#top-link {
    background-image: linear-gradient(
90deg
,#61c73f,#1f8538);
    border: none;
    color: #fff;
    height: 46px;
}
svg.flickity-button-icon {
    background-image: linear-gradient(
90deg
,#61c73f,#1f8538);
    border: none;
}

svg.flickity-button-icon:hover {
    border: none;
}
button.flickity-button.flickity-prev-next-button.next:hover svg {
    border: none;
}



.section-footer h3 {font-weight: 600;}
.section-footer li {list-style: none;margin-left: 0 !important;}
.section-footer .f-li-icon-1 {background-image: url('/wp-content/uploads/2021/08/f-icon-map-1.png');}
.section-footer .f-li-icon-2 {background-image: url('/wp-content/uploads/2021/08/f-icon-phone.png');}
.section-footer .f-li-icon-3 {background-image: url('/wp-content/uploads/2021/08/f-icon-mail.png');}
.section-footer .f-li-icon-4 {background-image: url('/wp-content/uploads/2021/08/f-icon-website.png');}
.section-footer ul.icon-li li {
	background-repeat: no-repeat;
	background-size: 12px;
	background-position: left; 
	padding-left: 20px
}
.dkynhantin input.wpcf7-form-control.wpcf7-text.wpcf7-email.wpcf7-validates-as-required.wpcf7-validates-as-email {
    background: #ffffff00;
    border: none;
    border-bottom: 1px solid #fff;
    box-shadow: none;
}
.dkynhantin input.wpcf7-form-control.wpcf7-text.wpcf7-email.wpcf7-validates-as-required.wpcf7-validates-as-email::placeholder {
	color: #fff;
}
.dkynhantin input.wpcf7-form-control.wpcf7-submit {
    background-image: -webkit-linear-gradient( 0deg,#27b62c 8%,#6cc916 89%);
    padding: 0 30px;
    border-radius: 30px;
}

/* css thay đổi bàn tay khi đi chuột slider */
.flickity-enabled.is-draggable .flickity-viewport {cursor: copy;}
.slider-nav-light .flickity-page-dots .dot {
    border-color: #308c3fad;
    border-radius: 6px;
}

/* css form on footer */
.section-on-footer {
    margin-bottom: -119px;
	z-index: 9;
}
.section-on-footer .row-on-footer {
    background-image: linear-gradient( 
138deg
, #1f8538 30%, #61c73f 100%);
    border-radius: 30px;
	box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%);
}
.section-on-footer .col-on-footer {
    background-image: url(https://jptmedia.com/wp-content/uploads/2021/08/home-3_05.png);
    background-position: bottom right;
    background-repeat: no-repeat;
    transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
    border-bottom-right-radius: 30px;
    border-top-right-radius: 30px;
}
.formonfooter input.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required {
    height: 60px;
    border-radius: 30px;
    width: 532px;
    position: relative;
    float: left;
}
.section-on-footer h2 {
    font-size: 36px;
	margin-bottom: 0;
}
.section-on-footer h4 {
    font-weight: 100;
    line-height: 40px;
    font-size: 20px;
}
.formonfooter input.wpcf7-form-control.wpcf7-submit {
    background-image: -webkit-linear-gradient(
0deg
,#27b62c 8%,#6cc916 89%);
    box-shadow: 0 0 40px 0 rgb(18 160 105 / 22%);
    height: 60px;
    font-size: 20px;
    padding: 0 30px;
    border: 3px solid #fff;
    border-radius: 30px;
}
a#top-link {
    z-index: 999;
}

/* css ẩn footer cuối cùng */
.absolute-footer.dark.medium-text-center.small-text-center {
    display: none;
}


/* css trang về chúng tôi - giới thiệu */
.section-gioithieu .col-box .col-inner {
    box-shadow: 0px 15px 35px rgb(0 0 0 / 10%);
    padding: 15px 0;
    border-radius: 16px;
}
.section-gioithieu .img-inner.image-cover.dark {
    box-shadow: 0px 15px 35px rgb(0 0 0 / 10%);
   
    border-radius: 16px;
}

.section-gioithieu .col-hoso .col-inner {
	background-image: linear-gradient(to right, #319641 , #4caf41d9);
}
.section-gioithieu .col-hoso .col-inner h3 {
	color: #fff;
}

/* css quy trình lĩnh vực */
.linhvuc-quytrinh:before {
    content: "";
    width: 43%;
    height: 1px;
    background: linear-gradient(to right,#b7b7b7 40%,rgba(255,255,255,0) 0%);
    background-position: top;
    background-size: 10px 1px;
    background-repeat: repeat-x;
    position: absolute;
    top: 46%;
    left: 82%;
}

.linhvuc-quytrinh:after {
    content: "\f054";
    font-family: 'FontAwesome';
    width: 41px;
    height: 41px;
    border: 1px solid #dbdbdb;
    border-radius: 50%;
    display: block;
    color: #dbdbdb;
    line-height: 37px;
    position: absolute;
    left: 100%;
    top: 46%;
    transform: translateX(-10px) translateY(-50%);
    background: #fff;
}
.linhvuc-quytrinh-1:last-child:before, .linhvuc-quytrinh-1:last-child:after {
    content: none;
}



/* css sectioon-3-gioithieu */
.st-3-col-gioithieu .col-inner {
    box-shadow: 0px 15px 35px rgb(0 0 0 / 10%);
	padding: 16px 0;
	border-radius: 15px;
}
.st-3-col-gioithieu .col-inner blockquote.wp-block-quote.st-gioithieu-title {
	font-weight: 700;
    font-style: initial;
    padding-left: 12px;
    border-left: 3px solid #61C63F;
    font-size: 25px;
    color: #262f5a;
}
p.st-text-gioithieu {padding: 0px 20px;}
.st-3-col-2-gioithieu .col-inner {
    background-color: #308C3F;
}
.st-3-col-2-gioithieu .col-inner p {
    color: #fff;
}

/* css trang dự án */
.tab-duan ul li a span {
    border: 1px solid #dedede;
    border-radius: 4px;
    font-size: 14px;
    padding: 4px 6px;
    font-weight: 500;
	text-transform: uppercase;
	color: #262f5a;
}
.tab-duan ul li a {
    padding: 5px 0;
}
.tab-duan ul li a:hover span {
    color: #308C3F;
}

/* css trang tầm nhìn và sứ mệnh */
.sumenh-dichvu ul li {
    list-style: none;
    font-size: 15px;
    position: relative;
    padding-left: 20px;
}

.sumenh-dichvu ul li:before {
    content: '';
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #faa61a;
    position: absolute;
    top: 9px;
    left: 0;
}

.sumenh-dichvu p strong {
    font-size: 15px;
   
}

.histories{
    width:820px;max-width:100%;margin:auto
}
.histories .wrap_icon a{
    display:inline-block;
    width:20px;
    height:20px;
    border-radius:50%;
    white-space:nowrap;
    position:relative;
    margin-top:-10px;
    vertical-align:top;
    outline:0
}
    .histories .wrap_icon a:after,.histories .wrap_icon a:before{
    content:'';
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
    border-radius:50%;
    border-width:1px;
    border-style:solid;
    border-color:transparent transparent #969696 #969696;
    -webkit-transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);
    transform:rotate(-45deg);
    background:#f5f5f5
    }
.histories .wrap_icon a:after{
    -webkit-transform:scale(.5);
    -ms-transform:scale(.5);
    transform:scale(.5);
    border:none;
    background:#fdc313
    }
.histories .wrap_icon a span{
    display:block
    }
.histories .wrap_icon a .icon{
    position:absolute;
    bottom:35px;
    width:80px;
    height:80px;
    border-radius:50%;
    background:#fff;
    box-shadow:0 0 15px rgba(0,0,0,.15);
    left:50%;
    margin-left:-40px;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    padding:5px;
    transition:.3s all
    }
.histories .wrap_icon a .icon:after{
    content:'';
    width:8px;
    height:8px;
    background:#fdc313;
    bottom:-4px;
    left:50%;
    margin-left:-4px;
    border-radius:50%;
    position:absolute
    }
.histories .wrap_icon a .icon:before{
    content:'';
    height:30px;
    width:1px;
    top:100%;
    background:#969696;
    left:50%;
    position:absolute;
    transition:.3s all
    }
.histories .wrap_icon a .icon img{
    margin:auto
    }
.histories .wrap_icon a .wrap_text{
    top:45px;
    text-align:center;
    font-weight:600;
    color:#666;
    left:50%;
    -webkit-transform:translateX(-50%);
    -ms-transform:translateX(-50%);
    transform:translateX(-50%);
    position:absolute
    }
.histories .wrap_icon a .wrap_text .title{
    font-size:18px;
    text-transform:uppercase;
    font-weight:700;
    }
.histories .wrap_icon a:hover .icon{
    bottom:60px
    }
.histories .wrap_icon a:hover .icon:before{
    height:55px
    }
.histories .tab_nav{
    display:block;
    position:relative;
    height:1px;
    background:#969696;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    margin:150px 0
    }
.histories .tab_nav:after,.histories .tab_nav:before{
    width:8px;
    height:8px;
    position:absolute;
    content:'';
    background:#969696;
    border-radius:50%;
    top:50%;
    -webkit-transform:translateY(-50%);
    -ms-transform:translateY(-50%);
    transform:translateY(-50%)
    }
.histories .tab_nav:before{
    left:0
    }
.histories .tab_nav:after{
    right:0
    }
.histories .tab_nav li{
    list-style:none;
    -webkit-flex:0 0 10%;
    -ms-flex:0 0 10%;
    flex:0 0 10%;
    -webkit-flex-grow:1;
    -ms-flex-positive:1;
    flex-grow:1;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex
    }
.histories .tab_nav li .wrap_icon{
    margin-left:auto;
    margin-right:auto
    }
.histories .tab_nav li:first-child .wrap_icon{
    margin-left:30px
    }
.histories .tab_nav li:last-child .wrap_icon{
    margin-right:30px
    }
.histories .tab_nav li.ui-tabs-active a .icon{
    bottom:60px
    }
.histories .tab_nav li.ui-tabs-active a .icon:before{
    height:55px
    }
.histories .tab_nav li.ui-tabs-active a:after{
    -webkit-transform:scale(1);
    -ms-transform:scale(1);
    transform:scale(1)
    }
.histories .tab_nav li.ui-tabs-active a .wrap_text{
    color:#fdc313
    }
.histories .tab_nav li.ui-tabs-active a .wrap_text .title{
    color:#fdc313
    }
.histories .tabpanel{
    text-align:center;
    color:#666
    }
.histories .tabpanel .wrap_icon{
    display:none
}
/* mobile cũ*/
.main-timeline {
    padding-top: 20px;
}

    .main-timeline:after {
        content: '';
        display: block;
        clear: both;
    }

    .main-timeline:before {
        content: '';
        background-color: #e3e3e3;
        height: 100%;
        width: 5px;
        transform: translateX(-50%);
        position: absolute;
        top: 40px;
        left: 50%;
    }

    .main-timeline .timeline {
        width: 50%;
        padding: 0 100px 0 0;
        margin: 0 10px 20px 0;
        float: left;
        position: relative;
        z-index: 1;
    }

        .main-timeline .timeline:before {
            content: '';
            background-color: #e3e3e3;
            height: 5px;
            width: 80px;
            position: absolute;
            right: 50px;
            top: 50px;
            z-index: -1;
        }

    .main-timeline .timeline-content {
        color: #555;
        background-color: #fff;
        text-align: center;
        padding: 0 0 10px;
        border-radius: 20px;
        display: block;
        box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%);
        -webkit-box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%);
    }

        .main-timeline .timeline-content:hover {
            text-decoration: none;
        }

    .main-timeline .timeline-year {
        color: var(--childColor);
        background: #fff;
        padding: 12px;
        font-weight: 600;
        text-align: center;
        line-height: 72px;
        height: 100px;
        width: 100px;
        border-radius: 50%;
        position: absolute;
        right: -50px;
        top: 0;
        z-index: 1;
        box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%);
        -webkit-box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%);
    }

        .main-timeline .timeline-year:before {
            content: '';
            background-color: #fff;
            height: 80%;
            width: 80%;
            border-radius: 50%;
            transform: translateX(-50%) translateY(-50%);
            position: absolute;
            left: 50%;
            top: 50%;
            z-index: -1;
            box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%);
            -webkit-box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%);
        }

}

.main-timeline .timeline-year span img {
    width: 70px;
    height: 70px;
}

.main-timeline .timeline-icon {
    color: #121365;
    font-size: 35px;
}

.main-timeline .title {
    color: #fff;
    background: var(--mainColor);
    font-size: 18px;
    font-weight: 700;
    text-transform: uppercase;
    padding: 10px;
    margin: 0 0 10px;
    border-radius: 20px 20px 0 0;
}

.main-timeline .description {
    font-size: 15px;
    margin: 0 15px;
}

.main-timeline .timeline:nth-child(even) {
    padding: 0 0 0 100px;
    margin: 0 0 20px 10px;
    float: right;
}

    .main-timeline .timeline:nth-child(even):before {
        right: auto;
        left: 50px;
    }

    .main-timeline .timeline:nth-child(even) .timeline-year {
        right: auto;
        left: -50px;
    }

    .main-timeline .timeline:nth-child(even) .timeline-icon {
        right: auto;
        left: 20px;
    }

/* mobile mới */
.tamnhin-iconbox.icon-box-left.text-left {
    display: flex;
    align-items: center;
    text-align: left;
}

.icon-box-img {
    display: flex;
    align-items: center;
    text-align: left;
}

.tamnhin-iconbox-2 {
    width: 50%;
    float: right;
    border-left: 1px solid #969696;
}

.tamnhin-iconbox-1 {
    width: 50%;
    float: left;
    border-right: 1px solid #969696;
    margin-left: 1px;
}

.col.medium-4.small-12.large-4 {
    padding-bottom: 0;
}

.tamnhin-iconbox img {
    background: #fff;
    box-shadow: 0 0 15px rgb(0 0 0 / 15%);
    border-radius: 50%;
}

.tamnhin-iconbox .icon-box-text.last-reset {
    padding-left: 0;
}

.tamnhin-iconbox {
    border-bottom: 1px solid #969696;
    padding: 40px 0px 10px 0;
}

.tamnhin-iconbox:after {
    content: '';
    width: 8px;
    height: 8px;
    background: #fdc313;
    bottom: -4px;
    left: 50%;
    margin-left: -4px;
    border-radius: 50%;
    position: absolute;
}
.tamnhin-iconbox:before {
    /* content: ''; */
    width: 8px;
    height: 8px;
    background: #fdc313;
    bottom: 0;
    margin-left: -4px;
    border-radius: 50%;
    position: absolute;
}

.tamnhin-iconbox h3 {
    margin-bottom: 0;
}
/* end mobile mới */


/* css trang giải pháp marketing tổng thể */
.section-1-linhvuc-all {
	background-image: linear-gradient(to bottom,#ffffeb 0%,#fff 100%);
}
.row.web-row .img-inner.dark {
    background: #fff;
    border-radius: 16px;
    padding: 10px;
    box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%);
}

.linhvuc-title-1 h2 {
	color: #61C63F;
	font-size: 26px;
}


.giaiphap-1 {
    background-image: linear-gradient(to left, #308C3F , #4CAF41);
}
.giaiphap-1 h2, .giaiphap-1 p {
	color: #fff;
}
.giaiphap-1 span {
	color: #4CAF41;
}
.giaiphap-icon-box {
    padding: 10px 15px;
}
.giaiphap-icon-box h3, .giaiphap-icon-box p {
	font-size: 17px;
	font-weight: 400;
}
.quytrinh-text {font-size: 16px;}




.quytrinh-web .icon-box.featured-box.icon-box-center.text-center {
    background-color: #f9f9f9;
    padding: 15px 20px;
    border-radius: 4px;
}

.quytrinh-web .icon-box.featured-box.icon-box-center.text-center p {
    text-align: left;
}

.quytrinh-web .icon-box.featured-box.icon-box-center.text-center:hover {
    margin-top: -15px;
    transition: 0.8s;
    box-shadow: 0px 15px 35px rgb(0 0 0 / 10%);
}

/* css logo nhận diện thương hiệu */
.thuonghieu-logo .row {
    background-color: #fff;
    margin-top: -160px;
    border-radius: 20px;
    padding: 20px;
}
.thuonghieu-logo .row .icon-box.featured-box.icon-box-center.text-center {
    background-color: #f9f9f9;
    padding: 20px;
}
.thuonghieu-logo .row .icon-box.featured-box.icon-box-center.text-center p {
    text-align: left;
}
.thuonghieu-logo .icon-box.featured-box.icon-box-center.text-center:hover {
    box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%);
}


/* css trang tin tức */
.tintuc-section-2 .tintuc-section-2-col-left .col.post-item .col-inner:hover {
	transform: translateY(-20px);
	transition: 0.8s;
	box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%);
}
.tintuc-section-2 .col.post-item .col-inner {
	background-color: #fff;
    border-radius: 16px;
}
.tintuc-section-2 .col.post-item .col-inner .image-cover {
	border-radius: 8px;
}
.tintuc-section-2 .col.post-item .col-inner .box-text.text-left {
	padding: 10px 15px;
}
.post-meta.is-small.op-8 {
    background-image: url(/wp-content/uploads/2021/08/icon-data-xanh-duong.png);
    background-repeat: no-repeat;
    background-size: 15px;
    padding-left: 22px;
    background-position: left;
}
.tintuc-section-2 .tintuc-section-2-col-left .box-text-inner.blog-post-inner h5, .tintuc-section-2 .box-text-inner.blog-post-inner p {
    line-height: 30px;
}


/* css trang liên hệ */
.form-lienhe input.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required, textarea.wpcf7-form-control.wpcf7-textarea {
    border: none;
    box-shadow: inset 0 0px 0px rgb(0 0 0 / 10%);
    border-bottom: 1px solid;
    padding-left: 0;
}
.form-lienhe input.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required::placeholder, textarea.wpcf7-form-control.wpcf7-textarea::placeholder {
    font-size: 13px;
    color: #000;
}
.form-lienhe input.wpcf7-form-control.wpcf7-submit {
    width: 100%;
    background-color: #55bf31;
    border-radius: 22px;
}
.lienhe-section-2 .img-inner.dark {
	border-radius: 16px;
}
.lienhe-text, .form-lienhe {
    background: #fff;
    box-shadow: 0px 15px 35px rgb(0 0 0 / 10%);
    border-radius: 16px;
    padding: 15px 20px;
}
.form-lienhe textarea {
	min-height: 2.507em;
}



/* css tag bài viết */
a.tag-cloud-link {
    border: 1px solid #308c3f;
    border-radius: 4px;
    padding: 4px 10px;
    display: inline-block;
    margin-bottom: 5px;
    font-size: 13px !important;
}


/* css chi tiết bài viết - post */
/* ẩn tên danh mục */
h6.entry-category.is-xsmall, .is-divider {display: none;}
/* css nút like và share facebook */
.entry-header-text.entry-header-text-top.text-left {
    border-bottom: 2px solid #308c3f;
	padding-bottom: 6px;
}
.blog-wrapper.blog-single.page-wrapper .fb-like.fb_iframe_widget {
    float: right;
/* 	padding-bottom: 30px; */
}

/* css trang danh mục bài viết - page dự án */
p.cat-label.is-xxsmall.op-7.uppercase {
	font-size: 10px;padding: 5px 0;font-weight: 700;
}
.section-list-du-an .box.box-normal.box-text-bottom.box-blog-post.has-hover,.blog-wrapper.blog-archive.page-wrapper .box.box-text-bottom.box-blog-post.has-hover, .section-list-du-an .box.box-normal.box-text-bottom.box-blog-post.has-hover .box-image {
    box-shadow: 0px 15px 35px rgb(0 0 0 / 10%);
	border-radius: 16px;
}
#custom_html-5 .box.box-vertical.box-text-bottom.box-blog-post.has-hover {
    box-shadow: 0px 6px 6px rgb(0 0 0 / 10%) !important;
}
.archive .large-8.col .col.post-item .col-inner:hover {
    transform: translateY(-20px);
    transition: 0.8s;
    box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%);
}
.archive .col.post-item .col-inner .image-cover {
    border-radius: 8px;
}
.section-list-du-an .box-text-inner.blog-post-inner,.blog-wrapper.blog-archive.page-wrapper .large-8.col .box-text-inner.blog-post-inner {
    padding: 0 20px;
}
.section-list-du-an button.button.is-link.is-small.mb-0 {
    background-image: linear-gradient(to left, #308C3F , #4CAF41);color: #fff;padding: 0 20px;}

/* csss widget */

div#gallery-1, .tagcloud {
	padding-top: 12px;
}
.gallery-icon.landscape img {
    box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%);
    border-radius: 8px;
}
#custom_html-5 .col.post-item {
    padding-bottom: 10px;
}
#custom_html-5 h5.post-title.is-large {
    font-size: 14px;
    line-height: 25px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
}
span.widget-title {
    font-weight: 700;
}
.textwidget.custom-html-widget h5.post-title.is-large {
    margin-bottom: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
aside#flatsome_recent_posts-3, aside#media_gallery-3, #media_gallery-3, ul.sidebar-wrapper.ul-reset aside#flatsome_recent_posts-3, ul.sidebar-wrapper.ul-reset aside#media_gallery-3, ul.sidebar-wrapper.ul-reset aside#tag_cloud-3, aside#custom_html-5 {
	background-color: #fff;
    box-shadow: 0 5px 62px 0 rgb(2 55 102 / 9%);
    border-radius: 16px;
    padding: 15px;
}


/* css box trong page */

.text.box-page p.box-border:before {
    content: "\f054";
    font-family: 'FontAwesome';
    background-image: linear-gradient( 
90deg
 ,#61c73f,#1f8538);
    border-radius: 50%;
    color: #fff;
    font-size: 11px;
    padding: 2px 4px;
}
.text.box-page p.box-border a {
	padding-left: 6px;
}
.text.box-page {
	box-shadow: 0px 15px 35px rgb(0 0 0 / 10%);
	padding: 14px;border-radius: 10px;
	margin-bottom: 20px;
	background-color: #fff;
}

.text.box-page .box-border {
	border-bottom: 1px solid #ccc;
	padding-bottom: 10px;
	margin-bottom: 12px;
}

/* css trang chuyên mục - archive */
.archive.category div#content {
    padding-top: 0;
}

.archive.category header.archive-page-header {
    background-image: url(https://jptmedia.com/wp-content/uploads/2021/08/section-1-img-bg-1.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;
    margin-bottom: 30px;
    padding: 70px 0;
}

.archive.category .large-12.text-center.col {
    padding-bottom: 0;
}

.archive.category h1.page-title.is-large.uppercase {
    margin-bottom: 0;
    color: #fff;
    font-size: 26px;
}


@media (max-width: 1000px) and (min-width: 890px) {
/*     css text menu  */
    div#masthead a.nav-top-link {
        font-size: 13px !important;
    }
}

@media (max-width: 890px) and (min-width: 768px) {
    div#masthead a.nav-top-link {
        /*     css text menu  */
        font-size: 12px !important;
    }
}
@media (max-width: 1030px) and (min-width: 768px) {
	.section-3 .st-2-btn {font-size: 10px;padding: 0 14px;margin-right: 0;}
	.section-3 .text.st-3-text p {font-size: 14px;}
}
@media (min-width: 992px) {
/* 	css section-4 */
/* 	.st-3-button {
		padding: 3px 14px;
	} */
}
@media (max-width: 992px) and (min-width: 768px) {
/* 	css section-4 */
	.lienhe-text ul.icon-li li {
		margin-bottom: 2px;
	}
}

@media (max-width: 768px) and (min-width: 548px) {

/* 	css section-3 */
	.section-3 .st-2-btn span {font-size: 11px;text-transform: lowercase;}
	.section-3 .icon-box-text.last-reset {padding-left: 8px;}
	.section-3 .text.st-3-text p {font-size: 14px;}
	.section-3 .st-2-btn {padding: 0px 5px;margin-right: 0;}
	.section-3 .st-3-btn-bg {font-size: .7em;}
	
/* 	css section-4 */
	.section-logo {
    padding: 0 30px;
}
	
}
@media (max-width: 768px) {
/* 	css menu mobile */
	.mobile-sidebar.no-scrollbar {background-color: #308C3F;}
	.off-canvas-right .mfp-content, .off-canvas-left .mfp-content {
		width: 300px;
	}
	.off-canvas-right.dark .mfp-content, .off-canvas-left.dark .mfp-content {
		background-color: rgb(0 0 0 / 0%);
		box-shadow: 0px 0px 10px 0px rgb(0 0 0 / 0%);
	}
/* 	css topbar */
	div#top-bar .nav-center {
		justify-content: left;
	}
	#top-bar a.icon.primary.button.circle {
		font-size: 12px;
		align-items: center;
	}
	.topbar-left-mobile li.html.header-social-icons.ml-0, li.header-search.header-search-lightbox.has-icon {
    list-style: none;
    margin-bottom: 0;
}

.topbar-left-mobile, {
    width: 70%;
}

.topbar-right-mobile {
    float: right;
    right: 0;
    position: absolute;
}

.topbar-right-mobile li.header-search.header-search-lightbox.has-icon a {color: #fff}
/* 	css section-4 */
/* 	css section-2 */
	.st-2-title h3, .st-2-title p {
		text-align: center;
	}
/* 	css section-logo */
	.st-4-row-logo-row {
		padding: 20px 0px !important;
	}
	/* 	css widget thư viện ảnh */
	aside#media_gallery-3 figure.gallery-item {
		width: 50%;
	}
/* 	css chặn đường phát triển mobile */
	.main-timeline .timeline,
    .main-timeline .timeline:nth-child(even) {
        width: 100%;
        padding: 95px 0 0;
        margin: 0 0 20px;
        float: none;
    }

        .main-timeline .timeline:before {
            display: none;
        }

        .main-timeline .timeline-year,
        .main-timeline .timeline:nth-child(even) .timeline-year {
            left: 50%;
            transform: translateX(-50%);
        }
}
@media (max-width: 548px) {
/* 	.hide-mobile {display: none;} */
	.title-all h2 {font-size: 28px;}
	a.icon.primary.button.circle i {
		top: 1px;
	}
/* 	css section-4 */
/* 	css section-6  */
	.section-6 blockquote.wp-block-quote.st-2-title h3 {font-size: 24px;}
	/* 	css lĩnh vực trang thiết kế website */
	.main-timeline .title {
        font-size: 18px;
    }
	
/* 	css section-4 đối tác */
	.section-4 .st-4-box .icon-box-img .icon {
		width: 56px;
		height: 56px;
	}
	.section-4 .st-4-box-text {
		margin-top: -15px;
	}
	.section-4 .icon-box-left .icon-box-img+.icon-box-text {
		padding-left: 10px;
	}
	.section-4 .st-4-box-text h3 span.count-up {
		font-size: 26px;
	}
	.section-4 .st-4-box p { 
		font-size: 16px;
		line-height: 20px;
	}
	span.daucong {
		font-size: 26px;
	}
	.section-logo {
		padding: 0 15px;
	}
/* 	css footer */
	.section-footer a.icon.primary.button.circle {
		font-size: 12px;
	}
		.dkynhantin input.wpcf7-form-control.wpcf7-text.wpcf7-email.wpcf7-validates-as-required.wpcf7-validates-as-email::placeholder {
		font-size: 12px;
	}

/* 	css section-7 tin tức */
	.section-7 .row-slider .flickity-prev-next-button svg {
		padding: 8px !important;
		color: #fff;
	}
	.section-7 .row-slider .flickity-prev-next-button {
		width: 38px !important;
	}
/* 	css chặn đường phát triển mobbile */
	.main-timeline .title {
        font-size: 18px;
    }
	
}
@media (max-width: 375px) {
	
/* 	css section-1 */
	.section-1 .text-banner p.title-banner {font-size: 19px;}
/* 	css section-3 */
	.section-3 blockquote.wp-block-quote.st-2-title h3 {font-size: 26px;}
	.st-3-button {
    padding: 0 12px;
}
/* 	css section-4 */
	.section-4 .col-title h3 {font-size: 20px;}
	
/* 	css chạy số */
	.st-4-col-logo {
		padding: 5px;
	}
	
}
@media (max-width: 320px) {
/* 	css dự án chạy số */
	.section-4 .st-4-box-text h3 span.count-up {
		font-size: 20px;
	}
	.section-4 .st-4-box p {
		font-size: 15px;
		line-height: 20px;
	} 
	.st-4-col-logo {
		padding: 5px;
	}
	.section-logo .st-4-row-logo .col-inner .img-inner.dark {
		padding: 6px;
		line-height: 60px;
	}
}
@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/


}