Show DIV based on select list value and checked checkboxes

i have this form:

<form action="ServletAjoutEns" name="inscription" method="post">

<select name="grade" onchange="validation()">
           <option value="0">--Selectionner un grade--</option>
           <option value="Professeur">Professeur</option>
           <option value="Maitre de conférences">Maitre de conférences</option>
           <option value="Maitre assistant">Maitre assistant</option>
           <option value="Assistant">Assistant</option>

 </select>

      <input type="checkbox" id="departement" name="departement" value="multimedia" onclick="validation()"> Multimédia

     <input type="checkbox" id="departement" name="departement" value="reseaux" onclick="validation()"> Réseaux

     <input type="checkbox" id="type" name="type" value="cours" onclick="validation()"> Cours

     <input type="checkbox" id="type" name="type" value="tp" onclick="validation()"> TP
</form>

i want when the item selected is different from '0' and any of the 2 checkboxes 'departement' is checked and the same with 'type' then i want to show a div with id='btn'.

i wrote this javascript function:

function validation() {
if(document.inscription.grade.value!="0" && document.getElementById("departement").checked == true && document.getElementById("type").checked == true)
    document.getElementById('btn').style.display = 'block';
else
    document.getElementById('btn').style.display = 'none';

}

but it works only when all the checkboxes are checked, how can i make it work when at least one of each checkbox items is checked