/* -------------------------------- 

Primary style

-------------------------------- */

@media (min-width: 1200px) {
  .container {
    max-width: 100%;
  }
}

html * {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
    
    font-family: 'Century Gothic', CenturyGothic, AppleGothic, 'Open Sans', sans-serif;
    font-family: lato, 'Roboto', sans-serif;
    color: #fff;

    font-size: 11pt;
    letter-spacing: 1px;
    line-height: 18pt;
}

*, *:after, *:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

html, body {
  /* you need to set this to assign to the main element a min height of 100% */
  height: 100%;
}

body {
	font-size: 100%;
	background-color: #000000;
	background-image: url("../img/bg.jpg");
	background-repeat: repeat;
}

a {
  color: #e11d33;
  text-decoration: none;
}
a:hover {
  color: #e11d33;
  text-decoration: underline;
}
hr{
    background-color: #999;
    height: 1px;
    width: 83%;
}
h3 {
    font-size: 14pt;
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: 2pt;
}
h2 {
    font-size: 32pt;
    text-transform: uppercase;
    font-weight: 300;
    line-height: 40pt;
    letter-spacing: 4pt;
}
h1 {
    /*
    font-size: 14pt;
    text-transform: uppercase;
    margin-bottom: 10px;
    font-weight: bold;
    letter-spacing: 2pt;
    */
    
    font-size: 12pt;
    line-height: 46pt;
    z-index: 11;
    font-weight: 900;
    text-transform: uppercase;
    
    letter-spacing: 4pt;
    position: relative;
    /*
    font-family: 'Merriweather', serif;
    */
    line-height: normal;
    
}
.moveleft {
    left:7px;
}
ul {
  list-style-type: disc;
  color: #e11d33;
}
ul li {
  margin-bottom: 20px;
}




/* section common */
html,body,.container
{
    height:100%;
    padding: 0px;
    margin: 0px;
}
.navbar-default {
    background-color: transparent;
    border-color: #e7e7e7;
    border: none;
}
#navbar {
    position: fixed;
    top: 0;
    left: 0;
    height: 60px;
    width: 105%;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 3;
    -webkit-transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    transition-property: transform;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
    transition: top 0.3s ease-in-out;
}
.nav {
    padding-left: 25px;
}
.nav>li {
    margin-bottom: 4px;
}
.navbar-default .navbar-nav>li>a {
    margin-top:1px;
    margin-bottom:2px;
    margin-right: 5px;
    font-size: 10pt;
    letter-spacing: 1px;
    color: #fff;
    width: 80%;
}
.navbar-default .navbar-nav>li>a:hover {
    color: #e11d33;
}
.navbar-right {
    margin-right: 40px;
    margin-top: 3px;
}

/*mobile nav*/
.navbar-default .navbar-toggle {
    border: none;
}
.navbar-default .navbar-toggle .icon-bar {
    background-color: #fff;
}

.navbar-default .navbar-toggle:hover {
    background-color: transparent;
}

.navbar-default .navbar-collapse, .navbar-default .navbar-form {
    border: none;
}
/*end mobile nav*/

.cd-main-content {
    padding: 0px;
    margin: 0px;
    height: 100%;
}
.row_table_row {
  display: table-row;
}
.row_height_not_full {
    height: auto;
}
.row_height_full {
    height: 100%;
}
.row
{
}
.container
{
    display:table;
    width: 100%;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    z-index: 3;
    margin-left: auto;
    margin-right: auto;
}
.h_center {
    display:table;
    /*width:100%;*/
    min-height:100%;
    height:100%;
    
    margin-right: auto;
    margin-left: auto;
}
.h_left {
    display:table;
    /*width:100%;*/
    min-height:100%;
    height:100%;
    
    margin-right: auto;
    margin-left: 19px;
}
.v_center{
    display:table-cell;
    position:relative;
    vertical-align:middle;
}
.h_bottom {
    display:table;
    width:100%;
    min-height:100%;
}
.v_bottom{
    display:table-cell;
    position:relative;
    vertical-align:bottom;
}
.bg  {
    /*
    background-color: rgba(255, 255, 255, 1);
  
    -webkit-box-shadow: inset 0 0 100px rgba(0,0,0,.5);
    box-shadow: inset 0 0 100px rgba(0,0,0,.5);
    */
    
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;

    background-position: center; 
    
    /*
	background:  50% 0 no-repeat fixed; 
	height: 1000px;  
	margin: 0 auto; 
    width: 100%; 
    max-width: 1920px; 
    position: relative; 
    
    box-shadow: 0 0 50px rgba(0,0,0,0.8);
    */
}
.page_intro_content {
  top: 20%;
  position: absolute;
    width: 57%;
    z-index: 100;
  left: 23px;
}
.caps_normal {
    text-transform: none;
}

