@import url('./footer.css');
  @import url('./header.css');
  @font-face {
  font-family:'CabinetGrotesk-light';
  src:url('http://lucasroussy.com/fonts/cabinet-grotesk/CabinetGrotesk-Light.woff2') format('woff2');
  font-weight:normal;
  font-style:normal;
}

@font-face {
  font-family:'CabinetGrotesk-extrabold';
  src:url('assets/fonts/cabinet-grotesk/CabinetGrotesk-Extrabold.woff2') format('woff2');
  font-weight:normal;
  font-style:normal;
}

.bigTitle {
  font-family:'CabinetGrotesk-extrabold',sans-serif;
  line-height:1.3;
  font-size:13vw;
}

@media (min-width:425px) {
  .bigTitle {
    font-size:10vw;
  }
}

@media (min-width:1024px) {
  .bigTitle {
    font-size:3vw;
  }
}

.bigTitle .orangeIcon {
  width:10px;
  height:10px;
  transform:rotate(45deg);
  background-color:#f7970e;
  display:inline-block;
  margin-left:5px;
}

@media (min-width:768px) {
  .bigTitle .orangeIcon {
    width:13px;
    height:13px;
  }
}

@media (min-width:1440px) {
  .bigTitle .orangeIcon {
    width:16px;
    height:16px;
  }
}

.arrow-button {
  display:flex;
  align-items:center;
  text-decoration:none;
  font-family:'CabinetGrotesk-extrabold',sans-serif;
  color:#000;
  transition:padding 1s cubic-bezier(0.16,1,0.3,1);
  width:fit-content;
  font-size:12px;
}

.arrow-button svg {
  width:33px;
  margin-left:10px;
}

.arrow-button svg circle {
  transition:fill 0.75s ease;
  fill:transparent;
}

@media (min-width:425px) {
  .arrow-button {
    font-size:16px;
  }
  .arrow-button svg {
    width:45px;
  }
}

@media (min-width:1024px) {
  .arrow-button {
    font-size:20px;
  }
  .arrow-button svg {
    width:62px;
  }
  .arrow-button:hover {
    padding-left:20px;
  }
  .arrow-button:hover svg circle {
    fill:#8c97d0;
  }
}

@media (min-width:1440px) {
  .arrow-button {
    font-size:15px;
  }
  .arrow-button svg {
    width:60px;
  }
}

@media (min-width:1920px) {
  .arrow-button {
    font-size:18px;
  }
  .arrow-button svg {
    width:70px;
  }
}

.home-showcase {
  padding:0 var(--columnExt) 0;
  position:relative;
  margin:2rem 0 10vw;
}

.home-showcase .home-showcaseSlider {
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  justify-content:space-between;
}

.home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide {
  position:relative;
  height:100%;
  overflow:hidden;
}

.home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide .swiper-image {
  padding:10vw 5vw;
  width:100%;
  height:calc(100% - (5vw*2));
  background-position:center;
  background-repeat:no-repeat;
  background-size:cover;
  display:flex;
  align-items:flex-end;
}

.home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide .swiper-image {
  min-height:75vh;
}

.home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide .swiper-image .text-container {
  max-width:100%;
  margin:0 0 5rem;
}

.home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide .swiper-image .text-container .bigTitle {
  transform:translate(-140%,0);
  transition:transform 1.15s cubic-bezier(0.58,0,0.28,0.99) 0.4s;
  color:#fff;
  margin:0 0 0rem;
  text-shadow:#212121 21 0 0 5px;
}

.home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide .swiper-image .text-container .container-arrow-button {
  transform:translate(-160%,0);
  transition:transform 0.6s cubic-bezier(0.58,0,0.28,0.99) 1s;
  width:fit-content;
}

.home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide .swiper-image .text-container .container-arrow-button .arrow-button {
  color:#fff;
}

.home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide .swiper-image .text-container .container-arrow-button svg path {
  fill:#fff;
}

