body {

 /* background-color: #6D6D44; */

 background-image: url(/images/top-segment.jpg);

 color: #0F3B5F;

 font-family: Verdana, Arial, Helvetica, sans-serif;

 margin: 0px;

 padding: 0px;

 }

.container	{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	justify-content: flex-start;
	width:100%;
	margin: 10px 0px;
	padding: 0px;
}

#outside {

 display: inline-block;

 margin: 10px auto;
 
 padding: 0px 20px 0px 0px;
 
 width: 100%;

 max-width: 960px;

 }



#surround {

 background-color: #F1EBE5;

 border: 1px solid black;

 display: inline-block;

 margin: 0px auto;

 padding: 0px 10px;
 
 width: 100%;

 max-width: 960px;

 }



header {

 background-color: #0C237F;

 height: auto;

 margin: 0 20px 0 20px;

 }



header h1,

header h2,

header h3,

header h4 {

 color: #f2db94;

 font-family: Times New Roman, serif;

 }



header h1 {

 font-size: 250%;

 margin-bottom: 0;

 }



.nav {

 background-color: #548152;

 display: block;

 list-style: none;

 margin: -20px 20px 0px 20px;

 }



.nav ul {

 font: bold 12px Verdana;

 list-style-type: none;

 margin: 0px;

 padding: 10px 0px 10px 0px;

 text-align: center;

 }



.nav li {

 display: inline;

 margin: 0px;

 }



.nav li a {

 background-color: #f2db94;

 color: black;

 font: bold 12px Verdana;

 margin: 0px;

 padding: 3px 10px 5px 10px;

 text-decoration: none;

 }



.noa {

 background-color: #548152;

 margin: 0px;

 padding: 3px 22px 5px 22px;

 }



.nav li img {

 margin-bottom: -5px;

 }



.nav a.down,

nav a.down:hover {

 background-image: url(/images/navdown_blue.gif);

 background-position: right center;

 background-repeat: no-repeat;

 }



.nav li a:visited {

 color: black;

 }



.nav li a:hover,

nav li a.selected {

 background-color: #bbccdd;

 }



.nav li a.currentpage,

nav li a:visited.currentpage {

 background-color: #f2db94;

 }

#prot	{
	display: inline;
	background-color: #060;
}

.dropmenu {

 background-color: #548152;

 color: black;

 font: bold 14px Verdana;

 list-style: none;

 position: absolute;

 top: 0px;

 visibility: hidden;

 z-index: 100;

 }



.dropmenu table,

.dropmenu tbody,

.dropmenu ul,

.dropmenu tr,

.dropmenu td {

 margin: 0;

 padding: 0;

 }

 

.dropmenu ul {

 list-style: none;

 }



.dropmenu li {

 margin: 5px 5px 5px 5px;

 }



.dropmenu a {

 background-color: #f2db94;

 color: black;

 display: block;

 padding: 0px 5px 0px 5px;

 text-decoration: none;

 }



* html .dropmenu a { /*IE only hack*/

 width: 100%;

 }



.dropmenu a:hover {

 background-color: #bbccdd;

 }

#content {

 display: inline-block;
 
 width: 100%;

 max-width: 960px;

 padding: 10px 10px 5px 10px;

 }

.content-home {

 display: inline-block;
 
 width: 100%;
 
 max-width: 710px;

 padding: 10px 10px 5px 10px;

 }

#homeimg1 {
	width:50%;
	height:auto;
	margin:20px;
	padding-top:0px;
}

#homeimg2 {
	width:50%;
	height:auto;
	margin:0px 20px;
	padding-top:0px;
}

#content li {

 padding-bottom: 10px;

 }



#content code,

#content img,

#content pre {

 margin-left: 10px;

 margin-right: 10px;

 }

/*JBD added*/
.iframe-container{
  position: relative;
  width: 95%;
  padding-bottom: 56.25%;
  margin: 0% 3%; 
  height: 0;
}
.iframe-container iframe{
  position: absolute;
  top:0;
  left:0;
  width: 100%;
  height: 100%;
}
/*JBD added*/

#sideright {

 border: 2px solid #548152;

 margin-top: 20px;

 margin-right: 20px;

 width: 200px;
 
 height:675px;
 
 /* height:1150px; When Facebook is displayed */

 }

