#extra_notice{

padding: 10px;

text-align: center;

background-color: #C3DD1F;

color: #2A1E1E;

font-weight: bold;

}

#notice{

padding: 10px;

text-align: center;

background-color: #2B6EE4;

color: #fff;

}

#error{

padding: 10px;

text-align: center;

background-color: #E42B39;

color: #fff;

}

div.field input, div.field select, div.field textarea, input, select, textarea{

background-color:transparent;

}

@font-face {
	/*font-family: 'Raleway';
	src: url('/fonts/raleway/Raleway-Regular.ttf');
	font-weight: 400;*/
}

/*================================= FORM INPUT =================================*/

form{

background-color: transparent;

-moz-border-radius: 5px;

-webkit-border-radius: 5px;

border-radius: 5px;

padding: 20px;

border: 0px solid #EAEAEA;

position: relative;

}

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

body {
	/*font-family: 'Catamaran', sans-serif;
	color: #302624;*/
	background-color: #f1f1f1;
}

#line_top {

height: 5px;

background-color: #F26C4F;

}

#header, #container, #footer {

width: 1200px;

margin: 0 auto;

}

#container {

min-height: 400px;

margin-top: 15px;

margin-bottom: 40px;

}

#container_border_top {

margin-bottom: 20px;

border-top: 2px dashed #438CCA;

}

#header {
	padding-top: 8px;
	width:100%;
	background-color: #fff;
	left:0;
	top:0;
	z-index:10000;
	border-top: 5px solid #F26C4F;
	border-bottom: 2px solid #b7b6b6;
}

#div_header_member{
	float: right;
	margin-right: 1rem;
}
#div_header_member #profile_name{
  font-size: 13px;
  cursor: pointer;
}

#div_header_member div{
	float: left;
	margin-right: 5px;
}


#header-top{
	background-color: inherit;
}

#header-top #header-top-sub-content{
	border-bottom: 1px solid #ddd;
	padding-bottom: 1rem;
	margin-bottom: 1rem;
}

#header-top #div_header_social{
	float: left;
}

#header-top .header_social{
	float: left;
	margin-left: 1rem;
}

#header-top #header-top-content{
	margin: 0 auto;
	width: 1100px;
}

#header-left {

/*display: table-cell;*/

vertical-align: bottom;

}

#header-right {

/*display: table-cell;*/

}

.social-placer .tooltip{

min-width:100px;

}

#header-left img {

max-width: 300px;

max-height: 72px;

/* margin-top: 10px; */

margin-bottom: 10px;

}

#cart-artikel {

text-align: right;

}

#header_logo {

text-align: center;

font-weight: bold;

font-size: 14px;

}

.header-contact {

font-size: 12px;

border-radius: 0;

padding: 3px;

width: 40px;

text-align: center;

border: none;

}

.header-contact i {
	font-size: 12px;
}

.header-contact-1,
.header-contact-2,
.header-contact-3,
.header-contact-4,
.header-contact-5,
.header-contact-6 {
	background-color: #ffbfbf !important;
  border-radius: 5px 
}

#header_nav {

/*margin-top: 15px;*/

text-align: center;

color: white;

/*border-bottom: 2px dashed #438CCA;*/

}

#nav_mobile_menu {

display: none;

}

.header_fix{
	position: fixed;
	z-index: 1000;
	top: 0;
	border-bottom: solid 2px #ddd;
	padding-top:1rem;
	/*background-color: #fdfdfd;*/
}
/*
.header_fix #header-left img{

max-width: 98px;

max-height: 40px;

margin-bottom: 5px;

margin-top: 5px;

}

.header_fix .searching_field row{

position: fixed;

top: 5px;

}

.header_fix .searching_field {

width: 808px;

margin-top: 8px;

}

.header_fix #searching-input{

width: 771px;

}

.header_fix .social-placer,

.header_fix #header_nav{

display:none;

}*/

#footer-placer {

padding: 5px 0;

background-color: #000;

color: #fff;

position: fixed;

bottom: 0;

width: 100%;

