/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/
:root{
	--primary_button: #977053;
	--secondary_button : #d4b5a1;
	--pecca_color : #9f755d;
	--pecca_secondary_color :#ae7852;
	--footer-color:#977053;
	--footer-color-dark:#2d2c29;
	--bg-brown:#af8a4f;
	--body-font-family: "Ubuntu", sans-serif;
	--font-color:#121212;
}

html, body{
	font-family: var(--body-font-family);
	color: var(--font-color);
}

.btn-pecca{
	background-color: var(--primary_button) !important;
	color:white !important;
	border:none !important;
}

.btn-pecca:hover{
	background-color: #664127 !important;
}

.text-primary{
	font-family: var(--body-font-family);
	color: #633103 !important;
}

h3.text-primary{
	font-family: var(--body-font-family);
	font-size: 36px;
	line-height: 45px;
	color: #633103 !important;
}

a.menu-link{
	font-family: var(--body-font-family);
	color: var(--font-color);
}

.text-bg-primary{
	background-color: var(--primary_button) !important;
	color: white;
}

#footer{
	background-color: var(--footer-color);
}

#copyrights{
	background-color: var(--footer-color-dark);
}

#slider{
	background:white;
}

.bg-side{
	background-image: url('../img/bg.png');
	background-size: cover;
}

.section-about{
	padding-top:50px !important;
	padding-bottom: 60px;
}

.section-about ul p {
	line-height: 35px;
	text-align: justify;
}

.text-primary{
	color: var(--pecca_color) !important;
}

