@charset "utf-8";
/* CSS Document */

.logo-akmaliah img{
	width:270px;
	height:auto;}
#navigasi-beranda{
	font-size:1em;
	position:absolute;
	right:60px;
	top:30px;
	color:rgba(236,236,236,1.00);
	letter-spacing: 1.2px;}
#navigasi-beranda a{
	color:rgba(255,255,255,1.00);}
.tinggi-15{
	margin:0;
	padding:0;
	clear:both;
	display:block;
	height:15px;
	width:100%;
	}
#welcome{
	background-color:rgba(236,236,236,1.00);
	background-image:url(img/akmaliah-050-kecil.jpg);
	background-size:cover;
	background-position:bottom center;
	background-attachment: fixed;
	height:100vh;
	/*display: -webkit-box;
  	display: -webkit-flex;
  	display: -ms-flexbox;
  	display: flex;
	text-align: center;
	-webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
	-webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
	-webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;*/}
#welcome h2{
	font-size:3.5em;
	font-family: 'times', serif;
	}
	
#welcome h4{
	color:#F3F3F3;
	font-size:1.6em;
	font-family: 'Raleway', sans-serif;}
.wrapper-80{
	height:80vh;
	display:block;
	padding-top:30px;
	display: -webkit-box;
  	display: -webkit-flex;
  	display: -ms-flexbox;
  	display: flex;
	text-align: center;
	-webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
	-webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
	-webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;}
.wrapper-20{
	height:15vh;
	display:block;
	padding-top:0px;
	display: -webkit-box;
  	display: -webkit-flex;
  	display: -ms-flexbox;
  	display: flex;
	text-align: center;
	-webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
	-webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
	-webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;}


.wrapper-livestreaming-title{
	height:20vh;
	}
.wrapper-livestreaming-title h2{
	letter-spacing: 3px;
	font-weight:400;
	color:#FFFFFF;
	font-size:3em;
	}
.wrapper-livestreaming-title h4{
	color:#00CB62;
	font-size:2em;
	font-weight:700;
	}

#video-streaming h2{
	letter-spacing: 3px;
	font-weight:400;
	color:#00CB62;
	font-size:3em;}
	
#video-streaming h4{
	font-size:2em;
	/*color:#1EB461;*/
	color:#ffffff;
	letter-spacing: 3px;
	font-weight:700;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7);}
.wrapper-akmaliah{
	}
.wrapper-akmaliah img{
	width:400px;
	height:auto;
	}
.wrapper-button{
	width:200px;
	text-align: center;
	letter-spacing: 2px;}
	
	
.wrapper-button h3{
	color:#FFFFFF;
	font-size:1.2em;
	clear:both;}
	
	
#live-stream{
	background-color:rgba(29,29,29,1.00);
	background-image:url(img/akmaliah-055.jpg);
	/*background-image: url(img/gradient-radial.png),url(img/seamless-akm2016.jpg);
	background-repeat:no-repeat, repeat;
	background-attachment: scroll, fixed;*/
	background-position:center center, center center;
	    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
    background-size: cover;
	height:100vh;
	display: -webkit-box;
  	display: -webkit-flex;
  	display: -ms-flexbox;
  	display: flex;
	text-align: center;
	-webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
	-webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
	-webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;}

.btn-live-stream{
	font-family: 'Raleway', sans-serif;
	font-weight:700;
	width:50%;
	background-color:#007f3d;
	color:rgba(255,255,255,1.00);
	padding:10px 0px 10px 0px;
	text-decoration:none;
	float:left;
	display:block;
	border-radius: 5px 0px 0px 5px;
-moz-border-radius: 5px 0px 0px 5px;
-webkit-border-radius: 5px 0px 0px 5px;
cursor: pointer;}
.btn-live-stream:hover, .btn-live-stream:active{
	background-color:#FFFFFF;
	color:#007f3d;
	text-decoration:none;
	}
	
.btn-live-video{
	font-family: 'Raleway', sans-serif;
	font-weight:700;
	width:50%;
	background-color:#FFFFFF;
	color:#007f3d;
	padding:10px 0px 10px 0px;
	text-decoration:none;
	float:left;
	display:block;
	border-radius: 0px 5px 5px 0px;
-moz-border-radius: 0px 5px 5px 0px;
-webkit-border-radius: 0px 5px 5px 0px;}

.btn-live-video:hover, .btn-live-video:active{
	background-color:#007f3d;
	color:#FFFFFF;
	text-decoration:none;
	}
.btn-live-stream:visited, .btn-live-video:visited, .btn-live-stream:focus, .btn-live-video:focus{
	text-decoration:none;
	}
.btn-live-stream:focus{
	color:#FFFFFF;}
.btn-live-video:focus{
	color:#007f3d;}
.wrapper-audiostream{
	height:40vh;
	display: -webkit-box;
  	display: -webkit-flex;
  	display: -ms-flexbox;
  	display: flex;
	text-align: center;
	-webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
	-webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
	-webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;}

#video-streaming{
background-color:rgba(29,29,29,1.00);
	

	height:100vh;
	/* background-image:url(img/akmaliah-055.jpg);
	background-color:rgba(96,96,96,1.00); */
	background-repeat:no-repeat;
	background-position: center center;
	background-attachment: fixed;
	background-size:cover;
	display: -webkit-box;
  	display: -webkit-flex;
  	display: -ms-flexbox;
  	display: flex;
	text-align: center;
	-webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
	-webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
	-webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;}
.video-wrapper{
	background-color:#F3F3F3;
	height:auto;
	background-image:url(img/video-bg.png);
	background-repeat:no-repeat;
	background-position:center center;}
#player1{
	position:absolute;
	bottom:5px;
	width:100%;}
.phone-logo{
	padding:5px;
	background-color:#666666;
	border-radius:15px;
	margin-top:5px;}
.phone-logo img{
	float:left;
	height:5vmin;
	width:auto;
	margin:0 10px 0 10px;}
#jadwal-pengajian{
	/*background-color:#F3F3F3;*/
	background-color:#091f01;
	background-image:url(img/ending-tulisan-jadwal.png), url(img/huwa-akm2016.png);
	background-position: bottom center, center center;
	background-repeat:no-repeat, no-repeat;
    font-family: 'Raleway', sans-serif;
	font-weight:700;
	color:rgba(124,124,124,1.00);
	letter-spacing:3px;
	height:100vh;
	display: -webkit-box;
  	display: -webkit-flex;
  	display: -ms-flexbox;
  	display: table-cell;
	text-align: center;
	-webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
	-webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
	-webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;}
#jadwal-pengajian h1{
	font-size:3em;
	color:#737373;
padding:10px;
}
#jadwal-pengajian h4{
	color:#737373;
	font-weight:700;
	font-size:5em;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7);}
#jadwal-pengajian h3{
	color:#737373;}


#jadwal-ropas{
	background-color:#F3F3F3;
	background-image:url(img/ending-tulisan-jadwal.png), url(img/huwa-akm2016.png);
	background-position: bottom center, center center;
	background-repeat:no-repeat, no-repeat;
    font-family: 'Raleway', sans-serif;
	font-weight:700;
	color:rgba(124,124,124,1.00);
	letter-spacing:1px;
	height:150vh;
	display: -webkit-box;
  	display: -webkit-flex;
  	display: -ms-flexbox;
  	display: table-cell;
	text-align: center;
	-webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
	-webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
	-webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;}
#jadwal-ropas h1{
	font-size:3em;
	color:#737373;
padding:10px;
}
#jadwal-ropas h4{
	color:#737373;
	font-weight:700;
	font-size:5em;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7);}
#jadwal-ropas h3{
	color:#737373;}





#footer{
 width:100%;
 background-color:rgba(29,29,29,1.00);
 background-image:url(img/noise.png);
 background-repeat:repeat;
 position:relative;
 height:60px;
 padding-top:15px;
 text-align:center;
 color:rgba(255,255,255,1.00);
 display:block;
 margin-bottom:-1px;
 border-top: rgba(57,55,55,1.00) solid 1px; }
 
 #footer p{
 color:#F3F3F3;}

 .scrollToTop{
	width:60px; 
	height:60px;
	text-align:center; 
	text-decoration: none;
	position:fixed;
	bottom:15px;
	right:15px;
	display:none;
	background:url(img/back-to-top.png) no-repeat;
	z-index:99999999;
}
.scrollToTop:hover{
	text-decoration:none;
}
.play-big .jp-controls{
	height:31vh;
	width:31vh;}
.play-big .jp-controls button{
	height:30vh;
	width:30vh;
	}

.play-big .jp-play{
	background-color:rgba(255,158,0,1.00);
	background-image:url(img/play-big2.svg);
	background-size:100%;
	background-repeat:no-repeat;
	background-color:transparent;
	height:30vh;
	width:30vh;
	background-position:center center;
	background-repeat:no-repeat;
	border:none;
	}

	
.play-big  .jp-pause{
	background-image:url(img/pause-big2.svg);
	background-color:transparent;
	background-size:100%;
	background-repeat:no-repeat;
	}

