body 
{
    font: 500 15px;
    font-family: arial, "Hiragino Sans GB", "Microsoft Yahei", 微软雅黑, 宋体, Tahoma, Arial, Helvetica, STHeiti;
    line-height: 1.8;
	-webkit-user-select: none; /* Chrome, Opera, Safari */
    -moz-user-select: none; /* Firefox 2+ */
    -ms-user-select: none; /* IE 10+ */
    user-select: none; /* Standard syntax */
}

h1 {
    font-size: 24px;
    color: #F8B500;
    font-weight: 800;
    margin-bottom: 30px;
}

h2 {
    font-size: 30px;
    color: #F8B500;
    font-weight: 800;
    margin-bottom: 30px;
}

h3 {
    font-size: 24px;
    color: #F8B500;
    font-weight: 800;
    margin-bottom: 30px;
}

h4 {
    font-size: 19px;
    line-height: 1.375em;
    color: #303030;
    font-weight: 500;
    margin-bottom: 30px;
}

.nav h3 {
    font-size: 24px;
    color: #F8B500;
    font-weight: 600;
    margin: 10px 30px 10px 30px;
}

.modal {
    overflow: auto !important;
}
/*
body.modal-open {
    overflow: visible;
}


.modal {
    overflow: hidden;
}
.modal .modal-body {
    height: 500px;
    overflow: auto;
}
.modal .modal-fixed {
    position: fixed;
}

.modal-backdrop {
bottom: 0;
}*/

.jumbotron {
    background-color: #cccccc;
    background-position: center;
    background-image: url('../images/header.jpg');
    color: #fff;
    padding: 350px 20px 200px 20px;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    width: 100%;
    /* Set width to 100% */
    margin: auto;
    background-attachment: fixed;
    height: 120vh;
    background-blend-mode: multiply;
}

.jumbotron h1 {
    font-size: 80px;
    color: #F8B500;
    font-weight: 600;
    margin-bottom: 30px;
    text-shadow: 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff, 0px 0px 10px #fff;
}

.jumbotron p {
    font-size: 30px;
    color: #F8B500;
    font-weight: 400;
}

hr.style01 {
    width: 15%;
    border-color: #F8B500;
    border: 0;
    height: 3px;
    background: #F8B500;
    background-image: linear-gradient(to right, #F8B500, #ffbc66, #F8B500);
}

hr.style02 {
    width: 30%;
    border-color: #F8B500;
    border: 0;
    height: 3px;
    background: #F8B500;
    background-image: linear-gradient(to right, #F8B500, #ffbc66, #F8B500);
}

.container-fluid {
    padding: 30px 50px;
}

.font-f6f6f6 {
    color: #f6f6f6;
}

.bg-padding {
    padding: 60px 10px;
}

.bg-grey {
    background-color: #6E6A5F;
}
.bg-news {
  /*background-image: linear-gradient(to top, #0250c5 0%, #d43f8d 100%);*/
  background-image: linear-gradient(-225deg, #231557 0%, #44107A 29%, #FF1361 67%, #FFF800 100%);
}
.post
{  
  
    border: 1px solid #dadada;
    border-radius: 8px;
    background-color: white;
    box-shadow: 5px 0px 5px rgba(0, 0, 0, .2);
    min-height: 400px;
  
 
    text-align: center;
    z-index: 4;
    padding: 20px;
  
}
.post img
{
    position:relative;
  transition:all .3s ease 0s;
    filter: blur(1px);
    -webkit-filter: blur(1px);
    -moz-filter: blur(1px);
    -o-filter: blur(1px);
    -ms-filter: blur(1px);
}
.post .content
{
    padding: 15px;
}
.post .author
{
    font-size: 11px;
    color: #737373;
    padding: 25px 30px 20px;
}
.post .post-img-content
{
    height: 196px;
    position: relative;
}
.post .post-img-content img
{
  border-radius: 10px,0px,0px,0px;
    position: absolute;
}
.post .post-title
{
    display: table-cell;
    vertical-align: bottom;
    z-index: 2;
    position: relative;
}
.post .post-title b
{
    background-color: rgba(51, 51, 51, 0.58);
    display: inline-block;
    margin-bottom: 5px;
    color: #FFF;
    padding: 10px 15px;
    margin-top: 5px;
}
.menews {
  background-color:#f6f6f6;
  height:50em;
}

.menews h2 {

    /*word-spacing: 4px;
    font-size: 30px;
    font-weight: 700;
    margin-bottom:30px;
  */
}
.menews h4{
    font-size: 2rem;
    line-height: 1.375em;
    font-weight: 400;
    font-style: italic;
    margin: 10px 0;
  
}

.menews p{
    font-size:13px;
}

.menews .ion-minus{
    padding:0px 10px;
}

.menews .carousel-indicators {
    bottom: -38px;
}

.menews .carousel-indicators li{
    background-color: #5db4c0;
    height: 13px;
    width: 13px;
    margin: 5px;
}

.menews .carousel-indicators li.active{
    background-color: #888383;
}

.menews .card-block{
    padding: 10px 20px 10px 20px;
    text-align: left;
}
.menews .card-block i {
    background-color:#fff;
    color: #5db4c0;
}
.menews .card-tag{
    padding: 5px;
    color: #fff;
    background-color: #5db4c0;
}

.menews .card{
    background-color: #FFF;
    border: 1px solid #eceaea;
    margin: 10px 0px;
}

.menews .card a
{
   text-decoration:none;
}

.menews .btn.btn-default {
    background-color: #5db4c0;
    color: #fff;
    border-radius: 0;
    border: none;
    padding: 13px 20px;
    font-size: 13px;
    font-weight: 600;
}

.menews .post-type
{
    display: table-cell;
    vertical-align: bottom;
    z-index: 2;
    position: relative;
}
.menews .post-title b
{
    background-color: rgba(51, 51, 51, 0.58);
    display: inline-block;
    margin-bottom: 5px;
    color: #FFF;
    padding: 10px 15px;
    margin-top: 5px;
}

.bg-footer {
    background-color: #dfdfdf;
    padding: 40px 60px 30px 60px;
}

.bg-company {
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    background-position: center;
    background-image: url('../images/company_bg.jpg');
    padding: 20px 40px 400px 40px;
    width: 100%;
    /* Set width to 100% */
    margin: auto;
    background-blend-mode: lighten;
    background-color: #222222;
}

.bg-product {
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    background-position: center;
    background-image: url('../images/product_bg.jpg');
    padding: 50px 40px 50px 40px;
    width: 100%;
    /* Set width to 100% */
    margin: auto;
    background-blend-mode: soft-light;
    background-color: rgba(99%, 99%, 99%, 0.5);
}
.bg-epsintro {
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    background-position: center;
    background-image: url('../images/eps_intro3.jpg');
    padding: 50px 40px 50px 40px;
    width: 100%;
    /* Set width to 100% */
    margin: auto;
    background-blend-mode: soft-light;
    background-color: rgba(100%, 100%, 100%, 0.8);
    
}

.bg-contact {
    padding-top: 50px;
    background-color: white;
}

.logo-small {
    color: #F8B500;
    font-size: 50px;
}

.logo {
    color: #F8B500;
    font-size: 200px;
}

.thumbnail {
    padding: 40px 0px 40px 0px;
    border: none;
    border-radius: 45;
    background-color: white;
    box-shadow: 5px 0px 40px rgba(0, 0, 0, .2);
    min-height: 720px;
}

.thumbnail img {
    width: 75%;
    height: 75%;
    margin-bottom: 30px;
}

.thumbnail p {
    margin-top: 15px;
    color: #555;
    font-size: 20px;
}

.thumbnail h1 {
    font-size: 38px;
    color: #F8B500;
}

.thumbnail h2 {
    font-size: 20px;
    color: #201300;
    min-height: 40px;
    max-height: 400px;
}

.thumbnail ul {
    margin-left: 1.9em;
    text-align: left;
}





.thumbnail-small {
    padding: 40px 0px 40px 0px;
    border: none;
    border-radius: 5px;
    background-color: white;
    box-shadow: 5px 0px 40px rgba(0, 0, 0, .2);
	margin-bottom: 30px;
}

.thumbnail-small img {
    width: 75%;
    height: 75%;
    margin-bottom: 30px;
}

.thumbnail-small p {
    margin-top: 15px;
    color: #555;
    font-size: 20px;
}

.thumbnail-small h1 {
    font-size: 38px;
    color: #F8B500;
}

.thumbnail-small h2 {
    font-size: 20px;
    color: #201300;
    min-height: 40px;
    max-height: 400px;
}

.thumbnail-small ul {
    margin-left: 1.9em;
    text-align: left;
}


/*thumbnail intro*/

.thumbnail-intro {
    min-height: 220px;
    padding: 5px 10px 10px 10px;
    margin-bottom: 10px;
    border: #444444;
    border-width: 0.2vmin;
    border-radius: 10px;
    border-style:solid;
    background-color: transparent;
    box-shadow: 5px 0px 40px rgba(0, 0, 0, .2);
    background-blend-mode: soft-light;
    background-color: rgba(100%, 100%, 100%, 0.7);
}

.thumbnail-intro p {
    margin-top: 0.8vmin;
    font-size: 18px;
    color: #625b57;
}

.thumbnail-intro h1 {
    font-size: 38px;
    color: #444444;
    margin-bottom: 0.8vmin;     
}

.thumbnail-intro h2 {
    font-size: 28px;
    color: #444444;
  margin-bottom: 20px;
    margin-top: 10px;
    min-height: 40px;
    max-height: 400px;
}



.modal h1 {
    font-size: 30px;
    color: #F8B500;
    font-weight: 500;
    margin-bottom: 20px;
}

.modal h2 {
    font-size: 25px;
    color: #F8B500;
    font-weight: 500;
    margin-bottom: 20px;
}
/*fade */
/*
Fade content bs-carousel with hero headers
Code snippet by maridlcrmn (Follow me on Twitter @maridlcrmn) for Bootsnipp.com
Image credits: unsplash.com
*/
/********************************/
/*       Fade Bs-carousel       */
/********************************/

.fade-carousel {
    position: relative;
    height: 100vh;
    padding-top: 50px;
}

.fade-carousel .carousel-inner .item {
    height: 100vh;
}

.fade-carousel .carousel-indicators > li {
    margin: 0 2px;
    background-color: #f39c12;
    border-color: #f39c12;
    opacity: .7;
}

.fade-carousel .carousel-indicators > li.active {
    width: 10px;
    height: 10px;
    opacity: 1;
}

.fade-carousel .carousel-control.right,
.carousel-control.left {
    background-image: none;
    color: #f39c12;
}

.media-carousel .carousel-control.right,
.carousel-control.left {
    background-image: none;

}
.media-carousel .carousel-control.right,
.carousel-control.left {
    background-image: none;
}


/********************************/
/*          Hero Headers        */
/********************************/

.hero {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 3;
    color: #fff;
    text-align: center;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, .90);
    -webkit-transform: translate3d(-50%, -30%, 0);
    -moz-transform: translate3d(-50%, -30%, 0);
    -ms-transform: translate3d(-50%, -30%, 0);
    -o-transform: translate3d(-50%, -30%, 0);
    transform: translate3d(-50%, -30%, 0);
}

.hero h1 {
    font-size: 4em;
    font-weight: bold;
    margin: 0;
    padding: 0;
    color: azure;
}

.hero h3 {
    font-size: 2em;
}

.fade-carousel .carousel-inner .item .hero {
    opacity: 0;
    -webkit-transition: 2s all ease-in-out .1s;
    -moz-transition: 2s all ease-in-out .1s;
    -ms-transition: 2s all ease-in-out .1s;
    -o-transition: 2s all ease-in-out .1s;
    transition: 2s all ease-in-out .1s;
}

.fade-carousel .carousel-inner .item.active .hero {
    opacity: 1;
    -webkit-transition: 2s all ease-in-out .1s;
    -moz-transition: 2s all ease-in-out .1s;
    -ms-transition: 2s all ease-in-out .1s;
    -o-transition: 2s all ease-in-out .1s;
    transition: 2s all ease-in-out .1s;
}
/********************************/
/*            Overlay           */
/********************************/

.overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2;
    background-color: #080d15;
    opacity: .7;
}
/********************************/
/*          Custom Buttons      */
/********************************/

.btn.btn-lg {
    padding: 10px 40px;
}

.btn.btn-hero,
.btn.btn-hero:hover,
.btn.btn-hero:focus {
    color: #f5f5f5;
    background-color: #1abc9c;
    border-color: #1abc9c;
    outline: none;
    margin: 20px auto;
}
/********************************/
/*       Slides backgrounds     */
/********************************/

.fade-carousel .slides .slide-1,
.fade-carousel .slides .slide-2,
.fade-carousel .slides .slide-3 {
    height: 100vh;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    -webkit-background-position: center center;
    -moz-background-position: center center;
    background-position: center center;
    -o-background-position: center center;
    -webkit-background-repeat: no-repeat;
    -moz-background-repeat: no-repeat;
    background-repeat: no-repeat;
    -o-background-repeat: no-repeat;
}

.fade-carousel .slides .slide-1 {
    background-image: url(../images/carousel_bg01.jpg);
}

.fade-carousel .slides .slide-2 {
    background-image: url(../images/carousel_bg02.jpg);
}

.fade-carousel .slides .slide-3 {
    background-image: url(../images/carousel_bg03.jpg);
}
/********************************/
/*          Media Queries       */
/********************************/

@media screen and (min-width: 980px) {
    .hero {
        width: 980px;
    }
}

@media screen and (max-width: 640px) {
    .hero h1 {
        font-size: 3em;
    }
    .hero h3 {
        font-size: 1.5em;
    }
}
/*end fade*/

/*.item h4 {
    font-size: 19px;
    line-height: 1.375em;
    font-weight: 400;
    font-style: italic;
    margin: 70px 0;
}*/

.item span {
    font-style: normal;
}

.navbar {
    margin-bottom: 0;
    background-color: #F8B500;
    z-index: 9999;
    border: 0;
    font-size: 15px !important;
    line-height: 1.42857143 !important;
    letter-spacing: 4px;
    border-radius: 0;
    /*opacity: 0.9;*/
}

.navbar li a,
.navbar .navbar-brand {
    color: #fff !important;
}

.navbar-brand {
    font-size: 25px !important;
    font-weight: 900;
}

.navbar-nav li a:hover,
.navbar-nav li.active a {
    color: #F8B500 !important;
    background-color: #fff !important;
}

.navbar-default .navbar-toggle {
    border-color: transparent;
    color: #fff !important;
}

.open .dropdown-toggle {
    color: #fff;
    /*
  background-color: #ffddb2 !important;
  */
  background-color: #f7900c !important;

}

.dropdown-menu li a {
    color: #000 !important;
}

.dropdown-menu li a:hover {
    background-color: #69491a !important;
}

footer .glyphicon {
    font-size: 20px;
    margin-bottom: 20px;
    color: #F8B500;
}

footer a:link,
a:visited {
    text-decoration: none;
    color: #37343E;
}

footer a:hover,
a:active {
    color: #37343E;
}

footer h4 {
    margin-bottom: 3px;
}

.slideanim {
    visibility: hidden;
}

.slide {
    animation-name: slide;
    -webkit-animation-name: slide;
    animation-duration: 1s;
    -webkit-animation-duration: 1s;
    visibility: visible;
}

.product_img {
    border: 4px solid transparent;
    margin-bottom: 25px;
    width: 60%;
    height: 60%;
    border-color: #D1D1D1;
    box-shadow: 0px 0px 5px rgba(10%, 10%, 20%, 0.8)
}

.about_img {
    border: 4px solid transparent;
    margin-bottom: 25px;
    width: 60%;
    height: 60%;
    border-color: #D1D1D1;
    box-shadow: 0px 0px 5px rgba(10%, 10%, 20%, 0.8)
}
/*
.product_img:hover {
    border-color: #778899;
}
*/

.modal_padding {
    padding-top: 40px;
}

#download_padding {
    padding-left: 10px;
    padding-right: 10px;
}

