html {
height:100%;}
body {
height:100%;}
.portrait {
      height:100%;position:relative;width:100%;overflow:scroll;-webkit-overflow-scrolling: touch;
}
#content {
height:100%;overflow:scroll;position:relative;-webkit-overflow-scrolling: touch;}

.Poster{width:100%;background:url(../images/lecturer/lecturer1_bg.jpg) center center no-repeat;background-size:cover;padding-top:5rem;position:relative;}
.lecturer_title{width:58.13%;display:block;margin:0 auto;

              position:relative;
     top: -2rem;
     opacity: 0;
     -webkit-transition: all 1s ease-in-out;
     -moz-transition: all 1s ease-in-out;
     -o-transition: all 1s ease-in-out;

}
.lecturer_title.animate {
        top: 0px;
        opacity: 1;
    }






.Poster p{text-align:center;position:absolute;bottom:2rem;width:100%;color:#fff;font-size:1rem;line-height:1.8rem;letter-spacing:3px;       
    
     opacity: 0;
     -webkit-transition: all 1s ease-in-out;
     -moz-transition: all 1s ease-in-out;
     -o-transition: all 1s ease-in-out;

}
    .Poster p.animate {
        bottom: 5rem;
        opacity: 1;
    }

.Poster .next{width:6.72%;position:absolute;bottom:2rem;left:46.64%;}
.lecturerList { width:100%; position:relative; display:block; color:#fff;}


.lecturer ul li .More{width:9.95%;display:block;margin:2rem auto 0;}
.lecturer ul li .More.open{transform:rotate(180deg);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);}

.lecturer ul li{position:relative;}
.lecturer_img8 { max-width:100%; height:auto; display:block;}

.lecturer_img { max-width:100%; height:auto; display:block;
                        
   
     opacity: 0;
     -webkit-transition: all 1.5s ease-in-out;
     -moz-transition: all 1.5s ease-in-out;
     -o-transition: all 1.5s ease-in-out;

}
.lecturer_img.animate {
   
        opacity: 1;
    }




.lecturer_img1{position:absolute; bottom:10%; right:15%; height:2rem; margin-top:-1rem;}
.lecturer_img2 {position:absolute; top:50%;width:29.8%; height:10rem; margin-top:-5rem; }
.lecturer_img3 {position:absolute; top:50%;width:45.62%; left:13.43%; height:10.3rem;margin-top:-5rem;  }
.lecturer_img4 {position:absolute; width:29.8%; right:10%; height:10.3rem;margin-top:-5rem; 

      top:0;
      opacity: 0;
     -webkit-transition: all 1.5s ease-in-out;
     -moz-transition: all 1.5s ease-in-out;
     -o-transition: all 1.5s ease-in-out;


}
.lecturer_img4.animate {
        top:50%;
        opacity: 1;
    }







.lecturer_img5 {position:absolute; width:29.8%; left:10%; height:10.3rem;margin-top:-5rem;


      top:0;
      opacity: 0;
     -webkit-transition: all 1.5s ease-in-out;
     -moz-transition: all 1.5s ease-in-out;
     -o-transition: all 1.5s ease-in-out;

}
.lecturer_img5.animate {
        top:50%;
        opacity: 1;
    }


.lecturer_img6 {width:3.2%;  float:right;  margin-top:1.4rem; margin-right:1.2rem;}
.lecturer_img7 {width:7%;  float:left;  margin-top:1.35rem; margin-left:1.2rem;transform:rotate(180deg);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);}

.lecturer ul li:nth-child(2n+1) .lecturer_img2 {left:13.43%; }
.lecturer ul li:nth-child(2n+1) .lecturer_img1 { position:absolute;bottom:10%;right:15%; height:2rem; margin-top:-1rem; }
.lecturer ul li:nth-child(2n) .lecturer_img2  {left:13.43%; }
.lecturer ul li:nth-child(2n) .lecturer_img1 { position:absolute; bottom:10%; right:15%; height:2rem; margin-top:-1rem; }
.lecturer_box {border:1px solid #ff0000; position:absolute; top:80%;width:44.53%; height:10rem; margin-top:-5rem; line-height:2.4rem; left:8.28%;}
.lecturer_box h1 { font-size:1.3rem; font-weight:normal; line-height:2rem; padding-left:1rem; color:#ff0000; padding-top:1rem;}
.lecturer_box h2 {font-size:3rem; font-weight:bold; line-height:3rem; padding-top:1rem; padding-left:1rem;color:#ff0000; word-spacing:2rem; letter-spacing: 2rem;}
.lecturer h3 {font-size:1.6rem; font-weight:bold; line-height:2.4rem; padding-top:2rem; color:#ff0000; }
.lecturer_line {width:19.37%;display:block; border:1px solid #ff0000; margin-top:1.5rem;}
.lecturer_center { width:84.37%; margin:auto;}
.lecturer_center p {width:100%;text-align:left;margin:1rem auto 0;font-size:1.2rem;line-height:2rem; margin-top:1.5rem; color:#595757;}
.lecturer_center p span{width:100%;text-align:left;margin:1rem auto 0;font-size:1.2rem;line-height:2rem; margin-top:1.5rem; color:#595757;font-weight:bold;s}
.lecturer_box1 {border:1px solid #706969;width:82.96%; height:4.25rem;line-height:4.2rem; margin:2.5rem auto; text-align:center;color:#595757; font-size:1.6rem;}
.lecturer_box h4 {font-size:3rem; font-weight:bold; line-height:3rem; padding-top:1rem; padding-left:1rem;color:#ff0000; }
.lecturer_left { float:left; width:47%;}
.lecturer_line2 { float:left;}
.lecturer_box1 a { color:#595757;}


.certificate{width:100%;}