/*--
Author: W3layouts
Author URL: http://w3layouts.com
License: Creative Commons Attribution 3.0 Unported
License URL: http://creativecommons.org/licenses/by/3.0/
--*/
body{
	margin: 0;
	font-family: "微軟正黑體";
}
@font-face {
    font-family: 'Roboto-Regular';
    src: url(../fonts/Roboto-Regular.ttf) format('truetype');
}
@font-face {
    font-family: 'Playball-Regular';
    src: url(../fonts/Playball-Regular.ttf) format('truetype');
}
@font-face {
    font-family: 'Exo-ExtraBold';
    src: url(../fonts/Exo-ExtraBold.ttf) format('truetype');
}
@font-face {
    font-family: 'Exo-Regular';
    src: url(../fonts/Exo-Regular.ttf) format('truetype');
}
body a{
	transition: 0.5s all ease;
	-webkit-transition: 0.5s all ease;
	-moz-transition: 0.5s all ease;
	-o-transition: 0.5s all ease;
	-ms-transition: 0.5s all ease;
}
h1,h2,h3,h4,h5,h6{
	margin:0;	
}
p{
	margin:0;
}
ul,label{
	margin:0;
	padding:0;
	line-height: initial;
	height: initial;
}
body a:hover{
	text-decoration:none;
}
/*--banner--*/
.btnM-pc{
	display: block;
}
.btnM-web{
	display: none;
}
.banner{
	/*background:url(../images/banner.jpg) no-repeat 0px 0px;*/
	background-size:cover;
}
.banr-info {
	background-color: rgba(7,47,110,0.91);
	min-height: 700px;
}
.logo {
  /*text-align: center;*/

  margin: 0 auto;
  width: 8%;
}
.logo a {
  /*text-align: center;*/
  font-family: 'Playball-Regular';
  font-size: 2.5em;
  color: #262f2c;
  display: block;
}
.logoimg {
	width: 166px;
}
.bnr-text {
  text-align: center;
  margin-top: 5em;
}
.bnr-text h2 {
  font-family: 'Playball-Regular';
  font-size: 2.5em;
  color: #000;
}
.bnr-text h1 {
  font-family: 'Exo-ExtraBold';
  font-size: 7em;
  width: 51%;
  color: #000;
  margin: 0 auto;
  font-weight: bolder;
  line-height: 1.2em;
}
.bnr-text h1 label {
  background-color: rgb(110, 224, 162);
  padding: 0px;
  text-align: center;
  color: #fff;
}
.bnr-text h4 {
  font-size: 1.5em;
  color: #000;
  letter-spacing: 2px;
  width: 36%;
  margin: 0 auto;
  line-height: 1.4em;
   margin-top: 1.5em;
}
/*--//banner--*/
/*--navigation--*/
.top-nav {
	text-align:center;
	background-color:#6ee0a2;
}
span.menu {
	display: none;
}
.top-nav ul {
	margin: 0;
}
.top-nav ul li{
	list-style-type:none;
	display: inline-block;
	margin: 0 2em;
}	
/* Effect 11: text fill based on Lea Verou's animation http://dabblet.com/gist/6046779 */
.top-nav ul li a {
  position: relative;
  display: inline-block;
  margin: 20px 25px;
  outline: none;
  color: #000;
  text-transform: uppercase;
  font-size: 1.2em;
  font-family: 'Exo-ExtraBold';
}
.top-nav ul li a:hover,
.top-nav ul li a:focus {
	outline: none;
}
.cl-effect-16 a {
	color: #6f8686;
	text-shadow: 0 0 1px rgba(111,134,134,0.3);
}
.cl-effect-16 a::before {
	color: #fff;
	content: attr(data-hover);
	position: absolute;
	opacity: 0;
	text-shadow: 0 0 1px rgba(255,255,255,0.3);
	-webkit-transform: scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);
	-moz-transform: scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);
	transform: scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	pointer-events: none;
}

.cl-effect-16 a:hover::before,
.cl-effect-16 a:focus::before {
	-webkit-transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);
	-moz-transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);
	transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);
	opacity: 1;
}
.cl-effect-16 a.active{
	color:#fff;
}
/*--//navigation--*/
/* Effect 16: fall down */
/*--banner-bottom--*/
.bnr-botom {
  margin: 5em 0;
}
.bnr-botom-right{
  padding:0;
  position: relative;
}
.bnr-botom-right img {
  width: 100%;
}
.bnr-botom-info {
  position: absolute;
  top: 8em;
  left: 51%;
  width: 100%;
  z-index: 1;
}
.bnr-botom-info:before {
  content: '';
  width: 10%;
  height: 2px;
  position: absolute;
  top: 12%;
  left: -14%;
  background-color: #6ee0a2;
}
.bnr-botom-left h3{
	font-size:2.8em;
	font-family: 'Exo-Regular';
	color:#000;
	line-height: 1.4em;
}
.bnr-botom-left h3 span{
	color:#6ee0a2;
}
.bnr-botom-left p {
  color: #99989B;
  font-size: 1em;
  width: 38%;
  line-height: 1.8em;
  margin-top: 1.5em;
}

/*== >Tabs ========= */
/*tabs style 1 [ defult ]*/
Label.space{
	width: 0px;
}
.fund-head {
	margin-bottom: 10px;
	font-family: "微軟正黑體";
	margin-top: 10px;
	font-size: 20px;
	font-weight: 700;
	padding-left: 10px;
	padding-right: 10px;
	width: 200px;
	text-align: center;
	letter-spacing: 2px;
	background-color: #a5d8dc;
}
.fundtit {
	background-color: #e1f0f1;
}
.line{
	border-top: 1px solid #565656;
}
.fundName {
	color: #1e4e88;
	line-height: 1.4em;
	margin-top: 0;
	font-weight: 600;
	background-color: #f8f8f8;
}
.fundName-ex {
	color: #282828;
}
.fundline {
	border-bottom: 10px solid #e1f0f1;
}
.dez-tabs .tab-pane {
	padding: 20px 0;
}
.dez-tabs .nav-tabs > li > a {
	color: #3d474a;
	font-weight: 600;
	font-size: 17px;
	-webkit-border-radius: 0;
	border-radius: 0;
	font-family: "微軟正黑體";
}
.dez-tabs .nav-tabs > li.active > a,
.dez-tabs .nav-tabs > li.active > a:focus,
.dez-tabs .nav-tabs > li.active > a:hover {
    background-color: #fff;
    border-color: #ddd;
    border-bottom: 1px solid #FFF;
}
.dez-tabs .nav > li > a:focus,
.dez-tabs .nav > li > a:hover {
    background-color: transparent;
}
.dez-tabs .nav li a:hover {
    border: 1px solid transparent;
}
.dez-tabs .nav-tabs > li > a i {
    color: #EFBB20;
    margin-right: 5px;
}
/*tabs bg  [ tabs background ]*/

.dez-tabs.bg-tabs .nav-tabs > li > a {
	border: 1px solid #ddd;
	background-color: #efefef;
	margin-right: 2px;
}
.dez-tabs.bg-tabs .nav-tabs > li.active > a {
    border-bottom: 1px solid transparent;
    background-color: #fff;

}
.dez-tabs.vertical.bg-tabs .nav-tabs > li > a {
    border: 1px solid #ddd;
}
.dez-tabs.vertical.bg-tabs .nav-tabs > li.active > a {
    border-right: 1px solid transparent;
}
.dez-tabs.vertical.right.bg-tabs .nav-tabs > li > a {
    border: 1px solid #ddd;
}
.dez-tabs.vertical.right.bg-tabs .nav-tabs > li.active > a {
    border-left: 1px solid transparent;
}
/*tabs bg & top border  [ tabs background & top border in active ]*/

.dez-tabs.border-top .nav-tabs > li.active > a {
    border-top: 5px solid #EFBB20;
    padding: 9px 15px 7px;
}
/*tabs style 2 [ content with border outer ]*/

.dez-tabs.border .tab-pane {
    padding: 20px;
    border: 1px solid #ddd;
    margin-top: -1px;
}
/*tabs style 3  [ left-nav ]*/

.dez-tabs.vertical .nav-tabs {
    float: left;
    width: 170px;
    border-bottom: none;
    border-right: 1px solid #DDD;
}
.dez-tabs.vertical .tab-pane {
    padding: 10px 0 10px 20px;
}
.dez-tabs.vertical .nav-tabs li {
    float: none;
    margin-right: -1px;
}
.dez-tabs.vertical .nav-tabs li a {
    margin-right: 0;
    border-right: none;
}
.dez-tabs.vertical .nav-tabs li.active a {
    border-bottom: 1px solid #ddd;
}
.dez-tabs.vertical .tab-content {
    border-left: 1px solid #DDD;
    margin-left: 169px;
}

/*tabs style 4  [ left-nav & content with border ]*/

.dez-tabs.vertical.border .tab-pane {
    padding: 20px;
    margin-left: -1px;
}
/*tabs style 5  [ right-nav ]*/

.dez-tabs.vertical.right .nav-tabs {
    border-left: 1px solid #ddd;
    border-right: none;
    float: right;
}
.dez-tabs.vertical.right .nav-tabs li {
    margin-right: 0;
    margin-left: -1px;
}
.dez-tabs.vertical.right .nav-tabs li a {
    border-right: 1px solid transparent;
    border-left: none;
}
.dez-tabs.vertical.right .nav-tabs li.active a {
    border-right: 1px solid #ddd;
    border-left: none;
}
.dez-tabs.vertical.right .tab-content {
    border-left: none;
    border-right: 1px solid #ddd;
    margin-right: 169px;
    margin-left: 0;
}
.dez-tabs.vertical.right .tab-pane {
    padding: 10px 20px 10px 0;
}
/*tabs style 6  [ right-nav & content with border ]*/

.dez-tabs.vertical.right.border .tab-pane {
    padding: 20px;
    margin-right: -1px;
}
/*== >Accordians =====*/

.panel {
    box-shadow: none;
    -webkit-box-shadow: none;
}
.dez-accordion .panel {
    border: none;
    border-radius: 0;
    margin-bottom: -1px;
}
.acod-head {
    position: relative;
}
.acod-title {
    margin-top: 0;
    margin-bottom: 0;
}
.acod-head .fa {
    margin-right: 5px;
}
.acod-head a {
    display: block;
    padding: 12px 40px 12px 15px;
    border: 1px solid #ddd;
}
.acod-head a,
.acod-head a:hover,
.acod-head a.collapsed:hover {
    color: #EFBB20;
}
.acod-head a.collapsed,
.acod-head a.collapsed:after {
    color: #3d474a;
}
.acod-head a:after {
    font-family: 'FontAwesome';
    content: "\f068";
    float: right;
    color: #EFBB20;
    font-size: 14px;
    font-weight: normal;
    position: absolute;
    right: 12px;
    top: 12px;
}
.acod-head a.collapsed:after {
    content: "\f067";
}
.acod-body {
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    border-top: 1px solid transparent;
    margin-top: -1px;
}
.acod-content {
    margin: 20px;
}
/*== accordian rounded corners ==*/

