@import url("../css/normalize.css");
@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700);
/*
font-family:'Roboto Condensed', "Microsoft JhengHei", sans-serif;
*/
html{height:100%; font-size:62.5%;}
html, button, input, select, textarea {color:#333;}
body{font-size:15px; font-size:1.5rem; /* =13px */
color:#333; font-family:'Roboto Condensed', sans-serif; font-weight:400;
height:auto!important;min-height:100%;height:100%;
overflow-x:hidden;
background:#111;}
/* ��滨蒾 */
::-moz-selection{background:#93b951; color:#fff; text-shadow:none;}
::selection {background:#93b951; color:#fff; text-shadow:none;}
/* 閮剔蔭��鞟內����烾�讛𠧧 */
::-webkit-input-placeholder{color:#aaa;}
:-moz-placeholder{color:#aaa;}
.placeholder{color:#aaa;}
hr{display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0;}
/* 蝘駁膄��𣇉���蓥�钅�㯄�� */
img{vertical-align:middle;}
/* 蝘駁膄fieldset��鞱身璅��� */
fieldset{border:0; margin:0; padding:0;}
/* �蘨��閮望���堒���笔��凒隤踵㟲憭批�� */
textarea{resize:vertical;}
a{color:#09F; text-decoration:none;}
a:hover, a:active, a:focus{outline:0; color:#06F;}
/* --- ! --- */
/* --- GLOBAL --- */
body{-webkit-font-smoothing:antialiased;}
.wrapper{width:1000px !important; min-width:1000px; margin:0 auto;}
/* --- HEADER --- */
#header-container{position:relative; height:170px; background:#fff;
box-shadow:0 1px 3px rgba(0,0,0,.2);-moz-box-shadow:0 1px 3px rgba(0,0,0,.2);-webkit-box-shadow:0 1px 3px rgba(0,0,0,.2);}
#header-container header{position:relative; height:120px;}
#header-container #logo{margin:0; position:absolute; top:14px; left:50%; margin-left:-258px;
background:url(../images/tnss-logo@2x.png) no-repeat;
width:516px; height:145px;
background-size:516px 145px;
text-indent:-99999em;}
.top-links{margin:0; padding:0; list-style:none;
background:#73a917;
position:absolute; top:12px; right:5px;
font-size:12px; font-size:1.2rem; font-weight:normal;}
.top-links li{float:left; line-height:25px; color:#777; height:25px;}
/* Font Resizer */
.top-links .resizer{background:#fff; }
.top-links .resizer a{color:#aaa; font-weight:bold; padding:0 5px;}
.top-links .resizer a:hover{background:#fff; color:#00407d;}
.top-links .resizer .small {font-size:12px;}
.top-links .resizer .medium{font-size:16px;}
.top-links .resizer .large {font-size:20px;}
body.small .resizer .small,
body.medium .resizer .medium,
body.large .resizer .large{color:#00407d; }
.top-links .name{color:#fff; font-size:13px; font-size:1.3rem;}
.top-links a{color:#fff; display:inline-block;*display:inline;zoom:1; padding:0 10px; }
.top-links a:hover{color:#fff; background-color:#002a53;}
.top-links .btn-member{padding:2px 10px !important; line-height:18px; margin-right:5px;
opacity:1;-moz-opacity:1;-webkit-opacity:1;filter:alpha(opacity=100);}
.top-links .btn-logout{padding:2px 10px !important; line-height:18px;
opacity:1;-moz-opacity:1;-webkit-opacity:1;filter:alpha(opacity=100);}
.top-links .fb{background:url(../images/icon-fb.png) no-repeat #002a53; width:25px; padding:0; text-indent:-99999em;}
/* --- NAV TOP --- */
#header-container nav{position:relative; z-index:999;}
#menu{padding:0; margin:0 auto; list-style:none; width:1000px; /*background:url(../images/nav-hover.png) no-repeat;*/}
#menu a.active{text-decoration:none;}
/*
#menu .about {background-position:0 0;}
#menu .news {background-position:-122px 0;}
#menu .newsletter {background-position:-244px 0;}
#menu .events {background-position:-366px 0;}
#menu .member {background-position:-488px 0;}
#menu .accreditation{background-position:-610px 0;}
#menu .download {background-position:-732px 0;}
#menu .links {background-position:-854px 0;}
#menu .about:hover {background-position:0 0;}
#menu .news:hover {background-position:-122px 0;}
#menu .newsletter:hover {background-position:-244px 0;}
#menu .events:hover {background-position:-366px 0;}
#menu .member:hover {background-position:-488px 0;}
#menu .accreditation:hover{background-position:-610px 0;}
#menu .download:hover {background-position:-732px 0;}
#menu .links:hover {background-position:-854px 0;}
*/
.sf-menu { font-family:'Microsoft JhengHei', "敺株��迤暺煾��";}
.sf-menu, .sf-menu *{margin:0; padding:0; list-style:none;}
.sf-menu{height:53px;}
.sf-menu li .menulink{/*text-indent:-99999em;*/ height:50px; width:125px;
/*background-image:url(../images/nav.png); background-repeat:no-repeat;*/
line-height:50px; color:#111; font-size:16px; font-size:1.6rem; font-weight:700;
text-align:center;
transition:all .2s; -webkit-transition:all .2s;}
.sf-menu li .menulink:hover{color:#78a62a;
/*filter:alpha(opacity=0);opacity:0;-moz-opacity:0;-webkit-opacity:0;*/}
.sf-menu li{position:relative; -webkit-transition:background .2s; transition:background .2s;}
.sf-menu li.first{margin:0;}
.sf-menu li:hover, .sf-menu li.sfHover{-webkit-transition:none; transition:none;}
.sf-menu li a:hover{color:#111;}
.sf-menu > li{float:left;}
.sf-menu li:hover > ul, .sf-menu li.sfHover > ul{display:block;}
.sf-menu a{display:block; box-sizing:border-box; text-decoration:none; position:relative;}
.sf-menu ul{position:absolute; top:100%; left:0; z-index:99; display:none;
width:100%;
background:#fff;
box-shadow:0 2px 3px rgba(0,0,0,.3);
-moz-box-shadow:0 2px 3px rgba(0,0,0,.3);
-webkit-box-shadow:0 2px 3px rgba(0,0,0,.3);}
.sf-menu ul a{zoom:1; color:#111; font-size:14px; font-size:1.4rem; line-height:18px; line-height:1.8rem; font-weight:700;
padding:8px 10px; border-bottom:1px solid #ccc;}
.sf-menu ul a:hover{background:#73a917; color:#fff; border-bottom:1px solid #659513;}
.sf-menu ul li{float:none;}
.sf-menu ul ul{top:-1px; left:100%;}
.sf-menu ul ul li{float:none;}
.sf-menu ul .sub{}
.sf-menu ul .sub:hover{}
/* --- ! --- */
/* --- CONTAINER --- */
#content-container{height:auto!important;min-height:380px;height:380px;
background:url(../images/h-bg-wide.jpg) center 0 no-repeat #fff;
box-sizing:border-box; }
/* --- ! --- */
/* Sub Menu */
#sub-menu{float:left;
width:165px; /*height:auto!important;min-height:280px;height:280px;*/
box-sizing:border-box;
margin-top:40px;
background:#00407d;}
#sub-title{background:#002a53; color:#fff; margin:0; text-align:right; padding-right:15px;
line-height:64px; font-size:22px; font-size:2.2rem; color:#fff; font-family:'Microsoft JhengHei', "敺株��迤暺煾��"; font-weight:700;
text-rendering:optimizeLegibility;}
#sub-list{margin:0; padding:0; list-style:none;}
#sub-list li{text-align:right; color:#eee; font-family:'Microsoft JhengHei', "敺株��迤暺煾��"; font-weight:400; font-size:14px;}
#sub-list li a{display:block; color:#eee; box-sizing:border-box; padding:13px 15px; border-top:1px solid #003466;}
#sub-list li a:hover{background:#78a62a;}
/* --- ! --- */
/* Content */
#content{position:relative; box-sizing:border-box;
margin-top:40px; padding-bottom:40px;
float:right;
width:815px;}
#content.no-submenu{float:none; width:100%;}
#content header{position:relative;}
#content header h2{box-sizing:border-box;
background:url(../images/page-title-arrow.png) 42px bottom no-repeat #002a53;
margin:0;
padding:0 38px;
display:inline-block;*display:inline;zoom:1;
line-height:64px; font-size:22px; font-size:2.2rem; color:#fff; font-family:'Microsoft JhengHei', "敺株��迤暺煾��"; font-weight:400;
text-rendering:optimizeLegibility;}
#content article{box-sizing:border-box; position:relative;
padding:32px;
background:#fbfbfb;
border:3px solid #cacaca; border-top:0px solid #cacaca;
height:auto!important;min-height:400px;height:400px;}
.part-title{margin:0 0 20px; padding:5px 0;
font-size:18px; font-size:1.8rem; color:#094f92; font-family:'Microsoft JhengHei', "敺株��迤暺煾��";
text-rendering:optimizeLegibility;
border-bottom:2px solid #ccc;}
/* --- ! --- */
/* --- Breadcrumb ---*/
#breadcrumb{color:#e1e1e1; font-size:12px;font-size:1.2rem; line-height:1.4; position:absolute; right:8px; top:30%;}
#breadcrumb ul{margin:0; padding:0; list-style:none;}
#breadcrumb ul li{display:inline-block;*display:inline;zoom:1;}
#breadcrumb a{color:#e1e1e1;}
#breadcrumb em{margin:0 10px 0 6px;}
/* --- ! --- */
/* --- PAGE --- */
.page{font-size:13px;font-size:1.3rem; margin:0px 0px; padding:10px 0; text-align:center; clear:both;}
.page span a, .page span a:hover, .page .current, .page .disabled, .page select{padding:6px 10px; margin:3px; }
.page select{margin:0 3px !important;}
.page a{color:#333; border:1px solid #ccc; cursor:pointer; text-decoration:none; }
.page a:hover{color:#fff; background:#78a62a; border:1px solid #78a62a;}
.page .current{color:#333; background:#f9f9f9; border:1px solid #e3e3e3; font-weight:bold;}
.page .disabled{color:#ddd; border:1px solid #ddd;}
.page .pageTo{padding:3px 3px; margin:2px; width:50px;}
/* --- ! --- */
/* --- FOOTER --- */
footer{height:auto!important;min-height:115px;height:115px;
color:#aaa; font-size:13px;font-size:1.3rem; line-height:18px; line-height:1.8rem;
box-sizing:border-box;}
footer #footer-logo{background:url(../images/footer-tnss-logo@2x.png) 50% 50% no-repeat;
width:98px; height:115px;
background-size:98px 80px;
float:left; text-indent:-99999em; margin-left:12px;}
footer address{float:left; font-style:normal; padding:27px 0px; margin-left:15px;}
footer address span{font-size:13px; font-size:1.3rem;}
footer address strong{color:#f8f8f8;}
footer address a{color:#aaa;}
footer .recommend{color:#555; font-size:12px;}
footer .huaweb{color:#555;}
footer .huaweb:before{content:" | "; margin:0 5px;}
/* --- ! --- */
/* Top */
.scrollup{width:46px; height:46px; text-indent:-9999px; position:fixed; bottom:35px; right:3%;
display:none; background:url(../images/btn-top.png) no-repeat;}
/* Hide from both screenreaders and browsers */
.hidden{display:none !important; visibility:hidden;}
/* Clearfix: contain floats */
.clearfix:before,
.clearfix:after {
content: ""; /* 1 */
display: table; /* 2 */
}
.clearfix:after{clear: both;}
/* For IE 6/7 only */
.clearfix{*zoom: 1;}
/* --- COMM --- */
.maxWidth { width:100%;}
.maxHeight { height:100%; margin:0 auto;}
.floatL{ float:left; }
.floatR{ float:right; }
.explanation{font-size:12px;font-size:1.2rem; color:#C60; font-weight:normal;}
.required{color:#f00 !important; font-weight:normal;}
#ui-datepicker-div{font-size:12px;font-size:1.2rem;}
.ui-datepicker-trigger{margin-left:3px; cursor:pointer;}
.noneData{font-size:13px;font-size:1.3rem; color:#999; text-align:center; clear:both;}
form{}
.fieldRequired{text-align:right; color:#666;}
.important{color:#f00 !important;}
.border-none{border:none !important;}
.dataUpdate h2{font-size:18px;font-size:1.8rem; color:#333;}
/* --- ! --- */
/* --- Input, Select, Textarea --- */
input[type=radio], input[type=checkbox]{vertical-align:-1px; margin:0 3px;}
input[type=text], input[type=password], input[type=email], input[type=tel], input[type=date], textarea, select{
box-sizing:border-box;
padding:5px 6px;
margin:1px;
background:#fff;
border:1px solid #aaa;
box-shadow:inset 0 1px 1px #eee;
-moz-box-shadow:inset 0 1px 1px #eee;
-webkit-box-shadow:inset 0 1px 1px #eee;
font-size:13px; font-size:1.3rem;
}
select{padding:4px;}
textarea{width:95%;}
input[type=radio], input[type=checkbox]{vertical-align:-2px; margin-right:5px;}
input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, input[type=date]:focus, textarea:focus, select:focus{
outline:0;
background:#f9fdf3;
border:1px solid #78a62a;
box-shadow:0 0 3px rgba(197,229,142,0.8);
-moz-box-shadow:0 0 3px rgba(197,229,142,0.8);
-webkit-box-shadow:0 0 3px rgba(197,229,142,0.8);
}
/* input[type=file] */
.field-file{overflow:hidden; position:relative;
font-size:13px;font-size:1.3rem; color:#000!important; font-weight:400;
padding:5px 10px !important;}
.field-file [type=file]{
display:block;
min-height:100%; min-width:100%;
filter:alpha(opacity=0);opacity:0;-moz-opacity:0;-webkit-opacity:0;
position:absolute; right:0; text-align:right; top: 0;
cursor:pointer;}
#search-block input.date{width:70px;}
/* --- ! --- */
/* --- Buttons --- */
input[type=submit], input[type=button], input[type=reset], a.btn, .field-file{
-webkit-appearance:none;
display:inline-block; *display:inline; *zoom:1;
vertical-align:top; text-align:center;
color:#fff; font-size:15px; font-size:1.5rem; font-family:'Roboto Condensed', 'Microsoft JhengHei', '敺株��迤暺煾��', sans-serif;
border:0; border-bottom:2px solid #618d17;
background:#77a529;
padding:6px 13px;
cursor:pointer;
text-decoration:none;
box-shadow:0 1px 3px rgba(0,0,0,.2);
transition:all .1s linear;-moz-transition:all .1s linear;-webkit-transition:all .1s linear;
}
input[type=submit]:hover, input[type=button]:hover, input[type=reset]:hover, a.btn:hover, .field-file:hover{
background-color:#3c5809;
border-bottom:0px solid #3c5809;
margin-top:2px;
text-decoration:none;
box-shadow:inset 0 20px 20px rgba(0,0,0,.2);
}
.buttons{text-align:center; margin:20px 0; height:auto!important;min-height:45px;height:45px;}
.buttons input[type=submit], .buttons input[type=button], .buttons input[type=reset], .buttons a.btn{
padding:8px 24px; line-height:18px; line-height:1.8rem; font-size:15px;font-size:1.5rem;
margin-left:10px; margin-right:10px;
}
.btn-secondary{background-color:#999!important; border-color:#777!important; }
.btn-secondary:hover{}
/* --- ! --- */
/* --- search-block --- */
#search-block{font-size:13px;font-size:1.3rem; color:#333; padding:8px 10px 8px; margin-bottom:12px; background:#e3e3e3;}
#search-block label{margin-right:5px; float:left; }
#search-block input{margin-right:5px; margin-left:5px;}
#search-block select{margin-left:3px;}
#search-block input[type=text]{}
#search-block input[type=submit], #search-block input[type=button]{
float:right;
width:65px;
font-weight:normal; font-size:13px;font-size:1.3rem;}
#search-block input[type=submit]:hover, #search-block input[type=button]:hover{
text-decoration:none;}
#search-block input[type=submit]{padding:5px;}
#search-block .date{width:75px;}
#search-block .ui-datepicker-trigger{vertical-align:-2px; cursor:pointer;}
/* --- List --- */
.list{}
.list thead th, .list thead td{border-bottom:2px solid #aaa; padding:3px; font-weight:700;}
.list thead th{font-size:12px;font-size:1.2rem;}
.list tbody th, .list tbody td{padding:8px 8px; border-bottom:1px solid #ddd;}
.list tbody th{border-left:none; background:#fffcf7; text-align:left;}
.list tbody tr{transition:all .2s;-moz-transition:all .2s;-webkit-transition:all .2s;}
.list tbody tr:nth-child(even){background:#f3f3f3;}
.list tbody tr:hover th, .list tbody tr:hover td{background:#f1f1f1;}
.list a.top{color:#f60;}
.list a:hover {color:#06F;}
/* --- ! --- */
/* --- Alert Information --- */
.alert-info{
background:#fefcf0; border:1px solid #e1bb8e;
font-size:14px;font-size:1.4rem; color:#111;
text-align:center; padding:30px 20px 30px; margin:0 auto 0;}
.alert-info h4{margin:0; font-size:16px;font-size:1.6rem;}
.alert-info a{color:#264ea6;}
/* error */
.alert-error{background:#fdf1f1; border:1px solid #e4b6b6;}
/* --- ! --- */
/* --- DATA FIELDS --- */
.group-title{margin:0; padding:4px 8px;
font-size:16px; font-size:1.6rem; color:#094e91; font-family:'Roboto', '敺株��迤暺煾��';
background:#dfeaf5;
border-left:3px solid #094e91;}
.data-fields{margin:0; padding:0; list-style:none; position:relative;}
.data-fields li{border-bottom:1px solid #ddd;
box-sizing:border-box; padding:4px 5px; padding-left:105px;
position:relative; vertical-align:top;
display:inline-block;*display:inline;zoom:1;
width:100%; height:auto!important;min-height:45px;height:45px;
color:#333; line-height:32px; }
.data-fields li.col-2{width:49%; float:left;}
.data-fields h5{margin:0; display:inline-block;*display:inline;zoom:1;
position:absolute; left:8px;
font-size:13px; font-size:1.3rem; color:#30506f; font-weight:normal; line-height:18px;
box-sizing:border-box; padding:6px 0;
border-right:1px solid #ddd; width:85px;}
.data-fields h5:after{content:"嚗�";}
.data-fields p{margin-top:0;}
.data-fields .col-after{float:right; text-align:left; width:50%; box-sizing:border-box;}
/*.data-fields .photo{position:absolute; top:0; right:0; z-index:10;
margin:0; background:#fff; border:10px solid #fff;}
.data-fields .photo img{height:90px;}
.data-fields .cover{position:absolute; top:0px; right:0px; z-index:10; text-align:center;
margin:0; box-sizing:border-box; padding:5px 5px 0 20px; background:#fff; width:auto;}
.data-fields .cover img{margin:0 auto; border:10px solid #ddd;
max-width:120px!important;height:auto!important;width:expression(this.width > 120 ? "120px" : this.width)!important;}
.data-fields .content img{
max-width:740px!important;height:auto!important;width:expression(this.width > 740 ? "740px" : this.width)!important;
margin:0 auto;
}*/
/* --- ! --- */
@media
all and (min--moz-device-pixel-ratio: 1.5),
all and (-o-min-device-pixel-ratio: 3/2),
all and (-webkit-min-device-pixel-ratio: 1.5),
all and (min-device-pixel-ratio: 1.5),
all and (min-resolution: 1.5dppx) {
#header-container #logo{
background:url(../images/tnss-logo@2x.png) no-repeat;
background-size:516px 145px;
}
footer #footer-logo{
background:url(../images/footer-tnss-logo@2x.png) 50% 50% no-repeat;
background-size:98px 80px;
}
}