@charset "UTF-8";
/* CSS Document */


body{
	font-size:24px;
	font-family:georgia,times;
	color: #ffffff;
	background-color: #000000;
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	text-align: left;
}

h1{
	font-size:1.7em;
	font-family:georgia,times;
	color: #ffcc00;
	text-align: left;
}
h2{
	font-size:1.0em;
	font-family:georgia,times;
	color: #ffcc00;text-align: left;
}

input[type="text"] {
  border:1px solid; padding:3px 5px; font-size:1.0em;
  width: 100px;
}
	
.primaryContainer {

   height: auto;
   margin-top: -20px;
   margin-left: auto;
   margin-right: auto;
   width: 85%;
   min-height: 100%;
   float: none;
   clear: none;
  box-shadow: rgb(80, 80, 80) 0px 0px 0px 0px;
   padding:50px;
   max-width: none;
   min-width: 900px;
   background-color: #000000;
   color:#ffffff;
}

p.albumContainer {
margin-top: 100px;
margin-left: auto;
   margin-right: auto;
   text-align:center;
   width: 100%;
  
   }

.photodiv img{ /*CSS for each image tag*/
border: 0;
max-width: 100%;
max-height: 650px;
cursor: pointer;
text-align:center;
}

p.languageContainer {

margin-left: auto;
   margin-right: auto;
   text-align:right;
   padding-right: 0%;
   font-size:1em;
   
}
#sizecontroldiv a.selected {margin-bottom:10px;
            display:inline-block; 
            line-height:120%;
            font-size: 1em;
            font-weight: bold;
padding: 10px 10px;
border:#ffffff;
text-decoration: none;
-moz-border-radius: 10px;
border-radius: 10px;
-moz-box-shadow: #ffffff 1px 1px 1px; box-shadow: #ffffff 1px 1px 1px;
background: #ffcc00; color:red;}


p.versionContainer {
max-width: 85%;
min-width: 900px;
margin-top: 0;
margin-bottom: 3%;
margin-left: auto;
   margin-right: auto;
border:#ffffff;
color: #000000;
font-weight: bold;
padding-left:52px;
padding-right:52px;
padding-top:10px;
padding-bottom:15px;
-webkit-border-radius: 0px 0px 10px 10px;-moz-border-radius: 0px 0px 10px 10px;border-radius: 0px 0px 10px 10px;background-color:#ffcc00;-webkit-box-shadow: #ffffff 2px 2px 2px 3px;-moz-box-shadow: #ffffff 2px 2px 2px 3px; box-shadow: #ffffff 2px 2px 2px 3px;
text-align:center;

}

a.versionhead{
color: #000000;
text-decoration: none;
text-shadow: 0px 0px 0px #f0f5f0;

}

.hr {
  border-top: 1px dotted #333333;
  color: #fff;
  background-color: #fff;
  height: 1px;
  width:100%;
}

.navigation ul {
list-style: none;
margin: 0;
padding: 0;
letter-spacing:normal;
}

.navigation li {
background: #fefefe;;
border-left: 10px solid #ffcc00;
text-decoration: none;
margin: 20px;
padding: 5px 2px;
letter-spacing:normal;
}



.navigation li.b {
margin: 15px;
margin-left: 5%;
padding: 5px 2px;
border-left: 3px dotted #ffcc00;
letter-spacing:normal;
}



.navigation a {
color: #000;
font-size: 1em;
text-decoration: none;
letter-spacing:normal;
}

.navigation a:hover {
color: #000066;
letter-spacing:normal;
}

.navigation #currentpage a {
padding: 5px 20px;
background: #ffcc00;
color: #333;
letter-spacing:normal;

}


/*button*/
        /* 未連結 */
        a.button:link
        {   margin-bottom:10px;
            display:inline-block; 
            line-height:120%;
            color: #000000;
            font-size: 1em;
            font-weight: bold;
padding: 10px 10px;
background: #ffcc00;
border:#ffffff;
text-decoration: none;
-moz-border-radius: 10px;
border-radius: 10px;
-moz-box-shadow: #ffffff 1px 1px 1px; box-shadow: #ffffff 1px 1px 1px;
        }
        /* 已連結過 */
        a.button:visited
        {
            color:#000000;
             background: #ffcc00;

        }
        /* 滑鼠移至連結 */
        a.button:hover
        {
            color: #000000; 
background: #ccffff;

        }
        /* 選擇的連結 */
        a.button:active
        {
            color: #333333;
background: #ffcc00;

        }
 





