/* Normal fonts */
@font-face {
  font-family: 'MuseoSans';
  font-style: normal;
  font-weight: 100;
  src: url('../fonts/MuseoSans-100.otf');
}
@font-face {
  font-family: 'MuseoSans';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/MuseoSans-300.otf');
}
@font-face {
  font-family: 'MuseoSans';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/MuseoSans_500.otf');
}
@font-face {
  font-family: 'MuseoSans';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/MuseoSans_700.otf');
}
@font-face {
  font-family: 'MuseoSans';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/MuseoSans_900.otf');
}
/* Italic fonts */
@font-face {
  font-family: 'MuseoSans';
  font-style: italic;
  font-weight: 100;
  src: url('../fonts/MuseoSans-100Italic.otf');
}
@font-face {
  font-family: 'MuseoSans';
  font-style: italic;
  font-weight: 300;
  src: url('../fonts/MuseoSans-300Italic.otf');
}
@font-face {
  font-family: 'MuseoSans';
  font-style: italic;
  font-weight: 500;
  src: url('../fonts/MuseoSans_500_Italic.otf');
}
@font-face {
  font-family: 'MuseoSans';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/MuseoSans-700Italic.otf');
}
@font-face {
  font-family: 'MuseoSans';
  font-style: italic;
  font-weight: 900;
  src: url('../fonts/MuseoSans-900Italic.otf');
}

:root {
  font-size: 16px;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'MuseoSans', sans-serif !important;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
/* 
::-webkit-scrollbar {
	width: 6px;
	background-color: #F5F5F5;
}

::-webkit-scrollbar-thumb {
	background: linear-gradient( #ccc, #000);
}

::-webkit-scrollbar-track {
	box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
} */

a:hover {
  color: #ccc !important;
  text-decoration: none !important;
}

.h-100vh {
  height: 100vh;
}

.object-cover {
  object-fit: cover;
}

.f-size-20 {
  font-size: 1.25rem;
}

.f-size-24 {
  font-size: 1.5rem;
}

.f-size-24-5 {
  font-size: 1.75rem;
}

.f-size-32 {
  font-size: 2rem;
}

.f-size-32-5 {
  font-size: 2.5rem;
}

.f-size-48 {
  font-size: 3rem;
}

.f-size-64 {
  font-size: 3.75rem;
}

.f-size-100 {
  font-size: 6.25rem;
}

.tran-6s {
  transition: .6s;
}

.tran-9s {
  transition: .9s;
}

.kr-postion-abs {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
}

.opacity-0 {
  opacity: 0;
}

.opacity-1 {
  opacity: 0.1;
}

.opacity-2 {
  opacity: 0.2;
}

.opacity-5 {
  opacity: 0.5;
}

.opacity-7 {
  opacity: 0.7;
}

.cursor-ptr {
  cursor: pointer;
}

.black {
  color: #000;
}

.white {
  color: #fff;
}

.light-white {
  color: #eee !important;
}

.blue {
  color: #00b0f0 !important;
}

.red {
  color: rgb(201, 5, 5);
}

.grey {
  color: grey !important;
}

.bg-light-yellow {
  background-color: #f5ebcc !important;
}

.bg-light-white {
  background-color: rgb(250, 250, 250);
}

.bg-blue {
  background-color: #00b0f0 !important;
}

.bg-black {
  background-color: #000;
}

.bg-light-grey {
  background-color: #eee
}

.bg-light-gray {
  background-color: gray
}

.f-weight-100 {
  font-weight: 100;
}

.f-weight-300 {
  font-weight: 300;
}

.f-weight-500 {
  font-weight: 500;
}

.f-weight-700 {
  font-weight: 700;
}

.f-weight-900 {
  font-weight: 900;
}

.l-height-0 {
  line-height: 0;
}

.l-height-1 {
  line-height: 1;
}

.l-height-1-2 {
  line-height: 1.2;
}

.l-height-1-5 {
  line-height: 1.5;
}

.l-height-1-7-5 {
  line-height: 1.75;
}

.z-index-1 {
  z-index: 1;
}

.left-0 {
  left: 0;
}

.right-0 {
  right: 0;
}

.mw-900 {
  max-width: 900px;
}

.decoration-underline {
  text-decoration: underline !important;
}

.m-custom-row {
  margin: 0 100px !important;
}

.cookie-notice {
  opacity: 0;
  transition: .9s;
}

.kr-menu {
  height: auto;
  padding-top: 0;
  padding-bottom: 0;
  overflow: hidden;
  transition: .4s;
  height: 0;
}

.kr-menu.open {
  height: auto;
  padding-top: 60px;
  padding-bottom: 60px;
  opacity: 1;
  position: fixed;
  z-index: 99999;
  top: 0;
  left: 0;
  right: 0;
}

.section-2 {
  padding: 10% 0;
}

.section-2 h1 {
  margin-bottom: 50px;
  width: 250px;
}

.section-3 {
  padding-top: 10%;
}

.kr-work-img:hover div {
  opacity: 1;
  transition: .6s;
  overflow: auto;
  left: 0;
  right: 0;
}

.kr-social-media {
  font-size: 1.3rem;
  transition: .4s;
  left: unset !important;
  right: 50px !important;
  bottom: 50px !important;
}

.fa-facebook:hover {
  color: #4267b2 !important;
}

.fa-twitter:hover {
  color: rgb(29, 161, 242) !important;
}

.fa-instagram:hover {
  color: #515BD4 !important;
}

.fa-vimeo:hover {
  color: #86c9ef !important;
}

.fa-linkedin-square:hover {
  color: rgb(0, 115, 176) !important;
}

.kr-bg-first-load {
  position: fixed;
  top: 0;
  height: 100%;
  left: 0;
  right: 0;
  z-index: 9999;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: .9s;
  overflow: hidden;
  cursor: progress;
}

.kr-bg-first-load h1 {
  opacity: 0;
  animation-name: text-first-load;
  animation-duration: 3s;
  animation-delay: 1s;
}

.arrow-right {
  cursor: pointer;
}

@keyframes text-first-load {
  0% { opacity: 0; }
  50% { opacity: 1; }
  100% {opacity: 0;}
}

.kr-overview {
  margin-top: 20%;
  transition: .8s;
  opacity: 0.1;
}

.kr-overview-name {
  margin-top: -60px;
  opacity: 0;
  transition: .6s;
}

.menu-icon .menu-dot {
  line-height: 0.5;
  font-size: 1.5rem;
}

.section-2-5 {
  padding: 100px 0;
}

.menu-bar-vertical {
  width: 80px;
  height: 100vh;
  float: left;
}

.menu-logo-vertical {
  opacity: 1;
  bottom: 80px;
  left: -35px;
  position: fixed;
  transform: rotate(-90deg);
}

#menu-logo-vertical {
  position: fixed;
  bottom: 300px;
  transform: rotate(-90deg);
  left: -35px;
  opacity: 0;
}

