[CSS]zależne div-y rozwijalne Opcje

[krzesik]

Witam,

mam dwa divy, które po naciśnięciu się rozwijają:

[HTML] pobierz, plaintext 
    <script type="text/javascript">
function op1(obj) {
x=document.getElementById(obj);
$(x).slideToggle( "slow" );
}
</script>
<div style="margin: 5px 5px 5px 5px; border-radius: 5px; background-color: #009999; font-size:25px; color: yellow; font-weight: bold; padding: 25px 25px 25px 25px; cursor: pointer"
             onclick="op1('poka12')">Przypominajka
             <span class="glyphicon glyphicon-chevron-right" style="float:right;"></span></input>
</div>
<div style="display: none" id="poka12">
<div id="poka12">
.......
</div>
</div>
 
    <script type="text/javascript">
function op2(obj) {
x=document.getElementById(obj);
$(x).slideToggle( "slow" );
}
</script>
<div style="margin: 5px 5px 5px 5px; border-radius: 5px; background-color: #009999; font-size:25px; color: yellow; font-weight: bold; padding: 25px 25px 25px 25px; cursor: pointer"
             onclick="op2('poka11')">Przypominajka 2
             <span class="glyphicon glyphicon-chevron-right" style="float:right;"></span></input>
</div>
<div style="display: none" id="poka11">
<div id="poka11">
.......
</div>
</div>
[HTML] pobierz, plaintext 

jak zrobić, aby nie można było rozwinąć ich jednocześnie? Czyli jeden jest rozwinięty, rozwijając drugi zwija się pierwszy? Nie mogę sobie z tym poradzić.....