.iconholder-features img{
	height:72px;
}

.txt_white-1{
	color: #000 !important;
}
.faqs .card-body{
	font-size: 14px;
}
@media (min-width: 1024px){
	.txt_white-1{
		color: #fff !important;
	}
	.faqs .card-body{
		font-size: 18px;
	}
}
@media screen and (max-width: 768px){
	/*.iconholder-features-big img {
		height: unset !important;
	}*/
}

.iconholder-features-big img{
	height:140px;
}
.underline{
    margin-bottom: 3rem;
}
.integration-graphic .graphic-icon-center{
}
.product-header{
	padding: calc(6rem + 32.5px) 0;
	background-color: var(--jaguar);
	min-height: calc(100vh - 65px);
	background-position: center;
	background-size: cover;
	display: flex;
	align-items: center;
}
.product-header [class*='col-'] {
	display: flex;
	justify-content: center;
	flex-direction: column;
}
.product-header [class*='col-'] .btn{
	width: min-content;
	white-space: nowrap;
}
.product-header{
	color: var(--white);
}
.product-header [class*='col-'] > img{
	object-fit: cover;
}
.section-grid-header{
	text-align: center;
	padding: 6rem 15px;
	position: relative;
  color: #fff;
  transition: all .5s ease;
  height: 100%;
  min-height: 270px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: var(--jaguar);
  border-right: 1px solid var(--grey);
  border-bottom: 1px solid var(--grey);
  overflow: hidden;
}
.section-grid-header img.imghover {
	display: none;
}
.section-grid-header:hover {
  color: #fff;
  /*background: var(--carrot-orange);*/
}
#hrm-basic-tab.active {
  color: #fff;
  background: var(--carrot-orange);
}
#hrm-advanced-tab.active {
  color: #fff;
  background: var(--carrot-orange);
}
#hrm-basic-tab.hoverable:hover {
  color: #fff;
  background: var(--carrot-orange);
}
#hrm-advanced-tab.hoverable:hover {
  color: #fff;
  background: var(--carrot-orange);
}
.section-grid-header:hover img.imghover {
	display: none;
}
.section-grid-header:hover img.hidehover {
	display: block;
}
.section-grid-header:hover .section-grid-description{
	transform: translate(0, 0);
  z-index: 1;  
}
.section-grid{
	color: var(--white);
  background-color: var(--jaguar);
}
.section-grid-description {
	transform: translateY(100%);
	background-color: var(--carrot-orange);
	color: #fff;
	transition: all 0.5s ease;
	position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 2rem;
  display: flex;
  justify-content: center;
  z-index: -1;
  flex-direction: column;
  width: calc(100% + 1px)
}
.section-grid-description p{
	font-family: 'Roboto-Regular';
	font-size: 1rem;
	margin-bottom: 0;
	text-align: left;
}
.section-grid-description h5{
	text-align: left;
	font-family: 'Roboto-Bold';
}
.section-grid img{
	width: 120px;
	height: 120px;
	margin-bottom: 1rem;
  transition: all .5s ease;
}
.main-product{
	padding: 6rem 0;
}
.main-product-detail a {
	display: flex;
	color: var(--white);
}
.main-product-detail:hover a {
	color: var(--white);
}
.main-product-detail {
	display: flex;
	color: var(--white);
	border: 1px solid var(--dark-tangerine);
	padding: 1.5rem;
	background-color: var(--jaguar);
	transition: all .25s ease;
	margin-bottom: 3rem;
}
.main-product-detail-icon{
	min-width: 40px;
	height: 40px;
	background-color: var(--dark-tangerine);
	margin-right: 1rem;
	transition: all .25s ease;
	mask-repeat: no-repeat;
  box-shadow: 0;
}
.main-product-detail:hover{
	background-color: var(--dark-tangerine);
  box-shadow: 0 14px 28px rgba(255,255,255,0.075), 0 10px 10px rgba(255,255,255,0.075);
  transform: scale3d(1.025, 1.025, 1);
}
.main-product-detail:hover .main-product-detail-icon{
	background-color: var(--white);
}
.main-product-detail-description p{
	font-family: 'Roboto-Regular';
	font-size: 1rem;
}
.main-product-detail-description h5{
	font-family: 'Roboto-Bold';
}

.wfh-erp h1.section-title {
	color: var(--black-rusian);
}
.wfh-module-detail a {
	color: var(--white);
}
.wfh-module-detail:hover a {
	color: var(--white);
}
.wfh-module-detail {
	display: flex;
	color: var(--jaguar);
	border: 1px solid #ddd;
	padding: 1.5rem;
	background-color: var(--white);
	transition: all .25s ease;
	
}
.wfh-module-detail-icon{
	width: 50px;
	height: 50px;
	background-color: var(--dark-tangerine);
	margin-bottom: 1rem;
	transition: all .25s ease;
	mask-repeat: no-repeat;
  box-shadow: 0;
}
.wfh-module-detail:hover{
	background-color: var(--dark-tangerine);
  	box-shadow: 0 14px 28px rgba(255,255,255,0.075), 0 10px 10px rgba(255,255,255,0.075);
  	transform: scale3d(1.025, 1.025, 1);
}
.wfh-module-detail:hover .wfh-module-detail-icon{
	background-color: var(--white);
}
.wfh-module-detail:hover .wfh-module-detail-description p{
	color: var(--white);
}
.wfh-module-detail:hover .wfh-module-detail-description h5{
	color: var(--white);
}
.wfh-module-detail-description p{
	color: var(--jaguar);
	font-family: 'Roboto-Regular';
	font-size: 1rem;
}
.wfh-module-detail-description h5{
	color: var(--jaguar);
	font-family: 'Roboto-Bold';
}
.wfh-erp .removepadding {
	padding-right: 0;
    padding-left: 0;
}