.intro_section {
    display: table;
    margin-top: 100px;
    padding-bottom: 100px;
    
    /*
    margin-bottom: 10px;
    border-style: solid;
    border-bottom: thin solid #414141;
    */
}
.border_bottom {
    border-style: solid;
    border-bottom: thin solid #414141;
}

.sep{
    height:120px;
}
.sep_half{
    height:60px;
}
.sep_quarter{
    height:40px;
}
.join_bg { 
    height: 360px;
    background-image: url("../img/bg/join.jpg");
    
    
    
    
    /*
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
    
    
    background-size: 100% 100%;
    background-position: center;
    
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
  background: url(../img/bg/join.jpg) no-repeat center center fixed;
    */
    
    /*
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;    
    background-repeat: no-repeat;
    */

    /* A one-second transition was to disturbing for me 
    background-size: 100% 100%;
    */
    -moz-transition: all 9.5s;
    -webkit-transition: all 9.5s;
    transition: all 9.5s;
    background-position: center;
    
}


.join_bg:hover {
    /* Making images appear bigger and transparent on mouseover 
    
    background-size: 120% 120%;
    */
}
.join_bg_padding {
    padding-top: 40px;
}
.
.container_join {
    height: 600px;
}
/* section common end */

/* text common */
.red {
    color: #e11d33;
}
.grey {
    color: #414141;
}
.white {
    color: #ffffff;
}
.center {
    text-align: center;
}
.left {
    text-align: left;
}
.right {
    text-align: right;
}
.bold {
    font-weight: bold;
}
.none {
    display:none;
}
.no_padding {
    padding: 0;
}
.highlight {
    color: #e11d33;
    font-weight: bold;
    text-transform: uppercase;
}
.intro_text {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    /*
    text-shadow: 2px 2px 12px rgba(0, 0, 0, 0.5);
    */
    padding-left: 1.25em;
    text-shadow: 2px 2px 12px rgba(0, 0, 0, 0.5);
}
/* text common end */

/* btn */
.btn-discover {
    color: #fff;
    border-radius: 0px;
    background-color: #e11d33;
    border: 2px solid #e11d33;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 10pt;
    font-weight: bold;
    padding-right: 30px;
    margin-right: 20px;
    background-image: url(../img/btn/btn_arr_discover.png);
    background-position: right center;
    background-repeat: no-repeat;
    
    padding: 20px;
    padding-right: 40px;
    background-position: 85% 53%;
    
    /**/
    
    
    padding: 20px;
    padding-right: 40px;
    background-position: 85% 53%;
    
    
    border-radius: 40px;
}
.btn-discover:hover,.btn-join:hover,.btn-readmore:hover  {
    color: #e11d33;
    background-color: #fff;
    background-image: url(../img/btn/btn_arr_discover_hover.png);
}
.btn-join {
    color: #fff;
    border-radius: 0px;
    background-color: #e11d33;
    border: 2px solid #e11d33;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 10pt;
    font-weight: bold;
    padding-right: 30px;
    margin-right: 20px;
    background-image: url(../img/btn/btn_arr.png);
    background-position: right center;
    background-repeat: no-repeat;
    
    padding: 20px;
    padding-right: 40px;
    background-position: 85% 53%;
    
    
    border-radius: 40px;
    /*
	border:1px solid #cfdcec;
    */
}
.btn-readmore {
    color: #fff;
    border-radius: 0px;
    background-color: #e11d33;
    border: 2px solid #e11d33;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 10pt;
    font-weight: bold;
    padding-right: 15px;
    margin-right: 20px;
    background-image: url(../img/btn/btn_arr_discover.png);
    background-position: right center;
    background-repeat: no-repeat;
    
    padding: 10px;
  padding-right: 30px;
  background-position: 95% 55%;
    
    /**/
    
    
    padding: 20px;
    padding-right: 40px;
    background-position: 85% 53%;
    
    
    border-radius: 40px;
}

.btn_down { 
    background-repeat: no-repeat;
    background-position: center center;
    
    background-image: url(../img/btn/arr2.png);
    
    
  background-repeat: no-repeat;
  -webkit-background-size: 34px auto;
  background-size: 34px auto;
    /*
  background-position: -1px -1px;
  -moz-border-radius: 17px;
  -webkit-border-radius: 17px;
  border-radius: 17px;
  border: 1px solid #ffc100;
  display: block;
    */
  bottom: 70px;
  cursor: pointer;
    cursor: hand; 
  height: 34px;
  overflow: hidden;
  position: absolute;
  text-indent: -999px;
  -moz-transition: bottom .3s ease-in-out;
  -o-transition: bottom .3s ease-in-out;
  -webkit-transition: bottom .3s ease-in-out;
  transition: bottom .3s ease-in-out;
  width: 34px;
  z-index: 110;
}


