/*mencegah modal memperkecil ukuran konten setiap modal dibuka tutup*/
.prevent-modal-decrease{

	position: fixed;

	bottom: 0%; 

	top: 0%;

}.prevent-modal-decrease2{

	overflow-y: scroll; 

	height: 100%;

}

/*end*/
.titik{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.noselect{

  -webkit-touch-callout: none; /* iOS Safari */

    -webkit-user-select: none; /* Safari */

     -khtml-user-select: none; /* Konqueror HTML */

       -moz-user-select: none; /* Old versions of Firefox */

        -ms-user-select: none; /* Internet Explorer/Edge */

            user-select: none; /* Non-prefixed version, currently

                                  supported by Chrome, Edge, Opera and Firefox */

}

.carousel-inner > .carousel-item {

	transition: transform .2s ease-in-out,-webkit-transform .2s ease-in-out;

}

.colo1{

	color: #40a4f1 !important;

}

.colo2{

	color: #e93c58 !important;

}

.col-rod{

	color: var(--primary-color1);

}

#loading-mili{

	width: 100%;

	height: 100%;

	position: fixed;

	top: 0;

	z-index: 9999;

	display: flex;

	justify-content: center;

	align-items: center;

}

.loading-white{

	width: 100%;

	height: 100%;

	background-color: #fff;

	opacity: 0.5;

}

.judul-filter{

	font-size: 15px;

	font-weight: 800;

}



.btn-listing-u{

	width: 90%;

}

.navbar-menu-container{

	/*line-height: 60px;*/

}

.btn{

	font-size: 14px ;

}





.wa-bans:hover{

	cursor: pointer;

}

#mobile_filter_title{

	font-size: 16px;

}



.footer-menu-text{

	font-size: 10px !important;

	padding-top: 4px;

}

body{

	background-color: #f7f7f7;

}

.input-group{

	flex-wrap: nowrap;

}

.img-floating {

    position: fixed;

    right: 1.5em;

    bottom: 5em;

    z-index: 9999;

    width: 10em;

    height: 10em;

    transition: transform 500ms;

}

.img-floating:hover {

    transform: scale(1.2);

}

.chat-container{

	padding: 10px 60px 10px 20px;

}

@media (max-width: 540px){

	.chat-container{

		padding: 10px 20px;

	}

}

.close-banner{

    position: absolute;

    right: 0;

    background-color: transparent;

    width: 40px;

    height: 40px;

    border: none;

    color: #ddd;

    font-size: 25px;

}

.close-banner:hover{

	color: #fff;

}

.img-floating-container{

    position: fixed;

    right: 1px;

    bottom: 2em;

    z-index: 9999;

    background: linear-gradient(-45deg, #128c7e,#25d366,#075e54);

    background-size: 400% 400%;

    width: auto;

    height: auto;

    /*padding: 10px;*/

    color: white;

    border-radius: 100px;

    border-bottom-right-radius: 0;

    border-top-right-radius: 0;

    animation: change 8s ease-in-out infinite;

}

.img-floating-container-ig{

    position: fixed;

    right: 1px;

    bottom: 2em;

    z-index: 9999;

    background: linear-gradient(45deg, #5851db, #833ab4, #c13584, #f77737, #ffdc80);

    background-size: 400% 400%;

    width: auto;

    height: auto;

    /*padding: 10px;*/

    color: white;

    border-radius: 100px;

    border-bottom-right-radius: 0;

    border-top-right-radius: 0;

    animation: change 5s ease-in-out infinite;

}

.img-floating2{

	color: white;

}

.no-radius{

	border-radius: 0 !important;

}

.img-floating2 i{

	font-size: 28px;

}

.img-floating2 .ri-instagram-line{

	font-size: 18px;

}

.img-floating2 .contact-container{

	display: flex;

    flex-direction: column;

    align-items: center;

    width: 100%;

}

.img-floating2 .chat-now{

	font-size: 14px;

}

.img-floating2 .chat-num{

	font-size: 14px;

	font-weight: 900;

}

.img-floating2:hover{

	color: #fff;

}

.img-floating2:hover  .ri-whatsapp-line:before{

    content: "\f2bb";

}

.img-floating2:hover  .ri-instagram-line:before{

    content: "\ee65";

}

@keyframes change {

	0%{

		background-position:0 50% ;

	}

	50%{

		background-position:100% 50% ;

	}

	100%{

		background-position:0 50% ;

	}

}

@media(min-width: 821px){

	.img-floating {

    bottom: 1em;

	}

	.img-floating2{

		bottom: 3em !important;

	}

}

@media(max-width: 540px){

	.img-floating {

		right: 1em;

		bottom: 4.5em;

		width: 6em;

		height: 6em;

	}

	.img-floating2{

		bottom: 5em;

	}

}

.donlod-all-img{

    position: absolute;

    right: 0;

    bottom: 0;

    color: #fff;

    width: 15%;

    opacity: 0.5;

    display: flex;

    justify-content: center;

    align-items: end;

    font-size: 27px;

    margin-bottom: 10px;

    transition: opacity .15s ease;

    z-index: 16;

}

.donlod-all-img:hover{

	cursor: pointer;

	opacity: 1;

}

.wrapper{

	padding-top: 80px;

}

.carousel-inner-view{

	/*height: 26.4rem;*/

}

.area .badge-primary, 

.card-border .badge-primary-yelow{

	background-image: linear-gradient(#fa9e0b,#f7c500);

	background-color: none;

}

/*carousel drag*/

	.carousel img {

	  user-drag: none;

	  -webkit-user-drag: none;

	  -khtml-user-drag: none;

	  user-select: none;

	}

/*end*/

.login-logo-img{

    border-radius: 50%;

    display: inline-block;

    vertical-align: middle;

    width: 100%;

    height: 100%;

    object-fit: cover;

}

.btn-login-navbar{

	color: var(--primary-color1);

  border-color: var(--primary-color1);

  border-radius: 24px;

  font-size: 13px;

}

.btn-login-navbar:hover{

	color: #fff;

	background-color: var(--primary-color1);

}

.col222{

	color: #222;

}

.colfff{

	color: #fff !important;

}

.btn-yelo{

  background-color: var(--primary-color1);

  border-radius: 0.8rem;

  width: 100%;

}

.btn-222{

  background-color: #222;

  border-radius: 0.8rem;

  width: 100%;

}

.col-white{

	color: white !important;

}

.bold6{

	font-weight: 600;

}

.hidden{

	display: none;

}

.text-decoration-underline{

	text-decoration: underline;

}

.info_jumlah{

	padding-right: 15px;

	padding-left: 15px;

	display: flex;

	justify-content: space-between;J

}
#modal-mobile .select2-container--default .select2-selection--single {
	background-color: #fff;
    outline: none;
    font-size: 14px;
    border-radius: 99px;
    padding-left: 10px;
    border: 1px solid #d6d6d6;
    transition: all 0.3s ease;
}
.select2-container{
	width: 100% !important;
}
#modal-mobile .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 100%;
    position: absolute;
    top: 1px;
    right: 15px;
    width: 20px;
}

.info_jumlah select{

  outline: none;

  /*font-size: 16px;*/

  border-radius: 5px;

  padding-left: 5px;

  padding-right: 25px;

  /*border: 1px solid #5b626b;*/

  border: 1px solid #e5e5e5;;

  background: transparent;

  transition: all 0.3s ease;

}

.ri-equalizer-line:before {

    content: "\ec9d";

    color: var(--primary-color1);

}

.ri-user-3-fill:before {

    content: "\f255";

    color: var(--primary-color1);

}

.dropdown-menu{

	left: -74% !important;

	margin-top: 2em;

	border-radius: 15px;

	box-shadow: 0 2px 30px rgb(0 0 0 / 22%);

}

.dropdown-item{

	display: flex;

	align-items: center;

	padding: 0.55rem 1.3rem;

	border-left: 5px solid #fff;

}

.dropdown-item:hover{

	border-left: 5px solid var(--primary-color1);



}

.dropdown-menu::before{

	content: '';

	position: absolute;

	top: -5px;

	right: 1.3em;

	width: 20px;

	height: 20px;

	background: #fff;

	transform: rotate(45deg);

	z-index: -10;

}

/*menu bar*/

	.footbar-container ul{

		list-style: none;

		display: flex;

		align-items: center;

		margin: 0;

		width: 100%;

		justify-content: space-around;

	}

	.footbar-container{

		max-width: 100%;

		margin: 0 auto;

	}

	.footbar-container nav{

		position: fixed;

		bottom: 0;

		right: 0;

		left: 0;

		width: 100%;

		background-color: #fff;

		display: flex;

		align-items: center;

		justify-content: space-evenly;

		z-index: 30;

		border-radius: 1.25rem 1.25rem 0 0;

		border-top: 1px solid #ebebeb;

	}

	.footbar-container nav :where(li, a){

		position: relative;

	}

	.footbar-container ul li a{

		display: flex;

		align-items: center;

		justify-content: center;

		flex-direction: column-reverse;

		font-size: 1.7em;

		line-height: 1;

		width: 70px;

		height: 2.3em;

		-webkit-transition: all .3s ease-out;

		transition: all .3s ease-out;

		color: var(--primary-color1);

	}

	.footbar-container ul li a .btn-footbar{

		background: var(--primary-color1);
		color: var(--white);
		width: 40px;
		height: 35px;
		border-radius: 10px;
		display: flex;
		justify-content: center;
		align-items: center;
		font-weight: 500;
		position: relative;
	}



	.footbar-container ul li span{

		font-size: 14px;

		/*color: var(--primary-color1);*/

	}



	.footbar-container li:hover > a{ 

		color: #222; 

	}

	.footbar-container li.active .ri-home-4-line:before {

	    content: "\ee1c";    

	}

	.footbar-container li.active .ri-community-line:before {

	    content: "\ebb9";  

	}

	.footbar-container li.active .ri-calculator-line:before {

	    content: "\eb1e";  

	}

	.footbar-container li.active .ri-user-line:before {

	    content: "\f25f";    

	}

	.footbar-container ul li.active a#listing_page,

	.footbar-container ul li.active a#proyek_page,

	.footbar-container ul li.active a#profile_page,

	.footbar-container ul li.active a#kpr_page{

		color: #222;

	}