z-index:1000000;

}

#footer-placer a{

color: #fff;

}

#footer_content_1 {

text-align: center;

/* margin-bottom: 10px; */

font-size: 10px;

float: left;

}

#footer_content_1 div {

border-right: 1px solid #6C6C72;

}

#footer_content_1 div:last-child {

border-right: 1px solid transparent;

}

#footer_content_2 {

font-size: 10px;

text-align: center;

float: right;

}

#searching-input {
}

#searching-input input {
	border-radius: 0;
	font-size: 13px;
	padding: 5px;
	box-shadow: none;
	font-style: normal !important;
}

.searching-button {

border-radius: 0;

height: 25px;

width: 100%;

background-color: #393838;

border: 1px solid #393838;

border-left: 0;

}

.searching-button:hover {

background-color: #EEE;

}

.searching-button i {

font-size: 12px;

color: #CCC;

}

#header_logo img {

max-width: 200px;

max-height: 80px;

}

#left {

width: 200px;

float: left;

margin-right: 20px;

}

#right {

width: 720px;

margin-left: 30px;

float: left;

color: #7D7D7D;

}

#right a {

color: #7D7D7D;

}

/*------------------------ Navigation Horizontal -------------------------*/

#nav_horizontal{

/*color: #8882BE;*/

text-align: center;

padding-right:00px;

}

#nav_horizontal > ul {

display: table;

margin: 0 auto;

padding: 0;

float: right;

}

#nav_horizontal > ul > li {

display: inline-block;

padding: 10px 20px 7px;

border-top: 3px solid transparent;

border-left: 2px solid transparent;

position: relative;

}

#nav_horizontal > ul > li:last-child {

padding-right: 0;

}

#nav_horizontal > ul > li:hover {

background-color: #FFF;

color: #82A1BE;

border-top: 3px solid #F26C4F;

}

#nav_horizontal > ul > li:hover a {

color: #82A1BE;

}

#nav_horizontal ul li span.main_menu_cursor_pointer{

position: absolute;

top: 12px;

right: 5px;

width: auto;

}

#nav_horizontal ul li span.main_menu_cursor_pointer:after {

cursor: pointer;

font-family: FontAwesome;

right: 10px;

content: "\f078";

font-size: 11px;

color: #ddd;

}

#nav_horizontal ul li span.main_menu_cursor_pointer:hover:after {

color: #000;

}

#nav_horizontal ul li a, #nav_horizontal ul li span {

text-decoration: none;

font-size: 14px;

font-weight: bold;

color: #666262;

}

/* sub menu 1 */

#nav_horizontal li ul{

display: none;

position: absolute;

top: 36px;

z-index: 100000;

min-width: 170px;

margin: 0 auto;

padding: 10px;

background-color: #F26B5D;

border-radius: 4px;

margin-left: -20px;

}

#nav_horizontal ul li:hover ul{

display: block;

}

#nav_horizontal ul li:hover ul li ul{ display: none;}

#nav_horizontal li ul li{

text-align: left;

display: block;

min-width: 170px;

border-bottom: 5px solid #F26B5D;

background-color: #F58376;

}

#nav_horizontal li ul li:hover{

background-color: #F26B5D;

}

#nav_horizontal ul li ul li a, #nav_horizontal ul li ul li span{

color: #FFF !important;

display: block;

margin: 0;

padding: 8px 30px;

font-size: 10pt;

font-weight: normal;

}

#nav_horizontal ul li ul li:hover a, #nav_horizontal ul li ul li:hover span{

color: #FFF;

}

/*------------------------ BANNER -------------------------*/

.banner_carousel {

left: 0px;

width: 100%;

}

.banner{

text-align: center;

margin-bottom: 5px;

}

.banner_slide_show {
	width: 100%;
	/*border: 8px solid black;*/
	margin-bottom: 5px;
	height: auto;
}

.banner_slide_show_top {
	background-color: #fff;
	height: 350px;
	margin-bottom: 5rem;
}

.banner_slide_show_right {
	width: inherit;
	border: 8px solid black;
	height: 235px;
}