#menu-logo-horizontal a.white:hover,
#menu-logo-vertical a.black:hover {
  color: #ccc;
}

#about .section-2 .m-custom-row {
  margin: 0 10% !important;
}

#about .section-2 .m-custom-row .f-size-24 {
  line-height: 1.75;
}

#works {
  margin-bottom: 250px;
}

#works .container {
  min-width: 100% !important;
  padding-top: 0 !important;
}

#works.works-section .container .m-custom-row {
  margin: 0 65px !important;
}

#works .container .m-custom-row {
  margin: 0 80px !important;
}

#works .container .position-absolute {
  top: 0;
}

#works .container .position-absolute:hover {
  background-color: #00b0f0d6 !important;
  opacity: 1;
}

#work-1 .img-bg {
  background-image: url('../images/HUBweek_Intro.jpg');
  height: 600px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

#work-2 .img-bg {
  background-image: url('../images/YourRank.jpg');
  background-size: cover;
  height: 600px;
  background-position: center;
  background-repeat: no-repeat;
}

#work-3 .img-bg {
  background-image: url('../images/Bridges_intro.jpg');
  height: 620px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

#work-4 .img-bg {
  background-image: url('../images/Picture1.png');
  height: 670px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

.menu-item-vertical {
  width: 500px;
  position: fixed;
  transform: rotate(-90deg);
  left: -210px;
  top: 280px;
  z-index: 99999;
  text-align: right;
}

.about-body,
.contact-body,
.careers-body {
  width: calc(100% - 80px);
  margin-left: 80px;
}

#about-1 .container,
.title-contact-1 .container {
  padding: 50px 0;
}

#about-2 .container,
#about-3 .container {
  padding: 100px 0;
}

