/*
Theme Name: Flatsome Child
Description: This is a child theme for Flatsome Theme
Author: UX Themes
Template: flatsome
Version: 3.0
*/

/*************** ADD CUSTOM CSS HERE.   ***************/
.zalo-container img {
  max-width: 100%;
  height: auto;
}

.zalo-container {
  position: fixed;
  width: 40px;
  height: 40px;
  bottom: 120px;
  z-index: 9999999;
}

.zalo-container:not(.right) {
  left: 2.5rem;
}

.zalo-container.right {
  right: 2.5rem;
}

.zalo-container a {
	display: block;
}

.zalo-container span {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  -ms-align-items: center;
  align-items: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: #1182FC;
  position: relative;
}

@keyframes zoomIn_zalo {
	from {
		opacity: 0;
		transform: scale3d(.3, .3, .3);
	}
	50% {
		opacity: 1;
	}
}

.zoomIn_zalo {
  animation-name: zoomIn_zalo;
}

.animated_zalo {
  animation-duration: 1s;
  animation-fill-mode: both;
}

.animated_zalo.infinite {
  animation-iteration-count: infinite;
}

.cmoz-alo-circle {
  width: 50px;
  height: 50px;
  top: -5px;
  right: -5px;
  position: absolute;
  background-color: transparent;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  border: 2px solid rgba(17, 130, 252, .8);
  opacity: .1;
  border-color: #1182FC;
  opacity: .5;
}

.cmoz-alo-circle-fill {
  width: 60px;
  height: 60px;
  top: -10px;
  position: absolute;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  -webkit-border-radius: 100%;
  -moz-border-radius: 100%;
  border-radius: 100%;
  border: 2px solid transparent;
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  -o-transition: all .5s;
  transition: all .5s;
  background-color: rgba(17, 130, 252, 0.45);
  opacity: .75;
  right: -10px;
}

