/*********************************************************************************/
/*Name and Place*/
/*********************************************************************************/

@font-face { font-family: "GlyphiconsHalflingsRegular"; src: url("/library/fonts/GlyphiconsHalflings/Regular.otf") format("opentype"); }
@font-face { font-family: PoppinsRegular; src: url(/library/fonts/Poppins/Regular.otf) format("opentype"); }
@font-face { font-family: PoppinsMedium; src: url(/library/fonts/Poppins/Medium.otf) format("opentype"); }


:root {
    --bluenp: #009f93;
    --greynp: #f6f3f0;
    --dgreynp: #F6F6F6;
    --lgrey: #ebe8e7;
    --input: #b3b3b3;
    --border: #cacaca;
}

/* Tables */

.np_nameandplace table, .dbase_table table, .nameandplace table { width: 100%; margin-top: 30px;  }
.np_nameandplace table td a, .dbase_table table td a, .nameandplace table td a {color: black;font-family: PoppinsRegular;font-weight: normal;}
.np_nameandplace table td, .dbase_table table td, .nameandplace table td {color: black;font-family: PoppinsRegular;font-size: 80%;}
.np_nameandplace table th, .dbase_table table th, .nameandplace table th {background-color: var(--dgreynp);padding: 10px;font-family: PoppinsRegular;border-bottom: 1px solid var(--border);font-size: 
80%;}
.np_nameandplace table th:nth-child(2) { width: 400px;}
.np_nameandplace table tbody tr:nth-child(odd), .dbase_table table tbody tr:nth-child(odd), .nameandplace table tbody tr:nth-child(odd) { background-color: var(--lgrey); }
.np_nameandplace table tbody tr:hover, .dbase_table table tbody tr:hover, .nameandplace table tbody tr:hover { background-color: var(--input);}
.np_nameandplace table tbody tr td, .dbase_table table tbody tr td, .nameandplace table tbody tr td { padding: 15px 10px; }
.dataTables_processing { background-color: var(--border); margin: 0px 0px; text-align: center; font-size: 110%; font-family: PoppinsMedium; padding: 5px 0px;  }
.np_nameandplace .toplinks, .nameandplace .toplinks {display: flex; gap: 20px;flex-wrap: wrap;}
.nameandplace .toplinks a, .np_nameandplace .toplinks a { display: block; width: fit-content; margin-top: 10px; }
.np_nameandplace button, .nameandplace button,.np_nameandplace .button, .nameandplace .button, .nameandplace .toplinks a, .np_nameandplace .toplinks a, .np_nameandplace input[type=submit] {font-family: PoppinsMedium;text-decoration: none;cursor: pointer;transition: all .3s ease-in-out;background-color: var(--bluenp);border: none;padding: 5px 15px;border-radius: 20px;color: white;text-transform: capitalize;font-size: 90%;position: relative;top: 0px;}
.nameandplace .toplinks a{padding: 7px 15px;}
.nameandplace button[type=submit]{width: auto; font-weight: normal; letter-spacing: 0px;}
.nameandplace button[type=submit]:hover{background-color:var(--bluenp);}
.np_nameandplace button:hover, .nameandplace button:hover,.np_nameandplace .button:hover, .nameandplace .button:hover, .nameandplace .toplinks a:hover, .np_nameandplace .toplinks a:hover, .np_nameandplace input[type=submit]:hover { top: -5px; background-color: var(--bluenp); }
.nameandplace .back, .nameandplace .toplinks a, .np_nameandplace .toplinks a {margin-bottom: 30px;}
.dataTables_length { float: right; }
.dataTables_length select { border: 1px solid black; width: 70px; padding: 3px 0px 5px 5px; height: 30px; font-size: 90%; margin: 0px 0px 30px 0px; }
.dataTables_filter input[type=search] { margin-left: 10px; height: 30px; border-radius: 7px;  }
table.dataTable thead .sorting,table.dataTable thead .sorting_asc,table.dataTable thead .sorting_desc,table.dataTable thead .sorting_asc_disabled,table.dataTable thead .sorting_desc_disabled { cursor: 
pointer; position: relative;}
table.dataTable thead .sorting, table.dataTable thead .sorting_asc, table.dataTable thead .sorting_desc{min-width: 100px;}
table.dataTable thead .sorting_asc:after { content: "\e155"; }
table.dataTable thead .sorting_desc:after { content: "\e156"; }
table.dataTable thead .sorting:after { opacity: 0.2; content: "\e150" ; } 
table.dataTable thead .sorting:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc_disabled:after, table.dataTable thead 
.sorting_desc_disabled:after { position: absolute; bottom: 8px;right: 8px; display: block; font-family: GlyphiconsHalflingsRegular; opacity: 0.5;}

.nameandplace input[type=text], .np_nameandplace input[type=text], .nameandplace input[type=number], .np_nameandplace input[type=number],.nameandplace .formbuilder select {border: 1.5px solid lightgrey;margin: 10px 0px;height: 40px;width: 100%;border-radius: 5px;}
.nameandplace .label, .np_nameandplace .label { padding: 0px; }
.nameandplace button { margin-top: 10px;  }



/* Name search */

.nameandplace fieldset{max-width: none;}
.np_namesearch form {background-color: var(--lgrey);padding: 20px;}
.np_namesearch form .formbuilder {  margin: 0px auto; }
.np_namesearch input[type=text], .np_namesearch form select, .np_namesearch input[type=number] {max-width: 100%;width: 100%;background-color: white;}
.nameandplace input[type="radio"] { border: 1px solid var(--bluenp); background-color: white; }
.nameandplace input[type="radio"]:checked::before { background-color: var(--bluenp); }
.np_namesearch .field_group .form-group .label, .np_namesearch .field_radio .label { display: none; }
.np_namesearch .field_group {display: flex;flex-wrap: wrap;align-items: center;/* gap: 10px; */}
.np_namesearch .field_group>.input {display: flex;justify-content: center;flex-wrap: wrap;gap: 90px;align-items: center;}
.np_namesearch .field_radio .input>div { display: flex; flex-wrap: wrap;  gap: 10px; }
.np_namesearch .field_radio .input>div label { color: black; font-family: PoppinsRegular; font-size: 80%; }
.np_memberinterests h2 { display: none; }
.np_namesearch .label {font-size: 120%; font-weight: normal;}
.np_namesearch .source h5 { padding-top: 20px; font-size: 90%; font-family: PoppinsRegular; color: var(--bluenp); }
.np_namesearch .field_text .input input {width: 100%;}
@media ( max-width: 1120px )
{
  .np_namesearch .field_group>.input {gap: 20px;}
}
@media ( min-width: 801px )
{
  .np_namesearch .field_text .input, .np_namesearch .field_number .input, .np_namesearch .field_select .input {width: 270px; }
  .np_namesearch .label {width: 200px; }
}
@media ( max-width: 800px )
{
  .np_namesearch .field_group { justify-content: center; flex-direction: column; text-align: center; padding-bottom: 30px; }
}
@media ( max-width: 770px )
{
  .np_nameandplace .toplinks, .nameandplace .toplinks { flex-direction: column;  gap: 0px;}
  .np_nameandplace .toplinks li a, .nameandplace .toplinks li a, .nameandplace .toplinks li.back button {/* width: 200px; */text-align: center;margin: 0px 0px 20px 0px;}
  .nameandplace .toplinks li.back { margin: 20px 0px 20px 0px; }
  .nameandplace .toplinks li.back button { margin: 0px;}
}

@media ( max-width: 700px ){
    .np_namesearch .field_group>.input{gap:5px; max-width: 500px;}
    .np_namesearch .field_radio .input>div{ justify-content: center;}
    .nameandplace .dataTables_wrapper { overflow-x: scroll;}
    .dataTables_length {float: left;}
}

