@import url('https://fonts.googleapis.com/css?family=Barlow:400,500,600,700');
.sc-hero {
	background: #2D2C8D;
	font-family: Barlow;
}
.sc-hero strong {
	font-weight: 600;
}
.text-content {
	padding: 35px 0px;
}
.sc-hero h1 {
	color: #53E0DC;
	font-size: 56px;
	font-weight: 700;
	line-height: 57px;
	padding-bottom: 10px;
}
.sc-hero .subtitle {
	color: #fff;
	font-size: 22px;
	font-weight: 500;
	text-transform: uppercase;
	position: relative;
	display: inline-block;
	padding-bottom: 6px;
	margin-bottom: 60px;
}
.sc-hero .subtitle:after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	height: 2px;
	width: 100%;
	background: #53E0DC;
}
.sc-hero .pure-text {
	color: #fff;
	font-size: 27px;
}
.sc-hero .sc-img-holder {
	position: relative;
}
.sc-hero .sc-hero-img {
	position: absolute;
	left: 0;
	top: 0;
}
#sc-img-mobile {
  display:none;
}
.under-hero {
	font-family: Barlow;
	background: #f6f6fa;
}
.under-hero-text {
    font-size: 20px;
    color: #000042;
    position: relative;
    padding-bottom: 30px;
    padding-top: 180px;
    max-width: 600px;
    margin: 0 auto;
    margin-bottom: 70px;
}
.under-hero-text :after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	height: 2px;
	width: 114px;
	background: #53E0DC;
}
.methodology {
	padding: 60px 0px;
	font-family: Barlow;
}
.methodology h2, .why-techfino h2 {
	font-size: 45px;
	font-weight: 600;
	color: #343492;
	text-align: center;
	margin-bottom: 60px;
}
.dpm-color1 {
	background: #4040B2;
}
.dpm-color2 {
	background: #36369F;
}
.dpm-color3 {
	background: #2D2C8D;
}
.dpm-color4 {
	background: #23237B;
}
.dpm-color5 {
	background: #1A1A6A;
}
.dpm-color1:after {
	border-color: #4040B2 transparent transparent transparent;
}
.dpm-color2:after {
	border-color: #36369F transparent transparent transparent;
}
.dpm-color3:after {
	border-color: #2D2C8D transparent transparent transparent;
}
.dpm-color4:after {
	border-color: #23237B transparent transparent transparent;
}
.dpm-item {
	border-bottom: 1px solid #1A1A6A;
	display: flex;
	flex-direction: row;
	align-items: center;
	align-content: center;
	justify-content: flex-start;
	padding: 40px 60px;
	position: relative;
}
.dpm-title {
	font-size: 26px;
	font-weight: 500;
	color: #fff;
	flex-grow: 1;
	flex-basis: 0;
}
.dpm-title span {
	color: #53E0DC;
	font-weight: 300;
}
.dpm-icon {
	flex-grow: 1;
	flex-basis: 0;
	text-align: center;
}
.dpm-text {
	font-size: 18px;
	color: #fff;
	flex-grow:4;
	flex-basis: 0;
}
.dpm-text ul {
	margin: 0;
}
.dpm-item:after, .dpm-item:before {
	content: '';
	display: block;
	position: absolute;
	left: 60px;
	width: 0;
	height: 0;
	border-style: solid;
	z-index: 100;
}
.dpm-item:after {
	bottom: -30px;
	border-style: solid;
	border-width: 15px;
}
.dpm-item:before {
	bottom: -31px;
	border-style: solid;
	border-width: 15px;
	border-color: #1A1A6A transparent transparent transparent;
}
.dpm-item:last-child:after, .dpm-item:last-child:before {
	display: none
}
.sample-theme {
	padding-top: 240px;
	background: -webkit-linear-gradient(45deg, #F6F6F9 80%, #FFF 80%);
	background: -o-linear-gradient(45deg, #F6F6F9 80%, #FFF 80%);
	background: -moz-linear-gradient(45deg, #F6F6F9 80%, #FFF 80%);
	background: linear-gradient(45deg, #F6F6F9 80%, #FFF 80%);
}
.brown-bg {
	background: #B1A995;
}
.theme-preview {
	position: relative;
	min-height: 600px;
}
.nd-title {
	position: absolute;
	top: -180px;
	left: 400px;
}
h2.nd-title {
	color: #343492;
	font-size: 27px;
	font-family: Barlow;
}
h2.nd-title span {
	font-size: 45px;
	font-weight: 600;
}
.nd-logo {
	position: absolute;
	top: -86px;
	left: 0;
  background: #fff;
  padding: 80px 60px 240px 60px;
  margin: 0 auto;
  max-width: 340px;
}
.nd-macbook {
	position: absolute;
	left: 0;
	top: 80px;
	margin-left: auto;
	margin-right: auto;
}
.nd-tablet {
	position: absolute;
	top: 490px;
	left: 0px;
}
.nd-mobile {
	position: absolute;
	top: 220px;
	right: 10px;
}
.why-techfino {
	font-family: Barlow;
	background: #F6F6F9;
	padding-bottom: 60px;
	padding-top: 290px;
}
.why-techfino .why-text-box {
	background: #fff;
	padding: 60px;
	margin: 20px;
	position: relative;
	overflow: hidden;
	min-height: 515px;
}
.why-techfino .why-text-box:after {
	content: '';
	position: absolute;
	width: 100px;
	height: 100px;
	top: -34px;
	right: -85px;
	background: rgb(246, 246, 249);
	transform-origin: 54% 0;
	transform: rotate(45deg);
	z-index: 1;
}
.why-techfino .why-text-box h3 {
	color: #343492;
	font-size: 29px;
	font-weight: 600;
	position: relative;
	padding-bottom: 30px;
	margin-bottom: 30px;
  text-transform: uppercase;
}
.why-techfino .why-text-box p {
	color: #000042;
	font-size: 18px;
	font-weight: 400;
}
.why-techfino .why-text-box strong {
	font-weight: 600;
}
.why-techfino .why-text-box h3:after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	height: 2px;
	width: 65px;
	background: #53E0DC;
}
.cta-com {
  padding: 96px 0px;
	text-align: center;
	font-family: Barlow;
	overflow: auto;
}
.cta-bg {
	background: url(https://www.techfino.com/hubfs/cta-bg-org.jpg) no-repeat center center;
	background-size: cover;
}
.cta-com p {
	font-size: 45px;
	font-weight: 500;
	color: #fff;
}
.cta-btn {
	margin-top: 60px;
}
.cta-btn a {
	color: #53E0DC;
	font-size: 19px;
	font-weight: 500;
	padding: 10px 30px;
	text-transform: uppercase;
	border: 2px solid #53E0DC;
}
.cta-btn a:hover {
	color: #fff;
	background: #53E0DC;
	text-decoration: none;
}
.cta-com label {
  font-size: 26px;
  font-weight: 500;
  color: #fff;
}
/* =========== MOBILE =========== */
@media (max-width: 1080px) {
   .sc-hero h1 {
     margin-top: 0px;
  }
}
@media (min-width: 767px) and (max-width: 992px) {
  .sc-hero .subtitle {
    margin-bottom: 30px;
  }  
  .sc-hero h1 {
      margin-top: 0px;
  }
}
@media (max-width: 992px) {
  .nd-title, .nd-logo, .nd-macbook, .nd-mobile, .nd-tablet {
    position: initial;
  }
  .nd-macbook {
    margin-top: -110px;
  }
  .nd-mobile {
    margin-top: 0px;
    margin-top: 0;
    max-width: 50%;
  }
  .nd-logo {
    padding-bottom: 140px;
  }
  .sc-hero h1 {
		font-size: 40px;
    line-height: 46px;
	}
    .theme-preview {
    min-height: 640px;
    overflow: hidden;
    text-align: center;
  }
  .sample-theme {
        padding: 0;
  }
  h2.nd-title {
    color: #fff;
    margin-bottom: 40px;
	}
  .why-techfino {
    padding-top: 20px;
    padding-bottom: 20px;
	}
  .under-hero-text {
    padding-top: 30px;    
    margin-bottom: 0px;
  }
  .methodology {
    padding: 0px;
  }
  .cta-com {
    padding: 10px 0px;
  }
  .why-techfino .why-text-box h3 {
    line-height: 40px;
  }
  .why-techfino .why-text-box {
		padding: 40px;
		margin: 30px 20px;
    min-height: auto;
	}
  [data-aos-delay] {
    transition-delay: 0s !important;
 }
}
@media (max-width: 767px) {
	.sc-hero .sc-hero-img {
		position: initial;
	}
  #sc-img-mobile {
    display:block;
	}
  #sc-img-desktop {
    display:none;
  }

	.dpm-item {
		flex-direction: column;
		justify-content: center;
		align-items: center;
		align-content: center;
		padding: 10px;
	}
	.dpm-title, .dpm-icon {
		text-align: center;
		margin: 16px 0px;
	}
	.dpm-text {
		text-align: left;
		margin: 16px 0px;
    width: 100%;
	}
	.nd-mobile {
		right: 0px;
	}

  .why-techfino .why-text-box h3 {
    padding-right: 40px;
  }

	.methodology h2, .why-techfino h2, h2.nd-title span {
		font-size: 35px;
	}
	.re-order > .row-fluid-wrapper > .row-fluid {
		display: -webkit-box;
		display: -moz-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-flow: row wrap;
		-moz-flex-flow: row wrap;
		-ms-flex-flow: row wrap;
		flex-flow: row wrap;
	}
	.col-img-mob {
		order: 2;
		-webkit-order: 2;
		-moz-order: 2;
		-ms-order: 2;
		width: 100%;
	}
	.col-text-mob {
		order: 1;
		-webkit-order: 1;
		-moz-order: 1;
		-ms-order: 1;
		width: 100%;
	}
 
  .why-techfino h2 {
    margin-bottom: 30px;
  }
  .why-techfino .why-text-box {
		margin: 30px 0px;
 }
}
/* FORM */
.form-title {
    font-size: 45px;
    font-weight: 500;
    color: #fff;
    margin-bottom: 40px;
}
.cta-form form {
  max-width: 640px;
  margin: 0 auto;
}
.cta-form .hs-form-field {
    margin: 0;
    position: relative;
    border: 1px solid #6162B2;
    border-top: none;
    padding: 15px;
    text-align: left;
  	background-color: rgba(0,0,66,0.4);
}
.cta-form .hs-form-field:first-child {
  border-top: 1px solid #6162B2;
}
.cta-form  .hs_recaptcha {
  border: none;
  background: transparent;
  text-align: center;
  margin-top: 14px;
}
.grecaptcha-badge {
  box-shadow: none !important;
  margin: 0 auto;
}
.cta-form label {
	color: #BEBEED;	
  font-family: Barlow;	
  font-size: 1.3rem;	
  font-weight: 400;	
  letter-spacing: 0.05px;	
  line-height: 16px;  
  text-transform: uppercase;
}
.cta-form input, .cta-form textarea {
  color: #fff;	
  font-family: Barlow;	
  font-size: 19px;	
  font-weight: 500;
  line-height: 24px;
  background: transparent;
  border: none;
  margin: 0px;
  padding: 0px;
}
::-webkit-input-placeholder {
  color: #fff;
  opacity: 1;
}
:-moz-placeholder {
  color: #fff;
  opacity: 1;
}
::-moz-placeholder {
  color: #fff;
  opacity: 1;
}
:-ms-input-placeholder {
  color: #fff;
  opacity: 1;
}
.hs-form-required {
    color: #DF495C;
}
.hs-form input[type="submit"] {
	color: #53E0DC;	
  font-family: Barlow;	
  font-size: 1.9rem;	
  font-weight: 500;
  padding: 14px 40px;
  border: 2px solid #53E0DC;
  background: transparent;
}
.hs-form input[type="submit"]:hover {
  background: #53E0DC;
  color: #fff;
}
.hs-error-msgs.inputs-list label {
    color: #DF495C;
    border: none;
    padding: 0px;
    background: transparent;
    font-size: 1.3rem;
    margin-bottom: 0px;
    padding-top: 10px;
}
.submitted-message {
    font-family: Barlow;
    color: #fff;
    font-size: 1.8rem;
    font-weight: 400;
    border: 1px solid #6162B2;
    display: inline-block;
    padding: 20px 40px;
}