ol {
  padding-left: 13px;
  list-style-position: outside;
}
ul {
  padding-left: 13px;
  list-style-position: outside;
}

[onclick] {
	cursor: pointer;
}
.matamaya {
	color: transparent;
    height: 0;
    width: 0;
    margin: 0;
    padding: 0;
    font-size: 21px;
}

/** Generated by FG **/
@font-face {
	font-family: 'OSBold';
	src: url('fonts/opensans/OpenSans-Bold.eot');
	src: local('☺'), url('fonts/opensans/OpenSans-Bold.woff') format('woff'), url('fonts/opensans/OpenSans-Bold.ttf') format('truetype'), url('fonts/opensans/OpenSans-Bold.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'OSExtraBold';
	src: url('fonts/opensans/OpenSans-ExtraBold.eot');
	src: local('☺'), url('fonts/opensans/OpenSans-ExtraBold.woff') format('woff'), url('fonts/opensans/OpenSans-ExtraBold.ttf') format('truetype'), url('fonts/opensans/OpenSans-ExtraBold.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'OSSemiBold';
	src: url('fonts/opensans/OpenSans-SemiBold.eot');
	src: local('☺'), url('fonts/opensans/OpenSans-SemiBold.woff') format('woff'), url('fonts/opensans/OpenSans-SemiBold.ttf') format('truetype'), url('fonts/opensans/OpenSans-SemiBold.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'OSReg';
	src: url('fonts/opensans/OpenSans-Regular.eot');
	src: local('☺'), url('fonts/opensans/OpenSans-Regular.woff') format('woff'), url('fonts/opensans/OpenSans-Regular.ttf') format('truetype'), url('fonts/opensans/OpenSans-Regular.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Manjari-Bold';
	src: url('fonts/manjari/Manjari-Bold.eot');
	src: local('☺'), url('fonts/manjari/Manjari-Bold.woff') format('woff'), url('fonts/manjari/Manjari-Bold.ttf') format('truetype'), url('fonts/manjari/Manjari-Bold.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Manjari-Reg';
	src: url('fonts/manjari/Manjari-Regular.eot');
	src: local('☺'), url('fonts/manjari/Manjari-Regular.woff') format('woff'), url('fonts/manjari/Manjari-Regular.ttf') format('truetype'), url('fonts/manjari/Manjari-Regular.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Rubik';
	src: url('fonts/rubik/Rubik-Regular.eot');
	src: local('☺'), url('fonts/rubik/Rubik-Regular.woff') format('woff'), url('fonts/rubik/Rubik-Regular.ttf') format('truetype'), url('fonts/rubik/Rubik-Regular.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Ubuntu-Reg';
	src: url('fonts/ubuntu/Ubuntu-R.eot');
	src: local('☺'), url('fonts/ubuntu/Ubuntu-R.woff') format('woff'), url('fonts/ubuntu/Ubuntu-R.ttf') format('truetype'), url('fonts/ubuntu/Ubuntu-R.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Ubuntu-Med';
	src: url('fonts/ubuntu/Ubuntu-M.eot');
	src: local('☺'), url('fonts/ubuntu/Ubuntu-M.woff') format('woff'), url('fonts/ubuntu/Ubuntu-M.ttf') format('truetype'), url('fonts/ubuntu/Ubuntu-M.svg') format('svg');

	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Ubuntu-Bold';
	src: url('fonts/ubuntu/Ubuntu-B.eot');
	src: local('☺'), url('fonts/ubuntu/Ubuntu-B.woff') format('woff'), url('fonts/ubuntu/Ubuntu-B.ttf') format('truetype'), url('fonts/ubuntu/Ubuntu-B.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
body {
    font-family:'Ubuntu', sans-serif;
}

.modalstyle { background:transparent; box-shadow: 0 0 0 transparent; border:0; }
.pemisahx { width:100%; border-top:2px solid #ccc; float:left; margin-bottom:25px; }
.btnlmgrey { border-radius:7px; background:#f0f0f0; float:right; margin-top:20px; margin-bottom:50px; padding:12px; border:0; width:100%; font-family:'Manjari', sans-serif; font-weight: 700; font-size:16px }
.catarttitle { width:100%; float:left; color:#21C28E; font-size:14px; font-family:Manjari-Bold }
.catarttitle:hover {color:#21C28E}
.catarttitlec { width:100%; float:left; margin:10px 0 10px 0; font-size:16px; font-family:Manjari-Bold;color:#333 }
.catarttitled { width:100%; float:left; font-size:12px; font-family:'Manjari', sans-serif; font-weight: 700; margin-bottom:20px; }
.slidebox { width:100%; text-align:center; background:#fff; padding:15px; float:left }
::placeholder {
  color: #000;
  opacity: 1;
}

:-ms-input-placeholder {
 color: #000;
}

::-ms-input-placeholder {
 color: #000;
}
button:focus, button:active {
	outline: none;
}
.titleArt {
	font-family: OSExtraBold;
    font-size: 1.9em;
    margin-top: 0;
}
.no-list {
	list-style: none;
}
.feature-footer li {
	list-style: none;
    line-height: 1;
    margin-bottom: 10px;
}
.connecting ul {
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	padding-left: 0;
	margin-bottom: 0;
}
.connecting ul li a {
	filter: grayscale(100%);
	transition: ease all .3s;
    margin-left: 6px;
	display: block;
}
.connecting ul li:first-child a {
	margin-left: 0;
}
.connecting ul li a:hover {
	filter: grayscale(0%);
}
.connecting ul li a,.connecting ul li a:hover {
	text-decoration: none;
}
.connecting ul li a:hover .fa-facebook {
	background-color:#0D5B9B;
}
.connecting ul li a:hover .fa-twitter {
	background-color:#00ABFF;
}
.connecting ul li a:hover .fa-instagram {
	background-color:#A804B1;
}
.connecting ul li a:hover .fa-youtube-play {
	background-color: #FF0000;
}
.connecting ul li a:hover .fa-linkedin {
	background-color: #0077b5;
}
.connecting ul li a:hover .fa-tk {
	background-color: #000000;
}
.connecting ul li a .fa {
	width: 30px;
	height: 30px;
	color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    font-size: 17px;
	background-color: #9d9d9d;
}
.connect-mb {
	display: none;
}
.connect-lg {
	display: block;
}
@media screen and (max-width:602px) {
	.connect-mb {
		display: block;
	}
	.connect-lg {
		display: none;
	}
	.footcopyrite .justify-content-between {
		justify-content: center;
	}
	.footcopyrite .copyrite img {
		display: block;
		text-align: center;
		margin: auto;
		margin-bottom: 15px;
	}
}

#secondHM { display: none; }
.active #firstHM { display:none; }
.active #secondHM { display: inline-block; }

#secondPOST { display: none; }
.active #firstPOST { display:none; }
.active #secondPOST { display: inline-block; }

#secondLOC { display: none; }
.active #firstLOC { display:none; }
.active #secondLOC { display: inline-block; }
.menuutama {
	position: relative;
}
.menuutama .opgstyle {
	position: relative;
}
.hv-item {
	position: absolute;
	right: 0;
	background-color: #fff;
	top: 40px;
	width: 220px;
	z-index: 2;
	border-top-left-radius: 10px;
	border-bottom-right-radius: 10px;
	padding: 20px 15px;
	opacity: 0;
	visibility: hidden;
	box-shadow: 0 4px 12px 0 rgb(0 0 0 / 12%), inset 0 0 0 1px rgb(12 18 28 / 6%);
}
.hv-item:after {
	bottom: 98%;
	right: 15px;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(136, 183, 213, 0);
	border-bottom-color: #fff;
	border-width: 12px;
	margin-left: -12px;
}
.hv-item.show {
	visibility: visible;
	opacity: 1;
	transition: opacity .15s ease;
}
.hv-item ul {
	list-style: none;
	padding-left: 0;
	margin-bottom: 0;
}
.hv-item ul a {
	border: 0;
    background: transparent;
    padding: 5px 0;
    text-align: right;
    display: block;
    width: 100%;
	color:#333
}
.hv-item ul a:hover {
	text-decoration: none;
}
.hv-item.item-more {
	width: 160px;
	right:-30px;
}
.hv-item.item-more:after {
	right: 33px;
}
.hv-item.item-more ul li a i {
	margin-right: 5px;
}
.hv-item.item-more ul li a {
	text-align: left;
}
.hv-item.profile__menu {
	padding:5px 0;
}
.profile__menu li:first-child {
	border-bottom: solid 1px #ccc;
	margin-bottom: 5px;
}
.profile__menu li:last-child {
	border-top: solid 1px #ccc;
	margin-top:5px;
}
.profile__menu li a {
	padding:5px 15px;
}
.text-center {
	text-align: center;
}
.d-flex {
	display: flex;
	flex-wrap: wrap;
}
.algin-center {
	align-items: center !important;
}
.justify-content-center {
	justify-content: center !important;
}
.justify-content-between {
	justify-content: space-between;
}
ul.hv-item-mobile {
	list-style: none;
	padding-left: 0;
	margin-bottom: 0;
}
ul.hv-item-mobile a {
	border: 0;
    background: transparent;
    padding: 5px 0;
    display: block;
    width: 100%;
	color:#fff
}
.headMenu {
	display: flex;
    align-items: center;
    flex-wrap: nowrap;
    flex-direction: column;
    list-style: none;
    padding: 0;
    margin: 0;
    flex: 0 0 100%;
    width: 100%;
}
.headMenu li {
	position: relative;
	display: block;
}
.headMenu li a {
	float:none;
	display: inline-block;
	width: auto;
}
.headMenu li a:is(:focus, :hover) {
	color: white;
	text-decoration: none;
}
.headMenu li span {
	position: relative;
    top: -4px;
    display: inline-block;
    color: #fff;
    font-size: 14px;
    line-height: 1;
    margin-left: 10px;
}
.contentbox { 
	flex: 0 0 100%;
	width:100%;
	padding: 30px 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.hiddemob {
	display: none;
}
.r-columns {
	flex-direction: row-reverse;
}
.columns {
    display:block;
    position:relative;
	padding-left: 10px;
	padding-right: 10px;
}
.columns:before, .columns:after {
	content: " ";
	display: table;
}
.columns:after {
	clear: both;
}
.btn-default-mm {
	width: 150px;
    background: #FC0;
    display: inline-block;
    padding: 10px;
    border-radius: 50px;
    text-decoration: none;
    font-family: OSBold;
    color: #000;
}
.btn-default-mm:hover {
	text-decoration: none;
	color:#000;
}
.slide-brands.owl-carousel .owl-item img {
	width: auto;
	margin: auto;
}
.slide-brands .owl-nav button {
	position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    font-size: 22px !important;
}
.slide-brands .owl-nav button.owl-prev {left: -15px;}
.slide-brands .owl-nav button.owl-next {right: -15px;}
.divlogo img.logo-c { display: none; }
.divlogo img.logo-w { display: block; }
.nav-light .divlogo img.logo-c { display: block; }
.nav-light .divlogo img.logo-w { display: none; }

.nav-light .homeBoxMenu {background-color: #fff;box-shadow:0px 0px 12px -7px #000}
.nav-light .menusec .colorpghome {color: #333;}
.traisisi {transition: ease .3s all }
.pointer {cursor: pointer;}
.mb-15 {margin-bottom: 15px;}
.mb-30 {margin-bottom: 30px;}
.osreg p {
	font-family: OSReg;
}
.headSubsc {
	box-shadow: 0px -70px 210px 140px rgb(255 255 255 / 97%), 0px 0px 30px 60px rgb(255 255 255 / 97%);
    background: #fff;
    margin-top: -25em;
    position: relative;
}
.formSubscribe {
	width: 650px;
	max-width: 100%;
    margin: auto;
    background-color: #fff;
    padding: 2em;
	position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
}
.formSubscribe .fieldLogin {
    float: left;
    width: 100%;
    position: relative;
}
.formSubscribe input:-webkit-autofill {
	border-color: #21C28E;
}
.formSubscribe input:not([type="checkbox"]) {
    width: 100%;
    border: 0;
    border-bottom: solid 1px #d2d2d2;
    margin-bottom: 1em;
    padding: 0.5em 2.4em;
    font-size: 1em;
	font-family: Ubuntu-Reg;
}
.formSubscribe input[type="submit"] {
    background-color: #21C28E;
    color: #fff;
    font-family: Ubuntu-Reg;
    text-transform: uppercase;
    font-size: 1.28571429em;
    padding: .3em 0 .3em 0;
    border: 0;
}
.formSubscribe input:focus,
.formSubscribe input:active {
	outline: none;
}
.formSubscribe .iconSign {
	width: 17px;
    height: 17px;
    position: absolute;
    top: 5px;
    bottom: 0;
    left: 10px;
    font-size: 1.28571429em;
}
.form-checked {
	display: block;
	margin-bottom: 15px;
}

.form-checked input {
	padding: 0;
	height: initial;
	width: initial;
	margin-bottom: 0;
	display: none;
	cursor: pointer;
}

.form-checked label {
	position: relative;
	cursor: pointer;
	padding-left:50px;
	font-size: 21px;
	font-family: 'Ubuntu-Bold';
}

.form-checked label:before {
	content:'';
	-webkit-appearance: none;
	background-color: transparent;
	border: 2px solid #7a7a7a;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05);
	padding: 13px;
	display: inline-block;
	vertical-align: middle;
	cursor: pointer;
	margin-right: 5px;
	border-radius: 5px;
	position: absolute;
	left:0;
	top:5px;
}
.packagesReporing .form-checked label:before {
	opacity: 0;
}

.form-checked input:checked + label:after {
	content: '';
	display: block;
	position: absolute;
    top: 8px;
    left: 9px;
    width: 11px;
    height: 21px;
    border: solid #fff;
    border-width: 0 5px 5px 0;
	transform: rotate(45deg);
}
.form-checked input:checked + label:before {
    border: 2px solid transparent;
    background: rgb(38,204,149);
    background: linear-gradient(44deg, rgba(38,204,149,1) 0%, rgba(167,198,88,1) 100%);
}
.packagesTitle {
	position: relative;
	font-size: 30px;
	line-height: 1.2;
}
.form-checked label.hide-check:before {
	opacity: 0;
	display: none;
}
.packagesTitle .boxGrdn {
	width: 30px;
	height: 30px;
	position: absolute;
	left: 0px;
	background: rgb(38,204,149);
    background: linear-gradient(44deg, rgba(38,204,149,1) 0%, rgba(167,198,88,1) 100%);
    border-radius: 5px;
	top:6px;
	display: none;
}
.sub__report .packagesTitle .boxGrdn {
	display: block;
	left:-10px;
}
.packagesTitle .pltfm {
	display: block;
	font-size: 13px;
	font-family: 'Ubuntu-Reg';
}
.pg-planpricing.checkPackages {
	margin-bottom: 1em;
	padding:0 15px;
	border-bottom:0 transparent
}
.checkPackages .packagesTitle .boxGrdn {
	width:30px;
	height:30px;
	border-radius: 6px;
}
.checkPackages .packagesTitle .boxGrdn {
	left: 5px;
    margin: auto 0;
    bottom: 0;
	top:0;
}
.checkPackages .val-Qty {
	justify-content: flex-end;
}
.checkPackages.sub__report:after, .checkPackages.plan_period_report:after {
	z-index: 0;
}
.pg-planpricing.checkPackages.menu__reporting {
	margin-bottom: 0;
}
.checkPackages.menu__reporting  .packagesTitle .boxGrdn {
	z-index: 1;
}
.checkPackages.menu__reporting.sub__report:after, .checkPackages.menu__reporting.plan_period_report:after, .checkPackages.menu__reporting.plan_period_report:before {
	left: 33px;
}

.checkPackages.plan_period_report .form-checked label:before,
.checkPackages.menu__reporting  .form-checked label:before {
	display: none;
}
.rm-border.pg-planpricing {
	border:0;
}
.sub__report.pg-planpricing {
	margin-bottom: 0;
}
.plan_period_report.pg-planpricing {
	border:0;
	padding-left: 50px;
}
.plan_period_report .packagesTitle .boxGrdn {
	width:30px;
	height:30px;
	border-radius: 6px;
	top:12px;
}
.plan_period_report .form-checked label {
	font-size: 18px;
	padding-left:50px;
}
.choose__acc .select2-container .select2-search--inline .select2-search__field,
.plan_period_report .select2-container .select2-search--inline .select2-search__field {
	font-family: 'Ubuntu-Reg';
	padding-left:12px;
}
.choose__acc .select2-container--default .select2-selection--multiple,
.plan_period_report .select2-container--default .select2-selection--multiple {
	border:0;
	border-bottom: 1px solid #d8d8d8;
	border-radius: 0;
}
.choose__acc .select2-container--default .select2-selection--multiple .select2-selection__choice,
.plan_period_report .select2-container--default .select2-selection--multiple .select2-selection__choice {
	background: #22C993;
    color: #fff;
    padding-bottom: 3px;
	height: 25px;
	border-color: transparent;
	box-shadow: 0px 3px 6px -5px #000;
}
.choose__acc .select2-container--default .select2-selection--multiple .select2-selection__choice__remove,
.plan_period_report .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
	bottom:0;
	color:#fff;
	border-color: #fff;
}
.choose__acc .select2-container--default.select2-container--focus .select2-selection--multiple,
.plan_period_report .select2-container--default.select2-container--focus .select2-selection--multiple {
	border:0;
	border-bottom: solid #22C993 1px;
}
.radio__customs label {
	display: flex;
	cursor: pointer;
	font-weight: 500;
	position: relative;
	overflow: hidden;
	margin-bottom: 0.375em;
}
.radio__customs label input {
	position: absolute;
	left: -9999px;
}
.radio__customs label input:checked + span:before {
	box-shadow: inset 0 0 0 0.4375em #21C28E;
}
.radio__customs label span {
	display: flex;
	align-items: center;
	padding: 0.375em 0.75em 0.375em 0.375em;
	border-radius: 99em;
	transition: 0.25s ease;
}
.radio__customs label span:before {
	display: flex;
	flex-shrink: 0;
	content: "";
	background-color: #fff;
	width: 1.5em;
	height: 1.5em;
	border-radius: 50%;
	margin-right: 0.375em;
	transition: 0.25s ease;
	box-shadow: inset 0 0 0 0.125em #acacac;
}
.label-with-info {
	padding-bottom:10px;display:inline-block;text-align:left;margin-bottom:0;
	position: relative;
}
.label-with-info .tooltip-inner {
	width: 200px;
	max-width: 100%;
}
.info__tax {
    position: absolute;
    right: -20px;
    top: 0;
    width: 18px;
    border: solid 1px #21C28E;
    border-radius: 100%;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    color: #21C28E;
}
.inline-pack {
	display: inline-block;
	position: relative;
}
.info__pack {
	position: absolute;
    right: -35px;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    width: 18px;
    border: solid 1px #21C28E;
    border-radius: 100%;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    color: #21C28E;
}
.inline-pack .tooltip-inner {
	width: 200px;
	max-width: 100%;
}
.tooltip-inner {
	background-color: #21C28E;
	max-width: 300px;
	padding:5px;
	font-family: 'OSReg';
    font-size: 11px;
}
.tooltip.top .tooltip-arrow {
	border-top-color: #21C28E;
}
.sticky__invoice {
	position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #fff;
    z-index: 2;
    box-shadow: 0px 7px 30px -8px #adadad;
	display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.desc_stick_invoice {
	display: flex;
	flex-wrap: wrap;
}
.stick_invoice_left {
	flex:0 0 250px;
	width: 250px;
	padding:8px 0;
}
.stick_invoice_right {
	flex:0 0 250px;
	width: 250px;
}
.stick_invoice_right button {
	background-color: #22C993;
    border: 0;
    color: #fff;
    font-size: 21px;
    font-family: 'Ubuntu-Med';
    line-height: 1;
	border:0;
    padding: 0;
	width: 100%;
}
.desc_stick_invoice .judul, .desc_stick_invoice .sumPrice {
	font-family:'Ubuntu-Reg', sans-serif;
} 
.desc_stick_invoice .sumPrice {
	font-size: 32px;;
}
@media screen and (max-width:1024px) {
	.agreement_register {
		padding-left: 15px;
		margin-top: 15px;
	}
	.feature-footer {
		padding-left:0;
	}
}
@media screen and (max-width:860px) {
	.pg-planpricing.checkPackages {
		border-bottom: solid 1px #ccc;
		padding-bottom: 5px;
	}
	.pg-planpricing.checkPackages:last-child {
		border-bottom: 0;
	}
	.checkPackages .form-checked label {
		padding-left: 0;
	}
	.checkPackages .val-Qty {
		justify-content: flex-start;
	}
	.checkPackages .form-checked {
		margin-bottom: 0;
	}
	.lineAdditonal.checkPackages {
		padding:0 15px;
		margin-top: 3em;
	}
	.fakrur_pajak {
		overflow-x: auto;
	}
	.fakrur_pajak table {
		max-width: 700px;
		width: 700px;
	}
}
.date_active_title {
	font-family:'Ubuntu', sans-serif;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	font-size: 24px;
	font-weight: 500;
}
.date_active_title span {
	margin-left: 5px;
}
.p-15 {padding:15px;}
.pl-5 {padding-left: 5px;}
.pl-15 {padding-left:15px;}
.pr-5 {padding-right: 5px;}
.pr-15 {padding-right: 15px;}
.lineAdditonal.checkPackages {
	padding:0 20px;
}
.is_free {
	font-size: 18px;
    margin-bottom: 30px;
}
.pg-Plan {
	max-width: 100%;
	background-color: #fff;
	padding:5px 0 15px;
}
.detailPackage {
	display: flex;
	justify-content: space-between;
	padding:2em 0 0em 20px;
	flex-wrap: wrap;
	align-items: flex-start;
}
.space-listPrice .detailPackage {padding-left: 0;}
.detailPackage.pt-0 {
	padding-top:0
}
.pg-planpricing .num__current{
	display: flex;
    flex-wrap: wrap;
    align-content: center;
    justify-content: flex-end;
    width: 100%;
    align-items: center;
}
.pg-planpricing .sumQty {
    display: flex;
    align-content: flex-start;
    align-items: center;
    justify-content: space-between;
	border-radius: 5px;
	overflow: hidden;
    font-family: 'Ubuntu-Med';
	font-size: 14px;
    width: 220px;
    line-height: 1;
	padding: 5px;
    border: 2px solid #7a7a7a;
}
.pg-planpricing .sumQty button {
    background-color: #22C993;
    border: 0;
    color: #fff;
    font-size: 21px;
    font-family: 'Ubuntu-Med';
    line-height: 1;
	width: 35px;
	height:35px;
	border-radius: 5px;
    padding: 0;
}
.pg-planpricing .sumQty button:focus,
.pg-planpricing .sumQty button:active {
	outline: none;
}
.pg-planpricing .sumQty.count__upgrade {
	border: 2px solid #989898;
	padding: 3px;
	color:#989898;
}
.pg-planpricing .sumQty.count__upgrade button {
	width: 28px;
    height: 28px;
	font-family: 'Ubuntu', sans-serif;
	font-weight: 500;
	display: flex;
    align-items: center;
    justify-content: center;
	font-size: 24px;
}
.pg-planpricing .sumQty.count__upgrade .blk-col span {
	border-bottom: solid 2px #373636;
    padding: 0 10px;
    color: #373636;
}
.pg-planpricing .sumQty.count__upgrade .blk-col .sml {
	border-bottom: 0;
	display: block;
	margin-top: 5px;
}
.pg-planpricing .sumPackages {
    font-family: 'Ubuntu-Med';
	width: 100%;
    font-size: 2.5em;
	text-align: center;
	margin-top:10px;
}
.pg-planpricing .sumPackages .durationPack {
	display: block;
    font-size: 12px;
    text-align: center;
    color: #888888;
    font-weight: 500;
    font-family: 'Ubuntu', sans-serif;
    line-height: 1;
    margin-bottom: 10px;
}
.pg-Plan .pg-planpricing .extends__count {
	display:none;
	font-family: 'Ubuntu-Med';
    font-size: 14px;
}
.pg-Plan .pg-planpricing .extends__count button {
	border:0;
}
.pg-Plan .pg-planpricing .detail__current .count__upgrade {
	display: none;
}
.pg-Plan .pg-planpricing .detail__current .current__packages {
	width: 50%;
}
.pg-Plan .pg-planpricing .current__packages {
	width: 45%;
	display: flex;
	flex-wrap: wrap;
    justify-content: center;
	border: 2px solid #7a7a7a;
    padding: 8px 0;
    font-family: 'Ubuntu-Med';
    font-size: 14px;
    border-radius: 5px;
    overflow: hidden;
	margin-bottom: 0;
    line-height: 1;
}
.pg-Plan .pg-planpricing .sumQty {
	width: 50%;
}
.pg-Plan .pg-planpricing .detail__current .sum__upgrade_pack {
	display: none;
}
.pg-Plan .pg-planpricing .detail__current .extends__count {
	display: block;
}
.pg-Plan .checkPackages .val-Qty {
	display: flex;
	flex-wrap: wrap;
    align-items: flex-end;
	width:100%;
}
.pg-Plan .pg-planpricing .sumPackages {
	padding-left:15px;
}
.pg-Plan .form-checked input:checked + label:after {
	display: none;
}
.parent_subs_pack {
	padding-left: 50px;
}
.menu_plan {
	padding:15px;
}
.menu_plan ul {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
}
.menu_plan li {
	padding-right:15px;
}
.menu_plan li a {
	font-family: 'Ubuntu-Med';
	color:#a4a4a4;
	font-size: 18px;
	text-decoration: none;
	transition: ease all .3s;
}
.menu_plan li a:focus, .menu_plan li a:active {
	text-decoration: none;
}
.menu_plan li a:hover {
	color:#21C28E;
}
.menu_plan li.active a {
	color:#21C28E;
	border-bottom: solid 2px #21C28E;
    padding-bottom: 7px;
}
@media screen and (max-width:860px) {
	.account__actived {
		justify-content: flex-start;
		border-bottom: solid 1px #ccc;
		margin-bottom: 15px;
	}
}
.menusec .opgstyle.menu_user {
	padding:5px 10px;
}
.menusec .menu_user .colorpgothers {
	color:#505050
}
.menusec .menu_user img {
	border-radius: 20px;
}
.menusec .menu_user .fa {
	margin-left: 3px;
}
.dis__grid {
	display: grid;
    grid-template-columns:33.33333% 33.33333% 33.33333%;
    grid-column-gap: 0;
    grid-row-gap: 0px;
    width: 100%;
}
.dis__grid__gap_x {
	gap: 0px 15px;
}
.list_pack {
	list-style: none;
	padding-left: 0;
	display: grid;
    grid-template-columns:50% 50%;
    grid-column-gap: 0;
    grid-row-gap: 0px;
    width: 100%;
}
.list_pack.list_pack2, .list_pack2 {
    grid-template-columns:50% 50%;
}
.list_pack.list_pack__cs {
    grid-template-columns:50% 50%;
}
.dis__grid__gap_x {
    grid-template-columns:100%;
}
.list_pack li {
	position: relative;
	font-size: 14px;
	font-family: 'Ubuntu-Reg';
	color:#7a7a7a;
	padding-left:30px;
	margin-bottom: 5px;
}
.list_pack li li {
	padding-left:5px;
}
.list_pack > li:before {
	content: "";
	background-image:url('../img/checklist.png');
	background-repeat: no-repeat;
	background-position: 0px 0px;
	position: absolute;
	left:0;
	top:0;
	width: 15px;
	height: 15px;
}
.pg-planpricing {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
    margin-bottom: 2em;
}
.form-left {
	width: 100%;
}
.form-right {
	width: 100%;
	padding-top: 8px;
}
.val-Qty {
	display: flex;
    flex-wrap: wrap;
    justify-content: center;
	flex-direction: column;
    align-items: center;
	margin-bottom: 1em;
}
.add_ext {
	margin-bottom: 20px;
	font-size: 21px;
	font-family: 'Ubuntu-Bold';
}
.total-packages {
	display: flex;
    flex-wrap: wrap;
	width: 100%;
    float: right;
	border: 2px solid #7a7a7a;
	border-radius: 5px;
	padding:15px;
}
.total-packages .size__body {
	display: flex;
    flex-wrap: wrap;
	width: 100%;
}
.total-packages ul {
	list-style: none;
	padding-left: 20px;
    padding-right: 20px;
	width:100%;
}
.total-packages ul li {
	display: flex;
	flex-wrap: wrap;
	flex:0 0 100%;
	width: 100%;
	font-size: 14px;
    font-family: 'Ubuntu-Reg';
	padding-bottom:5px;
	margin-bottom: 15px;
	border-bottom:solid 1px #ddd;
}
.total-packages ul li .itemName {
	width: 100%;
}
.total-packages ul li .itemQty {
	width: 50%;
}
.total-packages ul li .itemPrc {
	width: 50%;
	display: flex;
    justify-content: flex-end;
}
.total-packages .totalItem {
	flex: 0 0 100%;
    display: flex;
    justify-content: space-between;
}
.total-packages .redeem-voucher {
	display: flex;
	justify-content: space-between;
	margin-bottom: 15px;
	position: relative;
	flex-wrap: wrap;
}
.total-packages .redeem-voucher input {
	width: 75%;
	font-weight: 600;
    font-size: 16px;
    padding: 8px 15px;
    border-radius: 7px;
    border: 0;
    background-color: #e3e3e3;
}
.total-packages .redeem-voucher input::placeholder {
	color:#A5A5A5;
	font-weight: 500;
}
.total-packages .redeem-voucher input:active, .total-packages .redeem-voucher input:focus {
	border:0;
	background-color: #eeeeee;
	outline: none;
}
.total-packages .redeem-voucher button {
	width: 23%;
	background-color: #00B0CC;
    border: 0;
    border-radius: 7px;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
}
.total-packages .redeem-voucher .info-redeem {
    font-size: 10px;
	display: block;
	width: 100%;
}
.total-packages .redeem-voucher .info-redeem.succes-redeem {
	color:#00C287;
}
.total-packages .redeem-voucher .info-redeem.error-redeem {
	color:#BD0000
}
.total-packages .totalItem .judul,
.total-packages .totalItem .sumPrice {
	font-size: 18px;
    font-family: 'Manjari-Bold';
}
.total-packages .btn-buy-signin:active,
.total-packages .btn-buy-signin:focus,
.total-packages .btn-buy:active,
.total-packages .btn-buy:focus {
	outline: none;
}
.total-packages .btn-buy-signin,
.total-packages .btn-buy {
	border:0;
	background-color: #22C993;
	font-family:'Ubuntu', sans-serif;
	font-weight: 700;
	font-size: 18px;
	color:#fff;
	width: 100%;
	text-align: center;
	text-transform: uppercase;
	border-radius: 5px;
	padding:10px 0;
}
.total-packages ul li.sub__invoice {
	border:0;
}
.total-packages ul li.sub__invoice li .itemName {
	font-style: italic;
}
.total-packages ul li .itemName.title__sub_invoice {
	width: 100%;
    margin-bottom: 10px;
}
.right-arrow .owl-nav {text-align: right;margin-top: 15px;}
.right-arrow .owl-nav .owl-prev {margin-right: 7px;}
.right-arrow .owl-nav .owl-next {margin-left: 7px;}
.pg-planpricing {
	padding:0;
	border-bottom: 2px solid #ebebeb;
}
.pg-planpricing.last_periode {
	margin-bottom: 2em;
	border-bottom: 2px solid #ebebeb;
}
.sub__report .packagesTitle .boxGrdn {
	left:0;
}
.popup-faktur {
	position: fixed;
	left:0;
	right: 0;
	top:0;
	bottom:0;
	overflow-x: hidden;
    overflow-y: auto;
	z-index: 21;
	display: none;
}
.popup-faktur .bg-dialog {
	position: absolute;
	left:0;
	right: 0;
	top:0;
	bottom:0;
	z-index: 2;
	background-color: rgba(0, 0, 0, .5);
}
.popup-faktur .popup-content {
	width: 400px;
    margin-left: auto;
    margin-right: auto;
    background-color: #fff;
    position: relative;
    z-index: 2;
    margin-top: 1.75rem;
	border-radius: 5px;
	transition:ease all .3s;
	transform: translate(0,-50px);
	visibility: hidden;
	opacity: 0;
}
.popup-faktur.get_show .popup-content {
	transform: translate(0,0px);
	visibility: visible;
	opacity: 1;
}
.default_popup {
	position: fixed;
	left:0;
	right: 0;
	top:0;
	bottom:0;
	overflow-x: hidden;
    overflow-y: auto;
	z-index: 21;
	display: none;
}
.default_popup .bg-dialog {
	position: absolute;
	left:0;
	right: 0;
	top:0;
	bottom:0;
	z-index: 2;
	background-color: rgba(0, 0, 0, .5);
}
.default_popup .popup-content {
	width: 400px;
    margin-left: auto;
    margin-right: auto;
    background-color: #fff;
    position: relative;
    z-index: 2;
    margin-top: 10rem;
	border-radius: 5px;
	transition:ease all .3s;
	transform: translate(0,-50px);
	visibility: hidden;
	opacity: 0;
}
.default_popup.get_show .popup-content {
	transform: translate(0,0px);
	visibility: visible;
	opacity: 1;
}
.default_popup .btn-close {
    position: absolute;
    top: -25px;
    right: 40px;
    background-color: #21C28E;
    color: #fff;
    border: 0;
    font-size: 38px;
    width: 34px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    font-family: sans-serif;

}
.default-input {
	border: 2px solid #21C28E;
    height: 38px;
    border-radius: 30px;
    font-family: 'Ubuntu-Reg';
    font-size: 14px;
    width: 100%;
    padding: 0 15px;
}
.default-input:active, .default-input:focus {
	border: 2px solid #21C28E;
	outline: none;
}
.default-input::placeholder {
	color:rgba(0, 0, 0, .2);
	opacity: 1;
}
  
.default-input:-ms-input-placeholder {
	color:rgba(0, 0, 0, .2);
}

.default-input::-ms-input-placeholder {
	color:rgba(0, 0, 0, .2);
}
.popup-faktur .faktur-send {
    padding: 8px 0;
    width: 150px;
	float:none;
	transition: ease all .3s;
}
.popup-faktur .faktur-send:hover {
	background-color: #21C28E;
	color:#fff;
}
.popup-faktur .btn-close {
	position: absolute;
    top: -10px;
    right: -10px;
    background-color: #21C28E;
    color: #fff;
    border: 0;
    border-radius: 30px;
    font-size: 16px;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.confirmReset__count .faktur-send {
	width: 85px;
	border-radius: 5px;
    padding: 5px 0;
}
.download__faktur {
	font-weight: 500;
	color:#000;
	text-decoration: none;
}
.download__faktur:hover {
	color:#000;
	text-decoration: none;
}
.download__faktur .fa {
	color:#21C28E;
	margin-right: 5px;
	position: relative;
	top:1px;
}
.btn-transparent {
	background-color: transparent;
	border:0;
}
.btn-transparent:active,
.btn-transparent:focus {
	outline: none;
}
.pt-30 {
	padding: 0 0 30px;
}
.one__choose {
	display: flex;
	flex-wrap: wrap;
	padding-top:.5em;
	justify-content: space-between;
	flex:0 0 100%;
	width: 100%;
}
.one__choose .choose__month{
	flex:0 0 100%;
}
.two__choose {
	display: flex;
	flex-wrap: wrap;
	padding-top:.5em;
	justify-content: space-between;
	align-items: flex-end;
	flex:0 0 100%;
	width: 100%;
}
.two__choose .choose__month,
.two__choose .choose__account {
	flex:0 0 35%;
}
.two__choose textarea{
	min-height: 32px;
}
.two__choose .choose__account {
	position: relative;
	padding-right:30px;
	flex:0 0 63%;
}
.choose__account .info__pack {
	right: 0px;
	margin-top:10px;
}
.detail__invoice,.popupTutorial {
	display: none;
	position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
	z-index: 3;
}
.bg-layer {
	background-color: rgba(0, 0, 0, .5);
	position: absolute;
	top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.detail__invoice .total-packages{
	padding:0;
	z-index: 2;
	display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    max-height: 750px;
	overflow: hidden;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    top: 0;
	border:0;
}
.detail__invoice .size__body{
    margin: 35px 20px 10px;
    position: relative;
    box-shadow: 0px 0px 13px 7px #686868;
    border-radius: 8px;
	background-color: #fff;
}
.detail__invoice .ttl__inv{
	text-transform: uppercase;
	font-family: 'Ubuntu-Med', sans-serif;
	font-size: 1.9em;
    text-align: center;
    padding: 0.5em 0;
}
.detail__invoice .total-packages .btn-close {
	position: absolute;
    top: -25px;
    right: 40px;
    background-color: #21C28E;
    color: #fff;
    border: 0;
    font-size: 16px;
    width: 34px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
	font-family: 'Ubuntu-Med', sans-serif;
}
.list__inv {
	padding-left: 10px;
    max-height: 200px;
	overflow: hidden;
    overflow-y: auto;
}
.popupTutorial .body-iframe {
	z-index: 2;
	overflow: hidden;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    margin: auto;
	border:0;
	width:980px;
	max-width:100%;
	display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    align-content: center;
}
.popupTutorial .body-iframe .btn-close {
	position: absolute;
    top: -25px;
    right: 40px;
    background-color: #21C28E;
    color: #fff;
    border: 0;
    font-size: 16px;
    width: 34px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    font-family: 'Ubuntu-Med', sans-serif;
}
.popupTutorial .body-iframe .detail-popup {
	width: 100%;
	display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
	background-color: #fff;
	padding:15px;
	position: relative;
}
.popupTutorial .body-iframe .video_introductions {
	height:auto;
	width: 100%;
}
.popupTutorial .body-iframe .detail-popup .video_introductions iframe {
	top:0;
}
.sucessAlert {
	display: block;
    position: fixed;
    left: 0;
    right: 0;
    top: -150px;
    visibility: hidden;
    overflow-x: hidden;
    overflow-y: auto;
    z-index: 21;
    width: 300px;
    margin: auto;
    background-color: #fff;
    border: solid 1px #00b0cc;
    border-radius: 5px;
    box-shadow: 0px 4px 10px -7px #000;
	transition: ease all .5s;
}
.sucessAlert.notif_success {
	top:30px;
	visibility: visible;
}
.notif_success p {
	font-size: 19px;
	color:#00b0cc;
	margin: 0;
}
.buttonTryitNow {
	display: flex;
    justify-content: flex-end;
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 3;
    width: 100%;
    background-color: #fff;
}
.tryFree {
	background-color: #22C993;
    color: #fff;
    font-size: 21px;
    font-family: 'Ubuntu-Med';
    line-height: 1;
    border: 0;
    padding: 30px 0;
    min-width: 250px;
}
.total-packages .right-invoice {
	width: 100%;
	padding: 0px 15px 15px;
}
.total-packages .left-invoice {
	width: 100%;
}
.right-invoice .ttl__inv {
	display: none;
}
@media screen and (min-width:1024px) {
	.p-0 {
		padding:0;
	}
	.pt-0 {
		padding-top:0;
	}
	.pb-0 {
		padding-bottom:0;
	}
	.pr-0 {
		padding-right:0;
	}
	.pl-0 {
		padding-left:0;
	}
}
@media screen and (min-width:550px) {
	.total-packages {
		width: 75%;
		float:none;
		margin: auto;
	}
	.total-packages ul li {
		flex: 0 0 100%;
		width: 100%;
	}
	.total-packages ul li .itemName {
		width: 40%;
		padding-right: 20px;
	}
	.total-packages ul li .itemQty {
		width: 30%;
	}
	.total-packages ul li .itemPrc {
		width: 30%;
	}
	.total-packages ul ul {
		padding-right: 0;
	}
	.total-packages ul ul li .itemName {
		width: 38%;
	}
	.total-packages ul ul li .itemPrc {
		width: 32%;
	}
	.pg-planpricing .sumPackages {
		width: auto;
		margin-top:0;
	}
	.val-Qty {
		padding:0em 50px 1em 50px;
		justify-content: center;
	}
	.total-packages {
		float:right;
	}
}

@media screen and (min-width:768px) {
	.form-left {
		width: 65%;
	}
	.form-right {
		width: 35%;
	}
	.val-Qty {
		padding:0;
		justify-content: center;
	}
	.total-packages .totalItem .judul,
	.total-packages .totalItem .sumPrice {
		font-size: 24px;
	}
}
@media screen and (min-width:992px) {
	.form-left {
		width: 65%;
	}
	.form-right {
		width: 35%;
		display: flex;
		justify-content: flex-end;
		min-height: 150px;
	}
	.form-right .val-Qty {
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;
	}
	.form-checked label {
		padding-left: 50px;
		font-size: 30px;
	}
	.packagesTitle .boxGrdn {
		width: 40px;
		height: 40px;
		border-radius: 10px;
		display: block;
	}
	.pg-planpricing .sumPackages {
		text-align: left;
		margin-top: 0;;
	}
	.val-Qty {
		padding:0;
		justify-content: space-between;
	}
	.pg-planpricing {
		padding:0;
	}
	.form-checked label:before {
		top:12px;
	}
	.form-checked input:checked + label:after {
		top:15px;
	}
	.right-invoice .ttl__inv {
		display: block;
	}
	.list__inv {
		max-height: 450px;
		box-shadow: 6px 0px 1px -5px #ddd;
	}
	.total-packages .left-invoice {
		width: 65%;
	}
	.total-packages .right-invoice {
		width: 35%;
	}
	.pg-planpricing {
		padding:0 15px;
	}
	.pg-planpricing .form-left {
		width: 55%;
	}
	.pg-planpricing .form-right {
		width: 45%;
	}
	.pg-planpricing .sumPackages .durationPack {
		text-align: right;
	}
	.detailPackage {
		padding:.5em 0 1em 50px;
	}
	.list_pack {
		grid-template-columns:33.33333% 33.33333% 33.33333%;
	}
	.list_pack.list_pack__cs, .list_pack__cs {
		grid-template-columns: 40% 60%;
	}
	.sub__report .packagesTitle .boxGrdn {
		left:0;
	}
}
.no-data {
	display: block;
    font-family: 'Ubuntu-Reg';
    padding: 1em 0;
	clear: left;
}
.barover::-webkit-scrollbar {
	width: 8px;
	height: 9px;
}

.barover::-webkit-scrollbar-track {
	background: #eae7e7;
	border-radius: 8px;
}

.barover::-webkit-scrollbar-thumb {
	background: #c4c4c4;
	background-clip: padding-box;
	border-radius: 100px;
}
.h330 {
	height: 330px;
    overflow-y: auto;
}
.showpass {
	position: absolute;
    top: 0;
    bottom: 0;
    right: 25px;
    display: flex;
    align-items: center;
    font-size: 18px;
    color: #acacac;
}
.tooltips {
	display: none;
	position: absolute;
	border: 1px solid #333;
	background-color: #000;
	color:#fff;
	border-radius: 5px;
	padding: 5px;
	font-size: 12px;
	max-width: 165px;
	line-height: 1.3;
}
.titleCat {
	font-size: 21px;
    padding: 10px;
    font-family: 'Ubuntu-Med';
    text-transform: uppercase;
}
.grid-2 {
	flex-wrap: wrap;
    display: flex;
    align-content: flex-start;
    justify-content: space-around;
    margin: 0 -15px;
}
.grid-2 > div {
	flex: 0 0 50%;
    padding: 0 15px;
}
.searchBTN {
	cursor: pointer;
	position: absolute;
    right: -30px;
    top: 0;
    bottom: 0;
    margin: auto;
    display: flex;
    align-items: center;
	color:#fff;
}
.nav-light .searchBTN {
	color:#000;
}
.popup-search {
    position: fixed;
    top: 25px;
    left: 0;
    right: 0;
    z-index: 22;
    width: 1000px;
    margin: auto;
	opacity: 0;
	visibility: hidden;
	transition: ease all .5s;
}
.popup-search form {
	width: 400px;
	position: absolute;
	right: -75px;
	top: 0;
	padding:.7em;
	border-radius: 100px;
	background-color: #f5f5f5;
}
.popup-search form input {
	border-radius: 100px;
}
.popup-search form::after {
	bottom: 100%;
	right:25px;
	border: solid transparent;
	content: "";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(136, 183, 213, 0);
	border-bottom-color: #f5f5f5;
	border-width: 10px;
	margin-left: -10px;
}
.popup-search.open {
	opacity: 1;
	visibility: visible;
	top:70px;
}
.artikel .left .w100a .isi img {
	max-width: 100%;
}
.artikel .left .w100a .isi h4 {
	font-weight: bold;
}
.login-form {
	display:flex;
	padding-bottom: 5em;
    width: 100%;
    max-width: 100%;
    align-items: center;
    flex: 0 0 100%;
	flex-wrap: wrap;
}
.login-form form {
	flex:0 0 50%;
}
.upload_id {
	display: flex;
    align-items: center;
    flex-wrap: wrap;
}
.upload_id .action_upload_id {
	display: flex;
    flex: 0 0 200px;
    width: 200px;
    flex-wrap: wrap;
	padding-left: 10px;
}
.upload_id .action_upload_id .click__upload {
	width: 100%;
	background-color: #21C28E;
    border: 0;
    font-family: 'Ubuntu-Med';
    padding: 7px 0;
    border-radius: 8px;
    color: #fff;
	text-align: center;
}
.upload_id .action_upload_id .click__upload.disabled {
	background-color: #999999;
	cursor: no-drop;
}
.upload_id .remove_img_id {
	position: absolute;
    right: -7px;
    padding: 0;
    line-height: 1;
    background-color: red;
    color: #fff;
    border: 0;
    width: 18px;
    height: 18px;
    top: -7px;
    font-size: 11px;
    border-radius: 100%;
    box-shadow: 0px 1px 2px 0px #000;
}
.upload_id .action_upload_id button:focus,
.upload_id .action_upload_id button:active {
	outline: none;
}
.upload_id .action_upload_id .notes {
	font-size: 12px;
    line-height: 1.1;
    font-family: 'Ubuntu-Med';
    margin-top: 5px;
}
.submit-kolom {
	text-align: right;
    display: flex;
    align-items: center;
    justify-content: flex-end;
	margin-top: 3em;
}
.submit-kolom .btn-save-act {
    width: 200px;
	max-width: 100%;
    font-family: 'Ubuntu-Med';
    padding: 7px 12px;
    font-size: 15px;
    border-radius: 8px;
}
.submit-border {
	border-top: solid 1px #7e7e7e;
    padding-top: 25px;
}
.rm-btn-member {
	background-color: #21C28E;
	color:#fff;
	border-radius: 5px;
	font-size: 12px;
	font-family: Ubuntu-Bold;
	padding: 3px 5px;
    line-height: 1;
	position: relative;
    top: -2px;
}
.detail_member_added {
	width: 65%;
	margin-top: 3em;
    max-width: 100%;
}
.detail_member_added .rm-btn-member {
	margin-left:10px;
}
.detail_member_added .result-add {
	width: 100%;
	border: solid 1px #21C28E;
	border-radius: 8px;
	border-collapse: separate;
}
.detail_member_added .result-add tr td {
	border-bottom: solid 1px #21C28E;
	vertical-align: middle;
}
.detail_member_added .result-add tr:last-child td {
	border-bottom:0;
}
.detail_member_added tr td:last-child {
	position: relative;
	padding-left:20px;
}
.detail_member_added tr td:last-child:before {
	content:'';
	position: absolute;
	left:0;
	top:5px;
	bottom:5px;
	width: 2px;
	background-color: #969696;
}
.notes_account_setting {
	float: left;
    text-align: right;
    width: 100%;
    font-family: 'Ubuntu-Med', sans-serif;
    color: #a9a9a9;
    font-size: 12px;
    letter-spacing: .01em;
}
.btn-delete-acc:focus,
.btn-delete-acc:active {
	outline:none;
}
.submit-delete-account {
    display: flex;
    align-items: center;
	margin-top: 3em;
}
.btn-delete-acc {
    background-color: transparent;
    color: #FF0000;
    border: solid 2px #FF0000;
    padding: 7px 12px;
    min-width: 185px;
    text-align: center;
    max-width: 100%;
    font-family: 'Ubuntu-Med', sans-serif;
    border-radius: 7px;
    font-size: 14px;
}
.row .style { border:1px solid #21C28E; height:45px; font-family:Ubuntu-Med; border-radius:10px; font-family:Ubuntu-Med; font-size:14px; }
.row .label { font-family:'Ubuntu-Reg'; font-size:14px; color:#90908f }
.row .kolom {position: relative;}
.text-justify {
	text-align: justify;
}
.btn-disabled {
	background-color: #979797 !important;
}
@media screen and (max-width:860px) {
	.contentbox { display: block; }
	.contentbox .a {margin-bottom: 15px;}
	.contentbox .text-right {text-align: left;}
	.slide-brands .owl-nav button.owl-prev {left: 0;}
	.slide-brands .owl-nav button.owl-next {right: 0;}
	.columns {
		padding-left: 10px;
		padding-right: 10px;
	}
}
@media (min-width: 60px) and (max-width: 1199px) {
	body { 
	background:#fff; 
	margin: 0;
	font-family: OSReg;
	padding: 0;
	overflow-y:scroll;
	overflow-x: hidden;
	width:100%;
	}
	.menumobil{display:block}
	.menuutama{ display:none }

	/****************BARUUUUUUUUU***/
	.bgopg { background:#fff; }
	.bghome { background:#fff; }
	.pgwidth { width:100%; float:left}
	.modalmember { width:100%; margin:0 auto; position:relative; }
	.modalmember .box { width:100%; float:left; background:#fff; border-radius:15px; padding:30px; margin-top:15% }
	.head { width:100%; float:left; position:relative; }
	.menuopg { background:#fff; width:100%; float:left; border-bottom:2px solid #ccc; padding:10px;}
	.menuopg .pgwidth {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.menuopg .pgwidth .divlogo {padding:0;}
	.logomm { width:150px;}
	.menusec { width:auto; float:right; padding:15px 0; }
	.menusec .opgstyle { width:auto; float:left; margin:0 10px 0 10px; color:#000; padding:10px; font-family:Ubuntu-Reg; font-size:14px; }
		.menusec .colorpghome { color:#fff; }
		.menusec .colorpgothers { color:#000; }
		.menusec .line { width:1px; float:left; height:40px; margin:0 10px 0 10px; background:#ccc; }
		.menusec .lang { width:auto; float:left; padding:10px 0; margin:0 0 0 10px; cursor:pointer }

	.mobilebtn { border:1px solid #28C98D; padding:5px 10px 5px 10px; border-radius:3px; background:#fff }
	.mobileicon { color:#28C98D; font-size:16px }
	.mobilebox { 
		width:100%; 
		min-height:100%; 
		text-align:center; 
		position:fixed; 
		left:0; 
		top:0; 
		z-index:3; 
		padding:10px; 
		display: none;
		visibility: hidden;
	}
	.mobilebox.in {
		visibility: visible;
	} 
	.bgOpenMenu {
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		background-color: rgba(0, 0, 0,  .45);
		z-index: -1;
	}
	.mobilebox2 { padding:10px; border-radius:15px; width:100%; float:left; background:#28C98D }
	.mobilestyle { width:100%; padding:10px; float:left; color:#fff; background:#28C98D; font-size:16px; font-family:'Ubuntu', sans-serif; font-weight: 700; border-bottom:1px solid #fff; margin-bottom:20px; }
	.mobilestyle2 { width:100%; padding:10px; float:left; color:#fff; background:#28C98D; font-size:16px; font-family:'Ubuntu', sans-serif; font-weight: 700; }
	.mobilelang { width:100%; background:#28C98D; float:left; padding:10px; cursor:pointer }
	
	


	.pagestyle { background:#23c993; width:100%; float:left; padding:20px; }
	.pagetitle { font-size:20px; font-family:'Ubuntu', sans-serif; font-weight: 700; color:#fff; }
	.pagetitle p { font-size:10px; font-family:Ubuntu-Reg; color:#fff; }
	
	
	.body { width:100%; float:left; padding:20px;}
	.body .div-shadow { width:100%; margin:0 auto; background:#fff; padding:20px; }

	.row .f100 { width:100%; float:left; }
	.row .f50 { width:100%; float:left; padding:10px; position:relative }
	.row .f50 .left { color:#d7d7d7; width:auto; float:left; padding-left:10px; font-family:Ubuntu-Med; font-size:12px }
	.row .f50 .right { color:#d7d7d7; width:auto; float:right; padding-right:10px; font-family:Ubuntu-Med; font-size:12px }
	.row .btnkolom { padding:40px 15px 20px 15px; width:100%; float:left; }
	.row .btnkolomodals { padding:15px; width:100%; float:left; }
	.btnorange { border-radius:50px; background:#FC0; float:left; font-family:Ubuntu-Reg; padding:12px; border:0; color:#000; width:100%; font-size:14px; margin-bottom:20px; }
	.btngrey { border-radius:50px; background:#e1e1e1; float:right; font-family:Ubuntu-Reg; padding:12px; border:0; color:#000; width:100%; font-size:14px; }
	.btngrey2 { border-radius:50px; background:#e1e1e1; float:left; font-family:Ubuntu-Reg; padding:12px; border:0; color:#000; width:100%; font-size:14px; }
	.row .asc1 { padding:15px; width:100%; float:left }
	.row .asc2 { padding:0 15px; width:100%; float:left; font-family:Ubuntu-Med; font-size:14px }
	.row .asc3 { padding:15px; width:100%; float:left; }
	.row .teks { font-family:Ubuntu-Med; font-size:14px; color:#252525 }
	
	.row .label2 { padding:20px 0 20px 8px; width:auto; float:left; text-align:left }
	.row .btngreen { border-radius:50px; text-align:center; color:#000; text-decoration:none; background:#21C28E; padding:12px; font-family:Ubuntu-Reg; float:right; border:0; width:100%; font-size:14px }
	.row .kolom { width:100%; float:left; padding:5px}
	.row .selectParent{ width:100%; overflow:hidden; }
	.row .selectParent select{ text-indent: 1px; text-overflow: ''; width: 100%; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: transparent url(../img/arrow-btn.png) no-repeat 95% center; }

	

	/***************ANALYTIC PAGE*****/
	.anapg { width:100%; float:left; padding:15px; margin-top:0px; }
	.anapg .title { font-family:'Manjari', sans-serif; font-weight: 700; font-size:20px; margin-top:0px; }
	.anapg .kolom1 { width:100%; float:left; padding:0 }
	.anapg .kolom1 p, .anapg .kolom1 li { font-family:Ubuntu-Reg; font-size:14px;}
	.anapg .kolom2 { width:100%; float:left; }
	.anapg .kolom3 { width:100%; float:left; padding:0; position:relative }
	.anapg .kolom3 .title { font-family:'Manjari', sans-serif; font-weight: 700; font-size:18px; margin:20px 0 10px 0; }

	.anapg .kolom3 .tbl { width:auto; position:absolute; z-index:1; left:40%; top:37%; cursor:pointer }
	.anapg .kolom3 .img { width:100%; float:left; overflow:hidden; height:250px; position:relative; }
	.anapg .kolom3 .gbr { border-radius:10px; width:100%; }
	.anapg .pemisah { width:100%; float:left; margin-top:10px; margin-bottom:20px; border-top:2px solid #ccc; }
	.anapg .kolom4 { width:100%; float:left; margin-bottom:15px; }
	.anapg .kolom4 .title { font-family:Ubuntu-Reg; font-size:16px }
	.anapg .kolom5 { width:100%; float:left; border-radius:0 10px 10px 0;
	background: -moz-linear-gradient(left,  #fff 0%, #fff 90%, #fff 10%, #fff 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#fff), color-stop(90%,#fff), color-stop(5010,#fff), color-stop(100%,#fff));
    background: -webkit-linear-gradient(left,  #fff 0%,#fff 90%,#fff 10%,#fff 100%);
    background: -o-linear-gradient(left,  #fff 0%,#fff 90%,#fff 10%,#fff 100%);
    background: -ms-linear-gradient(left,  #fff 0%,#fff 90%,#fff 10%,#fff 100%);
    background: linear-gradient(to right,  #fff 0%,#fff 90%,#fff 10%,#fff 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#fff',GradientType=1 );
	}
	.anapg .kolom6 { width:100%; float:left; padding-right:5px; margin-bottom:10px; }
	.anapg .kolom6 .left { width:35%; border-radius:10px 0 0 10px; overflow:hidden; height:100px; float:left; }
	.anapg .kolom6 .left .gbr { width:100%; height:100px; border-radius:10px 0 0 10px; float:left; }
	.anapg .kolom6 .right { width:65%; height:100px; float:left; background:#eee; padding:5px; border-radius:0 10px 10px 0; font-size:14px; padding:10px; font-family:'Manjari', sans-serif; font-weight: 700; white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word; }
	.anapg .coulumn { width:100%; float:left; }
	.anapg .kolom7 { width:100%; float:left; margin-top:15px; text-align:right }
	.anapg .kolom7 .jarak { margin-right:10px }
	


	/************foot style ***********/
	.footi { width:100%; float:left; border-top:2px solid #ccc; padding:20px; background:#21C28E; margin-top:50px; text-align:center; }
	.footi .title { color:#fff; font-family:OSReg; font-size:18px}
	.footi .tombol { border-radius:50px; background:#fff; font-family:Ubuntu-Med; padding:14px; border:0; color:#000; width:50%; font-size:16px; margin-top:20px; margin-bottom:10px; }

	.foot { width:100%; float:left; border-top:2px solid #ccc; padding:10px; background:#f4f4f4; margin-top:50px; }
	.foot .kolom1 { width:100%; float:left; padding:10px; }
	.foot .kolom2 { width:100%; float:left; padding:10px }
	.foot .kolom3 { width:100%; float:left; padding:10px; }
	.foot .w50mb { width:50%; }
	.foot .kolom1 button, .foot .kolom2 button {padding:0;}
	.foot .hideMob {display: none;}
	.foot .title { font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:18px; color:#252525; margin-top:10px; }
	.foot .teks { font-family:Ubuntu-Reg; font-size:12px; color:#252525; margin-top:10px; }
	.foot .menu { font-family:Ubuntu-Reg; font-size:12px; color:#252525; background:transparent; margin-bottom:10px; text-align:left; border:0; width:100%;display: block; }

	.footcopyrite { width:100%; background:#f4f4f4; border-top:2px solid #ccc; float:left; margin-top:0; padding:20px; font-size:12px; font-family:Ubuntu-Reg; }
	.footcopyrite .copyrite { font-size:12px; font-family:Ubuntu-Reg; }


	.body .div-shadow2 { width:100%; margin:0 auto; background:#fff; }
	.div-shadow2 .asc1 { width:100%; text-align:center; padding:20px; float:left }
	.div-shadow2 .asc1a { width:100%; text-align:center; padding:0 20px; float:left }
	.div-shadow2 .asc1a .gbr { width:100% }
	.div-shadow2 .asc1 .gbr { width:100% }
	.div-shadow2 .asc2 { width:100%; float:left }
	.div-shadow2 .asc2 .f100 { width:100%; float:left; }
	.div-shadow2 .asc2 .f50 { width:100%; float:left; padding:20px; position:relative }
	.div-shadow2 .asc2 .btnkolom { padding:30px 30px 40px 30px; width:100%; float:left; }
	.div-shadow2 .asc2 .label { font-family:Ubuntu-Med; font-size:14px; color:#acacac }
	.div-shadow2 .asc2 .f50 .left { color:#d7d7d7; width:auto; float:left; padding-left:30px; font-family:Ubuntu-Med; font-size:12px }
	.div-shadow2 .asc2 .f50 .right { color:#d7d7d7; width:auto; float:right; padding-right:30px; font-family:Ubuntu-Med; font-size:12px }
	.div-shadow2 .asc2 .kolom { width:100%; float:left; padding:5px }
	.div-shadow2 .asc2 .style { border:2px solid #21C28E; height:45px; font-family:Ubuntu-Med; border-radius:30px; font-family:Ubuntu-Med; font-size:14px; }
	.div-shadow2 .asc2 .logo { width:100%; text-align:center; float:left; padding-left:30px; margin-bottom:35px; margin-top:50px; }
	.div-shadow2 .asc2 .title { width:100%; text-align:center; float:left; padding-left:30px; margin-bottom:15px; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:24px }
	.div-shadow2 .asc2 .isi { width:100%; text-align:center; color:#ccc; padding-left:30px; float:left; margin-top:1px; padding-right:20px; font-family:Ubuntu-Med; font-size:14px }

	.packagecontent { width:50%; float:left; }
	.packagecontent .title { width:100%; color:#999; float:left; font-size:14px; font-family:Ubuntu-Reg; margin-bottom:10px; }
	.packagecontent .title2 { color:#000; font-size:16px; font-weight:bold }
	.packagecontent .title3 { width:100%; color:#999; float:left; font-size:14px; font-family:Ubuntu-Reg; margin-bottom:10px; }
	.body .pgwidth .f100 { width:100%; float:left }
	
	.tablesec { width:100%; float:left; padding:15px }
	
	
	.tablebox { width:100%; border:0; display:none }
	.tablepp { width:100%; border:0; display:none }
	/* .boxpp { width:100%; float:left; padding:10px; } */
	.plnpricing {
		white-space: nowrap;
		overflow-x: scroll;
		overflow-y: hidden;
	}
	.boxpp {
		width: 315px;
		display: inline-block;
		margin: 0 .5em;
		padding: 1em 0;
		vertical-align: top;
		white-space: normal;
	}
	.boxpp .boxppborder { width:100%; float:left; border-radius:37px; border:2px solid #22C993; padding:15px; }
	.boxpp .title { width:100%; float:left; text-align:center; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:20px; }
	.boxpp .content { width:100%; float:left; text-align:center; font-family:Ubuntu-Reg; font-size:14px;height: 80px; color:#22C993; padding:5px; }
	.boxpp .tombol { border-radius:50px; font-family:Ubuntu-Reg; color:#000; background:#FC0; float:left; padding:12px; border:0; width:100%; font-size:18px; margin-top:20px; }
	.boxpp .left { width:50%; float:left; }
	.boxpp .right { width:50%; text-align:left; float:right; }
	.boxpp .m20 { margin-top:20px }
	.boxpp .m10 { margin-top:10px }
	.boxpp .textblack { width:auto; float:left; color:#000; font-family:Ubuntu-Med; font-size:14px; }
	.boxpp .icon { width:auto; float:left; padding-top:2px; font-size:18px; color:#22c993}
	.boxpp .textgreen { width:100%; float:left; color:#22c993; font-family:Ubuntu-Med; font-size:16px; padding:0 4px 0; }
	.boxpp .price { width:100%; float:left; text-align:center; font-family:Ubuntu-Med; font-size:18px;min-height: 45px; }
	.boxpp .price .value { font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:30px; }
	
	.tablepp .tr1 { text-align:center; color:#fff; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:14px; }
	.tablepp .tdblank { width:auto; background:#FAFAFA; border:1px solid #999; padding:20px; }
	.tablepp .tdtitle1 { width:auto; background:#24CB97; border:1px solid #999;  padding:20px; }
	.tablepp .tdtitle2 { width:auto; background:#1AB999; border:1px solid #999; padding:20px; }
	.tablepp .tdtitle3 { width:auto; background:#0FA49E; border:1px solid #999; padding:20px; }
	.tablepp .tdtitle4 { width:auto; background:#0591A2; border:1px solid #999; padding:20px; }
	.tablepp .tr2 { text-align:center; color:#999; font-family:Ubuntu-Reg; font-size:12px }
	.tablepp .td1 { width:auto; padding:10px;border:1px solid #999; }
	.tablepp .td1 p { font-size:18px; color:#000; }
	.tablepp .lineo { height:5px; background:#FC0; border:1px solid #FC0 }
	.tablepp .tr3 { text-align:center; color:#999; font-family:Ubuntu-Reg; font-size:14px }
	.tablepp .title { width:auto; background:#FAFAFA; padding:10px; text-align:left; border:1px solid #999; }
	.tablepp .td2 { width:auto; padding:10px; border:1px solid #999; }
	.tablepp .td2 p { font-size:12px; color:#999 }
	.tablepp .judul{ padding:10px; font-weight:bold; background:#FAFAFA; border:1px solid #999; font-family:Ubuntu-Reg; font-size:14px }
	.tablepp .icon { color:#47C11B; font-size:18px; }
	.tablepp .tr4 { text-align:center; color:#999; font-family:Ubuntu-Reg; font-size:14px }
	.tablepp .tr4 { text-align:center; color:#999; font-family:Ubuntu-Reg; font-size:14px }
	.tablepp .td3 { width:auto; padding:10px; border:1px solid #999; }
	.tablepp .tombol { background:#00D398; width:100%; color:#fff; }

	.w100 { width:100%; float:left; }
	
	.w50 { width:100%; float:left; position:relative; padding:0 15px; }
	.w50 .w100 { width:100%; float:left; margin-left:0; }
	.w50 .w100g { width:100%; float:left; margin-left:0; }
	.w50 .bottom { width:100%; float:left; position:relative; margin-left:0; height:90px; background:#E8C400; padding:20px; border-radius:0 0 10px 10px; margin-bottom:20px; }
	.w50 .bottom p { width:auto; position:absolute; color:#000; top:25px; left:30px; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:16px }
	.w50 .bottom .tombol { width:60px; height:59px; position:absolute; top:10px; right:20px; background:url(../img/tbl-orange.png) center center no-repeat; background-size:contain; border:0 }

	.w50 .bottomg { width:100%; float:left; position:relative; margin-left:0; height:90px; background:#DEDEDE; padding:20px; border-radius:0 0 10px 10px; margin-bottom:20px; }
	.w50 .bottomg p { width:auto; position:absolute; color:#000; top:25px; left:30px; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:16px }
	.w50 .bottomg .tombol { width:60px; height:59px; position:absolute; top:10px; right:20px; background:url(../img/tbl-grey.png) center center no-repeat; background-size:contain; border:0 }

	.w50 .title { width:100%; float:left; color:#000; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:18px; padding:10px; }
	.w50 .orange { width:100%; float:left; background:#F4D000; padding:20px; margin:0; border-radius:10px 10px 0 0; }
	.w50 .orange .isi { width:100%; float:left; height:75px; overflow:hidden; margin:10px 0 10px 0; padding:10px; border-radius:10px; background:#FFDD00; font-family:Ubuntu-Med }
	
	
	.w50 .grey { width:100%; float:left; background:#EDEDED; margin:0; padding:20px; border-radius:10px 10px 0 0; }
	.w50 .grey .isi { width:100%; float:left; height:75px; overflow:hidden; margin:10px 0 10px 0; padding:10px; border-radius:10px; background:#F8F8F8; font-family:Ubuntu-Med }

	.profile { width:100%; float:left; padding:10px }
	.profile .label { font-family:Ubuntu-Med; font-size:18px; color:#252525; margin-bottom:10px; width:100%; float:left; text-align:left; }

	.div-profil .profile .label { font-family:Ubuntu-Med; font-size:18px; color:#252525; margin-bottom:0px; width:100%; float:left; text-align:left; }
	.div-profil .profile { width:100%; float:left; margin-top:10px; padding:0 10px 0 10px; }

	.profile .left { border:2px solid #21C28E; height:45px; font-family:Ubuntu-Med; border-radius:30px; font-family:Ubuntu-Med; font-size:14px; width:100%; float:left; margin-bottom:20px; }
	.profile .selectParent { width:100%; float:left; overflow:hidden; }
	.profile .selectParent select{ text-indent: 1px; text-overflow: ''; width: 100%; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: transparent url(../img/arrow-btn.png) no-repeat 95% center; }

	.profile .right { border:2px solid #21C28E; height:45px; font-family:Ubuntu-Med; border-radius:30px; font-family:Ubuntu-Med; font-size:14px; width:100%; margin-bottom:50px; float:left; }

	.profile .btn { border-radius:50px; background:#FC0; float:left; font-family:Ubuntu-Reg; padding:12px; border:0; color:#000; width:100%; float:left; font-size:14px; }

	.profilebox { width:100%; float:left; padding:20px; margin-top:20px; margin-bottom:10px; }
	.profilebox .img { width:100%; height:250px; float:left; border-radius:20px; overflow:hidden; }
	.profilebox .box { width:100%; padding:0px; margin-top:10px; float:left }
	.profilebox .box .title { width:100%; padding:3px; float:left; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:18px }
	.profilebox .box .box { width:100%; padding:3px; float:left; color:#ccc; font-family:Ubuntu-Reg; font-size:14px }
	.profilebox .box .isi { width:100%; padding:3px; float:left; font-family:Ubuntu-Reg; font-size:16px }
	.profilebox .tblbox { width:100%; margin-top:20px; margin-bottom:20px; float:right }
	.profilebox .tblbox .orange { border-radius:50px; font-family:Ubuntu-Reg; color:#000; background:#FC0; float:left; padding:12px; border:0; width:100%; }
	.profilebox .tblbox .grey { border-radius:50px; font-family:Ubuntu-Reg; color:#000; background:#ddd; margin-top:10px; float:left; padding:12px; border:0; width:100%; }
	.profilebox .pemisah { width:100%; float:left; margin-top:30px; border-bottom:2px solid #ccc; height:1px }

	.ppost { width:33.3%; float:left }
	.pfollower { width:33.3%; float:left }
	.pfollowing { width:33.3%; float:left }

	.profilebox .img .gbr { border-radius:20px; width:100% }
	.body .div-profil { width:100%; margin:0 auto; background:#fff; padding:0px; margin-bottom:20px }
	.body .div-profil2 { width:100%; margin:0 auto; background:#fff; padding:0 15px 0 15px; margin-bottom:20px }
	/*
	.body .div-profil2 { width:100%; margin:0 auto; background:#fff; padding:0 15px 0 15px; box-shadow: 0px 0px 14px #ccc; border-radius:20px; margin-bottom:20px }
	*/
	.div-profil2 .box { width:100%; float:left; margin-bottom:0px; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:20px; padding:20px; box-shadow: 0px 0px 14px #ccc; border-radius:20px; position:relative; }
	.div-profil2 .box .top { width:auto; float:right }
	.div-profil2 .box .down { width:auto; float:right }
	.div-profil2 .title { width:auto; float:left; color:#999 }
	.div-profil2 .iconcolor { color:#999 }
	.div-profil2 .itembox { padding:0; margin-top:5px; }
	.div-profil2 .w50l { margin-bottom:20px; padding:20px; width:100%; float:left; }
	.div-profil2 .w50r { margin-bottom:20px; padding:20px; width:100%; float:left; }
	.div-profil2 .judul { width:100%; float:left; font-family:OSBold; font-size:14px; color:#767676 }
	.div-profil2 .judul { width:100%; float:left; font-family:OSBold; font-size:14px; color:#767676 }
	.w50l .asc { width:100%; float:left; border-bottom:1px solid #ddd; padding:10px; position:relative; font-size:14px;font-family:Ubuntu-Med }
	.w50l .asc .ascl { width:auto; float:left }
	.w50l .asc .ascr { width:auto; float:right }
	.w50r .asc { width:100%; float:left; border-bottom:1px solid #ddd; padding:10px; position:relative; font-size:14px;font-family:Ubuntu-Med }
	.w50r .asc .ascl { width:auto; float:left }
	.w50r .asc .ascr { width:auto; float:right }
	.post { margin-bottom:20px; padding:10px }
	.post .boxkolom { width:100%; float:left; border:2px solid #28C98D; border-radius:20px; position:relative; height:600px; }
	.post .boxkolom .img { width:100%; height:220px; overflow:hidden; border-radius:20px; float:left }
	.post .boxkolom .img .gbr { width:100%; border-radius:20px; }
	.post .boxkolom .tanggal { width:100%; padding:10px; font-family:Ubuntu-Med; font-size:14px; color:#777; float:left }
	.post .boxkolom .isi { width:100%; padding:10px; font-family:Ubuntu-Med; font-size:16px; color:#000; float:left }
	.post .boxkolom .isi a { width:100%; text-align:center; margin-top:10px; font-family:Ubuntu-Med; font-size:14px; color:#28C98D; float:left }
	.post .boxkolom .boxinfo { width:100%; padding:0 10px; position:absolute; bottom:10px; float:left; }
	.post .boxkolom .boxinfo .boxinfo { width:100%; float:left; position:relative; border-bottom:2px solid #ccc; border-top:2px solid #ccc }
	.post .boxkolom .boxinfo .boxinfo .liner { width:50%; float:left; padding:20px; border-right:2px solid #ccc; text-align:center }
	.post .boxkolom .boxinfo .boxinfo .liner .no { width:100%; float:left; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:20px }
	.post .boxkolom .boxinfo .boxinfo .liner .info { width:100%; float:left; color:#ccc; font-family:Ubuntu-Med; font-size:14px }
	.post .boxkolom .boxinfo .boxinfo .linel { width:50%; float:left; padding:20px; text-align:center }
	.post .boxkolom .boxinfo .boxinfo .linel .no { width:100%; float:left; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:20px }
	.post .boxkolom .boxinfo .boxinfo .linel .info { width:100%; float:left; color:#ccc; font-family:Ubuntu-Med; font-size:14px }
	.post .boxkolom .boxinfo .boxinfo2 { width:100%; float:left; margin-bottom:30px; }
	.post .boxkolom .boxinfo .boxinfo2 .no { width:auto; float:right; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:20px }
	.post .boxkolom .boxinfo .boxinfo2 .info { width:auto; float:left; color:#ccc; font-family:Ubuntu-Med; font-size:14px }

	.profileboxact { width:100%; float:left; padding:10px; }
	.profileboxact .w25 { width:50%; float:left; padding:10px; }
	.profileboxact .w25 .box { width:100%; float:left; border-radius:20px; border:2px solid #28C98D; padding:15px; text-align:center;}
	.profileboxact .w25 .box .title { color:#ccc; font-size:16px; font-family:Ubuntu-Reg }
	.profileboxact .w25 .box p { color:#000; font-size:24px; font-family:Ubuntu-Bold }
	

	.artikel { width:100%; float:left; padding:0 10px; }
	.artikel .left { width:100%; float:left; }
	.artikel .left .w100 { width:100%; float:left; padding:0 10px; }

	.artikel .left .w100b { width:100%; float:left; padding:0; }
	.artikel .left .w100b .title { width:100%; float:left; font-size:18px; padding:0px 20px; font-family:Manjari-Bold }
	.artikel .left .w100b .kolom { width:100%; float:left; margin-top:15px; text-align:right }
	.artikel .left .w100b .kolom .jarak { margin-right:10px }
	.artikel .left .w100b .pemisah { width:90%; margin:20px 20px 20px 20px; border-top:2px solid #ccc; float:left; }
	.artikel .left .w100b .coulumn { width:100%; float:left; padding:0 7px; }
	.artikel .left .w100b .coulumn .box50 .box .boxartcontentstyle { width:100%; float:left; font-size:12px; padding:10px; font-family:'Manjari', sans-serif; font-weight: 700; white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word; }
	
	.boxartotherimg { width:25%; height:70px; float:left; overflow:hidden; border-radius:10px 0 0 10px }
	.boxartothergbr { width:100%; height:70px; float:left; overflow:hidden; border-radius:10px 0 0 10px }
	.boxartcontent { width:75%; height:70px; float:left; position:relative; display: flex;align-items: center; color:#000;background-color: #f4f4f4;}
	.boxartcontentstyle { width:100%; float:left; font-size:14px; padding:10px; font-family:Manjari-Bold }

	
	.artikel .left .w100b .box50 { width:100%; margin-top:10px; float:left; }
	.artikel .left .w100b .box50 .box { width:100%; float:left; background:#f4f4f4; border-radius:10px; margin-bottom:20px }

	.artikel .right .w100b { width:100%; margin-top:20px; padding:10px 0 10px 10px; float:left }
	.artikel .right .w100b .title { width:100%; padding-bottom:20px; float:left; font-family:'Manjari', sans-serif; font-weight: 700; font-size:18px }
	.artikel .left .w100a { width:100%; float:left; margin-top:0px; padding:0 10px; }
	.artikel .left .w100a .title { width:100%; float:left; font-size:24px; padding:10px; font-family:Manjari-Bold }
	.artikel .left .w100a .tanggal { width:100%; float:left; font-size:14px; padding:0 10px; font-family:Manjari-Bold }
	.artikel .left .w100a .box { width:100%; float:left; padding:10px; }
	.artikel .left .w100a .box .img { width:100%; float:left; border-radius:10px }
	.artikel .left .w100a .isi { width:100%; float:left; font-size:14px; padding:10px; font-family:Ubuntu-Reg }
	.artikel .left .w100a .isi img { max-width: 100%; }
	.artikel .left .w100a .isi h6 { color: rgba(51, 51, 51, 0.5); font-weight: 100; line-height: 1.3; }
	.artikel .left .w50 { width:100%; float:left; padding:10px; color:#545454}
	.artikel .left .w50 > .box {box-shadow: 0px 1px 10px -6px #8d8d8d;}
	.artikel .left .w50 .box { width:100%; float:left; background:#f4f4f4; border-radius:10px; margin-bottom:20px }
	.artikel .left .w50 .box .img { width:100%; height:250px; float:left; overflow:hidden; border-radius:10px 10px 0 0;position: relative;background: #fff; }
	.artikel .left .w50 .box .img .gbr { width:100%;position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; }
	.artikel .left .w50 .box .box { width:100%; height:200px; float:left; position:relative }
	.artikel .left .w50 .box .box .title { width:100%; float:left; font-size:17px; padding:10px; font-family:Manjari-Bold; line-height: 1.2; }
	.artikel .left .w50 .box .box .content { width:100%; float:left; font-size:14px; padding:10px; font-family:Ubuntu-Reg; line-height: 1.2; }
	.artikel .left .w50 .box .box .tanggal { width:100%; padding:10px; font-family:'Manjari', sans-serif; font-weight: 700; font-size:14px; margin-top:15px; display: inline-block; }

	.artikel .right { width:100%; float:left }
	.artikel .right .w100 { width:100%; padding:10px 0 10px 10px; float:left }


	.mt { margin-top:0; }
	
	.login-form form {flex:0 0 100%;width:100%;}
	.div-shadow2 .logo { width:100%; float:left; text-align:center; padding:30px; display:none }
	.div-shadow2 .asc1log { width:100%; text-align:center; padding:10px; float:left; margin-bottom:0; }
	.div-shadow2 .asc1log .gbr { width:100% }
	.div-shadow2 .asc2log { width:100%; text-align:center; padding:0; float:left; }
	.div-shadow2 .asc2log .title { font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:24px; color:#252525; margin-top:20px; }
	.div-shadow2 .asc2log .f100A { width:100%; float:left; text-align:left; padding:0 10px 0 10px; text-align:center; }
	.div-shadow2 .asc2log .f100 { width:100%; float:left; text-align:left; padding:10px; text-align:center; }
	.div-shadow2 .asc2log .f100 .style { border:2px solid #21C28E; height:45px; font-family:Ubuntu-Med; border-radius:30px; font-family:Ubuntu-Med; font-size:14px; }
	.div-shadow2 .asc2log .f100A .btnorange { border-radius:50px; background:#FC0; float:left; font-family:Ubuntu-Reg; padding:12px; border:0; color:#000; width:100%; font-size:14px; margin-top:20px; margin-bottom:10px; }
	.div-shadow2 .asc2log .f100 .left { color:#d7d7d7; width:auto; float:left; font-family:Ubuntu-Reg; font-size:13px; }
	.div-shadow2 .asc2log .f100 .right { color:#d7d7d7; width:auto; float:right; font-family:Ubuntu-Reg; font-size:13px }
	.div-shadow2 .asc2log .f100A .info { color:#d7d7d7; width:100%; text-align:center; float:left; font-family:Ubuntu-Med; font-size:14px }
	.div-shadow2 .asc2log .f100A .info .url { color:#21C28E; }


/***********home******/
	
	.header { background:#fff; width:100%; float:left; border-bottom:2px solid #ccc; padding:10px; }
	.headmenu { 
		width:100%; margin:0 auto;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 10px;
	}
	.logomm { width:170px;}
	.divmenu { width:auto; float:right; padding:15px 100px 0 0; color:#000; font-size:14px; font-family:Ubuntu-Reg }
	.pagetitle { width:100%; background:#21C28E; text-transform:capitalize; color:#fff; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:28px; float:left; padding:25px;display: flex; height: 120px; align-items: center;}
	.ptcontent { width:100%; float:left; font-size:10px; font-family:Ubuntu-Reg }
	.bodysection { width:100%; font-family:Ubuntu-Reg; padding:20px; font-size:14px; color:#555; float:left }
	.divbody { 
	width:100%; margin:0 auto; padding:10px;
	}
	.divbody-shadow { 
	width:100%; margin:0 auto; background:#fff; padding:10px; box-shadow: 0px 0px 14px #ccc; border-radius:15px;
	}
	.divbody-1000 { 
	width:100%; margin:0 auto; background:#fff;
	}	

	.priceorangesec { width:100%; float:left; background:#F4D000; padding:10px; border-radius:10px 10px 0 0; }
	.pricegreysec { width:100%; float:left; background:#EDEDED; padding:10px; border-radius:10px 10px 0 0 }
	.pricetitle { width:100%; float:left; color:#000; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:16px; padding:10px; }
	.pocontent { width:100%; float:left; height:75px; overflow:hidden; margin:10px 0 10px 0; padding:10px; border-radius:10px; background:#FFDD00; font-family:Ubuntu-Med }
	.pgcontent { width:100%; float:left; height:75px; overflow:hidden; margin:10px 0 10px 0; padding:10px; border-radius:10px; background:#F8F8F8; font-family:Ubuntu-Med }
	
	.footsec { width:100%; float:left; border-top:2px solid #ccc; padding:10px; background:#f4f4f4 }
	.foottitle { width:100%; float:left; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:18px }
	.footcontent { width:100%; float:left; margin-top:10px; font-size:12px; font-family:Ubuntu-Reg}
	.footcopyrite { width:100%; background:#f4f4f4; border-top:2px solid #ccc; float:left; padding:25px; font-size:12px; font-family:Ubuntu-Reg}

	.modalmember { width:100%; margin:0 auto; position:relative; }
	.modaldemo { width:100%; margin:0 auto; position:relative; }
	.modalvideo { width:100%; margin:0 auto; position:relative; }
	.selectP { border:2px solid #21C28E; width:50%; float:left; border-radius:30px 0 0 30px; font-family:'Ubuntu', sans-serif; font-weight: 700; height:45px; font-size:12pt; }
	.inputP { border:2px solid #21C28E; width:50%; float:left; border-radius:0 30px 30px 0px; padding:20px; font-family:'Ubuntu', sans-serif; font-weight: 700; height:45px; font-size:12pt; }
	.tombolP { border-radius:50px; background:#FC0; margin-top:10px; float:left; padding:12pt; font-family:Ubuntu-Reg; border:0; width:100%;color:#000 }
	.profilimg { width:100%; float:left; border-radius:20px; overflow:hidden; }
	.profilbox { width:100%; padding:0 0 0 0; float:left }
	.ppost { width:33%; float:left }
	.pfollower { width:33%; float:left }
	.pfollowing { width:33%; float:left }
	.profilboxtbl { width:100%; float:left; margin-top:10px; }
	.postImgprofil { width:100%; height:200px; overflow:hidden; border-radius:20px; float:left }
	.chpassbox { width:100%; float:left; text-align:center; position:relativel; }
	.chpasscontent { width:100%; float:left; padding:20px; }
	.chpassImg { float:left; width:100%; text-align:center; padding:20px; }

	.homeHead { position:relative;z-index: 5; }
	.headHome { position:relative; width:100%; height:300px; float:left }
	.homeBoxMenu { background-color:rgba(0,0,0,0.1); position:fixed; top:0; z-index:3; width:100%; float:left;}
	.homeBGimg { width:100%; left: 0; right: 0; margin-left: auto; margin-right: auto; height:300px; overflow:hidden;  background:url(../img/bg-head.png) top center no-repeat; background-size:cover; top:0; position:absolute; z-index:2; background-repeat: no-repeat; }
	.bannerHome {position:absolute;left:50%; top:25%;z-index:1; width:50%;color:#fff}
	.bannerHome .h2 p {font-family:Rubik;font-size:12px;font-weight: 800;}
	.bannerHome p {font-family:OSSemiBold;font-size:10px;font-weight: 800;font-size:14px;}
		.bannertitle { font-family:Rubik; position:absolute; color:#fff; font-size:12px; left:50%; top:25%; z-index:1; width:50%; font-weight:bolder}
		.bannercontent { font-family:OSSemiBold; position:absolute; color:#fff; font-size:10px; left:50%; top:42%; z-index:1; width:50%; }
	.homeBGColor { width:100%; float:left; position:absolute; z-index:1; height:auto; top:0; background: -moz-linear-gradient(left,  #02ADBF 0%, #02ADBF 50%, #21C48F 50%, #21C48F 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#02ADBF), color-stop(50%,#02ADBF), color-stop(50%,#21C48F), color-stop(100%,#21C48F));
    background: -webkit-linear-gradient(left,  #02ADBF 0%,#02ADBF 50%,#21C48F 50%,#21C48F 100%);
    background: -o-linear-gradient(left,  #02ADBF 0%,#02ADBF 50%,#21C48F 50%,#21C48F 100%);
    background: -ms-linear-gradient(left,  #02ADBF 0%,#02ADBF 50%,#21C48F 50%,#21C48F 100%);
    background: linear-gradient(to right,  #02ADBF 0%,#02ADBF 50%,#21C48F 50%,#21C48F 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#02ADBF', endColorstr='#21C48F',GradientType=1 );
	display:none;
	}
	.TblDemo { position:fixed; top:50vh; right:0px; border:0; z-index:3; background:transparent; }
	.TblBG { width:70px; }
	.TblMore { border-radius:50px; background:#FC0; margin-top:20px; padding:12px; border:0; width:100%; font-family:OSBold;display: block; text-align: center;color: #272727; }
	.homeContent { width:100%; float:left; margin-top:300px}
	/* .contentbox { width:100%; float:left; padding:10px; } */
	.packagecontent { width:100%; float:left; padding:0 20px; }
	
	.paddr50 { padding-right:0px }
	.boldtitle { font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:18px }
	.footcoloumn { width:100%; padding:10px; float:left; margin-top:10px; font-size:14px; font-family:Ubuntu-Reg }
	.footcoloumn2 { padding:10; width:50%; float:left; margin-top:10px; font-size:14px; font-family:Ubuntu-Reg }
	

	.footmenustyle { background:transparent; margin-bottom:10px; text-align:left; border:0; width:100%; }
	.formlabel { width:100%; float:left; color:#ccc; font-size:15pt; font-family:Ubuntu-Med; margin-bottom:5px; margin-top:10px; }
	.formlabel2 { font-family:Ubuntu-Med; font-size:15pt; padding-top:20px; color:#ccc; }
	.formkolom { width:100%; float:left; margin-bottom:5px }
	.formstyle { border:2px solid #21C28E; height:45px; font-family:Ubuntu-Med; border-radius:30px; font-family:Ubuntu-Med; font-size:15pt; }
	.ambox { font-family:Ubuntu-Med; color:#ccc; font-size:15pt; padding-top:0 }
	.ambtn { border-radius:50px; text-align:center; color:#000; text-decoration:none; background:#21C28E; padding:9px; font-family:Ubuntu-Reg; float:right; border:0; width:49%; }
	.btnl { border-radius:50px; background:#FC0; float:left; font-family:Ubuntu-Reg; margin-top:20px; padding:12px; border:0; color:#000; width:100%; font-size:15pt; }
	.btnlg { border-radius:50px; background:#ddd; float:left; font-family:Ubuntu-Reg; margin-top:10px; padding:12px; border:0; color:#000; width:100%; font-size:15pt; }
	.btnr { border-radius:50px; background:#ddd; float:right; font-family:Ubuntu-Reg; margin-top:20px; padding:12px; border:0; color:#000; width:100%; font-size:15pt; }
	.contentbox .b {text-align: center;}
	.infostyle { padding-top:0px; margin-bottom:10px; text-align:center; font-family:Ubuntu-Med; font-size:14pt }
	.infostyle2 { padding-top:40px; font-family:Ubuntu-Med; font-size:8pt; color:#666; }
	.menustyle { width:auto; float:left; margin:0 10px 0 10px; color:#000; padding:7px }
	.menuline { width:1px; float:left; height:40px; margin:0 10px 0 10px; background:#ccc; }
	.menulinex { width:100%; float:left; height:2px; margin:10px 0px 0 0px; background:#ccc; }
	.menulang { width:auto; float:left; padding:7px 0; margin:0 0 0 10px; cursor:pointer }
	.mmbtn { border:1px solid #28C98D; position:absolute; padding:5px 10px 5px 10px; top:30%; right:20px; border-radius:3px; background:#fff }
	.mmicon { color:#28C98D; font-size:16px }
	.mmbox { width:100%; background:rgba(255,255,255,.7); min-height:100%; text-align:center; position:fixed; left:0; top:0; z-index:3; padding:10px; }
	.mmbox2 { padding:10px; border-radius:15px; width:100%; float:left; background:#28C98D }
	.mmstyle { width:100%; padding:10px; float:left; color:#fff; background:#28C98D; font-size:16px; font-family:'Ubuntu', sans-serif; font-weight: 700; border-bottom:1px solid #fff; margin-bottom:20px; }
	.mmstyle2 { width:100%; padding:10px; float:left; color:#fff; background:#28C98D; font-size:16px; font-family:'Ubuntu', sans-serif; font-weight: 700; }
	.mmlang { width:100%; background:#28C98D; float:left; padding:10px; cursor:pointer }
	.artikeltitleh1 { width:100%; float:left; margin-bottom:15px; font-family:'Manjari', sans-serif; font-weight: 700; font-size:24px }
	.artikeltitleh2 { width:100%; padding:0; float:left; margin-top:10px; font-family:'Manjari', sans-serif; font-weight: 700; font-size:18px }
	.artikelcontent { width:100%; float:left; margin-bottom:15px; font-family:Ubuntu-Reg; font-size:14px } 
	.playbtn { width:auto; position:absolute; z-index:1; left:40%; top:37%; }
	.boxdetilana { width:100%; float:left; margin-top:0px; height:250px; position:relative; }
	.imgdetilana { border-radius:15px; width:100%; }
	.boxartother { width:100%; float:left; background:#f4f4f4; border-radius:10px; margin-bottom:20px }
	.boxartotherimg { width:25%; height:70px; float:left; overflow:hidden; background:url(fileupload/artikel-img-1.jpg) center center no-repeat; background-size:cover; border-radius:10px 0 0 10px }
	.boxartothergbr { width:100%; height:70px; float:left; overflow:hidden; border-radius:10px 0 0 10px }
	.boxartcontent { width:75%; height:70px; float:left; position:relative }
	.boxartcontentstyle { width:100%; float:left; font-size:14px; padding:10px; font-family:Manjari-Bold }
	.boxartpg { width:100%; float:left; background:#f4f4f4; border-radius:10px; margin-top:20px; margin-bottom:20px }
	.boxartpgimg { width:100%; height:250px; float:left; overflow:hidden; border-radius:10px 10px 0 0 }
	.boxartpggbr { width:100%; border-radius:10px 10px 0 0 }
	.boxartpgcsec { width:100%; height:200px; float:left; position:relative }
	.boxartpgcontent { width:100%; float:left; font-size:12pt; padding:10px; font-family:Ubuntu-Reg }
	.boxartpgtitle { width:100%; float:left; font-size:14pt; padding:10px; font-family:Manjari-Bold }
	.boxartpgdate { width:100%; position:absolute; padding:10px; font-family:'Manjari', sans-serif; font-weight: 700; font-size:12pt; bottom:0 }
	.box70 { width:100%; padding:10px; float:left; }
	.boxnexprev { width:100%; float:left; padding:20px; text-align:right; position:relative; }
		.box70 .boxartpgtitle { width:100%; float:left; font-size:18pt; padding:10px 10px 10px 0; font-family:Manjari-Bold }
		.box70 .boxartpgdate { width:100%; float:left; font-size:12pt; padding:10px 10px 10px 0; font-family:'Manjari', sans-serif; font-weight: 700; position:relative }
		.box70 .boxartpgcontent { width:100%; float:left; font-size:14pt; padding:10px 10px 10px 0; margin-bottom:20px; font-family:Ubuntu-Reg }
		.box70 .boxartpggbr { width:100%; float:left; border-radius:10px; margin-bottom:20px; }
	.box30 { width:100%; padding:10px; float:left; }
	.box30 .artikeltitleh2 { width:100%; float:left; margin-bottom:10px; margin-top:0px; font-family:'Manjari', sans-serif; font-weight: 700; font-size:18px }
	.box50 { width:100%; padding:10px; float:left; }
	.footcopyrite.pd-plan {
		margin-bottom: 6em;
	}
/*****************end*******/
}
@media (min-width: 801px) and (max-width: 1199px) {
	body { 
	background:#fff; 
	margin: 0;
	padding: 0;
	overflow-y:scroll;
	overflow-x: hidden;
	width:100%;
	}
	.menumobil{display:block}
	.menuutama{ display:none }

	.bgopg { background:#f4f4f4; }
	.bghome { background:#fff; }
	.pgwidth { width:100%; margin:0 auto; }
	.modalmember { width:800px; margin:0 auto; position:relative; }
	.modalmember .box { width:100%; float:left; background:#fff; border-radius:15px; padding:30px; margin-top:15% }
	.head { width:100%; float:left; position:relative; }
	.menuopg { background:#fff; position:fixed; top:0; z-index:3; width:100%; float:left; height:70px; border-bottom:2px solid #ccc; }
	.divlogo { width:auto; float:left; padding:15px; }
	.logomm { width:190px;}
	.menusec { width:auto; float:right; padding:15px 0; }
	.menusec .opgstyle { width:auto; float:left; margin:0 10px 0 10px; color:#000; padding:10px; font-family:Ubuntu-Reg; font-size:14px; }
		.menusec .colorpghome { color:#fff; }
		.menusec .colorpgothers { color:#000; }
		.menusec .line { width:1px; float:left; height:40px; margin:0 10px 0 10px; background:#ccc; }
		.menusec .lang { width:auto; float:left; padding:10px 0; margin:0 0 0 10px; cursor:pointer }

	.mobilebtn { border:1px solid #28C98D; position:absolute; padding:5px 10px 5px 10px; top:30%; right:20px; border-radius:3px; background:#fff }
	.mobileicon { color:#28C98D; font-size:16px }
	.mobilebox { width:100%; background:rgba(255,255,255,.7); min-height:100%; text-align:center; position:fixed; left:0; top:0; z-index:3; padding:10px; }
	.mobilebox2 { padding:10px; border-radius:15px; width:100%; float:left; background:#28C98D }
	.mobilestyle { width:100%; padding:10px; float:left; color:#fff; background:#28C98D; font-size:16px; font-family:'Ubuntu', sans-serif; font-weight: 700; border-bottom:1px solid #fff; margin-bottom:20px; }
	.mobilestyle2 { width:100%; padding:10px; float:left; color:#fff; background:#28C98D; font-size:16px; font-family:'Ubuntu', sans-serif; font-weight: 700; }
	.mobilelang { width:100%; background:#28C98D; float:left; padding:10px; cursor:pointer }
	


	.pagestyle { background:#23c993; width:100%; float:left; margin-top:70px; padding:50px; }
	.pagetitle { font-size:24px; font-family:'Ubuntu', sans-serif; font-weight: 700; color:#fff; }
	.pagetitle p { font-size:12px; font-family:Ubuntu-Reg; color:#fff; }
	
	
	.body { width:100%; float:left; padding:20px; margin-top:30px; margin-bottom:30px; }
	.body .div-shadow { width:100%; margin:0 auto; background:#fff; padding:30px 30px 30px 30px; box-shadow: 0px 0px 14px #ccc; border-radius:20px; }

	.row .f100 { width:100%; float:left; }
	.row .f50 { width:50%; float:left; padding:20px; position:relative }
	.row .f50 .left { color:#d7d7d7; width:auto; float:left; padding-left:30px; font-family:Ubuntu-Med; font-size:12px }
	.row .f50 .right { color:#d7d7d7; width:auto; float:right; padding-right:30px; font-family:Ubuntu-Med; font-size:12px }
	.row .btnkolom { padding:50px 30px 40px 25px; width:50%; float:right; }
	.row .btnkolomodals { padding:30px 30px 20px 25px; width:50%; float:right; }
	.btnorange { border-radius:50px; background:#FC0; float:left; font-family:Ubuntu-Reg; padding:12px; border:0; color:#000; width:47%; font-size:14px; }
	.btngrey { border-radius:50px; background:#e1e1e1; float:right; font-family:Ubuntu-Reg; padding:12px; border:0; color:#000; width:47%; font-size:14px; }
	.btngrey2 { border-radius:50px; background:#e1e1e1; float:left; font-family:Ubuntu-Reg; padding:12px; border:0; color:#000; width:47%; font-size:14px; }
	.row .asc1 { padding:0 30px; width:100%; float:left }
	.row .asc2 { padding:20px 30px 20px 30px; width:52.5%; float:left; font-family:Ubuntu-Med; font-size:14px }
	.row .asc3 { padding:10px 30px 20px 0; width:47%; float:left; }
	.row .teks { font-family:Ubuntu-Med; font-size:14px; color:#252525 }
	.row .label2 { padding:31px 0 30px 8px; width:auto; float:left; text-align:left }
	.row .btngreen { border-radius:50px; text-align:center; color:#000; text-decoration:none; background:#21C28E; padding:12px; font-family:Ubuntu-Reg; float:right; border:0; width:170px; font-size:14px }
	.row .kolom { width:100%; float:left; padding:5px }
	.row .selectParent{ width:100%; overflow:hidden; }
	.row .selectParent select{ text-indent: 1px; text-overflow: ''; width: 100%; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: transparent url(../img/arrow-btn.png) no-repeat 95% center; }

	
	/************foot style ***********/
	.footi { width:100%; float:left; border-top:2px solid #ccc; padding:100px; background:#21C28E; margin-top:50px; text-align:center; }
	.footi .title { color:#fff; font-family:OSReg; font-size:24px}
	.footi .tombol { border-radius:50px; background:#fff; font-family:Ubuntu-Med; padding:14px; border:0; color:#000; width:20%; font-size:16px; margin-top:20px; margin-bottom:10px; }

	.foot .kolom1 { width:30%; float:left; padding:10px 100px 10px 0; }
	.foot .kolom2 { width:20%; float:left; padding:65px 10px 10px 0; }
	.foot .kolom3 { width:auto; float:right; padding:10px 0 10px 0; }

	.foot { width:100%; float:left; border-top:2px solid #ccc; padding:10px; background:#f4f4f4; margin-top:50px; }
	.foot .title { font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:18px; color:#252525; margin-top:30px; }
	.foot .teks { font-family:Ubuntu-Reg; font-size:12px; color:#252525; margin-top:10px; }
	.foot .menu { font-family:Ubuntu-Reg; font-size:12px; color:#252525; background:transparent; margin-bottom:10px; text-align:left; border:0; width:100%; }

	.footcopyrite { width:100%; background:#f4f4f4; border-top:2px solid #ccc; float:left; margin-top:0; padding:30px; font-size:12px; font-family:Ubuntu-Reg; }
	.footcopyrite .copyrite { font-size:12px; font-family:Ubuntu-Reg; }

	/***************ANALYTIC PAGE*****/
	.anapg { width:100%; float:left; padding:15px; margin-top:20px; }
	.anapg .title { font-family:'Manjari', sans-serif; font-weight: 700; font-size:24px; margin-top:20px; }
	.anapg .kolom1 { width:80%; float:left; padding:20px 20px 20px 0; }
	.anapg .kolom1 p, .anapg .kolom1 li { font-family:Ubuntu-Reg; font-size:14px }
	.anapg .kolom2 { width:65%; float:left; }
	.anapg .kolom3 { width:50%; float:left; padding:20px 0 0 20px; position:relative }
	/* .anapg .kolom3.item { width:100%; padding:20px 0 0 20px; position:relative } */
	.anapg .kolom3 .title { font-family:'Manjari', sans-serif; font-weight: 700; font-size:18px; margin:0 0 10px 0; }

	.anapg .kolom3 .tbl { width:auto; position:absolute; z-index:1; left:40%; top:37%; cursor:pointer }
	.anapg .kolom3 .img { width:100%; float:left; overflow:hidden; height:250px; position:relative; }
	.anapg .kolom3 .gbr { border-radius:15px; width:100%; }
	.anapg .pemisah { width:100%; float:left; margin-top:50px; margin-bottom:10px; border-top:2px solid #ccc; }
	.anapg .kolom4 { width:100%; float:left; margin-bottom:15px; }
	.anapg .kolom4 .title { font-family:Ubuntu-Reg; font-size:16px }
	.anapg .kolom5 { width:100%; float:left; border-radius:0 10px 10px 0;
	background: -moz-linear-gradient(left,  #fff 0%, #fff 90%, #eee 10%, #eee 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#fff), color-stop(90%,#fff), color-stop(5010,#eee), color-stop(100%,#eee));
    background: -webkit-linear-gradient(left,  #fff 0%,#fff 90%,#eee 10%,#eee 100%);
    background: -o-linear-gradient(left,  #fff 0%,#fff 90%,#eee 10%,#eee 100%);
    background: -ms-linear-gradient(left,  #fff 0%,#fff 90%,#eee 10%,#eee 100%);
    background: linear-gradient(to right,  #fff 0%,#fff 90%,#eee 10%,#eee 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#eee',GradientType=1 );
	}
	.anapg .kolom6 { width:100%; float:left; padding-right:15px }
	.anapg .kolom6 .left { width:35%; border-radius:10px 0 0 10px; overflow:hidden; height:100px; float:left; }
	.anapg .kolom6 .left .gbr { height:100%; border-radius:10px 0 0 10px; float:left; }
	.anapg .kolom6 .right { width:65%; height:100px; float:left; background:#eee; padding:5px; border-radius:0 10px 10px 0; font-size:14px; padding:10px; font-family:'Manjari', sans-serif; font-weight: 700; white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word; }
	.anapg .coulumn { width:100%; float:left; }
	.anapg .kolom7 { width:100%; float:left; margin-top:15px; text-align:right }
	.anapg .kolom7 .jarak { margin-right:10px }
	

	.body .div-shadow2 { width:100%; margin:0 auto; background:#fff; box-shadow: 0px 0px 14px #ccc; border-radius:20px; }
	.div-shadow2 .asc1a { width:50%; text-align:center; padding:0 20px; float:left }
	.div-shadow2 .asc1a .gbr { width:70% }
	.div-shadow2 .asc1 { width:50%; text-align:center; padding:10% 20px; float:left }
	.div-shadow2 .asc1 .gbr { width:90% }
	.div-shadow2 .asc2 { width:50%; float:left }
	.div-shadow2 .asc2 .f100 { width:100%; float:left; }
	.div-shadow2 .asc2 .f50 { width:100%; float:left; padding:20px; position:relative }
	.div-shadow2 .asc2 .btnkolom { padding:50px 30px 40px 25px; width:100%; float:left; }
	.div-shadow2 .asc2 .label { font-family:Ubuntu-Med; font-size:14px; color:#acacac }
	.div-shadow2 .asc2 .f50 .left { color:#d7d7d7; width:auto; float:left; padding-left:30px; font-family:Ubuntu-Med; font-size:12px }
	.div-shadow2 .asc2 .f50 .right { color:#d7d7d7; width:auto; float:right; padding-right:30px; font-family:Ubuntu-Med; font-size:12px }
	.div-shadow2 .asc2 .kolom { width:100%; float:left; padding:5px }
	.div-shadow2 .asc2 .style { border:2px solid #21C28E; height:45px; font-family:Ubuntu-Med; border-radius:30px; font-family:Ubuntu-Med; font-size:14px; }
	.div-shadow2 .asc2 .logo { width:100%; float:left; padding-left:30px; margin-bottom:35px; margin-top:50px; }
	.div-shadow2 .asc2 .title { width:100%; float:left; padding-left:30px; margin-bottom:15px; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:24px }
	.div-shadow2 .asc2 .isi { width:100%; color:#ccc; padding-left:30px; float:left; margin-top:1px; padding-right:20px; font-family:Ubuntu-Med; font-size:14px }
	
	.packagecontent { width:50%; float:left; }
	.packagecontent .title { width:100%; color:#999; float:left; font-size:14px; font-family:Ubuntu-Reg; margin-bottom:10px; }
	.packagecontent .title2 { color:#000; font-size:16px; font-weight:bold }
	.packagecontent .title3 { width:100%; color:#999; float:left; font-size:14px; font-family:Ubuntu-Reg; margin-bottom:10px; }
	.body .pgwidth .f100 { width:100%; float:left }
	
	.tablesec { width:100%; float:left; padding:15px }

	.tablebox { width:auto; float:left; padding:10px; background:#fff; border-radius:30px; box-shadow: 0px 0px 14px #ccc;}
	.tablepp { width:100%; border:0; }
	.tablepp .tr1 { text-align:center; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:16px; }
	.tablepp .tdblank { width:20%; padding:20px; }
	.tablepp .tdtitle1 { width:20%; border-left:1px solid #999;  padding:20px; }
	.tablepp .tdtitle2 { width:20%; border-left:1px solid #999; padding:20px; }
	.tablepp .tdtitle3 { width:20%; border-left:1px solid #999; padding:20px; }
	.tablepp .tdtitle4 { width:20%; border-left:1px solid #999; padding:20px; }
	.tablepp .tr2 { text-align:center; color:#999; font-family:Ubuntu-Reg; font-size:12px }
	.tablepp .td1 { width:10%; padding:10px; color:#22C993; border-left:1px solid #999; }
	.tablepp .td1 p { font-size:18px; color:#000; }
	.tablepp .lineo { height:5px; background:#FC0; border:1px solid #FC0 }
	.tablepp .tr3 { text-align:center; background:#ebebeb; font-family:Ubuntu-Reg; font-size:14px }
	.tablepp .title { width:12%; padding:10px; text-align:left; }
	.tablepp .td2 { width:20%; padding:10px;border-left:1px solid #999; }
	.tablepp .td2 p { font-size:12px; color:#999 }
	.tablepp .judul{ padding:10px; font-weight:bold; background:#fff; color:#22C993; font-family:Ubuntu-Reg; font-size:14px }
	.tablepp .icon { color:#47C11B; font-size:18px; }
	.tablepp .tr4 { text-align:center; font-family:Ubuntu-Reg; font-size:14px }
	.tablepp .bgg { background:#ebebeb }
	.tablepp .bgw { background:#fff }
	.tablepp .td3 { width:10%; padding:10px; }
	.tablepp .tombol { background:#FFDD00; margin-top:20px; margin-bottom:20px; padding:15px; width:100%; border-radius:50px; }
	

	.w100 { width:100%; float:left; }
	
	.w50 { width:47%; float:left; position:relative }
	.w50 .w100 { width:100%; float:left; margin-left:15px; }
	.w50 .w100g { width:100%; float:left; margin-left:49px; }
	.w50 .bottom { width:100%; float:left; position:relative; margin-left:15px; height:90px; background:#E8C400; padding:20px; border-radius:0 0 10px 10px; margin-bottom:20px; }
	.w50 .bottom p { width:auto; position:absolute; color:#000; top:25px; left:30px; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:16px }
	.w50 .bottom .tombol { width:60px; height:59px; position:absolute; top:10px; right:20px; background:url(../img/tbl-orange.png) center center no-repeat; background-size:contain; border:0 }

	.w50 .bottomg { width:100%; float:left; position:relative; margin-left:49px; height:90px; background:#DEDEDE; padding:20px; border-radius:0 0 10px 10px; margin-bottom:20px; }
	.w50 .bottomg p { width:auto; position:absolute; color:#000; top:25px; left:30px; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:16px }
	.w50 .bottomg .tombol { width:60px; height:59px; position:absolute; top:10px; right:20px; background:url(../img/tbl-grey.png) center center no-repeat; background-size:contain; border:0 }

	.w50 .title { width:100%; float:left; color:#000; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:18px; padding:10px; }
	.w50 .orange { width:100%; float:left; background:#F4D000; padding:20px; margin:15px 10px 0 15px; border-radius:10px 10px 0 0; }
	.w50 .orange .isi { width:100%; float:left; height:75px; overflow:hidden; margin:10px 0 10px 0; padding:10px; border-radius:10px; background:#FFDD00; font-family:Ubuntu-Med }
	
	
	.w50 .grey { width:100%; float:left; background:#EDEDED; margin:15px 10px 0 50px; padding:20px; border-radius:10px 10px 0 0; }
	.w50 .grey .isi { width:100%; float:left; height:75px; overflow:hidden; margin:10px 0 10px 0; padding:10px; border-radius:10px; background:#F8F8F8; font-family:Ubuntu-Med }

	.profile { width:100%; float:left; padding:20px }
	.profile .label { font-family:Ubuntu-Med; font-size:18px; color:#252525; margin-bottom:10px; width:100%; float:left; text-align:left; }
	.profile .left { border-top:2px solid; border-bottom:2px solid; border-left:2px solid; border-color:#21C28E; height:45px; font-family:Ubuntu-Med; border-radius:30px 0 0 30px; font-family:Ubuntu-Med; font-size:14px; width:200px; float:left; }
	.profile .selectParent { width:200px; float:left; overflow:hidden; }
	.profile .selectParent select{ text-indent: 1px; text-overflow: ''; width: 100%; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: transparent url(../img/arrow-btn.png) no-repeat 95% center; }
	.profile .right { border:2px solid #21C28E; height:45px; font-family:Ubuntu-Med; border-radius:0 30px 30px 0; font-family:Ubuntu-Med; font-size:14px; width:350px; float:left; }
	.profile .btn { border-radius:50px; background:#FC0; float:left; font-family:Ubuntu-Reg; padding:12px; border:0; color:#000; width:20%; float:left; font-size:14px; margin-left:20px; }

	.profilebox { width:100%; float:left; padding:10px 20px; margin-bottom:10px; }
	.profilebox .img { width:150px; height:150px; float:left; border-radius:20px; overflow:hidden; }
	.profilebox .box { width:480px; padding:0 20px 0 20px; float:left }
	.profilebox .box .title { width:100%; padding:3px; float:left; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:18px }
	.profilebox .box .box { width:100%; padding:3px; float:left; color:#ccc; font-family:Ubuntu-Reg; font-size:14px }
	.profilebox .box .isi { width:100%; padding:3px; float:left; font-family:Ubuntu-Reg; font-size:16px }
	.profilebox .tblbox { width:170px; float:right }
	.profilebox .tblbox .orange { border-radius:50px; font-family:Ubuntu-Reg; color:#000; background:#FC0; float:left; padding:12px; border:0; width:100%; }
	.profilebox .tblbox .grey { border-radius:50px; font-family:Ubuntu-Reg; color:#000; background:#ddd; margin-top:10px; float:left; padding:12px; border:0; width:100%; }
	.profilebox .pemisah { width:100%; float:left; margin-top:30px; border-bottom:2px solid #ccc; height:1px }

	.ppost { width:20%; float:left }
	.pfollower { width:40%; float:left }
	.pfollowing { width:40%; float:left }


	.profilebox .img .gbr { border-radius:20px; width:100% }
	.body .div-profil { width:100%; margin:0 auto; background:#fff; padding:30px 30px 30px 30px; box-shadow: 0px 0px 14px #ccc; border-radius:20px; margin-bottom:20px }
	.body .div-profil2 { width:100%; margin:0 auto; background:#fff; padding:0 15px 0 15px; box-shadow: 0px 0px 14px #ccc; border-radius:20px; margin-bottom:20px }
	.div-profil2 .box { width:100%; float:left; margin-bottom:0px; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:20px; padding:20px 30px 20px 30px; box-shadow: 0px 0px 14px #ccc; border-radius:20px; position:relative; }
	.div-profil2 .box .top { width:auto; float:right }
	.div-profil2 .box .down { width:auto; float:right }
	.div-profil2 .title { width:auto; float:left; color:#999 }
	.div-profil2 .iconcolor { color:#999 }
	.div-profil2 .itembox { padding:20px 30px; margin-top:5px; }
	.div-profil2 .w50l { margin-bottom:20px; width:45%; float:left; }
	.div-profil2 .w50r { margin-bottom:20px; width:45%; float:right; }
	.div-profil2 .judul { width:100%; float:left; font-family:OSBold; font-size:14px; color:#767676 }
	.div-profil2 .judul { width:100%; float:left; font-family:OSBold; font-size:14px; color:#767676 }
	.w50l .asc { width:100%; float:left; border-bottom:1px solid #ddd; padding:10px; position:relative; font-size:14px;font-family:Ubuntu-Med }
	.w50l .asc .ascl { width:auto; float:left }
	.w50l .asc .ascr { width:auto; float:right }
	.w50r .asc { width:100%; float:left; border-bottom:1px solid #ddd; padding:10px; position:relative; font-size:14px;font-family:Ubuntu-Med }
	.w50r .asc .ascl { width:auto; float:left }
	.w50r .asc .ascr { width:auto; float:right }
	.post { margin-bottom:20px; padding:10px }
	.post .boxkolom { width:100%; float:left; border:2px solid #28C98D; border-radius:20px; position:relative; height:600px; }
	.post .boxkolom .img { width:100%; height:220px; overflow:hidden; border-radius:20px; float:left }
	.post .boxkolom .img .gbr { width:100%; border-radius:20px; }
	.post .boxkolom .tanggal { width:100%; padding:10px; font-family:Ubuntu-Med; font-size:14px; color:#777; float:left }
	.post .boxkolom .isi { width:100%; padding:10px; font-family:Ubuntu-Med; font-size:16px; color:#000; float:left }
	.post .boxkolom .isi a { width:100%; text-align:center; margin-top:10px; font-family:Ubuntu-Med; font-size:14px; color:#28C98D; float:left }
	.post .boxkolom .boxinfo { width:100%; padding:0 10px; position:absolute; bottom:10px; float:left; }
	.post .boxkolom .boxinfo .boxinfo { width:100%; float:left; position:relative; border-bottom:2px solid #ccc; border-top:2px solid #ccc }
	.post .boxkolom .boxinfo .boxinfo .liner { width:50%; float:left; padding:20px; border-right:2px solid #ccc; text-align:center }
	.post .boxkolom .boxinfo .boxinfo .liner .no { width:100%; float:left; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:20px }
	.post .boxkolom .boxinfo .boxinfo .liner .info { width:100%; float:left; color:#ccc; font-family:Ubuntu-Med; font-size:14px }
	.post .boxkolom .boxinfo .boxinfo .linel { width:50%; float:left; padding:20px; text-align:center }
	.post .boxkolom .boxinfo .boxinfo .linel .no { width:100%; float:left; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:20px }
	.post .boxkolom .boxinfo .boxinfo .linel .info { width:100%; float:left; color:#ccc; font-family:Ubuntu-Med; font-size:14px }
	.post .boxkolom .boxinfo .boxinfo2 { width:100%; float:left; margin-bottom:30px; }
	.post .boxkolom .boxinfo .boxinfo2 .no { width:auto; float:right; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:20px }
	.post .boxkolom .boxinfo .boxinfo2 .info { width:auto; float:left; color:#ccc; font-family:Ubuntu-Med; font-size:14px }

	.profileboxact { width:100%; float:left; padding:20px 10px 0 20px; }
	.profileboxact .w25 { width:50%; float:left; padding:0 15px 15px 0; }
	.profileboxact .w25 .box { width:100%; float:left; border-radius:20px; border:2px solid #28C98D; padding:15px; text-align:center;}
	.profileboxact .w25 .box .title { color:#ccc; font-size:16px; font-family:Ubuntu-Reg }
	.profileboxact .w25 .box p { color:#000; font-size:24px; font-family:Ubuntu-Bold }
	

	.artikel { width:100%; float:left; }
	.artikel .left { width:100%; float:left; }
	.artikel .left .w100 { width:100%; float:left; padding:0 10px; }
	.artikel .left .w50 { width:50%; float:left; padding:10px; color:#545454 }
	.artikel .left .w50 > .box {box-shadow: 0px 1px 10px -6px #8d8d8d;}
	.artikel .left .w50 .box { width:100%; float:left; background:#f4f4f4; border-radius:10px; margin-bottom:20px }
	.artikel .left .w50 .box .img { width:100%; height:250px; float:left; overflow:hidden; border-radius:10px 10px 0 0;position: relative;background: #fff; }
	.artikel .left .w50 .box .img .gbr { width:100%;position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; }
	.artikel .left .w50 .box .box { width:100%; height:200px; float:left; position:relative }
	.artikel .left .w50 .box .box .title { width:100%; float:left; font-size:18px; padding:10px; font-family:Manjari-Bold }
	.artikel .left .w50 .box .box .content { width:100%; float:left; font-size:14px; padding:10px; font-family:Ubuntu-Reg }
	.artikel .left .w50 .box .box .tanggal { width:100%; position:absolute; padding:10px; font-family:'Manjari', sans-serif; font-weight: 700; font-size:14px; bottom:0;left:0; }

	.artikel .right { width:100%; float:left; padding:10px; }
	.artikel .right .w100 { width:100%; padding:0; float:left }
	.artikel .left .w100b { width:100%; float:left; padding:0; }
	.artikel .left .w100b .title { width:100%; float:left; font-size:18px; padding:0 20px; font-family:Manjari-Bold }
	.artikel .left .w100b .kolom { width:100%; float:left; margin-top:15px; text-align:right }
	.artikel .left .w100b .kolom .jarak { margin-right:10px }

	.artikel .left .w100b .pemisah { width:96%; margin:20px 20px 20px 20px; border-top:2px solid #ccc; float:left; }
	.artikel .left .w100b .coulumn { width:100%; float:left; padding:0 7px; }
	.artikel .left .w100b .coulumn .box50 .box .boxartcontentstyle { width:100%; float:left; font-size:12px; padding:10px; font-family:'Manjari', sans-serif; font-weight: 700; white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word; }
	
	.boxartotherimg { width:25%; height:70px; float:left; overflow:hidden; background:url(fileupload/artikel-img-1.jpg) center center no-repeat; background-size:cover; border-radius:10px 0 0 10px }
	.boxartothergbr { width:100%; height:70px; float:left; overflow:hidden; border-radius:10px 0 0 10px }
	.boxartcontent { width:75%; height:70px; float:left; position:relative }
	.boxartcontentstyle { width:100%; float:left; font-size:14px; padding:10px; font-family:Manjari-Bold }

	.artikel .left .w100b .box50 { width:100%; margin-top:10px; float:left; }
	.artikel .left .w100b .box50 .box { width:97%; float:left; background:#f4f4f4; border-radius:10px; margin-bottom:20px }

	.artikel .left .w100a { width:100%; float:left; margin-top:50px; padding:0 10px; }
	.artikel .left .w100a .title { width:100%; float:left; font-size:24px; padding:10px; font-family:Manjari-Bold }
	.artikel .left .w100a .tanggal { width:100%; float:left; font-size:14px; padding:0 10px; font-family:Manjari-Bold }
	.artikel .left .w100a .box { width:100%; float:left; padding:10px; }
	.artikel .left .w100a .box .img { width:100%; float:left; border-radius:10px }
	.artikel .left .w100a .isi { width:100%; float:left; font-size:14px; padding:10px; font-family:Ubuntu-Reg }
	.artikel .left .w100a .isi img { max-width: 100%; }
	.artikel .left .w100a .isi h6 { color: rgba(51, 51, 51, 0.5); font-weight: 100; line-height: 1.3; }

	.artikel .right .w100b { width:100%; margin-top:20px; padding:10px 0 10px 10px; float:left }
	.artikel .right .w100b .title { width:100%; padding-bottom:20px; float:left; font-family:'Manjari', sans-serif; font-weight: 700; font-size:18px }


	.mt { margin-top:70px; }
	
	.login-form form {flex:0 0 50%}
	.div-shadow2 .logo { width:100%; text-align:center; padding:30px; }
	.div-shadow2 .asc1log { flex:0 0 50%;width:50%; text-align:center; padding:20px; }
	.div-shadow2 .asc1log .gbr { width:70% }
	.div-shadow2 .asc2log .title { font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:24px; color:#252525; margin-bottom:0; }
	.div-shadow2 .asc2log .f100A { width:100%; float:left; text-align:left; padding:0 10px 0 10px; text-align:center; }
	.div-shadow2 .asc2log .f100 { width:100%; float:left; text-align:left; padding:10px; text-align:center; }
	.div-shadow2 .asc2log .f100 .style { border:2px solid #21C28E; height:45px; font-family:Ubuntu-Med; border-radius:30px; font-family:Ubuntu-Med; font-size:14px; }
	.div-shadow2 .asc2log .f100A .btnorange { border-radius:50px; background:#FC0; float:left; font-family:Ubuntu-Reg; padding:12px; border:0; color:#000; width:100%; font-size:14px; margin-top:20px; margin-bottom:10px; }
	.div-shadow2 .asc2log .f100 .left { color:#d7d7d7; width:auto; float:left; font-family:Ubuntu-Reg; font-size:13px; }
	.div-shadow2 .asc2log .f100 .right { color:#d7d7d7; width:auto; float:right; font-family:Ubuntu-Reg; font-size:13px }
	.div-shadow2 .asc2log .f100A .info { color:#d7d7d7; width:100%; text-align:center; float:left; font-family:Ubuntu-Med; font-size:14px }
	.div-shadow2 .asc2log .f100A .info .url { color:#21C28E; }



/*******************************************HOME*******/
	
	.header { background:#fff; width:100%; float:left; border-bottom:2px solid #ccc; }
	.headmenu { width:100%; margin:0 auto }
	.divlogo { width:auto; float:left; padding:25px; }
	.logomm { width:200px;}
	.divmenu { width:auto; float:right; padding:15px; color:#000; font-size:14pt; font-family:Ubuntu-Reg }
	.pagetitle { width:100%; background:#21C28E; text-transform:capitalize; color:#fff; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:18px; float:left; padding:20px }
	.ptcontent { width:100%; float:left; font-size:12px; font-family:Ubuntu-Reg }
	.bodysection { width:100%; font-family:Ubuntu-Reg; padding:20px; font-size:14px; color:#555; float:left }
	.divbody { 
	width:100%; margin:0 auto; padding:10px;
	}
	.divbody-shadow { 
	width:100%; margin:0 auto; background:#fff; padding:10px; box-shadow: 0px 0px 14px #ccc; border-radius:15px;
	}
	.divbody-1000 { 
	width:100%; margin:0 auto; background:#fff;
	}	

	.priceorangesec { width:100%; float:left; background:#F4D000; padding:20px; border-radius:10px 10px 0 0; }
	.pricegreysec { width:100%; float:left; background:#EDEDED; padding:20px; border-radius:10px 10px 0 0 }
	.pricetitle { width:100%; float:left; color:#000; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:18px; padding:10px; }
	.pocontent { width:100%; float:left; height:75px; overflow:hidden; margin:10px 0 10px 0; padding:10px; border-radius:10px; background:#FFDD00; font-family:Ubuntu-Med }
	.pgcontent { width:100%; float:left; height:75px; overflow:hidden; margin:10px 0 10px 0; padding:10px; border-radius:10px; background:#F8F8F8; font-family:Ubuntu-Med }
	
	.footsec { width:100%; float:left; border-top:2px solid #ddd; padding:20px; background:#f4f4f4 }
	.foottitle { width:100%; float:left; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:18px }
	.footcontent { width:100%; float:left; margin-top:10px; font-family:Ubuntu-Reg; font-size:12px }
	.footcopyrite { width:100%; background:#f4f4f4; border-top:2px solid #ddd; float:left; padding:20px; font-size:12px;font-family:Ubuntu-Reg }
	
	.modalmember { width:100%; margin:0 auto; position:relative; }
	.modaldemo { width:100%; margin:0 auto; position:relative; }
	.modalvideo { width:100%; margin:0 auto; position:relative; }
	.selectP { border:1px solid #21C28E; width:50%; float:left; border-radius:30px 0 0 30px; height:42px; }
	.inputP { border:1px solid #21C28E; width:50%; float:left; border-radius:0 30px 30px 0px; padding:20px;}
	.tombolP { border-radius:50px; background:#FC0; font-family:Ubuntu-Reg; float:left; padding:12px; border:0; margin-top:10px; width:100%;color:#000 }
	.profilimg { width:150px; height:150px; float:left; border-radius:20px; overflow:hidden; }
	.profilbox { width:480px; padding:0 20px 0 20px; float:left }
	.ppost { width:20%; float:left }
	.pfollower { width:40%; float:left }
	.pfollowing { width:40%; float:left }
	.profilboxtbl { width:130px; float:right }
	.postImgprofil { width:100%; height:200px; overflow:hidden; border-radius:20px; float:left }
	.chpassbox { width:100%; float:left; text-align:center; position:relative }
	.chpasscontent { width:100%; float:left; padding:20px; }
	.chpassImg { float:left; width:100%; text-align:center; padding:50px; }

	.packagecontent { width:30%; float:left; padding:20px; }


	.headHome { position:relative; width:100%; height:85vh; float:left }
	.homeBoxMenu { background-color:rgba(0,0,0,0.1); position:fixed; top:0; z-index:3; width:100%; float:left; }
	.homeBGimg { width:100%; left: 0; right: 0; margin-left: auto; margin-right: auto; height:85vh; overflow:hidden;  background:url(../img/bg-head.png) top center no-repeat; background-size:cover; top:0; position:absolute; z-index:2; }
	.bannerHome {position:absolute;left:50%; top:35%;z-index:1; width:35%;color:#fff}
	.bannerHome .h2 p {font-family:Rubik;font-size:24px;font-weight: 800;}
	.bannerHome p {font-family:OSSemiBold;font-size:16px;font-weight: 800;font-size:14px;}
		.bannertitle { font-family:Rubik; position:absolute; color:#fff; font-size:24px; left:50%; top:35%; z-index:1; width:35%; font-weight:bolder}
		.bannercontent { font-family:OSSemiBold; position:absolute; color:#fff; font-size:16px; left:50%; top:58%; z-index:1; width:30%; }
	.homeBGColor { width:100%; float:left; position:absolute; z-index:1; height:auto; top:0; background: -moz-linear-gradient(left,  #02ADBF 0%, #02ADBF 50%, #21C48F 50%, #21C48F 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#02ADBF), color-stop(50%,#02ADBF), color-stop(50%,#21C48F), color-stop(100%,#21C48F));
    background: -webkit-linear-gradient(left,  #02ADBF 0%,#02ADBF 50%,#21C48F 50%,#21C48F 100%);
    background: -o-linear-gradient(left,  #02ADBF 0%,#02ADBF 50%,#21C48F 50%,#21C48F 100%);
    background: -ms-linear-gradient(left,  #02ADBF 0%,#02ADBF 50%,#21C48F 50%,#21C48F 100%);
    background: linear-gradient(to right,  #02ADBF 0%,#02ADBF 50%,#21C48F 50%,#21C48F 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#02ADBF', endColorstr='#21C48F',GradientType=1 );
	display:none;
	}
	.TblDemo { position:absolute; top:25%; right:70px; border:0; z-index:3; background:transparent; }
	.TblBG { width:100%; }
	.TblMore { border-radius:50px; background:#FC0; margin-top:20px; padding:12px; border:0; width:100%; font-family:OSBold; display: block; text-align: center;color: #272727;}

	.homeContent { width:100%; float:left; margin-top:35%}
	/* .contentbox { width:100%; float:left; padding:10px; } */
	.packagecontent { width:100%; float:left; padding:0 20px; }

	.paddr50 { padding-right:0px }
	.boldtitle { font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:18px }
	.footcoloumn { width:100%; padding:10px; float:left; margin-top:10px; font-size:14px; font-family:Ubuntu-Reg }
	.footcoloumn2 { padding:10; width:50%; float:left; margin-top:10px; font-size:14px; font-family:Ubuntu-Reg }

	.footmenustyle { background:transparent; margin-bottom:10px; text-align:left; border:0; width:100%; }
	.formlabel { width:100%; float:left; color:#ccc; font-size:15pt; font-family:Ubuntu-Med; margin-bottom:5px; margin-top:10px; }
	.formlabel2 { font-family:Ubuntu-Med; font-size:15pt; padding-top:20px; color:#ccc; }
	.formkolom { width:100%; float:left; margin-bottom:5px }
	.formstyle { border:2px solid #21C28E; height:45px; font-family:Ubuntu-Med; border-radius:30px; font-family:Ubuntu-Med; font-size:15pt; }
	.ambox { font-family:Ubuntu-Med; color:#ccc; font-size:15pt; padding-top:0 }
	.ambtn { border-radius:50px; text-align:center; color:#000; text-decoration:none; background:#21C28E; padding:9px; font-family:Ubuntu-Reg; float:right; border:0; width:49%; }
	.btnl { border-radius:50px; background:#FC0; float:left; font-family:Ubuntu-Reg; margin-top:20px; padding:12px; border:0; color:#000; width:100%; font-size:15pt; }
	.btnlg { border-radius:50px; background:#ddd; float:left; font-family:Ubuntu-Reg; margin-top:10px; padding:12px; border:0; color:#000; width:100%; font-size:15pt; }
	.btnr { border-radius:50px; background:#ddd; float:right; font-family:Ubuntu-Reg; margin-top:20px; padding:12px; border:0; color:#000; width:100%; font-size:15pt; }
	.infostyle { padding-top:0px; margin-bottom:10px; text-align:center; font-family:Ubuntu-Med; font-size:14pt }
	.infostyle2 { padding-top:40px; font-family:Ubuntu-Med; font-size:8pt; color:#666; }
	.menustyle { width:auto; float:left; margin:0 10px 0 10px; color:#000; padding:7px }
	.menuline { width:1px; float:left; height:40px; margin:0 10px 0 10px; background:#ccc; }
	.menulinex { width:100%; float:left; height:2px; margin:10px 0px 0 0px; background:#ccc; }
	.menulang { width:auto; float:left; padding:7px 0; margin:0 0 0 10px; cursor:pointer }
	.mmbtn { border:1px solid #28C98D; position:absolute; padding:5px 10px 5px 10px; top:30%; right:20px; border-radius:3px; background:#fff }
	.mmicon { color:#28C98D; font-size:16px }
	.mmbox { width:100%; background:rgba(255,255,255,.7); min-height:100%; text-align:center; position:fixed; left:0; top:0; z-index:3; padding:10px; }
	.mmbox2 { padding:10px; border-radius:15px; width:100%; float:left; background:#28C98D }
	.mmstyle { width:100%; padding:10px; float:left; color:#fff; background:#28C98D; font-size:16px; font-family:'Ubuntu', sans-serif; font-weight: 700; border-bottom:1px solid #fff; margin-bottom:20px; }
	.mmstyle2 { width:100%; padding:10px; float:left; color:#fff; background:#28C98D; font-size:16px; font-family:'Ubuntu', sans-serif; font-weight: 700; }
	.mmlang { width:100%; background:#28C98D; float:left; padding:10px; cursor:pointer }
	.artikeltitleh1 { width:100%; float:left; margin-bottom:15px; font-family:'Manjari', sans-serif; font-weight: 700; font-size:24px }
	.artikeltitleh2 { width:100%; padding:0; float:left; margin-top:10px; font-family:'Manjari', sans-serif; font-weight: 700; font-size:18px }
	.artikelcontent { width:100%; float:left; margin-bottom:15px; font-family:Ubuntu-Reg; font-size:14px } 
	.playbtn { width:auto; position:absolute; z-index:1; left:40%; top:37%; }
	.boxdetilana { width:100%; float:left; margin-top:0px; height:250px; position:relative; }
	.imgdetilana { border-radius:15px; width:100%; }
	.boxartother { width:100%; float:left; background:#f4f4f4; border-radius:10px; margin-bottom:20px }
	.boxartotherimg { width:25%; height:70px; float:left; overflow:hidden; background:url(fileupload/artikel-img-1.jpg) center center no-repeat; background-size:cover; border-radius:10px 0 0 10px }
	.boxartothergbr { width:100%; height:70px; float:left; overflow:hidden; border-radius:10px 0 0 10px }
	.boxartcontent { width:75%; height:70px; float:left; position:relative }
	.boxartcontentstyle { width:100%; float:left; font-size:14px; padding:10px; font-family:Manjari-Bold }
	.boxartpg { width:100%; float:left; background:#f4f4f4; border-radius:10px; margin-top:20px; margin-bottom:20px }
	.boxartpgimg { width:100%; height:250px; float:left; overflow:hidden; border-radius:10px 10px 0 0 }
	.boxartpggbr { height:100%; border-radius:10px 10px 0 0 }
	.boxartpgcsec { width:100%; height:200px; float:left; position:relative }
	.boxartpgcontent { width:100%; float:left; font-size:12pt; padding:10px; font-family:Ubuntu-Reg }
	.boxartpgtitle { width:100%; float:left; font-size:14pt; padding:10px; font-family:Manjari-Bold }
	.boxartpgdate { width:100%; position:absolute; padding:10px; font-family:'Manjari', sans-serif; font-weight: 700; font-size:12pt; bottom:0 }
	.box70 { width:100%; padding:10px; float:left; }
	.boxnexprev { width:100%; float:left; padding:20px; text-align:right; position:relative; }
		.box70 .boxartpgtitle { width:100%; float:left; font-size:18pt; padding:10px 10px 10px 0; font-family:Manjari-Bold }
		.box70 .boxartpgdate { width:100%; float:left; font-size:12pt; padding:10px 10px 10px 0; font-family:'Manjari', sans-serif; font-weight: 700; position:relative }
		.box70 .boxartpgcontent { width:100%; float:left; font-size:14pt; padding:10px 10px 10px 0; margin-bottom:20px; font-family:Ubuntu-Reg }
		.box70 .boxartpggbr { width:100%; float:left; border-radius:10px; margin-bottom:20px; }
	.box30 { width:100%; padding:10px; float:left; }
	.box30 .artikeltitleh2 { width:100%; float:left; margin-bottom:10px; margin-top:0px; font-family:'Manjari', sans-serif; font-weight: 700; font-size:18px }
	.box50 { width:100%; padding:10px; float:left; }
/***********************************END*****/

}
/*versi desktop*/
@media (min-width: 1200px) and (max-width: 11920px) {
	body { 
	background:#fff; 
	margin: 0;
	padding: 0;
	overflow-y:scroll;
	overflow-x: hidden;
	width:100%;
	}
	.menumobil{display:none}
	.menuutama{ display:block}

					.pagebox { width:1030px; margin:0 auto }
				
					.ptcontent { width:100%; float:left; font-size:12px; font-family:Ubuntu-Reg }
					.bodysection { 
					width:100%; font-family:Ubuntu-Reg; font-size:14px; color:#555; padding:30px; float:left ;
					}
					.divbody { 
					width:1030px; margin:0 auto; padding:20px 0;
					}
					.divbody-shadowreq { 
					width:800px; margin:0 auto; background:#fff; box-shadow: 0px 0px 14px #ccc; border-radius:15px;
					}
					.divbody-1000 { 
					width:1030px; margin:0 auto; background:#fff; padding:0px;
					}

	/****************BARUUUUUUUUU***/
	.bgopg { background:#f4f4f4; }
	.bghome { background:#fff; }
	.pgwidth { width:1030px; margin:0 auto; }
	.modalmember { width:800px; margin:0 auto; position:relative; }
	.modalmember .box { width:100%; float:left; background:#fff; border-radius:15px; padding:30px; margin-top:15% }
	.head { width:100%; float:left; position:relative; }
	.menuopg { background:#fff; position:fixed; top:0; z-index:3; width:100%; float:left; height:70px; border-bottom:2px solid #ccc; }
	.divlogo { width:auto; float:left; padding:15px 0; }
	.logomm { width:190px;}
	.menusec { width:auto; float:right; padding:15px 0; }
	.menusec .opgstyle { width:auto; float:left; margin:0 10px 0 10px; color:#000; padding:10px; font-family:Ubuntu-Reg; font-size:14px; }
		.menusec .colorpghome { color:#fff; }
		.menusec .colorpgothers { color:#000; }
		.menusec .line { width:1px; float:left; height:40px; margin:0 10px 0 10px; background:#ccc; }
		.menusec .lang { width:auto; float:left; padding:10px 0; margin:0 0 0 10px; cursor:pointer }

	.mobilebtn { border:1px solid #28C98D; position:absolute; padding:5px 10px 5px 10px; top:30%; right:20px; border-radius:3px; background:#fff }
	.mobileicon { color:#28C98D; font-size:16px }
	.mobilebox { width:100%; background:rgba(255,255,255,.7); min-height:100%; text-align:center; position:fixed; left:0; top:0; z-index:3; padding:10px; }
	.mobilebox2 { padding:10px; border-radius:15px; width:100%; float:left; background:#28C98D }
	.mobilestyle { width:100%; padding:10px; float:left; color:#fff; background:#28C98D; font-size:16px; font-family:'Ubuntu', sans-serif; font-weight: 700; border-bottom:1px solid #fff; margin-bottom:20px; }
	.mobilestyle2 { width:100%; padding:10px; float:left; color:#fff; background:#28C98D; font-size:16px; font-family:'Ubuntu', sans-serif; font-weight: 700; }
	.mobilelang { width:100%; background:#28C98D; float:left; padding:10px; cursor:pointer }
	


	.pagestyle { background:#23c993; width:100%; float:left; margin-top:70px; padding:70px 0 70px 0; }
	.pagetitle { font-size:24px; font-family:'Ubuntu', sans-serif; font-weight: 700; color:#fff; }
	.pagetitle p { font-size:15px; font-family:'Ubuntu', sans-serif; color:#fff; font-weight: 400; letter-spacing: .1rem; text-transform: initial;}
	
	
	.body { width:100%; float:left; margin-top:30px; margin-bottom:30px; }
	.body .div-shadow { width:1030px; margin:30px auto; background:#fff; padding:30px 30px 30px 30px; box-shadow: 0px 0px 14px #ccc; border-radius:20px; }

	.row .f100 { width:100%; float:left; }
	.row .f50 { width:50%; float:left; padding:20px; position:relative }
	.row .f50 .left { color:#d7d7d7; width:auto; float:left; padding-left:30px; font-family:Ubuntu-Med; font-size:12px }
	.row .f50 .right { color:#d7d7d7; width:auto; float:right; padding-right:30px; font-family:Ubuntu-Med; font-size:12px }
	.row .btnkolom { padding:50px 30px 40px 25px; width:50%; float:right; }
	.row .btnkolomodals { padding:30px 30px 20px 25px; width:50%; float:right; }
	.btnorange { border-radius:30px; background:#FC0; float:left; font-family:Ubuntu-Reg; padding:12px; border:0; color:#000; width:47%; font-size:14px; }
	.btngrey { border-radius:50px; background:#e1e1e1; float:right; font-family:Ubuntu-Reg; padding:12px; border:0; color:#000; width:47%; font-size:14px; }
	.btngrey2 { border-radius:50px; background:#e1e1e1; float:left; font-family:Ubuntu-Reg; padding:12px; border:0; color:#000; width:47%; font-size:14px; }
	.row .asc1 { padding:0 30px; width:100%; float:left }
	.row .asc2 { padding:20px 30px 20px 30px; width:52.5%; float:left; font-family:Ubuntu-Med; font-size:14px }
	.row .asc3 { padding:10px 30px 20px 0; width:47%; float:left; }
	.row .teks { font-family:Ubuntu-Med; font-size:14px; color:#252525 }
	.row .label2 { padding:31px 0 30px 8px; width:auto; float:left; text-align:left }
	.row .btngreen { border-radius:50px; text-align:center; color:#000; text-decoration:none; background:#21C28E; padding:12px; font-family:Ubuntu-Reg; float:right; border:0; width:170px; font-size:14px }
	.row .kolom { width:100%; float:left; padding:5px;position: relative; }
	.row .textarea textarea { border:2px solid #21C28E; font-family:Ubuntu-Med; border-radius:20px; font-family:Ubuntu-Med; font-size:14px; }
	.row .selectParent{ width:100%; overflow:hidden; }
	.row .selectParent select{ text-indent: 1px; text-overflow: ''; width: 100%; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: transparent url(../img/arrow-btn.png) no-repeat 95% center; }

	
	/************foot style ***********/
	.footi { width:100%; float:left; border-top:2px solid #ccc; padding:100px; background:#21C28E; margin-top:50px; text-align:center; }
	.footi .title { color:#fff; font-family:OSReg; font-size:24px}
	.footi .tombol { border-radius:50px; background:#fff; font-family:Ubuntu-Med; padding:14px; border:0; color:#000; width:20%; font-size:16px; margin-top:20px; margin-bottom:10px; }

	.foot { width:100%; float:left; border-top:2px solid #ccc; padding:10px 10px 50px 10px; background:#f4f4f4; margin-top:50px; }
	.foot .pgwidth {
		display: flex;
		flex-wrap: nowrap;
		justify-content: space-between;
	}
	.foot .cols-footer {flex: 0 0 23%; }
	.foot .kolom1 {flex: 0 0 23%;}
	.foot .kolom2 {flex: 0 0 20%;}
	.foot .title { font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:18px; color:#252525; margin-top:30px; }
	.foot .teks { font-family:Ubuntu-Reg; font-size:12px; color:#252525; margin-top:10px; padding-left: 0;}
	.foot .menu { font-family:Ubuntu-Reg; font-size:12px; color:#252525; background:transparent; padding-left: 0;margin-bottom:10px; text-align:left; border:0; width:100%;line-height: 1;}

	.footcopyrite { width:100%; background:#f4f4f4; border-top:2px solid #ccc; float:left; padding:20px; font-size:12px; font-family:Ubuntu-Reg; }
	.footcopyrite .copyrite { font-size:12px; font-family:Ubuntu-Reg; }

	/***************ANALYTIC PAGE*****/
	.anapg { width:100%; float:left; padding:15px; margin-top:30px; }
	.anapg .title { font-family:'Manjari', sans-serif; font-weight: 700; font-size:24px; margin-top:20px; }
	.anapg .kolom1 { width:80%; float:left; padding:20px 20px 20px 0; }
	.anapg .kolom1 p, .anapg .kolom1 li { font-family:Ubuntu-Reg; font-size:14px }
	.anapg .kolom2 { width:65%; float:left; }
	.anapg .kolom3 { width:50%; float:left; padding:20px 0 0 20px; position:relative }
	.anapg .kolom3 .title { font-family:'Manjari', sans-serif; font-weight: 700; font-size:18px; margin:0 0 10px 0; }
	.anapg .kolom3.item { width:100%; padding:20px 0 0 20px; position:relative }
	.anapg .kolom3.item .title { font-family:'Ubuntu-Reg'; font-size:18px; margin:0 0 10px 0; min-height: 52px;}
	

	.anapg .kolom3 .tbl { width:auto; position:absolute; z-index:1; left:40%; top:37%; cursor:pointer }
	.anapg .kolom3 .img { width:100%; float:left; overflow:hidden; height:250px; position:relative; }
	.anapg .kolom3 .gbr { border-radius:15px; width:100%; }
	.anapg .pemisah { width:100%; float:left; margin-top:50px; margin-bottom:10px; border-top:2px solid #ccc; }
	.anapg .kolom4 { width:100%; float:left; margin-bottom:15px; }
	.anapg .kolom4 .title { font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:16px }
	.anapg .kolom5 { width:100%; float:left; border-radius:0 10px 10px 0;
	background: -moz-linear-gradient(left,  #fff 0%, #fff 90%, #eee 10%, #eee 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#fff), color-stop(90%,#fff), color-stop(5010,#eee), color-stop(100%,#eee));
    background: -webkit-linear-gradient(left,  #fff 0%,#fff 90%,#eee 10%,#eee 100%);
    background: -o-linear-gradient(left,  #fff 0%,#fff 90%,#eee 10%,#eee 100%);
    background: -ms-linear-gradient(left,  #fff 0%,#fff 90%,#eee 10%,#eee 100%);
    background: linear-gradient(to right,  #fff 0%,#fff 90%,#eee 10%,#eee 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#eee',GradientType=1 );
	}
	.anapg .kolom6 { width:100%; float:left; padding-right:10px }
	.anapg .kolom6 .left { width:35%; border-radius:10px 0 0 10px; overflow:hidden; height:100px; float:left; }
	.anapg .kolom6 .left .gbr { height:100%; border-radius:10px 0 0 10px; float:left; }
	.anapg .kolom6 .right { width:65%; height:100px; float:left; background:#eee; padding:5px; border-radius:0 10px 10px 0; font-size:14px; padding:10px; font-family:'Manjari', sans-serif; font-weight: 700; white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word; }
	.anapg .coulumn { width:100%; float:left; }
	.anapg .kolom7 { width:100%; float:left; margin-top:25px; text-align:right }
	
	.body .div-shadow2 { width:1030px; margin:30px auto; background:#fff; box-shadow: 0px 0px 14px #ccc; border-radius:20px; }

	.div-shadow2 .asc1 { width:50%; text-align:center; padding:10% 20px; float:left }
	.div-shadow2 .asc1a { width:50%; text-align:center; padding:0 20px; float:left }
	.div-shadow2 .asc1 .gbr { width:90% }
	.div-shadow2 .asc1a .gbr { width:70% }
	.div-shadow2 .asc2 { width:50%; float:left }
	.div-shadow2 .asc2 .f100 { width:400px; max-width: 100%; float:left; }
	.div-shadow2 .asc2 .f50 { width:100%; float:left; padding:20px; position:relative }
	.div-shadow2 .asc2 .btnkolom { padding:50px 30px 40px 25px; width:100%; float:left; }
	.div-shadow2 .asc2 .label { font-family:Ubuntu-Med; font-size:14px; color:#acacac; }
	.div-shadow2 .asc2 .f50 .left { color:#d7d7d7; width:auto; float:left; padding-left:30px; font-family:Ubuntu-Reg; font-size:12px }
	.div-shadow2 .asc2 .f50 .right { color:#d7d7d7; width:auto; float:right; padding-right:30px; font-family:Ubuntu-Med; font-size:12px }
	.div-shadow2 .asc2 .kolom { width:100%; float:left; padding:5px }
	.div-shadow2 .asc2 .style { border:2px solid #21C28E; height:45px; font-family:Ubuntu-Med; border-radius:30px; font-family:Ubuntu-Med; font-size:14px; }
	.div-shadow2 .asc2 .logo { width:400px; max-width: 100%; float:left; padding-left:30px; margin-bottom:35px; margin-top:50px; }
	.t-left {
		text-align: left !important;
	}
	.mt { margin-top:120px; }
	.body.mt { margin-top:70px; margin-bottom:0; }
	.body.mt .div-shadow2 { margin-bottom:0; }
	.div-shadow2 .logo { width:100%; flex:0 0 100%; text-align:center; padding:30px; }
	.div-shadow2 .asc1log { flex:0 0 50%;width:50%; text-align:center; padding:20px; }
	.div-shadow2 .asc1log .gbr { width:70% }
	.div-shadow2 .asc2log { width:80%; text-align:center; padding:0; }
	.div-shadow2 .asc2log .title { font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:24px; color:#252525; margin-bottom:0; }
	.div-shadow2 .asc2log .f100A { width:100%; float:left; text-align:left; padding:0 10px 0 10px; text-align:center; }
	.div-shadow2 .asc2log .f100 { width:100%; float:left; text-align:left; padding:10px; text-align:center; }
	.div-shadow2 .asc2log .f100 .style { border:2px solid #21C28E; height:45px; font-family:Ubuntu-Med; border-radius:30px; font-family:Ubuntu-Med; font-size:14px; }
	.div-shadow2 .asc2log .f100A .btnorange { border-radius:50px; background:#FC0; float:left; font-family:Ubuntu-Reg; padding:12px; border:0; color:#000; width:100%; font-size:14px; margin-top:20px; margin-bottom:10px; }
	.div-shadow2 .asc2log .f100 .left { color:#9b9b9b; width:auto; float:left; font-family:Ubuntu-Reg; font-size:13px; }
	.div-shadow2 .asc2log .f100 .right { color:#9b9b9b; width:auto; float:right; font-family:Ubuntu-Reg; font-size:13px }
	.div-shadow2 .asc2log .f100A .info { color:#9b9b9b; width:100%; text-align:center; float:left; font-family:Ubuntu-Med; font-size:14px }
	.div-shadow2 .asc2log .f100A .info .url { color:#21C28E; }


	.div-shadow2 .asc2 .title { width:75%;text-align: center; float:left; padding-left:30px; margin-bottom:15px; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:24px }
	.div-shadow2 .asc2 .isi {width: 400px; max-width: 100%; color:#9b9b9b; padding-left:30px; float:left; margin-top:1px; padding-right:20px; font-family:Ubuntu-Med; font-size:14px }

	.packagecontent { width:20%; float:left; }
	.packagecontent .title { width:100%; color:#999; float:left; font-size:14px; font-family:Ubuntu-Reg; margin-bottom:10px; padding:0 10px 10px 0; }
	.packagecontent .title2 { color:#000; font-size:16px; font-weight:bold }
	.packagecontent .title3 { width:100%; color:#999; float:left; font-size:14px; font-family:Ubuntu-Reg; margin-bottom:10px; }
	.body .pgwidth .f100 { width:100%; float:left }
	
	.tablesec { width:100%; border:0; padding:15px }

	.boxpp { display:none; }
	.tablebox { width:auto; float:left; padding:10px; background:#fff; border-radius:30px; box-shadow: 0px 0px 14px #ccc;}
	.tablepp { width:100%; border:0; }
	.tablepp .tr1 { text-align:center; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:16px; }
	.tablepp .tdblank { width:20%; padding:20px; }
	.tablepp .titleBold { width:20%; border-left:1px solid #999;  padding:20px 5px;font-size: 18px; }
	/* .tablepp .tdtitle1 { width:20%; border-left:1px solid #999;  padding:20px; }
	.tablepp .tdtitle2 { width:20%; border-left:1px solid #999; padding:20px; }
	.tablepp .tdtitle3 { width:20%; border-left:1px solid #999; padding:20px; }
	.tablepp .tdtitle4 { width:20%; border-left:1px solid #999; padding:20px; } */
	.tablepp .tr2 { text-align:center; color:#999; font-family:Ubuntu-Reg; font-size:12px }
	.tablepp .td1 { width:10%; padding:10px; color:#22C993; border-left:1px solid #999; }
	.tablepp .td1 p { font-size:18px; color:#000; }
	.tablepp .lineo { height:5px; background:#FC0; border:1px solid #FC0 }
	.tablepp .tr3 { text-align:center; background:#ebebeb; font-family:Ubuntu-Reg; font-size:14px }
	.tablepp .title { width:12%; padding:10px; text-align:left; }
	.tablepp .td2 { width:20%; padding:10px;border-left:1px solid #999; }
	.tablepp .td2 p { font-size:12px; color:#999 }
	.tablepp .judul{ padding:10px; font-weight:bold; background:#fff; color:#22C993; font-family:Ubuntu-Reg; font-size:14px }
	.tablepp .icon { color:#47C11B; font-size:18px; }
	.tablepp .tr4 { text-align:center; font-family:Ubuntu-Reg; font-size:14px }
	.tablepp .bgg { background:#ebebeb }
	.tablepp .bgw { background:#fff }
	.tablepp .td3 { width:10%; padding:10px; }
	.tablepp .tombol { background:#FFDD00; margin-top:20px; margin-bottom:20px; padding:15px; width:100%; border-radius:50px; }
	
	.w100 { width:100%; float:left; }
	
	.w50 { width:47%; float:left; position:relative }
	.w50 .w100 { width:100%; float:left; margin-left:15px; }
	.w50 .w100g { width:100%; float:left; margin-left:49px; }
	.w50 .bottom { width:100%; float:left; position:relative; margin-left:15px; height:90px; background:#E8C400; padding:20px; border-radius:0 0 10px 10px; margin-bottom:20px; }
	.w50 .bottom p { width:auto; position:absolute; color:#000; top:25px; left:30px; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:16px }
	.w50 .bottom .tombol { width:60px; height:59px; position:absolute; top:10px; right:20px; background:url(../img/tbl-orange.png) center center no-repeat; background-size:contain; border:0 }

	.w50 .bottomg { width:100%; float:left; position:relative; margin-left:49px; height:90px; background:#DEDEDE; padding:20px; border-radius:0 0 10px 10px; margin-bottom:20px; }
	.w50 .bottomg p { width:auto; position:absolute; color:#000; top:25px; left:30px; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:16px }
	.w50 .bottomg .tombol { width:60px; height:59px; position:absolute; top:10px; right:20px; background:url(../img/tbl-grey.png) center center no-repeat; background-size:contain; border:0 }

	.w50 .title { width:100%; float:left; color:#000; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:18px; padding:10px; }
	.w50 .orange { width:100%; float:left; background:#F4D000; padding:20px; margin:15px 10px 0 15px; border-radius:10px 10px 0 0; }
	.w50 .orange .isi { width:100%; float:left; height:75px; overflow:hidden; margin:10px 0 10px 0; padding:10px; border-radius:10px; background:#FFDD00; font-family:Ubuntu-Med }
	
	
	.w50 .grey { width:100%; float:left; background:#EDEDED; margin:15px 10px 0 50px; padding:20px; border-radius:10px 10px 0 0; }
	.w50 .grey .isi { width:100%; float:left; height:75px; overflow:hidden; margin:10px 0 10px 0; padding:10px; border-radius:10px; background:#F8F8F8; font-family:Ubuntu-Med }
	
	.profile { width:100%; float:left; padding:20px 20px 20px 8px; }
	.profile .label { font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:22px; color:#272727; width:100%; float:left; text-align:left; }
	.profile .left { margin-left:10px; border:solid 2px #21C28E; border-right: 0; height:45px; font-family:Ubuntu-Med; border-radius:30px 0 0 30px; font-family:Ubuntu-Med; font-size:14px; width:200px; float:left; }
	.profile .selectParent { width:200px; float:left; overflow:hidden; }
	.profile .selectParent select{ text-indent: 1px; width: 100%; appearance: none; background: transparent url(../img/arrow-btn.png) no-repeat 90% center; }
	.profile .right { border:2px solid #21C28E; height:45px; font-family:Ubuntu-Reg; border-radius:0 30px 30px 0; font-size:14px; width:350px; float:left; }
	.profile .btn { border-radius:50px; background:#FC0; float:left; font-family:Ubuntu-Reg; padding:12px; border:0; color:#000; width:20%; float:left; font-size:14px; margin-left:20px; }

	.profilebox { 
		/* width:100%; float:left; padding:10px 20px; margin-bottom:10px;  */
		display: flex;
		flex-wrap: nowrap;
		flex: 0 0 100%;
		width: 100%;
		flex-wrap: wrap;
		padding:0 20px;
	}
	.profilebox .img { width:150px; flex:0 0 15%; border-radius:20px; overflow:hidden; }
	.profilebox .box { width:480px; flex:0 0 55%; padding:0 20px 0 20px }
	.profilebox .box .title { width:100%; padding:3px; float:left; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:18px }
	.profilebox .box .box { 
		width:100%; padding:3px; float:left; color:#898989; font-family:Ubuntu-Med; font-size:14px;margin-bottom: 10px;
		display: flex;
	}
	.profilebox .box .isi { width:100%; padding:3px; float:left; font-family:Ubuntu-Med; font-size:16px;color:#272727 }
	.profilebox .tblbox { width:170px; flex:0 0 170px; margin-left: auto;}
	.profilebox .tblbox .orange { border-radius:50px; font-family:Ubuntu-Reg; color:#000; background:#FC0; float:left; padding:12px; border:0; width:100%; }
	.profilebox .tblbox .grey { border-radius:50px; font-family:Ubuntu-Reg; color:#000; background:#ddd; margin-top:10px; float:left; padding:12px; border:0; width:100%; }
	.profilebox .pemisah { width:100%;margin-top:30px;margin-bottom: 30px;border-bottom:2px solid #ccc; height:1px;display: flex; flex: 0 0 100%; }

	.profilebox .img .gbr { border-radius:20px; width:100% }
	.body .div-profil { width:1030px; margin:20px auto; background:#fff; padding:30px 30px 30px 30px; box-shadow: 0px 0px 14px #ccc; border-radius:20px; margin-bottom:20px }
	.body .div-profil2 { width:1030px; margin:0 auto; background:#fff; padding:0 15px 0 15px; box-shadow: 0px 0px 14px #ccc; border-radius:20px; margin-bottom:20px }
	.div-profil2 .box { width:100%; float:left; margin-bottom:0px; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:20px; padding:20px 30px 20px 30px; box-shadow: 0px 0px 14px #ccc; border-radius:20px; position:relative; }
	.div-profil2 .box .top { width:auto; float:right }
	.div-profil2 .box .down { width:auto; float:right }
	.div-profil2 .title { width:auto; float:left; color:#999 }
	.div-profil2 .iconcolor { color:#999 }
	.div-profil2 .itembox { padding:20px 30px; margin-top:5px; }
	.div-profil2 .w50l { margin-bottom:20px; width:45%; float:left; }
	.div-profil2 .w50r { margin-bottom:20px; width:45%; float:right; }
	.div-profil2 .judul { width:100%; float:left; font-family:OSBold; font-size:14px; color:#767676 }
	.div-profil2 .judul { width:100%; float:left; font-family:OSBold; font-size:14px; color:#767676 }
	.w50l .asc { width:100%; float:left; border-bottom:1px solid #ddd; padding:10px; position:relative; font-size:14px;font-family:Ubuntu-Med }
	.w50l .asc .ascl { width:auto; float:left }
	.w50l .asc .ascr { width:auto; float:right }
	.w50r .asc { width:100%; float:left; border-bottom:1px solid #ddd; padding:10px; position:relative; font-size:14px;font-family:Ubuntu-Med }
	.w50r .asc .ascl { width:auto; float:left }
	.w50r .asc .ascr { width:auto; float:right }
	.post { margin-bottom:20px; padding:10px }
	.post .boxkolom { width:100%; float:left; border:1px solid #28C98D; border-radius:20px; position:relative; height:750px; overflow: hidden;color:#333;box-shadow: 0px 3px 8px -5px #8d8d8d;}
	.post .boxkolom .img { width:100%; height:375px;position: relative; overflow:hidden; background-color: #000; float:left }
	.post .boxkolom .img .gbr { width:100%;position: absolute;top:0;bottom:0;margin:auto }
	.post .boxkolom .tanggal { width:100%; padding:10px; font-family:Ubuntu-Med; font-size:14px; color:#777; float:left }
	.post .boxkolom .isi { width:100%; padding:10px; font-family:Ubuntu-Med; font-size:16px; color:#000; float:left }
	.post .boxkolom .isi a { width:100%; text-align:center; margin-top:10px; font-family:Ubuntu-Med; font-size:14px; color:#28C98D; float:left }
	.post .boxkolom .boxinfo { width:100%; padding:0 10px; position:absolute; bottom:10px; float:left; }
	.post .boxkolom .boxinfo .boxinfo { width:100%; float:left; position:relative; border-bottom:2px solid #ccc; border-top:2px solid #ccc }
	.post .boxkolom .boxinfo .boxinfo .liner { width:50%; float:left; padding:20px; border-right:2px solid #ccc; text-align:center }
	.post .boxkolom .boxinfo .boxinfo .liner .no { width:100%; float:left; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:20px }
	.post .boxkolom .boxinfo .boxinfo .liner .info { width:100%; float:left; color:#898989; font-family:Ubuntu-Med; font-size:14px }
	.post .boxkolom .boxinfo .boxinfo .linel { width:50%; float:left; padding:20px; text-align:center }
	.post .boxkolom .boxinfo .boxinfo .linel .no { width:100%; float:left; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:20px }
	.post .boxkolom .boxinfo .boxinfo .linel .info { width:100%; float:left; color:#ccc; font-family:Ubuntu-Med; font-size:14px }
	.post .boxkolom .boxinfo .boxinfo2 { width:100%; float:left; margin-bottom:30px; }
	.post .boxkolom .boxinfo .boxinfo2 .no { width:auto; float:right; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:20px }
	.post .boxkolom .boxinfo .boxinfo2 .info { width:auto; float:left; color:#898989; font-family:Ubuntu-Med; font-size:14px }

	.profileboxact { width:100%; float:left; padding:20px 10px 0 20px; }
	.profileboxact .w25 { width:25%; float:left; padding:0 15px 0px 0; }
	.profileboxact .w25 .box { width:100%; float:left; border-radius:20px; border:2px solid #28C98D; padding:15px;box-shadow: 0px 5px 8px -8px #000;}
	.profileboxact .w25 .box .title { color:#898989; font-size:14px; font-family:Ubuntu-Reg;margin-bottom: 7px; display: block; }
	.profileboxact .w25 .box p { color:#000; font-size:24px; font-family:Ubuntu-Bold }
	
	.artikel { width:101.5%; float:left; }
	.artikel .left { width:70%; float:left; margin-left:5px; }
	.artikel .left .w100 { width:100%; float:left; padding:0 10px; }
	.artikel .left .w100b { width:100%; float:left; padding:10px; }
	.artikel .left .w100b .title { width:100%; float:left; font-size:18px; padding:0 10px 0 10px; font-family:Manjari-Bold }
	.artikel .left .w100b .pemisah { width:97%; margin:20px 10px 20px 10px; border-top:2px solid #ccc; float:left; }
	.artikel .left .w100b .coulumn { width:100%; float:left; }
	.artikel .left .w100b .kolom { width:100%; float:left; margin-top:5px; text-align:right }
	.artikel .left .w100b .kolom .jarak { margin-right:10px }

	
	.boxartotherimg { width:25%; height:70px; float:left; overflow:hidden; background:url(fileupload/artikel-img-1.jpg) center center no-repeat; background-size:cover; border-radius:10px 0 0 10px }
	.boxartothergbr { width:100%; height:70px; float:left; overflow:hidden; border-radius:10px 0 0 10px }
	.boxartcontent { width:75%; height:70px; float:left; position:relative }

	.artikel .left .w100b .coulumn .box50 .box .boxartcontentstyle { width:100%; float:left; font-size:14px; padding:10px; font-family:'Manjari', sans-serif; font-weight: 700; white-space: pre-wrap;      /* CSS3 */   
   white-space: -moz-pre-wrap; /* Firefox */    
   white-space: -pre-wrap;     /* Opera <7 */   
   white-space: -o-pre-wrap;   /* Opera 7 */    
   word-wrap: break-word; }
	
	.artikel .left .w100b .box50 { width:100%; margin-top:10px; float:left; }
	.artikel .left .w100b .box50 .box { width:100%; float:left; background:#f4f4f4; border-radius:10px; margin-bottom:20px }

	.artikel .left .w100a { width:100%; float:left; margin-top:70px; padding:0 10px; }
	.artikel .left .w100a .title { width:100%; float:left; font-size:24px; padding:10px; font-family:Manjari-Bold }
	.artikel .left .w100a .tanggal { width:100%; float:left; font-size:14px; padding:0 10px; font-family:Manjari-Bold }
	.artikel .left .w100a .box { width:100%; float:left; padding:10px; }
	.artikel .left .w100a .box .img { width:100%; float:left; border-radius:10px }
	.artikel .left .w100a .isi { width:100%; float:left; font-size:14px; padding:10px; font-family:Ubuntu-Reg }
	.artikel .left .w100a .isi img { max-width: 100%; }
	.artikel .left .w100a .isi h6 { color: rgba(51, 51, 51, 0.5); font-weight: 100; line-height: 1.3; }
	.artikel .left .w50 { width:50%; float:left; padding:10px; color:#545454}
	.artikel .left .w50 > .box {box-shadow: 0px 1px 10px -6px #8d8d8d;}
	.artikel .left .w50 .box { width:100%; float:left; background:#f4f4f4; border-radius:10px; margin-bottom:20px; }
	.artikel .left .w50 .box .img { width:100%; height:235px; float:left; overflow:hidden; border-radius:10px 10px 0 0;position: relative;background: #000; }
	.artikel .left .w50 .box .img .gbr { width:100%;position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; }
	.artikel .left .w50 .box .box { width:100%; height:200px; float:left; position:relative;height: 220px;margin-bottom: 0; }
	.artikel .left .w50 .box .box .title { width:100%; float:left; font-size:17px; padding:10px; font-family:Manjari-Bold;height: 84px; line-height: 1.2;}
	.artikel .left .w50 .box .box .content { width:100%; float:left; font-size:14px; padding:10px; font-family:Ubuntu-Reg }
	.artikel .left .w50 .box .box .tanggal { width:100%; position:absolute; padding:10px; font-family:'Manjari', sans-serif; font-weight: 700; font-size:14px; bottom:0 }

	.artikel .right { width:29.5%; float:left }
	.artikel .right .w100 { width:100%; padding:10px 0 10px 10px; float:left }
	.artikel .right .w100b { width:100%; margin-top:80px; padding:10px 0 10px 10px; float:left }
	.artikel .right .w100b .title { width:100%; padding-bottom:20px; float:left; font-family:'Manjari', sans-serif; font-weight: 700; font-size:18px }
	.home-article .left  {width: 100%;margin-left: 0;}
	.home-article .left .w50  {width: 33.3333%;}
	.home-article .left .show_result a:last-child  {display: none;}
	.p-10 {padding:10px}

	

/***************home*****/
	.header { background:#fff; position:fixed; top:0; z-index:3; width:100%; float:left; height:70px; border-bottom:2px solid #ccc; }
	.headmenu { width:1030px; margin:0 auto }
	.pagebox { width:1030px; margin:0 auto }

	.divlogo { width:auto; float:left; padding:15px 0; }
	.logomm { width:200px;}
	.divmenu { width:auto; float:right; padding:15px 0; color:#000; font-size:13pt; font-family:Ubuntu-Reg }
	.pagetitle { width:100%; background:#21C28E; text-transform:capitalize; color:#fff; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:34px; float:left; padding:50px 120px 50px 120px }
	.ptcontent { width:100%; float:left; font-size:12px; font-family:Ubuntu-Reg }
	.bodysection { 
	width:100%; font-family:Ubuntu-Reg; font-size:14px; color:#555; padding:30px; float:left ;
	}
	.divbody { 
	width:1030px; margin:0 auto; padding:20px 0;
	}
	.divbody-shadow { 
	width:1030px; margin:0 auto; background:#fff; padding:20px; box-shadow: 0px 0px 14px #ccc; border-radius:15px;
	}
	.divbody-shadowreq { 
	width:800px; margin:0 auto; background:#fff; box-shadow: 0px 0px 14px #ccc; border-radius:15px;
	}
	.divbody-1000 { 
	width:1030px; margin:0 auto; background:#fff; padding:0px;
	}

	.priceorangesec { width:100%; float:left; background:#F4D000; padding:20px; border-radius:10px 10px 0 0; }
	.pricegreysec { width:100%; float:left; background:#EDEDED; padding:20px; border-radius:10px 10px 0 0 }
	.pricetitle { width:100%; float:left; color:#000; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:18px; padding:10px; }
	.pocontent { width:100%; float:left; height:75px; overflow:hidden; margin:10px 0 10px 0; padding:10px; border-radius:10px; background:#FFDD00; font-family:Ubuntu-Med }
	.pgcontent { width:100%; float:left; height:75px; overflow:hidden; margin:10px 0 10px 0; padding:10px; border-radius:10px; background:#F8F8F8; font-family:Ubuntu-Med }
	
	.footsec { width:100%; float:left; border-top:2px solid #ccc; padding:35px 0; margin-top:100px; background:#f4f4f4 }
	.foottitle { width:100%; float:left; }
	.footcontent { width:100%; float:left; margin-top:10px; font-size:10pt; font-family:Ubuntu-Reg; color:#666 }
	.footcopyrite { width:100%; background:#f4f4f4; padding:15px 0; border-top:2px solid #ccc; float:left; font-size:12pt;font-family:Ubuntu-Reg; color:#666; }
	
	.modalmember { width:800px; margin:0 auto; position:relative; }
	.modaldemo { width:500px; margin:0 auto; position:relative; }
	.modalvideo { width:700px; margin:0 auto; position:relative; }
	.selectP { border:2px solid #21C28E; width:30%; float:left; border-radius:30px 0 0 30px; height:45px; font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:15pt; }
	.inputP { border:2px solid #21C28E; width:30%; float:left; border-radius:0 30px 30px 0px; padding:20px; margin-right:10px; font-family:'Ubuntu', sans-serif; font-weight: 700; height:45px; font-size:15pt; }
	.tombolP { border-radius:50px; background:#FC0; float:left; font-family:Ubuntu-Reg; font-size:15pt; padding:8px; border:0; width:25%;color:#000 }
	.profilimg { width:150px; height:150px; float:left; border-radius:20px; overflow:hidden; }
	.profilbox { width:480px; padding:0 20px 0 20px; float:left }
	/* .ppost { width:20%; float:left }
	.pfollower { width:40%; float:left }
	.pfollowing { width:40%; float:left } */
	.profilboxtbl { width:130px; float:right }
	.postImgprofil { width:100%; height:200px; overflow:hidden; border-radius:20px; float:left }
	.chpassbox { width:45%; height:300px; float:left; text-align:center; position:relative }
	.chpasscontent { width:50%; float:left; padding:20px; }
	.chpassImg { position:absolute; top:10%; left:10%; width:75%; }
	
	.homeHead { position:relative; width:100%; height:85vh; float:left }
	.homeBoxMenu { background-color:rgba(0,0,0,0.1); position:fixed; top:0; z-index:3; width:100%; float:left; height:70px }
	.homeBGimg { width:1200px; left: 0; right: 0; margin-left: auto; margin-right: auto; height:85vh; overflow:hidden;  background:url(../img/bg-head.png) top center no-repeat; top:0; position:absolute; z-index:2;background-size: cover; }
	.bannerHome {position:absolute;left:50%; top:35%;z-index:1; width:35%;color:#fff}
	.bannerHome .h2 p {font-family:Rubik;font-size:25px;font-weight: 800;}
	.bannerHome p {font-family:OSSemiBold;font-size:24px;font-weight: 800;font-size:14px;}
		.bannertitle { font-family:Rubik; position:absolute; color:#fff; font-size:24px; left:50%; top:35%; z-index:1; width:40%; font-weight:bolder}
		.bannercontent { font-family:OSSemiBold; position:absolute; color:#fff; font-size:14px; left:50%; top:55%; z-index:1; width:30%; }
	.homeBGColor { width:100%; float:left; position:absolute; z-index:1; height:85vh; top:0; background: -moz-linear-gradient(left,  #02ADBF 0%, #02ADBF 50%, #21C48F 50%, #21C48F 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#02ADBF), color-stop(50%,#02ADBF), color-stop(50%,#21C48F), color-stop(100%,#21C48F));
    background: -webkit-linear-gradient(left,  #02ADBF 0%,#02ADBF 50%,#21C48F 50%,#21C48F 100%);
    background: -o-linear-gradient(left,  #02ADBF 0%,#02ADBF 50%,#21C48F 50%,#21C48F 100%);
    background: -ms-linear-gradient(left,  #02ADBF 0%,#02ADBF 50%,#21C48F 50%,#21C48F 100%);
    background: linear-gradient(to right,  #02ADBF 0%,#02ADBF 50%,#21C48F 50%,#21C48F 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#02ADBF', endColorstr='#21C48F',GradientType=1 ); }
	.TblDemo { position:fixed; bottom:35%; right:30px; border:0; z-index:3; background:transparent; }
	.TblBG { width:110px; }
	.TblMore { border-radius:50px; background:#FC0; margin-top:20px; padding:12px; border:0; width:150px; font-family:OSBold;display: block; text-align: center; color: #272727;}
	.TblMore:hover {text-decoration: none;}
	.homeContent { width:1000px; margin:0 auto }
	/* .contentbox { width:100%; float:left; padding:30px; margin-top:50px; } */
	.packagecontent { width:20%; float:left; padding:15px; }
	
	.paddr50 { padding-right:50px }
	.boldtitle { font-family:'Ubuntu', sans-serif; font-weight: 700; font-size:16pt }
	.footcoloumn { width:25%; float:left; margin-top:10px; font-size:14px; font-family:Ubuntu-Reg; color:#666 }
	.footcoloumn2 { padding-top:35px; width:25%; float:left; margin-top:10px; font-size:12pt; font-family:Ubuntu-Reg; color:#666 }
	
	.footmenustyle { background:transparent; margin-bottom:10px; text-align:left; border:0; width:100%; }
	.formlabel { width:100%; float:left; color:#ccc; font-size:15pt; font-family:Ubuntu-Med; margin-bottom:5px }
	.formlabel2 { font-family:Ubuntu-Med; font-size:15pt; padding-top:20px; color:#ccc; }
	.formkolom { width:100%; float:left; margin-bottom:5px }
	.formstyle { border:2px solid #21C28E; height:45px; font-family:Ubuntu-Med; border-radius:30px; font-family:Ubuntu-Med; font-size:15pt; }
	.ambox { font-family:Ubuntu-Med; color:#ccc; font-size:15pt; padding-top:0 }
	.ambtn { border-radius:50px; text-align:center; color:#000; text-decoration:none; background:#21C28E; padding:9px; font-family:Ubuntu-Reg; float:right; border:0; width:49%; }
	.btnl { border-radius:50px; background:#FC0; float:left; font-family:Ubuntu-Reg; margin-top:20px; padding:12px; border:0; color:#000; width:49%; font-size:15pt; }
	.btnlg { border-radius:50px; background:#ddd; float:left; font-family:Ubuntu-Reg; margin-top:10px; padding:12px; border:0; color:#000; width:49%; font-size:15pt; }
	.btnr { border-radius:50px; background:#ddd; float:right; font-family:Ubuntu-Reg; margin-top:20px; padding:12px; border:0; color:#000; width:49%; font-size:15pt; }
	.infostyle { padding-top:20px; font-family:Ubuntu-Med; font-size:14pt }
	.infostyle2 { padding-top:40px; font-family:Ubuntu-Med; font-size:12pt; color:#666; }
	.r-columns .TblMore {float:right}
	.menustyle { width:auto; float:left; margin:0 10px 0 10px; color:#000; padding:7px }
	.menuline { width:1px; float:left; height:40px; margin:0 10px 0 10px; background:#ccc; }
	.menulinex { width:100%; float:left; height:2px; margin:10px 0px 0 0px; background:#ccc; }
	.menulang { width:auto; float:left; padding:7px 0; margin:0 0 0 10px; cursor:pointer }
	.mmbtn { border:1px solid #28C98D; position:absolute; padding:5px 10px 5px 10px; top:30%; right:20px; border-radius:3px; background:#fff }
	.mmicon { color:#28C98D; font-size:16px }
	.mmbox { width:100%; background:rgba(255,255,255,.7); min-height:100%; text-align:center; position:fixed; left:0; top:0; z-index:3; padding:10px; }
	.mmbox2 { padding:10px; border-radius:15px; width:100%; float:left; background:#28C98D }
	.mmstyle { width:100%; padding:10px; float:left; color:#fff; background:#28C98D; font-size:16px; font-family:'Ubuntu', sans-serif; font-weight: 700; border-bottom:1px solid #fff; margin-bottom:20px; }
	.mmstyle2 { width:100%; padding:10px; float:left; color:#fff; background:#28C98D; font-size:16px; font-family:'Ubuntu', sans-serif; font-weight: 700; }
	.mmlang { width:100%; background:#28C98D; float:left; padding:10px; cursor:pointer }
	.artikeltitleh1 { width:100%; float:left; margin-bottom:15px; font-family:'Manjari', sans-serif; font-weight: 700; font-size:24px }
	.artikeltitleh2 { width:100%; padding:0; float:left; margin-bottom:10px; font-family:'Manjari', sans-serif; font-weight: 700; font-size:18px }
	.artikelcontent { width:100%; float:left; margin-bottom:15px; font-family:Ubuntu-Reg; font-size:14px } 
	.playbtn { width:auto; position:absolute; z-index:1; left:40%; top:37%; }
	.boxdetilana { width:100%; float:left; margin-bottom:50px; height:250px; position:relative; }
	.imgdetilana { border-radius:15px; width:100%; }
	.boxartother { width:100%; float:left; background:#f4f4f4; border-radius:10px; margin-bottom:20px }
	.boxartotherimg { width:25%; height:70px; float:left; overflow:hidden; background:url(fileupload/artikel-img-1.jpg) center center no-repeat; background-size:cover; border-radius:10px 0 0 10px }
	.boxartothergbr { width:100%; height:70px; float:left; overflow:hidden; border-radius:10px 0 0 10px }
	.boxartcontent { width:75%; height:70px; float:left; position:relative;display: flex;align-items: center; color:#000;background-color: #f4f4f4;border-top-right-radius: 10px; border-bottom-right-radius: 10px; }
	.boxartcontentstyle { width:100%; float:left; font-size:14px; padding:0 10px; font-family:'Manjari', sans-serif; font-weight: 700; position: relative;top:3px }
	.boxartpg { width:100%; float:left; background:#f4f4f4; border-radius:10px; margin-bottom:20px }
	.boxartpgimg { width:100%; height:250px; float:left; overflow:hidden; border-radius:10px 10px 0 0 }
	.boxartpggbr { height:100%; border-radius:10px 10px 0 0 }
	.boxartpgcsec { width:100%; height:200px; float:left; position:relative }
	.boxartpgcontent { width:100%; float:left; font-size:12pt; padding:10px; font-family:Ubuntu-Reg }
	.boxartpgtitle { width:100%; float:left; font-size:14pt; padding:10px; font-family:Manjari-Bold }
	.boxartpgdate { width:100%; position:absolute; padding:10px; font-family:'Manjari', sans-serif; font-weight: 700; font-size:12pt; bottom:0 }
	.box70 { width:70%; padding:10px; float:left; }
	.boxnexprev { width:100%; float:left; padding:20px; text-align:right; position:relative; }
		.box70 .boxartpgtitle { width:100%; float:left; font-size:18pt; padding:10px 10px 10px 0; font-family:Manjari-Bold }
		.box70 .boxartpgdate { width:100%; float:left; font-size:12pt; padding:10px 10px 10px 0; font-family:'Manjari', sans-serif; font-weight: 700; position:relative }
		.box70 .boxartpgcontent { width:100%; float:left; font-size:14pt; padding:10px 10px 10px 0; margin-bottom:20px; font-family:Ubuntu-Reg }
		.box70 .boxartpggbr { width:100%; float:left; border-radius:10px; margin-bottom:20px; }
	.box30 { width:30%; padding:10px 0 0 50px; float:left; }
	.box30 .artikeltitleh2 { width:100%; float:left; margin-bottom:10px; margin-top:90px; font-family:'Manjari', sans-serif; font-weight: 700; font-size:18px }
	.box50 { width:50%; padding:10px; float:left; }
	.footcopyrite.pd-plan {
		margin-bottom: 5em;
	}
/****************end*******/


		
}


.a { font-family:OSReg }
.b { margin-bottom:20px; font-family:OSExtraBold; font-size:24px }
.c { font-family:OSReg }
.cline { width:100%; float:left;margin-top: 30px; margin-bottom: 30px; border-bottom:3px solid #ccc; height:5px }
.d { background:transparent; box-shadow: 0 0 0 transparent; border:0; }
.mtop20 { margin-top:20px; }
.mtop0 { margin-top:0; }
.relative { position:relative }
.arrowbutton { width:auto; position:absolute; z-index:1; left:40%; top:37%; cursor:default }





/* The container */
.kontener {
  position: relative;
  padding-left: 20px;
  margin-bottom: 0px;
  cursor: pointer;
  font-weight:normal;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.kontener input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 15px;
  width: 15px;
  background-color: #fff;
  border:2px solid #23c993;
}
.checkmarkR { /* FOR RADIO BUTTON */
  position: absolute;
  top: 2px;
  left: 0;
  height: 15px;
  width: 15px;
  background-color: #fff;
  border-radius: 50%;
  border:2px solid #23c993;
}

/* On mouse-over, add a grey background color */
.kontener:hover input ~ .checkmark {
  background-color: #ccc;
}
.kontener:hover input ~ .checkmarkR {
  background-color: #23c993;
}

/* When the checkbox is checked, add a blue background */
.kontener input:checked ~ .checkmark {
  background-color: #2196F3;
}
.kontener input:checked ~ .checkmarkR {
  background-color: #23c993;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}
.checkmarkR:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmark when checked */
.kontener input:checked ~ .checkmark:after {
  display: block;
}
.kontener input:checked ~ .checkmarkR:after {
  display: block;
}

/* Style the checkmark/indicator */
.kontener .checkmark:after {
  left: 3px;
  top: -1px;
  width: 7px;
  height: 12px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.kontener .checkmarkR:after {
	top: 22%;
	left: 22%;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: white;
}


/************************************************ngertinya ma yg dibawah nihhh*********************/
/* The konteng */
.agreement_register {
	display: flex;
    flex-wrap: wrap;
    width: 100%;
    flex: 0 0 100%;
    align-items: flex-start;
}
.agreement_register p {margin: 0;cursor: pointer;}
.konteng {
  display: block;
  position: relative;
  padding-left: 25px;
  margin-top: 3px;
  cursor: pointer;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* Hide the browser's default checkbox */
.konteng input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom checkbox */
.checkmarkonteng {
  position: absolute;
  top: 0;
  left: 0;
  height: 15px;
  width: 15px;
  background-color: #fff;
  border:2px solid #23c993;
  border-radius:100%;
}

/* On mouse-over, add a grey background color */
.konteng:hover input ~ .checkmarkonteng {
  background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.konteng input:checked ~ .checkmarkonteng {
  background-color: #23c993;
}

/* Create the checkmarkonteng/indicator (hidden when not checked) */
.checkmarkonteng:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the checkmarkonteng when checked */
.konteng input:checked ~ .checkmarkonteng:after {
  display: block;
}

/* Style the checkmarkonteng/indicator */
.konteng .checkmarkonteng:after {
  left: 4px;
  top: 0px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.video_introductions {
	height: 545px;
	overflow: hidden;
	margin:1em 0;
	position: relative;
}
.video_introductions iframe {
	position: relative;
	top: -85px;
}
.coverImg .imgCover {
	width:100%;
}
.coverImg {
	position: absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	z-index: 2;
	display: flex;
}
.btn-playvideo {
	position:absolute;
	top:0;
	left:0;
	right:0;
	bottom:0;
	margin:auto;
	width: 80px;
	cursor: pointer;
}
.video-play {		   
	border-radius: 50%;	   
	text-align: center;		
	font-weight: bold;
	transition: all 0.3s ease;
	margin: -40px 0 0 -60px;
	left: calc(50% + 30px);
	top: calc(50% + 12px);							
	color: white;						  
	position: absolute;
	cursor: pointer;
	text-decoration: none;
}
.video-play:hover {
	background: rgba(255, 255, 255, 0.3);
	box-shadow: 0px 0px 10px rgb(255 255 255 / 50%);									   
}
.vshortcode.paused::after {
	content: "";
	position: absolute;
	top: 0px;
	left: 0;
	bottom: 0px;
	right: 0;
	cursor: pointer;
	background-color: black;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 40px 40px;
	background-image: url(data:image/svg+xml;utf8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEiIHdpZHRoPSIxNzA2LjY2NyIgaGVpZ2h0PSIxNzA2LjY2NyIgdmlld0JveD0iMCAwIDEyODAgMTI4MCI+PHBhdGggZD0iTTE1Ny42MzUgMi45ODRMMTI2MC45NzkgNjQwIDE1Ny42MzUgMTI3Ny4wMTZ6IiBmaWxsPSIjZmZmIi8+PC9zdmc+)
}
.muteunmute {
	position: absolute;
	z-index: 2;
	left: 0;
	font-size: 42px;
	background-color: transparent;
	border: none;
	width: 70px;
	height: 70px;
}
.muteunmute:focus,.muteunmute:active {
	outline:none;
}
.muteunmute .fa-volume-up {
	display:none;
}
.muteunmute.muted .fa-volume-up {
	display:block;
}
.muteunmute.muted .fa-volume-off {
	display:none;
}
.form_ktp_npwp {
	display: flex;
	flex-wrap: wrap;
	margin-top: 2px;
}
.row .form_ktp_npwp .selectParent {
	padding: 0;
    width: 25%;
}
.row .form_ktp_npwp .selectParent select {
	border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}
.row .form_ktp_npwp input {
	width: 75%;
	border-top-left-radius: 0;
    border-bottom-left-radius: 0;
	border-left:0;
}
.o-hd {
	overflow: hidden;
}
.select2-container--default.select2-container--disabled .select2-selection--multiple {
    background-color:transparent !important;
}
.select2-container--default.select2-container--disabled .select2-selection--multiple .select2-selection__rendered .select2-selection__choice {
	padding-left:5px !important;
	background-color: #a9a9a9 !important;
}
.sub__report, .plan_period_report {
	position: relative;
	margin-bottom: 0;
}
.sub__report:after, .plan_period_report:after {
	content: '';
    position: absolute;
    left: 18px;
    top: 0px;
    bottom: 0;
    width: 3px;
    background-color: #21C28E;
    z-index: -1;
}
.plan_period_report:before {
    content: '';
    position: absolute;
    left: 20px;
    top: 25px;
    width: 15px;
    height: 3px;
    background-color: #21C28E;
}
.plan_period_report.last_periode:after {
	height:28px
}
.sub__report:after {
	top:10px;
}
.readonly_select .select2-container--default .select2-selection--multiple .select2-selection__choice {
	background: #8d8d8d !important;
	padding-left:5px;
}
.readonly_select .select2-selection__choice__remove {
	display: none;
}
.readonly_select .select2-container {
	pointer-events: none;
}
.profilebox .us_name {
	display: block;
    font-size: 12px;
    font-family: 'OSSemiBold';
    color: #8d8d8d;
}
.colums_search {
	position: relative;
	float: left;
}
.colums_search .fa {
	position: absolute;
    top: 2px;
    bottom: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    right: 0;
    font-size: 18px;
	color:#00abc0;
}
.search__account {
	position: relative;
    width: 350px;
    float: left;
}
.search__account .ondetail {
	position: absolute;
	right:0;
	width: 350px;
	top: 100%;
    background-color: #fff;
}
.search__account .ondetail .profilebox {
	padding:15px;cursor:pointer; }
.search__account .ondetail .profilebox .img img {
	border-radius: 100% !important;
}
.search__account .ondetail .summary_profile , .search__account .ondetail .tblbox , .search__account .ondetail .box .isi, .search__account .ondetail .pemisah {
	display: none;
}
.show__result {
	box-shadow: 5px 5px 20px -12px #8b8b8b;
    border-radius: 15px;
}
.search__influencer .space-b5 .label {
	font-size: 16px;
}
.search__influencer .pemisahx {
	margin-bottom: 0;
	border-top: 1px solid #ccc;
}
.space-t5 {
	padding-top:5px;
}
.space-b5 {
	padding-bottom: 5px;
}
.select2-results__option {
	display: flex;
	align-items: center;
}
.fa-tiktok:after {
	display: inline-block;
	content:'';
	background-image: url('../img/tiktok-logo.png');
	background-repeat: no-repeat;
	background-size: cover;
    width: 15px;
    height: 15px;
}
.select2-results__options .fa-tiktok:after {}
.select2-results__options .fa {
	margin-right: 10px;
}
.select2-results__options .fa-facebook-square {
	color: #4267B2;
}
.select2-results__options .fa-twitter {
	color: #1DA1F2;
}
.select2-results__options .fa-instagram {
	color: #E1306C;
}
.select2-results__options .fa-youtube {
	color: #FF0000;
}
.select2-results__options .fa-influencer {
	background: url('../img/influencer.svg') no-repeat center;
	background-size: cover;
    width: 15px;
    height: 15px;
}
.select2-results__options .fa-campaign {
	background: url('../img/activity.svg') no-repeat center;
	background-size: cover;
    width: 15px;
    height: 15px;
}
.select2-results__options .fa-pitching {
	background: url('../img/pitching.svg') no-repeat center;
	background-size: cover;
    width: 15px;
    height: 15px;
}
.menu-tutorial {
	list-style: none;
	padding-left:0;
	border:solid 1px #00b0cc;
	border-radius:10px;
	overflow:hidden;
}
.menu-tutorial li {
	font-family: 'Ubuntu-Reg', sans-serif;
	padding:1em 1.5em;
	display:block;
	transition:ease all .3s;
	color:#000;
	background-color:#fff;
	text-decoration:none;
	cursor: pointer;
}
.menu-tutorial li a {
	border-bottom:solid 1px #00b0cc;
	color:#000;
}
.menu-tutorial li:last-child a {
	border-bottom:0;
}
.menu-tutorial li:hover, .menu-tutorial li.current {
	color:#fff;
	background-color:#00b0cc;
}
.setting__menu.menu-tutorial li {
	padding:0
}
.setting__menu.menu-tutorial li a {
	padding:1em 1.5em;
	display: block;
	color:#000;
}
.setting__menu.menu-tutorial li a:hover{
	text-decoration: none;
}
.setting__menu.menu-tutorial li a:hover, .menu-tutorial li a.current {
	color:#fff;
	background-color:#00b0cc;
}
.search-filter {
	position: relative;
	overflow: hidden;
}
.search-filter .fa {
	position:absolute;
	left:15px;
	top:0;
	bottom:0;
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	font-size:14px;
	color:#00b0cc;
}
.search-filter input {
	width: 100%;
	padding: 6px;
	padding-left: 40px;
	border-color: transparent;
	border: solid 1px #00b0cc;
	border-radius: 10px;
	transition:ease all .3s;
}
.search-filter input:focus,
.search-filter input:active {
	outline:0;
	box-shadow:0px 5px 15px -12px #000000;
}
.search-filter input::placeholder {
	color:rgba(0, 0, 0, .2);
	font-family: 'Ubuntu-Med', sans-serif;
	font-style:italic;
}
.list-grid-2 {
	list-style: none;
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	padding:0;
	margin-left:-15px;
	margin-right:-15px;
}
.list-grid-2 li {
	width:50%;
	padding-left:15px;
	padding-right:15px;
}
.tutorail-thumbnail {
	margin-top:2em;
}
/* .tutorail-thumbnail li {
	display:none;
}
.tutorail-thumbnail li.show {
	display:block;
} */
.tutorail-thumbnail li img {
	width:100%;
	border-radius:15px;
}
.tutorail-thumbnail li .image-layer {
	position:relative
}
.tutorail-thumbnail li .image-layer .fa {
	position: absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	font-size: 6em;
	display: flex;
	align-items: center;
	justify-content:center;
	color: #f1f1f1;
}
.tutorail-thumbnail .title-tutorial {
	font-family: 'Ubuntu-Bold', sans-serif;
	font-weight:bold;
	font-size:20px;
	margin:10px 0;
	height: 72px;
}
.tutorail-thumbnail .caption-tutorial p {
	height:72px;
}
.tutorail-thumbnail .btn-tutorial {
	margin-bottom: 25px;
}
.button-learn {
	border:0;
	background-color:#ffc600;
	font-family: 'Ubuntu-Bold', sans-serif;
	font-weight:bold;
	font-size:12px;
	transition:ease all .3s;
	padding: 7px 15px;
	border-radius: 8px;
	color:#000;
}
.button-learn:hover {
	box-shadow:0px 1px 5px -3px #000;
	text-decoration: none;
	color:#000;
}

.id_member_detail {
	border:solid 2px #21C28E;
	border-radius: 8px;
	padding:1em;
	position: relative;
}
.id_member_detail .radio__customs {
	display: flex;
	flex-wrap: wrap;
}
.id_member_detail .border__inputcus {
	border-radius: 0;
	border:0;
	box-shadow:none;
	border-bottom:solid 1px #acacac;
	resize: none;
}
.id_member_detail .disclaimer {
	height: 183px;
    overflow-y: auto;
    background-color: #f1f1f1;
    padding: 10px 15px;
	text-align: justify;
    border-radius: 7px;
    line-height: 1.3;
    font-weight: 500;
    font-size: 12px;
}
.list__insight {
	list-style: none;
	padding:0;
	margin:45px -15px 0;
}
.list__insight li {
	margin-bottom: 2em;
	border-bottom: 3px solid #ccc;
	padding-bottom: 2em;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
.list__insight li:last-child {
	border-bottom: 0;
	margin-bottom: 0;
    padding-bottom: 0;
}
.list__insight li .img__layer{
	flex: 0 0 50%;
	padding:0 15px;
}
.date__insight{
	display: block;
	font-size: 12px;
	font-family: 'Ubuntu-Reg';
	margin: 10px 0;
}
.list__insight li .img__layer img{
	width: 100%;
}
.list__insight li .desc__layer{
	flex:0 0 50%;
	padding:0 15px;
}
.list__insight li .desc__layer p{
	font-family: 'Ubuntu-Reg';
	font-size: 18px;
}
.list__insight li .button-learn{
	margin: 15px 0 0;
    display: inline-block;
}
.title-thumb {
	font-family: 'Ubuntu-Bold', sans-serif;
    font-weight: bold;
    font-size: 24px;
    margin: 10px 0;
	color:#000;
}
.title-article {
	font-family: Manjari-Bold;
    font-size: 24px;
    margin: 10px 0;
	color:#000;
}
.list__insight a:hover {
	text-decoration: none;
}
.space-body {
	padding-top:45px;
}
.text-page p, .text-page li { font-family:Ubuntu-Reg; font-size:14px }
.text-page img {
	max-width: 100%;
}
.text-page .img-head {
	margin-bottom: 15px;
	margin-left:auto;
	margin-right: auto;
	display: block;
}
.notes__insight {
	width: 100%;
	text-align: center;
	margin: 3em 0;
}
.notes__insight p {
	font-size: 21px;
	font-family: 'Ubuntu-Bold', sans-serif;
}
.button__pop:hover {
	box-shadow: 0px 15px 7px -12px #727272;
}
.button__pop {
	font-size: 24px;
	background-color: #21C28E;
	text-transform: uppercase;
	border:0;
	border-radius: 28px;
	color:#fff;
	font-family: 'Ubuntu-Bold', sans-serif;
    padding: 20px 25px;
	margin:25px 0 0;
	transition: ease all .3s;
	box-shadow: 0px 1px 5px -1px #000;
}
.insight_download .modal-header {
	border:0;
	text-align: center;
}
.insight_download .modal-header .modal-title {
    font-family: 'Ubuntu-Med';
    text-transform: uppercase;
    font-size: 16px;
}
.insight_download .modal-header .title_modal {
	font-family: 'Ubuntu-Med';
    text-transform: capitalize;
    font-size: 24px;
    margin: 0.8em 0;
}
.insight_download .modal-header p {
	font-family: 'Ubuntu-Reg';
    font-size: 14px;
}
.insight_download .modal-body {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.insight_download .popup-content {
	width: 500px;
	max-width: 100%;
}
.btn-green {
	background-color: #21C28E;
    color: #fff;
    font-family: 'Ubuntu-Reg';
    text-transform: uppercase;
    font-size: 1.28571429em;
    padding: 0.5em 0;
    border: 0;
    width: 100%;
    border-radius: 7px;
    margin: 10px 0 15px;
}
.btn-green[disabled] {
	background-color: #999999;
	cursor: auto;
}
.center__insight {
	width: 800px;
	max-width: 100%;
}
p.caption-header {
	font-family: 'Ubuntu-Reg';
	text-transform: initial;
	font-weight: 300;
}
.mt-15 {margin-top:15px;}
.mt-25 {margin-top:25px;}
.mb-25 {margin-bottom:25px;}
.mb-15 {margin-bottom:15px;}
.mr-5 {margin-right:5px;}
.body .pgwidth #FrmRegist {
	margin:0 -15px;
}
.body .pgwidth .register__page {
	display: flex;
	flex-wrap: wrap;
}
.body .pgwidth .register__page .field__input {
	flex:0 0 50%;
	padding:0 15px
}
.title_choose {
	font-size: 24px;
    font-family: 'Ubuntu-Bold';
    margin-top: 0;
}
.desc_choose {
	font-size: 18px;
    font-family: 'Ubuntu-Reg';
	margin-bottom: 3em;
}
.boxinfo .no {
	color:#000;
}
.popupRMember .popup-content {
	width: 480px;
}
.title_popup{
	font-family: 'Ubuntu-Med';
    text-transform: uppercase;
    font-size: 16px;
}
.closebuttonRight .btn-close {
    top: -10px;
    right: -10px;
    border-radius: 30px;
    font-size: 16px;
    width: 30px;
    height: 30px;
    z-index: 2;
    font-family: sans-serif;
}
.btn-ActionRight .modal-footer {
	display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.btn-ActionRight .cancel__popup {margin-right: 5px;}
.btnMain {
	background-color: #00b0cc;
	font-family: 'Ubuntu', sans-serif;
	padding: 8px 10px;
    border: 0;
    color: #fff;
    width: 150px;
    font-size: 14px;
    font-weight: 500;
    border-radius: 7px;
}
.btn-action {
	width: 100px;
	border-radius: 5px;
	padding:6px 10px;
}
.btn-cancel {
	background-color: transparent;
    color: #000;
    border: solid 1px #00b0cc;
    font-weight: 600;
}
.btn-doit {
	border: solid 1px #00b0cc;
}
.d-none {
	display: none;
}
.noteStart {
	display: block;
    text-align: left;
    margin: 0;
    width: 100%;
    position: relative;
    top: 10px;
    font-weight: 500;
    font-size: 1.1em;
    color: #888888;
}
.headPlanPricing {
	display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
	align-items:center
}
.titleHeadFree {
	position: relative;
    border: solid 1px #fff;
    border-radius: 10px;
    padding: 15px 20px;
    line-height: 1;
    font-weight: 700;
    font-size: 24px;
}
.titleHeadFree .setFree {
    position: absolute;
    top: -15px;
    left: 18px;
    padding: 7px 8px;
    background-color: #21C28E;
    font-size: 13px;
    font-weight: 500;
}
.daysLeft{
	font-size: 1.4rem;
    font-weight: 400;
    display: block;
	margin: 2px 0;
    text-align: center;
    text-transform: initial;
}
.btn-main {
	background-color: #6CC68A;
	border:0;
	color:#fff;
	font-family: 'Ubuntu', sans-serif;
}
.btn-main:active, .btn-main:focus {
	outline: none;
}
.btn-main:hover {
	text-decoration: none;
	color: inherit;
}
.upgrade-col .btn-main {
	width: 100%;
    border-radius: 5px;
    padding: 8px 0;
    font-size: 1.8rem;
    font-weight: 500;
	margin: 8px 0;
	display: flex;
    align-items: center;
    justify-content: center;
	color:#fff;
}
.upgrade-col .btn-main span {
	font-weight: 300;
    font-size: 28px;
    line-height: 25px;
    height: 25px;
    position: relative;
    top: -2px;
    margin-right: 5px;
}
.reg_account_report {
	display: inline-flex;
	flex-wrap: wrap;
}
.reg_account_report div {
	background-color: #22C993;
	border-radius: 4px;
	background-color: #22C993;
    border-radius: 4px;
    color: #fff;
    padding: 3px 10px;
    line-height: 1.2;
    margin-bottom: 3px;
	margin-right: 2px;
}
.mb-5 {
	margin-bottom: 5px;
}
.payment-detail {
	padding: 1em 0;
    margin: 1em 0;
    border-bottom: solid 2px #ddd;
    border-top: solid 2px #ddd;
}
.total-packages .col-total .payDesc {
	font-size: 18px;
    font-family: 'Manjari-Bold';
}
.fs-12 {font-size: 12px;}
@media screen and (min-width: 840px) {
	.list__insight li:nth-child(even) {
		flex-direction: row-reverse;
	}
	.list__insight li:nth-child(even) {
		text-align: right;
	}
}
@media screen and (max-width: 340px) {
	.slide-brands.owl-carousel .owl-item img {
		width: 75%;
		height: auto;
	}
}
@media screen and (max-width: 840px) {
	.stick_invoice_left {
		flex: 0 0 70%;
		width: 70%;
		padding-left: 15px;
	}
	.stick_invoice_right {
		flex: 0 0 30%;
		width: 30%;
	}
	.body .pgwidth .register__page .field__input {
		flex:0 0 100%;
		padding:0 15px
	}
	.list__insight li .desc__layer p {
		font-size: 14px;;
	}
	.list__insight li .button-learn {
		display: none;
	}
	.button__pop {
		max-width: 250px;
		padding:15px 10px;
		border-radius: 10px;
		font-size: 16px;
	}
}
@media screen and (max-width: 520px) {
	.checkmarkonteng {
		top:15px;
		left:15px;
	}
	.agreement_register p {
		padding-left:40px;
	}
}
/* Override Bootstrap */
.form-control:focus {
	border-color: #21c38f;
}