/*=============================================================================
         CONSTANT SETTINGS FOR ALL SCREEN SIZES
=============================================================================*/

HTML {overflow-y: scroll;}

BODY {
	text-align: left;
	font-family: verdana, arial, sans-serif;
	color: #555555;
	background: transparent url(images/background_page.jpg) repeat;}

*	{margin: 0; padding: 0;
	box-sizing: border-box;}

h1 {
	font-weight: bold;
	margin-bottom: 10px;}

h2 {
	font-weight: bold;
	margin-bottom: 7px;}

h3 {
	font-weight: bold;
	margin-bottom: 3px;}

h4 {
	display: none}

p {
	margin-top: 0px;
	margin-bottom: 10px;}

.spc0	{padding-bottom: 5px;}
.spc1	{padding-bottom: 10px;}
.spc2	{padding-bottom: 12px;}
.spc3	{padding-bottom: 22px;}

.lft	{text-align: left;}
.ctr	{text-align: center;}
.rht	{text-align: right;}
.mid	{vertical-align: middle;}
.top	{vertical-align: top;}
.ul	{text-decoration: underline;}
.ital	{font-style: italic;}

.fltl	{float: left;}
.fltr	{float: right;}
.fltc	{margin-left: auto;
	margin-right: auto;}
.clr	{clear: both;}

A         {outline: none;}
A:link    {color: blue;}
A:visited {color: purple;}
A:hover   {color: green;}
A:active  {color: red;}

hr.hrblue {border-top: 4px ridge #acc4fd;}

/*--- IMAGES ---*/

IMG	{
	display: block;
	border: 0;
	outline: 0;}

.fill {
	width: 100%;
	height: auto;}

.autoh {
	height: auto !important;}

.centre {
	margin-left: auto;
	margin-right: auto;}

IMG.box {
	margin-top: 20px;
	margin-bottom: 20px;
	border: 1px solid black !important;
	border-radius: 5px;
	box-shadow: 1px 2px 8px #333333;}
IMG.ibox {
	max-width: 100%;
	height: auto;
	border: 1px solid #c0c0c0;}

.iconimg {
	display: inline-block;
	width: 32px;
	height: 32px;
	margin: 0px 5px 0px 10px;
	vertical-align: middle;}

/*--- DIVS ---*/

#fullpage {
	overflow: hidden;
	background: transparent url(images/background.jpg) repeat;}

#head {
	position: relative;
	top: 0px;
	left: 0px;
	border-bottom: 1px solid black;
	background: transparent url(images/background_header.jpg) repeat;}

#logo {
	position: relative;
	top: 5px;
	left: 20px;
	width: 140px;
	height: 55px;
	background: transparent url(images/logo.png) no-repeat;}

#eboardheader {
	border-top: 1px solid black;
	border-bottom: 1px solid black;
	height: 50px;
	background: url(images/background_header.jpg) repeat;}

#eboardlogo {
	position: relative;
	top: 11px;
   left: 15px;}

#otherlogo {
	position: relative;
	top: 8px;
   left: 15px;}

#foot {
	position: relative;
	bottom: 0px;
	left: 0px;
	height: 20px;
	border-top: 1px solid black;
	background: transparent url(images/background_header.jpg) repeat;}

#bigbox {
	padding: 10px;
	background-color: #ffffff;
	border-radius: 10px 10px 10px 10px;
	box-shadow: 1px 2px 8px #333333;}

.jscode {
	max-width: 900px;
	background-color: #FFFFFF;
	border: 1px solid #acc4fd;
	overflow: auto;}

pre {
	font-size: 14px;}

#feat {
	list-style: none;}

#feat li {
	padding: 0px 0px 8px 10px;}

#feat li::before {
	content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
	color: #83a7fb;
	font-weight: bold;
	display: inline-block;
	width: 1.2em;}

/*--- MENU ---*/

#topmenu {
	list-style:none;}

#topmenu li {
	position:absolute;
	top: 0px;
	background:url(images/Buttons.PNG) no-repeat;}

#topmenu li a {
	display:block;}

/*--- GRIDS ---*/

.grid {
	margin: 8px 0px 8px 10px;
   padding: 10px;
	background-color: #FFFFFF;
	border: 1px solid #acc4fd;
	border-radius: 5px 5px 5px 5px;
	display: grid;
   width: 100%;}

.gridheader {
	color: #0022aa;
	font-style: italic;
	font-size: 0.8em;
	padding: 1px 5px 1px 5px;
	margin-bottom: 6px;
	border: 1px solid darkblue;
	border-radius: 5px 5px 5px 5px;}

/*--- FORMS ---*/

.formdiv  {
	position: relative;
	max-width: 530px;}

.formline {
	padding: 5px 0px 5px 0px;}

.formhide {
	position: absolute;
	left: -9999px;}

.formfld {
	margin-left: 90px;   /* Same as label width */
	margin-right: 10px;}

label {
	float: left;
	padding-top: 4px;
	padding-bottom: 4px;
	width: 90px;}

