html,
body {
    height: 100%;
}

@import url('https://fonts.googleapis.com/css2?family=PT+Serif:ital,wght@0,400;0,700;1,400;1,700&display=swap');

* {
    font-family: 'PT Serif', serif;
}


.btn-transition {
    transition: 500ms ease-in-out;
}

.fit-cover {
    object-fit: cover;
}


.h-auto {
    height: auto !important;
}




/* TYPEWRITER */
.typewriter {
    color: #fff;
    /* font-family: monospace; */
    overflow: hidden;
    /* Ensures the content is not revealed until the animation */
    border-right: .15em solid orange;
    /* The typwriter cursor */
    white-space: nowrap;
    /* Keeps the content on a single line */
    margin: 0 auto;
    /* Gives that scrolling effect as the typing happens */
    /* letter-spacing: .15em; */
    /* Adjust as needed */
    animation:
        typing 3.5s 2s steps(25, end) infinite,
        blink-caret .5s step-end infinite;
}

/* The typing effect */
@keyframes typing {

    0% {
        width: 0
    }

    /* Finish changes by here */
    80% {
        width: 100%
    }

    /* Between 20% and 100%, nothing changes */
    100% {
        width: 100%
    }
}

/* The typewriter cursor effect */
@keyframes blink-caret {

    from,
    to {
        border-color: transparent
    }

    50% {
        border-color: orange
    }
}


/* SPIN */

.animation-spin {
    /* animation: spin 2s infinite linear; */
    animation: spin 2s infinite ease-in-out;
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(359deg);
    }

}

.text-hover-white:hover {
    color: white;
}

.nav-link.rounded-pill {
    padding-top: 2px;
    padding-bottom: 2px;
}

.abs-container {
    top: 75px;
    left: 250px;
    bottom: 0px;
    right: 0px;
    padding: 3rem !important;
}

.abs-pagination {
    margin-left: 250px !important;
}

.profile-picture-lg {
    height: 200px;
    width: 200px;
    object-position: 50% 0%;
    padding: 10px;
}

.profile-picture-sm {
    height: 105px !important;
    width: 105px !important;
    object-position: 50% 0%;
    padding: 2.5px;
    font-size: 105px;
}

.stakeholder-picture {
    height: 200px;
}

.linkedin-logo {
    height: 25px;
    filter: brightness(0) invert(1)
}

.user-icon {
    font-size: 0em;
}

.users-icon {
    font-size: 3em;
}

.investor-picture-portrait {
    /* height: 150px; */
    height: 80%;
}

.investor-picture-landscape {
    /* width: 250px; */
    width: 80%;
}

.e-cell-carousel {
    width: 100%;
}

.connect-picture {
    height: 100px;
    object-fit: contain;
}

.e-cell-member {
    height: 100px;
    width: 100px;
    padding: 5px;
}

.fs-13px {
    font-size: 13px;
}

@media only screen and (max-width: 991px) {
    .abs-container {
        top: 50px;
        left: 0px;
        bottom: 0px;
        right: 0px;
        padding: 1rem !important;
    }

    .abs-pagination {
        margin-left: 0px !important;
    }

    .lead {
        font-size: 16px;
        text-align: center;
    }

    .profile-picture-lg {
        height: 100px;
        width: 100px;
        padding: 5px;
    }

    .profile-picture-sm {
        height: 50px !important;
        width: 50px !important;
        object-position: 50% 0%;
        padding: 1px;
        font-size: 30px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    /* h1 {
        font-size: 22px !important;
    } */

    h2 {
        font-size: 20px;
        margin-bottom: 0.01rem;
    }

    h4 {
        font-size: 16px;
        margin-bottom: 0.01rem;
    }

    h6 {
        margin-bottom: 0px;
    }

    p {
        margin-bottom: 0.5rem !important;
    }

    .py-5 {
        padding-top: 1rem !important;
        padding-bottom: 1rem !important;
    }

    .mb-5 {
        margin-bottom: 1rem !important;
    }

    .linkedin-logo {
        height: 15px;
    }

    .stakeholder-picture {
        height: 150px;
    }



    .users-icon {
        font-size: 1.5em;
    }



    .investor-picture-portrait {
        height: 100px;
    }

    .investor-picture-landscape {
        width: 85%;
    }

    .e-cell-carousel {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .connect-picture {
        height: 50px;
        object-fit: contain;
    }

    .alert {
        margin-bottom: 0.5rem;
    }

    .e-cell-member {
        height: 50px;
        width: 50px;
        padding: 2.5px;
    }

    .offcanvas.show {
        visibility: visible;
    }
}