@charset "utf-8";
/* CSS Document */
html,body {
    padding: 0px; margin: 0px; min-height:100%; font-size:17px; color: #333; line-height:28px;		 
	font-family:"Oswald", "微軟正黑體", "Microsoft JhengHei", "Segoe UI Semibold", "Segoe UI", "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;	
}
.clear{clear:both}
a:link, .container a:visited {text-decoration: none;}
 
table{border-collapse: inherit; line-height:28px; width: 100%;}
tr{background: #abe0ee;color: #333;}
/*tr:nth-child(2n+1){background: #3ca4d7;color: #fff;}*/

table ul, table ol{ margin:0; }
img {border:0;}
div, ul li{ margin:0px auto; padding:0px;   }
.cb:before, .cb:after {	content: ''; display: table; visibility: hidden;}
.cb:after {	clear: both;}
.cb {*zoom: 1;}

.wrap{ width:100%; min-height:100%;  overflow:hidden }
.screen{ min-width:680px; max-width:1280px; position:relative; padding:0px 10px;}


#home .container{ padding-top:0px; margin-left:35px;}
.container{ height: auto; width: 100%;min-height: 100%; position: relative; padding:35px 0; }
.inner_area { padding:20px 0; }
.content { position:relative; float:left; width:95% !important; }

.container a{-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; opacity: 1;}


h1,h2,h3,h4,h5,h6{ margin:0 0 15px 0; padding:0;}

h1{ font-size:36px; line-height:40px; color:#0f599b}
h2{ font-size:26px; line-height:30px; color:#333; }
h3{ font-size:21px; line-height:26px; color:#0f599b; border-left: 2px solid #0f599b; padding:8px 10px; box-shadow:0 3px 2px rgba(0,0,0,.1); margin-bottom:30px}
h4{ font-size:21px; line-height:26px; color:#ff2671; border-left: 2px solid #ff2671; padding:8px 10px; box-shadow:0 3px 2px rgba(0,0,0,.1); margin-bottom:30px}
h5{ font-size:21px; line-height:40px; color:#0f599b}
h6{ font-size:19px; line-height:30px; color:#333; }
p{ margin:0px; padding:0px}

/* theme */
#home .banner_area { background:none; padding:0; position:relative; height:100%; margin-bottom:55px; margin-top:20px;}
.bg_banner_cutting { position: absolute; bottom:-5%; right: 0; width: 100%;  z-index: 5;}
.bg_banner_school { position: absolute; z-index: 6; width:24%; bottom:-5%; right:0px;}

@media screen and (max-width: 1200px) {
	
.bg_banner_cutting {  bottom:-4%; }
}

.bg_banner_cutting img { width:100% }
.bg_banner_school img{ max-width:100% }
#FullPage .inner_content{ width:100%; padding:0px 0}
#FullPage .arrowlistmenu{ display:none }

#ad_float_ad {display: none; position: absolute;	z-index:4001; }
#ad_float_ad .ad_close_ad {
	cursor: pointer; position:absolute; right:-5px; top:-10px;
	-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; opacity: 1;
}
#ad_float_ad .ad_close_ad:hover {  transform: rotate(90deg);}

.title_special{ background:#fff; padding:1px 5px; color:#ea1e22; border-bottom:1px solid #ea1e22;}
.special_news .content{ background:#fff; padding:2px 5px; color:#333; font-size:13px;}
.special_news .content img{ max-width:100%;}
.highlight{ color:#F03}


/* Header */
.header { background:#ffffff; position:relative; }
.header .logo{ }
.header .logo a {  }
.header .logo .logo_img{ float:left;}
.header .logo .logo_txt { float:left; color: #fff; margin:5px 0 0 10px; }
.header .logo .logo_txt_cn{  font-weight:bold; font-size: 30px; line-height:36px;  }
.header .logo .logo_txt_en { font-size:20.5px; letter-spacing:1px;  }



/*
.header .info_top{ float:left; }
.header .info_top ul{ list-style:none; margin:0; }
.header .info_top ul li { float: left; font-size:15px; padding:2px 0px 2px 30px;}
.header .address {background:url(../images/web/icon_map.png) no-repeat; background-size:28px 30px;}
.header .tel {background:url(../images/web/icon_tel.png) no-repeat; background-size:28px 30px; clear:both}
.header .fax {background:url(../images/web/icon_fax.png) no-repeat; background-size:28px 30px; margin-left:25px;}
.header .email {background:url(../images/web/icon_mail.png) no-repeat; background-size:28px 30px;clear:both}
.header span{ color:#0070c9;}
*/
.header .icon_top {border-bottom-right-radius: 8px; border-bottom-left-radius: 8px; background:#e2f0ff; border-left:2px solid #fff;border-right:2px solid #fff;border-bottom:2px solid #fff; box-shadow:0 0 3px rgba(0,0,0,.2); position:absolute; right:0; top:0}
.header .icon_top ul{ list-style:none; margin:0; padding:10px 5px;}
.header .icon_top ul li { float: left; font-size:15px; padding:0px 15px;}
.header .icon_top ul li+li { border-left:1px dotted #fff;}
.header .icon_top ul li a { color:#0070c9}
.header .icon_top ul li a:hover { color:#f94343}

/* Search */
.search_result{ background:#f5f5f5; padding:5px;}
.search_result span{ color:#F00}
.search_listing ul{ list-style:none; margin:0; padding:0 }
.search_listing ul li{ margin:10px 0; padding:5px 0; border-bottom:1px dotted #ddd; color:#666 }
.search_listing ul li a{ font-size:19px; display:block; text-decoration:underline}

/* Area & width */

.banner_area h1 { color:#fff; text-align:center; font-size:33px; line-height:36px; background:rgba(211,75,15,.9); padding:10px 30px; display:inline;}

@media screen and (max-width: 1280px) {
.banner_area h1 { font-size:28px; line-height:32px; background:rgba(211,75,15,.9); padding:10px 30px; display:inline;}
}

.right_area{ float:left; width:50%; }

.bottom_area{ float:left; width:100%; }

.hover01 figure img {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
	opacity:1;
}
.hover01 figure:hover img {
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
	opacity:.8;
}
figure {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	background: #fff;
	overflow: hidden;
}
figure:hover+span {
	bottom: -36px;
	opacity: 1;
}
.hover02 figure img {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
	opacity:.3;
}
.hover02 figure:hover img {
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
	opacity:.7;
}
figure {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	overflow: hidden;
}
figure:hover+span {
	bottom: -36px;
	opacity: 1;
}

.sentense{ float:left; width:100%  }
.sentense .area{margin: 6px 10px 6px 176px; padding:10px; color:#2f2f2f; line-height:21px;font-size: 15px;background: #fff; border-radius: 6px;}
.sentense .title{ position:absolute;font-weight: bold; left:5px; top:-15px; background:url(../images/web/logo_sentense.png) no-repeat; padding:30px 34px 20px 60px;color:#292500; text-align: center; font-size:22px;text-shadow: 0px 3px 0px #fff, 0px -3px 0px #fff, 3px 0px 0px #fff, -3px 0px 0px #fff, -3px -2px 0px #fff, -3px 2px 0px #fff, 3px -2px 0px #fff, 3px 2px 0px #fff, 2px 3px 0px #fff, -2px 3px 0px #fff, -2px -3px 0px #fff, 2px -3px 0px #fff;}


/* commone style latest_new & latest_events */
.latest_new .area, .latest_events .area { box-sizing: border-box; width:100%; position:relative;  padding: 15px 0;  }
.latest_new .more_area a, .latest_events .more_area a { color: #fff; line-height: 3.5; font-size: 15px; padding: 0 0 0 0px; }
/* commone style latest_new & latest_events end */

/* commone style latest_new & latest_events & useful_links start */
.latest_new .title, .latest_events .title, .Userful_link_inside .title { margin-left: 15px; font-size: 23px; font-weight: bold; }
.latest_new .title_cn, .latest_events .title_cn, .Userful_link_inside .title_cn { font-weight: normal; color: #fff; width: 140px; padding: 7px 0 7px 47px; position: relative; }

/* commone style latest_new & latest_events & useful_links end */



.latest_new { float:left; width:45%; height: auto; position:relative; margin-left:30px; margin-bottom:20px; }
.latest_new .area { border: 0.3px dotted #cccccc; border-top: 0.3px dotted #cccccc;; color: #ef7171; }
.latest_new .area .latest_new_area { margin-top: -25px; }
.latest_new ul{ list-style:none; overflow-y: scroll; margin: 45px 0 0; padding: 0 5px; height: auto; scrollbar-color: #e87d7d #f0cece; scrollbar-width: thin; }
.latest_new ul::-webkit-scrollbar { width: 5px; }
.latest_new ul::-webkit-scrollbar-track { background: #f0cece; }
.latest_new ul::-webkit-scrollbar-thumb { background: #e87d7d; }
.latest_new ul li { position: relative; float: left; width: 100%; }
.latest_new ul li a { position: relative; float: left; padding: 5px 0 5px 10px; color: #000; line-height: 1.2; font-size:18px; color:#0000ff; }
.latest_new ul li a:hover  { text-decoration: underline; }
.latest_new ul li .icon_star { position:relative; float:left; width:5%; margin-top:5px; margin-right:5px; }
.latest_new ul li .icon_bullet { position:relative; float:left; width:5%; margin-top:5px; margin-right:5px; }
.latest_new ul li .text_info { position:relative; float:left; width:85%; font-size:14px; color: #000; margin-right: 5px; }
.latest_new ul li .text_info .text { position:relative; float:left; margin-left: 10px; }

.latest_award { float:left; width:45%; height: auto; position:relative; margin-left:30px; margin-bottom:20px; border: 1px solid; }
.latest_award .area { border: 0.3px dotted #cccccc; border-top: 0.3px dotted #cccccc;; color: #ef7171; }
.latest_award .area .latest_award_area { margin-top: -25px; }
.latest_award ul{ list-style:none; overflow-y: scroll; margin: 45px 0 0; padding: 0 5px; height: auto; scrollbar-color: #e87d7d #f0cece; scrollbar-width: thin; }
.latest_award ul::-webkit-scrollbar { width: 5px; }
.latest_award ul::-webkit-scrollbar-track { background: #f0cece; }
.latest_award ul::-webkit-scrollbar-thumb { background: #e87d7d; }
.latest_award ul li { position: relative; float: left; width: 100%; }
.latest_award ul li a { position: relative; float: left; padding: 5px 0 5px 10px; color: #000; line-height: 1.2; font-size:18px; color:#0000ff; }
.latest_award ul li a:hover  { text-decoration: underline; }
.latest_award ul li .icon_star { position:relative; float:left; width:5%; margin-top:10px; margin-right:5px; }
.latest_award ul li .icon_bullet { position:relative; float:left; width:5%; margin-top:10px; margin-right:5px; }
.latest_award ul li .text_info { position:relative; float:left; width:85%; font-size:14px; color: #000; margin-right: 5px; }
.latest_award ul li .text_info .text { position:relative; float:left; margin-left: 10px; }

.latest_media { float:left; width:50%; height: auto; position:relative; margin-left:0; margin-bottom:20px; }
.latest_media .area { border: 0.3px dotted #cccccc; border-top: 0.3px dotted #cccccc;; color: #ef7171; }
.latest_media .area .latest_media_area { margin-top: -25px; }
.latest_media ul{ list-style:none; overflow-y: scroll; margin: 45px 0 0; padding: 0 5px; height: auto; scrollbar-color: #e87d7d #f0cece; scrollbar-width: thin; }
.latest_media ul::-webkit-scrollbar { width: 5px; }
.latest_media ul::-webkit-scrollbar-track { background: #f0cece; }
.latest_media ul::-webkit-scrollbar-thumb { background: #e87d7d; }
.latest_media ul li { position: relative; float: left; width: 100%; }
.latest_media ul li a { position: relative; float: left; padding: 5px 0 5px 10px; color: #000; line-height: 1.2; font-size:18px; color:#0000ff; }
.latest_media ul li a:hover  { text-decoration: underline; }
.latest_media ul li .icon_star { position:relative; float:left; width:5%; margin-top:10px; margin-right:5px; }
.latest_media ul li .icon_bullet { position:relative; float:left; width:5%; margin-top:10px; margin-right:5px; }
.latest_media ul li .text_info { position:relative; float:left; width:85%; font-size:14px; color: #000; margin-right: 5px; }
.latest_media ul li .text_info .text { position:relative; float:left; margin-left: 10px; }

.latest_video { float:left; width:45%; height: auto; position:relative; margin-left:0; margin-bottom:20px; margin-left:30px; }
.latest_video .area { border: 0.3px dotted #cccccc; border-top: 0.3px dotted #cccccc;; color: #ef7171; }
.latest_video .area .latest_video_area { margin-top: -25px; }
.latest_video ul{ list-style:none; overflow-y: scroll; margin: 0; padding: 0 5px; height: auto; scrollbar-color: #e87d7d #f0cece; scrollbar-width: thin; }
.latest_video ul::-webkit-scrollbar { width: 5px; }
.latest_video ul::-webkit-scrollbar-track { background: #f0cece; }
.latest_video ul::-webkit-scrollbar-thumb { background: #e87d7d; }
.latest_video ul li { position: relative; float: left; width: 100%; }
.latest_video ul li a { position: relative; float: left; padding: 0; color: #000; line-height: 1.2; font-size:18px; color:#0000ff; }
.latest_video ul li a:hover  { text-decoration: underline; }
.latest_video  ul li+li iframe{border:2px solid #ed6d2a; border-top: 5px solid #ed6d2a;}
.latest_video .more_area { position: relative; float: left; width: 100%; height: 20px; background-color: #fff; color: #000 !important; text-align: center; font-size: 18px; margin-top:10px; }	
.latest_video .more_area a { color: #c0c0c0; }
.latest_video .more_area a:hover{ color: #c0c0c0; }

.latest_events{ width: 100%; float: left; position: relative; }
.latest_events .more_area{ position:relative; float:left; width:100%; height:20px; background-color:#fff; color:#000 !important; text-align:center; font-size:18px; }
.latest_events .more_area a { color: #c0c0c0; }
.latest_events .more_area a:hover{ color: #c0c0c0; }
.latest_events .area { border: 0.3px dotted #cccccc; border-top: 0.3px dotted #cccccc; color: #4fc4ce; }
.latest_events .area img { width:380px; margin-top:-15px; margin-left:0px; }
.latest_events .title { color: #4fc4ce; } 
.latest_events_area { margin: 0 0 0 ; padding: 0; }
.latest_events ul { list-style:none; background: rgba(0, 0, 0, 0); overflow-y: scroll; margin: 0 0 0; padding: 0px 20px; height: 538px; scrollbar-color: #13cdfb #c3e6fb; scrollbar-width: thin; }
.latest_events ul::-webkit-scrollbar { width: 5px; }
.latest_events ul::-webkit-scrollbar-track { background: #c3e6fb; }
.latest_events ul::-webkit-scrollbar-thumb { background: #13cdfb; }
.latest_events ul li{ padding: 0; font-size:18px; }
.latest_events ul li a { display: flex; align-items: center; justify-content: space-between; max-width: 541px; width: 100%; background-size: 100% 100%; margin: 0 auto 25px; padding-bottom: 10px; }
.latest_events ul li a:hover{ color:#4fc4ce; }
.latest_events .content{ font-size: 18px;  width: 150%; margin:0px !important;}
.latest_events .content img{ width:20px; }
.latest_events .cover { width: 50%; position: relative; float:left; margin:0;}
.latest_events .cover img{ max-width: 90%; }

#training { position:relative ;  width:100%; margin-top: 20px; }
#training .viewport { width: 91.5%; height: 280px; overflow: hidden; position: relative; margin:0px auto; }
.fc-scroller{ height:327px;}

#training .next:hover{opacity: 0.7}
#training .disable { visibility: hidden; }
#training .overview { list-style: none; position: absolute; padding: 0; margin: 0;  left: 0px; top: 0px;}
#training .overview li{ float: left; margin: 0 15px 15px 15px; 
-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; opacity: 1; padding: 10px;  width: 180px; overflow: hidden;  text-align: center;background: #f94d86;border-radius: 8px; }
#training .overview li:hover { }
#training .overview li a{display: block; padding:0px 0}
#training .overview li img{ width: 100%; margin-bottom: 12px;}
#training .overview .price{ color:#666666; font-size:15px;}
#training .overview .product_name{ color:#333; font-size:19px; padding:20px 0 5px 0;}
#training .overview li:hover p{ color:#424242; text-decoration:none; }
#training .overview li a:hover { text-decoration:none; }
#training .overview li:hover img{ border: 1px solid #ffe100; }


#training .overview li:nth-child(2n) {background: #1e6f4f;}
#training .overview li:nth-child(3n) {background: #3a59cf;}
#training .overview li:nth-child(4n) {background: #62beff;}
#training .overview li:nth-child(5n) {background: #ffa100;}




.footer_info{  padding:  0; position: relative;
}


.footer_info_txt{background: linear-gradient(90deg, #f71172 , #bd0d57 );padding: 38px 0 ;}
.footer_info_right{ float:left; width:45%; margin:0 0 0 10px}
.footer_info_right ul { padding: 0px; display: inline; list-style: none;}
.footer_info_right ul li { color: #333; text-align: left; float: left;width: 100%; margin:0 0 10px 0 }
.footer_info_right ul li+li { width: 50%;}
.footer_info_right ul li+li+li { width: 50%;}
.footer_info_right ul li+li+li+li { width: 100%;}
.footer_info_right ul li a { color:#fff;}


@media screen and (max-width:959px){
#pe_boy { display:none}	
#pe_gril { display:none}
#character_gril { display:none}
#character_boy { display:none}
}

#login_area{ background:#3ca4d7; margin:0 ; position:relative;  padding: 30px 20px 10px 10px; box-sizing: border-box; }
#login_area .login_icon { position: absolute; top: -25px; left: 17px; }
#login_area .bg_eclass{ background:#fff; border-radius: 5px; padding: 45px 20px 10px 10px; font-size:14px; }
#login_area input { background: #dadada; margin-bottom: 5px; border: none; padding: 8px 15px 5px; box-sizing: border-box; }
#login_area #submit{ background:#ffba00; line-height: 0px;  color:#fff; padding: 12px 15px 10px; margin: 5px 0 0 0; text-align: center; border:0px; border-radius: 10px; transition: all 0.3s ease-in-out; } 
#login_area #submit:hover{ background:#53514e; }



.fc-view-container{ background:#fff;}
.main_calenadr h2{ font-size:12px; margin: 0; padding:0; line-height:15px;}
.main_calenadr{ background:#FFF; border-radius:8px; position:relative; box-shadow:0 0 3px rgba(0,0,0,.2); margin: 20px 0 15px 0; border:3px solid #ffdb55}
.main_calenadr .area{ padding:35px 15px 10px 15px; color:#00a5e3; line-height:21px;}
.main_calenadr .title{ display: none; font-size:23px; color:#ff7c2d; padding:8px 0px 12px 60px ; margin-bottom:5px;  font-weight:bold; text-shadow:0px 2px 0px #fff, 0px -2px 0px #fff, 2px 0px 0px #fff, -2px 0px 0px #fff, -2px -1px 0px #fff, -2px 1px 0px #fff, 2px -1px 0px #fff, 2px 1px 0px #fff, 1px 2px 0px #fff, -1px 2px 0px #fff, -1px -2px 0px #fff, 1px -2px 0px #fff, 0 0 6px rgba(0,0,0,.2); } 
.main_calenadr .area{ padding:10px; min-height:180px; }
.main_calenadr .area iframe{ width:100%; height:235px;}
.main_calenadr .area iframe .view-container-border{ padding:0px;}
.main_calenadr .detail_btn{right:10px; top:10px; box-shadow:0 0 3px rgba(0,0,0,.2) }
.main_calenadr .more_area{ display: none; position:absolute; right:10px; top:15px; font-size:12px;}
.main_calenadr .more_area a{ display:block; padding:0 15px; color:#333}
.main_calenadr .more_area a:hover{color: #F30}

/* Main Userful Links */
.Userful_link_inside{ padding: 20px 0 0px 0;}
.Userful_link_inside .title{ display:none}
.Userful_link_inside ul{ list-style:none; margin:20px 0 0 -2%; padding:0}
.Userful_link_inside ul li{ float: left; width:18%; margin:20px 0 10px 2%}
.Userful_link_inside ul li img{ width:100%; border-radius:6px; box-shadow:0 0 3px rgba(0,0,0,.2)}
.Userful_link_inside ul li:hover img{ opacity:.7; box-shadow:0 0 3px rgba(0,0,0,.4)}

.Userful_link_outside{ padding:0px 0 30px 0}
.Userful_link_outside .title{ display:none}
.Userful_link_outside ul{ list-style:none; margin:0 0 0 -1.5%; padding:0}
.Userful_link_outside ul li{ float: left; width:15%; margin:0 0 15px 1.65%}
.Userful_link_outside ul li img{ width:100%; border-radius:6px; box-shadow:0 0 3px rgba(0,0,0,.2)}
.Userful_link_outside ul li:hover img{ opacity:.7; box-shadow:0 0 3px rgba(0,0,0,.4)}

/* Footer */
.upper_footer {background: #3ca4d7; padding: 20px 0; margin-top:20px; }

.upper_footer .footer_logo{ float:left; width:40%;}
.upper_footer .footer_logo .text { float:left; color: #fff; margin-top:-5px; width:70%; font-size:14px; }
.upper_footer .footer_logo img{ float:left; max-width:100%; margin-top:-10px; margin-right:10px; }
.upper_footer .footer_info { margin-top: -5px; width: 55%; float:right; }
.upper_footer .footer_info ul{ list-style:none; margin:0; padding: 0 0 0 0; }
.upper_footer .footer_info ul li { margin: 0 0 5px 0; color: #fff; width:50%; float: left }
.upper_footer .footer_info ul li:nth-child(1) { width: 100%; margin:0; }
.upper_footer .footer_info ul li a { color: #fff; }



.footer{ background:#fff; font-size:12px; box-shadow:0 -2px 2px rgba(0,0,0,.1); margin: 0}
.footer .screen{ padding:20px 15px;}
.footer .copyright{ float:left; width:70%; text-align: left}
.footer .power{ float:right; width:29%; text-align: right}
.footer a{ color: #0f599b;}
.footer .power a:hover{ color:#298087;}

.cd-top {
  display: inline-block;  position: fixed; visibility: hidden;  opacity: 0; box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
  height: 50px;  width: 50px;  bottom: 90px;  right: 30px;  
  overflow: hidden;  text-indent: 100%;  white-space: nowrap; border-radius:50%; border:2px solid #fff; box-shadow:0px 0px 5px #999;  
}
.cd-top:hover {
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;-moz-transition: opacity .3s 0s, visibility 0s 0s;transition: opacity .3s 0s, visibility 0s 0s;
}
.cd-top.cd-is-visible { visibility: visible; opacity: 1;}
.cd-top.cd-fade-out { opacity: .5;}
.no-touch .cd-top:hover { background-color: #e86256; opacity: 1;}

/* Nevigation */
.nevigation{ padding:15px 0px; font-size:13px; margin-bottom:15px; border-bottom:1px dotted #ddd; }
.nevigation .screen{ padding:0; }
.nevigation ul{ list-style: none; margin:0px; padding:0px; }
.nevigation ul .sp{ padding:0px 15px; color:#666 }
.nevigation ul li{ float: left; line-height:24px;  }
.nevigation ul li a{ color:#666; text-decoration: none }
.nevigation ul li a:hover{ text-decoration: underline ; color:#ffa030}

#Information_detail .nevigation{ margin-bottom:20px;}

.inner_banner{ background-size:cover; position: relative; padding:120px 0 30px 0; margin-bottom:30px;}

.inside_banner h1{ color:#fff; padding:6px 32px; display:inline; text-align: center; font-size:32px; line-height:36px;}

/* Page Content */
.inner_content{ float:right; width:78%; margin-bottom:50px}
.inner_content .main_content{ padding:15px 20px 30px 20px; min-height:500px; border-top:2px solid #abe0ee; background:rgba(255,255,255,.95) ; box-shadow: 0 -1px 1px rgba(0,0,0,.2) }
.inner_content_full{ margin-bottom:50px; padding:0px 0}
.inner_content_full .main_content{ padding:15px; min-height:500px;border-top:2px solid #abe0ee;   position:relative; background:rgba(255,255,255,.95) ; box-shadow: 0 -1px 1px rgba(0,0,0,.2)}
.inner_content_full h1{ }

.main_content a { color:#0f599b; }
.main_content a:hover p { color:#F90 !important; }

.inner_content iframe{ width: 100%; min-height:450px;}
.inner_content img, .inner_content_full img{ max-width:100%;}
.inner_banner img{ width:100%;}

.Album{ margin:20px 0px;}
.Album .title{ background:#fafafa; border-left:2px solid #0f599b; color:#0f599b; padding:8px 15px; font-size:21px; line-height:32px; display:block;  box-shadow:0px 3px 2px rgba(0,0,0,.2); margin-bottom:20px; }
.Album .description{  padding:15px; margin:20px 0; }
.Album .description ul{ list-style: outside; padding:0; margin: 0 15px; }
.Album .description ul li{ margin:0 0 5px;}
.Album .description ol{ padding:0; margin: 0 15px; }
.Album .description ol li{ margin:0 0 5px;}
.Album ul { list-style:none; padding:0 }
.Album ul li{ margin:0 0 10px 0; }
.Album ul li img{ box-shadow:0 0 3px rgba(0,0,0,0); }
.Album ul li:hover img{ box-shadow:0 0 3px rgba(0,51,204,.2)}


#Inner_Type_A{ }
#Inner_Type_A ul{ margin:20px 0 0 -2%; list-style:none; padding:0px;  }
#Inner_Type_A li{ float:left; width:31%; margin:0 0 15px 2%; text-align: center;}
#Inner_Type_A li:nth-child(3n+1){ clear:both}
#Inner_Type_A li img{ max-width:100%; max-height:255px  }
#Inner_Type_A li p{  }

#Inner_Type_B { }
#Inner_Type_B .title{ margin:0 ;  }
#Inner_Type_B ul{ margin:20px 0 0 -2%; padding:0; }
#Inner_Type_B li{ float:left; width:48%; margin:0 0 15px 2%; }
#Inner_Type_B .title_des { float: left; width:100%;}
#Inner_Type_B li img{ max-width:100%; height:auto }
#Inner_Type_B li:nth-child(2n+1) { clear:both}
#Inner_Type_B .right_desc { float: right; width:100%; padding:10px 0 0}
#Inner_Type_B .right_desc ul{ list-style: outside; margin:0; padding:0}
#Inner_Type_B .right_desc ul li{ margin:0 0 0 15px;}
#Inner_Type_B .right_desc ol{ margin:0; padding:0}
#Inner_Type_B .right_desc ol li{ margin:0 0 0 15px;}

#Inner_Type_C {}
#Inner_Type_C .title{ }
#Inner_Type_C ul{ margin:20px 0 0 0; padding:0px;}
#Inner_Type_C li{ float:none; margin:0 0 15px 0%; width: auto; text-align: left; clear:both; padding:0}
#Inner_Type_C li img{ width:100%; height: auto; text-align: center; margin:0 0 10px 0}
#Inner_Type_C li .title_des{ width:42%; float:left; }
#Inner_Type_C li .right_desc{ float: right; width:56%;}
#Inner_Type_C .right_desc ul{ list-style: outside; margin:0; padding:0}
#Inner_Type_C .right_desc ul li{ margin:0 0 0 15px;}
#Inner_Type_C .right_desc ol{ margin:0; padding:0}
#Inner_Type_C .right_desc ol li{ margin:0 0 0 15px;}

#Inner_Type_D { background:none}
#Inner_Type_D li{ float:none; margin:0 0 15px 20px; width: auto; text-align: left; clear:both; padding:0}

#Inner_Type_E li{ float:none; margin:0 0 15px 20px; width: auto; text-align: left; clear:both; padding:0}
#Inner_Type_E li a{ background:url(../images/icon/icon_pdf_b.png) no-repeat left; background-size:20px 27px;  }
#Inner_Type_E li a:hover{ background:url(../images/icon/icon_pdf_b.png) no-repeat left;  background-size:20px 27px; }

/* Subject Template */
.subject_category{}
.subject_category ul{ list-style:none; margin:0 0 0 -1.5%; padding:0px;}
.subject_category ul li{ float:left; width: 31%; margin:0 0 30px 2%; padding:0;}
.subject_category ul li img{ box-shadow:0 0 3px rgba(0,0,0,.3); border:1px solid #fff; margin:0;}
.subject_category ul li:hover img{ box-shadow:0 0 3px rgba(0,51,204,.3); border:1px solid #0083ca;}
.subject_category p{ color:#0083ca;  border-bottom:1px solid #0083ca; margin:0px 0 0 0px; padding:0px 5px; text-align: center;}
.subject_category a{ }
.subject_category a:hover p{ border-bottom:1px solid #0083ca; background:#0083ca; color:#fff; }
.subject_category a:hover{ text-decoration:none}

/* Information Template */
.sub_category{ margin:15px 0; float: left; width:100%}
.sub_category ul{ list-style: none; padding: 0px 0 0px 0;margin: 0px 0 10px 0;text-align: center; border-bottom: 1px solid #ddd; clear:both;}
.sub_category ul li{ padding: 0 5px; float:left}
.sub_category ul li a{  padding: 10px 16px; display: block; color: #0f599b; background:#f1fcff; font-size: 17px; line-height: 19px; border-right: 1px solid #ddd;  border-left: 1px solid #ddd;  border-top: 1px solid #ddd; }
.sub_category ul li a:hover{ background: #F90; color:#fff}
.sub_category ul li a.current{ background: #0f599b; color:#fff }

.sub_category_b{ margin:15px 0;}
.sub_category_b ul{ list-style: none;padding: 0px 0 15px 0;margin: 0px;text-align: center; border-bottom: 1px solid #ddd;}
.sub_category_b ul li{ display: inline-block; padding: 0 15px;}
.sub_category_b ul li a{  padding: 10px 21px; display: block; color: #0f599b; font-size: 17px;  line-height: 19px;  }
.sub_category_b ul li a:hover{ color:#0f599b}
.sub_category_b ul li a.current{ background: #0f599b; color:#fff }
.sub_category_b ul li + li { border-left: 1px dashed #ddd; }

#pages{ float:right; margin:15px 0px 0 ; clear: both; font-size:12px;}
.pages_page{ float:left;padding:0px 10px 0 0;}
#pages ul{ float: left; list-style:none; min-height:17px; margin:0px; padding:0px;}
#pages ul li{  float: left; margin:0px 5px 0px 5px;}
#pages ul li a{ line-height:25px; height:25px; width:25px; display: inline-block; text-align: center; background:#fff; border-radius:50%; color:#333; box-shadow:0 0 3px rgba(0,0,0,.2)}
#pages ul li a:hover{ background:#ececec; text-decoration:underline }
#pages ul li a.pgCurrent{ background:#0f599b; color:#fff}

.year_box{ position:absolute; right:20px ;top:20px;}
.year_box select{ padding:5px 5px;}

#info_type_A .information ul{  margin:0; padding:0; }
#info_type_A .information ul li{ float:none; width: 100%; margin:0; padding:10px 5px; border-bottom:1px solid #ddd;  display:inline-block;  }
#info_type_A .information ul li:nth-child(even) {background: #fafafa}
#info_type_A .information ul li a{}
#info_type_A .information ul li a:hover{}
#info_type_A .information ul li img{ float:left; margin:0 20px 0 0; max-width:200px;}
#info_type_A .information .date{ float:left; width:28%;  }
#info_type_A .information .date span{ padding:0 0 0px 30px; color:#666; font-size:15px; display:block; background:url(../images/icon/icon_date.png) no-repeat; background-size:21px 21px; background-position:4px 50%;}
#info_type_A .information p{ float:left; width:70%; }
#info_type_A .information ul .title_area{ border-bottom:2px solid #0f599b; color:#0f599b;}

#info_type_B .information ul{  margin:0 0 0 -2%; padding:0; list-style: none; }
#info_type_B .information ul li{ float: left; width:23%; margin:0 0 15px 2%;}
#info_type_B .information ul li:nth-child(4n+1){ clear:both;} 
#info_type_B .information ul li a{ display: block; color:#0f599b; }
#info_type_B .information ul li a:hover{ text-decoration:none}
#info_type_B .information ul li .cover{ box-shadow: 0 0 3px rgba(0,0,0,.1); padding:1px;}
#info_type_B .information ul li .content{ }
#info_type_B .information ul li img{ width:100%; }
#info_type_B .information .date{ }
#info_type_B .information .date span{ padding:5px 0 5px 30px; color:#666; font-size:15px; display:block; background:url(../images/icon/icon_date.png) no-repeat; background-size:21px 21px; background-position:1px 50%;}

#info_type_C .information ul{  margin:0 0 0 -1%; padding:0; list-style: none; }
#info_type_C .information ul li{ float: left; width:31%; margin:0 0 15px 2%; box-shadow:0 0 3px rgba(0,0,0,.2)}
#info_type_C .information ul li:hover{  box-shadow:0 0 3px #0f599b ; background:#F9F9F9}
#info_type_C .information ul li:nth-child(3n+1){ clear:both;} 
#info_type_C .information ul li a{ display: block; color:#0f599b; }
#info_type_C .information ul li a:hover{ text-decoration:none}
#info_type_C .information ul li .cover{ box-shadow: 0 0 3px rgba(0,0,0,.1); padding:1px;}
#info_type_C .information ul li .content{ padding:5px ; }
#info_type_C .information ul li img{ width:100%; }
#info_type_C .information .date{ }
#info_type_C .information .date span{ padding:5px 0 5px 30px; color:#666; font-size:15px; display:block; background:url(../images/icon/icon_date.png) no-repeat; background-size:21px 21px; background-position:1px 50%;}

#info_type_D .information ul{  margin:0 0 0 0; padding:0; list-style: none; }
#info_type_D .information ul li{ margin:0 0 15px 0;}
#info_type_D .information ul li a{ display: block; color:#0f599b; }
#info_type_D .information ul li a:hover{ text-decoration:none}
#info_type_D .information ul li .cover{ float:left; width:30%; box-shadow: 0 0 3px rgba(0,0,0,.1); padding:1px;}
#info_type_D .information ul li .content{ float:right; width:68%; }
#info_type_D .information ul li img{ width:100%; }
#info_type_D .information .date{ }
#info_type_D .information .date span{ padding:5px 0 5px 30px; color:#666; font-size:15px; display:block; background:url(../images/icon/icon_date.png) no-repeat; background-size:21px 21px; background-position:1px 50%;}

/* Notice */
#notice .information ul{  margin:0; padding:0; list-style: none; }
#notice .information ul li{ float:none; width: 100%; margin:0; padding:10px 5px; border-bottom:1px solid #ddd;  display:inline-block;  }
#notice .information ul li:nth-child(even) {background: #fafafa}
#notice .information ul li a{ display:inline-block; padding:0px 0; width:100%; }
#notice .information ul li a:hover{ color:#333; text-decoration:none}
#notice .information .date{ float:left; width:12%; padding:5px 5px 5px 10px;}
#notice .information .date span{ padding:0 0 0px 30px; color:#666; font-size:15px; display:block; background:url(../images/icon/icon_date.png) no-repeat; background-size:21px 21px; background-position:4px 50%;}
#notice .information .number{ float:left; width:10%; padding:5px 0;  }
#notice .information .title{ float:left; width:50%; padding:5px 0;  }
#notice .information p{}
#notice .information .download{ float:right; width:auto; }
#notice .information ul .title_area{ border-bottom:2px solid #0f599b; color:#0f599b;}

/* media */
#MediaA .information ul{  margin:0 0 0 -3.3%; list-style:none; padding:0; }
#MediaA .information ul li{ width:30%; margin:0 0 20px 3.3%; float:left; position:relative; }
#MediaA .information ul li .cover{ background:#f4f4f4; box-shadow:0 0 3px rgba(0,0,0,.2); border-radius:2px; padding:10px 15px 5px 15px; }
#MediaA .information ul li img{ width:100%; box-shadow:0 0 0;}
#MediaA .information ul li:nth-child(3n+1) { clear:both}
#MediaA .information .date{ position: relative; text-align: center; }
#MediaA .information .date span{ padding:5px 0 5px 30px; color:#666; font-size:15px; display:inline-block; background:url(../images/icon/icon_date.png) no-repeat; background-size:21px 21px; background-position:3px 50%;}
#MediaA .information p{ text-align: center; }
#MediaA .information ul li:hover .cover{ background:#e8f7ff; box-shadow:0 0 3px rgba(0,0,0,.3); }
#MediaA .information ul li a:hover{ text-decoration:none; color:#333; }

#MediaB .information ul{  margin:0 0 0 -2%; list-style:none; padding:0; }
#MediaB .information .clip{ display:none;}
#MediaB .information ul li{  width:23%; margin:0 0 20px 2%; float:left; position:relative; }
#MediaB .information ul li .cover{ background:#fdfdfd; box-shadow:0 0 3px rgba(0,0,0,.2); border-radius:0px; padding:5px 5px 5px 5px; }
#MediaB .information ul li img{ width:100%; box-shadow:0 0 0;}
#MediaB .information ul li:nth-child(4n+1) { clear:both}
#MediaB .information .date{ position: relative; text-align: center; }
#MediaB .information .date span{ padding:5px 0 5px 30px; color:#666; font-size:15px; display:inline-block; background:url(../images/icon/icon_date.png) no-repeat; background-size:21px 21px; background-position:3px 50%;}
#MediaB .information p{ text-align: center; }
#MediaB .information ul li:hover .cover{ background:#f9f9ff; box-shadow:0 0 3px rgba(0,0,0,.3); }
#MediaB .information ul li a:hover{ text-decoration:none; color:#333; }

.youtube_video{ width:70%; box-shadow:0 5px 10px rgba(0,0,0,.5); background:#000; padding:10px; border:1px solid #fff; margin-top:30px;}
.youtube_video iframe{ width:100%; min-height:420px;}
.youtube_video video{ width:100%; min-height:420px;}

/* Information - Full Page Display */
#Information_detail #Inner_Type_A li{ float:left; width:23%; margin:0 0 15px 2%; text-align: center;}
#Information_detail #Inner_Type_A li img{ max-width:100%; box-shadow:0 0 3px rgba(0,0,0,.5); height: auto; max-height:255px;}
#Information_detail #Inner_Type_A li:nth-child(3n+1) { clear:none}
#Information_detail #Inner_Type_A li:nth-child(4n+1) { clear:both}

#Inner_Type_F ul  { margin:0; padding:0; }
#Inner_Type_F ul li { width:100%; margin:0; }
#Inner_Type_F ul li iframe { height:800px; width:100%}
/* Sub Menu */

.left_menu{ float:left; width:22%; margin: 30px 0 30px 0px; box-shadow: 0px 0px 4px rgba(0,0,0,.2); }
.submenu{  background: #f6fbff}
.submenu .title { background: url(../images/icon/bg_category.png) #0f599b top left; margin:0px; padding:0px; text-align: center; background-size:cover;  }
.submenu .title p { font-size:23px; color:#fff; text-shadow:0px 0px 1px rgba(0,0,0,.3); padding:25px 0px; margin:0;} 

.arrowlistmenu{ background: #fff }
.arrowlistmenu ul {list-style: none; margin: 0; padding: 0; font-size:17px;}
.arrowlistmenu ul ul { background:rgba(255,255,255,.7); font-size:15px; }
.arrowlistmenu ul ul ul { padding:0 0 0 20px; font-size:13px;}
.arrowlistmenu ul li { border-bottom: 1px solid #ddd; position: relative; overflow: hidden; transition: all .4s ease;}
.arrowlistmenu ul ul li {border-bottom: 0px solid #ddd;}
.arrowlistmenu ul li a { color: #333; padding:10px; text-decoration:none; display:block; transition:all 0.3s; cursor: pointer;}
.arrowlistmenu ul ul ul li a { padding:5px 10px; }
.arrowlistmenu ul li a:hover{color:#0f599b;}

.arrowlistmenu ul li a.current{ background:#0f599b; color:#fff}
.arrowlistmenu ul ul li a.current{ background:#0f599b; color:#fff}
.arrowlistmenu ul ul ul li a.current{ background:#0f599b; color:#fff;}
/* Level 3
.arrowlistmenu ul ul ul li a.current{ background:#0f599b; color:#fff;}
*/
.expandable_main ul li a { background-image: none; }
.arrowlistmenu .openheader ul li a { background-image: none; }

/* Subject Menu */
.subject_template_left_menu{ float:left; width:100%; margin: 0px 0 30px 0px; }
.subject_template{ }
.subject_template .title {margin-bottom:5px; color:#ffa100; text-align: left; font-size:24px; padding:15px 0px 15px 0px;  font-weight: bold; border-bottom:2px solid #ffa100;}
.subject_template ul{ list-style:none; margin:0; padding:0px}
.subject_template ul li{ margin-bottom:5px; float: left; margin-right:5px;  }
.subject_template ul li a{ padding:5px 15px; display:block; border-radius:8px; box-shadow: 0 2px 3px rgba(0,0,0,.1) ; background:#f9f0d8; color:#333  }
.subject_template ul li a:hover{ color:#fff; background:#F90}
.subject_template ul li a.current{ color:#fff; background:#ffa100;  }


/* Site Map */
.site-map { margin:0; padding:0;}
.site-map ul{ list-style:none; margin:0 0 0 -3%; padding:0;}
.site-map ul li{ float: left; width: 22%; margin:0 0 15px 3%; padding:0; list-style:none;}
.site-map ul li:nth-child(4n+1){ clear: both; }
.site-map ul li ul{ list-style:none; margin:0 0 0 0px; padding:0;}
.site-map ul li ul li{ float: none; width: 100%; margin:0; }
.site-map ul li ul li ul{ list-style:none; margin:0 0 0 15px; padding:0;}

.site-map ul li a{ color:#0f599b; padding:5px 0px; display:block; border-bottom:1px solid #ddd;}
.site-map ul li a:hover{ text-decoration:none;}
.site-map ul li ul li a{ border-bottom:0px solid #ddd; color:#333}

/* Other */
.contactus{}
.contactus .info{ float: left; width:49%; }
.contactus .info td{ padding-right:10px;}
.contactus .location{ float:right; width:49%;}
.contactus .location iframe{ height:380px; width:100%; border:1px solid #ddd; box-shadow:0 0 3px rgba(0,0,0,.2)}

.btn_back{ margin: 0px auto; text-align: center; margin-top: 50px;}

.logo_m{ display:none}

#FullPage  .left_menu { display:none;}

#FullPage .subject_template{ width:100%;}
#FullPage .subject_template .title { float:left; background: none; color:#333; text-align: left; margin:0; padding:5px 30px 10px 30px; font-size: 23px; text-shadow: 0px 0px 1px rgba(0,0,0,.3);}

#FullPage .subject_template ul{ list-style:none; margin:0; float:left; border-top: 1px solid #1799da; border-left: 1px solid #1799da; border-right: 1px solid #1799da; }
#FullPage .subject_template ul li{ float:left;  }
#FullPage .subject_template ul li+li{ float:left; border-left:1px solid #ddd; }
#FullPage .subject_template ul li a{ background:#fff; padding:7px 24px; display:block; font-size:15px;}
#FullPage .subject_template ul li a:hover{ background:#0087ca;  color:#fff}
#FullPage .subject_template ul li a.current{ background:#ffa800; color:#fff}

#table_box{ border:1px solid #163673; padding:1px; background:#fff;border-collapse:inherit} 
#table_box tr:nth-child(1), #title_head{ background:#14336e; color:#fff;} 
#table_box tr:nth-child(even) td{ background:#f7feff} 

.wrap .dropdown span {cursor: pointer;border-bottom:1px solid #039;color:#039; font-size:16px; border:1px solid #ddd; padding:5px 30px 5px 5px; background:url(../images/icon/down.gif) no-repeat; background-position:90% 50%;  }
.wrap .dropdown { float:right; margin: 0 0; }
.wrap  .dropdown-content {
  display: none;
  position: absolute; right:0;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2);
  padding: 0;
  z-index: 1;
}
.wrap .dropdown:hover .dropdown-content {  display: block;}
.wrap .dropdown-content ul { list-style: none; padding:5px; margin:0; display: flex;
  flex-direction: column-reverse;}
.wrap .dropdown-content ul li {  float: right;  width:100%;}
.wrap .dropdown-content ul li a{ display:block; padding:5px ; text-align: center; border-bottom:1px dotted #ddd; color:#333 }
.wrap .dropdown-content ul li a:hover { background:#039; color:#fff; }

.dncalendar-note-list {
overflow-y: scroll;

height: 166px;
scrollbar-color: #ffdb55 #ff9d34;
scrollbar-width: thin;
	}
/* calendar */

.dncalendar-header h2 { color: #4aaeac; }

/* popup_this */
#popup_this h2 { color:#fff; font-size:21px; line-height:26px;}
#popup_this h3 { color:#0098e3; background:#fff; font-size:19px; line-height:23px;}
#popup_this {
    text-align:center; 
    margin-top: 0px;
    margin-left: 0px;
    width:80%;
    background: #3ca4d7; background-size: 500px 612px; background-position:94% 50%  ; color:#fff;
	
	 max-width:960px; 
}
#popup_this a{ color:#FC0; }
#popup_this a:hover{ color: #F66; }

#popup_this .content { min-width:800px; min-height:450px; overflow-y: auto; padding:30px ; margin:30px; border:1px solid #fff; }

.b-close {
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
    color: #333;
    background: #fff;
    padding: 3px 10px;
}
.b-close:hover { 
    background: #fac217;
}

#m_logo{display: none }
@media screen and (max-width: 1024px) {
	#popup_this .content { min-width: auto; }
}
@media screen and (max-width: 800px) {
#popup_this {  width:90%; background-size: 200px 245px;  }
#popup_this .content  {

min-height:240px;
max-height:420px; padding:30px ; 
	}
}
.fade-in-image {
  animation: fadeIn 4s;
  -webkit-animation: fadeIn 4s;
  -moz-animation: fadeIn 4s;
  -o-animation: fadeIn 4s;
  -ms-animation: fadeIn 4s;
}
@keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-moz-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-webkit-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-o-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-ms-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}


.video_box {float: left; width: 40%; position: relative; margin-left:30px; }
.video_box  ul{ list-style:none; margin:0; padding:0 }
.video_box  ul li { width:100%; margin:0 0 10px 0}
.video_box  ul li iframe{ border:2px solid #ffe300; border-top: 5px solid #ffe300;}
.video_box  ul li+li iframe{border:2px solid #ed6d2a; border-top: 5px solid #ed6d2a;}
.video_box .more_area{ position:relative; float:left; width:100%; height:20px; background-color:#fff; color:#000 !important; text-align:center; font-size:18px; margin-bottom:10px !important; }
.video_box .more_area a { color: #c0c0c0; }
.video_box .more_area a:hover{ color: #c0c0c0; }

.video_english_box {float: left; width: 100%; position: relative; margin-top:20px; }
.video_english_box  ul{ list-style:none; margin:0; padding:0; }
.video_english_box  ul li { width:100%; margin:0; }
.video_english_box  ul li iframe{ border:2px solid #ffe300; border-top: 5px solid #ffe300;}
.video_english_box  ul li+li iframe{border:2px solid #ed6d2a; border-top: 5px solid #ed6d2a;}

.video_area_box { position:relative; float:left; width: 100%; }
.video_area_box .video { position:relative; float:left; width:50%; margin-bottom:20px; }
.video_area_box .video iframe { width:50%; min-height:360px}

.navbar { position: relative; float: left; color:#666; font-size:16px; width:100%; text-align:left; margin-left:10px; }
.navbar a { text-decoration: none; color: #666; }
.navbar a:hover { text-decoration: underline; color: #FFA500; }