/*---------------------------------- Theme Name: Extent Theme URI: http://webnus.biz/themes/extent-html Author: WEBNUS Author URI: http://themeforest.net/user/WEBNUS Description: Extent HTML Template Version: 1.0.4 License: GNU General Public License License: themeforest.net ------------------------------------------------------------------------*/ @import url('./base.css'); /* Import Basic Styles, Typography, Forms etc stylesheet */ @import url('./scaffolding.css'); /* Import Responsive Grid System Stylesheet */ @import url('./blox.css'); /* Import Full width Sections + Parallax Stylesheet */ @import url('./prettyPhoto.css'); /* Import prettyPhoto Stylesheet */ @import url('./flexslider.css'); /* Import Flex Slider Stylesheet */ @import url('../layerslider/css/layerslider.css'); /* Import Layer Slider Stylesheet */ @import url('../rs-plugin/css/settings.css'); /* Import Revolution Slider Stylesheet */ @import url('./iconfonts.css'); /* Import Vector Icons Stylesheet */ @import url('./shop.css'); /* Import Shop stylesheet */ @import url('./blog.css'); /* Import Blog stylesheet */ @import url('./elements.css'); /* Import Elements stylesheet */ @import url('./pages.css'); /* Import Pages stylesheet */ @import url('./portfolio.css'); /* Import Portfolio Stylesheet */ @import url('./widgets.css'); /* Import Widgets stylesheet */ @import url('./icon-box.css'); /* Import Icon Boxes stylesheet */ @import url('./main-menu.css'); /* Import Menu Stylesheet */ @import url('./color-skins.css'); /* Import Color Skins Stylesheet */ /*-----------------------------------------------------------------------------------*/ /* #Site Styles ================================================== */ body { background: #f4f7f8 url(../images/bdbg1.png); } /* WRAPPER */ #wrap { display: block; margin: 0 auto; position: relative; padding: 0; background: #fff; visibility:visible; clear:both; overflow:hidden; } #wrap.boxed-wrap { display:block; margin: 0 auto; background: #fff; overflow:hidden; width: 1000px; -webkit-box-shadow: 0 0 11px rgba(0,0,0,0.4); -moz-box-shadow: 0 0 9px rgba(0,0,0,0.4); box-shadow: 0 0 9px rgba(0,0,0,0.4); border: 1px solid #d6dbdc\9; border-bottom: none; visibility:visible; } #wrap.boxed-wrap .container { width:100%;} #wrap p img { height:auto;} #wrap.boxed-wrap #header {top:inherit; left:inherit; width: 1000px;} #site-title { margin-top:25px; padding-bottom:10px; line-height:1.4;} #site-title a { color:#3B454D;} #site-title small { display:block; margin-top:5px;} #main-content.container { padding-top:35px;} /* HEADLINE */ #headline { width: 100%; padding: 24px 0 14px; border-bottom:1px solid #e3e3e3; border-top: 1px solid #e3e3e3; display: table; } #headline h3 { font-size: 19px; line-height:1.3; position: relative; text-transform: uppercase; font-weight: 600; letter-spacing: 0; padding-left:10px; } #headline h3 small { font-size: 13px; font-weight: 400; margin-left: 10px; letter-spacing: 0; text-transform: capitalize; } /* TOP-BAR */ .top-bar { background:#f7f7f7; min-height:26px; padding:5px 0; border-bottom:4px solid #fbfbfb; } .top-bar h6 { font-size:12px; font-weight:400; margin:0 10px 0 0; color:#999; letter-spacing:0.6px;} .top-links { float:left; color:#d7d7d7; font-size:11px; padding:4px 0 0 4px; display:table; } .top-links.rgtflot { float:right; padding-right:10px;} .top-links img, .container .top-links p { float:left; margin:4px 3px 0 0;} .container .top-links p { color:#d9d9d9; font-weight:bold; font-size:12px; line-height:1; margin:5px 9px 0 0;} .top-links a, .top-links span { color: #9aa6af; font-size:10px; display:inline; margin:0 6px; text-transform:uppercase; font-weight:400; letter-spacing:0.6px; } .top-links a:hover { color:#ff932a} .top-links a:after {content: "|"; padding-left: 10px; color:#ccc; } .top-links a:last-child:after {content: "";} .top-co-inf .top-links { float:right; margin-top:8px;} .top-co-inf .top-links p { color:#6d6e71; } /* HEADER */ #header { z-index: 10000; width: 100%; background: #fff; padding: 0 0 30px 0;} #header h6, .top-bar h6, .top-inf h6 { font-size:12px; margin:18px 14px; font-weight:600; color:#797979; display:inline-block;} #header h6 a.nav-right-icon, .top-bar h6 i, .top-inf h6 i { background:none; font-size:16px; color:#6a6c75; display:inline; margin:7px 4px; padding:8px; border-radius:50%; border:1px solid #999; vertical-align:middle;} .top-bar h6 i { padding:0; border:none;} .top-bar h6 { margin:0 10px 0 0;} #header h6 a.nav-right-icon{position: relative; width: 40px; height: 40px; display: block; text-align: center; margin:0 0;} #header h6 a.nav-right-icon span{ position: absolute; right: -20px; top: -15px; font-size: 12px; background: #f00; width: 30px; height: 30px; border-radius: 50%; color: #fff; line-height: 30px; text-align: center; display: block; } #header h6 a.nav-right-icon:hover { border:1px solid #ccc; background: #7ac943; } #header h6 a.nav-right-icon:hover i{ color: #fff; } .logo { height: auto; float: left;} .logo img { max-width: 100%; max-height: 100%; margin-top: 5px;} .nav-wrap1 .container { width:auto;} #header .img-logo-w1 { display:block; width:80%; margin:0 auto;} #header .img-logo-w2, #header .img-logo-w3 { display:none; width:300px; margin:0 auto;} .transparent-header-w #header .img-logo-w1, .transparent-header-w #header .img-logo-w3 { display:none} .transparent-header-w #header .img-logo-w2 { display:block;} #header.sticky .img-logo-w2 { display:none;} .logo-sticky { display:none;} #search-form { float:right; margin:20px 8px auto 0; position:relative; padding-left: 14px; height: 24px;} #search-form .search-text-box, #search-form2 .search-text-box2 { background-color: rgba(255,255,255,0.73); background-image: url('../images/searchicon@2x.png'); background-repeat: no-repeat; background-position: 9px 9px; background-size:16px 16px; border: 3px solid #a2a7b1; box-shadow: none; color: transparent; cursor: text; font-size: 13px; color:#444; min-height:38px; height:38px; line-height: 18px; padding: 7px 5px 8px 30px; transition: all 0.3s ease-in-out 0s; width:1px; min-width: 210px;} #search-form2 { display:none; position:relative; } #search-form2 .search-text-box2 { width:220px; margin:auto; position:relative; } .search-form-box { position:absolute; right:-25px; display:none; margin-top:24px;} .search-form-box * { margin:0;} .search-form-box.show-sbox { display:block; -webkit-animation: fade-anim .3s ease .037s both; animation: fade-anim .3s ease .037s both; z-index:91120; } .search-form-box:before { content: '';display: block;position: absolute; right:19px;width: 0;height: 0;border-style: solid; border-width: 7px; top: -14px; border-color: transparent transparent #a2a7b1 transparent ;} a.search-form-icon, a.search-form-icon:visited { display:block; width:16px; height:16px; color:#aaa;} a.search-form-icon i { color:#aaa; border:1px solid #aaa; padding:8px 9px; font-size:11px; border-radius:50%;} a.search-form-icon:hover { color:#555;} @media only screen and (min-width: 960px) { #header.sticky #site-title { display:none;} #header.sticky #nav-wrap, #header.sticky.hi-header #nav-wrap { width:100%; border-bottom:1px solid #e9e9e9\9; box-shadow:0 0 3px rgba(0,0,0,0.21); z-index:800000000; background:rgba(255,255,255,0.97); display:block; position:fixed; height:60px; padding:0; left:0; top:0; -webkit-animation: header-anim .2s ease .027s both; animation: header-anim .2s ease .027s both; transition: background 0.3s ease-in-out 0s; } #header.sticky #nav-wrap:hover { background:#fff;} #header.sticky #nav-wrap .container { width:88%; float:none; padding:0 30px 0 300px; position:relative; margin-left:auto; margin-right:auto; } #header.sticky .logo-sticky { display:block; position:fixed; top:0; max-width:280px; z-index:900000000; -webkit-animation: fade-anim .3s ease .044s both; animation: fade-anim .3s ease .044s both;} #header.sticky .logo-sticky img.img-logo-w3 { max-height: 40px; width: auto; max-width:280px; margin-top: 10px; display:block; } #header.hi-header, #header.hi-header .logo .img-logo-w1 { position:fixed; height:0; padding:0; background:none; border:none; display:none;} #header.sticky.hi-header, #header.hi-header .logo-sticky, #header.hi-header .logo-sticky img.img-logo-w3 { display:block; -webkit-animation: fade-anim .3s ease .044s both; animation: fade-anim .3s ease .044s both; } .transparent-header-w #header { background:none; border:none;} .transparent-header-w .top-bar, .transparent-header-w #headline { display:none; } .transparent-header-w #header.sticky { position:fixed; left:auto; top:auto;} .transparent-header-w #header.sticky .img-logo-w2 { display: none;} .transparent-header-w #header #nav > li > a, .transparent-header-w .woo-cart-header .header-cart span, .transparent-header-w a.search-form-icon { color:#000; text-shadow:1px 1px 0 rgba(255,255,255,0.25), 0 0 3px #fff;} .transparent-header-w a.search-form-icon i { color:#000; border-color:#000;} .transparent-header-w .woo-cart-header .header-cart { background-image: url('../images/woobag@2xb.png');} .transparent-header-w.t-dark-w #header #nav > li > a, .transparent-header-w.t-dark-w .woo-cart-header .header-cart span, .transparent-header-w.t-dark-w a.search-form-icon { color: #fff; text-shadow: 1px 1px 0 rgba(0,0,0,0.25); } .transparent-header-w.t-dark-w a.search-form-icon i { color:#fff; border-color:#fff;} .transparent-header-w.t-dark-w .woo-cart-header .header-cart { background-image: url('../images/woobag@2x.png');} .transparent-header-w #header.sticky #nav > li > a { color:#333; text-shadow:none;} .transparent-header-w #header.sticky .woo-cart-header .header-cart span { color:#9d9d9d; text-shadow:none;} .transparent-header-w #header.sticky a.search-form-icon { color:#aaa; text-shadow:none;} .transparent-header-w #header.sticky a.search-form-icon i { color:#aaa; border-color:#aaa;} .transparent-header-w #header.sticky .woo-cart-header .header-cart { background-image: url('../images/woobag@2x.png');} } /* Header animations */ @-webkit-keyframes header-anim { from {opacity: 0.5; -webkit-transform: translateY(-60px); transform: translateY(-20px);} to {opacity: 1; -webkit-transform: translateY(0); transform: translateY(0);} } @keyframes header-anim { from {opacity: 0.5; -webkit-transform: translateY(-60px); -ms-transform: translateY(-60px); transform: translateY(-60px);} to {opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0);} } @-webkit-keyframes header-anima { from {height:0;} to {height:60px; padding:0;} } @keyframes header-anima { from {height:0; } to {height:60px; padding:0;} } @-webkit-keyframes fade-anim { from {opacity: 0; } to {opacity: 1;} } @keyframes fade-anim{ from {opacity: 0; } to {opacity: 1;} } /* # 404 Styles ================================================== */ .Error404Section{ background: #f8f8f8} .Error404Section h1{font-size: 84px;text-transform: uppercase;line-height: 1.4;font-weight: 900; margin-bottom: 10px} .Error404Section h2{color: #1bbc9b;font-size: 36px;font-weight: 400;margin-bottom: 30px;} /* --------------------- */ /* FOOTER */ #footer { width: 100%; text-align: left; background: url(../images/footer-bg.png) no-repeat center #9ca990; background-size:cover; height: 380px; margin: 0px auto 0; border-bottom: 5px #7ac943 solid; } #footer.litex { background: #fafafa; border-top: 6px solid #e9e9e9; } .footer-in { margin: 0 auto; padding-bottom: 50px; color: #ccc; position: relative; } .footer-in .columns { margin-top: 20px; } .footer-in h5.subtitle, .toggle-top-area h5.subtitle { color: #ddd; display: block; border-bottom: 2px solid #131415; padding-bottom: 6px; margin: 0; margin:0 0 25px 0; -webkit-box-shadow: 0 1px #232628; -moz-box-shadow: 0 1px #232628; box-shadow: 0 1px #232628; position: relative; font-size:12px; letter-spacing:1px; text-transform:uppercase; line-height:1.5; font-weight:bold; text-shadow:0 1px 0 #000; } #footer.litex .footer-in h5.subtitle { color:#414141;} #footer h5.subtitle span, .toggle-top-area h5.subtitle span { position: absolute; right: 0; text-align: right; } #footer h5.subtitle span a, .toggle-top-area h5.subtitle span a { color: #787878; font-size: 10px; font-weight: 400; } #footer .widget ul.menu li:after { display:none; content:"";} #footer .widget ul.menu li { border:none;} #footer .footer-in .widget ul.menu li:hover { background:none;} .footer-in hr { border-color: #373737; } .footer-in .copyright-txt { font-size: 12px; } .footer-in p { line-height: 19px; color: #898989; } .contact2 div { line-height: 21px; } .footer-in a { text-decoration: none; -webkit-transition: all 0.18s ease; -moz-transition: all 0.18s ease; -o-transition: all 0.18s ease; transition: all 0.18s ease; } .footer-sbc { position: relative; text-align: center; margin: 0 auto; } .footer-sbc input[type="text"], .footer-sbc input[type="submit"] { float: left; margin: 4px 7px; } /* Social Icons */ .social-icons a { border: 0; float: left; margin: 1px 7px 0 12px; opacity: 0.5; text-decoration: none; -webkit-transition: opacity 0.5s ease; -moz-transition: opacity 0.5s ease; -ms-transition: opacity 0.5s ease; -o-transition: opacity 0.5s ease; transition: opacity 0.5s ease; } .social-icons a:hover { opacity: 1; } .social-icons.members { clear: both; text-align: center; margin-bottom: 10px; } .social-icons.members a { text-align: center; float: none; } .footer-in a img { float: left; } .contact-inf span { display: block; color: #9b9b9b; font-family: Arial; font-size: 14px; } .contact-inf i { margin-right: 5px; color: #474747; } .contact-inf form { margin-top: 20px; } .footer-in .contact-inf input, .footer-in .contact-inf textarea { display: block; min-width: 97%; margin: 12px 0; background: #222; color: #ccc; border: none; font-family: Arial, Helvetica, sans-serif; font-size: 12px; padding: 10px 0px 10px 12px; border-radius: 0; } .footer-in .contact-inf button { padding: 12px 22px; font-size: 10px; text-transform:uppercase; letter-spacing:1px; color:#aaa; font-weight: bold; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; background: #333; background: -moz-linear-gradient(top, #333, #252525); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #333), color-stop(100%, #252525)); background: -webkit-linear-gradient(top, #333, #252525); background: -ms-linear-gradient(top, #333, #252525); background: -o-linear-gradient(top, #333, #252525); background: linear-gradient(top, #373737, #252525); border: 1px solid #202020; float: right; margin-right:6px; } .footer-in a:hover { color: #85b940; } #footer.litex .footer-in a { color: #0093d0; } .footer-in a.terms { color: #578f1a; } .footer-navi.floatright { float:right;} .footer-in .col-md-12 .widget {text-align:center;} .footbot { margin: 0 auto; position: relative; background: #fff; padding: 10px 0 8px; text-align: center; box-shadow: -4px 0px 8px #999; } #footer.litex .footbot { background:#e9e9e9} #footer.litex .footbot, #footer.litex .footer-in h4, #footer.litex .footer-in hr { border-color: #e0e0e0; color: #5b5b5b; } .footbot img { position: relative; margin: 6px 40px 0 0; opacity: 0.93; } .footer-navi { text-align: center; line-height: 38px; font-size: 12px; color: #444; } .footer-navi ul { margin-left: 40px; } .footer-navi p { color: #717171; margin: 0 4px; font-size: 14px; padding: 25px 0; } .footer-navi span{ display: inline-block; width: 34px; height: 34px; border: 1px solid #333; border-radius: 50%; margin-right: 10px;} .footer-navi span i{ font-size: 18px; line-height: 34px; } .footer-nav-wrapper{padding: 0; margin: 0 auto;} .footer-nav-wrapper ul{ list-style: none; } .footer-nav-wrapper > ul > li{ float: left; text-align: center; width: 16%;} .footer-nav-wrapper > ul > li p{ font-size: 15px; color: #fff; font-weight: bold; } .footer-nav-wrapper > ul > li p:after{content: ''; border-bottom: 1px solid #fff; width: 40px; display: block; margin: 5px auto;} .footer-nav-wrapper > ul > li a{ color: #fff; font-size: 13px; } .footer-nav-wrapper > ul > li a:after{content: ''; width: 4px; height: 4px; border-radius: 2px; display: block; margin: 5px auto; background: #fff;} .footer-nav-wrapper > ul > li ul li:last-child a:after{content: none;} .footer-nav-wrapper > ul > li ul li{margin: 0px auto;} .footer-nav-wrapper > ul > li a:hover{color: #e3e3e3;} #footer .mail-signup { margin:0px auto; width:100%; text-align:center;} #footer .mail-signup h3{ display:block; width:30%; font-size:15px; line-height:40px; color:#666; vertical-align:middle; text-align: right; padding: 0 20px 0 0; float: left; text-transform:uppercase;} #footer .mail-signup form{ display:block;} #footer .mail-signup form input{ width:40%; border-radius:4px; border:1px solid #999; height:36px; padding:0; margin:0 auto; font-size:13px; line-height:36px; color:#333; text-align:center; float: left; min-width: inherit;} #footer .mail-signup form button{ height:36px; width:16%; border-radius:4px; background: none; color:#333; padding:0; margin:0 2%; border:1px solid #999; font-size:13px; line-height:36px; float: left; vertical-align:middle;} #footer .mail-signup form button:hover{ background: #9ca990; color: #fff; border-color: #fff;} /* Social Icons */ .socialfollow { float: right; } .socialfollow a { background: #fff; height:38px; margin: 5px; width: 38px; line-height: 38px; text-align: center; text-decoration: none; display: inline-block; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transition: all 0.31s ease; -moz-transition: all 0.31s ease; -ms-transition: all 0.31s ease; -o-transition: all 0.31s ease; transition: all 0.31s ease; } .socialfollow a i{ line-height: 38px; } .socialfollow a:first-of-type { margin-left: 0; } .footer-in .socialfollow a:hover { text-decoration: none; } .contact-top a.facebook:hover, .socialfollow a.facebook:hover { background: #3b5996; } .top-bar .socialfollow a.facebook:hover i, .our-team .socialfollow a.facebook:hover i { color: #3b5996; } .contact-top a.twitter:hover, .socialfollow a.twitter:hover { background: #00acee; } .top-bar .socialfollow a.twitter:hover i, .our-team .socialfollow a.twitter:hover i { color: #00acee; } .contact-top a.vimeo:hover, .socialfollow a.vimeo:hover { background: #0dadd6; } .top-bar .socialfollow a.vimeo:hover i, .our-team .socialfollow a.vimeo:hover i { color: #0dadd6; } .contact-top a.dribble:hover, .socialfollow a.dribble:hover { background: #d53e68; } .top-bar .socialfollow a.dribble:hover i, .our-team .socialfollow a.dribble:hover i { color: #d53e68; } .contact-top a.youtube:hover, .socialfollow a.youtube:hover { background: #cb322c; } .top-bar .socialfollow a.youtube:hover i, .our-team .socialfollow a.youtube:hover i { color: #cb322c; } .contact-top a.pinterest:hover, .socialfollow a.pinterest:hover { background: #cb2027; } .top-bar .socialfollow a.pinterest:hover i, .our-team .socialfollow a.pinterest:hover i { color: #cb2027; } .contact-top a.google:hover, .socialfollow a.google:hover { background: #c3391c; } .top-bar .socialfollow a.google:hover i, .our-team .socialfollow a.google:hover i { color: #c3391c; } .contact-top a.linkedin:hover, .socialfollow a.linkedin:hover { background: #0073b2; } .top-bar .socialfollow a.linkedin:hover i, .our-team .socialfollow a.linkedin:hover i { color: #0073b2; } .socialfollow a.rss:hover { background: #f29a1d; } .top-bar .socialfollow a.rss:hover i, .our-team .socialfollow a.rss:hover i { color: #f29a1d; } .contact-top a.instagram:hover, .socialfollow a.instagram:hover { background: #457399; } .top-bar .socialfollow a.instagram:hover i, .our-team .socialfollow a.instagram:hover i { color: #457399; } .contact-top a.other-social:hover, .socialfollow a.other-social:hover { background: #ff5d5e; } .top-bar .socialfollow a.other-social:hover i, .our-team .socialfollow a.other-social:hover i { color: #ff5d5e; } .socialfollow img { opacity: 0.79; } .socialfollow i { font-size: 18px; color: #fff; opacity: 0.95; } #footer.litex .socialfollow i { color: #343434; } #footer.litex .socialfollow a:hover i { color: #fff; } .top-bar .socialfollow { float: right; margin-right: 10px; } .top-bar .socialfollow.lftflot { float: left; } .top-bar .socialfollow img { opacity: 0.97; } .top-bar .socialfollow a, .our-team .socialfollow a { padding: 4px; margin: 1px 4px; background: none; height:26px; } .top-bar .socialfollow i, .our-team .socialfollow i { color: #979797; -webkit-transition: all 0.25s ease; -moz-transition: all 0.25s ease; -ms-transition: all 0.125s ease; -o-transition: all 0.25s ease; transition: all 0.25s ease; } .top-bar .socialfollow a:hover, .our-team .socialfollow a:hover { background: none; } /* --------------------- */ /* Side Nav */ #side-content { float:right;} #side-nav { float:left; z-index:979;} #side-nav ul { padding:10px 20px; background:#fff; border:3px solid #f3f3f3; list-style:none;} #side-nav ul li { border-bottom:1px solid #eaeaea; padding:0; margin:0;} #side-nav ul li:last-of-type { border-bottom:0 none;} #side-nav ul li ul { border: none; padding:0; padding-left:20px; margin:0; background:#fdfdfd; display:none;} #side-nav a { display:block; color:#575757; padding:14px 0; text-transform:capitalize; font-size:13px; font-weight:400; letter-spacing:0.2px; } #side-nav a:after { float:right; font-family: 'FontAwesome'; font-size:10px; color:#878787; content: "\f054"; speak: none; font-style: normal; font-weight: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased;} #side-nav a:hover, #side-nav a:hover:after { color:#ff9900;} #side-nav li.current a, #side-nav li.current a:after { color:#0093d0;} #side-nav ul li ul li a { padding:10px 0; font-size:12px;} #side-nav ul li:hover > ul { display:block;} /* Image Gallery */ .image-gallery { display:block; margin:10px 0;} .image-gallery ul li { float:left; width:215px; height:215px; margin:1px; overflow:hidden;} .image-gallery ul li img { max-width:420px; width:auto; height:215px; border-radius:1px; text-align:center} .image-gallery .zoomex { bottom:0;} /* Social Media */ .blox .social-media {text-align: center} .blox .social-media a {text-align: center; padding: 0 10px; margin-bottom: 20px; display: inline-block;} .blox .social-media a i {border:2px transparent solid;font-size:4em;padding: 30px;border-radius: 50%;color: #fff;margin-bottom: 20px;display: block; -webkit-transition: all .3s ease-in-out;-moz-transition: all .8s ease-in-out;-ms-transition: all .8s ease-in-out;-o-transition: all .8s ease-in-out;transition: all .8s ease-in-out;background:rgba(15, 15, 15, 0.6)} .blox .social-media a:hover i {color: #fff;border:2px #fff solid;} .blox .social-media a span{-webkit-transition: all .8s ease-in-out; -moz-transition: all .8s ease-in-out; -ms-transition: all .8s ease-in-out; -o-transition: all .8s ease-in-out; transition: all .8s ease-in-out; color:transparent;text-transform: uppercase; font-size:16px; font-weight:600; text-shadow: 0 0 5px rgba(33, 65, 83, 1) } .blox .social-media a:hover span{color:#fff;} #social-media.active.facebook{ background: #3b5996 !important; } #social-media.active.twitter { background: #00acee !important; } #social-media.active.vimeo { background: #0dadd6 !important; } #social-media.active.dribble { background: #d53e68 !important; } #social-media.active.youtube{ background: #cb322c !important; } #social-media.active.pinterest{background: #cb2027 !important; } #social-media.active.google{background: #c3391c !important; } #social-media.active.linkedin { background: #0073b2 !important; } #social-media.active.rss{ background: #f29a1d !important; } #social-media.active.instagram{ background: #457399 !important; } #social-media.active.skype{ background: #00aaf3 !important; } #social-media.active.other-social { background: #ff5d5e !important; } #social-media.blox .social-media a span{display:none;} #social-media.blox .social-media a i{background:none; font-size:2em;border: 1px transparent solid; margin:0; padding:20px;} #social-media{transition: background-color .8s ease-in-out;-webkit-transition: background-color .8s ease-in-out;-moz-transition: background-color .8s ease-in-out;-ms-transition: background-color .8s ease-in-out;-o-transition: background-color .8s ease-in-out;} #social-media.blox .social-media a{margin: 20px 0;} #social-media.blox .social-media a:hover i {border: 1px #fff solid} /* #Misc ================================================== */ /* EXTRAS */ .brdr-r1, .brdr-r2 { border-right: 1px solid #e5e5e5; } .brdr-l1, .brdr-l2 { border-left: 1px solid #e5e5e5; } .brdr-r2 { padding-right: 27px; } .brdr-l2 { padding-left: 27px; } .pad-r27 { padding-right: 27px; } .pad-l27 { padding-left: 27px; } .blox.dark .brdr-r1, .blox.dark .brdr-r2, .blox.dark .brdr-l1, .blox.dark .brdr-l2 { border-color:rgba(255,255,255,0.5);} .alignright { text-align: right; } img.alignright { float: right; margin-left:10px; } .alignleft { text-align: left; } img.alignleft { float: left; margin-right:10px; } .aligncenter { text-align: center; } .wp-caption { display: block; color: #444; } .wp-caption-text { font-size: 15px; } .gallery-caption { display: inline; } .bypostauthor { font-size: 13px; } .moonicons-box1 { font-size: 14px; line-height:22px; display: inline-block; width:23.33%; padding: 6px; background: #fff; margin: 6px; border: 1px solid #e8e8e8; } .moonicons-box1 span { font-size:20px; float:left; margin-right:3px;} .tmpl-ex { margin-bottom:40px; padding:10px; text-align:center;} .tmpl-ex h4 { margin-top: 30px; font-weight: 500; font-size: 17px; letter-spacing: 1.4px;} .tmpl-ex a { color: #222; border-top: 10px solid #d2d2d2; display: inline-block; border-radius: 3px; max-width:420px;} .tmpl-ex img { width:100%; webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; transition: all .5s ease-in-out;} .tmpl-ex img:hover { opacity:0.66;} .alignright { text-align: right; } img.alignright { float: right; } .alignleft { text-align: left; } img.alignleft { float: left; } .aligncenter { text-align: center; } .wp-caption { display: block; color: #444; } .wp-caption-text { font-size: 15px; } .gallery-caption { display: inline; } .bypostauthor { font-size: 13px; } /* Scroll to top */ #scroll-top a.scrollup { position: fixed; bottom: 40px; right: 28px; display: none; opacity: 0.8; filter: alpha(opacity=89); z-index: 499841; } #scroll-top a.scrollup.cart{ bottom: 90px; } #scroll-top a.scrollup.chat{ bottom: 80px; } #scroll-top hr.scroll-topline, #scroll-top hr.scroll-btmline{position: fixed; display: none; bottom: 100px; width: 50px; right: 22px; border: solid #999; border-width:1px 0 0; } #scroll-top hr.scroll-btmline{ bottom: 0px; } #scroll-top a i {border: 1px solid #999; border-radius: 50%; width: 40px; height: 40px; display: block; } #scroll-top a i span{ color: #fff; position: relative; right: -25px; top: -10px; padding: 2px 4px; background: #f33; border-radius: 50%; font-size: 12px; line-height: 22px; text-align: center; width: 26px; height: 26px; display: block;} #scroll-top a.scrollup.cart i{ background: url(../images/icon-cart.svg) no-repeat center #fff; } #scroll-top a.scrollup.chat i{ background: url(../images/icon-chat.svg) no-repeat center #fff; } #scroll-top a.scrollup.totop i{ background: url(../images/icon-totop.svg) no-repeat center #fff; } #scroll-top a:hover { cursor: pointer; opacity: 1; } #scroll-top a:hover i{ border: 1px solid #b95630; } h1.pnf404 { font-size: 176px; line-height: 1.1; font-weight:900;} h2.pnf404 { font-size: 42px; line-height: 1.2; font-weight:700; } input.txbx404 { float:left; margin-top:2px; margin-right:4px; padding:7px 4px; min-height:inherit; border-radius:3px; } input.btn404 { float:left; margin:1px; padding:8px 12px 9px; } body.error404 input.search-side { max-width:292px; min-height:40px; height:40px; border-radius:2px;} body.error404 .blox.dark { padding-bottom:120px; padding-top:60px;} .v-shadow-l { background:url(../images/v-shadow-left.png) no-repeat right center; } .v-shadow-r { background:url(../images/v-shadow-right.png) no-repeat left center; } .v-shadow-r, .v-shadow-l { min-height:320px; } .pad-r10 { padding-right:10px; } .pad-r20 { padding-right:20px; } .pad-r30 { padding-right:30px; } .pad-r40 { padding-right:40px; } .pad-l10 { padding-left:10px; } .pad-l20 { padding-left:20px; } .pad-l30 { padding-left:30px; } .pad-l40 { padding-left:40px; } /* #Column Shortcodes ----------- */ .one_half, .one_third, .two_third, .three_fourth, .one_fourth, .one_fifth, .two_fifth { margin-right: 4%; float: left; margin-bottom:20px; } .one_half { width: 48%; } .one_third { width: 30.6666%; } .two_third { width: 65.3332%; } .one_fourth { width: 22%; } .three_fourth { width: 74%; } .one_fifth { width: 16.8%; } .two_fifth { width: 37.6%; } .column-last { margin-right: 0 !important; clear: right; } .easyPieChart { position: relative; text-align: center; } .easyPieChart canvas { position: absolute; top: 0; left: 0; } .pie { text-align:center; font-size:49px; position:relative; margin:0 auto 20px; } .pie p { font-size:16px; color:#888; font-weight:400; position:absolute; bottom:-52px; width:100%; padding-top:10px; border-top:2px solid #f9f9f9;} .container .pie p { margin-bottom:0;} /* Typekit Fonts ------------------ */ p, #nav ul li, .textwidget, .widget-tabs li, .alert { font-family: 'proxima-nova', 'Varela', 'Source Sans Pro', Helvetica, Arial, sans-serif;} .icon-box3 h5, h3.lintex, .respo-tagline, a.magicmore { font-family: 'proxima-nova', 'Source Sans Pro', Helvetica, Arial, sans-serif;} nav.primary .portfolioFilters a, .max-title2 h2, .max-title4 h2, .zoomex2 h6, .max-counter.s-counter .max-count, .widget h4.subtitle, .postmetadata h6, .blog-post h3, .blog-single-post h1, .pin-ecxt h6, .icon-box h4, .icon-box4 h5, .latest-b2 *, .our-process-item h5, h6.blog-date, .testimonial-brand h5, .max-counter.s-counter h5, .callout h3, .pin-box h4, h1.portfolio-item-title, .works-item-cat-box, .works-item-date-box, .vc_progress_bar .vc_single_bar .vc_label, .wpb_accordion h3, .testimonial-brand h5 em, .tmpl-ex h4 { font-family: 'futura-pt', 'Source Sans Pro', Helvetica, Arial, sans-serif;} /* New serif google font (Arapey) */ blockquote, blockquote p, q, .max-quote h2, .testimonial-content h4, .qot-week h3, h5 em { font-family: 'Arapey', serif;} /* Breadcrumbs --------------- */ .breadcrumbs-w { background:#f9f9f9; padding:7px 0; font-size:11px; color:#6c7279; letter-spacing:2px; text-transform:uppercase; font-weight:600;} .breadcrumbs-w a { color:#5c646d;} .breadcrumbs-w a:hover { text-decoration:underline;} .breadcrumbs-w .container { padding-left:20px;} /*# Row fixes -------------- -------------- */ /* .blox.page-title-x, .parallax-sec.page-title-x, .video-sec.page-title-x { margin-top:-35px;} .row-wrapper-x { padding:0 10px;} .col-md-8.omega .row-wrapper-x { padding-left:0;} .row-wrapper-x .wpb_row.vc_row-fluid { width:auto; margin-left:-10px; margin-right:-10px;} #wrap .wpb_row.full-row, #wrap.boxed-wrap .wpb_row.full-row { margin-top:0; margin-left:0; margin-right:0; margin-bottom:0; clear:both;} #wrap .blox .wpb_row.full-row, #wrap .parallax-sec .wpb_row.full-row, #wrap .video-sec .wpb_row.full-row, #wrap.boxed-wrap .blox .wpb_row.full-row, #wrap.boxed-wrap .parallax-sec .wpb_row.full-row, #wrap.boxed-wrap .video-sec .wpb_row.full-row { margin:0;} #wrap .wpb_row.full-row.vc_row-fluid .vc_span12 .vc_row-fluid { margin-left:0; margin-right:0;} .wpb_revslider_element, .wpb_layerslider_element, .max-hero { margin-top:-35px;} .page-title-x .wpb_revslider_element, .page-title-x .wpb_layerslider_element, .page-title-x .max-hero { margin-top:0;} .blox.wpb_row, #wrap.boxed-wrap .blox.wpb_row, #wrap .blox.wpb_row, .blox .wpb_row, #wrap.boxed-wrap .blox .wpb_row, #wrap .blox .wpb_row{ margin-bottom:0;} .wpb_row.blox, .wpb_row.parallax-sec, .wpb_row.video-sec, .wpb_row.full-row { margin-right:0; margin-left:0; margin-bottom:0;} .blox .wbp_row, .blox .wpb_row.vc_row-fluid { margin-right:0!important; margin-left:0!important;} #wrap .blox .wpb_content_element, #wrap .parallax-sec .wpb_content_element, #wrap .video-sec .wpb_content_element { margin-bottom:0;} .wpb_single_image.wpb_content_element { margin-bottom:5px;} .wpb_layerslider_element.wpb_content_element, .wpb_revslider_element.wpb_content_element, .wpb_gmaps_widget.wpb_content_element { margin-bottom:0;} .wpb_layerslider_element .wpb_single_image.wpb_content_element, .wpb_revslider_element .wpb_single_image.wpb_content_element { margin-bottom:0px;} */ .row-wrapper-x p img { max-width:100%; height:auto;} #wrap p img, .wpb_single_image.wpb_content_element img { height: auto; max-width:100%;} .no-mb{margin-bottom:0 !important; } .ne-mb{margin-bottom:-30px !important; } /* WP pagenavi ----------- */ .wp-pagenavi { clear: both; font-size: 12px; text-align:center; } .wp-pagenavi span.pages { color:#999; } .wp-pagenavi a, .wp-pagenavi span { font-weight:bold; text-decoration: none; display:inline-block; background:#fff; border: 1px solid #d1d7dc; line-height:1; padding: 10px 14px; margin: 3px 4px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; *zoom: 1; -webkit-box-shadow:0 1px 3px rgba(0,0,0,0.04); -moz-box-shadow:0 1px 3px rgba(0,0,0,0.04); box-shadow:0 1px 3px rgba(0,0,0,0.04); } .wp-pagenavi a:hover, .wp-pagenavi span.current { border-color: #efefef; background:#fdfdfd;} .wp-pagenavi a:hover {border-color: #d2d2d2;} .wp-pagenavi span.current { font-weight: bold;} .search-results .blog-post { padding-bottom: 7px; border-bottom: 4px solid #efefef; margin-bottom: 40px; } #footer .col-md-4, #footer .col-md-3 { padding-right:60px;} /* ----------- */ /* #how add ================================================== */ /* how add */ li.mobile-showbtns{display: none !important;} .index-news-wrapper,.index-products-wrapper{ padding-top: 35px; } .index-bottom-info {margin: 0 auto 50px;} .index-bottom-info ul{ list-style: none; } .index-bottom-info ul li{ float: left; width: 33.3%; height: 150px; text-align: center; position: relative;} .index-bottom-info ul li.index-icon01{ background: url(../images/index-icon01.svg) no-repeat center; } .index-bottom-info ul li.index-icon02{ background: url(../images/index-icon02.svg) no-repeat center; } .index-bottom-info ul li.index-icon03{ background: url(../images/index-icon03.svg) no-repeat center; } .index-bottom-info ul li span{position: absolute; bottom: 0; display: block; width: 100%;} .index-bottom-info .index-bottom-text a{ width: 140px; height: 30px; background: #d8953a; display: block; margin: 0 auto; font-size: 15px; line-height: 30px; border-radius: 20px; color: #fff; } .index-bottom-info .index-bottom-text{text-align: center; padding: 40px 20px; border-left: 1px solid #e5e5e5;} .index-bottom-info .index-bottom-text a i{ display: inline-block; margin-left:6px; } .index-bottom-info .index-bottom-text a:hover{background: #af7733;} h1.index-news-title.index-products-title{ background: url(../images/index-products-title.svg) no-repeat center left; width: 302px; height: 52px; margin: 0 15px; } h1.index-news-title{ background: url(../images/index-news-title.svg) no-repeat center left; width: 302px; height: 52px; margin: 0 15px; } .index-products-wrapper hr{ margin: 14px 0 20px; } .index-products-wrapper .index-p-tab{ color: #666; margin: 0px 15px 30px; display: inline-block; font-size: 15px; } .index-products-wrapper .index-p-tab i{margin-right:5px; } .index-products-wrapper .index-p-tab:hover, .index-products-wrapper .index-p-tab.current{ color: #d8953a; } .index-news-wrapper a:hover img{opacity: 0.7;} /* index products-box */ a.products-box{position: relative; display: block; cursor: pointer; text-align: center;} a.products-box img{ display: block; width: 100%; height: auto; } a.products-box span.numbers{position: absolute; left: 0; top: -30px; z-index: 999; width: 50px; height: 50px; background: url(../images/number-icons.png) no-repeat top left;} a.products-box > h6{ color: #999; font-size: 13px; } a.products-box p.p-title{ font-size: 15px; line-height: 24px; font-weight: bold; } a.products-box hr{ margin: 5px auto; border-color: #aaa; width: 90%; } a.products-box p.p-price{ font-size: 18px; font-weight: bold; } a.products-box p.p-price span{font-size: 14px; color: #999; padding-right: 5px;} a.products-box:hover p.p-title, .pin-box:hover p.p-title{color: #d8953a;} .pin-box:hover:hover img{opacity: 0.8;} a.products-box:hover span.numbers{left: 5px; top: -25px;} a.products-box span.numbers.n02{background-position: left -50px;} a.products-box span.numbers.n03{background-position: left -100px;} a.products-box span.numbers.n04{background-position: left -150px;} a.products-box span.numbers.n05{background-position: left -200px;} a.products-box span.numbers.n06{background-position: left -250px;} a.products-box span.numbers.n07{background-position: left -300px;} a.products-box span.numbers.n08{background-position: left -350px;} a.products-box span.numbers.n09{background-position: left -400px;} a.products-box span.numbers.n10{background-position: left -450px;} a.products-box span.numbers.n11{background-position: left -500px;} a.products-box span.numbers.n12{background-position: left -550px;} a.products-box span.numbers.hot01{background-position: right 0px;} a.products-box span.numbers.hot02{background-position: right -50px;} a.products-box span.numbers.hot03{background-position: right -100px;} a.products-box span.numbers.hot04{background-position: right -150px;} a.products-box span.numbers.hot05{background-position: right -200px;} a.products-box span.numbers.hot06{background-position: right -250px;} a.products-box span.numbers.hot07{background-position: right -300px;} a.products-box span.numbers.hot08{background-position: right -350px;} a.products-box span.numbers.hot09{background-position: right -400px;} a.products-box span.numbers.hot10{background-position: right -450px;} a.products-box span.numbers.hot11{background-position: right -500px;} a.products-box span.numbers.hot12{background-position: right -550px;} /* end index products-box */ /* products-list */ .plist-top-wrapper{ position: relative; background: url(../images/plist-topimg.jpg) no-repeat center; background-size: cover; height: 350px; width: 100%; margin: 0 auto; padding-top: 20px;} .products-top-wrapper{ position: relative; background: url(../images/plist-topimg.jpg) no-repeat top center; background-size: cover; height: 230px; padding-top: 60px;} .plist-top-wrapper .plist-title{ background: url(../images/plist-title.png) no-repeat center; width: 350px; height: 114px; background-size: cover; margin: 0px auto; } .plist-btn-wrapper{ width: 700px; margin: 20px auto; text-align:center; } .plist-btn-wrapper a.plist-topbtn{ display: inline-block; padding:0 5px; line-height: 30px; font-size: 13px; margin: 2px 5px; border-radius: 30px; border:1px solid #fff; text-align: center; background: rgba(0,0,0,0.6); color: #fff; } .plist-btn-wrapper a.plist-topbtn.current, .plist-btn-wrapper a.plist-topbtn.current:hover, .plist-btn-wrapper a.plist-topbtn:hover{color: #fff; background: rgba(255,255,255,0.8); color: #000;} .pin-box:hover{ background: rgba(255,255,255,0.8); border:1px solid #ccc; } .pin-box:hover > .qk-shop{display: block;} .pin-box > .qk-shop{display: none; position: absolute; left:0; top: 10%; z-index: 999; width: 100%;} .pin-box > .qk-shop a{ font-size: 13px; color: #fff; display: block; text-align: center; width: 120px; margin: 10px auto 20px; background: #f00; height: 30px; border-radius: 4px; line-height: 30px;} .pin-box > .qk-shop a.qk-addcart{ background-color:#c1272d; } .pin-box > .qk-shop a i{ padding: 0 3px; } .pin-box > .qk-shop a.qk-addcart:hover{ background-color:#ed1c24; } .pin-box > .qk-shop a.qk-detail{ background-color:#666; } .pin-box > .qk-shop a.qk-detail:hover{ background-color:#333; } .plist-pager-wrapper{width: 100%; height: 280px; background: url(../images/plist-pager-bg.jpg) repeat-x center; min-width: 300px;} .related.products h2{ font-size: 22px;} /*============================================*/ /* pager */ .pager{ width:100%; margin:20px auto 0; padding:50px 0 0px; text-align:center;} .pager > i{ font-size:18px; vertical-align:middle;} .pager > a, .plist-pager-wrapper .pager-btns a { font-size:15px; line-height:30px; margin:0 5px; padding:5px; color: #fff; text-decoration:none; -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear;} .pager > a.prev, .pager > a.next{ display: inline-block; width: 50px; height: 50px; border:solid 2px #fff; border-radius: 25px; position: relative;} .pager > a i{ font-size: 20px; line-height: 34px; } .pager > a.prev:hover, .pager > a.next:hover{ border-color: #fbb03b; background: #666; background: rgba(0,0,0,0.5); } .pager span{ font-style:italic; font-size:14px;} .pager input { width:50px; height: 32px; font-size: 13px; line-height: 13px; background:transparent; border:#fff 2px solid; border-radius:2px; padding:0 4px; margin: 0 5px; font-size:14px; display: inline; min-width: inherit; min-height: inherit; color: #fff;} .p-pager > a, .p-pager > span{ color:#fff;} .p-pager > a:hover, .p-pager > a.current{ color:#fbb03b;} .p-pager > a.current{ color:#fbb03b; border-bottom:2px solid #fbb03b;} .plist-pager-wrapper .pager-btns{ margin: 30px auto 0; max-width: 800px; width: 80%; } .plist-pager-wrapper .pager-btns h6{ color: #fff; font-weight: bold; font-size: 18px; } .plist-pager-wrapper .pager-btns a{padding: 6px 20px; height: 30px;} .plist-pager-wrapper .pager-btns a i{padding: 0 5px;} .plist-pager-wrapper .pager-btns a:hover{ color: #fbb03b; } .plist-pager-wrapper .pager-btns a.current:hover, .plist-pager-wrapper .pager-btns a.current{ border:1px solid #fbb03b; border-radius: 15px; color: #fbb03b;} /* end products-list */ /* products-page */ .pinfo-wrapper a{ color: #666; } .pinfo-wrapper a:hover{ color: #b95630; } .pinfo-wrapper p.pinfo-list{font-size: 14px; line-height: 26px; padding: 10px 0;} .pinfo-wrapper h6.promote{ margin-bottom: 10px; border:1px solid #b95630; display: table; padding: 5px 20px; border-radius: 20px; letter-spacing: 2px; color: #b95630; font-weight: bold; } .pinfo-wrapper span.promote-note{font-size: 14px; color: #b95630; line-height: 24px;} .pinfo-btns-wrapper{margin: 30px auto 0;} .pinfo-btns-wrapper a.shipment-info{color: #666;} .pinfo-btns-wrapper a.shipment-info i{font-size: 24px; line-height: 35px; vertical-align: middle; padding: 0 5px;} .woocommerce .product-share{text-align: right;} .woocommerce .product-share span{ color: #999; line-height: 40px; font-size: 14px; } .woocommerce .product-share a{ margin: 0 5px; color: #999; font-size: 20px; display:inline-block; border:1px solid #999; width: 40px; height: 40px; border-radius: 20px; line-height: 40px; text-align: center; } .woocommerce .product-share a.icon-pint:hover{ color: #bd081c; border-color: #bd081c; } .woocommerce .product-share a.icon-fb:hover{ color: #3b5999; border-color: #3b5999; } .woocommerce .product-share a.icon-twitter:hover{ color: #3cf; border-color: #3cf; } .woocommerce .product-share a.icon-mail:hover{ color: #d8953a; border-color: #d8953a; } /* end-products-page */ /* news-page */ .news-list-top{ position: relative; background: url(../images/news-list-bg.jpg) no-repeat center; background-size: cover; height: 300px; padding-top: 50px;} .news-list-top h1, .news-list-top h2{ text-align: center; color: #fff; text-shadow: 0px 0px 4px #000; text-transform: uppercase; font-size: 38px; letter-spacing: 1px; margin:0 auto; padding: 0; } .news-list-top h2{font-size: 22px;} #main-content-pin.news-content{margin-top: 0px; padding-top: 20px;} #main-content-pin.news-content > .index-news-wrapper{ max-width: 1400px;width: 90%; } #main-content-pin.news-content > .index-news-wrapper div.col-sm-3{margin:10px auto 40px; } /*============News================*/ .p-list-wrapper{ padding:40px 0; width:90%; max-width:1100px; margin:0 auto;} .news-wrapper{ margin-bottom:30px; max-width:1100px;} .news-wrapper .news-top{ padding:30px 0;} .news-wrapper .news-top .news-date{ text-align:left; padding-top:10px;} .news-wrapper .news-top .news-date p, .news-wrapper .news-top .news-date span{ color:#777; font-size:20px; line-height:20px; margin:0 10px 0 0; display: inline; padding:0;} .news-wrapper .news-top .news-date span{ font-size:14px; line-height:28px;} .news-wrapper .news-top .news-title h1{ margin:8px 0; color:#b95630; font-size:24px; letter-spacing: 0px; line-height:34px;} .news-wrapper p{ color:#333; font-size:15px; line-height:25px; margin:15px auto;} .news-wrapper a { display:block; text-align:center;} .news-wrapper a img{ width:100%; height:auto; margin:10px auto;} .news-close{ text-align:center; padding-bottom:70px;} .news-close a i{ font-size:90px; color:#dedede;} .news-close a:hover i{ font-size:110px; color:#999;} .news-content hr{ width: 80%; max-width: 1100px; margin:0 auto 20px; border-color: #ccc; } /* end news-page */ /* contact-page */ .contact-top{ position: relative; background: url(../images/news-list-bg.jpg) no-repeat center; background-size: cover; height: 400px; padding-top: 50px;} .contact-top { text-align: center; } .contact-top h1{ color: #fff; text-shadow: 0px 0px 4px #000; letter-spacing: 1px; font-size: 38px; } .contact-top span{ color: #fff; } .contact-top .contact-icons{margin: 30px auto 0; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; width: 90%; max-width: 360px; padding: 10px 0;} .contact-top a{ background: #fff; height: 38px; width: 38px; margin: 8px; border-radius: 50%; display: inline-block; color: #666; } .contact-top a:hover{color: #fff;} .contact-top a i{ margin: 1px; font-size: 21px; line-height: 38px; } .contact-info .icon-box9{ margin-bottom:20px; padding: 0 20px;} .contact-info .contact-left-box, .contact-info .contact-right-box, .contact-info .contact-center-box{padding: 0 20px;} .contact-title h3 { font-weight:bold; text-shadow:0 0 3px #000; text-transform:uppercase;} .contact-info h3{ font-size:24px;} .contact-info h4{ font-weight:normal; letter-spacing:1px; font-size: 20px; color:#666; line-height: 28px;} .contact-info h5{ font-size:18px; color:#333; margin:4px auto 4px;} .contact-info .icon-box9 p{color:#666; font-size:15px; border:none; min-height:inherit; line-height:22px; padding:3px 0; font-family:Arial, Helvetica, sans-serif;} .contact-info .icon-box9 i{ color:#666;} .contact-left-box a{ color: #666; } .contact-left-box a:hover{ color: #f9a827; } .contact-center-box div.contact-form{ padding: 0;} .contact-center-box div.contact-form form{ margin: 0 auto; text-align: center;} #validate{ width:50%; float:left; min-width: inherit;} div.validate-img{ width:48%; float:right; margin-left:2%; height: 45px;} div.validate-img img{ height:100%; width:auto;} /* end contact-page */ /* steps-page */ .steps-top, .container.step01-info{width: 90%; margin: 40px auto 30px; height: 72px; max-width: 1200px;} .steps-top .step01, .steps-top .step02, .steps-top .step03{width: 33.3333%; background: url(../images/steps-bg.jpg) no-repeat left center; text-align: center; position: relative; float: left;} .steps-top .step02{background: url(../images/steps-bg.jpg) no-repeat center center;} .steps-top .step03{background: url(../images/steps-bg.jpg) no-repeat center right;} .steps-top .step01 i, .steps-top .step02 i, .steps-top .step03 i{ position: absolute; right: -20px; top: 15px; font-size: 40px; color: #fff; z-index: 999; } .steps-top .step01 h1, .steps-top .step02 h1, .steps-top .step03 h1{font-size: 18px; color: #fff; margin: 0 auto; line-height: 72px; padding: 0; font-weight: bold; letter-spacing: 1px;} .steps-top .step01:before, .steps-top .step02:before, .steps-top .step03:before{background:rgba(255,255,255,0.4); position: absolute; width: 100%; height: 72px; content: ''; left: 0;} .steps-top .step01.current:before, .steps-top .step02.current:before, .steps-top .step03.current:before{ background: none; } /*==========shop cart list ============*/ .container.step01-info{ padding: 0; max-width: 1200px !important; margin: 50px auto 100px; height: auto; } .step01-info .step01-shoplist-wrapper{list-style: none; margin: 0 auto; padding: 0} .step01-info .step01-shoplist-wrapper li{margin: 20px auto; border-bottom: 1px solid #ccc; padding: 10px 0 15px;} .step01-info .step01-shoplist-wrapper li.list-title div.item-name{padding: 20px 0 0;} .step01-info .step01-shoplist-wrapper li > div:not(.clear) {float: left; margin: 0 1%; text-align: center;} .step01-info .step01-shoplist-wrapper li > div.item-name{ width: 40%; } .step01-info .step01-shoplist-wrapper li > div.item-name > a img{ width: 50%; height: auto; float: left; padding: 10px; } .step01-info .step01-shoplist-wrapper li > div.item-name > .item-name-text{padding: 20px 0 0;} .step01-info .step01-shoplist-wrapper li > div.item-name > .item-name-text h2 {font-size: 15px; margin:0px auto; padding: 0; line-height: 24px; display: inline; } .step01-info .step01-shoplist-wrapper li > div.item-name > .item-name-text h2 a{ color: #b95630; } .step01-info .step01-shoplist-wrapper li > div.item-name > .item-name-text h2 a:hover{ color: #d8953a; } .step01-info .step01-shoplist-wrapper li > div.item-name > .item-name-text span{display: block; margin-top: 20px; font-size: 14px; color: #999;} .step01-info .step01-shoplist-wrapper li > div.item-price, .step01-info .step01-shoplist-wrapper li > div.total-price{ width: 15%; padding: 20px 0 0;} .step01-info .step01-shoplist-wrapper li > div.item-quantity, .step01-info .step01-shoplist-wrapper li > div.delete-item{width: 10%; padding: 20px 0 0;} .step01-info .step01-shoplist-wrapper li > div.item-quantity select{width: 90%; min-width: inherit; max-width: 80px; margin: 0 auto;} .step01-info .step01-shoplist-wrapper li > div.delete-item a { font-size: 30px; color: #666; } .step01-info .step01-shoplist-wrapper li > div.delete-item a:hover{ color: #b95630; } .promotion-section{ padding: 10px 20px 20px; border-bottom: 1px solid #ccc; } .promotion-section .promo-left, .promotion-section .promo-right{float: left; width: 50%;} .promotion-section .promo-left h6{ display: block; font-size: 18px; margin-bottom: 10px; } .promotion-section .promo-left h6 a{ padding-left: 20px; display: inline-block; color: #666; font-size: 14px; } .promotion-section .promo-left h6 a:hover{color: #999;} .promotion-section .promo-left input#promotion-code{width: 50%; float: left; margin-right: 2%; height: 40px; border-radius: 2px; border:1px solid #ccc; color: #333; padding:0 5px;} .promotion-section .promo-left button.promotion-submit{ width: 48%; max-width: 150px; height: 40px; border-radius: 2px; background: #b95630; border:1px solid #ccc; color: #fff; line-height: 0px;} .promotion-section .promo-left button.promotion-submit:hover{background: #96452c; color: #fff; } .promotion-section .promo-left span{ font-size: 13px; color: #666; line-height: 21px; text-indent:-8px; display: block; } .promotion-section .promo-right{padding: 0 0 0 20px;} .promotion-section .promo-right span{ color: #b95630; font-size: 15px; line-height: 25px; display: block; text-indent:-8px; margin-bottom: 15px; } .promotion-section .promo-right span:before{content: '*';} .checkout-section{ padding: 30px 20px 10px; border-bottom: 1px solid #ccc; } .checkout-section .checkout-wrapper ul, .checkout-section .prmot-gift-wrapper ul{ list-style: none; padding: 0; margin: 0} .checkout-section .checkout-wrapper ul li{ height: 30px; } .checkout-section .checkout-wrapper ul li div{ width: 50%; float: left; } .checkout-section .checkout-wrapper ul li div{text-align: right; padding-right: 20px;} .checkout-section .checkout-wrapper ul li div select{ width: 100%; max-width: 150px; min-width: inherit; float: right; height: 30px; color: #333; } .checkout-section .checkout-wrapper ul li div span{ color: #333; font-size: 15px; line-height: 30px; } .checkout-section .checkout-wrapper ul li.total-title span{color: #b95630; font-weight: bold;} .checkout-section .prmot-gift-wrapper{background: url(../images/plist-bg.jpg) repeat; max-width: 900px; margin: 20px auto; width: 90%; float: none; padding: 20px 10px;} .checkout-section .prmot-gift-wrapper h2{font-size: 18px; text-align: center; font-weight: bold; line-height: 22px; padding: 0; margin: 0 auto 20px;} .checkout-section .prmot-gift-wrapper h2 span{color: #b95630; font-weight: normal; padding-left: 10px; font-size: 15px; line-height: 22px;} .checkout-section .prmot-gift-wrapper ul{margin: 0 auto;} .checkout-section .prmot-gift-wrapper ul li{ text-align: center; float: left; width: 18%; margin: 0 1%; } .checkout-section .prmot-gift-wrapper ul li input{display: block; margin: 0 auto 10px; width: 20px; height: 20px;} .checkout-section .prmot-gift-wrapper ul li a img{ width: 100%; height: auto; display: block; } .checkout-section .prmot-gift-wrapper ul li span{display: block; font-size: 14px; color: #333; margin: 15px auto 0;} .container .steps-btn-wrapper{width: 90%; max-width: 600px; margin: 0 auto; text-align: center;} .container .steps-btn-wrapper a{ display: inline-block; width: 40%; margin: 0 5%; height: 40px; background: #d8953a; font-size: 14px; line-height: 40px; border-radius: 2px; color: #fff; border:1px solid #d8953a; } .container .steps-btn-wrapper a i{padding: 0 8px; } .container .steps-btn-wrapper a.backto-shop{background: #fff; color: #333; border: 1px solid #333;} .container .steps-btn-wrapper a:hover{background: #b95630;} .container .steps-btn-wrapper a.backto-shop:hover{background: #efefef;} /*=============step02======================*/ .container.step02-info h2, .container.step03-info h2, .container.step03-info > div.step03-orderinfo h4{ font-size: 22px; color: #333; line-height: 34px; text-align: center; margin: 20px auto; } .container.step02-info h2 span{ font-weight: bold; color: #b95630; padding: 0 8px;} .container.step02-info div.col-md-6 {padding: 0 40px 50px;} .container.step02-info div > h4{ color: #b95630; font-size: 16px; } .container.step02-info div table select, .container.step02-info div table input{ border: 1px solid #999; height: 40px; width: 100%; max-width: inherit; min-width: inherit; border-radius: 4px; margin: 0; padding: 0 10px; } .container.step02-info table { vertical-align: middle; text-align: left; } .container.step02-info table tr td { vertical-align: middle; padding: 10px 20px; } .container.step02-info table tr td.align-btm{ vertical-align: bottom; padding:20px 20px 0; } .container.step02-info table tr td p{ margin: 0; letter-spacing: 1px; color: #666; font-size: 15px; } .container.step02-info table tr td span{ font-size: 14px; color: #666; } .container.step02-info table tr td img{ height: 100%; width: auto; } /*==============step03========================*/ .container.step03-info h2{ color: #b95630;} .container.step03-info h2 a{ text-decoration: underline; padding: 0 10px; color: #b95630; } .container.step03-info > div {margin: 0 auto 30px;} .container.step03-info > div > span{ border-left: 4px solid #b95630; padding: 0 6px;} .container.step03-info > div:not(.steps-btn-wrapper) > a{ color: #666; font-size: 15px;} .container.step03-info > div.send-info a{display: block; padding: 15px 0 0px 30px;} .container.step03-info > div.step03-orderinfo h4{ font-size: 16px; border-bottom: 1px solid #ccc; display: table; padding: 0 20px; } .container.step03-info .steps-btn-wrapper a{ display: inline-block; width: 60%; max-width: 260px;} /* end steps-page */ /* stert member pages */ /*========= regestration page ==============*/ .container .reg-wrapper {border: 1px solid #ccc; background: url(../images/plist-bg.jpg) repeat; border-radius: 4px; padding: 20px 0; margin: 0 auto 30px; } .container .reg-wrapper h3{font-size: 24px; text-align: left; padding: 0 0 10px 40px; font-weight: bold; color: #666;} .container .reg-wrapper h3 span{ display: inline-block; font-size: 15px; padding: 0 0 0 10px;} .container .reg-wrapper table td.form-title{ min-width: 80px; padding: 10px 10px 10px 0 } /*========= regestration page ==============*/ /*========== login page ==============*/ .container .reg-wrapper.login-wrapper{max-width: 600px;} .container .reg-wrapper.login-wrapper h3 {line-height: 32px; padding-left: 10px;} .container .reg-wrapper.login-wrapper h3 i{padding:0 10px; font-size: 32px; line-height: 32px; vertical-align: middle;} .container.step02-info .reg-wrapper.login-wrapper table{ width: 80%; margin: 0 auto; } .container.step02-info .reg-wrapper.login-wrapper table tr td{vertical-align: top;} .container.step02-info .reg-wrapper.login-wrapper span, .container.step02-info .reg-wrapper.login-wrapper a{ vertical-align: inherit; line-height: 14px; font-size: 14px; display: block; padding: 10px 5px; color: #d8953a;} .container.step02-info .reg-wrapper.login-wrapper a:hover{color: #b95630;} /*========== login page ==============*/ /*========== member page ==============*/ /*========== member page ==============*/ .index-img02 ul li a, #scroll-top a i, .business #header .right-side a, #header h6 a i, #header.sm-rgt-mn #menu-icon span, .index-bottom-info .index-bottom-text a, .swiper-button-prev, .swiper-button-next, .index-products-wrapper .index-p-tab, a.products-box p, a.products-box span.numbers, .plist-btn-wrapper a, .pin-box, .pin-box > .qk-shop a, .plist-btn-wrapper, .woocommerce .product-share a, .news-close a i, .index-news-wrapper a img, .index-news-wrapper a, .contact-left-box a, .contact-top a, .step01-info .step01-shoplist-wrapper li > div.delete-item a, .step01-info .step01-shoplist-wrapper li > div.item-name > .item-name-text h2 a, .container.step02-info .reg-wrapper.login-wrapper a, .container .steps-btn-wrapper a { -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -ms-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease;} /*----------------------ColorTips----------------------*/ .colorTip{ display:none; position:absolute; left:50%; top:-30px; padding:6px; background-color:#333; font-size:11px; font-style:normal; line-height:13px; text-decoration:none; text-align:center; white-space:nowrap; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px;} .pointyTip,.pointyTipShadow{ /* Setting a thick transparent border on a 0x0 div to create a triangle */ border:6px solid transparent; bottom:-12px; height:0; left:50%; margin-left:-6px; position:absolute; width:0;} .pointyTipShadow{ /* The shadow tip is 1px larger, so it acts as a border to the tip */ border-width:7px; bottom:-14px; margin-left:-7px;} .colorTipContainer{ position:relative; text-decoration:none !important;} /* 6 Available Color Themes */ .orange .pointyTip{ border-top-color:#333;} .orange .pointyTipShadow{ border-top-color:#ddd;} .orange .colorTip{ background-color:#333; border:1px solid #333; color:#FFF;} /* #Media Queries =============================================================================== =============================================================================== */ /* Smaller than standard 960 (devices and browsers) */ @media only screen and (max-width: 959px) { #header { padding:10px 0;} #search-form, .woo-cart-header { display:none;} .plan-wrap { width: 100%; } .sub-h h5 { padding: 0; } .blog-content .post-img { margin-bottom: 20px; } .blog-expression { width: 100%; } .img-team { margin-top:40px } .sidebar, .rgt-cntt, .sidebar.leftside { padding-right:0; background:none; padding-top:40px; margin-top:40px; border-top:5px solid #e5e5e5;} .rgt-cntt, .sidebar.leftside { padding-top:0px; margin-top:0px; border-top:0 none; margin-right:0;} .sidebar.leftside { margin-bottom:40px; border-bottom:5px solid #e5e5e5;} .img-box { width: 256px; height: 188px; } .last-project .img-box { background: #EA3C3C; } .last-project .img-box:nth-child(even) { background: #F66060; } .ab-box { height: 235px; } .author-detail { width: 218px; } .contact input { width: 330px; float: none; } .contact textarea { width: 486px; } .row.magic, .s-qoute-man { padding: 0; margin-bottom: 10px; } a.get { margin-bottom: 14px; } .pad-r10, .pad-r20, .pad-r30, .pad-r40 { padding-right: 5px; } .pad-l10, .pad-l20, .pad-l30, .pad-l40 { padding-left: 5px; } .dpromo2 { margin-top:35px; border-top:1px solid #e5e5e5; padding-top:30px; } .dpromo2 .brdr-l1, .dpromo2 .pad-l40 { border-left:none; padding:0;} .vertical-space, .vertical-space1 { height: 12px; } .vertical-space2 { height: 18px; } .vertical-space3 { height: 36px; } .vertical-space4 { height: 50px; } .vertical-space5 { height: 80px; } #footer .vertical-space4 { height:16px;} .icon-box1 { text-align:center;} .icon-box1 i { display:inline-block; float:none; margin:20px 0; } .icon-box2 h4 { font-size:19px;} .icon-box2 p { font-size:17px;} input[type="text"], input[type="password"], input[type="email"], textarea, select { min-width:90px; max-width:100%; } #footer{height: 320px;} .footer-navi p{ padding: 10px 0 0; } #footer .footer-in .col-md-8{ display: none; } #footer .footer-in .col-md-4{ padding: 0;} #footer .footer-in .col-md-4 .widget { margin: 0 auto; } li.mobile-showbtns{display: block !important;} .pager input{min-height: inherit; min-width: inherit;} .pager > a.page-num{display: none;} .pager > a.current.page-num{display: inline; color: #fff; border-color: #fff;} .pager > a.prev, .pager > a.next{ width: 40px; height: 40px; } .pager > a.prev i, .pager > a.next i{ line-height: 20px; } .woocommerce .product p.price{float: none;} .woocommerce .product form.cart .quantity{padding: 10px;} .woocommerce .product a.shipment-info{ padding: 10px 0;} #main-content-pin.news-content > .index-news-wrapper{ width: 76%; } #main-content-pin.news-content > .index-news-wrapper div.col-sm-3{width: 50%;} .container.step02-info div.col-md-6{max-width: 540px; margin: 0 auto;} }/*=======end 959px========*/ /* iPad in portrait & landscape */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) { .sparallax .slide-image{background-attachment: local !important; background-size: auto!important;} .blox {background-attachment: local!important; background-size: auto!important; } } /* Tablet Portrait size to standard 960 (devices and browsers) */ @media only screen and (min-width: 768px) and (max-width: 959px) { .blox {background-attachment: local!important; background-size: auto!important;} .pad { padding-top: 8%; } .blog-line img { float: none; } #wrap.boxed-wrap, #wrap.boxed-wrap #header { width: 828px; } #tline-content { width: 800px; } .tline-box { width: 335px; } #testimonials-slider li { width:750px;} .plan-wrap { width: auto; } .social-icons a { margin: 1px 4px 0 4px; } .row.magic { padding-left: 20px; margin-bottom: 10px; } .blog-date-sec { width: 42px; height: 42px; } .max-counter.m-counter { width:130px; } .max-counter.m-counter .max-count { width:90px; height:90px; font-size:23px; padding-top:33px;} .social-team i { font-size:16px; padding:5px;} h1.respo-tagline, h2.respo-tagline, h3.respo-tagline, h4.respo-tagline { line-height:1.33; letter-spacing:0; margin-bottom:14px; } h1.respo-tagline { font-size:21px;} h2.respo-tagline { font-size:18px;} h3.respo-tagline { font-size:16px; font-weight:400;} h4.respo-tagline { font-size:13px; font-weight:400;} h1.tagline-bold { font-size:31px; line-height:33px;} section.index-products-wrapper{ width: 748px; } } /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */ @media only screen and (min-width: 480px) and (max-width: 767px) { #wrap.boxed-wrap, #wrap.boxed-wrap #header { width: 460px; } .pin-box { width: 166px; width: 164px\9; } #tline-content { width: 460px; } .tline-box { width: 420px; } #testimonials-slider li { width:400px;} .page-subtitle { left: 0; padding: 10px 0 0 20px; bottom: 0; border-bottom: 1px solid #e8edee; margin-bottom: 20px; height: auto; width: auto; clear: both; background: #fdfdfd; border-radius: 0; } .pricing-table .plans-f-list.respo { display: inline; visibility: visible; } .jcarousel-item, .last-project .portfolio-item { max-width: 210px; height: 157px; float: left; } } /* All Mobile Sizes (devices and browser) */ @media only screen and (max-width: 767px) { .business .container{width: 90%;} #header.dark #nav {background: #000; border-color:#181818} #header.dark.sm-rgt-mn #menu-icon i {color:rgb(228, 228, 228)} #header.dark.sm-rgt-mn #menu-icon:hover i, #header.dark.sm-rgt-mn #menu-icon.active i {color:#27ae60;} .blox {background-attachment: local !important; background-size: cover !important;} .max-hero .slides-navigation {display:none} .max-hero .slides-content .slides li{font-size: 48px;} .max-hero .slides-content p{ font-size: 14px} .max-hero .slides-content .button {font-size: 12px} #headline { height:auto; border-bottom:1px solid #e3e3e3; padding:14px 0; background-color:#fafafa; } #headline h3 { border-top-color:#f6f6f6; padding-top:8px; font-size:24px; text-align:center;} #headline h3 small { display:block; margin-top:14px; margin-bottom:0; font-size:16px; letter-spacing:0; font-weight:400; } .top-bar { height:78px; padding:5px 0 6px; background:#fcfcfc url(../images/topsobg1.png) repeat-x center center;} .top-bar h6 { font-size:11px; letter-spacing:0; margin:0 10px 0 0;} .top-bar h6 i { font-size:12px; padding:3px; margin-right:3px;} .top-bar .socialfollow, .top-links, .top-links.rgtflot, .top-bar .socialfollow.lftflot { float:none; text-align:center; clear:both; min-height:22px;} .top-bar .socialfollow, .top-bar .socialfollow.lftflot { padding-top:8px;} .top-bar .socialfollow a, .top-bar .socialfollow.lftflot a, .top-links p, .top-links img { float:none; display:inline; padding-top:10px; background:none;} .top-links, .top-links.rgtflot { margin:0 0 8px 0; padding-top:4px; } .top-links.rgtflot { margin-top:12px; margin-bottom:6px;} #lang_sel_click { text-align:left; float:right;} #lang_sel_click img.iclflag { padding:0;} .container hr { margin-left:0; margin-right:0;} .blog-date-sec { width: auto; display:block; margin:-24px 0 10px; text-align:left; background:none; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; border: none; border-bottom: 1px solid #e5e5e5; } .blog-date-sec span, .blog-date-sec h3 { display: inline; margin: 0 1px; line-height: 25px; font-size:11px; font-weight:400; color:#444;} .blog-post { border-bottom-width:3px;} .blog-post h3, .blog-single-post h1 { font-size: 33px; margin-bottom:20px; line-height:31px; } .blog-post p { font-size:16px;} .nav-search { float: none; margin: 0; } .img-box { width: 420px; height: 308px; } .contact textarea { width: 398px; } .max-counter { display:block; padding-bottom:20px;} .logo { text-align: center; float:none; margin-bottom:15px; width:100%; } #nav { display: none; } .portfolio article { width: 100%; height: 300px; } .plan-wrap article { width: 50%; } .twitter h3 { padding: 0; } .project-view .img-item-big img { border:none; margin-bottom:-14px;} .proj-title-x h2 { font-size:28px;} #wrap .ptp-pricing-table .ptp-four-col {width: 100%;} .zoomex2 h6 { font-size:18px; font-weight:600;} input[type="text"].header-saerch, input[type="text"].header-saerch:focus { width: 261px; margin-top: 10px; } .pin-box { width: 380px; } .tline-box iframe, .tline-box img { height:auto;} .tline-row-l, .tline-row-r { display: none } .tline-box.rgtline { float: left; left: 0; } #tline-content:before { background:#eff3f4;} .tabs-left > .nav-tabs, .tabs-left > .nav-tabs > li > a, .nav-tabs > li, .nav-tabs > li.active, .tabs-left > .nav-tabs > li.active > a, .tabs-left > .nav-tabs .active > a:hover { width:100%; display:block; padding-left:0; padding-right:0; } .tabs-left > .nav-tabs > li > a { border-right:0 none;} .tabs-left > .tab-content { border: none;} .tab-content .columns, .tab-content .column { margin:0 10px; max-width:90%; } .container hr { margin-left:0; margin-right:0;} .blog-post { border-bottom-width:3px;} .author-detail { margin: 20px 0; } .pad-r10, .pad-r20, .pad-r30, .pad-r40, .pad-l10, .pad-l20, .pad-l30, .pad-l40 { padding: 0; } .one_half, .one_third, .two_third, .three_fourth, .one_fourth, .one_fifth, .two_fifth { width: 100%; float: none; margin-right: 0; } .twitter-box h3 { font-size:17px;} .date-sp-wrap { margin: 0; float: right; margin-bottom: 7px; } .blog-line .blog-date-sec { height: auto; } .v-shadow-r, .v-shadow-l { min-height: inherit; background: none; } .pad-r10, .pad-r20, .pad-r30, .pad-r40, .pad-l10, .pad-l20, .pad-l30, .pad-l40 { padding: 0; } .one_half, .one_third, .two_third, .three_fourth, .one_fourth, .one_fifth, .two_fifth { width: 100%; float: none; margin-right: 0; } .latest-f-blog, .qot-week { margin:0;} .callout { margin:10px 0px 20px; } .brdr-l1, .brdr-r1, .brdr-l2, .brdr-r2 { padding:0; border: none; } .brdr-l1 { margin-top:30px;} .brdr-r1 { margin-bottom:30px;} .resp-center { text-align:center !important;} .tab-content p, .tab-content li { font-size: 12px; } #side-nav { float:noe;} input[type="text"].header-saerch, input[type="text"].header-saerch:focus { float: none; display: inline; position: relative; z-index: 10000; } #wrap .ls-inner a.button { padding:4px 8px !important; font-size:11px; text-transform:uppercase; letter-spacing:0; font-weight:bold;} #wrap .ls-inner a.button.sm19 { margin-left:-12px;} #wrap .ls-inner h1 { font-size:17px;} #wrap .ls-inner h2 { font-size:16px;} #wrap .ls-inner h3 { font-size:15px;} #wrap .ls-inner h4 { font-size:14px;} #wrap .ls-inner h5 { font-size:13px;} #wrap .ls-inner h6, #wrap .ls-inner p { font-size:12px;} .footer-navi.floatright, .footer-navi { float:none; text-align:center;} .fix-btn-mrg .button.skyblue.large { margin-top:30px; margin-bottom:55px;} .transparent-header-w #header .img-logo-w2 { display:none;} .transparent-header-w #header .img-logo-w1 { display:inline;} #header .img-logo-w1 { display:inline;} .logo a:active { opacity:1;} .moonicons-box1 { width:100%;} .max-title, .max-title2,.max-title3, .max-title4, .max-title5 { margin-top:14px; margin-bottom:12px;} .index-img01{background-size: auto 190px ; width: 400px; background-position: -190px center;} #main-content-pin{margin: -80px auto 0;} .plist-btn-wrapper{width: 300px;} .plist-btn-wrapper a.plist-topbtn{margin: 10px 14px;} .pager{padding: 20px 0 0;} .plist-pager-wrapper .pager-btns{margin: 25px auto 0;} .plist-pager-wrapper .pager-btns hr{ margin: 10px 0 15px; } .plist-pager-wrapper .pager-btns a{display: block; width: 200px; margin: 0 auto 15px; padding: 0;} .swiper-container{padding-bottom: 0 !important;} .swiper-button-next, .swiper-button-prev{ display: none; } .index-bottom-text, .index-bottom-info{ border-left: none !important; } #footer{height: 360px;} #main-content-pin.news-content > .index-news-wrapper{ width: 80%; max-width: 420px; } #main-content-pin.news-content > .index-news-wrapper div.col-sm-3{width: 100%;} .contact-info .contact-center-box{margin: 50px auto;} .contact-info .icon-box9{ padding: 0; } .contact-form .btnSend{ width: 100%; } .contact-top .news-list-title{ width: 86%; margin: 0 auto; } .steps-top .step01 h1, .steps-top .step02 h1, .steps-top .step03 h1{ font-size: 14px; } .steps-top .step01 i, .steps-top .step02 i, .steps-top .step03 i{ font-size: 30px; right: -10px; top: 22px; } .steps-top{margin: 30px auto 10px;} .container.step01-info{margin: 10px auto 50px;} .step01-info .step01-shoplist-wrapper li.list-title{display: none;} .step01-info .step01-shoplist-wrapper li > div.item-name{width: 100%; text-align: left;} .step01-info .step01-shoplist-wrapper li > div.item-quantity, .step01-info .step01-shoplist-wrapper li > div.delete-item{ width: 16%; height: 60px; } .step01-info .step01-shoplist-wrapper li > div.item-quantity a:before{content: '數量'; font-size: 12px; display: block; color: #525559;} .step01-info .step01-shoplist-wrapper li > div.delete-item a:before{content: '刪除'; font-size: 12px; display: block;} .step01-info .step01-shoplist-wrapper li > div.item-price span:before{content: '單價'; font-size: 12px; display: block;} .step01-info .step01-shoplist-wrapper li > div.total-price span:before{content: '小計'; font-size: 12px; display: block;} .step01-info .step01-shoplist-wrapper li > div.item-price, .step01-info .step01-shoplist-wrapper li > div.total-price{ width: 30%; height: 60px; } .promotion-section .promo-left, .promotion-section .promo-right{width: 100%; float:none;} .promotion-section .promo-right{ margin-top: 20px; padding: 20px 0px; } .checkout-section .checkout-wrapper ul li div.checkout-title, .checkout-section .checkout-wrapper ul li div.checkout-content{width: 50%; text-align: left;} .checkout-section .checkout-wrapper ul li div select{float: none;} .promotion-section .promo-left{ max-width: 380px; margin: 0 auto; text-align: center; } .promotion-section .promo-right span{text-align: center;} .checkout-section .prmot-gift-wrapper h2 span{display: block;} .checkout-section .prmot-gift-wrapper ul li{ width: 31.3%; margin-bottom: 30px; } .checkout-section .prmot-gift-wrapper ul li input{ margin: 0 auto 5px; } .container.step02-info h2, .container.step03-info h2, .container.step03-info > div.step03-orderinfo h4{ font-size: 16px; line-height: 22px;} }/*===========end 767px=============*/ /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */ @media only screen and (max-width: 479px) { .max-hero .slides-content p{font-size: 13px} #wrap.boxed-wrap, #wrap.boxed-wrap #header { width: 340px; } .footbot { min-height: 38px; height: auto; } .nav-wrap2.mn4 #nav a { padding: 15px 4px; } #menu a { padding: 15px 4px; } .img-box { width: 300px; height: 220px; } .pad { padding-top: 2%; } .post-img { margin-bottom: 20px; } .plan-wrap article { width: 100%; } .author-detail { width: 254px; } .contact input { width: 288px; margin-right: 0; } .contact textarea { width: 278px; } .commentin { width: 92%; } .pin-box { width: 268px; } #tline-content { width: 300px; } .tline-box { width: 250px; } #testimonials-slider li { width:280px;} .quote-slider .testimonial-content h4 q { font-size:19px;} #wrap .ls-inner .ls-l { display:none;} #wrap .ls-inner .ls-bg { display:block;} .vertical-space, .vertical-space1 { height: 8px; } .vertical-space2 { height: 14px; } .vertical-space3 { height: 28px; } .vertical-space4 { height: 40px; } .vertical-space5 { height: 60px; } .index-img01{background-size: inherit; width: 270px; background-position: -215px center;} h1.index-news-title.index-products-title, h1.index-news-title{ width: 240px; background-size: 240px auto; } a.products-box > h6{ font-size: 12px; padding: 0 10px; } a.products-box p.p-title{ font-size: 13px; } .index-img02-wrapper{padding-top: 10px;} .index-img02 ul li{width: 100%; float: none; margin: 20px auto; height: 130px;} .index-img02 ul li.index-logo01 a, .index-img02 ul li.index-logo02 a, .index-img02 ul li.index-logo03 a{ background-size: auto 100% ; } .index-bottom-info ul li{width: 100%; float: none;} .plist-top-wrapper .plist-title{width: 300px; background-size: 100% auto;} .plist-btn-wrapper{width: 130px;} .plist-btn-wrapper a.plist-topbtn{margin: 15px auto; display: block;} #main-content-pin{margin: 0 auto;} #footer{height: 400px;} #footer .mail-signup{ border-top: 1px solid #ccc; margin: 20px auto 10px; } #footer .mail-signup h3{float: none; text-align: center; width: 90%; margin: 0 auto; padding: 0;} #footer .mail-signup form input{width: 70%;} #footer .mail-signup form button{width: 26%; float: none;} .steps-top, .container.step01-info{height: inherit;} .steps-top .step01, .steps-top .step02, .steps-top .step03{ width: 100%; } .steps-top .step01 h1, .steps-top .step02 h1, .steps-top .step03 h1{ line-height: 50px; } .steps-top .step01 i, .steps-top .step02 i, .steps-top .step03 i{ display: none; } .step01-info .step01-shoplist-wrapper li > div.item-name > .item-name-text span{margin-top: 10px;} .step01-info .step01-shoplist-wrapper li > div.item-price, .step01-info .step01-shoplist-wrapper li > div.total-price{width: 60%; margin-bottom: 10px;} .step01-info .step01-shoplist-wrapper li > div.item-quantity, .step01-info .step01-shoplist-wrapper li > div.delete-item{ width: 36%; } .promotion-section .promo-left input#promotion-code, .promotion-section .promo-left button.promotion-submit{width: 100%; float: none; max-width: inherit;} .checkout-section{ padding: 20px 10px; } .checkout-section .checkout-wrapper ul li div span{font-size: 13px;} .checkout-section .prmot-gift-wrapper ul li{ width: 48%; } .container .steps-btn-wrapper a{width: 46%; margin: 0 2%;} .container.step02-info div.col-md-6{padding: 20px 10px 20px;} .container.step02-info table tr td{padding: 10px 5px;} .container.step02-info table tr td.align-btm{ padding: 20px 5px 0; } .container.step02-info h2, .container.step03-info h2, .container.step03-info > div.step03-orderinfo h4{ font-size: 15px; line-height: 20px;} .container .reg-wrapper h3{ text-align: center; padding: 5px 0; } .container .reg-wrapper table td.form-title{text-align: right;} } /*===========end 479px=============*/ @media only screen and (min-width: 1200px) { #wrap.boxed-wrap, #wrap.boxed-wrap #header { width:1180px;} .white-space { height:110px;} h4.subtitle { margin:39px 0 21px 0; } .blog-date-sec h3 { font-size:36px;} #testimonials-slider li { width:1100px; } #footer .col-md-4, #footer .col-md-3 { padding-right:50px;} #headline h3 { padding-left:15px;} .breadcrumbs-w .container { padding-left:30px;} } @media only screen and (min-width: 769px) and (max-width: 959px) { #testimonials-slider li { width:860px;} .latest-works .portfolio-item { width:33.3%;} .pin-box { width: 352px; } } .size-selector{font-size: 0;} .size-selector .spacer{height: 0; margin-top: -12px;} .size-selector .entry{display: inline-block; border: 1px #d9d9d9 solid; text-align: center; font-size: 14px; color: #4c4c4c; font-weight: normal; padding:5px 10px; margin-right: 8px; position: relative; text-transform: uppercase; cursor: pointer; margin-bottom: 12px;} .size-selector .entry:after{position: absolute; left: -1px; top: -1px; right: -1px; bottom: -1px; border: 3px #cf712e solid; content: ""; opacity: 0;} .size-selector .entry.active:after{opacity: 1; border: 1px #cf712e solid;} .size-selector .entry:hover:after{opacity: 1;} .detail-info-entry{margin-bottom: 25px;} .detail-info-entry-title{font-size: 14px; color: #313131; line-height: 18px; font-weight: 600; margin-bottom: 7px;} .quantity-selector{font-size: 0;} .quantity-selector .button{margin-right: 20px;} .quantity-selector .entry{border: 1px #d1d1d1 solid; height: 37px; line-height: 35px; width: 37px; margin-left: -1px; display: inline-block; cursor: pointer; position: relative; font-size: 12px; color: #4c4c4c; text-align: center; user-select: none; -webkit-user-select: none; -moz-user-select: none;} .quantity-selector .entry.number-minus:before, .quantity-selector .entry.number-plus:before{content: ""; width: 11px; height: 1px; background: #4d4d4d; left: 50%; margin-left: -5.5px; top: 50%; margin-top: -0.5px; position: absolute;} .quantity-selector .entry.number-plus:after{content: ""; height: 11px; width: 1px; background: #4d4d4d; left: 50%; margin-left: -0.5px; top: 50%; margin-top: -5.5px; position: absolute;} .quantity-selector .entry.number{cursor: default; width: 44px; padding: 0 5px; width: auto; min-width: 44px;} .quantity-selector .entry.number-minus:hover, .quantity-selector .entry.number-plus:hover{background: #ca1515;} .quantity-selector .entry.number-minus{ margin-left: 0; } .pinfo-wrapper p{line-height:24px; margin-bottom:0;} .cart-summary-box{border: 2px #e6e6e6 solid; padding: 40px 35px; text-align: right;} .cart-summary-box .button{padding-left: 10px; padding-right: 10px; display: block; margin-bottom: 18px;} .cart-summary-box .sub-total{font-size: 15px; line-height: 20px; color: #878787; font-weight: 600; margin-bottom: 5px;} .cart-summary-box .grand-total{font-size: 22px; line-height: 30px; color: #343434; font-weight: 600; margin-bottom: 15px;} .cart-summary-box .simple-link{font-size: 13px; color: #333; line-height: 24px; font-weight: 400;} .cart-summary-box .simple-link:hover{color: #343434;} .form-go{position:absolute; top:0; left:0; opacity:0;display:none;} /* ---------------------