/*--------------------------------------------------------------------------
    General Style
--------------------------------------------------------------------------*/
html, body {
    height: 100%;
}

.wrapper {
    min-height: 100%;
    position: relative;
}

.for-footer {
    /*padding-bottom: 280px;*/
    padding-top: 50px;
}

.section {
    min-height: 300px;
    padding: 0 0 30px 0 !important;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -o-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}

.section-white {
    background: #FFF;
}

.section .container:first-child h1,
.section .container:first-child h2,
.section .container:first-child h3 {
    margin-top: 0;
    font-weight: 700;
}

.input-micro {
    width: 50px;
    margin-bottom: 0 !important;
}

.input-medium {
    width: 100%;
    margin-bottom: 0 !important;
}

sub,
sup {
    color: #F94A4A;
    font-size: 12px;
}

textarea:focus,
select:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
    border-color: rgba(79, 141, 179, 0.8);
    outline: 0;
    outline: thin dotted \9;
    /* IE6-9 */
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(79, 141, 179, 0.6);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(79, 141, 179, 0.6);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(79, 141, 179, 0.6);
    color: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(79, 141, 179, 0.6);
}

label {
    font-size: 15px;
    font-weight: 700;
}

select{
    letter-spacing: 2px;
}

input[type=checkbox]{
    width: 18px;
    height: 18px;
    top: -2px;
}

.form-control[disabled], fieldset[disabled] .form-control {
    font-size: 16px;
}

.checkbox-inline, .radio-inline {
    font-weight: 700;
}

ul.no-list-style {
    list-style-type: none;
    margin-left: 0;
}

ul.no-list-style li {
    line-height: 28px;
}

div[class*="span"] {
    -webkit-transition: all .4s linear;
    -moz-transition: all .4s linear;
    -o-transition: all .4s linear;
    -ms-transition: all .4s linear;
    transition: all .4s linear;
}

.blog-sidebar {
    padding: 0 15px;
}

/*--------------------------------------------------------------------------
    Typography Style
--------------------------------------------------------------------------*/

body {
    font-family: 微軟正黑體, Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 20px;
    color: #535b60;
}

h1 {
    color: #53555c;
    font-family: 微軟正黑體, 'Open Sans', sans-serif;
    font-weight: 800;
    font-size: 28px;
}

h2 {
    color: #53555c;
    font-family: 微軟正黑體, 'Open Sans', sans-serif;
    font-size: 2em;
    border-bottom: 2px solid #53555c;
    line-height: 1.5em;
    margin: 30px 0;
    padding-left: 10px;
}

h3 {
    font-family: 微軟正黑體, 'Open Sans', sans-serif;
    color: #53555c;
    font-size: 1.5em;
    padding: 15px 0 15px 0;
}

h4 {
    font-family: 微軟正黑體, 微軟正黑體, 'Open Sans', sans-serif;
    margin-bottom: 30px;
    font-size: 20px;
    color: #000000;
    font-weight: 700;
}

a {
    color: #4f8db3;
}

a:focus, a:hover {
    color: #4F8DB3 !important;
    text-decoration: none;
}

p {
    font-size: 16px;
    line-height: 28px;
}

tr td {
    font-size: 14px;
}

/*--------------------------------------------------------------------------
+   Services Style
--------------------------------------------------------------------------*/

/* Multicolumn */

.service-wrapper {
    background: #FFF;
    margin: 20px 10px;
    text-align: center;
    padding: 30px 20px;
    -webkit-border-radius: 5px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px;
    -moz-background-clip: padding;
    border-radius: 5px;
    background-clip: padding-box;
    -webkit-box-shadow: 0 0 3px #999;
    -moz-box-shadow: 0 0 3px #999;
    box-shadow: 0 0 3px #999;
    color: 0 0 3px #999;
}

.service-wrapper h3 {
    font-size: 1.2em;
    margin: 10px 0 !important;
}

.service-wrapper p {
    margin-top: 0;
}

/* Row */
.service-wrapper-row {
    padding: 10px 0;
}

.service-wrapper-row h3 {
    padding: 15px 0 10px 0;
}

.service-wrapper-row .service-image {
    padding-top: 15px;
    text-align: center;
}

.service-wrapper-row .service-image img {
    width: 100%;
    vertical-align: bottom;
    bottom: 0;
    border: 7px solid #FFF;
    -webkit-border-radius: 5px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px;
    -moz-background-clip: padding;
    border-radius: 5px;
    background-clip: padding-box;
    -webkit-box-shadow: 0 0 8px #999;
    -moz-box-shadow: 0 0 8px #999;
    box-shadow: 0 0 8px #999;
    color: 0 0 8px #999;
}

.service-wrapper-row-disable {
    background-color: #D8D8D8;
    margin: 5px 0px 5px 0px;
    -webkit-border-radius: 5px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px;
    -moz-background-clip: padding;
    border-radius: 5px;
}

/*--------------------------------------------------------------------------
+   Pricing Table Style
--------------------------------------------------------------------------*/

.pricing-plan {
    float: left;
    text-align: center;
    background: #fafafa;
    position: relative;
    width: 48%;
    margin: 10px 1% 10px 0;
    padding: 20px;
    -webkit-border-radius: 7px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 7px;
    -moz-background-clip: padding;
    border-radius: 7px;
    background-clip: padding-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-shadow: 0 1px 8px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0 1px 8px rgba(0, 0, 0, 0.4);
    box-shadow: 0 1px 8px rgba(0, 0, 0, 0.4);
    color: 0 1px 8px rgba(0, 0, 0, 0.4);
    -webkit-transition: -webkit-box-shadow .25s linear;
    -moz-transition: -moz-box-shadow .25s linear;
    -o-transition: box-shadow .25s linear;
    -ms-transition: box-shadow .25s linear;
    transition: box-shadow .25s linear;
}

.pricing-plan:hover {
    -webkit-box-shadow: 0 0 8px #333;
    -moz-box-shadow: 0 0 8px #333;
    box-shadow: 0 0 8px #333;
    color: 0 0 8px #333;
    z-index: 5;
}

.pricing-plan .pricing-plan-title {
    position: relative;
    margin: -20px -10px 20px;
    padding: 20px;
    line-height: 1;
    font-size: 16px;
    font-weight: bold;
    color: #595f6b;
    border-bottom: 1px dashed #d2d2d2;
}