label span {
	color: #CC0000;}

input,textarea,select {
	padding: 4px  !important;
	border: 1px solid #c0c0c0;
	border-radius: 5px;
	font-family: arial, sans-serif  !important;
	font-size: 14px  !important;}

textarea {
	resize: none;}

input[type="number"] {
	width: 6em;}

.stretch {
	width: 100%;}

input.error,textarea.error {
	border-color: #d08080 !important;}

input:focus,textarea:focus,select:focus {
	box-shadow: 0 0 5px #acc4fd;}

input.error:focus,textarea.error:focus {
	box-shadow: 0 0 5px #c08844;}

#safari {
	position: fixed;
	top: 50px;
	right: 35px;
	width: 200px;
	padding: 10px;
	color: #333333;
	background: transparent url(images/background_error.jpg) repeat;
	border-radius: 10px 10px 10px 10px;
	box-shadow: 1px 2px 8px #333333;}

#errormsg {
	position: absolute;
	top: -20px;
	right: 10px;
	width: 200px;
	padding: 10px;
	color: #333333;
	background: transparent url(images/background_error.jpg) repeat;
	border-radius: 10px 10px 10px 10px;
	box-shadow: 1px 2px 8px #333333;}

.closeBox {
	float: right;
	display: inline-block;
	margin: -4px -4px 0px 6px;
	padding: 12px 6px 14px 6px;
	cursor:pointer;
	color: #eebbbb;
	background: #dd8888;
	border-radius: 5px;
	line-height: 0px;
	font-size: 17px;
	font-weight: bold;
	text-decoration: none;}

.closeBox:hover {
	color: #ffdddd;
	background: #ff5555;}

/*--- BUTTONS ---*/

.btn {
	color:#000040;
	background:#acc4fd;
	border-radius: 4px 4px 4px 4px;
	box-shadow: 1px 1px 2px;
	font-family: arial, sans-serif;
	font-size: 14px;
	font-weight: bold;
	padding: 2px 8px 2px 8px;
	cursor: pointer;}
.btn:hover, .btn:focus {
	color:#001800;
	background:#40B040;}
.btn:active {
	color:#180000;
	background:#C04040;}

.sendbtn {
   display: block;
	margin-left: auto;
   margin-right: auto;}

.linkbtn {
	background: none;
	border: none;
	color: blue;
	text-decoration: underline;
	cursor: pointer;}

.linkbtn:hover {color: green;}

.linkbtn:focus {box-shadow: none;}

/*--- TABLES ---*/

TABLE {
	table-layout: auto;
	border: 1px solid #c0c0c0;
	border-spacing: 0px;
	border-collapse: collapse;
	font-family: arial, sans-serif;
	font-size: 1em;}

TABLE TH {
	border: 1px solid #a0a0a0;
	background-color: #acc4fd;
	padding: 0px 8px 0px 8px;
	font-weight: bold;
	text-align: center;
	vertical-align: top;}

TABLE TD {
	border: 1px solid #c0c0c0;
	background-color: white;
	padding: 0px 8px 0px 8px;
	text-align: left;
	vertical-align: top;}

/* ==== Override for PhotoSwipe ==== */

.pswp__caption__center {
	text-align: center;
	font-size: 1.5em;
	margin-top: 0.3em;
	margin-bottom: 1.5em;}

.pswp__counter {
	color: #acc4fd;
	font-size: 1.5em;
	font-weight: bold;}

/*=============================================================================
         RESPONSIVE ITEMS DEPENDING ON SCREEN SIZE
=============================================================================*/

/*---------------------------------------------------------------------------*/
/* Extra small devices (phones, 460px and down) */
/*---------------------------------------------------------------------------*/
@media only screen and (max-width: 459px) {

BODY {font-size: 13px;}

h1 {font-size: 18px;}
h2 {font-size: 15px;}
h3 {font-size: 13px;}

pre {font-size: 10px;}

.ind1 {margin-left:20px;}
.ind2 {margin-left:0px;}
.pad1 {padding-right:5px;}
.small {font-size: 11px;}


#fullpage {
	margin: 0px;
	box-shadow: 4px 4px 12px #333333;}

#head {
	height: 110px;}

.content {
	min-height: 320px;
	margin: 13px 5px 30px 5px;}

.contentprog {
	margin: 13px 5px 30px 5px;}

#eboardlogo {
	width: 168px;
	height: 25px;
	background: transparent url(images/logo_eboard1.png) no-repeat;}

#otherlogo {
	width: 180px;
	height: 32px;
	background: transparent url(images/logo_other.png) no-repeat;}

/* #foot {} */

.grid {
	margin: 6px 0px 6px 0px;
	padding: 6px;}

.jscode {
	height: 350px;}

.formfld {
	margin-left: 0px;}

#topmenu li, #topmenu li a {height: 28px;}

#topmenu .home {width:56px; background-size: 560.0% 1234.3% !important;}
#topmenu li#home       {background-position: 0px 0px;}
#topmenu li#home:hover {background-position: -56.8px 0px;}
#topmenu li#homeSel    {background-position: -113.6px 0px;}

#topmenu .tree {width:72px; background-size: 435.6% 1234.3% !important;}
#topmenu li#tree       {background-position: 0px -28.8px;}
#topmenu li#tree:hover {background-position: -72.8px -28.8px;}
#topmenu li#treeSel    {background-position: -145.6px -28.8px;}

#topmenu .demo {width:96px; background-size: 326.7% 1234.3% !important;}
#topmenu li#demo       {background-position: 0px -57.6px;}
#topmenu li#demo:hover {background-position: -96.8px -57.6px;}
#topmenu li#demoSel    {background-position: -193.6px -57.6px;}

#topmenu .note {width:96px; background-size: 326.7% 1234.3% !important;}
#topmenu li#note       {background-position: 0px -86.4px;}
#topmenu li#note:hover {background-position: -96.8px -86.4px;}
#topmenu li#noteSel    {background-position: -193.6px -86.4px;}

#topmenu .prog {width:104px; background-size: 301.5% 1234.3% !important;}
#topmenu li#prog       {background-position: 0px -115.2px;}
#topmenu li#prog:hover {background-position: -104.8px -115.2px;}
#topmenu li#progSel    {background-position: -209.6px -115.2px;}

#topmenu .grap {width:72px; background-size: 435.6% 1234.3% !important;}
#topmenu li#grap       {background-position: 0px -144px;}
#topmenu li#grap:hover {background-position: -72.8px -144px;}
#topmenu li#grapSel    {background-position: -145.6px -144px;}

#topmenu .blen {width:72px; background-size: 435.6% 1234.3% !important;}
#topmenu li#blen       {background-position: 0px -172.8px;}
#topmenu li#blen:hover {background-position: -72.8px -172.8px;}
#topmenu li#blenSel    {background-position: -145.6px -172.8px;}

#topmenu .free {width:72px; background-size: 435.6% 1234.3% !important;}
#topmenu li#free       {background-position: 0px -201.6px;}
#topmenu li#free:hover {background-position: -72.8px -201.6px;}
#topmenu li#freeSel    {background-position: -145.6px -201.6px;}

#topmenu .phot {width:80px; background-size: 392.0% 1234.3% !important;}
#topmenu li#phot       {background-position: 0px -230.4px;}
#topmenu li#phot:hover {background-position: -80.8px -230.4px;}
#topmenu li#photSel    {background-position: -161.6px -230.4px;}

#topmenu .cont {width:80px; background-size: 392.0% 1234.3% !important;}
#topmenu li#cont       {background-position: 0px -259.2px;}
#topmenu li#cont:hover {background-position: -80.8px -259.2px;}
#topmenu li#contSel    {background-position: -161.6px -259.2px;}

#topmenu .piec {width:96px; background-size: 326.7% 1234.3% !important;}
#topmenu li#piec       {background-position: 0px -288px;}
#topmenu li#piec:hover {background-position: -96.8px -288px;}
#topmenu li#piecSel    {background-position: -193.6px -288px;}

#topmenu .hifi {width:56px; background-size: 560.0% 1234.3% !important;}
#topmenu li#hifi       {background-position: 0px -316.8px;}
#topmenu li#hifi:hover {background-position: -56.8px -316.8px;}
#topmenu li#hifiSel    {background-position: -113.6px -316.8px;}

/* 72,104,72,56 , 80 */
#topmenu li.homeP1 {top:70px; left:6px;}
#topmenu li.homeP2 {top:70px; left:80px;}
#topmenu li.homeP3 {top:70px; left:186px;}
#topmenu li.homeP4 {top:70px; left:260px;}
#topmenu li.homeP5 {top:20px; left:236px;}

/* 56,72,96,96,80 */
#topmenu li.treeP1 {top:70px; left:20px;}
#topmenu li.treeP2 {top:10px; left:200px;}
#topmenu li.treeP3 {top:40px; left:200px;}
#topmenu li.treeP4 {top:70px; left:200px;}
#topmenu li.treeP5 {top:70px; left:85px;}

/* 56,104,80 */
#topmenu li.progP1 {top:70px; left:20px;}
#topmenu li.progP2 {top:40px; left:200px;}
#topmenu li.progP3 {top:70px; left:200px;}
#topmenu li.progP4 {top:70px; left:85px;}

/* 56,72,72,80,80 */
#topmenu li.grapP1 {top:70px; left:20px;}
#topmenu li.grapP2 {top:10px; left:200px;}
#topmenu li.grapP3 {top:40px; left:200px;}
#topmenu li.grapP4 {top:70px; left:200px;}
#topmenu li.grapP5 {top:70px; left:85px;}

/* 56,72,104,72,80 */
#topmenu li.contP1 {top:70px; left:20px;}
#topmenu li.contP2 {top:10px; left:200px;}
#topmenu li.contP3 {top:40px; left:200px;}
#topmenu li.contP4 {top:70px; left:200px;}
#topmenu li.contP5 {top:70px; left:85px;}

}

/*---------------------------------------------------------------------------*/
/* Extra small devices (phones, 460px to 600px) */
/*---------------------------------------------------------------------------*/
@media only screen and (min-width: 460px) and (max-width: 599px) {

BODY {font-size: 13px;}

h1 {font-size: 18px;}
h2 {font-size: 15px;}
h3 {font-size: 13px;}

pre {font-size: 10px;}

.ind1 {margin-left:20px;}
.ind2 {margin-left:0px;}
.pad1 {padding-right:5px;}
.small {font-size: 11px;}

#fullpage {
	margin: 0px;
	box-shadow: 4px 4px 12px #333333;}

#head {
	height: 110px;}

.content {
	min-height: 320px;
	margin: 13px 5px 30px 5px;}

.contentprog {
	margin: 13px 5px 30px 5px;}

#eboardlogo {
	width: 168px;
	height: 25px;
	background: transparent url(images/logo_eboard1.png) no-repeat;}

#otherlogo {
	width: 180px;
	height: 32px;
	background: transparent url(images/logo_other.png) no-repeat;}

/* #foot {} */

.grid {
	margin: 6px 0px 6px 0px;
	padding: 6px;}

.jscode {
	height: 350px;}

.formfld {
	margin-left: 0px;}

#topmenu li, #topmenu li a {height: 28px;}

#topmenu .home {width:56px; background-size: 560.0% 1234.3% !important;}
#topmenu li#home       {background-position: 0px 0px;}
#topmenu li#home:hover {background-position: -56.8px 0px;}
#topmenu li#homeSel    {background-position: -113.6px 0px;}

#topmenu .tree {width:72px; background-size: 435.6% 1234.3% !important;}
#topmenu li#tree       {background-position: 0px -28.8px;}
#topmenu li#tree:hover {background-position: -72.8px -28.8px;}
#topmenu li#treeSel    {background-position: -145.6px -28.8px;}

#topmenu .demo {width:96px; background-size: 326.7% 1234.3% !important;}
#topmenu li#demo       {background-position: 0px -57.6px;}
#topmenu li#demo:hover {background-position: -96.8px -57.6px;}
#topmenu li#demoSel    {background-position: -193.6px -57.6px;}

#topmenu .note {width:96px; background-size: 326.7% 1234.3% !important;}
#topmenu li#note       {background-position: 0px -86.4px;}
#topmenu li#note:hover {background-position: -96.8px -86.4px;}
#topmenu li#noteSel    {background-position: -193.6px -86.4px;}

#topmenu .prog {width:104px; background-size: 301.5% 1234.3% !important;}
#topmenu li#prog       {background-position: 0px -115.2px;}
#topmenu li#prog:hover {background-position: -104.8px -115.2px;}
#topmenu li#progSel    {background-position: -209.6px -115.2px;}

#topmenu .grap {width:72px; background-size: 435.6% 1234.3% !important;}
#topmenu li#grap       {background-position: 0px -144px;}
#topmenu li#grap:hover {background-position: -72.8px -144px;}
#topmenu li#grapSel    {background-position: -145.6px -144px;}

#topmenu .blen {width:72px; background-size: 435.6% 1234.3% !important;}
#topmenu li#blen       {background-position: 0px -172.8px;}
#topmenu li#blen:hover {background-position: -72.8px -172.8px;}
#topmenu li#blenSel    {background-position: -145.6px -172.8px;}

#topmenu .free {width:72px; background-size: 435.6% 1234.3% !important;}
#topmenu li#free       {background-position: 0px -201.6px;}
#topmenu li#free:hover {background-position: -72.8px -201.6px;}
#topmenu li#freeSel    {background-position: -145.6px -201.6px;}

#topmenu .phot {width:80px; background-size: 392.0% 1234.3% !important;}
#topmenu li#phot       {background-position: 0px -230.4px;}
#topmenu li#phot:hover {background-position: -80.8px -230.4px;}
#topmenu li#photSel    {background-position: -161.6px -230.4px;}

#topmenu .cont {width:80px; background-size: 392.0% 1234.3% !important;}
#topmenu li#cont       {background-position: 0px -259.2px;}
#topmenu li#cont:hover {background-position: -80.8px -259.2px;}
#topmenu li#contSel    {background-position: -161.6px -259.2px;}

#topmenu .piec {width:96px; background-size: 326.7% 1234.3% !important;}
#topmenu li#piec       {background-position: 0px -288px;}
#topmenu li#piec:hover {background-position: -96.8px -288px;}
#topmenu li#piecSel    {background-position: -193.6px -288px;}

#topmenu .hifi {width:56px; background-size: 560.0% 1234.3% !important;}
#topmenu li#hifi       {background-position: 0px -316.8px;}
#topmenu li#hifi:hover {background-position: -56.8px -316.8px;}
#topmenu li#hifiSel    {background-position: -113.6px -316.8px;}

/* 72,104,72,80 */
#topmenu li.homeP1 {top:10px; left:200px;}
#topmenu li.homeP2 {top:40px; left:200px;}
#topmenu li.homeP3 {top:70px; left:200px;}
#topmenu li.homeP4 {top:70px; left:340px;}
#topmenu li.homeP5 {top:70px; left:60px;}

/* 56,72,96,96,80 */
#topmenu li.treeP1 {top:70px; left:90px;}
#topmenu li.treeP2 {top:10px; left:200px;}
#topmenu li.treeP3 {top:40px; left:200px;}
#topmenu li.treeP4 {top:70px; left:200px;}
#topmenu li.treeP5 {top:70px; left:340px;}

/* 56,104,96,80 */
#topmenu li.progP1 {top:70px; left:90px;}
#topmenu li.progP2 {top:40px; left:200px;}
#topmenu li.progP3 {top:70px; left:200px;}
#topmenu li.progP4 {top:70px; left:340px;}

/* 56,72,72,80,80 */
#topmenu li.grapP1 {top:70px; left:90px;}
#topmenu li.grapP2 {top:10px; left:200px;}
#topmenu li.grapP3 {top:40px; left:200px;}
#topmenu li.grapP4 {top:70px; left:200px;}
#topmenu li.grapP5 {top:70px; left:340px;}

/* 56,72,104,72,80 */
#topmenu li.contP1 {top:70px; left:90px;}
#topmenu li.contP2 {top:10px; left:200px;}
#topmenu li.contP3 {top:40px; left:200px;}
#topmenu li.contP4 {top:70px; left:200px;}
#topmenu li.contP5 {top:70px; left:340px;}

}

/*---------------------------------------------------------------------------*/
/* Small devices (portrait tablets and large phones, 600px and up) */
/*---------------------------------------------------------------------------*/
@media only screen and (min-width: 600px) and (max-width: 799px) {

BODY {font-size: 13px;}

h1 {font-size: 19px;}
h2 {font-size: 16px;}
h3 {font-size: 13px;}

pre {font-size: 12px;}

.ind1 {margin-left:30px;}
.ind2 {margin-left:15px;}
.pad1 {padding-right:10px;}
.small {font-size: 11px;}

#fullpage {
	margin: 3px 10px 20px 10px;
	border-radius: 10px 10px 10px 10px;
	box-shadow: 4px 4px 12px #333333;}

#head {
	height: 95px;
	border-radius: 10px 10px 0px 0px;}

.content {
	min-height: 320px;
	margin: 13px 10px 30px 10px;}

.contentprog {
	margin: 13px 10px 30px 10px;}

#eboardlogo {
	width: 332px;
	height: 25px;
	background: transparent url(images/logo_eboard2.png) no-repeat;}