/*button-back-foward*/


        /* 未連結 */
        a.album:link
        {
        margin-bottom:10px;
display:inline-block; 
line-height:120%;           
            font-size: 1em;
            font-weight: bold;
padding: 10px 10px;

text-decoration: none;
-moz-border-radius: 10px;
border-radius: 10px;
-moz-box-shadow: #ffffff 1px 1px 1px; box-shadow: #ffffff 1px 1px 1px;
background: #ffffcc;
color: #000000;
        }
        /* 已連結過 */
        a.album:visited
        {
        
        
 margin-bottom:10px;
display:inline-block; 
line-height:120%;           
            font-size: 1em;
            font-weight: bold;
padding: 10px 10px;

text-decoration: none;
-moz-border-radius: 10px;
border-radius: 10px;
-moz-box-shadow: #ffffff 1px 1px 1px; box-shadow: #ffffff 1px 1px 1px;        
color:#000000;             
background: #FFFAE9;
        }
        /* 滑鼠移至連結 */
        a.album:hover
        {
        
 margin-bottom:10px;
display:inline-block; 
line-height:120%;           
            font-size: 1em;
            font-weight: bold;
padding: 10px 10px;

text-decoration: none;
-moz-border-radius: 10px;
border-radius: 10px;
-moz-box-shadow: #ffffff 1px 1px 1px; box-shadow: #ffffff 1px 1px 1px;
            color: #f0f5f0;  background: #333333;
        }
        /* 選擇的連結 */
        a.album:active
        {
        
 margin-bottom:10px;
display:inline-block; 
line-height:120%;           
            font-size: 1em;
            font-weight: bold;
padding: 10px 10px;

text-decoration: none;
-moz-border-radius: 10px;
border-radius: 10px;
-moz-box-shadow: #ffffff 1px 1px 1px; box-shadow: #ffffff 1px 1px 1px;        
            color: #333333;
             background: #ffffcc;
        }

a.backbutton:link
        {color: #ffffff; text-decoration: none;font-size: 1em;}
a.backbutton:visited
{color: #ffffff; text-decoration: none;font-size: 1em;}
a.backbutton:hover
{color: #ffffff; text-decoration: none;font-size: 1em;}


a.directory:link
        {color: #ffcc00; text-decoration: none;font-size: 1em;text-align: left;}
a.directory:visited
{color: #ffcc00; text-decoration: none;font-size: 1em;text-align: left;}
a.directory:hover
{color: #ffffff; text-decoration: none;font-size: 1em;text-align: left;}


a.audiolink:link
        {color: #ffffcc;font-weight: bold;text-decoration:none;font-size: 1em;}
a.audiolink:visited
{color: #ffffcc;font-weight: bold;text-decoration:none;font-size: 1em;}
a.audiolink:hover
{color: #ffffcc;font-weight: bold; text-decoration:none;font-size: 1em;}



a.copyright:link
        {color: #ffffff; text-decoration:none; font-size:1em; none;text-align:left;}
        
a.copyright:visited
        {color: #ffffff; text-decoration: none;font-size:1em;text-align:left;} 

a.copyright:hover
{color: #ffffff; text-decoration: none;font-size:1em;text-align:left;} 


a.caption:link
        {color: #ffffff; text-decoration: none;font-size:1em;text-align:left;}
        
a.caption:visited
        {color: #ffffff; text-decoration: none;font-size:1em;text-align:left;} 

a.caption:hover
{color: #ffffff; text-decoration: none;font-size:1em;text-align:left;l} 






        
        #sitemap li {list-style-type:square; padding: 5px 5px;text-align:left;}

#sitemap li.l2 {list-style-type:square;margin-left: 40px;padding: 5px 5px;text-align:left;}

img.btnTextSmallSize {position:relative; top:5px; width:20px; border:0px;}
img.btnTextNormalSize {position:relative; top:5px; width:30px; border:0px;}
img.btnTextBigSize {position:relative; top:5px;border:0px;}

.phototable {
	vertical-align: top;
	font-size: 1em;
	min-width: 900px;
	line-height:100%;
	padding:3%;
}


.audioButtonList {position:relative; float:left; width:100%; height:80px; margin-top:20px; margin-bottom:20px;}


.audioButtonList a {position:relative; display:none;}


.audioButtonList a.button {display:inline-block; color: #000; font-size: 1em; font-weight: bold;padding: 10px 10px;background: #ffffcc;border:#fff;text-decoration: none;-moz-border-radius: 10px;border-radius: 10px;-moz-box-shadow: #000000 1px 1px 1px; box-shadow: #000000 1px 1px 1px; }


.audioButtonList a.button {display:inline-block; color: #000; font-size: 1em; font-weight: bold;padding: 10px 10px;background: #ffffcc;border:#fff;text-decoration: none;-moz-border-radius: 10px;border-radius: 10px;-moz-box-shadow: #000000 1px 1px 1px; box-shadow: #000000 1px 1px 1px; }

.transcriptBox {
    height: 300px;
    width: 600px;
    padding: 10px;
    overflow-y: auto;
}

/*iphone5s*/
@media screen and (device-aspect-ratio: 40/71) {
body{
	font-size:2em;
	text-align: left;}
.audioButtonList {margin-top:30px;margin-bottom:100px;}
.audioButtonList a {margin-top:30px;margin-bottom:100px;}
.audioButtonList a.button {margin-top:30px;margin-bottom:100px;}
.audioButtonList a.button {margin-top:30px;margin-bottom:100px;}
a.versionhead{font-size: 1.4em;}
a.copyright:link
        {color: #ffffff; text-decoration:none; font-size:1em; none;text-align:left;}
        
a.copyright:visited
        {color: #ffffff; text-decoration: none;font-size:1em;text-align:left;} 

a.copyright:hover
{color: #ffffff; text-decoration: none;font-size:1em;text-align:left;} 


a.caption:link
        {color: #ffffff; text-decoration: none;font-size:0.6em;text-align:left;}
        
a.caption:visited
        {color: #ffffff; text-decoration: none;font-size:0.6em;text-align:left;} 

a.caption:hover
{color: #ffffff; text-decoration: none;font-size:0.6em;text-align:left;l} 

h1{font-size:64px;line-height:110%;}
		
	}
