| Server IP : 104.21.21.239 / Your IP : 216.73.216.11 Web Server : Apache/2.4.68 (Amazon Linux) OpenSSL/3.5.5 System : Linux ip-172-31-69-123.ec2.internal 6.1.176-223.369.amzn2023.x86_64 #1 SMP PREEMPT_DYNAMIC Fri Jul 24 13:34:27 UTC 2026 x86_64 User : ec2-user ( 1000) PHP Version : 8.4.23 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : OFF | Sudo : ON | Pkexec : ON Directory : /home/home2/domains/nycyouth/Package-HTML/Canvas 7 Files/ |
Upload File : |
<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta http-equiv="x-ua-compatible" content="IE=edge">
<meta name="author" content="SemiColonWeb">
<meta name="description" content="Get Canvas to build powerful websites easily with the Highly Customizable & Best Selling Bootstrap Template, today.">
<!-- Font Imports -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Source+Sans+Pro:ital,wght@0,300;0,400;0,600;0,700;0,900;1,400&family=Playfair+Display:wght@400;700&display=swap" rel="stylesheet">
<!-- Core Style -->
<link rel="stylesheet" href="style.css">
<!-- Font Icons -->
<link rel="stylesheet" href="css/font-icons.css">
<!-- Niche Demos -->
<link rel="stylesheet" href="demos/resume/resume.css">
<!-- Custom CSS -->
<link rel="stylesheet" href="css/custom.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Document Title
============================================= -->
<title>Resume | Canvas</title>
<style>
.device-touch .position-fixed {
background-attachment: scroll !important;
}
</style>
</head>
<body class="stretched">
<!-- Document Wrapper
============================================= -->
<div id="wrapper">
<!-- Header
============================================= -->
<header id="header" class="transparent-header sticky-transparent" data-sticky-shrink="false">
<div id="header-wrap">
<div class="container">
<div class="header-row">
<!-- Logo
============================================= -->
<div id="logo">
<a href="demo-resume.html" class="font-secondary ls-3" style="line-height: 90px;">canvas</a>
</div><!-- #logo end -->
<div class="primary-menu-trigger">
<button class="cnvs-hamburger" type="button" title="Open Mobile Menu">
<span class="cnvs-hamburger-box"><span class="cnvs-hamburger-inner"></span></span>
</button>
</div>
<!-- Primary Navigation
============================================= -->
<nav class="primary-menu">
<ul class="menu-container one-page-menu custom-spacing" data-easing="easeInOutExpo" data-speed="1250" data-offset="0">
<li class="menu-item current"><a class="menu-link" href="#" data-href="#wrapper"><i class="bi-house"></i><div>Intro</div></a></li>
<li class="menu-item"><a class="menu-link" href="#" data-href="#section-skills"><i class="bi-star"></i><div>Skills</div></a></li>
<li class="menu-item"><a class="menu-link" href="#" data-href="#section-about"><i class="bi-person"></i><div>About</div></a></li>
<li class="menu-item"><a class="menu-link" href="#" data-href="#section-works"><i class="bi-grid"></i><div>Portfolio</div></a></li>
<li class="menu-item"><a class="menu-link" href="#" data-href="#section-articles"><i class="bi-pencil"></i><div>Articles</div></a></li>
<li class="menu-item"><a class="menu-link" href="#" data-href="#footer"><i class="bi-envelope"></i><div>Contact</div></a></li>
</ul>
</nav><!-- #primary-menu end -->
</div>
</div>
</div>
<div class="header-wrap-clone"></div>
</header><!-- #header end -->
<section id="slider" class="slider-element min-vh-60 min-vh-md-100 include-header">
<div class="vh-100 vw-100 position-fixed" style="top: 0; left: 0; background: #FFF url('demos/resume/images/hero-image/1.jpg') no-repeat top center; background-size: cover; background-attachment: fixed;">
<div class="container">
<div class="slider-caption dark slider-caption-right">
<div>
<h2 class="font-primary ls-5" data-animate="fadeIn">Pliff Jenkins</h2>
<p class="fw-light ls-1 d-none d-sm-block" data-animate="fadeIn" data-delay="400">Simple Design Methodology.<br>Melbourne, Australia.</p>
<a class="font-primary border-0 ls-1 mt-4 inline-block more-link text-white dark d-none d-sm-inline-block" data-animate="fadeIn" data-delay="800" data-scrollto="#section-works" data-offset="0" href="#"><u>My Works</u> →</a>
</div>
</div>
</div>
</div>
<div class="vh-100 vw-100 position-fixed blurred-img" style="top: 0; left: 0; background: #FFF url('demos/resume/images/hero-image/1.jpg') no-repeat top center; background-size: cover; background-attachment: fixed;"></div>
</section>
<!-- Content
============================================= -->
<section id="content" class="bg-transparent">
<div class="content-wrap pb-0 bg-transparent">
<div id="section-skills" class="section m-0 page-section dark bg-transparent" style="padding-bottom: 50px">
<div class="container">
<div class="heading-block text-center">
<h2 class="font-secondary">My Experiments.</h2>
</div>
<div class="row justify-content-center col-mb-50 mb-0">
<div class="col-sm-6 col-lg-4">
<div class="feature-box fbox-plain">
<div class="fbox-icon">
<a href="#"><i class="fa-brands fa-html5" style="color: #DDD"></i></a>
</div>
<div class="fbox-content">
<h3 class="fw-normal ls-2" style="color: #FFF">HTML5</h3>
<p style="color:#AAA;">Powerful Layout with Responsive functionality that can be adapted to any screen size.</p>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4">
<div class="feature-box fbox-plain">
<div class="fbox-icon">
<a href="#"><i class="bi-braces" style="color: #DDD"></i></a>
</div>
<div class="fbox-content">
<h3 class="fw-normal ls-2" style="color: #FFF">Javascripts</h3>
<p style="color:#AAA;">Looks beautiful & ultra-sharp on Retina Displays with Retina Icons, Fonts & Images.</p>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4">
<div class="feature-box fbox-plain">
<div class="fbox-icon">
<a href="#"><i class="uil uil-images" style="color: #DDD"></i></a>
</div>
<div class="fbox-content">
<h3 class="fw-normal ls-2" style="color: #FFF">Photoshop</h3>
<p style="color:#AAA;">Optimized code that are completely customizable and deliver unmatched fast performance.</p>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4">
<div class="feature-box fbox-plain">
<div class="fbox-icon">
<a href="#"><i class="fa-brands fa-wordpress" style="color: #DDD"></i></a>
</div>
<div class="fbox-content">
<h3 class="fw-normal ls-2" style="color: #FFF">Wordpress</h3>
<p style="color:#AAA;">Canvas provides support for Native HTML5 Videos that can be added to a Full Width Background.</p>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4">
<div class="feature-box fbox-plain">
<div class="fbox-icon">
<a href="#"><i class="bi-mouse" style="color: #DDD"></i></a>
</div>
<div class="fbox-content">
<h3 class="fw-normal ls-2" style="color: #FFF">Joomla</h3>
<p style="color:#AAA;">Display your Content attractively using Parallax Sections that have unlimited customizable areas.</p>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4">
<div class="feature-box fbox-plain">
<div class="fbox-icon">
<a href="#"><i class="bi-pencil" style="color: #DDD"></i></a>
</div>
<div class="fbox-content">
<h3 class="fw-normal ls-2" style="color: #FFF">Illustrator</h3>
<p style="color:#AAA;">Complete control on each & every element that provides endless customization possibilities.</p>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4">
<div class="feature-box fbox-plain">
<div class="fbox-icon">
<a href="#"><i class="fa-brands fa-css3" style="color: #DDD"></i></a>
</div>
<div class="fbox-content">
<h3 class="fw-normal ls-2" style="color: #FFF">CSS3</h3>
<p style="color:#AAA;">Change your Website's Primary Scheme instantly by simply adding the dark class to the body.</p>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4">
<div class="feature-box fbox-plain">
<div class="fbox-icon">
<a href="#"><i class="bi-subscript" style="color: #DDD"></i></a>
</div>
<div class="fbox-content">
<h3 class="fw-normal ls-2" style="color: #FFF">PHP</h3>
<p style="color:#AAA;">Stretch your Website to the Full Width or make it boxed to surprise your visitors.</p>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-4">
<div class="feature-box fbox-plain">
<div class="fbox-icon">
<a href="#"><i class="uil uil-search" style="color: #DDD"></i></a>
</div>
<div class="fbox-content">
<h3 class="fw-normal ls-2" style="color: #FFF">Seo</h3>
<p style="color:#AAA;">We have covered each & everything in our Documentation including Videos & Screenshots.</p>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="section-about" class="section page-section m-0" style="background: #EEE url('demos/resume/images/sections/1.jpg') no-repeat center center; background-size: cover; padding: 100px 0">
<div class="container">
<div class="row">
<div class="col-md-5 offset-md-7">
<div class="heading-block">
<h2 class="font-secondary">About Me.</h2>
<span>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Praesentium reprehenderit inventore beatae velit quae labore sunt in possimus. Mollitia, culpa?</span>
</div>
<table class="table">
<tbody>
<tr>
<td class="border-top-0"><strong>Name:</strong></td>
<td class="border-top-0">SemiColonWeb</td>
</tr>
<tr>
<td><strong>Gender:</strong></td>
<td>Male</td>
</tr>
<tr>
<td><strong>Email:</strong></td>
<td>[email protected]</td>
</tr>
<tr>
<td><strong>Phone:</strong></td>
<td>+1 111 222 33</td>
</tr>
<tr>
<td><strong>Website:</strong></td>
<td>semicolonweb.com</td>
</tr>
<tr>
<td><strong>DOB:</strong></td>
<td>6th September 1986</td>
</tr>
<tr>
<td><strong>Nationality:</strong></td>
<td>Australian</td>
</tr>
</tbody>
</table>
<a href="#" class="button button-large button-border button-black button-dark ms-0"><i class="bi-cloud-download"></i> Download CV</a>
</div>
</div>
</div>
<div class="video-wrap">
<div class="video-overlay d-sm-block d-md-none" style="background: rgba(255,255,255,0.9);"></div>
</div>
</div>
<div class="section m-0 skill-area bg-color dark" style="padding: 80px 0;">
<div class="container">
<div class="row">
<div class="col-lg-4 col-md-6">
<h4>Education</h4>
<div class="skill-info">
<span>
School of Graphic Design<br>
Bachelor’s degree<br>
2010 – 2013
</span>
<span>
Forest Lake High School<br>
Degree in Computer Science<br>
2007 – 2010
</span>
<span>
Desert Sands Conservatory<br>
Arts School<br>
2007
</span>
</div>
</div>
<div class="w-100 mb-5 d-block d-md-none"></div>
<div class="col-lg-4 col-md-6">
<h4>Experience</h4>
<div class="skill-info">
<span>
2021 - Today<br>
Website Development
</span>
<span>
2021 - 2012<br>
Senior Frontend Developer<br>
Full Time Job
</span>
<span>
2021 - 2012<br>
Graphic Design Company<br>
</span>
</div>
</div>
<div class="w-100 mb-5 d-block d-lg-none clear"></div>
<div class="col-lg-4 col-12">
<h4>Skills</h4>
<div class="skill-progress" data-percent="80" data-speed="1000" style="--cnvs-progress-height: 0.25rem; --cnvs-progress-color: #FFF; --cnvs-progress-trackcolor: rgba(255,255,255,0.3);">
<div class="skill-progress-title mb-2">
<h5 class="fw-light text-uppercase ls-2">WordPress</h5>
<div class="badge bg-white bg-opacity-10">
<div class="counter counter-inherit counter-instant"><span data-from="0" data-to="80" data-refresh-interval="30" data-speed="1000">0</span>%</div>
</div>
</div>
<div class="skill-progress-bar">
<div class="skill-progress-percent"></div>
</div>
</div>
<div class="skill-progress" data-percent="60" data-speed="1000" style="--cnvs-progress-height: 0.25rem; --cnvs-progress-color: #FFF; --cnvs-progress-trackcolor: rgba(255,255,255,0.3);">
<div class="skill-progress-title mb-2">
<h5 class="fw-light text-uppercase ls-2">CSS3</h5>
<div class="badge bg-white bg-opacity-10">
<div class="counter counter-inherit counter-instant"><span data-from="0" data-to="60" data-refresh-interval="30" data-speed="1000">0</span>%</div>
</div>
</div>
<div class="skill-progress-bar">
<div class="skill-progress-percent"></div>
</div>
</div>
<div class="skill-progress" data-percent="90" data-speed="1000" style="--cnvs-progress-height: 0.25rem; --cnvs-progress-color: #FFF; --cnvs-progress-trackcolor: rgba(255,255,255,0.3);">
<div class="skill-progress-title mb-2">
<h5 class="fw-light text-uppercase ls-2">HTML5</h5>
<div class="badge bg-white bg-opacity-10">
<div class="counter counter-inherit counter-instant"><span data-from="0" data-to="90" data-refresh-interval="30" data-speed="1000">0</span>%</div>
</div>
</div>
<div class="skill-progress-bar">
<div class="skill-progress-percent"></div>
</div>
</div>
<div class="skill-progress" data-percent="70" data-speed="1000" style="--cnvs-progress-height: 0.25rem; --cnvs-progress-color: #FFF; --cnvs-progress-trackcolor: rgba(255,255,255,0.3);">
<div class="skill-progress-title mb-2">
<h5 class="fw-light text-uppercase ls-2">Javascript</h5>
<div class="badge bg-white bg-opacity-10">
<div class="counter counter-inherit counter-instant"><span data-from="0" data-to="70" data-refresh-interval="30" data-speed="1000">0</span>%</div>
</div>
</div>
<div class="skill-progress-bar">
<div class="skill-progress-percent"></div>
</div>
</div>
<div class="skill-progress" data-percent="52" data-speed="1000" style="--cnvs-progress-height: 0.25rem; --cnvs-progress-color: #FFF; --cnvs-progress-trackcolor: rgba(255,255,255,0.3);">
<div class="skill-progress-title mb-2">
<h5 class="fw-light text-uppercase ls-2">Ruby</h5>
<div class="badge bg-white bg-opacity-10">
<div class="counter counter-inherit counter-instant"><span data-from="0" data-to="52" data-refresh-interval="30" data-speed="1000">0</span>%</div>
</div>
</div>
<div class="skill-progress-bar">
<div class="skill-progress-percent"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="section-works" class="section page-section m-0" style="background: #EEE url('demos/resume/images/sections/2.jpg') no-repeat center right; background-size: cover; padding: 100px 0">
<div class="container">
<div class="row">
<div class="col-lg-5 offset-lg-1">
<div class="heading-block">
<h2 class="font-secondary">Latest Works.</h2>
<span class="mt-0">Lorem ipsum dolor sit amet.</span>
</div>
<div class="row">
<div class="col-md-6">
<ul class="niche-demos-lists mb-0 lists-1">
<li class="mt-0"><a href="demo-restaurant.html"><img src="images/intro/niche/restaurant.jpg" alt="Image">Restaurant Demo</a></li>
<li><a href="demo-photography.html"><img src="images/intro/niche/photography.jpg" alt="Image">Photography</a></li>
<li><a href="demo-medical.html"><img src="images/intro/niche/medical.jpg" alt="Image">Medical</a></li>
<li><a href="demo-spa.html"><img src="images/intro/niche/spa.jpg" alt="Image">Spa</a></li>
<li><a href="demo-coffee.html"><img src="images/intro/niche/coffee.jpg" alt="Image">Coffee</a></li>
<li><a href="demo-interior-design.html"><img src="images/intro/niche/interior-design.jpg" alt="Image">Interior Design</a></li>
<li><a href="demo-barber.html"><img src="images/intro/niche/barber.jpg" alt="Image">Barber</a></li>
</ul>
</div>
<div class="col-md-6">
<ul class="niche-demos-lists mb-0 lists-2">
<li><a href="demo-travel.html"><img src="images/intro/niche/travel.jpg" alt="Image">Travel</a></li>
<li><a href="demo-media-agency.html"><img src="images/intro/niche/media-agency.jpg" alt="Image">Media Agency</a></li>
<li><a href="demo-construction.html"><img src="images/intro/niche/construction.jpg" alt="Image">Construction</a></li>
<li><a href="demo-writer.html"><img src="images/intro/niche/writer.jpg" alt="Image">Writer</a></li>
<li><a href="demo-real-estate.html"><img src="images/intro/niche/real-estate/1.jpg" alt="Image">Real Estate</a></li>
<li><a href="demo-business.html"><img src="images/intro/niche/business.jpg" alt="Image">Business</a></li>
<li><a href="demo-app-landing.html"><img src="images/intro/niche/app-landing.jpg" alt="Image">App Landing</a></li>
</ul>
</div>
</div>
<a href="#" class="button button-large button-border button-black button-dark mt-4 ms-0"><i class="uil uil-images"></i> See More Works</a>
</div>
</div>
</div>
<div class="video-wrap">
<div class="video-overlay d-block d-xl-none" style="background: rgba(255,255,255,0.9);"></div>
</div>
</div>
<div id="section-articles" class="section page-section m-0 bg-color" style="padding: 100px 0">
<div class="container">
<div class="dark">
<div class="heading-block">
<h2 class="font-secondary">Latest Articles.</h2>
<span class="mt-0">Lorem ipsum dolor sit amet.</span>
</div>
</div>
<div id="posts" class="post-grid row gutter-30 mb-0" data-layout="fitRows">
<div class="entry col-md-6 col-lg-4">
<div class="grid-inner">
<div class="entry-box-shadow">
<div class="entry-image mb-0">
<a href="images/blog/full/17.jpg" data-lightbox="image"><img src="demos/resume/images/blog/1.jpg" alt="Standard Post with Image"></a>
</div>
<div class="entry-meta-wrapper">
<div class="entry-meta my-0">
<a href="#" class="text-muted">March 25th, 2021</a>
</div>
<div class="entry-title mt-1">
<h2><a href="#">You can now listen to headphones.</a></h2>
</div>
<div class="entry-content mt-4">
<p class="mb-0">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione, voluptatem, dolorem animi nisi autem blanditiis enim culpa reiciendis et explicabo tenetur...</p>
</div>
</div>
</div>
</div>
</div>
<div class="entry col-md-6 col-lg-4">
<div class="grid-inner">
<div class="entry-box-shadow">
<div class="entry-image mb-0">
<a href="images/blog/full/17.jpg" data-lightbox="image"><img src="demos/resume/images/blog/2.jpg" alt="Standard Post with Image"></a>
</div>
<div class="entry-meta-wrapper">
<div class="entry-meta my-0">
<a href="#" class="text-muted">March 25th, 2021</a>
</div>
<div class="entry-title mt-1">
<h2><a href="#">Collaboratively monetize multifunctional.</a></h2>
</div>
<div class="entry-content mt-4">
<p class="mb-0">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione, voluptatem, dolorem animi nisi autem blanditiis enim culpa reiciendis et explicabo tenetur...</p>
</div>
</div>
</div>
</div>
</div>
<div class="entry col-md-6 col-lg-4">
<div class="grid-inner">
<div class="entry-box-shadow">
<div class="entry-image mb-0">
<a href="images/blog/full/17.jpg" data-lightbox="image"><img src="demos/resume/images/blog/3.jpg" alt="Standard Post with Image"></a>
</div>
<div class="entry-meta-wrapper">
<div class="entry-meta my-0">
<a href="#" class="text-muted">March 25th, 2021</a>
</div>
<div class="entry-title mt-1">
<h2><a href="#">Professionally disinter-mediate excellent.</a></h2>
</div>
<div class="entry-content mt-4">
<p class="mb-0">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ratione, voluptatem, dolorem animi nisi autem blanditiis enim culpa reiciendis et explicabo tenetur...</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section><!-- #content end -->
<!-- Footer
============================================= -->
<footer id="footer" class="page-section dark border-0 p-0" style="background-color: #1C1C1C;">
<div class="container">
<!-- Footer Widgets
============================================= -->
<div class="footer-widgets-wrap" style="padding: 80px 0">
<div class="row col-mb-50">
<div class="col-lg-3">
<div class="footer-logo"><span class="fw-normal color ls-1" style="font-size: 22px; ">SemiColonWeb.</span><br><small class="ls-3 text-uppercase" style="color: rgba(255,255,255,0.2);">© 2023 Reserved.</small></div>
</div>
<div class="col-lg-9">
<div class="row col-mb-50">
<div class="col-sm-6 col-md-4">
<div class="widget">
<h4>Contact Us</h4>
<div class="footer-content">
<abbr title="Phone Number"><strong>Phone:</strong></abbr> (1) 8547 632521<br>
<abbr title="Fax"><strong>Fax:</strong></abbr> (1) 11 4752 1433<br>
<abbr title="Email Address"><strong>Email:</strong></abbr> [email protected]
</div>
</div>
</div>
<div class="col-sm-6 col-md-4">
<div class="widget">
<h4>Location</h4>
<div class="footer-content">
<address class="mb-0">
<strong>Headquarters:</strong><br>
795 Folsom Ave, Suite 600<br>
San Francisco, CA 94107<br>
</address>
</div>
</div>
</div>
<div class="col-sm-6 col-md-4">
<div class="widget">
<h4>Social</h4>
<div class="d-flex">
<a href="#" class="social-icon si-small bg-white bg-opacity-25 h-bg-facebook">
<i class="fa-brands fa-facebook-f"></i>
<i class="fa-brands fa-facebook-f"></i>
</a>
<a href="#" class="social-icon si-small bg-white bg-opacity-25 h-bg-twitter">
<i class="fa-brands fa-twitter"></i>
<i class="fa-brands fa-twitter"></i>
</a>
<a href="#" class="social-icon si-small bg-white bg-opacity-25 h-bg-google">
<i class="fa-brands fa-google"></i>
<i class="fa-brands fa-google"></i>
</a>
<a href="#" class="social-icon si-small bg-white bg-opacity-25 h-bg-instagram">
<i class="bi-instagram"></i>
<i class="bi-instagram"></i>
</a>
<a href="#" class="social-icon si-small bg-white bg-opacity-25 h-bg-dribbble">
<i class="fa-brands fa-dribbble"></i>
<i class="fa-brands fa-dribbble"></i>
</a>
<a href="#" class="social-icon si-small bg-white bg-opacity-25 h-bg-vimeo">
<i class="fa-brands fa-vimeo-v"></i>
<i class="fa-brands fa-vimeo-v"></i>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Copyrights
============================================= -->
<div id="copyrights" style="background-color: #111;">
<div class="container">
<div class="w-100 text-center">
<p class="mb-3">Copyrights © 2023 All Rights Reserved by Canvas Inc.</p>
<div class="copyright-links"><a href="#">Terms of Use</a> / <a href="#">Privacy Policy</a></div>
</div>
</div>
</div><!-- #copyrights end -->
</footer><!-- #footer end -->
</div><!-- #wrapper end -->
<!-- Go To Top
============================================= -->
<div id="gotoTop" class="uil uil-angle-up"></div>
<!-- JavaScripts
============================================= -->
<script src="js/jquery.js"></script>
<script src="js/functions.js"></script>
<script>
jQuery(window).scroll(function() {
var pixs = jQuery(window).scrollTop(),
opacity = pixs / 650,
element = jQuery( '.blurred-img' ),
elementHeight = element.outerHeight(),
elementNextHeight = jQuery('.content-wrap').find('.page-section').first().outerHeight();
if( ( elementHeight + elementNextHeight + 50 ) > pixs ) {
element.addClass('blurred-image-visible');
element.css({ 'opacity': opacity });
} else {
element.removeClass('blurred-image-visible');
}
});
</script>
</body>
</html>