@font-face {
  font-family: 'Source Sans Pro Bold';
  src: url('../assets/fonts/source-sans-pro.bold.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'Source Sans Pro Regular';
  src: url('../assets/fonts/source-sans-pro.regular.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'Source Sans Pro Light';
  src: url('../assets/fonts/source-sans-pro.light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'Source Sans Pro ExtraLight';
  src: url('../assets/fonts/source-sans-pro.extralight.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
}

html, body {
	height: 100%;
	margin: 0;
	display: flex;
	flex-direction: column;
	font-family: 'Source Sans Pro Regular', Arial, sans-serif;
	overflow-x: hidden;
	margin-top: 0;
	padding-top: 0;
	background-color: #f7f7f7;
}

iframe {
	width: 100%;
}

.content {
	flex-grow: 1;
}

h1 {
	font-family: 'Source Sans Pro Bold', Arial, sans-serif;
	font-size: 50px;
	margin: 0;
	margin-block-start: 0px;
	margin-block-end:0px;
}

h2, h4 {
	font-family: 'Source Sans Pro Regular', Arial, sans-serif;
	margin: 0;
	margin-block-start: 0px;
	margin-block-end:0px;
}

h3 {
	font-family: 'Source Sans Pro Bold', Arial, sans-serif;
	font-size: 40px;
	margin: 0;
	margin-block-start: 0px;
	margin-block-end:0px;
}

b {
	font-weight: bold;
}

p {
	color: #76777a;
}

a {
	text-decoration: none;
}

.first-label {
	font-size: 40px;
	color: #76777A;
	font-family: 'Source Sans Pro Light', Arial, sans-serif;
  font-weight: 300;
}

.second-label {
	font-size: 30px;
	color: #76777A;
	font-family: 'Source Sans Pro ExtraLight', Arial, sans-serif;
  font-weight: 300;
}

.section {
    padding: 60px 20px;
}

.bg-light-gray {
  background-color: #ececec;
}

.bg-green {
	background-color: #139c88;
	color: white;
}

footer {
	padding: 20px 0;
	text-align: center;
	background-color: #d9edea;
}

.app-badges img {
	height: 40px;
	margin: 10px;
}

li {
	color: #76777A;
	font-size: 18px;
}

ul.list-unstyled li {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: 12px;
	margin-bottom: 2.4rem;
	list-style: none;
	text-align: left;
}

ul.list-unstyled li span.circle {
	width: 25px;
	height: 25px;
	background-color: #139c88;
	border-radius: 50%;
	flex-shrink: 0;
	display: block;
}

ul.list-unstyled2 li {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 12px;
	margin-bottom: 2.4rem;
	list-style: none;
	text-align: right;
}

ul.list-unstyled2 li span.circle {
	width: 25px;
	height: 25px;
	background-color: #139c88;
	border-radius: 50%;
	flex-shrink: 0;
	display: block;
}


.video-container {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 ratio */
  height: 0;
  overflow: hidden;
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media (max-width: 576px) {
  .first-label {
		font-size: 35px;
	}

	.second-label {
		font-size: 25px;
	}

	h1 {
		font-size: 40px;
	}
}