#otherlogo {
	width: 180px;
	height: 32px;
	background: transparent url(images/logo_other.png) no-repeat;}

#foot {
	border-radius: 0px 0px 10px 10px;}

.grid {
	margin: 7px 0px 7px 0px;
	padding: 10px;}

.jscode {
	height: 400px;}

#topmenu li, #topmenu li a {height: 31.5px;}

#topmenu .home {width:63px; background-size: 560.0% 1234.3% !important;}
#topmenu li#home       {background-position: 0px 0px;}
#topmenu li#home:hover {background-position: -63.9px 0px;}
#topmenu li#homeSel    {background-position: -127.8px 0px;}

#topmenu .tree {width:81px; background-size: 435.6% 1234.3% !important;}
#topmenu li#tree       {background-position: 0px -32.4px;}
#topmenu li#tree:hover {background-position: -81.9px -32.4px;}
#topmenu li#treeSel    {background-position: -163.8px -32.4px;}

#topmenu .demo {width:108px; background-size: 326.7% 1234.3% !important;}
#topmenu li#demo       {background-position: 0px -64.8px;}
#topmenu li#demo:hover {background-position: -108.9px -64.8px;}
#topmenu li#demoSel    {background-position: -217.8px -64.8px;}

#topmenu .note {width:108px; background-size: 326.7% 1234.3% !important;}
#topmenu li#note       {background-position: 0px -97.2px;}
#topmenu li#note:hover {background-position: -108.9px -97.2px;}
#topmenu li#noteSel    {background-position: -217.8px -97.2px;}

