/************************************************************************************
CSS design by Imtas W
*************************************************************************************/
/* untuk ukuran layar 700px kebawah */
@media screen and (max-width: 768px) {

body {
font-family: 'Montserrat', sans-serif; font-size: 14px ; color:#333; line-height:25px; font-weight: 500;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
}

#robot-pointer {
        display: none !important;
    }


#bg-inside-header
{
height:63px;
}

#bg-headline-banner_home > div { /* Contoh jika konten ada di dalam div */
  display: inline-block;
  justify-content: center;
  align-items: center;
  height: auto; /* Sesuaikan tinggi div konten */
}

#bg-headline-banner_home
{
width: auto; height:auto;
border:0px solid red; padding-top:100px; padding-bottom:100px; padding-left:15px; padding-right:15px;
}



	.page-header
	{
	position: fixed;top:0px;left:0px; right:0px; z-index:99999; background-image: linear-gradient(to left, #662D91 , #1B1464);
	-moz-box-shadow: 0px 1px 5px #000; -webkit-box-shadow: 0px 1px 5px #000; box-shadow: 0px 1px 5px #000;
  -webkit-transition: top 0.8s;
  -moz-transition: top 0.8s;
  transition: top 0.8s;
	}
	
.page-header.off-canvas { top: 0px; background-image: linear-gradient(to left, #662D91 , #1B1464);  }

.page-header.fixed {
  top: 0;
  z-index: 9999999;
}
	
	#header
	{
	width: 100%; display:inline-block; 
	}
	
	#full-header
	{
	display:none;
	}
	
	#header-mobile
	{
	width: 100%; padding:0px; height:110px; text-align:center; border:#FF0000 0px solid;
	display:flex;
	align-items:center;
	color:#333333;
	}
	
	
#menu-top
{
border:#FF0000 0px solid; margin-bottom:0px;  margin-top:0px; background: #00FF00;
}

	#kiri-header
	{
	display: none;
	}
	
	#kanan-header
	{
	width: auto; padding:0px; float:none; text-align:center;
	display:block; height:0px;
	align-items:center;
	
	}
	
	#spot-row
	{
	width: 100%; display:block; border:#333 0px solid;
	}
	
	#menu-res
	{
	width: auto; display:block;
	}
	
	#col-prodi-grid
	{
	width: 140px; padding:0px; float:none; border: #aaa 0px dashed;
	display:inline-block;
	align-items:center;
	padding:0px; text-align: center;
	border-radius:10px;
	margin-top:20px;
	margin-right:5px;
	vertical-align: text-top;
	
	}
	
	#col-prodi-grid-break
	{
	width: auto; padding:0px; float:none; border: #aaa 1px dashed;
	display:inline-block;
	align-items:center;
	padding:0px; text-align: center;
	border-radius:10px;
	margin-top:20px;
	margin-right:0px;
	clear:both;
	}
	
	#col4-grid
	{
	width: 100%; padding:0px; float:none; height: auto; border: #aaa 0px dashed;
	display:inline-block;
	align-items:center;
	padding:0px; text-align: left;
	border-radius:20px;
	margin-top:20px;
	margin-right:0px;
	vertical-align: top;
	}
	
	#col4-grid-break
	{
	width: 100%; padding:0px; float:none; height: auto; border: #aaa 0px dashed;
	display:inline-block;
	align-items:center;
	padding:0px; text-align: left;
	border-radius:20px;
	margin-top:20px;
	margin-right:0px;
	clear:both;
	}
	
	#col3-grid
	{
	width: auto; padding:0px; float:none; height: auto; border: #aaa 0px dashed;
	display:inline-block;
	align-items:center;
	padding:0px; text-align: left;
	border-radius:20px;
	margin-top:20px;
	margin-right:0px;
	vertical-align: top;
	}
	
	#col3-grid-break
	{
	width: auto; padding:0px; float:none; height: auto; border: #aaa 0px dashed;
	display:inline-block;
	align-items:center;
	padding:0px; text-align: left;
	border-radius:20px;
	margin-top:20px;
	margin-right:0px;
	clear:both;
	}

	#col2-grid
	{
		width:auto; padding:0px; float:none; height: auto; border:#FF6600 0px solid;
		display:inline-block;
		align-items:center;
		padding:0px; text-align: left;
		padding-left:0px;
		border-radius:0px;
		margin-top:20px;
	}
	
	#col2-grid-break
	{
		width: auto; padding:0px; float:none; height: auto; border:#FF6600 0px solid;
		display:inline-block;
		align-items:center;
		padding:0px; text-align: left;
		padding-left:0px;
		border-radius:0px;
		margin-top:20px;
		clear:both;
	}

	#col2-left-pg
	{
	width: auto; padding:0px; float:none; height: auto; border:#FF6600 0px solid;
	padding:0px; text-align: left;
	padding-left:0px;
	border-radius:0px;
	margin-top:10px;
	}
	
	#col2-right-pg
	{
	width: auto; padding:0px; float:none; height: auto; border:#FF6600 0px solid;
	padding:0px; text-align: left;
	padding-left:0px;
	border-radius:0px;
	margin-top:10px;
	}

	
#news-tick-spot
{
width: auto; padding:1px; text-align:center; 
}

#nt-title li {
font-size:16px; font-weight:bold; color:#333; text-align:center;
text-shadow: 0 2px 0 #fff;
	white-space: nowrap;
	list-style: none;
	overflow: hidden;
	text-overflow: ellipsis;
	padding:0px; 
}

#quote-container
{
width: auto; padding:10px;
background: url(pics/bg_pbtv.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;	

}

#footer-spot-col
{
width: 100%; float: none; height: auto; border-bottom:#000 0px dashed; padding-left:0px; border-left: #fff 0px dashed;
padding-bottom:10px; text-align: left; border-radius:0px; color:#ccc; margin-bottom: 15px;
}

#footer-spot-col2
{
width: 100%; float: none; height: auto; border-bottom: #999 1px dashed; padding-left:0px; border-left: #fff 0px dashed;
padding-bottom:10px; text-align: left; border-radius:0px; color:#ccc; margin-bottom: 25px;
}

#footer-spot-col3
{
width: 100%; float: none; height: auto; border: #333333 0px dashed; padding-left:0px; border-left: #fff 0px dashed;
padding:0px; text-align: left; border-radius:0px; color:#ccc;
}

#big-font-title
{
font-size:42px; line-height:42px; font-weight: 900;
}

#big2-font-title
{
font-size:38px; line-height:38px; font-weight: 900; padding-bottom:10px;
}

.robot-1 {
  animation-duration: 1s, 4s;
  top: -15%; right: 0;
  width:100px;

}


.robot-2 {
	display:none;
}

.robot-4 {
	display:none;
}

.robot-5 {
	display:none;
}

.robot-3 {
  animation-duration: 1s, 7s;
  animation-delay: 0.7s, 3s;
  bottom: -15%; left:0;
  width:80px;
}
		
	#quote-spot
	{
	width: auto; border:#FF0000 0px solid; display:inline-block; padding:20px;
	font-size:30px; font-weight:bold; line-height:30px; letter-spacing:-2px; color:#FFFFFF; 
	text-shadow: 0 2px 0 #000;
	float:none;
	}
	
	#col-left-faq
	{
	width: auto; float:none; height: auto; border: #333333 0px dashed; margin-right:0px;
	padding:25px; text-align: left; border-radius:20px; margin-bottom: 20px; padding-bottom: 40px;
	}
	
	#col-right-faq
	{
	width: auto; float:none; height: auto; border: #333333 0px dashed;
	padding:25px; text-align: justify; border-radius:20px;
	}
	
	#col-left-head-banner
	{
	width:auto; float:none; height: auto; border: #333333 0px dashed; margin-right: 0px; margin-top: 0px; color:#FFFFFF;
	text-align: left; padding:10px;
	}
	
	#col-right-head-banner
	{
	width:auto; float:none; height: auto; border: #333333 0px dashed; color:#FFFFFF;
	text-align: left; padding:10px; margin-top:0px;
	}
	
	
	#col-right-home-reg
	{
	width:auto; float:none; height: auto; border: #333333 0px dashed; color:#333;
	text-align: left; padding:10px;
	}
	
	#col-left-home-reg
	{
	width:100%; float:none; height: auto; border: #333333 0px dashed; color:#333; margin-right: 0px; margin-bottom:30px;
	text-align: left; border-radius:30px;
		-moz-box-shadow: 5px 5px 20px #999;
		-webkit-box-shadow: 5px 5px 20px #999;
		box-shadow: 5px 5px 20px #999;
	}
	
	#spot-no-bg
	{
	width: auto; padding-top:50px; padding-bottom:40px; padding-left:20px; padding-right:20px; border:0px solid red;
	}
	
	
	#col-left-rektor-home
	{
	width: auto; float:auto; height: auto; border: #333333 0px dashed; color:#fff;
	text-align: left; margin-bottom:30px;
	}
	
	#col-right-rektor-home
	{
	width: auto; float:auto; height: auto; border: #663399 0px solid; color:#fff;
	text-align: left; padding:10px;
	}
	
	#menu-trigger {
	display: none;
	}
	

	.center-cropped-4col {
	  object-fit: cover; /* Do not scale the image (cover / contain) */
	  object-position: center; /* Center the image within the element */
	  width: 100%;
	  height: auto;
	  }
	  
	.center-cropped-3col {
	  object-fit: cover; /* Do not scale the image (cover / contain) */
	  object-position: center; /* Center the image within the element */
	  width: 100%;
	  height: auto;
	  }

	.center-cropped-2col {
	  object-fit: cover; /* Do not scale the image (cover / contain) */
	  object-position: center; /* Center the image within the element */
	  width: 100%;
	  height: auto;
	  }
	
.center-cropped-bulet {
  object-fit: cover; /* Do not scale the image (cover / contain) */
  object-position: center; /* Center the image within the element */
  width: 110px;
  height: auto; padding:5px;
    }
	
	#main-container
	{
	width: auto; display:block;
	padding:25px;
	padding-bottom:50px;
	border: red 0px dashed;
	height: auto;
	margin-top:0px;
	background:rgba(255,255,255, 0.5);
	border-bottom:0px dashed lightblue;
	margin-bottom:0px;
	}
	
	
	#main-content
	{
	width:auto; float: none; height: auto; border: orange 0px dashed; margin-right: 0px;
	padding:15px; padding-bottom:0px; text-align: justify; border-radius:0px;
	height: auto;
	margin-bottom:0px;
	}
	
	#main-content-full
	{
	width:auto; float: none; height: auto; border: orange 0px dashed; margin-right: 0px;
	padding:15px; padding-bottom:0px; text-align: justify; border-radius:0px;
	height: auto;
	margin-bottom:0px;
	}
	
	#rightside-menu
	{
	width: auto; float:none; height: auto; border: blue 0px dashed;
	padding:15px; text-align: center; border-radius:0px; padding-bottom:0px;
	height: auto;
	}
	
	#title-product
	{
	text-align:center; padding-top:10px;
	}
	
	#sticky-menu
	{
	width:100%;
	}
		
.search-form {
  display: flex;
  gap: 10px;
  animation: scaleIn 0.4s ease;
  padding:20px; border:0px solid red;
}



.search-form input {
  width: 70%;
  padding: 14px 18px;
  font-size: 18px;
  border-radius: 30px;
  border: none;
  outline: none;
}

.search-form button {
  padding: 14px 22px;
  border-radius: 30px;
  border: none;
  background: #ffcc00;
  font-weight: 600;
  cursor: pointer;
}



.search-btn {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 16px;
  color: #fff;
  margin-left:10px;
  position:absolute; z-index:9999;
  right:50px; top:23px;
}

.tombol-daftar-mobile {
display:block;
  background: none;
  border: none;
  cursor: pointer;
  color: #fff;
  margin-left:10px;
  position:absolute; z-index:9999;
  right:65px; top:18px;
 
}

.button2 {
display:none;
}

.button3 {
  border-radius: 5px;
  background-color: #FECA44;
  border: none;
  color: #333;
  text-align: center;
  font-size: 12px;
  padding: 7px;
  width: auto;
font-family: 'Montserrat', sans-serif; font-weight:600;

}
	
.pb-tooltip {
display:none;
}
	
  .whatsapp-float {
    right: 15px;
    bottom: 15px;
    width: 50px;
    height: 50px;
  }

  .whatsapp-float img {
    width: 24px;
    height: 24px;
  }  
	
	.float-panel {position:static!important;}	
	
	.shape {
        display: none !important;
	
}

.table-scroll-zone {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.table-scroll-zone table {
    width: max-content;
    min-width: 900px;
}

.table-scroll-zone::after {
    content: "Geser >>";
    display: block;
    text-align: right;
    font-size: 12px;
    color: #777;
    padding: 5px 0;
}
#big3-font-title
{
font-size:25px; line-height:40px; font-weight: 900; padding-bottom:10px;
}
}

@media screen and (max-width: 480px) {
	.gallery-desktop {
		display:none;
	}
	.gallery-mobile {
		display: block;
	}
}