/* =====================================================================
   MT DIGITAL — CSS gộp từ Code Snippets (đã bỏ plugin Code Snippets).
   Recolor bảng cũ -> Ocean Blue. Nạp qua functions.php.
   ===================================================================== */

/* ---- snippet #5: A Đông ---- */
.kehoach-tt .medium-4 .col-inner:hover {
    background: #fff !important;
}	
.xoay img {
    -webkit-animation: spin1 2s linear infinite;
    animation: spin2 12s linear infinite;
}	
@keyframes spin1 {
0%{transform:rotate(0deg)}
50%{transform:rotate(180deg)}
100%{transform:rotate(360deg)}
}
@-webkit-keyframes spin2 {
from{transform:rotate(0deg)}
to{transform:rotate(-360deg)}
}
@keyframes spin2 {
from{transform:rotate(0deg)}
to{transform:rotate(-360deg)}
}	
.taisao-tt .col-inner:hover p,	
.taisao-tt .col-inner:hover .dark h3{
color:black !important;
}

.video-button-wrapper .button.is-outline {
    border: 0;
}	
.goimail .khuyendung .pricing-table-header::before {
    position: absolute;
    content: "";
    background: url(/wp-content/uploads/2024/06/zetamail_icon10.png) no-repeat;
    width: 100px;
    height: 92px;
    top: -5px;
    left: -7px;
    z-index: 100;
}	
.goimail .khuyendung {
    margin-top: -20px;
}	
.goimail.large-3.khuyendung .title.uppercase.strong {
    background: #e3492b;
    position: relative;
}	
.goimail .large-3.khuyendung .pricing-table-wrapper {
border: 1px solid #ffafa0;
    box-shadow: 3px 3px 13px rgb(255 175 160 / 40%), -3px -3px 13px rgb(255 175 160 / 40%);
    position: relative;
}		
.goimail .khuyendung{
    flex-basis: 20%;
    max-width: 20%;
}	
.goimail .mail .large-3 {
    flex-basis: 20%;
    max-width: 20%;
}
.goimail .pricing-table .title {
    background-color: #0039e4;
    padding: 17px;
    color: #fff;
}	
.toiuu .nav.nav-vertical li:hover,	
.toiuu .nav.nav-vertical li.active {
    background-color: #edeff4 !important;
    color: black !important;
}
.toiuu .nav-vertical>li+li {
    border-top: 0;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.5);
}	
.toiuu .nav.nav-vertical li:hover a,
.toiuu .nav.nav-vertical li.active a{
    color: black !important;
}	
.toiuu .nav-vertical.nav-line>li>a:before {
    background-color: #0B57C400;
    z-index: 1;
    content: '\F05D';
    font-family: 'FontAwesome';
    color: #27d227;
    position: absolute;
    right: 31px;
    top: 0;
    font-size: 28px;
}	
.toiuu .nav-vertical {
    margin-left: 50px !important;
}	
.toiuu .nav.nav-vertical li {
    list-style: none;
    margin: 0;
    width: 100%;
    background-color: #4f67a1;
    display: block;
    text-align: center;
    padding: 6px;
    height: 60px;
    line-height: 2;
    margin-bottom: 8px !important;
    border-radius: 7px;
}
.toiuu .nav-vertical+.tab-panels {
    border-left: 1px solid #ddd;
    flex: 1;
    margin-top: 4px !important;
    padding: 15px 26px 25px;
    display: inline-block;
    vertical-align: top;
    position: relative;
    z-index: 20;
    left: 20px;
    width: 70%;
    min-width: 10px;
    text-align: left;
    background: #ffffff36;
    border-radius: 12px;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.5);
    margin-right: 35px;
}	
.taisao-tt .col-inner.box-shadow-2-hover :hover {
    background: #f9f9f900;
}	
.taisao-tt .medium-4 .col-inner:hover {
    background: #fff0b6 !important;
}	
.quytrinh-content .el-title p {
    line-height: 1;
    display: block;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    line-height: 1.5;
    font-weight: 700;
    margin-bottom: 0;
}
.quytrinh-content .el-content {
    font-size: 20px;
    margin-top: 5px !important;
}
.quytrinh-content .el-content p {
    margin-bottom: 0;
}	
.quytrinh-content .el-title div {
    font-size: 68px;
    line-height: 72px;
    font-weight: 600;	
}	
.sodo {
    background-image: url(/wp-content/uploads/2024/07/Vector-6351-aea3db68.webp);
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    background-size: 100%;
}	
.thuongmai .tmdt .col-inner {
        margin: 0 auto;
        position: relative;
     overflow: hidden;
        list-style: none;
        padding: 0;
        z-index: 1;
    }	
.thuongmai .tmdt .col-inner:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 39%;
    width: 454px;
    height: 175px;
    z-index: 2;
    top: -42px;
    left: -15px;
    background-color: #0B57C40d;
}	
.namdieu .col-inner.box-shadow-2-hover :hover {
    background: #f9f9f900;
}	
.goiweb .icon-list ul li {
    position: relative;
    padding-left: 20px;
    text-align: left;
    display: block;
    width: 100%;
}
.goiweb .icon-list ul {
}		
.goiweb .col-inner.box-shadow-2-hover :hover {
    background: #f9f9f900;
}
.goiweb .icon-list ul li:before {
    content: '\f00c' !important;
    color: #083F8F !important;
    font-size: 14px !important;
}	
.namdieu .accordion-title span {
    padding-left: 120px;
}	
.namdieu .accordion a {
    min-height: 80px;
}
.namdieu .accordion-title {
    border-top: 0;
    padding: 0;
}
.namdieu .accordion-title span:before {
    content: "";
    display: inline-block;
    width: 100px;
    height: 90px;
    background-image: url(/wp-content/uploads/2024/07/Thiet-ke-web-giao-dien-doc-quyen.webp);
    background-size: cover;
    background-repeat: no-repeat;
    position: absolute;
    left: 2px;
    margin-top: -8px;
}
.namdieu .accordion-item:nth-child(2) span:before {
    background-image: url(/wp-content/uploads/2024/07/img-lccdn3.webp);
}
.namdieu .accordion-item:nth-child(3) span:before {
    background-image: url(/wp-content/uploads/2024/07/img-lccdn4.webp);
}
.namdieu .accordion-item:nth-child(4) span:before {
    background-image: url(/wp-content/uploads/2024/07/img-lccdn5.webp);
}
.namdieu .accordion-item:nth-child(5) span:before {
    background-image: url(/wp-content/uploads/2024/07/img-lccdn7.webp);
}	
.namdieu .accordion-title.active {
    background-color: rgb(0 0 0 / 0%);
    color: #083F8F;
}	
.namdieu .accordion .toggle {
    left: unset;
    top: 10px;
    right: 0;
}	
.namdieu .accordion {
    background-color: rgb(239 242 251 / 0%);
    border: 0;
}	
.namdieu .accordion-item {
    border-top: 1px solid #ddd0;
    display: block;
    font-size: 110%;
    background: white;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.15);
    margin-bottom: 20px;
    border: 2px solid #EAEAEA;
    border-radius: 15px;
    padding: 20px 20px;
    align-items: center;
    cursor: pointer;
}	
.namdieu .large-3 {
        flex-basis: 20%;
        max-width: 20%;
    }
