@import url('https://fonts.googleapis.com/css2?family=Readex+Pro:wght@400;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;600;700&display=swap');

.webinar-hero {
	 padding: 16px;
	 border-radius: 20px;
	 background: #5087f1 center center no-repeat;
	 overflow: hidden;
	 box-sizing: border-box;
}
 @media (min-width: 1024px) {
	 .webinar-hero {
		 padding: 30px;
		 background: #5087f1 center center / cover no-repeat;
     min-height: 600px;
    
	}
}
 @media (min-width: 1280px) {
	 .webinar-hero {
		 padding: 88px 56px;
     min-height: 720px;
	}
}
 .webinar-hero * {
	 box-sizing: border-box;
}
 .webinar-hero__panel {
	 display: flex;
	 flex-direction: column;
	 row-gap: 16px;
	 align-items: flex-start;
}
 @media (min-width: 1024px) {
	 .webinar-hero__panel {
		 flex-direction: row;
		 justify-content: space-between;
		 row-gap: 0;
	}
}
 .webinar-hero__date {
	 flex: 0 0 auto;
	 padding: 12px 0;
	 display: flex;
	 align-items: center;
	 font-family: 'Readex Pro', sans-serif;
	 font-weight: 500;
	 font-size: 16px;
	 line-height: 32px;
	 color: #ffffff;
}
 .webinar-hero__date img {
	 width: 24px;
	 height: 24px;
	 flex: 0 0 24px;
	 display: block;
	 margin-right: 8px;
}
 @media (min-width: 1024px) {
	 .webinar-hero__date {
		 font-size: 18px;
		 line-height: 24px;
	}
	 .webinar-hero__date img {
		 width: 24px;
		 height: 24px;
		 flex: 0 0 24px;
	}
}
 @media (min-width: 1280px) {
	 .webinar-hero__date {
		 font-size: 26px;
		 line-height: 32px;
	}
	 .webinar-hero__date img {
		 width: 40px;
		 height: 40px;
		 flex: 0 0 40px;
	}
}
@media (min-width: 1600px) {
	 .webinar-hero__date {
		 font-size: 32px;
		 line-height: 40px;
	}
}
 .webinar-hero__type {
   border: 2px solid #ffffff;
	 border-radius: 50px;
	 padding: 4px 8px;
	 display: flex;
	 align-items: center;
	 justify-content: center;
	 font-family: 'Readex Pro', sans-serif;
	 font-weight: 700;
	 font-size: 11px;
	 line-height: 14px;
	 color: #ffffff;
}
 @media (min-width: 1024px) {
	 .webinar-hero__type {
		 padding: 11px 18px;
		 font-size: 18px;
		 line-height: 24px;
	}
}
 @media (min-width: 1280px) {
	 .webinar-hero__type {
		 padding: 12px 24px;
		 font-size: 24px;
		 line-height: 32px;
	}
}
 .webinar-hero__type--live {
	 display: block;
	 width: 10px;
	 flex: 0 0 10px;
	 height: 10px;
	 border-radius: 50%;
	 background: #fff;
	 position: relative;
	 margin-right: 8px;
}
 @media (min-width: 1024px) {
	 .webinar-hero__type--live {
		 width: 22px;
		 flex: 0 0 22px;
		 height: 22px;
	}
}
 .webinar-hero__type--live::after {
	 content: '';
	 background: #18DD4F;
	 width: 5px;
	 height: 5px;
   border-radius: 50%;
	 position: absolute;
	 top: 50%;
	 left: 50%;
	 transform: translate(-50%, -50%);
}
 @media (min-width: 1024px) {
	 .webinar-hero__type--live::after {
		 width: 12px;
		 height: 12px;
	}
}
 .webinar-hero__inner {
	 margin-top: 16px;
	 display: flex;
	 flex-direction: column;
	 row-gap: 16px;
}
 @media (min-width: 1024px) {
	 .webinar-hero__inner {
		 margin-top: 30px;
		 flex-direction: row;
		 justify-content: space-between;
		 align-items: flex-start;
	}
}
 @media (min-width: 1280px) {
	 .webinar-hero__inner {
		 margin-top: 37px;
	}
}
 .webinar-hero__content {
	 width: 100%;
	 display: flex;
	 flex-direction: column;
	 row-gap: 16px;
}
 @media (min-width: 1024px) {
	 .webinar-hero__content {
		 row-gap: 32px;
	}
}
 .webinar-hero__title {
	 font-family: 'Readex Pro', sans-serif;
	 font-weight: 800;
	 font-size: 24px;
	 color: #fff;
	 margin: 0;
}

