.add-transition {
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
}
a {
	text-decoration: none;
	cursor: pointer;
}
button {
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	cursor: pointer;
}
button.green {
	color: #fff;
	/*font-family:'Gotham-Medium';*/
	background: var(--green-wardah);
	padding: 15px 30px;
	border-radius: 30px;
	border : none;
	outline: none;
}
button.green.same-width {
	width: 200px;
}
button.green.same-width.small {
	width: 170px;
}
button.green:hover {
	opacity: 0.8;
}
button.green.outline {
        background-color: transparent;        
	color: var(--green-wardah);
	padding: 8px 12px;
	border : solid 1px var(--green-wardah);
}
button.grey {
	color: #777;
	/*font-family:'Gotham-Medium';*/
	background: #f0f0f0;
	padding: 15px 30px;
	border-radius: 30px;
	border : none;
	outline: none;
}
button.grey:hover {
	opacity: 0.8;
}
button.green:disabled,
button.grey:disabled {
	opacity: 0.5;
	cursor: auto;
}
button.rounded {
	/*font-family:'Gotham-Medium';*/
	padding: 15px 0;
	width: 50px;
	border-radius: 30px;
	border : none;
	outline: none;
}
i.icon-cart {
    background-image: url(../images/icon-btncart.png);
    width: 10px;
    height: 12px;
    display: inline-block;
    margin-right: 3px;
}

a.green-link {
	/*font-family:'Gotham-Book';*/
	color: var(--green-wardah);
	border : none;
	outline: none;
	text-decoration: none;
	font-size: 12px;
}
a.green-link:hover {
	text-decoration: underline;
	opacity: 0.8;
}

.sweet-alert button {
    background-color: #272727 !important;
}

.global-notif-error {
	position: fixed;
	z-index: 9999999;
	top : 15px;
	left: 50%;
	transform: translate(-50%,0);
	padding: 10px;
	color: #fff;
	font-size: 11px;
	/*font-family:'Gotham-Book';*/
	background: #f92370;
	color: #fff;
	border-radius: 10px;
	display: none;
}

fieldset {
	width: 100%;
	margin : 30px 0;
	border : none;
        position: relative;
	/*border-top : solid 2px var(--green-wardah);*/
}
fieldset legend {
	color: var(--green-wardah);
	/*font-family:'Gotham-Medium';*/
	font-size: 23px;
	padding: 0 10px;
	float: none;
	width: auto;
}
fieldset button {
    position: absolute;
    right: 0;
    bottom: -4px;
}

