/* normal */
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800');

* { margin: 0px; padding: 0px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
html, body { font-family: 'Open Sans', sans-serif; font-size: 12px; font-weight: 400; color: #8c806e; min-height: 100%; height: 100%;  }
input, select, textarea { font-family: 'Open Sans', sans-serif; font-size: 12px; color: #8c806e; }
body {  }
img { border: 0px; display: block; }
a, input { outline: none; }
a { text-decoration: none; }
ul, ol { list-style: none; }
.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
.clearfix { display: block; }
.left { float: left; }
.right { float: right; }
.container { max-width: 320px; padding: 0px 15px; }

/* template  */
#template { position: relative; display: block; width: 100%; min-height: 100%; background: url(../images/background-img.jpg) no-repeat center; background-size: cover; }

/* layout */
#layout { margin: 0 auto; max-width: 320px; }

	/* header */
	#header-part { position: relative; width: 100%; }
	
		.banner-bar { width: 100%; }
		.banner-bar img { max-width: 100%; }
	
	/* content */
	#content-part { width: 100%; }
	
		.tagline-bar { background: #000000; text-align: center; padding: 15px 0px 30px; position: relative; }
		.tagline-bar:after { position: absolute; top: 100%; left: 50%; content: ""; border-top: solid 10px #000; border-left: solid 10px transparent; border-right: solid 10px transparent; margin-left: -10px; }
		.tagline-bar h1 { font-size: 24px; color: #fff; font-weight: 400; line-height: 31px; }
		.tagline-bar h1 strong { display: block; font-weight: 800; }
		
		.brands-bar { background: #fff; }
		.brands-bar ul { width: 100%; float: left; }
		.brands-bar  .right, .brands-bar  .left { float: none; }
		.brands-bar ul li { padding: 0px 15px; display: table; background: #fff; width: 100%; border-bottom: solid 1px #e8e8e8; }
		.brands-bar ul li > div  { padding: 5px 0px; display: table-cell; width: 50%; height: 74px; vertical-align: middle; }
		.brands-bar ul li > div.right { text-align: right; }
		.brands-bar ul li a { font-size: 19px; line-height: 34px; font-weight: 700; display: inline-block; background: #c9c9c9; color: #fff;  padding: 0px 10px; } 
		.brands-bar ul li a:hover { background: #000; }
		.brands-bar ul li:last-child { border-bottom: 0px; }
	
	/* footer part */
	#footer-part { width: 100%; }
		
		.copyright-bar { text-align: center; padding: 16px 0px; }
		.copyright-bar span { display: block; font-size: 14px; color: #fff; }

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 359px) {
		
	
	}