.home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide .swiper-image .text-container .container-arrow-button svg circle {
  stroke:#fff;
}

.home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide .swiper-image .text-container .container-arrow-button:hover svg circle {
  stroke:#8c97d0;
}

.home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide .swiper-image .filter {
  width:100%;
  height:100%;
  background-color:#10112b;
  position:absolute;
  top:0;
  left:0;
  z-index:-1;
  opacity:0.5;
  transition:opacity 0.8s ease-in 0.5s;
}

.home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide-active .swiper-image .text-container .bigTitle,
.home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide-active .swiper-image .text-container .container-arrow-button {
  transform:translate(0,0);
}

.home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide-active .swiper-image .filter {
  opacity:0.3598;
}

.home-showcase .home-showcaseSlider .swiper-pagination {
  position:relative;
  bottom:0;
  left:0;
  width:fit-content;
  padding:3.5% 0;
}

.home-showcase .home-showcaseSlider .swiper-pagination-bullet {
  width:4vw;
  border-radius:50px;
  height:2px;
  background-color:#8f9397;
  opacity:1;
  transition:width 0.8s ease-in-out,0.4s ease-in-out;
  margin:0 4px !important;
}

.home-showcase .home-showcaseSlider .swiper-pagination-bullet-active {
  background-color:#f7970e;
  width:8vw;
}

.home-showcase .home-showcaseSlider .showcaseSlider-nav {
  display:flex;
  flex-direction:row;
  padding:0 0 3.5% 5%;
  padding-right:0;
}

.home-showcase .home-showcaseSlider .showcaseSlider-nav .showcaseSlider-prev,
.home-showcase .home-showcaseSlider .showcaseSlider-nav .showcaseSlider-next {
  position:static;
  display:flex;
  align-items:flex-end;
  font-weight:900;
  margin:0 2vw;
  width:20px;
  height:auto;
}

.home-showcase .home-showcaseSlider .showcaseSlider-nav .showcaseSlider-prev.swiper-button-disabled,
.home-showcase .home-showcaseSlider .showcaseSlider-nav .showcaseSlider-next.swiper-button-disabled {
  opacity:1;
}

.home-showcase .home-showcaseSlider .showcaseSlider-nav .showcaseSlider-prev.swiper-button-disabled:after,
.home-showcase .home-showcaseSlider .showcaseSlider-nav .showcaseSlider-next.swiper-button-disabled:after {
  color:#8f9397;
}

.home-showcase .home-showcaseSlider .showcaseSlider-nav .showcaseSlider-prev::after,
.home-showcase .home-showcaseSlider .showcaseSlider-nav .showcaseSlider-next::after {
  font-size:4vw;
  color:#f7970e;
}

.home-showcase .home-showcaseSlider #macaron {
  position:absolute;
  top:0;
  right:0;
  z-index:1;
  margin:5%;
  width:30%;
}

.home-showcase .home-showcaseSlider #macaron #text-circle {
  animation:rotate-360 12s linear 0s infinite reverse forwards;
  transform-origin:center;
}

.home-showcase .scrollSliderButton {
  position:absolute;
  left:50%;
  bottom:0;
  z-index:2;
  display:flex;
  flex-direction:column;
  align-items:center;
  transform:translate(-50%,0%);
  color:#fff !important;
  text-decoration:none;
  font-size:3.5vw;
  height:21vw;
  font-family:'CabinetGrotesk-light',sans-serif;
}

.home-showcase .scrollSliderButton .line {
  height:15vw;
  width:1px;
  background:#8c97d0;
  margin-top:5px;
  animation:scroll-anim-mobile 1.6s cubic-bezier(0.62,0.01,0.71,0.47) 0s infinite normal forwards;
}