.vcenter {
    vertical-align: middle;
}
/*@media (max-width: 600px) {
    .carousel-caption {
        display: none;
        // Hide the carousel text when the screen is less than 600 pixels wide 
    }
}*/ 
@keyframes slide {
    0% {
        opacity: 0;
        transform: translateY(70%);
    }
    100% {
        opacity: 1;
        transform: translateY(0%);
    }
}
@-webkit-keyframes slide {
    0% {
        opacity: 0;
        -webkit-transform: translateY(70%);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0%);
    }
}
@media screen and (max-width: 480px) {
    .nav h3 {
		font-size: 18px;
		color: #F8B500;
		font-weight: 600;
		margin: 7px 20px 7px 20px;
	}
	.modal h1 {
		font-size: 20px;
		color: #F8B500;
		font-weight: 300;
		margin-bottom: 10px;
	}
	
	
}
@media screen and (max-width: 768px) {
    .col-sm-4 {
        text-align: center;
        margin: 25px 0;
    }
    .btn-lg {
        width: 100%;
        margin-bottom: 35px;
    }
}
@media screen and (max-width: 480px) {
    .logo {
        font-size: 150px;
    }
}
@media screen and (min-width: 768px) and (max-width: 992px) {
    .thumbnail {
        padding: 40px 0px 40px 0px;
        border: none;
        border-radius: 45;
        background-color: white;
        box-shadow: 5px 0px 40px rgba(0, 0, 0, .2);
        min-height: 650px;
    }
    .thumbnail img {
        width: 75%;
        height: 75%;
        margin-bottom: 30px;
    }
    .thumbnail p {
        margin-top: 15px;
        color: #555;
        font-size: 20px;
    }
    .thumbnail h1 {
        font-size: 38px;
        color: #F8B500;
    }
    .thumbnail h2 {
        font-size: 20px;
        color: #201300;
        min-height: 40px;
        max-height: 400px;
    }
    .thumbnail ul {
        margin-left: 0em;
        text-align: left;
    }
	
	

}



