body {
    font-family: 'proximanovalight';
    margin: 0;
    padding: 0;
}

.space_image_lead{margin:1em 0; line-height:1em; padding:0 1em;}

.cont_flag{width:70%; display:block; text-align:right; margin:0 auto; margin-top:-1.5em; position:relative; z-index:999;}

.no_space_img{display:block; padding:0; line-height: 0;}
.space_pay{display: block; margin-top:12em;}
.sorry_teks{font-size:4em; line-height:1em; margin-bottom:0.5em; padding:0.2em; color:#F00;}
.new_pay_box{border:1px solid #CCC; padding:1em 1em 0 1em; background:#F2F2F2; margin-top:1em;}
.choose_box{border:1px solid #CCC; padding:0.5em 1em; background:#F2F2F2;}
.bb0_pad0{border-bottom:none; padding:0;}
.bb1F2{border-bottom:1px solid #F2F2F2;}
.bt3px{border-top:3px solid #28AD4E;}
.cart_sum_1{font-size:1.5em; padding:0.8em; background-color:#2E2D2E; color:#FFF;}
.health_teks{color:#333; padding:0em; font-size:1.5em;}
.health_teks1{color:#333; font-size:1.5em; padding:0 1em;}

.input_email{padding:1em; width:55%; font-size:1.1em; text-align:center;}
.pademail{padding:6em 4em;}

.tri_down{
	width: 0; 
	height: 0; 
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-top: 20px solid #CCC;
}

.caranya{
	width:60%;	
}

/*.grow, .grow2, .grow3 { transition: all .2s ease-in-out; }
.grow:hover { transform: scale(0.8); position: absolute; z-index:99; top:0; }
.grow2:hover { transform: scale(1); position: absolute; z-index:99; top:0; left:0; }
.grow3:hover { transform: scale(0.8); position: absolute; z-index:99; top:0; left:0; }*/

/* ACCOR */

.ac-container{
	width: 100%;
	margin:0;
	text-align: left;
}
.ac-container label{
	padding:0;
	position: relative;
	z-index: 20;
	display: block;
	height: 100%;
	cursor: pointer;
	color: #777;
	line-height: 0;
}
.ac-container label:hover{
	background: #fff;
}
.ac-container input:checked + label,
.ac-container input:checked + label:hover{
	text-shadow: 0px 1px 1px rgba(255,255,255, 0.6);
	box-shadow: 
		0px 0px 0px 1px rgba(155,155,155,0.3), 
		0px 2px 2px rgba(0,0,0,0.1);
}
.ac-container label:hover:after,
.ac-container input:checked + label:hover:after{
	content: '';
	position: absolute;
	width:100%;
	height: 100%;
	right: 0;
	top: 0;
	background: transparent url(../images/arrow_down.png) no-repeat center center;	
}
.ac-container input:checked + label:hover:after{
	background-image: url(../images/arrow_up.png);
}
.ac-container input{
	display: none;
}
.ac-container article{
	background: rgba(255, 255, 255, 0.5);
	margin-top: -1px;
	overflow: hidden;
	height: 0px;
	position: relative;
	z-index: 10;
	-webkit-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
	-moz-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
	-o-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
	-ms-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
	transition: height 0.3s ease-in-out, box-shadow 0.6s linear;
}
.ac-container article p{
	padding: 0;
}
.ac-container input:checked ~ article{
	-webkit-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
	-moz-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
	-o-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
	-ms-transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
	transition: height 0.5s ease-in-out, box-shadow 0.1s linear;
	box-shadow: 0px 0px 0px 1px rgba(155,155,155,0.3);
	border-bottom:1px #CCCCCC solid;
}
.ac-container input:checked ~ article.ac-small{
	height:100%;
}
.ac-container input:checked ~ article.ac-medium{
	height: 180px;
}
.ac-container input:checked ~ article.ac-large{
	height: 230px;
}

/* END ACCOR */

/* TABLE DIV */
.tbl
{
	display: table;
}
.ttl
{
	display: table-caption;
	text-align: center;
	font-weight: bold;
	font-size: larger;
}
.hdg
{
	display: table-row;
	font-weight: bold;
	text-align: center;
}
.rw
{
	display: table-row;
}
.cl
{
	display: table-cell;
	padding: 0px 15px 0px 0px;
	text-align:left;
}
.cl_end
{
	display: table-cell;
	padding: 0px;
	text-align:left;
}
/* END TABLE DIV */

.el {
    position: relative;
    top: 0;
    width: 100%;
    margin: 0 auto;
    transition: all ease 500ms;
    text-align: center;
    padding: 1em 0;
    z-index: 100;
}

.num_table {
    vertical-align: middle;
    background-color: #333;
    color: #FFF;
    padding: 0 1em;
    text-align: center;
}

.cnt_table {
    vertical-align: middle;
    background-color: #f2f2f2;
    color: #2E2D2E;
    padding: 0.7em 0.8em;
}

.center_wrapper {
    display: table;
}

.center_container {
    display: table-cell;
    vertical-align: middle;
}

.center_container a {
    text-decoration: none;
    color: #666;
}

.center_container a:hover {
    text-decoration: underline;
    color: #333;
}

.copyright {
    text-align: center;
    padding: 10px 1em;
}

.copyright a {}

.addr_foot {
    font-size: 1.2em;
    line-height: 1.2em;
}

.link_website {
    font-size: 1em;
    margin: 1em 0;
}

.link_website a {
    text-decoration: none;
    color: #666;
}

.link_website a:hover {
    text-decoration: underline;
    color: #333;
}

.button_example {
    border: 1px solid #128e2c;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-size: 2.5em;
    font-family: arial, helvetica, sans-serif;
    padding: 10px 30px 10px 30px;
    text-decoration: none;
    display: inline-block;
    text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.3);
    font-weight: bold;
    color: #FFFFFF;
    background-color: #18C03C;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#18C03C), to(#128F2D));
    background-image: -webkit-linear-gradient(top, #18C03C, #128F2D);
    background-image: -moz-linear-gradient(top, #18C03C, #128F2D);
    background-image: -ms-linear-gradient(top, #18C03C, #128F2D);
    background-image: -o-linear-gradient(top, #18C03C, #128F2D);
    background-image: linear-gradient(to bottom, #18C03C, #128F2D);
    filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#18C03C, endColorstr=#128F2D);
}

.button_example:hover {
    border: 1px solid #0D6921;
    background-color: #12932e;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#12932e), to(#0c621f));
    background-image: -webkit-linear-gradient(top, #12932e, #0c621f);
    background-image: -moz-linear-gradient(top, #12932e, #0c621f);
    background-image: -ms-linear-gradient(top, #12932e, #0c621f);
    background-image: -o-linear-gradient(top, #12932e, #0c621f);
    background-image: linear-gradient(to bottom, #12932e, #0c621f);
    filter: progid: DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#12932e, endColorstr=#0c621f);
}

.join_text {
    font-size: 3em;
    color: #FFF;
}

.kepal_text {
    font-size: 2em;
    color: #FFF;
    line-height: 4em;
}

.join_now {
    text-align: center;
    background-color: #333;
    padding: 4em 0;
}


/* Back to TOP */

.cd-top {
    display: inline-block;
    position: fixed;
    z-index: 100;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
	border-radius:50px;
    /* image replacement properties */
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    background: url(../../images/top.png) rgba(43, 43, 43, 0.8) no-repeat center 50%;
    visibility: hidden;
    opacity: 0;
    color: #FFF;
    -webkit-transition: opacity .3s 0s, visibility 0s .3s;
    -moz-transition: opacity .3s 0s, visibility 0s .3s;
    transition: opacity .3s 0s, visibility 0s .3s;
}

.cd-top.cd-is-visible,
.cd-top.cd-fade-out,
.no-touch .cd-top:hover {
    -webkit-transition: opacity .3s 0s, visibility 0s 0s;
    -moz-transition: opacity .3s 0s, visibility 0s 0s;
    transition: opacity .3s 0s, visibility 0s 0s;
}

.cd-top.cd-is-visible {
    /* the button becomes visible */
    visibility: visible;
    opacity: 1;
}

.cd-top.cd-fade-out {
    /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
    opacity: .5;
}

.no-touch .cd-top:hover {
    background-color: #878787;
    opacity: 1;
}

.for_desktop {
    display: block;
}

.for_desktop_in {
    display: inline;
}

.for_desktop_tbl_row {
    display: table-row;
}

.for_mobile, .for_mobile_in, .for_mobile_tbl_row {
    display: none;
}

/* THE LAYOUT */

#wrapper_top {
    margin: 0em 0 3em 0;
    padding: 0;
}

#container_box {
    background-color: #FFF;
    width: 70%;
    margin: 0 auto;
    padding: 0;
    box-shadow: 0 0px 6px #999;
}

#container_form {
    background-color: #F0F0F0;
    width:50%;
    margin: 0 auto;
    box-shadow: 0 0px 6px #999;
}

#container_form_title {
    width:50%;
    margin: 0 auto;
}
.cont_in_form{
	padding:2em 3em;
}
.col_l{width:25%;}
.col_m{width:63%;}

.padr{ padding-right:0;}

.hei_prod{width:100%; min-height:15em;}

.prod_cell{ font-size:1.3em; background-color:#F0F0F0; padding:1em; margin-top:-6px; }
.user_cell{ font-size:1.3em; background-color:#2E2D2E; padding:1em; color:#FFF; }

.bg_1 {
    background-color: #F2F2F2;
}

.bg_2 {
    background-color: #2E2D2E;
    color: #FFF;
}

.link_blue a { color:#00F; text-decoration:none; }
.link_blue a:hover { color:#2E2D2E; text-decoration:underline; }

.quote_1_container {
    background-color: #F2F2F2;
    color: #2E2D2E;
    padding: 2em 0;
}

.quote_2_container {
    background-color: #2E2D2E;
    color: #FFF;
    padding: 1.5em 1.5em 2em 1.5em;
}

.fs0k5em {
    font-size: 0.5em;
}

.fs0k7em {
    font-size: 0.7em;
}

.fs1em {
    font-size: 1em;
}

.fs1k5em {
    font-size: 1.5em;
}

.fs2em {
    font-size: 2em;
}

.fs3em {
    font-size: 3em;
}

.fs4em {
    font-size: 4em;
}

.fs4em_apel {
    font-size: 4em;
}

.fs4em_bing {
    font-size: 4em;
}

.fs5k1em {
    font-size: 5.1em;
}

.pad0em1 {
    padding: 0 1em;
}

.pad0em2 {
    padding: 0 2em;
}

.pad1em0 {
    padding: 1em 0;
}

.pad1em1 {
    padding: 1em 1em;
}

.pad2em0 {
    padding: 2em 0;
}

.pad2em1 {
    padding: 2em 1em;
}

.pad4em0 {
    padding: 4em 0;
}

.pad6em0 {
    padding: 6em 0;
}

.pad6em2 {
    padding: 6em 2em;
}

.pad4em2 {
    padding: 4em 2em;
}

.lh0 {
    line-height: 0;
}

.det_prod {
    text-align: center;
    line-height: 1.5em;
    padding: 0 3em;
    width: 12em;
}

.segi3_1 {
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 20px solid #CCC;
}

.segi3 {
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 20px solid #CCC;
    position: absolute;
    top: 0;
    left: 0;
}

.segi4 {
    width: 20px;
    height: 20px;
    background-color: #CCC;
    position: absolute;
    top: 0;
    left: 0;
}

.segisegi {
    position: absolute;
    bottom: 0;
    right: -5em;
}

.segisegi_top {
    position: absolute;
    top: 0;
    right: -14em;
}

.segisegi_btm {
    position: absolute;
    bottom: 0;
    right: -14em;
}

.segidetail {
    position: absolute;
    top: 0;
    right: 0;
    background-color: rgba(46, 45, 46, 0.7);
    color: #FFF;
    padding: 3px 6px;
    width: auto;
}

.arrow_box_no {
	position: relative;
	background: #E5E5E5;
	border: 4px solid #D6D6D6;
	padding:2em 1em;
	color:#2E2D2E;
}

.arrow_box {
	position: relative;
	background: #E5E5E5;
	border: 4px solid #D6D6D6;
	padding:1.5em 1em;
	color:#2E2D2E;
}
.arrow_box_trans {
	position: relative;
	background: transparent;
	border: none;
	padding:1.5em 1em;
	color:#2E2D2E;
}
.arrow_box:after, .arrow_box:before, .arrow_box_trans:after, .arrow_box_trans:before {
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.arrow_box:after, .arrow_box_trans:after {
	border-color: rgba(136, 183, 213, 0);
	border-top-color: #D6D6D6;
	border-width: 30px;
	margin-left: -30px;
}
.arrow_box:before, .arrow_box_trans:before {
	border-color: rgba(194, 225, 245, 0);
	border-top-color: #D6D6D6;
	border-width: 36px;
	margin-left: -36px;
}

.angka_penc {
	padding:10px 15px; background-color:#2E2D2E; color:#FFF; text-transform: lowercase;
}

.tahun_penc {
	padding:10px 15px 10px 0; background-color:#f2f2f2; color:#2E2D2E; text-transform: lowercase;
}

.tahun_penc_w {
	padding:10px 15px 10px 0; background-color:#FFF; color:#2E2D2E; text-transform: lowercase;
}

.join_wrap{ padding:1em 0; margin:3em 0;}
.join_wrap_mp{ padding:1em 0; margin:1em 0;}
.join_mp a {
	padding:0.5em 1em; background-color:#0C3; color:#FFF; text-decoration:none; font-size:2em;
}
.join_mp a:hover {
	padding:0.5em 1em; background-color: #090; color:#FFF; text-decoration:none; font-size:2em;
}

.join a {
	padding:0.5em 1em; background-color:#0C3; color:#FFF; text-decoration:none; font-size:2em;
}

.join a:hover {
	padding:0.5em 1em; background-color: #090; color:#FFF; text-decoration:none; font-size:2em;
}

.join_wrap_langkah{ margin:0; padding:2em 1em; display:block;}
.join_langkah a {
	padding:1em 1em; background-color:#0C3; color:#FFF; text-decoration:none; font-size:2em;
}
.join_langkah a:hover {
	padding:1em 1em; background-color: #090; color:#FFF; text-decoration:none; font-size:2em;
}

.hidden {
    height: 0px;
}
.show {
    height: 400px;
    transition: height 0.5s;
}

/*RIBBON*/

#ribbon {
	width: 180px;
	height: 150px;
	margin-top: 0px;
	position: relative;
	overflow: hidden;
}

#ribbon .inset {
	width: 200px;
	height: 55px;
	position: absolute;
	top: -50px;
	left: -10px;
	z-index: 5;
	
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
	
	background: rgba(0,0,0,0.3);
	
	box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.3);
}

#ribbon .container1 {
	position: relative;
	width: 100px;
	height: 150px;
	overflow: hidden;
	margin: 0 auto;
	border-left: 1px solid #363636;
	border-right: 1px solid #363636;
}

#ribbon .base1 {
	height: 100px;
	width: 100px;
	
	background: rgb(46,45,46);
	background: -moz-linear-gradient(top,  rgba(46,45,46,1) 0%, rgba(72,72,74,1) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(46,45,46,1)), color-stop(100%,rgba(72,72,74,1)));
	background: -webkit-linear-gradient(top,  rgba(46,45,46,1) 0%,rgba(72,72,74,1) 100%);
	background: -o-linear-gradient(top,  rgba(46,45,46,1) 0%,rgba(72,72,74,1) 100%);
	background: -ms-linear-gradient(top,  rgba(46,45,46,1) 0%,rgba(72,72,74,1) 100%);
	background: linear-gradient(top,  rgba(46,45,46,1) 0%,rgba(72,72,74,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c73b3c', endColorstr='#b8201f',GradientType=0 );

	position: relative;
	z-index: 2;
}

#ribbon .base1 img {
	position:absolute;
	left:23px;
	top:15px;
}

#ribbon .base1:after {
	content: '';
	position: absolute;
	top: 0;
	width: 86px;
	left: 6px;
	height: 140px;
	border-left: 1px dashed #58585C;
	border-right: 1px dashed #58585C;
}

#ribbon .base1:before {
	content: '';
	position: absolute;
	top: 0;
	width: 86px;
	left: 7px;
	height: 140px;
	border-left: 1px dashed #363638;
	border-right: 1px dashed #363638;
}

#ribbon .left_corner {
	width: 100px;
	height: 100px;
	background: #48484A;
	position: absolute;
	bottom: 20px;
	left: -50px;
	z-index: 1;
	
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}

#ribbon .right_corner {
	width: 100px;
	height: 100px;
	background: #48484A;
	position: absolute;
	bottom: 20px;
	right: -50px;
	z-index: 1;
	
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	transform: rotate(45deg);
}
/*END RIBBON*/

.accor_prod {
	margin:0;
	padding:0;
	text-align:center;
}
.accor_prod span {
	background: url(images/caret_down.png) no-repeat center;
	background-size: 12px;
	opacity:0.7;
	cursor:pointer;
	margin:0 0 1px 0;
	padding:0px 10px;
	transform:all 1s;
}
.accor_prod span.current {
	background: url(images/caret_up.png) no-repeat center;
	background-size: 12px;
	opacity:0.6;
	cursor:pointer;
}
.accor_prod div.pane {
	padding:0;
}		

.accor_prod2 {
	margin:0;
	padding:0;
	text-align:center;
	color:#000;
}
.accordion-toggle {cursor: pointer;background: url(images/caret_down.png) no-repeat center;background-size: 12px;opacity:0.6;}
.accordion-content {display: none;}
.accordion-content.default {display: block;}

.accordion-toggle2 {cursor: pointer; width:100%; margin-top:3px;}
.accordion-content2 {display: none;}
.accordion-content2.default {display: block; }

.line_logo{position:absolute; top:63px; left:20px; color:#FFF; z-index:20; text-align:center; line-height:1em; height:1px; width:60%; border-top:1px dashed #58585C;}
.teks_logo_shop{position:absolute; top:70px; left:25px; color:#FFF; z-index:20; text-align:center; line-height:1em;}
.fixed_logo_shop{position:fixed; top:0px; left:0px; z-index:25;}

.prod_cat{color:#333; padding:0em 1em 0em 0; font-size:1.5em;}
.line_more{height:1px; width:100%; background-color:#CCC; margin:1em 0;}

.next_teks{background-color:#8AE4A4; color:#FFF; padding:0.5em 1em; font-size:1.5em;}
.next_icon{background-color:#28AD4E; color:#FFF; padding:0.5em 1em; font-size:1.5em;}
.fail_icon{background-color:#F00; color:#FFF; padding:0.5em 1em; font-size:1.5em;}


.posit_no{background-color:#333; color:#FFF; padding:0.5em 1em; font-size:1.5em;}
.posit_teks{background-color:#F2F2F2; color:#333; padding:0.5em 1em; font-size:1.5em;}

.no_prod{text-align:right; padding-right:0;}

.combo_qty{position:relative; height:50px;}
.combo_form{width:60px; position:absolute; right:0;}

.promot{position:absolute; right:0; top:0; background:rgba(17,143,44,0.7); padding:0.7em 1em; color:#FFF;}
.sect_70{width:70%; margin:0 auto;}
.sect_50{width:50%; margin:0 auto;}
.sect_40{width:40%; margin:0 auto;}

.accor_cont2_abs{background-color:#333; color:#FFF; position:absolute; top:4.3em; right:0; padding:0.5em 2em; z-index:50;}

.teks_prod{margin:0; padding:0; font-size:1.3em;}

.head_tab_cart{padding:1em 3px; background-color:#F2f2f2; text-align:center; vertical-align: middle;}
.row_tab_cart{padding:1em 3px; text-align:center;}

label > input{ /* HIDE RADIO */
  visibility: visible; /* Makes input not-clickable */
  position: relative; /* Remove input from document flow */
}
label > input + img{ /* IMAGE STYLES */
  cursor:pointer;
  border:2px solid transparent;
}
label > input:checked + img{ /* (RADIO CHECKED) IMAGE STYLES */
  border:2px solid #f00;
}

.cl_tab_sum
{
	display: table-cell;
	text-align:left;
	vertical-align:middle;
	padding:7px 3px;
	border-bottom:1px #F2F2F2 solid;
}

.cl_tab_sum_1
{
	display: table-cell;
	vertical-align:middle;
	padding:7px 3px;
}

.bg_sum {background-color:#E1E1E1;}
.bg_sub_sum {background-color: #F2F2F2 ;}

.cl_tab_sum_sum
{
	display: table-cell;
	vertical-align:middle;
	padding:7px 3px;
	font-weight:bold;
	font-size:1.2em;
}

.cl_tab_sum_4
{
	display: table-cell;
	vertical-align:middle;
	padding:7px 3px;
	font-weight:bold;
	font-size:1.2em;
	border-bottom:1px #F2F2F2 solid;
}

.prod_desc_2{ line-height:1em; max-width:20em;}
.value_center{ text-align:center; }
.value_right{ text-align:right; padding-right:1em; }

.remove_sum
{
	background-color: #F00;
	border:#F00 1px solid;
	padding:0 1em;
}

/* hide input */
.ship input.radio:empty {
	margin-left: -999px;
}

/* style label */
.ship input.radio:empty ~ label {
	position: relative;
	line-height: 2.5em;
	text-indent: 3.25em;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border:1px solid #CCC;
	padding-right:1em;
}

.ship input.radio:empty ~ label:before {
	position: absolute;
	display: block;
	top: 0;
	bottom: 0;
	left: 0;
	content: '';
	width: 2.5em;
	background: #D1D3D4;
}

/* toggle hover */
.ship input.radio:hover:not(:checked) ~ label:before {
	content:'\2714';
	text-indent: .9em;
	color: #C2C2C2;
}

.ship input.radio:hover:not(:checked) ~ label {
	color: #888;
}

/* toggle on */
.ship input.radio:checked ~ label:before {
	content:'\2714';
	text-indent: .9em;
	color: #FFF;
	background-color:#28AD4E;
	border:1px solid #28AD4E;
}

.ship input.radio:checked ~ label {
	color: #FFF;
	background-color:#28AD4E;
	border:1px solid #28AD4E;
}

/* hide input */
.ship_pick input.radio:empty {
	margin-left: -999px;
}

/* style label */
.ship_pick input.radio:empty ~ label {
	position: relative;
	line-height: 2.5em;
	text-indent: 3.25em;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border:1px solid #CCC;
	padding-right:1em;
}

.ship_pick input.radio:empty ~ label:before {
	position: absolute;
	display: block;
	top: 0;
	bottom: 0;
	left: 0;
	content: '';
	width: 2.5em;
	background: #D1D3D4;
}

/* toggle hover */
.ship_pick input.radio:hover:not(:checked) ~ label:before {
	content:'\2714';
	text-indent: .9em;
	color: #C2C2C2;
}

.ship_pick input.radio:hover:not(:checked) ~ label {
	color: #888;
}

/* toggle on */
.ship_pick input.radio:checked ~ label:before {
	content:'\2714';
	text-indent: .9em;
	color: #FFF;
	background-color:#28AD4E;
	border:1px solid #28AD4E;
}

.ship_pick input.radio:checked ~ label {
	color: #FFF;
	background-color:#28AD4E;
	border:1px solid #28AD4E;
}

/* hide input */
.payment_4 input.radio:empty {
	margin-left: -999px;
}

/* style label */
.payment_4 input.radio:empty ~ label {
	position: relative;
	line-height: 2.5em;
	text-indent: 3.25em;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border:1px solid #CCC;
	padding-right:1em;
	color:#CCC;
}

.payment_4 input.radio:empty ~ label img {
	filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
	filter: gray; /* IE6-9 */
	-webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
}


.payment_4 input.radio:empty ~ label:before {
	position: absolute;
	display: block;
	top: 0;
	bottom: 0;
	left: 0;
	content: '';
	width: 2.5em;
	background: #D1D3D4;
}

/* toggle hover */
.payment_4 input.radio:hover:not(:checked) ~ label:before {
	content:'\2714';
	text-indent: .9em;
	color: #C2C2C2;
}

.payment_4 input.radio:hover:not(:checked) ~ label {
	color: #888;
}

/* toggle on */
.payment_4 input.radio:checked ~ label:before {
	content:'\2714';
	text-indent: .9em;
	border:1px solid #C2C2C2;
	color:#2E2D2E;
}

.payment_4 input.radio:checked ~ label {
	background-color:#F2F2F2;
	border:1px solid #C2C2C2;
	color:#2E2D2E;
}

.payment_4 input.radio:checked ~ label img {
	filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */
	filter: gray; /* IE6-9 */
	-webkit-filter: grayscale(0%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
}

.box_hide{
	display: none;
}

.star_red{ color:#F00; font-size:1.3em;}

.step_bottom{float:left; position:relative; margin-right:1em; margin-top:1em;}
.step_back_next{float:left; position:relative; margin-top:1em;}

.slc_one{float:left; margin-right:1em; margin-top:1em;}
.rad_self{float:left; margin-right:1em; margin-top:-1.5em;}
.rad_new{float:left; margin-right:1em; margin-top:-1.5em;}
.must_fill{float:right; margin-top:1em;}
.teks_add{color:#999; font-weight:lighter; font-size:14px;}
.teks_add_tiny{color:#999; font-weight:lighter; font-size:12px;}
.regis_teks{font-size:3.5em; font-weight:bold; padding:0 0 0.5em 0;}
.footer_thanks{padding-top:3em; line-height:1.5em; color:#999;}
.remarks_thanks{width:90%; margin:0 auto; background-color:#FFFFFF; border:#D2D2D4 solid 1px; border-top:0; padding:1em 2em;}
.order_thanks{width:90%; margin:0 auto; background-color:#F2F2F2; border:#D2D2D4 solid 1px; padding:1em 2em;}
.thanks_purc{font-size:2.5em; padding:0 0 1em 0; line-height:1.2em;}
.thanks_box{width:100%; padding:5em 2em; margin:3em 0;}
.namaAnda{ font-size:1.5em; }

.pinMember{ width:70%; margin:0 auto; }

@media only screen and (min-width: 768px) {
    .cd-top {
        height: 60px;
        width: 60px;
        right: 80px;
        top: 30px;
    }
	.pinMember{ width:70%; margin:0 auto; }
}

@media only screen and (min-width: 1024px) {
    .cd-top {
        height: 60px;
        width: 60px;
        right: 80px;
        top: 30px;
    }
	.pinMember{ width:70%; margin:0 auto; }
}

@media only screen and (max-width: 480px) {
	.pinMember{ width:100%; margin:0 auto; }
    .cd-top {
        height: 60px;
        width: 60px;
        right: 10px;
        top: 10px;
    }
    .center_wrapper {
        display: block;
    }
    .center_container {
        width: 100%;
        display: inline-block;
    }
    .for_desktop, .for_desktop_tbl_row, .for_desktop_in {
        display: none;
    }
    .for_mobile {
        display: block;
    }
	.for_mobile_tbl_row {
		display:table-row;		
	}
    .for_mobile_in {
        display: inline;
    }
    #wrapper_top {
        margin: 0em 0 0em 0;
        padding: 0;
    }
    #container_box {
        width: 100%;
        margin: 0 auto;
        padding: 0;
        box-shadow: none;
    }
	#container_form {
		background-color: #F0F0F0;
		width:95%;
		margin: 0 auto;
		box-shadow: 0 0px 6px #999;
	}
	#container_form_title {
		width:95%;
		margin: 0 auto;
	}
	.cont_in_form{
		padding:2em 2em;
	}
	.cl
	{
		display: table-cell;
		padding: 0;
		text-align:left;
	}
	.cl_hide
	{
		padding: 0;
		text-align:left;
	}
	.col_l{width:30%;}
	.col_m{width:70%;}
	.col_r{width:0%;}
    .quote_1_container {
        background-color: #F2F2F2;
        color: #2E2D2E;
        padding: 2em 1em;
    }
    .quote_2_container {
        padding: 1.5em 1.5em 2em 1.5em;
    }
    .fs2em {
        font-size: 1.5em;
    }
    .fs3em {
        font-size: 2em;
    }
    .fs4em {
        font-size: 3em;
    }
    .fs4em_apel {
        font-size: 1em;
    }
    .fs4em_bing {
        font-size: 2em;
    }
    .pad4em2 {
        padding: 2em 1em;
    }
    .det_prod {
        text-align: center;
        line-height: 1em;
        padding: 3em;
        width: auto;
    }
	.hei_prod{width:100%; min-height:0em;}
	
	.rad_br{line-height: 2.5em; text-indent: 3.25em; position: relative;}
	
	.ship_pick_loc {
		position: relative;
		line-height: 2.5em;
		margin-left: 3.25em;
		cursor: pointer;
		-webkit-user-select: none;
		-moz-user-select: none;
		-ms-user-select: none;
		user-select: none;
		border:1px solid #CCC;
		padding-right:1em;
	}
	.next_teks{background-color:#8AE4A4; color:#FFF; padding:0.5em 1em; font-size:1.5em;}
	.next_icon{background-color:#28AD4E; color:#FFF; padding:0.5em 1em; font-size:1.5em;}
	.fail_icon{background-color:#F00; color:#FFF; padding:0.5em 1em; font-size:1.5em;}
	.sect_70{width:80%; margin:0 auto;}
	.posit_no{background-color:#333; color:#FFF; padding:0.5em 1em; font-size:1.5em;}
	.posit_teks{background-color:#F2F2F2; color:#333; padding:0.5em 1em; font-size:1.5em;}
	.head_tab_cart{padding:1em 3px; background-color:#F2f2f2; text-align:center; vertical-align: middle;}
	.marg_t1em{margin-top:3em;}
	.logo_m{background-color:#2E2D2E; padding:1em 0; position:fixed; top:0; z-index:99; width:100%;}

	.slc_one{margin-right:1em; margin-top:1em; display:block; width:100%;}
	.rad_self{margin-right:1em; margin-top:-1.5em; display:block; width:100%;}
	.rad_new{float:left; margin-right:1em; margin-top:-1.5em; display:block; width:100%;}
	.must_fill{float:right; margin-top:1em; font-size:1em;}
	.regis_teks{font-size:2.5em; font-weight:bold; text-align:center; padding:0 0 1em 0;}
	.sect_40, .sect_50 {width:90%; margin:0 auto;}

	.el {
		position: relative;
		top: 0;
		width: 100%;
		margin: 0 auto;
		transition: all ease 500ms;
		text-align: center;
		padding: 0.5em 0;
		z-index: 100;
	}
	
	#logo-img img{ width:40px; }
	
	.space_pay{display: block; margin-top:20em;}
	.health_teks{color:#333; padding:0em; font-size:1.5em;}
	.health_teks1{color:#333; font-size:1.5em; padding:0 1em;}
	.new_pay_box{border:1px solid #CCC; padding:1em 1em 0 1em; background:#F2F2F2; margin-top:1em;}
	.choose_box{border:1px solid #CCC; padding:0.5em 1em; background:#F2F2F2;}

	.arrow_box_no {
		position: relative;
		background: #E5E5E5;
		border: 4px solid #D6D6D6;
		padding:1.5em 1em;
		margin:0 1em;
		color:#2E2D2E;
	}
	.arrow_box {
		position: relative;
		background: #E5E5E5;
		border: 4px solid #D6D6D6;
		padding:1.5em 1em;
		margin:0 1em;
		color:#2E2D2E;
	}
	.arrow_box:after, .arrow_box:before {
		top: 100%;
		left: 50%;
		border: solid transparent;
		content: " ";
		height: 0;
		width: 0;
		position: absolute;
		pointer-events: none;
	}
	
	.arrow_box:after {
		border-color: rgba(136, 183, 213, 0);
		border-top-color: #D6D6D6;
		border-width: 20px;
		margin-left: -20px;
	}
	.arrow_box:before {
		border-color: rgba(194, 225, 245, 0);
		border-top-color: #D6D6D6;
		border-width: 26px;
		margin-left: -26px;
	}
	.caranya{
		width:100%;	
	}
	.input_email{padding:1em; width:80%; font-size:1em; text-align:center;}
	.pademail{padding:6em 2em;}

	.join a {
		padding:0.5em 0.5em; background-color:#0C3; color:#FFF; text-decoration:none; font-size:1.5em;
	}
	
	.join a:hover {
		padding:0.5em 0.5em; background-color: #090; color:#FFF; text-decoration:none; font-size:1.5em;
	}
	.namaAnda{ font-size:1em; }
	.join_wrap_langkah{ margin:0; padding:1em 1em; display:block;}
	.join_langkah a {
		padding:1em 1em; background-color:#0C3; color:#FFF; text-decoration:none; font-size:1em;
	}
	.join_langkah a:hover {
		padding:1em 1em; background-color: #090; color:#FFF; text-decoration:none; font-size:1em;
	}
	.join_mp a {
		padding:1em 1em; background-color:#0C3; color:#FFF; text-decoration:none; font-size:1em;
	}
	.join_mp a:hover {
		padding:1em 1em; background-color: #090; color:#FFF; text-decoration:none; font-size:1em;
	}
	.cont_flag{width:90%; display:block; text-align:right; margin:0 auto; margin-top:-1.5em; position:relative; z-index:999;}
}


/* -- */

.title {
    font-size: 3em;
    text-align: center;
    margin: 1em 0;
}

.button {
    background: linear-gradient(to bottom, #0099ff 0%, #0099ff 54%);
    width:300px;
    height:300px;
    border: none;
    color: white;
    padding: 20px;
    text-align: center;
    text-decoration: none;
    display: block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
}
.button1 {border-radius: 2px;}
.button2 {border-radius: 4px;}
.button3 {border-radius: 8px;}
.button4 {border-radius: 12px;}
.button5 {border-radius: 50%;}