.catalogcol {
	
 display: inline-block;
 
 -webkit-columns: 3 250px;
 
 -moz-columns: 3 250px;
 
 columns: 3 250px;
 
 -webkit-column-rule: 1px solid #000; /* Chrome, Safari, Opera */
 
 -moz-column-rule: 1px solid #000; /* Firefox */

 column-rule: 1px solid #000;

 self-align: flex-start;

 margin: 10px 10px 20px 40px;

 height: 1100px;
 
 width: 270px;
 
 font-size:large;

 }

.catalogcol li a	{
	font-size: large;
}
 
@media screen and (max-width: 910px)	{
	.catalogcol {
		-webkit-columns: 2 250px;
		-moz-columns: 2 250px;
		columns: 2 250px;
		height: 1900px;
	}
	.catalogcol li a	{
		padding: 3px 0px;
	}
}

@media screen and (max-width: 610px)	{
	.catalogcol {
		-webkit-columns: 1 250px;
		-moz-columns: 1 250px;
		columns: 1 250px;
		height: 5300px;
		margin: 10px auto;
		font-size:x-large;
	}
	.catalogcol li a	{
		font-size: x-large;
		padding: 3px 0px;
	}
}

dl, p {

 margin-left: 20px;

 margin-right: 20px;

}

#bluebold	{
	color: #00f;
	font-weight:bold;
}

#redbold	{
	color: #b00;
	font-weight:bold;
}

#greenbold	{
	color: #0b0;
	font-weight:bold;
}

#smalltxt	{
	font-size:medium;
}

a img {

 border: 0;

}


h1,

h2,

h3,

h4,

h5,

h6 {

 margin: 10px;

 text-align: center;

 text-indent: 0;

 }

 h3 a {
 text-decoration: none;
 color:#000;
 }

hr {

 background-color: #548152;

 zclear: both;

 color: #548152;

 height: 2px;

 width: 90%;

 }

 

dt {

 font-weight: bold;

 padding-top: 1.5em;

 }

 

dt:first-letter {

 font-size: 150%;

 }

 

dd {

 padding-top: .5em;

 }



.centered {

 text-align: center;

 text-indent: 0;

 }

 

ol.centered,

ul.centered {

 width: 50%;

 margin-left: auto;

 margin-right: auto;

 }

 

form.centered,

table.centered,

.centered table {

 margin-left: auto;

 margin-right: auto;

 }

 

ol.centered {

 padding-top: 1em;

 }



.plus25 {

 margin-bottom: -3px;

 }



.size4 {

 font-size: 120%;

 margin: 0;

 text-align: center;

 text-indent: 0;

 }



.size5 {

 font-size: 150%;

 margin: 0;

 text-align: center;

 text-indent: 0;

 }



.p60 {

 font-size: 60%;

 }



.hide {

 display: none;

 }



.show {

 background-color: #FFCCCC;

 font-style: italic;

 font-weight: bold;

 }



.italic {

 font-style: italic;

 }



.left {

 text-align: left;

 text-indent: 0;

 }



.right {

 text-align: right;

 text-indent: 0;

 }



.fleft {

 float: left;

 }


.fright {

 float: right;

 margin: 10px;

 }



.clear {

 clear: both;

 }



.month {

 background-color: #F1EBE5;

 display:inline;
 
 float: right;

 margin: 10px;

  -moz-border-radius-topright: 10px;

 -webkit-border-top-right-radius: 10px;

 -khtml-border-top-right-radius: 10px;

 border-top-right-radius: 10px;

 -moz-border-radius-topleft: 10px;

 -webkit-border-top-left-radius: 10px;

 -khtml-border-top-left-radius: 10px;

 border-top-left-radius: 10px;

  -moz-border-radius-bottomright: 10px;

 -webkit-border-bottom-right-radius: 10px;

 -khtml-border-bottom-right-radius: 10px;

 border-bottom-right-radius: 10px;

 -moz-border-radius-bottomleft: 10px;

 -webkit-border-bottom-left-radius: 10px;

 -khtml-border-bottom-left-rradius: 10px;

 border-bottom-left-radius: 10px;

 
 }



.dim {

 color: gray;

 text-decoration: line-through;

 }



