body {
    font-family: Calibri, Arial, 'Times New Roman';
    color: #4D4D4D;
    margin: 0px; 
}

.main{
    /*background: #ffffff;
    margin-left: auto;
    margin-right: auto;
    border-style: solid;
    border-width: 0px;
    padding-top: 1px;
    padding-left: 0px;
    padding-right: 0px;
    padding-bottom: 20px;
    border-radius: 00px;*/
}

/*.header{
    margin-left: auto;
    margin-right: auto;
    width: 1024px;
    border: 0px solid #ff6a00 !important;
}*/
#header {
	position: relative; 
	top: 0px; 
	left: 0px; 
    right: 0px; 
	height: 100px; 
    width: 100%; 
	background: #fff;
	color: #1C1C1C !important;
    z-index: 10;
	}
#contents {
	position: relative; 
	top: 0px;
	left: 0px;
    padding-left: 150px; 
    padding-bottom: 30px; 
	min-height: 600px;
	overflow:auto; 
	background: #eee;
	}
#leftcontent {
	position: fixed; 
	top: 0px;
	left: 0px;
	bottom: 0px; 
    width: 160px; 
    padding-top: 115px; 
	/*height: 2000px;*/
	overflow: hidden; 
	background: #fff;
	color: #4D4D4D;
    z-index: 1;
	}

div.maindiv{
    margin-left: auto;
    margin-right: auto;
    width: 1024px;
}

table.center {
    width:100%; 
    margin-left:0; 
    margin-right:0;
}
.tableBody{
    padding: 3px 8px 3px 8px
}

.tdLeft {
    text-align: right;
    width: 215px;
    font-size: 1.1em;
    font-weight: bold; 
    background-color: #fff;
    padding-right: 6px;
}
.tdRight {
    text-align: left;
    font-size: 1.1em;
    background-color: #fff;
    padding-left: 6px;
}

.failureNotification {
    font-size: 0.8em;
    color: Red;
    padding: 12px 0px 12px 0px;
    background-color: #fff;
}

.counter {
    font-size: 0.8em;
    color: #22AF27 !important; 
    position: inherit;
    width: 100px;
    padding-top: 0px;
    padding-bottom: 3px;
}

.fileSize {
    font-size: 0.8em;
    color: #999988;
    font-weight: normal;
    padding-top: 0px;
}

