/* Fonts */
@import url(http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,300,600,700);
/* Set standard breakpoints */
/* Breakpoint Mixin */
html {
  font-size: 62.5%;
}


a:hover {
  text-decoration: none;
}

.site-header { 
  overflow: visible; 
  color: #f4f4f4;
  position: relative;
  z-index: 1001;
}

.site-header .branding {
  /*float: left;*/
 /* display: inline-block;*/
  /*margin: 20px 0 0 20px;*/
  /*font-size: 26px;*/
}
.site-header nav {
  height: auto;
  position: static;
  width: 100%;
}
.site-header nav ul {
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#1e5e95+0,0e325b+100 */
  background: #1e5e95; /* Old browsers */
  background: -moz-linear-gradient(top, #1e5e95 0%, #0e325b 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #1e5e95 0%,#0e325b 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #1e5e95 0%,#0e325b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5e95', endColorstr='#0e325b',GradientType=0 ); /* IE6-9 */
  text-align: center;
}
.site-header nav ul li a{
  color: #fff;
}

@media screen and (min-width: 768px) {
  .site-header nav {
    float: none;
  }
}
.site-header nav ul {
  margin-top: 0;
  display: none;
  width: 100%;
  margin: 0;
  padding: 0;
}

@media screen and (min-width: 768px) {
  .site-header nav ul {
    display: block;
    width: auto;
  }
}

@media screen and (max-width: 769px) {
  .site-header nav ul {
  }
}


@media screen and (max-width: 992px) {
  .site-header nav ul {
  }
}
.site-header nav ul li {
  font-family:"微軟正黑體";
  display: block;
  text-align: center;
  width: 100%;
  font-size: 20px;
  height: auto;
  padding: 0;
}

@media screen and (min-width: 768px){
  .site-header nav ul li {
    display: inline-block;
    text-align: center;
    padding: 0;
    height: 45px;
    width: auto;
    margin: 0;
    text-indent: 0;
  }
 }

@media screen and (max-width: 1200px) {
  .site-header nav ul li {
    padding: 0 10px;
  }
}

@media screen and (max-width: 991px) {
  .site-header nav ul li {
    padding: 0;
  }
}
.site-header nav ul li.submenu {
  padding-right: 0;
}
@media screen and (min-width: 768px) {
  .site-header nav ul li.submenu {
    padding-right: 34px;
  }
}


@media (max-width:769px){
.site-header nav ul li{
}
.site-header nav ul li:hover {
  background-color:#e7f6fe;
}
}
.site-header nav ul li a {
  padding: 10px;
  line-height: 26px;
  width: 100%;
  display: block;
  color: #555555;
  font-size: 18px;
  text-align:center;
  
}
.site-header nav ul li a {
    line-height: 45px;
    padding: 0 53px;
    margin: 0;
    text-indent: 0;
    color: #fff;
  }
.site-header nav ul li a:hover{
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0c2e54+0,041629+50,0c2e54+100 */
background: #0c2e54; /* Old browsers */
background: -moz-linear-gradient(top,  #0c2e54 0%, #041629 50%, #0c2e54 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #0c2e54 0%,#041629 50%,#0c2e54 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #0c2e54 0%,#041629 50%,#0c2e54 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0c2e54', endColorstr='#0c2e54',GradientType=0 ); /* IE6-9 */

}
@media (max-width: 1200px) {
  .site-header nav ul li a {
    line-height: 45px;
    padding: 0 42px;
    margin: 0;
    text-indent: 0;
  }
}
@media (max-width: 1073px) {
  .site-header nav ul li a {
    padding: 0 30px;
  }
}
@media (max-width: 992px) {
  .site-header nav ul li a {
    line-height: 45px;
    margin: 0;
    text-indent: 0;
  }
}
@media (max-width: 809px) {
  .site-header nav ul li a {
    padding: 0 20px;
  }
}


.site-header nav ul li > ul {
  left: 0;
  margin: 0;
  display: none;
  margin-top: 0;
  padding: 0;
  background-color:rgba(1,71,157,1);
  width: 100%;
  position: static;
}
@media screen and (min-width: 768px) {
  .site-header nav ul li > ul {
    position: absolute;
  }
}
.site-header nav ul li > ul > li {
  margin: 0;
  height: auto;
  text-indent: 10px;
  line-height: 20px;
  width: 100%;
  text-indent: 40px;
}
@media screen and (min-width: 768px) {
  .site-header nav ul li > ul > li {
	padding-left:0;
	padding-right:0;
  }
}
.site-header nav ul li > ul > li:hover, .site-header nav ul li > ul > li.active {
  background-color:rgba(0,0,0,0.1);
}
.site-header nav ul li > ul > li:last-child {
  /*margin-bottom: 8px;*/
}
.site-header nav ul li > ul > li a {
  padding-left: 0;
}
@media screen and (min-width: 768px) {
  .site-header nav ul li > ul > li a {
    line-height: 30px;
	margin:0 auto 5px;
  }
}
.site-header a#drop:after {
  content: "\f0c9";
}
.site-header a#drop {
  font-family: "FontAwesome";
  padding: 10px 15px;
  float: right;
  /*margin: 15px;*/
  color: #fff;
  display: block;
  width:100%;
  text-align:right;
  background: #1e5e95; /* Old browsers */
  background: -moz-linear-gradient(top, #1e5e95 0%, #0e325b 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #1e5e95 0%,#0e325b 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #1e5e95 0%,#0e325b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5e95', endColorstr='#0e325b',GradientType=0 ); /* IE6-9 */
}
@media screen and (min-width: 768px) {
  .site-header a#drop {
    display: none;
  }
}
.site-header a#drop:hover {
  background: #1e5e95; /* Old browsers */
  background: -moz-linear-gradient(top, #1e5e95 0%, #0e325b 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #1e5e95 0%,#0e325b 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #1e5e95 0%,#0e325b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1e5e95', endColorstr='#0e325b',GradientType=0 ); /* IE6-9 */
}
.site-header a#dropi {
  float: right;
  font-size: 24px;
}