.italic {

 font-style: italic;

 }



.red {

 color: red;

 }



.white {

 color: white;

 }



.dkgrn {

 color: #005500;

 }



.green {

 color: green;

 }



.blue {

 color: blue;

 }



.pad10 {

 padding: 10px;

 }



.w70 {

 width: 70%;



 }

.w100 {

 width: 100%;

 }

.w101 {

 width: 100%;
 
 table-layout: fixed;

 }



.c21 {

 text-align: right;

 width: 20%;

 }

 

.c22 {

 text-align: left;

 width: 80%;

 }



.f31 {

 text-align: center;

 width: 5%;

 }



.f32 {

 overflow: hidden;

 text-align: left;

 text-overflow: ellipsis;

 width: 87%;

 }



.f33 {

 text-align: center;

 width: 8%;

 }



.p31 {

 overflow: hidden;

 text-overflow: ellipsis;

 width: 87%;

 }



.p32 {

 text-align: right;

 width: 5%;

 }



.p33 {

 width: 8%;

 }

.p34 {

 text-align: left;
 
 vertical-align: top;
 
 font-style: normal;

 font-weight: bold;

 width: 20%;

 }

.p35 {

 text-align: left;

 }


input,

select,

option,

checkbox,

textarea {

 font-family: Courier, monospace;

 font-size: 110%;

 font-weight: bold;

 }



input:focus,

checkbox:focus,

textarea:focus {

 background-color: silver;

 }



tbody tr.item:hover {

 background-color: #bbccdd;

 }



.w100 tbody tr:hover {

 background-color: rgb(225,243,238);

 }



.darkbar {

 background-color: #cccccc;

 }



.litebar {

 background-color: #dddddd;

 }



footer {

 display: inline-block;

 font-size: 11px;

 margin: 0px auto 10px auto;

 padding: 5px;

 text-align: center;

 width: 100%;

 }



footer img{

 padding: 0 5px 0 5px;

 }



ul.dropdown,

ul.dropdown li,

ul.dropdown ul {

 list-style: none;

 margin: 0;

 padding: 0;

 }



ul.dropdown {

 float: left;

 position: relative;

 z-index: 597;

 }



ul.dropdown li {

 float: left;

 line-height: 1.3em;

 vertical-align: middle;

 }



ul.dropdown li.hover,

ul.dropdown li:hover {

 cursor: default;

 position: relative;

 z-index: 599;

 }



ul.dropdown ul {

 left: 0;

 position: absolute;

 top: 100%;

 visibility: hidden;

 width: 100%;

 z-index: 598;

 }



ul.dropdown ul li {

 float: none;

 }



ul.dropdown ul ul {

 left: 99%;

 top: 1px;

 }



ul.dropdown li:hover > ul {

 visibility: visible;

 }

 

.rounded-corners {
	
 display: inline-block;
	
 self-align: flex-start;

  -moz-border-radius-topright: 10px;

 -webkit-border-top-right-radius: 10px;

 -khtml-border-top-right-radius: 10px;

 border-top-right-radius: 10px;

 -moz-border-radius-topleft: 10px;

 -webkit-border-top-left-radius: 10px;

 -khtml-border-top-left-radius: 10px;

 border-top-left-radius: 10px;

  -moz-border-radius-bottomright: 10px;

 -webkit-border-bottom-right-radius: 10px;

 -khtml-border-bottom-right-radius: 10px;

 border-bottom-right-radius: 10px;

 -moz-border-radius-bottomleft: 10px;

 -webkit-border-bottom-left-radius: 10px;

 -khtml-border-bottom-left-rradius: 10px;

 border-bottom-left-radius: 10px;

 
 }

 

.top-rounded-corners {

  -moz-border-radius-topright: 10px;

 -webkit-border-top-right-radius: 10px;

 -khtml-border-top-right-radius: 10px;

 border-top-right-radius: 10px;

 -moz-border-radius-topleft: 10px;

 -webkit-border-top-left-radius: 10px;

 -khtml-border-top-left-radius: 10px;

 border-top-left-radius: 10px;

  -moz-border-radius-bottomright: initial;

 -webkit-border-bottom-right-radius: initial;

 -khtml-border-bottom-right-radius: initial;

 border-bottom-right-radius: initial;

 -moz-border-radius-bottomleft: initial;

 -webkit-border-bottom-left-radius: initial;

 -khtml-border-bottom-left-rradius: initial;

 border-bottom-left-radius: initial;

 
 }

 

