body{
font-family: Arial,"微軟中黑體","Microsoft JhengHei";
background-color: #FFF !important;
}
a,
a:hover,
a:visited,
a:active,
a:focus{
text-decoration: none;
color: #000;
}
* {
color: #000;
}
::-webkit-input-placeholder { /* Safari, Chrome and Opera */
color: #FFF;
}
:-moz-placeholder { /* Firefox 18- */
color: #FFF;
}
::-moz-placeholder { /* Firefox 19+ */
color: #FFF;
}
:-ms-input-placeholder { /* IE 10+ */
color: #FFF;
}
::-ms-input-placeholder { /* Edge */
color: #FFF;
}
:placeholder-shown { /* Standard one last! */
color: #FFF;
}
.biostar-nav-container {
position: relative;
}
.biostar-sub-menu {
position: absolute;
top: 0;
right: 0;
z-index: 1800;
}
/*infinit menu*/
.dropdown-menu {
border-radius:0;
box-shadow: 0 0 0 transparent;
border: 1px solid transparent;
left: -35px;
}
.dropdown-menu > li > a {
white-space: normal;
max-width: 185px;
}
.dropdown-submenu{
position:relative;
}
.dropdown-submenu>.dropdown-menu{
position: relative;
top:0;
left: 0;
/*margin-top:-6px;*/
min-width: 240px;
margin-left:-1px;
border-radius:0;
box-shadow: 0 0 0 transparent;
border: 1px solid transparent;
float: none;
}
/*one-layout-drop*/
@media (min-width: 768px) {
.one-layout-drop .dropdown-menu {
background-color: #1B1B1B;
padding-top: 12px;
padding-bottom: 28px;
border-top-color: #1B1B1B;
min-width: 175px;
}
.one-layout-drop .dropdown-menu > li > a,
.one-layout-drop .dropdown-menu > li > a:visited {
background-color: #1B1B1B;
color: #d0d0d0;
padding: 8.5px 25px;
text-decoration: none;
text-align: center;
font-size: 1.11em;
max-width: 175px;
}
.one-layout-drop .dropdown-menu > li > a:hover,
.one-layout-drop .dropdown-menu > li > a:active,
.one-layout-drop .dropdown-menu > li > a:focus {
background-color: #E70111;
}
}
@media (max-width: 767px) {
}
/*product_list*/
@media (min-width: 1440px) {
}
@media (min-width: 992px) and (max-width: 1439px) {
}
@media (min-width: 768px) and (max-width: 991px) {
}
@media (min-width: 480px) and (max-width: 767px) {
}
@media (min-width: 10px) and (max-width: 479px) {
}
/*Biostar color*/
.biostar-red {
color: #E70111;
}
.biostar-red-bg {
background-color: #E70111;
}
/*biostar header*/
@media (min-width: 1440px) {
.container > .biostar-header,
.container-fluid > .biostar-header{
margin-right: 208px;
}
}
@media (min-width: 992px) and (max-width: 1439px) {
.container > .biostar-header,
.container-fluid > .biostar-header{
margin-right: 10px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.container > .biostar-header,
.container-fluid > .biostar-header{
margin-right: 22px;
}
}
@media (min-width: 480px) and (max-width: 767px) {
}
@media (min-width: 10px) and (max-width: 479px) {
}
/*extend first block*/
@media (min-width: 1440px) {
.extend-first-block {
padding-top: 90px;
}
}
@media (min-width: 992px) and (max-width: 1439px) {
.extend-first-block {
padding-top: 90px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.extend-first-block {
padding-top: 90px;
}
}
@media (min-width: 480px) and (max-width: 767px) {
.extend-first-block {
padding-top: 50px;
}
.extend-first-block .carousel-control{
display: none;
}
}
@media (min-width: 10px) and (max-width: 479px) {
.extend-first-block {
padding-top: 50px;
}
.extend-first-block .carousel-control{
display: none;
}
}
/*nav header*/
@media (min-width: 768px) {
.extend-nav {
min-height: 90px;
height: 90px;
background-color: #000;
border: 0px solid transparent;
}
.extend-nav .navbar-nav,
.extend-nav .navbar-nav > li {
min-height: 90px;
height: 90px;
}
.extend-nav .navbar-nav > li > a,
.extend-nav .navbar-nav > li > a:visited {
height: 90px;
background-color: transparent;
color: #FFF;
border-top: 4px solid transparent;
padding: 44px 22px 18px;
text-align: center;
font-size: 1.13em;
}
.extend-nav .navbar-nav > li > a:hover,
.extend-nav .navbar-nav > li > a:active,
.extend-nav .navbar-nav > li > a:focus{
background-color: #1B1B1B;
border-top: 4px solid #E70111;
color: #FFF;
}
.extend-nav .navbar-nav > .active > a,
.extend-nav .navbar-nav > .active > a:hover,
.extend-nav .navbar-nav > .active > a:visited,
.extend-nav .navbar-nav > .active > a:active,
.extend-nav .navbar-nav > .active > a:focus {
background-color: #1B1B1B;
border-top: 4px solid #E70111;
color: #FFF;
padding: 44px 22px 18px;
text-align: center;
}
.extend-nav .navbar-nav > .open > a,
.extend-nav .navbar-nav > .open > a:hover,
.extend-nav .navbar-nav > .open > a:visited,
.extend-nav .navbar-nav > .open > a:active,
.extend-nav .navbar-nav > .open > a:focus {
background-color: #1B1B1B;
border-top: 4px solid #E70111;
color: #FFF;
padding: 44px 22px 18px;
text-align: center;
}
/*language */
.extend-nav .language-nav,
.extend-nav .language-nav > li {
min-height: 45px;
height: 45px;
}
.extend-nav .language-nav span,
.extend-nav .language-nav .fa,
.extend-nav .language-nav .caret {
color: #eceff1;
}
.extend-nav .language-nav .fa {
font-size: 1.3em;
}
.extend-nav .language-nav .caret {
border-top: 5px dashed;
border-right: 5px solid transparent;
border-left: 5px solid transparent;
}
.extend-nav .navbar-nav > li > .language-title,
.extend-nav .navbar-nav > li > .language-title:visited {
height: 45px;
background-color: transparent;
color: #FFF;
border-top: 0px solid transparent;
padding: 20px 0px;
text-align: center;
font-size: 1.1em;
}
.extend-nav .navbar-nav > li > .language-title:hover,
.extend-nav .navbar-nav > li > .language-title:active,
.extend-nav .navbar-nav > li > .language-title:focus{
background-color: transparent;
border-top: 0px solid transparent;
}
.extend-nav .navbar-nav > .active > .language-title,
.extend-nav .navbar-nav > .active > .language-title:hover,
.extend-nav .navbar-nav > .active > .language-title:visited,
.extend-nav .navbar-nav > .active > .language-title:active,
.extend-nav .navbar-nav > .active > .language-title:focus {
background-color: transparent;
border-top: 0px solid transparent;
color: #FFF;
padding: 20px 0px;
text-align: center;
}
.extend-nav .navbar-nav > .open > .language-title,
.extend-nav .navbar-nav > .open > .language-title:hover,
.extend-nav .navbar-nav > .open > .language-title:visited,
.extend-nav .navbar-nav > .open > .language-title:active,
.extend-nav .navbar-nav > .open > .language-title:focus {
background-color: transparent;
border-top: 0px solid transparent;
color: #FFF;
padding: 20px 0px;
text-align: center;
}
.language-nav .language-dropdown{
left: 0px;
background-color: #000;
padding-bottom: 0px;
border-top-color: #000;
border-right: none;
border-bottom: none;
border-left: none;
min-width: 180px;
}
.language-nav .language-dropdown > li {
min-width: 180px;
}
.language-nav .language-dropdown > li > a,
.language-nav .language-dropdown > li > a:visited {
color: #FFF;
font-size: 1.05em;
min-width: 180px;
padding: 8px 18px;
}
.language-nav .language-dropdown > li > a:hover,
.language-nav .language-dropdown > li > a:active,
.language-nav .language-dropdown > li > a:focus {
background-color: #E70111;
color: #FFF;
}
}
@media (min-width: 992px) and (max-width: 1439px) {
.language-nav .language-dropdown{
right: -21px;
left: auto;
}
.extend-nav .language-nav,
.extend-nav .language-nav > li {
min-height: 39px;
height: 39px;
}
.extend-nav .navbar-nav > li > .language-title,
.extend-nav .navbar-nav > li > .language-title:visited {
height: 39px;
background-color: transparent;
color: #FFF;
border-top: 0px solid transparent;
padding: 14px 0px;
text-align: center;
font-size: 1.1em;
}
.extend-nav .navbar-nav > li > .language-title:hover,
.extend-nav .navbar-nav > li > .language-title:active,
.extend-nav .navbar-nav > li > .language-title:focus{
background-color: transparent;
border-top: 0px solid transparent;
}
.extend-nav .navbar-nav > .active > .language-title,
.extend-nav .navbar-nav > .active > .language-title:hover,
.extend-nav .navbar-nav > .active > .language-title:visited,
.extend-nav .navbar-nav > .active > .language-title:active,
.extend-nav .navbar-nav > .active > .language-title:focus {
background-color: transparent;
border-top: 0px solid transparent;
color: #FFF;
padding: 14px 0px;
text-align: center;
}
.extend-nav .navbar-nav > .open > .language-title,
.extend-nav .navbar-nav > .open > .language-title:hover,
.extend-nav .navbar-nav > .open > .language-title:visited,
.extend-nav .navbar-nav > .open > .language-title:active,
.extend-nav .navbar-nav > .open > .language-title:focus {
background-color: transparent;
border-top: 0px solid transparent;
color: #FFF;
padding: 14px 0px;
text-align: center;
}
}
@media (min-width: 10px) and (max-width: 767px) {
.extend-nav {
min-height: 50px;
height: 50px;
background-color: #000;
border: 0px solid transparent;
}
.extend-nav .navbar-nav {
}
.container > .navbar-header,
.container-fluid > .navbar-header {
position: relative;
}
.navbar-toggle,
.navbar-brand {
float: none;
}
}
/*search form */
@media (min-width: 1440px) {
.biostar-search {
position: relative;
margin-top: 0px;
}
.biostar-search .form-group {
position: absolute;
z-index: 2500;
width: 0px;
right: 54px;
overflow: hidden;
height: 60px;
background-color: #707070;
}
.biostar-search .search-keyword{
}
.biostar-search .search-keyword .form-control{
width: 208px;
border-radius: 0;
border: 0px solid transparent;
border-bottom: 1px solid #A7A7A7;
background-color: #707070;
margin-left: 14px;
margin-right: 14px;
margin-top: 11px;
color: #FFF;
}
.biostar-search .search-btn,
.biostar-search .search-btn:visited {
background-color: transparent;
border: none;
height: 60px;
border-radius: 0;
}
.biostar-search .search-btn:hover,
.biostar-search .search-btn:active,
.biostar-search .search-btn:focus {
background-color: #707070;
border: 0px solid transparent
}
.biostar-search .search-btn .fa {
color: #eceff1;
font-size: 1.4em;
}
.biostar-search .searching {
background-color: #707070;
}
}
@media (min-width: 992px) and (max-width: 1439px) {
.biostar-search {
position: relative;
margin-top: 0px;
}
.biostar-search .form-group {
position: absolute;
z-index: 2500;
width: 0px;
right: 60px;
overflow: hidden;
height: 45px;
background-color: #707070;
}
.biostar-search .search-keyword{
}
.biostar-search .search-keyword .form-control{
width: 208px;
border-radius: 0;
border: 0px solid transparent;
border-bottom: 1px solid #A7A7A7;
background-color: #707070;
margin-left: 14px;
margin-right: 14px;
margin-top: 4px;
color: #FFF;
}
.biostar-search .search-btn,
.biostar-search .search-btn:visited {
background-color: transparent;
border: none;
height: 45px;
width: 45px;
border-radius: 0;
}
.biostar-search .search-btn:hover,
.biostar-search .search-btn:active,
.biostar-search .search-btn:focus {
background-color: #707070;
border: 0px solid transparent
}
.biostar-search .search-btn .fa {
color: #eceff1;
font-size: 1.4em;
}
.biostar-search .searching {
background-color: #707070;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.biostar-search {
position: relative;
margin-top: 0px;
}
.biostar-search .form-group {
position: absolute;
z-index: 2500;
width: 0px;
right: 60px;
overflow: hidden;
height: 45px;
background-color: #707070;
}
.biostar-search .search-keyword{
}
.biostar-search .search-keyword .form-control{
width: 208px;
border-radius: 0;
border: 0px solid transparent;
border-bottom: 1px solid #A7A7A7;
background-color: #707070;
margin-left: 14px;
margin-right: 14px;
margin-top: 4px;
color: #FFF;
}
.biostar-search .search-btn,
.biostar-search .search-btn:visited {
background-color: transparent;
border: none;
height: 45px;
width: 45px;
border-radius: 0;
}
.biostar-search .search-btn:hover,
.biostar-search .search-btn:active,
.biostar-search .search-btn:focus {
background-color: #707070;
border: 0px solid transparent
}
.biostar-search .search-btn .fa {
color: #eceff1;
font-size: 1.4em;
}
.biostar-search .searching {
background-color: #707070;
}
}
@media (min-width: 480px) and (max-width: 767px) {
.biostar-search {
position: relative;
margin-top: 0px;
border: none !important;
padding-top: 0;
}
.biostar-search .form-group {
position: absolute;
z-index: 2500;
width: 0px;
right: 60px;
overflow: hidden;
height: 50px;
background-color: #707070;
}
.biostar-search .search-keyword{
}
.biostar-search .search-keyword .form-control{
width: 100%;
border-radius: 0;
border: 0px solid transparent;
border-bottom: 1px solid #A7A7A7;
background-color: #707070;
margin-left: 14px;
margin-right: 14px;
margin-top: 4px;
color: #FFF;
}
.biostar-search .search-btn,
.biostar-search .search-btn:visited {
background-color: transparent;
border: none;
height: 50px;
width: 50px;
border-radius: 0;
}
.biostar-search .search-btn:hover,
.biostar-search .search-btn:active,
.biostar-search .search-btn:focus {
background-color: #707070;
border: 0px solid transparent
}
.biostar-search .search-btn .fa {
color: #eceff1;
font-size: 1.4em;
}
.biostar-search .searching {
background-color: #707070;
}
}
@media (min-width: 10px) and (max-width: 479px) {
.biostar-search {
position: relative;
margin-top: 0px;
border: none !important;
padding-top: 0;
}
.biostar-search .form-group {
position: absolute;
z-index: 2500;
width: 0px;
right: 60px;
overflow: hidden;
height: 50px;
background-color: #707070;
}
.biostar-search .search-keyword{
}
.biostar-search .search-keyword .form-control{
width: 100%;
border-radius: 0;
border: 0px solid transparent;
border-bottom: 1px solid #A7A7A7;
background-color: #707070;
margin-left: 14px;
margin-right: 14px;
margin-top: 4px;
color: #FFF;
}
.biostar-search .search-btn,
.biostar-search .search-btn:visited {
background-color: transparent;
border: none;
height: 50px;
width: 50px;
border-radius: 0;
}
.biostar-search .search-btn:hover,
.biostar-search .search-btn:active,
.biostar-search .search-btn:focus {
background-color: #707070;
border: 0px solid transparent
}
.biostar-search .search-btn .fa {
color: #eceff1;
font-size: 1.4em;
}
.biostar-search .searching {
background-color: #707070;
}
}
@media (max-width: 767px) {
.biostar-header .navbar-toggle{
border: 0px solid transparent;
padding: 12px 14.5px;
margin: 0;
border-radius: 0;
left: 15px;
}
.biostar-header .navbar-toggle:hover,
.biostar-header .navbar-toggle:visited,
.biostar-header .navbar-toggle:active,
.biostar-header .navbar-toggle:focus {
background-color: transparent;
}
.biostar-header .navbar-toggle .fa {
color: #FFF;
font-size: 1.75em;
}
}
/*nav brand (logo)*/
@media (min-width: 992px) {
.navbar-brand {
width: 230px;
height: 40px;
padding: 0 15px;
margin-top: 28px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.navbar-brand {
width: 35px;
height: 29px;
padding: 0;
margin-top: 32px;
margin-left: 0px !important;
}
}
@media (min-width: 10px) and (max-width: 767px) {
.navbar-brand {
display: block;
width: 146px;
height: 25px;
position: absolute;
top: 12px;
left: 0;
right: 0;
margin-left: auto;
margin-right: auto;
padding: 0;
}
}
/*nav left menu*/
@media (min-width: 768px) {
#left-menu-box{
display: none !important;
}
}
@media(max-width: 767px) {
#left-menu-box {
position: fixed;
z-index: 3000;
top: 0;
left: -100%;
width: 100%;
height: 640px;
}
#left-menu-box * {
color: #FFF;
}
#left-menu-box *:hover,
#left-menu-box *:visited,
#left-menu-box *:active,
#left-menu-box *:focus {
background-color: #1B1B1B;
}
#left-menu-box #left-menu-block {
background-color: #1b1b1b;
width: calc( 100% - 50px );
height: 640px;
float: left;
}
#left-menu-box #close-block {
background-color: transparent;
width: 50px;
float: left;
height: 640px;
cursor: pointer;
}
#left-menu-box #close-block .clost-btn{
width: 50px;
height: 50px;
background-color: #000;
padding: 14px;
}
#left-menu-box #close-block .clost-btn .fa {
font-size: 1.75em;
}
#left-menu-block > .left-menu > .navbar-nav {
margin-top: 0px;
margin-bottom: 0px;
max-height: 480px;
overflow-y: auto;
}
#left-menu-block > .left-menu > .navbar-nav > li{
padding-left: 15px;
padding-right: 15px;
}
#left-menu-block > .left-menu > .navbar-nav > li > ul {
padding-left: 18px;
}
#left-menu-block .left-menu{
display: block;
}
#left-menu-box .extend-products-item.open{
border-bottom: 1px solid #2F2F2F;
}
#left-menu-box .menu_link_a {
border-bottom: 1px solid #2F2F2F;
width: 100%;
max-width: 100%;
padding: 18px 15px;
background-color: #1B1B1B;
}
#left-menu-box .extend-products-item > .menu_link_a {
border-bottom: 0px solid transparent;
}
#left-menu-box .no_children .menu_link_a{
border-bottom: 1px solid transparent;
}
#left-menu-box .no_children .product_list {
padding: 0;
}
#left-menu-block .product_list {
padding-left: 31px;
}
#left-menu-block .extend-products-item > .no_list {
padding-bottom: 0px;
}
#left-menu-block .product_list > li > a,
#left-menu-block .product_list > li > a:visited{
max-width: 100%;
width: 100%;
padding-left: 0px;
padding-top: 15px;
margin-bottom: 20px;
font-size: 1.15em;
}
#left-menu-block .product_list > li {
list-style-image: url('../images/left_menu/list_icon.png');
}
#left-menu-block .product_list > li > a:hover,
#left-menu-block .product_list > li > a:active,
#left-menu-block .product_list > li > a:focus {
color: #f40f21;
}
#left-menu-block .product_list > li > a > img{
margin-right: 10px;
position: relative;
}
#left-menu-block .caret{
border-top: 5px dashed;
border-top: 5px solid \9;
border-right: 5px solid transparent;
border-left: 5px solid transparent;
transform:rotate(270deg);
position: absolute;
right: 10px;
top: 27px;
}
#left-menu-block .uparrow{
transform:rotate(180deg);
}
#left-menu-block .rightarrow{
transform:rotate(270deg);
}
#left-menu-block .downarrow{
transform:rotate(0deg);
}
#left-menu-block .leftarrow{
transform:rotate(90deg);
}
}
/*nav product_list*/
@media (min-width: 1440px) {
.extend-products > .dropdown-menu{
width: 1440px;
left: -424px;
border-top-color: #1B1B1B;
padding-bottom: 20px;
}
.extend-products .dropdown-menu {
background-color: #1B1B1B;
}
.extend-products > .dropdown-menu > li {
float: left;
}
.extend-products .extend-products-item .biostar-product-menu{
height: 134px;
max-height: 134px;
overflow: hidden;
width: 100%;
}
.extend-products-item .biostar-product-menu img{
width: auto !important;
max-height: 134px;
}
.extend-products .extend-products-item .dropdown-toggle,
.extend-products .extend-products-item .dropdown-toggle:hover,
.extend-products .extend-products-item .dropdown-toggle:visited,
.extend-products .extend-products-item .dropdown-toggle:active,
.extend-products .extend-products-item .dropdown-toggle:focus {
width: 100%;
max-width: 100%;
text-align: center;
background-color: transparent;
color: #d0d0d0;
text-decoration: none;
font-size: 1.2em;
margin-bottom: 0px;
padding-bottom: 0px;
}
.extend-products-item .product_list {
margin-top: 0px;
padding-top: 0px;
}
.extend-products-item .product_list > li > a,
.extend-products-item .product_list > li > a:visited {
text-align: center;
background-color: transparent;
color: #707070;
text-decoration: none;
width: 238px;
max-width: 238px;
font-size: 1em;
padding-top: 0px;
padding-bottom: 4px;
}
.extend-products-item .product_list > li > a:hover,
.extend-products-item .product_list > li > a:active,
.extend-products-item .product_list > li > a:focus {
color: #f40f21;
text-decoration: none;
}
}
@media (min-width: 992px) and (max-width: 1439px) {
.extend-products > .dropdown-menu{
width: 990px;
left: -226px;
border-top-color: #1B1B1B;
padding-bottom: 20px;
}
.extend-products .dropdown-menu {
background-color: #1B1B1B;
}
.extend-products > .dropdown-menu > li {
float: left;
}
.extend-products .extend-products-item .biostar-product-menu{
height: 134px;
max-height: 134px;
overflow: hidden;
width: 100%;
}
.extend-products-item .biostar-product-menu img{
width: auto !important;
max-height: 134px;
}
.extend-products .extend-products-item .dropdown-toggle,
.extend-products .extend-products-item .dropdown-toggle:hover,
.extend-products .extend-products-item .dropdown-toggle:visited,
.extend-products .extend-products-item .dropdown-toggle:active,
.extend-products .extend-products-item .dropdown-toggle:focus {
width: 100%;
max-width: 100%;
text-align: center;
background-color: transparent;
color: #d0d0d0;
text-decoration: none;
font-size: 1.2em;
margin-bottom: 0px;
padding-bottom: 0px;
}
.extend-products-item .product_list {
margin-top: 0px;
padding-top: 0px;
}
.extend-products-item .product_list > li > a,
.extend-products-item .product_list > li > a:visited {
text-align: center;
background-color: transparent;
color: #707070;
text-decoration: none;
width: 238px;
max-width: 238px;
font-size: 1em;
padding-top: 0px;
padding-bottom: 4px;
}
.extend-products-item .product_list > li > a:hover,
.extend-products-item .product_list > li > a:active,
.extend-products-item .product_list > li > a:focus {
color: #f40f21;
text-decoration: none;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.extend-products > .dropdown-menu{
width: 770px;
left: -58px;
border-top-color: #1B1B1B;
padding-bottom: 20px;
}
.extend-products .dropdown-menu {
background-color: #1B1B1B;
}
.extend-products > .dropdown-menu > li {
float: left;
}
.extend-products .extend-products-item .biostar-product-menu{
height: 134px;
max-height: 134px;
overflow: hidden;
width: 100%;
}
.extend-products-item .biostar-product-menu img{
width: auto !important;
max-height: 134px;
}
.extend-products .extend-products-item .dropdown-toggle,
.extend-products .extend-products-item .dropdown-toggle:hover,
.extend-products .extend-products-item .dropdown-toggle:visited,
.extend-products .extend-products-item .dropdown-toggle:active,
.extend-products .extend-products-item .dropdown-toggle:focus {
width: 100%;
max-width: 100%;
text-align: center;
background-color: transparent;
color: #d0d0d0;
text-decoration: none;
font-size: 1.2em;
margin-bottom: 0px;
padding-bottom: 0px;
}
.extend-products-item .product_list {
margin-top: 0px;
padding-top: 0px;
}
.extend-products-item .product_list > li > a,
.extend-products-item .product_list > li > a:visited {
text-align: center;
background-color: transparent;
color: #707070;
text-decoration: none;
width: 238px;
max-width: 238px;
font-size: 1em;
padding-top: 0px;
padding-bottom: 4px;
}
.extend-products-item .product_list > li > a:hover,
.extend-products-item .product_list > li > a:active,
.extend-products-item .product_list > li > a:focus {
color: #f40f21;
text-decoration: none;
}
}
@media (min-width: 480px) and (max-width: 767px) {
}
@media (min-width: 10px) and (max-width: 479px) {
}
/*footer sitemap*/
.sitemap_block {
background-color: #EEEEEE;
}
.sitemap_link_group {
padding-top: 48px;
padding-bottom: 48px;
padding-left: 0px;
padding-right: 0px;
}
@media (min-width: 768px) and (max-width: 991px) {
.sitemap_link_group {
padding-top: 20px;
padding-bottom: 20px;
padding-left: 0px;
padding-right: 0px;
}
}
.sitemap_link_group ul,
.sitemap_link_group li {
list-style: none;
padding: 0;
margin: 0;
}
.sitemap_link_group .sitemap_link_item {
float: left;
}
.sitemap_link_item .title {
margin-bottom: 13px;
font-size: 1.25em;
color: #707070;
}
.sitemap_link_item .title a,
.sitemap_link_item .title a:visited {
color: #707070;
font-size: 1.15em;
}
.sitemap_link_item .title a:hover,
.sitemap_link_item .title a:active,
.sitemap_link_item .title a:focus {
color: #e60012;
}
.sitemap_link_item .link_to {
margin-bottom: 10px;
}
.sitemap_link_item .link_to a,
.sitemap_link_item .link_to a:visited{
color: #707070;
font-weight: normal;
font-size: 1.05em;
}
.sitemap_link_item .link_to a:hover,
.sitemap_link_item .link_to a:active,
.sitemap_link_item .link_to a:focus {
color: #e60012;
}
@media (min-width: 1440px) {
.sitemap_link_group .sitemap_link_item {
width: 200px;
}
}
@media (min-width: 992px) and (max-width: 1439px) {
.sitemap_link_group .sitemap_link_item {
width: 168px;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.sitemap_link_group .sitemap_link_item {
width: 180px;
}
}
@media (min-width: 480px) and (max-width: 767px) {
}
@media (min-width: 10px) and (max-width: 479px) {
}
/*footer sitemap link*/
.sitemap_other_group {
padding-top: 48px;
padding-bottom: 48px;
padding-left: 0px;
padding-right: 0px;
}
@media (min-width: 768px) and (max-width: 991px) {
.sitemap_other_group {
padding-top: 20px;
padding-bottom: 20px;
padding-left: 0px;
padding-right: 0px;
}
}
@media (min-width: 10px) and (max-width: 767px) {
.sitemap_other_group {
padding-top: 48px;
padding-bottom: 48px;
padding-left: 30px;
padding-right: 30px;
}
}
.biostar-btn-type-a {
min-width: 250px;
height: 30px;
margin-bottom: 5px;
max-width: 250px;
}
.biostar-btn-type-a .biostar-btn {
background-color: #FFF !important;
border: 0px solid transparent !important;
box-shadow: 0 0 0 transparent !important;
width: 100%;
position: relative;
padding: 0;
height: 100%;
text-align: left;
padding-left: 40px;
}
@media (min-width: 768px) and (max-width: 991px) {
.biostar-btn-type-a .biostar-btn {
max-width: 250px;
}
}
.biostar-btn-type-a .biostar-btn .fa {
position: absolute;
width: 30px;
height: 30px;
color: #FFF;
top: 0;
line-height: 30px;
text-align: center;
}
.biostar-btn-type-a .biostar-btn .fa-facebook {
background-color: #3C5B9B;
font-size: 1.5em;
}
.biostar-btn-type-a .biostar-btn .fa-globe {
background-color: #000;
font-size: 1.4em;
}
.biostar-btn-type-a .biostar-btn .fa-caret-up,
.biostar-btn-type-a .biostar-btn .fa-caret-down{
font-size: 1em;
background-color: #616161;
font-size: 1.3em;
}
.biostar-btn-type-a .biostar-btn .left {
left: 0;
}
.biostar-btn-type-a .biostar-btn .right {
right: 0;
}
.biostar-btn-type-a .dropdown-menu {
left: 0;
margin: 0;
padding: 0;
border: 0px solid transparent;
}
.biostar-btn-type-a.dropup .dropdown-menu{
border-bottom: 5px solid transparent;
width: 100%;
}
.biostar-btn-type-a.dropdown .dropdown-menu{
border-top: 5px solid transparent;
}
.biostar-btn-type-a .dropdown-menu li > a,
.biostar-btn-type-a .dropdown-menu li > a:visited {
padding: 7px 15px;
color: #707070;
max-width: 100%;
}
.biostar-btn-type-a .dropdown-menu li > a:hover,
.biostar-btn-type-a .dropdown-menu li > a:active,
.biostar-btn-type-a .dropdown-menu li > a:focus {
color: #FFF;
background-color: #EA0011;
}
.social_list {
padding-top: 10px;
}
@media (min-width: 768px) and (max-width: 991px) {
.social_list {
padding-top: 0px;
}
}
.social_list ul,
.social_list li {
list-style: none;
padding: 0;
margin: 0;
}
.social_list li {
float: left;
margin-right: 12px;
margin-top: 10px;
}
.social_list li > a,
.social_list li > a:visited {
display: block;
border-radius: 50%;
border-color: #858587;
background-color: #858587;
width: 44px;
height: 44px;
line-height: 55px;
text-align: center;
}
.social_list li > a:hover,
.social_list li > a:active,
.social_list li > a:focus {
background-color: #E60012;
}
.social_list li > a .fa {
color: #FFF;
}
.social_list li > a .fa.fa-twitter {
font-size: 2.2em;
}
.social_list li > a .fa.fa-google-plus {
font-size: 1.85em;
}
.social_list li > a .fa.fa-youtube-play {
font-size: 1.95em;
}
/*footer copyright*/
.copyright_block {
background-color: #EEEEEE;
border-top: 1px solid #BFBFBF;
padding-top: 16px;
padding-bottom: 16px;
}
.copyright_block h5 {
color: #707070;
margin-top: 0px;
margin-bottom: 0px;
font-size: 1.1em;
}
@media (min-width: 768px) {
.copyright_block {
border-top: 2px solid #BFBFBF;
padding-top: 31px;
padding-bottom: 31px;
}
.copyright_block h5 {
color: #707070;
font-size: 1.1em;
}
}
/*dropdown icon*/
.dropdown_select {
/*width: auto !important;*/
height: 32px;
/*border: 1px solid #E5E5E5;*/
}
.dropdown_select .cs-placeholder:after {
font-family: 'FontAwesome';
content: '\f0d7' !important;
background-color: #616161;
width: 30px;
height: 30px;
right: 0;
top: 15px;
color: #FFF;
text-align: center;
}
.dropdown_select .cs-placeholder {
padding: 0;
height: 32px;
line-height: 32px;
padding-left: 15px;
padding-right: 48px;
font-size: 1.2em;
}
.dropdown_select .cs-options {
width: auto;
/*border: 1px solid #E5E5E5;*/
margin-top: 5px;
}
div.cs-select {
margin-right: 10px;
/*border: 1px solid #E5E5E5;*/
}
.cs-select ul span {
padding: 5px 15px;
font-size: 1.2em;
}
.cs-select ul span:hover,
.cs-select ul span:active,
.cs-select ul span:focus,
.cs-select .cs-selected span {
background-color: #E70111;
color: #FFF;
}
.cs-select .cs-selected span::after {
content: " ";
}
.remove-padding-left {
padding-left: 0px;
}
.remove-padding-right {
padding-right: 0px;
}
.remove-padding-rf {
padding-right: 0px;
padding-left: 0px;
}
/*bootstrap img reset and upper vertical-align middle*/
.img-center-block {
margin-left: auto;
margin-right: auto;
display: block;
}
.img-responsive{
width: 100%;
}
.img_block{
width: 100%;
}
.img-wrapper img {
-webkit-transition: all .5s ease;
-moz-transition: all .5s ease;
-ms-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease;
vertical-align: middle;
}
.img-wrapper:hover img {
transform:scale(1.5);
-ms-transform:scale(1.5); /* IE 9 */
-moz-transform:scale(1.5); /* Firefox */
-webkit-transform:scale(1.5); /* Safari and Chrome */
-o-transform:scale(1.5); /* Opera */
}
.thumbnail-center {
display:table;
border: 0px none transparent;
border-radius: 0px;
margin: 0px;
padding: 0px;
overflow: hidden;
}
.thumbnail-center .thumbnail_wrapper {
display:table-cell;
vertical-align:middle;
text-align: center;
}
.thumbnail-center .thumbnail_wrapper > img {
width:100%;
margin-left: auto;
margin-right: auto;
}
/* 灰階<-->彩色*/
img.filterGrey:hover{
filter: none; /* IE6-9 */
-webkit-filter: grayscale(0); /* Google Chrome, Safari 6+ & Opera 15+ */
}
img.filterGrey{
filter: gray; /* IE6-9 */
-webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
-webkit-box-shadow: 0px 2px 6px 2px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 2px 6px 2px rgba(0,0,0,0.75);
box-shadow: 0px 2px 6px 2px rgba(0,0,0,0.75);
}
/*圖片遮罩*/
/*
*/
.hovereffect {
width: 100%;
height: 100%;
/*float 影響垂直置中*/
/*float: left;*/
overflow: hidden;
position: relative;
text-align: center;
cursor: default;
}
.hovereffect .overlay {
position: absolute;
z-index: 1000\0;
overflow: hidden;
width: 80%;
height: 80%;
left: 10%;
top: 10%;
/*border-bottom: 1px solid #FFF;*/
/*border-top: 1px solid #FFF;*/
-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
transition: opacity 0.35s, transform 0.35s;
-webkit-transform: scale(0,1);
-ms-transform: scale(0,1);
transform: scale(0,1);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#FFF00,endColorstr=#FFF00);
zoom: 1;
}
.hovereffect:hover .overlay {
opacity: 1;
filter: alpha(opacity=100);
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
}
.hovereffect img {
display: block;
position: relative;
-webkit-transition: all 0.35s;
transition: all 0.35s;
}
.hovereffect:hover img {
filter: url('data:image/svg+xml;charset=utf-8,#filter');
filter: brightness(0.6);
-webkit-filter: brightness(0.6);
}
.hovereffect:hover .ieGrey{
display: block\0;
width: 100%\0;
height: 100%\0;
position: absolute\0;
z-index: 800\0;
background-color: #000\0;
opacity: 0.4\0;
}
.hovereffect h2 {
text-transform: uppercase;
text-align: center;
position: relative;
font-size: 17px;
background-color: transparent;
color: #FFF;
padding: 1em 0;
opacity: 1;
filter: alpha(opacity=1);
-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
transition: opacity 0.35s, transform 0.35s;
-webkit-transform: translate3d(0,-100%,0);
transform: translate3d(0,-100%,0);
}
.hovereffect a, hovereffect p {
color: #FFF;
padding: 1em 0;
opacity: 1;
filter: alpha(opacity=1);
-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
transition: opacity 0.35s, transform 0.35s;
-webkit-transform: translate3d(0,100%,0);
transform: translate3d(0,100%,0);
text-decoration: none;
}
.hovereffect:hover a, .hovereffect:hover p, .hovereffect:hover h2 {
opacity: 1;
filter: alpha(opacity=100);
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
}
.container .remove-left-margin,
.container-fluid .remove-left-margin{
margin-left: -15px;
}
.container .remove-left-padding,
.container-fluid .remove-left-padding{
padding-left: 0px;
}
/*下拉箭頭*/
.arrow-down{
width:12px;
height: 6px;
height: 7px\0;
margin-left: 7px;
border-top: 6px dashed;
border-top: 6px solid \9;
border-right: 6px solid transparent;
border-left: 6px solid transparent;
}
.main-arraw{
position: absolute;
margin-left: auto;
margin-right: auto;
left: 0px;
right: 0px;
bottom: 7px;
display: none;
}
/*重製hover外觀*/
.nav > li > a.sub_menu:hover,
.nav > li > a.sub_menu:focus{
text-decoration: none;
background-color: transparent;
color:#FFFFFF;
}
.nav-tabs > li > a.sub_menu{
margin-left: 20px;
margin-right: -4px;
border: 0px none transparent;
border-radius: 0;
}
.nav-tabs > li > a.sub_menu:hover {
border-color: transparent;
}
/*向下箭頭*/
.m_arrow{
border-top: 3px solid #535353;
border-left: 3px solid #535353;
border-right: 0px none transparent;
border-bottom: 0px none transparent;
width: 10px;
height: 10px;
display: none;
position: absolute;
z-index: 1002;
}
.uparrow{
transform:rotate(45deg);
}
.rightarrow{
transform:rotate(135deg);
}
.downarrow{
transform:rotate(225deg);
}
.leftarrow{
transform:rotate(315deg);
}
/*set all section margin bottom end*/
@media (min-width: 768px) {
/*PC下顯示*/
.pc_on{
display: block;
}
/*PC下隱藏*/
.pc_hidden{
display: none;
}
}
@media (min-width: 480px) and (max-width: 767px) {
/*平板隱藏*/
.t_on{
display: block;
}
/*平板隱藏*/
.t_hidden{
display: none;
}
}
@media (min-width: 10px) and (max-width: 479px) {
/*手機隱藏*/
.m_on{
display: block;
}
/*手機隱藏*/
.m_hidden{
display: none;
}
}
/*set every point visible or hidden*/
@media (min-width: 1440px) {
.lg-on {
display: block;
}
.lg-hidden {
display: none;
visibility: hidden;
}
.lg-view {
visibility: visible;
}
}
@media (min-width: 992px) and (max-width: 1439px) {
.md-on {
display: block;
}
.md-hidden {
display: none;
visibility: hidden;
}
.md-view {
visibility: visible;
}
}
@media (min-width: 768px) and (max-width: 991px) {
.sm-on {
display: block;
}
.sm-hidden {
display: none;
visibility: hidden;
}
.sm-view {
visibility: visible;
}
}
@media (min-width: 480px) and (max-width: 767px) {
.xsm-on {
display: block;
}
.xsm-hidden {
display: none;
visibility: hidden;
}
.xsm-view {
visibility: visible;
}
}
@media (min-width: 10px) and (max-width: 479px) {
.xs-on {
display: block;
}
.xs-hidden {
display: none;
visibility: hidden;
}
.xs-view {
visibility: visible;
}
}