.chatbot header, .chatbot-speaker{background: linear-gradient(1deg, #97291e, #e15749);}
#bot_circle.open {
    top: 8px;
    left: calc(450px - 99px); 
    background-size: 41px;
    background-color: transparent;
    background-image: url(https://www.iciciprulife.com/content/dam/icicipru/chatbot/chatbot-sprite-new-ui.png)!important;
}
.chatbot .img-chintamani{transform: scale(0.55);}
.chatbot header{border-top-left-radius: 23px;border-top-right-radius: 23px;
  width: 375px;
width: 354px;
}
.chatbot .chatbot-speaker{border-right:0px #710505 solid;}
.chatbot {background: transparent;}
#botholder{border-top-left-radius: 23px;border-top-right-radius: 23px;  
    /* width: 375px; */
width: 353px;
}
.chatbot .from-them > div:before{border: 1px solid #97291e!important; top:0px;}
.chatbot section{
  background: #ffffff; 
   background-image: url(https://www.iciciprulife.com/content/dam/icicipru/chatbot/ligo-chatbot-bg-new-ui.png)!important;  
   background-repeat-x: repeat;      padding: 0px 5px 0 5px;
   background-size: 60%;}
.chatbot .from-them > div{background-color: #eeeeee;border-radius: 0px 18px 18px 18px;}
.chatbot .from-them a.btn{border: 1px solid #97291e;color: #97291e;border-radius: 8px;padding: 4px 6px;    font-weight: lighter; width: auto;
    font-size: 11px;}

    /* button option 2 starts here*/
    .chatbot .from-them a.btn {
      border: 1px solid #dbdbdb;
      color: #97291e;
      border-radius: 8px;
      padding: 4px;
      font-weight: lighter;
      width: auto;
      font-size: 11px;
      background-image: linear-gradient(1deg, rgb(225 106 94 / 25%), rgb(0 64 119 / 5%));
      min-width: 46%;/*button aside*/
      display: inline;/*button aside*/
      float: left;/*button aside*/
       
  }
  
 /* button option 2 ends here*/


/*.chatbot .button{margin:0px !important;}    exceptional changes*/
.chatbot .from-them > div {position: relative;font-size: 1.19rem;}
.chatbot .from-them a.btn:hover{border: 1px solid #97291e;color: #fff;border-radius: 10px;padding: 4px 6px!important;font-weight:lighter!important;     
    font-size: 11px!important;}
    .chatbot .from-me > div{background: #97291e; color: #fff;box-shadow: none;}
    .chatbot .button {padding: 0 !important;
        margin: 0px 40px !important;
        background: transparent !important;
        box-shadow: none !important;
        /* width: 20% !important; */
        width: 80% !important; /*button aside*/
        display: table-caption;}
        .chatbot .from-me > div > div#times{color: #c0c0c0!important;padding-right: 0px;}
        /* timestamp user shifted down starts here */
        .chatbot .from-me > div > div#times{    color: #584c3a!important;
          padding-right: 0px;
          position: absolute;
          bottom: -22px;
          right: 5px;}
          /* timestamp user shifted down ends here */
         
/* timestamp left shifted down starts here */
.chatbot .from-them > div > div#times{bottom: -2px;/* width: 280px!important; */    }
 /* div ~ div#times{  background-color: #710505;   bottom: -2px;  } */
/* timestamp left shifted down ends here */
.from-them > div{margin: 15px 40px 0 42px;}
  /* #chatWindow .slider {top: 62px;} */
  #bot_circle.open {top: 5px;left: calc(424px - 124px);background-size: 152%; }
  #bot_circle.open {background-position: 1px -49px;}
 .chatbot .chatbot-speaker i {font-size: 25px;padding: 16px;padding-left: 8px;}
 .img-mic{background-image: url(https://www.iciciprulife.com/content/dam/icicipru/chatbot/chatbot-sprite-new-ui.png)!important;    height: 34px;   width: 35px;
    display: inline-block;    position: absolute;    top: 3px;    right: 15px; transform: scale(0.6);}
    /* .img-search-icon{background-image: url(https://www.iciciprulife.com/content/dam/icicipru/chatbot/chatbot-sprite-new-ui.png) !important;
      height: 34px;
      width: 35px;
      display: inline-block;
      position: absolute;
      top: 3px;
      right: 15px;
      transform: scale(0.6);} */
 .chatbot .micIconDyno{background-color: transparent;  outline: none;  border: none;}

/* only for footer style as its having space in the bottom */
div#audorattach1{display: flex;}
/* .chatbot footer {  margin-top: 15px;} */
/* only for footer style as its having space in the bottom */

    .chatbot .sendmsg { margin-top: 0px;}
    .chatbot .img-upload {transform: scale(0.6); opacity: 0.8;}
    .chatbot .img-reset {background: url(https://www.iciciprulife.com/content/dam/icicipru/chatbot/chatbot-sprite-new-ui.png) no-repeat -113px -389px;width: 38px;height: 38px;transform: scale(0.6);}
    .chatbot footer {padding: 5px 0px;
      background-image: linear-gradient(1deg, rgb(225 106 94 / 20%), rgb(0 64 119 / 10%));
    }
    .chatbot   #refresh {    top: -2px;}
    .chatbot .sendmsg {      font-size: 1.01rem;   border-radius: 50px;}
    #botiframe {height: calc(100vh - 30px);}
    .chatbot .from-me > div:after{background:url(https://www.iciciprulife.com/content/dam/icicipru/chatbot/chatbot-sprite-new-ui.png)  no-repeat -34px -568px;width: 35px;
                                height: 34px;top: 0px;transform: scale(0.8);}
    .chatbot  .animate-newtag { top: -12px;}
    .chatbot .chatbot-speaker {right: 54px;}
    .chatbot .err-msg {
      width: 100%;
      text-align: center;
      top: -50%;
      left: -50%;
      transform: translate(50%, 50%);
    }
 /* div + div.button{margin-left: 40px;} */
    .chatbot .from-them a.btn b{font-weight: lighter;}
    .chatbot .img-send{background: url(https://www.iciciprulife.com/content/dam/icicipru/chatbot/chatbot-sprite-new-ui.png) no-repeat -130px -617px;
      width: 38px;
      height: 38px;
      transform: scale(0.85);top: -10px;}
      .chatbot ::-webkit-scrollbar {width: 2px;height: 8px;}           

    .chatbot ::-webkit-scrollbar-track {/*background: #97291e;*/background: #c0c0c0;}                                 
    .chatbot ::-webkit-scrollbar-thumb {background: #e77817;}                                 
    .chatbot ::-webkit-scrollbar-thumb:hover {background: #555;}
    .chatbot .from-me > div{font-size: 1.2rem;padding: 15px 10px 1px 12px!important; border-radius: 18px 0px 18px 18px;}          
    .chatbot .from-me > div.button.only-for-allplans{padding-bottom: 12px;}
    .chatbot .from-them a.btn:hover{    font-size: 11px;    padding: 3px 6px;border-radius: 8px;}
    #botholder {box-shadow: 1px 1px 4px #999!important;}  
    .chatbot .lds-ellipsis div {top: 12px;width: 3px;height: 3px;}
    .chatbot  .lds-ellipsis div:nth-child(1) {left: 15px;}
      .chatbot .lds-ellipsis div:nth-child(2) {left: 5px;}
      .chatbot .lds-ellipsis div:nth-child(3) {left: 20px;}
      .chatbot .lds-ellipsis div:nth-child(4) {left: 35px;}
      .chatbot .lds-ellipsis div:nth-child(5) {left: 50px;}
      .chatbot .lds-ellipsis div:nth-child(6) {left: 66px;}
      .chatbot .lds-ellipsis {width: 110px;}
      .chatbot .loading > div:before{width: 28px;content: "";background: url(https://www.iciciprulife.com/content/dam/icicipru/chatbot/chatbot-sprite-new-ui.png) no-repeat -124px -26px;
        position: absolute;left: -38px;top: 0px;height: 30px;}
      .chatbot header.change h5 span{font-size: 18px!important;display: block;line-height: 15px;}  
      .chatbot header.change h5 span:nth-child(2){font-size: 12px!important;}  
      .chatbot .img-chintamani { left: -2px;}
      /* .chatbot .button.only-for-allplans { display: flex;
        
        overflow-x: initial; 
        overflow-y: hidden;width: 90%!important;padding-bottom: 10px!important;} */
      .chatbot .from-them a.btn.allplans-thumbnail {width: 110px;
        height: 110px;
        float: left;
        display: block;
        margin-bottom: 10px;}
        .chatbot .button.only-for-allplans{    width: 86% !important;margin-right: 0px!important;}
       div.only-for-allplans > div#times{ position: absolute!important;  /* position: fixed!important;*/} 
        .chatbot .from-me .image-preview-png {
          background: url(https://www.iciciprulife.com/content/dam/icicipru/chatbot/chatbot-sprite.png) no-repeat -8px -998px;
    background-color: #f48734!important;
    border-radius: 10px;
    box-shadow: none;
    transform: scale(1);
    padding: 15px 15px 15px 45px;margin-bottom: 10px;
      }
      .chatbot .from-me a.uploadbtn {
        border: 1px solid #ffffff;
        color: #4d4d4d;
        border-radius: 9px;
        padding: 5px 5px;
        margin-top: 3px;
        display: inline-block;
        font-family: Mulish, sans-serif;
        font-weight: 600;
        text-decoration: none; 
        margin-right: 10px;
        min-width: 22%;
        font-size: 12px;
        background-color: rgb(255 215 185);
        text-transform: none;
        height: auto;
        text-align: center;
        margin-bottom: 10px; cursor: pointer;
    }
    .chatbot .from-them a.btn.allplans-thumbnail:nth-child(7){ 
      font-size: 16px!important;
      padding-top: 2.5em!important;
    }
    .chatbot .from-them a.btn.allplans-thumbnail:nth-child(7):hover{color: #fff; font-size: 16px!important;
      padding-top: 2.5em!important; }    
      #chatWindow .inner_part .img{border-radius: 0px 0px 10px 10px;}
      #chatWindow .slider .slide{height: 5px; width: 5px;}


      #chatWindow .card{height: 76px;    background-color: #fff;}
      .chatbot .suggestion{width: 353px;background: rgb(255 236 234); right:0px; bottom: 49px;}
      .chatbot .suggestion a{font-size: 11px;    margin: 0px 2px 5px !important;
        background-image: linear-gradient(1deg, rgb(225 106 94 / 70%), rgb(214 80 67 / 20%));color: #222222 !important;}
      .chatbot .suggestion a:hover{color: #fff!important; background-image:linear-gradient(2deg, rgb(205 107 97), rgb(167 51 40 / 90%));}
      /* .chatbot .from-them > div > div#times */
      /* .chatbot .from-them > div.only-for-allplans > div#times{bottom: 132px;width: 280px!important;} */

      /* .chatbot .from-them > div.only-for-allplans a.btn{min-width: 50%;} */
 


      .divfixed-top {/*margin: 82px 0;*/}
       div.divfixed-top > a{border: 1px solid #dbdbdb;
        color: #97291e!important;
        border-radius: 0; text-align: center;
        padding: 13px 6px;
        font-weight: lighter;
        width: auto;width: 36%!important;
        font-size: 12px;
        background-image: linear-gradient(1deg, rgb(225 106 94 / 30%), rgb(0 64 119 / 5%));
        min-width: 36%;
       
        float: left; font-weight: bold;
        text-decoration: none!important; }
        .chatbot a.terminate-chat{padding: 9px 7px 9px 9px;}
        .chatbot a.recent-history{padding: 9px 7px 9px 9px; width: 51%!important;} 


        /* media query starts here */
        /* Portrait */
    @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) 
    and (orientation: portrait) and (-webkit-device-pixel-ratio: 2) {
    /* CSS styles specific to iPad Air portrait mode */
        #botiframe {
          border: none;
          width: 100%;
          height: calc(100vh - 20px);
          max-height: 700px;
        }

        /* .chatbot .img-send {
          top: -27px;
        }

        .chatbot .img-upload {
          top: -27px;
          right: -10px;
        } */

        #bot_circle.open {
          top: 129px; 
        }
        #chatWindow .slider {
          top: 32px;
      }
      /* #chatWindow {
        height: calc(100vh - 74px);
    } */
          /* #chatWindow {
            height: calc(100vh - 74px) !important;
        } */
        
    }

    @media only screen and (min-device-width: 767px) and (max-device-width: 768px) 
    and (orientation: portrait) and (-webkit-device-pixel-ratio: 2) {
        #chatWindow .card {
          height: 176px;        
      }
    }

@media screen and (max-device-width: 768px) {
  #chatWindow {
            height: calc(100vh - 74px) !important;
        }
      
  .chatbot header {
      width:100%;
      border-top-left-radius: 0!important;
      border-top-right-radius: 0!important;
  }

  #botholder, #botiframe {
      bottom: 0!important;
      height: 100%!important
  }

  #botholder, body.chat-open {
      position: fixed
  }

  #bot_circle.open {
    top: -9px;
    left: calc(100% - 73px);
    z-index: 10999;
  }

  #botholder {
      width: auto;
      right: 0!important;
      top: 0!important;
      left: 0!important;
      border-radius: 0;
      -webkit-box-shadow: none;
      -moz-box-shadow: none;
      box-shadow: none;
  }

  #botiframe {
      border: none!important;
      min-height: 100%!important;
      z-index: 999999999;
      overflow: hidden;
      width: 100%!important
  }

  #boat_msg {
      right: 120px !important;
      bottom: 25px !important;
  }

  .from-them > div:before {
      width: 28px;
      left: -33px;
      height: 28px;
  }

  /*.from-me > div, .from-them > div{font-size:1.3rem !important;margin:10px 30px 0 30px !important;}.from-them > div.button{margin:0 10px !important; width:calc(100% - 20px) !important;}*/
  .btn-pop {
      width: 82% !important;
  }

  .from-me > div:after {
      width: 25px;
      right: -35px;
      top: 2px;
      height: 25px;
  }

  .from-me > div {
      padding: 7px 10px !important;
  }

  .chatbot footer {
      border-radius: 0 !important; 
      margin-top: 27px;
  }

  .from-them > div {
      padding: 5px 10px !important;
  }

  #boat_msg:after {
      top: 3px !important;
      right: -6px !important;
  }

  .suggestion {
      width: 100%!important;
      left: 0;
  }
  /* #chatWindow .slider {
    top: 112px;
} */
}

      @media screen and (max-width: 480px){
          /* .chatbot .suggestion {
            width: 412px;
            background: rgb(255 236 234);
            left: 0;
            bottom: 47px;
            padding: 9px 0px 9px 0px;
        } */
      }

      @media screen and (max-device-width: 375px) {
        .from-me > div, .from-them > div, .loading > div {
            font-size:1.3rem;
        } 
        /* .chatbot .suggestion {
          width: 373px;
          background: rgb(255 236 234);
          left: 0px;
          bottom: 47px;
          padding: 9px 0px 9px 0px;
      } */
    }

        /* @media screen and (max-width:820px){
          #bot_circle.open { 
            left: calc(112% - 124px);           
          }
        }

        @media screen and (max-width:480px){
          .chatbot .suggestion {
            width: 412px;
            left: 0px;
        }    
          #botholder, .chatbot header {             
            width: 100%;
          }
          #bot_circle.open {
              top: -18px; 
               left: calc(112% - 124px); 
              background-size: 172%;
          }
        }

        @media only screen and (max-width: 767px){
          .chatbot .suggestion {
            width: 100%;
            left: 0px;
            bottom: 57px;
        }
          .suggestion {
            bottom: 59px;
            padding: 9px 0px 9px 0px;
          } 
          
        }

         

        @media screen and (max-width:375px){ 
          #bot_circle.open { 
            left: calc(112% - 124px); 
          }
          .chatbot .suggestion {
            
            bottom: 58px;
        }
        }
  */