/*-------mcmockup1---------*/
#displaymcmockup1 {
  position: relative;
  left: 0px;
  height: 539px;
  width: 1077px;
  background-image: url("../images/mockupbg/miscellaneous/bg1.png");
}
.mcmockup1desktop {
  position: absolute;
  width: 350px;
  height: 332px;
  background-image: url("../images/large-screen-optimised2.png");
  top: 90px;
  right: 3%;
  z-index: 1;
}
.mcmockup1desktop iframe {
  left: 18px;
  top: 24px;
  width: 1600px;
  height: 995px;
  transform: scale(0.196, 0.196);
  -webkit-transform: scale(0.196, 0.196);
  -o-transform: scale(0.196, 0.196);
  -ms-transform: scale(0.196, 0.196);
  -moz-transform: scale(0.196, 0.196);
  transform-origin: top left;
  -webkit-transform-origin: top left;
  -o-transform-origin: top left;
  -ms-transform-origin: top left;
  -moz-transform-origin: top left;
}
.mcmockup1tablet {
  position: absolute;
  width: 150px;
  height: 208px;
  background-image: url("../images/ipad150px.png");
  top: 295px;
  right: 16%;
  z-index: 1;
}
.mcmockup1tablet iframe {
  transform: scale(0.219, 0.219);
  -webkit-transform: scale(0.219, 0.219);
  -o-transform: scale(0.219, 0.219);
  -ms-transform: scale(0.219, 0.219);
  -moz-transform: scale(0.219, 0.219);
  transform-origin: top left;
  -webkit-transform-origin: top left;
  -o-transform-origin: top left;
  -ms-transform-origin: top left;
  -moz-transform-origin: top left;
  top: 9px;
  left: 8px;
  width: 610px;
  height: 870px;
  overflow-y: hidden;
  border-radius: 15px;
}

.mcmockup1mobile {
  position: absolute;
  width: 80px;
  height: 146px;
  background-image: url("../images/iphone80px.png");
  top: 360px;
  right: 8%;
  z-index: 1;
}
.mcmockup1mobile iframe {
  transform: scale(0.219, 0.219);
  -webkit-transform: scale(0.219, 0.219);
  -o-transform: scale(0.219, 0.219);
  -ms-transform: scale(0.219, 0.219);
  -moz-transform: scale(0.219, 0.219);
  transform-origin: top left;
  -webkit-transform-origin: top left;
  -o-transform-origin: top left;
  -ms-transform-origin: top left;
  -moz-transform-origin: top left;
  width: 275px;
  height: 590px;
  top: 8px;
  left: 10px;
  overflow-y: hidden;
  border-radius: 35px;
}

.mcmockup1desktopfull1 {
  position: absolute;
  width: 377px;
  height: 500px;
  top: 4%;
  left: 2%;
  z-index: 1;
  border-radius: 5px;
  box-shadow: 2px 2px 10px;
}
.mcmockup1desktopfull1 iframe {
  left: 0px;
  top: 0px;
  width: 1366px;
  height: 2250px;
  border: none;
  border-radius: 5px;
  transform: scale(0.28, 0.28);
  -webkit-transform: scale(0.28, 0.28);
  -o-transform: scale(0.28, 0.28);
  -ms-transform: scale(0.28, 0.28);
  -moz-transform: scale(0.28, 0.28);
  transform-origin: top left;
  -webkit-transform-origin: top left;
  -o-transform-origin: top left;
  -ms-transform-origin: top left;
  -moz-transform-origin: top left;
}
.mcmockup1desktopfull2 {
  position: absolute;
  width: 242px;
  height: 540px;
  top: 0px;
  left: 39%;
  z-index: 0;
}
.mcmockup1desktopfull2 iframe {
  left: 0px;
  top: 0px;
  width: 1366px;
  height: 2992px;
  transform: scale(0.18, 0.18);
  -webkit-transform: scale(0.18, 0.18);
  -o-transform: scale(0.18, 0.18);
  -ms-transform: scale(0.18, 0.18);
  -moz-transform: scale(0.18, 0.18);
  transform-origin: top left;
  -webkit-transform-origin: top left;
  -o-transform-origin: top left;
  -ms-transform-origin: top left;
  -moz-transform-origin: top left;
}
/*-------mcmockup1 end---------*/