.webinar-hero__title > * {
  line-height: 1.12;
}

 @media (min-width: 1024px) {
	 .webinar-hero__title {
		 font-size: 60px;
		 max-width: 500px;
	}
}
 @media (min-width: 1600px) {
	 .webinar-hero__title {
		 font-size: 80px;
		 max-width: 750px;
	}
}
 .webinar-hero__description {
	 font-family: 'Roboto', sans-serif;
   font-weight: 400;
	 font-size: 16px;
	 line-height: 22px;
	 color: #fff;
	 margin: 0;
}

body .webinar-hero__description p {
  margin: 0;
}
 @media (min-width: 1024px) {
	 .webinar-hero__description {
		 font-size: 20px;
		 line-height: 26px;
		 max-width: 560px;
	}
}
 .webinar-hero__form {
	 padding: 12px 6px;
	 background: #fff;
	 border-radius: 20px;
	 overflow: hidden;
	 display: flex;
	 flex-direction: column;
	 align-items: center;
}
 @media (min-width: 1024px) {
	 .webinar-hero__form {
		 padding: 20px 15px;
	}
}
 @media (min-width: 1280px) {
	 .webinar-hero__form {
		 padding: 40px 56px;
	}
}
 .webinar-hero__form .hs_cos_wrapper {
	 width: 100%;
}
 .webinar-hero__form .hs_cos_wrapper > div {
	 width: 100%;
}
 .webinar-hero__form .hs_cos_wrapper > div > form {
	 width: 100%;
}
 .webinar-hero__form ul {
	 margin: 8px 0;
	 padding-left: 0;
}
 .webinar-hero__form ul li {
	 list-style: none;
	 font-size: 12px;
	 line-height: 14px;
	 color: #f00;
}

