@media screen {
	body {
		position: relative;
		overflow-x: hidden;
		width: 100%;
		max-width: 100%;
	}
	html:empty {
		margin: 0;
		padding: 0;
		display: block;
	}
	#wrapper {
		width: auto;
		min-width: 295px;
		max-width: 965px;
		padding: 0 3.5%;
	}
	#outerWrapper {
		overflow: hidden;
	}
	#content {
		padding: 2% 5%;
	}
	input#keywords {
		margin-bottom: 0px;
	}
	/* The header */
	#header {
		height: auto;
		padding-top: 24px;
	}
	#header #nasLogo img {
		width: 232px;
		height: 83px;
		vertical-align: top;
		float: left;
	}
	#header #nlbLogo img {
		max-width: 155px;
		width: 40%;
		vertical-align: top;
		margin-top: 30px;
		margin-right: 35px;
		float: right;
	}
	#header #siteName {
		clear: both;
		text-align: left;
		margin-top: 15px;
		float: left;
		line-height: 28px;
	}
	#header #social-print {
		margin-top: 5px;
		float: right;
	}
	#social-print2 {
		display: none;
		text-align: center;
	}
	#social-print2 .right {
		float: right;
	}
	/* Navigation links*/
	#navigation {
		clear: both;
		width: 100%;
		margin-top: 20px;
	}
	#navigation td {
		white-space: normal;
		vertical-align: middle;
	}
	#navigation a span {
		padding: 7px 1vw;
	}
	#navigation2 {
		height: 50px;
		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 );
			*/
		display: none;
		border-bottom: 1px solid #bbb;
		color: 000;
		width: 100%;
		position: absolute;
		z-index: 999;
		top: 0px;
		left: 0px;
	}
	#menuButton {
		position: absolute;
		height: 40px;
		top: 5px;
		left: 5px;
	}
	.menuMobile {
		display: none;
	}
	.showMenuMobile {
		float: left;
		position: relative;
		background: #EEE;
		width: 80%;
		height: 100%;
		top: 50px;
		border-right: 1px solid #AAA;
		z-index: 99;
	}
	.wrapperNormal {
		position: relative;
	}
	.wrapperSide {
		position: relative;
		display: inline-block;
		top: 0px;
		left: 15%;
	}
	#menuMobile div {
		padding: 12px 8px 12px 8px;
		border-bottom: 1px solid #AAA;
	}
	#menuMobile div:hover {
		background: #DDD;
	}
	#menuMobile a {
		text-decoration: none;
		color: #222;
	}
	#logosMobile {
		display: inline;
		height: 100%;
		padding-left: 55px;
	}
	#nasLogo2,#nlbLogo2 {
		margin-top: 5px;
		margin-right: 5px;
		height: 40px;
	}
	#nlbLogo2 {
		float: right;
	}

	/* Search result control */
	.searchResultControl div {
		display: inline-block;
	}
	.searchResultControl .allLinks {
		float: left;
		width: auto;
		min-width: 40%;
	}
	.searchResultControl .showDetails {
		float: left;
		margin-left: 15px;
	}
	.searchResultControl .pageLinks {
		float: right;
		width: auto;
	}
	.searchResultControl .button {
		white-space: nowrap;
		margin: 0;
	}
	form#searchResult .orderBy {
		clear: both;
		margin-top: 15px;
		text-align: left;
	}

	/* Change the search result display */
	form#searchResult .searchResultItem {
		width: 100%;
	}
	form#searchResult .dataColumn {
		/*width: 75%;*/
		margin-right: 0;
	}
	form#searchResult .imageColumn {
		width: 15%;
		text-align: right;
		padding-left: 2%;
		box-sizing: border-box;
		-moz-box-sizing: border-box;
	}
	#searchForm {
		min-width: 270px;
		overflow: auto;
	}
	#searchForm .row {
		clear: both;
		white-space: nowrap;
	}
	#searchForm .row>label,#searchForm .row .input {
		box-sizing: border-box;
		-moz-box-sizing: border-box;
	}
	#searchForm .row .input .subKeywords {
		white-space: normal;
	}
	#searchForm .row .input .subKeywordsText {
		width: auto;
	}
	#searchForm .row .input .subKeywordsField {
		display: inline-block;
	}
	#searchForm .row .input .before,#searchForm .row .input .after {
		float: left;
	}
	.after select {
		max-width: 210px;
	}

	/* Record Details page */
	#recordDetails {
		clear: both;
	}
	#recordDetails #transcripts a {
		display: block;
		text-align: center;
		white-space: normal;
	}
	#recordDetails #transcripts img {
		margin: 0 auto;
	}
	#recordDetails #recordTable {
		box-sizing: border-box;
		-moz-box-sizing: border-box;
	}
	#recordDetails #recordTable label,#recordDetails #recordTable .row div {
		padding-bottom: 10px;
		box-sizing: border-box;
		-moz-box-sizing: border-box;
		vertical-align: top;
	}
	#recordDetails #recordTable label {
		font-weight: bold;
		padding-right: 10px;
	}
	#recordDetails #recordTable div#avPlayer {
		display: block;
		margin: 0;
		padding: 20px 0;
		text-align: center;
	}
	#recordDetails #recordTable div#avPlayer>div {
		margin: 0 auto;
	}
	#recordDetails #transcripts {
		float: right;
		padding-right: 2%;
	}
	#content img {
		max-width: 100%;
	}
	#video_wrapper {
		max-width: 100%;
	}
	#accessDialog {
		width: 50%;
		top: 30%;
	}
}