/*end*/



/*bottom sheet*/

		.modal-mobile-container .modal{

			top: 24px;

		}

		.modal-mobile-container .modal-content {

		    border-radius: 0.7rem 0.7rem 0 0;

		}

		.modal-mobile-container .fade {

				opacity: 1;

		    transform: translateY(0%);

		    transition: transform .2s linear;

		}



		.modal-mobile-container .fade:not(.show) {

		    transform: translateY(100%);

		}

		.modal-mobile-container .modal-footer{

			justify-content: space-between;

		}

		

		.bottom-sheet-container,

		.bottom-sheet-share-container{

			position: fixed;

			top: 0;

			left: 0;

			width: 100%;

			height: 100%;

			background-color: rgba(0, 0, 0, 0.5);

			align-items: flex-end;

			justify-content: center;

			display: none;

			z-index: 999;

		}

		.bottom-sheet-container.active,

		.bottom-sheet-share-container.active{

			display: flex;

		}

		.bottom-sheet{

			background-color: #fff;

			width: 100%;

			height: 92%;

			border-radius: 1rem 1rem 0 0;

			transform: translateY(100%);

			transition: transform 0.4s ease-in-out;

		}

		.bottom-sheet.active,

		.bottom-sheet-share.active{

			transform: translateY(0);

		}

		.close-bottom{

		  position: absolute;

		  display: flex;

		  top: 11px;

		  left: 24px;

		  z-index: 1;

		}

		.close-bottom-sheet{

			border: none;

			outline: none;

			padding: 0px;

			cursor: pointer;

			position: relative;

			background: transparent;

			font-size: 1.5rem;

			font-weight: 700;

			line-height: 1;

			color: #000;

		}

		.close{

			opacity: 1;

		}

		.header-bottom-sheet{

			-webkit-box-pack: justify;

			-webkit-box-align: center;

			display: flex;

			flex: 0 0 auto;

			align-items: center;

			justify-content: space-between;

			padding: 0px;

			min-height: 48px;

			font-size: 16px;

			line-height: 20px;

			font-weight: 800;

			border-bottom: 1px solid #dee2e6;

		}

		.body-bottom-sheet{

		    display: flex;

		    flex-wrap: wrap;

		    padding: 1rem;

		    justify-content: space-between;

		    max-height: 565px;

		    overflow-y:scroll ;

		  }

		.footer-bottom-sheet{

			-webkit-box-pack: justify !important;

		    -webkit-box-align: center !important;

		    display: flex !important;

		    flex: 0 0 auto !important;

		    border-top: 1px solid rgb(235, 235, 235) !important;

		    padding: 16px 24px !important;

		    align-items: center !important;

		    justify-content: space-between !important;

		    font-size: 16px !important;

		    line-height: 20px !important;

		}

/*end*/



