html{
    overflow-y:auto;
    overflow-x:hidden;
    /* -ms-overflow-style:scrollbar */
}
body{
    background:#fff;
    font:400 12px/1.8 "Open Sans", sans-serif;
    color:#666;
    -webkit-font-smoothing:antialiased
}
img{
    max-width:100%;
    height:auto
}
iframe{
    border:0
}
.ofHidden{
    overflow: hidden;
}
.bdBottom{
    /* border-bottom: 1px solid rgba(0,0,0,.0975); */
}
.black{
    background: #000;
}
.white{
    background: #fff;
}
.pink{
    background: rgb(206, 148, 167);
}
.align-center{
    text-align:center
}
.align-left{
    text-align:left !important
}
.position-relative{
    position:relative
}
.leftauto{
    right:0 !important;
    left:auto !important;
}
a,.btn{
    transition:all 0.125s ease-in-out 0s
}
.client-logo,.gallery-caption,.gallery-image:after,.gallery-image img,.price-table,.team-detail,.team-image:after,.work-caption,.work-image>img,.work-image:after,.post-thumbnail,.post-video,.post-images-slider{
    transition:all 0.7s ease-in-out 0s
}
.btn,.well,.panel,.progress,.form-control,.form-control:hover,.form-control:focus,.navbar-custom .dropdown-menu{
    box-shadow:none
}
.well,.label,.alert,.progress,.form-control,.modal-content,.panel-heading,.panel-group .panel,.nav-tabs>li>a,.nav-pills>li>a{
    border-radius:2px
}
.pr-remove{
    text-align:center
}
.examples{
    border-radius:2px;
    padding:7px 5px;
    margin:0 0 40px
}
.examples.bg-dark{
    background:#333;
    border:0
}
.et-icons .box1{
    border:1px solid #e5e5e5;
    display:block;
    width:25%;
    float:left;
    padding:0;
    font-size:13px;
    margin:-1px 0 0 -1px
}
.et-icons .box1>span{
    display:inline-block;
    border-right:1px solid #e5e5e5;
    min-width:60px;
    min-height:60px;
    text-align:center;
    line-height:60px;
    font-size:28px;
    margin-right:5px
}
.fa-icons>div{
    padding:0;
    border:1px solid #e5e5e5;
    margin:-1px 0 0 -1px;
    font-size:13px
}
.fa-icons>div>i{
    display:inline-block;
    margin-right:5px;
    min-width:40px;
    min-height:40px;
    border-right:1px solid #f1f1f1;
    line-height:40px;
    text-align:center;
    font-size:14px
}
.help-block ul{
    list-style:none;
    padding:0;
    margin:0
}
.navbar-custom+.main{
    /* margin-top:50px */
}

/* nav phone */
.navbar-fixed-top .navbar-collapse {
    max-height: 100vh;
    height: 100vh;
}
/* end */
.main{
    /* position:relative; */
    background-color:#fff;
    z-index:1;
    text-align: center;
}

.module,.module-small{
    position:relative;
    padding:10px 0 0 0;
    background-repeat:no-repeat;
    background-position:50% 50%;
    background-size:cover
}
.main>.module:nth-child(2){
    /* padding:100px 0 0 0; */
}
.module-small{
    padding:70px 0
}
.module-extra-small{
    padding:25px 0px
}
.module-medium{
    padding:75px 0px
}
.holder-w{
    position:relative;
    display:table-cell;
    vertical-align:middle;
    height:1px;
    width:50%
}
.holder-w:before{
    border-top:1px solid #eaeaea;
    position:relative;
    display:block;
    content:"";
    top:1px;
    height:1px;
    width:100%
}
.divider-w{
    border-top:1px solid #eaeaea;
    margin:0
}
.divider-d{
    border-top:1px solid #202020;
    margin:0
}
.side-image{
    position:absolute;
    height:100%;
    background-repeat:no-repeat;
    background-position:50% 50%;
    background-size:cover
}
.side-image-text{
    background:#fff;
    border-top:1px solid #e5e5e5;
    border-bottom:1px solid #e5e5e5;
    padding:140px 60px 140px
}
.bg-dark,.bg-dark-30,.bg-dark-60,.bg-dark-90,.bg-dark .module-title,.bg-dark-30 .module-title,.bg-dark-60 .module-title,.bg-dark-90 .module-title,.bg-dark .module-subtitle,.bg-dark-30 .module-subtitle,.bg-dark-60 .module-subtitle,.bg-dark-90 .module-subtitle,.bg-dark .alt-module-subtitle h5,.bg-dark-30 .alt-module-subtitle h5,.bg-dark-60 .alt-module-subtitle h5,.bg-dark-90 .alt-module-subtitle h5{
    color:#fff
}
.bg-dark{
    background:#111
}
.bg-dark-30:before{
    position:absolute;
    background:rgba(2,2,2,0.1);
    content:" ";
    height:100%;
    width:100%;
    left:0;
    top:0
}
.bg-dark-60:before{
    position:absolute;
    background:rgba(34,34,34,0.8);
    content:" ";
    height:100%;
    width:100%;
    left:0;
    top:0
}
.bg-dark-90:before{
    position:absolute;
    background:rgba(34,34,34,0.9);
    content:" ";
    height:100%;
    width:100%;
    left:0;
    top:0
}
.bg-gradient:before{
    position:absolute;
    /*background:;
    url(data:image/svg+xml;
        base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9Ijk1JSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjk1Ii8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+):;
    background:linear-gradient(to bottom, rgba(40,115,113,0.57) 25%, rgba(115,54,31,0.67) 75%);
    filter:;
    progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#000000',GradientType=0 );*/
    content:" ";
    height:100%;
    width:100%;
    left:0;
    top:0;
    -webkit-filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#000000',GradientType=0 );
}
.bg-light{
    background:#f6f6f6
}
.parallax-bg{
    background-attachment:fixed;
    background-size:cover;
    height: 500px;
    box-shadow: 0vw 0vw 5vw #666 inset;
}
.p-0{
    padding:0 !important
}
.pt-0{
    padding-top:0 !important
}
.pt-10{
    padding-top:10px !important
}
.pt-20{
    padding-top:20px !important
}
.pt-30{
    padding-top:30px !important
}
.pt-40{
    padding-top:40px !important
}
.pt-50{
    padding-top:50px !important
}
.pt-80{
    padding-top:80px !important
}
.pt-140{
    padding-top:140px !important
}
.pb-0{
    padding-bottom:0 !important
}
.pb-10{
    padding-bottom:10px !important
}
.pb-20{
    padding-bottom:20px !important
}
.pb-30{
    padding-bottom:30px !important
}
.pb-40{
    padding-bottom:40px !important
}
.pb-50{
    padding-bottom:50px !important
}
.pb-80{
    padding-bottom:80px !important
}
.pb-140{
    padding-bottom:140px !important
}

.m-0{
    margin:0 !important
}
.mt-0{
    margin-top:0 !important
}
.mt-10{
    margin-top:10px !important
}
.mt-20{
    margin-top:20px !important
}
.mt-30{
    margin-top:30px !important
}
.mt-40{
    margin-top:40px !important
}
.mt-50{
    margin-top:50px !important
}
.mt-60{
    margin-top:60px !important
}
.mt-70{
    margin-top:70px !important
}
.mt-80{
    margin-top:80px !important
}
.mb-0{
    margin-bottom:0 !important
}
.mb-10{
    margin-bottom:10px !important
}
.mb-20{
    margin-bottom:20px !important
}
.mb-30{
    margin-bottom:30px !important
}
.mb-40{
    margin-bottom:40px !important
}
.mb-50{
    margin-bottom:50px !important
}
.mb-60{
    margin-bottom:60px !important
}
.mb-70{
    margin-bottom:70px !important
}
.mb-80{
    margin-bottom:80px !important
}
@media only screen and (max-width: 991px){
    .mt-sm-0{
        margin-top:0 !important
    }
    .mt-sm-10{
        margin-top:10px !important
    }
    .mt-sm-20{
        margin-top:20px !important
    }
    .mt-sm-30{
        margin-top:30px !important
    }
    .mt-sm-40{
        margin-top:40px !important
    }
    .mt-sm-50{
        margin-top:50px !important
    }
    .mt-sm-60{
        margin-top:60px !important
    }
    .mt-sm-70{
        margin-top:70px !important
    }
    .mt-sm-80{
        margin-top:80px !important
    }
    .mb-sm-0{
        margin-bottom:0 !important
    }
    .mb-sm-10{
        margin-bottom:10px !important
    }
    .mb-sm-20{
        margin-bottom:20px !important
    }
    .mb-sm-30{
        margin-bottom:30px !important
    }
    .mb-sm-40{
        margin-bottom:40px !important
    }
    .mb-sm-50{
        margin-bottom:50px !important
    }
    .mb-sm-60{
        margin-bottom:60px !important
    }
    .mb-sm-70{
        margin-bottom:70px !important
    }
    .mb-sm-80{
        margin-bottom:80px !important
    }
}
@media only screen and (max-width: 767px){
    .mt-xs-0{
        margin-top:0 !important
    }
    .mt-xs-10{
        margin-top:10px !important
    }
    .mt-xs-20{
        margin-top:20px !important
    }
    .mt-xs-30{
        margin-top:30px !important
    }
    .mt-xs-40{
        margin-top:40px !important
    }
    .mt-xs-50{
        margin-top:50px !important
    }
    .mt-xs-60{
        margin-top:60px !important
    }
    .mt-xs-70{
        margin-top:70px !important
    }
    .mt-xs-80{
        margin-top:80px !important
    }
    .mb-xs-0{
        margin-bottom:0 !important
    }
    .mb-xs-10{
        margin-bottom:10px !important
    }
    .mb-xs-20{
        margin-bottom:20px !important
    }
    .mb-xs-30{
        margin-bottom:30px !important
    }
    .mb-xs-40{
        margin-bottom:40px !important
    }
    .mb-xs-50{
        margin-bottom:50px !important
    }
    .mb-xs-60{
        margin-bottom:60px !important
    }
    .mb-xs-70{
        margin-bottom:70px !important
    }
    .mb-xs-80{
        margin-bottom:80px !important
    }
}
.scroll-up{
    position:fixed;
    display:none;
    bottom:7px;
    right:7px;
    z-index:999
}
.scroll-up a{
    background:#fff;
    display:block;
    height:28px;
    width:28px;
    text-align:center;
    line-height:28px;
    font-size:14px;
    color:#000;
    /* opacity:0.6; */
    border-radius:2px;
}
@media screen and (max-width: 767px){
    .scroll-up{
        bottom:108px;
    }
        
    .scroll-up a{
        height:40px;
        width:40px;
        line-height:40px;
        font-size:16px;
        border: 1px solid rgba(0,0,0,.0975);
    }
}

