/* ED338C */
/* 95C950 */

body {
	font-family:'Lato', Arial, sans-serif;
	font-weight:normal;
	font-size:16px;
}
:lang(zh){
	font-family:'Lato', 'Noto Sans T Chinese', 'Heiti TC', 'Microsoft Jhenghei', Arial;
}
:lang(zh) .glyphicon{font-family: 'Glyphicons Halflings';}

.text-xs-left { text-align: left; }
.text-xs-right { text-align: right; }
.text-xs-center { text-align: center; }
.text-xs-justify { text-align: justify; }
@media (min-width: 768px) {
  .text-sm-left { text-align: left; }
  .text-sm-right { text-align: right; }
  .text-sm-center { text-align: center; }
  .text-sm-justify { text-align: justify; }
}
@media (min-width: 992px) {
  .text-md-left { text-align: left; }
  .text-md-right { text-align: right; }
  .text-md-center { text-align: center; }
  .text-md-justify { text-align: justify; }
  body{font-size:18px;}
}
@media (min-width: 1200px) {
  .text-lg-left { text-align: left; }
  .text-lg-right { text-align: right; }
  .text-lg-center { text-align: center; }
  .text-lg-justify { text-align: justify; }
}

/*@media only screen and (min-width : 768px) {*/
	.flex-row.row {
		display: flex;
		flex-wrap: wrap;
		position:relative;
	}
	.flex-row.row > [class*='col-'] {
		display: flex;
		flex-direction: column;
		position:relative;
	}
/*}*/