/*-------mcmockup2---------*/
#displaymcmockup2 {
  position: relative;
  left: 0px;
  width: 512px;
  height: 512px;
  background-image: url("../images/mockupbg/miscellaneous/squarebg1.png");
}
.mcmockup2desktopfull1 {
  position: absolute;
  width: 270px;
  height: 470px;
  top: 4%;
  left: 2%;
  z-index: 1;
}
.mcmockup2desktopfull1 iframe {
  left: 0px;
  top: 0px;
  width: 1366px;
  height: 2360px;
  border: none;
  border-radius: 5px;
  transform: scale(0.2, 0.2);
  -webkit-transform: scale(0.2, 0.2);
  -o-transform: scale(0.2, 0.2);
  -ms-transform: scale(0.2, 0.2);
  -moz-transform: scale(0.2, 0.2);
  transform-origin: top left;
  -webkit-transform-origin: top left;
  -o-transform-origin: top left;
  -ms-transform-origin: top left;
  -moz-transform-origin: top left;
}
.mcmockup2desktopfull2 {
  position: absolute;
  width: 200px;
  height: 500px;
  top: 6px;
  left: 58%;
  z-index: 0;
}
.mcmockup2desktopfull2 iframe {
  left: 0px;
  top: 0px;
  width: 1366px;
  height: 3326px;
  transform: scale(0.15, 0.15);
  -webkit-transform: scale(0.15, 0.15);
  -o-transform: scale(0.15, 0.15);
  -ms-transform: scale(0.15, 0.15);
  -moz-transform: scale(0.15, 0.15);
  transform-origin: top left;
  -webkit-transform-origin: top left;
  -o-transform-origin: top left;
  -ms-transform-origin: top left;
  -moz-transform-origin: top left;
}
/*-------mcmockup2 end---------*/

/*-------mcmockup3---------*/
#displaymcmockup3 {
  position: relative;
  left: 0px;
  width: 512px;
  height: 512px;
  background-image: url("../images/mockupbg/miscellaneous/squarebg1.png");
}
.mcmockup3desktopfull1 {
  position: absolute;
  width: 350px;
  height: 470px;
  top: 4%;
  left: 2%;
  z-index: 1;
  box-shadow: 0px 0px 5px;
  border-radius: 5px;
}
.mcmockup3desktopfull1 iframe {
  left: 0px;
  top: 0px;
  width: 1366px;
  height: 1820px;
  border: none;
  border-radius: 5px;
  transform: scale(0.26, 0.26);
  -webkit-transform: scale(0.26, 0.26);
  -o-transform: scale(0.26, 0.26);
  -ms-transform: scale(0.26, 0.26);
  -moz-transform: scale(0.26, 0.26);
  transform-origin: top left;
  -webkit-transform-origin: top left;
  -o-transform-origin: top left;
  -ms-transform-origin: top left;
  -moz-transform-origin: top left;
}
.mcmockup3desktopfull2 {
  position: absolute;
  width: 200px;
  height: 500px;
  top: 6px;
  left: 58%;
  z-index: 0;
}
.mcmockup3desktopfull2 iframe {
  left: 0px;
  top: 0px;
  width: 1366px;
  height: 3326px;
  transform: scale(0.15, 0.15);
  -webkit-transform: scale(0.15, 0.15);
  -o-transform: scale(0.15, 0.15);
  -ms-transform: scale(0.15, 0.15);
  -moz-transform: scale(0.15, 0.15);
  transform-origin: top left;
  -webkit-transform-origin: top left;
  -o-transform-origin: top left;
  -ms-transform-origin: top left;
  -moz-transform-origin: top left;
}
/*-------mcmockup3 end---------*/

/*-------mcmockup4---------*/
#displaymcmockup4 {
  position: relative;
  left: 0px;
  width: 512px;
  height: 512px;
  background-image: url("../images/mockupbg/miscellaneous/squarebg1.png");
}
.mcmockup4desktopfull1 {
  position: absolute;
  width: 270px;
  height: 470px;
  top: 21px;
  left: 15px;
  z-index: 1;
}
.mcmockup4desktopfull1 iframe {
  left: 0px;
  top: 0px;
  width: 1366px;
  height: 2360px;
  border: none;
  border-radius: 5px;
  transform: scale(0.2, 0.2);
  -webkit-transform: scale(0.2, 0.2);
  -o-transform: scale(0.2, 0.2);
  -ms-transform: scale(0.2, 0.2);
  -moz-transform: scale(0.2, 0.2);
  transform-origin: top left;
  -webkit-transform-origin: top left;
  -o-transform-origin: top left;
  -ms-transform-origin: top left;
  -moz-transform-origin: top left;
}
.mcmockup4desktopfull2 {
  position: absolute;
  width: 200px;
  height: 470px;
  top: 21px;
  right: 15px;
  z-index: 0;
}
.mcmockup4desktopfull2 iframe {
  left: 0px;
  top: 0px;
  width: 1366px;
  height: 3140px;
  transform: scale(0.15, 0.15);
  -webkit-transform: scale(0.15, 0.15);
  -o-transform: scale(0.15, 0.15);
  -ms-transform: scale(0.15, 0.15);
  -moz-transform: scale(0.15, 0.15);
  transform-origin: top left;
  -webkit-transform-origin: top left;
  -o-transform-origin: top left;
  -ms-transform-origin: top left;
  -moz-transform-origin: top left;
}
/*-------mcmockup4 end---------*/