.scroll-up a:hover,.scroll-up a:active{
    opacity:1;
    color:#000;
    animation-name: rubberBand;
    animation-duration: 1.2s;
    animation-iteration-count: infinite;
}
.video-controls-box{
    position:absolute !important;
    bottom:40px;
    left:0;
    width:100%;
    z-index:1
}
.video-controls-box a{
    display:inline-block;
    color:#fff;
    margin:0 5px 0 0
}
.landing-reason:before{
    position:absolute;
    content:" ";
    width:100%;
    height:100%;
    left:0;
    top:0;
    background-color:rgba(66,26,107,0.9)
}
.landing-reason{
    color:#fff;
    font-size:13px
}
.landing-image-text{
    padding-top:70px;
    padding-bottom:0px
}
.landing-image-text h2{
    margin-top:100px;
    margin-bottom:15px
}
.landing-screenshot:before{
    position:absolute;
    content:" ";
    width:100%;
    height:100%;
    left:0;
    top:0;
    background-color:rgba(66,60,130,0.5)
}
.alert i{
    margin-right:5px
}
.btn{
    border-radius:0;
    font-family:"Roboto Condensed", sans-serif;
    text-transform:uppercase;
    letter-spacing:2px;
    font-size:11px;
    padding:8px 37px
}
.btn.active.focus,.btn.active:focus,.btn.focus,.btn:active.focus,.btn:active:focus,.btn:focus{
    outline:0
}
.btn.btn-round{
    border-radius:2px
}
.btn.btn-circle{
    border-radius:30px
}
.btn.btn-w{
    background:rgba(255,255,255,0.8);
    color:#111
}
.btn.btn-w:hover,.btn.btn-w:focus{
    background:#fff;
    color:#111
}
.btn.btn-g{
    background:#fff;
    color:#333
}
.btn.btn-g:hover,.btn.btn-g:focus{
    background:#eee;
    color:#111
}
.btn.btn-border-w{
    background:transparent;
    border:1px solid rgba(255,255,255,0.75);
    color:#fff
}
.btn.btn-border-w:hover,.btn.btn-border-w:focus{
    background:#fff;
    border-color:transparent;
    color:#111
}
.btn.btn-d{
    background:rgba(17,17,17,0.8);
    color:#fff
}
.btn.btn-d:hover,.btn.btn-d:focus{
    background:#111
}
.btn.btn-b{
    background:#111;
    color:#fff
}
.btn.btn-b:hover,.btn.btn-b:focus{
    background:rgba(17,17,17,0.8)
}
.btn-border-d{
    background:transparent;
    border:1px solid #111;
    color:#111
}
.btn.btn-border-d:hover,.btn.btn-border-d:focus{
    background:#111;
    color:#fff
}
.btn.btn-font-w{
    background:rgba(255,255,255,0.8);
    color:#fff
}
.btn.btn-font-w:hover{
    background:#fff;
    color:#111
}
.btn.btn-lg{
    padding:12px 45px;
    font-size:13px
}
.btn.btn-sm{
    padding:6px 25px;
    font-size:10px;
    letter-spacing:1px
}
.btn.btn-xs{
    padding:4px 19px;
    font-size:10px;
    letter-spacing:0
}
.btn-list .btn{
    margin:5px 0
}
.btn.btn-point, button.btn-point.AddToBag, div.car-btn-area button.btn-point{
    background:#000;
    color:#fff;
    transition: all .5s;
    font-size: small;
    font-weight: 200;
    border-radius: 0;
    margin-top: 8px;
}
.btn.btn-point:hover, button.btn-point.AddToBag:hover, div.car-btn-area button.btn-point:hover{
    /* opacity: .6; */
    background:#751910;
    color:#fff;
    letter-spacing: 3pt;
    opacity: 1;
}
.search-btn{
    position:absolute;
    background:transparent;
    border:none;
    overflow:hidden;
    top:50%;
    right:1px;
    width:42px;
    height:40px;
    line-height:38px;
    font-size:14px;
    outline:none;
    color:#999;
    margin-top:-20px
}
.image-button{
    margin:0px 5px
}
::-moz-selection{
    background:#000;
    color:#fff
}
::-webkit-selection{
    background:#000;
    color:#fff
}
::selection{
    background:#000;
    color:#fff
}
.form-control{
    font-family:"Roboto Condensed", sans-serif;
    text-transform:uppercase;
    letter-spacing:2px;
    font-size:11px;
    height:33px;
    border:1px solid #EAEAEA;
    border-radius:2px;
    transition:all 0.4s ease-in-out 0s
}
.form-control:focus{
    border-color:#CACACA
}
.input-lg,.form-horizontal .form-group-lg .form-control{
    height:43px;
    font-size:13px
}
.input-sm,.form-horizontal .form-group-sm .form-control{
    height:29px;
    font-size:10px
}
.rqst-form{
    margin-top:27px
}
.rqst-form .btn{
    margin-top:5px
}
.input-group-addon{
    border:1px solid #e4e4e4 !important
}
a{
    color:#111
}
a:hover,a:focus{
    text-decoration:none;
    color:#aaa;
    outline:0
}
.bg-dark a{
    color:#aaa
}
.bg-dark a:hover,.bg-dark a:focus{
    color:#fff
}
h1,h2,h3,h4,h5,h6{
    line-height:1.4;
    font-weight:400
}
p,ol,ul,blockquote{
    margin:0 0 20px
}
blockquote{
    border:0;
    font-style:italic;
    font-size:15px;
    padding:0
}
.font-alt{
    font-family:"Roboto Condensed", sans-serif;
    /* text-transform:uppercase; */
    letter-spacing:2px
}
.font-serif{
    font-family:Volkhov, "Times New Roman", sans-serif;
    font-style:italic
}
.large-text{
    font-size:24px !important
}
.rotate{
    text-shadow:none !important
}
.module-title{
    position:relative;
    letter-spacing:4px;
    text-align:center;
    font-weight:400;
    font-size:45pt;
    color:#111;
    margin:150px 0 10px 0;
}
.module-subtitle{
    text-align:center;
    font-size:16px;
    color:#111;
    margin-bottom:70px
}
.module-icon{
    text-align:center;
    font-size:32px;
    margin-bottom:20px
}
.module-title+.module-subtitle{
    margin-top:-35px
}
.alt-module-subtitle{
    display:table
}
.alt-module-subtitle h5{
    display:table-cell;
    white-space:pre;
    padding:0 8px;
    color:#111
}
.finance-image-content{
    border:1px solid #e5e5e5;
    padding:60px 0px
}
.finance-image-content .module-title{
    margin-bottom:20px
}
.finance-image-content .alt-features-item{
    margin-top:40px
}
.landing-reason .module-title{
    color:#e6af4b
}
.landing-reason .module-title+.module-subtitle{
    margin-top:-60px;
    margin-bottom:40px
}
.free-trial{
    background-color:rgba(88,20,158,0.9);
    color:#FFFFFF
}
.free-trial .color-golden{
    color:#e6af4b
}
.special-portfolio-header-title{
    border:1px solid rgba(255,255,255,0.7);
    font-size:50px;
    padding:40px 0px;
    letter-spacing:8px
}
.flex-direction-nav a,.flex-control-nav>li>a{
    transition:all 0.3s ease-in-out 0s
}
.flex-direction-nav a{
    position:absolute;
    display:block;
    height:100%;
    width:50%;
    top:0;
    z-index:10;
    overflow:hidden;
    opacity:0;
    margin:0
}
.flex-direction-nav .flex-prev{
    opacity:0;
    left:0;
    cursor:url("../images/prev-light.png"),e-resize
}
.flex-direction-nav .flex-next{
    opacity:0;
    right:0;
    cursor:url("../images/next-light.png"),e-resize
}
.flex-control-nav{
    position:absolute;
    width:auto;
    left:50%;
    bottom:20px;
    z-index:11;
    text-align:center;
    -webkit-transform:translateX(-50%);
    -ms-transform:translateX(-50%);
    transform:translateX(-50%)
}
.flex-control-nav>li{
    display:inline-block;
    margin:5px 3px
}
.flex-control-nav>li>a{
    background:transparent;
    border:1px solid #fff;
    display:block;
    height:6px;
    width:6px;
    border-radius:6px
}
.flex-control-nav>li>a:hover,.flex-control-nav>li>a.flex-active{
    background:#fff
}

/* slider animate scale */
.hero-slider li.scale {
    /* animation: example 10s linear infinite;
    animation-direction: alternate; */
    /* transform: scale(1.2); */
}

.hero-slider ul {
    overflow: hidden;
}

.transition {
    transition: all .8s;
}

@keyframes example {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(1.1);
    }
}
/* end-slider animate */

