BODY
{
    PADDING-RIGHT: 0px;
    PADDING-LEFT: 0px;
    FONT-SIZE: 16px;
    PADDING-BOTTOM: 0px;
    MARGIN: 0px;
    COLOR: #333366;
    PADDING-TOP: 0px;
    FONT-FAMILY: Arial, Helvetica, Sans-serif;
    TOP: 0px;
    background-color:white;
}
DIV.BodyDiv
{
}
table.HeaderTable
{
    BORDER-RIGHT: 0px;
    PADDING-RIGHT: 0px;
    BORDER-TOP: 0px;
    PADDING-LEFT: 0px;
    PADDING-BOTTOM: 0px;
    BORDER-LEFT: 0px;
    WIDTH: 100%;
    COLOR: #333366;
    PADDING-TOP: 0px;
    BORDER-BOTTOM: 0px;
    BACKGROUND-COLOR: white;
    border-spacing:0px;
    border-collapse:collapse;
}
@media only screen and ( max-width: 800px ) {

@supports (zoom:1.5) {
	input[type="radio"],  input[type=checkbox]{
	zoom: 1.5;
		}
	}
@supports not (zoom:1.5) {
	input[type="radio"],  input[type=checkbox]{
		transform: scale(1.5);
		margin: 15px;
		}
	}


}

.SampleButton {
background:rgb(221, 221, 221);
color:black;
display: inline-block;
}
@media only screen and ( max-width: 800px ) {
	.SampleButton {
	width:50px;
	height:30px;
	}

}


@media only screen and ( max-width: 800px ) {
  table.HeaderTable{
	display:none;
  }
}

img.PromoPhoto
{
	width:600px;
	height:auto;
}
@media only screen and ( max-width: 800px ) {
  img.PromoPhoto{
	width:90%;
	height:auto;
  }
}

div.HeaderTableMobile {
	width:100%; 
	border-collapse:collapse;
        border-spacing:0px;
	border:0px;
	}

@media ( min-width: 800px ) {
div.HeaderTableMobile {
	display:none;
	}
}

.headlinks
{
    FONT-SIZE: 8pt;
    COLOR: #333366;
    FONT-FAMILY: Arial, Helvetica, Sans-serif;
    TEXT-ALIGN: center
}
A.headlinks
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 8pt;
    TEXT-DECORATION: none
}
A.headlinks:hover
{
    TEXT-DECORATION: underline;
}
TR.HeaderRow1
{
    WIDTH: 100%;
}
TD.HeaderRow1
{
    BORDER-right: 0px;
    BORDER-TOP: 0px;
    FONT-SIZE: 12pt;
    BORDER-LEFT: 0px;
    BORDER-BOTTOM: #333366 1px solid;
    padding:0px;
}
tr.HeaderMenuRow
{
    WIDTH: 100%;
    COLOR: white;
    BACKGROUND-COLOR: #333366;
    TEXT-ALIGN: center;
}
td.HeaderMenuRow
{
}
TABLE.HeaderMenu
{
    BORDER-RIGHT: medium none;
    BORDER-TOP: medium none;
    BORDER-LEFT: medium none;
    WIDTH: 100%;
    COLOR: white;
    BORDER-BOTTOM: medium none;
    TEXT-ALIGN: center;
}
TR.HeaderMenu
{
}
TD.HeaderMenu
{
    COLOR: white;
    TEXT-ALIGN: center
}
A.HeaderMenu
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 8pt;
    COLOR: white;
    TEXT-DECORATION: none;
}
A.HeaderMenu:hover
{
    TEXT-DECORATION: underline;
}
DIV.Footer
{
    WIDTH: 100%
}
@media only screen and ( max-width: 800px ) {
  Div.Footer{
	display:none;
	WIDTH: 0%;
  }
}
Div.footermobile {
		display:block;
		width:100%;		
	}


@media ( min-width: 800px ) {
Div.footermobile {
	display:none;
}
}