/*bottom sheet share*/	

		.bottom-sheet-share{

			background-color: rgba(247, 247, 247, 1.0);

			width: 100%;

			height: 52%;

			border-radius: 1rem 1rem 0 0;

			transform: translateY(100%);

			transition: transform 0.4s ease-in-out;

		}

	.body-bottom-sheet-share{

		    padding: 24px !important;

	    flex: 1 1 auto !important;

	    overflow-y: auto !important;

	    outline: none !important;

	}

	.share-link{

		font-size: 16px !important;

	    line-height: 20px !important;

	    color: #222;

	    font-weight: 800 !important;

	}

	.share-link-method{

		  /*padding-right: 16px !important;*/

	    width: 100% !important;

	    border: 1px solid rgb(235, 235, 235) !important;

	    cursor: pointer !important;

	    background: rgb(255, 255, 255) !important;

	}

	.share-logo-container{

		display: flex;

		justify-content: center;

		align-items: center;

	}

	.share-link-method i{

		font-size: 30px;

	}

	.share-link-method:nth-child(1){

		    border-radius: 8px 8px 0px 0px !important;

	}

	.share-link-method:nth-child(4) {

	    border-radius: 0px 0px 8px 8px !important;

	}

	.share-link-btn{

		    cursor: pointer !important;

	    position: relative !important;

	    touch-action: manipulation !important;

	    font-family: inherit !important;

	    font-size: inherit !important;

	    line-height: inherit !important;

	    font-weight: inherit !important;

	    border-radius: 0px !important;

	    outline: none !important;

	    transition: box-shadow 0.2s ease 0s, -ms-transform 0.1s ease 0s, -webkit-transform 0.1s ease 0s, transform 0.1s ease 0s !important;

	    -webkit-tap-highlight-color: transparent !important;

	    background: transparent !important;

	    border: none !important;

	    color: inherit !important;

	    display: block !important;

	    margin: 0px !important;

	    padding: 0px !important;

	    text-align: inherit !important;

	    text-decoration: none !important;

	    height: 100% !important;

	    width: 100% !important;

	}

	.share-link-btn2{

		-webkit-box-pack: justify !important;

	    -webkit-box-align: center !important;

	    display: flex !important;

	    align-items: center !important;

	    justify-content: space-between !important;

	}

	.share-link-btn-content{

		    font-size: 14px !important;

	    line-height: 18px !important;

	    color: rgb(34, 34, 34) !important;

	    padding: 16px 0px 16px 16px !important;

	    font-weight: 600 !important;

	    overflow: hidden !important;

	    text-overflow: ellipsis !important;

	}

	.tautan-disalin,
	.data-disalin{
        font-size: 1.2rem;
	    box-shadow: 0 2px 4px rgb(0 0 0 / 30%);
	    padding: 0.5rem 1rem;
	    font-weight: 600;
	    display: flex;
	    justify-content: center;
	    align-items: center;
	    border-radius: 8px;
	    border: 1px solid rgb(235, 235, 235) !important;
	    background: rgb(255, 255, 255) !important;
	    position: fixed;
	    z-index: 1200;
	    left: 50%;
	    bottom: 5%;
	    transform: translateX(-50%);
	}
	.eror123{
		font-size: 1em;
		padding: 0.8rem;
		display: flex;
		justify-content: center;
		align-items: center;
		border-radius: 8px;
		border: 1px solid #e5d0c7 !important;
		background: #fceeec !important;
		position: fixed;
		z-index: 1200;
		left: 50%;
		width: 89%;
		top: 10%;
		transform: translateX(-50%);
	}
	.ripple-button {
        position: relative;
        overflow: hidden;
        padding: 16px 32px;
        font-size: 24px;
        border-radius: 4px;
        background-color: #2196F3;
        color: #fff;
        border: none;
        cursor: pointer;
      }

      .ripple-button .ripple {
        position: absolute;
        width: 100%;
        height: 100%;
        top: 50%;
        left: 50%;
        pointer-events: none;
        background-image: radial-gradient(circle, #fff 10%, transparent 10.01%);
        background-repeat: no-repeat;
        background-position: 50%;
        transform: scale(0);
        opacity: 1;
        transition: transform 0.5s, opacity 1s;
      }

      @keyframes ripple-effect {
        to {
          opacity: 0;
          transform: scale(2);
        }
      }
	.data-disalin2{
        font-size: 1.2rem;
	    box-shadow: 0 2px 4px rgb(0 0 0 / 30%);
	    padding: 0.5rem 1rem;
	    font-weight: 600;
	    display: flex;
	    justify-content: center;
	    align-items: center;
	    border-radius: 8px;
	    border: 1px solid rgb(235, 235, 235) !important;
	    background: rgb(255, 255, 255) !important;
	    position: fixed;
	    z-index: 1200;
	    left: 50%;
	    bottom: 12%;
	    transform: translateX(-50%);
	}
	.ri-checkbox-circle-fill {
	    color: #42ba96;
	    font-size: 1.6rem;
	    padding-left: 3px;
	}
	.ri-close-circle-fill {
		color: #fc5758;
		font-size: 1.6rem;
		padding-left: 3px;
	}
    .fade-in {
        opacity: 1;
        animation-name: fadeInOpacity;
        animation-iteration-count: 1;
        animation-timing-function: ease-in;
        animation-duration: 0.3s;
    }

    @keyframes fadeInOpacity {
        0% {
            opacity: 0;
        }
        100% {
            opacity: 1;
        }
    }
    .fade-out {
        opacity: 0;
        animation-name: fadeOutOpacity;
        animation-iteration-count: 1;
        animation-timing-function: ease-in;
        animation-duration: 0.3s;
    }

    @keyframes fadeOutOpacity {
        0% {
            opacity: 1;
        }
        100% {
            opacity: 0;
        }
    }
/*end*/



/*dualring*/

	.lds-dual-ring {

	  display: inline-block;

	  height: 12rem;

	  display: flex;

	  justify-content: center;

	  align-items: center;

	}

	.lds-dual-ring:after {

	  content: " ";

	  display: block;

	  width: 64px;

	  height: 64px;

	  margin: 8px;

	  border-radius: 50%;

	  border: 6px solid #222;

	  border-color: #222 transparent #222 transparent;

	  animation: lds-dual-ring 1.2s linear infinite;

	}

	@keyframes lds-dual-ring {

	  0% {

	    transform: rotate(0deg);

	  }

	  100% {

	    transform: rotate(360deg);

	  }

	}

	.sold-logo,

	.booked-logo,

	.rented-logo {

		position: absolute;

		z-index: 10;

		width: 95%;

		left:50%;
		
		top:50%;
		
		transform: translate(-50%, -50%);
		
		object-fit: contain !important;


	}

	.proyek-sold-logo {

		position: absolute;

		z-index: 10;

		width: 95%;

		left:50%;
		
		top:50%;
		
		transform: translate(-50%, -50%);
		
		object-fit: contain !important;


	}

/*dualringend*/

/*ellipsis*/

	.lds-ellipsis {

	  display: inline-block;

	  position: relative;

	  width: 80px;

	  height: 80px;

	}

	.lds-ellipsis div {

	  position: absolute;

	  top: 33px;

	  width: 13px;

	  height: 13px;

	  border-radius: 50%;

	  background: #ccc;

	  animation-timing-function: cubic-bezier(0, 1, 1, 0);

	}

	.lds-ellipsis div:nth-child(1) {

	  left: 8px;

	  animation: lds-ellipsis1 0.6s infinite;

	}

	.lds-ellipsis div:nth-child(2) {

	  left: 8px;

	  animation: lds-ellipsis2 0.6s infinite;

	}

	.lds-ellipsis div:nth-child(3) {

	  left: 32px;

	  animation: lds-ellipsis2 0.6s infinite;

	}

	.lds-ellipsis div:nth-child(4) {

	  left: 56px;

	  animation: lds-ellipsis3 0.6s infinite;

	}

	@keyframes lds-ellipsis1 {

	  0% {

	    transform: scale(0);

	  }

	  100% {

	    transform: scale(1);

	  }

	}

	@keyframes lds-ellipsis3 {

	  0% {

	    transform: scale(1);

	  }

	  100% {

	    transform: scale(0);

	  }

	}

	@keyframes lds-ellipsis2 {

	  0% {

	    transform: translate(0, 0);

	  }

	  100% {

	    transform: translate(24px, 0);

	  }

	}

/*elip end*/

/*spinner*/

.lds-spinner {

  color: official;

  display: inline-block;

  position: relative;

  width: 80px;

  height: 80px;

}

.lds-spinner div {

  transform-origin: 40px 40px;

  animation: lds-spinner 1.2s linear infinite;

}

.lds-spinner div:after {

  content: " ";

  display: block;

  position: absolute;

  top: 3px;

  left: 37px;

  width: 6px;

  height: 18px;

  border-radius: 20%;

  background: #ccc;

}

.lds-spinner div:nth-child(1) {

  transform: rotate(0deg);

  animation-delay: -1.1s;

}

.lds-spinner div:nth-child(2) {

  transform: rotate(30deg);

  animation-delay: -1s;

}

.lds-spinner div:nth-child(3) {

  transform: rotate(60deg);

  animation-delay: -0.9s;

}

.lds-spinner div:nth-child(4) {

  transform: rotate(90deg);

  animation-delay: -0.8s;

}

.lds-spinner div:nth-child(5) {

  transform: rotate(120deg);

  animation-delay: -0.7s;

}

.lds-spinner div:nth-child(6) {

  transform: rotate(150deg);

  animation-delay: -0.6s;

}

.lds-spinner div:nth-child(7) {

  transform: rotate(180deg);

  animation-delay: -0.5s;

}

.lds-spinner div:nth-child(8) {

  transform: rotate(210deg);

  animation-delay: -0.4s;

}

.lds-spinner div:nth-child(9) {

  transform: rotate(240deg);

  animation-delay: -0.3s;

}

.lds-spinner div:nth-child(10) {

  transform: rotate(270deg);

  animation-delay: -0.2s;

}

.lds-spinner div:nth-child(11) {

  transform: rotate(300deg);

  animation-delay: -0.1s;

}

.lds-spinner div:nth-child(12) {

  transform: rotate(330deg);

  animation-delay: 0s;

}

@keyframes lds-spinner {

  0% {

    opacity: 1;

  }

  100% {

    opacity: 0;

  }

}

/*spinner end*/

/*spinner roller*/

	.lds-roller {

	  display: inline-block;

	  position: relative;

	  width: 80px;

	  height: 80px;

	}

	.lds-roller div {

	  animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;

	  transform-origin: 40px 40px;

	}

	.lds-roller div:after {

	  content: " ";

	  display: block;

	  position: absolute;

	  width: 7px;

	  height: 7px;

	  border-radius: 50%;

	  background: #ccc;

	  margin: -4px 0 0 -4px;

	}

	.lds-roller div:nth-child(1) {

	  animation-delay: -0.036s;

	}

	.lds-roller div:nth-child(1):after {

	  top: 63px;

	  left: 63px;

	}

	.lds-roller div:nth-child(2) {

	  animation-delay: -0.072s;

	}

	.lds-roller div:nth-child(2):after {

	  top: 68px;

	  left: 56px;

	}

	.lds-roller div:nth-child(3) {

	  animation-delay: -0.108s;

	}

	.lds-roller div:nth-child(3):after {

	  top: 71px;

	  left: 48px;

	}

	.lds-roller div:nth-child(4) {

	  animation-delay: -0.144s;

	}

	.lds-roller div:nth-child(4):after {

	  top: 72px;

	  left: 40px;

	}

	.lds-roller div:nth-child(5) {

	  animation-delay: -0.18s;

	}

	.lds-roller div:nth-child(5):after {

	  top: 71px;

	  left: 32px;

	}

	.lds-roller div:nth-child(6) {

	  animation-delay: -0.216s;

	}

	.lds-roller div:nth-child(6):after {

	  top: 68px;

	  left: 24px;

	}

	.lds-roller div:nth-child(7) {

	  animation-delay: -0.252s;

	}

	.lds-roller div:nth-child(7):after {

	  top: 63px;

	  left: 17px;

	}

	.lds-roller div:nth-child(8) {

	  animation-delay: -0.288s;

	}

	.lds-roller div:nth-child(8):after {

	  top: 56px;

	  left: 12px;

	}

	@keyframes lds-roller {

	  0% {

	    transform: rotate(0deg);

	  }

	  100% {

	    transform: rotate(360deg);

	  }

	}

/*roller end*/

.pading-left{

	padding-left: 0.4em;

}

.donlod{

	font-weight: 200;

}

/*spinner ring*/

	#loading-mili .lds-ring {

	  display: inline-block;

	  position: fixed;

	  width: 80px;

	  height: 80px;

	  z-index: 999;

	}

	#loading-mili .lds-ring div {

	  box-sizing: border-box;

	  display: block;

	  position: absolute;

	  width: 64px;

	  height: 64px;

	  margin: 8px;

	  border: 8px solid var(--primary-color1);

	  border-radius: 50%;

	  animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;

	  border-color: var(--primary-color1) transparent transparent transparent;

	}

	#loading-mili .lds-ring div:nth-child(1) {

	  animation-delay: -0.45s;

	}

	#loading-mili .lds-ring div:nth-child(2) {

	  animation-delay: -0.3s;

	}

	#loading-mili .lds-ring div:nth-child(3) {

	  animation-delay: -0.15s;

	}

	@keyframes lds-ring {

	  0% {

	    transform: rotate(0deg);

	  }

	  100% {

	    transform: rotate(360deg);

	  }

	}