.funkyradio div {}
.funkyradio label {
    width: 100%;
    border-radius: 3px;
    border: 1px solid #D1D3D4;
    font-weight: normal;
	overflow: hidden; /*超出範圍的部分隱藏*/
	white-space: nowrap; /* 不自動斷行 */
	text-overflow: ellipsis; /* 出現省略號 */
}
.funkyradio input[type="radio"]:empty,
.funkyradio input[type="checkbox"]:empty {
    display: none;
}
.funkyradio input[type="radio"]:empty ~ label,
.funkyradio input[type="checkbox"]:empty ~ label {
    position: relative;
    line-height: 2.5em;
    text-indent: 3.00em;
    margin-top: 0.05em;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.funkyradio input[type="radio"]:empty ~ label:before,
.funkyradio input[type="checkbox"]:empty ~ label:before {
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    left: 0;
    content: '';
    width: 2.5em;
    background: #D1D3D4;
    border-radius: 3px 0 0 3px;
}
.funkyradio input[type="radio"]:hover:not(:checked) ~ label,
.funkyradio input[type="checkbox"]:hover:not(:checked) ~ label {
    color: #888;
}
.funkyradio input[type="radio"]:hover:not(:checked) ~ label:before,
.funkyradio input[type="checkbox"]:hover:not(:checked) ~ label:before {
    content: '\2714';
    text-indent: .9em;
    color: #C2C2C2;
}
.funkyradio input[type="radio"]:checked ~ label,
.funkyradio input[type="checkbox"]:checked ~ label {
    color: #777;
}
.funkyradio input[type="radio"]:checked ~ label:before,
.funkyradio input[type="checkbox"]:checked ~ label:before {
    content: '\2714';
    text-indent: .9em;
    color: #333;
    background-color: #ccc;
}
.funkyradio input[type="radio"]:focus ~ label:before,
.funkyradio input[type="checkbox"]:focus ~ label:before {
    box-shadow: 0 0 0 3px #999;
}
.funkyradio-default input[type="radio"]:checked ~ label:before,
.funkyradio-default input[type="checkbox"]:checked ~ label:before {
    color: #333;
    background-color: #ccc;
}
.funkyradio-primary input[type="radio"]:checked ~ label:before,
.funkyradio-primary input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #337ab7;
}
.funkyradio-success input[type="radio"]:checked ~ label:before,
.funkyradio-success input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #5cb85c;
}
.funkyradio-danger input[type="radio"]:checked ~ label:before,
.funkyradio-danger input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #d9534f;
}
.funkyradio-warning input[type="radio"]:checked ~ label:before,
.funkyradio-warning input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #f0ad4e;
}
.funkyradio-info input[type="radio"]:checked ~ label:before,
.funkyradio-info input[type="checkbox"]:checked ~ label:before {
    color: #fff;
    background-color: #5bc0de;
}
.funkyradio .tooltip > .tooltip-inner {
    background-color: #F8B500;
    color: #FFFFFF;
    border: 2px solid #f8f300;
    padding: 10px;
}
#catalogueModel table caption {
    font-size: 20px;
}

