<commit_before><!doctype html>
<html class="no-js" lang="">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title></title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <link rel="apple-touch-icon" href="apple-touch-icon.png">
        <!-- Place favicon.ico in the root directory -->

        <link rel="stylesheet" href="css/normalize.css">
        <link rel="stylesheet" href="css/main.css">
        <link rel="stylesheet" href="css/custom.css">
        <!-- Compiled and minified CSS -->
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/css/materialize.min.css">
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css">
    
        <script src="js/vendor/modernizr-2.8.3.min.js"></script>
    </head>
    <body>
        <!--[if lt IE 8]>
            <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
        <![endif]-->

        <!-- header/navbar -->
        <div id="nav-bar" style="text-align:center; position:fixed;z-index:99999;">
            <div id="topbar-left" class="hide-on-med-and-down">
                <a id="aboutus" href="javascript:;" class="nav-item right-align float-right">About us <img src="img/pointer.png"/></a>
                <a id="product" href="javascrpt:;" class="nav-item right-align float-right">Products <img src="img/pointer.png"/></a>
            </div>
            <img data-0="opacity:1" data-800="opacity:0" id="logo" src="img/logo.png" class="img-responsive" />
            <div id="topbar-right" class="hide-on-med-and-down">
                <a id="contest" href="javscript:;" class="nav-item left-align float-left">Contest <img src="img/pointer.png"/></p>
                <a id="contactus" href="javascript:;" class="nav-item left-align float-left">Contact Us <img src="img/pointer.png"/></a>
            </div>
        </div>
        
            

            <div id="bottle-first" >
                <img id="main-background" src="img/eygpt-background-2.png" class="responsive-img">
                <img id="bottle-center" data-0p="opacity:0" data-40p="opacity:1"  src="img/bottle-notext.png" class="responsive-img">
                <img id="bottle-text" data-0p="opacity:0" data-50p="opacity:1" src="img/sparkling.png" class="responsive-img">
            </div>
            
            
            <div style="background:url('img/parallax1.png'); text-align:center;">
                <p id="description" data-0p="opacity:0" data-60p="opacity:1">
                    Perrier is a natural sparkling mineral water that is well known throughout the world. Famous for its elegantly-shaped green bottle, Perrier is the ultimate refreshment to quench all thirsts.In 1863, the PERRIER saga began: bubbles taken from a French spring were bottled, ready to satisfy people’s thirst. In 1898,  Dr. <NAME> became the owner of the spring, which would later take his illustrious name. 
                </p>
                <img id="detail-button" data-0p="opacity:0" data-60p="opacity:1" src="img/detail-button.png" class="responsive-img" >
                <div id="about-section" class="position-relative">
                    <img id="about-area" data-0p="opacity:0" data-60p="opacity:1" src="img/about.png" class="responsive-img"/>
                    <img id="about-title" data-0p="opacity:0" data-60p="opacity:1" src="img/about-title.png" class="responsive-img"/>
                    <img id="about-background" src="img/about-background.png" class="responsive-img" />
                    <img id="about-1" data-0p="right:-30%" data-50p="right:8%" src="img/about-1.png" class="responsive-img"/>
                    <img id="about-2" data-0p="left:-25%" data-50p="left:12%" src="img/about-2.png" class="responsive-img"/>
                    <img id="about-3" data-0p="right:-15%" data-50p="right:15%" src="img/about-3.png" class="responsive-img"/>
                </div>
                <div id="product-section" class="position-relative" style="margin-top:5%; text-align:center">
                    <img id="product-area" data-0p="opacity:0" data-60p="opacity:1" src="img/product.png" class="responsive-img" style="display:block;margin-left:auto; margin-right:auto;" />
                    <img id="product-title" data-0p="opacity:0" data-60p="opacity:1" src="img/product-title.png" class="responsive-img" style="margin-top:2%;" />
                    <img id="product-background" src="img/product-background.png" class="responsive-img" style="margin-top:5%;" />
                    <img id="bottle-original" data-0p="opacity:0" data-60p="opacity:1;"
                    data-60p="top:8%;" data-100p="top:57%;" src="img/bottle-original.png" class="responsive-img"/>
                    <img id="bottle-lime" data-0p="opacity:0" data-60p="opacity:1" data-60p="top:24%;" data-100p="top:60%;" src="img/bottle-lime.png" class="responsive-img"/>
                    <img id="bottle-citron" data-0p="opacity:0" data-60p="opacity:1" data-60p="top:37%;" data-100p="top:56%;" src="img/bottle-citron.png" class="responsive-img"/>
                </div>
                
            </div>

            <div style="position:relative;">
                <img src="img/contest.png" class="responsive-img"/>
                <div style="text-transform:uppercase; text-align:center; background:#351805; border-radius:15px; width: 90px; color:white; position:absolute; bottom:0;left:0; right:0;margin-left:auto; margin-right:auto; margin-bottom:7%;">
                    Join
                </div>
            </div>

            <div>
                <img id="img3" src="img/info.png" class="responsive-img"/>
            </div>

            <div>
                <img id="img4" src="img/gallery.png" class="responsive-img"/>
            </div>

            <footer>
                <p>
                    <i class="fa fa-facebook-f fa-2x"></i>
                    <i class="fa fa-twitter fa-2x"></i>
                    <i class="fa fa-instagram fa-2x"></i>
                    <i class="fa fa-facebook-f fa-2x"></i>
                </p>
                <span>
                    &copy;2016 Perrier All Rights Reserved, Terms &amp; Condition | Privacy Policy
                </span>
            </footer><commit_msg>fix where percentage is not working<commit_after><!doctype html>
