@import url("reset.css");

/* Some basic styling */
body {
	font-family:"Arial Unicode MS","Lucida Grande",Arial,Verdana,Helvetica,Sans-serif;
	font-size:100%;
	line-height: 1.125em;
}

input, select {
    -ms-box-sizing:border-box;
    -moz-box-sizing:border-box;
    -webkit-box-sizing:border-box; 
    box-sizing:border-box;
	font-size: 1em;
}
select {
	padding: 1px 0px 1px 4px;
}

.clear {
	clear: both;
}
.hidden {
	display: none;
}
.error {
	color: red;
}
strong {
	font-weight: bold;
}
div.exception {
	width: 60%;
	margin: 20px auto -15px;
	padding: 5px;
	border: black 2px solid;
	background-color: yellow;
	color: red;
	font-weight: bold;
}
.info {
	display: block;
	padding-top: 5px;
	color: #777;
}
.button {
	margin-right: 10px;
	padding: 5px 20px 5px 20px;
	border-radius: 5px;
	border-width: 0;
}

#wrapper {
	width: 965px; 
	margin:0 auto;
	padding: 0 50px;
	font-size: 0.875em; /*14 px*/
	text-align: justify;
}

/* Default header style */
#header {
	vertical-align: bottom;
	position: relative;
	height: auto;
	padding-top: 24px;
}
#header #siteName {
	font-size: 1.4em;
	font-weight: bold;
	color: #777;
	margin-bottom: 6px;
	margin-top: 15px;
	text-decoration: none;
	display: inline-block;
}
#header #nasLogo {
	margin-bottom: 15px;
}
#header #siteLogo {
	margin-left: 20px;
	margin-bottom: 0px;
	vertical-align: bottom;
}
#header #nlbLogo {
	margin: 15px 35px;
}
#govtStandard span {
	display: block;
	font-size: 0.8em;
	text-align: center;
}
#govtStandard span a {
	text-decoration: none;
	color: black;
}
#govtStandard {
	float:right;
}
#header .leftHeader {
	float: left;
	position: absolute;
	bottom: 0;
}
#header .rightHeader {
	float: right;
	position: absolute;
	right: 0;
	bottom: 0;
	text-align: right;
}
#header #print, #preview-controls img {
	cursor: pointer;
}
.socialbookmark2 {
	display: inline-block;
}

/* Default navigation style */
#navigation {
	clear: both;
	width: 100%;
	border-collapse:separate;
	border-spacing: 1px 0;
	margin-top: 30px;
}
#navigation td {
	background-color: black;
	text-align: center;
	white-space: nowrap;
}
#navigation a {
	color: white;
	text-decoration: none;
	display: block;
	width: 100%;
	height: 100%;
}
#navigation a span {
	display: block;
	padding: 7px 25px;
}

/* for basic/advanced search slanted tab. The active color will be defined in each individual sites */
#switchSearchForm a {
	color: white;
	text-decoration: none;
}
#spacer1, #spacer2 {
	width: 0;
	height: 0;
	border-style: solid;
	border-top-width: 35px;
	border-right-width: 25px;
}
#item1, #item2 {
	height: 25px;
	padding: 8px 10px 2px 5px;
	background-color: #767676;
}
#item1 {
	padding-left: 25px;
}
#spacer1 {
	border-top-color: #767676;
}
#spacer1.active {
	border-right-color: #767676;
}
#spacer2 {
	border-top-color: #767676;
	border-right-color: transparent;
}

/* Default styling for search form */
#searchForm {
	width: 100%;
	min-height: 159px;
	margin-top: 35px;
	border: 1px solid #767676;
	border-radius: 0px 10px 10px 10px;
	clear: both;
	
	background-color: #eeeeee;
	background:    -moz-linear-gradient(top, #eeeeee, #cccccc);
	background: -webkit-linear-gradient(top, #eeeeee, #cccccc);
	background:      -o-linear-gradient(top, #eeeeee, #cccccc);
	background:     -ms-linear-gradient(top, #eeeeee, #cccccc);
	background:   linear-gradient(to bottom, #eeeeee, #cccccc);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#cccccc',GradientType=0 );
}

#searchForm table {
	width: 75%;
	margin-top: 50px;
	margin-left: 5%;
	clear: both;
}
#searchForm table td, #searchForm table th {
	vertical-align: text-top;
	padding: 5px 3px 15px;
}
#searchForm table th {
	width: 25%;
	text-align: right;
	padding-right: 25px;
}
/* these may clash with the site-specific styles, so we need the !important mark*/
#searchForm table.rangeInput {
	width: 100% !important;
	margin: 0 !important;
}
#searchForm table.rangeInput th, #searchForm table.rangeInput td {
	padding: 0 !important;
}
#searchForm table.rangeInput th.from {
	width:1% !important; 
	text-align: left !important;
	padding-right: 10px !important;
}
#searchForm table.rangeInput th.to {
	width:15% !important; 
	text-align:right !important;
	padding-right: 10px !important;
}
#searchForm .fullWidth {
	width: 100%;
}
#searchForm .halfWidth {
	width: 35%;
}
#searchForm .shortWidth {
	width: 10%;
}
#searchForm .shortSelect {
	width: auto;
}
#searchForm .radioGroup {
	margin-top: 3px;
	zoom: 1;
}
#searchForm .radioGroup label {
	padding-right: 45px;
}
#searchForm input.magnifyingGlass {
	width: 85%;
	width: calc(100% - 61px);
}
#searchForm img.magnifyingGlass {
	vertical-align:bottom; 
	height:22px;
}
#searchForm table.magnifyingGlass {
	margin-bottom: 40px;
}