.hotel-module-detail a {
	color: var(--white);
}
.hotel-module-detail:hover a {
	color: var(--white);
}
.hotel-module-detail {
	display: flex;
	color: var(--jaguar);
	border: 1px solid #ddd;
	padding: 1.5rem;
	/*background-color: var(--white);*/
	background: #F1F1F1 0% 0% no-repeat padding-box;
	transition: all .25s ease;
	height: 236px;
}
.hotel-module-detail-icon{
	width: 50px;
	height: 50px;
	background-color: var(--dark-tangerine);
	margin-bottom: 1rem;
	transition: all .25s ease;
	mask-repeat: no-repeat;
  box-shadow: 0;
}
.hotel-module-detail:hover{
	background-color: var(--dark-tangerine);
  	box-shadow: 0 14px 28px rgba(255,255,255,0.075), 0 10px 10px rgba(255,255,255,0.075);
  	transform: scale3d(1.025, 1.025, 1);
}
.hotel-module-detail:hover .hotel-module-detail-icon{
	background-color: var(--white);
}
.hotel-module-detail:hover .hotel-module-detail-description p{
	color: var(--white);
}
.hotel-module-detail:hover .hotel-module-detail-description h5{
	color: var(--white);
}
.hotel-module-detail-description p{
	color: var(--jaguar);
	font-family: 'Roboto-Regular';
	font-size: 1rem;
}
.hotel-module-detail-description h5{
	color: var(--jaguar);
	font-family: 'Roboto-Bold';
}
.tablayerxxx {
    padding: 50px;
}

.list-product-detail{
	padding: 6rem 3rem;
	background-color: var(--jaguar);
	margin-left: -15px;
	width: calc(100% + 30px);
}
.icon-hovered{
	transition: all .25s ease;
	color: var(--dark-tangerine);
	display: flex;
	align-items: center;
	margin-bottom: 3rem;
}
.icon-hovered a {
	display: flex;
	align-items: center;
}
.icon-hovered:hover .icon-hovered-image{
	background-color: var(--white);
}
.icon-hovered:hover, .icon-hovered:hover a {
	color: #fff;
}
.icon-hovered-reverse .icon-hovered-image{
  background-color: var(--white);
}
.icon-hovered-reverse:hover .icon-hovered-image{
  background-color: var(--dark-tangerine);
}
.icon-hovered-image{
	margin-right: 1rem;
	min-width: 36px;
	height: 36px;
	background-color: var(--dark-tangerine);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
.section-bg{
	background-position: center;
	background-size: cover;
}

#product-header-description.sticky, 
#stickysection.sticky {
	position: fixed;
	left: 0;
	top: 110px;
	width: 100%;
	z-index: 10;
}
#product-header-description.sticky .section-grid-header,
#stickysection.sticky .section-grid-header {
	background-color: #000;
	flex-direction: initial;
	min-height: 0;
	padding: 15px;
}
#product-header-description.sticky .section-grid img,
#stickysection.sticky .section-grid img {
	height: 45px;
	width: 45px;
	margin-bottom: 0;
	margin-right: 15px;
}
#product-header-description.sticky .section-grid-description,
#stickysection.sticky .section-grid-description {
	display: none !important;
}

#product-header-description.sticky .section-grid-header:before,
#stickysection.sticky .section-grid-header:before {
	display: block;
	background-color: #000;
	position: absolute; 
	bottom: 0;
	left: 0;
	content: '';
	height: 4px;
	width: 100%;
}
#product-header-description.sticky .section-grid-header:hover:before, 
#product-header-description.sticky .section-grid-header.active:before,
#stickysection.sticky .section-grid-header:hover:before, 
#stickysection.sticky .section-grid-header.active:before {
	background-color: var(--dark-tangerine);
}
#product-header-description.sticky .section-grid-header:after, 
#product-header-description.sticky .section-grid-header.active:after,
#stickysection.sticky .section-grid-header:after, 
#stickysectionion.sticky .section-grid-header.active:after {
	content: "";
	border: none;
    border-top-color: currentcolor;
    border-top-style: none;
    border-top-width: medium;
    border-right-color: currentcolor;
    border-right-style: none;
    border-right-width: medium;
    border-left-color: currentcolor;
    border-left-style: none;
    border-left-width: medium;
	position: absolute;
	bottom: -8px;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 0;
	height: 0;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 8px solid var(--dark-tangerine);
	z-index: 10000;
}
#product-header-description.sticky .section-grid-header:hover,
#stickysection.sticky .section-grid-header:hover {
	overflow: visible;
	/*background-color: var(--carrot-orange);*/
	color: #fff;
}
#product-header-description.sticky .section-grid-header.active,
#stickysection.sticky .section-grid-header.active {
	overflow: visible;
	background-color: var(--carrot-orange);
	color:  #fff;
}
#product-header-description.sticky .section-grid-header:hover h5,
#stickysection.sticky .section-grid-header:hover h5 {
	color: #fff;
}
#product-header-description.sticky .section-grid-header.active h5, 
#stickysection.sticky .section-grid-header.active h5 {
	color:  #fff;
}
.solution_icon {
	background: var(--dark-tangerine);
	color: #fff;
	font-size: 3rem;
	display: flex;
	align-items: center;
	justify-content: center;
}



