@import url(https://fonts.googleapis.com/css?family=Lato:400,300italic,300,400italic,700,900,700italic,900italic);
* { font-family: 'Lato', sans-serif; }
html {
    overflow-y: scroll;
    height: 100%;
}
.container { width:900px; }
.row {
  margin-left: -15px;
  margin-right: -15px;
}
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {
  position: relative;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
  float:left;
}
.col-1 { width:8.33333333%; }
.col-2 { width:16.6666667%; }
.col-3 { width:25%; }
.col-4 { width:33.3333333%; }
.col-5 { width:41.66666667%; }
.col-6 { width:50%; }
.col-7 { width:58.33333333%; }
.col-8 { width:66.66666667%; }
.col-9 { width:73%; }
.col-10 { width:83.33333333%; }
.col-11 { width:91.66666667%; }
.col-12 { width:100%; }

header.main-header {
	background:#D50A17;
	border-bottom:10px solid #e2e2e2;
	-webkit-box-shadow: 0px 5px 10px 0px rgba(84,84,84,0.4);
	-moz-box-shadow: 0px 5px 10px 0px rgba(84,84,84,0.4);
	box-shadow: 0px 5px 10px 0px rgba(84,84,84,0.);
}
div.logo {
	position:relative;
	padding:22px 0px;
	width:277px;
	float:left;
}
nav.main-nav {
	display:block;
	position:relative;
	width:calc(100% - 277px);
	float:left;
	padding:25px 0px 20px 15px;
}
ul.main-menu {
	width:100%;
	display:block;
	margin:0;
	padding:0;
	list-style-type:none;
}
ul.main-menu > li {
	display:inline-block;
}
ul.main-menu a {
	text-decoration:none;
}
ul.main-menu > li > a {
	display:block;
	padding:5px 15px;
	color:#fff;
	font-weight:bold;
	font-size:16px;
	color:#fff;
}
ul.main-menu > li:hover > a {
	color:#e6e6e6;
}
ul.main-menu > li > ul {
	display:none;
	position:absolute;
	list-style-type:none;
	padding:23px 0px 0px 0px;
	z-index:9999;
	min-width:170px;
}
ul.main-menu > li:hover > ul {
	display:block;
}
ul.main-menu > li > ul > li > a{
	display:block;
	padding:10px 15px;
	color:#fff;
	font-size:13px;
	background:rgba(0, 0, 0,.7);
}
ul.main-menu > li > ul > li:hover > a {
	background:rgba(0, 0, 0,.9);
}
#main-slider {
	-webkit-box-shadow: 0px 0px 20px 2px rgba(84,84,84,0.5);
	-moz-box-shadow: 0px 0px 20px 2px rgba(84,84,84,0.5);
	box-shadow: 0px 0px 20px 2px rgba(84,84,84,0.5);
}
main.main {
	padding:20px 0px;
}

.box {width:100%;}
.box-heading {
	background:#D50A17;
	padding:5px 10px;
	border-bottom:4px solid #e2e2e2;
}
.box-heading .box-title {
	margin:0;
	color:#fff;
	font-weight:bold;
}
.box-body {
	width:100%;
	min-height:10px;
	padding:10px 0px;
}

ul.article-list {
	margin:0;
	padding:0;
	list-style-type:none;
}
ul.article-list li {
	margin-bottom:10px;
	display:block;
	float:left;
	width:100%;
}
ul.article-list li .media {
	width:150px;
	float:left;
	padding-right:20px;
}
ul.article-list li .description {
	width:calc(100% - 150px);
	float:left;
}
ul.article-list a {color:#333;}
ul.article-list a:hover {color:#111;}
ul.article-list span {color:#aaa;}
.promo-box {
	width:100%;
	float:left;
	position:relative;
}
a img:hover {
	opacity:0.8;
}
.promo-description {
	padding:10px;
	background:#D50A17;
	position:absolute;
	bottom:0;
	left:0;
	right:0;
}
.promo-description a {
	color:#fff;
}
.promo-description h4 {margin:0;}
.produk-title {
	text-align:center;
}
.produk-slide {
	text-align:center;
	margin-bottom:30px;
}
ul.home-gallery {
	margin:0;
	padding:0;
	list-style-type:none;
}
ul.home-gallery li {
	display:inline-block;
	margin-bottom:2px;
}
.read-content {
	overflow:auto;
	float:left;
	width:100%;
	border:1px solid #eee; 
	padding:10px;
}
.read .read-media {
	margin-bottom:20px;
}
.read .read-heading {
	margin-bottom:20px;
	border-bottom:2px solid #D50A17;
	padding-bottom:10px;
}
.read .read-title {
	margin:0;
}
ul.read-attribut {
	margin:0;
	padding:0;
	list-style-type:none;
	margin-top:5px;
}
ul.read-attribut li {
	display: inline-block;
	margin-right: 10px;
	font-size:12px;
	color:#aaa;
}

ul.image-gallery {
	display:block;
	margin:0;
	padding:0px;
	list-style-type:none;
	margin-top:5px;
	width:100%;
}
ul.image-gallery li {
	display:inline-block;
	width:25%;
	float:left;
	padding:5px;
}

ul.social-media {
	display:block;
	margin:0;
	padding:0px;
	list-style-type:none;
	margin-top:5px;
}
ul.social-media li {
	display:inline-block;
}
ul.social-media li a {
	display:block;
	width:30px;
	height:30px;
	background-size:cover;
	background-repeat:none;
}
ul.social-media li.facebook a { background-image:url("../images/facebook.png"); }
ul.social-media li.twitter a { background-image:url("../images/twitter.png"); }
ul.social-media li.instagram a { background-image:url("../images/instagram.png"); }
ul.social-media li.google-plus a { background-image:url("../images/google-plus.png"); }
ul.social-media li:hover a {
	opacity:.9;
}
footer.footer {
	-webkit-box-shadow: 0px -3px 10px 0px rgba(84,84,84,0.4);
	-moz-box-shadow: 0px -3px 10px 0px rgba(84,84,84,0.4);
	box-shadow: 0px -3px 10px 0px rgba(84,84,84,0.4);
}
.footer-top {
	background:#e2e2e2;
	padding:10px 0px;
}
.footer-title {
	font-weight:bold;
	color:#333;
	padding:5px 0px;
	margin:10px 0px;
	border-bottom:3px solid #D50A17;
}
ul.footer-list {
	display:block;
	padding:0;
	margin:0;
	list-style-type:none;
}
ul.footer-list a {
	font-weight:bold;
	color:#333;
}
ul.footer-list a:hover {
	color:#111;
}
.footer-bottom {
	background:#D50A17;
	padding:8px;
}
p.copyright {
	text-align:center;
	color:#fff;
	margin:0;
}
p.copyright a {
	color:#fff;
}
p.copyright a:hover { color:#ececec; }