body
{
	background-color:#685757;
	width:100%;
	margin:auto;
}
#containerbody
{
        background-color:#685757;
        width:100%
        margin:auto;
}
#containwrap
{
        background-color:#FFFFFF;
        width:100%;
	max-width: 1300px;
//	min-width: 480px;
        margin:auto;
}
#menu
{
	text-align:center;
	background-color:#000000;
	line-height:35px;
	font-size:17px;
	margin:auto;
	max-width:1404px;
}
#menu>div
{
	display:inline-block;
}

#menu>div>div.sub
{
	position:absolute;
	z-index:1;
}
#menu>div>a
{
	color:#EEEEEE;
	padding-left:17px;
	padding-right:57px;
	text-decoration:none;
}
#menu>div>a:hover
{
	text-decoration:none;
}
#menu>div>div.sub
{
	line-height:25px;
	font-size:15px;
	background-color:#FcFcFc;
	padding: 3px 5px 8px 5px;
	margin-top:-1px;
	margin-left:5px;
	display:none;
	text-align:left;
	box-shadow: 1px 1px 4px #303030;
}
#menu>div>div.sub>a
{
	border-bottom: 1px solid #cccccc;
	display:block;
	color:#303030;
	padding-left:9px;
	padding-right:5px;
	padding-top:3px;
	padding-bottom: 2px;
	text-decoration:none;
	border-radius : 3px; /* CSS3 compatible browsers */
}
#menu>div>div.sub>a:hover
{
	background-color:#b2d2fc;
}

#menu>div:hover>div.sub
{
	display:block;
}


#logo
{
	height:200px;
	background-image:url('../images/noaudiophile_logo.jpg');
	background-repeat:no-repeat;
	background-position:center;
	margin:auto;
}

#main
{
	background-color:#ffffff;
	max-width:960px;
	margin:auto;
}

h2
{
	font-style:italic;
	color:#0d0d0d;
	margin:0px;
	margin-top:20px;
}
hr
{
	background-image:url('../img/titleshade.png');
	background-repeat:repeat-x;
	background-position:5px 0px;
	border:0px;
	padding:0px;
	margin-top:0px;
	height:21px;
}
h3
{
	color:#0d0d0d;
}


.comment
{
font-face:Arial;
font-weight:bold;
}
.note
{
max-width:790px;
font: normal 14px verdana,arial,helvetica,sans-serif;
padding:10px;
}
h2
{
padding-top:30px;
}
img
{
width:100%;
max-width:960px;
}

}


#topbit
{
position: absolute;
padding:50px 0px 0px 920px;
width:220px;
}


@media screen and (max-width: 1166px) {
#topbit
{
visibility:hidden;
display:none;
}
}


.grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}

a.gridlink {
  padding-left: 6px;
  display: inline-block;
  margin-bottom: 8px;
  width: calc(50% - 8px);
  text-decoration: none;
  color: black;
}

a.gridlink:hover img {
  transform: scale(1.1);
}

figure {
  margin: 0;
  overflow: hidden;
}

figcaption {
  margin-top: 15px;
  font: normal 14px verdana,arial,helvetica,sans-serif;
  #line-height: 1.2;
  #font: verdana,arial,helvetica,sans-serif;
}


@media screen and (min-width:800px)
{
  a.gridlink {
    width: calc(25% - 6px);
  }
}
@media screen and (min-width:400px)
{
  .gridimg {
    height: 100px;
  }
}

.gridimg {
  border: none;
  max-width: 100%;
  height: 160px;
  display: block;
  background: #ccc;
  transition: transform .2s ease-in-out;
  object-fit: cover;
}