
:root {

    --light: #E8CCA5;
    --main: #9f8054;
    --dark: #423523;
    --gray: #26282B;
}
::-webkit-scrollbar {
    display: block;
}

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


/*HTML*/
html { scroll-behavior: smooth; }
html,body,section,p,button,input,text {
    font-family: 'mainr';
    font-size: 14px;
    line-height: 1.6;
}


p { margin: 15px 0; }
a { color: inherit; transition: 0.3s; }
ol { margin: 20px; }
ol li {
    line-height: 1.4;
    margin: 10px 0;
    list-style: decimal;}
h4 { font-size: 16px; }
h5 { font-size: 14px; }
h6 { font-size: 12px; }

h1,h2,h3,h4,h5,h6 {
    font-family: 'mainb';
    font-weight: normal;
    line-height: 1.4;
    margin: 15px 0;
}
b,strong {
    font-family: 'mainb';  
    font-weight: normal;
}
/*end HTML*/



/*class*/
.dib { display: inline-block; }
.dpf { display: flex; }
.dpfa { display: flex; align-items: center; }
.dpfajc {
    display: flex;
    align-items: center;
    justify-content: center;
}
.dpfjc { display: flex; justify-content: center; }
.dpfl, .dpfw {display: flex; flex-wrap: wrap; }
.dpffe { 
    display: flex;
    align-items: flex-end;
}
.dpfla,
.dpflaw,
.dpfaw {
    flex-wrap: wrap;
    display: flex;
    align-items: center;
}
.dpfljc,
.dpfjcw,
.dpfljcw {
    flex-wrap: wrap;
    display: flex;
    justify-content: center;
}
.dpfjs {
    display: flex;
    justify-content: space-between;
}
.dpfljs {
    flex-wrap: wrap;
    display: flex;
    justify-content: space-between;
}
.dpfajcw,
.dpflajc {
    flex-wrap: wrap;
    display: flex;
    align-items: center;
    justify-content: center;
}
.dpfjsw {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.dpfajs {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.dpfje {
    display: flex;
    justify-content: flex-end;
}
.dpflajs,
.dpfajsw {
    flex-wrap: wrap;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.noscroll {
    overflow: hidden;
}
.ttu { text-transform: uppercase; }
.taj { text-align: justify; }



::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #f1f1f1; }
::-webkit-scrollbar-thumb {
    height: 20%;
    background: #afafaf;
    border: 1px solid #f1f1f1;
}
::-webkit-scrollbar-thumb:hover { background: #878787; }
::selection { background: #fff45490; }
::-moz-selection { background: #fff45490; }
::-webkit-selection { background: #fff45490; }

/*WRAPPER_CENTER*/
.wrapper-center {
    margin-right: auto;
    margin-left: auto
}
@media (min-width: 426px) {.wrapper-center { width: 400px;}}
@media (min-width: 569px) {.wrapper-center {width: 640px;}}
@media (min-width: 769px) {.wrapper-center {width: 800px;}}
@media (min-width: 960px) {.wrapper-center {width: 900px;}}
@media (min-width: 1025px) {.wrapper-center {width: 1000px;}}
@media (min-width: 1281px) {.wrapper-center {width: 1180px;}}
/*end class*/

/*effects*/
.animation-element {
    position: relative;
    z-index: 10;
}
.animation-element.slide-bottom {
    transform: translate3d(0px, 100px, 0px);
}
.animation-element.slide-left {
    transform: translate3d(-100px, 0px, 0px);
}
.animation-element.slide-left,
.animation-element.slide-bottom {
    opacity: 0;
    transition: all 500ms linear;
}
.animation-element.slide-left.in-view,
.animation-element.slide-bottom.in-view {
    opacity: 1;
    transform: translate3d(0px, 0px, 0px);
    z-index: 0;
}
/*end effects*/



/*title*/

.mondial-title h2,
.mondial-title h1 {
    margin: 0;
    text-transform: uppercase;
    display: inline-block;
}
.mondial-title span {
    width: 32px;
    height: 30px;
    font-family: 'mainb';
    line-height: 1;
    font-size: 28px;
    color: var(--main);
    border: 4px solid var(--main);
    margin-right: 15px;
}

.btn-de {
    cursor: pointer;
    border: unset;
    transition: 0.3s;
}
.btn-de,
.mondial-button a {
    overflow: hidden;
    position: relative;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-family: 'mainm';
    line-height: 1;
    display: inline-block;
    color: var(--main);
    background-color: #fff;
    padding: 10px 30px;
    border: 2px solid var(--main);
}
.btn-de:hover {
    background-color: var(--main);
    color: #fff;
}

.mondial-button a:hover {
    color: #fff;
}
.mondial-button a::after {
    position: absolute;
    width: 100%;
    height: 100%;
    content: "";
    background-color: var(--main);
    top: 0;
    left: -100%;
    transition: 0.3s;
}
.mondial-button a span {
    font-family: 'mainsb';
    position: relative;
    z-index: 2;
}
.mondial-button a:hover::after {
    left: 0;
}
/*end title*/



/*HEAD*/
#head_top {
    background-color: #fff;
    padding: 10px 20px;
    width: calc(100% - 40px);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    transition: 0.3s;
}
#head_bottom {
    padding-top: 100px;
}

.bgcw { 
    background-color: #fff;
    transition: 0.3s;
}
.block-logo {
    width: 80px;
}
.block-logo a {
    display: block;
}
.block-logo a img {
    display: block;
    max-width: 100%;
    max-height: 80px;
    object-fit: contain;
    transition: 0.3s;
}
.logo-resize { max-width: 50px !important; }


.block-hotline {
    padding: 8px 15px;
    line-height: 1;
    border: 2px solid var(--main);
    border-radius: 20px;
    color: var(--main);
    font-family: 'mainm';
}

/*MID*/


/*FOOTER*/
#mondial_copyright { background-color: #000; }
#copyright { padding: 20px; }
#copyright a { color: #fff; }


/*breadcrumb*/
#breadcrumb {
    display: none;
    background-color: var(--main);
}
#breadcrumb ul {
    color: #fff;
    padding: 10px 20px;
}
#breadcrumb ul li:first-child i {
    display: none;
}
#breadcrumb ul li {
    display: inline-block;
}
#breadcrumb ul li a {
    font-size: 13px;
    color: #fff;
}
/*end breadcrumb*/

