@font-face {
font-family: "iCiel";
font-style: normal;
font-weight: 400;
src: url(https://mangodigital.vn/wp-content/themes/flatsome-child/fonts/iCielBCLodestone-Regular.eot?) format("eot"),
url(https://mangodigital.vn/wp-content/themes/flatsome-child/fonts/icielbclodestone-regular.ttf) format("truetype"),
url(https://mangodigital.vn/wp-content/themes/flatsome-child/fonts/iCielBCLodestone-Regular.svg#iCielBCLodestone) format("svg"),
url(https://mangodigital.vn/wp-content/themes/flatsome-child/fonts/iCielBCLodestone-Regular.woff) format("woff");
} .font-iciel {
font-family: "iCiel" !important;
}
:root {
background: #000 !important;
}
body {
background: #000 !important;
}
.expand,
.full-width {
max-width: 2560px !important;
}
.color-f1c75b {
color: #f1c75b !important;
}
.color-ca4ccf {
color: #ca4ccf !important;
}
.transparent #logo img {
max-height: unset !important;
}
.removePadding {
padding: unset !important;
}
.tat-hover-custom .img-inner {
overflow: unset !important;
}
.tat-hover-custom:hover .image-zoom img {
transform: scale(1.05);
}
.bg-zoom:hover .bg,
.has-hover:hover .image-zoom img {
transform: scale(1.05) !important;
}
.port-hover-custom .has-format,
.port-hover-custom .image-cover,
.port-hover-custom .video-fit,
.port-hover-custom .box-image {
overflow: unset !important;
}
.port-hover-custom img {
-o-object-fit: unset !important;
object-fit: unset !important;
}
.port-hover-custom .box-image {
margin: 10px auto;
}
.news-hover-custom .box-image {
overflow: unset !important;
margin: 10px auto;
}
.news-hover-custom .image-zoom {
overflow: unset !important;
}
.news-hover-custom .box-image img {
-o-object-fit: contain !important;
object-fit: contain !important;
}
.btn-back {
color: #eb3cf1 !important;
left: 2%;
bottom: 5%;
}
.error404 #header {
background: #000 !important;
}  .mfp-bg.off-canvas-center:not(.dark) {
background-color: #000 !important;
}
.header-bg-color {
background-color: unset !important;
}
.header-shadow .header-wrapper,
.header-wrapper.stuck,
.layout-shadow #wrapper {
box-shadow: unset !important;
}
.transparent .header-main {
height: 100px !important;
}
#logo {
width: 60px !important;
}
@media (min-width: 360px) {
#logo {
padding-top: 30px;
width: 90px !important;
}
}
@media (min-width: 768px) {
#logo {
padding: 20px 0;
width: 90px !important;
}
}
@media (min-width: 1200px) {
#logo {
width: 120px !important;
}
}
@media (min-width: 1920px) {
.logo-left {
padding-left: 50px;
padding-top: 30px;
}
#logo {
width: 150px !important;
}
}
@media (min-width: 360px) {
.mobile-nav .nav-icon a {
padding-top: 40px !important;
}
}
@media (min-width: 1200px) {
.nav-icon a {
padding-top: 40px !important;
}
}
@media (min-width: 1920px) {
.nav-icon a {
padding-right: 30px;
}
}
.icon-menu::before {
content: "";
background: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/buger-menu.png);
background-repeat: no-repeat;
background-size: contain;
width: 60px;
height: 100%;
position: absolute;
right: 0;
top: 0;
}
@media (min-width: 360px) {
.icon-menu::before {
width: 70px;
}
}
@media (min-width: 768px) {
.icon-menu::before {
width: 80px;
height: 100%;
}
}
@media (min-width: 1200px) {
.icon-menu::before {
width: 70px;
}
}
@media (min-width: 1920px) {
.icon-menu::before {
width: 90px;
}
}
.icon-menu {
width: 100px;
height: 66px;
}
.mfp-close {
opacity: 1 !important;
width: 100px;
height: 66px;
right: 2%;
top: 3%;
mix-blend-mode: unset !important;
}
.mfp-close::before {
content: "";
background: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/close-menu2.png);
background-repeat: no-repeat;
background-size: contain;
width: 60px;
height: 100%;
position: absolute;
right: 0;
top: 0;
}
.mfp-close svg {
display: none !important;
}
@media (min-width: 768px) {
.mfp-close::before {
width: 75px;
height: 100%;
top: 10px;
}
}
@media (min-width: 768px) {
.mfp-close::before {
width: 90px;
top: 16px;
}
}
.mfp-container2 {
background: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/menu-bg-mb.jpg);
background-repeat: no-repeat;
background-size: 100% 100%;
}
@media (max-width: 1100px) {
.mfp-container::before {
content: "";
width: 100%;
height: 100vh;
background: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/menu-bg-mb.jpg);
background-repeat: no-repeat;
background-size: 100% 100%;
position: absolute;
top: 0;
left: 0;
}
}
.mfp-bg.off-canvas1 {
background: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/menu-bg-mb.jpg);
background-repeat: no-repeat !important;
background-size: 100% 100% !important;
opacity: 1 !important;
}
@media (min-width: 1100px) {
.mfp-container {
background: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/bg-menu.png); background-repeat: no-repeat;
background-size: cover;
}
}
.off-canvas-center .mfp-content {
}
@media (min-width: 1200px) {
.off-canvas-center .mfp-content {
max-width: 1175px !important;
height: 100vh;
overflow: hidden;
}
}
@media (min-width: 1920px) {
.off-canvas-center .mfp-content {
max-width: 100% !important;
height: 100vh;
}
}  .sec-menu {
padding-left: 1em;
}
@media (min-width: 768px) {
.sec-menu {
padding-left: 9em;
padding-top: 4em !important;
}
}
@media (min-width: 1200px) {
.sec-menu {
padding-top: 0 !important;
padding-left: 1em;
min-height: 100vh;
}
.row-menu {
padding-left: 12em;
}
}
@media (min-width: 1920px) {
.header-block-block-1 {
margin: auto;
}
.menu-block1 {
display: none;
}
.row-menu {
margin-left: -16em;
padding-left: 0 !important;
}
.menu-block2 {
flex-basis: 40% !important;
max-width: 40% !important;
}
.menu-block3 {
flex-basis: 60% !important;
max-width: 60% !important;
}
}
.menu-logo {
position: absolute;
width: 20% !important;
top: -65px;
left: 20px !important;
}
@media (min-width: 1200px) {
.menu-logo {
width: 10% !important;
top: -65px;
left: 0;
}
}
@media (min-width: 1366px) {
.menu-logo {
left: 5px !important;
}
}
@media (min-width: 1440px) {
.menu-logo {
width: 13% !important;
}
}
@media (min-width: 1600px) {
.menu-logo {
width: 10% !important;
}
}
@media (min-width: 1920px) {
.menu-logo {
width: 9% !important;
left: 35px !important;
top: -54px;
}
}
.menu-wrap {
padding-top: 20px;
padding-left: 20px;
font-family: iCiel;
}
@media (min-width: 320px) {
.menu-wrap {
padding-top: 40px;
}
}
@media (min-width: 360px) and (max-width: 767px) {
.menu-wrap {
padding-left: 60px;
}
}
@media (min-width: 768px) {
.menu-wrap {
padding-top: 20px;
}
}
@media (min-width: 1200px) {
.menu-wrap {
padding: 0;
}
}
@media (min-width: 1440px) {
.menu-wrap {
padding-left: 0px;
padding-top: 45px;
}
}
@media (min-width: 1440px) and (max-height: 740px) {
.menu-wrap {
padding-left: 0px;
padding-top: 0;
margin-top: -3em;
}
}
@media (min-width: 1440px) and (max-height: 780px) {
.menu-wrap {
padding-left: 0px;
padding-top: 0;
}
}
@media (min-width: 1920px) {
.menu-wrap {
padding-top: 70px;
}
}
.menu-wrap span {
font-size: 20px;
line-height: 30px;
}
@media (min-width: 320px) {
.menu-wrap span {
font-size: 30px;
line-height: 40px;
}
}
@media (min-width: 768px) {
.menu-wrap span {
font-size: 40px;
line-height: 60px;
}
}
@media (min-width: 1366px) {
.menu-wrap span {
font-size: 42px;
line-height: 65px;
}
}
@media (min-width: 1440px) {
.menu-wrap span {
font-size: 45px;
line-height: 75px;
}
}
@media (min-width: 1600px) and (max-height: 780px) {
.menu-wrap span {
font-size: 45px;
line-height: 66px;
}
}
@media (min-width: 1920px) {
.menu-wrap span {
font-size: 65px;
line-height: 90px;
}
}
.menu-wrap .ux-menu-link__link {
color: #5d5c66;
padding-bottom: 0 !important;
padding-top: 0 !important;
}
.menu-wrap .ux-menu-link--active .ux-menu-link__link,
.ux-menu-link:hover .ux-menu-link__link {
color: #fff !important;
}
.mf-content {
padding-top: 16px;
color: #fff;
}
@media (min-width: 360px) {
.mf-content {
}
}
.menu-wrap .menu-item.active {
color: #fff;
}
.mf-content p:nth-child(1) {
font-size: 20px;
}
.mf-content p:nth-child(2) {
font-size: 15px;
}
@media (min-width: 1920px) {
.mf-content p:nth-child(1) {
font-size: 30px;
}
.mf-content p:nth-child(2) {
font-size: 20px;
}
}
.img-menu-hover {
animation: float 10s ease-in-out infinite;
box-shadow: unset !important;
}
@media (min-width: 360px) and (max-width: 767px) {
.img-menu-hover {
margin-left: 45px;
}
}
@media (min-width: 1200px) {
.img-menu-hover {
position: absolute;
top: 0;
left: 30%;
}
}
@media (min-width: 1440px) {
.img-menu-hover1 {
padding-top: 5em;
padding-left: 2em;
}
}
@media (min-width: 1920px) {
.img-menu-hover {
width: 80% !important;
}
.hover-home {
width: 60% !important;
}
}
@media (min-width: 1200px) {
.hover-home {
width: 43% !important;
left: 46% !important;
top: -1em !important;
}
}
@media (min-width: 1366px) {
.hover-home {
left: 48% !important;
top: 0em !important;
}
}
@media (min-width: 1400px) {
.hover-home {
left: 53% !important;
top: 3em !important;
}
}
@media (min-width: 1920px) {
.hover-home {
left: 56% !important;
width: 34% !important;
}
}
@media (min-width: 2560px) {
.hover-home {
left: 59% !important;
width: 29% !important;
}
}
.hover-aboutus {
}
@media (min-width: 1200px) {
.hover-aboutus {
width: 65% !important;
left: 41% !important;
top: 11% !important;
}
}
@media (min-width: 1366px) {
.hover-aboutus {
left: 42% !important;
}
}
@media (min-width: 1400px) {
.hover-aboutus {
width: 73% !important;
left: 45% !important;
top: 15% !important;
}
}
@media (min-width: 1920px) {
.hover-aboutus {
left: 49% !important;
width: 53% !important;
top: 20% !important;
}
}
@media (min-width: 2560px) {
.hover-aboutus {
left: 51% !important;
width: 42% !important;
top: 17% !important;
}
}
.hover-career {
}
@media (min-width: 1200px) {
.hover-career {
width: 45% !important;
left: 47% !important;
top: 10% !important;
}
}
@media (min-width: 1400px) {
.hover-career {
left: 51% !important;
top: 20% !important;
}
}
@media (min-width: 1920px) {
.hover-career {
left: 54% !important;
top: 22% !important;
width: 35% !important;
}
}
@media (min-width: 2560px) {
.hover-career {
left: 56% !important;
top: 23% !important;
width: 25% !important;
}
}
.hover-news {
}
@media (min-width: 1200px) {
.hover-news {
width: 35% !important;
left: 50% !important;
top: 10% !important;
}
}
@media (min-width: 1366px) {
.hover-news {
left: 50% !important;
top: 10% !important;
}
}
@media (min-width: 1400px) {
.hover-news {
width: 39% !important;
left: 52% !important;
top: 17% !important;
}
}
@media (min-width: 1920px) {
.hover-news {
left: 55% !important;
top: 17% !important;
width: 28% !important;
}
}
@media (min-width: 2560px) {
.hover-news {
left: 57% !important;
top: 19% !important;
width: 23% !important;
}
}
.hover-social {
}
@media (min-width: 1200px) {
.hover-social {
width: 37% !important;
top: 13% !important;
left: 50% !important;
}
}
@media (min-width: 1400px) {
.hover-social {
width: 40% !important;
top: 24% !important;
left: 53% !important;
}
}
@media (min-width: 1920px) {
.hover-social {
left: 55% !important;
width: 25% !important;
}
}
@media (min-width: 2560px) {
.hover-social {
left: 56% !important;
width: 25% !important;
top: 26% !important;
}
}
.hover-trend {
}
@media (min-width: 1200px) {
.hover-trend {
width: 45% !important;
top: 24% !important;
left: 45% !important;
}
}
@media (min-width: 1400px) {
.hover-trend {
top: 29% !important;
left: 50% !important;
}
}
@media (min-width: 1600px) {
.hover-trend {
width: 50% !important;
}
}
@media (min-width: 1920px) {
.hover-trend {
left: 52% !important;
width: 37% !important;
}
}
@media (min-width: 2560px) {
.hover-trend {
left: 55% !important;
width: 32% !important;
}
}
.hover-work {
}
@media (min-width: 768px) {
.hover-work {
width: 50% !important;
}
}
@media (min-width: 1200px) {
.hover-work {
width: 40% !important;
left: 47% !important;
top: 10% !important;
}
}
@media (min-width: 1440px) {
.hover-work {
width: 42% !important;
left: 50% !important;
top: 18% !important;
}
}
@media (min-width: 1920px) {
.hover-work {
width: 32% !important;
left: 56% !important;
top: 22% !important;
}
}
@media (min-width: 2560px) {
.hover-work {
width: 30% !important;
left: 55% !important;
top: 18% !important;
}
}
@keyframes float {
0% { transform: translatey(0px);
}
50% { transform: translatey(-10px);
}
100% { transform: translatey(0px);
}
}
@media (min-width: 768px) {
@keyframes float {
0% { transform: translatey(0px);
}
50% { transform: translatey(-20px);
}
100% { transform: translatey(0px);
}
}
}
.img-menu-hover {
display: none;
}
.img-menu-hover.active {
display: block;
animation: fade_in 1s ease-in-out forwards, float 5s ease-in-out infinite;
}
.float {
animation: float 5s ease-in-out infinite;
}
@keyframes scale {
from {
scale: 0;
}
to {
scale: 1;
}
}
@keyframes fade_in {
from {
opacity: 0;
}
to {
opacity: 1;
}
}  .home-slider .flickity-page-dots {
pointer-events: all !important;
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/bg-dot-mb.png);
background-repeat: no-repeat;
background-size: 100% 100%;
right: 0 !important;
left: 0 !important;
bottom: 0 !important;
height: 70px !important;
}
@media (min-width: 360px) {
.home-slider .flickity-page-dots {
height: 80px !important;
}
}
@media (min-width: 414px) {
.home-slider .flickity-page-dots {
height: 90px !important;
}
}
@media (min-width: 768px) {
.home-slider .flickity-page-dots {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/bg-dot.png);
height: 150px !important;
}
}
@media (min-width: 1680px) {
.home-slider .flickity-page-dots {
height: 190px !important;
}
}
.home-slider .flickity-page-dots li.dot {
position: relative;
margin: 2.4em 20px 0 20px !important;
height: 15px !important;
width: 15px !important;
border: 1px solid #4f4c70 !important;
}
@media (min-width: 360px) {
.home-slider .flickity-page-dots li.dot {
margin: 2.9em 20px 0 20px !important;
}
}
@media (min-width: 414px) {
.home-slider .flickity-page-dots li.dot {
height: 17px !important;
width: 17px !important;
margin: 3em 20px 0 20px !important;
}
}
@media (min-width: 768px) {
.home-slider .flickity-page-dots li.dot {
margin: 6.8em 40px 0 40px !important;
height: 17px !important;
width: 17px !important;
}
}
@media (min-width: 1200px) {
.home-slider .flickity-page-dots li.dot {
margin: 6.4em 40px 0 40px !important;
height: 15px !important;
width: 15px !important;
}
}
@media (min-width: 1680px) {
.home-slider .flickity-page-dots li.dot {
margin: 8em 40px 0 40px !important;
height: 20px !important;
width: 20px !important;
}
}
.home-slider .flickity-page-dots li.dot::after {
content: "";
background-color: #4f4c70;
position: absolute;
height: 5px;
width: 5px;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
border-radius: 50%;
}
@media (min-width: 414px) {
.home-slider .flickity-page-dots li.dot::after {
height: 5px;
width: 5px;
}
.home-slider .flickity-page-dots li.dot.is-selected::after {
height: 8px;
width: 8px;
}
}
@media (min-width: 1680px) {
.home-slider .flickity-page-dots li.dot::after {
height: 8px;
width: 8px;
}
.home-slider .flickity-page-dots li.dot.is-selected::after {
height: 12px;
width: 12px;
}
}
.home-slider .flickity-page-dots .dot.is-selected::before {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/select.png);
content: "";
position: absolute;
width: 80px;
height: 30px;
background-repeat: no-repeat;
background-size: 100% 100%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
@media (min-width: 768px) {
.home-slider .flickity-page-dots .dot.is-selected::before {
width: 100px;
height: 50px;
}
}
@media (min-width: 1680px) {
.home-slider .flickity-page-dots .dot.is-selected::before {
width: 120px;
height: 55px;
}
}
.home-slider .flickity-page-dots li.dot.is-selected { height: 17px !important;
width: 17px !important;
background-color: transparent !important;
}
@media (min-width: 1680px) {
.home-slider .flickity-page-dots li.dot.is-selected {
height: 25px !important;
width: 25px !important;
}
}
@media (min-width: 1440px) and (max-width: 1535px) {
.b1-text {
bottom: 27% !important;
}
}
@media (min-width: 2000px) {
.b1-text {
bottom: 25% !important;
}
}
.banner-title p {
font-family: iCiel !important;
font-size: 14px !important;
}
@media (min-width: 768px) {
.banner-title p {
font-size: 20px !important;
}
}
@media (min-width: 1200px) {
.banner-title p {
font-size: 35px !important;
}
}
@media (min-width: 1400px) {
.banner-title p {
font-size: 40px !important;
}
}
@media (min-width: 1920px) {
.banner-title p {
font-size: 50px !important;
}
}
.banner-xoai img {
animation: float_banner 5s ease-in-out infinite;
}
.banner-xoai .img-inner, .banner-xoai-mb .img-inner, .ball1 .img-inner {
overflow: unset !important;
}
.men-ship {
animation: float_banner 7s ease-in-out infinite;
}
@keyframes float_banner {
0% { transform: translatey(0px);
}
50% { transform: translatey(-20px);
}
100% { transform: translatey(0px);
}
}
@media (min-width: 1200px) {
.banner-xoai {
left: 53% !important;
width: 38% !important;
}
}
@media (min-width: 1400px) {
.banner-xoai {
width: 70vh !important;
}
}
@media (min-width: 1600px) {
.banner-xoai {
width: 70vh !important;
}
}
@media (min-width: 1920px) {
.banner-xoai {
width: 35% !important;
top: 10% !important;
}
}
.ball1 img {
animation: float_2 7s ease-in-out infinite;
}
.ball2 img {
animation: float_2 9s ease-in-out infinite;
}
@keyframes float_2 {
0% { transform: translatey(0px);
}
50% { transform: translatey(-15px);
}
100% { transform: translatey(0px);
}
} .social-banner-text {
bottom: 13% !important;
} .sec-work .section-bg.bg-loaded {
background-size: contain !important;
background-position-y: 30% !important;
}
@media (min-width: 1200px) {
.sec-work .section-bg.bg-loaded {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/work/work-home-bg.jpg) !important;
background-position-y: 10% !important;
}
}
@media (min-width: 1920px) {
.home-work-first-wrap {
flex-basis: 66% !important;
max-width: 66% !important;
}
}
.bk_home-work-first:before {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/work/border-home-work.png);
background-repeat: no-repeat;
background-size: 100%;
left: 50%;
position: absolute;
z-index: -1;
width: 92%;
height: 100%;
transform: translateX(-50%);
}
.bk_home-work-first .image-cover {
border-radius: 8px;
}
.bk_home-work-first:hover .image-cover {
border-radius: 17px !important;
}
@media (min-width: 1600px) {
.bk_home-work-first:hover .image-cover {
border-radius: 20px !important;
}
}
@media (min-width: 1680px) {
.bk_home-work-first:hover .image-cover {
border-radius: 24px !important;
}
}
@media (min-width: 1920px) {
.bk_home-work-first:hover .image-cover {
border-radius: 25px !important;
}
}
.bk_home-work-first .has-hover:hover img {
transition: all 2s;
margin-top: 18px !important;
}
@media (min-width: 1600px) {
.bk_home-work-first .has-hover:hover img {
margin-top: 20px !important;
}
}
@media (min-width: 1680px) {
.bk_home-work-first .has-hover:hover img {
margin-top: 24px !important;
}
}
@media (min-width: 1920px) {
.bk_home-work-first .has-hover:hover img {
margin-top: 30px !important;
}
}
.home-work-first:after {
content: "";
position: absolute;
width: 100%;
height: 65px;
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/work/footer-main.png);
background-repeat: no-repeat;
bottom: -50px;
left: 0;
background-size: contain;
z-index: -1;
}
@media (min-width: 1920px) {
.home-work-first:after {
bottom: -45px;
}
}
.home-work-first .box-text {
display: none;
}
.bk_home-work-first .box-image {
width: 99% !important;
}
.bk_home-work-first .box-image img {
padding: 2px 1px 1px 1px;
border-radius: 5px;
}
@media (min-width: 1200px) {
.bk_home-work-first .box-image {
width: 91% !important;
}
.bk_home-work-first .box-image img {
padding: 5px 1px 1px 1px;
border-radius: 13px;
}
}
@media (min-width: 1400px) {
.bk_home-work-first .box-image {
width: 91% !important;
}
.bk_home-work-first .box-image img {
padding: 7px 3px 3px 3px;
border-radius: 16px;
}
}
.home-work-two .portfolio-box .box-image:before {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/work/border-home-work-2.png);
background-repeat: no-repeat;
background-size: 100%;
left: 50%;
position: absolute;
z-index: 2;
width: 100%;
height: 100%;
transform: translateX(-50%);
}
.home-work-two .image-cover {
border-radius: 8px;
}
@media (min-width: 1200px) {
.home-work-two .portfolio-box .box-image img {
padding: 4px;
}
}
.home-work-two .flickity-slider .col {
width: 80%;
margin: 0 10px;
}
@media (min-width: 1200px) {
.home-work-two .flickity-slider .col {
width: 40%;
margin: 0 30px;
}
.home-work-two .flickity-button {
display: none;
}
}
.home-work-slider .box-text {
display: none !important;
}  .trend-banner .banner-bg.fill {
border-radius: 16px !important;
}
@media (min-width: 1200px) {
.trend-banner .banner-bg.fill {
border-radius: 25px !important;
}
}
.trend-banner.bg-zoom:hover .bg {
transition: all 2s !important;
margin-right: 25px !important;
}
.sec-digital .section-bg.bg-loaded {
background-size: contain !important;
background-position-y: 50% !important;
}
@media (min-width: 1200px) {
.sec-digital .section-bg.bg-loaded {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/digital/mango-digital-bg-desk.jpg) !important;
background-size: 100% !important;
background-position: bottom !important;
}
}
@media (max-width: 767px) {
.banner-digital-home .text-right {
text-align: center !important;
}
.banner-make-mango .text-right {
text-align: center !important;
}
.banner-make-mango .btn-readmore .button {
scale: 0.8;
}
}
.btn-readmore .button {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/button-bg.png);
background-size: 100% 100%;
background-repeat: no-repeat;
padding: 15px 60px 15px 25px;
}
@media (min-width: 1200px) {
.btn-readmore .button {
padding: 15px 80px 20px 40px;
}
}
.btn-readmore:hover .button {
opacity: 1 !important;
}
.btn-readmore .button span.btn-text {
text-transform: initial;
color: #fff;
margin-top: 8px;
}
@media (min-width: 1200px) {
.btn-readmore .button span.btn-text {
font-size: 18px;
}
}
.btn-readmore .icon-readmore {
position: relative;
}
.btn-readmore .icon-readmore::before {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/btn-arrow2.png);
width: 35px;
height: 17px;
background-size: contain;
top: -9px;
position: absolute;
background-repeat: no-repeat;
}
@media (min-width: 1200px) {
.btn-readmore .icon-readmore::before {
width: 50px;
height: 24px;
top: -13px;
}
}
.btn-readmore:hover .icon-readmore {
opacity: 0;
}
.arrow {
display: none;
position: absolute;
transform: rotate(-90deg);
top: 34px;
right: 35px;
}
@media (min-width: 1200px) {
.arrow {
top: 43px;
right: 50px;
}
}
.btn-readmore:hover .arrow {
display: block;
}
.btn-readmore .arrow span {
display: block;
width: 14px;
height: 28px;
transform: rotate(-45deg);
margin: -23px;
animation: animate 2s infinite;
animation: animate 2s infinite;
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/btn-arrow.png);
background-repeat: no-repeat;
background-size: contain;
}
@media (min-width: 1200px) {
.btn-readmore .arrow span {
width: 20px;
height: 30px;
}
}
.btn-readmore .arrow span:nth-child(2) {
animation-delay: -0.2s;
}
.btn-readmore .arrow span:nth-child(3) {
animation-delay: -0.4s;
}
@keyframes animate {
0% {
opacity: 0;
transform: rotate(90deg) translate(-10px, -50%);
}
50% {
opacity: 1;
}
100% {
opacity: 0;
transform: rotate(90deg) translate(20px, -50%);
}
}  @media (min-width: 1200px) { .we-do-star {
width: 11% !important;
bottom: 0 !important;
}
.we-do-ball {
width: 9% !important;
left: 5% !important;
}
}
@media (min-width: 1400px) {
.we-do-star {
width: 15% !important;
bottom: -10% !important;
}
}
.col.we-do-slider-wrap {
padding-top: 12px !important;
position: relative;
}
@media (min-width: 360px) {
.col.we-do-slider-wrap {
padding-top: 26px !important;
}
}
@media (min-width: 375px) {
.col.we-do-slider-wrap {
padding-top: 30px !important;
margin-left: -1em;
}
}
@media (min-width: 414px) {
.col.we-do-slider-wrap {
padding-top: 37px !important;
margin-left: -2em;
}
}
@media (min-width: 768px) {
.col.we-do-slider-wrap {
padding-top: 0 !important;
margin-left: -3em;
}
}
@media (min-width: 1200px) {
.col.we-do-slider-wrap {
padding-top: 33px !important;
margin-left: -6em;
}
}
@media (min-width: 1400px) {
.col.we-do-slider-wrap {
padding-top: 40px !important;
margin-left: -9em;
}
}
@media (min-width: 1600px) {
.col.we-do-slider-wrap {
padding-top: 51px !important;
margin-left: -11em;
}
}
@media (min-width: 1920px) {
.col.we-do-slider-wrap {
padding-top: 66px !important;
margin-left: -14em;
}
}
.we-do-item {
width: 100%;
font-family: "iCiel";
color: #fff;
text-align: center;
font-size: 20px;
position: absolute;
opacity: 0;
z-index: 0;
position: absolute;
left: 0;
top: 0;
}
@media (min-width: 360px) {
.we-do-item {
font-size: 25px;
}
}
@media (min-width: 375px) {
.we-do-item {
font-size: 27px;
}
}
@media (min-width: 414px) {
.we-do-item {
font-size: 30px;
}
}
@media (min-width: 768px) {
.we-do-item {
font-size: 20px;
}
}
@media (min-width: 1200px) {
.we-do-item {
font-size: 29px;
}
}
.we-do-item p { background: #6b2690;
background: linear-gradient(to top, #6b2690 16%, #ffffff 50%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
margin-top: 10px;
margin-bottom: 10px !important;
}
.we-do-active p {
color: #fff;
background: unset;
-webkit-background-clip: unset;
-webkit-text-fill-color: unset;
}
.we-do1 {
transform: translateZ(-36px) rotateX(35deg);
}
.we-do2 {
transform: translateZ(-36px) rotateX(-35deg);
}
@media (min-width: 1200px) {
.we-do-light .img {
margin-left: 0 !important;
margin-right: auto !important;
}
}
.vong-xoay-wrap {
min-height: 230px;
}
@media (min-width: 768px) {
.vong-xoay-wrap {
min-height: 100px;
}
}
@media (min-width: 1200px) {
.vong-xoay-wrap {
min-height: 200px;
}
}
@media (min-width: 1920px) {
.vong-xoay-wrap {
min-height: 250px;
}
}
.vong-xoay {
display: none;
}
@media (min-width: 360px) and (max-width: 375px) {
.vong-xoay {
margin-bottom: 0 !important;
margin-top: 22px;
}
}
@media (min-width: 390px) and (max-width: 413px) {
.vong-xoay {
margin-bottom: 0 !important;
margin-top: 20px;
}
}
@media (min-width: 414px) and (max-width: 428px) {
.vong-xoay {
margin-bottom: 0 !important;
margin-top: 30px;
}
}
.vc-active {
display: block;
}
.home-we-do .we-do-item {
font-size: 18px;
}
.col.home-we-do {
padding-top: 19px !important;
margin-left: -1em;
scale: 1.1;
}
@media (min-width: 375px) {
.col.home-we-do {
scale: 1.05;
}
}
@media (min-width: 390px) {
.col.home-we-do {
padding-top: 19px !important;
scale: 1.1;
}
}
@media (min-width: 414px) {
.col.home-we-do {
padding-top: 29px !important;
scale: 1.05;
}
}
@media (min-width: 428px) {
.col.home-we-do {
padding-top: 31px !important;
}
}
@media (min-width: 768px) {
.col.home-we-do {
padding-top: 20px !important;
}
}
@media (min-width: 375px) {
.home-we-do .we-do-item {
font-size: 20px;
}
}
@media (min-width: 414px) {
.home-we-do .we-do-item {
font-size: 22px;
}
}
@media (min-width: 768px) {
.home-we-do .we-do-item {
font-size: 25px;
}
}
.we-do-light {
min-height: 155px;
}
@media (min-width: 414px) {
.we-do-light {
min-height: 170px;
}
}
@media (min-width: 768px) and (max-width: 1023px) {
.we-do-light {
padding-top: 1.5em !important;
}
}
@media (min-width: 1200px) {
.we-do-light {
min-height: 180px;
}
.home-we-do .we-do-item {
font-size: 32px;
}
.we-do-light-home.col {
padding-top: 1em !important;
margin-left: 1em !important;
}
.col.home-we-do {
padding-top: 27px !important;
scale: 1;
margin-left: -2em;
}
}
@media (min-width: 1366px) {
.col.home-we-do {
padding-top: 31px !important;
scale: 1;
margin-left: -4em;
}
}
@media (min-width: 1400px) {
.we-do-light {
min-height: 200px;
}
.col.home-we-do {
scale: 1.2;
padding-top: 38px !important;
margin-left: -2em;
}
}
@media (min-width: 1600px) {
.we-do-light {
min-height: 210px;
}
.col.home-we-do {
scale: 1.2;
padding-top: 45px !important;
}
}
@media (min-width: 1680px) {
.we-do-light {
min-height: 220px;
}
.col.home-we-do {
padding-top: 50px !important;
scale: 1.3;
}
}
@media (min-width: 1920px) {
.home-we-do .we-do-item {
scale: 1;
font-size: 30px;
}
.col.home-we-do {
padding-top: 56px !important;
margin-left: -3em;
}
.we-do-light-home.we-do-light {
min-height: 250px;
}
}
.client-ball {
top: -35% !important;
}   .icon-client .img {
width: 90% !important;
}
@media (min-width: 1200px) {
.icon-client .img {
width: 60% !important;
}
}
.icon-coffee .img {
width: 45% !important;
}  @media (min-width: 1200px) {
.sec-news .section-bg.bg-loaded {
background-image: unset !important;
}
} .home-news_bk .box-image:before {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/news-border.png);
background-repeat: no-repeat;
background-size: 100%;
left: 50%;
position: absolute;
z-index: 2;
width: 100%;
height: 100%;
transform: translateX(-50%);
top: -1px;
}
.home-new_bk .box-image {
padding: 5px;
border-radius: 12px !important;
}
.home-news _bk.image-cover {
border-radius: 15px !important;
}
.home-news1 .box-blog-post:before {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/news-border.png);
background-repeat: no-repeat;
background-size: 100%;
left: 50%;
position: absolute;
z-index: 2;
width: 100%;
height: 100%;
transform: translateX(-50%);
}
.home-news1 .image-cover {
border-radius: 8px;
}
@media (min-width: 1200px) {
.home-news1 .image-cover img {
padding: 8px 8px 2px 8px;
border-radius: 16px;
transition: all 1s;
}
.home-news1 .has-hover:hover img {
padding: 14px 21px 9px 21px;
border-radius: 25px;
}
}
@media (min-width: 1400px) {
.home-news1 .has-hover:hover img {
padding: 14px 24px 9px 28px;
border-radius: 35px;
}
}
@media (min-width: 1600px) {
.home-news1 .has-hover:hover img {
padding: 18px 28px 11px 28px;
}
}
@media (min-width: 1920px) {
.home-news1 .has-hover:hover img {
padding: 21px 36px 18px 36px;
}
}
.home-news .flickity-slider .col {
width: 70%;
margin: 0 10px;
}
@media (min-width: 1200px) {
.home-news .flickity-slider .col {
width: 40%;
margin: 0 30px;
}
.home-news .flickity-slider .col {
width: 60%;
margin: 0 30px;
}
}
.home-news .post-title {
text-transform: uppercase;
color: #fff;
}
@media (min-width: 1200px) {
.home-news .post-title {
font-size: 18px;
}
}
@media (min-width: 1920px) {
.home-news .post-title {
font-size: 22px;
}
}
.home-news .post-title a:hover {
color: #fff !important;
}
.home-news .post-title {
text-align: left;
width: 70%;
}
.home-news .box-blog-post .is-divider {
display: none !important;
}
.home-news .box-blog-post .button {
margin-top: 0;
float: right;
text-transform: initial;
position: absolute;
right: 5px;
top: 0;
}
@media (min-width: 1200px) {
.home-news .box-blog-post .button {
font-size: 18px;
padding-right: 15px;
right: 15px;
}
}
@media (min-width: 1920px) {
.home-news .box-blog-post .button {
font-size: 21px;
padding-right: 15px;
}
}
.home-news .box-blog-post .button::before {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/new-icon2.png);
background-size: 100%;
background-repeat: no-repeat;
width: 10px;
height: 15px;
position: absolute;
right: -12px;
top: 30%;
}
@media (min-width: 1200px) {
.home-news .box-blog-post .button::before {
width: 15px;
height: 25px;
top: 31%;
}
}
@media (min-width: 1920px) {
.home-news .box-blog-post .button::before {
width: 15px;
height: 25px;
top: 33%;
}
}
.home-news .flickity-button {
display: none !important;
}  @media (min-width: 1200px) {
.sec-keys .section-bg.bg-loaded {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/keys/bg-keys-desk.jpg) !important;
background-position: bottom !important;
background-size: 100% !important;
}
}
@media (min-width: 2000px) {
.sec-keys {
padding-top: 250px !important;
}
}
.home-keys .flickity-slider .img {
width: 70% !important;
margin: 0 15px;
}
@media (min-width: 768px) {
.home-keys .flickity-slider .img {
width: 60% !important;
margin: 0 20px;
}
}
@media (min-width: 1200px) {
.home-keys .flickity-slider .img {
width: 30% !important;
margin: 0 20px;
}
}
.slider-keys .flickity-prev-next-button {
display: block !important;
}
.slider-keys .flickity-prev-next-button svg {
display: none !important;
}
.slider-keys .flickity-prev-next-button.previous {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/keys/key-prev.png);
background-size: 100%;
background-repeat: no-repeat;
position: absolute;
top: 50%;
transform: translate(0, -50%) !important;
width: 25px;
height: 25px;
left: 6% !important;
}
.slider-keys .flickity-prev-next-button.next {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/keys/key-next.png);
background-size: 100%;
background-repeat: no-repeat;
position: absolute;
top: 50%;
transform: translate(0, -50%) !important;
width: 25px;
height: 25px;
right: 6% !important;
}
@media (min-width: 768px) {
.slider-keys .flickity-prev-next-button.previous {
width: 30px;
height: 30px;
left: 15% !important;
}
.slider-keys .flickity-prev-next-button.next {
width: 30px;
height: 30px;
right: 15% !important;
}
}
@media (min-width: 1200px) {
.slider-keys .flickity-prev-next-button.previous {
width: 40px;
height: 60px;
left: -5% !important;
}
.slider-keys .flickity-prev-next-button.next {
width: 40px;
height: 60px;
right: -5% !important;
}
}   .menu-our-works li {
outline: none !important;
border: none !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
}
.menu-our-works li a {
outline: none !important;
border: none !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
}
.menu-our-works .nav-line-bottom > li > a::before {
content: unset !important;
}
.portfolio-element-wrapper .nav-line-bottom > li > a::before {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/active-back.png) !important;
position: absolute !important;
width: 100px;
height: 40px;
background-repeat: no-repeat;
background-size: contain;
background-color: unset;
bottom: -28px;
z-index: -1;
}
.menu-our-works li.active a::before {
content: "" !important;
background-color: transparent !important;
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/active-back.png) !important;
position: absolute !important;
width: 90px;
height: 55px;
background-repeat: no-repeat;
background-size: contain;
background-color: unset;
bottom: -28px;
z-index: -1;
left: 50%;
transform: translateX(-50%);
transition: unset !important;
}
@media (min-width: 360px) {
.menu-our-works li.active a::before {
bottom: -36px;
}
}
@media (min-width: 375px) {
.menu-our-works li.active a::before {
bottom: -35px;
}
}
@media (min-width: 1200px) {
.menu-our-works li.active a::before {
width: 120px;
height: 50px;
}
}
@media (min-width: 1600px) {
.menu-our-works li.active a::before {
width: 140px;
}
}
@media (min-width: 1920px) {
.menu-our-works li.active a::before {
width: 170px;
}
} @media (min-width: 768px) {
.menu-our-works ul li a:hover::before {
content: "" !important;
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/active-back.png) !important;
position: absolute !important;
width: 120px;
height: 50px;
background-repeat: no-repeat;
background-size: contain;
background-color: unset;
bottom: -28px;
z-index: -1;
left: 50%;
transform: translateX(-50%);
}
}
@media (min-width: 1200px) {
.menu-our-works ul li a:hover::before {
bottom: -28px;
}
}
@media (min-width: 1600px) {
.menu-our-works ul li a:hover::before {
width: 140px;
bottom: -35px;
}
}
@media (min-width: 1920px) {
.menu-our-works ul li a:hover::before {
width: 160px;
}
}
.portfolio-element-wrapper ul li a {
background-repeat: no-repeat;
background-size: contain;
text-indent: 260%;
white-space: nowrap;
overflow: hidden;
padding: 6px 0px;
width: 60px;
}
.menu-our-works ul li {
margin: 0 7px 10px 7px !important;
}
@media (min-width: 390px) {
.menu-our-works ul li {
margin: 0 10px 10px 10px !important;
}
}
.menu-our-works ul li:first-child {
margin-left: 7px !important;
}
@media (min-width: 1200px) {
.menu-our-works ul li {
margin: 0 20px !important;
}
}
@media (min-width: 1600px) {
.menu-our-works ul li {
margin: 0 30px !important;
}
}
.menu-our-works ul li a {
background-repeat: no-repeat;
background-size: contain;
overflow: hidden;
width: 95px;
height: 45px;
}
@media (min-width: 414px) {
.menu-our-works ul li a {
width: 100px;
height: 50px;
}
}
@media (min-width: 1200px) {
.menu-our-works ul li a {
width: 120px;
}
}
@media (min-width: 1400px) {
.menu-our-works ul li a {
width: 150px;
}
}
@media (min-width: 1600px) {
.menu-our-works ul li a {
width: 170px;
}
}
@media (min-width: 1920px) {
.menu-our-works ul li a {
width: 190px;
}
}
.menu-our-works ul li a span {
display: none;
}
#tab-all a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/all-inactive2.png);
}
#tab-all.active a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/all2.png);
}
@media (min-width: 1200px) {
#tab-all a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/all-inactive1.png);
}
#tab-all.active a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/all1.png);
}
}
.portfolio-element-wrapper ul li:nth-child(1) a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/all1.png);
}
.portfolio-element-wrapper ul li:nth-child(1) a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/all-inactive1.png);
}
.portfolio-element-wrapper ul li:nth-child(1).active a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/all1.png) !important;
}
#tab-consultacy a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/social-consultacy2.png);
}
@media (min-width: 1200px) {
#tab-consultacy a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/social-consultacy1.png);
}
}
#tab-consultacy.active a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/social-consultacy-active2.png) !important;
}
@media (min-width: 1200px) {
#tab-consultacy.active a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/social-consultacy-active1.png) !important;
}
} #tab-campaign a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/social-campaign2.png);
}
#tab-campaign.active a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/social-campaign-active2.png);
}
@media (min-width: 1200px) {
#tab-campaign a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/social-campaign1.png);
}
#tab-campaign.active a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/social-campaign-active1.png);
}
} #tab-fanpage a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/fanpage-management2.png);
}
@media (min-width: 1200px) {
#tab-fanpage a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/fanpage-management1.png);
}
}
#tab-fanpage.active a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/fanpage-management-active2.png) !important;
}
@media (min-width: 1200px) {
#tab-fanpage.active a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/fanpage-management-active1.png) !important;
}
} #tab-production {
scale: 1.1;
}
#tab-production a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/viral-production3.png);
}
@media (min-width: 390px) {
#tab-production {
scale: 1.2;
}
}
@media (min-width: 1200px) {
#tab-production {
scale: 1;
}
#tab-production a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/viral-production1.png);
}
}
#tab-production.active {
scale: 1.1;
}
#tab-production.active a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/viral-production-active3.png) !important;
}
@media (min-width: 390px) {
#tab-production.active {
scale: 1.2;
}
}
@media (min-width: 1200px) {
#tab-production.active {
scale: 1;
}
#tab-production.active a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/viral-production-active1.png) !important;
}
}
.portfolio-element-wrapper ul li:nth-child(6) a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/trendvertising2.png);
}
.portfolio-element-wrapper ul li:nth-child(6).active a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/trendvertising-active2.png) !important;
}
@media (min-width: 1200px) {
.portfolio-element-wrapper ul li:nth-child(6) a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/trendvertising1.png);
}
.portfolio-element-wrapper ul li:nth-child(6).active a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/trendvertising-active1.png) !important;
}
}
#tab-trendvertising {
scale: 1.1;
}
#tab-trendvertising a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/trendvertising2.png);
}
#tab-trendvertising.active {
scale: 1.1;
}
#tab-trendvertising.active a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/trendvertising-active2.png) !important;
}
@media (min-width: 390px) {
#tab-trendvertising {
scale: 1.2;
}
}
@media (min-width: 1200px) {
#tab-trendvertising {
scale: 1;
}
#tab-trendvertising a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/trendvertising1.png);
}
#tab-trendvertising.active a {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/menu/trendvertising-active1.png) !important;
}
}
.works-porfolio .col:nth-child(1) {
max-width: 80%;
}
.works-porfolio .col:nth-child(1) .box-image img {
height: 80vh !important;
object-fit: contain !important;
}
@media (min-width: 850px) and (max-width: 1199px) {
.block-why {
flex-basis: 50% !important;
max-width: 50% !important;
}
}
.block-why-text {
position: absolute;
top: 10%;
color: #fff;
padding: 0 15px;
}
.block-short p:nth-child(1) {
margin-top: 0.5em !important;
}
.block-why-text p:nth-child(1) {
font-size: 18px;
font-weight: 600;
}
@media (min-width: 414px) {
.block-why-text p:nth-child(1) {
font-size: 20px;
}
}
@media (min-width: 1200px) {
.block-why-text p:nth-child(1) {
font-size: 16px;
}
}
@media (min-width: 1400px) {
.block-why-text p:nth-child(1) {
margin-bottom: 15px;
font-size: 18px;
}
}
@media (min-width: 1600px) {
.block-why-text p:nth-child(1) {
margin-bottom: 15px;
font-size: 20px;
}
}
@media (min-width: 1920px) {
.block-why-text p:nth-child(1) {
font-size: 23px;
}
}
.block-why-text p:nth-child(2) {
font-size: 14px;
}
@media (min-width: 414px) {
.block-why-text p:nth-child(2) {
font-size: 16px;
}
}
@media (min-width: 1200px) {
.block-why-text p:nth-child(2) {
font-size: 12px;
}
}
@media (min-width: 1366px) {
.block-why-text p:nth-child(2) {
font-size: 13px;
}
}
@media (min-width: 1400px) {
.block-why-text p:nth-child(2) {
font-size: 14px;
}
}
@media (min-width: 1600px) {
.block-why-text p:nth-child(2) {
padding: 0 15px;
}
}
@media (min-width: 1600px) {
.block-why-text p:nth-child(2) {
font-size: 17px;
}
}
@media (min-width: 1680px) {
.block-why-text p:nth-child(2) {
font-size: 15px;
}
}
@media (min-width: 1920px) {
.block-why-text p:nth-child(2) {
font-size: 18px;
}
}
.block-full-content p:nth-child(1) {
margin-bottom: 0.6em !important;
line-height: 25px;
}
@media (min-width: 1400px) {
.block-full-content p:nth-child(1) {
font-size: 18px;
line-height: 24px;
}
}
@media (min-width: 1600px) {
.block-full-content p:nth-child(1) {
font-size: 20px;
line-height: 26px;
}
}
@media (min-width: 1920px) {
.block-full-content p:nth-child(1) {
font-size: 24px;
line-height: 30px;
}
}
.dia-bay {
margin-left: 1em !important;
}
@media (min-width: 1024px) {
.dia-bay {
width: 15% !important;
margin-left: 24em !important;
}
}
@media (min-width: 1600px) {
.dia-bay {
width: 17% !important;
margin-left: 27em !important;
}
}
@media (min-width: 2000px) {
.dia-bay {
width: 18% !important;
margin-left: 30em !important;
}
}
.title-why {
margin-top: -3em !important;
}
@media (min-width: 1024px) {
.title-why {
width: 25% !important;
margin-top: -3em !important;
}
}
@media (min-width: 1200px) {
.title-why {
margin-top: -5em !important;
}
}
@media (min-width: 1600px) {
.title-why {
margin-top: -6em !important;
}
}
@media (min-width: 2000px) {
.title-why {
width: 30% !important;
margin-top: -8em !important;
}
}
.box-company .box-image:before {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/career/border-image.png);
background-repeat: no-repeat;
background-size: 100% 100%;
left: 50%;
position: absolute;
z-index: 2;
width: 100%;
height: 100%;
transform: translateX(-50%);
top: 1px;
}
.box-company .box-image .image-cover img {
padding: 12px;
border-radius: 5px;
}
@media (min-width: 1366px) {
.box-company .box-image .image-cover img {
padding: 14px;
border-radius: 7px;
}
}
@media (min-width: 1400px) {
.box-company .box-image .image-cover img {
padding: 14px;
border-radius: 6px;
}
}
@media (min-width: 1536px) {
.box-company .box-image .image-cover img {
padding: 16px;
border-radius: 8px;
}
}
@media (min-width: 1600px) {
.box-company .box-image .image-cover img {
padding: 17px;
border-radius: 8px;
}
}
@media (min-width: 1920px) {
.box-company .box-image .image-cover img {
padding: 20px;
border-radius: 10px;
}
}
.why-porfolio .box-text {
display: none;
}
.why-decor {
position: absolute;
left: 5%;
z-index: -1;
width: 20% !important;
top: -3%;
}
@media (min-width: 1200px) {
.why-decor {
top: 11%;
width: 15% !important;
}
}
.why-ball {
position: absolute;
top: 45%;
right: 0;
width: 15% !important;
z-index: -1;
}
.job-opening-text {
position: absolute;
top: 50%;
transform: translateY(-50%);
}
@media (min-width: 1200px) {
.job-opening-text {
padding: 0 30px;
}
}
.job-opening-text h2 {
font-family: iciel;
font-size: 18px;
margin-top: 0;
margin-bottom: 0;
}
@media (min-width: 414px) {
.job-opening-text h2 {
font-size: 22px;
}
}
@media (min-width: 1200px) {
.job-opening-text h2 {
font-size: 30px;
margin-top: 0em;
margin-bottom: 0;
}
}
@media (min-width: 1400px) {
.job-opening-text h2 {
font-size: 36px;
}
}
@media (min-width: 1600px) {
.job-opening-text h2 {
font-size: 45px;
padding-left: 15px;
}
}
@media (min-width: 1920px) {
.job-opening-text h2 {
font-size: 48px;
}
}
.job-opening-text .btn-readmore .arrow {
top: 34px;
right: 40px;
}
.job-opening-text .icon-readmore::before {
top: -8px;
}
@media (min-width: 1200px) {
.job-opening-text .btn-readmore .button span.btn-text {
margin-top: 10px;
}
.job-opening-text .btn-readmore .arrow {
top: 44px;
right: 55px;
}
.job-opening-text .icon-readmore::before {
top: -12px;
}
}
.slider-company-wrap {
padding-bottom: 0 !important;
}
.box-company-wrap {
padding-bottom: 0 !important;
}
.pagination .nav1 {
display: none;
}
.pagination {
padding: 20px;
position: relative;
}
.pagination:before {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/career/page.png);
background-repeat: no-repeat;
background-size: 100% 100%;
width: 170px;
height: 60px;
position: absolute;
right: 0;
top: 3px;
z-index: -1;
}
.pagination,
.pagination * {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
text-align: end;
margin: auto;
}
.pagination a {
color: #fff;
display: inline-block;
padding: 0 10px;
cursor: pointer;
}
.pagination a.disabled {
opacity: 0.3;
pointer-events: none;
cursor: not-allowed;
}
.pagination a.current {
background: #f3f3f3;
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/career/page2.png);
background-repeat: no-repeat;
background-size: 100% 100%;
color: #fff;
}
.prev-why {
padding-right: 29px !important;
}
.prev-why:before {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/new-icon2.png);
background-repeat: no-repeat;
background-size: 100% 100%;
width: 15px;
height: 18px;
position: absolute;
top: 50%;
transform: translateY(-50%) rotate(180deg);
}
.next-why:before {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/new-icon2.png);
background-repeat: no-repeat;
background-size: 100% 100%;
width: 15px;
height: 18px;
position: absolute;
top: 50%;
transform: translateY(-50%);
}
.apply-button-wrap .text-right {
text-align: left;
}
@media (min-width: 1200px) {
.apply-button-wrap .text-right {
text-align: right;
}
}
.btn-apply {
text-align: right;
scale: 0.8;
}
@media (min-width: 1200px) {
.btn-apply {
scale: 1;
}
}
@media (min-width: 1600px) {
.btn-apply {
scale: 1.1;
}
}
@media (min-width: 1920px) {
.btn-apply {
scale: 1.3;
padding-right: 60px;
}
}
.btn-apply.btn-readmore .button {
padding: 10px 55px 10px 20px;
margin-bottom: 0;
}
@media (min-width: 1200px) {
.btn-apply.btn-readmore .button {
padding: 15px 75px 15px 25px;
}
}
@media (min-width: 2240px) {
.btn-apply.btn-readmore .button {
padding: 15px 75px 20px 35px;
}
}
.slide-text-team p {
font-size: 1.1rem !important;
color: #fff;
text-align: start;
}
@media (min-width: 1200px) {
.slide-text-team p {
font-size: 1.85rem !important;
}
}  .work-banner_ {
border-radius: 15px;
}
.work-banner_ .bg.bg-loaded {
border-radius: 19px;
}
.work-banner_:hover .bg.bg-loaded {
border-radius: 19px;
}
.work-banner-hover .banner-bg {
overflow: unset !important;
}
.work-ball-left {
width: 8% !important;
top: 60%;
z-index: -1;
}
.work-ball {
top: 14%;
z-index: -1;
}
.our-works-port {
margin: auto !important;
}
@media (min-width: 1200px) {
.our-works-port .box-text {
padding-left: 0 !important;
padding-right: 0 !important;
}
}
.our-works-port .box-text-inner::after {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/btn-more.png);
background-repeat: no-repeat;
background-size: contain;
position: absolute;
width: 115px;
height: 20px;
right: -4px;
top: 42px;
background-position-x: 95px;
background-position-y: 0px;
}
@media (min-width: 360px) {
.our-works-port .box-text-inner::after {
top: 11px;
}
}
@media (min-width: 390px) {
.our-works-port .box-text-inner::after {
top: 8px;
}
}
@media (min-width: 1200px) {
.our-works-port .box-text-inner::after {
width: 120px;
height: 23px;
right: -6px;
top: 16px;
}
}
@media (min-width: 1920px) {
.our-works-port .box-text-inner::after {
right: 5px;
}
}
.view-more-small .box-text-inner::after {
right: -18px;
top: 14px;
scale: 0.7;
}
@media (min-width: 1200px) {
.view-more-small .box-text-inner::after {
top: 10px;
}
}
@media (min-width: 1600px) {
.view-more-small .box-text-inner::after {
top: 13px;
scale: 0.8;
right: -1px;
}
}
.our-works-port .box-text-inner {
color: #fff !important;
}
.our-works-port .box-text-inner::before {
content: "More";
position: absolute;
right: 25px;
top: 37px;
}
@media (min-width: 360px) {
.our-works-port .box-text-inner::before {
top: 6px;
}
}
@media (min-width: 768px) {
.our-works-port .box-text-inner::before {
top: 2px;
}
}
@media (min-width: 1200px) {
.our-works-port .box-text-inner::before {
top: 5px;
font-size: 24px;
}
}
@media (min-width: 1400px) {
.our-works-port .box-text-inner::before {
top: 5px;
font-size: 26px;
}
}
@media (min-width: 1920px) {
.our-works-port .box-text-inner::before {
right: 40px;
top: 6px;
font-size: 25px;
}
}
.our-works-port2 .box-text-inner::before {
top: 14px;
}
@media (min-width: 1200px) {
.our-works-port2 .box-text-inner::before {
font-size: 21px;
top: 2px;
right: 30px;
}
}
@media (min-width: 1600px) {
.our-works-port2 .box-text-inner::before {
top: 2px;
right: 40px;
}
}
@media (min-width: 1920px) {
.our-works-port2 .box-text-inner::before {
top: 19px;
}
}
@media (min-width: 2000px) {
.our-works-port2 .box-text-inner::before {
top: 17px;
}
}
.our-works-port2 .box-text-inner::after {
top: 20px;
}
@media (min-width: 1200px) {
.our-works-port2 .box-text-inner::after {
top: 10px;
height: 20px;
}
}
@media (min-width: 1600px) {
.our-works-port2 .box-text-inner::after {
top: 12px;
right: 5px;
}
}
.our-works-port2 .portfolio-box-title {
padding-top: 0px;
}
@media (min-width: 1200px) {
.our-works-port2 .portfolio-box-title {
margin-left: 10px;
padding-top: 0px !important;
}
}
@media (min-width: 1600px) {
.our-works-port2 .portfolio-box-title {
margin-left: 15px;
}
}
.our-works-port3 .box-text-inner::before {
top: 8px;
}
@media (min-width: 1200px) {
.our-works-port3 .box-text-inner::before {
top: 8px;
}
}
@media (min-width: 1600px) {
.our-works-port3 .box-text-inner::before {
right: 40px;
}
}
.our-works-port4 .box-text-inner::before {
top: 20px;
}
@media (min-width: 1200px) {
.our-works-port4 .box-text-inner::before {
top: 8px;
}
}
@media (min-width: 1920px) {
.our-works-port4 .box-text-inner::before {
top: 8px;
}
}
.view-more-small .box-text-inner::before {
top: 11px;
font-size: 15px;
}
@media (min-width: 1200px) {
.view-more-small .box-text-inner::before {
top: 9px;
}
}
@media (min-width: 1600px) {
.view-more-small .box-text-inner::before {
font-size: 19px;
}
}
.our-works-port .portfolio-box-category {
display: none;
}
.our-works-port .portfolio-box-title {
text-align: left;
width: 70%;
font-size: 18px;
text-transform: unset;
opacity: 1;
padding-top: 20px;
}
@media (min-width: 1200px) {
.our-works-port .portfolio-box-title {
font-size: 25px;
width: 70%;
padding-top: 20px;
}
}
@media (min-width: 1400px) {
.our-works-port .portfolio-box-title {
font-size: 30px;
}
}
@media (min-width: 1920px) {
.our-works-port .portfolio-box-title {
font-size: 35px;
}
}
.our-works-port3 .portfolio-box-title {
width: 70%;
font-size: 17px;
padding-top: 10px;
}
@media (min-width: 1200px) {
.our-works-port3 .portfolio-box-title {
padding-top: 0;
font-size: 17px;
margin-left: 5px;
}
}
@media (min-width: 1600px) {
.our-works-port3 .portfolio-box-title {
font-size: 20px;
}
}
@media (min-width: 1920px) {
.our-works-port3 .portfolio-box-title {
font-size: 22px;
margin-left: 5px;
}
} .border-port_::before {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/khung-lon.png);
background-repeat: no-repeat;
background-size: 100%;
left: 50%;
position: absolute;
z-index: 1;
width: 95%;
height: 55%;
transform: translateX(-50%);
top: -6px;
}
.border-port-tab::before {
height: 67%;
}
@media (min-width: 414px) {
.border-port_::before {
height: 61%;
}
}
@media (min-width: 1200px) {
.border-port_::before {
width: 100%;
height: 85%;
top: -17px;
}
}
@media (min-width: 414px) and (max-width: 1023px) {
.border-port-tab::before {
height: 70%;
}
}
@media (min-width: 1400px) {
.border-port_::before {
height: 85%;
}
}
@media (min-width: 1920px) {
.border-port_::before {
height: 86%;
}
}
.border-port2::before {
height: 90%;
top: -5px;
}
@media (min-width: 414px) {
.border-port2::before {
height: 90%;
top: -11px;
}
}
@media (min-width: 1200px) {
.border-port2::before {
height: 85%;
}
}
@media (min-width: 1600px) {
.border-port2::before {
height: 90%;
top: -12px;
}
}
@media (min-width: 1920px) {
.border-port2::before {
height: 90%;
top: -12px;
}
}
.border-port .image-cover img {
width: 99.5%;
height: 99.5%;
}
@media (min-width: 1600px) {
.border-port2 .image-cover img {
width: 99%;
height: 99%;
}
}
.border-port .image-cover {
border-radius: 4px !important;
}
@media (min-width: 1200px) {
.border-port .image-cover {
border-radius: 16px !important;
}
}
@media (min-width: 1600px) {
.border-port .image-cover {
border-radius: 35px !important;
}
}
.border-port .image-cover:hover {
border-radius: 15px !important;
}
@media (min-width: 1600px) {
.border-port .image-cover:hover {
border-radius: 35px !important;
}
.border-port2 .image-cover {
border-radius: 29px !important;
}
}
.our-works-port1 .image-cover img {
padding: 9px;
border-radius: 25px;
}
.our-works-port3_ .col::before {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/border-2-1.png);
background-repeat: no-repeat;
background-size: 100%;
left: 50%;
position: absolute;
z-index: 1;
width: 110%;
height: 90%;
transform: translateX(-50%);
top: -12px;
}
@media (min-width: 1200px) {
.our-works-port3_ .col::before {
height: 80%;
}
}
@media (min-width: 1600px) {
.our-works-port3 .col:before {
height: 90%;
top: -19px;
}
}
@media (min-width: 1920px) {
.our-works-port3 .col:before {
height: 81%;
top: -17px;
}
}
.our-works-port3 .image-cover {
border-radius: 4px !important;
}
.our-works-port4_ .col::before {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/works/border-3-1.png);
background-repeat: no-repeat;
background-size: 100%;
left: 50%;
position: absolute;
z-index: 1;
width: 97%;
height: 75%;
transform: translateX(-50%);
top: -4px;
}
@media (min-width: 414px) {
.our-works-port4_ .col::before {
height: 77%;
}
}
@media (min-width: 1200px) {
.our-works-port4_ .col:before {
height: 12.5em;
height: 90%;
}
}
@media (min-width: 1366px) {
.our-works-port4_ .col:before {
height: 13.5em;
}
}
@media (min-width: 1400px) {
.our-works-port4_ .col:before {
height: 14em;
}
}
@media (min-width: 1536px) {
.our-works-port4_ .col:before {
height: 15em;
}
}
@media (min-width: 1600px) {
.our-works-port4_ .col:before {
height: 16em;
}
}
@media (min-width: 1680px) {
.our-works-port4_ .col:before {
height: 17em;
}
}
@media (min-width: 1920px) {
.our-works-port4_ .col:before {
height: 18.5em;
}
}
.our-works-port4_ .image-cover {
border-radius: 4px !important;
}
.our-works-port4 .portfolio-box-title {
padding-top: 10px;
}
@media (min-width: 1920px) {
.our-works-port4 .portfolio-box-title {
margin-left: 0;
}
}
@media (min-width: 1400px) {
.work-row2-left { }
}
@media (min-width: 1600px) {
.our-works-port3 .box-text.text-center {
margin-bottom: 20px;
}
}
.hover-zoom-img_:hover .image-zoom img {
transform: scale(1.1);
}
.hover-zoom-img1 .col:hover .image-zoom img {
transform: scale(1.1);
}
.btn-work.btn-readmore .button span.btn-text {
margin-top: 7px;
}
@media (min-width: 1200px) {
.btn-work.btn-readmore .button span.btn-text {
margin-top: 12px;
}
}
.btn-work.btn-readmore .arrow {
top: 34px;
right: 46px;
}
@media (min-width: 1200px) {
.btn-work.btn-readmore .arrow {
top: 47px;
right: 55px;
}
}
@media (max-width: 767px) {
.btn-work.btn-readmore .btn-text {
font-size: 15px;
}
}
@media (min-width: 1200px) {
.col2-left {
padding: 0px 5px 30px 26px !important;
flex-basis: 57%;
max-width: 57%;
}
.col2-right {
padding: 0px 0px 0 10px;
flex-basis: 27% !important;
max-width: 27% !important;
}
}
@media (min-width: 1400px) {
.col2-left {
padding: 0px 21px 31px 30px;
}
}  .new-ball-bg {
z-index: -1 !important;
width: 30% !important;
top: 10% !important;
}
.news-border-1 .box-image:before {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/news/khung-news.png);
background-repeat: no-repeat;
background-size: 100% 100%;
left: 50%;
position: absolute;
z-index: 2;
width: 100%;
height: 100%;
transform: translateX(-50%);
top: 0.5px;
}
@media (min-width: 1200px) {
.news-border-1 .box-image:before {
top: 1px;
}
}
.news-border-1 .box-image {
padding: 2px;
border-radius: 5px !important;
}
@media (min-width: 1200px) {
.news-border-1 .box-image {
padding: 5px;
border-radius: 12px !important;
}
}
.news-border-1 .image-cover {
border-radius: 3px !important;
}
@media (min-width: 1200px) {
.news-border-1 .image-cover {
border-radius: 15px !important;
}
}
.news-title .box-text {
padding-top: 5px !important;
}
.news-title .post-title {
width: 70%;
padding-top: 0px;
font-size: 15px;
}
@media (min-width: 1200px) {
.news-title .post-title {
width: 60%;
padding-top: 15px;
font-size: 25px;
}
}
@media (min-width: 1600px) {
.news-title .post-title {
font-size: 30px;
}
}
@media (min-width: 1920px) {
.news-title .post-title {
font-size: 35px;
}
}
.news-title .is-divider {
display: none !important;
}
.news-title a.button {
position: absolute;
top: 0;
right: 5px;
font-size: 14px !important;
text-transform: none !important;
font-weight: normal !important;
margin-top: 0 !important;
}
@media (min-width: 1200px) {
.news-title a.button {
right: 20px;
font-size: 25px !important;
}
}
@media (min-width: 1600px) {
.news-title a.button {
font-size: 29px !important;
}
}
@media (min-width: 1920px) {
.news-title a.button {
font-size: 25px !important;
}
}
.news-title a.button:before {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/trend/btn-more.png);
background-size: 100%;
background-repeat: no-repeat;
position: absolute;
width: 16px;
height: 18px;
right: -22px;
top: 50%;
transform: translateY(-50%);
}
@media (min-width: 1200px) {
.news-title a.button:before {
width: 22px;
height: 25px;
right: -30px;
}
}
.news-border-2 .box-image:before {
content: "";
background-image: url(https://basicvn.com/mango/wp-content/uploads/2023/06/khung-news-1.png);
background-repeat: no-repeat;
background-size: 100% 100%;
left: 50%;
position: absolute;
z-index: 2;
width: 100%;
height: 100%;
transform: translateX(-50%);
top: 1px;
}
@media (min-width: 1200px) {
}
.news-border-2 .box-image {
padding: 3px;
border-radius: 5px !important;
}
.news-border-2 .image-cover {
border-radius: 5px !important;
}
.news-title2 .post-title {
width: 70%;
font-size: 15px !important;
padding-top: 0px;
}
.news-title2 .box-text {
padding-top: 5px !important;
}
@media (min-width: 1600px) {
.news-title2 .post-title {
font-size: 18px !important;
}
}
@media (min-width: 1920px) {
.news-title2 .post-title {
font-size: 20px !important;
}
}
.news-title2 .is-divider {
display: none !important;
}
.news-title2 a.button {
position: absolute;
top: 0;
right: 5px;
font-size: 15px !important;
text-transform: none !important;
font-weight: normal !important;
margin-top: 0;
}
@media (min-width: 1600px) {
.news-title2 a.button {
font-size: 17px !important;
}
}
@media (min-width: 1920px) {
.news-title2 a.button {
font-size: 19px !important;
}
}
.news-title2 a.button:before {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/trend/btn-more.png);
background-size: 100%;
background-repeat: no-repeat;
position: absolute;
width: 15px;
height: 18px;
right: -22px;
top: 50%;
transform: translateY(-50%);
}
.project-border_ .portfolio-box .box-image:before {
content: "";
background-image: url(https://basicvn.com/mango/wp-content/uploads/2023/06/border-home-work-2.png);
background-repeat: no-repeat;
background-size: 100%;
left: 50%;
position: absolute;
z-index: 2;
width: 100%;
height: 100%;
transform: translateX(-50%);
}
.project-border_ .image-cover {
border-radius: 8px;
}
@media (min-width: 1200px) {
.project-border_ .portfolio-box .box-image img {
padding: 4px;
}
}
.news-job-list {
position: absolute !important;
top: 36% !important;
left: 10% !important;
}
@media (min-width: 375px) {
.news-job-list {
left: 15% !important;
}
}
@media (min-width: 414px) {
.news-job-list {
top: 40% !important;
left: 20% !important;
}
}
@media (min-width: 768px) {
.news-job-list {
position: unset !important;
top: unset !important;
left: unset !important;
}
}
.looking-for-wrap {
overflow: hidden;
}
@media (min-width: 1200px) {
.vong-xoay-news {
min-height: 220px;
}
.news-job-list.col.we-do-slider-wrap {
padding-top: 20px !important;
}
}
@media (min-width: 1920px) {
.vong-xoay-news {
min-height: 250px;
}
}
@media (min-width: 1366px) {
.news-job-list.col.we-do-slider-wrap {
padding-top: 27px !important;
}
}
@media (min-width: 1400px) {
.news-job-list.col.we-do-slider-wrap {
padding-top: 32px !important;
}
}
@media (min-width: 1600px) {
.news-job-list.col.we-do-slider-wrap {
padding-top: 43px !important;
scale: 1.2;
}
}
@media (min-width: 1600px) {
.news-job-list.col.we-do-slider-wrap {
padding-top: 47px !important;
}
}
@media (min-width: 1920px) {
.news-job-list.col.we-do-slider-wrap {
padding-top: 60px !important;
scale: 1.3;
}
}
.news-job-list .we-do-item {
opacity: 0;
}
.news-job-list .we-do-item {
font-size: 20px !important;
}
@media (min-width: 414px) {
.news-job-list .we-do-item {
font-size: 25px !important;
}
}
@media (min-width: 1200px) {
.news-job-list .we-do-item {
font-size: 26px !important;
}
}
@media (min-width: 1600px) {
.news-job-list .we-do-item {
font-size: 24px !important;
}
}
.news-job-list .we-do-item {
cursor: pointer;
}
.news-job-list .we-do-item a { background: #6b2690 !important;
background: linear-gradient(to top, #6b2690 16%, #ffffff 50%) !important;
-webkit-background-clip: text !important;
-webkit-text-fill-color: transparent !important;
margin-top: 10px !important;
margin-bottom: 10px !important;
}
.news-job-list .we-do-active p a {
color: #fff !important;
background: unset !important;
-webkit-background-clip: unset !important;
-webkit-text-fill-color: unset !important;
}  @media (min-width: 1400px) {
.gap-trend {
padding-top: 10px;
}
.banner-trend-wrap {
margin-top: -7em;
}
}
@media (min-width: 1920px) {
.banner-trend-wrap {
margin-top: -3em;
}
}
.scroll-down-btn {
cursor: pointer;
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
animation-iteration-count: infinite;
-webkit-animation-iteration-count: infinite;
}
.scroll-down-btn {
cursor: pointer;
animation-name: bounce;
-moz-animation-name: bounce;
}
@keyframes bounce {
0%,
100%,
20%,
50%,
80% {
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
40% {
-webkit-transform: translateY(-30px);
-ms-transform: translateY(-30px);
transform: translateY(-30px);
}
60% {
-webkit-transform: translateY(-15px);
-ms-transform: translateY(-15px);
transform: translateY(-15px);
}
}
.tybw-mb {
margin-top: -127px;
}
@media (min-width: 1680px) {
.trend-your-brand-wrap {
bottom: 16%;
}
}
@media (min-width: 1920px) {
.trend-your-brand-wrap {
bottom: 10%;
}
}
@media (min-width: 2000px) {
.trend-your-brand-wrap {
bottom: 20%;
}
}
@media (min-width: 2560px) {
.trend-your-brand-wrap {
bottom: 25%;
}
}
.trend-your-brand-wrap h2 {
font-family: iciel;
color: #fff;
}
@media (min-width: 1680px) {
.img-hl {
bottom: 45%;
}
}
@media (min-width: 1920px) {
.img-hl {
bottom: 48%;
}
}
.tyb-desc h3 {
font-family: iciel;
font-size: 1.5em;
}
@media (min-width: 1680px) {
.tyb-desc h3 {
font-size: 30px;
}
}
.tyb-desc p {
font-size: 14px;
}
@media (min-width: 1200px) {
.tyb-desc p {
font-size: 16px;
}
}
@media (min-width: 1680px) {
.tyb-desc p {
font-size: 20px;
}
}
@media (min-width: 2000px) {
.tyb-desc p {
font-size: 18px;
}
}
.tyb-desc-1 p {
}
@media (min-width: 1200px) {
.tyb-desc-1 p {
padding-left: 4em;
}
}
@media (min-width: 1680px) {
.tyb-desc-1 p {
padding-left: 9em;
}
}
@media (min-width: 1680px) {
.tyb-desc-1 p {
padding-left: 12em;
}
}
@media (min-width: 2000px) {
.tyb-desc-1 p {
padding-left: 10em;
}
}
.tyb-desc-2 p {
}
@media (min-width: 1200px) {
.tyb-desc-2 p {
padding-right: 4em;
}
}
@media (min-width: 1680px) {
.tyb-desc-2 p {
padding-right: 11em;
}
}
@media (min-width: 1920px) {
.tyb-desc-2 p {
padding-right: 14em;
}
}
@media (min-width: 2000px) {
.tyb-desc-2 p {
padding-right: 12em;
}
}
.trend-slider .portfolio-box-category {
display: none;
}
.trend-slider .box-text {
padding: 5px 15px !important;
}
@media (min-width: 1200px) {
.trend-slider .box-text {
padding: 5px 30px !important;
}
}
.trend-slider_ .box-image:before {
content: "";
background-image: url(https://basicvn.com/mango/wp-content/uploads/2023/07/border-port.png);
background-repeat: no-repeat;
background-size: 100%;
left: 50%;
position: absolute;
z-index: 2;
width: 100%;
height: 100%;
transform: translateX(-50%);
}
.trend-slider_ .box-image .image-cover {
margin-left: 9px;
margin-right: 9px;
border-radius: 15px;
}
.trend-slider_ .box-image .image-cover img {
padding-top: 5px;
}
@media (min-width: 1400px) {
.trend-slider_ .box-image .image-cover {
border-radius: 18px;
}
}
@media (min-width: 1600px) {
.trend-slider_ .box-image .image-cover {
border-radius: 25px;
}
}
@media (min-width: 1920px) {
.trend-slider_ .box-image .image-cover {
border-radius: 35px;
}
}
.trend-slider_ .has-hover:hover .image-zoom img {
padding-top: 20px;
transition: all 1s;
}
@media (min-width: 1600px) {
.trend-slider_ .has-hover:hover .image-zoom img {
padding-top: 25px;
}
}
.trend-slider .flickity-prev-next-button svg {
display: none !important;
}
.trend-slider .flickity-prev-next-button {
opacity: 1 !important;
margin-top: -21% !important;
cursor: pointer;
}
@media (min-width: 414px) {
.trend-slider .flickity-prev-next-button {
margin-top: -15% !important;
}
}
@media (min-width: 1200px) {
.trend-slider .flickity-prev-next-button {
opacity: 1 !important;
margin-top: -5% !important;
}
}
@media (min-width: 1920px) {
.trend-slider .flickity-prev-next-button {
margin-top: -3% !important;
}
}
.trend-slider .flickity-prev-next-button.previous {
content: "";
background-image: url(https://basicvn.com/mango/wp-content/uploads/2023/07/trend-left.png);
background-size: 100%;
background-repeat: no-repeat;
position: absolute;
top: 50%;
transform: translate(0, -50%) !important;
width: 35px !important;
height: 34px !important;
left: -5% !important;
}
@media (min-width: 1200px) {
.trend-slider .flickity-prev-next-button.previous {
width: 25px !important;
height: 25px;
left: 2% !important;
}
}
.trend-slider .flickity-prev-next-button.next {
content: "";
background-image: url(https://basicvn.com/mango/wp-content/uploads/2023/07/trend-right.png);
background-size: 100%;
background-repeat: no-repeat;
position: absolute;
top: 50%;
transform: translate(0, -50%) !important;
width: 35px !important;
height: 34px !important;
right: -5% !important;
}
@media (min-width: 1200px) {
.trend-slider .flickity-prev-next-button.next {
width: 25px !important;
height: 25px !important;
right: 2% !important;
}
}
@media (min-width: 768px) {
.trend-slider .flickity-prev-next-button.previous {
width: 30px !important;
height: 30px !important;
left: 15% !important;
}
.trend-slider .flickity-prev-next-button.next {
width: 30px !important;
height: 30px !important;
right: 15% !important;
}
}
@media (min-width: 1200px) {
.trend-slider .flickity-prev-next-button.previous {
width: 40px !important;
height: 60px !important;
left: -2% !important;
}
.trend-slider .flickity-prev-next-button.next {
width: 40px !important;
height: 60px !important;
right: -2% !important;
left: 99%;
}
}
@media (min-width: 1400px) {
.trend-slider .flickity-prev-next-button.previous {
width: 50px !important;
}
.trend-slider .flickity-prev-next-button.next {
width: 50px !important;
}
}
@media (min-width: 1920px) {
.trend-slider .flickity-prev-next-button.previous {
width: 60px !important;
}
.trend-slider .flickity-prev-next-button.next {
width: 60px !important;
}
}
.trend-slider .portfolio-box-title {
color: #fff;
opacity: 1;
width: 70%;
}
@media (min-width: 1680px) {
.trend-slider .portfolio-box-title {
font-size: 22px;
}
}
.trend-slider .box-text-inner::after {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/trend/btn-more.png);
background-repeat: no-repeat;
background-size: contain;
position: absolute;
width: 115px;
height: 20px;
right: -4px;
top: 6px;
background-position-x: 95px;
background-position-y: 0px;
}
@media (min-width: 1200px) {
.trend-slider .box-text-inner::after {
width: 120px;
height: 20px;
right: 8px;
top: 7px;
}
}
.trend-slider .box-text-inner::before {
content: "More";
position: absolute;
right: 25px;
top: 2px;
}
@media (min-width: 1200px) {
.trend-slider .box-text-inner::before {
top: 1px;
font-size: 19px;
right: 45px;
}
}  .icon-bg-trend1 {
z-index: -1;
}
@media (min-width: 768px) {
.catch-topic {
top: 50%;
transform: translateY(-50%);
left: 2%;
}
}
@media (min-width: 768px) {
.catch-text {
top: 50%;
transform: translateY(-50%);
right: 2%;
}
}
.slider-tech.slider-wrapper .flickity-prev-next-button {
display: block;
}
.slider-tech .flickity-prev-next-button svg {
display: none !important;
}
.slider-tech .flickity-prev-next-button.previous {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/keys/key-prev.png);
background-size: 100%;
background-repeat: no-repeat;
position: absolute;
top: 50%;
transform: translate(0, -50%) !important;
width: 25px;
height: 25px;
left: 1% !important;
}
.slider-tech .flickity-prev-next-button.next {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/home/keys/key-next.png);
background-size: 100%;
background-repeat: no-repeat;
position: absolute;
top: 50%;
transform: translate(0, -50%) !important;
width: 25px;
height: 25px;
right: 1% !important;
}  .aboutus-banner-wrap {
}
@media (max-width: 428px) and (max-height: 800px) {
.aboutus-banner-planet {
width: 65% !important;
left: 10%;
}
}
@media (max-width: 428px) and (max-height: 665px) {
.aboutus-banner-planet {
width: 50% !important;
left: 15%;
}
}
@media (max-width: 390px) and (max-height: 800px) {
.aboutus-banner-planet {
width: 70% !important;
left: 10%;
}
}
@media (max-width: 390px) and (max-height: 720px) {
.aboutus-banner-planet {
width: 65% !important;
left: 10%;
}
}
@media (max-width: 390px) and (max-height: 680px) {
.aboutus-banner-planet {
width: 55% !important;
left: 15%;
}
}
@media (max-width: 375px) and (max-height: 690px) {
.aboutus-banner-planet {
width: 60% !important;
left: 15%;
}
}
@media (max-width: 375px) and (max-height: 667px) {
.aboutus-banner-planet {
width: 60% !important;
left: 10%;
}
}
@media (max-width: 375px) and (max-height: 625px) {
.aboutus-banner-planet {
width: 50% !important;
left: 18%;
}
}
@media (max-width: 375px) and (max-height: 608px) {
.aboutus-banner-planet {
width: 50% !important;
left: 16%;
}
}
@media (min-width: 1200px) {
.aboutus-banner-wrap .bg.bg-loaded {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/about-us/banner.jpg) !important;
}
}
@media (min-width: 1920px) {
.aboutus-banner-text {
bottom: 20%;
left: 13%;
}
}
.text1 h2 {
font-family: "iCiel" !important;
}
@media (min-width: 1920px) {
.text1 {
font-size: 31px !important;
}
.text2 {
font-size: 27px !important;
}
}
@media (min-width: 1920px) {
.aboutus-banner-planet {
right: 15%;
}
}
.text-his h2 {
font-family: "iCiel" !important;
}
@media (min-width: 1600px) {
.gap-history {
padding-top: 130px !important;
}
}
@media (min-width: 1920px) {
.gap-history {
padding-top: 150px !important;
}
}
.his-map-ball {
overflow: hidden;
width: 320px !important;
}
@media (min-width: 375px) {
.his-map-ball {
width: 340px !important;
}
}
@media (min-width: 390px) {
.his-map-ball {
width: 350px !important;
}
}
@media (min-width: 1200px) {
.his-map-ball {
overflow: unset;
width: 415px !important;
}
}
@media (min-width: 1600px) {
.his-map-ball {
width: 520px !important;
}
}
.his-map-desc {
opacity: 0;
padding: 20px 10px 10px 20px;
font-size: 16px;
}
@media (min-width: 375px) {
.his-map-desc {
padding: 30px 10px 10px 20px;
}
}
@media (min-width: 1200px) {
.his-map-desc {
padding: 10px 10px 10px 20px;
}
}
@media (min-width: 1600px) {
.his-map-desc {
padding: 10px 10px 10px 30px;
}
}
.his-map-desc p {
margin: 0;
}
.his-map-desc p:nth-child(2) {
margin-top: 5px;
}
@media (min-width: 1200px) {
.his-map-desc p:nth-child(2) {
margin-top: 5px;
}
}
@media (min-width: 1600px) {
.his-map-desc p {
font-size: 20px;
}
}
@media (min-width: 390px) and (max-width: 768px) {
.gap-his-map {
padding-top: 130px !important;
}
}
.his-map-title p {
margin: 8px 0 0 65px;
line-height: 18px;
}
@media (min-width: 1200px) {
.his-map-title p {
left: 45%;
position: absolute;
margin: 0;
line-height: 25px;
}
}
@media (min-width: 1600px) {
.his-map-title p {
font-size: 22px;
line-height: 27px;
}
}
.his-map-title p b {
font-size: 110%;
}
.his-map-desc:before {
content: "";
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/about-us/khung-mb2.png);
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
background-repeat: no-repeat;
background-size: contain;
z-index: -1;
}
@media (min-width: 1200px) {
.his-map-desc:before {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/about-us/khung.png);
width: 100%;
height: 100%;
}
}
.his-map-dot-mb {
margin: 0 0 0 43px !important;
width: 8% !important;
}
.his-map-dot {
margin: 0 0 0 33px !important;
transition: all 1.5s;
}
@media (min-width: 1200px) {
.his-map-dot {
margin-left: auto !important;
margin-right: auto !important;
}
}
.his-map-dot:hover {
cursor: pointer;
scale: 1.3;
}
.his-map-dot:hover ~ .his-map-title {
transition: all 2s;
cursor: pointer;
scale: 1.3;
}
.his-map-ball.active .his-map-desc {
opacity: 1;
}
.his-map-ball.active .his-map-title,
.his-map-ball.active .his-map-dot {
cursor: pointer;
scale: 1.2;
}
@media (min-width: 1200px) {
.his-map-ball.active .his-map-title,
.his-map-ball.active .his-map-dot {
scale: 1.3;
}
}
@media (min-width: 1920px) {
.his-map-line {
width: 90% !important;
}
}
@media (min-width: 320px) and (max-width: 767px) {
.his1 .his-map-dot-mb {
margin: 0 0 0 29px !important;
width: 8% !important;
}
.his1 .his-map-dot {
margin: 0 0 0 18px !important;
}
.his1 .his-map-title p {
margin: 14px 0 0 52px;
}
}
@media (min-width: 1200px) {
.his1 {
left: 2%;
top: 36%;
}
}
@media (min-width: 1366px) {
.his1 {
left: 3%;
top: 37%;
}
}
@media (min-width: 1400px) {
.his1 {
left: 3%;
top: 38%;
}
}
@media (min-width: 1536px) {
.his1 {
left: 4%;
top: 39%;
}
}
@media (min-width: 1600px) {
.his1 {
left: 2%;
top: 36%;
}
}
@media (min-width: 1920px) {
.his1 {
top: 41%;
}
}
@media (min-width: 320px) and (max-width: 767px) {
.his2 .his-map-dot-mb {
margin: -47px 0 0 85px !important;
}
.his2 .his-map-dot {
margin: 12px 0 0 76px !important;
}
.his2 .his-map-title p {
margin: -1px 0 0 88px;
}
}
@media (min-width: 1200px) {
.his2 {
left: 16%;
top: 31%;
}
}
@media (min-width: 1366px) {
.his2 {
left: 17%;
top: 32%;
}
}
@media (min-width: 1400px) {
.his2 {
left: 18%;
top: 31%;
}
}
@media (min-width: 1536px) {
.his2 {
left: 19%;
top: 33%;
}
}
@media (min-width: 1600px) {
.his2 {
left: 15%;
top: 30%;
}
}
@media (min-width: 1680px) {
.his2 {
left: 17%;
}
}
@media (min-width: 1920px) {
.his2 {
left: 17%;
top: 32%;
}
}
@media (min-width: 320px) and (max-width: 767px) {
.his3 .his-map-dot-mb {
margin: -80px 0 0 160px !important;
}
.his3 .his-map-dot {
margin: 0 0 0 143px !important;
}
.his3 .his-map-title p {
margin: -3px 0 0 161px;
}
}
@media (min-width: 1200px) {
.his3 {
left: 37%;
top: 16%;
}
}
@media (min-width: 1366px) {
.his3 {
left: 38%;
top: 15%;
}
}
@media (min-width: 1400px) {
.his3 {
left: 39%;
top: 14%;
}
}
@media (min-width: 1536px) {
.his3 {
left: 40%;
top: 13%;
}
}
@media (min-width: 1600px) {
.his3 {
left: 37%;
top: 9%;
}
}
@media (min-width: 1920px) {
.his3 {
left: 40%;
top: 6%;
}
}
@media (min-width: 1200px) {
.his4 {
left: 57%;
top: 23%;
}
}
@media (min-width: 1400px) {
.his4 {
left: 59%;
top: 22%;
}
}
@media (min-width: 1600px) {
.his4 {
left: 58%;
top: 19%;
}
}
@media (min-width: 1920px) {
.his4 {
left: 61%;
top: 18%;
}
}
@media (min-width: 414px) {
.his-map-ball-text-mb {
top: 2% !important;
}
}
@media (min-width: 375px) {
.his-map-ball-text-mb {
width: 95% !important;
}
}
@media (min-width: 390px) {
.his-map-ball-text-mb {
width: 92% !important;
}
}
@media (min-width: 414px) {
.his-map-ball-text-mb {
width: 90% !important;
}
}
.his-map-ball-text-mb .his-map-desc {
display: none;
opacity: 1;
}
.his-map-ball-text-mb .his-map-desc.active {
display: block;
}
.his-map-wrap-mb,
.his-map-wrap-mb .banner-layers {
overflow: hidden;
}
.ball-mb {
margin-left: -10px;
}
.his-map-ball-mb .ball-down {
margin-left: 7px;
}
.his-map-ball-mb.his1 {
top: 76%;
left: 33%;
}
.his-map-ball-mb.his1 .ball-down {
margin-left: 6px;
}
.his-map-ball-mb.his2 {
top: 74%;
left: 47%;
}
.his-map-ball-mb.his3 {
top: 69%;
left: 69%;
}
.his-map-ball-mb.his4 {
left: 95%;
top: 74%;
}
.ball-text-mb {
font-size: 8px !important;
}
@media (min-width: 414px) {
.his-map-line-mb {
bottom: 24% !important;
}
}
.his-map-ball-mb .ball-down {
opacity: 0;
}
.his-map-ball-mb.active .ball-down {
opacity: 1;
}
.his-map-ball-mb.active .ball-down,
.his-map-ball-mb.active .ball-mb,
.his-map-ball-mb.active .ball-text-mb {
scale: 1.2;
transition: all 1s;
}
.his-map-ball-mb.active .ball-text-mb {
margin-left: 10px;
}
.his-desc-2-mb {
top: -6em;
} @media (min-width: 1400px) {
.aboutus-gallery {
padding-top: 800px !important;
}
}
@media (min-width: 1600px) {
.aboutus-gallery {
padding-top: 900px !important;
}
}
@media (min-width: 1920px) {
.aboutus-gallery {
padding-top: 1000px !important;
}
}
.aboutus-cate-lib-wrap {
transition: all 1s;
cursor: pointer;
}
.aboutus-cate-lib-wrap.active {
scale: 1.4;
}
.aboutus-cate-lib-hover {
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
object-fit: contain;
opacity: 0;
transition: opacity 0.2s;
}
.aboutus-cate-lib-wrap:hover .aboutus-cate-lib-hover {
opacity: 1;
}
.aboutus-cate-lib-wrap.active .aboutus-cate-lib-hover {
opacity: 1;
}
.collaboration-wrap {
left: 60%;
}
@media (min-width: 1200px) {
.collaboration-wrap {
left: 43%;
}
}
@media (min-width: 1400px) {
.collaboration-wrap {
bottom: 47%;
}
}
.aboutus-img {
opacity: 0;
transition: opacity 0.2s;
}
.aboutus-img.active {
opacity: 1;
}
.aboutus-img-5 {
right: 42%;
}
@media (min-width: 1600px) {
.aboutus-img-5 {
right: 42.5%;
}
}
.col-gallery {
margin-top: -5em;
}
@media (min-width: 390px) {
.col-gallery {
margin-top: -3em;
}
}
.slider-gallery {
display: none;
}
.slider-gallery.active {
display: block;
}
.slider-gallery .flickity-slider > * {
max-width: 450px !important;
} .aboutus-ship {
width: 15% !important;
top: 60%;
z-index: -1;
}
@media (min-width: 375px) {
.aboutus-ship {
top: 57%;
}
}
@media (min-width: 1200px) {
.aboutus-ship {
top: 46%;
}
}
@media (min-width: 1400px) {
.aboutus-ship {
top: 42%;
}
}
@media (min-width: 1920px) {
.aboutus-ship {
width: 16%;
top: 38%;
}
}
.aboutus-bg {
z-index: 0;
}
@media (min-width: 1200px) {
.aboutus-bg {
bottom: -5%;
}
}
@media (min-width: 1400px) {
.aboutus-bg {
bottom: -9%;
}
}
@media (min-width: 1920px) {
.aboutus-bg {
bottom: -10%;
}
}
.gap-history {
}
.col-history-new {
overflow: hidden;
min-height: 1100px;
}
@media (min-width: 375px) {
.col-history-new {
min-height: 1200px;
}
}
@media (min-width: 414px) {
.col-history-new {
min-height: 1200px;
}
}
@media (min-width: 1024px) {
.col-history-new {
min-height: 800px;
}
}
@media (min-width: 1200px) {
.col-history-new {
min-height: 900px;
}
}
@media (min-width: 1366px) {
.col-history-new {
min-height: 800px;
margin-top: 60px !important;
}
}
@media (min-width: 1920px) {
.col-history-new {
min-height: 950px;
}
}
.map-new-line {
width: 24% !important;
left: 4.3em;
z-index: -1;
top: -1em;
}
@media (min-width: 375px) {
.map-new-line {
left: 4.5em;
}
}
@media (min-width: 390px) {
.map-new-line {
left: 4.6em;
}
}
@media (min-width: 414px) {
.map-new-line {
left: 4.9em;
}
}
@media (min-width: 428px) {
.map-new-line {
left: 5.1em;
}
}
@media (min-width: 768px) {
.map-new-line {
left: 30%;
width: 15% !important;
}
}
@media (min-width: 1024px) {
.map-new-line-desk {
top: -2em;
z-index: -1;
left: 30%;
}
}
@media (min-width: 1200px) {
.map-new-line-desk {
top: -2em;
z-index: -1;
left: 30.5%;
}
}
@media (min-width: 1366px) {
.map-new-line-desk {
width: 18% !important;
top: -5em;
left: 31%;
}
} @media (min-width: 1600px) {
.map-new-line-desk {
left: 31.2%;
top: -5em;
}
}
@media (min-width: 1920px) {
.map-new-line-desk {
top: -7em;
}
}
.his1-wrap {
padding-top: 7em;
}
.his-new-wrap {
padding: 0 10px !important;
}
@media (max-width: 767px) {
.col2-history,
.col1-history {
padding: 0 !important;
}
}
.his-new-wrap .his-new-ball {
transition: all 1s;
cursor: pointer;
}
.his-new-wrap .his-new-text {
font-size: 12px !important;
transition: all 1s;
cursor: pointer;
}
@media (min-width: 375px) {
.his-new-wrap .his-new-text {
font-size: 15px !important;
}
}
@media (min-width: 1200px) {
.his-new-wrap .his-new-text {
font-size: 18px !important;
}
}
.his-new-desc {
opacity: 0;
}
.his-new-desc .col-inner {
padding: 20px !important;
}
.his1-new-desc .col-inner {
padding: 10px 20px 20px 20px !important;
}
@media (min-width: 375px) {
.his-new-desc .col-inner {
padding: 30px !important;
}
.his1-new-desc .col-inner {
padding: 10px 20px 20px 20px !important;
}
}
@media (min-width: 1200px) {
.his1-new-desc .col-inner {
padding: 15px 20px 20px 20px !important;
}
}
.his-new-desc-text {
font-size: 17px !important;
line-height: 22px !important;
}
@media (min-width: 414px) {
.his-new-desc-text {
font-size: 18px !important;
line-height: 24px !important;
}
}
@media (min-width: 1024px) {
.his-new-desc-text {
font-size: 16px !important;
line-height: 22px !important;
}
}
@media (min-width: 1200px) {
.his-new-desc-text {
font-size: 20px !important;
line-height: 30px !important;
}
}
@media (min-width: 1400px) {
.his-new-desc-text {
font-size: 23px !important;
line-height: 35px !important;
}
}
@media (min-width: 1600px) {
.his-new-desc-text {
font-size: 25px !important;
line-height: 40px !important;
}
}
@media (min-width: 1920px) {
.his-new-desc-text {
font-size: 30px !important;
line-height: 45px !important;
}
}
.his-new-desc p {
margin-bottom: 8px;
}
@media (min-width: 1200px) {
.his-new-desc p {
margin-bottom: 12px;
}
}
.his-second .col-inner {
}
@media (min-width: 1200px) {
.his-second .col-inner {
position: absolute;
top: -6em;
}
}
@media (min-width: 1680px) {
.his-second .col-inner {
position: absolute;
top: -8em;
}
}
@media (min-width: 2240px) {
.his-second .col-inner {
position: absolute;
top: -9em;
}
}
.his-img .col-inner {
top: -1em;
}
@media (min-width: 1200px) {
.his-img .col-inner {
top: -9em;
}
}
.his-new-wrap.active .his-new-text {
transition: all 1s;
} @media (max-width: 767px) {
.his-new-wrap.active .his-new-text p strong {
transition: all 2s;
font-size: 110% !important;
}
}
@media (min-width: 1200px) {
.his-new-wrap.active .his-new-text p {
transition: all 2s;
scale: 1.1;
}
}
.his-new-wrap.active .his-new-ball {
transition: all 1s;
scale: 1.7;
}
.his-new-wrap.active .his-new-desc {
transition: all 1s;
opacity: 1;
} .text-tab-slider {
cursor: pointer;
font-size: 24px;
font-weight: bold;
font-family: iciel;
color: #d650db;
}
@media (min-width: 1024px) {
.text-tab-slider {
font-size: 40px;
}
}
@media (min-width: 1200px) {
.text-tab-slider {
font-size: 50px;
}
}
.text-tab-slider p {
margin: 0 !important;
}
.collaboration-wrap-new {
top: 52% !important; }
.aboutus-cate-lib-wrap-new {
transition: all 1s;
}
.aboutus-cate-lib-wrap-new:hover { }
.aboutus-cate-lib-wrap-new.active { }
.slider-gallery {
margin-top: -4em;
}
.slider-gallery .flickity-slider > * {
max-width: 620px !important;
}
@media (min-width: 1536px) {
.slider-gallery .flickity-slider > * {
max-width: 700px !important;
}
}  .our-works-port .box-text.text-center {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.our-works-port .portfolio-box-title {
padding-top: 10px;
}  .portfolio-page-wrapper {
background-color: #fff !important;
}
@media (min-width: 1200px) {
.portfolio-single-page .container-width,
.portfolio-single-page .full-width .ubermenu-nav,
.portfolio-single-page .container,
.portfolio-single-page .row {
max-width: 1100px !important;
}
}
@media (min-width: 1400px) {
.portfolio-single-page .container-width,
.portfolio-single-page .full-width .ubermenu-nav,
.portfolio-single-page .container,
.portfolio-single-page .row {
max-width: 1300px !important;
}
}
@media (min-width: 1600px) {
.portfolio-single-page .container-width,
.portfolio-single-page .full-width .ubermenu-nav,
.portfolio-single-page .container,
.portfolio-single-page .row {
max-width: 1400px !important;
}
}
@media (min-width: 1920px) {
.portfolio-single-page .container-width,
.portfolio-single-page .full-width .ubermenu-nav,
.portfolio-single-page .container,
.portfolio-single-page .row {
max-width: 1600px !important;
}
}
.portfolio-single-page .portfolio-featured-title.page-title {
display: none;
}
.portfolio-single-page .portfolio-bottom {
display: none;
}
.portfolio-single-page .portfolio-summary {
display: none;
}
.portfolio-single-page .page-wrapper {
padding: 0 !important;
}
.portfolio-page-wrapper.portfolio-single-page h2 {
font-size: 2.2em;
}
.hoadao-icon {
right: -31%;
top: -3em;
width: 25%;
}
.hoadao-2 {
top: 9%;
right: 10%;
}
@media (min-width: 1600px) {
.hoadao-2 {
top: 5%;
right: 4%;
}
}
.hoadao-3 {
right: 28%;
top: -10%;
}  .post-template-default.single-post #main,
#wrapper {
background: #fff !important;
}
._post-template-default.single-post .page-wrapper {
padding: 0 !important;
}
._post-template-default.single-post
#content.page-wrapper.blog-single
.row
.col.large-10 {
flex-basis: 100%;
max-width: 100%;
padding: 0 !important;
}  .arrow-down {
display: block;
bottom: 0 !important;
position: absolute;
left: 50%;
transform: translateX(-50%);
}
.arrow-down span {
display: block;
width: 14px;
height: 28px;
transform: rotate(-45deg);
margin: -23px;
animation: animate 2s infinite;
animation: animate 2s infinite;
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/btn-arrow.png);
background-repeat: no-repeat;
background-size: contain;
}
@media (min-width: 1200px) {
.arrow-down span {
width: 20px;
height: 30px;
}
}
.arrow-down span:nth-child(2) {
animation-delay: -0.2s;
}
.arrow-down span:nth-child(3) {
animation-delay: -0.4s;
}
@media (min-width: 768px) {
.footerWrap .section-bg.bg-loaded {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/footer-bg.jpg) !important; background-size: 100vw auto !important;
}
.footerWrap2 .section-bg.bg-loaded {
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/footer-bg.jpg) !important;
background-size: 100vw auto !important;
}
}
@media (min-width: 768px) {
.footerWrap .section-bg.bg-loaded {
background-size: 100% 100% !important;
}
.footerWrap:before {
content: "";
height: 12px;
width: 100%;
position: absolute;
top: 0;
background-image: url(https://mangodigital.vn/wp-content/themes/flatsome-child/images/footer-line.png);
z-index: 1;
}
}
@media (min-width: 1200px) {
.footer-icon-right {
width: 20% !important;
}
}
@media (min-width: 1366px) {
.footer-icon-right {
width: 23% !important;
}
}
@media (min-width: 1920px) {
.footer-icon-right {
width: 20% !important;
}
}
@media (min-width: 2000px) {
.footer-icon-right {
width: 24% !important;
}
}
@media (min-width: 768px) and (max-width: 1023px) {
.footerWrap .col {
padding-bottom: 10px;
}
}
@media (min-width: 1920px) {
.footerWrap_ .section-bg.bg-loaded {
background-size: 100vw auto !important;
}
}
@media (min-width: 768px) {
.footerContent > .col > .col-inner {
padding: 20px 0px 10px 0px !important;
}
}
@media (min-width: 1024px) {
.footerContent > .col > .col-inner {
padding: 30px 0px 30px 0px !important;
}
}
@media (min-width: 1200px) {
.footerContent .col {
padding: 0 15px 0 !important;
}
.footerContent > .col > .col-inner {
padding: 40px 0px 0 0px !important;
}
}
@media (min-width: 1366px) {
.footerContent > .col > .col-inner {
padding: 65px 0px 0px 0px !important;
}
}
@media (min-width: 1400px) {
.footerContent > .col > .col-inner {
padding: 66px 0px 15px 0px !important;
}
}
@media (min-width: 1536px) {
.footerContent > .col > .col-inner {
padding: 66px 0px 25px 0px !important;
}
}
@media (min-width: 1600px) {
.footerContent > .col > .col-inner {
padding: 65px 0px 40px 0px !important;
}
}
@media (min-width: 1680px) {
.footerContent > .col > .col-inner {
padding: 75px 0px 40px 0px !important;
}
}
@media (min-width: 1920px) {
.footerContent > .col > .col-inner {
padding: 80px 0px 60px 0px !important;
}
}
@media (min-width: 2000px) {
.footerContent > .col > .col-inner {
padding: 135px 0px 100px 0px !important;
}
}
.mf-desk.hide-for-small {
display: none !important;
}
@media (min-width: 768px) {
.mf-desk.hide-for-small {
display: block !important;
}
}
.logoFooter {
margin-bottom: 10em !important;
}
.footerWrap p {
font-size: 18px;
}
@media (min-width: 768px) {
.footerWrap p {
font-size: 12px;
}
}
@media (min-width: 1200px) {
.footerWrap p {
font-size: 15px;
}
}
@media (min-width: 2000px) {
.footerWrap p {
font-size: 20px;
}
}
.textFollow p {
font-size: 15px;
font-weight: 700;
text-transform: uppercase;
color: #ff03f2;
}
.textFollow {
font-size: 15px;
font-weight: 700;
text-transform: uppercase;
color: #ff03f2;
}
@media (min-width: 768px) {
.textFollow p {
font-size: 14px;
}
}
@media (min-width: 768px) {
.textFollow {
font-size: 14px;
}
}
@media (min-width: 2000px) {
.btnVisit .icon-play {
margin-top: -1em;
}
}
.btnVisit .icon-play::before {
color: #f1c75b;
font-size: 1.2em;
}
@media (min-width: 2000px) {
.btnVisit .icon-play::before {
font-size: 2em;
}
}
@media (min-width: 2000px) {
.btnBusiness .icon-play {
margin-top: -1em;
}
}
.btnBusiness .icon-play::before {
color: #eb3cf1;
font-size: 1.2em;
}
@media (min-width: 2000px) {
.btnBusiness .icon-play::before {
font-size: 2em;
}
}
.btnBusiness span {
color: #eb3cf1 !important;
font-size: 20px !important;
}
.btnJob span {
font-size: 17px !important;
}
.color-ca4ccf a {
color: #eb3cf1 !important;
}
@media (min-width: 768px) {
.btnBusiness span {
font-size: 15px !important;
}
}
@media (min-width: 1680px) {
.btnBusiness span {
font-size: 24px !important;
}
}
@media (min-width: 2000px) {
.btnBusiness span {
font-size: 32px !important;
}
}
.btnVisit span {
color: #f1c75b !important;
font-size: 20px !important;
}
.color-f1c75b a {
color: #f1c75b !important;
}
@media (min-width: 768px) {
.btnVisit span {
font-size: 15px !important;
}
}
@media (min-width: 1680px) {
.btnVisit span {
font-size: 24px !important;
}
}
@media (min-width: 2000px) {
.btnVisit span {
font-size: 32px !important;
}
}
.absolute-footer {
display: none !important;
}
.menuFooter .is-divider {
width: 75% !important;
}
.menuFooter a {
color: #fff;
}
@media (min-width: 360px) and (max-width: 767px) {
.col.menuFooter {
padding-left: 60px !important;
}
}
@media (max-width: 767px) {
.menuFooter {
padding-bottom: 3em !important;
}
.header-block-block-1 {
overflow: hidden;
}
}
.desk-menu-icon.img-menu-hover {
display: none;
}
@media (min-width: 1200px) {
.desk-menu-icon.img-menu-hover.active {
display: block;
}
}
.back-to-top:hover {
background-color: #d650db !important;
border-color: #7000c1 !important;
}
.padding-remove {
padding-left: 0 !important;
padding-right: 0 !important;
}
.margin-remove {
margin-left: 0 !important;
margin-right: 0 !important;
} .splide__pagination,
.splide__arrow {
display: none !important;
}
.page-id-3637 #main {
background-color: #000000;
}
@media (min-width: 1280px) {
.page-id-3637 #main {
background-color: transparent;
}	
}
@media (min-width: 1920px) {
.menu-wrap .ux-menu-link__link {
text-align: left;
min-width: 500px;
}
.menu-wrap span.ux-menu-link__text {
font-size: 50px;
line-height: 70px;
}
}