.btn_down:hover,.btn_down:active { 
    background-image: url(../img/btn/arr3.png);
    
}

.button {
     
    /*Step 2: Basic Button Styles*/
    display: block;
    height: 68px;
    width: auto;
     
    /*Step 3: Text Styles*/
    background-image: url(../img/btn/arr0.png);
    background-repeat: no-repeat;
    background-position: center center;
}
 
/*Step 3: Link Styling*/
a.button {
    text-decoration: none;
}
/* btn end */


/* carousel */
.carousel .item {
    width: 100%; /*slider width*/
    max-height: 600px; /*slider height*/
}
.carousel .item img {
    width: 100%; /*img width*/
}
/*add some makeup*/
.carousel .carousel-control {
    background:  rgba(0, 0, 0, 0.4);
    border: none;
    
    height: 30%;
    width: 5%;
    top: 35%;
}
.carousel-control .right{
    right: 20px;
}
.carousel .carousel-control .left{
    left: 20px;
}
.carousel .carousel-control:hover {
    background:  rgba(0, 0, 0, 0.6);
}
/*full width container*/
@media (max-width: 767px) {
    .block {
        margin-left: -20px;
        margin-right: -20px;
    }
}
/* carousel end */


.
.parallax-window {
    min-height: 400px;
    background: transparent;
}


.bg_zoom {
    

    /* A one-second transition was to disturbing for me */
    background-size: 100% 100%;
    -moz-transition: all 9.5s;
    -webkit-transition: all 9.5s;
    transition: all 9.5s;
    background-position: center;
}


/* 00 Home */
.logo_icon {
    position: fixed;
    top: 13px;
    left: 40px;
    z-index: 101;
}
.bg_000  {
}

    /* A one-second transition was to disturbing for me 
.bg_001  {
    background-image: url("../img/00/hm7.jpg");

	transition: all 1s ease;
  -moz-transition: all 1s ease;
  -ms-transition: all 1s ease;
  -webkit-transition: all 1s ease;
  -o-transition: all 1s ease;
    background-position: center;
}
*/
.bg_001  {
    background-image: url("../img/00/hm7.jpg");

    /* A one-second transition was to disturbing for me 
    background-size: 100% 100%;
    -moz-transition: all 9.5s ease;
    -webkit-transition: all 9.5s ease;
    transition: all 9.5s ease;
    background-position: center;*/
}
.bg_002  {
    background-image: url("../img/00/hm2.jpg");

    /* A one-second transition was to disturbing for me 
    background-size: 100% 100%;
    -moz-transition: all 9.5s;
    -webkit-transition: all 9.5s;
    transition: all 9.5s;
    background-position: center;*/
}
.bg_003  {
    background-image: url("../img/00/hm3.jpg");

    /* A one-second transition was to disturbing for me 
    background-size: 100% 100%;
    -moz-transition: all 9.5s;
    -webkit-transition: all 9.5s;
    transition: all 9.5s;
    background-position: center;*/
}
.bg_004  {
    background-image: url("../img/00/hm4.jpg");
    height: 400px;
}
.bg_005  {
    background-image: url("../img/00/hm5.jpg");
}



/* Making images appear bigger and transparent on mouseover
.bg_001:hover {
  transform: scale(1.5);
  -moz-transform: scale(1.5);
  -webkit-transform: scale(1.5);
  -o-transform: scale(1.5);
  -ms-transform: scale(1.5);
  -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.5, M12=0, M21=0, M22=1.5, SizingMethod='auto expand')"; 
   filter: progid:DXImageTransform.Microsoft.Matrix(M11=1.5, M12=0, M21=0, M22=1.5, SizingMethod='auto expand'); 
}*/
.bg_001:hover {
  /*
    background-size: 120% 120%;
  */
}
.bg_002:hover {
  /*
    background-size: 120% 120%;
  */
}
.bg_003:hover {
  /*
    background-size: 120% 120%;
  */
}
.bg_004:hover {
  /*
    background-size: 120% 120%;
  */
}


.logo_text {
    /*
    letter-spacing: 1pt;
    font-weight: bold;
    text-transform: uppercase;
    */
  z-index: 401;
  position: fixed;
  top: 18px;
  left: 80px;
    
  text-align: right;
}   
.logo_text_verticle {
    /*
    letter-spacing: 1pt;
    font-weight: bold;
    text-transform: uppercase;
    */
  z-index: 401;
  position: fixed;
  top: 535px;
  left: -98px;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
    
  text-align: right;
}   
.home_title {
    font-size:  64pt;
    line-height: 64pt;
    width: 66%;
    left: 5%;
}
.faculty_text {
  z-index: 401;
  position: fixed;
  top: 190px;
  right: -112px;
  text-align: right;
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
}
.uni-text {
  z-index: 402;
  position: fixed;
  bottom: -350px;
  right: 49px;
  text-align: right;
    
  top: 95%;
  bottom: auto;
}