TABLE.Footer
{
    WIDTH: 100%
}
TR.Footer
{
    FONT-SIZE: 10pt;
    COLOR: white;
    BACKGROUND-COLOR: #333366;
    TEXT-ALIGN: center
}
A.Footer:hover
{
    TEXT-DECORATION: underline
}
A.Footer
{
    COLOR: white;
    TEXT-DECORATION: none
}
TABLE.MainTable
{
    BORDER-RIGHT: #333366 1px solid;
    BORDER-TOP: #333366 1px solid;
    BORDER-LEFT: #333366 1px solid;
    WIDTH: 100%;
    BORDER-BOTTOM: #333366 1px solid
}
td.BrowseColumn
{
    WIDTH: 20%;
    vertical-align:top;
}
@media only screen and ( max-width: 800px ) {
  td.BrowseColumn{
	display:none;
	WIDTH: 0%;
  }
}

td.CrossSellColumn {
	width:35%;
	vertical-align:top;
}

@media only screen and ( max-width: 800px ) {
	td.CrossSellColumn {
	display:none;
	WIDTH: 0%;
	}
}

td.DetailsColumn
{
    WIDTH: 80%;
    vertical-align:top;
}
@media only screen and ( max-width: 800px ) {
  td.DetailsColumn{
	WIDTH: 100%;
	vertical-align:top;
  }
}
TABLE.BrowseTable
{
    WIDTH: 100%
}
TABLE.BrowseCatTable
{
    BORDER-RIGHT: #333366 1px solid;
    BORDER-TOP: #333366 1px solid;
    BORDER-LEFT: #333366 1px solid;
    WIDTH: 100%;
    BORDER-BOTTOM: #333366 1px solid;
    BACKGROUND-COLOR: #f9f9f0
}
TD.BrowseCatHeader
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    COLOR: white;
    BACKGROUND-COLOR: #333366;
    TEXT-ALIGN: left
}
TD.BrowseCatRow
{
    FONT-SIZE: 10pt;
    COLOR: #333366;
    TEXT-ALIGN: left
}
.BrowseCatLinks
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 9pt;
    COLOR: #333366;
    FONT-FAMILY: Arial, Helvetica, Sans-serif;
    TEXT-ALIGN: left
}
TABLE.BrowseModelTable
{
    BORDER-RIGHT: #333366 1px solid;
    BORDER-TOP: #333366 1px solid;
    BORDER-LEFT: #333366 1px solid;
    WIDTH: 100%;
    BORDER-BOTTOM: #333366 1px solid;
    BACKGROUND-COLOR: #f9f9f0
}



