/*FONTS*/
@font-face {
    font-family: 'Code Pro Regular';
    src: url('fonts/SourceCodePro-Regular.ttf')format('truetype');
}
@font-face {
    font-family: 'Code Pro Medium';
    src: url('fonts/SourceCodePro-Medium.ttf')format('truetype');
}
@font-face {
    font-family: 'Code Pro Bold';
    src: url('fonts/SourceCodePro-Bold.ttf')format('truetype');
}

body {
	background: #ffffff;
	padding: 0px;
	font-family: 'Code Pro Regular', Arial, sans-serif;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 22px;
	color: #757575;
	letter-spacing: 0.015em;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}

.masthead h1 {
	font-family: 'Code Pro Medium', Arial, sans-serif;
	font-weight: 500;
	font-size: 76px;
	line-height: 88px;
	color: #ffffff;
}
h1 {
	font-size: 64px;
	line-height: 68px;
	color: #333333;
}
h2 {
	font-size: 44px;
	line-height: 52px;
	color: #333333;
}
h3 {
	font-size: 28px;
	line-height: 34px;
	color: #333333;
}
/* Labels */
h5 {
	font-family: 'Code Pro Medium', Arial, sans-serif;
	font-weight: 500;
	font-size: 18px;
	line-height: 22px;
	color: #333333;
}
/* Labels */
.benefit-card h5 {
	font-size: 22px;
	line-height: 26px;
}
/* TITLE */
h6 {
	font-family: 'Code Pro Medium', Arial, sans-serif;
	font-weight: 500;
	font-size: 18px;
	line-height: 22px;
	color: #1F3598;
}
.card p, footer, footer p {
	font-size: 18px;
	line-height: 22px;
}
footer {
	color: #333333;
}
/* Subhead */
p {
	font-size: 20px;
	line-height: 26px;
}
li {
	font-family: 'Code Pro Regular', Arial, sans-serif;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 24px;
	color: #545454;
	letter-spacing: 0.015em;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}
.code {
	font-size: 18px;
	line-height: 22px;
}

