.coupon-app{
display:flex;
flex-wrap:wrap;
gap:30px;
font-family:Arial;
}

.coupon-form{
max-width:300px;
display:flex;
flex-direction:column;
gap:10px;
}

.coupon-form input,
.coupon-form textarea{
padding:8px;
font-size:14px;
}

.coupon-form button{
padding:10px;
cursor:pointer;
font-size:15px;
}

#coupon{
width:520px;
min-height:260px;
padding:25px;
background:white;
border:5px dashed #333;
position:relative;
text-align:center;
word-wrap:break-word;
}

#coupon:before,
#coupon:after{
content:"";
position:absolute;
left:-12px;
width:24px;
height:24px;
background:#fff;
border-radius:50%;
}

#coupon:before{
top:40px;
}

#coupon:after{
bottom:40px;
}

#logoPreview{
max-width:120px;
margin-bottom:10px;
}

#business{
font-size:30px;
font-weight:bold;
}

#offer{
font-size:24px;
margin-top:10px;
}

#terms{
font-size:14px;
margin-top:10px;
}

#expiration{
margin-top:12px;
font-weight:bold;
}

@media(max-width:800px){

.coupon-app{
flex-direction:column;
}

#coupon{
width:100%;
}

}