/************ HEADER TRIAL SECTION ************/
#headerImage {
    width: 100%;
    height: auto;
    top: -20%;
    object-fit: cover;
    transform: scaleX(1.02);
    -webkit-clip-path: polygon(0% 0%, 0% 40%, 50% 64%, 100% 40%, 100% 0%);
    clip-path: polygon(0% 0%, 0% 40%, 50% 64%, 100% 40%, 100% 0%);
}

.mobile {
    display: none;
}

p.source { font-size: 13px }
.bold { font-weight:500; }
.sidePadded { vertical-align: middle; }
#topTrialBtn { margin-left: 50px;  }
#trialBar {
    padding: 30px;
    font-size: 30px;
    box-shadow: 1px 1px 5px #a9a9a9;
    text-align: center;
    z-index: 9;
    bottom: 15%;
    left: 0;
    right: 0;
}
#trialLine { line-height:50px; display: inline-block }
#trialContainer {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 29vw;
    display: inline-block;
}

.show-btn {display: none }
.trialSection { position: absolute; }
#btmTrialBar {
    padding: 30px;
    font-size: 30px;
    box-shadow: 1px 1px 5px #a9a9a9;
    text-align: center;
    display: none;
}

#TrialButtonApp { display: none }

@media (max-width: 767px) {
    #trialBar { display: none }
    #bottomTrialBtn { margin-bottom: -20px; padding: 25px 0 }
    #TrialButtonApp { display: block; position: sticky; z-index: 99; bottom: 0; margin: 35px 0 -25px 0; padding-bottom: 20px; background: #e7e7e7 }
    .freeTrialBtn { width: 100% }
}

/********** SURNAME SECTION **********/
.surname-widget { padding-bottom: 15px; }
.surname-widget .section-title { line-height: 1.35; }
.section-title { font-size: 20px; margin-bottom: 10px; }
.surname-widget .section-heading {margin-bottom: 15px;}
.section-heading {font-size: 42px; line-height: 42px; margin: 0 0 15px; font-weight: 300; }
.extra { margin-bottom: 20px }
.extra2 { margin-bottom: 30px }
.textMarginBottom { margin-bottom: 10px; padding-bottom: 0; }
.textPaddingRight { padding-right: 80px; }
.minH { min-height: 185px }
.attribution a, .attribution { font-size: 12px; height: 22px }
.attribution a { color: white }
#minMeaningHeight { min-height: 250px }

/********** RECORD COUNT SECTION **********/
ul#recordCountsSection li { margin-bottom: 3px;  font-size: 15.5px; }
#recordCountsLink1, #recordCountsLink2, #recordCountsLink3, #recordCountsLink4, #recordCountsLink5 { text-decoration:underline }

#recordCountHeading {
    font-size: 22px;
    position: relative;
    padding-bottom: 20px;
}

#recordCountHeading:after {
    content:"";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 0.5em;
    border-top: 2px solid black;
    padding-bottom: 10px;
}

@media (max-width: 1025px) {
    #trialContainer { height: 43vw; overflow: hidden }
    #headerImage { width: 150%; right: -25%; }
    #trialBar { width: 500px; padding: 20px; bottom: 5% }
    #topTrialBtn {
        margin-left:0;
        font-size: 20px;
        line-height: 30px;
        min-height: 50px;
        padding: 9px 34px;
    }
    #trialLine { line-height: unset }
    #topTrialBtn { width: 90% }
    #topTrialBtn::after { content: '' }
    .page { padding: 0 40px }
}

@media (max-width: 800px) {
    #trialContainer { height: 45vw}
    #trialBar { bottom: 5% }
    #topTrialBtn { margin-top: 10px }
    .textMarginBottom { padding-right: 0 }
}

@media (max-width: 580px) {
    .surname-widget { position:relative }
    #recordCountHeading { margin-top: 30px; }
    #trialBar { width: 86%; padding: 3% }
    #trialLine { font-size: 5vw }
    .description {max-height:290px; overflow:hidden; transition:max-height .5s ease}
    .gradient::before {
        /*.gradient {*/
        content: '';
        height: 90px;
        position: absolute;
        top: 75%;
        left: 0;
        width: 100%;
        background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0, #f5f5f5 70%);
        transition: height .25s ease;
    }
    /*.description::before {height:50px;}*/
    .show-btn {
        display:block;
        border:none;
        color:#fff;
        box-shadow:0 2px 5px rgba(0,0,0,.6);
        background-color:#6ba410;
        font-weight:bold;
        font-size:22px;
        width:40px;
        height:40px;
        border-radius:100%;
        position:absolute;
        left:50%;
        /*top: 77%; */
        margin-left:-20px; }
    .show-btn.icon::before, .show-btn.iconAfter::after {top:0.25em; font-size:30px;}
    .show-btn.icon {transition:transform .25s ease; transform-origin:center; cursor:pointer;}
    .show-btn.icon.rotate { transform:rotate(180deg); bottom: 5%; top: unset  }
    .surname-widget { padding-bottom: 20px }
}

@media (max-width: 500px) {
    #topTrialBtn {
        margin-top: 0;
        font-size: unset;
        line-height: unset;
        min-height: unset;
        padding: unset;
    }
    #trialBar { padding: 0 3% 3% }
}

@media (max-width: 280px) {
    #trialLine { font-size: 6vw }
}

/********** CONVERSION SECTION **********/
#ConversionFlowApp { background-color: white; padding-top: 1px; }
#ConversionFlowApp .fieldLabel{display: inline-block;}
#dumbledore { position: relative; margin-top: 30px; }
#dumbledoreLeft { width: 60%; }

#conversionImage {
    width: 47%;
    height: auto;
    position: absolute;
    padding-left: 0;
    bottom: 0;
    right: 0;
    -webkit-clip-path: polygon(40% 0%, 10% 40%, 0% 100%, 100% 100%, 100% 0%);
    clip-path: polygon(40% 0%, 10% 40%, 0% 100%, 100% 100%, 100% 0%%);
}
.conversionField { width: 50%; padding-top: 20px; }
#txtMerlinFirstName, #txtMerlinLastName, #txtExploreFirstName, #txtExploreLastName, #txtExploreBirthYear, #txtExploreLocation {
    width: 95%; height: 40px; font-size: 25px
}
#exploreSubmit { margin: 40px 0 60px 0; width: 200px }
.conversionTxtFields { margin-top: 10px }
#proTip { margin-top: 20px; font-style: italic; font-weight: 300 }
.iconWarning { visibility: hidden }

