﻿/**********************************************************************************************************************************/
/* THEME SPECIFIC STYLES **********************************************************************************************************/
/**********************************************************************************************************************************/
/* PAGE STRUCTURE ELEMENTS - PLACE YOUR OWN SITE STRUCTURE STYLES HERE ***********************************************************/


/* Smartphones (portrait and landscape) ----------- */

/*@media only screen and (min-device-width : 501px)
{
    .container
    {
        max-width: 1024px;
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media only screen and (max-device-width : 500px)
{
    .container
    {
        padding-left: 0px;
        padding-right: 0px;
    }
}*/


/*更多按鈕 2015/03/6 小唐*/
.btn-more
{
    border-top: 1px solid #fff;
    background: #8ec754;
    background: -webkit-gradient(linear, left top, left bottom, from(#8ec754), to(#6ea835 100%));
    background: -webkit-linear-gradient(top, #8ec754, #6ea835 100%);
    background: -moz-linear-gradient(top, #8ec754, #6ea835 100%);
    background: -ms-linear-gradient(top, #8ec754, #6ea835 100%);
    background: -o-linear-gradient(top, #8ec754, #6ea835 100%);
    color: #fff;
    font-size: 10px;
    float: right;
    padding: 2px 3px 0px 5px;
    position: relative;
    text-shadow: -0px 1px 2px #5b8d2b;
    margin: 5px;
}

    .btn-more:hover, .btn-more:focus
    {
        background: #6da835;
        cursor: pointer;
        color: #fff;
    }


/*FB按讚相關*/


.fbPluginPanelRow
{
    display: inline-block;
}

.fbSharePanel
{
    display: inline-block;
    height: 25px;
    vertical-align: middle;
}

    .fbSharePanel iframe
    {
        height: 25px;
        width: 55px;
    }

.fbFansText
{
    color: #DBDBDB;
    display: inline-block;
}

.fbLikePluginPanel
{
    display: inline-block;
    width: 80px;
    vertical-align: middle;
}

.fbSharePanel a
{
    text-decoration: none !important;
}
/*分隔線 2014/05/30 小唐*/
.divider
{
    background-color: #e5e5e5;
    height: 1px;
    margin: 9px 0;
    overflow: hidden;
}
/*分隔線 2014/07/01 小唐*/
.dividerGreen
{
    background-color: green;
    height: 2px;
    margin: 9px 0;
    overflow: hidden;
}
/*2013/12/17小修*/
/*image hover特效*/
.opacity75:hover
{
    opacity: 0.75;
}
/*select { 2013/12/12 小修
  height: 40px;
  line-height: 40px;
}*/


/*2015/06/12 小唐*/
h1, h2, h3, h4, h5, h6, p
{
    font-family: \5FAE\8EDF\6B63\9ED1\9AD4, Microsoft JhengHei, MingLiU, sans-serif; /*字型美化*/
}

header .navbar .header-aux
{
    font-size: 10px;
}

    /*header .navbar .header-aux > .container
    {
        position: relative;
    }

        header .navbar .header-aux > .container .span4 .btn
        {
            background: transparent;
            box-shadow: none;
            min-height: 30px;
            padding: 0 !important;
            text-align: right;
        }

            header .navbar .header-aux > .container .span4 .btn:after
            {
                color: white;
                content: "\f002";
                font-family: fontawesome;
                font-size: 20px;
                position: absolute;
                right: 0;
                text-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
                top: 4px;
            }*/

#Main
{
    padding: 20px 30px 40px;
}

footer
{
    margin: 0;
    padding: 70px 0;
    color: black;
    color: rgba(0, 0, 0, 0.5);
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
    font-size: 15px;
    font-weight: bold;
    bottom: 0;
    position: absolute;
    width: 100%;
}

    footer #FooterWidgets h1, footer #FooterWidgets h2, footer #FooterWidgets h3, footer #FooterWidgets h4, footer #FooterWidgets h5, footer #FooterWidgets h6
    {
        color: black;
        color: rgba(0, 0, 0, 0.5);
        text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
    }

    footer #FooterWidgets a
    {
        color: black;
        color: rgba(0, 0, 0, 0.5);
        text-shadow: 0 1px 0 rgba(255, 255, 255, 0.2);
    }

        footer #FooterWidgets a:hover
        {
            text-decoration: underline;
        }

    footer #FooterCopyright
    {
        font-size: 13px;
        margin-top: 30px;
    }

        footer #FooterCopyright > span
        {
            margin-right: 10px;
        }

.icon-rounded
{
    background: #eeeeee;
    border-radius: 900px;
    cursor: default;
    display: inline-block;
    font-size: 30px;
    height: 30px;
    line-height: 30px;
    padding: 30px;
    transition: all 0.1s linear;
    width: 30px;
}

    .icon-rounded:hover
    {
        background: #53493f;
        color: white;
    }

.widget-icons
{
    list-style: none;
    margin: 0;
    padding: 0;
}

    .widget-icons li
    {
        display: inline;
        margin: 0 5px;
        padding: 0;
    }

        .widget-icons li a
        {
            transition: opacity 0.1s;
        }

            .widget-icons li a:hover
            {
                opacity: 0.5;
                text-decoration: none !important;
            }

            .widget-icons li a .icon
            {
                font-size: 20px;
            }

.widget-list ul
{
    list-style: none;
    margin: 0;
    padding: 0;
}

    .widget-list ul li
    {
        border-bottom: 1px solid #dddddd;
        list-style: none;
        margin: 0;
        overflow: hidden;
        padding: 5px;
    }

        .widget-list ul li:last-child
        {
            border: none !important;
        }

        .widget-list ul li a
        {
            border-bottom: none;
            display: block;
            transition: all 0.1s ease;
        }

#FooterWidgets .widget-list ul li
{
    border-bottom: 1px solid black;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.highlight
{
    transition: 0.2s all;
}

    .highlight:hover
    {
        background-color: #53493f !important;
    }

        .highlight:hover h1, .highlight:hover h2, .highlight:hover h3, .highlight:hover h4, .highlight:hover h5, .highlight:hover h6, .highlight:hover p, .highlight:hover small, .highlight:hover li, .highlight:hover span, .highlight:hover div, .highlight:hover td
        {
            color: white;
        }

.accordion-group
{
    border: none;
    border-radius: 0;
}

    .accordion-group .accordion-heading .accordion-toggle
    {
        background: #f9f9f9;
        border-radius: 3px;
        color: inherit;
        padding: 8px 15px;
        text-decoration: none !important;
    }

        .accordion-group .accordion-heading .accordion-toggle:before
        {
            content: "\f055";
            display: inline-block;
            font-family: fontawesome;
            font-size: 16px;
            margin-right: 5px;
        }

        .accordion-group .accordion-heading .accordion-toggle:hover
        {
            background: #53493f;
            color: white;
        }

            .accordion-group .accordion-heading .accordion-toggle:hover:before
            {
                content: "\f056";
            }

.accordion-inner
{
    border-top: none;
}

.alert
{
    border: none;
    text-shadow: none;
}

blockquote p
{
    color: #999999;
    font-family: Cambria, Georgia, serif;
    font-size: 28px;
    font-style: italic;
    letter-spacing: -1px;
    line-height: 1.1em;
    position: relative;
}

blockquote small
{
    color: #aaaaaa;
}

    blockquote small:before, blockquote small :after
    {
        content: "";
    }
/*.btn,
input[type="submit"],
input[type="reset"],
input[type="button"],
button {
  box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.25) inset;
  font-size: 17px;
  padding: 15px 20px;
}*/
.btn-mini
{
    font-size: 10.5px !important;
    padding: 0 6px !important;
}

.btn-small
{
    font-size: 11.9px !important;
    padding: 2px 10px !important;
}

.btn-large
{
    border-radius: 6px;
    font-size: 22px !important;
    padding: 16px 22px !important;
}

.form-inline .btn
{
    padding: 5px 20px;
}

.btn-group > .btn, .btn-group > .dropdown-menu, .btn-group > .popover
{
    font-size: 12px;
}

.hero-unit
{
    border-bottom: 4px double #eeeeee;
    border-radius: 0;
    font-weight: 300;
    margin: 0 0 30px;
    padding: 20px;
    text-align: center;
}

    .hero-unit h1
    {
        font-size: 28px;
        margin-bottom: 0.2em;
    }

    .hero-unit p
    {
        letter-spacing: -1px;
        font-size: 22px;
    }

.modal
{
    border: none;
    border-radius: 0;
}
/*標題*/
.modal-title
{
    margin: 0;
    line-height: 1.428571429;
    color: darkgreen;
}

.modal .modal-blank
{
    padding: 10px 15px;
}

.modal .modal-block
{
    border-bottom: 2px solid green;
    background-color: #f4f4f4;
    margin-bottom: 10px;
    padding: 10px 15px;
}

.modal .modal-header
{
    border-bottom: 1px solid #eeeeee;
    padding: 9px 15px;
}

.modal .modal-body
{
    border-bottom: 3px solid #fcfcfc;
    border-top: 3px solid #fcfcfc;
}
/*產品頁-了解更多modal標題 2014/10/07 小唐*/
.modal-body h1
{
    font-size: 16px;
}

.modal .modal-footer
{
    background-color: white;
    border-radius: 0;
    border-top: 1px solid #eeeeee;
    box-shadow: none;
}
/*.nav-tabs > li > a {
	color: inherit;
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
}*/


.nav-tabs > li > a
{
    color: inherit;
    font-size: 13px;
    text-transform: uppercase;
    padding: 2px 10px 5px 10px;
    border-bottom: none;
}

.nav-tabs
{
    border-bottom: 1px solid #e7e7e7;
    margin: 0px 20px;
    color: #808080;
}

    .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus
    {
        border: 1px solid #e7e7e7;
        border-bottom-color: transparent;
        color: #66cc66 !important;
    }

    .nav-tabs > li > a:hover, .nav-tabs > li > a:focus
    {
        background-color: #f9f9f9;
        border-color: #f9f9f9 #f9f9f9 #dddddd;
    }

.nav-pills > li > a
{
    background: #9f9773;
    color: black;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
}

    .nav-pills > li > a:hover, .nav-pills > li > a:focus
    {
        background: #53493f;
        color: white;
    }
/*.nav-tabs > .active > a, .nav-tabs > .active > a:hover, .nav-tabs > .active > a:focus {
	color: #53493f;
}*/
.page-header
{
    border-bottom: 4px double #eeeeee;
}

    .page-header h1
    {
        font-size: 28px;
    }

        .page-header h1 small
        {
            font-size: 22px;
        }

.pagination ul
{
    box-shadow: none;
}

    .pagination ul > li > a, .pagination ul > li > span
    {
        border-color: transparent;
        border-radius: 3px !important;
        color: inherit;
        font-size: 12px;
        font-weight: 900;
        margin-right: 1px;
    }

        .pagination ul > .active > a, .pagination ul > .active > span, .pagination ul > li > a:hover, .pagination ul > li > a:focus, .pagination ul > .active > a, .pagination ul > .active > span
        {
            color: white;
        }

    .pagination ul > .disabled > span, .pagination ul > .disabled > a, .pagination ul > .disabled > a:hover, .pagination ul > .disabled > a:focus
    {
        background: #f9f9f9;
        color: #cccccc;
    }

.progress
{
    border-radius: 20px;
    height: 20px;
}

    .progress .bar
    {
        border-radius: 20px;
    }

select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input
{
    box-shadow: none;
}
/*2014-05-28 小唐*/
select
{
    line-height: 25px;
    padding: 5px;
}

.well
{
    border: none;
    border-radius: 0;
    box-shadow: none;
}

    .well.highlight
    {
        background: #f8f7f5;
    }
/* FORM ERROR STYLING
================================================== */
.input-validation-error
{
    border-color: #bd4247 !important;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075) !important;
    -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075) !important;
    box-shadow: inset 0 1px 1px rgba(0,0,0,0.075) !important;
}

.validation-summary-errors ul, .field-validation-error
{
    font-size: .9em;
    color: #bd4247;
}
/* jquery.validate errorMsg STYLING
================================================== */
label.errorMsg
{
    /*background: url("../../image/unchecked.gif") no-repeat 0px 0px;*/
    margin-left: 3px;
    margin-top: 12px;
    padding-left: 14px;
    font-weight: bold;
    color: #EA5200;
    display: inline;
    height: 14px; /*position: absolute;*/
}

label.checked
{
    background: url("../../image/checked.gif") no-repeat 0px 0px;
}
/**********************************************************************************************************************************/
/* public.css *********************************************************************************************************************/
/**********************************************************************************************************************************/
/** {
	margin: 0;
	padding: 0;
}*/



body
{
    /*padding-top: 30px;*/
    background: #F9F9F9 !important;
    font-size: 10pt;
}

a
{
    text-decoration: none;
    color: #666;
    font-weight: 500;
}

    a:hover
    {
        text-decoration: underline;
        color: #060;
    }

p
{
    color: #808080;
}

img
{
    border: none;
}

.noborder
{
    border-right: none !important;
}

/*.container-fluid
{
    padding-right: 0;
    padding-left: 0;
}*/

.row-fluid
{
    margin: 0;
}

header.navbar .header-aux
{
    font-size: small;
}

ul, ol
{
    padding: 0;
    margin: 0;
}

dl
{
    margin-bottom: auto;
}

#Main
{
    padding: 0 0 0;
}

.piedone-avatars.avatar
{
    width: 64px;
}

.scrollerota ul.text li h1
{
    margin: auto;
}





/******************************************************************************************************
 
    空的resopnsive template   
    
    **/

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px)
{
    /* Styles */
}

/* Smartphones (landscape) ----------- */
@media only screen and (min-width : 321px)
{
    /* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px)
{
    /* Styles */
}

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px)
{
    /* Styles */
}

/* iPads (landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape)
{
    /* Styles */
}

/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait)
{
    /* Styles */
}
/**********
iPad 3
**********/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2)
{
    /* Styles */
}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2)
{
    /* Styles */
}
/* Desktops and laptops ----------- */
@media only screen and (min-width : 1224px)
{
    /* Styles */
}