#topmenu .prog {width:117px; background-size: 301.5% 1234.3% !important;}
#topmenu li#prog       {background-position: 0px -129.6px;}
#topmenu li#prog:hover {background-position: -117.9px -129.6px;}
#topmenu li#progSel    {background-position: -235.8px -129.6px;}

#topmenu .grap {width:81px; background-size: 435.6% 1234.3% !important;}
#topmenu li#grap       {background-position: 0px -162px;}
#topmenu li#grap:hover {background-position: -81.9px -162px;}
#topmenu li#grapSel    {background-position: -163.8px -162px;}

#topmenu .blen {width:81px; background-size: 435.6% 1234.3% !important;}
#topmenu li#blen       {background-position: 0px -194.4px;}
#topmenu li#blen:hover {background-position: -81.9px -194.4px;}
#topmenu li#blenSel    {background-position: -163.8px -194.4px;}

#topmenu .free {width:81px; background-size: 435.6% 1234.3% !important;}
#topmenu li#free       {background-position: 0px -226.8px;}
#topmenu li#free:hover {background-position: -81.9px -226.8px;}
#topmenu li#freeSel    {background-position: -163.8px -226.8px;}

#topmenu .phot {width:90px; background-size: 392.0% 1234.3% !important;}
#topmenu li#phot       {background-position: 0px -259.2px;}
#topmenu li#phot:hover {background-position: -90.9px -259.2px;}
#topmenu li#photSel    {background-position: -181.8px -259.2px;}