.dez-accordion.rounded .panel:first-child .acod-head a {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
.dez-accordion.rounded .panel:last-child .acod-head a.collapsed {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
.dez-accordion.rounded .panel:last-child .acod-body {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
.dez-accordion.rounded .panel:last-child .acod-body.in {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
/*== accordian space between panel ==*/

.dez-accordion.space .panel {
    margin-bottom: 5px;
}
.dez-accordion.rounded.space .panel .acod-head a {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
.dez-accordion.rounded.space .panel .acod-head a.collapsed {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
.dez-accordion.rounded.space .panel .acod-body {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
/*== accordian background for title ==*/

.dez-accordion.bg-title .acod-head a {
    background-color: #F7F8FA;
}
/*== accordian no cover border with content area ==*/

.dez-accordion.no-cover .acod-body {
    border: none;
}
.dez-accordion.no-cover .acod-content {
    padding-left: 20px;
    margin-right: 10px;
    border-left: 2px solid #e8e8e8;
    position: relative;
}
.dez-accordion.no-cover .acod-content:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: -5px;
    width: 8px;
    height: 8px;
    background-color: #fff;
    border: 2px solid #e8e8e8;
}
/*== accordian title bottom bordered ==*/

.dez-accordion.border-bottom .acod-head a {
    border-left: none;
    border-right: none;
    border-top: none;
    padding-left: 0;
}
/*== accordian title bottom bordered with colored ==*/

.dez-accordion.border-bottom.no-border .acod-head a {
    border: none;
}
.dez-accordion.no-border .acod-content {
    margin-top: 10px;
    margin-bottom: 10px;
}

/*== >margin (around) ======*/

.mx-auto {
    margin: 0px auto;
}
.m-a0 {
    margin: 0;
}
.m-a5 {
    margin: 5px;
}
.m-a10 {
    margin: 10px;
}
.m-a15 {
    margin: 15px;
}
.m-a20 {
    margin: 20px;
}
.m-a30 {
    margin: 30px;
}
.m-a40 {
    margin: 40px;
}
.m-a50 {
    margin: 50px;
}
.m-a60 {
    margin: 60px;
}
.m-a70 {
    margin: 70px;
}
.m-a80 {
    margin: 80px;
}
.m-a90 {
    margin: 90px;
}
.m-a100 {
    margin: 100px;
}
/*== >marging (top) ==*/

.m-t0 {
    margin-top: 0;
}
.m-t5 {
    margin-top: 5px;
}
.m-t10 {
    margin-top: 10px;
}
.m-t15 {
    margin-top: 15px;
}
.m-t20 {
    margin-top: 20px;
}
.m-t30 {
    margin-top: 30px;
}
.m-t40 {
    margin-top: 40px;
}
.m-t50 {
    margin-top: 50px;
}
.m-t60 {
    margin-top: 60px;
}
.m-t70 {
    margin-top: 70px;
}
.m-t80 {
    margin-top: 80px;
}
.m-t90 {
    margin-top: 90px;
}
.m-t100 {
    margin-top: 100px;
}
/*== >marging (bottom) ==*/

.m-b0 {
    margin-bottom: 0;
}
.m-b5 {
    margin-bottom: 5px;
}
.m-b10 {
    margin-bottom: 10px;
}
.m-b15 {
    margin-bottom: 15px;
}
.m-b20 {
    margin-bottom: 20px;
}
.m-b30 {
    margin-bottom: 30px;
}
.m-b40 {
    margin-bottom: 40px;
}
.m-b50 {
    margin-bottom: 50px;
}
.m-b60 {
    margin-bottom: 60px;
}
.m-b70 {
    margin-bottom: 70px;
}
.m-b80 {
    margin-bottom: 80px;
}
.m-b90 {
    margin-bottom: 90px;
}
.m-b100 {
    margin-bottom: 100px;
}

/*product detail page css*/
/* Product Details*/

.btn-quantity {
    width: 150px;
}
.product-description.dex-tabs.border-top .nav-tabs > li.active > a {
    border-top: 2px solid #efbb20;
}
.product-description.dex-tabs .nav-tabs > li > a i {
    color: #efbb20;
}
.dex-tabs.bg-tabs .nav-tabs > li > a {
    background-color: #fcfcfc;
}
/*Product Review*/

ol.commentlist {
    list-style: none;
    margin: 0;
}
ol.commentlist li {
    position: relative;
    padding: 0;
    margin-bottom: 20px;
    background: #F7F8FA;
    padding: 20px;
    border: 1px dashed #EEEEEE;
}
ol.commentlist li img {
    float: left;
    border: 5px solid #FFF;
    width: 80px;
    height: auto;
}
ol.commentlist li .comment-text {
    padding-left: 100px;
}
ol.commentlist li .meta {
    margin-bottom: 5px;
}
ol.commentlist li .meta strong {
    font-size: 16px;
}
ol.commentlist li .meta .time {
    color: #999;
    display: block;
    font-size: 14px;
}
ol.commentlist li .description p {
    margin: 0;
}
ol.commentlist li .star-rating {
    position: absolute;
    top: 20px;
    right: 20px;
}
.comment-reply-title {
    margin-top: 0;
}
.comment-form [class*="comment-form"] {
    width: 49%;
}
.comment-form label {
    display: block;
}
.comment-form [class*="comment-form"] input,
.comment-form [class*="comment-form"] textarea {
    border: 1px solid #CCC;
    padding: 8px 10px;
    width: 100%;
}
.comment-form {
    margin: 0 -15px;
}
.comment-form [class*="comment-form"],
.comment-form .form-submit {
    margin-bottom: 20px;
    padding: 0 15px;
}
.comment-form .form-submit input:active,
.comment-form .form-submit input:focus,
.comment-form .form-submit input:hover {
    background: #037a85;
}
.dez-quik-search {
    background-color: #fff;
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    z-index: 999;
    display: n one;
    overflow: hidden;
}
.dez-quik-search form {
    width: 100%;
    max-width: 1200px;
    margin: auto;
    position: relative;
}
.dez-quik-search .form-control {
    padding: 15px;
    width: 100%;
    height: 90px;
    border: none;
    background: none;
    color: #fff;
    font-size: 20px;
}
.dez-quik-search .form-control::-moz-placeholder {
    color: #fff;
}
.dez-quik-search .form-control:-moz-placeholder {
    color: #fff;
}
.dez-quik-search .form-control:-ms-input-placeholder {
    color: #fff;
}
.dez-quik-search .form-control::-webkit-input-placeholder {
    color: #fff;
}
.dez-quik-search span {
    position: absolute;
    right: 15px;
    top: 50%;
    margin: -15px 0;
    height: 25px;
    font-size: 20px;
    cursor: pointer;
}
#gmap_canvas {
    width: 100%;
    height: 400px;
}
#gmap_canvas img {
    max-width: none!important;
    background: none!important
}
/* sosiyal btn color */

.fb-btn {
    background-color: #4867AA;
}
.tw-btn {
    background-color: #1DA1F2;
}
.gplus-btn {
    background-color: #DC4A38;
}
.pin-btn {
    background-color: #CC2127;
}
.link-btn {
    background-color: #0274B3;
}
.dez-social-icon.dez-social-icon-lg li a {
    font-size: 14px;
    height: 35px;
    line-height: 34px;
    padding: 0;
    width: 35px;
}
/* Team Section */

.dez-media.dez-media-left .dez-info-has,
.dez-media.dez-media-top .dez-info-has,
.dez-media.dez-media-right .dez-info-has {
    bottom: auto;
    margin-bottom: 0;
    top: 0;
}
/* Top Side Icon */

.dez-media.dez-media-top .dez-info-has {
    margin-top: -100px;
}
.dez-media.dez-media-top:hover .dez-info-has,
.dez-box:hover .dez-media.dez-media-top .dez-info-has {
    margin-top: 0;
}
/* Left Side Icon */

.dez-media.dez-media-left .dez-info-has {
    left: 0;
    padding: 15px;
    width: auto;
    margin-left: -60px;
}
.dez-media.dez-media-left:hover .dez-info-has {
    margin-left: 0px;
}
.dez-media.dez-media-left .dez-social-icon li {
    display: block;
    margin: 3px 0;
}
/* Right Side Icon */

.dez-media.dez-media-right .dez-info-has {
    right: 0;
    padding: 15px;
    width: auto;
    left: auto;
    margin-right: -60px;
}
.dez-media.dez-media-right:hover .dez-info-has {
    margin-right: 0px;
}
.dez-media.dez-media-right .dez-social-icon li {
    display: block;
    margin: 3px 0;
}

/*= comment form = */

.comment-respond {
    padding: 30px 30px;
    border: 1px solid #e9e9e9;
}
.comment-respond .comment-reply-title {
    text-transform: uppercase;
    font-size: 20px;
}
.comment-respond .comment-reply-title {
    font-size: 16px;
    font-weight: 600;
}
.comments-area .comment-form {
    margin: 0 -15px;
}
.comments-area .comment-form .comment-notes {
    display: none;
}
.comments-area .comment-form p {
    width: 33.333%;
    float: left;
    padding: 0 15px;
    margin-bottom: 30px;
    position: relative;
}
.comments-area .comment-form p.form-allowed-tags {
    width: 100%;
}
ol.comment-list li.comment .comment-respond .comment-form p {
    padding: 0 15px !important;
}
.comments-area .comment-form p label {
    display: none;
    line-height: 18px;
    margin-bottom: 10px;
}
.comments-area p:before {
    font-family: "FontAwesome";
    display: inline-block;
    position: absolute;
    left: 15px;
    top: 0;
    font-size: 16px;
    color: #ccc;
    width: 40px;
    height: 40px;
    line-height: 40px;
    border: 1px solid #e1e6eb;
    text-align: center;
    border-radius: 4px 0 0 4px;
    -webkit- border-radius: 4px 0 0 4px;
}
.comments-area p.comment-form-author:before {
    content: "\f007";
}
.comments-area p.comment-form-email:before {
    content: "\f0e0";
}
.comments-area p.comment-form-url:before {
    content: "\f0ac";
}
.comments-area p.comment-form-comment:before {
    content: "\f040";
}
.comments-area .comment-form p input[type="text"],
.comments-area .comment-form p textarea {
    width: 100%;
    height: 40px;
    line-height: 6px 12px;
    padding: 10px 10px 10px 50px;
    border: 1px solid #e1e6eb;
    border-radius: 4px;
    -webkit-border-radius: 4px;
}
.comments-area .comment-form p.comment-form-comment {
    width: 100%;
    display: block;
    clear: both;
}
.comments-area .comment-form p textarea {
    height: 120px;
}
.comments-area .comment-form p.form-submit {
    clear: both;
    float: none;
    width: 100%;
    margin: 0;
}
.comments-area .comment-form p input[type="submit"] {
    background-color: #EFBB20;
    border: none;
    border-radius: 3px;
    border-style: solid;
    border-width: 1px;
    color: #fff;
    display: inline-block;
    font-weight: 600;
    padding: 10px 20px;
    text-transform: uppercase;
}
.comments-area .comment-form p input[type="submit"]:hover,
.comments-area .comment-form p input[type="submit"]:focus,
.comments-area .comment-form p input[type="submit"]:active {
    background-color: #6ab33e;
    border-color: #6ab33e;
    color: #fff;
}
@media only screen and (max-width: 767px) {
    .comments-area .comment-form p {
        width: 100%;
        float: none;
        margin-bottom: 20px;
    }
    .comment-respond {
        padding: 20px;
    }
}
/*== >Breadcrumb ====*/

.breadcrumb-row {
    background: #e8e9e9;
    padding: 20px 0;
}

.breadcrumb-row ul {
    margin: 0;
}
.breadcrumb-row ul li {
	padding: 0;
	margin-right: 3px;
	color: #333333;
	font-family: "微軟正黑體";
}

.breadcrumb-row ul li:after {
    content: "/";
    margin-left: 7px;
}
.breadcrumb-row ul li:last-child {
    color: #333333;
}
.breadcrumb-row ul li:last-child:after {
    display: none;
}
/*== >Tables ====*/

.table > tbody > tr > td,
.table > tbody > tr > th,
.table > tfoot > tr > td,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > thead > tr > th {
	padding: 7px;
	font-family: "微軟正黑體";
}
.table.borderless > tbody > tr > td,
.table.borderless > tbody > tr > th {
    border: none;
}
.table > th {
	text-align: center;
}
.bs-docs-example{
	margin-bottom: 2em;

}
.table-striped{
	border: 1px solid #E2E2E2;
}
.tnone{
	border: 0px;
}
.table-ex{
	padding: 0px 8px;
	font-family: "微軟正黑體";
	margin-top: -10px;
}
/*data table*/

.dataTable .sorting_asc .checkbox {
    margin-right: 0;
}
/*== >Image effects ==*/
/*use for section*/

.overlay-black-light,
.overlay-black-middle,
.overlay-black-dark,
.overlay-gradient-light,
.overlay-gradient-middle,
.overlay-gradient-dark,
.overlay-white-light,
.overlay-white-middle,
.overlay-white-dark,
.overlay-primary-light,
.overlay-primary-middle,
.overlay-primary-dark {
    position: relative;
}
.overlay-black-light:after,
.overlay-black-middle:after,
.overlay-black-dark:after,
.overlay-gradient-light:after,
.overlay-gradient-middle:after,
.overlay-gradient-dark:after,
.overlay-white-light:after,
.overlay-white-middle:after,
.overlay-white-dark:after,
.overlay-primary-light:after,
.overlay-primary-middle:after,
.overlay-primary-dark:after {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
.overlay-black-light:after,
.overlay-black-middle:after,
.overlay-black-dark:after {
    background: #000;
}
.overlay-gradient-light:after,
.overlay-gradient-middle:after,
.overlay-gradient-dark:after {
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.65) 100%);
    /* FF3.6-15 */
    
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.65) 100%);
    /* Chrome10-25,Safari5.1-6 */
    
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.65) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000', GradientType=0);
    /* IE6-9 */
}
.overlay-white-light:after,
.overlay-white-middle:after,
.overlay-white-dark:after {
    background: #FFF;
}
.overlay-primary-light:after,
.overlay-primary-middle:after,
.overlay-primary-dark:after {
    background: ;
}
.overlay-black-light:after {
    opacity: 0.3;
}
.overlay-black-middle:after {
    opacity: 0.5;
}
.overlay-black-dark:after {
    opacity: 0.9;
}
.overlay-gradient-light:after {
    opacity: 0.3;
}
.overlay-gradient-middle:after {
    opacity: 0.5;
}
.overlay-gradient-dark:after {
    opacity: 0.9;
}
.overlay-white-light:after {
    opacity: 0.5;
}
.overlay-white-middle:after {
    opacity: 0.7;
}
.overlay-white-dark:after {
    opacity: 0.9;
}
.overlay-primary-light:after {
    opacity: 0.3;
}
.overlay-primary-middle:after {
    opacity: 0.5;
}
.overlay-primary-dark:after {
    opacity: 0.9;
}
.overlay-black-light .container,
.overlay-black-middle .container,
.overlay-black-dark .container,
.overlay-white-light .container,
.overlay-white-middle .container,
.overlay-white-dark .container,
.overlay-primary-light .container,
.overlay-primary-middle .container,
.overlay-primary-dark .container,
.overlay-black-light .container-fluid,
.overlay-black-middle .container-fluid,
.overlay-black-dark .container-fluid,
.overlay-white-light .container-fluid,
.overlay-white-middle .container-fluid,
.overlay-white-dark .container-fluid,
.overlay-primary-light .container-fluid,
.overlay-primary-middle .container-fluid,
.overlay-primary-dark .container-fluid {
    position: relative;
    z-index: 1;
}
/*use for box*/

