/*HTML5*/
header, section, footer, aside, nav, main, article, figure 
{
display: block;
} 

/*fonts*/
@font-face {
 font-family: Bedstead;
 src: url(../fonts/Bedstead.woff);
}

@font-face {
 font-family: Bedstead;
 src: url(../fonts/Bedstead.woff);
 font-weight: bold;
}

/*basics*/
html, body
{
background-color: #000000;
background-image:none;
font-family: Bedstead, Arial, sans-serif;
font-size: 1em;
line-height: 120%;
font-weight: lighter;
color: #ffffff;
margin: 0px 0px 0px;
width: 100%;
height: 100%;
}

div.container
{
position: relative;
background-color:transparent;
margin: 0px;
width: 100%;
min-height: 100%;
border-style: none
}

div.bodyBorder
{
position: relative;
background-color:#000000;
margin: 0px auto;
padding: 0px;
max-width: 565px;
min-height: 100%;
border: 2px solid #000000;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}

div.body
{
position: relative;
background-color:#000000;
margin: 0px auto;
padding: 15px;
max-width: 560px;
min-height: 100%;
border: 1px solid #c87800;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}

.bodyContent
{
position: relative;
background-color:#000000;
margin: 0px auto;
padding: 15px;
max-width: 535px;
}

hr
{
position: relative;
margin: 5px auto;
width: 95%;
clear: both;
}

p
{
text-align: justify;
margin: 10px 0px;
}

a:link, a:visited
{
text-decoration:none;
color: #FFCC00;
}

a:hover, a:active, a:focus
{
text-decoration: underline;
color: #ffff00;
}

a:link img
{
border-style: 1px #FFCC00 solid;
text-decoration: none;
}

h1,h2,h3,h4
{ 
font-size: 1.688em;
font-weight: bold;
line-height: 120%;
text-align: left;
color: #ffffff;
clear: left;
}

h2,h3,h4
{ 
text-shadow: 1px 0 0 currentColor;
}

h1
{
text-align: center;
transform : scale(1,1.8);
-webkit-transform:scale(1,1.8);
-moz-transform:scale(1,1.8); 
-ms-transform:scale(1,1.8); 
-o-transform:scale(1,1.8); 
}

h2
{ 
font-size: 1.250em;
line-height: 120%;
}

h3
{ 
font-size: 1.1em;
line-height: 120%;
}

h3
{ 
font-size: 1.05em;
line-height: 120%;
}

/*head*/
header
{
position: relative;
margin: 0px auto 0px;
padding: 10px 0px;
max-width: 560px;
border-style: none
}

div.headMast
{
position: relative;
margin: 0px auto 0px;
padding: 0px;
width: 100%;
border-style: none;
}

.headMast a#logo
{
position: relative;
background-image:url('../img/logo.png');
background-repeat: no-repeat;
background-position: center; 
display: block;
margin: 7px 20px 10px 7px;
height: 103px;
width: 110px;
border-style: none;
float: left;
}

.headMast span
{
font-size: 1.1em;
font-weight: bold;
line-height: 50px;
margin-top: 40px;
float: left;
}

a.navToggle:link, a.navToggle:visited
{
speak: normal;
background-color:#1b1b1b;
color: #FFFFFF;
text-align: center;
font-size: 1.3em;
line-height: 120%;
font-weight: bold;
text-decoration: none;
display: inline-block;
margin: 48px 10px 0px;
padding: 5px 5px 7px;
height: 1.1em;
border: 2px solid #c87800;
border-radius: 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
float: right;
}

a.navToggle:hover, a.navToggle:active
{
background-color:#c87800;
color: #FFFFFF;
}

/*access*/
a.skipNav , .skipNav:focus 
{
position: relative;
margin: 2px 0px 0px;
font-size: .9em;
line-height: 100%;
color: #333333;
float: right;
}

.skipNav:active, .skipNav:focus 
{
color: #FFFF00; 
text-decoration: underline;
}
 
div.accessOpt
{
position: relative;
margin: 35px 10px 0px 0px;
padding: 0px;
border-style: none;
float: right;
}

ul.accessOptUL
{
display: inline;
margin: 0px 0px 0px;
padding: 0px;
list-style-type:none;
text-align: left;
float: right;
}

.accessOptUL li
{
display:inline;
text-align: left;
}

.accessOpt li a:link, .accessOpt li a:visited, .accessOpt li a:hover, .accessOpt li a:active
{
background-image:none;
background-color:transparent;
color: #FFFFFF;
font-size: 1.250em;
font-weight: bold;
margin: 0px 0px 0px 5px;
display: inline-block;
padding: 0px;
border-style: none;
text-decoration: none;
}

a#aOpt1:link, a#aOpt1:visited, a#aOpt1:hover, a#aOpt1:active
{
font-size: 1em;
}

a#aOpt2:link, a#aOpt2:visited, a#aOpt2:hover, a#aOpt2:active
{
font-size: 1.25em;
}

a#aOpt3:link, a#aOpt3:visited, a#aOpt3:hover, a#aOpt3:active
{
background-color: #000000;
color: #FFFFFF;
font-size: 1.25em;
font-weight: bold;
padding: 3px;
border: 1px #c87800 solid;
}

a#aOpt4:link, a#aOpt4:visited, a#aOpt4:hover, a#aOpt4:active
{
background-color: #FFFFFF;
color: #000000;
font-size: 1.25em;
font-weight: bold;
padding: 3px;
border: 1px solid #000000;
}

a#aOpt5:link, a#aOpt5:visited, a#aOpt5:hover, a#aOpt5:active
{
background-color: #000000;
color: #FFFF00;
font-size: 1.25em;
font-weight: bold;
padding: 3px;
border: 1px solid #FFFF00;
}

a#aOpt6:link, a#aOpt6:visited, a#aOpt6:hover, a#aOpt6:active
{
font-size: 1em;
text-align: right;
float: right;
clear: both;
}

/*nav*/
ul.mainNav, ul.mainNav ul
{
display: none;
margin: 10px 0px 10px;
padding: 0px;
width: 100%;
list-style-type:none;
text-align: center;
float: none;
clear: both;
}

.mainNav li
{
display: block;
text-align: center;
}

.mainNav a:link, .mainNav a:visited,ul.mainNav ul li, ul.mainNav ul li a:link, ul.mainNav ul li a:visited
{
background-color:#1b1b1b;
color: #FFCC00;
font-size: 1.2em;
text-align: center;
font-weight: normal;
line-height: 1.6em;
display: block;
margin: 0px;
padding: 0px;
height: 1.8em;
border-style: none;
text-decoration: none;
}

.mainNav a:hover, .mainNav a:active
{
color: #FFFFFF;
}

a#currentpage, a.currentpage
{
background-color:#FFCC00;
color: #1b1b1b;
}

ul.mainNav ul 
{
position: absolute;
right: 1%;
display: none;
z-index: 2;
}

ul.mainNav ul li, ul.mainNav ul li a:link, ul.mainNav ul li a:visited
{
background-color:#88BB41;
color: #FFFFFF;
display: block;
text-align: left;
padding-left: 5px;
}

ul.mainNav li:hover > ul 
{
display: block;
}

div.crumbs
{
position: relative;
font-size: 90%;
line-height: 120%;
border-style: none;
float: right;
clear: both;
}

/*content*/
ul.noList, .noList li
{
margin-left: 0px;
padding-left: 0px;
list-style-type: none;
}

.hlight
{
font-weight: bold;
text-shadow: 1px 0 0 currentColor;
}

.hlightLarge
{
font-weight: bold;
font-size: 105%;
}

.italic
{
font-style: italic;
}

img.artMainIMG, img.artSubIMG, img.artSubIMGSplit, img.rightSlim, img.centerHalf, img.center
{
display: block;
width: 98%;
height: auto;
margin: 0px 1%;
border: 1px solid #FFCC00;
clear: both;
text-align: center;
}

img.artMainIMG, img.artSubIMG
{
margin: 10px auto;
}

img.artSubIMG
{
padding:0px 10px;
width: 45%;
height: auto;
clear: none;
}

img.artSubIMGSplit
{
margin-left: 2%;
margin-right: 2%;
width: 45%;
height: auto;
clear: none;
}

img.leftSlim
{
width: 20%;
float: right;
}

img.rightSlim
{
width: 20%;
float: right;
}

img.centerHalf
{
display: inline-block;
margin: 10px auto;
padding: 0px 1%;
width: 46%;
}

img.centerHalfHeight
{
display: inline-block;
margin: 10px 1%;
padding: 0px 1%;
width: auto;
height: 200px;
}

img.quaterLeft
{
display: inline-block;
margin: 10px auto;
width: 25%;
float: left;
clear: left;
}

img.center
{
display: block;
margin: 10px auto;
width: auto;
}

img.banner
{
display: block;
margin: 10px auto;
width: 48%;
}

div#globe
{
position: relative;
margin: 0px auto;
padding: 0px;
width: 98%;
border-style: none;
}

embed, iframe
{
margin: 10px auto;
}

/*shop nav*/
div.shopNav 
{
position: relative;
margin: 10px auto 0px;
padding: 0px 0px 0px 0px;
width: 98%;
border-style: none;
}

.shopNav > a:link, .shopNav  > a:visited, .shopNav  > div
{
background-color:transparent;
font-size: 1em;
text-align: center;
text-decoration: none;
color: #ffffff;
margin: 0px 1% 20px;
display:block;
padding: 0px;
width: 48%;
border: none;
float: left;
}

.shopNav > a:nth-child(odd), .shopNav  > a:nth-child(odd), .shopNav  > div:nth-child(odd)
{
clear: left;
}

.shopNav span
{
position: relative;
display: block;
font-size: 90%;
color: #FFFFFF;
margin: 0px auto 5px;
width: 90%;
border: none;
clear: both;
}

.shopNav a:hover span, .shopNav a:active span, .shopNav a:focus span
{
background-color: #FFFF00;
border-color: #FFFF00;
color: #333333;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}

.shopNav a img
{
width: 90%;
height: auto;
border: 2px solid #FFCC00;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
clear: both;
}

.shopNav a:hover img, .shopNav a:active img, .shopNav a:focus img
{
border: 2px solid #FFFF00;
-webkit-filter: brightness(115%);
filter: brightness(115%);
}

/*library nav*/
div.libraryNav 
{
position: relative;
margin: 10px auto 0px;
padding: 0px 0px 0px 0px;
width: 100%;
border-style: none;
clear: both;
}

.libraryNav > div
{
background-color:transparent;
font-size: 1em;
text-align: center;
text-decoration: none;
color: #ffffff;
margin: 0px .9% 20px;
display:block;
padding: 10px 0px;
width: 98%;
border-style: none;
clear: both;
}

.libraryNav > div h2
{
font-size: 1.1em;
line-height: 120%;
}

.libraryNav > div a img
{
margin: 10px 1%;
width: 48%;
height: auto;
border: 2px solid #FFCC00;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
float: left;
}

.libraryNav > div > img
{
margin: 10px 1%;
width: 48%;
height: auto;
float: left;
}

.libraryNav > div a:hover img, .libraryNav > div a:active img, .libraryNav > div a:focus img
{
border: 2px solid #FFFF00;
-webkit-filter: brightness(115%);
filter: brightness(115%);
}

.libraryNav > div p
{
margin: 10px 1% 0px;
width: 47%;
float: right;
}

.libraryNav > div p.cr
{
margin: 10px 1% 0px;
width: 97%;
float: left;
clear: both;
}

.libraryNav > div p:first-of-type
{
margin-top: 40px;
}

/*diy guide*/
div.diyGuide 
{
position: relative;
margin: 10px auto 0px;
padding: 0px 0px 0px 0px;
width: 100%;
border-style: none;
clear: both;
}

.diyGuide > h2, .diyGuide > h3, .diyGuide > h4
{
clear: both;
}

.diyGuide > h4
{
font-size: 1.1em;
line-height: 120%;
}

.diyGuide > img, .diyGuide > img.quaterLeft, .diyGuide > img.artMainIMG, .diyGuide > img.artSubIMG, .diyGuide > img.artSubIMGSplit, .diyGuide > p > img, .diyGuide a > img
{
margin: 10px 1% 20px;
padding: 0px;
width: 48%;
height: auto;
border: 2px solid transparent;
clear: left;
float: left;
}

.diyGuide a > img
{
border: 2px solid #FFCC00;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}

.diyGuide img.left, .diyGuide .centerHalf
{
margin: 10px .5% 20px;
width: 46%;
height: auto;
clear: none;
float: left;
}

.diyGuide .clearL
{
clear: left;
}

.diyGuide > a:hover img, .diyGuide > a:active img, .diyGuide > a:focus img
{
border: 2px solid #FFFF00;
-webkit-filter: brightness(115%);
filter: brightness(115%);
}

.diyGuide > p, .diyGuide > ol, .diyGuide > ul
{
margin: 15px 1% 5px;
}

.diyGuide > ol, .diyGuide > ul
{
padding-left: 3%;
}

/*library nav*/
div.searchResults 
{
position: relative;
margin: 10px auto 0px;
padding: 0px 0px 0px 0px;
width: 100%;
border-style: none;
clear: both;
}

.searchResults > a
{
display:block;
color: #FFFFFF;
margin: 10px auto;
padding: 10px;
width: 99%;
border-style: none;
clear: both;
}

.searchResults > a h2
{
display: block;
color: #FFCC00;
font-size: 1em;
line-height: 120%;
}

.searchResults > a img
{
margin: 10px 1%;
width: 20%;
height: auto;
border: 2px solid #FFCC00;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
float: left;
}

.searchResults > a:hover, .searchResults > a:active, .searchResults > a:focus
{
background-color: #383838;
text-decoration: none;
}

.searchResults > a div p
{
display: inline;
color: #FFFFFF;
}

img.fwdbtn
{
width: 80px;
height: auto;
border-style: none;
}

iframe
{
margin: 10px auto;
border-style: none;
}

/*footer*/
footer
{
position: relative; 
font-size: 95%;
line-height: 120%;
margin: 0px auto 0px;
padding: 10px 0px 5px;
width: 100%;
max-width: 560px;
clear: both;
border: none;
}

footer div.ftDiv
{
position: relative; 
margin: 0px 0px 15px;
padding: 0px;
width: 33.3%;
border: none;
float: left;
}

footer ul
{
display: inline;
list-style-type: none;
margin: 0px 0px 10px;
padding: 0px;
}

footer li
{
display: inline-block;
font-size: 0.95em;
line-height: 120%;
padding-left: 5px;
}

footer h5
{
font-size: 0.95em;
line-height: 120%;
margin: 0px 0px 5px;
}

footer h5#qn
{
display: inline;
}

footer p
{
text-align: center;
margin: 0px 0px 10px;
}

hr.foot
{
position: relative;
margin: 0px auto 20px;
width: 85%;
clear: both;
}

div.pageNav
{
position: relative; 
text-align: right;
margin: 10px 1% 0px;
padding: 0px;
width: 98%;
border: none;
}

.pageNav a
{
position: relative;
background-image:url('../img/up.png');
background-repeat: no-repeat;
background-position: center; 
display: inline-block;
margin: 10px 5px 10px 0px;
height: 103px;
width: 110px;
border-style: none;
overflow:hidden;
}

.pageNav a#pBack
{
background-image:url('../img/back.png');
}

.pageNav a#pHome 
{
background-image:url('../img/logo.png');
}

.pageNav a#pTop
{
background-image:url('../img/up.png');
}

.pageNav a#pFwd
{
background-image:url('../img/forward.png');
}

#logo span, #pBack span, #pTop span, #pHome span, #pFwd span
{
 visibility: hidden;
} 

form.search
{
display: block;
margin: 47px 10px 0px;
padding: 0px;
width: 73%;
float: left;
clear: left;
}

form#inSearch, form.dlList
{
display: block;
margin: 1px auto 0px;
padding: 0px;
width: 98%;
float: left;
clear: left;
}

form.search input
{
background-color: #000000;
display: inline-block;
margin: 0px;
padding: 5px;
width: 100%;
font-size: 1.1em;
color: #FFFFFF;
border: 1px solid #FFCC00;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}

form.dlList select
{
background-color: #000000;
display: block;
width: 100%;
color: #FFFFFF;
border: 1px solid #FFCC00;
clear: both;
}

form.dlList .submitBtn
{
display: block;
margin: 10px auto 20px;
width: 100%;
clear: both;
}

p.cc
{
text-align: center;
}

div.translate
{
display: block;
margin: 3px auto;
width: 98%;
text-align: center;
}

/*Museum*/
a.museumLink
{
visibility: hidden;
}

.bodyContent a.museumLink
{
visibility: visible;
color: #ffffff;
}

/*colours*/
.aqua
{color: #00ffff}

.yellow
{color: #ffff00}

.green
{color: #00ff00}

.pink
{color: #ffccff}

.gold
{color: #ffcc00}

/*symbols*/
img.symbols, img.symbolS, img.symbolM, img.symbolL, img.flag
{
height: auto;
border-style: none;
}

img.iconIMG
{
width: auto;
height: 44px;
}

img.symbolS
{
width: 40%;
}

img.symbolM
{
width: 40%;
}

img.symbolL
{
width: 40%;
}

img.flag
{
display: inline-block;
width: 24px;
}

/*classes*/
.left
{
margin-right: 10px;
margin-bottom: 10px;
width: 38%;
float: left;
}

.right
{
margin-left: 10px;
margin-bottom: 10px;
width: 38%;
float: right;
}

.noclear
{
clear: none;
}

.caption
{
margin-top: 2px;
font-size: 98%;
}

/*addons*/
.aRight
{
text-align: right;
}

.inline
{
display: inline;
}

.clear
{
clear: both;
}

.clearL
{
clear: left;
}

.clearR
{
clear: right;
}

.clearfix
{
display: block;
clear: both;
visibility: hidden;
line-height: 0px;
height: 0px;
}

.errorIMG
{
display: block;
margin: 10px auto;
width: auto;
border-style: none;
}

.XSonly
{
display: none;
speak: none;
}

img.fullWidthAll
{
margin: 10px 1% 20px;
padding: 0px;
width: 97%;
height: auto;
border: 2px solid transparent;
clear: both;
}

/*PDFloader*/
#lightcase-case div.loadPDF p
{
font-family: Bedstead, Arial, sans-serif;
text-align: center;
font-size: 3em;
line-height: 120%;
color: #c87800;
display: block;
margin-left: -36px;
}

@keyframes dots {
  0% {
    opacity: .2;
  }
  20% {
    opacity: 1;
  }
  100% {
    opacity: .2;
  }
}

.loadPDF span 
{
animation-name: dots;
animation-duration: 1.4s;
animation-iteration-count: infinite;
animation-fill-mode: both;
}

.loadPDF span:nth-child(2) 
{
animation-delay: .2s;
}

.loadPDF span:nth-child(3) 
{
animation-delay: .4s;
}

/*etc*/
a:focus, a:focus, a.navToggle:focus, .headMast a#logo:focus, .libraryNav > div a:focus img, .shopNav a:focus img, .mainNav a:focus, .accessOpt li a:focus, a#aOpt3:focus, a#aOpt4:focus, a#aOpt5:focus 
{
border: 2px #FFFF00 solid;
}

body:focus, .container:focus, div.container:focus, div.body:focus, div.body:focus
{
border-style: none;
}

::selection, ::-moz-selection 
{
background: #ffffff; 
color: #000000;
}