html, body {
    height: 145%;
    font-family: 'Source Code Pro', monospace;
}

.nav-link {
    color: #dd7;
}

.nav-link:hover {
    color: #aa4;
}

#cover {
    top: -10%;
    background-size: cover;
    box-shadow: 100px;
}

.tooltip {
    left: 0px;
}

.tooltip-inner {
    background-color: #343a40;
}
.arrow::before {   
    border-bottom-color:#343a40 !important;
    border-top-color:#343a40 !important;
}

.col {
    padding-left: 0.25em;
    padding-right: 0.25em;
}

#mainline {
    font-weight: bold;
    font-size: 1.25em;
}

#links img {
    max-width: 50px;
    width:100%;
}

.skills .card, #mainskill{
    background-color: rgba(20, 20, 20, 0.5);
    box-shadow: 4px 4px 15px rgba(10, 10, 10, 0.8);
    border-radius: 8px;
}

.skills .card-body, #mainskill .card-body {
    font-size: 0.8rem;
}

#mainskill {
    min-width:25%;
    max-width:50%;
}

footer {
    background-color: rgba(20, 20, 20, 0.4);
}

.nav-link.inline { /*reset for footer*/
    display: inline;
    padding: 0;
}

footer, .smaller {
    font-size: 0.75em;
}

.project {
    font-weight: bold;
}

.info-segment .large-content span {
    margin-left: 2em;
}

.splitview {
    margin-right: 0px !important;
    margin-left: 0px !important;
}

@media (max-width: 767px) {
    .skills {
        width: 100%;
        font-size: 0.75rem;
    }

    .skills .card-body {
        display:none;
    }

    .headings { font-size: 1.25rem; }
    .large-content { font-size: 0.75em; width: 100%; }

    .splitview { width: 100%; text-align: center !important; padding: 2rem !important;}

    .p-5-flex { padding: 2rem !important; } /*patch back padding since p-5 is too much*/
}

@media (min-width: 768px) {
    .headings { font-size: 1.5rem; }
    .large-content { font-size: 0.75em; width: 75%; }
    .skills { width: 65%; }

    .splitview { width: 50%; }
    .info-subsegment { display: flex; }

    .p-5-flex { padding: 5rem !important; }
}
@media (min-width: 992px) {
    .headings { font-size: 1.75rem; }
    .large-content { font-size: 1em; }
}
@media (min-width: 1200px) {
    .headings { font-size: 2rem; }
    .large-content { font-size: 1.25em; }
}