// JavaScript Document
$(document).ready(function() {
  
  $("#china").hover(
    function () { 
      $("#intro-growers").html("<div id='intro-china'><table><tr><td class='td-text'><img src='img/products/pic-goji-powder-2.png' alt='Ningxia China' id='intro-img-1' />In <span id='p-title-map'>China</span>, a part of the <span id='p-title-map'>Ningxia</span> autonomous region, we work with a group of people who harvest goji </p><p>berries and other traditional Chinese herbs, berries and fungus from a wild mountain in a remote region bordering on Mongolia.</td></tr></table></div>");
      $("#intro-china").width(180).css({position: "relative", top: "-726px", left: "12px", padding: "0", border: "3px solid #d5bfb0", "background-color":"#e3d5c6", "font-size": "10px"});
      $("table").css({padding: "0px", margin:"0px", "border-collapse": "collapse"});
      $(".td-text").css({padding: "8px 8px 8px 8px"});
      $("#intro-img-1").css({float: "right", margin: "-11px -11px 0px 4px", width:"66px", border: "8px solid #d5bfb0", "background-color":"#d5bfb0"});     
      $(this).html("<a href='indigenous-growers.php?country=china'><img src='img/growers/countries/china-pink.png' alt='China' /></a>"); 
      $("#indonesia").html("<img src='img/growers/countries/indonesia-red.png' alt='Indonesia' />");
      $("#australia").html("<img src='img/growers/countries/australia-red.png' alt='Australia' />");
      $("#mexico").html("<img src='img/growers/countries/mexico-red.png' alt='Mexico' />"); 
      $("#peru").html("<img src='img/growers/countries/peru-red.png' alt='Peru' />");   
    },
    function () { 
      $("#intro-china").remove("#intro-china");
      $(this).html("<img src='img/growers/countries/china-red.png' alt='China' />");
  });
  $("#indonesia").hover(
    function () { 
      $("#intro-growers").html("<div id='intro-indonesia'><table><tr><td class='td-text'><img src='img/products/pic-cashews-2.png' alt='Isle of Flores Indonesia' id='intro-img-1' />We work with small-scale cashew growers on the <span id='p-title-map'>Isle of Flores</span> in <span id='p-title-map'>Indonesia</span> to develop both ecologica sustainability on these fragile volcanic lands and economic viability from this beautiful product.</td></tr></table></div>");
      $("#intro-indonesia").width(180).css({position: "relative", top: "-532px", left: "54px", padding: "0px", border: "3px solid #d5bfb0", "background-color":"#e3d5c6", "font-size": "10px"});
       $("table").css({padding: "0px", margin:"0px", "border-collapse": "collapse"});
      $(".td-text").css({padding: "8px 8px 8px 8px"});
      $("#intro-img-1").css({float: "right", margin: "-11px -11px 0px 4px", width:"66px", border: "8px solid #d5bfb0", "background-color":"#d5bfb0"});
      $("#china").html("<img src='img/growers/countries/china-red.png' alt='China' />");
      $(this).html("<a href='indigenous-growers.php?country=indonesia'><img src='img/growers/countries/indonesia-pink.png' alt='Indonesia' /></a>");
      $("#australia").html("<img src='img/growers/countries/australia-red.png' alt='Australia' />");
      $("#mexico").html("<img src='img/growers/countries/mexico-red.png' alt='Mexico' />"); 
      $("#peru").html("<img src='img/growers/countries/peru-red.png' alt='Peru' />");
    },
    function () { 
      $("#intro-indonesia").remove("#intro-indonesia");
      $(this).html("<img src='img/growers/countries/indonesia-red.png' alt='Indonesia' />");
  });
  $("#australia").hover(
    function () { 
      $("#intro-growers").html("<div id='intro-australia'><table><tr><td class='td-text'><img src='img/growers/pic-gubinge-3.png' alt='Kimberleys region Australia' id='intro-img-1' />We have just started working with the <span id='p-title-map'>Indigenous Harvest Association (IHA)</span> in the <span id='p-title-map'>Kimberleys</span> to help them commercialize some of their Australian indigenous foods.</td></tr></table></div>");
      $("#intro-australia").width(180).css({position: "relative", top: "-480px", left: "400px", padding: "0", border: "3px solid #d5bfb0", "background-color":"#e3d5c6", "font-size": "10px"});
      $("table").css({padding: "0px", margin:"0px", "border-collapse": "collapse"});
      $(".td-text").css({padding: "8px 8px 8px 8px"});
      $("#intro-img-1").css({float: "right", margin: "-11px -11px 0px 4px", width:"66px", border: "8px solid #d5bfb0", "background-color":"#d5bfb0"});  
      $("#china").html("<img src='img/growers/countries/china-red.png' alt='China' />");
      $("#indonesia").html("<img src='img/growers/countries/indonesia-red.png' alt='Indonesia' />");
      $(this).html("<a href='indigenous-growers.php?country=australia'><img src='img/growers/countries/australia-pink.png' alt='Australia' /></a>");
      $("#mexico").html("<img src='img/growers/countries/mexico-red.png' alt='Mexico' />"); 
      $("#peru").html("<img src='img/growers/countries/peru-red.png' alt='Peru' />");
    },
    function () { 
      $("#intro-australia").remove("#intro-australia");
      $(this).html("<img src='img/growers/countries/australia-red.png' alt='Australia' />");
  });
  $("#mexico").hover(
    function () { 
      $("#intro-growers").html("<div id='intro-mexico'><table><tr><td class='td-text'><img src='img/growers/pic-cacao-2.png' alt='Xoconusco Mexico' id='intro-img-1' />We get our <span id='p-title-map'>Royal Criollo cacao</span> from the region of <span id='p-title-map'>Xoconusco</span> in Mexico. We work with the Mayan network of organic organizations which consists of 1,500 small scale, certified organic, indigenous Mayan growers.</td></tr><tr><td class='td-text'><img src='img/products/pic-agave-3.png' alt='Ixmiquilpan Mexico' id='intro-img-2' />In the <span id='p-title-map'>region of Ixmiquilpan</span> of central Mexico an indigenous group called the Hnahnu have been able to successfully commercialise <span id='p-title-map'>agave syrup</span>. This is a semi arid region and the main species of plant is the wild maguey (Agave salminae).</td></tr><tr><td class='td-text'><img src='img/products/pic-vanilla-3.png' alt='Papantla Mexico' id='intro-img-3' />The association of Local Vanilla Producers of <span id='p-title-map'>Papantla</span> consists of indigenous Totonucan <span id='p-title-map'>vanilla</span> growers. The Totonucans were the people who first domesticated the vanilla vine in pre-hispanic times. Today they continue to grow their vanilla organically mainly on citrus trees.</td></tr></table></div>");
      $("#intro-mexico").width(240).css({position: "relative", top: "-755px", left: "333px", padding: "0", border: "3px solid #d5bfb0", "background-color":"#e3d5c6", "font-size": "10px"});
      $("table").css({padding: "0px", margin:"0px", "border-collapse": "collapse"});
      $(".td-text").css({padding: "8px 8px 8px 8px"});
      $("#intro-img-1").css({float: "right", margin: "-11px -11px 0px 4px", width:"66px", border: "8px solid #d5bfb0", "background-color":"#d5bfb0"});
      $("#intro-img-2").css({float: "left", margin: "0px 8px 0px -11px", width:"66px", border: "8px solid #d5bfb0", "background-color":"#d5bfb0"});
      $("#intro-img-3").css({float: "right", margin: "0px -11px 0px 4px", width:"66px", border: "8px solid #d5bfb0", "background-color":"#d5bfb0"});
      $("#china").html("<img src='img/growers/countries/china-red.png' alt='China' />");
      $("#indonesia").html("<img src='img/growers/countries/indonesia-red.png' alt='Indonesia' />");
      $("#australia").html("<img src='img/growers/countries/australia-red.png' alt='Australia' />");
      $(this).html("<a href='indigenous-growers.php?country=mexico'><img src='img/growers/countries/mexico-pink.png' alt='Mexico' /></a>");
      $("#peru").html("<img src='img/growers/countries/peru-red.png' alt='Peru' />");
    },
    function () { 
      $("#intro-mexico").remove("#intro-mexico");
      $(this).html("<img src='img/growers/countries/mexico-red.png' alt='Mexico' />");
  });
  $("#peru").hover(
    function () { 
      $("#intro-growers").html("<div id='intro-peru'><table><tr><td class='td-text'><img src='img/products/pic-maca-1.png' alt='Junin Peru' id='intro-img-1' />The Association of ecological maca growers of <span id='p-title-map'>Junin</span> in <span id='p-title-map'>Peru</span> consists of approximately 84 families and provides employment for in excess of 150 people during the annual sowing and harvesting of the Maca.</td></tr><tr><td class='td-text'><img src='img/products/pic-powder-3.png' alt='Satipo Peru' id='intro-img-2' /><span id='p-title-map'>Satipo</span> is a region that sits at the edge of Amazon basin at the base of the Andes mountain range. In this area we work with 4 small producer groups that are grouped under the umbrella association of cacao producers of Satipo that consists of 164 families in total.</td></tr></table></div>");
      $("#intro-peru").width(240).css({position: "relative", top: "-538px", left: "412px", border: "3px solid #d5bfb0", "background-color":"#e3d5c6", "font-size": "10px"});
      $("table").css({padding: "0px", margin:"0px", "border-collapse": "collapse"});
      $(".td-text").css({padding: "8px 8px 8px 8px"});
      $("#intro-img-1").css({float: "right", margin: "-11px -11px 0px 4px", width:"66px", border: "8px solid #d5bfb0", "background-color":"#d5bfb0"});
      $("#intro-img-2").css({float: "left", margin: "0px 8px 0px -11px", width:"66px", border: "8px solid #d5bfb0", "background-color":"#d5bfb0"});
      $("#china").html("<img src='img/growers/countries/china-red.png' alt='China' />");
      $("#indonesia").html("<img src='img/growers/countries/indonesia-red.png' alt='Indonesia' />");
      $("#australia").html("<img src='img/growers/countries/australia-red.png' alt='Australia' />");
      $("#mexico").html("<img src='img/growers/countries/mexico-red.png' alt='Mexico' />");
      $(this).html("<a href='indigenous-growers.php?country=peru'><img src='img/growers/countries/peru-pink.png' alt='Peru' /></a>");
    },
    function () { 
      $("#intro-peru").remove("#intro-peru");
      $(this).html("<img src='img/growers/countries/peru-red.png' alt='Peru' />");
      
  });
});