/*ring end*/

.image-text:hover{

	cursor: pointer;

}


.skeleton{
	animation: skeleton-loading 1s linear infinite alternate;
}
@keyframes skeleton-loading {
	0%{
		background-color: hsl(200, 20%, 70%);
	}
	100%{
		background-color: hsl(200, 20%, 95%);
	}
}
.skeleton{
	/*width: 516px;*/
	/*height: 10em;*/
	opacity: .7s;
	animation: skeleton-loading 1s linear infinite alternate;
}
.text1 {
    width: 20%;
}
.text3 {
    width: 60%;
}
.text4 {
    width: 90%;
}
.text5.loading1 {
    width: 30%;
    margin-bottom: 0;
}
.loadingimg{
	background: #e3e3e3;
	position: relative;
	overflow: hidden;
}
.loading2{
	width: 90%;
	min-height: 40px;
	border-radius: 0.3rem;
	margin-bottom: 4px;
	background: #e3e3e3;
	position: relative;
	overflow: hidden;
}
.loading3{
	width: 100%;
	min-height: 33px;
	border-radius: 0.3rem;
	margin-bottom: 4px;
	background: #e3e3e3;
	border: none;
  border-radius: 25px;
	position: relative;
	overflow: hidden;
}
@keyframes skeleton-loading{
	100%{
		background-color: hsl(200, 20%, 95%);
	}

}

.border-222{

	border: 1px solid #222;

	border-radius: 0.8rem;

}

#topnav .topbar-main {

  background-color: white;

  border-bottom: 1px solid #ebebeb;

}

.card.list-card {

    background-color: grey;

}

#topnav .topbar-main{

	height: 65px;

	display: flex;

	align-items: center;

}

#topnav{

	z-index: 63;

}

.lsb-active{

	z-index: 64 !important;

}

.profile-img2{

		width: 1.6rem;

		height: 1.6rem;

}

.profile-img {

		border-radius: 50%;

	  display: inline-block;

	  vertical-align: middle;

    width: 100%;

    height: 100%;

    object-fit: cover;

  }

.fa-angle-left{

	display: flex;

	align-items: center;

}

.left-bord{

	border-radius: 50%;

  border: 1px solid #e5e5e5;

  height: 40px;

}

.left-bord:hover{

	border-color: #222;

}



.modal-content{

	border-radius: 0.7rem;

}



#topnav .topbar-main .logo-large {

  height: 40px;

}



#topnav .topbar-main .logo-small {

  display: none;

  height: 40px;

}

.logo2{

	display: inline-block;

}

.app-search input{

  	height: 40px !important;

  }



/*searchbar*/

	.app-search .form-control{

		background: transparent ;

		border-color: #e5e5e5 ;

		color: #5b626b;

		width: 400px;

	}

	.form-group{

		display: flex;

		align-items: center;

	}

	.fa{

		color:var(--primary-color1);

	}

	.search-wrap button:actiive{

		outline: none;

	}

	.leftarrow{

		color: var(--primary-color1);

	}

	.bord{

		background-color: var(--primary-color1);

		border-radius: 50%;

		margin-top: 3px;

	}

	#searchbar{

		display: flex;

		align-items: center;

	}

	.app-search .form-control:focus{

		background: transparent ;

		border-color: #e5e5e5 ;

		color: #5b626b;

		width: 400px;

		}

/*end*/



.card-border {

    box-shadow: 0 0 5px 0 rgb(0 0 0 / 30%);

    /*border-style: solid;*/

    border-radius: 0.8rem;

    border-width: 1px;

    /*border-color: #f5f5f5;*/

    border-color: #d8d8d8;

    overflow: hidden;

    margin: 5px 0;

    flex: 1;

    background: #fff;

}

.card-footer .btn-golden{

	background-color: var(--primary-color1);

	border-radius: 0.8rem;

	width: 100%;

}

#listing_data .card-footer{

	/*background-color: #f5f5f5;*/

}



.btn-telpon-agen,.btn-wa-agen,.btn-hubungi-proyek{

  border: solid 1px #d6d6d6;

  border-radius: 25px;

  -webkit-appearance: none;

  -moz-appearance: none;

  color: #222;

  position: relative;

  z-index: 1;

  outline: none;

}

.btn-telpon-agen::before,

.btn-wa-agen::before,

.btn-hubungi-proyek::before{

	content: "";

	position: absolute;

	border-radius: 25px;

	top: 0;

	left: 0;

	bottom: 0;

	right: 0;

	z-index: -1;

	background-color: var(--primary-color1);



	transition: transform 200ms ease-in-out;

	transform: scaleX(0);

	transform-origin: center;

}

.btn-hubungi-proyek::before{

	transform-origin: center;

}

.btn-telpon-agen:hover::before,

.btn-telpon-agen:focus::before,

.btn-wa-agen:hover::before,

.btn-wa-agen:focus::before,

.btn-hubungi-proyek:hover::before,

.btn-hubungi-proyek:focus::before{

	transform: scaleX(1);

}

.btn-telpon-agen:focus,

.btn-wa-agen:focus,

.btn-hubungi-proyek:focus{

	color: white;

}

.btn-telpon-agen:hover,

.btn-wa-agen:hover,

.btn-hubungi-proyek:hover{

	border: solid 1px white;

	color: white !important;

}



#contact-us .row button{

	width: 100%;

	height: 2rem;

}

#contact-us .row p{

margin-bottom: 0;

}



#contact-us .btn{

	background-color: #222;

	border-radius: 0.8rem;

}

.hover-color0a:hover{

	background-color: #0a0a0a !important;

}



/*otp*/

	#otp .btn{

		background-color: #222;

		border-radius: 0.8rem;

		color: white;

	}

	#otp input[type='text']{

	  border: solid 1px #222;

	  border-radius: 15px;

	  text-align: center;

	  font-size: 0.8rem;

	  height: 2.3rem;

	}

	.loading-otp{

	  background-color: #efe6e688;

	  position: absolute;

	  width: 100%;

	  height: 100%;

	  z-index: 999!important;

	  top: 50%;

	  left: 50%;

	  transform: translate(-50%,-50%);

	  opacity: 1;

	  border-radius: calc(0.3rem - 1px);

	}

	.loading-otp-content{

	  height: 100%;

	  display: flex;

	  justify-content: center;

	  align-items: center;

	  font-size: 2rem;

	  color: #fff;

	}

	.loading-otp-body{

	  background-color: #efe6e688;

	  position: fixed;

	  width: 100%;

	  height: 100%;

	  z-index: 9999!important;

	  top: 50%;

	  left: 50%;

	  transform: translate(-50%,-50%);

	  opacity: 1;

	  border-radius: calc(0.3rem - 1px);

	}

	.loading-otp-content-body{

	  height: 100%;

	  display: flex;

	  justify-content: center;

	  align-items: center;

	  font-size: 2rem;

	  color: #fff;

	}

/*otp end*/

#contact-us button > *{

	color: white;

}



/*.fa-phone{

 color: white;

}*/



