/* NightLight Template CSS and Overrides
 *
 * Color Palette:
 *
 * #252525 - Grey-black: Background (default), header and footer background
 *           
 * #3E3B3B - Brown-grey: Content/detail background
 *
 * #FFFFFB - Warm white (default): Text (just about everywhere), site title (1)
 *
 * #E8C600 - Bright yellow-green: Site title (2), section titles (nav, feat, meta),
 *           link hover (nav, meta), main menu links (hover), tab  background (active),
 *           tab text (hover)
 *
 * #DBDBDB - Grey: Site title (3), feature hrule, ...
 */

/** Fonts used in this template: **/

@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@300;400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@400;500;700&display=swap');

/***********************************************************************
 ****** BEGIN: NightLight TNG Overrides                         ********
 ***********************************************************************/

/** Primary typeface/font-size overrides: **/ 

.normal {
  font-family: 'Raleway', sans-serif;
  font-weight: 400;
  font-size: 13pt;
}

.indleftcol {
  font-family: inherit;
  font-size: inherit;
}

.smfieldname, .whiteheader, .subhead, .pboxname, .pboxdates, 
.pboxpopup, .whitesubhead, .smaller, #loadingdiv, #sscontrols, 
.subheadbold, .largeheader {
  font-family: 'Raleway', sans-serif;
  font-size: 11pt;
}

.smallest {
  font-family: 'Raleway', sans-serif;
  font-size: 10pt;
}

/** Hyperlink display overrides **/

a:link, a:visited {
  color: #FFFFFB;
  border-bottom: none;
  text-decoration: none;
}

a:hover {
  color: #E8C600;
  border-bottom: none;
  text-decoration: none;
}

/** Overrides just for hyperlinks embedded in paragraphs **/

p a:link, p a:visited {
  border-bottom: 1px dotted;
}

p a:hover {
  border-bottom: none;
}

/** Surname Cloud overrides: **/

.surnames-cloud {
  font-family: inherit;
  font-size: inherit;
  text-align: left;
}

.surnames-cloud a.size1 { font-size: 180%; }
.surnames-cloud a.size2 { font-size: 160%; }
.surnames-cloud a.size3 { font-size: 140%; }
.surnames-cloud a.size4 { font-size: 140%; }
.surnames-cloud a.size5 { font-size: 120%; }
.surnames-cloud a.size6 { font-size: 120%; }
.surnames-cloud a.size7 { font-size: 100%; }
.surnames-cloud a.size8 { font-size: 100%; }
.surnames-cloud a.size9 { font-size: 80%; }
.surnames-cloud a.size0 { font-size: 80%; }

/** Overrides for the TNG main menu media directives **/

/*  Don't want 'Home' or 'Search' to be hidden  */
@media (max-width: 1100px) {
  #home-smicon, #search-smicon {
    display: flex;
  }
}

/*  Same with 'Print', 'Share', and 'Bookmark'  */
@media (max-width: 660px) {
	#share-smicon, #print-smicon, #bmk-smicon {
		display: flex;
	}
}

/** Header overrides **/

.header {
  margin-top: 0px;
  padding: 0px;
  font-size: 125%;
  color: #E8C600;
  line-height: revert;
}

/** Surpress sprites in tabs and icons in main menu **/

.tngsmallicon {
	background: none;
	padding: 0;
}

.tngsmallicon3 {
	background: none;
	padding: 0;
}

.headericon, .menu-icon {
	display: none;
}

/** Search overrides **/

.searchtext {
  font-size: 11px;
  color: #252525;
  text-align: right;
  vertical-align: top;
  padding-right: 5px;
}

.subsearch {
  color: #E8C600;
}

.slidedown {
  background: none repeat scroll 0 0 #252525;
  color: #FFFFFB;
  border: 2px solid #E8C600
}

/** Login pane overrides **/

.LB_window {
  background: #252525;
  color:#FFFFFB;
  border: 2px solid #E8C600
}

.LB_closeAjaxWindow, .bar, .sideback {
  background-color : #252525;
}

/** Photo tables **/

.indexphoto {
    border: 0;
}

.indexphototable {
    padding-right: 4px;
}

/** Data and field overrides **/

.whiteback {
  border-collapse: collapse;
  background-color: #3E3B3B;
  border: 1px dotted #E8C600;
}

/* Detail pages tabs/inner-menu overrides */

#pub-innermenu {
  margin: 0px;
  clear: both;
  padding: 3px 7px;
  border: 1px solid #E8C600;
}

/* Links and highlights */
a.lightlink3:link, a.lightlink3:visited, a.lightlink3:hover, a.lightlink3:active {
  color: #E8C600;
  text-decoration: none;
}

