@import url('https://fonts.googleapis.com/css2?family=PT+Serif:wght@400;700&display=swap');


.popup-wrap h1, .popup-wrap h2, .popup-wrap h3, .popup-wrap h4, .popup-wrap h5
{
  font-family: 'PT Serif', serif;
}
.popup-wrap {
    background-color: rgb(0 0 0 / 60%);
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
  display:none;
  z-index: 9999999;
}

.pop {
  position: absolute;
  z-index:9999;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%); 
  max-width: 800px;
  width: 100%;
  height: auto;
  max-height: 100%;
  color: white;
  text-align: center;
  box-shadow: 0 0 10px 1px rgb(51 51 51 / 31%);
  border-radius: 20px;
  padding: 20px;

}

.pop i{
    position:absolute; 
    right: 8px;
    top: 8px; 
    font-size: 1.2em;
    cursor:pointer;
  }
.pop i:hover{
  color: #ffe7d4;
}
.pop .pt-2
{
  padding-top: 10px;
}

.popup-heading1 {
    text-transform: capitalize;
    font-size: 2.4em;
    font-weight: 500;
    margin-top: 10px;
    color: #fff;
    text-shadow: 2px 2px 0px #18435a;
    padding: 10px 0px;
    background-image: linear-gradient(90deg, transparent, #827c7d, transparent);
    font-family: 'Balsamiq Sans', cursive;
    letter-spacing: 0.4px;
}
.popup-heading2 {
    text-transform: capitalize;
    padding: 5px;
    font-size: 2.1em;
    color: #ff8b4b;
    font-weight: 700;
    letter-spacing: 0.5px;
}
.popup-heading3 {
    text-transform: capitalize;
    font-size: 1.5em;
    color: #fff;
    font-weight: 400;
    letter-spacing: 0.5px;
    padding: 5px;
}
.popup-product
{
  max-width: 55%;
  width: 100%;
  display: block;
  margin: 10px auto;
}

.popup-heading1 span {
    text-transform: uppercase;
    color: #ff8b4b;
}
.popup-btn {
    padding: 10px;
    width: 100%;
}
.popup-btn a {
    color: #fff;
    text-transform: capitalize;
    font-size: 21px;
    border: 2px solid #fff;
    max-width: 320px;
    width: 100%;
    display: block;
    margin: auto;
    padding: 10px 0px;
    border-radius: 20px;
    letter-spacing: 0.5px;
    font-weight: 500;
    transition: .3s linear all;
    background-color: #ff8b4b;
}
.popup-btn:hover a
{
  background-color: #fff;
  color: #ff8b4b;
  border-color: #ff8b4b;
}
.white-bg
{
  background-color: #fff;
}
.gradient-bg
{  
  background-image: url('../image/Sprinkle.svg'), linear-gradient(132deg, #12405b, #365056);
}

@media (max-width: 1024px)
{
  .popup-heading1
  {
    font-size: 2.4em;
  }
  .popup-heading2
  {
    font-size: 2em;
  }
  .popup-heading3 {
    font-size: 1.5em;
  }
}
@media (max-width: 968px)
{
  .popup-heading1
  {
    margin-bottom: 10px;
  }
}
@media (max-width: 810px)
{
  .pop
  {
    padding: 30px 15px;
    width: 95%;
  }
}
@media (max-width: 768px)
{  
  .popup-heading1 {
      font-size: 2.3em;
  }
  .popup-product {
      max-width: 62%;
    }

}
@media (max-width: 425px)
{
  .popup-heading1 {
      font-size: 2em;
      line-height: 1.2;
  }
  .popup-heading2 {
      font-size: 1.8em;
  }
  .popup-heading3 {
      font-size: 1.4em;
  }
  .popup-btn a
  {
    font-size: 19px;
  }
  
}
@media (max-width: 375px)
{
  .popup-heading1 {
    font-size: 1.9em;
  }
  .popup-heading2 {
      font-size: 1.7em;
  }
  .popup-heading3 {
      font-size: 1.3em;
  }
  .popup-btn a {
      font-size: 18px;
      padding: 10px 10px;
  }
}
@media (max-width: 320px)
{
  .popup-heading1 {
      font-size: 1.8em;
  }
  .popup-heading2 {
      font-size: 1.6em;
      letter-spacing: 0.9px;
  }
  .popup-heading3 {
      font-size: 1.2em;
  }
  .popup-btn a {
    font-size: 17px;
  }
  .popup-btn {
    padding: 10px 2px;
  }
}
/*@media only screen and (min-width: 481px) {

  .pop i{
    font-size:2rem;
  }
  .pop {
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%); 
    width: 55%;
    height: 55%;
  }
} */