/* CSS styles for feedback.php */
.feedback-form-container{background-color:#f1f4f7}
.feedback-form-container .heading{color:#0064b4;font-family:Roboto,sans-serif;font-size:30px;font-weight:400;padding:20px 0 10px 0}
.feedback-form-container .feedback-form-div{width:950px;padding:0 0 0 80px}
.feedback-form-container .fm-width{width:412px}
.feedback-form-container .form-control,.feedback-form-container select{display:block;width:100%;height:31px;padding:6px 12px;border:1px solid #6c757d;border-radius:0;background-color:transparent!important;text-transform:capitalize;color:#000;font-size:12px;font-weight:600;margin-bottom:10px}
.feedback-form-container select{color:#6d6c6c!important}
.feedback-form-container .form-control::-webkit-input-placeholder{color:#000}
.feedback-form-container .form-control::-moz-placeholder{color:#000}
.feedback-form-container .form-control:-ms-input-placeholder{color:#000}
.feedback-form-container .form-control::placeholder{color:#000}
.feedback-form-container #email::-webkit-input-placeholder{text-transform:capitalize}
.feedback-form-container #email{text-transform:lowercase}
.feedback-form-container .form-control:focus{color:#6c757d;background-color:#fff;border-color:#86b7fe;outline:0;box-shadow:unset}
.grid-container{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #6c757d;padding:6px 12px}
.grid-container .checkbox-input{position:absolute;opacity:0;width:1px;height:1px;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap}
.grid-container .checkbox-label{display:flex;width:14px;height:14px;border:1px solid #6c757d;border-radius:0;box-shadow:inset 0 1px 3px rgba(0,0,0,.1);cursor:pointer;position:relative;text-align:center;line-height:normal;font-size:20px;color:#000}
.grid-container .product-label{font-size:13px;cursor:pointer;text-transform:uppercase;margin-left:10px;color:#000}
.checkbox-input:focus+.checkbox-label,.checkbox-input:focus-visible+.checkbox-label{outline:3px solid #000;outline-offset:2px}
.grid-container .checkbox-input:checked+.checkbox-label::before{content:'✔';position:absolute;top:-10px;left:-1px;width:100%;height:100%;transition:all .2s;color:#000}
.grid-container .flex{display:flex;align-items:center;margin:0;height:33px}
.grid-container .star-rating{display:none;margin-left:10%;}
.grid-container .star-rating button{padding:0;border:0}
.grid-container .star{font-size:18px;cursor:pointer;color:#000;background-color: transparent;}
.grid-container .highlighted{color:#8a6500;background:0 0;text-shadow:0 0 1px #000}
.textarea-container textarea{width:70ch;height:100px;resize:vertical;border:1px solid#6c757d}
.textarea-container .experience-div{max-height:0;opacity:0;visibility:hidden;transition:max-height .4s ease,opacity .3s ease,visibility .3s ease}
.textarea-container .experience-div.visible{max-height:500px;opacity:1;visibility:visible}
.sub-heading{font-size:16px;color:#000;padding:10px 0;font-weight:700;font-family:Roboto,sans-serif;width:fit-content}
.yes-no-div{display:flex;align-items:center}
.yes-no-div .checkbox-input{position:absolute;opacity:0;width:1px;height:1px;margin:-1px;padding:0;border:0;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap}
.yes-no-div .checkbox-label{display:flex;width:14px;height:14px;border:1px solid #6c757d;border-radius:0;box-shadow:inset 0 1px 3px rgba(0,0,0,.1);cursor:pointer;position:relative;line-height:normal;font-size:20px;color:#000}
.yes-no-div .product-label{font-size:13px;text-transform:uppercase;padding:0 0 0 18px}
.yes-no-div .checkbox-input:checked+.checkbox-label::before{content:'✔';position:absolute;top:-10px;left:-1px;width:100%;height:100%;transition:all .2s;color:#000}
.yes-no-div .inline-chkbx{display:flex;align-items:center;margin-left:10px;gap:40px}
.yes-no-div .flex{display:flex;align-items:center}
.communication-div{max-height:0;opacity:0;visibility:hidden;transition:max-height .4s ease,opacity .3s ease,visibility .3s ease}
.communication-div.visible{max-height:500px;opacity:1;visibility:visible}
.communication-div .checkbox-input{position:absolute;opacity:0;width:1px;height:1px;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap}
.communication-div .flex{display:flex;justify-content:center;align-items:center}
.communication-div .checkbox-label{display:block;width:14px;height:14px;border:1px solid #6c757d;border-radius:0;box-shadow:inset 0 1px 3px rgba(0,0,0,.1);cursor:pointer;position:relative;line-height:normal;font-size:20px;color:#000}
.communication-div .product-label{font-size:16px;color:#000;padding:0 0 0 5px;display:block;width:150px;margin-top:3px}
.communication-div .checkbox-input:checked+.checkbox-label::before{content:'✔';position:absolute;top:-10px;left:-1px;width:100%;height:100%;transition:all .2s;color:#000}
.communication-div .updiv{display:flex;justify-content:space-between;margin-bottom:5px}
.mybtn{background-color:#2f5e1e;color:#fff;border-radius:25px;padding:5px 22px;margin:40px 0}
.mybtn:hover{background-color:#2f5e1e;color:#fff}
.feedback-form-container input::placeholder{color:#6d6c6c!important}
.feedback-form-container select::placeholder{color:#6d6c6c!important}
.visually-hidden-label{font-size:14px;color:#000;font-weight:700}
.textarea-container .visually-hidden-label{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}
.error-message{display:none;color:#D00000;font-size:14px;}
.blank{border:2px solid #D00000 !important}
@media (max-width:1366px){
.feedback-form-container .heading{font-size:28px}
}
@media (max-width:1024px){
.feedback-form-container .heading{font-size:26px}
.feedback-form-container .feedback-form-div{width:90%;padding:0 30px}
}
@media (max-width:850px){
.feedback-form-container .feedback-form-div{width:100%}
.feedback-form-container .heading{font-size:24px}
}
@media (max-width:768px){
.feedback-form-container .fm-width{width:100%}
#feedback,.textarea-container textarea{width:100%}
.textarea-container{max-width:100%}
}
@media (max-width:580px){
.grid-container{grid-template-columns:repeat(1,1fr)}
.yes-no-div .inline-chkbx{margin:0}
.yes-no-div{display:block}
.communication-div .flex{justify-content:flex-start}
.communication-div .updiv{display:block}
.mybtn{margin:20px 0}
}
@media (max-width:424px){
.feedback-form-container .heading{font-size:19px}
.feedback-form-container .feedback-form-div{padding:0 15px}
}