.pricing-plan .pricing-plan-title:before {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    height: 1px;
    background-size: 3px 1px;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9ImdyYWQtdWNnZy1nZW5lcmF0ZWQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjEwMCUiIHkyPSIwJSI+PHN0b3Agb2Zmc2V0PSIiIHN0b3AtY29sb3I9IndoaXRlIiBzdG9wLW9wYWNpdHk9IjEiLz48c3RvcCBvZmZzZXQ9IjMzJSIgc3RvcC1jb2xvcj0id2hpdGUiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMzQlIiBzdG9wLWNvbG9yPSIjZDJkMmQyIiBzdG9wLW9wYWNpdHk9IjEiLz48c3RvcCBvZmZzZXQ9IiIgc3RvcC1jb2xvcj0iI2QyZDJkMiIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPjwvc3ZnPg==);
    background-image: -moz-linear-gradient(left, white, white 33%, #d2d2d2 34%, #d2d2d2);
    background-image: -webkit-linear-gradient(left, white, white 33%, #d2d2d2 34%, #d2d2d2);
    background-image: -o-linear-gradient(left, white, white 33%, #d2d2d2 34%, #d2d2d2);
    background-image: linear-gradient(to right, white, white 33%, #d2d2d2 34%, #d2d2d2);
}

.pricing-plan .pricing-plan-price {
    margin: 0 auto 20px;
    width: 90px;
    height: 90px;
    line-height: 90px;
    font-size: 19px;
    font-weight: bold;
    color: white;
    background: #595f6b;
    -webkit-border-radius: 45px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 45px;
    -moz-background-clip: padding;
    border-radius: 45px;
    background-clip: padding-box;
}

.pricing-plan .pricing-plan-price span {
    font-size: 12px;
    font-weight: normal;
    color: rgba(255, 255, 255, 0.9);
}

.pricing-plan .pricing-plan-features {
    margin-bottom: 20px;
    margin-left: 0;
    padding: 0;
    line-height: 2;
    font-size: 12px;
    color: #999;
    text-align: center;
    list-style-type: none;
}

.pricing-plan .pricing-plan-features li strong {
    font-weight: bold;
    color: #888;
}

.pricing-plan .pricing-plan-promote {
    margin: 0;
    padding: 40px 20px;
    background-color: white;
    border-width: 2px;
    -webkit-border-radius: 7px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 7px;
    -moz-background-clip: padding;
    border-radius: 7px;
    background-clip: padding-box;
    z-index: 4;
}

.ribbon-wrapper {
    width: 85px;
    height: 88px;
    overflow: hidden;
    position: absolute;
    top: 0;
    right: 0;
}

.price-ribbon {
    font: bold 15px Sans-Serif;
    color: #333;
    text-align: center;
    text-shadow: rgba(255, 255, 255, 0.5) 0px 1px 0px;
    position: relative;
    padding: 7px 0;
    left: -5px;
    top: 15px;
    width: 120px;
    background-color: #FFF;
    color: #6a6340;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.3);
    color: 0px 0px 3px rgba(0, 0, 0, 0.3);
}

.ribbon-green {
    background-color: #BFDC7A;
}

.ribbon-blue {
    background-color: #5ACBFF;
}

.ribbon-orange {
    background-color: #FF9542;
}

.ribbon-red {
    background-color: #FF7373;
}

/*--------------------------------------------------------------------------
+   Contact Us Style
--------------------------------------------------------------------------*/

#contact-us-map {
    height: 300px;
    -webkit-box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    -moz-box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    color: inset 0 1px #fff, 0 0 8px #c8cfe6;
}

.contact-us-details {
    margin: 20px 0;
    font-size: 16px;
    color: #fff;
    letter-spacing: 2px;
}

.contact-us-details a {
    color: #fff;
}

/*--------------------------------------------------------------------------
+   Video Wrapper Style
--------------------------------------------------------------------------*/

.video-wrapper {
    -webkit-box-shadow: 0 0 5px #000;
    -moz-box-shadow: 0 0 5px #000;
    box-shadow: 0 0 5px #000;
    color: 0 0 5px #000;
    margin: 20px 0;
}

/*--------------------------------------------------------------------------
+   Call to Action Bar Style
--------------------------------------------------------------------------*/

.calltoaction-wrapper {
    text-align: center;
}

.calltoaction-wrapper h3 {
    display: inline-block;
    line-height: 36px;
    margin-right: 10px;
    margin-bottom: 0;
}

.calltoaction-wrapper a {
    vertical-align: top;
}

/*--------------------------------------------------------------------------
+   Testimonials Style
--------------------------------------------------------------------------*/

.testimonial blockquote {
    margin: 0;
    padding: 0;
    border-left: none;
}

.testimonial blockquote p {
    font-size: 0.9em;
    margin-bottom: 20px;
    line-height: 1.5;
}

.testimonial .testimonial-bubble {
    text-align: justify;
    -webkit-border-radius: 4px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 4px;
    -moz-background-clip: padding;
    border-radius: 4px;
    background-clip: padding-box;
    padding: 0 20px 20px 20px;
    margin: 35px 10px 20px 10px;
    background: #FFF;
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-shadow: inset 0 1px #fff, 0 1px 2px #c8cfe6;
    -moz-box-shadow: inset 0 1px #fff, 0 1px 2px #c8cfe6;
    box-shadow: inset 0 1px #fff, 0 1px 2px #c8cfe6;
    color: inset 0 1px #fff, 0 1px 2px #c8cfe6;
}

.testimonial .testimonial-bubble::before {
    background-color: #FFF;
    content: "\00a0";
    display: block;
    height: 20px;
    width: 20px;
    top: -10px;
    left: 45%;
    position: relative;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.testimonial .author-photo {
    text-align: center;
}

.testimonial .author-photo img {
    margin: auto;
    border: 5px solid #FFF;
    -webkit-border-radius: 100px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 100px;
    -moz-background-clip: padding;
    border-radius: 100px;
    background-clip: padding-box;
    -webkit-box-shadow: inset 0 1px #fff, 0 1px 2px #c8cfe6;
    -moz-box-shadow: inset 0 1px #fff, 0 1px 2px #c8cfe6;
    box-shadow: inset 0 1px #fff, 0 1px 2px #c8cfe6;
    color: inset 0 1px #fff, 0 1px 2px #c8cfe6;
}

.testimonial .author-info {
    font-weight: 400;
    font-size: 0.8em;
}

/*--------------------------------------------------------------------------
+   Clients Logos Style
--------------------------------------------------------------------------*/

.clients-logo-wrapper img {
    max-width: 100%;
}

/*--------------------------------------------------------------------------
+   News Style
--------------------------------------------------------------------------*/

.featured-news .caption,
.latest-news .caption {
    padding: 10px 0 5px 0;
}

.featured-news .caption a,
.latest-news .caption a {
    font-size: 1.1em;
    font-weight: 600;
    color: #535b60;
}

.featured-news .intro,
.latest-news .intro {
    padding-bottom: 10px;
    font-size: 0.9em;
}

.featured-news .intro a,
.latest-news .intro a {
    white-space: nowrap;
}

.featured-news .date,
.latest-news .date {
    font-size: 0.7em;
    color: #999;
}

.featured-news img,
.latest-news img {
    max-width: 100%;
    margin: 10px 0 10px 0;
    -webkit-border-radius: 5px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px;
    -moz-background-clip: padding;
    border-radius: 5px;
    background-clip: padding-box;
    -webkit-box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    -moz-box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    color: inset 0 1px #fff, 0 0 8px #c8cfe6;
}

/*--------------------------------------------------------------------------
+   Frequently Asked Questions Style
--------------------------------------------------------------------------*/

.faq-wrapper h3 {
    margin-top: 20px !important;
}

.faq-wrapper .accordion-inner {
    margin: 10px 0 10px 20px;
    padding: 0 10px;
    font-size: 0.9em;
}

.faq-wrapper .accordion-inner .answer {
    font-weight: 600;
}

/*--------------------------------------------------------------------------
+   Blog Style
--------------------------------------------------------------------------*/

/* Posts List */

.blog-post {
    background: #FFF;
    position: relative;
    /*  margin: 20px 0;*/
    border: 7px solid #FFF;
    -webkit-border-radius: 5px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px;
    -moz-background-clip: padding;
    border-radius: 5px;
    background-clip: padding-box;
    -webkit-box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    -moz-box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    color: inset 0 1px #fff, 0 0 8px #c8cfe6;
}

.blog-post img {
    max-width: 100%;
}

.blog-post .post-info {
    background: #000;
    background: rgba(0, 0, 0, 0.6);
    color: #FFF;
    line-height: 1.2;
    position: absolute;
    padding: 5px;
    left: 10px;
    top: 10px;
    -webkit-border-radius: 5px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px;
    -moz-background-clip: padding;
    border-radius: 5px;
    background-clip: padding-box;
}

.blog-post .post-comments-count {
    text-align: center;
}

.post-info .post-comments-count {
    padding-top: 5px;
}

.post-info .post-comments-count i {
    margin-right: 5px;
}

.post-info .post-comments-count a {
    color: #FFF;
}

.post-info .post-date .date {
    font-size: 0.7em;
    font-weight: 600;
}

.post-title h3 {
    font-size: 1.2em;
    border-bottom: 1px dotted #828282;
    margin: 0 20px;
    padding-top: 10px;
}

.post-title h3 a {
    color: #535b60;
}

.post-summary {
    margin: 10px 20px;
}

.post-summary p {
    color: #828282;
    font-size: 0.9em;
    text-align: justify;
}

.post-more {
    text-align: right;
    padding: 0 20px 20px 0;
}

/* Single Post */

.blog-single-post {
    padding: 10px 30px;
}

.single-post-title h3 {
    font-size: 1.5em;
    margin: 0;
}

.single-post-info {
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px dotted #828282;
}

.single-post-info i {
    color: #333;
    margin-right: 5px;
}

.single-post-image {
    text-align: center;
}

.single-post-image img {
    -webkit-box-shadow: 0 0 5px #000;
    -moz-box-shadow: 0 0 5px #000;
    box-shadow: 0 0 5px #000;
    color: 0 0 5px #000;
}

.single-post-content {
    margin: 30px 0 20px 0;
    padding-bottom: 20px;
    border-bottom: 2px dotted #CCC;
}

.single-post-content p {
    color: #828282;
    font-size: 0.9em;
    text-align: justify;
}

.post-comments {
    list-style-type: none;
    margin-left: 0;
    margin-bottom: 40px;
    padding: 0;
}

.post-comments ul {
    list-style-type: none;
    margin-left: 30px;
    padding: 0;
}

.comment-wrapper p {
    margin: 0;
    position: relative;
    border: 1px solid #CCC;
    padding: 10px;
    margin-bottom: 10px;
    -webkit-border-radius: 3px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 3px;
    -moz-background-clip: padding;
    border-radius: 3px;
    background-clip: padding-box;
}

.comment-author {
    font-size: 1.3em;
    font-weight: 600;
    margin-bottom: 10px;
}

.comment-author img {
    max-width: 50px;
    -webkit-border-radius: 25px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 25px;
    -moz-background-clip: padding;
    border-radius: 25px;
    background-clip: padding-box;
    margin-right: 10px;
}

.comment-date {
    font-size: 0.9em;
    margin-right: 20px;
}

.comment-actions {
    text-align: right;
    opacity: 0.6;
    -webkit-transition: opacity .25s linear;
    -moz-transition: opacity .25s linear;
    -o-transition: opacity .25s linear;
    -ms-transition: opacity .25s linear;
    transition: opacity .25s linear;
}

.comment-actions:hover {
    text-align: right;
    opacity: 1;
}

.comment-actions i {
    color: #333;
}

.comment-reply-btn {
    margin-left: 10px;
}

.blog-sidebar h4 {
    margin-top: 20px;
    font-weight: 700;
}

.blog-sidebar h4:first-child {
    margin-top: 0;
}

.blog-sidebar ul {
    list-style-type: none;
    margin-left: 0;
    padding: 0;
    font-size: 16px;
    line-height: 30px;
}

.blog-sidebar .recent-posts li,
.blog-sidebar .blog-categories li {
    padding: 5px 20px 5px 0;
    border-top: 1px solid #D5D5D5;
}

.blog-sidebar .recent-posts li:last-child,
.blog-sidebar .blog-categories li:last-child {
    border-bottom: 1px solid #D5D5D5;
}

.blog-sidebar .recent-posts a,
.blog-sidebar .blog-categories a {
    font-size: 16px;
    padding: 0 0 0 20px;
}

.dropdown-menu > li > a {
    display: block;
    padding: 6px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #ffffff !important;
    white-space: nowrap;
    font-size: 16px;
}

.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
    border-color: #e4e4e4;
}

/*--------------------------------------------------------------------------
+   E-commerce Style
--------------------------------------------------------------------------*/

.shop-item {
    position: relative;
    background: #FFF;
    padding-bottom: 10px;
    margin-top: 20px;
    margin-bottom: 10px;
    border: 8px solid #FFF;
    -webkit-border-radius: 5px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px;
    -moz-background-clip: padding;
    border-radius: 5px;
    background-clip: padding-box;
    -webkit-box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    -moz-box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    color: inset 0 1px #fff, 0 0 8px #c8cfe6;
}

.shop-item img {
    max-width: 100%;
}

.shop-item .image {
    text-align: center;
}

.shop-item .title {
    padding: 20px 0 10px;
}

.shop-item .title h3 {
    font-size: 0.9em;
    margin: 0 10px;
    text-align: center;
}

.shop-item .title h3 a {
    color: #535b60;
    text-transform: uppercase;
}

.shop-item .colors {
    text-align: center;
    margin-bottom: 10px;
}

.shop-item .colors span {
    display: inline-block;
    *display: inline;
    width: 8px;
    height: 8px;
    border-width: 1px;
    border-style: solid;
    margin: 2px;
}

.shop-item .price {
    color: #535b60;
    font-size: 1.5em;
    text-align: center;
    margin-bottom: 20px;
    font-weight: 600;
    -webkit-border-radius: 7px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 7px;
    -moz-background-clip: padding;
    border-radius: 7px;
    background-clip: padding-box;
}

.shop-item .price .price-was {
    color: #A7A7A7;
    font-size: 0.8em;
    text-decoration: line-through;
}

.shop-item .description {
    color: #828282;
    font-size: 0.9em;
    text-align: justify;
    margin: 0 10px;
}

.shop-item .description p {
    border-top: 1px solid #ECECEC;
    padding: 10px;
    margin: 0;
}

.shop-item .actions {
    border-top: 1px solid #ECECEC;
    margin: 0 10px;
    padding-top: 20px;
    text-align: center;
}

.shop-item .actions span {
    font-size: 0.8em;
    white-space: nowrap;
}

.colors {
    text-align: center;
    margin-bottom: 10px;
}

.colors span {
    display: inline-block;
    *display: inline;
    width: 8px;
    height: 8px;
    border-width: 1px;
    border-style: solid;
    margin: 2px;
}

span.color-white {
    background-color: #D7D7CF;
    border-color: #c0c0b3;
}

span.color-black {
    background-color: #000;
    border-color: #000000;
}

span.color-blue {
    background-color: #073A52;
    border-color: #031923;
}

span.color-orange {
    background-color: #D56E1D;
    border-color: #a85717;
}

span.color-green {
    background-color: #5C6632;
    border-color: #3d4421;
}

span.color-red {
    background-color: #DA1111;
    border-color: #ab0d0d;
}

/*--------------------------------------------------------------------------
+   Product Details Page Style
--------------------------------------------------------------------------*/

.product-image-large {
    border: 8px solid #FFF;
    text-align: center;
    margin-bottom: 10px;
    -webkit-border-radius: 5px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px;
    -moz-background-clip: padding;
    border-radius: 5px;
    background-clip: padding-box;
    -webkit-box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    -moz-box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    color: inset 0 1px #fff, 0 0 8px #c8cfe6;
}

.product-image-large img {
    max-width: 100%;
}

.product-details h5 {
    font-weight: 700;
}

.product-details h4 {
    padding: 0 15px;
}

.product-details h4 span:after {
    content: "｜";
    margin-right: 10px;
    font-size: 25px;
    color: #53555c;
}

.product-details h5 {
    margin-top: 20px;
}

.product-details .price {
    font-size: 1.4em;
    font-weight: 700;
    text-align: left;
    padding: 5px;
    background: rgba(255, 255, 255, 0.6);
    display: inline;
    -webkit-border-radius: 5px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px;
    -moz-background-clip: padding;
    border-radius: 5px;
    background-clip: padding-box;
}

.product-details .price-was {
    text-decoration: line-through;
    font-size: 0.8em;
    font-weight: normal;
}

.product-details .shop-item-selections {
    width: 100%;
}

.product-details .shop-item-selections td {
    line-height: 36px;
}

.product-details .shop-item-selections td:first-child {
    width: 30%;
}

.product-details .choose-item-color span {
    display: inline-block;
    *display: inline;
    width: 10px;
    height: 10px;
    border-width: 1px;
    border-style: solid;
    margin-bottom: -1px;
    margin-right: 2px;
}

.product-details-nav {
    margin-top: 30px !important;
    margin-left: 0 !important;
}

.product-detail-info {
    background: #fff;
    border-top: 0;
    border-left: 1px;
    border-right: 1px;
    border-bottom: 1px;
    border-color: #ddd;
    border-style: solid;
    padding: 20px 30px;
}

.product-detail-info p,
.product-detail-info ul {
    font-size: 14px;
}

.product-detail-info table {
    width: 100%;
}

.product-detail-info table td {
    font-size: 0.9em;
    width: 50%;
    line-height: 28px;
    border-bottom: 1px solid #E7E7E7;
}

.product-detail-info table td:first-child {
    font-weight: 600;
}

.product-detail-info table tr:last-child td {
    border-bottom: 0;
}

.product-item-info {
    background: #fff;
    border-top: 0;
    border-left: 1px;
    border-right: 1px;
    border-bottom: 1px;
    border-color: #ddd;
    border-style: solid;
    padding: 20px 30px;
}

.product-item-info p{
    font-size: 14px;
}

.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover {
    color: #555 !important;
}

.nav-tabs>li>a:hover{
    color: #555 !important;
}


/*--------------------------------------------------------------------------
+   Shopping Cart Style
--------------------------------------------------------------------------*/

.shopping-cart {
    margin: 10px 0 0 0;
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 10px;
}

/*.shopping-cart a {
    color: #535b60;
}
*/

.shopping-cart tr {
    background: #FFF;
}

.shopping-cart td {
    padding: 10px;
}

.shopping-cart td:first-child {
    -webkit-border-radius: 5px 0 0 5px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px 0 0 5px;
    -moz-background-clip: padding;
    border-radius: 5px 0 0 5px;
    background-clip: padding-box;
    margin-left: 10px;
}

.shopping-cart td:last-child {
    -webkit-border-radius: 0 5px 5px 0;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 0 5px 5px 0;
    -moz-background-clip: padding;
    border-radius: 0 5px 5px 0;
    background-clip: padding-box;
    margin-right: 10px;
}

.shopping-cart .image,
.shopping-cart .image img {
    max-width: 150px;
}

.shopping-cart .title {
    font-size: 1.1em;
}

.shopping-cart .feature {
    font-size: 0.8em;
}

.shopping-cart .color span {
    display: inline-block;
    *display: inline;
    width: 8px;
    height: 8px;
    border-width: 1px;
    border-style: solid;
}

.shopping-cart .quantity {
    width: 80px;
}

.shopping-cart .price {
    color: #535b60;
    font-size: 1.2em;
    width: 80px;
    text-align: center;
}

.shopping-cart .actions {
    width: 80px;
}

.shopping-cart .actions .btn {
    margin-bottom: 5px;
}

.cart-totals {
    margin: 20px 0 30px 0;
    border-top: 2px solid #535b60;
    font-size: 1.1em;
    line-height: 24px;
    text-align: right;
    width: 100%;
}

.cart-totals td {
    width: 150px;
    padding: 3px 0;
}

.cart-totals .cart-grand-total {
    font-size: 1.3em;
}

/*--------------------------------------------------------------------------
+   Products Slider Style
--------------------------------------------------------------------------*/

.products-slider .shop-item {
    border: 0;
    margin: 0;
    padding: 0;
    width: 25%;
    float: left;
    display: block;
    position: relative;
    -webkit-border-radius: 5px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px;
    -moz-background-clip: padding;
    border-radius: 5px;
    background-clip: padding-box;
    -webkit-box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    -moz-box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    color: inset 0 1px #fff, 0 0 8px #c8cfe6;
}

.products-slider .shop-item img {
    -webkit-border-radius: 5px 5px 0 0;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px 5px 0 0;
    -moz-background-clip: padding;
    border-radius: 5px 5px 0 0;
    background-clip: padding-box;
}

.products-slider .shop-item .title h3 a {
    font-size: 1em;
    font-weight: 400;
}

.products-slider .shop-item .price {
    font-size: 1.1em;
    font-weight: 400;
    margin-bottom: 10px;
}

.products-slider .shop-item .actions {
    padding: 10px 0;
}

/*--------------------------------------------------------------------------
+   Events List Style
--------------------------------------------------------------------------*/

.events-list {
    width: 100%;
    font-size: 0.9em;
    border: 1px;
}

.events-list tr th {
    padding: 5px 15px 5px 0;
}

.events-list tr td {
    padding: 5px 15px 5px 0;
}

.events-list tr td:last-child {
    padding: 5px 0;
    text-align: right;
}

.events-list tr:hover .event-date {
    border-left: 5px solid #4f8db3;
}

.events-list .event-date {
    margin: 3px 0;
    padding: 2px 10px;
    border-left: 5px solid #CFCFCF;
    -webkit-transition: all .25s linear;
    -moz-transition: all .25s linear;
    -o-transition: all .25s linear;
    -ms-transition: all .25s linear;
    transition: all .25s linear;
}

.events-list .event-date .event-day {
    color: #808080;
    font-size: 1.5em;
    font-weight: 600;
    text-align: center;
}

.events-list .event-date .event-month {
    color: #CFCFCF;
    font-size: 1.1em;
    font-weight: 600;
    text-align: center;
}

.events-list .event-date .event-venue,
.events-list .event-date .event-price {
    white-space: nowrap;
}

/*--------------------------------------------------------------------------
+   Jobs list Style
--------------------------------------------------------------------------*/

.jobs-list {
    width: 100%;
    border-bottom: 1px dotted #42b0cd;
}

.jobs-list th {
    font-size: 15px;
    text-align: left;
    padding: 40px 5px 10px 0px;
    color: #828282;
}

.jobs-list td {
    padding: 10px 20px 10px 0;
    border-top: 1px solid #E6E6E6;
}

.jobs-list tr:last-child td {
    border-bottom: 1px solid #E6E6E6;
}

.job-position a {
    color: #535b60;
    font-size: 1.1em;
}

.job-location,
.job-type {
    font-size: 15px;
}

.join-us-promo blockquote {
    margin: 0;
    padding: 0;
    border-left: none;
}

.join-us-promo blockquote p {
    font-size: 1.1em;
    margin-bottom: 20px;
    line-height: 1.5;
}

.join-us-promo .author-info {
    font-weight: 400;
    font-size: 0.8em;
}

.join-us-promo .author-photo {
    text-align: center;
}

.join-us-promo .author-photo img {
    margin: auto;
    border: 5px solid #FFF;
    -webkit-border-radius: 70px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 70px;
    -moz-background-clip: padding;
    border-radius: 70px;
    background-clip: padding-box;
    -webkit-box-shadow: inset 0 1px #fff, 0 1px 2px #c8cfe6;
    -moz-box-shadow: inset 0 1px #fff, 0 1px 2px #c8cfe6;
    box-shadow: inset 0 1px #fff, 0 1px 2px #c8cfe6;
    color: inset 0 1px #fff, 0 1px 2px #c8cfe6;
}

.join-us-bubble {
    text-align: justify;
    -webkit-border-radius: 4px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 4px;
    -moz-background-clip: padding;
    border-radius: 4px;
    background-clip: padding-box;
    padding: 20px 20px 0 20px;
    margin-top: 30px;
    margin-bottom: 30px;
    background: #FFF;
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-shadow: inset 0 1px #fff, 0 0 4px #c8cfe6;
    -moz-box-shadow: inset 0 1px #fff, 0 0 4px #c8cfe6;
    box-shadow: inset 0 1px #fff, 0 0 4px #c8cfe6;
    color: inset 0 1px #fff, 0 0 4px #c8cfe6;
}

.join-us-bubble::after {
    background: #FFF;
    content: "\00a0";
    display: block;
    height: 20px;
    width: 20px;
    bottom: -10px;
    left: 45%;
    position: relative;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-box-shadow: inset 0 1px #fff, 1px 1px 1px #c8cfe6;
    -moz-box-shadow: inset 0 1px #fff, 1px 1px 1px #c8cfe6;
    box-shadow: inset 0 1px #fff, 1px 1px 1px #c8cfe6;
    color: inset 0 1px #fff, 1px 1px 1px #c8cfe6;
}

.job-details-wrapper p {
    text-align: justify;
}

.job-center {
    font-size: 0.9em;
    text-align: center;
}

/*--------------------------------------------------------------------------
+   Login/Register/Reset Password Forms Style
--------------------------------------------------------------------------*/

.basic-login {
    background: rgba(255, 255, 255, 0.8);
    padding: 20px 20px 10px 20px;
    -webkit-border-radius: 5px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px;
    -moz-background-clip: padding;
    border-radius: 5px;
    background-clip: padding-box;
    color: inset 0 1px #fff, 0 0 4px #c8cfe6;
}

.basic-login form {
    margin: 0;
}

.basic-login label {
    line-height: 30px;
    font-size: 15px;
    margin-bottom: 0px;
    letter-spacing: 2px;
}

.basic-login input[type="checkbox"] {
    margin-top: 4px;
    top: 2px;
}

.social-login p {
    text-align: center;
    font-size: 14px;
    font-style: italic;
    padding: 20px 0;
}

.social-login .social-login-buttons {
    text-align: center;
}

.social-login .social-login-buttons a {
    position: relative;
    display: inline-block;
    white-space: nowrap;
    height: 35px;
    line-height: 35px;
    padding-right: 15px;
    margin: 10px 5px;
    color: #fff;
    font-size: 1.1em;
    text-align: left;
    -webkit-border-radius: 3px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 3px;
    -moz-background-clip: padding;
    border-radius: 3px;
    background-clip: padding-box;
    -webkit-transition: opacity .2s linear;
    -moz-transition: opacity .2s linear;
    -o-transition: opacity .2s linear;
    -ms-transition: opacity .2s linear;
    transition: opacity .2s linear;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -o-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}

.social-login .social-login-buttons a:hover {
    opacity: 0.8;
    text-decoration: none;
}

.social-login .social-login-buttons a:before {
    content: '';
    display: block;
    position: absolute;
    top: 5px;
    width: 24px;
    height: 24px;
    background-image: url(../images/social-login.png);
    background-repeat: no-repeat;
}

.social-login .btn-facebook-login {
    padding-left: 35px;
    background-color: #6886bc;
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9ImdyYWQtdWNnZy1nZW5lcmF0ZWQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMCUiIHkxPSIwJSIgeDI9IjAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwIiBzdG9wLWNvbG9yPSIjNjg4NmJjIiBzdG9wLW9wYWNpdHk9IjEiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM0NjZjYTkiIHN0b3Atb3BhY2l0eT0iMSIvPjwvbGluZWFyR3JhZGllbnQ+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
    background-image: -moz-linear-gradient(top, #6886bc 0, #466ca9 100%);
    background-image: -webkit-linear-gradient(top, #6886bc 0, #466ca9 100%);
    background-image: -o-linear-gradient(top, #6886bc 0, #466ca9 100%);
    background-image: linear-gradient(top, #6886bc 0, #466ca9 100%);
}

.social-login .btn-twitter-login {
    padding-left: 45px;
    background-color: #25b6e6;
}

.social-login .btn-facebook-login:before {
    left: 10px;
    background-position: 0 0;
}

.social-login .btn-twitter-login:before {
    left: 15px;
    background-position: -48px 0;
}

.social-login .not-member p {
    font-size: 1.5em;
    font-weight: 600;
    font-style: normal;
    margin-top: 30px;
    border-top: 1px solid #CCC;
}

/*--------------------------------------------------------------------------
+   'In Press' Style
--------------------------------------------------------------------------*/

.in-press a {
    color: #a0a7ac;
    font-size: 1.3em;
    font-family: 微軟正黑體, Georgia, serif;
    line-height: 28px;
    position: relative;
    padding-left: 16px;
    padding-bottom: 32px;
    margin-bottom: 15px;
    display: block;
    -webkit-transition: color .25s linear;
    -moz-transition: color .25s linear;
    -o-transition: color .25s linear;
    -ms-transition: color .25s linear;
    transition: color .25s linear;
}

.in-press a:hover {
    color: #4f8db3;
    text-decoration: none;
}

.in-press a:after {
    content: '';
    display: block;
    position: absolute;
    bottom: -10px;
    right: 20px;
    width: 120px;
    height: 32px;
    background-image: url(../images/in-press.png);
    background-repeat: no-repeat;
    -webkit-transition: .25s linear;
    -moz-transition: .25s linear;
    -o-transition: .25s linear;
    -ms-transition: .25s linear;
    transition: .25s linear;
}

.in-press a:before {
    content: "\201C";
    margin-left: -16px;
    font-size: 2.2em;
}

.press-wired a:after {
    background-position: 0px 0px;
}

.press-wired a:hover:after {
    background-position: 0px -32px;
}

.press-mashable a:after {
    background-position: -120px 0px;
}

.press-mashable a:hover:after {
    background-position: -120px -32px;
}

.press-techcrunch a:after {
    background-position: -240px 0px;
}

.press-techcrunch a:hover:after {
    background-position: -240px -32px;
}

/*--------------------------------------------------------------------------
+   Portfolio Style
--------------------------------------------------------------------------*/

.portfolio-item {
    position: relative;
    background: #FFF;
    margin-bottom: 20px;
    border: 8px solid #FFF;
    -webkit-border-radius: 5px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px;
    -moz-background-clip: padding;
    border-radius: 5px;
    background-clip: padding-box;
    -webkit-box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    -moz-box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    color: inset 0 1px #fff, 0 0 8px #c8cfe6;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    -ms-transition: all .5s ease;
    transition: all .5s ease;
}

.portfolio-item .portfolio-image {
    overflow: hidden;
    text-align: center;
    position: relative;
}

.portfolio-item .portfolio-image img {
    max-width: 100%;
    -webkit-transition: all .25s ease;
    -moz-transition: all .25s ease;
    -o-transition: all .25s ease;
    -ms-transition: all .25s ease;
    transition: all .25s ease;
}

.portfolio-item:hover {
    border: 8px solid #4f8db3;
}

.portfolio-item:hover .portfolio-image img {
    position: relative;
    -webkit-transform: scale(1.1) rotate(2deg);
    -moz-transform: scale(1.1) rotate(2deg);
    -o-transform: scale(1.1) rotate(2deg);
    -ms-transform: scale(1.1) rotate(2deg);
    transform: scale(1.1) rotate(2deg);
}

.portfolio-item ul {
    list-style-type: none;
    margin-left: 0;
    margin-top: 20px;
    text-align: center;
    padding: 0;
}

.portfolio-item ul li {
    line-height: 28px;
}

.portfolio-item .portfolio-project-name {
    font-size: 1.3em;
    text-transform: uppercase;
}

.portfolio-item .read-more {
    text-align: center;
    padding-top: 10px;
}

.portfolio-item .portfolio-info-fade {
    -webkit-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    top: 0;
    position: absolute;
    background: #000;
    background: rgba(0, 0, 0, 0.7);
    width: 100%;
    height: 100%;
    color: #FFF;
    text-shadow: 2px 2px 4px #000000;
    filter: dropshadow(color=#000000, offx=2, offy=2);
    -webkit-transition: opacity .25s linear;
    -moz-transition: opacity .25s linear;
    -o-transition: opacity .25s linear;
    -ms-transition: opacity .25s linear;
    transition: opacity .25s linear;
}

.portfolio-item .portfolio-info-fade ul {
    margin-top: 10%;
}

.portfolio-item .portfolio-info-fade .btn:hover {
    background: #4f8db3;
}

.portfolio-item .portfolio-info-fade ul {
    margin: 10% 20px 0 20px;
    padding: 0;
}

.portfolio-item .portfolio-info-fade ul li {
    text-align: center;
}

.portfolio-item .portfolio-info-fade ul li:first-child {
    border-bottom: 1px solid #CCC;
}

.portfolio-item:hover .portfolio-info-fade {
    display: block;
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
}

.lt-ie9 .portfolio-info-fade {
    display: none;
}

.lt-ie9 .portfolio-item:hover .portfolio-info-fade {
    display: block;
}

.portfolio-visit-btn {
    padding-top: 15px;
}

.portfolio-item-description ul {
    padding: 0;
}

/*--------------------------------------------------------------------------
+   Our Team Style
--------------------------------------------------------------------------*/

.team-member {
    position: relative;
    background: #FFF;
    margin-bottom: 20px;
    border: 8px solid #FFF;
    -webkit-box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    -moz-box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    box-shadow: inset 0 1px #fff, 0 0 8px #c8cfe6;
    color: inset 0 1px #fff, 0 0 8px #c8cfe6;
}

.team-member img {
    max-width: 100%;
}

.team-member ul {
    list-style-type: none;
    margin-left: 0;
    margin-top: 20px;
}

.team-member ul li {
    line-height: 28px;
}

.team-member:hover .team-member-image {
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
}

.team-member .team-member-image {
    text-align: center;
    position: relative;
    -webkit-transition: opacity .25s linear;
    -moz-transition: opacity .25s linear;
    -o-transition: opacity .25s linear;
    -ms-transition: opacity .25s linear;
    transition: opacity .25s linear;
    -webkit-opacity: 0.85;
    -moz-opacity: 0.85;
    opacity: 0.85;
}

.team-member .team-member-name {
    font-size: 1.3em;
    text-transform: uppercase;
}

.team-member .team-member-social {
    position: absolute;
    right: 0;
    -webkit-opacity: 0.5;
    -moz-opacity: 0.5;
    opacity: 0.5;
    -webkit-transition: opacity .25s linear;
    -moz-transition: opacity .25s linear;
    -o-transition: opacity .25s linear;
    -ms-transition: opacity .25s linear;
    transition: opacity .25s linear;
}

.team-member .team-member-social .team-member-social i {
    margin-top: 3px;
}

.team-member .team-member-social:hover {
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
}

/*--------------------------------------------------------------------------
+   Sitemap Style
--------------------------------------------------------------------------*/

.sitemap {
    margin-left: 0;
    list-style-type: none;
    padding: 0;
}

.sitemap a {
    color: #535b60;
}

.sitemap li {
    padding: 10px 0;
    font-weight: 600;
}

.sitemap ul {
    list-style-type: none;
    margin-top: 10px;
    margin-left: 10px;
    padding: 0;
}

.sitemap ul li {
    padding: 3px 0;
    font-size: 0.9em;
    font-weight: 400;
}

/*--------------------------------------------------------------------------
+   Coming Soon Page Style
--------------------------------------------------------------------------*/

.coming-soon-top {
    background: #FFF;
    background: rgba(255, 255, 255, 0.8);
    min-height: 80px;
}

.coming-soon-top .logo-wrapper {
    padding-top: 20px;
}

.coming-soon-content {
    margin-top: 5%;
    text-align: center;
}

.coming-soon-content h3 {
    font-size: 3em;
    line-height: 1.3em;
    font-weight: 400;
    color: #FFF;
    text-shadow: 1px 1px 8px #000000;
}

.coming-soon-content p {
    color: #E6E6E6;
    text-shadow: 2px 2px 4px #000000;
}

.coming-soon-subscribe {
    padding-top: 30px;
}

.coming-soon-subscribe .btn {
    border-radius: 0 5px 5px 0;
}

.coming-soon-subscribe p {
    margin-top: 10px;
}

.coming-soon-social {
    margin-top: 60px;
    -webkit-opacity: 0.7;
    -moz-opacity: 0.7;
    opacity: 0.7;
    -webkit-transition: opacity .25s linear;
    -moz-transition: opacity .25s linear;
    -o-transition: opacity .25s linear;
    -ms-transition: opacity .25s linear;
    transition: opacity .25s linear;
}

.coming-soon-social a {
    display: inline-block;
}

.coming-soon-social:hover {
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
}

.full-screen-background {
    z-index: -999;
    min-height: 100%;
    min-width: 1024px;
    width: 100%;
    height: auto;
    position: fixed;
    top: 0;
    left: 0;
}

/*--------------------------------------------------------------------------
+   Breadcrumbs Section Style
--------------------------------------------------------------------------*/

.section-breadcrumbs {
    background: #222;
    background: url("../images/004.jpg");
    background-position: center;
    padding: 100px 0 !important;
    background-repeat: no-repeat;
}

.section-breadcrumbs h1 {
    color: #212121;
    font-size: 28px;
    margin-bottom: 0;
    text-transform: none;
    letter-spacing: 5px;
    margin-top: 0;
}

.section-breadcrumbs h3 {
    font-size: 14px;
    margin-bottom: 0;
    color: #464646;
    padding: 5px 2px;
    margin-top: 0;
}

/*--------------------------------------------------------------------------
    Footer Style
--------------------------------------------------------------------------*/

.footer {
    background: #575757;
    color: #3a3a3a;
    padding: 0px 20px;
    font-size: 14px;
    /*border-top: 4px solid #971885;*/
    margin-top: 40px;
    -webkit-box-shadow: 0 -1px 12px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0 -1px 12px rgba(0, 0, 0, 0.4);
    box-shadow: 0 -1px 12px rgba(0, 0, 0, 0.4);
    color: 0 -1px 12px rgba(0, 0, 0, 0.4);
    width: 100%;
    bottom: 0;
}

.footer h3 {
    color: #fff;
    font-size: 20px;
    border-bottom: 1px dotted #fff;
    padding: 0 0 10px 0;
}

.footer ul {
    padding: 0;
}

.footer-navigate-section {
    margin: 20px 0;
}

.footer-navigate-section a {
    padding: 0;
    line-height: 28px;
    color: #fff;
    letter-spacing: 1px;
    font-size: 16px;
}

.footer-navigate-section a:hover {
    color: #ffe322!important;
}

.footer-navigate-section li {
    line-height: 20px !important;
}

.footer-stay-connected a {
    text-align: left;
    text-indent: -9999px;
    display: block;
    width: 115px;
    height: 40px;
    background: url(../images/stay-connected.png);
    -webkit-opacity: 0.5;
    -moz-opacity: 0.5;
    opacity: 0.5;
    -webkit-transition: opacity .25s linear;
    -moz-transition: opacity .25s linear;
    -o-transition: opacity .25s linear;
    -ms-transition: opacity .25s linear;
    transition: opacity .25s linear;
}

.footer-stay-connected a:hover {
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
}

.footer-stay-connected a.facebook {
    background-position: -115px 0;
}

.footer-stay-connected a.twitter {
    background-position: -230px 0;
}

.footer-stay-connected a.googleplus {
    background-position: 0 0;
}

.footer-stay-connected li {
    text-align: center;
}

.footer-copyright {
    text-align: center;
    color: #fff;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 16px;
    letter-spacing: 2px;
}

.col-footer{
    height: auto !important;
}

/*--------------------------------------------------------------------------
+   Pagination Style (overrides Bootstrap style)
--------------------------------------------------------------------------*/

.pagination-wrapper {
    margin-top: 15px;
    text-align: center;
}

.pagination > li > a,
.pagination > li > span {
    border: none;
    border-bottom: 3px solid #FFF;
    color: #666666;
    margin-left: 0;
    margin-bottom: 5px;
    -webkit-transition: all .25s linear;
    -moz-transition: all .25s linear;
    -o-transition: all .25s linear;
    -ms-transition: all .25s linear;
    transition: all .25s linear;
    font-size: 16px;
}

.pagination > li > a:hover,
.pagination > li > a:focus,
.pagination > .active > a,
.pagination > .active > span {
    background: #FFF;
}

.pagination > li > a:hover {
    border-bottom: 3px solid #666666;
}

.pagination > .active > a,
.pagination > .active > span {
    color: #666666;
    border-bottom: 3px solid #4f8db3;
}

.pagination > .disabled > a {
    border-color: #fff;
}

.pagination > .disabled > span,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
    margin-bottom: 0;
    color: #C9C9C9;
    background-color: #FFF;
    cursor: default;
}

/*--------------------------------------------------------------------------
+   Custom Style for Maps
--------------------------------------------------------------------------*/

.leaflet-popup-content-wrapper {
    -webkit-border-radius: 5px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px;
    -moz-background-clip: padding;
    border-radius: 5px;
    background-clip: padding-box;
}

/*--------------------------------------------------------------------------
+   Custom Style for Tabs (overrides Bootstrap)
--------------------------------------------------------------------------*/

.nav-tabs > li > a {
    font-size: 1.1em;
    padding: 10px 15px;
    color: #535b60;
}

.nav-tabs > .active > a,
.nav-tabs > .active > a:hover,
.nav-tabs > .active > a:focus {
    font-weight: 600;
    background-color: #ffffff;
    border: 1px solid #ddd;
    border-top: 3px solid #4f8db3;
    border-bottom-color: transparent;
    cursor: default;
}

/*--------------------------------------------------------------------------
+   404 Page Style
--------------------------------------------------------------------------*/

.error-page-wrapper {
    font-size: 1.5em;
    font-weight: 600;
    margin: 100px 0;
    text-align: center;
}

/*--------------------------------------------------------------------------
+   Homepage Slider Style (modified sequencejs CSS). Sorry, no LESS here
--------------------------------------------------------------------------*/

#sequence {
    overflow: hidden;
    width: 100%;
    max-width: 1920px;
    color: white;
    font-size: 0.625em;
    margin: 0 auto 30px auto;
    position: relative;
    height: 400px;
}

#sequence img {
    max-width: 100%;
}

#sequence > .sequence-canvas {
    list-style-type: none;
    height: 400px;
    margin: 0;
    padding: 0;
    width: 100%;
}

#sequence h2 {
    font-size: 4em;
    color: #FFF;
    text-shadow: 2px 2px 3px #444;
    border: none;
    padding-left: 0;
    margin-top: 0;
}

#sequence h3 {
    font-size: 2em;
    color: #FFF;
    text-shadow: 2px 2px 3px #444;
}

#sequence > .sequence-canvas > li {
    position: absolute;
    width: 100%;
    height: 400px;
    z-index: 1;
    -webkit-transition-property: background;
    -moz-transition-property: background;
    -o-transition-property: background;
    -ms-transition-property: background;
    transition-property: background;
    background-position: -50px 0;
}