@media (min-width:1024px) {
  .home-showcase {
    margin:0rem 0;
  }
  .home-showcase .home-showcaseSlider {
    display:block;
  }
  .home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide {
    height:100%;
  }
  .home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide .swiper-image {
    align-items:center;
  }
  .home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide .swiper-image .text-container {
    max-width:75%;
    margin:0;
  }
  .home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide .swiper-image .text-container .bigTitle {
    margin:0 0 1.25rem;
  }
  .home-showcase .home-showcaseSlider .swiper-pagination {
    position:absolute;
    bottom:0;
    left:0;
    padding:0 0 2.5% 5%;
  }
  .home-showcase .home-showcaseSlider .swiper-pagination-bullet {
    width:1.5vw;
    height:3px;
    margin:0 8px !important;
  }
  .home-showcase .home-showcaseSlider .swiper-pagination-bullet-active {
    width:3vw;
  }
  .home-showcase .home-showcaseSlider .showcaseSlider-nav {
    position:absolute;
    bottom:0;
    right:0;
    z-index:1;
    padding:0 5% 2.5% 5%;
  }
  .home-showcase .home-showcaseSlider .showcaseSlider-nav .showcaseSlider-prev,
  .home-showcase .home-showcaseSlider .showcaseSlider-nav .showcaseSlider-next {
    margin:0 0.6vw;
  }
  .home-showcase .home-showcaseSlider .showcaseSlider-nav .showcaseSlider-prev::after,
  .home-showcase .home-showcaseSlider .showcaseSlider-nav .showcaseSlider-next::after {
    font-size:1vw;
  }
  .home-showcase .home-showcaseSlider #macaron {
    width:fit-content;
    width:8.4vw;
  }
  .home-showcase .scrollSliderButton {
    position:absolute;
    left:50%;
    bottom:0;
    z-index:2;
    display:flex;
    flex-direction:column;
    align-items:center;
    transform:translate(-50%,40%);
    color:#fff !important;
    text-decoration:none;
    font-size:0.9vw;
    height:4.8vw;
    font-family:'CabinetGrotesk-light',sans-serif;
  }
  .home-showcase .scrollSliderButton .line {
    height:4.8vw;
    width:2px;
    background:#8c97d0;
    margin-top:5px;
    animation:scroll-anim 1.6s cubic-bezier(0.62,0.01,0.71,0.47) 0s infinite normal forwards;
  }
}

.container {
  max-width:1200px;
  margin:0 auto;
  padding:0 20px;
}

.services {
  background-color:#f0f0f0;
  padding:50px 0;
  text-align:center;
}

.banner-header .animated {
  font-size:24px;
  font-weight:400;
  margin-bottom:10px;
  transform:translate(-120%,0);
  transition:transform 0.8s cubic-bezier(0.58,0,0.28,0.99) 0.4s;
  color:#fff;
}

.home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide-active .swiper-image .text-container .animated {
  transform:translate(0,0);
}

@media screen and (max-width:768px) {
  .home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide .swiper-image {
    min-height:50vh;
  }
  .bigTitle {
    font-family:'CabinetGrotesk-extrabold',sans-serif;
    line-height:1.3;
    font-size:11vw;
  }
  .banner-header .animated {
    font-size:16px;
  }
  .home-showcase {
    margin:0rem 0 2vw;
  }
  .ctf-left {
    width:100% !important;
  }
  .ctf-right {
    width:100% !important;
  }
  .ctf-wrapper {
    padding:2.2rem !important;
  }
}

@media screen and (max-width:425px) {
  .home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide .swiper-image {
    height:100%;
    max-height:30vh;
  }
}

.content-contact {
  color:#f0f0f0;
  line-height:2;
}

.banner-header .content-contact {
  transform:translate(-140%,0);
  transition:transform 1.5s cubic-bezier(0.58,0,0.28,0.99) 0.4s;
}

.home-showcase .home-showcaseSlider .swiper-wrapper .swiper-slide-active .swiper-image .text-container .content-contact {
  transform:translate(0,0);
}

/* sevices  */