.banner_slide_show_bottom {
	width: inherit;
	border: 8px solid black;
	height: inherit;
}

.banner_slide_show_left {

width: inherit;

border: 8px solid black;

height: 235px;

}

.banner_slide_show img{

max-width: 100%;

}

.banner_image_carousel {

position: relative;

padding: 0;

background-color: white;

width: 100%;

height: 350px;

border: 0px solid #ccc;

/*border-top: 2px dashed #438CCA;*/

}

.slide_show {

width: 100%;

height: auto;

margin: 0px;

padding: 0px;

display: block;

text-align: center;

background-color: transparent;

position: relative;

display: table;

}

.slide_show_top {

width: 100%;

height: inherit;

margin: 0px;

padding: 0px;

display: block;

text-align: center;

background-color: transparent;

position: relative;

display: table;

}

.slide_show_right {

width: 100%;

height: 235px !important;

margin: 0px;

padding: 0px;

display: block;

text-align: center;

background-color: transparent;

position: relative;

display: table;

}

.slide_show_bottom {

width: 100%;

height: inherit;

margin: 0px;

padding: 0px;

display: block;

text-align: center;

background-color: transparent;

position: relative;

display: table;

}

.slide_show_left {

width: 100px !important;

height: 235px !important;

margin: 0px;

padding: 0px;

display: block;

text-align: center;

background-color: transparent;

position: relative;

display: table;

}

.slide_show_placer {

display: table-cell;

vertical-align: middle;

text-align: center;

}

.image_banner_slide_show {

max-height: 235px;

}

.image_banner_slide_show_top {

max-height: 350px;

}

.image_banner_slide_show_right {

max-height: 235px;

}

.image_banner_slide_show_bottom {

}

.image_banner_slide_show_left {

max-height: 235px;

max-width: 140px;

}

.clearfix {

float: none;

clear: both;

}

.pagination {

position: relative;

bottom: 0;

text-align: center;

background-color: transparent;

padding: 8px;

margin-left: 0px;

z-index: 5;

}

.pagination a {

width: auto;

height: 15px;

margin: 0 5px 0 0;

display: inline-block;

}

.pagination a.selected {

background-position: -25px -300px;

cursor: pointer;

}

/*================================== SIDEBAR MENU ===============================*/
.modul_content {
	margin-bottom: 20px;
	border-radius: 5px;
	padding: 2rem;
	background-color: #fff;
}

.side_bar_box_head {
	padding: 10px 0;
	font-size: 16px;
	font-weight: bold;
	text-align: left;
	cursor: pointer;
	margin-bottom: 10px;
}

.side_bar_box {
	padding-right: 0px;
}

.side_bar_box ul {

}

.side_bar_box ul li {
	list-style: none;
	font-size: 12px;
	font-weight: 200;
	padding: 3px 0;
	padding-left: 20px;
	text-align: left;
}

.side_bar_box ul li ul li {

list-style: none;

font-size: 12px;

font-weight: 200;

padding: 3px 26px 3px 0;

/*text-align: right;*/

background-color:transparent !important;

}

.treeview li {

background: none;

}

.treeview .hitarea {

float: right;

margin-left: 10px;

}

.treeview li.lastCollapsable, .treeview li.lastExpandable {

background-image: none;

background-position: -64px -25px;

}

.treeview div.lastCollapsable-hitarea, .treeview div.lastExpandable-hitarea {

/*background-image: none;*/

background-position: -80px -3px;

}

/*================================= THUMB PRODUK =================================*/
.related_produk,
#index_pencarian_produk,
#index_produk{
	background-color: #fff;
	padding: 2rem;
	border-radius: 5px;
}

.produk_show{
	margin: 0;
	padding: 0;
	outline: 0;
}

.box_thumb_produk{ 
	width: 226px;
	padding: 1rem;
	padding-top: 0;
  padding-bottom: 2rem;
}

.related_produk .box_thumb_produk{ /* untuk related produk agar tampil 5 produk dalam 1 baris*/
	width: 220px;
}