/****UNIVERSAL****/
.dark {
	/* color: #061058; */
	color: #000000
}
.gray {
	color: #979797;
}
.white {
	color: #ffffff;
}
.bold {
	font-family: 'Code Pro Bold', Arial, sans-serif;
	font-style: normal;
	font-weight: bold;
}
.extra-gradient {
	margin-top: -100px;
	height: 100px;
	background: linear-gradient(270deg, #2fbcdb 10.56%, #188aca 92.14%);
}
.extra-white {
	margin-top: -100px;
	height: 100px;
	background-color: white;
}
.inactive {
	display: none;
}
.active {
	display: block;
}
.inner-box {
	border-radius: 20px;
	background-color: white;
	box-shadow: 0px 40px 100px rgba(0, 0, 0, 0.1);
}
.extra-gradient {
	display: none;
}
.tab-links{
	color: #2364D2;
}
/****UNIVERSAL****/

/****NAVBAR****/
.navbar {
	z-index: 7000;
	background-color: white;
}
.navbar li {
	font-family: 'Code Pro Medium', Arial, sans-serif;
	font-size: 18px;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}
.navbar li a {
	color: #212b36;
}
.navbar .navbar-toggler .icon-bar {
	color: pink !important;
}
.nav-logo {
	width: 142px;
	height: auto;
}
.navbar .nav-link:hover {
	text-decoration: underline;
	color: #2364d2;
}
/****NAVBAR****/

/****MASTHEAD****/
.masthead {
	height: 100%;
	padding-top: 120px;
	padding-bottom: 30px;
}
.masthead-tabs {
	border-radius: 20px;
	background-color: white;
}
.gradient {
	background: linear-gradient(75deg, #2fbcdb 10.56%, #188aca 92.14%);
}
.gradient-reverse {
	background: linear-gradient(90deg, #188aca 92.14%, #2fbcdb 10.56%,);
}
.masthead-card {
	border-radius: 20px;
}
.masthead .tab-content {
	margin-top: -2px;
	background-color: #fff;
	border: 0;
	border-top: 1px solid #e9e9e9;
	padding: 15px 0;
}
.masthead .nav-tabs .nav-link.active {
	border: 0;
	border-bottom: 4px solid #2364d2;
	position: relative;
}
.masthead .nav-tabs li.active {
	border-bottom: 4px solid #f3565d;
	position: relative;
}
.masthead .nav-tabs .nav-link {
	border: red;
}
.masthead .nav-tabs {
	border: none;
	margin: 0px;
}
.masthead .nav-link {
	padding-left: 0px;
	padding-right: 0px;
}
.masthead .nav-link h5 {
	color: #5b5b5b;
}
.masthead .nav-tabs .active h6 {
	color: #061058;
}
/****MASTHEAD****/

/****SECTION 1****/
.section-1-cards .card {
	box-shadow: 0px 20px 50px rgba(0, 0, 0, 0.1);
	border: 0px solid rgba(0, 0, 0, 0.125);
}
.card-img-top {
	width: 40px;
	height: auto;
}
.card-img-top-b {
	width: 40px;
	height: auto;
}
.card-blue {
	background: #f5f8ff;
	border: 0px solid rgba(0, 0, 0, 0.125);
}
.card-icon {
	width: 30px;
	height: auto;
}
.masthead-card-row {
	position: relative;
	z-index: 3000;
}
/****SECTION 1****/

/****SECTION 2****/
.how-it-works {
	padding-top: 60px;
}
.text-link {
	color: #2364d2;
	text-decoration: underline;
}
/****SECTION 2****/

/****SECTION 3****/
.local,
.group,
.feature {
	display: none;
}
.section-3 .tab-content {
	margin-top: -2px;
	background-color: #fff;
	border: 0;
	border-top: 1px solid #e9e9e9;
	padding: 15px 0;
}
.section-3 .nav-tabs .nav-link.active {
	border: 0;
	border-bottom: 4px solid #2364d2;
	position: relative;
}
.section-3 .nav-tabs li.active {
	border-bottom: 4px solid #f3565d;
	position: relative;
}
.section-3 .nav-tabs .nav-link {
	border: red;
}
.section-3 .nav-tabs {
	border: none;
	margin: 0px;
}
.section-3 .nav-link {
	padding-left: 0px;
	padding-right: 0px;
}
.section-3 .nav-tabs .active h6 {
	color: #061058;
}

.installation {
	font-size: 14px;
}

.quickstart-btn {
	font-family: 'Code Pro Medium', Arial, sans-serif;
	font-size: 18px;
	display: inline-block;
	color: #ffffff;
	background-color: #2364D2;
	padding: 20px 0px 16px 0px;
	margin: 0px 0px;
	width: 200px;
	border-radius: 100px;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}

.masthead .quickstart-btn {
	width: 155px;
}

.quickstart-btn:hover {
	text-decoration: underline;
	color: #ffffff;
}
/****SECTION 3****/

/****SECTION 4****/
.interactive-visualization-icon {
	display: block;
	width: 220px;
	height: auto;
}
.section-4 li {
	font-family: 'Code Pro Regular', Arial, sans-serif;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 20px;
	padding-top: 0px;
	padding-bottom: 10px;
	color: red;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}
li.check-icon {
	color: #545454;
	background: url('../images/check-icon.png') no-repeat 0 5px;
	background-size: 13px 10px;
	padding-left: 25px;
	display: block;
}
.section-4 .tab-content {
	margin-top: -11px;
	background-color: #fff;
	border: 0;
	border-top: 1px solid #e9e9e9;
	padding: 15px 0;
}
.section-4 .nav-tabs .nav-link.active {
	border: 0;
	border-bottom: 4px solid #2364d2;
	position: relative;
}
.section-4 .nav-tabs li.active {
	border-bottom: 4px solid #f3565d;
	position: relative;
}
.section-4 .nav-tabs .nav-link {
	border: red;
}
.section-4 .nav-tabs {
	border: none;
	margin: 0px;
}
.section-4 .nav-link {
	padding-left: 0px;
	padding-right: 0px;
}
.section-4 .nav-tabs .active h6 {
	color: #061058;
}
/****SECTION 4****/

/****SECTION 5****/
.section-5 {
	background: #F2F2f2;
}
.benefits-icons {
	width: 26px;
	height: auto;
}
.benefit-card {
	color: #757575;
}
.benefit-card {
	border-radius: 1px;
	border: 2px;
}

.benefit-card:hover {
	text-decoration: underline #2364d2;
}

.section-5 .blue-card {
	background-color: #2364d2;
}
/****SECTION 5****/

/***SECTION 7****/
.contribute-btn {
	font-family: 'Code Pro Medium', Arial, sans-serif;
	font-size: 18px;
	display: inline-block;
	color: #ffffff;
	background-color: #ffffff;
	color: #2364D2;
	padding: 20px 0px 16px 0px;
	margin: 0px 9px;
	width: 200px;
	border-radius: 100px;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}

.contribute-btn:hover {
	text-decoration: underline;
	color: #2364d2;
}
/***SECTION 6****/

/****FOOTER****/
.footer-nav {
	list-style: none;
	padding: 0px;
}
.footer-nav .nav-link {
	padding: 8px 0px 8px 0px;
}
.page-footer {
	padding-top: 1px;
	background-color: #FFFFFF;
	height: 80px;
}
.footer-logo {
	width: 45px;
	height: auto;
}
.footer-custom-margin {
	margin-bottom: 0px;
}
.footer-italic {
	font-family: 'Code Pro Regular', Arial, sans-serif;
	font-size: 18px;
	font-style: italic;
	font-weight: bold;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}
.footer-bold {
	font-family: 'Code Pro Bold', Arial, sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: bold;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}
.footer-small {
	font-family: 'Code Pro Regular', Arial, sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: bold;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
}
.line {
	width: 100%;
	height: 2px;
	background-color: #3772CE;
	opacity: 0.9;
}
.page-footer a:hover {
	text-decoration: underline;
	color: #ffffff;
}
@media (min-width: 1200px) {
       .container {
               max-width: 1280px;
       }
}