/*
created and maintained by AI-COE team
Ver-1.1
Date-17-dec-2018
*/

/**
	for mobile devices 
	include only for chatbot with sticky window or hyperlink feature
	not required for normal chatbot
**/

/*for iphone 4*/

@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2) {
	  #dlChatbot .chat-log{
		  padding: 0 !important;
			margin: 0 !important;
			    max-width: 100% !important;
	  }
	  #dlChatbot .ChatLog__entry{
		      width: 100% !important;
	  }
	#mydlChatbotDropdown{
	top: 38px;
    left: 0;
    width: 100%;
    height: calc(100% - 38px);
	position:fixed !important;
}

#dlChatbot .chatbot{
	padding: 0 !important;
	height: 94% !important;
	width: 100% !important;
	margin: 0 !important;
}

#dlChatbot .chatbotContainer#chat{
	height: 100% !important;
    width: 100% !important;
}

#dlChatbot #conversations{
	    height: 89% !important;
    width: 96% !important;
}
#dlChatbot{
	height:100% !important;
	padding:0 !important;
	margin:0 !important;
}
#dlChatbot .normal-bot .chatbotContainer #conversations{
	margin:0 !important;
	width: 100% !important;
	padding:0 !important;
}
#dlChatbot .normal-bot{
	   padding: 0.5em !important;
}
#dlChatbot .normal-bot #compose-message label {
	display: inline-block !important;
}
#dlChatbot .normal-bot .chatbotContainer #conversations .chat-log .ChatLog__entry .ChatLog__message{
	max-width: 82% !important;
}
}

/*for iphone 5 and above*/

@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) {
	  #dlChatbot .chat-log{
		  padding: 0 !important;
			margin: 0 !important;
			    max-width: 100% !important;
	  }
	   #dlChatbot .ChatLog__entry{
		      width: 100% !important;
	  }
		#mydlChatbotDropdown{
		top: 38px;
		left: 0;
		width: 100%;
		height: calc(100% - 38px);
		position:fixed !important;
	}

	#dlChatbot .chatbot{
		padding: 0 !important;
		height: 94% !important;
		width: 100% !important;
		margin: 0 !important;
	}

	#dlChatbot .chatbotContainer#chat{
		height: 100% !important;
		width: 100% !important;
	}

	#dlChatbot #conversations{
			height: 89% !important;
		width: 96% !important;
	}
	#dlChatbot{
		height:100% !important;
		padding:0 !important;
		margin:0 !important;
	}
	#dlChatbot .normal-bot .chatbotContainer #conversations{
	margin:0 !important;
	width: 100% !important;
	padding:0 !important;
	}
	#dlChatbot .normal-bot{
		   padding: 0.5em !important;
	}
	#dlChatbot .normal-bot #compose-message label {
		display: inline-block !important;
	}
	#dlChatbot .normal-bot .chatbotContainer #conversations .chat-log .ChatLog__entry .ChatLog__message{
		max-width: 82% !important;
	}
}

/*for iphone 6 and above*/

@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2) { 
  #dlChatbot .chat-log{
		  padding: 0 !important;
			margin: 0 !important;
			    max-width: 100% !important;
	  }
   #dlChatbot .ChatLog__entry{
		      width: 100% !important;
	  }
		#mydlChatbotDropdown{
		top: 38px;
		left: 0;
		width: 100%;
		height: calc(100% - 38px);
		position:fixed !important;
	}

	#dlChatbot .chatbot{
		padding: 0 !important;
		height: 94% !important;
		width: 100% !important;
		margin: 0 !important;
	}

	#dlChatbot .chatbotContainer#chat{
		height: 100% !important;
		width: 100% !important;
	}

	#dlChatbot #conversations{
		height: 91% !important;
		width: 96% !important;
	}
	#dlChatbot{
		height:100% !important;
		padding:0 !important;
		margin:0 !important;
	}
	#dlChatbot .normal-bot .chatbotContainer #conversations{
	margin:0 !important;
	width: 100% !important;
	padding:0 !important;
	}
	#dlChatbot .normal-bot{
		   padding: 0.5em !important;
	}
	#dlChatbot .normal-bot #compose-message label {
		display: inline-block !important;
	}
	#dlChatbot .normal-bot .chatbotContainer #conversations .chat-log .ChatLog__entry .ChatLog__message{
		max-width: 82% !important;
	}
}

/*for iphone plus*/

@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3) { 
  #dlChatbot .chat-log{
		  padding: 0 !important;
			margin: 0 !important;
			    max-width: 100% !important;
	  }
   #dlChatbot .ChatLog__entry{
		      width: 100% !important;
	  }
		#mydlChatbotDropdown{
		top: 38px;
		left: 0;
		width: 100%;
		height: calc(100% - 38px);
		position:fixed !important;
	}

	#dlChatbot .chatbot{
		padding: 0 !important;
		height: 94% !important;
		width: 100% !important;
		margin: 0 !important;
	}

	#dlChatbot .chatbotContainer#chat{
		height: 100% !important;
		width: 100% !important;
	}

	#dlChatbot #conversations{
			height: 91% !important;
		width: 96% !important;
	}
	#dlChatbot{
		height:100% !important;
		padding:0 !important;
		margin:0 !important;
	}
	#dlChatbot .normal-bot .chatbotContainer #conversations{
	margin:0 !important;
	width: 100% !important;
	padding:0 !important;
	}
	#dlChatbot .normal-bot{
		   padding: 0.5em !important;
	}
	#dlChatbot .normal-bot #compose-message label {
		display: inline-block !important;
	}
	#dlChatbot .normal-bot .chatbotContainer #conversations .chat-log .ChatLog__entry .ChatLog__message{
		max-width: 82% !important;
	}
}