#topmenu .cont {width:90px; background-size: 392.0% 1234.3% !important;}
#topmenu li#cont       {background-position: 0px -291.6px;}
#topmenu li#cont:hover {background-position: -90.9px -291.6px;}
#topmenu li#contSel    {background-position: -181.8px -291.6px;}

#topmenu .piec {width:108px; background-size: 326.7% 1234.3% !important;}
#topmenu li#piec       {background-position: 0px -324px;}
#topmenu li#piec:hover {background-position: -108.9px -324px;}
#topmenu li#piecSel    {background-position: -217.8px -324px;}

#topmenu .hifi {width:63px; background-size: 560.0% 1234.3% !important;}
#topmenu li#hifi       {background-position: 0px -356.4px;}
#topmenu li#hifi:hover {background-position: -63.9px -356.4px;}
#topmenu li#hifiSel    {background-position: -127.8px -356.4px;}

/* 81,117,81,90 */
#topmenu li.homeP1 {top:15px; left:180px;}
#topmenu li.homeP2 {top:15px; left:271px;}
#topmenu li.homeP3 {top:15px; left:398px;}
#topmenu li.homeP4 {top:15px; left:489px;}
#topmenu li.homeP5 {top:55px; left:321px;}

/* 63,81,108,108,90 */
#topmenu li.treeP1 {top:15px; left:200px;}
#topmenu li.treeP2 {top:55px; left:200px;}
#topmenu li.treeP3 {top:55px; left:291px;}
#topmenu li.treeP4 {top:55px; left:409px;}
#topmenu li.treeP5 {top:15px; left:273px;}

/* 63,117,108,90 */
#topmenu li.progP1 {top:15px; left:200px;}
#topmenu li.progP2 {top:55px; left:200px;}
#topmenu li.progP3 {top:55px; left:327px;}
#topmenu li.progP4 {top:15px; left:273px;}

/* 63,81,81,90,90 */
#topmenu li.grapP1 {top:15px; left:200px;}
#topmenu li.grapP2 {top:55px; left:200px;}
#topmenu li.grapP3 {top:55px; left:291px;}
#topmenu li.grapP4 {top:55px; left:382px;}
#topmenu li.grapP5 {top:15px; left:273px;}

/* 63,81,117,81,90 */
#topmenu li.contP1 {top:15px; left:200px;}
#topmenu li.contP2 {top:55px; left:200px;}
#topmenu li.contP3 {top:55px; left:291px;}
#topmenu li.contP4 {top:55px; left:418px;}
#topmenu li.contP5 {top:15px; left:273px;}

}

/*---------------------------------------------------------------------------*/
/* Medium devices (landscape tablets, 768px and up) */
/*---------------------------------------------------------------------------*/
@media only screen and (min-width: 800px) and (max-width: 991px) {

BODY {font-size: 14px;}

h1 {font-size: 20px;}
h2 {font-size: 17px;}
h3 {font-size: 14px;}

.ind1 {margin-left:35px;}
.ind2 {margin-left:35px;}
.pad1 {padding-right:15px;}
.small {font-size: 12px;}

#fullpage {
	margin: 4px 15px 20px 15px;
	border-radius: 10px 10px 10px 10px;
	box-shadow: 4px 4px 12px #333333;}

#head {
	height: 64px;
	border-radius: 10px 10px 0px 0px;}

.content {
	min-height: 320px;
	margin: 13px 10px 30px 10px;}

.contentprog {
	margin: 13px 10px 30px 10px;}

#eboardlogo {
	width: 332px;
	height: 25px;
	background: transparent url(images/logo_eboard2.png) no-repeat;}

