@charset "UTF-8";
@import url("https://fonts.googleapis.com/css?family=Montserrat:400,400i,700");

*, *:before, *:after {
  box-sizing: border-box;
}

html,
body {
  margin: 10px;
  padding: 10px;
}

body {
  /*BERLEI*/
  /*BONDS*/
  background-color: #ededed;
  color: #303030;
  font-family: "Futura W01 Book", Futura, sans-serif;
  font-size: 15px;
  line-height: 1.4;
  height: 100%;
  min-width: 320px;
  overflow-x: hidden;
  overflow-y: scroll;
  position: relative;
}

.clearfix {
  zoom: 1;
}
.clearfix:before, .clearfix:after {
  content: "";
  display: table;
}
.clearfix:after {
  clear: both;
}

img {
  display: block;
  max-width: 100%;
}

a {
  display: block;
  text-decoration: none;
}

.btn {
  background-color: #222;
  border: 2px solid #222;
  color: #fff;
  display: inline-block;
  font-family: "Futura PT W01 Heavy", Futura-CondensedExtraBold, sans-serif;
  font-size: 15px;
  line-height: 1;
  padding: 10px 20px;
  text-align: center;
  text-transform: uppercase;
  cursor: pointer;
  pointer-events: auto;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
@media (min-width: 600px) {
  .btn {
    font-size: 20px;
  }
}

.campaignwrapper {
  text-align: center;
  max-width: 2800px;
  margin: 0 auto;
}
.campaignwrapper .limit-width {
  max-width: 1280px;
  margin: 0 auto;
}
.campaignwrapper .header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100;
  font-size: 1.7em;
}
.campaignwrapper .header .mbp-logo {
  color: #fff;
  padding: 0.5em;
  cursor: pointer;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  background: rgba(0, 0, 0, 0.7);
  transition: background 200ms, padding 200ms;
}
.campaignwrapper .header .mbp-logo .q_arrow-down {
  font-size: 50%;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translatex(-50%);
  transition: transform 200ms;
}
.campaignwrapper .header .mbp-logo:hover {
  background: #000;
  padding: 0.5em 1em;
}
.campaignwrapper .header .mbp-links {
  z-index: 1;
  opacity: 0;
  position: absolute;
  transform: translatey(-100%);
  transition: transform 300ms, opacity 100ms;
  left: 0;
  margin: 0;
  list-style-type: none;
  line-height: 1;
  background: rgba(255, 255, 255, 0.95);
  width: 100%;
  padding: 0.5em 0;
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
}
.campaignwrapper .header.toggled .mbp-links {
  transform: translatey(0);
  opacity: 1;
}
.campaignwrapper .header.toggled .mbp-logo {
  background: #000;
  padding: 0.5em 2em;
}
.campaignwrapper .header .bar {
  z-index: 2;
  position: relative;
}
.campaignwrapper .header .bar a {
  display: block;
  color: #fff;
  text-decoration: none;
  position: absolute;
  top: 0;
  left: 100%;
  padding: 0.85em 0.7em 0;
  transition: background 200ms;
  bottom: 0;
  border-bottom-right-radius: 6px;
  background: rgba(0, 0, 0, 0.14);
}
.campaignwrapper .header .bar a:hover {
  color: #000;
  background: #fff;
}
.campaignwrapper .header li {
  display: block;
}
.campaignwrapper .header a {
  color: #000;
  text-decoration: none;
  padding: 0.3em 0.8em;
  display: block;
  font-size: 0.87em;
}
.campaignwrapper .header a:hover {
  background: #eee;
}

video {
  display: block;
}

