.ui-panel-position-left > .ui-panel-inner {bottom: 30px!important; }

#leftpanel { background: #fff; }
.ui-header img { margin: auto; width: 3.8em; display: block; }
.ui-content { width: 100%; box-sizing: border-box; margin: 0 auto; }
#gestisci_privacy .ui-content { padding: 0; }
.nd2-sidepanel-profile { margin-bottom: 0; }
.profile-thumbnail { border-radius: 50%; width: 100px; height: 100px; }
.hide { display: none!important; }
#leftpanel .ui-collapsible-themed-content .ui-collapsible-content { border: none; }
#newButtonIcon, #backButtonIcon { 
    position: fixed; bottom: 5em; right: 1em; background: #03a9f4; cursor: pointer; z-index: 1998; color: white; width: 55px; height: 55px; display: none;
-webkit-transition: all 700ms cubic-bezier(0.405, 0, 0.315, 1); /* older webkit */
-webkit-transition: all 700ms cubic-bezier(0.405, -0.600, 0.315, 1.650); 
   -moz-transition: all 700ms cubic-bezier(0.405, -0.600, 0.315, 1.650); 
     -o-transition: all 700ms cubic-bezier(0.405, -0.600, 0.315, 1.650); 
        transition: all 700ms cubic-bezier(0.405, -0.600, 0.315, 1.650); /* custom */

-webkit-transition-timing-function: cubic-bezier(0.405, 0, 0.315, 1); /* older webkit */
-webkit-transition-timing-function: cubic-bezier(0.405, -0.600, 0.315, 1.650); 
   -moz-transition-timing-function: cubic-bezier(0.405, -0.600, 0.315, 1.650); 
     -o-transition-timing-function: cubic-bezier(0.405, -0.600, 0.315, 1.650); 
        transition-timing-function: cubic-bezier(0.405, -0.600, 0.315, 1.650); /* custom */
}
#newButtonIcon.fadeOut, #backButtonIcon.fadeOut {  
    right: -9em;
}