.results {padding-top: 20px;}
.nameandplace .dataTables_paginate, .np_nameandplace .dataTables_paginate { float: right; width: 50%; text-align: right; padding-top: 30px; font-size: 90%; }
.np_nameandplace .dataTables_paginate .paginate_button, .nameandplace .dataTables_paginate .paginate_button { padding: 0px 5px; color: black;  }
.np_nameandplace label, .nameandplace label { color: var(--bluenp); font-family: PoppinsMedium; }
.nameandplace .dataTables_paginate a, .np_nameandplace .dataTables_paginate a { cursor: pointer; }
.nameandplace .dataTables_paginate a.disabled, .np_nameandplace .dataTables_paginate a.disabled { cursor: default; }
.np_nameandplace .dataTables_info, .nameandplace .dataTables_info { float: left; width: 50%; padding-top: 30px; font-size: 90%; }
.np_namesearch .dataTables_length {margin-top: 40px;}
.nameandplace .breadcrumb a, .np_nameandplace .breadcrumb a { color: black; font-family: PoppinsRegular; font-size: 90%;}



/* Source browser */

.np_sourcebrowser h3 { padding: 30px 0px 10px 0px; }
.np_sourcebrowser h4, .nameandplace .relatednames h4, .np_nameandplace .relatednames h4, .np_namesearch h4 { padding-bottom: 30px; }
.nameandplace .relatedmedia h4, .np_nameandplace .relatedmedia h4 { padding: 70px 0px 30px 0px; }
.nameandplace .relatedmedia ul, .np_nameandplace .relatedmedia ul { display: flex; justify-content: space-evenly; flex-wrap: wrap; gap: 20px; }
.nameandplace .relatedmedia ul li, .np_nameandplace .relatedmedia ul li { max-width: 250px; box-shadow: 0 0 2px black; margin-bottom: 20px; padding: 20px !important; box-sizing: border-box; transition: 
all .3s ease-in-out; text-align: center; font-size: 15px ; }
.nameandplace .relatedmedia ul li:hover, .np_nameandplace .relatedmedia ul li:hover { background-color: var(--border);}
.nameandplace .relatedmedia ul li img, .np_nameandplace .relatedmedia ul li img { width: 200px; margin: 0px auto; display: block; }
.np_sourcebrowser .additional, .np_sourcebrowser .related {background-color: var(--greynp);padding: 10px;}
.np_sourcebrowser .relatednames table { background-color: white; padding: 20px 10px;}
.np_sourcebrowser .relatednames table td, .np_sourcebrowser table.additional td { background-color: white; border-bottom: 1px solid var(--border)}
.np_sourcebrowser .relatednames input[type=search] { background: white; }
.nameandplace h3, .nameandplace h4, .np_nameandplace h3, .np_nameandplace h4 { color: var(--bluenp); font-family: PoppinsRegular; font-size: 120%; }
.np_sourcebrowser .relatednames table { margin: 0px; padding: 0px 0px 30px 0px; }
.np_sourcebrowser .sourcehome .dataTables_filter,.np_sourcebrowser .sourcehome .dataTables_length { display: none; }
.np_sourcebrowser .related.relatednames ul { background-color: white; }
.np_sourcebrowser .related ul li th, .np_sourcebrowser .related ul li td { width: 50%; }
.np_sourcebrowser .content { background-color: var(--greynp); display: flex; flex-wrap: wrap; gap: 50px; padding: 20px;}
.np_sourcebrowser .content .leftcolumn img { width: 200px; border: 1px solid var(--footer);  }
.np_sourcebrowser .content .additional, .np_sourcebrowser .content .related {width: 100%;background-color: white;padding: 20px;}
.np_sourcebrowser .content .rightcolumn .related ul { padding-top: 20px; }
.np_sourcebrowser .content .related li{ list-style-type: none !important; }
.np_sourcebrowser .content .rightcolumn .additional, .np_sourcebrowser .content .rightcolumn .related table { margin: 0px; padding: 0px; }
.np_sourcebrowser .content .rightcolumn .additional, .np_sourcebrowser .content .rightcolumn .related { background: none; padding: 0px; margin: 0px;}
.np_sourcebrowser .content .rightcolumn .related ul li { padding-bottom: 40px;}
.np_sourcebrowser .content .rightcolumn .related ul li:last-of-type { padding: 0px;}
.np_sourcebrowser .content .rightcolumn .additional, .np_sourcebrowser .content .rightcolumn .related td { border-bottom: 1px solid var(--border) }
.np_sourcebrowser .content .rightcolumn table tbody tr:nth-child(odd) { background: none; }
.np_sourcebrowser .content .related h5 {color: var(--bluenp);font-family: PoppinsRegular;padding-bottom: 10px;font-size: 90%;}
.np_sourcebrowser h3 { padding-bottom: 20px; font-size: 140%;  }
@media ( max-width: 1270px ){
  .np_sourcebrowser .content { gap:20px}
  .np_sourcebrowser .content .rightcolumn {width: 100%;}
}
@media ( max-width: 500px ){
  .np_sourcebrowser .content {justify-content: center;}
}