@media screen and (max-width: 600px) {
	#header #social-print {
		display: none;
	}
	#header #nlbLogo img {
		margin-top: 10px;
		margin-right: 0;
	}
	#social-print2 {
		display: block;
	}
}

@media screen and (max-width: 340px) {
	#nasLogo2,#nlbLogo2 {
		margin-top: 8px;
		height: 65%;
	}
}

@media screen and (min-width: 650px) {
	#navigation {
		display: table;
	}
	#navigation2 {
		display: none;
	}
	#menuMobile {
		display: none;
	}
	.wrapperNormal {
		position: relative;
	}
	.wrapperSide {
		position: relative;
		display: inherit;
		overflow-x: inherit;
		width: inherit;
		left: 0px;
	}
}

@media screen and (max-width: 680px) {
	#siteLogo {
		clear: both;
		display: block;
	}
}
/*Transfer menu to top*/
@media screen and (max-width: 650px) {
	#siteLogo {
		margin-top: 20px;
	}
	#navigation {
		display: none;
	}
	#navigation2 {
		display: block;
	}
	#wrapper {
		margin-top: 50px;
	}
	#nasLogo,#nlbLogo {
		display: none;
	}
	#header #siteName {
		clear: both;
		text-align: left;
		margin-top: 0;
		margin-bottom: 12pt;
		display: inline-block;
	}
	#wrapper {
		min-width: 0px;
		overflow-x: hidden;
		overflow-y: visible;
	}
}

@media screen and (max-width: 600px) {
	#header {
		height: 5px;
	}
	#header #ohcLogo {
		display: inline;
		clear: both;
	}
}

/* The basic search box */
@media screen and (min-width: 995px) {
	#searchFormContainer {
		margin-left: 610px;
	}
}

@media screen and (max-width: 994px) {
	#searchFormContainer {
		width: 100%;
		margin-left 0px;
	}
	#searchForm.simpleSearch {
		
		min-height: 110px;
		padding-bottom: 8px;
		margin-bottom: 8px;
	}
	#sliderFrame {
		float: none;
		margin-left: auto;
		margin-right: auto;
	}
}

@media screen and (max-device-width: 600px) {
	input, button, textarea, select {
		font-size: 16px;
	}
	
	#searchForm img.magnifyingGlass
	{
		height: 27px;
		width: 69px;
	}
	#searchForm input.magnifyingGlass {
		width: calc(100% - 69px);
	}
}


/* hide the slider if there is not enough space */
@media screen and (max-width: 670px) {
	#sliderFrame {
		display: none;
	}
}