.ratio-box {
  position: relative;
  height: 100%;
  width: 100%;
  display: block;
  background: #e7e7e8;
  overflow: hidden;
  /* padding-bottom is calculated and rendered in to HTML */
}
.ratio-box > img, .ratio-box > video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
  opacity: 0;
  transition: background 200ms ease-in, opacity 200ms ease-in;
}
.ratio-box > img {
  transform: scale(1.05);
  transition: background 200ms ease-in, opacity 200ms ease-in, transform 200ms ease-in;
}
.ratio-box:after {
  content: "";
  z-index: 101;
  opacity: 1;
  visibility: visible;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 50px;
  height: 50px;
  margin-left: -25px;
  margin-top: -25px;
  border: 8px solid rgba(255, 255, 255, 0.1);
  border-top-color: #b7b7b7;
  border-left-color: #b7b7b7;
  border-radius: 50%;
  -webkit-animation: loading 800ms linear 0s infinite;
          animation: loading 800ms linear 0s infinite;
  transition: opacity 600ms, visibility 600ms;
}
.ratio-box.lazy-loaded > img, .ratio-box.lazy-loaded > video {
  /* @see lazysizes-parentclass.js */
  background: none;
  opacity: 1;
}
.ratio-box.lazy-loaded > img {
  transform: scale(1);
}
.ratio-box.lazy-loaded:after {
  visibility: hidden;
  opacity: 0;
}

.video-wrapper {
  position: relative;
}
.video-wrapper video {
  width: 100%;
  margin: 0 auto;
  max-width: none;
}
.video-wrapper .hide-on-play {
  transition: opacity 200ms ease-out;
}
.video-wrapper.play-button:before {
  pointer-events: none;
  content: "▶";
  color: #fff;
  font-size: 200%;
  z-index: 2;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  transition: opacity 200ms;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}
.video-wrapper.play-button-alt:before {
  top: auto;
  bottom: 5%;
  left: auto;
  right: 5%;
  transform: none;
}
.video-wrapper.playing:before {
  opacity: 0;
}
.video-wrapper.playing .hide-on-play {
  opacity: 0;
}

@-webkit-keyframes loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(359deg);
  }
}

@keyframes loading {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(359deg);
  }
}
.text-over {
  width: 100%;
  position: absolute;
  z-index: 1;
}

