Skip to content

Instantly share code, notes, and snippets.

@wpstudio
Last active December 10, 2021 13:56
Show Gist options
  • Save wpstudio/7d48236cbb9ebd8545a2ca8d71c82201 to your computer and use it in GitHub Desktop.
Save wpstudio/7d48236cbb9ebd8545a2ca8d71c82201 to your computer and use it in GitHub Desktop.
CSS for Gravity Forms Modal Webinar at WPStudio.com
/* Base Form Styles */
.wps-modal_wrapper,
.gform_confirmation_wrapper.wps-modal {
font-family: -apple-system, BlinkMacSystemFont, Hevetica Neue, Helvetica, Arial, sans-serif !important;
padding: 50px;
box-shadow: 30px 30px 80px 0 rgba(0, 0, 0, 0.05);
border-radius: 4px;
width: 100%;
position: fixed;
z-index: 999999;
transition: all 0.5s ease-in-out;
}
.wps-modal_wrapper #wps-button-close,
.gform_confirmation_wrapper.wps-modal #wps-button-close {
position: absolute;
right: 32px;
top: 32px;
width: 32px;
height: 32px;
transition: all 0.3s ease-in-out;
background: transparent;
border-radius: 100%;
outline: none;
border: none;
}
.wps-modal_wrapper #wps-button-close span,
.gform_confirmation_wrapper.wps-modal #wps-button-close span {
display: none;
}
.wps-modal_wrapper #wps-button-close:hover,
.gform_confirmation_wrapper.wps-modal #wps-button-close:hover {
cursor: pointer;
background: rgba(239, 239, 239, 0.2);
}
.wps-modal_wrapper #wps-button-close:before, .wps-modal_wrapper #wps-button-close:after,
.gform_confirmation_wrapper.wps-modal #wps-button-close:before,
.gform_confirmation_wrapper.wps-modal #wps-button-close:after {
position: absolute;
left: 15px;
content: ' ';
height: 15px;
width: 2px;
background-color: #838586;
top: 9px;
}
.wps-modal_wrapper #wps-button-close:before,
.gform_confirmation_wrapper.wps-modal #wps-button-close:before {
transform: rotate(45deg);
}
.wps-modal_wrapper #wps-button-close:after,
.gform_confirmation_wrapper.wps-modal #wps-button-close:after {
transform: rotate(-45deg);
}
.wps-modal_wrapper .hidden-field,
.gform_confirmation_wrapper.wps-modal .hidden-field {
display: none;
}
.wps-modal_wrapper .validation_error,
.gform_confirmation_wrapper.wps-modal .validation_error {
margin-bottom: 20px;
border: none;
padding: 0 !important;
border-radius: 5px;
color: red;
font-weight: 600;
text-align: left;
width: 80%;
margin-top: 20px;
display: block;
background: none;
}
.wps-modal_wrapper .gform_body h2.gsection_title,
.gform_confirmation_wrapper.wps-modal .gform_body h2.gsection_title {
font-family: -apple-system, BlinkMacSystemFont, Hevetica Neue, Helvetica, Arial, sans-serif !important;
padding: 0;
margin-top: 0;
font-size: 30px;
font-weight: 600;
}
.wps-modal_wrapper .gform_body .gsection_description,
.gform_confirmation_wrapper.wps-modal .gform_body .gsection_description {
font-family: -apple-system, BlinkMacSystemFont, Hevetica Neue, Helvetica, Arial, sans-serif !important;
font-weight: 500;
font-size: 15px;
line-height: 25px;
padding: 0;
margin: 10px 0;
}
.wps-modal_wrapper .gform_body .gform_fields input[type="text"],
.wps-modal_wrapper .gform_body .gform_fields input[type="email"],
.gform_confirmation_wrapper.wps-modal .gform_body .gform_fields input[type="text"],
.gform_confirmation_wrapper.wps-modal .gform_body .gform_fields input[type="email"] {
font-family: -apple-system, BlinkMacSystemFont, Hevetica Neue, Helvetica, Arial, sans-serif !important;
border-radius: 2px;
height: 50px;
line-height: 50px;
font-size: 22px;
padding-left: 15px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border: none;
}
.wps-modal_wrapper .gform_body .gform_fields input[type="checkbox"],
.gform_confirmation_wrapper.wps-modal .gform_body .gform_fields input[type="checkbox"] {
width: 30px;
height: 30px;
display: inline-block;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border-radius: 3px;
border: none;
}
.wps-modal_wrapper .gform_body .gform_fields input[type="checkbox"]:focus,
.gform_confirmation_wrapper.wps-modal .gform_body .gform_fields input[type="checkbox"]:focus {
outline: none;
}
.wps-modal_wrapper .gform_body .gfield_description.validation_message,
.gform_confirmation_wrapper.wps-modal .gform_body .gfield_description.validation_message {
display: block;
color: red;
font-weight: 600;
font-size: 12px;
margin-top: 5px;
}
.wps-modal_wrapper .gform_body .gfield_error input[type="text"],
.wps-modal_wrapper .gform_body .gfield_error input[type="email"],
.wps-modal_wrapper .gform_body .gfield_error input[type="checkbox"],
.gform_confirmation_wrapper.wps-modal .gform_body .gfield_error input[type="text"],
.gform_confirmation_wrapper.wps-modal .gform_body .gfield_error input[type="email"],
.gform_confirmation_wrapper.wps-modal .gform_body .gfield_error input[type="checkbox"] {
border-bottom: 2px solid red !important;
}
.wps-modal_wrapper .gform_body label.gfield_label,
.wps-modal_wrapper .gform_body label.gfield_consent_label,
.gform_confirmation_wrapper.wps-modal .gform_body label.gfield_label,
.gform_confirmation_wrapper.wps-modal .gform_body label.gfield_consent_label {
font-family: -apple-system, BlinkMacSystemFont, Hevetica Neue, Helvetica, Arial, sans-serif !important;
font-size: 12px;
font-weight: 700;
display: block;
}
.wps-modal_wrapper .gform_body .gfield_consent_label,
.gform_confirmation_wrapper.wps-modal .gform_body .gfield_consent_label {
margin-left: 10px;
}
.wps-modal_wrapper .gform_body .ginput_container_consent,
.gform_confirmation_wrapper.wps-modal .gform_body .ginput_container_consent {
width: 100%;
display: -ms-flexbox;
display: flex;
-ms-flex-direction: row;
flex-direction: row;
-ms-flex-align: center;
align-items: center;
-ms-flex-pack: start;
justify-content: flex-start;
}
.wps-modal_wrapper .gform_body li.gfield,
.gform_confirmation_wrapper.wps-modal .gform_body li.gfield {
margin-bottom: 10px !important;
}
.wps-modal_wrapper .gform_body label.no-label,
.gform_confirmation_wrapper.wps-modal .gform_body label.no-label {
display: none;
}
.wps-modal_wrapper .gform_footer,
.gform_confirmation_wrapper.wps-modal .gform_footer {
padding: 0px;
}
.wps-modal_wrapper .gform_footer input.gform_button,
.gform_confirmation_wrapper.wps-modal .gform_footer input.gform_button {
font-family: -apple-system, BlinkMacSystemFont, Hevetica Neue, Helvetica, Arial, sans-serif !important;
width: 100%;
border-radius: 3px;
height: 50px;
line-height: 50px;
transition: all 0.3s ease-in-out;
padding: unset;
}
.wps-modal_wrapper.gform_confirmation_wrapper,
.gform_confirmation_wrapper.wps-modal.gform_confirmation_wrapper {
background: white;
opacity: 1;
animation: fade-out-delay .5s forwards;
animation-delay: 4s;
bottom: 50px;
}
@keyframes fade-out-delay {
0% {
opacity: 1; }
100% {
opacity: 0; }
}
.wps-modal_wrapper.gform_confirmation_wrapper .gform_confirmation_message,
.gform_confirmation_wrapper.wps-modal.gform_confirmation_wrapper .gform_confirmation_message {
text-align: center;
font-family: -apple-system, BlinkMacSystemFont, Hevetica Neue, Helvetica, Arial, sans-serif !important;
font-weight: 500;
font-size: 15px;
line-height: 25px;
padding: 0;
}
.wps-modal_wrapper.gform_confirmation_wrapper .gform_confirmation_message h2,
.gform_confirmation_wrapper.wps-modal.gform_confirmation_wrapper .gform_confirmation_message h2 {
font-family: -apple-system, BlinkMacSystemFont, Hevetica Neue, Helvetica, Arial, sans-serif !important;
padding: 0;
margin: 0;
font-size: 40px;
font-weight: 600;
}
/******* LOCATION ********/
/* CENTERED */
.wps-modal-centered_wrapper,
.gform_confirmation_wrapper.wps-modal-centered {
max-width: 600px;
bottom: 45%;
left: 50%;
transform: translate(-50%, 50%);
opacity: 0;
}
.wps-modal-centered_wrapper.active,
.gform_confirmation_wrapper.wps-modal-centered.active {
opacity: 1;
bottom: 50%;
}
/* BOTTOM CENTERED */
.wps-modal-bottom-centered_wrapper,
.gform_confirmation_wrapper.wps-modal-bottom-centered {
max-width: 700px;
bottom: -50px;
left: 50%;
transform: translate(-50%, 0);
opacity: 0;
}
.wps-modal-bottom-centered_wrapper.active,
.gform_confirmation_wrapper.wps-modal-bottom-centered.active {
opacity: 1;
bottom: 50px;
}
/* BOTTOM LEFT */
.wps-modal-bottom-left_wrapper,
.gform_confirmation_wrapper.wps-modal-bottom-left {
max-width: 430px;
bottom: -50px;
left: 50px;
transform: translate(0, 0);
opacity: 0;
}
.wps-modal-bottom-left_wrapper.active,
.gform_confirmation_wrapper.wps-modal-bottom-left.active {
opacity: 1;
bottom: 50px;
}
.wps-modal-bottom-left_wrapper .gfield.gf_left_half,
.wps-modal-bottom-left_wrapper .gfield.gf_right_half,
.gform_confirmation_wrapper.wps-modal-bottom-left .gfield.gf_left_half,
.gform_confirmation_wrapper.wps-modal-bottom-left .gfield.gf_right_half {
width: 100%;
display: block;
padding: 0px;
}
/* BOTTOM RIGHT */
.wps-modal-bottom-right_wrapper,
.gform_confirmation_wrapper.wps-modal-bottom-right {
max-width: 430px;
bottom: -50px;
left: calc(100% - 50px);
transform: translate(-100%, 0);
opacity: 0;
}
.wps-modal-bottom-right_wrapper.active,
.gform_confirmation_wrapper.wps-modal-bottom-right.active {
opacity: 1;
bottom: 50px;
}
.wps-modal-bottom-right_wrapper .gfield.gf_left_half,
.wps-modal-bottom-right_wrapper .gfield.gf_right_half,
.gform_confirmation_wrapper.wps-modal-bottom-right .gfield.gf_left_half,
.gform_confirmation_wrapper.wps-modal-bottom-right .gfield.gf_right_half {
width: 100%;
display: block;
padding: 0px;
}
.wps-modal-bottom-right_wrapper .gfield.gf_left_half,
.wps-modal-bottom-right_wrapper .gfield.gf_right_half {
width: 100%;
display: block;
padding: 0px;
}
@media only screen and (max-width: 1024px){
.wps-modal-bottom-right_wrapper {
max-width: 100%;
bottom: -50px;
left: unset;
margin: 0 auto;
transform: unset;
}
}
/****** THEMES *******/
/* Theme: White */
.wps-modal-theme_white_wrapper,
.gform_confirmation_wrapper.wps-modal-theme_white {
background: #FFFFFF;
border: 1px solid #E3E8ED;
}
.wps-modal-theme_white_wrapper .gform_footer input.gform_button,
.gform_confirmation_wrapper.wps-modal-theme_white .gform_footer input.gform_button {
background: #0647ef;
color: white !important;
}
.wps-modal-theme_white_wrapper .gform_footer input.gform_button:hover, .wps-modal-theme_white_wrapper .gform_footer input.gform_button:active, .wps-modal-theme_white_wrapper .gform_footer input.gform_button:focus,
.gform_confirmation_wrapper.wps-modal-theme_white .gform_footer input.gform_button:hover,
.gform_confirmation_wrapper.wps-modal-theme_white .gform_footer input.gform_button:active,
.gform_confirmation_wrapper.wps-modal-theme_white .gform_footer input.gform_button:focus {
background: #03a9f4 !important;
}
.wps-modal-theme_white_wrapper a,
.gform_confirmation_wrapper.wps-modal-theme_white a {
color: #0647ef !important;
}
.wps-modal-theme_white_wrapper a:hover,
.gform_confirmation_wrapper.wps-modal-theme_white a:hover {
color: #03a9f4;
}
.wps-modal-theme_white_wrapper .gform_body h2.gsection_title,
.gform_confirmation_wrapper.wps-modal-theme_white .gform_body h2.gsection_title {
color: #393939;
}
.wps-modal-theme_white_wrapper .gform_body .gsection_description,
.gform_confirmation_wrapper.wps-modal-theme_white .gform_body .gsection_description {
color: #797979;
}
.wps-modal-theme_white_wrapper .gform_body .gform_fields input[type="text"],
.wps-modal-theme_white_wrapper .gform_body .gform_fields input[type="email"],
.wps-modal-theme_white_wrapper .gform_body .gform_fields input[type="checkbox"],
.gform_confirmation_wrapper.wps-modal-theme_white .gform_body .gform_fields input[type="text"],
.gform_confirmation_wrapper.wps-modal-theme_white .gform_body .gform_fields input[type="email"],
.gform_confirmation_wrapper.wps-modal-theme_white .gform_body .gform_fields input[type="checkbox"] {
background: #F8F8F8;
border: 1px solid #DFDFDF;
color: black;
}
.wps-modal-theme_white_wrapper .gform_body .gform_fields input[type="checkbox"]:checked,
.gform_confirmation_wrapper.wps-modal-theme_white .gform_body .gform_fields input[type="checkbox"]:checked {
background: #0647ef;
border: 1px solid #DFDFDF;
color: white;
}
.wps-modal-theme_white_wrapper .gform_body label.gfield_label,
.wps-modal-theme_white_wrapper .gform_body label.gfield_consent_label,
.gform_confirmation_wrapper.wps-modal-theme_white .gform_body label.gfield_label,
.gform_confirmation_wrapper.wps-modal-theme_white .gform_body label.gfield_consent_label {
color: #393939;
}
/* Theme: Red */
.wps-modal-theme_red_wrapper,
.gform_confirmation_wrapper.wps-modal-theme_red {
background: #ff5722;
border: 1px solid transparent;
}
.wps-modal-theme_red_wrapper .gform_footer input.gform_button,
.gform_confirmation_wrapper.wps-modal-theme_red .gform_footer input.gform_button {
background: #942400;
color: white !important;
}
.wps-modal-theme_red_wrapper .gform_footer input.gform_button:hover, .wps-modal-theme_red_wrapper .gform_footer input.gform_button:active, .wps-modal-theme_red_wrapper .gform_footer input.gform_button:focus,
.gform_confirmation_wrapper.wps-modal-theme_red .gform_footer input.gform_button:hover,
.gform_confirmation_wrapper.wps-modal-theme_red .gform_footer input.gform_button:active,
.gform_confirmation_wrapper.wps-modal-theme_red .gform_footer input.gform_button:focus {
background: #5d1500 !important;
}
.wps-modal-theme_red_wrapper #wps-button-close:before, .wps-modal-theme_red_wrapper #wps-button-close:after,
.gform_confirmation_wrapper.wps-modal-theme_red #wps-button-close:before,
.gform_confirmation_wrapper.wps-modal-theme_red #wps-button-close:after {
background-color: white;
}
.wps-modal-theme_red_wrapper a,
.gform_confirmation_wrapper.wps-modal-theme_red a {
color: #942400 !important;
}
.wps-modal-theme_red_wrapper a:hover,
.gform_confirmation_wrapper.wps-modal-theme_red a:hover {
color: #5d1500;
}
.wps-modal-theme_red_wrapper .gform_body h2.gsection_title,
.gform_confirmation_wrapper.wps-modal-theme_red .gform_body h2.gsection_title {
color: white;
}
.wps-modal-theme_red_wrapper .gform_body .gsection_description,
.gform_confirmation_wrapper.wps-modal-theme_red .gform_body .gsection_description {
color: white;
}
.wps-modal-theme_red_wrapper .gform_body .gform_fields input[type="text"],
.wps-modal-theme_red_wrapper .gform_body .gform_fields input[type="email"],
.wps-modal-theme_red_wrapper .gform_body .gform_fields input[type="checkbox"],
.gform_confirmation_wrapper.wps-modal-theme_red .gform_body .gform_fields input[type="text"],
.gform_confirmation_wrapper.wps-modal-theme_red .gform_body .gform_fields input[type="email"],
.gform_confirmation_wrapper.wps-modal-theme_red .gform_body .gform_fields input[type="checkbox"] {
background: white;
border: 1px solid transparent;
color: black;
}
.wps-modal-theme_red_wrapper .gform_body .gform_fields input[type="checkbox"]:checked,
.gform_confirmation_wrapper.wps-modal-theme_red .gform_body .gform_fields input[type="checkbox"]:checked {
background: #942400;
border: 1px solid transparent;
color: white;
}
.wps-modal-theme_red_wrapper .gform_body label.gfield_label,
.wps-modal-theme_red_wrapper .gform_body label.gfield_consent_label,
.gform_confirmation_wrapper.wps-modal-theme_red .gform_body label.gfield_label,
.gform_confirmation_wrapper.wps-modal-theme_red .gform_body label.gfield_consent_label {
color: white;
}
/* Theme: Green */
.wps-modal-theme_green_wrapper,
.gform_confirmation_wrapper.wps-modal-theme_green {
background: #2a9e8f;
border: 1px solid transparent;
}
.wps-modal-theme_green_wrapper .gform_footer input.gform_button,
.gform_confirmation_wrapper.wps-modal-theme_green .gform_footer input.gform_button {
background: #0deec8;
color: white !important;
}
.wps-modal-theme_green_wrapper .gform_footer input.gform_button:hover, .wps-modal-theme_green_wrapper .gform_footer input.gform_button:active, .wps-modal-theme_green_wrapper .gform_footer input.gform_button:focus,
.gform_confirmation_wrapper.wps-modal-theme_green .gform_footer input.gform_button:hover,
.gform_confirmation_wrapper.wps-modal-theme_green .gform_footer input.gform_button:active,
.gform_confirmation_wrapper.wps-modal-theme_green .gform_footer input.gform_button:focus {
background: #014c45 !important;
}
.wps-modal-theme_green_wrapper #wps-button-close:before, .wps-modal-theme_green_wrapper #wps-button-close:after,
.gform_confirmation_wrapper.wps-modal-theme_green #wps-button-close:before,
.gform_confirmation_wrapper.wps-modal-theme_green #wps-button-close:after {
background-color: white;
}
.wps-modal-theme_green_wrapper a,
.gform_confirmation_wrapper.wps-modal-theme_green a {
color: #0deec8 !important;
}
.wps-modal-theme_green_wrapper a:hover,
.gform_confirmation_wrapper.wps-modal-theme_green a:hover {
color: #014c45;
}
.wps-modal-theme_green_wrapper .gform_body h2.gsection_title,
.gform_confirmation_wrapper.wps-modal-theme_green .gform_body h2.gsection_title {
color: white;
}
.wps-modal-theme_green_wrapper .gform_body .gsection_description,
.gform_confirmation_wrapper.wps-modal-theme_green .gform_body .gsection_description {
color: white;
}
.wps-modal-theme_green_wrapper .gform_body .gform_fields input[type="text"],
.wps-modal-theme_green_wrapper .gform_body .gform_fields input[type="email"],
.wps-modal-theme_green_wrapper .gform_body .gform_fields input[type="checkbox"],
.gform_confirmation_wrapper.wps-modal-theme_green .gform_body .gform_fields input[type="text"],
.gform_confirmation_wrapper.wps-modal-theme_green .gform_body .gform_fields input[type="email"],
.gform_confirmation_wrapper.wps-modal-theme_green .gform_body .gform_fields input[type="checkbox"] {
background: white;
border: 1px solid transparent;
color: black;
}
.wps-modal-theme_green_wrapper .gform_body .gform_fields input[type="checkbox"]:checked,
.gform_confirmation_wrapper.wps-modal-theme_green .gform_body .gform_fields input[type="checkbox"]:checked {
background: #0deec8;
border: 1px solid transparent;
color: white;
}
.wps-modal-theme_green_wrapper .gform_body label.gfield_label,
.wps-modal-theme_green_wrapper .gform_body label.gfield_consent_label,
.gform_confirmation_wrapper.wps-modal-theme_green .gform_body label.gfield_label,
.gform_confirmation_wrapper.wps-modal-theme_green .gform_body label.gfield_consent_label {
color: white;
}
/* Theme: Orange */
.wps-modal-theme_orange_wrapper,
.gform_confirmation_wrapper.wps-modal-theme_orange {
background: #fca311;
border: 1px solid transparent;
}
.wps-modal-theme_orange_wrapper .gform_footer input.gform_button,
.gform_confirmation_wrapper.wps-modal-theme_orange .gform_footer input.gform_button {
background: #c37a02;
color: white !important;
}
.wps-modal-theme_orange_wrapper .gform_footer input.gform_button:hover, .wps-modal-theme_orange_wrapper .gform_footer input.gform_button:active, .wps-modal-theme_orange_wrapper .gform_footer input.gform_button:focus,
.gform_confirmation_wrapper.wps-modal-theme_orange .gform_footer input.gform_button:hover,
.gform_confirmation_wrapper.wps-modal-theme_orange .gform_footer input.gform_button:active,
.gform_confirmation_wrapper.wps-modal-theme_orange .gform_footer input.gform_button:focus {
background: #8f5800 !important;
}
.wps-modal-theme_orange_wrapper #wps-button-close:before, .wps-modal-theme_orange_wrapper #wps-button-close:after,
.gform_confirmation_wrapper.wps-modal-theme_orange #wps-button-close:before,
.gform_confirmation_wrapper.wps-modal-theme_orange #wps-button-close:after {
background-color: white;
}
.wps-modal-theme_orange_wrapper a,
.gform_confirmation_wrapper.wps-modal-theme_orange a {
color: #c37a02 !important;
}
.wps-modal-theme_orange_wrapper a:hover,
.gform_confirmation_wrapper.wps-modal-theme_orange a:hover {
color: #8f5800;
}
.wps-modal-theme_orange_wrapper .gform_body h2.gsection_title,
.gform_confirmation_wrapper.wps-modal-theme_orange .gform_body h2.gsection_title {
color: white;
}
.wps-modal-theme_orange_wrapper .gform_body .gsection_description,
.gform_confirmation_wrapper.wps-modal-theme_orange .gform_body .gsection_description {
color: white;
}
.wps-modal-theme_orange_wrapper .gform_body .gform_fields input[type="text"],
.wps-modal-theme_orange_wrapper .gform_body .gform_fields input[type="email"],
.wps-modal-theme_orange_wrapper .gform_body .gform_fields input[type="checkbox"],
.gform_confirmation_wrapper.wps-modal-theme_orange .gform_body .gform_fields input[type="text"],
.gform_confirmation_wrapper.wps-modal-theme_orange .gform_body .gform_fields input[type="email"],
.gform_confirmation_wrapper.wps-modal-theme_orange .gform_body .gform_fields input[type="checkbox"] {
background: white;
border: 1px solid transparent;
color: black;
}
.wps-modal-theme_orange_wrapper .gform_body .gform_fields input[type="checkbox"]:checked,
.gform_confirmation_wrapper.wps-modal-theme_orange .gform_body .gform_fields input[type="checkbox"]:checked {
background: #c37a02;
border: 1px solid transparent;
color: white;
}
.wps-modal-theme_orange_wrapper .gform_body label.gfield_label,
.wps-modal-theme_orange_wrapper .gform_body label.gfield_consent_label,
.gform_confirmation_wrapper.wps-modal-theme_orange .gform_body label.gfield_label,
.gform_confirmation_wrapper.wps-modal-theme_orange .gform_body label.gfield_consent_label {
color: white;
}
/* Theme: Purple */
.wps-modal-theme_purple_wrapper,
.gform_confirmation_wrapper.wps-modal-theme_purple {
background: #49429d;
border: 1px solid transparent;
}
.wps-modal-theme_purple_wrapper .gform_footer input.gform_button,
.gform_confirmation_wrapper.wps-modal-theme_purple .gform_footer input.gform_button {
background: #9088fc;
color: white !important;
}
.wps-modal-theme_purple_wrapper .gform_footer input.gform_button:hover, .wps-modal-theme_purple_wrapper .gform_footer input.gform_button:active, .wps-modal-theme_purple_wrapper .gform_footer input.gform_button:focus,
.gform_confirmation_wrapper.wps-modal-theme_purple .gform_footer input.gform_button:hover,
.gform_confirmation_wrapper.wps-modal-theme_purple .gform_footer input.gform_button:active,
.gform_confirmation_wrapper.wps-modal-theme_purple .gform_footer input.gform_button:focus {
background: #2c2673 !important;
}
.wps-modal-theme_purple_wrapper #wps-button-close:before, .wps-modal-theme_purple_wrapper #wps-button-close:after,
.gform_confirmation_wrapper.wps-modal-theme_purple #wps-button-close:before,
.gform_confirmation_wrapper.wps-modal-theme_purple #wps-button-close:after {
background-color: white;
}
.wps-modal-theme_purple_wrapper a,
.gform_confirmation_wrapper.wps-modal-theme_purple a {
color: #9088fc !important;
}
.wps-modal-theme_purple_wrapper a:hover,
.gform_confirmation_wrapper.wps-modal-theme_purple a:hover {
color: #2c2673;
}
.wps-modal-theme_purple_wrapper .gform_body h2.gsection_title,
.gform_confirmation_wrapper.wps-modal-theme_purple .gform_body h2.gsection_title {
color: white;
}
.wps-modal-theme_purple_wrapper .gform_body .gsection_description,
.gform_confirmation_wrapper.wps-modal-theme_purple .gform_body .gsection_description {
color: white;
}
.wps-modal-theme_purple_wrapper .gform_body .gform_fields input[type="text"],
.wps-modal-theme_purple_wrapper .gform_body .gform_fields input[type="email"],
.wps-modal-theme_purple_wrapper .gform_body .gform_fields input[type="checkbox"],
.gform_confirmation_wrapper.wps-modal-theme_purple .gform_body .gform_fields input[type="text"],
.gform_confirmation_wrapper.wps-modal-theme_purple .gform_body .gform_fields input[type="email"],
.gform_confirmation_wrapper.wps-modal-theme_purple .gform_body .gform_fields input[type="checkbox"] {
background: white;
border: 1px solid transparent;
color: black;
}
.wps-modal-theme_purple_wrapper .gform_body .gform_fields input[type="checkbox"]:checked,
.gform_confirmation_wrapper.wps-modal-theme_purple .gform_body .gform_fields input[type="checkbox"]:checked {
background: #9088fc;
border: 1px solid transparent;
color: white;
}
.wps-modal-theme_purple_wrapper .gform_body label.gfield_label,
.wps-modal-theme_purple_wrapper .gform_body label.gfield_consent_label,
.gform_confirmation_wrapper.wps-modal-theme_purple .gform_body label.gfield_label,
.gform_confirmation_wrapper.wps-modal-theme_purple .gform_body label.gfield_consent_label {
color: white;
}
/* Theme: Navy */
.wps-modal-theme_navy_wrapper,
.gform_confirmation_wrapper.wps-modal-theme_navy {
background: #03045e;
border: 1px solid transparent;
}
.wps-modal-theme_navy_wrapper .gform_footer input.gform_button,
.gform_confirmation_wrapper.wps-modal-theme_navy .gform_footer input.gform_button {
background: #A8DADC;
color: white !important;
}
.wps-modal-theme_navy_wrapper .gform_footer input.gform_button:hover, .wps-modal-theme_navy_wrapper .gform_footer input.gform_button:active, .wps-modal-theme_navy_wrapper .gform_footer input.gform_button:focus,
.gform_confirmation_wrapper.wps-modal-theme_navy .gform_footer input.gform_button:hover,
.gform_confirmation_wrapper.wps-modal-theme_navy .gform_footer input.gform_button:active,
.gform_confirmation_wrapper.wps-modal-theme_navy .gform_footer input.gform_button:focus {
background: #41cfd2 !important;
}
.wps-modal-theme_navy_wrapper #wps-button-close:before, .wps-modal-theme_navy_wrapper #wps-button-close:after,
.gform_confirmation_wrapper.wps-modal-theme_navy #wps-button-close:before,
.gform_confirmation_wrapper.wps-modal-theme_navy #wps-button-close:after {
background-color: white;
}
.wps-modal-theme_navy_wrapper a,
.gform_confirmation_wrapper.wps-modal-theme_navy a {
color: #A8DADC !important;
}
.wps-modal-theme_navy_wrapper a:hover,
.gform_confirmation_wrapper.wps-modal-theme_navy a:hover {
color: #41cfd2;
}
.wps-modal-theme_navy_wrapper .gform_body h2.gsection_title,
.gform_confirmation_wrapper.wps-modal-theme_navy .gform_body h2.gsection_title {
color: white;
}
.wps-modal-theme_navy_wrapper .gform_body .gsection_description,
.gform_confirmation_wrapper.wps-modal-theme_navy .gform_body .gsection_description {
color: white;
}
.wps-modal-theme_navy_wrapper .gform_body .gform_fields input[type="text"],
.wps-modal-theme_navy_wrapper .gform_body .gform_fields input[type="email"],
.wps-modal-theme_navy_wrapper .gform_body .gform_fields input[type="checkbox"],
.gform_confirmation_wrapper.wps-modal-theme_navy .gform_body .gform_fields input[type="text"],
.gform_confirmation_wrapper.wps-modal-theme_navy .gform_body .gform_fields input[type="email"],
.gform_confirmation_wrapper.wps-modal-theme_navy .gform_body .gform_fields input[type="checkbox"] {
background: white;
border: 1px solid transparent;
color: black;
}
.wps-modal-theme_navy_wrapper .gform_body .gform_fields input[type="checkbox"]:checked,
.gform_confirmation_wrapper.wps-modal-theme_navy .gform_body .gform_fields input[type="checkbox"]:checked {
background: #A8DADC;
border: 1px solid transparent;
color: white;
}
.wps-modal-theme_navy_wrapper .gform_body label.gfield_label,
.wps-modal-theme_navy_wrapper .gform_body label.gfield_consent_label,
.gform_confirmation_wrapper.wps-modal-theme_navy .gform_body label.gfield_label,
.gform_confirmation_wrapper.wps-modal-theme_navy .gform_body label.gfield_consent_label {
color: white;
}
/* Theme: Black */
.wps-modal-theme_black_wrapper,
.gform_confirmation_wrapper.wps-modal-theme_black {
background: black;
}
.wps-modal-theme_black_wrapper .gform_footer input.gform_button,
.gform_confirmation_wrapper.wps-modal-theme_black .gform_footer input.gform_button {
background: #0647ef;
color: white !important;
}
.wps-modal-theme_black_wrapper .gform_footer input.gform_button:hover, .wps-modal-theme_black_wrapper .gform_footer input.gform_button:active, .wps-modal-theme_black_wrapper .gform_footer input.gform_button:focus,
.gform_confirmation_wrapper.wps-modal-theme_black .gform_footer input.gform_button:hover,
.gform_confirmation_wrapper.wps-modal-theme_black .gform_footer input.gform_button:active,
.gform_confirmation_wrapper.wps-modal-theme_black .gform_footer input.gform_button:focus {
background: #272729 !important;
}
.wps-modal-theme_black_wrapper #wps-button-close:before, .wps-modal-theme_black_wrapper #wps-button-close:after,
.gform_confirmation_wrapper.wps-modal-theme_black #wps-button-close:before,
.gform_confirmation_wrapper.wps-modal-theme_black #wps-button-close:after {
background-color: white;
}
.wps-modal-theme_black_wrapper a,
.gform_confirmation_wrapper.wps-modal-theme_black a {
color: #0647ef !important;
}
.wps-modal-theme_black_wrapper a:hover,
.gform_confirmation_wrapper.wps-modal-theme_black a:hover {
color: #272729;
}
.wps-modal-theme_black_wrapper .gform_body h2.gsection_title,
.gform_confirmation_wrapper.wps-modal-theme_black .gform_body h2.gsection_title {
color: white;
}
.wps-modal-theme_black_wrapper .gform_body .gsection_description,
.gform_confirmation_wrapper.wps-modal-theme_black .gform_body .gsection_description {
color: #e0e0e0;
}
.wps-modal-theme_black_wrapper .gform_body .gform_fields input[type="text"],
.wps-modal-theme_black_wrapper .gform_body .gform_fields input[type="email"],
.wps-modal-theme_black_wrapper .gform_body .gform_fields input[type="checkbox"],
.gform_confirmation_wrapper.wps-modal-theme_black .gform_body .gform_fields input[type="text"],
.gform_confirmation_wrapper.wps-modal-theme_black .gform_body .gform_fields input[type="email"],
.gform_confirmation_wrapper.wps-modal-theme_black .gform_body .gform_fields input[type="checkbox"] {
background: white;
color: black;
}
.wps-modal-theme_black_wrapper .gform_body .gform_fields input[type="checkbox"]:checked,
.gform_confirmation_wrapper.wps-modal-theme_black .gform_body .gform_fields input[type="checkbox"]:checked {
background: #0647ef;
color: white;
}
.wps-modal-theme_black_wrapper .gform_body label.gfield_label,
.wps-modal-theme_black_wrapper .gform_body label.gfield_consent_label,
.gform_confirmation_wrapper.wps-modal-theme_black .gform_body label.gfield_label,
.gform_confirmation_wrapper.wps-modal-theme_black .gform_body label.gfield_consent_label {
color: white;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment