/*=============================================================================================	
	Author : Muhammad Febriansyah
	Date       : Mei 2017
==============================================================================================*/
@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,200i,300,300i,400,400i,600,600i,700,700i,900,900i');
@import url('https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i&display=swap');

body {
	color: #353535;
	font-size: 14px;
	font-family: 'Poppins', sans-serif;
	font-weight: 400;
}
.wow {
   visibility: hidden;
}
.overflowHidden {
    overflow: hidden;
}
.animated {
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-timing-function: ease;
    -moz-animation-timing-function: ease;
    animation-timing-function: ease;
}
img {
	border: 0;
	max-width: 100%;
	height: auto;
}
.italic {
	font-style: italic;
}
.bold {
	font-weight: bold;
}
.regular {
	font-weight: lighter;
}
.left {
	float: left;
	display:inline;
}
.right {
	float: right;
	display:inline;
}
.relative{
	position:relative;
}
.clear {
	clear: both;
}
a {
	text-decoration: none;
	color: #000;
    transition: all 0.3s ease-in-out 0s;
}
a:focus{
	outline: 0;
}
strong {
	font-weight: 700;
}
p {
	margin: 1px 0 15px;
	line-height: 25px;
}
input, textarea, select {
	font-size: 14px;
	font-family: 'Source Sans Pro', sans-serif;
	border: none;
	border: 1px solid #c9c9c9;
	padding: 5px;
	margin: 0;
	color: #666;
}
img {
	margin-bottom: -3px;
}
input[type=checkbox], input[type=radio] {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}
*, *:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	outline: none;
}
h1 {
	font-size: 32px;
}
h2 {
	font-size: 28px;
}
h3 {
	font-size: 24px;
}
h4 {
	font-size: 20px;
}
h5 {
	font-size: 16px;
}
h6 {
	font-size: 14px;
}
h1, h2, h3, h4, h5, h6 {
	font-weight: 700;
	font-family: 'Source Sans Pro', sans-serif;
}
section {
    position: relative;
}
.text-center {
	text-align: center;
}
.rows{
	padding: 20px 0;
}
.withPad{
	padding: 40px 0;
}
.overflowhidden{
	overflow: hidden;
}
/* structure
----------------------------------------------------------------------------------------------*/
.wrapper {
	max-width: 720px;
	margin: 0 auto;
	padding: 0px 20px;
}
.mid-wrapper{
	width: 960px;
	margin: 0 auto;
	position: relative;
}
.inner_wrap{ width:800px; margin: 0 auto; }
.afterclear:after {
	clear: both;
	content: '';
	display: block;
}
/* style button
----------------------------------------------------------------------------------------------*/

/* style header
----------------------------------------------------------------------------------------------*/

/* style kontent
----------------------------------------------------------------------------------------------*/
#middle-content{
	background: url(../../../../img/liputan/event/endyear/footer.png) bottom center no-repeat;
	padding-bottom: 100px;
}
#middle-content.no_result{
	background: none;
	padding-bottom: 0;
	overflow-x: hidden;
}
.logo_lip6{
	text-align: center;
	padding-left: 10vh;
	padding-right: 10vh;
	margin-bottom: 15px;
}
.logo_lip6 img{
	max-width: 150px;
}
.profile{
	display: block;
	text-align: center;
	width: 100%;
}
.circle_thumb{
	display: inline-block;
	width: 70px;
	height: 70px;
	border-radius: 50%;
	overflow: hidden;
	margin-bottom: 0px;
}
.circle_thumb img{
	object-fit: cover;
	width: 100%;
	height: 100%;
}
.captionProfile{
	text-align: center;
}
.captionProfile h3{
	font-size: 16px;
	font-weight: 600;
	color: #000;
	margin: 0;
}
.captionProfile h3 .smallFont{
	font-weight: 500;
}
.captionProfile h4{
	font-size: 18px;
	font-weight: 600;
	color: #d1370f;
	margin: 10px 0 0 0;
}
#content_section{
	text-align: center;
}
.man_illustration{
	text-align: center;
	width: 100%;
	padding-right: 20px;
	padding-left: 20px;
}
.orange_button{
	width: 260px;
	display: inline-block;
	text-align: center;
	padding:10px 20px;
	border-radius: 23px;
	color: #fff;
	font-size: 14px;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ff8646+0,f43603+100 */
	background: rgb(255,134,70); /* Old browsers */
	background: -moz-linear-gradient(top, rgba(255,134,70,1) 0%, rgba(244,54,3,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(255,134,70,1) 0%,rgba(244,54,3,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(255,134,70,1) 0%,rgba(244,54,3,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff8646', endColorstr='#f43603',GradientType=0 ); /* IE6-9 */
}
.orange_button img{
	display: inline-block;
	vertical-align: middle;
	max-width: 13px;
}
.introStream{
	margin-bottom: -200px;
	position: relative;z-index: 2;
}
.stream_section{
	width: 100%;
	padding-bottom: 100px;
	position: relative;
	background: url(../../../../img/liputan/event/endyear/water_stream.png) no-repeat center center; 
	-webkit-background-size: 100%;
	-moz-background-size: 100%;
	-o-background-size: 100%;
	background-size: 100%;
	z-index: 1;
	padding-top: 250px;
}
.blur_op {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    text-align: left;
    margin: 0;
    padding: 100px 0 0 0;
    background-image: linear-gradient(to bottom, #ffffff, rgba(255, 255, 255, 0));
}
.timeline_content{
	display: block;
	width: 100%;
	margin-bottom: 20px;
}
.littleBoy-icon{
	display: inline-block;
	width: 40%;
	vertical-align: top;
}
.caption_littleboy{
	display: inline-block;
	text-align: left;
	width: 55%;
	padding-top: 50px;
}
.icon_place,.text_caption{
	display: inline-block;
	vertical-align: top;
}
.icon_place{
	max-width: 25px;
}
.text_caption{
	width: 80%;
	padding-right: 5px;
}
.text_caption h3{
	font-size: 20px;
	color: #0b2f45;
	font-weight: 600;
	margin: 0;
}
.text_caption span{
	font-size: 12px;
	color: #1c3d52;
}
.caption_littleboy.leftPos{
	text-align: right;
	vertical-align: middle;
	padding-top: 0;
}
#stream2 .littleBoy-icon{
	vertical-align: middle;
}
.caption_littleboy.leftPos .text_caption h3{
	font-size: 14px;
}
.caption_littleboy.leftPos .icon_place,.caption_littleboy.leftPos .text_caption{
	vertical-align: middle;
}
.frame_class{
	width: 100%;
	max-width: 135px;
	height: 135px;
	display: inline-block;
	position: relative;
}
.frame_class .icon_place{
	position: absolute;
	top: 30%;
	right: -10px;
}
#stream3 .caption_littleboy{
	padding-top: 0;
	padding-left: 15px;
	vertical-align: middle;
}
#stream3 .littleBoy-icon{
	vertical-align: middle;
}
#stream3 .caption_littleboy .text_caption{
	width: 100%;
	text-align: center;
	padding-right: 20px;
}
#stream3 .caption_littleboy .greyText{
	font-size: 12px;
	color: #232323;
}
.numberInfo{
	margin: 0;
	font-size: 24px;
	color: #232323;
	font-weight: 600;
}
.numberInfo .numberSmall{
	font-size: 12px;
	font-weight: 500;
}
#stream4 .text_caption{
	width: 100%;
	padding-left: 20px;
	text-align: right;
	padding-right: 15px;
}
#stream4 .frame_class .icon_place{
	right: inherit;
	left: -10px;
}
.titleinnerTimeline{
	margin: 0 0 15px 0;
	color: #353535;
	font-size: 20px;
	font-weight: 600;
}
.smallOrange{
	color: #ff5900;
	font-weight: 700;
}
.bigOrange{
	color: #ff5900;
	font-weight: 700;
	font-size: 24px;
}
.mediumText{
	font-weight: 500;
}
.tittle_result{
	padding-left: 20px;
	padding-right: 20px;
	text-align: center;
	display: block;
	width: 100%;
	margin-bottom: 25px;
}
.tittle_result h3{
	font-size: 28px;
	color: #ff5900;
	margin: 0 0 10px 0;
}
.tittle_result p{
	font-size: 14px;
	font-weight: 700;
}
.orangeColor{
	color: #ff5900 !important;
}
.result_statistik{
	display: block;
	width: 100%;
	text-align: center;
	padding-right: 20px;
	padding-left: 20px;
}
.icon_st_ilustration{
	max-width: 250px;
	display: inline-block;
	position: relative;
}
.socmed_row{
	display: block;
	width: 100%;
	text-align: center;
	margin-bottom: 30px;
}
.socmed_row p{
	font-size: 12px;
	font-weight: 600;
}
.list_socmed a{
	max-width: 35px;
	display: inline-block;
	margin: 0 5px;
}
.logo_footer{
	display: block;
	width: 100%;
	text-align: center;
}
.logo_footer img{
	max-width: 130px;
	display: inline-block;
}
.anim_float{
	transform: translatey(0px);
	animation: float 3s ease-in-out infinite;
}
@keyframes float {
	0% {
		transform: translatey(0px);
	}
	50% {
		transform: translatey(-15px);
	}
	100% {
		transform: translatey(0px);
	}
}

.resultTopRight{
	display: inline-block;
	text-align: center;
	position: absolute;
	right: -40px;
	top: 0;
}
.resultTopLeft{
	display: inline-block;
	text-align: center;
	position: absolute;
	left: -40px;
	top: 40px;
}
.resultMiddleRight{
	display: inline-block;
	text-align: center;
	position: absolute;
	right:-20px;
	top: 40%;
}
.resultBottomLeft{
	display: inline-block;
	text-align: center;
	position: absolute;
	left: -30px;
	bottom: 60px;
}
.resultBottomRight{
	display: inline-block;
	text-align: center;
	position: absolute;
	right: -30px;
	bottom: 20px;
}
.resultBottomRight h3{
	font-size: 12px;
	color: #0b2f45;
	margin: 0;	
}
.resultBottomRight h4{
	color: #fa3801;
	font-size: 12px;
	margin: 0;
}
.resultBottomLeft h3{
	font-size: 14px;
	color: #0b2f45;
	margin: 0;	
}
.resultBottomLeft h4{
	color: #fa3801;
	font-size: 12px;
	margin: 0;
}
.resultMiddleRight img{
	display: inline-block;
	vertical-align: middle;
	max-width: 40px;
}
.resultMiddleRight .inline_cap{
	display: inline-block;
	vertical-align: middle;
}
.resultMiddleRight .inline_cap h3{
	font-size: 13px;
	color: #0b2f45;
	margin: 0;	
}
.resultMiddleRight .inline_cap h4{
	color: #fa3801;
	font-size: 12px;
	margin: 0;
}