#sequence > .sequence-canvas > li img {
    height: 96%;
}

#sequence > .sequence-canvas li > a > * {
    position: absolute;
    -webkit-transition-property: left, opacity;
    -moz-transition-property: left, opacity;
    -o-transition-property: left, opacity;
    -ms-transition-property: left, opacity;
    transition-property: left, opacity;
}

.sequence-next,
.sequence-prev {
    color: white;
    cursor: pointer;
    display: none;
    font-weight: bold;
    padding: 10px 15px;
    position: absolute;
    top: 50%;
    z-index: 1000;
    height: 75px;
    margin-top: -47.5px;
}

.sequence-pause {
    bottom: 0;
    cursor: pointer;
    position: absolute;
    z-index: 1000;
}

.sequence-paused {
    -webkit-opacity: 0.3;
    -moz-opacity: 0.3;
    opacity: 0.3;
}

.sequence-prev {
    left: 3%;
}

.sequence-next {
    right: 3%;
}

.sequence-prev img,
.sequence-next img {
    height: 100%;
    width: auto;
}

#sequence-preloader {
    background: #d9d9d9;
}

.sequence-pagination-wrapper {
    position: absolute;
    bottom: 10px;
    right: 20px;
    z-index: 99;
}

.sequence-pagination {
    display: none;
    z-index: 99;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.sequence-pagination li {
    display: inline-block;
    *display: inline;
    width: 14px;
    height: 14px;
    margin: 0 4px;
    text-indent: -999em;
    border: 4px solid #4f8db3;
    cursor: pointer;
    -webkit-border-radius: 30px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 30px;
    -moz-background-clip: padding;
    border-radius: 30px;
    background-clip: padding-box;
    -webkit-opacity: 0.8;
    -moz-opacity: 0.8;
    opacity: 0.8;
    -webkit-transition: background .5s, opacity .5s;
    -moz-transition: background .5s, opacity .5s;
    -o-transition: background .5s, opacity .5s;
    -ms-transition: background .5s, opacity .5s;
    transition: background .5s, opacity .5s;
}

.sequence-pagination li.current {
    background: #4f8db3;
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
}

.sequence-next,
.sequence-prev {
    position: absolute;
    opacity: 0.6;
    -webkit-transition-duration: 1s;
    -moz-transition-duration: 1s;
    -o-transition-duration: 1s;
    transition-duration: 1s;
}

.sequence-next:hover,
.sequence-prev:hover {
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
    -webkit-transition-duration: 1s;
    -moz-transition-duration: 1s;
    -o-transition-duration: 1s;
    transition-duration: 1s;
}

#sequence .title {
    font-size: 3.8em;
    text-transform: none;
    left: 0%;
    width: 35%;
    -webkit-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    bottom: 60%;
    z-index: 50;
}

