Difference between revisions of "Team:Aix-Marseille"

(Blanked the page)
Line 1: Line 1:
<!DOCTYPE html>
 
<html lang="en">
 
  
<head>
 
 
    <meta charset="utf-8">
 
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
 
    <meta name="viewport" content="width=device-width, initial-scale=1">
 
    <meta name="description" content="">
 
    <meta name="author" content="">
 
 
    <title>Titre de la page</title>
 
 
    <!-- Bootstrap Core CSS - Uses Bootswatch Flatly Theme: http://bootswatch.com/flatly/ -->
 
    <link href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.5/flatly/bootstrap.min.css" rel="stylesheet" >
 
 
    <!-- Custom CSS -->
 
    <link href="http://ironsummitmedia.github.io/startbootstrap-freelancer/css/freelancer.css" rel="stylesheet">
 
 
    <!-- Custom Fonts -->
 
    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha256-k2/8zcNbxVIh5mnQ52A0r3a6jAgMGxFJFE2707UxGCk= sha512-ZV9KawG2Legkwp3nAlxLIVFudTauWuBpC10uEafMHYL0Sarrz5A7G79kXh5+5+woxQ5HM559XX2UZjMJ36Wplg==" crossorigin="anonymous">
 
    <link href="http://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css">
 
    <link href="http://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic" rel="stylesheet" type="text/css">
 
 
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
 
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
 
    <!--[if lt IE 9]>
 
        <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
 
        <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
 
    <![endif]-->
 
 
    <!-- wow CSS -->
 
    <link rel="stylesheet" type="text/css" href="http://mynameismatthieu.com/WOW/css/libs/animate.css">
 
 
</head>
 
 
<body id="page-top" class="index">
 
 
    <!-- Navigation -->
 
    <nav class="navbar navbar-default navbar-fixed-top">
 
        <div class="container">
 
            <!-- Brand and toggle get grouped for better mobile display -->
 
            <div class="navbar-header page-scroll">
 
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
 
                    <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" href="#page-top">IGEM</a>
 
            </div>
 
 
            <!-- Collect the nav links, forms, and other content for toggling -->
 
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
 
                <ul id="pagesMenu" class="nav navbar-nav navbar-right">
 
                    <li class="hidden">
 
                        <a href="#page-top"></a>
 
                    </li>
 
                    <li class="page-scroll">
 
                        <a href="#pageHome" data-id="pageHome">Home</a>
 
                    </li>
 
                    <li class="page-scroll">
 
                        <a href="#pageAbout" data-id="pageAbout">Projet</a>
 
                    </li>
 
                    <li class="page-scroll">
 
                        <a href="#pageFoo" data-id="pageFoo">Exemple</a>
 
                    </li>
 
                </ul>
 
            </div>
 
            <!-- /.navbar-collapse -->
 
        </div>
 
        <!-- /.container-fluid -->
 
    </nav>
 
 
    <!-- SECTION EN TETE, TOUJOURS VISIBLE -->
 
    <header>
 
        <div class="container">
 
            <div class="row">
 
                <div class="col-lg-12">
 
                    <img class="img-responsive" src="http://i.imgur.com/Ya0O2yU.png" alt="">
 
                    <div class="intro-text">
 
                        <span class="name">IGEM project!</span>
 
                        <hr class="star-light">
 
                        <span class="skills">Polytech Marseille</span>
 
                    </div>
 
                </div>
 
            </div>
 
        </div>
 
    </header>
 
 
 