/* List formatting */
ul {
    margin-top: 0px;
    padding-top: 0px; 
}
ul.contentlist {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

li.contentlist {
  font: 200 14px/1.5 Helvetica, Verdana, sans-serif;
  border-bottom: 1px solid #ccc;
}

li:last-child {
  border: none;
}

li a {
  text-decoration: none;
  color: #000;

  -webkit-transition: font-size 0.3s ease, background-color 0.3s ease;
  -moz-transition: font-size 0.3s ease, background-color 0.3s ease;
  -o-transition: font-size 0.3s ease, background-color 0.3s ease;
  -ms-transition: font-size 0.3s ease, background-color 0.3s ease;
  transition: font-size 0.3s ease, background-color 0.3s ease;
  display: block;
  width: 200px;
}

li a:hover {
  font-size: 18px;
  background: #f6f6f6;
}

.dlText{
    /*color: #ffffff;*/
    font-weight: bold;
    

}
.dlText a{
    text-decoration: none;
    color: #22AF27;
}
.dlText a:hover{
    text-decoration: underline;
}

/*----------------------------------------------------------
  START: Buttons */
.buttonSubmit {
    display:inline;
    border: 0px;
	background: #659822;
	padding: 3px 6px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	color: white;
	font-size: 14px;
	text-decoration: none; 
	vertical-align: middle;
    cursor: pointer;
}
.buttonSubmit:hover {
	background: #3E7327;
	text-decoration: none; 
    color: #ccc; 
}
.buttonSubmit:active {
    border-top-color: #3E7327;
	background: #3E7327;
	outline: 0;
}

.buttonBack {
    display:inline;
}

.buttonClear {
    display:inline;
    border: 0px;
	background: #BF9000;
	/*background: -webkit-gradient(linear, left top, left bottom, from(#FFC000), to(#BF6000));
	background: -moz-linear-gradient(top,  #FFC000,  #BF6000);*/
	padding: 3px 6px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	/*-webkit-box-shadow: black 0 1px 0;
	-moz-box-shadow: black 0 1px 0;
	box-shadow: black 0 1px 0;
	text-shadow: rgba(0,0,0,.4) 0 1px 0;*/
	color: white;
	font-size: 14px;
	text-decoration: none; 
	vertical-align: middle;
}
.buttonClear:hover {
    border-top-color: #BF6000;
	background: #BF6000;
	text-decoration: none; 
    color: #ccc; 
}
.buttonClear:active {
    border-top-color: #BF6000;
	background: #BF6000;
	outline: 0;
}

.buttonDelete {
    display:inline;
    border: 0px;
	background: #FF4040;
	/*background: -webkit-gradient(linear, left top, left bottom, from(#FFC000), to(#BF6000));
	background: -moz-linear-gradient(top,  #FFC000,  #BF6000);*/
	padding: 3px 6px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	/*-webkit-box-shadow: black 0 1px 0;
	-moz-box-shadow: black 0 1px 0;
	box-shadow: black 0 1px 0;
	text-shadow: rgba(0,0,0,.4) 0 1px 0;*/
	color: white;
	font-size: 14px;
	text-decoration: none; 
	vertical-align: middle;
}
.buttonDelete:hover {
    border-top-color: #800000;
	background: #800000;
	text-decoration: none; 
    color: #ccc; 
}
.buttonDelete:active {
    border-top-color: #800000;
	background: #800000;
	outline: 0;
}

.buttonAlignRight {
    float: right;
    right: 0px;
}

/*.checkbox .btn, .checkbox-inline .btn {
    padding-left: 2em;
    min-width: 8em;
}
.checkbox label, .checkbox-inline label {
    text-align: left;
    padding-left: 0.5em;
}
.checkbox input[type="checkbox"]{
    float:none;
}*/
/* END: Buttons 
----------------------------------------------------------*/



/*----------------------------------------------------------*/
/* NSPDR CSS */
@font-face {
    font-family: 'OpenSans-Bold';
    src: url('res/fonts/OpenSans-Bold.eot');
    src: url('res/fonts/OpenSans-Bold.eot?#iefix') format('embedded-opentype'), url('res/fonts/OpenSans-Bold.woff') format('woff'), url('res/fonts/OpenSans-Bold.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'OpenSans-Light';
    src: url('res/fonts/OpenSans-Light.eot');
    src: url('res/fonts/OpenSans-Light.eot?#iefix') format('embedded-opentype'), url('res/fonts/OpenSans-Light.woff') format('woff'), url('res/fonts/OpenSans-Light.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'OpenSans-Regular';
    src: url('res/fonts/OpenSans-Regular.eot');
    src: url('res/fonts/OpenSans-Regular.eot?#iefix') format('embedded-opentype'), url('res/fonts/OpenSans-Regular.woff') format('woff'), url('res/fonts/OpenSans-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'OpenSans-Semibold';
    src: url('res/fonts/OpenSans-Semibold.eot');
    src: url('res/fonts/OpenSans-Semibold.eot?#iefix') format('embedded-opentype'), url('res/fonts/OpenSans-Semibold.woff') format('woff'), url('res/fonts/OpenSans-Semibold.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

html {
    /* border-box box model allows us to add padding and border to our elements without increasing their size */
    box-sizing: border-box;
}

/*
WHAT IS THIS?!
We inherit box-sizing: border-box; from our <html> selector
Apparently this is a bit better than applying box-sizing: border-box; directly to the * selector
*/
*,
*:before,
*:after {
    box-sizing: inherit;
}

.clear {
    clear: both;
}

body {
    font-family: "Arial";
    font-size: 16px;
    background-color: #faf8fc;
    margin: 0;
    padding: 0;
}

h1,
h2{
    color: #5d5d5d;
    margin: 13px 0px 4px 0px;
}
h3,
h4,
h5,
h6 {
    margin: 0 0 5px 0;
}

.hidden {
    display: none !important;
}

#loadingOverlayWrapper {
    height: 100vh;
    font-size: 10pt;
    font-weight: normal;
    margin: auto;
    padding-top: 33vh;
}

    #loadingOverlayWrapper img {
        width: 120px;
        margin-bottom: 20px;
    }

.loading-overlay {
    text-align: center;
}

.loading-progress-wrapper {
    width: 400px;
    height: 25px;
    margin: auto;
}

.loading-progress-outer {
    width: 400px;
    height: 3px;
    float: left;
    border: solid 0.5px #999988;
    margin-top: 30px;
    border-radius: 1px;
}

#loadingProgress {
    width: 25px;
    height: 2px;
    float: left;
    background-color: #aa6622;
    -webkit-transition-property: width; /* Safari */
    -webkit-transition-duration: 0.2s; /* Safari */
    transition-property: width;
    transition-duration: 0.2s;
}

#loadingStatus {
    font-size: 13px;
    float: right;
    margin-top: 4px;
    letter-spacing: 0;
}

#errorWrapper {
    height: 100vh;
    color: #ff0000;
    font-size: 10pt;
    margin: auto;
    padding-top: 33vh;
    letter-spacing: 1.5px;
    display: none;
    opacity: 0;
}

    #errorWrapper img {
        width: 120px;
        margin-bottom: 20px;
    }