#otherlogo {
	width: 180px;
	height: 32px;
	background: transparent url(images/logo_other.png) no-repeat;}

#foot {
	border-radius: 0px 0px 10px 10px;}

.grid {
	margin: 7px 0px 7px 0px;
	padding: 10px;}

.jscode {
	height: 450px;}

#topmenu li, #topmenu li a {height: 35px;}

#topmenu .home {width:70px}
#topmenu li#home       {background-position: 0px 0px;}
#topmenu li#home:hover {background-position: -71px 0px;}
#topmenu li#homeSel    {background-position: -142px 0px;}

#topmenu .tree {width:90px}
#topmenu li#tree       {background-position: 0px -36px;}
#topmenu li#tree:hover {background-position: -91px -36px;}
#topmenu li#treeSel    {background-position: -182px -36px;}

#topmenu .demo {width:120px}
#topmenu li#demo       {background-position: 0px -72px;}
#topmenu li#demo:hover {background-position: -121px -72px;}
#topmenu li#demoSel    {background-position: -242px -72px;}

#topmenu .note {width:120px}
#topmenu li#note       {background-position: 0px -108px;}
#topmenu li#note:hover {background-position: -121px -108px;}
#topmenu li#noteSel    {background-position: -242px -108px;}

#topmenu .prog {width:130px}
#topmenu li#prog       {background-position: 0px -144px;}
#topmenu li#prog:hover {background-position: -131px -144px;}
#topmenu li#progSel    {background-position: -262px -144px;}

#topmenu .grap {width:90px}
#topmenu li#grap       {background-position: 0px -180px;}
#topmenu li#grap:hover {background-position: -91px -180px;}
#topmenu li#grapSel    {background-position: -182px -180px;}

#topmenu .blen {width:90px}
#topmenu li#blen       {background-position: 0px -216px;}
#topmenu li#blen:hover {background-position: -91px -216px;}
#topmenu li#blenSel    {background-position: -182px -216px;}

#topmenu .free {width:90px}
#topmenu li#free       {background-position: 0px -252px;}
#topmenu li#free:hover {background-position: -91px -252px;}
#topmenu li#freeSel    {background-position: -182px -252px;}

#topmenu .phot {width:100px}
#topmenu li#phot       {background-position: 0px -288px;}
#topmenu li#phot:hover {background-position: -101px -288px;}
#topmenu li#photSel    {background-position: -202px -288px;}

#topmenu .cont {width:100px}
#topmenu li#cont       {background-position: 0px -324px;}
#topmenu li#cont:hover {background-position: -101px -324px;}
#topmenu li#contSel    {background-position: -202px -324px;}

#topmenu .piec {width:120px}
#topmenu li#piec       {background-position: 0px -360px;}
#topmenu li#piec:hover {background-position: -121px -360px;}
#topmenu li#piecSel    {background-position: -242px -360px;}

#topmenu .hifi {width:70px}
#topmenu li#hifi       {background-position: 0px -396px;}
#topmenu li#hifi:hover {background-position: -71px -396px;}
#topmenu li#hifiSel    {background-position: -142px -396px;}

/* 200,90,10,130,10,90,10,100 */
#topmenu li.homeP1 {top:15px; left:200px;}
#topmenu li.homeP2 {top:15px; left:300px;}
#topmenu li.homeP3 {top:15px; left:440px;}
#topmenu li.homeP4 {top:15px; left:540px;}
#topmenu li.homeP5 {top:15px; left:620px;}

/* 200,70,10,90,10,120,10,120,10,100 */
#topmenu li.treeP1 {top:15px; left:200px;}
#topmenu li.treeP2 {top:15px; left:280px;}
#topmenu li.treeP3 {top:15px; left:380px;}
#topmenu li.treeP4 {top:15px; left:510px;}
#topmenu li.treeP5 {top:15px; left:640px;}

/* 220,[70],10,[130],10,[120],10,[100] */
#topmenu li.progP1 {top:15px; left:220px;}
#topmenu li.progP2 {top:15px; left:300px;}
#topmenu li.progP3 {top:15px; left:440px;}
#topmenu li.progP4 {top:15px; left:570px;}

/* 200,70,20,90,20,90,20,100,20,100 */
#topmenu li.grapP1 {top:15px; left:200px;}
#topmenu li.grapP2 {top:15px; left:280px;}
#topmenu li.grapP3 {top:15px; left:380px;}
#topmenu li.grapP4 {top:15px; left:480px;}
#topmenu li.grapP5 {top:15px; left:590px;}

/* 200,70,20,90,20,130,20,90,20,100 */
#topmenu li.contP1 {top:15px; left:200px;}
#topmenu li.contP2 {top:15px; left:280px;}
#topmenu li.contP3 {top:15px; left:380px;}
#topmenu li.contP4 {top:15px; left:520px;}
#topmenu li.contP5 {top:15px; left:620px;}

}

/*---------------------------------------------------------------------------*/
/* Large devices (laptops/desktops, 992px and up) */
/*---------------------------------------------------------------------------*/
@media only screen and (min-width: 992px) and (max-width: 1199px) {

BODY {font-size: 14px;}

h1 {font-size: 20px;}
h2 {font-size: 17px;}
h3 {font-size: 14px;}

.ind1 {margin-left:40px;}
.ind2 {margin-left:40px;}
.pad1 {padding-right:30px;}
.small {font-size: 12px;}

#fullpage {
	margin: 5px 20px 25px 20px;
	border-radius: 10px 10px 10px 10px;
	box-shadow: 4px 4px 12px #333333;}

#head {
	height: 64px;
	border-radius: 10px 10px 0px 0px;}

.content {
	min-height: 320px;
	margin: 13px 15px 30px 15px;}

.contentprog {
	margin: 13px 15px 30px 15px;}

#eboardlogo {
	width: 332px;
	height: 25px;
	background: transparent url(images/logo_eboard2.png) no-repeat;}

