.Legal {
    margin:0;
}

.Legal .skip-link-bar {
    position: absolute;
    z-index: 100;
    width: 100%;
    height: 40px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}

.Legal .skip-link {
    position: absolute;
    top: -40px;
    padding: 6px 12px;
    border: 2px solid #FFF503;
    border-radius: 2px;
    background-color: #FFF503;
    color: #000;
    font-weight: bold;
    text-decoration: none;
    outline: none;
}

.Legal .skip-link:focus {
    position: absolute;
    top: 4px;
    left: auto;
    outline: 2px solid #0087fd;
    outline-offset: 1px;
}

.Legal .skip-link:hover {
    text-decoration: underline;
}

.Legal .footerBanner,
.Legal .headerBanner {
    display:block;
    position:absolute;
    left:0;
    right:0;

    background-color:#f1f2f2;
    box-sizing:border-box;
}

.Legal .headerBanner{
    top:0;
    height:125px;
}

.Legal .footerBanner{
    bottom: 0;
    height: 75px;
}

.Legal .legalImg {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    pointer-events: none;
    margin: 0 auto;
    display: block;
}

    .Legal .headerLogo {
        height: 5.3rem;
        padding-top: 22px;
    }

.Legal .footerLogo {
    display: none;
}

.Legal .headerTitle {
    display:inline-block;
    vertical-align:top;
}

.Legal .tabcontainer,
.Legal .legalRequirementHeader {
    display:block;
    position:absolute;
    top:126px;
    left:0;
    right:0;
    text-align: center;
}
.Legal .tabcontainer {
    /*max-height: 61px;*/
    overflow-x: auto;
    width: auto;
    white-space: nowrap
}

.Legal .legalRequirementHeader {
    padding-top: 20px;
    font: 18px 'Arial';
    font-weight: bold;
    color:#4d4d4f;
}

.Legal .copyrightText {
    text-align: center;
    font: 12px 'Arial';
    color: #4d4d4f;
    padding: 17px 0;
}

.Legal .tab {
    display:inline-block;
    font: 18px 'Arial';
    font-weight: bold;
    color:#4d4d4f;
    padding:20px 10px 4px 10px;
}

.Legal .tab:hover {
    cursor: pointer;
}

.Legal .tab-selected {
    color:#3067db;
    border-bottom:4px solid #3067db;
    padding-bottom:0;
}

.Legal .tab:focus-visible {
    outline: 2px solid #0087FD;
    outline-offset: -2px;
}

.Legal .docframecontainer {
    position:absolute;
    left:0;
    right:0;
    bottom:76px;
    top:192px;
    -webkit-overflow-scrolling: touch;
}

.Legal .docframe {
    width:100%;
    height:100%;
    display:block;
}
/*width taken from rupture, height is kinda arbitrary*/
@media all and (min-width:768px) and (min-height: 600px) {
    .Legal .headerBanner {
        height: 160px;
    }

    .Legal .footerBanner {
        height: 100px;
    }

    .Legal .tabcontainer,
    .Legal .legalRequirementHeader {
        top: 161px;
    }

    .Legal .headerLogo {
        height: 6.2rem;
        padding-top: 32px;
    }

    .Legal .docframecontainer {
        top: 240px;
        bottom: 201px;
    }
    .Legal .footerLogo {
        height: 24px;
        padding: 28px 0 0 0;
        display: block;
    }
}

@media all and (max-width:500px) {

    .Legal .headerBanner {
        height: 6rem;
    }

    .Legal .tab {
        padding: 0em 10px 4px 10px;
    }

    .Legal .headerLogo {
        height: 4.4rem;
        padding-top: 1rem;
    }



}