.modal-cont{
	background-color: #fff;
	margin: 5%;
}

.modal-cont h4{
	margin-top: 20px;
	margin-bottom: 20px;
}

body{
	color: #606060;
}

/*.modal-content  {
    -webkit-border-radius: 0px !important;
    -moz-border-radius: 0px !important;
    border-radius: 0px !important; 
}

.modal-dialog {
    width: 1000px;
}

.modal-body{
	padding-bottom: 50px;
	height: 550px;
}
*/
.navbar {
    margin-bottom: 0;
    border:none;
}

ul.nav li a, ul.nav li a:hover, ul.nav li a:visited {
    color: #333 !important;
}

.form-control {
    border-radius: 0;
}


.navbar-default {
	background-color:#fff;
	height: 90px;
}

.navigasi-custom{
	margin-top: 20px;
	margin-bottom: 10px;
}

.icon-socmed-container{
	margin: auto;
	margin-top: 40px;
	width: 135px;
	height: 45px;
}
.icon-socmed-ig{
	float: left;
	width: 25px;
	height: 25px;
	margin: 0 10px 0 10px;
	background-image : url('../assets/gambar/icon-instagram-grey.png');
	background-size: 25px 25px;
	background-repeat: no-repeat;
}

.icon-socmed-tw{
	float: left;
	width: 25px;
	height: 25px;
	margin: 0 10px 0 10px;
	background-image : url('../assets/gambar/icon-twitter-grey.png');
	background-size: 25px 25px;
	background-repeat: no-repeat;
}

.icon-socmed-fa{
	float: left;
	width: 25px;
	height: 25px;
	margin: 0 10px 0 10px;
	background-image : url('../assets/gambar/icon-facebook-grey.png');
	background-size: 25px 25px;
	background-repeat: no-repeat;
}
/*.icon-socmed:hover{
	background-position: 0px -25px;
}*/
.icon-container{
	background-color: #f0f0f0;
	height: 120px;
	}

	.icon-ul ul{
		width: auto;
		height: auto;
		background-color: green;
		float: right;
		margin-right: 40px;
	}

	.icon-ul ul li{
		width: 120px;
		height: 120px;
		background-color: #f0f0f0;
		background-size: auto;
		float: left;
		list-style-type: none;
	}

	.icon-ul ul li:hover{
		background-color: #e1e1e1;
	}

	.cart-grey{
		background-color: #efefef;
		padding: 20px;
		padding-top: 30px;
	}


	.cart-contact{
		margin-bottom: 10px;
	}

	.profil-title{
		margin-top: 10px;
	}
	.table-cont{
		border-bottom: 1px #ddd solid;
		padding: 20px; 	
	}
@media only screen and (max-width : 991px) {
	.icon-container{
		background-color: #f0f0f0;
		height: 90px;
	}

	.icon-ul ul li{
		width: 90px;
		height: 90px;
		background-color: #f0f0f0;
		background-size: auto;
		float: left;
		list-style-type: none;
	}

	.product{
		margin-bottom: 70px;
		font-size: 20px;
	}

	.product-image img{
		margin: auto;
		background-color: red;
	}

	.product-title{
		text-align: center;
	}
	.product-title .title-btn{
		font-size: 15px;
	}

	.product-title .title-small{
		font-size: 15px;
	}

	.product-title .product-sub-title-small{
		font-size: 15px;
	}

	.product-title .product-sub-title-btn{
		font-size: 15px;
	}

	.table{
		font-size: 14px;
		color: #606060;
	}

	.detail-title{
		text-align: center;
	}

	.detail-title > .title-big{
		text-align: center;
	}
	.career-title{
		text-align: center;
	}

	.career-box{
		text-align: center;
	}

	.circle-cont {
		float: none;
		margin: auto;
	    margin-top: 30px;
	    height: auto;
	    position: relative;
	    display: table;
	}

	.circle1{
		float: left;
    	margin-left: auto;
    	margin-right: auto;
    	margin-top: 20px;
		background: #e71c24;
	    color: #fff;
	    width: 180px;
	    height: 180px;
	    border-radius: 100%;
  		line-height: 180px;
  		text-align: center;
		text-decoration: none;
	}

	.circle2{
		
		float: left;
     	margin-left: auto;
     	margin-right: auto;
		background: #2e318a;
	    color: #fff;
	    width: 180px;
	    height: 180px;
	    border-radius: 100%;
  		line-height: 180px;
  		text-align: center;
		text-decoration: none;
	}

	.career-ban{
		background-image : url('../assets/gambar/career-banner.jpg');
		background-size: 100%;
		width: 100%;
		height: 300px;
		background-repeat: no-repeat;
	}


	.profil1{
		background-image : url('../assets/gambar/profil1.jpg');
		background-size: 100%;
		width: 100%;
		height: 400px;
		background-repeat: no-repeat;
	}

	.product .detail-buy{
		margin-top: 25px;
		margin-bottom: 25px;
	}

	.product .detail-buy a{
		margin-top: 15px;
		text-decoration: none;
		color: #333;
		border: 1px #606060 solid;
		padding: 10px 50px 10px 50px;
		font-size: 20px;
	}

	
	.cart-grey{
		background-color: #efefef;
		padding: 20px;
		padding-top: 30px;
		padding-bottom: 50px;
	}
}
@media only screen and (max-width : 650px) {
	.career-ban{
		background-image : url('../assets/gambar/career-banner.jpg');
		background-size: 100%;
		width: 100%;
		height: 200px;
		background-repeat: no-repeat;
	}
	.profil1{
		background-image : url('../assets/gambar/profil1.jpg');
		background-size: 100%;
		width: 100%;
		height: 200px;
		background-repeat: no-repeat;
	}
}

