body{font-family:sagoe;font-size:18px;width:100%;margin:auto;color:#222f3e;background:#d4d4d7;}
.kontener{
	width:70%;
	margin:auto;
	background:#fff; 
	padding:0px;
}
.kontener img{
	width:100%;
}
.clear {
    clear: both;
}
.konten-panel{
	width:80%;
	margin:auto;
	padding:30px 10px;
}
.panel{
	width:100%;
	margin:auto;
	padding:50px 10px;
	background:red;
	text-align:center;
}
.logo {
	margin:auto;
	width:50%;
}

.pendaftaran{
	width:80%;
	margin:auto;
}

.biayadaftar{

	display:block;
	float:left;
	width:60%;
	text-align:left;
}

.biayadaftar h3{
	font-size:35px;
	font-weight:bold;
	color:#fff;
}
.biayadaftar h4{
	font-size:25px;
	color:#fff;
}
.tombol-daftar{
	float:right;
	width:35%;
}

.tombol-daftar a{
	color:#fff;
	font-size:20px;
	background:#ffa502;
	display:block;
	border-radius:8px;
	text-align:center;
	font-weight:bold;
	padding:15px 20px;
	box-shadow: 0px 20px 15px -3px rgba(0,0,0,0.1);
}

.tombol-daftar a:hover{
	text-decoration:none;
}
.konten-panel h1{
	font-size:50px;
	text-align:center;
	font-weight:800;
	margin-bottom:30px;
	margin-top:50px;
}
.konten-panel img{
	width:25%;
	display: block;
	 margin-left: auto;
	 margin-right: auto;
}
.promo{
	background-color:#f5f6fa;
	padding:30px 8px;
	text-align:center;
	letter-spacing: 1px;
}
.promo h3{
	font-size:30px;
}

.panel-jurusan{
	padding:50px 20px;
	text-align:center;
	margin:auto;
}
.panel-jurusan h2{
	font-size:55px;
	font-weight:800;
	margin-bottom:55px;
}
.konten-jurusan{
	padding:10px;
	width:100%;
	margin:auto;
}

.konten img{
	width:100%;
}

.card {
  background-color: #fff;
  color:#000;
  text-align:left;
  padding:20px;
 }
#list{
	text-align:left;
   border-left:8px solid grey;
   padding-left:10px;
   margin-left:20px;
 }
  #tombol{
	 padding:2px 20px;
 }
 #tombol a{
	 border-radius:8px;
	 background:#1e90ff;
	 color:#fff;
	 padding:8px 0px;
	 display:block;
 }
.card h3{
    font-size:22px;
	font-weight:bold;
	margin:20px 0px 0px 0px;
}

.cards{
  margin: 0 auto;
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
}

.panel-sponsor{
	background:#182C61;
}

.sponsor{
	padding:70px 0px;
	width:90%;
	color:#fff;
	margin:auto;
	text-align:center;
}
.sponsor h1{
	font-size:50px;
	font-weight:bold;
	color:#FFC312;
	margin:0px;
}
.sponsor h2{
	margin:0px;
}
.panel-testi{
	background:#f8f9fa;
	margin:auto;
	text-align:center;
	padding:50px 0px;

}
.konten-testi{
	width:70%;
	margin:auto;
}

.konten-testi h1{
	font-size:40px;
	font-weight:bold;
	margin-bottom:20px;
}
.panel-tentang{
	background:#000;
	text-align:center;
	padding:70px 20px;
}
.panel-tentang h3{
	color:#fff;
	font-weight:800;
	font-size:35px;
	margin-bottom:50px;
	text-align:center;
}
.tentang{
	width:80%;
	margin:auto;
	color:#fff;
	text-align:left;
}

.panel-form{
	padding:50px 20px;
	margin:auto;
	text-align:center;
}
.panel-form p{
	margin:0px 0px 50px 0px;
	padding:10px 15px;;
	background:yellow;
	border-radius:8px;
	font-size:17px;
}
.panel-form h3{
	font-size:50px;
	font-weight:bold;
	margin-bottom:30px;
}