/*old css*/
.product-header{
	padding: calc(6rem + 32.5px) 0;
	background-color: var(--jaguar);
	min-height: calc(100vh - 65px);
	background-position: center;
	background-size: cover;
	display: flex;
	align-items: center;
}
.product-header [class*='col-'] {
	display: flex;
	justify-content: center;
	flex-direction: column;
}
.product-header [class*='col-'] .btn{
	width: min-content;
	white-space: nowrap;
}
.product-header{
	color: var(--white);
}
.product-header [class*='col-'] > img{
	object-fit: cover;
}
.section-grid-header{
	text-align: center;
	padding: 6rem 15px;
	position: relative;
  color: #fff;
  transition: all .5s ease;
  height: 100%;
  min-height: 270px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: var(--jaguar);
  border-right: 1px solid var(--grey);
  border-bottom: 1px solid var(--grey);
  overflow: hidden;
}
.section-grid-header:hover{
  color: #fff;
}
.section-grid-header:hover .section-grid-description{
	transform: translate(0, 0);
  z-index: 1;  
}
.section-grid{
	color: var(--white);
  background-color: var(--jaguar);
}
.section-grid-description {
	transform: translateY(100%);
	background-color: var(--carrot-orange);
	color: #fff;
	transition: all 0.5s ease;
	position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 2rem;
  display: flex;
  justify-content: center;
  z-index: -1;
  flex-direction: column;
  width: calc(100% + 30px)
}
.section-grid-description p{
	font-family: 'Roboto-Regular';
	font-size: 1rem;
	margin-bottom: 0;
	text-align: left;
}
.section-grid-description h5{
	text-align: left;
	font-family: 'Roboto-Bold';
}
.section-grid img{
	width: 120px;
	height: 120px;
	margin-bottom: 1rem;
  transition: all .5s ease;
}
.main-product{
	padding: 6rem 0;
}
.main-product-detail a {
	display: flex;
	color: var(--white);
}
.main-product-detail:hover a {
	color: var(--white);
}
.main-product-detail {
	display: flex;
	color: var(--white);
	border: 1px solid var(--dark-tangerine);
	padding: 1.5rem;
	background-color: var(--jaguar);
	transition: all .25s ease;
	margin-bottom: 3rem;
}
.main-product-detail-icon{
	min-width: 40px;
	height: 40px;
	background-color: var(--dark-tangerine);
	margin-right: 1rem;
	transition: all .25s ease;
	mask-repeat: no-repeat;
  box-shadow: 0;
}
.main-product-detail:hover{
	background-color: var(--dark-tangerine);
  box-shadow: 0 14px 28px rgba(255,255,255,0.075), 0 10px 10px rgba(255,255,255,0.075);
  transform: scale3d(1.025, 1.025, 1);
}
.main-product-detail:hover .main-product-detail-icon{
	background-color: var(--white);
}
.main-product-detail-description p{
	font-family: 'Roboto-Regular';
	font-size: 1rem;
}
.main-product-detail-description h5{
	font-family: 'Roboto-Bold';
}
.list-product-detail{
	padding: 6rem 3rem;
	background-color: var(--jaguar);
	margin-left: -15px;
	width: calc(100% + 30px);
}
.icon-hovered{
	transition: all .25s ease;
	color: var(--dark-tangerine);
	display: flex;
	align-items: center;
	margin-bottom: 3rem;
}
.icon-hovered a {
	display: flex;
	align-items: center;
	transition: color .8s ease;
}

.icon-hovered:hover .icon-hovered-image{
	background-color: var(--white);
}
.icon-hovered:hover, .icon-hovered:hover a {
	color: #fff;
}
.icon-hovered-reverse .icon-hovered-image{
  background-color: var(--white);
}
.icon-hovered-reverse:hover .icon-hovered-image{
  background-color: var(--dark-tangerine);
}
.icon-hovered-image{
	margin-right: 1rem;
	min-width: 36px;
	height: 36px;
	background-color: var(--dark-tangerine);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}
.section-bg{
	background-position: center;
	background-size: cover;
}