.line-home { border-bottom-color: #FF8600 !important; }
.line-travel { border-bottom-color:  #6F42C1 !important; }
.line-tech { border-bottom-color:  #007BFF !important; }
.line-fashion { border-bottom-color:  #E83E8C !important; }
.line-sports { border-bottom-color:  #DC3545 !important; }
.line-lifestyle { border-bottom-color:  #13A774 !important; }
.line-food { border-bottom-color:  #17A2B8 !important; }
.line-market { border-bottom-color:  #FFC107 !important; }
.line-light { border-bottom-color:  #F8F9FA !important; }
.line-dark { border-bottom-color:  #343A40 !important; }

.line-home::after { border-top-color: #FF8600 !important; }
.line-travel::after { border-top-color:  #6F42C1 !important; }
.line-tech::after { border-top-color:  #007BFF !important; }
.line-fashion::after { border-top-color:  #E83E8C !important; }
.line-sports::after { border-top-color:  #DC3545 !important; }
.line-lifestyle::after { border-top-color:  #13A774 !important; }
.line-food::after { border-top-color:  #17A2B8 !important; }
.line-market::after { border-top-color:  #FFC107 !important; }
.line-light::after { border-top-color:  #F8F9FA !important; }
.line-dark::after { border-top-color:  #343A40 !important; }

.milestones::before{
	content:'';
	background-image: url('../assets/bg.png');
	position: relative;
	min-height: 100vh;
}

.milestones,
.product_categories,
.sertifikasi{
	padding-top:10rem;
	padding-bottom:8rem;
}

.milestones h2,
.product_categories h2,
.sertifikasi h2{
	color:var(--pecca_color)
}

.sertifikasi h3{
	font-weight: bold;
	color:var(--pecca_color);
	text-align: center;
}

.sertifikasi p {
	text-align: center;
	color:var(--pecca_secondary_color);
}

.swiper-tab-link {
	--swiper-tab-title: #AAA;
	--swiper-tab-content: ;
	counter-increment: step-counter;
	position: relative;
	overflow: hidden;
	margin-bottom: 5px;
	padding: 20px 0;
	cursor: pointer;
}

.swiper-tab-link::before {
	content: "0" counter(step-counter)'.';
	position: relative;
	display: inline-block;
	font-size: 26px;
    font-weight: 600;
    min-width: 50px;
	margin-right: 5px;
	color: var(--swiper-tab-title);
    font-family: monospace;
	line-height: 1;
}

.swiper-tab-link .swiper-tab-title {
	display: inline-block;
	color: var(--swiper-tab-title);
	margin-bottom: 0;
	font-size: calc(1.275rem + 0.3vw);
}

.swiper-tab-link .swiper-tab-content {
	margin-bottom: 0;
	padding-top: 10px;
    margin-left: 5px;
	line-height: 0;
	opacity: 0;
	vertical-align:middle;
	font-size: 1rem;
	transition: line-height 0.6s cubic-bezier(.4,0,.2,1), opacity .1s .1s cubic-bezier(.4,0,.2,1);
}

@media (min-width: 768px) {
    .swiper-tab-link .swiper-tab-content {
        margin-left: 60px;
    }
}

.swiper-tab-link.active .swiper-tab-content {
	opacity: .8;
	line-height: var(--cnvs-line-height-content);
	transition: line-height 0.5s cubic-bezier(.4,0,.2,1), opacity .15s .15s cubic-bezier(.4,0,.2,1);
}

.swiper-tab-link.active {
	--swiper-tab-title: #000;
}

.section-services table.table{
	background-color: var(--pecca_color) !important;
}

.section-services table { background-color: #ff0000 !important; }
.section-services tr { background-color: var(--bg-brown) !important; }
.section-services th { background-color: var(--bg-brown) !important; color:white !important; align-items: center; }
.section-services td { background-color: var(--bg-brown) !important; color:white !important; }

/* #products{
	background-color: #f8f9fa !important;
} */

.company table{
	padding: 20px;
	border: 1px solid #121212;
	min-height: 700px;
}

.company table tr td{
	border: 1px solid white;
	background-color: #e7ebf5;
	padding: 10px;
	vertical-align: top;
}

.item-categories h5 {
	position: absolute;
	top: auto;
	left: 10px;
	bottom: 0;
	padding: 12px 22px;
}

.latest-blog .entry-title h3 {
    font-size: 17px;
    margin-bottom: 13px;
}

img.latest-blog {
    background-position: center;
	height: 233px !important;
}

.services-categories {
	counter-reset: services-category-item-number;
}

.services-categories .services-category-item {
	position: relative;
}

.services-categories .services-category-item::before {
	position: absolute;
    z-index: 1;
    top: 5px;
    left: var(--bs-gutter-x);
	font-size: 80%;
	font-family: monospace;
	font-weight: bold;
    counter-increment: services-category-item-number;
    content: counter(services-category-item-number, decimal-leading-zero)".";
}


.services-categories .services-category-item a:hover {
	background-color: var(--cnvs-themecolor);
	color: rgba(255,255,255,0.6);
}

.services-categories .services-category-item a:hover h4 {
	color: #FFF;
}

.services-categories .services-category-item:hover::before {
	color: #FFF;
}

.recipe-items .card img,
.rotating {
	transform: rotate(0deg);
	transition: transform 1.5s linear;
}

.recipe-items .card:hover img,
.rotating:hover {
	transform: rotate(360deg);
	transition: transform 20s linear;
}

.recipe-items .row  {
	border-top: 1px solid #EEE;
	margin-top: -1px;
	margin-bottom: -1px;
}

.recipe-items .row [class^=col-] {
	border-right: 1px solid #EEE;
	border-bottom: 1px solid #EEE;
}

.recipe-items .card {
	border: 0;
	background: transparent;
	border-radius: 0;
	padding: 20px 10px;
}

.recipe-items .card-author {
	font-size: 12px;
	font-weight: 400;
	color: #AAA;
	margin-bottom: 0;
}

.recipe-items .card-title {
	font-size: 18px;
	line-height: 1.3;
}
.recipe-items .card-author a {
	color: #999;
	text-transform: uppercase;
	margin-left: 2px;
	font-weight: 600;
}

.recipe-items .card-title a { color: #222; }

.recipe-items .card-date {
	margin-top: 15px;
	color: #555;
	margin-bottom: 0;
	font-weight: 400;
}

.recipe-items .card-date i { margin-right: 6px; }

.masonry-thumbs a i {
	opacity: 0;
	position: absolute;
	display: block;
	top: 50%;
	left: 50%;
	color: rgba(255, 255, 255, 0.7);
	z-index: 99;
	background-color: rgba(0, 0, 0, 0.65);
	padding: 5px;
	font-size: 14px;
	width: 40px;
	height: 40px;
	margin-top: -20px;
	margin-left: -20px;
	line-height: 30px;
	text-align: center;
	border-radius: 50%;
	-webkit-transform: scale(0.8);
	-o-transform: scale(0.8);
	transform: scale(0.8);
	-webkit-transition: transform .4s ease;
	-o-transition: transform .4s ease;
	transition: transform .4s ease;
	-webkit-backface-visibility: hidden;
}

.masonry-thumbs a:hover i {
	opacity: 1;
	-webkit-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
}

.floating {
	position: fixed;
	width: 60px;
	height: 60px;
	bottom: 40px;
	bottom:100px;
	right: 20px;
	background-color: #25d366;
	color: #fff;
	border-radius: 50px;
	text-align: center;
	font-size: 30px;
	box-shadow: 2px 2px 3px #999;
	z-index: 100;
}

.fab-icon {
	margin-top: 6px;
}

.block-tab-2 .nav-tabs {
	--bs-nav-tabs-border-width: 0px;
	--bs-nav-link-color: #111;
	--bs-nav-link-hover-color: var(--bs-danger);
}

.block-tab-2 .nav-tabs .nav-item .nav-link::after {
	content: '';
	position: absolute;
	width: 6px;
	height: 6px;
	bottom: 0;
	left: 50%;
	margin-left: -3px;
	border-radius: 50%;
	background: var(--bg-brown);
}

.block-tab-2 .nav-tabs .nav-item .nav-link {
	position: relative;
	font-size: 15px;
	font-weight: 400;
	padding: 0 0 20px 0;
	border-radius: 0;
	border-bottom: 1px solid var(--bg-brown);
}

.block-tab-2 .nav-tabs .nav-item .nav-link i {
	display: block;
	font-size: 38px;
	/* margin: 0 0 10px 0; */
}

.block-tab-2 .nav-tabs .nav-item .nav-link.active {
	top: -55.5px;
	font-size: 52px;
	background-color: transparent;
}

.block-tab-2 .nav-tabs .nav-item .nav-link.active i {
	color: var(--primary_button);
	top:-40px;
}

.block-tab-2 .nav-tabs .nav-item .nav-link.active::after {
	content: '';
	position: absolute;
	width: 12px;
	height: 12px;
	bottom: 0;
	left: 50%;
	margin-left: -3px;
	border-radius: 50%;
	background: var(--primary_button);
}


.showcase-section .showcase-target { display: none; }

.showcase-section .showcase-target.showcase-target-active { display: block; }

.showcase-section ul { list-style: none; }

.showcase-section ul li {
	display: block;
	position: relative;
	padding: 24px 0;
	cursor: pointer;
	border-top: 1px solid #F0F2F6;
}

.showcase-section ul li:first-child {
	padding-top: 0;
	border-top: 0;
}

.showcase-section ul li h3 {
	display: block;
	position: relative;
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 5px;
}

.showcase-section ul li p {
	font-weight: 400;
	font-size: 15px;
	line-height: 1.6;
	margin-bottom: 0;
	color: #777;
}

.showcase-section ul li h3::before {
	opacity: 0;
	content: "\f0da";
	font-family: 'fontawesome';
	position: absolute;
	margin-left: -20px;
	top: -2px;
	-webkit-transition: margin-left .3s ease, opacity .3s ease;
	-ms-transition: margin-left .3s ease, opacity .3s ease;
	-o-transition: margin-left .3s ease, opacity .3s ease;
	transition: margin-left .3s ease, opacity .3s ease;
}

.showcase-section ul li.showcase-feature-active h3::before {
	opacity: 1;
	margin-left: -15px;
}

.showcase-section ul li.showcase-feature-active h3 { color: var(--cnvs-themecolor); }

.showcase-section .showcase-target {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	opacity: 0;
	width: 100%;
	-webkit-transform: translateX(-10px);
	-ms-transform: translateX(-10px);
	-o-transform: translateX(-10px);
	transform: translateX(-10px);
	-webkit-transition: all .3s .1s ease;
	-o-transition: all .3s .1s ease;
	transition: all .3s .1s ease;
	-webkit-backface-visibility: hidden;
}

.showcase-section .showcase-target.showcase-target-active {
	opacity: 1;
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	-o-transform: translateX(0);
	transform: translateX(0);
	z-index: 9;
}

.showcase-section .showcase-target:first-child { position:  relative; }


.toggle {
    --cnvs-toggle-base-color: var(--cnvs-heading-color);
    --cnvs-toggle-font-size: 1.125rem;
    --cnvs-toggle-title-color: var(--cnvs-heading-color);
    --cnvs-toggle-content-padding: 1.5rem 1.75rem;
    margin: 0 0 30px 0;
}

.toggle-header {
	border-radius: var(--cnvs-card-rounded);
	font-weight: 600;
}

.toggle-content {
	padding: 1.5rem 0;
	padding-bottom: .75rem;
	opacity: .8;
	margin-bottom: 0;
}

.toggle-closed {
	transition: .2s;
	opacity: .2;
}

.toggle-active .toggle-closed {
	display: block;
	transform: rotate(45deg);
	opacity: 1;
}

.pricing-tenure-switcher .btn-group {
    background-color: var(--cnvs-contrast-200);
    padding: 6px;
}

.pricing-tenure-switcher .btn-group .btn {
    --bs-btn-border-width: 0;
    --bs-btn-padding-x: 1.25rem;
    --bs-btn-padding-y: 0.425rem;
    --bs-btn-font-size: var(--bs-body-font-size);
    --bs-btn-font-weight: 500;
    border-radius: var(--bs-border-radius-pill) !important;
}

.pricing-tenure-switcher .btn-check:checked + .btn {
    background-color: var(--cnvs-contrast-900);
	color: #FFF;
}

#map { 
	height: 100vh; 
	width:100%;
	background-color: #ddd; 
	z-index: 1;
}

.leaflet-container {
	height: 400px;
	width: 600px;
	max-width: 100%;
	max-height: 100%;
}

.revo-slider-emphasis-text {
	font-size: 64px;
	font-weight: 700;
	letter-spacing: -1px;
	font-family: 'Poppins', sans-serif;
	padding: 15px 20px;
	border-top: 2px solid #FFF;
	border-bottom: 2px solid #FFF;
}

.revo-slider-desc-text {
	font-size: 20px;
	font-family: 'Lato', sans-serif;
	width: 650px;
	text-align: center;
	line-height: 1.5;
}

.revo-slider-caps-text {
	font-size: 16px;
	font-weight: 400;
	letter-spacing: 3px;
	font-family: 'Poppins', sans-serif;
}

.tp-video-play-button { display: none !important; }

.tp-caption { white-space: nowrap; }

/* media query */

@media(max-width: 1200px){
	.block-tab-2 .nav-tabs .nav-item .nav-link.active {
		top: -55.5px;
		font-size: 52px;
		background-color: transparent;
	}
}

/* laptop */
@media(max-width: 992px){
	.block-tab-2 .nav-tabs .nav-item .nav-link.active {
		top: -55.5px;
		font-size: 52px;
		background-color: transparent;
	}
}

/* tablet */
@media(max-width: 768px){
	.block-tab-2 .nav-tabs .nav-item .nav-link.active {
		top: -40.5px;
		font-size: 42px;
		background-color: transparent;
	}	
}

/* mobile phone */
@media(max-width: 576px){
	.block-tab-2 .nav-tabs .nav-item .nav-link.active {
		top: -13.5px;
		font-size: 24px;
		background-color: transparent;
	}
}