/*for iphone X*/
 
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 812px) 
  and (-webkit-min-device-pixel-ratio: 3) {
	  #dlChatbot .chat-log{
		  padding: 0 !important;
			margin: 0 !important;
			    max-width: 100% !important;
	  }
 #dlChatbot .ChatLog__entry{
		      width: 100% !important;
	  }	  
		#mydlChatbotDropdown{
		top: 38px;
		left: 0;
		width: 100%;
		height: calc(100% - 38px);
		position:fixed !important;
	}

	#dlChatbot .chatbot{
		padding: 0 !important;
		height: 94% !important;
		width: 100% !important;
		margin: 0 !important;
	}

	#dlChatbot .chatbotContainer#chat{
		height: 100% !important;
		width: 100% !important;
	}

	#dlChatbot #conversations{
			height: 91% !important;
		width: 96% !important;
	}
	#dlChatbot{
		height:100% !important;
		padding:0 !important;
		margin:0 !important;
	}
	#dlChatbot .normal-bot .chatbotContainer #conversations{
	margin:0 !important;
	width: 100% !important;
	padding:0 !important;
	}
	#dlChatbot .normal-bot{
		   padding: 0.5em !important;
	}
	#dlChatbot .normal-bot #compose-message label {
		display: inline-block !important;
	}
	#dlChatbot .normal-bot .chatbotContainer #conversations .chat-log .ChatLog__entry .ChatLog__message{
		max-width: 82% !important;
	}
}

/*for general*/

@media screen 
  and (device-width: 320px) 
  and (device-height: 640px) {
	  #dlChatbot .chat-log{
		  padding: 0 !important;
			margin: 0 !important;
			    max-width: 100% !important;
	  }
	   #dlChatbot .ChatLog__entry{
		      width: 100% !important;
	  }
	#mydlChatbotDropdown{
		top: 38px;
		left: 0;
		width: 100%;
		height: calc(100% - 38px);
		position:fixed !important;
	}

	#dlChatbot .chatbot{
		padding: 0 !important;
		height: 94% !important;
		width: 100% !important;
		margin: 0 !important;
	}

	#dlChatbot .chatbotContainer#chat{
		height: 100% !important;
		width: 100% !important;
	}

	#dlChatbot #conversations{
			height: 91% !important;
		width: 96% !important;
	}
	#dlChatbot{
		height:100% !important;
		padding:0 !important;
		margin:0 !important;
	}
	#dlChatbot .normal-bot .chatbotContainer #conversations{
	margin:0 !important;
	width: 100% !important;
	padding:0 !important;
	}
	#dlChatbot .normal-bot{
		   padding: 0.5em !important;
	}
	#dlChatbot .normal-bot #compose-message label {
		display: inline-block !important;
	}
	#dlChatbot .normal-bot .chatbotContainer #conversations .chat-log .ChatLog__entry .ChatLog__message{
		max-width: 82% !important;
	}
}

@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) {
	  #dlChatbot .chat-log{
		  padding: 0 !important;
			margin: 0 !important;
			    max-width: 100% !important;
	  }
	   #dlChatbot .ChatLog__entry{
		      width: 100% !important;
	  }
	#mydlChatbotDropdown{
		top: 38px;
		left: 0;
		width: 100%;
		height: calc(100% - 38px);
		position:fixed !important;
	}

	#dlChatbot .chatbot{
		padding: 0 !important;
		height: 94% !important;
		width: 100% !important;
		margin: 0 !important;
	}

	#dlChatbot .chatbotContainer#chat{
		height: 100% !important;
		width: 100% !important;
	}

	#dlChatbot #conversations{
			height: 89% !important;
		width: 96% !important;
	}
	#dlChatbot{
		height:100% !important;
		padding:0 !important;
		margin:0 !important;
	}
	#dlChatbot .normal-bot .chatbotContainer #conversations{
	margin:0 !important;
	width: 100% !important;
	padding:0 !important;
	}
	#dlChatbot .normal-bot{
		   padding: 0.5em !important;
	}
	#dlChatbot .normal-bot #compose-message label {
		display: inline-block !important;
	}
	#dlChatbot .normal-bot .chatbotContainer #conversations .chat-log .ChatLog__entry .ChatLog__message{
		max-width: 82% !important;
	}
}

@media screen 
  and (device-width: 480px) 
  and (device-height: 800px) {
	  #dlChatbot .chat-log{
		  padding: 0 !important;
			margin: 0 !important;
			    max-width: 100% !important;
	  }
	   #dlChatbot .ChatLog__entry{
		      width: 100% !important;
	  }
	#mydlChatbotDropdown{
		top: 38px;
		left: 0;
		width: 100%;
		height: calc(100% - 38px);
		position:fixed !important;
	}

	#dlChatbot .chatbot{
		padding: 0 !important;
		height: 94% !important;
		width: 100% !important;
		margin: 0 !important;
	}

	#dlChatbot .chatbotContainer#chat{
		height: 100% !important;
		width: 100% !important;
	}

	#dlChatbot #conversations{
			height: 91% !important;
		width: 96% !important;
	}
	#dlChatbot{
		height:100% !important;
		padding:0 !important;
		margin:0 !important;
	}
	#dlChatbot .normal-bot .chatbotContainer #conversations{
	margin:0 !important;
	width: 100% !important;
	padding:0 !important;
	}
	#dlChatbot .normal-bot{
		   padding: 0.5em !important;
	}
	#dlChatbot .normal-bot #compose-message label {
		display: inline-block !important;
	}
	#dlChatbot .normal-bot .chatbotContainer #conversations .chat-log .ChatLog__entry .ChatLog__message{
		max-width: 82% !important;
	}
}