/* Style the links inside the langSidenav */
#langSidenav {
	z-index: 1; /* Sit on top */
	position: fixed; /* Position them relative to the browser window */
	right: 0px; /* Position them outside of the screen */
	top: 60px;
	transition: 0.3s; /* Add transition on hover */
	width: 125px; /* Set a specific width */
	text-decoration: none; /* Remove underline */
	font-size: 12px; /* Increase font size */
	opacity: 0.9;
}
#langSidenav:hover{
	right: 0; /* On mouse-over, make the elements appear as they should */
}
#langSidenav .vertical-header {
	background-color: #777;
	padding: 13px 13px 13px 18px; /* 15px padding */
	font-size: 14px; /* Increase font size */
	color: white; /* White text color */
	border-radius: 5px 0 0 5px; /* Rounded corners on the top right and bottom right side */
}
#langSidenav .vertical-menu {
	background-color: #777;
	margin-left: 45px;
	padding: 13px; /* 15px padding */
	font-size: 12px; /* Increase font size */
	border-radius: 0 0 0 5px; /* Rounded corners on the top right and bottom right side */
}
#langSidenav .vertical-menu a {
	display: block; /* Make the links appear below each other */
	color: white; /* White text color */
	text-decoration: none; /* Remove underline from links */
}

#langSidenav .vertical-menu a:hover {
	color: white;
}
#langSidenav .vertical-menu a.active {
	color: white;
}
/*End of langSidenav */
/* Style the links inside the servSidenav */
#servSidenav {
	position: fixed;
    border-radius: 50px;
    right: 3vmin;
    bottom: 3vmin;
	width: 8.5vmin;
    height: 8.5vmin;
    color: #fff;
    background: #ffcd46;
	padding-left: 2vmin;
	padding-top: 1.9vmin;
	font-size: 2.8vmin;
    cursor: pointer;
    z-index: 1000;
	box-shadow: 0 3px 6px rgba(0,0,0,.275);
    outline: none;
	-webkit-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  -moz-transform: scale(1);
  transform: scale(1);
  -webkit-transform-origin: center center;
  -moz-transform-origin: center center;
  -ms-transform-origin: center center;
  -o-transform-origin: center center;
  transition: all 1s; 
