/* Reset
------------------------------------------------------------ */
html { overflow-y: scroll;}a.default

{ 
	color: #f0f0ff; 

}

#wrapper {
	width: 100%;	
	max-width: 1024px;
} 

.imageHeaderLeft {
	margin-left: 3%;
	display: inline;
	float: left;
}

.imageHeaderLeft > img{
	width: 100%;
}

.imageHeaderLeft table{
	width: 100%;
}

.imageHeaderCenter {
	display: inline;
	float: left;
}

.imageHeaderRight {
	display: inline;
	float: right;
}

.imageContentLeft {
	display: inline;
	float: left;
	margin: 10px;
}

/* Hide this when screen is small */
.imageContentCenter {
	display: inline;
	float: left;
	margin: 10px;
}

/* Hide this first when screen is small */
.imageContentRight {
	display: inline;
	float: left;
	margin: 10px;
}

.imageContentLeftBlock {
	display: block;
	float: left;
	margin-left: 20px;
	margin-right: 20px;
}

.navButtonLeftSide {
	display: inline;
	float: left;
}

.navButtonRightSide {
	display: inline;
	float: right;
}


.navButtonNextOrPrev {
	display: inline;
	margin: 10px;
}

.navButtonUp {
	display: inline;
	margin: 8px;
}


/* Set width to 100% for small screens */
.imageGrid {
	width: inherit;
}

.textContent480 {
	display: inline;
	float: left;
	width: 480px;
	margin: 10px;
}

.textContent360 {
	display: inline;
	float: left;
	width: 360px;
	margin: 10px;
}


.menuTop {
	clear: both;
	width: 100%;
	color: #f0f080; 
    background-color: #484840;
	padding-left: 1%;
	font-weight: bold;
	font-size: 1.1em;
	text-decoration: none
}

div.menuSide {
	clear: left;
	float: left;
	width: 10%;
	margin-left: 25px;
	margin-right: 25px;
}

.clearFloat {
	clear: both;
}

#nav-trigger {
  float: right;
   }
  #nav-trigger img {
    display: inline-block;
    background-color: #484840;
    color: white;
    cursor: pointer;
    text-transform: uppercase; }
    #nav-trigger img:after {
      display: inline-block;
      margin-left: 10px;
      width: 20px;
      height: 10px;
      content: "";
      border-left: solid 10px transparent;
      border-top: solid 10px #fff;
      border-right: solid 10px transparent; }
    #nav-trigger img:hover {
      background-color: #686860; }
    #nav-trigger img.open:after {
      border-left: solid 10px transparent;
      border-top: none;
      border-bottom: solid 10px #fff;
      border-right: solid 10px transparent; }

nav {
  margin-bottom: 0px; }

nav#nav-main {
  background-color: #484840;
  padding: 4px 4px; }
  nav#nav-main ul {
    list-style-type: none;
    margin: 0;
    padding-left: 10px;
    text-align: left; }
  nav#nav-main li {
    display: inline-block;
    padding: 0px 7px; }
    nav#nav-main li:last-child {
      border-right: none; }
  nav#nav-main a {
    display: block;
    color: #eeeecc;
	font-weight: bold;
    padding: 5px 10x; }
    nav#nav-main a:hover {
      background-color: #686860;
      color: #fff; }

nav#nav-mobile {
  position: relative;
  display: inline; }
  nav#nav-mobile ul {
    display: none;
    list-style-type: none;
    position: absolute;
    left: -140;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    text-align: right;
	width: 130px;
	padding: 0px;
    background-color: #484840; }
  nav#nav-mobile li {
    display: block;
    text-align: right;
    padding: 5px 5px;
    margin: 5px 5px;
    border-bottom: solid 1px #181810; }
    nav#nav-mobile li:last-child {
      border-bottom: none; }
  nav#nav-mobile a {
    display: inline-block;
    color: white;
	font-weight: bold;
    padding: 5px 5px; }
    nav#nav-mobile a:hover {
      background-color: #686860;
      color: #fff; }