/* Surname interests */

.np_memberinterests{margin: 40px auto;}
.np_nameandplace .contact form { max-width: 800px; padding: 20px; margin: 0px auto; }
.np_nameandplace .contact .field_readonly { display: flex; justify-content: center; }
.np_memberinterests .contact .formbuilder .field_readonly .label { background: var(--bluenp);  width: 100%; padding: 13px 10px 0px 10px; text-align: center; color: white; font-weight: bold; }
.np_memberinterests .contact .formbuilder .field_readonly .input { border: solid 3px var(--bluenp);width: 100%; padding: 10px; text-align: center; }
.np_nameandplace .contact form textarea { width: 100%; }
.np_memberinterests .contact .formbuilder .label, .np_memberinterests .contact .formbuilder .input { margin: 15px 0px; }
.np_memberinterests .field_readonly label {color: white;}
.np_memberinterests .field_textarea label { color: var(--bluenp); }
.np_memberinterests .add { padding-top: 20px; }
.np_memberinterests .add .field_text { display: flex; align-items: center; justify-content: center; margin: 0px auto; gap: 20px; }
.np_memberinterests .add .field_text .label { width: 150px; }
.np_memberinterests .add .field_text label{font-size: 16px;}
.np_memberinterests .add .input{max-width: 300px; width: 100%;}

.np_memberinterests .add .buttons { padding-top: 20px; display: flex; align-items: center; justify-content: center; gap:20px}
.np_memberinterests .add .buttons a.button {padding: 7px 15px; }

@media ( max-width: 500px )
{
  .np_nameandplace .contact .field_readonly { flex-direction: column; }
  .np_memberinterests .contact .formbuilder .field_readonly .label { padding: 10px; }
  .np_memberinterests .add .field_text {max-width: 100%; display: block; }
}


/* Search form */

.np_searchform { width: 100%; margin: 80px auto;}
.np_searchform .form {padding: 30px 20px;background-color: var(--lgrey);}
.np_searchform fieldset {display: flex;justify-content: center;align-items: center;gap:30px;}
.np_searchform .formbuilder {display: flex;justify-content: center;flex: 90%;gap:20px;}
.np_searchform .formbuilder .field{width: 100%;}
.np_searchform label { display: none;}
.np_searchform input[type=text] { height: 40px; width: 100%; border: none; background: white; padding: 10px; }
.np_searchform input[type=submit] {width: 150px; margin: 0;}

@media ( max-width: 700px ){
  .np_searchform fieldset {flex-direction: column; align-items: normal; }
  .np_searchform .formbuilder{flex-direction: column; gap:10px;}
}