.overlay-bx {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    z-index: 10;
    opacity: 0;
    visibility: hidden;
}
.overlay-icon {
    list-style: none;
    width: 160px;
    height: 40px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -20px -75px;
}
.overlay-icon a {
    display: inline-block;
    padding: 0;
    margin: 0 2px;
}
.overlay-icon a i {
    background-color: #FFF;
}
.overlay-bx:hover a > i,
.dez-media:hover .overlay-bx a > i,
.dez-box-bx:hover .overlay-bx a > i {
    opacity: 1;
    visibility: visible;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out;
}
.overlay-bx:hover,
.dez-media:hover .overlay-bx,
.dez-box:hover .overlay-bx,
.ow-img:hover .overlay-bx,
.ow-portfolio-img:hover .overlay-bx {
    opacity: 1;
    visibility: visible;
}
/*---------------------------------------------------------------
27. PAGE-CONTENT
---------------------------------------------------------------*/

.page-wraper {
    background: #f7f8fa;
}
.page-content {
    margin-top: 0;
    padding-bottom: 50px;
}
.content-area {

}
.section-full {
    position: relative;
}
.section-full:last-child {
    margin-bottom: -50px;
}
/*= Section Head Part =*/

.section-head {
    margin-bottom: 50px;
}
.section-head.no-margin {
    margin-bottom: 0;
}
.section-head h1,
.section-head h2,
.section-head h3 {
    margin-top: 0;
}
.title-small {
    display: block;
    color: #494949;
    margin-bottom: 15px;
}
.section-head p {
    padding-top: 10px;
    font-size: 14px;
    color: #797979;
}
.text-center.section-head p {
    margin-left: auto;
    margin-right: auto;
    max-width: 700px;
}
.text-white {
    color: #FFF;
}
.text-white h1,
.text-white h2,
.text-white h3,
.text-white h4,
.text-white h5,
.text-white h6,
.text-white p,
.text-white .title-small {
    color: #FFF;
}