/*modals*/

	.modal-title{

		font-weight: bold;

	}

	.ti-filter{

		color: var(--primary-color1);

	}

	.fa-filter{

		color: var(--primary-color1);

	}

	.text-dark{

		color: black !important;

	}

	h5{

		color: #212529;

	}

	.fil-border{

		width: 40px;

		height: 40px;

		border: 1px solid #e5e5e5;

		border-radius: 50%;

		display: flex;

		align-items: center;

		justify-content: center;

	}

	#profile-dekstop.fil-border{

		border: none;

		transition: transform 300ms;

	}

	#profile-dekstop.fil-border:hover{

		cursor: pointer;

		transform: scale(1.1);

	}

	.fil-border:hover{

		border-color: #222;

	}





	input[type='button']{

		border: solid 1px #d6d6d6;

		border-radius: 25px;

		-webkit-appearance: none;

		-moz-appearance: none;

		color: black;

	}

	input[type='button']:hover{

		border-color: #222;

	}



	.btn-select {

	  background-color: var(--primary-color1);

	  color: white !important;

	}



	/*.btn-active{

	  background-color: var(--primary-color1);

	  color: white !important;

	}*/





	.jumlah input[type='number']:focus,

	.jumlah input[type='text']:focus{

		border: solid 1px #222;

		border-radius: 15px;

		text-align: center;

	}

	.jumlah input[type='number'],

	.jumlah input[type='text']{

	border: solid 1px #d6d6d6;

	border-radius: 15px;

	text-align: center;

	transition: 300ms;

}



	#color-jumlah .form-control:focus{

		border-color: #222 !important;

	}

	.select2-container--default .select2-selection--single .select2-selection__rendered {

	    /*color: black;*/

	    line-height: 38px;

	}

	.select2-container--default .select2-selection--single .select2-selection__arrow {

	    height: 100%;

	}

	.price-input{

	  width: 100%;

	  margin: 0 0 16px;

	  display: flex;

	  flex-direction: row;

	}

	.price-input .field{

	  /*display: flex;*/

	  /*align-items: center;*/

	  display: block;

	  flex: 1 1 50%;

	  max-width: 49%;

	  padding: 0px 8px;

	}

	.price-input .separator{

	  width: 2%;

	  display: flex;

	  font-size: 19px;

	  align-items: center;

	  justify-content: center;

	}

	.field .border-field{

	    border-radius: 15px;

	    display: flex;

	    -webkit-box-align: center;

	    align-items: center;

	    position: relative;

	    padding: 0px 12px;

	    border: 1px solid #222;

	    transition: 300ms;

	}

	/*.padding-top-field{

		padding-top: 6px;

	}*/

	.field input{

	  width: 100%;

	  height: 100%;

	  outline: none;

	  font-size: 0.8rem;

	  margin-right: 12px;

	  border-radius: 15px;

	  border: 1px solid #222;

	  -moz-appearance: textfield;

	}

	.rp input{

	  width: 100%;

	  height: 100%;

	  outline: none;

	  font-size: 0.8rem;

	  margin-left: 12px;

	  border-radius: 10px;

	  border: 1px solid #222;

	  -moz-appearance: textfield;

	  border-left: none;

	}



	.rp .input-min{

		border-bottom-left-radius: 0;

		border-top-left-radius: 0;

		margin-left: 0;

		margin-right: 0;

	}

	.rp .input-max{

		border-bottom-left-radius: 0;

		border-top-left-radius: 0;

		margin-left: 0;

		margin-right: 0;

	}

	.input-field-container{

		    display: flex;

	    flex: 1 1 0%;

	    position: relative;

	}

	.input-field-container input{

		width: 100%;

	    color: var(--NN950,#212121);

	    font-size: 16px;

	    font-weight: 400;

	    line-height: 20px;

	    background-color: transparent;

	    border: none;

	    border-radius: 0px;

	    box-shadow: none;

	    position: relative;

	    outline: none;

	    padding: 12px 0px;

	    margin: 0px;

	    transition: color 300ms cubic-bezier(0.2, 0.64, 0.21, 1) 0s;

	}

	.field .label-field{

	    width: 100%;

	    font-weight: normal;

	    white-space: nowrap;

	    text-overflow: ellipsis;

	    pointer-events: none;

	    overflow: hidden;

	    position: absolute;

	    top: 27.2727%;

	    will-change: transform, font-size, line-height;

	    color: var(--NN600,#6D7588);

	    visibility: visible;

	    font-size: 16px;

	    line-height: 20px;

	    transition: color 300ms cubic-bezier(0.2, 0.64, 0.21, 1) 0s, line-height 300ms cubic-bezier(0.2, 0.64, 0.21, 1) 0s, font-size 300ms cubic-bezier(0.2, 0.64, 0.21, 1) 0s, top 300ms cubic-bezier(0.2, 0.64, 0.21, 1) 0s, transform 300ms cubic-bezier(0.2, 0.64, 0.21, 1) 0s;

	}

	.rupiah{

	    /*max-height: 44px;*/

	    font-size: 16px;

	    line-height: 20px;

	    letter-spacing: -0.2px;

	    display: flex;

	    -webkit-box-align: center;

	    align-items: center;

	    align-self: flex-end;

	    overflow: hidden;

	    margin-right: 8px;

	    padding: 12px 0px;

	}

	.modal-content .rupiah{

		  height: 2rem;

	}

	.border-field:focus-within{

		background: transparent ;

		border-color: #e5e5e5 ;

		color: #5b626b;

	}

	/*.rupiah{

		border: 1px solid #222;

		border-top-left-radius: 10px;

		border-bottom-left-radius: 10px;

		border-bottom-right-radius: 0;

		border-top-right-radius: 0;

		border-right: none;

		height: 2rem;



		display: flex;

		align-items: center;

		justify-content: center;

		width: 3em;

	}*/

	.luas .input-max{

		margin-left: 12px;

	}











	input[type="number"]::-webkit-outer-spin-button,

	input[type="number"]::-webkit-inner-spin-button {

	  -webkit-appearance: none;

	}

	.price-input .separator{

	  /*width: 130px;*/

	  display: flex;

	  font-size: 19px;

	  align-items: center;

	  justify-content: center;

	}



	#modal1 h5{

		font-size: 1rem;

	}

	#modal1 input{

		font-size: 0.8rem;

		height: 2rem;

	}

	#modal1 .select2{

		font-size: 0.8rem;

	}

	#select .form-control{

		font-size: 0.8rem;

	}



	.select2-container .select2-selection--multiple, .select2-container--default.select2-container--focus .select2-selection--multiple, .select2-container--default .select2-selection--single {

	    background: white;

	    color: #c0c0c0;

	    height: 38px;

	    outline: 0;

	    border: 1px solid #222;

	}





	.horizontal-scroll{
		display: grid;
		grid-auto-flow: column;
		overflow-x: auto;
		overscroll-behavior-inline: contain;
	}
	.horizontal-scroll::-webkit-scrollbar{
	  display: none;
	}
	.snaps-inline{
		scroll-snap-type: inline mandatory;
		scroll-padding-inline: 1rem;
	}
	.snaps-inline > *{
		scroll-snap-align: start;
	}
	

	.kategori input[type='checkbox']{

		appearance: none;

		-webkit-appearance: none;

		width: 2rem;

		height: 2rem !important;

		border: 1px solid #222;

		border-radius: 5px;	

		cursor: pointer;

		display: flex;

		align-items: center;

		justify-content: center;

	}



	.kategori input[type='checkbox']:after{

		content: '\f00c';

		font-size: 1rem;

		font-family: "font awesome 5 free";

		color: white;

		font-weight: 600;

		display: none;

	}

	.kategori input[type='checkbox']:hover{

		background-color: #e5e5e5;

	}

	.kategori input[type='checkbox']:checked{

		background-color: #222;

	}

	.kategori input[type='checkbox']:checked:after{

		display: block;

	}

	.kategori label{

		font-size: 1rem;

	}

/*modal end*/





.btn-apply{

	color: white;

	background-color: var(--primary-color1);

	border: 1px solid var(--primary-color1);

	border-radius: 8px;

}

.btn-apply:hover{

	color: white;

	background-color: #0a0a0a;

}

.btn-apply:active{

	transform: scale(0.95);

}



.btn-reset{

	color: #374151;

	background-color: #9ca3af;

	border: 1px solid #9ca3af;

}

.btn-reset:hover{

	color: black;

	border-color: #adb5bd;

	background-color: #adb5bd;

}

.btn-reset:active{

	transform: scale(0.95);

}



body .modal-open::-webkit-scrollbar{

	width: 1px;

}

/*whatsap cs*/

	.btn-floating-tambah{
	    position: fixed;
	    right: 1.5em;
	    bottom: 5em;
	    overflow: hidden;
	    width: 3.5em;
	    height: 3.5em;
	    border-radius: 100px;
	    z-index: 999;
	    color: white;
	    transition: 800ms;
	    /* background-color: #34af23; */
	    background-color: #fca311;
	    border: 2px solid #fff;
	    display: flex;
	    align-items: center;
	    justify-content: center;
	}


	.btn-floating-tambah:hover{

		/*width: auto;*/
		transition: transform 250ms cubic-bezier(0.33, 0, 0, 1) 0s;
		transform: scale(1.1);
		padding: 0 20px;

		cursor: pointer;

		/*background-color: #1f7a12;*/

		/*background-color: #DAA520;*/

	}

	.btn-floating-tambah span{

		font-size: 16px;

		margin-left: 5px;

		transition: .2s;

		line-height: 0px;

		display: none;

	}

	/*.btn-floating-tambah:hover span{

		display: inline-block;

	}

	.btn-floating-tambah:hover i{

		margin-bottom: -3px;

	}*/

/*whatasap-end*/





