@font-face {
  font-family: "Bahnschrift";
  src: url("../fonts/bahnschrift/0a6ee448d1bd65c56f6cf256a7c6f20a.eot"); /* IE9*/
  src: url("../fonts/bahnschrift/0a6ee448d1bd65c56f6cf256a7c6f20a.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
  url("../fonts/bahnschrift/0a6ee448d1bd65c56f6cf256a7c6f20a.woff2") format("woff2"), 
  url("../fonts/bahnschrift/0a6ee448d1bd65c56f6cf256a7c6f20a.woff") format("woff"), 
  url("../fonts/bahnschrift/0a6ee448d1bd65c56f6cf256a7c6f20a.ttf") format("truetype"), 
  url("../fonts/bahnschrift/0a6ee448d1bd65c56f6cf256a7c6f20a.svg#Bahnschrift") format("svg"), /* iOS 4.1- */
  font-weight: 1 1000;
}


/* 
just add some nonsense for update cache in IOS 
aaaaaaaaaaaaaaaaaaasdddddddddddddddddasdasdas
asdasdasfxczx
aas124141fafd
zxvzvzbcbbbbbbbbbbb
000000111111111111101010101010011010
10000110010101001010101010
00101011000101010101001001
00101010101010010101001110
10001010010101010100000100
00110100010011100101010010

*/

body{
	font-family: 'Montserrat';
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	scroll-behavior: smooth;
}

.fc-red{
	color: red !important;
	margin-right: 100px;
	margin-top: 7px;
}


.red-link{
	color: red !important;
}

/* home,office,decoration,other-furniture */

/* global */
.center-al{
	text-align: center;
}

a.c-black{
	color: black !important;
	text-decoration: none;
}

.mg-t-10{
	margin-top:10px;
}

.mg-t-20{
	margin-top:20px;
}

.mg-t-30{
	margin-top:30px;
}

.mg-t-50{
	margin-top:50px;
}

.mg-t-60{
	margin-top:60px;
}

.pd-t-10{
	padding-top: 10px;
}

.pd-t-20{
	padding-top: 20px;
}

.pd-t-30{
	padding-top: 30px;
}

.pd-t-40{
	padding-top: 40px;
}

#snow{
	z-index:1000;
	position:fixed;
	top:0;
	left:0;
	bottom:0; 
	right:0;
	user-select:none;
	pointer-events: none;
}

.page-wrapper{
	position: fixed;
	z-index:2;
	top: 135px;
	bottom: 0px;
	left:0px;
	right: 0px;
	overflow-y:auto;
	overflow-x: hidden;
	transition: all 0.2s linear;
	/*background: url("../img/web-bg.jpg");*/
	background-size: cover;
	background-repeat: no-repeat;
	scroll-behavior: smooth;
}

.page-wrapper.alter{
	top: 92.44px;
}

.page-wrapper::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.page-wrapper::-webkit-scrollbar
{
	width: 6px;
	background: rgba(10,10,10,0.1);
}

.page-wrapper::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

/* Header */
.header{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 20;
}

.header-middle{
	background-color: #ffffff;
	color: #000000;
	padding: 0px 6%;
	display: flex;
	justify-content: space-between;
	font-size: 13pt;
	flex-wrap: wrap;
	align-content:center;
	align-items: center;
	font-weight: bold;
	box-shadow: 1px 0px 3px 0px #C0C0C0;
}

.header-middle .playstore-highlight{
	display: flex;
	align-items:center;
	width: 40%;
}

.header-middle .playstore-highlight .ps-logo{
	width: 25px;
	height: auto;
	margin-right: 15px;
}

.header-middle .playstore-highlight a{
	text-decoration: none;
	color: inherit;
}

.header-middle .contact-highlight{
	display: flex;
	width: 40%;
	justify-content: right;
	align-items:center;
}

.header-middle .contact-highlight .portfolio{
	margin-right: 20px;
    position: relative;
    height: 40px;
    display: flex;
    align-items: center;
}

.header-middle .other-service{
	display: flex;
	flex-wrap: wrap;
    align-content: center;
	align-items: center;
}

.header-middle .other-service .service-link{
	padding: 15px 10px;
	text-decoration: none;
	letter-spacing: 2px;
	transition: all 0.3s linear;
	position: relative;
}

.header-middle .other-service .service-link .new-mark{
	position: absolute;
	width: 25px;
	height: auto;
	top: 3px;
	right: -10px;
}

.solution-menu{
	cursor: pointer;
}

.drop-down-solution {
    display: none;
    position: absolute;
    background: #fff;
    border: 1px solid #f1f1f1;
    padding: 10px 0;
    min-width: 180px;
    z-index: 99;
	border-radius: 10px;
	cursor: pointer;
}

.drop-down-content-solution a {
    display: block;
    padding: 8px 15px;
    text-decoration: none;
    color: #000;
}

.header-middle .other-service .service-link a{
	color: #000000;
	text-decoration: none;
	font-weight: 600;
}

.header-middle .other-service .service-link .download{
	color: #49A7A1;
	cursor: pointer;
}

.header-middle .other-service .service-link .portfolio{
	color: #49A7A1;
}

.header-middle .other-service .service-link a.b{
	font-weight: bold;
}

.header-middle .contact-highlight{
	display: flex;
	width: 25%;
	justify-content: right;
	align-items:center; 
}

.header-middle .logout a{
	text-decoration: none;
	color: #dac457;
}

.header-middle .contact-highlight .portfolio{
	margin-right: 20px;
    position: relative;
    height: 40px;
    display: flex;
    align-items: center;
}

.header-middle .contact-highlight .portfolio a{
	color: inherit;
	text-decoration:none;
}

.header-middle .contact-highlight .portfolio a .b{
	font-weight: bold;
	text-decoration: underline;
}

.header-middle .contact-highlight .whatsapp{
	cursor: pointer;
}

.header-middle .contact-highlight .whatsapp img{
	width: auto;
	height: 40px;
}

.header-middle .contact-highlight .hotline{
	margin-left: 10px;
	border-radius: 30px;
	padding: 5px 20px;
	background-color: #ffd204;
	color:black;
	text-align:center;
	font-weight: bold;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	font-size: 14px;
}

.header-middle .contact-highlight .hotline img{
	height: 24px;
	width: auto;
	margin-right: 10px;
}

.header-middle .join-us{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
}

.header-middle .join-us .join-link {
	display: flex;
	flex-wrap: wrap;
    align-items: center;
}

.header-middle .join-us .join-link .whatsapp{
	cursor: pointer;
}

.header-middle .join-us .join-link .whatsapp img{
	width: auto;
	height: 40px;
}

.header-middle .join-us .join-link .hotline{
	margin-left: 10px;
	border-radius: 30px;
	padding: 3px 35px;
	background-color: #FCAA4C;
	color:black;
	text-align:center;
	font-weight: bold;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	font-size: 15px;
}

.header-middle .join-us .join-link .hotline img {
	height: 18px;
	width: auto;
	margin-right: 5px;
}

.header-middle .join-us .join-link a{
	color: white;
	text-decoration: none;
}

.header-middle .join-us .join-link a .b{
	text-decoration: none;
	font-weight: bold;
}


.portfolio .portfolio-dropper{

}

.portfolio .portfolio-dropper .dropper-blackout{
	position:fixed;
	background: rgba(0,0,0,0.7);
	z-index: 3;
    top: 214px;
    bottom: 0px;
    left: 0px;
    right: 0px;
	display:none;
}

.portfolio .portfolio-dropper .dropper-content{
	position: absolute;
    background: #eff9f8;
    left: -450px;
    color: black;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between;
    width: 906px;
    z-index: 5;
	top: 40px;
	display:none;
	height: 400px;
	overflow: auto
}

.portfolio .portfolio-dropper .dropper-content::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.portfolio .portfolio-dropper .dropper-content::-webkit-scrollbar
{
	width: 6px;
	background: rgba(10,10,10,0.1);
}

.portfolio .portfolio-dropper .dropper-content::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.portfolio:hover .portfolio-dropper .dropper-blackout{
	display:block;
}

.portfolio:hover .portfolio-dropper .dropper-content{
	display: flex;
}

.portfolio .portfolio-dropper .dropper-content .content-list{
	width: calc(900px / 3);
	padding: 5px 20px;
	font-size: 12px;
}

.portfolio .portfolio-dropper .dropper-content .content-head{
	font-weight: bold;
	text-align: left;
	margin-bottom: 10px;
	cursor: pointer;
	font-size: 14px;
}

.portfolio .portfolio-dropper .dropper-content .content-entry{
	margin-bottom: 5px;
	color: #828282;
	cursor: pointer;
	line-height:20px;
}

.portfolio .portfolio-dropper .dropper-content .content-entry:hover{
	text-decoration: underline;
}

.portfolio .portfolio-dropper .dropper-content .content-list{
	border-left: 1px solid black;
}

.portfolio .portfolio-dropper .dropper-content .content-list:first-child{
	border-left: 0px solid black;
}


.header-middle .contact-highlight .portfolio a{
	color: inherit;
	text-decoration:none;
}

.header-middle .contact-highlight .portfolio a .b{
	font-weight: bold;
	text-decoration: underline;
}

.header-middle .contact-highlight .whatsapp img{
	width: auto;
	height: 40px;
}

.header-middle .contact-highlight .hotline{
	margin-left: 10px;
	border-radius: 30px;
	padding: 5px 20px;
	background-color: #ffd204;
	color:black;
	text-align:center;
	font-weight: bold;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	font-size: 14px;
}

.header-middle .contact-highlight .hotline img{
	height: 24px;
	width: auto;
	margin-right: 10px;
}

.header-bottom{
	background: #ffffff;
	margin: 0px;
	display:flex;
	flex-wrap: wrap;
	align-items:center;
	justify-content: space-between;
	padding: 25px 3% 21px 3%;
}

.header-bottom .dropdown {
	position: relative;
}

.header-bottom .dropdown img {
	width: 25px;
	margin-left: 70px;
	margin-top: 10px;
}

.header-bottom .search-box{
	position: relative;
	width: 45%;
	overflow: hidden;
	border-radius: 10px;
	border: 0.5px solid #000000;
	margin-left: 0px;
	border-radius: 40px;
}

.header-bottom .search-box:focus-within{
	outline: 1px solid #B5B5B5;
}

.header-bottom .search-box .search-text{
	width: 100%;
	height: 35px;
	border-radius: 20px 0 0 20px;
	border: 0px solid black;
	background: #fff;
	padding-top: 5px;
	padding-left: 20px;
	color: #B5B5B5;
}

.header-bottom .search-box .search-text:focus-within{
	outline: none;
	color: black;
}

.header-bottom .search-box .search-text input{
	width: 100%;
	height: 35px;
	border-radius: 10px;
}

.header-bottom .search-box .btn-search{
	position: absolute;
	right: 0px;
	background: #49A7A1;
	top:0;
	bottom:0;
	padding: 0px 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-bottom: 4px;
	border-radius: 40px;
	color: #ffffff;
	cursor: pointer;
}

.header-bottom .search-box .btn-search img{
	width: 25px;
}

.header-bottom .search-box .search-history-dropper{
	display: none;
	width: calc(100% - 100px);
	position: absolute;
	border: 0px solid black;
	border-radius: 10px;
	background: white;
	z-index: 20;
	overflow: hidden;
	padding-top: 30px;
}

.header-bottom .search-box .search-history-dropper h3{
	padding-left: 15px;
	padding-right: 15px;
	margin-bottom: 15px;
    line-height: 19px;
	font-size: 19px;
	font-weight: bold;
}

.header-bottom .search-box .search-history-dropper .search-history-item{
	padding: 8px 15px;
	cursor: pointer;
	font-size: 16px;
	font-weight: 300;
	color: #585858;
}

.header-bottom .search-box .search-history-dropper .search-history-item-term{
	vertical-align: top;
}

.header-bottom .search-box .search-history-dropper .search-history-res-image{
	width: 100px;
	height: auto;
}

.header-bottom .search-box .search-history-dropper .search-history-item .search-history-item-term{
	margin-left: 10px;
	font-family: 'Calibre Light' !important;
}

.header-bottom .search-box .search-history-dropper .search-history-item:hover{
	background: #dedede;
}

.header-bottom .search-box .search-history-dropper .search-history-item .time-icon{
	vertical-align: top;
    width: auto;
    height: 20px;
    margin-right: 10px;
}

.header-bottom .search-box .search-history-dropper .search-history-item .search-history-delete-term{
	vertical-align: top;
	float:right;
	color: #acacac;
}

.header-bottom .search-box .search-history-dropper .search-last-seen{
	padding-right: 15px;
	padding-left: 15px;
	margin-bottom: 10px;
}

.header-bottom .search-box .search-history-dropper .search-last-seen .search-last-seen-item{
	display: inline-block;
	width: 72px;
    height: 72px;
	border-radius: 10px;
	overflow: hidden;
	margin-right: 20px;
	border: 2px solid transparent;
}

.header-bottom .search-box .search-history-dropper .search-last-seen .search-last-seen-item:hover{
	border: 2px solid #dedede;
}

.search-last-seen-item a div{
	width: 70px;
	height: 70px;
	background-size: auto 100%;
	background-position: center;
	background-repeat: no-repeat;
	
}

.header-bottom .logo-box a{
	text-decoration:none;
}

.header-bottom .logo-box a img{
	width: 165px;
	height: auto;
	margin-left: 10px;
	margin-top: 2px;
}

.header-bottom .menu-box{
	width: 25%;
    display: flex;
    justify-content: flex-end;
    font-size: 16px;
    align-items: center;
    padding: 0px 3%;
}

.header-bottom .menu-box div:hover span{
	cursor: pointer;
}

.header-bottom .menu-regist{
	background: #49A7A1;
    padding: 5px 47px;
    margin: 0px;
    color: #ffffff;
    border-radius: 30px;
    cursor: pointer;
    border: 1px solid #49a7a1;
}

.header-bottom .menu-regist a{
	color: #fff;
	text-decoration: none;
}

.header-bottom .menu-login{
	color: #49A7A1;
    border: 1px solid #C0C0C0;
    padding: 5px 47px;
    border-radius: 30px;
    margin-left: 10px;
}

.header-bottom .menu-login a{
	color: #49a7a1;
	text-decoration: none;
}

.header-bottom .menu-box .menu-cart{
	position: relative;
	display: flex;
    flex-wrap: wrap;
    align-items: center;
	margin: 0px 10px;
}

.header-bottom .menu-box .menu-cart .cart-dot{
	position: absolute;
	width: 16px;
	height: 20px;
	border-radius: 5px;
	background: #ff0400;
	color: white;
	top: -10px;
	left: 10px;
	text-align: center;
}

.header-bottom .menu-box .menu-cart img{
	width: 30px;
	height: auto;
}

.header-bottom .menu-box .menu-cart a{
	text-decoration: none;
	color: inherit;
}

.header-bottom .menu-box .menu-cart span{
	margin-left: 15px;
}

.header-bottom .menu-box .menu-cart .cart-dot{
	position: absolute;
	width: 15px;
	height: 20px;
	border-radius: 5px;
	background: #ff0400;
	top: -10px;
	left: 10px;
	text-align: center;
	color: white;
 
}

.header-bottom .menu-user-box{
	width: 25%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    font-size: 16px;
    margin-right: 50px;
}

.header-bottom .menu-user-box .menu-cart{
	position: relative;
	margin-right: 10px;
	cursor: pointer;
	display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.header-bottom .menu-user-box .menu-cart img{
	width: 30px;
	height: auto;
}

.header-bottom .menu-user-box .menu-cart a{
	text-decoration: none;
	color: inherit;
}

.header-bottom .menu-user-box .menu-cart .cart-dot{
	position: absolute;
	width: 15px;
	height: 20px;
	border-radius: 5px;
	background: #ff0400;
	top: -10px;
	left: 20px;
	text-align: center;
	color: white;
}

.header-bottom .menu-user-box .menu-notif{
	position: relative;
    margin-right: 10px;
    cursor: pointer;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.header-bottom .menu-user-box .menu-notif img{
	width: 25px;
	height: auto;
}

.header-bottom .menu-user-box .menu-notif .notif-dot{
	position: absolute;
	width: 13px;
	height: 13px;
	border-radius: 20px;
	background: #ff0400;
	top: 4px;
	left: 30px;
}

.header-bottom .menu-user-box .menu-user > *{
	vertical-align: middle;
}

.header-bottom .menu-user-box .menu-user img{
	width: 40px;
	height: auto;
	border-radius: 40px;
}

.header-bottom .menu-user-box .menu-user .disp-name{
	display: -webkit-inline-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 200px;
    margin-right: 20px;
}

.header-bottom .menu-user-box .menu-user .disp-name span{
	color: #49A7A1;
}

.header-bottom .menu-user-box .menu-user .profile-link{
	display: inline-flex;
    align-items: center;
	color:black;
}

.header-bottom .menu-user-box .menu-user a{
	text-decoration: none;
	color: #000;
}

.header-bottom .menu-user-box .menu-user a.my-shop{
	cursor:pointer;
	text-decoration: none;
}

.header-bottom .menu-user-box .menu-user a.my-shop.active{
	text-decoration: underline;
	font-weight: bold;
}

.header-bottom .menu-user-box .menu-user a.my-shop:hover{
	text-decoration: underline;
}

.header-bottom  .category-box {
	margin-top: -21px; 
	margin-left: 26%;
}

.header-bottom .category-box a{
	text-decoration: none;
	color: black;
	margin-left: 85px;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 1px;
}

.header-bottom .category-box span a{
	color: #ff0400;
}

.header-bottom .drop-down {
	margin-left: 75px;
	margin-top: 10px;
	margin-right: 5px;
	position: relative;
}

.header-bottom .drop-down .navbar-toggler-icon img{
	width: 25px;
}

.header-bottom .drop-down:hover .drop-down-content{
	display: flex;
}

.header-bottom .drop-down.actived .drop-down-content{
	display: flex;
}

.header-bottom .drop-down .drop-down-content{
	display: none;
    flex-wrap: wrap;
    position: fixed;
    background-color: #fff;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    color: #000;
    font-size: 12pt;
    font-weight: 900;
    z-index: 2;
    text-align: left;
    list-style: none;
    border: 0px solid rgba(0, 0, 0, .15);
    border-radius: 0.25rem;
    margin-top: 18px;
    width: 100%;
    left: 0;
}

.header-bottom .drop-down .drop-down-content::before{
	content: "";
	background-color: #fff;
	height: 60px;
	bottom: 55px;
	width: 50px;
	position: relative;
	border-radius: 0.25rem;
}

.header-bottom .drop-down .drop-down-content .dropdown-group{
	padding: 5px 0px;
	min-width: 200px;
	max-height: 400px;
	overflow: auto;
	margin-left: -50px;
}

.header-bottom .drop-down .drop-down-content .dropdown-group::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.header-bottom .drop-down .drop-down-content .dropdown-group::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.header-bottom .drop-down .drop-down-content .dropdown-group::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}


.header-bottom .drop-down .drop-down-content .dropdown-group .menu a{
	margin-top: 5px;
}

.header-bottom .drop-down .drop-down-content .dropdown-group .menu i{
	margin-top: 5px;
}

.header-bottom .drop-down .drop-down-content .dropdown-group .menu .icon-menu .icon-atk{
	background: url('../img/new-icon/part 5/icon-30.png');
	width: 40px;
    height: 30px;
    background-position: 3px !important;
    background-size: 30px 30px !important;
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: top;
    margin-top: -7px;
}

.header-bottom .drop-down .drop-down-content .dropdown-group .menu .icon-menu .icon-decoration{
	background: url('../img/icon-menu/web-icon-new-01.png');
	width: 40px;
    height: 30px;
    background-position: 3px !important;
    background-size: 35px 35px !important;
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: top;
    margin-top: -7px;
}

.header-bottom .drop-down .drop-down-content .dropdown-group .menu .icon-menu .icon-eletronik{
	background: url('../img/new-icon/part 5/icon-31.png');
	width: 40px;
    height: 30px;
    background-position: 3px !important;
    background-size: 30px 30px !important;
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: top;
    margin-top: -7px;
}

.header-bottom .drop-down .drop-down-content .dropdown-group .menu .icon-menu .icon-home{
	background: url('../img/icon-menu/web-icon-new-03.png');
	width: 40px;
    height: 30px;
    background-position: 3px !important;
    background-size: 35px 35px !important;
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: top;
    margin-top: -7px;
}

.header-bottom .drop-down .drop-down-content .dropdown-group .menu .icon-menu .icon-makanan{
	background: url('../img/new-icon/part 5/icon-32.png');
	width: 40px;
    height: 30px;
    background-position: 3px !important;
    background-size: 30px 30px !important;
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: top;
    margin-top: -7px;
}

.header-bottom .drop-down .drop-down-content .dropdown-group .menu .icon-menu .icon-office{
	background: url('../img/icon-menu/web-icon-new-02.png');
	width: 40px;
    height: 30px;
    background-position: 3px !important;
    background-size: 35px 35px !important;
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: top;
    margin-top: -7px;
}

.header-bottom .drop-down .drop-down-content .dropdown-group .menu .icon-menu .icon-other-furniture{
	background: url('../img/icon-menu/web-icon-new-04.png');
	width: 40px;
    height: 30px;
    background-position: 3px !important;
    background-size: 35px 35px !important;
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: top;
    margin-top: -7px;
}

.header-bottom .drop-down .drop-down-content .dropdown-group .menu .icon-menu .icon-perkakas{
	background: url('../img/new-icon/part 5/icon-33.png');
	width: 40px;
    height: 30px;
    background-position: 3px !important;
    background-size: 30px 30px !important;
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: top;
    margin-top: -7px;
}

.header-bottom .drop-down .drop-down-content .dropdown-group .menu .icon-menu .icon-transportasi{
	background: url('../img/new-icon/part 5/icon-34.png');
	width: 40px;
    height: 30px;
    background-position: 3px !important;
    background-size: 30px 30px !important;
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: top;
    margin-top: -7px;
}

.header-bottom .drop-down .drop-down-content .dropdown-group .menu .fc-red .icon-sale{
    background: url('../img/icon-menu/percentage.png');
	width: 35px;
    height: 30px;
    background-position: 3px !important;
    background-size: 22px 22px !important;
    display: inline-block;
    background-repeat: no-repeat;
    vertical-align: top;
    margin-top: -7px;
	margin-left: 5px;
}

.header-bottom .drop-down .drop-down-content .dropdown-group .menu .icon-blog{
	background-image: url('../img/icon-menu/web-icon-new-06.png');
	width: 40px;
	height: 30px;
    background-position: 3px !important;
	background-size: 35px 35px !important;
	display: inline-block;
	background-repeat: no-repeat;
	vertical-align: top;
    margin-top: -7px;
}

.header-bottom .drop-down .drop-down-content .dropdown-group .menu .icon-portfolio{
	background-image: url('../img/icon-menu/web-icon-new-07.png');
	width: 40px;
	height: 30px;
    background-position: 3px !important;
	background-size: 35px 35px !important;
	display: inline-block;
	background-repeat: no-repeat;
	vertical-align: top;
    margin-top: -7px;


}

.header-bottom .drop-down .drop-down-content .dropdown-group .menu .icon-desain-interior{
	margin-left: 42px;
}

.header-bottom .drop-down .dropdown-category{
	display: none;
	min-width: 200px;
	padding: 5px 0px;
	max-height: 400px;
	overflow: auto;
}

.header-bottom .drop-down .dropdown-category::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.header-bottom .drop-down .dropdown-category::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.header-bottom .drop-down .dropdown-category::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.header-bottom .drop-down .dropdown-sub-category{
	display: none;
	min-width: 200px;
	max-height: 400px;
	padding: 5px 0px;
	overflow: auto;
}

.header-bottom .drop-down .dropdown-sub-category::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(10,10,10,0);
	border-radius: 0px;
	background: rgba(10,10,10,0.1);
}