@-webkit-keyframes pulse_zalo {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes pulse_zalo {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.pulse_zalo {
  -webkit-animation-name: pulse_zalo;
  animation-name: pulse_zalo;
}

.hotline-phone-ring-wrap {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 999999;
}

.hotline-phone-ring {
  position: relative;
  visibility: visible;
  background-color: transparent;
  width: 110px;
  height: 110px;
  cursor: pointer;
  z-index: 11;
  -webkit-backface-visibility: hidden;
  -webkit-transform: translateZ(0);
  transition: visibility .5s;
  left: 0;
  bottom: 0;
  display: block;
}

.hotline-phone-ring-circle {
	width: 87px;
  height: 87px;
  top: 10px;
  left: 10px;
  position: absolute;
  background-color: transparent;
  border-radius: 100%;
  border: 2px solid #e60808;
  -webkit-animation: phonering-alo-circle-anim 1.2s infinite ease-in-out;
  animation: phonering-alo-circle-anim 1.2s infinite ease-in-out;
  transition: all .5s;
  -webkit-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  opacity: 0.5;
}

.hotline-phone-ring-circle-fill {
	width: 57px;
  height: 57px;
  top: 25px;
  left: 25px;
  position: absolute;
  background-color: rgba(230, 8, 8, 0.7);
  border-radius: 100%;
  border: 2px solid transparent;
  -webkit-animation: phonering-alo-circle-fill-anim 2.3s infinite ease-in-out;
  animation: phonering-alo-circle-fill-anim 2.3s infinite ease-in-out;
  transition: all .5s;
  -webkit-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}

.hotline-phone-ring-img-circle {
	background-color: #e60808;
	width: 33px;
  height: 33px;
  top: 37px;
  left: 37px;
  position: absolute;
  background-size: 20px;
  border-radius: 100%;
  border: 2px solid transparent;
  -webkit-animation: phonering-alo-circle-img-anim 1s infinite ease-in-out;
  animation: phonering-alo-circle-img-anim 1s infinite ease-in-out;
  -webkit-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hotline-phone-ring-img-circle .pps-btn-img {
	display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.hotline-phone-ring-img-circle .pps-btn-img img {
	width: 20px;
	height: 20px;
}

.hotline-bar {
  position: absolute;
  background: rgba(230, 8, 8, 0.75);
  height: 40px;
  width: 200px;
  line-height: 40px;
  border-radius: 3px;
  padding: 0 10px;
  background-size: 100%;
  cursor: pointer;
  transition: all 0.8s;
  -webkit-transition: all 0.8s;
  z-index: 9;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.1);
  border-radius: 50px !important;
  /* width: 175px !important; */
  left: 33px;
  bottom: 37px;
}

.hotline-bar > a {
  color: #fff;
  text-decoration: none;
  font-size: 15px;
  font-weight: bold;
  text-indent: 50px;
  display: block;
  letter-spacing: 1px;
  line-height: 40px;
  font-family: Arial;
}

.hotline-bar > a:hover,
.hotline-bar > a:active {
  color: #fff;
}

@-webkit-keyframes phonering-alo-circle-anim {
  0% {
    -webkit-transform: rotate(0) scale(0.5) skew(1deg);
    -webkit-opacity: 0.1;
  }
  30% {
    -webkit-transform: rotate(0) scale(0.7) skew(1deg);
    -webkit-opacity: 0.5;
  }
  100% {
    -webkit-transform: rotate(0) scale(1) skew(1deg);
    -webkit-opacity: 0.1;
  }
}
@-webkit-keyframes phonering-alo-circle-fill-anim {
  0% {
    -webkit-transform: rotate(0) scale(0.7) skew(1deg);
    opacity: 0.6;
  }
  50% {
    -webkit-transform: rotate(0) scale(1) skew(1deg);
    opacity: 0.6;
  }
  100% {
    -webkit-transform: rotate(0) scale(0.7) skew(1deg);
    opacity: 0.6;
  }
}
@-webkit-keyframes phonering-alo-circle-img-anim {
  0% {
    -webkit-transform: rotate(0) scale(1) skew(1deg);
  }
  10% {
    -webkit-transform: rotate(-25deg) scale(1) skew(1deg);
  }
  20% {
    -webkit-transform: rotate(25deg) scale(1) skew(1deg);
  }
  30% {
    -webkit-transform: rotate(-25deg) scale(1) skew(1deg);
  }
  40% {
    -webkit-transform: rotate(25deg) scale(1) skew(1deg);
  }
  50% {
    -webkit-transform: rotate(0) scale(1) skew(1deg);
  }
  100% {
    -webkit-transform: rotate(0) scale(1) skew(1deg);
  }
}

@media (max-width: 768px) {
  .hotline-bar {
    display: none;
  }
}

.menu-item.switch_lang {
	   
}

.menu-item.edit_translation {
	display: none;
}
.archive .shop-page-title {
	    padding-top: 30px !important;
}
.box-blog-post .box-image::before {
    content: "";
    background-image: url(https://o.webtien.com/wp-content/uploads/2023/10/line-2.svg);
    background-size: auto;
    width: 100%;
    height: 20px;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
}

.section-project .show-on-hover {
    opacity: 1;
    background-color: rgb(5 20 13 / 72%) !important;
    background-image: -webkit-gradient(linear, left bottom, left top, from(#0b0d29), color-stop(45%, transparent));
    border-radius: 0 0 10px 10px;
}

.section-contact-banner::before {
    content: "";
    background-image: url(https://o.webtien.com/wp-content/uploads/2023/10/line.svg);
    background-size: auto;
    width: 100%;
    height: 40px;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
    transform: rotate(180deg);
}

.section-banner::before {
    content: "";
    background-image: url(https://o.webtien.com/wp-content/uploads/2023/10/line.svg);
    background-size: auto;
    width: 100%;
    height: 40px;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
    transform: rotate(180deg);
}

.section-product .product-small .col-inner {
	  padding: 0px 0px 30px 0px;
    background-color: #ffffff;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 0px 10px 15px 0px rgba(0,0,0,0.15);
}

.section-product .product-small .box-image {
	    border-radius: 10px 10px 0px 0;
}

.section-product .box-text {
	padding: 20px 20px 0;
}

.section-product .box-text a {
	font-size: 22px;
    text-align: center;
    margin: 0 auto;
    display: block;
    color: black;
    font-weight: bold;
    min-height: 55px;
}

.section-product {
	    margin-top: -120px;
    z-index: 2;
}

.box-text-products a {
	font-size: 22px;
    text-align: center;
    margin: 0 auto;
    display: block;
    color: black;
    font-weight: bold;
    min-height: 55px;
}

.products .product-small .col-inner, .related .product-small .col-inner {
    background-color: #ffffff;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 0px 10px 15px 0px rgba(0,0,0,0.15);
}

.related .product-small .col-inner .box-image {
	border-radius: 10px 10px 0 0px;
}

.page-col.col .col-inner {
	    margin-bottom: 0px;
    box-shadow: 0px 5px 15px 0px rgba(0,0,0,0.15);
    border-radius: 10px;
}

.page-col.col .col-inner .page-box{
	    display: table;
    table-layout: fixed;
    width: 100%;
}

.page-col.col .page-box>.box-image {
    margin: 0;
	    position: relative;
	border-radius: 10px 0 0 10px;
}

.page-col.col:nth-child(2n+1) .page-box .box-image {
	border-radius: 0 10px 10px 0;
}
.page-col.col .page-box>.box-text {
    vertical-align: middle;
    width: 60%;
    margin: 0;
    display: table-cell;
    position: relative;
    padding: 0 30px;
    color: black;
    font-size: 24px;
    line-height: 32px;
}
.page-col.col:nth-child(2n+1) .page-box {
	direction: rtl;
}

.page-col.col:nth-child(2n+1) .page-box>.box-text {
	
    text-align: right;
}

.more-link .meta-nav {
	display: none;
}
h1 {
	
	font-weight: bold !important;
}

h2 {
   
    font-weight: 600 !important;
}

h3 {
    
    font-weight: 600 !important;
}


 [data-animate] {
    transition: filter 0.3s,transform 0.8s,opacity 0.1s ease-in !important;
}


.header-full-width .container {
    padding: 0 55px;
}

.header-language-dropdown i {
	margin: 0 7px;
}

.header-language-dropdown .nav-dropdown a {
	text-transform: inherit;
    letter-spacing: normal;
    
    color: #010524 !important;
    font-size: 15px;
    line-height: 1em;
    font-weight: 600;
}
.nav-dropdown-has-border .nav-dropdown {
    border: 1px solid #ddd;
    padding: 15px;
}

.stuck .header-main .nav > li > a {
    line-height: 20px !important;
}

.header-inner .flex-left .header-nav {

}

.header-inner .flex-left .header-nav>li {
	margin-right: 32px;
}
.header-inner .flex-left .header-nav li a {
    letter-spacing: normal;
    
    color: white;;
    font-size: 15px;
    line-height: 1em;
    font-weight: 600;
}

.nav-dropdown {
	min-width: 310px;
}

.page-template-page-transparent-header-light .flex-left .header-nav li a, .tax-featured_item_category .flex-left .header-nav li a {
	color: white;
}

.header-inner .flex-left .header-nav li a:hover {
	color: #777;
}

.page-template-page-transparent-header-light .flex-left .header-nav li a:hover, .tax-featured_item_category .flex-left .header-nav li a:hover {
        color: #ccc;
}

body .flex-left .header-nav .sub-menu li a:hover {
	color: #848484;
}

.header-inner .flex-left .sub-menu li a {
	text-transform: inherit;
    letter-spacing: normal;
    
    color: #010524;
    font-size: 15px;
    line-height: 1.6em;
    font-weight: 600;
}

.flex-col.hide-for-medium.flex-right .menu-item a {
    border-style: solid;
    border-width: 1px;
    background-color: #ab6930;
    border: none;
    color: #fff !important;
    font-size: 15px !important;
    width: 150px;
    text-align: center;
    display: block;
    border-radius: 5px;
    max-height: 48px;
	font-weight: bold;
}

.section-banner .overlay {
    background: linear-gradient(180deg, #2b1f19eb, transparent), linear-gradient(180deg, rgb(0 0 0 / 36%), rgb(0 0 0 / 19%));
}
.section-banner .icon-angle-down {
	color: white;
}
.section-banner .button {
	padding: 12px 45px !important;
    border-style: solid;
    border-width: 1px;
    background-color: #ab6930;
    border: none;
    color: #fff !important;
    font-weight: 400 !important;
    text-transform: inherit !important;
    font-size: 15px !important;
	margin-top: 20px;
}

.section-banner .title p {
	font-size: 55px;
    color: white;
    
    margin: -10px 0px 0px;
    font-weight: bold;
}

.section-banner .top p {
    margin-bottom: 15px;
    
    font-size: 15px;
    line-height: 1.2em;
}

.section-banner .description p {
	    margin-top: 20px;
    color: #fff;
    font-size: 19px;
    line-height: 1.4em;
    text-align: center;
}


.section-banner .text-box-content {
    font-size: 100%;
    max-width: 700px;
    margin: 0 auto;
}

.section-service {
	padding: 60px 0px 30px !important;
}

.section-service .row-title {
	margin-bottom: 30px;
}

.section-service .box-text p {
	font-weight: 700;
}
.section-about .section-bg-overlay {
    background-image: linear-gradient(90deg, #091109, transparent), linear-gradient(180deg, rgb(0 0 0 / 50%), rgb(0 0 0 / 50%));
}
.section-about {
    padding: 150px 0 90px 0 !important;
}

.section-about h2 {
	margin-top: 10px;
    margin-bottom: 25px;
    font-size: 35px;
	position: relative;
	    padding-left: 40px;
}

.section-about h2::before {
   content: "Our benefit";
    display: inline-block;
    position: absolute;
    left: 10px;
    top: 0%;
    right: auto;
    bottom: 0%;
    width: 120px;
    margin-top: 5px;
    margin-bottom: 0px;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    color: #d9a881;
    text-align: center;
    font-size: 15px;
    
    font-weight: 400;
    margin-left: -18px;
}

.section-about p {
	    margin-top: 10px;
    margin-bottom: 10px;
    line-height: 1.6em;
    font-size: 19px;
}


.section-about .button {
	    padding: 12px 45px !important;
    border-style: solid;
    border-width: 1px;
    background-color: #ab6930;
    border: none;
    color: #fff !important;
    font-weight: 400 !important;
    text-transform: inherit !important;
    font-size: 15px !important;
    margin-top: 30px;
}

.section-service .row-title h2 {
    margin-bottom: 10px;
    line-height: 1.2em;
    color: #010524;
    font-size: 35px;
	padding-left: 40px;
	text-align: center;
}


.section-service .row-title  p {
	margin-top: 10px;
    margin-bottom: 0px;
    color: #010524;
    font-size: 22px;
    line-height: 1.2em;
    font-weight: 500;
}

.section-service .button {
    color: #ab6930;
    font-size: 15px;
    line-height: 2em;
    font-weight: 600;
    border: none;
    background-color: transparent !important;
}
.section-service .button:hover {
	color: #333;
	box-shadow: none;
}

.section-service .row-content h3 {
	    margin-top: 10px;
    margin-bottom: 10px;
    color: #010524;
    font-size: 20px;
    line-height: 1.2em;
    font-weight: 600;
}

.section-service .row-content p {
	    margin-top: 10px;
    margin-bottom: 10px;
    font-family: Roboto, sans-serif;
    color: #777;
    font-size: 16px;
    line-height: 1.6em;
}


.section-service .row-content h3 {
	    margin-top: 10px;
    margin-bottom: 10px;
    color: #010524;
    font-size: 20px;
    line-height: 1.2em;
    font-weight: 600;
}

.section-service .row-content p {
	    margin-top: 10px;
    margin-bottom: 10px;
    font-family: Roboto, sans-serif;
    color: #777;
    font-size: 16px;
    line-height: 1.6em;
    font-weight: 400;
}

.section-service .icon-box-img {
	    margin-top: 28px;
}

.section-service  .icon-box-left .icon-box-img+.icon-box-text {
    padding-left: 35px;
}

.section-reason .icon-box-text {
	padding-left: 28px !important;
}


.section-reason {
	padding: 70px 0 40px !important;
}
.section-reason .row-title h2 {
    margin-bottom: 10px;
    line-height: 1.2em;
    color: #010524;
    font-size: 35px;
	padding-left: 40px;
	text-align: center;
}


.section-reason .row-title  p {
	margin-top: 10px;
    margin-bottom: 0px;
    color: #010524;
    font-size: 22px;
    line-height: 1.2em;
    font-weight: 500;
}

.section-reason .row-content h3 {
	    margin-top: 10px;
    margin-bottom: 10px;
    color: #010524;
    font-size: 20px;
    line-height: 1.2em;
    font-weight: 600;
}

.section-reason .row-content p {
	    margin-top: 10px;
    margin-bottom: 10px;
    font-family: Roboto, sans-serif;
    color: #777;
    font-size: 16px;
    line-height: 1.6em;
}

.section-reason .icon-box-img {
	    margin-top: 28px;
}

.section-reason .icon-box-text {
	padding-left: 28px !important;
}

.section-reason .icon-box-left .icon-box-img+.icon-box-text {
    padding-left: 35px;
}

.section-project .box-image {
	border-radius: 10px;
}

.section-project {
	padding: 60px 0 20px !important;
}

.section-project .mb-half {
	    margin-bottom: 65px;
}

.section-project .heading-title h2 {
    color: #010524;
    font-size: 35px;
    line-height: 1.2em;
	text-align: center;
	margin-bottom: 20px;
}

.section-project .nav li a {
	    font-size: 15px;
    text-transform: none;
    letter-spacing: normal;
	color: #777;
}

.section-project .nav li.active a {
    color: #ab6930;
}

.section-project .box-image .overlay {
	background-color: rgb(5 20 13 / 72%) !important;
    background-image: -webkit-gradient(linear, left bottom, left top, from(#0b0d29), color-stop(45%, transparent));
	opacity: 0 !important;
    transition: transform .1s,opacity .3s;
}

.section-project .portfolio-box-title {
    text-transform: initial;
    margin-bottom: 20px;
    opacity: 1;
    color: #fff;
    font-size: 24px;
    line-height: 1.2em;
    
    font-weight: 600;
}

.section-project .portfolio-box-category {
	opacity: 1;
}

.section-project .portfolio-box-category span {
	    color: #d9a881;
    text-shadow: none;
    letter-spacing: normal;
    text-transform: initial;
    font-size: 15px;
}

.section-project .portfolio-box {
	position: relative;
}

.section-project .box-image:before {
	content: '';
	    position: absolute;
    left: auto;
    top: 0%;
    right: 0%;
    bottom: auto;
    width: 70px;
    height: 70px;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    border-style: none solid solid none;
    border-width: 70px 70px 70px 1px;
    border-color: #ab6930 #ab6930 transparent #000;
	z-index: 1;
	opacity: 0;
	transition: transform .1s,opacity .3s;
}

.section-project .box-image:after {
	    content: '+';
    margin-top: 15px;
    margin-right: 15px;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    z-index: 2;
    position: absolute;
    top: 0;
    right: 0;
    padding: 0;
    line-height: 15px;
	opacity: 0;
	transition: transform .1s,opacity .3s;
}


.section-project .portfolio-box:hover .overlay {
	opacity: 1 !important;
}


.section-project .portfolio-box:hover .box-image:after, .section-project .portfolio-box:hover .box-image:before {
	opacity: 1;
}


.section-contact img {
	max-height: 520px;
}
.section-contact h2 {
	margin-bottom: 10px;
    color: #010524;
    font-size: 36px;
    line-height: 1.2em;
    font-weight: 600;
}

.section-contact p {
	    margin-top: 10px;
    margin-bottom: 10px;
    color: #777;
    font-size: 16px;
    line-height: 1.6em;
}

.section-contact p:nth-child(2) {
	    margin-top: 10px;
    color: #010524;
    font-size: 22px;
    line-height: 1.2em;
    font-weight: bold;
    margin-bottom: 30px;
}

.section-contact .button {
	padding: 12px 45px !important;
    border-style: solid;
    border-width: 1px;
    background-color: #ab6930;
    border: none;
    color: #fff !important;
    font-weight: 400 !important;
    text-transform: inherit !important;
    font-size: 15px !important;
    margin-top: 40px;
}

.section-cta {
    padding: 150px 0 120px !important;
}

.section-cta p {
		font-size: 19px;
	}
	
	.section-cta h2 {
    margin-bottom: 35px;
    font-size: 35px;
    line-height: 1.2em;
}

.section-cta .col-inner {
	    margin: 0 auto !important;
}

.section-cta .button {
	    padding: 12px 45px !important;
    border-style: solid;
    border-width: 1px;
    background-color: white !important;
    border: none;
    color: #ab6930 !important;
    font-size: 18px !important;
    margin-top: 30px;
    font-weight: bold;
    margin-bottom: -10px;
}

.section-cta .button:hover {
	background-color: #ab6930 !important;
	color: white !important;
}

.section-cta .section-bg.bg-loaded {
background-position: 0 100px;
    width: 580px;
    height: 550px;
    opacity: 0.4;
}

.section-post {
	padding: 60px 0 40px !important;
}
.section-post .box {
	    box-shadow: 0 0 10px 0 rgb(137 138 145 / 15%);
}

.section-post .box-text {
	padding: 25px 20px;
}

.section-post .is-divider {
	display: none;
}

.section-post .post-title {
	font-size: 20px;
    line-height: 1.2em;
    font-weight: 500;
    color: #010524;
    margin-bottom: 15px;
	min-height: 48px;
}

.section-post .from_the_blog_excerpt {
	    margin-bottom: 10px;
    color: #777;
    font-size: 16px;
    line-height: 1.6em;
}

.section-post .box-text .button {
    color: #ab6930;
    font-size: 15px;
    line-height: 2em;
    text-decoration: none;
    letter-spacing: normal;
    background: none;
    border: none;
    text-transform: inherit;
    font-weight: normal;
    margin-top: 0px;
    padding: 0;
}

.section-post .box-text .button:before {
	content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    background-color: #ab6930;
    height: 1px;
    margin-top: 18px;
    margin-left: 75px;
	transition: width 0.5s ease, margin-left 0.5s ease;
}

.section-post .box-text .button:hover {
	color: #333;
}

.section-post .box-text .button:hover:before {
	background-color: #333;
	width: 65px;
	 margin-left: 85px;
}

.section-post .row-title h2 {
    margin-bottom: 10px;
    line-height: 1.2em;
    color: #010524;
    font-size: 35px;
	padding-left: 40px;
	margin-bottom: 30px;
	text-align: center;
}


.section-post .row-title  p {
	margin-top: 10px;
    margin-bottom: 0px;
    color: #010524;
    font-size: 22px;
    line-height: 1.2em;
    font-weight: 500;
	
}
.section-reviews h2 {
    margin-bottom: 10px;
    line-height: 1.2em;
    color: #010524;
    font-size: 35px;
    text-align: center;
	margin-bottom: 20px;
}

.section-reviews {
	padding: 60px 0 30px 0 !important;
}

.section-reviews .banner-bg {
	    background: #f9f9fa;
}

.section-reviews .text-content p {
	    max-width: 930px;
    margin-top: 30px;
    margin-bottom: 0px;
    font-size: 22px;
    text-align: center;
    color: #777;
    line-height: 1.6em;
}

.section-reviews .img-content img, .section-reviews .img-content .img {
	    height: 100px;
    width: 100px;
	border-radius: 100%;
}

.section-reviews .testimonial-text p:nth-child(1) {
	    margin-top: 15px;
    margin-bottom: 10px;
    color: #010524;
    font-size: 20px;
    line-height: 1.2em;
    font-weight: 500;
	    font-style: normal;
}

.section-reviews .testimonial-text p:nth-child(2) {
	    margin-top: 0px;
    margin-bottom: 0px;
    color: #ab6934;
	font-size: 16px;
	    font-style: normal;
}

.section-reviews .testimonial-box {
	max-width: 270px;
	    margin-top: 30px;
}

.section-reviews svg path {
	fill: #ab6934 !important;
}

.section-project-detail h6 {
	    
    color: #010524;
    font-size: 20px;
    line-height: 1.5em;
    font-weight: 600;
    text-transform: inherit;
    text-rendering: initial;
    margin-bottom: 8px;
    letter-spacing: inherit;
}

.section-project-detail .nav li a {
	    
    font-size: 15px;
    text-transform: initial;
}

.section-project-detail .nav li.active a {
	color: #ab6930;
}

.section-project-detail .container {
	margin: 90px auto 45px;
}

.section-project-detail .portfolio-box-category {
	opacity: 0;
	display: none;
}

.section-project-detail .show-on-hover {
	    
    color: #ab6930;
    font-size: 15px;
    line-height: 2em;
    font-weight: 600;
    text-decoration: none;
    opacity: 1 !important;
    text-transform: initial;
}

	.footer-2 ul li button {
		display: none;
	}
	
.footer-1 img {
	height: 70px;
	width: auto;
}

.footer-1 {
    padding: 70px 0 20px;
}
.footer .widget>ul>li+li, .footer ul.menu>li+li {
	border-top: none;
}

.footer .widget .is-divider {
	    background-color: #ab6934;
	
}

.copyright-footer {
	color: black;
}
.footer-1 p {
    font-weight: 400;
    color: black;
}

.footer-1 .row .col:nth-child(1), .footer-1 .row .col:nth-child(2) {
	flex-basis: 28%;
    max-width: 28%;
	padding-right: 45px;
}

.footer-1 .row .col:nth-child(3) {
	flex-basis: 44%;
    max-width: 44%;
}

.footer-1 .row .col:nth-child(3) .textwidget>p {
    margin-bottom: 20px;
    margin-top: -5px;
    font-family: Muli, sans-serif;
    font-size: 42px;
    line-height: 1.2em;
    font-weight: 600;
}

.footer-1 form input.wpcf7-email {
    background: none;
    opacity: 1;
    box-shadow: none;
    height: 55px;
}

.footer-1 form .wpcf7-form-control-wrap {
    margin-right: 20px;
    float: left;
    width: calc(100% - 150px);
}

.absolute-footer.dark {
    padding-bottom: 70px;
}

.footer-1 form .wpcf7-submit {
	    width: 130px;
    height: 55px;
    margin: 0 !important;
    padding: 0 !important;
	    font-size: 15px;
    text-transform: capitalize;
}


.footer-1 .row .col:nth-child(3) .textwidget>p {
    margin-bottom: 20px;
    margin-top: -5px;
    font-size: 30px;
    line-height: 1.2em;
    font-weight: 600;
}

.footer-1 .social-icons a {
	    border: none;
    margin-right: 28px;
		min-width: 0;
}

.footer-1 .social-icons a.icon.button i {
	font-size: 17px;
}
.footer-1 .social-icons a.icon.button:hover {
	background: none !important;
}

.footer-1 .social-icons a.icon.button:hover i {
	color: #d9a881 !important;
}
.footer-2 ul {
	display: flex;
}

.footer-2 ul li {
	margin-right: 30px;
}

.footer-2 .menu-item a {
	    font-size: 15px;
    line-height: 2em;
}

.section-contact-banner {
	padding: 140px 0 40px !important;
}
.section-contact-banner .section-bg-overlay {
	    background: linear-gradient(180deg, #050c08, transparent), linear-gradient(180deg, rgb(0 0 0 / 50%), rgb(0 0 0 / 50%));
}

.section-contact-banner .col-inner {
    margin-left: inherit !important;
}

.section-contact-banner h1 {
	    display: block;
    margin-top: 0;
    margin-bottom: 0;
    font-size: 50px;
    line-height: 1.2em;
	padding-left: 40px;
	position: relative;
	margin-bottom: 28px;
}

.section-contact-banner h1::before {
    content: "Contact us";
    display: inline-block;
    position: absolute;
    left: 10px;
    top: 0%;
    right: auto;
    bottom: 0%;
    width: 120px;
    margin-top: 0px;
    margin-bottom: 0px;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    color: #d9a881;
    text-align: center;
    font-size: 15px;
    
    font-weight: 600;
    margin-left: -35px;
}

.section-contact-banner .col-inner>p {
	    color: #fff;
    font-size: 19px;
}

.section-contact-banner .col-inner {
    max-width: 620px;
}

.section-contact-info {
	    padding: 120px 0 80px !important;
}
.section-contact-info h2 {
	    display: block;
    margin-top: 0;
    margin-bottom: 0;
  color: #010524;
    font-size: 35px;
    line-height: 1.2em;
	padding-left: 40px;
	position: relative;
	margin-bottom: 28px;
}

.section-contact-info h2::before {
    content: "Our contacts";
    display: inline-block;
    position: absolute;
    left: 10px;
    top: 0%;
    right: auto;
    bottom: 0%;
    width: 120px;
    margin-top: 0px;
    margin-bottom: 0px;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    color: #d9a881;
    text-align: center;
    font-size: 15px;
    
    font-weight: 600;
    margin-left: -35px;
}

.section-contact-info .col-inner>p {
	color: #010524;
    font-size: 20px;
    line-height: 1.2em;
    font-weight: 600;
    
}

.section-contact-info .icon-box, .footer .icon-box {
	margin-bottom: 15px;
}

.footer .icon-box {
	margin-bottom: 5px;
}

.section-contact-info .icon-box p, .footer .icon-box p {
	margin-bottom: 3px;
}

.footer span.widget-title {
	    text-transform: initial;
    font-size: 26px;
    color: black;
}
.section-contact-info form textarea, .section-contact-info .wpcf7-text {
	    box-shadow: none;
    border: 1px solid #ab6930;
    font-weight: 400;
    font-size: 15px;
}

.section-contact-info form textarea{
	min-height: 200px;
}

/* .section-contact-info form span[data-name="your-name"] {
	width: calc(50% - 10px);
    float: left;
}

.section-contact-info form span[data-name="your-email"] {
	width: calc(50% - 10px);
    float: right;
}
 */

.section-contact-info .wpcf7-submit {
	    width: 100%;
    height: 58px;
    font-weight: 500;
    text-transform: capitalize;
}

.section-contact-info .row>.col {
	padding-bottom: 0;
}

.section-about-banner {
        padding: 140px 0 0px !important;
}

.section-about-banner .section-bg-overlay {
	    background: linear-gradient(180deg, #050c08, transparent), linear-gradient(180deg, rgb(0 0 0 / 50%), rgb(0 0 0 / 50%));
}

.section-about-banner.col-inner {
    margin-left: inherit !important;
}

.section-about-banner h1 {
	    display: block;
    margin-top: 0;
    margin-bottom: 0;
    font-size: 50px;
    line-height: 1.2em;
	padding-left: 40px;
	position: relative;
	margin-bottom: 28px;
}

.section-about-banner h1::before {
    content: "About Hasy";
    display: inline-block;
    position: absolute;
    left: 10px;
    top: 0%;
    right: auto;
    bottom: 0%;
    width: 120px;
    margin-top: 0px;
    margin-bottom: 0px;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    color: #d9a881;
    text-align: center;
    font-size: 15px;
    
    font-weight: 600;
    margin-left: -35px;
}

.section-about-banner p {
	    color: #fff;
    font-size: 19px;
}

.section-about-banner .col-inner {
    margin-left: inherit !important;
	max-width: 660px;
}

.section-about-banner .button {
	    padding: 12px 45px !important;
    border-style: solid;
    border-width: 1px;
    background-color: #ab6930;
    border: none;
    color: #fff !important;
    text-transform: inherit !important;
    font-size: 18px !important;
	margin-top: 20px;
}

.text.project-stat {
    left: 120px;
    top: 90px;
    right: auto;
    width: 270px;
    padding-top: 30px;
    padding-bottom: 5px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    grid-row-gap: 50px;
    background-color: #ab6930;
    text-align: center;
    z-index: 9999;
}

.project-stat p:nth-child(2n + 1) {
	    
    font-size: 36px;
    font-weight: 600;
	    margin-bottom: 5px;
}

.project-stat p:nth-child(2n) {
	
    font-weight: 600;
    font-size: 16px;
    line-height: 1.6em;
	margin-bottom: 30px;
}

.section-stat {
    position: absolute;
    top: 220px;
    left: 65%;
    max-width: 270px;
}

.section-about-banner .banner .overlay {
	    background: linear-gradient(180deg, rgb(17 22 18 / 50%), rgb(0 0 0 / 50%));
}

.section-about-banner .banner {
	  margin-left: 6%;  
}

.section-about-content {
	padding: 60px 0 30px !important;
}

.section-about-content .col-inner>p {
    margin-top: 0;
    margin-top: 15px;
    margin-bottom: 15px;
}
.section-about-content img {
	border-radius: 10px;
}
.section-about-content h2 {
    margin-bottom: 30px;
    display: block;
    color: #010524;
    font-size: 35px;
    line-height: 1.2em;
	position: relative;
}
.section-about-10 {
	padding: 50px 0 30px !important;
}

.section-about-10 h2 {
	 margin-bottom: 30px;
    display: block;
    color: #010524;
    font-size: 35px;
    line-height: 1.2em;
	position: relative;
}

.section-about-10 .col-2 {
	    display: flex;
    justify-content: center;
    align-items: center;

}

.section-about-10 img {
	border-radius: 10px;
}

.section-service-banner {
    padding: 180px 0 120px !important;
}

.section-service-banner::before {
    content: "";
    background-image: url(https://o.webtien.com/wp-content/uploads/2023/10/line.svg);
    background-size: auto;
    width: 100%;
    height: 40px;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
    transform: rotate(180deg);
}

.section-service-banner .section-bg-overlay {
	    background: linear-gradient(180deg, #050c08, transparent), linear-gradient(180deg, rgb(0 0 0 / 50%), rgb(0 0 0 / 50%));
}

.section-service-banner p {
	    color: #fff;
    font-size: 19px;
}

.section-service-banner .col-inner {
    margin-left: inherit !important;
}

.section-service-banner h1 {
	    display: block;
    margin-top: 0;
    margin-bottom: 0;
    font-size: 50px;
    line-height: 1.2em;
	padding-left: 40px;
	position: relative;
	margin-bottom: 28px;
	max-width: 350px;
}

.section-service-banner h1::before {
    content: "Best service";
    display: inline-block;
    position: absolute;
    left: 10px;
    top: 0%;
    right: auto;
    bottom: 0%;
    width: 120px;
    margin-top: 0px;
    margin-bottom: 0px;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    color: #d9a881;
    text-align: center;
    font-size: 15px;
    
    font-weight: 600;
    margin-left: -35px;
}

.section-blog-footer {
	padding: 130px 0 80px !important;
}
.section-blog-footer h2 {
	margin-top: -5px;
    line-height: 1.2em;
    color: #010524;
    font-size: 35px;
    padding-left: 30px;
    margin-bottom: 0px;
}

.section-blog-footer h2:before {
    content: "Our socials";
    display: inline-block;
    position: absolute;
    left: 10px;
    top: 0%;
    right: auto;
    bottom: 0%;
    width: 120px;
    margin-top: 5px;
    margin-bottom: 0px;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    color: #ab6930;
    text-align: center;
    font-size: 15px;
    
    font-weight: 600;
    margin-left: -40px;
}

.section-blog-footer p:nth-child(1) {
	font-size: 19px;
	line-height: 1.6em;
	margin-bottom: 10px;
}


.archive .large-10, .search .large-10 {
    flex-basis: 100%;
    max-width: 100%;
}



.archive .is-divider, .search .is-divider {
	display: none;
}

.archive .from_the_blog_excerpt, .search .from_the_blog_excerpt {
	    margin-bottom: 10px;
    color: #777;
    font-size: 16px;
    line-height: 1.6em;
	font-weight: 400;
}

.archive .post-title, .search .post-title {
    font-size: 20px;
    line-height: 1.2em;
    font-weight: 500;
    color: #010524;
    margin-bottom: 15px;
    min-height: 48px;
}
.archive .box, .search .box {
	    box-shadow: 0 0 10px 0 rgb(137 138 145 / 15%);
	border-radius: 10px;
}

.archive .box .box-image, .search .box .box-image {
	border-radius: 10px 10px 0 0;
}

.archive .box-text, .search .box-text {
	padding: 25px 20px;
	text-align: left;
}

.archive .box-text .more-link {
    color: #ab6930;
    font-size: 15px;
    line-height: 2em;
    text-decoration: none;
    letter-spacing: normal;
    background: none;
    border: none;
    text-transform: inherit;
    font-weight: normal;
    margin-top: 0px;
    padding: 0;
	    margin-bottom: 0;
}

.archive .box-text .more-link:before {
	content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    background-color: #ab6930;
    height: 1px;
    margin-top: 15px;
    margin-left: 75px;
	transition: width 0.5s ease, margin-left 0.5s ease;
}

.archive .box-text .more-link:hover {
	color: #333;
	    background: none;
}

.archive .box-text .more-link:hover:before {
	background-color: #333;
	width: 65px;
	 margin-left: 85px;
}



html[lang="en-US"] .archive .box-text .more-link:before {
	content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    background-color: #ab6930;
    height: 1px;
    margin-top: 15px;
    margin-left: 130px;
	transition: width 0.5s ease, margin-left 0.5s ease;
}


html[lang="en-US"] .archive .box-text .more-link:hover:before {
	background-color: #333;
	width: 65px;
	 margin-left: 140px;
}

.single .entry-category a {
    padding: 10px;
    border-style: solid;
    border-width: 1px;
    background-color: #ab6930;
    transition: all 400ms ease;
    color: #fff;
    text-transform: none;
    font-size: 14px;
    margin-bottom: 10px;
    display: inline-block;
    font-weight: normal;
}

.single h1 {
	color: #010524;
    font-size: 55px;
}

.single .entry-meta, .single .entry-meta time, .single .entry-meta span, .single .entry-meta a {
	    color: #ab6930;
    text-transform: initial;
    letter-spacing: normal;
    font-weight: 400;
    font-family: Roboto, sans-serif;
    font-size: 16px;
    line-height: 1.6em;
}

.single .entry-content {
	padding-top: 0;
}
.single .entry-divider {
	display: none;
}

.single .box-shadow-1-hover {
	box-shadow: none;
}

.single .entry-content p {
    margin-bottom: 15px;
    color: #444;
    line-height: 1.6em;
    font-weight: 400;
    font-size: 17px;
}


.single footer.entry-meta {
	    border-top: none;
    border-bottom: 1px solid;
}

.single .next-prev-nav .flex-col+.flex-col {
    border: none;
}

.related-post .box {
	    box-shadow: 0 0 10px 0 rgb(137 138 145 / 15%);
}

.related-post .box-text {
	padding: 20px 15px 10px;
}

.related-post .box-text .more-link {
    color: #ab6930;
    font-size: 15px;
    line-height: 2em;
    text-decoration: none;
    letter-spacing: normal;
    background: none;
    border: none;
    text-transform: inherit;
    font-weight: normal;
    margin-top: 0px;
    padding: 0;
	    margin-bottom: 0;
}

.related-post .box-text .more-link:before {
	content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    background-color: #ab6930;
    height: 1px;
    margin-top: 15px;
    margin-left: 75px;
	transition: width 0.5s ease, margin-left 0.5s ease;
}

.related-post .box-text .more-link:hover {
	color: #333;
	    background: none;
}

.related-post .box-text .more-link:hover:before {
	background-color: #333;
	width: 65px;
	 margin-left: 85px;
}


.related-post .is-divider{
	display: none;
}

.related-post .from_the_blog_excerpt {
	    margin-bottom: 10px;
    color: #777;
    font-size: 16px;
    line-height: 1.6em;
	font-weight: 400;
}

.related-post .post-title {
    font-size: 20px;
    line-height: 1.2em;
    font-weight: 500;
    color: #010524;
    margin-bottom: 15px;
    min-height: 48px;
}

.related-title {
	    color: #333;
    font-weight: bold;
    margin: 25px 0;
    font-size: 28px;
    border-left: 6px solid #ab6930;
    padding-left: 15px;
    line-height: 28px;
}


/*Dự án*/
.section-job-header .col-inner {
    margin: 0 auto !important;
}


.section-job-description .section-bg.bg-loaded {
    background-position: 0 40px;
    width: 580px;
    height: 400px;
    opacity: 0.4;
}

.section-job-description {
	padding: 70px 0 40px !important;
}

.section-job-description .col-inner p:nth-child(1) {
    font-size: 19px;
    font-weight: 400;
    margin-bottom: 15px;
}

.section-job-description .button {
	    width: 50px;
    height: 50px;
    line-height: 50px;
    margin-right: 12px;
}
.section-job-description .button.icon:hover {
    background: white !important;
}

.section-job-description .button.icon:hover>i {
   color: #ab6930 !important;
}


.section-job-content {
	padding: 80px 0 30px !important;
}

.archive #header , .search #header {
	    position: absolute;
	    z-index: 0;
	    z-index: initial;
}

.archive .header-inner .flex-left .header-nav li a.nav-top-link, .search .header-inner .flex-left .header-nav li a.nav-top-link, .archive .header-language-dropdown>a, .search .header-language-dropdown >a {
    color: white !important;
}

.archive .header-wrapper, .search .header-wrapper {
	    background-color: transparent;
    background-image: none!important;
    box-shadow: none;
	    z-index: initial;
}

.archive .page-wrapper, .search .page-wrapper {
	padding: 0;
}

.archive .header-wrapper.stuck, .search .header-wrapper.stuck {
	z-index: 30;
}

.archive .header-wrapper.stuck .header-inner .flex-left .header-nav li a.nav-top-link, .search .header-wrapper.stuck .header-inner .flex-left .header-nav li a.nav-top-link, .archive .header-wrapper.stuck .header-language-dropdown>a, .search .header-wrapper.stuck .header-language-dropdown >a {
	color: white !important;
}

.portfolio-single-page .portfolio-top>.row {
	display: none;
}

.next-prev-nav .flex-col, .next-prev-nav .flex-col {
    padding: 40px 20px;
}

.next-prev-nav .flex-col a, .next-prev-nav .flex-col a {
       color: #ab6930;
	display: flex;
}

.next-prev-nav a .hide-for-small {
	font-size: 13px;
}

.next-prev-nav .nav-center {
	width: 38px;
	height: 30px;
	    margin: 10px auto;
}

.portfolio-bottom .pb-0 {
    padding: 0!important;
}


.portfolio-bottom .next-prev-nav .nav-center {
    width: 38px;
    height: 30px;
    margin: 16px auto 18px auto;
}

.portfolio-bottom .next-prev-nav .flex-col a, .portfolio-bottom .next-prev-nav .flex-col a {
    padding: 0 20px;
    display: block;
    color: rgb(1,5,36);
}

.section-job-content .job-h2 h2 {
	    margin-top: 10px;
    margin-bottom: 20px;
    color: #010524;
    font-size: 35px;
    line-height: 1.2em;
    width: 70%;
	position: relative;
	padding-left: 70px;
	position: relative;
	padding-left: 35px;
}

.section-job-content .job-h2 h2::before {
    content: "Our Project";
    display: inline-block;
    position: absolute;
    left: 10px;
    top: 0%;
    right: auto;
    bottom: 0%;
    width: 120px;
    margin-top: 0px;
    margin-bottom: 0px;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    color: #ab6930;
    text-align: center;
    font-size: 15px;
    
    font-weight: 600;
	margin-left: -35px;
}


.archive .portfolio-box {
	box-shadow: none;
}

.archive .portfolio-box .box-text {
    padding: 15px 0;
}

.archive .portfolio-featured-title {
	padding: 80px 0;
	    margin-bottom: 60px;
}

.archive .portfolio-box-title {
	    
    color: #010524;
    font-size: 20px;
    line-height: 1.5em;
    font-weight: 600;
    text-transform: inherit;
    text-rendering: initial;
    margin-bottom: 8px;
    letter-spacing: inherit;
}

.archive .show-on-hover {
    
    color: #ab6930;
    font-size: 15px;
    line-height: 2em;
    font-weight: 600;
    text-decoration: none;
    opacity: 1 !important;
    text-transform: initial;
}

.archive .portfolio-box-category {
    opacity: 1;
}

.featured-title .page-title-inner {
        padding: 50px 0 0px;
}


.archive .portfolio-archive h1 {
	    display: block;
    font-size: 50px;
    line-height: 1.2em;
    position: relative;
    text-transform: inherit;
}

.featured_item-template-default .section-title-normal {
	border: none;
}

.featured_item-template-default .section-title-main {
	border: none;
	font-size: 22px;
}
.featured_item-template-default .title-overlay {
	background: white !important;
	
}

.featured_item-template-default  .section-title-container {
	margin-bottom: 0;
	margin-top: 20px;
}

.featured_item-template-default h1 {
	font-size: 32px;
    line-height: 1.2em;
    margin-bottom: 0;
    text-transform: inherit;
    margin-top: 20px;
    box-shadow: none;
    letter-spacing: normal;
    text-shadow: none;
}

.featured_item-template-default .featured_item_cats a, .featured_item-template-default .featured_item_cats {
    color: #ab6930;
    font-size: 18px;
    text-shadow: none;
	opacity: 1;
}

.section-project-banner {
    padding: 180px 0 120px !important;
}

.section-project-banner::before {
    content: "";
    background-image: url(https://o.webtien.com/wp-content/uploads/2023/10/line.svg);
    background-size: auto;
    width: 100%;
    height: 40px;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
    transform: rotate(180deg);
}


.section-project-banner .section-bg-overlay {
	   
    background: linear-gradient(180deg, #2b1f19eb, transparent), linear-gradient(180deg, rgb(0 0 0 / 36%), rgb(0 0 0 / 19%));
}

.section-project-banner p {
	    color: #fff;
    font-size: 19px;
}

.section-project-banner .col-inner {
    margin-left: inherit !important;
	max-width: 570px;
}

.section-project-banner h1 {
	    display: block;
    margin-top: 0;
    margin-bottom: 0;
    font-size: 50px;
    line-height: 1.2em;
	padding-left: 40px;
	position: relative;
	margin-bottom: 28px;
}

.section-project-banner h1::before {
    content: "Out project";
    display: inline-block;
    position: absolute;
    left: 10px;
    top: 0%;
    right: auto;
    bottom: 0%;
    width: 120px;
    margin-top: 0px;
    margin-bottom: 0px;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    color: #d9a881;
    text-align: center;
    font-size: 15px;
    
    font-weight: 600;
    margin-left: -35px;
}

.section-project-banner-detail {
	height: calc(100vh - 32px)!important;
}

.section-project-banner-detail .img-inner {
    height: calc(100vh - 32px);
}

.section-project-banner-detail .overlay {
        background-color: rgb(1 12 2 / 50%) !important;
    background-image: linear-gradient(135deg, rgb(0 4 1 / 11%), transparent);
}

.section-project-banner-detail .section-bg.bg-loaded {
	    background-size: 400px 400px !important;
    background-position: left 30px bottom 20px;
}

.section-project-banner-detail h1 {
    margin-bottom: 18px;
    color: #fff;
    font-size: 50px;
    line-height: 1.2em;
}

.section-project-banner-detail .description p {
	margin-bottom: 30px;
    color: #fff;
    font-size: 19px;
}

.section-project-banner-detail .top p {
    color: #d9a881;
    font-weight: 600;
    font-size: 15px;
}
.section-project-banner-detail .large-7 {
    flex-basis: 55%;
    max-width: 55%;
}

.section-project-banner-detail .large-5 {
    flex-basis: 45%;
    max-width: 45%;
}

.section-project-banner-detail .col-inner>p {
	    margin-top: 0px;
    margin-bottom: 35px;
    color: #fff;
    font-size: 19px;
}

.section-project-banner-detail .col-inner>a.button {
	    width: 220px;
    height: 60px;
    line-height: 60px;
}

.section-process {
	    padding: 80px 0 00px !important;
}
.section-process h2 {
        margin-bottom: 20px;
    line-height: 1.2em;
    color: #010524;
    font-size: 35px;
	padding-left: 40px;
	text-align: center;
}

.section-process .box-text-inner .text {
	color: #010524;
    font-size: 22px;
    line-height: 1.2em;
    margin: 20px 0 25px 0;
	position: relative;
}


.section-process  p {
	    color: #777;
    font-size: 16px;
    line-height: 1.6em;
    font-weight: 400;
}

.section-process .box-image {
	border-radius: 10px;
}

.section-plan {
	padding: 120px 0 60px !important;
}


.section-plan .icon-box-img {
	margin:5px auto;
}

.section-plan h2 {
	    color: #010524;
    font-size: 35px;
    line-height: 1.2em;
}

.section-blog-banner {
    padding: 180px 0 120px !important;
	 margin-bottom: 120px;
}

.section-blog-banner::before {
    content: "";
    background-image: url(https://o.webtien.com/wp-content/uploads/2023/10/line.svg);
    background-size: auto;
    width: 100%;
    height: 40px;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
    transform: rotate(180deg);
}



.section-blog-banner .section-bg-overlay {
	    background: linear-gradient(180deg, #050c08, transparent), linear-gradient(180deg, rgb(0 0 0 / 50%), rgb(0 0 0 / 50%));
}

.section-blog-banner p {
	    color: #fff;
    font-size: 19px;
}

.section-blog-banner .col-inner {
    margin-left: inherit !important;
	max-width: 570px;
}

.section-blog-banner h1 {
	    display: block;
    margin-top: 0;
    margin-bottom: 0;
    font-size: 50px;
    line-height: 1.2em;
	padding-left: 40px;
	position: relative;
	margin-bottom: 28px;
	color: white;
}

.section-blog-banner h1::before {
    content: "Our novelties";
    display: inline-block;
    position: absolute;
    left: 10px;
    top: 0%;
    right: auto;
    bottom: 0%;
    width: 120px;
    margin-top: 0px;
    margin-bottom: 0px;
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    color: #d9a881;
    text-align: center;
    font-size: 15px;
    
    font-weight: 600;
    margin-left: -35px;
}


.row-two .col-inner {
	    padding: 25px 20px;
	background: white;
}

.row-two .col-inner:hover {
    transition: box-shadow 500ms ease;
    text-align: center;
    box-shadow: rgb(15 75 31 / 13%) 0px 7px 29px 0px;
}

.row-two .active .col-inner {
    text-align: center;
    box-shadow: rgb(15 75 31 / 13%) 0px 7px 29px 0px;
}


.section-langdingpage-content-2 .col-inner {
        margin: 0 auto !important;
}

.section-langdingpage-content {
	padding: 80px 0 0 !important;
}

.section-langdingpage-content p, .section-langdingpage-content li, .section-langdingpage-content div, .section-langdingpage-content-2 p, .section-langdingpage-content-2 li, .section-langdingpage-content-2 div {
	    margin-bottom: 15px;
    color: #444;
    line-height: 1.6em;
    font-size: 17px;
}

.section-langdingpage-content-2 .col-inner {
	padding: 30px 0 0;
}

.section-langdingpage-content .img {
	box-shadow: rgb(99 99 99 / 20%) 0px 2px 8px 0px;
	background: white;
}

.section-langdingpage-content img {
	    padding: 15px
}

.single .page-wrapper {
    padding-bottom: 0px;
}

.post-item .col-inner {
	box-shadow: 0 0 10px 0 rgb(137 138 145 / 15%);
    border-radius: 10px;
}

.next-prev-nav  svg rect {
	fill: #ab6934;
}
@media only screen and (max-width: 48em) {
/*************** ADD MOBILE ONLY CSS HERE  ***************/
	.product-main {
	padding-bottom: 0;
}
	.box-text-products a, .section-product .box-text a {
		font-size: 17px;
	}
	.footer .widget .is-divider {
		display: block;
		margin: 20px auto !important;
	}
	.header-full-width .container {
    padding: 0 15px;
}
	
	.section-service .box-text p {
	font-weight: 700;
		font-size: 18px;
		line-height: 25px;
}
	
	
	.off-canvas-left .mfp-content, .off-canvas-right .mfp-content {
    background-color: white;
		
	}
	
	.row-small>.col, .row-small>.flickity-viewport>.flickity-slider>.col {
		padding: 0 15px 20px !important;
	}
	.section-job-content .job-h2 h2 {
		    font-size: 30px;
    padding: 0;
    width: 100%;
	}
	
	.section-job-content .job-h2 h2::before {
       -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
    padding: 0;
    width: 100% !important;
    margin: -38px 0 0;
    text-align: center;
    left: 0;
    right: 0;
		
	}

	
.footer-1 .row .col {
	flex-basis: 100% !important;
    max-width: 100% !important;
}
	
	.footer-wrapper:before {
    background-size: 350px 350px;
    background-position: bottom -50px center;
}
	
	.section-banner .title p {
		font-size: 40px;
		line-height: 1.2em;
		    margin-bottom: 20px;
	}
	
	.section-banner .description p {
		    width: 90%;
    font-size: 16px;
    margin: 0 auto;
	}
	
	.section-banner .top p {
		margin-bottom: 25px;
	}
	.section-service .row-title h2 {
	font-size: 30px;
    width: 100%;
    padding: 0;
    text-align: center;
	}
	
	.section-service .row-title h2::before {
    transform: rotate(0);
    font-weight: 600;
    margin: -35px auto 0;
    display: block;
    left: 0;
    right: 0;
}
	
	.section-service .row-title p {
		font-size: 20px;
	}
	
	.section-service .small-6 {
		padding: 0px 5px !important;
	}
	
	.section-service {
    padding: 80px 0 0px !important;
}
	
	.section-service .row-title {
		margin-bottom: 0;
	}
	
	.section-about h2 {
	font-size: 30px;
    width: 100%;
    padding: 0;
    text-align: center;
	}
	
	.section-about h2:before {
		    transform: rotate(0);
    font-weight: 600;
    margin: -35px auto 0;
    display: block;
    left: 0;
    right: 0;
	}
	
	
	.section-about {
   padding: 80px 0 0px 0 !important;
}
	.section-about p {
    font-size: 17px;
		    text-align: center;
}
	
	.section-about a.button {
    margin: 30px auto 0;
    display: table;
}

.section-reason {
   padding: 80px 0 30px !important;
}
	.section-reason .row-title h2 {
		font-size: 30px;
		width: 100%;
    padding: 0;
    text-align: center;
		    margin-bottom: 30px;
	}
	
	.section-reason .row-title h2:before {
		    transform: rotate(0);
    font-weight: 600;
    margin: -35px auto 0;
    display: block;
    left: 0;
    right: 0;
	}
	
	.section-reason .row-title p {
    font-size: 18px;
    font-weight: normal;
    line-height: 28px;
}
	.section-reason .row-title .col {
		padding-bottom: 0;
	}
	
	.section-reason .row-content .col {
		padding-bottom: 10px;
	}
	
	.section-project .heading-title h2 {
    font-size: 30px;
    text-align: center;
	}
	
	.section-project .box-image:before, .section-project .box-image:after {
		opacity: 1;
	}
	
	.section-project .nav {
		justify-content: center;
		margin-top: 20px;
	}
	.section-project .mb-half {
    margin-bottom: 20px;
}
	.section-project .nav li {
		margin: 0 10px !important;
	}
	
	.section-project .nav li a {
    padding: 5px 0;
}
	
	.section-project {
		padding: 60px 0 10px !important;
	}
	
	.section-cta {
    padding: 80px 0 70px !important;
}
.section-cta h2 {
    font-size: 30px;
}
	
	.section-post {
    padding: 60px 0 40px !important;
}
	
	.section-post .row-title h2 {
		font-size: 30px;
width: 100%;
    padding: 0;
    text-align: center;
}
	.section-post .row-title h2:before {
		transform: rotate(0);
    font-weight: 600;
    margin: -35px auto 0;
    display: block;
    left: 0;
    right: 0;
	}
	
	.section-post .row-title p {
		    font-size: 18px;
    font-weight: normal;
    line-height: 28px;
	}
	
	.section-post .row-title .col {
		padding-bottom: 0;
	}
	
	.section-reviews {
    padding: 60px 0 40px 0 !important;
}
	
	.section-reviews .text-content p {
		    font-size: 17px;
    margin-top: 10px;
	}
	
	.section-reviews .text-box-content .img {
		width: 100px !important;
	}
	
	.section-reviews h2 {
		font-size: 30px;
	}
	.section-service-banner {
    padding: 190px 0 80px !important;
}
	.section-about-content .icon-box {}
	.section-service-banner h1 {
		font-size: 40px;
		padding: 0;
		text-align: center;
	}
	
	.section-service-banner p {
		text-align: center;
	}
	
	.section-service-banner h1::before {
    transform: rotate(0);
    font-weight: 600;
    margin: -35px auto 0;
    display: block;
    left: 0;
    right: 0;
}
	
	.section-about-banner h1 {
		font-size: 40px;
    padding: 0;
    text-align: center;
	}
	
	.section-about-banner h1:before {
		    transform: rotate(0);
    font-weight: 600;
    margin: -50px auto 0;
    display: block;
    left: 0;
    right: 0;
	}
	
	.section-about-banner p {
		text-align: center;
	}
	.section-about-banner {
    padding: 180px 0 0px !important;
}
	
	.section-about-content h2 {
    font-size: 30px;
    width: 100%;
    padding: 0;
    text-align: center;
}
	
	.section-about-content h2:before {
		    transform: rotate(0);
    font-weight: 600;
    margin: -35px auto 0;
    display: block;
    left: 0;
    right: 0;
	}
	
	.section-about-content {
    padding: 80px 0 30px!important;
}
	.section-about-content .col-inner>p {
		text-align: center;
	}
	
	.section-about-content .icon-box .icon-box-img {
		margin-bottom: 5px;
	}
	
	.section-about-banner .banner {
		margin-left: 0;
	}
	.text.project-stat {
		    width: 100%;
		    padding: 50px 0 25px;
	}
	
	.section-stat {
    position: relative;
    top: 0;
    left: 0;
		max-width: 100%;
}
	
	
	.section-contact-banner h1 {
		    font-size: 40px;
    padding: 0;
    text-align: center;
	}
	
	.section-contact-banner h1:before {
		    transform: rotate(0);
    font-weight: 600;
    margin: -50px auto 0;
    display: block;
    left: 0;
    right: 0;
	}
	
	.section-contact-banner {
    padding: 180px 0 40px !important;
}
	
	.section-contact-banner .col-inner>p {
		text-align: center;
	}
	
	.section-contact-banner h3 {
		    margin-bottom: 22px;
    color: #010524;
    font-size: 20px;
    line-height: 0;
	}
	
	.section-contact-info h2 {
		    font-size: 30px;
		width: 100%;
		padding: 0;
		text-align: center;
		margin-bottom: 20px;
	}
	
	.section-contact-info h2:before {
		transform: rotate(0);
    font-weight: 600;
    margin: -35px auto 0;
    display: block;
    left: 0;
    right: 0;
	}
	.section-contact-info .button i {
		float: left;
	}
	.section-contact-info .button-address span {
		display: block;
	}
	
	.section-contact-info a.button {
		margin-bottom: 20px;
	}
	
	.section-project-banner h1 {
		font-size: 40px;
    padding: 0;
    text-align: center;
	}
	
	.section-project-banner h1:before {
		transform: rotate(0);
    font-weight: 600;
    margin: -35px auto 0;
    display: block;
    left: 0;
    right: 0;

	}
	
	.section-project-banner p {
		text-align: center;
	}
	
	.section-project-banner {
    padding: 180px 0 50px !important;
}
	.section-project-detail {
		padding: 0 !important;
	}
	
	.section-project-detail .container {
    margin: 50px auto 35px;
}
	
	.single .featured-title .flex-col  {
		padding: 0 15px;
	}
	
	.section-job-description {
    padding: 70px 0 20px !important;
    text-align: center;
}
	
	.section-job-description .section-bg.bg-loaded {
    background-position: top;
    width: 100%;
    height: 450px;
}
	
	.section-blog-banner h1 {
		    font-size: 40px;
    padding: 0;
    text-align: center;
	}
	
	.section-blog-banner p {
  text-align: center;
}
	.section-blog-banner {
    margin-bottom: 60px;
}

	.section-blog-footer {
    padding: 90px 0 10px !important;
}

	.section-blog-banner h1::before {
    transform: rotate(0);
    font-weight: 600;
    margin: -35px auto 0;
    display: block;
    left: 0;
    right: 0;
}
	
.section-blog-footer h2 {
    font-size: 30px;
	text-align: center;
	    padding: 0;
}

	.section-blog-footer h2::before {
    transform: rotate(0);
    font-weight: 600;
    margin: -35px auto 0;
    display: block;
    left: 0;
    right: 0;
}
	
	.section-blog-footer p {
    text-align: center;
}
	
	.next-prev-nav.bb {
		display: block;
	}
	
	.next-prev-nav .pb-0 {
    padding: 0!important;
}
	.next-prev-nav .flex-col, .next-prev-nav .flex-col {
    padding: 15px 0;
    font-size: 18px;
}

	.next-prev-nav .flex-col a, .next-prev-nav .flex-col a {
    padding: 0 0px;
    display: block;
}
	
.portfolio-bottom .next-prev-nav .flex-col, .portfolio-bottom .next-prev-nav .flex-col {
    border-top: 2px solid #ececec;
    border-bottom: 2px solid #ececec;
}

	
	.section-project-banner-detail .large-5, .section-project-banner-detail .large-7 {
    flex-basis: 100%;
    max-width: 100%;
}
	.section-project-banner-detail .large-7 .col-inner {
		    position: absolute;
    top: 1000%;
    left: 0%;
    padding: 130px 20px 20px !important;
    text-align: center;
	}
	
	.section-project-banner-detail .description p {
    font-size: 16px;
    text-align: center;
}
	.section-project-banner-detail h1 {
    line-height: 1.2em;
    font-size: 40px;
}
	.section-project-banner-detail {
    height: 100vh !important;
}
	.section-project-banner-detail .large-5 {
		z-index: -1;
	}
	
	.section-project-banner-detail {
    height: 100vh !important;
}
	
	.section-process h2 {
    font-size: 30px;
    width: 100%;
    padding: 0;
    text-align: center;
}
	
	.section-process h2::before {
    transform: rotate(0);
    font-weight: 600;
    margin: -35px auto 0;
    display: block;
    left: 0;
    right: 0;
}
	
	.section-process {
    padding: 80px 0 10px !important;
}
	
	.section-plan h2 {
		font-size: 30px;
		text-align: center;
	}
	
		.section-plan .row-three h2 {
		font-size: 30px;
		text-align: left;
	}
	
	.section-plan {
    padding: 70px 0 20px !important;
}
	.row-two .col-inner {
    text-align: center;
    box-shadow: rgb(15 75 31 / 13%) 0px 7px 29px 0px;
}
	
	.slider-wrapper .flickity-prev-next-button {
    display: block !important;
}
	.section-contact-info {
    padding: 90px 0 0px !important;
}
	.section-contact-info form span {
		width: 100% !important;
	}
	.flickity-prev-next-button.next {
		right: 0;
	}
	
	.flickity-prev-next-button.previous {
    left: 0%;
	}
	.footer-1 .row .col:nth-child(3) .textwidget>p {
    font-size: 30px;
	}
	.footer-2 ul {
		    display: block;
    text-align: center;
	}
	.footer-2 ul li {
    width: 33.33%;
    float: left;
    text-align: center;
    margin: 0;
}
	

	.footer-1 form .wpcf7-form-control-wrap {
		width: 100%;
	}
	
	.footer-1 form .wpcf7-submit {
		width: 100%;
		display: block;
	}
		.footer-wrapper {
    text-align: center;
}
	
	.footer-1 .row .col:nth-child(1), .footer-1 .row .col:nth-child(2) {
		padding: 0 20px;
	}
	
	.footer-1 {
    padding: 60px 0 0;
}
	.footer-2 {
    padding-bottom: 0px;
}
	
	.footer-1 .row .col:nth-child(3) {
		margin-bottom: 0;
	}
	.footer-1 form {
		margin-bottom: 0;
	}
	
	.section-langdingpage-content {
    padding: 40px 0 0 !important;
}
	
	.section-langdingpage-content .col {
		padding-bottom: 0;
	}
	
	.section-langdingpage-content-2 {
		padding: 30px 0 0 !important;
	}
	
	
	.archive .portfolio-box-title {
    font-size: 16px;
    margin-bottom: 20px;
}
	
	.archive .show-on-hover {
		opacity: 1;
	}
	
	.archive .box-text, .search .box-text {
    padding: 15px;
    text-align: left;
}
	
	.single h1 {
    font-size: 40px;
}
	.hide-for-small, [data-show=hide-for-small] {
    display: inline-block !important;
}
	.section-project .show-on-hover {
		opacity: 1;
		    background-color: rgb(5 20 13 / 72%) !important;
    background-image: -webkit-gradient(linear, left bottom, left top, from(#0b0d29), color-stop(45%, transparent));
	}
	
	.section-project .portfolio-box-title {
    font-size: 16px;
    margin-bottom: 10px;
}
	
	.sidebar-menu .nav-sidebar a {
	     color: #010524;
    font-size: 15px;
    text-transform: initial;
    
    letter-spacing: initial;
    font-weight: 600;
    padding: 10px 20px !important;
	}
	
	.sidebar-menu .nav-sidebar .has-child i{
		    margin: 0 10px
	}
	
	
	.section-project-banner-detail .img-inner {
    height: calc(100vh) !important;
}
.section-product {
    margin-top: -80px;
	padding: 0px 0 0px !important;
}
	
		.section-process h2 {
		margin-bottom: 10px;
	}
	
	
}


/* styles for iPad screens */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {

.section h2 {
    width: 100% !important;
}

	.section .large-9 {
    flex-basis: 100%;
    max-width: 100%;
}
	
	.section-reviews .text-content p {
    font-size: 24px;
	}
	
	.footer-1 .row .col:nth-child(1), .footer-1 .row .col:nth-child(2) {
    flex-basis: 50%;
    max-width: 50%;
		padding: 0 25px;
}
	.footer-1 .row .col:nth-child(3) {
    flex-basis: 100%;
    max-width: 100%;
}
	.section-about-banner .banner {
		margin-left: 0;
	}
	.section-stat {
		top: 10%;
	}
	
	.section-about-content .large-6 {
    flex-basis: 100%;
    max-width: 100%;
}

	.section-project-banner-detail .large-5 {
		z-index: -1;
	}
	
	.section-project-banner-detail {
    height: 100vh !important;
}
	
	.section-project-banner-detail .large-5, .section-project-banner-detail .large-7 {
    flex-basis: 100%;
    max-width: 100%;
}
	.section-project-banner-detail .large-7 .col-inner {
    position: absolute;
    top: 1000%;
    left: 0%;
    padding: 130px 20px 20px !important;
    text-align: center;
		max-width: 100% !important;
}
	

}