#fixedNavigationWrapper {
    display: none;
    /*opacity: 0;*/
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    padding: 10px 0 5px;
    background-color: #eee;
    box-shadow: rgba(0,0,0,0.4) 0 0 1px;
    z-index: 99;
}

.fixed-nav {
    width: 70%;
    margin: auto;
    padding-right: 5px;
}

.fixed-nav-logo {
    float: left;
}

.sign-in-wrapper, .sign-in-wrapper-fixed {
    width: calc(100% - 185px);
    height: 20px;
    float: right;
    color: rgb(127,127,127);
    font-size: 9pt;
    font-weight: bold;
    padding-right: 5px;
}

#loggedInUser, #loggedInUserFixed {
    float: right;
    padding-right: 5px;
}

#signIn, #signInFixed {
    float: right;
    cursor: pointer;
}

#signOut, #signOutFixed {
    float: right;
    cursor: pointer;
}

#primaryToolsFixed {
    float: right;
    color: rgb(127,127,127);
    font-size: 9pt;
    padding-right: 5px;
    margin-top: 10px;
}

#nsdprLogoFixed {
    width: 100px;
    cursor: pointer;
}

#rdlrWrapper {
    height: auto;
    background-color: #fff;
    display: none;
    opacity: 0;
}

#nspdrWrapper {
    height: auto;
    background-color: #eee;
    display: none;
    opacity: 0;
}

#contentWrapper {
    background-color: transparent;
    display: none;
    opacity: 0;
}

#searchWrapper {
    display: none;
    opacity: 0;
}

#footerWrapper {
    height: auto;
    background-color: #7f7f7f;
    margin-top: 20px;
    display: none;
    opacity: 0;
}

.rdlr {
    width: 70%;
    margin: auto;
    padding: 10px 0 0;
}

.rdlr-logo {
    width: 50%;
    float: left;
}

.rdlr-flag {
    width: 50%;
    float: right;
    padding-top: 10px;
}

#dptLogo {
    height: 110px;
    cursor: pointer;
}

#safLogo {
    height: 80px;
    float: right;
}

.nspdr {
    width: 70%;
    height: auto;
    margin: auto;
    padding: 20px 0 !important;
}

.nspdr-space {
    background: #eee;
}

.nspdr-logo {
    float: left;
}

#nspdrLogo {
    width: 100px;
    cursor: pointer;
}