#sequence > .sequence-canvas > li.animate-in {
    background-position: 0 0;
    -webkit-transition-duration: 1.5s;
    -moz-transition-duration: 1.5s;
    -o-transition-duration: 1.5s;
    transition-duration: 1.5s;
}

#sequence .animate-in .title {
    left: 15%;
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

#sequence .animate-out .title {
    left: 35%;
    -webkit-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.subtitle {
    color: black;
    font-size: 2em;
    left: 35%;
    width: 35%;
    -webkit-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    top: 40%;
}

.animate-in .subtitle {
    left: 15%;
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.animate-out .subtitle {
    left: 65%;
    -webkit-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-transition-duration: 0.5s;
    -moz-transition-duration: 0.5s;
    -o-transition-duration: 0.5s;
    transition-duration: 0.5s;
}

.slide-img {
    left: 90%;
    top: 20%;
    -webkit-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    position: relative;
    height: auto !important;
    max-height: 450px !important;
    max-width: 45% !important;
}

.animate-in .slide-img {
    left: 55%;
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1;
    -webkit-transition-duration: 1s;
    -moz-transition-duration: 1s;
    -o-transition-duration: 1s;
    transition-duration: 1s;
}

.animate-out .slide-img {
    left: 15%;
    -webkit-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    -webkit-transition-duration: 1s;
    -moz-transition-duration: 1s;
    -o-transition-duration: 1s;
    transition-duration: 1s;
}

.responsive-login {
    display: none;
}

.navbar-nav {
    margin: 0 -15px;
}

/*--------------------------------------------------------------------------
+   Content Slider Style (bxSlider CSS), Sorry, no LESS here
--------------------------------------------------------------------------*/

.bx-wrapper {
    position: relative;
    margin: 0 auto 30px;
    padding: 0;
    *zoom: 1;
}

.bx-wrapper img {
    max-width: 100%;
    display: block;
}

.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
    position: absolute;
    bottom: -30px;
    width: 100%;
}

/* LOADER */

.bx-wrapper .bx-loading {
    min-height: 50px;
    background: url(../images/bx_loader.gif) center center no-repeat #fff;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2000;
}

/* PAGER */

.bx-wrapper .bx-pager {
    text-align: center;
    font-size: .85em;
    font-family: 微軟正黑體, Arial;
    font-weight: bold;
    color: #666;
    padding-top: 20px;
}

.bx-wrapper .bx-pager .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
    display: inline-block;
    *zoom: 1;
    *display: inline;
}

.bx-wrapper .bx-pager.bx-default-pager a {
    background: #666;
    text-indent: -9999px;
    display: block;
    width: 10px;
    height: 10px;
    margin: 0 5px;
    outline: 0;
    -webkit-border-radius: 5px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px;
    -moz-background-clip: padding;
    border-radius: 5px;
    background-clip: padding-box;
}

.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active {
    background: #000;
}

/* DIRECTION CONTROLS (NEXT / PREV) */

.bx-wrapper .bx-prev {
    left: 10px;
    background: url(../images/controls.png) no-repeat 0 -32px;
}

.bx-wrapper .bx-next {
    right: 10px;
    background: url(../images/controls.png) no-repeat -43px -32px;
}

.bx-wrapper .bx-prev:hover {
    background-position: 0 0;
}

.bx-wrapper .bx-next:hover {
    background-position: -43px 0;
}

.bx-wrapper .bx-controls-direction a {
    position: absolute;
    top: 50%;
    margin-top: -16px;
    outline: 0;
    width: 32px;
    height: 32px;
    text-indent: -9999px;
    z-index: 9999;
}

.bx-wrapper .bx-controls-direction a.disabled {
    display: none;
}

/* AUTO CONTROLS (START / STOP) */

.bx-wrapper .bx-controls-auto {
    text-align: center;
}

.bx-wrapper .bx-controls-auto .bx-start {
    display: block;
    text-indent: -9999px;
    width: 10px;
    height: 11px;
    outline: 0;
    background: url(../images/controls.png) -86px -11px no-repeat;
    margin: 0 3px;
}

.bx-wrapper .bx-controls-auto .bx-start:hover,
.bx-wrapper .bx-controls-auto .bx-start.active {
    background-position: -86px 0;
}

.bx-wrapper .bx-controls-auto .bx-stop {
    display: block;
    text-indent: -9999px;
    width: 9px;
    height: 11px;
    outline: 0;
    background: url(../images/controls.png) -86px -44px no-repeat;
    margin: 0 3px;
}

.bx-wrapper .bx-controls-auto .bx-stop:hover,
.bx-wrapper .bx-controls-auto .bx-stop.active {
    background-position: -86px -33px;
}

/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
    text-align: left;
    width: 80%;
}

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
    right: 0;
    width: 35px;
}

/* IMAGE CAPTIONS */