.product-header-description.sticky {
	display: none;
	position: fixed;
	left: 0;
	top: 90px;
	width: 100%;
	z-index: 10;
}
.product-header-description.sticky .section-grid-header {
	background-color: #000;
	flex-direction: initial;
	min-height: 0;
	padding: 15px;
}
.product-header-description.sticky .section-grid img {
	height: 45px;
	width: 45px;
	margin-bottom: 0;
	margin-right: 15px;
}
.product-header-description.sticky .section-grid-description {
	display: none !important;
}

.product-header-description.sticky .section-grid-header:before {
	display: block;
	background-color: #000;
	position: absolute; 
	bottom: 0;
	left: 0;
	content: '';
	height: 4px;
	width: 100%;
}
.product-header-description.sticky .section-grid-header:hover:before, .product-header-description.sticky .section-grid-header.active:before {
	background-color: var(--dark-tangerine);
}
.product-header-description.sticky .section-grid-header:after, .product-header-description.sticky .section-grid-header.active:after {
	content: "";
	border: none;
    border-top-color: currentcolor;
    border-top-style: none;
    border-top-width: medium;
    border-right-color: currentcolor;
    border-right-style: none;
    border-right-width: medium;
    border-left-color: currentcolor;
    border-left-style: none;
    border-left-width: medium;
	position: absolute;
	bottom: -8px;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 0;
	height: 0;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 8px solid var(--dark-tangerine);
	z-index: 10000;
}
.product-header-description.sticky .section-grid-header:hover, .product-header-description.sticky .section-grid-header.active {
	overflow: visible;
	border-color: var(--dark-tangerine);
}
.product-header-description.sticky .section-grid-header:hover h5, .product-header-description.sticky .section-grid-header.active h5 {
	color: var(--dark-tangerine);
}
.solution_icon {
	background: var(--dark-tangerine);
	color: #fff;
	font-size: 3rem;
	display: flex;
	align-items: center;
	justify-content: center;
}
.product-integration-container {
	margin-top: 100px;
}
.product-integration {
	padding: 7rem 1.5rem 7rem;
}
.product-integration.dua-integrasi {
	padding-top: 5rem;
	padding-bottom: 5rem;
}
.section-content .integration-detil {
	font-size: 16px;
}
.integration-detil.last {
	margin-top: -65px;
}
.integration-detil h4, .graphic-icon-center h5 {
	font-family: 'Roboto-Regular', sans-serif;
	font-size: 1.25rem;
	font-weight: 700;
	text-align: center;
	line-height: 1;
}
.graphic-icon-center h5 {
	line-height: 1.5;
}
.integration-detil h4 {
	color: var(--dark-tangerine);
}
.integration-detil a {
	font-family: 'Roboto-Light';
	color: var(--dark-tangerine);
}
.integration-detil a:hover, .integration-detil a:focus {
	color: var(--alice-blue);
}
.integration-graphic-wrapper {
	margin: 3rem auto;
	max-width: 400px;
	/*height: 270px; */
}
.integration-graphic {
	position: relative;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	border-width: 1px;
	border-style: solid;
	border-color: #fff;
	padding: 30px;
}
.integration-graphic.sixnodes {
	padding: 160px;
}
.product-integration.tiga-integrasi .integration-graphic {
	border-width: 1px 0 0 2px;
}
.product-integration.dua-integrasi .integration-graphic {
	border-width: 1px 0 0;
	height: auto;
	padding: 0;
}
.integration-border {
	position: absolute;
	width: 100%;
	height: 107%;
	background-color: #fff;
	border-top: 1px solid #fff;
}
.integration-border:before {
	height: 0;
	width: 0;
	border-left: 290px solid var(--jaguar);
	border-bottom: 270px solid transparent;
	content: '';
	position: absolute;
	top: 0;
	left: 0;
}
.integration-border:after {
	height: 0;
	width: 0;
	border-right: 291px solid var(--jaguar);
	border-top: 272px solid transparent;
	content: '';
	position: absolute;
	top: 0;
	left: 0;
}
@media screen and (min-width: 768px){
	.integration-border:before {
		height: 0;
		width: 0;
		border-left: 398px solid var(--jaguar);
		border-bottom: 270px solid transparent;
		content: '';
		position: absolute;
		top: 0;
		left: 0;
	}
	.integration-border:after {
		height: 0;
		width: 0;
		border-right: 400px solid var(--jaguar);
		border-top: 272px solid transparent;
		content: '';
		position: absolute;
		top: 0;
		left: 0;
	}
	 .product-integration-container .integration-detil, 
	 .product-integration-container .integration-detil h4,
	 .product-integration-container .integration-detil p,
	 .product-integration-container .integration-detil a {
		text-align: center !important;
	}
	#product-header-description.sticky, #stickysection.sticky {
		top: 133px;
	}

	.wfh-module-detail {
		height: 300px!important;
		margin-bottom: unset!important;
	}
}

