﻿/* CUSTOM */
@import url(https://fonts.googleapis.com/css?family=Oswald:400,300);
@import url(https://fonts.googleapis.com/css?family=Open+Sans);
.popup-box { background-color: #fff; border-bottom: 3px solid rgb(0, 171, 163); bottom: 10px; display: none; height: 98%; position: fixed; right: 5px; width: 540px; box-shadow: #0f1010 -1px 0px 17px -8px; z-index: 9999 !important; border-radius: 10px; }
.round.hollow { position: fixed; bottom: 23px; right: 15px; z-index: 999; }
    .round.hollow a { }
        .round.hollow a img { width: 70px; }
.popup-box-on { display: block !important; }
.popup-box .popup-head { background-color: rgb(0, 171, 163); font-size: 1.4rem; padding: 5px; width: 100%; margin: 0; color: #0a1b38; border-radius: 10px 10px 0 0; height: 73px; z-index: 999; position: relative; }

    .popup-box .popup-head .popup-head-left,
    .popup-box .popup-head .popup-head-right { font-weight: 500; line-height: 20px; }

.bg_none i { border: 1px solid #ff6701; border-radius: 25px; color: #ff6701; font-size: 17px; height: 33px; line-height: 30px; width: 33px; }
.bg_none:hover i { border: 1px solid #000; border-radius: 25px; color: #000; font-size: 17px; height: 33px; line-height: 30px; width: 33px; }
.bg_none { background: rgba(0, 0, 0, 0) none repeat scroll 0 0; border: medium none; }
.popup-box .popup-head .popup-head-right { margin: 0; position: absolute; left: 87%; top: 10px; }
.popup-head-left img { width: 70px; }
.popup-head-left span { /*background-color: white; position: relative; padding: 8px; border-radius: 30px; height: 56px; display: inline-block; width: 56px;*/ }
.connectivityStatus { position: relative; top: -23px; left: 72px; font-size: .75rem; color: #d3d1d1; }
.popup-messages-footer > textarea { border-bottom: 1px solid #b2b2b2 !important; height: 34px !important; margin: 7px; padding: 5px !important; border: medium none; width: 95% !important; }
.popup-messages-footer { background: #fff none repeat scroll 0 0; bottom: 0; position: absolute; width: 100%; }
    .popup-messages-footer .btn-footer { overflow: hidden; padding: 2px 5px 10px 6px; width: 100%; }
.simple_round { background: #d1d1d1 none repeat scroll 0 0; border-radius: 50%; color: #4b4b4b !important; height: 21px; padding: 0 0 0 1px; width: 21px; }
.popup-box .popup-messages { overflow: auto; bottom: 30px; position: absolute; width: 100%; top: 83px; }
.direct-chat-messages { overflow: auto; transform: translate(0px, 0px); }
.popup-messages .chat-box-single-line { border-bottom: 1px solid #a4c6b5; height: 12px; margin: 7px 0 20px; position: relative; text-align: center; }
.popup-messages abbr.timestamp { background: #3f9684 none repeat scroll 0 0; color: #fff; padding: 0 11px; }
.popup-head-right .btn-group { display: inline-flex; margin: 0 8px 0 0; vertical-align: top !important; }
.chat-header-button { background: transparent none repeat scroll 0 0; font-size: 22px; height: 30px; width: 25px; border: 0px; border-top: 3px solid #0a1b38; }
    .chat-header-button span { color: #4b7d73; }
.popup-head-right .btn-group .dropdown-menu { border: medium none; min-width: 122px; padding: 0; }
    .popup-head-right .btn-group .dropdown-menu li a { font-size: 12px; padding: 3px 10px; color: #303030; }
.popup-messages abbr.timestamp { background: #3f9684 none repeat scroll 0 0; color: #fff; padding: 0 11px; }
.popup-messages .chat-box-single-line { border-bottom: 1px solid #a4c6b5; height: 12px; margin: 7px 0 20px; position: relative; text-align: center; }
.popup-messages .direct-chat-messages { height: 99%; position: relative; }
.popup-messages .direct-chat-text { background: #dfece7 none repeat scroll 0 0; border: 1px solid #dfece7; border-radius: 2px; color: #1f2121; }
.popup-messages .direct-chat-timestamp { color: #fff; opacity: 0.6; }
.popup-messages .direct-chat-name { font-size: 15px; font-weight: 600; margin: 0 0 0 49px !important; color: #fff; opacity: 0.9; }
.popup-messages .direct-chat-info { display: block; font-size: 12px; margin-bottom: 0; }
.popup-messages .big-round { margin: -9px 0 0 !important; }
.popup-messages .direct-chat-img { border: 1px solid #fff; background: #3f9684 none repeat scroll 0 0; border-radius: 50%; float: left; height: 40px; margin: -21px 0 0; width: 40px; }
.direct-chat-reply-name { color: #fff; font-size: 15px; margin: 0 0 0 10px; opacity: 0.9; }
.direct-chat-img-reply-small { border: 1px solid #fff; border-radius: 50%; float: left; height: 20px; margin: 0 8px; width: 20px; background: #3f9684; }
div.webchat__basic-transcript { padding: 0 7px; }

.popup-messages .direct-chat-msg { margin-bottom: 10px; position: relative; }

.popup-messages .doted-border::after { background: transparent none repeat scroll 0 0 !important; border-right: 2px dotted #fff !important; bottom: 0; content: ""; left: 17px; margin: 0; position: absolute; top: 0; width: 2px; display: inline; z-index: -2; }

.popup-messages .direct-chat-msg::after { background: #fff none repeat scroll 0 0; border-right: medium none; bottom: 0; content: ""; left: 17px; margin: 0; position: absolute; top: 0; width: 2px; display: inline; z-index: -2; }
.direct-chat-text::after, .direct-chat-text::before { border-color: transparent #dfece7 transparent transparent; }
.direct-chat-text::after, .direct-chat-text::before { -moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; border-color: transparent #d2d6de transparent transparent; border-image: none; border-style: solid; border-width: medium; content: " "; height: 0; pointer-events: none; position: absolute; right: 100%; top: 15px; width: 0; }
.direct-chat-text::after { border-width: 5px; margin-top: -5px; }
.popup-messages .direct-chat-text { background: #dfece7 none repeat scroll 0 0; border: 1px solid #dfece7; border-radius: 2px; color: #1f2121; }
.direct-chat-text { background: #d2d6de none repeat scroll 0 0; border: 1px solid #d2d6de; border-radius: 5px; color: #444; margin: 5px 0 0 50px; padding: 5px 10px; position: relative; }

#webchat { height: 99%; position: absolute; width: 100%; }
    #webchat .spinner-border { position: relative; top: 50%; left: 45%; }
        #webchat .spinner-border h2 { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
div#webchat > div, div#webchat > div > div, .webchat__send-box__main { background-color: #fff !important; }
.webchat__send-box__main { border: 1px solid rgb(0, 171, 163) !important; box-shadow: 1px 1px 6px 0px rgba(0,0,0,0.3); border-radius: 10px; width: 97%; position: relative; left: 7px; }
    .webchat__send-box__main button { background-color: transparent !important; margin-top: 6px !important; }
        .webchat__send-box__main button:hover { background-color: transparent !important; }
.webchat__icon-button__shade { background-color: transparent !important; }
form.webchat__send-box-text-box { }
.webchat__send-box-text-box__input { border: 1px solid #efeded !important; padding: 5px !important; border-radius: 5px !important; font-size: 1rem !important; }
.webchat__send-button { height: 43%; margin: 11px 0px 0 -10px; padding: 6px !important; }

.concentPopup { display: none; background-color: #eceff1; position: fixed; bottom: 5px; right: 5px; width: 380px; border-bottom: 3px solid rgb(0, 171, 163); z-index: 999; height: 99%; }
    .concentPopup .concentPopupIcon { background-color: #eceff1; border-radius: 250px 250px 250px 250px; width: 60px; height: 60px; position: absolute; top: -37px; left: 12px; border: 2px solid #fff; }
        .concentPopup .concentPopupIcon img { width: 56px; margin: 1px 0px 0 2px; }
    .concentPopup h1 { color: #1c372a; padding: 7px 0 7px 10px; font-size: 16px; font-weight: bold; background-color: rgb(0, 171, 163); text-align: left; margin: 0; }
    .concentPopup .concentPopupContent { padding: 12px; overflow-y: auto; margin: 0 0; width: 94%; float: left; }
        .concentPopup .concentPopupContent p { font-size: 14px; line-height: 20px; text-align:left; }
    .concentPopup .concentPopupButtons .btn-info { color: #FFF; background-color: rgb(0, 171, 163); border-color: rgb(0, 171, 163); border-radius: 2rem; /*padding: 0.65rem 1rem;*/ }
    .concentPopup .concentPopupPolicy { margin: 15px 0 123px 0; font-size: 13px; }
        .concentPopup .concentPopupPolicy a { color: rgb(0, 171, 163); }

.webchat__stacked-layout__avatar-gutter { margin-bottom: 6px; width: 0% !important; }
.webchat__stacked-layout__main { display: block !important; }
.webchat__bubble__nub-pad { display: none !important; }
.webchat__initialsAvatar { background-color: rgb(0, 171, 163) !important; width: 100px !important; }
.webchat__initialsAvatar__initials { color: #000; margin-top: -17px !important; }
.webchat__defaultAvatar { height: 22px !important; background: rgb(0, 171, 163) !important; border-radius: 6px !important; left: -10px; -moz-border-radius: 6px !important; -webkit-border-radius: 6px !important; width: 100px !important; }
.webchat__stacked-layout__content { margin-left: -9px; }
.webchat__stacked-layout__message { border-radius: 6px !important; -moz-border-radius: 6px !important; -webkit-border-radius: 6px !important; }
.webchat__stacked-layout__message-row .webchat__bubble--from-user { color: #000 !important; border-width: 0px; border-radius: 6px !important; -moz-border-radius: 6px; -webkit-border-radius: 6px !important; }
    .webchat__stacked-layout__message-row .webchat__bubble--from-user .webchat__bubble__content { background-color: rgb(220, 228, 231) !important; color: #000 !important; border: none !important; }
        .webchat__stacked-layout__message-row .webchat__bubble--from-user .webchat__bubble__content p { color: #000 !important; font-size: 1.1rem !important; line-height: 1.2rem; text-align:left; }

.webchat__stacked-layout__content .webchat__bubble .webchat__bubble__content { color: #000 !important; border-radius: 0px 6px 6px 0px !important;  -moz-border-radius: 0px 6px 6px 0px !important; -webkit-border-radius: 0px 6px 6px 0px !important; }
    .webchat__stacked-layout__content .webchat__bubble .webchat__bubble__content .ac-adaptiveCard { padding: 10px !important; }
    .webchat__stacked-layout__content .webchat__bubble .webchat__bubble__content .ac-textBlock { color: #000 !important; font-size: 1.1rem !important; line-height: 1.2rem; }
.webchat__bubble__content ul li, .webchat__bubble__content ol li { color: #000 !important; }
.webchat__bubble__content a { color: #000 !important; }
.webchat__bubble__content .webchat__text-content { font-size: 1.1rem !important; line-height: 1.2rem; text-align:left; }
.webchat__bubble__content { background: rgb(162, 218, 215) !important; color: #000 !important; }
div.ac-container.ac-adaptiveCard .ac-actionSet button { background: #FFFFFF !important; border: 1px Solid #EDEDED !important; border-radius: 6px; color: #000 !important; font-size: 1.1rem !important; line-height: 1.2rem; }
    div.ac-container.ac-adaptiveCard .ac-actionSet button:hover, div.ac-container.ac-adaptiveCard .ac-actionSet button:active, .ac-pushButton[aria-pressed="true"] { font-size: 1.1rem !important; line-height: 1.2rem; background-color: rgb(0, 171, 163) !important; border: 1px Solid rgba(255,255,255,0); color: white !important; border-radius: 6px; }
    div.ac-container.ac-adaptiveCard .ac-actionSet button div { overflow: visible !important; text-overflow: unset !important; white-space: initial !important; text-align: left !important; }
div.webchat__send-box__main button svg { top: 3px; }
.webchat__stacked-layout__nub-pad { display: none; }
#reloadChatBox { cursor: pointer; position: absolute; top: -5px; left: -18px; }
    #reloadChatBox img { width: 20px; }
button.webchat__suggested-actions__button { background-color: #f9f9f9 !important; border-color: #f9f9f9 !important; padding: 0 !important; margin: 0 !important; width: 75px !important; border-radius: 6px !important; }
    button.webchat__suggested-actions__button:hover { background-color: rgb(0, 171, 163) !important; border-color: rgb(0, 171, 163) !important; padding: 0 !important; margin: 0 !important; width: 75px !important; }
span.webchat__suggested-action__text, span.webchat__suggested-actions__button-text { color: rgb(0, 171, 163) !important; position: relative; padding: 0px 0px; width: 100%; height: 100%; margin: 10px 0 0 0; }
    span.webchat__suggested-action__text:hover, span.webchat__suggested-actions__button-text:hover { color: rgb(220, 228, 231) !important; position: relative; padding: 0px 0px; width: 100%; height: 100%; margin: 10px 0 0 0; }
.react-film__main:before { text-align: left; content: "🌟 How was my answer? Your feedback will help me improve. \a 🌟 Πώς ήταν η απάντησή μου; Η ανατροφοδότησή σας θα με βοηθήσει να βελτιωθώ."; margin: 15px 11px 0 11px; color: #000; font-size: 0.76rem; position: relative; width: 80%; display: block; white-space: pre-wrap; }
.poweredBy { position: absolute; bottom: 0px; left: 40%; font-size: .63rem; }
    .poweredBy span { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; }
.welcomePopUpMsg { background-color: #FFF; position: fixed; bottom: 98px; right: 19px; z-index: 999; width: 260px; font-size: .93rem; border: 1px solid #d7d7d7; border-radius: 10px; box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, .1); padding: 8px; line-height: 23px; animation: hideAnimation 2sease-in 10s; animation-fill-mode: forwards; text-align: left; }
.closeWelcomePopUpMsg { position: absolute; right: -10px; top: -9px; background-color: lightgrey !important; line-height: 0; padding: 8px 4px 8px 4px !important; border-radius: 10px; cursor: pointer !important; }
.webChatIframe { background-color: #FFF; overflow: hidden; width: 100%; height: 100%; position: absolute; border: 0; }
.text-center { text-align: center !important; }
p { margin-top: 0; margin-bottom: 1rem; }
button { cursor: pointer; }

@keyframes hideAnimation {
    to { visibility: hidden; }
}

.poweredBy img { width: 3rem; position: relative; bottom: 1px; left: 1px; }

@media only screen and (max-width: 600px) {
    .popup-box { width: 97%; }
}