TD.BrowseModelHeader
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    COLOR: white;
    BACKGROUND-COLOR: #333366;
    TEXT-ALIGN: left
}
TD.BrowseModelRow
{
    FONT-SIZE: 10pt;
    COLOR: #333366;
    TEXT-ALIGN: left
}
.BrowseModelLinks
{
    FONT-SIZE: 10pt;
    COLOR: #333366;
    FONT-FAMILY: Arial, Helvetica, Sans-serif;
    TEXT-ALIGN: left
}
TD.BrowseSubCatRow
{
    FONT-SIZE: 10pt;
    COLOR: #333366;
    BACKGROUND-COLOR: white;
    TEXT-ALIGN: left
}
.BrowseSubCatLinks
{
    FONT-SIZE: 10pt;
    COLOR: #333366;
    FONT-FAMILY: Arial, Helvetica, Sans-serif;
    TEXT-ALIGN: left
}
TD.BrowseModelCatRow
{
    FONT-SIZE: 10pt;
    COLOR: #333366;
    TEXT-ALIGN: left
}
.BrowseModelCatLinks
{
    FONT-SIZE: 10pt;
    COLOR: #333366;
    FONT-FAMILY: Arial, Helvetica, Sans-serif;
    TEXT-ALIGN: left
}
TABLE.DetailTable
{
    WIDTH: 100%
}
TABLE.FeaturesTable
{
    BORDER-RIGHT: #333366 1px solid;
    BORDER-TOP: #333366 1px solid;
    BORDER-LEFT: #333366 1px solid;
    WIDTH: 100%;
    BORDER-BOTTOM: #333366 1px solid;
    BACKGROUND-COLOR: #f9f9f0
}
TD.FeaturesHeader
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    COLOR: white;
    BACKGROUND-COLOR: #333366;
    TEXT-ALIGN: left
}
TD.FeaturesRow
{
    FONT-SIZE: 8pt;
    COLOR: #333366;
    BORDER-BOTTOM: #333366 1px solid;
    TEXT-ALIGN: left
}
TABLE.SearchTable
{
    BORDER-RIGHT: #333366 1px solid;
    BORDER-TOP: #333366 1px solid;
    BORDER-LEFT: #333366 1px solid;
    WIDTH: 100%;
    BORDER-BOTTOM: #333366 1px solid;
    BACKGROUND-COLOR: #f9f9f0
}
TD.SearchHeader
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    COLOR: white;
    BACKGROUND-COLOR: #333366;
    TEXT-ALIGN: left
}
TD.SearchRow
{
    FONT-SIZE: 8pt;
    TEXT-ALIGN: left;
}
TD.SearchField
{
    FONT-SIZE: 10pt;
    TEXT-ALIGN: left
}
TABLE.SearchResults
{
    BORDER-RIGHT: #336666 1px solid;
    BORDER-TOP: #336666 1px solid;
    BORDER-LEFT: #336666 1px solid;
    WIDTH: 100%;
    BORDER-BOTTOM: #336666 1px solid
}
TR.SearchResultsHeader
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 8pt;
    COLOR: white;
    BACKGROUND-COLOR: #333366;
    TEXT-ALIGN: left
}
TR.SearchResultsCols
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 8pt;
    COLOR: #333366;
    BACKGROUND-COLOR: #f9f9f0;
    TEXT-ALIGN: left
}
TR.SearchResultsRow
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 9pt;
    COLOR: #333366;
    BACKGROUND-COLOR: white;
    TEXT-ALIGN: left
}
A.SearchResultsRow
{
    COLOR: #333366;
    TEXT-DECORATION: underline
}
A.hover
{
    COLOR: #333366;
    TEXT-DECORATION: underline
}
TABLE.ModelSubCatTable
{
    WIDTH: 100%
}
TD.ModelSubCatHeader
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    COLOR: #333366;
    BACKGROUND-COLOR: white;
    TEXT-ALIGN: left
}
TD.ModelSubCatRow
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    COLOR: #333366;
    BACKGROUND-COLOR: white;
    TEXT-ALIGN: left
}
A.ModelSubCatLink
{
    FONT-SIZE: 10pt;
    COLOR: #333366;
    TEXT-DECORATION: underline
}
A.ModelSubCatHeaderLink
{
    COLOR: #333366;
    TEXT-DECORATION: underline
}
TD.NavigationRow
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 8pt;
    COLOR: #333366;
    BORDER-BOTTOM: #336666 1px solid;
    BACKGROUND-COLOR: white;
    TEXT-ALIGN: left
}
TABLE.ItemListTable
{
    BORDER-RIGHT: #333366 1px solid;
    BORDER-TOP: #333366 1px solid;
    BORDER-LEFT: #333366 1px solid;
    WIDTH: 100%;
    BORDER-BOTTOM: #333366 1px solid
}
TR.ItemListHeader
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    COLOR: white;
    BACKGROUND-COLOR: #333366;
    TEXT-ALIGN: left
}
TR.ItemListRow
{
    FONT-SIZE: 8pt;
    WIDTH: 100%;
    COLOR: black;
    BACKGROUND-COLOR: white;
    TEXT-ALIGN: left
}
TD.ItemListThumbnailCell
{
    WIDTH: 10%;
    BACKGROUND-COLOR: white;
    TEXT-ALIGN: center
}
TD.ItemListDescCell
{
    FONT-SIZE: 8pt;
    WIDTH: 40%;
    COLOR: black;
    BACKGROUND-COLOR: #f9f9f0;
    TEXT-ALIGN: left
}
A.ItemListLink
{
    COLOR: #333366;
    TEXT-DECORATION: underline
}
IMG.Thumbnail
{
    BORDER-RIGHT: medium none;
    BORDER-TOP: medium none;
    BORDER-LEFT: medium none;
    BORDER-BOTTOM: medium none
}
TABLE.ItemNavTable
{
    FONT-SIZE: 8pt;
    WIDTH: 100%;
    COLOR: black;
    BACKGROUND-COLOR: white;
    TEXT-ALIGN: left
}
A.ItemNavLink
{
    COLOR: #333366;
    TEXT-DECORATION: underline
}
TABLE.ItemDetailTable
{
    WIDTH: 100%
}
H1.ItemDetailHeader
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 12pt;
    WIDTH: 75%;
    COLOR: black
}
TD.ItemDetailHeader
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    WIDTH: 75%;
    COLOR: #f27900
}
TD.ItemDetailNumber
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    COLOR: #333366
}
TD.ItemDetailPhoto
{
    WIDTH: 50%;
    TEXT-ALIGN: center
}
TD.ItemDetailBuy
{
    WIDTH: 50%
}
TABLE.buyMe
{
    WIDTH: 100%;
}
TR.BuyMeHeader
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    COLOR: white;
    BACKGROUND-COLOR: #333366;
    TEXT-ALIGN: left
}
TR.BuyMePrice
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    COLOR: #333366;
    BACKGROUND-COLOR: #f9f9f0;
    TEXT-ALIGN: left
}
TR.BuyMeOptions
{
    FONT-SIZE: 10pt;
    COLOR: #333366;
    BACKGROUND-COLOR: white;
    TEXT-ALIGN: left
}
TR.BuyMeText
{
    FONT-SIZE: 10pt;
    COLOR: #333366;
    BACKGROUND-COLOR: white;
    TEXT-ALIGN: left
}
TD.BuyMeColHeader
{
    FONT-SIZE: 10pt;
    COLOR: #333366;
    BACKGROUND-COLOR: white;
    font-weight:bold;
    TEXT-ALIGN: left;
}
TD.BuyMeColValue
{
    FONT-SIZE: 10pt;
    COLOR: #333366;
    BACKGROUND-COLOR: white;
    TEXT-ALIGN: left
}