@media screen and (max-width: 768px){
	.wfh-module-detail {
		text-align: center;
		margin-bottom: 15px;
	}
	.wfh-module-detail-icon {
		margin: 1rem auto;
	}
	.hotel-module-detail {
		height: unset;
	}
	.tablayerxxx {
        padding: 10px 0;
    }
}

@media screen and (max-width: 360px) {
	#product-header-description.sticky, #stickysection.sticky {
		top: 83px;
	}
}

@media screen and (min-width: 576px){
	.wfh-module-detail {
		height: 375px;
		margin-bottom: 15px;
	}
}

@media screen and (max-width: 576px)
{
	.wfh-module-detail {
		max-width: 75%;
    	margin: auto;
    	margin-bottom: 15px;
	}
}

@media screen and (max-width: 480px)
{
	.wfh-module-detail {
		max-width: unset;
		margin-bottom: 15px;
	}
}


.integration-graphic .graphic-icon {
	position: absolute;
}
.integration-graphic .graphic-icon a {
	display: block;
	background-color: var(--dark-tangerine);
	border: 2px solid var(--dark-tangerine);
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	padding: 15px;
}
.integration-graphic .graphic-icon a:hover, .integration-graphic .graphic-icon a:focus {
	background-color: #fff;
}
.integration-graphic .graphic-icon a:hover .integration-icon, .integration-graphic .graphic-icon a:focus .integration-icon {
	background-color: var(--dark-tangerine);
}
	
.integration-graphic .graphic-icon label {
	position: absolute;
}
.integration-graphic .graphic-icon-center {
	position: relative;
	background: var(--dark-tangerine);
	padding: 30px 30px;
	border: 10px solid;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	
    width:180px !important;
    height:180px !important;
    
}
.integration-graphic .graphic-icon-center.fivenodes {
	position: relative;
	top: 50px;
    z-index: 2;
}
.integration-graphic .graphic-icon-center.sixnodes {
	position: relative;
	top: 120px;
    z-index: 2;
}
.integration-graphic .graphic-icon-center.eightnodes {
	position: relative;
	top: 245px;
    z-index: 2;
}

.integration-graphic .graphic-icon-center.sevenodes {
	position: relative;
	top: 175px;
    z-index: 2;
}

.integration-graphic.sixnodes .graphic-icon-center {
	padding: 30px 46px;
}
.product-integration.dua-integrasi .integration-graphic .graphic-icon-center {
	top: -75px;
}
.integration-graphic .graphic-icon1 {
	top: -35px;
	left: -35px;
}
.integration-graphic .graphic-icon1 label {
	top: -45px;
	left: 0;
}
.integration-graphic .graphic-icon2 {
	top: -35px;
	right: -35px;
}
.integration-graphic .graphic-icon2 label {
	top: -45px;
	left: 0;
}
.integration-graphic .graphic-icon3 {
	bottom: -35px;
	left: -35px;
	z-index: 1;
}
.integration-graphic .graphic-icon3 label {
	bottom: -45px;
	left: 0;
}
.integration-graphic .graphic-icon4 {
	bottom: -35px;
	right: -35px;
	z-index: 1;
}
.integration-graphic .graphic-icon4 label {
	bottom: -45px;
	left: 0;
}
.integration-graphic .graphic-icon5 {
	bottom: -200px;
	z-index: 1;
	/*right: -35px;*/
}
.integration-graphic .graphic-icon5 label {
	bottom: -45px;
	left: 0;
}
.integration-graphic .graphic-icon5a {
	bottom: -275px;
	z-index: 1;
	right: -35px;
}
.integration-graphic .graphic-icon6 label {
	bottom: -45px;
	left: 0;
}
.integration-graphic .graphic-icon6 {
	bottom: -275px;
	left: -35px;
	z-index: 1;
}

.integration-graphic .graphic-icon7 {
	bottom: -450px;
	z-index: 1;
	/*right: -35px;*/
}
.integration-graphic .graphic-icon7a {
	bottom: -520px;
	z-index: 1;
	right: -35px;
}
.integration-graphic .graphic-icon8 {
	bottom: -520px;
	z-index: 1;
	left: -35px;
}
.integration-icon {
	min-width: 40px;
	height: 40px;
	background-color: var(--alice-blue);
	transition: all .25s ease;
	mask-repeat: no-repeat;
}
.integration-arrow-down.nodes7 {
	margin-top: 248px;
}
.integration-arrow-down.nodes9 {
	margin-top: 448px;
}

.integration-arrow-down {
	width: 0;
    height: 0;
    border-left: 200px solid transparent;
    border-right: 200px solid transparent;
    border-top: 163px solid #fff;
    position: absolute;
}
.integration-arrow-down .border-triangle {
	position: inherit;
    top: -164px;
    left: -199px;
    width: 0;
    height: 0;
    border-top: solid 162px #2a2a30;
    border-right: solid 198px transparent;
    border-left: solid 199px transparent;
}

.integration-sixnodes {
	border-right: 1px solid #fff;
	border-left: 1px solid #fff;
	border-bottom: 1px solid #fff;
	width: 400px;
    height: 250px;
    position: absolute;
    margin-top: -1px;
    background: var(--jaguar);
}

