#test.test{
grid-template-areas:"a" "b" "c" "d" "e" "f" "g" "h" "i" "j";
grid-template-rows: 240px 480px 240px 240px 240px 240px 240px 240px 480px 240px
}
@media screen and (min-width:990px){
#test.test{
grid-template-areas:
"a a a"
"c d b"
"e f b"
"g h h"
"i i i"
"j j j";
grid-template-columns:360px 360px 360px;
grid-template-rows: 240px 240px 240px 240px 480px 240px
}
}
#test {
display: grid;
}
.test, .test-section {
vertical-align: top;
margin: 1px;
width: calc(100% - 4px);
height: calc(100% - 4px);
opacity: 0.3;
transform: /*rotateZ(5deg)*/ rotateY(180deg);
transition: 500ms cubic-bezier(0.25, 0.25, 0, 1);
}
.test:hover, .test-section:hover {
transform: /*rotateZ(0deg)*/ rotateY(0deg);
opacity: 1
}
/* 二級標題 */
.h2 {
border-bottom:none;
}
.mw-headline-number {
color:#cccccc
}
/* 信息框 */
table.test-infobox {
border: 1px #999999 solid;
}
table.test-infobox > tbody > tr > td , table.test-infobox > tbody > tr > th {
text-align:center;
}
table.test-infobox > tbody > tr > th {
width:80px;
}
/* 簽名區域 */
div.sign-area:hover {
padding-left: 48px;
transition: 1.5s cubic-bezier(0.68, -0.55, 0.27, 1.55);
}
div.sign-area > *:hover {
transition: 1.5s cubic-bezier(0.3, 1.3, 0.6, -0.4);
transform: scale(1.15);
cursor: progress;
width: 580px;
}