/* Mobile Responsive Design For Live Chatbot Model */

@media only screen and (max-width: 769px) {


    #chat-modal .card-header .kt-portlet__head:first-child {
        display: none;
    }

    .kt-portlet.kt-portlet--head-lg .kt-portlet__head:first-child {
        display: none;
    }

    #chat-modal .card-header .kt-portlet__head {
        padding: 0;
    }   

    #chat-modal .card-header .kt-portlet__head .kt-chat__center {
       margin-left: 0;
    }

    #chat-modal .card-header .kt-portlet__head .kt-chat__center > .p-2 {
        display: none;
    }

    #chat-modal .card-header .kt-portlet__head .kt-chat__center div span.p-2 {
        padding: 0 !important;
        margin-right: 5px;
    }

    #chat-modal .card-header .kt-portlet__head .kt-chat__center div span.p-2:last-child {
         margin-right: 0px;
    }

    #chat-modal .card-header .kt-portlet__head .kt-chat__center div span.p-2 input {
        font-size: 10px !important;
    }

    #chat-modal .card-header .kt-portlet__head {
        /*background-image:linear-gradient(270deg, #007380 0%, #003D5B 100%);*/
      /*  background: linear-gradient(270deg, #007380 0%, #003D5B 100%);*/
        padding: 0;
        /*height: auto !important;*/
        /* border: 1px solid #003D5B;*/
        min-height: auto;
        border-top-left-radius: 38px;
        border-top-right-radius: 38px;
       /* width: 100.5%;*/
        margin-left: -1px;
        margin-right: -1px;
        height:56px !important;
        border-bottom: 1px;
    }

    #chat-modal .card-header {
        height: auto !important;
        box-sizing: border-box;
        padding-left: 0 !important;
        padding-right: 0 !important;
        border-bottom: none;
        background-color: #fff;
        border-top-left-radius: 30px !important;
        border-top-right-radius: 30px !important;
        border: 1px solid #003D5B !important;
        border-bottom: 0px !important;
        border-top: 0px !important;
    }

    #chat-modal .card-footer {
        height: auto;
    }

        #chat-modal .card-footer .kt-link {
            text-align: center;
            color: #003D5B;
            font-size: 12px;
            font-weight: 400;
            line-height: 20px;
        }

    #chat-modal .card-footer .form-outline .row {
         margin-left: 0;
    }

    #chat-modal .card-footer {
        font-size: 12px;
        padding: 5px 5px 5px 5px;
        height: auto;
        border-bottom-right-radius: 30px;
        border-bottom-left-radius: 30px;
    }

    #chat-modal .card-footer .form-outline .row {
        flex-direction: row;
        position: relative;
    }

    .card-footer #input-box {
        /*flex: 0 0 100% ;*/
        flex: 0 1 80% !important;
        /*max-width: 100%;*/
       /* width: 100%;
        padding-right: 40px;*/
    }


    .footer-icons .icon-send.pointer {
        /*position: absolute;
        right: 22px;
        bottom: 5px;*/
    }

    #chat-modal .card-footer span.footer-icons {
        /*margin-bottom: 5px;*/
    }

    #divChatInput.row {
        justify-content: space-around;
        padding: 0 0 0 20px;
    }
}


/* Mobile Responsive Design For Live Chatbot Model Under the width 520px */

@media only screen and (max-width: 520px) {

    #chat-modal .card-footer span.footer-icons {
        flex: 1.1 !important;
        margin-left: 5px;
    }

        #chat-modal .card-footer span.footer-icons i {
            font-size: 19px;
        }
}


/* Mobile Responsive Design For Live Chatbot Model Under the width 420px */

@media only screen and (max-width: 420px) {

    #chat-modal .card-footer span.footer-icons {
        flex: 1.4 !important;
    }

        #chat-modal .card-footer span.footer-icons i {
            font-size: 18px;
        }
}


/* Mobile Responsive Design For Live Chatbot Model Under the width 350px */

@media only screen and (max-width: 350px) {

    #chat-modal .card-footer span.footer-icons {
        flex: 1.5 !important;
    }

        #chat-modal .card-footer span.footer-icons i {
            font-size: 17px;
        }
}