.home_headline_lead {
    font-size: 12pt;
    line-height: 46pt;
    z-index: 11;
    font-weight: 900;
    text-transform: uppercase;
    
    letter-spacing: 4pt;
    left:7px;
    position: relative;
    /*
    font-family: 'Merriweather', serif;
    */
}
.home_headline {
    font-size: 78pt;
    line-height: 84pt;
    z-index: 11;
    font-weight: 200;
    text-transform: uppercase;
    
    letter-spacing: 28pt;
    left:25px;
    position: relative;
    /*
    font-family: 'Merriweather', serif;
    */
}
.home_medtext {
    font-size:48pt;
    line-height:60pt;
    font-weight: 200;
}
.home_medtext b{
    font-size:48pt;
    line-height:72pt;
    font-weight: 300;
}


#myVideo {
    /*
    */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
    background-size: 100% 100%;
    background-color: black;
    
    /* our video 
    
    
    background-position: center center;
    background-size: contain;
    object-fit: cover;
    z-index: 1;
    
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    -webkit-box-shadow: inset 0 0 100px rgba(0, 0, 0, .5);
    box-shadow: inset 0 0 100px rgba(0, 0, 0, .5);
    */
    
    
/*  making the video fullscreen  
  position: fixed;
  left: 0; 
  bottom: 0;
    */
  min-width: 100%; 
  min-height: 100%;
    /*
    */
  width: auto; 
  height: auto;
  z-index: -100;
    
    
}
.container_notfullheight {
    height: auto;
}
.container_halfheight {
    height: 50%;
}
.bg_homejoin1  {
    background-image: url("../img/00/join1.jpg");
}
.bg_homejoin2  {
    background-image: url("../img/00/join2.jpg");
}

.exceptional_text {
    width: 80%;
}

/* content styles */

