body {
	top: 0;
	left: 0;
	margin: 0;
	padding: 0;
	width: 100%;
	font-family: 'Roboto', sans-serif;
}

.crop-text-8 {
	-webkit-line-clamp: 7;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
}

.crop-text-3 {
	-webkit-line-clamp: 3;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
}

.crop-text-4 {
	-webkit-line-clamp: 4;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-box-orient: vertical;
}


img.foto-guru {
	height: 200px;
	object-fit: cover;
	object-position: top;
}

a.link-guru {
	text-decoration: none;
	color: #000;
}

.wrapper {
	background: #fff;
	padding: 0;
	height: 100%;
}

table {
	width: 100%;
}

#header-top {
	position: absolute;
	height: 40px;
	width: 100%;
	padding: 0;
	margin: 0;
	z-index: 5;
}

#header {
	min-height: 150px;
	position: absolute;
	z-index: 2;
}

#header img {
	height: 120px;
	margin: 20px 0px 0 20px;
}

#moto {
	position: absolute;
	width: 100%;
	height: 400px;
	z-index: 3;
	bottom: 0;
	/* background: rgba(48, 197, 247, 0.4); */
	background-image: url('../../img/gradasi.png');
}

#moto img {
	width: 55vw;
	padding-top: 240px;
	float: right;
}

nav {
	background: #30C5F7;
	width: 100%;
	padding: 0;
}

nav .navbar {
	height: 70px;
	margin: 0;
	padding: 0;
}

#navbar-scroll {
	width: 100%;
	position: fixed;
	z-index: 100;
}

#navbar-scroll img,
#navbar-scroll p {
	display: none;
}

#navbar-static img,
#navbar-static p {
	display: none;
}

li.nav-item {
	padding: 0 8px;
	border-radius: 3px;
	text-align: center;
	font-size: 16px;
}

li.nav-item a {
	color: #fff;
}

li.nav-item a:hover,
li.nav-item a:active {
	color: #FFF212;
}

.dropdown-menu a.dropdown-item {
	color: #000;
	font-size: 14px;
}

.dropdown-menu a.dropdown-item:hover {
	background: #30C5F7;
	color: #fff;
}


.dropdown-submenu {
	position: relative;
}

.dropdown-submenu>.dropdown-menu {
	top: 0;
	left: 100%;
	margin-top: -6px;
	margin-left: -1px;
	-webkit-border-radius: 0 6px 6px 6px;
	-moz-border-radius: 0 6px 6px;
	border-radius: 0 6px 6px 6px;
}

.dropdown-submenu:hover>.dropdown-menu {
	display: block;
}

.dropdown-submenu>a:after {
	display: block;
	content: " ";
	float: right;
	width: 0;
	height: 0;
	border-color: transparent;
	border-style: solid;
	border-width: 5px 0 5px 5px;
	border-left-color: #ccc;
	margin-top: 5px;
	margin-right: -10px;
}

.dropdown-submenu:hover>a:after {
	border-left-color: #fff;
}

.dropdown-submenu.pull-left {
	float: none;
}

.dropdown-submenu.pull-left>.dropdown-menu {
	left: -100%;
	margin-left: 10px;
	-webkit-border-radius: 6px 0 6px 6px;
	-moz-border-radius: 6px 0 6px 6px;
	border-radius: 6px 0 6px 6px;
}


/* Slide */
.carousel {
	height: 92vh;
}

.carousel .carousel-inner .carousel-item img {
	min-height: 92vh;
	max-height: 92vh;
	width: 100%;
	object-fit: cover;
	object-position: center;
}

.carousel-fade .carousel-item {
	opacity: 0;
	transition-duration: .5s;
	transition-property: opacity;
}

.carousel-fade .carousel-item.active,
.carousel-fade .carousel-item-next.carousel-item-left,
.carousel-fade .carousel-item-prev.carousel-item-right {
	opacity: 1;
}

.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-right {
	opacity: 0;
}

.carousel-fade .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade .active.carousel-item-prev {
	transform: translateX(0);
	transform: translate3d(0, 0, 0);
}

/* Akhir Slide */


/* Konten */
#konten {
	padding: 30px 0;
	min-height: 85vh;
	background: #fff;
	line-height: 30px;
	font-size: 14px;
	font-family: 'Roboto', sans-serif;
}

/* Berita */
a.link-berita {
	text-decoration: none;
	line-height: 25px;
}

img.berita-kiri-beranda {
	min-height: 150px;
	max-height: 150px;
	object-fit: cover;
	width: 100%;
}

img.berita-kanan-beranda {
	width: 50%;
	height: 100px;
	object-fit: cover;
}

/* Akhir Berita */

.card-body {
	border-bottom: solid 3px #30C5F7;
	border-radius: 5px;
}

.card-title {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 25px;
}

.card-text span {
	font-size: 14px !important;
	font-family: 'Roboto', sans-serif;
}

.card-custom {
	box-shadow: 0 0 15px rgba(10, 10, 10, 0.3);
}

.card-custom-img {
	height: 200px;
	min-height: 200px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	border-color: inherit;
}

.card-custom-img::after {
	position: absolute;
	content: '';
	top: 161px;
	left: 0;
	width: 0;
	height: 0;
	border-style: solid;
	border-top-width: 40px;
	border-right-width: 0;
	border-bottom-width: 0;
	border-left-width: 545px;
	border-left-width: calc(575px - 5vw);
	border-top-color: transparent;
	border-right-color: transparent;
	border-bottom-color: transparent;
	border-left-color: inherit;
}

.card-custom-avatar img {
	border-radius: 50%;
	box-shadow: 0 0 15px rgba(10, 10, 10, 0.3);
	position: absolute;
	top: 100px;
	left: 1.25rem;
	width: 100px;
	height: 100px;
}

.card li {
	margin-left: -25px;
}

.card li.link-pendidikan {
	margin-left: 0px;
}

.card-header {
	background: #00B8FF;
	color: #fff;
	padding: 5px 15px;
}

/* Akhir Konten */

/* Kontak */
#kontak {
	background: #333;
	margin-bottom: -50px;
	padding-top: 20px;
	padding-bottom: 20px;
}

#kontak #alamat-sekolah {
	border-right: solid 3px #00C272;
}

#kontak #alamat-sekolah img {
	width: 100%;
	height: 175px;
}

#kontak #delta {
	height: 100%;
}

#kontak #delta img {
	width: 250px;
	bottom: -150px;
	position: relative;
}

#kontak #smk-bisa img {
	width: 100%;
	height: 100%;
	margin-top: -20px;
}

#kontak #smk-bisa ul li a img {
	margin-top: 20px;
	margin-bottom: -30px;
	width: 40px;
	height: 40px;
}

/* Footer */

footer {
	bottom: 0;
	background: #0098DA;
	color: #fff;
	min-height: 40px;
	padding: 15px 0;
	font-size: 14px;
}

/* Akhir Footer */

@media (max-width: 1198px) {
	#header {
		display: none;
	}

	.carousel#foto,
	.carousel#video {
		min-height: 400px;
	}

	.carousel#foto .carousel-item img {
		width: 100%;
		min-height: 300px !important;
		max-height: 300px !important;
		margin-top: 20px;
	}

	.carousel#video .carousel-item iframe {
		width: 100%;
		min-height: 200px !important;
		max-height: 200px !important;
		margin-top: 10px;
	}

	img.berita-kiri-beranda {
		min-height: 240px;
		max-height: 240px;
		object-fit: cover;
		width: 100%;
	}

	img.berita-kanan-beranda {
		width: 50%;
		height: 120px;
	}


	li.nav-item {
		text-align: left;
		padding-left: 10px;
	}

	#navbar-scroll img,
	#navbar-static img {
		display: block;
		width: 50px;
		height: 50px;
	}

	.dropdown-submenu:hover>.dropdown-menu {
		display: block;
		margin-left: 30px;
		margin-top: 0px;
	}

	#navbar-scroll p,
	#navbar-static p {
		display: block;
		margin-top: 14px;
		color: #fff;
		font-weight: bold;
	}

	li.nav-item a:hover,
	li.nav-item a:active {
		margin-bottom: 0px;
	}

	.carousel {
		height: 40vh;
	}

	.carousel .carousel-inner .carousel-item img {
		min-height: 40vh;
		max-height: 40vh;
		width: 100%;
		object-fit: cover;
		object-position: center;
	}

	#moto {
		position: absolute;
		height: 100px;
		z-index: 3;
	}

	#moto img {
		width: 65vw;
		padding-top: 15px;
		float: right;
	}

	img.foto-guru {
		height: 280px;
		object-fit: cover;
		object-position: top;
	}

	#kontak #alamat-sekolah img {
		width: 100%;
		height: 130px;
	}

}

/*Galeri slide*/
.carousel#foto,
.carousel#video {
	height: 200px;
}

.carousel#foto .carousel-item img {
	width: 100%;
	min-height: 180px !important;
	max-height: 180px !important;
}

/*Akhir Galeri slide*/