#searchForm table#advancedSearch, #searchForm>table.form {
	width: 80%;
	margin-left: auto;
	margin-right: auto;
}
#searchForm table#advancedSearch>tr>th, #searchForm>table.form>tr>th {
	width: 170px;
}
#searchForm table#advancedSearch td[id^=link-copy] {
	width: 100px;
}

#switchSearchForm div {
	float: left;
}
.formTopButtons {
	text-align: right;
	margin-top: 25px;
	padding-right: 50px;
	margin-bottom: 5px;
}
.formButtons {
	text-align:right;
	margin-top:5px;
	padding-right: 50px;
	margin-bottom: 25px;
}

/* footer styling*/
#footer {
	clear: both;
	margin: 50px 0 25px;
	text-align: center;
}
#footer p {
	margin-bottom: 5px;
}
#footer a {
	color: black;
}
#footer .footertext {
	/*margin: 50px 0 0 0;*/
	display: inline-block;
	padding-left: 20%;
}
#nlblogo img {
	/*margin: 40px 0 0 0;*/
	float: right;
}
.accession {
	font-style: italic;
}

/* some styling for images, to restrict their displayed size */
img.thumbnail.landscape {
	max-width: 150px;
	height: auto;
}
img.thumbnail.portrait {
	width: auto;
	max-height: 150px;
}
img.full {
	display: block;
	margin: 35px auto 0;
}
img.full.landscape {
	width: 643px;
	height: auto;
}
img.full.portrait {
	width: auto;
	height: 643px;
}

/* some styling for search result screen */
form#searchResult {
	margin-top: 35px;
	vertical-align: baseline;
}
form#searchResult .searchResultItem {
	clear: both;
}
form#searchResult .checkbox {
	margin: 2px 10px 25px 0;
	float: left;
}
form#searchResult .dataColumn {
	margin: 0 5px 25px 0;
	float: left;
	display: table;
	max-width: 850px;
	/*max-width: 680px;*/
}
form#searchResult .imageColumn {
	margin-bottom: 25px;
	float: right;
}
form#searchResult .imageColumn .fileTypeIcon {
	min-width: 35px;
	max-width: 45px;
	width: auto;
	/*margin-right: 4px; 5px*/
}
form#searchResult .orderBy {
	float: right;
	margin-bottom:20px;
}
form#searchResult .orderBy select {
	width: 200px;
}
form#searchResult p {
	margin: 0;
}

.searchResultControl {
	width:100%;
	line-height: 150%;
	clear: both;
}
.searchResultControl.top {
	margin-bottom: 15px;
}
.searchResultControl.top td {
	vertical-align: bottom;
}
.searchResultControl.bottom {
	margin-top: 15px;
}
.searchResultControl.bottom td {
	vertical-align: top;
}
.searchResultControl .allLinks {
	width: 40%;
	text-align: left;
}
.searchResultControl .showDetails {
	text-align: center;
}
.searchResultControl .showDetails .button{
	padding-left: 15px;
	padding-right: 15px;
	margin-bottom: 7px;
}
.searchResultControl .pageLinks {
	width: 40%;
	text-align: right;
	white-space: nowrap;
}
.searchResultControl .pageLink {
	font-size: 0.786em; /*11 px*/
	line-height: 1em; /*11 px*/
	min-width: 1em;
	display: inline-block;
	padding: 3px;
	margin: 0 1px;
	border: 1px #999999 solid;
	color: black;
	background-color: white;
	text-decoration: none;
	text-align: center;
}
.searchResultControl a.pageLink:hover {
	border-color: black;
	background-color: #bbbbbb;
}
.searchResultControl .currentPage {
	color: white;
	font-weight: bold;
	font-size: 1em;
}

.noResult {
	height: 300px;
}
.noResult p {
	font-size: 1.3em;
	margin-top: 20px;
	margin-bottom: 10px;
}

/* some styling for record details screen */
#recordDetails {
	margin-top: 35px;
	border: 1px solid black;
	border-radius: 10px;
	background-color: #dddddd;
	padding: 30px;
	overflow: hidden;
}
#recordDetails table {
	width: 100%;
	border-width: 0;
}
#recordDetails th, #recordDetails td{
	padding-bottom: 10px;
}
#recordDetails th {
	font-weight:bold;
	text-align: right;
	padding-right: 10px;
	white-space: nowrap;
}
#recordDetails td {
	text-align: justify;
}

