@import url("style_adder.css");
@font-face {
    font-family: 'mainr';
    src: url("fonts/mainr.ttf");
    font-display: swap;
}
@font-face {
    font-family: 'mainm';
    src: url("fonts/mainm.ttf");
    font-display: swap;
}
@font-face {
    font-family: 'mainb';
    src: url("fonts/mainb.ttf");
    font-display: swap;
}

:root {
    --main: #3A6AFE;
    --sub: #EA6293;
	--lgray: #808080;
    --gray: #202020;
}
::-webkit-scrollbar { width: 10px; background-color: #ddd; }
::-webkit-scrollbar-thumb {
    height: 20%;
    background: #aaa;
    border: 1px solid #fff;
    transition: 0.3s ease-out;
}
::-webkit-scrollbar-thumb:hover { background: var(--sub) }
::selection { background: #001964; color: #fff }
::-moz-selection { background: #001964; color: #fff }
::-webkit-selection { background: #001964; color: #fff }

html {
    scroll-behavior: smooth;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}
html,body,button,p,text,textarea,select,input {
	outline: 0;
	font-family: 'mainr';
    line-height: 1.6;
}
b, strong { font-family: 'mainb'; }
h1, h2, h3, h4, h5, h6 {
    font-weight: normal;
    font-family: 'mainb';
    line-height: 1.3;
    transition: 0.3s ease-out;
}

/*WRAPPER_CENTER*/
.wrapper-center {
    margin-right: auto;
    margin-left: auto
}
@media (max-width: 568px) { .wrapper-center {margin-right: 30px; margin-left: 30px }}
@media (min-width: 569px) and (max-width: 1800px) {.wrapper-center {width: 90%;}}
@media (min-width: 1801px) {.wrapper-center {width: 1600px;}}

/*header*/
.site-content { padding-top: 76px }
.mondial-header {
    top: 0;
    position: fixed;
    width: 100%;
    z-index: 1000;
    box-shadow: 0 5px 10px -5px #00000050;
}
.head-logo { padding: 10px 0; }
.head-logo .custom-logo { width: 200px; }


/*head main menu*/
a.mega-menu-link>a { position: relative; }
.mega-current-menu-item>a { font-family: 'mainm' !important; }
.mega-menu>li:not(.mega-lang-item)>a.mega-menu-link::before {
    position: absolute !important;
    content: "";
    width: 0px !important;
    height: 2px !important;
    background-color: var(--sub) !important;
    left: 0;
    bottom: 5px;
    transition: 0.5s ease-out;
}
.mega-menu>li.mega-current-menu-item:not(.mega-lang-item)>a.mega-menu-link::before { width: 25px !important; }
.mega-menu>li>a.mega-menu-link:not(.mega-lang-item):hover:not(.mega-lang-item)::before { width: 100% !important; }

#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link {
    display: flex;
    align-items: center;
    margin: 0 15px;
    padding-left: 0;
    padding-right: 0;
}

#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item:last-of-type > a.mega-menu-link {
    margin: 0 0 0 15px;
}
#mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item-has-children > a.mega-menu-link > span.mega-indicator {
    margin: 0 !important;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-flyout ul.mega-sub-menu li.mega-menu-item a.mega-menu-link {
    line-height: 1.1 !important;
}
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item:last-child { margin: 0; }
#mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-block-0 .mega-toggle-animated-inner, 
#mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-block-0 .mega-toggle-animated-inner::before, 
#mega-menu-wrap-primary .mega-menu-toggle .mega-toggle-block-0 .mega-toggle-animated-inner::after {
    height: 2px;
}
#mega-menu-wrap-primary #mega-menu-primary li.mega-menu-item-has-children > 
a.mega-menu-link > span.mega-indicator:after {
    top: 1px !important;
    right: -4px !important;
}
.mega-lang-item a {
    margin: 0 0 0 15px !important;
}
@media only screen and (min-width: 1025px) {
    a.mega-menu-link::before { bottom: -6px; }
}
@media only screen and (max-width: 1024px) {
    a.mega-menu-link::before { bottom: 6px; }
    .mega-lang-item {
        margin: 0;
        width: 30px;
    }
}

/*footer*/
.mondial-footer { overflow: hidden; }
.mondial-footer .decor {
    filter: brightness(0) invert(1);
    opacity: 0.2;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 0;
}
.mondial-footer .top { background-color: #fff; }
.mondial-footer .top .wrapper-center { justify-content: space-evenly;}
.mondial-footer .top a:hover { color: #fff !important }

.foot-logo img { margin: 0 auto; }
.mondial-footer .hotline span {
    font-family: 'mainm';
    color: var(--sub);
    font-size: 2em;
}
.mondial-footer .bottom {
    margin: 0 -30px;
    padding-top: 50px;
}
.mondial-footer a { text-decoration: none; }
.mondial-footer a:hover { color: var(--sub) !important; }
.mondial-footer .box { margin: 10px 30px; }
.mondial-footer .contact-info ul li {
    margin: 15px 0;
    display: list-item;
    list-style-type: "+";
    padding-inline-start: 10px;
}
.mondial-footer .contact-info ul li::marker { color: var(--sub); }
.mondial-footer .contact-info table td { background-color: transparent !important; }
.mondial-footer .map { margin-top: 30px; }
.mondial-footer .map iframe { 
    display: block;
    border: 6px solid #fff; 
}
.copyright {
    padding: 30px 0;
    letter-spacing: 0.5px;
    font-size: 14px;
}
@media (max-width: 568px) {
    .mondial-footer .top {
        padding-bottom: 20px;
    }
    .mondial-footer .contact-info table tr {
        display: flex;
        flex-wrap: wrap;
    }
    .mondial-footer .contact-info table td {
        width: 100% !important;
    }
}

.block-mobile-buttons {
    z-index: 3;
    position: fixed;
    left: 5px;
    bottom: 0px;
}
.pulse {
    cursor: pointer;
    margin: 25px 10px;
    padding: 8px;
    background-color: var(--main);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    transition: 0.3s ease-out;
}
.pulse:hover { background-color: var(--sub); }
.pulse::before,
.pulse::after {
    content: "";
    position: absolute;
    border: 1px solid var(--main);
    width: calc(100% + 10px);
    height: calc(100% + 10px);
    border-radius: 50%;
    animation: pulse 1s ease-out infinite;
}
.pulse::after { animation-delay: 0.3s }
.pulse:hover::before, 
.pulse:hover::after { border: 1px solid var(--sub); }
.pulse img { width: 20px; height: 20px; }
@keyframes pulse {
    0% { transform: scale(0.5); opacity: 0 }
    50% { transform: scale(1); opacity: 1 }
    100% { transform: scale(1.3); opacity: 0 }
}


/*end footer*/


/*trang chu - home*/
#main,
.mondial-home { overflow: hidden; }
.mondial-home table tr { display: flex; flex-wrap: wrap;}
#primary { background-color: #f1f1f1; }

/*trang chu - dich vu*/
.home-services { padding: 60px 0 }
.home-list-services { padding-top: 20px; }
.home-list-services .item { 
    display: block;
    border-radius: 10px;
    overflow: hidden;
}
.home-list-services .thumbnail {
    width: 100%;
    height: 100%;
}
.home-list-services .thumbnail img {
    max-height: 250px;
    min-height: 180px;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.3s ease-out;
}
.home-list-services .item:hover .thumbnail img {
    transform: scale(1.1);
}
.home-list-services .name {
    width: 100%;
    padding: 100px 0px 20px 0px;
    background: linear-gradient(#00000000, #000000d0);
    left: 0;
    bottom: 0;
}
.home-list-services .name h3 {
    font-size: 18px;
    font-family: 'mainm';
    color: #fff;
    margin: 0;
    padding: 0 20px;
    border-left: 5px solid var(--sub);
}
@media (min-width: 769px) { 
    .home-list-services {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr; 
        grid-template-rows: 1fr 1fr;
        gap: 20px; 
        grid-template-areas: 
            "one one two three"
            "four five six six"; 
    }
    .home-list-services .item:nth-child(1) { grid-area: one }
    .home-list-services .item:nth-child(2) { grid-area: two }
    .home-list-services .item:nth-child(3) { grid-area: three }
    .home-list-services .item:nth-child(4) { grid-area: four }
    .home-list-services .item:nth-child(5) { grid-area: five }
    .home-list-services .item:nth-child(6) { grid-area: six }
    .home-list-services .item:nth-child(1) .name h3,
    .home-list-services .item:nth-child(6) .name h3 { font-size: 32px; }
}
@media (max-width: 768px) { 
    .home-list-services .name h3 {
        font-size: 16px;
    }
    .home-list-services {
        display: flex;
        flex-wrap: wrap;
        margin: 0 -10px;
    }
    .home-list-services .item {
        width: calc(50% - 20px);
        margin: 10px;
    }
}


/*trang chu - vi sao chọn*/
.home-why { padding-bottom: 80px; }
.home-why .content {
    padding-top: 10px;
    margin: 0 -10px;
}
.home-why table tr {
    display: flex;
    flex-wrap: wrap;
}
.home-why table td {
    position: relative;
    border-radius: 10px;
    text-align: center;
    padding: 30px 20px;
    margin: 10px;
    width: calc(25% - 20px) !important;
    transition: 0.3s ease-out;
    border-bottom: 3px solid #fff;
    box-shadow: 0 3px 5px -3px var(--lgray);
}
.home-why table td:nth-child(odd) { background: linear-gradient(var(--main), var(--sub)) }
.home-why table td:nth-child(even) { background: linear-gradient(var(--sub), var(--main)) }
.home-why table td p { margin: 0}
.home-why table td h3 { 
    color: #fff;
    font-size: 20px;
    margin: 10px 0 0 0;
    font-family: 'mainm';
}
.home-why table td p {
    display: inline-block;
    border-radius: 50%;
    padding: 15px;
    width: 110px;
    height: 110px;
    background-color: #fff;
}
.home-why table td img { 
    width: 80px;
    height: 80px;
}
.home-why table td:hover {
    background-color: var(--sub);
}
.home-why table td:hover * { color: #fff }
.home-why table td:hover p { background-color: #fff }
@media (min-width: 1025px ) {
    .home-why table td:nth-child(odd) { bottom: 15px; }
    .home-why table td:nth-child(even) { top: 15px; }
}
@media (max-width: 1024px ) {
    .home-why table td { width: calc(50% - 20px) !important; }
}
@media (max-width: 568px ) {
    .home-why table td img { width: 100px !important; }
}

/*trang chu - san pham*/
.home-products {
    padding: 60px 0;
}
.home-products-in { margin: 0 -30px; }
.home-products .box { margin: 30px; }
.home-products .mondial-title h2 { color: #fff }
.home-products .mondial-title h2::after {
    left: 0;
    transform: translate(0, 0);
}
.home-products .owl-carousel.owl-drag .owl-item {
    background-color: transparent;
}
.home-products .item {
    overflow: hidden;
    border-radius: 10px;
    box-shadow: 0 3px 10px -5px #000;
    display: block;
    margin: 10px;
}
.home-products .item .name {
    left: 0;
    bottom: 0;
    width: 100%;
}
.home-products .item:hover img {
    transform: scale(1.1);
}
.home-products .item .name h3 {
    font-family: 'mainm';
    font-size: 16px;
    text-align: center;
    padding: 10px 20px;
    background-color: #fff;
    border-radius: 6px;
    margin: 10px;
    transition: 0.3s ease-out;
}
.home-products .item:hover .name h3 {
    color: #fff;
    background-color: var(--sub);
}
.home-products .read-more {
    margin-top: 20px;
}

/*trang chu - du an*/
.home-projects { padding: 80px 0 }
.home-projects .box h3 {
    margin: 30px 0 10px 0;
    font-family: 'mainm';
    text-transform: uppercase;
}
.home-projects .box h3 span {
    color: var(--sub);
    font-size: 32px;
    padding-right: 6px;
}
.home-projects .box-in { 
    margin: 0 -10px;
    padding-bottom: 10px;
}
.home-projects .item {
    display: block;
    margin: 10px; 
    box-shadow: 0 5px 5px -3px var(--lgray);
}
.home-projects .item .stt {
    text-align: center;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    width: 70px;
    z-index: 2;
    left: 0;
    top: 10px;
    background-color: var(--sub);
    font-size: 24px;
    font-family: 'mainm';
    color: #fff;
}
.home-projects .item .image {
    overflow: hidden;
    padding-top: 66.66%;
    position: relative;
    transition: 0.3s ease-out;
}
.home-projects .item .image img { 
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}
.home-projects .item:hover img { transform: scale(1.1); }
.home-projects .item .name {
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    background: linear-gradient(transparent, #00000080);
}
.home-projects .item .line {
    color: #fff;
    margin: 50px 20px 0 40px;
}
.home-projects .item h4 {
    position: relative;
    color: #fff;
    font-size: 24px;
    font-family: 'mainm';
    margin: 0 20px 20px 40px;
}
.home-projects .item h4::before {
    content: '';
    position: absolute;
    left: -40px;
    top: 15px;
    height: 3px;
    width: 35px;
    background-color: var(--sub);
}
.home-projects .item:hover h4 { color: var(--sub) }
.home-projects .read-more {
    margin-top: 20px;
}

/*trang chu - lien he*/
.home-contact { padding-bottom: 80px; }
.home-contact .top-in {
    margin-bottom: 50px;
    overflow: hidden;
    border-radius: 20px;
    box-shadow: 0 3px 10px -5px #000;
}
.home-contact .top-in h2 {
    margin: 0;
    color: #fff;
    padding: 20px;
    background-color: var(--main);
}
.home-contact .top-in .hotline {
    justify-content: center;
    padding: 20px;
    background-color: #fff;
}
.home-contact .top-in .hotline span {
    font-family: 'mainm';
    margin-left: 15px;
    font-size: 2em;
    color: var(--sub);
}
.home-contact .bottom { margin: 0 -10px }
.home-contact .bottom table tr {
    display: flex;
    flex-wrap: wrap;
}
.home-contact .bottom table td * {
    color: #fff !important
}
.home-contact .bottom table td {
    background-color: transparent !important;
    background-image: linear-gradient(to right bottom, #ea6293, #df57ab, #c756c8, #9b5ee5, #3a6afe);
    overflow: hidden;
    position: relative;
    border-radius: 20px;
    padding: 20px 20px 20px 30px;
    margin: 10px;
    width: calc(33.33% - 20px) !important;
    box-shadow: 0 3px 10px -5px #000;
}
.home-contact .bottom table td::before {
    content: '';
    position: absolute;
    width: 0%;
    height: 3px;
    background-color: var(--sub);
    bottom: 0;
    left: 0;
    transition: 0.3s ease-out;
}
.home-contact .bottom table td:hover::before {
    width: 100%;
}
.home-contact .bottom h4 {
    font-size: 18px;
    font-family: 'mainm';
    color: var(--lgray);
    margin: 10px 0 20px 0;
}
.home-contact .bottom ul { margin: 0; padding: 0 }
.home-contact .bottom ul li {
    align-items: center;
}
.home-contact .bottom ul li i {
    color: var(--sub);
    margin-right: 10px;
}
@media (max-width: 1280px) {
    .home-contact .bottom table td {
        width: calc(50% - 20px) !important;
    }
}
@media (max-width: 568px) {
    .home-contact .bottom table td {
        width: calc(100% - 20px) !important;
    }
}


/*trang chu - gioi thieu*/
.home-about { margin-bottom: 100px; }
.home-about .top { padding: 50px 0 30px 0; }
.home-about * { color: #fff }
.home-about .read-more { margin: 0 -15px; }
.home-about .read-more .netcome-button { margin: 10px 15px; }
.home-about .top-in,
.home-about .bottom-in { margin: 0 -30px }
.home-about .box { margin: 0 30px; }

.home-about .bottom-in { align-items: flex-end; }
.home-about .bottom .image {
    margin: auto;
    padding: 10px;
    background-color: #fff;
}
@media (min-width: 769px ) {
    .home-about .bottom .image { max-height: 420px; }
    .home-about .bottom-in { align-items: flex-end; }
    .home-about .bottom {
        position: absolute;
        left: 0;
        bottom: -80px;
    }
}
@media (max-width: 768px ) {
    .home-about .bottom-in {
        padding-top: 50px;
        flex-direction: column-reverse;
    }
    .home-about .read-more {
        padding-top: 20px;
        justify-content: center;
    }
}


/*trang chu - doi tac*/
.home-partners { padding: 100px 0; }
.list-logos p { padding: 10px; }
.list-logos p img {
    background-color: #fff;
    border-radius: 15px;
    width: 100%;
    box-shadow: 0 3px 10px -5px #000000;
}
.list-slide-nav button {
    box-shadow: 0 2px 5px -2px #000;
    border: none;
    background-color: var(--main);
    color: #fff;
    border-radius: 50%;
    top: calc(50% - 15px);
    transform: translate(0, -50%);
    position: absolute;
    font-size: 36px;
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: 0.3s ease-out;
}
.list-slide-nav button:hover {
    color: #fff;
    background-color: var(--sub);
}
.list-slide-nav button span { margin-bottom: 2px; }
.list-slide-prev { left: -10px; }
.list-slide-next { right: -10px; }
.list-banners p { margin: 0}
.list-banners .list-slide-nav button { border: 2px solid #fff;}
.list-banners .list-slide-prev { left: 20px; }
.list-banners .list-slide-next { right: 20px; }
.list-logos .owl-item { background-color: transparent !important;}
@media (max-width: 768px) { .list-slide-nav {display: none} }

/*trang chu - tin tuc*/
.the-list-post { padding: 5px 0; }
.the-list-post { margin: 0 -5px; }
.the-post-item { 
    margin: 20px 5px;
    display: block; 
}
.the-post-item:hover { box-shadow: 0 5px 5px -2px var(--gray);}
.the-post-item .thumbnail {
    overflow: hidden;
    padding-top: 100%;
    width: 100%;
}
.the-post-item .thumbnail>img {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.5s ease-out;
}
.the-post-item:hover .thumbnail>img { 
    filter: brightness(0.6);
    transform: scale(105%);
}
.the-post-item .info {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 25px 25px 20px 25px;
    background: linear-gradient(
        to bottom, #00000000 0%,#00000045 50%,#00000090 100%);
}
.the-post-item .date {
    font-size: 15px;
    position: relative;
    display: block;
    color: #fff;
    margin-bottom: 10px;
    padding-bottom: 5px;
    text-shadow: 0 3px 5px var(--gray);
}
.the-post-item .date::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    background-color: var(--sub);
    width: 30px;
    height: 2px;
}
.the-post-item h4 {
    text-shadow: 0 3px 5px var(--gray);
    font-family: 'mainm';
    color: #fff;
    position: relative;
    display: inline;
    background: linear-gradient(to right, var(--sub) 0%, var(--sub) 100%);
    background-size: 0px 2px;
    background-position: 0 100%;
    /*transition: 0.3s cubic-bezier(.785,.135,.15,.86) 0s;*/
    background-repeat: no-repeat;
}
.the-post-item:hover h4 { background-size: 100% 2px; }
.home-news .read-more { padding-top: 20px; }


/*trang dich vu - du an - san pham*/
.the-post-item .text span {
    text-transform: uppercase;
    display: inline-block;
    font-family: 'mainm';
    padding: 8px 13px 7px 13px;
    background-color: var(--sub);
    color: #fff;
    line-height: 1;
    letter-spacing: 0.5px;
    font-size: 13px;
    margin-bottom: 10px;
}
.the-post-item .logo {
    left: 10px;
    top: 10px;
    z-index: 1;
}
.the-post-item .logo>img {
    width: 35%;
}
/*trang du an - menu*/
.netcome-category-menu { margin: 0 -10px; }
.netcome-category-menu .box { margin: 10px; }
.netcome-category-menu .menu { padding: 25px 0 10px 0; }
.netcome-category-menu .menu ul,
.netcome-category-menu .menu li {
    margin: 0;
    padding: 0;
}
.netcome-category-menu ul li a {
    font-size: 14px;
    display: block;
    line-height: 1.2;
}
.netcome-category-menu .parent {
    background-color: #fff;
}
.netcome-category-menu .parent>li>a {
    border-left: 3px solid var(--sub);
    text-transform: uppercase;
    padding: 9px 15px 7px 15px ;
    margin: 5px 5px 5px 0;
    font-family: 'mainb';
}
.netcome-category-menu .children>li>a {
    color:#000;
    margin: 5px;
    background-color: #f1f1f1;
    padding: 7px 12px;
}
.netcome-category-menu .parent>li>ul>li>ul>li>a::before {
    content: "\279E";
    padding-right: 5px;
    transition: 0.3s ease-out;
}
.netcome-category-menu .menu a:hover { 
    color: #fff;
    background-color: var(--sub);
    box-shadow: 0 3px 3px var(--lgray);
}
.netcome-category-menu .menu a:hover::before { color: #fff; }

@media (max-width: 768px) {
    .netcome-project .netcome-category-menu .parent { display: flex; flex-wrap: wrap; }
    .netcome-project .parent>li { width: 50% }
    .netcome-product .netcome-category-menu .parent>li>ul>li>ul { display: flex; flex-wrap: wrap; }
    .netcome-product .parent>li>ul>li { width: 100% }
    .netcome-product .parent>li>ul>li>ul>li { width: 33.33% }
}
@media (max-width: 568px) {
    .the-post-item .info { padding: 15px; }
}

/*trang trong*/
.page-content { padding: 50px 0; }
@media (max-width: 568px) { .page-content { padding: 50px 30px; } }



/*trang lien he*/
.netcome-contact .bottom { 
    margin: 30px 0;
    background-color: #fff; 
    box-shadow: 0 3px 5px -3px var(--lgray);
}
.netcome-contact .bottom .form { margin: 10px 30px; }
.netcome-contact .map iframe {
    border: 5px solid #fff;
    height: 400px;
    display: block;
    width: 100%;
}
.mondial-form { margin: 0; }
div.mondial-form.wpforms-container-full .wpforms-form .wpforms-head-container { padding: 0; }
div.mondial-form.wpforms-container-full .wpforms-form .wpforms-description { 
    font-weight: normal;
    margin: 0 0 10px 0;
}
div.mondial-form.wpforms-container-full .wpforms-field-label,
div.mondial-form.wpforms-container .wpforms-required-label {
    font-weight: normal;
    font-size: 15px;
    margin: 0;
}
div.mondial-form.wpforms-container-full input[type=text],
div.mondial-form.wpforms-container-full input[type=email],
div.mondial-form.wpforms-container-full .wpforms-form textarea {
    background-color: transparent;
    border: unset;
    border-bottom: 2px solid var(--sub);
    border-radius: unset;
    font-size: 14px;
    padding: 0;
}
div.mondial-form.wpforms-container-full input { height: 30px; }
div.mondial-form.wpforms-container-full .wpforms-form textarea { 
    margin: 5px 0;
    height: 40px !important;
}
div.mondial-form .wpforms-submit-container { text-align: center; }
div.mondial-form.wpforms-container-full button[type=submit] {
    height: 40px;
    width: 180px;
    font-size: 15px;
    background-color: var(--main) !important;
    font-family: 'mainm';
    transition: 0.3s ease-out;
}
div.mondial-form.wpforms-container-full button[type=submit]:hover {
    background: var(--sub) !important;
}

/*trang 404*/ 


/*trang tin tuc - danh muc*/
#mondial_posts { padding: 50px 0;}

/*navigation*/
.navigation {
	padding: 30px 10px 20px 10px;
	width: 100%;
	text-align: center;
}
.navigation ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
	padding: 0;
	margin: 0;
}
.navigation li {
    display: inline-block;
    margin: 5px 3px;
}
.navigation li a,
.navigation li a:hover,
.navigation li.active a,
.navigation li.disabled {
    font-size: 13px;
    display: inline-block;
    padding: 5px 13px;
    color: #fff;
    background-color: #000;
    cursor: pointer;
}
.navigation li.active a {
    background-color: var(--main);
}
/*end navigation*/


/*trang tin tuc - chi tiet*/
.mondial-post { 
    padding: 30px 0; 
    background: #ddd;
}
.mondial-post .top { margin: 0 -30px; }
.mondial-post .box { margin: 10px 30px; }
.product-detail .text-1 {
    display: inline-block;
    font-family: 'mainb';
    color: #fff;
    background-color: var(--sub);
    line-height: 1;
    padding: 10px 15px 8px 15px;
}
.product-detail .text-2 { 
    font-family: 'mainm';
    font-size: 20px;
}
.product-detail .contact .hotline {
    margin: 10px 0 20px 0;
    font-family: 'mainb';
    font-size: 2em;
    line-height: 1;
    color: var(--sub)
}

.post-title,
.info-title { margin-bottom: 40px; }
.post-title::after,
.info-title::after,
.related-title::after {
    height: 2px;
    position: absolute;
    content: "";
    background-color: var(--sub);
    bottom: -10px;
    left: 0;
    width: 50px;
}
@media (min-width: 569px) { 
    .product-detail .top-in { margin: 0 -20px; }
    .product-detail .box-in { margin: 20px; }
    .post-detail { 
        background-color: #fff; 
        border-radius: 5px;
        padding: 10px 50px 30px 50px; 
    }
}
@media (max-width: 568px) {
    .product-detail.box {
        margin: 0 0 30px 0;
        padding: 30px;
        background-color: #fff;
    }
    .post-detail {
        margin-left: -30px;
        margin-right: -30px;
        padding: 10px 0 30px 0;
    }
} 






/*css breadcrumb - nut - tieu de - menu */
.anisl { transform: translate3d(-100px, 0px, 0px); }
.anisr { transform: translate3d(100px, 0px, 0px); }
.anist { transform: translate3d(0px, -100px, 0px); }
.anisb { transform: translate3d(0px, 100px, 0px); }
.anis {
    position: relative;
    z-index: 10;
    opacity: 0;
    transition: all 800ms ease-out;
}
.anis.in-view {
    opacity: 1;
    transform: translate3d(0px, 0px, 0px);
    z-index: 0;
}


/*nut mondial-button*/
.mondial-button { 
    position: relative;
    display: inline-block;
    overflow: hidden;
    margin: 10px;
}
.mondial-button::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    left: -100%;
    top: 0;
    z-index: 0;
    transition: 0.3s ease-out;
}
.mondial-button:hover::after { left: 0; }
.mondial-button span { 
    position: relative; 
    display: inline-block;
    z-index: 1;
    padding: 12px 40px;
    font-family: 'mainm';
    line-height: 1;
    letter-spacing: 0.5px;
    transition: 0.3s ease-out;
}
.mbtn-1 {
    color: #fff;
    background-color: var(--main);
}
.mbtn-2 {
    color: #fff;
    background-color: var(--sub)
}
.mbtn-1:hover {
    color: #fff;
}
.mbtn-2:hover {
    color: var(--sub)
}
.mbtn-1::after { background-color: var(--sub); }
.mbtn-2::after { background-color: #fff; }

.hentry .entry-content .wp-block-button a.wp-block-button__link {
    color: #fff;
    font-size: 15px;
    letter-spacing: 1px;
    font-family: 'mainm';
    font-weight: normal;
    padding: 10px 40px ;
}
.hentry .entry-content .wp-block-button a.wp-block-button__link:hover {
    background-color: var(--sub);
    color: var(--main);
}
/*nut netcome*/
.netcome-button {display: inline-block; }
.netcome-button a {
    color: #fff;
    justify-content: center;
    text-transform: uppercase;
    letter-spacing: 1px;
    line-height: 1;
    border-radius: 5px;
}
.netcome-button a {
    font-family: 'mainm';
    background-size: 300% 100%;
    background-image: linear-gradient(to right, #3A6AFE, #0029a3, #3A6AFE, #0029a3);
    padding: 10px 20px;
}
.netcome-button a:hover { background-position: 100% 0; }

.netcome-button-2 a {
    color: #000;
    text-transform: uppercase;
    letter-spacing: 1px;
    line-height: 1;
    border-radius: 5px;
    font-family: 'mainm';
    background-color: #fff;
    border: 2px solid #fff;
    padding: 10px 20px;
}
.netcome-button-2:hover a {
    color: #fff;
    background-color: var(--sub);
}
.button-glow-1 { animation: glowing1 1500ms infinite; }
.button-glow-2 { animation: glowing2 1500ms infinite; }
@keyframes glowing1 {
    0% { box-shadow: 0px 0px 0px 1px #aac0ff7c;}
    50% { box-shadow: 0px 0px 0px 5px #3A6AFE7c;}
    100% { box-shadow: 0px 0px 0px 1px #bacbff7c;}
} 
@keyframes glowing2 {
    0% { box-shadow: 0px 0px 0px 2px #ffffff65;}
    50% { box-shadow: 0px 0px 0px 7px #ffffff65;}
    100% { box-shadow: 0px 0px 0px 2px #ffffff65;}
} 

/*breadcrumb*/
.breadcrumbs { 
    padding: 10px 0;
    background-color: var(--gray); 
}
.aioseo-breadcrumbs * {
    color: #fff;
    font-size: 14px; 
}
.aioseo-breadcrumb-separator { color: var(--sub)}
.aioseo-breadcrumb-separator:not(:first-child) { margin: 0 5px; }
/*end breadcrumb*/


/*main title*/
.mondial-title h2 { color: var(--main)}
.entry-title h1,
.mondial-title h1,
.mondial-title h2 { 
    text-transform: uppercase;
    position: relative;
    padding-bottom: 10px;
    margin: 0 0 20px 0;
    display: inline-block;
}
.entry-title h1::after,
.mondial-title h1::after,
.mondial-title h2::after {
    position: absolute;
    content: "";
    width: 80px;
    height: 2px;
    bottom: 0;
    left: 0;
    background-color: var(--sub);
}
.entry-title h1::after,
.mondial-title h1::after,
.mondial-title h2::after {
    left: 50%;
    transform: translate(-50%, 0);
}


/*trinh soan thao*/
.page-content a,
.post-detail a {
    background-image: linear-gradient(120deg, #ffa600 0%, #ffa600 100%);
    background-repeat: no-repeat;
    background-size: 100% 2px;
    background-position: bottom;
    color: inherit;
    text-decoration: none;
    overflow-wrap: break-word;
}
.page-content a:hover,
.post-detail a:hover { background-size: 100% 100%; }
.page-content ul li,
.post-detail ul li { position: relative; }
.page-content ul li::before,
.post-detail ul li::before {
    position: absolute;
    content: "";
    left: -20px;
    top: 10px;
    width: 12px;
    height: 2px;
    background-color: var(--sub);
}
.page-content ol li::marker,
.post-detail ol li::marker {
    color: var(--main);
    font-weight: 700;
    letter-spacing: 2px;
}
.mg0 { margin: 0 }
.mga { margin: 0 auto !important }
.bgw { background-color: #fff;}
.bgm { background-color: var(--main);}
.bgs { background-color: var(--sub);}
.w100 { width: 100% }
.h100 { height: 100% }
.jcc { justify-content: center;}
/*heading*/
.wp-block-heading,
p {
    margin: 15px 0;
}
/*quote*/
.wp-block-quote {
    box-shadow: 5px 5px #ddd;
    max-width: 800px;
    position: relative;
    padding: 20px 30px;
    margin: 30px auto;
    border: 2px solid var(--main);
}
.wp-block-quote::before {
    content:url('images/quote.png');
    position: absolute;
    right: 30px;
    top: -25px;
}
.wp-block-quote cite {
    position: relative;
    padding-left: 30px;
    font-family: 'mainm';
    color: #000;
    font-size: 1em;
}
.wp-block-quote cite::before {
    position: absolute;
    content: '';
    left: 0;
    bottom: 10px;
    width: 20px;
    height: 2px;
    background-color: var(--sub);
}



/*responsive*/
@media (min-width: 569px) {
	.dom { display: none; }
}
@media (max-width: 568px) {
    .dod { display: none; }
}