<html class="no-js" lang="">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title></title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <link rel="apple-touch-icon" href="apple-touch-icon.png">
        <!-- Place favicon.ico in the root directory -->

        <link rel="stylesheet" href="css/normalize.css">
        <link rel="stylesheet" href="css/main.css">
        <link rel="stylesheet" href="css/custom.css">
        <!-- Compiled and minified CSS -->
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.7/css/materialize.min.css">
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css">
    
        <script src="js/vendor/modernizr-2.8.3.min.js"></script>
    </head>
    <body>
        <!--[if lt IE 8]>
            <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
        <![endif]-->

        <!-- header/navbar -->
        <div id="nav-bar" style="text-align:center; position:fixed;z-index:99999;">
            <div id="topbar-left" class="hide-on-med-and-down">
                <a id="aboutus" href="javascript:;" class="nav-item right-align float-right">About us <img src="img/pointer.png"/></a>
                <a id="product" href="javascrpt:;" class="nav-item right-align float-right">Products <img src="img/pointer.png"/></a>
            </div>
            <img data-0="opacity:1" data-800="opacity:0" id="logo" src="img/logo.png" class="img-responsive" />
            <div id="topbar-right" class="hide-on-med-and-down">
                <a id="contest" href="javscript:;" class="nav-item left-align float-left">Contest <img src="img/pointer.png"/></p>
                <a id="contactus" href="javascript:;" class="nav-item left-align float-left">Contact Us <img src="img/pointer.png"/></a>
            </div>
        </div>
        
            

            <div id="bottle-first" >
                <img id="main-background" src="img/eygpt-background-2.png" class="responsive-img">
                <img id="bottle-center" data-0="opacity:0" data-300="opacity:1"  src="img/bottle-notext.png" class="responsive-img">
                <img id="bottle-text" data-0="opacity:0" data-800="opacity:1" src="img/sparkling.png" class="responsive-img">
            </div>
            
            
            <div style="background:url('img/parallax1.png'); text-align:center;">
                <p id="description" data-900="opacity:0" data-1200="opacity:1">
                    Perrier is a natural sparkling mineral water that is well known throughout the world. Famous for its elegantly-shaped green bottle, Perrier is the ultimate refreshment to quench all thirsts.In 1863, the PERRIER saga began: bubbles taken from a French spring were bottled, ready to satisfy people’s thirst. In 1898,  Dr. <NAME> became the owner of the spring, which would later take his illustrious name. 
                </p>
                <img id="detail-button" data-900="opacity:0" data-1300="opacity:1" src="img/detail-button.png" class="responsive-img" >
                <div id="about-section" class="position-relative">
                    <img id="about-area" data-1300="opacity:0" data-1500="opacity:1" src="img/about.png" class="responsive-img"/>
                    <img id="about-title" data-1400="opacity:0" data-1600="opacity:1" src="img/about-title.png" class="responsive-img"/>
                    <img id="about-background" src="img/about-background.png" class="responsive-img" />
                    <img id="about-1" data-1500="right:-30%" data-1700="right:8%" src="img/about-1.png"  style="width:35%"/>
                    <img id="about-2" data-1600="left:-25%" data-1800="left:12%" src="img/about-2.png"  style="width:30%"/>
                    <img id="about-3" data-1700="right:-15%" data-1900="right:15%" src="img/about-3.png"  style="width:25%"/>
                </div>
                <div id="product-section" class="position-relative" style="margin-top:5%; text-align:center">
                    <img id="product-area" data-2100="opacity:0" data-2300="opacity:1" src="img/product.png" class="responsive-img" style="display:block;margin-left:auto; margin-right:auto;" />
                    <img id="product-title" data-2200="opacity:0" data-2400="opacity:1" src="img/product-title.png" class="responsive-img" style="margin-top:2%;" />
                    <img id="product-background" src="img/product-background.png" class="responsive-img" style="margin-top:5%;" />
                    <img id="bottle-original" data-2400="opacity:0" data-2600="opacity:1;"
                    data-2800="top:8%;" data-4200="top:57%;" src="img/bottle-original.png" class="responsive-img"/>
                    <img id="bottle-lime" data-2800="opacity:0" data-3000="opacity:1" data-3200="top:24%;" data-4200="top:60%;" src="img/bottle-lime.png" class="responsive-img"/>
                    <img id="bottle-citron" data-3200="opacity:0" data-3400="opacity:1" data-3600="top:37%;" data-4200="top:56%;" src="img/bottle-citron.png" class="responsive-img"/>
                </div>
                
            </div>

            <div style="position:relative;">
                <img src="img/contest.png" class="responsive-img"/>
                <div style="text-transform:uppercase; text-align:center; background:#351805; border-radius:15px; width: 90px; color:white; position:absolute; bottom:0;left:0; right:0;margin-left:auto; margin-right:auto; margin-bottom:7%;">
                    Join
                </div>
            </div>

            <div>
                <img id="img3" src="img/info.png" class="responsive-img"/>
            </div>

            <div>
                <img id="img4" src="img/gallery.png" class="responsive-img"/>
            </div>

            <footer>
                <p>
                    <i class="fa fa-facebook-f fa-2x"></i>
                    <i class="fa fa-twitter fa-2x"></i>
                    <i class="fa fa-instagram fa-2x"></i>
                    <i class="fa fa-facebook-f fa-2x"></i>
                </p>
                <span>
                    &copy;2016 Perrier All Rights Reserved, Terms &amp; Condition | Privacy Policy
                </span>
            </footer>
{'fraction_non_alphanumeric': 0.17692835889219502, 'fraction_numerical': 0.031357289997711146, 'mean_word_length': 2.364476386036961, 'pattern_counts': {'":': 0, '<': 205, '<?xml version=': 0, '>': 205, 'https://': 4, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1483281', 'n_tokens_mistral': 4404, 'n_tokens_neox': 4013, 'n_words': 758}