/*pagination*/
#pagination {
    text-align: center;
    padding: 20px 0px;
}
#pagination i {
    line-height: 1;
}
#pagination strong,
#pagination a {
    line-height: 1;
    display: inline-block;
    color: #fff;
    padding: 10px 15px;
    margin: 0px 5px;
    vertical-align: middle;

}
#pagination strong,
#pagination a:hover{
    background-color: var(--light);
}
#pagination a {
    background-color: var(--main);
}
/*end pagination*/


/*default*/

/*[Admin edit block]*/
.box-admin-edit-block{
    margin: -2px;
    border: 1px dashed #9c2020 ;
    outline: 1px dashed #fff;
}

.btn-admin-edit{
    position: relative;
    z-index: 999;
    float: left;
}
.btn-admin-edit:hover span{
    visibility: visible;
    opacity:1;
}
.btn-admin-edit span.left{
    left: 20px;
    padding: 0px 10px 0px 20px;
}
.btn-admin-edit span.right{
    right: -20px;
    padding: 0px 20px 0px 10px;
}

.btn-admin-edit span{
    visibility: hidden;
    opacity:0;
    position: absolute;
    white-space: nowrap;
    bottom: 5px;
    background-color: #9c2020;
    line-height: 25px;
    border: 2px solid #460101;
    color: #fff;
}
.btn-admin-edit i{
    position: absolute;
    width: 25px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    display: inline-block;
    color: #fff;
    background-color: #9c2020;
    border: 2px solid #460101;
    border-radius: 50%;
    bottom: 5px;
    left: 5px;
    z-index: 999;
    cursor: pointer;
}
.btn-admin-edit i:hover{
    background-color: #460101;
}




/*[FORM]*/
.form-site .form-site-buttons{
    text-align: center;
}
.form-site-full{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.form-site .part-input-site {
    margin: 0 0 10px 0;
    width: 100%;
}
.form-site .part-input-site:nth-child(2),
.form-site .part-input-site:nth-child(3) {
    width: 48%;
}
.form-site .form-site-group{
    width: 50%;
}

/*input site text*/
.form-site .part-input-site-text.half-left{
    width: calc(50% - 5px);
    margin-right: 5px;
    margin-bottom: 10px;
    margin-top: 0px;
    float: left;
}
.form-site .part-input-site-text.half-right{
    width: calc(50% - 5px);
    margin-left: 5px;
    margin-bottom: 10px;
    margin-top: 0px;
    float: right;
}
.form-site .input-site-text,
.form-site .input-site-textarea {
    padding: 7px 10px;
    width: calc(100% - 22px);
    border: unset;
    border-bottom: 2px solid var(--main);


    background: transparent;
}
.form-site .input-site-text {
    height: 20px;
}

.form-site .input-site-textarea {
    height: 96px;
}


.form-site .box-label-site-textarea,
.form-site .box-label-site-text {
    margin: 5px 0;
    font-family: 'mainm';
}



.form-site .input-site-textarea::placeholder{
    font-size: 0px;
}
.form-site .error-validation-site-text,
.form-site .error-validation-site-textarea {
    position: absolute;
    font-size: 11px;
    padding: 3px 5px;
    color: #f00;
    top: 12px;
    right: 0;
}
/*end input site textarea*/

/*input site radio*/
.form-site .part-input-site-radio{
    display: flex;
    flex-wrap: wrap;
}
.form-site .box-input-site-radio{
    width: 50%;
    position: relative;
    display: flex;
    align-items: start;
    flex-wrap: wrap;
    margin: 5px 0px;
}
.form-site .box-input-site-radio .input-site-radio{
    position: absolute;
    visibility: hidden;
}
.form-site .box-input-site-radio .label-site-radio{
    display: block;
    position: relative;

    font-size: 20px;
    margin-top: 5px;
    padding-left: 30px;
    padding-right: 10px;
}
.form-site .box-input-site-radio .check{
    display: block;

    border-radius: 50%;
    height: 18px;
    width: 18px;
    position: absolute;
    top: 8px;
}
.form-site .box-input-site-radio .input-site-radio:checked ~ .check:after{
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    position: absolute;
    top: calc(50% - 5px);
    left: calc(50% - 5px);

}
/*end input site radio*/

/*input site checkbox*/
.form-site .part-input-site-checkbox{
    display: flex;
    flex-wrap: wrap;
}
.form-site .box-input-site-checkbox{
    width: 50%;
    position: relative;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin: 5px 0px;
}
.form-site .box-input-site-checkbox .input-site-checkbox{
    position: absolute;
    visibility: hidden;
}
.form-site .box-input-site-checkbox .label-site-checkbox{
    display: block;
    position: relative;
    margin-left: 10px;

    font-size: 20px;
    margin-top: 5px;
    padding-left: 25px;
    margin-left: -20px;
}
.form-site .box-input-site-checkbox .check{
    display: block;

    height: 18px;
    width: 18px;
    position: relative;
}
.form-site .box-input-site-checkbox .input-site-checkbox:checked ~ .check:after{
    content: "";
    display: block;
    width: 10px;
    height: 10px;
    position: absolute;
    top: calc(50% - 5px);
    left: calc(50% - 5px);

}
/*end input site checkbox*/

/*input site select*/
.form-site .input-site-select{
    border: 0px;
    padding: 10px 20px;
    font-size: 16px;
    display: inline-block;
}
/*end input site select*/

/*input site datepicker*/
.form-site .box-input-site-datepicker{
    position: relative;
}
.form-site .box-input-site-datepicker i{
    position: absolute;
    color: #8a0304;
    left: 180px;
    top: 10px;
    font-size: 20px;
}
.form-site .input-site-datepicker{
    width: 192px;
    padding: 10px 0px 10px 20px;
}
/*end input site datepicker*/
/*end default*/




/*blocks*/
/*block-about*/
.block-about {
    overflow: hidden;
}

.block-about .box-1,
.block-about .box-3 {
    padding: 50px 0;
}
.block-about .box-1 .image img {
    width: calc(100% - 20px);
    margin: 10px;
    display: block;
    object-fit: cover;
    filter: grayscale(50%);
    box-shadow: 0 10px 20px 5px #00000030;
    z-index: 2;
}

.block-about .box-1 .box-image-1 {
    padding-top: 50px;
}
.block-about .box-1 .box-image-2 {
    padding-bottom: 50px;
}
.block-about .box-1 .read-more {
    padding-top: 10px;
}
.block-about .box-1 .box {
    margin: 40px 30px;
}
.block-about .box-2 .box {
    margin: 50px;
}
.block-about .box-2 {
    background-color: #f1f1f1;
}
.block-about .box-2 .image img {
    width: 100%;
    display: block;
}
.block-about .box-2 ul li {
    margin: 50px 0 0 0;
}
.block-about .box-2 .icon {
    width: 50px;
    height: 30px;
}
.block-about .box-2 .icon span {
    background-color: var(--light);
}
.block-about .box-2 .icon .line-1 {
    top: 5px;
    left: 5px;
    width: 30px;
    height: 5px;
}

.block-about .box-2 .detail {
    width: calc(100% - 50px);
    font-size: 16px;
    line-height: 1.4;
}

.block-about .box-3 .mondial-title {
    margin: 20px 0;
}
.block-about .box-3 .item {
    height: calc(100% - 100px);
    background-color: var(--light);

    margin: 20px;
    padding: 30px;
    overflow: hidden;
    display: block;
}
.block-about .box-3 ul {
    position: relative;
}
.block-about .box-3 .image img {
    border-radius: 50%;
    max-width: 200px;
    margin: 0 auto;
    display: block;
}
.block-about .box-3 .info {
    padding: 10px;
}
.block-about .box-3 {
    overflow: hidden;
}
.block-about .box-3 .decor {
    width: 600px;
    transform: rotate(240deg);
    left: -10%;
    top: -20%;
    opacity: 0.3;
}


/*block-achievement*/

.block-achievement .list-infos {
    padding: 20px 0;
}
.block-achievement .number {
    font-size: 48px;
    font-family: 'mainb';
}
.block-achievement .detail {
    font-family: 'mainm';
    line-height: 1.4;
    font-size: 18px;
}

.block-achievement ul li .info {
    margin: 5px;
    padding: 30px 10px;
    background-color: var(--light);
    height: calc(100% - 70px);
}

/*end block-achievement*/

/*block-banner*/
.block-banner img {
    width: 100%;
    display: block;
}

/*block-banner-text*/
.block-banner-text {
    height: 100vh;
    overflow: hidden;
}
.block-banner-text .layer {
    width: 100%;
    height: 100%;
    background-color: #00000080;
}
.block-banner-text .info h1 {
    margin: 5px 0;
    font-family: 'mainb';
    letter-spacing: unset;
    color: #fff;
}


/*.block-banner-head*/
.block-banner-head .item {
    position: relative;
}
.block-banner-head .item img {
    width: 100%;
}
.block-banner-head .banner-head-nav button {
    cursor: pointer;
    color: #fff;
    background-color: #00000050;
    border: 0;
    transition: 0.3s;
    border-radius: 50%;
}

.block-banner-head .banner-head-nav button:focus {outline:0;}
.block-banner-head .banner-head-nav button:hover {
    background: #fff;
    color: var(--light);
}
.block-banner-head .banner-head-prev,
.block-banner-head .banner-head-next {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 50%;
    width: 50px;
    height: 50px;
    font-size: 20px;
    line-height: 1;
    transform: translate(0%, -50%);
    box-shadow: 2px 2px 5px #000;
}
.block-banner-head .banner-head-prev {
    left: 10px;
}
.block-banner-head .banner-head-next {
    right: 10px;
}
.owl-carousel .owl-stage, 
.owl-carousel.owl-drag .owl-item{
    -ms-touch-action: pan-y !important;
    touch-action: pan-y !important;
}



/*block-call*/
.block-call i {
    display: inline-block;
    position: fixed;
    left: 15px;
    bottom: 15px;
    font-size: 24px;
    color: #fff;
    background-color: var(--main);
    padding: 10px;
    border: 1px solid var(--main);
    border-radius: 50%;
}
/*ma*/
@media screen{ .block-call { visibility: hidden; } }
@media (max-width: 768px) { .block-call { visibility: visible; } }


/*block-partner*/
.block-partner {
    padding: 50px 0;
}
.block-partner .layer {
    padding: 30px 0;
    background-color: #000000a3;
}
.block-partner .content {
    margin: 20px 0;
    color: #808080;
}

.block-partner .owl-item img {
    filter: grayscale(100%);
    margin: 0 auto;
    height: 140px;
    object-fit: contain;
    transition: 0.3s;
}
.block-partner .owl-item img:hover {
    filter: grayscale(0%);
    transform: scale(1.1);
}
.list-partner {
    position: relative;
}
.list-partner-prev,
.list-partner-next {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    position: absolute;
    top: calc(50% - 20px);
    border: unset;
    background-color: unset;
    cursor: pointer;
    outline: none;
    transition: 0.3s;
}
.list-partner-prev:hover,
.list-partner-next:hover {
    background-color: var(--light);
}
.list-partner-prev i,
.list-partner-next i {
    color: #808080;
    font-size: 20px;
}
.list-partner-prev {
    left: -10px;
}
.list-partner-next {
    right: -10px;
}

/*main menu*/
/*MENU DESKTOP*/
.block-menu-main-in .hidden {
    display: none;
}
.block-menu-main-in>ul {
    justify-content: center;
}
.block-menu-main-in>ul>li {
    display: inline-block;
    position: relative;
}
.block-menu-main-in>ul>li>a {
    font-family: 'mainm';
    text-transform: uppercase;
    padding: 10px 20px;
    display: inline-block;
    position: relative;
    z-index: 1;
}
.block-menu-main-in>ul>li>a.color-gray {
    color: var(--gray);
}
.block-menu-main-in>ul>li:last-child>a {
    padding: 10px 0 10px 20px;
}
.block-menu-main-in>ul>li>ul>li.active>a,
.block-menu-main-in>ul>li.active>a {
    color: var(--main);
}
.block-menu-main-in>ul>li:hover>a {
    color: var(--light);
}
.block-menu-main-in>ul>li>ul>li.active>a:hover {
    color: #fff;
}

/*sub*/
.block-menu-main-in>ul>li>ul {
    visibility: hidden;
    position: absolute;
    background-color: #fff;
    border-bottom: 2px solid var(--main);
    z-index: 1;
    transition: 0.3s;
    opacity: 0;
    top: 40px;
    left: 10px;
}

.block-menu-main-in>ul>li:hover>ul {
    visibility: visible;
    opacity: 1;
    top: 40px;
    left: -10px;
}

.block-menu-main-in>ul>li>ul>li>a::before {
    content: "\25BA";
    color: var(--main);
    padding-right: 10px;
    transition: 0.3s;
}

.block-menu-main-in>ul>li>ul>li>a {
    text-transform: uppercase;
    font-family: 'mainm';
    overflow: hidden;
    position: relative;
    padding: 7px 30px 7px 15px;
    display: block;
    white-space: nowrap;
}

.block-menu-main-in>ul>li>ul>li:hover>a,
.block-menu-main-in>ul>li>ul>li:hover>a::before {
    color: #fff;
}
.block-menu-main-in>ul>li>ul>li>a::after {
    content: "";
    z-index: -1;
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: var(--main);
    transition: 0.3s;
}
.block-menu-main-in>ul>li>ul>li:hover>a::after {
    left: 0;
}


/*MENU MOBILE*/
.fixed-menu {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-color: #000000e0;
    overflow-y: auto;
    z-index: 2;
}

.fixed-menu .hidden {
    display: none;
}

.fixed-menu>ul {
    text-align: left;
    padding: 0px;
}

.fixed-menu>ul>li {
    padding: 5px 0px;
}

.fixed-menu>ul>li>a {
    color: var(--main);
    text-align: left;
    text-transform: uppercase;
    font-size: 17px;
    font-family: 'mainm';
    display: block;
    line-height: 1;
    margin: 10px 30px;

}

.fixed-menu>ul>li>ul>li,
.fixed-menu>ul>li>ul>li>a {
    color: #fff;
    padding-left: 20px;
}

.fixed-menu>ul>li>ul>li>a {
    font-size: 16px;

}
.fixed-menu>ul>li>ul>li>a::before {
    content: "-";
    padding-right: 10px;
    font-size: 20px;
}
.fixed-menu>ul>li>ul>li>ul>li>a {
    font-family: 'mainm';
    padding: 0px 0px 0px 80px;
}
.close-main-menu,
.show-main-menu {
    text-align: right;
}

.show-main-menu b {
    margin: 10px 0 0 0;
}
.close-main-menu b {
    margin: 20px;
}
.show-main-menu b,
.close-main-menu b {
    display: inline-block;
    text-align: center;
    cursor: pointer;
    color: var(--main);
    font-size: 24px;
}
/*end main menu*/



/*block-footer*/
.block-footer {
    color: #fff;
    overflow: hidden;
    background-color: #26282B;
}
.block-footer .layer {
    width: 100%;
    height: 60px;
    background-color: #fff;
    top: 0;
    left: 0;
}
.block-footer img.decor {
    right: -30%;
    top: -30%;
    opacity: 0.3;
}
.block-footer .box-1 {
    top: -50%;
    background-color: var(--main);
}
.block-footer .box-1 .item {
    padding: 30px;
}
.block-footer .box-1 .item .icon {
    font-size: 24px;
    width: 50px;
    height: 50px;
    margin-right: 10px;
    border: 2px solid #fff;
    border-radius: 50%;
}
.block-footer .box-1 .item .text {
    width: calc(100% - 64px);
    font-size: 16px;
    line-height: 1.4;
    font-family: 'mainm';
}
.block-footer .box-2 {
    padding: 80px 0;
}
.block-footer .box-2 .box-in {
    margin: 20px;
}
.block-footer .box-2 .info {
    margin: 10px 0;
}
.block-footer .box-2 .info h3 {
    margin-bottom: 15px;
}
.block-footer .box-2 .info-1 p {
    padding-left: 10px;
    line-height: 1;
    border-left: 3px solid var(--light);
}  
.block-footer .box-2 .info a:hover {
    color: var(--light);
}
.block-footer .box-2 iframe {
    width: calc(100% - 12px);
    height: 200px;
    border: 6px solid #fff;
    display: block;
}

/*end block-footeblcoikr*/











/*trang lien he*/
.block-contact .banner img,
.block-contact .image img {
    width: 100%;
    display: block;
    object-fit: contain;
}

.block-contact-in {
    padding: 50px 0;
}

.block-contact .box-in {
    margin: 20px;
}



/*------------------*/








/*news*/
/*news-detail*/
#news_list,
#news_detail {
    overflow: hidden;
}
#news_detail .decor,
#news_list .decor {
    z-index: -1;
    max-width: 600px;
    transform: rotate(240deg);
    left: -10%;
    top: -20%;
    opacity: 0.3;
}
#news_list .mondial-title {
    margin: 20px 0;
}
#news_main .list-images img {
    width: 100%;
    object-fit: contain;
    display: block;
}
#news_main .list-news-in a {
    display: block;
    margin: 10px;
}
#news_main .box-list-news {
    margin: 0 -10px;
}
#news_main .list-news-in a .related-news-thumb {
    overflow: hidden;
    position: relative;
}
#news_main .list-news-in a .related-news-thumb img {
    height: 200px;
    width: 100%;
    object-fit: cover;
    display: block;
    transition: 0.5s;
}
#news_main .list-news-in a:hover .related-news-thumb img {
    transform: scale(1.1)
}
#news_main .list-news-in .related-news-title {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 10px;
    width: calc(100% - 20px);
    background-color: #00000080;
    border-bottom: 2px solid var(--main);
}
#news_main .list-news-in .related-news-title h4 {
    font-size: 14px;
    font-family: 'mainm';
    color: #fff;
}