/* The 8 databases */
/* 4 columns */
@media screen and (min-width: 900px) {
	#databases div {
		width: 25%;
		float: left;
	}
	#databases div#db1,#databases div#db5 {
		padding-left: 0;
	}
	#databases div#db4,#databases div#db8 {
		padding-right: 0;
	}
}
/* 3 columns */
@media screen and (max-width: 900px) and (min-width: 671px) {
	#databases div {
		width: 33.33%;
		float: left;
	}
	#databases div#db1,#databases div#db4,#databases div#db7 {
		padding-left: 0;
	}
	#databases div#db3,#databases div#db6 {
		padding-right: 0;
	}
}
/* 2 columns and make spaces between DBs decrease*/
@media screen and (max-width: 670px) and (min-width: 381px) {
	#databases div {
		width: 50%;
		float: left;
		padding-bottom: 0;
		padding-top: 0;
	}
	#databases div span {
		min-height: 38px;
		font-size: 9pt;
	}
	#databases div#db1,#databases div#db3,#databases div#db5,#databases div#db7
		{
		padding-left: 0;
		padding-top: 0;
	}
	#databases div#db2,#databases div#db4,#databases div#db6,#databases div#db8
		{
		padding-right: 0;
		padding-top: 0;
	}
}
/* 1 column */
@media screen and (max-width: 380px) {
	#databases div {
		width: 100%;
		padding-left: 0;
		padding-right: 0;
		margin-left: auto;
		margin-right: auto;
	}
	#databases div#db1,#databases div#db3,#databases div#db5,#databases div#db7
		{
		padding-left: 0;
		padding-top: 0;
	}
	#databases div#db2,#databases div#db4,#databases div#db6,#databases div#db8
		{
		padding-right: 0;
		padding-top: 0;
	}
}

/* Change the pagination link display at very low res */
@media screen and (min-width: 400px) {
	.fullLinks {
		display: initial !important;
	}
	.jumpToLinks {
		display: none !important;
	}
}

@media screen and (max-width: 400px) {
	.fullLinks {
		display: none !important;
	}
	.jumpToLinks {
		display: initial !important;
	}
	.searchResultControl .showDetails .button {
		padding: 5px 5%;
	}
}

@media screen and (max-width: 625px) {
	form#searchResult {
		text-align: left;
	}
	form#searchResult .dataColumn {
		width: auto;
		margin-right: 0;
		float: none;
		margin-left: 25px;
	}
	form#searchResult .imageColumn {
		width: 95%;
		float: none;
		text-align: left;
		margin-left: 25px;
		margin-bottom: 8px;
	}
	form#searchResult .imageColumn img.fileTypeIcon {
		width: 10.5%;
		min-width: 45px;
	}
}

/* Advanced Search Forms */
@media screen and (min-width: 601px) {
	#searchForm .row {
		padding-top: 20px;
	}
	#searchForm .row>label {
		display: inline-block;
		float: left;
		width: 30%;
		text-align: right;
		padding-right: 20px;
		padding-left: 5%;
		white-space: normal;
	}
	#searchForm .row .input {
		display: inline-block;
		width: 60%;
		padding-right: 3%;
	}
	#searchForm .radioGroup label {
		padding-right: 8%;
	}
	#searchForm #toggleDetailsLink {
		display: none;
	}
	#searchForm .row.hidden {
		display: block;
	}
}

@media screen and (max-width: 600px) {
	#searchForm .row {
		padding-top: 5px;
	}
	#searchForm .row>label,#db {
		display: block;
		width: 100%;
		text-align: left;
		padding: 0 5%;
		font-weight: bold;
	}
	#searchForm .row .input {
		display: block;
		width: 100%;
		padding: 0 5% 10px;
	}
	#searchForm .radioGroup label {
		padding-right: 1%;
	}
	#searchForm .empty {
		display: none !important;
	}
	#searchForm #toggleDetailsLink {
		display: block;
		padding: 0 5%;
	}
	#searchForm .row.hidden {
		display: none;
	}
	.formTopButtons {
		display: none;
	}
}

