@import url("https://fonts.googleapis.com/css?family=Open+Sans");
@font-face {
  font-family: 'Blue Highway Bold';
  src: url("../../fonts/bluehigh.ttf"); }
.chat-fullscreen {
  width: 100%;
  height: 100%;
  z-index: 8000;
  opacity: .4;
  position: fixed;
  top: 0;
  left: 0;
  background: black;
  display: none; }

.chat-window {
  position: fixed;
  width: 90%;
  height: 80%;
  margin: 5% 5% auto 5%;
  background-image: url("../img/map.png"), linear-gradient(#78afdc, #3276b1);
  background-size: 100% 100%;
  z-index: 8001;
  top: 0;
  font-family: "Open Sans";
  display: none; }

.anonymous-input-window {
  display: none;
  height: 100%;
  width: 100%;
  grid-template-columns: 27% 5% 40% 20%;
  grid-template-rows: 9% 18% 30%; }

.anonymous-uberschrift {
  background: url("../img/logo_200-weis.png");
  z-index: 8002;
  position: relative;
  width: 78%;
  height: 100%;
  grid-column-start: 2;
  grid-column-end: 5;
  grid-row-start: 2;
  grid-row-end: 3;
  color: white;
  font-size: 4.8vw;
  background-size: 13%;
  background-repeat: no-repeat;
  text-align: right;
  font-family: "Blue Highway Bold"; }

.anonymous-input-field {
  position: relative;
  color: white;
  text-shadow: .4px .4px black;
  grid-column-start: 3;
  grid-column-end: 4;
  grid-row-start: 3;
  grid-row-end: 4; }

.anonymous-name-and-mail, .anonymous-initial-text {
  position: relative;
  width: 100%;
  background-color: #71a2cb;
  border: 1px dashed white;
  margin-bottom: 3%;
  color: white;
  line-height: 3; }

.anonymous-initial-text {
  height: 60%;
  resize: none; }

.anonymous-accept-button {
  background: linear-gradient(#a7e24c, #4e9d26);
  width: 80%;
  height: 25%;
  position: relative;
  display: flex;
  justify-content: center;
  /* align horizontal */
  align-items: center;
  /* align vertical */
  font-size: 1.6vw;
  border-radius: 5px;
  font-weight: bold;
  cursor: pointer; }

.chat-close {
  background-color: #408bcc;
  position: relative;
  width: 3%;
  height: 5%;
  top: -2%;
  right: -98.5%;
  border-radius: 50%;
  z-index: 8002;
  justify-content: center;
  /* align horizontal */
  align-items: center;
  /* align vertical */
  font-size: 1.3vw;
  cursor: pointer;
  display: grid;
  grid-template-rows: 0% 100% 0%;
  color: white;
  font-weight: bold; }

.chat-close-X {
  grid-row-start: 2;
  grid-row-end: 3;
  color: #252525;
  opacity: .5;
  text-decoration: none;
  display: flex;
  text-align: center;
  justify-items: center;
  font-size: 45px; }

.chat-close-dialogue {
  position: fixed;
  z-index: 8005;
  width: 50%;
  height: 40%;
  top: 25%;
  left: 25%;
  background: linear-gradient(#78afdc, #3276b1);
  display: none;
  grid-template-columns: 100%;
  grid-template-rows: 30% 50%; }

#chat-close-dialogue-text {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Open Sans";
  color: white;
  font-size: 1.5vw;
  font-weight: bold; }

.chat-close-dialogue-button-container {
  display: grid;
  grid-template-columns: 50% 50%;
  grid-template-rows: 100%; }

.chat-close-dialogue-button {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: "Open Sans";
  color: white;
  font-size: 1.5vw;
  font-weight: bold;
  margin: 70px;
  border-radius: 5px;
  background: linear-gradient(#a7e24c, #4e9d26);
  cursor: pointer; }

.chat_main {
  display: none;
  position: relative;
  height: 100%;
  width: 100%;
  top: -5%;
  background: linear-gradient(to right, #fdfdfd, #eaeaea); }

.chat_main_header {
  width: 100%;
  height: 15%;
  display: grid;
  grid-template-columns: repeat(10, 10%);
  grid-template-rows: 40% 40% 30%; }

.header_top {
  grid-column-start: 1;
  grid-column-end: 11;
  grid-row-start: 1;
  grid-row-end: 2;
  display: grid;
  grid-template-columns: 5% 95%;
  grid-template-rows: 70% 90%;
  font-weight: bold; }

.inserat_name {
  grid-column-start: 2;
  grid-column-end: 3;
  grid-row-start: 2;
  grid-row-end: 3;
  color: #418acb;
  font-family: "Open Sans";
  font-size: 2vw; }

.header_bottom {
  grid-column-start: 1;
  grid-column-end: 11;
  grid-row-start: 3;
  grid-row-end: 4;
  display: grid;
  grid-template-columns: 5% 30% 30% 13% 30%;
  grid-template-rows: 100%; }

.chat-header-images {
  height: 80%; }

.chat_partner, .chat_ansprechnpartner, .country_flag, .partner_typing {
  grid-column-start: 2;
  grid-column-end: 3;
  grid-row-start: 1;
  grid-row-end: 2;
  font-family: "Open Sans";
  font-size: 1.2vw;
  display: flex; }

.chat_ansprechnpartner {
  grid-column-start: 3;
  grid-column-end: 4;
  grid-row-start: 1;
  grid-row-end: 2;
  display: flex; }

.country_flag {
  grid-column-start: 4;
  grid-column-end: 5;
  grid-row-start: 1;
  grid-row-end: 2;
  display: flex; }

.county_flag_image {
  width: 15%;
  height: 50%;
  margin-top: 4px; }

.partner_typing {
  display: none;
  grid-column-start: 5;
  grid-column-end: 6;
  grid-row-start: 1;
  grid-row-end: 2;
  color: #c20000;
  font-weight: 900; }

.chat_history {
  width: 100%;
  height: 70%;
  display: grid;
  grid-template-columns: 5% 90% 5%;
  grid-template-rows: 8% 92%; }

.chat_message_container {
  grid-column-start: 2;
  grid-column-end: 3;
  grid-row-start: 2;
  grid-row-end: 3;
  height: 100%;
  width: 100%;
  overflow: scroll;
  overflow-x: hidden; }

.chat_message {
  width: 100%;
  height: 30%;
  display: grid;
  grid-template-columns: 20% 80%;
  grid-template-rows: 100%;
  margin-top: 3%; }

.chat_message_image {
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 1;
  grid-row-end: 2; }

.chat_message_image img {
  display: block;
  width: 50%;
  height: auto; }

.chat_message_message {
  grid-column-start: 2;
  grid-column-end: 3;
  grid-row-start: 1;
  grid-row-end: 2;
  display: grid;
  grid-template-columns: 5% 80% 15%;
  grid-template-rows: 5% 15%  5% 75%;
  background-color: #418acb;
  border-radius: 5px;
  margin: 0px 10px 0px 0px; }

.chat_message_name, .chat_message_time, .chat_message_text {
  grid-column-start: 2;
  grid-column-end: 3;
  grid-row-start: 2;
  grid-row-end: 3;
  color: white;
  font-family: "Open Sans";
  font-size: 1.5vw;
  font-weight: bold;
  display: flex; }

.chat_message_time {
  grid-column-start: 3;
  grid-column-end: 4;
  grid-row-start: 2;
  grid-row-end: 3;
  font-size: 1vw;
  display: flex;
  justify-content: center;
  /* align horizontal */
  align-items: center;
  /* align vertical */ }

.chat_message_time .md-light {
  font-size: 1vw; }

.chat_message_text {
  grid-column-start: 2;
  grid-column-end: 4;
  grid-row-start: 4;
  grid-row-end: 5;
  word-break: break-all;
  align-items: center;
  /* align vertical */
  font-weight: normal; }

.chat_input {
  width: 100%;
  height: 15%;
  display: flex;
  justify-content: center;
  /* align horizontal */
  align-items: center;
  /* align vertical */
  background-color: white; }

.chat_input input {
  width: 63%;
  height: 40%;
  border-radius: 5px;
  border: .5px solid lightgray; }

.chat_input input::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: lightgrey; }

.chat_input input::-moz-placeholder {
  /* Firefox 19+ */
  color: lightgrey; }

.chat_input input:-ms-input-placeholder {
  /* IE 10+ */
  color: lightgrey; }

.chat_input input:-moz-placeholder {
  /* Firefox 18- */
  color: lightgrey; }

.chat_input input:focus {
  outline: none; }

.send_input {
  height: 40%;
  width: 25%;
  background: linear-gradient(#a7e24c, #4e9d26);
  font-family: "Open Sans";
  color: white;
  display: flex;
  justify-content: center;
  /* align horizontal */
  align-items: center;
  /* align vertical */
  font-size: 1.5vw;
  border-radius: 5px;
  font-weight: 700;
  margin-left: 2%;
  cursor: pointer; }

.chat_end {
  display: none;
  position: relative;
  height: 100%;
  width: 100%;
  top: -5%;
  background: linear-gradient(to right, #fdfdfd, #eaeaea); }

.chat_inactive_choose {
  height: 85%;
  width: 100%;
  display: grid;
  grid-template-columns: 20% 60% 20%;
  grid-template-rows: 15% 10%  10% 15%; }

.partner_inactive_uberschrift {
  grid-column-start: 2;
  grid-column-end: 3;
  grid-row-start: 2;
  grid-row-end: 3;
  font-weight: 700;
  font-size: 2vw; }

.partner_inactive_question {
  grid-column-start: 2;
  grid-column-end: 3;
  grid-row-start: 3;
  grid-row-end: 4;
  font-size: 1.5vw; }

.partner_inactive_choose_buttons {
  grid-column-start: 2;
  grid-column-end: 3;
  grid-row-start: 4;
  grid-row-end: 5;
  display: grid;
  grid-template-columns: 50% 5% 25%;
  grid-template-rows: 100%; }

.partner_inactive_yes_button, .partner_inactive_no_button {
  grid-column-start: 1;
  grid-column-end: 2;
  grid-row-start: 1;
  grid-row-end: 2;
  width: 100%;
  height: 55%;
  background: linear-gradient(#a7e24c, #4e9d26);
  display: flex;
  justify-content: center;
  /* align horizontal */
  align-items: center;
  /* align vertical */
  cursor: pointer;
  border-radius: 5px;
  font-family: "Open Sans";
  color: white;
  font-size: 1.5vw;
  font-weight: bold; }

.partner_inactive_no_button {
  background: linear-gradient(#cdcccd, #848484);
  cursor: pointer;
  grid-column-start: 3;
  grid-column-end: 4;
  grid-row-start: 1;
  grid-row-end: 2;
  width: 100%; }

.material-icons.md-light {
  color: white; }

.material-icons.md-light.md-inactive {
  color: rgba(255, 255, 255, 0.3); }

.material-icons.md-blue {
  color: #418acb;
  font-size: 2vw; }

.material-icons.md-blue.md-inactive {
  color: #418acb; }

.material-icons.md-red {
  color: #c62424;
  font-size: 1.5vw; }

.material-icons.md-red.md-inactive {
  color: #c62424; }

/*# sourceMappingURL=chat.css.map */