#readMore {
    float: left;
    color: #555;
    font-size: 9pt;
    cursor: pointer;
    margin: 45px 0 0 15px;
}

#readMoreContent {
    color: rgb(127,127,127);
    background-color: #e7e7e7;
    border-radius: 8px;
    font-size: 10pt;
    font-weight: normal;
    line-height: 1.5em;
    margin-top: 20px;
    padding: 10px 15px;
    text-align: justify;
    display: none;
    opacity: 0;
}

#learnMore {
    color: #fff;
    background-color: #a6a6a6;
    padding: 5px 15px;
    border-radius: 4px;
    text-decoration: none;
    font-size: 9pt;
    margin-left: 10px;
}

#primaryTools {
    float: right;
    color: rgb(127,127,127);
    font-size: 9pt;
    padding-right: 5px;
    margin-top: 10px;
}

.primary-tool {
    color: rgb(127,127,127);
    background-color: transparent;
    border: solid 1.2px rgb(166,166,166);
    text-decoration: none;
    font-weight: normal;
    float: right;
    border-radius: 2px;
    text-align: center;
    padding: 3px 10px 3px 10px;
    cursor: pointer;
    margin: 5px 0 0 10px;
}

.primary-tool-inverted {
    color: rgb(127,127,127);
    background-color: transparent;
    border: solid 1.2px rgb(170,102,34);
    text-decoration: none;
    font-weight: normal;
    float: right;
    border-radius: 2px;
    text-align: center;
    padding: 3px 10px 3px 10px;
    cursor: pointer;
    margin: 5px 0 0 10px;
}

.primary-tool i, .primary-tool-inverted i {
    float: left;
    margin-right: 10px;
}

.primary-tool div:nth-child(1), .primary-tool-inverted div:nth-child(1) {
    float: left;
    font: normal 7pt 'Font Awesome 5 Free';
    margin-top: 2px;
    padding-right: 6px;
}

.primary-tool div:nth-child(2), .primary-tool-inverted div:nth-child(2) {
    font-size: 9pt;
    float: left;
    text-transform: lowercase;
}

.content {
    width: 100%;
    margin: auto;
    display: grid;
    display: -ms-grid;
    grid-template-columns: 2fr 1fr;
    -ms-grid-columns: 2fr 1fr;
}

#mapThemes {
    color: #116633;
    border-left: solid 2px #116633;
    -ms-grid-column: 1;
    -ms-grid-row: 1;
}

#news {
    color: #999988;
    border-left: solid 2px #999988;
    margin-left: 20px;
    padding-bottom: 15px;
    -ms-grid-column: 2;
    -ms-grid-row: 1;
    -ms-grid-row-span: 3;
    grid-row-span: 3;
}

#secondaryTools {
    color: #aa6622;
    border-left: solid 2px #aa6622;
    -ms-grid-column: 1;
    -ms-grid-row: 2;
}

#contributors {
    color: #aa9955;
    border-left: solid 2px #aa9955;
    -ms-grid-column: 1;
    -ms-grid-row: 3;
}

#seeMoreNews {
    float: right;
    font-weight: normal;
    font-size: 9pt;
    cursor: pointer;
}

.search-tools {
    padding-top: 15px;
}

#searchInput {
    width: calc(100% - 290px);
    float: left;
    height: 45px;
    color: rgb(64,64,64);
    border: none;
    padding: 10px;
    font-size: 12pt;
    border-radius: 4px 0 0 4px;
    border: solid 0.75pt rgb(170,102,34);
}

input:focus {
    outline: none;
}

#searchSubmit {
    width: 140px;
    float: left;
    line-height: 45px;
    border-radius: 0 4px 4px 0;
    background-color: rgb(170,102,34);
    color: white;
    text-align: center;
    cursor: pointer;
    font-size: 10pt;
    font-weight: normal;
    text-align: center;
}

#exploreSubmit {
    width: 140px;
    float: left;
    line-height: 43px;
    border-radius: 4px;
    margin-left: 10px;
    background-color: transparent;
    color: #aa6622;
    border: solid 1.2px #aa6622;
    text-align: center;
    cursor: pointer;
    font-size: 10pt;
    font-weight: normal;
}

