/* ================================================================ 
This copyright notice must be kept untouched in the stylesheet at 
all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menu/cssplay-rotating-panels.html
Copyright (c) Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
#outer {width:600px; height:400px; position:relative; margin:50px auto;}
#outer input {display:none;}
#outer div {width:250px; height:350px; padding:25px; position:absolute; top:0; left:150px; background:#fff; border-radius:5px; z-index:80; box-shadow:0 5px 10px rgba(0,0,0,0.5);
-webkit-transform: translate3d(0.5, 0.5, 0);
-webkit-backface-visibility: hidden;
-webkit-perspective: 1000;
transform: translate3d(0.5, 0.5, 0);

transform: scale(0.5, 0.5);
-o-transform: scale(0.5, 0.5);
-ms-transform: scale(0.5, 0.5);
-webkit-transform: scale(0.5, 0.5);
transition:0.75s;
-o-transition:0.75s;
-moz-transition:0.75s;
-webkit-transition:0.75s;

}
#outer label {display:block; width:100%; height:100%; z-index:100; cursor:pointer; position:absolute; left:0; top:0; background:url(trans.gif);
-webkit-tap-highlight-color:rgba(0,0,0,0);
tap-highlight-color:rgba(0,0,0,0);
}
#outer h2 {padding:20px 0; margin:0; font:600 22px/40px 'Open Sans', arial, sans-serif; color:#2e6faf;}
#outer p {padding:0; margin:0; font:400 13px/18px 'Open Sans', arial, sans-serif; color:#444;}
#outer p a {color:#080;}
#outer p a:hover {text-decoration:none;}

#panel1l:checked ~ div.p1,
#panel2l:checked ~ div.p2,
#panel3l:checked ~ div.p3,
#panel4l:checked ~ div.p4,
#panel5l:checked ~ div.p5,
#panel6l:checked ~ div.p6,
#panel7l:checked ~ div.p7,
#panel8l:checked ~ div.p8,
#panel9l:checked ~ div.p9,
#panel10l:checked ~ div.p10,
#panel11l:checked ~ div.p11,
#panel12l:checked ~ div.p12,
#panel13l:checked ~ div.p13,
#panel14l:checked ~ div.p14,
#panel15l:checked ~ div.p15,
#panel16l:checked ~ div.p16,
#panel17l:checked ~ div.p17,
#panel18l:checked ~ div.p18,
#panel1r:checked ~ div.p1,
#panel2r:checked ~ div.p2,
#panel3r:checked ~ div.p3,
#panel4r:checked ~ div.p4,
#panel5r:checked ~ div.p5,
#panel6r:checked ~ div.p6,
#panel7r:checked ~ div.p7,
#panel8r:checked ~ div.p8,
#panel9r:checked ~ div.p9,
#panel10r:checked ~ div.p10,
#panel11r:checked ~ div.p11,
#panel12r:checked ~ div.p12,
#panel13r:checked ~ div.p13,
#panel14r:checked ~ div.p14,
#panel15r:checked ~ div.p15,
#panel16r:checked ~ div.p16,
#panel17r:checked ~ div.p17,
#panel18r:checked ~ div.p18

{left:150px; z-index:100; box-shadow:0 5px 20px rgba(0,0,0,0.5);
transform: scale(1,1);
-o-transform: scale(1,1);
-ms-transform: scale(1,1);
-webkit-transform: scale(1,1);
}
#panel1l:checked ~ div.p2,
#panel2l:checked ~ div.p3,
#panel3l:checked ~ div.p4,
#panel4l:checked ~ div.p5,
#panel5l:checked ~ div.p6,
#panel6l:checked ~ div.p7,
#panel7l:checked ~ div.p8,
#panel8l:checked ~ div.p9,
#panel9l:checked ~ div.p10,
#panel10l:checked ~ div.p11,
#panel11l:checked ~ div.p12,
#panel12l:checked ~ div.p13,
#panel13l:checked ~ div.p14,
#panel14l:checked ~ div.p15,
#panel15l:checked ~ div.p16,
#panel16l:checked ~ div.p17,
#panel17l:checked ~ div.p18,
#panel18l:checked ~ div.p1,
#panel1r:checked ~ div.p2,
#panel2r:checked ~ div.p3,
#panel3r:checked ~ div.p4,
#panel4r:checked ~ div.p5,
#panel5r:checked ~ div.p6,
#panel6r:checked ~ div.p7,
#panel7r:checked ~ div.p8,
#panel8r:checked ~ div.p9,
#panel9r:checked ~ div.p10,
#panel10r:checked ~ div.p11,
#panel11r:checked ~ div.p12,
#panel12r:checked ~ div.p13,
#panel13r:checked ~ div.p14,
#panel14r:checked ~ div.p15,
#panel15r:checked ~ div.p16,
#panel16r:checked ~ div.p17,
#panel17r:checked ~ div.p18,
#panel18r:checked ~ div.p1

{left:300px; z-index:90;
transform: scale(0.75, 0.75);
-o-transform: scale(0.75, 0.75);
-ms-transform: scale(0.75, 0.75);
-webkit-transform: scale(0.75, 0.75);
}
#panel1l:checked ~ div.p18,
#panel2l:checked ~ div.p1,
#panel3l:checked ~ div.p2,
#panel4l:checked ~ div.p3,
#panel5l:checked ~ div.p4,
#panel6l:checked ~ div.p5,
#panel7l:checked ~ div.p6,
#panel8l:checked ~ div.p7,
#panel9l:checked ~ div.p8,
#panel10l:checked ~ div.p9,
#panel11l:checked ~ div.p10,
#panel12l:checked ~ div.p11,
#panel13l:checked ~ div.p12,
#panel14l:checked ~ div.p13,
#panel15l:checked ~ div.p14,
#panel16l:checked ~ div.p15,
#panel17l:checked ~ div.p16,
#panel18l:checked ~ div.p17,
#panel1r:checked ~ div.p18,
#panel2r:checked ~ div.p1,
#panel3r:checked ~ div.p2,
#panel4r:checked ~ div.p3,
#panel5r:checked ~ div.p4,
#panel6r:checked ~ div.p5,
#panel7r:checked ~ div.p6,
#panel8r:checked ~ div.p7,
#panel9r:checked ~ div.p8,
#panel10r:checked ~ div.p9,
#panel11r:checked ~ div.p10,
#panel12r:checked ~ div.p11,
#panel13r:checked ~ div.p12,
#panel14r:checked ~ div.p13,
#panel15r:checked ~ div.p14,
#panel16r:checked ~ div.p15,
#panel17r:checked ~ div.p16,
#panel18r:checked ~ div.p17


{left:0; z-index:90;
transform: scale(0.75, 0.75);
-o-transform: scale(0.75, 0.75);
-ms-transform: scale(0.75, 0.75);
-webkit-transform: scale(0.75, 0.75);
}
#panel1l:checked ~ div.p2 label.left {display:none;}
#panel1l:checked ~ div.p1 label {display:none;}
#panel1l:checked ~ div.p18 label.right {display:none;}

#panel18l:checked ~ div.p1 label.left {display:none;}
#panel18l:checked ~ div.p18 label {display:none;}
#panel18l:checked ~ div.p17 label.right {display:none;}

#panel17l:checked ~ div.p18 label.left {display:none;}
#panel17l:checked ~ div.p17 label {display:none;}
#panel17l:checked ~ div.p16 label.right {display:none;}

#panel16l:checked ~ div.p17 label.left {display:none;}
#panel16l:checked ~ div.p16 label {display:none;}
#panel16l:checked ~ div.p15 label.right {display:none;}

#panel15l:checked ~ div.p16 label.left {display:none;}
#panel15l:checked ~ div.p15 label {display:none;}
#panel15l:checked ~ div.p14 label.right {display:none;}

#panel14l:checked ~ div.p15 label.left {display:none;}
#panel14l:checked ~ div.p14 label {display:none;}
#panel14l:checked ~ div.p13 label.right {display:none;}

#panel13l:checked ~ div.p14 label.left {display:none;}
#panel13l:checked ~ div.p13 label {display:none;}
#panel13l:checked ~ div.p12 label.right {display:none;}

#panel12l:checked ~ div.p13 label.left {display:none;}
#panel12l:checked ~ div.p12 label {display:none;}
#panel12l:checked ~ div.p11 label.right {display:none;}

#panel11l:checked ~ div.p12 label.left {display:none;}
#panel11l:checked ~ div.p11 label {display:none;}
#panel11l:checked ~ div.p10 label.right {display:none;}

#panel10l:checked ~ div.p11 label.left {display:none;}
#panel10l:checked ~ div.p10 label {display:none;}
#panel10l:checked ~ div.p9 label.right {display:none;}

#panel9l:checked ~ div.p10 label.left {display:none;}
#panel9l:checked ~ div.p9 label {display:none;}
#panel9l:checked ~ div.p8 label.right {display:none;}

#panel8l:checked ~ div.p9 label.left {display:none;}
#panel8l:checked ~ div.p8 label {display:none;}
#panel8l:checked ~ div.p7 label.right {display:none;}

#panel7l:checked ~ div.p8 label.left {display:none;}
#panel7l:checked ~ div.p7 label {display:none;}
#panel7l:checked ~ div.p6 label.right {display:none;}

#panel6l:checked ~ div.p7 label.left {display:none;}
#panel6l:checked ~ div.p6 label {display:none;}
#panel6l:checked ~ div.p5 label.right {display:none;}

#panel5l:checked ~ div.p6 label.left {display:none;}
#panel5l:checked ~ div.p5 label {display:none;}
#panel5l:checked ~ div.p4 label.right {display:none;}

#panel4l:checked ~ div.p5 label.left {display:none;}
#panel4l:checked ~ div.p4 label {display:none;}
#panel4l:checked ~ div.p3 label.right {display:none;}

#panel3l:checked ~ div.p4 label.left {display:none;}
#panel3l:checked ~ div.p3 label {display:none;}
#panel3l:checked ~ div.p2 label.right {display:none;}

#panel2l:checked ~ div.p3 label.left {display:none;}
#panel2l:checked ~ div.p2 label {display:none;}
#panel2l:checked ~ div.p1 label.right {display:none;}

#panel1r:checked ~ div.p2 label.right {display:none;}
#panel1r:checked ~ div.p1 label {display:none;}
#panel1r:checked ~ div.p18 label.left {display:none;}

#panel18r:checked ~ div.p1 label.right {display:none;}
#panel18r:checked ~ div.p18 label {display:none;}
#panel18r:checked ~ div.p17 label.left {display:none;}

#panel17r:checked ~ div.p18 label.right {display:none;}
#panel17r:checked ~ div.p17 label {display:none;}
#panel17r:checked ~ div.p16 label.left {display:none;}

#panel16r:checked ~ div.p17 label.right {display:none;}
#panel16r:checked ~ div.p16 label {display:none;}
#panel16r:checked ~ div.p15 label.left {display:none;}

#panel15r:checked ~ div.p16 label.right {display:none;}
#panel15r:checked ~ div.p15 label {display:none;}
#panel15r:checked ~ div.p14 label.left {display:none;}

#panel14r:checked ~ div.p15 label.right {display:none;}
#panel14r:checked ~ div.p14 label {display:none;}
#panel14r:checked ~ div.p13 label.left {display:none;}

#panel13r:checked ~ div.p14 label.right {display:none;}
#panel13r:checked ~ div.p13 label {display:none;}
#panel13r:checked ~ div.p12 label.left {display:none;}

#panel12r:checked ~ div.p13 label.right {display:none;}
#panel12r:checked ~ div.p12 label {display:none;}
#panel12r:checked ~ div.p11 label.left {display:none;}

#panel11r:checked ~ div.p12 label.right {display:none;}
#panel11r:checked ~ div.p11 label {display:none;}
#panel11r:checked ~ div.p10 label.left {display:none;}

#panel10r:checked ~ div.p11 label.right {display:none;}
#panel10r:checked ~ div.p10 label {display:none;}
#panel10r:checked ~ div.p9 label.left {display:none;}

#panel9r:checked ~ div.p10 label.right {display:none;}
#panel9r:checked ~ div.p9 label {display:none;}
#panel9r:checked ~ div.p8 label.left {display:none;}

#panel8r:checked ~ div.p9 label.right {display:none;}
#panel8r:checked ~ div.p8 label {display:none;}
#panel8r:checked ~ div.p7 label.left {display:none;}

#panel7r:checked ~ div.p8 label.right {display:none;}
#panel7r:checked ~ div.p7 label {display:none;}
#panel7r:checked ~ div.p6 label.left {display:none;}

#panel6r:checked ~ div.p7 label.right {display:none;}
#panel6r:checked ~ div.p6 label {display:none;}
#panel6r:checked ~ div.p5 label.left {display:none;}

#panel5r:checked ~ div.p6 label.right {display:none;}
#panel5r:checked ~ div.p5 label {display:none;}
#panel5r:checked ~ div.p4 label.left {display:none;}

#panel4r:checked ~ div.p5 label.right {display:none;}
#panel4r:checked ~ div.p4 label {display:none;}
#panel4r:checked ~ div.p3 label.left {display:none;}

#panel3r:checked ~ div.p4 label.right {display:none;}
#panel3r:checked ~ div.p3 label {display:none;}
#panel3r:checked ~ div.p2 label.left {display:none;}

#panel2r:checked ~ div.p3 label.right {display:none;}
#panel2r:checked ~ div.p2 label {display:none;}
#panel2r:checked ~ div.p1 label.left {display:none;}