.bot-rounded-corners {

  -moz-border-radius-topright: initial;

 -webkit-border-top-right-radius: initial;

 -khtml-border-top-right-radius: initial;

 border-top-right-radius: initial;

 -moz-border-radius-topleft: initial;

 -webkit-border-top-left-radius: initial;

 -khtml-border-top-left-radius: initial;

 border-top-left-radius: initial;

  -moz-border-radius-bottomright: 10px;

 -webkit-border-bottom-right-radius: 10px;

 -khtml-border-bottom-right-radius: 10px;

 border-bottom-right-radius: 10px;

 -moz-border-radius-bottomleft: 10px;

 -webkit-border-bottom-left-radius: 10px;

 -khtml-border-bottom-left-rradius: 10px;

 border-bottom-left-radius: 10px;

 
 }



table.cart {

 border-collapse: collapse;

 margin: auto;

 width: 90%;

 }

 

td.cart, th.cart {

 border: 1px solid black;
 
 }



form.bound {

  border: 3px solid green;

  }



legend {

 font-size: large;

 font-weight: bold;

 }



table.cat {

 border-collapse: collapse;

 }



td.cat1 {

 text-align: left;

 width: 90%;

 font-size:medium;

}



td.cat2 {

 text-align: center;

 width: 10%;

 font-size:medium;

 }



td.cart1 {

 text-align: left;

 width: 70%;

 }



td.cart1r {

 text-align: right;

 width: 70%;

 }



td.cart2 {

 text-align: center;

 width: 10%;

 }



td.cart3 {

 text-align: right;

 width: 10%;

 }



td.cart4 {

 text-align: right;

 width: 10%;

 }



td.cat1,

td.cat2,

td.cart1,

td.cart2,

td.cart3,

td.cart4 {

 border: 1px solid black;

 }



#frecorder {

 background-color: #ffffdd;

 }



#fmusic {

 background-color: #ddffdd;

 }



#faccessory {

 background-color: #ddffff;

 }



#fbook {

 background-color: #ffddff;

 }



#fother {

 background-color: #ddddff;

 }



#frecorder,

#fmusic,

#faccessory,

#fbook,

#fother {

 margin-left: auto;

 margin-right: auto;

 width: 65%;

 }

 

article, aside, details, figcaption, figure,

footer, header, hgroup, menu, nav, section {

 display: block;

 }



.obut {

 background-color: #FF6600;

 border: 1px solid black;

 color: black;

 font-size: 75%;

 margin-bottom: 5px;

 padding: 0px 3px 0px 3px;

 text-decoration: none;

  -moz-border-radius-topright: 10px;

 -webkit-border-top-right-radius: 10px;

 -khtml-border-top-right-radius: 10px;

 border-top-right-radius: 10px;

 -moz-border-radius-topleft: 10px;

 -webkit-border-top-left-radius: 10px;

 -khtml-border-top-left-radius: 10px;

 border-top-left-radius: 10px;

  -moz-border-radius-bottomright: 10px;

 -webkit-border-bottom-right-radius: 10px;

 -khtml-border-bottom-right-radius: 10px;

 border-bottom-right-radius: 10px;

 -moz-border-radius-bottomleft: 10px;

 -webkit-border-bottom-left-radius: 10px;

 -khtml-border-bottom-left-rradius: 10px;

 border-bottom-left-radius: 10px;

 
 }



.obut:hover {

 background-color: #FF8533;

 }



.gbut {

 background-color: #C7E6C7;

 border: 1px solid black;

 color: black;

 font-size: 75%;

 margin-bottom: 5px;

 padding: 0px 3px 0px 3px;

 text-decoration: none;

  -moz-border-radius-topright: 10px;

 -webkit-border-top-right-radius: 10px;

 -khtml-border-top-right-radius: 10px;

 border-top-right-radius: 10px;

 -moz-border-radius-topleft: 10px;

 -webkit-border-top-left-radius: 10px;

 -khtml-border-top-left-radius: 10px;

 border-top-left-radius: 10px;

  -moz-border-radius-bottomright: 10px;

 -webkit-border-bottom-right-radius: 10px;

 -khtml-border-bottom-right-radius: 10px;

 border-bottom-right-radius: 10px;

 -moz-border-radius-bottomleft: 10px;

 -webkit-border-bottom-left-radius: 10px;

 -khtml-border-bottom-left-rradius: 10px;

 border-bottom-left-radius: 10px;

 
 }

