"HARUN PEHLİVAN PROFİLO"
Bootstrap 4.1.1 Snippet by harunpehlivan

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <nav id="mainNav" class="navbar navbar-default navbar-fixed-top"> <div class="container-fluid"> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand page-scroll" href="https://harunpehlivanband.glitch.me/"><span class="glyphicon glyphicon-home" aria-hidden="true"> </span>HARUN PEHLİVAN </a> </div> <div class="collapse navbar-collapse" id="navbar-collapse"> <ul class="nav navbar-nav navbar-right"> <li> <a class="page-scroll" href="#about">About</a> </li> <li> <a class="page-scroll" href="#services">Services</a> </li> <li> <a class="page-scroll" href="#portfolio">Portfolio</a> </li> <li> <a class="page-scroll" href="#contact">Contact</a> </li> </ul> </div> </div> </nav> <header id="page-top"> <div class="bg-fix header-content"> <div class="header-content-inner"> <h1>HARUN PEHLİVAN </h1> <p>IT FOUNDER CEO BLOGGER INITIATIVE AR-GE<span data-wow-iteration="infinite" class="wow flash"></span> </p> <div class="socialButtons"> <a href="https://github.com/harunpehlivan" target="_blank" class="btn btn-default btn-lg" role="button"><i class="fa fa-github"></i> GitHub</a> <a href="https://codepen.io/harunpehlivan/" target="_blank" class="btn btn-default btn-lg" role="button"><i class="fa fa-codepen"></i> Codepen</a> <a href="https://www.linkedin.com/in/harun-pehlivan-0aa34252" target="_blank" class="btn btn-default btn-lg" role="button"><i class="fa fa-linkedin"></i> LinkedIn</a> </div> </div> </div> </header> <section id="about" class="bg-fix"> <div class="container"> <div class="row well center-block"> <div class="col-lg-8 col-lg-offset-2 text-center"> <h2 class="section-heading">About</h2> <hr class="light"> <p><a href="http://www.shortcutz.link/harunpehlivan" rel="noopener noreferrer" target="_blank">INFORMATION TECHNOLOGY FOUNDER,CEO BLOGGER</a></p> <hr class="soften"> <p>2008 <a href="http://tebimtebitagem.ticiz.com" rel="noopener noreferrer" target="_blank">TERCUMAN INFORMATICS CENTER</a> 2012 <a href="https://harunpehlivantebimtebitagem.business.site" rel="noopener noreferrer" target="_blank">TERCUMAN EDUCATION, SCIENCE, TECHNICAL RESEARCH AND DEVELOPMENT CENTER</a> </p> </div> </div> </div> </section> <section id="services" class="bg-fix"> <div class="container"> <div class="row well center-block"> <div class="col-lg-12 text-center"> <h2 class="section-heading">Services</h2> <hr class="primary"> </div> </div> </div> <div class="container"> <div class="row well center-block"> <div class="col-lg-3 col-md-6 text-center"> <div class="service-box"> <i class="fa fa-4x fa-wordpress wow bounceIn text-primary" data-wow-delay=".5s"></i> <h3>Wordpress Development</h3> <p class="text-muted">Wordpress Add-on Modules and Theme Design</p> </div> </div> <div class="col-lg-3 col-md-6 text-center"> <div class="service-box"> <i class="fa fa-4x fa-bar-chart wow bounceIn text-primary" data-wow-delay=".5s"></i> <h3>Data Analysis</h3> <p class="text-muted">10+ Years of Data Analysis in Corporate Team Performance</p> </div> </div> <div class="col-lg-3 col-md-6 text-center"> <div class="service-box"> <i class="fa fa-4x fa-code wow bounceIn text-primary" data-wow-delay=".5s"></i> <h3>Scripting</h3> <p class="text-muted">Harness Powershell for Network, Server and Workstation Auditing</p> </div> </div> <div class="col-lg-3 col-md-6 text-center"> <div class="service-box"> <i class="fa fa-4x fa-database wow bounceIn text-primary" data-wow-delay=".5s"></i> <h3>MySQL</h3> <p class="text-muted">Database Schema Design and Implementation</p> </div> </div> </div> </div> </section> <section id="portfolio" class="bg-fix"> <div class="container"> <div class="row center-block"> <div class="col-md-5"> <img class="img-responsive img-rounded" src="https://s-ssl.wordpress.com/mshots/v1/https%3A%2F%2Fwikiwarshpitgroups.glitch.me?w=360" alt="PlaceHolder"> </div> <div class="col-md-5 well"> <h3>WikiWars </h3> <h4>WikiWars </h4> <p>WikiWars ​ HP IT GROUP </p> <a class="btn btn-default" href="https://wikiwarshpitgroups.glitch.me" target="_blank">View Project  <span class="glyphicon glyphicon-hand-right"></span></a> </div> </div> <hr> <div class="row center-block"> <div class="col-md-5"> <img class="img-responsive img-rounded" src="https://s-ssl.wordpress.com/mshots/v1/https%3A%2F%2Fharunpehlivanizyon.glitch.me?w=360" alt="PlaceHolder"> </div> <div class="col-md-5 well"> <h3>HARUN PEHLİVAN VİZYON</h3> <h4>HARUN PEHLİVAN VİZYON</h4> <p>HARUN PEHLİVAN VİZYON</p> <a class="btn btn-default" href="https://harunpehlivanizyon.glitch.me/" target="_blank">View Project  <span class="glyphicon glyphicon-hand-right"></span></a> </div> </div> </div> </section> <section id="contact"> <div class="container"> <h4 class="pull-left">.</h4> <div class="row row-centered"> <a href="https://github.com/harunpehlivan" target="_blank" class="btn btn-default btn-lg" role="button"><i class="fa fa-github"></i> GitHub</a> <a href="https://codepen.io/harunpehlivan/" target="_blank" class="btn btn-default btn-lg" role="button"><i class="fa fa-codepen"></i> Codepen</a> <a href="https://www.linkedin.com/in/harun-pehlivan-0aa34252/" target="_blank" class="btn btn-default btn-lg" role="button"><i class="fa fa-linkedin"></i> LinkedIn</a> </div> </div> </section> <section id="footer"> <div class="container"> <div class="row"> <div class="panel-body"> <div data-wow-duration="1s" class="html5div pull-left wow rubberBand"> <img src="https://www.w3.org/html/logo/badge/html5-badge-h-css3-semantics.png" width="165" height="64" alt="HTML5 Powered with CSS3 / Styling, and Semantics" title="HTML5 Powered with CSS3 / Styling, and Semantics"> </div> <div class="pull-right"> <h4>Code by HP IT GROUP GLOBAL PROFESYONEL IT GROUP</h4> </div> </div> </div> </div> </section>
body { font-family: Roboto; padding-top: 50px; height: 100%; } h3 { margin: 0 } .socialButtons { text-align: center; display: block; font-family: Roboto; margin-top: 20px; } .btn { margin-right: 15px; margin-bottom: 20px; } .btn a { text-decoration: none; color: #1a191a; } .btn:hover { text-decoration: none; background-color: rgba(0, 0, 0, 0.1); } hr.soften { height: 1px; background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, .8), rgba(0, 0, 0, 0)); background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, .8), rgba(0, 0, 0, 0)); background-image: -ms-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, .8), rgba(0, 0, 0, 0)); background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0), rgba(0, 0, 0, .8), rgba(0, 0, 0, 0)); border: 0; } .bg-fix { min-height: 100%; background-size: cover; background-attachment: fixed, scroll; background-repeat: no-repeat; background-position: center center; } .bg-fix.header-content { background-image: url('https://cdn-cms.f-static.com/uploads/1017556/2000_5b53aeec70dad.jpg'); } .header-content-inner { padding-top: 200px; padding-bottom: 80px; } .header-content-inner span { position: relative; top: -6px; } .header-content-inner h1 { text-align: center; font-size: 48px; font-family: Aldrich; text-shadow: 0px 0px 1px #4d4d4d, 0px 0px 1px #aeaeae; } .header-content-inner p { text-align: center; font-size: 32px; font-family: Aldrich; text-shadow: 0px 0px 1px #4d4d4d, 0px 0px 1px #aeaeae; } section { padding-top: 80px; padding-bottom: 80px; } section h2 { text-align: center; font-size: 38px; font-family: Aldrich; } #about.bg-fix { background-image: url('https://cdn-cms.f-static.com/uploads/1017556/2000_5b53ad0bd1e1c.jpg'); } #about .well { text-align: justify; background-color: rgba(245, 245, 245, 0.4); } #services.bg-fix { background-image: url('https://cdn-cms.f-static.com/uploads/1017556/2000_5b2230e1ab99e.jpg'); } #services .service-box { padding-bottom: 15px; } #services .well { background-color: rgba(245, 245, 245, 0.4); } #portfolio.bg-fix { background-image: url('https://cdn-cms.f-static.com/uploads/1017556/2000_5b222e34a727c.jpg'); } #portfolio img { padding-bottom: 40px; } #portfolio .well { background-color: rgba(245, 245, 245, 0.4); } #contact { background-color: #1a191a; } #contact .row-centered { text-align: center; } #contact .btn-default { border-color: lightslategray; background-color: #1a191a; } #contact .btn-default:hover { border-color: #1a191a; ; background-color: lightslategray; color: #1a191a; } #contact a { color: lightslategray; } #contact button { color: lightslategray; } #contact .col-xs-6 .col-md-4 { text-align: left; } #contact h4 { color: #1a191a; margin: 0; padding: 0; } #footer { background-color: lightslategray; padding-top: 10px; padding-bottom: 0; text-align: right; color: #aeaeae; } #footer h4 { padding-top: 10px; } .html5div a { padding-right: 30px; color: #aeaeae; } .html5div a:hover { padding-right: 30px; color: #e44d26; } .css3div a { padding-right: 30px; color: #aeaeae; } .css3div a:hover { padding-right: 30px; color: #1572b6; } .fadiv a { padding-right: 30px; color: #aeaeae; } .fadiv a:hover { padding-right: 30px; color: #1da075; }
$(document).on('click', '.navbar-collapse.in', function(e) { if ($(e.target).is('a') && $(e.target).attr('class') != 'dropdown-toggle') { $(this).collapse('hide'); } }); new WOW().init();

Related: See More


Questions / Comments: