projects.html

<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta charset="utf-8" />

  <title>unweb.me - State of the art information systems</title>
  <!--[if lt IE 9]>
    <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
  <![endif]-->
  <link rel="stylesheet" media="all" href="docs/css/style.css" type="text/css" />
  <link href='http://fonts.googleapis.com/css?family=Open+Sans&amp;subset=latin,greek'
  rel='stylesheet' type='text/css' />
  <!-- Adding "maximum-scale=1" fixes the Mobile Safari
  auto-zoom bug: http://filamentgroup.com/examples/iosScaleBug/ -->
  <meta name="viewport" content="width=device-width, initial-scale=1" />
</head>

<body lang="en">
  <div id="header-wrapper">
    <div id="header">
      <div id="header-logo"><img class="image-logo" src=
      "images/logo.png" /></div>

      <div id="nav">
        <ul id="list-nav">
          <li><a class="category-link special" href=
          "index.html">Home</a></li>

          <li><a class="category-link special" href=
          "about.html">About</a></li>

          <li><a class="category-link special" href=
          "solutions.html">Solutions</a></li>

          <li class="selected"><a class="category-link special" href=
          "projects.html">Projects</a></li>

          <li><a class="category-link special" href=
          "blog.html">Blog</a></li>
        </ul>
      </div>
    </div>

    <div id="search-bar">
      <span id="lang-select" class="small">EN GR</span> <input type="text"
      id="searchGadget" />
    </div>
  </div>

  <div id="content-wrapper">
    <div id="projects" class="section">
      <h3 class="section-title bigger gradient-vert">Actions speak better
      than words, so get to know us through our work.</h3>

      <div class="projects-wrapper">
        <div id="proj-1" class="column project-column">
          <div class="image-wrapper">
            <img src="images/projects/project-thumb.jpg" />

            <h4 class="project-title">Plumi</h4>
          </div>
        </div>

        <div id="proj-2" class="column project-column">
          <div class="image-wrapper">
            <img src="images/projects/project-thumb.jpg" />

            <h4 class="project-title">tee-thrakis.gr</h4>
          </div>
        </div>

        <div id="proj-3" class="column project-column">
          <div class="image-wrapper">
            <img src="images/projects/project-thumb.jpg" />

            <h4 class="project-title">invision-images.com</h4>
          </div>
        </div>

        <div id="proj-4" class="column project-column">
          <div class="image-wrapper">
            <img src="images/projects/project-thumb.jpg" />

            <h4 class="project-title">marikworld.com</h4>
          </div>
        </div>

        <div id="proj-5" class="column project-column">
          <div class="image-wrapper">
            <img src="images/projects/project-thumb.jpg" />

            <h4 class="project-title">openfish.gr</h4>
          </div>
        </div>

        <div id="proj-6" class="column project-column">
          <div class="image-wrapper">
            <img src="images/projects/project-thumb.jpg" />

            <h4 class="project-title">stokokkino.gr</h4>
          </div>
        </div>

        <div id="proj-7" class="column project-column">
          <div class="image-wrapper">
            <img src="images/projects/project-thumb.jpg" />

            <h4 class="project-title">sexshoptv.gr</h4>
          </div>
        </div>

        <div id="proj-8" class="column project-column">
          <div class="image-wrapper">
            <img src="images/projects/project-thumb.jpg" />

            <h4 class="project-title">syriza.gr</h4>
          </div>
        </div>

        <div id="proj-9" class="column project-column">
          <div class="image-wrapper">
            <img src="images/projects/project-thumb.jpg" />

            <h4 class="project-title">0-18.gr</h4>
          </div>
        </div>
      </div>
    </div>

    <div id="open-source" class="section">
      <h3 class="section-title bigger gradient-vert">Open Source
      Products</h3>

      <div class="projects-wrapper">
        <div id="os-1" class="column project-column">
          <div class="plone-project"></div>

          <h4 class="project-title">unweb.iptc</h4>
        </div>

        <div id="os-2" class="column project-column">
          <div class="plone-project"></div>

          <h4 class="project-title">unweb.ploneftp</h4>
        </div>

        <div id="os-3" class="column project-column">
          <div class="plone-project"></div>

          <h4 class="project-title">unweb.watermark</h4>
        </div>

        <div id="os-4" class="column project-column">
          <div class="python-project"></div>

          <h4 class="project-title">collective.transcode.star</h4>
        </div>

        <div id="os-5" class="column project-column">
          <div class="default-project"></div>

          <h4 class="project-title">collective.piwik.*</h4>
        </div>
      </div>
    </div>

    <div id="logos" class="section">
      <h3 class="section-title bigger gradient-vert">Our Clients</h3>

      <ul>
        <li><a href="/projects/okeanos-cloud-computing-iaas" title=
        "Greek Research and Technology Network" class=
        "logo"><span><img src="images/logos/grnet.png" /></span></a></li>

        <li><a href="/projects/tee-thrakis" title=
        "Technical Chamber of Thrace" class="logo"><span><img src=
        "images/logos/tee.png" /></span></a></li>

        <li><a href="/projects/cosmosportal.eu" title=
        "National Technical University of Athens" class=
        "logo"><span><img src="images/logos/ntua.png" /></span></a></li>

        <li><a href="/projects/the-childrens-ombudsman" title=
        "The Greek Ombudsman" class="logo"><span><img src=
        "images/logos/ombudsman.png" /></span></a></li>

        <li><a href="/projects/plumi" title="Engage Media" class=
        "logo"><span><img src=
        "images/logos/engagemedia.png" /></span></a></li>

        <li><a href="/projects/openfsm" title="World Social Forum" class=
        "logo"><span><img src="images/logos/wsf.png" /></span></a></li>

        <li><a href="/projects/sto-kokkino" title="Sto kokkino 105.5FM "
        class="logo"><span><img src=
        "images/logos/stokokkino.png" /></span></a></li>

        <li><a href="/projects/invision-images.com" title=
        "Invision Images photo agency" class="logo"><span><img src=
        "images/logos/invision.png" /></span></a></li>
      </ul>
    </div>
  </div>

  <div id="footer-wrapper">
    <div id="footer">
      <div class="footer-section">
        <div id="footer-logo"><img class="image-logo" src=
        "images/logo-w.png" /></div>

        <ul id="footer-nav">
          <li class="selected"><a class="category-link special" href=
          "index.html">Home</a></li>

          <li><a class="category-link special" href=
          "about.html">About</a></li>

          <li><a class="category-link special" href=
          "solutions.html">Solutions</a></li>

          <li><a class="category-link special" href=
          "projects.html">Projects</a></li>

          <li><a class="category-link special" href=
          "blog.html">Blog</a></li>
        </ul>
      </div>

      <div id="footer-details" class="footer-section">
        <div class="footer-detail">
          <h3>Contact us</h3>

          <p>unweb.me Ltd. is a distributed company, registered in
          Komotini, Greece. You may arrange for a meeting with one of our
          representatives in Athens, Thesaloniki, Komotini, London or
          Amsterdam.</p>

          <ul>
            <li><b>Tel:</b> +30 211 780 3202</li>

            <li><b>e-mail:</b> info<img src=
            "images/at.png" />unweb.me</li>
          </ul>

          <h3>Follow us</h3><a href=
          "/blog/some-words-on-things-we-like/RSS"><img src=
          "images/rss.png" /></a> <a href="http://twitter.com/unwebme"><img src=
          "images/twitter.png" /></a>
        </div>

        <div id="hqmap"><img src="images/hqmap.png" /></div>
      </div>
    </div>
  </div>
  <!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if offline -->
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>
  <script type="text/javascript">
    //<![CDATA[
    window.jQuery || document.write('<script src="docs/js/libs/jquery-1.6.2.min.js"><\/script>')
    //]]>
  </script>
  <script type="text/javascript" charset="UTF-8" src="docs/js/libs/reflection.js"></script>
  <script type="text/javascript">
    //<![CDATA[
    $(document).ready(function(){
      $('.image-wrapper img').reflect();
    });

    /* IE FALLBACK FOR GRAPHS */
    if ( !$.browser.msie || $.browser.version >= 9 ) {

    $("#logos ul li").hover(function() { //On hover...

      var thumbOver = $(this).find("img").attr("src"); //Get image url and assign it to 'thumbOver'

      //Set a background image(thumbOver) on the <a> tag - Set position to bottom
      $(this).find("a.logo").css({'background' : 'url(' + thumbOver + ') no-repeat center bottom'});

      //Animate the image to 0 opacity (fade it out)
      $(this).find("span").stop().fadeTo('normal', 0 , function() {
        $(this).hide() //Hide the image after fade
      });
      }, function() { //on hover out...
          //Fade the image to full opacity 
          $(this).find("span").stop().fadeTo('normal', 1).show();
      });
    }
  //]]>
  </script>
</body>
</html>