.namdieu .css-box-uudiem {
    min-height: 320px;
}	
.cauhoi .accordion {
    background-color: rgb(239 242 251 / 0%);
    border: 0;
}	
.section.thongke .design-item-sm {
    padding: 5px;
    border-radius: 7px;
    box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.15);
    margin-bottom: 20px;
    border: 3px solid #EAEAEA;
}	
.dark .css-title {
    font-size: 32px;
    line-height: 1.5;
    background: -webkit-linear-gradient(45deg, #ffffff, #0aff46 80%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.section.thongke .icon-box-text p strong {
    color: black;
}	
.section.thongke .col-inner.box-shadow-2-hover:hover {
    background: #00000000;
}	
.section.thongke {
    background: radial-gradient(at center center, #0B57C4 0%, #0576bd 100%);
}
.section.thongke:after {
content: '';
background: url(/wp-content/uploads/2024/07/numbers_circle_shape.png);
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50% , -50%) scale(1);
z-index: 0;
    animation: heartbeat 3s infinite alternate linear;
    width: 100%;
    height: 135%;
}@-webkit-keyframes heartbeat {
to{-webkit-transform:translate(-50% , -50%) scale(.8);transform:translate(-50% , -50%) scale(.8);}
}
@keyframes heartbeat {
to{-webkit-transform:translate(-50% , -50%) scale(.8);transform:translate(-50% , -50%) scale(.8);}
}	
/*Trang thiết kế web*/
.banggia .pricing-table .price {
    padding: .6em 5% 0 !important;
}	
.banggia .pricing-table-wrapper {
    padding-top: 16px;
}

.banggia .pricing-table .items {
    padding: 10px 4%;
    float: left;
    margin-left: 0;
    height: 750px;
}
.banggia .pricing-table .items>div {
    position: relative;
    font-size: 14px !important;
    border-bottom: 1px #e6e6e6 dashed;
    margin: 0;
    padding: 5px;
    width: 100%;
    float: left;
}
.banggia .pricing-table .items>div:hover {
    background-color: #b8b8b861;
}
.banggia .items>div:before {
    content: '\f00c';
    font-family: 'FontAwesome';
    margin-right: 10px;
    font-size: 89%;
    color: #42c63d;
    border: 1px solid;
    border-radius: 100%;
    padding: 2px 3px;
}
.banggia .text-center {
text-align: left;
}
.banggia .description.is-small {
    text-decoration-line: line-through;
    margin-top: -20px;
    padding-bottom: 20px;
}
.basic {
    border-color: #0039e4;
}
.banggia .price,
.banggia .description{
text-align: center;
    color: #fff;	
}
.banggia .pricing-table-header, .banggia .title.uppercase.strong {
    text-align: center;
    border-bottom: 2px solid #ffffff4f;
    font-size: 20px;
    background-color: #ff000000;
}
.basic .pricing-table-header,
.basic .title.uppercase.strong {
    background-color: #0039e4;
}
.banggia .text:before {
display:none;
}
.banggia .qua ul li{
	list-style:none;
}
.banggia .qua ul li:before {
    content: '\f06b';
    font-family: 'FontAwesome';
    margin-right: 10px;
    color: red;
    border-radius: 100%;
	    margin-left: -16px;
}

.pro .pricing-table-header {
    background: #00cb2d;
    background: radial-gradient(circle, rgb(0 203 45) 0%, #4fba69b3 100%);
}
.plus .pricing-table-header {
background: #ff6b01;
background: linear-gradient(to right, #ff6b01; 0%, #ff6b01; 100%) !important;
}
.plus {
    border-color: #ff6b01 !important;
}

.banggia .pro {
    border: 2px solid #00cb2d;
}
.banggia .col-inner{
overflow: hidden;
}
.banggia .pricing-hightlight-tag {
position: absolute;
    top: 14px;
    right: -30px;
    z-index: 1;
padding: 14px 40px 0px 70px;
    font-weight: 700;
    font-size: 12px;
    color: #fff;
line-height: 10px;
transform: rotate(35deg);
backface-visibility: hidden;
background-color: transparent !important;
box-shadow: 0 0 19px rgb(0 0 0 / 15%);
background-image: linear-gradient(to right,#e60808,#ed8a01);
}

.enter {
border-color: #0679cf;}
.banggia .price,
.banggia .description{
text-align: center;
    color: #fff;	
}
.enter .pricing-table-header,
.enter .title.uppercase.strong {
    background-color: #0679cf;
color: white;	
}
.banggia .eco .description.is-small,
.banggia .exe .description.is-small,
.banggia .enter .description.is-small {
    text-decoration-line: unset;
    font-style: italic;	
}
.eco .pricing-table-header {
background: #ff6b01;
}
.eco {
    border-color: #ff6b01 !important;
}
.exe .pricing-table-header {
background: #41bbb8;
}
.exe {
border-color: #41bbb8 !important;
}
.banggia .enter .items,
.banggia .exe .items,
.banggia .eco .items {
    padding: 10px 4%;
    float: left;
    margin-left: 0;
    height: 815px;
}
.tabgia .nav-pills .tab a {
    padding: 5px 50px;
    background-color: #ebebeb;
}
.tabgia {
    display: flex;
    justify-content: center;
}
.tabgia .nav {
    background-color: #ebebeb;
    border-radius: 99px;
    width: auto;	
}
.tabgia .nav-pills .tab.active a {
background: linear-gradient(to right, #1684bf 0%, #41bbb8 100%) !important;
}
.tabgia .nav-pills .tab a span {
    font-size: 16px;
    font-weight: 500 !important;
}

/*Quy trình*/
.section-step .row > .col p i {
    display: inline-block;
    width: 55px;
    height: 55px;
    text-align: center;
    line-height: 55px;
    background: #0e68c8;
    background-image: linear-gradient(92.83deg, #0e68c8 0, #478eda 100%);
    border-radius: 50%;
    position: relative;
    color: white;
    font-weight: bold;
    font-size: 25px;
    font-style: normal;
    z-index: 2;
    margin-top: 15px;
}
.section-step .row > .col1:after {
    position: absolute;
    content: '';
    height: 100%;
    width: 1px;
    background: #dddde4;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    z-index: 1;
top: 30px;	
}
.section-step .row > .cot:after {
    position: absolute;
    content: '';
    height: 180%;
    width: 1px;
    background: #dddde4;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    z-index: 1;
    top: -35%;
}
.section-step .row-collapse:hover .medium-10 h5 {
    color: #0e68c8;
}
.section-step .row-collapse:hover .cot p i,
.section-step .row-collapse:hover .col1 p i {
background-image: linear-gradient(92.83deg, #3895c8 0, #5bc1da 100%);
}
.section-step .medium-10 .col-inner {
    border: 1px solid #3333331f;
}
.section-step .medium-10 .col-inner:hover {
    border: 1px solid #02a4a5;
}

/*Câu hỏi*/
.cauhoi .accordion .toggle {
    border-radius: 999px;
    position: absolute;
    top: 0.3em;
    transform-origin: 50% 47%;
    width: 2.3em;
    box-shadow: none!important;
    color: currentColor;
    height: auto;
    line-height: 1;
    margin: 0 5px 0 0;
    opacity: .6;
    padding: 0;
    font-size: 100%;
}
.cauhoi .toggle i {
    font-size: 16px;
}
.cauhoi .accordion-item {
    box-shadow: 0 0 20px 0 rgb(0 0 0 / 8%);
    border-radius: 5px;
    margin-top: 20px;
    background-color: #fff;
}
.cauhoi .accordion-title {
	border-top: 0;}
	
.css-box-uudiem:hover {
    box-shadow: 0 10px 40px 0 rgb(20 20 20 / 20%);
}	
.css-box-uudiem {
    padding: 10px;
    box-shadow: 0 10px 40px 0 rgb(0 0 0 / 5%);
    transition: background .3s, border .3s, border-radius .3s, box-shadow .3s;
    border-radius: 10px;
    background: white;
}	
.slider-nav-light .flickity-prev-next-button .arrow, .slider-nav-light .flickity-prev-next-button svg {
    fill: #fff;
    border-radius: 99% !important;
    border: 1px solid currentColor;
    background: linear-gradient(to right, #1684bf 0%, #12ada9 100%);
    box-shadow: 0 0 20px #02a4a5;
    opacity: 1;
}	
.banggia_seo .khuyendung .pricing-table-wrapper {
    border: 2px solid #0B57C4a3;
    border-radius: 15px;
}
.banggia_seo .pricing-table-wrapper {
    padding-top: 0px;
}	
.banggia_seo .khuyendung .pricing-table .title {
	background-color: #0B57C4 !important;
	}
	.banggia_seo .pricing-table .title {
    background-color: #00cb2d !important;
    font-size: 20px !important;
    line-height: 30px !important;
}	
	.banggia_seo .pricing-table .price {
    color: #0B57C4;
    padding: 0 5% 0;
    font-weight: 600;
}	
.banggia_seo .pricing-table .items {
    padding: 10px 10%;
    float: left;
    margin-left: 0;
    height: 410px;
}	
	.banggia_seo .bullet-item:before {
    content: '\F05D' !important;
    color: #0B57C4 !important;
    left: 35px !important;
    margin-top: 0px;
    font-size: 16px !important;
}	
	.banggia_seo .pricing-table .items>div {
    text-align: left;
}	
	.banggia_seo .col-inner .pricing-table {
    border-radius: 15px;
}
.dvseo .number p {
    color: #FFBB03;
    font-size: 60px;
    font-weight: 900;
    margin-bottom: 10px;
    border-bottom: 3px solid #000;
    width: 100px;
}	
.seotongthe .col-inner.box-shadow-2-hover :hover {
    background: #0B57C400;
}	
.nav-dark .flex-right .header-nav-main .nav-top-link:hover {
    color: #fff !important;
}		
.flex-right .header-nav-main .nav-top-link:hover {
    color: #000;
}	
.header-main .has-dropdown.header-language-dropdown {
    margin-top: -8px;
}
.header-main .has-dropdown.header-language-dropdown img {
    display: none;
}
.menu-mega .col > .col-inner { 
    transition: background-color 0.3s ease;
	transition: color 0.3s ease;
}
.menu-mega .col > .col-inner:hover {
    background-color: #0039e4 !important;
}
.menu-mega .col > .col-inner:hover h3 strong{
color: #fff;
}			
.menu-mega .row.row-small {
    margin: 0 auto;
    max-width: 1400px;
}	
.dvnb .so span {
    font-size: 200%;
    content: '';
    position: absolute;
    border-radius: 50%;
    background: #e3eaff;
    width: 50px;
    height: 50px;
     top: 10px;
    left: -41px;
    z-index: 1;
    animation: move 3s infinite alternate ease-in-out;
    padding-left: 5px;
    color: blue;
}		
.marketing .dichvu .icon-box-img::before {
    background: #0B57C43b;
}	
.marketing .dichvu .col-inner {
    min-height: 250px;
}
.marketing .icon-box-img img{
    padding-top: .2em;
    width: 100%;
    min-height: 180px;
    object-fit: cover;
}	
.wpcf7 .table {
    display: table;
    width: 100%;
}	
.Booking .elementskit-infobox .col-inner .text p {
    margin-bottom: 25px;
}	
.Booking .elementskit-infobox .col-inner {
    background-color: #FFFFFF0F;
    padding: 20px 20px 20px 20px;
    border-radius: 5px 5px 5px 5px;
    min-height:200px;
}	
.Booking .elementskit-infobox:hover .col-inner{
    background-color: transparent;
    background-image: linear-gradient(180deg, #febd25 0%, #FFE6AC 100%);
}
.Booking .elementskit-infobox:hover .icon-box-text p i,	
.Booking .elementskit-infobox:hover .icon-box-text .text h3 span,
.Booking .elementskit-infobox:hover .icon-box-text .text p{
color: #120b5c !important;
}	
.gioithieu-truyenthong .box-image {
    position: relative;
}

.gioithieu-truyenthong .box-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
}
.gioithieu-truyenthong .box-text h3{
opacity:1;	
}
.gioithieu-truyenthong .show-on-hover h3{
opacity:0;
}	
.gioithieu-truyenthong .show-on-hover {
    width: 100%;
    height: 100%;
    padding: 22% 0;
    background-color: #0B57C4;
    color: black;	
}
.gioithieu-truyenthong .box-image:hover img {
    transform: rotateY(180deg);
}	
.khoanhkhac .banner .banner-layers.container {
    width: 100% !important;
    height: 100% !important;
    padding: 10%;
    transition: background-color 0.5s;
}

.khoanhkhac .banner:hover .banner-layers.container{
    background-color: #0039e491;
}
.khoanhkhac .banner:hover .res-text {
  opacity: 1;
}	
.khoanhkhac .banner .res-text {
  opacity: 0;
 transition: opacity 0.5s;	
}	
.gioithieu-truyenthong .slider-nav-light .flickity-prev-next-button .arrow, 
.gioithieu-truyenthong .slider-nav-light .flickity-prev-next-button svg {
    fill: #ffffff;
    background-color: #0B57C4;
}	
.gioithieu-truyenthong .slider-nav-light .flickity-prev-next-button {
    position: absolute;
    bottom: -40% ;
}	
.gioithieu-truyenthong .flickity-prev-next-button.previous {
    left: unset !important;
    margin-right: 56px;
    right: 0;
    opacity: 1 !important;
}	
.teamseo 	
.list ul li {
    list-style: none;
}	
.Paq .accordion {
    color: #21409a;
    background-color: #ffffff;
}	
.Paq .accordion  .toggle {
    opacity: 1;
    font-size: 87%;
    left: auto;
    right: 0;
}	
.Paq .accordion .active .toggle {
    color: #0B57C4;
}
.Paq .active .icon-angle-down:before {
    content: '\f068';
}	
.Paq .icon-angle-down:before {
    content: '\f067';
    font-family: 'FontAwesome';
}	
.Paq .accordion-title.active {
    border-color: #ff000000;
}	
.quytrinh .box-badge .box-text {
    bottom: 10%;
    padding: .8em 11px 1em;
    background-color: #ff000000;
}
.quytrinh .box-badge:hover .box-text,
.quytrinh .box-badge:hover p {
    color: black;
}
.quytrinh .uk-padding h3 {
    font-size: 26px;
    color: black;
}	
.quytrinh .col-inner {
    filter: drop-shadow(4px 10px 18px rgba(0, 0, 0, 0.15));
}		
.quytrinh .uk-padding {
    padding: 25px 0px 0;
}	
.visao .lienhe2 .col-inner:hover {
    box-shadow: 3px 4px 8px #0039e4 !important;
}	
.visao .lienhe2 .col-inner {
    box-shadow: 0px 0px 8px #0039e4 !important;
}
.visao .dichvu .row .col-inner {
    border-radius: 12px;
    box-shadow: 0px 0px 8px #ff420000;
}
.dichvu .nav.nav-vertical li:hover a:Before ,	
.dichvu .nav.nav-vertical li.active a:Before {
    content: '\f058';
    font-family: 'FontAwesome';
    color: #57ff00;
    position: absolute;
    left: 0;
    top: 8px;
    font-size: 16px;
}	
.dichvu .siler1	.slider-wrapper .col-inner,
.visao .dichvu .col-inner {
    display: block;
    vertical-align: top;
    max-height: 380px;
    object-fit: cover;
    border-radius: 12px;
    box-shadow: 0px 0px 8px #27d227;
    object-position: top;
    width: 100%;
    overflow: hidden;
}	
.dichvu .nav.nav-vertical li:hover,	
.dichvu .nav.nav-vertical li.active {
	    background-color: #0039e4b0;
}
.dichvu .nav.nav-vertical li:hover a, .dichvu .nav.nav-vertical li.active a {
    color: #ffffff;
    padding-left: 5px;
}	
.dichvu .nav.nav-vertical li {
    background-color: #0039e42e;
    margin: 3px;
    padding: 0 0 0 15px;
    color: black;
    opacity: 1;
}
.dichvu .nav.nav-vertical li a{
    color:#334862;
}	
	
.dichvu .tab-panels {
    background-color: #ffffffa3;
}
.dichvu .nav-vertical+.tab-panels {
    padding: 20px 30px 30px;
    border-radius: 15px;
    border: 1px solid #4285f4;
    font-size: 110%;
    color: black;
    font-weight: 400;
    margin-left: 10px;
}
.dichvu .content-hinh {
    z-index: -1;
}
	
.dichvu .siler1 .flickity-slider > * {
    max-width: 50% !important;
    opacity: 1;
}	
.dichvu .siler1 .flickity-prev-next-button svg {
    fill: #fff;
    background-color: #0B57C4;
    border-radius: 7px;
    opacity: 1;
}	
.dichvu .siler1 .text {
    height: 250px;
   /* overflow: auto;*/
    border-radius: 4px 0 0 4px;
}
.dichvu .siler1 .large-12 {
        flex-basis: 96%;
        max-width: 96%;
    }	
@media only screen and (max-width: 48em) {
    .footer-wrapper .foot-bottom .large-3 {
        flex-basis: 100% !important;
        max-width: 100% !important;
        text-align: center;
        padding: 0 15px;
    }	
}	
.footer-wrapper .foot-bottom .large-3 {
        flex-basis: 20%;
        max-width: 20%;
}	
.footer-wrapper .dark .section-title-normal {
    border-color: hsl(0deg 0% 100% / 0%);
    border-left: 4px solid #0B57C4;
    line-height: 24px;
    padding-left: 15px;
}	
.footer-wrapper .section-title-normal span {
    border-color: hsl(0deg 0% 100% / 0%);
    font-size: 109%;
    text-align: left;
}	
.footer-wrapper .container.section-title-container::before	
	{
display:none;		
	}
.footer-wrapper .thongtin i {
    /* color: red; */
    padding: 16px;
    /* height: 50px; */
    background-color: var(--fs-color-primary);
    border-radius: 50%;
    /* align-items: center; */
    /* justify-content: center; */
}	
.hoidap .accordion {
    color: #044fb7;
    background-color: rgb(255 255 255 / 53%);
}	
.khachhang .banner {
    background-color: #0B57C400;
}
.hoidap .accordion {
    color: #044fb7;
    font-weight: 500;
    background-color: rgb(255 255 255 / 53%);
    border: 1px solid;
    border-radius: 10px;
}
.khachhang .banner h3 {
    line-height: 2.5;
    margin-bottom: 0;
    margin-top: 0;
}	
.rung img {
    position: relative;
    animation: fly 1s infinite alternate;
    display: table;
    margin: 0px auto;
}
@keyframes animate {
  0% {
    transform: rotateZ(0);
  }
  
  50% {
    transform: rotateZ(35deg);
  }
  
  100% {
    transform: rotateZ(0);
  }
}
@keyframes fly {
  from {
    top: 0px;
  }
  to {
    top: 10px;
  }
}	
.phuhop .icon-box {
    background-color: #2169b3ab;
    border-radius: 20px;
}	
.phuhop .icon-box h3 strong {
    font-size: 65px;
    line-height: 75px;
    color: rgb(255, 128, 0);
    font-weight: bold;
    display: 
		
		;
    width: 80%;
    text-align: center;
    margin: 0px 0px 10px 0px;
}	
.banggia .khuyendung .pricing-table-header::before {
    position: absolute;
    content: "";
    background: url(/wp-content/uploads/2024/06/zetamail_icon10.png) no-repeat;
    width: 100px;
    height: 92px;
    top: -5px;
    left: -7px;
    z-index: 100;
}
.banggia .pricing-table .description {
    padding: 10px 15px 0;
    color: black;
    font-size: 130%;
    opacity: 1;
}
.banggia .title.uppercase.strong span,	
.banggia .title.uppercase.strong {
    display: block;
    width: 100%;
}	
.banggia .khuyendung {
    margin-top: -20px;
}	
.banggia .mail .large-3.khuyendung .title.uppercase.strong {
    background: #e3492b;
    position: relative;
}	
.banggia .mail .large-3.khuyendung .pricing-table-wrapper {
border: 1px solid #ffafa0;
    box-shadow: 3px 3px 13px rgb(255 175 160 / 40%), -3px -3px 13px rgb(255 175 160 / 40%);
    position: relative;
}	
.banggia .mail .large-3 {
    flex-basis: 20%;
    max-width: 20%;
}	
.banggia .pricing-table .title {
    background-color: #044fb7;
    font-size: 18px;
    line-height: 29px;
    color: #fff;
    margin: 0px;
    text-align: center;
    font-weight: bold;
}	
.thongke span.count-up.active {
    opacity: 1;
    color: rgb(255, 128, 0);
}
.thongke .col-inner .text p {
    text-align: center;
    height: 40px;
}	
.title_header_zetamail .text ul {
    margin: 12px 0 0 0;
    color: #417bb8;
    text-transform: uppercase;
    font-size: 20px;
    line-height: 28px;
    padding: 15px 4px 11px 20px;
    border: 2px dashed #417bb8;
    border-radius: 5px;
    transform: skewX(-16deg);
    max-width: 95%;
    width: 100%;
    text-align: left;
    display: table;
    font-weight: 600;
    cursor: pointer;
}	
.title_header_zetamail .text ul li {
    list-style: none;
    margin-left: 0;
    font-size: 20px;
}	
.video-button-wrapper a {
    color: #0039e4;
}	
@keyframes pulse {
  0% {
    transform: scale(0);
    opacity: 1;
  }
  100% {
    transform: scale(1.5);
    opacity: 0;
  }
}

.button.icon.circle {
  position: relative;
}
.video .button.icon.circle::after {
    content: '';
    position: absolute;
    top: -1px;
    margin-left: -49px;
    transform: translate(-50%, -50%);
    background-color: #0B57C482;
    border-radius: 50%;
    animation: pulse 1.5s ease-out infinite;
    width: 60px;
    height: 60px;
}
.video .button.icon.circle::before {
    content: '';
    position: absolute;
    top: -5px;
    margin-left: -17px;
    transform: translate(-20%, -20%);
    width: 10px;
    height: 10px;
    background-color: rgb(255 128 0 / 42%);
    border-radius: 50%;
    animation: pulse 1.6s ease-out infinite;
    width: 70px;
    height: 70px;
}	
.line {
    margin: 21px 0px 0px 0px;
    border-style: dashed;
    border-width: 2px 0px 0px 0px;
    border-color: #3A78C94D;
}
.loich-background-overlay	{
	background-image: url(/wp-content/uploads/2024/06/img_03.png);
    background-position: top right;
    background-repeat: no-repeat;
    background-size: cover;
	opacity: 1;}
	
.toiuu {
    padding: 29px 25px 2px 25px;
    background-color: #ffffff;
    border-style: solid;
    border-width: 0px 0px 0px 3px;
    border-color: #4285f4;
    border-radius: 10px;
    box-shadow: 0px 10px 25px -10px rgba(0, 0, 0, 0.15);
    margin-bottom: 10px;
}
.hinh1 img{
    border-radius: 30px 30px 30px 30px;
	z-index:10;
}	
.hinh1 {
    margin: 0px 0px -50px 0px;
    padding: 5px 5px 5px 5px;
    border-style: dashed;
    border-width: 2px 2px 2px 2px;
    border-color: #743CDB7A;
    border-radius: 30px 30px 30px 30px;
	z-index:10;
}	
.hinh2 img {
    border-radius: 100%;
}
	.hinh3 {
	  z-index: 12;
	}
.hinh4 {
    z-index: 11;
}
.hinh4 img{
    z-index: 11;
border-style: solid;
    border-width: 12px 12px 12px 12px;
    border-color: var(--e-global-color-a29ea9b);
    border-radius: 100% 100% 100% 100%;
    box-shadow: -10px 0px 25px -5px rgba(0, 0, 0, 0.15);
}
.dichvu1 img {
    border-radius: 100px 0 0 100px;
}
.dichvu2 img {
    border-radius: 0 100px 100px 0;
}
.chuyengia .img img {
    width: 100%;
    min-width: 80px;
}
.chuyengia .img  {
    z-index: 10000;
}
.chuyengia .text i {
    background: #fff;
    color: #0039e4;
    padding: 20px;
    border-radius: 10px;
}
.baogia .img-inner img {
border-style: solid;
    border-width: 12px 12px 12px 12px;
    border-color: #fff;
    border-radius: 100% 100% 100% 100%;
    box-shadow: -10px 0px 25px -5px rgba(0, 0, 0, 0.15);
}
.baogia textarea,	
.baogia select.wpcf7-form-control.wpcf7-select.wpcf7-validates-as-required, .baogia input.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required {
    border-radius: 15px;
    font-size: 85%;
    margin-bottom: 30px;
    box-shadow: none !important;
    border: 1px solid rgba(59, 54, 140, 0.1);
    background-color: #f5efe0eb;
    padding: 8px 15px;
    height: auto;
    color: black;
    max-height: 100px;	
}
.baogia .table {
	width :100%;}
	
 .cot1 {
    display: block;
    width: 49%;
    float: left;
}
.cot2 {
    display: block;
    width: 49%;
    float: right;
}
.baogia .table {
    display: table;
    width: 100%;
}
.baogia input[type=submit] {
    background-color: #18d041;
    border-radius: 25px;
}}
.phanhoi blockquote {
    color: #333;
    font-size: 1.2em;
    font-style: italic;
    margin: 0 0 1.25em;
    padding: 1em;
    position: relative;
    border: 2px solid #85858575;
    margin-top: -30px;
}
.phanhoi blockquote h5 {
    font-size: 90%;
	}
.phanhoi img {
    border-radius: 50px 0 50px 0;
}
.phanhoi .company-quote__right {
    bottom: 25px;
    right: -10px;
    margin-top: -50px;
}
.duan .banner-inner.fill:before {

}
.duan .banner-inner.fill:hover:before {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    content: "";
    background: rgb(42 29 15);
    z-index: 100000;
    opacity: .7;
}
@media only screen and (max-width: 48em) {
    .marketing .icon-box-left .icon-box-img, .marketing .icon-box-right .icon-box-img {
        flex: 0 0 auto;
        margin-bottom: 0;
        max-width: 200px;
        width: 100% !important;
        display: block;
        margin-bottom: 60px;
        height: fit-content;
        margin: 0 auto;
    }	
.marketing .icon-box-left,
.marketing .icon-box-right {
    display: block !important;
    width: 100%;
    text-align: center !important;
}
.dvnb .duoi span {
    left: unset !important;
	right: 0 !important;
	}
.toiuu .nav-vertical {
    margin-left: 12px !important;
}	
.toiuu .nav-vertical+.tab-panels {
    left: 10px !important;
    margin-right: 12px !important;
}	
}

/* ---- snippet #6: Phước ---- */
.row-advantages .col-inner {
    box-shadow: -1px -1px 1px 1px rgba(0, 0, 0, .1);
}	
/* Fb ads */
.fb_ads_1 h2{
	font-size:42px
}
.elementor-icon-list-items{
	list-style:none;
}
.elementor-icon-list-items li{
    display: flex;
	align-items:center;
}
.elementor-icon-list-text{
    font-size: 16px;
    font-weight: 700;
	color: #232323;
    transition: color .3s;
	padding-left: 5px;
}
.uudiem-fb .box-uudiem{
	    padding: 10px;
    box-shadow: 0 10px 40px 0 rgb(0 0 0 / 5%);
    transition: background .3s, border .3s, border-radius .3s, box-shadow .3s;
    border-radius: 10px;
    background: white;
	height:100%;
}
.uudiem-fb .box-uudiem:hover {
    box-shadow: 0 10px 40px 0 rgb(20 20 20 / 20%);
}
.section-demand-banner{
	    padding-top: 50px !important;
    padding-bottom: 180px !important;
}
.section-demand-content .row {
    margin-top: -180px;
}
.section-demand-content .row .col-inner{
	    padding: 20px;
    box-shadow: 0 10px 40px 0 rgb(0 0 0 / 5%);
    transition: background .3s, border .3s, border-radius .3s, box-shadow .3s;
    border-radius: 10px;
}
.list-giupban{
	list-style:none
}
.list-lido{
box-shadow: rgb(60 64 67 / 5%) 0 1px 0px 0, rgb(60 64 67 / 10%) 0 0px 15px 0px;
    height: 100%;
    padding: 10px 10px 10px 10px ;
    border-radius: 10px;
    transition: 0.3s all;
    background: #fff;

}
.list-lido:hover{
background: #f7f7f7;
}
.list-lido h3{
	font-size:16px;
}

.heading-KH h2{
		max-width:440px;  
    margin: 0 auto;
	font-size:40px;
	line-height:42px
}
.section-danhgia .icon-box.testimonial-box.icon-box-center.text-center {
    background: #f7f7f7;
    padding: 15px;
	border-radius:10px
}
.section-numbers .icon-box .icon-inner {
    background-color: #fff;
    border-radius: 999px;
}
.section-numbers .icon-box .icon-inner img {
    padding: 10px;
}

@media (max-width: 768px) {
    .section-numbers .icon-box-left {
        align-items: center;
    }
	.section-numbers .icon-box-img {
        width: 100% !important;
        margin-bottom: 0 !important;
    }
	.section-numbers	.icon-box-img {
        text-align: center;
        max-width: unset;
        margin-bottom: 10px;
    }
	.section-numbers .icon-box .icon-inner {
        width: 55px !important;
        padding: 3px;
        margin-bottom: 5px;
        display: inline-block;
    }
	.section-numbers .icon-box-text {
        padding-left: 5px !important;
        text-align: center;
    }

}
	
/* GooGle ads */
.banner-ggads:before{
	    content: "";
    background: url(https://mtdigital.shopweb.com.vn/wp-content/uploads/2024/06/Google_Ads_logo.svg) no-repeat;
    bottom: 0;
    position: absolute;
    width: 100%;
    height: 100%;
    background-position: center bottom;
    background-size: 45%;
    opacity: 0.09;
}
.content-tiepcan{
	height:100%
}
.content-tiepcan h3{
	margin-bottom:20px
}
.tiepcan-ggads .col-inner .box{
	height:100%;
	padding:10px;
	background:#f7f7f7;
	border-radius:15px
}
.tiepcan-ggads .slider-wrapper img{
	border-radius:10px
} 
.heading-chiendich h2{
	margin-bottom:50px !important;
	max-width:500px;
	margin:auto;
}
.section-chiendich .box{
	padding: 10px;
    box-shadow: 0 10px 40px 0 rgb(0 0 0 / 50%);
    transition: background .3s, border .3s, border-radius .3s, box-shadow .3s;
    border-radius: 10px;
    background: #fff;
    height: 100%;
}
.list_box{
	list-style:none
}
.list_box li {

	text-align:left;
    position: relative;
    font-size: 14px !important;
    margin-left: 0px !important;
    border-bottom: 1px #e6e6e6 dashed;
    margin: 0;
	    padding: 5px 15px;

}
.banggia_ggads .pricing-table-items{
	padding: 0px;
}
	.banggia_ggads .pricing-table-wrapper{
		 border-radius:15px;
 border-color:var(--primary-color) !important;
		border:solid 1px var(--primary-color) !important;
	}
	.banggia_ggads  .pricing-table{
		border:none !important
	}
.banggia_ggads .pricing-table-wrapper{
	height:100%
}
.col-form > .col-inner {
    background-color: #fff;
    box-shadow: 0 0 12px #8c8c8c;
	border-radius: 15px;
    overflow: hidden;
    padding: 3px;
    margin-right: 0;
    margin-left: auto;
}
.col-form .head-form {
    font-size: 18px;
    padding: 15px;
    border-radius: 15px 15px 0 0;
	    text-align: center;
    color: rgb(255, 255, 255);
	background:var(--primary-color);
	margin-bottom:0px !important
}
.head-form p{
	margin-bottom:0px
}
.col-form form {
    padding: 15px 15px;
}
.baogia_ggads img{
	border-radius:0px !important
}
@media (min-width: 550px){
	.col-form .col-inner{
		max-width:90%;
		margin-left:auto !important;
	}
}
	
	
	
	/* Tiktok ads */
.banner-tiktokads .elementor-icon-list-items{
	max-width:450px
}
.Khachhang-tiktokads .col-left .col,
.Khachhang-tiktokads .col-left {
	padding-bottom:0px !important
}
.Khachhang-tiktokads .col-left>.col-inner{
	background:var(--primary-color);
padding: 35px 15px 60px 15px;
	border-radius:20px;
	    margin: -80px 0px -80px 0px;
}
.Khachhang-tiktokads .col-right img{
	padding:10px
}
.quytrinh-tiktokads .nav{

padding:30px 0px;	background:url(https://mtdigital.shopweb.com.vn/wp-content/uploads/2024/06/background-quy-trinh-hop-tac.png);
		background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
	border-radius:20px;
	border: 1px solid #21409a;
}
.quytrinh-tiktokads .nav li a{
	color:#fff;
	font-weight:bold;
	line-height:normal;
	font-size:14px
}
.quytrinh-tiktokads .tab-panels {
    padding: 20px 30px 30px;
    border-radius: 15px;
    border: 1px solid #4285f4;
    font-size: 110%;
    color: black;
    font-weight: 400;
    margin-left: 10px;
	background-color: #ffffffa3;
}
.quytrinh-tiktokads .nav li{
	padding:0px 30px
}
.quytrinh-tiktokads .nav li.active , .quytrinh-tiktokads .nav li:hover
{
	background:#fff;
		color:var(--primary-color)
}
.quytrinh-tiktokads .nav li.active a, .quytrinh-tiktokads .nav li:hover a{
		color:var(--primary-color)
}
.dangky-tiktokads .wpcf7{
	max-width:80%;
	    background-color: rgb(0, 0, 0);
    transform: none;
    box-shadow: none;
    border-radius: 20px;
	padding:50px 20px;
	margin:auto;
}

 .dangky-tiktokads .wpcf7-submit {
    position: relative;
    float: left;
    left: 50%;
    transform: translateX(-50%);
	 border-radius:8px;
}
 .dangky-tiktokads input.wpcf7-form-control.wpcf7-text, .dangky-tiktokads textarea{
	border-radius:8px;
}
.dangky-tiktokads .bg1{
	position:absolute;
	border-radius: 20px;
	z-index:-1;
	width: 453px;
    top: -20px;
    left: 30px;
    height: 100%;
    font-size: 16px;
    text-align: left;
	background:rgb(254, 44, 85);
}
.dangky-tiktokads .bg2{
	position:absolute;
	border-radius: 20px;
	z-index:-1;
	width: 453px;
    bottom: -20px;
    right: 30px;
    height: 100%;
    font-size: 16px;
    text-align: left;
	background:rgb(37, 244, 238);
}
.danhgia-tiktokads.dichvu .siler1 .slider-wrapper .col-inner{
	box-shadow:rgb(60 64 67 / 5%) 0 1px 0px 0, rgb(60 64 67 / 10%) 0 0px 15px 0px;;
}
.danhgia-tiktokads.dichvu .siler1 .large-12{
	padding-top:10px
}

/* SEO local*/
.lido-localseo .box{
	background:#fff;
	padding:10px 0px;
	height:100% !important;
	border-radius:12px;
	
}
.lido-localseo .box img{
	background:var(--primary-color);
	border-radius:50%
}
.thachthuc-localseo .section-bg img{
	object-fit:contain;
	    object-position: 75% 0% !important ;
    background-size: 35% !important;
}
.thachthuc-localseo .icon-box{
	border: 1px solid #CECECE;
    background: #FFF;
    box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.10);
    width: 458px;
    margin-bottom: 40px !important;
	padding:25px;
	border-radius:20px
}
.thachthuc-localseo .box-two {
	margin-left:80px
}
.heading-localseo h2{
	color:var(--primary-color);
	font-size:42px
}
@media(max-width:767px){
.lido-localseo .list-lido-localseo{
	display:grid;
	grid-template-columns: repeat(4, 70%) !important;
	        grid-template-rows: 1fr;
        overflow: auto;
        justify-content: start;
}
	.thachthuc-localseo .icon-box {
		width:100%
	}
	.thachthuc-localseo .box-two{
		margin-left:0px
	} 
}
/* SEO Mobile */
.cacbuoc-seomobile .icon-box-img{
	width:120px !important
}
.cacbuoc-seomobile .icon-inner{
	    background: linear-gradient(115deg, #FF6004, #FE9E30);
	padding: 40px;
    border-radius: 50%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    position: relative;
}
.cacbuoc-seomobile .icon-inner:after {
    border: 2px solid #FE9E30;
    animation: spinnerRotate 10s linear infinite;
    background-color: rgb(255, 255, 255);
    background: rgb(255, 255, 255);
    border-radius: 50%;
    content: "";
    height: 12px;
    position: absolute;
    top: 50%;
    left: 50%;
    transition: all 0.35s ease-in-out;
    -webkit-transition: all 0.35s ease-in-out;
    -ms-transition: all 0.35s ease-in-out;
    width: 12px;
    z-index: 1;
    margin-left: -6px;
    margin-top: -6px;
}
@keyframes spinnerRotate{
	0% {
    -webkit-transform: rotate(0deg) translateX(57px);
    transform: rotate(0deg) translateX(57px);
}
	100% {
    -webkit-transform: rotate(360deg) translateX(57px);
    transform: rotate(360deg) translateX(57px);
}
}
/* SEO Audit */
.luachon-seoaudit img,
.khinao-seoaudit img{
	border-radius:8px
}
.congcu-seoaudit .box-image img{
	object-fit:contain;
	width:200px;
}
.congcu-seoaudit .flickity-slider{
	display:flex;    
	align-items: center;
}
@media(min-width:767px){
.khinao-seoaudit .row .col-left{
	order:1
}
}

.tabs-seoaudit .tab-panels  {
	padding:20px
}
.tabs-seoaudit .tab a{
	border-radius:0px !important;
  border-color: currentColor;
	padding:5px 15px;
	margin-left:5px;
}
.tabs-seoaudit .tab.active a{
	color:#000 !important;
	background:#fff;
	border-color:#FFF;
}
/* SEO Mobile  */
.dichvu-seomobi .col-inner.box-shadow-2-hover :hover{
	background:transparent
}

.row-list .col-inner{
	    background-color: rgba(0, 73, 255, 0.087);
    padding: 30px 30px 30px 30px;
    border-radius: 10px;
    box-shadow: 0 1px 3px -2px rgba(0, 0, 0, .12), 0 1px 2px rgba(0, 0, 0, .24);
}
.list_mobiloiich{
	padding: 30px;
    box-shadow: 0px 4px 7px 0px #C9C9C9;
    border-radius: 10px;
	background:#fff;
	    margin-bottom: 30px;
}
.list_mobiloiich:hover,
.list_mobiloiich:hover h3{
	background:var(--primary-color);
	color:#FFF !important;
}

/* ---- snippet #7: Truyện (typing+font) ---- */
.sub-menu.nav-dropdown .icon-box-text p {
    color: black;
    font-size: 1.2em;
    font-weight: bold;
}
.footer-wrapper .social-icons .icon {
    background-color: #ffffff; /* Màu nền là trắng */
    color: #000000; /* Màu chữ là đen */
    border-radius: 50%!important; /* Bo tròn */
    width: 30px; /* Điều chỉnh kích thước icon nếu cần */
    height: 30px; /* Điều chỉnh kích thước icon nếu cần */
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s ease, color 0.3s ease; /* Hiệu ứng chuyển đổi màu */
}

.footer-wrapper .social-icons .icon:hover {
    background-color: #000000; /* Màu nền khi di chuột qua là đen */
    color: #ffffff; /* Màu chữ khi di chuột qua là trắng */
}

.section-title-case a {
    color: white;
}
.nav-spacing-xlarge>li {
    margin: 0 16px;
}

.hot-sv:before {
    content: 'DỊCH VỤ NỔI BẬT';
    BACKGROUND: var(--fs-color-success);
font-weight:bold;
    color: white;
    padding: 10px;
    line-height: 1;
    font-size: 13px;
    position: absolute;
    margin-top: -30px;border-radius:7px;
}
.header-main {

    border-bottom: 1px solid #eeeeee14;
}
.button span {
    display: inline-block;
    text-transform: uppercase;
    font-weight: normal;
    line-height: 1em;
}
.We_case-study-title {
    line-height: 1.2em;
}
	.menu-top-tabs ul.nav li a {
    line-height: 1em !important;
}
span.count-up {
font-weight:bold;
    line-height: 1em;
}
.we-latest-post-info {border-right: 2px solid transparent;}
.we-latest-post-info:hover {
    border-right: 5px solid blue;
}



button, .button {
    border-radius: 8px !important;
}
.nav-left {
    margin-left: 70px;
}
b, strong {
    font-weight: 700;
}
a:active, a:focus { 
 outline: none; 
 ie-dummy: expression(this.hideFocus=true);
}
li#tab-giải-pháp-tổng-thể a {
    color: black;font-weight:bold;
}
li#tab-dịch-vụ-chuyên-ngành a {font-weight:bold;
    color: blue;
}
.menu-mega .icon-box-img img {
    filter: none;
}

.menu-mega:hover .col > .col-inner:hover img {
    filter: brightness(0) invert(1);
}
	.menu-mega:hover .col > .col-inner:hover *{color:white!important}
ul.col-2 {
  display: flex;
  flex-wrap: wrap;
  list-style-type: none; 
  padding: 0; 
}

ul.col-2 li {
  width: 50%; 
  box-sizing: border-box; 
  padding: 5px 0; 
}

.truyen-slider .flickity-page-dots .dot {
  width: 30px;  
  height: 30px; 
  border-radius: 50%; 
  border: 3px solid transparent; 
  background-color: white; 
  margin: 5px; 
}

.truyen-slider  .flickity-page-dots .dot:nth-child(1) {
  border-color: #FF5733; 
background-color:#FF5733;
}

.truyen-slider .flickity-page-dots .dot:nth-child(2) {
  border-color: #33FF57; background-color:#33FF57;
}

.truyen-slider .flickity-page-dots .dot:nth-child(3) {
  border-color: #3357FF; background-color:#3357FF;
}

.truyen-slider .flickity-page-dots .dot:nth-child(4) {
  border-color: #FF33A6;background-color:#FF33A6; 
}

.truyen-slider .flickity-page-dots .dot:nth-child(5) {
  border-color: #F0FF33;background-color:#F0FF33; 
}

.truyen-slider .flickity-page-dots .dot.is-selected {
  border-width: 4px; 
}

.section-title span {
    max-width: 700px;
}
.nav-column>li>a, .nav-dropdown>li>a, .nav-vertical-fly-out>li>a, .nav>li>a {
    color: #222;
    transition: all .2s;
}
.giaiphap .icon-box:hover .icon-box-text h3 {
    color: var(--fs-color-primary); 
    transition: color 0.3s ease; 
}
    
    
  



/* .header-main {

    box-shadow: 0px 8px 24px -4px rgba(24, 39, 75, 0.08), 0px 6px 12px -6px rgba(24, 39, 75, 0.12);
} */
.header-main i.icon-menu {
    font-size: 3em !important;
    color: var(--fs-color-success);
}
.typing-container {
	text-align: center!important; 
        align-items: center;
        flex-wrap: nowrap;
}
	 .doitac img {filter: brightness(0) invert(1);}

.nav-column>li>a, .nav-dropdown>li>a {
    display: block;
    font-weight: 500;
}

.dark .nav-vertical li li.menu-item-has-children>a, .dark .nav-vertical-fly-out>li>a, .dark .nav-vertical>li>ul li a, .dark .nav>li.html, .dark .nav>li>a, .nav-dark .is-outline, .nav-dark .nav>li>a, .nav-dark .nav>li>button, .nav-dropdown.dark .nav-column>li>a, .nav-dropdown.dark>li>a {
    color: rgb(255 255 255);
}
.section-title span {
    letter-spacing: -0.8px;
}
a.button.success.is-larger.lowercase i.icon-angle-right {
    width: 30px;
    height: 30px;
    border-radius: 99px;
    border: 1px solid;
}
.icon-list ul li {

    margin: 5px 0;
}
::marker {
    color: #0039e4;
    font-size: 1em;
}
.We_entry-content ul {
    padding: 15px;
}
        .We-points {
            position: relative;
            width: 400px;
            height: 400px;
        }
        .We-points img {
            position: absolute;
        }
        .We-points .main-image {
            width: 100%;
            height: 100%;
        }
        .We-points .icon {
width:200px;
            max-width:200px;
            height: auto;
            animation: shake 3s infinite;
        }
.We-points .top-left {
    top: -100px;
    left: -80px;
}
        .We-points .top-right {
            top: -10px;
            right: -10px;
        }
        .We-points .bottom-left {
            bottom: -10px;
            left: -100px;
        }
        .We-points .bottom-right {
            bottom: -50px;
            right: -50px;
        }
        @keyframes shake {
            0%, 100% { transform: translate(0, 0); }
            25% { transform: translate(2px, -2px); }
            50% { transform: translate(-2px, 2px); }
            75% { transform: translate(2px, 2px); }
        }
        @media (max-width: 600px) {
    .We-points {
            position: relative;
            width: 100%;
            height: 400px;
        }
    .We-points .bottom-left {
            bottom: -10px;
            left: -50px;
        }
   .We-points .main-image {
            width: 100%;
            height: 100%;
max-height: 350px;
        }
        }
    


.rung img {
    z-index: 9999;
}
.giaiphap .icon-box-img {
    position: relative;
    width: 60px; 
    height: 60px; 
}

.giaiphap .icon-box-img::before {
    content: '';
    position: absolute;
    border-radius: 50%;
    background: #e3eaff;
    width: 50px;
    height: 50px;
    top: -20px;
    left: -20px;
    z-index: 1;
    animation: move 3s infinite alternate ease-in-out;
}

.giaiphap .icon-box-img::after {
    content: '';
    position: absolute;
    border-radius: 50%;
    background: rgb(198 251 197 / 30%); 
    width: 60px; 
    height: 60px; 
    top: 10px; 
    left: 10px; 
    z-index: 1; 
    animation: move 3s infinite alternate ease-in-out;
    animation-delay: 1s;
}

.giaiphap .icon-box-img .circle1 {
    content: '';
    position: absolute;
    border-radius: 50%;
    background: rgba(0, 255, 0, 0.3); 
    width: 80px; 
    height: 80px; 
    top: 5px; 
    left: 25px; 
    z-index: 1; 
    animation: move 6s infinite alternate ease-in-out;
    animation-delay: 2s;
}

.giaiphap .icon-box-img .circle2 {
    content: '';
    position: absolute;
    border-radius: 50%;
    background: rgba(0, 0, 255, 0.3); 
    width: 140px; 
    height: 140px; 
    top: -30px; 
    left: -10px; 
    z-index: 1; 
    animation: move 6s infinite alternate ease-in-out;
    animation-delay: 3s;
}

.giaiphap .icon-inner {
    position: relative;
    z-index: 2; 
}

@keyframes move {
    0% {
        transform: translate(0, 0);
    }
    100% {
        transform: translate(-10px, -10px);
    }
}




h3.We_case-study-title a {
    width: 100%;
    display: block;
    color: #21409a;
    font-weight: bold;
}
.We_case-study-cat {
    background: var(--fs-color-primary);
    padding: 5px 15px;
    color: white;
    display: inline;
    position: absolute;
    border-radius: 0 99px 99px 0;
margin:10px;
    margin-top: -50px !important;
}
.scroll-to-bullets a {
    border: 1px solid transparent;
    border-radius: 0;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, .3);
    display: block;
    height: 30px;
    margin: 20px 10px;
    transition: all .3s;
    width: 5px;
    border-radius: 0px;
}
h3.We_case-study-title a {
    width: 100%;
    display: block;
}

.case-study-menu {
    list-style: none; 
    padding: 0; 
    margin: 0; 
    display: flex; 
    justify-content: center; 

}



.case-study-menu a {
    display: block;
    text-decoration: none;
    color: #fff;
    background-color: var(--fs-color-primary);
    padding: 10px 20px;
    border-radius: 99px;
    transition: background-color 0.3s ease, color 0.3s ease;
    text-align: center;
    font-weight: bold;
}

.case-study-menu a:hover {
    background-color: var(--fs-color-secondary); 
    color: #fff; 
}


@media (max-width: 768px) {
.icon-box-text.last-reset p {
    font-size: 80%;
}
    .case-study-menu {
justify-content: flex-start; 
        overflow-x: auto; 
        -webkit-overflow-scrolling: touch; 
    }

    .case-study-menu li {
        flex: 0 0 auto; 
    }

    .case-study-menu a {
        white-space: nowrap; 
    }
.case-study-menu a {
    display: block;
    text-decoration: none;
    color: #fff;
  font-size:12px;
    border-radius: 99px;
    transition: background-color 0.3s ease, color 0.3s ease;
    text-align: center;
    font-weight: bold;
}
}
	
	
	
	.We_case-study-item {
    position: relative;
    overflow: hidden;
}

.We_case-study-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 3px; 
    background-image: linear-gradient(to right, #0B57C4, #FFBB03);
    transition: left 0.5s ease-in-out;
}

.We_case-study-item:hover::before {
    left: 0;
}

.We_case-study-item:hover .We_case-study-thumbnail {
    position: relative;
}

.We_case-study-item:hover .We_case-study-thumbnail::after {
    content: '';
    position: absolute;
    bottom: 0px;
    left: 0;
    width: 0;
    height: 3px; 
    background-image: linear-gradient(to right, #0B57C4, #FFBB03);
    animation: borderAnimation 0.5s forwards;
}

@keyframes borderAnimation {
    to {
        width: 100%;
    }
}
	
	


.section-title-center span {
    margin: 0 15px;
    font-weight: bold;
    font-size:32PX;
}
.intro-text {
    font-size: 2em;
    line-height: 1em;
}
.typing-container {
    font-size: 5.5vw;
    line-height: 1.5em;
      transition: transform 0.3s ease;
    overflow: hidden;
    text-transform: uppercase;
    font-weight: bold;
transition: all 0.5s ease; 
}

#caret {
    border-right: 1px solid #fff; 
    animation: blink-caret 0.7s step-end infinite;
}

@keyframes blink-caret {
    from, to {
        border-color: transparent;
    }
    50% {
        border-color: #fff;
    }
}
@media only screen and (max-width: 600px) {
.We_row {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: 0 auto;
    padding: 10px;
}
.typing-container {
	font-size: 13vw;text-align:center!important;
line-height: 1em;}
.typing-container {
    display: flex;
    height: 13vh!important;
align-items: center!important;

}
.section-title-center span {
    font-size: 1.2em!important;
}

.intro-text {
    font-size: 1em;
    line-height: 1em;
}
}




li.html.custom.html_topbar_left a.button.primary.lowercase.octf-btn.octf-btn-primary.octf-btn-icon {padding:10px 20px;}

 
.we-category-header h1 {
    border-left: 5px solid orangered;
    padding-left: 15px;
    text-transform: uppercase;
    line-height: 1em;
    font-weight: bold;
    font-size: 2em;
}
 .icon-list ul {
      list-style-type: none; 
      padding-left: 0;
    }

  .icon-list ul li {
      position: relative;
      padding-left: 20px; 
    }

   .icon-list ul li:before {
      content: '\F05D'; 
      font-family: 'FontAwesome';
      color: #27d227; 
      position: absolute;
      left: 0;
      top: 0;
      font-size: 18px; 
    }
.intro-text p {
    padding: 0;
    margin: 5px;
}

.header .flex-row {
    max-width: 1400px;
}
ul.header-nav .menu-item.active a.nav-top-link::after {
    content: '';
    display: block;
    width: 8px;
    height: 8px;
    background-color: #FFBB03;
    border-radius: 50%;
    vertical-align: middle;
    position: absolute;
    top: -10px;
    right: 50%;
    text-align: center;
    margin: 0 auto;
    text-shadow: 1px 3px 10px #bc7777;
}

.topuphome .icon-box-text.last-reset {
    height: 170px;overflow:hidden
}

.bg-banner-gradient {
    background-color: transparent;
    background-image: linear-gradient(178deg, #1f0098 0%, #05d7f0 100%);
}
.comments-box .icon-box-img img {
    border-radius: 99px;
    border: 5px double #ffd766;
}
a.button.primary.lowercase i.icon-angle-right {
    border: 1px solid;
    width: 24px;
    height: 24px;
    border-radius: 99px;
    line-height: 1.5em;
}
	a.button.primary.lowercase:hover{background-image: linear-gradient(80deg, #1f0098 0%, #05d7f0 100%);}

.section-title b {
    background-color: transparent;
}
.container.section-title-container {
    position: relative;
    text-align: center;
    margin-top: 20px;
}

.container.section-title-container::before {
    content: "";
    display: inline-block;
    width: 100px;
    height: 2px;
  background: linear-gradient(to right, var(--fs-color-primary), var(--fs-color-success));
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translate(-50%, -50%);
}
@font-face {
    font-family: 'SVN-Gotham';
    src: url('/wp-content/themes/agency/fonts/SVN-GothamBoldItalic.woff2') format('woff2'),
        url('/wp-content/themes/agency/fonts/SVN-GothamBoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'SVN-Gotham';
    src: url('/wp-content/themes/agency/fonts/SVN-GothamBlackItalic.woff2') format('woff2'),
        url('/wp-content/themes/agency/fonts/SVN-GothamBlackItalic.woff') format('woff');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'SVN-Gotham';
    src: url('/wp-content/themes/agency/fonts/SVN-GothamBold.woff2') format('woff2'),
        url('/wp-content/themes/agency/fonts/SVN-GothamBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'SVN-Gotham';
    src: url('/wp-content/themes/agency/fonts/SVN-GothamBlack.woff2') format('woff2'),
        url('/wp-content/themes/agency/fonts/SVN-GothamBlack.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'SVN-Gotham Book';
    src: url('/wp-content/themes/agency/fonts/SVN-GothamBook.woff2') format('woff2'),
        url('/wp-content/themes/agency/fonts/SVN-GothamBook.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'SVN-Gotham Book';
    src: url('/wp-content/themes/agency/fonts/SVN-GothamBookItalic.woff2') format('woff2'),
        url('/wp-content/themes/agency/fonts/SVN-GothamBookItalic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'SVN-Gotham';
    src: url('/wp-content/themes/agency/fonts/SVN-GothamLight.woff2') format('woff2'),
        url('/wp-content/themes/agency/fonts/SVN-GothamLight.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'SVN-Gotham';
    src: url('/wp-content/themes/agency/fonts/SVN-GothamThinItalic.woff2') format('woff2'),
        url('/wp-content/themes/agency/fonts/SVN-GothamThinItalic.woff') format('woff');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'SVN-Gotham';
    src: url('/wp-content/themes/agency/fonts/SVN-Gotham.woff2') format('woff2'),
        url('/wp-content/themes/agency/fonts/SVN-Gotham.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'SVN-Gotham';
    src: url('/wp-content/themes/agency/fonts/SVN-GothamLightItalic.woff2') format('woff2'),
        url('/wp-content/themes/agency/fonts/SVN-GothamLightItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'SVN-Gotham';
    src: url('/wp-content/themes/agency/fonts/SVN-GothamThin.woff2') format('woff2'),
        url('/wp-content/themes/agency/fonts/SVN-GothamThin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'SVN-Gotham Ultra';
    src: url('/wp-content/themes/agency/fonts/SVN-GothamUltraItalic.woff2') format('woff2'),
        url('/wp-content/themes/agency/fonts/SVN-GothamUltraItalic.woff') format('woff');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'SVN-Gotham';
    src: url('/wp-content/themes/agency/fonts/SVN-GothamItalic.woff2') format('woff2'),
        url('/wp-content/themes/agency/fonts/SVN-GothamItalic.woff') format('woff');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'SVN-Gotham Ultra';
    src: url('/wp-content/themes/agency/fonts/SVN-GothamUltra.woff2') format('woff2'),
        url('/wp-content/themes/agency/fonts/SVN-GothamUltra.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'SVN-Gotham XLight';
    src: url('/wp-content/themes/agency/fonts/SVN-GothamXLight.woff2') format('woff2'),
        url('/wp-content/themes/agency/fonts/SVN-GothamXLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'SVN-Gotham XLight';
    src: url('/wp-content/themes/agency/fonts/SVN-GothamXLightItalic.woff2') format('woff2'),
        url('/wp-content/themes/agency/fonts/SVN-GothamXLightItalic.woff') format('woff');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

body {
  font-family: 'SVN-Gotham Book', sans-serif;

    font-weight: normal;
    font-style: normal;
font-size:16px;
}

h1, h2, h3, h4, h5, h6 {
 font-family: 'SVN-Gotham', sans-serif;
    font-weight: 700;
    font-style: normal;
}
	.typing-container, #branding span {  font-family: 'SVN-Gotham', sans-serif;

    font-weight: bold;letter-spacing: -3px;}
/* .header-main .nav > li > a {
    line-height: 16px;
    font-weight: 300;margin: 0 10px;
} */




.We_case-study-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important; 
    gap: 20px !important; 

}

@media (max-width: 768px) {
    .We_case-study-grid {
        grid-template-columns: 1fr !important; 
    }
}

.We_case-study-item {
    background: #fff !important;
    overflow: hidden !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    border: 1px solid #DAEEFF;
border-radius:8px;
}

.We_case-study-item:hover {
 transform: translateY(-10px) !important;  
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2) !important; 
}

.We_case-study-thumbnail {
    position: relative !important;
    height: 250px !important;
    background-size: cover !important;
    background-position: center !important;
    border-bottom: 2px solid #eee !important; 
}

.We_case-study-thumbnail-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: none !important; 
}

.We_case-study-thumbnail-link {
    display: block !important;
}

.We_case-study-title {
 
   padding: 10px !important;

}

.We_case-study-cat {
    font-size: 14px !important;
  
}

.We_case-study-description {
    font-size: 16px !important;
    padding: 10px !important;
    color: #555 !important;
}

.We_case-study-readmore {
    padding: 20px;
}

.We_button {
    display: inline-flex !important;
    align-items: center !important;
    padding: 10px 20px !important;
    border: 1px solid #333;
}

.We_button i {
    margin-left: 8px !important;
}

.screen-reader-text {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    border: 0 !important;
}




.flex-right .header-nav-main .nav-top-link {
    position: relative;
    display: inline-block;
    text-decoration: none;
    overflow: hidden;
}

.flex-right .header-nav-main .nav-top-link::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: -100%;
    width: 100%;
    height: 2px; 
    background-color: #FFBB03!important; 
    transition: left 0.3s ease; 
}

.flex-right .header-nav-main .nav-top-link:hover {

}

.flex-right .header-nav-main .nav-top-link:hover::before {
    left: 0; 
}
	
	
	
.typing-container, #branding span {
  position: relative;
  display: inline-block;
text-align:center;
color:
}



.typing-container {

    text-transform: capitalize;
    font-weight: 600;
	color: white;
}

/* ---- snippet #8: Ngọc ---- */
.qlsc.input[type=submit], input[type=submit].button {
    background-color: #0B57C4;
    border-radius: 8px;
}
.tkw-bt.dark input[type=submit] {
    color: white;
    background: #0B57C4;
    border-radius: 8px;
}
.sc-qcytb .dark input[type=submit] {
    color: #fff;
    background: red;
	border-radius: 8px;
}
.ins1 .col-inner.dark :hover {
    background: #FFBB03;
	border-radius: 10px;
	padding: 0px 5px 5px 5px;
}
}
}
.qlsc .web-bt .primary, input[type=submit], input[type=submit].button {
    background-color: #adb3c8;
    border-radius: 5px;
    background: green;
}
.form-sm dark input[type=submit] {
    color: #c4ffc1;
}
	.sm img {
		border-radius: 10px;
	}

.col-inner.box-shadow-2-hover :hover {
    background: #f9f9f9;
}
.web-bt .primary, input[type=submit], input[type=submit].button {
    background-color: #adb3c8;
    border-radius: 5px;
}
.img-web .img .attachment-original.size-original {
    border-radius: 5px;
}
	.dong .nav-vertical.nav-line>li>a:before {
    height: 0%;
    left: auto;
    right: -2px;
    width: 3px;
    z-index: 1;
 	display: none;
}
	
.dong .nav.nav-vertical li {
    list-style: none;
    margin: 7px auto;
    width: 100%;
    background-color: #f6f6f6;
    padding-left: 6px;
    text-align: center;
    display: block;
    border-left: 5px solid #0039e4;
    border-radius: 10px;
}
	.dong .nav.nav-vertical li:hover a, .dichvu .nav.nav-vertical li.active a {
    color: white;
		padding-left: 5px;
	}
	.dong .nav.nav-vertical li:hover,	
    .dong .nav.nav-vertical li.active {
	    background-color: red;
		color: white;
		border-left: red;
}
	
	
.dong .tab-panels p {
    padding: 10px;
	font-weight:500;
}	

.dong .tab-panels {
    border: 1px solid #0039e4;
    padding-left: 10px;
    border-radius: 10px;
    margin-left: 10px;
}
	
.tabs-gioithieu.nav-size-xlarge >li > a {
    font-size: 23px;
    color: white;
    border: 1px solid blue;
    background-color: #0039e4;
    padding: 10px;
    border-radius: 15px;
}
	
.tabs-gioithieu > h4{
    font-size: 50px;
}	
	
.accordion {
    color: blue;
    font-weight: 500;
    background-color: rgb(239, 242, 251);
    border: 1px solid;
    border-radius: 10px;}

.tabs-gioithieu.tabbed-content .nav-tabs>li {
    margin: 0 .1em -1px;
    background: blue;
	border-bottom-left-radius:10px;
}
	.tabs-gioithieu.tabbed-content .nav-tabs>li a {
		color: white;
	}
	.tabs-gioithieu.tabbed-content .nav-tabs>li.active a {
		color: blue;
	}
.list-gioithieu img {
    border: 2px solid #0039e4;
    border-radius: 15px;
    /* color: blue; */
    padding: 20px;
	}
.list-gioithieu .col-inner.text-center {
    background: #f7f7f9;
    box-shadow: 1px 2px 5px 5px rgb(21 87 255 / 23%);
}

/* ---- snippet #10: Timeline ---- */
.WE_timeline {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    padding: 40px !important;
    max-width: 1200px !important;
    margin: 0 auto !important;
    position: relative !important;
  }

  .WE_timeline::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 50% !important;
    width: 2px !important;
    height: 100% !important;
    background-color: #0B57C4 !important;
    transform: translateX(-50%) !important;
    z-index: -1 !important;
  }

  .WE_timeline-column {
    flex: 1 1 calc(50% - 40px) !important;
    margin: 0 20px !important;
    display: flex !important;
    flex-direction: column !important;
    position: relative !important;
  }

  .WE_timeline-card {
    background-color: #ffffff !important;
    border: 2px solid #0B57C4 !important;
    padding: 20px !important;
    margin: 30px 0 !important; /* Tăng khoảng cách giữa các thẻ */
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15) !important;
    border-radius: 10px !important;
    position: relative !important;
    transition: all 0.4s ease-in-out !important;
    overflow: hidden !important;
  }

  .WE_timeline-card:hover {
    transform: translateY(-10px) !important;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2) !important;
    background-color: #e6f0ff !important;
  }

  .WE_timeline-card::before {
    content: '' !important;
    position: absolute !important;
    top: 20px !important;
    left: -25px !important;
    width: 15px !important;
    height: 15px !important;
    background-color: #0B57C4 !important;
    border-radius: 50% !important;
    box-shadow: 0 0 0 4px #ffffff !important;
    transition: all 0.4s ease-in-out !important;
  }

  .WE_timeline-card:hover::before {
    background-color: #0066cc !important;
    box-shadow: 0 0 0 6px #ffffff !important;
  }

  .WE_timeline-card h2 {
    margin: 0 !important;
    color: #0B57C4 !important;
    font-size: 1.2em !important;
  }

  .WE_timeline-card p {
    margin: 10px 0 0 0 !important;
    color: #333 !important;
    font-size: 0.9em !important;
  }

  .WE_icon {
    font-size: 20px !important;
    color: #0B57C4 !important;
    position: absolute !important;
    top: 20px !important;
    right: 20px !important;
  }

  @media (max-width: 768px) {
    .WE_timeline {
      padding: 10px !important;
      flex-direction: column !important;
    }

    .WE_timeline::before {
      display: none !important;
    }

    .WE_timeline-column {
      margin: 10px 0 !important;
      width: 100% !important;
    }

    .WE_timeline-card {
      margin: 15px 0 !important;
      padding: 15px !important;
      border-radius: 8px !important;
    }

    .WE_timeline-card::before {
      left: 10px !important;
      width: 10px !important;
      height: 10px !important;
    }

    .WE_icon {
      font-size: 18px !important;
    }
  }

/* ---- snippet #12: Contact Bar ---- */
:root {
        --WE-color-primary: #0B57C4;
        --WE-color-secondary: #083F8F;
        --WE-color-success: #FFBB03;
    }

    .WE_contact-bar {
        position: fixed;
        left: 0;
        top: 60%;
        transform: translateY(-50%);
        display: flex;
        flex-direction: column;
        gap: 10px;
        padding: 5px;
        background: rgba(0, 0, 0, 0.5);
        border-radius: 0 10px 10px 0;
        z-index: 1000;
        transition: transform 4s ease-out;
    }

    .WE_contact-label {
        writing-mode: vertical-rl;
        text-align: center;
        color: white;
        font-size: 16px;
        font-weight: 300;
        margin-top: 10px;
        background: var(--WE-color-primary);
        padding: 10px 5px;
        border-radius: 5px;
        display: block;
        transform: rotate(180deg);
        position: relative;
text-transform:uppercase
    }

    .WE_contact-label::after {
        content: "";
        position: absolute;
        bottom: -10px;
        left: 50%;
        transform: translateX(-50%);
        width: 0;
        height: 0;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid var(--WE-color-primary);
    }

    .WE_contact-icon {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 40px;
        height: 40px;
        color: white;
        transition: background 0.3s, transform 0.3s;
    }

    .WE_contact-icon:hover { color: white; }

    .WE_contact-icon.email:hover {
        background: var(--WE-color-primary);
        transform: scale(1.1);
    }

    .WE_contact-icon.phone:hover {
        background: var(--WE-color-secondary);
        transform: scale(1.1);
    }

    .WE_contact-icon.facebook:hover {
        background: var(--WE-color-success);
        transform: scale(1.1);
    }

    .WE_contact-icon.twitter:hover {
        background: var(--WE-color-secondary);
        transform: scale(1.1);
    }

    .WE_contact-icon.linkedin:hover {
        background: var(--WE-color-primary);
        transform: scale(1.1);
    }


    @media (max-width: 768px) {
        .WE_contact-bar {
            top: 85%;
          
            transform: translateY(-50%);
            background: none;
            padding: 0;        left: 88%;
        }
	.WE_contact-icon	{background: var(--WE-color-primary);  border-radius: 50%;}
        .WE_contact-label {
            display: none;
        }
   .WE_contact-icon:hover {
        transform: scale(1.1);
color:white;
    }
    }

/* ---- snippet #13: Menu dịch vụ xổ ---- */
.WE_menu a {

  text-decoration: none;
}

    .WE_menu {
        max-width: 1200px !important;
        margin: 0 auto !important;

        display: flex !important;
        flex-wrap: wrap !important;
        gap: 30px !important;
    }

    .WE_menu-section {
        flex: 1 1 22% !important;
        margin-bottom: 20px !important;
        box-sizing: border-box !important;
    }

    .WE_menu-header {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        position: relative !important;border-bottom: 1px solid #ccc;
    padding-bottom: 20px;
    }
ul.WE_submenu li a {
    display: block;
    width: 100%;
}
   .WE_menu h2 {
        margin: 0 !important;
        font-size: 1.5em !important;
        display: inline-block !important;
color:var(--fs-color-primary);
    }
	.WE_menu ul li {padding:0;margin:0}
	.WE_menu h2::last-child {border:none!important}
.WE_toggle-button {
    background: none !important;
    border: none !important;
    font-size: 1.5em;
    cursor: pointer !important;
    position: absolute !important;
    right: -50px !important;
    top: 40% !important;
    transform: translateY(-50%) !important;
    text-align: right;
}

    .WE_submenu {
        list-style-type: none !important;
        padding: 0 !important;
        margin: 10px 0 0 !important;
    }

    .WE_submenu li {
        padding: 5px 0 !important;
        border-bottom: 1px solid #eee !important;
        transition: background-color 0.3s ease, border-color 0.3s ease !important;
    }

 
	
    .WE_toggle-button:focus {
        outline: none !important;
    }

    /* Responsive styles */
    @media (max-width: 768px) {
        .WE_submenu {
            display: none !important;
        }

        .WE_menu-section.open .WE_submenu {
            display: block !important;
            animation: WE_slideDown 0.3s ease-out !important;
        }

        .WE_menu {
            flex-direction: column !important;
        }

        .WE_menu-section {
            flex: 1 1 100% !important;
        }
    }

    @keyframes WE_slideDown {
        from {
            max-height: 0 !important;
            opacity: 0 !important;
        }
        to {
            max-height: 500px !important;
            opacity: 1 !important;
        }
    }