.bx-wrapper .bx-caption {
    position: absolute;
    bottom: 0;
    left: 0;
    background: #666 \9;
    background: rgba(80, 80, 80, 0.75);
    width: 100%;
}

.bx-wrapper .bx-caption span {
    color: #fff;
    font-family: 微軟正黑體, Arial;
    display: block;
    font-size: .85em;
    padding: 10px;
}

/*--------------------------------------------------------------------------
+   Main Menu Style
--------------------------------------------------------------------------*/

.mainmenu li.logo-wrapper a {
    border-right: 1px solid #E8E8E8;
    padding-left: 0;
    padding-top: 0;
    padding-bottom: 0;
}

.mainmenu-wrapper {
    background-color: #FFF;
    border-bottom: 4px solid #4f8db3;
    z-index: 4;
}

.mainmenu {
    width: 100%;
    /* general ul style */
    /* first level ul style */
    /* sub-menu */
}

.mainmenu ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.mainmenu > ul,
.mainmenu .mainmenu-submenu-inner {
    margin: 0 auto;
}

.mainmenu > ul > li,
.mainmenu .mainmenu-submenu-inner > li {
    display: inline-block;
    *display: inline;
}

.mainmenu > ul > li > a,
.mainmenu .mainmenu-submenu-inner > li > a {
    font-size: 1.2em;
    padding: 1.2em 0.7em;
    color: #999;
    display: inline-block;
    text-decoration: none;
}

.mainmenu > ul > li > a:hover,
.mainmenu .mainmenu-submenu-inner > li > a:hover {
    color: #4f8db3;
    text-decoration: none;
}

.mainmenu > ul > li.active > a,
.mainmenu .mainmenu-submenu-inner > li.active > a {
    color: #4f8db3;
    font-weight: 600 !important;
}

.mainmenu > ul > li.mainmenu-open a,
.mainmenu .mainmenu-submenu-inner > li.mainmenu-open a,
.mainmenu > ul li.mainmenu-open > a:hover,
.mainmenu .mainmenu-submenu-inner li.mainmenu-open > a:hover {
    color: #fff;
    background: #4f8db3;
}

.mainmenu .mainmenu-submenu {
    display: none;
    position: absolute;
    background: #4f8db3;
    width: 100%;
    left: 0;
    z-index: 999;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -o-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0 5px 5px rgba(0, 0, 0, 0.4);
    box-shadow: 0 5px 5px rgba(0, 0, 0, 0.4);
    color: 0 5px 5px rgba(0, 0, 0, 0.4);
}

.mainmenu .mainmenu-submenu-inner > div {
    width: 33%;
    float: left;
}

.mainmenu .mainmenu-submenu-inner:before,
.mainmenu .mainmenu-submenu-inner:after {
    content: " ";
    display: table;
}

.mainmenu .mainmenu-submenu-inner:after {
    clear: both;
}

.mainmenu .mainmenu-submenu-inner > div a {
    line-height: 2em;
}

.mainmenu-open .mainmenu-submenu {
    display: block;
    padding-bottom: 3em;
}

.mainmenu-submenu h4 {
    color: #bad2e1;
    padding: 1em 0 0.6em;
    margin-left: 20px;
    font-size: 160%;
    font-weight: 300;
}

.mainmenu-submenu ul {
    margin-left: 20px;
}

/*--------------------------------------------------------------------------
+   Extras Menu (Cart, Language, Login) Style
--------------------------------------------------------------------------*/

.menuextras {
    font-size: 0.85em;
    height: 30px;
}

.menuextras ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    float: right;
    padding: 3px 0;
}

.menuextras li {
    float: left;
    padding: 0 8px;
}

.menuextras .extras li {
    padding: 0 8px;
}

.menuextras .extras li a {
    color: #333;
}

.menuextras .extras li a:hover {
    color: #333;
    text-decoration: none;
}

.menuextras .extras .shopping-cart-items i {
    color: #333;
}

.menuextras .choose-country .dropdown-menu {
    background-color: #222;
    background-color: rgba(34, 34, 34, 0.8);
    margin-top: 5px;
}

.menuextras .choose-country .dropdown-menu li {
    float: none;
}

.menuextras .choose-country .dropdown-menu li a {
    color: #fff;
    padding-left: 3px;
}

.menuextras .choose-country .dropdown-menu li a:hover {
    color: #fff;
    background-color: #333 !important;
}

/*--------------------------------------------------------------------------
+   Buttons Style
--------------------------------------------------------------------------*/

.btn {
    border: 1px solid #35a037;
    -webkit-border-radius: 2px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 2px;
    -moz-background-clip: padding;
    border-radius: 2px;
    background-clip: padding-box;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    text-transform: none;
    -webkit-transition: all .25s ease;
    -moz-transition: all .25s ease;
    -o-transition: all .25s ease;
    -ms-transition: all .25s ease;
    transition: all .25s ease;
    text-align: center;
    background: none repeat scroll 0 0 #35a037;
    text-shadow: none;
    box-shadow: none;
    color: #FFF;
    white-space: nowrap;
    padding: 15px 0;
    font-size: 18px;
    font-family: 微軟正黑體;
    font-weight: 700;
    border-radius: 5px !important;
}

.btn:hover {
    background: none repeat scroll 0 0 #277a29;
    color: #FFF !important;
    text-decoration: none;
    border: 1px solid #277a29;
}

.btn .caret {
    border-top: 4px solid #FFF;
}

.btn-micro {
    padding: 1px 8px;
    font-size: 10px;
}

.btn-grey {
    border: 1px solid #cecece;
    color: #333;
    background: none repeat scroll 0 0 #E7E7E7;
}

.btn-grey:hover {
    background: none repeat scroll 0 0 #FF7600;
    color: #fff !important;
    text-decoration: none;
    border: 1px solid #cecece;
}

.btn-grey .caret {
    border-top: 4px solid #333;
}

.btn-blue {
    border: 1px solid #3e7191;
    color: #FFF;
    background: none repeat scroll 0 0 #4F8DB3;
}

.btn-blue:hover {
    background: none repeat scroll 0 0 #3b3c41;
    color: #FFF;
    text-decoration: none;
    border: 1px solid #3b3c41;
}

.btn-orange {
    border: 1px solid #ef9547 !important;
    color: #FFF;
    background: none repeat scroll 0 0 #ff861e;
    text-shadow: 1px 1px 0px #b86d11;
    border-radius: 5px !important;
    font-size: 22px;
    font-weight: 700;
    min-width: 200px;
    letter-spacing: 5px;
}

.btn-orange:hover {
    background: none repeat scroll 0 0 #e87814;
    color: #FFF;
    text-decoration: none;
    border: 1px solid #e87814;
}

.btn-green {
    border: 1px solid #4c5818;
    color: #FFF;
    background: none repeat scroll 0 0 #6E8023;
}

.btn-green:hover {
    background: none repeat scroll 0 0 #3b3c41;
    color: #FFF;
    text-decoration: none;
    border: 1px solid #3b3c41;
}

.btn-red {
    border: 1px solid #ab0d0d;
    color: #FFF;
    background: none repeat scroll 0 0 #DA1111;
}

.btn-red:hover {
    background: none repeat scroll 0 0 #3b3c41;
    color: #FFF;
    text-decoration: none;
    border: 1px solid #3b3c41;
}

.btn-group.open .btn.dropdown-toggle {
    background: none repeat scroll 0 0 #3b3c41;
    color: #FFF;
}

.dropdown.open a.dropdown-toggle .caret {
    color: #ffffff;
}

.btn-full {
    width: 100%;
}

hr {
    border-top: 1px solid #D4D4D4;
}

.checkbox {
    /*padding-left: 20px;*/
}

.pull-center{
    display: table;
    margin-left: auto;
    margin-right: auto;
}

.btn-width{
    width: 100%;
}


.form-control {
    padding: 2px 5px;
    border: none;
    box-shadow: none;
    border: 1px solid #89c48a;
    border-radius: 3px;
    margin-bottom: 25px;
    text-transform:uppercase;
}

.form-sign {
    width: 100%;
    padding: 3px 5px;
    font-size: 16px;
    border: none;
    box-shadow: none;
    border: 1px solid #89c48a;
    height: 35px;
    margin-bottom: 20px;
    border-radius: 3px;
}

.form-drop {
    width: 100%;
    padding: 3px 5px;
    border: none;
    box-shadow: none;
    border: 1px solid #89c48a;
    margin-bottom: 20px;
    height: 35px;
    border-radius: 3px;
    font-size: 16px;
    font-family: 微軟正黑體;
    background: #fff;
}

.form-update {
    width: 100%;
    padding: 1px 0 1px 0;
    border: none;
    box-shadow: none;
    border-radius: 0;
    margin-bottom: 20px;
}

.radio-inline {
    margin-bottom: 13px;
}

textarea.form-sign {
    height: auto !important;
    border: 1px solid #ababab !important;
    padding: 5px;
}

textarea:hover.form-sign {
    border: none;
    box-shadow: none !important;
    border: 1px solid #505050 !important;
}

.for-drop{
    padding-left: 0;
}

.for-zipcode{
    padding-right: 0;
    padding-left: 0;
}

.required b {
    color: #F00;
    padding: 0 0 0 3px;
}

.text-overflow {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 240px;
}

.disable {
    padding: 6px 10px !important;
}

.navbar {
    border-radius: 0px;
    margin-bottom: 0px;
}

.navbar-inverse {
    background-color: #026d04;
    border-bottom: 4px solid #35a037 !important;
    font-size: 16px;
}

.logo-wrapper {
    padding-top: 3px;
}

.responsive-logo {
    max-width: 225px;
}

.navbar-inverse .navbar-nav > li > a {
    /*color: #272727;*/
    color: white;
    font-size: 18px;
}

.navbar-inverse .navbar-nav > li > a:focus, .navbar-inverse .navbar-nav > li > a:hover {
    color: #ffffff !important;
    background-color: #35a037;
}

.navbar-inverse .navbar-nav>.active>a, .navbar-inverse .navbar-nav>.active>a:focus, .navbar-inverse .navbar-nav>.active>a:hover {
    color: #ffffff !important;
    background-color: #35a037;
}

.navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:focus, .navbar-inverse .navbar-nav > .open > a:hover {
    color: #fff !important;
    background-color: #35a037 !important;
}

.navbar-inverse {
    border-color: rgba(255, 255, 255, 0);
    border: none;
}

.navbar-inverse .navbar-toggle {
    border-color: #197b95;
    margin-right: 5px;
}

.navbar-toggle {
    background-color: #35a037;
    padding: 8px 6px;
}

.navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover {
    background-color: #52ad54;
}

.carousel {
    position: relative;
    margin-top: 53px;
}

ul li ul.dropdown-menu {
    min-width: 125px;
    /* Set width of the dropdown */
    background: #35a037;
    display: none;
    position: absolute;
    z-index: 999;
    left: 0;
    padding: 0;
}

.dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover {
    color: #ffffff !important;
    text-decoration: none;
    background-color: #026d04;
}

ul li:hover ul.dropdown-menu {
    /*display: block;*/
    /* Display the dropdown */
}

ul li ul.dropdown-menu li {
    display: block;
}

.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 3px;
    margin-top: -3px;
    vertical-align: middle;
    border-top: 6px dashed;
    border-top: 4px solid \9;
    border-right: 6px solid transparent;
    border-left: 6px solid transparent;
    color: #026d04;
}

.product-details {
    margin-bottom: 15px;
}

.for-input{
    /*margin-bottom: 20px !important;*/
}

#selectToolbar {
    position: relative;
    display: table;
}

#selectToolbar > div {
    display: table-cell;
}

#selectToolbar .btn-group {
    vertical-align: inherit;
}

.btn-green2 {
    border: 1px solid #4c5818;
    color: #FFF;
    background: none repeat scroll 0 0 #00A65A;
}

.btn-orange2 {
    border: 1px solid #cecece;
    color: #fff;
    background: none repeat scroll 0 0 #FF7600;
}

.btn-orange2:hover {
    background: none repeat scroll 0 0 #FF0000;
    color: #fff !important;
    text-decoration: none;
    border: 1px solid #cecece;
}

.margin {
    margin: 10px;
}

#loading-image {
    background-image: url(../images/loading-gif.gif);
    background-repeat: no-repeat;
    background-size: contain;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 9999;
    max-width: 300px;
    max-height: 300px;
    margin: auto;
}

/*--加分題--*/
.sub-box {
    border: 1px solid #CCC;
    border-radius: 5px;
    background: #FFFFFF;
    padding: 10px 0;
}

.down-style {
    width: 90%;
    height: 30px;
    padding: 0px 10px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.carousel-control.right {
    right: 0;
    left: auto;
    background-image: -webkit-linear-gradient(left, rgba(255, 255, 255, .0001) 0, rgba(255, 255, 255, .5) 100%);
    background-image: -o-linear-gradient(left, rgba(255, 255, 255, .0001) 0, rgba(255, 255, 255, .5) 100%);
    background-image: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, .0001)), to(rgba(255, 255, 255, .5)));
    background-image: linear-gradient(to right, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0.5) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);
    background-repeat: repeat-x;
}

.carousel-control.left {
    background-image: -webkit-linear-gradient(left, rgba(255, 255, 255, .5) 0, rgba(255, 255, 255, .0001) 100%);
    background-image: -o-linear-gradient(left, rgba(255, 255, 255, .5) 0, rgba(255, 255, 255, .0001) 100%);
    background-image: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, .5)), to(rgba(255, 255, 255, .0001)));
    background-image: linear-gradient(to right, rgba(255, 255, 255, .5) 0, rgba(255, 255, 255, .0001) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
    background-repeat: repeat-x;
}

.h1bottom {
    margin-bottom: 15px;
}

.thumbnail {
    display: inline-block;
    margin-bottom: 20px;
    padding: 0 0 7px 0;
    width: 100%;
    border: none;
    background-color: transparent;
    border-radius: 0;
    -webkit-transition: border .2s ease-in-out;
    -o-transition: border .2s ease-in-out;
    transition: border .2s ease-in-out;
}

.thumbnail img {
    padding-top: 0px;
}

.thumbnail a > img, .thumbnail > img {
    margin-right: 0;
    margin-left: 0;
    width: 100%;
}

.thumbnail
.caption {
    padding: 0 12px 7px 12px;
    background-color: #eee;
}

.caption h3 {
    margin: 0;
    font-size: 20px;
    color: #232323;
    text-align: center;
}

.caption p {
    text-align: center;
}

.btn-download {
    margin-left: 10px;
    border: 1px solid #ef9547;
    -webkit-border-radius: 2px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 2px;
    -moz-background-clip: padding;
    border-radius: 2px;
    background-clip: padding-box;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    text-transform: none;
    -webkit-transition: all .25s ease;
    -moz-transition: all .25s ease;
    -o-transition: all .25s ease;
    -ms-transition: all .25s ease;
    transition: all .25s ease;
    text-align: center;
    background: none repeat scroll 0 0 #ef9547;
    text-shadow: none;
    box-shadow: none;
    color: #FFF;
    white-space: nowrap;
}

.btn-download:hover {
    background: none repeat scroll 0 0 #e87814;
    color: #FFF !important;
    text-decoration: none;
    border: 1px solid #e87814;
}

.form-group {
    margin-bottom: 0;
}

.form-group b {
    color: #df2222;
    background: #f9ff9f;
    padding: 2px 5px;
}

.login-width {
    width: 100%;
    margin-top: 20px;
    letter-spacing: 10px;
}

.btn-default.active.focus, .btn-default.active:focus, .btn-default.active:hover, .btn-default:active.focus, .btn-default:active:focus, .btn-default:active:hover, .open > .dropdown-toggle.btn-default.focus, .open > .dropdown-toggle.btn-default:focus, .open > .dropdown-toggle.btn-default:hover {
    color: #ffffff;
    background-color: #2b6488;
    border-color: #2b6488;
}

.for-checkbox-rememberme {
    display: table;
}

.checkbox, .radio {
    margin-top: 0px;
    margin-bottom: 0px;
}

.no-padding {
    padding: 0 !important;
}

.navbar-collapse.in {
    overflow-y: visible;
}

.menu-login {
    float: right;
    padding: 15px 5px;
    color: white;
}

.menu-login a{
    color: white;
}

.login-center {
    float: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

.list-group {
    margin-bottom: 40px !important;
}

.list-group-contact {
    margin-bottom: 0px !important;
}

.for-title {
    display: block;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background-color: rgba(255, 255, 255, 0.7);
    padding: 20px 40px 20px 280px !important;
    color: #ffffff;
    font-weight: normal;
    line-height: 1.3;
    white-space: nowrap;
}

.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {
    max-height: 400px;
}

.no-padding-left {
    padding-left: 0 !important;
}

.no-padding-right {
    padding-right: 0 !important;
}

.ind-con {
    margin: 20px 0;
}

.index-header {
    border-bottom: 50px solid #971885;
    border-right: 50px solid transparent;
    position: relative;
    width: 300px;
    margin-bottom: 20px;
}

.index-hea-text {
    position: absolute;
    margin-top: 10px;
    padding-left: 20px;
}

.index-hea-text h1 {
    color: #efefef;
}

.news-list {
    /*padding-right: 20px;*/
    position: relative;
    margin-bottom: 20px;
}

.news-list img {
    width: 100%;
}

.news-list img:hover {
    -ms-transform: scale(1.1, 1.1);
    -webkit-transform: scale(1.1, 1.1);
    transform: scale(1.1, 1.1);
    transition: all .3s ease;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    opacity: 0.8;
}

.news-bg {
    overflow: hidden;
}

.news-text {
    position: absolute;
    background-color: rgba(29, 29, 29, 0.69);
    width: 100%;
    z-index: 2;
    bottom: 0;
    left: 0;
    padding: 15px 20px;
}

.news-list h5 {
    font-size: 20px;
    color: #FFFFFF;
    margin: 0;
    margin-bottom: 8px;
    font-weight: 600;
    line-height: 24px;
}

.news-list h6 {
    font-size: 12px;
    color: #FFFFFF;
    margin: 0;
    margin-bottom: 5px;
}

.news-list p {
    font-size: 14px;
    color: #ffffff;
    line-height: 18px;
    margin: 0;
    letter-spacing: 2px;
}

.connect-link a{
    font-size: 20px;
}

.connect-link ul{
    margin-bottom: 40px;
    padding-bottom: 40px;
}

.connect-link li {
    float: left;
    list-style-type:none;
}

.connect-link li a span:before {
    content: "/";
    margin-right: 13px;
    padding-left: 30px;
    color: #ababab;
}

/*==================================
    for-col-5
================================= */
.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;
}

/*==================================
    signup
================================= */

.table-s{
    width: 100%;
}

.table-s thead{
    border-bottom: 2px solid #971885;
    line-height: 40px;
    font-size: 16px;
    color: #000000;
}

.table-s th, td{
    text-align: center;
}

.table-s tbody>tr{
    border-bottom: 1px dotted #ababab;
}

.table-s td{
    line-height: 55px;
    font-size: 16px;
    color: #3a3a3a;
    border: none;
}

.passornot{
    border: none !important;
}

.passornot td{
    border-top:2px solid #ababab;
    color: #ff0000;
    font-weight: bold;
}

.asignup{
    background-color: #4f8db3;
    padding: 5px 10px;
    color: #ffffff;
    border-radius: 5px;
}

.asignup:hover {
    background-color: #2b6488;
    color: #ffffff !important;
    text-decoration: none;
}


/*==================================
    item
================================= */
.item{
    margin-bottom: 20px;
}

.item tr{
    margin-bottom: 10px;
}

.item th{
    border-bottom: 1px solid #ffffff;
    padding: 0 18px;
    background: #a9629f;
    color: #ffffff;
}

.item td{
    padding: 0 10px;
    padding-right: 0;
    text-align: left;
}

.item td>a{
    padding: 5px 8px;
    background: #4f8db3;
    color: #ffffff;
    border-radius: 5px;
}

.item td>a:hover{
    background: #2b6488;
    color: #ffffff !important;
}

/*==================================
    news
================================= */

.news-form {
    width: 100%;
    margin-bottom: 40px;
}

.news-form tr {
    border-bottom: 1px dotted #ababab;
}

.news-form th{
    width: 15%;
    padding: 10px 20px;
    text-align: center;
    border: none;
}

.news-form td{
    width: 85%;
    padding: 10px;
    text-align: left;
    border: none;
}

/*==================================
    foreverycontent
================================= */

.foreverycontent{
    padding: 0 15px;
    margin-bottom: 40px;
}


/*==================================
    news-content
================================= */
.news-con{

}

.news-con h6{
    text-align: right;
}

.news-con p{
    text-align: justify;
    font-size: 14px;
}

.news-con br{
    line-height: 40px;
}

.news-con img{
    width: 100%;
    margin: 20px 0;
}

.news-back{
    float: right;
}

/*==================================
    work
================================= */

.work-con{

}

.work-form{
    width: 100%;
    margin-bottom: 20px;
}

.work-form th{
    background: #a9629f;
    border: 1px solid #ababab;
    color: #ffffff;
    padding: 5px 0;
}

.work-form td{
    border: 1px solid #ababab;
    padding: 5px;
}

.work-form tr:nth-child(odd){
    background: #ffffff;
}

.work-form tr:nth-child(even){
    background: #eeeeee;
}

.work-form2{
    width: 100%;
    margin-bottom: 20px;
}

.work-form2 th, .work-form2 td{
    line-height: 32px;
}


.work-form2 th{
    padding-left: 5px;
}

.work-download{
    width: 100%;
    margin-bottom: 20px;
}

.work-download th {
    background: #a9629f;
    color: #ffffff;
    text-align: center;
    padding: 5px 0;
    border: 1px solid #ababab;
}

.work-download td{
    background: #ffffff;
    text-align: center;
    padding: 5px 0;
    border: 1px solid #ababab;
}

/*==================================
    check
================================= */

.check-zone h4{
    margin-bottom: 0px;
    padding: 5px;
    font-size: 20px;
    font-weight: bold;
    background: #35a037;
    color: #fff;
    border-radius: 5px 5px 0 0;
    text-align: center;
}

.check-zone h4 a{
    color: #fff;
    letter-spacing: 2px;
}

.check{
    width: 100%;
    margin-bottom: 20px;
    border: 2px solid #35a037 !important;
}

.check tr{
    border-bottom: 1px solid #9ecbd6;
}

.check th{
    width: 30%;
    padding: 8px 8px;
    font-size: 15px;
    font-family: 微軟正黑體;
    color: #686868;
    background: #e8ffe8;
    text-align: center;
}

.check td{
    width: 70%;
    text-align: left;
    padding: 8px;
    font-size: 16px;
    font-family: 微軟正黑體;
    color: #026d04;
    font-weight: 700;
}

.btn-yes{
    float: right;
}

.check-drop {
    width: 100%;
    padding: 7px 2px;
    border: none;
    box-shadow: none;
    border-bottom: 1px solid #ababab;
    border-radius: 0;
    margin-bottom: 10px;
}



/*==================================
    slider
================================= */

.fill{
    background-repeat: no-repeat;
    height: 300px;
    background-position: 50% 0%;
}



/*==================================
    parking
================================= */

.parking{
    width: 283px;
    height: 425px;
    background: url("../images/back.jpg");
}

.parking img{
    display: block;
    margin: 0 auto;
    padding-top: 50px;
}

.parking h1{
    text-align: center;
    padding: 20px 0;
    margin: 0;
    font-size: 48px;
    color: #114097;
}

.parking table{
    margin-left: auto;
    margin-right: auto;
}

.parking th, td{
    font-size: 20px;
    line-height: 32px;
    color: #000000;
}

.parking td{
    text-align: left;
    padding-top: 4px;
}

.parking h3{
    text-align: right;
    padding-right: 20px;
    margin: 0;
    font-size: 18px;
    color: #000000;
}


/*==================================
    park
================================= */


.park{
    width: 283px;
    height: 425px;
    background: url("../images/parking.jpg");
    position: relative;
}

.park h3{
    position: absolute;
    bottom: 0;
    right: 0;
    padding-right: 20px;
    padding-bottom: 60px;
    margin: 0;
    font-size: 18px;
    color: #000000;
}

/*==================================
    log-in
================================= */
.login-error{
    padding: 0 35px;
}


.login-error p{
    color: #ff0000;
    font-size: 14px;
}


.sign-up {
    padding: 20px;
    margin-bottom: 20px;
}


.sign-up p{
    text-align: center;
}

/*==================================
    receipt
================================= */
.receipt p{
    text-align: center;
    margin-bottom: 0;
}


/*==================================
    桃園區長青學苑
================================= */
.bg-little{
    background: url(../images/bg-little.png) repeat center top;
}

/*==================================
    基本設定
================================= */

.text-center{
    text-align: center;
}

.float-r{
    float: right !important;
}

.p-bottom15{
    padding-bottom: 15px !important;
}

.p-bottom30{
    padding-bottom: 30px !important;
}

.haha-bottom{
    padding: 10px 20px;
}

.m-top15{
    margin-top: 15px !important
}

.m-bottom15{
    margin-bottom: 15px !important
}

.m-bottom30{
    margin-bottom: 30px !important
}

.no-padding-left-right{
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.no-padding-left{
    padding-left: 0px !important;
}

.bg-y{
    background: #fff2bb!important;
}

.bg-y2{
    background: #ffd724!important;
}

.bg-b{
    background: #eeffe7!important;
}

.bg-b2{
    background: #66cdfb!important;
}

.bg-gray{
    background: #efefef!important;
}

.uppercase{
    text-transform:uppercase;
}

.btn-b{
    background: #35a037;
    border: 1px solid #234d7c !important;
    color: #FFF;
    text-shadow: 1px 1px 0px #073363;
    border-radius: 5px !important;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 5px;
    padding: 15px 10px;
}


/*==================================
    首頁-最新消息
================================= */


.home-new-style h1{
    color: #212121;
}

.home-new-style h1:before {
    content: "";
    background: url(../images/h1.svg)no-repeat 0 0;
    width: 30px;
    height: 30px;
    display: inline-block;
    position: relative;
    top: 5px;
    margin: 0 15px 0 0;
}

.new-style ul {
    margin-bottom: 15px;
}

.new-style ul li{
    padding: 10px 0;
    border-bottom: 1px solid #799cb5 !important;
    font-size: 18px;
    font-weight: 900;
    color: #2c2c2c;
}

.new-style ul li a{
    color: #2c2c2c;
    font-family: 微軟正黑體;
}

.new-style ul li a:hover{
    color: #35a037!important;
}

.new-style ul li span {
    padding: 0 20px;
    font-family: monospace;
    color: #026d04;
    letter-spacing: 3px;
}

.new-more a{
    border: 3px solid #35a037 !important;
    color: #35a037;
    font-weight: 900;
    padding: 4px 10px;
    letter-spacing: 3px;
}

.new-more a:hover{
    background: #35a037;
    color: #fff !important;
}

.home-botton img{
    width: 100%;
}

/*==================================
    footer
================================= */

.footer-map{
    background: #eaeaea;
    padding: 10px;
    border: 1px #5f5f5f dashed!important;
    border-radius: 5px;
}

.footer-map span{
    font-weight: 900;
    color: #35a037;
    letter-spacing: 2px;
}

.copyright{
    background: #026d04;
}

/*==================================
    報名表
================================= */

.focus p{
    background: #fd7474;
    text-shadow: 1px 1px 0px #8e4646;
    text-align: center;
    color: #fff;
    font-size: 18px;
    padding: 2px;
    font-weight: 900;
    margin-top: 15px;
    margin-bottom: 30px;
    border-radius: 3px;
    letter-spacing: 5px;
}

.focus2 {
    border-top: 1px dashed #989898;
    padding-top: 20px;
}

.focus2 p{
    text-align: center;
    background-color: #f5d3d3;
    color: #272727;
    font-weight: 600;
    font-family: 微軟正黑體;
}

.focus2 p span{
    color: #fd0505;
    padding: 0 5px;
}

/*==================================
    報名表-第二頁表格
================================= */
.apply-style{
    border: 2px solid #939393 !important;
}

.apply-style>tbody>tr>td>p{
    line-height: initial!important;
    margin: 5px!important;
    font-weight: 700;
    letter-spacing: 2px;
    font-size: 18px;
    color: rgb(70, 70, 70);
    text-shadow: 0px 0px 0px #ffffff;
}

.apply-style>tbody>tr>td>i{
    position: relative;
    left: 0px;
    top: 6px;
}

.apply-style>tbody>tr>td{
    vertical-align: middle;
    font-size: 20px;
    border: 1px solid #939393 !important;
    color: #171717;
}

.apply-style>tbody>tr:nth-of-type(odd) {
    background-color: #fff !important;
    background: #fff !important;
}

.apply-style>thead:first-child>tr:first-child>th {
    border: 2px solid #939393 !important;
    background-color: #efefef !important;
    color: #000 !important;
    text-shadow: 1px 1px 0px #fff !important;
    letter-spacing: 2px;
    font-size: 17px;
    font-weight: 300;
}

.apply-style>thead>tr>th>h1 {
margin: 0px!important
}

.focus3 {
    border-top: 1px dashed #989898;
    padding-top: 20px;
}

.focus3 p{
    border: 1px solid #9f2c2c !important;
    padding: 10px;
    background-color: #f5d3d3;
    color: #272727;
    font-weight: 600;
    font-family: 微軟正黑體;
    font-size: 18px;
}

.focus3 i{
    position: relative;
    top: 4px;
    font-size: 20px;
    color: #eb4949;
    padding-right: 10px;
}

.focus3 span{
    padding-left: 30px;
}

.focus3 h3{
    margin: 0;
    padding: 10px;
    background: #9f2c2c;
    color: #fff;
}

.focus3 small{
    color: #df2222;
    font-size: 16px;
    background: #f9ff9f;
    padding: 2px 5px;
}

/*==================================
    登入
================================= */

/*==================================
    報名紀錄
================================= */

.check-title p{
    background: #35a037;
    text-shadow: 1px 1px 0px #0d4584;
    text-align: center;
    color: #fff;
    font-size: 18px;
    padding: 7px;
    font-weight: 900;
    margin-top: 15px;
    margin-bottom: 15px;
    border-radius: 3px;
    letter-spacing: 5px;
}

/*==================================
    課程資訊
================================= */

.course-box h3{
    text-align: center;
    background: #35a037;
    color: #fff;
    padding: 5px 0 5px 0;
}

.course-box{
    border: 2px solid #35a037 !important;
}

.course-box h4{
    border-bottom: 1px solid #c6c6c6 !important;
    margin-top: 0px;
    margin-bottom: 10px;
    padding-top: 3px;
    padding-bottom: 4px;
    font-size: 16px;
    font-weight: 400;
    color: #4f4f4f;
    letter-spacing: 1px;;
}

.course-box table{
    border: 2px solid #35a037;
}

.course-box table tbody tr td {
    font-size: 16px;
    vertical-align: middle;
    border: 1px solid #9ecbd6;
    color: #474747;
    font-weight: 700;
}

.table-striped>thead:first-child>tr:first-child>th {
    border-top: 0;
    border: 1px solid #9ecbd6;
    border-bottom: 2px solid #35a037;
    vertical-align: middle;
    text-align: center;
    background-color: #35a037;
    color: #fff;
    text-shadow: 1px 1px 0px #3f879a;
    letter-spacing: 2px;
    font-size: 17px;
    font-weight: 300;
}

.table-striped>tbody>tr:nth-of-type(odd) {
    background-color: #f9f9f9;
    background: #ecf5f9;
}

.tb-bg-y {
    background: #ffa425!important;
    color: #fff !important;
    text-shadow: 1px 1px 0px #c17306;
}

.tb-bg-g {
    background: #119c6d!important;
    color: #fff !important;
    text-shadow: 1px 1px 0px #0c6b4b;
}

.course-time{
    font-size: 14px !important;
    color: #0c4079 !important;
}

/*報名按鈕-藍色*/
.course-a1{
    background: #35a037;
    color: #fff;
    font-size: 18px;
    padding: 4px 15px;
    border-radius: 3px !important;
    text-shadow: 1px 1px 0px #10427a;
    font-weight: 100;
    box-shadow: 1px 1px 3px 0px #002d39;
    line-height: 30px;
}

.course-a1:hover{
    background: #35a037;
    text-shadow: 1px 1px 0px #1a7992;
    box-shadow: 1px 1px 3px 0px #bcf0ff;
    color: #fff !important;
}


/*額滿按鈕-灰色*/
.course-a2{
    background: #ababab;
    color: #fff;
    font-size: 18px;
    padding: 4px 15px;
    border-radius: 3px !important;
    text-shadow: 1px 1px 0px #838383;
    font-weight: 100;
    box-shadow: 1px 1px 3px 0px #080808;
    line-height: 30px;
}

.course-a2:hover{
    background: #8c8c8c;
    color: #fff !important;
    text-shadow: 1px 1px 0px #838383;
    box-shadow: 1px 1px 3px 0px #dddddd;
}

/*已報名按鈕-橘色*/
.course-a3 {
    background: #ff8816;
    color: #fff;
    font-size: 18px;
    padding: 4px 15px;
    border-radius: 3px !important;
    text-shadow: 1px 1px 0px #f47000;
    font-weight: 100;
    box-shadow: 1px 1px 3px 0px #504841;
    line-height: 30px;
}

.course-a3:hover {
    background: #ffa752;
    text-shadow: 1px 1px 0px #ff8816;
    box-shadow: 1px 1px 3px 0px #ffcb99;
    color: #fff !important;
}
/*分類標題Tag*/
.course_tag {
    padding: 8px 16px;
    margin-bottom: 15px;
    background: #026d04;
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 2px;
    text-align: center;
}
/*==================================
    課程資訊-內頁
================================= */

.panel-default {
    border-color: #e8e8e8;
}

ul, ol, dl {
    list-style-position: outside;
}

dl {
    margin-top: 0;
    margin-bottom: 20px;
}

.dl-horizontal{
    border: 3px solid #35a037;
    background: #dbe7ea;
}

.dl-horizontal dt {
    float: left;
    width: 100px;
    padding: 10px 10px 10px 0;
    overflow: hidden;
    clear: left;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
    background: #dbe7ea;
}

.dl-horizontal dd, dt {
    font-family: 'Open Sans', sans-serif, 微軟正黑體;
    line-height: 35px;
    font-size: 16px;
    letter-spacing: 1px;
}

.dl-horizontal dd {
    margin-left: 100px;
    padding: 10px 10px 0px 10px;
    border-left: 1px solid #88bbc8;
    background: #ffffff;
}

.bg-mid-gray2 {
    border-bottom: 1px solid #88bbc8;
    height: 1px;
    overflow: hidden;
}

.no-margin-lr {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.course2 h1{
    color: #003d68;
    font-size: 25px;
}

.course2 h1:before {
    content: "";
    background: url(../images/h1.svg)no-repeat 0 0;
    background-size: contain;
    width: 25px;
    height: 25px;
    display: inline-block;
    position: relative;
    top: 5px;
    margin: 0 10px 0 0;
}

.btn-gray{
    border: 1px solid #c0c0c0 !important;
    color: #FFF;
    background: none repeat scroll 0 0 #a3a3a3;
    text-shadow: 1px 1px 0px #888888;
    border-radius: 5px !important;
    padding: 15px 100px;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: 5px;
}

.btn-gray:hover, .btn-gray:focus{
    border: 1px solid #c0c0c0 !important;
    color: #FFF!important;
    background: none repeat scroll 0 0 #a3a3a3;
    text-shadow: 1px 1px 0px #888888;
}
/*==================================
    活動花絮 - 列表
================================= */
.album_wrapper .album_title {
    margin-bottom:  0;
    padding:  10px 0;
}
.album_wrapper .img {
    width: 100%;
    padding: 0;
    /*padding-top: $rh / $rw * $width;*/
    padding-top: calc(380 / 570 * 100%) ;
    background-size: cover;
    overflow: hidden;
    background-position: center center;
    background-repeat: no-repeat !important;
    z-index: 1;
}
.album_wrapper .block:hover .img{
    opacity: 0.8;
}

/*==================================
    活動花絮 - 內頁
================================= */

/*==================================
    responsive
================================= */

@media screen and (min-width: 1920px) {
    .for-title {
        padding: 20px 40px 20px 394px !important;
    }
    .fill{
        background-position: center;
    }
}

@media screen and (max-width: 1199px) {
    .btn-download {
        margin-left: 5px;
    }
}

@media screen and (min-width: 1200px) {
    .col-lg-1-5 {
        width: 20%;
        float: left;
    }
}

@media screen and (max-width: 1024px) {

    .fill {
        background-repeat: no-repeat;
        height: 230px;
        background-position: 50% 0%;
        background-size: cover;
    }

}

@media screen and (min-width: 992px) {
    #sequence .title {
        width: 42%;
    }
}

@media screen and (max-width: 991px) {
    .for-footer {
        padding-bottom: 620px;
    }

    .navbar-inverse .navbar-nav > li > a {
        padding: 15px 10px;
    }

}

@media screen and (max-width: 979px) {
    .mainmenu {
        font-size: 0.8em;
    }

    .mainmenu-submenu {
        font-size: 1.2em;
    }

    .mainmenu-submenu li,
    .mainmenu-submenu h4 {
        padding-left: 10px;
    }
}

@media screen and (max-width: 838px) {
    #sequence .slide-img {
        max-height: 530px !important;
        width: auto;
    }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
    .col-sm-1-5 {
        width: 33%;
        float: left;
    }

}

@media screen and (min-width: 768px) and (max-width: 991px) {

    .btn-download {
        margin-left: 0px;
        /*margin-top: 5px;*/
    }
}

@media screen and (min-width: 768px) {

    .md-p-no-left{
        padding-left: 0px;
    }

    .pricing-plan {
        width: 25%;
        margin: 20px 0;
        padding: 20px;
        -webkit-border-radius: 0;
        -webkit-background-clip: padding-box;
        -moz-border-radius: 0;
        -moz-background-clip: padding;
        border-radius: 0;
        background-clip: padding-box;
    }

    .pricing-plan:first-child {
        -webkit-border-top-left-radius: 7px;
        -moz-border-radius-topleft: 7px;
        border-top-left-radius: 7px;
        -webkit-border-bottom-left-radius: 7px;
        -webkit-background-clip: padding-box;
        -moz-border-radius-bottomleft: 7px;
        -moz-background-clip: padding;
        border-bottom-left-radius: 7px;
        background-clip: padding-box;
    }

    .pricing-plan:last-child {
        border-width: 2px;
        -webkit-border-top-right-radius: 7px;
        -moz-border-radius-topright: 7px;
        border-top-right-radius: 7px;
        -webkit-border-bottom-right-radius: 7px;
        -webkit-background-clip: padding-box;
        -moz-border-radius-bottomright: 7px;
        -moz-background-clip: padding;
        border-bottom-right-radius: 7px;
        background-clip: padding-box;
    }

    .pricing-plan-promote {
        background: #fff;
        padding: 40px;
        margin-top: 0;
        -webkit-border-radius: 7px;
        -webkit-background-clip: padding-box;
        -moz-border-radius: 7px;
        -moz-background-clip: padding;
        border-radius: 7px;
        background-clip: padding-box;
        z-index: 4;
    }
    /*nav*/
    .navbar-nav {
        /* Hover Dropdown */
    }
    /*.navbar-nav > li > a {
        text-align: center;
        z-index: 1001;
        white-space: nowrap;
        background-color: transparent;
        font-weight: 500;
        font-size: 16px;
    }*/
    .navbar-nav .dropdown > a {
        position: relative;
        padding-right: 24px;
    }
    .navbar-nav .dropdown > a:after {
        display: block;
        content: " ";
        position: absolute;
        width: 0;
        height: 0;
        right: 10px;
        top: calc(50% - 2px);
        border-color: transparent;
        border-style: solid;
        border-width: 5px 5px 0 5px;
        border-top-color: white; /*#026d04;*/
    }
     .navbar-nav .dropdown:nth-last-child(1) > .dropdown-menu {
        right: 0;
        left: unset;
    }
     .navbar-nav .dropdown-menu {
        top: calc(100% + 0px);
        left: 0;
        border-width: 0px;
        border-radius: 0;
        min-width: 160px;
        z-index: 1001;
    }
    .navbar-nav .dropdown-menu > li > a {
        padding: 10px 15px;
        font-size: 18px;
        background-color: transparent;
    }
    .navbar-nav .dropdown-menu > li > a:hover {
        background-color: #52ad54;
    }
     .navbar-nav .dropdown-menu .menu_scroll {
        max-height: 500px;
        overflow-y: auto;
        direction: rtl;
    }
     .navbar-nav .dropdown-menu .menu_scroll > li > a {
        display: block;
        padding: 10px 15px;
        font-size: 16px;
        background-color: transparent;
        clear: both;
        font-weight: 400;
        line-height: 1.42857143;
        white-space: nowrap;
    }
     .navbar-nav .dropdown-menu .scroll_style::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
        background-color: #f5f5f5;
    }
     .navbar-nav .dropdown-menu .scroll_style::-webkit-scrollbar {
        width: 6px;
        background-color: #f5f5f5;
    }
     .navbar-nav .dropdown-menu .scroll_style::-webkit-scrollbar-thumb {
        background-color: rgba(72, 54, 40, 0.5);
        border: 2px solid rgba(72, 54, 40, 0.3);
    }
     .navbar-nav .dropdown-submenu > .dropdown-menu {
        top: 0px;
        margin-top: 0;
        left: 100%;
        min-height: calc(100%);
    }
     .navbar-nav .dropdown-submenu > a {
        padding-right: 30px;
        position: relative;
    }
     .navbar-nav .dropdown-submenu > a:after {
        display: block;
        content: " ";
        position: absolute;
        width: 0;
        height: 0;
        right: 10px;
        top: calc(50% - 5px);
        border-color: transparent;
        border-style: solid;
        border-width: 5px 0 5px 5px;
        border-left-color: #026d04;
    }

    .navbar-nav .dropdown-submenu:hover > .dropdown-menu {
        display: block;
    }
    .dropdown-menu li:hover .sub-menu {visibility: visible;}
    .dropdown:hover > .dropdown-menu {display: block;}

}

@media screen and (max-width: 768px) {

    .sm-p-no-left-right{
    padding-left: 0px !important;
    padding-right: 0px !important;
    }

    #sequence {
        height: 400px;
    }

    #sequence .title {
        font-size: 2.8em;
    }

    #sequence .subtitle {
        font-size: 1.6em;
    }

    #sequence .sequence-next,
    #sequence .sequence-prev {
        height: 60px;
        margin-top: -40px;
    }

    #sequence .slide-img {
        max-height: 480px !important;
        width: auto;
    }

    .products-slider .shop-item {
        width: 34%;
    }

    .fill {
        background-repeat: no-repeat;
        height: 210px;
        background-position: 50% 0%;
        background-size: cover;
    }

    .form-horizontal .control-label {
        text-align: left;
    }
}

@media screen and (max-width: 767px) {

    .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
        color: #545454 !important;
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus, .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover {
        color: #ffffff !important;
        background-color: #770968;
    }
    /*.navbar-nav .open .dropdown-menu {
        position:  static;
        float: none;
        background: white;
    }*/
    .menu-login {
        display: none;
    }

    .responsive-login {
        display: block;
        float: right;
    }

    .responsive-login a{
        color: white;
    }

    .down-style{
        width: 100%;
    }

    .for-drop{
        padding: 0 !important;
    }

    .check{
        width: 100%;
    }

    .product-details {
        margin-bottom: 20px;
    }

    #confirm-btn {
        margin: 20px 0;
    }

}

@media screen and (max-width: 568px) {
    .slide-img {
        left: 50%;
        width: auto;
        max-width: 80% !important;
    }

    #sequence .animate-in .slide-img {
        left: 50%;
        margin-left: -40%;
    }

    #sequence .animate-out .slide-img {
        left: 20%;
        margin-left: -20%;
    }

    #sequence .title {
        background: #a1a1a1;
        background: rgba(0, 0, 0, 0.3);
        bottom: 0;
        left: 100%;
        padding: 4%;
        width: 100%;
        margin-bottom: 0;
        z-index: 10;
    }

    #sequence .animate-in .title {
        left: 0%;
    }

    #sequence .animate-out .title {
        left: -100%;
    }

    #sequence .subtitle {
        visibility: hidden;
    }

    .hidden-sign{
        display: none;
    }
}

@media screen and (max-width: 504px) {
    .btn-download {
        margin-left: 0px;
        margin-top: 0px;
    }
}

@media screen and (max-width: 500px) {
    .shopping-cart .image {
        display: none;
    }

    .cart-item-title {
        font-size: 0.8em;
    }
}

@media screen and (max-width: 494px) {
}

@media screen and (max-width: 479px) {
    .mainmenu {
        font-size: 120%;
        border: none;
    }

    .mainmenu > ul,
    .mainmenu .mainmenu-submenu-inner {
        width: 100%;
        padding: 0;
    }

    .mainmenu .mainmenu-submenu-inner {
        padding: 0 1.5em;
        font-size: 75%;
    }

    .mainmenu > ul > li {
        display: block;
        border-bottom: 4px solid #4f8db3;
    }

    .mainmenu > ul > li > a {
        display: block;
        padding: 1em 3em;
    }

    .mainmenu > ul > li:last-child {
        border: none;
    }

    .mainmenu .mainmenu-submenu {
        position: relative;
    }

    .mainmenu-submenu h4 {
        padding-top: 0.6em;
    }

    .mainmenu .mainmenu-submenu-inner > div {
        width: 100%;
        float: none;
        padding: 0;
    }

    .products-slider .shop-item {
        width: 100%;
    }
}

@media screen and (max-width: 767px) and (min-width: 425px) {

    .col-xs-1-5{
        width: 50%;
    }

}

@media screen and (max-width: 453px) {
    .btn-download {
        margin-left: 0px;
        margin-top: 5px;
    }

}

@media screen and (min-width: 425px) {
    .news-form th{
        width: 20%;
    }

    .news-form td{
        width: 80%;
        padding: 10px;
        text-align: left;
    }
}

@media screen and (max-width: 425px) {

    .for-title {
        padding: 20px 40px 20px 100px !important;
    }

    .news-res{
        padding: 0;
    }

    .fill {
        background-repeat: no-repeat;
        height: 140px;
        background-position: 50% 0%;
        background-size: cover;
    }

}

@media screen and (max-width: 424px) {

    .col-xs-1-5{
        width: 100%;
    }

    .btn-download {
        margin-top: 0px;
    }

}

@media screen and (max-width: 414px) {

    .index-header {
        width: 250px;
    }

}

@media screen and (max-width: 375px) {

    .new-style ul li {
        padding: 10px 4px;
        margin: 10px 0;
        border: 2px solid #89c48a !important;
        line-height: 26px;
    }

    .new-style ul li span {
        padding: 0 5px;
        margin-right: 5px;
        background: #fff495;
    }

    .btn-orange {
        padding: 15px 52px;
    }

    .for-footer {
        padding-bottom: 650px;
    }

    .fill {
        background-repeat: no-repeat;
        height: 130px;
        background-position: 50% 0%;
        background-size: cover;
    }
}

@media screen and (max-width: 320px) {



    .btn-orange {
        padding: 15px 52px;
    }

    .for-footer {
        padding-bottom: 730px;
    }

    .fill {
        background-position-x: -100px;
    }
}


/*==================================
    responsive end
================================= */

.responsive-login{
    padding: 12px 10px 0 5px;
}

.yes h1{
    text-align: center;
    font-size: 40px;
    color: #c80000;
    font-weight: 700;
}

.yes h2{
    text-align: center;
    font-size: 28px;
    color: #c80000;
    font-weight: 700;
}

.yas h3{
    border: 4px solid #ff5891;
}

.carousel-indicators .active {
    background-color: rgba(255, 255, 255, 0)!important;
}

.carousel-indicators li {
    border: 1px solid rgba(255, 255, 255, 0)!important;
}

/*首頁-網站選單 ul*/

.ul-style ul{
    margin: 30px 0 20px 0;
    display: inline;
}

.ul-style ul li{
    float: left;
    margin:10px 10px 15px 0;
    letter-spacing: 3px;
    list-style-type: none;
}

.ul-style ul li a {
    width: 190px;
    text-align: center;
    display: block;
    padding: 15px 0;
    background: #35a037;
    color: #fff;
    border: 3px solid #35a037 !important;
    font-size: 20px;
    font-weight: 900;
}

.ul-style ul li a:hover{
    color: #35a037 !important;
    background: #e8ffe8;
    border: 3px solid #35a037 !important;
}

.ul-style {
    border-top: 1px dashed #989898;
    margin-top: 40px;
    padding-top: 30px;
}

.course-h4{
    text-align: center;
    color: #E91E63;
    font-weight: 600;
}

/* 影音專區 */
.grid_videol .item{
    display: block;
    position: relative;
    padding: 8px;
    margin-bottom: 0;
}
.grid_videol .img_wrapper {
    border-radius: 0px;
    overflow: hidden;
    position: relative;
}
.grid_videol .img {
    width: 100%;
    padding: 0;
    padding-top: 55.625%;
    background-size: cover;
    overflow: hidden;
    background-position: center center;
    background-repeat: no-repeat !important;
    z-index: 1;
}
.grid_videol .content {
    padding: 15px 8px;
    background-color: #f8f8f8;
    transition: all 0.1s ease-in-out;
}
.grid_videol .title {
    height: auto;
    margin: 0;
    padding: 5px 0;
    font-weight: 700;
    overflow: hidden;
    line-height: 1.5em;
    max-height: 3em;
    white-space: normal;
    text-overflow: initial;
}
.grid_videol  .date {
    line-height: 1.5em;
    margin: 0;
}
.ic_youtube:before {
    position: absolute;
    content:"\f04b";
    font-family: FontAwesome;
    left: calc(0px);
    top: calc(50% - 30px);
    color: white;
    font-size: 55px;
    height: 1em;
    line-height: 1em;
    width: 100%;
    text-align: center;
    pointer-events: none;
    z-index: 2;
}
.ic_youtube:after {
    content: '';
    position: absolute;
    height: 100%;
    width: 100%;
    z-index: 1;
    top: 0;
    left: 0;
}

/* Mobile - js-offcanvas Menu (customs) */
.js-offcanvas {
    padding: 0;
    padding-top: 50px;
    left: 0;
    overflow-x: none;
    overflow-y: auto;
    background-color: #fff;
}
.js-offcanvas ul.navbar-nav {
    border-top: 1px solid rgba(0, 0, 0, 0.2);
}
.js-offcanvas ul.navbar-nav, .js-offcanvas .list-unstyled {
    margin: 0;
}
.js-offcanvas ul.navbar-nav li a, .js-offcanvas .list-unstyled li a {
    padding: 12px 16px;
    font-size: 16px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}
.js-offcanvas ul.navbar-nav li.open a, .js-offcanvas .list-unstyled li.open a, .js-offcanvas ul.navbar-nav li a:hover, .js-offcanvas .list-unstyled li a:hover, .js-offcanvas ul.navbar-nav li a:focus, .js-offcanvas .list-unstyled li a:focus {
    border-color: rgba(0, 0, 0, 0.2);
}
.js-offcanvas ul.navbar-nav > li, .js-offcanvas .list-unstyled > li {
    margin: 0;
}
.js-offcanvas ul.navbar-nav > li > a, .js-offcanvas .list-unstyled > li > a {
    color: #4d4d4d;
}
.js-offcanvas ul.navbar-nav > li > a, .js-offcanvas .list-unstyled > li > a, .js-offcanvas ul.navbar-nav > li.active > a, .js-offcanvas .list-unstyled > li.active > a, .js-offcanvas ul.navbar-nav > li.open > a, .js-offcanvas .list-unstyled > li.open > a, .js-offcanvas ul.navbar-nav > li > a:active, .js-offcanvas .list-unstyled > li > a:active, .js-offcanvas ul.navbar-nav > li.active > a:active, .js-offcanvas .list-unstyled > li.active > a:active, .js-offcanvas ul.navbar-nav > li.open > a:active, .js-offcanvas .list-unstyled > li.open > a:active, .js-offcanvas ul.navbar-nav > li > a:focus, .js-offcanvas .list-unstyled > li > a:focus, .js-offcanvas ul.navbar-nav > li.active > a:focus, .js-offcanvas .list-unstyled > li.active > a:focus, .js-offcanvas ul.navbar-nav > li.open > a:focus, .js-offcanvas .list-unstyled > li.open > a:focus {
    background: #fff;
}
.js-offcanvas ul.navbar-nav > .dropdown > a:after, .js-offcanvas .list-unstyled > .dropdown > a:after {
    display: block;
    content: " ";
    position: absolute;
    width: 0;
    height: 0;
    right: 10px;
    top: calc(50% - 5px);
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #35a037;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}
.js-offcanvas ul.navbar-nav > .dropdown.open > a:after, .js-offcanvas .list-unstyled > .dropdown.open > a:after {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}
.js-offcanvas ul.navbar-nav > .dropdown .dropdown-menu, .js-offcanvas .list-unstyled > .dropdown .dropdown-menu {
    margin-left: 0px;
    width: 100%;
    padding: 0;
    border-radius: 0px;
    overflow: hidden;
    background: #f2f2f2;
}
.js-offcanvas ul.navbar-nav > .dropdown .dropdown-menu *, .js-offcanvas .list-unstyled > .dropdown .dropdown-menu * {
    background: unset;
    transition-duration: 0s;
}
.js-offcanvas ul.navbar-nav > .dropdown .dropdown-menu > li > a, .js-offcanvas .list-unstyled > .dropdown .dropdown-menu > li > a {
    color: #4d4d4d !important;
    padding: 12px !important;
    border-left: 4px solid #35a037;
}
.js-offcanvas ul.navbar-nav > .dropdown .dropdown-menu .dropdown-submenu > .dropdown-menu, .js-offcanvas .list-unstyled > .dropdown .dropdown-menu .dropdown-submenu > .dropdown-menu {
    top: 0px;
    margin-top: 0;
    background: rgba(53, 160, 55, 0.04);
}
.js-offcanvas ul.navbar-nav > .dropdown .dropdown-menu .dropdown-submenu > .dropdown-menu a, .js-offcanvas .list-unstyled > .dropdown .dropdown-menu .dropdown-submenu > .dropdown-menu a {
    border-left-color: #1c531d;
    padding: 8px 12px !important;
}
.js-offcanvas ul.navbar-nav > .dropdown .dropdown-menu .dropdown-submenu > a, .js-offcanvas .list-unstyled > .dropdown .dropdown-menu .dropdown-submenu > a {
    padding-right: 30px;
    position: relative;
}
.js-offcanvas ul.navbar-nav > .dropdown .dropdown-menu .dropdown-submenu > a:after, .js-offcanvas .list-unstyled > .dropdown .dropdown-menu .dropdown-submenu > a:after {
    display: block;
    content: " ";
    position: absolute;
    width: 0;
    height: 0;
    right: 10px;
    top: calc(50% - 5px);
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #35a037;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}
.js-offcanvas ul.navbar-nav > .dropdown .dropdown-menu .dropdown-submenu.open > a:after, .js-offcanvas .list-unstyled > .dropdown .dropdown-menu .dropdown-submenu.open > a:after {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}
.js-offcanvas ul.navbar-nav > .dropdown.open > .dropdown-menu, .js-offcanvas .list-unstyled > .dropdown.open > .dropdown-menu {
    display: block;
}
.js-offcanvas ul.navbar-nav > .dropdown.open > a, .js-offcanvas .list-unstyled > .dropdown.open > a, .js-offcanvas ul.navbar-nav > .dropdown.open > a:hover, .js-offcanvas .list-unstyled > .dropdown.open > a:hover, .js-offcanvas ul.navbar-nav > .dropdown.open > a:focus, .js-offcanvas .list-unstyled > .dropdown.open > a:focus {
    border-color: rgba(0, 0, 0, 0.2);
}
.js-offcanvas ul.navbar-nav > .dropdown .caret:after, .js-offcanvas .list-unstyled > .dropdown .caret:after {
    color: #117ad5;
}
@media (min-width: 768px) {
    .js-offcanvas {
        display: none;
    }
}
.js-offcanvas.is-closed a {
    display: none;
}