.about-resp_list {
  margin-top:2.8rem;
  display:flex;
  flex-direction:column;
}

.resp-item {
  display:flex;
  flex-wrap:wrap;
  gap:2.4rem;
}

.resp-item_left {
  flex:1;
  max-width:100%;
  display:flex;
  align-items:center;
}

.resp-item_content {
  display:flex;
  flex-direction:column;
  gap:1.6rem;
  max-width:50rem;
  text-align:justify;
}

.resp-item_title {
  color:#06608B;
  font-size:2.6rem;
  font-weight:400;
  line-height:122.222%;
  text-transform:uppercase;
}

.resp-item_right {
  width:48.5rem;
}

.resp-item_img {
  aspect-ratio:48.5 / 50;
  max-width:100%;
  border-radius:10px;
  overflow:hidden;
}

.resp-item_img img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}

.about-resp_list>*:not(:first-child) {
  margin-top:-4rem;
}

.about-resp_list>*:nth-child(even) .resp-item {
  flex-direction:row-reverse;
}

.sec-title {
  color:#06608B;
  text-align:center;
  font-family:var(--font-sec);
  font-size:3.4rem;
  font-weight:700;
  line-height:1.18;
  text-transform:uppercase;
}

.about-resp_list>*:nth-child(even) .resp-item_content {
  margin-left:auto;
}

.resp-item_desc li::before {
  content:'';
  position:absolute;
  top:0.8rem;
  left:-1.7rem;
  width:2.8rem;
  height:1.2rem;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2327be21' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 8a5.5 5.5 0 0 1 8.25-4.764.5.5 0 0 0 .5-.866A6.5 6.5 0 1 0 14.5 8a.5.5 0 0 0-1 0 5.5 5.5 0 1 1-11 0z'/%3E%3Cpath d='M15.354 3.354a.5.5 0 0 0-.708-.708L8 9.293 5.354 6.646a.5.5 0 1 0-.708.708l3 3a.5.5 0 0 0 .708 0l7-7z'/%3E%3C/svg%3E") !important;
  background-size:contain;
  background-repeat:no-repeat;
}

.resp-item_desc li {
  position:relative;
}

.resp-item_desc ul {
  list-style-type:none;
}

.l-desc ul {
  list-style-type:disc;
}

.l-desc ul,
.l-desc ol {
  list-style-position:outside;
  padding-left:2.2rem;
}

.l-desc {
  color:rgba(6,96,139,0.8);
  font-size:1.8rem;
  font-weight:400;
  line-height:160%;
  display:flex;
  flex-direction:column;
  gap:1.6rem;
}

.resp-item_desc {
  color:#06608B;
}

@media only screen and (max-width:800px) {
  .resp-item_title {
    font-size:2.6rem;
  }
  .resp-item {
    flex-direction:column-reverse !important;
    gap:1.2rem;
  }
  .l-desc {
    font-size:1.5rem;
  }
  .about-resp_list>*:nth-child(even) .resp-item_content {
    margin-left:initial;
    margin:auto;
  }
  .resp-item_content {
    margin:auto;
  }
  .section-title {
    font-size:45px !important;
  }
}

@media screen and (max-width:576px) {
  .resp-item_right {
    width:100%;
  }
  .resp-item {
    flex-direction:column-reverse !important;
    gap:1.2rem;
  }
  .l-desc {
    gap:0.8rem;
    font-size:1.4rem;
  }
  .resp-item_content {
    max-width:initial;
    gap:0.8rem;
  }
}

@media screen and (max-width:992px) {
  .about-resp_list>*:not(:first-child) {
    margin-top:0;
  }
  .about-resp_list {
    gap:2.4rem;
  }
}

/* video tiktok  */

/* css new content  */

.tiktok-videos {
  padding:2.4rem;
}

.tiktok-item {
  display:block;
  position:relative;
  padding-top:156.8181818182%;
  border-radius:1.6rem;
  overflow:hidden;
  cursor:pointer;
  padding:0 1.2rem;
  width:100%;
  height:100%;
  aspect-ratio:2 / 3.07;
  padding-top:unset;
}