.integration-eightnodes {
	border-right: 1px solid #fff;
	border-left: 1px solid #fff;
	border-bottom: 1px solid #fff;
	width: 400px;
    height: 250px;
    position: absolute;
    margin-top: 245px;
    background: var(--jaguar);
}

.integration-icon.crm-integration {
	mask-image: url('../images/Produk/Icon_CRM.png');
	-webkit-mask-box-image: url('../images/Produk/Icon_CRM.png');
}
.integration-icon.akuntansi-integration {
	mask-image: url('../images/Produk/Icon_Akuntansi.png');
	-webkit-mask-box-image: url('../images/Produk/Icon_Akuntansi.png');
}
.integration-icon.inventaris-integration {
	mask-image: url('../images/Produk/Icon_Inventaris.png');
	-webkit-mask-box-image: url('../images/Produk/Icon_Inventaris.png');
}
.integration-icon.pembelian-integration {
	mask-image: url('../images/Produk/Icon_Pembelian.png');
	-webkit-mask-box-image: url('../images/Produk/Icon_Pembelian.png');
}
.integration-icon.hrm-integration {
	mask-image: url('../images/Produk/Icon_HRM.png');
	-webkit-mask-box-image: url('../images/Produk/Icon_HRM.png');
}
.integration-icon.kompetensi-integration {
	mask-image: url('../images/Produk/orientasi-jasa/Kompetensi_Training.svg');
	-webkit-mask-box-image: url('../images/Produk/orientasi-jasa/Kompetensi_Training.svg');
}
.integration-icon.pos-integration {
	mask-image: url('../images/Produk/orientasi-produk/POS.svg');
	-webkit-mask-box-image: url('../images/Produk/orientasi-produk/POS.svg');
}
.integration-icon.proyek-integration {
	mask-image: url('../images/Produk/orientasi-jasa/Proyek_Kontrak.svg');
	-webkit-mask-box-image: url('../images/Produk/orientasi-jasa/Proyek_Kontrak.svg');
}
.integration-icon.barcode-integration {
	mask-image: url('../images/Produk/orientasi-produk/Barcode.svg');
	-webkit-mask-box-image: url('../images/Produk/orientasi-produk/Barcode.svg');
}
.integration-icon.timesheet-integration {
	mask-image: url('../images/timesheet.svg');
	-webkit-mask-box-image: url('../images/Produk/orientasi-jasa/Timesheet.svg');
}
.integration-icon.fleet-integration {
	mask-image: url('../images/fleet.svg');
	-webkit-mask-box-image: url('../images/fleet.svg');
}
.integration-icon.call-center-integration {
	mask-image: url('../images/Produk/orientasi-jasa/Callcenter.svg');
	-webkit-mask-box-image: url('../images/Produk/orientasi-jasa/Callcenter.svg');
	margin-bottom: 10px;
}
.integration-icon.rental-integration {
	mask-image: url('../images/Produk/spesifik-industry/Rental.svg');
	-webkit-mask-box-image: url('../images/Produk/spesifik-industry/Rental.svg');
}
.integration-icon.penjualan-integration {
	mask-image: url('../images/Produk/Icon_Penjualan.png');
	-webkit-mask-box-image: url('../images/Produk/Icon_Penjualan.png');
}
.integration-icon.sertifikasi-integration {
	mask-image: url('../images/Produk/orientasi-jasa/Sertifikasi.svg');
	-webkit-mask-box-image: url('../images/Produk/orientasi-jasa/Sertifikasi.svg');
}
.integration-icon.invoicing-integration {
	mask-image: url('../images/Produk/Icon_einvoicing.png');
	-webkit-mask-box-image: url('../images/Produk/Icon_einvoicing.png');
}
.integration-icon.automation-integration {
	mask-image: url('../images/Produk/Icon_Marketing.png');
	-webkit-mask-box-image: url('../images/Produk/Icon_Marketing.png');
}
.integration-icon.helpdesk-integration {
	mask-image: url('../images/Produk/orientasi-jasa/Helpdesk_Ticketing.svg');
	-webkit-mask-box-image: url('../images/Produk/orientasi-jasa/Helpdesk_Ticketing.svg');
}
.integration-icon.event-integration {
	mask-image: url('../images/Produk/orientasi-jasa/Helpdesk_Ticketing.svg');
	-webkit-mask-box-image: url('../images/event-mgt.svg');
}
.integration-icon.e-menu-integration {
	mask-image: url('../images/Produk/spesifik-industry/e-Menu.svg');
	-webkit-mask-box-image: url('../images/Produk/spesifik-industry/e-Menu.svg');
}	
.integration-icon.booking-integration {
	mask-image: url('../images/Produk/orientasi-jasa/Booking.svg');
	-webkit-mask-box-image: url('../images/Produk/orientasi-jasa/Booking.svg');
}
.integration-icon.certification-integration {
	mask-image: url('../images/Produk/orientasi-jasa/Sertifikasi.svg');
	-webkit-mask-box-image: url('../images/Produk/orientasi-jasa/Sertifikasi.svg');
	margin-bottom: 10px;
}
.integration-icon.asset-integration {
	mask-image: url('../images/asseticon.svg');
	-webkit-mask-box-image: url('../images/asseticon.svg');
}
.integration-icon.restaurant-integration {
	mask-image: url('../images/Produk/spesifik-industry/Restoran.svg');
	-webkit-mask-box-image: url('../images/Produk/spesifik-industry/Restoran.svg');
	margin-bottom: 10px;
}
.integration-icon.warehouse-integration {
	mask-image: url('../images/Produk/orientasi-produk/Warehouse.svg');
	-webkit-mask-box-image: url('../images/Produk/orientasi-produk/Warehouse.svg');
	margin-bottom: 10px;
}
.integration-icon.kitchen-display-integration {
	mask-image: url('../images/kitchendisplay.svg');
	-webkit-mask-box-image: url('../images/kitchendisplay.svg');
}
.integration-icon.transportation-integration {
	mask-image: url('../images/transport.svg');
	-webkit-mask-box-image: url('../images/transport.svg');
}
.integration-icon.visitor-integration {
	mask-image: url('../images/visitor.svg');
	-webkit-mask-box-image: url('../images/visitor.svg');
}
.integration-icon.sekolah-integration {
	mask-image: url('../images/sekolah.svg');
	-webkit-mask-box-image: url('../images/sekolah.svg');
}
.integration-icon.call-integration, 
.integration-icon.callcenter-integration {
	mask-image: url('../images/Call center.svg');
	-webkit-mask-box-image: url('../images/Call center.svg');
}
.integration-icon.manufacture-integration {
	mask-image: url('../images/manufaktur.svg');
	-webkit-mask-box-image: url('../images/manufaktur.svg');
	margin-bottom: 10px;
}
.integration-icon.projectcontract-integration {
	mask-image: url('../images/Proyek_Kontrak.svg');
	-webkit-mask-box-image: url('../images/Proyek_Kontrak.svg');
}
.integration-icon.realestate-integration {
	mask-image: url('../images/Produk/spesifik-industry/Perumahan.svg');
	-webkit-mask-box-image: url('../images/Produk/spesifik-industry/Perumahan.svg');
}
.integration-icon.fasilitas-integration {
	mask-image: url('../images/fasilitas.svg');
	-webkit-mask-box-image: url('../images/fasilitas.svg');
}
.integration-icon.catering-integration {
	mask-image: url('../images/Produk/spesifik-industry/Katering.svg');
	-webkit-mask-box-image: url('../images/Produk/spesifik-industry/Katering.svg');
}
.integration-icon.membership-integration {
	mask-image: url('../images/membershipmanagement1.svg');
	-webkit-mask-box-image: url('../images/membershipmanagement1.svg');
}
.integration-icon.centralkitchen-integration {
	mask-image: url('../images/Produk/spesifik-industry/CentralKitchen.svg');
	-webkit-mask-box-image: url('../images/Produk/spesifik-industry/CentralKitchen.svg');
}
.integration-icon.supplychain-integration {
	mask-image: url('../images/Produk/orientasi-produk/SupplyChain.svg');
	-webkit-mask-box-image: url('../images/Produk/orientasi-produk/SupplyChain.svg');
	margin-bottom: 10px;
}
.integration-icon.learning-integration, 
.integration-icon.learning-management-integration {
	mask-image: url('../images/Produk/spesifik-industry/LearningManagement.svg');
	-webkit-mask-box-image: url('../images/Produk/spesifik-industry/LearningManagement.svg');
}
.integration-icon.marketing-integration {
	mask-image: url('../images/Icon_Marketing_Automation.svg');
	-webkit-mask-box-image: url('../images/Icon_Marketing_Automation.svg');
}