h3.news-related-title,
h3.news-other-title {
    padding: 30px 0 10px 0;
    text-transform: uppercase;
    color: var(--main);
}


/*news-grid*/
.news-item-grid {
    height: calc(100% - 22px);
    border: 1px solid #ddd;
    background-color: #fff;
    display: block;
    transition: 0.3s;

}
.news-item-grid:hover,
.news-item-default:hover {
    box-shadow: 0px 10px 10px -10px #404040;
}
.news-item-grid .image {
    overflow: hidden;
}
.news-item-grid .image img {
    width: 100%;
    display: block;
    object-fit: cover;
    transition: 0.2s;
}
.news-item-grid:hover .image img {
    transform: scale(1.1);
}
.news-item-grid .title {
    padding: 15px;
    border-top: 2px solid var(--main);
}

.news-item-grid h4 {
    font-size: 14px;
    margin: 0;
    font-family: 'mainm';
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

/*news-default*/
.block-news {
    padding: 50px 0 100px 0;
}
.news-list-default {
    margin-top: 30px;
}
.news-list-default>li:nth-child(1) { grid-area: alpha1; }
.news-list-default>li:nth-child(2) { grid-area: alpha2; }
.news-list-default>li:nth-child(3) { grid-area: alpha3; }
.news-list-default>li:nth-child(4) { grid-area: alpha4; }
.news-list-default>li:nth-child(5) { grid-area: alpha5; }



.news-list-default>li>a {
    height: 100%;
}
.news-list-default>li>a,
.news-list-default>li>a img.thumbnail {
    display: block;
}
.news-list-default>li>a img.thumbnail {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.news-item-default .image {
    overflow: hidden;
    height: 100%;
}
.news-item-default .logo {
    width: 50px;
    top: 20px;
    left: 20px;
}
.news-item-default .title {
    bottom: 0;
    left: 0;
    width: calc(100% - 30px);
    padding: 15px;
    background-color: #0000009d;
    transition: 0.3s;
}
.news-item-default .title h4 {
    margin: 0;
    border-left: 4px solid var(--main);
    padding-left: 15px;
    color: #fff;
    font-family: 'mainm';
    word-spacing: 1px;
    font-size: 15px;
    transition: 0.3s;
}
.news-item-default:hover .title h4 {
    border-left: 4px solid #fff;
}
.news-item-default:hover .title {
    background-color: #9f805490;
}

@media screen and (min-width: 1025px) {

    h1 { font-size: 40px; letter-spacing: -1px; word-spacing: 2px;}
    h2 { font-size: 32px; word-spacing: 2px;}
    h3 { font-size: 24px; word-spacing: 2px;}

    .box-ckeditor h1 { font-size: 32px;letter-spacing: -1px; word-spacing: 2px;}
    .box-ckeditor h2 { font-size: 24px; }
    .box-ckeditor h3 { font-size: 20px; }
    .box-ckeditor h4 { font-size: 17px; }
    .box-ckeditor h5 { font-size: 14px; }
    .box-ckeditor h6 { font-size: 12px; }

}


@media screen and (min-width: 769px) {
    /*trang chu*/
    .block-banner-text .info h1 {
        font-size: 48px;
    }
    .news-list-default>li:nth-child(1) a,
    .news-list-default>li:nth-child(2) a,
    .news-list-default>li:nth-child(4) a,
    .news-list-default>li:nth-child(5) a {
        width: 300px;
    }

    /*trang bai viet*/
    #blog_main {
        padding: 50px 0;    
    }
    #blog_main .mondial-title {
        text-align: center;
    }
}
@media screen and (min-width: 569px) {
    .dom { display: none; }
    /*trang chu*/
    .block-about .box-1 .read-more {
        text-align: right;
    }
    .block-about .box-1-in {
        margin: 0 -30px;
    }
    .block-achievement ul {
        margin: 0 -5px;
    }
    .block-footer .box-2,
    .block-contact .box,
    .block-about .box-3 .list-infos,
    .block-about .box-2-in {
        margin: 0 -20px;
    }
    .news-list-default>li:nth-child(1) a,
    .news-list-default>li:nth-child(2) a,
    .news-list-default>li:nth-child(4) a,
    .news-list-default>li:nth-child(5) a {
        height: 190px;
    }

    /*trang tin tuc*/
    .news-detail-title {
        text-align: center;
    }
  
    #news_list,
    #news_detail {
        padding: 60px 0;
    }
    .news-list-default {
        display: grid;
        grid-template-areas:
            'alpha1 alpha3 alpha3 alpha4'
            'alpha2 alpha3 alpha3 alpha5';
        gap: 20px;
    }
    .news-list-default>li:nth-child(3) a {
        height: 400px;
    }

    .news-list-grid,
    #news_main .list-images {
        margin: 0 -10px;
    }
    .news-item-grid,
    #news_main .list-images .image {
        margin: 10px;
    }
    .news-item-grid .image img { height: 200px; }
    .news-list-default>li:nth-child(3) .logo {
        width: 100px;
    }
    .news-list-default>li:nth-child(3) .title {
        padding: 20px;
        width: calc(100% - 40px);
    }
    .news-list-default>li:nth-child(3) .title h4 {
        font-size: 20px;
    }
}


