/****************Nav Bar********************/
nav{
	background-color:#FFF;
}
.navColor a{
	color:#6C5132;
	background-color:#FFF;
}

.navbarCss{
	background-color:#000;
}

#imgMainLogo{
	margin-top:3rem;
	width:25%;
}

/**************General*****************/
.productCard{
	padding:1px;
	margin:10px;
	float:left;
}

#tab2{
	display:none;
}

#tab3{
	display:none;
}


h1{
	color:#6c5132;
}

.myh2{
	color:#6c5132;
}

.hrLanding{
	background-color:#6c5132;
	text-align:center;
	width:65%;
}

hr{
	background-color:#6c5132;
	text-align:center;
}

.footer{
	float:left;
	width:100%;
	background-color:#4d4d4d;
	color:#fdfdfd;
}
/******** landing page animation *********/

#quoteOneWhite{
	font-size:3em;
	color:white;
	border-radius:0px 0px 0px 40px;
	display:none;
	text-align:center;
	width:100%;
	position:absolute;
	margin:auto auto;
}

#quoteTwoWhite{
	font-size:3em;
	border-radius:0px 40px 0px 0px;
	color:white;
	display:none;
	text-align:center;
	width:100%;
	position:absolute;
	margin:auto auto;
}

#quoteThreeWhite{
	font-size:3em;
	border-radius:0px 40px 0px 0px;
	color:white;
	display:none;
	text-align:center;
	width:100%;
	position:absolute;
	margin:auto auto;
}

#quoteFourWhite{
	font-size:3em;
	border-radius:0px 40px 0px 0px;
	color:white;
	display:none;
	text-align:center;
	width:100%;
	position:absolute;
	margin:auto auto;
}

#quoteDiv{
	margin-top:15%;
}

#skipIntroDiv{
	opacity:0.4;
	border:solid #FFF 1px;
	width:50px;
	margin:auto auto;
}

#skipIntroButton{
	opacity:0.4;
	border:solid #FFF 1px;
	text-align:center;
	background-color:none;
	border-radius:10px;
}
/****************landing page*******************/

#landingCover{
	color:white;
	margin-top:-6rem;
	height:1000px;
	width:98.5%;
	position:absolute;
	background: linear-gradient(270deg, #6c5132, #414343);
	background-size: 400% 400%;
	-webkit-animation: AnimationName 25s ease infinite;
	-moz-animation: AnimationName 25s ease infinite;
	animation: AnimationName 25s ease infinite;
}

@-webkit-keyframes AnimationName {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@-moz-keyframes AnimationName {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@keyframes AnimationName { 
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}

.divMainContent{
	background-color:white;
}

.headingColor{
	color:#6c5132;
	font-weight:bold;
}

.inputStyle{
	border-color:#6c5132;
}

#submit{
	border-color:#6c5132;
	background-color:white;
}

#mailFormDiv{
	margin-left:5%;
	margin-bottom:5%;
	float:left;
	padding:20px;
	width:50%;
}

.parallaxx {
    /* The image used */
    background-image:url('../images/cover.jpg');
    /* Set a specific height */
    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
	margin-right:1em;
	margin-left:1em;
	min-height:430px;
}

#parallaxCover{
	color:black;
	margin-top:11.9%;
	margin-bottom:20%;
	width:99%;
}

#showParallaxDiv{
	color:white;
	margin-top:12%;
	margin-bottom:20.01%;
	width:100%;	
}

.myCardLiner{
	width:80%;
	background-color:#6c5132;
	float:left;
	margin-bottom:20px;
	margin-left:10%;
}

.myCard{
	width:100%;
	background-color:#FFF;
	border:4px solid #6c5132;
	border-radius:8px;
	float:left;
}

.myCardImag{
	width:15%;
	border-right:4px solid #6c5132;
	margin-right:10px;
}

.myCardHeader{
	margin-top:5px;
	margin-left:20px;
	color:#6c5132;
}
.myCardText{
	margin-top:5px;
}

.hypLink{
	color:#6c5132;
}

.btnClose{
	border-color:grey;
}

/******** products animation *********/
#productsBody{
	background: linear-gradient(270deg, #6c5132, #414343);
}

@media screen and (max-width: 900px) {
	#landingCover{
		display:none;
	}
	
	#mailFormDiv{
		width:90%;
	}

}