/* Common Styles */ *, *:after, *:before { -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-backface-visibility:hidden; /* Chrome and Safari */ -moz-backface-visibility:hidden; /* Firefox */ -ms-backface-visibility:hidden; /* Internet Explorer */ -o-backface-visibility:hidden; /* opera */ backface-visibility:hidden; } .clearfix:before, .clearfix:after { display: table; content: ''; } .clearfix:after { clear: both; } .wpb_portfolio_area a, .wpb_portfolio_area a:hover, .wpb_portfolio_area a:active, .wpb_portfolio_area a:focus, .wpb_fp_btn, .wpb_fp_btn:hover, .wpb_fp_btn:active, .wpb_fp_btn:focus{ text-decoration: none; outline: 0; } .wpb-fp-filter li, .wpb_fp_btn, #wpb-fp-sort-portfolio { -webkit-transition: 0.3s all ease-out; -moz-transition: 0.3s all ease-out; -o-transition: 0.3s all ease-out; transition: 0.3s all ease-out; } .wpb_fp_btn { padding: 10px 16px; border-radius: 3px; margin-top: 7px; display: inline-block; color: #fff; text-transform: uppercase; margin-bottom: 25px; } .wpb_portfolio_post{ margin-bottom: 10px; } /* Portfolio content icons */ .wpb_fp_icons > a { width: 42px; display: inline-block; height: 42px; background: #fff; text-align: center; } .wpb_fp_icons > a > i { display: block; line-height: 42px; font-size: 18px; color: #ffffff; } /* Popup style */ .mfp-wrap button:hover, .mfp-wrap button:active, .mfp-wrap button:focus{ background: transparent; box-shadow: none; } /* text-based popup styling */ .white-popup { position: relative; background: #FFF; padding: 0; width:auto; max-width: 80%; margin: 0 auto; } .wpb_fp_quick_view img{ max-width: 100%; } .wpb_fp_quick_view_content { padding-top: 30px; padding-right: 30px; } .wpb_fp_quick_view_content h2 { font-size: 28px; font-weight: lighter; margin-bottom: 20px; margin-top: 0; } .wpb_fp_quick_view_content p { margin-bottom: 12px; line-height: 18px; font-size: 13px; } .wpb_fp_quick_view_content .wpb_fp_btn{ border: 1px solid; } .wpb_fp_quick_view_content .wpb_fp_btn:hover{ background: transparent; } @media (min-width: 768px){ .wpb_fp_quick_view_content{ padding-left: 20px; padding-right: 20px; } } /* ====== Zoom effect ====== */ .mfp-zoom-in .mfp-with-anim { opacity: 0; filter: alpha(opacity=0); transition: all 0.2s ease-in-out; -webkit-transform: scale(0.8); transform: scale(0.8); } .mfp-zoom-in.mfp-bg { opacity: 0; filter: alpha(opacity=0); transition: all 0.3s ease-out; } .mfp-zoom-in.mfp-ready .mfp-with-anim { opacity: 1; filter: alpha(opacity=100); -webkit-transform: scale(1); transform: scale(1); } .mfp-zoom-in.mfp-ready.mfp-bg { opacity: 0.8; filter: alpha(opacity=80); } .mfp-zoom-in.mfp-removing .mfp-with-anim { -webkit-transform: scale(0.8); transform: scale(0.8); opacity: 0; filter: alpha(opacity=0); } .mfp-zoom-in.mfp-removing.mfp-bg { opacity: 0; filter: alpha(opacity=0); } /* ====== Newspaper effect ====== */ .mfp-newspaper .mfp-with-anim { opacity: 0; filter: alpha(opacity=0); transition: all 0.5s; -webkit-transform: scale(0) rotate(500deg); transform: scale(0) rotate(500deg); } .mfp-newspaper.mfp-bg { opacity: 0; filter: alpha(opacity=0); transition: all 0.5s; } .mfp-newspaper.mfp-ready .mfp-with-anim { opacity: 1; filter: alpha(opacity=100); -webkit-transform: scale(1) rotate(0deg); transform: scale(1) rotate(0deg); } .mfp-newspaper.mfp-ready.mfp-bg { opacity: 0.8; filter: alpha(opacity=80); } .mfp-newspaper.mfp-removing .mfp-with-anim { -webkit-transform: scale(0) rotate(500deg); transform: scale(0) rotate(500deg); opacity: 0; filter: alpha(opacity=0); } .mfp-newspaper.mfp-removing.mfp-bg { opacity: 0; filter: alpha(opacity=0); } /* ====== Move-horizontal effect ====== */ .mfp-move-horizontal .mfp-with-anim { opacity: 0; filter: alpha(opacity=0); transition: all 0.3s; -webkit-transform: translateX(-50px); transform: translateX(-50px); } .mfp-move-horizontal.mfp-bg { opacity: 0; filter: alpha(opacity=0); transition: all 0.3s; } .mfp-move-horizontal.mfp-ready .mfp-with-anim { opacity: 1; filter: alpha(opacity=100); -webkit-transform: translateX(0); transform: translateX(0); } .mfp-move-horizontal.mfp-ready.mfp-bg { opacity: 0.8; filter: alpha(opacity=80); } .mfp-move-horizontal.mfp-removing .mfp-with-anim { -webkit-transform: translateX(50px); transform: translateX(50px); opacity: 0; filter: alpha(opacity=0); } .mfp-move-horizontal.mfp-removing.mfp-bg { opacity: 0; filter: alpha(opacity=0); } /* ====== Move-from-top effect ====== */ .mfp-move-from-top .mfp-content { vertical-align: top; } .mfp-move-from-top .mfp-with-anim { opacity: 0; filter: alpha(opacity=0); transition: all 0.2s; -webkit-transform: translateY(-100px); transform: translateY(-100px); } .mfp-move-from-top.mfp-bg { opacity: 0; filter: alpha(opacity=0); transition: all 0.2s; } .mfp-move-from-top.mfp-ready .mfp-with-anim { opacity: 1; filter: alpha(opacity=100); -webkit-transform: translateY(0); transform: translateY(0); } .mfp-move-from-top.mfp-ready.mfp-bg { opacity: 0.8; filter: alpha(opacity=80); } .mfp-move-from-top.mfp-removing .mfp-with-anim { -webkit-transform: translateY(-50px); transform: translateY(-50px); opacity: 0; filter: alpha(opacity=0); } .mfp-move-from-top.mfp-removing.mfp-bg { opacity: 0; filter: alpha(opacity=0); } /* ====== 3d unfold ====== */ .mfp-3d-unfold .mfp-content { -webkit-perspective: 2000px; perspective: 2000px; } .mfp-3d-unfold .mfp-with-anim { opacity: 0; filter: alpha(opacity=0); transition: all 0.3s ease-in-out; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateY(-60deg); transform: rotateY(-60deg); } .mfp-3d-unfold.mfp-bg { opacity: 0; filter: alpha(opacity=0); transition: all 0.5s; } .mfp-3d-unfold.mfp-ready .mfp-with-anim { opacity: 1; filter: alpha(opacity=100); -webkit-transform: rotateY(0deg); transform: rotateY(0deg); } .mfp-3d-unfold.mfp-ready.mfp-bg { opacity: 0.8; filter: alpha(opacity=80); } .mfp-3d-unfold.mfp-removing .mfp-with-anim { -webkit-transform: rotateY(60deg); transform: rotateY(60deg); opacity: 0; filter: alpha(opacity=0); } .mfp-3d-unfold.mfp-removing.mfp-bg { opacity: 0; filter: alpha(opacity=0); } /* ====== Zoom-out effect ====== */ .mfp-zoom-out .mfp-with-anim { opacity: 0; filter: alpha(opacity=0); transition: all 0.3s ease-in-out; -webkit-transform: scale(1.3); transform: scale(1.3); } .mfp-zoom-out.mfp-bg { opacity: 0; filter: alpha(opacity=0); transition: all 0.3s ease-out; } .mfp-zoom-out.mfp-ready .mfp-with-anim { opacity: 1; filter: alpha(opacity=100); -webkit-transform: scale(1); transform: scale(1); } .mfp-zoom-out.mfp-ready.mfp-bg { opacity: 0.8; filter: alpha(opacity=80); } .mfp-zoom-out.mfp-removing .mfp-with-anim { -webkit-transform: scale(1.3); transform: scale(1.3); opacity: 0; filter: alpha(opacity=0); } .mfp-zoom-out.mfp-removing.mfp-bg { opacity: 0; filter: alpha(opacity=0); }