@charset "utf-8";
/* CSS Document */
html, body {background-color: #e2ddb8!important; padding:0;margin:0; font-family: "Microsoft JhengHei"!important; font-size: 100%;height: 100%;}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,awardsColicon, awards_listing, text, play, topnav,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
	line-height: 26px;
	font-size: 16px;
}

#ctn {
  position: relative;
  height: 10px;
}

#myBtn {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 10px; /* Place the button at the bottom of the page */
  right: 10px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: #555; /* Set a background color */
  color: white; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 15px; /* Some padding */
  border-radius: 10px; /* Rounded corners */
  font-size: 18px; /* Increase font size */
  opacity: 0.8;
}

#myBtn:hover {
  background-color: #555; /* Add a dark-grey background on hover */
}
.main_wrap {width:100%;}汞
.container {width:100%;max-width:950px;margin:0 auto;}
.nav_wrap {top:0;position:relative;padding:0; text-align: center;}
.nav_wrap:after{clear:both;}
.sponsorlogo_wrap{background-color:#ffffff;padding-top:20px; padding-bottom:10px; width:100%;text-align:center;} 
.sponsorlogo_w {max-width:950px; margin-left: auto; margin-right: auto;}
.sponsorlogo_w img {width:100%;height:auto;max-height:90px;}
.sponsorlogo_m {max-width:640px; margin-left: auto; margin-right: auto;}
.sponsorlogo_m img {width:100%;height:auto;max-height:100px;}
.sponsorlogo_m{display:none;}
.sponsorlogo_m img{display:none;}
.header {width:100%; background-color:#DBDBDB
	;}
.logo_wrap {max-width: 700px; height:auto;width:100%;margin:0 auto; text-align:center;overflow:hidden;}
.logo_wrap img{width: 100%;}
.logo img{margin:0 auto;text-align:center;margin-top:40px;max-width:560px;background-size:cover;width:96%;}
.intro_wrap{background-color:#FFFFFF;padding:10px 0 0px 0;text-align: center;}
.intro_wrap .title {color: #37C4A7;text-align: center;}
.intro_wrap .information {color: #000000;margin-left: auto; margin-right: auto; text-align: center;}
.intro_wrap p{padding:10px;color:#ffffff;font-size:14px;text-align:justify;}
.content_wrap {background-color:#e2ddb8;padding-bottom:50px;padding-top:2px; min-height: 100%;}
.content_wrap  .title {text-align:center;color: #04aba1; padding-bottom: 20px;}
.content {background-color:#ffffff;margin-bottom:20px;}
.guest_pic {display: block; margin: 2% 0; }
.guest_pic_m {display: none; margin: 2% 0;}
.guest_pic img{width: 100%;}
.guest_pic_m img{width: 100%;}
.description {max-width: 680px;margin: auto;}
.introduction {background-color: #edead4; padding: 2% 5%; font-size: 16px; color: #474747; border-left: 6px solid #7C5D2A;}
.seminar {background-color: #F9F5DA; width: 100%; padding: 4%; margin-top: 2%; text-align: center; border: 1px solid #C5A55E;}
.seminar img {width: 100%; max-width: 500px;}
.seminar_text {padding-top: 10px; color: #920783; font-size: 18px; font-weight: bold; display: inline-block; text-align: left;}
.seminar_info {padding-top: 10px; padding-bottom: 10px; color: #3A3A3A; font-size: 16px; font-weight: bold; display: inline-block; text-align: left;}
.button_txt{color:#aca473;}
.clearfix {clear:both;}
.header{display:block;margin-bottom:-2;}
.header img{width:100%;}
.intro_text {line-height:24px;padding:10px auto;margin-top:6px;margin-bottom:30px;}
.menu_wrap {width:100%;background-color: #7f1b73; text-align: center;}
.menu {width: 700px; text-align: center; margin: auto;}
.flex-container { display: flex; align-items: center;margin-bottom: 5%;}
.flex-container .text { color: #d0308a; font-size: 16px; padding-left: 4px;}
.flex-container .text b{ color: #00ada7; font-size: 22px; }
.play {
	background-color:#05aba0;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	border-radius:4px;
	border:2px solid #ffffff;
	display:flex;
	justify-content: center;
	align-items: center;
	cursor:pointer;
	color:#FFFFFF;
	font-size:16px;
	font-weight:bold;
	padding:6px 28px;
	text-decoration:none;
	min-width: 150px;
	max-width: 150px;
	transition: 0.2s;
}

.text a:hover { background-color: #09D1C4;}

.topnav {
  overflow: hidden;
}

.topnav a {
  float: left;
  display: block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 18px;
  transition: 0.2s; 
}

.topnav a:hover {
  background-color: #AB0B98;
  color: #ffffff;
}

.topnav a.active {
  background-color: #6A1660;
  color: white;
}

.topnav a.all {
  background-color: #7f1b73;
  color: white;
  animation: mymove 3s infinite;
}

@keyframes mymove {
  50% {background-color: #C81AB3;}
}

.topnav .icon {
  display: none;
}

.awards_listing {width:32%;float:left;margin:0.65%;}
.awards_listing img{width:100%;}

.button1 {max-width: 400px; width: 98%; background-color: #05aba0; margin-top: 2%; padding: 6px 16px; text-align: center; display: inline-block; vertical-align: middle;transition: 0.4s;color: #FFFFFF; border: solid 0.5px #E9E9E9; display:flex; justify-content: center;align-items: center; box-sizing: border-box;  margin-left: auto; margin-right: auto;}
.button1:hover {background-color: #09D1C4;color: #FFFFFF; }

@media (max-width: 1000px){
.award_name {display: block;}
}

@media (max-width: 975px){
.awardsColicon {max-width: 200px;}
}

@media (max-width: 973px){
.flex-container {display: flex; flex-direction: row;}
}

@media only screen and (max-width: 40em) /* 670 */{
.sponsorlogo_w{display:none;}
.sponsorlogo_w img{display:none;}
.sponsorlogo_m{display:block;}
.sponsorlogo_m img{display:block;}
.guess_intro {margin-top:10px;}
.guessimg2 {width:100%;max-width: 320px; float:left;margin-right:5px;display:block;}
.guessimg2 img {width:100%;}
.result_wrap {width:100%;max-width:700px;margin:0px auto;padding:5px 15px;}
.winner_wrap{width:100%;margin:20px auto;}
.winner_wrap .award{width:100%;float:left;height:auto;font-weight:bold;font-size:15px;}
.winner_wrap .company{width:100%;float:left;height:auto;}
.nav_wrap {background-color:#ffffff;top:0;position:relative;}
.menu {width: 100%;}
.topnav {
  width:100%;
  overflow: hidden;
}
  .topnav a:not(:first-child) {display: none;}
  .topnav a.icon {
    float: right;
    display: block;
  }
  .topnav.responsive {position: relative;}
  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
	   
.description .title img {width:80%;}
.bio_headerinfo { padding: 20% 0% 1% 8%; width: 98%;}
.bio_namecard {width: 58%;}
}

@media (max-width: 767px){

.logo img{background-size:cover;width:70%;margin-top:50px;}
.flex-container {display: flex; flex-direction:column;}
.awardsColicon {max-width: 240px;}
.text  { padding-top: 6px;}
.flex-container .text { text-align: center; padding-left: 0px;}
.flex-container .text b{ text-align: center; }
}

@media (max-width: 640px){

.logo img{background-size:cover;width:70%;margin-top:30px;}
.sponsorlogo_m {max-width:500px; margin-left: auto; margin-right: auto;}
.sponsorlogo_m img {width:100%;height:auto;}
.awards_list {margin: auto; padding-bottom: 30px;}
.awards_listing {width:48%;float:left;margin:1%;}
.guest_pic {display: none;}
.guest_pic_m {display: block;}
 }

@media (max-width: 581px){
.bio_headerinfo { padding: 18% 2% 1% 2%;}

.logo img{max-width:400px;background-size:cover;width:90%;margin-top:30px;}
}

@media (max-width: 480px){

.logo img{max-width:360px;background-size:cover;width:80%;margin-top:30px;}
.description .title {text-align:center;padding:5px 0 3px 5px;}
.description .title img {width:100%;max-width:320px;}
.topweb {display:none;}
.topapp{display:block;}
.videoplayer {width: 98%;height: auto;margin-left:auto;margin-right:auto;}
.viewbox_wrap{width:96%;float:left;margin:1% 1%; text-align:left;}
.bio_headerinfo { padding: 18% 1% 1% 1%;}
.bio_namecard {padding-top: 3%;}
.bio_name {font-size: 20px; font-weight: bold; line-height: 24px; padding-bottom: 2px;}
.bio_title {font-size: 14px; font-weight: 500; line-height: 18px;}
.awards_listing {width:96%;float:left;margin:1%;padding: 5px 0px; }
 }

@media (max-width: 420px){
.logo img{max-width:380px;background-size:cover;width:80%;margin-top:20px;}
}
@media (max-width: 320px){
.logo img{max-width:380px;background-size:cover;width:90%;margin-top:20px;}
.winner_wrap{width:100%;margin:20px auto;}
.content_wrap {padding:0px;}
.content_wrap  .highlight {text-align:center;padding:10px 10px; border:solid 2px #de2e5f;font-size:12px;display:inline-block;}
.topweb {display:none;}
.topapp{display:block;}
}
  