.hero-slider{
    margin:0 !important
}
.hero-slider .slides>li{
    display:none;
    -webkit-backface-visibility:hidden
}
.hero-slider,.hero-slider .flex-viewport{
    height:100% !important;
    width:100%;
    padding:0;
    margin:0
}
.hero-slider .slides{
    height:100% !important;
    transition-delay:1s
}
.hero-slider .flex-direction-nav a{
    width:15%
}
.hero-slider .slides li{
    background-size:cover;
    background-position:center center;
    background-repeat:no-repeat;
    height:100% !important;
    width:100%;
    padding:0;
    margin:0;
    -webkit-background-size:cover;
    -moz-background-size:cover;
    -o-background-size:cover
}
.titan-caption{
    position:relative;
    display:table;
    height:100%;
    width:70%;
    margin:0 auto
}
.titan-caption{
    position:relative;
    display:table;
    height:100%;
    width:100%;
    margin:0 auto
}
.caption-content{
    display:table-cell;
    vertical-align:middle;
    text-align:center
}
.photography-page .image-caption{
    bottom:20px;
    position:absolute;
    width:35%
}
.photography-page .image-caption .caption-text{
    font-size:24px;
    text-transform:capitalize;
    letter-spacing:1px
}
.photography-page .flex-control-nav{
    left:80%;
    bottom:20px;
    z-index:11
}
.owl-controls{
    margin-top:40px
}
.owl-pagination div{
    display:inline-block
}
.owl-controls .owl-page span{
    background:transparent;
    border:1px solid #111;
    display:block;
    height:6px;
    width:6px;
    margin:0 3px 5px;
    border-radius:6px;
    transition:all 0.3s ease-in-out 0s
}
.owl-controls .owl-page.active span,.owl-controls.clickable .owl-page:hover span{
    background:#111
}
.owl-controls .owl-buttons>div{
    display:inline-block;
    margin:5px;
    font-size:14px;
    color:#111
}
.page-loader{
    position:fixed;
    background:#000;
    bottom:0;
    right:0;
    left:0;
    top:0;
    z-index:9999
}
.loader{
    position:absolute;
    border-left:2px solid #ffffff;
    border-top:2px solid rgba(255,255,255,0.2);
    border-right:2px solid rgba(255,255,255,0.2);
    border-bottom:2px solid rgba(255,255,255,0.2);
    height:46px;
    width:46px;
    left:50%;
    top:50%;
    margin:-23px 0 0 -23px;
    text-indent:-9999em;
    font-size:10px;
    z-index:9999;
    -webkit-animation:load 0.8s infinite linear;
    -moz-animation:load 0.8s infinite linear;
    ms-animation:load 0.8s infinite linear;
    o-animation:load 0.8s infinite linear;
    animation:load 0.8s infinite linear
}
.loader,.loader:after{
    border-radius:50%;
    width:46px;
    height:46px
}

@-webkit-keyframes load{
    0%{
        -webkit-transform:rotate(0deg);
        transform:rotate(0deg)
    }
    100%{
        -webkit-transform:rotate(360deg);
        transform:rotate(360deg)
    }
}
@keyframes load{
    0%{
        -webkit-transform:rotate(0deg);
        transform:rotate(0deg)
    }
    100%{
        -webkit-transform:rotate(360deg);
        transform:rotate(360deg)
    }
}

@media screen and (max-width: 1230px) {
    .navbar>.container>.navbar-collapse>ul.navmain{
        margin-left: 0;
    }
}
.navbar .container.helloBar {
    background:#111;
    padding-left: 0;
    padding-right: 0;
}

.navbar .container#stickyBar>div:nth-child(2){
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
}
@media screen and (max-width: 767px){
    .navbar .container#stickyBar>div:nth-child(2){
        position: fixed;
        bottom: 0;
        top: unset;
        transform: translateY(0px);
        display: block;
    }
    .navbar .container#stickyBar>div:nth-child(2)>ul{
        background: #fff;
    }
    .navbar .container.main>div:nth-child(1){
        display:flex;
        width: 100%;
    }
    .navbar .container.main>div:nth-child(1) ul{
        display:flex!important;
        justify-content: space-between;
        padding: 0px;
    }
    .navbar-custom .navbar-toggle .icon-bar{
        background:#666;
    }
    .navbar .container.main>div:nth-child(1) button.navbar-toggle {
        margin: 0;
        z-index: 0;
    }
    .navbar .container.main>div:nth-child(1) button.navbar-toggle .icon-bar{
        width: 17px;
    }
    .navbar .container.main>div:nth-child(1) button.navbar-toggle .icon-bar:nth-child(3){
        width: 13px;
    }
}
.navbar .container.main div:nth-child(2),
.navbar .container#stickyBar div:nth-child(1){
    margin: 0 auto;
    z-index: 1;
}
@media screen and (max-width: 767px){
    .navbar .container.main div:nth-child(2){
        position: absolute;
        background: #eee;
        top: 100%;
        height: calc(100vh - 100% - 50px);
        z-index: 0;
    }
    .navbar .container.main div:nth-child(2) ul li{
        flex:100%;
    }
    
}
.navbar .container div:nth-child(3){
    flex:2;  
}
.navbar .container.searchMob{
    background: #fff;
}
.navbar .container.searchMob .navbar-header{
    width:100%
}
@media screen and (max-width: 1000px){
    .navbar .container div:nth-child(1){
        /* flex:unset; */
    }
    .navbar .container div:nth-child(2){
        flex:10;
    }
    .navbar .container div:nth-child(3){
        flex:4;
        
    }
}


@media screen and (max-width: 900px) {
    .navbar>.container>.navbar-collapse{
        width:100%;
        margin-right: 0;
        margin-left: 0;
        padding-left: 0;
        padding-right: 0;
    }
}
@media screen and (max-width: 767px){
    .navbar .container .navbar-collapse.collapse{
        display:none;
    }
    .navbar .container div:nth-child(3).navbar-collapse.collapse{
        display: block;
        height: 55px;
        bottom: 0;
        position: fixed;
        background: #fff;
        border-top: 1px solid rgba(0,0,0,.0975) ;
    }
    .navbar .container .collapse.in{
        display:block;
        padding-bottom: 106px;
    }
    /* .navbar .container .collapse.in .phoneblock span{
        left: 50%;
    } */
    
}

.navbar-custom{
    background-color:#FFF;
    /* box-shadow: 0 3px 25px 2px rgba(79,72,109,.06); */
    /* border-bottom: 1px solid rgba(0,0,0,.0975) !important; */
    border:0;
    border-radius:0;
    z-index:1000;
    font-family: "Roboto Condensed", sans-serif , "微軟正黑體";
    text-transform:uppercase;
    letter-spacing:1.5px;
    font-size:14px;
    transition:background, padding 0.4s ease-in-out 0s;
    /* position: relative; */
    transition: all .8s ;
}


.navbar a{
    transition:color 0.125s ease-in-out 0s
}
.navbar-custom .dropdown-menu{
    background:#fff;
    border-radius:0;
    border:0;
    padding:0;
    box-shadow:none
}

nav.navbar-custom .navbar-header>.navbar-brand{
    letter-spacing:4px;
    font-weight:400;
    font-size:22px;
    color:#fff;
    padding:0;
    margin-left: 0;
}
.navbar-custom .navbar-brand>img{
    margin-top:15px;
    width:220px;
}
@media screen and (max-width: 930px) {
    .navbar-custom .navbar-brand>img{
        margin-top:20px;
    }
}
@media screen and (max-width: 767px) {
    .navbar-custom .navbar-brand>img{
        margin-top:5px;
    }
}

.navbar-custom .nav li>a{
    /* position:relative; */
    color:#333;
    font-size: 10pt;

}
@media screen and (max-width: 1065px) {
    .navbar-custom .nav li>a{
        letter-spacing: 1px;
    }
}
.nav > li > a > img {
    /* width:25px; */
    opacity: .7;
    transition: all .5s;
}
.navbar-right>li>a>img{
    width: 23px;
    max-width: 100%;
}
.navbar-custom .dropdown-menu>li>a{
    /* border-bottom:1px solid rgba(255,255,255,0.3) !important; */
    padding:11px 15px;
    letter-spacing:2px;
    color:#333;
    /* margin-right: 25px; */
}
.navbar-custom .dropdown-menu>li>ul{
    margin:10px 0 0 0;
    padding: 0;
}
.navbar-custom .dropdown-menu>li>ul>li{
    list-style: none;
    margin:0;
    /* padding: 2px 15px; */ 
}
.navbar-custom .dropdown-menu>li>ul>li>a{
    color:#333;  
}
.navbar-custom .dropdown-menu>li>ul>li>a:hover{
    /* color:rgba(255,255,255,1); */
}
.navbar-custom .dropdown-menu>li>input{
    background: transparent;
    border: none;
    box-shadow: none;
    outline: none;
    width: 680px;
    /* height: 45px; */
    font-size: 38px; 
    line-height: 15px;
    color:#fff;
    margin-top:15%;
}
.navbar-custom .dropdown-menu>li>input:focus{
    /* background: rgba(255,255,255,.2); */
    color:#fff;
}
.navbar-custom .dropdown-menu>li>i{
    color:#fff;
    font-size: 30px;
}

.navbar-custom .dropdown-menu .dropdown-menu{
    border-left:1px solid rgba(73,71,71,0.15);
    left:100%;
    right:auto;
    top:0;
    margin-top:0
}


.navbar-custom .dropdown-menu.left-side .dropdown-menu{
    border:0;
    border-right:1px solid rgba(73,71,71,0.15);
    right:100%;
    left:auto
}
.navbar-custom .nav>li>a:focus,.navbar-custom .nav>li>a:hover,.navbar-custom .nav .open>a,.navbar-custom .nav .open>a:focus,.navbar-custom .nav .open>a:hover,.navbar-custom .dropdown-menu>li>a:focus,.navbar-custom .dropdown-menu>li>a:hover{
    /* background:none;
    color:#fff;
    background-color: rgba(0,0,0,.3); */
    /* background: #ddd; */
    color:#333
}
@media screen and (max-width: 767px) {
    .navbar-custom .dropdown-menu .dropdown-menu{
        border:1px solid rgba(0,0,0,.0975);;
    }
    .navbar-custom .nav>li>a:focus,.navbar-custom .nav>li>a:hover,.navbar-custom .nav .open>a,.navbar-custom .nav .open>a:focus,.navbar-custom .nav .open>a:hover,.navbar-custom .dropdown-menu>li>a:focus,.navbar-custom .dropdown-menu>li>a:hover{
        background: #ddd;
    }
}
.navbar-custom>.container>.collapse>ul.navbar-right>li:hover img{
    opacity: 1;
}
.navbar-custom .dropdown-menu>li>a:hover{
    /* background-color: rgba(0,0,0,.3) !important; */
    padding-left: 22px;
    /* color:rgba(255,255,255,1); */
}
.navbar-custom .dropdown-toggle:after{
    /* position:absolute; */
    display:inline-block;
    margin-left: 4px;
    /* right:0;
    top:50%;
    margin-top:-6px; */
    font:normal normal normal 14px/1 FontAwesome;
    font-size:9px;
    content:"\f107";
    text-rendering:auto;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale
}

.navbar-custom>.container>.collapse>ul.navbar-right{
    margin:0;
}
.navbar .container .navbar-collapse.collapse ul.navbar-nav,
        .navbar .container .navbar-collapse.collapse ul.navbar-right {
            float: unset;
            display: flex;
            justify-content: center;
        }
        .navbar .container div.navbar-collapse.collapse:nth-child(3)>ul.navbar-nav{
            justify-content:flex-end;
        }
        
        .navbar-custom>.container>.collapse>ul.navbar-right>li>a {
            padding: 15px 10px;
        }
.navbar-custom>.container>.collapse>ul.navbar-right>li{
    height:80px;
}
@-webkit-keyframes rubberBand {
    from {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  
    30% {
      -webkit-transform: scale3d(1.25, 0.75, 1);
      transform: scale3d(1.25, 0.75, 1);
    }
  
    40% {
      -webkit-transform: scale3d(0.75, 1.25, 1);
      transform: scale3d(0.75, 1.25, 1);
    }
  
    50% {
      -webkit-transform: scale3d(1.15, 0.85, 1);
      transform: scale3d(1.15, 0.85, 1);
    }
  
    65% {
      -webkit-transform: scale3d(0.95, 1.05, 1);
      transform: scale3d(0.95, 1.05, 1);
    }
  
    75% {
      -webkit-transform: scale3d(1.05, 0.95, 1);
      transform: scale3d(1.05, 0.95, 1);
    }
  
    to {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  }
  
  @keyframes rubberBand {
    from {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  
    30% {
      -webkit-transform: scale3d(1.25, 0.75, 1);
      transform: scale3d(1.25, 0.75, 1);
    }
  
    40% {
      -webkit-transform: scale3d(0.75, 1.25, 1);
      transform: scale3d(0.75, 1.25, 1);
    }
  
    50% {
      -webkit-transform: scale3d(1.15, 0.85, 1);
      transform: scale3d(1.15, 0.85, 1);
    }
  
    65% {
      -webkit-transform: scale3d(0.95, 1.05, 1);
      transform: scale3d(0.95, 1.05, 1);
    }
  
    75% {
      -webkit-transform: scale3d(1.05, 0.95, 1);
      transform: scale3d(1.05, 0.95, 1);
    }
  
    to {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  }
  
i{
    transition: all .8s;
}
.navbar-custom>.container>.collapse>ul.navbar-right>li:hover>a>i{
    /* -webkit-animation-name: rubberBand;
    animation-name: rubberBand;
    animation-duration: 1.2s;
    animation-iteration-count:infinite; */
}
.navbar-custom>.container>.collapse>ul.navbar-right>li>a{
    padding: 15px;
    margin-top:15px;
    cursor: pointer;
}
@media screen and (max-width: 1065px) {
    .navbar-custom>.container>.collapse>ul.navbar-right>li>a {
        padding:15px 10px;
    }
}
@media screen and (max-width: 767px) {
    .navbar-custom>.container>.collapse>ul.navbar-right>li{
        height:auto;
        flex:4;
        padding: 0;
        background: #fff;
    }
    .navbar-custom>.container>.collapse>ul.navbar-right>li>a{
        margin-top:0;
        padding: 10px;
    }
}
.dropdown-menu{
    min-width:180px;
    font-size:11px
}
.home-section{
    position:relative;
    background-color:#fff;
    background-repeat:no-repeat;
    background-position:center center;
    width:100%;
    z-index:0;
    background-size:cover;
    margin-bottom: 1px;
}
.titan-title-size-1{
    letter-spacing:4px;
    font-size:15px
}
.titan-title-size-2{
    line-height:1.3;
    letter-spacing:3px;
    font-size:18px;
    opacity:.8
}
.titan-title-size-3{
    letter-spacing:16px;
    font-size:46px
}
.titan-title-size-4{
    letter-spacing:24px;
    font-weight:400;
    font-size:48px
}
.agency-page-header:before{
    background:transparent
}
.about-page-header:before{
    background:rgba(2,2,2,0.2)
}
.service-page-header:before{
    background:rgba(2,2,2,0.1)
}
.pricing-page-header{
    background-position:40% 14%;
    background-repeat:no-repeat
}
.pricing-page-header:before{
    background:rgba(2,2,2,0.6)
}
.gallery-page-header{
    background-position:50% 0%;
    background-repeat:no-repeat
}
.gallery-page-header:before{
    background:rgba(2,2,2,0.2)
}
.contact-page-header{
    background-position:13% 45%;
    background-repeat:no-repeat
}
.contact-page-header:before{
    background:rgba(2,2,2,0.5)
}
.faq-page-header:before{
    background:rgba(2,2,2,0.15)
}
.blog-page-header{
    background-position:50% 24%;
    background-repeat:no-repeat;
    height:300px;
}
.blog-page-header:before{
    background:rgba(2,2,2,0.3)
}
.restaurant-menu-bg:before{
    background:rgba(2,2,2,0.4)
}
.restaurant-page-header:before{
    background:rgba(0,0,0,0.45)
}
.restaurant-image-overlay:before{
    background-color:rgba(2,2,2,0.25)
}
.portfolio-page-header{
    background-position:50% 50%
}
.portfolio-page-header:before{
    background:rgba(45,45,45,0.45)
}
.landing-header:before{
    position:absolute;
    background:linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(119,47,109,0.52) 95%, rgba(115,35,105,0.58) 100%);
    content:" ";
    height:100%;
    width:100%;
    left:0;
    top:0
}
.banner-img{
    margin-top:-145px
}
.shop-page-header:before{
    background:rgba(34,34,34,0.3)
}
.followus {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    margin-left: 50%;
    transform: translateX(-50%);
    margin-bottom: 0;
    padding-left: 15px;
    padding-right: 15px;
    justify-content: center;
    padding-bottom: 40px;
    
}
@media screen and (max-width: 1482px){
    .followus {
        width:100%;
    }
}
@media screen and (max-width: 870px){
    .followus {
        padding: 0;
    }
}

.followus>.followbox {
    width: 19.4%;
    position: relative;
    overflow: hidden;
    margin:.3%;
}
@media (max-width: 1350px){
    /* .followus>.followbox{
        width: 20%;
        margin:0;
    } */
}

.followus>.followbox>a>figure>img{
    transition: all 1s;
}
.followus>.followbox:hover .followtitle{
    opacity: 1;
}

.followus>.followbox:hover>a>figure>img{
    transform: scale(1.2);
}
.followus>.followbox>a>figure>.followtitle{
    position: absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background: rgba(0,0,0,.25);
    transition: all 1s;
    opacity: 0;
}
.followus>.followbox>a>figure>.followtitle>p{
    position: absolute;
    margin-left: 50%;
    color: #fff;
    margin-top: 50%;
    transform: translate(-50%,-50%);
    font-size: 1vw;
    text-align: center;
    letter-spacing: 3px;
}
.followus>.followbox>a>figure>.followtitle>p:after{
    content: '';
    border-bottom: 1px solid #fff;
    position: absolute;
    width: 50%;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
}

@media screen and (max-width: 745px) {
    .followus .followbox {
        width: 100%;
    }
    .followus>.followbox>a>figure>.followtitle{
        opacity: 1;
        top: 50%;
        left: 50%;
        width: 96%;
        height: 96%;
        transform: translate(-50%,-50%);
    }
}
.footer{
    padding:0 0 10px 0
}
.footer p.copyright{
    margin:0;
}
.footer .footer-social-links{
    text-align:right
}
.footer .footer-social-links a{
    display:inline-block;
    padding:0 6px
}
#map-section{
    position:relative;
    height:450px;
    width:100%
}
#map{
    height:100%;
    width:100%
}
#map img{
    max-width:none
}
.features-item{
    margin:20px 0;
    text-align:center
}
.features-icon,.alt-features-icon{
    line-height:1.2;
    font-size:42px;
    color:#111
}
.features-title,.alt-features-title{
    text-transform:uppercase;
    letter-spacing:2px;
    font-weight:400;
    font-size:14px;
    color:#111;
    margin:16px 0 15px
}
.alt-features-item{
    position:relative;
    padding-left:55px;
    margin:65px 0 0 0
}
.alt-features-icon{
    position:absolute;
    height:40px;
    width:40px;
    left:0;
    top:0;
    text-align:center;
    line-height:40px;
    font-size:28px
}
.alt-features-title{
    font-size:13px;
    margin:0 0 10px
}
.content-box{
    margin:20px 0;
    text-align:center
}
.content-box-title{
    font-weight:400;
    font-size:18px;
    color:#111;
    margin:16px 0 15px
}
.team-item{
    position:relative;
    text-align:center
}
.team-image{
    position:relative;
    overflow:hidden
}
.team-image img{
    width:100%
}
.team-image:after{
    position:absolute;
    background:transparent;
    content:" ";
    display:block;
    height:100%;
    width:100%;
    top:0;
    left:0;
    z-index:1
}
.team-detail{
    position:absolute;
    width:100%;
    opacity:0;
    bottom:100%;
    left:0;
    z-index:2;
    text-align:center;
    font-size:12px;
    color:#aaa;
    padding:20px
}
.team-detail h5{
    font-size:16px
}
.team-detail p{
    font-size:14px
}
.team-social a{
    display:inline-block;
    color:#aaa;
    padding:5px 6px
}
.team-social a:hover{
    color:#FFF
}
.team-descr{
    margin:20px 0 0
}
.team-name{
    font-size:14px;
    color:#111
}
.team-role{
    font-size:11px;
    color:#aaa
}
.team-item:hover .team-image:after{
    background:rgba(0,0,0,0.6)
}
.team-item:hover .team-detail{
    opacity:1;
    bottom:50%;
    -webkit-transform:translateY(50%);
    -ms-transform:translateY(50%);
    transform:translateY(50%)
}
.menu{
    border-bottom:1px dotted #e5e5e5;
    padding:0 0 10px;
    margin:0 0 20px
}
.menu-title,.menu-price{
    margin:0 0 10px;
    font-size:14px;
    color:#111
}
.menu-price-detail{
    position:relative;
    text-align:right
}
.price-table{
    background:#fff;
    border:1px solid #eaeaea;
    padding:25px 20px;
    margin:15px 0 30px;
    border-radius:2px;
    text-align:center
}
.price-table:hover{
    border-color:#CACACA
}
.price-table.best{
    margin:0 0 30px
}
.price-table .small{
    margin:0
}
.borderline{
    position:relative;
    background:#eaeaea;
    display:block;
    height:1px;
    width:100%;
    margin:20px 0 15px
}
.borderline:before{
    position:absolute;
    background:#eaeaea;
    content:"";
    bottom:-7px;
    left:50%;
    height:14px;
    width:14px;
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    margin-left:-7px
}
.borderline:after{
    position:absolute;
    background:#fff;
    content:"";
    bottom:-5px;
    left:50%;
    height:16px;
    width:16px;
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    margin-left:-8px
}
.price-table h4{
    color:#111;
    margin:0
}
.price-table p.price{
    font-size:60px;
    color:#111;
    padding:0;
    margin:0 0 0 -10px
}
.price-table p.price span{
    display:inline-block;
    vertical-align:top;
    font-size:16px;
    padding-top:25px
}
.price-details{
    list-style:none;
    padding:0;
    margin:0 0 23px
}
.price-details li{
    padding:7px 0
}
.price-details li>span{
    text-decoration:line-through;
    color:#aaa
}
.count-item{
    text-align:center
}
.count-icon{
    line-height:1.2;
    font-size:42px
}
.video-box{
    text-align:center;
    padding:40px 0
}
.video-box-icon>a>i,.video-box-icon>a>span{
    line-height:1.8;
    font-size:40px;
    color:#fff
}
.video-title{
    letter-spacing:4px;
    font-size:30px;
    margin:10px 0 0
}
.video-subtitle{
    color:rgba(255,255,255,0.5)
}
.filter{
    text-align:center;
    list-style:none;
    padding:0;
    margin:0 0 70px
}
.filter>li{
    display:inline-block;
    padding:0 0 10px;
    margin:0 25px
}
.works-grid{
    list-style:none;
    padding:0;
    margin:0
}
.works-grid.works-grid-gut{
    margin:0 0 0 -10px
}
.works-grid.works-grid-gut .work-item{
    padding:0 0 10px 10px
}
.work-item{
    width:50%;
    float:left;
    margin:0
}
.works-grid-3 .work-item{
    width:33.3333%
}
.container{
    width:70%;
}
.navbar>.container{
    display: flex;
}
.navbar>.container,
.brand>.container,
#html_HelloBar>.container{
    width:100%;
}
@media screen and (max-width: 1482px) {
    .navbar>.container,
    .brand>.container,
    #html_HelloBar>.container{
        width:100%;
    }
}
@media screen and (max-width: 767px){
    .navbar>.container,
    .navbar .container .navbar-collapse.collapse ul.navbar-nav{
        /* display: unset; */
        flex-wrap: wrap;
    }
    
    
    .navbar .container .navbar-collapse.collapse ul.navbar-right{
        position: fixed;
        bottom: 0;
        left: 0;
        display: flex;
        width: 100%;
        height:55px;
        transform: translateZ(0);
    }
}
.module .container{
    width:60%;
}
@media screen and (max-width: 1352px) {
    .navbar>.container{
        width:100%;
    }
}
@media screen and (max-width: 1200px) {
    .module .container {
        width: 100%;
    }
}