/* Large screens ----------- */
@media only screen and (min-width : 1824px)
{
    /* Styles */
}

/* iPhone 4 ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio : 2)
{
    /* Styles */
}

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio : 2)
{
    /* Styles */
}

/* iPhone 5 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2)
{
    /* Styles */
}

@media only screen and (min-device-width: 320px) and (max-device-height: 568px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2)
{
    /* Styles */
}

/* iPhone 6 ----------- */
@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2)
{
    /* Styles */
}

@media only screen and (min-device-width: 375px) and (max-device-height: 667px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2)
{
    /* Styles */
}

/* iPhone 6+ ----------- */
@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2)
{
    /* Styles */
}

@media only screen and (min-device-width: 414px) and (max-device-height: 736px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2)
{
    /* Styles */
}

/* Samsung Galaxy S3 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 2)
{
    /* Styles */
}

@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 2)
{
    /* Styles */
}

/* Samsung Galaxy S4 ----------- */
@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3)
{
    /* Styles */
}

@media only screen and (min-device-width: 320px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3)
{
    /* Styles */
}

/* Samsung Galaxy S5 ----------- */
@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : landscape) and (-webkit-device-pixel-ratio: 3)
{
    /* Styles */
}

@media only screen and (min-device-width: 360px) and (max-device-height: 640px) and (orientation : portrait) and (-webkit-device-pixel-ratio: 3)
{
    /* Styles */
}

/*151208-左區塊*/
.pannelLeftWrapperLast
{
    border-bottom-left-radius: 0px;
    border-bottom: 1px solid #E2E2E2;
    padding-bottom: 0px;
}

/*151208-右區塊*/
.pannelRightWrapper, .pannelLeftWrapper
{
    border: none;
    line-height: 20px;
    margin-top: 0px;
    padding-top: 10px;
}

/*151208-內容文字區塊*/
.ContentTextWrapper
{
    background: #fff;
    -moz-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    -moz-box-shadow: 1px 1px 0 rgba(0,0,0,0.3);
    -webkit-box-shadow: 1px 1px 0 rgba(0,0,0,0.3);
    box-shadow: 1px 1px 0 rgba(0,0,0,0.3);
    font-size: 15px;
    margin: 0px;
    padding: 20px;
    position: relative;
    /*line-height: 28px;*/ /*160309-影響產品頁fb*/
}








@media only screen and ( min-width :1680px) and (max-width : 1921px)
{
    .topContainer
    {
        margin: 0 auto;
        max-width: 1024px;
        padding-left: 20px;
        padding-right: 20px;
    }

        .topContainer .navbar-collapse
        {
            overflow: hidden;
        }
}

@media only screen and ( min-width :1279px) and (max-width : 1679px)
{
    .topContainer
    {
        margin: 0 auto;
        max-width: 1024px;
        padding-left: 20px;
        padding-right: 20px;
    }

        .topContainer .navbar-collapse
        {
            overflow: hidden;
        }
}

@media only screen and ( min-width :960px) and (max-width : 1278px)
{
    .topContainer
    {
        margin: 0 auto;
        max-width: 1024px;
        padding-left: 20px;
        padding-right: 20px;
    }

        .topContainer .navbar-collapse
        {
            overflow: hidden;
        }
}

@media only screen and ( min-width :481px) and (max-width : 959px)
{
    .topContainer
    {
        margin: 0 auto;
        max-width: 1024px;
        padding-left: 20px;
        padding-right: 20px;
    }

    .header-content .search-wrap
    {
        width: 50%;
        padding: 0px 5px;
        position: relative;
        margin-bottom: 20px;
        left: 100px;
    }

    .idLoginBox li
    {
        padding: 15px 5px 0px 5px!important;
        width: 90px;
    }
}

@media only screen and ( min-width :321px) and (max-width : 480px)
{
    .topContainer
    {
        padding-left: 0px;
        padding-right: 0px;
        margin: 0 auto;
    }




        /*雲端共用導覽列下拉選單選項*/
        .topContainer .dropdown-menu a
        {
            border: none!important;
            color: #777!important;
            font-size: 15px!important;
            padding: 3px 15px!important;
        }

        .topContainer .main-nav a
        {
            border-bottom: 1px dashed #c7c7c7;
            color: #333;
            font-size: 21px;
            line-height: 25px;
            padding-bottom: 2px;
        }

        .topContainer .mobileHeader
        {
            margin-bottom: 10px;
        }

        .topContainer .badgeWrap
        {
            margin-right: 5px;
            font-size: 10px;
            background: #467E4B;
        }

        /*手機版總覽按鈕*/
        .topContainer .navbar-toggle
        {
            padding: 10px;
            position: relative;
            left: 10px;
            border: none;
        }

            .topContainer .navbar-toggle:hover, .topContainer .navbar-toggle:focus, .topContainer .navbar-toggle:visited, .topContainer .navbar-toggle:active
            {
                background: none;
                border: none;
            }

        .topContainer .navbar-header
        {
            background: #fff;
            -webkit-box-shadow: #555 0px 1px 3px;
            -moz-box-shadow: #555 0px 1px 3px;
            box-shadow: #555 0px 1px 3px;
            border-bottom: 1px solid #ccc;
            margin-bottom: 2px;
        }

        .topContainer .icon-bar
        {
            background-color: #838383 !important;
        }

    .idLoginBox li
    {
        padding: 15px 5px 0px 5px!important;
        position: relative;
        left: 50px;
        width: 90px;
    }

    .search_box
    {
        margin-top: 0px!important;
    }
}

