Access_New/pages/demo-conference-speaker-details.html

361 lines
18 KiB
HTML
Raw Permalink Normal View History

2024-09-05 05:48:27 +00:00
<!doctype html>
<html class="no-js" lang="en">
<head>
<title>Crafto - The Multipurpose HTML5 Template</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="author" content="ThemeZaa">
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<meta name="description" content="Elevate your online presence with Crafto - a modern, versatile, multipurpose Bootstrap 5 responsive HTML5, SCSS template using highly creative 52+ ready demos.">
<link rel="shortcut icon" href="images/favicon.png">
<link rel="apple-touch-icon" href="images/apple-touch-icon-57x57.png">
<link rel="apple-touch-icon" sizes="72x72" href="images/apple-touch-icon-72x72.png">
<link rel="apple-touch-icon" sizes="114x114" href="images/apple-touch-icon-114x114.png">
<link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="css/vendors.min.css" />
<link rel="stylesheet" href="css/icon.min.css" />
<link rel="stylesheet" href="css/style.min.css" />
<link rel="stylesheet" href="css/responsive.min.css" />
<link rel="stylesheet" href="demos/conference/conference.css" />
</head>
<body data-mobile-nav-style="classic">
<header>
<nav class="navbar navbar-expand-lg bg-transparent disable-fixed">
<div class="container-fluid">
<div class="col-auto col-lg-2 me-lg-0 me-auto">
<a class="navbar-brand" href="demo-conference.html">
<img src="images/demo-conference-logo-white.png" data-at2x="images/demo-conference-logo-white@2x.png" alt class="default-logo">
<img src="images/demo-conference-logo-black.png" data-at2x="images/demo-conference-logo-black@2x.png" alt class="alt-logo">
<img src="images/demo-conference-logo-black.png" data-at2x="images/demo-conference-logo-black@2x.png" alt class="mobile-logo">
</a>
</div>
<div class="col-auto menu-order position-static">
<button class="navbar-toggler float-start" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-label="Toggle navigation">
<span class="navbar-toggler-line"></span>
<span class="navbar-toggler-line"></span>
<span class="navbar-toggler-line"></span>
<span class="navbar-toggler-line"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav alt-font ls-05px">
<li class="nav-item"><a href="demo-conference.html" class="nav-link">Home</a></li>
<li class="nav-item"><a href="demo-conference-about-event.html" class="nav-link">About event</a></li>
<li class="nav-item dropdown dropdown-with-icon">
<a href="demo-conference-speakers.html" class="nav-link">Speakers</a>
<i class="fa-solid fa-angle-down dropdown-toggle" id="navbarDropdownMenuLink" role="button" data-bs-toggle="dropdown" aria-expanded="false"></i>
<ul class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
<li>
<a href="demo-conference-speaker-details.html"><img src="images/avtar-29.jpg" alt>
<div class="submenu-icon-content">
<span>Michal ruheen</span>
<p>Economist speakers</p>
</div>
</a>
</li>
<li>
<a href="demo-conference-speaker-details.html"><img src="images/avtar-27.jpg" alt>
<div class="submenu-icon-content">
<span>Jessica dover</span>
<p>Geologist speakers</p>
</div>
</a>
</li>
<li>
<a href="demo-conference-speaker-details.html"><img src="images/avtar-25.jpg" alt>
<div class="submenu-icon-content">
<span>Matthew taylor</span>
<p>Psychologist speakers</p>
</div>
</a>
</li>
<li>
<a href="demo-conference-speaker-details.html"><img src="images/avtar-24.jpg" alt>
<div class="submenu-icon-content">
<span>Rodney stratton</span>
<p>Psychologist speakers</p>
</div>
</a>
</li>
<li>
<a href="demo-conference-speakers.html" class="btn btn-dark-gray btn-round-edge btn-box-shadow align-self-center text-center text-white">View all speakers</a>
</li>
</ul>
</li>
<li class="nav-item"><a href="demo-conference-schedule.html" class="nav-link">Schedule</a></li>
<li class="nav-item"><a href="demo-conference-gallery.html" class="nav-link">Gallery</a></li>
<li class="nav-item"><a href="demo-conference-pricing.html" class="nav-link">Pricing</a></li>
</ul>
</div>
</div>
<div class="col-auto col-lg-2 text-end xs-ps-0 xs-pe-0">
<div class="header-icon">
<div class="header-button"><a href="demo-conference-registration.html" class="btn btn-small text-transform-none btn-transparent-white-light border-1 left-icon btn-rounded fw-500"><i class="feather icon-feather-mail d-none d-xl-inline-block"></i>Registration</a></div>
</div>
</div>
</div>
</nav>
</header>
<section class="page-title-big-typography bg-dark-gray ipad-top-space-margin" data-parallax-background-ratio="0.5" style="background-image: url('images/demo-conference-page-bg.jpg')">
<div class="container">
<div class="row align-items-center justify-content-center extra-small-screen">
<div class="col-lg-8 text-center page-title-extra-large">
<h1 class="mb-0 text-white alt-font fw-600 ls-minus-5px">
<span class="d-block text-outline text-outline-width-2px text-outline-color-white" data-fancy-text="{ &quot;string&quot;: [&quot;Michal&quot;], &quot;duration&quot;: 500, &quot;delay&quot;: 0, &quot;speed&quot;: 50, &quot;clipPath&quot;: [&quot;inset(0 500px 0 0)&quot;, &quot;inset(0px -5px 0px 0px)&quot;], &quot;easing&quot;: &quot;easeOutCubic&quot; }"></span>
<span data-anime="{ &quot;opacity&quot;: [0, 1], &quot;easing&quot;: &quot;easeOutQuad&quot;, &quot;duration&quot;: 1000, &quot;delay&quot;: 300 }">ruheen</span>
</h1>
</div>
</div>
</div>
</section>
<section class="bg-midnight-blue pt-0 half-section d-none d-md-block">
<div class="container-fluid">
<div class="row">
<div class="p-0 overlap-section text-start ps-7">
<img src="images/demo-conference-02.png" alt class="animation-rotation">
</div>
</div>
</div>
</section>
<section class="bg-midnight-blue pt-0 sm-pt-50px position-relative">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-7 pe-70px lg-pe-30px md-pe-15px md-mb-50px">
<div class="row">
<div class="col-12 last-paragraph-no-margin mb-45px sm-mb-30px">
<h4 class="alt-font text-white">Speaker - <span class="fw-500 text-decoration-line-bottom-medium">Biography</span></h4>
<p class="mb-15px">Michal ruheen is a global researcher and thought leader focused on unlocking strengths, increasing performance, and pioneering the future of how people work. he is the author of two of the bestselling business books of all time.</p>
<p>Has two of harvard business review's most circulated, industry-changing cover articles, and his <span class="text-decoration-line-bottom text-white fw-500">strengths assessments have been</span> taken by over.</p>
</div>
<div class="col-12 mb-45px sm-mb-30px">
<span class="d-block fs-20 fw-500 alt-font text-white mb-15px">Education and qualifications</span>
<ul class="p-0 m-0 list-style-02">
<li class="pb-10px mb-10px border-bottom border-color-transparent-white-light">2002 - Bachelor passed, the city school of london</li>
<li class="pb-10px mb-10px border-bottom border-color-transparent-white-light">2004 - Master passed, oxford university, england</li>
<li class="pb-10px mb-10px border-bottom border-color-transparent-white-light">2006 - Member of business association, california</li>
<li>2008 - Member of international business association</li>
</ul>
</div>
<div class="col-12 mb-45px sm-mb-30px">
<span class="d-block fs-20 fw-500 alt-font text-white mb-30px">Speaking topics experience</span>
<div class="feature-box feature-box-left-icon-middle icon-with-text-style-08 overflow-hidden mb-30px">
<div class="feature-box-icon bg-base-color text-center border-radius-4px pt-20px pb-10px ps-20px pe-20px me-30px xs-me-20px">
<h2 class="alt-font text-white lh-46 fw-500 mb-0">20</h2>
<span class="text-white fs-16 fw-500 text-uppercase opacity-7 d-block position-relative">Years</span>
</div>
<div class="feature-box-content last-paragraph-no-margin">
<p>20 years of experience the many strands of place lorem ipsum dolor amet consectetur adipiscing elit sed eiusmod tempor incididunt labore et dolore magna liqua minim.</p>
</div>
</div>
<div class="row row-cols-1 row-cols-sm-2">
<div class="col">
<ul class="p-0 m-0 list-style-02">
<li><i class="fa-solid fa-check icon-very-small lh-32 text-white me-10px"></i>Business speakers</li>
<li><i class="fa-solid fa-check icon-very-small lh-32 text-white me-10px"></i>Communication skills</li>
<li><i class="fa-solid fa-check icon-very-small lh-32 text-white me-10px"></i>Employee engagement</li>
<li><i class="fa-solid fa-check icon-very-small lh-32 text-white me-10px"></i>Human resources</li>
</ul>
</div>
<div class="col">
<ul class="p-0 m-0 list-style-02">
<li><i class="fa-solid fa-check icon-very-small lh-32 text-white me-10px"></i>Leadership skills</li>
<li><i class="fa-solid fa-check icon-very-small lh-32 text-white me-10px"></i>Management skills</li>
<li><i class="fa-solid fa-check icon-very-small lh-32 text-white me-10px"></i>Peak performance</li>
<li><i class="fa-solid fa-check icon-very-small lh-32 text-white me-10px"></i>Personal growth</li>
</ul>
</div>
</div>
</div>
<div class="col-12">
<span class="d-block fs-20 fw-500 alt-font text-white mb-10px">Awards and achievements</span>
<p class="mb-35px">Lorem ipsum is simply dummy text of the printing and typesetting industry. lorem Ipsum has been the industry's standard dummy text.</p>
<div class="row row-cols-1 row-cols-lg-3 row-cols-sm-3 justify-content-center text-center icon-with-style-2 g-0 border-top border-start border-color-transparent-white-light">
<div class="col icon-with-text-style-04 transition-inner-all">
<div class="feature-box h-100 border-bottom border-end border-color-transparent-white-light sm-border-bottom p-15 xl-p-12 lg-p-7">
<div class="feature-box-icon mb-15px">
<img src="images/demo-conference-awards-01.png" alt class="w-110px">
</div>
<div class="feature-box-content">
<span class="text-white lh-26 mx-auto">Executive speaker<span class="fw-500 d-block lh-20">2018</span></span>
</div>
</div>
</div>
<div class="col icon-with-text-style-04 transition-inner-all">
<div class="feature-box h-100 border-bottom border-end border-color-transparent-white-light sm-border-bottomp-15 p-15 xl-p-12 lg-p-7">
<div class="feature-box-icon mb-15px">
<img src="images/demo-conference-awards-02.png" alt class="w-110px">
</div>
<div class="feature-box-content">
<span class="text-white lh-26 mx-auto">Super speaker<span class="fw-500 d-block lh-20">2019</span></span>
</div>
</div>
</div>
<div class="col icon-with-text-style-04 transition-inner-all">
<div class="feature-box h-100 border-bottom border-end border-color-transparent-white-light sm-border-bottom p-15 xl-p-12 lg-p-7">
<div class="feature-box-icon mb-15px">
<img src="images/demo-conference-awards-03.png" alt class="w-110px">
</div>
<div class="feature-box-content">
<span class="text-white lh-26 mx-auto">Great speaker<span class="fw-500 d-block lh-20">2021</span></span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<aside class="col-lg-5 text-center last-paragraph-no-margin">
<div class="bg-dark-midnight-blue position-sticky top-60px border-radius-6px overflow-hidden">
<div class="text-center team-style-03 mb-30px">
<div class="fs-13 fw-600 text-dark-gray lh-32 position-absolute top-25px right-25px border-radius-30px bg-yellow ps-15px pe-15px"><i class="fa-solid fa-star me-5px"></i>4.9</div>
<img src="images/demo-lawyer-team-details-team.jpg" class="w-100 mb-35px d-block" alt>
<div class="ps-30px pe-30px">
<h5 class="alt-font fw-500 text-white mb-0">Michal ruheen</h5>
<div class="fs-16 fw-600 text-base-color mb-15px text-uppercase">Economist speakers</div>
<p class="w-90 lg-w-100 mx-auto mb-20px">20 years of experience the many strands of place lorem ipsum dolor consectetur.</p>
<div class="social-icon">
<a href="https://www.facebook.com/" target="_blank" class="text-white"><i class="fa-brands fa-facebook-f icon-small"></i></a>
<a href="http://www.dribbble.com" target="_blank" class="text-white"><i class="fa-brands fa-dribbble icon-small"></i></a>
<a href="https://www.twitter.com/" target="_blank" class="text-white"><i class="fa-brands fa-twitter icon-small"></i></a>
<a href="https://www.instagram.com/" target="_blank" class="text-white"><i class="fa-brands fa-instagram icon-small"></i></a>
</div>
</div>
</div>
<div class="row justify-content-center align-items-center border-top border-color-transparent-white-light pt-10px pb-10px m-0">
<div class="col-auto icon-with-text-style-08 mt-10px mb-10px">
<div class="feature-box feature-box-left-icon-middle">
<div class="feature-box-icon feature-box-icon-rounded box-shadow overflow-visible bg-white w-45px h-45px rounded-circle me-15px">
<i class="feather icon-feather-phone-outgoing fs-16 text-dark-gray"></i>
</div>
<div class="feature-box-content last-paragraph-no-margin">
<a href="tel:1234567890" class="text-white">123 456 7890</a>
</div>
</div>
</div>
<div class="col-auto icon-with-text-style-08 mt-10px mb-10px">
<div class="feature-box feature-box-left-icon-middle">
<div class="feature-box-icon feature-box-icon-rounded box-shadow bg-white overflow-visible w-45px h-45px rounded-circle me-15px">
<i class="feather icon-feather-mail fs-16 text-dark-gray"></i>
</div>
<div class="feature-box-content last-paragraph-no-margin">
<a class="text-white" href="cdn-cgi/l/email-protection.html#82ebece4edc2e6edefe3ebecace1edef"><span class="__cf_email__" data-cfemail="9ef7f0f8f1defaf1f3fff7f0b0fdf1f3">[email&#160;protected]</span></a>
</div>
</div>
</div>
</div>
<a href="demo-conference-registration.html" class="btn btn-base-color btn-box-shadow btn-hover-animation-switch btn-extra-large text-white w-100 vertical-white-move">
<span>
<span class="btn-text">Contact with speakers</span>
<span class="btn-icon"><i class="feather icon-feather-arrow-right"></i></span>
<span class="btn-icon"><i class="feather icon-feather-arrow-right"></i></span>
</span>
</a>
</div>
</aside>
</div>
</div>
</section>
<footer class="bg-dark-midnight-blue background-position-right-top background-no-repeat md-background-image-none" style="background-image: url('images/demo-conference-about-bg.png')">
<div class="container">
<div class="row justify-content-center text-center text-sm-start">
<div class="col-lg-3 col-sm-6 md-mb-35px">
<span class="alt-font d-block text-white mb-10px fs-20"><i class="feather icon-feather-map-pin align-text-bottom icon-extra-medium text-base-color me-10px"></i>Venue infos</span>
<p class="w-80 lg-w-100 md-w-70 sm-w-90 xs-w-100 mb-5px">401 Broadway, 24th Floor New York, NY 10013</p>
<a href="demo-conference-speaker-details.html#" class="text-decoration-line-bottom text-uppercase fs-15 alt-font fw-500">Get directions</a>
</div>
<div class="col-lg-3 col-sm-6 md-mb-35px">
<span class="alt-font d-block text-white mb-10px fs-20"><i class="feather icon-feather-phone-call align-text-bottom icon-extra-medium text-base-color me-10px"></i>Contact us</span>
<a href="cdn-cgi/l/email-protection.html#4b22252d240b32243e392f24262a222565282426"><span class="__cf_email__" data-cfemail="1970777f765960766c6b7d7674787077377a7674">[email&#160;protected]</span></a><br>
<a href="tel:1800222000" class="mb-5px d-inline-block">1-800-222-000</a><br>
<a href="demo-conference-speaker-details.html#" class="text-decoration-line-bottom text-uppercase fs-15 alt-font fw-500">Call to event</a>
</div>
<div class="col-lg-3 col-sm-6 xs-mb-35px">
<span class="alt-font d-block text-white mb-10px fs-20"><i class="feather icon-feather-home align-text-bottom icon-extra-medium text-base-color me-10px"></i>Hotel details</span>
<p class="w-85 lg-w-100 md-w-70 sm-w-90 xs-w-100 mb-5px">27 Eden walk eden centre, New York, NY 10013</p>
<a href="demo-conference-speaker-details.html#" class="text-decoration-line-bottom text-uppercase fs-15 alt-font fw-500">Reserve a hotel</a>
</div>
<div class="col-lg-3 col-sm-6">
<span class="alt-font d-block text-white mb-10px fs-20"><i class="feather icon-feather-send align-text-bottom icon-extra-medium text-base-color me-10px"></i>Newsletter signup</span>
<p class="mb-25px sm-mb-20px">Don't miss this amazing events</p>
<div class="d-inline-block w-100 newsletter-style-01 position-relative">
<form action="email-templates/subscribe-newsletter.php" method="post">
<input class="bg-white input-small border-color-white form-control required" name="email" placeholder="Enter your email" type="email">
<input type="hidden" name="redirect" value>
<button class="btn btn-small btn-base-color ps-15px pe-15px base-color-hover submit" aria-label="submit"><i class="feather icon-feather-mail m-0 align-middle icon-small text-white"></i></button>
<div class="form-results border-radius-4px mt-15px pt-10px pb-10px ps-15px pe-15px fs-15 w-100 text-center position-absolute d-none"></div>
</form>
</div>
</div>
</div>
<div class="row align-items-center pt-6 md-pt-50px">
<div class="col-lg-3 col-sm-6 text-center text-sm-start">
<a href="demo-conference.html" class="footer-logo d-inline-block"><img src="images/demo-conference-logo-white.png" data-at2x="images/demo-conference-logo-white@2x.png" alt></a>
</div>
<div class="col-lg-6 order-1 order-sm-3 order-lg-1 md-mt-15px">
<ul class="footer-navbar alt-font text-center lh-normal">
<li class="nav-item"><a href="demo-conference-about-event.html" class="nav-link">About event</a></li>
<li class="nav-item"><a href="demo-conference-speakers.html" class="nav-link">Speakers</a></li>
<li class="nav-item"><a href="demo-conference-schedule.html" class="nav-link">Schedule</a></li>
<li class="nav-item"><a href="demo-conference-gallery.html" class="nav-link">Gallery</a></li>
<li class="nav-item"><a href="demo-conference-pricing.html" class="nav-link">Pricing</a></li>
</ul>
</div>
<div class="col-lg-3 col-sm-6 order-3 order-sm-2 order-lg-3 text-center text-sm-end xs-mt-10px last-paragraph-no-margin">
<p>&COPY; Copyright 2024 <a href="index.html" target="_blank" class="text-decoration-line-bottom text-white">Crafto</a></p>
</div>
</div>
</div>
</footer>
<div class="scroll-progress d-none d-xxl-block">
<a href="demo-conference-speaker-details.html#" class="scroll-top" aria-label="scroll">
<span class="scroll-text">Scroll</span><span class="scroll-line"><span class="scroll-point"></span></span>
</a>
</div>
<script data-cfasync="false" src="cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/vendors.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
</body>
</html>