.inside {
  margin-top: 20px;
  margin-bottom: 20px;
  background: #ededed;
  background: -webkit-gradient(linear, left top, left bottom,color-stop(0%, #f4f4f4), color-stop(100%, #ededed));
  background: -moz-linear-gradient(top, #f4f4f4 0%, #ededed 100%);
  background: -ms-linear-gradient(top, #f4f4f4 0%, #ededed 100%);
}
.inside-full-height {
  /*
  // if you want to give content full height give him height: 100%;
  // with content full height you can't apply margins to the content
  // content full height does not work in ie http://stackoverflow.com/questions/27384433/ie-display-table-cell-child-ignores-height-100
  */
  height: 100%;
  margin-top: 0;
  margin-bottom: 0;
}

/* columns of same height styles */

.row-height {
  display: table;
  table-layout: fixed;
  height: 100%;
  width: 100%;
}
.col-height {
  display: table-cell;
  float: none;
  height: 100%;
}
.col-top {
  vertical-align: top;
}
.col-middle {
  vertical-align: middle;
}
.col-bottom {
  vertical-align: bottom;
}

@media (min-width: 480px) {
  .row-xs-height {
    display: table;
    table-layout: fixed;
    height: 100%;
    width: 100%;
  }
  .col-xs-height {
    display: table-cell;
    float: none;
    height: 100%;
  }
  .col-xs-top {
    vertical-align: top;
  }
  .col-xs-middle {
    vertical-align: middle;
  }
  .col-xs-bottom {
    vertical-align: bottom;
  }
}

@media (min-width: 768px) {
  .row-sm-height {
    display: table;
    table-layout: fixed;
    height: 100%;
    width: 100%;
  }
  .col-sm-height {
    display: table-cell;
    float: none;
    height: 100%;
  }
  .col-sm-top {
    vertical-align: top;
  }
  .col-sm-middle {
    vertical-align: middle;
  }
  .col-sm-bottom {
    vertical-align: bottom;
  }
}

@media (min-width: 992px) {
  .row-md-height {
    display: table;
    table-layout: fixed;
    height: 100%;
    width: 100%;
  }
  .col-md-height {
    display: table-cell;
    float: none;
    height: 100%;
  }
  .col-md-top {
    vertical-align: top;
  }
  .col-md-middle {
    vertical-align: middle;
  }
  .col-md-bottom {
    vertical-align: bottom;
  }
}

@media (min-width: 1200px) {
  .row-lg-height {
    display: table;
    table-layout: fixed;
    height: 100%;
    width: 100%;
  }
  .col-lg-height {
    display: table-cell;
    float: none;
    height: 100%;
  }
  .col-lg-top {
    vertical-align: top;
  }
  .col-lg-middle {
    vertical-align: middle;
  }
  .col-lg-bottom {
    vertical-align: bottom;
  }
}




.social_facebook {
    color: #fff;
    
    background-color: white;
    
    background-image: url(../img/btn/social_facebook.png);
  background-size: 55%;
    background-position: center center;
    background-repeat: no-repeat;
    
    padding: 10px;
    margin-right: 10px;
    
    /**/
    
    border-radius: 60px;
}

.social_ig {
    color: #fff;
    
    background-color: white;
    
    background-image: url(../img/btn/social_ig.png);
  background-size: 55%;
    background-position: center center;
    background-repeat: no-repeat;
    
    padding: 10px;
    margin-right: 10px;
    
    /**/
    
    border-radius: 60px;
}

.social_weibo {
    color: #fff;
    
    background-color: white;
    
    background-image: url(../img/btn/social_weibo.png);
  background-size: 55%;
    background-position: center center;
    background-repeat: no-repeat;
    
    padding: 10px;
    margin-right: 10px;
    
    /**/
    
    border-radius: 60px;
}

.social_youtube {
    color: #fff;
    
    background-color: white;
    
    background-image: url(../img/btn/social_youtube.png);
  background-size: 55%;
    background-position: center center;
    background-repeat: no-repeat;
    
    padding: 10px;
    margin-right: 10px;
    
    /**/
    
    border-radius: 60px;
}
.social_wechat {
    color: #fff;
    
    background-color: white;
    
    background-image: url(../img/btn/social_wechat.png);
  background-size: 55%;
    background-position: center center;
    background-repeat: no-repeat;
    
    padding: 10px;
    margin-right: 10px;
    
    /**/
    
    border-radius: 60px;
}

.social_linkedin {
    color: #fff;
    
    background-color: white;
    
    background-image: url(../img/btn/social_linkedin.png);
  background-size: 55%;
    background-position: center center;
    background-repeat: no-repeat;
    
    padding: 10px;
    margin-right: 10px;
    
    /**/
    
    border-radius: 60px;
}

.social_red {
    color: #fff;
    
    background-color: white;
    
    background-image: url(../img/btn/social_red.png);
  background-size: 55%;
    background-position: center center;
    background-repeat: no-repeat;
    
    padding: 10px;
    margin-right: 10px;
    
    /**/
    
    border-radius: 60px;
}


.social_ig:hover {
    background-image: url(../img/btn/social_ig_over.png);
}
.social_facebook:hover {
    background-image: url(../img/btn/social_facebook_over.png);
}
.social_weibo:hover {
    background-image: url(../img/btn/social_weibo_on.png);
}
.social_youtube:hover {
    background-image: url(../img/btn/social_youtube_on.png);
}
.social_wechat:hover {
    background-image: url(../img/btn/social_wechat_on.png);
}
.social_linkedin:hover {
    background-image: url(../img/btn/social_linkedin_over.png);
}
.social_red:hover {
    background-image: url(../img/btn/social_red-over.png);
}
/* 00 Home ends */


/* 01 programme */
.bg_01  {
    background-image: url("../img/01/02_bg.jpg");

    /* A one-second transition was to disturbing for me */
    /*
    background-size: 100% 100%;
    */
    -moz-transition: all 9.5s;
    -webkit-transition: all 9.5s;
    transition: all 9.5s;
    background-position: center;
}
.bg_01:hover {
    /* Making images appear bigger and transparent on mouseover 
    background-size: 120% 120%;*/
}
.vision_bg1  {
    background-image: url("../img/01/01.jpg");
    height: 437px;

}
.vision_bg2  {
    background-image: url("../img/01/02.jpg");
    height: 437px;
}
/* 01 programme end */



/* 02 CV */
.bg_02  {
    background-image: url("../img/02/03_bg.jpg");

    /* A one-second transition was to disturbing for me 
    background-size: 100% 100%;
    */
    -moz-transition: all 9.5s;
    -webkit-transition: all 9.5s;
    transition: all 9.5s;
    background-position: center;
}
.bg_02:hover {
    /* Making images appear bigger and transparent on mouseover
    background-size: 120% 120%;*/
}
.big_num {
    display: inline;
    font-size: 96pt;
    font-weight: bold;
}
.small_num {
    display: inline;
    font-size: 18pt;
    font-weight: bold;
position : relative;
top : -.1em;
    top : -28pt; 
}
.features_bg1  {
    background-image: url("../img/02/02_features_1.jpg");
    height: 200px;
}
.features_bg2  {
    background-image: url("../img/02/02_features_2.jpg");
    height: 200px;
}
.features_bg3  {
    background-image: url("../img/02/02_features_3.jpg");
    height: 200px;
}
.features_bg4  {
    background-image: url("../img/02/02_features_4.jpg");
    height: 200px;
}
.feature_container {
    padding: 0px;
    text-align: center;
}
.feature_text {
    padding-top: 20px;
    color: #414141;
    text-align: left;
    
/*    
    background:  rgba(0, 0, 0, 0.5);
    padding: 20px;
    
    height: 60%;
    transition: height 0.5s;
    -webkit-transition: height 0.7s;
    overflow: hidden;
}
.feature_text:hover {
    height: 100%;
*/    
}
.years_num {
    display: inline;
    font-size: 48pt;
    font-weight: bold;
}
.years_year {
    display: inline;
    font-size: 30pt;
    font-weight: bold;
}
    
.years_bg {
  background: url(../img/02/03_years.png) no-repeat center center;
}


.download {
}
.download:hover {
    color: white;
    background-color: #e11d33;
}
/* 02 CV end */



/* 03 people */
.bg_03  {
    background-image: url("../img/03/04_bg.jpg");

    /* A one-second transition was to disturbing for me 
    background-size: 100% 100%;
    */
    -moz-transition: all 9.5s;
    -webkit-transition: all 9.5s;
    transition: all 9.5s;
    background-position: center;
}
.bg_03:hover {
    /* Making images appear bigger and transparent on mouseover 
    background-size: 120% 120%;*/
}
.people_intro {
    width: 90%;
}
.people_thumb {
    height: 90px;
}


    .thumbnails {
        list-style-type: none;
    }
    .thumbnails li {
        float: left;
        margin-right: 3px;
    }
    .thumbnail {
        background-color: transparent;
        margin: 0;
        margin-right: 5px;
        border: 0;
        padding: 0;
        /*
        cursor: pointer; cursor: hand;
        */
    }
    .span4 {
        width: 125px;
    }
    #hover-cap-4col .thumbnail, #hover-cap-3col .thumbnail, #hover-cap-unique .thumbnail, #hover-cap-6col .thumbnail {
        position:relative;
        overflow:hidden;
    }
    .thumbnail .caption{
        /*
        display: none;
        position: absolute;
        top: 0;
        left: 0;
        background: rgba(0, 0, 0, 0.6);
        width: 100%;
        height: 100%;
        color:#fff !important;
        */
        padding:0px;
        
    }
    .caption p {
        padding-top:3px;
        font-size: 8pt;
        line-height: 8pt;
        font-weight: bold;
        color: #414141;
    }

    .caption-btm{
        background: #000;
        width: 100%;
        height: 30px;
        position: absolute;
        bottom: 4px;
        color: #fff;
    }
    .people_title {
        font-size: 8pt;
        line-height: 6pt;
        color: #414141;
    }
        
/* 03 people end */

/* 04 admission */
.bg_04  {
    background-image: url("../img/04/home4.jpg");

    /* A one-second transition was to disturbing for me 
    background-size: 100% 100%;
    */
    -moz-transition: all 9.5s;
    -webkit-transition: all 9.5s;
    transition: all 9.5s;
    background-position: center;
}
.bg_04:hover {
    /* Making images appear bigger and transparent on mouseover 
    background-size: 120% 120%;*/
}
.why1_bg {
  background: url(../img/04/why1.jpg);
  background-size: cover;
    height: 180px;
  background-position: center center;
}
.why2_bg {
  background: url(../img/04/why2.jpg);
  background-size: cover;
    height: 180px;
  background-position: center center;
}
.why3_bg {
  background: url(../img/04/why3.jpg);
  background-size: cover;
    height: 180px;
  background-position: center center;
}
.why4_bg {
  background: url(../img/04/why4.jpg);
  background-size: cover;
    height: 180px;
  background-position: center center;
}
.why_container {
    padding: 0px;
    background-color: #fff;
    color: #414141;
    text-align: center;
    padding-top: 20px;
}
.why_text {
    padding: 20px;
    background-color: #fff;
    color: #414141;
    text-align: center;
}
@media screen and (min-width: 768px) {
  .equal, .equal > div[class*='col-'] {  
      display: -webkit-box;
      display: -moz-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      flex:1 0 auto;
  }
}
/* 04 admission end */

/* 05 Alumni  */
.bg_05  {
    background-image: url("../img/05/05_bg.jpg");

    /* A one-second transition was to disturbing for me 
    background-size: 100% 100%;
    */
    -moz-transition: all 9.5s;
    -webkit-transition: all 9.5s;
    transition: all 9.5s;
    background-position: center;
}
.bg_05:hover {
    /* Making images appear bigger and transparent on mouseover 
    background-size: 120% 120%;*/
}
.years_of_graduation  {
    line-height: normal;
}


.alumni_bg_01  {
  background: url(../img/05/Christina-Tang.JPG);
  background-size: cover;
  background-position: center center;
    margin: 0;
    height: 550px;
        
}
.alumni_bg_02  {
  background: url(../img/05/Eva-Yang.JPG);
  background-size: cover;
  background-position: center center;
    margin: 0;
    height: 550px;
        
}
.alumni_bg_03  {
  background: url(../img/05/June-Wang.jpg);
  background-size: cover;
  background-position: center center;
    margin: 0;
    height: 550px;
        
}
.alumni_bg_04 {
  background: url(../img/05/Kristy-Lau.jpg);
  background-size: cover;
  background-position: center center;
    margin: 0;
    height: 550px;
        
}
.alumni_bg_05  {
  background: url(../img/05/Stacey-Zhang.jpg);
  background-size: cover;
  background-position: center center;
    margin: 0;
    height: 550px;
        
}
.alumni_bg_06  {
  background: url(../img/05/Vanee-Chen.JPG);
  background-size: cover;
  background-position: center center;
    margin: 0;
    height: 550px;
        
}
.alumni_bg_07  {
  background: url(../img/05/Candy-Hu.JPG);
  background-size: cover;
  background-position: center center;
    margin: 0;
    height: 550px;
        
}
.alumni_bg_08  {
  background: url(../img/05/Mia-Gao.jpg);
  background-size: cover;
  background-position: center center;
    margin: 0;
    height: 550px;
        
}
.alumni_bg_09  {
  background: url(../img/05/Bennet-Tsui.jpg);
  background-size: cover;
  background-position: center center;
    margin: 0;
    height: 550px;
        
}

    .alumni_ppl {
        padding: 0;
    }
        
    .alumni_heading {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        background: rgba(0, 0, 0, 0.4);
        width: 100%;
        height: 100%;
        color:#fff !important;
        height: 550px;
        
    }
    .alumni_title {
        padding:30px;
    }


.alumni_collapse{
    padding: 0;
}
    .alumni_ppl_title {
        font-weight: bold;
    color: #414141;
    }


.alumni_container {
    padding: 0px;
    background-color: #fff;
    color: #414141;
}
.alumni_q {
    margin-top: 30px;
    color: #414141;
    font-weight: bold;
}
/* 05 Alumni end */

/* --------------------------------------------------------- */

/* --------------------------------------------------------- */




@media only screen and (min-device-width: 480px) {
    #cd-menu-trigger {
        display: none;
    }
    
}


/* mobile */
@media only screen and (max-device-width: 480px) {
    /* common */
    html  {
        font-size: 9pt;
        line-height: 14pt;
    }
    h1 {
    }
    h2 {
        font-size: 19pt;
        line-height: 24pt;
    }
    
    
    #cd-menu-trigger {
        display: relative;
    }
    #cd-lateral-nav .cd-navigation {
        font-size: 16pt;
    }
    
    
#navbar {
    position: fixed;
    top: 0;
    left: 0;
    height: 60px;
    width: 105%;
    background-color: rgba(0, 0, 0, 0.8);
    z-index: 3;
    -webkit-transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    transition-property: transform;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
    transition: top 0.3s ease-in-out;
}
    
    
    .mob_m_b_30 {
        margin-bottom: 30px;
    }
    .sep {
        height: 60px;
    }
    .sep_half {
        height: 30px;
    }
    .page_intro_content {
        width: 90%;
    }   
    .intro_text {
        width: 100%;
    }   
    .icon_container {
        margin-bottom: 30px;
    }
    .joinus_copy {
        font-size: 12pt;
        line-height: 16pt;
        width: 75%;
        margin-left: auto;
        margin-right: auto;
    }
    .copyright {
        width: 90%;
        margin-left: auto;
        font-size: 7pt;
    }
    .btn-discover {
        font-size: 8pt;
        padding: 10px;
        padding-right: 40px;
        padding-left: 20px;
        padding-bottom: 12px;
    }
    .btn-join {
        font-size: 8pt;
        padding: 10px;
        padding-right: 40px;
        padding-left: 20px;
        padding-bottom: 12px;
    }
    .btn-readmore  {
        font-size: 8pt;
        padding: 10px;
        padding-right: 40px;
        padding-left: 20px;
        padding-bottom: 12px;
    }
    
    
    .join_bg {

    height: 320px;
        
        background-position: 92%;
    }
    
    
    /* home */
    #myVideo {
        display: none;
    }
    
    