/* some general styling for the content area */
#content {
	margin-top: 35px;
	padding: 10px 50px;
	border: 1px solid #bbbbbb;
	border-radius: 10px;
	overflow: auto;
	clear: both;
	background-color: #eeeeee;
	background:    -moz-linear-gradient(top, #eeeeee, #cccccc);
	background: -webkit-linear-gradient(top, #eeeeee, #cccccc);
	background:      -o-linear-gradient(top, #eeeeee, #cccccc);
	background:     -ms-linear-gradient(top, #eeeeee, #cccccc);
	background:   linear-gradient(to bottom, #eeeeee, #cccccc);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#cccccc',GradientType=0 );
}
#content h1 {
	font-size: 1.5em;
	font-weight: bold;
	margin-bottom: 20px;
	margin-top: 35px;
}
#content p {
	padding-top: 10px;
	margin-bottom: 10px;
	word-break: break-word;
}
#content .breakable {
	display: inline-block;
	word-break: break-all;
	-ms-text-overflow: ellipsis;
}
#content ul {
	list-style-type:disc; 
	margin-left: 25px;
}
#content li {
	padding-bottom: 10px; 
	padding-left: 10px;
}
.noLineBreak {
	white-space: nowrap;
}

/* some styling for the contact form */
#contactForm {
	width: 100%;
	max-width: 507px;
}
#feedbackTable>.row
{
	margin-top: 20px;
}
#contactForm #feedbackTable input[type="text"], #contactForm textarea {
	width: 100%;
}
#feedbackTable>.row>label  {
	display: inline-block; 
	width: 30%;
	float: left;
}
#feedbackTable>.row>label  {
	display: inline-block; 
	float: left;
}
#feedbackTable>.row>.input>label {
	display: block;
	width: auto;
	clear: both;
	margin-bottom: 10px;
}
#feedbackTable>.row>.input>input[type="checkbox"]
{
	margin-bottom: 10px;
}
#feedbackTable>.row>.input,#feedbackTable>.row>.fullInput {
	display: inline-block;
	width: calc(70% - 10px);
	padding-left: 10px;
}
#feedbackTable>.row>.fullInput {
	width: 100%;
	padding-left: 0px;
}
#contactForm td, #contactForm th {
	vertical-align: text-top;
	padding: 5px 3px 15px;
}
#contactForm th {
	width: 25%;
	text-align: left;
	padding-right: 25px;
}

#contactForm textarea {
	height: 120px;
	padding: 0;
}
#contactForm #site_options {
	white-space: nowrap;
}
#contactForm #site_options input {
	width: 13px;
    height: 13px;
    padding: 0;
    margin:0 4px;
    vertical-align: bottom;
    position: relative;
    top: -1px;
    *overflow: hidden;
}
#contactForm #site_options label {
	display: block;
	margin-bottom: 15px;
	line-height: 14px;
}
#contactForm .buttons {
	width: 100%;
	margin: 15px auto;
	text-align: center;
}
#contactForm .button {
	width: auto;
}
#contactForm #captchaTable td {
	vertical-align:middle; 
	padding-bottom: 0;
}
#contactForm #captchaCaption {
	text-align:left; 
	white-space: nowrap;
}
#contactForm #captchaText {
	border:1px solid black; 
	margin-bottom: 5px;
}
#contactForm #captchaAnswer {
	width:210px;
}
.floatLeft {
	float: left;
}
.floatRight {
	float: right;
}
.fixed750 {
	width: 750px;
}
.fixed145 {
	width: 145px;
}
.errorMessage {
	text-align: center;	
}
.smaller {
	font-size:x-small;
}
.leftTextAlign {
	text-align: left !important;
}
li.attachmentItem {
	list-style-type: square;
	margin-left:15px;
}
.full.landscape.bottom {
	margin: 35px auto;
}
#accessDialog{
	border: 1px solid #aaa;
	background: #fff;
	padding: 3px;
	position: fixed;
	z-index: 999;
	width: 500px;
	visibility: hidden;
	margin:auto;
}
#accessDialog .header {
	border: 1px solid #aaa;
	padding: 4px;
	background: #ddd;
	color: #555;
	font-size: 11pt;
	font-weight: bold;
	margin-bottom: 2px;
}
#accessDialog .body {
	background: #fff;
	padding: 6px;
	font-size: 11pt;
}
#accessDialog .options {
	text-align: right;
	padding: 6px;
	padding-top: 0px;
}
#accessDialog .options input {
	padding: 6px;
	font-size: 10pt;
}

form#searchResult div.resultData p, form#searchResult div.resultData a {
	margin-left: 30px;
	display: block;
}
#social-print {
	float: right;
	display: inline-block;
	margin-top: 5px;
}
input, select
{
	margin: 2px;
}