@media only screen and (max-width : 446px) {
	.icon-container{
		background-color: #f0f0f0;
		height: 80px;
	}

	.icon-ul ul li{
		width: 80px;
		height: 80px;
		background-color: #f0f0f0;
		background-size: auto;
		float: left;
		list-style-type: none;
	}
	.career-ban{
		background-image : url('../assets/gambar/career-banner.jpg');
		background-size: 100%;
		width: 100%;
		height: 100px;
		background-repeat: no-repeat;
	}
	.profil1{
		background-image : url('../assets/gambar/profil1.jpg');
		background-size: 100%;
		width: 100%;
		height: 180px;
		background-repeat: no-repeat;
	}
}

@media only screen and (max-width : 406px) {
	.icon-container{
		background-color: #f0f0f0;
		height: 58px;
	}

	.icon-ul ul li{
		width: 58px;
		height: 58px;
		background-color: #f0f0f0;
		background-size: auto;
		float: left;
		list-style-type: none;
	}
}

@media only screen and (max-width : 318px) {
	.icon-container{
		background-color: #f0f0f0;
		height: 53px;
	}

	.icon-ul ul li{
		width: 53px;
		height: 53px;
		background-color: #f0f0f0;
		background-size: auto;
		float: left;
		list-style-type: none;
	}
}
@media only screen and (max-width : 991px) {
	
    .navbar-nav {
        float: none!important;
        margin: 7.5px -15px;
        background-color: #fff;
    }

	.navbar-default .navbar-nav > li > a:hover{
	    border-bottom: solid 2px #fff;
	    color: #fff;
	    border-bottom: 2px #333 solid;
	    animation: 0.3s ease-out;
	}

	
	.block {
	    height:100px;
	    width:200px;
	    text-align:left;
	}
	.center {
	    float: left;
		width: 100%;
	    margin:auto;
	    font-size: 18px;
	    color: #606060;
	    text-align: center;
	    margin-bottom: 10px;
	}
	.left {
	    float: left;
		width: 100%;
	    margin:auto;
	    font-size: 18px;
	    color: #606060;
	    text-align: center;
	    margin-bottom: 10px;
	}
	.right {
	    float: left;
		width: 100%;
	    margin:auto;
	    font-size: 18px;
	    color: #606060;
	    text-align: center;
	    margin-bottom: 10px;
	}
	.footer-info {
	    margin: auto;
	    padding-top: 50px;
	    width: 100%;
	    text-align: center;
	}
}