.vw-chat-iframe {
    outline: none !important;
    visibility: visible !important;
    resize: none !important;
    box-shadow: none !important;
    overflow: visible !important;
    background: none !important;
    opacity: 1 !important;
    filter: alpha(opacity=100) !important;
    -mz-opacity: 1 !important;
    -khtml-opacity: 1 !important;
    bottom: 70px !important;
    left: auto !important;
    position: fixed !important;
    border: 0 !important;
    min-width: 300px !important;
    max-height: 800px !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
    -moz-transition-property: none !important;
    -webkit-transition-property: none !important;
    -o-transition-property: none !important;
    transition-property: none !important;
    transform: none !important;
    -webkit-transform: none !important;
    -ms-transform: none !important;
    display: block !important;
    z-index: 99999999999 !important;
    background-color: transparent !important;
    cursor: none !important;
    float: none !important;
    pointer-events: auto !important;
}

@media only screen and (min-width: 600px) {


    .vw-chat-iframe {
        right: 65px !important;
    }
}

.vw-direct-chat-iframe-div-outer {
    xborder: 0.05em solid red;
    width: 100%;
    display: flex;
    justify-content: center;
}

.vw-direct-chat-iframe-div-inner {
    xborder: 0.05em solid black;
}




.vw-direct-chat-iframe {
    outline: none !important;
    visibility: visible !important;
    resize: none !important;
    box-shadow: none !important;
    overflow: visible !important;
    background: none !important;
    opacity: 1 !important;
    filter: alpha(opacity=100) !important;
    -mz-opacity: 1 !important;
    -khtml-opacity: 1 !important;
    border: 0 !important;
    xwidth: 100% !important;
    min-width: 300px !important;
    max-height: 800px !important;
    max-width: none !important;
    padding: 0 !important;
    margin: 0 !important;
    -moz-transition-property: none !important;
    -webkit-transition-property: none !important;
    -o-transition-property: none !important;
    transition-property: none !important;
    transform: none !important;
    -webkit-transform: none !important;
    -ms-transform: none !important;
    display: block !important;
    z-index: 99999999999 !important;
    background-color: transparent !important;
    cursor: none !important;
    float: none !important;
    pointer-events: auto !important;
}

.vw-chat-iframe .is-active 
{
    height: 500px !important;
}

.vw-chat-iframe-div {
    position: absolute;
    bottom: 5px;
    right: 5px;
}


@media only screen and (max-width: 550px) {

    .vw-chat-iframe {
        right: 0px !important;
    }
}

@media only screen and (max-width: 550px) {

    .vw-direct-chat-iframe-div-inner {
        width:100% !important;
        right: 0px !important;
    }

    .vw-direct-chat-iframe {
        width: 100% !important;
    }
}

@media only screen and (min-width: 600px) {


    .vw-direct-chat-iframe-div {
        position: absolute; /*Can also be `fixed`*/
        Xright: 30% !important;
        xright: 0 !important;
        xleft: 0 !important;
    }
}




.vw-chat-icon {
    position: fixed !important;
    cursor: pointer;
    transition: transform .5s;
    right: 10px;
    bottom: 10px;
}

.vw-chat-icon:hover {
    -ms-transform: scale(1.1, 1.1);
    -webkit-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1);
}

.vw-chat-icon:checked {
    -ms-transform: scale(1.1, 1.1);
    -webkit-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1);
}

.modal-content {
/*    border-radius: 5px;
    border: 2px solid !important;
    border-color: whitesmoke !important;*/
}



.dh-one {
    z-index: 99999999999 !important;
    cursor: pointer;
    padding: 15px 0;
}

.dh-kiosk {
    z-index: 99999999999 !important;
    cursor: pointer;
    height: 100% !important;
}

.dh-one video#video {
    width: 100px !important;
    height: 100px !important;
}

.dh-kiosk video#video {
    margin-top: 15px !important;
    width: 100% !important;
    height: 100% !important;
}


@media screen and (max-device-width: 1024px) and (orientation: portrait){ /* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */
    .vw-direct-chat-iframe-div-inner {
        width: 100% !important;
        right: 0px !important;
    }

    .vw-direct-chat-iframe {
        width: 100% !important;
    }

}