/* * --------------------------------------------------------------------- * DFVT CSS for responsive layout (tablets and mobile devices) * --------------------------------------------------------------------- */ @media only screen and (min-device-width : 320px) and (max-device-width : 1024px){ html {-webkit-text-size-adjust: none; } } /* * ------------------------------------------------------------------------------------------- * FOR ALL DEVICES * ------------------------------------------------------------------------------------------- */ /* Small and Laptop Screens */ @media only screen and (max-width: 1200px) { /* All widths */ #top-bar, #header, #custom_header, #wrapper, .page-title, .heading-wrapper h6 > .heading-line-right, #footer-widget-area, #copyright-container { width:90%; } .background-block-container {width: 100% !important;margin: 0px auto;} #layout-wrapper.boxed {width: 940px;} #layout-wrapper.boxed .background-block {margin: 0px -47px !important;padding-left: 45px !important;padding-right: 45px !important; width: 111.1% !important;} #topleft-widget-area, #topright-widget-area {width: 38%;} .owl-carousel { width:100%; float: left;} .port-short-info { width: 65%;} .port-style-2 .port-heading, .port-style-3 .port-heading {width:60%} ul.pf-one-column li .pf-description {float:none; width:100%; margin:0 auto 20px;} .pf-one-column .port-hover {float: none;margin: 0 auto;} ul.pf-two-columns li {width:430px;} .pf-two-columns .port-hover {height: 270px;} /* WooCommerce */ .yith-wcwl-add-to-wishlist {float:none;} .yith-wcwl-add-to-wishlist .show a {padding: 0;} #default-widget-area {width: 250px;} #wrapper #content_left {width: 780px;} .woocommerce .comment-form-rating p.stars span {width: 10.3% !important;} /* Under Construction Page */ .page-template-page-under-construction-php .mc4wp-form input[type="email"] {width:55%} .ds-element {width: 30%;margin: 40px 0px 0px;} .ds-element-minutes {border-left:3px solid #FFF;} /* Shortcodes Responsive */ .testi-content {width:56% !important;} .promo-box-2-first-half, .promo-box-2-sec-half {padding: 0px 10px !important;} .add-to-cart-sec-half {padding: 10px !important;} .show_work .port-hover img, .show_work .port-hover, .show_work .port-hover .overlay {min-height: 224px !important; max-height: 224px !important;min-width: 100%;} .show_work ul.pf-three-columns li {width: 30% !important;} ul.pf-three-columns li {width:275px !important;} .pf-three-columns .port-hover {height: 200px !important;} .pf-three-columns .port-attached {width: 325px !important;} .pf-three-columns .port-attached .port-hover {height: 237px !important;} .pf-two-columns .port-attached {width: 485px !important;} .pf-two-columns .port-attached .port-hover {height: 310px !important;} } @media only screen and (max-width: 979px) { /* General */ body { overflow-x: hidden; } input {max-width:90%;} textarea{max-width:90%;} embed, object, iframe {height:auto; max-width:100%;} img {height:auto;} /* All widths */ #top-bar, #header, #custom_header, #wrapper, .page-title, .heading-wrapper h6 > .heading-line-right, #footer-widget-area, #copyright-container, #layout-wrapper.full-width .background-block-container { width:100%; } input[type='submit'] {background-image: -moz-linear-gradient(top, rgba(255,255,255,0.23) 0%, rgba(255,255,255,0) 100%); background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.23)), color-stop(100%,rgba(255,255,255,0))); background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.23) 0%,rgba(255,255,255,0) 100%); background-image: -o-linear-gradient(top, rgba(255,255,255,0.23) 0%,rgba(255,255,255,0) 100%); background-image: -ms-linear-gradient(top, rgba(255,255,255,0.23) 0%,rgba(255,255,255,0) 100%); background-image: linear-gradient(to bottom, rgba(255,255,255,0.23) 0%,rgba(255,255,255,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3bffffff', endColorstr='#00ffffff',GradientType=0 );} /* Header */ #nav li.header-search-toggle {display:none !important;} /* Content */ #wrapper #content_full, #wrapper #content_right, #wrapper #content_left {width:100%;} .entry-content img { max-width: 100%; height: auto; } .alignnone, .alignleft { margin: 5px 15px 5px 0px; } .alignright { margin: 5px 0px 5px 15px;} .gallery .gallery-item{padding-right:20px;} .gallery dt{background-image: none;} ul.pf-one-column li img {margin:0 0 15px;} ul.pf-one-column li .pf-description {float:none; width:100%; margin:0 auto 20px;} .nivo-size-wrap{max-width:100%;} .su-gmap {height:300px;} .nivo-directionNav {display:none;} .gallery br { display:none; } #layout-wrapper .background-block {margin: 0px -20px;} .blog-post-medium-style #owl-post-gallery {width:50% !important;} /* Footer */ #copyright {float: none; text-align: center; width:100%; padding-bottom:0px;} #footer-menu{float:none; text-align: center; width:100%; margin-top:10px;} #footer-menu ul li{float:none; display:inline-block;} #footer-menu ul li:first-child a{padding-left:0px;} #menu-wrapper{width:100%;} #layout-wrapper.boxed #menu-wrapper {width:auto; margin:0 -20px;} #nav{margin:0; display:none; position:static;} #nav li, #nav > li.current-menu-item, #nav > li.current-menu-ancestor {padding:0 !important;} #nav > li {float: none;} #nav li a, #nav li ul li a, #nav li ul li:last-child > a, #nav > li.current-menu-item > a, #nav > li.current-menu-ancestor > a, #nav > li:hover > a{margin:0; padding:14px 20px; font-size:13px !important; color:#f1f1f1 !important; background-color: rgba(50, 50, 50, 0.953); border-bottom: 1px solid rgba(0, 0, 0, 0.2); border-top: 1px solid rgba(255, 255, 255, 0.1); line-height:1; text-transform:uppercase; opacity:1;} #nav li ul{margin:0; box-shadow:none; -moz-box-shadow:none; -webkit-box-shadow:none;} #nav li:last-child > a{padding-right:20px;} /* Sub-levels */ #nav li:hover > ul{visibility: hidden;} #nav li ul {border-top:none !important;} #nav li ul li a {width:auto;} #nav li ul li a{padding-left:40px !important;} #nav li ul li ul li a{padding-left:60px !important;} #nav li ul li ul li ul li a{padding-left:80px !important;} #nav li ul li ul li{display:none;} #nav li.hover ul li.hover ul li{display:block;} #nav > li.hover > ul , #nav li li.hover > ul {position: static !important; display:block !important; visibility: visible !important;} /* Sub-level indicator */ #nav li ul > li > .parent:after, #nav > li > .parent:after, #nav li li .parent:after {content: "\e3b1" !important; font-family:moon; float:right; font-size:11px; width: auto !important; height: auto !important; border:none !important; position:static !important; left:auto !important; bottom:auto !important; margin:0 !important;} #nav > li.hover > .parent:after, #nav li li.hover > .parent:after {content: "\e3b2" !important;} /* Current menu item style */ #nav > li.current-menu-item, #nav > li.current-menu-ancestor, #nav > li.current-menu-item:after, #nav > li.current-menu-ancestor:after{margin:0; border: none; } /* WooCommerce */ .widget-ajax-cart {display:none;} .woocommerce .comment-form-rating p.stars span {width: 11.3% !important;} /* Shortcodes Responsive */ .testi-content {width:43% !important;} #testi-slider .owl-item {height:170px !important;} .service-style-3 h2, .service-box h3, .su-service-title { font-size:18px;margin: 10px auto;} .service-box i {width: 90px !important;height: 90px !important;line-height: 90px !important;} .member-img, .member-img img {width: 100% !important;max-width: 100% !important;min-height: 100% !important;max-height: 100% !important;min-width: 100% !important;} .team-member h4 { margin:0px; } .team-member span { margin:0 0 10px; } .promo-box-2-first-half {float: none !important;border-right: 0 !important;padding: 0 !important;width: 100% !important;} .shop-button-desc {font-size: 10px !important;} .shop-button-text {font-size: 14px !important;} .add-to-cart-first-half {padding: 5px 10px !important;} .shop-button-price {font-size: 20px !important;} .show_posts {width:46% !important;} .show_posts.su-column-last {margin-right: 4%;} .show_work .port-hover img, .show_work .port-hover, .show_work .port-hover .overlay {min-height: 224px !important; max-height: 224px !important;min-width: 100%;} .show_work ul.pf-three-columns li {width: 45% !important;} .latest-works.show_work ul li {height: auto;} .pf-three-columns .port-attached {width: 355px !important;} .pf-three-columns .port-attached .port-hover {height: 257px !important;} } /* * ------------------------------------------------------------------------------------------- * TABLET PORTRAIT * ------------------------------------------------------------------------------------------- */ @media only screen and (min-width: 768px) and (max-width: 979px) { /* General */ .size-wrap {width: 700px !important;} .background-block-container {width: 100% !important;} #layout-wrapper.boxed {width:800px;} #top-bar{width: 700px;} #wrapper #content_right, #wrapper #content_left {width:100%;} #default-widget-area {width:300px;} #layout-wrapper.boxed .background-block {margin: 0px -50px !important;padding-left: 50px !important;padding-right: 50px !important;width: 114.3% !important;} /* Header */ #title-wrapper { -webkit-background-size: auto; -moz-background-size: auto; -o-background-size: auto; background-size: auto; } #header-wrapper #menu-wrapper .select-menu { display:block; border:1px solid #CFD5D8; width:350px; padding:10px; position:relative; bottom:28px; float:right; } /* Content */ ul.pf-two-columns li {width: 340px; min-height: 285px;} .pf-two-columns .port-hover {height: 215px;} ul.pf-three-columns li {width:340px; height:auto;} ul.pf-one-column li{min-height:none;} ul.pf-one-column li img {width: 100%; margin-bottom:0px; margin-right:20px;} ul.filterable-grid.pf-one-column li .mask {width:426px; height:213px;} ul.filterable-grid.pf-one-column li a.pf-zoom {margin-top:80px;} ul.filterable-grid.pf-two-columns li a.pf-zoom { margin-top:53px; } ul.filterable-grid.pf-three-columns li a.pf-zoom { margin-top:70px; } .latest-works ul li a.pf-zoom { margin-top:110px; } .latest-works ul li {width:340px; height:340px;} .commentlist .children, .commentlist .children .children { padding-left:20px;} #wp-calendar tbody td { padding:4px 6px;} #wp-calendar tfoot #next { padding-left:40px;} #wp-calendar tfoot #prev { padding-right:40px;} input.s{width: 156px;} #fancybox-wrap, #fancybox-frame, #fancybox-content {max-width:660px;} .blog-post-medium-style #owl-post-gallery {width:50% !important;} .next-prev-links {text-align: right;float: none;margin: 5px auto 10px 0.1em;} .port-style-2 .port-heading, .port-style-3 .port-heading {width:60% !important;} .port-style-2 .line-btm-port {margin: 5px auto 10px 0.1em;} .port-short-info {width: 50%;} .port-base {margin: 50px 0px 40px;} /* Footer */ #footer-wrapper #footer-widget-area .widget-area {width: 320px;} #footer-wrapper #footer-widget-area .widget-area {margin-right:60px;} #footer-wrapper #footer-widget-area .widget-area:last-child, #footer-wrapper #footer-widget-area .widget-area:nth-child(2) {margin-right:0px;} #footer-wrapper #footer-widget-area .widget-area:nth-child(3){clear:left;} /* Mobile menu style */ #menu-wrapper{margin:0; border:none; z-index:999; position:absolute; bottom:0px;} #layout-wrapper.boxed #menu-wrapper {width: 740px; margin:0 -20px;} #nav{position:absolute; top:1px; width:100%} /* Mobile drop-down menu style */ .mobile-select-menu {display:block; width:250px; padding:0 0 0 10px; position:absolute; right:0px; bottom:15px;} /* WooCommerce */ .woocommerce .related ul.products li.product,.woocommerce .related ul li.product,.woocommerce .upsells.products ul.products li.product,.woocommerce .upsells.products ul li.product,.woocommerce-page .related ul.products li.product,.woocommerce-page .related ul li.product,.woocommerce-page .upsells.products ul.products li.product,.woocommerce-page .upsells.products ul li.product, .woocommerce ul.products li.product,.woocommerce-page ul.products li.products { width: 32.1% !important; } #woo-slider ul.products li.product {width: auto !important;} .woocommerce input#s { width: 177px; } .woocommerce #searchsubmit {width:auto !important;margin-top:10px; cursor:pointer;} .woocommerce input , .woocommerce textarea {max-width:100%;} .woocommerce div.product div.images div.thumbnails a.last,.woocommerce #content div.product div.images div.thumbnails a.last,.woocommerce-page div.product div.images div.thumbnails a.last,.woocommerce-page #content div.product div.images div.thumbnails a.last { margin-bottom:5px; } .quantity .qty { min-width:auto; padding-bottom:3px; } .quantity input { padding: 4px 8px; min-width:auto; } .woocommerce a.added_to_cart, .woocommerce-page a.added_to_cart { top: 4%; } .woocommerce a.button, .woocommerce-page a.button { font-size:10px; } /* Under Construction Page */ .page-template-page-under-construction-php .mc4wp-form input[type="email"] {width:100%;margin: 0px auto 20px;float: none;} .page-template-page-under-construction-php li p input[type="submit"] {width:75%;margin: 0px auto 0;float: none;} .ds-element {width: 50%;margin: 40px 0px 0px;} .ds-element:first-child, .ds-element:last-child, .ds-element-minutes {border: 3px solid #FFF;} .pf-two-columns .port-attached {width: 355px !important;min-height: 305px;} .pf-two-columns .port-attached .port-hover {height: 226px !important;} } /* * ------------------------------------------------------------------------------------------- * MOBILE BOTH VIEWS * ------------------------------------------------------------------------------------------- */ @media only screen and (max-width: 767px) { /* General */ embed, object, iframe {height:auto;} #sidebar_right, #sidebar_right .widget-area {width:100%;} #sidebar_left, #sidebar_left .widget-area {width:100%; margin-top:40px;} #layout-wrapper.boxed .background-block {margin: 0px -20px !important;padding-left: 20px !important;padding-right: 20px !important;width: 109.2% !important;} /* Header */ #header-wrapper {border-bottom:none;} #header-wrapper, #header-wrapper #header-widget-area {position:relative;} #header {padding-top:35px; padding-bottom: 35px; height:auto !important;} #header #logo {display: block; position: static; text-align:center; width: 100%; margin:0px; bottom:0;} #header #logo h1 {position:static;} #header-wrapper #menu-wrapper .select-menu { display:block; border:1px solid #CFD5D8; width:350px; padding:10px; position:relative; top:20px; bottom:0px; margin:0 auto; float:none; } .page-title{text-align:center;} .page-title h1{padding-top:20px; padding-bottom:20px; float:none; display:inline-block;} .dfvt-breadcrumbs {float: none; padding: 5px 0px 21px 1px;} #layout-wrapper.full-width #header{position:static;} #title-wrapper { -webkit-background-size: auto; -moz-background-size: auto; -o-background-size: auto; background-size: auto; } /* Header Sidebar */ #header-wrapper #header-widget-area{margin-top:15px; text-align: center;} #header-wrapper #header-widget-area .widget-title{display:none;} #header-wrapper #header-widget-area ul.xoxo {float:none; margin-top:0px !important; display: inline-block;} #header-wrapper #header-widget-area ul li{padding:0px; margin:0 0 10px;} #header-widget-area .widget-container {margin:0px;} /* Content */ .next-prev-links {text-align: right;float: none;} .dfvt-breadcrumbs, .fp_carousel li .fp_title{display:none;} .column {float: none !important; margin: 0 0 40px 0 !important; width: 100% !important;} .su-tabs .su-tabs-panes{border:1px solid #e5e5e5 !important; padding-left:0px !important;} .su-tabs .pane-title {display:block !important;} .su-tabs .su-tabs-pane{border:none !important; padding:20px;} .fp_carousel li .fp_mask {display:none;} .error404_content .error404-icon {padding-top:0px; font-size: 180px;} .client-wrapper {text-align:center;} .pull-right, .pull-left {float:none; display:block; text-align:center;} #respond input, #respond textarea {width: 100%;} .su-callout .callout-content{float:none;} .su-callout .callout-button {float:none; margin-top:20px;} .latest-blog-entry-thumb .nivoSlider {width:100%;} .blog-layout-medium{float:none; width:auto; padding:0; margin-bottom: 18px;} #top-bar{padding:15px 0px;} #top-bar ul{text-align:center;} #top-bar #topright-widget-area ul{margin-top:5px; float:none;} #top-bar ul li {display: inline-block; float: none;} .blog-post-medium-style #owl-post-gallery {width:100% !important;} .next-prev-links {text-align: right;float: right;display: block;width: 100%;} .port-style-2 .line-btm-port {margin: 5px auto 10px 0.1em;} .port-short-info { width: 100%;} .port-style-2 .port-heading, .port-style-3 .port-heading {width:100%} .pf-one-column .port-hover {width: 100%;height: 220px;} /* Footer */ #footer-wrapper #footer-widget-area .widget-area {width: 100%; margin-right:0px; float:none;} /* Mobile menu style */ #menu-wrapper{height:45px; position:relative; top:0px; left:0; right:0; margin: 0; border:none; z-index:999;} /* Under Construction Page */ .page-template-page-under-construction-php .mc4wp-form input[type="email"] {width:100%;margin: 0px auto 20px;float: none;} .page-template-page-under-construction-php li p input[type="submit"] {width:65%;margin: 0px auto 0;float: none;} .ds-element {width: 50%;} .ds-element:first-child, .ds-element:last-child, .ds-element-minutes {border: 3px solid #FFF;} /* Shortcodes Responsive */ .counter-title:nth-child(n+1) {border-right: none !important;} .service-style-3 {width: 100% !important;} .member-img, .member-img img {width: 70% !important;max-width: 70% !important;min-height: 70% !important;max-height: 70% !important;min-width: 70% !important;} .team-social {top: 57% !important;} .testi-content {width: 56% !important;} #testi-slider .owl-item {height:200px !important;} .promo-box-2-first-half {float: left !important;border-right: 1px solid #DDD !important;padding: 0px 30px 0 0px !important;width: 30% !important;} .add-to-cart-sec-half {padding: 10px 20px !important;} .add-to-cart-first-half {padding: 10px 20px !important;} .shop-button-desc {font-size: 12px !important;} .shop-button-text {font-size: 18px !important;} .shop-button-price {font-size: 30px !important;} .promo-twitter-sec-half .short-desc { display: block !important; } ul.pf-three-columns li {width: 389px !important;} .pf-three-columns .port-hover {height: 283px !important;} .show_work .port-hover img, .show_work .port-hover, .show_work .port-hover .overlay {min-height: 304px !important; max-height: 304px !important;min-width: 100%;} .show_work ul.pf-three-columns li {width: 390px !important;} } /* * ------------------------------------------------------------------------------------------- * MOBILE LANDSCAPE * ------------------------------------------------------------------------------------------- */ @media only screen and (min-width: 480px) and (max-width: 767px) { /* General */ .size-wrap {width: 440px !important;} .background-block-container {width: 100% !important;} #layout-wrapper.boxed {width:480px; margin:0 auto;} #top-bar{width: 440px;} /* Header */ #header #logo img{max-width:420px; height:auto;} /* Content */ ul.pf-two-columns li {width: 440px;} .pf-two-columns .port-hover {height: 278px;} ul.pf-three-columns li, ul.pf-four-columns li{width: 440px; height:auto;} ul.filterable-grid.pf-one-column li .mask {width:440px; height:220px;} ul.filterable-grid.pf-one-column li a.pf-zoom {margin-top:82px;} ul.filterable-grid.pf-two-columns li a.pf-zoom { margin-top:83px; } ul.filterable-grid.pf-four-columns li a.pf-zoom, ul.filterable-grid.pf-three-columns li a.pf-zoom { margin-top:105px; } ul.filterable-grid.pf-four-columns li .pf-title{padding: 12px 15px; bottom:30px;} .pf-four-columns .port-hover {width: 275px;margin: 0 auto;} .port-base {width:100% !important;} .commentlist .children, .commentlist .children .children { padding-left:20px;} #fancybox-wrap, #fancybox-frame, #fancybox-content {max-width:400px;} .post-meta .large_blog_btn {display: block;float: none;text-align: right;margin:10px 10px 0 0;} .blog-post-medium-style #owl-post-gallery {width:100% !important;} .latest-works ul li:hover .pf-title, ul.filterable-grid li:hover .pf-title { -webkit-transform: translateX(-400px); -moz-transform: translateX(-400px); -o-transform: translateX(-400px); -ms-transform: translateX(-400px); transform: translateX(-400px); } .post_link_text_medium {width:220px;} /* WooCommerce */ .woocommerce .related ul.products li.product,.woocommerce .related ul li.product,.woocommerce .upsells.products ul.products li.product,.woocommerce .upsells.products ul li.product,.woocommerce-page .related ul.products li.product,.woocommerce-page .related ul li.product,.woocommerce-page .upsells.products ul.products li.product,.woocommerce-page .upsells.products ul li.product, .woocommerce ul.products li.product,.woocommerce-page ul.products li.products { width: 60% !important; margin:0 0 20px; } #woo-slider ul.products li.product {width: auto !important;} .woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit,.woocommerce #content input.button,.woocommerce-page a.button,.woocommerce-page button.button,.woocommerce-page input.button,.woocommerce-page #respond input#submit,.woocommerce-page #content input.button, .woocommerce a.button.alt,.woocommerce button.button.alt,.woocommerce input.button.alt,.woocommerce #respond input#submit.alt,.woocommerce #content input.button.alt,.woocommerce-page a.button.alt,.woocommerce-page button.button.alt,.woocommerce-page input.button.alt,.woocommerce-page #respond input#submit.alt,.woocommerce-page #content input.button.alt { text-decoration: none; } .woocommerce ul.products li.last, .woocommerce-page ul.products li.last { margin-right: 1.1% !important; } .woocommerce .products .product:nth-child(2n) { margin-right: 0px !important; } .woocommerce ul.products li.first, .woocommerce-page ul.products li.first { clear: none !important; } .woocommerce a.added_to_cart, .woocommerce-page a.added_to_cart { top: 4%; } .woocommerce .shop-template .images { width:100% !important; } /* Force table to not be like tables anymore */ .woocommerce table, .woocommerce thead, .woocommerce tbody, .woocommerce th, .woocommerce td, .woocommerce tr { display: block; text-align:center; } .product-remove div, .product-remove a {width:21px; margin:0 auto;} /* Hide table headers (but not display: none;, for accessibility) */ .woocommerce thead tr { position: absolute; top: -9999px; left: -9999px; } .woocommerce tr { border-style: solid; border-color:#eaeaea; border-width:0 0 0 0; margin:0 0 20px; } .woocommerce table.shop_table, .woocommerce-page table.shop_table {-moz-box-shadow:1px 1px 0px rgba(0,0,0,0);box-shadow: 1px 1px 0px rgba(0,0,0,0);-webkit-box-shadow: 1px 1px 0px rgba(0,0,0,0);} .woocommerce table.shop_table td, .woocommerce-page table.shop_table td {border-style:solid; border-color:#eaeaea;border-width:1px 1px 0px 1px;} .woocommerce table.shop_table td:last-child, .woocommerce-page table.shop_table td:last-child, .woocommerce .cart-collaterals .cart_totals table tr:first-child th, .woocommerce-page .cart-collaterals .cart_totals table tr:first-child th {border-style:solid; border-color:#eaeaea;border-width:1px 1px 1px 1px;} .woocommerce .cart-collaterals .cart_totals table tr, .woocommerce-page .cart-collaterals .cart_totals table tr {border-style:solid; border-color:#eaeaea;border-width:0px 1px 0px 0px;} .woocommerce .cart-collaterals .cart_totals table {border:none;} .woocommerce table.shop_table tfoot, .woocommerce-page table.shop_table tfoot { width:100%; display:inline-block;border:none;} .woocommerce table.shop_table tfoot th, .woocommerce-page table.shop_table tfoot th {border-style:solid; border-color:#eaeaea;border-width:1px 1px 0px 1px;} .woocommerce td { /* Behave like a "row" */ border: none; border-bottom: 1px solid #eaeaea; position: relative; padding-left: 50%; } .shop_table tr td {text-align:center;} .woocommerce td:before { /* Now like a table header */ position: absolute; /* Top/left values mimic padding */ top: 6px; left: 6px; width: 45%; padding-right: 10px; white-space: nowrap; } .woocommerce table.shop_table td.product-quantity, .woocommerce-page table.shop_table td.product-quantity {height: 35px;} .woocommerce .shop-template .entry-summary { width:100% !important; } .quantity .qty { padding-bottom:3px; min-width:auto; } .woocommerce input, .woocommerce textarea { max-width: 100%; } .quantity input[type=number] { min-width:12px; width:41px; } .quantity input { padding: 4px 8px; min-width:auto; } .shop_table .quantity .plus, .quantity .minus{ padding: 4px 7px; } .woocommerce .checkout .col2-set .col-1 { width:100%; } .woocommerce .checkout .col2-set .col-2 { width:100%; margin-top:20px; } .woocommerce .cart_totals, .woocommerce .shipping_calculator, .woocommerce .shipping_calculator input { width:100% !important; max-width:100%; } .woocommerce table.shop_table .product-thumbnail { display:none; } .woocommerce table.shop_table .checkout-button { margin:25px auto 15px; width: auto; max-width:100%; } .woocommerce .comment-form-rating p.stars span {width: 18.3% !important;} .woocommerce div.product .woocommerce-tabs ul.tabs li, .woocommerce-page div.product .woocommerce-tabs ul.tabs li {margin: 0px 10px 10px 0px;} .pf-two-columns .port-attached {width: 385px !important;} .pf-two-columns .port-attached .port-hover {height: 245px !important;} .pf-four-columns .port-attached .port-hover {height: 159px !important;} } /* * ------------------------------------------------------------------------------------------- * MOBILE PORTRAIT * ------------------------------------------------------------------------------------------- */ @media only screen and (max-width: 479px) { /* General */ .size-wrap {width:280px !important;} .background-block-container {width: 100% !important;} #layout-wrapper.boxed {width: 320px; margin:0 auto;} #top-bar{width: 280px;} #layout-wrapper.boxed .background-block {margin: 0px -20px !important;padding-left: 20px !important;padding-right: 20px !important;width: 114.3% !important;} /* Header */ #header #logo img{max-width:260px; height:auto;} #header-wrapper #menu-wrapper .select-menu { display:block; border:1px solid #CFD5D8; width:300px; padding:10px; position:relative; top:20px; bottom:0px; margin:0 auto; float:none; } /* Content */ ul.pf-two-columns li {width: 280px; min-height: 250px;} .pf-two-columns .port-hover {height: 177px;} ul.pf-three-columns li, ul.pf-four-columns li {width:280px; height:auto;} ul.filterable-grid.pf-one-column li .mask {width:280px; height:140px;} ul.filterable-grid.pf-one-column li a.pf-zoom {margin-top:42px;} ul.filterable-grid.pf-two-columns li a.pf-zoom { margin-top:33px; } ul.filterable-grid.pf-four-columns li a.pf-zoom, ul.filterable-grid.pf-three-columns li a.pf-zoom, .latest-works ul li a.pf-zoom{ margin-top:47px; } .pf-four-columns .port-hover {width: 275px;margin: 0 auto;} .commentlist .children { padding-left:20px;} .commentlist .children .children { padding-left:10px;} .error404 .searchform .s {width:85%;} .su-button {height:auto;} #fancybox-wrap, #fancybox-frame, #fancybox-content {max-width:240px;} th{padding:5px 0px} td{padding:5px 0px;} .post-meta span {padding: 0px; line-height:2.0em;} .post-meta .post-comments{float:none;} .post-tags {padding: 0px; line-height:2.0em;} .post_link_text_medium {width:240px; margin:0 0 20px;} .pf-one-column .port-hover {width: 100%;height: 140px;} .show_work .port-hover img, .show_work .port-hover, .show_work .port-hover .overlay {min-height: 200px !important; max-height: 200px !important;min-width: 100%;} .show_work ul.pf-three-columns li {width: 280px !important;} .post-meta .large_blog_btn {display: block;float: none;text-align: right;} .big-testimonial-wrapper .big-testimonial-content {clear:both; margin-left:0px;} .big-testimonial-wrapper .big-testimonial-image {margin-left: 77px; margin-bottom:10px;} .big-testimonial-wrapper .big-testimonial-image:before {border-style: solid; border-width: 20px 20px 0 20px; border-color: #e7e7e7 transparent transparent transparent; border-color:#e7e7e7 rgba(255,255,255,0) rgba(255,255,255,0) rgba(255,255,255,0); top:auto; right:auto; bottom:-21px; left:50%; margin-left:-20px;} .port-base {width:100% !important;} .port-details {width: 70% !important;} /* Footer */ #copyright {font-size:9px;} #footer-menu{font-size:9px;} /* WooCommerce */ .woocommerce form .form-row, .woocommerce-page form .form-row { min-width: 280px; padding: 0px; } .woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit,.woocommerce #content input.button,.woocommerce-page a.button,.woocommerce-page button.button,.woocommerce-page input.button,.woocommerce-page #respond input#submit,.woocommerce-page #content input.button, .woocommerce a.button.alt,.woocommerce button.button.alt,.woocommerce input.button.alt,.woocommerce #respond input#submit.alt,.woocommerce #content input.button.alt,.woocommerce-page a.button.alt,.woocommerce-page button.button.alt,.woocommerce-page input.button.alt,.woocommerce-page #respond input#submit.alt,.woocommerce-page #content input.button.alt { text-decoration: none; } .woocommerce input, .woocommerce textarea { max-width: 100%; } .woocommerce .lost_reset_password #user_login, .woocommerce .lost_reset_password .button { width:atuo; margin-top:5px; } .woocommerce .login #username,.woocommerce .checkout_coupon #coupon_code { max-width: 85%; float:none; } .woocommerce .login #password{ max-width: 85%; } .woocommerce .login .form-row-last label{ margin-left:41px; } .woocommerce .login .button { width:48%; margin:10px 10px 10px 0px; } .woocommerce .checkout_coupon .button { float:right; width: auto; margin-top:5px; } .woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1, .woocommerce .col2-set .col-2, .woocommerce-page .col2-set .col-2 { width: 100%; float: none; } .shop-template .product-inner { min-height: 120px; } .woocommerce .related ul.products li.product,.woocommerce .related ul li.product,.woocommerce .upsells.products ul.products li.product,.woocommerce .upsells.products ul li.product,.woocommerce-page .related ul.products li.product,.woocommerce-page .related ul li.product,.woocommerce-page .upsells.products ul.products li.product,.woocommerce-page .upsells.products ul li.product, .woocommerce ul.products li.product,.woocommerce-page ul.products li.products { width: 100% !important; } #woo-slider ul.products li.product {width: auto !important;} .woo-heading {margin: 0 0 60px !important;} .woocommerce ul.products li.last, .woocommerce-page ul.products li.last { margin-right: 1.1% !important; } .woocommerce ul.products li.first, .woocommerce-page ul.products li.first { clear: none !important; } .woocommerce a.added_to_cart, .woocommerce-page a.added_to_cart { top: 4%; } .woocommerce a.add_to_cart_button.button, .woocommerce a.product_type_variable.button, .woocommerce a.product_type_grouped.button { height:auto; padding-top: 5px; padding-bottom:5px; } .woocommerce .product_meta, .woocommerce .woocommerce-result-count, .woocommerce-page .woocommerce-result-count { float:right; } .woocommerce .shop-template .images { width:100% !important; } .woocommerce .product-col-3 ul.products li.product, .woocommerce-page .product-col-3 ul.products li.product {margin:0 1.1% 4% 0;} .woocommerce .shop-template .entry-summary { width:100% !important; } .quantity .qty { min-width:auto; padding-bottom:3px; } .quantity input[type=number] { min-width:12px; width:41px; } .quantity input { padding: 4px 8px; min-width:auto; } .woocommerce .cart_totals, .woocommerce .shipping_calculator, .woocommerce .shipping_calculator input { width:100% !important; max-width:100%;} .woocommerce .checkout .col2-set .col-2 { margin-top:20px; } .woocommerce table td { padding:5px !important; } .woocommerce th.product-name { -webkit-border-top-left-radius: 6px; -moz-border-radius-topleft: 6px; border-radius: 6px 0 0 0; } .woocommerce table.shop_table .product-thumbnail, .woocommerce table.shop_table .product-remove { display:none; } .woocommerce #coupon_code{ width:100% !important; max-width:100%; margin-top:10px; } .woocommerce table.shop_table .button { width:auto; margin:10px 0; } .woocommerce #payment #place_order,.woocommerce-page #payment #place_order { float:none; } .woocommerce table.shop_table .checkout-button { margin-top:25px; } .woocommerce .comment-form-rating p.stars span {width: 28.3% !important;} .woocommerce div.product .woocommerce-tabs ul.tabs li, .woocommerce-page div.product .woocommerce-tabs ul.tabs li {margin: 0px 10px 10px 0px;} /* Force table to not be like tables anymore */ .woocommerce table, .woocommerce thead, .woocommerce tbody, .woocommerce th, .woocommerce td, .woocommerce tr { display: block; text-align:center; } .product-remove div, .product-remove a {width:21px; margin:0 auto;} /* Hide table headers (but not display: none;, for accessibility) */ .woocommerce thead tr { position: absolute; top: -9999px; left: -9999px; } .woocommerce tr { border-style: solid; border-color:#eaeaea; border-width:0 0 0 0; margin:0 0 20px; } .woocommerce table.shop_table, .woocommerce-page table.shop_table {-moz-box-shadow:1px 1px 0px rgba(0,0,0,0);box-shadow: 1px 1px 0px rgba(0,0,0,0);-webkit-box-shadow: 1px 1px 0px rgba(0,0,0,0);} .woocommerce table.shop_table td, .woocommerce-page table.shop_table td {border-style:solid; border-color:#eaeaea;border-width:1px 1px 0px 1px;} .woocommerce table.shop_table td:last-child, .woocommerce-page table.shop_table td:last-child, .woocommerce .cart-collaterals .cart_totals table tr:first-child th, .woocommerce-page .cart-collaterals .cart_totals table tr:first-child th {border-style:solid; border-color:#eaeaea;border-width:1px 1px 1px 1px;} .woocommerce .cart-collaterals .cart_totals table tr, .woocommerce-page .cart-collaterals .cart_totals table tr {border-style:solid; border-color:#eaeaea;border-width:0px 1px 0px 0px;} .woocommerce .cart-collaterals .cart_totals table {border:none;} .woocommerce table.shop_table tfoot, .woocommerce-page table.shop_table tfoot { width:100%; display:inline-block;border:none;} .woocommerce table.shop_table tfoot th, .woocommerce-page table.shop_table tfoot th {border-style:solid; border-color:#eaeaea;border-width:1px 1px 0px 1px;} .woocommerce td { /* Behave like a "row" */ border: none; border-bottom: 1px solid #eaeaea; position: relative; padding-left: 50%; } .shop_table tr td {text-align:center;} .woocommerce td:before { /* Now like a table header */ position: absolute; /* Top/left values mimic padding */ top: 6px; left: 6px; width: 45%; padding-right: 10px; white-space: nowrap; } .woocommerce table.shop_table td.product-quantity, .woocommerce-page table.shop_table td.product-quantity {height: 35px;} /* Mobile drop-down menu style */ .mobile-select-menu {width:240px; margin: 30px 20px 0px; display:block;} /* Shortcodes Responsive */ .su-tabs-vertical .su-tabs-nav span i {display: block !important;margin: 0 0 5px !important;font-size: 18px !important; text-align:center;} .testimonial-2 .client-img {display: block !important;position: inherit !important;margin: 0 auto !important;width: 100% !important;text-align: center;} .testi-content {width: 90% !important;margin: 0 auto 10px !important;} #testi-slider .owl-item {height: auto !important;} .promo-box-2-first-half {float: none !important;border-right: 0 !important;border-bottom: 1px solid #eee !important;padding: 0 0 20px !important;width: 100% !important;margin:0 0 10px;} .shop-button-desc {font-size: 10px !important;} .shop-button-text {font-size: 14px !important;} .add-to-cart-first-half {padding: 5px 10px !important;} .shop-button-price {font-size: 20px !important;} ul.pf-three-columns li, .pf-three-columns .port-attached {width:275px !important;} .pf-three-columns .port-hover, .pf-three-columns .port-attached .port-hover {height: 200px !important;} ul.pf-three-columns li {min-height: 260px !important;} .pf-two-columns .port-attached {width: 275px !important;} .pf-two-columns .port-attached .port-hover {height: 175px !important;} .pf-four-columns .port-attached .port-hover {height: 159px !important;} } /* Smartphones (portrait and landscape) ----------- */ @media only screen and (min-device-width : 320px) and (max-device-width : 480px) { /* Styles */ #top-bar, #header, #custom_header, #wrapper, .page-title, .heading-wrapper h6 > .heading-line-right, #footer-widget-area, #copyright-container, #layout-wrapper.full-width .background-block-container { width:100%; } }