.module>.container>.row>.left{
    font-size: 14px;
    letter-spacing: 2px;
}
.container .works-grid-3 .work-item{
    width:33.2%
}
.works-grid-4 .work-item{
    width:25%
}
.works-grid-5 .work-item{
    width:20%
}
.work-item>a{
    position:relative;
    display:block;
    overflow:hidden
}
.work-image{
    position:relative;
    overflow:hidden
}
.work-image img{
    display:block;
    overflow:hidden;
    width:100%
}
.work-image:after{
    position:absolute;
    display:block;
    content:"";
    height:100%;
    width:100%;
    top:0;
    left:0
}
.work-caption{
    width:100%;
    padding:0 20px;
    opacity:0;
    position:absolute;
    bottom:100%;
    left:0;
    text-align:center;
    overflow:hidden
}
.work-title{
    font-size:14px;
    color:#fff;
    margin:0 0 6px
}
.work-descr{
    color:#aaa
}
.work-item:hover .work-image:after{
    background:rgba(0,0,0,0.6)
}
.work-item:hover .work-image>img{
    -webkit-transform:scale(1.2);
    -ms-transform:scale(1.2);
    transform:scale(1.2);
}
.work-item:hover .work-caption{
    bottom:50%;
    opacity:1;
    z-index:3;
    -webkit-transform:translateY(50%);
    -ms-transform:translateY(50%);
    transform:translateY(50%)
}
.works-grid.works-hover-w .work-title{
    color:#111
}
.works-grid.works-hover-w .work-item:hover .work-image:after{
    background:rgba(255,255,255,0.8)
}
.works-grid.works-hover-g .work-image:after{
    opacity:0
}
.works-grid.works-hover-g .work-descr{
    color:#fff
}
.works-grid.works-hover-g .work-item:hover .work-image:after{
    background:#6fe29e;
    background:linear-gradient(135deg, rgba(111,226,158,0.8) 0%, rgba(91,218,209,0.8) 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#6fe29e', endColorstr='#5bdad1',GradientType=1 );
    opacity:1
}
.sliding-portfolio .work-item{
    width:100%
}
.work-details{
    margin:0 0 20px
}
.work-details-title{
    color:#111;
    margin:0 0 20px
}
.work-details ul{
    list-style:none;
    padding:0;
    margin:0
}
.work-details ul>li{
    border-bottom:1px dotted #c2c2c2;
    padding:0 0 5px;
    margin:0 0 5px
}
.callout-text{
    color:rgba(255,255,255,0.6)
}
.callout-title{
    font-weight:400;
    font-size:60px;
    color:#fff;
    margin:0
}
@media screen and (max-width:768px) {
    .callout-title {
        font-size:30px;
    }
}
.callout-btn-box{
    text-align:right;
    padding-top:4px
}
.request-cta{
    padding:50px 0px
}
.testimonial:before{
    background:rgba(2,2,2,0.4)
}
.testimonials-slider{
    position:relative
}
.testimonial-text{
    text-align:center;
    font-style:normal;
    font-size:18px
}
.testimonial-caption{
    text-align:center;
    padding:10px 0 0
}
.testimonial-title{
    font-size:14px
}
.testimonial-descr{
    color:rgba(255,255,255,0.5);
    font-size:11px
}
.gallery-item{
    position:relative;
    text-align:center;
    margin:0 0 20px
}
.gallery-image{
    position:relative;
    overflow:hidden
}
.gallery-image a.gallery{
    position:relative;
    display:block
}
.gallery-image img{
    display:block;
    overflow:hidden;
    width:100%
}
.gallery-image:after{
    position:absolute;
    background:transparent;
    content:" ";
    display:block;
    height:100%;
    width:100%;
    top:0;
    left:0;
    z-index:1
}
.gallery-caption{
    position:absolute;
    width:100%;
    opacity:0;
    bottom:100%;
    left:0;
    z-index:2;
    text-align:center;
    font-size:28px;
    color:#fff;
    padding:20px
}
.gallery-icon{
    background:rgba(255,255,255,0.2);
    border-radius:50%;
    height:50px;
    width:50px;
    font-size:24px;
    margin:0 auto
}
.gallery-icon i,.gallery-icon span{
    line-height:50px
}
.gallery-item:hover .gallery-image:after{
    background:rgba(0,0,0,0.6)
}
.gallery-item:hover .gallery-caption{
    opacity:1;
    bottom:50%;
    -webkit-transform:translateY(50%);
    -ms-transform:translateY(50%);
    transform:translateY(50%)
}
.gridtitle{
    /* height: 54px; */
    padding-bottom:35px;
    border-bottom: 1px solid rgb(218, 218, 218);
}
.gridtitle h3{
    margin:0;
    padding: 0;
    font-weight: 600;
}
.post{
    margin:0 0 80px
}
.post-title{
    line-height:1.4;
    font-size:22px;
    color:#111;
    margin:0
}
.post-header{
    margin:15px 0 ;    
}

.post-meta{
    font-size:14px;
    color: #666;
    font-weight: 600;
}
.post-entry{
    border-top:1px dotted #c2c2c2;
    padding-top:20px;
    margin-top:10px
}
.post-main{
    padding: 0 20px;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 8;
    -webkit-box-orient: vertical;
    height: 163px;
    margin-bottom: 25px;
}
.post-images-slider{
    position:relative
}
.post-images-slider .flex-control-nav{
    bottom:0
}
.post-thumbnail,.post-images-slider,.post-video{
    /* margin:0 0 20px */
}
.post-quote{
    background:#f5f5f5;
    text-align:center;
    padding:20px
}
.post-columns .post{
    margin:0 0 60px
}
.post-columns .post-header{
    /* margin:0 0 10px */
    padding-left: 20px;
    padding-right: 20px;
}
.post-columns .post-title{
    line-height:1.8;
    font-size:14px
}
.post-columns .post-entry{
    padding:10px 20px 0;
    margin:0 0 20px;
}
.post-columns .post-more{
    padding-left: 20px;
    padding-right: 20px;
}
.post-columns.wo-border .post-entry{
    border:0;
    padding:0
}
.post-columns .post-entry p:last-child{
    margin:0;
    display: -webkit-box;  
	overflow:hidden;
	text-overflow : ellipsis;
	-webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-weight: 600;
    letter-spacing: 1px;
    font-size: 14px;
}
.more-link:after{
    content:"\00BB";
    color:#666666;
    padding-left:5px
}
.pagination a{
    border:1px solid #eaeaea;
    display:inline-block;
    text-transform:uppercase;
    text-align:center;
    color:#999;
    padding:4px 12px
}
.pagination a.active{
    border-color:#CACACA
}
.progress{
    overflow:visible;
    height:4px
}
.progress-bar{
    position:relative
}
.progress-bar.pb-dark{
    background:#111
}
.progress-bar span{
    position:absolute;
    display:block;
    right:-0px;
    top:-24px;
    opacity:0;
    line-height:12px;
    font-size:12px;
    color:#111;
    padding:4px 0px
}
.progress-bar span:after{
    display:inline-block;
    content:"%"
}
.tab-content .tab-pane{
    padding:0
}
#html_pd_dialog .addToBagBox .addToBagBox-content .addToBagBox-body .tab-content .tab-pane{
    padding-top: 0;
}
.panel-title{
    font-size:14px
}
.panel-heading a{
    position:relative;
    display:block
}
.panel-heading a:after{
    position:absolute;
    content:"\f106";
    top:50%;
    right:0px;
    font-family:"FontAwesome";
    line-height:1;
    font-size:14px;
    margin-top:-7px
}
.panel-heading a.collapsed:after{
    content:"\f107"
}
.table-border>tbody>tr>td,.table-border>tbody>tr>th,.table-border>tfoot>tr>td,.table-border>tfoot>tr>th,.table-border>thead>tr>td,.table-border>thead>tr>th{
    border-color:#e5e5e5
}
.ds-table>tbody>tr>td,.ds-table>tbody>tr>th,.ds-table>tfoot>tr>td,.ds-table>tfoot>tr>th,.ds-table>thead>tr>td,.ds-table>thead>tr>th{
    border-top:0
}
.checkout-table{
    border:1px solid #e5e5e5
}
.checkout-table>tbody>tr>td,.checkout-table>tbody>tr>th,.checkout-table>tfoot>tr>td,.checkout-table>tfoot>tr>th,.checkout-table>thead>tr>td,.checkout-table>thead>tr>th{
    padding:12px
}
.checkout-table tr td,.checkout-table tr th{
    border-top:1px solid #e5e5e5;
    border-bottom:1px solid #e5e5e5;
    border-right:1px solid #e5e5e5;
    border-left:1px solid #e5e5e5
}
.checkout-table tbody tr td:first-child,.checkout-table tbody tr th:first-child{
    max-width:36px
}
.sidebar .widget{
    margin-bottom:60px
}
.sidebar .widget-title{
    color:#111
}
.widget .widget-title{
    border-bottom:1px dotted #eee;
    font-size:14px;
    padding:0 0 10px;
    margin:0 0 15px
}
.widget ul{
    list-style:none;
    padding:0;
    margin:0
}
.widget .icon-list li{
    padding:5px 0
}
.widget .icon-list li a:before{
    content:"\00BB";
    color:#eee;
    padding-right:5px
}
.widget-posts li{
    margin:0 0 15px;

    /* border-bottom: 1px solid #dadada; */
}
.widget-posts li:last-child{
    margin:0
}
.widget-posts-image{
    float:left;
    width:31.5%;
    margin-right:1.5%;
    margin-bottom:1.5%;
}