.header-bottom .drop-down .dropdown-sub-category::-webkit-scrollbar
{
	width: 8px;
	background: rgba(10,10,10,0.1);
}

.header-bottom .drop-down .dropdown-sub-category::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(105,184,178,.3);
	background-color: #69b8b2;
}

.header-bottom .drop-down .dropdown-category .menu-group{
	display:none;
}

.header-bottom .drop-down .dropdown-category .menu-group.active{
	display:block;
}

.header-bottom .drop-down .dropdown-sub-category .category-group{
	display:none;
}

.header-bottom .drop-down .dropdown-sub-category .category-group.active{
	display:block;
}

.header-bottom .drop-down .drop-down-content .dropdown-group .menu{
	padding: 10px 10px;
	cursor: pointer;
	display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: center;
}

.header-bottom .drop-down .drop-down-content a{
	text-decoration:none;
	color: inherit;
}

.header-bottom .drop-down .drop-down-content .dropdown-group .menu:hover{
	background-color: #f1f1f1;
}

.header-bottom .drop-down .drop-down-content .dropdown-category .cat-menu{
	padding: 5px 10px;
	cursor: pointer;
	display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-content: center;
}

.header-bottom .drop-down .drop-down-content .dropdown-category .cat-menu:hover{
	background-color: #f1f1f1;
}

.header-bottom .drop-down .drop-down-content .dropdown-sub-category .sub-cat-menu{
	padding: 5px 10px;
	cursor: pointer;
}

.header-bottom .drop-down .drop-down-content .dropdown-sub-category .sub-cat-menu:hover{
	background-color: #f1f1f1;
}


.profile-card{
	position: fixed;
	top: 75px;
    right: 5px;
    border-radius: 10px;
    box-shadow: 2px 2px 10px #979797;
    z-index: 35;
    background: white;
    border: 1px solid #dedede;
    padding: 10px 20px;
    font-size: 12px;
    line-height: 16px;
	display: none;
}

.profile-card .profile-info{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	padding-bottom: 10px;
	border-bottom: 2px solid black;
	margin-bottom: 10px;
}

.profile-card .profile-info .profile-image{
	border-radius: 5px;
	width: auto;
	height: 50px;
	margin-right: 10px;
}

.profile-card .profile-info .profile-account .profile-name{
	font-size: 18px;
}

.profile-card .profile-info .profile-account .profile-merchant-stat{
	font-size: 12px;
    line-height: 16px;
	color: #69b8b2;
}

.profile-card .profile-shop-info span{
	color: #69b8b2;
}

.profile-card a{
	text-decoration: none;
	color: inherit;
}

.profile-card a .profile-to-shop{
	margin-top: 10px;
	border-radius: 5px;
	text-align: center;
	padding: 7px;
	background: #b9b7b8;
	font-size: 16px;
}

.profile-card a .profile-check{
	margin-top: 10px;
	border-radius: 5px;
	text-align: center;
	padding: 7px;
	background: #b9b7b8;
	font-size: 16px;
}
 
.total-blackout{
	position: fixed;
	top: 0;
	bottom: 0;
	left:0;
	right:0;
	background-color: rgba(0,0,0,0.85);
	z-index: 25;
}

.login-container{
	display:flex;
	flex-wrap:wrap;
	justify-content: center;
	align-items: center;
	height: 100%;
	flex-direction: column;
}

.login-container .logo-image{
	width: 250px;
}

.login-form{
	width: 400px;
	padding: 40px;
	background: white;
	border-radius: 20px;
	margin-top: 20px;
	margin-bottom: 20px;
	padding-bottom: 20px;
	overflow: hidden;
}

.login-form h4{
	text-align: center;
	margin-bottom: 30px;
	/* margin-top: 40px; */
}

.login-form .form-field .form-label{
	font-size: 16px;
	margin-bottom: 0px;
}

.login-form .form-field .form-input input{
	width: 100%;
	border-radius: 7px;
	padding: 5px 10px;
	font-size: 18px;
	border: 2px solid #69b8b2;
	border-color: #69b8b2;
	outline:none;
}

.login-form .form-field .form-input input:focus-within{
	box-shadow: 0px 0px 15px #69b8b2;
}

.login-form .form-field .form-info{
	margin-top: 5px;
	font-size: 12px;
	color: #b9b9b9;
}

.login-form .error{
	color: red;
	font-size: 12px;
	text-align: center;
}

.login-form .submit-login{
	text-align: center;
	background: #e8e3e5;
	padding: 10px;
	margin-top: 30px;
	border-radius: 5px; 
	cursor: pointer;
}

.login-form .email-form{
	display: none;
}

.login-form .submit-mail-login{
	text-align: center; 
	background: #e8e3e5;
	padding: 10px;
	margin-top: 30px;
	border-radius: 5px;
	cursor: pointer;
}

.login-form .phone-form{
	display: none;
}

.login-form .submit-phone-login{
	text-align: center;
	background: #e8e3e5;
	padding: 10px;
	margin-top: 30px;
	border-radius: 5px;
	cursor: pointer;
}

.login-form .glogin{
	border-radius: 7px;
	cursor: pointer;
	text-align: center;
	background: white;
}

.login-form .to-regist{
	float: right;
	color: #69b8b2;
	cursor: pointer;
}

.login-form .to-regist span{
	text-decoration: underline;
}

.login-form .reset-pass{
	/* float: right; */
	color: #69b8b2;
	cursor: pointer;
}



.login-form .separator{
	margin-top: 10px;
	margin-bottom: 10px;
	position: relative;
	text-align: center;
}

.login-form .separator .line{
	width: 100%;
	height: 2px;
	background-color: #b9b9b9;
	position: absolute;
	z-index: 2;
	top: 12px;
}

.login-form .separator .text{
	position: relative;
	z-index: 3;
	color: #b9b9b9;
	background-color: white;
	padding: 4px 6px;
    font-size: 12px;
	display: inline-block;
}

.login-form .form-accesory{
	display: flex;
	align-items: end;
	position: relative;
}

.login-form .form-accesory .guntur{
	height: 230px;
    position: relative;
    left: -47px;
    bottom: -20px;
}

.login-form .form-accesory .playstore{
	height: 25px;
    position: relative;
    left: -71px;
}

.login-form .form-accesory .qr{
	height: 100px;
    position: relative;
    left: -60px;
}


.login-container .form-footer{
	color: white;
}

.login-container .form-footer a{
	text-decoration: none;
	color: #69b8b2;
	cursor: pointer;
}

.google-frame-container{
	display:flex;
	flex-wrap:wrap;
	justify-content: center;
	align-items: center;
	height: 100%;
	flex-direction: column;
}


.register-container{
	display:flex;
	flex-wrap:wrap;
	justify-content: center;
	align-items: center;
	height: 100%;
	flex-direction: column;
}

.register-container .logo-image{
	width: 250px;
}

.register-form{
	width: 400px;
	padding: 40px;
	background: white;
	border-radius: 20px;
	margin-top: 20px;
	margin-bottom: 20px;
	padding-bottom: 20px;
	overflow: hidden;
}

.register-form h4{
	text-align: center;
	margin-bottom: 30px;
	margin-top: 40px;
}

.register-form .form-field{
	margin-bottom: 10px;
}

.register-form .form-field .form-label{
	font-size: 16px;
	margin-bottom: 0px;
}

.register-form .form-field .form-input input{
	width: 100%;
	border-radius: 7px;
	padding: 5px 10px;
	font-size: 18px;
	border: 2px solid #69b8b2;
	border-color: #69b8b2;
	outline:none;
}

.register-form .form-field .form-input input:focus-within{
	box-shadow: 0px 0px 15px #69b8b2;
}

.register-form .form-field .form-info{
	margin-top: 5px;
	font-size: 12px;
	color: #b9b9b9;
}

.register-form .error{
	color: red;
	font-size: 12px;
	text-align: center;
}

.register-form .submit-regist{
	text-align: center;
	background: #69b8b2;
	color: white;
	padding: 10px;
	margin-top: 30px;
	border-radius: 5px; 
	cursor: pointer;
}

.register-form .regist-email-form{
	display: none;
}

.register-form .submit-mail-regist{
	text-align: center; 
	background: #69b8b2;
	color: white;
	padding: 10px;
	margin-top: 30px;
	border-radius: 5px;
	cursor: pointer;
}

.register-form .regist-phone-form{
	display: none;
}

.register-form .submit-phone-regist{
	text-align: center;
	background: #69b8b2;
	color: white;
	padding: 10px;
	margin-top: 30px;
	border-radius: 5px;
	cursor: pointer;
}

.register-form .to-regist{
	float: right;
	color: #69b8b2;
	cursor: pointer;
}

.register-form .to-regist span{
	text-decoration: underline;
}

.register-form .separator{
	margin-top: 10px;
	margin-bottom: 10px;
	position: relative;
	text-align: center;
}

.register-form .separator .line{
	width: 100%;
	height: 2px;
	background-color: #b9b9b9;
	position: absolute;
	z-index: 2;
	top: 12px;
}

.register-form .separator .text{
	position: relative;
	z-index: 3;
	color: #b9b9b9;
	background-color: white;
	padding: 4px 6px;
    font-size: 12px;
	display: inline-block;
}

.register-form .form-accesory{
	display: flex;
	align-items: end;
	position: relative;
}

.register-form .form-accesory .guntur{
	height: 230px;
    position: relative;
    left: -47px;
    bottom: -20px;
}

.register-form .form-accesory .playstore{
	height: 25px;
    position: relative;
    left: -71px;
}

.register-form .form-accesory .qr{
	height: 100px;
    position: relative;
    left: -60px;
}


.register-container .form-footer{
	color: white;
}

.register-container .form-footer a{
	text-decoration: none;
	color: #69b8b2;
	cursor: pointer;
}

.blackout {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0%;
	right: 0;
	background-color: rgba(0, 0, 0, 0.445);
	z-index: 1111;
	display: none; 
}

.blackout .container-blackout{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	height: 100%;
	width: 100%;
	flex-direction: column;
}

.blackout .container-blackout .card-popup-blackout{
	display: block;
	width: 467px;
	background: white;
	padding: 26px;
	border-radius: 10px;
}
.blackout .container-blackout .card-popup-blackout-info{
	display: none;
	width: 467px;
	background: white;
	padding: 26px;
	border-radius: 10px;
}
.blackout .container-blackout .card-popup-blackout-info .content {
	align-content: space-between;
	text-align: center;
	font-size: 20px;
  
}

 .top-header{
	text-align: center;
}
.top-header .close{
	color: black;
	text-decoration: none;
	font-weight: bold;
	margin-left: 337px;
	font-size: 20px;
}

.card-popup-blackout .form-ubah-pass{
	padding: 10px;
}

.form-ubah-pass .field{
	margin-bottom: 20px;
}

.form-ubah-pass .btn-send-action{
	display: flex;
	justify-content: center;
}


/* reset password */

.container-reset{
	display: block;
	position: relative;
	padding: 116px;
}

.container-reset .content-reset{
	display: flex;
    flex-direction: column;
    align-items: center;
}

.content-reset .card-popup-blackout{
	width: 300px;
}

/* end reset */
.btn-send-action .btn-action{
	width: 100%;
	height: 37px;
	text-align: center;
	background: #3d9ba5;
	border-radius:5px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-ms-border-radius:5px;
	-o-border-radius:5px;
	cursor: pointer;
}
.btn-action a{
	color: white;
	text-decoration: none;
}

.service-link.blink{
	animation-name: blinking;
	animation-duration: 1s;
	animation-iteration-count: infinite;
}

@keyframes blinking {
	0%{
		background-color: #3e8d88;
	}
	50%{
		background-color: #147a6f;
	}
	100%{
		background-color: #3e8d88;
	}
}

.service-link.f-blink a{
	animation-name: fontBlinking;
	animation-duration: 1.4s;
	animation-iteration-count: infinite;
}

@keyframes fontBlinking {
	0%{
		color: #3e8d88;
	}
	50%{
		color: #ffd204;
	}
	60%{
		color: #ffd204;
	}
	100%{
		color: #3e8d88;
	}
}

.page-content {
    width: 100%;
    margin: auto;
}

.banner-section-box {
    width: 100%;
    height: 462px; 
    display: flex;
	padding: 50px 6%;
}

.banner-section-item.single {
    width: 59%;
    height: 100%;
	border-radius: 20px;
	margin-right: 20px;
}

.banner-section-item.single .banner-section-main {
    display: flex;
    width: 100%;
    height: 100%;
	flex-direction: column;
	position: relative;
	margin: 0px;
}

.banner-section-item.single .banner-section-main .owl-dots{
    position: absolute;
    bottom: 15px;
    left: 15px;
    display: flex;
}

.banner-section-main .owl-dots .owl-dot{
	width: 10px;
    height: 10px;
    border-radius: 100%;
    background: #C0C0C0;
    margin: 2px;
}

.banner-section-main .owl-dots .owl-dot.active{
	background: #49A7A1;
}

.banner-section-item.single .banner-section-main .owl-item{
	height: 462px;
}

.banner-section-item.single .banner-section-main img {
    width: 100%;
    height: 100%;
	border-radius: 20px;
	object-fit: cover;
}

