#scheduleDemo {margin: 0; padding: 100px 0; background: #f2f2f2;}
#scheduleDemo canvas {height: 100%;}
#scheduleDemo h5 {margin: 0 auto; padding: 0; font-size: 52px; line-height: 64px; font-weight: 800; text-align: center; color: #393939;}
#scheduleDemo h5 span {text-transform: uppercase; background: linear-gradient(90deg, blue, purple, rgb(9, 118, 118)); background-size: 300% 300%; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: gradientText 5s ease infinite; font-weight: 900;}
#scheduleDemo p {margin: 0 auto; padding: 30px 0 0 0; font-weight: 500; font-size: 24px; line-height: 33px; text-align: center; color: #494949;}
#scheduleDemo .scheduleDemoFormWrapper {margin: 0; padding: 60px 0 0 0;}
#scheduleDemo .scheduleDemoFormWrapper input[type="text"], 
#scheduleDemo .scheduleDemoFormWrapper select, 
#scheduleDemo .scheduleDemoFormWrapper textarea {padding: 10px 20px; background: #fff; box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.25); border-radius: 4px; border: none; width: 100%; margin: 0 0 24px 0; color: #494949;}
#scheduleDemo .scheduleDemoFormWrapper input[type="text"]:focus, 
#scheduleDemo .scheduleDemoFormWrapper select, 
#scheduleDemo .scheduleDemoFormWrapper textarea:focus {outline: none;}
#scheduleDemo .scheduleDemoFormWrapper textarea {resize: none; height: 120px;}
#scheduleDemo .scheduleDemoFormWrapper input[type="submit"] {padding: 15px 40px; background: #2D13B8; border-radius: 4px; font-weight: 600; font-size: 18px; line-height: 25px; color: #fff; border: none; margin: 0 auto; display: flex;}
#scheduleDemo .scheduleDemoFormWrapper input[type="text"]::-webkit-input-placeholder, #scheduleDemo .scheduleDemoFormWrapper select::-webkit-input-placeholder, #scheduleDemo .scheduleDemoFormWrapper textarea::-webkit-input-placeholder {color: #494949;}
#scheduleDemo .scheduleDemoFormWrapper input[type="text"]::-moz-placeholder, #scheduleDemo .scheduleDemoFormWrapper select::-moz-placeholder, #scheduleDemo .scheduleDemoFormWrapper textarea::-moz-placeholder {color: #494949;}
#scheduleDemo .scheduleDemoFormWrapper input[type="text"]:-ms-input-placeholder, #scheduleDemo .scheduleDemoFormWrapper select:-ms-input-placeholder, :-ms-input-placeholder {color: #494949;}
#scheduleDemo .scheduleDemoFormWrapper input[type="text"]:-moz-placeholder, #scheduleDemo .scheduleDemoFormWrapper select:-moz-placeholder, #scheduleDemo .scheduleDemoFormWrapper textarea:-moz-placeholder {color: #494949;}
#scheduleDemo canvas {opacity: 0.5;}
.elementWrapper {position: relative;}
.elementWrapper p.requiredText {display: none; margin: 0 !important; font-size: 10px !important; text-align: left !important; position: absolute; bottom: 8px; line-height: 10px !important; width: 100%; padding: 0 6px !important; border-radius: 3px; color: #a3111c !important;}

@keyframes gradientText {
    0% {background-position: 0% 50%;}
    50% {background-position: 100% 50%;}
    100% {background-position: 0% 50%;}
}

/**** media queries ****/
@media only screen and (min-width: 0px) and (max-width: 767px) {
    #scheduleDemo {padding: 60px 0;}
    #scheduleDemo h5 {font-size: 32px; line-height: 42px;}
    #scheduleDemo p {font-size: 18px; line-height: 28px;}
    #scheduleDemo .scheduleDemoFormWrapper {padding: 30px 0 0 0;}
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    #scheduleDemo {padding: 80px 0;}
    #scheduleDemo h5 {font-size: 34px; line-height: 44px;}
    #scheduleDemo p {padding: 20px 0 0 0; font-size: 20px; line-height: 30px;}
}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    #scheduleDemo h5 {font-size: 40px; line-height: 60px;}
    #scheduleDemo p {padding: 20px 0 0 0; font-size: 20px; line-height: 30px;}
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
    #scheduleDemo {padding: 60px 0;}
    #scheduleDemo h5 {font-size: 32px; line-height: 42px;}
    #scheduleDemo p {font-size: 16px; padding: 10px 0 0 0;}
    #scheduleDemo .scheduleDemoFormWrapper {padding: 40px 0 0 0;}
    #scheduleDemo .scheduleDemoFormWrapper input[type="text"], #scheduleDemo .scheduleDemoFormWrapper select, #scheduleDemo .scheduleDemoFormWrapper textarea {font-size: 13px;}
    #scheduleDemo .scheduleDemoFormWrapper input[type="submit"] {padding: 11px 40px; font-size: 14px; line-height: 18px;}
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
    #scheduleDemo h5 {font-size: 34px; line-height: 44px;}
    #scheduleDemo p {font-size: 21px; line-height: 30px;}
    #scheduleDemo .scheduleDemoFormWrapper input[type="text"], #scheduleDemo .scheduleDemoFormWrapper select, #scheduleDemo .scheduleDemoFormWrapper textarea {font-size: 15px;}
    #scheduleDemo .scheduleDemoFormWrapper input[type="submit"] {font-size: 16px; line-height: 20px;}
}