.resultTopRight img,.resultTopLeft img,.resultBottomLeft img,.resultBottomRight img{
	max-width: 100px;
	display: inline-block;
}
.resultTopRight h3{
	font-size: 18px;
	color: #0b2f45;
	margin: 0;
}
.resultTopRight h4{
	color: #fa3801;
	font-size: 18px;
	margin: 0;
}
.resultTopLeft h3{
	font-size: 14px;
	color: #0b2f45;
	margin: 0;
}
.resultTopLeft h4{
	font-size: 14px;
	color: #fa3801;
	margin: 0;
}
#result_section{
	position: relative;
}
.loader_gif{
	background: #fff;
	text-align: center;
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;
	z-index: 1;
	margin: auto;
}
.loader_gif .loadingnya {
    display: inline-block;
    max-width: 100px;
    padding-top: 100px;
}
.lds-roller {
    display: inline-block;
    position: relative;
    width: 64px;
    height: 64px;
}
.lds-roller div {
  animation: lds-roller 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  transform-origin: 32px 32px;
}
.lds-roller div:after {
  content: " ";
  display: block;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #3a3a3a;
  margin: -3px 0 0 -3px;
}
.lds-roller div:nth-child(1) {
  animation-delay: -0.036s;
}
.lds-roller div:nth-child(1):after {
  top: 50px;
  left: 50px;
}
.lds-roller div:nth-child(2) {
  animation-delay: -0.072s;
}
.lds-roller div:nth-child(2):after {
  top: 54px;
  left: 45px;
}
.lds-roller div:nth-child(3) {
  animation-delay: -0.108s;
}
.lds-roller div:nth-child(3):after {
  top: 57px;
  left: 39px;
}
.lds-roller div:nth-child(4) {
  animation-delay: -0.144s;
}
.lds-roller div:nth-child(4):after {
  top: 58px;
  left: 32px;
}
.lds-roller div:nth-child(5) {
  animation-delay: -0.18s;
}
.lds-roller div:nth-child(5):after {
  top: 57px;
  left: 25px;
}
.lds-roller div:nth-child(6) {
  animation-delay: -0.216s;
}
.lds-roller div:nth-child(6):after {
  top: 54px;
  left: 19px;
}
.lds-roller div:nth-child(7) {
  animation-delay: -0.252s;
}
.lds-roller div:nth-child(7):after {
  top: 50px;
  left: 14px;
}
.lds-roller div:nth-child(8) {
  animation-delay: -0.288s;
}
.lds-roller div:nth-child(8):after {
  top: 45px;
  left: 10px;
}
@keyframes lds-roller {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.lds-facebook {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 40px;
}
.lds-facebook div {
  display: inline-block;
  position: absolute;
  left: 8px;
  width: 16px;
  background: rgba(0,0,0,0.3);
  animation: lds-facebook 1.2s cubic-bezier(0, 0.5, 0.5, 1) infinite;
}
.lds-facebook div:nth-child(1) {
  left: 8px;
  animation-delay: -0.24s;
}
.lds-facebook div:nth-child(2) {
  left: 32px;
  animation-delay: -0.12s;
}
.lds-facebook div:nth-child(3) {
  left: 56px;
  animation-delay: 0;
}
@keyframes lds-facebook {
  0% {
    top: 8px;
    height: 64px;
  }
  50%, 100% {
    top: 24px;
    height: 32px;
  }
}
.frame_class_main{
	display: block;
	text-align: center;
	padding-right: 8vh;
	padding-left: 8vh;
}
.no_result_title{
	display: block;
	text-align: center;
}
.no_result_title p{
	font-size: 16px;
	color: #000;
}
.no_result_title p.grey_text{
	color: #626262;
}
.no_result_title h3{
	font-size: 24px;
	color: #d1370f;
	margin: 10px 0 20px 0;
}
.no_result_illustration{
	margin-right: -20px;
	margin-left: -20px;
}
.no_result_illustration img{
	width: 100%;
}
.row_downlaod {
    display: block;
    text-align: center;
}
.row_downlaod a {
    width: 135px;
    display: inline-block;
    margin-right: 10px;
}
/*------------- footer -----------------*/

/* ------------------------- popup style -----------------------*/


/* ==========================================================================
   Media Queries
   ========================================================================== */
@media (orientation: portrait) {
	#no_result{
		height: 100vh;
		position: relative;
	}
	.no_result_illustration{
		position: absolute;
		width: 100%;
		margin-left: 0;
		margin-right: 0;
		left: 0;
		bottom: 0;
	}	
}

@media only screen and (max-width: 480px) {
/* Mobile styles */
}
 @media screen and (min-width:481px) and (max-width:1024px) {
/* Tablet styles */

}
 @media only screen and (min-width: 1140px) {
/* Desktop styles */
}