.banner-section-item.double {
    width: 40%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.banner-section-sub-box {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
	justify-content: space-between;
	gap: 15px;
}

.banner-section-sub-box .banner-section-sub {
    width: 100%;
    height: 48%;
}

.banner-section-sub-box .banner-section-sub img {
    width: 100%;
    height: 100%;
	border-radius: 20px;
}

.cat-section-box{
	padding: 30px 6% 0px 6%;
    display: flex;
    flex-direction: column;
}

.cat-section-box .cat-section-title{
	display: flex;
	justify-content: space-between;
	margin-bottom: 30px;
	align-items: center;
}

.cat-section-title .cat-section-title-box{
	display: flex;
	flex-direction: column;
}

.cat-section-title .cat-title{
	font-weight: 600;
	font-size: 25pt;
	margin-bottom: 5px;
}

.cat-section-title .cat-sub-title{
	font-size: 14pt;
}

.cat-section-title .cat-section-link{
	border: 1px solid #c0c0c0;
    padding: 6px 53px;
    border-radius: 20px;
	cursor: pointer;
	font-size: 10pt;
}

.cat-section-title .cat-section-link:hover{
	border: 1px solid #49a7a1;
	background: #49a7a1;
	color: #fff;
}

.cat-section-title .cat-section-link a{
	text-decoration: none;
    color: #000000;
    font-weight: 600;
}

.cat-section-title .cat-section-link:hover a{
	color: #fff;
}

.cat-section-content {
	display: flex;
	flex-direction: column;	
}

.cat-section {
	display: flex;
	justify-content: space-between;
}

.cat-section-item {
    position: relative;
    flex: 1;
    margin: 14px;
    height: 210px;
    border-radius: 20px;
    overflow: hidden;
    cursor: pointer;
}

.cat-section-item a {
    text-decoration: none;
}

.cat-normal {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    height: 210px;
}

.cat-item-img {
    width: 170px;
    aspect-ratio: 1 / 1;
    border-radius: 20px;
    overflow: hidden;
}

.cat-item-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.cat-item-text {
    font-size: 13pt;
    font-weight: 600;
    color: #000;
}

.cat-hover {
    position: absolute;
    inset: 0;
    opacity: 0;
    z-index: 3;
    border-radius: 20px;
    overflow: hidden; 
}

.cat-hover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.cat-section-item:hover .cat-normal {
    opacity: 0;
}

.cat-section-item:hover .cat-hover {
    opacity: 1;
}



.border{
	border: 1px solid #f1f1f1 !important;
	margin-top: 30px;
	margin-bottom: 30px;
}

.border.showroom{
	margin-top: 120px;
	margin-bottom: 50px;
}

.border.highlight{
	margin-top: 70px;
	margin-bottom: 70px;
}

.border.client{
	margin-top: 70px;
	margin-bottom: 60px;
}

.flash-sale-section{
	padding: 0px 6% 0px 6%;
    display: flex;
    flex-direction: column;
}

.flash-sale-section .flash-sale-top{
	display: flex;
	justify-content: space-between;
}

.flash-sale-top .flash-sale-img-box{
	display: flex;
	width: 60%;
}

.flash-sale-img-box .flash-sale-img{
	width: 233px;
    height: 144px;
    margin-right: 20px;
}

.flash-sale-img-box .flash-sale-img img{
	width: 100%;
    height: 100%;
}

.flash-sale-img-box .flash-sale-img-txt{
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.flash-sale-img-txt .sale-img-txt-main{
	font-size: 40px;
	font-weight: 600;
	margin-bottom: 5px;
}

.flash-sale-img-txt .sale-img-txt-sub{
	font-size: 20px;
}

.flash-sale-top .flash-sale-action{
	display: flex;
	justify-content: flex-end;
	margin-top: 20px;
}

.flash-sale-action .flash-sale-sort{
	margin-right: 20px;
}

.flash-sale-sort{
	position:relative;
}

.flash-sale-sort .flash-sale-selected-box{
	
}

.flash-sale-sort .flash-sale-selected-box .flash-sale-selection-box{
	justify-content: center;
    align-items: center;
    background: #49A7A1;
    border-radius: 40px;
    color: #ffffff;
    cursor: pointer;
    display: flex;
    padding: 0px 40px 0px 30px;
	display:none;
}

.flash-sale-sort .flash-sale-selected-box .flash-sale-selection-box.best{
	    border-radius: 15px;
    background: #fff;
    color: #000;
    border: 1px solid #49a7a1;
}

.flash-sale-selection-box.best .sale-sort-txt{
	flex-direction: column;
	padding-bottom: 10px;
}

.flash-sale-selection-box.best .sale-sort-txt span{
	padding-bottom: 10px;
    padding-top: 10px;
    font-weight: 500;
}

.flash-sale-sort .flash-sale-selected-box .flash-sale-selection-box.active{
	display:flex;
}

.flash-sale-sort .flash-sale-selected-box .flash-sale-selection-box .sale-sort-icon{
	width: 35px;
}

.flash-sale-sort .flash-sale-selected-box .flash-sale-selection-box .sale-sort-icon img{
	width: 100%;
}

.flash-sale-sort .flash-sale-selected-box .flash-sale-selection-box .sale-sort-txt{
	font-size: 12pt;
	text-align: center;
    display: flex;
    align-items: center;
}

.flash-sale-sort:hover .flash-sale-sort-dropdown{
	display: block;
}

.flash-sale-content .flash-sale-box{
	display:none;
}

.flash-sale-content .flash-sale-box.active{
	display: block;
}

.flash-sale-content .flash-sale-best{
	display:none;
}

.flash-sale-content .flash-sale-best.active{
	display:block;
}

.flash-sale-box-best{
	padding: 10px 50px;
    background: #fff;
    border-radius: 15px;
    color: #000;
    cursor: pointer;
    margin-top: 40px;
    font-weight: 600;
    border: 1px solid #49a7a1;
    line-height: 30px;
	font-size: 12pt;
}

.flash-sale-action .flash-sale-link a {
    border: 1px solid #c0c0c0;
    padding: 6px 35px;
    border-radius: 40px;
    text-decoration: none;
    color: #000000;
    font-weight: 600;
    font-size: 10pt;
    display: inline-block;
    transition: all 0.3s ease;
}

.flash-sale-action .flash-sale-link a:hover {
    border: none;
    background: #49A7A1;
    color: #ffffff;
	border: 1px solid #49a7a1;
}

.flash-sale-top .flash-sale-date{
	display: flex;
	flex-direction: column;
}

.flash-sale-date .flash-sale-text{
	text-align: end;
	margin-bottom: 5px;
}

.flash-sale-content{
	background: #fff;
	padding: 20px 0px;
	display: flex;
	flex-wrap: wrap;
}

.flash-sale-content {
    padding: 20px 0;
}

.product-item-text-box .text-price{
	text-align: left;
}

.flash-sale-box .product-item {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 30px;
    overflow: hidden;
    text-align: center;
    transition: all 0.3s ease;
    cursor: pointer;
    margin: 10px 10px 40px 10px;
}

.flash-sale-box .product-item:hover {
    border: 1px solid #49A7A1;
    transform: translateY(-3px);
}

.flash-sale-best .product-item {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 30px;
    overflow: hidden;
    text-align: center;
    transition: all 0.3s ease;
    cursor: pointer;
    margin: 10px;
	margin-bottom: 40px;
}

.flash-sale-best .product-item:hover {
    border: 1px solid #49A7A1;
    transform: translateY(-3px);
}

.product-item a{
	display: flex;
	flex-direction: column;
}

.flash-sale-box .product-wrapper {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 10px;
}

.flash-sale-box .product-wrapper img{
	width: 100%;
	height: 100%;
}

.flash-sale-best .product-wrapper {
    position: relative;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
	padding: 10px;
}

.flash-sale-best .product-wrapper img{
	width: 100%;
	height: 100%;
}

.product-item-text {
    display: flex;
    justify-content: space-between;
	margin-top: 10px;
}

.product-item-text .product-item-text-box{
	padding: 10px 0px 10px 15px;
    margin-top: 15px;
    display: flex;
    flex-direction: column;
}

.product-item-text .text-name {
    font-size: 12pt;
    color: #000;
    font-weight: 600;
	margin-bottom: 10px;
	line-height: 1.2;
    white-space: normal;
}

.product-item:hover .text-name{
	color: #49A7A1;
}

.product-item-text .text-sale-price {
    font-size: 12pt;
    font-weight: bold;
    color: #FF0000;
    display: flex;
}

.product-item:hover .text-strike-price{
	color: #49A7A1;
}

.product-item-text .text-strike-price {
    font-size: 12pt;
    color: #000;
    text-decoration: line-through;
    display: flex;
    font-weight: 300;
}

.add-to-cart {
    position: relative;
    width: 28px;
    cursor: pointer;
    margin-top: auto;
}

.add-to-cart img {
    position: absolute;
    bottom: 15px;
    right: 10px;
    width: 100%;
    height: auto;
    opacity: 0;
    transition: opacity 0.25s ease;
}

.add-to-cart img[alt="ICON-CART-GREY"] {
    opacity: 1;
}

.product-item:hover .add-to-cart img[alt="ICON-CART-GREY"] {
    opacity: 0;
}

.product-item:hover .add-to-cart img[alt="ICON-CART-GREEN"] {
    opacity: 1;
}

.product-item:hover .add-to-cart:hover img[alt="ICON-CART-GREEN"] {
    opacity: 0;
}

.product-item:hover .add-to-cart:hover img[alt="ICON-CART-ORANGE"] {
    opacity: 1;
}

.grid-8 {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
    padding: 10px;
}

.brand-section{
	display: flex;
	flex-direction: column;
	padding: 20px 6%;
}

.brand-section .brand-top{
	display: flex;
    padding: 20px;
    flex-direction: column;
    align-items: center;
    margin-bottom: 10px;
}

.brand-top .brand-top-main{
	font-weight: 600;
	font-size: 25pt;
	margin-bottom: 5px;
}

.brand-section .brand-content{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.brand-content .brand-box{
	position: relative;
}

.brand-box .brand-nav{
	position: absolute;
    top: 30px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.brand-nav .brand-prev{
	padding: 0px 5px;
    margin-left: -20px;
    cursor: pointer;
}

.brand-nav .brand-prev i{
    font-size: 50px;
}

.brand-nav .brand-next{
	margin-right: -20px;
    padding: 0px 5px;
    cursor: pointer;
}

.brand-nav .brand-next i{
	font-size: 50px;
}

.brand-content .brand-item{
	position: relative;
}

.brand-item a{
	text-decoration: none;
	color: #000;
	display: flex;
	flex-direction: column;
	align-items: center;
    justify-content: center;
}

.brand-item a .brand-img-wrapper{
    width: 100%;
    border-radius: 20px;
	padding: 16px;
}

.brand-item a .brand-img-wrapper img{
	width: 100%;
	border-radius: 20px;
	box-shadow: 1px 2px 2px 1px #e7e7e7;
}

.brand-item a .qty-brand{
	font-size: 12px;
	text-align: center;
	margin-top: 10px;
}


.category-pop-up.actived{
	display: flex;
}

.category-pop-up{
	display: none;
	position: fixed;
	top: 0;
	bottom: 0;
	left:0;
	right: 0;
	z-index: 100;
}

.category-pop-up .category-blackout{
	display: flex;
	position: fixed;
	top: 0;
	bottom: 0;
	left:0;
	right: 0;
	background: rgba(0,0,0,0.6);
	z-index: 102;
	flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.category-pop-up .category-pop-content-box{
	width: 700px;
    height: 500px;
    background: #fff;
    border-radius: 10px;
}

.category-pop-content-box .category{
	overflow: auto;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.category .category-text{
	display: flex;
    flex-direction: column;
}

.category-text .close-pop{
	display: flex;
	padding: 10px;
	justify-content: flex-end;
	width: 40px;
	margin-left: auto;
	cursor: pointer;
}

.category-text .close-pop i:hover{
	color: #FF0000;
}

.category-text .close-pop i{
	font-size: 20px;
    color: #aeaeae;
}

.category-text .category-text-title{
    font-size: 20px;
    font-weight: bold;
    border-bottom: 3px solid #68b8b2;
    margin: 0px 20px 10px 20px;
    padding-bottom: 10px;
}

.category-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
}

.category-item {
    width: calc(100% / 5 - 10px);
    margin: 5px;
    text-align: center;
}

.category-item a:hover .category-item-title {
	color: #FF0000;
}

.category-item a{
	text-decoration: none;
}

.category-icon {
	margin-bottom: 10px;
}

.category-icon img {
    width: 80px;
    height: 80px;
    object-fit: contain; 
}

.category-item-title{
	text-align: center;
	color: #000;
	font-size: 14px;
}

.category-item-sale {
    width: calc(100% / 5 - 10px);
    margin: 5px;
    text-align: center;
}

.category-item-sale a{
	text-decoration: none;
}

.category-item-sale a:hover .category-item-title{
	color: #ff0400;
}

.category-item-sale .category-icon .normal{
	width: 50px;
}

.showroom-section {
	display: flex;
	align-items: center;
	flex-direction: column;
	margin-top: 50px;
}

.showroom-section .showroom-main{
	display: flex;
    flex-direction: column;
    width: 100%;
    padding: 0px 6%;
}

.showroom-main .showroom-title{
	display: flex;
    flex-direction: column;
    padding: 30px 0px;
}

.showroom-title .showroom-title-main{
	font-size: 25pt;
    font-weight: 600;
	margin-bottom: 5px;
}

.showroom-title .showroom-title-sub{
	font-size: 12pt;
} 

.showroom-main .showroom-main-box{
	display: flex;
    width: 100%;
    align-items: center;
    justify-content: space-between;
}

.showroom-main-box .showroom-main-content{
	width: 50%;
}

.showroom-main-content .showroom-main-content-item{
	width: 100%;
    display: flex;
    flex-direction: column;
    border-radius: 10px;
}

.showroom-main-content-item img{
	height: 400px;
    object-fit: cover;
    border-radius: 30px;
}

.showroom-main-btn{
	display: flex;
	flex-direction: column;
	width: 50%;
	padding-left: 30px;
}

.showroom-main-box .showroom-main-btn-item{
	padding: 30px 0px;
    text-align: center;
    border-radius: 10px;
    cursor: pointer;
}

.showroom-main-btn-item .showroom-item-box{
	display: flex;
}

.showroom-item-box .showroom-item-main{
	border: 1px solid #c0c0c0;
    border-radius: 40px;
    margin: 0px 20px 0px 0px;
    align-items: center;
    text-align: left;
    display: flex;
    font-weight: bold;
    font-size: 15pt;
    padding-left: 20px;
    width: 65%;
	cursor: pointer;
}

.showroom-item-box .showroom-item-main.active{
	background: #49A7A1;
	color: #fff;
}


.showroom-item-link{
	border: 1px solid #c0c0c0;
    border-radius: 40px;
    padding: 10px 20px;
    width: 30%;
}

.showroom-item-link a{
	text-decoration: none;
    display: flex;
    color: #000;
    align-items: center;
    text-align: left;
}

.showroom-item-link a img{
	width: 50px;
	height: 50px;
}

.showroom-item-link a .item-link-text{
	font-size: 10pt;
	display: flex;
	flex-direction: column;
}

.showroom-item-link a .item-link-text .item-link-text-sub{
	font-weight: bold;
}

.showroom-main-btn-item .showroom-item-address{
	text-align: left;
    display: flex;
    margin-top: 20px;
    padding-left: 10px;
    font-size: 11pt;
}

.fade-out {
    animation: fadeOut 0.2s forwards;
}

.fade-in-left {
    animation: fadeInLeft 0.3s forwards;
}

.fade-in-right {
    animation: fadeInRight 0.3s forwards;
}
 
@keyframes fadeOut {
    from { opacity: 1; }
    to { opacity: 0; }
}

@keyframes fadeInLeft {
    from { opacity: 0; transform: translateX(-50px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes fadeInRight {
    from { opacity: 0; transform: translateX(50px); }
    to { opacity: 1; transform: translateX(0); }
}

.showroom-text-box {
	flex: 1;
    padding: 0px 40px;
    line-height: normal;
	width: 50%;
}

.showroom-text-big {
	font-size: 60px;
    font-weight: bold;
}

.showroom-text-big-y {
    font-size: 65px;
    font-weight: bold;
    color: #FFD600;
}

.showroom-text-small {
	font-size: 20px;
    margin-top: 10px;
}

.bold {
    font-weight: bold;
}

.showroom-nav-box {
	width: 50%;
    background-color: #fff;
    padding: 20px;
    color: #000;
	margin: 20px 0px;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
}

.showroom-nav-item {
    font-size: 14px;
    margin-bottom: 10px;
	cursor: pointer;
}

.showroom-nav-item:hover{
	text-decoration: underline;
}

.showroom-item.bold {
    display: block;
    margin-bottom: 5px;
}


.showroom-pop-up{
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.160);
	z-index: 105;
}

.showroom-popup-container {
    display: flex;
	margin-left: 70px;
    margin-top: 150px;
    width: 100%;
    height: 100%;
}

.showroom-popup-content {
    background: #fff;
    width: 600px;
    height: 400px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 10px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
    position: relative;
}

.showroom-popup-img {
    display: none;
	width: 100%;
    height: 100%;
    border-radius: 10px;
}

.showroom-popup-img img{
	width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}

.showroom-popup-img.active {
    display: block;
}

.showroom-pop-up .close-btn {
    position: absolute;
    top: 10px;
    right: 15px;
    cursor: pointer;
    font-size: 18px;
    background: none;
    border: none;
}

.highlight-section{
    display: flex;
    flex-direction: column;
    margin-top: 50px;
    padding: 0px 6%;
}

.highlight-title{
	text-align: center;
    padding: 20px;
}

.highlight-title .highlight-title-main{
	font-size: 25pt;
	font-weight: 600;
	margin-bottom: 5px;
}

.highlight-title .highlight-title-sub{
	font-size: 12pt;
}

#dot-tooltip {
	transition: all 0.2s ease;
	pointer-events: none;
}

.highlight-content{
	display: flex;
	flex-direction: column;
}

.highlight-content .new-section{
	display: flex;
}

.new-section .new-section-item{
	padding: 10px;
}

.new-section-item .section-item-text{
	text-align: center;
	margin-top: 10px;
}

.highlight-content .new-section img{
	width: 100%;
	height: 100%;
	border-radius: 40px;
}

.new-section-item .section-item-img{
	position: relative;
	overflow: visible !important;
}

.new-section .owl-stage-outer {
	
}

.section-item-img .dot{
	position: absolute;
	transform: translate(-50%, -50%);
	width: 16px;
	height: 16px;
	background-color: #49a7a1;
	border-radius: 50%;
	cursor: pointer;
	z-index: 10;
}

#dot-tooltip{
	display:none;
	position:absolute;
	z-index:1000;
	background:white;
	border:1px solid #ccc;
	border-radius:8px;
	padding:8px;
	box-shadow:0 2px 8px rgba(0,0,0,0.2);
	width:200px;
}

#dot-tooltip {
	transition: opacity 0.2s ease;
	pointer-events: auto !important;
}

#dot-tooltip #tooltip-image{
	width:100%;
	height:100px;
	overflow:hidden;
	border-radius:6px;
	margin-bottom:5px;
}

#dot-tooltip #tooltip-image img{
	width:100%; 
	height:100%; 
	object-fit:cover;
}

#dot-tooltip #tooltip-name{
	font-weight:600;
	font-size:14px;
}

#dot-tooltip #tooltip-price{
	color:#d00; 
	font-size:13px; 
	margin-bottom:5px;
}

#dot-tooltip #tooltip-link{
	font-size:12px;
	color:#49a7a1;
	text-decoration: none;
	text-align: center;
	display: flex;
	justify-content: center;
}





.project-section {
	margin: 0px;
    padding: 30px 6%;
  }
  
  .project-title {
	display: flex;
	justify-content: space-between;
	margin-bottom: 20px;
  }

  .project-title .project-title-text{
	display: flex;
	flex-direction: column;
	padding: 10px;
  }
  
  .project-title-text .project-title-main {
	font-size: 25pt;
    font-weight: 600;
	margin-bottom: 5px;
  }
  
  .project-title-text .project-title-sub {
	font-size: 12pt;
    color: #000;
  }
  
  .project-title .project-title-link{
	display: flex;
    justify-content: center;
    align-items: center;
  }

  .project-title .project-title-link a{
	border: 1px solid #C0C0C0;
    padding: 7px 50px;
    border-radius: 30px;
    text-decoration: none;
    color: #000;
    font-weight: 600;
  }

  .project-title .project-title-link a:hover{
	color: #fff;
	background: #49A7A1;
	border: none;
  }

  .project-content {
	width: 100%;
    display: flex;
    flex-direction: column;
  }

  .project-content .project-content-row{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
  }

  .project-content-row .project-item{
	position: relative;
	margin: 10px 10px 10px 0px;
	width: 48%;
	height: 350px;
	border-radius: 30px;
	margin-bottom: 30px;
  }

  .project-item .project-item-img{
	height: 100%;
	border-radius: 30px;
	overflow: hidden;
	position: relative;
  }

  .project-item-img img{
	width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 30px;
	transition: transform 0.5 ease;
  }

  .project-item:hover .project-item-img img {
	transform: scale(1.1);
  }

  .project-item .project-item-text{
	position: absolute;
    bottom: 0;
    background: #ffffffad;
    width: 100%;
    height: 65px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0px 20px;
  }

  .project-item:hover .project-item-text{
	background: #49a7a1bf;
	color: #fff;
	border-bottom-left-radius: 30px;
	border-bottom-right-radius: 30px;
  }

  .project-item-text .project-item-text-name{
	font-size: 10pt;
    font-weight: 650;
	color: #000;
    width: 50%;
	margin-left: 15px;
  }

	.project-item:hover .project-item-text .project-item-text-name {
		color: #fff;
		
	}

  .project-item-text .project-item-text-link{
	width: 50%;
    text-align: right;
  }

  .project-item-text .project-item-text-link a{
	text-decoration: none;
    color: #fff;
    background: #49a7a1;
    text-align: center;
    padding: 4px 40px;
    border-radius: 30px;
	margin-right: 15px;
  }

  .project-item:hover .project-item-text-link a{
	background: #fff;
	color: #000;
  }

  .project-item-text .project-item-text-link a:hover{
	background: #FCAA4C;
	color: #fff;
  }

  

  
.client-section{
	display: flex;
	flex-direction: column;
	margin-top: 30px;
	padding: 0px 6%;
}

.client-content-box .item img{
    filter: grayscale(100%);
    opacity: 0.6;
    transition: all 0.3s ease;
    max-height: 100px; 
    object-fit: contain;
    margin: 0 auto;
    display: block;
}

.client-content-box .item:hover img{
    filter: grayscale(0%);
    opacity: 1;
    transform: scale(1.05);
}

.client-section .client-title{
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-bottom: 60px;
}

.client-title .client-title-main{
	font-size: 25pt;
	font-weight: 600;
	margin-bottom: 5px;
}

.client-title .client-title-sub{
	font-size: 12pt;
}

.client-section .client-content{
	display: flex;
	flex-direction: column;
}

.client-content .client-content-box{
    display: flex;
    margin-bottom: 50px;
    justify-content: space-between;
	align-items: center;
}

.client-content .client-content-box .item{

}

.client-content-box .item a img{
	width: 180px;
}

.client-section .client-link{
	display: flex;
	justify-content: center;
	margin-top: 20px;
}

.client-section .client-link a{
	border: 1px solid #A6A3A3;
    padding: 10px 70px;
    border-radius: 40px;
    text-decoration: none;
    color: #000;
    font-weight: 600;
		
}

.client-section .client-link a:hover{
	border: 1px solid #49A7A1;
	color: #fff;
	background: #49A7A1;

}

.tips-section{
	display: flex;
    flex-direction: column;
    margin-top: 50px;
}

.tips-section .tips-content{
	background: #f1f1f1;
	display: flex;
	justify-content: space-around;
}

.tips-content .tips-l{
	display: flex;
    flex-direction: column;
    justify-content: center;
    line-height: normal;
    padding: 50px 0px;
}

.tips-content .tips-l div{
	font-weight: bold;
	font-size: 45px;
}

.tips-content .tips-r{
	padding: 50px 0px;
}

.tips-content .tips-r a{
	color: #49A7A1;
}

.tips-content .tips-r a:hover{
	color: #1c5954;
}

.excess-section{
	display: flex;
    flex-direction: column;
    margin-top: 50px;
    padding: 0px 6%;
}

.excess-section .excess-title{
	display: flex;
    justify-content: center;
    margin-bottom: 50px;
    font-weight: 600;
    text-align: center;
    font-size: 25pt;
}

.excess-section .excess-title a{
	text-decoration: none;
	color: #49A7A1;
	margin-left: 5px;
}

.subs-section{
	display: flex;
    justify-content: space-between;
	margin: 70px 6% 50px 6%;
    background: #F7F7F7;
    padding: 50px;
    border-radius: 40px;
    border: 1px solid #C0C0C0;
}

.subs-section.sub-sec{
	margin: 70px 0% 50px 0%;
}

.subs-section .subs-l{
	display: flex;
    flex-direction: column;
}

.subs-section .subs-l .subs-l-main{
	font-size: 25pt;
    font-weight: bold;
}

.subs-section .subs-l .subs-l-sub{
	font-size: 12pt;
}

.subs-section .subs-r{
	display: flex;
    justify-content: center;
    align-items: center;
}

.subs-r .subs-r-box{
	display: flex;
    align-items: center;
    border: 1px solid #c0c0c0;
    border-radius: 20px;
}

.subs-r .subs-r-box .input-subs{
	border: none;
    height: 70px;
    width: 450px;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    padding-left: 20px;
}

.subs-r .subs-r-box .text-subs{
	background: #49A7A1;
    height: 70px;
    text-align: center;
    align-items: center;
    display: flex;
    padding: 0px 50px;
    color: #fff;
    font-weight: 600;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    font-size: 25px;
    cursor: pointer;
}


.page-sub-content{
	max-width: 1200px;
	margin: auto;
}

.notif-ads-section{
	position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
	background-color: #1c5954;
	overflow-x: hidden;
	
}

.notif-content{
	display: block;
	text-align: center;
	letter-spacing: 1px;
	font-size: 18px;
	padding-top: 10px;
	padding-bottom: 10px;
	word-spacing: normal;
	background-color: #ffd204;
	color: black;
	width: 100%;
	
}

@keyframes notif {
  0%   {left:450px;}
  100% {left:-2140px;}
}

.notif-content .stronger{
	font-size: 20px;
	font-weight: bold;
	font-family: Arial Black  !important;
}

.btn-close-ads{
	position: absolute;
	right: 10px;
	top: 15px;
	color: black;
	cursor: pointer;
}

.top-banner-section{
	width: 100%;
	background-color: transparent;
	padding-left: 0%;
	padding-right: 0%;
	margin-top: 32px;
}

/* banner popup */
.banner-popup-blackout{
	position: fixed;
    top: 0px;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0,0,0,0.6);
    z-index: 200;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.banner-popup-container{
	position: relative;
    padding-top: 150px;
	width: 100%;
    display: flex;
    justify-content: center;
    height: auto;
}

.banner-popup-content{
	display: flex;
    justify-content: center;
    width: 300px;
    height: 400px;
    position: relative;
}

.banner-popup-content .icon-close{
	position: absolute;
    right: -45px;
    font-family: arial;
    top: 5px;
    font-size: 20px;
    border-radius: 50px;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
	cursor: pointer;
}

.banner-popup-content img{
	width: auto;
	height: auto;
}

/* popup merchant */

.panel-popup{
	position: relative;
    padding-top: 144px;
}

.panel-popup .blackout-popup{
	display: flex;
	position: fixed;
	top: 147px;
	bottom: 0;
	left: 0;
	right: 0;
	background: rgba(0,0,0,0.6);
    z-index: 102;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
	padding-top: 46px;
    padding-bottom: 66px;
}

.content-box{
	display: flex;
	justify-content: center;
	width: 416px;
	height: 531px;
	background: white;
	border-radius: 14px;
	-webkit-border-radius: 14px;
	-moz-border-radius: 14px;
	-ms-border-radius: 14px;
	-o-border-radius: 14px;
	
}
.content-box .form-merchant{
	display: flex;
    flex-direction: column;
    width: 100%;
    padding: 42px;
}