#about-2 .container .m-custom-row,
#about-3 .container .m-custom-row {
  margin: 0 10% !important;
}

.clearfix {
  clear: both;
}

#careers-1 .container {
  padding: 50px 0;
}

#careers-2 .bg-place {
  width: 100%;
  height: 650px;
  background-size: cover;
  background-image: url('../images/danang.jpg');
}

#careers-5 .bg-place {
  width: 100%;
  height: 650px;
  background-size: cover;
  background-position: center;
  background-image: url('../images/boston.webp');
}

#careers-8 .bg-place {
  width: 100%;
  height: 650px;
  background-size: cover;
  background-position: top;
  background-image: url('../images/marid.jpg');
}


.careers-2 .position {
  position: absolute;
  right: 50px;
  bottom: 20px;
}

.careers-3 .container,
.careers-4 .container {
  padding: 100px 0;
}

.careers-4 {
  margin-bottom: 200px;
}

.careers-last {
  padding-bottom: 200px;
}

.service-body,
.privacy-body {
  width: calc(100% - 80px);
  margin-left: 80px;
}

.service-1 .container {
  padding: 55px 0;
}

.service-2 img {
  width: 100%;
  height: 500px;
  object-fit: cover;
}

.service-3 .container {
  padding-top: 100px;
  padding-bottom: 100px;
}

.work-body {
  width: calc(100% - 160px);
  margin: auto;
}

.work-body .container {
  padding-top: 55px;
  padding-bottom: 100px;
}

.works-1 #work-1 .img-bg {
  background: url('../images/work-1.jpg') no-repeat;
  background-size: cover;
  height: 650px;
  background-position: 70%;
}

.works-1 #work-2 .img-bg {
  background: url('../images/Eatalk_intro.png') no-repeat;
  background-size: cover;
  height: 600px;
  background-position: center;
}

.works-1 #work-5 .img-bg {
  background: url('../images/HUBweek_Intro.jpg') no-repeat;
  background-size: cover;
  height: 650px;
  background-position: center;
}

.works-1 #work-7 .img-bg {
  background: url('../images/Bridges_intro.jpg') no-repeat;
  background-size: cover;
  height: 750px;
  background-position: center;
}

.works-1 #work-9 .img-bg {
  background: url('../images/foodmap_intro.jpg') no-repeat;
  background-size: cover;
  height: 650px;
  background-position: center;
}

.works-1 #work-3 .img-bg {
  background: url('../images/Picture1.png') no-repeat;
  background-size: cover;
  height: 600px;
  max-width: unset;
  background-position: center;
}

.works-1 #work-4 .img-bg {
  background: url('../images/YourRank.jpg') no-repeat;
  background-size: cover;
  height: 650px;
  background-position: center;
}

.works-1 #work-6 .img-bg {
  background: url('../images/Roomi_intro.png') no-repeat;
  background-size: 50%;
  height: 600px;
  background-position: center;
}

.works-1 #work-8 .img-bg {
  background: url('../images/LongBan_intro.jpg') no-repeat;
  background-size: cover;
  height: 650px;
  background-position: center;
}


.works-1 .sub-menu:hover,
.works-1 .sub-menu.active,
.jobs .active {
  text-decoration: line-through;
  color: black;
  cursor: pointer;
}


footer .py-3.text-left a.white:hover {
  text-decoration: line-through !important;
}

#works.works-1 .container {
  max-width: 100%;
}

.bg-map {
  position: absolute;
  top: 300px;
  background: url('../images/map.png') no-repeat;
  width: 100%;
  height: 100%;
  background-size: contain;
  opacity: 0.4;
}

.custom-form input[type=input],
.custom-form input[type=email] {
  border: none;
  padding: 0;
  border-bottom: 1px solid grey;
  border-radius: 0;
  font-size: 1.5rem;
}

.custom-form input:placeholder-shown {
  opacity: 0.3;
}

.custom-form input:active,
.custom-form input:focus {
  box-shadow: unset;
}

.custom-form button {
  border: 3px solid #00b0f0;
  border-radius: 0;
  font-size: 1.5rem;
  font-weight: 500;
}

.custom-form button.blue:hover {
  background: #00b0f0;
  color: #fff !important;
}

.custom-form .fa-paperclip {
  transform: rotate(225deg);
  font-size: 3rem;
  position: absolute;
  right: 0;
  top: 35px;
  cursor: pointer;
}