.tiktok-item img {
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  width:100%;
  height:100%;
  object-fit:cover;
}

.tiktok-item:before {
  content:"";
  position:absolute;
  width:100%;
  height:100%;
  top:0;
  left:0;
  background:#000;
  opacity:.2;
  transition:.3s ease-in-out;
  z-index:1;
}

@media (hover:hover) {
  .tiktok-item:hover::before {
    opacity:0;
    z-index:0;
  }
}

#custom-button-id {
  display:flex;
  align-items:center;
  justify-content:center;
}

.gallery {
  height:100%;
  width:100%;
}

.owl-nav .owl-prev span,
.owl-nav .owl-next span {
  width:4rem;
  height:4rem;
  display:-webkit-flex;
  display:-moz-flex;
  display:-ms-flex;
  display:-o-flex;
  display:flex;
  -ms-align-items:center;
  align-items:center;
  -webkit-align-items:center;
  justify-content:center;
  -webkit-justify-content:center;
  cursor:pointer;
  border-radius:50%;
  background:rgb(0 0 0 / 82%);
  transition:.3s;
  font-size:3rem;
  margin-bottom:0;
  padding-bottom:8px;
}

.owl-nav {
  position:absolute;
  bottom:0%;
  right:45%;
}

@media screen and (max-width:768px) {
  .owl-nav {
    display:block;
  }
  .owl-nav {
    position:absolute;
    bottom:0%;
    right:35%;
  }
  .owl-nav .owl-prev span,
  .owl-nav .owl-next span {
    width:2rem;
    height:2rem;
    font-size:2rem;
  }
  .nfs-ctn-swiper {
    padding:0 !important;
  }
  .tiktok-item:before {
    opacity:0;
  }
}

.owl-theme .owl-nav [class*=owl-]:hover {
  background:none;
  color:#fff;
  text-decoration:none;
}

.nfs-ctn-wrap {
  position:relative;
  overflow:hidden;
}

.nfs-ctn-swiper {
  inset:0;
  padding:2.4rem 0;
}

.tdecor {
  font-weight:700;
  font-size:4.8rem;
  color:rgb(255,255,255);
  z-index:2;
  transform:translateY(0);
  left:0rem;
  position:relative;
}

@media (min-width:768px) {
  .col-md-7 {
    width:58.3333%;
    flex:0 0 auto;
  }
  .col-md-5 {
    width:41.6667%;
    flex:0 0 auto;
  }
}

.flex {
  --bs-gutter-x:1.5rem;
  --bs-gutter-y:0;
  display:flex;
  flex-wrap:wrap;
  margin-top:calc(-1 * var(--bs-gutter-y));
  margin-right:calc(-.5 * var(--bs-gutter-x));
  margin-left:calc(-.5 * var(--bs-gutter-x));
}

.custom-box-image-home img {
  width:100%;
  height:100%;
  object-fit:contain;
}

.section-subtitle {
  color:rgb(255,42,42);
  font-size:13px;
  font-family:Oswald,sans-serif;
  font-weight:600;
  text-transform:uppercase;
  margin-bottom:0;
  letter-spacing:5px;
}

.btn-curve {
  position:relative;
  cursor:pointer;
  text-transform:uppercase;
  background:0 0;
  padding:12px 34px;
  border-width:initial;
  border-style:none;
  border-color:initial;
  border-image:initial;
  overflow:hidden;
}

.btn-curve.btn-1 {
  color:rgb(255,255,255);
  background:rgb(255,42,42);
  border-width:initial;
  border-style:none;
  border-color:initial;
  border-image:initial;
  float:right;
}

.about-list {
  position:relative;
  display:block;
}

dl,
ul {
  margin-top:0;
  margin-bottom:1rem !important;
}

.dark .content-dev {
  color:#fff;
}

