/* Bisnis - 17 Agustus 2020 */

/* 
  ##Device = Desktops
  ##Screen = 1281px to higher resolution desktops
*/

@media (min-width: 1281px) {
}

/* 
    ##Device = Laptops, Desktops
    ##Screen = B/w 1025px to 1280px
  */

@media (min-width: 1025px) and (max-width: 1280px) {
}

/* 
    ##Device = Tablets, Ipads (portrait)
    ##Screen = B/w 768px to 1024px
  */

@media (min-width: 768px) and (max-width: 1024px) {
	.content-latest img {
		height: auto;
	}

	.next-page div a img {
		height: auto;
	}
}

/* 
    ##Device = Tablets, Ipads (landscape)
    ##Screen = B/w 768px to 1024px
  */

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
}

/* 
    ##Device = Most of the Smartphones Mobiles (Portrait)
    ##Screen = B/w 320px to 479px
  */

@media (min-width: 320px) and (max-width: 767px) {
	/*Penambahan resp design*/

	.navbar-brand img {
		max-width: 110px !important;
	}
	.navbar-kemerdekaan {
		height: 85px;
		background-image: url("../images/Header Mobile.png");
		background-position: center;
	}
	.bg-info-custom-kemerdekaan {
		background-color: #e91010 !important;
	}
	.navbar {
		justify-content: space-between;
	}

	.navbar-brand {
		padding-top: 0;
	}

	/*HOMEPAGE*/
	.text-block {
		width: 92%;
		position: absolute;
		background: rgba(0, 0, 0, 0.7);
		color: white;

		top: 196px;
	}
	.popular-hits img {
		width: 100%;
	}

	#changeToggle {
		order: 1;
	}

	#context-nav {
		order: 2;
	}

	#pencarian {
		order: 3;
	}

	#footer-page {
		order: -1;
	}

	#footer-context {
		order: 2;
	}

	#footer-socmed {
		order: 3;
	}

	#big-headline {
		order: -1;
	}

	#popular {
		order: -1;
	}
	/* #popular-artikel {
		order: 3;
	} */
	.responsive-image {
		width: calc(100vw - 20px);
	}

	.container {
		display: flex;
		align-items: start;
		justify-content: center;
		flex-direction: column;
	}

	.section-1 {
		margin: 0;
		min-height: auto;
	}

	.partner-bg {
		background-image: url(../images/BG-partner.png);
		max-width: 360px;
	}
	.career-bg {
		background-image: url(../images/BG-career1.png);
		max-width: 360px;
	}
	.career-bg2 {
		background-image: url(../images/BG-career2.png);
		max-width: 360px;
		max-height: 185px;
	}

	.label-headline-original {
		top: 15px;
		margin-left: 0px;
	}

	.label-headline-original-2 {
		top: 370px;
		margin-left: 0px;
	}

	.label-headline-unfold {
		top: 370px;
		margin-left: 0px;
	}

	.label-headline-exclusives {
		top: 15px;
		margin-left: 0px;
	}

	.label-headline-stories {
		top: 15px;
		margin-left: 0px;
		position: absolute;
		width: 360px;
		height: 25px;
	}

	.content-big-headline img {
		width: 100%;
		height: auto;
	}

	.big-headline-item h3 {
		font-weight: 514;
		font-size: 16px;
		line-height: 22px;
		margin: 10px 0;
	}

	.big-headline-item p {
		font-weight: 300;
		font-size: 14px;
		line-height: 20px;
	}

	.big-headline-item .auth-s p {
		font-weight: 300;
		font-size: 14px;
		line-height: 17px;
	}

	.descrip-headline h3 {
		font-weight: 514;
		font-size: 16px;
		line-height: 20px;
	}

	.descrip-headline .descrip-headline-1 p {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 300;
		font-size: 14px;
		line-height: 17px;
	}

	.descrip-headline .descrip-headline-1 .auth p {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 300;
		font-size: 12px;
		line-height: 15px;
	}

	/* .popular-content {
		display: flex;
		flex-direction: row;
	} */
	/* .pop-title {
		display: flex;
		align-items: center;
	}
	.pop-title h3 {
		margin-top: 20px;
		text-align: start !important;
		line-height: 20px;
		margin-left: 10px;
	}
	.popular .pop-title h3 {
		width: fit-content;
	} */

	/* .popular .pop-item {
		margin-left: 60px;
	} */
	/* .popular hr {
		background: #000000;
		height: 3px;
		margin: 0;
		display: flex;
		margin-left: 6px;
	} */

	/* .popular .label-popular {
		width: 110px;
		height: 40px; */
	/* border-bottom: 3px solid #000; */
	/* margin-left: 60px; */
	/* } */

	/* .popular .label-popular p {
		font-size: 18px;
	} */

	/* .pop-item .popular-content img {
		width: 112px;
		height: auto;
	} */

	.ml-3 {
		margin-left: 0rem !important;
	}

	.mr-3 {
		margin-right: 0rem !important;
	}

	.mt-1 {
		margin-top: 0rem !important;
	}

	/* .mt-3 {
		margin-top: 0rem !important;
	} */

	/* .mt-4 {
		margin-top: 0rem !important;
	} */

	.mt-5 {
		margin-top: 0rem !important;
	}
	#popular-detail {
		/* margin-left: 20px; */
	}
	.popular {
		padding-right: 15px;
	}

	.latest-item {
		padding-left: 15px;
	}

	.latest-1 {
		display: flex;
		justify-content: center;
		/* text-align: center; */
		/* flex-direction: column; */
	}

	/* .latest .label-latest {
		width: 110px;
		height: 40px;
	} */
	/* .latest .label-latest p {
		font-size: 18px;
		padding: 0;
	} */

	.latest h3 {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 514;
		font-size: 16px;
		line-height: 20px;
	}

	.latest .latest-sum-desc p {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 300;
		font-size: 14px;
		line-height: 17px;
		display: block;
	}

	.con-l {
		width: auto;
		/* margin-left: 25px; */
	}

	.vid-l img {
		width: auto;
		height: auto;
		/* margin-right: 43px; */
	}

	.latest .latest-1 .con-l .auth-l p {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 300;
		font-size: 12px;
		line-height: 15px;
		display: block;
	}

	.lab-home-original {
		width: 55px;
		height: 12px;

		font-family: "Inter";
		font-style: normal;
		font-weight: 700;
		font-size: 9px;
		line-height: 20px;
		/* or 222% */

		display: flex;
		align-items: center;
		text-align: center;

		/* Neutral/White */

		color: #ffffff;
	}

	.lab-home-exclusives {
		width: 55px;
		height: 12px;

		font-family: "Inter";
		font-style: normal;
		font-weight: 700;
		font-size: 9px;
		line-height: 20px;
		/* or 222% */

		display: flex;
		align-items: center;
		text-align: center;

		/* Neutral/White */

		color: #ffffff;
	}

	.lab-home-unfold {
		width: 55px;
		height: 12px;

		font-family: "Inter";
		font-style: normal;
		font-weight: 700;
		font-size: 9px;
		line-height: 20px;
		/* or 222% */

		display: flex;
		align-items: center;
		text-align: center;

		/* Neutral/White */

		color: #ffffff;
	}

	.latest .new-more {
		/* width: 135px;
		height: 32px; */
		padding: 0;
		margin: 0 100px;
	}

	.latest .new-more a {
		font-size: 12px;
		display: block;
		padding-top: 5px;
	}
	/*END HOMEPAGE*/

	.menu-category {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 400;
		font-size: 10px;
		line-height: 12px;
		padding-left: 20px;
		padding-right: 20px;
	}

	.original-label {
		/* background: url(
); */
		border-radius: 0px !important;
		background-size: cover;
		object-fit: cover;
		display: flex;
		padding: 0;
		margin-top: -10px;
		width: 100%;
		height: 66px;
	}

	.part-label p {
		width: 75%;
		height: 16px;
		font-family: "Roboto";
		font-style: normal;
		font-weight: 900;
		font-size: 12px;
		line-height: 16px;
		text-align: center;
		letter-spacing: 0.05em;
		color: #ffffff;
		margin-bottom: 0;
		margin-top: -5px;
		margin-left: 50px;
	}

	.next-page div a img {
		width: calc(100vw - 40px); /* Full viewport width minus 20px */
		height: auto; /* Automatically calculate height based on aspect ratio */
		aspect-ratio: 350 / 197; /* Aspect ratio (optional for older browsers) */
		max-width: 100%; /* Ensures the image doesn't exceed its container width */
	}

	.descrip-5 h3 {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 514;
		font-size: 14px;
		line-height: 17px;
		margin-top: 10px;
	}

	.descrip-5 .descrip-51 p {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 300;
		font-size: 12px;
		line-height: 15px;
	}

	.unfold-label {
		/* background: url(
); */
		background-size: cover;
		object-fit: cover;
		display: flex;
		padding: 0;
		margin-top: -10px;
		width: 100%;
		height: 66px;
		border-radius: 0px;
	}

	.exclusive-label {
		/* background: url(
); */
		background-size: cover;
		object-fit: cover;
		display: flex;
		padding: 0;
		margin-top: -10px;
		width: 100%;
		height: 66px;
		border-radius: 0px;
	}

	.stories-label {
		background-size: cover;
		object-fit: cover;
		display: flex;
		padding: 0;
		margin-top: -10px;
		width: 100%;
		height: 66px;
		border-radius: 0px;
	}
	.about-label {
		/* background: url(../images/BG_Originals.png); */
		background-size: cover;
		object-fit: cover;
		display: flex;
		padding: 0;
		width: 100%;
		height: 66px;
		/* background: linear-gradient(270deg, rgba(255, 45, 171, 0.765) 0%, rgba(94, 2, 185, 0.85) 100%), url("../images/label-bg-mob.png"); */
		border-radius: 0%;
	}

	.about-text {
		width: auto;
		margin: 0px 20px;
	}

	.about-text p {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 400;
		font-size: 14px;
		line-height: 21px;
		text-align: center;
		color: #000000;
	}

	.about-icon hr {
		width: auto;
	}

	.partner-label {
		/* background: url(../images/BG_Originals.png); */
		background-size: cover;
		object-fit: cover;
		display: flex;
		padding: 0;
		width: 100%;
		height: 66px;
		/* background: linear-gradient(270deg, rgba(255, 45, 45, 0.765) 0%, rgba(2, 97, 185, 0.85) 100%); */
		border-radius: 0%;
	}

	.career-label {
		/* background: url(../images/BG_Originals.png); */
		background-size: cover;
		object-fit: cover;
		display: flex;
		padding: 0;
		width: 100%;
		height: 66px;
		/* background: linear-gradient(270deg, rgba(45, 255, 104, 0.765) 0%, rgba(2, 97, 185, 0.85) 100%); */
		border-radius: 0%;
	}

	.label-extras {
		height: 160px;
		background: url(../images/BG_Ext.png);
		background-size: cover;
		object-fit: cover;
		display: flex;
		padding: 0;
	}
	.on-detail {
		padding-top: 10px;
	}

	.name-category {
		margin-left: 120px;
		/* margin-top: 20px; */
	}

	.label-original-1 {
		justify-content: center;
		display: grid;
	}

	.label-original-1 h3 {
		font-size: 16px;
		border-bottom: 1px solid #fff;
		padding: 0;
		text-align: center;
	}

	.label-original p {
		font-size: 10px;
		line-height: 18px;
	}

	.label-border {
		border: 0;
	}

	/* .more-section .content-22 {
		display: grid;
		grid-template-columns: auto auto;
	} */

	/* .descrip-image:first-child {
		grid-column: 1/3;
	} */

	.original-description p {
		font-family: "Arial";
		font-style: normal;
		font-weight: 400;
		font-size: 10px;
		line-height: 18px;
		text-align: center;
	}

	/*LATEST INDEX PAGE*/

	.more-section .content-new {
		display: grid;
		grid-template-columns: auto auto;
	}

	.content-latest img {
		width: 100%;
		height: auto;
	}
	.detail-article-new {
		padding-right: 30px;
	}

	/* .content-latest:first-child {
		grid-column: 1/3;
	} */

	/*STORIES*/

	.next-page-stories div a img {
		width: 330px;
		height: auto;
		margin-top: 20px;
	}

	.content-stories {
		/* padding-left: 20px; */
	}

	.popular-s {
		display: none;
	}

	.pop-es {
		display: block !important;
	}

	.descrip-s-title {
		text-align: center;
		padding: 0 15px;
	}

	.descrip-s-title h3 {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 514;
		font-size: 16px;
		line-height: 20px;
		margin-top: 10px;
	}

	.descrip-s-title .descrip-s-summary p {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 300;
		font-size: 14px;
		line-height: 17px;
	}

	.descrip-s-title .descrip-s-summary .descrip-s-auth p {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 300;
		font-size: 12px;
		line-height: 15px;
	}

	/*DETAIL PAGE*/

	.detail-label-origin {
		width: 77px;
		height: 32px;
		/* margin-bottom: 10px; */
	}

	.detail-label-origin p {
		font-size: 14px;
	}

	.detail-desc {
		margin-top: 15px;
		padding: 0px;
	}

	.detail-desc h1 {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 700;
		font-size: 18px;
		line-height: 21px;
		color: #000000;
		text-align: start;
		padding-left: 20px;
		padding-right: 20px;
	}

	.detail-desc p {
		text-align: start;
		font-family: "Roboto";
		font-style: normal;
		font-weight: 300;
		font-size: 12px;
		line-height: 20px;

		color: #000000;
		padding-left: 20px;
		padding-right: 20px;
	}

	.detail-desc .uname p {
		text-align: start;
		font-family: "Roboto";
		font-style: normal;
		font-weight: 300;
		font-size: 9px;
		line-height: 11px;
		padding-left: 20px;
	}

	.detail-label-exclusives {
		width: 87px;
		height: 32px;
	}

	.detail-label-exclusives p {
		font-family: "Favorit Pro";
		font-style: normal;
		font-weight: 400;
		font-size: 14px;
		line-height: 19px;
	}

	.detail-label-unfold {
		width: 87px;
		height: 32px;
	}

	.detail-label-unfold p {
		font-family: "Favorit Pro";
		font-style: normal;
		font-weight: 400;
		font-size: 14px;
		line-height: 19px;
	}
	.detail-label-extras {
		width: 87px;
		height: 32px;
	}

	.detail-label-extras p {
		font-family: "Favorit Pro";
		font-style: normal;
		font-weight: 400;
		font-size: 14px;
		line-height: 19px;
	}
	.extras.carousel-item img {
		/* min-height: 180px; */
		max-height: 250px;
		object-fit: cover;
	}

	.detail-artikel .on-detail label {
		margin-top: 0;
	}

	.detail-artikel .on-detail p {
		/* font-family: "Arial";
		font-style: normal;
		font-size: 12px;
		line-height: 24px;
		font-weight: 400; */
		font-family: "Roboto";
		font-style: normal;
		/* font-weight: 300; */
		font-size: 12px;
		line-height: 20px;

		color: #000000;
		letter-spacing: 0;
		max-width: 650px;
		margin-bottom: 0;
		padding-top: 10px;
		padding: 10px 0;
		text-align: start;
	}

	.detail-artikel .on-detail label:last-child {
		font-size: 12px;
		font-weight: 100;
		font-family: "Arial";
	}

	.detail-artikel {
		padding: 20px;
		margin: auto !important;
		padding: 40px;
		padding-bottom: 0px;
		padding-top: 100px;
		width: 100% !important;
	}

	.detail-artikel .on-detail {
		margin-top: 345px;
	}
	.detail-artikel .on-detail img {
		height: 230px !important;
		width: auto !important;
		margin-left: auto !important;
		margin-right: auto !important;
	}

	.foot-detail-origin {
		height: 290px;
	}

	.foot-detail-exclusives {
		height: 290px;
	}

	.foot-detail-unfold {
		height: 290px;
	}
	.foot-detail-extras {
		height: 290px;
	}

	.foot-detail-origin p {
		font-weight: 514;
		font-size: 18px;
		line-height: 22px;
	}

	.foot-detail-exclusives p {
		font-weight: 514;
		font-size: 18px;
		line-height: 22px;
	}

	.foot-detail-unfold p {
		font-weight: 514;
		font-size: 18px;
		line-height: 22px;
	}
	.foot-detail-extras p {
		font-weight: 514;
		font-size: 18px;
		line-height: 22px;
	}

	.d-inline {
		display: none !important;
	}

	.section-3 .more-label {
		margin-bottom: 0px;
	}

	.ukuran-video {
		height: 255px;
		width: 350px;
	}
	.ukuran-video-stories {
		height: 255px;
		width: 350px;
	}

	.content-stories img {
		width: calc(100vw - 40px); /* Full viewport width minus 20px */
		height: auto; /* Automatically calculate height based on aspect ratio */
		aspect-ratio: 350 / 250; /* Aspect ratio (optional for older browsers) */
		max-width: 100%; /* Ensures the image doesn't exceed its container width */
	}
	.content-popular img {
		width: calc(100vw - 40px); /* Full viewport width minus 20px */
		height: auto; /* Automatically calculate height based on aspect ratio */
		aspect-ratio: 350 / 202; /* Aspect ratio (optional for older browsers) */
		max-width: 100%; /* Ensures the image doesn't exceed its container width */
	}

	.ml-4 {
		margin-left: 0px !important;
	}
	.mx-0 {
		margin-left: 0px !important  ;
		margin-right: 0px !important;
	}
	.px-0 {
		padding-right: 0px !important;
		padding-left: 0px !important;
	}
	.pl-20 {
		padding-left: 20px;
	}

	/*DETAIL STORIES*/
	.desc-stories h1 {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 700;
		font-size: 18px;
		line-height: 21px;
		color: #000000;
		text-align: start;
	}

	.stories-detail {
		padding-top: 0;
	}

	.desc-stories p {
		font-weight: 300;
		font-size: 14px;
		line-height: 17px;
		text-align: justify;
	}

	.desc-stories .uname p {
		font-weight: 300;
		font-size: 12px;
		line-height: 15px;
		text-align: start;
		/* margin-left: 65px; */
	}

	.desc-stories .uname .label-detail-s {
		width: 66px;
		height: 32px;
		font-size: 12px;
	}

	.st-content {
		padding: 0px !important;
	}

	.st-detail {
		margin-top: 0px !important;
	}
	.st-detail iframe {
		max-height: 315px;
		width: 100%;
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
	.st-content p {
		font-family: "Roboto";
		font-style: normal;
		/* font-weight: 300; */
		font-size: 12px;
		line-height: 18px;
		color: #000000;
		text-align: start;
	}

	.det-stories {
		padding-left: 0px;
		padding-right: 0px;
	}

	.label-border {
		display: none;
	}

	.head-art {
		padding: 15px !important;
	}

	.extra-detail {
		display: none;
	}

	.latest-label-s {
		font-family: "Favorite";
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		padding: 6px 15px;
		gap: 10px;
		/* position: absolute; */
		width: 48px;
		height: 24px;
		color: #fff;
		background: #a80000;
		border-radius: 4px;
		font-size: 12px;
	}

	.latest-label-o {
		font-family: "Favorite";
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		padding: 6px 15px;
		gap: 10px;
		/* position: absolute; */
		width: 60px;
		height: 24px;
		color: #fff;
		background: #00b93a;
		border-radius: 4px;
		font-size: 12px;
	}

	.latest-label-u {
		font-family: "Favorite";
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		padding: 6px 15px;
		gap: 10px;
		/* position: absolute; */
		width: 48px;
		height: 24px;
		color: #fff;
		background: #004ea8;
		border-radius: 4px;
		font-size: 12px;
	}

	.latest-label-e {
		font-family: "Favorite";
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		padding: 6px 15px;
		gap: 10px;
		/* position: absolute; */
		width: 60px;
		height: 24px;
		color: #fff;
		background: #f1a11a;
		border-radius: 4px;
		font-size: 12px;
	}

	.latest-label-ext {
		font-family: "Favorite";
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		padding: 6px 15px;
		gap: 10px;
		/* position: absolute; */
		width: 48px;
		height: 24px;
		color: #fff;
		background: #8711fd;
		border-radius: 4px;
		font-size: 12px;
	}

	.logo-bisnis {
		display: none;
	}

	.socmed li a img {
		margin-left: 0 !important;
	}

	.social-med {
		margin-right: 145px;
		display: none;
	}

	.mob-log-ft {
		display: flex;
	}

	.parallax-container {
		height: 190px;
		overflow: hidden;
	}

	/* .main-image {
		background-image: url("../images/banner-mobb.png");
		height: 190px;
	} */

	/* .parim h2 {
		font-family: 'Roboto';
		font-style: normal;
		font-weight: 900;
		font-size: 14px;
		line-height: 16px;
		display: flex;
		align-items: center;
		text-align: center;
		letter-spacing: 0.05em;
		color: #FFFFFF;
		margin-left: 12%;
	} */

	.wave-1 {
		z-index: 3;
		width: 120%;
		top: 122px;
	}

	.wave-2 {
		z-index: 2;
		width: 100%;
		top: 137px;
	}

	.wave-3 {
		z-index: 1;
		width: 120%;
		top: 133px;
	}

	/* ul.pagination-stories {
		padding-left: 0;
	} */

	.popular-category {
		flex-direction: row;
		padding-top: 10px;
	}

	.collaborate p {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 400;
		font-size: 12px;
		line-height: 14px;
		text-align: center;
	}

	.caption {
		top: 86%;
	}

	.stories-headline {
		padding: 0;
	}

	.stories-headline h1 {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 700;
		font-size: 18px;
		line-height: 21px;
		/* text-transform: uppercase; */
		margin-top: 10px;

		color: #000000;
	}

	.stories-headline p {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 300;
		font-size: 14px;
		line-height: 14px;

		/* Neutral/Grey */

		color: #505050;
	}

	.originals-headline h1 {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 700;
		font-size: 18px;
		line-height: 21px;
		/* text-transform: uppercase; */
		margin-top: 10px;

		color: #000000;
	}

	.originals-headline p {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 300;
		font-size: 12px;
		line-height: 14px;

		/* Neutral/Grey */

		color: #505050;
	}

	/* .typewritter-container {
		height: auto;
		overflow: hidden;
	} */

	/* .typeim {
		background-image: url(../images/banner-context-home-mobile.png);
		width: 100%;
		height: 99px;
		position: relative;
		object-fit: cover;
	} */

	/* .text-anim{
		width: 260px;
		margin-top: 50px;
		border-right: none;
	}

	.text-anim p {
		font-family: 'Roboto';
		font-style: normal;
		font-weight: 900;
		font-size: 12px;
		line-height: 12px;
		display: flex;
		align-items: center;
		text-align: center;
		letter-spacing: 0.05em;

		color: #FFFFFF;
	} */

	.rules {
		background: url("../images/banner-mobb.png");
		height: 190px;
		background-size: cover;
		margin-top: 50px;
	}

	.rules p {
		font-size: 12px;
		margin-bottom: 80px;
	}

	.rules p span.typed-text {
		font-size: 12px;
		line-height: 12px;
	}

	.caption-2 {
		position: absolute;
		top: 71%;
		left: 50%;
		transform: translate(-50%, -50%);
		/* text-align: center; */
		background: linear-gradient(360deg, #000000 3.05%, rgba(0, 0, 0, 0) 100%);
		color: white;
		width: 100%;
		padding: 10px 15px;
		padding-bottom: 0;
	}

	.caption-2 h1 {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 700;
		font-size: 18px;
		line-height: 21px;
		/* identical to box height */

		text-transform: uppercase;
	}

	.caption-2 p {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 300;
		font-size: 12px;
		line-height: 14px;
	}

	.content-headline-small img {
		height: auto;
		border-radius: 0px 0px 14px 14px;
	}

	.content-headline-big img {
		height: auto;
	}

	/* .latest .latest-1 p {
	} */
	.latest .latest-1 p {
		font-family: "Roboto";
		font-weight: 300;
		font-size: 10px;
		line-height: 11px;
		color: #9e9ea7;
		flex: none;
		order: 2;
		flex-grow: 0;
	}

	.latest .latest-sum-desc h3 {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 700;
		font-size: 12px;
		line-height: 16px;
		color: #000000;
		margin-top: 0 !important;
	}
	.label-home-latest {
		font-family: "Roboto";
		color: #989898;
		box-sizing: border-box;
		display: flex;
		flex-direction: row;
		font-size: 9px;
		justify-content: center;
		align-items: center;
		padding: 2px 16px;
		width: 67px;
		height: 13px;
		text-transform: uppercase;
		border-radius: 3px;
		flex: none;
		order: 0;
		flex-grow: 0;
		border: 1px solid #d7d7d7;
		text-transform: uppercase;
	}
	.apakah-summary h1 {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 700;
		font-size: 18px !important;
		line-height: 21px;
		color: #000000;
	}

	.summary-content h1 {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 700;
		font-size: 18px;
		line-height: 21px;

		color: #000000;
	}

	.label-popular {
		text-align: center;
	}

	.label-latest {
		text-align: center;
	}

	.text-mod {
		font-size: 12px;
	}

	.text-cop {
		font-size: 9px;
		display: none;
	}

	.text-cop-2 {
		/* margin-top: 15px; */
		margin-bottom: 0px;
		font-size: 12px;
		display: contents;
	}

	.text-cop-2 p {
		margin-top: 30px;
	}

	.unfold-smh {
		display: none;
	}

	.unfold-headline-title h1 {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 700;
		font-size: 18px;
		line-height: 21px;

		color: #000000;
	}

	.unfold-headline-title p {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 300;
		font-size: 12px;
		line-height: 14px;

		color: #505050;
	}

	.latest-video h2 {
		display: contents;
	}

	.unfold-d-more {
		display: flex !important;
	}

	.originals-h-1 {
		padding-bottom: 0;
	}

	.unfold-headline img {
		border-radius: 6px;
	}

	.stories-headline img {
		border-radius: 6px;
		width: 100%;
	}
	.big-label-kanal {
		/* border-radius: 10px 10px 0px 0px; */
		font-family: "Roboto";
		font-style: normal;
		font-weight: 700;
		font-size: 14px;
		line-height: 16px;
		text-align: center;
		color: #989898;
		/* padding: 5px 0px; */
		text-transform: uppercase;
		margin-bottom: 5px;
		margin-top: 15px;
		display: inline-block;
		border: 1px solid #d7d7d7;
		padding: 2px 8px;
		border-radius: 5px;
	}
	.bcrumb {
		text-align: start;
		align-items: start;
		padding-top: 10px;
		padding-left: 23px;
		font-family: "Roboto";
		font-style: normal;
		font-weight: 300;
		font-size: 12px;
		line-height: 12px;
	}

	.bcrumb a {
		color: #9d9d9d;
	}

	.more-text {
		margin-bottom: 20px;
	}

	.more-text p {
		display: contents;
	}

	.about-info ul li {
		margin: 30px;
	}

	.storiesbigheadline {
		padding-left: 15px !important;
	}

	.popular .label-popular h2 {
		display: contents;
	}

	.particle-stories img {
		height: auto;
		border-radius: 6px;
	}

	.details-stories h3 {
		font-weight: 514;
		font-size: 16px;
		line-height: 20px;
	}

	.details-stories p {
		font-weight: 300;
		font-size: 14px;
		line-height: 17px;
	}

	.stories-author p {
		font-weight: 300;
		font-size: 12px;
		line-height: 15px;
	}

	.unfold-main-headline {
		padding-left: 15px;
	}

	.originals-main-headline {
		padding-left: 015px;
	}

	.originals-smh {
		padding-right: 15px;
	}

	.tolong-cari {
		width: 70px !important;
	}

	.pencarian {
		display: block;
	}

	.cari-mobile {
		display: none !important;
	}
	.baca-juga li a {
		font-size: 14px;
	}

	/*===============================================================================*/

	nav {
		padding: 20px !important;
	}
	ul.mr-auto {
		text-align: center;
		/*margin-top: 30px !important;*/
	}
	form.cari {
		display: inline-flex !important;
	}
	.cari input {
		/* width: 100px; */
		margin: 0 !important;
		padding: 0 !important;
		border-bottom: 1px solid #b0b0b0;
	}
	ul.socmed {
		display: block;
		text-align: right;
		/* margin-top: 50px; */
	}
	ul.socmed li {
		width: 20px;
		display: inline-block;
		margin: 0 10px;
	}
	.socmed-tiktok {
		margin-left: 0px !important;
	}
	.tiktok-m {
		margin-left: 0 !important;
	}
	.big-img {
		height: 500px;
	}
	.on-detail .big-img {
		height: 400px;
	}
	.header.on-detail {
		/*height: 400px;*/
		height: 100px;
		margin-top: 0px;
	}
	/* .detail-artikel {
		/ padding: 20px; /
		padding: 70px;
	} */
	.header {
		height: 500px;
		position: relative;
		/* padding: 0 20px; */
		margin-bottom: 30px;
		font-family: "Roboto";
	}
	.head-content button {
		font-size: 14px;
	}
	.head-content h1 {
		font-size: 26px;
		padding: 0 40px;
		margin: 40px 0 30px;
	}
	.head-content a {
		margin-top: 60px;
		font-size: 13px;
	}
	.head-content label {
		font-size: 13px;
		padding: 0 20px;
	}
	.content-11 h2 {
		font-size: 20px;
	}
	.content-11 {
		padding: 40px 20px;
	}
	.content-11 .row {
		font-size: 13px;
	}
	.section-2 {
		padding: 40px 20px;
	}
	.section-3 {
		padding: 60px 20px;
	}
	.footer {
		padding: 40px 20px;
	}
	.content-31 .content-32 {
		font-size: 13px;
	}
	a.more {
		font-size: 13px;
	}
	.content-21 button {
		font-size: 14px;
	}
	.descrip-update h3 {
		font-size: 22px;
	}
	.content-31 button {
		font-size: 14px;
	}
	.footer .descrip {
		padding: 20px 0px 20px;
	}
	.footer .foot-link .col-md-4:first-child {
		text-align: center;
		text-align: -webkit-center;
		text-align: -moz-center;
		text-align: -o-center;
		margin-bottom: 15px;
	}
	.footer .foot-link .col-md-4:last-child {
		text-align: center;
		text-align: -webkit-center;
		text-align: -moz-center;
		text-align: -o-center;
	}
	.footer .foot-link .col-md-4:first-child img {
		left: 50%;
		transform: translate(-50%, -50%);
		padding-left: 0;
	}
	.footer-link li a {
		font-size: 12px;
	}
	.footer-logo-bi {
		width: 189px;
		height: auto;
		padding-left: 0px !important;
		margin-left: 0;
	}
	.csson-content h2 {
		padding: 20px 0;
		font-size: 24px;
	}
	.csson-content label {
		padding-bottom: 20px;
	}
	.csson-content img:last-child {
		margin-top: 50px;
	}
	.csson-content form input {
		width: 100%;
	}
	.csson-content form button {
		width: 100%;
	}
	.content-42 .content-43 .col-md-6,
	.content-42 .content-43 .col-sm-12 {
		padding: 0 !important;
	}
	.content-42 .content-43 {
		margin: 0 !important;
	}
	.section-4 {
		padding: 20px;
	}
	.content-contact h2 {
		max-width: 800px;
		padding: 20px 0 35px;
	}
	.content-contact .left-text .right-text {
		text-align: center;
		text-align: -webkit-center;
		text-align: -moz-center;
		text-align: -o-center;
	}
	.content-contact .left-text .right-text .left-text {
		text-align: center;
		text-align: -webkit-center;
		text-align: -moz-center;
		text-align: -o-center;
	}
	.content-contact .section-contact {
		padding: 0 0;
	}
	.static-page {
		padding: 0 25px;
	}
	.on-static .footer-link li {
		margin: 5px 15px;
	}
	.on-static .footer-link li ul.socmed {
		padding: 0;
		margin: 5px 0 40px;
	}
	.on-static .footer-link li ul.socmed li {
		margin: 0 15px;
	}
	#recent {
		padding: 0 40px;
	}
	.panel-thumbnail img {
		border-radius: 4px;
		max-height: 155px;
	}
	.search-gambar img {
		width: 270px;
		height: 160px;
		object-fit: cover;
		border-radius: 4px;
	}
	.descrip-search {
		text-align: center;
	}

	/*PAGES*/
	.content-11 h1 {
		max-width: 100%;
		margin-top: 0px;
		letter-spacing: 0;
		font-family: "Roboto";
		font-style: normal;
		font-weight: 550;
		font-size: 13px;
		line-height: 20px;
	}
	.content-11.custom h1 {
		max-width: 100%;
		margin-top: 0px;
		letter-spacing: 0;
		font-family: "Roboto";
		font-style: normal;
		font-weight: 550;
		font-size: 20px;
		line-height: 20px;
	}
	.content-11.custom {
		text-align: center;
	}
	.content-11 h3 {
		font-family: "Roboto";
		font-style: normal;
		font-weight: 500;
		font-size: 12px;
		line-height: 20px;

		text-align: center;
		max-width: 750px;
		letter-spacing: 0;
	}
	.content-11 h4 {
		max-width: 100%;
		font-family: "Arial";
		font-style: normal;
		font-weight: 700;
		font-size: 12px;
		line-height: 20px;
		color: #445073;
		margin: 0px;
	}
	.content-11 p {
		max-width: 100%;
		font-size: 16px;
		letter-spacing: 0;
		font-family: "Arial";
		font-style: normal;
		font-weight: 400;
		font-size: 9px;
		line-height: 13px;
		text-align: center;
		margin-top: 10px;
	}
	.line2 {
		border: 0;
		border-top: 2px solid #000000;
		/* size: 10px; */
		width: 50px;
		height: 0px;
		align-items: center;
		color: #000000;
		flex: none;
		order: 1;
		flex-grow: 0;
		margin: 0px;
	}
	.line {
		border: 0;
		border-top: 2px solid #ffffff;
		/* size: 10px; */
		width: 50px;
		height: 0px;
		align-items: center;
		color: #ffffff;
		flex: none;
		order: 1;
		flex-grow: 0;
		margin: 0px;
	}
	.content-11 a img {
		margin-left: 5px;
		max-width: -webkit-fill-available;
	}
	.section-contact {
		margin: 40px;
	}
	.section-contact h2 {
		width: 100%;
		font-size: 20px;
	}

	.form-check-label {
		margin-bottom: 0;
		font-size: 12px !important;
	}

	.static-page p {
		font-family: "Arial";
		font-size: 12px;
		font-weight: 400;
		line-height: 20px;
		letter-spacing: 0em;
		text-align: justify;
		max-width: 100%;
		margin: 0 auto;
		padding-bottom: 15px;
		color: #000000;
	}
	.static-page li {
		font-family: "Arial";
		font-size: 12px;
		font-weight: 400;
		line-height: 20px;
		letter-spacing: 0em;
		text-align: justify;
		max-width: 100%;
		margin: 0 auto;
		padding-bottom: 15px;
		color: #000000;
	}

	ol.ul-first {
		padding: 0px;
	}
	ol.ul-second {
		padding: 0px;
	}
	ol.ul-third {
		padding: 10px;
	}
	.static-page h5 {
		font-size: 16px;
		line-height: 25px;
		font-family: "Roboto";
		font-weight: 514;
		margin: 10px auto;

		text-align: center;
		text-align: -webkit-center;
		text-align: -moz-center;
		text-align: -o-center;
		letter-spacing: 0;
		color: #445073;
		max-width: 100%;
	}
	.static-page h5.first {
		margin: 0auto;
		font-weight: 400;
		font-size: 12px;
		font-family: "Arial";
		/* text-align: center;
		text-align: -webkit-center;
		text-align: -moz-center;
		text-align: -o-center; */
		letter-spacing: 0;
		line-height: 20px;
		color: #000;
		max-width: 100%;
		text-align: justify;
	}
	.static-page h4 {
		font-size: 20px;
		font-family: "Roboto";
		font-style: normal;
		font-weight: 530;
		line-height: 35px;
		letter-spacing: 0;
		color: #000000;
		margin: 0 auto;
		padding: 0;
		text-align: center !important;
		text-align: -webkit-center !important;
		text-align: -moz-center !important;
		text-align: -o-center !important;
	}
	.persegi {
		width: 25px;
		height: 2px;
		margin: 0 auto;
		background: #000000;
	}

	/* .carousel-control-prev-icon {
		margin-left: -90px;
	}

	.carousel-control-next-icon {
		margin-right: -90px;
	} */

	/*tambahan tampilan baru*/

	.next-page-o div a img {
		height: 185px;
		border-radius: 6px;
		object-fit: fill;
	}
	.pagination {
		display: -ms-flexbox;
		display: contents;
		padding-left: 0;
		list-style: none;
		border-radius: 0.25rem;
	}
	.border-gallery {
		border: none;
		height: 1px;
		background-color: #ebebeb;
		margin: 5px 10px 5px 0px;
		width: 100%;
	}
}