TR.BuyMeButtons
{
    FONT-SIZE: 10pt;
    COLOR: #333366;
    BACKGROUND-COLOR: white;
    TEXT-ALIGN: center
}
TR.ItemDetailFreeText
{
    FONT-SIZE: 10pt;
    COLOR: #333366
}
TABLE.HotDealsTable
{
    WIDTH: 100%
}
TD.HotDealsHeader
{
    BORDER-RIGHT: #333366 1px solid;
    BORDER-TOP: #333366 1px solid;
    FONT-WEIGHT: bold;
    FONT-SIZE: 12pt;
    BORDER-LEFT: #333366 1px solid;
    COLOR: #333366;
    BORDER-BOTTOM: #333366 1px solid;
    BACKGROUND-COLOR: white
}
TABLE.SurveyStandout
{
    BORDER-RIGHT: #333366 1px solid;
    BORDER-TOP: #333366 1px solid;
    BORDER-LEFT: #333366 1px solid;
    WIDTH: 100%;
    BORDER-BOTTOM: #333366 1px solid
}
TR.SurveyStandoutHeader
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    WIDTH: 100%;
    COLOR: white;
    BACKGROUND-COLOR: #f27900;
    TEXT-ALIGN: left
}
A.SurveyStandoutHeader
{
    FONT-SIZE: 8pt;
    COLOR: white;
    TEXT-DECORATION: underline
}
TR.SurveyQuestionRow
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    WIDTH: 100%;
    COLOR: #333366;
    BACKGROUND-COLOR: #f9f9f0;
    TEXT-ALIGN: left
}
TR.SurveyQuestionAnswer
{
    FONT-SIZE: 8pt;
    WIDTH: 100%;
    COLOR: #333366;
    BACKGROUND-COLOR: #f9f9f0;
    TEXT-ALIGN: left
}
.generallinks
{
    COLOR: #333366;
    TEXT-DECORATION: underline
}
.featurelinks
{
    COLOR: #333366;
    TEXT-DECORATION: none
}
.SubCatHyperlink
{
    COLOR: #333366;
    TEXT-DECORATION: underline
}
TABLE.ShippingCharge
{
    WIDTH: 75%
}
TD.ppsmalltext
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    COLOR: #333366;
    BACKGROUND-COLOR: #eeeeee;
    TEXT-ALIGN: left
}
TD.pptext
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    COLOR: #333366;
    BACKGROUND-COLOR: white;
    TEXT-ALIGN: left
}
DIV.sweetdiv
{
    FONT-SIZE: 1pt;
    COLOR: white;
}
H1.sweetdiv
{
    FONT-SIZE: 1pt;
    COLOR: white;
}
A.sweetdiv
{
    FONT-SIZE: 1pt;
    COLOR: white;
}
TD.Announce
{
    BORDER-RIGHT: #f27900 3px double;
    PADDING-RIGHT: 2px;
    BORDER-TOP: #f27900 3px double;
    PADDING-LEFT: 2px;
    FONT-SIZE: 10pt;
    PADDING-BOTTOM: 2px;
    BORDER-LEFT: #f27900 3px double;
    WIDTH: 100%;
    PADDING-TOP: 2px;
    BORDER-BOTTOM: #f27900 3px double;
    font-weight:bold;
}
TABLE.ItemsTable
{
    WIDTH: 100%;
}
TR.ItemsTableheader
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    COLOR: white;
    BACKGROUND-COLOR: #333366;
    TEXT-ALIGN: left
}
TR.ItemsTableRow
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    COLOR: #333366;
    BACKGROUND-COLOR: white;
    TEXT-ALIGN: left
}
A.ItemsTableRow
{
    COLOR: #333366;
    TEXT-DECORATION: underline
}
TR.ItemsTableCols
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    COLOR: #f9f9f0;
    BACKGROUND-COLOR: #333366;
    TEXT-ALIGN: left
}
DIV.LicenseStandOut
{
	float:right;
	border-left:1px solid black;
	border-top:1px solid black;
	border-bottom:1px solid black;
	border-right:1px solid black;
	margin:5px;
	padding:5px;
	background-color:#f9f9f0;
	FONT-WEIGHT: bold; 
	FONT-SIZE: 11pt;
}
TABLE.HotDealsTable
{
    BORDER-RIGHT: #ff0000 1px solid;
    BORDER-TOP: #ff0000 1px solid;
    BORDER-LEFT: #ff0000 1px solid;
    WIDTH: 100%;
    BORDER-BOTTOM: #ff0000 1px solid
}
TR.HotDealsTableheader	
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    COLOR: white;
    BACKGROUND-COLOR: #ff0000;
    TEXT-ALIGN: left
}
TR.HotDealsTableRow
{
    FONT-SIZE: 9pt;
    COLOR: #333366;
    BACKGROUND-COLOR: white;
    TEXT-ALIGN: left
}
TD.NewLinks
{
	FONT-SIZE:8PT;
	COLOR: WHITE
}
A.NewLinks
{
	FONT-SIZE:8PT;
	COLOR: WHITE
}
P.NewLinks
{
	FONT-SIZE:8PT;
	COLOR: WHITE
}
TABLE.ShowoffTable
{
    BORDER-RIGHT: #333366 1px solid;
    BORDER-TOP: #333366 1px solid;
    BORDER-LEFT: #333366 1px solid;
    WIDTH: 100%;
    BORDER-BOTTOM: #333366 1px solid;
    BACKGROUND-COLOR: #f9f9f0
}
TD.ShowoffHeader
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    COLOR: white;
    BACKGROUND-COLOR: #333366;
    TEXT-ALIGN: left
}
TD.ShowoffRow
{
    FONT-SIZE: 10pt;
    COLOR: #333366;
    TEXT-ALIGN: left
}