#main {
	width: 100%
	border: 2px solid red;
}

.contentFloat {
	width: 94%;
	margin-left: 3%;
	margin-right: 3%;
}

.contentFloat > img {
	width: 90%;
}

.contentCenter {
	display: block;
	width: 80%;
	margin: auto;
}


A:link 
{
text-decoration: underline; 
color: #ffffe0;
}

A:visited 
{
text-decoration: underline; 
color: #ffffe0;
}

A:active 
{
text-decoration: underline; 
color: #ffffe0;
}

A:hover 
{
text-decoration: underline, bold; 
color: #44aaff;
}

a.gray
{ 
	color: #fafafa;
}

BODY
{
   	background-color: #001020;
   	old-background-color: #102030;
	save: #152628;
	margin:  0;
	font-family: Arial,Verdana,sans-serif; 
	font-size: 0.85em; 
	color: #ffffff; 
}

table.header
{
   	background-color: #001020;

}

td.header
{
	color: #ffffff; 
	background-color: #001020;
	font-family: Arial,sans-serif; 
	font-size: 10pt; 
	text-align: left;
	font-weight: bold;
}

table.menuTop
{
    	background-color: #2B4B4E;

}

tr.menuDivider
{
    	background-color: #000000;
}

td.menuTop
{
	color: #808080; 
    background-color: #484840;
    background-color-save: #343834;

}

td.menuSide
{
	background-color: #001020;
   	background-color-save: #1E3638;

}

.content
{ 
	font-family: Arial,sans-serif; 
	font-size: 1em; 
	color: #ffffff; 
}

.contentDim
{ 
	font-family: Arial,sans-serif; 
	font-size: 1em; 
	color: #001020;
}
.contentGray
{ 
	font-family: Arial,sans-serif; 
	font-size: 10pt; 
	color: #f0f0f0; 
}

.contentHighlight
{ 
	color: #ffff60; 
}

.contentText
{ 
	text-align:  left;
	font-family: Arial,sans-serif; 
	font-size: 10pt; 
	color: #ffffff; 
}

.contentTextBackground
{ 
	font-family: Arial,Verdana,sans-serif;
	font-size: 8pt; 
	color: #001021;
	text-decoration: none;
}
.contentPrice
{ 
	font-family: Arial,sans-serif; 
	font-size: 10pt; 
	color: #44aaff; 
	font-weight: bold;
}

.contentSold
{ 
	font-family: Arial,sans-serif; 
	font-size: 10pt; 
	color: #FF0000; 
	font-weight: bold;
}

.contentTextLight
{ 
	text-align:  left;
	font-family: Arial,Verdana,sans-serif; 
	font-size: 11pt; 
	color: #ffffff; 
	font-weight: bold;
}

.contentTextCaption
{ 
	text-align:  center;
	font-family: Arial,Verdana,sans-serif; 
	font-size: 10pt; 
	color: #ffffff; 
}

.contentTextSmall
{ 
	text-align:  center;
	font-family: Arial,Verdana,sans-serif; 
	font-size: 9pt; 
	color: #ffffff; 
	font-weight: bold;
}

.contentTextSmallLink
{ 
	font-family: Arial,Verdana,sans-serif; 
	font-size: 8pt; 
	color: #ffffff; 
}

.contentTextSmallCaption
{ 
	text-align:  center;
	font-family: Arial,Verdana,sans-serif; 
	font-size: 8pt; 
	color: #ffffff; 
}


.contentTextTiny
{ 
	font-family: Arial,Verdana,sans-serif;
	font-size: 8pt; 
	color: #ffffff; 
	font-weight: bold;
}

.contentTextHighlight
{ 
	text-align:  left;
	font-family: Arial,Verdana,sans-serif; 
	font-size: 11pt; 
	color: #f0f0ff; 
	font-weight: bold;
}

.header
{ 
    	background-color: #ffffff; 
	text-align:  center;
}