<!-- A PARTIR D'ICI ON GERE LES DIFFERENTS PAGE DU SITE -->
 
    <!-- DANS UNE DIV, METTRE l'EQUIVALENT d'une page -->
 
    <div class="page" data-page="pageHome" id="pageHome">
 
        <!-- Header -->
 
        <section class="wow fadeIn">
 
            <!-- <p>
 
                <img name="usaMap" src="http://davidjbradshaw.com/imagemap-resizer/example/images/ex1.gif" usemap="#m_usaMap" border="0" width="100%">
 
            </p>
 
            <map name="m_usaMap">
 
                <area href="http://en.wikipedia.org/wiki/California" shape="poly" coords="82,262,53,259,52,253,50,247,47,242,45,239,41,235,39,235,36,233,32,228,22,224,20,220,22,214,13,196,12,192,16,192,17,191,16,188,12,182,11,180,10,174,7,167,6,161,3,154,5,144,3,139,2,133,5,127,8,122,10,112,51,121,41,164,87,228,87,232,89,237,90,239,90,242,87,244,84,251,83,252,82,254,82,257,84,261,82,262" title="California">
 
                <area href="http://en.wikipedia.org/wiki/Colorado" shape="poly" coords="171,152,195,154,223,156,244,159,244,171,242,191,241,214,228,214,163,207,171,152" title="Colorado">
 
                <area href="http://en.wikipedia.org/wiki/Connecticut" shape="rect" coords="542,94,568,111" title="Connecticut">
 
            </map> -->
 
 
            <p>
 
                <img src="img/home.png" alt="" usemap="#Map" border="0" width="100%" />
 
            </p>
 
            <map name="Map" id="Map">
 
                <area alt="" title="" href="#pageHome" shape="poly" coords="573,665,613,666,627,643,637,615,630,592,607,579,570,576,554,607,554,635" />
 
                <area alt="" title="" href="#pageAbout" shape="poly" coords="141,613,177,631,193,666,180,694,151,702,120,711,83,681,88,630,122,606,149,611" />
 
                <area alt="" title="" href="#" shape="poly" coords="250,444,273,403,272,365,241,350,209,340,176,359,171,388,177,429,213,448" />
 
                <area alt="" title="" href="#" shape="poly" coords="201,311,243,296,249,235,220,208,148,214,126,263,161,299,196,311" />
 
                <area alt="" title="" href="#" shape="poly" coords="743,429,745,536,849,540,851,433" />
 
                <area alt="" title="" href="#" shape="poly" coords="895,252,900,350,1001,356,1008,258,898,251" />
 
                <area alt="" title="" href="#" shape="poly" coords="527,308,617,330,710,278,693,191,705,144,681,72,547,93" />
 
                <area alt="" title="" href="#" shape="poly" coords="980,124,973,184,1010,234,1085,206,1089,156,1054,120" />
 
                <area alt="" title="" href="#" shape="poly" coords="802,34,800,97,841,106,905,107,912,70,910,29,874,10,824,11" />
 
                <area alt="" title="" href="#" shape="poly" coords="354,113,373,45,334,22,293,21,256,49,255,89,277,105,300,129" />
 
            </map>
 
       
 
        </section>
 
 
        <!-- About Section -->
 
        <section class="success" id="about">
 
        <div class="container">
 
            <div class="row">
 
                <div class="col-lg-12 text-center wow bounceInUp">
 
                    <h2>About</h2>
 
                    <hr class="star-light">
 
                </div>
 
            </div>
 
            <div class="row">
 
                <div class="col-lg-4 col-lg-offset-2">
 
                    <p>Freelancer is a free bootstrap theme created by Start Bootstrap. The download includes the complete source files including HTML, CSS, and JavaScript as well as optional LESS stylesheets for easy customization.</p>
 
                </div>
 
                <div class="col-lg-4">
 
                    <p>Whether you're a student looking to showcase your work, a professional looking to attract clients, or a graphic artist looking to share your projects, this template is the perfect starting point!</p>
 
                </div>
 
                <div class="col-lg-8 col-lg-offset-2 text-center">
 
                    <a href="#" class="btn btn-lg btn-outline">
 
                        <i class="fa fa-download"></i> Download Theme
 
                    </a>
 
                </div>
 
            </div>
 
        </div>
 
        </section>
 
 
        <!-- Portfolio Grid Section -->
 
        <section id="portfolio">
 
        <div class="container">
 
            <div class="row">
 
                <div class="col-lg-12 text-center">
 
                    <h2>Portfolio</h2>
 
                    <hr class="star-primary">
 
                </div>
 
            </div>
 
            <div class="row">
 
                <div class="col-sm-4 portfolio-item wow fadeInLeft">
 
                    <a href="#portfolioModal1" class="portfolio-link" data-toggle="modal">
 
                        <div class="caption">
 
                            <div class="caption-content">
 
                                <i class="fa fa-search-plus fa-3x"></i>
 
                            </div>
 
                        </div>
 
                        <img src="http://i.imgur.com/BSjAzFR.png" class="img-responsive" alt="">
 
                    </a>
 
                </div>
 
                <div class="col-sm-4 portfolio-item">
 
                    <a href="#portfolioModal2" class="portfolio-link" data-toggle="modal">
 
                        <div class="caption">
 
                            <div class="caption-content">
 
                                <i class="fa fa-search-plus fa-3x"></i>
 
                            </div>
 
                        </div>
 
                        <img src="http://i.imgur.com/bB0RWAU.png" class="img-responsive" alt="">
 
                    </a>
 
                </div>
 
                <div class="col-sm-4 portfolio-item">
 
                    <a href="#portfolioModal3" class="portfolio-link" data-toggle="modal">
 
                        <div class="caption">
 
                            <div class="caption-content">
 
                                <i class="fa fa-search-plus fa-3x"></i>
 
                            </div>
 
                        </div>
 
                        <img src="http://i.imgur.com/AcOMK2A.png" class="img-responsive" alt="">
 
                    </a>
 
                </div>
 
                <div class="col-sm-4 portfolio-item">
 
                    <a href="#portfolioModal4" class="portfolio-link" data-toggle="modal">
 
                        <div class="caption">
 
                            <div class="caption-content">
 
                                <i class="fa fa-search-plus fa-3x"></i>
 
                            </div>
 
                        </div>
 
                        <img src="http://i.imgur.com/h59amgM.png" class="img-responsive" alt="">
 
                    </a>
 
                </div>
 
                <div class="col-sm-4 portfolio-item">
 
                    <a href="#portfolioModal5" class="portfolio-link" data-toggle="modal">
 
                        <div class="caption">
 
                            <div class="caption-content">
 
                                <i class="fa fa-search-plus fa-3x"></i>
 
                            </div>
 
                        </div>
 
                        <img src="http://i.imgur.com/ldC0doB.png" class="img-responsive" alt="">
 
                    </a>
 
                </div>
 
                <div class="col-sm-4 portfolio-item">
 
                    <a href="#portfolioModal6" class="portfolio-link" data-toggle="modal">
 
                        <div class="caption">
 
                            <div class="caption-content">
 
                                <i class="fa fa-search-plus fa-3x"></i>
 
                            </div>
 
                        </div>
 
                        <img src="http://i.imgur.com/5vlHFHk.png" class="img-responsive" alt="">
 
                    </a>
 
                </div>
 
            </div>
 
        </div>
 
        </section>
 
    </div>
 
 
    <!-- UNE SECONDE PAGE, CACHEE PAR DEFAULT -->
 
    <div style="display:none" class="page" data-page="pageAbout" id="pageAbout">
 
        <!-- About 2 Section -->
 
        <section class="success" id="about2">
 
        <div class="container">
 
            <div class="row">
 
                <div class="col-lg-12 text-center wow bounceInUp">
 
                    <h2>About 2</h2>
 
                    <hr class="star-light">
 
                </div>
 
            </div>
 
            <div class="row">
 
                <div class="col-lg-4 col-lg-offset-2">
 
                    <p>Freelancer is a free bootstrap theme created by Start Bootstrap. The download includes the complete source files including HTML, CSS, and JavaScript as well as optional LESS stylesheets for easy customization.</p>
 
                </div>
 
                <div class="col-lg-4">
 
                    <p>Whether you're a student looking to showcase your work, a professional looking to attract clients, or a graphic artist looking to share your projects, this template is the perfect starting point!</p>
 
                </div>
 
                <div class="col-lg-8 col-lg-offset-2 text-center">
 
                    <a href="#" class="btn btn-lg btn-outline">
 
                        <i class="fa fa-download"></i> Download Theme
 
                    </a>
 
                </div>
 
            </div>
 
        </div>
 
        </section>
 
    </div>
 
 
    <!-- UNE TROISIEME PAGE, CACHEE PAR DEFAULT -->
 
    <div class="page" data-page="pageFoo" id="pageFoo">
 
        <!-- About 2 Section -->
 
        <section class="success" id="about2">
 
        <div class="container">
 
            <div class="row">
 
                <div class="col-lg-12 text-center wow bounceInUp">
 
                    <h2>TITRE EXEMPLE</h2>
 
                    <hr class="star-light">
 
                </div>
 
            </div>
 
            <div class="row">
 
                <div class="col-lg-4 col-lg-offset-2">
 
                    <p>DU TEXTE</p>
 
                </div>
 
                <div class="col-lg-4">
 
                    <p>ENCORE DU TEXTE</p>
 
                </div>
 
                <div class="col-lg-8 col-lg-offset-2 text-center">
 
                    <a href="#" class="btn btn-lg btn-outline">
 
                        <i class="fa fa-link"></i> UN LIEN VERS QQCH
 
                    </a>
 
                </div>
 
            </div>
 
        </div>
 
        </section>
 
    </div>
 
 
    <!-- Footer -->
 
    <footer class="text-center">
 
        <div class="footer-above">
 
            <div class="container">
 
                <div class="row">
 
                    <div class="footer-col col-md-4">
 
                        <h3>Location</h3>
 
                        <p>3481 Melrose Place<br>Beverly Hills, CA 90210</p>
 
                    </div>
 
                    <div class="footer-col col-md-4">
 
                        <h3>Around the Web</h3>
 
                        <ul class="list-inline">
 
                            <li>
 
                                <a href="#" class="btn-social btn-outline"><i class="fa fa-fw fa-facebook"></i></a>
 
                            </li>
 
                            <li>
 
                                <a href="#" class="btn-social btn-outline"><i class="fa fa-fw fa-google-plus"></i></a>
 
                            </li>
 
                            <li>
 
                                <a href="#" class="btn-social btn-outline"><i class="fa fa-fw fa-twitter"></i></a>
 
                            </li>
 
                            <li>
 
                                <a href="#" class="btn-social btn-outline"><i class="fa fa-fw fa-linkedin"></i></a>
 
                            </li>
 
                            <li>
 
                                <a href="#" class="btn-social btn-outline"><i class="fa fa-fw fa-dribbble"></i></a>
 
                            </li>
 
                        </ul>
 
                    </div>
 
                    <div class="footer-col col-md-4">
 
                        <h3>About Freelancer</h3>
 
                        <p>Freelance is a free to use, open source Bootstrap theme created by <a href="http://startbootstrap.com">Start Bootstrap</a>.</p>
 
                    </div>
 
                </div>
 
            </div>
 
        </div>
 
        <div class="footer-below">
 
            <div class="container">
 
                <div class="row">
 
                    <div class="col-lg-12">
 
                        Copyright &copy; Your Website 2014
 
                    </div>
 
                </div>
 
            </div>
 
        </div>
 
    </footer>
 
 
    <!-- Scroll to Top Button (Only visible on small and extra-small screen sizes) -->
 
    <div class="scroll-top page-scroll visible-xs visible-sm">
 
        <a class="btn btn-primary" href="#page-top">
 
            <i class="fa fa-chevron-up"></i>
 
        </a>
 
    </div>
 
 
 
    <!-- LES BOXS QUI VONT S'OUVRIR QUAND ON CLIQUE SUR LES IMAGES DU PORTFOLIO -->
 
    <!-- Portfolio Modals -->
 
    <div class="portfolio-modal modal fade" id="portfolioModal1" tabindex="-1" role="dialog" aria-hidden="true">
 
        <div class="modal-content">
 
            <div class="close-modal" data-dismiss="modal">
 
                <div class="lr">
 
                    <div class="rl">
 
                    </div>
 
                </div>
 
            </div>
 
            <div class="container">
 
                <div class="row">
 
                    <div class="col-lg-8 col-lg-offset-2">
 
                        <div class="modal-body">
 
                            <h2>Project Title</h2>
 
                            <hr class="star-primary">
 
                            <img src="img/portfolio/cabin.png" class="img-responsive img-centered" alt="">
 
                            <p>Use this area of the page to describe your project. The icon above is part of a free icon set by <a href="https://sellfy.com/p/8Q9P/jV3VZ/">Flat Icons</a>. On their website, you can download their free set with 16 icons, or you can purchase the entire set with 146 icons for only $12!</p>
 
                            <ul class="list-inline item-details">
 
                                <li>Client:
 
                                    <strong><a href="http://startbootstrap.com">Start Bootstrap</a>
 
                                    </strong>
 
                                </li>
 
                                <li>Date:
 
                                    <strong><a href="http://startbootstrap.com">April 2014</a>
 
                                    </strong>
 
                                </li>
 
                                <li>Service:
 
                                    <strong><a href="http://startbootstrap.com">Web Development</a>
 
                                    </strong>
 
                                </li>
 
                            </ul>
 
                            <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button>
 
                        </div>
 
                    </div>
 
                </div>
 
            </div>
 
        </div>
 
    </div>
 
    <div class="portfolio-modal modal fade" id="portfolioModal2" tabindex="-1" role="dialog" aria-hidden="true">
 
        <div class="modal-content">
 
            <div class="close-modal" data-dismiss="modal">
 
                <div class="lr">
 
                    <div class="rl">
 
                    </div>
 
                </div>
 
            </div>
 
            <div class="container">
 
                <div class="row">
 
                    <div class="col-lg-8 col-lg-offset-2">
 
                        <div class="modal-body">
 
                            <h2>Project Title</h2>
 
                            <hr class="star-primary">
 
                            <img src="img/portfolio/cake.png" class="img-responsive img-centered" alt="">
 
                            <p>Use this area of the page to describe your project. The icon above is part of a free icon set by <a href="https://sellfy.com/p/8Q9P/jV3VZ/">Flat Icons</a>. On their website, you can download their free set with 16 icons, or you can purchase the entire set with 146 icons for only $12!</p>
 
                            <ul class="list-inline item-details">
 
                                <li>Client:
 
                                    <strong><a href="http://startbootstrap.com">Start Bootstrap</a>
 
                                    </strong>
 
                                </li>
 
                                <li>Date:
 
                                    <strong><a href="http://startbootstrap.com">April 2014</a>
 
                                    </strong>
 
                                </li>
 
                                <li>Service:
 
                                    <strong><a href="http://startbootstrap.com">Web Development</a>
 
                                    </strong>
 
                                </li>
 
                            </ul>
 
                            <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button>
 
                        </div>
 
                    </div>
 
                </div>
 
            </div>
 
        </div>
 
    </div>
 
    <div class="portfolio-modal modal fade" id="portfolioModal3" tabindex="-1" role="dialog" aria-hidden="true">
 
        <div class="modal-content">
 
            <div class="close-modal" data-dismiss="modal">
 
                <div class="lr">
 
                    <div class="rl">
 
                    </div>
 
                </div>
 
            </div>
 
            <div class="container">
 
                <div class="row">
 
                    <div class="col-lg-8 col-lg-offset-2">
 
                        <div class="modal-body">
 
                            <h2>Project Title</h2>
 
                            <hr class="star-primary">
 
                            <img src="img/portfolio/circus.png" class="img-responsive img-centered" alt="">
 
                            <p>Use this area of the page to describe your project. The icon above is part of a free icon set by <a href="https://sellfy.com/p/8Q9P/jV3VZ/">Flat Icons</a>. On their website, you can download their free set with 16 icons, or you can purchase the entire set with 146 icons for only $12!</p>
 
                            <ul class="list-inline item-details">
 
                                <li>Client:
 
                                    <strong><a href="http://startbootstrap.com">Start Bootstrap</a>
 
                                    </strong>
 
                                </li>
 
                                <li>Date:
 
                                    <strong><a href="http://startbootstrap.com">April 2014</a>
 
                                    </strong>
 
                                </li>
 
                                <li>Service:
 
                                    <strong><a href="http://startbootstrap.com">Web Development</a>
 
                                    </strong>
 
                                </li>
 
                            </ul>
 
                            <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button>
 
                        </div>
 
                    </div>
 
                </div>
 
            </div>
 
        </div>
 
    </div>
 
    <div class="portfolio-modal modal fade" id="portfolioModal4" tabindex="-1" role="dialog" aria-hidden="true">
 
        <div class="modal-content">
 
            <div class="close-modal" data-dismiss="modal">
 
                <div class="lr">
 
                    <div class="rl">
 
                    </div>
 
                </div>
 
            </div>
 
            <div class="container">
 
                <div class="row">
 
                    <div class="col-lg-8 col-lg-offset-2">
 
                        <div class="modal-body">
 
                            <h2>Project Title</h2>
 
                            <hr class="star-primary">
 
                            <img src="img/portfolio/game.png" class="img-responsive img-centered" alt="">
 
                            <p>Use this area of the page to describe your project. The icon above is part of a free icon set by <a href="https://sellfy.com/p/8Q9P/jV3VZ/">Flat Icons</a>. On their website, you can download their free set with 16 icons, or you can purchase the entire set with 146 icons for only $12!</p>
 
                            <ul class="list-inline item-details">
 
                                <li>Client:
 
                                    <strong><a href="http://startbootstrap.com">Start Bootstrap</a>
 
                                    </strong>
 
                                </li>
 
                                <li>Date:
 
                                    <strong><a href="http://startbootstrap.com">April 2014</a>
 
                                    </strong>
 
                                </li>
 
                                <li>Service:
 
                                    <strong><a href="http://startbootstrap.com">Web Development</a>
 
                                    </strong>
 
                                </li>
 
                            </ul>
 
                            <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button>
 
                        </div>
 
                    </div>
 
                </div>
 
            </div>
 
        </div>
 
    </div>
 
    <div class="portfolio-modal modal fade" id="portfolioModal5" tabindex="-1" role="dialog" aria-hidden="true">
 
        <div class="modal-content">
 
            <div class="close-modal" data-dismiss="modal">
 
                <div class="lr">
 
                    <div class="rl">
 
                    </div>
 
                </div>
 
            </div>
 
            <div class="container">
 
                <div class="row">
 
                    <div class="col-lg-8 col-lg-offset-2">
 
                        <div class="modal-body">
 
                            <h2>Project Title</h2>
 
                            <hr class="star-primary">
 
                            <img src="img/portfolio/safe.png" class="img-responsive img-centered" alt="">
 
                            <p>Use this area of the page to describe your project. The icon above is part of a free icon set by <a href="https://sellfy.com/p/8Q9P/jV3VZ/">Flat Icons</a>. On their website, you can download their free set with 16 icons, or you can purchase the entire set with 146 icons for only $12!</p>
 
                            <ul class="list-inline item-details">
 
                                <li>Client:
 
                                    <strong><a href="http://startbootstrap.com">Start Bootstrap</a>
 
                                    </strong>
 
                                </li>
 
                                <li>Date:
 
                                    <strong><a href="http://startbootstrap.com">April 2014</a>
 
                                    </strong>
 
                                </li>
 
                                <li>Service:
 
                                    <strong><a href="http://startbootstrap.com">Web Development</a>
 
                                    </strong>
 
                                </li>
 
                            </ul>
 
                            <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button>
 
                        </div>
 
                    </div>
 
                </div>
 
            </div>
 
        </div>
 
    </div>
 
    <div class="portfolio-modal modal fade" id="portfolioModal6" tabindex="-1" role="dialog" aria-hidden="true">
 
        <div class="modal-content">
 
            <div class="close-modal" data-dismiss="modal">
 
                <div class="lr">
 
                    <div class="rl">
 
                    </div>
 
                </div>
 
            </div>
 
            <div class="container">
 
                <div class="row">
 
                    <div class="col-lg-8 col-lg-offset-2">
 
                        <div class="modal-body">
 
                            <h2>Project Title</h2>
 
                            <hr class="star-primary">
 
                            <img src="img/portfolio/submarine.png" class="img-responsive img-centered" alt="">
 
                            <p>Use this area of the page to describe your project. The icon above is part of a free icon set by <a href="https://sellfy.com/p/8Q9P/jV3VZ/">Flat Icons</a>. On their website, you can download their free set with 16 icons, or you can purchase the entire set with 146 icons for only $12!</p>
 
                            <ul class="list-inline item-details">
 
                                <li>Client:
 
                                    <strong><a href="http://startbootstrap.com">Start Bootstrap</a>
 
                                    </strong>
 
                                </li>
 
                                <li>Date:
 
                                    <strong><a href="http://startbootstrap.com">April 2014</a>
 
                                    </strong>
 
                                </li>
 
                                <li>Service:
 
                                    <strong><a href="http://startbootstrap.com">Web Development</a>
 
                                    </strong>
 
                                </li>
 
                            </ul>
 
                            <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button>
 
                        </div>
 
                    </div>
 
                </div>
 
            </div>
 
        </div>
 
    </div>
 
 
 
    <!-- ON NE TOUCHE SURTOUT A RIEN DANS CE CODE A PARTIR D'ICI !!! -->
 
    <!-- Scripts -->
 
 
    <!-- jQuery -->
 
    <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
 
 
    <!-- Bootstrap Core JavaScript -->
 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js" integrity="sha256-Sk3nkD6mLTMOF0EOpNtsIry+s1CsaqQC1rVLTAy+0yc= sha512-K1qjQ+NcF2TYO/eI3M6v8EiNYZfA95pQumfvcVrTHtwQVDG+aHRqLi/ETn2uB+1JqwYqVG3LIvdm9lj6imS/pQ==" crossorigin="anonymous"></script>
 
 
    <!-- Plugin JavaScript -->
 
    <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
 
    <script src="http://ironsummitmedia.github.io/startbootstrap-freelancer/js/classie.js"></script>
 
    <script src="http://ironsummitmedia.github.io/startbootstrap-freelancer/js/cbpAnimatedHeader.js"></script>
 
 
    <!-- Contact Form JavaScript -->
 
    <script src="http://ironsummitmedia.github.io/startbootstrap-freelancer/js/jqBootstrapValidation.js"></script>
 
    <script src="http://ironsummitmedia.github.io/startbootstrap-freelancer/js/contact_me.js"></script>
 
 
 
    <!-- Map resize -->
 
    <script type="text/javascript">
 
        !function(){"use strict";function a(){function a(){function a(a){function c(a){return a*b[1===(d=1-d)?"width":"height"]}var d=0;return a.split(",").map(Number).map(c).map(Math.floor).join(",")}for(var b={width:i.width/j.width,height:i.height/j.height},c=0;g>c;c++)f[c].coords=a(h[c])}function b(){j.onload=function(){(i.width!==j.width||i.height!==j.height)&&a()},j.src=i.src}function c(){function b(){clearTimeout(k),k=setTimeout(a,250)}window.addEventListener?window.addEventListener("resize",b,!1):window.attachEvent&&window.attachEvent("onresize",b)}function d(a){return a.coords.replace(/ *, */g,",").replace(/ +/g,",")}var e=this,f=e.getElementsByTagName("area"),g=f.length,h=Array.prototype.map.call(f,d),i=document.querySelector('img[usemap="#'+e.name+'"]'),j=new Image,k=null;b(),c()}function b(){function b(b){if(!b.tagName)throw new TypeError("Object is not a valid DOM element");if("MAP"!==b.tagName.toUpperCase())throw new TypeError("Expected <MAP> tag, found <"+b.tagName+">.");a.call(b)}return function(a){switch(typeof a){case"undefined":case"string":Array.prototype.forEach.call(document.querySelectorAll(a||"map"),b);break;case"object":b(a);break;default:throw new TypeError("Unexpected data type ("+typeof a+").")}}}"function"==typeof define&&define.amd?define([],b):"object"==typeof exports?module.exports=b():window.imageMapResize=b(),"jQuery"in window&&(jQuery.fn.imageMapResize=function(){return this.filter("map").each(a).end()})}();
 
    </script>
 
    <script type="text/javascript">
 
        $('map').imageMapResize();
 
    </script>
 
 
    <!-- Custom Theme JavaScript -->
 
    <script>
 
        $(function(){$("body").on("click",".page-scroll a",function(o){var l=$(this);$("html, body").stop().animate({scrollTop:$(l.attr("href")).offset().top},1500,"easeInOutExpo"),o.preventDefault()})}),$(function(){$("body").on("input propertychange",".floating-label-form-group",function(o){$(this).toggleClass("floating-label-form-group-with-value",!!$(o.target).val())}).on("focus",".floating-label-form-group",function(){$(this).addClass("floating-label-form-group-with-focus")}).on("blur",".floating-label-form-group",function(){$(this).removeClass("floating-label-form-group-with-focus")})}),$("body").scrollspy({target:".navbar-fixed-top"}),$(".navbar-collapse ul li a").click(function(){$(".navbar-toggle:visible").click()});
 
    </script>
 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.min.js"></script>
 
    <script>
 
        new WOW().init(); //pour creer les animations
 
    </script>
 
 
    <script>
 
        //Simuler un changement de page
 
        $( "#pagesMenu a" ).click(function() {
 
            $('.page').not($(this).attr('href')).hide();
 
            $($(this).attr('href')).show();
 
            new WOW().init();
 
        });
 
    </script>
 
 
</body>
 
 
</html>
 

Revision as of 08:47, 1 September 2015