@media screen and (max-width: 400px) {
	#searchForm .radioGroup label {
		font-size: 0.75em;
	}
}
@media screen and (max-width: 360px) {
	#searchForm .row .input {
		width: 100%;
	}
}
/* Contact Forms */
@media screen and (max-width: 600px) {
	#contactForm .row {
		padding-top: 5px;
		margin-top: 0px;
	}
	#contactForm .row>label {
		display: block;
		width: 100%;
		text-align: left;
		padding: 0 0%;
		font-weight: bold;
	}
	#contactForm .row .input {
		display: block;
		width: 100%;
		padding: 0 0% 10px;
	}
	#contactForm .radioGroup label {
		padding-right: 2%;
	}
	#contactForm .empty {
		display: none !important;
	}
	#contactForm #toggleDetailsLink {
		display: block;
		padding: 0 5%;
	}
	#contactForm .row.hidden {
		display: none;
	}
}
#recordDetails .fileAttachment {
		margin-bottom: 10px;
	}
	
	
@media screen and (max-width: 400px) {
	#contactForm .radioGroup label {
		font-size: 0.8em;
	}
}

@media screen and (max-width: 400px) {
	#recordDetails #transcripts a {
		font-size: 0.9em;
	}
}


@media screen and (min-width: 750px) {
	
	#recordDetails #transcripts {
		width: 150px;
		white-space: nowrap;
	}
	
	#recordDetails #recordTable .row {
		display: -webkit-box;
		display: -moz-flex;
		display: -webkit-flex;
		
	}
	
	
	#recordDetails #recordTable .row div {
		/*display: block;
			float: left;*/
		
	}
}

@media screen and (max-width: 749px) {
	#recordDetails #transcripts {
		width: 20%;
		max-width: 150px;
	}
	#recordDetails #transcripts img {
		width: 90%;
		max-width: 84px;
	}
}

@media screen and (max-width: 600px) {
	#recordDetails #transcripts img {
		width: 90%;
		max-width: 60px;
	}
	#recordDetails .fileAttachment {
		width: 100px;
		margin-right: 1%;
		display: inline-block;
		vertical-align: top;
		margin-bottom: 15px;
	}
	
}
/* additional fields in advanced search forms */
@media screen and (max-width: 400px) {
	.linkspan {
		font-size: 0.9em;
	}
}

@media screen and (max-width: 350px) {
	#item1,#item2 {
		font-size: 1em;
		height: 20px;
		padding: 7px 7px;
		background-color: #767676;
	}
	#spacer1,#spacer2 {
		width: 0px;
		height: 0px;
		border-style: solid;
		border-top-width: 34px;
		border-right-width: 20px;
	}
	.linkspan {
		display: block;
		clear: both;
	}
}

@media screen and (max-width: 1050px) {
	.hideat1050 {
		display: none;
	}
}
/* audiovisual image */
@media screen and (max-width: 400px) {
	#highlights img.avimage {
		width: 100%;
	}
}

/* maps and building plans 
@media screen and (max-width: 600px) {
	#highlights div.mapscontainer {
		display: block;
	}
}

@media screen and (max-width: 1049px) {
	#highlights div.dividercontainer {
		display: none;
	}
}*/

/* copyright notice */
@media screen and (max-width: 568px) {
	#accessDialog {
		width: calc(100% -  6px);
		margin-left: 0;
		margin-right: 0;
		height: 100%;
		left: 0% !important;
		border: 0px;
		top: 0px;
		z-index: 9999;
	}
	#accessDialog .header {
		margin-top: 2%;
		margin-bottom: 2%;
		padding-bottom: 2%;
		background: #FFF;
		border-top: 0px;
		border-left: 0px;
		border-right: 0px;
	}
	#accessDialog .body {
		font-size: 11pt;
		margin-bottom: 2%;
	}
	#accessDialog input {
		font-size: 11pt;
	}
	#accessDialog .options {
		text-align: center;
	}
}

/* site name */
@media screen and (max-width: 320px) {
	#siteName {
		float: left !important;
	}
}

