@charset "UTF-8";
* {
	box-sizing:border-box;
	font-family: Arial, Helvetica, sans-serif;
}

/* Body */
body {
	font-family: Cambria, Times;
	background-image: url('../images/background.jpg');
	background-color: #FFfffF;
	background-size: 100% 100%;
	background-attachment:fixed;
	margin:0;
	min-width:300px;
	
}

h1 {
	clear:both;
	color:#960002;
	margin-top:60px;
}
h2 {
	color:#960002;
}

h3 {
	color:#000000;
} 


/* logoBar */
.topBar {
	height:180px;
	background-image: url(../images/IMG_252316.jpg);
	margin-left: 1.5%;
	width:93%;
}
.bigLogoAlign {
	margin: 20px 30px 0px 25px;
	float: right; 
}
.logoBarWords {
	padding: 120px 0 0 0;
	float: right;
	display:block;
}
#navBar {
	background-color: #960002;
	min-height: 40px;
	margin-left: 1.5%;
	width:93%;
}
#navBar a {
	color: #FFFFFF;
	text-align: center;
    	text-decoration: none;
	padding: 10px 14px;
}
#navBar a:hover{
	color: #916A00;
}
#navBar a.active {
	color: #FFBB03;
}

.navBarSticky {
	position: fixed;
 	top: 0px;
}
#navBar a.sideMenu {
	float:left;
	font-size:12pt;
	margin-top:3px;
	margin-left:5px;
	padding: 2px 4px;
	border: 1.5pt solid #FFBB03;
	display:none;
}
#navBar .menuOption{
	float:left;
	padding:8px 0px;
}


#sideBar {
	float:left;
	width:125px;
	background-color: rgba(150,0,2,1);
	overflow-x:hidden;
	padding-top:80px;
	padding-bottom:500px;
	font-size:12pt;
	margin-left:1.5%;
	z-index:1;
	
}

#sideBar a {
	color: #FFFFFF;
	display: block;
	text-align: left;
	text-decoration:none;
	padding: 8px 20px;
	text-overflow:ellipsis;
}
#sideBar a.active {
	color: #FFBB03;
}
#sideBar a:hover{
	color: #916A00;
}

.sideBarSticky {
	position: fixed;
 	top: 40px;
	height:85%;
}

/* Container */


.ginsengContainer {
	width:75%;
	float:right;
	margin-right:5.5%;
	margin-top:20px;
}

.mainContainer {
	width:93%;
	float:left;
	margin:  20px 5.5% 0 1.5%;
}
.section{
	display: inline-block;
	width:100%;
}
.yourGinseng {
	float:left;
	width:40%;
	padding-bottom: 20px;
}
.ginsengDes {
	border: 3px solid #B11F24;
}

.ginsengTypes {
	width:100%;
	background-color: rgba(200,200,120,1);
	padding: 5px 15px;
	margin:2px 0 0 0;
}

.ginsengTypesSub {
	width:100%;
	background-color: rgba(255,255,160,1);
	padding: 15px 15px;
	margin:0;
}

.sectionHalfWords {
	padding:20px;
	width:50%;
	background-color: rgba(255,255,255,0.6);
	min-width:300px;
}
.sectionHalfPic {
	width:48%;
	min-width:300px;
}


.sectionfloatRight{
	float:right;
}

.sectionPicAcross {
	display: block;
	width:80%;
	margin: auto;
}

.sectionWordsAcross {
	padding:20px;
	width:100%;
	background-color: rgba(255,255,255,0.6);
	margin-top:20px;
}

.aboutUsPrinciples{
	font-size:12pt;
	padding:10px;
	background-color: rgba(255,255,255,0.6);
}

.productMiniPic{
	width:23.5%;
	border: 2pt solid #960002;
}

.changeqtybutton{
	display: inline-block;
	height:24px;
	width:24px;
	background-color: #CCCCCC;
	font-size:14pt;
	text-align:center;
	border: 1px solid #AAAAAA;
	color: #000000;
}

.productqty {
	display: inline-block;
	height:24px;
	width:45px;
	font-size:12pt;
	background-color: #FFFFFF;
	text-align:center;
	border: 1px solid #AAAAAA;
	padding-top:3px;
}

#footer {
	background-color: #960002;
	height: 130px;
	margin: 0% 5.5% 30px 1.5%;
	min-width:93%;
	float:right;
	font-size:8pt;
}

#footer a {
	float:right;
	color: #FFFFFF;
	display: block;
	text-align: center;
    	text-decoration: none;
	padding: 10px 20px;
}

#footer a:hover {
	color: #916A00;
}

#footer .footLogo {
	float:right;
	padding:12px;
	color: white;
}


/* Mobile */
@media(max-width:800px){
	#navBar a.sideMenu{display:block;}
	.ginsengContainer {width:90%;}
	.sectionfloatRight {float:left;}
	.sectionHalfPic {width:100%}
	.sectionHalfWords {width:100%;}
	.logoBarWords {display:none;}
	.yourGinseng {width:95%;}
	#navBar .menuOption{display:none;}
}

@media(min-width:800px){
	#navBar a.sideMenu{display:none;}
	.ginsengContainer {width:75%;}
	.sectionfloatRight {float:right;}
	.sectionHalfPic {width:48%;}
	.sectionHalfWords {width:50%;}
	.logoBarWords {display:block;}
	.yourGinseng {width:40%;}
	#navBar .menuOption{display:block;}
}