-webkit-animation-delay:1s;
  -moz-animation-delay:1s;
  -ms-animation-delay:1s;
  -o-animation-delay:1s;
  animation-dely:1s;
-webkit-animation: 1600ms pulsate infinite alternate ease-in-out;
  -moz-animation: 1600ms pulsate infinite alternate ease-in-out;
  -ms-animation: 1600ms pulsate infinite alternate ease-in-out;
  -o-animation: 1600ms pulsate infinite alternate ease-in-out;
  animation: 1600ms pulsate infinite alternate ease-in-out; 
}
#servSidenav i{
    color: #f9f9f9; 
}
#servSidenav a{
    color: #f9f9f9; 
}
@keyframes pulsate {
  0% { transform: scale(1); }
  50% { transform: scale(1.1); }
  100% { transform: scale(1); }
}
@-webkit-keyframes pulsate {
  0% { -webkit-transform: scale(1); }
  50% { -webkit-transform: scale(1.1); }
  100% { -webkit-transform: scale(1); }
}
@-moz-keyframes pulsate {
  0% { -moz-transform: scale(1); }
  50% { -moz-transform: scale(1.1); }
  100% { -moz-transform: scale(1); }  
}
@-ms-keyframes pulsate {
  0% { -ms-transform: scale(1); }
  50% { -ms-transform: scale(1.1); }
  100% { -ms-transform: scale(1); }  
}
@-o-keyframes pulsate {
  0% { -o-transform: scale(1); }
  50% { -o-transform: scale(1.1); }
  100% { -o-transform: scale(1); }  
}
/*End of servSidenav */

/* 21070605 customize new style for btn-product */
.btn-product {
    color: #F8B500;
	border: solid #F8B500 2px;
	background: none;
}

.btn-product:hover {
	color: #F8B500;
	border: solid #F8B500 2px;
	background: #fffbef;
}
.btn-product:hover .btn-product:after{
	color: #F8B500;
	border: solid #F8B500 2px;
	background: none;
}



.btn-product:active , .btn-product.active {
	color: #F8B500;
	border: solid #F8B500 2px;
	background: #fffbef;

}

.btn-product:active:focus,
.btn-product:focus:hover,
.btn-product:focus {
    color: #F8B500;
	border: solid #F8B500 2px;
	background: none;

}


.btn-product:focus .btn-product:after{
    color: #F8B500;
	border: solid #F8B500 2px;
	background: none;

}
/*End of customize new style for btn-product */
/* 21070803 customize new style for loading */
.downloading {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: -400%;
	z-index: 9999;
	background-color: #FDB700;
}
.spinner {
  margin: 100px auto;
  width: 50px;
  height: 40px;
  text-align: center;
  font-size: 10px;
}

.spinner > div {
  background-color: #333;
  height: 100%;
  width: 6px;
  display: inline-block;
  
  -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
  animation: sk-stretchdelay 1.2s infinite ease-in-out;
}

.spinner .rect2 {
  -webkit-animation-delay: -1.1s;
  animation-delay: -1.1s;
}

.spinner .rect3 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}

.spinner .rect4 {
  -webkit-animation-delay: -0.9s;
  animation-delay: -0.9s;
}

.spinner .rect5 {
  -webkit-animation-delay: -0.8s;
  animation-delay: -0.8s;
}

@-webkit-keyframes sk-stretchdelay {
  0%, 40%, 100% { -webkit-transform: scaleY(0.4) }  
  20% { -webkit-transform: scaleY(1.0) }
}

@keyframes sk-stretchdelay {
  0%, 40%, 100% { 
    transform: scaleY(0.4);
    -webkit-transform: scaleY(0.4);
  }  20% { 
    transform: scaleY(1.0);
    -webkit-transform: scaleY(1.0);
  }
}
/*End of customize new style for loading */



#priceTable > figure > table{
  margin:auto;
  width: 100%;
}
#priceTable > figure > table > tbody > tr> td {
  text-align: left;
  padding: 6px 12px;
}

#priceTable > figure > table > tbody > tr:nth-child(even){background-color: #f2f2f2}

#priceTable > figure > table > tbody > tr:nth-child(1){
  background-color: #F8B500;
  color: white;
}

.col-xs-1-5,
.col-sm-1-5,
.col-md-1-5,
.col-lg-1-5 {
    position: relative;
    min-height: 1px;
    padding-right: 10px;
    padding-left: 10px;
}


.col-xs-1-5 {
    width: 20%;
    float: left;
}



@media (min-width: 768px) {
.col-sm-1-5 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 992px) {
    .col-md-1-5 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 1200px) {
    .col-lg-1-5 {
        width: 20%;
        float: left;
    }
}




