html {
	scroll-behavior:smooth;
}
body {
  /* Margin bottom by footer height */
  margin-bottom: 60px;
}



.produk{
	position:relative;
	display:flex;
	justify-content:space-around;
	align-items:center;
	flex-wrap:wrap;
	flex-direction:row;
	width:100%;
	height:160px;
}
.profil{
	position:relative;
	display:flex;
	justify-content:space-around;
	align-items:center;
	flex-wrap:wrap;
	flex-direction:row;
	width:100%;
	height:160px;
}
.jaringan{
	position:relative;
	display:flex;
	justify-content:space-around;
	align-items:center;
	flex-wrap:wrap;
	flex-direction:row;
	width:100%;
	height:160px;
}
.kontak{
	position:relative;
	display:flex;
	justify-content:space-around;
	align-items:center;
	flex-wrap:wrap;
	flex-direction:row;
	width:100%;
	height:160px;
}

.carousel-item {
	
	background-size:cover;
	height:600px;
	margin-top:50px;
}
.jumbotron {
	background-image:url('img/index.jpg');
	background-size:cover;
	height:620px;
	margin-top:50px;
}

.jumbotron .display-4 {
	margin-top:-50px;
	margin-left:1000px;
	margin-right:200px;
	font-size:35px;
	font-weight:bold;
}

.jumbotron .lead {
	margin-left:1000px;
	
}

.jumbotron hr {
	margin-left:1000px;
	width:500px;
}

.jumbotron .btn {
	margin-left:1000px;
}

.card {
	width:20rem;
	margin-top:-10px;
	margin-left:50px;
}
.card .display-4{
	font-size:20px;
}
hr{
	width:120px;
	border-top:3px solid #eaeaea;
	margin-top:-50px;
}
.col-md-3 img {
	margin-left:50px;
	margin-top=-50px;
	
}

.table {
	margin-top:60px;
	margin-left:70px;
	margin-bottom=:-20px;
	
}


.accordion{width:100%;max-width:360px;margin:30px auto 20px;background:#FFF;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px}
.accordion .link{cursor:pointer;display:block;padding:15px 15px 15px 42px;color:#4D4D4D;font-size:14px;font-weight:700;border-bottom:1px solid #CCC;position:relative;-webkit-transition:all .4s ease;-o-transition:all .4s ease;transition:all .4s ease}
.accordion li:last-child .link{border-bottom:0}
.accordion li i{position:absolute;top:16px;left:12px;font-size:18px;color:#595959;-webkit-transition:all .4s ease;-o-transition:all .4s ease;transition:all .4s ease}
.accordion li i.fa-chevron-down{right:12px;left:auto;font-size:16px}
.accordion li.open .link{color:#b63b4d}
.accordion li.open i{color:#b63b4d}
.accordion li.open i.fa-chevron-down{-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)}
.submenu{display:none;background:#444359;font-size:14px}
.submenu li{border-bottom:1px solid #4b4a5e}
.submenu a{display:block;text-decoration:none;color:#d9d9d9;padding:12px;padding-left:42px;-webkit-transition:all .25s ease;-o-transition:all .25s ease;transition:all .25s ease}
.submenu a:hover{background:#b63b4d;color:#FFF}

.menu-accordion {
	position:relative;
	background: rgb(135, 157, 226);
	border: 1px dashed rgb(223, 30, 30);
   padding: 5px;
   width: 600 px;
   margin: 0px auto;
}
.menu-accordion .sub {
	position:relative;
	border: 1px dashed #999;
   padding: 10px;
   background: #fff;
   margin:5px;
}
.menu-accordion ul {
	position:relative;
	list-style:square;
}
.menu-accordion li a {
	position:relative;
	text-decoration: none;
   color:red;
   font-weight: normal;
}
.menu-accordion li a:hover {
	position:relative;
	text-decoration: underline;
   color:red;
   font-weight: normal;
}
.menu-accordion h1 {
	position:relative;
   margin:0px ;
   font-size:14px;
}
.menu-accordion h1 a {
	position:relative;
   display: block;
   font-weight: normal;
   color:red;
   text-decoration: none;
   font-size:13	px;
   margin:0px ;
}
.menu-accordion h1 a:hover {
	position:relative;
   text-decoration: underline;
}
.menu-accordion h1 + div {
	position:relative;
   height: 0 ;
   overflow: hidden;
   -webkit-transition: height 0.5s ease-in;
}
.menu-accordion :target h1 a {
	position:relative;
   text-decoration: none;
   font-weight: bold;
}
.menu-accordion :target h1 + div {
	position:relative;
   height: 25%;
}

.accordion {
	max-width: 600px;
	margin: 0 auto;
  }
  .accordion input{
	display: none;
  }
  .accordion input + label {
	position: relative;
	display: block;
	cursor: pointer;
	font-weight: 700;
	font-size: 1em;
	padding: 10px 40px;
	color: #ddd;
	background: #363636;
	background: -webkit-linear-gradient(top, #363636 0%, #363636 50%, #454545 90%, #363636 100%);
  }
  .accordion label i {
	font-size: 0.9em;
	position: absolute;
	left: 15px;
	top: 14px;
  }
  .accordion label i.fa-chevron-down {
	right: 20px;
	left: auto;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
   -o-transition: all 0.3s ease;
   transition: all 0.3s ease;
  }
  .accordion input:checked + label {
	background: #0B94BF;
	color: #fff;
  }
  .accordion input:checked + label i.fa-chevron-down{
	-webkit-transform: rotate(180deg);
	-moz-transform: rotate(180deg);
   -ms-transform: rotate(180deg);
   -o-transform: rotate(180deg);
   transform: rotate(180deg);
  }
  .accordion input + label:hover {
	background: -webkit-linear-gradient(top, #009CCE 0%, #009CCE 50%, #00779D 90%, #009CCE 100%);
	color: #fff;
  }
  .accordion .item {
	transform: scaleY(0);
	transform-origin: top;
	max-height: 0px;
	overflow: hidden;
	position: relative;
	border: 1px solid #bbb;
	padding: 0 15px;
	font-weight: normal;
	font-size: 14px;
	background: #fff;
	color: #000;
	transition: all 0.3s ease-in-out;
  }
  #item1:checked ~ #content1,
  #item2:checked ~ #content2,
  #item3:checked ~ #content3,
  #item4:checked ~ #content4 {
	max-height: 350px;
	transform: scaleY(1);
  }
  .accordion .item h4, .accordion .item p{
	margin: 0;
	padding: 0;
  }
  .accordion .item h4 {
	padding: 10px;
	border-bottom: 1px solid #bbb;
  }
  .accordion .item p {
	padding: 10px 0;
  }