.headerTitle
{ 
	font-family: Arial,Verdana,sans-serif; 
	font-size: 16pt; 
	color: #ffffff; 
	font-weight: bold 
}

.headerTitleDark
{ 
	font-family: Arial,Verdana,sans-serif; 
	font-size: 14pt; 
	color: #ffffff; 
	font-weight: bold 
}

.headerTitleLight
{ 
	font-family: Arial,Verdana,sans-serif;
	font-size: 16pt; 
	color: #ffffff; 
	font-weight: bold 
}
.headerMenu
{ 
	font-family: Arial,Verdana,sans-serif; 
	font-size: 9pt; 
	color: #ffffff; 
	text-decoration: none
}
.headerMenuLink
{ 
	font-family: Arial,Verdana,sans-serif;
	font-size: 10pt; 
	color: #ffffff; 
	text-decoration: none
}

.headerName
{ 
	font-family: Arial,Verdana,sans-serif; 
	font-size: 12pt; 
	color: #ffffff; 
	font-weight: bold 
}

.imageCaptionMedium
{ 
	font-family: Arial,Verdana,sans-serif; 
	font-size: 10pt; 
	color: #ffffff; 
	font-weight: bold 
}
.imageCaptionSmall
{ 
	font-family: Arial,Verdana,sans-serif; 
	font-size: 8pt; 
	color: #ffffff; 
	font-weight: bold 
}

.linkMenuTop
{ 
}

.linkMenuBottom
{ 
	font-family: Arial,Verdana,sans-serif; 
	font-size: 12pt; 
	color: #ffffff; 
	font-weight: bold;
}

.footerCopyright
{ 
	text-align:  center;
	font-family: Arial,Verdana,sans-serif; 
	font-size: 8pt; 
	color: #ffffff; 
}
.footerCopyrightLeft
{ 
	text-align: left;
	font-family: Arial,Verdana,sans-serif; 
	font-size: 0.75em; 
	color: #ffffff; 
}

.footerCredits
{ 
	text-align:  center;
	font-family: Arial,Verdana,sans-serif; 
	font-size: 8pt; 
	color: #ffffff; 
}
.HiddenTextField
{ 
	background-color: #001020;
	border-color: #001020;
	border-width: 0;
}

H1 
{
	font-family: Arial,Verdana,sans-serif; 
	font-size: 14pt; 
	color: #ffffff; 
	font-weight: bold 
	text-decoration: none;
}
H2 
{
	font-family: Arial,Verdana,sans-serif; 
	font-size: 14pt; 
	color: #ffffff; 
	font-weight: bold 
}

/* Media Queries */

@media all and (max-width: 315px) {
	.imageHeaderLeft {
		display: none;
	}
}

@media all and (max-width: 320px) {

	.imageContentCenter {
		display: none;
	}		
	.imageContentRight {
		display: none;
	}		

	.imageHeaderCenter {
		display: none;
	}	
	.navButtonNextOrPrev {
		margin: 2px;
	}
}

@media all and (max-width: 620px) {
	.imageContentCenter {
		display: none;
	}		
	.imageContentRight {
		display: none;
	}		

	.imageHeaderCenter {
		display: none;
	}	
	
	.navButtonUp {
		display: none;
	}

	.textContent480 {
		display: block;
		width: 100%;
	}

	.textContent360 {
		display: block;
		width: 100%;
	}

	.contentCenter {
		display: block;
		width: 90%;
		margin: auto;
	}

}

@media all and (max-width: 730px) {
	.imageHeaderCenter {
		display: none;
	}	
}

@media all and (max-width: 800px) {
	#nav-trigger {
	display: block; }

	nav#nav-main {
	display: none; }

	nav#nav-mobile {
	display: block; } 
		

}

@media all and (max-width: 830px) {
	
	.imageContentRight {
		display: none;
	}
		
	.pageHeader {
		display: inline;
		border-bottom: solid 1px #fff;
		background-color: #ffffff;
	}
	

	/* Set width to 100% for small screens to dynamically resize*/
	.imageGrid {
		width: 100%;
	}
}

