@charset "utf-8";
/* CSS Document */
body{
	margin: 0;
	padding: 0;
	font-family: sans-serif;

}

.breadcrumb{
	background-color: transparent!important;
	
}

.hidden-xs{
	display:none;
}

.visible-lg{
	display:block;
}
.bg-black{
	background-color: #000;
}

.bg-content{

 	background-color: rgb(225, 236, 204);

 }


.testimoni{
	      font-style: italic;
            font-size: 20px;
            padding: 70px;
            color:grey;
            white-space: break-spaces;


}

.h1{ 
      font-family:"Lucida Bright", Georgia, serif;
      font-size:24px;
      color:#FF0;

  }
  .h1 a{
  	color: #FF0;
  }

.h2{
	color: #f76107;
	font-size:20px;

}

.text-li{
	color: rgb(128, 0, 128);
	font-size: 17px;


}

p{
    
    font-size:17px;
	color:#000;
}

.text-judul{
	color: rgb(128, 0, 128);
	font-family:cambria;
	font-size: 24px;

}

		
.box-washap2{
	position:fixed;
	bottom:30px;
	right:0px;
	z-index:500;
	
	}
	
.text-pi{
	color:#A52A2A;
	text-align: center;
	font-family: Cambria;
	font-size: 32px;

	
	}

.text-pi a{
	color: #000;


}


.logo{
	padding: 0px;
	left: 10px;
}


@media(min-width:768px)
{
	.hidden-xs{
	display:block;
	}
	
	.visible-lg{
	display:none;
    }

}

.font-abu{
	color:#CCC;

}

.header{
	width:100%;
	background-color:transparent;
	transition:1s;
	position:fixed;
	z-index:200;
	
}
    

.mr-2{
           margin-right: 0.5rem;
        }

       
.btn{
     font-family: sans-serif; 
     font-size: 0.8em;  
     background: #3164e7; 
     color: white;  
     border: white 0.2rem solid; 
     border-radius: 0.5rem; 
     padding: 0.3rem 1.2rem;
     padding-left: 0.5rem;
     padding-right: 0.5rem;
     margin-top: 0.2rem;
     text-decoration:none; 
       }
      /* memberi efek hover pada button */
.btn:hover{
          opacity:0.9;
      }
.footer{
	width:100%;
	background-color:#000;
	}

}

a {
 color: #72c02c;
 text-decoration: none;
}


.menu{
	margin:0px;
	list-style-type:none;
	padding:0px;
	
	display:flex;
	justify-content:flex-end;
	
}

     .menu li a{
		 color: #CF9;
		
		 padding:10px  20px;
		 display:inline-block;
		 
		
}

    .menu li a:hover{
		color: #FF0;
		background-color:#6F0;
		text-decoration:none;
		
}

.carousel {
  …

  &::scroll-button(left) {
    content: "⬅" / "Scroll Left";
  }
  
  &::scroll-button(right) {
    content: "⮕" / "Scroll Right";
  }

  &::scroll-button(*)::focus-visible {
    outline-offset: 5px;
  }
}

		
.mydropdown{
	margin:0px;
	padding:0px;
	list-style-type:none;
	width:200px;
	
}

.menu li ul.mydropdown{
	display:none;
	
}
.menu li:hover ul.mydropdown{
	display:block;
	position:absolute;
	z-index:100;
	
}

.container{
            font-size: 20vw;


        }

.to-top{
	width:60px;
	height:60px;
	background-color:#06F;
	position:fixed;
	bottom:10px;
	right:10px;
}

.title-menu{
	margin:10px 0px 0px 0px;
	padding:10px;
	font-size:17px;
	background-color:#000;
	text-align:center;
	border-top-left-radius:5px;
	border-top-right-radius:5px;
	color:#fff;
	
}

.menu-vertical{
	margin:0px 0px 20px 0px;
	padding:10px;
	list-style-type:none;
	border:solid 1px #CCCCCC;


	
}


.menu-vertical li a{
	display:block;
	padding:10px;
	border:solid 1px #000;
	border-right:solid 1px #000;
	border-left:solid 1px #000;
	text-align:center;
	color:#000;
	text-transform:uppercase;

}