* {box-sizing: border-box;}

.img-comp-container {
  position: relative;
  height: 514px;
  width: 514px;
  float: left;
  margin: 18px;
}

.img-comp-img {
  position: absolute;
  height: 514px;
  width: 514px;
  overflow: hidden;
}

.img-comp-img img {
  display: block;
  vertical-align: middle;
  max-width:none;
}

.img-comp-slider {
  position: absolute;
  z-index: 9;
  cursor: ew-resize;
  /*set the appearance of the slider:*/
 	width: 21px;
				height: 21px;
				left: -9px;
				top: 50%;
				margin-top: -10px;
				background-color: white;
				transform: rotate(45deg);
}

.avantaprescont{
width: 1100px;
	height:1410px;
	margin:0 auto;
		text-align:center;
	}

  /*--------------------------------------------------1280-----------------------------------------------------*/
@media screen and (max-width:1280px){

  .img-comp-container {
  position: relative;
  height: 373px;
  width: 373px;
  float: left;
  margin: 15px;
  /*should be the same height as the images*/
}

.img-comp-img {
  position: absolute;
  height: 373px;
  width: 373px;
  overflow: hidden;
}

.img-comp-img img {
  height: 373px;
  width: 373px;
}

.avantaprescont{
width: 818px;
	height:860px;
	margin:0 auto;
		text-align:center;
	}

.avantapres{
margin:0 auto;
	height:2708px;
		width: 909px;
	text-align:center;
	}
}

  /*--------------------------------------------------960-----------------------------------------------------*/
@media screen and (max-width:960px){

  .avantaprescont{
	width: 387px;
	height:1580px;
  	margin:0 auto;
	}

    .img-comp-container {
  margin: 7px;
}

  .avantapres{
		width: 100%;
    height: 4880px;
	}


}


/*--------------------------------------------------650-----------------------------------------------------*/
@media screen and (max-width:650px){

  .img-comp-img {
    position: absolute;
    height: 300px;
    width: 300px;
    overflow: hidden;
  }

  .img-comp-img img {
    height: 300px;
    width: 300px;
  }
  .img-comp-container {
  position: relative;
  height: 300px;
  width: 300px;
  float: left;
  margin: 15px;
  /*should be the same height as the images*/
}

.avantaprescont{
width: 332px;
height:1410px;
  margin:0 auto;
}

.avantapres{
  width: 100%;
  height: 4300px;
}

}