.integration-icon.survey-integration {
	mask-image: url('../images/survey-mgt.svg');
	-webkit-mask-box-image: url('../images/survey-mgt.svg');
}
.integration-icon.contract-integration {
	mask-image: url('../images/contract-mgt.svg');
	-webkit-mask-box-image: url('../images/contract-mgt.svg');
}
.integration-icon.dokumen-integration {
	mask-image: url('../images/document-mgt.svg');
	-webkit-mask-box-image: url('../images/document-mgt.svg');
}
.integration-icon.repair-integration {
	mask-image: url('../images/repair-mgt.svg');
	-webkit-mask-box-image: url('../images/repair-mgt.svg');
}
.integration-icon.eventgen-integration {
	mask-image: url('../images/event-mgt.svg');
	-webkit-mask-box-image: url('../images/event-mgt.svg');
}
.integration-icon.posgen-integration {
	mask-image: url('../images/pos-general.svg');
	-webkit-mask-box-image: url('../images/pos-general.svg');
}
.fitur-icon {
	height: 120px;
	width: 120px;
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: center;
	margin: 0 auto 1rem;;
}
.fitur-icon.fitur-sales-pipeline {
	background-image: url('../images/Produk/fitur-icon/sales-pipeline.html');
}
.fitur-icon.fitur-sales-reporting {
	background-image: url('../images/Produk/fitur-icon/sales-reporting.html');
}
.fitur-icon.fitur-lead-management {
	background-image: url('../images/Produk/fitur-icon/lead-management.html');
}
.fitur-icon.fitur-sales-team {
	background-image: url('../images/Produk/fitur-icon/sales-team.html');
}
.fitur-icon.fitur-email-marketing {
	background-image: url('../images/Produk/fitur-icon/email-marketing.html');
}
.fitur-icon.fitur-call-logging {
	background-image: url('../images/Produk/fitur-icon/call-logging.html');
}
.solusi-icon { 
	height: 52px;
	width: 52px;
	background-repeat: no-repeat;
	background-size: 100%;
	background-position: 100%;
	margin-bottom: 0.5rem;
}
.solusi-icon.solusi-identifikasi {
	background-image: url('../images/Produk/solusi-icon/identifikasi.html');
}
.solusi-icon.solusi-pantau {
	background-image: url('../images/Produk/solusi-icon/pantau.html');
}
.solusi-icon.solusi-pelaporan {
	background-image: url('../images/Produk/solusi-icon/pelaporan.html');
}
.solusi-icon.solusi-sesuaikan {
	background-image: url('../images/Produk/solusi-icon/sesuaikan.html');
}

