.main-chat-loud, .main-chat-mute{float: right;padding: 7px 10px;}

.first-section:hover{cursor:pointer;}

.open-more{bottom:0px;transition:2s;}

.border-chat{border:1px solid #459dd7;margin:0px;}

.first-section{background-color:#459dd7;}

.first-section p{color:#fff;margin:0px;padding:10px 0px;}

.first-section p:hover{color:#fff;cursor:pointer;}

.right-first-section{text-align:right;}

.right-first-section i{color:#fff;font-size:15px;padding:12px 3px;}

.right-first-section i:hover{color:#fff;}

.chat-section ul li{list-style:none;margin-top:10px;position:relative;}

.chat-section{overflow-y:scroll;height:300px;}

.chat-section ul{padding:0px;}

.left-chat img,.right-chat img{width:50px;height:50px;float:left;margin:0px 10px;}

.right-chat img{float:right;}

.second-section{padding:0px;margin:0px;background-color:#F3F3F3;height:300px;}

.left-chat,.right-chat{overflow:hidden;}

.left-chat p,.right-chat p{background-color:#459dd7;padding:10px;color:#fff;border-radius:5px;float:left;width:60%;margin-bottom:20px;}

.left-chat span,.right-chat span{position:absolute;left:70px;top:60px;color:#B7BCC5;}

.right-chat span{left:45px;}

.right-chat p{float:right;background-color:#FFFFFF;color:#459dd7;}

.third-section{border-top:1px solid #EEEEEE;}

.text-bar input{width:90%;margin-left:-15px;padding:10px 10px;border:1px solid #fff;}

.text-bar a i{background-color:#459dd7;color:#fff;width:30px;height:30px;padding:7px 0px;border-radius:50%;text-align:center;}

.left-chat:before{content:" ";position:absolute;top:0px;left:55px;bottom:150px;border:15px solid transparent;border-top-color:#459dd7;}

.right-chat:before{content:" ";position:absolute;top:0px;right:55px;bottom:150px;border:15px solid transparent;border-top-color:#fff;}







  body{background-color:#e9eaed;}

 .chat-sidebar{width:200px;position:fixed;height:100%;right:0px;top:0px;padding-top:10px;padding-bottom:10px;border:1px solid rgba(29, 49, 91, .3);}

 .sidebar-name{padding-left:10px;padding-right:10px;margin-bottom:4px;font-size:12px;}

 .sidebar-name span{padding-left:5px;}

 .sidebar-name a{display:block;height:100%;text-decoration:none;color:inherit;}

 .sidebar-name:hover{background-color:#e1e2e5;}

 .sidebar-name img{width:32px;height:32px;vertical-align:middle;}

 .popup-box{display:none;position:fixed;bottom:0px;right:220px;height:285px;background-color:rgb(237, 239, 244);width:300px;border:1px solid rgba(29, 49, 91, .3);}

 .popup-box .popup-head{background-color:#6d84b4;padding:5px;color:white;font-weight:bold;font-size:14px;clear:both;}

 .popup-box .popup-head .popup-head-left{float:left;}

 .popup-box .popup-head .popup-head-right{float:right;opacity:0.5;}

 .popup-box .popup-head .popup-head-right a{text-decoration:none;color:inherit;}

 .popup-box .popup-messages{height:100%;overflow-y:scroll;}

.main-chat-header{display:none;}

.topbar{display:none;position:absolute;top:60px;right:0;height:100vh;height:100%;}

.topbar_1{display:none;}

.topbar_2{display:none;}	

			

.pop-up-click{
	position: fixed;
	right: 10px;
	bottom:13px;
	background: #f5f5f5;
	border-radius: 50%;
	padding: 5px;
	filter: drop-shadow(rgba(0, 0, 0, 0.4) 0px 1px 6px) drop-shadow(rgba(0, 0, 0, 0.16) 0px 2px 32px);
	border: 1px solid #459dd7;
	width:60px;
	height:60px;
}

.pop-up-click-1{
    position:fixed;
    right:10px;
    bottom:13px;
    right: 10px;
    background: #f5f5f5;
    border-radius: 50%;
    padding: 5px;
    filter: drop-shadow(rgba(0, 0, 0, 0.4) 0px 1px 6px) drop-shadow(rgba(0, 0, 0, 0.16) 0px 2px 32px);
    border: 1px solid #459dd7;
    width:60px;
    height:60px;
 }

.pop-up-cancle{position:fixed;right:10px;bottom:5px;}			

.topbar_1{position:absolute; right:30%; bottom:140px; margin-right: 15px;}			

.topbar_2{position:absolute; right:0%; bottom:74px; margin-right: 15px;}

.topbar{position: absolute;	width: 400px;/*left: 62%;*/}

.pop-up-cancle{display:none;}

.pop-up-click-1{display:none;}

#Start_from_begin_button{display:none;}

.mdc-layout-grid__cell--span-6{display: none;}

.material-icons mdc-toolbar__icon--menu{display: none;}

.material-icons mdc-toolbar__icon--menu	{display: none;}

.mdc-toolbar__title{display: none;}

.mdc-toolbar__row{display: none !important;}

			

/*------- New Chart code -----*/

#Robo_Intro_Div, .close-btn, #roboImg1, .pop-up-click {display:none;}

.close-btn {    right: 333px;    bottom: 65px;}

#browsing {font-size:15px !important;}

.suggestionDiv {margin-left: 45px;}

.chart-start-hold{background-color:#459dd7; width:350px; padding:40px 18px 20px 18px; border-radius:4px 4px 0 0; position:relative;}

.chart-start-hold p{color:#FFF; font-size:14px; font-weight:normal; line-height:140%; padding:0 0; margin:0 0; text-align: center;}			

.chat-secintro{height:160px; width:350px;  padding:40px 18px 20px 18px; background-color:#ff893c; border-radius:4px 4px 0 0;}

.chat-secintro-nm{width: 100%; position: absolute; bottom: 50px;  left: 0px; border-top: 0px; border-left:0;  border-right: 0;  border-bottom: 1px solid #ddd; border-radius: 0px;  font-size: 12px;}

input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="tel"]:focus, input[type="number"]:focus, input[type="date"]:focus, textarea:focus, select:focus {box-shadow:0 0 0 0px #999 !important;}

.profile-img-hold{width:68px; height:68px; position:absolute; left:38%; top:-34px; background-color:#FFF; border-radius:50%; border:2px solid #ff893c;}

.profile-screen{display:block; width: 68px; height: auto; border-radius: 50%;}

.chat-secintro p {color: #FFF; font-size: 14px;}

.owner-chat{background-color: #fafafa; color:#454545; padding:5px; width:250px; margin:0px; margin-top:0px; list-style-type:none; margin-top:5px; float:right; border-radius:8px;font-size:13px;}

.main-chat-hold {
    width: 400px;
    background-color: #fff;
    overflow-y: auto;
    padding: 10px 0px 15px 0px;
    height: 90%;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 5px 40px;
    -moz-box-shadow: rgba(0, 0, 0, 0.16) 0px 5px 40px;
    -webkit-box-shadow: rgba(0, 0, 0, 0.16) 0px 5px 40px;
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
}

.main-chat-header{position:absolute;width:400px;top:0;right:0;border-bottom:0;padding:10px 0;height:60px;background-color: #FFF;z-index: 99;box-shadow:none;background: #459dd7;border-top-left-radius: 16px;border-top-right-radius: 16px;}

.main-chat-off{display: block; float: right; margin-right: 10px; width:24px; height:24px; margin-top: 10px; cursor:pointer;}

.mic_display{float: right; margin-right: 10px; width:24px; height:24px; margin-top: 10px; cursor:pointer;}

.main-chat-header h3 {width:140px; font-size:16px; font-weight:500; float:left; margin-left:15px; margin-top: 10px; color:#ffffff;}

.chat-speech-top{

background-color: #459dd7;

color: white;

padding:5px 10px;

width: auto;

list-style-type:none;

margin-top:10px;

display:inline-block;

border-radius: 14px;

font-size: 13px;

margin-right: 15px;

float: right;

border-bottom-right-radius: 0;
}

.system-speech{background-color: #dceaf3;color: #454545;padding:10px;width: 270px;list-style-type:none;margin-top:10px;margin-left:55px;font-size:15px;border-radius:12px;line-height: 140%;position: relative;border-bottom-left-radius: 0;}

.system-speech-next{float:left;background-color: #FFF;color: #454545;padding:8px;width: auto;margin-left:5px;list-style-type: none;margin-top:10px;border: 1px solid #459dd7;border-radius: 30px;display: inline-block;font-size: 14px;cursor: pointer;line-height: 130%;transition: all 1s;}

/*#input.user-input-hold{width:80%; position:absolute; bottom:34px;  left:0px;  border:none;  border-top-width: medium; border-top-style: none;   border-top-color: currentcolor;

    border-top: 1px solid #ddd !important;  border-radius: 0px; font-size: 13px; color: #454545; background: #f2f2f2 !important;border-bottom: 1px solid #ddd;}*/

#input.user-input-hold{width:70%; position:relative;  border: 1px solid #459dd7; border-radius:30px; font-size: 13px; color: #000; margin-top:10px;height: auto;padding: 8px; border-bottom-right-radius: 0px; border-top-right-radius: 0px; }

 #submitBtn {background: #459dd7; padding: 8px; margin-top: 10px;    color: #fff;    border-radius: 30px;    margin-left: -6px;    font-size: 13px;  border-top-left-radius: 0px; border-bottom-left-radius: 0px;     border: 1px solid #459dd7;}

.system-speech::before {
    content: '';
    border: 1px solid rgb(183, 204, 238);
    position: absolute;
    background-color: #FFF;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    left: -54px;
    background-repeat: no-repeat;
    border: 1px solid rgba(0, 0, 0, 0.15);
    margin-left: 15px;
    background: url(../../images/Chatbot-V2.svg);
    background-size: 100%;
    bottom: 0;
    background-repeat: no-repeat;
}

.brk-line1 {clear: both; content: ''; display: table;}
.system-speech-next:hover{color:#ffffff;background: #459dd7;}

.w-powered{display: block; position: absolute; bottom: -62px; background-color: #FFF; width: 350px; right: 0; padding: 4px 8px 4px 4px; box-shadow: 0px 5px 8px -5px rgba(0, 0, 0, 0.4);}

.w-powered-topbar{display: block; position: absolute; bottom:0px; background-color: #FFF; width: 400px; right: 0; padding: 4px 8px 4px 4px;}

.w-powered-topbar span{font-size:11px; font-weight:normal; color:#454545; text-align:center; float:right; padding:0 6px; margin:0 0;}

.w-logo {float: right !important;width: 58px;height: 20px !important;display: block;clear: none !important; margin-top: 4px;}

.powered-icon{display:block; float:right; width:14px; height:20px; margin-top:4px;}

.w-powered span{font-size:11px; font-weight:normal; color:#454545; text-align:center; float:right; padding:0 6px; margin:0 0;}

.start-chat-btn{width:95.7%; position:absolute;  bottom:61px;  left:0px;  display:inline;  background-color:#f5f5f5;  border:1px solid #cacaca; padding:10px 0; font-size:13px; color: #454545; cursor: pointer; text-align:center;}

.chip-user-rt{width: 100%; text-align: right; margin: 0 auto; display: inline-block;}

.chart-robotic-start{background-color:#ffffff; width:250px; padding:15px 16px; border-radius:6px; position:absolute;     right: 78px;    bottom: 15px; box-shadow:1px 1px 6px rgba(0, 0, 0, 0.5); z-index: 999; cursor:pointer;}

.chart-robotic-start span{background:url(../../images/message-arrow.png); width:13px; height:26px; position:absolute; right:-6px; bottom:0px;}

.chart-robotic-start p{color:#454545; font-size:17px; line-height:140%; text-align:left;}

.profile-id{display: block;float: left;margin-left: 15px;margin-top: 6px;}

.profile-dp{display:block; width:30px;  height:30px;  border-radius:50%;  border:2px solid rgb(255, 255, 255); float:left;background:#ffffff;}









/* --- Mobile code -----*/

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

{

 .chat-sidebar{display:none !important;}

 .chat-popup{display:none !important;}

}

			

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

.chart-start-hold {width: 300px;}

.w-powered {width: 300px;}

.topbar {width: 300px;}

.w-powered-topbar {width:300px;}

.main-chat-header {width:300px;}

.chip-user-rt {width:298px;}

.main-chat-hold {width:300px;}



.chart-robotic-start {width:200px;}

.system-speech{width:220px;}

.chart-robotic-start p{font-size: 15px;}

.close-btn {right: 285px; bottom: 75px;}

}
#input.user-input-hold:focus-visible {
    outline: none !important;
}