.lightlink:link, .lightlink:visited {
  color: #FFFFFB;
  text-decoration: none;
}

td.highlightedchild {
  background: #E8C600;
  color: #3E3B3B;
}

/* fieldname: regular text within column or row title sections */

.fieldname { /* override not needed in NightLight */ }

/* fieldnameback: background color for column and row title sections */
.fieldnameback {
  background-color: #3E3B3B;
  border: 1px solid #E8C600;
  padding: 3px 7px;
}

/* databack: background color for data areas */
.databack {
  background-color: #3E3B3B;
  border: 1px dotted #E8C600;
  padding: 3px 7px;
}

/* sideback: background color for side and top frames */
.sideback {
  background-image: url(../img/admin_bg.gif);
}

/* fieldnameback: background color for column and row title sections */
/* sideback: background color for side and top frames */
.bar, .sideback {
  background-color : #252525;
}

/** TNG14+: New table overrides to correct new shadow box **/

.tfixed, .thfixed, .dna-tfixed {
  border-radius: 0px;
  box-shadow: none;
}

.tfixed tr:first-child td:first-child, .thfixed tr:first-child th:first-child, .rc-ul {
  border-top-left-radius: 4px;
}

/** TNG14+: New field overrides to correct overzealous corner rounding */
.tfixed tr:last-child td:first-child, .thfixed tr:last-child td:first-child, .rc-ll { border-bottom-left-radius: 4px; }
.tfixed tr:last-child td:last-child, .thfixed tr:last-child td:last-child, .dna-tfixed tr:last-child td:last-child, .rc-lr { border-bottom-right-radius: 4px; }
.tfixed tr:first-child td:first-child, .thfixed tr:first-child th:first-child, .rc-ul { border-top-left-radius: 4px; }
.tfixed tr:first-child td:last-child, .thfixed tr:first-child th:last-child, .dna-tfixed tr:first-child td:last-child { border-top-right-radius: 4px; }

.rounded-table tr:last-child td:first-child, .rounded-table tr:last-child td:first-child { border-bottom-left-radius: 4px; }
.rounded-table tr:last-child td:last-child, .rounded-table tr:last-child td:last-child { border-bottom-right-radius: 4px; }
.rounded-table tr:first-child td:first-child, .rounded-table tr:first-child th:first-child { border-top-left-radius: 4px; }
.rounded-table tr:first-child td:last-child, .rounded-table tr:first-child th:last-child { border-top-right-radius: 4px; }

/** Supporting links in page/next/prev lists  **/

.snlink {
  background-color:#fff;
  border-top: none;
  border-right: 1px solid #DBDBDB !important;
  border-left: none;
  border-bottom: 1px solid #DBDBDB !important;
}

a.snlink {
  color: #3E3B3B;
  background-color:#DBDBDB;
  border-top: none;
  border-right: 1px solid #DBDBDB !important;
  border-left: none;
  border-bottom: 1px solid #DBDBDB !important;
}

a.snlink:hover, .snlinkact, .adminnav .snlinkact {
  background-color:#E8C600;
  color: #252525;
  border-top: none;
  border-right: 1px solid #DBDBDB !important;
  border-left: none;
  border-bottom: 1px solid #DBDBDB !important;
}

/** Ancestor/Descendant/Family Chart boxes **/

.pedbox {
  border: 1px solid #E8C600 !important;
  box-shadow: none !important;
  background-color: #3E3B3B !important;
}

.lefttop, .pboxname {
  background-color: #3E3B3B;
}

.titlebox {
  background-color: #3E3B3B;
  border: 1px solid #E8C600;
}

.popup {
  -webkit-border-radius: 10px;
  border-radius: 10px;
  box-shadow: none;
  background-color: #252525;
}

.popinner {
  background-color: #3E3B3B;
  border: 1px solid #E8C600;
}

.pboxpopupdiv {
  border: none;
  background-color: #3E3B3B;
}

#vcontainer div.box div.inner {
  border: 1px solid #E8C600;
  border-radius: 10px;
  box-shadow: none;
}

.fambackground {
  background-color: #252525;
}

.fambox, .mfambox {
  background-color: #3E3B3B;
  border: 1px solid #E8C600;
  box-shadow: none !important;
}

.hiddenbox {
  border: none;
  background-color: #252525;
}

/** Vertical Chart connectors **/

#vcontainer div.mother, #vcontainer div.husband {
  border-left: 1px solid #DBDBDB;
}

#vcontainer div.father, #vcontainer div.wife {
  border-right: 1px solid #DBDBDB;
}

#vcontainer div.ascender {
  border-top: 1px solid #DBDBDB;
}