.red-button { background: #f54646!important; color: #fff!important; }
.green-button  { background: green !important; color: #fff!important; }
.blue-button  { background: blue !important; color: #fff!important; }
.gray-button  { background: #e6e6e6 !important; color: #000!important; }
.gray-button.disabled { cursor: default; }

.ui-panel-dismiss.ui-panel-dismiss-open {z-index: 1999;}
.ui-page-theme-a .ui-footer { color: #8c8b8b; }

.ui-footer { height: 55px; }
.ui-footer .ui-navbar a { margin-top: 0; padding: 1em; }

    .ui-footer .ui-navbar a i { position: relative; font-size: 1.5em; }

    .ui-footer .ui-navbar a span { font-size: 0.9em; }

.footerIconBadge { position: absolute; top: -2px; right: 0; height: 8px; width: 8px; border-radius: 1em; background: red; }
.openAssistant .footerIconBadge { background: #8c8b8b; }
.openAssistant.newMessages .footerIconBadge { background: red;  }

.ui-header-fixed { background-color: rgb(3, 169, 244); color: rgb(255, 255, 255); top: 0px; }

.ajaxLoader { position: fixed; width: 100%; height: 100%; z-index: 9999; pointer-events: none; display: none; background: transparent; background: rgba(210, 205, 206, 0.23); }

    .ajaxLoader img { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 200px; height: 200px; }
.center { text-align: center!important; }
.clear { height: 0; width: 0; clear: both; }

/*#rightPanel { background: #fff; }
    #rightPanel .ui-header a { color: #444 !important; }
.chatBanner { text-align: center; background: #fdf9de; padding: 0.5em; margin: 0.5em; border-radius: 0.5em; box-shadow: 0px 0px 1px rgba(0,0,0,0.25); border: 1px solid #ddd; }
.chatBubble { background: #daf1d8; padding: 1em; display: inline-block; margin-bottom: 0.1em; border-radius: 0.4em; clear: both; }
.leftBubble { float: left; }
.rightBubble { float: right; }

.popupFooterLeft { float: left; width: 80%; }
.popupFooterRight { float: left; width: 20%; color: #027fb7; text-shadow: 2px 1px 1px rgba(0,0,0,0.5); }*/
.ap-input-icon { display: none; }

ul.logoutButtonMob { display: block; position: fixed; bottom: 0; width: 100%; border-top: 0.2em solid #ddd; background: #f3f3f3; z-index: 10; }
    ul.logoutButtonMob li { text-align: center !important; cursor: pointer; }
    ul.logoutButton { display: none; }
.bold { font-weight: bold; }
.blueColDark { background: #c1ecff; }
.blueColLight { background: #dcf2fb; }
.customOverlay { display: none; position: fixed; top: 0; background: rgba(171, 171, 171, 0.53); width: 100%; height: 100%; z-index: 9999; left: 0; }
.custolgialog { position: absolute; background: #fff; border-radius: 4px; padding: 0 0 1em 0; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 95%; text-align: center; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); }
.custolgialog .customBtn { cursor: pointer; padding: 0.4em; color: #fff; background: #03A9F4; width: 35%; margin: auto; text-align: center; border-radius: 2px; }
.custolgialog h4 { background: #03A9F4; margin-top: 0; padding: 0.4em; border-top-left-radius: 4px; border-top-right-radius: 4px; color: #fff; }

.customOverlayWithButtons { display: none; position: fixed; top: 0; background: rgba(171, 171, 171, 0.53); width: 100%; height: 100%; z-index: 9999; }
.custolgialogWithButtons { position: absolute; background: #fff; border-radius: 4px; padding: 0 0 1em 0; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 95%; text-align: center; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); }
.custolgialogWithButtons .customBtn { cursor: pointer; padding: 0.4em; color: #fff; background: #03A9F4; width: 48%; text-align: center; border-radius: 2px; box-sizing: border-box; float: left; }
.custolgialogWithButtons .customBtn.IDno { margin-left: 4%; }
.customBtnContainerWithButtons { margin-top: 1em; width: 80%; margin: auto; padding: 1.5em 0;}
.custolgialogWithButtons h4 { background: #03A9F4; margin-top: 0; padding: 0.6em; border-top-left-radius: 4px; border-top-right-radius: 4px; color: #fff; }
.custolgialogWithButtons p { margin-top: 1em; }

#toast { top: inherit; }
#toast p { padding-left: 1em; }
.floatright { float: right;}
.rightContent { width: 60%; float: left; }
.leftContent { width: 40%; float: left; }

.ui-controlgroup.listviewMenu { display: inline; }

label.required::after, span.required::after, div.required::after { content: "*"; color: red; font-weight: bold; position: absolute; margin-left: 2px; }
label.required.hideRequired::after, span.required.hideRequired::after, div.required.hideRequired::after { content: ""; color: red; font-weight: bold; position: absolute; margin-left: 2px; }


legend.required::after, span.required::after, div.required::after { content: "*"; color: red; font-weight: bold; position: absolute; margin-left: 2px; }
legend.required.hideRequired::after, span.required.hideRequired::after, div.required.hideRequired::after { content: ""; color: red; font-weight: bold; position: absolute; margin-left: 2px; }

.ui-popup-container { z-index: 3000 !important; }


.mb5 {margin-bottom:0.5em; }

.assistantOverlay { top: 100vh; display: block; position: fixed; background: white; width: 100%; height: 120%; z-index: 9999; 
-webkit-transition: all 700ms cubic-bezier(1.000, 0, 0.050, 1); /* older webkit */
-webkit-transition: all 700ms cubic-bezier(1.000, -0.215, 0.050, 1.190); 
   -moz-transition: all 700ms cubic-bezier(1.000, -0.215, 0.050, 1.190); 
     -o-transition: all 700ms cubic-bezier(1.000, -0.215, 0.050, 1.190); 
        transition: all 700ms cubic-bezier(1.000, -0.215, 0.050, 1.190); /* custom */

-webkit-transition-timing-function: cubic-bezier(1.000, 0, 0.050, 1); /* older webkit */
-webkit-transition-timing-function: cubic-bezier(1.000, -0.215, 0.050, 1.190); 
   -moz-transition-timing-function: cubic-bezier(1.000, -0.215, 0.050, 1.190); 
     -o-transition-timing-function: cubic-bezier(1.000, -0.215, 0.050, 1.190); 
        transition-timing-function: cubic-bezier(1.000, -0.215, 0.050, 1.190); /* custom */
}
.assistantOverlay.show { top: 0; background: rgba(171, 171, 171, 0.53);}
.assistantDialog { position: absolute; background: #fff; border-radius: 4px; padding: 0 0 1em 0; top: 1em; left: 50%; height: calc(100vh - 3em); transform: translateX(-50%); width: 95%; text-align: center; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); }
    .assistantDialog .assistantHeader { background: #00709a; color: white; }
        .assistantDialog .assistantHeader h3 { margin: 0 auto; padding: 0.4em; width: 50%; font-size: 24px; line-height: 1.2em; font-weight: 400; font-family: "RobotoDraft","Roboto","Helvetica Neue",sans-serif; }
        .assistantDialog .assistantHeader .exitAssistant { color: white; position: absolute; left: 0.5em; top: 0.3em; font-size: 1.8em; }
    .assistantDialog .assistantMessages { overflow-y: auto; height: calc(100vh - 180px); }
    .assistantDialog .messageContainer { display: block; clear: both; max-width: 80%; min-width: 40%; margin: 0.5em; padding: 0.5em; box-sizing: border-box; }
    .assistantDialog .messageContainer .messageContent { padding: 0.3em 0.3em 0.3em 0; }
        .assistantDialog .messageContainer.myMessage { float: right; text-align: left; background: #00b9ff; color: white; border-radius: 1em 0 0 1em; }
        .assistantDialog .messageContainer.theirMessage { float: left; text-align: left; background: #edecec; color: black; border-radius: 0 1em 1em 0; }
        .assistantDialog .messageContainer.myMessage .date { text-align: right; font-size: 0.7em; text-decoration: underline; }
        .assistantDialog .messageContainer.theirMessage .date { text-align: left; font-size: 0.7em; text-decoration: underline; }
    .assistantDialog .assistantFooter {height:100px }
    .assistantDialog .messageInput { width: 80%; float: left; margin: 0.5em; height: 70%; border-radius: 0.5em; background: #f1f1f1; border-color: white; resize: none; }
    .assistantDialog .sendMessage { position: absolute; right: 0.5em; bottom: 1em; font-size: 1.1em; background: #00b9ff; color: white; padding: 0.5em; box-sizing: border-box; border-radius: 0.2em; }
        .assistantDialog .sendMessage i { padding: 0.2em; }


.validationBg { background: #d8767661!important; }

@media only screen and (min-width: 768px) {
    .ui-content { 
        width: 80%!important;
    }
    .custolgialog {
        max-width: 400px;
        width: 100%;
    }
    .ui-content .ui-listview { margin: 0; }
}

@media only screen and (min-width: 1025px) {
    .ui-content { 
        width: 80%!important;
    }

    ul.logoutButton { display: block; }
    ul.logoutButtonMob { display: none; }
    .ui-header img { float: right; margin-right: 1em; }

    body.ui-mobile-viewport {
        overflow-y: scroll;
    }

    .ui-mobile .ui-page {
        position: static;
        width: 75%;
        float: right;
        display: block;
        margin: auto;
    }

    #leftpanel { 
        display: block;
        position: fixed;
        /*top: 57px;*/
        width: 25%
    }

    a[href='#leftpanel'] {
        display: none!important;
    }


    .ui-panel-dismiss.ui-panel-dismiss-open { display: none; }
    .ui-page-theme-a .ui-footer {
        width: 75%;
        left: 25%;
        position: fixed;
        bottom: 0;
        padding-bottom: 0;
    }

    .ui-page-theme-a .ui-header { 
        box-shadow: none;
    }

    .assistantDialog .messageInput {
        width: 93%; 
    }
}

@media only screen and (min-width: 1400px) {
    .ui-mobile .ui-page {
        width: 80%;
    }

    .ui-content { 
        width: 40%!important;
    }

    .ui-page-theme-a .ui-footer {
        width: 80%;
        left: 20%;
    }

    #leftpanel { 
        width: 20%
    }

    .assistantOverlay { top: 100vh; display: block; position: fixed; background: white; width: 20%; height: 120%; z-index: 9999;  right: 0%;
-webkit-transition: all 700ms cubic-bezier(1.000, 0, 0.050, 1); /* older webkit */
-webkit-transition: all 700ms cubic-bezier(1.000, -0.215, 0.050, 1.190); 
   -moz-transition: all 700ms cubic-bezier(1.000, -0.215, 0.050, 1.190); 
     -o-transition: all 700ms cubic-bezier(1.000, -0.215, 0.050, 1.190); 
        transition: all 700ms cubic-bezier(1.000, -0.215, 0.050, 1.190); /* custom */

-webkit-transition-timing-function: cubic-bezier(1.000, 0, 0.050, 1); /* older webkit */
-webkit-transition-timing-function: cubic-bezier(1.000, -0.215, 0.050, 1.190); 
   -moz-transition-timing-function: cubic-bezier(1.000, -0.215, 0.050, 1.190); 
     -o-transition-timing-function: cubic-bezier(1.000, -0.215, 0.050, 1.190); 
        transition-timing-function: cubic-bezier(1.000, -0.215, 0.050, 1.190); /* custom */
}

    .assistantOverlay.show { background: none; width: 20%; top: 2%; right: 0%; }
.assistantDialog { position: absolute; background: #fff; border-radius: 4px; padding: 0 0 1em 0; top: 1em; left: 50%; height: calc(100vh - 3em); transform: translateX(-50%); width: 95%; text-align: center; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); }
    .assistantDialog .assistantHeader { background: #00709a; color: white; }
        .assistantDialog .assistantHeader h3 { margin: 0 auto; padding: 0.4em; width: 50%; font-size: 24px; line-height: 1.2em; font-weight: 400; font-family: "RobotoDraft","Roboto","Helvetica Neue",sans-serif; }
        .assistantDialog .assistantHeader .exitAssistant { color: white; position: absolute; left: 0.5em; top: 0.3em; font-size: 1.8em; }
    .assistantDialog .assistantMessages { overflow-y: auto; height: calc(100vh - 180px); }
    .assistantDialog .messageContainer { display: block; clear: both; max-width: 80%; min-width: 40%; margin: 0.5em; padding: 0.5em; box-sizing: border-box; }
    .assistantDialog .messageContainer .messageContent { padding: 0.3em 0.3em 0.3em 0; }
        .assistantDialog .messageContainer.myMessage { float: right; text-align: left; background: #00b9ff; color: white; border-radius: 1em 0 0 1em; }
        .assistantDialog .messageContainer.theirMessage { float: left; text-align: left; background: #edecec; color: black; border-radius: 0 1em 1em 0; }
        .assistantDialog .messageContainer.myMessage .date { text-align: right; font-size: 0.7em; text-decoration: underline; }
        .assistantDialog .messageContainer.theirMessage .date { text-align: left; font-size: 0.7em; text-decoration: underline; }
    .assistantDialog .assistantFooter {height:100px }
    .assistantDialog .messageInput { width: 80%; float: left; margin: 0.5em; height: 70%; border-radius: 0.5em; background: #f1f1f1; border-color: white; resize: none; }
    .assistantDialog .sendMessage { position: absolute; right: 0.5em; bottom: 1em; font-size: 1.1em; background: #00b9ff; color: white; padding: 0.5em; box-sizing: border-box; border-radius: 0.2em; }
        .assistantDialog .sendMessage i { padding: 0.2em; }
}