.dark .services {
  background-color:#252424;
  padding:10px 0;
  text-align:center;
}

.dark .resp-item_title,
.dark .resp-item_desc,
.dark .sec-title {
  color:#ffffff;
}

/* new css profile  */

.main-grid {
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:2rem;
  max-width:1300px;
  width:100%;
  padding:0rem;
  position:relative;
  z-index:2;
}

.image-container {
  position:relative;
  background-color:#FFD740;
  border-radius:24px;
  overflow:hidden;
  display:flex;
  justify-content:center;
  align-items:flex-end;
}

.character-img {
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:24px;
  transform:translateY(-0%);
}

.overlay-panel {
  position:absolute;
  bottom:70px;
  left:30px;
  background:#FDC82F;
  padding:1rem 1.5rem;
  border-radius:16px;
  box-shadow:0 6px 14px rgba(0,0,0,0.15);
  z-index:999;
}

.overlay-panel p {
  color:white;
  font-size:1rem;
  font-weight:600;
  margin-bottom:0.5rem;
}

.types {
  display:flex;
  gap:0.5rem;
}

.types button {
  background:white;
  border:none;
  padding:10px 16px;
  font-weight:bold;
  border-radius:12px;
  font-size:1rem;
  cursor:pointer;
  transition:transform 0.2s;
}

.types button:hover {
  transform:translateY(-2px);
}

.right-grid {
  display:grid;
  grid-template-columns:repeat(2,1fr);
  grid-template-rows:auto auto;
  gap:1.2rem;
}

.orange-box,
.ribbon-box {
  border-radius:20px;
  /* aspect-ratio:1/1;
  */

    display:flex;
  justify-content:center;
  align-items:center;
  grid-column:span 2;
}

.ribbon-box img {
  width:100%;
  height:60%;
  object-fit:cover;
  height:220px;
}

.bottom-right {
  grid-column:span 2;
  background-color:#000000;
  display:flex;
  padding:2rem;
  border-radius:24px;
  align-items:center;
}

.vertical-line {
  width:7px;
  height:60%;
  background-color:white;
  margin-right:1.5rem;
  border-radius:2px;
}

.text-content h1 {
  font-size:2.8rem;
  font-weight:800;
  line-height:1.2;
  margin-bottom:1rem;
}

.white {
  color:white;
}

.orange {
  color:transparent;
  -webkit-text-stroke:1px #ff2a2a;
  opacity:.8;
  letter-spacing:3px;
}

.text-content p {
  font-size:1.5rem;
  color:white;
}

.text-content p strong {
  color:#ffffff;
  font-weight:600;
}

#super-btn {
  position:fixed;
  right:32px;
  bottom:32px;
  z-index:1000;
  display:inline-block;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 2px 12px rgba(0,0,0,0.18);
  width:56px;
  height:56px;
  background:#fff;
  transition:box-shadow 0.2s,transform 0.2s;
}

#super-btn:hover {
  box-shadow:0 4px 24px rgba(0,0,0,0.28);
  transform:scale(1.07);
}

#super-btn img {
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:16px;
  display:block;
}

.pp-dd-aa {
  padding:25px 0;
}

/* form liên hệ  */

.ctf-wrapper {
  border-radius:2.4rem;
  padding:7.2rem;
  overflow:hidden;
  position:relative;
}

.ctf-wrapper .ctf-br {
  position:absolute;
  left:0;
  top:0;
  right:0;
  bottom:0;
  z-index:-1;
}

.ctf-br:before {
  content:"";
  top:0;
  right:0;
  bottom:0;
  border-radius:inherit;
  background-color:rgb(52 52 52 / 80%);
  position:absolute;
  left:0;
}

.t-title-24 {
  font-size:2.4rem;
  font-weight:700;
}

.c-white {
  color:#fff;
}

.ctf-right {
  width:50%;
}

.dsmall-item {
  padding:0 1.2rem;
  margin-bottom:2.4rem;
}