#vcontainer div.descender {
  border-bottom: 1px solid #DBDBDB;
}

/** Admin page overrides **/

.lightback {
  background-color: inherit;
  border-right: 1px solid #E8C600;
  border-bottom: 1px solid #E8C600;
  padding: 7px;
}

.adminbody {
  color: #FFFFFB;
  background-color: #252525;
}

.admin-main, .admin-header, .adm-rounded-table {
  background-color: #252525;
}

/* background color for admin menu items while active */
a.admincell:hover, a.leftlink:hover {
  background-color: #E8C600;
}

#adm-innermenu {
  border: 1px solid #E8C600;
}

/* mod-manager overrides */

.stcell {
  color: #3E3B3B;
}

table.mmtable > tbody > tr:hover td.flink, table.mmtable > tbody > tr:hover td.flink {
  background-color: #DBDBDB;
  color: #3E3B3B;
}

.installed .action {
  color: #3E3B3B;
}

.th-indent {
  color: #E8C600;
}

/***********************************************************************
 ****** END: NightLight TNG Overrides                           ********
 ***********************************************************************/

/***********************************************************************
 ****** BEGIN: NightLight CSS IDs and Classes                   ********
 ***********************************************************************/

/** For the <body> tag. Describes basic attributes not governed by CSS 
  * defined within the 'boxes' .header, .content, and .footer. **/
  
.template {
  background: #252525;
  color: #FFFFFB;
  margin: 0;
  padding: 29px;
  font-family: 'Raleway', sans-serif;
  font-size: 13pt;
  font-weight: 400;
  line-height: 1.33;
}

/** For the <table> that defines the overall structure of the page.
  * This overrides genstyle.css. **/

.page {
  padding: 0;
  margin: 0;
}

/** Common styles used across Header, Content, Detail, and Footer: **/

.text_white {
  color: #FFFFFB;
}

.text_tan {
  color: #E8C600;
}

.text_grey {
  color: #DBDBDB;
}

.text_brown {
  color: #E8C600;
}

.titleXL {
  font-size: 200%;
}

.titleLg {
  font-size: 150%;
}

.titleMd {
  font-size: 135%;
}

.titleSm {
  font-size: 125%;
}

/** Header Structures **/

.headerBox {
  margin: 0;
  padding: 0 0 29px 0;
  border-bottom: 3px solid #E8C600;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  height: 200px;
  justify-content: space-between;
}

.siteImageBox {
  order: 2;
  height: inherit;
  position: relative;
}

.siteInfoBox {
  order: 1;
  display: flex;
  flex-direction: column;
  height: inherit;
  justify-content: space-between;
}

.siteTitleBox { /* unused in NightLight */ }

/*  Main Menu  */

.siteMenuBox {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 15px;
}

.siteMenuList {
  padding: 0;
  display: flex;
  flex-direction: row;
  column-gap: 23px;
  margin: 0;
  font-family: 'Quicksand', sans-serif;
  font-size: 135%;
  font-weight: 500;
}

.siteMenuList a:link, .siteMenuList a:visited { /* unused in NightLight */ }

.siteMenuList a:hover { /* unused in NightLight */ }

/* Media-based transitions for headers [site < 810px] */

@media (max-width: 810px) {
  .template {
    padding: 19px;
  }

  .headerBox {
    padding-bottom: 19px;
  }

  .siteMenuIcon {
    display: none;
  }

  .btnScrollUp {
    top: 15px;
  }
}

/* Media-based transitions for headers [site < 600px] */

@media (max-width: 600px) {
  .headerBox {
    flex-direction: column;
    align-items: center;
    height: auto;
    row-gap: 19px;
    padding: 0;
    border-bottom: none;
  }

  .siteImageBox {
    order: 1;
  }

  .siteInfoBox {
    width: 100%;
    row-gap: 19px;
    order: 2;
  }

  .siteTitleBox {
    text-align: center;
  }

  .siteMenuBox {
    padding: 5px 0 5px 0;
    border-top: 3px solid #E8C600;
    border-bottom: 3px solid #E8C600
  }

  .siteMenuList {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    column-gap: 23px;
    justify-content: center;
  }
}

/** Navigation Structures **/

.contentNavBox {
  padding: 0 0 0 23px;
  vertical-align: top;
  min-width: max-content;
  white-space: nowrap;  
  flex: 0 0 auto;
  order: 2;
}

.slidingNavBox {
  height: 100%;
  width: 0px;
  position: fixed; 
  z-index: 1; 
  top: 0; 
  right: 0;
  background-color: #252525; 
  overflow-x: hidden;
  transition: 0.25s;
}

.navHidden {
  display: none;
}

.slidingNavPad {
  padding: 19px;
}