.form-merchant .header-form{
	text-align: center;
    border-bottom: 1px solid #9c9c9c;
    margin-bottom: 23px;
	display: flex;
}
.header-form .close-pop{
	position: absolute;
    font-size: 24px;
    color: #cbcbcb;
    margin-top: -29px;
    margin-left: 324px;
    line-height: 24px;
    
    cursor: pointer;
}
.header-form p{
	font-size: 20px;
    font-weight: 600;
}

.col-form{
	width: 100%;
    padding-top: 10px;
    padding-bottom: 5px;
}

.form-merchant .action-button{
	justify-content: center;
    padding-top: 16px;

}

.form-merchant .form-error{
	color: red;
	font-size: 14px;
}

.action-button .btn-action-send{
	width: 100%;
    color: white;
    background: #69b8b2;

}

/*slide banner*/

.banner-img {
	text-align: center;
	
}

/*  ADS BANNER */

.iklan-section{
	text-align: center;
	padding: 0px;
}

.iklan-section img{
	width: 100%;
	height: auto;
	border-radius: 20px;
}

.hot-sale-intro{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
    align-items: center;
    align-content: center;
    flex-direction: column;
}

.hot-sale-bg{
	width: 100%;
	background-color: #f88376;
	text-align: center;
}

.hot-sale-section{
	position:relative;
}

.hot-sale-title-img{
	width: 300px;
    height: auto;
}

.hot-sale-title{
	font-size: 36px;
	font-style: italic;
	padding-left: 50px;
}

.hot-sale-section .hot-sale-content{
	width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
	margin-top: 20px;
}



.hot-sale-section .counter-container{
	font-size: 16px;
	display: flex;
    align-items: center;
	margin-top: 20px;
	margin-bottom: 20px;
}

.hot-sale-section .counter-container .small-text{
	font-size: 16px;
	margin-right: 10px;
}

.hot-sale-section .h-count{
	display: inline-block;
    color: #fff;
    font-size: 14px;
    width: 20px;
    height: 20px;
    text-align: center;
    vertical-align: super;
	margin-top: auto;
	margin-bottom: auto;
	margin-left: 5px;
}

.hot-sale-section .m-count{
	display: inline-block;
    color: #fff;
    font-size: 14px;
    width: 20px;
    height: 20px;
    text-align: center;
    vertical-align: super;
	margin-top: auto;
	margin-bottom: auto;
}

.hot-sale-section .s-count{
	display: inline-block;
    color: #fff;
    font-size: 14px;
    width: 20px;
    height: 20px;
    text-align: center;
    vertical-align: super;
	margin-top: auto;
	margin-bottom: auto;
}

.hot-sale-section .hot-sale-all{
	margin-top: auto;
    margin-bottom: auto;
    position: absolute;
    right: 0;
    top: 20px;
}

.hot-sale-section .hot-sale-all a{
	text-decoration: none;
    color: #69b8b2;
    font-size: 18px;
}

.hot-sale-section .hot-sale-nav{
	position: absolute;
    top: calc(50% - 36px);
	display: flex;
	flex-wrap: wrap;
	left:-20px;
	right:-20px;
	justify-content: space-between;
	font-size: 3rem;
}

.hot-sale-section .hot-sale-nav i{
	cursor:pointer;
}

.hot-sale-section .product-item{
    padding: 20px;
}

.hot-sale-section .product-item a{
	text-decoration: none;
}

.hot-sale-section .product-item .product-wrapper{
	text-align: center;
	width: 100%;
	padding-top: 100%;
	overflow:hidden;
	position: relative;
	margin-bottom: 10px;
}

.hot-sale-section .product-item .product-wrapper .product-cover-acc{
	position: absolute;
    z-index: 3;
    bottom: 40px;
    right: 5px;
}

.hot-sale-section .product-item .product-wrapper .product-cover-acc img{
	width: 70px;
	height: auto;
}

.hot-sale-section .product-item .product-wrapper .product-certifed{
	position: absolute;
	top: 10px;
	right: 0px;
	z-index: 2;
}

.hot-sale-section .product-item .product-wrapper .product-certifed img{
	width: 60px;
}

.hot-sale-section .product-item .product-wrapper .hotsale-logo{
	display: flex;
    background-color: #c3c3c3;
	border-radius: 0px 0px 60px 0px;
    width: 100%;
    color: #fff;
    font-size: 14px;
    text-align: center;
    justify-content: center;
    margin-top: 10px;
    padding-top: 4px;
    padding-bottom: 2px;
}

.hot-sale-section .product-item .product-wrapper .hotsale-logo .small-text{
	font-size: 14px;
	margin-top: auto;
	margin-bottom: auto;
	color: #fff;
}

.hot-sale-section .product-item .product-wrapper .price-cut{
	width: 40px;
    position: absolute;
    color: #FF1400;
    background: #f1ae25;
    height: 35px;
    padding: 0px 10px;
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    white-space: nowrap;
    text-align: center;
    cursor: default;
    display: flex;
    user-select: none;
    border-radius: 3px;
    z-index: 2;
    top: 0px;
    left: 0px;
    border-bottom-right-radius: 50px;
    justify-content: center;
    align-items: center;
}

.hot-sale-section .product-item .product-wrapper > img{
    position: absolute;
	width: 100%;
	height: auto;
	transition: all 0.2s linear;
	top: 0px;
	left: 0px;
	z-index: 1;
}

.hot-sale-section .product-item .product-wrapper:hover > img{
	width: 110%;
	left: -10px;
	top: -10px;
}