.restBox{
  margin:0 auto;
  padding:4px 10px;
  text-align: left;
  background-color:rgba(7,47,110,0.91);
  color:#fff;
  font-size:14px;
  line-height: 1.4;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.restText{
  display: inline-block;
  margin:0 3px 0 0;
  padding:4px;
  background-color:#a5d8dc;
  color:#333;
  font-size:14px;
  line-height: 1.4;
  border-radius: 4px;
  text-align: center;
}
.restBox > .restText{
  display: inline-block;
  margin:0 3px;
  padding:2px;
}
@media only screen and (max-width: 480px) {
  .restText{
    display: block;
    margin:0 0 4px 0;
    padding:4px;
  }
}

/*= Section Content Part =*/

.section-content {} @media only screen and (max-width: 1024px) {
    .section-full {
        background-attachment: scroll !important;
    }
}
@media only screen and (max-width: 991px) {
    .page-content {
        margin-top: 0;
    }
}





/*------------------ Slider Part starts Here----------*/

#slider3,#slider4 {
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  margin: 0 auto;
}
.rslides_tabs {
  list-style: none;
  padding: 0;
  background: rgba(0,0,0,.25);
  box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0);
  -moz-box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0);
  -webkit-box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0);
  font-size: 18px;
  list-style: none;
  margin: 0 auto 50px;
  max-width: 540px;
  padding: 10px 0;
  text-align: center;
  width: 100%;
}
.rslides_tabs li {
  display: inline;
  float: none;
  margin-right: 1px;
}
.rslides_tabs a {
  width: auto;
  line-height: 20px;
  padding: 9px 20px;
  height: auto;
  background: transparent;
  display: inline;
}
.rslides_tabs li:first-child {
  margin-left: 0;
}
.rslides_tabs .rslides_here a {
  background: rgba(255,255,255,.1);
  color: #fff;
  font-weight: bold;
}
.events {
  list-style: none;
}
.banner-title .callbacks_container {
  background-color: rgba(84, 179, 174, 0.99);
  padding: 10em 2em 0;
  display: inline-block;
  min-height:598px;
}
.callbacks {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
}
.callbacks li {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
}
.callbacks img {
  position: relative;
  z-index: 1;
  height: auto;
  border: 0;
}
.callbacks_nav {
  	position: absolute;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  top: 41%;
  left: 10%;
  z-index: 3;
  text-indent: -9999px;
  overflow: hidden;
  text-decoration: none;
  height: 51px;
  width: 22px;
  background: transparent url("../images/icons.png") no-repeat 0px -4px;
}
.callbacks_nav:active {
  opacity: 1.0;
}
.callbacks_nav.next {
  left: auto;
  right: 10%;
  background: url(../images/icons.png)no-repeat -41px -4px;
}
#slider3-pager a ,#slider4-pager a {
  display: inline-block;
}
#slider3-pager span, #slider4-pager span{
  float: left;
}
#slider3-pager span,#slider4-pager span{
	width:100px;
	height:15px;
	background:#fff;
	display:inline-block;
	border-radius:30em;
	opacity:0.6;
}
#slider3-pager .rslides_here a , #slider4-pager .rslides_here a {
  background: #FFF;
  border-radius:30em;
  opacity:1;
}
#slider3-pager a ,#slider4-pager a{
  padding: 0;
}
#slider3-pager li ,#slider4-pager li{
	display:inline-block;
}
.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
}
.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  z-index:0 !important;
}
.rslides li{
  position: relative;
  display: block;
  float: left;
}
.rslides img {
  height: auto;
  border: 0;
  width:100%;
}
.callbacks_tabs {
  list-style: none;
  position: absolute;
  bottom: -34%;
  z-index: 0;
  left: -2%;
  padding: 0;
  margin: 0;
}
.slider-top{
	text-align: center;
	padding:10em 0;
}
.slider-top h1{
	font-weight:700;
	font-size:48px;
	color:#010101;
}
.slider-top p{
	font-weight:400;
	font-size:20px;
	padding:1em 7em;
	color:#010101;
}
.slider-top ul.social-slide{
	display:inline-flex;
	margin: 0px;
	padding: 0px;
}
ul.social-slide li i{
	width:70px;
	height:74px;
	background:url(../images/img-resources.png)no-repeat;
	display: inline-block;
	margin:0px 15px;
}
ul.social-slide li i.win{
	background-position:-6px 0px;
} 
ul.social-slide li i.android{
	background-position:-110px 0px;
}
ul.social-slide li i.mac{
	background-position:-215px 0px;
}
.callbacks_tabs li{
	display: inline-block;
	margin: 0 .3em;
}
@media screen and (max-width: 600px){
  .callbacks_nav {
    top: 47%;
    }
}
/*----*/
.callbacks_tabs a{
 visibility: hidden;
}
.callbacks_tabs a:after {
  content: "\f111";
  font-size: 0;
  font-family: FontAwesome;
  visibility: visible;
  display: block;
  height: 9px;
  width: 9px;
  display: inline-block;
  background: #dad9e7;
  border-radius: 50%;
}
.callbacks_here a:after {
  background: #E4DB1A; 
}
/*--//slider end here--*/
/*--//banner-bottom--*/
/*--hm-about-grids--*/
.hm-about-grids {
  margin-top: 3em;
}
 h4.title {
  font-size: 2em;
  color: #6EE0A2;
  font-family: 'Exo-Regular';
}
.home-about h5 {
  font-size: 1.8em;
  color: #04020d;
  width: 50%;
}
.home-about p {
  font-size: 1em;
  color: #99989B;
  line-height: 1.8em;
  margin: 1em 0;
}
 a.more {
  font-size: 1.2em;
  color:#333333;
}
a.more:hover {
  background-color: #DFDB7C;
  color: #fff;
  padding: .2em 1em;
}
/*--//home-about-grids--*/
/*--work--*/
.work {
  margin-top: 5em;
}
.work-left {
  padding: 0;
}
.work-left img {
  margin-bottom: .3em;
}
.work-right{
	padding: 0;
}
.work img {
  width: 100%;
}
.work-grids {
  margin-top: 3em;
}
.work-left {
  padding: 0 0.3em 0 0;
}
.work-img-left {
  width: 59.6%;
  float: left;
  margin-right: 0.3em;
}
.work-img-right {
  float: left;
  width: 40%;
}
.work-img-right img {
  margin-bottom: .3em;
}
.work-img-left img {
  margin-bottom: .3em;
}
.work-img-right2 {
  width: 59.6%;
  float: left;
  margin-left: .3em;
}
.work-img-left2{
	float: left;
  width: 40%;
}
.work a {
	overflow: hidden;
	position: relative;
	display: block;
}
.work a .captn {
	position: absolute;
	height: 100%;
	width: 50%;
	top: 0;
	left: 0;
	background: url(../images/background2.png) repeat;
	text-align: center;
	-o-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.work a:hover .captn {
	width: 100%;
	left:0%;
}
.work a .captn {
	display: inline-block;
	color: #ffffff;
	top:0%;
	position: absolute;
	left: -50%;
	right: 0;
	background-color:rgba(223, 219, 124, 0.95);
	padding: 29% 0;
}
.work a .captn span {
  font-size: 3em;
  font-family: 'Exo-Regular';
  letter-spacing: 4px;
}
/*--//work--*/
/*--testimonial--*/
.testi{
	padding:5em 0;
}
.testi h4.title {
  text-align: center;
}
.testi-info {
  margin-top: 4em;
}
.testi p {
  font-size: 1em;
  color: #99989B;
  line-height: 1.8em;
  margin-bottom: 1em;
}
.testi h5 {
  font-size: 1em;
  color: #8B8181;
  text-align: right;
  margin-right: 37px;
}
.testi span {
  color: #fff;
  display: inline-block;
  font-size: 1.5em;
  position: absolute;
  left: -10%;
  top: -2%;
  background-color: #E8E582;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  line-height: 45px;
  text-align: center;
}
/*--//testimonial--*/
/* Footer Area
==========================================*/
#footer{}

.page{
	position: relative;
	width: 100%;
	height: auto;
	margin: 0 auto
}
.page .pagectr{
	position: relative;
	width: 96%;
	max-width: 1100px;
	height: auto;
	margin: 0 auto;
	color: #333333;
}
a{text-decoration:none;outline:none}
a:focus{outline:none}a,a:before,a:after{
	-webkit-transition-property:all;
	-moz-transition-property:all;
	-o-transition-property:all;transition-property:all;
	-webkit-transition-duration:0.3s;
	-moz-transition-duration:0.3s;
	-o-transition-duration:0.3s;transition-duration:0.3s;
	-webkit-transition-timing-function:ease-out;
	-moz-transition-timing-function:ease-out;
	-o-transition-timing-function:ease-out;transition-timing-function:ease-out}


@media (max-width: 940px){#cp table tr td:nth-child(1){padding:10px 5px;width:20%}#cp table tr td:nth-child(2){padding:10px 10px;width:40%}#cp table tr td:nth-child(3){padding:10px 10px;width:40%}#cp table thead tr td{font-size:22px;line-height:30px}#cp table tbody tr td{font-size:16px}#cp .btns #pc2,#cp .btns #op2{width:200px;height:50px;font-size:24px;line-height:50px}#cp .btns #pc2:before,#cp .btns #op2:before{position:absolute;width:40px;height:40px;left:25px;top:0px}}
@media (max-width: 768px){#cp .pagectr{padding:40px 0 80px 0}#cp table{width:92%}#cp table tr td:nth-child(1){padding:8px 5px;width:20%}#cp table tr td:nth-child(2){padding:8px 5px;width:40%}#cp table tr td:nth-child(3){padding:8px 5px;width:40%}#cp table thead tr td{font-size:22px;line-height:30px}#cp table tbody tr td{font-size:16px;line-height:22px}#cp .btns #pc2,#cp .btns #op2{width:130px;font-size:20px;padding:0}#cp .btns #pc2:before,#cp .btns #op2:before{display:none}}@media (max-width: 740px){#cp .tit{width:100%}}@media (max-width: 520px){#cp table tr td{vertical-align:top}#cp table .sbt{display:block}#cp table thead tr td{font-size:18px;line-height:30px}#cp table thead tr td:nth-child(1){display:none}#cp table thead tr td:nth-child(2){padding:8px 5px;width:50%}#cp table thead tr td:nth-child(3){padding:8px 5px;width:50%}#cp table tbody tr td{font-size:15px;line-height:22px}#cp table tbody tr td:nth-child(1){display:none}#cp table tbody tr td:nth-child(2){padding:35px 5px 8px 5px;width:50%}#cp table tbody tr td:nth-child(3){padding:35px 5px 8px 5px;width:50%}}
@media (max-width: 320px){#cp .pagectr{padding:30px 0 60px 0}#cp table{width:90%}}

#ftr{
	background: #f3f3f3;
	border-top: 5px solid #ff7c25;
	padding-top: 40px;
	font-family: "微軟正黑體";
	color: 333333;
}
#ftr .pagectr{height:auto}
#ftr .logo{
	display: block;
	position: relative;
	width: 100%;
	height: auto;
	padding-bottom: 5px;
	text-align: left
}
#ftr .logo img{display:inline-block;position:relative;width:180px;vertical-align:text-top}
#ftr .logo span{
	display: inline-block;
	position: relative;
	width: 280px;
	height: 100px;
	vertical-align: text-top;
	font-size: 24px;
	line-height: 80px;
	text-align: left;
	color: #000;
	padding-top: 20px
}
#ftr .tel{position:absolute;width:360px;height:40px;right:10px;top:0px;text-align:right;line-height:40px}
#ftr .tel span{color:#fd8d00;font-size:28px;font-weight:bold}
#ftr .fuc{position:absolute;width:360px;height:24px;right:10px;top:45px;text-align:right}
#ftr .fuc a{display:inline-block;position:relative;width:24px;height:24px;margin-left:5px}
#ftr .fuc a:nth-child(4){background:url(../images/ftrfucapp.png) no-repeat center;width:78px}
#ftr .fuc a:nth-child(1){background:url(../images/ftrfucfb.png) no-repeat center}
#ftr .fuc a:nth-child(2){background:url(../images/ftrfucline.png) no-repeat center}
#ftr .fuc a:nth-child(3){background:url(../images/ftrfucyt.png) no-repeat center}
#ftr .cr{position:relative;width:99%;height:auto;font-size:14px;text-align:left;line-height:20px;border-bottom:dotted 1px #333;padding-bottom:10px}
#ftr .cr span{display:inline-block;position:relative;width:auto}
#ftr .cr span:after{content:" │"}
#ftr .cr span:last-child:after{display:none}
#ftr .ntc{
	position: relative;
	width: 100%;
	height: auto;
	text-align: left;
	font-size: 15px;
	font-weight: bold;
	line-height: 22px;
	padding-top: 10px;
	list-style-type: disc;
	margin-left: 0px;
}
#ftr .ntc li{margin-left:25px;padding-bottom:10px}
#ftr .ntc li:last-child{padding-bottom:0}
#ftr .mng{position:relative;width:100%;height:auto;text-align:right;font-size:15px;padding-bottom:60px}

@media (max-width: 1000px){#ftr .pagectr{
	width: 94%;
	margin-left: 3%;
	margin-right: 3%;
}}

@media (max-width: 768px){#ftr .logo{width:100%;text-align:center;padding-bottom:0}
	#ftr .tel{position:relative;width:100%;height:auto;right:auto;top:auto;text-align:center}
	#ftr .fuc{position:relative;width:100%;height:auto;right:auto;top:auto;text-align:center;padding-bottom:10px}
	#ftr .cr{text-align:center}
	#ftr .cr span:nth-child(2):after{display:none}
	#ftr .ntc{list-style-type:none}
	#ftr .ntc li{margin-left:0}}

@media (max-width: 480px){
	#ftr .pagectr{
	width: 90%;
	margin-left: 5%;
	margin-right: 5%;
}
	#ftr .logo{padding-bottom:0}
	#ftr .logo img{width:150px}
	#ftr .logo span{width:100%;height:30px;font-size:18px;line-height:30px;text-align:center;padding-top:0}
	#ftr .tel{font-size:16px}
	#ftr .tel span{font-size:22px}
	#ftr .cr span{display:block}
	#ftr .cr span:after{
	content: " │";
	display: none;
}
	#ftr .cr span:nth-child(1):after{display:none}
	#ftr .ntc{
	list-style-position: inside;
	width: 100%;
}
	#ftr .ntc li{margin-left:0}
	#ftr .mng{text-align:center}}


/*--Typography--*/
.typo {
  padding: 4em 0;
}
h3.typo-title{
  font-size: 2.5em;
  color: #6EE0A2;
  font-family: 'Exo-Regular';
  text-align:center;
}
.show-grid [class^=col-] {
    background: #fff;
  text-align: center;
  margin-bottom: 10px;
  line-height: 2em;
  border: 10px solid #f0f0f0;
}
.show-grid [class*="col-"]:hover {
  background: #e0e0e0;
}
.grid_3{
	margin-bottom:2em;
}
.xs h3, h3.m_1{
	color:#000;
	font-size:1.7em;
	font-weight:300;
	margin-bottom: 1em;
}
.grid_3 p{
  color: #999;
  font-size: 0.85em;
  margin-bottom: 1em;
  font-weight: 300;
}
.grid_4{
	background:none;
	margin-top:50px;
}
.label {
  font-weight: 300 !important;
  border-radius:4px;
}  
.grid_5{
	background:none;
	padding:2em 0;
}
.grid_5 h3, .grid_5 h2, .grid_5 h1, .grid_5 h4, .grid_5 h5, h3.hdg{
	margin-bottom:1em;
	color: #6EE0A2;
	font-family: 'Exo-Regular';
}
.tab-content > .active {
  display: block;
  visibility: visible;
}
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
  z-index: 0;
}
/*--//Typography --*/
/*--contact-page--*/
.contact {
  padding: 5em 0;
}
.contact h3 {
	font-size: 2.5em;
	color: #6EE0A2;
	margin-bottom: 1em;
	font-family: 'Exo-Regular';
}
.map {
  margin:0 0 2em;
}
.map iframe {
  width: 100%;
  height: 340px;
}
.address p {
	color: #99989B;
	margin: 0 0 .5em 0;
	font-size: 1em;
	line-height:1.8em;
}
p.cnt-p {
  margin-bottom: 1.5em;
}
.address a {
	color: #201F1F;
	margin: 0 0 .5em 0;
	font-size: 1em;
}
.address a:hover {
  color: #201F1F;
  background-color: #E8E582;
  padding: 1px 5px;
}
.contact-form input[type="text"] {
	display: inline-block;
	background: none;
	border: 1px solid #A3A1A1;
	width: 100%;
	margin: 0 0 1.5em 0;
	outline: none;
	font-size: 1em;
	color: #555;
	padding: .8em 1em;
	-webkit-appearance: none;
}
.contact-form input[type="email"] {
  display: inline-block;
  background: none;
  border: 1px solid #A3A1A1;
  width:  100%;
  margin: 0 0 1.5em;
  outline: none;
  font-size: 1em;
  color: #555;
  padding: .8em 1em;
  -webkit-appearance: none;
}
.contact-form textarea {
  background: none;
  border: 1px solid #A3A1A1;
  width: 100%;
  display: block;
  height: 12.5em;
  outline: none;
  font-size: 1em;
  color: #555;
  resize: none;
  padding: .8em 1em;
  -webkit-appearance: none;
}
.contact-form input[type="submit"] {
  background: #E1DC7D;
  border: 1px solid #E1DC7D;
  padding: .6em 0;
  width: 35%;
  margin: 0.5em 18em 0;
  font-size: 1em;
  color: #333;
  font-weight: 400;
  letter-spacing: 1px;
  outline: none;
  transition: 0.5s all ease;
  -webkit-transition: 0.5s all ease;
  -moz-transition: 0.5s all ease;
  -o-transition: 0.5s all ease;
  -ms-transition: 0.5s all ease;
  -webkit-appearance: none;
}
.contact-form input[type="submit"]:hover{
   border:none;
  border-top: 1px solid #6EE0A2;
  border-bottom: 1px solid #6EE0A2;
  background-color: #fff;
  color: #6EE0A2;
}
.contact-grids:nth-child(1) {
  padding-left: 0;
}
.contact-grids:nth-child(2) {
  padding-right: 0;
}
/*--//contact-page--*/