#otherlogo {
	width: 180px;
	height: 32px;
	background: transparent url(images/logo_other.png) no-repeat;}

#foot {
	border-radius: 0px 0px 10px 10px;}

.grid {
	margin: 8px 0px 8px 10px;
	padding: 10px;}

.jscode {
	height: 500px;}

#topmenu li, #topmenu li a {height: 35px;}

#topmenu .home {width:70px}
#topmenu li#home       {background-position: 0px 0px;}
#topmenu li#home:hover {background-position: -71px 0px;}
#topmenu li#homeSel    {background-position: -142px 0px;}

#topmenu .tree {width:90px}
#topmenu li#tree       {background-position: 0px -36px;}
#topmenu li#tree:hover {background-position: -91px -36px;}
#topmenu li#treeSel    {background-position: -182px -36px;}

#topmenu .demo {width:120px}
#topmenu li#demo       {background-position: 0px -72px;}
#topmenu li#demo:hover {background-position: -121px -72px;}
#topmenu li#demoSel    {background-position: -242px -72px;}

#topmenu .note {width:120px}
#topmenu li#note       {background-position: 0px -108px;}
#topmenu li#note:hover {background-position: -121px -108px;}
#topmenu li#noteSel    {background-position: -242px -108px;}

#topmenu .prog {width:130px}
#topmenu li#prog       {background-position: 0px -144px;}
#topmenu li#prog:hover {background-position: -131px -144px;}
#topmenu li#progSel    {background-position: -262px -144px;}

#topmenu .grap {width:90px}
#topmenu li#grap       {background-position: 0px -180px;}
#topmenu li#grap:hover {background-position: -91px -180px;}
#topmenu li#grapSel    {background-position: -182px -180px;}

#topmenu .blen {width:90px}
#topmenu li#blen       {background-position: 0px -216px;}
#topmenu li#blen:hover {background-position: -91px -216px;}
#topmenu li#blenSel    {background-position: -182px -216px;}

#topmenu .free {width:90px}
#topmenu li#free       {background-position: 0px -252px;}
#topmenu li#free:hover {background-position: -91px -252px;}
#topmenu li#freeSel    {background-position: -182px -252px;}

#topmenu .phot {width:100px}
#topmenu li#phot       {background-position: 0px -288px;}
#topmenu li#phot:hover {background-position: -101px -288px;}
#topmenu li#photSel    {background-position: -202px -288px;}

#topmenu .cont {width:100px}
#topmenu li#cont       {background-position: 0px -324px;}
#topmenu li#cont:hover {background-position: -101px -324px;}
#topmenu li#contSel    {background-position: -202px -324px;}

#topmenu .piec {width:120px}
#topmenu li#piec       {background-position: 0px -360px;}
#topmenu li#piec:hover {background-position: -121px -360px;}
#topmenu li#piecSel    {background-position: -242px -360px;}

#topmenu .hifi {width:70px}
#topmenu li#hifi       {background-position: 0px -396px;}
#topmenu li#hifi:hover {background-position: -71px -396px;}
#topmenu li#hifiSel    {background-position: -142px -396px;}

/* 200,[90],20,[130],20,[90],20,[100] */
#topmenu li.homeP1 {top:15px; left:200px;}
#topmenu li.homeP2 {top:15px; left:310px;}
#topmenu li.homeP3 {top:15px; left:460px;}
#topmenu li.homeP4 {top:15px; left:570px;}
#topmenu li.homeP5 {top:15px; left:660px;}

/* 200,[70],20,[90],20,[120],20,[120],20,[100] */
#topmenu li.treeP1 {top:15px; left:200px;}
#topmenu li.treeP2 {top:15px; left:290px;}
#topmenu li.treeP3 {top:15px; left:400px;}
#topmenu li.treeP4 {top:15px; left:540px;}
#topmenu li.treeP5 {top:15px; left:680px;}

/* 220,[70],20,[130],20,[120],20,[100] */
#topmenu li.progP1 {top:15px; left:220px;}
#topmenu li.progP2 {top:15px; left:310px;}
#topmenu li.progP3 {top:15px; left:460px;}
#topmenu li.progP4 {top:15px; left:600px;}

/* 200,70,20,90,20,90,20,100,20,100 */
#topmenu li.grapP1 {top:15px; left:200px;}
#topmenu li.grapP2 {top:15px; left:290px;}
#topmenu li.grapP3 {top:15px; left:400px;}
#topmenu li.grapP4 {top:15px; left:510px;}
#topmenu li.grapP5 {top:15px; left:630px;}

/* 200,70,20,90,20,130,20,90,20,100 */
#topmenu li.contP1 {top:15px; left:200px;}
#topmenu li.contP2 {top:15px; left:290px;}
#topmenu li.contP3 {top:15px; left:400px;}
#topmenu li.contP4 {top:15px; left:550px;}
#topmenu li.contP5 {top:15px; left:660px;}

}

/*---------------------------------------------------------------------------*/
/* Extra large devices (large laptops and desktops, 1200px and up) */
/*---------------------------------------------------------------------------*/
@media only screen and (min-width: 1200px) {

BODY {font-size: 14px;}

h1 {font-size: 20px;}
h2 {font-size: 17px;}
h3 {font-size: 14px;}

.ind1 {margin-left:40px;}
.ind2 {margin-left:40px;}
.pad1 {padding-right:30px;}
.small {font-size: 12px;}

#fullpage {
	margin: 5px 30px 30px 30px;
	border-radius: 10px 10px 10px 10px;
	box-shadow: 4px 4px 12px #333333;}

#head {
	height: 64px;
	border-radius: 10px 10px 0px 0px;}

.content {
	min-height: 320px;
	margin: 13px 20px 30px 20px;}

.contentprog {
	margin: 13px 20px 30px 20px;}

