.topSocialMedia{
background-color: #23262b;
width: 100%;
padding: 12px 0 8px 0;
}
.failed{
border-color:#F00 !important;
}
.login{
float: right;
text-align: center;
font-size: 14px;
color: #fff;
}
.login a:link {
color: #fff;
text-decoration: none;
}
.login a:visited {
color: #fff;
text-decoration: none;
}
.login a:hover {
color: #7ab6e4;
text-decoration: none;
}
.login a:active {
color: #fff;
text-decoration: none;
}
.login img{
vertical-align:middle;
}
.container{
font-family: Microsoft JhengHei;
font-weight: bold;
}
.Section{
height: auto;
}
.Section #AboutImg{
background: url(../img/homepage/AboutUs.png) no-repeat center center;
min-height:435px;"
}
.Section #InfoImg{
background: url(../img/info/info1stSection.jpg) no-repeat center center;
min-height:435px;"
}
.Section #Info3rdImg{
background: url(../img/info/info3rdSection.jpg) no-repeat center center;
min-height:435px;"
}
.AboutUs{
max-width: 560px;
padding:50px 20px 30px 20px;
font-size: 16px;
font-family: Microsoft JhengHei;
text-align: justify;
height: auto;
}
h11{
font-size: 30px;
font-weight: bold;
}
.myButton {
font-weight: bold;
background-color:#ffffff;
border:2px solid #000000;
display:inline-block;
cursor:pointer;
color:#000000;
font-size:16px;
padding:12px 50px;
text-decoration:none;
}
.myButton:hover {
background-color:#000000;
color: #fff;
text-decoration:none;
}
.myButton:active {
position:relative;
top:1px;
text-decoration:none;
}
.LatestNews{
width: 100%;
height: auto;
min-height: 500px;
background-color: #f2f2f2;
padding: 30px 0 80px 0;
}
.NewsCol{
margin-top: 10px;
font-size: 16px;
border: 2px solid #e5e5e5;
padding: 20px;
line-height: 150%;
background-color: #fff;
}
h12{
font-size: 24px;
font-weight: bold;
}
h13{
font-size: 30px;
font-weight: bold;
padding-left: 14px;
}
.videoWrapper {
position: relative;
padding-bottom: 56.25%; /* 16:9 */
height: 0;
}
.videoWrapper iframe {
position: absolute;
width: 100%;
min-height:435px;
height: 100%;
}
.SectionC{
height: auto;
background: #2086d5;
color: white;
min-height: 435px;
}
.CButton {
font-weight: bold;
background-color:#2086d5;
border:2px solid #ffffff;
display:inline-block;
cursor:pointer;
color:#fff;
font-size:16px;
padding:12px 50px;
text-decoration:none;
}
.CButton:hover {
background-color:#ffffff;
color: #2086d5;
text-decoration:none;
}
.CButton:active {
position:relative;
top:1px;
text-decoration:none;
}
.footer{
background-color: #2e3339;
width: 100%;
color: #fff;
}
.footerCol{
padding: 50px 20px;
text-align: justify;
font-size: 14px;
font-weight: normal;
}
#ContactUsImg{
display: none;
float: right;
}
#Navigation{
padding-left: 100px;
}
.footerCol .textbox {
border: 2px solid #8e8f93;
background-color: #2e3339;
outline:0;
height: 40px;
padding-left: 10px;
width: 100%;
color: #8e8f93;
font-size: 14px;
}
.FTButton {
font-weight: bold;
background-color:#2e3339;
border:2px solid #2086d5;
display:inline-block;
cursor:pointer;
color:#fff;
font-size:14px;
padding:8px 30px;
text-decoration:none;
}
.FTButton:hover {
background-color:#2086d5;
color: #fff;
text-decoration:none;
}
.FTButton:active {
position:relative;
top:1px;
text-decoration:none;
}
#NewsLetterImg{
float: right;
display: none;
}
.modal-title{
color: #000000;
font-family: Microsoft JhengHei;
font-weight: bold;
}
.PopUp-textbox{
border: 2px solid #2e3339;
background-color: #fff;
outline:0;
height: 40px;
padding-left: 10px;
width: 100%;
color: #8e8f93;
font-size: 14px;
}
.PopUp-textbox-FTButton{
font-weight: bold;
background-color:#2e3339;
display:inline-block;
cursor:pointer;
color:#fff;
font-size:14px;
padding:8px 30px;
text-decoration:none;
}
.PopUp-textbox-FTButton:hover {
background-color: #2086d5;
text-decoration:none;
color: #fff
}
.copyright{
color: white;
background-color: #23262b;
width: 100%;
padding: 20px 0;
}
.copyright a:link ,.copyright a:hover ,.copyright a:visited , .copyright a:active{
color: #fff;
text-decoration:none;
}
.BackToTop{
float: right;
text-align: center;
font-size: 14px;
color: #fff;
}
.BSection{
width: 100%;
height: auto;
min-height: 500px;
background-color: #f2f2f2;
padding: 30px 0 80px 0;
}
.Section #AboutUsImage{
background: url(../img/aboutus/AboutUs.png) no-repeat center center;
min-height:435px;"
}
.Section #frameChartImage{
background: url(../img/aboutus/chart.jpg) no-repeat center center;
min-height:435px;"
}
.SpaceInfo{
max-width: 560px;
padding:50px 20px 30px 20px;
font-size: 16px;
font-family: Microsoft JhengHei;
text-align: justify;
height: auto;
line-height: 150%;
}
#ChairmanMessage{
font-size: 16px;
width: 100%; background-color: #23272c;
color: #fff;
font-family: Microsoft JhengHei;
font-weight: normal;
padding: 30px 0;
}
#HonorSection{
text-align: justify;
color: #ffffff;
font-family: Microsoft JhengHei;
font-weight: normal;
font-size: 16px;
}
#honorPPLBK{
margin-top: 20px;
padding: 20px;
background-color: #2086d5;
}
#honorPhoto{
background-color: #fff;
margin-top: 20px;
}
.maincontent{
height: 600px;
width: 100%;
}
.slidingDiv {
padding: 30px 0;
font-family: Microsoft JhengHei;
font-weight: bold;
font-size: 16px;
}
.SelectionMenu{
padding: 30px 0;
}
.openSelectionMenu{
background-color: #eeeeee;
}
.show_hide {
display:none;
}
.MenuButton {
margin-left: 30px;
background-color:#fff;
display:inline-block;
cursor:pointer;
color:#23262b;
font-family:Arial;
font-size:16px;
padding:5px 30px;
text-decoration:none;
border-radius:5px;
border:1px solid #dcdcdc;
}
.MenuButton:hover {
color: #fff;
background-color:#2086d5;
text-decoration:none;
}
.MenuButton:active {
position:relative;
top:1px;
}
.News{
padding: 5% 0;
}
.NewsImageA{
width: 100%;
height: 300px;
background-image: url('../img/news/newsA.jpg');
background-size: cover;
}
.NewsImageB{
width: 100%;
height: 300px;
background-image: url('../img/news/newsB.jpg');
background-size: cover;
}
.NewsImageC{
width: 100%;
height: 300px;
background-image: url('../img/news/newsC.jpg');
background-size: cover;
}
#NewsConent{
margin-top: 10px;
}
.bottomline{
border-bottom:1px solid #b5b5b5;
}
.PageButtonSection{
padding: 10px 0 80px 0;
}
.PageButton{
color: #000000;
background-color:#fff;
display:inline-block;
font-family:Arial;
font-size:15px;
padding:5px 10px;
text-decoration:none;
border:2px solid #b5b5b5;
}
.PageButton:hover {
background-color:#2086d5;
border:2px solid #2086d5;
color: #fff;
text-decoration:none;
}
.PageButton:active {
position:relative;
top:1px;
}
.EventsImageA{
width: 100%;
height: 210px;
background-image: url('../img/events/EventA.jpg');
background-size: cover;
}
.EventsImageB{
width: 100%;
height: 210px;
background-image: url('../img/events/EventB.jpg');
background-size: cover;
}
.EventsImageC{
width: 100%;
height: 210px;
background-image: url('../img/events/EventC.jpg');
background-size: cover;
}
.EventsImageD{
width: 100%;
height: 210px;
background-image: url('../img/events/EventD.jpg');
background-size: cover;
}
.eventsPar{
text-align: justify;
}
#EventsContent{
padding: 40px 20px;
}
#ComingEvents{
padding: 40px 0 0 120px;
}
.UpComingEvent img{
float: left;
}
.UpComingEvent{
padding: 20px 0;
}
.EventTime{
padding-left: 10px;
padding-bottom: 20px;
float: left;
}
#EventsPhotoSection{
padding: 5% 10px 5% 10px;
}
.EventTitle{
margin-top: -40px;
color: #fff;
background-color: #121212;
padding: 10px 0 10px 20px;
opacity: .85;
}
.EventContentA{
padding:20px;
background-color: #f27c66;
color: #fff;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}
.EventContentB{
padding:20px;
background-color: #2086d5;
color: #fff;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}
.EventContentC{
padding:20px;
background-color: #5f5f5f;
color: #fff;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}
.PhotoEventTime{
float: right;
}
.EventsPhotoImageA{
width: 100%;
height: 250px;
background-image: url('../img/eventsPhoto/EventPhotoA.jpg');
background-size: cover;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
.EventsPhotoImageB{
width: 100%;
height: 250px;
background-image: url('../img/eventsPhoto/EventPhotoB.jpg');
background-size: cover;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
.EventsPhotoImageC{
width: 100%;
height: 250px;
background-image: url('../img/eventsPhoto/EventPhotoC.jpg');
background-size: cover;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
@media(max-width:1200px) {
.AboutUs{
max-width: 470px;
}
.SpaceInfo{
max-width: 470px;
}
.EventsPhotoImageA{
height: 400px;
}
.EventsPhotoImageB{
height: 400px;
}
.EventsPhotoImageC{
height: 400px;
}
.News{
padding: 6% 0;
}
#EventsContent{
padding: 6% 20px;
}
#ComingEvents{
padding: 6% 0 100px 20px;
}
}
@media(max-width:990px) {
.AboutUs{
max-width: 740px;
margin: 0 auto;
}
.SpaceInfo{
max-width: 740px;
margin: 0 auto;
}
.Section #AboutImg{
min-height: 300px;
}
h13{
padding-left: 15px;
}
.videoWrapper {
position: relative;
padding-bottom: 500px; /* 16:9 */
height: 0;
}
.footerCol{
text-align: center;
}
.footerCol .textbox {
width: 100%;
}
.FTButton {
width: 100%;
}
#Navigation{
display: none;
}
#Message{
display: none;
}
.footerCol{
padding: 20px
}
.PopUp-textbox-FTButton{
width: 100%;
}
#NewsLetterImg{
display: inline;
}
#MessageIcon{
display: none;
}
#ChairManMainMessage{
padding: 20px;
text-align: justify;
}
#honorPPLBK{
margin-top: 0px;
}
.slidingDiv{
text-align: center;
}
.MenuButton {
margin-left: 10px;
}
.EventsPhotoImageA{
height: 250px;
}
.EventsPhotoImageB{
height: 250px;
}
.EventsPhotoImageC{
height: 250px;
}
.News{
padding: 7% 0;
}
#EventsContent{
padding: 7% 20px;
}
#ComingEvents{
padding: 7% 0 100px 20px;
}
}
@media(max-width:767px) {
.EventsImageA{height: 350px;}
.EventsImageB{height: 350px;}
.EventsImageC{height: 350px;}
}
@media(max-width:760px) {
#menuYear{
padding-left: 10px;
float: left;
}
.MenuButton {
margin-top: 5px;
width: 98%;
}
}
@media(max-width:767px) {
.EventsImageA{height: 350px;}
.EventsImageB{height: 350px;}
.EventsImageC{height: 350px;}
}
@media(max-width:360px) {
.EventsImageA{height: 150px;}
.EventsImageB{height: 150px;}
.EventsImageC{height: 150px;}
}