.hot-sale-section .product-item .product-item-text h3{
    font-size: 16px;
    color: black;
    font-weight: bold;
	margin-bottom: 5px;
	line-height: 18px;
	max-height: 18px;
	display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hot-sale-section .product-item .product-item-text h4{
    font-size: 14px;
    color: black;
	margin-bottom: 2px;
	max-height: 16px;
	display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.hot-sale-section .product-item .product-item-text h2 {
    font-size: 18px;
    color: red;
	margin-bottom: 0px;
}

.hot-sale-section .product-item .product-item-text h5 {
    font-size: 14px;
    /*color: #959595;*/
    color: black;
	margin-top: 5px;
	text-decoration:line-through;
    display: flex;
    justify-content: space-between;
	min-height: 17px;
	margin-bottom: 5px;
}

.hot-sale-section .product-item .product-item-text span {
    color: red;
    font-size: 14px;
}

.hot-sale-section .product-item .product-item-text .product-rate-sale {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 10px;
}

.hot-sale-section .product-item .product-item-text .product-rate-sale i{
	color: yellow;
	margin-right: 5px;
}

.hot-sale-section .product-item .product-item-text .product-rate-sale .rate{
	color: #959595;
	margin-right: 90px;
}

.hot-sale-section .product-item .product-item-text .product-rate-sale .sale{
	color: #959595;
}

.hot-sale-section .product-item .product-item-text .add-to-cart{
    text-decoration: none;
    border-radius: 10px;
    padding: 10px;
	text-align: center;
	cursor: pointer;
	background-color: #f88376;
    color: #fff;
}

.hot-sale-section .product-item .product-item-text .add-to-cart:hover{
    background-color: #f1ae25;
	color: black;   
} 

.hot-sale-section .hot-sale-more-row{
	text-align:center;
}

.hot-sale-section .hot-sale-more-row a{
	color: red;
	font-size: 18px;
}


/* produk terakhir dilihat */

.last-see-section{
	display: flex;
	flex-direction: column;
	margin-top: 30px;
}

.last-see-section .last-see-top{
	display: flex;
	justify-content: space-between;
}

.last-see-top .last-see-text{
	font-size: 24px;
	font-weight: bold;
}

.last-see-top .last-see-link{

}

.last-see-top .last-see-link a{
	text-decoration: none;
	color: #69b8b2;
	font-size: 18px;
}

.last-see-section .product-item{
	padding: 20px;
}

.last-see-section .product-item a{
	text-decoration: none;
}

.last-see-section .product-item .product-wrapper{
	text-align: center;
    width: 100%;
    padding-top: 100%;
    overflow: hidden;
    position: relative;
    margin-bottom: 10px;
}

.last-see-section .product-item .product-wrapper .product-certifed{
	position: absolute;
	top: 10px;
	right: 70px;
	z-index: 2;
}

.last-see-section .product-item .product-wrapper .product-certifed img{
	width: 60px;
}

.last-see-section .product-item .product-wrapper .price-cut{
	position: absolute;
    color: white;
    background: rgb(175, 29, 47);
    height: 20px;
    min-width: 20px;
    padding: 0px 6px;
    font-weight: 600;
    font-size: 12px;
    line-height: 20px;
    white-space: nowrap;
    text-align: center;
    cursor: default;
    display: inline-block;
    user-select: none;
    border-radius: 3px;
    z-index: 2;
    top: 0px;
    left: 0px;
}

.last-see-section .product-item .product-wrapper img{
	position: absolute;
    width: 100%;
    height: auto;
    transition: all 0.2s linear;
    top: 0px;
    left: 0px;
    z-index: 1;
}


.last-see-section .product-item .product-item-text{

}

.last-see-section .product-item .product-item-text h4{
	font-size: 14px;
    color: black;
    margin-bottom: 2px;
    max-height: 16px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.last-see-section .product-item .product-item-text h3{
	font-size: 16px;
    color: black;
    font-weight: bold;
    margin-bottom: 5px;
    line-height: 18px;
    max-height: 18px;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.last-see-section .product-item .product-item-text h2{
	font-size: 18px;
    color: red;
    margin-bottom: 0px;
}

.last-see-section .product-item .product-item-text h5{
	font-size: 14px;
    /* color: #959595; */
    color: black;
    margin-top: 5px;
    text-decoration: line-through;
    display: flex;
    justify-content: space-between;
    min-height: 17px;
    margin-bottom: 5px;
}

.last-see-section .product-item .product-item-text span {
    color: red;
    font-size: 14px;
}

.last-see-section .product-item .product-item-text .product-rate-sale{
	display: flex;
	  justify-content: space-between;
	  margin-bottom: 10px;
	margin-left: 5px;
	margin-right: 5px;
  }
  
  .last-see-section .product-item .product-item-text .product-rate-sale .sale{
	color: #959595;
  }
  
  .last-see-section .product-item .product-item-text .product-rate-sale .terlaris{
	color: white;
	background: #a9b318;
	padding-right: 5px;
	padding-left: 10px;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
  }

.last-see-section .product-item .product-item-text .add-to-cart{
    text-decoration: none;
    border-radius: 10px;
    padding: 10px;
	text-align: center;
	cursor: pointer;
	background-color: #69b8b2;
    color: white;
}

.last-see-section .product-item .product-item-text .add-to-cart:hover{
    background-color: #f1ae25;
	color: black;   
} 


/* end terakhir dilihat */

/* banner promo*/
.banner-promo{
	display: flex;
	flex-wrap: wrap;
}

.banner-promo .banner-promo-pretext{
	width: 100%;
	margin-bottom: 20px;
	border-bottom: 1px solid #dedede;
}

.banner-promo .banner-promo-pretext h4{
	margin-bottom: 0px;
	font-weight: bold;
	font-size: 24px;
}

.banner-promo .banner-promo-pretext h5{
	font-size: 12px;
	margin-bottom: 10px;
}

.banner-promo .banner-promo-item{
	overflow:hidden;
	position:relative;
	width: 262.5px;
	height: 262.5px;
}


.banner-promo .banner-promo-item .img-fluid{
	position: relative; 
	width: 100%;
	height: auto;
	transition: all 0.2s linear;
	top: 0px;
	left: 0px;
	max-width: unset;
	z-index: 1;
}

.banner-promo .banner-promo-item .img-fluid:hover{
	width: 110%;
	height: auto;
	left: -10px;
	top: -10px;
}

/* Rame */
.rame{
	width: 100%;
	padding: 0px;
}

.rame-text{
	margin-top: 2%;
	display: flex;
	flex-wrap: wrap;
	justify-content: left;
	align-items: center;
	border-bottom: 1px solid #dedede;
}

.rame-text .left-text h2{
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 0px;
}

.rame-text .left-text h3{
	font-size: 14px;
	font-weight: 300;
	margin-bottom: 0px;
}

.rame-text .right-text{
	margin-left: 250px;
}

.rame-text .right-text a{
	color: red;
	font-weight: bold;
	font-size: 24px;
	text-decoration: none;
}

.rame-text .right-text a img{
	margin-right: 10px;
	width: auto;
	height: 24px;
}

.rame-category-row{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	padding: 15px calc(3% - 3px);
}

.rame-category-row .rame-category-item{
	border: 1px solid #aeaeae;
	border-radius: 20px;
	width: 300px;
	padding: 10px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	position:relative;
	background: #fff;
}

.rame-category-row .rame-category-item img{
	width: auto;
	height: 80px;
}

.rame-category-row a{
	text-decoration: none;
	color: black;
}

.rame-category-row .rame-category-text{
	margin-left: 10px;
}

.rame-category-row .rame-category-text h3{
	font-size: 20px;
	line-height: 20px;
    margin-bottom: 0px;
}

.rame-category-row .rame-category-text h4{
	font-size: 14px;
    font-weight: 300;
	margin-bottom:0;
	color: #a7a7a7;
}

.rame-category-row .rame-category-item .great-icon{
	position: absolute;
    top: -15px;
    right: -15px;
    height: 65px;
}

/* koreksi */


/* Banner */

.banner-section{
	width: 100%;
	background-color: transparent;
	padding-left: 0%;
	padding-right: 0%;
}

.banner-section .banner-row{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.banner-section .banner-row img{
	width: auto;
	height: 370px;
	border-radius: 20px;
}

.banner-section .banner-row .small-banner{
	margin-right: 20px;
}

.banner-section .banner-row .large-banner{

}

/* banner offer*/
.banner-offer{
	display: flex;
	flex-wrap: wrap;
}

.banner-offer .banner-offer-pretext{
	width: 100%;
	margin-bottom: 20px;
	border-bottom: 1px solid #dedede;
}

.banner-offer .banner-offer-pretext h4{
	margin-bottom: 10px;
	font-weight: bold;
	font-size: 24px;
}

.banner-offer .banner-offer-pretext h5{
	font-size: 12px;
	margin-bottom: 10px;
}

.banner-offer .banner-offer-item{
	

}


.banner-offer .banner-offer-item .img-fluid{
	width: 100%;
	height: auto;
}

/* Join us */

.join{
	width: 100%;
	background-color: transparent;
	padding: 0px 0%;
}
  
.join-text{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: end;
	border-bottom: 1px solid #dedede;
	
}

.join-text .left-text h2{
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 0px;
}

.join-text .left-text h3{
	font-size: 14px;
	font-weight: 300;
}

.join-text .right-text a{
	color: red;
	font-weight: bold;
}

.join-img a img{
	width: 100%;
	background-color: #fff;
	padding: 0px;
	border-radius: 20px;
}

  /* Mercant */

.mercant{
	width: 100%;
	background-color: transparent;
	padding: 0px;
}

.mercant .mercant-category{
	display: flex;
	flex-wrap: nowrap;
	background-color: transparent;
	padding: 0px 0px;
}

.mercant .mercant-category .mercant-img-text{
	background-color: transparent;
	text-align: center;
	margin-right: 16px;
	margin-left: 16px;
}


.mercant .mercant-category .mercant-img-text .mercant-img-wrapper{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
}

.mercant .mercant-nav .mercant-next{
	opacity: 1;
	cursor: pointer;
	position: absolute;
	height: 100%;
    width: 50px;
	right: 0;
	top:0;
}

.mercant .mercant-nav .mercant-next i{
	position: absolute !important;
    top: calc(50% - 25px);
    right: -30px;
    font-size: 50px;
}


.mercant .mercant-nav .mercant-prev{
	height: 100%;
	opacity: 1;
	cursor: pointer;
	position: absolute;
	height: 100%;
    width: 50px;
	top:0;
}

.mercant .mercant-nav .mercant-prev i{
	position: absolute !important;
    top: calc(50% - 25px);
    left: -30px;
	font-size: 50px;
}

.mercant .mercant-category .mercant-img-text img{
	width: auto;
	height: 105px;
	border-radius: 15px;
	box-shadow: 6px 2px 4px #cdcdcd;
    margin-bottom: 15px;
}

.mercant .mercant-category .mercant-img-text h4{
	font-size: 11px;
	text-align: center;
}

.mercant .mercant-category .mercant-img-text a{
	color: #69b8b2;
	text-decoration: none;
}

.mercant .mercant-category .mercant-img-text .visit-mercant{
	border: 2px solid #69b8b2;
	width: calc(100% - 20px);
	margin: auto 10px;
	padding: 5px;
	background: white;
}

.mercant .mercant-category .mercant-img-text .visit-mercant:hover{
	background: #69b8b2;
	color: white;
	box-shadow: 2px 2px 2px white;
}

/* Banner Kursi Gaming*/
.gaming-section{
	text-align: center;
	padding: 0px;
}

.gaming-section img{
	width: 100%;
	height: auto;
	border-radius: 20px;
}

/* Laris Category */
.best-display-section{
	padding: 0px;
}

.best-display-section .best-intro{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: end;
	border-bottom: 1px solid #dedede;
}
.best-display-section .best-intro .intro-text{
	margin-bottom: 10px;
}

.best-display-section .best-intro .intro-text h4{
	margin-bottom: 0px;
	font-weight: bold;
	font-size: 24px;
}

.best-display-section .best-intro .intro-text h5{
	font-size: 12px;
	margin-bottom: 0px;
}

.best-display-section .view-more{
	margin-top: 20px;
	text-align: end;
	position: relative;
	right: 175px;
}

.best-display-section .view-more a{
	text-decoration: underline;
	color: red;
	font-weight: bold;
}

.best-seller-display{
	display: flex;
	align-content: center;
}

.best-seller-image{
	position: relative;
	z-index:2; 
	margin-left: 40px;
}

.best-seller-image .shop-now{
	text-transform: uppercase;
    position: absolute;
    z-index: 3;
    bottom: 65px;
    /* left: 40px; */
    /* right: 50px; */
    color: white;
    background-color: black;
    font-size: 16px;
    text-align: center;
    padding: 10px;
    width: 168px;
    left: calc(50% - 80px);
}

.best-seller-item-container{
	position: relative;
	z-index:3;
	display: flex;
    align-items: center;
	left: -40px;
	width: 960px;
}

.best-seller-item-container .product-item{
	padding: 20px;
    padding-bottom: 15px;
    position: relative;
    width: 240px;
    background: white;
	border: 1px solid transparent;
	border-radius: 20px;
}

.best-seller-item-container .product-item a{
	text-decoration: none;
}

.best-seller-item-container .product-item .product-wrapper{
	text-align: center;
	width: 100%;
	padding-top: 100%;
	overflow:hidden;
	position: relative;
	margin-bottom: 10px;
}

.best-seller-item-container .product-item .product-wrapper .product-certifed{
	position: absolute;
	top: 10px;
	right: 0px;
	z-index: 2;
}

.best-seller-item-container .product-item .product-wrapper .product-certifed img{
	width: 60px;
}

.best-seller-item-container .product-item .product-wrapper .price-cut{
	position: absolute;
	color: white;
	background: rgb(175, 29, 47);
	height: 20px;
    min-width: 20px;
    padding: 0px 6px;
    font-weight: 600;
    font-size: 12px;
    line-height: 20px;
    white-space: nowrap;
    text-align: center;
    cursor: default;
    display: inline-block;
    user-select: none;
    border-radius: 3px;
	z-index: 2;
	top: 0px;
	left: 0px; 
}

.best-seller-item-container .product-item .product-wrapper > img{
    position: absolute;
	width: 100%;
	height: auto;
	transition: all 0.2s linear;
	top: 0px;
	left: 0px;
	z-index: 1;
}

.best-seller-item-container .product-item .product-wrapper:hover > img{
	width: 110%;
	left: -10px;
	top: -10px;
}

.best-seller-item-container .product-item .product-item-text h3{
    font-size: 16px;
    color: black;
    font-weight: bold;
	margin-bottom: 5px;
	line-height: 18px;
	max-height: 18px;
	display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.best-seller-item-container .product-item .product-item-text h4{
    font-size: 14px;
    color: black;
	margin-bottom: 2px; 
	max-height: 16px;
	display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.best-seller-item-container .product-item .product-item-text h2 {
    font-size: 18px;
    color: red;
	margin-bottom: 0px;
}

.best-seller-item-container .product-item .product-item-text h5 {
    font-size: 14px;
    color: black;
    display: flex;
    justify-content: space-between;
	min-height: 17px;
	margin-bottom: 5px;
	text-decoration: line-through;
}

.best-seller-item-container .product-item .product-item-text span {
    color: red;
    font-size: 14px;
}

.best-seller-item-container .product-item .product-item-text .product-rate-sale {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 10px;
}

.best-seller-item-container .product-item .product-item-text .product-rate-sale i{
	color: yellow;
	margin-right: 5px;
}

.best-seller-item-container .product-item .product-item-text .product-rate-sale .rate{
	color: #959595;
	margin-right: 82px;
}

.best-seller-item-container .product-item .product-item-text .product-rate-sale .sale{
	color: #959595;
}

.best-seller-item-container .product-item .product-item-text .add-to-cart{
    background-color: #69b8b2;
    text-decoration: none;
    color: white;
    padding: 10px;
	text-align: center;
	cursor: pointer;
}

.best-seller-item-container .product-item .product-item-text .add-to-cart:hover{
    background-color: #f1ae25;
    color: black;    
}

.best-seller-item-container .best-seller-item-card{
	padding: 20px;
    padding-bottom: 15px;
    position: relative;
    width: 180px;
    background: white;
	border: 1px solid transparent;
	border-radius: 20px;
}

.best-seller-item-card .card-item-description{
	margin-top: 20px;
}

.best-seller-item-card .card-item-description .card-brand{
	color: #dedede;
	font-size:12px;
}

.best-seller-item-card .card-item-description .card-name{
	text-transform: uppercase;
    font-weight: bold;
    font-size: 14px;
    line-height: 14px;
}

.best-seller-item-card .card-item-description .card-price{
	color: red;
    font-size: 14px;
    font-weight: bold;
	line-height: 14px;
}

.best-seller-item-card .card-item-description .card-discount{
	font-size: 10px;
	text-decoration: line-through;
}

.best-seller-item-card .card-item-description .card-rating{
	font-size: 10px;
}

.best-seller-item-card .card-item-description .card-rating .star{
	color: #fdd116;
	margin-right: 20px;
}

.best-seller-item-card .card-item-description .card-rating .star i{
	margin: 0px 2px;
}

.best-seller-item-card .add-to-cart{
	margin-top: 10px;
	border: 1px solid #69b8b2;
	text-align: center;
	text-transform: uppercase;
	font-weight: bold;
	padding: 5px 0px;
	font-size: 12px;
}

/* Banner artl */
.banner-artl{
	text-align: center;
	padding: 0px;
}

.banner-artl img{
	width: 100%;
	height: auto;
	border-radius: 20px;
}

/* hightlight section */
.hightlight-section{

}

.section{
	width: 100%;
}

.new-section{
	display: block;
	vertical-align: top;
}

.new-section-bg{
	display: block;
	width: 100%;
	position: relative;
	border-radius: 20px;
}

.new-section-bg .img-fluid{
	position: relative;
	z-index:1;
}

.new-section .new-dot{
	display: inline-block;
	position: absolute;
	width: 20px;
	height: 20px; 
	background-image: url('../img/sign.png');
	/*background-color: #ffde0b;*/
	background-size: cover;
	background-repeat: no-repeat;
	border-radius: 90px;
	top: 403px;
    left: 79.3px;
}

.new-section .new-dot-legend{
	display: inline-block;
	position: absolute;
	color: white;
	font-size: 12px;
	top: 422px;
    left: 60.3px;
	margin-top: 20px;
	margin-left: -15px;
}

.new-section .new-thumb{
	display: none;
	top: -80px;
    left: 10px;
	position: relative;
	width: 200px;
	background: white;
    padding: 10px;
	z-index: 25;
}

.new-thumb .new-thumb-prod-title{
	font-size: 16px;
	text-transform: uppercase;
	font-weight: bold;
}

.new-thumb .new-thumb-prod-sub-title{
	font-size: 11px;
	max-height:15px;
	display: -webkit-box;
	-webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.new-thumb .new-thumb-prod-sub-price{
	font-size: 11px;
	text-decoration: line-through;
}

.new-thumb .new-thumb-prod-price{
	font-size: 16px;
	font-weight: bold;
	color: #ff0400;
}

.new-thumb .new-thumb-to-desc{
	color: white;
    background-color: rgb(61,169,160);
    margin-bottom: 10px;
    margin-top: 10px;
    cursor: pointer;
    border: 2px solid transparent;
    font-size: 15px;
	padding-top: 2px;
}

.new-thumb .new-thumb-to-desc a{
	text-decoration: none;
	color: #fff;
}

.new-thumb .new-thumb-add-cart{
	color: white;
    font-size: 16px;
    background-color: rgb(61,169,160);
    cursor: pointer;
    font-weight: bold;
    border: 2px solid transparent;
}

.banner-kantor{
	text-align: center;
	padding: 0px;
	position: relative;
}


.banner-kantor a img{
	width: 100%;
	height: auto;
	border-radius: 20px;
}

/*  Take out terlebih dahulu
.banner-kantor .text-banner-kantor h2{
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 0px;
	text-align: left;
	position: absolute;
	top: 20px;
	left: calc(5% + 20px);
	color: black;
}

.banner-kantor .text-banner-kantor h3{
	font-size: 12px;
	font-weight: 300;
	text-align: left;
	position: absolute;
	top: 50px;
	left: calc(5% + 20px);
	color: black;
}
 */
/* banner rumah & publik*/
.banner-furniture{
	width: 100%;
	background-color: #fff;
	padding: 0px;
}

.banner-furniture .banner-furniture-row{
	display: flex;
	flex-wrap: wrap;
}

.banner-furniture .banner-rumah{
	position:relative;
	margin-right: 20px;
}

.banner-furniture .banner-furniture-row .banner-rumah a img {
	width: 400px;
	height: 400px;
	border-radius: 20px;
	position: relative;
}

.banner-furniture .banner-furniture-row .banner-rumah h2{
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 0px;
	text-align: left;
	position: absolute;
	top: 20px;
	left: 20px;
	color: black;
}

.banner-furniture .banner-furniture-row .banner-rumah h3{
	font-size: 12px;
	font-weight: 300;
	text-align: left;
	position: absolute;
	top: 50px;
	left: 20px;
	color: black;
}

.banner-furniture .banner-rumah .banner-rumah-shade-over{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right: 0;
	background: rgba(0,0,0,0.6);
    border-radius: 20px;
	display: none;
	flex-wrap: wrap;
	align-content: center;
	justify-content: center;
	cursor:pointer;
}

.banner-furniture .check-portfolio{
	color: white;
	background: transparent;
	padding: 5px 20px;
	border: 1px solid white;
	text-transform: uppercase;
}

.banner-furniture .banner-rumah:hover .banner-rumah-shade-over{
	display: flex;
}

.banner-publik{
	overflow:hidden;
	width: calc(100% - 420px);
	position:relative;
	height: 400px;
	border-radius: 20px;
}

.banner-furniture .banner-furniture-row .banner-publik a img{
	width: 100%;
	height: auto;
}

.banner-furniture .banner-furniture-row .banner-publik h2{
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 0px;
	text-align: left;
	position: absolute;
	left: 20px;
	bottom: 44px;
	color: black;
}
.banner-furniture .banner-furniture-row .banner-publik h3{
	font-size: 12px;
	font-weight: 300;
	text-align: left;
	position: absolute;
	left: 20px;
	bottom: 20px;
	color: black;
}

.banner-furniture .banner-publik .banner-publik-shade-over{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right: 0;
	background: rgba(0,0,0,0.6);
    border-radius: 20px;
	display: none;
	flex-wrap: wrap;
	align-content: center;
	justify-content: center;
	cursor:pointer;
}

.banner-furniture .check-portfolio{
	color: white;
	background: transparent;
	padding: 5px 20px;
	border: 1px solid white;
	text-transform: uppercase;
}

.banner-furniture .banner-publik:hover .banner-publik-shade-over{
	display: flex;
}

/* banner best kantor*/
.best-kantor{
	text-align: center;
	padding: 0px;
	position: relative;
}

.best-kantor .best-kantor-banner{
	position: relative;
}

.best-kantor a img{
	width: 100%;
	height: auto;
	border-radius: 20px;
}

.best-kantor .text-kantor h2{
	font-size: 24px;
	font-weight: bold;
	margin-bottom: 0px;
	text-align: left;
	position: absolute;
	bottom: 42px;
	left: 20px;
	color: #fff;
}

.best-kantor .text-kantor h3{
	font-size: 12px;
	font-weight: 300;
	text-align: left;
	position: absolute;
	margin-bottom: 0px;
	bottom: 20px;
	left: 20px;
	color: #fff;
}

.best-kantor .banner-kantor-shade-over{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right: 0;
	background: rgba(0,0,0,0.6);
    border-radius: 20px;
	display: none;
	flex-wrap: wrap;
	align-content: center;
	justify-content: center;
	cursor:pointer;
}

.best-kantor .check-portfolio{
	color: white;
	background: transparent;
	padding: 5px 20px;
	border: 1px solid white;
	text-transform: uppercase;
}

.best-kantor:hover .banner-kantor-shade-over{
	display: flex;
}


/* iklan 2 */
.iklan-shop{
	text-align: center;
	padding: 0px;
}

.iklan-shop img{
	width: 100%;
	height: auto;
	border-radius: 20px;
}

/* portfolio*/
.portfolio-section{
	padding: 10px;
	margin-top: 50px;
	margin-bottom: 10px;
}

.portfolio

.portfolio-section .other-project{
	text-align: center;
	text-decoration: underline;
	font-size: 1.2rem;
	margin-top: 20px;
}

.portfolio-section .other-project a{
	display:inline-block;
	color: black;
	padding-right: 10px;
	padding-left: 10px;
	padding-top: 10px;
	padding-bottom: 0px;
	background: linear-gradient(90deg
	, rgba(99,199,197,0.5) 0%
	, rgba(99,199,197, 0.8 )50%
	, rgba(99,199,197,0.9) 100%);
	background-size: cover;
	background-repeat: no-repeat;
	line-height: 15px;
	z-index:4;
	font-weight: bold;
	text-decoration: underline;
}

.portfolio-section .other-project a .no-underline{
	text-decoration: none;
}

.portfolio-section .portfolio-pre-text{
	margin-bottom: 20px;
}

.portfolio-home-container{
	width: 100%;
	margin-top: 30px;
}

.portfolio-home-left{
	width:60%;
	display:inline-block;
	float: left;
	padding-right: 10px;
}

.portfolio-home-left a{
	display: inline-block;
	width: calc( calc(100% - 40px) / 2);
}

.portfolio-home-left .left-top{
	margin-right: 20px;
	margin-bottom: 10px;
	border-radius:20px;
	overflow: hidden;
}

.portfolio-home-left .middle-top{
	margin-bottom: 10px;
	border-radius:20px;
	overflow: hidden;
}

.portfolio-home-left .left-bottom{
	margin-right: 20px;
	border-radius:20px;
	overflow: hidden;
}

.portfolio-home-left .middle-bottom{
	border-radius:20px;
	overflow: hidden;
}


.portfolio-home-left .portfolio-bg{
	width: 100%;
    height: 230px !important;
	position: relative;
	background-position: center;
    background-size: cover;
	background-repeat: no-repeat;
}

.portfolio-home-left .portfolio-title{
	display: inline-block;
	float: right;
	position: absolute;
	bottom: 0px;
	right: 0px;
	font-size: 18px;
	width: 300px;
	text-align:right;
	color: black;
	padding-right: 20px;
	padding-left: 10px;
	padding-top: 10px;
	padding-bottom: 5px;
	border-radius: 40px 0px 0px 0px;
	background: linear-gradient(90deg
	, rgba(99,199,197,1) 0%
	, rgba(99,199,197,1 )50%
	, rgba(99,199,197,1) 100%);
	background-size: cover;
	background-repeat: no-repeat;
	line-height: 15px;
	z-index:4;
	font-weight: bold;
}

.portfolio-section .portfolio-home-container .portfolio-home-left .left-top .portfolio-bg img{
	width: 330px;
	height: 230px;
}

.portfolio-section .portfolio-home-container .portfolio-home-left .middle-top .portfolio-bg img{
	width: 330px;
	height: 230px;
}

.portfolio-section .portfolio-home-container .portfolio-home-left .left-bottom .portfolio-bg img{
	width: 335px;
	height: 230px;
}

.portfolio-section .portfolio-home-container .portfolio-home-left .middle-bottom .portfolio-bg img{
	width: 330px;
	height: 230px;
}

.portfolio-home-left .portfolio-sub-title{
	display: inline-block;
	float: right;
	position: absolute;
	font-size: 15px;
	width: 200px;
	font-weight: 400;
	text-align:right;
	color: white;
	text-decoration: underline;
	bottom: 30px;
    right: 10px;
    z-index: 4;
	text-shadow: 1px 1px black;
	font-family: 'Bahnschrift';
}

.portfolio-home-left .portfolio-sub-title:hover{
	color: black;
	text-decoration: underline;
}

.portfolio-home-right{
	width:40%;
	display:inline-block;
	float: right;
	border-radius:20px;
	overflow: hidden;
}

.portfolio-home-right .portfolio-bg{
	width: 100%;
    height: 480px !important;
	position: relative;
	background-position: center;
    background-size: cover;
	background-repeat: no-repeat;
	border-radius:20px;
}

.portfolio-section .portfolio-home-container .portfolio-home-right .portfolio-bg img{
	width: auto;
	height: 480px;
}

.portfolio-home-right .portfolio-title{
	display: inline-block;
	float: right;
	position: absolute;
	bottom: 0px;
	right: 0px;
	font-size: 22px;
	width: 320px;
	text-align:right;
	color: black;
	padding-right: 20px;
	padding-left: 10px;
	padding-top: 10px;
	padding-bottom: 5px;
	border-radius: 40px 0px 0px 0px;
	background: linear-gradient(90deg
	, rgba(99,199,197,1) 0%
	, rgba(99,199,197, 1 )50%
	, rgba(99,199,197,1 ) 100%);
	background-size: cover;
	background-repeat: no-repeat;
	line-height: 15px;
	z-index:4;
	font-weight: bold;
}

.portfolio-home-right .portfolio-sub-title{
	display: inline-block;
	float: right;
	position: absolute;
	font-size: 15px;
	width: 200px;
	font-weight: 400;
	text-align:right;
	color: white;
	text-decoration: underline;
	bottom: 30px;
	right: 10px;
    z-index: 4;
	text-shadow: 1px 1px black;
	font-family: 'Bahnschrift';
}

.portfolio-home-right .portfolio-sub-title:hover{
	text-decoration: underline;
	color: black;
}

/* Our Partner */

.our-partner{
	margin-top: 60px;
	margin-bottom: 20px;
}

.our-partner h3{
	text-align: center;
	font-size: 24px;
	font-weight: bold;
}

.our-partner-row {
	display: flex;
	width: 100%;
}

.our-partner-row .item{
	width: 160px;
	margin: 10px;
} 

.our-partner-row .item img{
	width: 100%;
}

/* Blog & Video */

.blog-row{
	/*background-color: rgb(166, 221, 226);*/
	width: 100%;
	padding-top: 20px;
	padding-bottom: 20px;
	background-image: url('../img/banner artikel-new.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	display: flex;
    justify-content: space-between;
    align-items: center;
	border-radius: 20px;
}

.blog-row-left{
	width: calc(40% - 20px);
	text-align: center;
	font-size : 36px;
	vertical-align: top;
}

.blog-row-left .blog-letter{
	position: relative;
	left: 10px;
}

.blog-row .sub-letter{
	font-size: 16px;
	position: relative;
	top: -20px;
    line-height: 16px;
}

.blog-letter{
	width: 320px;
	height: auto;
}

.blog-row-right{
	display: inline-block;
	width: calc(60% - 20px);
	margin-left: 10px;
	margin-right: 10px;
}



.video-row{
	/*background-color: rgb(199, 231, 220);*/
	width: 100%;
	padding-top: 20px;
	padding-bottom: 20px;
	background-image: url('../img/banner youtube-new.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	display: flex;
    justify-content: space-between;
    align-items: center;
	border-radius: 20px;
}

.video-row .sub-letter{
	position: relative;
	top: -20px;
	font-size: 16px;
    line-height: 16px;
}

.video-row-left{
	width: calc(40% - 20px);
	text-align: center;
	font-size : 36px;
	vertical-align: top;
}

.video-row-left .video-letter{
	position: relative;
	left: 10px;
}

.video-letter{
	width: 320px;
	height: auto;
}

.video-row-right{
	width: calc(60% - 20px);
	margin-left: 10px;
	margin-right: 10px;
}


.inspiration-section .full-link{
	font-size: 16px;
	line-height: 16px;
	position: relative;
	top: -20px;
}

.inspiration-section .full-link a{
	display: inline-block;
    color: black;
    padding-right: 10px;
    padding-left: 10px;
    padding-top: 10px;
    padding-bottom: 0px;
    background: linear-gradient(90deg , rgba(99,199,197,0.5) 0% , rgba(99,199,197, 0.8 )50% , rgba(99,199,197,0.9) 100%);
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 4;
    font-weight: bold;
    text-decoration: underline;
}

.inspiration-section .mobile-blog-next{
	opacity: 1;
	cursor: pointer;
	position: absolute;
	height: 100%;
    width: 50px;
	right: 0;
	top:0;
}

.inspiration-section #blogSlide .mobile-blog-next{
	background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(219,219,219,0.65) 60%, rgba(219,219,219, 0.9 )80%, rgba(219,219,219,1) 100%);
}

.inspiration-section #videoSlide .mobile-blog-next{
	background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(255,255,255,0.65) 60%, rgba(255,255,255, 0.9 )80%, rgba(255,255,255,1) 100%);
}

.inspiration-section .mobile-blog-next i{
	position: absolute !important;
    top: 45%;
    right: 10px;
    font-size: 35px;
    font-weight: lighter;
	background-color: #ababab;
    border-radius: 180px;
	padding-right: 4px;
    padding-left: 9px;
    padding-top: 4px;
}

.inspiration-section .mobile-blog-prev{
	height: 100%;
	opacity: 1;
	cursor: pointer;
	position: absolute;
	height: 100%;
    width: 50px;
	top:0;
}

.inspiration-section #blogSlide .mobile-blog-prev{
	background: linear-gradient(90deg, rgba(219,219,219,1) 0%, rgba(219,219,219, 0.9 )20%, rgba(219,219,219, 0.65 )40%, rgba(0,0,0,0) 100%);
}

.inspiration-section #videoSlide .mobile-blog-prev{
	background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,255,255, 0.9 )20%, rgba(255,255,255, 0.65 )40%, rgba(0,0,0,0) 100%);
}

.inspiration-section .mobile-blog-prev i{
	position: absolute !important;
    top: 45%;
    left: 10px;
	background-color: #ababab;
    border-radius: 180px;
	padding-right: 9px;
    padding-left: 4px;
    padding-top: 4px;
	font-size: 35px;
    font-weight: lighter;
}

.inspiration-section{
	margin-left:0px;
	margin-right:0px;
	padding: 0px 5%;
}

.inspiration-section .blog-slider .owl-stage-outer{
	height: 276px !important;
}

.inspiration-section .video-slider .owl-stage-outer{
	height: 256px !important;
}

.inspiration-section .inspiration-item{
	position: relative;
	display:inline-block;
	vertical-align: middle;
	border:0px solid transparent;
	background:black;
}


.inspiration-section .inspiration-item.center{
	border:8px solid white;
}

.inspiration-section .inspiration-item.center .inspiration-video{
	opacity:1;
}

.inspiration-section .inspiration-item .inspiration-video{
	opacity:0.7;
}

.inspiration-section .inspiration-item.center .inspiration-blog{
	opacity:1;
}

.inspiration-section .inspiration-item .inspiration-blog{
	opacity:0.7;
}


.inspiration-section .mobile-blog-prev{
	top: 0px;
}

.inspiration-section .mobile-blog-next{
	top: 0px;
}

.inspiration-section .inspiration-item.center > div{
	height: 260px;
}

.inspiration-section .inspiration-item.center .x-bg-image{
	height: 260px;
}

.inspiration-section .inspiration-item.center .inspiration-video{
	height: 240px;
}

.inspiration-section .inspiration-item > div{
	width: 100%;
	height: 220px;
}

.inspiration-section .inspiration-item .x-bg-image{
	height: 220px;
	background-size: auto 100%;
}

.inspiration-section .inspiration-video{
	width:100%;
	height: 200px;
	vertical-align: top;
}

.inspiration-section .inspiration-video.x-bgImage-multi{
	width:100%;
	height: 200px;
	background-repeat: no-repeat;
	background-size: 100% auto;
	background-position: center;
	display: inline-block;
}


.inspiration-section .inspiration-video iframe{
	width: 100%;
	height: 200px;
	vertical-align: top;
}

.inspiration-section .inspiration-video .video-link{
	width: 100%;
	height: 200px;
	position: absolute;
	top: calc(50% - 25px);
	left:0;
	display: inline-block;
	text-align: center;
}

.inspiration-section .inspiration-video .video-link .play-icon{
	width: 72px;
    height: 52px;
}

.inspiration-section .inspiration-video .video-link:hover .play-icon{
	display: none;
}

.inspiration-section .inspiration-video .video-link .play-icon-hover{
	width: 72px;
    height: 52px;
	display: none;
}

.inspiration-section .inspiration-video .video-link:hover .play-icon-hover{
	display: inline-block;
}


.inspiration-section .inspiration-image{
	width:100%;
	padding-top: 85%;
	background-repeat: no-repeat;
	background-size: cover;
}

.inspiration-section .blog-icon{
	width: 75px;
	height: 75px;
	background-image: url('../img/icon/blog-icon-min.png');
	background-repeat: no-repeat;
	background-size: cover;
	z-index: 10;
	left: calc(50% - 36px);
	top: calc(50% - 55px);
	position: absolute;
}

.inspiration-section .blog-title{
	position: absolute;
	bottom: 20px;
	left: 10px;
	right: 10px;
	font-size: 15px;
	color: white;
	text-align: center;
	/*background-color: rgba(0,0,0,0.7);*/
	max-height: 50px;
    line-height: 16px;
    padding-top: 5px;
	padding-left: 10px;
	padding-right: 10px;
	display: none;
	font-weight: bold;
	text-shadow: 2px 2px rgba(27,27,27,0.7);
}

.inspiration-item .featured-entry p{
	overflow: hidden;
    position: relative; 
    line-height: 1.2em;
    max-height: 4em; 
    text-align: justify !important;  
    padding-right: 25px;
    padding-left: 1em;
}

.inspiration-item .featured-entry p:before{
	content: '...';
	position: absolute;
	right: 15px;
	bottom: 0;
}

.inspiration-section .featured-link {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 10;
	outline: none;
	text-decoration: none;
}

.inspiration-section .featured-overlay {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	padding: 80px 30px 30px;
	text-align: center;
	background: -moz-linear-gradient(bottom,rgba(0,0,0,.4) 0,rgba(0,0,0,0) 100%);
	background: -webkit-linear-gradient(bottom,rgba(0,0,0,.4) 0,rgba(0,0,0,0) 100%);
	background: linear-gradient(to top,rgba(0,0,0,.4) 0,rgba(0,0,0,0) 100%);
	padding-bottom: 10px;
}

.inspiration-section .featured-overlay .entry-title {
	text-align: center;
	margin: 0;
	text-transform: none;
	font-size: 22px !important;
	color: #fff;
	max-height:66px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
	background: rgba(255, 255, 255, 0.2);
}

.inspiration-section .featured-overlay .entry-title a,
.inspiration-section .featured-overlay .entry-meta,
.inspiration-section.featured-overlay .entry-meta a {
	color: #fff;
}

.inspiration-section .featured-overlay .entry-meta {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}

.inspiration-section .featured-overlay .entry-meta .more-info{
	background-color: #69b8b2;
    text-decoration: none;
    color: white;
    padding: 10px;
    text-align: center;
	font-size: 1rem;
    cursor: pointer;
	padding: 3px 14px;
	transition: all 0.2s linear;
	border-radius: 7px;
}

.inspiration-section .featured-overlay .entry-meta .more-info:hover{
	font-size: 1.1rem;
}

.inspiration-section .featured-overlay > .entry-title{
	font-size: 16px;
}

.testimoni-section{
	margin-left: 0%;
	margin-right: 0%;
}

.testimoni-section h3{
	text-align: center;
	font-size: 24px;
	font-weight: bold;
}

.testimoni-section #testimoni .owl-stage-outer{
	overflow: hidden;
}

.testimoni-section #testimoni .owl-stage{
	padding: 20px 0px;
}