.box_thumb_produk .box_thumb_image_note{ /**/
  margin-top: 1rem;
  padding: 1rem;
	top: 0;
}

.box_thumb_produk .thumb_nama_produk{
	height: 30px;
	color: #565454;
	font-size: 14px;
}

.box_thumb_produk .button_produk{/**/
	top: 100px;
	left: 0px;
	height: 30px;
	min-width: 70px;
	padding: 5px;
	font-size: 12px;
	color: #fff;
	background-color: #d9534f;
	border-color: #d43f3a;
}

.box_thumb_produk .button_produk:hover{
	background-color: #E8443F;
}

.box_thumb_produk .box_thumb_image{
	box-shadow: 1px 1px #eaeaea;
  border: 1px solid #eaeaea;
	border-radius: 5px;
	width: auto;
	height: 300px;
}
.box_thumb_produk .box_thumb_image:hover{
	outline: 1px solid #F26C4F;
}

.box_thumb_produk .box_thumb_image .center_image_wrapper {/**/
	height: 200px; /* Gunakan nilai width dari box container, box_thumb_produk*/
	width: 236px;
	vertical-align: middle;
  display: table-cell;
	bottom:0;
  text-align: center;
  margin: 0 auto;
  border-bottom: 1px solid #e2e2e2;
}

.box_thumb_produk .center_image {
	width: auto;
	height: auto;
}

.box_thumb_produk .box_thumb_image .center_image img{
	flex-shrink: 0;
  min-width: 100%;
  min-height: 100%;
  max-width: 100%;
  max-height: 200px;
  border-radius: 5px 5px 0 0;
}

.box_thumb_header {

position: relative;

width: 170px;

height: auto;

padding-bottom: 5px;

display: table-cell;

vertical-align: bottom;

text-align: left;

}

.box_thumb_header_text{

height: 40px;

}

.edit_produk_thumb {

position: absolute;

top: 100px;

right: 0;

border: 1px solid #ADADAD;

border-top-left-radius: 4px;

background-color: #8882BE;

color: #FFF;

z-index: 999999;

opacity: 0.9;

width: 60px;

text-align: center;

padding: 5px 0;

display: none;

}

.hapus_produk_thumb {

position: absolute;

top: 130px;

right: 0;

border: 1px solid #ADADAD;

border-bottom-left-radius: 4px;

background-color: #8882BE;

color: #FFF;

z-index: 999999;

opacity: 0.9;

width: 60px;

text-align: center;

padding: 5px 0;

display: none;

}

.box_add_to_cart {

font-size: 12px;

position: absolute;

top: -16px;

left: -5px;

display: none;

}

#produk_breadcrumb {

margin-bottom: 30px !important;

}

.box_thumb_produk .produk_additional_text_with_zero_stock{

display:none;

bottom: initial;

top: 69px;

left: 20px;

}

.box_center_image_and_image_note{

position: initial;

}

.related_produk{

}

/*================================= END THUMB PRODUK =================================*/

/* ============= on produk show =============== */

#content_show_produk{
	background-color: #fff;
	border-radius: 5px;
	padding: 3rem;
}


#produk_content_1{
	float: left;
	margin-right: 2rem;
	width:400px;
}

#produk_content_2{
	float: right;
	width: 650px;
	border: 0px solid #DDD;
	border-radius: 5px;
	padding: 10px;
}


/* ============= end on produk show =============== */

/*================================= SHOPPING CART ======================================*/
#div_wrapper_shopping_cart{
	background-color: #fff;
	padding: 2rem;
	border-radius: 5px;
}

.as_button,
.div_button_shopping_cart .button_form_shopping_placer input,
.div_button_shopping_cart .button_form_shopping_placer a {
	border: 1px solid #5cb85c;
	background-color: #5cb85c;
}

.as_button,
.div_button_shopping_cart .button_form_shopping_placer input:hover,
.div_button_shopping_cart .button_form_shopping_placer a:hover {
	background-color: #47a447;
}

#timeline_shopping {
	background-color: #7CC576;
	height: 35px;
}