#dataCounter {
    padding: 20px 0 0 5px;
    font-size: 9pt;
    font-weight: normal;
    color: rgb(89,89,89);
    grid-area: data-counter;
}

#numberDatasets, #numberCustodians {
    font-weight: bold;
}

#searchOverlay {
    height: 215px;
    text-align: center;
    padding: 80px 0;
    display: none;
    opacity: 0;
}

    #searchOverlay img {
        width: 100px;
    }

    #searchOverlay div {
        color: #555;
        font-size: 10pt;
        letter-spacing: 1.5px;
        margin-top: 10px;
    }

div {
    /*-webkit-touch-callout: none;*/ /* iOS Safari */
    /*-webkit-user-select: none;*/ /* Safari */
    /*-khtml-user-select: none;*/ /* Konqueror HTML */
    /*-moz-user-select: none;*/ /* Firefox */
    /*-ms-user-select: none;*/ /* Internet Explorer/Edge */
    /*user-select: none;*/ /* Non-prefixed version, currently */
}

.caret_down:before {
    font: normal 8pt 'Font Awesome 5 Free';
    content: "\f0d7";
}

.card {
    border-radius: 0 8px 8px 0;
    box-shadow: 0 0 5px rgba(191,191,191,0.4);
    background-color: #fff;
    margin-top: 20px;
}

.card-header {
    font-weight: bold;
    font-size: 9pt;
    padding: 10px;
    margin: 0 10px;
    border-bottom: solid 0.5pt rgb(217,217,217);
    line-height: 24px
}

#mapthemeContent,
#secondaryToolsContent {
    padding: 0 20px 20px 0;
}

#contributorsContent {
    max-height: 300px;
    overflow-y: auto;
    padding-bottom: 20px;
}

.card-button {
    float: left;
    width: 100px;
    margin: 20px 0 0 20px;
    border-radius: 4px;
    cursor: pointer;
    position: relative;
    transition: all .1s ease-in-out;
}

    .card-button:hover {
        transform: scale(1.2);
    }

        .card-button:hover i, .card-button:hover img, .card-button:hover div {
            opacity: 0;
        }

.summary-wrapper {
    font-family: 'Arial' !important;
    position: absolute;
    top: 0;
    bottom: 0;
    height: 100%;
    display: none;
}

.card-summary {
    position: relative;
    font-size: 7pt !important;
    font-family: 'Arial' !important;
    text-align: center;
    line-height: 8pt !important;
    padding: 5px;
    margin: auto !important;
    opacity: 1 !important;
    align-self: center;
}

.card-button:hover .summary-wrapper {
    display: grid;
    display: -ms-grid;
    opacity: 1 !important;
    vertical-align: middle;
    align-self: center;
}

#mapThemeContent div.card-summary {
    color: #116633 !important;
}

#secondaryToolsContent div.card-summary {
    color: #aa6622 !important;
}

.card-button-green {
    border: solid 1pt rgba(17,102,51,0.75);
    color: rgb(17,102,51);
}

    .card-button-green:hover {
        border: solid 1pt rgba(17,102,51,1);
    }

.card-button-orange {
    border: solid 1pt rgba(170,102,34,0.75);
    color: rgb(170,102,34);
}

    .card-button-orange:hover {
        border: solid 1pt rgba(170,102,34,1);
    }

.card-button div:nth-child(1) {
    margin-top: 10px;
    font-size: 30pt;
    font-family: 'Font Awesome\ 5 Free';
    display: block;
    text-align: center;
    line-height: 60px;
}

.card-button div:nth-child(2) {
    font-size: 8pt;
    height: 25px;
    margin-bottom: 10px;
    text-align: center;
    text-transform: lowercase;
}

.card-button img {
    width: 48px;
}

.news {
    padding: 10px 10px 0;
    margin-left: 10px;
}

#newsContent {
    padding-right: 10px;
}

