/* =========================== */
/* 字體設定*/
/*============================ */
body {
/*font-family:'Noto Sans TC','微軟正黑體',Microsoft JhengHei,'Open Sans', 'HelveticaNeue', 'Helvetica Neue', Helvetica, Arial, sans-serif;*/
/* font-weight:400;*/
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
#top .dashicons{font-family: "dashicons" !important;}
.post-edit-link{
display: block;
margin: 0 auto;
font-weight: bold;
text-align: center;
color: #FFF;
background: #3d71a1;
position: fixed;
left: 0;
bottom: 0;
z-index: 999999;
font-size: 13px;
padding: 11px 15px;
border-radius: 0 5px 0 0;
text-decoration: none!important;
opacity: 0.75;
}
.post-edit-link:hover{
opacity: 1;
}
/*.main_color, .main_color div, .main_color header, .main_color main, .main_color aside, .main_color footer, .main_color article, .main_color nav, .main_color section, .main_color span, .main_color applet, .main_color object, .main_color iframe, .main_color h1, .main_color h2, .main_color h3, .main_color h4, .main_color h5, .main_color h6, .main_color p, .main_color blockquote, .main_color pre, .main_color a, .main_color abbr, .main_color acronym, .main_color address, .main_color big, .main_color cite, .main_color code, .main_color del, .main_color dfn, .main_color em, .main_color img, .main_color ins, .main_color kbd, .main_color q, .main_color s, .main_color samp, .main_color small, .main_color strike, .main_color strong, .main_color sub, .main_color sup, .main_color tt, .main_color var, .main_color b, .main_color u, .main_color i, .main_color center, .main_color dl, .main_color dt, .main_color dd, .main_color ol, .main_color ul, .main_color li, .main_color fieldset, .main_color form, .main_color label, .main_color legend, .main_color table, .main_color caption, .main_color tbody, .main_color tfoot, .main_color thead, .main_color tr, .main_color th, .main_color td, .main_color article, .main_color aside, .main_color canvas, .main_color details, .main_color embed, .main_color figure, .main_color fieldset, .main_color figcaption, .main_color footer, .main_color header, .main_color hgroup, .main_color menu, .main_color nav, .main_color output, .main_color ruby, .main_color section, .main_color summary, .main_color time, .main_color mark, .main_color audio, .main_color video, #top .main_color .pullquote_boxed, .responsive #top .main_color .avia-testimonial, .responsive #top.avia-blank #main .main_color.container_wrap:first-child, #top .main_color.fullsize .template-blog .post_delimiter, .main_color .related_posts.av-related-style-full a{
font-family:'Noto Sans TC','微軟正黑體',Microsoft JhengHei,'Open Sans', 'HelveticaNeue', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
.footer_color .heading-color, .footer_color a.iconbox_icon:hover, .footer_color h1, .footer_color h2, .footer_color h3, .footer_color h4, .footer_color h5, .footer_color h6, .footer_color .sidebar .current_page_item>a, .footer_color .sidebar .current-menu-item>a, .footer_color .pagination .current, .footer_color .pagination a:hover, .footer_color strong.avia-testimonial-name, .footer_color .heading, .footer_color .toggle_content strong, .footer_color .toggle_content strong a, .footer_color .tab_content strong, .footer_color .tab_content strong a, .footer_color .asc_count, .footer_color .avia-testimonial-content strong, .footer_color div .news-headline, #top .footer_color .av-related-style-full .av-related-title, .footer_color .av-default-style .av-countdown-cell-inner .av-countdown-time, .footer_color .wp-playlist-item-meta.wp-playlist-item-title, #top .footer_color .av-no-image-slider h2 a, .footer_color .av-small-bar .avia-progress-bar .progressbar-title-wrap{
font-family:'Noto Sans TC','微軟正黑體',Microsoft JhengHei,'Open Sans', 'HelveticaNeue', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}*/
.main_color table, .main_color .widget_nav_menu ul:first-child>.current-menu-item, .main_color .widget_nav_menu ul:first-child>.current_page_item, .main_color .widget_nav_menu ul:first-child>.current-menu-ancestor, .main_color .pagination .current, .main_color .pagination a, .main_color.iconbox_top .iconbox_content, .main_color .av_promobox, .main_color .toggle_content, .main_color .toggler:hover, #top .main_color .av-minimal-toggle .toggler, .main_color .related_posts_default_image, .main_color .search-result-counter, .main_color .container_wrap_meta, .main_color .avia-content-slider .slide-image, .main_color .avia-slider-testimonials .avia-testimonial-content, .main_color .avia-testimonial-arrow-wrap .avia-arrow, .main_color .news-thumb, .main_color .portfolio-preview-content, .main_color .portfolio-preview-content .avia-arrow, .main_color .av-magazine .av-magazine-entry-icon, .main_color .related_posts.av-related-style-full a, .main_color .aviaccordion-slide, .main_color.avia-fullwidth-portfolio .pagination, .main_color .isotope-item.special_av_fullwidth .av_table_col.portfolio-grid-image, .main_color .av-catalogue-list li:hover, .main_color .wp-playlist, .main_color .avia-slideshow-fixed-height > li, .main_color .avia-form-success, .main_color .av-boxed-grid-style .avia-testimonial{
background:transparent;
}
.main_color .template-archives .tabcontainer a, #top .main_color .tabcontainer .tab:hover, #top .main_color .tabcontainer .tab.active_tab{ color: #333; font-size: 15px;}
.main_color .sidebar_tab, .main_color .tabcontainer .tab { font-size: 15px;}
/* Grid Fix */
/*div .av_one_fourth { margin-left: 2%; width: 23%;}
div .av_one_third {margin-left: 2%; width: 31%;}*/
/* =====補充社群功能===== */
/*line*/
#top #wrap_all .av-social-link-line:hover a{color:#fff; background-color:#75c93c; }
/*blog*/
#top #wrap_all .av-social-link-blog:hover a{color:#fff; background-color:#3e91d1; }
/* =====多國語系圖示=====
需要在選單上加入『ms-lang』參數
*/
#top #header #header_main .ms-lang > a > .avia-menu-text{ background:url("/wp-content/themes/iwebtw/images/lang.png") no-repeat 0 center; background-size:15px auto; padding: 0 0 0 25px;}
#header_main #avia-menu > .menu-item-language{
background:url("/wp-content/themes/iwebtw/images/lang.png") no-repeat 0 center;
background-size:15px auto;
padding: 0 0 0 15px;
margin: 0 0 0 25px;
}
#top #header #header_main .av-language-switch-item{display: none;}
/* =========================== */
/* 網頁路徑*/
/*============================ */
/* =====路徑不顯示文章名稱===== */
.breadcrumb-trail .trail-before{display: none;}
/*.breadcrumb-trail .trail-end{ display: none;}*/
/*樣式修改*/
#top .title_container{ background: none;}
#top .title_container .container{ min-height: inherit; padding-top: 10px;}
.title_container .breadcrumb{ left: 0; right: inherit; display: inline-block; position: static; }
.title_container .breadcrumb{
font-size: 13px;
}
/* ============================= */
/* 版型&系統優化*/
/*============================== */
/*字體定義*/
h1, h2, h3, h4, h5, h6{
font-weight: 500;
}
/*logo-站內使用尺寸最大250px*/
#top #wrap_all .website-logo-tag{
max-width: 250px;
}
a{
text-decoration: none;
}
/*表底版型優化*/
#footer-page{
background: #fff;
}
#footer-page{
/*border-top: 1px solid #e1e1e1;*/
display: inline-block;
width: 100%;
float: left;
}
#top #wrap_all .footer-con-tag{
border-radius: 100px 0 0 0;
}
@media only screen and (max-width: 767px) {
/* Add your Mobile Styles here */
#top #wrap_all .footer-con-tag {
border-radius: 25px 0 0 0;
}
}
#top label{
font-weight: bolder;
}
strong, b {
font-weight: bolder;
}
/*--------------------
表頭優化
--------------------*/
.av_minimal_header #header_main_alternate {
border: #c7c7c7 1px solid;
}
#top .av_header_transparency #header_main_alternate{
border-top: rgba(255, 255, 255, 0.3) 1px solid;
}
/*圖示版白*/
.html_header_transparency.html_header_with_border #top #wrap_all .av_header_transparency .social_bookmarks li a,
.html_header_transparency #top #wrap_all .av_header_transparency .social_bookmarks li a{
background: transparent;
border: 1px solid #fff;
}
/*--------------------
表頭優化END
--------------------*/
/*電腦版Logo*/
#top #wrap_all #header_main .logo{
padding: 15px 0;
}
@media only screen and (min-width: 768px) and (max-width:1100px) {
#top #wrap_all #header_main .logo{
width: 35%;
padding: 15px 0;
}
}
@media only screen and (max-width:767px) {
/*手機版Logo縮小*/
#top #wrap_all #header_main .container{
width:90%;
max-width: 95%;
}
#top #wrap_all #header_main .logo{
width: 55%;
padding: 0;
}
#top #wrap_all #header_main .main_menu{
right:0;
}
#top #menu-item-search{}
/*購物車按鈕顯示Fix*/
.responsive #top #wrap_all #header_main .cart_dropdown{
top:0; border: 0;
}
.responsive #top #wrap_all #header_main .av-burger-menu-main{
padding:0;
}
#menu-item-shop .cart_dropdown_link{
padding: 0 0 0 38px;
}
}
@media only screen and (max-width:350px) {
#top #wrap_all #header_main .logo{
width: 50%;
}
}
/*========側邊欄========*/
#top #wrap_all .sidebar_left .inner_sidebar{
margin: 0;
}
.widget_categories{
height: auto;
border-radius: 10px;
background-color: #fff;
box-shadow: 0 5px 5px 0 rgba(0,0,0,.05);
padding: 30px 25px 35px 30px !important;
margin: 10px;
border: 1px solid #e1e1e1 !important;
}
#top #main .sidebar_left .sidebar{border: 0;}
.widget_categories .widgettitle{ font-size: 18px;line-height: 18px; margin: 0; padding: 0 0 25px;}
.widget_categories .widgettitle{
font-size: 1.3em;
padding: 0 0 20px 0;
display: inline-block;
width: 100%;}
.widget_categories{text-align: left;}
.widget_categories .cat-item > a{font-weight: bold;}
.widget_categories > ul > .cat-item > a{
background: none;
color: #333;
padding: 13px 30px 13px 0;
margin: -1px 0 0 0;
display: inline-block;
border: 0;
border-bottom: 1px solid #d8d8d8;
position: relative;
font-weight: 500;
width: 100%;
}
/*.widget_categories > ul > .cat-item >a:after{
content: '';
position: absolute;
border-left: 3px solid #cacaca;
height:17px;
top:15px;
left: 0;}*/
.widget_categories > ul > .current-cat > a,
.widget_categories > ul > .current-cat-parent > a,
.widget_categories > ul > .current-cat-parent > .children .current-cat a
{ color: #d9530b; font-weight: bold;}
.widget_categories .children .cat-item > a{ font-weight: normal; text-decoration: none;}
.widget_categories .cat-item > a:hover{text-decoration: none;}
.widget_categories .cat-item .children .cat-item{padding: 0 0 0 1em;}
#top .widget_categories > ul > li .children{padding: 15px 0 25px 0;}
#top .widget_categories > ul > li .children li{ padding: 5px 0px 5px 20px;}
#top .news-wrap li{border-bottom: 1px solid #d8d8d8;}
/*>>>預設不顯示子分類設定*/
#top .widget_categories > ul > li .children{display: none;}
/*>>>預設不顯示子分類設定-主選單下顯示子分類*/
#top .widget_categories > ul > li.current-cat .children,
#top .widget_categories > ul > li.current-cat-parent .children{
display: block;
}
/*表底連結無下底線*/
#top .av_inherit_color a{text-decoration: none;}
/*========圖標列表========*/
#top .av-iconlist-small li{ padding: 0 0 15px 0;}
#top .av-iconlist-small .iconlist_icon{ margin-right: 10px;}
/*========瀑布流相冊-黑邊修正========*/
.av-fixed-size .av-masonry-image-container, .av-fixed-size .av-masonry-outerimage-container{width: 101%;height: 101%;}
/*========按鈕邊線參數========*/
#top #wrap_all .product-back-con .avia-button{
border-radius: 2px;
padding: 12px 25px;
font-size: 13px;
min-width: auto;
}
#top #wrap_all .avia-button.avia-color-light, #top #wrap_all .avia-button.avia-color-dark{
border-width: 1px;
}
div .slideshow_caption h2 {
text-transform: none;
}
/* =========================== */
/*heading.css*/
/* =========================== */
.av-special-heading{ margin-top: 25px;}
#top .av-subheading_below{margin-top: 15px;}
/*h3專用標籤效果*/
#top #wrap_all h3.av-special-heading-tag{
border-bottom: 2px solid;
display: inline-block;
padding: 0 0 20px 0px;
margin: 0 0 5px 0;
}
/*預設版樣式，不顯示下底線*/
#top #wrap_all h1[itemprop="headline"]{padding: 0;border: 0; margin: 5px 0;}
#top #wrap_all h2[itemprop="headline"]{padding: 0;border: 0; margin: 5px 0;}
#top #wrap_all h3[itemprop="headline"]{padding: 0;border: 0; margin: 5px 0;}
#top #wrap_all h4[itemprop="headline"]{padding: 0;border: 0; margin: 5px 0;}
#top #wrap_all h5[itemprop="headline"]{padding: 0;border: 0; margin: 5px 0;}
#top #wrap_all h6[itemprop="headline"]{padding: 0;border: 0; margin: 5px 0;}
#top #wrap_all .av-section-color-overlay-wrap .av-inherit-size .av-special-heading-tag{
text-shadow: 0px 0px 2px #333;
/*font-weight: bold;*/
}
#top #wrap_all .av-section-color-overlay-wrap .av-subheading_below{
text-shadow: 0px 0px 2px #333;
font-weight: bold;
}
/*#top .av_header_with_border.av_header_transparency #header_main #avia-menu > li > a{ color: #FFF;}
#top .av_header_with_border.av_header_transparency #header_main #avia-menu > li > a .avia-menu-text{ color: #FFF;}*/
/* =========================== */
/*slideshow 字體效果*/
/* =========================== */
h2.avia-caption-title {text-shadow: 0px 0px 2px #333; font-weight: bold;}
.avia-caption-content p{text-shadow: 0px 0px 2px #333; font-weight: bold;}
/*資訊區*/
.sidebar_left .content{ border: 0;}
/* =========================== */
/*選單*/
/* =========================== */
/*選單-下拉-mega 標題*/
#header .mega_menu_title{
font-weight:500;
display: inline-block;
padding: 0 0 10px 0;
margin:0;
font-size: inherit;
position: relative;
min-height: 35px;
}
#top #header .mega_menu_title a{
font-size: inherit;
}
#header .mega_menu_title:after{
display: inline-block;
position: absolute;
left: 0;
top: 30px;
content: '';
width: 10px;
height: 2px;
background:#de5410;
}
/*選單-下拉-顏色還原成透明*/
#top #header .avia_mega_div .sub-menu,
#top #header .avia_mega_div > .sub-menu > li > ul > li a{
background:none;
font-weight: 300;
}
/*搜尋圖示-顏色*/
/*#top #wrap_all #menu-item-search > a{ font-size: 23px; color: #d15b40;}*/
/* =====作品集網格===== */
#top .avia-fullwidth-portfolio .grid-entry .inner-entry .grid-content{ text-align: center;}
#top .avia-fullwidth-portfolio .grid-entry .inner-entry .grid-content .entry-content-header h3 a{ font-size: 15px;}
/*=====Footer =====*/
body#top #footer .widgettitle {font-size: 18px;}
body#top #footer .textwidget {font-size: 15px;}
#top #wrap_all #footer-contactus a{ text-decoration: none;}
/*=====手機版支援TOP功能 =====*/
@media only screen and (max-width:991px) {
#scroll-top-link.avia_pop_class{ display: block; visibility: visible; }
}
/* =====全屏選單修正=====*/
#top .av-subnav-menu > li {padding: 15px 0;display: inline-block;font-size: 16px;}
/*=====固定手機版表頭=====*/
@media only screen and (max-width: 767px) {
.responsive #top #wrap_all #header{position: fixed;}
.responsive #top #main{margin:80px 0 0 0;}
}
/*=====L手機版 Footer ICON放大=====L*/
@media only screen and (max-width: 767px) {
#socket .social_bookmarks{ float: none; margin: 0; position: inherit; display: inline-block; width: 100%; text-align: left; }
#socket .social_bookmarks a{ color: #FFF; font-size: 35px; margin: 5px;}
#socket .social_bookmarks li{ margin: 15px 15px 15px 0; overflow: inherit; display: inline-block;float: none;}
}
/* =====ICON Grid補強===== */
@media only screen and (max-width: 991px) {
.avia-icongrid-flipbox li .avia-icongrid-front .avia-icongrid-inner {padding: 1.5em 0em;}
.avia-icongrid-flipbox li .avia-icongrid-front .avia-icongrid-inner, .avia-icongrid-flipbox li .avia-icongrid-flipback .avia-icongrid-inner{padding:0.5em;}
}
/* =========================== */
/* 購物車系補強*/
/*============================ */
/*購物車價錢調整*/
#top .single-product-summary .price span{
font-size: 26px;
font-family: 'noto sans tc', Helvetica, Arial, sans-serif;
}
#top .single-product-summary .price span.woocommerce-Price-amount{
margin:0;
}
#top .single-product-summary .price span.woocommerce-Price-currencySymbol{
font-size: 18px;
margin: 0 5px 0 0;
}
#top .price br{display: none;}
#top #wrap_all del{ margin: 0 5px 0 0 !important;}
@media only screen and (max-width:991px) {
#top #wrap_all del{display: none;}
}
#top .price, #top .price span, #top del, #top ins{font-size: 20px;}
#top #wrap_all .product_list_widget del,
#top #wrap_all .product_list_widget ins,
#top #wrap_all .product_list_widget .product-title{
font-size: 15px;
}
/*購物車距離FIX*/
div form.cart div.quantity{
min-width: auto;
}
/*不顯示貨幣NT$*/
/*#top .price span.woocommerce-Price-currencySymbol{display: none;}*/
/*側邊欄產品搜尋按鈕*/
.wp-element-button, .wp-block-button__link{
font-size: 13px;
width: 100%;
padding: 5px 10px;
background-color: #909090;
}
/*產品資訊頁面移除*/
#wrap_all #main .single-product-summary .cart{
overflow: unset!important;
}
/*排序及顯示產品*/
.sort-param > li > span, .sort-param > li > a{}
.main_color .sort-param > li > span, .main_color .sort-param > li > a, .main_color .sort-param ul{
background-color: #FFF;
/* border: 1px solid #d5d5d5;
border-radius:3px;*/
border: 0;
}
div .product-sorting .sort-param-count{ float: right; }
@media only screen and (max-width:991px) {
div .product-sorting .sort-param-count{ float: left; }
}
/* 產品分類上方圖片大小 */
@media only screen and (min-width:991px) {
#main #av_product_description { height: 350px;}
#main #av_product_description .av-section-color-overlay-wrap .content{ padding:120px 0;}
}
/*====
產品列表-側邊列表
====*/
#wrap_all .widget_product_categories h3{font-size: 18px;line-height: 18px;margin: 0; padding: 0 0 25px;}
#top .widget_product_categories > ul > li > a{
background: none;
color: #333;
padding:10px 30px 10px 0;
margin:-3px 0 0 0;
display: inline-block;
border: 0;
border-top: 1px solid #d8d8d8;
border-bottom: 1px solid #d8d8d8;
position: relative;
width: 100%;
}
/*#top .widget_product_categories > ul > li > a:after{
content:'';
position: absolute;
border-left: 3px solid #cacaca;
height:17px;
top:17px;
left: 0;
}*/
#top .product-categories .cat-item{ position: relative;}
#top .product-categories > .current-cat > a,
#top .product-categories > .cat-parent > a,
#top .product-categories > .current-cat-parent .children .current-cat a
{ font-weight: bold; color: #d9530b;}
/*#top .widget_product_categories > ul > li.current-cat > a,
#top .widget_product_categories > ul > li.cat-parent > a{color: #d9530b;}*/
#top .widget_product_categories > ul > li > .children{padding: 15px 0 25px 0;}
#top .widget_product_categories ul .count{ position: absolute; right: 0; top: 7%;font-style: initial; font-size: 12px;}
#top .widget_product_categories a{text-decoration: none; width: 80%; display: inline-block;}
.widget_product_categories li a{ background-position: left 13px;}
#top .widget_product_categories a:hover{ color: #06467F;}
.woocommerce-widget-layered-nav > .widgettitle{ font-size: 18px;line-height: 18px; margin: 0;padding: 0 0 25px;}
.woocommerce-widget-layered-nav-list{}
.woocommerce-widget-layered-nav-list .wc-layered-nav-term{
display: inline-block; padding: 0;
border: 1px solid #d8d8d8;
margin: 0 10px 10px 0;
border-radius: 3px;
position: relative;
}
.woocommerce-widget-layered-nav-list .wc-layered-nav-term a{ display: inline-block;padding: 5px 20px;text-decoration: none; }
.woocommerce-widget-layered-nav-list .wc-layered-nav-term a:hover,
.woocommerce-widget-layered-nav-list .chosen a,
#top .woocommerce-widget-layered-nav-list .chosen a:hover{background-color: #d9530b; color: #FFF; }
#top .woocommerce-widget-layered-nav-list .chosen a:before{ color: #FFF;}
.woocommerce-widget-layered-nav-list .wc-layered-nav-term .count{
position: absolute; z-index:-1;
right: 10px;
top: 4px; font-style: initial; font-size: 12px;
display: none;
}
/*產品列表-預設圖片滿版*/
#wrap_all #main #page-thumb-fullimg img{ width:100%;}
/* 購物車系統列表-補強 */
.sidebar_left.sidebar{ text-align: left;}
.widget_product_categories li a{ font-size: 16px; }
.widget_product_categories .product-categories{ line-height: 2em;}
/*產品列表(色塊模式）*/
#top .av-caption-style-overlay .av-masonry-entry .av-masonry-entry-title {font-size: 1em;}
/*產品資訊頁-內縮1200px by 20240610*/
.single-product #wrap_all .template-shop .container{max-width: 1150px;}
/*產品資訊頁-相關產品-內縮1200px by 20240610*/
.single-product #wrap_all .avia-section-small .container{max-width: 1150px;}
/*產品描述*/
.woocommerce-product-details__short-description{ display: inline-block; margin:25px 0; width: 100%;}
/*產品專區規格區*/
#top .variations td{vertical-align: middle;}
#top .variations_form > table {margin: 30px 0 20px 0;}
#top .variations_form{
padding: 0;
border: 0;
background: none;
/* border-top: 1px solid #c8c8c8;
border-bottom: 1px solid #c8c8c8;*/
}
/* 價格選擇-顏色補強 */
#top .widget_price_filter .price_slider_wrapper .price_slider .ui-slider-handle{background-color: #003169;}
#top .main_color .widget_price_filter .ui-slider-horizontal .ui-slider-range{ background-color: #b8d9ff;}
#top .main_color .widget_price_filter .price_slider_wrapper .ui-widget-content{ margin-top:35px; margin-bottom: 20px;}
div .widget_price_filter .price_slider_wrapper .price_label{ display: inline-block; width: 100%;margin: 15px 0 0 0;}
/*產品報價-自定義顏色*/
/*#top .main_color .price,
.main_color .stock,
#top #wrap_all .main_color ins,
.main_color .products .product-category h3 .count,
.main_color .widget_layered_nav_filters .chosen a:before,
.main_color .widget_layered_nav .chosen a:before
{color: #ea0000;}
*/
/*購物車按鈕-自定義顏色*/
/*.cart_dropdown{ width: 55px; height: 55px;}
.header_color .cart_dropdown_first .cart_dropdown_link{line-height: 53px; font-size: 23px; color: #d15b40; }
#top .av-cart-counter.av-active-counter{ background: #be0000;}*/
/*加入購物車提示對話優化 by 20240610*/
#top div.woocommerce-message {
border-color: #eeeeee;
background-color: #e6e6e6;
color: #333333;
z-index: 100;
width: 100%;
opacity: 0.8;
padding: 20px 15% 20px 25px;
/* position: absolute;
top: 0;
left: 0;*/
}
@media only screen and (max-width: 767px) {
#top div.woocommerce-message {
width: 100%;
padding: 20px 45% 20px 25px;
}
}
/*購物車頁籤及系統底色*/
.main_color .woocommerce-tabs .tabs .active, .main_color div.product .woocommerce-tabs .panel, .main_color .activeslideThumb, .main_color #payment li, .main_color .widget_price_filter .ui-slider-horizontal .ui-slider-range, .main_color .avia_cart, .main_color form.login, .main_color form.register, .main_color .col-1, .main_color .col-2, .main_color .variations_form, .main_color .dynamic-title, .main_color .single-product-main-image .thumbnails a, .main_color .quantity input.qty, .main_color .avia_cart_buttons, #top .main_color .dropdown_widget .buttons, div .dropdown_widget .cart_list li:hover, .main_color .woocommerce-info, #top .main_color .chosen-container-single .chosen-single, #top .main_color .chosen-search input[type='text'], .main_color .chosen-results, .main_color .chosen-container .chosen-drop, #top .main_color .select2-container .select2-choice, .main_color .widget_layered_nav_filters .chosen a:hover, .main_color .widget_layered_nav .chosen a:hover, .main_color .woocommerce-MyAccount-navigation-link.is-active, .main_color .woocommerce-MyAccount-navigation-link:hover{ background: #FFF;}
/* 產品資訊頁頁籤 */
@media only screen and (max-width: 767px) {
.responsive #top .main_color .tabcontainer .active_tab {
background-color: #0070C7;
color: #FFF;
}
}
/*產品專區-完售樣式優化*/
#wrap_all #main .out-of-stock{
background-color: #8f8f8f;color: #ffffff;vertical-align: middle;float: left;
margin: 2px 0;min-width: 110px;padding: 15px;line-height: 1em;font-size: 12px;font-weight: bold;width: auto;
text-align: center;text-decoration: none;border: none;font-family: inherit;border-radius: 2px;
}
/* 補充社群功能-彩色 */
#top .social_bookmarks li{margin: 0 5px;}
#top .social_bookmarks li a{line-height: 28px;}
#top #wrap_all .av-social-link-line a{color:#fff; background-color:#75c93c; }
#top #wrap_all .av-social-link-whatsapp a{color:#fff; background-color:#6ce282; }
#top #wrap_all .av-social-link-rss a{color:#fff; background-color:#ffa133; }
#top #wrap_all .av-social-link-facebook a{color:#fff; background-color:#37589b; }
#top #wrap_all .av-social-link-twitter a{color:#fff; background-color:#46d4fe; }
#top #wrap_all .av-social-link-mail a{color:#fff; background-color:#9fae37; }
#top #wrap_all .av-social-link-dribbble a{color:#fff; background-color:#e44885; }
#top #wrap_all .av-social-link-linkedin a{color:#fff; background-color:#419cca; }
#top #wrap_all .av-social-link-search a{color:#fff; background-color:#222222; }
#top #wrap_all .av-social-link-gplus a{color:#fff; background-color:#de5a49; }
#top #wrap_all .av-social-link-behance a{color:#fff; background-color:#008cfa; }
#top #wrap_all .av-social-link-flickr a{color:#fff; background-color:#ff0086; }
#top #wrap_all .av-social-link-forrst a{color:#fff; background-color:#234317; }
#top #wrap_all .av-social-link-myspace a{color:#fff; background-color:#000000; }
#top #wrap_all .av-social-link-tumblr a{color:#fff; background-color:#345574; }
#top #wrap_all .av-social-link-vimeo a{color:#fff; background-color:#31baff; }
#top #wrap_all .av-social-link-youtube a{color:#fff; background-color:#a72b1d; }
#top #wrap_all .av-social-link-pinterest a{color:#fff; background-color:#cb2027; }
#top #wrap_all .av-social-link-skype a{color:#fff; background-color:#12a5f4; }
#top #wrap_all .av-social-link-instagram a{color:#fff; background-color:#a67658; }
#top #wrap_all .av-social-link-five_100_px a{color:#fff; background-color:#222222; }
#top #wrap_all .av-social-link-soundcloud a{color:#fff; background-color:#F76700; }
#top #wrap_all .av-social-link-xing a{color:#fff; background-color:#006567; }
#top #wrap_all .av-social-link-vk a{color:#fff; background-color:#597BA5; }
#top #wrap_all .av-social-link-reddit a{color:#fff; background-color:#FF4500; }
/*按鍵行-補強(圓形圖標)*/
#top #wrap_all .avia-slideshow-button,#top .avia-button,.html_elegant-blog .more-link, .avia-slideshow-arrows a:before {
border-radius:5px;
border-width:0px;
}
/* =====會員登入Bug修正===== */
#top form.login, #top form.register{ width: 100%; display: inline-block;}
/*=====最新消息列表優化=====*/
.avia-content-slider .slide-entry-title{
margin: 0 0 20px 0;
}
.avia-content-slider .slide-meta{margin: 0; padding: 0;}
.avia-content-slider .slide-image {
overflow: hidden;
margin-bottom: 30px;
border-radius: 10px;
}
.slide-entry-excerpt .read-more-link {
margin: 15px 0 0 0;
display: none;
}
.slide-entry-excerpt .read-more-link a{
color: #666;
border-bottom: 1px solid #b0b0b0;
text-decoration: none;
}
.slide-entry-excerpt .read-more-link .more-link-arrow{display: none;}
/*=====最新消息-橫式排版=====*/
.avia-content-slider .slide-entry-excerpt{
height: 5.2em;
margin: 10px 0 0 0;
}
/*不顯示作者*/
.text-sep-cat {display: none;}
.blog-author {display: none;}
/*相關連結美化*/
.related_posts.av-related-style-full a {
border: 0 !important;
background: transparent !important;
}
/*標籤*/
#wrap_all .entry-footer .blog-tags {
margin: 1.5em 0 3.5em 0;
display: inline-block;
width: 100%;
}
@media only screen and (min-width:991px){
.archive #wrap_all .slide-entry-wrap .slide-entry{
width: 95%;
display: flex;
padding: 0;
margin:10px;
border-radius: 10px;
background-color: #fff;
box-shadow: 0 5px 5px 0 rgba(0,0,0,.05);
padding:20px !important;
border: 1px solid #e1e1e1;
/* border-bottom: 1px solid #e1e1e1; */
}
.archive #wrap_all .slide-entry-wrap .slide-entry .slide-image{ width: 30%; margin: 0; }
.archive #wrap_all .slide-entry-wrap .slide-entry .slide-content{ width: 70%; padding: 0 0 0 35px;}
.archive #wrap_all .avia-content-slider .slide-entry-excerpt{ height: auto; max-height: 5em;}
.archive #wrap_all .avia-content-slider-inner .slide-entry-wrap{ margin: 0; padding: 0;}
.news-horizontal{}
.news-horizontal .slide-entry-wrap .slide-entry{
width: 95%;
display: flex;
padding: 0;
margin:10px;
border-radius: 10px;
background-color: #fff;
box-shadow: 0 5px 5px 0 rgba(0,0,0,.05);
padding: 20px !important;
border: 1px solid #e1e1e1;
/* border-bottom: 1px solid #e1e1e1; */
}
.news-horizontal .slide-entry-wrap .slide-entry .slide-image{ width:45%;margin: 0; }
.news-horizontal .slide-entry-wrap .slide-entry .slide-content{ width: 70%; padding: 0 0 0 35px;}
.news-horizontal .avia-content-slider .slide-entry-excerpt{ height: auto; max-height: 5em;}
.news-horizontal .avia-content-slider-inner .slide-entry-wrap{ margin: 0; padding: 0;}
}
@media only screen and (max-width:500px){
/*=====最新消息列表優化=====*/
/*系統樣式優化*/
.content, .sidebar{
padding-top: 20px;
padding-bottom: 20px;
}
.responsive #top #wrap_all .container{
width: 95%;
max-width:90%;
}
.responsive #top .sort_width_container{ margin:0; }
/*最新消息列表優化*/
.responsive #top #wrap_all .av_default_container_wrap .container .units{
padding: 20px 0 0 0;
}
.responsive #top #wrap_all #main .avia-content-grid-active .slide-entry-wrap{
width: auto; float: none; clear: both; display: inline;
}
/*單排*/
.responsive #top #wrap_all #main .avia-content-grid-active .slide-entry{
width:100%;
}
.responsive #top #wrap_all #main .avia-content-grid-active .slide-entry{
clear: none; float: left;padding:0; margin: 0 0 25px 0;
}
/*最新消息列表優化-單排-標題*/
.responsive #top #wrap_all #main .avia-content-grid-active .entry-content-header{
height:auto; overflow: hidden; font-size: 15px;
}
/*兩排*/
/*.responsive #top #wrap_all #main .avia-content-grid-active .slide-entry{
width: 50%;
}
.responsive #top #wrap_all #main .avia-content-grid-active .slide-entry{
clear: none; float: left;padding: 0 10px; margin: 0 0 25px 0;
}*/
/*最新消息列表優化-兩排-標題*/
/*.responsive #top #wrap_all #main .avia-content-grid-active .entry-content-header{
height: 3.8em; overflow: hidden; font-size: 15px;
}*/
/*最新消息列表優化-圖片*/
.responsive #top #wrap_all #main .avia-content-grid-active .slide-image{
margin: 0 0 10px 0;
}
/*最新消息列表優化-兩行-無描述*/
.responsive #top #wrap_all #main .avia-content-grid-active .slide-entry-excerpt{ display: none;}
}
/*=============================*/
/*最新消息-下拉選單*/
/*要顯示#menu-news 需到選單設定 news 選單*/
/*=============================*/
#after_submenu{border: 0;}
#wrap_all #main .news-dwlist-tag{border: 0;}
#wrap_all #main .news-dwlist-tag .av-subnav-menu{
border: 1px solid #bbb;
width: 250px;
margin: 55px auto 0 auto;
text-align: left;
border-radius: 3px;
}
#wrap_all #main .news-dwlist-tag .av-subnav-menu > li{
padding: 10px;
width: 100%;
font-size: 13px;
background: url(../images/dricon.png) no-repeat 205px 10px;
background-size: 20px auto;
}
#wrap_all #main .news-dwlist-tag .av-subnav-menu > li >a{
background: transparent;
}
#wrap_all #main .news-dwlist-tag .av-subnav-menu .sub-menu{
width: 100%;
}
/* =====JSON-LD===== */
#jd-breadcrumb{}
#jd-breadcrumb .breadcrumb li{ display: inline;}
#jd-breadcrumb .breadcrumb a{ display: inline;}
#jd-breadcrumb .breadcrumb a:after {content: "»";color: rgb(0, 0, 0); padding: 0 5px;}
/*目錄功能補強*/
#top .av-tab-with-image .av-inner-tab-title{ font-size: 15px; font-weight: bold;}
#top .av-catalogue-list .av-catalogue-item{ padding: 20px 0px;}
#top .av-catalogue-list li{ border: 0;}
.av-catalogue-list .av-catalogue-title{ padding:0 0 5px 0; margin: 0 0 10px 0; font-size: 15px; font-weight: bold; border-bottom:2px solid #9e9d9d; display: inline-block;}
.av-catalogue-list .av-catalogue-content{ font-size: 15px;}
/*選項卡訂製*/
.av-tab-no-icon.av-tab-no-image .av-inner-tab-title{ font-weight: bold; font-size: 16px; color: #333; }
.av-tab-section-tab-title-container .av-active-tab-title .av-inner-tab-title {color: #026087;}
.av-tab-section-tab-title-container{ border-bottom: 1px solid #333; background: none;padding: 25px 0 0 0;}
.av-tab-section-tab-title-container .av-active-tab-title .av-tab-arrow-container{
border-bottom:4px solid #026087;}
/*hover*/
.av-tab-section-tab-title-container .av-section-tab-title:hover .av-tab-arrow-container{
border-bottom:4px solid #026087;}
.av-tab-section-tab-title-container .av-active-tab-title:hover .av-tab-arrow-container{
border-bottom:4px solid #026087;}
/* ====================== */
/* 購物車系補強 for Woo4*/
/*======================*/
#top div div.product .woocommerce-tabs ul.tabs li a{
/*white-space: initial;*/
/*支援IE功能修正*/
white-space: nowrap;
}
#top .woocommerce-tabs .tabs li a{ margin: initial;}
/*相關產品底色沒有Fix*/
/*#top .av-product-class-minimal,
.avia-section.avia-section-small{
background: #FFF;
}*/
/*開發用*/
/*#top .products .thumbnail_container,
#top .products .thumbnail_container img,
#top .av-product-class-minimal,
.avia-section.avia-section-small{
border: 1px solid #333;
}*/
/*======產品專區列表，手機版模式單排======*/
/*@media only screen and (max-width:1024px){
.responsive #top #main .products .product {
margin: 0 0 20px 0; padding:0;
width: 100%;
float: left;
display: table;
}
}*/
/*======產品專區列表，手機版模式兩排======*/
.entry-content-wrapper ul.products li{
/* border: 1px solid #e3e3e3;*/
}
/*參數修改 by20240610*/
@media only screen and (max-width:767px){
/*產品雙排參數*/
.responsive #top #main .products{
display: flex;
flex-wrap: wrap;
}
.responsive #top #main .products .product {
margin: 0;
width: 50%;
display: flex;
flex-flow: column;
}
/*產品標題*/
#top .av-product-class-minimal .inner_product_header .woocommerce-loop-product__title{
font-size: 0.95rem;
}
/*價格*/
#top .price, #top .price span, #top del, #top ins{
font-size: 0.95rem;
font-weight: 500;
display: inline-block;
}
}
/*=========產品列表圖片自動縮放Fix=========*/
/*Woo預設模式Fix*/
/*inner_product main_color wrapped_style noLightbox av-product-class-*/
#top .products .av-product-class- { border-radius: 5px;}
#top .products .av-product-class- .woocommerce-LoopProduct-link::before{ padding: 100% 0 0 0;}
#top .products .av-product-class- .thumbnail_container{ height:71%; padding: 1%;}
#top .products .av-product-class- .thumbnail_container::before{padding:100% 0 0 0;}
#top .products .av-product-class- .thumbnail_container img{ max-height:100%;}
#top .products .av-product-class- .inner_product_header{ padding:0; min-height: auto; }
#top .products .av-product-class- .inner_product_header .woocommerce-loop-product__title{
padding: 15px 15px 0 15px;height: 3.6em; overflow: hidden;
}
#top .products .av-product-class- .avia_cart_buttons{ opacity:1;}
#top .template-shop .main_color .price{
padding:5px 5px 10px 5px;
display: inline-block;
width: 100%;
}
.inner_product_header .avia-arrow{display: none;}
@media only screen and (max-width:768px){
#top .products .av-product-class- .avia_cart_buttons{display:block;}
#top .products .av-product-class- .avia_cart_buttons .add_to_cart_button{width: 100%;}
#top .products .av-product-class- .avia_cart_buttons .show_details_button{ display: none;}
#top .products .av-product-class- .avia_cart_buttons .button-mini-delimiter{display: none;}
/*單排*/
#top .products .av-product-class- .thumbnail_container{ height:78%;}
/*雙排*/
/*#top .products .av-product-class- .thumbnail_container{ height: 68%;}*/
#top .products .av-product-class- .inner_product_header .woocommerce-loop-product__title{
font-size: 13px;
}
}
@media only screen and (max-width:500px){
/*單排*/
#top .products .av-product-class- .thumbnail_container{ height: 76%;}
/*雙排*/
/*#top .products .av-product-class- .thumbnail_container{ height: 60%;}*/
#top .products .av-product-class- .price span{ font-size: 13px;}
}
/*Woo預設模式-無按鈕Fix*/
/*inner_product main_color wrapped_style noLightbox av-product-class-no_button*/
#top .products .av-product-class-no_button .woocommerce-LoopProduct-link::before{ padding: 120% 0 0 0;}
#top .products .av-product-class-no_button .thumbnail_container{ height:70%;}
#top .products .av-product-class-no_button .thumbnail_container::before{padding:70% 0 0 0;}
#top .products .av-product-class-no_button .thumbnail_container img{ max-height: 90%;}
/*無邊線模式Fix*/
/*inner_product main_color wrapped_style noLightbox av-product-class-minimal*/
/*#top .products .thumbnail_container::before{padding:100% 0 0 0;}*/
#top .products .thumbnail_container{height:74%;}
@media only screen and (max-width:1300px){
#top .products .thumbnail_container{height:73%;}
}
@media only screen and (max-width:1200px){
#top .products .thumbnail_container{height:70%;}
}
@media only screen and (max-width:1000px){
#top .products .thumbnail_container{height:66%;}
}
@media only screen and (max-width:991px){
#top .products .thumbnail_container{height:70%;}
}
@media only screen and (max-width:768px){
#top .products .thumbnail_container{height:68%;}
}
@media only screen and (max-width:479px){
#top .products .thumbnail_container{ height: 64%;}
}
/*覆蓋模式Fix*/
/*inner_product main_color wrapped_style noLightbox av-product-class-minimal-overlay*/
#top .products .av-product-class-minimal-overlay .thumbnail_container{ height: 100%;}
#top .products .av-product-class-minimal-overlay .thumbnail_container::before{padding: 100% 0 0 0;}
#top .products .woocommerce-LoopProduct-link{
position: relative; text-align: center; vertical-align: middle;
}
/*最外圍參數調整*/
#top .products .woocommerce-LoopProduct-link::before{
content:''; padding:100% 0 0 0;
display: inline-block;
vertical-align: middle;
}
/*圖片調整*/
#top .products .thumbnail_container{
display: flex;
align-items: center;
justify-content:center;
position: absolute;
top:0;
left: 0;
width: 100%;
text-align: center;
vertical-align: middle;
/* border: 1px solid red;*/
}
/*圖片調整-padding要跟上一個高度參數一樣圖片才會置中*/
/*#top .products .thumbnail_container::before{
content:'';
display: inline-block;
vertical-align: middle;
}*/
/*===圖片圓角及優化===*/
#top .products .thumbnail_container{
border-radius: 10px;
border: 1px solid #e7e7e7;
}
#top .products .thumbnail_container img{
display: inline-block;
vertical-align: middle;
text-align: center;
max-height:105%;
width:auto;
border-radius: 10px;
}
.slick-initialized .slick-slide,.woo-variation-gallery-wrapper .wvg-gallery-thumbnail-image img,.slick-slider .slick-list, .slick-slider .slick-track{
border-radius: 10px;
}
.slick-slider .slick-list,.woo-variation-gallery-wrapper .wvg-gallery-thumbnail-image img{
border: 1px solid #e7e7e7;
}
/*===圖片圓角及優化-end===*/
/*產品名稱調整*/
#top .av-product-class-minimal .inner_product_header{
margin: 0;
padding:12px 0 0 0 !important;
height:6em;
}
#top .av-product-class-minimal .inner_product_header .woocommerce-loop-product__title{
max-height: 2.6em;
height: 2.6em;
margin:0;
padding: 0 15px;
overflow: hidden;
}
#top .inner_product_header{
position: initial; bottom:0; width: 100%;
}
/*特價-PC Fix*/
#top div .product_on_sale .inner_product_header{padding: 0;}
#top .onsale{ position: absolute; top: 0; left: 0; width: 40px; height: 40px; overflow: hidden; z-index: 100;}
#top .onsale{display: none;}
.responsive #top .single-product-main-image .onsale{ top: 15px; left: 15px; }
#top .price del .woocommerce-Price-amount,
#top .price del .woocommerce-Price-amount bdi .woocommerce-Price-currencySymbol{
font-size: 13px;
color: #aeaeae;
}
#top .price del{
font-size: 13px;
font-weight: normal;
text-decoration-color: #b6b6b6 !important;
}
#top #wrap_all ins:before{
display: none;
}
/*產品圖片上面的放大鏡 Fix*/
.single-product-main-image{position: relative;}
.single-product .single-product-main-image .avia-wc-30-product-gallery-lightbox{
position: absolute; top: 15px; right: 15px; left: inherit; border: 1px solid #ebebeb;
}
/*產品圖片上-點擊放大上的標題文案Fix*/
.mfp-content .mfp-title{display: none;}
/*產品標題*/
#top .template-shop .single-product-summary h1{ font-size: 24px;}
/*=========產品資訊頁-等比例縮小 Fix=========*/
/*版型預設模式*/
#top #wrap_all .woocommerce-product-gallery__wrapper > .lightbox-added{
position: relative; text-align: center; vertical-align: middle;
}
#top #wrap_all .woocommerce-product-gallery__wrapper > .lightbox-added::before{
content:''; padding:70% 0 0 0;
display: inline-block;
vertical-align: middle;
}
#top #wrap_all .woocommerce-product-gallery__wrapper > .lightbox-added img{
display: inline-block;
width: auto;
max-height: 300px; height: auto;
text-align: center; vertical-align: middle;
}
/*Ｗoo模式*/
#top #wrap_all .woocommerce-product-gallery__image > a{
position: relative; text-align: center; vertical-align: middle;
}
#top #wrap_all .woocommerce-product-gallery__image > a::before{
content:''; padding:70% 0 0 0;
display: inline-block;
vertical-align: middle;
}
#top #wrap_all .woocommerce-product-gallery__image > a >img{
display: inline-block;
width: auto;
max-height: 300px; height: auto;
text-align: center; vertical-align: middle;
}
/*產品專區資訊頁面不要出現虛線*/
@media only screen and (max-width: 767px) {
html #top #wrap_all #main .template-shop .sidebar{
border-top-style: none;
}
}
/* ============================================================================================================================= */
/* 加價購模組 WPC Product Bundles for WooCommerce中文版 Fix*/
/*============================================================================================================================== */
.woosb-products .woosb-product .woosb-qty{ min-width: 150px; padding: 0; margin: 0;}
@media only screen and (max-width: 767px) {
#wrap_all .woosb-products .woosb-product{ display: inline-block; width: 50%;float: left;}
#wrap_all .woosb-products .woosb-product > div:last-child {padding-right: 0;text-align: left;height: 70px; overflow: hidden;}
#wrap_all .woosb-wrap .woosb-text { white-space: initial; width: 100%; display: block;float: left; margin: 0 0 30px 0;}
}
/* =========== */
/* [Woo強化功能] WooCommerce 補充備註規格(免費版) WooCommerce Custom Product Addons (Free) Fix*/
/*============*/
.wcpa_form_outer label{ margin: 0 0 10px 0;padding: 0; width: 100%;}
.wcpa_form_outer .wcpa_checkbox{ display: inline-block;padding: 0 15px 0 0; }
.wcpa_form_outer .wcpa_radio{ display: inline-block;padding: 0 15px 0 0; }
/* ====================== */
/* 表單樣式*/
/*請在樣式表加入此參數liteform-style */
/*======================*/
#top #wrap_all .liteform-style input{
border: 0;
border-radius: 0;
background: #FFF;
border-bottom: 1px solid #ccc !important;
}
#top #wrap_all .liteform-style textarea{
border-radius: 0;
background: #FFF;
border:1px solid #ccc !important;
}
#top input[type="text"]:focus, #top input[type="password"]:focus, #top input[type="email"]:focus, #top input[type="number"]:focus, #top input[type="url"]:focus, #top input[type="tel"]:focus, #top input[type="search"]:focus, #top textarea:focus{
box-shadow: none;
}
/* ====================== */
/* 表單樣式-反白Fix 2022-1228*/
/*======================*/
#top #wrap_all .avia_ajax_form.av-custom-form-color{}
#top #wrap_all .avia_ajax_form.av-custom-form-color input::-webkit-input-placeholder { color :#ffffff ;/* WebKit, Blink, Edge */ }
#top #wrap_all .avia_ajax_form.av-custom-form-color input::-moz-placeholder { color : #ffffff ;/* Mozilla Firefox 19+ */ }
#top #wrap_all .avia_ajax_form.av-custom-form-color input::-ms-input-placeholder { color : #ffffff ;/* Internet Explorer 10-11 ＆ Microsoft Edge*/ }
#top #wrap_all .avia_ajax_form.av-custom-form-color textarea::-webkit-input-placeholder { color :#ffffff ;/* WebKit, Blink, Edge */ }
#top #wrap_all .avia_ajax_form.av-custom-form-color textarea::-moz-placeholder { color : #ffffff ;/* Mozilla Firefox 19+ */ }
#top #wrap_all .avia_ajax_form.av-custom-form-color textarea::-ms-input-placeholder { color : #ffffff ;/* Internet Explorer 10-11 ＆ Microsoft Edge*/ }
/* =========================== */
/* BLOG優化*/
/*============================ */
/*內頁上方縮圖*/
/*.post-template-default .sidebar_left .big-preview{display: none;}*/
.post-template-default .sidebar_left .big-preview{
padding: 0 0 20px 0;
}
.big-preview a{
border-radius: 10px;
}
/*文章內頁*/
.entry-content-wrapper .big-preview.single-big {padding: 0px 0px 25px 0;}
#top #wrap_all .entry-content-wrapper .post-title{
margin: 0 0 20px 0;
text-align: left;
}
#top #wrap_all .fullsize .template-blog .post-meta-infos {
text-align: left;
}
#top .av-alb-blogposts.template-blog div.post_delimiter{ padding:0;}
#top .fullsize .template-blog .big-preview{
display: none;
}
/* =========================== */
/* 手機版選單*/
/**/
/*============================ */
.mb-menus{ padding: 0; margin: 0; width: 100%; position:fixed; bottom:0; left:0; z-index:99999999; display: none;}
.mb-menus a{
font-size:13px; color: #FFF; border-right: 1px solid #2a7abb; background-color:#06467a;
text-decoration: none; display: inline-block; width:100%;
float: left; text-align: center; padding:40px 0 7px 0;
background-position:center 12px; background-repeat:no-repeat;
}
.mb-menus a:hover{ background-color:#197dbc; }
.mb-menus li{ margin: 0; padding: 0; width: 50%; float: left;}
.mb-menus .mb-tel{ background-image:url(../images/tel.png); background-size:23px auto;}
.mb-menus .mb-line{ background-image:url(../images/line_w.svg); background-size:23px auto;}
.mb-menus .mb-product{ background-image:url(../images/product.png); background-size:25px auto;}
.mb-menus .mb-news{ background-image:url(../images/news.png); background-size:18px auto;}
.mb-menus .mb-email{ background-image:url(../images/email.png); background-size:27px auto;}
@media screen and (max-width:991px){
/*cookies 提示 FIX*/
/*#top .avia-cookiemessage-bottom{bottom: 70px;}*/
.mb-menus{display: inline-flex;}
/*TOP置頂按鈕FIX*/
#scroll-top-link{ bottom: 85px; right: 10px; }
}
/* ====================== */
/* Woo cart UI補強*/
/*======================*/
.woocommerce-order-details__title,.woocommerce-column__title{
font-size:20px;
}
table.shop_table th,table.shop_table td{ border: 0;}
table.shop_table th{font-weight: bolder;}
table.shop_table tfoot td{ font-weight: bolder; }
#top .main_color .quantity input.plus, #top .main_color .quantity input.minus{
padding: 0; border:1px solid #ccc; background: #FFF;
width: 25px; margin: 0;
}
#top #main .shop_table.order_details{
padding: 0;
background: #FFF;
border: 0;
}
.woocommerce-cart-form__contents{}
.woocommerce thead tr th{
font-weight:bolder;
font-size: 16px;
border-bottom: 2px solid #e1e1e1;
}
.woocommerce thead tr th.product-quantity{
text-align: center;
}
.woocommerce tr td,.woocommerce tr th{
border-bottom:1px solid #e1e1e1;
}
.woocommerce-cart-form{
width: 60%; float: left;
}
.cart-collaterals{
width: 35%;
float: right;
clear: none;
}
.cart-collaterals .cart_totals{
display: inline-block;border: 1px solid #ccc;border-radius:4px;
padding:25px;width: 100%;
}
.cart-collaterals .cart_totals a.button.alt{
width: 100%;
}
.cart-collaterals h2{
font-size: 20px;
line-height: 1.1em;
margin:15px 0 30px 0;
text-align: center;
}
.responsive .shop_table .product-quantity .quantity{
width: 100px;
}
/* 購物車清單字體變大 */
#top div form .form-row input.input-text, #top div #content .form-row input.input-text, #top div form .form-row textarea, #top div #content .form-row textarea,#top label,table.shop_table th,td,.responsive table.shop_table th{ font-size: 15px; }
table.shop_table th{ line-height: inherit;}
/* 購物車清單小計 */
#main .cart-collaterals .shop_table th{
padding: 6px 0;width: 4.5em;font-weight:bolder;
}
/* 購物車-刪除按鈕-自定義 */
#top .main_color a.remove{
width:25px; height:25px;
background: url(../images/close.svg) no-repeat 0 center;
opacity: 0.7;
}
@media screen and (max-width:991px){
.woocommerce-cart-form{ width: 100%;}
.cart-collaterals{ width: 100%;}
}
@media screen and (max-width:479px){
#top .main_color a.remove{
position: relative;
top: -10px;
}
.responsive table.shop_table{
border-width:0;
}
.responsive #top table .product-name{
width: 100%;
border-left-width:0;
text-align: left;
}
/*購物車清單，顯示數量 */
.responsive .shop_table .product-quantity{
display:table-cell;
}
}
/* ====================== */
/* 購物車結案優化 Woo checkout UI*/
/*======================*/
div table.shop_table td{ padding: 10px 12px;}
@media screen and (min-width:992px){
#customer_details{ width: 50%;}
#customer_details .col-1{ width: 100%;}
#customer_details .col-2{ width: 100%;}
#order_review_heading,#order_review{ width: 50%; clear: none; float: right; padding: 0 0 0 5%; }
}
#customer_details label{ margin:0 0 5px 0;}
#top .input-text, #top input[type="text"], #top input[type="input"], #top input[type="password"], #top input[type="email"], #top input[type="number"], #top input[type="url"], #top input[type="tel"], #top input[type="search"], #top textarea, #top select{
border:1px solid #898989;
}
/*輸入欄位邊框顏色(border-color)*/
#top .main_color .input-text, #top .main_color input[type='text'], #top .main_color input[type='input'], #top .main_color input[type='password'], #top .main_color input[type='email'], #top .main_color input[type='number'], #top .main_color input[type='url'], #top .main_color input[type='tel'], #top .main_color input[type='search'], #top .main_color textarea, #top .main_color select{
background-color: #FFF;
border-color:#ccc;
border-radius:2px;
}
#top div form .form-row input.input-text, #top div #content .form-row input.input-text, #top div form .form-row textarea, #top div #content .form-row textarea{
border-radius:2px;
border: 1px solid #ccc;
padding: 12px 15px;
}
.main_color tr:nth-child(odd), .main_color .pricing-table>li:nth-child(odd), .main_color .pricing-extra {
background: #FFF;
}
.main_color #payment{
background: #FFF;
}
#top #payment{
border-radius:0;border:0;padding:0;
}
#top #payment ul.payment_methods li{
border-radius: 4px;
border: 1px solid #ccc;
padding: 15px 20px;
margin: 0 0 15px 0;
}
#top #payment ul.payment_methods{
border:0; padding: 0;
}
#top #payment div.payment_box{
width: 100%;
padding:5px 30px;
left: 0;
}
#top #payment div.form-row{
padding:25px 0 0 0; margin: 0;
}
#top #payment #place_order{
width: 100%;
}
.woocommerce-checkout-review-order-table tr,
.woocommerce-checkout-review-order-table tr th,
.woocommerce-checkout-review-order-table tr td{
border: 0; border-bottom: 1px solid #e1e1e1;
padding: 10px 12px;
}
.woocommerce-checkout-review-order-table thead tr th{
font-weight: bold; font-size:16px;
border-bottom:2px solid #e1e1e1;
}
#order_review .order-total th,
#order_review .order-total td strong{
font-weight: bold; font-size:16px; color: #c82626;
}
/*----購物車頁面----*/
/*標題設定*/
.woocommerce-cart-form .product-name > a{
font-weight: bolder;
}
/*價格設定*/
.woocommerce-cart-form .product-price .woocommerce-Price-amount,
.woocommerce-cart-form .product-subtotal .woocommerce-Price-amount{
font-weight: bolder;
}
/*產品附加項目*/
td.product-name dl.variation dt,
td.product-name dl.variation dd{
font-weight: normal;
font-size: 0.85rem;
line-height: 1.35rem;
color: #666;
}
/*完成訂購感謝頁面-優化*/
#top #main .woocommerce-order{
max-width: 800px;
margin: 0 auto;
}
#top .order_details li {
text-transform: none;
border: 0;
padding: 0;
}
#top #main .woocommerce-order .woocommerce-table th{
padding: 10px 0;
}
#top #main .woocommerce-order .woocommerce-table td{
padding: 10px 0;
}
.woocommerce-order .woocommerce-table th.product-total,
.woocommerce-order-details .woocommerce-table th.product-total{
min-width:200px;
}
#top #main .woocommerce-order-details{
margin-top:50px;
}
#top #main .woocommerce-order-details .product-name a,
#top #main .woocommerce-order-details .product-name .product-quantity{
font-weight: bolder;
}
#top #main .woocommerce-order-details .woocommerce-table__product-name .wc-item-meta{
padding: 0;
margin: 10px 0 0 0;
display: inline-block;
width: 100%;
font-size: 13px;
line-height: 24px;
}
#top #main .woocommerce-order-details .woocommerce-table__product-name .wc-item-meta li{
width: 100%;padding: 0;margin: 0;display: inline-block;
font-size: inherit;
line-height: inherit;
border: 0;
}
#top #main .woocommerce-order-details .woocommerce-table__product-name .wc-item-meta li .wc-item-meta-label{
display: inline;
font-size: inherit;
font-weight: bolder;
color: #666;
vertical-align: initial;
}
#top #main .woocommerce-order-details .woocommerce-table__product-name .wc-item-meta li p{
display: inline;
font-size: inherit;
font-weight: bolder;
color: #666;
}
#top #main .woocommerce-order-details .woocommerce-Price-amount{
font-weight: bolder;
}
#top #main .woocommerce-customer-details{
margin-top: 50px;
line-height: 1.8rem;
}
#top #main .woocommerce-customer-details p{
margin: 0;
}
@media only screen and (max-width: 767px) {
.responsive #top .col2-set .col-1{
width: 98%;
}
}
.woocommerce-cart-form .actions{
border: 0; padding: 20px 0;
}
@media only screen and (max-width: 479px) {
#top #wrap_all .woocommerce-cart-form .actions{
border: 0; padding: 20px 0 0 0;
}
}
/*購物車清單，運送方式Fix*/
.woocommerce-shipping-totals td{ min-width: 180px;}
/*折價券Fix*/
.woocommerce-form-coupon-toggle{
width: 100%;
display: inline-block;
}
/*======
手機版購物車產品優化
======*/
.responsive #wrap_all table.shop_table.cart .quantity input.plus,
.responsive #wrap_all table.shop_table.cart .quantity input.minus,
.responsive #wrap_all table.shop_table.cart .quantity input.qty{
height: 30px;line-height: 30px;
}
@media only screen and (max-width:479px) {
.responsive table.shop_table.cart thead{display: none;}
.responsive table.shop_table.cart{ display: block; background: #FFF;}
.responsive table.shop_table.cart tbody{ display: block; }
.responsive table.shop_table.cart tr{display: none;}
.responsive table.shop_table.cart .woocommerce-cart-form__cart-item{
display: inline-block;
width: 100%;
position: relative;
padding: 0 0 6% 50%;
border-bottom: 1px #aba9a9 dotted;
margin: 0 0 6% 0;
}
.responsive table.shop_table.cart td.product-remove{
display: inline-flex;
position: absolute;
top: 0;
left: 0;
border: 0;
height: 100%;
vertical-align: middle;
align-items: center;
}
.responsive table.shop_table.cart .product-thumbnail{
width:35%;height:100%; overflow: hidden; padding:0;
display: flex;align-items: center;
position: absolute;
top: 0; left:10%;
border: 0;
}
.responsive table.shop_table.cart .product-thumbnail img{
width: 100%; height:auto;
}
.responsive #wrap_all table.shop_table.cart .product-name{
text-align: left;display: block;border: 0;
}
.responsive #wrap_all table.shop_table.cart .product-price{
text-align: left;display: block;border: 0;
}
.responsive #wrap_all table.shop_table.cart .product-quantity{
display: block;border: 0;
padding:0; margin: 15px 0 0 0;
float: left;
}
}
/*======
手機版購物車產品優化-END
======*/
/* =========================== */
/*項目列表優化-圖片固定比例-2021-0225fix*/
/* =========================== */
/*圖片不反白*/
.avia-fullwidth-slider span.image-overlay.overlay-type-extern {
display: none !important;
}
.avia_transform a .image-overlay {
display: none !important;
}
.slide-entry .slide-image{
width: 100%;
position: relative;
overflow: hidden;
}
.slide-entry .slide-image img{
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
max-width: 100%;
max-height: 100%;
height: auto;
width: auto;
margin: auto;
display: inline-block;
border-radius: 10px;
border: 1px solid #dddddd;
}
.slide-entry .slide-image:after {
padding-top:80%;
content: "";
display: block;
}
.fullsize .grid-col-3 .grid-image{
width: 100%;
position: relative;
overflow: hidden;
}
.fullsize .grid-col-3 .grid-image img{
position: absolute;
top: 0;
bottom: 0;
right: 0;
left: 0;
max-width: 100%;
max-height: 100%;
margin: auto;
}
.fullsize .grid-col-3 .grid-image:after {
padding-top: 75%;
content: "";
display: block;
}
.portfolio-entries-back{
padding: 20px 0 60px 0;
}
/* =========================== */
/*Woo手機版選單v2021-0225*/
/* =========================== */
.nav-catalog-bk .mb-article-catalog-but {
/*margin: 20px 0 25px 0;*/
background: #0e3c51;
color: #FFF;
padding: 9px 0 10px 20px;
font-weight: bold;
cursor: pointer;
border-radius: 3px;
font-size: 13px;
width: 120px;
position: fixed;
bottom: 90px;
left: 15px;
/*right: 10px;*/
z-index: 99999;
-webkit-transition:All 0.50s linear;
-ms-transition:All 0.50s linear;
-moz-transition:All 0.5s linear;
-o-transition:All 0.5s linear;
transform:All 0.5s linear;
}
.nav-catalog-bk .nav-button {
display: inline-block;
float: right;
margin: 4px 15px 0 0;
}
.nav-catalog-bk .nav-button .m-icon-bar {
background: #FFF;
width: 15px;
height: 1px;
display: block;
margin: 0 0 5px 0;
}
/*
小工具加入
close
*/
#mbnav-but-close{
height: 25px;
overflow: hidden;
display: inline-block;
background: url(../images/close.svg) no-repeat 0 center;
background-size: 16px auto;
padding: 0px 0 0 25px;
color: #333;
text-align: left;
}
.nav-catalog-bk,#mbnav-but-close,#custom_html-2{ display: none;}
@media only screen and (max-width: 767px) {
.nav-catalog-bk,#mbnav-but-close,#custom_html-2{ display: block;}
html #top #wrap_all #main .template-shop .sidebar_left{
position:fixed;
top: 0; right:-1000px; width:70%;
background: #FFF;
padding:30% 30px 20% 25px;
box-shadow: 0px 0px 10px #6a6a6a;
height:77%;
overflow: scroll;
-webkit-transition:All 0.50s linear;
-ms-transition:All 0.50s linear;
-moz-transition:All 0.5s linear;
-o-transition:All 0.5s linear;
transform:All 0.5s linear;
}
html #top #wrap_all #main .template-shop .sidebar{ z-index: 99999;}
html #top #wrap_all #main .template-shop{ position: relative; z-index: 10;}
.main_color{ position: relative; z-index:1;}
}
/* =========================== */
/*Woo回上一頁v2021-0225*/
/* =========================== */
.product-back-con{ padding: 0 0 50px 0; display: inline-block; width: 100%; text-align: center;}
/* =========================== */
/*瀑布流相簿*/
/* =========================== */
/*兩排顯示*/
@media only screen and (max-width: 767px) {
.responsive #top .av-masonry-entry {
width:50%;
}
}
/* =========================== */
/*顏色區塊優化*/
/* =========================== */
@media only screen and (max-width: 767px) {
/*內頁上方比例修正*/
.avia-section-huge .content, .avia-section-huge .sidebar {
padding-top: 50px;
padding-bottom: 50px;
}
}
/* =========================== */
/*手機版選單優化*/
/* =========================== */
/*手機版選單，滿版黑底優化*/
.html_av-overlay-full #av-burger-menu-ul li{
font-size: 24px;
}
.html_av-submenu-hidden .av-submenu-indicator{
right: auto;
}
@media only screen and (max-width:991px) {
/*修正置中問題*/
#top #av-burger-menu-ul{ display: block;}
}
/* =========================== */
/*form7表單*/
/* =========================== */
#top .main_color .form7-element{ float: left; padding: 0 25px 0 0; display: inline-block; }
#top .main_color .form7-element input{border: 0;border-radius: 0;background: #FFF;border-bottom: 1px solid #898989;}
#top .main_color .form7-element select{border: 1px solid #9e9e9e; padding:15px; }
#top .main_color .form7-element label{ margin: 0 0 10px 0; width: 100%; display: inline-block;}
#top .main_color .form7-element .wpcf7-not-valid-tip{margin: -15px 0 20px 0; font-size: 13px; }
.wpcf7-validation-errors,.form7-element-submit,.element-row-title{ display: inline-block; width: 100%;}
#top .main_color .element-row-title{ padding:25px 0;}
#top .main_color .element-row-title h3{ margin: 0; padding: 0;}
.element-row-3{ width: 25%; }/* 1/4*/
.element-row-4{ width: 33%; }/* 1/3*/
.element-row-6{ width: 50%; }/* 1/2*/
.element-row-12{ width: 100%; }/* 1*/
.form7-element-submit{margin: 25px 0;}
@media only screen and (max-width: 767px) {
.element-row-3,
.element-row-4,
.element-row-6,
.element-row-12{ width:100%; }
}
/*form7表單end*/
div.wpt_notice_board{
visibility: hidden;
}
/*form7表單優化*/
.wpcf7-form-control-wrap{}
#main .wpcf7-form-control-wrap input{ margin: 0;}
#main .wpcf7-form-control-wrap input,#main .wpcf7-form-control-wrap select{
padding: 15px;}
.wpcf7-response-output{ float: left; width: 100%;}
.web-ct-form .tag-row-1{display: inline-block; float: left; width:100%; padding: 0 25px 20px 0;}
.web-ct-form .tag-row-2{display: inline-block; float: left; width:50%; padding: 0 25px 20px 0;}
.web-ct-form .tag-row-3{ display: inline-block; float: left; width: 33.33%;padding: 0 25px 20px 0;}
@media only screen and (max-width:991px) {
.web-ct-form .tag-row-3{ display: inline-block; float: left; width: 100%;padding: 0 25px 20px 0;}
}
/* =========================== */
/*左側Line圖示
/* =========================== */
.webms-icon-tag{
position: fixed;
right: 30px;
bottom: 100px;
z-index: 99999;
display: flex;
flex-direction:column;
width: 50px;
}
.webms-icon-tag > div{
padding: 15px 0 0 0;
}
.webms-icon-tag > div > a{
display: inline-block;
width: 50px; height: 50px;
text-indent: -9999px;
float: right;
}
@media only screen and (max-width: 767px) {
.webms-icon-tag{right: 15px;bottom: 150px;}
.webms-icon-tag > div > a{width: 40px; height: 40px;}
.webms-icon-tag > div{padding:20px 0 0 0;}
}
/*linkedin圖示*/
.linkedin-icon-tag{}
.linkedin-icon-tag .linkedin-icon{
background:url(../images/linkedin.svg) no-repeat 0 0;
background-size: auto 100%;
}
/*Line圖示*/
.line-icon-tag{}
.line-icon-tag .line-icon{
background:url(../images/line.svg) no-repeat 0 0;
background-size: auto 100%;
}
/*FB圖示*/
.fb-icon-tag{}
.fb-icon-tag .fb-icon{
background:url(../images/facebook.svg) no-repeat 0 0;
background-size: auto 100%;
}
/*instagram圖示*/
.ig-icon-tag{}
.ig-icon-tag .ig-icon{
background:url(../images/instagram.svg) no-repeat 0 0;
background-size: auto 100%;
}
/*twitter圖示*/
.twitter-icon-tag{}
.twitter-icon-tag .twitter-icon{
background:url(../images/twitter.svg) no-repeat 0 0;
background-size: auto 100%;
}
/*youtube圖示*/
.youtube-icon-tag{}
.youtube-icon-tag .youtube-icon{
background:url(../images/youtube.svg) no-repeat 0 0;
background-size: auto 100%;
}
/*Messenger圖示*/
.fbms-icon-tag{}
.fbms-icon-tag .fbms-icon{
background:url(../images/messenger.svg) no-repeat 0 0;
background-size: auto 100%;
}
/*加入我的最愛圖示*/
.love-icon-tag{}
.love-icon-tag .love-icon{
background:url(../images/love.svg) no-repeat 0 0;
background-size: auto 100%;
}
/*E-mail圖示*/
.email-icon-tag{}
.email-icon-tag .email-icon{
background:url(../images/email.svg) no-repeat 0 0;
background-size: auto 100%;
}
.email-icon-tag .email-txt{
text-align: center; font-size: 13px; font-weight: 400;
display: inline-block;
background: #fff;
padding: 1px 3px; margin: 10px 0 0 0;
border-radius: 3px;
float: right;
position: relative;
right:0px;
width: 100%;
}
/*----
自定義對話
----*/
/*自定義對話-圖示*/
.speak-icon-tag{}
.speak-icon-tag .speak-icon{
background:url(../images/speak.svg) no-repeat 0 0;
background-size: auto 100%;
float: right;
}
.speak-icon-tag .speak-txt{
text-align: center; font-size: 13px; font-weight: 400;
display: inline-block;
background: #fff;
padding: 1px 3px; margin: 10px 0 0 0;
border-radius: 3px;
float: right;
position: relative;
right:0px;
width: 100%;
}
@media only screen and (max-width: 767px) {
.speak-icon-tag .speak-txt{
right: -9px;
}
}
/*自定義對話區塊*/
.speak-box-con{
position: fixed; right:7%; bottom:100px; z-index:0;opacity: 0;
max-width: 350px; background: #FFF;
border-radius: 5px;
box-shadow: 0px 5px 10px #6a6a6a;
-webkit-transition:All 0.5s linear;
-ms-transition:All 0.5s linear;
-moz-transition:All 0.5s linear;
-o-transition:All 0.5s linear;
transform:All 0.5s linear;
}
.speak-box-border-tag{
position: relative;
display: inline-block; width: 100%;
}
.speak-box-hd{
font-size:18px; font-weight: bold;
text-align: center; color: #FFF;
padding:15px;
background-color: #0394d2;
position: relative;
border-radius:5px 5px 0 0;
}
.speak-box-info-con{
padding: 30px 35px;
}
.speak-box-txt-tag{
overflow: scroll;
max-height: 200px;
}
.speak-box-contact{ margin: 25px 0 0 0; }
.speak-box-contact a{
font-size: 15px;
text-align: center; font-weight: bold;
color: #ffffff; background-color: #ff6a6a;
display: inline-block;width: 100%;
border-radius: 3px; padding:10px;
}
.speak-box-contact a:hover{
text-decoration: none; opacity: 0.7;
}
.speak-box-close{
position: absolute; right:-10px; top:-10px; z-index: 100;
display: inline-block; width:30px; height:30px; text-indent: -9999px;
background:url(../images/close_w.svg) #024561 no-repeat center;
background-size:60%; border-radius:9999px;
}
.speak-box-tel{
background:url(../images/phone.svg) no-repeat 0 center;
background-size: auto 100%;
font-size: 1.8em;
font-weight: 400;
margin: 0px 0 20px 0;
padding: 2px 0 0 45px;
overflow: hidden;
height: 1em;
color: #EE4E18;
}
.speak-box-tel a{
color: #EE4E18;
}
/* =========================== */
/*我的最愛模組補強/
/* =========================== */
/*我的最愛FIX-補上字型*/
.fa-heart-o:before,.fa-heart:before,.fa-trash:before {
font-family: 'fontawesome';
}
.wishlist-title-container{display: none;}
#top #main .wishlist_table .product-add-to-cart a.button{
padding: 13px !important;
display: inline-block !important;
}
/*產品資訊頁按鈕*/
#top #main .single-product-summary .yith-wcwl-add-to-wishlist{
display: flex;
padding:10px 0 30px 5px; margin: 0;
width: 100%;
font-size: initial;
}
#top #main .single-product-summary .yith-wcwl-add-button a,
#top #main .av-woo-purchase-button .yith-wcwl-add-button a{
background-color: transparent;
color: #000;
padding: 0;
font-size: initial;
}
#top #main .yith-wcwl-add-button .yith-wcwl-icon{
color: #eb4b4b;
}
.yith-wcwl-add-to-wishlist .feedback .yith-wcwl-icon{
color: #eb4b4b;
}
/*產品我的最愛圖示位置*/
.add-to-wishlist-before_image .yith-wcwl-add-to-wishlist{
position: absolute;
z-index: 10;
margin: 0;
top: 2.5%;
left: 5%;
}
/*產品我的最愛圖示優化*/
.add-to-wishlist-before_image .yith-wcwl-add-to-wishlist i{
font-size: 1.2rem;
margin: 0;
width: 25px;
}
@media only screen and (max-width: 767px) {
#top #main .wishlist_table .product-add-to-cart a.button{
padding:6px !important;
}
#top #main .wishlist_table.mobile li{
margin: 0 0 35px 0;
border-bottom: 1px solid #dedede;
padding: 15px 0 35px 0;
}
#top #main .wishlist_table.mobile li .item-details h3{font-size: 1em;}
}
/* ================================================================================= */
/*Advanced Product Fields for WooCommerce 加價購-中文版補強/
/* ================================================================================= */
#top #main .wapf-field-group{}
#top #main .wapf-field-group .wapf-field-label label span{
font-size: inherit;
font-weight: normal;
margin:0;
display: block;
}
#top #main .wapf-field-group .wapf-checkable{
display: inline-block;float: left; padding:5px 10px;
border: 1px solid #c8c8c8;
border-color:#c8c8c8; border-radius: 2px;
margin:0 20px 0 2px;
}
#top #main .wapf-field-group .wapf-checkable:hover{
box-shadow: 0 0 0 2px #dd3333 !important;
border-color: #FFF;
}
.wapf-field-group .wapf-checkable input{
width: auto;
margin: 8px 0 0;
}
.wapf-field-description{display: inline-block; width: 100%; }
#top #main .wapf-product-totals > .wapf--inner{
padding: 0;margin: 0;
}
@media only screen and (max-width:991px) {
/* Add your Mobile Styles here */
#top #main .wapf-field-group .wapf-checkable{
margin:5px 20px 5px 2px;
}
}
/*PRO版優化*/
#top #main .wapf-field-group .wapf-field-container{
display: flex;
flex-wrap: wrap;
padding: 0px 0 0 5px;
}
#top #main .wapf-field-group .wapf-field-label{
width: 15%;display: inline-flex;align-items: center;margin: 0;
}
#top #main .wapf-field-group .wapf-field-input{
width:85%;
}
#top #main .wapf-field-group .wapf-field-input .wapf-swatch{
margin: 10px 15px 10px 0;
}
#top #main .wapf-field-group .wapf-field-input > input{
margin: 10px 10px 10px 0px; border-radius: 2px;
}
#top #main .wapf-field-group .wapf-field-input .wapf-checkboxes{
display: inline-block; width: 100%;
}
#top #main .wapf-field-group .wapf-field-input .wapf-checkable{
clear: none;
margin:10px 10px 10px 0px;
}
#top #main .wapf-product-totals{
padding: 20px 0;
border-top: 1px solid #dbdbdb;
/*pro參數*/
margin: -10px 0 30px 0;
/*免費版參數*/
/*margin: 20px 0 30px 0;*/
border-bottom: 1px solid #dbdbdb;
}
#top #main .wapf-product-totals .wapf--inner > div{
display: flex;
}
#top #main .wapf-product-totals .wapf--inner span{
font-size: inherit;
font-weight: normal;
width: 15%;
}
#top #main .wapf-product-totals .wapf--inner .wapf-total{
width:85%;
}
#top #main .wapf-field-input input[type=checkbox],
#top #main .wapf-field-input input[type=radio]{
float: left;
margin-top: 8px;
}
#top #main .wapf-swatch--image.wapf-checked{
border-color: #353c4e;
}
.wapf-swatch--color > div{
border: 1px solid #838383;
}
#top #main .wapf-field-group .wapf-field-label .required{
display: none;
}
#top #main .wapf-field-description{
width: 100%;
display: inline-flex;
padding: 5px 0 10px 15%;
}
@media only screen and (max-width:991px) {
#top #main .wapf-field-group .wapf-field-container{display: block;}
#top #main .wapf-field-group .wapf-field-label{ width: 100%; display: inline-block;}
#top #main .wapf-field-group .wapf-field-input{width: 100%; display: inline-block;}
#top #main .wapf-product-totals .wapf--inner > div{width: 100%; display: inline-block;}
#top #main .wapf-product-totals .wapf--inner span{width: auto;}
#top #main .wapf-product-totals .wapf--inner .wapf-total{ width: auto;}
#top #main .wapf-field-group .wapf-field-input .wapf-checkable{
margin:10px 10px 10px 2px;
width: 40%;
}
#top #main .wapf-field-description{padding: 5px 0 10px 0;}
}
/* ================================================================================= */
/*Advanced Product Fields for WooCommerce 加價購-中文版補強 END/
/* ================================================================================= */
/* =========================== */
/*ninja forms 優化*/
/* =========================== */
#top #wrap_all .nf-form-cont{}
#top #wrap_all .nf-form-cont .nf-form-title h3{padding: 0 0 20px 0;}
#top #wrap_all .nf-form-cont a{color: #03648d; text-decoration: underline;}
#top #wrap_all .nf-form-cont .ninja-forms-req-symbol{ font-weight: bold; color:#B12B2D;}
#top #wrap_all .nf-form-cont .nf-form-fields-required{ padding: 0 0 20px 0;}
#top #wrap_all .nf-form-cont .nf-error-field-errors{ padding:0 5px; }
#top #wrap_all .nf-form-cont .nf-error-required-error{ padding:0; }
#top #wrap_all .nf-form-cont .nf-form-layout .nf-field-container{
margin-bottom:35px;
}
#top #wrap_all .nf-form-cont .nf-form-layout input,
#top #wrap_all .nf-form-cont .nf-form-layout select{
border-radius: 4px; border: 1px solid #ccc;
padding: 12px 15px; margin: 0;
}
#top #wrap_all .nf-form-cont .nf-form-layout .nf-after-field{
position: absolute; top: 85px;left: 0;
}
#top #wrap_all .nf-form-cont .nf-form-layout .submit-container{
padding:15px 0 0 0; margin: 0 0 15px 0;
}
#top #wrap_all .nf-form-cont .nf-form-layout .submit-container input{
width: 100%; font-size: 16px; font-weight: bold;
background-color: #B02B2C; color: #FFF;
border-color: #B02B2C;
}
/* =========================== */
/*ninja forms 優化 END*/
/* =========================== */
/* =========================== */
/*Grid/List View for WooCommerce 優化*/
/* =========================== */
.berocket_lgv_additional_data{}
.berocket_lgv_additional_data{
padding: 0 0 0 2rem; display: inline-block; width: 100%;
}
.berocket_lgv_additional_data .lgv_link_simple{
border-bottom: 1px solid #d8d8d8;
display: inline-block; width: 100%; padding:0 0 1rem 0;
text-decoration: none;
color: #0661a1;
}
.berocket_lgv_additional_data .lgv_description{
line-height: initial;font-size: initial;
}
.berocket_lgv_additional_data .lgv_meta{
display: none;
}
.berocket_lgv_additional_data .lgv_price{
display: none;
}
a.berocket_lgv_button .fa, .berocket_lgv_widget a.berocket_lgv_button .fa, a.berocket_lgv_button_test .fa, .lgv_admin_settings .lgv_toggle_next .fa{
font-family:'Font Awesome 5 Free','fontawesome';
}
@media only screen and (max-width:991px) {
.berocket_lgv_additional_data{
padding:0; max-width: initial;
}
}
/* ========
Button Fix
========== */
.avia-button .avia_button_icon{
font-size: 1.2rem;
}
/* ========
滿版選單 Fix
========== */
#top #wrap_all .av-subnav-menu .current-menu-item .avia-menu-text {font-weight: bold;color: #0661a1;}
#top #wrap_all .av-subnav-menu .current-menu-item { border-bottom: 3px solid #0661a1;}
#top .av-subnav-menu > li {padding: 30px 0;display: inline-block;font-size: 16px;}
#top #wrap_all .av-subnav-menu .menu-item .avia-menu-text {
font-weight: bold;color: #0661a1;
}
/* ========
頁面選單功能優化2022-1228Fix
========== */
#top .widget_nav_menu .page_item{
font-size: initial;
}
#top .widget_nav_menu li a{
background: none;
color: #333;
padding: 13px 0;
margin:0;
display: inline-block;
border: 0;
position: relative;
width: 100%;
}
#top .widget_nav_menu .page_item{
top: 0;
left:0;
background: none;
box-shadow: none;
padding:0;
margin: 0;
}
#top .widget_nav_menu .page_item > a{
color: #2d5c88;
font-weight: bold;
margin: 0;
border-bottom: 2px solid #d8d8d8;
}
#top .widget_nav_menu .page_item .children{
padding: 10px 0 0 0 !important;
}
#top .widget_nav_menu .page_item .children .page_item a{
border: 0;
font-weight: normal;
color: #333;
}
#top .widget_nav_menu .page_item .children .page_item a:hover{
color: #2d5c88;
}
#top .widget_nav_menu .page_item .children .page_item:before{
left: 0; right:0;
}
/* ========
瀑布流相簿 2022-1228Fix
========== */
#top .av-inner-masonry{
margin: 0;
}
#top .av-masonry-image-container{
position: relative;
}
#top .av-masonry-image-container:after{
content: '';
display: inline-block;
vertical-align: middle;
padding: 75% 0 0 0;
}
#top .av-masonry-image-container img{
max-height:100%;
max-width:100%;
width: auto;
height: auto;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
}
/* ========
作品集網格 2022-1228Fix
========== */
#top .av-portfolio-grid-sorting-container .grid-image,
#top .isotope-item .grid-image{
position: relative;
}
#top .av-portfolio-grid-sorting-container .grid-image:after,
#top .isotope-item .grid-image:after{
content: '';
display: inline-block;
vertical-align: middle;
padding:81% 0 0 0;
}
#top .isotope-item.av_one_fifth .grid-image:after{
padding:71% 0 0 0;
}
#top .av-portfolio-grid-sorting-container img,
#top .isotope-item .grid-image img{
max-height:100%;
max-width:100%;
width: auto;
height: auto;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
border-radius: 10px;
border: 1px solid #dddddd;
}
/* ========
/*Login/Signup Popup 登入模組優化
========== */
#wrap_all #main .xoo-aff-input-group .xoo-aff-input-icon{
height: 50px;
font-family: 'fontawesome5free-solid';
}
.xoo-aff-myacc-field{
width: 100%;
}
#wrap_all #main .xoo-aff-myacc-field input{
border: 0;
background: #FFF;
padding: 15px 0;
border-bottom: 1px solid #ccc;
}
#top #wrap_all .xoo-el-form-login button i,
#top #wrap_all .xoo-el-notice-success i{
font-family: 'fontawesome5free-solid';
}
.xoo-aff-input-group .xoo-aff-input-icon{
height: 50px !important;
}
/* ========
/*YITH WooCommerce Customize My Account Page 模組優化
========== */
#wrap_all #main #my-account-menu .item-icon .fa{
font-family:'fontawesome';
}
/*產品專區列表及產品TAG*/
#top #wrap_all .shoploops-tag-title{
}
#top #wrap_all .shoploops-tag-con{
display: inline-block;
width: 100%;
padding: 25px 0;
}
#top #wrap_all .shoploops-tag-title{
font-size: 15px;
}
#top #wrap_all .shoploops-tag{}
#top #wrap_all .shoploops-tag{
padding-top: 20px;
display: flex;
flex-wrap: wrap;
width: 100%;
}
#top #wrap_all .shoploops-tag a{
display: flex;
-webkit-box-pack: center;
justify-content: center;
-webkit-box-align: center;
align-items: center;
margin-right: 8px;
margin-bottom: 10px;
padding: 2px 10px;
box-sizing: border-box;
border-radius: 10px;
font-size: 13px !important;
font-weight: normal;
background-color: rgb(240, 240, 240);
color: #333;
border: 0;
text-decoration: none;
}
#top #wrap_all .shoploops-tag a:hover{
color: #fff;
background-color:#666;
}
/*切換頁籤顏色*/
#top .pagination .current, #top .pagination a, #top .fullsize .template-blog .pagination a{
border: 1px solid #c3c3c3;
}
/*產品已完售*/
#top #wrap_all .out-of-stock-tag{
color:#333;
font-weight:500;
font-size: 15px;
text-transform: uppercase;
position: absolute;
top: 28%;
left:0;
right:0;
padding: 20px 0;
background: rgba(255,255,255,95%);
text-align: center;
opacity: 0.85;
}
@media only screen and (max-width: 479px) {
#top #wrap_all .out-of-stock-tag{
top: 20%;
}
}
/*WOO購物車產品優化 for Variation Swatches for WooCommerce - Pro*/
#top .variations th.label{text-align: left; font-size:initial; font-weight: normal;}
#top .variations th, #top .variations td{ padding: 5px 0; }
#top .variations th.label label{font-weight: normal;}
#top .variations_form .single_variation_wrap{margin: 0px 0px 20px 0; }
.single-product-main-image{width: 50%;}
/*Woo產品描述區滿版樣式-20230726版-Shop優化版*/
#wrap_all #main .title-tag-border{}
#wrap_all #main .title-tag-border .av-special-heading-tag {
display: inline-block;
width: 100%;
border-bottom: 1px solid #bbb;
padding: 0px 0 20px 0;
margin: 0;
}
#wrap_all #main .title-tag-border .av-special-heading-tag small{
display: inline-block;
float: right;
}
#top .template-shop .single-product-summary h1{
padding: 0px 0 20px 0;
display: inline-block;
width: 100%;
margin: 0;
}
#top div.product .woocommerce-tabs ul.tabs{
display: inline-block; width: 100%; float: none;
text-align: center;
}
#top div.product .woocommerce-tabs ul.tabs:before{
content: '';
border-bottom: 1px solid #ebebeb;
display: block;
position: relative;
top: 54px;
}
div.product .woocommerce-tabs ul.tabs li{
display: inline-block;
float: none;
}
#top div div.product .woocommerce-tabs ul.tabs li a,
#top div div.product .woocommerce-tabs ul.tabs li.active a{
border: 0;
font-size: 15px;
color: #333;
padding: 10px 30px 10px 30px;
border-bottom-width: 3px;
border-bottom-style: solid;
border-bottom-color: #FFF;
}
#top div div.product .woocommerce-tabs ul.tabs li a{
border-bottom-color: transparent;
}
#top div div.product .woocommerce-tabs ul.tabs li.active a{
font-weight: bold;
color: #0f77bd;
border-right: 1px solid #ebebeb;
border-left: 1px solid #ebebeb;
border-top: 5px solid #0f77bd;
border-radius: 5px 5px 0 0;
}
#top div div.product .woocommerce-tabs .panel{
border: 0;
/* border-top: 1px solid #ebebeb;*/
padding: 50px 0 0 0;
position: relative;
top: -6px;
}
#top .avia-button.avia-color-dark{
border-color: rgb(0 0 0 / 30%);
}
#top div.product .woocommerce-tabs{ padding:20px 0 0 0; margin: 0 0 50px 0;}
#wrap_all #main .single-product-main-image{padding: 0; margin: 0;}
/*Woo產品描述區滿版樣式-end*/
/*Woo產品描述區滿版樣式-解除預設排版
.single-product-summary {overflow: hidden;} 內建參數移除 改 initial
.template-shop div.product div.summary 內建參數要修改不要滿版
*/
@media only screen and (min-width: 768px) {
/* Add your Desktop Styles here */
#wrap_all #main .single-product-summary{ overflow: initial; }
#wrap_all #main .template-shop div.product div.summary{width: 45%;float: right;}
}
/*產品資訊下方描述優化 by 20240610*/
#wrap_all #main .woocommerce-Tabs-panel{
/*max-width: 750px;*/
margin: 0 auto;
}
/*Woo產品描述區滿版樣式-解除預設排版-end*/
/*頁籤不要使用H2*/
.yikes-custom-woo-tab-title{display: none;}
#tab-additional_information > h2{display: none;}
/*woocommerce/templates/single-product/tabs/tabs.php h2 要追加class name才能使用*/
.woo-tap-title{display: none;}
/*QA UI 優化 2023-0811*/
#top #wrap_all .togglecontainer section{
overflow: hidden;
border:1px solid #c5c5c5;
border-radius:10px;
margin: 0 0 20px 0;
box-shadow: -1px 0px 5px 0px rgba(65, 65, 65, 0.12);
}
#top #wrap_all .togglecontainer section p,
#top #wrap_all .togglecontainer section .toggle_content{
border: 0;
}
#top #wrap_all .togglecontainer section .toggler{
padding: 20px 30px;
font-weight: 500;
}
#top #wrap_all .togglecontainer section .single_toggle .toggle_content{
padding: 20px 30px;
background: transparent;
}
/*===
版型優化 2023-0918
===*/
/*分享按鈕黑邊移除*/
#top .av-share-box ul{
border: 0;
}
/*版型的分割線不顯示*/
.main_color .site-background, .main_color .first-quote, .main_color .related_image_wrap, .main_color .gravatar img .main_color .hr_content, .main_color .news-thumb, .main_color .post-format-icon, .main_color .ajax_controlls a, .main_color .tweet-text.avatar_no, .main_color .toggler, .main_color .toggler.activeTitle:hover, .main_color #js_sort_items, .main_color.inner-entry, .main_color .grid-entry-title, .main_color .related-format-icon, .grid-entry .main_color .avia-arrow,.main_color .grid-content, .main_color .av-share-box ul, #top .main_color .av-related-style-full .related-format-icon, .main_color .related_posts.av-related-style-full a:hover, .main_color.avia-fullwidth-portfolio .pagination .current, .main_color.avia-fullwidth-portfolio .pagination a, .main_color .av-hotspot-fallback-tooltip-inner, .main_color .av-hotspot-fallback-tooltip-count{
border: none;
}
/*表單優化*/
#top div .av-light-form .input-text, #top div .av-light-form input[type='text'], #top div .av-light-form input[type='input'], #top div .av-light-form input[type='password'], #top div .av-light-form input[type='email'], #top div .av-light-form input[type='number'], #top div .av-light-form input[type='url'], #top div .av-light-form input[type='tel'], #top div .av-light-form input[type='search'], #top div .av-light-form textarea, #top div .av-light-form select, div div .av-light-form .button{border-width: 1px !important;}
/*最新消息，資訊完整版*/
#top #wrap_all .news-iten-showall-tag{
margin-bottom: -40px;
}
#top #wrap_all .news-iten-showall-tag .slide-entry-excerpt{
height: auto;
}
/*LinePay UI FIX*/
#top #wrap_all .payment_method_linepay-tw img{
max-width: 80px;
}
/*ABOUT版型-space-bk-tag*/
#top #wrap_all .space-bk-tag{
background: #fafafa;
}
#top #wrap_all .space-bk-tag .flex_column_table{
background: #fff;
max-width: 1000px;
margin:0 auto;
float: none;
box-shadow: 0 2px 10px 0 rgba(0,0,0,.25);
}
#top #wrap_all .space-bk-tag .av-flex-placeholder{display: none;}
#top #wrap_all .space-bk-tag .space-info{
padding:35px 45px;
}
#top #wrap_all .space-bk-tag .avia-image-container-inner,
#top #wrap_all .space-bk-tag .avia_image,
#top #wrap_all .space-bk-tag .av-image-caption-overlay{
border-radius: 0;
}
@media only screen and (max-width:991px) {
#top #wrap_all .space-bk-tag .flex_column_table{
max-width: 800px;
}
#top #wrap_all .space-bk-tag .flex_column_table_cell{
display: block;
width: 100%;
}
#top #wrap_all .space-bk-tag .flex_column{
margin: 0;
}
#top #wrap_all .space-bk-tag .space-info{
padding:35px;
}
}
/*
==================================================
The Events Calendar 優化
==================================================
*/
#top #tribe-events-pg-template, #top.tribe-theme-enfold.single-tribe_events #tribe-events-pg-template{
padding: 0;
}
#top #wrap_all .tribe-common-anchor-thin{
font-size: 1rem;
color:#3d71a1;
font-weight: bold;
}
#top #wrap_all .tribe-events-calendar-month__calendar-event-datetime{
color:#eb4e00;
font-weight: bold;
font-size: 15px;
}
#top #wrap_all .tribe-events .tribe-events-calendar-month__day--past .tribe-events-calendar-month__calendar-event{
opacity: 1;
}
.tribe-events .tribe-events-calendar-month__day-cell--selected, .tribe-events .tribe-events-calendar-month__day-cell--selected:focus, .tribe-events .tribe-events-calendar-month__day-cell--selected:hover{
background-color: #c7c7c7;
}
.tribe-events .tribe-events-c-view-selector__content{
width: 150px;
}
.tribe-common .tribe-common-c-btn-border, .tribe-common a.tribe-common-c-btn-border{
border: 1px solid #3d71a1;
color:#3d71a1;
}
.tribe-events .tribe-events-c-subscribe-dropdown .tribe-events-c-subscribe-dropdown__button:hover{
background-color:#3d71a1;
}
.tribe-events .tribe-events-c-search__button, .tribe-events button.tribe-events-c-search__button{
background-color:#3d71a1;
}
/*The Events Calendar 優化 END*/
/*
==================================================
Pretty Google Calendar 優化
==================================================
*/
#top #wrap_all .fc-theme-standard{}
#top #wrap_all .fc-theme-standard a{color: #333;background: transparent; border: 0;}
#top #wrap_all .fc-theme-standard .fc-daygrid-day-top a{ background: transparent; }
#top #wrap_all .fc-theme-standard .fc-event-title{color: #3d71a1; padding: 0 15px; font-size: 15px; font-weight: 500; }
#top #wrap_all .fc-theme-standard .fc-event-time{ color: #eb4e00; padding: 0 15px; }
#top #wrap_all .fc-theme-standard .fc-header-toolbar{ justify-content: left;}
#top #wrap_all .fc-theme-standard .fc-header-toolbar .fc-toolbar-title{ margin:0 0 0 30px;}
#top #wrap_all .fc-theme-standard .fc-event-main{ color: #333; }
#top #wrap_all .fc-theme-standard .fc-day-today{background: transparent; border-bottom: #69b5e0 solid 5px;}
#top #wrap_all .fc-theme-standard .fc-day-today .fc-daygrid-day-top a{ color: #f2571b;font-weight: bold;font-size: 20px;}
#top #wrap_all .pgcal-branding{display: none;}
/*Pretty Google Calendar 優化 END*/
/*圖片圓角效果*/
.avia-image-overlay-wrap img{
border-radius: 10px;
}
.avia-image-container .avia_image, .avia-image-container .avia-image-overlay-wrap{
border-radius: 10px;
}
/*表底暸解我們BOX*/
#top .contact-information-color-tag{
max-width: 1150px;
margin: 0 auto 50px auto;
display: block;
float: none;
clear: both;
border: 0;
border-radius:10px;
overflow: hidden;
box-shadow: 0 0 5px 0 #777777;
}
@media only screen and (max-width: 767px) {
/* Add your Mobile Styles here */
#top .contact-information-color-tag{
max-width:95%;
}
}
/*==============
首頁Banner文字滿版
==============*/
#top #wrap_all .slideshow_caption{width: 100%;}
/*==============
作品集網格-客製化設計
==============*/
#top #wrap_all .grid-entry .inner-entry{
box-shadow: none;
padding: 15px;
}
#top #wrap_all .grid-entry .grid-entry-title{
font-size: 20px;
font-weight: 500;
color: #1f7e9e;
text-align: center;
}
/*==============
影音內容管理系統(CMS) 表格
==============*/
#top #wrap_all .pricing-table-content{}
#top #wrap_all .pricing-table-content .col-md-3 {
width:33.33%;
}
@media only screen and (max-width: 767px) {
/* Add your Mobile Styles here */
#top #wrap_all .pricing-table-content .col-md-3 {
width: 100%;
margin-bottom: 35px;
}
}
#top #wrap_all .price-header {
background: linear-gradient(to bottom right, #1fc6ff, #0075b5);
color: #ccc;
display: inline;
float: left;
width: 100%;
border-radius: 15px 15px 0 0;
}
#top #wrap_all .pricing-table-content .price {
color: #fff;
display: inline-block;
float: left;
font-size: 20px;
font-weight: 500;
padding: 15px;
width: 100%;
text-align: center;
}
#top #wrap_all .price-article{
display: inline-block;
float: left;
padding: 0 20px;
width: 100%;
border: 1px solid #c5c5c5;
}
#top #wrap_all .price-article br{display: none;}
#top #wrap_all .price-article ul li {
border-bottom: 1px solid #ccc;
color: #333333;
padding: 15px 0;
list-style: none;
text-align: center;
}
#top #wrap_all .price-article ul li .fa-times{
background:url(../images/remove.svg) no-repeat 0 0;
background-size: auto 100%;
display: inline-block;
width: 15px;
height: 15px;
position: relative;
top: 1px;
}
#top #wrap_all .price-article ul li span{
color: #dc0b0b;
}
#top #wrap_all .col-md-3{
width: 25%;
float: left;
padding: 0 15px 0 0;
}
/*品牌介紹專用版型優化，不顯示標題名稱，只有圖片*/
#top #wrap_all .brand-tp-tag .slide-entry-title{
display: none;
}
/*子選單寬度預設250px*/
/*#top #wrap_all #header_main .av-main-nav ul{
min-width: 250px;
}
*/
/*
Desktop Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the desktop view of your site */
@media only screen and (min-width: 768px) {
/* Add your Desktop Styles here */
}
/*
Mobile Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the Mobile and Tablet Portrait view */
@media only screen and (max-width: 767px) {
/* Add your Mobile Styles here */
}