.greyJumbotron{background:#EEE;}
.sideNote{color:#999; font-weight:200;}
.greyJumbotron .sideNote{color:#999;}
.vCenter_Holder{display:table; width:100%; height:100%;}
.vCenter_Cnt{display:table-cell; vertical-align:middle; text-align:center;}
.hoverOverlay{position:relative;}
.hoverOverlay::before{content:''; display:block; opacity:0; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0, 0.7); transition:ease-in-out 0.3s;}
.separator::after{display:block; content:''; width:60%; border-bottom:1px solid #F0F0F0; margin:auto auto;}
.article{padding:30px 0; margin:40px 0;}
.article2{padding:50px 0; margin:40px 0;}
.article-nm{padding:30px 0;}
.article2-nm{padding:50px 0;}
h2{position:relative; padding-bottom:15px; margin-bottom:20px;}
.text-center h2{display:inline-block; margin-bottom:50px;}
h2::after{display:block; content:''; position:absolute; bottom:0; left:2px; border:2px solid #ED338C; width:30px}
.cb_wrapper{display:flex; align-items:center; justify-content:center; height:100%;}
.cb{}


.header .topBar{background:transparent; width:100%; }
.header .topBar, .header .headerNav{position:fixed; height:60px; line-height:57px; transition:ease-in-out 0.2s; z-index:999;}
.header a.siteLogo{display:block; width:255px; height:60px; background:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/ISDSEx_Logo.png) no-repeat center center; background-size:contain; transition:ease-in-out 0.4s; transition-delay:0.1s; position:fixed; top:0; right:0;}
.header.solid .topBar{background:rgba(0,0,0, 0.8); box-shadow:rgba(0,0,0,0.5) 0px 0px 10px; }
.header.solid .topBar, .header.solid .headerNav.normal {height:45px; line-height:42px;}
.header.solid a.siteLogo{height:45px; width:191px;}
.header.solid .normal a{font-size:95%;}
.header.solid .normal a.active{color:#95C950;}

.headerNav.normal ul{margin:0; padding:0; height:100%; display:block; }
.headerNav.normal li { display:inline-block; height:100%; margin:0; padding:0;}
.headerNav.normal li a{display:inline-block; color:#FFF; font-size:100%; vertical-align:middle; padding:0 0.75em; font-weight:200; border-bottom:3px solid transparent;}
.headerNav.normal li a:hover{text-decoration:none; border-color:#FFF;}
.headerNav.normal li a.active{border-color:#95C950;}
.header li a.langBtn:hover{border-color:transparent;}
.header .headerNav.normal li a.langBtn{ border-radius:3px; display:inline; padding:3px 7px 1px 7px; background:rgba(125, 163, 75, 0.8);}
.header.solid .headerNav.normal li a.langBtn{border:1px solid #95C950; color:#95C950; background:none; }

.headerNav .head{visibility:hidden; display:none;}
.headerNav.fullscreen .head{visibility:visible; display:block;}
.headerNav.fullscreen .head .glyphicon-menu-hamburger{font-size:25px; padding:7px 13px; color:#FFF; }

.headerNav.fullscreen.active{height:100%; width:100%; background:rgba(0,0,0,0.95); font-size:200%; font-weight:200; overflow-x:hidden; overflow-y:scroll;}
.headerNav.fullscreen.active ul{visibility:visible;}
.headerNav.fullscreen ul{list-style:none; margin:0; padding:0; visibility:hidden; text-align:center; }
.headerNav.fullscreen ul li{margin:0; padding:0;}
.headerNav.fullscreen ul li a{color:#FFF; border-bottom:1px solid #111; display:block; padding:20px; text-decoration:none;}
.headerNav.fullscreen ul li a.active{color:#95C950;}
.headerNav.fullscreen ul li a:hover{background:rgba(255,255,255,0.5); border-color:#FFF;}


.CUHKLogo, .ILCLogo{display:inline-block; width:70px; height:70px; background-position:center center; background-repeat:no-repeat; background-size:contain;}
.CUHKLogo{background-image:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/logo_cuhk.png)}
.ILCLogo{background-image:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/logo_ilc.png);}

.resourceSlide{overflow:hidden; white-space:nowrap;}


/****************************/
/*** Page Hero            ***/
/****************************/
.pageHero{width:100%; height:850px; padding-top:60px; background-repeat:no-repeat; background-position:bottom center; background-size:cover; color:#FFF; margin-bottom:20px;}
.pageHero .cnt{margin:190px 120px;}
.pageHero h1{font-size:550%; text-shadow:0px 0px 10px rgba(0,0,0,0.5); font-weight:200; line-height:0.85em; letter-spacing:-0.03em; word-spacing:0.03em; margin-top:0;}
.pageHero .tagline{font-size:150%; text-shadow:0px 0px 10px rgba(0,0,0,0.5); font-weight:200; color:#FCF5AB; letter-spacing:0.25em; word-spacing:0.5em;}
.pageHero .btn{padding:3px 25px; background:#95C950; font-size:110%; color:#FFF; border-radius:5px; box-shadow:rgba(0,0,0,0.2) 0px 0px 20px;}
@media (max-width: 992px) {
	.CUHKLogo, .ILCLogo{width:60px; height:60px;}
	.pageHero h1{font-size:400%; word-spacing:0;}
	.pageHero .tagline{letter-spacing:0.15em; word-spacing:0.3em;}
	.pageHero .cnt{margin:150px 00px;}
	.pageHero{height:650px;}
}
@media (max-width: 768px) {
	.pageHero{height:500px; padding:0; margin:0; overflow:hidden; /*visibility:hidden;*/ font-size:71%;}
	.pageHero .cnt{margin:150px 50px;}
	.pageHero h1{margin-top:0;}
	.CUHKLogo, .ILCLogo{width:50px; height:50px;}
}


/****************************/
/*** Footer               ***/
/****************************/
.footer{ background:#444; font-size:80%; padding:20px 0 5px 0; color:#777; line-height:1.9em;}
.footer address{line-height:1.9em;}
.footer h5{color:#FFF; font-size:130%;}
.footer ul{list-style:none; padding:0; margin:0;}
.footer a{color:inherit;}
.footer .copyright{padding:7px; border-top:1px solid #555; margin-top:50px;}



/****************************/
/*** Login Page           ***/
/****************************/
.loginPage {display:block; width:100%; height:100%; background:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/BG_Intro1.jpg) no-repeat center center; background-size:cover; }
.loginPage .cnt{margin:50px 50px;}
.loginPage .pageHero{margin:0; height:100%;}
.loginWrapper{margin:40px 0;}
.loginBox{width:47%; min-width:290px; margin:auto; padding:20px 25px; background:rgba(60,70,60, 0.45);}
.loginBox table{margin:auto; border-collapse:separate; border-spacing:5px 0px; width:100%;}
.loginBox table th{width:90px;}
.loginBox table th label{font-weight:200;}
.loginBox table input[type="text"], .loginBox table input[type="password"]{width:100%; padding:0; margin:0; color:#000; line-height:0.9em;}
.loginBox .btnPanel{margin:10px 5px;}
.loginBox .btnPanel small{font-size:75%; font-weight:200; color:rgb(190,190,190); line-height:1em;}
.loginBox .btnPanel a{color:inherit !important; margin-right:10px; vertical-align:bottom; display:inline-block;}
.loginBox .icon-CADS{display:inline-block; width:35px; height:19px; vertical-align:bottom; background:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/icon-CADS.png) no-repeat center center; background-size:contain; transition:0.4s; border-radius:2px;}
.loginBox a:hover .icon-CADS{ background-color:rgba(255,255,255,0.8);}
.loginBox #btnLogin{padding:2px 20px; background:#95C950; color:#FFF; border-radius:5px; box-shadow:rgba(0,0,0,0.2) 0px 0px 20px; border:none; font-weight:200;}
.loginBox .status span{background:#000; padding:2px 10px; text-align:center; display:block;}
@media (max-width: 768px) {
	.loginPage{height:100%;}
	.loginPage .pageHero{height:100%;}
	.loginBox{padding:10px 15px;}
}
.agreement{background:rgba(60,60,60, 0.9); padding:10px 20px; margin:40px 0;}
.agreement h3{text-align:center; font-size:200%;}
.agreement .cnt{padding:25px 50px; background:rgba(30,30,30,0.9); margin:20px 0; font-weight:200;}
.agreement .cnt ol{padding-left:1em;}
.agreement .btnPanel{margin:15px 0;}
.agreement #btnAgree{margin:auto; padding:4px 25px; background:#95C950; color:#FFF; border-radius:5px; box-shadow:rgba(0,0,0,0.2) 0px 0px 20px; border:none; font-weight:200; }

.selectLang{position:absolute; top:0; left:0; z-index:1000;}
.selectLang a:first-child{margin-left:10px;}
.selectLang a{color:#FFF; padding:8px 18px 7px 18px; margin:0 1px; background:rgba(0,0,0, 0.6); display:inline-block; border-radius:0 0 10px 10px; transition:0.3s ease-in-out; text-decoration:none; vertical-align:top;}
.selectLang a:hover{background:rgba(0,0,0,0.9); padding-top:12px;}

/****************************/
/*** Landing Page         ***/
/****************************/
.land .pageHero{background-image:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/BG_Intro1.jpg);}
.land .intro img{margin-bottom:15px;}
.land .webBDown span[class|="icon"]{display:block; width:110px; height:100px; margin:auto; background-repeat:no-repeat; background-position:center center; transition:0.2s ease-in-out;}
.land .icon-NonVerbal{background-image:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/icon_NonVerbal.png) !important;}
.land .icon-Language{background-image:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/icon_Language.png);}
.land .icon-Content{background-image:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/icon_Content.png);}
.land .icon-Attire{background-image:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/icon_Attire.png);}
.land .webBDown a{color:inherit; display:block; border:3px solid transparent; padding:20px 5px; height:100%; flex:1;}

/*
	.webBDown a h3{position:relative; display:inline-block;}
	.webBDown a:hover h3::after{content:''; display:block; position:absolute; bottom:-5px; left:0; border-bottom:3px solid #ED338C; width:30px; margin:auto;}
*/
.land .webBDown a:hover{background:#f6ffea; border-bottom:3px solid #95C950;}
.land .webBDown a:hover span{transform:translateY(-8px);}
.land .webBDown a:hover .sideNote{color:#666}

.land .ltdTimeRes h4{color:#95C950; margin:0;}
.land .ltdTimeRes p{margin:0;}

/*.land .carousel div[class|="col"]{padding:0 40px;}*/

.land .carousel{height:250px;}
.land .carousel .resItem{height:270px;}
.land .carousel .resItem a{height:250px; text-decoration:none; display:block; color:inherit !important;}
.land .carousel .resItem a:hover{}
.land .carousel .resItem img{margin-bottom:5px;}
.land .carouselBtn{color:#95C950;}
.land .carouselBtn:hover{color:#666;}
.land .ltdTimeRes .roller>div{margin-bottom:20px;}

.intro span[class|="icon"]{display:block; width:190px; height:160px; margin:auto; background-repeat:no-repeat; background-position:center center; padding:85px 0;}

/****************************/
/*** Content Page         ***/
/****************************/


.content h2{font-size:250%;}
.content h3{font-size:150%; font-weight:normal; position:relative; }
.content h3::after{position:absolute; bottom:0; left:2px; border:2px solid #ED338C; width:30px;} /* Not Initialized */

.icon-playVdo{display:inline-block; content:''; width:150px; height:100px; margin:0 20px; vertical-align:middle;
			  background:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/icon-play.svg) no-repeat center center; background-size:contain;
			  filter: drop-shadow( 0 0 3px rgba(0,0,0,0.7) ); -webkit-filter: drop-shadow( 0 0 3px rgba(0,0,0,0.7) );
}

.vdoBar{height:350px; color:#FFF; position:relative; background-repeat:no-repeat; background-position:center -100px;}
.vdoBar a{color:#FFF;text-decoration:none; width:100%; height:100%; display:block; transition:ease-in-out 0.3s;}
.vdoBar a:hover{background:rgba(0,0,0,0.7);}
.vdoBar .container{height:100%;}
.vdoBar_holder{display:table; width:100%; height:100%;}
.vdoBar_cnt{display:table-cell; vertical-align:middle; text-align:center;}
.vdoBar_desc *{margin:0; padding:0 !important; text-shadow:0 0 5px #000;}
.vdoBar_desc h2{}
.vdoBar_desc h2::after{display:none; visibility:hidden;}
.vdoBar_desc{display:inline-block; vertical-align:middle; text-align:left;}
@media (max-width: 768px) {
	.icon-playVdo, .vdoBar_desc{display:block; text-align:center; margin:10px auto;}
}


.aspect h3{padding-bottom:10px;}
.aspect h3::after{display:block; content:''; }
.aspect div[class|="col"]{margin-bottom:30px;}




.exercises .img-responsive{}
.exercises .vCenter_Cnt{position:relative; vertical-align:middle;}
.exercises .icon-playVdo{width:90px; height:60px;}
.exercises div[class|="col"]{margin:0; padding:0;}
.exercises .row a{display:block; padding:20px 10px; text-decoration:none; }
.exercises .row a:hover{/*background:#f6ffea; */}
.exercises a .vCenter_Cnt{position:relative;}
.exercises a:hover .hoverOverlay::before{opacity:1;}
/*.exercises a:hover .vCenter_Cnt::before{content:''; display:block; position:absolute; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.9);}*/
/*
.exercises .row a:hover img{    -webkit-filter:brightness(30%);
    -moz-filter:brightness(30%);
    filter: url(#brightness); / * required for FF * /
    filter:brightness(30%);}
*/
.exercises .exDesc{position:absolute; width:100%; bottom:20%; left:0; }
.exercises .exDesc *{display:block; margin:auto;}

.exercises .comingSoon{overflow:visible;}
.exercises .comingSoon::before{content:''; width:100%; height:100%; background:rgba(220,220,220,0.9); position:absolute; top:0; left:0;}
.exercises .comingSoon::after{position:absolute; width:100%; bottom:25%; left:0%; padding:10px 0px; content:'Coming Soon'; color:rgba(0,0,0,0.2);}
.exercises .comingSoon:lang(zh)::after{content:'製作中'}
.exercises .comingSoon:lang(zh-Hans)::after{content:'制作中'}
.exercises .comingSoon ~ img{border:1px solid red;}
/*
*/
.specialEx .title{font-weight:bold; font-size:120%;}
.specialEx .vCenter_Cnt.desc{padding:20px 10px; text-align:left;}


.NonVerbal .pageHero{background-image:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/BG_NonVerbal.jpg);}
.NonVerbal .icon-NonVerbal{background-image:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/icon_NonVerbal_lg.png); }

.Language .pageHero{background-image:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/BG_Language.jpg);}
.Language .icon-Language{background-image:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/icon_Language_lg.png); }

.Content .pageHero{background-image:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/BG_Content.jpg);}
.Content .icon-Content{background-image:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/icon_Content_lg.png); }

.Attire .pageHero{background-image:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/BG_Attire.jpg);}
.Attire .icon-Attire{background-image:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/icon_Attire_lg.png); }

.Resources .pageHero{background-image:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/BG_Resources.jpg);}
/*
.nonVerbal .roomForImp.vdoBar{background-image:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/screenshot_1.jpg);}
.nonVerbal .bestPractice.vdoBar{background-image:url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/screenshot_1.jpg);}
*/




.resImg{width:100%; height:auto; margin-top:20px; border:1px solid #DDD;}

/*.resources .container .row [class|="col"] {border:1px solid blue;}*/
.resources .resItem .row{margin:20px 0;}
.resItem a{position:relative;}
/*.resources .container .row .col-xs-4{vertical-align:middle; border:1px solid red;}*/
/*.resources .container .row .col-xs-4 a{display:inline-block; margin:auto; vertical-align:middle;}*/

.imgOverlay{ width:100%; height:calc(100% - 20px); position:absolute; top:0px; left:0; margin-top:20px; background:rgba(0,0,0,0.7); transition:0.3s ease-in-out; opacity:0; }
.resItem .imgOverlay:hover{opacity:1;}
.resItem .imgOverlay .icon{width:35%; height:35%; background:no-repeat center center url(/20230901222513oe_/https://www.ilc.cuhk.edu.hk/workshop/ISDSEx/img/icon_MagnifyGlass.png); background-size:contain; position:absolute; bottom:10px; right:1px; opacity:0; transition:0.4s ease-in-out; transition-delay:0.1s; transform:translateY(5px);}
.resItem.large .imgOverlay .icon{width:20%; height:20%; bottom:17px; right:10px; }
.resItem .imgOverlay:hover .icon{opacity:1; transform:translateY(0);}

.ltdTimeRes .imgOverlay{margin-top:0; height:100%;}