html,
body {
  margin: 0;
  height: 100%;
  width: 100%;
}

p {
  margin: 0;
}

.contentwithbg {
  width: 100%;
  height: 100%;
  background: #fff0ed;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.contentwithbg2 {
  width: 100%;
  height: 100%;
  background: url('../../../../../images/backgrounds/pink_gradient.jpg');
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.nextBtn {
  display: none;
  position: absolute;
  bottom: 0%;
  right: 0%;
  width: 7%;
  height: 10%;
}

.prevBtn {
  display: none;
  position: absolute;
  bottom: 0%;
  left: 0%;
  width: 7%;
  height: 10%;
}

.myNextStyle {
  cursor: pointer;
  background-image: url('../../../../../images/arrows/arrow.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.myNextStyle:hover {
  background-image: url('../../../../../images/arrows/arrow_hover.png');
}

.myNextStyle:active {
  background-image: url('../../../../../images/arrows/arrow_active.png');
}

.myPrevStyle {
  cursor: pointer;
  background-image: url('../../../../../images/arrows/arrow_prev.png');
  background-repeat: no-repeat;
  background-size: 100% 100%;
}

.myPrevStyle:hover {
  background-image: url('../../../../../images/arrows/arrow_hover_prev.png');
}

.myPrevStyle:active {
  background-image: url('../../../../../images/arrows/arrow_active_prev.png');
}

.board {
  position: relative;
  top: 0%;
  left: 0%;
  text-align: center;
  height: 100%;
  width: 100%;
  font-family: andika;
}
.board:lang(np) * {
  font-family: laila !important;
}

.vertical-horizontal-center {
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  text-align: center;
}

.vertical-center {
  position: relative;
  top: 45%;
  transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  text-align: center;
}

.coverboardfull {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

div.generalTemplateblock {
  position: absolute;
  top: 0%;
  left: 0%;
  width: 100%;
  height: 100%;
  /*border   : 1px solid red; */
}

div.headerblock {
  position: absolute;
  top: 3%;
  left: 50%;
  transform: translateX(-50%);
  width: 80%;
  color: white;
  font-size: 5vmin;
  z-index: 10;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}
div.headerblock:lang(np) {
  padding-top: 1%;
  font-size: 4vmin;
}
div.generalTemplateblock[data-templatecontains='hasheaderblock']
  div.contentblock {
  top: 20%;
  height: 80%;
  position: absolute;
  width: 100%;
}

div.generalTemplateblock[data-templatecontains='hasonlycontent']
  div.contentblock {
  top: 0%;
  height: 100%;
}

div.firstpage {
  position: relative;
  height: 90%;
  width: 100%;
  margin-top: 2%;
  margin-bottom: 2%;
}

div.fiftypage {
  position: relative;
  height: 50%;
  width: 100%;
  margin-top: 2%;
  margin-bottom: 2%;
}

div.imageblock {
  position: relative;
  height: 100%;
  width: 100%;
  /*border     : 1px solid green; */
}

.maincontainer {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  font-size: 1.3em;
  box-shadow: inset 0 0 30px #f2f2f2;
}

/* magnet start */
.cover_page {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.firsttitle {
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
  position: absolute;
  font-size: 10vmin;
  width: 50%;
}
.firsttitle2 {
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
  position: absolute;
  font-size: 2vw;
  width: 50%;
}
.bg_image {
  width: 100%;
  height: 100%;
}
.usetext {
  font-size: 2.5vmin;
  inline-size: 30ch;
  padding: 1%;
}
.usetext:lang(np) {
  inline-size: 25ch;
}

.utbtext {
  position: absolute;
  left: 50%;
  top: 12%;
  font-size: 2.5vmin;
  padding: 3% 12%;
  width: 70%;
  height: 22%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
}
.top-30 {
  top: 30%;
}
.lbbtext {
  display: none;
  position: absolute;
  left: 50%;
  top: 85%;
  font-size: 2.5vmin;
  padding: 3% 12%;
  width: 70%;
  height: 20%;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translate(-50%, -50%);
}
.eye_image {
  position: absolute;
  top: 3%;
  left: 15%;
  width: 10%;
}

.hightext {
  color: #e66c7a;
}

.multipleimg {
  position: absolute;
  width: 15%;
}

.imgone {
  top: 35%;
  left: 5%;
}

.imgotwo {
  top: 35%;
  left: 27%;
}

.imgthree {
  top: 35%;
  left: 49%;
}

.imgfour {
  top: 35%;
  left: 72%;
}

.imgfive {
  top: 66%;
  left: 5%;
}

.imgsix {
  top: 66%;
  left: 27%;
}

.imgsev {
  top: 66%;
  left: 49%;
}

.imgeight {
  top: 66%;
  left: 72%;
}
.imglabel {
  position: absolute;
  font-size: 1.4vw;
}
.computer_label {
  top: 57%;
  left: 8%;
}
.fan_label {
  top: 57%;
  left: 30%;
}
.fridge_label {
  top: 57%;
  left: 52%;
}
.iron_label {
  top: 57%;
  left: 78%;
}
.mobile_label {
  top: 88%;
  left: 10%;
}
.speaker_label {
  top: 88%;
  left: 31%;
}
.vaccum_label {
  top: 88%;
  left: 51%;
}
.watch_label {
  top: 88%;
  left: 78%;
}
.dyk1 {
  top: 45%;
  left: 7%;
  width: 19%;
}

.dyk2 {
  top: 45%;
  left: 37%;
  width: 19%;
}

.dyk3 {
  top: 45%;
  left: 67%;
  width: 19%;
}

.magnet1 {
  position: absolute;
  transform: translate(-50%, -50%);
  left: 50%;
  top: 56%;
  height: 16%;
}

.magnet2 {
  position: absolute;
  transform: translate(-50%, -50%);
  top: 60%;
  height: 16%;
  width: 15%;
}
.magnet3 {
  position: absolute;
  transform: translate(-50%, -50%);
  left: 65%;
  top: 60%;
  height: 16%;
  width: 15%;
}
.south_break {
  z-index: 1;
  left: 35%;
}
.north_break {
  left: 25%;
}
.south_break_1 {
  left: 65%;
}
.north_break_1 {
  left: 76%;
}
.cssfadein {
  animation: fadein 1s linear forwards;
}

@keyframes fadein {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1 !important;
  }
}

@-webkit-keyframes fadein {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1 !important;
  }
}

.textblock {
  position: absolute;
  top: 0%;
  left: 0%;
  width: 100%;
  height: 100%;
  z-index: 5;
}
/* slider section */

.slider_top_section {
  position: relative;
  width: max-content;
  min-width: 100%;
  height: 100%;
  transition: all 800ms ease;
  left: 0;
  display: flex;
  justify-content: center;
}
.slider {
  margin-top: auto;
  height: 80%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-around;
}
.slider_item {
  position: relative;
  width: 80%;
  height: 60%;
}
.slider_item > svg {
  width: 100%;
  height: 100;
}
.slider-content {
  width: fit-content;
  position: relative;
  padding: 3%;
}

.slider_item img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.slider_top_section {
  flex-basis: 100%;
}
.slider_bottom_section {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 15%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #4696c0;
  border: 1px solid #85bddb;
  border-radius: 10px;
  overflow: hidden;
}
.slider_next_button,
.slider_prev_button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  width: 10%;
  height: 10%;
  align-items: center;
  justify-content: center;
  background: green;
  cursor: pointer;
}

.slider_next_button {
  right: 0;
}

.sound_7 {
  width: 80%;
  margin: auto;
}