@font-face {
  font-family: 'Orbitron';
  font-style: normal;
  font-weight: 900;
  src: local('Orbitron-Black'), url(/20230901220357oe_/https://www.ilc.cuhk.edu.hk/workshop/LearningApps/font/Orbitron_Black.otf) format('opentype');
}

p{ font-size:15px; line-height:1.4em; }

body { text-align:center; background:url('/20230901220357oe_/https://www.ilc.cuhk.edu.hk/workshop/LearningApps/img/escheresque2.png'); position:relative; }
.hide { display:none; }

#pageContainer{ text-align:left; margin:0 auto; width:900px; background:#FFFFFF; box-shadow: 0 0 25px #999999; border-width:0 1px 0 1px; }
/*#pageContainer{ background: rgba(255,255,255,0.1); }*/
/*#pageContainer::before{ content:''; background:rgba(190,100,100,0.3); height:535px; display:block; position:absolute; top:150px; left:0; width:100%; z-index:-1; }*/
/*#pageContainer::before{ content:''; background:url('/20230901220357oe_/https://www.ilc.cuhk.edu.hk/workshop/LearningApps/img/tan_BG.png') repeat; height:535px; display:block; position:absolute; top:150px; left:0; width:100%; z-index:-1; }*/
#pageBG{ background:url('/20230901220357oe_/https://www.ilc.cuhk.edu.hk/workshop/LearningApps/img/tan_BG.png') repeat; height:535px; display:block; position:absolute; top:150px; left:0; width:100%; z-index:-1; }

#header{height:155px; position:relative; background:url('/20230901220357oe_/https://www.ilc.cuhk.edu.hk/workshop/LearningApps/img/headerBand.png') no-repeat bottom right; }
#cuhk, #ilc, #lApp{padding:0; margin:0; position:absolute; z-index:99;}
#cuhk{right: 7px; bottom: 7px; background:url('/20230901220357oe_/https://www.ilc.cuhk.edu.hk/workshop/LearningApps/img/cuhkLogo.png') no-repeat; }
#ilc{right: 69px; bottom: 7px; background:url('/20230901220357oe_/https://www.ilc.cuhk.edu.hk/workshop/LearningApps/img/ilcLogo.png') no-repeat; }
#cuhk a, #ilc a, #lApp a{ display:block; height:100%; }
#cuhk, #ilc{ width:55px; height:45px; }
#lApp{ width:306px; height:129px; background:url('/20230901220357oe_/https://www.ilc.cuhk.edu.hk/workshop/LearningApps/img/logo.png') no-repeat; bottom:10px; left:30px; }

#tan{ height:520px; background:url('/20230901220357oe_/https://www.ilc.cuhk.edu.hk/workshop/LearningApps/img/tan_BG.png') no-repeat #FFFFFF; position:relative; }
#tan{ border:2px solid #EEEEEE; border-width:1px 0 4px 0; }
#tan{ box-shadow:5px inset #333333; }

#tanSVG{ position:absolute; top:-100px; left:-100px; z-index:59; }

#tanRotate{ position:absolute; display:block; top:40px; left:30px; z-index:49; }
#tanRotate{ transform-origin:top left; transform:rotate(-10deg); -webkit-transform-origin:top left; -webkit-transform:rotate(-10deg); }
/*
#tanRotate{ 
   -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.984807753012208, M12=0.17364817766692994, M21=-0.17364817766692994, M22=0.984807753012208, SizingMethod='auto expand')";
   
   filter: progid:DXImageTransform.Microsoft.Matrix(
            M11=0.984807753012208,
            M12=0.17364817766692994,
            M21=-0.17364817766692994,
            M22=0.984807753012208,
            SizingMethod='auto expand');
}*/

#tanRotate{ box-shadow: 0 0 25px #333333; }

#bodyContainer{padding:55px 80px 50px 50px; position:relative; }
#bodyContainer{ background:url('/20230901220357oe_/https://www.ilc.cuhk.edu.hk/workshop/LearningApps/img/bodyBand.png') no-repeat top left; }

h3 {font-family:'Orbitron'; text-transform:uppercase; }
.sideTitle{ position:absolute; top:-490px; right:1.1em; font-size:85px; margin:0; padding:0; z-index:10; color:#BBBBBB; text-transform:uppercase; overflow:visible; white-space:nowrap; text-align:right; letter-spacing:-2px; }
.sideTitle{ transform:rotate(-90deg); transform-origin:right top; -webkit-transform: rotate(-90deg); -webkit-transform-origin:right top; opacity:0.5; }


#menuBar{ position:fixed; top:0px; left:0; z-index:999; width:100%; text-align:center; display:none; }
#menuBar ul{ display:block; list-style:none; margin:0 auto; padding:0; width:900px; text-align:left; background:rgba(20,20,20,0.8);  }
#menuBar li{ display:block; float:left; margin:0; }
#menuBar a{ color:inherit; text-decoration:none; font-size:14px; padding:10px 6px; margin:0; color:#EEE; }
#menuBar a:hover{ background:#B72866; color:#FFF; }
/*#menuBar li:before, #menuBar li:last-child:after{ display:inline; content:'|'; margin:0 4px; color:#666; font-size:13px; }*/

.mainTitle{ font-size:25px; }
.mainTitle::after{ content:''; display:block; width: 100px; height:111px; position:absolute; top:-45px; left:45px; background:url('/20230901220357oe_/https://www.ilc.cuhk.edu.hk/workshop/LearningApps/img/titleArrow.png') no-repeat; }


.appList{ list-style:none; margin:0; padding:0; }
.appList li{ display:inline-block; margin:0 15px 0 0; text-align:center; }
.appName{ display:block; text-align:center; padding:3px 0 6px 0; }

.appList a:hover .appName{ color:#e1337e; }
.appList a{ text-decoration:none; color:inherit; display:inline-block; }
.appList img{ border:0; border:1px solid #DDDDDD; box-shadow: 4px 4px 10px #E0E0E0; }
.appList a:hover img{ box-shadow: 4px 4px 10px #FFFFE0; }




#footer{ padding:10px 20px 20px 20px; margin: 400px 0 0 0; background:#F5F5EF; border-top:1px solid #CCCCC0; text-align:right; font-size:12px;  }

/**/
#footer{background:url('/20230901220357oe_/https://www.ilc.cuhk.edu.hk/workshop/LearningApps/img/footerBG.png') no-repeat bottom; color:#d39bb3; }