.abut {

 background-color: #E6C7C7;

 border: 1px solid black;

 color: black;

 font-size: 75%;

 margin-bottom: 5px;

 padding: 0px 3px 0px 3px;

 text-decoration: none;

  -moz-border-radius-topright: 10px;

 -webkit-border-top-right-radius: 10px;

 -khtml-border-top-right-radius: 10px;

 border-top-right-radius: 10px;

 -moz-border-radius-topleft: 10px;

 -webkit-border-top-left-radius: 10px;

 -khtml-border-top-left-radius: 10px;

 border-top-left-radius: 10px;

  -moz-border-radius-bottomright: 10px;

 -webkit-border-bottom-right-radius: 10px;

 -khtml-border-bottom-right-radius: 10px;

 border-bottom-right-radius: 10px;

 -moz-border-radius-bottomleft: 10px;

 -webkit-border-bottom-left-radius: 10px;

 -khtml-border-bottom-left-rradius: 10px;

 border-bottom-left-radius: 10px;

 
 }

.abut img {
	
	height:13px;
	
	width:13px;
	
}
 
.gbut:hover {

 background-color: #CDE8CD;

 }



.gbut img {

 margin-left: 2px !important;

 margin-right: 2px !important;

 vertical-align: text-top;

 }

.abut img {

 margin-left: 2px !important;

 margin-right: 2px !important;

 vertical-align: text-top;

 }

.vctr {

 vertical-align: middle;

 }



.flexdropdownmenu {

 background-color: #769A75;

 border: 3px solid black;

 }



.flexdropdownmenu ul {

 background-color: #98B397;

 border: 3px solid black;

 }



.flexdropdownmenu ul ul {

 background-color: #BBCDBA;

 border: 3px solid black;

 }



.flexdropdownmenu, .flexdropdownmenu ul{ /*topmost and sub ULs, respectively*/

 color: black;

 display: none; /*collapse all sub menus to begin with*/

 font: bold 14px Verdana;

 left: 0;

 list-style-type: none;

 margin: 0;

 padding: 0;

 position: absolute;

 top: 0;

 visibility: hidden;

 }



.flexdropdownmenu li{

 margin: 5px 5px 5px 5px;

 position: relative;

 }



.flexdropdownmenu li a{

 color: black;

 display: block;

 width: 170px; /*width of menu (not including side paddings)*/

 background-color: #f2db94;

 text-decoration: none;

 padding: 2px 5px 2px 5px;

 }



* html .flexdropdownmenu li{ /*IE6 CSS hack*/

 display: inline-block;

 width: 180px; /*width of menu (include side paddings of LI A*/

 }



.flexdropdownmenu li a:hover, .flexdropdownmenu li.selected>a{

 background-color: #bbccdd;

 }



.rightarrowclass{

 position: absolute;

 top: 6px;

 right: 5px;

 }

 

table.dates {

 background-color: black;

 margin: auto;

 width: 80%;

 }

 

table.dates tbody tr:hover {

 background-color: rgb(237,241,246);

 }



.q21 {

 text-align: center;

 width: 25%;

 }



.q22 {

 text-align: center;

 width: 75%;

 }



.em4 {

 width: 4em;

 }



.em5 {

 width: 5em;

 }

 

.em7 {

 width: 7em;

 }



table.tk7 {

 border-collapse: separate;

 border: 1px solid #841F27;

 font-size: 80%;

 margin: auto auto;

 overflow: scroll;

 padding: 0;

 table-layout: fixed;

 width: 100%;

 }



table.tk7 th {

 border: 1px solid #841F27;

 text-align: center;

 }



table.tk7 td {

 border: 1px solid #841F27;

 }

 

.tk71 {

 text-align: left;

 width: 30%;

 }



.tk72 {

 text-align: left;

 width: 10%;

 }



