/*https://jobs.ashbyhq.com/synthesia*/

@font-face {
    font-family: Basiersquare Webfont;
    src: url(https://cdn.prod.website-files.com/65e89895c5a4b8d764c0d710/65e89895c5a4b8d764c0e21d_6527f9cf2cfe9fad38bd66bc_basiersquare-regular-webfont.woff2)format("woff2");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}
@font-face {
    font-family: Basiersquare Webfont;
    src: url(https://cdn.prod.website-files.com/65e89895c5a4b8d764c0d710/65e89895c5a4b8d764c0e21e_6527f9cf2cfe9fad38bd66bd_basiersquare-medium-webfont.woff2)format("woff2");
    font-weight: 500;
    font-style: normal;
    font-display: swap
}
/*Make font crisper*/
* {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}



/* These variables can be used to control values throughout the job board. */
:root {
    /*  Darker primary color
    WARNING - This can be set in the Ashby admin under theme settings!
    If you modify, you should make sure your colors work with the settings there. */
    --colorPrimary900: #0D0F2C; /*base-dark*/

    /*  Lighter primary color
    WARNING - This can be set in the Ashby admin under theme settings!
    If you modify, you should make sure your colors work with the settings there. */
    --colorPrimary600: #3E57DA; /*indigo-500*/
    
    --colorNeutral800: #333B52; /*grey-700*/
    --colorNeutral700: #656C86; /*grey-600*/

    /*  The max width of the job board container */
    --widthMaxJobBoard: 800px;

    /*  The max width of the application form section */
    /* --widthMaxJobBoard: 800px; */

    /*  Container border radius */
    --borderRadiusContainer: 10px;

    /*  Border radius of control elements (e.g. input boxes) */
    --borderRadiusControl: 10px;

    /*  Button border radius */
    --borderRadiusButton: 10px;

    /*  Font families */
    --fontFamily: "Basiersquare Webfont", sans-serif;
    
    /* Font weight medium bold, overwrite to 500*/
    --fontWeightMediumBold: 500;

    --colorAppBackground: white;
  }
  
body {
	font-family: Basiersquare Webfont,sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5rem
}

a, button {
	cursor: pointer;
}

.ashby-job-posting-header img,
img[alt="Synthesia"] {
	max-width: 250px;
}


.ashby-job-board-heading {
	font-size: 2rem;
	font-style: normal;
	font-weight: 500;
	line-height: 2.375rem;
	letter-spacing: -0.08rem;
	color: var(--colorPrimary900);
}

.ashby-job-board-filters-label {
	color: #656C86;
	font-size: 0.75rem !important;
	font-weight: 500;
	line-height: 1.125rem !important;
	letter-spacing: 0.03rem;
	text-transform: uppercase;
}

.ashby-job-board-filter {
  border: 1px solid #D1D6E5;
  background-color: white;
  border-radius: .5rem;
  width: 100%;
  padding: .75rem;
  transition: border-color .2s, box-shadow .2s;
  cursor: pointer;
  font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.375rem;
	letter-spacing: -0.00175rem;
}

.ashby-job-board-filter:hover {
  box-shadow: 0 2px 16px 0 #10182814;
}

.ashby-job-board-filter:focus-visible {
  border-color: #3E57DA;
  box-shadow: 0 0 0 3px #E3EBFF;
  font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.375rem;
	letter-spacing: -0.00175rem;
}

.ashby-job-board-reset-filters-label {
	padding: 0.5rem 1rem !important;
	background-color: white !important;
	border: 1px solid #D1D6E5 !important;
	border-radius: .5rem !important;
	font-size: 0.875rem !important;
	line-height: 1.375rem !important;
	letter-spacing: -0.00175rem !important;
	color: var(--colorPrimary900);
	box-shadow: 0 2px 10px 0 rgba(11, 18, 32, 0.08) !important;
	cursor: pointer;
	height: auto !important;
}

.ashby-job-board-reset-filters-label:hover {
	background-color: #e6eaf4 !important;
	color: var(--colorPrimary900) !important;
  box-shadow: 0 6px 20px 0 rgba(11, 18, 32, 0.08) !important;
}



@media screen and (max-width: 767px) {
	.ashby-job-board-reset-filters-label {
		background-color: transparent !important;
		box-shadow: none !important;
		border: none !important;
		padding: 0!important;
	}
	.ashby-job-board-reset-filters-label:hover {
		background-color: transparent !important;
		box-shadow: none !important;
		border: none !important;
	}
	.ashby-job-board-reset-filters-label svg {
		min-width: 20px;
	}
}

.ashby-department-heading {
	font-size: 1.5rem;
	font-weight: 500;
	line-height: 1.75rem;
	letter-spacing: -0.045rem;
	color: var(--colorPrimary900);
	margin-bottom: 1.25rem;
	margin-top: 2.5rem;
}

.ashby-job-posting-brief {
  margin: 0 0 1rem 0 !important;
  padding: 1.5rem;
  background-color: #F4F7FF;
  border: 1px solid #E3EBFF !important;
  box-shadow: none;
  transition: box-shadow .2s ease;
}
.ashby-job-posting-brief:hover {
  background-color:	#F4F7FF;
  box-shadow: 0 2px 16px 0 #10182814;
}

.ashby-job-posting-brief-title {
	color: var(--colorNeutral800);
	font-size: 1.25rem;
	font-style: normal;
	font-weight: 500;
	line-height: 1.75rem; /* 140% */
	letter-spacing: -0.0125rem;
	position: relative;
	padding-right: 1.5rem;
}

.ashby-job-posting-brief-title:after {
	content: url("data:image/svg+xml,%3Csvg width='100%25' height='100%25' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7.33335 1.48433C7.09903 1.25002 6.71913 1.25002 6.48482 1.48433C6.2505 1.71864 6.2505 2.09854 6.48482 2.33286L9.55235 5.40039H0.999902C0.668532 5.40039 0.399902 5.66902 0.399902 6.00039C0.399902 6.33176 0.668532 6.60039 0.999902 6.60039H9.55058L6.48482 9.66615C6.2505 9.90046 6.2505 10.2804 6.48482 10.5147C6.71913 10.749 7.09903 10.749 7.33335 10.5147L11.4053 6.44273C11.5139 6.34312 11.5857 6.20403 11.598 6.0482C11.6117 5.87885 11.5538 5.70479 11.4243 5.57524L7.33335 1.48433Z' fill='%233E57DA'/%3E%3C/svg%3E");
	display: inline-block;
	width: 1rem;
  height: 1rem;
	position: absolute;
  right: 0;
  top: 0;
}

.ashby-job-posting-brief-details {
	font-size: 0.875rem;
	font-weight: 400;
	line-height: 1.375rem;
	letter-spacing: -0.00175rem;
}

/* The heading of a job post */
.ashby-job-posting-heading {
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 1.75rem;
    letter-spacing: -0.045rem;
    color: var(--colorPrimary900);
}

.ashby-job-posting-left-pane h2 {
	color: #656C86;
  font-size: 0.75rem !important;
  font-weight: 500;
  line-height: 1.125rem !important;
  letter-spacing: 0.03rem;
  text-transform: uppercase;	
}
.ashby-job-posting-left-pane p {
	font-size: 1.125rem;
	font-style: normal;
	font-weight: 500;
	line-height: 1.625rem; /* 144.444% */
	letter-spacing: -0.009rem;
}

/*Job post*/
.ashby-job-posting-right-pane *:not(button),
.ashby-job-posting-left-pane {
	box-shadow: none !important;
}

.ashby-job-posting-right-pane h2 {
	font-size: 1.75rem;
	font-style: normal;
	font-weight: 500;
	line-height: 2.125rem; /* 121.429% */
	letter-spacing: -0.06125rem;
	color: var(--colorPrimary900);
	margin-top: 1rem;
}
.ashby-job-posting-right-pane[aria-labelledby="job-overview"] h3 {
	font-size: 1.5rem;
	font-style: normal;
	font-weight: 500;
	line-height: 1.75rem; /* 116.667% */
	letter-spacing: -0.045rem;
	color: var(--colorPrimary900);
	margin-top: 2.5rem;
}

.ashby-job-posting-right-pane p {
	font-size: 1rem;
	font-style: normal;
	font-weight: 400;
	line-height: 1.5rem; /* 150% */
	letter-spacing: -0.004rem;
	margin-top: 1.5rem !important;
}
.ashby-job-posting-right-pane p a {
	text-decoration: none;
	transition: color .2s ease;
}
.ashby-job-posting-right-pane p a:hover {
	color: #1F235B;
	text-decoration: underline;
}
.ashby-job-posting-right-pane li {
	margin-top: 1rem !important;	
}
.ashby-job-posting-right-pane li p {
	margin-top: 0rem !important;	
}


.ashby-application-form-autofill-pane svg {
	width: 1rem !important;
	height: 1rem !important;
	margin-top: .125rem;
}

.ashby-application-form-autofill-input-title {
	margin-left: -.5rem;
}

.ashby-application-form-field-entry p,
.ashby-application-form-autofill-pane p {
	margin-top: 0 !important;
}

label {
	font-size: 0.875rem !important;
	font-style: normal !important;
	font-weight: 400 !important;
	line-height: 1.375rem !important;
	letter-spacing: -0.00175rem !important;
	margin-bottom: .5rem !important;
}

input:not([type="checkbox"]) {
	height: 3rem !important;
	padding: 0.75rem 1rem !important;
	border-radius: 0.5rem !important;
	border: 1px solid #D1D6E5 !important;
	transition: .2s ease !important;
	transition-property: box-shadow, border-color !important;
	cursor: pointer;
}
input:not([type="checkbox"]):hover {
	box-shadow: 0 2px 16px 0 rgba(13, 15, 44, 0.08) !important;
}
input:not([type="checkbox"]):focus-within {
	box-shadow: 0 0 0 3px #E1EAFF !important;
	border-color: var(--colorPrimary600) !important;
	outline: 0 !important;
}


.ashby-application-form-autofill-input-form-alert {
	padding: 1rem;
}
.ashby-application-form-autofill-input-form-alert h2 {
	margin-top: 0;
	font-size: 1.5rem;
	font-style: normal;
	font-weight: 500;
	line-height: 1.75rem; /* 116.667% */
	letter-spacing: -0.045rem;
}

.ashby-application-form-autofill-input-form-alert[data-highlight="positive"] {
	background-color: #F1FDF6 !important;
	border: 1px solid #15A261 !important;
}
.ashby-application-form-autofill-input-form-alert[data-highlight="positive"] p,
.ashby-application-form-autofill-input-form-alert[data-highlight="positive"] h2 {
	color: #15A261 !important;
}

.ashby-application-form-autofill-input-form-alert[data-highlight="warning"] {
	background-color: #FEF3F2 !important;
	border: 1px solid #D92D20 !important;
}
.ashby-application-form-autofill-input-form-alert[data-highlight="warning"] p,
.ashby-application-form-autofill-input-form-alert[data-highlight="warning"] h2 {
	color: #D92D20 !important;
}




/*Open filters mobile*/
button[tabindex] {
	padding: 0.5rem 1rem !important;
	background-color: white !important;
	border: 1px solid #D1D6E5 !important;
	border-radius: .5rem !important;
	font-size: 0.875rem !important;
	line-height: 1.375rem !important;
	letter-spacing: -0.00175rem !important;
	color: var(--colorPrimary900) !important;
	box-shadow: 0 2px 10px 0 rgba(11, 18, 32, 0.08) !important;
	text-decoration: none !important;
	transition: .2s ease;
	transition-property: box-shadow, background-color;
}
button[tabindex]:hover {
	background-color: #e6eaf4 !important;
	color: var(--colorPrimary900) !important;
  box-shadow: 0 6px 20px 0 rgba(11, 18, 32, 0.08) !important;
}

/*Form buttons*/
[aria-labelledby="job-application-form"] button:not(.ashby-application-form-field-entry > div > button, .ashby-application-form-submit-button) {
	padding: 0.5rem 1rem !important;
	background-color: white !important;
	border: 1px solid #D1D6E5 !important;
	border-radius: .5rem !important;
	font-size: 0.875rem !important;
	line-height: 1.375rem !important;
	letter-spacing: -0.00175rem !important;
	color: var(--colorPrimary900) !important;
	box-shadow: 0 2px 10px 0 rgba(11, 18, 32, 0.08) !important;
}
[aria-labelledby="job-application-form"] button:not(.ashby-application-form-field-entry > div > button, .ashby-application-form-submit-button):hover {
	background-color: #e6eaf4 !important;
	color: var(--colorPrimary900) !important;
  box-shadow: 0 6px 20px 0 rgba(11, 18, 32, 0.08) !important;
}
[aria-labelledby="job-application-form"] button svg:not(.ashby-application-form-submit-button svg) {
	fill: var(--colorPrimary900) !important;
	margin-right: .5rem !important;
}



/*Delete files buttons*/
button[title="Delete file"] {
	background-color: #D92D20 !important;
	border-color: #D92D20 !important;
}
button[title="Delete file"]:hover {
	background-color: #912018 !important;
	border-color: #912018 !important;
}
button[title="Delete file"] svg {
	margin: 0 !important;
	fill: white !important;
}

/*Primary submit button*/
[aria-labelledby="job-overview"] button,
[aria-labelledby=job-application-form] button.ashby-application-form-submit-button {
	border-radius: 0.75rem !important;
	box-shadow: 0 2px 10px 0 rgba(11, 18, 32, 0.08) !important;
	padding: 0.75rem 1.125rem !important;
	font-size: 1rem !important;
	font-style: normal !important;
	font-weight: 500 !important;
	line-height: 1.5rem !important;
	background-color: var(--colorPrimary600) !important;
	color: white !important;
	letter-spacing: -0.004rem !important;
	transition-property: box-shadow, background-color !important;
	transition: .2s ease !important;
}
[aria-labelledby="job-overview"] button:hover,
[aria-labelledby=job-application-form] button.ashby-application-form-submit-button:hover {
	box-shadow: 0 6px 20px 0 rgba(11, 18, 32, 0.12) !important;
	background-color: #1F235B !important;
}


@media screen and (min-width: 768px) {
	.ashby-job-posting-brief-list {
	    margin: 0 .75rem;
	}
	.ashby-job-board-filters-label {
    margin-top: auto;
	}
}
@media screen and (max-width: 767px) {
	.ashby-job-board-heading, .ashby-department-heading-level {
		margin-left: -.75rem;
	}
	.ashby-job-posting-heading {
  	margin-bottom: 0rem !important;
	}
	.ashby-job-posting-left-pane {
		padding-top: .5rem;
	}
}
button[tabindex] {
	font-weight: 500;
}

nav > a[aria-selected="false"] .ashby-job-posting-right-pane-overview-tab,
nav > a[aria-selected="false"] .ashby-job-posting-right-pane-application-tab {
	color: var(--colorNeutral800);
}
nav > a[aria-selected="false"] {
	border-bottom: 2px solid var(--colorNeutral200);
}

.ashby-job-posting-heading {
  margin-bottom: 2rem;
  border-bottom: 1px solid var(--colorNeutral200);
  padding-bottom: 1rem;
}
.ashby-job-posting-right-pane h2 {
  margin-bottom: 2rem;
}




/* Application autofill input's base layer element. This contains standard copy, a CTA button, and potential validation alerts. */
.ashby-application-form-autofill-input-base-layer {}

/* Application autofill input's description. */
.ashby-application-form-autofill-input-description {}

/* Application autofill input's drag state overlay element. Can style [data-state] which can be 'active' or 'hidden'. */
.ashby-application-form-autofill-input-drag-layer {}

/* Application autofill input form's alert element. Can style [data-highlight] which can be 'negative' or 'positive'. */
.ashby-application-form-autofill-input-form-alert {}

/* Application autofill input's magic sparkles icon. */
.ashby-application-form-autofill-input-icon {}

/* Application autofill input's pending state overlay element. Can style [data-state] which can be 'active' or 'hidden'. */
.ashby-application-form-autofill-input-pending-layer {}

/* Application autofill input's root element. Can style [data-state] which can be 'pending', 'drag', or 'default'. */
.ashby-application-form-autofill-input-root {}

/* Application autofill input's title. */
.ashby-application-form-autofill-input-title {}

/* Container element for application autofill input form. */
.ashby-application-form-autofill-pane {}

/* The resume uploader to auto-fill the application form */
.ashby-application-form-autofill-uploader {}

/* A container for displaying the custom message to the user */
.ashby-application-form-blocked-application-container {}

/* A container for the application form. */
.ashby-application-form-container {}

/* A container for the failure message */
.ashby-application-form-failure-container {}

/* A container for the label and input on an application form. */
.ashby-application-form-field-entry {}

/* The description of each question on an application form. Will only show if a description is specified. */
.ashby-application-form-question-description {}

/* The title of each question on an application form. */
.ashby-application-form-question-title {}

/* A single section on the Ashby application form. All questions will be wrapped in sections, though the default section may not have a title. */
.ashby-application-form-section-container {}

/* The header for an application form section, possibly containing a title and description. */
.ashby-application-form-section-header {}

/* The description for an application form section. May not exist if no description was specified. */
.ashby-application-form-section-header-description {}

/* The title for an application form section. May not exist for the default section. */
.ashby-application-form-section-header-title {}

/* The application submission button. Will have loading and hover states that should be tested. */
.ashby-application-form-submit-button {}

/* A container for the success message */
.ashby-application-form-success-container {}

/* The text message consent description. Displayed below phone number fields. Will only show if texting is enabled. */
.ashby-application-form-texting-consent-description {}

/* The heading of a single team. */
.ashby-department-heading-level {}

/* The button which allows users to navigate from an individual posting back to the list of all job postings. */
.ashby-job-board-back-to-all-jobs-button {}

/* The 'Reset filters' label element in the job board. */
.ashby-job-board-reset-filters-label {}

/* The heading of a department name. Departments group teams. */
.ashby-job-posting-brief-department-heading {}

/* The heading of a single team. */
.ashby-job-posting-brief-department-heading-level {}

/* The container for the list of job post briefings. */
.ashby-job-posting-brief-list {}


/* The left pane of the job posting, with the job posting details */
.ashby-job-posting-left-pane {}

/* The right pane of the job posting, containing the tabs, overview, and application form */
.ashby-job-posting-right-pane {}

/* The application tab in the right pane of the job posting */
.ashby-job-posting-right-pane-application-tab {}

/* The overview tab in the right pane of the job posting */
.ashby-job-posting-right-pane-overview-tab {}

/* The tabs slider in the right pane of the job posting */
.ashby-job-posting-right-pane-tab-slider {}

/* A container for any surveys specified for this application form. */
.ashby-survey-form-container {}