.jpwrapper-akm{
	width:auto;
	background-color:transparent;
	text-align:center;
	padding:10px;
	justify-content:center;
	float:left;
	
	}
.jpwrapper-akm > .jp-audio{
	background-color:transparent;
	background-image:none; 
	margin:0;
	padding:0;
	width:30vh;
	min-width:216px;
	height:auto;
	position:relative;
	border:none;}
.jpwrapper-akm .jp-volume-controls {
	margin-top:15px;}
 
  @media only screen and (max-width : 992px) {
	  #welcome h2{
	font-size:2.8em;
	font-family: 'times', serif;
	  }
	  
	  #navigasi-beranda{
	position:absolute;
	right:15px;
	top:15px;
	color:rgba(236,236,236,1.00);}
  }
  
  @media only screen and (max-width : 767px) {
	  
	   #welcome h2{
	font-size:2.3em;
	font-family: 'times', serif;
	  }
	  
	  }
@media only screen and (orientation: portrait){
	#welcome h2{
	line-height:100px;
	}
	#welcome h4{
	font-size:2.2em;
	}
	#navigasi-beranda{
	font-size:1.8em;
	line-height:50px;
	}
	.wrapper-livestreaming-title h2, #video-streaming h2{
	font-size:4.2em;
	}
    .wrapper-livestreaming-title h4, #video-streaming h4{
	font-size:2.5em;
	font-weight:700;
	}
	}
/* Portrait LG optimus*/
@media only screen 
  and (min-device-width: 384px) 
  and (max-device-width: 640px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1) {
	.logo-akmaliah img{
	width:450px;
	height:auto;}
	
	#welcome h2{
	font-size:3.6em;
	line-height:100px;
	}
	
	#welcome h4{
	font-size:2.2em;
	}
	
	.wrapper-akmaliah img{
	width:600px;
	height:auto;
	}
	
	.wrapper-button{
	width:300px;
	font-size:2.5vw;

}
  }
 
 /* ----------- iPad mini ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1) {
	.logo-akmaliah img{
	width:500px;
	height:auto;}
	
	.wrapper-akmaliah img{
	width:600px;
	height:auto;
	}
	
	#welcome h2{
	font-size:3.6em;
	}
	
	.wrapper-button{
	width:300px;
	font-size:2.5vw;
	}

}

/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* ----------- iPad 1 and 2 ----------- */
/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1) {
	.logo-akmaliah img{
	width:500px;
	height:auto;}
	
	#welcome h2{
	font-size:3.6em;
	}
	
	.wrapper-akmaliah img{
	width:600px;
	height:auto;
	}
	
	.wrapper-button{
	width:300px;
	font-size:2.5vw;

}
  }
/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* ----------- iPad 3 and 4 ----------- */
/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {
	.logo-akmaliah img{
	width:500px;
	height:auto;}
	
	#welcome h2{
	font-size:3.6em;
	}
	
	.wrapper-akmaliah img{
	width:600px;
	height:auto;
	}
	  
	.wrapper-button{
	width:300px;
	font-size:2.5vw;

}

}

/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {

}


/* ----------- iPhone 4 and 4S ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
	.logo-akmaliah img{
	width:270px;
	height:auto;}
	
	#welcome h2{
	font-size:3.6em;
	}
	
	.wrapper-akmaliah img{
	width:310px;
	height:auto;
	}
	
	.wrapper-button{
	width:300px;
	font-size:2.5vw;
	}
}

/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {

}

/* ----------- iPhone 5 and 5S ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) {

}

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
	.logo-akmaliah img{
	width:450px;
	height:auto;}
	
	#welcome h2{
	font-size:3.6em;
	}
	
	.wrapper-akmaliah img{
	width:450px;
	height:auto;
	}
	
	.wrapper-button{
	width:300px;
	font-size:2.6vw;
	}
}

/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {

}

/* ----------- iPhone 6 ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2) { 

}

/* Portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) { 
  .logo-akmaliah img{
	width:450px;
	height:auto;}
	
	.wrapper-akmaliah img{
	width:600px;
	height:auto;
	}
	
   .wrapper-button{
	width:300px;
	font-size:2.6vw;
	}
  }

/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) { 

}

/* ----------- iPhone 6+ ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3) { 

}

/* Portrait */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 
  .logo-akmaliah img{
	width:500px;
	height:auto;}
	
	.wrapper-akmaliah img{
	width:600px;
	height:auto;
	}
	
   .wrapper-button{
	width:300px;
	font-size:2.6vw;
	}

}

/* Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 

}