@media screen and (max-width: 767px){
    .brand .widget-title{
        cursor: pointer;
    }
    .brand .widget-title::after{
        display: inline-block;
        margin-left: 4px;
        font: normal normal normal 14px/1 FontAwesome;
        font-size: 9px;
        content: "\f107";
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
    }

}

.top>ul.widget-posts>.clearfix>.widget-posts-image{
    width:150px;
}
.top>ul.widget-posts li{
    margin:0;
    border-bottom: 1px solid #dadada;
}

.widget-posts-body{
    /* margin-left:74px */
}
.widget-posts-body>.widget-posts-title>a{
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    margin-top: 20px;
}
.search-box{
    position:relative
}
.tags a{
    background:#111;
    display:inline-block;
    font-size:10px;
    color:#fff;
    padding:4px 10px 4px 12px;
    margin:0 1px 4px;
    border-radius:2px
}
.tags a:hover{
    background:rgba(17,17,17,0.8)
}
.comments,.comment-form{
    margin:80px 0 0
}
.comments .comment-title,.comment-form .comment-form-title{
    border-bottom:1px dotted #c2c2c2;
    font-size:16px;
    color:#111;
    padding-bottom:15px;
    margin:0 0 20px
}
.comment-author{
    font-size:14px;
    margin:0 0 10px
}
.comment-avatar{
    width:55px;
    float:left;
    margin-top:10px
}
.comment-avatar img{
    border-radius:50%
}
.comment-content{
    padding-top:5px;
    margin-left:75px;
    margin-bottom:30px
}
@media (min-width: 768px){
    .comment .comment{
        margin-left:75px
    }
}
.client-logo{
    opacity:.5
}
.client-logo:hover{
    opacity:1
}
.shop-item{
    text-align:center;
    margin:0 0 40px
}
.shop-item-image{
    position:relative;
    overflow:hidden
}
.shop-item-image img{
    width:100%
}
.shop-item-detail,.shop-item-image:after{
    transition:all 0.4s ease-in-out 0s
}
.shop-item-image:after{
    position:absolute;
    display:block;
    content:"";
    height:100%;
    width:100%;
    left:0;
    top:0
}
.shop-item-detail{
    position:absolute;
    width:100%;
    left:0;
    bottom:100%;
    padding:20px;
    opacity:0;
    z-index:2;
    text-align:center;
    font-size:12px;
    color:#aaa
}
.shop-item-title{
    font-weight:400;
    font-size:14px;
    color:#111;
    margin:15px 0 5px
}
.shop-item:hover .shop-item-image:after{
    background:rgba(255,255,255,0.7)
}
.shop-item:hover .shop-item-detail{
    opacity:1;
    bottom:50%;
    -webkit-transform:translateY(50%);
    -ms-transform:translateY(50%);
    transform:translateY(50%)
}
.ex-product{
    opacity:.7;
    transition:all 0.4s ease-in-out 0s
}
.ex-product:hover{
    opacity:1
}
.product-gallery{
    list-style:none;
    padding:0;
    width:100%;
    margin:10px 0 0
}
.product-gallery li{
    display:inline-block;
    width:15%;
    margin:0 5px
}
.product-gallery li:first-child{
    margin-left:0
}
.product-title{
    margin:0 0 20px;
    color:#111
}
.star,.star-off{
    margin-bottom:5px;
    color:#f1c40f
}
.star-off{
    color:#e5e5e5
}
.amount{
    font-size:32px;
    color:#111
}
.reviews{
    margin:0
}
.showcase-page .showcase-page-header{
    background-color:rgba(2,2,2,0.7)
}
.showcase-page .content-box{
    display:block;
    margin-bottom:45px
}
.showcase-page .content-box .content-box-image{
    border-radius:6px;
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
    overflow:hidden;
    box-shadow:1px 2px 10px rgba(0,0,0,0.15);
    margin-bottom:15px;
    transition:0.35s ease-out;
    -webkit-transition:0.35s ease-out;
    -moz-transition:0.35s ease-out
}
.showcase-page .content-box .content-box-image:hover{
    transform:translate3d(0, -10px, 0);
    -webkit-transform:translate3d(0, -10px, 0);
    box-shadow:0 23px 40px rgba(0,0,0,0.2)
}
.documentation-page{
    font-size:14px
}
.documentation-page .pln{
    color:#000
}
.documentation-page pre.prettyprint{
    border:1px solid #888;
    padding:15px
}
.documentation-page ol.linenums{
    margin-top:0;
    margin-bottom:0
}
.documentation-page li.L0,.documentation-page li.L1,.documentation-page li.L2,.documentation-page li.L3,.documentation-page li.L5,.documentation-page li.L6,.documentation-page li.L7,.documentation-page li.L8{
    list-style-type:none
}
.documentation-page li.L1,.documentation-page li.L3,.documentation-page li.L5,.documentation-page li.L7,.documentation-page li.L9{
    background:#eee
}
.documentation-page .com{
    color:#800
}
.documentation-page .lit{
    color:#066
}
.documentation-page .pun,.documentation-page .opn,.documentation-page .clo{
    color:#660
}
.documentation-page .fun{
    color:red
}
.documentation-page .str,.documentation-page .atv{
    color:#080
}
.documentation-page .kwd,.documentation-page .tag{
    color:#008
}
.documentation-page .typ,.documentation-page .atn,.documentation-page .dec,.documentation-page .var{
    color:#606
}
.documentation-page a{
    color:#19B5FE
}
.documentation-page a:hover{
    color:#1C92C9
}
@media (min-width: 768px){
    .navbar-transparent{
        /* background:transparent; */
        box-shadow: none;
        border:none !important;
        /* padding-bottom:15px;
        padding-top:15px; */
    }
    .navbar-custom .dropdown-menu{
        position:absolute;
        display:block;
        visibility:hidden;
        opacity:0;
        left:0;
        transition:all .0001s
        /* width:100vw;
        height: 50vh;
        display: flex;
        justify-content: center; */
    }

    @media screen and (max-width: 1024px) {
        .navbar-custom .dropdown-menu{
            width:100vw;
            height:100vh;
            display: flex;
            justify-content: center;
            flex-wrap:wrap;
        }
    }
    .navbar-custom .open>.dropdown-menu{
        visibility:visible;
        opacity:1
    }
    .navbar-custom .dropdown-menu .dropdown-toggle:after{
        position:absolute;
        display:block;
        right:9px;
        top:50%;
        margin-top:-6px;
        font:normal normal normal 14px/1 FontAwesome;
        font-size:9px;
        content:"\f105";
        text-rendering:auto;
        -webkit-font-smoothing:antialiased;
        -moz-osx-font-smoothing:grayscale
    }
    .navbar-right .dropdown-menu{
        right:auto;
        left:0;
    }
    .comment .comment{
        margin-left:75px
    }
}
@media (max-width: 1200px){
    .alt-features-item{
        margin:20px 0 0
    }
}
@media (max-width: 1050px){
    .navbar-custom{
        letter-spacing:1px
    }
}
@media (max-width: 991px){
    .navbar-custom{
        letter-spacing:0;
        text-align: center;
    }
    .titan-title-size-3{
        letter-spacing:8px;
        font-size:36px
    }
    .titan-title-size-4{
        letter-spacing:12px;
        font-size:38px
    }
    .work-item,.works-grid-3 .work-item,.container .works-grid-3 .work-item,.works-grid-4 .work-item,.works-grid-5 .work-item{
        width:50%
    }
    .side-image{
        position:relative;
        height:300px
    }
}
@media (max-width: 767px){
    .navbar-custom .navbar-nav{
        letter-spacing:3px;
        margin: 0;
    }
    
    .navbar-custom .navbar-nav .open .dropdown-menu .dropdown-header,.navbar-custom .navbar-nav .open .dropdown-menu>li>a{
        padding:10px 25px
    }
    .navbar-custom .navbar-nav .open .dropdown-menu .dropdown-menu .dropdown-header,.navbar-custom .navbar-nav .open .dropdown-menu .dropdown-menu>li>a{
       padding: 10px 28px;
    }
    .navbar-custom .navbar-nav .open .dropdown-menu .dropdown-menu>li>a::before{
        /* content:"- "; */
    }

    .navbar-custom li a,.navbar-custom .dropdown-search{
        /* border-bottom:1px solid rgba(73,71,71,0.15) !important */
    }
    .navbar-custom .dropdown-toggle:after,.navbar-custom .dropdown-menu .dropdown-toggle:after{
        right:7px;
        content:"\f107"
    }
    .navbar-custom .nav>.open>.dropdown-toggle:after,.navbar-custom .dropdown-menu .dropdown.open .dropdown-toggle:after{
        right:7px;
        content:"\f106"
    }
    .navbar-custom .navbar-nav>li:last-child.navbar-cart>a{
        padding-left:15px
    }
    .navbar-custom .cart-item-number{
        display:none
    }
    .navbar-custom .navbar-cart>a:after{
        content:"\f107"
    }
    .navbar-custom .navbar-cart-item a{
        border:0 !important
    }
    .dropdown-menu.cart-list{
        text-align:left;
        border-bottom:1px solid rgba(73,71,71,0.15) !important
    }
    .navbar-cart-item{
        border:none;
        border-bottom:1px solid rgba(73,71,71,0.15) !important;
        padding-bottom:10px
    }
    .navbar-cart-img{
        display:none
    }
    .navbar-cart-title{
        white-space:normal;
        padding:0;
        margin-left:0
    }
    .titan-title-size-1{
        letter-spacing:2px;
        font-size:14px
    }
    .titan-title-size-2{
        line-height:1.3;
        letter-spacing:2px;
        font-size:16px;
        opacity:.8
    }
    .titan-title-size-3{
        letter-spacing:4px;
        font-size:26px
    }
    .titan-title-size-4{
        letter-spacing:6px;
        font-size:28px
    }
    .features-item{
        margin:0 0 30px
    }
    .alt-features-item{
        padding-left:0;
        margin:0 0 30px;
        text-align:center
    }
    .alt-features-icon{
        position:static;
        width:auto;
        margin:0 auto 8px
    }
    .callout-text{
        margin:0 0 30px
    }
    .callout-text,.callout-btn-box{
        text-align:center
    }
    .sidebar{
        margin-top:50px
    }
    .widget{
        margin-bottom:60px
    }
    .post.mb-0{
        margin-bottom:40px !important
    }
    
    .footer{
        text-align:center;
        margin-bottom: 55px;
    }
    .copyright,.footer-social-links{
        text-align:center;
        margin:10px 0
    }
    .side-image-text{
        padding-left:15px;
        padding-right:15px
    }
    .menu-title,.menu-detail,.menu-price-detail{
        text-align:center
    }
    .align-center-sm{
        text-align:center
    }
    .align-left-sm{
        text-align:left
    }
}
@media only screen and (max-width: 480px){
    .work-item,.works-grid-3 .work-item,.works-grid-4 .work-item,.works-grid-5 .work-item{
        width:100%
    }
}