.testimoni-section .testimoni-item{
    box-shadow: 1px 1px 10px #dedede;
    border-radius: 20px;
	margin-left: 20px;
    margin-right: 20px;
    padding: 20px 30px;
	background: #fff;
	height: 220px;
}

.testimoni-item .small-text{
	color: #69b8b2;
	margin-bottom: 20px;
}

.testimoni-item .content-text{
	margin-bottom: 30px;
	line-height: 16px;
	overflow: hidden;
    font-size: 14px;
    height: 50px;
    text-overflow: ellipsis;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
	display: -webkit-box;
}


.testimoni-section .testimoni-item .testimoni-profile{
	display: flex;
	flex-wrap: wrap;
	align-content: center;
	align-items: center;
}

.testimoni-section .testimoni-item .testimoni-profile .testimoni-image{
	height: 50px;
	width: auto;
	border-radius: 50px;
	margin-right: 20px;
}

.testimoni-section .testimoni-item .testimoni-profile .testimoni-name{
	font-size: 20px;
	line-height: 20px;
}

.testimoni-section .testimoni-item .testimoni-profile .testimoni-job{
	font-size: 10px;
}

.bottom-banner-section{
	padding: 0px;
}

.bottom-banner-section img{
	width: 100%;
	height: auto;
	border-radius: 20px;
}

/* about section */

.about-info-section{
	margin-left: 0%;
    margin-right: 0%;
    font-size: 16px;
    font-family: 'Inter';
    color: #6c6c6c;
    line-height: 1;
    border-top: 15px solid #f0f0f0;
}

.about-info-section .info-para li{
	font-weight: bold;
}

.about-info-section .info-para li.light{
	font-weight: 500;
}


.about-info-section .info-para li .lighten{
	font-weight: 500;
}

.about-info-section .info-para li label{
	display: inline;
}

.about-info-section .info-title{
	font-weight: bold;
    font-size: 24px;
    margin-bottom: 10px;
    margin-top: 30px;
}

.about-info-section .info-section-box{
	display: flex;
	justify-content: space-between;
}

.about-info-section .info-para{
	line-height: 25px;
}


.extra-cat-sub{
	display:flex;
	flex-wrap: wrap;
}

.extra-cat-sub .cat-column{
	width: 25%;
	background-color: #fdfdfd;
	margin-top: -7px;
	padding: 0px 5px;
}

.extra-cat-sub .cat-column a{
	text-decoration: none;
	color: #616161;
}

.extra-cat-sub .cat-column a.bold{
	font-weight: bold;
	font-size:14pt;
}

.extra-cat-sub .cat-column a.bold .extra-cat{
	margin-bottom: 5px;
	margin-top: 7px;
}

.extra-cat-sub .cat-column a.bold .extra-cat:hover{
	text-decoration: underline;
	color: #3e8d88;
}

.extra-cat-sub .cat-column a .extra-sub-cat{
	display: inline-block;
	margin-bottom: 2px;
	margin-top: 4px;
}

.extra-cat-sub .cat-column a .extra-sub-cat:hover{
	text-decoration: underline;
	color: #3e8d88;
}

.cat-column a.sub+a.sub:before{
	content: ' | ';
}

/* end about section */

@keyframes zoom-in-zoom-out {
	0% {
	  transform: scale(0.9, 0.9);
	}
	50% {
	  transform: scale(0.7, 0.7);
	}
	100% {
	  transform: scale(0.9, 0.9);
	}
  }

.float-wa{
	
	position: fixed;
	z-index: 30;
	padding: 5px 25px;
	right: 80px;
	bottom: 60px;
	border-radius: 30px;
	width: 220px;
	cursor: 220px;
	cursor: pointer;
	animation: zoom-in-zoom-out 5s ease infinite;
	
}

.float-wa .float-wa-icon img{
	width: 220px;
	height: 100%;
}

.float-wa .float-wa-text{
	font-size: 22px;
	vertical-align: sub;
}

.float-chat{
	position: fixed;
	right: 54px;
	bottom: 29px;
	width: 280px;
	z-index: 30;
	padding: 5px 25px;
}

.float-chat .chat-btn{
	width: 100%;
	height: auto;
}

/* chat component*/

.total-blackout-chat{
	position: fixed;
    top: 0;
	bottom: 0;
    left:0;
    right:0;
    background-color: rgba(0, 0, 0, 0.55);
    z-index: 25;
	display: none;
}

.chat-container{
	display:flex;
	flex-wrap:wrap;
	justify-content: flex-end;
	align-items: flex-end;
	height: 100%;
	flex-direction: column;
}

.chat-content{
	width: 855px;
	display: flex;
	padding: 20px;
	background: white;
	border-radius: 20px;
	margin-top: 50px;
	margin-right: 320px;
	margin-bottom: 20px;
	padding-bottom: 20px;
	overflow: hidden;
}

.chat-content .chat-left{
    display: flex;
    flex-direction: column;
    width: 37%;
    margin-right: 20px;
}

.chat-content .chat-left .chat-left-top{
    display: flex;
    justify-content: space-between;
    padding: 10px;
}

.chat-content .chat-left .chat-left-top .chat-title{
    font-size: 20px;
    font-weight: bold;
    color: #aeaeae;
}

.chat-content .chat-left .chat-left-top .chat-setting img{
    width: 30px;
}

.chat-content .chat-left .chat-search-filter{
    display: flex;
    justify-content: space-between;
    padding: 10px;
}

.chat-content .chat-left .chat-search-filter .chat-search{
    position: relative;
	width: 100%;
	overflow: hidden;
	border-radius: 10px;
	border: 1px solid #dedede;
}

.chat-content .chat-left .chat-search-filter .chat-search:focus-within{
    outline: 2px solid #dedede;
}

.chat-content .chat-left .chat-search-filter .chat-search #search{
    width: 100%;
	border-radius: 20px 0 0 20px;
	padding: 5px 10px 5px 25px;
	border: 0px solid black;
}

.chat-content .chat-left .chat-search-filter .chat-search #search:focus-within{
    outline: none;
}

.chat-content .chat-left .chat-search-filter .chat-search .icon{
    position: absolute;
	right: 0px;
	background: #dedede;
	top:0;
	bottom:0;
	padding: 0px 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	padding-bottom: 4px;
	color: white;
	cursor: pointer;
}

.chat-content .chat-left .chat-content-left {
    display: flex;
    flex-direction: column;
    padding: 10px;
}

.chat-content-left .chat-user{
    display: flex;
    margin-bottom: 30px;
    border-radius: 10px;
}

.chat-content-left .chat-user .img-user{
    margin-right: 15px;
}

.chat-content-left .chat-user .img-user img{
    width: 50px;
    border-radius: 50px;
}

.chat-content-left .chat-user .content-user-list{
    display: flex;
    flex-direction: column;
    margin-top: 5px;
    margin-right: 45px;
}

.chat-content-left .chat-user .content-user-list .top-user{
    display: flex;
}

.chat-content-left .chat-user .content-user-list .top-user .name-user{
    margin-right: 15px;
    font-size: 16px;
}

.chat-content-left .chat-user .content-user-list .top-user .sold-user{
    background: #80D0C7;
    padding-left: 10px;
    padding-right: 10px;
    font-size: 14px;
    color: #f7f7f7;
    margin-top: 3px;
}

.chat-content-left .chat-user .content-user-list .bot-user{
    font-size: 13px;
}

.chat-content-left .chat-user .time-user{
    font-size: 10px;
    color: #aeaeae;
    margin-top: 10px;
}

.chat-content .chat-right{
    display: flex;
    flex-direction: column;
    width: 50%;
    background: white;
    border-radius: 20px;
	margin-top: 45px;
	margin-left: 20px;
}

.chat-content .chat-right .img-chat-right{
	margin-top: 100px;
	margin-right: auto;
	margin-left: auto;
}

.chat-content .chat-right .img-chat-right img{
	width: 130px;
}

.chat-content .chat-right .title-chat-right{
	font-size: 24px;
	text-align: center;
	font-weight: bold;
	margin-bottom: 10px;
}

.chat-content .chat-right .text-chat-right{
	text-align: center;
	color: #aeaeae;
}

.chat-content .chat-right .sub-text-chat-right{
	text-align: center;
	color: #aeaeae;
}

.chat-box-product .chat-product-list .detail-product .name-product{
    font-weight: bold;
}

.chat-box-product .chat-product-list .detail-product .sub-name-product{
    font-size: 14px;
    color: #aeaeae;
}

.chat-box-product .chat-product-list .detail-product .price-product{
    color: #ff0400;
}

.chat-box-product .chat-product-list .detail-product .sold-product{
    color: #aeaeae;
    font-size: 14px;
}

.chat-box-product .cart-buy{
    display: flex;
}

.chat-box-product .cart-buy .cart{
    margin-right: 15px;
    background: #a6dde2;
    color: black;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 30px;
    padding-right: 30px;
    text-decoration: none;
    border-radius: 10px;
}

.chat-box-product .cart-buy .cart a{
    padding-left: 20px;
    padding-right: 20px;
}

.chat-box-product .cart-buy .buy{
    background: #3e8d88;
    color: white;
    text-decoration: none;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 30px;
    padding-right: 30px;
    border-radius: 10px;
}

.chat-content .chat-right .chat-box-buyer{
    display: flex;
    background: #dedede;
    border-radius: 10px;
    margin-left: 90px;
    padding: 10px;
    margin-right: 20px;
    margin-bottom: 20px;
    font-size: 13px;
}

.chat-content .chat-right .chat-box-buyer .text-chat-box-buyer{
   margin-right: 60px;
}

.chat-content .chat-right .chat-box-buyer .icon-chat-box-buyer {
    margin-right: 10px;
}

.chat-content .chat-right .chat-box-buyer .icon-chat-box-buyer img{
    width: 13px;
}

.chat-box-buyer .time-chat-box-buyer{
    color: #aeaeae;
    font-size: 13px;
}

.chat-box-seller-system{
    display: flex;
    flex-direction: column;
    background: #f7f7f7;
    border-radius: 10px;
    padding: 10px;
    margin-right: 45px;
    margin-left: 20px;
    margin-bottom: 20px;
    font-size: 13px;
}

.chat-box-seller-system .time-system-chat-box-seller-system{
    color: #aeaeae;
    display: flex;
    justify-content: space-between;
}

.chat-box-seller-system .time-system-chat-box-seller-system .time-chat-box-seller-system{
    font-size: 13px;
}

.chat-box-seller{
    display: flex;
    justify-content: space-between;
    background: #f7f7f7;
    border-radius: 10px;
    padding: 10px;
    margin-left: 20px;
    margin-right: 45px;
    margin-bottom: 20px;
    font-size: 13px;
}

.chat-box-seller .time-cbs{
    color: #aeaeae;
    font-size: 13px;
}

.chat-auto-text{
    display: flex;
    margin-left: 20px;
    margin-bottom: 20px;
}

.chat-auto-text .auto-text-ready{
    border: 1px solid #a6dde2;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 10px;
    margin-right: 5px;
}

.chat-auto-text .auto-text-ready:hover{
    background: #3e8d88;
    color: white;
}

.chat-auto-text .auto-text-sent{
    border: 1px solid #a6dde2;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 10px;
    margin-right: 5px;
}

.chat-auto-text .auto-text-sent:hover{
    background: #3e8d88;
    color: white;
}

.chat-auto-text .auto-text-thank{
    border: 1px solid #a6dde2;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 10px;
    margin-right: 5px;
}

.chat-auto-text .auto-text-thank:hover{
    background: #3e8d88;
    color: white;
}

.chat-input{
    margin-bottom: 30px;
    margin-right: 20px;
    display: flex;
    justify-content: space-between;
}

.chat-input .input{
    display: flex;
}

.chat-input .input .input-icon img{
    width: 20px;
    position: relative;
    left: 25px;
    top: 4px;
}

.chat-input .input .input-text input{
    border-radius: 10px;
    width: 345px;
    height: 35px;
    border: 1px solid #a6dde2;
    margin-left: 30px;
}

.chat-input .input .input-text input::placeholder{
    margin-left: 50px;
}

.chat-input .input .input-plus img{
    width: 20px;
    position: relative;
    right: 27px;
    top: 4px;
}

.chat-input .send{

}

.chat-input .send img{
    width: 30px;
    height: 30px;
    position: relative;
    top: 2px;
    left: 3px;
}



.footer{
    min-height: 300px;
    background-color: #49A7A1;
    padding-top: 30px;
    color: #2d2d2d;
    position: relative;
    border-top: 2px solid #49A7A1;
    display: flex;
    flex-wrap: wrap;
}

.footer-left{
	display: flex;
	width: 50%;
	vertical-align:top;
}

.footer-left .footer-menu{
	display: flex;
	justify-content: space-around;
	width: 100%;
	padding: 0px 20px;
}

.footer-menu .footer-page{
	display: flex;
	flex-direction: column;
}

.footer-page .footer-page-item{
	margin-bottom: 30px;
}

.footer-page .footer-page-item a{
	color: #fff;
	text-decoration: none;
	font-size: 12pt;
}

.footer-page .footer-page-item a:hover{
	text-decoration: underline;
}

.footer-menu .footer-cat{
	display: flex;
	flex-direction: column;
}

.footer-cat .footer-cat-box{
	display: flex;
	flex-direction: column;
}

.footer-cat-box .footer-cat-item{
	margin-bottom: 30px;
}

.footer-cat-box .footer-cat-item a{
	color: #fff;
	text-decoration: none;
	font-size: 12pt;
}

.footer-cat-box .footer-cat-item a:hover{
	text-decoration: underline;
}

.footer-right{
	width: 50%;
    display: flex;
    flex-direction: column;
    padding: 0px 20px;
}

.footer-right .footer-open{
	display: flex;
    width: 100%;
    padding: 0px 10% 0px 0%;
    margin-bottom: 15px;
}

.footer-open .footer-open-l{
	background: #fff;
    color: #49A7A1;
    padding: 20px 50px;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    width: 35%;
    font-size: 14pt;
    font-weight: bold;
    text-align: center;
}

.footer-open .footer-open-r{
	display: flex;
    flex-direction: column;
    width: 65%;
    border: 1px solid #fff;
    height: 100%;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}

.footer-open .footer-open-r .footer-open-r-t{
	height: 50%;
    font-size: 12pt;
    text-align: center;
    align-items: center;
    display: flex;
    justify-content: center;
    color: #fff;
}

.footer-open .footer-open-r .footer-open-r-b{
	height: 50%;
    border-top: 1px solid #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 12pt;
    color: #fff;
}

.footer-right .footer-service{
	display: flex;
    flex-direction: column;
    margin-bottom: 15px;
}

.footer-service .footer-service-title{
	font-size: 14pt;
    color: #fff;
    font-weight: bold;
}

.footer-service .footer-service-content{
	color: #fff;
	font-size: 12pt;
}

.footer-right .footer-sosmed-box{
	display: flex;
	justify-content: space-between;
	margin-top: 20px;
}

.footer-right .footer-sosmed{
	width: 50%;
}

.footer-sosmed .footer-sosmed-title{
	font-size: 14pt;
	color: #fff;
	font-weight: bold;
}

.footer-sosmed .footer-sosmed-content{
	display: flex;
	margin-left: -10px;
}

.footer-right .footer-application{
	display: flex;
	flex-direction: column;
	width: 50%;
}

.footer-application .footer-application-title{
	font-size: 14pt;
	color: #fff;
	font-weight: bold;
}

.footer-application .footer-application-content{
	display: flex;
}

.footer-application-content .footer-application-item{
	margin-right: 20px;
	margin-top: 5px;
}

/* start pop ads 1*/
.total-blackout01{
	position: fixed;
    top: 0;
	bottom: 0;
    left:0;
    right:0;
   /*background-color: rgba(0, 0, 0, 0.55);*/
    z-index: 25;
	display: none;
}

.total-blackout01 .mask-01{
	position: fixed;
    top: 0px;
	height: 96px;
    left:0;
    right:0;
	background-color: rgba(0, 0, 0, 0.55);
	-webkit-mask: 
     radial-gradient( circle at 87px 53px,transparent 29px, black 30px); 
	-webkit-mask-size:100%; /* each one half the size */
	-webkit-mask-repeat: no-repeat;
}

.total-blackout01 .mask-02{
	position: fixed;
    top: 95px;
    height: 50px;
    left:-30px;
    right:0;
	background: 
	linear-gradient(90deg,
		rgba(0,0,0,0.55) 45px,
		rgba(0,0,0,0) 45px,
		rgba(0,0,0,0) 140px,
		rgba(0,0,0,0.55) 140px,
		rgba(0,0,0,0.55) 100%
	);
}

.total-blackout01 .mask-blackout{
	position: fixed;
    top: 144px;
	bottom: 0;
    left:0;
    right:0;
	background-color: rgba(0, 0, 0, 0.55);
}


.pop-ads-1-container{
	position: relative;
	z-index: 27;
	display:flex;
	flex-wrap:wrap;
	height: 100%;
	flex-direction: column;
	position: relative;
	top: 150px;
	left: 50px;
}

.pop-ads-1{
	width: 400px;
}

.pop-ads-1 img{
	width: 400px;
}

/* start pop ads 2 */
.total-blackout02{
	position: fixed;
    top: 0;
	bottom: 0;
    left:0;
    right:0;
    z-index: 25;
	display: none;
}

.total-blackout02 .mask-01{
	position: fixed;
    top: 0px;
	height: 95px;
    left:0;
    right:0;
	background-color: rgba(0, 0, 0, 0.55);
}

.total-blackout02 .mask-02{
	position: fixed;
    top: 95px;
    height: 50px;
    left:0;
    right:0;
	background: 
	linear-gradient(90deg,
		rgba(0,0,0,0.55) 925px,
		rgba(0,0,0,0) 925px,
		rgba(0,0,0,0) 1077px,
		rgba(0,0,0,0.55) 1077px,
		rgba(0,0,0,0.55) 100%
	);
}

.total-blackout02 .mask-blackout{
	position: fixed;
    top: 145px;
	bottom: 0;
    left:0;
    right:0;
	background-color: rgba(0, 0, 0, 0.55);
}

.pop-ads-2-container{
	position: relative;
	z-index: 27;
	display:flex;
	flex-wrap:wrap;
	align-items: center;
	height: 100%;
	flex-direction: column;
	position: relative;
	top: 145px;
	left: 280px;
}

.pop-ads-2{
	width: 400px;
}

.pop-ads-2 img{
	width: 400px;
}

/* start pop ads 3*/

.total-blackout03{
	position: fixed;
    top: 0;
	bottom: 0;
    left:0;
    right:0;
    z-index: 25;
	display: none;
}


.total-blackout03 .mask-01{
	position: fixed;
    top: 0px;
	height: 28px;
    left:0;
    right:0;
	background-color: rgba(0, 0, 0, 0.55);
}

.total-blackout03 .mask-02{
	position: fixed;
    top: 28px;
    height: 30px;
    left:0;
    right:0;
	background: 
	linear-gradient(90deg,
		rgba(0,0,0,0.55) 1082px,
		rgba(0,0,0,0) 1082px,
		rgba(0,0,0,0) 1208px,
		rgba(0,0,0,0.55) 1208px,
		rgba(0,0,0,0.55) 100%
	);
}

.total-blackout03 .mask-blackout{
	position: fixed;
    top: 58px;
	bottom: 0;
    left:0;
    right:0;
	background-color: rgba(0, 0, 0, 0.55);
}

.pop-ads-3-container{
	position: relative;
	z-index: 27;
	display:flex;
	flex-wrap:wrap;
	justify-content: flex-end;
	height: 100%;
	position: relative;
	top: 80px;
	right: 50px;
}

.pop-ads-3{
	width: 400px;
}

.pop-ads-3 img{
	width: 400px;
}

/* start pop ads 4*/
.total-blackout04{
	position: fixed;
    top: 0;
	bottom: 0;
    left:0;
    right:0;
    background-color: rgba(0, 0, 0, 0.55);
    z-index: 25;
	display: none;
}