.contact-1 .container {
  padding-bottom: 200px;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#projects .carousel-indicators {
  margin: 0;
  display: block;
  width: auto;
  right: unset;
  left: 50px;
  bottom: 55px;
  z-index: 1;
}

#projects .carousel-indicators .project-item.active {
  display: block;
}

#projects .carousel-indicators .project-item {
  display: none;
  background-color: transparent;
}

.no-list-styled {
  list-style-type: none;
}

.bg-service {
  background-image: url('../images/ServicesBackground.jpg');
  background-size: cover;
  background-position: top;
  height: 600px;
  letter-spacing: 3px;
  overflow: hidden;
}

.bg-service .text-center {
  text-shadow: -2px 11px 1px #0000001f;
}

.bg-service .d-flex {
  position: absolute;
  width: 100%;
  bottom: 35%;
}

.bg-about {
  background-image: url('../images/MainBackground.jpg');
  background-size: cover;
  background-position: bottom right;
  height: 600px;
  letter-spacing: 3px;
  overflow: hidden;
}

#careers-menu .sub-menu.active {
  text-decoration: line-through;
  color: black;
}


#work .container.section-3 {
  max-width: 100%;
}

.inputfile {
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}

.no-effect:hover {
  color: unset !important;
}

.content-p {
  max-width: 800px;
  margin: auto;
  width: 100%;
}

#services .container .m-custom-row {
  margin: 0 10% !important;
}

.cursor-left {
  cursor: url('../images/icons/leftArrow50.svg'), auto;
}

.cursor-right {
  cursor: url('../images/icons/rightArrow50.svg'), auto;
}

.custom-modal {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #0000007a;
}

.custom-modal-dialog {
  max-width: 900px;
  margin: auto;
  width: 100%;
  min-height: 500px;
  background-color: #fff;
  border-radius: 6px;
  margin-top: 100px;
}

.custom-modal-header {
  padding: 20px;
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #eee;
}

.custom-modal-body {
  padding: 20px;
}

.outline-none {
  outline: none !important;
}

#about-dark {
  width: calc(100% - 80px);
  margin-left: 80px;
}

#about-dark .container .m-custom-row,
.tilte-works {
  margin: 0 10% !important;
}

#kr-menu .container {
  max-width: 98% !important;
  margin: auto !important;
}

#menu-bar .mx-4 {
  margin-left: 2rem !important;
  margin-right: 2rem !important;
}

@media screen and (min-width: 1200px) {
  .container {
    min-width: 96% !important;
  }
}

@media screen and (max-width: 1200px) {
  .f-size-100 {
    font-size: 3rem;
  }

  .f-size-64 {
    font-size: 2.75rem;;
  }

  .f-size-48 {
    font-size: 2.5rem;;
  }

  .f-size-32-5 {
    font-size: 2rem;
  }

  .f-size-32 {
    font-size: 1.75rem;
  }

  .f-size-24-5 {
    font-size: 1.5rem;
  }

  .f-size-24 {
    font-size: 1.25rem;
  }

  .f-size-20 {
    font-size: 1rem;
  }

  .service-body #service-1 .m-custom-row {
    margin: 20px 5px !important;
  }

  #about .section-2 .m-custom-row {
    margin: 0 !important;
  }

  .m-custom-row {
    margin: 0 70px !important;
  }

  #work-1 .img-bg {
    height: 500px;
  }
  
  #work-2 .img-bg {
    height: 450px;
  }
  
  #work-3 .img-bg {
    height: 450px;
  }
  
  #work-4 .img-bg {
    height: 500px;
  }
  
  .container.section-3 {
    max-width: 100%;
  }
}


@media screen and (max-width: 768px) {
  .f-size-100 {
    font-size: 2.75rem;
  }

  .f-size-64 {
    font-size: 2.5rem;;
  }

  .f-size-48 {
    font-size: 2.25rem;;
  }

  .f-size-32-5 {
    font-size: 2rem;
  }

  .f-size-32 {
    font-size: 1.75rem;
  }

  .f-size-24-5 {
    font-size: 1.5rem;
  }

  .f-size-24 {
    font-size: 1rem;
  }

  .f-size-20 {
    font-size: 0.75rem;
  }

  #kr-title-sv-1, #kr-title-sv-2, #kr-title-sv-3, #kr-title-sv-4 {
    display: none;
  }

  #kr-sv-container h2 {
    display: block !important;
  }

  #kr-postion-abs .container {
    padding: 20px !important;
  }

  #kr-sv-container {
    width: 100% !important;
  }

  .bg-service,
  .bg-abou {
    height: 300px;
  }
  
  .m-custom-row {
    margin: 0 20px !important;
  }

  .bg-service .f-size-64 {
    font-size: 1.5rem;
  }
}