.h-align {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.v-align {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}

.hv-align {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}

.no-break-small {
  white-space: nowrap;
}
@media (min-width: 600px) {
  .no-break-small {
    white-space: normal;
  }
}

@media (min-width: 600px) {
  .no-break-medium {
    white-space: nowrap;
  }
}

.l_full, .l_span_12 {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 2.34742%;
}

.l_half {
  width: 48.8262910798%;
  float: left;
  margin-right: 2.3474178404%;
  margin-bottom: 2.34742%;
}
@media (max-width: 768px) {
  .l_half {
    width: 48.2185273159%;
    float: left;
    margin-right: 3.5629453682%;
  }
}
@media (max-width: 600px) {
  .l_half {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
  }
}

.l_two_thirds {
  width: 65.8841940532%;
  float: left;
  margin-right: 2.3474178404%;
  margin-bottom: 2.34742%;
}
.l_span_9 .l_two_thirds {
  width: 65.6151419558%;
  float: left;
  margin-right: 3.1545741325%;
}
.l_span_9 .l_two_thirds.l_last {
  float: right;
  margin-right: 0;
}
@media (max-width: 600px) {
  .l_two_thirds {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
  }
}

.l_third {
  width: 31.7683881064%;
  float: left;
  margin-right: 2.3474178404%;
  margin-bottom: 2.34742%;
}
.l_span_9 .l_third {
  width: 31.2302839117%;
  float: left;
  margin-right: 3.1545741325%;
}
.l_span_9 .l_third.l_last {
  float: right;
  margin-right: 0;
}
@media (max-width: 600px) {
  .l_third {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
  }
}

.l_quarter {
  width: 23.2394366197%;
  float: left;
  margin-right: 2.3474178404%;
  margin-bottom: 2.34742%;
}
@media (max-width: 600px) {
  .l_quarter {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
  }
}

.l_three_quarters {
  width: 74.4131455399%;
  float: left;
  margin-right: 2.3474178404%;
  margin-bottom: 2.34742%;
}
@media (max-width: 600px) {
  .l_three_quarters {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
  }
}

.l_fifth {
  width: 18.5046728972%;
  float: left;
  margin-right: 1.8691588785%;
  margin-bottom: 2.34742%;
}
@media (max-width: 600px) {
  .l_fifth {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
  }
}

.l_two_fifths {
  width: 36.5048543689%;
  float: left;
  margin-right: 5.8252427184%;
  margin-bottom: 2.34742%;
}
@media (max-width: 600px) {
  .l_two_fifths {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
  }
}

.l_three_fifths {
  width: 57.6699029126%;
  float: left;
  margin-right: 5.8252427184%;
  margin-bottom: 2.34742%;
}
@media (max-width: 600px) {
  .l_three_fifths {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
  }
}

.l_four_fifths {
  width: 78.8349514563%;
  float: left;
  margin-right: 5.8252427184%;
  margin-bottom: 2.34742%;
}
@media (max-width: 600px) {
  .l_four_fifths {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
  }
}

@media (max-width: 768px) {
  .l_tablet_half {
    width: 48.2185273159%;
    float: left;
    margin-right: 3.5629453682%;
  }
}
@media (max-width: 600px) {
  .l_tablet_half {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
  }
}

@media (max-width: 768px) {
  .l_tablet_two_thirds {
    width: 31.2302839117%;
    float: left;
    margin-right: 3.1545741325%;
  }
}

@media (max-width: 768px) {
  .l_tablet_full {
    width: 100%;
    float: left;
    margin-left: 0;
    margin-right: 0;
  }
}

@media (max-width: 600px) {
  .l_mobile_half {
    width: 47.5961538462%;
    float: left;
    margin-right: 4.8076923077%;
    margin-bottom: 5.82524%;
  }
}

@media (max-width: 600px) {
  .l_mobile_third {
    width: 30.1282051282%;
    float: left;
    margin-right: 4.8076923077%;
  }
}

@media (max-width: 600px) {
  .l_mobile_two_thirds {
    width: 65.0641025641%;
    float: left;
    margin-right: 4.8076923077%;
  }
}

.l_last {
  float: right;
  margin-right: 0;
  display: inline;
}

@media (max-width: 768px) {
  .l_tablet_last {
    float: right;
    margin-right: 0;
  }
}

@media (max-width: 600px) {
  .l_mobile_last {
    float: right;
    margin-right: 0;
  }
}

/*on_small, on_medium, on_large*/
.on_medium, .on_large {
  display: none !important;
}

.on_small {
  display: block !important;
}

@media (min-width: 601px) {
  .on_small, .on_large {
    display: none !important;
  }

  .on_medium {
    display: block !important;
  }
}
@media (min-width: 769px) {
  .on_medium, .on_small {
    display: none !important;
  }

  .on_large {
    display: block !important;
  }
}
/*quickcheckout font*/
[class*=" q_"], [class^=q_] {
  font-family: quickcheckout !important;
  speak: none;
  font-style: normal;
  font-weight: 400;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.q_bondsco_alt:before {
  content: "";
}

.q_bondsco:before {
  content: "";
}

.q_cross:before {
  content: "☓";
}

.q_checkmark:before {
  content: "✔";
}

.q_minus:before {
  content: "➖";
}

.q_plus:before {
  content: "➕";
}

.q_arrow-left:before {
  content: "◀";
}

.q_arrow-down:before {
  content: "▼";
}

.q_arrow-up:before {
  content: "▲";
}

.q_arrow-right:before {
  content: "►";
}

.q_instagram:before {
  content: "i";
}

.q_twitter:before {
  content: "t";
}

.q_facebook:before {
  content: "f";
}

.q_pinterest-p:before {
  content: "p";
}

.q_envelope:before {
  content: "📧";
}

.q_location:before {
  content: "📍";
}

.q_target:before {
  content: "🎯";
}

.q_paypal-alt:before {
  content: "";
}

.q_mastercard:before {
  content: "";
}

.q_amex:before {
  content: "";
}

.q_visa:before {
  content: "";
}

.q_visa-checkout-alt:before {
  content: "";
}

.q_paypal:before {
  content: "";
}

.q_afterpay-logo:before {
  content: "";
}

.q_visa-checkout:before {
  content: "";
}

.q_afterpay-text:before {
  content: "";
}

.q_auspost:before {
  content: "📮";
}

.q_locker:before {
  content: "🔐";
}

.q_click-collect:before {
  content: "🍍";
}

.q_bonds:before {
  content: "";
}

.q_bondsb:before {
  content: "🍕";
}

.q_berleib:before {
  content: "";
}

.q_sheridan:before {
  content: "";
}

.q_sheridans:before {
  content: "S";
}

.q_champion:before {
  content: "";
}

.q_champion-red:before {
  content: "";
}

.q_jockey:before {
  content: "";
}

.q_jockeyicon:before {
  content: "";
}

.q_bondsoutlet:before {
  content: "";
}

.q_playtex:before {
  content: "";
}

.q_maidenform:before {
  content: "";
}

.q_totallytights:before {
  content: "";
}

.q_maidenformb:before {
  content: "";
}

.q_totallytightsb:before {
  content: "";
}

.q_bin:before {
  content: "🗑";
}

.q_heart-o:before {
  content: "♡";
}

.q_heart:before {
  content: "♥";
}

.q_star-half-empty:before,
.q_star-half-full:before,
.q_star-half-o:before {
  content: "";
}

.q_star-o:before {
  content: "☆";
}

.q_star:before {
  content: "★";
}

.q_berlei {
  position: relative;
}

.q_berlei:before {
  content: "";
}

.q_berlei:after {
  color: #A6192E;
  content: "";
  position: absolute;
  bottom: -0.101em;
  transform: translateY(-50%);
  left: -2%;
  font-size: 60%;
}

*,
*:before,
*:after {
  box-sizing: border-box;
}

body,
input {
  font-family: Montserrat;
}

.measure {
  padding: 20px;
  background: #e8e8e8;
  color: #fff;
  border-radius: 3px;
  border: 1px solid #d0d0d0;
}
.measure p {
  margin: 0.5em 0;
  color: #999;
  min-height: 42px;
}
.measure .loader {
  width: 40px;
  height: 40px;
  position: absolute;
  top: 114px;
  left: 50%;
  z-index: 0;
  margin-left: -20px;
}
.measure h4 {
  margin-bottom: 0;
}
.measure .yoursize {
  position: relative;
  background: #484848;
  border: 1px solid #222;
  width: 100%;
  margin: 0 auto;
  height: 130px;
  border-radius: 5px;
  overflow: hidden;
  margin-bottom: 60px;
  z-index: 2;
}
.measure .yoursize ul {
  float: left;
  list-style: none;
  display: block;
  margin: 0;
  padding: 0;
  position: relative;
  transition: top 300ms ease-out;
  -webkit-transition: top 300ms ease-out;
  top: 0;
  left: 0;
  width: 50%;
}
.measure .yoursize ul#underbust-size {
  text-align: right;
}
.measure .yoursize li {
  margin: 0;
  padding: 10px 0;
  display: block;
  height: 100px;
  font-size: 75px;
  width: 100%;
  line-height: 1;
  text-indent: 5px;
}
.measure .bust {
  position: relative;
}
.measure .bust .min,
.measure .bust .max {
  color: #666;
  position: absolute;
  left: 0;
  bottom: 1.5em;
  transform: rotate(60deg);
  -webkit-transform: rotate(60deg);
  z-index: 0;
  font-size: 13px;
}
.measure .bust .max {
  left: auto;
  right: -10px;
}
.measure .bust .thumb {
  position: relative;
  float: left;
  clear: both;
  margin-left: 11%;
  width: 80%;
  z-index: 1;
}
.measure .bust .thumb:before, .measure .bust .thumb:after {
  position: absolute;
  top: 2.8em;
  left: 0%;
  background: #000;
}
.measure .bust .thumb:after {
  padding: 0 0.5em;
  border-radius: 0.375em;
  transform: translate(-50%, -2.5em);
  -webkit-transform: translate(-50%, -2.5em);
  color: #f1f3f2;
  font: 1.0125em/2 verdana, sans-serif;
  content: "63cm";
}
.measure .bust .thumb:before {
  width: 1em;
  height: 1em;
  transform: translate(-50%, -1.12em) rotate(45deg);
  -webkit-transform: translate(-50%, -1.12em) rotate(45deg);
  content: "";
}
.measure .bust.over .thumb:after {
  content: "77cm";
}
.measure .intl {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2.4em;
  text-align: center;
  background: #333333;
  line-height: 2.4em;
  font-size: 0.8em;
}
.measure .intl span:before {
  content: attr(title);
  display: inline;
  opacity: 0.7;
}
.measure button.btn_icon.btn_has_arrow {
  margin: 0 auto;
  display: block;
  position: absolute;
  bottom: 70px;
  transition: all ease-in-out 200ms;
  -webkit-transition: all ease-in-out 200ms;
  z-index: 0;
  opacity: 0;
  left: 0;
  right: 0;
  width: 100%;
  padding: 12px 0 10px 0;
}
.measure button.btn_icon.btn_has_arrow.show {
  bottom: 0;
  opacity: 1;
}
.measure button.btn_icon.btn_has_arrow.btn_icon:hover {
  background: #d0d0d0;
  border: 2px solid transparent;
}
.measure button i {
  background: #000;
  padding: 3px 5px;
  border-radius: 5px;
  font-style: normal;
  color: #fff;
}
.measure button .btn_disabled {
  color: #ccc;
}
.measure button .btn_disabled i {
  background: #ccc;
}
.measure input[type=range] {
  align-self: center;
  border: none;
  width: 100%;
  height: 5em;
  border-radius: 0.25em;
  background: transparent;
  font-size: 1em;
  cursor: pointer;
  margin-bottom: 3.4em;
}
.measure input[type=range]#overbust:before {
  content: "";
  position: absolute;
  display: block;
  background: #484848;
  width: 43%;
  height: 2.4em;
  top: 2.8em;
  left: 0;
  z-index: 0;
  transition: 200ms all;
  -webkit-transition: 200ms all;
  border-radius: 3px;
}
.measure input[type=range],
.measure input[type=range]::-webkit-slider-runnable-track,
.measure input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 100%;
  position: relative;
}
.measure input[type=range]::-webkit-slider-runnable-track {
  border: none;
  width: 100%;
  height: 1em;
  border-radius: 0.25em;
  box-shadow: inset 0 0.125em 0.125em #444;
  background: rgba(203, 203, 203, 0.8);
  margin-bottom: -3em;
}
.measure input[type=range]::-moz-range-track {
  border: none;
  width: 100%;
  height: 1em;
  border-radius: 0.25em;
  box-shadow: inset 0 0.125em 0.125em #444;
  background: #555;
  margin-bottom: -3em;
}
.measure input[type=range]::-ms-track {
  border: none;
  width: 100%;
  height: 1em;
  border-radius: 0.25em;
  box-shadow: inset 0 0.125em 0.125em #444;
  background: #555;
  margin-bottom: -3em;
  color: transparent;
}
.measure input[type=range]::-ms-fill-lower, .measure input[type=range]::-ms-fill-upper {
  background: transparent;
}
.measure input[type=range]::-webkit-slider-thumb {
  border: none;
  width: 20%;
  height: 2em;
  border-radius: 0.25em;
  box-shadow: 0 -0.05em 0.05em #484848;
  background: #e31937;
  background: linear-gradient(#e31937 0%, #840f0f 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#e31937", endColorstr="#840f0f", GradientType=0 );
  margin-top: -0.5em;
}
.measure input[type=range]::-moz-range-thumb {
  border: none;
  width: 20%;
  height: 2em;
  border-radius: 0.25em;
  box-shadow: 0 -0.05em 0.05em #484848;
  background: #e31937;
  background: linear-gradient(#e31937 0%, #840f0f 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#e31937", endColorstr="#840f0f", GradientType=0 );
  margin-top: -0.5em;
  cursor: ew-resize;
}
.measure input[type=range]::-ms-thumb {
  border: none;
  width: 20%;
  height: 2em;
  border-radius: 0.25em;
  box-shadow: 0 -0.05em 0.05em #484848;
  background: #e31937;
  background: linear-gradient(#e31937 0%, #840f0f 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#e31937", endColorstr="#840f0f", GradientType=0 );
  margin-top: -0.5em;
}
.measure input[type=range]:focus {
  outline: none;
}
.measure .l_third {
  margin-bottom: 0;
}

@media (min-width: 601px) and (max-width: 768px) {
  .l_tablet_half.l_tablet_center {
    margin: 0 25.89%;
  }
}

h4, p {
  color: black;
}

#article {
  padding: 3% 10% 0 0;
}