Accordion using CSS3 animation

Accordion Using CSS3 Transitions and HTML 5 elements (Try Chrome or Safari to see it correctly!! They Half work on FF
)-

Example uses:
-webkit-transition-property:width,opacity;
-webkit-transition-duration: 1s,1s;
-webkit-transition-timing-function:ease,linear;

Styles –

section,header,figure,aside,footer{
display:block
}
body{
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
color:#333;
background:#333;
}
a{
color:#fff;
font-weight:bold;
text-shadow:#FFF;
text-decoration:none;
padding:5px;
background-color:#C93;
}
div{
height:300px;
width:60px;
background-color:#CCC;
padding:10px;
float:left;
}
.accordion
{
float:left;
height:200px;
width:auto;
overflow:hidden;
background-color:#9C0;
border:thin dotted #ccc;
}
.accordion p:target
{
width:500px;
opacity:1;
background-color:#9CC;
padding:10px;
margin:10px;
-webkit-border-radius:10px;
}
.accordion p{
width:60px;
opacity:0;
-webkit-transition-property:width,opacity;
-webkit-transition-duration: 1s,1s;
-webkit-transition-timing-function:ease,linear;

}