.placeholder {
	position: relative;
}
.placeholder:before {
	display: block;
	position: absolute;
	content: 'Image Placeholder';
	padding: 10px 15px;
	background: #ddd;
}
#product-header-description.sticky .section-grid-header,
#stickysection.sticky .section-grid-header {
    flex-direction: initial !important;
    min-height: 0 !important;
    padding: 15px !important;
}
#product-header-description.sticky .section-grid-header p,
#stickysection.sticky .section-grid-header p {
	display: none;
}
 
#product-header-description.sticky .section-grid-header.active, 
#stickysection.sticky .section-grid-header.active {
    overflow: visible;
    border-color: var(--dark-tangerine);
    background: var(--carrot-orange) !important;
    color: #fff;
}
#product-header-description.sticky .section-grid-header.hoverable:hover,
#stickysection.sticky .section-grid-header.hoverable:hover {
	background: var(--carrot-orange) !important;
}
@media(min-width: 992px) {
	.product-integration-container {
		margin-top: 0;
	}
	.product-integration.dua-integrasi .product-integration-container {
		margin-top: 100px;
	}
	.integration-graphic .graphic-icon label {
		display: none;
	}
	.integration-detil {
		display: block;
	}
}

@media(max-width: 992px) {
	.ujungpanahbox {
		margin-left: 0px!important;
	}
	.ujungpanah {
		margin-top: 0px!important;
    	margin-bottom: 60px;
	}
}
	
@media(min-width: 1200px) {
/*	.integration-graphic-wrapper {
		max-width: 500px;
		height: 500px;
	}
	.integration-border:before {
		border-left: 498px solid var(--jaguar);
		border-bottom: 498px solid transparent;
	}
	.integration-border:after {
		border-right: 499px solid var(--jaguar);
		border-top: 499px solid transparent;
	}	*/
}
@media (min-width: 300px) and (max-width: 767px) {
	.section-grid-header {
	    padding: 1rem 13px;
	    min-height: 155px;	
	}
}
@media (min-width: 400px) and (max-width: 480px){
	.integration-border:before {
	    height: 0;
	    width: 0;
	    border-left: 330px solid var(--jaguar);
	    border-bottom: 270px solid transparent;
	    content: '';
	    position: absolute;
	    top: 0;
	    left: 0;
	}
	.integration-border:after {
    height: 0;
    width: 0;
    border-right: 332px solid var(--jaguar);
    border-top: 272px solid transparent;
    content: '';
    position: absolute;
    top: 0;
    left: 0;
	}


}
@media (min-width: 361px) and (max-width: 399px) {
	.integration-border:after {
	    height: 0;
	    width: 0;
	    border-right: 296px solid var(--jaguar);
	    border-top: 272px solid transparent;
	    content: '';
	    position: absolute;
	    top: 0;
	    left: 0;
	}
	.integration-border:before {
    height: 0;
    width: 0;
    border-left: 293px solid var(--jaguar);
    border-bottom: 270px solid transparent;
    content: '';
    position: absolute;
    top: 0;
    left: 0;
	}
	p.section-content.mx-auto {
	    width: 100% !important;
	}

}

@media (min-width: 300px) and (max-width: 360px) {
	.integration-border:before {
    height: 0;
    width: 0;
    border-left: 280px solid var(--jaguar);
    border-bottom: 270px solid transparent;
    content: '';
    position: absolute;
    top: 0;
    left: 0;
	}
	.integration-border:after {
    height: 0;
    width: 0;
    border-right: 281px solid var(--jaguar);
    border-top: 272px solid transparent;
    content: '';
    position: absolute;
    top: 0;
    left: 0;
	}
	p.section-content.mx-auto {
	    width: 100% !important;
	}
}