.pop-ads-4-container{
	display:flex;
	flex-wrap:wrap;
	justify-content: center;
	align-items: center;
	height: 100%;
	flex-direction: column;
}

.pop-ads-4{
	width: 400px;
    background: #fff;
    border-radius: 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 40px;
}

.pop-ads-4-img{
	width: 50px;
	margin-bottom: 10px;
}

.pop-ads-4-img img{
	width: 100%;
}

.pop-ads-4-text{
	text-align: center;
    font-weight: 500;
    margin-bottom: 20px;
}

.pop-ads-4-text span{
	color: #49a7a1;
    font-weight: bold;
}

.pop-ads-4-btn a{
	text-align: center;
    text-decoration: none;
    color: #fff;
    background: #49a7a1;
    padding: 7px 50px;
    border-radius: 20px;
}





/* start pop ads 5 */

.total-blackout05{
	position: fixed;
    top: 0;
	bottom: 0;
    left:0;
    right:0;
    background-color: rgba(0, 0, 0, 0.55);
    z-index: 25;
	display: none;
}

.pop-ads-5-container{
	display:flex;
	flex-wrap:wrap;
	justify-content: center;
	align-items: center;
	height: 100%;
	flex-direction: column;
}

.pop-ads-5{
	width: 400px;
}

.pop-ads-5 img{
	width: 400px;
}



/* start pop ads 6*/
.total-blackout06{
	position: fixed;
    top: 0;
	bottom: 0;
    left:0;
    right:0;
    background-color: rgba(0, 0, 0, 0.55);
    z-index: 25;
	display: none;
}

.pop-ads-6-container{
	display:flex;
	flex-wrap:wrap;
	justify-content: center;
	align-items: center;
	height: 100%;
	flex-direction: column;
}

.pop-ads-6{
	width: 400px;
}

.pop-ads-6 img{
	width: 400px;
}

/* start pop ads 7*/
.total-blackout07{
	position: fixed;
    top: 0;
	bottom: 0;
    left:0;
    right:0;
    background-color: rgba(0, 0, 0, 0.55);
    z-index: 25;
	display: none;
}

.pop-ads-7-container{
	display:flex;
	flex-wrap:wrap;
	justify-content: center;
	align-items: center;
	height: 100%;
	flex-direction: column;
}

.pop-ads-7{
	width: 400px;
}

.pop-ads-7 img{
	width: 400px;
}

/* start pop ads 8*/
.total-blackout08{
	position: fixed;
    top: 0;
	bottom: 0;
    left:0;
    right:0;
    background-color: rgba(0, 0, 0, 0.55);
    z-index: 25;
	display: none;
}

.pop-ads-8-container{
	display:flex;
	flex-wrap:wrap;
	justify-content: center;
	align-items: center;
	height: 100%;
	flex-direction: column;
}

.pop-ads-8{
	width: 400px;
}

.pop-ads-8 img{
	width: 400px;
}

/* start pop ads 9*/
.total-blackout09{
	position: fixed;
    top: 0;
	bottom: 0;
    left:0;
    right:0;
    background-color: rgba(0, 0, 0, 0.55);
    z-index: 25;
	display: none;
}

.pop-ads-9-container{
	display:flex;
	flex-wrap:wrap;
	justify-content: center;
	align-items: center;
	height: 100%;
	flex-direction: column;
}

.pop-ads-9{
	width: 400px;
}

.pop-ads-9 img{
	width: 400px;
}

/* end pop ads 9 */

/* start pop ads 11*/
.total-blackout11{
	position: fixed;
    top: 0;
	bottom: 0;
    left:0;
    right:0;
    background-color: rgba(0, 0, 0, 0.55);
    z-index: 25;
	display: none;
}

.pop-ads-11-container{
	display:flex;
	flex-wrap:wrap;
	justify-content: center;
	align-items: center;
	height: 100%;
	flex-direction: column;
}

.pop-ads-11{
	width: 400px;
}

.pop-ads-11 img{
	width: 400px;
}

/* end pop ads 11 */

/* faq */

.faq-container{
	padding: 50px 7%;
}

.faq-container-title{
	display: flex;
    justify-content: center;
    font-size: 25pt;
    font-weight: bold;
    margin-bottom: 30px;
}

.faq-list{
	display: flex;
    flex-direction: column;
}

.faq-list .faq-title{
	font-weight: bold;
	margin-bottom: 20px;
}

.faq-list .faq-item{
	margin-bottom: 20px;
}

.faq-item .faq-item-content{
	display: flex;
	flex-direction: column;
}

.faq-item-content .faq-item-sub-title{
	font-weight: bold;
	margin-bottom: 20px;
}

.faq-item-content .faq-item-main{
	font-size: 11pt;
}

/* end faq */

/* contact */

/* end contact */

/* about */

	.about-page{
		display: flex;
		flex-direction: column;
	}

	.about-top {
		display: flex;
		align-items: center;
		flex-direction: column;
		padding: 50px 6% 80px 6%;
		border: 1px solid #c0c0c0;
	}

	.about-banner {
		text-align: center;
		margin-bottom: 50px;
		width: 100%;
	}

	.about-banner img {
		width: 100%;
		border-radius: 20px;
		object-fit: cover;
	}

	.about-text {
    display: flex;
    align-items: flex-start;
    width: 100%;
}

.about-text-item {
    flex: 1;
    padding: 10px 20px;
    line-height: 40px;
}

.about-text-item-content {
    font-size: 14pt;
    color: #000;
     text-align: justify;
    text-align-last: justify;
	line-height: 28px;
}

.about-text-item-title {
    color: #49a7a1;
    font-weight: bold;
    font-size: 25pt;
    margin-bottom: 18px;
}

.about-text-item-content span {
    font-weight: bold;
}




	.about-solution {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		padding: 50px 6%;
		background: #fff;
		border-bottom: 1px solid #c0c0c0;
		margin-top: 30px;
	}

	.about-solution .about-image {
		display: flex;
		flex-direction: column;
		align-items: center;
		width: 100%;
	}

	.about-image .about-image-top {
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 20px;
		width: 100%;
		margin-bottom: 40px;
	}

	.about-image-item {
		flex: 1;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.about-image-item img {
		width: 100%;
		height: 100%;
		border-radius: 16px;
		object-fit: cover;
		box-shadow: 0 2px 10px rgba(0,0,0,0.08);
		transition: transform 0.3s ease;
	}

	.about-image-item img:hover {
		transform: scale(1.03);
	}

	.image-item-column {
		display: flex;
		flex-direction: column;
		gap: 20px;
		width: 100%;
	}

	.image-item-column img {
		width: 100%;
		height: auto;
		border-radius: 16px;
		object-fit: cover;
	}

	.about-image-bot {
		display: flex;
		justify-content: center;
	}

	.about-image-bot img {
		width: 260px;
		height: auto;
		margin-top: 10px;
	}

	.about-solution-text{
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		padding: 30px 0px;
		margin-bottom: 50px;
	}

	.about-solution-text-title{
		color: #000;
		font-weight: bold;
		font-size: 27pt;
		margin-bottom: 20px;
	}

	.about-solution-text-title span{
		color: #49a7a1;
	}

	.about-solution-text-content{
		display: flex;
		justify-content: center;
		align-items: center;
		text-align: center;
		font-size: 15pt;
	}

	.about-solution-service{
		display: flex;
		flex-direction: column;
		width: 100%;
	}

	.about-solution-service-title{
		text-align: center;
		font-size: 25pt;
		margin-bottom: 100px;
	}

	.about-solution-service-title span{
		font-weight: bold;
	}

	.about-solution-service-content{
		display: flex;
		flex-direction: column;
	}

	.about-solution-service-list{
		display: flex;
		justify-content: center;
		gap: 40px;
		margin-bottom: 50px;
	}

	.about-solution-service-item{
		display: flex;
		flex-direction: column;
		background: #f7f7f7;
		border-radius: 20px;
		height: 520px;
		box-shadow: 1px 1px 1px 1px #f7f7f7;
		width: 25%;
	}

	.about-solution-service-item .service-item-img{
		width: auto;
		align-items: center;
		text-align: center;
		display: flex;
		justify-content: center;
		padding: 15px;
	}

	.about-solution-service-item .service-item-img img{
		width: 100%;
		border-radius: 20px;
	}

	.service-item-title{
		text-align: center;
		font-size: 15pt;
		margin-top: 10px;
		color: #49a7a1;
		font-weight: bold;
		margin-bottom: 10px;
		padding: 10px;
		height: 70px;
	}

	.service-item-txt{
		text-align: center;
		padding: 0px 25px;
		margin-top: 10px;
	}

	.about-management{
		padding: 50px 6%;
		width: 100%;
		display: flex;
		flex-direction: column;
		padding-bottom: 100px;
		border-bottom: 1px solid #c0c0c0;
	}

	.about-management-leader{
		display: flex;
		flex-direction: column;
		margin-bottom: 100px;
	}

	.management-leader-top{
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 25pt;
		font-weight: 600;
		margin-bottom: 50px;
		color: #000;
	}

	.management-leader-content{
		display: flex;
	}

	.management-leader-list{
		display: flex;
		justify-content: space-between;
		width: 100%;
	}

	.management-leader-item{
		display: flex;
		flex-direction: column;
		width: 25%;
		padding: 20px;
		cursor: pointer;
	}

	.leader-item-img{
		width: 100%;
		position: relative;
	}

	.leader-item-img img{
		width: 100%;
	}

	.leader-item-txt{
		position: absolute;
		bottom: 0;
		width: 100%;
		background: #ffffffde;
		border-bottom-left-radius: 10px;
		border-bottom-right-radius: 10px;
		text-align: center;
		padding: 10px;
	}

	.management-leader-item:hover .leader-item-txt{
		background: #49a7a190;
	}

	.management-leader-item:hover .leader-item-txt .leader-item-txt-main{
		color: #fff;
		font-weight: 600;
	}

	.management-leader-item:hover .leader-item-txt .leader-item-txt-sub{
		color: #fff;
	}

	.leader-item-txt-main{
		font-size: 14pt;
		color: #49a7a1;
		font-weight: 600;
	}

	.leader-item-txt-sub{
		color: #000;
		font-size: 10pt;
	}

	.about-management-team{
		display: flex;
		flex-direction: column;
	}

	.management-team-top{
		display: flex;
		justify-content: center;
		align-items: center;
		margin-bottom: 50px;
		font-size: 25pt;
		color: #000;
		font-weight: 600;
	}

	.managament-team-content{
		display: flex;
		flex-direction: column;
	}

	.management-team-list{
		display: flex;
		justify-content: space-between;
		width: 100%;
	}

	.management-team-item{
		display: flex;
		flex-direction: column;
		width: 25%;
		padding: 20px;
		cursor: pointer;
	}

	.team-item-img{
		width: 100%;
		position: relative;
	}

	.team-item-img img{
		width: 100%;
	}

	.team-item-txt{
		position: absolute;
		bottom: 0;
		width: 100%;
		background: #ffffffde;
		border-bottom-left-radius: 10px;
		border-bottom-right-radius: 10px;
		text-align: center;
		padding: 10px;
	}

	.management-team-item:hover .team-item-txt{
		background: #49a7a190;
	}

	.management-team-item:hover .team-item-txt .team-item-txt-main{
		color: #fff;
		font-weight: 600;
	}

	.management-team-item:hover .team-item-txt .team-item-txt-sub{
		color: #fff;
	}

	.team-item-txt-main{
		font-size: 14pt;
		color: #49a7a1;
		font-weight: 600;
	}

	.team-item-txt-sub{
		color: #000;
		font-size: 10pt;
	}

	.team-item-txt-end{
		background: #ededed;
		height: 100%;
		border-radius: 20px;
		padding: 50px;
		font-size: 17pt;
		color: #49a7a1;
		font-weight: 600;
	}




/* end about */

/* showroom */
.showroom-page{
	display: block;
	padding: 86px;
}
.showroom-page .showroom-banner{
	display: block;
	width: 100%;
}
.showroom-page .showroom-banner img{
 	width: 100%;
}

.showroom-page .section-showroom{
	display: block;
    padding: 0 114px 0 114px;
    margin-top: 10px;
    width: 100%;
}
.section-showroom .map-container{
	display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 300px;

}
#showroom-map{
	width: 100%;
	height: 280px;
}

.section-showroom .addres-complete{

}
.section-showroom .image-container{
	display: block;
    margin-top: 30px;
}

#showroomSmallSlider .owl-item{
	overflow: hidden;
	border-radius: 20px;
}

#showroomSmallSlider .banner-nav{
    display: flex;
    justify-content: space-between;
    position: absolute;
    top: 35%;
    width: 100%;
}

#showroomSmallSlider .banner-nav .banner-prev{
	margin-left: -35px;
    font-size: 50px;
}

#showroomSmallSlider .banner-nav .banner-next{
	margin-right: -35px;
    font-size: 50px;
}

.mobile-blog-prev{
	opacity: 1;
    background: linear-gradient(90deg, rgba(252,252,255,0.9) 0%, rgba(255,255,255, 0.7 )20%, rgba(0,0,0,0) 100%);
	cursor: pointer;
	position: absolute;
	height: 100%;
    width: 50px;
	top:0;
}

.mobile-blog-prev > i{
	position: absolute !important;
    top: 45%;
    left: 10px;
	color: rgba(0,0,0,0.7);
    font-size: 35px;
    font-weight: lighter;
}

.mobile-blog-next{
	opacity: 1;
    background: linear-gradient(90deg, rgba(0,0,0,0) 0%, rgba(255,255,255,0.7) 60%, rgba(255,255,255, 0.8 )80%, rgba(252,252,255,0.9) 100%);
	cursor: pointer;
	position: absolute;
	height: 100%;
    width: 50px;
	right: 0;
	top:0;
}

.mobile-blog-next > i{
	position: absolute !important;
    top: 45%;
    right: 10px;
	color: rgba(0,0,0,0.7);
    font-size: 35px;
    font-weight: lighter;
}

.section-showroom  .image-slider{
	position:fixed;
	bottom:0;
	left:0;
	right:0;
	top: 145px;
	z-index: 150;
	display:none;
}

.section-showroom  .image-slider .blackout{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right: 0;
	background-color: rgba(0,0,0,0.6);
	z-index: 151;
}

.section-showroom  .image-slide-container{
	margin-top: 30px;
	background: rgba(0,0,0,0.7);
}

.section-showroom  .showroom-slide-image{
	width: 100%;
	height: 320px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

.mobile-banner-next{
	opacity: 1;
    background: transparent;
	cursor: pointer;
	position: absolute;
	height: 100%;
    width: 100px;
	right: 0;
	top:0;
}


.mobile-banner-prev{
	opacity: 1;
    background: transparent;
	cursor: pointer;
	position: absolute;
	height: 100%;
    width: 100px;
	top:0;
}

a.c-gfTosca {
    color: #63c7c5 !important;
}
/* end showroom */

/* contact us */
.contact-page{
	display: block;
    position: relative;
    padding: 50px;
}
.contact-page .contact-title{
	display: flex;
    justify-content: space-evenly;
    font-size: 37px;
    font-weight: 800;
    margin-bottom: 10px;
}

.contact-page .contact-banner{
	width: 100%;
    height: auto;
    margin-bottom: 17px;
}
.contact-page .contact-banner img{
	width: 100%;
    height: auto;
}
.contact-page .contact-banner .contact-banner-text{
	position: relative;
    text-align: center;
    top: 118px;
}

.contact-page .contact-cs{

}

.contact-cs .contact-cs-title{
	margin-bottom: 10px;
}
.contact-cs .contact-cs-time-telp{
	font-weight: bold;
    margin-bottom: 10px;
}
.contact-cs .contact-cs-location{
	font-weight: 800;
    margin-bottom: 10px;
}
.contact-cs-time-telp .contact-cs-time{

}
.contact-cs-time-telp .contact-cs-contact{

}
.contact-cs-time-telp .contact-cs-hotline{

}

.contact-cs-location .contact-cs-location-title{
	
}
.contact-cs-location .contact-cs-location-address{

}

.contact-cs-box{

}
.contact-cs-box .contact-cs-text{
	margin-bottom: 10px;
}
.contact-cs-form {

}
.contact-cs-form .row-form{
 display: flex;
 flex-direction: row;
 column-gap: 20px;
}
.row-form .form-group{
 width: 100%;
 margin-bottom: 20px;
}
.button-action{
	display: flex;
    flex-direction: column;
    text-align: center;
    align-items: center;
    margin-top: 30px;
}
.button-action .btn-submit{
	width: 200px;
    height: 40px;
    border-radius: 7px;
    background: #268999;
    border: none;
    color: white;
}

.button-action .back-to-home a{
	text-decoration: none;
	color:#268999 ;
}


/* end contact us */

/* catalog page */

.catalog-page{
	display: flex;
	flex-direction: column;
	padding: 70px 6%;
}

.catalog-page .catalog-top{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	margin-bottom: 70px;
}

.catalog-top .top-main{
	font-size: 25pt;
	font-weight: bold;
}

.catalog-top .top-sub{
	font-size: 16pt;
}

.catalog-page .catalog-content{
	display: flex;
	flex-direction: column;
}

.catalog-content .catalog-box{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.catalog-box .catalog-item{
	display: flex;
	justify-content: center;
	flex-direction: column;
	cursor: pointer;
	margin-left: 20px;
	margin-right: 20px;
	margin-bottom: 20px;
}

.catalog-item {
    position: relative;
    overflow: hidden;
}

.catalog-img {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
	margin-bottom: 20px;
	width: 400px;
	border-radius: 20px;
	box-shadow: 1px 2px 2px 1px #c0c0c0;
}

.catalog-img img {
    transition: all 0.3s ease-in-out;
    width: 100%;
    display: block;
	border-radius: 20px;
}

.catalog-img:hover img {
	filter: opacity(0.5);
	filter: drop-shadow(#444);
}

.catalog-download-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: rgba(209, 209, 209, 0.9);
    color: #000;
    padding: 10px 50px;
    border-radius: 5px;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

.catalog-download-btn:hover{
	background-color: rgba(22, 21, 21, 0.9);
	color: #fff;
}

.catalog-img:hover .catalog-download-btn {
    opacity: 1;
}

/* Efek animasi hover */

.catalog-img:hover::before, 
.catalog-img:hover::after {
    display: block;
    content: '';
    position: absolute;
    background: #FDA8CF;
    border-radius: 75px;
    z-index: -1;
    animation: 1s clockwise infinite;
}

.catalog-img:hover:after {
    background: #F3CE5E;
    animation: 2s counterclockwise infinite;
}

@keyframes clockwise {
    0% { top: -5px; left: 0; }
    12% { top: -2px; left: 2px; }
    25% { top: 0; left: 5px; }
    37% { top: 2px; left: 2px; }
    50% { top: 5px; left: 0; }
    62% { top: 2px; left: -2px; }
    75% { top: 0; left: -5px; }
    87% { top: -2px; left: -2px; }
    100% { top: -5px; left: 0; }
}

@keyframes counterclockwise {
    0% { top: -5px; right: 0; }
    12% { top: -2px; right: 2px; }
    25% { top: 0; right: 5px; }
    37% { top: 2px; right: 2px; }
    50% { top: 5px; right: 0; }
    62% { top: 2px; right: -2px; }
    75% { top: 0; right: -5px; }
    87% { top: -2px; right: -2px; }
    100% { top: -5px; right: 0; }
}


.catalog-item .catalog-text{
	text-align: center;
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
}

.catalog-text .catalog-title{
	font-weight: bold;
	font-size: 18px;
}

.catalog-text .catalog-date{
	font-size: 15px;
}

.catalog-page .catalog-tips{
	margin-top: 30px;
	margin-bottom: 30px;
    background: #F0F0F0;
    padding: 50px;
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.catalog-tips .tips-l{
	width: 50%;
    font-size: 50px;
    font-weight: bold;
}

.catalog-tips .tips-r{
	width: 50%;
    
}

.catalog-tips .tips-r a{
	color: #49A7A1;
}

.catalog-page .catalog-excess{
	display: flex;
	flex-direction: column;
	margin-top: 50px;
	margin-bottom: 50px;
}

.catalog-excess .excess-title{
	display: flex; 
	justify-content: center;
	margin-bottom: 30px;
	font-weight: bold;
	font-size: 22px;
}

.catalog-excess .excess-title a{
	text-decoration: none;
	color: #49A7A1;
	margin-left: 5px;
}

.excess-content {
	display: flex;
	flex-direction: column;
}

.excess-accordion {
	border-radius: 4px;
	overflow: hidden;
  }

.accordion-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	cursor: pointer;
}

.accordion-header .accordion-header-item{
    padding: 50px 20px;
    border: 1px solid #c0c0c0;
    width: 20%;
    height: 100px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.accordion-header-item.active{
	background: #49A7A1;
	color: #fff;
}

.accordion-header-item:hover{
	background: #49A7A1;
	color: #fff;
}

.accordion-content {
	text-align: center;
}

.accordion-content-item{
	display: none;
	font-size: 18px;
	padding: 40px;
    border: 1px solid #c0c0c0;
}

.catalog-service{
	display: flex;
	flex-direction: column;
	margin-bottom: 100px;
}

.catalog-service .catalog-service-item{
	display: flex;
	flex-direction: column;
	margin-bottom: 20px;
}

.catalog-service-item .catalog-service-title{
	font-weight: bold;
	font-size: 20px;
	margin-bottom: 5px;
}

.catalog-popup{
	position: absolute;
    top: 0;
    z-index: 32;
    background: #000000aa;
    width: 100%;
    height: 100%;
    bottom: 0;
    left: 0;
    right: 0;
	display: none;
}

.catalog-popup-container{
	width: 100%;
	height: 100%;
	display: grid;
}

.catalog-popup-content{
	display: flex;
    background: #fff;
    width: 650px;
    margin: auto;
    padding: 20px;
    border-radius: 10px;
}

.catalog-popup-content .catalog-popup-l{

}

.catalog-popup-content .catalog-popup-l img{
	width: 300px;
	height: 424px;
}

.catalog-popup-content .catalog-popup-r{
	padding: 0px 10px;
}

.catalog-popup-content .catalog-popup-title{
	font-size: 70px;
	font-weight: bold;
	line-height: 85px;
}

.catalog-popup-content .catalog-popup-title span{
	font-size: 70px;
}

.catalog-popup-form-box{
	padding: 0px 10px;
}

.catalog-popup-form-box .catalog-popup-form-title{
	margin-bottom: 15px;
}

.catalog-popup-form-box .catalog-popup-form{
	display: flex;
	flex-direction: column;
}

.catalog-popup-form .popup-form-box{
	display: flex;
	flex-direction: column;
}

.popup-form-box .form-item{
	margin-bottom: 10px;
}

.form-item input{
	width: 100%;
    border-radius: 10px;
    height: 40px;
    padding-left: 5px;
    outline: none;
    border: 1px solid #575757;
}

.popup-form-box .form-btn{
	margin-top: 20px;
    background: #68b8b2;
    border-radius: 10px;
    height: 40px;
    align-content: center;
    text-align: center;
    color: #fff;
	cursor: pointer;
}

.popup-form-box .form-btn:hover{
	background: #f1ae25;
}



/* end catalog page */

/* link */

/* Reset default styles */
.link-page {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px;
}

.link-top {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    max-width: 700px;
    justify-content: center;
    flex-direction: column;
    padding: 10px;
}

.link-icon img {
    width: 100px;
    height: auto;
}

.link-icon-name {
	font-size: 20px;
    font-weight: bold;
}

.link-content {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	max-width: 700px;
	margin-top: 20px;
}

.link-box {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 15px 0px;
}

.link-item {
	padding: 1.0rem;
    background: #17a9a2;
    border-radius: 50px;
    margin: .5rem 0rem;
	box-shadow: 1px 1px 1px 1px #00000080;
}

.link-item:hover{
	background: #42b7b1d4;
}

.link-item a {
    text-decoration: none;
    color: #fff;
    display: block;
    text-align: center;
}

.link-item a:hover {
    color: #ffd204;

}

.link-item a .link-item-sub{
	font-size: 12px;
}

.link-item a .link-item-sub.mobile{
	font-size: 10px;
}

.link-border{
	position: relative;
    border-top: 3px solid #68b8b2;
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
}

.link-border-border i {
	position: absolute;
    top: -16px;
    left: 0px;
    background: #fff;
    width: 40px;
    display: flex;
    justify-content: center;
    font-size: 30px;
    color: #68b8b2;
    right: 0px;
    bottom: 0px;
    margin-left: auto;
    margin-right: auto;
}

.link-banner img {
    width: 100%;
    max-width: 700px;
    margin-top: 20px;
    border-radius: 8px;
}

.link-banner .owl-dots{
	display: flex;
	justify-content: center;
}

.link-banner .owl-dot{
	border: 1px solid #17a9a2;
    width: 10px;
    height: 10px;
    margin: 3px;
    border-radius: 100%;
}

.link-banner .owl-dot.active{
	background: #17a9a2;
}


.link-video {
    width: 100%;
    max-width: 700px;
    margin-top: 20px;
}

.link-video iframe {
    width: 100%;
    height: 400px;
    border-radius: 8px;
}

.link-apps{
    display: flex;
    justify-content: center;
    width: 100%;
	margin-top: 10px;
}

.link-apps a{
	width: 100%;
    height: 50px;
    padding: 10px;
	background: #17a9a2;
	text-align: center;
	border-radius: 10px;
}

.link-apps a:hover{
	background: #42b7b1d4;
}

.link-apps a img{
	width: 30px;
	height: 100%;
}

.link-sosmed {
	display: flex;
	justify-content: space-between;
	gap: 15px;
	margin-top: 20px;
	width: 100%;
	margin-bottom: 10px;
}

.social-media-icon {
    width: 85px;
    height: 85px;
    transition: transform 0.3s ease;
}

.social-media-icon:hover {
    transform: scale(1.1);
}

.link-operasional{
	text-align: center;
    width: 100%;
    padding-top: 10px;
    border-top: 3px solid #17a9a2;
}

.link-operasional span{
	font-weight: bold;
}

/* Responsiveness */
@media (max-width: 600px) {
    .link-top {
        flex-direction: column;
        text-align: center;
    }

    .link-box {
        text-align: center;
    }

	.link-video iframe {
        height: 250px;
    }

    .link-sosmed {
        flex-wrap: wrap;
        gap: 10px;
    }

	.social-media-icon{
		width: 40px;
    	height: 40px;
	}
}

@media (max-width: 720px){
	.social-media-icon{
		width: 60px;
    	height: 60px;
	}
}

@media (max-width: 520px){
	.social-media-icon{
		width: 40px;
    	height: 40px;
	}
}

@media (max-width: 380px){
	.social-media-icon{
		width: 30px;
    	height: 30px;
	}
}

@media (max-width: 310px){
	.social-media-icon{
		width: 25px;
    	height: 25px;
	}
}

.link-tab-page {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px;
}

.link-tab-top {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    max-width: 700px;
    justify-content: center;
    flex-direction: column;
    padding: 10px;
}

.link-tab-icon img {
    width: 100px;
    height: auto;
}

.link-tab-icon-name {
	font-size: 20px;
    font-weight: bold;
}

.link-tab-sub-text{
	font-size: 14px;
	color: #868e96;
	text-align: center;
}

.link-tab-operational{
    color: rgb(25 30 60 / 70%);
    text-align: center;
    font-weight: bold;
}

.link-tab-content {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	max-width: 700px;
}

.link-tab-box {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 15px 0px;
}

.link-tab-item {
    margin-bottom: 10px;
    background: #17a9a2;
    border-radius: 50px;
    box-shadow: 1px 1px 1px 1px #00000080;
}

.link-tab-item a{
	text-decoration: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 20px;
}

.link-tab-item a:hover{
	color: #ffd204;
	background: #42b7b1d4;
	border-radius: 50px;
}

.link-tab-item a .link-icon{
	width: 50px;
	height: 50px;
}

.link-tab-item a .link-icon img{
	width: 100%;
	height: 100%;
}

.link-tab-item a .link-label{
	font-size: 16px;
    color: #fff;
}

.link-tab-item a .link-label:hover{
	color: #ffd204;
}

.link-tab-item a .link-bars{
	color: #fff;
}

.link-showroom-page {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px;
}

.link-showroom-top {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    max-width: 700px;
    justify-content: center;
    flex-direction: column;
    padding: 10px;
}

.link-showroom-icon img {
    width: 100px;
    height: auto;
}

.link-showroom-icon-name {
	font-size: 20px;
    font-weight: bold;
}

.link-showroom-operational{
    color: rgb(25 30 60 / 70%);
    text-align: center;
    font-weight: bold;
}

.link-showroom-content {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	max-width: 700px;
}

.link-showroom-box {
    display: flex;
    flex-direction: column;
    width: 100%;
    padding: 15px 0px;
}

.link-showroom-item {
	padding: 1.0rem;
    background: #17a9a2;
    border-radius: 30px;
    margin: .5rem 0rem;
}

.link-showroom-item:hover{
	background: #42b7b1d4;
}

.link-showroom-item a {
    text-decoration: none;
    color: #fff;
    display: block;
    text-align: center;
}

.link-showroom-item a:hover {
    color: #ffd204;
}
/* end link */

/* not found */

.notfound-page{
	display: flex;
	flex-direction: column;
	width: 100%;
}

.notfound-box{
	display: flex;
	justify-content: center;
	flex-direction: column;
	margin-left: auto;
	margin-right: auto;
}

.notfound-box .notfound-img{
	width: 400px;
	height: auto;
	margin-bottom: 20px;
}

.notfound-box .notfound-img img{
	width: 100%;
	height: 100%;
}

.notfound-box .notfound-text{
	text-align: center;
	font-weight: bold;
}


/* end not found */

.header-social-row{
	display: flex;
	flex-wrap: wrap;
	margin-top: 10px;
}

.header-social-row .download-app{
	margin-left: 4%;
	color: #49A7A1;
	cursor: pointer;
}

.header-social-row .download-app:hover{
	text-decoration: underline;
}

.header-social-row .separator{
	margin-left: 5px;
	margin-right: 5px;
}

.header-social-row img{
	width: 15pt;
	height: auto;
}

.header-social-row a{
	text-decoration: none;
}

.logo-box{
	margin-left: 3%;
}

.header-middle .other-service .service-link{
	letter-spacing:normal;
	font-weight: normal;
}

.header-middle .other-service .service-link a:hover{
	color: #49A7A1;
}

.header-middle .other-service .service-link.color .orange {
  color: #49A7A1;
}

.header-middle .other-service .service-link.color .orange:hover {
  color: #FCAA4C;
}

.header-middle .other-service .service-link.color{
	color: #49A7A1;
}

@keyframes blinkSoft {
  0%, 100% {
    color: #FCAA4C;
  }
  50% {
    color: #49A7A1;
  }
}

.header-middle .other-service .service-link.solution-link a {
	color: #000; 
	animation: blinkSoft 1.5s infinite;
	 animation-delay: 2s;
	 animation-fill-mode: both; 
}

.header-middle .other-service .service-link.solution-link:hover {
  animation-play-state: paused;
  color: #49A7A1;
}

.cat-link{
	position:relative;
	cursor: pointer;
}

.drop-down{
    position: fixed;
    display: none;
    left: 0;
    top: 135px;
    height: 100%;
    width: 100%;
    background: #00000060;
}

.drop-down .drop-down-content{
    display: flex;
    justify-content: space-between;
    background: #fff;
    width: 100%;
    margin-top: 2px;
    box-shadow: 1px 0px 0px 1px #C0C0C0;
}

.drop-down-content .dropdown-group-cat{
	width: 60%;
    display: flex;
    flex-direction: column;
    padding: 0px 0% 0px 6%;
}

.dropdown-group-cat .group-cat-title{
	font-size: 25pt;
    font-weight: bold;
    margin-bottom: 20px;
	margin-top: 20px;
}

.dropdown-group-cat .group-cat-content{
	display: flex;
	justify-content: space-between;
}

.group-cat-content .cat-menu{
	margin-bottom: 15px;
}

.group-cat-content .cat-menu a{
	display: flex;
}

.group-cat-content .cat-menu a .cat-icon{
	margin-right: 10px;
}

.group-cat-content .cat-menu a .cat-txt{
	font-weight: normal;
	margin-top: auto;
	margin-bottom: auto;
}

.drop-down-item-row a{
	display: flex;
}

.drop-down-item-row a .cat-icon{
	margin-right: 10px;
}

.drop-down-item-row a .cat-txt{
	font-weight: normal;
}

.drop-down-content .dropdown-group-img{
	width: 35%;
}

.drop-down-content .dropdown-group-img img{
	width: 100%;
}

/* client page */

.client-page{
	display: flex;
	flex-direction: column;
}

.client-top{
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 50px 6% 30px 6%;
}

.client-top .client-top-main{
	font-size: 25pt;
	font-weight: bold;
}

.client-page .client-content{
	padding: 20px 6%;
	width: 100%;
}

.client-content .client-list{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.client-list .item{
	width: calc(calc(100% - 200px) / 6);
	padding: 20px;
	align-items: center;
    margin-top: auto;
    margin-bottom: auto;
}

.client-list .item a{
	width: 100%;
}

.client-list .item a img{
	width: 100%; 
}

.client-page .client-back-to-home{
	display: flex;
	justify-content: center;
}

.client-back-to-home a{
	text-decoration: none;
    border: 1px solid #c0c0c0;
    padding: 10px 70px;
    border-radius: 20px;
    color: #000;
}

.client-back-to-home a:hover{
	border: 1px solid #49a7a1;
	background: #49a7a1;
	color: #fff;
}

/* end client page */

/* custom page */

.custom-page{
	display: flex;
	flex-direction: column;
}

.custom-page .custom-page-top{
	padding: 50px 7% 0px 7%;
}

.custom-page-top .custom-page-top-title{
	display: flex;
    justify-content: center;
    font-size: 25pt;
    font-weight: bold;
    margin-bottom: 10px;
}

.custom-page-top .custom-page-top-sub{
	display: flex;
    justify-content: center;
    text-align: center;
    font-size: 14pt;
	margin-bottom: 20px;
}

.custom-page-top .custom-page-top-img{
	width: 100%;
}

.custom-page-top .custom-page-top-img img{
	width: 100%;
}

.border-custom{
	border: 1px solid #f0f0f0;
    margin-top: 70px;
    margin-bottom: 70px;
}

.custom-page-content{
	display: flex;
	flex-direction: column;
	padding: 0px 7% 0px 7%;
}

.custom-page-content .custom-page-content-title{
	display: flex;
    justify-content: center;
    font-size: 25pt;
    font-weight: bold;
    margin-bottom: 50px;
}

.custom-page-content-main{

}

.custom-main-list{
	display: flex;
	flex-direction: column;
}

.custom-main-item{
	display: flex;
    justify-content: space-between;
    margin-bottom: 50px;
}

.custom-main-item .custom-main-item-img{
	width: 48%;
}

.custom-main-item .custom-main-item-img img{
	width: 100%;
	transition: transform 0.5s ease;
}

.custom-main-item .custom-main-item-img img:hover{
	transform: scale(1.03);
}

.custom-main-item .custom-main-item-txt{
	width: 48%;
    background: #f0f0f0;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.custom-main-item-txt .custom-main-item-txt-title{
	color: #49a7a1;
    text-align: center;
    font-size: 25pt;
    font-weight: bold;
}

.custom-main-item-txt .custom-main-item-txt-sub{
	text-align: center;
    color: #000;
    font-weight: 500;
    font-size: 16pt;
} 
.custom-page-adjust{
	display: flex;
	flex-direction: column;
	padding: 0px 7% 0px 7%;
}

.custom-page-adjust .custom-page-adjust-title{
	display: flex;
    justify-content: center;
    font-size: 25pt;
    font-weight: bold;
    margin-bottom: 50px;
}

.custom-page-adjust .custom-page-adjust-content{
	display: flex;
	justify-content: space-between;
	width: 100%;
	gap: 30px;
}

.custom-page-adjust-content .custom-adjust-item{
	width: 25%;
	display: flex;
	flex-direction: column;
}

.custom-adjust-item .custom-adjust-item-img{
	width: 100%;
	margin-bottom: 10px;
}

.custom-adjust-item .custom-adjust-item-img img{
	width: 100%;
	transition: transform 0.5s ease;
}

.custom-adjust-item .custom-adjust-item-img img:hover{
	transform: scale(1.03);
}

.custom-adjust-item .custom-adjust-item-txt{
	text-align: center;
	font-weight: bold;
}

.custom-page-contact{
	margin-bottom: 70px;
	padding: 0px 7% 0px 7%;
}

.custom-page-contact-box{
	display: flex;
	justify-content: space-between;
}

.custom-page-contact-box .custom-contact-img{
	width: 50%;
}

.custom-page-contact-box .custom-contact-img img{
	width: 100%;
}

.custom-page-contact-box .custom-contact-txt{
	width: 50%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	padding-left: 10%;
}

.custom-contact-txt .custom-contact-txt-title{
	font-size: 25pt;
	font-weight: bold;
	margin-bottom: 20px;
	display: flex;
}

.custom-contact-txt .custom-contact-txt-btn .contact-txt-btn{
	background: #49a7a1;
    color: #fff;
    padding: 5px 30px;
    border-radius: 20px;
    cursor: pointer;
}

.custom-contact-txt .custom-contact-txt-btn .contact-txt-btn:hover{
	background: #FCAA4C;
} 

/* end custom page */

/* Sewa Page */
.sewa-page{
	display: flex;
	flex-direction: column;
}

.sewa-top{
	display: flex;
	align-items: center;
	padding: 50px 0% 0px 7%;
	gap: 40px;
	overflow: visible;
}

.sewa-top-txt{
	width: 35%;
}

.sewa-top-txt-main{
	font-size: 25pt;
	font-weight: bold;
	color: #49a7a1;
	margin-bottom: 15px;
}

.sewa-top-txt-sub{
	font-size: 11pt;
	line-height: 1.6;
	color: #000;
	margin-bottom: 20px;
}

.sewa-top-txt-btn span{
	background: #49a7a1;
	color: #fff;
	padding: 4px 30px;
	border-radius: 20px;
	cursor: pointer;
	display: inline-block;
	transition: 0.3s;
	font-weight: bold;
}

.sewa-top-txt-btn span:hover{
	background: #FCAA4C;
}

.sewa-top-img{
	width: 65%;
    position: relative;
}

.sewa-top-img::before
{
	content: "";
	position: absolute;
	top: 0;
	width: 120px;
	height: 100%;
	z-index: 2;
	pointer-events: none;
}

.sewa-top-img::before{
	left: 0;
	background: linear-gradient(
		to right,
		#ffffff 0%,
		rgba(255,255,255,0.8) 40%,
		rgba(255,255,255,0) 100%
	);
}

.sewa-top-img::-webkit-scrollbar{
	display: none;
}

.sewa-marquee{
    overflow: hidden;
    width: 100%;
}

.sewa-track{
    display: flex;
    gap: 20px;
    width: max-content;
    animation: sewa-scroll 40s linear infinite;
}

@keyframes sewa-scroll{
    from{
        transform: translateX(0);
    }
    to{
        transform: translateX(-50%);
    }
}

.sewa-top-img:hover .sewa-track{
    animation-play-state: paused;
}

.sewa-top-img:hover .sewa-marquee{
    animation-play-state: paused;
}

.sewa-top-img{
	scrollbar-width: none;
}

.sewa-top-img-box{
	display: flex;
	gap: 20px;
	width: max-content;
}

.sewa-top-img-item{
	min-width: 360px;
	height: 300px;
	border-radius: 24px;
	overflow: hidden;
	flex-shrink: 0;
}

.sewa-top-img-item img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.drag-scroll{
	cursor: grab;
}

.drag-scroll.active{
	cursor: grabbing;
}

.border-sewa{
	margin-top: 50px;
	margin-bottom: 50px;
	border: 1px solid #f0f0f0;
}

.sewa-content{
	display: flex;
	flex-direction: column;
	padding: 0px 7% 0px 7%;
}

.sewa-content .sewa-content-title{
	display: flex;
    justify-content: center;
    font-size: 25pt;
    font-weight: bold;
    margin-bottom: 30px;
}

.sewa-content .sewa-content-main{
	
}

.sewa-main-list{
	display: flex;
	flex-direction: column;
}

.sewa-main-item{
	display: flex;
	justify-content: space-between;
	margin-bottom: 50px;
}

.sewa-main-item-img{
	width: 48%;
}

.sewa-main-item-img img{
	width: 100%;
	transition: transform 0.5s ease;
}

.sewa-main-item-img img:hover{
	transform: scale(1.03);
}

.sewa-main-item-txt{
	width: 48%;
    background: #f0f0f0;
    border-radius: 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.sewa-main-item-txt-title{
	color: #49a7a1;
    text-align: center;
    font-size: 25pt;
    font-weight: bold;
}

.sewa-main-item-txt-sub{
	text-align: center;
    color: #000;
    font-weight: 500;
    font-size: 14pt;
}

.sewa-available{
    padding: 0 0 0 7%;
}

.sewa-available-title{
    text-align: center;
    font-weight: bold;
    font-size: 25pt;
    margin-bottom: 30px;
}

.sewa-available-marquee{
    overflow: hidden;
    width: 100%;
}

.sewa-available-track{
    display: flex;
    gap: 30px;
    width: max-content;
    animation: sewaAvailableScroll 35s linear infinite;
}

@keyframes sewaAvailableScroll{
    from{
        transform: translateX(0);
    }
    to{
        transform: translateX(-50%);
    }
}

/* pause saat hover */
.sewa-available-marquee:hover .sewa-available-track{
    animation-play-state: paused;
}

/* item tetap seperti punyamu */
.sewa-available-item{
    min-width: 220px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
}

.sewa-available-item-img{
    width: 250px;
    margin-bottom: 10px;
}

.sewa-available-item-img img{
    width: 100%;
}

.sewa-available-item-txt{
    text-align: center;
    font-weight: bold;
}


.sewa-fav{
	display: flex;
	flex-direction: column;
	padding: 0px 7% 0px 7%;
}

.sewa-fav-title{
	display: flex;
	justify-content: center;
	font-weight: bold;
	font-size: 25pt;
	margin-bottom: 30px;
}

.sewa-fav-content{
	display: flex;
	flex-direction: column;
}

.sewa-fav-content-list{
	display: flex;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 30px;
}

.sewa-fav-content-item{
	width: 23%;
}

.sewa-fav-content-item img{
	transition: transform 0.3s ease;
	width: 100%;
}

.sewa-fav-content-item img:hover{
	transform: scale(1.03);;
}

.sewa-contact{
	padding: 0px 7% 0px 7%;
	margin-bottom: 100px;
}

.sewa-page-contact-box{
	display: flex;
	justify-content: space-between;
}

.sewa-contact-img{
	width: 50%;
}

.sewa-contact-img img{
	width: 100%;
}

.sewa-contact-txt{
	width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    padding-left: 10%;
}

.sewa-contact-txt-title{
	font-size: 25pt;
	font-weight: bold;
	margin-bottom: 20px;
	display: flex;
}

.sewa-txt-btn{
	background: #49a7a1;
	color: #fff;
	padding: 5px 30px;
	border-radius: 20px;
	cursor: pointer;
}

.sewa-txt-btn:hover{
	background: #FCAA4C;
}


/* end Sewa Page */