</head> <body class="is-preload"> <!-- Header --> <header id="header" class="inner"> <div id="body-logo" class="body-logo"> <ul> <li><a id="logo2" href="index.html"><img src="images/logo_clear.svg" alt="MS" height="35" width="40" /></a></li> <li><a href="index.html">Mary Schertz</a></li> </ul> </div> <nav> <ul> <li><a href="index.html">Home</a></li> <li><a href="Photography-Mary-Schertz.html" class="active"><</a></li> <li><a href="code-mary-schertz.html" class="active">HTML/CSS</a></li> <li><a href="english-class-mary-schertz.html" class="active">></a></li> <li><a href="index.html#six">Contact</a></li> </ul> </nav> </header> <!-- Wrapper --> <div id="wrapper"> <section id="splashimg" class="wrapper style1 fullscreen fade-up"> <div class="inner" style="z-index:2;"> <div id="border"> <h1 >mary<span id="anim-typewriter" class="gradient">.web</span><span class="gradient">{</span></h1> <h3 class="gradient">Web Design<span class="show-on-mobile"><br></span><span class="hide-on-mobile"> • </span>HTML/CSS<span class="show-on-mobile"><br></span><span class="hide-on-mobile"> • </span>Coding</h3> <ul class="actions hide-on-mobile"> <li><a id="view-project-button" href="#intro" class="button scrolly">Learn More</a></li> </ul> <h1 class="delay"><span class="gradient">}</span></h1> </div> </div> <p style="position: absolute;width: 100%!important;filter: brightness(0.10);z-index:-1;margin-bottom: 0;height: 100%;background-color: #505050;overflow: hidden;"></p> </section> <section id="intro" class="wrapper style1 fullscreen fade-up padding-top"> <div class="inner"> <h2 id="intro-header" style="margin-bottom:0px;">Interactive Design Experience</h2> <p class="intro-text">During school and during my professional work at LEAF Commercial Capital I have worked on a variety of design projects requiring Coding. I also built and designed emails and email templates at LEAF and managed Google Analytics for the website.</p> <ul class="actions"> <li><a href="#one" class="button scrolly">View Work</a></li> </ul> </div> </section> <!-- Main --> <div id="main2" class="wrapper "> <section id="one" class="wrapper style2 padding-top"> <section> <div class="box alt"> <div class="row gtr-uniform"> <div class="col-4 full-on-mobile"><span class="image fit"><a href="exo-files-mary-schertz.html" target="_blank"><img src="images/08-code/01.jpg" alt="" /></a></span><span class="description"><a href="exo-files-mary-schertz.html" target="_blank"><p class="p-header">Exo-Files</p></a><p>This student project utilized a variety of coding challenges including App interactivity and Website design. </p></span></div> <div class="col-4 full-on-mobile"><span class="image fit"><img src="images/08-code/02.jpg" alt="" /></span><span class="description"><p class="p-header">LEAF Commercial Capital</p><p>Professional projects while working for LEAF. I designed and built a variety of webpages and emails. </p></span></div> <div class="col-4 full-on-mobile"><span class="image fit"><a href="harbor-mary-schertz.html" target="_blank"><img src="images/08-code/03.jpg" alt="" /></a></span><span class="description"><a href="harbor-mary-schertz.html" target="_blank"><p class="p-header">Harbor</p></a><p>This student project built a website and designed accompanying App.</p></span></div> </div> </div> </section> </section> </div> </div> <!--end of wrapper--> <!-- Footer --> <header id="footer-nav" class="inner"> <nav> <ul> <li><a href="index.html">Home</a></li> <li><a href="Photography-Mary-Schertz.html" class="active"><</a></li> <li><a href="code-mary-schertz.html" class="active">HTML/CSS</a></li> <li><a href="english-class-mary-schertz.html" class="active">></a></li> <li><a href="index.html#six">Contact</a></li> </ul> </nav> </header> <footer id="footer" class="wrapper style1-alt"> <div class="inner"> <ul class="menu"> <li>© Mary Schertz 2021</li> </ul> </div> </footer> <!-- Scripts --> <script src="assets/js/jquery.min.js"></script> <script src="assets/js/jquery.scrollex.min.js"></script> <script src="assets/js/jquery.scrolly.min.js"></script> <script src="assets/js/browser.min.js"></script> <script src="assets/js/breakpoints.min.js"></script> <script src="assets/js/util.js"></script> <script src="assets/js/main.js"></script> <!-- added for popup lightbox slider --> <script src="assets/js/jquery.poptrox.min.js"></script> <script src="assets/js/main-photo-2.js"></script> <script> $('#main2 > section') .scrollex({ mode: 'middle', top: '-10vh', bottom: '-10vh', initialize: function() { // Deactivate section. $(this).addClass('inactive'); }, enter: function() { // Activate section. $(this).removeClass('inactive'); } }) </script>
In addition to building this entire website and adding animations, During school and during my professional work I have worked on a variety of projects. At LEAF Commercial Capital I have worked on a variety of design projects requiring Coding. I also built and designed emails and email templates at LEAF and managed Google Analytics for the website.
Exo-Files
This student project utilized a variety of coding challenges including App interactivity and Website design.
LEAF Commercial Capital
Professional projects while working for LEAF. I designed and built a variety of webpages and emails.
Harbor
This student project built a website and designed accompanying App.