@media only screen and ( max-width :320px)
{
    .topContainer
    {
        padding-left: 0px;
        padding-right: 0px;
        margin: 0 auto;
    }




        /*雲端共用導覽列下拉選單選項*/
        .topContainer .dropdown-menu a
        {
            border: none!important;
            color: #777!important;
            font-size: 15px!important;
            padding: 3px 15px!important;
        }

        .topContainer .main-nav a
        {
            border-bottom: 1px dashed #c7c7c7;
            color: #333;
            font-size: 21px;
            line-height: 25px;
            padding-bottom: 2px;
        }

        .topContainer .mobileHeader
        {
            margin-bottom: 10px;
        }

        .topContainer .badgeWrap
        {
            margin-right: 5px;
            font-size: 10px;
            background: #467E4B;
        }

        /*手機版總覽按鈕*/
        .topContainer .navbar-toggle
        {
            padding: 10px;
            position: relative;
            left: 10px;
            border: none;
        }

            .topContainer .navbar-toggle:hover, .topContainer .navbar-toggle:focus, .topContainer .navbar-toggle:visited, .topContainer .navbar-toggle:active
            {
                background: none;
                border: none;
            }

        .topContainer .navbar-header
        {
            background: #fff;
            -webkit-box-shadow: #555 0px 1px 3px;
            -moz-box-shadow: #555 0px 1px 3px;
            box-shadow: #555 0px 1px 3px;
            border-bottom: 1px solid #ccc;
            margin-bottom: 2px;
        }

        .topContainer .icon-bar
        {
            background-color: #838383 !important;
        }

    .idLoginBox li
    {
        padding: 15px 5px 0px 5px!important;
        position: relative;
        left: 10px;
        width: 90px;
    }

    .search_box
    {
        margin-top: 0px!important;
    }
}
