/* =============================================================================
	= Mobile Styles
   ============================================================================= */

@media only screen and (max-device-width: 699px) {
	.main-council { line-height:1.4;}


    /* • 3 gray box (Honorary, founding, past chairman...) 
    ------------------------------------------------------- */
    .main-council .mc-title-blk .mc-title { padding-bottom:25px; font-size:30px;}
    .members-blk .mb-title { text-align:center; font-size:40px; color:#880656; margin-bottom:20px}

    .main-council .mc-col      { width:100%;}
    .main-council .mc-col-last { width:100%;}

    /* • Columns of same height styles for "3 gray box"
    ---------------------------------------------------- */
    .row-full-height { height:auto; }
    .col-full-height { height:auto; vertical-align:top;}
    .row-same-height { display:block; width:100%; table-layout: auto; }
    .col-xs-height   { display:block; float:none !important;}


    /* • Meet the members of the HKCO"
    ---------------------------------------------------- */

    ul.members    {display:none;}
    ul.members-detail li { margin:0 2% 160px 0; padding:0; width:200px; height:200px; display:inline-block; background-color:#880656;
                           vertical-align:top; text-align: left; clear:both}
    ul.members-detail li .section { padding:8%; color:#fff; font-family:'Raleway',sans-serif;}
    html body.en ul.members-detail li .section { font-size:30px; line-height:normal;}
    html body.tc ul.members-detail li .section { font-size:30px; line-height:1.4;}
    html body.sc ul.members-detail li .section { font-size:30px; line-height:1.4;}

    html body.en ul.members-detail li .name { font-size:26px;}
    html body.tc ul.members-detail li .name { font-size:28px;}
    html body.sc ul.members-detail li .name { font-size:28px;}

    html body.en ul.members-detail li .remark { font-size:20px;}
    html body.tc ul.members-detail li .remark { font-size:22px;}
    html body.sc ul.members-detail li .remark { font-size:22px;}

    div.more { width: 200px; height: 200px;}
    div.more:hover { width:200px; height:200px;}

}