@media screen and (max-width: 1280px) {
    .block-menu-main-in>ul>li>a {
        padding: 10px 15px;
    }
}

@media screen and (max-width: 1024px) {

    h1 { font-size: 32px; }
    h2 { font-size: 24px; }
    h3 { font-size: 20px; }

    
}
@media screen and (max-width: 768px) {
    /*trang chu*/
    .block-banner-text .info {
        padding: 20px;
    }

    .block-footer .box-1 ul li:nth-child(3) {
        width: 100%;
    }
    /*trang bai viet*/
    #blog_main {
        padding: 50px 20px;    
    }
}
@media screen and (max-width: 568px) {
    .dod { display: none; }
    .block-about .box-2 .box {
        margin: 50px 20px;
    }
    /*trang chu*/
    .block-about .box-1 .read-more {
        text-align: center;
    }
    .block-banner-head .banner-head-nav button {
        display: none;
    }
    .block-partner {
        padding: 50px 20px;
    }
    .block-about .box-3 .list-infos {
        padding: 0 20px;
    }
    .block-about .box-3 .item {
        margin: 20px 0;
    }
    .block-achievement .list-infos {
        padding: 20px 15px;
    }
    .block-achievement .number {
        font-size: 32px;
    }
    .block-news .mondial-title,
    .block-achievement .mondial-title {
        margin: 0 20px;
    }
    .news-list-default>li:nth-child(1) a, 
    .news-list-default>li:nth-child(2) a, 
    .news-list-default>li:nth-child(4) a, 
    .news-list-default>li:nth-child(5) a {
        height: 240px;
    }

    /*trang tin tuc*/
    .news-item-default {
        margin: 20px 20px 40px 20px;
    }

    #news_list,
    #news_detail {
        padding: 60px 20px;
    }
    .news-list-grid,
    #news_main .list-images {
        margin: 0 -5px;
    }
    .news-item-grid,
    #news_main .list-images .image {
        margin: 10px 5px;
    }
    .news-item-grid .image img { height: 120px; }

}