.news-title {
    font-size: 10pt;
    font-weight: bold;
    color: #777;
}

.news-author-date {
    margin-top: 3px;
    font-size: 9pt;
    font-weight: 500;
    color: rgb(191,191,191);
    line-height: 25px;
}

.news-author {
    width: 50%;
    display: inline-block;
}

.news-date {
    width: 50%;
    display: inline-block;
    text-align: right;
}

.news-content {
    font-size: 9pt;
    color: #555;
    line-height: 20px;
    margin-top: 5px;
    padding-bottom: 10px;
    border-bottom: solid 0.5pt rgb(217,217,217);
}

.news div:nth-child(4) {
    margin: 20px 5px 0px 0px;
    border-top: solid 0.5pt rgba(217,217,217,0.75)
}

.contributor {
    float: left;
    margin: 20px 0 0 20px;
    cursor: pointer;
}

    .contributor img {
        -webkit-filter: grayscale(100%);
        filter: grayscale(100%);
        opacity: 0.5;
        margin: auto;
    }

        .contributor img:hover {
            -webkit-filter: grayscale(0%);
            filter: grayscale(0%);
            opacity: 1;
        }

#contributorsSummaries {
    max-height: 300px;
    overflow-y: auto;
}

.contributor-summary {
    color: #555;
    font-size: 9pt;
    padding: 20px;
    display: none;
    opacity: 0;
}

.summary-img {
}

.summary-website {
    color: inherit;
    margin-left: 50px;
}

.summary-close {
    color: #777;
    float: right;
    cursor: pointer;
}

.summary-content {
    padding: 20px 0 0;
    line-height: 25px;
    text-align: justify;
}

.search {
    width: 70%;
    margin: auto;
}

#searchFilters {
    width: 25%;
    float: left;
    color: #999988;
    border-left: solid 2px #999988;
}

.filters {
    padding: 15px;
}

#dataTypeSelected,
#categorySelected,
#themeSelected,
#sourceSelected,
#regionSelected {
    padding: 3px 0 10px;
}

.filter-tag {
    color: #555;
    background-color: #f0f0ed;
    font-size: 9pt;
    font-weight: normal;
    display: inline-block;
    padding: 4px 10px;
    margin: 7px 7px 0 0;
    border-radius: 2px;
}

    .filter-tag i {
        color: #888;
        margin-top: 2px;
        margin-left: 7px;
        cursor: pointer;
    }

.filters-footer {
    height: 30px;
    padding-top: 12px;
    border-top: solid 0.5pt rgb(217,217,217);
}

#resetFilter {
    color: #116633;
    font-size: 10pt;
    float: left;
    display: inline-block;
    padding: 2px 0 0 2px;
    cursor: pointer;
}

#applyFilter {
    color: #fff;
    font-size: 10pt;
    background-color: #999988;
    float: right;
    border-radius: 15px;
    padding: 3px 15px;
    text-align: center;
    cursor: pointer;
}

#searchResultsWrapper {
    width: calc(75% - 20px);
    min-height: 215px;
    float: right;
    margin-left: 20px;
    color: #116633;
    border-left: solid 2px #116633;
}

#resultsHeaderTitle {
    display: inline-block;
    margin-right: 20px;
}

#numberOfResults {
    color: #777;
    font-size: 9pt;
    font-weight: normal;
    display: inline-block;
    margin-right: 20px;
}

#searchPagingTop {
    color: #777;
    font-size: 9pt;
    font-weight: normal;
    display: inline-block;
    visibility: hidden;
}

    #searchPagingTop i, #searchPagingBottom i {
        font-size: 10pt;
        cursor: pointer;
    }

#topLeft, #bottomLeft {
    padding: 5px;
    visibility: hidden;
}

#topRight, #bottomRight {
    padding: 5px;
}

#resultsFooter {
    padding: 0 20px 15px 20px;
}

#searchPagingBottom {
    color: #777;
    font-size: 9pt;
    font-weight: normal;
    text-align: center;
    visibility: hidden;
}

