.vidComponent {
    width: 100%;
    display: flex;
    position: relative;
    flex-direction: column;
    align-content: center;
    align-items: center;
}

.localVideoScreen {
    position: absolute;
    width: 35%;
    border: 1px solid white;
    z-index: 12;
    right: 0;
    background: black;
    bottom: 0;

}

.remoteVideoScreen {
    width: 100%;
    background: black;
    z-index: 10;
    position: relative;
    height: 300px
}

.vidBtnHolder {
    position: absolute;
    display: flex;
    bottom: 10px;
    z-index: 100;
    border-radius: 7px;
    background: #ffffff;
}

.vidBtn {
    width: 40px;
    height: 40px;
    padding: 5px;
    border-radius: 7px;
    background: transparent;
    margin: 1% 4%;
    pointer-events: none;
}

.vidBtn:hover {
    background: #e9ecef;
    border: 1px solid #393f52;
}

.vidBtn img {
    width: 100%;
}

.vidCallBtn {
    pointer-events: auto;
}

.vidFullscreenBtn {
    pointer-events: auto !important;
}
.vidPipBtn {
    pointer-events: auto !important;
}