TABLE.LinksTable
{
    WIDTH: 100%;
}
TD.LinksHeader
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 10pt;
    COLOR: white;
    BACKGROUND-COLOR: #333366;
    TEXT-ALIGN: left
}
TD.LinksRow
{
    FONT-SIZE: 8pt;
    COLOR: #333366;
    TEXT-ALIGN: left
}
.LinksLinks
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 9pt;
    COLOR: #333366;
    FONT-FAMILY: Arial, Helvetica, Sans-serif;
    TEXT-ALIGN: left
}

.alert {
    padding: 10px;
    background-color: #f44336;
    color: white;
    display:none;
}

.itemalert {
    padding: 10px;
    background-color: #333366;
    color: white;
    display: none;
}


.closebtn {
    margin-left: 15px;
    color: white;
    font-weight: bold;
    float: right;
    font-size: 22px;
    line-height: 20px;
    cursor: pointer;
    transition: 0.3s;
}

.closebtn:hover {
    color: black;
}

.SweetDiv
{
	font-size:4pt;
	color:white;
}
span.smark
{
font-family: "Lucida Sans Unicode"; /* A rare sm-supporting font. */
line-height: 0; /* keep the leading consistent in a paragraph */
}



/* Breadcrumb */
#breadcrumbs, #breadcrumbs li {
 margin: 0;
 padding: 0;
 display: inline;
 list-style: none;
 font-size:10pt;
 color:navy;
}
#breadcrumbs li {
 padding-right: 0;
}
#breadcrumbs ul {
 margin: 0;
 padding: 5px;
}
#breadcrumbs a {
 color:navy;

}