.bg_000  {
    background-image: url("../img/00/hm0.jpg");
        background-position: center center fixed; 
        background-size: 100% 100%;
        background-position: 66%;
        -webkit-background-size: cover;
}
.bg_001  {
	
        background-position: center center fixed; 
        background-size: 100% 100%;
        background-position: 20%;
        -webkit-background-size: cover;
}
.bg_002  {
        background-position: center center fixed; 
        background-size: 100% 100%;
        background-position: center;
        -webkit-background-size: cover;
}
.bg_003  {
        background-position: center center fixed; 
        background-size: 100% 100%;
        background-position: 20%;
        -webkit-background-size: cover;
}
.bg_004  {
        background-position: center center fixed; 
        background-size: 100% 100%;
        background-position: center;
        -webkit-background-size: cover;
}
.bg_005  {
        background-position: center center fixed; 
        background-size: 100% 100%;
        background-position: center;
        -webkit-background-size: cover;
}

    
.bg_001:hover {
        background-size: 100% 100%;
}
.bg_002:hover {
        background-size: 100% 100%;
}
.bg_003:hover {
        background-size: 100% 100%;
}
.bg_004:hover {
        background-size: 100% 100%;
}
    
    
    .logo_text {
        font-size: 10pt;
      font-weight: bold;
      letter-spacing: 1.5pt;
      top: 0px;
      left: 72px;
        width: 440px;
        line-height: 16pt;
        
        display: none;
    }
    .intro_text {
        padding-left: 0;
        width: 75%;
        padding-right: 0;
    }
    .page_intro_content .intro_text {
        
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        /*
        text-shadow: 2px 2px 12px rgba(0, 0, 0, 0.5);
        */
        padding-left: 1.25em;
        text-shadow: 2px 2px 12px rgba(0, 0, 0, 0.5);

    }
    .btn_down {
        margin-left: -15px;
    }
    .home_headline  {
        letter-spacing: 10pt;
        font-size: 24pt;
        line-height: 20pt;
        font-weight: 300;
        margin-left: -30px;
    }
    .home_medtext  {
        letter-spacing: 2pt;
        font-size: 18pt;
        line-height: 20pt;
    }
    .home_medtext b {
        letter-spacing: 1pt;
        font-size: 18pt;
        line-height: 20pt;
        font-weight: 300;
    }
    .exceptional_text{
        margin-right: -100%;
    }
    
    .faculty_text {
        z-index: 401;
        position: fixed;
        top: 190px;
        right: -112px;
        text-align: right;
        
        display: none;
    }
    .uni-text {
        z-index: 402;
        position: fixed;
        bottom: -350px;
        right: 49px;
        text-align: right;
        top: 95%;
        bottom: auto;
        
        display: none;
    }
    #cd-google-map {
        margin-top: 20pt;
    }
    /* 01 */
    .bg_01 {
        background-position: center center fixed; 
        background-size: 100% 100%;
        background-position: center;
        -webkit-background-size: cover;
    }
    /* 02 */
    .bg_02 {
        background-position: center center fixed; 
        background-size: 100% 100%;
        background-position: center;
        -webkit-background-size: cover;
    }
    .c_design {
        height:auto;
        margin-bottom: 60px;
        padding-bottom: 30px;
    }
    .period1 {
        margin-right: 50%;
    }
    .period2 {
        margin-left: 50%;
    }
    
    /* 03 */
    .bg_03 {
        background-position: center center fixed; 
        background-size: 100% 100%;
        background-position: center;
        -webkit-background-size: cover;
    }
    .thumbnails li {
        float: none;
        /* margin-right: 3px; */
    }
    .span4 {
        width: 100%;
    }
    /*
    .caption {
        display: block;
        
        position: absolute;
        top: 85px;
    }
    .people_title {
        display: none;
    }
    */
    .caption p {
        padding:0px;
        font-size: 11pt;
        line-height: auto;
        font-weight: bold;
        padding-top: 10px;
    }
    
    /* 04 */
    .bg_04 {
        background-position: center center fixed; 
        background-size: 100% 100%;
        background-position: 60%;
        -webkit-background-size: cover;
    }
    .card{
        padding-bottom: 30px;
    }

    /* 05 */
    .bg_05 {
        background-position: center center fixed; 
        background-size: 100% 100%;
        background-position: 70%;
        -webkit-background-size: cover;
    }
    .alumni_heading {
        /*
        display: block;
        position: absolute;
        top: 185px;
        */
        background: rgba(0, 0, 0, 0.7);
    }
    .alumni_title {
        padding: 30px;
        position: absolute;
        bottom: 10px;
    }
}