#eboardlogo {
	width: 332px;
	height: 25px;
	background: transparent url(images/logo_eboard2.png) no-repeat;}

#otherlogo {
	width: 180px;
	height: 32px;
	background: transparent url(images/logo_other.png) no-repeat;}

#foot {
	border-radius: 0px 0px 10px 10px;}

.jscode {
	height: 500px;}

#topmenu li, #topmenu li a {height: 35px;}

#topmenu .home {width:70px}
#topmenu li#home       {background-position: 0px 0px;}
#topmenu li#home:hover {background-position: -71px 0px;}
#topmenu li#homeSel    {background-position: -142px 0px;}

#topmenu .tree {width:90px}
#topmenu li#tree       {background-position: 0px -36px;}
#topmenu li#tree:hover {background-position: -91px -36px;}
#topmenu li#treeSel    {background-position: -182px -36px;}

#topmenu .demo {width:120px}
#topmenu li#demo       {background-position: 0px -72px;}
#topmenu li#demo:hover {background-position: -121px -72px;}
#topmenu li#demoSel    {background-position: -242px -72px;}

#topmenu .note {width:120px}
#topmenu li#note       {background-position: 0px -108px;}
#topmenu li#note:hover {background-position: -121px -108px;}
#topmenu li#noteSel    {background-position: -242px -108px;}

#topmenu .prog {width:130px}
#topmenu li#prog       {background-position: 0px -144px;}
#topmenu li#prog:hover {background-position: -131px -144px;}
#topmenu li#progSel    {background-position: -262px -144px;}

#topmenu .grap {width:90px}
#topmenu li#grap       {background-position: 0px -180px;}
#topmenu li#grap:hover {background-position: -91px -180px;}
#topmenu li#grapSel    {background-position: -182px -180px;}

#topmenu .blen {width:90px}
#topmenu li#blen       {background-position: 0px -216px;}
#topmenu li#blen:hover {background-position: -91px -216px;}
#topmenu li#blenSel    {background-position: -182px -216px;}

#topmenu .free {width:90px}
#topmenu li#free       {background-position: 0px -252px;}
#topmenu li#free:hover {background-position: -91px -252px;}
#topmenu li#freeSel    {background-position: -182px -252px;}

#topmenu .phot {width:100px}
#topmenu li#phot       {background-position: 0px -288px;}
#topmenu li#phot:hover {background-position: -101px -288px;}
#topmenu li#photSel    {background-position: -202px -288px;}

#topmenu .cont {width:100px}
#topmenu li#cont       {background-position: 0px -324px;}
#topmenu li#cont:hover {background-position: -101px -324px;}
#topmenu li#contSel    {background-position: -202px -324px;}

#topmenu .piec {width:120px}
#topmenu li#piec       {background-position: 0px -360px;}
#topmenu li#piec:hover {background-position: -121px -360px;}
#topmenu li#piecSel    {background-position: -242px -360px;}

#topmenu .hifi {width:70px}
#topmenu li#hifi       {background-position: 0px -396px;}
#topmenu li#hifi:hover {background-position: -71px -396px;}
#topmenu li#hifiSel    {background-position: -142px -396px;}

/* 200,[90],20,[130],20,[90],20,[100] */
#topmenu li.homeP1 {top:15px; left:200px;}
#topmenu li.homeP2 {top:15px; left:310px;}
#topmenu li.homeP3 {top:15px; left:460px;}
#topmenu li.homeP4 {top:15px; left:570px;}
#topmenu li.homeP5 {top:15px; left:660px;}

/* 200,[70],20,[90],20,[120],20,[120],20,[100] */
#topmenu li.treeP1 {top:15px; left:200px;}
#topmenu li.treeP2 {top:15px; left:290px;}
#topmenu li.treeP3 {top:15px; left:400px;}
#topmenu li.treeP4 {top:15px; left:540px;}
#topmenu li.treeP5 {top:15px; left:680px;}

/* 220,[70],20,[130],20,[120],20,[100] */
#topmenu li.progP1 {top:15px; left:220px;}
#topmenu li.progP2 {top:15px; left:310px;}
#topmenu li.progP3 {top:15px; left:460px;}
#topmenu li.progP4 {top:15px; left:600px;}

/* 200,[70],20,[90],20,[90],20,[100],20,[100] */
#topmenu li.grapP1 {top:15px; left:200px;}
#topmenu li.grapP2 {top:15px; left:290px;}
#topmenu li.grapP3 {top:15px; left:400px;}
#topmenu li.grapP4 {top:15px; left:510px;}
#topmenu li.grapP5 {top:15px; left:630px;}

/* 200,[70],20,[90],20,[130],20,[90],20,[100] */
#topmenu li.contP1 {top:15px; left:200px;}
#topmenu li.contP2 {top:15px; left:290px;}
#topmenu li.contP3 {top:15px; left:400px;}
#topmenu li.contP4 {top:15px; left:550px;}
#topmenu li.contP5 {top:15px; left:660px;}

}

/*=============================================================================
         FORMATTING FOR PRINT MEDIA
=============================================================================*/

@media print {

BODY {
	text-align: left;
	font-family: "Times New Roman", Times, serif;
	font-size: 11pt;
	color: #000000;
	background: none;}

h1 {
	text-align: center;
	margin-bottom: 0px;}

h4 {
	display: block}

h4.byline {
	display: block;
   margin-bottom: 10px;}

.ind1 {margin-left:40px;}
.ind2 {margin-left:40px;}
.pad1 {padding-right:30px;}

.ibox {
	border: none;
   margin: 0px 0px 0px 5px;}

#fullpage {
	margin: 0px 0px 0px 0px;
	border-radius: 0px 0px 0px 0px;
	box-shadow: none;
	background: none;}

#head {display:none;}

#foot {display:none;}

.content {}
.contentprog {}

pre {
	font-size: 8pt;
	padding: 10pt 0pt 10pt 0pt;}

}