/*--navigation--*/
.top-nav {
	text-align:center;
	background-color:#a5d8dc;
}
span.menu {
	display: none;
}
.top-nav ul {
	margin: 0;
}
.top-nav ul li{
	list-style-type:none;
	display: inline-block;
	margin: 0 2em;
}	
/* Effect 11: text fill based on Lea Verou's animation http://dabblet.com/gist/6046779 */
.top-nav ul li a {
	position: relative;
	display: inline-block;
	margin: 20px 25px;
	outline: none;
	color: #000;
	text-transform: uppercase;
	font-size: 1.2em;
	font-family: "微軟正黑體";
}
.top-nav ul li a:hover,
.top-nav ul li a:focus {
	outline: none;
}
.cl-effect-16 a {
	color: #6f8686;
	text-shadow: 0 0 1px rgba(111,134,134,0.3);
}
.cl-effect-16 a::before {
	color: #fff;
	content: attr(data-hover);
	position: absolute;
	opacity: 0;
	text-shadow: 0 0 1px rgba(255,255,255,0.3);
	-webkit-transform: scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);
	-moz-transform: scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);
	transform: scale(1.1) translateX(10px) translateY(-10px) rotate(4deg);
	-webkit-transition: -webkit-transform 0.3s, opacity 0.3s;
	-moz-transition: -moz-transform 0.3s, opacity 0.3s;
	transition: transform 0.3s, opacity 0.3s;
	pointer-events: none;
}

.cl-effect-16 a:hover::before,
.cl-effect-16 a:focus::before {
	-webkit-transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);
	-moz-transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);
	transform: scale(1) translateX(0px) translateY(0px) rotate(0deg);
	opacity: 1;
}
.cl-effect-16 a.active{
	color:#fff;
}
/*--//navigation--*/
/* Effect 16: fall down */
/*--banner-bottom--*/
.bnr-botom {
  margin: 5em 0;
}
.bnr-botom-right{
  padding:0;
  position: relative;
}
.bnr-botom-right img {
  width: 100%;
}
.bnr-botom-info {
  position: absolute;
  top: 8em;
  left: 51%;
  width: 100%;
  z-index: 1;
}
.bnr-botom-info:before {
  content: '';
  width: 10%;
  height: 2px;
  position: absolute;
  top: 12%;
  left: -14%;
  background-color: #6ee0a2;
}
.bnr-botom-left h3{
	font-size:2.8em;
	font-family: 'Exo-Regular';
	color:#000;
	line-height: 1.4em;
}
.bnr-botom-left h3 span{
	color:#6ee0a2;
}
.bnr-botom-left p {
  color: #99989B;
  font-size: 1em;
  width: 38%;
  line-height: 1.8em;
  margin-top: 1.5em;
}
/*------------------ Slider Part starts Here----------*/