@media (max-width: 800px) {
    #conversionImage { width: 0 }
    #dumbledoreLeft { width: 100% }
}

/********** DISTRIBUTION SECTION **********/
#mapHeading {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10;
    color: white;
    /* margin: 50px; */
    margin: 60px auto 0 auto;
    width: 990px;
    height: 100px;
}
#headingWidth { width: 50% }
#censusLink { font-size: 18px }
#censusAnchor { color: #51abac }
#mapGradient {
    background: linear-gradient(to right,#000 50%,#66000000 100%);
    opacity: .6;
    z-index: 9;
    position: absolute;
    height: 100%;
    width: 55%;
    pointer-events: none;
}

.distribution-area {margin: 0; height: 0}
#distroMap { position:absolute; }
.map-content {min-height: 666px;}
.placeholder-map {min-height: 500px}
#ffSurnameBtn { width: 100% }
.map-widget { background-color: #3c4147; height: 615px; position: relative; /* margin-top: -30px !important; */ margin-bottom:23px; overflow: hidden }
.map-widget.hideSection { margin-top:-70px !important; }
.map-widget.sadPath { height: 500px;}
.header-wrap { width: 100%; z-index: 5; padding-top: 3px; }
.map-header, .ethnicityHeadingSection { background-color: #f8f7f3; }
.map-header, .map-footer { tab-index: -1; }
.map-header .section-heading {margin-bottom: 0;}
.mapboxgl-control-container { position: relative; top: 0; }
.hideSection .mapboxgl-control-container { position: relative; top:0; }
.mapbox-maplogo { background-image: url(data:image/png; background-position: 0 0; background-repeat: no-repeat; background-size: 65px 20px; base64,iVBORw0KGgoAAAANSUhEUgAAAIIAAAAoCAMAAAAFWtJHAAAAwFBMVEUAAAAAAAAAAABtbW0AAAAAAAAAAAAAAAAAAAAAAAClpaUAAADp6ekAAAD5+fna2toAAAAMDAzv7+/Nzc0AAAA2Njb8/Pz9/f3T09MAAAAAAAD7+/sAAAArKyuxsbH39/fs7OwbGxuIiIjz8/N8fHyenp7u7u74+PgAAAC8vLxWVlbx8fF1dXXl5eVcXFyUlJTQ0NDFxcVCQkLAwMC4uLj19fXo6OjW1tarq6ve3t77+/vi4uL6+vrKysrNzc3///8w7gSSAAAAP3RSTlMAOQNdPSYBPywKexLLGPCxNEHXnzFL+v2nGwf1IEiE6dBFad9jd9PuLo1V2mDDV3Cjl06SiuXIq4C3973ym6BQMVUPAAAEXElEQVR4Ae2WCVP6OBiH05L0l1IqrVbkKHJ54I0oHn+PfP9vtUle0z/YdhbH2XVnd58ZnRJIeHiPJOx//mH4vQSAN+8FjAhFxgHIaPvJeZ99hxwEElon5iAQbj85Y98g8ODwjEOMAvGFyeE3FEKgodTBqj0BJGN9DhyNd5Ta3ean9QEopfaA+LsKhnEKRExqg4FSP6Og7oEkAjBWnxSCgBX4xF+kcLoPcOBQrSv0e5kH7s1j37jECQieCTPiFGxL5VHw2zQWCeeJiPt6kjRQw0XSkIdVChf67xGa4alSnZlT6HEQ8CK9ANbhvXUF9xlDkBfTuHDWScgC9+z5FQpPI12TlwC6+sV7ixR8CUMKiwjm2GQeOQWHMGuHGdbnObJAwCEqFJpNU5H6uaPUaEIKiQfg+PHk1+u4OwW9PlWW2ctbA4BHCtp+cNK+H8Jos4gDmC5ar4Nx9waaG/2B13NgDqS7+vm2RgEtEws82P+kwIHhs/pgkQKcFIhfd7CogtGNjYMHTLpurD0ERbYFw4JaD3GlQuNAL/JEsSAF4HqlCnaHACk4WhOn4OgCkMD5hSpYNYDJTD8Y46n+jsE1kPhVCuR6QBXhFK7MUOu9O6b1SWF3b+/9ZVWMGOlu93E8UDaAhgc7bfH+0DHqKXCkHzoNDFfU+zxiVQrUC9QXTuHYtKpN59OA3IxCG4b7jh6ZFuVockaNTW09mkJzOaPU49a6mE9cAchZpQJNpUWcwgV9r6FJswsFKrITp2B5pMBMdnS0z2HZNy2+BNKxSZxZfglkrFYBJxQnpzA5sN/HheR2aFQoZBLAi149dQoyAYYjW0hHlHguBAdMcR0DuDZ5omevX6+AI8qcU7ikKT3GBHCnXwydgmCC0tRwCnGQ2Wp6Be71yNIWfQSkOl9vAI1SBCNWrwC01RROgX7BuT2HI4r7tFAw086p/NwZEdOEa7R1uAFuNmQPuKAEAjYNQ0CyeoUEWHYBnpQVQgpvc0Ph+gsKlAnKg1+vEHsw5LKciLKCAJobiWBzYFGbCKpHqkZZrxBFHEASyFI59vJPCskcwNVGOWZAOqsrR+pKbaNeAMT1CixMEtlnsqopNxUMzVJT3tY35aXZm6a6Y9QhwMN6BUJWbE1lhbMO1WehkO7poO0sK7em9MJGxp1XSbC1gtugzzSLQmGsX7VntJGSwsPZ2d2z3bIPKzdoOp3Wzqt8G4XyMVUoFIxLx1S7+piaHtCvR3FeRVsq0GFdp9C5TbGpcNqsPqyHKxcfd14h21KhuLKUFU4f3osrC7F6uV3WXFnadL7wyAPeKDXw2RoJCO5GY4DouYvb/gepVXheLoewzPseQG9N/vzilrMIjoStE3++zvle4eSurw7XEe76ynI4aq+v7lEyt1x5awiFlFLQbHKIpabnM3eJLym4Szzzc/du7SU+zOXv9UNpECH7IoH/gecURPlN9vdQpeD47yhIFNX0U0QgvID9nENm+yxk/xb+AGAjNfRZuk9qAAAAAElFTkSuQmCC); bottom: 10px; display: block; height: 20px; left: 10px; overflow: hidden; position: absolute; text-indent: -9999px; width: 65px; z-index: 99999; }
.source .noTopSpacing {tab-index: 0}
/* Legend */
.map-legend { background-color: rgba(255,255,255,0.9); border-radius: 5px; padding: 20px 0px 15px 10px; width: 115%; margin-top: 3px; margin-right: 17px; max-width: 141px; z-index: 100; }
.map-legend li:not(:last-child) {margin-bottom: 10px;}
.map-legend .legend-circle { -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; border: 2px solid #777; display: inline-block; height: 28px; width: 28px; }
.map-legend-text { color: #7d7d7d; font-size: 18px; left: -5px; padding-left: 10px; position: relative; top: -8px; }
.dist-range-1 {background-color: #70BF44;}
.dist-range-2 {background-color: #51abac;}
.dist-range-3 {background-color: #796996;}
#map .mapboxgl-popup-content {background-color: rgba(234, 247, 252, 1);}
#map .mapboxgl-popup-tip {border-top-color: rgba(234, 247, 252, 1);}
.mapboxgl-popup-content div {font-weight: bold;}
.mapboxgl-popup-content span {color: #9D9E9E;}
.mapboxgl-popup.mapboxgl-popup-anchor-bottom {z-index: 9999;}

/* Header */
.map-header .section-heading { display: inline; }
.mapboxgl-popup-close-button { margin-right: 3px; }
.header-legend {position:absolute; left: 16px; top: 6px; margin-top: 420px;/*min-width: 25%;*/ z-index:15;}

/* Mapbox zoom button */
.mapboxgl-ctrl-top-left .mapboxgl-ctrl { margin: 16px 0 0 0; }
.mapboxgl-control-container .mapboxgl-ctrl-top-left { top:0; left:150px; position: relative; z-index: 15}
.mapboxgl-ctrl-group > button.mapboxgl-ctrl-zoom-out { border-left:1px solid #ccc; }
.mapboxgl-ctrl-compass { display: none !important; }
.mapboxgl-ctrl-group > button { float:left; }

/* Dropdown */
.map-dropdown { display:inline-block; margin-top:0; margin-left: 16px; position: relative; top:9px; z-index: 90;}

button.map-dropdown-btn {font-size:20px;color:lightgray;text-transform:uppercase;font-weight:bold;background-color:inherit;border:none;}
button.map-dropdown-btn:hover { color:white;}
button.map-dropdown-btn:hover span, .calloutTrigger:not(.ancBtn).active>span {text-decoration:none;}
button.map-dropdown-item, button.map-dropdown-item-active { background-color: unset; border: none; padding: 3px }
button.map-dropdown-item:hover { font-weight:bold }
button.map-dropdown-item-active { font-weight:bold; color:grey }
.callout-arrow { position: absolute; width: 0;height: 0;border: 1px solid #dbd9d3;border-radius: 2px;border-left: 10px solid transparent;border-right: 10px solid transparent;border-bottom: 10px solid #fff;border-top: none;z-index: 10;}
.map-dropdown #calloutContent { border-top-left-radius: 4.5px; margin-top: 8px; min-width: 7.8em;}
.map-dropdown #calloutContent.calloutMenu-es { min-width: 9.8em;}
.map-dropdown .callout-container {position: absolute;}

/* Footer */
.map-footer { /*background-color: rgba(255,255,255,0.75);*/ z-index:50;position:absolute;right:16px;bottom:0;height: 97.5%;}
.map-footer-inner { padding: 20px 10px; }
.map-footer-inner .widget-description,
.map-footer-inner .source { padding: 0 10px; }
.map-alert { position: absolute; right: 10px; top: -84px; }
#description-wrapper, #description-wrapper::before, #description-wrapper::after { pointer-events: none }
#sad-wrapper { margin-top: 225px }
#sad-wrapper > div { width: 100%!important }
.map-widget .widget-description {font-size: 18px; padding-top: 40px; width: 40%}
.map-widget .attribution { font-size: 14px; position: absolute; right: 10px; top: -6px; width: 250px; color: white; text-align: right }
.map-description {padding-bottom: 6px;}
.map-footer-inner .map-description:last-child{padding-bottom: 0;}

/* Tabs */
.famui-tabs { overflow:auto; -webkit-overflow-scrolling:touch; position:relative; -webkit-tap-highlight-color:rgba(0, 0, 0, 0); text-align:center; white-space:nowrap; word-break:normal; z-index:2; }
.pageHeader .famui-tabs { margin:10px 5px 0; }
.famui-tab { -webkit-appearance:none; background-color:transparent; border:2px solid transparent; border-radius:3px; color:#534d46; cursor:pointer; display:inline-block; font-weight:bold; line-height:20px; margin-left:5px; padding:3px 8px; -webkit-tap-highlight-color:rgba(0, 0, 0, .1); text-decoration:none; text-transform:uppercase; vertical-align:top; outline: none;}
.famui-tab:hover,
.famui-tab:focus { color:#534d46; outline: none;}
.famui-tab.tabActive { cursor:default; }
.famui-tab:first-child { margin-left:0; }
.famui-tab:not(.famui-tabActive):hover { background-color:rgba(0, 0, 0, .1); text-decoration:none; }
.bgDark .famui-tab:not(.famui-tabActive):hover { background-color:rgba(0, 0, 0, .4); color:#fff; }
.famui-tab:focus { outline-offset:-2px; }
.famui-tab.iconAfter::after { display:none; }
.famui-tabActive { border-color:currentColor; }
.famui-tabActive:focus,
.famui-tabActive:hover { text-decoration:none; outline: none;}
.famui-tabContent:not(.famui-tabActive) { display:none; }
.famui-tabContent ~ .famui-tabContent { margin-top:0; } /* Zero out margin to allow for grids to be tabbed */
.famui-tabsConnected { text-align: center; }
.famui-tabsConnected .famui-tab { border:2px solid rgba(0, 0, 0, .8); border-left-width:1px; border-radius:0; border-right-width:1px; margin:0; }
.famui-tabsConnected .famui-tab:first-child { border-bottom-left-radius:3px; border-left-width:2px; border-top-left-radius:3px; }
.famui-tabsConnected .famui-tab:last-child { border-bottom-right-radius:3px; border-right-width:2px; border-top-right-radius:3px; }
.famui-tabsConnected .famui-tab.famui-tabActive { background:rgba(0, 0, 0, .8); border-color:transparent; color:#fff; cursor:default; }
.famui-tabsConnected .famui-tab:not(.famui-tabActive):hover { background-color:rgba(0, 0, 0, .6); color:#fff; }

/* Slider */
.rangeslider-mount { margin: 25px auto 5px auto; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;}
.rangeslider{position:relative;background:#e6e6e6}
.rangeslider .rangeslider__fill,.rangeslider .rangeslider__handle{position:absolute}
.rangeslider,.rangeslider .rangeslider__fill{display: block; box-shadow:inset 0 1px 3px rgba(0,0,0,.3)}
.rangeslider .rangeslider__handle{background:#fff;border:1px solid #ccc;cursor:pointer;display:inline-block;/*position:relative;*/margin-left: -20px;}
.rangeslider .rangeslider__handle:hover, .rangeslider .rangeslider__handle:active { border-color: rgb(102,139,200); border-width: 2.5px; box-shadow: 0 0 16px 2.5px blue; transition: height .25s ease; }
.rangeslider-vertical {/*height:20px;*/border-radius:10px}
.rangeslider-vertical .rangeslider__fill{width:2px;/*background:#9cbe30;*/border-radius:10px;top:0}
.rangeslider-vertical .rangeslider__handle {
    width: 10px;
    height: 10px;
    border-radius: 10px;
    /*top: -10px;*/
    left: 16px;
}
.rangeslider, .rangeslider-vertical { display: inline-block; width: 2px; }
.rangeslider-end { color: #443f39; font-size: 27px; margin: 0 10px }
/*.rangeslider-vertical .rangeslider__handle:before { content: attr(data-value); position: absolute; font-size: 32px; font-weight: bold; top: -41px; left: -15px; }*/
/*.rangeslider__handle-label {*/
/*    text-indent: 0;}*/
.rangeslider__labels { direction: rtl; z-index: -1 }
.rangeslider__label-item {
    padding: 30px 20px;
    list-style-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='6' height='6' viewBox='-1 -1 2 2'><circle fill='rgb(102,139,200)' r='1' /></svg>");
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
    margin: 0 11px;
    cursor:pointer;
}

.rangeslider__label-item:first-of-type {
    margin-top: -40px
}
.rangeslider__labels:last-child {
    margin-bottom: -37px
}

.yrSlider {
    padding: 0 10px;
    background-color: rgba(255,255,255,0.75);
    border-radius: 10px;
    font-weight: bold;
    cursor: pointer;
}
.yrSlider:hover { background-color: white }
@media (max-width: 850px) {  .map-widget .attribution { width: 180px; top: -15px } .map-footer-inner { padding: 40px 10px 20px }  }
@media (max-width: 535px) {  .map-widget .attribution { width: 180px; top: -18px }  }
@media (max-width: 501px) {  .map-widget .attribution { top: -10px }  }
@media (max-width: 393px) {
    .map-widget .attribution { top: -6px; font-size: 8px; width: 65px }
    .attribution a, .attribution { font-size: 8px }
    #line2:before { content: '\a'; white-space: pre }
}

/* SearchBox */
.search-box { background-color: rgba(255,255,255,0.9); background-color: white; border-radius: 5px; box-shadow: 3px 3px 4px #A0BEC9; font-size: 20px; left: 50%; padding: 30px 60px; position: absolute; top: 250px; transform: translate(-50%, -50%); z-index: 99 }
.search-label { font-size: 15px; font-weight: bold; }
.search-text-con {text-align: center;}
.search-input-con { position: relative; text-align: center;}
.search-text {margin-bottom: 40px; text-align: center}
.searchAgain {margin: 0 auto; width: 65%}
#ffTopLevel { margin: 0 auto; width: 80% }

/* Mapbox Logo */
.mapbox-wordmark {
    position: absolute; display: block; height: 20px; width: 65px; right: 5px; text-indent: -9999px; z-index: 99999; overflow: hidden;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIIAAAAoCAMAAAAFWtJHAAAAwFBMVEUAAAAAAAAAAABtbW0AAAAAAAAAAAAAAAAAAAAAAAClpaUAAADp6ekAAAD5+fna2toAAAAMDAzv7+/Nzc0AAAA2Njb8/Pz9/f3T09MAAAAAAAD7+/sAAAArKyuxsbH39/fs7OwbGxuIiIjz8/N8fHyenp7u7u74+PgAAAC8vLxWVlbx8fF1dXXl5eVcXFyUlJTQ0NDFxcVCQkLAwMC4uLj19fXo6OjW1tarq6ve3t77+/vi4uL6+vrKysrNzc3///8w7gSSAAAAP3RSTlMAOQNdPSYBPywKexLLGPCxNEHXnzFL+v2nGwf1IEiE6dBFad9jd9PuLo1V2mDDV3Cjl06SiuXIq4C3973ym6BQMVUPAAAEXElEQVR4Ae2WCVP6OBiH05L0l1IqrVbkKHJ54I0oHn+PfP9vtUle0z/YdhbH2XVnd58ZnRJIeHiPJOx//mH4vQSAN+8FjAhFxgHIaPvJeZ99hxwEElon5iAQbj85Y98g8ODwjEOMAvGFyeE3FEKgodTBqj0BJGN9DhyNd5Ta3ean9QEopfaA+LsKhnEKRExqg4FSP6Og7oEkAjBWnxSCgBX4xF+kcLoPcOBQrSv0e5kH7s1j37jECQieCTPiFGxL5VHw2zQWCeeJiPt6kjRQw0XSkIdVChf67xGa4alSnZlT6HEQ8CK9ANbhvXUF9xlDkBfTuHDWScgC9+z5FQpPI12TlwC6+sV7ixR8CUMKiwjm2GQeOQWHMGuHGdbnObJAwCEqFJpNU5H6uaPUaEIKiQfg+PHk1+u4OwW9PlWW2ctbA4BHCtp+cNK+H8Jos4gDmC5ar4Nx9waaG/2B13NgDqS7+vm2RgEtEws82P+kwIHhs/pgkQKcFIhfd7CogtGNjYMHTLpurD0ERbYFw4JaD3GlQuNAL/JEsSAF4HqlCnaHACk4WhOn4OgCkMD5hSpYNYDJTD8Y46n+jsE1kPhVCuR6QBXhFK7MUOu9O6b1SWF3b+/9ZVWMGOlu93E8UDaAhgc7bfH+0DHqKXCkHzoNDFfU+zxiVQrUC9QXTuHYtKpN59OA3IxCG4b7jh6ZFuVockaNTW09mkJzOaPU49a6mE9cAchZpQJNpUWcwgV9r6FJswsFKrITp2B5pMBMdnS0z2HZNy2+BNKxSZxZfglkrFYBJxQnpzA5sN/HheR2aFQoZBLAi149dQoyAYYjW0hHlHguBAdMcR0DuDZ5omevX6+AI8qcU7ikKT3GBHCnXwydgmCC0tRwCnGQ2Wp6Be71yNIWfQSkOl9vAI1SBCNWrwC01RROgX7BuT2HI4r7tFAw086p/NwZEdOEa7R1uAFuNmQPuKAEAjYNQ0CyeoUEWHYBnpQVQgpvc0Ph+gsKlAnKg1+vEHsw5LKciLKCAJobiWBzYFGbCKpHqkZZrxBFHEASyFI59vJPCskcwNVGOWZAOqsrR+pKbaNeAMT1CixMEtlnsqopNxUMzVJT3tY35aXZm6a6Y9QhwMN6BUJWbE1lhbMO1WehkO7poO0sK7em9MJGxp1XSbC1gtugzzSLQmGsX7VntJGSwsPZ2d2z3bIPKzdoOp3Wzqt8G4XyMVUoFIxLx1S7+piaHtCvR3FeRVsq0GFdp9C5TbGpcNqsPqyHKxcfd14h21KhuLKUFU4f3osrC7F6uV3WXFnadL7wyAPeKDXw2RoJCO5GY4DouYvb/gepVXheLoewzPseQG9N/vzilrMIjoStE3++zvle4eSurw7XEe76ynI4aq+v7lEyt1x5awiFlFLQbHKIpabnM3eJLym4Szzzc/du7SU+zOXv9UNpECH7IoH/gecURPlN9vdQpeD47yhIFNX0U0QgvID9nENm+yxk/xb+AGAjNfRZuk9qAAAAAElFTkSuQmCC);
    background-repeat: no-repeat; background-position: 0 0; background-size: 65px 20px;
}

@media (max-width: 1375px) {
    .map-widget { height: 675px }
    .map-content { height: 675px; min-height: 675px }
    canvas.mapboxgl-canvas { height: 675px }
    .header-legend { top: unset; bottom: 30px }
    .map-legend { display: flex; width: unset; max-width: unset; padding: 20px 20px 5px 20px; }
}

@media (max-width: 1025px) {
    .map-widget .widget-description { padding-left: 40px; width: 42% }
    #censusLink { padding-left: 40px }
    .search-box { width: 80% }
}

@media (max-width: 1005px) {
    .map-widget.sadPath { height: 550px; }
    .placeholder-map {min-height: 550px}
    .search-box { top: 250px }
    #sad-wrapper { margin-top: 250px }
    #mapHeading { width: unset }
}

@media (max-width: 962px) {  .map-widget .widget-description { width: 48% }  }

@media (max-width: 850px) {
    #headingWidth { display: inline-block; width: unset }

    .map-widget {
        height: 1100px
    }

    #mapGradient {
        width: 100%;
        background: linear-gradient(to top, #000 0, #66000000 30%);
    }

    #mapHeading {
        top: unset;
        bottom: 50px;
        height: unset;
        width: unset;
        word-wrap: break-word
    }

    #sad-wrapper > div { height: unset!important }

    .sadTop {
        top: 0!important;
    }

    .header-legend {
        bottom: 450px
    }

    #description-wrapper {
        position: relative;
        pointer-events: unset;
    }

    #description-wrapper::before {
        content: '';
        position: absolute;
        top: -1px;
        width: 100%;
        height: 50px;
        background: linear-gradient(#3c4147 50%, rgba(255, 255, 255, 0.005) 100%);
        background: -webkit-linear-gradient(#3c4147 50%, transparent 100%);
    }

    #description-wrapper::after {
        content: '';
        position: absolute;
        bottom: -15px;
        width: 100%;
        height: 40px;
        background: linear-gradient(rgba(255, 255, 255, 0.005) 0, #212327 80%);
        background: -webkit-linear-gradient(transparent 0, #212327 80%);
    }

    .map-widget .widget-description {
        width: 100%;
        padding-right: 40px;
        height: 260px;
        overflow: scroll;
    }
}

@media (max-width: 750px) {
    .map-widget.sadPath { height: 600px }
    .placeholder-map {min-height: 600px}
    .search-box { top: 275px; padding: 20px 10px; }
    #sad-wrapper { margin-top: 275px }
    #sad-wrapper > div, #sad-wrapper > a { font-size: 2.5vw }
    .map-description { padding-bottom: 0; }
}

@media (max-width: 637px) {
    .map-widget { height: 1135px }
    .header-legend { bottom: 480px }
    #mapHeading { bottom: 40px }
    .search-box { top: 300px; padding: 10px; }
    .search-text { margin-bottom: 10px }
}

@media (max-width: 501px) {
    .search-box { top: 335px }
    #sad-wrapper { margin-top: 275px }
    .map-widget { height: 750px }
    .map-content { height: 300px; min-height: 300px }
    .header-legend { bottom: 470px }
    .map-legend { padding: 10px }
    .map-legend li { margin-bottom: unset!important; line-height: 0!important }
    .scottish-description { width: 82%!important; margin-right: 18%!important }
    .scottish-description > #headingWidth { font-size: 34px }
}

@media (max-width: 450px) {
    .map-legend { padding: 5px }
    .map-legend-text { font-size: 82%; top: -3px!important }
    .map-legend .legend-circle { height: 14px!important; width: 14px!important }
}

@media (max-width: 420px) {
    .search-text { font-size: 14px }
    .map-legend { padding: 3px }
    .map-widget { height: 785px }
    .header-legend { bottom: 505px }
    .map-widget .widget-description { padding-top:20px }
    .form input { font-size: 15px }
    #description-wrapper::before { height: 30px }
}

/********** OCCUPATIONS SECTION **********/
#OccupationSectionApp {
    background-color: white;
    margin-top: -25px;
    padding-top: 25px;
}

.w78{width:78%;}
.occupation-widget { position:relative; padding-top: 5px;}
.occupation-widget .graph-bar{height:20px; margin:5px 0 0 6px;}
.occupation-widget .bar-fill{height: 100%; width:0%;  border-radius: 50px; position:relative; display: flex; justify-content: left;}
.occupation-widget .occupationsGraphSection {margin:10px 0 10px 0;}
.occupationsGraph {width:100%; margin:0 auto; }
.occupationsGraph li {height:40px; list-style:none; align-items: center; }
.occupationsGraph li:nth-child(1) .bar-fill { background: #6c6dbd; background: -moz-linear-gradient(right,  #6c6dbd 0%, #9dbfe5 100%); background: -webkit-linear-gradient(right,  #6c6dbd 0%,#9dbfe5 100%); background: linear-gradient(to left,  #6c6dbd 0%,#9dbfe5 100%); width:0px;}
.occupationsGraph li:nth-child(2) .bar-fill {background: #5cb8c5; background: -moz-linear-gradient(right,  #5cb8c5 0%, #5fd699 100%); background: -webkit-linear-gradient(right,  #5cb8c5 0%,#5fd699 100%); background: linear-gradient(to left,  #5cb8c5 0%,#5fd699 100%); width:0px;}
.occupationsGraph li:nth-child(3) .bar-fill {background: #994fa0; background: -moz-linear-gradient(right,  #994fa0 0%, #dd89c4 100%); background: -webkit-linear-gradient(right,  #994fa0 0%,#dd89c4 100%); background: linear-gradient(to left,  #994fa0 0%,#dd89c4 100%); width:0px;}
.occupationsGraph li:nth-child(4) .bar-fill {background: #d84000; background: -moz-linear-gradient(right,  #d84000 0%, #f2a420 100%); background: -webkit-linear-gradient(right,  #d84000 0%,#f2a420 100%); background: linear-gradient(to left,  #d84000 0%,#f2a420 100%); width:0px;}
.occupationsGraph .bar-fill {transition: width 1s ease; margin:0px 13px; max-width:100%;}
.occupationsGraph li:nth-child(1) .rightFacingArrow{border-color: transparent transparent transparent #6c6dbd;}
.occupationsGraph li:nth-child(2) .rightFacingArrow{border-color: transparent transparent transparent #5cb8c5;}
.occupationsGraph li:nth-child(3) .rightFacingArrow{border-color: transparent transparent transparent #994fa0;}
.occupationsGraph li:nth-child(4) .rightFacingArrow{border-color: transparent transparent transparent #d84000;}
.occupationsGraph p{width:21%; text-align: right; font-size: 20px; font-weight: bold;}
.occupationsGraph .bar-percentage{font-weight: normal; }
.occupationsGraphSection > .tabs.tabsConnected.ancColRow { margin-top: 20px; margin-bottom: 20px; }
.narrative-section > .active-narrative { font-size: 18px; padding-top: 20px }
#occupationsImage { padding-top: 70px }
.sadJob { padding-bottom: 15px }
.occupationsGraphSection > .tabsConnected .tab { border: 2px solid rgba(0,0,0,0.8); border-left-width: 1px; border-radius: 0; border-right-width: 1px; margin: 0; padding-bottom: 1px; padding-top: 1px; font-size: 16px; }
.occupationsGraphSection > .tabsConnected .tab.active{ background: rgba(0,0,0,0.8); border-color: transparent; color: #fff; cursor: default; }

.occupationsGraphSection > .tabsConnected .tab:first-child { border-bottom-left-radius: 3px; border-left-width: 2px; border-top-left-radius: 3px; }
.tabsConnected .tab:last-child { border-bottom-right-radius: 3px; border-right-width: 2px; border-top-right-radius: 3px; }

/* Insights Occupations */
.tabsConnected { text-align: left!important }
.tabsConnected .tab { text-transform: uppercase }
.occupation-card {display: flex; text-transform: capitalize; flex-direction: row; flex-wrap: wrap; font-size: 14px;}
.occupation-card > div {margin:10px 10px 0 0;width:46%}
.occupation-card .graph-bar{height:15px;margin: 5px 0 0 -15px;display: inline-flex;}
.occupation-card li{height: 50px; font-weight: bold;}
.occupation-card h3 {font-size: 16px;font-weight: bold;margin-bottom: 20px;}
.occupation-card  .card:not(.bgDark) {padding: 20px 0px 50px 20px; box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.25); border-radius: 17px;}
.occupation-widget .insightsAlert { margin: 0 25% 1% 25%;}
/* Insights Occupations */

@media (max-width: 1025px) {
    #occupationsImage { width: 0 }
    #occupationsContent { width: 100% }
    .occupation-card > div { width: 300px }
}
@media (max-width: 400px) {
    .occupation-card > div {width: 100%}
}

/********** RECORDS WIDGET **********/
#DesktophistoricalRecords .card, #historicalRecords .card {
    height: 675px;
    padding: 0;
    border-radius: 8px;
    margin: calc(10% / 6);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#DesktophistoricalRecords .card:hover, #historicalRecords .card:hover{
    box-shadow:0 0 0 3px #a9a9a9; text-decoration:none;
}
.photo { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
[id^="desktopLinkedFooter"] {
    padding: 5px 20px 15px 20px;
}
.records-widget {margin-bottom:20px;}
.records-header, .work-header {margin-bottom:20px;}
.records-header .section-heading { margin-top:40px; text-align:center}
.records-widget img {width:100%; cursor:pointer;}
.records-widget .carouselSlide p.default-narrative {font-size:16px;}
#slideshow > ul > .carouselSlide { vertical-align: top; }
.records-widget .record-content p {font-weight:lighter; font-size:22px;}
.records-widget .record-content a {display: block; margin-bottom: 15px;}
#records-linking-tab {margin-top:0px;margin-bottom: 20px;}
.carouselNextBtn, .carouselPreviousBtn {top:47% !important;}
.recordsImage {max-width: 100%}
.recordsImage > img {width:95%;}
.carousel { padding-bottom: 10px;}
.recordCard { margin: 13px }

/********** Carousal effect using tabs css **********/
.tabsConnected .ancBtn {border: 2px solid rgba(0,0,0,.8);border-left-width: 1px; border-radius: 0; border-right-width: 1px; margin: 0; color: #534d46 !important; background-color: transparent; text-shadow: none;}
.tabsConnected .ancBtn:first-child{ border-bottom-left-radius:3px; border-top-left-radius:3px; border-left-width: 2px;}
.tabsConnected .ancBtn:last-child{ border-bottom-right-radius:3px; border-top-right-radius:3px; border-right-width: 2px;  }
.tabsConnected .ancBtn.active{ color: #fff !important; cursor:default; }
.tabsConnected .ancBtn:not(.active):hover{background-color: rgba(0, 0, 0, .6) !important; color:#fff !important;}

/********* RecordsLinkingApp *********/
#RecordsLinkingApp { height: 650px }
.historicalDefaultText {padding: 0px 20px 15px 20px; font-size: 16px; color:black;}
.historicalDefaultText + a { font-weight:bold;  text-decoration: none; position: absolute; bottom: 0; }
#DesktophistoricalRecords { margin: 0 auto; width: 990px; padding:10px}
.carouselPreviousBtn, .carouselNextBtn{margin-top: -115px !important}
.historicalDescription {font-weight:bold; font-size: 24px; padding: 15px 20px 5px 20px }
#recordsLinkingDeskTopWrapper, #recordsLinkingMobileWrapper{display:none;}
.pagePadded {padding-top:0px;}
.sidePadded {padding:0 20px 0 20px}
.ancBtn{text-transform: none;}

.form input.ancBtn {font-size: 18px;}
/* Carousel Text */
.records-narrative {
    font-size: 16px;
}

@media (max-width:1025px) {
    .historicalDefaultText{height: 180px;}
    .tabsConnected .ancBtn:not(.active):hover{background-color: transparent !important; color:#534d46 !important;}
    .mobileRecordsImage { width: 100% }
    #historicalRecords .card { height: 105vw }
    #historicalRecords > div { margin: 0 10% 35px 10% }
    .historicalDefaultText + a { bottom: 15px; margin-left: 20px }
}

@media (max-width:920px) {  #historicalRecords .card { height: 110vw }  }
@media (max-width:770px) {  #historicalRecords .card { height: 130vw }#historicalRecords .card { height: 112vw }  }
@media (max-width:680px) {  #shiftingCardWidth { width: 90% } #historicalRecords > div { margin: 0 5% 35px 5%  } #historicalRecords .card { height: 124vw }  }
@media (max-width:582px) {  #shiftingCardWidth { width: 100% } #historicalRecords > div { margin: 0 0 35px 0 } #historicalRecords .card { height: 142vw } }
@media (max-width:520px) {  #historicalRecords .card { height: 150vw } #historicalRecords > div { width: 100% } }
@media (max-width: 480px) {
    /********** RECORDS WIDGET **********/
    #historicalRecords .card { height: 164vw }
    .aside-documents {padding: 4%;}
    .aside-documents #recordCountsSection{padding: 0;}
    .records-widget .tab {font-size: 13px}
}
@media (max-width: 400px) { #historicalRecords .card { height: 170vw } }
@media (max-width: 370px) { #historicalRecords .card { height: 155vw } .historicalDefaultText { margin-top: 5px; font-size: 12px; } .historicalDefaultText + a { font-size: 12px; } }
@media (max-width: 326px) { #historicalRecords .card { height: 170vw } .historicalDescription { font-size: 18px } .historicalDefaultText { font-size: 11px; } .historicalDefaultText { font-size: 11px; margin-top: 0 } }
@media (max-width: 274px) { #historicalRecords .card { height: 185vw } .historicalDefaultText { font-size: 10px } .historicalDefaultText + a { font-size: 10px } }
@media (max-width: 242px) { #historicalRecords .card { height: 200vw } }
@media (max-width: 222px) { #historicalRecords .card { height: 220vw } .historicalDescription { font-size: 14px } }

/******* SolveYourMysterCTA ********/
#CTASectionApp {
    text-align: center;
    background-color: white;
    padding: 175px 0 60px 0;
    margin-top: -25px;
}
@media (max-width:370px) {  #CTASectionApp { padding: 0 0 60px 0 }  }
@media not all and (min-resolution:.001dpcm) {
    #mapGradient, #description-wrapper::before, #description-wrapper::after { background: unset }
    @media (max-width:1025px)  {  #CTASectionApp { padding-top: 600px } }
    @media (max-width:950px)  {  #CTASectionApp { padding-top: 550px } }
    @media (max-width:880px)  {  #CTASectionApp { padding-top: 480px } }
    @media (max-width:840px)  {  #CTASectionApp { padding-top: 435px } }
    @media (max-width:800px)  {  #CTASectionApp { padding-top: 375px } }
    @media (max-width:510px)  {  #CTASectionApp { padding-top: 300px } }
    @media (max-width:375px)  {  #CTASectionApp { padding-top: 200px } }
    @media (max-width:350px)  {  #CTASectionApp { padding-top: 110px } }
    @media (max-width:290px)  {  #CTASectionApp { padding-top: 60px } }
}
/********** LIFE EXPECTANCY WIDGET **********/
#LifeExpectancyApp { margin-top:40px; padding-bottom: 20px; }
.life-widget { position:relative;}
.life-widget .life-header {margin-bottom: 20px;}
.life-content {margin:23px 0 20px 0; }
.chart-wrap {margin:0 auto; position:relative;}
.chart-heading {text-align:center; font-size:36px; margin-bottom: 5px;}
.chart {width: 100%; }
#chart{margin-bottom: 5px;}
/** CHARTIST & MORE**/

#no-js-error{
    color: #c14139;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
    padding-top: 20px;
    padding-left: 10px;
    padding-right: 10px;
    z-index: 100;
    position: absolute;
    height: 75px;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.4);
}

.ct-series-a .ct-bar, .ct-series-a .ct-line, .ct-series-a .ct-point, .ct-series-a .ct-slice-donut {
    stroke: #4f9bde;
}
.ct-series-b .ct-bar, .ct-series-b .ct-line, .ct-series-b .ct-point, .ct-series-b .ct-slice-donut {
    stroke: #9cbe30;
}

text.ct-axis-title {
    text-anchor: middle;
    font-family: Arial, sans-serif;
    font-size: 14px;
    font-style: italic;
    stroke: none;
    stroke-width: 0;
    fill: rgb(34, 34, 34);
}

div.ct-chart {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.historicalDefaultText:hover{
    text-decoration:none !important;
    color:black;
}
@media (max-width:770px) {  .ct-legend { width: 100%!important }  }

/**NOTABLES**/
#NotablesApp { padding: 30px 0; background-color: white; }
.notables-widget .section-heading { width: 650px; }
@media (max-width:700px) {  .notables-widget .section-heading { width: unset }  }

/**LoPPLinking**/
#LoPPLinkingApp { padding: 30px 0 1px 0; background-color: white; }
#LoPPLinkingApp .card:hover {
    box-shadow: 0 0 0 3px #a9a9a9;
    cursor: pointer;
    text-decoration: none;
}

.loppLinking {
    display: flex;
    flex-direction: column;
    margin-bottom: 30px;
}

.loppLinks {
    display: flex;
    width: 100%;
    flex-wrap: wrap;
}

.loppLink {
    width: 48%;
    padding-right: 20px;
}
@media (max-width: 767px) {  .loppLink { width: 100%; padding-right: 0 }  }

/*********** LOOKUP WIDGET **************/
#FamilyInsightsFormApp { background-color:#e7e7e7; margin-bottom: -35px }
.lookup-widget{padding-top: 30px; padding-bottom: 30px;}
.addName {line-height: 30px; display: inline;}
#lookupSurnameWarningIcon {display: inline; visibility: hidden;}
#lookupSubmit{padding: 6.5px 44px 6px; font-size: large; float: left;}
.lookupNameLabel{display: inline-flex;}
#txtLookupSurname { height: 40px; }

svg g:nth-child(2) g rect {
    fill: none;
    fill-opacity: 0.5;
    stroke: gray; 
    stroke-width: 0.4;
    stroke-dasharray: 4.5 2.6;
}

svg g:nth-of-type(1) g:nth-of-type(1) rect~g~path,
svg g:nth-of-type(1) g:nth-of-type(2) rect~g~path{
    stroke-width: 15px !important;
  }
svg g:nth-of-type(1) g:nth-of-type(1) rect~g~circle,
svg g:nth-of-type(1) g:nth-of-type(2) rect~g~circle{
    fill: none;
  }

@media only screen and (min-width: 1024px) {
    svg g:nth-child(2) g rect {
        stroke-dasharray: 4.5 1.65;
    }
}

@media only screen and (min-width: 360px) {
    svg g:nth-child(2) g rect {
        stroke-dasharray: 4.5 1.5;
    }
}

div.google-visualization-tooltip{
    padding: 5px;
    width: 200px;
    font-size: 16px;
}

.ancGrid.ffSearchTop.crawlPath ul li{
    display: inline-block;
}

.displayFlex{
    display: flex;
}
.nowrap{white-space: nowrap;}.mr10{margin-right: 10px;}
.capitalize::first-letter{text-transform: capitalize;}

#SaleBanner {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 999;
}

.banner_container {
    width: 100%;
    background-color:  #117FA6;
    padding-top: 12px;
    padding-bottom: 12px;
    background-position: 50%;
    position: relative;
    background-image: url("https://cmsasset.ancestrycdn.com/test/content/dam/onsite/us/2024/Fathers-Day/us-dna-lohp-blade-fathers-day-2024-d.png/jcr:content/renditions/cq5dam.web.1280.1280.png");
    background-repeat: no-repeat;
    min-height: 1px;
    z-index: 1;
}

@media (max-width: 768px) {
    .banner_container {
        background-image: url("https://cmsasset.ancestrycdn.com/test/content/dam/onsite/us/2024/Fathers-Day/us-dna-lohp-blade-fathers-day-2024-m.png/jcr:content/renditions/cq5dam.web.1280.1280.png");
        padding-top: 10px;
        padding-bottom: 10px;
    }
}


.banner_link, .banner_link:link, .banner_link:hover, .banner_link:visited, .banner_link:active{
    text-decoration: none;
}

.banner_content {
    background-color: transparent;
    padding: 0;
    margin: 0 auto;
}

.banner_header {
    color: white;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    margin-left: 20px;
    margin-right: 20px;
    font: bold 1.7em/1.33 ui-sans, Helvetica Neue, Arial, sans-serifo;
}

@media (max-width: 1024px) {
    .banner_header {
        font-size: 1.5em;
    }
}

@media (max-width: 768px) {
    .banner_header {
        font-size: 1.2em;
    }
}

@media (max-width: 540px) {
    .banner_header {
        font-size: 1.1em;
    }
}