.tab-pane {
    position: relative;
}
#myTabContent {
    height: 59vh;
    overflow-y: auto;
}
.copy-button {
    position: absolute;
    top: 40px;
    right: 20px;
}

.scrollable-container {
    height: 65vh;
    overflow-y: auto;
    position: relative;
}

.api-demo-switcher {
    border: 1px solid #0d6efd;
    border-radius: .25rem;
}

.api-demo-switcher button#api {
    border-radius: 0 .25rem .25rem 0;
}

.api-demo-switcher button#demo {
    border-radius: .25rem 0 0 .25rem;
}

.input-container {
    position: fixed;
    bottom: 30px;
    width: 59vw;
    background: #fff;
}
.response-content{
    padding-bottom:30px;
}
.user-message {
    overflow: hidden;
}

.user-message p {
    background: #0d6efd;
    max-width: 70%;
    float: right;
    padding: 10px;
    color: #fff;
    border-radius: 20px 20px 0 20px;
    min-width: 50px;
}

.user-message p span {
    display: block;
    overflow: hidden;
    white-space: pre-line;
}

.system-message span {
    white-space: pre-line;
}

.user-message p img {
    max-width: 300px;
    max-height: 300px;
    border-radius: 20px 20px 0 0px;
}

#uploadImage {
    display: none;
}

@media only screen and (max-width:767px) {
    .input-container {
        width: auto;
        left: 10%;
        right: 10%;
        z-index: 3;
        position: sticky;
        margin-bottom:0px !important
    }
    .response-content{
        min-height:50vh;
    }
}
@media only screen and (max-width:600px) {
    .input-container {
        width: auto;
        left: 5%;
        right: 5%;
    }    
}