/*  Artifacts in the navigation bar  */

.slidingNavBox input, .contentNavBox input {
  font-size: 85%;
}

.openNavBox {
  position: absolute;
  top: 46px;
  right: 23px;
}

.closeNavBox {
  position: absolute;
  top: 19px;
  right: 17px;
}

.navIcon {
  vertical-align: bottom;
  border: none;
}

.navIconHidden {
  display: none;
}

.navBox {
  margin-bottom: 33px;
}

.navBox ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.navBox li {
  padding: 7px 2px 9px 2px;
  border-bottom: #E8C600 dotted 1px;
}

.navBox a:link, .navBox a:visited {
  text-decoration: none;
  border-bottom: none;
}

.navTitle {
  color: #E8C600;
  font-family: 'Quicksand', sans-serif;
  text-transform: uppercase;
  margin-bottom: .5em;
}

@media (max-width: 810px) {
  .openNavBox {
    position: absolute;
    top: 31px;
    right: 15px;
  }

  .closeNavBox {
    position: absolute;
    top: 19px;
    right: 17px;
  }
}

/** Content Structures **/

.contentBox {
  display: flex;
  margin: 0;
  padding: 29px 0 29px 0;  
  width: 100%;
  position: relative;
}

/* All TNG detail pages (e.g., sources, search results, etc...) */
.contentDetailBox {
  vertical-align: top;  
  padding: 17px 23px 23px 23px;
  vertical-align: top;
  background: #3E3B3B;
  flex: 1;
}

/* Site 'Home' page and top-level pages */
.contentFeatureBox {
  padding: 17px 23px 23px 23px;
  vertical-align: top;
  background: #3E3B3B;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 23px;
  flex: 1;
  min-width: 0;
}

/*  Content features, info, news, etc... */

.contentFeatUpper {
  padding: 0 0 17px 0;
  border-bottom: 1px solid #DBDBDB;
}

.contentFeatLower {
  vertical-align: top;
  padding: 17px 0 0 0;
}

.featBox {
  margin: 0;
  padding: 0 0 0 23px;
  border-left: 2px dotted #E8C600;
}

.featTitle {
  margin-bottom: 1em;
}

.shStrictBox {
  height: 270px;
  overflow: hidden;
}

.dhStrictBox {
  height: 563px;
  overflow: hidden;
}

.thStrictBox {
  height: 856px;
  overflow: hidden;
}

.shScrollBox {
  height: 270px;
  overflow: auto;
}

.dhScrollBox {
  height: 563px;
  overflow: auto;
}

.thScrollBox {
  height: 856px;
  overflow: auto;
} 

/* Media transitions for Content / Detail [site =< 810px] */

@media (max-width: 810px) {
  .contentBox {
    padding: 19px 0 19px 0;
  }

  .detailBox {
    padding: 19px 0 19px 0;
  }

  .contentNavBox {
    padding: 0 0 0 15px;
    max-width: 200px;
    min-width: revert;
    white-space: normal;
  }

  .contentFeatureBox{
    padding: 12px 15px 15px 15px;
    grid-template-columns: 1fr;
  }

  .contentDetailBox {
    padding: 12px 15px 15px 15px;
  }
}

@media (max-width: 600px) {
  .contentNavBox {
    display: none;
  }

  .featBox {
    padding: 0 0 19px 0;
    border-left: none;
    border-bottom: 2px dotted #E8C600;
  }

  .openNavBox {
    display: block;
  }
}

/** Footer Structures **/

.footerBox {
  margin: 0;
  padding: 29px 0 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 27px 59px;
  align-content: flex-start;
  border-top: 3px solid #E8C600;
  position: relative;
}
  
/*  Footer Artifacts  */

.footerModeSwitch {
  text-align: center;
  display: none;
}

.btnScrollUp {
  position: absolute;
  top: 29px;
  right: 0;
}

/* Footer Sections */

.metaBox {
  text-align: left;
  vertical-align: top;
}

.metaBoxText {
  flex-basis: 250px;
  flex-grow: 1;
  max-width: 400px;
}

.metaTitle {
  color: #E8C600;
  font-family: 'Quicksand', sans-serif;
  text-transform: uppercase;
  margin-bottom: .5em;
}

.metaBox ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.metaBox li {
  padding: 3px;
  white-space: nowrap;
}

/* Media transitions for footer sections [site =< 810px] */

@media (max-width: 810px) {
  .footerBox {
    padding-top: 12px;
  }
  
  .footerModeSwitch {
    text-align: center;
    display: block;
  }
}

/***********************************************************************
 ****** END: NightLight CSS IDs and Classes                     ********
 ***********************************************************************/