.clear
{
	clear:both;
}
*
{
margin:0;
border:0;
padding:0;
}
body
{
background: rgba(0, 175, 225, .3);
font: 21px/21px Arial, San-serif;	                 /*14/20*/
color: #191970;
margin: 0;
}
header
{
	background: rgba(0, 125, 225, .4);
	width: 100%;
	height: 14%;
	position: fixed;
	/*opacity: .8;*/
	z-index: 100;
	top: 0;
	left: 0;
	border-bottom: 1px ridge #4D4E50;
	border-top: 2px ridge #4D4E50;
}
#topLogo
{
	margin: 0 auto; /* was 20px  */
	margin-left: 4%;
	margin-top: .5%;
	width: 300px;
	height: 90px;
	background: url(images/topLogo.png) no-repeat center;
	background-size: 100% 100%;
	float: left;
}
nav
{
	float: right; 
	padding: 35px 20px 20px 0;
}
nav ul li
{
display: inline-block;
float: left;                 /*left*/
padding: 10px;               /*Padding between the links*/
margin: 0 auto;
}
#home
{
	color: #FFF;
	text-decoration: underline;
}
#menuIcon
{   
	/*display: hidden;*/
	width: 75px;
	height: 75px;
	margin-top: 0;
	padding-top: 0;
	background: url(images/menuIcon.png) center;
	
}
a:hover#menuIcon
{
	border-radius: 4px 4px 0 0;
}
a
{
	text-decoration: none;
	color: #E6E6FA;
	font-weight: bold;	
}
ul
{
	list-style-type: none;
}
a:hover
{
color: #FFF;
text-decoration: underline;
font-style: oblique;
}
h1
{
text-align: center;
font-size: 180%;
line-height: 120%;
padding: 5% 0;
}
p
{
	padding: 1%;
}
img
{
text-align: center;
max-width: 100%;
height: auto;
width: auto;	
}
article
{
	float: left;
	margin: 0 auto;
	width: 50%;
	height: auto;
	padding: 4% 4% 0 4%;
	margin-top: 10%;
}
article img
{
	border: 1px ridge #FF8C00;
}
aside
{
	float: right;
	margin: 0 auto;
	width: 35%;
	height: auto;
	padding: 3%;
	margin-top: 8%;
	
}
#sections01 section
{
	width: 29%;
	float: left;
	margin: 2% 2%;
	border: 1px ridge #FF8C00;
	text-align: center;
	background: rgba(100, 175, 225, .4);
	margin-top: 10%;
}
footer
{
	background: rgba(0, 125, 225, .4);
	width: 100%;
	overflow: hidden;
	border-top: 2px ridge #4D4E50;
}
#sections01 p a
{
	color: rgba(125, 255, 255, .9);
	
}
#lady01
{
border: 2px ridge white;
}
footer section
{
	width: 29%;
	float: left;
	margin: 2% 2%;
	text-align: center;
}
footer h3, footer li, footer p
{
/* color: #E6E6FA;	 */
}
footer p a
{
	text-decoration: none;
}
footer img
{
	border: 1px solid #E6E6FA;
}
footer h2
{
	padding-bottom: 3%;
}
ul.connect li
{
	display: inline;
}
ul.connect li img
{
height: 22%;
width: 34%;	
}
#vincent
{
	height: 50%;
	width: 50%;

}
footer.secondFooter
{
	border-top: 1px ridge #4D4E50;
	border-bottom: 2px ridge #4D4E50;
	text-align: center;
	background-color: rgba(0, 175, 225, .4);
	max-height: 50px;
}
/*
#footer  section
{
border: none;
}
*/
/*
@media only screen and (max-device-width: 640px) {
  html { color: red; }
}
*/
@media only screen and (max-device-width: 478px){  /*@media screen and (max-width: 478px){*/
	body
	{
		position: absolute;
	}
	
}
@media only screen and (max-device-width: 740px){
body
{
background: rgba(0, 175, 225, .3);
font: 28px/25px Arial, San-serif;	                 /*14/20*/
color: #191970;
margin: 0;
}
header
{
/*position: absolute;*/
position: fixed;
float:  left;
height: 125px;
}
footer
{
margin-top: 5%;
}
#menuIcon
{
display: inline-block;
}
nav ul, nav:active ul
{
	display: none;
	position: absolute;
	padding: 20px;
	/* background: #405580; //Other background. I'm coloring the bg via the li elements instead. 
	border: 2px ridge #4D4E50; */
	right: 25px;
	top: 60px;
	width: 75%;
	/*height: 375%;*/  /* Added */
	font-size: 175%; /* Added */
	border-radius: 2px 0 2px 2px;

}

nav ul li, nav:active ul li
{
	
padding: 7% 10% 7% 10%;
border: 4px ridge rgba(50, 125, 175, .9);
background: rgba(25, 125, 175, .95);
opacity:  .95;


}
nav li
{
	text-align: center;
	width: 100%;
	padding: 10px 0;
	margin: 0;
}
nav:hover ul
{
	display: block;
}
nav
{
	padding: 2.5% 2.5% 2.5% 0;
}

#productsAndMoreSpacer
{
margin-top: 75px;
}

#sections01 section
{
float: left;
width: 100%;
margin: 7% 0 0 0;
padding: 0;
border: 0;
}
article
{
	
	/*float: left;*/
	width: 100%;
	padding: 0;
	margin-top: 175px;
}
article img
{
width: 100%;	
}
aside
{
	width: 100%;
	padding: 0;
	margin: 0;
}
ul.connect
{
	margin-top: 7%;
}
ul.connect li{

}
ul.connect li img
{
	width: 50%;
	float: left;
	margin-left: 25%;
}
#vincent
{
	width: 75%;
	height: 75%;
}
}