@media screen and (max-width: 480px) {
  .f-size-100 {
    font-size: 3rem;
  }

  .f-size-64 {
    font-size: 2rem;;
  }

  .f-size-48 {
    font-size: 1.75rem;;
  }

  .f-size-32-5 {
    font-size: 1.5rem;
  }

  .f-size-32 {
    font-size: 1.25rem;
  }

  .f-size-24-5 {
    font-size: 1.2rem;
  }

  .f-size-24 {
    font-size: 1rem;
  }

  .f-size-20 {
    font-size: 0.75rem;
  }

  #kr-cookie {
    left: 15px;
    right: 15px;
    font-size: 0.875rem;
    width: 90%;
  }

  #kr-cookie p {
    margin-right: 20px !important;
  }

  #kr-overview {
    margin-left: 0 !important;
  }

  .kr-work-img {
    height: 500px !important;
  }

  .careers-body {
    margin-top: 50px;
  }

  .careers-body .py-5 {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
  }

  .menu-bar-vertical {
    width: 50px;
  }

  .menu-bar-vertical h3 {
    font-size: 1.5rem;
    margin-bottom: 15px;
  }

  .menu-item-vertical {
    left: -225px;
  }

  .menu-item-vertical span a, .menu-item-vertical span {
    font-size: 1.2rem;
  }

  /* .careers-1 .container {
    padding: 0px !important;
  } */

  .careers-3 .container {
    padding: 20px 0 !important;
  }

  .m-custom-row {
    margin: 0 !important;
    padding: 0 !important;
  }

  #careers-menu {
    padding: 0 20px !important;
  }

  .bg-place {
    height: 300px !important;
  }

  .careers-2 .position {
    right: 20px;
  }

  #careers-last {
    padding-bottom: 50px;
  }

  #careers-last .f-size-20 {
    font-size: 1rem;
    width: 100% !important;
    padding: 20px;
  }

  .careers-4 .container {
    padding: 30px 0 !important;
  }

  .careers-4 .container .blue,
  .careers-4 .container .grey {
    font-size: 1rem;
    margin-top: 0 !important;
  }

  section.careers-4,
  .about-body p {
    margin: 0 !important;
  }

  #about-1 .container .m-custom-row, #about-2 .container .m-custom-row, #about-3 .container .m-custom-row {
    margin: 0 15px !important;
  }

  #about-3.about-3 .container {
    padding: 50px 0 !important;
  }

  #about-2 .container {
    padding: 0 !important;
  }

  #about-2.about-2 .container,
  #about-3 .container {
    padding: 20px 0 !important;
  }

  #about-2 .container .m-custom-row .d-flex,
  #about-3 .container .d-flex.my-4 {
    display: block !important;
    margin-top: 50px !important;
    margin-bottom: 50px !important;
    width: 100%;
  }

  .d-flex.my-4 h1 {
    margin-bottom: 30px !important;
    min-width: unset !important;
    width: 100%;
  }

  .d-flex.align-items-center {
    width: 100% !important;
    margin: 20px 0 !important;
  }

  h1.f-size-100.f-weight-900.l-height-0 {
    min-width: 50px !important;
    width: auto;
  }

  .f-size-32.f-weight-500.l-height-1-5 {
    max-width: 300px;
  }
  
  .contact-1 .container {
    padding-left: 30px;
    padding-bottom: 150px;
  }
  
  .custom-form input[type=input], .custom-form input[type=email] {
    font-size: 1rem;
  }

  .custom-form .fa-paperclip {
    font-size: 1.5rem;
    top: 60px;
  }

  .work-body .container.pb-5 {
    padding: 50px 0 0 !important;
  }

  .work-body .container .m-custom-row .mb-5 {
    margin-bottom: 20px !important;
  }

  .work-body .container .m-custom-row .my-5 {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
  }

  .work-body .container {
    padding: 20px 0 !important;
  }

  .work-body .container .m-custom-row {
    padding: 0 !important;
  }

  .work-body .container .m-custom-row .col-12 {
    padding: 20px 0 !important;
  }

  section.work-1 .container {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  #works .container .m-custom-row {
    margin: 0 !important;
    padding: 0 !important;
  }

  .img-bg {
    height: 550px;
  }

  #works .container .col-12.px-5 {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .row.f-size-24-5.py-5.mb-5.l-height-1-7-5 {
    padding: 0 !important;
  }

  .no-list-styled.my-5.ml-5 {
    margin-left: 0 !important;
    padding-left: 20px;
    padding-right: 20px;
  }

  #menu-logo-vertical {
    display: none;
  }

  /* #about .section-2 .m-custom-row {
    margin: 10px !important;
  } */

  /* #about .container {
    padding: 20px;
  } */

  #about-dark .container {
    padding: 20px;
  }

  #services .container {
    padding: 20px 0 0 !important;
  }

  #works .container.section-3 .m-custom-row {
    margin: 0 !important;
  }

  #menu-bar {
    margin-top: 0px !important;
  }

  #menu-bar .mx-4 {
    margin-left: 5px !important;
    margin-right: 5px !important;
  }

  #projects .carousel-indicators {
    left: 20px;
    bottom: 40px;
    max-width: 200px;
  }

  .kr-social-media {
    right: 20px !important;
    bottom: 30px !important;
  }

  #projects .f-size-64 {
    font-size: 1.5rem !important;
    text-align: center;
  }
  
  .about-body,
  .careers-body,
  .contact-body,
  .service-body,
  .work-body {
    width: 100%;
    margin: auto;
  }

  .service-3 .container {
    padding-top: 0px;
    padding-bottom: 0px;
  }

  .bg-service,
  .bg-about {
    height: 250px;
  }

  .bg-service .f-size-64 {
    font-size: 1.25rem;
  }

  #services.pb-5 {
    padding-bottom: 0 !important;
  }
  
  .service-1 .container {
    padding: 20px 0 0;
  }

  #service-3 .container .py-5:first-child {
    padding: 20px 0 0 !important;
    margin-bottom: 0;
    font-size: 1.2rem;
  }

  #service-3 .container .py-5:last-child {
    padding: 20px 0 !important;
    margin-bottom: 0;
    font-size: 1.2rem;
  }

  .works-1 #work-1 .img-bg,
  .works-1 #work-2 .img-bg,
  .works-1 #work-3 .img-bg,
  .works-1 #work-4 .img-bg,
  .works-1 #work-5 .img-bg,
  .works-1 #work-6 .img-bg,
  .works-1 #work-7 .img-bg,
  .works-1 #work-8 .img-bg,
  .works-1 #work-9 .img-bg {
    height: 450px !important;
  }

  .title-contact-1 .container {
    padding-bottom: 20px !important;
  }

  .custom-form button {
    font-size: 1rem;
  }

  .work-body .container.overflow-hidden {
    padding: 40px 0 !important;
  }

  .content-p {
    padding-right: 10px;
  }

  .kr-overview-name.ml-5 {
    margin-left: 0 !important;
    margin-bottom: 20px !important;
  }

  #services .container .m-custom-row {
    margin: 0 5px !important;
  }

  #about .container {
    padding-left: 5px !important;
    padding-right: 5px !important;
  }

  .menu-icon .menu-dot {
    font-size: 1.2rem;
  }

  #about .section-2 .m-custom-row .f-size-24 {
    margin-left: 0 !important;
  }

  .kr-menu.open {
    padding: 20px 5px !important;
  }

  .kr-menu.open .container.mx-3 {
    margin: 0 !important;
  }

  .kr-menu.open .container .col-3 {
    font-size: 14px;
  }

  .project-item {
    font-size: 1rem;
  }

  .project-item a {
    margin-left: 5px !important;
  }

  #works {
    margin-bottom: 20px;
  }

  footer .pt-5 {
    padding: 20px 0 !important;
  }

  #column-left {
    margin-top: 0 !important;
  }

  #works .container .position-absolute:hover {
    padding: 20px !important;
  }

  #works.works-1 .container {
    padding-bottom: 20px !important;
  }

  #about-dark {
    width: calc(100% - 20px);
    margin-left: 20px;
  }

  #about-dark .container .m-custom-row {
    margin: 0 !important;
  }

  .work-body.detail-page {
    padding: 20px;
  }
}