/* index.html-event */
#event_slider_scroll {
    top: 0;
    left: -250px;
    width: 250px;
    position: fixed;
	z-index: 9999;
	transition: all 1s;
}

#event_slider_content {
    background: #fff;
    text-align: center;
    padding: 70px 0 20px;
    background: #fff;
    filter: alpha(opacity=30)\9;
    background-color: hsla(0, 0%, 100%, .3);
	box-shadow: 0 3px 1px #ddd;
    height: 100vh;
    overflow: auto;

}

#event_slider_content::-webkit-scrollbar {
    width: 6px;
}


#event_slider_content::-webkit-scrollbar-track {
    background: #eee; 
}
 

#event_slider_content::-webkit-scrollbar-thumb {
    background: #ccc; 
    border-radius:10px;
}

#event_slider_content::-webkit-scrollbar-thumb:hover {
    background: #555; 
}


#event_content {
    background: #fff;
    text-align: center;
    padding-top: 140px
}

#event_tab {
    position: absolute;
    top: 300px;
    right: -20px;
    width: 20px;
    background: #737373;
    color: #fff;
    text-align: center;
    padding: 9px 0;
    -moz-border-radius-topright: 5px;
    -moz-border-radius-bottomright: 5px;
    -webkit-border-top-right-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    opacity: .6;
    /* -webkit-animation-name: pulse;
    animation-name: pulse;
    animation-duration: 1.2s;
    animation-iteration-count:infinite; */
    cursor: pointer;
}

#event_tab span {
    display: block;
    height: 9pt;
    padding: 1px 0;
    line-height: 9pt;
    text-transform: uppercase;
    font-size: 9pt
}
#event_slider_scroll:hover{
	left:0;
}
#event_slider_content>.event_content>a>img{
    border:1px solid transparent;
    transition: all 1s;
}
#event_slider_content>.event_content>a>img:hover{
    /* animation-name: pulse;
    animation-duration: 1.2s;
    animation-iteration-count: infinite;
    cursor: pointer; */
    border:1px solid #333;
}

/* followus icon */
.follow-us {
    position: fixed;
    z-index: 999;
    top: 28%;
    right: 5px;
}

.follow-us h5 {
    background-color: #000;
    color: #fff;
    text-align: center;
    font-size: 9pt;
    margin-bottom: 5px;
    padding: 5px 5px 3px
}

.follow-us .switch {
    text-align: center;
    font-size: 24px;
    font-weight: 700;
    height: 24px;
    line-height: 24px;
    cursor: pointer
}

.follow-us .folow-icons {
    list-style: none;
    height: 350px;
    overflow: hidden;
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
    margin: 0;
    padding: 0
}

.follow-us .folow-icons li {
    width: 2pc;
    overflow: hidden;
    margin: 0 auto;
    transition: all .5s;
    opacity: .9;
    margin-top: 5px;
    position: relative;
}
.follow-us .folow-icons li:nth-child(1){
    margin-top: 0;
}

.follow-us .folow-icons li a,
.follow-us .folow-icons li a img {
    width: 100%;
    height: auto;
}
.follow-us .folow-icons li a img:nth-child(2){
    position: absolute;
    top:0;
    opacity: 0;
    transition: .5s all;
}
.follow-us .folow-icons li:hover a img:nth-child(2){
    opacity: 1;
}

.follow-us .folow-icons li a:hover img{
    /* -webkit-animation-name: rubberBand;
    animation-name: rubberBand;
    animation-duration: 1.2s;
    animation-iteration-count:infinite; */
}

.follow-us .folow-icons.off {
    height: 0;
    overflow: hidden
}
 