@media only screen and (max-width: 478px){  /*@media screen and (max-width: 478px){*/
	body
	{
		position: absolute;
	}
	
}
@media only screen and (max-width: 740px){
body
{
background: rgba(0, 175, 225, .3);
font: 28px/25px Arial, San-serif;	                 /*14/20*/
color: #191970;
margin: 0;
}
header
{
/*position: absolute;*/
position: fixed;
float:  left;
height: 125px;
}
footer
{
margin-top: 5%;
}
#menuIcon
{
display: inline-block;
}
nav ul, nav:active ul
{
	display: none;
	position: absolute;
	padding: 20px;
	/* background: #405580; //Other background. I'm coloring the bg via the li elements instead. 
	border: 2px ridge #4D4E50; */
	right: 25px;
	top: 60px;
	width: 75%;
	/*height: 375%;*/  /* Added */
	font-size: 175%; /* Added */
	border-radius: 2px 0 2px 2px;

}

nav ul li, nav:active ul li
{
	
padding: 7% 10% 7% 10%;
border: 4px ridge rgba(50, 125, 175, .9);
background: rgba(25, 125, 175, .95);
opacity:  .95;


}
nav li
{
	text-align: center;
	width: 100%;
	padding: 10px 0;
	margin: 0;
}
nav:hover ul
{
	display: block;
}
nav
{
	padding: 2.5% 2.5% 2.5% 0;
}

#productsAndMoreSpacer
{
margin-top: 75px;
}

#sections01 section
{
float: left;
width: 100%;
margin: 7% 0 0 0;
padding: 0;
border: 0;
}

article
{
	
	width: 100%;
	margin: 0 auto;
	padding: 0;
	margin-top: 125px;
	
}
article img
{	

width: 100%;
	

}
aside
{
	
	width: 100%;
	padding: 0;
	margin: 0;
}
ul.connect
{
	margin-top: 7%;

}
ul.connect li{
	
}
ul.connect li img
{
	width: 50%;
	float: left;
	margin-left: 25%;
}
#vincent
{
	width: 75%;
	height: 75%;
}
}





/* .products specific CSS will go here */

.product
{
	background-color: rgba(0, 125, 225, .4);
}
.price
{
/*text-decoration: underline; */
}
.price
{

	/*margin: 0 auto;
	 text-align: center; */
}