body {
  overflow: auto; /* Default */
  transition: overflow 0.1s ease;
}

section.click {
  z-index: 1; /* Default z-index */
  min-height: 40vh;
  overflow: scroll;
}

#font-tester {
  position: absolute;
  top: 60px;
  bottom: 0;
  display: flex;
pointer-events: none;
  width: 100%;
  opacity: 0;
  z-index: 0;
  padding: 70px 30px 30px 30px;
 
}

.font-sample {
  font-size: 9vw;
  line-height: 100%;
  color: white;
  width: 75%;
  flex: 1;
  overflow:scroll;
  padding-left: 10px
}

.font-sample::selection {
  color: #000;
  background: #FEC5CBfe;
}

[contenteditable] {
  outline: 0px solid transparent;
}

.font-styles {
  /* 	flex: 0 0 25%; */
  /* flex: 0 0 calc(100% * 0.18); */
  padding: 10px 30px 50px 0;
  white-space: nowrap;
  overflow: scroll;
/*   min-width: max-content; */
min-width: 12.5%;

}

button.weight-button {
  display: block;
  padding: 0 0 10px 0 !important;
  background-color: transparent;
  color: #fff !important;
  border: 0;
  cursor: pointer;

}

button.weight-button:hover {
  text-decoration: underline;
}

button.active {
  text-decoration: underline !important;
}

.close-icon {
  position: absolute;
  top: 20px;
  right: 30px;
  font-size: 24px;
  cursor: pointer;
  display: none;
  z-index: 10000;
  color: #fff;
}
.smp-image{
	cursor: pointer;
	
}


.try-me {
  position: absolute;
  top: 25px;
  right: 30px;
  font-size: 24px;
  cursor: pointer;
  display: block;
  z-index: 51;
  color: #fff !important;
  text-decoration: underline !important;
}

.full-screen .close-icon {
  display: block;
}

.ot-hide {
  display: none !important;
}

section.click {
  background-color: #000 !important;
  /* 	transition: transform 1s ease, z-index 1s ease; */
}

@media only screen and (max-width: 768px) {
  .try-me {
    display: none !important;
  }
  .smp-image img{
	  height: 40vh!important;
	  width: auto!important;
	  max-height: none!important;
	  max-width: none!important;
	  overflow: visible!important;
	  
  }
  .smp-image{
	  overflow: scroll!important;
	  width: 100vw;
  position: relative;
  left: calc(-50vw + 50%);
  display: block!important;
  cursor:default;
  }
  #font-tester{
	  display: none!important;
	  }
}