@-webkit-keyframes pulse {
    from {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  
    50% {
      -webkit-transform: scale3d(1.1, 1.1, 1.1);
      transform: scale3d(1.1, 1.1, 1.1);
    }
  
    to {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  }
  
  @keyframes pulse {
    from {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  
    50% {
      -webkit-transform: scale3d(1.1, 1.1, 1.1);
      transform: scale3d(1.1, 1.1, 1.1);
    }
  
    to {
      -webkit-transform: scale3d(1, 1, 1);
      transform: scale3d(1, 1, 1);
    }
  }


  /* 直式三層nav */

  @media (min-width: 768px){
        
    .navbar-custom .dropdown-menu{
        position:absolute;
        display:block;
        visibility:hidden;
        opacity:0;
        left:0;
        width:auto;
        height:auto;
        display:block;
    }
}

@media screen and (max-width: 1024px) {
    .navbar-custom .dropdown-menu{
        width:auto;
        height:auto;
        /* display:block; */
    }
}
@media screen and (max-width: 767px) {
    .navbar-custom{
        /* top:0 ; */
    }
}
.nav > li {
    position: relative;
}

.navbar-custom .dropdown-menu>li>a {
    border-bottom:none !important;
    padding: 11px 35px 11px 15px;
    margin-right: 0;
    transition: all .5s;
    /* width:270px; */
}

.navbar-custom .dropdown-menu>li>ul>li {
    padding:0;
}


.dropdown, .dropup {
    position: relative;
}




/* nav phone */

.navbar-nav .open .dropdown-menu > li > a{
    position: relative;
}


/* ham animate */
.change span.icon-bar{
    transition: all .4s;
}
.change span.icon-bar:nth-child(2) {
    -webkit-transform: rotate(-45deg) translate(-6px, 6px);
    transform: rotate(-45deg) translate(-3px, 3px);
}

.change span.icon-bar:nth-child(3) {
    opacity: 0;
}

.change span.icon-bar:nth-child(4) {
    -webkit-transform: rotate(45deg) translate(-5px, -6px);
    transform: rotate(45deg) translate(-5px, -5px);
}
.position{
    position: fixed;
}
/* end-ham animate */

/* end - nav phone */


/* search */

.navbar-custom .dropdown-menu>li>i {
font-size:25px;
    position: absolute;
    top: 50%;
    right: 60px;
    transform: translateY(-50%);
}
.navbar-custom .dropdown-menu>li>input {
    border-radius: 2px;
    background:transparent;
    border:none;
    box-shadow: none;
    outline: none;
    width:500px;
    /* height: 45px; */
    font-size: 24px;
    line-height: 15px;
    color: #fff;
    /* margin-top: 15%; */
    margin: 50px;
    padding: 5px;
}
.navbar-custom .dropdown>a>input{
    border-radius: 2px;
    background:transparent;
    border:none;
    box-shadow: none;
    outline: none;
    display: none;
    padding: 4px;
    width: 100px;
}
@media screen and (max-width: 767px) {
    .navbar-custom .dropdown>a>input{
        display: inline-block;
    }
}


#search .searchinput::-webkit-input-placeholder { color: #333;letter-spacing: 2px; }
#search .searchinput:-moz-placeholder { color: #333; letter-spacing: 2px; }
#search .searchinput::-moz-placeholder { color: #333; letter-spacing: 2px;}
#search .searchinput:-ms-input-placeholder { color: #333;letter-spacing: 2px; }

#phonesearch .searchinput:-ms-input-placeholder { color: #666;letter-spacing: 2px; }
#phonesearch .searchinput::-webkit-input-placeholder { color: #666;letter-spacing: 2px; }
#phonesearch .searchinput:-moz-placeholder { color: #666; letter-spacing: 2px; }
#phonesearch .searchinput::-moz-placeholder { color: #666; letter-spacing: 2px;}

/* end - search */

/* end - 直式三層nav */
  


/* brand-area */

section.brand-section{
    position: relative;
    width: 1500px;
    max-width: 100%;
    display: flex;
    justify-content: left;
    flex-wrap: wrap;
    margin: 50px auto 180px;
    font-family: "Roboto Condensed", sans-serif, "微軟正黑體";
}
section.brand-section h2,#html_ig>section>h2{
    font-size: 58px;
    color: #111;
    font-weight: bold;
    font-family: "Roboto Condensed", sans-serif, "微軟正黑體";
}
section.brand-section>h2{
    text-align: left;
}
section.brand-section h3{
    font-family: "Roboto Condensed", sans-serif, "微軟正黑體";
}
section.brand-section>div{
    width: 100%;
    border-top:1px solid #aaa;
    border-bottom:1px solid #aaa
}
section.brand-section>section{
    width: 100%;
}
section.brand-section .section-top{
    width: 100%;
    /* height: 500px; */
    display: flex;
}
section.brand-section .section-top>.pic{
    width: 45%;
}
section.brand-section .section-top .btn{
    width: 55%;
}

* {box-sizing: border-box}
     
        
/* brand-section tab */
section.brand-section .tab {
  float: left;
  /* background-color: #f1f1f1; */
  padding: 8px 0px;
  letter-spacing: 0;
  margin-left: 16px;
}
section.brand-section .tab .tab-area{
    display: flex;
    border-bottom: 1px solid #ccc;
}
section.brand-section .tab .tab-area .tab-area-tittle{
    flex: 9;
    text-align: left;
    padding: 8px 0;
    color: #000;
}
section.brand-section .tab .tab-area .tab-area-tittle p{
    margin:0;
}
section.brand-section .tab .tab-area .tab-area-tittle button{
    border:0;
    border-bottom: 1px solid #000;
    background-color: #fff;
    padding: 0;
    margin-top: 20px;
    font-size: large;
    font-weight: 600;
    letter-spacing: 0;
}
section.brand-section .tab .tab-area .tab-area-pic{
    flex: 3;
    margin: 0 0px 10px;
}

section.brand-section .tab button.tablinks {
    display: block;
    background-color: inherit;
    color: #aaa;
    padding: 10px 0;
    width: 100%;
    border: none;
    outline: none;
    text-align: left;
    cursor: pointer;
    font-size: 24px;
    border-bottom: 1px solid #ccc;
    position: relative;
}
section.brand-section .tab button.tablinks:nth-last-child(1){
    border-bottom:none
}
section.brand-section .tab button.tablinks::before{
    content: '';
    border: solid #aaa;
    border-width: 0px 2px 0 0;
    display: inline-block;
    padding: 11px;
    position: absolute;
    right: 12px;
    top: 38%;
    transform: translateY(-50%) rotate(45deg);
    transition: all .2s;
}
section.brand-section .tab button.tablinks::after{
    content: '';
    border: solid #aaa;
    border-width: 0px 2px 2px 0;
    display: inline-block;
    padding: 6px;
    position: absolute;
    right: 8px;
    top: 49%;
    transform: translateY(-50%) rotate(-90deg);
    transition: all .2s;
}


section.brand-section .tab button.tablinks:hover,.tab button.tablinks.active {
  /* background-color: #ddd; */
  color:#000;
  font-weight: 600;
}
section.brand-section .tab button.tablinks:hover::after, .tab button.tablinks:active::after{
    content: '';
    border: solid #000;
    border-width: 0px 2px 2px 0;
    display: inline-block;
    padding: 6px;
    position: absolute;
    right: 8px;
    top: 49%;
    transform: translateY(-50%) rotate(-45deg);
}
section.brand-section .tab button.tablinks:hover::before,.tab button.tablinks:active::before{
    content: '';
    border: solid #000;
    border-width: 0px 2px 0 0;
    display: inline-block;
    padding: 11px;
    position: absolute;
    right: 6px;
    top: 29%;
    transform: translateY(-49%) rotate(90deg);
    -webkit-transform: translateY(-49%) rotate(90deg);
    -moz-transform: translateY(-49%) rotate(90deg);
    -ms-transform: translateY(-49%) rotate(90deg);
    -o-transform: translateY(-49%) rotate(90deg);
}
section.brand-section.home .tab button.tablinks:hover::before,.tab button.tablinks:active::before{
    top:32%;
}
section.brand-section .tab button.tablinks.active {
    padding-left: 16px;
    /* background-color: #f1f1f1; */
    font-style: italic;
    background-color: #000;
    color: #fff;
}


section.brand-section .tabcontent {
  float: left;
  /* padding: 38px 0; */
  border-top: 1px solid #ccc;
  width: 100%;
  border-left: none;
  /* height: 300px; */
  display: none;
  color: #000;
    /* background-color: #f1f1f1; */
}
section.brand-section .tabcontent .owl-carousel.owl-drag .owl-item {
    padding: 5px;
}
section.brand-section .tabcontent .owl-carousel .owl-item img {

    /* padding: 3% 3% 20%; */
    /* background: #f1f1f1 !important; */
}
section.brand-section .tabcontent .owl-carousel.owl-drag .owl-item a {
    position: relative;
}
section.brand-section .tabcontent .owl-carousel.owl-drag .owl-item a h4{
    text-align: left;
    margin-bottom: 0;
    margin-top: 15px;
    font-size: 10pt;
}
section.brand-section .tabcontent .owl-carousel.owl-drag .owl-item a:hover h4{
    font-weight: 600;
    color:#000;
}
section.brand-section .tabcontent .owl-carousel.owl-drag .owl-item a h3{
    text-align: left;
    color: #333;
    margin-top: 0;
}
section.brand-section .tabcontent .owl-carousel.owl-drag .owl-item a h3 span:nth-child(2){
    color:#aa1010;;
    margin-left: 8px;
}
section.brand-section .tabcontent .owl-carousel.owl-drag .owl-item a h3 span:nth-last-child(2) {
    text-decoration: line-through;
}
section.brand-section .tabcontent .owl-carousel.owl-drag .owl-item a button{
    background: transparent;
    width: 44%;
    border: 1px solid #aaa;
    font-size: large;
    font-weight: 600;
    position: absolute;
    bottom:0;
    right: 0;
    color: #000;
}

section.brand-section .tabcontent .owl-carousel.owl-drag .owl-item a:hover{
    opacity: 1;
}

/* Clear floats after the tab */
.clearfix::after {
  content: "";
  clear: both;
  display: table;
}
@media screen and (max-width: 1500px) {
section.brand-section .tabcontent {
    padding: 6px 12px;
}}
@media screen and (max-width: 1028px) {

    section.brand-section .section-top,section.brand-section .tab{
        flex-wrap: wrap;
    }
    section.brand-section .section-top>div.pic,section.brand-section .section-top .btn{
        width: 100%;
    }
    section.brand-section .tab button.tablinks{
        padding: 4px 0;
    }
    section.brand-section .tab button.tablinks::before {
        right: 13px;
   }
    section.brand-section .tab button.tablinks:hover::before {
        top: 22%;
   }
   section.brand-section .tab .tab-area{
        display: none;
   }
   section.brand-section .tabcontent .owl-carousel.owl-drag .owl-item a button {
        width: 50%;
    }
}
@media screen and (max-width: 768px) {

    section.brand-section .tab button.tablinks{
        letter-spacing: 0pt;
        font-size: 20px;
    }
    section.brand-section .tabcontent .owl-carousel.owl-drag .owl-item a button {
        position: unset;
        width: 100%;
    }
}

/* end- brand-area */

/* KV輪波 */

.home-section-slider.module{
    width: 1500px;
    max-width: 100%;
    background-color: #fff; 
    padding:0
}
.home-section-slider .owl-carousel .owl-nav.disabled {
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    font-size: 30pt;
    opacity: .2;
}

.home-section-slider .owl-carousel .owl-nav .owl-prev,
.home-section-slider .owl-carousel .owl-nav .owl-next {
    position: absolute;
    color: #333;
    left: 2%;
    top: 50%;
    transform: translateY(-50%);
}

.home-section-slider .owl-carousel .owl-nav .owl-next {
    right: 2%;
    left: unset;
}

.home-section-slider .ex-product {
    opacity: 1
}

/* end-KV輪波 */