/* NEW LIST SKILL  */

.list-danh-sach-kinh-nghiem .ui {
  width:100%;
  /* max-width:991px;
  */

    flex:1;
  /* margin:40px;
  */

    border:1px solid rgb(68,68,68);
  border-radius:12px;
  /* padding:20px;
  */

    display:flex;
  flex-direction:column;
  justify-content:space-between;
  /* box-shadow:0 0 8px -2px #ff2a2a,0 0 6px 1px #ff2a2a,0px 10px 18px 2px #ff2a2a inset,0px -25px 30px 14px #9d2f8f26 inset;
  */

    position:relative;
  overflow:hidden;
}

.list-danh-sach-kinh-nghiem .ui:before {
  content:'';
  height:100%;
  width:100%;
  background-image:url('');
  position:absolute;
  left:0;
  top:0;
  background-size:cover;
  background-position:center;
  opacity:0.38;
}

.list-danh-sach-kinh-nghiem .ui:after {
  content:'';
  height:100%;
  width:100%;
  position:absolute;
  left:0;
  top:0;
  background:rgb(0,0,0);
  background:linear-gradient(0deg,rgb(0 0 0 / 49%) 41%,rgb(0 0 0 / 71%) 70%,rgb(0 0 0 / 61%) 90%);
  box-shadow:0 0 63px 30px #090f12 inset;
}

.list-danh-sach-kinh-nghiem .stats {
  border-radius:8px;
  width:100%;
  border:1px solid rgb(68,68,68);
  height:72px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:20px;
  font-size:20px;
  letter-spacing:0.23px;
  color:#fa8686;
  /* text-shadow:0 0 4px #d56969,-3px 0 2px #b9679636,-5px 0 10px #9b4bd13b;
  */

    
/* box-shadow:0 0 8px -2px #229391ab,0 0 6px 1px #953ac7a1,0px 10px 18px 2px #2922932e inset,0px -25px 30px 14px #9d2f8f26 inset;
  */

    position:relative;
  z-index:1;
}

.list-danh-sach-kinh-nghiem .stats p {
  cursor:pointer;
  transition:color 0.22s;
}

.list-danh-sach-kinh-nghiem .stats p:hover {
  color:rgb(199,163,207);
}

.list-danh-sach-kinh-nghiem .mid {
  align-self:center;
  width:100%;
  padding:20px 20%;
  flex:1;
  display:flex;
  justify-content:center;
  flex-direction:column;
  position:relative;
  z-index:1;
  transition:filter 0.18s ease-in-out;
  cursor:pointer;
  text-align:center;
  color:#ffffff;
}

.list-danh-sach-kinh-nghiem .mid:hover {
  filter:brightness(1.1);
}

.list-danh-sach-kinh-nghiem .mid h1 {
  margin:0 0 20px 0;
  font-size:23px;
  font-weight:500;
  text-shadow:0 0 3px #d56969,-3px 0 4px #b9679636,-5px 0 5px #9b4bd13b;
}

.list-danh-sach-kinh-nghiem .mid h2 {
  margin:0;
  font-size:20px;
  line-height:32px;
  font-weight:500;
  color:#ffffff;
}

.list-danh-sach-kinh-nghiem .skills {
  height:100%;
  display:flex;
  gap:20px;
  position:relative;
  z-index:1;
  padding:20px;
}

.list-danh-sach-kinh-nghiem .skill {
  border-radius:8px;
  height:100%;
  flex:1;
  padding:20px;
  display:flex;
  flex-direction:column;
  align-items:center;
  cursor:pointer;
  box-shadow:0 0 8px -2px #229391ab,0 0 6px 1px #d56966,0px 10px 18px 2px #5c3e3e inset,0px -25px 30px 14px #212121 inset;
  transition:box-shadow 0.22s,transform 0.32s cubic-bezier(0.165,0.84,0.44,1);
}