/*carousel*/

	/*.next-hover:hover .carousel-control-prev-icon{

		display: inline-block;

	}

	.next-hover:hover .carousel-control-next-icon{

		display: inline-block;

	}

	.carousel-control-prev-icon{

		display: none;

	}

	.carousel-control-next-icon{

		display: none;

	}*/



	.kategori input[type='checkbox']:after{

		content: '\f00c';

		font-size: 1rem;

		font-family: "font awesome 5 free";

		color: white;

		font-weight: 600;

		display: none;

	}



	.carousel-inner{

		background-color: lightgray;

		border-radius: 0.4rem 0.4rem 0 0;

	}

	.myimage{

		border-radius: 0.4rem 0.4rem 0 0;

	}

/*carousel-end*/

.ri-share-line:before {

    content: "\f0fe";

    color: var(--primary-color1);

}

/*card footer*/

	/*.card-footer {

		display: grid;

	  column-gap: 0.5rem;

	  height: 100%;

	  grid-template-columns: 3fr 2.25fr

	}

	.agen-wrap{

	  column-gap: 0.5rem;

	  color: #000 !important;

	  text-decoration: none !important;

	  display: grid;



	}

	.container-agen{

		align-self: center;

	}

	.agent{

		width: 40px;

	  height: 40px;

	  border-radius: 50%;

	  display: inline-block;

	  vertical-align: middle;

	  object-fit: cover;

	}

	.agen-name,.agen-info{

		display: -webkit-box;

		-webkit-line-clamp: 2;

		-webkit-box-orient: vertical;

		overflow: hidden;

		text-overflow: ellipsis;

	}*/



	.agen-footer{

		  margin-left: 0.25rem;

	    margin-right: 0.25rem;

	    padding: 0 0.5rem;

	    padding-top: 0.5rem;

	    padding-bottom: 0.75rem;

	}

	.container-agen,.modal-agen{

		display: grid;

	}

	.container-agen{

		align-self: center;

	  column-gap: 0.5rem;

	  /*height: 100%;*/

	}

	/* .agen-wrap{

	  column-gap: 0.5rem;

	  color: #222;

	  text-decoration: none ;

	} */

	.data-agen{

		align-self: center;

	}

	.data-agen h5{

		font-size: 16px;

		font-weight: 800;

	}

	.agent{

		min-width: 40px;

	  min-height: 40px;

	  max-width: 50px;

	  max-height: 50px;

	}

	.agent,.agent-modal{

		border-radius: 50%;

	  display: inline-block;

	  vertical-align: middle;

	  object-fit: cover;

	}

	.agent-modal{

	  width: 4.8rem;

	  height: 4.8rem;

	  max-width: 4.8rem;

	  max-height: 4.8rem;

	}

	.agent-modal-nama{

		font-weight: 800;

		color: #222;

		font-size: 2em;

	}

	.agen-name,.agen-info{

	  display: -webkit-box;

	  -webkit-line-clamp: 2;

	  -webkit-box-orient: vertical;

	  overflow: hidden;

	  text-overflow: ellipsis;

	}

	.modal-agen{

		align-items: center;

	}

	.modal-agen button, .modal-agen button span{

		/*color: white;*/

		font-size: 0.9em;

	}

	.modal-agen button:hover{

		color: white;

	}

	.col-white:hover{

		color: white;

	}

	.agen-info-modal{

		font-size: 1.5em;

		color: #222;

	}

/*card footer end*/





.flying{

	position: fixed;



}



/*bottom-navbar*/

	.fixed-bottom{

		height: 50px;

		display: flex;

		justify-content: center;

		z-index: 30;

	}

	.fixed-bottom img{

		height: 20px;

	}

/*end*/
.spinner-border {
    display: inline-block;
    width: 4rem;
    height: 4rem;
    vertical-align: text-bottom;
    border: 0.4em solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    -webkit-animation: spinner-border .75s linear infinite;
    animation: spinner-border .75s linear infinite;
}

.left-side-nav{

	    display: inline-block;

    vertical-align: middle;

    line-height: 96px;

        position: relative;

    z-index: 500;

}

.right-side-nav{

	    float: right;

    display: inline-block;

    vertical-align: middle;

    line-height: 96px;

}

.navbar-menu:hover a{

	color: var(--primary-color1);

}

.navbar-menu-content{

	font-weight: 700;

}

.navbar-menu:hover .navbar-menu-content::before{

	    content: "";

    position: absolute;

    bottom: 0;

    height: 3px;

    width: 2em;

    border-radius: 5px;

    background: var(--primary-color1);

}

@media (max-width:  991px){

	.wrapper{

		padding-top: 80px;

	}

}

@media (max-width: 820px){

	/*.img-floating-container{

		bottom: 5em;

	}*/

	.img-floating-container-ig{

		bottom: 1em;

	}

	#shareMobile{

		display: flex !important;

    padding: 0;

	}

	.dekstopSharemodal{

		display: none;

	}

	#footer-copyright,

	#pembayaran-dekstop,

	.step-title{

		display: none;

	}

	#profile-dekstop,

	.btn-login-navbar{

		display: none;

	}

	.logo-large,

	#navbar-menu-dekstop,

	.logo2 {

    display: none !important;

	}

	.logo-small {

    display: inline-block !important;

	}

}

@media (max-width: 480px) {

	.app-search {

    display: flex;

    width: 90% !important;

    margin-left: 10px !important;

    margin-right: 10px !important;

  }



  .bord{

  	margin-left: 1em !important;

  }



  #searchbar{

  	float: none !important;

  	height: 80px;

  	display: flex;

  	align-items: center;

 		justify-content: flex-end;

  }



  #logo{

  	height: 80px;

  	display: flex;

  	align-items: center;

  }



  .app-search a{

    left: 191px;

  }



	#topnav1 .container-fluid{

	display: flex;

	justify-content: space-between;

	/*justify-content: space-evenly;*/

	align-items: center;

	}



	.app-search .form-control{

		width: 95%;

	}



	.app-search .form-control:focus{

		width: 95%;

	}



	#modalss

	{

		display: flex !important;

		padding: 0;

		/*padding-top: 5px;*/

	}



	#modalss2,

	#shareDekstop{

		display: none;

	}



	.kanan{

		width: 115%;

	}

}



.modal-open {

  overflow:hidden !important;

  /*overflow-y:scroll !important;*/

  padding-right:0 !important;

}

.search-wrap{

		display: flex;

		align-items: center;

    z-index: 3;

    height: 40px;

    background: #fff;

    border: 1px solid #e5e5e5;

    /*box-shadow: 0 2px 5px 1px rgb(64 60 67 / 16%);*/

    border-radius: 24px;

    margin: 0 auto;

        width: 100% !important;

    /*width: calc(var(--center-width) + 38px);;*/

}

.input-search{

	flex: 1;

    display: flex;

    padding: 0px 4px 0 14px;



}

.btn-search{

    height: 34px;

    width: 34px;

    background: transparent;

    border: none;

    cursor: pointer;

    flex: 0 0 auto;

    padding: 0;

    flex: 0 0 auto;

    padding-right: 13px;

    outline: 0;

}

.input-search1{

	    display: flex;

    align-items: center;

    padding-right: 6px;

    margin-top: -7px;

}

.input-search2{

	    display: flex;

    flex: 1;

    flex-wrap: wrap;

    align-items: center;

}