#pageNumbersTop, #pageNumbersBottom {
    display: inline-block;
}

.page-number {
    width: 23px;
    text-align: center;
    display: inline-block;
    cursor: pointer;
}

.page-number-current {
    color: #666;
    width: 23px;
    text-align: center;
    display: inline-block;
    font-weight: bold;
}

#pagingTopPreviousPage, #pagingBottomPreviousPage {
    padding-right: 5px;
}

#pagingTopNextPage, #pagingBottomNextPage {
    padding-left: 5px;
}

#sortByWrapper {
    /*width: 160px;*/
    float: right;
}

#sortBy {
    color: #888;
}

.sort-by-label {
    width: 70px;
    color: #777;
    font-size: 9pt;
    font-weight: normal;
    display: inline-block;
    /*padding-right: 20px;*/
    text-align: right;
}

.sort-by {
    color: #777;
    font-size: 9pt;
    font-weight: normal;
    float: right;
    margin-left: 15px;
    cursor: pointer;
}

    .sort-by i {
        font-size: 10pt;
        padding-left: 2px;
        visibility: hidden;
    }

    .sort-by.active i {
        visibility: visible;
    }

#sortBySelect {
    width: 90px;
    color: #777;
    background-color: #f7f7f7;
    font-size: 9pt;
    font-weight: normal;
    padding: 3px 5px;
    border-radius: 2px;
    float: right;
}

    #sortBySelect option:hover {
        color: #777;
        background-color: #f7f7f7;
    }

#searchResults {
    padding: 20px 20px 0 20px;
}

.result-wrapper {
    font-weight: normal;
    margin-bottom: 15px;
    border-bottom: solid 0.5pt rgb(217,217,217);
}

    .result-wrapper .title {
        font-size: 12pt;
        color: rgb(17,102,51);
        float: left;
        line-height: 25px;
    }

    .result-wrapper .long-title {
        float: none;
        font-size: 12pt;
        color: rgb(17,102,51);
        line-height: 25px;
    }

    .result-wrapper .action-btn {
        width: 100px;
        font-size: 9pt;
        color: #116633;
        background-color: #d9e6de;
        border-radius: 12px;
        float: right;
        text-align: center;
        margin-left: 10px;
        padding: 5px 0;
        cursor: pointer;
        text-decoration: none;
    }

    .result-wrapper .download-wrapper {
        display: none;
        font-size: 9pt;
        color: #116633;
        background-color: #d9e6de;
        border-radius: 12px;
        float: right;
        text-align: center;
        margin-left: 10px;
        padding: 5px 10px;
        cursor: pointer;
        text-decoration: none;
    }

        .result-wrapper .download-wrapper .download-btn {
            padding: 10px;
        }

        .result-wrapper .download-wrapper .download-size {
            margin-top: 5px;
            padding: 0 10px;
            border-left: solid 1px #116633;
        }

        .result-wrapper .download-wrapper .download-type {
            margin-top: 5px;
            padding: 0 10px;
            border-left: solid 1px #116633;
        }

    .result-wrapper .source {
        font-size: 9pt;
        color: #777;
        padding: 8px 0;
    }

    .result-wrapper .description {
        font-size: 9pt;
        color: #777;
        padding: 8px 0;
        line-height: 12pt;
    }

    .result-wrapper .result-footer {
        width: 150px;
        font-size: 8pt;
        font-weight: normal;
        color: #999;
        float: left;
        padding: 8px 0 20px 0;
        line-height: 20px;
    }

        .result-wrapper .result-footer i {
            font-size: 9pt;
            margin-right: 8px;
        }

#noRecordsFound {
    height: 195px;
    color: #999988;
    font-size: 9pt;
}

.icon_upload {
    content: "\70";
}

.footer {
    width: 70%;
    margin: auto;
    color: #fff;
    padding: 20px 0 !important;
}

.footer-space {
    background-color: #7f7f7f;
}

