/* global variables */
/* font definition */
@font-face {
  font-family: 'SkodaNext';
  src: url('../font/SKODANext-Bold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
}
@font-face {
  font-family: 'SkodaNext';
  src: url('../font/SKODANext-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}
@font-face {
  font-family: 'SkodaNext';
  src: url('../font/SKODANext-Light.ttf') format('truetype');
  font-weight: 200;
  font-style: normal;
}
/* common rules & helpers */
* {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
table,
thead,
tbody,
tr,
th,
td {
  display: block;
  width: 100%;
}
.dn {
  display: none !important;
}
body {
  position: relative;
  padding: 45px 0 0 0;
  display: block;
  max-width: 789px;
  margin: 0 auto;
  font-family: 'SkodaNext', Arial !important;
  font-size: 12px;
  height: 100%;
  /* background-image: url(bg.png);
  background-position: bottom center;
  background-repeat: no-repeat; */
}
/* common elements */
/* Buttons */
button,
input[type='button'],
input[type='submit'],
input[type='reset'] {
  border: none;
  padding: 11px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 14px;
  cursor: pointer;
  font-weight: normal;
  font-family: SkodaNext, Arial;
}
button.primary,
input[type='button'].primary,
input[type='submit'].primary,
input[type='reset'].primary {
  background-color: #78faae;
  color: #0e3a2f;
}
button.secondary,
input[type='button'].secondary,
input[type='submit'].secondary,
input[type='reset'].secondary {
  background-color: #0e3a2f;
  color: #78faae;
}
.sa-webchat-header {
  position: fixed;
  top: 0;
  width: 789px;
  border-top: 2px solid #4ba82e;
  background-color: #000;
  color: #fff;
  padding: 10px 20px;
  height: 45px;
  box-sizing: border-box;
}
.sa-webchat-header .label {
  font-size: 16px;
  font-weight: 600;
}
.sa-webchat-header .label::before {
  content: url(chat-bubble-ico-reversed.png);
  margin: 0 15px 0 0;
  position: relative;
  top: 2px;
}
.sa-webchat-header .label .highlighted {
  color: #4ba82e;
}
/* local variables */
/* WCMain */
.t1Section {
  position: relative;
  top: 50px;
  padding: 0 0 0 10px;
}
.t1Section .infoSmall {
  padding: 0 0 0 20px;
}
.t1Section .infoSmall .label {
  display: block;
  font-weight: 600;
  text-transform: uppercase;
  margin: 0 0 20px 0;
}
.t1Section .infoSmall .label::before {
  /* content: url(skoda-logo-small.png); */
  /* content: url(Skoda_Logo_32_kulate.svg); */
  /* width: 32px; */
  /* height: 32px; */
  margin: 0 20px 0 0;
  position: relative;
  top: 7px;
}

.t1Section .infoSmall .text {
  display: block;
  color: #a6aaac;
  width: 45%;
  /* margin: 0 0 0 80px; */
  margin: 0 0 0 20px;
}
#Form1 {
  position: fixed;
  width: 100%;
  bottom: 0;
  margin: 0 auto;
  padding: 0 40px;
  max-width: 789px;
}
#Form1 .fields {
  width: calc(100% - 180px);
  float: left;
  padding: 0 20px 0 0;
}
#Form1 .fields .two-inputs-wrapper {
  font-size: 0;
  display: block;
}
#Form1 .fields .two-inputs-wrapper input.name-field,
#Form1 .fields .two-inputs-wrapper input.email-field {
  width: 48%;
  padding: 4px 15px;
  font-size: 14px;
  margin: 0;
  display: inline-block;
  font-family: SkodaNext, Arial;
}
#Form1 .fields .two-inputs-wrapper input.name-field {
  margin-right: 4%;
}
#Form1 .fields textarea {
  font-size: 14px;
  width: 100%;
  height: 86px;
  padding: 8px 15px;
}
#Form1 .fields .disclaimer {
  text-align: right;
  margin: 0 0 7px 0;
}
#Form1 .fields .disclaimer a {
  color: #000;
  text-decoration: none;
  font-weight: normal;
}
#Form1 .fields .disclaimer a:hover {
  text-decoration: underline;
}
#Form1 .buttons {
  width: 180px;
  float: left;
  padding: 37px 0 0 0;
}
#Form1 .buttons button,
#Form1 .buttons input[type='button'],
#Form1 .buttons input[type='submit'],
#Form1 .buttons input[type='reset'] {
  width: 100%;
}
@font-face {
  font-family: 'SkodaNext';
  src: url('../font/SkodaNext-medium.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
}
#btnWebChat {
  position: fixed;
  bottom: 0;
  right: 10px;
  background-color: #000;
  width: auto;
  padding: 10px 35px 5px 20px;
  border-top: 2px solid #4ba82e;
  cursor: pointer;
}
#btnWebChat a {
  font-family: SkodaNext, Arial;
  font-weight: 400;
  text-decoration: none;
  color: #fff;
  font-size: 15px;
}
#btnWebChat a::before {
  content: url(chat-bubble-ico-reversed.png);
  margin: 0 15px 0 0;
  position: relative;
  top: 2px;
}
/* Original stlyes of Webchat */
A:link {
  color: #0000ff;
  text-decoration: none;
  font-weight: bold;
}
A:visited {
  color: #0000cc;
  text-decoration: none;
  font-weight: bold;
}
A:hover {
  color: #0000ff;
  font-weight: bold;
}
A:active {
  color: #0000ff;
  text-decoration: none;
  font-weight: bold;
}
.rollover {
  cursor: hand;
}
.help {
  background-color: #fef9c1;
  color: #000000;
  font-size: 11px;
  border: 1px solid #9b9b9d;
  margin: 0px;
  padding: 5px 5px 5px 8px;
}
.bButton {
  font-size: 11px;
  font-weight: bold;
  background-color: #ebebeb;
  padding: 3px;
  margin: 3px;
  border: 1px solid #9b9b9d;
}
.t1Label {
  font-family: SkodaNext, Tahoma, Verdana, Arial;
  font-size: 11px;
  padding: 0px;
  vertical-align: middle;
  font-weight: normal;
  margin-top: 5px;
  margin-right: 2px;
  margin-bottom: 5px;
}
.t1Group {
  font-size: 11px;
  border-bottom-style: solid;
  border-bottom-color: #c9c7ba;
  padding-bottom: 3px;
  border-bottom-width: 2px;
  color: #666666;
  font-weight: bold;
  margin: 10px 0px 5px;
}
.panelBackground {
  background-color: #e6e5e0;
  font-size: 11px;
  padding: 5px;
  border-top: 1px solid #9b9b9d;
  border-bottom: 1px;
  border-right-width: 1px;
  border-left-width: 1px;
  border-right-style: solid;
  border-right-color: #9b9b9d;
  border-left-style: solid;
  border-left-color: #9b9b9d;
}
.info {
  background-color: #e4e9ed;
  color: #000000;
  font-size: 11px;
  border: 1px solid #9b9b9d;
  margin: 0px;
  padding: 5px 5px 25px 25px;
  background-image: url(info.jpg);
  background-repeat: no-repeat;
  background-position: 5px 5px;
  font-weight: normal;
}
.t1Summary {
  background-color: #ffffff;
  font-size: 11px;
  padding: 10px;
  border: 1px solid #9b9b9d;
}
.form {
  margin: 0px;
  vertical-align: middle;
}
.new-skoda-logo-small {
  background-image: url(Skoda_Logo_32_kulate.svg);
  background-repeat: no-repeat;
  width: 32px;
  height: 32px;
  margin: -7px 20px 0 0;

  /* margin: 0 20px 0 0;
  position: relative;
  top: 7px; */
}
.display-flex {
  display: flex;
}