.list-danh-sach-kinh-nghiem .skill:hover {
  box-shadow:0 0 8px -2px #229391d6,0 0 6px 1px #953ac7c2,0px 10px 18px 2px #29229300 inset,0px -25px 30px 14px #9d2f8f14 inset;
  transform:translate(0,-1px);
}

.list-danh-sach-kinh-nghiem .skill h3 {
  color:#ffffff;
  margin:0;
  font-weight:500;
  text-shadow:0 0 4px #e54c59,0 0 10px #cb000026,0 0 10px #9b4bd13b;
  letter-spacing:0.18px;
  font-size:22px;
  transition:transform 0.21s;
}

.list-danh-sach-kinh-nghiem .skill:hover h3 {
  color:#e9a68cf3;
  transform:rotate3d(31,76,-4,-11deg) translate(-1px,1px);
  perspective:120px;
}

.list-danh-sach-kinh-nghiem .skill p {
  color:#ffffff;
  text-align:justify;
}

.list-danh-sach-kinh-nghiem .ui .skills .skill img {
  width:100%;
  height:100%;
  aspect-ratio:50 / 50;
  object-fit:cover;
  border-radius:10px;
}

.list-danh-sach-kinh-nghiem .ui {
  margin-bottom:25px;
}

.list-danh-sach-kinh-nghiem .btn-curve.btn-1 {
  width:fit-content;
  margin-left:75%;
  z-index:9;
}

@media (max-width:768px) {
  .main-grid {
    grid-template-columns:1fr;
  }
  .tdecor {
    left:-1.5rem;
  }
  .list-danh-sach-kinh-nghiem .skills {
    flex-wrap:wrap;
    height:auto;
  }
  .list-danh-sach-kinh-nghiem .skill {
    flex:auto;
  }
  .list-danh-sach-kinh-nghiem .mid {
    padding:20px 10px;
  }
  .list-danh-sach-kinh-nghiem .btn-curve.btn-1 {
    margin-left:50%;
  }
  .tiktok-item {
    padding:0 0.2rem;
  }
  .home-showcase .home-showcaseSlider .showcaseSlider-nav {
    display:none;
  }
  .ribbon-box img {
    height:100% !important;
  }
}

@media (max-width:1025px) {
  .home-showcase .home-showcaseSlider .showcaseSlider-nav {
    display:none;
  }
  .services .about-resp_list li .resp-item {
    background-color:#fff;
    padding:2rem;
    border-radius:15px;
  }
}

.tiktok-videos .swiper-button-next,
.tiktok-videos .swiper-button-prev,
.profile-user-art .swiper-button-next,
.profile-user-art .swiper-button-prev {
  width:4rem !important;
  height:4rem !important;
  display:-webkit-flex;
  display:-moz-flex;
  display:-ms-flex;
  display:-o-flex;
  display:flex;
  -ms-align-items:center;
  align-items:center;
  -webkit-align-items:center;
  justify-content:center;
  -webkit-justify-content:center;
  cursor:pointer;
  border-radius:50%;
  background:rgb(0 0 0 / 82%);
  transition:.3s;
  margin-bottom:0;
}

.tiktok-videos .swiper-button-next:after,
.tiktok-videos .swiper-button-prev:after,
.profile-user-art .swiper-button-next:after,
.profile-user-art .swiper-button-prev:after {
  font-size:23px !important;
  color:#ffff;
}

@media screen and (max-width:1100px) {
  .footer-col.one {
    width:100%;
    flex:unset;
    margin:0 auto 2.4rem;
    text-align:center;
  }
  .footer .custom-logo-link {
    margin:0 auto 2.4rem;
    justify-content:center;
  }
  .des {
    text-align:justify;
  }
}

@media screen and (max-width:550px) {
  .footer-col {
    width:100% !important;
  }
  .services {
    padding:0 0 !important;
  }
}

.ctf-br img {
  width:100%;
  height:100%;
  object-fit:cover;
}

body {
  font-family:Oswald,sans-serif;
}