@keyframes slideInRight {
      from {
        transform: translate3d(100%, 0, 0);
        visibility: visible;
      }

      to {
        transform: translate3d(0, 0, 0);
      }
    }

    button.chatLauncher {
      animation-duration: 0.5s;
      transition-duration: 0.5s;
      position: fixed;
      bottom: 40px;
      right: 46px;
      z-index: 9999;
      border: 4px solid #004d44;
      padding: 1em;
      border-radius: 8px;
      margin: 0;
      text-decoration: none;
      background-color: #51a86e;
      color: #454545;
      font-family: sans-serif;
      font-size: 2.4rem;
      cursor: pointer;
      text-align: left;
      -webkit-appearance: none;
      -moz-appearance: none;
      /*width: 400px;*/
      opacity: 0;
    }
    
    
	/*desktop*/ 
	@media only screen and (min-width:1200px) {
		button.chatLauncher {
		/*background-color: orange;*/
		width: 400px;
		}
	}

	/*tablet landscape*/ 
	@media screen and (min-width:1024px) and (max-width:1600px) {
		button.chatLauncher {
		/*background-color: pink;*/
		width: 350px;
		}
	}

	/*tablet portrait*/ 
	@media screen and (min-width:768px) and (max-width:1023px) {
		button.chatLauncher {
		/*background-color: green;*/
		width: 300px;
		font-size: 1.8rem;
		}
	}

	/*smartphone landscape*/ 
	@media screen and (min-width:480px) and (max-width:767px) {
		button.chatLauncher {
		/*background-color: blue;*/
		width: 300px;
		font-size: 2.0rem;
		}
	}

	/*smartphone portrait*/ 
	@media screen and (max-width:479px) {
		button.chatLauncher {
		/*background-color: yellow;*/ 
		width: 200px;
		right: 20px;
		bottom: 46px;
		font-size: 1.8rem;
		}
	}

    button.chatLauncher.open {
      animation-name: slideInRight;
      opacity: 1;
    }

    button.chatLauncher:hover,
    button.chatLauncher:focus {
      background-color: rgb(225, 225, 254);
      border: 4px solid #a39160;
    }

    button.chatLauncher:focus {
      outline: 1px solid #a39160;
      outline-offset: -4px;
    }