@media screen and (max-width: 600px) {
	#socialPrintContainer {
		margin: 20px 0px;
	}
	#socialPrintContainer>div li {
		float: initial;
		display: inherit;
	}
	#socialPrintContainer ol,#socialPrintContainer ul {
		text-align: center;
		margin: 5px;
		display: inherit;
	}
	#footer {
		margin-top: 2px;
	}
}
@media screen and (max-width: 760px) {
	#header #siteLogo {
		display: none;
	}
}

@media screen and (max-width: 600px) {
	#header #siteName {
		display: inline-block;
		width: 100%;
	}
	#content,#searchForm {
		margin-top: 15px;
	}
}

/* lion head logo */
@media screen and (max-width : 650px) {
	#header>#govtStandard {
		display: none;
	}
	#govtStandard {
		margin-top: 5px;
	}
	#govtStandard span {
		line-height: 0.6em;
		font-size: 0.6em;
		margin: 0 auto;
		padding-right: 5%;
	}
	#govtStandard img {
		width: 90%;
	}
}

@media screen and (max-width : 450px) {
	#govtStandard span {
		line-height: 0.5em;
		font-size: 0.5em;
		width: 96%;
		padding-right: 4%;
	}
	#govtStandard,#govtStandard span {
		text-align: right;
	}
	#govtStandard {
		margin-top: 5px;
		width: 45%;
		margin-right: 1%;
	}
	#govtStandard img {
		width: 90%;
		margin-right: 5%;
	}
}

@media screen and (max-width : 360px) {
	#govtStandard {
		margin-top: 10px;
	}
	#govtStandard span {
		font-size: 0.45em;
		width: 95%;
	}
}

@media screen and (max-width : 345px) {
	body {
		-webkit-text-size-adjust: none;
	}
	#govtStandard span {
		width: 99%;
		padding-right: 1%;
	}
	#govtStandard img {
		margin-right: 1%;
	}
}

@media screen and (max-width : 320px) {
	#govtStandard span {
		width: 100%;
		padding-right: 0;
	}
	#govtStandard img {
		margin-right: 1%;
	}
}

@media screen and (max-width : 319px) {
	#govtStandard {
		display: none; /* hide  as requested */
	}
}

/* nlb logo in footer */
@media screen and (max-width : 660px) {
	#footer .footertext {
		padding-left: 25%;
	}
	#nlblogo img {
		width: 25%;
	}
}

@media screen and (max-width : 655px) {
	#footer .footertext {
		padding-left: 24%;
	}
}

@media screen and (max-width : 650px) {
	#nlblogo img {
		margin: 0;
		width: auto;
		float: none;
	}
	#footer .footertext {
		margin: 10px 0 0 0;
		padding-left: 0;
	}
}

@media print {
	body {
		position: relative;
		overflow-x: hidden;
		width: 100%;
		max-width: 1050px;
	}
	#menuMobile,#navigation2 {
		display: none;
	}
	#header {
		display: inline-block;
		width: 100%;
	}
	#databases div {
		width: 24%;
		display: inline-block;
	}
	.mcSlc {
		display: none;
	}
	#searchForm {
		display: inline-block;
	}
	.row label[for="keywords"] {
		width: 100%;
		display: inline-block;
	}
}

.responsivePlayer {
	display: block;
	/*clear: both;*/
	text-align: center;
}

.originalContainerClass
{
	overflow: auto; 
	width: 100%; 
	display: inline;
	height: auto;
	clear: both;
}
.newContainerClass
{
	overflow: hidden; 
	width: 100%; 
	display: inline-block;
	height: auto;
	clear: both;
}
#avPlayer
{
	display: inline-block;
	text-align: center;
	width: 100%;
}
@media screen and (min-width: 626px) {
	hr.search-break {
		display: none;
	}
}
@media screen and (max-width: 625px) {
	hr.search-break {
		display: block;
		border: 0px;
		margin-bottom: 40px;
	}
}

@media screen and (max-width: 380px) {

	.mobileLeftAlign
	{
		text-align: left;
	}
	
}
.row #imageNo
{
	width: 80px;
}