@charset "utf-8";
/* Layout */
/*
#page { padding-top:70px; }
#page.logedin { padding-top:0px; }*/
#topnav
{ z-index:10; }
#top_wrap { margin-bottom:10px; padding-top:6px; padding-bottom:6px; }
#breadcrumbs-wrap
{
	background-color:#eee;
	padding:4px 0;
	border-bottom:1px solid #eee;
}

.breadcrumb
{ margin:0px; padding:0px; line-height:28px; height:28px; }
.logo-wrap
{ padding-top:16px; padding-bottom:16px;  }
#logo .buttons { background-color:#F5F5F5; padding:10px; border-radius:4px; }
#logo .buttons.visible-sm { padding:5px; border-radius:4px; margin-top:10px; }
#logo .visible-sm .btn { margin:0; }
@media (min-width: 768px) 
{
   #mid_wrap { position:relative; top:-24px; }
}
@media (min-width: 1080px) 
{
  #mid_wrap { top:-30px; }
}
.page-list .page
{ margin-bottom:16px; }
.page-list .buttons 
{ margin-top:4px; }

.foot-menus
{
	padding-top:20px;
}
.BotInfo
{ border-top:2px solid #cfcfcf; font-size:12px; }


body.print div#mid
{ background:#fff; float:left; }

.left
{ float:left; }
.right
{ float:right; }

.ccm-image-block {
    display: block;
    height: auto;
    max-width: 100%;
	margin-bottom:14px;
}

.page-image
{ margin-bottom:14px; }
.SocialShare .facebook,
.SocialShare .google,
.SocialShare .tweeter,
.SocialShare .linkedin
{
	display:inline-block;
	margin-right:8px;
}
.SocialShare .facebook
{
	position:relative;
	top:-4px;
}
/* Layout End */
.CarousellImage
{
	margin-bottom:-260px;
}
.CarousellText
{
	position: relative;
    z-index: 2;
	overflow:hidden;
	height:260px;
}
.CarousellText .padding
{
	height:240px;
	max-width:40%;
	background-color: #fff;
    border-radius: 6px;
    color: #000;
    display: inline-block;
    float: right;
    font-size: 18px;
    margin-right: 30px;
    opacity: 0.7;
    padding: 10px 20px;
	text-shadow:0px 0px 5px #fff;
	text-transform:uppercase;
}
/* Layout END */

/* Header */

.social-media-btn {
  color: #5d6366;
}

/* Header END */

/* Main */
/* HTML Tag Redefinition */
html, body {height: 100%; }
label { font-weight:bold; display:block; padding-top: 10px; }
fieldset { border:1px solid #ccc;}
/* error text class optionally provided by theme */
div.ccm-error-response {color: #f00; margin-bottom: 12px}
/* Page Elements */
.pagingNav{ margin:16px 0px 8px 0px}
.pagination{ text-align:center; color:#bbb; padding-top:4px}
.pagination .pageRight{width:20%; float:right; text-align:right}
.pagination .pageLeft{width:20%; float:left; text-align:left}
/* MISC STYLES & SHORTCUTS */
div.code {border: 1px solid #ddd; background: #eee; padding: 10px}
div.spacer,div.ccm-spacer{ clear:both; font-size:1px; line-height:1px }
.noTopSpace{margin-top:0px; padding-top:0px}



/* Print Style */
body.print
{
	background-color:transparent;
	background-image:none;
	text-align:left;
}
body.print div#page
{
	background-color:transparent;
	background-image:none;
}
body.print div#page div#mid
{
	background-color:transparent;
	background-image:none;
}
div#mid_content_print
{ background:transparent; width:660px; float:left; }

div#mid_content_print div.mid_content_padding
{ padding:0px; }

div#mid_content_print div.block_title_padding
{ border-top:1px solid #ccc; }
/* Print Style End */

/* Products list style */
table.items_list
{ width:100%; }
div.items_list .title *
{ 
	color:#616161;
	font-size:18px;
	overflow:hidden;
	white-space:nowrap;
}

div.items_list .product div.description
{ padding:0px; margin:0px; }
div.items_list .product .description *
{ 
	color:#616161;
	font-size:12px;
	font-weight:normal;
	line-height:normal;
}

div.items_list td.list_item
{ padding-bottom:10px; }
div.items_list td.list_item.first
{ padding-left:0px; }

div.items_list div.list_item div.padding
{
	border-bottom:1px solid #C8C8C8; 
	border-right:1px solid #C8C8C8; 
	padding-bottom:10px;
	padding-right:10px;
}

div.items_list td.h-space { width:10px; }
/* Product Detail */

div.product div.product_facts
{ border-bottom:1px dotted #979797; padding-bottom:10px; }

p.description .product_document
{ float:right; font-weight:normal; font-size:11px; text-align:right; margin-left:30px; }
.product_document td
{ height:22px; line-height:22px; vertical-align:middle; } 
div.product div.left
{ width:440px; }

.center
{ text-align:center; }
.PageListItem
{ margin-bottom:30px; }
.PageListItem .image
{ margin-bottom:12px; }

.Portofolio {
  position: relative;
  margin-bottom: 14px;
}
.Portofolio a
{ background: rgba(255,255,255,0.1); transition: background 1s ease-out; display:block; }
.Portofolio .image a:hover
{ background: rgba(255,255,255,1); }

.Portofolio a img
{ opacity:1; transition: opacity 1s ease-out; z-index:0; }
.Portofolio a:hover img
{ opacity:0.3; }

.Portofolio h3,
.Portofolio p {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 0 10px;
	opacity:0.0;
	transition: opacity 1s ease-out;
}
.Portofolio a:hover h3 {
	opacity:1;
	z-index:1;
}
.Portofolio p
{ 
	opacity:1;
	background: rgba(255,255,255,0.7);
    margin: 0;
	padding: 10px;
    opacity: 1;
	font-size: 0.8em;
	color: #222;
	overflow:hidden;
	white-space:nowrap;
}
.Portofolio a {
  	text-decoration: none;
}
/*
.Portofolio a:hover {
  opacity: 0.75;
}
*/
/*
.Portofolio .caption
/*{
	bottom: 25px;
    left: 25px;
    position: absolute;
} 
.Portofolio .caption a
{ color:#FFF;  text-shadow:0 0 2px #000; }*/
/*.Portofolio .caption a.background--light { color:#000; text-shadow:0 0 2px #fff; }
.Portofolio .caption a.background--complex { color:#666; text-shadow:0 0 2px #fff; }*/

.page-list .product
{
	background-color:#f0f0f0;
	border: 1px solid #e6e6e6;
	margin-bottom:20px;
}
.page-list .product.box:hover
{
	background-color:#ddd;
}

.page-list .product h3
{ margin-bottom:0px; }
.page-list .product h3 .btn
{
	border-radius:0px;
	border:none;
    box-sizing: border-box;
	background-color:#f0f0f0;
	color:#565656;
	font-size:19px;
	text-align:left;
	vertical-align:middle;
}
.page-list .product h3 .btn i
{ text-align:right; }
.page-list .product h3 .btn:hover 
{
	background-color:#000;
	color:#f0f0f0;
	transition: background-color 400ms linear;
}
.page-list .product .description
{ padding:10px; }

.page-list .product.list-item
{
	background-color:transparent;
	border-radius:4px;
	padding:10px 0;
}

#fancybox-outer, #fancybox-wrap
{
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	-safari-box-sizing: content-box;
	box-sizing: content-box;
}
.row .fancybox_gallery_image
{ text-align:left; margin-bottom:10px; }

.ccm-block-page-list-header
{
	background-color: #eee;
    border: 1px solid #ccc;
    border-radius: 4px;
    margin-bottom: 4px;
    padding: 1px 10px;
}
.cid-1 .ccm-block-page-list-header
{
	background-color: #333;
	border: 1px solid #000;
    color: #fff;
}
/* Main END */
/* Sidebar */
.SidebarBlockPadding
{ 
    margin-bottom: 20px;
}
.sidebar_image, .SidebarBlock
{ margin-bottom:16px; }

.sidebar_image
{ text-align:center; }
.sidebar-title
{
	background-color:#CCC;
}
.sidebar .nav.nav-pills > li > a
{
	transition:background-color 300ms linear 0s;
}
.sidebar .nav-pills > li.active > a, 
.sidebar .nav-pills > li.active > a:hover, 
.sidebar .nav-pills > li.active > a:focus {
    background-color: #777;
}
.sidebar .nav-pills > li li > a
{
    background-color: transparent;
	color:#000;
	padding-left:20px;
	transition:color 300ms linear 0s;
}
.sidebar .nav-pills > li li > a:hover, 
.sidebar .nav-pills > li li > a:focus {
	color:#e3002f;
}
.sidebar .nav-pills > li li.active > a, 
.sidebar .nav-pills > li li.active > a:hover, 
.sidebar .nav-pills > li li.active > a:focus {
    background-color: transparent;
	color:#e3002f;
}
.sidebar .nav-pills > li li li > a
{
	padding-left:30px;
	padding-top:5px;
	padding-bottom:5px;
}
/* Sidebar END */
/* Admin */
body .ccm-ui .dropdown-menu
{ display:block; }

/* Carousel */
.ccm-image-slider-text {
  top: auto;
  bottom: 18px;
  left: 40px;
  width: auto;
}

.ccm-image-slider-text h2{
  margin: 0;
  color: #fff;
}

.ccm-image-slider-container .prev,
.ccm-image-slider-container .next {
  top: auto;
  bottom: 23px;
  opacity: 1;
  background: none;
  border-right: 3px solid white;
  border-bottom: 3px solid white;
  width: 12px;
  height: 12px;
}

.ccm-image-slider-container .prev {
  left: 20px;
  transform: rotate(135deg);
}

.ccm-image-slider-container .next {
  right: 20px;
  transform: rotate(-45deg);
}
/* Carousel end */

/* Header */
.navbar-default .navbar-toggle {
  border: none; /*
  margin-right: 0;
  padding-right: 0;*/
}

.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:active,
.navbar-default .navbar-toggle:focus {
  background: none;
}

.navbar-default .navbar-toggle:hover .icon-bar,
.navbar-default .navbar-toggle:active .icon-bar,
.navbar-default .navbar-toggle:focus .icon-bar {
  background: #000;
}
/*
.navbar-default .navbar-nav > li > a {
  font-size: 19px;
  border: none;
  color: #888888;
}

.navbar-default .navbar-nav > .active > a {
  color: #000;
}
*/
.navbar-default .navbar-collapse.in {
  margin: 0;
}

.navbar-brand {
  padding: 0;
  margin-top: 15px;
}

@media (min-width: 768px) {
  .navbar-brand {
    margin-top: 30px;
  }
}
/* Header end */


/* Footer */
.SiteFooter {
  padding: 14px 0;
  margin: 14px 0;
}

.SiteFooter .nav li {
  margin: 0;
  clear: left;
}

@media (min-width: 768px) {
  .SiteFooter .nav li {
    clear: none;
  }
}
/*
.SiteFooter .nav li a {
  padding: 5px 0;
  margin-right: 9px;
}
*/
.SiteFooter .nav li:last-child a {
  margin-right: 0;
}

.SiteFooter .nav li a:hover {
  background: none;
}

.SiteFooter .btn-sm {
  padding: 5px 0 5px 10px;
}
/* Footer end */
/* Portfolio */

/* Portfolio end */
/* Description */
.btn[data-toggle="collapse"] {
  color: #888;
  font-size: 19px;
  border-radius: 50%;
}

.btn[data-toggle="collapse"]:focus,
.btn[data-toggle="collapse"]:hover,
.btn[data-toggle="collapse"]:active {
  outline: none;
  background: none;
  box-shadow: none;
  color: #000;
}
/* Description end */
.SiteFooter .visible-xs .btn
{
	font-size: 14px;
	padding-left:0;
	margin-left:0;
	border-radius:0;
}
@media (max-width: 320px) {
  	.SiteFooter .visible-xs .btn
	{ font-size: 13px; }
	.Portofolio p
	{ font-size:13px; padding:5px; } 
}
@media (max-width: 470px) {
	.Portofolio p
	{ font-size:13px; padding:5px; } 
}
/* Quattro grid */
@media (min-width: 768px) and (max-width: 992px) {
  .quattro .col-sm-6:nth-child(2n+1) {
    clear: left;
  }
}
/* Quattro grid end */