@media only screen and (min-width : 992px)   {
	.navbar-default .navbar-nav{
	    float: right;
	}
	.navbar-default .navbar-nav > li{
    	margin-right: 50px;
	}

	.navbar-default .navbar-nav > li > a{
	    color: #fff;
	    padding-bottom: 7px;
	    padding-right: 0;
	    padding-left: 0;
	    border-bottom: 3px solid transparent;
	    transition: 0.5s ease;
	}

	.block-contact {
	    margin: auto;
	    margin-top: 20px;
	    width: 750px;
	}
	.footer-info {
	    margin: auto;
	    padding-top: 50px;
	    width: 750px;
	    text-align: center;
	}
	.left {
		float: left;
		width: 250px;
	    margin:auto auto auto 0;
	    font-size: 22px;
	    color: #606060;
	    text-align: right;
	}
	.center {
		float: left;
		width: 250px;
	    margin:auto;
	    font-size: 22px;
	    color: #606060;
	    text-align: center;
	}
	.right {
		float: left;
		width: 250px;
	    margin:auto 0 auto auto;
	    font-size: 22px;
	    color: #606060;
	    text-align: left;
	}
	.product{
		margin-top: 60px;
	}
/*================================PRODUCT===============================*/
	.product-image img{
		width: 500px;
		height: 500px;
		margin: auto;
		background-repeat: no-repeat;
	}
	.product-title{
		margin: 150px 0 0 0;
		color: #606060;
		text-align: center;
	}

	.title-big{
		font-size: 60px;
	}

	.title-small{
		font-size: 16px;
	}

	.title-btn{
		margin-top: 15px;
		font-weight: bold;
	}

	.title-btn:a{
		margin-top: 15px;
		font-weight: bold;
	}

	.product-sub-title{
		text-align: center;
		font-size: 60px;
		color: #606060;
		margin-top: 120px;
	}

	.product-sub-title-art{
		text-align: center;
		font-size: 16px;
		color: #606060;
		margin-top: 20px;
		padding-left: 80px;
		padding-right: 80px; 
		text-align: justify;
		margin-bottom: 100px;
	}

	.product-sub-title-big{
		font-size: 60px;
		text-align: left;
		padding-left: 50px;
	}

	.product-sub-title-small{
		font-size: 16px;
		text-align: justify;
		padding-left: 50px; 
		padding-right: 50px; 
	}

	.product-sub-title-btn{
		padding-left: 50px; 
		margin-top: 15px;
		font-weight: bold;
		text-align: left;
	}

	.product-sub-title-btn:a{
		padding-left: 50px; 
		margin-top: 15px;
		font-weight: bold;
		text-align: left;
	}
/*================================END PRODUCT===============================*/

	

	/*======================PROFIL============================*/
	.profil1{
		background-image : url('../assets/gambar/profil1.jpg');
		background-size: 100%;
		width: 100%;
		height: 530px;
		background-repeat: no-repeat;
	}

	.profil-title{
		margin-top: 20px;
	}

	.profil-art{
		text-align: justify;
	}

	.art2-cont{
		margin-top: 80px;
	}

	.contact-cont{
		margin-top: 40px;
	}

	.contact-cont h1 {
	  position: relative;
	  text-align: center;
	  color: #606060;
	}

	.contact-cont h1 span {
	  background: #fff;
	  padding: 0 15px;
	  position: relative;
	  z-index: 1;
	}

	.contact-cont h1:before {
	  background: #ddd;
	  content: "";
	  display: block;
	  height: 1px;
	  position: absolute;
	    top: 50%;
	  width: 100%;
	}
	.contact-cont h1:before {
	  left: 0;
	}

	.contact-grey{
		background-color: #efefef;
		margin: auto;
		margin-top:50px;
		width: 900px;
		height: 500px;
		padding: 30px 30px 30px 30px;
	}

	.career-ban{
		background-image : url('../assets/gambar/career-banner.jpg');
		background-size: 100%;
		width: 100%;
		height: 500px;
		background-repeat: no-repeat;
	}

	.career-title{
		margin-top: 20px;
	}

	.career-box{
		margin: auto;
		margin-top: 25px;
	    width: 37%;
	    border: 1px solid #606060;
	    padding: 10px;
	    text-align: center;
	    font-size: 30px;
	}

	.circle-cont {
	    position: relative;
	    margin-top: 80px;
	    margin-bottom: 30px;
	    height: auto;
	}

	.circle-out {
	    position: absolute;
	    top: 50%;
	    left: 50%;
	    transform: translate(-50%,-50%);
	}


	.circle1{
		float: none;
    	margin-left: auto;
    	margin-right: auto;
		background: #e71c24;
	    color: #fff;
	    width: 180px;
	    height: 180px;
	    border-radius: 100%;
  		line-height: 180px;
  		text-align: center;
		text-decoration: none;
	}

	.circle2{
		
		float: left;
     	margin-left: auto;
     	margin-right: auto;
		background: #2e318a;
	    color: #fff;
	    width: 180px;
	    height: 180px;
	    border-radius: 100%;
  		line-height: 180px;
  		text-align: center;
		text-decoration: none;
	}


	.center-link a:hover {
		text-decoration: none;
		color: green;
	}

	/*==============================BRONSON SHOP===============================*/
	.shopbanner{
		background-image : url('../assets/gambar/shopbanner.png');
		background-size: 100%;
		width: 100%;
		height: 700px;
		background-repeat: no-repeat;
		margin-bottom: 0;
	}

	.shopbanner-since{
		margin-top: 280px;
		font-size: 18px;
		color: #333;
	}

	.shopbanner-title{
		font-size: 45px;
		font-weight: bold;
		margin-bottom: 15px;
		color: #333;
	}

	.shopbanner a{
		font-size: 18px;
		border: 1px #333 solid;
		padding: 8px 80px 8px 80px;
		color: #333;
	}

	.shopbanner a:hover{
		color: #333;
		text-decoration: none;
	}

	.take{
		text-align: center;
		margin-top: 40px;
		margin-bottom: 40px;
	}

	.take a{
		font-size: 18px;
		border: 1px #333 solid;
		padding: 8px 80px 8px 80px;
		color: #333;
	}

	.take a:hover{
		color: #333;
		text-decoration: none;
	}

	.shoplist-cont{
		background-color: #f0f0f0;
		padding-top: 50px;
	}

	.shoplistteks{
		height:320px;
		border-radius: 0;
		padding: 10px;
	}

	.shoplistbarang-cont{
		height:320px;
		border-radius: 0;
		padding: 10px;
	}

	.shoplist{
		width: auto;
		height: 250px;
		border-radius: 0;
		padding: 10px;
	}

	.shoplist img{
		width: 100%;
		height: auto;
	}

	.shoplist-title{
		text-align: center;
		font-weight: bold;
		font-size: 14px; 
	}

	.shoplistlink{
		text-align: center;
		font-size: 14px; 
	}

	.homepage-hero-module {
  border-right: none;
  border-left: none;
  position: relative;
}
.no-video .video-container video,
.touch .video-container video {
  display: none;
}
.no-video .video-container .poster,
.touch .video-container .poster {
  display: block !important;
}
.video-container {
  position: relative;
  bottom: 0%;
  left: 0%;
  height: 100%;
  width: 100%;
  overflow: hidden;
  background: red;
}
.video-container .poster img {
  width: 100%;
  bottom: 0;
  position: absolute;
}
.video-container .filter {
  z-index: 100;
  position: absolute;
  background: rgba(0, 0, 0, 0.4);
  width: 100%;
}
.video-container .title-container {
  z-index: 1000;
  position: absolute;
  top: 35%;
  width: 100%;
  text-align: center;
  color: #fff;
}
.video-container .description .inner {
  font-size: 1em;
  width: 45%;
  margin: 0 auto;
}
.video-container .link {
  position: absolute;
  bottom: 3em;
  width: 100%;
  text-align: center;
  z-index: 1001;
  font-size: 2em;
  color: #fff;
}
.video-container .link a {
  color: #fff;
}
.video-container video {
  position: absolute;
  z-index: 0;
  bottom: 0;
}
.video-container video.fillWidth {
  width: 100%;
  height: auto;
  overflow: hidden;
}

/*====================DETAIL============================*/
.detail-title{
	margin: 150px 0 0 0;
	color: #606060;
	text-align: left;
}
.detail-title-small{
	font-size: 20px;
}
.detail-buy{
	margin-top: 25px;
	}

.detail-buy a{
	margin-top: 15px;
	text-decoration: none;
	color: #333;
	border: 1px #606060 solid;
	padding: 10px 50px 10px 50px;
	font-size: 20px;
	}
.detail-kategori{
	font-size: 20px;
	text-align: center;
}

.detail-tabel{
		margin: 150px 0 0 0;
		color: #606060;
		text-align: center;
	}
.detail-tabel th, td{
	text-align: center;
}

.detail-image{
	width: 350px;
	height: 350px;
	margin: auto;
	margin-top: 90px;
	background-repeat: no-repeat;
}

}