/* Banner */
	#banner{
		height: 100vh;
		position: relative;
	}
	#banner .item{
		width: 100%;
		height: 100vh;
	}
	#banner .item #img{
		width: 100%;
		height: 100vh;
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center top;
	}
	#banner .item #img #description{
		width: 55%;
		margin: 0 auto;
		color: white;
	}
	#banner h1{
		font-size: 54pt;
		margin: 20px auto;
	}
	#banner p{
		width: 80%;
		margin: 10px auto;
	}
	#banner .item #img .tabs .cells{
		width: 100%;
		height: 100vh;
	}

	#banner #banner_logo{
		position: absolute;
		top: 0;
		left: 0;
	}

	#banner #banner_logo #logo{
		position: absolute;
		top: 80px;
		left: 80px;
		height: 80px;
	}

	#banner #banner_logo #absen_bc{
		position: absolute;
		top: -230px;
		left: -300px;
		width: 775px;
		height: 500px;
		background-color: rgba(215, 3, 0, .5);
		transform: rotate(-45deg);
	}

	#banner #banner_picture .owl-controls{
		position: relative;
		top: -62px;
	}
	#banner #banner_picture .owl-controls .owl-page.active span{
		background: rgb(182, 182, 182);
	}
	#banner #banner_picture .owl-controls .owl-page span{
		margin: 5px;
		background: rgb(70, 105, 166);
	}
/* Banner */

/* about_us */
	#about_us{
		padding: 60px 0;
	}
	#about_us h1{
		color: rgb(219, 1, 2);
	}
	#about_us p{
		line-height: 1.6;
	}
/* about_us */

/* service */
	#service{
		padding: 40px 0;
		/*background-color: gray;*/
	}
	#service h1,#service h2{
		color: white;
	}
	#service h2{
		font-size: 24pt;
	}
	#service p{
		line-height: 1.6;
		color: white;
	}

	#service #list .bar{
		margin: 50px .5%;
		display: inline-grid;
		width: 31%;
	}
	#service #list .bar img{
		width: 75%;
		margin: 0 auto;
	}
/* service */

/*absen_wrapper*/
	#absen_wrapper{
		position: relative;
		overflow-x: hidden;
		overflow-y: hidden !important;
	}

	 #absen_wrapper .abs_tri{
	 	position: absolute;
	 	z-index: -1;
	}

	 #absen_wrapper #absen_1{
	 	background-color: rgb(99, 96, 97);
	 	width: 300px;
	 	height: 300px;
	 	transform: rotate(135deg);
	    left: -155px;
	    top: 75px;
	}

	#absen_wrapper #absen_2{
	 	background-color: rgb(167, 167, 167);
	 	width: 260px;
	 	height: 260px;
	 	transform: rotate(135deg);
	    right: -155px;
	}

	#absen_wrapper #absen_3{
	 	background-color: rgb(229, 78, 79);
	 	width: 2600px;
	 	height: 1200px;
	 	transform: rotate(-135deg);
	 	left: -1000px;
	 	top: 1100px;
	}

	#absen_wrapper #absen_4{
	 	background-color: rgb(73, 104, 166);
	 	width: 660px;
	 	height: 660px;
	 	transform: rotate(135deg);
	 	top: 340px;
	    right: -340px;
	}

	#absen_wrapper #absen_5{
	 	background-color: rgb(99, 96, 97);
	 	width: 480px;
	 	height: 480px;
	 	transform: rotate(135deg);
	    left: -250px;
	    bottom: 575px;
	}

	#absen_wrapper #absen_6{
	 	background-color: rgb(73, 104, 166);
	 	width: 260px;
	 	height: 260px;
	 	transform: rotate(135deg);
	    right: -155px;
	    bottom: 175px;
	}
/*absen_wrapper*/

@media screen and (max-width: 1024px) and (min-width: 528px){ /* tab */
	
}

@media screen and (max-width: 736px) /*and (min-width: 528px)*/ { /* Mobile landscape */

	/*banner*/
		#banner,
		#banner .item,
		#banner .item #img,
		#banner .item #img .tabs .cells{
			height: 320px;
			/*height: 65vh;*/
		}

		#banner h1{
			font-size: 24pt;
		}
		#banner p{
			font-size: 9pt;
		}
		#banner .item #img #description{
			width: 85%;
		}

		#banner #banner_logo #logo{
			top: 20px;
			left: 15px;
			width: 40px;
			height: 40px;
		}
		#banner #banner_logo #absen_bc{
			top: -90px;
			left: -90px;
			width: 180px;
			height: 180px;
			/*display: none;*/
		}
	/*banner*/

	/*service*/
		#service h1{
			color: rgb(219, 1, 2);
		}
		#service p{
			color: unset;
		}
		#service #list .bar{
			margin: 50px auto;
			display: block;
			width: 100%;
		}
	/*service*/

	/*absen_wrapper*/
		#absen_wrapper #absen_1{
		 	width: 220px;
		 	height: 220px;
		    left: -195px;
		    top: 55px;
		}

		#absen_wrapper #absen_2{
		 	width: 150px;
		 	height: 150px;
		    right: -115px;
		}

		#absen_wrapper #absen_3{
		 	width: 2600px;
		 	height: 1200px;
		 	top: unset;
		 	left: -850px;
		 	bottom: -225px;
		}

		#absen_wrapper #absen_4{
		 	width: 360px;
		 	height: 360px;
		 	top: 50px;
		    right: -360px;
		}

		#absen_wrapper #absen_5{
		 	width: 260px;
		 	height: 260px;
		    left: -230px;
		    bottom: 575px;
		}

		#absen_wrapper #absen_6{
		 	width: 180px;
		 	height: 180px;
		    right: -165px;
		    bottom: 175px;
		}
	/*absen_wrapper*/
}

@media screen and (max-width: 528px){
	/*banner*/
		#banner,
		#banner .item,
		#banner .item #img,
		#banner .item #img .tabs .cells{
			height: 520px;
			/*height: 65vh;*/
		}
	/*banner*/
}