.tk73 {

 text-align: right;

 width: 5%;

 }



.tk74 {

 text-align: center;

 width: 5%;

 }



.tk75 {

 text-align: center;

 width: 5%;

 }



.tk76 {

 text-align: left;

 width: 30%;

 }



.tk77 {

 text-align: left;

 width: 15%;

 }

 

table.tk2 {

 border-collapse: separate;

 border: 1px solid #841F27;

 font-size: 80%;

 margin: auto auto;

 overflow: scroll;

 padding: 0;

 table-layout: fixed;

 width: 50%;

 }



table.tk2 th {

 border: 1px solid #841F27;

 text-align: center;

 }



table.tk2 td {

 border: 1px solid #841F27;

 }

 

.tk21 {

 text-align: right;

 width: 50%;

 }



.tk22 {

 text-align: left;

 width: 50%;

 }



.tk73 {

 text-align: right;

 width: 5%;

 }



.t51 { width:  5%; font-size: 75%; }

.t52 { width: 10%; font-size: 75%; }

.t53 { width: 10%; font-size: 75%; }

.t54 { width: 67%; font-size: 75%; }

.t55 { width:  8%; font-size: 75%; text-align: right; }

/*Style 'show menu' label button and hide it by default*/
.show-menu {
	text-decoration: none;
	color: #fff;
	text-align: center;
	margin: 0px auto;
	display: none;
}

/*Hide checkbox*/
input[type=checkbox].menu	{
    display: none;
    -webkit-appearance: none;
}

/*Show menu when invisible checkbox is checked*/
input[type=checkbox]:checked ~ #menu	{
    display: block;
}
input[type=checkbox]:checked ~ .show-menu:before {
    content: "Hide ";
}


@media screen and (max-width : 990px)	{
	.content-home, #content {
			max-width: 960px;
	}
	#sideright {
		margin-left: 0px;
		margin-right: 0px;
		margin: 0 auto;
	}
}

@media screen and (max-width : 760px){
	.container	{
		margin: 0px;
	}
	.month {
		display:none;
	}
	.content-home, #content {
		display: inline-block;
		width: 100%;
		padding: 10px 0px;
		margin: 0 auto;
	}
	#homeimg1	{
		margin:0px auto;
		width:100%;
	}
	#homeimg2	{
		display:block;
		text-align:center;
		margin: 0px;
		width:93%;
	}
	.fleft	{
		float:none;
	}
	.nav	{
		display:block;
		margin: -20px 20px 0px 20px;
	}
	.nav ul {
		position: static;
		display: none;
		padding: 10px 0px 0px 0px;
	}
	.nav li {
		display: block;
		margin: 0px;
		padding: 0px;
		width: 100%;
		border-bottom-style: solid;
		border-color:#548152;
	}
	.nav li a	{
		margin: 0px 1%;
		padding: 5px 0px;
		width:98%;
		display:block;
		font-size: 16px;
	}
	#prot	{
		display: none;
	}
	.obut, .gbut, .abut {
		 -moz-border-radius-topright: 70px;

 -webkit-border-top-right-radius: 70px;

 -khtml-border-top-right-radius: 70px;

 border-top-right-radius: 70px;

 -moz-border-radius-topleft: 70px;

 -webkit-border-top-left-radius: 70px;

 -khtml-border-top-left-radius: 70px;

 border-top-left-radius: 70px;

  -moz-border-radius-bottomright: 70px;

 -webkit-border-bottom-right-radius: 70px;

 -khtml-border-bottom-right-radius: 70px;

 border-bottom-right-radius: 70px;

 -moz-border-radius-bottomleft: 70px;

 -webkit-border-bottom-left-radius: 70px;

 -khtml-border-bottom-left-rradius: 70px;

 border-bottom-left-radius: 70px;

 		font-size: x-large;
	}
	.abut img	{
		height:25px;
		width:25px;
	}
	td.cat1, td.cat2 {
		font-size:large;
	}

	/*Display 'show menu' link*/
	.show-menu {
		display:block;
		width: 90%;
		height: 35px;
		padding-top:10px;
		font-size:x-large;
	}
	.show-menu:before	{
		content:"Show ";
	}
	.w70 {
		width: 100%;
	}