#footerContent {
    display: grid;
    display: -ms-grid;
    grid-template-columns: 295px 1fr 1fr 1fr 1fr;
    -ms-grid-columns: 295px 1fr 1fr 1fr 1fr;
}

#footerLogo {
    width: 295px;
    height: 110px;
    -ms-grid-row: 1;
    -ms-grid-column: 1;
}

.footer-menu-header {
    text-transform: uppercase;
    font-size: 10pt;
    font-weight: bold;
}

#footerData {
    padding-left: 20px;
    -ms-grid-row: 1;
    -ms-grid-column: 2;
}

#footerTools {
    padding-left: 20px;
    -ms-grid-row: 1;
    -ms-grid-column: 3;
}

#footerLinks {
    padding-left: 20px;
    -ms-grid-row: 1;
    -ms-grid-column: 4;
}

#footerAbout {
    padding-left: 20px;
    -ms-grid-row: 1;
    -ms-grid-column: 5;
}

#footerDataList,
#footerToolsList,
#footerLinksList,
#footerAboutList {
    font-size: 9pt;
    padding-left: 0;
    list-style-type: none;
    line-height: 25px;
    cursor: pointer
}

    #footerDataList li a,
    #footerToolsList li a,
    #footerLinksList li a,
    #footerAboutList li a {
        color: white;
        text-decoration: none;
    }

        #footerDataList li a:hover,
        #footerToolsList li a:hover,
        #footerLinksList li a:hover,
        #footerAboutList li a:hover {
            color: white;
        }

#footerSocialWrapper {
    padding-top: 10px;
}

#footerSocial {
    padding-left: 1px;
}

.social-icon {
    float: left;
    margin-right: 10px;
    font: normal 20pt 'Font Awesome 5 Free';
    cursor: pointer;
}

    .social-icon i {
        color: #fff;
    }

#copyright {
    font-size: 9pt;
    font-weight: normal;
    padding: 10px 0 0 18px;
}

/**********MEDIA QUERIES************/
@media screen and (max-width: 1600px) {
    .fixed-nav {
        width: 80%;
    }

    .rdlr {
        width: 80%;
    }

    .nspdr {
        width: 80%;
    }

    .content {
        width: 80%;
    }

    .search {
        width: 80%;
    }

    .footer {
        width: 80%;
    }
}

@media screen and (max-width: 1366px) {
    .fixed-nav {
        width: 95%;
    }

    .rdlr {
        width: 95%;
    }

    .nspdr {
        width: 95%;
    }

    .content {
        width: 95%;
    }

    .search {
        width: 95%;
    }

    .footer {
        width: 95%;
    }
}

@media screen and (max-width: 1024px) {
    .content {
        grid-template-columns: 1fr;
        -ms-grid-columns: 1fr;
    }

    #mapThemes {
        -ms-grid-column: 1;
        -ms-grid-row: 1;
    }

    #secondaryTools {
        -ms-grid-column: 1;
        -ms-grid-row: 2;
    }

    #contributors {
        -ms-grid-column: 1;
        -ms-grid-row: 3;
    }

    #news {
        margin-left: 0;
        grid-row-start: 4;
        -ms-grid-column: 1;
        -ms-grid-row: 4;
    }

    #searchFilters {
        width: 100%;
        float: none;
    }

    #searchResultsWrapper {
        width: 100%;
        float: none;
        margin-left: 0;
    }

    #footerContent {
        grid-template-columns: 295px 1fr 1fr;
        -ms-grid-columns: 295px 1fr 1fr;
    }

    #footerLogo {
        -ms-grid-row-span: 2;
        grid-row-span: 2;
    }

    #footerData {
        -ms-grid-row: 1;
        -ms-grid-column: 2;
    }

    #footerTools {
        -ms-grid-row: 1;
        -ms-grid-column: 3;
    }

    #footerLinks {
        -ms-grid-row: 2;
        -ms-grid-column: 2;
    }

    #footerAbout {
        -ms-grid-row: 2;
        -ms-grid-column: 3;
    }
}
/**********END MEDIA QUERIES************/