.connection {
  border:1px solid rgba(255,255,255,0.3);
  padding:49px 0 49px 0;
  position:relative;
  width:100%;
  max-width:485px;
  margin:0 auto;
}
.connection > .inner { padding:0; }
.connection a { color:#f50057; }
.connection a:hover { color:rgba(245,0,87,0.8); }
.connection a:active { color:#f50057; }
.connection .wppb-error, .connection .wppb-warning {
  color:#f50057;
  margin-bottom:25px;
  font-weight:300;
  font-style:italic;
  font-size:14px;
  line-height:20px;
}
.connection .wppb-error a, .connection .wppb-warning a { color:#ffffff; }
.connection .wppb-error a:hover, .connection .wppb-warning a:hover { color:#f50057; }
.connection .wppb-error a:active, .connection .wppb-warning a:active { color:#ffffff; }
.connection-header {
  position:absolute;
  top:-19px;
  left:39px;
  right:39px;
  height:40px;
  display:flex;
  justify-content:space-between;
  background-color:#040418;
  padding:0 30px;
  flex-wrap:nowrap;
}
.connection-header .connection-header-link {
  font-size:14px;
  line-height:30px;
  font-weight:900;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:#f50057;
  display:block;
  height:40px;
  padding:8px 0 2px;
  white-space:nowrap;
  -webkit-transition:all 0.3s ease-out;
  transition:all 0.3s ease-out;
}
.connection-header .connection-header-link.active {
  font-size:20px;
  font-weight:900;
  color:#ffffff;
  padding:6px 0 4px;
}
.connection-parts {
  position:relative;
  overflow:hidden;
  width:483px;
  padding:0 59px 0 64px;
}
.connection-parts.initialised .connection-part {
  display:block;
  position:absolute;
}
.connection-part {
  width:360px;
  display:none;
}
.connection-part.active { display:block; }