.timeline_process {
	border-right: 1px solid #3BB878;
}

.timeline_shopping_aktif {
	background-color: #3BB878;
}

/*================================= CONTACT US ======================================*/

#contact_us_placer .media_embed {

padding: 5px;

border: 1px solid #ccc;

border-radius: 5px;

float: right;

width: 100%;

}

#contact-us {

padding-bottom: 10px;

margin-bottom: 10px;

}

#contact-web {

display:none;

}

#form-contact {

margin: 0px;

padding-left: 10px;

padding-right: 10px;

font-size: 13px;

font-weight: 100 !important;

border-radius: 5px;

font-size: 12px;

margin-top: 30px;

border-top: 1px dashed #CCC;

}

.media_embed {

padding: 5px;

border: 1px solid #ccc;

border-radius: 5px;

width: 100%;

}

#msg-form {

border-bottom: 1px solid #EAEAEA;

padding: 10px;

margin-left: -10px;

text-align: center;

font-size: 13px;

font-weight: 400 !important;

}

#form-contact label {

font-weight: 400 !important;

}

#contact-table {

border: 0px solid #FFF;

}

#contact-table td {

border-bottom: 1px solid #CCC !important;

padding: 8px 5px;

}

.text_center {

text-align: center;

}

.text_right {

text-align: right;

}

.text_left {

text-align: left;

}

.td_no {

width: 20px;

}

.box_form{

}

.right {

float: right;

margin-left: 5px;

}

.left {

float: left;

margin-right: 5px;

}

.clear {

clear: both;

}

/*================================= CSS ==========================================*/

h1, h2, h3, h4, h5 {

font-weight: 100;

}

h2{

font-size : 20pt;

}

.col-xs-12 {

min-height: 0 !important;

}

#notice {

padding: 12px;

margin-bottom: 20px;

border: 1px solid transparent;

border-radius: 4px;

color: #FFFFFF;

background-color: #1CA6ED;

border-color: #1CAEED;

text-align: center;

font-size: 11pt;

}

#error_explanation {

padding: 12px;

margin-bottom: 20px;

border: 1px solid transparent;

border-radius: 4px;

color: #a94442;

background-color: #f2dede;

border-color: #ebccd1;

text-align: center;

font-size: 11pt;

}

.image_carousel .caroufredsel_wrapper {

width: inherit !important;

height: 280px !important;

}


.artikel_placer h1 {

padding-bottom: 20px;

border-bottom: 1px dashed #CCC;

}

.button, button {

padding: 6px 12px;

margin-bottom: 0;

font-size: 13px;

font-weight: normal;

line-height: 1.42857143;

text-align: center;

white-space: nowrap;

vertical-align: middle;

cursor: pointer;

-webkit-user-select: none;

-moz-user-select: none;

-ms-user-select: none;

user-select: none;

background-image: none;

border: 1px solid transparent;

border-radius: 4px;

color: #fff;

background-color: #7EA7D8;

border-color: #46b8da;

text-decoration: none;

}

.button:hover, button:hover{

color: #fff;

background-color: #438CCA;

border-color: #269abc;

background-image: none;

}

#footer_content_1 div {

display: inline-block !important;

padding: 0 10px !important;

}

article > h1:first-child, article > .box_note {

display: none;

}

/* --------------------- GALLERY --------------------- */

.gallery_placer {

display: table-cell;

/*background: #FFF7F7;*/

height: 150px;

width: 240px;

text-align: center;

vertical-align: middle;

position: relative;

overflow: hidden;

text-overflow: ellipsis;

}

/* --------------------- END GALLERY --------------------- */

/*--------------------- Searching Field ------------------------------*/

.searching_field{

outline: 0;

width: auto;

display: block;

margin: 0;

margin-top: 3px;

background: transparent;

}

.searching_text_box input {

width: 100%;

padding: inherit;

border: 1px solid #ccc;

}

.searching_button {

display: block;

width: auto;

padding:0;

}

.searching_button .fa {

font-size: 9pt;

}