iframe.one {
  width: 640px;
  height: 480px;
  display: block;
  margin: auto;
}

@media only screen and (max-width: 660px) {
  iframe.one  {
  width: 320px;
  height: 240px;
  }
}

iframe.both {
  width: 100%;
  display: block;
  margin: auto;
}

/*MULTI COMPARISON SLIDER*/

.wrapper{
  width: 1000px;
  height: 600px;
  position: relative;
  margin: auto;
  top:50%;
  overflow:visible;
  box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}


.bottom,
.middle,
.top {
  width: 100%;
  height: 100%;
  background-repeat:no-repeat;
  background-size: cover;
  background-position: center;
  position: absolute;
  top:0;
  left:0;
  overflow: hidden;
}

.scroller{
  position: absolute;
  height: 44px;
  width: 44px;
  left:50%;
  top:50%;
  border-radius:50%;
  opacity:1;
  background: #445b7c url("../img/cd-arrows.svg") no-repeat center center;
  cursor: move;
  box-shadow: 0 0 0 6px rgba(0, 0, 0, 0.2), 0 0 10px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.3);
}
.scroller-middle{
  margin-top:25px;
}
.scroller-top{
  margin-top:-25px;
}

.scroller:hover{
  opacity:1;
}

.scrolling{
  background-color: #3fcdc7;
  opacity:1;
}