   
function showperiod(p) {
    switch(p) {
    case "p1":
        document.getElementById("tab1").className = "selected";
        document.getElementById("tab2").className = "tabs.li";
        document.getElementById("tab3").className = "tabs.li";
        document.getElementById("tab4").className = "tabs.li";
        document.getElementById("tab5").className = "tabs.li";
        document.getElementById("tab6").className = "tabs.li";
        
        document.getElementById("panel1").style.visibility = "visible";
        document.getElementById("panel2").style.visibility = "hidden";
        document.getElementById("panel3").style.visibility = "hidden";
        document.getElementById("panel4").style.visibility = "hidden";
        document.getElementById("panel5").style.visibility = "hidden";
        document.getElementById("panel6").style.visibility = "hidden";
         break;
    case "p2":
        document.getElementById("tab1").className = "tabs.li";
        document.getElementById("tab2").className = "selected";
        document.getElementById("tab3").className = "tabs.li";
        document.getElementById("tab4").className = "tabs.li";
        document.getElementById("tab5").className = "tabs.li";
        document.getElementById("tab6").className = "tabs.li"; 
              
        document.getElementById("panel1").style.visibility = "hidden";
        document.getElementById("panel2").style.visibility = "visible";
        document.getElementById("panel3").style.visibility = "hidden";
        document.getElementById("panel4").style.visibility = "hidden";
        document.getElementById("panel5").style.visibility = "hidden";
        document.getElementById("panel6").style.visibility = "hidden";
        break;
  case "p3":
        document.getElementById("tab1").className = "tabs.li";
        document.getElementById("tab2").className = "tabs.li";
        document.getElementById("tab3").className = "selected";
        document.getElementById("tab4").className = "tabs.li";
        document.getElementById("tab5").className = "tabs.li";
        document.getElementById("tab6").className = "tabs.li";
        
        document.getElementById("panel1").style.visibility = "hidden";
        document.getElementById("panel2").style.visibility = "hidden";
        document.getElementById("panel3").style.visibility = "visible";
        document.getElementById("panel4").style.visibility = "hidden";
        document.getElementById("panel5").style.visibility = "hidden";
        document.getElementById("panel6").style.visibility = "hidden";
        break;
         
         
 case "p4":
        document.getElementById("tab1").className = "tabs.li";
        document.getElementById("tab2").className = "tabs.li";
        document.getElementById("tab3").className = "tabs.li";
        document.getElementById("tab4").className = "selected";
        document.getElementById("tab5").className = "tabs.li";
        document.getElementById("tab6").className = "tabs.li";
        
        document.getElementById("panel1").style.visibility = "hidden";
        document.getElementById("panel2").style.visibility = "hidden";
        document.getElementById("panel3").style.visibility = "hidden";
        document.getElementById("panel4").style.visibility = "visible";
        document.getElementById("panel5").style.visibility = "hidden";
        document.getElementById("panel6").style.visibility = "hidden";
        break;
 
  case "p5":
        document.getElementById("tab1").className = "tabs.li";
        document.getElementById("tab2").className = "tabs.li";
        document.getElementById("tab3").className = "tabs.li";
        document.getElementById("tab4").className = "tabs.li";
        document.getElementById("tab5").className = "selected";
        document.getElementById("tab6").className = "tabs.li";
        
        document.getElementById("panel1").style.visibility = "hidden";
        document.getElementById("panel2").style.visibility = "hidden";
        document.getElementById("panel3").style.visibility = "hidden";
        document.getElementById("panel4").style.visibility = "hidden";
        document.getElementById("panel5").style.visibility = "visible";
        document.getElementById("panel6").style.visibility = "hidden";
        break;
        
   case "p6":
        document.getElementById("tab1").className = "tabs.li";
        document.getElementById("tab2").className = "tabs.li";
        document.getElementById("tab3").className = "tabs.li";
        document.getElementById("tab4").className = "tabs.li";
        document.getElementById("tab5").className = "tabs.li";
        document.getElementById("tab6").className = "selected";
        
        document.getElementById("panel1").style.visibility = "hidden";
        document.getElementById("panel2").style.visibility = "hidden";
        document.getElementById("panel3").style.visibility = "hidden";
        document.getElementById("panel4").style.visibility = "hidden";
        document.getElementById("panel5").style.visibility = "hidden";
        document.getElementById("panel6").style.visibility = "visible";
        break;   
 }
}

function showperiodnu(p) {
    switch(p) {
    case "p1":
        document.getElementById("tab1").className = "selected";
        document.getElementById("tab2").className = "tabs.li";
        document.getElementById("tab3").className = "tabs.li";
        document.getElementById("tab4").className = "tabs.li";

        
        document.getElementById("panel1").style.visibility = "visible";
        document.getElementById("panel2").style.visibility = "hidden";
        document.getElementById("panel3").style.visibility = "hidden";
        document.getElementById("panel4").style.visibility = "hidden";

         break;
    case "p2":
        document.getElementById("tab1").className = "tabs.li";
        document.getElementById("tab2").className = "selected";
        document.getElementById("tab3").className = "tabs.li";
        document.getElementById("tab4").className = "tabs.li";

              
        document.getElementById("panel1").style.visibility = "hidden";
        document.getElementById("panel2").style.visibility = "visible";
        document.getElementById("panel3").style.visibility = "hidden";
        document.getElementById("panel4").style.visibility = "hidden";

        break;
  case "p3":
        document.getElementById("tab1").className = "tabs.li";
        document.getElementById("tab2").className = "tabs.li";
        document.getElementById("tab3").className = "selected";
        document.getElementById("tab4").className = "tabs.li";

        
        document.getElementById("panel1").style.visibility = "hidden";
        document.getElementById("panel2").style.visibility = "hidden";
        document.getElementById("panel3").style.visibility = "visible";
        document.getElementById("panel4").style.visibility = "hidden";

        break;
         
         
 case "p4":
        document.getElementById("tab1").className = "tabs.li";
        document.getElementById("tab2").className = "tabs.li";
        document.getElementById("tab3").className = "tabs.li";
        document.getElementById("tab4").className = "selected";

        
        document.getElementById("panel1").style.visibility = "hidden";
        document.getElementById("panel2").style.visibility = "hidden";
        document.getElementById("panel3").style.visibility = "hidden";
        document.getElementById("panel4").style.visibility = "visible";

        break;
         }
}