html.pum-open.pum-open-overlay.pum-open-scrollable body > [aria-hidden] {
padding-right: 0px;
}
.popup21 {
font-size: 10px;
}
@media (max-width: 767px) {
.popup21 {
font-size: 8px;
}
.popup21 .email-container {
text-align: center;
}
}
@media (max-width: 480px) {
.popup21 {
font-size: 6px;
}
}
.popup21 .nf-form-fields-required,
.popup21 .nf-error-msg.nf-error-field-errors {
display: none;
} .popup21 .discount-title {
color: #B757A1;
font-weight: bold;
}
.popup21 .col1 {
background: url(../../../../wp-content/themes/shopkeeper-child/images/newsletter/261180-background.jpg);
background-color: #EAE8EB;
background-repeat: no-repeat;
background-size: cover;
}
.popup21 .col2 {
background-color: #E0CADD;
}
.popup21 .col2 .text1 p {
font-family: 'Roboto';
font-weight: 500;
font-size: 2.6em;
color: #000;
}
.popup21 .col2 .percentage p {
position: relative;
font-family: 'Roboto';
font-weight: 500;
font-size: 5.4em;
color: #fff;
background-color: #B757A1;
display: inline-block;
padding: 6px 36px;
line-height: 1;
text-align: center;
}
.popup21 .col2 .percentage {
position: relative;
}
.popup21 .percentage p::before {
content: "";
display: block;
position: absolute;
left: 14px;
top: 40%;
width: 100%;
height: 80%;
background: url(../../../../wp-content/themes/shopkeeper-child/images/newsletter/503367-lines.png);
background-repeat: no-repeat;
background-size: cover;
z-index: -1;
}
.popup21 input[type="text"], 
.popup21 input[type="password"], 
.popup21 input[type="date"], 
.popup21 input[type="datetime"], 
.popup21 input[type="datetime-local"], 
.popup21 input[type="month"], 
.popup21 input[type="week"], 
.popup21 input[type="email"], 
.popup21 input[type="number"], 
.popup21 input[type="search"], 
.popup21 input[type="tel"], 
.popup21 input[type="time"], 
.popup21 input[type="url"], 
.popup21 textarea, 
.popup21 select {
background-color: transparent !important;
height: 60px;
border: 2px solid #9C388A !important;
border-radius: 2px 13px 13px 2px;
vertical-align: middle;
display: inline-block;
width: 200px;
font-size: 1.4em;
}
.popup21 .checkbox-container {
margin-bottom: 10px;
}
.popup21 .checkbox-container .nf-field-label label {
text-transform: none;
}
.popup21 .field-wrap.email-wrap .nf-field-element .play-icon {
width: 60px;
height: 60px;
display: inline-block;
vertical-align: middle;
margin-right: 4px;
position: relative;
border: 2px solid #9C388A !important;
border-top-left-radius: 13px;
border-bottom-left-radius: 13px;
}
.popup21 .field-wrap.email-wrap .nf-field-element .play-icon svg {
fill: #9C388A;
width: 50%;
position: absolute;
top: 51%;
left: 52%;
transform: translate(-50%, -50%) rotate(90deg);
}
.popup21 .email-container {
margin-bottom: 10px;
}
.popup21 .submit-wrap .nf-field-element .nf-element {
background-color: transparent !important;
color: #000;
text-transform: initial;
font-size: 2em;
padding: 10px !important;
text-align: left;
transition: all 0.3s linear;
}
.popup21 .submit-wrap .nf-field-element .nf-element:hover {
color: #9C388A;
}
.popup21 .nf-error-msg {
font-size: 1.4em;
}
.popup21 .nf-response-msg p {
color: #000000;
}
@media (min-width: 768px) {
.popup21 .nf-form-content {
padding-right: 30px;
margin-left: -82px;
}
.popup21 div#nf-field-31-container {
position: absolute;
left: -32%;
}
.popup21 .overlap {
margin-left: -30px;
}
.popup21 .onto {
margin-left: -23%;
}  
}
@media (max-width: 767px) {
.popup21 .col1 {
display: none !important;
}
.popup21 .submit-container {
margin-bottom: 0;
}
.popup21 .nf-error-msg {
font-size: 2em;
}
.popup21 .submit-wrap .nf-element {
font-size: 2.4em !important;
}
.popup21 .submit-wrap .nf-field-element,
.popup21 .submit-wrap .nf-field-element .nf-element {
text-align: center !important;
}
.popup21 input[type="text"], 
.popup21 input[type="password"], 
.popup21 input[type="date"], 
.popup21 input[type="datetime"], 
.popup21 input[type="datetime-local"], 
.popup21 input[type="month"], 
.popup21 input[type="week"], 
.popup21 input[type="email"], 
.popup21 input[type="number"], 
.popup21 input[type="search"], 
.popup21 input[type="tel"], 
.popup21 input[type="time"], 
.popup21 input[type="url"], 
.popup21 textarea, 
.popup21 select {
border-width: 1px !important;
height: 40px;
font-size: 2em;
}
.popup21 .field-wrap.email-wrap .nf-field-element .play-icon {
border-width: 1px !important;
width: 40px;
height: 40px;
}
.popup21 {
padding: 0 15px;
overflow: hidden;
}
}
.popup21 input::placeholder { color: grey;
opacity: 1; }
.popup21 input:-ms-input-placeholder { color: grey;
}
.popup21 input::-ms-input-placeholder { color: grey;
}