@media only screen and ( max-width: 800px ) {
#breadcrumbs {
	display:none;
	}
}

#breadcrumbmobile {
		display:block;
		width:100%;
		background-color:#f9f9f0;
	}


@media ( min-width: 800px ) {
#breadcrumbmobile {
	display:none;
}
}


#mobilesearch {
	background-color:#f9f9f0;
	width:100%;
	border-spacing:8px;
	}

@media ( min-width: 800px ) {
#mobilesearch {
	display:none;
}
}

.SelectOptions {
	width:250px;
	}
.SelectText{
	width:240px;
	}

@media only screen and ( max-width: 800px ) {
.SelectOptions {
	height:30px;
	font-size:large
	}
.SelectText{
	height:30px;
	font-size:large
	}
}

.MovieFrame {
	width:480px;
	height:288px;
}
@media only screen and ( max-width: 800px ) {
.MovieFrame {
	width:360px;
	height:216px;
	}
}

.desktopexample {
	display:block;
}

@media only screen and ( max-width: 800px ) {
.desktopexample {
	display:none;
	}
}




	#nav
		{
			width: 90%;
			font-family: 'Open Sans', sans-serif;
			font-weight: 400;
		}

			#nav > a
			{
				display: none;
			}

			#nav li
			{
				position: relative;
			}
				#nav li a
				{
					color: #fff;
					display: block;
					text-decoration:none;
				}
				#nav li a:active
				{
					background-color: #fff;
					text-decoration:none;
				}

			#nav span:after
			{
				width: 0;
				height: 0;
				border: 0.313em solid transparent; /* 5 */
				border-bottom: none;
				border-top-color: #efa585;
				content: '';
				vertical-align: middle;
				display: inline-block;
				position: relative;
				right: -0.313em; /* 5 */
			}

			/* first level */

			#nav > ul
			{
				height: 3.75em; /* 60 */
				background-color: #333366;
				list-style: none;
			}
				#nav > ul > li
				{
					width: 25%;
					height: 100%;
					float: left;
				}
					#nav > ul > li > a
					{
						height: 100%;
						font-size: 1.5em; /* 24 */
						line-height: 2.5em; /* 60 (24) */
						text-align: center;
					}
						#nav > ul > li:not( :last-child ) > a
						{
							border-right: 1px solid #6A6EB4;
						}
						#nav > ul > li:hover > a,
						#nav > ul:not( :hover ) > li.active > a
						{
							background-color: #6A6EB4;
						}




		@media only screen and ( max-width: 800px ) {

			#nav
			{
                		width:90%;
				position: relative;
				top: auto;
				left: auto;
				margin: 0;
			}
				#nav > a
				{
					width: 50px;
					height: 50px; 
					text-align: left;
					text-indent: -9999px;
					background-color: #333366;
					position: relative;

				}
					#nav > a:before,
					#nav > a:after
					{
						position: absolute;
						border: 2px solid #fff;
						top: 35%;
						left: 25%;
						right: 25%;
						content: '';

					}
					#nav > a:after
					{
						top: 60%;
					}

				#nav:not( :target ) > a:first-of-type,
				#nav:target > a:last-of-type
				{
					display: block;
				}



			#nav > ul
			{
				height: auto;
				display: none;
				position: absolute;
				left: 0;
				right: 0;
			}
				#nav:target > ul
				{
					display: block;
				}
				#nav > ul > li
				{
					width: 100%;
					float: none;
				}
					#nav > ul > li > a
					{
						height: auto;
						text-align: left;
						padding: 0 0.833em; 
					}
						#nav > ul > li:not( :last-child ) > a
						{
							border-right: none;
							border-bottom: 1px solid #6A6EB4;
						}


				#nav li ul
				{
					position: static;
					padding: 1.25em;
					padding-top: 0;
				}
		}