/*end news*/



/*blog*/

/*end blog*/






/*soan thao van ban trong ckeditor*/
.box-ckeditor [device] {
    display: none;
    width: 100% !important;
}
@media screen and (max-width: 568px) {
    .box-ckeditor [device="mobile"] {display: block;}
}
@media screen and (max-width: 1024px) and (min-width: 569px) {
    .box-ckeditor [device="tablet"] {display: block;}
}
@media screen and (min-width: 1025px) {
	.box-ckeditor [device="desktop"] {display: block;}
}
.box-ckeditor {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.box-ckeditor h1, .box-ckeditor h2, .box-ckeditor h3, .box-ckeditor h4 {
    margin: 15px 0;
}
.box-ckeditor img {
    max-width: 100%;
}
hr {
    margin: 15px 0 20px 0;
	border: 0px;
	border-top: 1px solid #ccc;
}

blockquote {
    color: #404040;
	margin: 20px 0;
	padding: 10px 30px;
    border-left: 4px solid #ddd;
    background-color: #f1f1f1;
}
.box-ckeditor ul {
    margin: 20px 0 20px 20px;
}
.box-ckeditor ul>li {
    list-style: disc;
    margin: 15px 0;
    line-height: 1.4;
}
.box-ckeditor ul>li>ul>li {
    list-style: circle;
    margin: 15px 0;
    line-height: 1.4;
}


.box-image-right img {
    float: right;
    margin: 20px 0px 10px 25px;  
}
.box-image-left img {
    float: left;
    margin: 20px 25px 10px 0px;  
}


/*ma-sm*/@media (min-width: 769px) {
    .box-ckeditor table {margin: auto; }
    .box-image-left img,
    .box-image-right img {
        max-width: 50% !important;
        display: block;
    }
    .box-content-75 {
        width: 75%;
    }
    
}


/*ma-sm*/@media (max-width: 768px) {

    .box-image-left img,
    .box-image-right img {
        max-width: 100% !important;
        margin: 20px 0;
    }
    .box-2-col,
    .box-image-left,
    .box-image-right,
    .box-content-75,
    .box-half-full {
        width: 100% !important;
    }

    .box-image-left td,
    .box-image-right td {
        padding: 10px !important;
    }
    .box-2-col td,
    .box-half-full td {
        padding: 10px 0;
        display: block;
        width: 100% !important;
    }

}
/*ma-sm*/@media (max-width: 568px) {
    .box-half-full tr:nth-child(2n),
    .m-rev tr {
        display: flex;
        flex-direction: column-reverse;
    }
    .box-gallery-2 td,
    .box-gallery-3 td {
        padding: 2px 0;
        display: block;
        width: 100% !important;
    }
}