Current File : //home/vedfinancials/www/html/style-guide.html |
<!doctype html>
<html class="no-js" lang="zxx">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>Finwise - Online Banking & Finance HTML5 Template</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Place favicon.ico in the root directory -->
<link rel="shortcut icon" type="image/x-icon" href="assets/imgs/favicon.svg">
<!-- CSS here -->
<link rel="stylesheet" href="assets/css/vendor/bootstrap.min.css">
<link rel="stylesheet" href="assets/css/vendor/animate.min.css">
<link rel="stylesheet" href="assets/css/plugins/swiper.min.css">
<link rel="stylesheet" href="assets/css/plugins/slick.css">
<link rel="stylesheet" href="assets/css/vendor/magnific-popup.css">
<link rel="stylesheet" href="assets/css/vendor/fontawesome-pro.css">
<link rel="stylesheet" href="assets/css/vendor/flaticon_finwise.css">
<link rel="stylesheet" href="assets/css/vendor/spacing.css">
<link rel="stylesheet" href="assets/css/main.css">
</head>
<body>
<!--[if lte IE 9]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="https://browsehappy.com/">upgrade your browser</a> to improve your experience and security.</p>
<![endif]-->
<!-- Preloder start -->
<div id="preloader">
<div class="sk-three-bounce">
<div class="sk-child sk-bounce1"></div>
<div class="sk-child sk-bounce2"></div>
<div class="sk-child sk-bounce3"></div>
</div>
</div>
<!-- Preloder start -->
<!-- Backtotop start -->
<div class="backtotop-wrap cursor-pointer ">
<svg class="backtotop-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
<path d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
</svg>
</div>
<!-- Backtotop end -->
<!-- Offcanvas area start -->
<div class="fix">
<div class="offcanvas__area">
<div class="offcanvas__wrapper">
<div class="offcanvas__content">
<div class="offcanvas__top d-flex justify-content-between align-items-center">
<div class="offcanvas__logo">
<a href="index.html">
<img src="assets/imgs/logo/logo-white.svg" alt="logo not found">
</a>
</div>
<div class="offcanvas__close">
<button class="offcanvas-close-icon animation--flip">
<span class="offcanvas-m-lines">
<span class="offcanvas-m-line line--1"></span><span class="offcanvas-m-line line--2"></span><span class="offcanvas-m-line line--3"></span>
</span>
</button>
</div>
</div>
<div class="mobile-menu fix"></div>
<div class="offcanvas__social">
<h3 class="offcanvas__title mb-20">Subscribe & Follow</h3>
<ul>
<li><a href="#"><i class="fab fa-facebook-f"></i></a></li>
<li><a href="#"><i class="fab fa-twitter"></i></a></li>
<li><a href="#"><i class="fab fa-youtube"></i></a></li>
<li><a href="#"><i class="fab fa-linkedin"></i></a></li>
</ul>
</div>
<div class="offcanvas__btn">
<div class="header__btn-wrap">
<a class="sub__btn sm" href="login.html">Log In</a>
<a class="bd-gradient-btn" href="contact.html">Get Started</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="offcanvas__overlay"></div>
<div class="offcanvas__overlay-white"></div>
<!-- Offcanvas area start -->
<!-- Header area start -->
<header>
<div class="header__area header-transparent header-common">
<div class="container">
<div class="mega__menu-wrapper p-relative">
<div class="header__main">
<div class="header__left">
<div class="header__logo">
<a href="index.html">
<img src="assets/imgs/logo/logo-white.svg" alt="logo not found">
</a>
</div>
</div>
<div class="header__middle">
<div class="mean__menu-wrapper d-none d-lg-block">
<div class="main-menu">
<div class="main-menu">
<nav id="mobile-menu">
<ul>
<li class="has-dropdown has-mega-menu">
<a href="javascript:void(0)">Demos</a>
<ul class="mega-menu">
<li>
<div class="home__menu-grid">
<div class="home__menu-item">
<div class="home__menu-thumb">
<img src="assets/imgs/menu/menu-home-1.jpg" alt="thumb not found">
<div class="home__menu__buttons">
<a class="bd-gradient-btn" href="online-banking.html">MULTI PAGE</a>
<a class="bd-gradient-btn" href="online-banking-one-page.html">ONE PAGE</a>
</div>
</div>
<h4 class="home__menu-title">Online Banking</h4>
</div>
<div class="home__menu-item">
<div class="home__menu-thumb">
<img src="assets/imgs/menu/menu-home-2.jpg" alt="thumb not found">
<div class="home__menu__buttons">
<a class="bd-gradient-btn" href="investment-management.html">MULTI PAGE</a>
<a class="bd-gradient-btn" href="investment-management-one-page.html">ONE PAGE</a>
</div>
</div>
<h4 class="home__menu-title">Investment Management</h4>
</div>
<div class="home__menu-item">
<div class="home__menu-thumb">
<img src="assets/imgs/menu/menu-home-3.jpg" alt="thumb not found">
<div class="home__menu__buttons">
<a class="bd-gradient-btn" href="personal-loan.html">MULTI PAGE</a>
<a class="bd-gradient-btn" href="personal-loan-one-page.html">ONE PAGE</a>
</div>
</div>
<h4 class="home__menu-title">Personal Loan</h4>
</div>
<div class="home__menu-item">
<div class="home__menu-thumb">
<img src="assets/imgs/menu/menu-home-4.jpg" alt="thumb not found">
<div class="home__menu__buttons">
<a class="bd-gradient-btn" href="insurance.html">MULTI PAGE</a>
<a class="bd-gradient-btn" href="insurance-one-page.html">ONE PAGE</a>
</div>
</div>
<h4 class="home__menu-title">Insurance</h4>
</div>
<div class="home__menu-item">
<div class="home__menu-thumb">
<img src="assets/imgs/menu/menu-home-5.jpg" alt="thumb not found">
<div class="home__menu__buttons">
<a class="bd-gradient-btn" href="wealth-management.html">MULTI PAGE</a>
<a class="bd-gradient-btn" href="wealth-management-one-page.html">ONE PAGE</a>
</div>
</div>
<h4 class="home__menu-title">Wealth Managment</h4>
</div>
<div class="home__menu-item">
<div class="home__menu-thumb">
<img src="assets/imgs/menu/menu-home-6.jpg" alt="thumb not found">
<div class="home__menu__buttons">
<a class="bd-gradient-btn" href="payment-solution.html">MULTI PAGE</a>
<a class="bd-gradient-btn" href="payment-solution-one-page.html">ONE PAGE</a>
</div>
</div>
<h4 class="home__menu-title">Payment Solution</h4>
</div>
<div class="home__menu-item">
<div class="home__menu-thumb">
<img src="assets/imgs/menu/menu-home-7.jpg" alt="thumb not found">
<div class="home__menu__buttons">
<a class="bd-gradient-btn" href="forex-trading.html">MULTI PAGE</a>
<a class="bd-gradient-btn" href="forex-trading-one-page.html">ONE PAGE</a>
</div>
</div>
<h4 class="home__menu-title">Forex Trading</h4>
</div>
<div class="home__menu-item">
<div class="home__menu-thumb">
<img src="assets/imgs/menu/menu-home-8.jpg" alt="thumb not found">
<div class="home__menu__buttons">
<a class="bd-gradient-btn" href="retirement-planning.html">MULTI PAGE</a>
<a class="bd-gradient-btn" href="retirement-planning-one-page.html">ONE PAGE</a>
</div>
</div>
<h4 class="home__menu-title">Retirement Planning</h4>
</div>
</div>
</li>
</ul>
</li>
<li class="has-dropdown has-mega-menu">
<a href="javascript:void(0)">Pages</a>
<ul class="mega-menu mega-menu-grid-4">
<li>
<a href="javasript:void(0);" class="mega-menu-title">Home Dark</a>
<ul>
<li><a href="online-banking.html">Online Banking</a></li>
<li><a href="investment-management.html">Investment Management</a></li>
<li><a href="personal-loan.html">Personal Loan</a></li>
<li><a href="insurance.html">Insurance</a></li>
<li><a href="wealth-management.html">Wealth Managment</a></li>
<li><a href="payment-solution.html">Payment Solution</a></li>
<li><a href="forex-trading.html">Forex Trading</a></li>
<li><a href="retirement-planning.html">Retirement Planning</a></li>
</ul>
</li>
<li>
<a href="javasript:void(0);" class="mega-menu-title">Home Light</a>
<ul>
<li><a href="online-banking-light.html">Online Banking</a></li>
<li><a href="investment-management-light.html">Investment Management</a></li>
<li><a href="personal-loan-light.html">Personal Loan</a></li>
<li><a href="insurance-light.html">Insurance</a></li>
<li><a href="wealth-management-light.html">Wealth Managment</a></li>
<li><a href="payment-solution-light.html">Payment Solution</a></li>
<li><a href="forex-trading-light.html">Forex Trading</a></li>
<li><a href="retirement-planning-light.html">Retirement Planning</a></li>
</ul>
</li>
<li>
<a href="javasript:void(0);" class="mega-menu-title">Page dark</a>
<ul>
<li><a href="about.html">About Us</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="service-details.html">Services Details</a></li>
<li><a href="pricing.html">Pricing</a></li>
<li><a href="blog.html">Blog</a></li>
<li><a href="blog-details.html">Blog Details</a></li>
<li><a href="error-page.html">Error Page</a></li>
<li><a href="login.html">Login</a></li>
<li><a href="register.html">Register</a></li>
<li><a href="forgot.html">Forgot Password</a></li>
<li><a href="privacy-policy.html">Privacy & Policy</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</li>
<li>
<a href="javasript:void(0);" class="mega-menu-title">Page Light</a>
<ul>
<li><a href="about-light.html">About Us</a></li>
<li><a href="services-light.html">Services</a></li>
<li><a href="service-details-light.html">Services Details</a></li>
<li><a href="pricing-light.html">Pricing</a></li>
<li><a href="blog-light.html">Blog</a></li>
<li><a href="blog-details-light.html">Blog Details</a></li>
<li><a href="error-page-light.html">Error Page</a></li>
<li><a href="login-light.html">Login</a></li>
<li><a href="register-light.html">Register</a></li>
<li><a href="forgot-light.html">Forgot Password</a></li>
<li><a href="privacy-policy-light.html">Privacy & Policy</a></li>
<li><a href="contact-light.html">Contact</a></li>
</ul>
</li>
</ul>
</li>
<li class="has-dropdown has-mega-menu">
<a href="javascript:void(0)">elements</a>
<ul class="mega-menu mega-menu-grid-3">
<li>
<a href="javasript:void(0);" class="mega-menu-title">elements Layout 1</a>
<ul>
<li><a href="style-guide.html">Style Guide</a></li>
<li><a href="elements-about.html">About Us</a></li>
<li><a href="elements-accordion.html">Accordion</a></li>
<li><a href="elements-advancetab.html">Advance Tab</a></li>
<li><a href="elements-brand.html">Brand</a></li>
<li><a href="elements-button.html">Button</a></li>
<li><a href="elements-team.html">Team</a></li>
</ul>
</li>
<li>
<a href="javasript:void(0);" class="mega-menu-title">elements Layout 2</a>
<ul>
<li><a href="elements-pricing.html">pricing</a></li>
<li><a href="elements-why-chose.html">why chose us</a></li>
<li><a href="elements-working-steps.html">Working steps</a></li>
<li><a href="elements-feedback.html">feedback</a></li>
<li><a href="elements-service.html">service</a></li>
<li><a href="elements-counter.html">counter</a></li>
<li><a href="elements-case.html">Use case</a></li>
</ul>
</li>
<li>
<a href="javasript:void(0);" class="mega-menu-title">elements Layout 3</a>
<ul>
<li><a href="elements-benefits.html">benefits</a></li>
<li><a href="elements-cta.html">Call To Action</a></li>
<li><a href="elements-our-offers.html">our Offers</a></li>
<li><a href="elements-features.html">Key features</a></li>
<li><a href="elements-form.html">form</a></li>
<li><a href="elements-footer.html">Footer Style</a></li>
<li><a href="#">More Coming</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a href="contact.html">Contact</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
</div>
<div class="header__right">
<div class="header__action d-flex align-items-center">
<div class="header__btn-wrap d-none d-xl-inline-flex">
<a class="sub__btn" href="login.html">Log In</a>
<a class="bd-gradient-btn" href="contact.html">Get Started</a>
</div>
<div class="header__hamburger ml-20 d-xl-none">
<div class="sidebar__toggle">
<a class="bar-icon" href="avascript:void(0)">
<span></span>
<span></span>
<span></span>
</a>
</div>
</div>
<!-- for wp -->
<div class="header__hamburger ml-20 d-none">
<button type="button" class="hamburger-btn offcanvas-open-btn">
<span>01</span>
<span>01</span>
<span>01</span>
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</header>
<!-- Header area end -->
<!-- Body glow start -->
<div class="glow__area">
<div class="body__color-glow"></div>
<div class="body__color-glow glow-2"></div>
</div>
<!-- Body glow end -->
<!-- Body main wrapper start -->
<main>
<!-- Breadcrumb area start -->
<div class="breadcrumb__area breadcrumb-space theme-bg-1 valign p-relative z-index-11 fix">
<div class="breadcrumb__glow">
<div class="glow-1"></div>
<div class="glow-2"></div>
</div>
<div class="round__shape">
<img src="assets/imgs/shapes/cercle.png" alt="image not found">
</div>
<div class="container">
<div class="row gy-50 align-items-center justify-content-between">
<div class="col-xxl-6 col-xl-6 col-lg-6">
<div class="breadcrumb__title-wraper">
<span class="section__subtitle-7 mb-20">Style Guide</span>
<h2 class="breadcrumb__title"> Crafting a Consistent and Engaging Online <span class="gradient-text-3">Experience</span></h2>
</div>
</div>
<div class="col-xxl-5 col-xl-5 col-lg-6">
<div class="breadcrumb__description">
<p class="mb-0">Lorem ipsum dolor sit amet consectetur adipiscing elit Ut et massa mi. Aliquam in hendrerit.</p>
</div>
</div>
</div>
</div>
</div>
<!-- Breadcrumb area end -->
<!-- Style- gride area start -->
<div class="style__guide-area section-space">
<div class="container">
<div class="row g-5">
<div class="col-xl-3 col-lg-4">
<div class="widget-sidebar bd-sticky-top">
<div class="content-item-content">
<div class="widget-details">
<nav class="onepagenav">
<ul class="mainmenu rbt-course-details-list-wrapper">
<li class="current"><a href="#colorPalette"><span>1. Color Palette</span></a></li>
<li><a href="#gradient"><span>2. Color Gradient</span></a></li>
<li><a href="#typography"><span>3. Typography</span></a></li>
<li><a href="#formElements"><span>4. Form Elements</span></a></li>
</ul>
</nav>
</div>
</div>
</div>
</div>
<div class="col-xl-8 col-lg-8">
<div class="guide__widget-box">
<div id="colorPalette" class="elements__area">
<div class="wrapper">
<h4 class="style__guide-title mb-20">Color Palette</h4>
<div class="row g-5">
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box bg-theme-primary"></div>
<div class="content mt-10">
<span class="color-box-title">#FB5141</span>
<h6 class="title mb--0">Primary Color</h6>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box bg-theme-secondary"></div>
<div class="content mt-10">
<span class="color-box-title">#FB5141</span>
<h6 class="title mb--0">Secondary Color</h6>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box bg-theme-tertiary"></div>
<div class="content mt-10">
<span class="color-box-title">#674AD9</span>
<h6 class="title mb--0">Tertiary Color</h6>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box bg-theme-quaternary"></div>
<div class="content mt-10">
<span class="color-box-title">#E540A3</span>
<h6 class="title mb--0">Quaternary Color</h6>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box theme-bg-1"></div>
<div class="content mt-10">
<span class="color-box-title">rgba(14, 10, 36, 1)</span>
<h6 class="title mb--0">theme-bg-1</h6>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box theme-bg-2"></div>
<div class="content mt-10">
<span class="color-box-title">rgba(6, 6, 6, 1)</span>
<h6 class="title mb--0">theme-bg-2</h6>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box theme-bg-3"></div>
<div class="content mt-10">
<span class="color-box-title">rgba(14, 10, 36, 0.5)</span>
<h6 class="title mb--0">theme-bg-3</h6>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box theme-bg-4"></div>
<div class="content mt-10">
<span class="color-box-title">rgba(18, 18, 18, 1)</span>
<h6 class="title mb--0">theme-bg-4</h6>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box theme-bg-5"></div>
<div class="content mt-10">
<span class="color-box-title">#121212</span>
<h6 class="title mb--0">theme-bg-5</h6>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box theme-bg-6"></div>
<div class="content mt-10">
<span class="color-box-title">rgba(255, 255, 255, 0.06)</span>
<h6 class="title mb--0">theme-bg-6</h6>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box theme-bg-7"></div>
<div class="content mt-10">
<span class="color-box-title">rgb(240, 235, 255)</span>
<h6 class="title mb--0">theme-bg-7</h6>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box theme-bg-8"></div>
<div class="content mt-10">
<span class="color-box-title">rgb(236, 235, 241)</span>
<h6 class="title mb--0">theme-bg-8</h6>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box theme-bg-9"></div>
<div class="content mt-10">
<span class="color-box-title">rgb(242, 242, 242)</span>
<h6 class="title mb--0">theme-bg-9</h6>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box theme-bg-10"></div>
<div class="content mt-10">
<span class="color-box-title">rgb(247, 247, 247)</span>
<h6 class="title mb--0">theme-bg-10</h6>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box white-bg"></div>
<div class="content mt-10">
<span class="color-box-title">#fff</span>
<h6 class="title mb--0">white-bg</h6>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box black-bg"></div>
<div class="content mt-10">
<span class="color-box-title">#000000 </span>
<h6 class="title mb--0">black-bg</h6>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="elements__devider">
<hr>
</div>
<div id="gradient" class="elements__area">
<div class="wrapper">
<h4 class="style__guide-title mb-20">Color Gradient</h4>
<div class="row g-5">
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box bg-gradient-1"></div>
<div class="content mt-10">
<h6 class="title mb--0">Gradient 1</h6>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box bg-gradient-2"></div>
<div class="content mt-10">
<h6 class="title mb--0">Gradient 2</h6>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box bg-gradient-3"></div>
<div class="content mt-10">
<h6 class="title mb--0">Gradient 3</h6>
</div>
</div>
</div>
<div class="col-xl-3 col-lg-4 col-md-6">
<div class="color-box-inner">
<div class="color-box bg-gradient-4"></div>
<div class="content mt-10">
<h6 class="title mb--0">Gradient 4</h6>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="elements__devider">
<hr>
</div>
<div id="typography" class="elements__area">
<div class="wrapper">
<h4 class="style__guide-title mb-20">Typography</h4>
<div class="row g-5">
<div class="col-lg-12">
<h1 class="mb-20">H1. Heading One</h1>
<h2 class="mb-20">H2. Heading Two</h2>
<h3 class="mb-20">H3. Heading Three</h3>
<h4 class="mb-20">H4. Heading Four</h4>
<h5 class="mb-20">H5. Heading Five</h5>
<h6 class="mb-20">H6. Heading Six</h6>
</div>
</div>
<div class="row mt-40">
<div class="section__guide">
<h4 class="style__guide-title mb-20">Heading Style</h4>
</div>
<div class="col-lg-12">
<div class="subtitle text-center">
<h2 class="section__title mb-15">Section Title</h2>
</div>
</div>
<div class="col-xl-auto col-lg-6 col-md-6 mt-30">
<div class="subtitle text-center">
<span class="section__subtitle uppercase">Section subtitle One</span>
</div>
</div>
<div class="col-xl-auto col-lg-6 col-md-6 mt-30">
<div class="subtitle text-center">
<span class="section__subtitle-2 uppercase">Section subtitle Two</span>
</div>
</div>
<div class="col-xl-auto col-lg-6 col-md-6 mt-30">
<div class="subtitle text-center">
<span class="section__subtitle-3 uppercase">Section subtitle Three</span>
</div>
</div>
<div class="col-xl-auto col-lg-6 col-md-6 mt-30">
<div class="subtitle text-center">
<span class="section__subtitle-4 uppercase">Section subtitle Four</span>
</div>
</div>
<div class="col-xl-auto col-lg-6 col-md-6 mt-30">
<div class="subtitle text-center">
<span class="section__subtitle-5 uppercase">Section subtitle Five</span>
</div>
</div>
<div class="col-xl-auto col-lg-6 col-md-6 mt-30">
<div class="subtitle text-center">
<span class="section__subtitle-6 uppercase">Section subtitle Six</span>
</div>
</div>
<div class="col-xl-auto col-lg-6 col-md-6 mt-30">
<div class="subtitle text-center">
<span class="section__subtitle-7 uppercase">Section subtitle seven</span>
</div>
</div>
<div class="col-xl-auto col-lg-6 col-md-6 mt-30">
<div class="subtitle text-center">
<h5 class="section__subtitle-8">
<span>Section subtitle Eight</span>
</h5>
</div>
</div>
</div>
</div>
</div>
<div class="elements__devider">
<hr>
</div>
<div id="formElements" class="elements__area">
<div class="wrapper">
<h4 class="style__guide-title mb-20">Form Elements</h4>
<div class="row g-5">
<div class="contact__input-wrapper">
<div class="row">
<div class="col-xxl-6 col-xl-6 col-lg-6">
<div class="login__input mb-25">
<input type="email" placeholder="hello@finwise.com">
</div>
</div>
<div class="col-xxl-6 col-xl-6 col-lg-6">
<div class="login__input mb-25">
<input type="password" placeholder="Enter your email">
</div>
</div>
<div class="col-lg-6">
<div class="contact__input-box">
<div class="contact__input-title">
<label for="cname">company name<span>*</span></label>
</div>
<div class="contact__input">
<input name="companyname" id="cname" type="text" placeholder="">
</div>
</div>
</div>
<div class="col-lg-6">
<div class="contact__input-box mb-20">
<div class="contact__input-title">
<label>select option<span>*</span></label>
</div>
<div class="contact__select">
<select>
<option>Select option One</option>
<option>Select option Two</option>
<option>Select option Three</option>
</select>
</div>
</div>
</div>
<div class="col-lg-12">
<div class="contact__input-box">
<div class="contact__input-title">
<label for="cname">Country (optional)<span>*</span></label>
</div>
<div class="contact__input">
<textarea name="message" placeholder="Your message"></textarea>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Style gride area end -->
<!-- Brand area start -->
<div class="brand__area-6 theme-bg-1 section-rounded-60 section-space">
<div class="container">
<div class="swiper brnad__active">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="brand__item text-center">
<div class="brand__thumb">
<img src="assets/imgs/brand/brand-01.png" alt="image not found">
</div>
</div>
</div>
<div class="swiper-slide">
<div class="brand__item text-center">
<div class="brand__thumb">
<img src="assets/imgs/brand/brand-02.png" alt="image not found">
</div>
</div>
</div>
<div class="swiper-slide">
<div class="brand__item text-center">
<div class="brand__thumb">
<img src="assets/imgs/brand/brand-03.png" alt="image not found">
</div>
</div>
</div>
<div class="swiper-slide">
<div class="brand__item text-center">
<div class="brand__thumb">
<img src="assets/imgs/brand/brand-04.png" alt="image not found">
</div>
</div>
</div>
<div class="swiper-slide">
<div class="brand__item text-center">
<div class="brand__thumb">
<img src="assets/imgs/brand/brand-05.png" alt="image not found">
</div>
</div>
</div>
<div class="swiper-slide">
<div class="brand__item text-center">
<div class="brand__thumb">
<img src="assets/imgs/brand/brand-06.png" alt="image not found">
</div>
</div>
</div>
<div class="swiper-slide">
<div class="brand__item text-center">
<div class="brand__thumb">
<img src="assets/imgs/brand/brand-02.png" alt="image not found">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Brand area end -->
</main>
<!-- Body main wrapper end -->
<!-- Footer area start -->
<footer>
<section class="footer__area-common">
<div class="container">
<div class="footer__main">
<div class="footer__grid">
<div class="footer__widget">
<div class="footer__logo mb-25">
<a href="index.html">
<img src="assets/imgs/logo/logo-white.svg" alt="logo not found">
</a>
</div>
<div class="footer__content">
<p>Lorem ipsum dolor am oledop consectetur adipisc.</p>
<div class="footer__social">
<a href="#"><i class="fa-brands fa-facebook"></i></a>
<a href="#"><i class="fa-brands fa-twitter"></i></a>
<a href="#"><i class="fa-brands fa-linkedin"></i></a>
<a href="#"><i class="fa-brands fa-youtube"></i></a>
</div>
</div>
</div>
<div class="footer__widget">
<div class="footer__widget-title">
<h5>Use Cases</h5>
</div>
<div class="footer__link">
<ul>
<li><a href="#">SaaS</a></li>
<li><a href="#">Online Business</a></li>
<li><a href="#">Creators</a></li>
<li><a href="#">E-Commerce</a></li>
<li><a href="#">Agencies</a></li>
<li><a href="#">Secure</a></li>
</ul>
</div>
</div>
<div class="footer__widget">
<div class="footer__widget-title">
<h5>Products</h5>
</div>
<div class="footer__link">
<ul>
<li><a href="#">Invoicing</a></li>
<li><a href="#">Office Hours</a></li>
<li><a href="#">Explore More</a></li>
<li><a href="#">Loan Type</a></li>
<li><a href="#">Calculate</a></li>
</ul>
</div>
</div>
<div class="footer__widget">
<div class="footer__widget-title">
<h5>Newsletter</h5>
</div>
<div class="footer__newsletter">
<p>For latest Update subscribe us!</p>
<form action="https://html.bdevs.net/finwise-prev/assets/mail.php" method="POST">
<div class="footer__newsletter-from mb-25">
<div class="footer__newsletter-input p-relative">
<input type="text" placeholder="Enter Email">
<button class="footer__round-btn" type="submit"><i class="fa-regular fa-angle-right"></i></button>
</div>
</div>
</form>
</div>
<div class="footer__short-info">
<div class="info-icon">
<span><i class="fa-solid fa-envelope"></i></span>
</div>
<div class="info-content">
<p><a href="https://html.bdevs.net/cdn-cgi/l/email-protection#b7dfd2dbdbd8f7d1ded9c0dec4d299d4d8da"><span class="__cf_email__" data-cfemail="d6beb3babab996b0bfb8a1bfa5b3f8b5b9bb">[email protected]</span></a></p>
</div>
</div>
</div>
</div>
</div>
<div class="footer__bottom">
<div class="footer__copyright">
<p>Copyright © 2023 <a href="#">Finwise</a></p>
</div>
<div class="footer__conditions">
<ul>
<li><a href="privacy-policy.html">Privacy Policy</a></li>
<li><a href="contact.html">Contact Us</a></li>
</ul>
</div>
</div>
</div>
</section>
</footer>
<!-- Footer area end -->
<!-- JS here -->
<script data-cfasync="false" src="../cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><script src="assets/js/vendor/jquery-3.6.0.min.js"></script>
<script src="assets/js/plugins/waypoints.min.js"></script>
<script src="assets/js/vendor/bootstrap.bundle.min.js"></script>
<script src="assets/js/plugins/meanmenu.min.js"></script>
<script src="assets/js/plugins/swiper.min.js"></script>
<script src="assets/js/plugins/slick.min.js"></script>
<script src="assets/js/plugins/wow.js"></script>
<script src="assets/js/vendor/magnific-popup.min.js"></script>
<script src="assets/js/vendor/type.js"></script>
<script src="assets/js/plugins/counterup.js"></script>
<script src="assets/js/plugins/nice-select.min.js"></script>
<script src="assets/js/vendor/jquery-ui.min.js"></script>
<script src="assets/js/plugins/parallax-scroll.js"></script>
<script src="assets/js/vendor/ajax-form.js"></script>
<script src="assets/js/main.js"></script>
</body>
</html>