.webinar-hero__form ul li::before {
  display: none !important;
}
 .webinar-hero__form .hs-error-msgs li {
	 padding-left: 20px;
}
 .webinar-hero__form--title {
	 text-align: center;
	 margin-bottom: 16px;
	 font-family: 'Readex Pro', sans-serif;
	 font-weight: 700;
	 font-size: 18px;
	 line-height: 24px;
	 color: #20407b;
}
 @media (min-width: 1280px) {
	 .webinar-hero__form--title {
		 font-size: 32px;
		 line-height: 40px;
		 margin-bottom: 32px;
	}
}
 .webinar-hero__form--text {
	 font-family: 'Roboto', sans-serif;
	 font-size: 14px;
	 line-height: 20px;
	 color: #424242;
}
 .webinar-hero__form--info {
	 font-family: 'Roboto', sans-serif;
	 font-size: 14px;
	 line-height: 20px;
	 color: #424242;
}
 .webinar-hero__form--info a {
	 text-decoration: underline;
	 color: #f74e00;
}
 .webinar-hero__form .form-title {
	 display: none !important;
}
 .webinar-hero__form form option {
	 color: #757575;
}
 .webinar-hero__form form .hs-submit {
	 border-radius: 56px;
	 overflow: hidden;
}
 .webinar-hero__form form .hs-submit .actions {
	 width: 100%;
	 height: auto;
}
 .webinar-hero__form form .hs-submit input[type='submit'] {
	 width: 100%;
	 height: auto;
	 display: block;
	 padding: 12px 40px;
	 cursor: pointer;
	 background: #f74e00;
	 -webkit-appearance: none;
	 outline: none;
	 border: none;
	 font-family: 'Readex Pro', sans-serif;
	 font-style: normal;
	 font-weight: 500;
	 font-size: 16px;
	 line-height: 24px;
	 color: #fff;
	 text-align: center;
	 transition: 0.15s ease-in-out;
}
 .webinar-hero__form form .hs-submit input[type='submit']:hover {
	 background: #f54e00;
}
 .webinar-hero__form .hs-form-field {
	 position: relative;
	 width: 100%;
	 margin-bottom: 10px;
}
 .webinar-hero__form .hs-form-field .input select {
	 position: relative;
	 border: 2px solid #ced4da;
	 border-radius: 32px;
	 padding: 8px 20px;
	 width: 100%;
	 font-family: 'Roboto', sans-serif;
	 font-size: 16px;
	 line-height: 24px;
	 color: #000;
	 appearance: none;
	 background: transparent url('https://www.msp360.com/images-new/common/select-arrow.svg') no-repeat right 24px top 50%;
	 background-size: 16px 10px;
	 outline: none;
	 height: 40px;
}
 .webinar-hero__form .hs-form-field .input select::placeholder {
	 font-family: 'Roboto', sans-serif;
	 font-size: 16px;
	 line-height: 24px;
	 color: #757575;
}
 .webinar-hero__form .hs-form-field .input input[type='text'], .webinar-hero__form .hs-form-field .input input[type='email'], .webinar-hero__form .hs-form-field .input input[type='tel'] {
	 -webkit-appearance: none;
	 outline: none;
	 padding: 8px 20px;
	 border: 2px solid #ced4da;
	 border-radius: 32px;
	 height: 40px;
	 width: 100%;
	 transition: 0.3s ease-in-out;
	 font-family: 'Roboto', sans-serif;
	 font-size: 16px;
	 line-height: 24px;
	 color: #000;
}
.webinar-hero__form .hs-form-field .input textarea {
	 -webkit-appearance: none;
	 outline: none;
	 padding: 8px 20px;
	 border: 2px solid #ced4da;
	 border-radius: 32px;
	 width: 100%;
	 transition: 0.3s ease-in-out;
	 font-family: 'Roboto', sans-serif;
	 font-size: 16px;
	 line-height: 24px;
	 color: #000;
}
 .webinar-hero__form .hs-form-field .input input[type='text']::placeholder, .webinar-hero__form .hs-form-field .input input[type='email']::placeholder, .webinar-hero__form .hs-form-field .input input[type='tel']::placeholder, .webinar-hero__form .hs-form-field .input textarea::placeholder {
	 font-family: 'Roboto', sans-serif;
	 font-size: 16px;
	 line-height: 24px;
	 color: #757575;
}
 .webinar-hero__form .hs-form-field .input input[type='text']:hover, .webinar-hero__form .hs-form-field .input input[type='email']:hover, .webinar-hero__form .hs-form-field .input input[type='tel']:hover, .webinar-hero__form .hs-form-field .input textarea:hover {
	 border-color: #f74e00;
}
 .webinar-hero__form .hs-form-field > label {
	 display: none;
}
 .webinar-hero__form .hs-form-field.hs-fieldtype-select {
	 position: relative;
}
 .webinar-hero__form .hs-form-field .hs-form-booleancheckbox-display {
	 display: flex;
	 align-items: center;
	 cursor: pointer;
}
 .webinar-hero__form .hs-form-field .hs-form-booleancheckbox-display input {
	 width: 30px;
	 height: 30px;
	 flex: 0 0 30px;
	 margin-right: 8px;
	 border: 2px solid #f74e00;
	 background: #fff url('https://www.msp360.com/images-new/common/checkbox-icon.svg') no-repeat center / 14px 10px;
	 border-radius: 8px;
	 transition: 0.15s ease-in-out;
	 -webkit-appearance: none;
	 outline: none;
}
 @media (max-width: 1028px) {
	 .webinar-hero__form .hs-form-field .hs-form-booleancheckbox-display input {
		 margin-right: 16px;
	}
}
 .webinar-hero__form .hs-form-field .hs-form-booleancheckbox-display input:hover {
	 outline: none;
}
 .webinar-hero__form .hs-form-field .hs-form-booleancheckbox-display input:checked {
	 background-color: #f74e00;
}
 .webinar-hero__form .hs-form-field .hs-form-booleancheckbox-display span {
	 font-family: 'Roboto', sans-serif;
	 font-size: 14px;
	 line-height: 20px;
	 color: #424242;
	 max-width: 190px;
}
 @media (max-width: 1028px) {
	 .webinar-hero__form .hs-form-field .hs-form-booleancheckbox-display span {
		 max-width: none;1
     
	}
}