.form-area {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
}
.form-area h1 {
	/*font-family:'Gotham-Medium';*/
	color: var(--green-wardah);
	margin-bottom: 30px;
}
.form-area .title {
	width: 100%;
	/*font-family:'Gotham-Medium';*/
	color: var(--text-title);
	text-transform: uppercase;
	font-size: 23px;
	margin-bottom: 20px;
}
.form-area .field {
	width: 100%;
	margin-bottom: 20px;
}
.form-area .field.flex {
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
.form-area .field label {
	/*font-family:'Gotham-Book';*/
	color: var(--text-content);
	line-height: 1.3;
	font-size: 11px;
	padding-top: 10px;
}
.form-area .field.flex label {
	width: 80%;
}
.form-area .field.flex input[type=checkbox] {
	margin-right: 10px;
	width: auto;
}
.form-area .field.has-error label {
	color: #aa2222;
}
.form-area .field input {
	margin-top: 10px;
	width: 94%;
	padding: 10px 3%;
	background: #f8f8f8;
	border : none;
	border-bottom : solid 1px #ccc;
	outline: none;
	/*font-family:'Gotham-Book';*/
	font-size: 14px;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
}
.form-area .field.has-error input {
	border-bottom : solid 1px #aa2222;
}
.form-area .field input:focus {
	border-bottom : solid 1px var(--green-wardah);
}
.form-area .field select {
	margin-top: 10px;
	width: 100%;
	padding: 0 5%;
	background: #fff;
	border : solid 1px #ccc;
	outline: none;
	/*font-family:'Gotham-Book';*/
	font-size: 14px;
	height: 38px;
}
.form-area .field.has-error select {
	background: #ffeeee;
	border : solid 1px #aa2222;
}
.form-area .field textarea {
	width: 90%;
	padding: 5%;
	background: #fff;
	border : solid 1px #ccc;
	outline: none;
	/*font-family:'Gotham-Book';*/
	font-size: 14px;
	height: 100px;
	outline: none;
}
.form-area .field.has-error textarea {
	background: #ffeeee;
	border : solid 1px #aa2222;
}
.form-area .field button {
	background: var(--green-wardah);
	color: #fff;
	/*font-family:'Gotham-Book';*/
	font-size: 14px;
	padding: 10px 20px;
	border: none;
	outline: none;
}
.form-area .field button:hover {
	cursor: pointer;
	opacity: 0.8;
}
.form-area .field.half {
	width: 49%
}
.form-area .field button.full {
	width: 100%;
}
.mobile {
	display: none !important;
}
.mobile-flex {
	display: none !important;
}
.desktop {
	display: block !important;
}
.desktop-flex {
	display: flex !important;
}
.bgblack {
	position: fixed;
	z-index: 9998;
	top : 0;
	left: 0;
	width: 100%;
	height: 100%;
	background : rgba(0,0,0,0.6);
	display: none;
}
.popup {
	position: fixed;
	z-index: 9999;
	top: 50%;
	left: 50%;
	width: 500px;
	background: #fff;
	transform: translate(-50%,-50%);
	display: none;
}	
.popup.wider {
	width: 800px;
}
.popup.smaller {
	width: 300px;
}
.popup.medium {
	width: 400px;
}
.popup .wrapper {
	width: 90%;
	padding: 5%;
}
.popup .wrapper.popup-success {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	padding: 8% 5%;
}
.popup .wrapper.popup-success h1 {
	font-size: 32px;
	color: var(--green-wardah);
	margin-bottom: 20px;
	width: 100%;
	text-align: center;
	/*font-family:'Gotham-Medium';*/
}
.popup .wrapper.popup-success p {
	width: 100%;
	text-align: center;
	font-size: 13px;
	line-height: 1.2;
	/*font-family:'Gotham-Book';*/
	margin-bottom: 20px;
}
.popup button.close-popup {
	position: absolute;
	width: 30px;
	height: 30px;
	background: #222;
	border : none;
	outline: none;
	color: #fff;
	font-size: 16px;
	top : -15px;
	right: -15px;
}
.popup button.close-popup.round {
	position: absolute;
	width: 30px;
	height: 30px;
	background: #222;
	border : none;
	outline: none;
	border-radius: 15px;
	color: #fff;
	font-size: 16px;
	top : -15px;
	right: -15px;
}
.popup .notif {

}
.popup .socmed-lists {
	width: 100%;
	margin-top: 20px;
}
.popup .socmed-lists .item {
	width: 90%;
	padding: 5%;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	/*font-family:'Gotham-Book';*/
	color: #333;
	font-size: 14px;
	margin-bottom: 10px;
	border : solid 1px #f0f0f0;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
}
.popup .socmed-lists .item a {
	color: #333;
}
.popup .socmed-lists .item:hover {
	background: #333;
	border-color: #333;
	color: #fff;
	cursor: pointer;
}
.popup .socmed-lists .item:hover  a {
	color: #fff;
}
.popup .socmed-lists .item button {
	width: 30px;
	height: 30px;
	border-radius: 15px;
	border : none;
	outline: none;
	background: #222;
	color: #fff;
	margin-right: 5px;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
}
.popup .socmed-lists .item:hover button {
	background: #fff;
	color: #333;
	margin-right: 10px;
} 
.popup.box-login {
	width: 800px;
	display: none;
	overflow-x: hidden;
	overflow: -moz-scrollbars-none; 
	-ms-overflow-style: none;
}
.popup.box-login.inline {
	display: block;
	position: relative;
	transform: none;
	top: 0;
	left: 0;
}
.popup.box-login::-webkit-scrollbar { 
	width: 0 !important 
}
.popup.box-login .close-popup {
	position: absolute;
	top : 2px;
	right: 8px;
	background: none;
	border : none;
	outline: none;
	padding: 0;
	font-size: 32px;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	z-index: 99;
}
.popup.box-login .close-popup.sign-in {
	color: var(--green-wardah);
}
.popup.box-login .close-popup.sign-up {
	color: #fff;
}
.popup.box-login .wrapper {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	width: 100%;
	padding: 0;
	flex-wrap: wrap;
}
.popup.box-login .form-segment {
	width: 0;
	opacity: 0;
	overflow: hidden;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	height: 470px;
	position: relative;
	overflow: -moz-scrollbars-none; 
	-ms-overflow-style: none;
}
.popup.box-login .form-segment::-webkit-scrollbar { 
	width: 0 !important 
}
.popup.box-login .form-segment.on {
	width: 40%;
	padding: 5%;
	opacity: 1;
}
.popup.box-login .form-segment h1 {
	/*font-family:'Gotham-Medium';*/
	color: var(--green-wardah);
	font-size: 23px;
	margin-bottom: 30px;
}
.popup.box-login .form-segment .error-message {
	width: 92%;
	padding: 4%;
	background: #ED7859;
	color: #fff;
	/*font-family:'Gotham-Book';*/
	font-size: 14px;
	position: absolute;
	top : 0;
	left: 0;
	display: none;
}
.popup.box-login .side-message {
	width: 40%;
	padding: 5%;
	background: var(--green-wardah);
	color: #fff;
	min-height: 470px;
}
.popup.box-login .side-message.hide-box {
	position: absolute;
	top : 0;
	right: -50%;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	z-index: 2;
}
.popup.box-login .bgblack-box {
	position: absolute;
	top : 0;
	right: 0;
	width: 0;
	height: 100%;
	z-index: 1;
	background: rgba(255,255,255,0.5);
	opacity: 0;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
}
.popup.box-login .bgblack-box.on {
	width: 100%;
	opacity: 1;
}
.popup.box-login .side-message.hide-box.on {
	right: 0;
}
.popup.box-login .side-message .message-container {
	width: 100%;
	display: none;
}
.popup.box-login .side-message .message-container.on {
	display: block;
}
.popup.box-login .side-message h1 {
	/*font-family:'Gotham-Medium';*/
	font-size: 23px;
	line-height: 1.3;
	margin-bottom: 20px;
}
.popup.box-login .side-message p {
	/*font-family:'Gotham-Book';*/
	line-height: 1.3;
	font-size: 14px;
	margin-bottom: 20px;
}
.popup.box-login .side-message button {
	padding: 10px 20px;
	/*font-family:'Gotham-Book';*/
	color: var(--green-wardah);
	background: #fff;
	border : none;
	outline: none;
	border-radius: 20px;
	box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-ms-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-o-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
}
.popup.box-login .side-message button:hover {
	cursor: pointer;
	opacity: 0.8;
}
.popup.box-login .side-message .message-container a {
	/*font-family:'Gotham-Medium';*/
	color: #fff;
	text-decoration: underline;
}
.popup.box-login .side-message .message-container .field {
	width: 100%;
	margin-bottom: 20px;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	flex-wrap: wrap;
}
.popup.box-login .side-message .message-container .field label {
	width: 100%;
}
.popup.box-login .side-message .message-container .field  input {
	width: 80%;
	padding: 10px;
	outline: none;
	border : none;
	background: #fff;
	font-size: 14px;
	/*font-family:'Gotham-Book';*/
	border-radius: 20px;
	margin-top: 5px;
	opacity: 0.9;
}
.popup.box-login .form-segment .password-container {
	display: flex;
	justify-content: space-between;
	align-items: center;	
}
.popup.box-login .form-segment .password-container  button {
	margin-top: 10px;
}
.popup.result-virtual {
	display: none;
	width: 360px;
	height: 480px;
	border : none;
	outline: none;
	padding: 10px;
	background: #fff;
	border-radius: 5px;
	overflow-y: hidden;
}
.popup.result-virtual .close-popup.round {
	top : 20px;
	right: 20px;
	background: rgba(0,0,0,0.6);
}
.popup.result-virtual .image-result img {
	width: 360px;
	height: 480px;
	object-fit: cover;
	object-position: center;
}
.popup.result-virtual  .button-area {
	position: absolute;
	bottom: 50px;
	left: 50%;
	transform: translate(-50%,0);
	background: var(--green-wardah);
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 200px;
	padding: 0;
	border : none;
	border-radius: 20px;
	box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-ms-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-o-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	z-index: 2;
}
.popup.result-virtual  .button-area .separator {
	width: 1px;
	height: 30px;
	background: #fff;

}
.popup.result-virtual .button-area button {
	width: 99px;
	height: 40px;
	color: #fff;
	background: none;
	border : none;
	outline: none;
	/*font-family:'Gotham-Book';*/
}
.popup.result-virtual .button-area button.left {
	border-radius: 20px 0 0 20px;
}
.popup.result-virtual .button-area button.right {
	border-radius: 0 20px 20px 0;
}
.popup.result-virtual .button-area button:hover {
	background: var(--dark-green-wardah);
}
.popup.result-virtual .share-box {
	position: absolute;
	left: 5%;
	bottom: 5%;
	z-index: 3;
	width: 90%;
	transform: translate(0,110%);
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
}
.popup.result-virtual .share-box.on {
	transform: translate(0,0);
}
.popup.result-virtual .share-box .share-area {
	width: 90%;
	padding: 5%;
	border-radius: 15px;
	background: rgba(255,255,255,0.8);
}
.popup.result-virtual .share-box  .share-area .label {
	width: 100%;
	text-align: left;
	font-size: 11px;
	color: var(--green-wardah);
	/*font-family:'Gotham-Book';*/
	margin-bottom: 15px;
}
.popup.result-virtual .share-box  .share-area input[type=text] {
	width: 100%;
	color: var(--green-wardah);
	/*font-family:'Gotham-Book';*/
	font-size: 18px;
	background: none;
	outline: none;
	border: none;
	margin-bottom: 10px;
}
.popup.result-virtual .share-box  .share-area .button-area-right {
	width: 100%;
	text-align: right;
}
.popup.result-virtual .share-box  .share-area .button-area-right button {
	background: none;
	outline: none;
	border : none;
	padding: none;
	/*font-family:'Gotham-Book';*/
	color: var(--green-wardah);
}
.popup.result-virtual .share-box  .share-area .button-area-right button:hover {
	opacity: 0.8;
}
.popup.result-virtual .share-box  .share-area .line {
	width: 100%;
	height: 1px;
	background: var(--green-wardah);
	margin : 10px 0 20px 0;
}
.popup.result-virtual .share-box  .share-area .icon-container {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: flex-start;
	flex-wrap: wrap;
}
.popup.result-virtual .share-box  .share-area .icon-container .icon-item {
	width: 18%;
	margin : 2px;
	text-align: center;
}
.popup.result-virtual .share-box  .share-area .icon-container .icon-item:hover {
	cursor: pointer;
	opacity: 0.8;
}
.popup.result-virtual .share-box  .share-area .icon-container .icon-item button.share-icon {
	width: 40px;
	height: 40px;
	border-radius: 20px;
	background: #fff;
	outline: none;
	border : none;
	margin-bottom: 10px;
	position: relative;
}
.popup.result-virtual .share-box  .share-area .icon-container .icon-item label {
	font-size: 11px;
	color: var(--green-wardah);
	/*font-family:'Gotham-Book';*/
}
.popup.result-virtual .share-box  .share-area .icon-container .icon-item button.share-icon img {
	width: 20px;
	position: absolute;
	top : 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.popup.result-virtual .share-box .cancel-button {
	width: 100%;
	padding: 5% 0;
	border-radius: 15px;
	background: rgba(255,255,255,0.8);
	outline: none;
	color: var(--green-wardah);
	font-size: 14px;
	margin-top: 10px;
}
.popup.result-virtual .share-box .cancel-button:hover {
	background: rgba(255,255,255,1);
}

#wrapper{
	width: 100%;
	position: relative;
	display: block;
	margin: 0;
	padding: 0;
}

.cookies-notif {
	background: #272727;
	color: #fff;
	width: 100%;
	display: flex;
	justify-content: center;
	position: fixed;
	z-index: 99999;
	bottom: 0;
	left: 0;
}
.cookies-notif .wrap {
	width: 90%;
	padding: 15px 5%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}
.cookies-notif .wrap .text {
	width: 63%;
}
.cookies-notif .wrap h3 {
	/*font-family:'Gotham-Medium';*/
	font-size: 14px;
	margin-bottom: 10px;
}
.cookies-notif .wrap p {
	/*font-family:'Gotham-Book';*/
	color: #e0e0e0;
	font-size: 11px;
	line-height: 1.3;
}
.cookies-notif .wrap .button-area {
	width: 35%;
	display: flex;
	justify-content: flex-end;
	align-items: center;
}
.cookies-notif .wrap .button-area a {
	color: #c0c0c0;
	text-decoration: underline;
}
.cookies-notif .wrap .button-area button {
	margin-right: 20px;
	padding: 10px 20px;
}

.main-slider-container {
	width: 100%;
	position: relative;
}
.main-slider-container .main-slider-wrapper {
	width: 100%;
}
.main-slider-container .main-slider-wrapper .item {
	width: 100%;
}
.main-slider-container .main-slider-wrapper .item img {
	width: 100%;
	object-fit: cover;
	object-position: center;
}
.main-slider-container button.nav-slider {
	position: absolute;
	top : 50%;
	transform: translate(0,-50%);
	z-index: 2;
	background: none;
	outline: none;
	color: var(--green-wardah);
	font-size: 42px;
	border: none;
}
.main-slider-container button.nav-slider.prev {
	left: 3%;
}
.main-slider-container button.nav-slider.next {
	right: 3%;
}
.common-text {
	/*font-family:'Gotham-Book';*/
	display: flex;
	justify-content: flex-start;
	align-items: center;
	flex-wrap: wrap;
}
.common-text h1 {
	/*font-family:'Gotham-Medium';*/
	color: #777;
	font-size: 32px;
	margin-bottom: 20px;
}
.common-text h1.green {
	color: var(--green-wardah);
}
.common-text p {
	color: #646867;
	font-size: 18px;
	line-height: 1.4;
}
.segment {
	width: 100%;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: 2rem;
}

.segment.grey {
	background: #f3fafa;
}
.segment .wrapper {
	width: 94%;
	padding: 5% 0;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
}
.segment.wave {
	background: url(../images/bg-wave.png);
	background-repeat: repeat;
}
.segment .wrapper .icon-manifesto {
	width: 35%;
	text-align: center;
}
.segment .wrapper .icon-manifesto .item {
	width: 100%;
	text-align: center;
}
.segment .wrapper .icon-manifesto img {
	width: 300px;
	display: inline-block;
}
.segment .wrapper .common-text.manifesto {
	width: 60%;
}
.segment .wrapper .common-text.manifesto .item {
	width: 100%;
}
.segment .wrapper .common-text.manifesto p {
	/*font-family:'Gotham-Medium';*/
	font-size: 18px;
}
.segment .wrapper.cover-heading {
	text-align: center;
}
.segment .wrapper.cover-heading h1 {
	/*font-family:'Gotham-Medium';*/
	color: var(--green-wardah);
	font-size: 23px;
}
.segment .wrapper.center {
	justify-content: center;
}
.segment .wrapper.news-pagination {
	padding: 0 5%;
}
.segment .wrapper.news-box {
	flex-wrap: wrap;
	padding: 3% 0;
}
.segment.footer-banner a {
	width: 100%;
}
.footer-content-product {
	width: 100%;
	margin: 20px 0;
	/*font-family:'Gotham-Book';*/
}
.footer-content-product b,
.footer-content-product strong {
	/*font-family:'Gotham-Medium';*/
	color: #666;
}
.footer-content-product ul {
	list-style: decimal;
	padding: 20px;
}
.footer-content-product ol {
	list-style: circle;
	padding: 20px;
}
.footer-content-product p {
	line-height: 1.2;
	margin-bottom: 10px;
}
/*.product-area {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
}
.product-area a {
	width: 25%;
	text-align: center;
	display: flex;
	justify-content: center;
}
.product-area.small a {
	width: 33%;
	text-align: center;
	display: flex;
	justify-content: center;
}
.product-area .item {
	width: 80%;
	position: relative;
	min-height: 350px;
	overflow: hidden;
}
.product-area.small .item  {
	margin-bottom: 20px;
}
.product-area .item label.flag {
	position: absolute;
	top : 200px;
	left: 0;
	background: var(--green-wardah);
	color: #fff;
	/*font-family:'Gotham-Medium';/
	padding: 5px;
	border-radius: 0 5px 5px 0;
	z-index: 2;
	font-size: 12px;
	box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-ms-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
}

.product-area .item button.love {
	position: absolute;
	top : 0;
	right: 0;
	font-size: 23px;
	padding: 0;
	border : none;
	outline: none;
	background : none;
	color: var(--green-wardah);
	z-index: 3;
}
.product-area .item img {
	width: 100%;
	height: 250px;
	object-position: center;
	object-fit: contain;
	margin-bottom: 10px;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	position: absolute;
	top : 0;
	left: 0;
	z-index: 1;
}
.product-area .item.loader-product .box {
	width: 100%;
	height: 250px;
}
.product-area .item:hover img {
	height: 300px;
	top : -25px;
}
.product-area .item .text-container {
	width: 100%;
	position: absolute;
	top : 280px;
	left: 0;
	z-index: 3;
	text-align: center;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
.product-area .item .text-container label.tag {
	/*font-family:'Gotham-Book';/
	color: #9a9a9a;
	font-size: 12px;
	width: 100%;
	text-align: center;
}
.product-area .item .text-container .title {
	margin-top: 10px;
	/*font-family:'Gotham-Medium';/
	font-size: 16px;
	color: #646867;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
}
.product-area .item.loader-product .tag {
	width: 80%;
	height: 10px;
}
.product-area .item.loader-product .title {
	width: 100%;
	height: 15px;
}
.product-area .item:hover .text-container .title {
	margin-top: 20px;
}*/
.headline {
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}
.headline.detail {
	align-items: flex-start;
	justify-content: center;
	width: 1280px;
}
.headline.detail .heading-area {
	width: 70%;
	margin: 30px 0 50px 0;
	text-align: center;
}
.headline.detail .heading-area h1 {
	/*font-family:'Gotham-Medium';*/
	font-size: 23px;
	line-height: 1.3;
	color: #626264;
	margin-bottom: 20px;
}
.headline.detail .heading-area .tagline {
	color: var(--green-wardah);
	/*font-family:'Gotham-Book';*/
	font-size: 16px;
}
.headline .image-area {
	width: 40%;
}


.headline.detail .image-area {
	width: 45%;
}
.headline.detail .image-area .image-content {
	width: 100%;
}
.headline.detail .image-area.stick {
	position: fixed;
	z-index: 3;
	top : 10%;
	width: 512px;
}
.headline img {
	width: 60%;
	height: auto;
	object-position: top;
	object-fit: cover;
}
.headline.detail .image-area img {
	width: 100%;
	object-position: center;
	object-fit: cover;
}

.headline .text-headline {
	width: 38%;
}
.headline.detail .text-headline {
	width: 50%;
}
.headline.detail .text-headline.stick {
	position: fixed;
	z-index: 3;
	top : 10%;
	width: 630px;
}
.headline .text-headline h1 {
	/*font-family:'Gotham-Medium';*/
	font-size: 32px;
	color: var(--green-wardah);
	margin-bottom: 20px;
	line-height: 1.2;
}
.headline .text-headline span.tagline {
	/*font-family:'Gotham-Book';*/
	font-size: 18px;
	color: var(--green-wardah);
	line-height: 1.2;
}
.headline .text-headline div.line {
	width: 100px;
	height: 2px;
	background: var(--green-wardah);
	margin : 20px 0;
}
.headline .text-headline p {
	/*font-family:'Gotham-Book';*/
	font-size: 16px;
	line-height: 1.5;
	color: #646867;
	margin-bottom: 10px;
}
.headline.detail .text-headline b,
.headline.detail .text-headline strong {
	/*font-family:'Gotham-Medium';*/
	color: #333;
}
.headline.detail .text-headline ul,
.headline.detail .text-headline ol {
	margin: 10px 0;
}
.headline.detail .text-headline ul li,
.headline.detail .text-headline ol li {
	margin-bottom: 10px;
	/*font-family:'Gotham-Book';*/
}
.headline.detail .text-headline ul {
	list-style: disc;
	padding-left: 15px;
}
.headline.detail .text-headline ol {
	list-style: decimal;
	padding-left: 15px;
}
.news-box {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
}
.news-box .item-box {
	width: 48%;
	box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-ms-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-o-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	position: relative;
	height: 300px;
	overflow: hidden;
	border-radius: 7px;

}
.news-box .item-box.bottom-margin {
	margin-bottom: 30px;
}
.news-box .item-box:hover {
	box-shadow: 0px 0px 5px rgba(0,0,0,0.6);
	-moz-box-shadow: 0px 0px 5px rgba(0,0,0,0.6);
	-ms-box-shadow: 0px 0px 5px rgba(0,0,0,0.6);
	-webkit-box-shadow: 0px 0px 5px rgba(0,0,0,0.6);
	-o-box-shadow: 0px 0px 5px rgba(0,0,0,0.6);
}
.news-box .item-box img {
	position: absolute;
	top : 0;
	left: 0;
	width: 100%;
	height: 300px;
	object-position: center;
	object-fit: cover;
	z-index: 1;
}
.news-box .item-box:hover img {
	top : -20px;
	left: -10%;
	width: 120%;
	height: 320px;
	object-position: center;
	object-fit: cover;
}
.news-box .item-box .text-area {
	position: absolute;
	top : 0;
	right: 0;
	width: 50%;
	height: 100%;
	padding: 2% 5%;
	background: rgba(255,255,255,0.8);
	z-index: 2;
}
.news-box .item-box:hover .text-area {
	width: 52%;
	background: rgba(255,255,255,0.9);
}
.news-box .item-box .text-area .line {
	width: 50%;
	height: 2px;
	background: var(--green-wardah);
	margin : 20px 0;
}
.news-box .item-box.loading .text-area .line {
	background: #ccc;
}
.news-box .item-box .text-area .content {
	min-height: 200px;
	width: 100%;
}
.news-box .item-box .text-area .content h1 {
	/*font-family:'Gotham-Medium';*/
	font-size: 14px;
	color: var(--green-wardah);
	margin-bottom: 10px;
	line-height: 1.2;
}
.news-box .item-box .text-area .content h1.loading {
	width: 90%;
	height: 25px;
}
.news-box .item-box .text-area .content p {
	/*font-family:'Gotham-Book';*/
	color: #646867;
	font-size: 13px;
	line-height: 1.4;
}
.news-box .item-box .text-area .content p.loading {
	width: 70%;
	height: 15px;
}
.news-box .item-box .text-area .attribute {
	width: 100%;
	display: flex;
	justify-content: space-between;
}
.news-box .item-box .text-area .attribute span.date {
	/*font-family:'Gotham-Book';*/
	color: var(--green-wardah);
	font-size: 12px;
}
.news-box .item-box .text-area .attribute span.date.loading {
	width: 30%;
	height: 20px;
}
.news-box .item-box .text-area .attribute a {
	/*font-family:'Gotham-Medium';*/
	color: var(--green-wardah);
	font-size: 12px;
	text-decoration: none;
}
.news-box .item-box .text-area .attribute a:hover {
	cursor: pointer;
	opacity: 0.8;
}
.news-box .see-more-area {
	width: 100%;
	margin-top: 50px;
	text-align: right;
}
.news-box .see-more-area a {
	text-decoration: none;
	color: #646867;
	/*font-family:'Gotham-Medium';*/
	font-size: 18px;
	opacity: 0.7;
}
.news-box .see-more-area a:hover {
	opacity: 1;
}
header .icon-area {
	width: 15%;
	text-align: right;
	align-items: flex-end;
}
header .icon-area button.show-sidebar {
	background: none;
	outline: none;
	border: none;
	color: #fff;
	font-size: 23px;
}
.segment .wrapper.product-brand {
}
.product-brand .heading-product-brand {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 30px;
}
.product-brand .heading-product-brand .image-area {
	width: 300px;
	height: 300px;
	position: relative;
}
.product-brand .heading-product-brand .image-area .overlay-line {
	position: absolute;
	top : 10px;
	left: -10px;
	border : solid 2px var(--green-wardah);
	border-radius: 10px;
	z-index: 1;
	width: 295px;
	height: 295px;
}
.product-brand .heading-product-brand .image-area img {
	position: absolute;
	top : 0;
	left: 0;
	width: 300px;
	height: 300px;
	object-fit: cover;
	object-position: center;
	border-radius: 10px;
	z-index: 2;
}
.product-brand .heading-product-brand .detail-container {
	width: 72%;
}
.product-brand .heading-product-brand .detail-container  h1 {
	/*font-family:'Gotham-Medium';*/
	color: var(--green-wardah);
	font-size: 42px;
	margin-bottom: 10px;
}
.category-area {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
	width: 100%;
	margin-bottom: 20px;
	margin-top: 20px;
	position: relative;
}
.category-area .item {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	border: solid 1px var(--green-wardah);
	padding: 15px 30px;
	border-radius: 20px;
	background: #fff;
	color: var(--green-wardah);
	position: relative;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	margin : 0 5px 10px 0;
	/*font-family:'Gotham-Medium';*/
}
.category-area .item:hover {
	cursor: pointer;
	opacity: 0.6;
}
.category-area .item.active {
	color: #fff;
	background: var(--green-wardah);
}
.category-area .item img {
	margin-right: 10px;
	width: 20px;
}
.category-area .item span {
	/*font-family:'Gotham-Book';*/
	font-size: 11px;
}
.product-brand .heading-product-brand .detail-container  .desc {
	width: 100%;
	/*font-family:'Gotham-Book';*/
	color: #646867;
	line-height: 1.5;
	font-size: 16px;
}
.product-brand .body-product-brand {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
}
.tag-box {
	width: 260px;
	padding: 20px;
	background: #fff;
	border : none;
	box-shadow: 0px 0px 7px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 7px rgba(0,0,0,0.3);
	-ms-box-shadow: 0px 0px 7px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 7px rgba(0,0,0,0.3);
	-o-box-shadow: 0px 0px 7px rgba(0,0,0,0.3);
	border-radius: 5px;
}
.tag-box.onpopup {
	width: 100%;
	padding: 0;
	background: none;
	box-shadow: none;
	padding-bottom: 150px;
}
.tag-box ul {
	padding: 0;
	width: 100%;
	list-style: none;
}
.tag-box ul li {
	padding: 7px 0;
	/*font-family:'Gotham-Medium';*/
	color: #337ab7;
	font-size: 14px;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
}
.tag-box ul li a {
	color: var(--green-wardah);
}
.tag-box ul li span.active {
	text-decoration: underline;
}
.tag-box ul li ul.child {
	padding-top: 5px;
}
.tag-box ul li ul.child li {
	/*font-family:'Gotham-Book';*/
	color: #646867;
	font-size: 13px;
}
.tag-box ul li ul.child li a {
	/*font-family:'Gotham-Book';*/
	color: #646867;
}
.tag-box ul li ul.child li a.active {
	text-decoration: underline;
	color: #272727;
}
.tag-box ul li:hover {
	cursor: pointer;
	opacity: 0.8;
	padding-left: 10px;
}
.tag-box ul li.loader-list {
	width: 100%;
	margin-bottom: 10px;
	height: 13px;
}
.tag-box ul li.loader-list.indent {
	width: 90%;
	margin-left: 10%;
	height: 10px;
}
.product-brand .body-product-brand .product-item {
	width: 72%;
}
.product-brand .body-product-brand .product-item .heading-panel-product {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 30px;
}
.product-brand .body-product-brand .product-item .heading-panel-product button.green {
	padding: 10px 20px;
}
.product-brand .body-product-brand .product-item .breadcrumb-area {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	color: #646867;
	font-size: 14px;
}
.product-brand .body-product-brand .product-item .breadcrumb-area a {
	color: #337ab7;
	/*font-family:'Gotham-Book';*/
}
.product-brand .body-product-brand .product-item .breadcrumb-area span {
	font-size: 12px;
	padding: 0 10px;
}
.product-brand .body-product-brand .product-item .pagination-area {
	width: 100%;
	display: flex;
	justify-content: flex-end;
	align-items: center;
}
.product-brand .body-product-brand .product-item .pagination-area .number-area {
	margin: 0 10px;
}
.product-brand .body-product-brand .sort-button-area {
	width: 100%;
	margin : 20px 0;
	text-align: center;
	display: flex;
	justify-content: center;
}
.product-brand .body-product-brand .sort-button-area button {
	min-width: 150px;
	display: inline-block;
}
.segment .wrapper.product-detail {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
	margin-top: 30px;
	position: relative;
}
.segment .wrapper.product-detail button.green-circle {
	background: var(--green-wardah);
	color: #fff;
	position: absolute;
	top : 0;
	left: 2%;
	width: 40px;
	height: 40px;
	border-radius: 20px;
	box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-ms-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	border: none;
	outline: none;
	z-index: 99;
}
.segment .wrapper.product-detail button.green-circle i.fa {
	position: absolute;
	top : 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.product-detail .product-display {
	width: 55%;
	position: relative;
}
.product-detail .product-display .slide-main {
	width: 80%;
	margin-bottom: 20px;
	padding: 1px;
}
.product-detail .product-display .slide-main .item {
	width: 100%;
	text-align: center;
	padding: 2px;
}
.product-detail .product-display .slide-main .item img {
	width: 100%;
	display: inline-block;
}
.product-detail .product-display .slide-nav {
	position: absolute;
	z-index: 2;
	top : 50%;
	right: 0;
	transform: translate(0,-50%);
	width: 40%;
}
.product-detail .product-display .slide-nav button.nav {
	font-size: 18px;
	color: var(--green-wardah);
	background : none;
	outline: none;
	border : none;
}
.product-detail .product-display .slide-nav .slide-area {
	width: 100%;
}
.product-detail .product-display .slide-nav .slide-area img {
	width: 100%;
}
.product-detail .product-content {
	width: 40%;
}
.product-detail .product-content .title-segment-product {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.product-detail .product-content .title-segment-product h1 {
	width: 80%;
}
.product-detail .product-content .title-segment-product button {
	padding: 10px;
	background: none;
	outline: none;
	border: solid 1px var(--green-wardah);
	color: var(--green-wardah);
	border-radius: 20px;
	min-width: 15%;
} 
.product-detail .product-content h1 {
	/*font-family:'Gotham-Medium';*/
	color: var(--green-wardah);
	font-size: 36px;
	margin-bottom: 30px;
}
.product-detail .product-content h2 {
	/*font-family:'Gotham-Medium';*/
	color: var(--green-wardah);
	font-size: 23px;
	margin-bottom: 20px;
}
.product-detail .product-content  p {
	/*font-family:'Gotham-Book';*/
	color: #646867;
	font-size: 12px;
	line-height: 1.4;
	margin-bottom: 10px;
}
.product-detail .product-content hr {
	width: 100%;
	margin : 30px 0;
	border : none;
	height: 1px;
	background : var(--green-wardah);
}
.product-detail .product-content .product-recommend {
	margin-top: 30px;
}
.product-detail .product-content .variant-area {
	width: 100%;
	margin: 30px 0;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
}
.product-detail .product-content .variant-area .item-variant {
	width: 40px;
	height: 40px;
	margin: 0 8px 8px 0;
	position: relative;
	border-radius: 21px;
	position: relative;
	border: solid 1px var(--green-wardah);
	overflow: hidden;
}
.product-detail .product-content .variant-area .item-variant .top {
	width: 120px;
    top:-20px;
    left:50%;
    transform:translate(-50%, -100%);
    padding:10px 10px;
    color:#FFFFFF;
    background-color:#000000;
    font-weight:normal;
    font-size:13px;
    border-radius:8px;
    position:absolute;
    z-index:99999999;
    box-sizing:border-box;
    border:1px solid transparent;box-shadow:0 1px 8px rgba(0,0,0,0.5);
    visibility:hidden; opacity:0; transition:opacity 0.8s;
    text-align: center;
}
.product-detail .product-content .variant-area .item-variant:hover .top {
    visibility:visible; opacity:1;
}
.product-detail .product-content .variant-area .item-variant .top i {
    position:absolute;
    top:100%;
    left:50%;
    margin-left:-5px;
    width:10px;
    height:5px;
    overflow:hidden;
}
.product-detail .product-content .variant-area .item-variant .top i::after {
    content:'';
    position:absolute;
    width:5px;
    height:5px;
    left:50%;
    transform:translate(-50%,-50%) rotate(45deg);
    background-color:#000000;
    border:1px solid transparent;box-shadow:0 1px 8px rgba(0,0,0,0.5);
}
.product-detail .product-content .variant-area .item-variant .top p {
	margin-bottom: 0;
}
.product-detail .product-content .variant-area .item-variant.squarea {
	border-radius: 0;
}
.product-detail .product-content .variant-area .item-variant.active {
	border: solid 2px var(--green-wardah);
	margin: 0 4px 4px 0;
	border-radius: 22px;
}
.product-detail .product-content .variant-area .item-variant:hover {
	cursor: pointer;
	opacity: 0.8;
}
.product-detail .product-content .variant-area .item-variant .color-area {
	width: 40px;
	height: 40px;
	border-radius: 20px;
	position: relative;
}
.product-detail .product-content .variant-area .item-variant .color-area span {
	/*font-family:'Gotham-Book';*/
	color: #fff;
	position: absolute;
	top : 50%;
	left: 50%;
	transform: translate(-50%,-47%);
	font-size: 12px;
}
.product-detail .product-content .variant-area .item-variant .image-area {
	width: 40px;
	height: 40px;
	object-fit: cover;
	object-position: center;
}


.product-detail .product-display.mobile .slide-nav-second {
	margin: 20px 0;
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.product-detail .product-display.mobile button.nav {
	background: none;
	outline: none;
	color: var(--green-wardah);
	font-size: 18px;
	border : none;
	padding: 0;
}
.product-detail .product-display.mobile .slide-area {
	width: 80%;
}
.product-detail .product-display.mobile .item-variant {
	width: 40px;
	height: 40px;
	margin: 0 8px 8px 0;
	position: relative;
	border-radius: 20px;
	position: relative;
	text-align: center;
}
.product-detail .product-display.mobile .item-variant span {
	position: absolute;
	top : 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	color: #fff;
}
.product-detail .product-display.mobile .item-variant.square {
	border-radius: 0;
}
.product-detail .product-display.mobile .item-variant .color-area {
	width: 40px;
	height: 40px;
	border-radius: 20px;
	display: inline-block;
}
.product-detail .product-display.mobile .item-variant .image-area {
	width: 40px;
	height: 40px;
	object-fit: cover;
	object-position: center;
	display: inline-block;
}
.product-detail .product-content .button-tab-area {
	width: 100%;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	margin-bottom: 20px;
	flex-wrap: wrap;
}
.product-detail .product-content .button-tab-area .quantity-container-detail {
	width: 94%;
	padding: 3%;
	background: #f8f8f8;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
	border-radius: 10px;
}
.product-detail .product-content .button-tab-area .quantity-container-detail b {
	/*font-family:'Gotham-Medium';*/
	font-size: 14px;
	color: #777;
	width: 30%;
}
.product-detail .product-content .button-tab-area button {
	margin-right: 10px;
	background: #fff;
	border : solid 1px var(--green-wardah);
	color: var(--green-wardah);
	/*font-family:'Gotham-Book';*/
	font-size: 12px;
	padding: 10px 20px;
	border-radius: 20px;
}
.product-detail .product-content .button-tab-area button.buy {
	width: 150px;
	padding: 15px 0;
	font-size: 14px;
	border-radius: 30px;
	margin-bottom: 10px;
}
.product-detail .product-content .button-tab-area button.buy.add-to-cart {
	margin-bottom: 0;
	margin-right: 0;
	margin-left: 5px;
	background: var(--green-wardah);
	color: #fff;
}
.product-detail .product-content .button-tab-area button:hover {
	opacity: 0.6;
	background: var(--green-wardah);
	color: #fff;
}
.product-detail .product-content .button-tab-area button.active {
	background: var(--green-wardah);
	color: #fff;
}
.product-detail .product-content .tab-content {
	width: 90%;
	padding: 5%;
	background: #e5fbfb;
	border-radius: 5px;
}
.product-detail .product-content .tab-content .item {
	display: none;
}
.product-detail .product-content .tab-content .item.active {
	display: block;
}
.product-detail .product-information-accordion {
	width: 100%;
}
.product-detail .product-information-accordion fieldset {
	width: 100%;
	margin-bottom: 10px;
	border:none;
	border-top: dashed 1px var(--green-wardah);
	position: relative;
}
.product-detail .product-information-accordion fieldset legend {
	/*font-family:'Gotham-Medium';*/
	color: #646867;
	font-size: 23px;
	margin-bottom: 20px;
	text-align: left;
	width: 100%;
	padding: 0;
	padding-right: 10px;
	background: #fff;
	width: auto;
	float: left;
	margin-top: -15px;
	padding-right: 10px
}
.product-detail .product-information-accordion fieldset button.toggle {
	float: right;
	margin-right: 0;
	margin-top: -15px;
	width: 30px;
	height: 30px;
	border: solid 2px var(--green-wardah);
	border-radius: 17px;
	background: #fff;
	color: var(--green-wardah);
	box-shadow: 0px 0px 2px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 2px rgba(0,0,0,0.3);
	-ms-box-shadow: 0px 0px 2px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 2px rgba(0,0,0,0.3);
	-o-box-shadow: 0px 0px 2px rgba(0,0,0,0.3);
	transform: none;
	position: relative;
}
.product-detail .product-information-accordion fieldset button.toggle i.fa {
	position: absolute;
	top : 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.product-detail .product-information-accordion fieldset.on button.toggle {
	transform: rotate(180deg);
}
.product-detail .product-information-accordion fieldset button.toggle:hover {
	box-shadow: 0px 0px 4px rgba(0,0,0,0.4);
	-moz-box-shadow: 0px 0px 4px rgba(0,0,0,0.4);
	-ms-box-shadow: 0px 0px 4px rgba(0,0,0,0.4);
	-webkit-box-shadow: 0px 0px 4px rgba(0,0,0,0.4);
	-o-box-shadow: 0px 0px 4px rgba(0,0,0,0.4);
}
.product-detail .product-information-accordion fieldset .desc {
	width: 100%;
	font-size: 13px;
	line-height: 1.3;
	/*font-family:'Gotham-Book';*/
	color: #646867;
	margin-top: 30px;
}
.product-detail .product-information-tabs {
	width: 100%;
}
.product-detail .product-information-tabs .tab-area {
	width: 100%;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	background: var(--green-wardah);
	border: solid 1px var(--green-wardah);
	border-bottom: none;
}
.product-detail .product-information-tabs .tab-area button {
	padding: 10px 10px;
	border-right: 1px var(--green-wardah);
	background: var(--green-wardah);
	outline: none;
	/*font-family:'Gotham-Medium';*/
	color: #fff;
	border: none;
	border-right: solid 1px #fff;
}
.product-detail .product-information-tabs .tab-area button.on {
	background: #fff;
	border-bottom: none;
	color: #444;
	border-right: none;
}
.product-detail .product-information-tabs .content-body {
	width: 98%;
	padding: 20px 1%;
	border: solid 1px var(--green-wardah);
	border-top: none;
	margin-top: -1px;
	background: #fff;
	position: relative;
	z-index: 3;
}
.product-detail .product-information-tabs .content-body .content-item {
	width: 100%;
	/*font-family:'Gotham-Book';*/
	font-size: 13px;
	color: #646867;
	line-height: 1.3;
	display: none;
}
.product-detail .product-information-tabs .content-body .content-item.on {
	display: block;
}
.product-detail .product-information {
	width: 94%;
	padding: 3%;
	border-radius: 20px;
	border : solid 3px var(--green-wardah);
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
	background: #e5fbfb;
	margin: 50px 0 20px 0;
	position: relative;
}
.product-detail .product-information .separator {
	width: 0;
	border-left: dashed 1px  var(--green-wardah);
	height: 90%;
	position: absolute;
	z-index: 2;
	top : 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.product-detail .product-information .segment {
	width: 46%;
	text-align: left;
}
.product-detail .product-information .segment h1 {
	/*font-family:'Gotham-Medium';*/
	color: #646867;
	font-size: 23px;
	margin-bottom: 20px;
	text-align: left;
	width: 100%;
}
.product-detail .product-information .segment .desc {
	width: 100%;
	font-size: 13px;
	line-height: 1.2;
	/*font-family:'Gotham-Book';*/
	color: #646867;
}
.product-detail .product-information .segment .desc p {
	color: #646867;	
	margin-bottom: 10px;
}
.product-detail .product-recommend {
	width: 100%;
	margin-top: 20px;
}
.product-detail .product-recommend fieldset {
	margin-bottom: 50px;
}
.popup-filter {
	position: fixed;
	z-index: 99;
	top : 0;
	left: 0;
	width: 90%;
	height: 100%;
	padding: 100px 5% 5% 5%;
	background: #fff;
	display: none;
	overflow-y: scroll;
}
.popup-filter  .title {
	/*font-family:'Gotham-Book';*/
	color: var(--green-wardah);
	text-align: center;
	width: 100%;
	margin-bottom: 20px;
	font-size: 16px;
}
.popup-filter .button-area {
	width: 100%;
	margin-top: 30px;
	text-align: center;
}
.popup-filter .button-area button {
	min-width: 150px;
}
.sidebar {
	position: fixed;
	width: 90%;
	padding: 10% 5%;
	height: 100%;
	top : 60px;
	right: -100%;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	background: var(--green-wardah);
	z-index: 100;
	overflow-y: scroll;
}
.sidebar.on {
	right: 0;
}
.sidebar .menu-container {
	width: 100%;
	display: flex;
	justify-content: flex-end;
	flex-wrap: wrap;
	margin-bottom: 150px;
}

.sidebar .menu-container .item-menu {
	width: 90%;
	padding-right: 10%;
	margin-bottom: 15px;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	text-align: right;
	opacity: 0;
}
.sidebar .menu-container .item-menu.on {
	padding-right: 0;
	opacity: 1;
}
.sidebar .menu-container .item-menu a {
	font-size: 16px;
	color: #fff;
	opacity: 0.7;
	/*font-family:'Gotham-Book';*/
}
.sidebar .menu-container .item-menu.parent a {
	opacity: 1;
	font-size: 18px;
}
.sidebar .menu-container .search-container {
	width: 94%;
	margin-bottom: 30px;
	background: #fff;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-radius: 20px;
	padding: 10px 3%;
}
.sidebar .menu-container .search-container form {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.sidebar .menu-container .search-container input {
	background: none;
	outline: none;
	border : none;
	background: none;
	color: #888;
	width: 80%;
}
.sidebar .menu-container .search-container button {
	background: none;
	outline: none;
	border : none;
	color: #999;
}
.sidebar .menu-container .item-menu select {
	padding: 5% 10% 5% 5%;
	border : solid 1px #fff;
	color: #fff;
	/*font-family:'Gotham-Book';*/
	background: none;
	position: relative;
}
.sidebar .menu-container .item-menu select::after {
	content: 'A';
	position: absolute;
	color: #fff;
	top : 50%;
	right: 10px;
}
.popup.popup-buy {
	width: 500px;
	padding: 20px;
	display: none;
}
.popup.popup-buy .close-popup {
	position: absolute;
	top : 10px;
	right: 10px;
	background: none;
	outline: none;
	border : none;
	color: var(--green-wardah);
	font-size: 23px;
}
.popup.popup-buy .wrapper {
	width: 90%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items: flex-start;
	overflow-y: scroll;
	height: 400px;
}
.popup.popup-buy .wrapper .item-market {
	width: 40%;
	padding: 4%;
	border : solid 1px #f0f0f0;
	margin-bottom: 20px;
	border-radius: 10px;
}
.popup.popup-buy .wrapper .item-market img {
	width: 100%;
	height: 100px;
	object-fit: contain;
	object-position: center;
}
.popup.popup-buy .wrapper .item-market .button-area {
	width: 100%;
	text-align: center;
	margin-top: 20px;
}

.daq-container {
	width: 100%
}
.daq-container fieldset {
	border-top: solid 1px #ccc;
}
.daq-container fieldset legend {
	font-size: 23px;
	padding-left: 0;
}
.daq-container p {
	font-size: 16px;
	margin-bottom: 20px;
}
.title-center-green {
	width: 100%;
	margin-bottom: 40px;
	color: var(--green-wardah);
	/*font-family:'Gotham-Medium';*/
	font-size: 26px;
	text-align: center;
}
.virtual-area {
	width: 100%;
	background: #fff;
	padding:2.5%;
	border-radius: 20px;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
	box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	-ms-box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	-o-box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
}
.virtual-area .perfect-mode {
	width: 360px;
	height: 480px;
	background: #f0f0f0;
	position: relative;
}
.virtual-area .perfect-mode button#loader-ymk {
	position: absolute;
	top : 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	background: none;
	outline: none;
	color: var(--green-wardah);
	border : none;
	font-size: 23px;
}
.virtual-area .perfect-mode .result {
	position: absolute;
	top : 0;
	left: 0;
	width: 100%;
	z-index: 2;
}
.virtual-area .perfect-mode .category-dropdown {
	position: absolute;
	top : 20px;
	left: 5%;
	background: var(--green-wardah);
	padding: 15px;
	color: #fff;
	border-radius: 30px;
	box-shadow: 1px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 1px 0px 3px rgba(0,0,0,0.3);
	-ms-box-shadow: 1px 0px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 1px 0px 3px rgba(0,0,0,0.3);
	-o-box-shadow: 1px 0px 3px rgba(0,0,0,0.3);
	z-index: 9;
	width: 100px;
}
.virtual-area .perfect-mode .take-photo-virtual {
	position: absolute;
	top: 20px;
	right: 5%;
	background: var(--green-wardah);
	padding: 27px;
	color: #fff;
	border-radius: 30px;
	box-shadow: 1px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 1px 0px 3px rgba(0,0,0,0.3);
	-ms-box-shadow: 1px 0px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 1px 0px 3px rgba(0,0,0,0.3);
	-o-box-shadow: 1px 0px 3px rgba(0,0,0,0.3);
	z-index: 9;
	border: none;
	outline: none;

}
.virtual-area .perfect-mode .take-photo-virtual.transparent {
	bottom: 0px;
	width: 100%;
	height: 150px;
	opacity: 0;
}
.virtual-area .perfect-mode .take-photo-virtual i {
	position: absolute;
	top : 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.virtual-area .perfect-mode .category-dropdown .active-category {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.virtual-area .perfect-mode .overlay {
	position: absolute;
	top : 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.3);
	z-index: 96;
	display: none;
}
.virtual-area .perfect-mode .category-dropdown-area {
	position: absolute;
	top : 50%;
	left: 50%;
	width: 60%;
	background: #fff;
	border-radius: 20px;
	display: none;
	z-index: 99;
	transform: translate(-50%,-50%);
}
.virtual-area .perfect-mode .category-dropdown-area .item {
	width: 80%;
	padding: 10%;
	color: var(--green-wardah);
	border-bottom: solid 1px #f0f0f0;
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
.virtual-area .perfect-mode .category-dropdown-area .item:hover {
	cursor: pointer;
}
.virtual-area .perfect-mode .category-dropdown-area .item:last-child {
	border-bottom: none;
}
.virtual-area .perfect-mode .category-dropdown-area .item .checkbox {
	width: 16px;
	height: 16px;
	border : solid 1px #f0f0f0;
	border-radius: 9px;
	margin-right: 10px;
	background: #fff;
}

.virtual-area .perfect-mode .category-dropdown-area .item.active.active .checkbox {
	background: var(--green-wardah);
}
.virtual-area .pallete-area {
	width: 57%;
	margin-left: 3%;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;

}
.virtual-area .pallete-area .tabs {
	width: 100%;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
	margin-bottom: 20px;
}
.virtual-area .pallete-area .tabs .tab {
	padding: 10px 20px;
	border-radius: 20px;
	margin: 0 6px 6px 0;
	/*font-family:'Gotham-Book';*/
	color: var(--green-wardah);
	font-size: 14px;
	border : solid 1px var(--green-wardah);
}
.virtual-area .pallete-area .tabs .tab.active {
	background: var(--green-wardah);
	color: #fff;
}
.virtual-area .pallete-area .product-items {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 20px 0;
	background: #f9f9f9;
	padding: 10px;
}
.virtual-area .pallete-area .product-items button.nav {
	color: var(--green-wardah);
	background: none;
	outline: none;
	border : none;
	font-size: 16px;
}
.virtual-area .pallete-area .product-items button.nav.disabled {
	color: #888;
}
.virtual-area .pallete-area .product-items .slide-area {
	width: 100%;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
}
.virtual-area .pallete-area .product-items .slide-area.slick-slider {
	width: 90%;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
}
.virtual-area .pallete-area .product-items .slide-area .product-item {
	width: 25%;
	margin: 0 5px;
	background: #fff;
	padding: 10px;
	min-height: 230px;
	border-radius: 5px;
	/* flex-grow: 1; */
	border : solid 1px transparent;
	box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	-moz-box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	-ms-box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	-o-box-shadow: 0px 0px 2px rgba(0,0,0,0.2);
}
.virtual-area .pallete-area .product-items .slide-area .product-item.active {
	border : solid 1px var(--green-wardah);
}
.virtual-area .pallete-area .product-items .slide-area .product-item img {
	width: 100%;
	height: 150px;
	object-position: center;
	object-fit: cover;
}
.virtual-area .pallete-area .product-items .slide-area .product-item .name {
	width: 100%;
	margin-top: 10px;
	min-height: 30px;
	color: #555;
	text-align: center;
	/*font-family:'Gotham-Book';*/
	line-height: 1.2;
}
.virtual-area .pallete-area .color-area {
	width: 100%;
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	align-items: flex-start;
	margin-bottom: 30px;
}
.virtual-area .pallete-area .color-area .color {
	width: 30px;
	height: 30px;
	border : solid 2px transparent;
	border-radius: 15px;
	margin: 0 5px 5px 0;
	position: relative;
}
.virtual-area .pallete-area .color-area .color.active {
	border : solid 2px var(--green-wardah);
}
.virtual-area .pallete-area .color-area .color span {
	position: absolute;
	top : 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	color: #fff;
	/*font-family:'Gotham-Book';*/
	font-size: 12px;
	text-shadow : 0px 0px 3px rgba(0,0,0,0.3);
}
.virtual-area .pallete-area .color-area .color:hover {
	cursor: pointer;
	opacity: 0.8;
}
.virtual-area .pallete-area .product-snippet {
	width: 94%;
	padding: 5% 3%;
	background: #fff;
	border : solid 1px var(--green-wardah);
	border-radius: 10px;
}
.virtual-area .pallete-area .product-snippet .wrapper {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
	padding: 0;
}
.virtual-area .pallete-area .product-snippet .wrapper .back-area {
	width: 100%;
	margin-bottom: 20px;
	text-align: left;
}
.virtual-area .pallete-area .product-snippet .wrapper .back-area button {
	background: none;
	outline: none;
	border: none;
	color: #272727;
	/*font-family:'Gotham-Book';*/
	font-size: 14px;
}
.virtual-area .pallete-area .product-snippet .wrapper .back-area button span {
	color: var(--green-wardah);
}
.virtual-area .pallete-area .product-snippet .wrapper .thumb-area {
	width: 23%;
	border-radius: 10px;
	background: #fff;
	box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
	-ms-box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
	-o-box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
	padding: 10px;
	margin-right: 10px;
}
.virtual-area .pallete-area .product-snippet .wrapper .thumb-area img {
	width: 100%;
}
.virtual-area .pallete-area .product-snippet .wrapper .text-area {
	width: 70%;
	color: var(--green-wardah);
}
.virtual-area .pallete-area .product-snippet .wrapper .text-area h1 {
	margin : 0 0 10px 0;
	/*font-family:'Gotham-Medium';*/
	font-size: 18px;
}
.virtual-area .pallete-area .product-snippet .wrapper .text-area p {
	margin : 10px 0 20px 0;
	/*font-family:'Gotham-Book';*/
	font-size: 12px;
	line-height: 1.2;
}
.virtual-area.analyzer {
	padding: 0;
	width: 700px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
}
.virtual-area.complexion {
	overflow: hidden;
}
.virtual-area.analyzer.result {
	width: 800px;
}
.virtual-area.analyzer .camera-area {
	width: 350px;
	min-height: 400px;
	background: #f0f0f0;
	border-radius: 20px 0 0 20px;
	overflow: hidden;
	position: relative;
}
.wrapper-headline-detail {
	width: 1100px;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.virtual-area.analyzer .left-segment {
	width: 40%;
	padding: 5%;
	text-align: center;
}
.virtual-area.analyzer .left-segment.takequest {
	opacity: 0;
	transition: all 0.5s;
	-moz-transition: all 0.5s;
	-ms-transition: all 0.5s;
	-webkit-transition: all 0.5s;
	-o-transition: all 0.5s;
}
.virtual-area.analyzer .left-segment.takequest.on {
	opacity: 1;
}
.virtual-area.analyzer .left-segment.popquest {
	position: absolute;
	top : 50%;
	right: 0;
	background: #fff;
	border-radius: 0 20px 20px 0;
	transform: translate(0, -50%);
	padding: 10% 5%;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
}
.virtual-area.analyzer .left-segment.popquest.off {
	right: -50%;
}
.virtual-area.analyzer .left-segment.center-flex {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
.virtual-area.analyzer .left-segment h1 {
	margin-bottom: 20px;
	/*font-family:'Gotham-Book';*/
	color: #666;
	font-size: 18px;
}
.virtual-area.analyzer .left-segment h1.left {
	text-align: left;
}
.virtual-area.analyzer .left-segment h1.question {
	margin-bottom: 40px;
	color: var(--green-wardah);
	font-size: 21px;
	line-height: 1.2;
	width: 100%;
}
.virtual-area.analyzer .left-segment h1.less-margin {
	margin-bottom: 10px;
}
.virtual-area.analyzer .left-segment p {
	/*font-family:'Gotham-Book';*/
	color: #888;
	font-size: 12px;
	line-height: 1.4;
	text-align: left;
}
.virtual-area.analyzer .camera-area .camera-screen {
	position: relative;
	width: 350px;
	height: 400px;
	z-index: 1;
}
.virtual-area.analyzer .camera-area .camera-result {
	position: absolute;
	width: 350px;
	height: 400px;
	z-index: 3;
	top : 0;
	left: 0;
}
.virtual-area.analyzer .camera-area .camera-overlay {
	width: 90%;
	position: absolute;
	top : 50%;
	left: 50%;
	transform: translate(-50%,-65%);
	z-index: 2;
}
.virtual-area.analyzer .camera-area .camera-overlay img {
	width: 100%;
}
.virtual-area .camera-area .camera-overlay img.picker {
	cursor: crosshair;
}
.virtual-area.analyzer .camera-area .camera-result img {
	width: 350px;
	height: 400px;
	object-fit: cover;
	object-position: center;
}
.virtual-area.analyzer .camera-area .camera-result img.picker {
	cursor: crosshair;
}
.virtual-area.analyzer .left-segment button.yesno {
	width: 70%;
	background: #fff;
	border : none;
	outline: none;
	padding: 10px 5%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-ms-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-o-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	border-radius: 25px;
	margin-bottom: 10px;
	position: relative;
}
.virtual-area.analyzer .left-segment button.yesno.goback {
	margin-top: 20px;
	box-shadow: none;
	border : solid 1px #f0f0f0;
	padding: 5px 3%;
}
.virtual-area.analyzer .left-segment button.yesno:hover {
	box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
	-ms-box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
	-o-box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
}
.virtual-area.analyzer .left-segment button.yesno .icon {
	width: 30px;
	height: 30px;
	color: #fff;
	background: var(--green-wardah);
	border-radius: 15px;
	font-size: 11px;
	position: relative;
}
.virtual-area.analyzer .left-segment button.yesno .icon i {
	position: absolute;
	top : 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.virtual-area.analyzer .left-segment button.yesno .text {
	text-align: center;
	color: var(--green-wardah);
	/*font-family:'Gotham-Medium';*/
	position: absolute;
	top : 50%;
	left: 50%;
	transform: translate(-50%,-40%);
}
.virtual-area.analyzer .left-segment button.yesno .balancer {
	width: 30px;
}
.virtual-area .left-segment.result-analyzer {
	width: 50%;
	padding: 0 0 0 5%;
	min-height: 400px;
	height: 400px;
	overflow-y: scroll;
	align-items: flex-start;
	flex-direction: inherit;
	justify-content: flex-start;
}
.virtual-area .left-segment.result-analyzer.fit {
	min-height: 350px;
	height: 350px;
}
.virtual-area .left-segment.result-analyzer h1 {
	margin-top: 20px;
	width: 90%;
	margin-right: 10%;
}
.virtual-area .left-segment.result-analyzer p {
	margin-top: 10px;
	width: 90%;
	margin-right: 10%;
}
.virtual-area .left-segment.result-analyzer .slide-product-area {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
	flex-direction: column;
}
.virtual-area .left-segment.result-analyzer .slide-product-area .product-slide-area {
	width: 100%;
	margin-top: 10px;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
}
.virtual-area .left-segment.result-analyzer .slide-product-area .product-slide-area a {
	text-decoration: none;
}
.virtual-area .left-segment.result-analyzer .slide-product-area .product-slide-area .item {
	width: 130px;
	margin-right: 10px;
	height: 180px;
	background: #fff;
	box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-ms-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-o-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	overflow: hidden;
	border-radius: 10px;
	padding: 10px;
	border: solid 1px #f0f0f0;
}
.virtual-area .left-segment.result-analyzer .slide-product-area .product-slide-area .item.slim { 
	width: 110px;
}
.virtual-area .left-segment.result-analyzer .slide-product-area .product-slide-area .item img {
	width: 100%;
	height: 100px;
	object-fit: cover;
	object-position: center;
	margin-bottom: 20px;
}
.virtual-area .left-segment.result-analyzer .slide-product-area .product-slide-area .item .text-area {
	width: 100%;
}
.virtual-area .left-segment.result-analyzer .slide-product-area .product-slide-area .item .text-area span.tagline {
	color: #646262;
	/*font-family:'Gotham-Book';*/
	font-size: 10px;
}
.virtual-area .left-segment.result-analyzer .slide-product-area .product-slide-area .item .text-area h1 {
	color: #646262;
	/*font-family:'Gotham-Medium';*/
	margin-top: 5px;
	font-size: 12px;
}
.virtual-area .left-segment.result-analyzer .slide-product-area .button-nav-slider {
	width: 100%;
	margin: 30px 0;
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
.virtual-area .left-segment.result-analyzer .slide-product-area .button-nav-slider button {
	margin-right: 10px;
	width: 30px;
	height: 30px;
	position: relative;
	border : solid 1px var(--green-wardah);
	color: var(--green-wardah);
	outline: none;
	background: none;
	font-size: 13px;
	border-radius: 16px;
}
.virtual-area .left-segment.result-analyzer .slide-product-area .button-nav-slider button i {
	position: absolute;
	top : 50%;
	left: 50%;
	transform: translate(-50%,-40%);
}
.virtual-area.vertical {
	width: 400px;
}
.virtual-area.vertical .camera-area {
	width: 100%;
	border-radius: 20px 20px 0 0;
	position: relative;
}
.virtual-area.vertical .camera-area.result {
	overflow: visible;
}
.virtual-area.vertical .camera-area .camera-result {
	z-index: 1;
}
.virtual-area.vertical .camera-area  .predictive-area {
	position: absolute;
	bottom: 10px;
	left: 10px;
	z-index: 10;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	width: 90%;
}
.virtual-area.vertical .camera-area  .predictive-area .color-area {
	width: 20px;
	height: 20px;
	border-radius: 22px;
	border : solid 2px #fff;
	margin-right: 10px;
	box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-ms-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-o-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
}
.virtual-area.vertical .camera-area  .predictive-area .text {
	padding: 5px;
	background: #fff;
	/*font-family:'Gotham-Book';*/
	color: #333;
	font-size: 10px;
	border-radius: 5px;
	position: relative;
}
.virtual-area.vertical .camera-area  .predictive-area .text.after {
	margin-left: 5px;
}
.virtual-area.vertical .camera-area  .predictive-area .text::before {
	content: ' ';
	width: 10px;
	height: 10px;
	position: absolute;
	top : 50%;
	left: -5px;
	transform: translate(0,-50%) rotate(45deg);
	background: #fff;
}
.virtual-area.vertical .camera-area  .predictive-area .text.after::before {
	width: 0;
	height: 0;
}
.virtual-area.vertical .camera-area .share-media {
	position: absolute;
	bottom: -35px;
	right: 10px;
	width: 70px;
	height: 70px;
	border-radius: 35px;
	color: #fff;
	z-index: 11;
	padding: 0;
	box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-ms-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-o-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
}
.virtual-area.vertical .camera-area .share-media:hover {
	opacity: 1;
	box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
	-ms-box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
	-o-box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
	background: var(--dark-green-wardah);
}
.virtual-area.vertical .camera-area .share-media i {
	position: absolute;
	top : 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	font-size: 21px;
}
.virtual-area.vertical .camera-area .instruction-area {
	width: 84%;
	padding: 3%;
	position: absolute;
	z-index: 6;
	background: rgba(255,255,255,0.9);
	color: #272727;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	/*font-family:'Gotham-Book';*/
	font-size: 13px;
	box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-ms-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-o-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	border-radius: 10px;
	top : -100px;
	left: 50%;
	transform: translate(-50%,0);
	line-height: 1.2;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	opacity: 0;
}
.virtual-area.vertical .camera-area .instruction-area.on {
	opacity: 1;
	top : 15px;
}
.virtual-area.vertical .camera-area .help-instruction {
	width: 30px;
	height: 30px;
	box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-ms-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-o-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	border-radius: 15px;
	position: absolute;
	top : 7px;
	right: 10px;
	background: #fff;
	color: #222;
	z-index: 5;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	opacity: 0;
}
.virtual-area.vertical .camera-area .help-instruction.on {
	opacity: 1;
}
.virtual-area.vertical .camera-area .help-instruction.on:hover {
	cursor: pointer;
	opacity: 0.8;
}
.virtual-area.vertical .camera-area .instruction-area button {
	background: var(--red-error);
	border : none;
	color: #fff;
	outline: none;
	font-size: 18px;
	width: 30px;
	height: 30px;
	border-radius: 15px;
	margin-left: 5px;
	position: absolute;
	top : -10px;
	right: -10px;
	box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-ms-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-o-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
}
.virtual-area.vertical .camera-area .instruction-area button:hover {
	cursor: pointer;
	opacity: 0.9;
}
.virtual-area.vertical .option-area {
	width: 100%;
	z-index: 5;
	position: relative;
}
.virtual-area.vertical .option-area .color-pallete {
	width: 100%;
	height: 50px;
	border-top : solid 3px rgba(0,0,0,0.3);
	border-bottom : solid 3px rgba(0,0,0,0.3);
	position: relative;
}
.virtual-area.vertical .camera-area .camera-result {
	width: 100%;
	height: auto;
}
.virtual-area.vertical .camera-area .camera-result img {
	width: 100%;
}
.virtual-area.vertical .left-segment {
	width: 100%;
	padding: 0;
}
.virtual-area.vertical .left-segment.with-padding {
	width: 90%;
	padding: 5%;
}
.virtual-area.vertical .left-segment .button-area {
	width: 90%;
	padding: 5%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}
.virtual-area.vertical .options-group {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}
.virtual-area.vertical .options-group .item-opt {
	flex-grow: 1;
	background: var(--green-wardah);
	position: relative;
	height: 40px;
	border-right : solid 1px #fff;
	opacity: 0.7;
	overflow: hidden;
}
.virtual-area.vertical .options-group .item-opt.active {
	opacity: 1;
}
.virtual-area.vertical .options-group .item-opt:hover {
	cursor: pointer;
	opacity: 1;
}
.virtual-area.vertical .options-group .item-opt:last-child {
	border-right: 0;
}
.virtual-area.vertical .options-group .item-opt span {
	position: absolute;
	top : 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	/*font-family:'Gotham-Book';*/
	color: #fff;
}
.virtual-area.vertical .options-group .item-opt input[type=radio] {
	position: absolute;
	top : -20px;
}
.slidecontainer {
  width: 100%; /* Width of the outside container */
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(0,-50%);
  display: flex;
  justify-content: space-between;
}

/* The slider itself */
.virtual-area.vertical .option-area .color-pallete .slider {
  -webkit-appearance: none;  /* Override default CSS styles */
  appearance: none;
  width: 100%; /* Full-width */
  height: 2px; /* Specified height */
  background: #d3d3d3; /* Grey background */
  outline: none; /* Remove outline */
  opacity: 0.5; /* Set transparency (for mouse-over effects on hover) */
  -webkit-transition: .2s; /* 0.2 seconds transition on hover */
  transition: opacity .2s;
}

/* Mouse-over effects */
.virtual-area.vertical .option-area .color-pallete .slider:hover {
  opacity: 1; /* Fully shown on mouse-over */
  cursor: pointer;
}

/* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
.virtual-area.vertical .option-area .color-pallete .slider::-webkit-slider-thumb {
  -webkit-appearance: none; /* Override default look */
  appearance: none;
  width: 20px; /* Set a specific slider handle width */
  height: 20px; /* Slider handle height */
  cursor: pointer; /* Cursor on hover */
  box-shadow: 0px 0px rgba(0,0,0,0.3);
  -moz-box-shadow: 0px 0px rgba(0,0,0,0.3);
  -ms-box-shadow: 0px 0px rgba(0,0,0,0.3);
  -webkit-box-shadow: 0px 0px rgba(0,0,0,0.3);
  -o-box-shadow: 0px 0px rgba(0,0,0,0.3);
  border-radius: 12px;
  border : solid 2px #fff;
  background: #fff;
}

.virtual-area.vertical .option-area .color-pallete .slider::-moz-range-thumb {
  width: 20px; /* Set a specific slider handle width */
  height: 20px; /* Slider handle height */
  cursor: pointer; /* Cursor on hover */
  box-shadow: 0px 0px rgba(0,0,0,0.3);
  -moz-box-shadow: 0px 0px rgba(0,0,0,0.3);
  -ms-box-shadow: 0px 0px rgba(0,0,0,0.3);
  -webkit-box-shadow: 0px 0px rgba(0,0,0,0.3);
  -o-box-shadow: 0px 0px rgba(0,0,0,0.3);
  border-radius: 12px;
  border : solid 2px #fff;
  background: #fff;
}
.segment .wrapper.manifesto .manifesto-header {
	width: 100%;
	text-align: center;
	margin-bottom: 50px;
}
.segment .wrapper.manifesto .manifesto-header img {
	width: 350px;
}
.segment .wrapper.manifesto .manifesto-slide {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-self: flex-start;
}
.segment .wrapper.manifesto .manifesto-slide a {
	width: 33%;
}
.segment .wrapper.manifesto .manifesto-slide .item {
	width: 90%;
	text-align: center;
	margin: 0 5%;
}
.segment .wrapper.manifesto .manifesto-slide .item img {
	width: 60%;
	margin-bottom: 40px;
	display: inline-block;
}
.segment .wrapper.manifesto .manifesto-slide .item .title {
	/*font-family:'Gotham-Medium';*/
	color: var(--green-wardah);
	font-size: 23px;
	margin-bottom: 10px;
	width: 100%;
	text-align: center;
	text-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	-moz-text-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	-ms-text-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	-webkit-text-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	-o-text-shadow: 0px 0px 2px rgba(0,0,0,0.2);
}
.segment .wrapper.manifesto .manifesto-slide .item .desc {
	/*font-family:'Gotham-Book';*/
	color: var(--green-wardah);
	font-size: 15px;
	line-height: 1.3;
	width: 100%;
	text-align: center;
	text-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	-moz-text-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	-ms-text-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	-webkit-text-shadow: 0px 0px 2px rgba(0,0,0,0.2);
	-o-text-shadow: 0px 0px 2px rgba(0,0,0,0.2);
}
.segment .wrapper.manifesto .slick-dots {
	bottom: -50px !important;
}
.segment .wrapper.news-box .heading {
	width: 100%;
	margin-bottom: 30px;
}
.segment .wrapper.news-box .heading fieldset {
	border-top: solid 1px var(--green-wardah);
}
.segment .wrapper.news-box .news-container {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
}
.wrapper.profile {
	flex-wrap: wrap;
}
.wrapper.profile .avatar-area {
	width: 20%;
}
.wrapper.profile .profile-area {
	width: 78%;
}

.wrapper.profile .avatar-area .avatar-box {
	width: 220px;
	height: 220px;
	overflow: hidden;
	position: relative;
	border-radius: 110px;
}
.wrapper.profile .avatar-area .avatar-box img {
	width: 220px;
	height: 220px;
	object-fit: cover;
	object-position: center;
}
.wrapper.profile .avatar-area .avatar-box .overlay {
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 2;
	top : 0;
	left: 0;
	background: rgba(0,0,0,0.4);
	color: #fff;
	opacity: 0;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
}
.wrapper.profile .avatar-area .avatar-box:hover .overlay {
	opacity: 1;
}
.wrapper.profile .avatar-area .avatar-box .overlay i {
	color: #fff;
	font-size: 32px;
	position: absolute;
	top : 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.wrapper.profile .avatar-area .avatar-box form {
	position: absolute;
	top : -200px;
}
.wrapper.profile a {
	width: 100%;
	margin-bottom: 30px;
}
.wrapper.profile .notif-inactive-area {
	background: var(--light-blue-grey);
	text-decoration: none;
	color: #272727;
	padding: 20px 5%;
	/*width: 90%;*/
	text-align: center;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
}
.wrapper.profile .notif-inactive-area:hover {
	background: var(--green-wardah);
}
.wrapper.profile .verify-action-panel {
	width: 96%;
	padding: 25px 2% 35px 2%;
	border-bottom: solid 1px var(--green-wardah);
	margin-bottom: 10px;
	display: flex;
	justify-content: flex-start;
	align-items: center;
}
.wrapper.profile .verify-action-panel .icon {
	width: 40px;
	height: 40px;
	margin-right: 30px;
}
.wrapper.profile .verify-action-panel .icon.envelope {
	background: url(../images/envelope.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 100%;
}
.wrapper.profile .verify-action-panel .icon.refresh {
	background: url(../images/refresh.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 100%;
}
.wrapper.profile .verify-action-panel .icon.switch {
	background: url(../images/envelopeswitch.png);
	background-position: center;
	background-repeat: no-repeat;
	background-size: 100%;
}
.wrapper.profile .verify-action-panel .text {
	width: 90%;
}
.wrapper.profile .verify-action-panel .text h2 {
	color: var(--green-wardah);
	/*font-family:'Gotham-Medium';*/
	font-size: 16px;
	margin-bottom: 10px;
}
.wrapper.profile .verify-action-panel .text p {
	/*font-family:'Gotham-Book';*/
	color: #373737;
}	
.wrapper.profile .verify-action-panel .text button {
	font-size: 12px;
	padding: 10px 20px;
	/*font-family:'Gotham-Book';*/
}
.wrapper.profile .verify-action-panel .text input {
	height: 33px;
	padding: 0 10px;
	width: 200px;
	border-radius: 20px;
	border: solid 1px #ccc;
	outline: none;
	text-align: center;
}
.news-clear-top {
	width: 100%;
	height: 50px;
}
.main-content-news {
	width: 100%;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin : 50px 0;
}
.container-news-display {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
}

.container-news-display .image-area {
	width: 45%;
}
.container-news-display .image-area .image-content {
	width: 100%;
}
.container-news-display .image-area img {
	width: 100%;
}
.container-news-display .text-headline {
	width: 50%;
}
.wrapper.privacy {
	/*font-family:'Gotham-Book';*/
	color: #333;
	line-height: 1.3;
}
.wrapper.privacy .title {
	margin-bottom: 20px;
	padding-bottom: 10px;
	border-bottom: solid 1px #c0c0c0;
	width: 100%;
}
.wrapper.privacy .title h1 {
	font-size: 28px;
	/*font-family:'Gotham-Medium';*/
	color: var(--green-wardah);
}
.wrapper.privacy .text-body p {
	margin-bottom: 20px;
	font-size: 14px;
	line-height: 1.3;
}
.wrapper.privacy .text-body p.title1 {
	/*font-family:'Gotham-Medium';*/
	color: #222;
	font-size: 16px;
}
.wrapper.privacy .text-body a {
	color: var(--green-wardah);
	/*font-family:'Gotham-Medium';*/
}
.wrapper.privacy .text-body a:hover {
	text-decoration: underline;
}
.wrapper.privacy .text-body ol,
.wrapper.privacy .text-body hr {
	margin-bottom: 20px;
}
.wrapper.privacy .text-body ol {
	padding-left: 20px;
	list-style: disc;
}
.wrapper.privacy .text-body li {
	margin-bottom: 10px;
	font-size: 14px;
	line-height: 1.3;
}
.wrapper.privacy .text-body hr {
	width: 100%;
	height: 1px;
	background: #f0f0f0;
	border : none;
}
.auth-box {
	background: #fff;
	box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
	-ms-box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
	-o-box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
}
.auth-box .error-box {
	background: #d23c40;
	margin : 10px;
	color: #fff;
	padding: 30px;
	width: 400px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.auth-box .error-box button.icon {
	width: 60px;
	height: 60px;
	border : none;
	outline: none;
	color: #fff;
	background: #fff;
	color: #d23c40;
	border-radius: 30px;
	position: relative;
}
.auth-box .error-box button.icon i {
	font-size: 32px;
}
.auth-box .error-box span {
	width: 80%;
	font-size: 14px;
	line-height: 1.2;
	/*font-family:'Gotham-Book';*/
}
.auth-box .error-box span h1 {
	/*font-family:'Gotham-Medium';*/
	font-size: 18px;
}
.auth-box .error-box span a {
	text-decoration: none;
}
.auth-box .error-box span button {
	margin-top: 20px;
	background: none;
	padding: 10px 25px;
	color: #fff;
	border: solid 1px #fff;
}
.auth-box .error-box span button:hover {
	background: #fff;
	color: #333;
}
.auth-box .profile-ask {
	width: 400px;
	padding: 20px;
}
.auth-box .profile-ask .avatar {
	width: 100%;
	text-align: center;
	margin: 10px 0 30px 0;
}
.auth-box .profile-ask .avatar img {
	width: 150px;
	height: 150px;
	border-radius: 75px;
	object-fit: cover;
	object-position: center;
}
.auth-box .profile-ask .quest {
	width: 100%;
	text-align: center;
	margin : 10px 0;
	/*font-family:'Gotham-Book';*/
	line-height: 1.2;
	font-size: 12px;
	color: #888;
}
.auth-box .profile-ask .quest b {
	color: #333;
}
.auth-box .profile-ask .quest h1 {
	margin-bottom: 10px;
	/*font-family:'Gotham-Medium';*/
	color: #333;
	font-size: 21px;
}
.auth-box .profile-ask .button-area {
	width: 100%;
	text-align: center;
	margin: 30px 0 20px 0;
}
.auth-box .profile-ask .button-area button {
	padding: 10px 20px;
	background: #fff;
	border : solid 1px #ccc;
	/*font-family:'Gotham-Book';*/
}
.auth-box .profile-ask .button-area button:hover {
	background: #f0f0f0;
}
.auth-box .profile-ask .button-area button.red {
	background: #d23c40;
	border-color: #d23c40;
	color: #fff;
}
.auth-box .profile-ask .button-area button.red:hover {
	opacity: 0.8;
}
.gallery-wrapper-virtual {
	width: 100%;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
}
.gallery-wrapper-virtual .slick-list {
	padding: 10px 0;
}
.gallery-wrapper-virtual a {
	width: 200px;
	margin-right: 10px;
}
.gallery-wrapper-virtual a .gallery-pane {
	width: 100%;
	background: #fff;
	box-shadow: 0 0 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 0 0 3px rgba(0,0,0,0.3);
	-ms-box-shadow: 0 0 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0 0 3px rgba(0,0,0,0.3);
	-o-box-shadow: 0 0 3px rgba(0,0,0,0.3);
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	border-radius: 10px;
	position: relative;
}
.gallery-wrapper-virtual a .gallery-pane button.delete-gallery {
	background: none;
	outline: none;
	border: none;
	position: absolute;
	top : 8px;
	left: 8px;
	color : #fff;
	text-shadow: 0px 0px 1px rgba(0,0,0,0.2);
	-moz-text-shadow: 0px 0px 1px rgba(0,0,0,0.2);
	-ms-text-shadow: 0px 0px 1px rgba(0,0,0,0.2);
	-webkit-text-shadow: 0px 0px 1px rgba(0,0,0,0.2);
	-o-text-shadow: 0px 0px 1px rgba(0,0,0,0.2);
	font-size: 23px;
}
.gallery-wrapper-virtual a .gallery-pane button.delete-gallery:hover {
	text-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-moz-text-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-ms-text-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-webkit-text-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-o-text-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	color: #ff0000;
}
.gallery-wrapper-virtual a .gallery-pane:hover {
	box-shadow: 0 0 5px rgba(0,0,0,0.5);
	-moz-box-shadow: 0 0 5px rgba(0,0,0,0.5);
	-ms-box-shadow: 0 0 5px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 0 5px rgba(0,0,0,0.5);
	-o-box-shadow: 0 0 5px rgba(0,0,0,0.5);
}
.gallery-wrapper-virtual a .gallery-pane .label {
	position: absolute;
	top : 10px;
	right: 0;
	padding: 5px 10px;
	background: var(--green-wardah);
	color: #fff;
	/*font-family:'Gotham-Book';*/
	border-radius: 5px 0 0 5px;
}
.gallery-wrapper-virtual a .gallery-pane .image-area {
	width: 100%;
	height: 200px;
	overflow: hidden;
	border-radius: 10px 10px 0 0;
}
.gallery-wrapper-virtual a .gallery-pane .image-area img {
	width: 100%;
	height: 200px;
	object-position: center;
	object-fit: cover;
}
.gallery-wrapper-virtual a .gallery-pane .info-area {
	width: 90%;
	padding: 5%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.gallery-wrapper-virtual a .gallery-pane .info-area .timestamp {
	color: #777;
	/*font-family:'Gotham-Book';*/
	line-height: 1.3;
}
.gallery-wrapper-virtual a .gallery-pane .info-area button {
	color: var(--green-wardah);
	background: none;
	outline: none;
	border : none;
	/*font-family:'Gotham-Medium';*/
}
.gallery-wrapper-virtual .slick-dots {
    position: absolute;
    bottom: -40px !important;
    left: 0 !important;
}
.gallery-wrapper-virtual .slick-dots li button {
	background: #e0e0e0 !important;
	border: solid 1px #e0e0e0 !important;
}
.gallery-wrapper-virtual .slick-dots li.slick-active button {
	background: var(--green-wardah) !important;
	border: solid 1px var(--green-wardah) !important;
}
.virtual-area .left-segment.result-analyzer.auto {
	height: auto;
	min-height: auto;
	overflow-y: visible;
}
.product-area-wide {
	display: flex;
	width: 100%;
	margin: 10px 0 20px;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
}
.product-area-wide a {
	width: 100%;
}
.product-area-wide .item {
	width: 94%;
	padding: 3%;
	border : solid 1px #f0f0f0;
	border-radius: 5px;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
}
.product-area-wide .item:hover {
	cursor: pointer;
	border-color: #ccc;
}
.product-area-wide .item img {
	width: 100px;
}
.product-area-wide .item .text-area {
	width: 60%;
	text-align: left;
	margin-bottom: 20px;
}
.checkbox-buble-area {
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
	width: 100%;
	margin-top: 10px;
}
.checkbox-buble-area .item-box {
	width: auto;
	background: #f8f8f8;
	padding: 10px 20px;
	border-radius: 30px;
	margin: 0 5px 5px 0;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	position: relative;
	overflow: hidden;
	/*font-family:'Gotham-Book';*/
	color: #333;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
}
.checkbox-buble-area .item-box:hover {
	cursor: pointer;
	background: #f0f0f0;
}
.checkbox-buble-area .item-box.on {
	background: var(--dark-green-wardah);
	color: #fff;
}
.checkbox-buble-area .item-box input[type=checkbox] {
	position: absolute;
	top : -50px;
}
.checkbox-buble-area .item-box i.icon {
	margin-right: 10px;
	display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.checkbox-buble-area .item-box i.icon::before {
	content: "\f067";
}
.checkbox-buble-area .item-box.on i.icon::before {
	content: "\f00c";
}
.checkbox-buble-area .item-box span {
	font-size: 14px;
}
.checkbox-buble-area .item-box input[type=text] {
	padding: 0;
	margin-top: 0;
	border-bottom: none;
	/*font-family:'Gotham-Book';*/
	font-size: 14px;
	outline: none;
	background: none;
	
}
.checkbox-buble-area .item-box.on input[type=text] {
	color: #fff;
}
.heading-banner-product {
	width: 100%;
}
.heading-banner-product img {
	width: 100%;
	height: 200px;
	object-position: center;
	object-fit: cover;
}

button.button-contact-floating {
	position: fixed;
	z-index: 999999;
	right: 20px;
	bottom: 20px;
	border:none;
	outline: none;
	background: var(--green-wardah);
	color: #fff;
	width: 50px;
	height: 50px;
	border-radius: 25px;
	font-size: 23px;
	text-shadow: none;
	text-align: center;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
	overflow: hidden;
	white-space: nowrap;
}
button.button-contact-floating:hover {
	opacity: 0.8;
	box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-ms-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	-o-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
}
button.button-contact-floating i {
	position: absolute;
	top : 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
}
button.button-contact-floating:hover i {
	margin-left: 0;
}
button.button-contact-floating div {
	font-size: 14px;
	opacity: 0;
	display: inline-block;
	vertical-align: middle;
	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;
}
button.button-contact-floating:hover div {
	opacity: 1;
	width: auto;
}

@media(min-width: 1380px) {
	.segment .wrapper {
		width: 1280px;
		padding: 5% 0;
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		flex-wrap: wrap;
	}
	.segment .wrapper.headline.detail {
		justify-content: center;
	}
}

@media(max-width: 1023px) {
	.mobile {
		display: block !important;
	}
	.mobile-flex {
		display: flex !important;
	}
	.desktop {
		display: none !important;
	}
	.desktop-flex {
		display: none !important;
	}
	header .wrapper {
	    width: 95%;
	    display: flex;
	    justify-content: space-between;
	    align-items: center;
	}
	header .wrapper .brand-logo {
	    position: relative;
	    width: 70%;
	    text-align: left;
	    height: auto;
	}
	header .wrapper .brand-logo img {
		width: 70%;

	}	
	.segment .wrapper.manifesto {
		justify-content: center;
	}
	.segment .wrapper .icon-manifesto {
	    width: 100%;
	    text-align: center;
	    margin: 20px 0;
	}
	.segment .wrapper.manifesto .common-text {
		width: 100%;
		text-align: center;
	}
	.segment .wrapper .icon-manifesto img {
	    width: 100px;
	}
	.common-text h1 {
	    /*font-family:'Gotham-Medium';*/
	    color: #777;
	    font-size: 23px;
	    margin-bottom: 20px;
	    width: 100%;
	}
	.segment .wrapper .common-text.manifesto p {
	    /*font-family:'Gotham-Medium';*/
	    font-size: 12px;
	}
	/*
	.product-area a {
	    width: 50%;
	    text-align: center;
	    display: flex;
	    justify-content: center;
	}
	.product-area .item {
	    width: 90%;
	    position: relative;
	    min-height: 350px;
	    overflow: hidden;
	}
	.product-area .item .text-container {
	    width: 100%;
	    position: absolute;
	    top: 230px;
	    left: 0;
	    z-index: 3;
	}
	.product-area .item .text-container label.tag {
	    /*font-family:'Gotham-Book';/
	    color: #9a9a9a;
	    font-size: 10px;
	}
	.product-area .item .text-container .title {
	    margin-top: 10px;
	    /*font-family:'Gotham-Medium';/
	    font-size: 12px;
	}*/
	.news-box .item-box {
	    width: 300px;
	    box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	    -moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	    -ms-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	    -webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	    -o-box-shadow: 0px 0px 3px rgba(0,0,0,0.3);
	    position: relative;
	    height: 150px;
	    overflow: hidden;
	    border-radius: 7px;
	    margin-bottom: 20px;
	}
	.news-box .item-box.loading {
		display: none;
	}
	.news-box .item-box.loading:first-child {
		display: block;
	}
	.headline img {
	    width: 100%;
	    height: 90vw;
	    object-position: center;
	    object-fit: cover;
	    margin-bottom: 20px;
	}
	.headline .text-headline {
	    width: 100%;
	    text-align: center;
	}
	.headline .text-headline h1 {
	    /*font-family:'Gotham-Medium';*/
	    font-size: 23px;
	    color: var(--green-wardah);
	    margin-bottom: 20px;
	    line-height: 1.2;
	}
	.headline .text-headline span.tagline {
	    /*font-family:'Gotham-Book';*/
	    font-size: 16px;
	    color: var(--green-wardah);
	    line-height: 1.2;
	}
	.headline .text-headline p {
	    /*font-family:'Gotham-Book';*/
	    font-size: 12px;
	    line-height: 1.5;
	    color: #646867;
	    margin-bottom: 20px;
	}
	.headline .text-headline div.line {
	    width: 100px;
	    height: 2px;
	    background: var(--green-wardah);
	    margin: 20px 0;
	    display: inline-block;
	}
	.news-box .item-box .text-area .line {
	    width: 50%;
	    height: 2px;
	    background: var(--green-wardah);
	    margin: 10px 0;
	}
	.news-box .item-box .text-area .content h1 {
	    /*font-family:'Gotham-Medium';*/
	    font-size: 11px;
	    color: var(--green-wardah);
	    margin-bottom: 10px;
	    line-height: 1.2;
	}
	.news-box .item-box .text-area .content {
	    min-height: 60px;
	    width: 100%;
	}
	.news-box .item-box .text-area .attribute {
	    width: 100%;
	    display: flex;
	    justify-content: space-between;
	    flex-wrap: wrap;
	    line-height: 1.7;
	}
	footer .wrapper .segment-col.column-20 {
		width: 100%;
		justify-content: center;
		text-align: center;
	}
	footer .wrapper .segment-col.column-25 {
		width: 100%;
		justify-content: center;
		text-align: center;
	}
	footer .wrapper .segment-col.column-30 {
		width: 100%;
		justify-content: center;
		text-align: center;
	}
	footer .wrapper .segment-col.border-right {
		margin-right:0;
		border-right : none;
		justify-content: center;
		text-align: center;
	}
	footer .wrapper .segment-col .title {
		width: 100%;
		text-align: center;
	}	
	footer .wrapper .segment-col .form-field form {
	    width: 100%;
	    display: flex;
	    justify-content: center;
	    align-items: center;
	}
	.headline.detail .heading-area {
	    width: 90%;
	    margin: 30px 0 20px 0;
	    text-align: center;
	}
	.headline.detail .heading-area h1 {
	    /*font-family:'Gotham-Medium';*/
	    font-size: 16px;
	    line-height: 1.3;
	    color: #626264;
	    margin-bottom: 20px;
	}
	.headline.detail .heading-area .tagline {
	    color: var(--green-wardah);
	    /*font-family:'Gotham-Book';*/
	    font-size: 14px;
	}
	.headline.detail img {
	    height: 200px;
	    width: 100%;
	}
	.headline.detail .text-headline {
	    width: 100%;
	    margin-left:0;
	}
	.product-brand .heading-product-brand {
	    width: 100%;
	    display: flex;
	    justify-content: space-between;
	    align-items: flex-start;
	    margin-bottom: 30px;
	    flex-wrap: wrap;
	    margin-top: 30px;
	}
	.product-brand .heading-product-brand .image-area {
	    width: 100%;
	    height: 150px;
	    position: relative;
	}
	.product-brand .heading-product-brand .image-area .overlay-line {
		position: absolute;
		top : 5px;
		left: -5px;
		border : solid 2px var(--green-wardah);
		border-radius: 10px;
		z-index: 1;
		width: 98%;
		height: 140px;
	}
	.product-brand .heading-product-brand .image-area img {
		position: absolute;
		top : 0;
		left: 0;
		width: 100%;
		height: 145px;
		object-fit: cover;
		object-position: center;
		border-radius: 10px;
		z-index: 2;
	}
	.product-brand .heading-product-brand .detail-container {
	    width: 50%;
	}
	.product-brand .heading-product-brand .detail-container h1 {
	    /*font-family:'Gotham-Medium';*/
	    color: var(--green-wardah);
	    font-size: 23px;
	    margin-bottom: 10px;
	}
	.product-brand .heading-product-brand .detail-container .category-area {
	    display: flex;
	    justify-content: flex-start;
	    align-items: center;
	    width: 100%;
	    flex-wrap: wrap;
	    margin-bottom: 10px;
	}
	.product-brand .heading-product-brand .detail-container .category-area a {
		width: 100%;
	}
	.product-brand .heading-product-brand .detail-container .category-area .item {
	    margin-right: 0;
	    display: flex;
	    justify-content: flex-start;
	    align-items: center;
	    width: 100%;
	    margin-bottom: 10px;
	}
	.product-brand .heading-product-brand .detail-container .category-area .item span {
	    /*font-family:'Gotham-Medium';*/
	    color: var(--green-wardah);
	    font-size: 14px;
	}
	.product-brand .heading-product-brand .detail-container .category-area .item img {
	    margin-right: 5px;
	    width: 20px;
	}
	.product-brand .heading-product-brand .desc.mobile {
		width: 100%;
		margin-top: 20px;
		/*font-family:'Gotham-Book';*/
		color: #646867;
		font-size: 12px;
		line-height: 1.4;
	}
	.product-brand .body-product-brand .product-item {
	    width: 100%;
	}
	.product-brand .body-product-brand .product-item .breadcrumb-area a {
	    color: #337ab7;
	    /*font-family:'Gotham-Book';*/
	    font-size: 12px;
	}
	.product-area.small a {
	    width: 50%;
	    text-align: center;
	    display: flex;
	    justify-content: center;
	    margin-bottom: 30px;
	}
	.product-area.small .item {
	    margin-bottom: 0;
	}
	.product-detail .product-display {
	    width: 100%;
	}
	.product-detail .product-content {
		width: 100%;
		margin-top: 20px;
	}
	.product-detail .product-content h1 {
		font-size: 23px;
		text-align: center;
		width: 100%;
		margin-bottom: 10px;
	}
	.headline.detail {
	    align-items: flex-start;
	    justify-content: center;
	    width: 90%;
	}
	.product-brand .heading-product-brand .detail-container .desc {
	    width: 100%;
	    /*font-family:'Gotham-Book';*/
	    color: #646867;
	    line-height: 1.5;
	    font-size: 11px;
	}
	.segment .wrapper.product-detail {
	    display: flex;
	    justify-content: space-between;
	    align-items: flex-start;
	    flex-wrap: wrap;
	    margin-top: 0;
	}
	.product-detail .product-content .button-tab-area {
	    width: 100%;
	    display: flex;
	    justify-content: center;
	    align-items: center;
	    margin-bottom: 20px;
	}
	.product-detail .product-content .button-tab-area a#try-product-link,
	.product-detail .product-content .button-tab-area button.buy {
	    width: 100%;
	    padding: 15px 0;
	    font-size: 14px;
	    border-radius: 30px;
	    margin-right: 0;
	    margin-left: 0;
	}
	.product-detail .product-content .button-tab-area button.buy.add-to-cart {
		background: var(--green-wardah);
		color: #fff;
		margin-left: 0;
		margin-bottom: 10px;
	}
	.product-detail .product-information {
	    width: 94%;
	    padding: 3%;
	    border-radius: 20px;
	    border: solid 3px var(--green-wardah);
	    display: flex;
	    justify-content: space-between;
	    align-items: stretch;
	    flex-wrap: wrap;
	    background: #e5fbfb;
	    margin: 20px 0 10px 0;
	}
	.product-detail .product-information .segment {
	    width: 100%;
	    text-align: left;
	    margin-bottom: 10px;
	}
	.product-detail .product-information .separator {
	    width: 100%;
	    border-top: dashed 1px var(--green-wardah);
	    margin: 20px 0px;
	}
	.product-detail .product-display .slide-nav {
	    position: relative;
	    z-index: 2;
	    top: 0;
	    right: 0;
	    transform: none;
	    width: 100%;
	}
	.product-detail .product-display .slide-nav .slide-area {
		width: 100%;
	}
	.product-detail .product-display .slide-nav .item {
		width: 100%;
	}
	.product-detail .product-display .slide-nav .item img {
		width: 100%;
	}
	.form-area .field.half {
	    width: 100%;
	}
	.popup.box-login {
    	width: 95%;
	}
	.popup.box-login .side-message {
	    width: 90%;
	    padding: 5%;
	    background: var(--green-wardah);
	    color: #fff;
	    min-height: 100px;
	}
	.popup.box-login .side-message.hide-box {
	    position: absolute;
	    top: 0;
	    right: -100%;
	}
	.popup.box-login .form-segment {
		height: 0;
		width: 100%;
	}
	.popup.box-login .form-segment.on {
	    width: 90%;
	    padding: 5%;
	    opacity: 1;
	}
	.popup.box-login .form-segment.on.login {
	    height: 370px;
	}
	.popup.box-login .form-segment.on.register {
	    height: 500px;
	}
	.popup.box-login .close-popup {
		z-index: 99;
	}
	.popup.box-login .close-popup.sign-in {
	    color: #fff;
	}
	.popup.box-login .close-popup.sign-up {
	    color: var(--green-wardah);
	}
	.title-center-green {
	    width: 100%;
	    margin-bottom: 20px;
	    color: var(--green-wardah);
	    /*font-family:'Gotham-Medium';*/
	    font-size: 23px;
	    text-align: center;
	    margin-top: 20px;
	}
	.virtual-area {
		width: 100%;
		padding: 0 0;
	}
	.virtual-area .perfect-mode {
		width: 100%;
		height: auto;
		margin-bottom: 10px;
		/*height: 110vw;*/
	}
	.virtual-area .pallete-area {
		width: 100%;
		margin-left: 0%;
		position: relative;
	}
	.segment.wave.virtual .wrapper {
		width: 100%;
		padding: 0 20px;
		position: relative;
		margin-bottom: 20px;
	}
	.virtual-area .pallete-area .color-area {
	    width: 100%;
	    display: flex;
	    justify-content: center;
	    flex-wrap: wrap;
	    align-items: center;
	    margin-bottom: 0;
	    position: relative;
	    top: 0;
	    z-index: 99;
	    padding: 20px 0;
	    background: none;
	}
	.virtual-area .pallete-area .product-items {
	    width: 100%;
	    display: flex;
	    justify-content: space-between;
	    align-items: center;
	    margin: 0;
	    background: none;
	    padding: 10px 0;
	}
        button.addshadeproductcart {
            width: 90%;
            margin-bottom: 15px;
        }
	.virtual-area .pallete-area .product-items .slide-area .product-item img {
	    width: 100%;
	    height: 23vw;
	    object-position: center;
	    object-fit: cover;
	}
	.virtual-area .pallete-area .button-area {
		width: 100%;
		text-align: center;
		margin-top: 20px;
	}
	.popup.result-virtual {
	    display: none;
	    width: 90%;
	    height: 500px;
	    border: none;
	    padding: 10px;
	}
	.popup.result-virtual .image-result img {
	    width: 100%;
	    height: 500px;
	    object-fit: cover;
	    object-position: center;
	}
	.virtual-area.analyzer .camera-area {
	    width: 100%;
	    min-height: 400px;
	    background: #f0f0f0;
	    border-radius: 0;
	    overflow: hidden;
	    position: relative;
	    margin-top: 15px;
	}
	.virtual-area.analyzer .camera-area .camera-result {
	    position: absolute;
	    width: 100%;
	    height: 400px;
	    z-index: 3;
	    top: 0;
	    left: 0;
	}
	.virtual-area.analyzer .left-segment {
	    width: 95%;
	    padding: 5% 0 5% 5%;
	    text-align: center;
	    height: auto;
	}
	.virtual-area.analyzer .left-segment.question {
	    width: 90%;
	    padding: 10% 5% 5% 5%;
	    text-align: center;
	    height: auto;
	}
	.virtual-area.analyzer .camera-area .camera-screen {
	    position: relative;
	    width: 100%;
	    height: 400px;
	    z-index: 1;
	}
	.virtual-area.analyzer .camera-area .camera-result img {
		width: 100%;
		height: 400px;
		object-fit: cover;
		object-position: center;
	}
	.segment .wrapper.manifesto .manifesto-slide a {
		width: 100%;
	}
	.segment .wrapper.manifesto .manifesto-slide .item {
		width: 90%;
		text-align: center;
		margin: 0 5%;
	}
	#body {
	    padding-top: 60px;
	}
	.segment .wrapper.news-box .news-container {
		min-height: 700px;
	}
	.product-detail .product-information .separator {
		width: 100%;
		border-left: none;
		border-top: dashed 1px  var(--green-wardah);
		height: 1px;
		position: relative;
		z-index: 2;
		top : 0;
		left: 0;
		transform: none;
	}	
	.wrapper.profile {
		flex-wrap: wrap;
	}
	.wrapper.profile .avatar-area {
		width: 100%;
		margin-bottom: 20px;
		text-align: center;
	}
	.wrapper.profile .avatar-area .avatar-box {
		display: inline-block;
	}
	.wrapper.profile .profile-area {
		width: 100%;
	}
	.form-area .field select {
	    margin-top: 10px;
	    width: 100%;
	    padding: 0 5%;
	    background: #fff;
	    border: solid 1px #ccc;
	    outline: none;
	    /*font-family:'Gotham-Book';*/
	    font-size: 14px;
	    height: 38px;
	}
	.slick-dots li {
		width: 30px !important;
		padding: 0 1px;
	}
	.slick-dots li button {
	    width: 30px !important;
	    height: 5px !important;
	    padding: 0 !important;
	}
	.virtual-area .pallete-area .product-items .slide-area .product-item .name {
	    width: 100%;
	    margin-top: 10px;
	    min-height: 30px;
	    color: #555;
	    text-align: center;
	    /*font-family:'Gotham-Book';*/
	    line-height: 1.2;
	    font-size: 10px;
	}
	.virtual-area .pallete-area .product-items .slide-area .product-item {
	    width: 25%;
	    margin: 0 5px;
	    background: #fff;
	    padding: 5px;
	    min-height: 160px;
	    border-radius: 5px;
	}
	/* .virtual-area .perfect-mode .take-photo-virtual {
	    position: absolute;
	    bottom: -20px;
	    right: auto;
	    left: 50%;
	    transform: translate(-50%,0);
	    top : auto;
	    opacity: 0;
	    width: 100%;
	    height: 150px;
	} */
	.virtual-area .perfect-mode .take-photo-virtual {
		position: absolute;
		bottom: 0px;
		right: auto;
		left: 12%;
		transform: translate(-50%,0);
		top: auto;
		opacity: 0;
		width: 25%;
		height: 100px;
		padding: 0;
	}
	.virtual-area .perfect-mode .category-dropdown {
		top : 20px;
		left: 50%;
		transform: translate(-50%,0);
	}
	button.grey {
	    color: #777;
	    /*font-family:'Gotham-Medium';*/
	    background: #f0f0f0;
	    padding: 15px 30px;
	    border-radius: 30px;
	    border: none;
	    outline: none;
	}
	button.rounded {
	    /*font-family:'Gotham-Medium';*/
	    padding: 10px 0;
	    width: 40px;
	    border-radius: 30px;
	    border: none;
	}
	.product-brand .body-product-brand .product-item .pagination-area {
	    width: 100%;
	    display: flex;
	    justify-content: center;
	    align-items: center;
	}
	.news-box .item-box .text-area .attribute span.date {
	    width: 100%;
	}
	.news-box .item-box img {
	    position: absolute;
	    top: 0;
	    left: 0;
	    width: 300px;
	    height: 150px;
	    object-position: center;
	    object-fit: cover;
	    z-index: 1;
	}
	.segment .wrapper.news-box .news-container {
	    width: 100%;
	    display: flex;
	    justify-content: center;
	    align-items: flex-start;
	    flex-wrap: wrap;
	}

	.segment .wrapper.news-box {
		flex-wrap: wrap;
		padding: 3% 5%;
		justify-content: center;
	}
	.news-box .item-box:hover img {
		top : -20px;
		left: -10%;
		width: 120%;
		height: 190px;
		object-position: center;
		object-fit: cover;
	}

	.main-slider-container .slick-dots {
	    position: absolute;
	    bottom: 0 !important;
	}
	.segment .wrapper.manifesto .manifesto-header img {
		width: 300px;
	}
	.virtual-area.analyzer.result {
	    width: 100%;
	}
	.popup.box-login {
		position: absolute;
		top : 70px;
		transform: translate(-50%,0);
	}
	.popup.popup-buy {
		width: 300px;
	}
	.popup.popup-buy .wrapper .item-market {
		width: 90%;
		padding: 5%;
	}
	.headline.detail .image-area {
	    width: 100%;
	}
	.virtual-area.vertical .camera-area {
		margin-top: 0;
	}
	.virtual-area.vertical .left-segment.with-padding {
		height: auto;
		min-height: auto;
		overflow-y: visible;
	}
	.virtual-area.vertical .left-segment {
	    width: 100%;
	    padding: 0 0 5% 0;
	    text-align: center;
	    height: auto;
	}
	.virtual-area.vertical .left-segment button.green.same-width.small {
	    width: 160px;
	    font-size: 11px;
	}
	.virtual-area .pallete-area .product-snippet .wrapper .text-area {
	    width: 65%;
	    color: var(--green-wardah);
	}
	.virtual-area .pallete-area .product-snippet {
		width: 90%;
	}
	#YMK-module div,
	#YMK-module iframe {
		/*width: 100% !important;*/
		margin: auto !important;
	}
	.virtual-area .pallete-area .product-snippet {
		margin  : 2%;
	}
	.virtual-area .pallete-area .product-snippet button.green {
		padding: 10px 15px;
	}
	.virtual-area .product-snippet-mobile {
		order : 2;
	}
	.virtual-area.analyzer .left-segment.popquest {
		border-radius: 20px;
		width: 100%;
		padding: 10% 0;
		height: 80%;
		z-index: 9;
	}
	.virtual-area.analyzer .left-segment.popquest.off {
		right: -110%;
	}
	.checkbox-buble-area .item-box {
		width: 100%;
		padding: 20px;
	}
	.cookies-notif .wrap .text,
	.cookies-notif .wrap .button-area {
		width: 100%;
		justify-content: flex-start;
	}
	.cookies-notif .wrap .text {
		margin-bottom: 10px;
	}
	.product-detail .product-information-tabs .content-body {
		width: 96%;
		padding: 10px 2%;
	}
	.product-detail .product-content .title-segment-product .spacer {
		width: 8%;
	}
	.product-detail .product-content .title-segment-product h1 {
		margin-top: 5px;
		width: 70%;
		text-align: center;
	}
	.product-detail .product-content .title-segment-product button {
		padding: 8px;
		font-size: 12px;
		max-width: 8%;
	}
	.virtual-area .pallete-area .tabs {
	    justify-content: center;
	    margin-bottom: 20px;
	}
	.virtual-area .pallete-area .product-items .slide-area {
	    justify-content: center;
	}
}