.panel-kontak{
	text-align:left;
	margin:auto;
	padding:50px 20px;
	background:#f1f2f6;
}
.kontak h3{
	font-size:35px;
	margin-bottom:20px;
}
.kontak{
	margin:auto;
	width:80%;
}
.kontak a{
	background:#4cd137;
	color:#fff;
	padding:8px 20px;
	border-radius:20px;
	margin-top:10px;
	font-size:14px;
}
.form-group{
	text-align:left;
}
.studi{
	width:80%;
	margin:auto;
	height:100%;
}
.gambar{
	width:40%;
	float:left;
}
.info{
	width:60%;
	float:right;
	text-align:left;
	padding:0px 0px 0px 30px;
	margin-bottom:15px;
	
}
.info h2{
	margin-bottom:10px;
	font-size:35px;
	font-weight:bold;
	border-bottom:1px solid #000;
	padding-bottom:10px;
}
.info h3{
	margin-bottom:10px;
	font-size:27px;
	font-weight:bold;
	border-bottom:1px solid #000;
	padding-bottom:10px;
}
.pengajar{
	text-align:left;
	display: inline-block;
	padding:10px 55px;
	width:100%;
	margin:auto;
	color:#fff;
	height:100%;
}
.pengajar h1{
	text-align:center;
}
.panel-pengajar{
	width:50%;
	float:left;
	padding:0px 15px;
}
.panel-testi h3{
    font-size:45px;
}

.tujuan li{
	display: inline-block;
	padding: 8px;
}
.tujuan a{
	background:#ffa502;
	color:#fff;
	border-radius:5px;
	padding:5px 8px;
}
.tujuan a:hover{
	text-decoration:none;
}
.kemana{
	color:#fff;
	text-align:center;
	margin-bottom:30px;
}
.kemana h3{
	font-size:35px;
}
.tujuan h1{
	font-size:18px;
	display: inline-block;
	font-weight:bold;
	padding:5px 8px;
}
.tombole a{
	background:#4cd137;
	padding:10px 20px;
	display:block;
	border-radius:8px;
	color:#fff;
	font-size:25px;
	font-weight:bold;
	text-align:center;
}
.tombole a:hover{
	text-decoration:none;
}
.produk p{
	padding:25px 0px 20px 0px;
	text-align:left;
}
.produk{
	text-align:left;
}
.destinasi{
	width:48%;
	float:left;
	border-right:1px dotted #d4d4d7;
	padding-right:20px;
}
.durasi{
	width:48%;
	float:right;
}
.produk h3{
	font-size:25px;
	font-weight:bold;
}
.gambar-iklan img{
	border-radius:3%;
}




/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
@media screen and (max-width: 600px) {
.konten-panel h1{
	font-size:33px;
}
.destinasi{
	width:100%;
	border:none;
	padding-right:0px;
}
.durasi{
	width:100%;
	margin-top:25px;
}
.tentang{
	width:100%;
}
.tujuan{
	width:100%;
}
.kemana h3{
	font-size:28px;
}
 .konten-panel img{
	width:50%;
	display: block;
  margin-left: auto;
  margin-right: auto;
	}
.konten-panel{
	width:90%;
	margin:auto;
	padding-top:50px;

	}
.tombol-daftar a{
	padding:15px 20px;
}
.tombol-daftar{
	width:100%;
}
.biayadaftar h3{
	font-size:24px;
	font-weight:bold;
	text-align:center;
	}
.pendaftaran{
	width:90%;
	margin:auto;
	}
.tombol-daftar a:hover{
	text-decoration:none;
}
.panel{
	width:100%;
	margin:auto;
	text-align:left;
}
.promo h3{
	font-size:28px;
}
.promo{
	padding:30px 20px;
}
.panel-jurusan h2{
	font-size:40px;
}
.konten-jurusan{
	width:100%;
	padding:0px;
}
.konten-testi{
	width:90%;
	margin:auto;
}
.konten-testi h1{
	font-size:25px;
}
.panel-tentang h3{
	font-size:33px;
}
.kontak h3{
	font-size:25px;
	font-weight:bold;
}
.panel-form h3{
	font-size:35px;
	font-weight:bold;
}
.sponsor h1{
	font-size:40px;
	margin:0px;
}
.sponsor h2{
	font-size:20px;
	margin:0px;
}
.kontener{
	width:100%;
}
.biayadaftar{
	width:100%;
	text-align:center;
}
.gambar{
	width:100%;
	margin-bottom:10px;
}
.info{
	width:100%;
	padding:0px;
}
.studi{
	width:100%;
}
.pengajar h1{
	font-size:30px;
}
.panel-pengajar{
	width:100%;
	padding: 0px 20px;
}
.pengajar{
	padding:10px;
	font-size:14px;
}
.info h2{
	font-size:35px;
}
.container {
  width: 100%;
  padding: 0px;
}
.panel-testi h3{
    font-size:25px;
}
.logo img {
	width:100%;
}
.logo {
	width:70%;
}
}

@media (min-width: 600px) {
  .cards { grid-template-columns: repeat(2, 1fr); }
}
@media (min-width: 900px) {
  .cards { grid-template-columns: repeat(2, 1fr); }
}
/*batas media*/