#slider3,#slider4 {
  box-shadow: none;
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  margin: 0 auto;
}
.rslides_tabs {
  list-style: none;
  padding: 0;
  background: rgba(0,0,0,.25);
  box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0);
  -moz-box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0);
  -webkit-box-shadow: 0 0 1px rgba(255,255,255,.3), inset 0 0 5px rgba(0,0,0,1.0);
  font-size: 18px;
  list-style: none;
  margin: 0 auto 50px;
  max-width: 540px;
  padding: 10px 0;
  text-align: center;
  width: 100%;
}
.rslides_tabs li {
  display: inline;
  float: none;
  margin-right: 1px;
}
.rslides_tabs a {
  width: auto;
  line-height: 20px;
  padding: 9px 20px;
  height: auto;
  background: transparent;
  display: inline;
}
.rslides_tabs li:first-child {
  margin-left: 0;
}
.rslides_tabs .rslides_here a {
  background: rgba(255,255,255,.1);
  color: #fff;
  font-weight: bold;
}
.events {
  list-style: none;
}
.banner-title .callbacks_container {
  background-color: rgba(84, 179, 174, 0.99);
  padding: 10em 2em 0;
  display: inline-block;
  min-height:598px;
}
.callbacks {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
}
.callbacks li {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
}
.callbacks img {
  position: relative;
  z-index: 1;
  height: auto;
  border: 0;
}
.callbacks_nav {
  	position: absolute;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  top: 41%;
  left: 10%;
  z-index: 3;
  text-indent: -9999px;
  overflow: hidden;
  text-decoration: none;
  height: 51px;
  width: 22px;
  background: transparent url("../images/icons.png") no-repeat 0px -4px;
}
.callbacks_nav:active {
  opacity: 1.0;
}
.callbacks_nav.next {
  left: auto;
  right: 10%;
  background: url(../images/icons.png)no-repeat -41px -4px;
}
#slider3-pager a ,#slider4-pager a {
  display: inline-block;
}
#slider3-pager span, #slider4-pager span{
  float: left;
}
#slider3-pager span,#slider4-pager span{
	width:100px;
	height:15px;
	background:#fff;
	display:inline-block;
	border-radius:30em;
	opacity:0.6;
}
#slider3-pager .rslides_here a , #slider4-pager .rslides_here a {
  background: #FFF;
  border-radius:30em;
  opacity:1;
}
#slider3-pager a ,#slider4-pager a{
  padding: 0;
}
#slider3-pager li ,#slider4-pager li{
	display:inline-block;
}
.rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
}
.rslides li {
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  z-index:0 !important;
}
.rslides li{
  position: relative;
  display: block;
  float: left;
}
.rslides img {
  height: auto;
  border: 0;
  width:100%;
}
.callbacks_tabs {
  list-style: none;
  position: absolute;
  bottom: -34%;
  z-index: 0;
  left: -2%;
  padding: 0;
  margin: 0;
}
.slider-top{
	text-align: center;
	padding:10em 0;
}
.slider-top h1{
	font-weight:700;
	font-size:48px;
	color:#010101;
}
.slider-top p{
	font-weight:400;
	font-size:20px;
	padding:1em 7em;
	color:#010101;
}
.slider-top ul.social-slide{
	display:inline-flex;
	margin: 0px;
	padding: 0px;
}
ul.social-slide li i{
	width:70px;
	height:74px;
	background:url(../images/img-resources.png)no-repeat;
	display: inline-block;
	margin:0px 15px;
}
ul.social-slide li i.win{
	background-position:-6px 0px;
} 
ul.social-slide li i.android{
	background-position:-110px 0px;
}
ul.social-slide li i.mac{
	background-position:-215px 0px;
}
.callbacks_tabs li{
	display: inline-block;
	margin: 0 .3em;
}
@media screen and (max-width: 600px){
  .callbacks_nav {
    top: 47%;
    }
}
/*----*/
.callbacks_tabs a{
 visibility: hidden;
}
.callbacks_tabs a:after {
  content: "\f111";
  font-size: 0;
  font-family: FontAwesome;
  visibility: visible;
  display: block;
  height: 9px;
  width: 9px;
  display: inline-block;
  background: #dad9e7;
  border-radius: 50%;
}
.callbacks_here a:after {
  background: #E4DB1A; 
}
/*--//slider end here--*/
/*--//banner-bottom--*/
/*--hm-about-grids--*/
.hm-about-grids {
  margin-top: 3em;
}
 h4.title {
  font-size: 2em;
  color: #6EE0A2;
  font-family: 'Exo-Regular';
}
.home-about h5 {
  font-size: 1.8em;
  color: #04020d;
  width: 50%;
}
.home-about p {
  font-size: 1em;
  color: #99989B;
  line-height: 1.8em;
  margin: 1em 0;
}
 a.more {
  font-size: 1.2em;
  color:#333333;
}
a.more:hover {
  background-color: #DFDB7C;
  color: #fff;
  padding: .2em 1em;
}
/*--//home-about-grids--*/
/*--work--*/
.work {
  margin-top: 5em;
}
.work-left {
  padding: 0;
}
.work-left img {
  margin-bottom: .3em;
}
.work-right{
	padding: 0;
}
.work img {
  width: 100%;
}
.work-grids {
  margin-top: 3em;
}
.work-left {
  padding: 0 0.3em 0 0;
}
.work-img-left {
  width: 59.6%;
  float: left;
  margin-right: 0.3em;
}
.work-img-right {
  float: left;
  width: 40%;
}
.work-img-right img {
  margin-bottom: .3em;
}
.work-img-left img {
  margin-bottom: .3em;
}
.work-img-right2 {
  width: 59.6%;
  float: left;
  margin-left: .3em;
}
.work-img-left2{
	float: left;
  width: 40%;
}
.work a {
	overflow: hidden;
	position: relative;
	display: block;
}
.work a .captn {
	position: absolute;
	height: 100%;
	width: 50%;
	top: 0;
	left: 0;
	background: url(../images/background2.png) repeat;
	text-align: center;
	-o-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.work a:hover .captn {
	width: 100%;
	left:0%;
}
.work a .captn {
	display: inline-block;
	color: #ffffff;
	top:0%;
	position: absolute;
	left: -50%;
	right: 0;
	background-color:rgba(223, 219, 124, 0.95);
	padding: 29% 0;
}
.work a .captn span {
  font-size: 3em;
  font-family: 'Exo-Regular';
  letter-spacing: 4px;
}
/*--//work--*/
/*--testimonial--*/
.testi{
	padding:5em 0;
}
.testi h4.title {
  text-align: center;
}
.testi-info {
  margin-top: 4em;
}
.testi p {
  font-size: 1em;
  color: #99989B;
  line-height: 1.8em;
  margin-bottom: 1em;
}
.testi h5 {
  font-size: 1em;
  color: #8B8181;
  text-align: right;
  margin-right: 37px;
}
.testi span {
  color: #fff;
  display: inline-block;
  font-size: 1.5em;
  position: absolute;
  left: -10%;
  top: -2%;
  background-color: #E8E582;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  line-height: 45px;
  text-align: center;
}
/*--//testimonial--*/
/*--footer--*/
.footer {
  padding: 4em 0 3em;
  background-color: rgb(51, 51, 51);
}
.footer h4 {
  color: #fff;
  font-size: 1.5em;
  margin-bottom: 1em;
  font-family: 'Exo-Regular';
}
.footer-grids ul li {
  margin-bottom: 1em;
}
.footer-grids ul li a {
  color: #8D8D8D;
  font-size: 1em;
}
.footer-grids ul li a:hover {
  color: #E8E481;
}
.footer-grids h2 a {
  color: #6EE0A2;
  font-family: 'Playball-Regular';
  font-size: 2em;
}
.footer-grids p  a{
	color:#fff;
}
.footer-grids p a:hover {
  color: #E8E481;
}
.footer-grids p {
  color: #8D8D8D;
  font-size:1em;
  margin-top: 0.5em;
  line-height: 1.8em;
}
.footer-grids form {
  margin-top: 1.2em;
}
.footer-grids form input[type="text"] {
  width: 72%;
  padding: 9px 12px;
  font-size: 0.9em;
  float: left;
  color: #8D8D8D;
  outline: none;
  border: none;
  background: #fff;
  -webkit-appearance: none;
}
.footer-grids form input[type="submit"] {
  width: 20%;
  font-size: 0.9em;
  color: #333;
  outline: none;
  padding: 9px 12px;
  border:none;
  background: #E8E582;
  transition: 0.5s all;
  -webkit-transition: 0.5s all;
  -moz-transition: 0.5s all;
  -o-transition: 0.5s all;
  -ms-transition: 0.5s all;
  float: left;
  -webkit-appearance: none;
}
.footer-grids form input[type="submit"]:hover{
	background: #6EE0A2;
}
.footer-bottom {
  background-color: #201F1F;
  padding: 2em 0;
  text-align: center;
}
.footer-bottom p {
  color: #fff;
  font-size: 1em;
}
.footer-bottom p a{
 color:#fff;
}
.footer-bottom p a:hover{
 color:#6EE0A2;
 border-bottom:1px solid #fff;
}

/*--about-page--*/
.banr-info.abt-bnr {
	min-height: 85px;
}
.about {
	padding-top: 5em;
	padding-bottom: 8em;
}
.about-grid {
  margin-top: 5em;
}
.about-grid h3 {
	font-size: 2.5em;
	color: #262626;
	margin-bottom: 1em;
	font-family: "微軟正黑體";
	font-weight: 800;
}
.about h3 {
	font-size: 2.5em;
	color: #262626;
	margin-bottom: 1em;
	font-family: "微軟正黑體";
	font-weight: 800;
}
.about h4 {
	font-size: 2.0em;
	color: #262626;
	margin-bottom: 0.2em;
	font-family: "微軟正黑體";
	font-weight: 500;
	margin-top: -0.2em;
}
.about date {
	font-size: 1.4em;
	color: #262626;
	font-family: "微軟正黑體";
	font-weight: 500;
}
.about h5 {
	font-size: 1.8em;
	margin: -0.5em 0 0;
	line-height: 1.8em;
	color: #0e4a90;
	font-weight: 700;
	font-family: "微軟正黑體";
}
.about p {
	font-size: 1em;
	color: #5b5b5b;
	line-height: 1.8em;
	margin: .5em 0;
	font-family: "微軟正黑體";
}
h4.panel-title a {
  display: block;
  padding: 10px 15px;
  font-size: 0.9em;
}
.panel-default {
  border-color: #6EE0A2;
}
.panel-default > .panel-heading {
  color: #000;
  background-color: #6EE0A2;
}
.panel-heading{
    padding:0;
}
.team-grids {
  position: relative;
}
.team {
  margin-top: 5em;
}
.team-info {
  margin-top: 3.5em;
}
.team-grids a {
	overflow: hidden;
	position: relative;
	display: block;
}
.captn h4 {
  color: #E6DF7F;
  margin: .3em 0 .5em;
  font-size: 1.6em;
  font-family: 'Exo-Regular';
}
.captn p {
  color: #C9C9CA;
  letter-spacing: 1px;
}
.team-grids a .captn {
  display: inline-block;
  height: 100%;
  width: 100%;
  color: #ffffff;
  position: absolute;
  bottom: -82%;
  right: 0;
  background-color: rgba(51, 51, 51, 0.68);
  padding: 5% 10%;
  text-align: center;
  -o-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.team-grids a:hover .captn {
  width: 100%;
  bottom: 0%;
  padding: 40% 10%;
}
/*--//about-page--*/

/*--services--*/
.services {
	padding: 0em 0 10em;
}
.services h3 {
	font-size: 2.5em;
	color: #313131;
	margin-bottom: 1em;
	font-family: "微軟正黑體";
	text-align: center;
	font-weight: 800;
}
.services-grid {
	margin-top: 5em;
	margin-left: -15px;
	margin-right: -15px;
}
.srvcs-img img {
	width: 100%;
}
.srvcs-text {
  padding-top: 0em;
}
.srvcs-text h4 {
	font-size: 1.8em;
	margin: -0.6em 0 0;
	line-height: 1.4em;
	color: #0e4a90;
	font-family: "微軟正黑體";
	font-weight: 700;
}
.srvcs-text p {
	font-size: 1.1em;
	color: #5b5b5b;
	line-height: 1.8em;
	margin: 1em 0 0.5em;
	font-family: "微軟正黑體";
}
.slid{
	background:url(../images/slid.jpg)no-repeat 0px 0px fixed;
	background-size:cover;
	padding: 8em 0;
	margin-top: 5em;
}
.slid-grids ul li{
	display:block;	
	margin: 1.5em 0 0;
	position:relative;
}
.slid-grids  ul li a {
  color: #fff;
  font-size: 1em;
  padding-left: 2em;
  letter-spacing: 1px;
}
.slid-grids  ul li a:before {
  content: '';
  background: url(../images/icon1.png)no-repeat 0px -3px;
  position: absolute;
  top: 20%;
  left: 0%;
  display: block;
  width: 15px;
  height: 13px;
  transition: 0.5s all ease;
  -webkit-transition: 0.5s all ease;
  -moz-transition: 0.5s all ease;
  -o-transition: 0.5s all ease;
  -ms-transition: 0.5s all ease;
}
.slid-grids ul li a:hover{
	color:#6EE0A2;
}
.slid-grids ul li a:hover:before {
  left: 2%;
}
.brands {
	padding:3em 0;
}
.brands ul li{
	display:inline-block;
	margin: 0 24px;
}
/*--//services--*/
/*--Typography--*/
.typo {
  padding: 4em 0;
}
h3.typo-title{
  font-size: 2.5em;
  color: #6EE0A2;
  font-family: 'Exo-Regular';
  text-align:center;
}
.show-grid [class^=col-] {
    background: #fff;
  text-align: center;
  margin-bottom: 10px;
  line-height: 2em;
  border: 10px solid #f0f0f0;
}
.show-grid [class*="col-"]:hover {
  background: #e0e0e0;
}
.grid_tb{
	margin-bottom: 1em;
	margin-top: 0.5em;
}
.grid_3{
	margin-bottom:2em;
}
.xs h3, h3.m_1{
	color:#000;
	font-size:1.7em;
	font-weight:300;
	margin-bottom: 1em;
}
.grid_3 p{
  color: #999;
  font-size: 0.85em;
  margin-bottom: 1em;
  font-weight: 300;
}
.grid_4{
	background:none;
	margin-top:50px;
}
.label {
  font-weight: 300 !important;
  border-radius:4px;
}  
.grid_5{
	background:none;
	padding:2em 0;
}
.grid_5 h3, .grid_5 h2, .grid_5 h1, .grid_5 h4, .grid_5 h5, h3.hdg{
	margin-bottom:1em;
	color: #6EE0A2;
	font-family: 'Exo-Regular';
}

.tab-content > .active {
  display: block;
  visibility: visible;
}
.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
  z-index: 0;
}
/*--//Typography --*/
/*--contact-page--*/
.contact {
  padding: 5em 0;
}
.contact h3 {
	font-size: 2.5em;
	color: #6EE0A2;
	margin-bottom: 1em;
	font-family: 'Exo-Regular';
}
.map {
  margin:0 0 2em;
}
.map iframe {
  width: 100%;
  height: 340px;
}
.address p {
	color: #99989B;
	margin: 0 0 .5em 0;
	font-size: 1em;
	line-height:1.8em;
}
p.cnt-p {
  margin-bottom: 1.5em;
}
.address a {
	color: #201F1F;
	margin: 0 0 .5em 0;
	font-size: 1em;
}
.address a:hover {
  color: #201F1F;
  background-color: #E8E582;
  padding: 1px 5px;
}
.contact-form input[type="text"] {
	display: inline-block;
	background: none;
	border: 1px solid #A3A1A1;
	width: 100%;
	margin: 0 0 1.5em 0;
	outline: none;
	font-size: 1em;
	color: #555;
	padding: .8em 1em;
	-webkit-appearance: none;
}
.contact-form input[type="email"] {
  display: inline-block;
  background: none;
  border: 1px solid #A3A1A1;
  width:  100%;
  margin: 0 0 1.5em;
  outline: none;
  font-size: 1em;
  color: #555;
  padding: .8em 1em;
  -webkit-appearance: none;
}
.contact-form textarea {
  background: none;
  border: 1px solid #A3A1A1;
  width: 100%;
  display: block;
  height: 12.5em;
  outline: none;
  font-size: 1em;
  color: #555;
  resize: none;
  padding: .8em 1em;
  -webkit-appearance: none;
}
.contact-form input[type="submit"] {
  background: #E1DC7D;
  border: 1px solid #E1DC7D;
  padding: .6em 0;
  width: 35%;
  margin: 0.5em 18em 0;
  font-size: 1em;
  color: #333;
  font-weight: 400;
  letter-spacing: 1px;
  outline: none;
  transition: 0.5s all ease;
  -webkit-transition: 0.5s all ease;
  -moz-transition: 0.5s all ease;
  -o-transition: 0.5s all ease;
  -ms-transition: 0.5s all ease;
  -webkit-appearance: none;
}
.contact-form input[type="submit"]:hover{
   border:none;
  border-top: 1px solid #6EE0A2;
  border-bottom: 1px solid #6EE0A2;
  background-color: #fff;
  color: #6EE0A2;
}
.contact-grids:nth-child(1) {
  padding-left: 0;
}
.contact-grids:nth-child(2) {
  padding-right: 0;
}
/*--//contact-page--*/

/* scroll to top */
.scrollup{
	position: fixed;
	width: 38px;
	height: 35px;
	bottom: 30px;
	right: 20px;
	background-color: #2C2C2C;
	font-size: 1.7em;
	background-image: -webkit-linear-gradient(270deg,rgba(62,62,62,0.59) 0%,rgba(34,34,34,1.00) 100%);
	background-image: -moz-linear-gradient(270deg,rgba(62,62,62,0.59) 0%,rgba(34,34,34,1.00) 100%);
	background-image: -o-linear-gradient(270deg,rgba(62,62,62,0.59) 0%,rgba(34,34,34,1.00) 100%);
	background-image: linear-gradient(180deg,rgba(62,62,62,0.59) 0%,rgba(34,34,34,1.00) 100%);
}

a.scrollup {
	outline:0;
	text-align: center;
}

a.scrollup:hover,a.scrollup:active,a.scrollup:focus {
	opacity:1;
	text-decoration:none;
}
a.scrollup i {
	margin-top: 4px;
	color: #fff;
}
a.scrollup i:hover {
	text-decoration: none;
}





/*---- responsive-design -----*/
@media(max-width:1440px){
.bnr-botom-info {
  top: 7em;
  left: 45%;
}
.bnr-botom-left p {
  width: 44%;
}
.callbacks_tabs {
  bottom: -22%;
  left: -1%;
}
.work-img-left {
  width: 59.4%;
}
.work-img-right2 {
  width: 59.4%;
}
}
@media(max-width:1366px){
.logo {
  width: 7.5%;
}
.bnr-botom-info {
  top: 5em;
  left: 42%;
}
.bnr-botom-left p {
  width: 46%;
}
}
@media(max-width:1280px){
.bnr-botom-info {
  left: 38%;
}
.bnr-botom-left p {
  width: 48%;
}
}
@media(max-width:1200px){
.testi span {
  font-size: 1.3em;
  left: -6%;
  width: 36px;
  height: 36px;
  line-height: 36px;
}
}
@media(max-width:1080px){
.logo {
  width: 15%;
}
.testi span {
  left: -8%;
}
.work a .captn {
  left: -57%;
}
.work a .captn span {
  font-size: 2.5em;
}
.bnr-text h1 {
  width: 58%;
}
.bnr-text h4 {
  letter-spacing: 1px;
  width: 45%;
}
.bnr-botom-info {
  left: 40%;
  top: 3em;
}
.bnr-botom-info:before {
  top: 8%;
}
.bnr-botom-left h3 {
  font-size: 2.3em;
}
.bnr-botom-left p {
  width: 58%;
}
.home-about h5 {
  width: 60%;
}
.srvcs-text {
	padding: 0;
	margin-bottom: 10px;
}
.brands ul li img {
  width: 100%;
}
.brands ul li {
  margin: 0 12px;
  width: 17%;
}
.contact-form input[type="submit"] {
  margin: 0.5em 13.8em 0;
}
}
@media(max-width:1024px){

.logo {
  width: 10%;
}
.top-nav ul li a {
  font-size: 1.1em;
}
.bnr-text {
  margin-top: 4em;
}
.banr-info {
  min-height: 635px;
}
.bnr-text h1 {
  width: 54%;
  font-size: 6em;
}
.bnr-botom {
  margin: 4em 0;
}
.hm-about-grids {
  margin-top: 2em;
}
.bnr-botom-left p {
  width: 61%;
}
.bnr-botom-info {
  left: 37%;
}
.top-nav ul li {
  margin: 0 1.5em;
}
.callbacks_tabs {
  bottom: -16%;
}
.home-about h5 {
  font-size: 1.7em;
  width: 68%;
}
.work {
  margin-top: 4em;
}
.work-img-left {
  width: 59.3%;
}
.work-img-right2 {
  width: 59.3%;
}
.work a .captn span {
  font-size: 2em;
  letter-spacing: 2px;
}
.testi {
  padding: 4em 0;
}
.testi-info {
  margin-top: 3em;
}
.testi span {
  font-size: 1.3em;
  left: -8%;
  width: 36px;
  height: 36px;
  line-height: 38px;
}
.services {
  padding: 4em 0 0;
}
.testi p {
  font-size: 0.9em;
}
.footer-grids h2 a {
  font-size: 1.8em;
}
.about h5 {
  font-size: 1.3em;
}
.about {
  padding: 4em 0;
}
.about h3 {
  font-size: 2.3em;
}
.team {
  margin-top: 4em;
}
.team-info {
  margin-top: 3em;
}
.team-grids a:hover .captn {
  padding: 35% 5%;
}
.services-grid {
  margin-top: 4em;
}
.services h3 {
  font-size: 2.3em;
  margin-bottom:0;
}
.srvcs-text {
  padding: 0 0 0 1em;
}
.slid {
  padding: 5em 0;
  margin-top: 4em;
}
.slid-info {
  margin-top: 1.5em;
}

.slid-grids ul li a {
  padding-left: 1.5em;
  letter-spacing: 0;
}
.typo {
  padding: 3em 0;
}
h3.typo-title {
  font-size: 2.3em;
}
.brands ul li {
  margin: 0 36px;
  width: 12%;
}
.grid_4 {
  margin-top: 41px;
}
.contact {
  padding: 4em 0;
}
.contact h3 {
  font-size: 2.3em;
  margin-bottom: 0.8em;
}
.contact-form input[type="submit"] {
  margin: 0.5em 13.5em 0;
}
p.cnt-p {
  margin-bottom: 1.2em;
}
}
@media(max-width:991px){

.bnr-text h1 {
  font-size: 5em;
  margin-top: 0.2em;
}
.bnr-text h4 {
  letter-spacing: 0px;
  width: 54%;
}
.banr-info {
  min-height: 600px;
}
.bnr-botom-left {
  float: left;
  width: 45%;
}
.bnr-botom-right {
  float: right;
  width: 55%;
}
.bnr-botom-info {
  left: 47%;
  top: 3em;
}
.bnr-botom-left h3 {
  font-size: 2em;
}
.bnr-botom-left p {
  width: 53%;
  font-size: 0.9em;
  margin-top: 1em;
}
.hm-grids-info {
  float: left;
  width: 33.33%;
}
.home-about h5 {
  font-size: 1.5em;
}
.home-about p {
  font-size: 0.9em;
}
.work {
  margin-top: 4em;
}
.work-grids {
  margin-top: 2em;
}
.work-left.moments-bottom {
  float: left;
  width:  33.5%;
}
.work-right {
  float: right;
    width: 66.5%;
}
.work-img-left {
  width: 59.2%;
}
.work-img-right2 {
  width: 59.2%;
}
.testi {
  padding: 3em 0;
}
.testi-info {
  margin-top: 2em;
}
.testi-grids {
  float: left;
  width: 33.33%;
}
.testi h5 {
  font-size: 0.8em;
  margin-right: 11px;
}
.testi span {
  left: -12%;
}
.work {
  margin-top: 3.5em;
}
.work-grids {
  margin-top: 2em;
}
.about {
  padding: 3em 0;
}
.about h3 {
  font-size: 2.1em;
  margin-bottom: 0.8em;
}
.about h5 {
  font-size: 1.2em;
}
.about p {
  font-size: 0.9em;
}
.team-info {
  margin-top: 2em;
}
.services-grid {
  margin-top: 2em;
}
.footer {
  padding: 3em 0 2em;
}
.footer-grids {
  float: left;
  width: 25%;
  padding: 0;
}
.footer-grids h2 a {
  font-size: 1.6em;
}
.footer h4 {
  font-size: 1.3em;
}
.footer-grids p {
  font-size: 0.9em;
}
.footer-grids form input[type="submit"] {
  width: 27%;
}
.footer-grids form input[type="text"] {
  width: 73%;
}
.footer-bottom p {
  font-size: 0.9em;
  letter-spacing: 1px;
}
.about-grids {
  float: left;
  width: 50%;
}
.panel-body {
  font-size: 0.9em;
}
.team {
  margin-top: 3em;
}
.team-grids {
  float: left;
  width: 25%;
}
.captn h4 {
  margin: 0 0 .5em;
  font-size: 1.4em;
}
.team-grids a:hover .captn {
  padding: 30% 5%;
}
.footer-grids ul li {
  margin-bottom: 0.8em;
}

.srvcs-img {
  float: left;
  width: 30%;
}
.srvcs-text {
  float: right;
  width: 70%;
  padding: 0;
}
.srvcs-text h4 {
  font-size: 1.1em;
}
.srvcs-text p {
  font-size: 0.9em;
}
.services {
  padding: 0em 0 5em;
}
.slid {
  padding: 4em 0;
}
.slid-grids {
  float: left;
  width: 25%;
}
.slid-grids ul li a {
  padding-left: 2em;
  font-size: 0.9em;
}
.slid-info {
  margin-top: 1em;
}
.brands ul li {
  margin: 0 16px;
  width: 15%;
}
h3.typo-title {
  font-size: 2.1em;
}
.grid_4 {
  margin-top: 30px;
}
.label {
  font-size: 67%;
}
.grid_5 {
  padding: 1em 0;
}
.grid_3 {
  margin-bottom: 0em;
}
.typo .col-md-6 {
  float: left;
  width: 50%;
}
.contact {
  padding: 3em 0;
}
.contact h3 {
  font-size: 2.1em;
}
.map iframe {
  height: 280px;
}
.contact-form {
  padding: 0;
}
.contact-grids {
  float: left;
  width: 50%;
}
.contact-form input[type="submit"] {
  margin: 0.5em 16.8em 0;
}
.address {
  margin-top: 2em;
}
p.cnt-p {
  margin-bottom: 0.5em;
  width: 50%;
}
.address p {
  font-size: 0.9em;
}
.contact-form input[type="text"] {
  margin: 0 0 1.2em 0;
  font-size: 0.9em;
}
.contact-form input[type="email"] {
  margin: 0 0 1.2em;
  font-size: 0.9em;
}
.contact-form textarea {
  height: 10.8em;
}
.table {
	width: 100%;
	max-width: 100%;
	margin-bottom: 10px;
	font-size: 91%;
}		
}
@media(max-width:900px){
.top-nav ul li {
  margin: 0 1.2em;
}
}
@media(max-width:800px){
.logo {
  width: 13%;
}
.top-nav ul li {
  margin: 0 0.5em;
}
.bnr-botom-left h3 {
  font-size: 1.8em;
}
.bnr-botom-left p {
  width: 58%;
}
.bnr-botom-info {
  left: 40%;
  top: 1em;
}
}
@media(max-width:768px){
.logo {
  width: 21.5%;
}
.top-nav ul li a {
  font-size: 1em;
}
.top-nav ul li {
  margin: 0 0.5em;
}
.bnr-text {
  margin-top: 3em;
}
.bnr-botom-left h3 {
  font-size: 1.8em;
}
.bnr-botom-left p {
  width: 65%;
}
.bnr-botom-info {
  left: 35%;
  top: 1em;
}
.bnr-botom {
  margin: 3em 0;
}
h4.title {
  font-size: 1.8em;
}
.work {
  margin-top: 2.5em;
}
.work-img-left {
  width: 59.1%;
}
.work-img-right2 {
  width: 59.1%;
}
.testi {
  padding: 2.5em 0;
}
.testi-info {
  margin-top: 1.5em;
}
.testi-grids {
  width: 33%;
    padding: 0 0 0 2em;
}
.testi span {
  font-size: 1.1em;
  width: 32px;
  height: 32px;
  line-height: 33px;
  left: -5%;
}
.footer-grids h2 a {
  font-size: 1.5em;
}
.footer {
  padding: 2.5em 0 1.5em;
}
.footer-bottom p {
  letter-spacing: 0px;
}
.about h3 {
  font-size: 1.9em;
}
.about h4 {
	font-size: 1.6em;
	color: #262626;
	margin-bottom: 0.2em;
	font-family: "微軟正黑體";
	font-weight: 500;
	margin-top: -0.2em;
}
.about date {
	font-size: 1.2em;
	color: #262626;
	font-family: "微軟正黑體";
	font-weight: 500;
}		
.team {
  margin-top: 2em;
}
.services {
	padding: 0em 0 5em;
}
.services h3 {
  font-size: 2.1em;
}
.slid {
  padding: 3em 0;
  margin-top: 3em;
}
.slid-grids ul li {
  margin: 1.2em 0 0;
}
.typo {
  padding: 2.5em 0;
}
.contact {
  padding: 2.5em 0;
}
.contact h3 {
  font-size: 1.9em;
}
}
@media(max-width:640px){
.btnM-pc{
	display: none;
}
.btnM-web{
	display: block;
}
.logo {
  width: 15%;
}
.logo a {
  font-size: 2em;
}
.bnr-text {
  margin-top: 2em;
}
.bnr-text h2 {
  font-size: 2em;
}
.bnr-text h1 {
  font-size: 4em;
}
.bnr-text h4 {
  font-size: 1.2em;
}
.banr-info {
  min-height: 470px;
}
.top-nav ul li {
  margin: 0;
}
.top-nav ul li a {
  margin: 20px 18px;
  font-size: 0.9em;
}
.bnr-botom-info {
  left: 17%;
  top: 0em;
}
.bnr-botom-info:before {
  top: 7%;
}
.bnr-botom-left h3 {
  font-size: 1.5em;
}
.bnr-botom-left p {
  width: 79%;
}
.home-about h5 {
  font-size: 1.2em;
  width: 74%;
}
.hm-about-grids {
  margin-top: 1.5em;
}
.hm-grids-info {
  padding-right: 0;
}
.work-img-left {
  width: 58.9%;
}
.work-img-right2 {
  width: 58.9%;
}
.work a .captn span {
  font-size: 1.5em;
  letter-spacing: 0px;
}
.testi {
  padding: 2em 0;
}
.banr-info.abt-bnr {
  min-height: 20px;
}
.about h3 {
  font-size: 1.8em;
}
.about h4 {
	font-size: 1.5em;
	color: #262626;
	margin-bottom: 0.2em;
	font-family: "微軟正黑體";
	font-weight: 500;
	margin-top: -0.2em;
}
.about date {
	font-size: 1.1em;
	color: #262626;
	font-family: "微軟正黑體";
	font-weight: 500;
}		
.about {
  padding: 2em 0;
}
.about h5 {
  font-size: 1.1em;
}
.panel-body {
  padding: 10px;
}
.team-grids {
  padding: 0.5em;
}
.captn h4 {
  font-size: 1.2em;
  margin: 0.2em 0 .5em;
}
.team-grids a .captn {
  bottom: -79%;
}
.about p {
  letter-spacing: 0;
}
.services {
  padding: 0em 0 4em;
}
.services h3 {
  font-size: 2em;
}
.srvcs-text h4 {
  font-size: 1em;
}
.srvcs-img {
  width: 30%;
  padding: 0;
}
.srvcs-text {
  width: 66%;
}
.slid {
  padding: 2em 0 3em;
  margin-top: 2em;
}
.brands ul li {
  margin: 0 13px;
}
.footer-grids h2 a {
  font-size: 1.3em;
}
.footer h4 {
  font-size: 1.2em;
}
h3.typo-title {
  font-size: 2em;
}
.typo {
  padding: 2em 0;
}
.grid_4 {
  margin-top: 25px;
}
.grid_5 h3, .grid_5 h2, .grid_5 h1, .grid_5 h4, .grid_5 h5, h3.hdg {
  margin-bottom: 0.8em;
}
h1, .h1 {
  font-size: 34px;
}
.label {
  font-size: 61%;
}
.typo .col-md-6 {
  padding-left: 0;
}
.pagination-lg > li > a, .pagination-lg > li > span {
  padding: 10px 14px;
  font-size: 15px;
}
.well {
  font-size: 0.9em;
}
.contact h3 {
  font-size: 1.8em;
}
.contact {
  padding: 2em 0;
}
.map {
  margin: 0 0 1.5em;
}
.map iframe {
  height: 250px;
}
.contact-form input[type="submit"] {
  margin: 0.5em 13.8em 0;
}
p.cnt-p {
  width: 56%;
}
.table {
	width: 100%;
	max-width: 100%;
	margin-bottom: 20px;
	font-size: 88%;
}	
.dez-tabs .nav-tabs > li > a {
    color: #3d474a;
    font-weight: 600;
    font-size: 13px;
    -webkit-border-radius: 0;
    border-radius: 0;
    font-family: "微軟正黑體";
}
.fundName {
	color: #1e4e88;
	line-height: 1.1em;
	margin-top: 0;
	font-weight: 600;
	background-color: #DFDFDF;
}
.fundName-ex {
	color: #282828;
}	
}
@media(max-width:600px){
.contact-form input[type="submit"] {
  margin: 0.5em 13em 0;
}
}
@media(max-width:480px){
Label.space{
	width: 8px;
	display: inherit;
}		
.logo {
  width: 27%;
}
.logoimg {
	width: 100px;
}	
.about-grids {
    float: left;
    width: 100%;
}

.srvcs-img {
	float: left;
	width: 100%;
	margin-top: -5px;
    margin-bottom: 10px;
}
.srvcs-text {
  float: right;
  width: 100%;
  padding: 0;
}
.banr-info {
  min-height: 370px;
}
.bnr-text h2 {
  font-size: 1.8em;
}
.bnr-text h1 {
  font-size: 3em;
}
.bnr-text h4 {
  font-size: 1.1em;
  width: 62%;
  margin-top: 0.8em;
}
.top-nav  ul.nav1{
	display:none;
	z-index: 999;
	position: absolute;
	width: 100%;
	left: 0;
}
.top-nav span.menu {
  display: inline-block;
  position: relative;
  cursor: pointer;
  font-size: 1.4em;
  color: #fff;
  padding: .3em .2em 0.3em;
}
.top-nav  .nav1{
	display:none;
	z-index: 999;
	position: absolute;
	width: 100%;
	left: 0;
	background-color: rgba(228, 225, 131, 0.96);
}
ul.nav.nav-sidebar {
  margin: 0;
}
.top-nav ul.nav1 li {
	display: block;
	text-align: center;
	margin: 0;
	width: 100%;
	padding: 1px;
	border-bottom: 1px solid #BEBB4E;
}
.top-nav ul li a {
  padding: 0.7em 0;
  font-size: 17px;
  margin: 0;
}
ul.nav1.cl-effect-16 {
  padding: 0.5em 0;
}
.bnr-botom-right {
  width: 45%;
}
.bnr-botom-left {
  width: 55%;
}
.bnr-botom-info:before {
  top: 6%;
  left: -12%;
}
.bnr-botom {
  margin: 2em 0;
}
.bnr-botom-left h3 {
  font-size: 1.1em;
}
.bnr-botom-left p {
  width: 81%;
  font-size: 0.85em;
  margin-top: 0.5em;
}
.bnr-botom-info {
  left: 16%;
}
.home-about {
  margin-top: 4em;
}
.hm-grids-info {
  padding-left: .5em;
}
.home-about h5 {
  font-size: 1.1em;
  width: 84%;
}
.home-about p {
  font-size: 0.85em;
  margin: 1em 0 .5em;
}
a.more {
  font-size: 1em;
}
.work-grids {
  margin-top: 1.5em;
}
.work-img-left {
  margin-right: 0.2em;
  width: 59%;
}
.work-left {
  padding: 0 0.2em 0 0;
}
.work-left img {
  margin-bottom: .2em;
}
.work-img-right2 {
  width: 59%;
  margin-left: .2em;
}
.work-img-right img {
  margin-bottom: .2em;
}
.work a .captn span {
  font-size: 1.1em;
}
.testi-grids {
  width: 100%;
  padding: 0 1em 0 3em;
  float: none;
  margin-bottom: 1em;
}
.testi span {
  left: -1%;
}
.testi p {
  margin-bottom: 0.5em;
  font-size: 0.85em;
}
.footer-grids {
  width: 50%;
  margin-bottom: 1em;
  padding-left: 1em;
}
.footer-grids ul li a {
  font-size: 0.9em;
}
.about p {
  font-size: 0.85em;
}
.about h3 {
  font-size: 1.6em;
  margin-bottom: 0.5em;
}
.about h4 {
	font-size: 1.4em;
	color: #262626;
	margin-bottom: 0.2em;
	font-family: "微軟正黑體";
	font-weight: 500;
	margin-top: -0.2em;
}
.about date {
	font-size: 1em;
	color: #262626;
	font-family: "微軟正黑體";
	font-weight: 500;
}	
.about h5 {
  font-size: 1.2em;
}
.team-grids {
  padding: 1em;
  width: 50%;
}
.team-info {
  margin-top: 0;
}
.team-grids a .captn {
  bottom: -83%;
}
.about {
  padding: 2em 0 3em;
}
.about-grid {
    margin-top: 2em;
}	
.about-grid h3 {
    font-size: 1.6em;
    margin-bottom: 1em;
}	
.services h3 {
  font-size: 1.8em;
}
.services-grid {
	margin-top: 1.5em;
	margin-left: 0px;
	width: 100%;
}
.slid-RF{
	margin-left: -5%;
	margin-right: -5%;
	width: 108%;
}	
.slid-info {
  margin-top: 0;
}
.slid-grids {
  width: 50%;
  margin-top: 1em;
}
.slid-grids ul li {
  margin: 1em 0 0;
}
.brands {
  padding: 2em 0;
}
.brands ul li {
  margin: 0 9px;
}
h3.typo-title {
  font-size: 1.8em;
}
.grid_4 {
  margin-top: 18px;
}
h1, .h1 {
  font-size: 31px;
}
h2, .h2 {
  font-size: 28px;
}
.label {
  font-size: 48%;
}
.contact h3 {
  font-size: 1.6em;
}
.map iframe {
  height: 200px;
}
.contact-grids:nth-child(1) {
  padding: 0;
}
.contact-form input[type="submit"] {
  margin: 0.5em 9em 0;
  width: 44%;
  padding: .5em 0;
  font-size: 0.9em;
}
.table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 20px;
    font-size: 80%;
}	
}
@media(max-width:320px){
.logo {
  width: 26%;
}
.banr-info {
  min-height: 320px;
}
.bnr-text h2 {
  font-size: 1.2em;
}
.bnr-text h1 {
  font-size: 2.5em;
  width: 77%;
}
.bnr-text h4 {
  font-size: 1em;
  width: 81%;
}
.top-nav span.menu {
  font-size: 1.3em;
}
.bnr-botom-left {
  width: 100%;
  float: none;
}
.bnr-botom-right {
  width: 100%;
  float: none;
  margin-top: 10.5em;
}
.bnr-botom-left h3 {
  font-size: 1.1em;
}
.bnr-botom {
  margin: 1.5em 0;
}
.bnr-botom-info {
  left: 13%;
  width: 87%;
}
.bnr-botom {
  margin: 1.5em 0;
}
.callbacks_tabs a:after {
  height: 7px;
  width: 7px;
}
.bnr-botom-left p {
  width: 100%;
}
.callbacks_tabs li {
  margin: 0 .1em;
}
.home-about {
  margin-top: 1em;
}
h4.title {
  font-size: 1.6em;
}
.hm-about-grids {
  margin: 0;
}
.hm-grids-info {
  float: none;
  width: 100%;
  padding: 0;
  margin-top: 1em;
}
.home-about p {
  margin: 0.5em 0;
}
.work {
  margin-top: 1.5em;
}
.work-left.moments-bottom {
  float: none;
  width: 100%;
  padding: 0;
}
.work-right {
  float: none;
  width: 100%;
}
.testi {
  padding: 1em 0;
}
.testi h4.title {
  text-align: left;
}
.testi span {
  left: -3%;
}
.testi-grids {
  padding: 0 0 0 2em;
  margin-bottom: 1.5em;
}
.footer {
  padding: 1.5em 0 1em;
}
.footer-grids:nth-child(4) {
  padding: 0;
}
.about-grids {
  float: none;
  width: 100%;
  padding: 0;
}
.about {
  padding: 1.5em 0 1em;
}
.about-grids:nth-child(2) {
  margin-top: 1em;
}
.panel-body {
  font-size: 0.85em;
}
.team {
  margin-top: 1em;
}
.team-grids {
  padding: 0.5em;
}
.team-grids a .captn {
  bottom: -78%;
}
.team-grids a:hover .captn {
  padding: 23% 5%;
}
.brands {
  padding: 2em 0 1em;
}
.brands ul li {
  margin: 0 10px 21px;
}
.services {
  padding: 1.5em 0 0;
}
.services h3 {
  font-size: 1.6em;
}
.services-grid {
  float: none;
  width: 100%;
  padding: 0;
  margin-top: 1em;
}
.slid {
  padding: 2em 0;
}
.slid-grids {
  width: 50%;
  margin-top: 1em;
  padding: 0;
}
.slid-grids ul li {
  margin: 1em 0 0;
}
.slid-grids:nth-child(2),.slid-grids:nth-child(4){
  padding-left: 1em;
}
.footer-grids {
  padding-left: 0.5em;
}
h3.typo-title {
  font-size: 1.6em;
}
.typo {
  padding: 1.5em 0;
}
h3, .h3 {
  font-size: 19px;
}
.contact {
  padding: 1.5em 0;
}
.map {
  margin: 0 0 1em;
}
.map iframe {
  height: 150px;
}
.contact-grids {
  float: none;
  width: 100%;
}
.contact-form input[type="text"] {
  margin: 0 0 1em 0;
  font-size: 0.85em;
  padding: .6em 1em;
}
.contact-form input[type="email"] {
  margin: 0 0 1em 0;
  font-size: 0.85em;
  padding: .6em 1em;
}
.contact-grids:nth-child(2) {
  padding: 0;
}
.contact-form textarea {
  height: 7.8em;
}
.contact-form input[type="submit"] {
  margin: 1em 0 0;
  width: 100%;
  padding: .5em 0;
}
.address {
  margin-top: 1.5em;
	padding: 0;
}
p.cnt-p {
  width: 100%;
}
.address h3 {
  margin-bottom: .5em;
}

}
/*--//responsive-design---*/