.logo-btn-search{

/*	    background: none;

    color: #4285f4;

    height: 24px;

    width: 24px;

    margin: auto;*/

}

.logo-btn-search-span{

	  display: inline-block;

    fill: currentColor;

    height: 14px;

    line-height: 14px;

    position: relative;

    width: 24px;

}

.input-search2-1{

	height: 40px !important;

	line-height: 40px;

	color: transparent;

	flex: 100%;

	white-space: pre;

	height: 34px;

	font-size: 16px;

}

.input-search2-2, .input-search2-3{

	background-color: transparent;

	border: none;

	margin: 0;

	padding: 0;

	color: rgba(0,0,0,.87);

	word-wrap: break-word;

	outline: none;

	display: flex;

	flex: 100%;

	-webkit-tap-highlight-color: transparent;

	margin-top: -37px;

	height: 34px;

	font-size: 13px;

	height: 40px !important;

	line-height: 40px;

	margin-top: -42px;

	/*padding-bottom: 3px;*/

	display: block;

}

.input-search2-3{

	outline: 0;

  border-right: 1px solid #dadce0;

  height: 65% !important;

  width: 13rem;

}

@media(max-width: 360px){

	.input-search2-3{

	  width: 11rem;

	}		

}

@media(min-width: 481px) and (max-width: 767px){

 .app-search a{

    left: 39.3em;

  }

}

@media(min-width: 821px){

	#footbar,

	.modal-header .input-box,

	#topnav .input-box {

		display: none !important;

	}

}

@media (max-width: 540px){

	.carousel-inner-view{

		/*height: 15.7rem;*/

	}

}

@media (min-width: 768px){

	.agen-footer{

    height: 5.975rem;

	}

}

@media (min-width: 992px){

	.agen-footer{

    height: max-content !important;

	}

}

@media (min-width: 1200px){

	.agen-footer{

    height: 6rem !important;

	}

}



@media (min-width: 1960px){

	.agen-footer{

    height: 4rem !important;

	}

}









@media (max-width: 599px){

	.container-agen {

    grid-template-columns: 3fr 2.25fr;

	}

}

@media (min-width: 600px){

	.container-agen {

    grid-template-columns: 3fr 2.25fr;

	}

}

@media (min-width: 992px){

	.container-agen {

    grid-template-columns: 3fr 2fr;

	}

}

@media (min-width: 1681px){

	.container-agen {

    grid-template-columns: 2fr 3fr;

	}

}









/* @media (max-width: 599px){

	.agen-wrap {

    grid-template-columns: 40px 1fr;

	}

}

@media (min-width: 600px){

	.agen-wrap {

    grid-template-columns: 40px 1fr;

	}

}

@media (min-width: 768px){

	.agen-wrap {

    grid-template-columns: 35px 1fr;

	}

}

@media (min-width: 992px){

	.agen-wrap {

    grid-template-columns: 50px 1fr;

	}

} */



@media (max-width: 599px){

	.agent {

    width: 40px;

    height: 40px;

	}

}

@media (min-width: 600px){

	.agent {

    width: 40px;

    height: 40px;

	}

}

@media (min-width: 992px){

	.agent {

    width: 50px;

    height: 50px;

	}

}



@media(max-width: 575px){

	.modal-agen {

    grid-template-columns: 1fr;

    row-gap: 0.25rem;

	}

}

@media (min-width: 576px){

	.modal-agen {

    grid-template-columns: 1fr;

    row-gap: 0.25rem;

	}

}

@media (max-width: 599px){

	.modal-agen {

    grid-template-columns: 1fr;

    row-gap: 0.25rem;

	}

}

@media (min-width: 600px){

	.modal-agen{

    grid-template-columns: 1fr;

    row-gap: 0.25rem;

	}

}

@media (min-width: 1681px){

	.modal-agen {

    grid-template-columns: 1fr 1fr;

    row-gap: 0;

    column-gap: 0.5rem;

	}

}





@media (max-width: 540px){

	.pt540{

		padding-top: 16px;

	}

}

@media (max-width: 756px){

	.pt756{

		padding-top: 16px;

	}

}

@media (max-width: 995px){

	.pt995{

		padding-top: 16px;

	}

}

@media (min-width: 1048px){

	.pt1048{

		padding-top: 16px;

	}

}

/*@media (max-width: 1048px){

	.pt1048{

		padding-top: 16px;

	}

}*/



@media (min-width: 992px){

	.wrapper .container-fluid .row .next-hover,

	.wrapper .container-fluid .row .start{

    flex: 0 0 33.333333%;

    max-width: 33.333333%;

	}

}

@media (min-width: 1080px){

	.wrapper .container-fluid .row .next-hove,

	.wrapper .container-fluid .row .start{

    flex: 0 0 33.333333%;

    max-width: 33.333333%;

	}

}

@media (min-width: 1307px){

	.wrapper .container-fluid .row .next-hover,

	.wrapper .container-fluid .row .start{

    flex: 0 0 25%;

    max-width: 25%;

	}

}

@media (min-width: 768px){

	.input-search2-3{

	  width: 20rem;

	}

}



@media(max-width: 820px){

	.dekstop-only{

		display: none;

	}

}

@media(min-width: 821px){

	.mobile-only{

		display: none;

	}

}

.trial-banner{
	position: absolute;
	bottom: -34px;
	left: 0;
	width: 100%;
	background: var(--primary-color1);
	padding: 6px 12px;
	color: #fff;
	z-index: 99;
}

.floating-cta{
	position: fixed;
	z-index: 50;
	bottom: 3.8rem;
	right: 1.7rem;
}
.floating-cta-btn{
	display: flex;
	justify-content: center;
	align-items: center;
	min-width: 60px;
	height: 60px;
	border-radius: 50%;
	background: #128c7e;
	color: #fff;
	outline: none;
	position: relative;
	border: none;
	font-size: 1.7rem;
	animation: bounceUp 4s infinite;
}

@keyframes bounceUp {
	0%, 20%, 50%, 80%, 100% {
		transform: translateY(0);
	}
	40% {
		transform: translateY(-12px);
	}
	60% {
		transform: translateY(-8px);
	}
}

.skeleton{
    position: relative;
    overflow: hidden;
    background-color: #d3d3d3;
}
.skeleton::before{
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, transparent, #e3e3e3, transparent);   
    background-size: 450px 400px;
    background-repeat: no-repeat;
    animation: shimmer 1s linear infinite;
}
@keyframes shimmer{
    0%{
        background-position: -450px 0;
    }
    100%{
        background-position: 450px 0;
    }
}

.carousel-inner * {
    object-fit: cover;
    height: 100%;
}
.carousel-inner{
	position: relative;
	border-radius: 8px 8px 0 0;
}
.carousel-inner.portrait-ratio *,
.carousel-inner.temp-ratio *,
.carousel-inner.square-ratio *,
.carousel-inner.landscape-ratio *{
	aspect-ratio: 1/1;
}

@media(max-width: 640px){
	.carousel-inner.portrait-ratio *{
		aspect-ratio: 4/5;
	}
	.carousel-inner.temp-ratio *,
	.carousel-inner.square-ratio *{
		aspect-ratio: 1/1;
	}
	.carousel-inner.landscape-ratio *{
		aspect-ratio: 4/3;
	}
}