@import "../art-of-asia.css";
/* viewer specific */

body {
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	border : 1px;
	background-color: #98A96F;
	background: url(/art-of-asia/images/calligraphy-background.gif);
	font-family: verdana, arial, sans-serif;
	color: #000000;
	font-size: 90%
}

img { border: 0px; }

#topnav {
  position:absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  background-color:#000000;
  height: 38px;
  color:#FFFFFF;
  border-bottom: 1px solid;
  border-bottom-color:#636844;
  }

#sidenav {
float:left;
position:absolute;
left: 0px;
top: 38px;
width: 183px;
height: 100%;
border-right: 1px solid #000000;
}

#viewer_port {
  position:absolute;
  left: 184px;
  top: 38px;
  width: 820px;
  padding: 4px;}
  
#v_header {
  text-align:center;}  
  
  
  .prev_next_nav {
    display:table;
	padding: 4px;
	clear:both;
	background-color:#B9C896;
	border: 1px solid;
	border-color: #000000;
	width:608px;
	font-family: inherit;
   font-size: 90%;
   margin-bottom:6px;
  }
  
  .prev_next_row {
    display: table-row;}
  
  
  .back {
    display:table-cell;
	vertical-align:middle;
	width:33%;
	/*float:left;
	border: 1px solid;	
	width:180px;*/}
	
  .arrows {
    display:table-cell;
	vertical-align:middle;
	text-align:center;
	width:33%;
	/*border: 1px solid;
	float:left;
	width:180px;*/}
  
  .jump {
    display:table-cell;
	vertical-align:middle;
	width:34%;
	text-align:right;}
  
  .jump_form {
  display:inline;}
  
  .jump_form input {
    vertical-align:middle;}
  
  .jump_to {
  margin:0px;}
  
  .jump_button {
    align:bottom;}
  
/* Set width of result to determine the number of items per row. */
  .result {
    position: relative;
    float: left;
	width: 200px;
	clear: none;
  }
  
  .item_number {
    float: left;
  }
  
  img.thumbnail {
  display: block;
  margin-left: auto;
  margin-right: auto;
  border: 0;
  }

  .image_area {
    display: table-cell;
	vertical-align:middle;
	text-align:center;
    height: 180px;
	width: 180px;
	}
  
  .result_label {
  position: relative;
  overflow: visible;
  clear: left;
  margin-left: 1em;
  text-indent: -1em;
  padding: 1.5em;
  }
  
  .mod3 { 
    clear:left;
	width: 100%;}
	
  #search {
    display:block;
	clear:both;
	text-align:center;
	vertical-align:middle}
	
  #search img,input {
    vertical-align:middle;}
	
  #selections {
    background-color:#7F8E5F;
	width:406px;
	padding:2px;
	display:table;
	}
	
   .selection_menu {
    margin-top:6px;
    margin-bottom:6px;
	}
   
  .selection_result {
    display:inline;
    float: left;
	width: 200px;
	clear: none;
	background-color:inherit;}
	
   
  .smod2  {
   clear:left;
   width:100%;}
	
  .selection_controls {
    float:right;
	width: 175px;}

  .selection_status {
    display:table;
	padding: 4px;
	clear: left;
	background-color:#B9C896;
	border: 1px solid;
	border-color: #000000;
	width:400px;
	font-family: inherit;
   font-size: 90%;
  }
  
  .selection_back {
    display:block;
	float:left;
	width:100px;}
	
  .selection_count {
    display:block;
	float:left;
	width:275px;}

/*alt_text styles*/	

.interview p {
  clear:none;
  }

  .inset_image {
   background-color:#7F8E5F;
   padding:6px;
   float:right;
   clear:right;
   color:#191919;
   width:200px;
   text-align:center;
   }
   
   .inset_image img {
   display:block;
   margin-left:auto;
   margin-right:auto;
   margin-top:4px;
   margin-bottom:4px;}

  .caption {
    width:190px;}

/*Postcards*/

#postcard {
  display:block;
  border: 1px solid;
  border-color: #AAA #444 #444 #AAA;
  background-color: #EBE6D7;
  margin-left: auto;
  margin-right: auto;
  padding: 16px;
  width: 620px;
  margin-top: 24px;}

#postcard br {
  clear:all;}  
  
#postcard_inner {
  display:block;
  background-color: #98A96F;
  padding: 8px;
  border: 1px solid;
  border-color: #1A211E;
  height:400px;}

#postcard_left {
  display:block;
  float:left;
  width: 325px;
  font-size: 75%
  }  
  
#postcard_image {
  width: 320px;
  display: block;}

#postcard_middle {
  display:block;
  float:left;}
  
#postcard_image img {
   display:block;
   margin-left:auto;
   margin-right:auto;
   border: 1px solid;
  border-color: #AAA #444 #444 #AAA;}
  
#postcard_form {
  display: block;
  float:left;
  padding: 1em;
  width:200px;}

  .cl_hack {clear:all;}
  
  .float_label {float:left;}
  
#postcard_message {padding: 6px;}
  
#postcard_identity {
  display:block;
  position:relative;
  bottom:3px;
  right: 3px;
  padding-top: 3px;}
  
#send_button {
  padding:1em;
  float:right;}

/* details page*/

#g_image {
    float:left;
	padding:1em;
    margin-left: auto;
	margin-right: auto;
	text-align:center;
	width:330px;}
	
#primary_text {
	clear:left;
	}

#right_info {
    display:block;
	width: 225px;
	float:right;
	padding: 6px;
	font-family: inherit;
    font-size: inherit;}

.label {
    display: block;
	width: 100px;
	float: left;
	margin-bottom: 4px;
	text-transform:uppercase;
    color:#464C2F;
	font-weight:bold;
	clear:left;
	font-family: inherit;
    font-size: 75%;
	line-height : 132%;
	}

.label_data {
    display: block;
	width: 100px;
	float: left;
	margin-bottom: 4px;
	font-family: inherit;
   font-size: inherit;
   /*max-height: 72px;
   height:expression(
    this.scrollHeight > 72? "72px" : "auto" );
   overflow: hidden;*/
	}

#primary_text {
	font-family: verdana, arial, sans-serif;
	color: #000000;
	font-size: 90%;
	line-height : 132%;
}

#primary_text p {
   font-family: inherit;
   font-size: inherit;}


#commands img {
    padding: 1px;}
	
/*Popups*/
#popup_nav {
  width: 100%;
  background-color:#7f8e5f;
  height: 38px;
  color:#FFFFFF;
  border-bottom: 1px solid;
  border-bottom-color:#636844;
  }
  
#popup_close {
 float:right;
 position:absolute;
 top:6px;
 right:6px;}

#popup_id {
  width:111px;
  height:23px;
  position:relative;
  top:6px;
  left:6px;
  }

#popup img {
  padding:8px;}
