/* Theme Name: BizPlus Theme URI: https://divi.pixelsbuilderplus.com/divi-themes/bizplus/ Description: Multipurpose Premium Divi Child Theme perfect for Consulting Agency, Marketing Agency, Startup Companies, Creative Agency, business solution firm websites. Author: Pixels Builder Plus Author URI: https://pixelsbuilderplus.com/ Template: Divi Version: 1.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html */ /* ----------------------------------------------------------------------------- TABLE OF CONTENT --------------------------------------------------------- 01. Color Scema CSS 02. Global Class CSS 03. Header Section CSS 04. Slider Section CSS 05. Features Section CSS 06. About Section CSS 07. Service Section CSS 08. Portfolio Section CSS 09. Team Section CSS 10. Counter Section CSS 11. Experience Section CSS 12. Choose Us Section CSS 13. Testimonial Section CSS 14. Management Section CSS 15. Blog Section CSS 16. Solution Section CSS 17. Pricing Section CSS 18. CTA Section CSS 19. Estimate Section CSS 20. Achievement Section CSS 21. Contact Section CSS 22. Consultung Section CSS 23. Blog Details CSS 24. Blog Style Section CSS 25. FAQ Section CSS 26. Search Page CSS 27. 404 Page CSS 28. Coming Soon Page CSS 29. Footer Section CSS 30. Animation Part CSS 31. Slide In CSS --------------------------------------------------------*/ /* ----------------------------------- 01. Global Class CSS -------------------------------------*/ body{overflow-x:hidden;} /* Section Title CSS */ .px_title span{color: var(--px-color-1);margin-left: 70px; position: relative;} .px_title span::before {position: absolute;content: '';width: 60px;height: 2px;left: -72px;top: 12px;background: var(--px-color-1);} .px_title h2 {color: #333;} /* Responsive Css */ /* For Below Screen 768px */ @media screen and (max-width:767px){ .px_title h2{font-size: 28px!important;line-height: 40px!important;} } /* For Below Screen 480px */ @media only screen and (max-width: 480px) { .px_title h2{font-size: 28px!important;line-height: 40px!important;} } /* Button CSS */ .px_s_info::before{position: absolute;content: '';left: 66%;width: 100%;height: 0%;transform: translate(-50%, -50%) rotate(55deg);z-index: -1;transition: all 0.6s ease-in-out;display: block!important;background: var(--px-color-2);opacity: 1;} .px_s_info:hover {background: transparent!important;} .px_s_info:hover::before {height: 380%;} .px_s_info{background: var(--px-color-1);color: #ffff;transition: all 0.4s ease-in-out;overflow: hidden;line-height: 60px;} .px_s_info.dark {background: var(--px-color-2)} .px_s_info.dark:hover{border:1px solid var(--px-color-2);} .px_s_info.dark:hover::before {background: var(--px-color-1);} /* Video CSS */ .px_exp_video .et-pb-icon{z-index: 2;} .px_exp_video .et_pb_icon_wrap:before{ position: absolute; content: ''; width: 80px; height: 80px; top: -30px; left: -32px; z-index: 0; line-height: 80px; background: var(--px-color-1); border-radius: 50%; transform: translateX(-50%) translateY(-50%); animation: border 1500ms ease-out infinite; } .px_exp_video .et_pb_icon_wrap:after{position: absolute;content: '';background: var(--px-color-1);top: 50%;left: 50%;transform: translateX(-50%) translateY(-50%);width: 80px;height: 80px;border-radius: 50%;transition: all 200ms;} /* Parallax Backgroung With Overlay */ .px_parallax .et_parallax_bg:before {content:"";display:block;height:100%;position:absolute;top:0;left:0;width:100%;background-color:rgba(0, 0, 0, .6)} .px_parallax.bg .et_parallax_bg:before {background-color:rgba(0, 0, 0, .8)} /* Icon CSS */ .px_contact_info .et-pb-icon{color: var(--px-color-1) !important; animation: none !important;} /* Slider Icons CSS */ .px_slider .slick-next:before{content: '\24'!important;left: 0 !important;} .px_slider .slick-prev:before, .px_slider .slick-next:before{ content: '\23'; font-family: ETmodules!important; position: absolute; font-size: 25px; font-weight: 600; top: 0; right: 0; background: var(--px-color-1); width: 50px; height: 50px; line-height: 50px; color: #fff; border-radius: 50%;} .px_slider .slick-arrow{margin-bottom: 40px;font-size: 0;border: none;} /* Slider CSS */ .px_slider .slick-slide{margin:14px;} /* Responsive Css */ /* For Below Screen 768px */ @media screen and (max-width:767px){ .px_slider .slick-prev:before, .px_slider .slick-next:before{right:-20px;} .px_slider .slick-next:before{left: -20px !important;} } /* ----------------------------------- 03. Header Section CSS -------------------------------------*/ /*Header Top css*/ .px_h_small_info:before {color:var(--px-color-1);padding-right: 5px;position: relative;} .px_h_social_info .et_pb_social_icon a { display:inline-block; font-size:12px; border:1px solid var(--px-color-1); color:#fff; text-align:center; border-radius:50% !important; margin: 0 5px 0 0 !important; } .px_h_social_info .et_pb_social_media_follow li {margin-bottom:0px !important} .px_h_social_info .et_pb_social_icon a:last-child { margin-right:0 } .px_h_social_info .et_pb_social_icon a:hover { background-color:var(--px-color-1); color:#fff; border-color:rgba(0,0,0,0) } /*Header Menu css*/ /* Header Sub-Menu CSS */ /*Header Contact Info CSS*/ .px_header_1 .px_h_contact_info .et_pb_image_wrap{transform: rotate(-45deg);} /*Responsive CSS*/ @media screen and (max-width: 980px) { .px_header_1 .px_h_contact_info{display: none;} .px_header_1 .px_header_bottom:last-child{padding: 0;} .px_h_menu{padding-bottom:15px;} .px_header_1 .px_header_bottom .et_pb_menu__wrap{justify-content:end !important;} } /* ----------------------------------- Header Section CSS Version 2 -------------------------------------*/ /* Header Navigation CSS */ /* .px_header_menu .et-menu-nav ul li a{color: #fff;} .px_header_menu .sub-menu li a{color: #0a0a0a !important;} .px_header_2 .et-menu-nav ul li a{color: var(--px-color-2);} .px_header_2 .et-menu-nav ul li.current-menu-item a:hover, .px_header_2 .et-menu-nav ul li a:hover{color: var(--px-color-1)!important;background:transparent !important;} .px_header_2 .et-menu-nav ul li.current-menu-item a{color: var(--px-color-1)!important; opacity:1 !important;} .px_header_menu .et-menu-nav ul li a:hover{color: var(--px-color-1)!important; opacity:1 !important;} .px_header_menu .et-menu-nav ul li.current-menu-item a{color: var(--px-color-1)!important; opacity:1 !important;} */ .px_h_menu.et_pb_menu ul li{margin-top: 0 !important;padding:0px !important;} .px_h_menu.et_pb_menu ul li a{line-height: 30px;padding:15px 15px !important;} .px_h_menu.et_pb_menu ul li a:after{top: auto !important;} .px_h_menu.et_pb_menu ul li.menu-item-has-children ul.sub-menu{padding:0;border: none;border-radius: 0px;} .px_h_menu.et_pb_menu ul li.menu-item-has-children ul.sub-menu li{display:block;float:none;} .px_h_menu.et_pb_menu ul li.menu-item-has-children ul.sub-menu li a{ width: 100%;line-height: inherit;border-bottom: 1px solid rgba(0,0,0,.10); border-top: 0 none;padding: 13px 15px !important;display:block;color:var(--px-color-2) !important;font-size: 14px;} .px_h_menu.et_pb_menu ul li.menu-item-has-children ul.sub-menu li a:before{position: absolute; content: ''; left: 0px; top: 0px; width: 1px; height: 100%;opacity:0; background-color: var(--px-color-1); -webkit-transition: all .500s ease-in-out; transition: all .500s ease-in-out;} .px_h_menu.et_pb_menu ul li.menu-item-has-children ul.sub-menu li a:hover{opacity:1;padding-left: 20px !important;background-color: var(--px-color-2);color: #fff !important;} .px_h_menu.et_pb_menu ul li.menu-item-has-children ul.sub-menu li a:hover:before{opacity:1;width: 5px;} .nav li li ul{top:0px;} .px_h_menu.et-menu-nav li.mega-menu > ul{padding:10px !important;} .px_h_menu.et_pb_menu ul li.menu-item-has-children.mega-menu ul.sub-menu li a{padding: 13px 2px !important;color:var(--px-color-2 )!important;font-size:13px;} .px_h_menu.et_pb_menu ul li.menu-item-has-children.mega-menu ul.sub-menu li a:before{display:none;} /* Header Bottom CSS */ .px_header_bottom .et_pb_menu__logo{width: 170px;} .px_header_bottom .sub-menu{box-shadow: 0px 15px 30px 0px rgba(0 0 0 / 5%);border-top: 2px solid var(--px-color-1);top: -3%;} .px_header_bottom .sub-menu li{display: block;border-bottom: 1px solid #E6E7E8;} .px_header_bottom .sub-menu li a{padding: 15px 0;} .px_header_bottom .et_pb_menu .et_pb_menu__menu>nav>ul>li>ul{top: calc(100% - -10px);} /* Header Section 2 CSS */ .px_head_2 .header-image{width: 750px;margin-bottom: -150px;height: 750px;} .px_head_2 .et_pb_button_two.et_pb_button:after{position: absolute;background: var(--px-color-1);width:50px;top: -45px;height:50px;line-height:50px !important;border-radius: 50%;text-align:center;} .px_head_2 .et_pb_button_two.et_pb_button:before{ content: ""; position: absolute; right: -55%; top: -45px; width: 50px; height: 50px; transform: translate(-50%, -50%); display: block; border: 1px solid var(--px-color-1); border-radius: 50%; animation: border 1300ms ease-out infinite; } .px_head_2 .et_pb_button_one.et_pb_button:before{ position: absolute; content: ''; left: 66%; width: 100%; height: 0%; transform: translate(-50%, -50%) rotate(55deg); z-index: -1; transition: all 0.6s ease-in-out; display: block!important; background: var(--px-color-2); opacity: 1; } .px_head_2 .et_pb_button_one.et_pb_button:hover:before{height: 380%;} /* ----------------------------------- Header Section CSS Version 3 -------------------------------------*/ /* Header Menu CSS*/ /* Main Header CSS */ .px_main_header .header-image-container.bottom img{width: 200px;border-radius: 0 50% 50% 50%;overflow: hidden;border-width: 17px;border-color: #FFFFFF;height: 200px;float: left;animation: up-down 7s alternate infinite;} .px_main_header .header-content-container.center img{position: absolute;width: 75px;right: 45%;top: -15%;animation: mymove 5s infinite;} .px_main_header .et_pb_button_one.et_pb_button:before{ position: absolute; content: '' !important; left: 60%; width: 100%; height: 0%; transform: translate(-50%, -50%) rotate(55deg); z-index: -1; transition: all 0.6s ease-in-out; display: block!important; background: var(--px-color-2); opacity: 1; } .px_main_header .et_pb_button_one.et_pb_button:hover:before{height: 380%;background: #fff;color: var(--px-color-1);z-index:-1;} /* Responsive CSS*/ @media only screen and (max-width: 980px){ .px_h3_header_bottom .sub-menu{transform: scaleY(1) !important;} } @media only screen and (max-width: 767px){ .px_head_2 .header-image{width: 0px;margin-bottom: -150px;height: 0px;} } /* ----------------------------------- 04. Slider Section CSS -------------------------------------*/ /*Slider Title CSS*/ .px_slider_1 .et_pb_slide_description .et_pb_slide_title{color: var(--px-color-1)!important;} /*Slider Button CSS*/ .px_slider_1 .et_pb_button::before{ position: absolute; content: ''; left: 66%; width: 100%; height: 0%; transform: translate(-50%, -50%) rotate(55deg); z-index: -1; transition: all 0.6s ease-in-out; display: block!important; background: #fff; opacity: 1; } .px_slider_1 .et_pb_button:hover::before {height: 380%;} .px_slider_1 .et_pb_button:hover{color: var(--px-color-1)!important;} .px_slider_1 .et_pb_button{display: inline-block;background: var(--px-color-1);color: #ffff;text-align: center;z-index: 3;position: relative;overflow: hidden;} /*Slider Controllers CSS*/ .px_slider_1 .et-pb-arrow-prev:before{content: '\23'!important;font-family: ETmodules!important;font-size: 35px;padding: 5px;background: var(--px-color-1);border-radius: 50%;} .px_slider_1 .et-pb-arrow-next:before{content: '\24'!important;font-family: ETmodules!important;font-size: 35px;padding: 5px;background: var(--px-color-1);border-radius: 50%;} .px_slider_1 .et-pb-controllers { height: 7px; bottom: 0!important } .px_slider_1 .et-pb-controllers a:hover { background-color: #fff!important; transition: all .2s ease-in-out } .px_slider_1 .et-pb-controllers { height: 7px; bottom: 0!important } .px_slider_1 .et-pb-controllers a { width: 20%!important; border-radius: 0!important; margin-right: 0!important } .px_slider_1 .et-pb-controllers a:hover { background-color: var(--px-color-1)!important; transition: all .2s ease-in-out } .px_slider_1 .et-pb-controllers a { width: 60px!important; border-radius: 0!important; margin-right: 0!important } .px_slider_1 .et-pb-controllers .et-pb-active-control { background-color: var(--px-color-1); } .dct_slider_v4 .et-pb-controllers { height: 7px; bottom: 0!important } .dct_slider_v4 .et-pb-controllers a:hover { background-color: #fff!important; transition: all .2s ease-in-out } .dct_slider_v4 .et-pb-controllers { height: 7px; bottom: 0!important } .dct_slider_v4 .et-pb-controllers a { width: 20%!important; border-radius: 0!important; margin-right: 0!important } .dct_slider_v4 .et-pb-controllers a:hover { background-color: #fa7c04!important; transition: all .2s ease-in-out } .dct_slider_v4 .et-pb-controllers a { width: 60px!important; border-radius: 0!important; margin-right: 0!important } .dct_slider_v4 .et-pb-controllers .et-pb-active-control { background-color: #fa7c04 } /* ----------------------------------- 05. Features Section CSS -------------------------------------*/ .px_f_blurb {border-radius: 15px;box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; -webkit-transition: all .4s ease-in-out;transition: all .4s ease-in-out;overflow: hidden;} .px_f_blurb:hover {border-radius: 15px;box-shadow: var(--px-color-1) 0px 5px 15px;transform: translateY(-10px);} .px_features .px_f_blurb .et_pb_image_wrap .et-pb-icon{z-index: 2; color: var(--px-color-1);} .px_features .px_f_blurb .et_pb_module_header {color: var(--px-color-2);} /* ----------------------------------- 06. About Section CSS -------------------------------------*/ .px_about .px_a_list {color: var(--px-color-2);} .px_about .px_a_list:before{color: var(--px-color-1);} .px_about .px_about_inner_2 {border-bottom: 1px solid #E6E7E8;} .px_about_info:hover{background-color: #fff !important; padding-left: 35px !important;} .px_about_info{color: #454545bd !important;} .px_about_info:before{color: var(--px-color-1);} /* About Image CSS*/ .px_about_image .et_pb_image_wrap{width: 100%;} .px_about_image{border-radius: 50px 50px 0 0;} .px_about_image .et_pb_image_wrap img{width: 100% !important;} /* ----------------------------------- About Section CSS Version 2 -------------------------------------*/ .px_about_counter p{font-size: 30px;} .px_about_counter p span{font-size: 16px;} /* ----------------------------------- 07. Service Section CSS -------------------------------------*/ .px_service .px_s_item{border-color: #E6E7E8;} .px_service.px_ser_slider .px_s_item .et_pb_image_wrap {margin-right:0px !important;} .px_service .px_s_item .et_pb_image_wrap {margin-right:10px !important;} .px_service .px_s_item.img .et_pb_image_wrap {margin-right:0px !important;} .px_service .px_s_item .et_pb_image_wrap .et-pb-icon{color: var(--px-color-1);margin-right: 10px !important;} .px_service{border-radius: 15px;box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; -webkit-transition: all .4s ease-in-out;transition: all .4s ease-in-out;overflow: hidden;} .px_service:hover {border-radius: 15px;box-shadow: var(--px-color-1) 0px 5px 15px;transform: translateY(-10px);color: #fff;} .px_service:hover .et_pb_module_header {color: #fff;} .px_service:hover .px_s_item.img .et_pb_image_wrap img{filter:unset; } .px_service:hover .px_s_item .et_pb_image_wrap img{filter: brightness(0) invert(100%); } /*Service Button CSS*/ .px_service .px_s_button{color: var(--px-color-2);} .px_s_button:before{position: absolute;content: ' ';width: 50px;height: 2px;background: var(--px-color-1);bottom: 0;left: 0;opacity: 1;margin-left: 1px;transition: all 0.3s ease-in-out;display: block!important;} .px_s_button:after{font-size: 0!important;} .px_s_button.left:before {bottom:unset;width:15px;} .px_service:hover .px_s_button.left:before {width: 10px !important;} .px_service:hover .px_s_button{color: var(--px-color-1);} .px_service:hover .px_s_button:before{width: 90px;} /* Service Slider CSS */ /* .px_slider .px_service.et-last-child:last-child{margin-right:10px !important;} */ .px_slider .px_service.et-last-child, .px_slider .px_service:last-child{margin-right: 10px!important;} /* ----------------------------------- Service Section CSS Version 2 -------------------------------------*/ .px_h2_service .et_pb_image_wrap .et-pb-icon{color: var(--px-color-2); transition: 0.3s;} .px_h2_service:hover .et_pb_image_wrap .et-pb-icon{color: var(--px-color-1);} .px_h2_service .et_pb_module_header{color: var(--px-color-1);transition: 0.3s;} .px_h2_service:hover .et_pb_module_header{color: #fff;transition: 0.3s;} .px_h2_service_info{color: var(--px-color-2) !important;} .px_h2_service_info:hover{color: var(--px-color-1) !important;background-color: transparent !important;transition: 0.3s;} .px_h2_service:hover .px_h2_service_info{color: var(--px-color-1) !important;} /* Responsive CSS */ @media only screen and (max-width: 990px) { .px_service .px_s_item .et_pb_blurb_content{max-width:100% !important;} } @media only screen and (max-width: 767px) { .px_h2_service .et_pb_module_header{font-size: 22px !important;} } /* ----------------------------------- Service Section CSS Version 3 -------------------------------------*/ .px_services_item .et-pb-icon{color: var(--px-color-1)!important;opacity:1 !important;} .px_h3_about .px_s_info::before{background-color: #fff !important; color: var(--px-color-1) !important;} .px_h3_about .px_s_info:hover{color: var(--px-color-1) !important; transition: 0.5s;} /* ----------------------------------- Service Section CSS Version 4 -------------------------------------*/ .px_service_v4 .et_pb_main_blurb_image{ border-radius: 5px; box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px; -webkit-transition: all .4s ease-in-out; transition: all .4s ease-in-out; overflow: hidden; margin-bottom:10px; padding:5px; background:#fff; } .px_service_v4:hover .et_pb_main_blurb_image{box-shadow: var(--px-color-1) 0px 5px 15px;transform: translateY(-10px); } /* ----------------------------------- Services Details Section CSS -------------------------------------*/ .px_experience_content_content .px_exp_bar .et_pb_counter_container{height: 8px;background: #E6E7E8;margin-top: 10px;border-radius: 0px;} .px_experience_content .et_pb_counter_container {position: static!important;} .px_experience_content .et_pb_counter_container .et_pb_counter_amount_number{color: var(--px-color-1);} /*experience Counter CSS*/ .px_experience_content .px_exp_bar .et_pb_counter_amount{height: 8px;background: var(--px-color-1);transition: 3.5s;} .px_experience_content .px_exp_counter{border-color: var(--px-color-1);box-shadow: 0 30px 50px rgb(0 0 0 / 5%);background: #F5F5F5;} .px_experience_content .px_exp_counter .percent{margin-bottom: 0!important} .px_experience_content .et_pb_counter_title{color: var(--px-color-2) !important;} /* ----------------------------------- Services List Section CSS -------------------------------------*/ .px_service_list_image{height: 100%;} .px_service_list.et-last-child, .px_service_list:last-child{padding-bottom:40px !important;} /* ----------------------------------- 08. Portfolio Section CSS -------------------------------------*/ /* Portfolio Header CSS */ .px_portfolio_filter .et_pb_portfolio_item .et_pb_module_header{opacity: 0;position: absolute;bottom: 0;padding: 0;left: 20px;z-index: 9;color:#fff;transition: all 0.4s ease-in-out;} .px_portfolio_filter .et_pb_portfolio_item:hover .et_pb_module_header{opacity: 1;bottom: 40px;} /* Portfolio Post Meta CSS*/ .px_portfolio_filter .et_pb_portfolio_item .post-meta{opacity: 0;position: absolute;bottom: 0;left: 20px;z-index: 9;transition: all 0.4s ease-in-out;color:var(--px-color-1);} .px_portfolio_filter .et_pb_portfolio_item .post-meta a{color:var(--px-color-1);} .px_portfolio_filter .et_pb_portfolio_item:hover .post-meta{opacity: 1;bottom: 15px;} /* Portfolio Image CSS */ .px_portfolio_filter .et_pb_portfolio_item{position: relative;overflow: hidden;} .px_portfolio_filter .et_pb_portfolio_item .et_portfolio_image{position: relative;display: block;overflow: hidden;z-index: 5;} .px_portfolio_filter .et_pb_portfolio_item .et_portfolio_image img{width: 100%;height: 300px;transform: scale(1.01);transition: all 0.7s ease;object-fit:cover;object-position: left center;} /* Portfolio Overlay CSS */ .px_portfolio_filter .et_pb_portfolio_item .et_overlay:before{ background: #fff; position: absolute; bottom: -80px; top:auto !important; right: 0 !important; left:auto !important; line-height: 50px; height: 50px; width: 50px; text-align: center; color: var(--px-color-2)!important; border-radius: 50%; opacity: 0; z-index: 2; transition: all 0.4s ease-in-out; } .px_portfolio_filter .et_pb_portfolio_item:hover .et_overlay:before{opacity: 1;bottom: -15px !important;} .px_portfolio_filter.fw .et_pb_portfolio_item:hover .et_overlay:before{opacity: 1;bottom: 0 !important;} /*Portfolio Controllers CSS*/ .px_portfolio_filter .et-pb-arrow-prev:before{content: "\23";} .px_portfolio_filter .et-pb-arrow-next:before{content: "\24";} /* Portfolio Image CSS */ .px_portfolio_filter.fw.portfolio .et_pb_portfolio_item .et_portfolio_image:before, .px_portfolio_filter.fw.portfolio .et_pb_portfolio_item .et_pb_portfolio_image:before {content: '';background: var(--px-color-2);position: absolute;width: 100%;height: 100%;top: 100%;z-index: 1;opacity: 0;transition: all 0.7s ease;} .px_portfolio_filter.fw.portfolio .et_pb_portfolio_item:hover .et_portfolio_image:before, .px_portfolio_filter.fw.portfolio .et_pb_portfolio_item:hover .et_pb_portfolio_image:before{top: 0%;opacity: 0.7;} /*Responsive CSS*/ @media screen and (max-width: 980px) { .px_portfolio_filter{background-color: #fff;} .px_portfolio_filter .px_title h2 {color: #333!important;} } @media only screen and (max-width: 480px) { .px_portfolio_filter{background-color: #fff;} .px_portfolio_filter .px_title h2 {color: #333!important;} } /* ----------------------------------- Portfolio Section CSS Version 3 -------------------------------------*/ /* Portfolio Filters CSS */ .px_portfolio_filter .et_pb_portfolio_filters ul li a.active, .px_portfolio_list .et_pb_portfolio_filters ul li a.active{color: #fff;background: var(--px-color-1) !important;} .px_portfolio_filter .et_pb_portfolio_filters ul li a:hover, .px_portfolio_list .et_pb_portfolio_filters ul li a:hover{color: #fff;background: var(--px-color-1) !important;padding: 10px 20px;transition: 0.5s;} .px_portfolio_filter .et_pb_portfolio_filters ul li a, .px_portfolio_list .et_pb_portfolio_filters ul li a{border:none !important; margin-left: 20px;} /*--- Pagination CSS ---*/ .px_portfolio_filter .et_pb_portofolio_pagination ul li a, .px_portfolio_list .et_pb_portofolio_pagination ul li a{color: var(--px-color-2);border: 1px solid var(--px-color-1);border-radius: 5px;padding: 10px 15px;} .px_portfolio_filter .et_pb_portofolio_pagination, .px_portfolio_list .et_pb_portofolio_pagination{margin-top: 10px;border: none;} .px_portfolio_filter .et_pb_portofolio_pagination ul li a.active,.px_portfolio_list .et_pb_portofolio_pagination ul li a.active{background: var(--px-color-1);color: #fff;transition: all 0.4s ease;} .px_portfolio_filter .et_pb_portofolio_pagination ul li a.active:hover,.px_portfolio_list .et_pb_portofolio_pagination ul li a.active:hover{background: var(--px-color-2);transition: all 0.4s ease;} /* ----------------------------------- Our Project CSS Using Portfolio -------------------------------------*/ .px_portfolio_filter.fw .pagination a{ color: #fff; background: var(--px-color-1); display: block; line-height: 50px; padding: 0 20px; font-weight: 600; border-radius: 30px; transition: all 0.3s ease-in-out; margin-top: 30px; } /* ----------------------------------- Projects Grid Image Common CSS -------------------------------------*/ .px_portfolio_list .et_portfolio_image{height:100%;} .px_portfolio_list .et_portfolio_image img{height:100% !important;object-fit:cover;} /* ----------------------------------- Projects Grid 4 Column CSS -------------------------------------*/ /* Main Items CSS */ .px_portfolio_list .et_pb_portfolio_item:hover:before{top:0;opacity:0.7;} .px_portfolio_list .et_pb_portfolio_item{overflow:hidden;} .px_portfolio_list .et_pb_portfolio_item:before{ position: absolute; content: ''; background: var(--px-color-2); opacity: 0; width: 100%; top: 100%; height: 100%; left: 0; z-index:1; transition: all 0.5s ease-in-out; } /* Description CSS */ .px_portfolio_list .et_pb_portfolio_item .project_block{text-align:left;} .px_portfolio_list .et_pb_portfolio_item .project_block .et_pb_module_header{padding:0;} .px_portfolio_list .et_pb_portfolio_item .project_block .post-meta a{color:var(--px-color-1);} .px_portfolio_list .et_pb_portfolio_item .project_block{ left: auto; margin-left:25px; bottom: 0; z-index: 9; width: 95%; visibility: hidden; opacity: 0; position: absolute; transition: all 0.5s ease-in-out; } .px_portfolio_list .et_pb_portfolio_item:hover .project_block{visibility: visible;opacity: 1;bottom: 20px;} .px_portfolio_list .project_block:before { content: '\31'; position: absolute; font-family: ETmodules; top: 30%; right: 9%; font-size: 30px; width: 50px; height: 50px; text-align: center; line-height: 50px; background: #fff; border-radius: 50%; color: var(--px-color-2); } /* Overlay CSS */ .px_portfolio_list .et_portfolio_image .et_overlay:before{ top: 85%; background: #fff; left: 100%; width: 50px; height: 50px; text-align: center; line-height: 50px; border-radius: 50%; transition: all 0.5s ease-in-out; } .px_portfolio_list .et_pb_portfolio_item:hover .et_portfolio_image .et_overlay:before{left:90%;} /* Pagination CSS */ .px_portfolio_list .pagination a{color: #fff;background: var(--px-color-1);display: block;line-height: 50px;padding: 0 20px;font-weight: 600;border-radius: 30px;transition: all 0.3s ease-in-out;} .px_portfolio_list .pagination a:hover{background-color: var(--px-color-2);} /* Filtered Portfoliio CSS */ .px_portfolio_list.filter .et_pb_portfolio_filters ul{margin: auto;display: flex;justify-content: center;} .px_portfolio_list.filter .et_pb_portfolio_filters ul li a.active {color: #fff;background: var(--px-color-1);} .px_portfolio_list.filter .et_pb_portfolio_filters ul li a:hover {color: #fff;background-color: var(--px-color-1);} .px_portfolio_list.filter .et_pb_portfolio_filters ul li a{border:none !important;} .px_portfolio_list.px_col_4 .et_pb_ajax_pagination_container{display: grid;grid-gap: 20px;grid-template-columns: repeat(4, 25%);} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_portfolio_list.px_col_4 .et_pb_ajax_pagination_container{grid-template-columns: repeat(2, 50%);} .px_portfolio_style1 .et_pb_portfolio_item:nth-child(1){grid-column: unset;grid-row: unset;} } @media only screen and (max-width: 767px){ .px_portfolio_list.px_col_4 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 100%);} } /* ----------------------------------- Projects Grid 3 Column CSS -------------------------------------*/ .px_portfolio_list.px_col_3 .et_pb_ajax_pagination_container,.px_portfolio_list.px_col_3 .et_pb_portfolio_items{display: grid;grid-gap: 20px;grid-template-columns: repeat(3, 33.33%);} /* ----------------------------------- Projects Grid 2 Column CSS -------------------------------------*/ .px_portfolio_list.px_col_2 .et_pb_ajax_pagination_container,.px_portfolio_list.px_col_2 .et_pb_portfolio_items{grid-template-columns: repeat(2, 50%);display: grid;grid-gap: 20px;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_portfolio_list.px_col_3 .et_pb_ajax_pagination_container,.px_portfolio_list.px_col_3 .et_pb_portfolio_items{grid-template-columns: repeat(2, 1fr);} } @media only screen and (max-width: 767px){ .px_portfolio_list.px_col_3 .et_pb_ajax_pagination_container,.px_portfolio_list.px_col_2 .et_pb_portfolio_items{grid-template-columns: repeat(1, 1fr);} .px_portfolio_list.px_col_3.px_col_2 .et_pb_ajax_pagination_container,.px_portfolio_list.px_col_2 .et_pb_portfolio_items{grid-template-columns: unset;} } /* ----------------------------------- 25. Portfolio Style Section CSS -------------------------------------*/ /* Portfolio Style Hover CSS */ .px_portfolio_style .et_portfolio_image:before { content: ''; position: absolute; background: var(--px-color-2); width: 100%; height: 100%; top: 100%; left: 0; z-index: 1; opacity: 0; transition: all 0.3s ease-in-out; } .px_portfolio_style .et_pb_portfolio_item:hover .et_portfolio_image:before{opacity: 0.8;top: 0;} .px_portfolio_style .et_pb_portfolio_item:hover:before{bottom: 20px;} .px_portfolio_style .et_pb_portfolio_item:hover .et_pb_module_header {opacity: 1;z-index: 1;transform: translateY(0px);transition: 0.5s;} .px_portfolio_style .et_pb_portfolio_item:hover .post-meta{opacity: 1;z-index: 1;transform: translateY(0px);transition: 0.7s;} /* Main Items CSS */ .px_portfolio_style .et_pb_portfolio_item:before{ content: '\31'; position: absolute; font-family: ETmodules!important; right: 15px; z-index: 3; width: 50px; height: 50px; background: #fff; border-radius: 50%; text-align: center; line-height: 50px; bottom: -50px; transition: all 0.3s ease-in-out; } .px_portfolio_style .et_pb_module_header{position: absolute;bottom: 40px;padding-left: 20px;color: #fff;opacity: 0;transform: translateY(70px);} .px_portfolio_style .post-meta{position: absolute;bottom: 10px;padding-left: 20px;color: #fff !important;opacity: 0;transform: translateY(50px);} /* Portfolio Style 1 CSS */ .px_portfolio_style1 .et_pb_ajax_pagination_container{grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_portfolio_style1 .et_pb_portfolio_item{margin-bottom: 0px !important;overflow: hidden;} .px_portfolio_style1 .et_portfolio_image{margin-bottom: 0px !important;overflow: hidden;height: 100%;} .px_portfolio_style1 .et_portfolio_image img{transition: transform 0.3s ease;filter: brightness(0.6);transform: scale(1);height: 100%;} .px_portfolio_style1 .et_portfolio_image:hover img{transform: scale(1.1);} .px_portfolio_style1 .et_pb_portfolio_item:nth-child(1){grid-column: span 2;grid-row: span 2;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_portfolio_style1 .et_pb_ajax_pagination_container{grid-template-columns: repeat(2, 1fr);} .px_portfolio_style1 .et_pb_portfolio_item:nth-child(1){grid-column: unset;grid-row: unset;} } @media only screen and (max-width: 767px){ .px_portfolio_style1 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} .px_portfolio_style1 .et_pb_module_header{bottom: 45px;} } /* Portfolio Style 2 CSS */ .px_portfolio_style2 .et_pb_ajax_pagination_container{display: grid;grid-template-columns: repeat(3, 1fr);grid-column-gap: 10px;grid-row-gap: 10px;} .px_portfolio_style2 .et_pb_ajax_pagination_container .et_pb_portfolio_item{position: relative;display: flex;align-items: flex-end;min-height: 245px;} .px_portfolio_style2 .et_pb_ajax_pagination_container .et_pb_portfolio_item:nth-child(4n+1), .px_portfolio_style2 .et_pb_ajax_pagination_container .et_pb_portfolio_item:nth-child(4n){grid-column-end: span 2;} .px_portfolio_style2 .et_pb_portfolio_item{margin-bottom: 0px !important;overflow: hidden;} .px_portfolio_style2 .et_portfolio_image{margin-bottom: 0px !important;overflow: hidden;} .px_portfolio_style2 .et_portfolio_image img{transition: transform 0.3s ease;filter: brightness(0.6);transform: scale(1);height: 300px;} .px_portfolio_style2 .et_portfolio_image:hover img{transform: scale(1.1);} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_portfolio_style2 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);} .px_portfolio_style2 .et_pb_ajax_pagination_container .et_pb_portfolio_item:nth-child(4n+1), .px_portfolio_style2 .et_pb_ajax_pagination_container .et_pb_portfolio_item:nth-child(4n) {grid-column-end: unset;} } @media only screen and (max-width: 767px){ .px_portfolio_style2 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} } /* Portfolio Style 3 CSS */ .px_portfolio_style3 .et_pb_ajax_pagination_container {grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 0px;grid-row-gap: 0px;} .px_portfolio_style3 .et_pb_portfolio_item {margin-bottom: 0px !important;display: flex;align-items: flex-end;min-height: 260px;} .px_portfolio_style3 .et_pb_portfolio_item:nth-child(3) {grid-row-end: span 2;} .px_portfolio_style3 .et_portfolio_image img{transition: transform 0.3s ease;filter: brightness(0.6);transform: scale(1); height: 100%;object-fit: cover;} .px_portfolio_style3 .et_portfolio_image:hover img{transform: scale(1.1);} .px_portfolio_style3 .et_portfolio_image {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} .px_portfolio_style3.px_portfolio_list .pagination a{margin-top:20px;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_portfolio_style3 .et_pb_portfolio_item:nth-child(3) {grid-row-end: unset;} .px_portfolio_style3 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);} .px_portfolio_style3 .alignleft{float: right;} } @media only screen and (max-width: 767px){ .px_portfolio_style3 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} .px_portfolio_style3 .alignleft{float: left;} } /* Portfolio Style 4 CSS */ .px_portfolio_style4 .et_pb_ajax_pagination_container {grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_portfolio_style4 .et_pb_portfolio_item:nth-child(1) {grid-row-end: span 2;} .px_portfolio_style4 .et_pb_portfolio_item{margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} .px_portfolio_style4 .et_portfolio_image img{transition: transform 0.3s ease;filter: brightness(0.6);transform: scale(1); height: 100%;object-fit: cover;} .px_portfolio_style4 .et_portfolio_image:hover img{transform: scale(1.1);} .px_portfolio_style4 .et_portfolio_image {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_portfolio_style4 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);} .px_portfolio_style4 .et_pb_portfolio_item:nth-child(1) {grid-row-end: unset;} .px_portfolio_style4 .alignleft{float: right;} } @media only screen and (max-width: 767px){ .px_portfolio_style4 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} .px_portfolio_style4 .alignleft{float: left;} } /* Portfolio Style 5 CSS */ .px_portfolio_style5 .et_pb_ajax_pagination_container{grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_portfolio_style5 .et_pb_portfolio_item:nth-child(2){grid-row-end: span 2;} .px_portfolio_style5 .et_portfolio_image{margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;border-radius: 4px;} .px_portfolio_style5 .et_portfolio_image img{height: 100%;transition: all 0.3s;filter: grayscale(100%);border-radius: 4px;object-fit: cover;} .px_portfolio_style5 .et_portfolio_image:hover img{filter: grayscale(0);} .px_portfolio_style5 .et_pb_portfolio_item{margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} .px_portfolio_style5 .et_portfolio_image {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_portfolio_style5 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);} .px_portfolio_style5 .et_pb_portfolio_item:nth-child(1) {grid-row-end: unset;} .px_portfolio_style5 .alignleft{float: right;} } @media only screen and (max-width: 767px){ .px_portfolio_style5 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} .px_portfolio_style5 .alignleft{float: left;} } /* Portfolio Style 6 CSS */ .px_portfolio_style6 .et_pb_ajax_pagination_container {grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_portfolio_style6 .et_pb_portfolio_item {margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} .px_portfolio_style6 .et_pb_portfolio_item .et_portfolio_image {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} .px_portfolio_style6 .et_pb_portfolio_item:nth-child(2n+5):nth-child(3n+2) {grid-column-end: span 2;} .px_portfolio_style6 .et_pb_portfolio_item .et_portfolio_image {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} .px_portfolio_style6 .et_portfolio_image img{transition: all 0.3s;filter: brightness(0.6);height: 100%!important;object-fit: cover;} .px_portfolio_style6 .et_pb_portfolio_item:hover .et_portfolio_image img{filter: brightness(1);} .px_portfolio_style6 .et_pb_portfolio_item{margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_portfolio_style6 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);} .px_portfolio_style6 .et_pb_portfolio_item:nth-child(2n+5):nth-child(3n+2) {grid-column-end: unset;} .px_portfolio_style6 .et_pb_portfolio_item:nth-child(5n+2):nth-child(2n+3) {grid-row-end: unset;} } @media only screen and (max-width: 767px){ .px_portfolio_style6 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} } /* Portfolio Style 7 CSS */ .px_portfolio_style7 .et_pb_ajax_pagination_container {grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_portfolio_style7 .et_pb_portfolio_item {margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} .px_portfolio_style7 .et_pb_portfolio_item:nth-child(5) {grid-column: span 2;grid-row: span 2;} .px_portfolio_style7 .et_pb_portfolio_item{margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} px_portfolio_style7 .et_pb_portfolio_item .et_portfolio_image {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} .px_portfolio_style7 .et_portfolio_image img {transition: transform 0.3s ease;filter: brightness(0.6);height: 100%!important;object-fit: cover;} .px_portfolio_style7 .et_pb_portfolio_item:hover .et_portfolio_image img {transform: scale(1.2) rotate(5deg);} .px_portfolio_style7 .et_pb_portfolio_item a{height: 100%;} .px_portfolio_style7 .et_pb_portfolio_item a .et_portfolio_image{height: 100%;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_portfolio_style7 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);} .px_portfolio_style7 .et_pb_portfolio_item:nth-child(5) {grid-column: unset;grid-row: unset;} } @media only screen and (max-width: 767px){ .px_portfolio_style7 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} } /* Portfolio Style 8 CSS */ .px_portfolio_style8 .et_pb_portfolio_item {margin-bottom: 0;} .px_portfolio_style8 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_portfolio_style8 .et_pb_portfolio_item:nth-child(6n+1), .px_portfolio_style8 .et_pb_portfolio_item:nth-child(6n+5) {grid-row-end: span 2;} .px_portfolio_style8 .et_pb_portfolio_item .et_portfolio_image {margin-bottom: 0;overflow: hidden;height: 100%} .px_portfolio_style8 .et_pb_portfolio_item:hover .et_portfolio_image img {filter: brightness(1);} .px_portfolio_style8 .et_portfolio_image img {transition: all 0.3s;filter: brightness(0.6);height: 260px;object-fit: cover;} .px_portfolio_style8 .et_pb_portfolio_item:nth-child(6n+1) img, .px_portfolio_style8 .et_pb_portfolio_item:nth-child(6n+5) img {height: 100%;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_portfolio_style8 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);} .px_portfolio_style8 .et_pb_portfolio_item:nth-child(6n+1), .px_portfolio_style8 .et_pb_portfolio_item:nth-child(6n+5) {grid-row-end: unset;} } @media only screen and (max-width: 767px){ .px_portfolio_style8 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} } /* Portfolio Style 9 CSS */ .px_portfolio_style9 .et_pb_ajax_pagination_container {grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_portfolio_style9 .et_pb_portfolio_item {margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} .px_portfolio_style9 .et_pb_portfolio_item .et_portfolio_image {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} .px_portfolio_style9 .et_portfolio_image img{transition: all 0.3s;filter: brightness(0.6);height: 100%!important;object-fit: cover;} .px_portfolio_style9 .et_pb_portfolio_item:hover .et_portfolio_image img {filter: brightness(1);} .px_portfolio_style9 .et_pb_portfolio_item:nth-child(5) {grid-row: span 1;grid-column: span 2;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_portfolio_style9 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);} .px_portfolio_style9 .et_pb_portfolio_item:nth-child(5n) {grid-row: unset;grid-column: unset;} } @media only screen and (max-width: 767px){ .px_portfolio_style9 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} } /* Portfolio Style 10 CSS */ .px_portfolio_style10 .et_pb_ajax_pagination_container {grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_portfolio_style10 .et_pb_portfolio_item {margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} .px_portfolio_style10 .et_pb_portfolio_item .et_portfolio_image {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} .px_portfolio_style10 .et_portfolio_image img {transition: all 0.3s;filter: grayscale(100%);height: 100%!important;object-fit: cover;} .px_portfolio_style10 .et_pb_portfolio_item:hover .et_portfolio_image img {filter: grayscale(0);} .px_portfolio_style10 .et_pb_portfolio_item:nth-child(3n+2) {grid-row-end: span 2;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_portfolio_style10 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);} .px_portfolio_style10 .et_pb_portfolio_item:nth-child(3n+2) {grid-row-end: unset;} } @media only screen and (max-width: 767px){ .px_portfolio_style10 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} } /* ----------------------------------- 09. Team Section CSS -------------------------------------*/ .px_team .px_team_item {position: relative;overflow: hidden;} /* Team Image CSS */ .px_team .px_team_item img{border-radius: 15px;/*box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;transition: all .4s ease-in-out;*/overflow: hidden;filter: grayscale(100%); } .px_team .px_team_item:hover img{filter: grayscale(0%);transition: 0.5s;} /* Team Description CSS */ .px_team .px_team_item .et_pb_team_member_description {margin-bottom: 15px !important;border-radius: 15px ;box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;transition: 0.5s;} .px_team .px_team_item:hover .et_pb_team_member_description {box-shadow: var(--px-color-1) 0px 5px 15px;transform:translateY(-20px);} .px_team .px_team_item .et_pb_team_member_description .et_pb_module_header{color: var(--px-color-2);} .px_team .px_team_item .et_pb_team_member_description .et_pb_member_position{color: var(--px-color-1);} /* Team Solial Link CSS*/ .px_team .px_team_item .et_pb_member_social_links li{margin-right: 5px !important;} .px_team .px_team_item .et_pb_member_social_links li a{border: 1px solid #E6E7E8;width: 45px;height: 45px;line-height: 45px;color: var(--px-color-2);transition: all 0.3s ease-in-out;display: inline-block;text-align: center;border-radius: 50%;} .px_team .px_team_item .et_pb_member_social_links li a:hover{background: var(--px-color-1);color: #ffff;border-color: var(--px-color-1);} /*Responsive CSS*/ @media only screen and (max-width: 980px){ .px_team_item .et_pb_team_member_image{margin: auto;max-width: 400px;} .px_team .et_pb_team_member_description .et_pb_member_social_links li a {margin-right: 0px;font-size: 14px;width: 41px;height: 41px;line-height: 41px;} } /* ----------------------------------- Team Section CSS Version 3 -------------------------------------*/ .px_h3_team{overflow: hidden;} .px_h3_team:hover{box-shadow: var(--px-color-1) 0px 5px 15px;transition: 0.5s;} /* Team Social Links CSS */ .px_h3_team .et_pb_member_social_links{position: absolute;top: -20px;right: -50px;width: 50px;background: var(--px-color-1);padding: 12px 0 0;text-align: center;opacity: 0;visibility: hidden;transition: all .4s ease 0s;} .px_h3_team .et_pb_member_social_links:after{content: "";position: absolute;width: 0;height: 0;border-top: 50px solid var(--px-color-1);border-right: 50px solid transparent;bottom: 0;left: 0;display: block;top: 100%;} .px_h3_team:hover .et_pb_member_social_links{right: 0;width: 50px;opacity: 1;visibility: visible;} .px_h3_team .et_pb_member_social_links li a{color: #fff;width: 35px;height: 35px;line-height: 35px;transition: 0.3s all ease;} /* Team Image CSS */ .px_h3_team:hover .et_pb_team_member_image{transform: scale(1.1);transition: 0.5s ease-out;} .px_h3_team .et_pb_team_member_image{margin-bottom: 0 !important; max-width: 100%; transform: scale(1); z-index: -1;} .px_h3_team .et_pb_team_member_image{filter: grayscale(100%);} .px_h3_team:hover .et_pb_team_member_image{filter: grayscale(0);} .px_h3_team:hover .et_pb_team_member_image:before{opacity: 0.7;} /* Team Description CSS */ .px_h3_team .et_pb_module_header{padding: 0;color: var(--px-color-2);} .px_h3_team .et_pb_team_member_description{padding: 20px 20px 25px;background-color: #fff; z-index: 1;overflow: hidden;} .px_team_top .px_s_info::before{background-color: #fff !important; color: var(--px-color-1) !important;} .px_team_top .px_s_info:hover{color: var(--px-color-1) !important; transition: 0.5s;} /* Responsive CSS */ @media only screen and (max-width: 768px){ .px_h3_team .et_pb_team_member_image {margin: 0 !important;} } /* ----------------------------------- Team Carousel Version 3 -------------------------------------*/ .px_team.px_team_slider .px_team_item img{width: 100%;} .px_team.px_team_slider .px_team_item .et_pb_team_member_image{max-width: 100% !important;margin: auto;} .px_team.px_team_slider .slick-slide{margin-right:10px !important;} /* ----------------------------------- CEO & Founder Page Section CSS -------------------------------------*/ .px_team_item.px_founder .et_pb_team_member_image{max-width:100% !important;} .px_team_item.px_founder .et_pb_team_member_image img{width:100%;} /* ----------------------------------- Team List Section CSS -------------------------------------*/ .px_contact_social_links.list li a.icon:before{background-color: var(--px-color-2);color: #fff;} .px_team_list .px_exp_bar .et_pb_counter_amount{height: 8px;background: var(--px-color-1);transition: 3.5s;} .px_team_list .et_pb_counter_container .et_pb_counter_amount_number{color: var(--px-color-1);} .px_team_list .et_pb_counter_container{position: static!important;} /* Team List Tabs CSS */ .px_team_list_tabs .et_pb_tab_active a{color: #fff !important;background-color: var(--px-color-1);padding: 10px 35px;} .px_team_list_tabs .et_pb_tabs_controls li.et_pb_tab_active{background-color: #F5F5F5;} .px_team_list_tabs .et_pb_tabs_controls{display: flex;background: #fff;justify-content: center;background: #F5F5F5;} .px_team_list_tabs.px_founder .et_pb_tabs_controls{background:transparent !important;} .px_team_list_tabs.px_founder .et_pb_tabs_controls{background: transparent !important;} /* Team List Tabs Description CSS */ .px_team_list_tabs .et_pb_tabs_controls li{border:none;} .px_team_list_tabs .et_pb_tab_content li{margin-bottom: 10px;} .px_team_list_tabs .et_pb_tab_content li:before{content: '\52';font-family: ETmodules;margin-right: 10px;color: var(--px-color-1);font-size: 20px;font-weight: 600;} .px_team_list_tabs .et_pb_tab_content ul{list-style: none !important;padding: 0;} .px_team_list_tabs .et_pb_tab_content .form-control{ border-radius: 0.25rem !important; height: 50px; border: 1px solid #cccccc; padding: 10px 20px; font-size: 15px; font-weight: 400; color: #888; transition: all 0.3s ease-in-out; background: #fff; margin-bottom: 20px; margin-right: 20px; width: 48%; } .px_team_list_tabs .et_pb_tab_content .form-control.email{margin-right: 0px !important;} .px_team_list_tabs .et_pb_tab_content textarea.form-control{width: 100%;height: 100px;} /* Team List Tabs Button CSS */ .px_team_list_tabs .et_pb_tab_content .btn{ position: relative; padding-top: 15px; padding-right: 50px; padding-bottom: 15px; padding-left: 40px; border-width: 0px; border-radius: 30px; font-size: 15px; font-weight: 600; text-transform: uppercase; background: var(--px-color-1); color: #ffff; transition: all 0.4s ease-in-out; overflow: hidden; } .px_team_list_tabs .et_pb_tab_content .btn:hover{background: var(--px-color-2);} /* Responsive CSS */ @media only screen and (max-width: 990px){ .px_team_list .et_pb_image_wrap{width:100% !important;} .px_team_list .et_pb_image_wrap img{width:100% !important;} } @media only screen and (max-width: 768px){ .px_team_list_tabs .et_pb_tab_content .form-control{width: 100%;} .px_team_list_tabs .et_pb_tabs_controls li a{font-size: 12px;} .px_team_list_tabs .et_pb_tabs_controls li a{padding: 4px 20px;} } /* ----------------------------------- 10. Counter Section CSS -------------------------------------*/ .px_counter .px_counter_icon .et-pb-icon {box-shadow: rgba(255,255,255,0.5) 0px 5px 15px;transition: all 300ms ease;width: 100px;height: 100px;line-height: 100px;background: var(--px-color-1);border-radius: 50%;} .px_counter .px_counter_icon .et-pb-icon:hover {transform: rotateY(360deg);} .px_counter .px_counter_content .percent{margin-bottom: 0 !important;} /* ----------------------------------- 11. Experience Section CSS -------------------------------------*/ .px_experience_sec {box-shadow: rgb(99 99 99 / 20%) 0px 2px 8px 0px;-webkit-transition: all .4s ease-in-out;transition: all .4s ease-in-out;} .px_experience_sec:hover {box-shadow:var(--px-color-1) 0px 2px 8px 0px;} .px_exp_bar .et_pb_counter_container{height: 8px;background: #E6E7E8;margin-top: 10px;border-radius: 0px;position: static!important;} .px_exp_bar .et_pb_counter_container .et_pb_counter_amount_number{color: var(--px-color-1);} /*experience Counter CSS*/ .px_exp_bar .et_pb_counter_amount{height: 8px;background: var(--px-color-1)!important;transition: 3.5s;} .px_exp_bar .et_pb_counter_amount.overlay {background:transparent !important;} .px_exp_counter{border-color: var(--px-color-1);box-shadow: 0 30px 50px rgb(0 0 0 / 5%);background: #F5F5F5;} .px_exp_counter .percent{margin-bottom: 0!important} .px_exp_counter .title{color: var(--px-color-2)!important;} /* .px_experience {margin-top: -170px;box-shadow: rgb(99 99 99 / 20%) 0px 2px 8px 0px;-webkit-transition: all .4s ease-in-out;transition: all .4s ease-in-out;} .px_experience:hover {box-shadow:var(--px-color-1) 0px 2px 8px 0px;} .px_exp_bar .et_pb_counter_container{height: 8px;background: #E6E7E8;margin-top: 10px;border-radius: 0px;} .px_exp_bar .et_pb_counter_container {position: static!important;} .px_exp_bar .et_pb_counter_container .et_pb_counter_amount_number{color: var(--px-color-1);} /*experience Counter CSS*/ /* .px_exp_bar .et_pb_counter_amount{height: 8px;background: var(--px-color-1) !important;transition: 3.5s;} .px_exp_bar {border-color: var(--px-color-1);box-shadow: 0 30px 50px rgb(0 0 0 / 5%);background: #F5F5F5;} .px_exp_bar .percent{margin-bottom: 0!important} .px_exp_bar .title{color: var(--px-color-2)!important;} */ /* Responsive Css */ @media only screen and (max-width: 767px){ .px_counter .px_counter_content .percent{} } @media only screen and (max-width: 480px) { .px_experience .px_e_counter{top: 73%!important;} } /* ----------------------------------- 12. Choose Us Section CSS -------------------------------------*/ /*Choose Us Image CSS*/ .px_choose_image2{left: -15%;} .px_choose_content .et_pb_image_wrap{position: absolute;top: 25%;} .px_choose_content .et_pb_image_wrap .et-pb-icon{ color: var(--px-color-1)!important; background: #F5F5F5; border-radius: 50%; width: 80px; height: 80px; line-height: 80px; position: absolute; text-align: center; left: -35px; top: -15px; } .px_choose_content .et_pb_blurb_container{padding-left: 30px!important;} /* ----------------------------------- 13. Testimonial Section CSS -------------------------------------*/ .px_testimonial{background-color: #F5F5F5!important;-webkit-transition: all .4s ease-in-out;transition: all .4s ease-in-out;border-radius: 15px 15px 15px 0px;} .px_testimonial:hover {transform: translateY(10px);box-shadow: var(--px-color-1) 0px 5px 15px;} .px_testimonial:before{content: "\7b";left: 85%;position: absolute;top: 9%;font-size: 50px;font-weight: 800;color: var(--px-color-1);background: #F5F5F5!important;-webkit-transition: all .4s ease-in-out;transition: all .4s ease-in-out;} .px_testimonial:hover:before {box-shadow: var(--px-color-1) 0px 5px 15px;} .px_testimonial:after{position: absolute; content: '';bottom: -20px;left: 0px;visibility: visible!important;border-left: 30px solid #f5f5f5;border-top: 0px solid transparent;border-bottom: 20px solid transparent;} .px_testimonial .et_pb_testimonial_portrait{position: absolute;top: 100%;left: 0;margin-top: 30px;width: 75px;height: 75px;box-shadow: var(--px-color-2) 0px 5px 15px;-webkit-transition: all .4s ease-in-out;transition: all .4s ease-in-out;} .px_testimonial:hover .et_pb_testimonial_portrait{transform:translateY(-60px);z-index: 99999;box-shadow: var(--px-color-1) 0px 5px 15px;} /* Testimonial Description CSS */ .px_testimonial .et_pb_testimonial_description_inner{position: relative;padding-top: 90px;} .px_testimonial .et_pb_testimonial_author{position: absolute;top: 0px;margin: 0;color: var(--px-color-2);} .px_testimonial .et_pb_testimonial_meta{margin-top: 20px;position: absolute;top: 20px;padding-bottom: 15px;border-bottom: 1px solid #E6E7E8;width: 100%;} /* ----------------------------------- Testimonial Section CSS Version 2 -------------------------------------*/ .px_h2_testimonial .et_pb_testimonial_description_inner:before {content: '\e033\e033\e033\e033\e033';font-family: ETmodules!important;color: var(--px-color-1);font-size: 26px;} .px_tes_item .et_pb_testimonial_author{margin: 0 !important;} .px_tes_item .et_pb_testimonial_meta{margin-top: 5px;} .px_tes_item .et_pb_testimonial_portrait:before{box-shadow: var(--px-color-1) 0px 0px 18px 0px;} .px_tes_item .et_pb_testimonial_portrait:hover{transform: rotateY(360deg);transition: all 0.5s ease;} .px_testimonials:hover{transition: all .4s ease-in-out;transform: translateY(-10px);box-shadow: var(--px-color-1) 0px 5px 15px;} /* ----------------------------------- Testimonial Section CSS Version 3 -------------------------------------*/ .px_h3_testimonial .et_pb_testimonial_description{margin-left: 10px !important;} /* Testimonials List View CSS */ .px_testimonial_img{width:35% !important;} .px_testimonial_img .et_pb_image_wrap{height:100%;width:100%;} .px_testimonial_img .et_pb_image_wrap img{border-radius:15px;width:100% !important;} .px_testimonial_description .et_pb_testimonial_content blockquote, q{quotes: initial !important;} .px_testimonial_description .et_pb_testimonial_content blockquote, q:before{content: open-quote;font-size: 35px;} .px_testimonial_description .et_pb_testimonial_content blockquote, q:after{content: close-quote;font-size: 35px;} .px_testimonial_content .et_pb_module_header{color:var(--px-color-2);padding:0 !important;} .px_testimonial_content .et-pb-icon{color:var(--px-color-1) !important;animation:none!important;} /* ----------------------------------- Testimonial Slider CSS -------------------------------------*/ .px_testi_slider .slick-track,.px_testi_slider_v2 .slick-track{padding: 40px 0;} .px_testi_slider .px_testimonial .et_pb_testimonial_description{margin-left:0px !important;} .px_testi_slider .slick-list{padding-top:30px;} .px_testi_slider_v2 .slick-list{padding-top:30px;} .px_testi_slider_v2 .et_pb_testimonial_description{margin-left:30px !important} @media only screen and (max-width: 990px){ /* .px_testi_slider_v2 .px_testimonial{margin-bottom:160px !important;} */ } @media only screen and (max-width: 767px){ .px_testi_slider .px_testimonial{padding-top:30px;} .px_testi_slider .slick-list{padding-bottom:30px;} .px_testi_slider_v2 .px_testimonial{padding-top:30px;} .px_testi_slider_v2 .slick-list{padding-bottom:30px;} } /* ----------------------------------- 14. Management Section CSS -------------------------------------*/ .px_management_contact{box-shadow: var(--px-color-1) 0px 5px 15px;transition: all 300ms ease;} .px_management_contact:hover{box-shadow: rgba(255,255,255,0.5) 0px 5px 15px;} .px_management_contact .et_pb_blurb_container{position: absolute;top: 65px;left: 5px;transform: translate(50px, 50px);} /* Managements Icon CSS */ .px_management .px_management_contact .et_pb_image_wrap .et-pb-icon{ font-size: 35px; color: #ffff; width: 100px; height: 100px; line-height: 100px; background: var(--px-color-1); position: absolute; border-radius: 50%; top: -25px; left: 90px; transition: all 300ms ease; box-shadow: rgba(255,255,255,0.5) 0px 5px 15px; } .px_management_contact .et_pb_image_wrap .et-pb-icon:hover{transform: rotateY(360deg);} /* Managements Button CSS */ .px_management .px_s_info:hover{color: var(--px-color-1);} .px_management .px_s_info:hover::before{background-color: #fff} /* Responsive CSS */ @media only screen and (max-width: 767px){ .px_management .px_management_contact .et_pb_image_wrap .et-pb-icon{left: 55px;} .px_management_contact .et_pb_blurb_container{left:-5px;} } /* ----------------------------------- 15. Blog Section CSS -------------------------------------*/ /* Blog Image CSS*/ .px_blog_v1 .et_pb_post {border:none !important; -webkit-transition: all .4s ease-in-out;transition: all .4s ease-in-out;border-radius: 15px;box-shadow: 0 30px 50px rgb(0 0 0 / 5%);} .px_blog_v1 .et_pb_post:hover {box-shadow: var(--px-color-1) 0px 5px 15px;} .px_blog_v1 .entry-featured-image-url{margin-bottom:0;z-index:0;} .px_blog_v1 .entry-featured-image-url:before{position: absolute;top: 0;left: -75%;z-index: 2;display: block;content: '';width: 40%;height: 100%;transform: skewX(-25deg);background: rgba(255, 255, 255, 0.246);} .px_blog_v1 .et_pb_post:hover .entry-featured-image-url:before{animation: animation 0.95s;transition: 0.5s;} .px_blog_v1 .entry-featured-image-url img{transform: scale(1);overflow: hidden;filter: grayscale(1);} .px_blog_v1 .et_pb_post:hover .entry-featured-image-url img{filter: grayscale(0);transform: scale(1.1);transition: 0.5s;border-radius: 20px 0px 20px;} .px_blog_v1 .et_pb_image_container .entry-featured-image-url{margin-bottom: 0!important;} /* Blog Container CSS*/ .px_blog_v1 .et_pb_image_container{overflow: hidden;border-radius: 20px 0px 20px;} .px_blog_v1 .et_pb_image_container{margin-bottom: 45px;} /* Blog Published CSS */ .px_blog_v1 .post-meta .published{border-radius: 10px;position: absolute;transform: translate(25px, -102px);color: #fff;margin-left: -110px;background: var(--px-color-1);padding: 2px 15px;text-transform: uppercase;} .px_blog_v1 .post-meta .published:before{content: '\e025';margin-right: 15px;font-family: ETmodules!important;} .px_blog_v1 .post-meta .published:after{position: absolute;content: '';right: -15px;top: 8px;border-left: 17px solid var(--px-color-1);border-top: 7px solid transparent;border-bottom: 7px solid transparent;} /* Blog Author CSS */ .px_blog_v1 .post-meta .author:before{content: '\e08a';margin-right: 10px;font-family: ETmodules!important;color: var(--px-color-1);font-size: 18px;} .px_blog_v1 .post-meta .author{margin-right: 10px;} .px_blog_v1 .post-meta a:before{content: '\e0df';margin-right: 10px;font-family: ETmodules!important;color: var(--px-color-1);font-size: 18px;} .px_blog_v1 .post-meta .author a:before{display: none;} .px_blog_v1 .post-meta{padding-bottom: 20px!important;border-bottom: 1px solid #E6E7E8;} /* Blog Content CSS */ .px_blog_v1 .post-content{margin-top: 15px;} .px_blog_v1 .post-content .more-link{color: var(--px-color-1);position: relative;} .px_blog_v1 .post-content .more-link::before{position: absolute;content: ' ';width: 50px;height: 2px;background: var(--px-color-1);bottom: -5px;transition: all 0.3s ease-in-out;} /* Blog Pagination CSS */ .px_blog_v1 .pagination a{color: #fff;background: var(--px-color-1);display: block;line-height: 50px;padding: 0 20px;font-weight: 600;border-radius: 30px;transition: all 0.3s ease-in-out;} .px_blog_v1 .pagination a:hover{background: var(--px-color-2);color: #fff;} /* ----------------------------------- Blog Standard CSS -------------------------------------*/ .px_blog_v1.list .et_pb_post{padding-bottom: 40px;} /* Blog Standard Image Section CSS*/ .px_blog_v1.list .et_pb_post:hover .entry-featured-image-url img{transform: scale(1);} .px_blog_v1.list .et_pb_post .entry-featured-image-url img{border-radius: 20px 0px 20px;} /* Blog Standard Description CSS*/ .px_blog_v1.list .entry-title{margin-left: 20px;margin-bottom: 10px;} .px_blog_v1.list .post-meta .published{position: relative;margin-left: 0 !important;margin-right: 20px;} .px_blog_v1.list .post-meta .published:after{right: -14px;top: 5px;} .px_blog_v1.list .post-meta{margin-left: 20px;margin-right: 20px;} .px_blog_v1.list .post-content{margin-left: 20px;} .px_blog_v1 .post-content .more-link{margin-top: 10px;} /* Blog Standard Search CSS */ .px_bd_search .et_pb_searchsubmit{color: #fff !important;width: 90px;height: 60px;background: var(--px-color-1) !important;} .px_bd_search{padding: 40px 30px;} /* Blog Standard List CSS*/ .px_bd_list .et_pb_text_inner h4{color: var(--px-color-2);margin-bottom: 30px;position: relative;} .px_bd_list .et_pb_text_inner h4:before{position: absolute;content: '';width: 30px;height: 4px;bottom: -5px;left: 0;background: var(--px-color-1);} .px_bd_list .et_pb_text_inner ul{list-style: none;margin: 0;padding: 0;} .px_bd_list .et_pb_text_inner ul li{margin-bottom: 15px;} .px_bd_list .et_pb_text_inner ul li a{display: inline-block;background: #ffff;width: 100%;line-height: 50px;padding-left: 15px;color: var(--px-color-2);transition: all 0.3s ease-in-out;} /* Responsive Css */ @media only screen and (max-width: 767px){ .px_blog_v1.list .post-meta .published{display: none;} } @media only screen and (max-width: 480px){ .px_blog_v1 .post-meta .published{transform: translate(20px, -80px);} .px_blog_v1 .et_pb_image_container{margin-bottom: 35px;} } /* ----------------------------------- Blog Column 2 CSS -------------------------------------*/ .px_blog_2 .et_pb_ajax_pagination_container{display: grid;grid-gap: 30px;grid-template-columns: repeat(2, 50%);} .px_blog_2 .et_pb_post{overflow:hidden} .px_blog_2 .info{z-index: 4;position: relative;background: #fff;padding: 40px 20px;width:100%;} .px_blog_2 .entry-featured-image-url{margin-bottom:0px !important;} .px_blog_2 .post-meta .published {transform: translate(25px, -90px);} .px_blog_2 .et_pb_post{margin-bottom:0px !important;} /* Responsive CSS */ @media only screen and (max-width: 767px){ .px_blog_2 .et_pb_ajax_pagination_container{grid-template-columns: repeat(1, 100%);} .px_blog_2 .entry-title{margin-bottom:20px;} } /* ----------------------------------- Blog List Left Image CSS -------------------------------------*/ .px_blog_list_left .entry-featured-image-url{margin-bottom: 0;width: 50%;float: left;overflow: hidden;border-radius: 15px 0px 0px 15px;} .px_blog_list_left .et_pb_post .info{width: 50%;float: left;padding: 30px 20px;} .px_blog_list_left .post-meta .published {position: relative !important;transform: translate(0, 0)!important;margin-left: 0 !important;margin-right: 20px;} .px_blog_list_left .et_pb_post{padding:0px;} .px_blog_list_left .post-meta .published:after{right: -14px !important;top: 3px !important;} /* Responsive CSS */ @media only screen and (max-width: 767px){ .px_blog_list_left .entry-featured-image-url{width:100%;} .px_blog_list_left .et_pb_post .info{padding-left:0px !important;width:100%;} .px_blog_list_left .et_pb_post .info .entry-title{margin-bottom:15px;} .px_blog_list_right .entry-featured-image-url{width:100%;} } /* ----------------------------------- Blog List Right Image CSS -------------------------------------*/ .px_blog_list_right .entry-featured-image-url{margin-bottom: 0;width: 50%;float: right;overflow: hidden;border-radius: 0px 15px 15px 0px;} .px_blog_list_right .et_pb_post .info{width: 50%;float: right;padding: 30px 20px;} /* Responsive CSS */ @media only screen and (max-width: 767px){ .px_blog_list_right .entry-featured-image-url{width:100% !important;} .px_blog_list_right .et_pb_post .info{padding-left:0px !important;width:100%;} } /* ----------------------------------- Blog Full Width CSS -------------------------------------*/ .px_blog_v1.px_blog_fw .et_pb_post{overflow:hidden;} .px_blog_v1.px_blog_fw .info{padding: 30px 50px 50px;} .px_blog_v1.px_blog_fw .post-meta .published{position:static !important;margin-left:0px !important;} .px_blog_v1.px_blog_fw .et_pb_post .entry-featured-image-url{margin-bottom:0px !important;} .px_blog_v1.px_blog_fw .et_pb_post:hover .entry-featured-image-url img{transform: scale(1) !important;} .px_blog_v1.px_blog_fw .info .entry-title{margin-bottom:15px;} /* Responsive CSS */ @media only screen and (max-width: 767px){ .px_blog_v1.px_blog_fw .info{padding: 30px 25px 30px;} } /* ----------------------------------- Blog Sidebar CSS -------------------------------------*/ .px_blog_v1.px_blog_list_left.px_blog_list_sidebar .et_pb_post , .px_blog_v1.px_blog_list_right.px_blog_list_sidebar .et_pb_post {padding:0px;} .px_blog_v1.px_blog_list_right.px_blog_list_sidebar .et_pb_post .info, .px_blog_v1.px_blog_list_left.px_blog_list_sidebar .et_pb_post .info{padding:15px !important;} /* ----------------------------------- Blog Category CSS -------------------------------------*/ .px_blog_v1.px_blog_cat .et_pb_image_container{margin-bottom:25px;} /* ----------------------------------- Blog Slider CSS -------------------------------------*/ .px_blog_slider .slick-track{padding: 55px 0;} .px_blog_slider .px_blog_v1 .et_pb_post{overflow:hidden;} .px_blog_slider .et_pb_ajax_pagination_container .info{padding:20px 30px 30px;background:#fff;z-index:3;} .px_blog_slider .et_pb_ajax_pagination_container .et_pb_post{margin: 10px; overflow: hidden;} .px_blog_slider .post-meta .published{transform: translate(25px, -73px);} .px_blog_slider .entry-featured-image-url{z-index:-1;} /* ----------------------------------- Home 2 Blog Tiles Section CSS -------------------------------------*/ /* Blog Style 5 CSS */ .px_posttiles_style5 .et_pb_ajax_pagination_container{grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_posttiles_style5 .et_pb_post:nth-child(2){grid-row-end: span 2;} .px_posttiles_style5.px_blog_2 .et_pb_post:nth-child(2) .entry-featured-image-url{height: 83%;} .px_posttiles_style5.px_blog_2 .et_pb_post:nth-child(2) .entry-featured-image-url img{height: 100%;object-fit: cover;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_posttiles_style5 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);} .px_posttiles_style5 .et_pb_post:nth-child(2){grid-row-end: span 1;} .px_posttiles_style5.px_blog_2 .et_pb_post:nth-child(2) .entry-featured-image-url{height:auto;} } @media only screen and (max-width: 767px){ .px_posttiles_style5 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} } /* ----------------------------------- Blog Tiles Section CSS -------------------------------------*/ .px_blog_2.px_bblog_3 .post-meta .published{position: absolute;transform: translate(0px, 0px);margin-left: 0;top:-15px;} .px_blog_2.px_bblog_3 .info{padding: 20px 20px 0;} /* Blog Style 1 CSS */ .px_posttiles_style1 .et_pb_ajax_pagination_container{grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_posttiles_style1 .et_pb_post{margin-bottom: 0px !important;} .px_posttiles_style1 .entry-featured-image-url{margin-bottom: 0px !important;overflow: hidden;} .px_posttiles_style1 .entry-featured-image-url img{transition: transform 0.3s ease;filter: brightness(0.6);transform: scale(1);} .px_posttiles_style1 .entry-featured-image-url:hover img{transform: scale(1.1);} .px_posttiles_style1 .et_pb_post:nth-child(1){grid-column: span 2;grid-row: span 2;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_posttiles_style1 .et_pb_ajax_pagination_container{grid-template-columns: repeat(2, 1fr);} .px_posttiles_style1 .et_pb_post:nth-child(1){grid-column: unset;grid-row: unset;} } @media only screen and (max-width: 767px){ .px_posttiles_style1 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} } /* Blog Style 2 CSS */ .px_posttiles_style2 .et_pb_ajax_pagination_container{display: grid;grid-template-columns: repeat(3, 1fr);grid-column-gap: 10px;grid-row-gap: 10px;} .px_posttiles_style2 .et_pb_ajax_pagination_container .et_pb_post{position: relative;display: flex;align-items: flex-end;min-height: 245px;} .px_posttiles_style2 .et_pb_ajax_pagination_container .et_pb_post:nth-child(4n+1), .px_posttiles_style2 .et_pb_ajax_pagination_container .et_pb_post:nth-child(4n){grid-column-end: span 2;} .px_posttiles_style2 .et_pb_post{margin-bottom: 0px !important;} .px_posttiles_style2 .entry-featured-image-url{margin-bottom: 0px !important;overflow: hidden;} .px_posttiles_style2 .entry-featured-image-url img{transition: transform 0.3s ease;filter: brightness(0.6);transform: scale(1);height: 300px;} .px_posttiles_style2 .entry-featured-image-url:hover img{transform: scale(1.1);} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_posttiles_style2 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);} .px_posttiles_style2 .et_pb_ajax_pagination_container .et_pb_post:nth-child(4n+1), .px_posttiles_style2 .et_pb_ajax_pagination_container .et_pb_post:nth-child(4n){grid-column-end: unset;} } @media only screen and (max-width: 767px){ .px_posttiles_style2 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} } /* Blog Style 3 CSS */ .px_posttiles_style3 .et_pb_ajax_pagination_container {grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 0px;grid-row-gap: 0px;} .px_posttiles_style3 .et_pb_post {margin-bottom: 0px !important;display: flex;align-items: flex-end;min-height: 260px;} .px_posttiles_style3 .et_pb_post:nth-child(3) {grid-row-end: span 2;} .px_posttiles_style3 .entry-featured-image-url img{transition: transform 0.3s ease;filter: brightness(0.6);transform: scale(1); height: 100%;object-fit: cover;} .px_posttiles_style3 .entry-featured-image-url:hover img{transform: scale(1.1);} .px_posttiles_style3 .entry-featured-image-url {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} .px_posttiles_style3 .pagination a{margin-top: 20px;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_posttiles_style3 .et_pb_post:nth-child(3) {grid-row-end: unset;} .px_posttiles_style3 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);} .px_posttiles_style3 .alignleft{float: right;} } @media only screen and (max-width: 767px){ .px_posttiles_style3 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} .px_posttiles_style3 .alignleft{float: left;} } /* Blog Style 4 CSS */ .px_posttiles_style4 .et_pb_ajax_pagination_container {grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_posttiles_style4 .et_pb_post:nth-child(1) {grid-row-end: span 2;} .px_posttiles_style4 .et_pb_post{margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} .px_posttiles_style4 .entry-featured-image-url img{transition: transform 0.3s ease;filter: brightness(0.6);transform: scale(1); height: 100%;object-fit: cover;} .px_posttiles_style4 .entry-featured-image-url:hover img{transform: scale(1.1);} .px_posttiles_style4 .entry-featured-image-url {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_posttiles_style4 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);} .px_posttiles_style4 .et_pb_post:nth-child(1) {grid-row-end: unset;} .px_posttiles_style4 .alignleft{float: right;} } @media only screen and (max-width: 767px){ .px_posttiles_style4 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} .px_posttiles_style4 .alignleft{float: left;} } /* Blog Style 6 CSS */ .px_posttiles_style6 .et_pb_ajax_pagination_container {grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_posttiles_style6 .et_pb_post {margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} .px_posttiles_style6 .et_pb_post .entry-featured-image-url {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} .px_posttiles_style6 .et_pb_post:nth-child(2n+5):nth-child(3n+2) {grid-column-end: span 2;} .px_posttiles_style6 .et_pb_post:nth-child(5n+2):nth-child(2n+3) {grid-row-end: span 2;} .px_posttiles_style6 .et_pb_post .entry-featured-image-url {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} .px_posttiles_style6 .entry-featured-image-url img{transition: all 0.3s;filter: brightness(0.6);height: 100%!important;object-fit: cover;} .px_posttiles_style6 .et_pb_post:hover .entry-featured-image-url img{filter: brightness(1);} .px_posttiles_style6 .et_pb_post{margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_posttiles_style6 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);} .px_posttiles_style6 .et_pb_post:nth-child(2n+5):nth-child(3n+2) {grid-column-end: unset;} .px_posttiles_style6 .et_pb_post:nth-child(5n+2):nth-child(2n+3) {grid-row-end: unset;} } @media only screen and (max-width: 767px){ .px_posttiles_style6 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} } /* Blog Style 7 CSS */ .px_posttiles_style7 .et_pb_ajax_pagination_container {grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_posttiles_style7 .et_pb_post {margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} .px_posttiles_style7 .et_pb_post:nth-child(5) {grid-column: span 2;grid-row: span 2;} .px_posttiles_style7 .et_pb_post{margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} .px_posttiles_style7 .et_pb_post .entry-featured-image-url {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} .px_posttiles_style7 .entry-featured-image-url img {transition: transform 0.3s ease;filter: brightness(0.6);height: 100%!important;object-fit: cover;} .px_posttiles_style7 .et_pb_post:hover .entry-featured-image-url img {transform: scale(1.2) rotate(5deg);} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_posttiles_style7 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);} .px_posttiles_style7 .et_pb_post:nth-child(5) {grid-column: unset;grid-row: unset;} } @media only screen and (max-width: 767px){ .px_posttiles_style7 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} } /* Blog Style 8 CSS */ .px_posttiles_style8 .et_pb_post {margin-bottom: 0;} .px_posttiles_style8 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_posttiles_style8 .et_pb_post:nth-child(6n+1), .px_posttiles_style8 .et_pb_post:nth-child(6n+5) {grid-row-end: span 2;} .px_posttiles_style8 .et_pb_post .entry-featured-image-url {margin-bottom: 0;overflow: hidden;height: 100%} .px_posttiles_style8 .et_pb_post:hover .entry-featured-image-url img {filter: brightness(1);} .px_posttiles_style8 .entry-featured-image-url img {transition: all 0.3s;filter: brightness(0.6);height: 260px;object-fit: cover;} .px_posttiles_style8 .et_pb_post:nth-child(6n+1) img, .px_posttiles_style8 .et_pb_post:nth-child(6n+5) img {height: 100%;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_posttiles_style8 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);} .px_posttiles_style8 .et_pb_post:nth-child(6n+1), .px_posttiles_style8 .et_pb_post:nth-child(6n+5) {grid-row-end: unset;} } @media only screen and (max-width: 767px){ .px_posttiles_style8 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} } /* Blog Style 9 CSS */ .px_posttiles_style9 .et_pb_ajax_pagination_container {grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_posttiles_style9 .et_pb_post {margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} .px_posttiles_style9 .et_pb_post .entry-featured-image-url {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} .px_posttiles_style9 .entry-featured-image-url img{transition: all 0.3s;filter: brightness(0.6);height: 100%!important;object-fit: cover;} .px_posttiles_style9 .et_pb_post:hover .entry-featured-image-url img {filter: brightness(1);} .px_posttiles_style9 .et_pb_post:nth-child(5) {grid-row: span 1;grid-column: span 2;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_posttiles_style9 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);} .px_posttiles_style9 .et_pb_post:nth-child(5n) {grid-row: unset;grid-column: unset;} } @media only screen and (max-width: 767px){ .px_posttiles_style9 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} } /* Blog Style 10 CSS */ .px_posttiles_style10 .et_pb_ajax_pagination_container {grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_posttiles_style10 .et_pb_post {margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} .px_posttiles_style10 .et_pb_post .entry-featured-image-url {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} .px_posttiles_style10 .entry-featured-image-url img {transition: all 0.3s;filter: grayscale(100%);height: 100%!important;object-fit: cover;} .px_posttiles_style10 .et_pb_post:hover .entry-featured-image-url img {filter: grayscale(0);} .px_posttiles_style10 .et_pb_post:nth-child(3n+2) {grid-row-end: span 2;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_posttiles_style10 .et_pb_ajax_pagination_container {grid-template-columns: repeat(2, 1fr);} .px_posttiles_style10 .et_pb_post:nth-child(3n+2) {grid-row-end: unset;} } @media only screen and (max-width: 767px){ .px_posttiles_style10 .et_pb_ajax_pagination_container {grid-template-columns: repeat(1, 1fr);} } /* ----------------------------------- 16. Solution Section CSS -------------------------------------*/ .px_solution{border-radius: 80px;} .px_solution .px_s_info{background: var(--px-color-2);} .px_solution .px_s_info:hover{color: var(--px-color-1);} .px_solution .px_s_info:hover:before{background: #fff;} /* ----------------------------------- 17. Pricing Section CSS -------------------------------------*/ /*Pricing Toggle*/ .px_pricing_tabs [id*="px_pricing_tab_"] {text-align:center;background: rgba(255,255,255,0.5) !important;color: #09144a !important;box-shadow:none;} .px_pricing_tabs [id*="px_pricing_tab_"]:hover, .px_pricing_tabs [id*="px_pricing_tab_"].px_active{ background: var(--px-color-1) !important; color: #fff !important; } /*Pricing Row Settings */ [class*="px_pricing_tab_content_"] {opacity:0;-webkit-transform:scale(.7);-ms-transform:scale(.7);transform:scale(.7);-webkit-transition:opacity .4s ease,-webkit-transform .4s ease;-o-transition:opacity .4s ease,transform .4s ease;transition:opacity .4s ease,transform .4s ease;visibility:hidden;display:none !important; } [class*="px_pricing_tab_content_"].px_active{opacity:1;-webkit-transform:scale(.9);-ms-transform:scale(.9);transform:scale(.9);-webkit-transition:opacity 1s ease,-webkit-transform 1s ease;-o-transition:opacity 1s ease,transform 1s ease;transition:opacity 1s ease,transform 1s ease;visibility:visible;display:block !important;} [class*="px_pricing_tab_content_"].animated{-webkit-animation-duration:1.5s;animation-duration:1.5s} /*Pricing Row Main Contents CSS */ .px_pricing .et_pb_pricing_heading{background-color: transparent!important;} .px_pricing .et_pb_pricing li{padding: 0 0 0.6em 14px!important;} .px_pricing .et_pb_pricing_content .et_pb_pricing li span{position: relative;} .px_pricing .et_pb_pricing li:after{content: '\4e'; font-family: ETmodules!important;position: absolute;font-size: 15px;top: 0;right: 60px;width: 12px;} .px_pricing .et_pb_pricing_content_top .et_pb_sum{color: var(--px-color-2);} .px_pricing.active .et_pb_pricing_content_top .et_pb_sum{color: var(--px-color-1);} /*Pricing Row Buttons CSS */ .px_pricing_item .et_pb_button_module_wrapper{width: 60%;} .px_pricing_item .px_s_info{color: var(--px-color-2);background: transparent;border: 1px solid var(--px-color-2);box-shadow: none;} .px_pricing_item .px_s_info.active{color: #fff;background: var(--px-color-1);border: 1px solid var(--px-color-1);} .px_pricing_item .px_s_info:hover{background-color: var(--px-color-2) !important;color: #fff;transition: 0.3s;} .px_pricing_item .px_s_info.active:hover{background-color: #fff !important;color: var(--px-color-1);transition: 0.3s;} /* ----------------------------------- Pricing Table Layots CSS -------------------------------------*/ /* Pricing Table Layots Version 1 CSS */ .px_pricing_info .et_pb_text_inner h3 sup{font-size:25px;bottom:1.8em !important;} .px_pricing_list{width:100%;} .px_pricing_list:before{left: 60px;} .px_pricing_info:before { position: absolute; top: 0; left: -75%; z-index: 2; display: block; content: ''; width: 40%; height: 100%; transform: skewX(-25deg); background: rgba(255, 255, 255, 0.246); } .px_pricing_table:hover .px_pricing_info:before{animation: animation 0.95s;transition: 0.5s;} .px_pricing_list.disable{color:#ccc !important;} .px_pricing_information .et_pb_text_inner h3 sup{font-size:20px;bottom:1.8em !important;} .px_pricing_v1 .px_pricing_list:before{left: 35px !important;} /* Pricing Table Layots Version 2 CSS */ .px_pricing_ino_v2 .et_pb_text_inner h3 sup {font-size: 18px;bottom: 1.3em !important;} .px_pricing_v2 .px_pricing_list:before {left: 30px;} .px_pricing_v2.list .px_s_info::before{background-color:#fff;} .px_pricing_v2.list .px_s_info:hover{color:var(--px-color-1);} /* Slider CSS */ .px_slider .px_pricing_table .et-last-child, .px_slider .px_pricing_table :last-child{margin-right: 10px!important;} /* Responsive CSS */ @media only screen and (max-width: 990px){ .px_pricing_v2 .et_pb_column{width:100% !important;margin-right:0px !important;} .px_pricing_v2 .px_pricing_list:before {left: 200px;} .px_pricing_tab_v2{display: grid;grid-template-columns: repeat(2,50%);} } @media only screen and (max-width: 767px){ .px_pricing_v2 .px_pricing_list:before {left: 80px;} } /* ----------------------------------- 18. CTA Section CSS -------------------------------------*/ .px_cta .px_s_info::before{background: var(--px-color-2) !important;} .px_cta .px_s_info{box-shadow: rgb(255 255 255 / 50%) 0px 5px 15px;} /* ----------------------------------- 19. Estimate Section CSS -------------------------------------*/ .px_estimate-info .et-pb-icon{color: var(--px-color-1) !important;} /* ----------------------------------- 20. Achievement Section CSS -------------------------------------*/ .px_achievement .percent{height: 25px;} .px_achievement .et_pb_icon_wrap .et-pb-icon{color: var(--px-color-1) !important;} .px_achievement .percent .percent-value{color: var(--px-color-2) !important;} /* ----------------------------------- 21. Contact Section CSS -------------------------------------*/ .px_form .et_contact_bottom_container{float: left !important;} /* ----------------------------------- Contact Us Section CSS Page 1 -------------------------------------*/ .px_contact_info .et_pb_module_header{padding: 0 !important;} .px_contact_form .et_contact_bottom_container{float: left !important;} .px_contact_form .et_contact_bottom_container .et_pb_button:hover{background: var(--px-color-2) !important;} /* Contact Us Social Links CSS */ .px_contact_social_links li a.icon:before{color: var(--px-color-2);background: #ffff;width: 45px;height: 45px;line-height: 45px;transition: all 0.3s ease-in-out;text-align: center;border-radius: 50%;} .px_contact_social_links li:hover a.icon:before{background: var(--px-color-1);} .px_contact_social_links li{margin-right: 20px;} /* Responsive CSS */ @media only screen and (max-width: 370px){ .px_contact_social_links li{margin-right: 10px;} } /* ----------------------------------- Contact Us Version 2 CSS -------------------------------------*/ .px_contact_info.px_contact_v2 .et-pb-icon{ background: #fff; width: 70px; height: 70px; text-align: center; line-height: 70px; border-radius: 50%; font-size:30px; box-shadow: 0px 2px 18px 0px rgb(0 0 0 / 30%); } .px_contact_v2_img:hover{box-shadow: var(--px-color-1) 0px 5px 15px;transform: translateY(-10px);transition: all 0.5s ease-in-out;} .px_contact_v2_img{height:100%;} .px_contact_v2_img .et_pb_image_wrap{height:100%;} .px_contact_v2_img .et_pb_image_wrap img{height:100% !important;object-fit:cover;} .px_contact_form_v2 .et_pb_button{background: var(--px-color-1);transition: all 0.5s ease-in-out;color:#fff;} .px_contact_form_v2 .et_pb_button:hover{background: #fff;color:var(--px-color-2);} .px_contact_form_v2 .et_contact_bottom_container{float:left !important;margin-top:0 !important;margin-left: 15px} /* Responsive CSS */ @media only screen and (max-width: 767px){ .px_contact_form_v2 .et_contact_bottom_container{margin-top:10px !important;margin-left: 0px} } /* ----------------------------------- 22. Consultung Section CSS -------------------------------------*/ .px_consulting_image:hover{transition: 0.5s; transform: translateY(-10px);box-shadow: var(--px-color-1) 0px 30px 60px -12px,var(--px-color-2) 0px 18px 36px -18px;} /* ----------------------------------- 23. Blog Details CSS -------------------------------------*/ /* Blog Details Post CSS */ .px_blog_post .et_pb_image_wrap img{border-radius:30px;} .px_blog_post .et_pb_title_container{padding: 30px 0;} .px_blog_post .entry-title{position: absolute;color: var(--px-color-2);bottom: -30%;left: 0;} .px_blog_post .published{background: var(--px-color-1);padding: 5px 15px;position: relative;color: #fff;border-radius: 30px;margin-right: 25px;margin-left: 10px;} .px_blog_post .published:after{position: absolute;content: '';right: -14px;top: 7px;border-left: 17px solid #FE8C12;border-top: 7px solid transparent;border-bottom: 7px solid transparent;} .px_blog_post .published:before{content: '\e025';font-family: ETmodules!important;margin-right: 10px;} .px_blog_post .author:before{content: '\e08a';font-family: ETmodules!important;margin-right: 10px;color: var(--px-color-1)} .px_blog_post .comments-number:before{content: '\76';font-family: ETmodules!important;margin-right: 10px;color: var(--px-color-1)} /* Blog Details Testimonial CSS */ .px_blog_testimonial .et_pb_testimonial_author:before{position: absolute;content: '';width: 30px;height: 3px;left: 0;top: 10px;background: var(--px-color-1);} /* Blog Details Tabs CSS */ .px_blog_tabs .et_pb_tabs_controls{background-color: #fff !important;} .px_blog_tabs .et_pb_tabs_controls:after{border:none !important;} .px_blog_tabs .et_pb_tabs_controls li{border: none !important;background: #F5F5F5;margin-right: 10px;border-radius: 3px;transition: all 0.5s ease-in-out;} .px_blog_tabs .et_pb_tabs_controls li:hover{background-color: var(--px-color-1);} .px_blog_tabs .et_pb_tabs_controls li a{color: var(--px-color-2) !important;transition: all 0.5s ease-in-out;} .px_blog_tabs .et_pb_tabs_controls li:hover a{color: #fff !important;} .px_blog_tabs .et_pb_tabs_controls .et_pb_tab_active a{color: #fff !important;background-color: var(--px-color-1);} /* Blog Details Comments CSS */ .px_blog_comment .comment-reply-title{color: var(--px-color-2);margin-bottom: 30px;padding: 0;} .px_blog_comment .logged-in-as{display: none;} .px_blog_comment .form-submit .et_pb_button{background: var(--px-color-1);color: #ffff;font-size: 16px;font-weight: 700;transition: all 0.4s ease-in-out;text-transform: uppercase;height: 60px;} .px_blog_comment .form-submit .et_pb_button:hover{background-color: var(--px-color-2);} .px_blog_comment .comment-reply-link{background: var(--px-color-1);margin: 20px;color: #ffff;border-radius: 3px !important;} .px_blog_comment .comment-reply-link:hover{background: var(--px-color-1);} .px_blog_comment .comment_avatar{position: static;float: left;margin-left: -70px;margin-right: 21px;} .px_blog_comment .comment_avatar img{border-radius:50%;} .px_blog_comment .comment-body{background: #F5F5F5;padding: 30px;margin-left: 40px;} .px_blog_comment .comment-edit-link{display: none;} .px_blog_comment .comment_date{color: #000;position: absolute;left: 9%;top: 38%;font-size: 14px;color: #FE8C12;font-weight: 500;} .px_blog_comment .comment_area{margin-top: 30px;} .px_blog_comment .fn{color: var(--px-color-2);text-transform: uppercase;} .px_blog_comment .comment-form-comment textarea{border-radius:5px;} /* Blog Details Sidebar CSS */ .px_blog_sidebar{border:none;padding: 0;} .px_blog_sidebar .widget_search{margin-bottom: 30px !important;} .px_blog_sidebar .wp-block-search__input{width: 100%;height: 60px !important;border: none;overflow: hidden;} .px_blog_sidebar .wp-block-search__inside-wrapper{background: #F5F5F5;padding: 40px 30px;} .px_blog_sidebar .wp-block-search__button{position: absolute;top: 40px;right: 30px;color: #ffff;width: 70px;height: 60px !important;line-height: 60px;background: var(--px-color-1);border-radius: 0 5px 5px 0;} .px_blog_sidebar .wp-block-group{background: #F5F5F5;padding: 40px 30px;} .px_blog_sidebar .wp-block-group h2{font-size: 20px;line-height: 30px;color: var(--px-color-2);font-weight: 800;margin-bottom: 30px;position: relative;} .px_blog_sidebar .wp-block-group h2:before{position: absolute;content: '';width: 30px;height: 4px;bottom: -5px;left: 0;background: #FE8C12;} /* Blog Details Sidebar List CSS */ .px_blog_sidebar .wp-block-latest-posts__list li{margin-bottom: 15px;} .px_blog_sidebar .wp-block-latest-posts__list li a{display: inline-block; background: #ffff; width: 100%; height: 50px; line-height: 50px; padding-left: 15px; text-transform: uppercase; color: var(--px-color-2); font-weight: 700; transition: all 0.3s ease-in-out;} .px_blog_sidebar .wp-block-latest-posts__list li a:hover{padding-left: 25px;color: var(--px-color-1);} .px_blog_sidebar .wp-block-latest-posts__list li a:before {content: '\24';position: absolute;font-family: ETmodules!important;left: 35px;opacity: 0;transition: 0.5s;} .px_blog_sidebar .wp-block-latest-posts__list li a:hover:before{opacity: 1;} /* Sidebar Category CSS */ .px_blog_sidebar .cat-item{margin-bottom: 15px;} .px_blog_sidebar .cat-item a{ display: inline-block; background: #ffff; width: 100%; height: 50px; line-height: 50px; padding-left: 15px; text-transform: uppercase; color: var(--px-color-2) !important; font-weight: 700; transition: all 0.3s ease-in-out; } .px_blog_sidebar .cat-item a:before{content: '\24';position: absolute;font-family: ETmodules!important;left: 35px;opacity: 0;transition: 0.5s;} .px_blog_sidebar .cat-item a:hover:before{opacity: 1;} .px_blog_sidebar .cat-item a:hover{padding-left: 25px;color: var(--px-color-1) !important;} /* Responsive CSS */ @media only screen and (max-width: 990px){ .px_blog_sidebar .et_pb_widget{width: 97.25%;float: none !important;max-width: 400px;margin: auto !important;margin-bottom:25px !important;} } /* ----------------------------------- Project Details Section CSS -------------------------------------*/ .px_blog_list:hover {background-color: transparent !important;} .px_blog_list{color: var(--px-color-2);} .px_blog_list:before{color: var(--px-color-1);margin-right: 10px;} /* ----------------------------------- 25. FAQ Section CSS -------------------------------------*/ .px_faq .et_pb_toggle_title:before{content:'\35' !important;color:var(--px-color-1) !important;font-size: 24px;font-weight: 600;} .px_faq .et_pb_toggle{border-radius: 7px;background-color: rgb(255, 255, 255);box-shadow: 0px 10px 60px 0px rgb(211 211 211);transition: all 500ms ease;border: none;} .px_faq .et_pb_toggle_open:before { position: absolute; top: 0; left: 0; bottom: 0; content: "" !important; width: 5px; height: 100%; background: var(--px-color-1); border-radius: 7px; transition: all 0.3s ease; display: block; visibility: visible; opacity: 1; } .px_faq .et_pb_toggle_open .et_pb_toggle_title:before { position: absolute; content:'\33' !important; display: block; visibility: visible; opacity: 1; position: absolute; right: 0; left:auto; font-size: 24px; color: var(--px-color-1) !important; top: 50%; margin-top: -0.5em; font-weight: 600; } /* ----------------------------------- 26. Search Page CSS -------------------------------------*/ .px_search .et_pb_searchsubmit{background:var(--px-color-1) !important;} /* ----------------------------------- 27. 404 Page CSS -------------------------------------*/ .px_404_title .et_pb_text_inner h2{color:var(--px-color-2);} .px_404_title .et_pb_text_inner span{color:var(--px-color-1);} /* ----------------------------------- 28. Coming Soon Page CSS -------------------------------------*/ .px_cs_image .et_pb_image_wrap img{max-width:50%;} .px_cs_timer_countdown .et_pb_countdown_timer_container{display:flex;justify-content:space-between;} .px_cs_timer_countdown .section p.label{font-size:16px;text-transform: uppercase;margin-top: 15px;} /* ----------------------------------- 29. Elements Page CSS -------------------------------------*/ .px_experience.px_elements{margin-top:0px !important;box-shadow:none !important;} .px_experience.px_elements:hover{box-shadow:none !important;} .px_element_icon .et_pb_icon_wrap:hover .et-pb-icon{transform: rotateY(360deg);transition:0.5s;} /* ----------------------------------- 29. Footer Section CSS -------------------------------------*/ .px_footer_title span{color: var(--px-color-1);margin-left:30px; position: relative;} .px_footer_title span::before {position: absolute;content: '';width:30px;height: 2px;left: -35px;top: 12px;background: var(--px-color-1);} .px_footer .px_f_about .px_f_info{padding-left: 1em!important;} .px_footer .px_f_content .px_f_content_info{padding: 0 0 !important; color: #E6E7E8;} .px_footer .px_f_content .px_f_content_info:hover{padding-left: 1em!important;} .px_footer .px_f_content .px_f_content_info:before{color: var(--px-color-1);} .px_email_optin.et_pb_newsletter .et_pb_newsletter_field {margin-bottom:0px!important; } .px_email_optin .et_pb_newsletter_form #et_pb_signup_email{border-radius: 30px;} .px_email_optin .et_pb_newsletter_form .et_pb_icon_wrap{border-radius: 30px !important;} .px_copyright{background: var(--px-color-2);display: table;margin: auto;position: relative;padding: 5px 10px;border-radius: 25px;} .px_email_optin .et_pb_newsletter_button.et_pb_button:after{position: absolute;width: 50px;height: 50px;top: -67px;line-height: 50px !important;right: 3px;border-radius: 0 30px 30px 0;background: var(--px-color-1);} .px_email_optin .et_pb_newsletter_button.et_pb_button:hover:after {background: var(--px-color-2);} .px_footer_newsletter .et_pb_main_blurb_image { background-color: var(--px-color-2); border-radius: 37% 37% 37% 37%/37% 37% 37% 37%; transform: rotate(45deg); display: flex; align-items: center; justify-content: center; } .px_footer_newsletter .et_pb_image_wrap .et-pb-icon {transform: rotate(-45deg);color:#fff;background:var(--px-color-2);} /* ----------------------------------- Footer Section CSS Version 2 -------------------------------------*/ .px_h2_footer .et_pb_button{color: #e2e2e2!important;} .px_newsletter .et_pb_newsletter_button_wrap{position: absolute;padding: 5px 25px 5px !important;border-radius: 30px;color: #ffffff !important;background: var(--px-color-1);top: 8px;right: 10px;line-height: 27px;font-size: 16px;transition: all 0.3s ease !important;} .px_newsletter .et_pb_newsletter_button_wrap:hover{background: var(--px-color-2);} .px_newsletter .et_pb_newsletter_button_wrap .et_pb_button:hover{background-color: transparent !important;} /* Footer Social Media CSS*/ .px_h2_footer .et_pb_social_media_follow .icon{margin-right: 20px;} .px_h2_footer .et_pb_social_media_follow .icon:before{background: var(--px-color-1);width: 37px!important;height: 37px!important;line-height: 37px!important;border-radius: 50%;} .px_h2_footer .et_pb_social_media_follow .icon:hover:before{background: #ffffff;color: var(--px-color-1);transition: 0.5s;box-shadow: var(--px-color-1) 0px 5px 15px;} .px_h2_footer .et_pb_button:hover{color: var(--px-color-1)!important;margin-left: 5px;transition: all 0.3s ease;background-color: transparent;} .px_h2_footer .et_pb_text_inner span:hover{color: var(--px-color-1);transition: 0.3s;} .px_h2_footer .et_pb_button_module_wrapper .et_pb_button{padding-left: 0 !important;} /* Footer Newsletter Button CSS */ .px_h2_footer .et_pb_newsletter_button:before{ position: absolute; content: '' !important; left: 66%; width: 100%; height: 0%; transform: translate(-50%, -50%) rotate(55deg); z-index: -1; transition: all 0.6s ease-in-out; display: block!important; background: var(--px-color-2); opacity: 1; } .px_h2_footer .et_pb_newsletter_button:hover:before{height: 380%;background: #fff;color: var(--px-color-1);z-index:1;} /* ----------------------------------- Footer Section CSS Version 3 -------------------------------------*/ .px_h3_footer .px_footer_title:after{content: "";width: 50px;height: 4px;background: var(--px-color-1);position: absolute;bottom: -10px;left: 0;transition: all .3s ease;} .px_footer_contact_info:before{margin-left: -30px !important;color: var(--px-color-1);} .px_footer_ser_info{color: #fff;} .px_footer_ser_info:hover{color: var(--px-color-1);} /* ----------------------------------- 30. Animation Section CSS -------------------------------------*/ @keyframes animation { 0% { left:10%; top:0; } 100% { left:100%; top:0%; } } /* Border Scale Animation */ @keyframes border { 0% { transform: scale(1); } 50% { transform: scale(1.2); opacity: 0.7; } 100% { transform: scale(1.3); opacity: 0.2; } } /* Up-Down Animation */ @keyframes up-down { 0% { transform: translateY(20px); } 50% { transform: translateY(-20px); } 100% { transform: translateY(0); } } /* Move Animation */ @keyframes mymove { 0% { transform: rotateY(-50deg); } 100% { transform: rotateY(50deg); } } /* Fade In Up */ @keyframes fadeInUp { 0% { opacity:0; transform:translateY(20px) } to { opacity:1; transform:translateY(0) } } .fadeInUp { -webkit-animation-name:fadeInUp; animation-name:fadeInUp } /* ----------------------------------- 31. Slide In CSS ----------------------------------- */ /* Show/hide the popup overlay wrapper when "is-visible" class changes, apply the CSS to frontend only */ body:not(.et-fb) .px-popup-wrapper .px-popup-content{ position:fixed; z-index:990; top:0; right:0; bottom:0; left:0; transition: all .5s cubic-bezier(.14,.06,.41,1.39); opacity:0; visibility:hidden; } body:not(.et-fb) .px-popup-wrapper.popup-is-visible .px-popup-content{ opacity:1; visibility:visible; } /* Allow the content inside the popup wrapper to scroll */ .px-popup-inside { height:100%; overflow-y: scroll; } /* Prevent Body from Scrolling when Popup is visible */ body.px-noscroll { overflow-y: scroll; } /* Center Align Popup Content inside the Section */ .px-popup-content { display:flex; flex-direction:column; justify-content: center; } .px-popup-content .et_pb_row { margin-top:0; margin-bottom:0; } /* Adjust the position of the popup overlay for admin bar */ @media (min-width:600px) and (max-width:782px) { body:not(.et-fb).admin-bar .px-popup-wrapper { top:46px; } } @media (min-width:783px) { body:not(.et-fb).admin-bar .px-popup-wrapper { top:32px; } } /* Mave the popup on top of other elements */ .et_builder_inner_content.popup-is-visible { z-index:99999; } /* Add a hand cursor to the close trigger element */ .px-popup-close { cursor:pointer; } /*Slide In Css Start Here*/ .px_slidein{overflow:visible !important;} .px_slidein:after{content: ""; position: absolute; bottom: 40px; left: 10px; width: calc(100% - 20px); height: 80%; background-color: var(--px-color-1); border-radius: inherit; z-index: -1; transition: all 0.2s; opacity:0;} .px_slidein .et_pb_button_module_wrapper{background:#fff;padding-bottom:15px;} .px_slidein:hover:after{bottom: -15px;transition: all 0.2s;opacity:1;} .px_feature_info .et_pb_main_blurb_image .et_pb_image_wrap .et-pb-icon{color:var(--px-color-1);} .px_feature_info .et_pb_module_header span{color:var(--px-color-2);} .px_scale_in .px_contact .et_contact_bottom_container{margin-top:10px;margin-right:10px;} .px_silde_in_social_links .et_pb_social_network_link{margin-right:10px;} .px_silde_in_social_links .et_pb_social_network_link .icon:before{background: var(--px-color-1);width: 45px!important;height: 45px!important;line-height: 45px!important;border-radius: 50%;} .px_title.slideIn span{margin-left: 0px;} .px_title.slideIn span:before{display:none;} .px_s_item .et_pb_image_wrap span{color: var(--px-color-1) !important;} .px_services_item.slide .et_pb_main_blurb_image{margin-bottom:0px !important;} .px_slide_info:hover .px_slide_In_demo .et_pb_module_header{color:#fff !important;transition: all 0.3s ease;} .px_slide_info:hover .px_slide_In_demo .et_pb_promo_description p{color:#fff !important;transition: all 0.3s ease;} .px_slide_info:hover .px_slide_In_demo .et_pb_button_wrapper .et_pb_button{color:#fff !important;transition: all 0.3s ease;} /* Icon CSS */ .px_icon_bar {padding: 0px !important; background: var(--px-color-1) !important;border-radius: 5px;border: 2px solid #e4e7ee;transition: all 0.5s ease;-moz-transition: all 0.5s ease;-ms-transition: all 0.5s ease;-o-transition: all 0.5s ease;-webkit-box-shadow: 0px 0px 0px 0px;box-shadow: 0px 0px 0px 0px;} .px_icon_bar:after {padding:7px 15px 7px 9px;display: block;position: relative;-webkit-transition: all 0.5s ease;color:#fff !important;font-size:20px !important;} .px_icon_bar:before {content: "";position: absolute;width: 38px;height: 38px;border-radius: 5px;background: var(--px-color-1);border-radius: 5px;top: 0;left: 0;right: 0;bottom: 0;margin: auto;-webkit-transition: all 0.3s ease;transition: all 0.3s ease;-moz-transition: all 0.3s ease;-ms-transition: all 0.3s ease;-o-transition: all 0.3s ease;;display:block !important;} .px_icon_bar:hover:before {width: 100%;height: 100%;} /*Popup Overlay Css Move Up Start Here*/ .px-popup-wrapper .px-popup-content.px_move_up { transform: translateY(100%);transition: all .4s ease-in-out,width .2s ease-in-out,top .4s ease-in-out !important; } body:not(.et-fb) .px-popup-wrapper.popup-is-visible .px-popup-content.px_move_up {transform: translateY(-30px); } /*Popup Overlay Css Move Down Start Here*/ .px-popup-wrapper .px-popup-content.px_move_downup { transform: translateY(-100%);transition: all .4s ease-in-out,width .2s ease-in-out,top .4s ease-in-out !important; } body:not(.et-fb) .px-popup-wrapper.popup-is-visible .px-popup-content.px_move_downup {transform: translateY(0%); } /*Popup Overlay Css Move right Start Here*/ .px-popup-wrapper .px-popup-content.px_slide_right { transform: translateX(-100%);transition: all .8s ease-in-out,width .4s ease-in-out,top .8s ease-in-out !important; } body:not(.et-fb) .px-popup-wrapper.popup-is-visible .px-popup-content.px_slide_right {transform: translateX(0%); } /*Popup Overlay Css Move Left Here*/ .px-popup-wrapper .px-popup-content.px_slide_left { transform: translateX(100%);transition: all .8s ease-in-out,width .4s ease-in-out,top .8s ease-in-out !important; } body:not(.et-fb) .px-popup-wrapper.popup-is-visible .px-popup-content.px_slide_left {transform: translateX(0%); } /* Add Row animation when popup is triggered */ /*.px-popup-wrapper.popup-is-visible .et_pb_row:not(.px-popup-close)*/ .px-popup-wrapper.popup-is-visible .px_scale_in {animation:scale-in .5s cubic-bezier(.14,.06,.41,1.39) both; animation-delay: .5s; } @keyframes scale-in{0%{transform:scale(0.3);opacity:0}100%{transform:scale(1);opacity:1}} /*Popup Overlay Css Move Up Start Here*/ body:not(.et-fb) .px-popup-wrapper .px-popup-content.px_move_up {top: unset;min-height: auto;right: 20px;} .px-popup-wrapper .px_move_up { transform: translateY(100%);transition: all .8s ease-in-out,width .4s ease-in-out,top .8s ease-in-out !important; } .px-popup-wrapper.popup-is-visible .px_move_up {transform: translateY(-30px); } /*Popup Overlay Css Move Down Start Here*/ .px-popup-wrapper .px_move_downup { transform: translateY(-100%);transition: all .8s ease-in-out,width .4s ease-in-out,top .8s ease-in-out !important; } .px-popup-wrapper.popup-is-visible .px_move_downup {transform: translateY(0%); } /*Popup Overlay Css Slide Right Start Here*/ .px-popup-wrapper .px_slide_right { transform: translateX(100%);transition: all .8s ease-in-out,width .4s ease-in-out,top .8s ease-in-out !important; } .px-popup-wrapper.popup-is-visible .px_slide_right {transform: translateX(0%); } /*Popup Overlay Css Slide left Here*/ .px-popup-wrapper .px_slide_left { transform: translateX(0%);transition: all .8s ease-in-out,width .4s ease-in-out,top .8s ease-in-out !important; } /*------------------------------------------- 28. Color Picker CSS -------------------------------------------*/ .px-color-switcher,.px-color-switcher .close{display:block;box-shadow:5px 5px 15px #d1d9e6,-5px -5px 15px #fff;text-align:center}.pickr .pcr-button::after,.pickr .pcr-button::before,.tm-color-selector div,.tm-font-selector div{border-radius:50%}.px-color-switcher{position:fixed;left:8px;top:50%;z-index:1000;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);border-radius:64px;padding:15px 10px;background-color:#fff;font-size:12px;width:65px;line-height:1.3;background:linear-gradient(145deg,#e2e8ec,#fff);transition:.2s ease-in-out}.px-color-switcher .close{border-radius:50%;position:absolute;top:0;right:0;font-size:20px;color:#fff;z-index:20;line-height:24px;width:20px;height:20px;opacity:1;background-color:#333;transition:.5s;cursor:pointer}.px-color-switcher .close:hover{background:#fff;color:#333!important;opacity:1}.px-color-switcher.closed{padding:10px 8px 6px 10px;left:0;border-top-left-radius:0;border-bottom-left-radius:0;transition:.25s}.px-color-switcher.closed:hover{padding-right:14px}.px-color-switcher.closed img:hover,.tm-font-selector:hover{cursor:pointer}.px-color-switcher.closed .close,.px-color-switcher.closed div{display:none}.px-color-switcher.closed .img{display:block;overflow:hidden;height:42px;width:45px;text-align:center;animation:8s linear infinite rotation}.px-color-switcher.closed .img img{margin:0} @media (max-width: 991px) { .px-color-switcher { display: none !important;}} .px-color-selector div,.px-font-selector div{border-radius:50%;width:35px;height:35px;border:4px solid #fff;display:block;margin:4px auto 0;box-shadow:0 0 5px rgba(0,0,0,.1);cursor:pointer;transition:.5s}.px-color-selector div:hover,.px-font-selector div:hover{background:linear-gradient(145deg,rgba(0,0,0,.5),#fff);box-shadow:5px 5px 15px rgba(0,0,0,.5),-5px -5px 15px #fff}.px-custom-field{padding:0;border:0;width:20px;height:20px;border-radius:50%;margin-bottom:14px;margin-left:auto;margin-right:auto;cursor:pointer;display:block}.px-color-selector{position:relative}.px-color-switcher .px_tooltip{opacity:0;visibility:hidden;-webkit-transform:scale(.7);-moz-transform:scale(.7);-ms-transform:scale(.7);transform:scale(.7);position:absolute;background-color:#fff;font-size:13px;margin:0;padding:0 20px;font-family:inherit;width:auto;font-weight:600;line-height:36px;letter-spacing:.1px;left:5px;top:0;border-radius:3px;white-space:nowrap;-webkit-box-shadow:0 5px 40px rgb(0 0 0 / 7%),0 0 3px -1px rgb(83 45 245 / 15%);-moz-box-shadow:0 5px 40px rgb(0 0 0 / 7%),0 0 3px -1px rgb(83 45 245 / 15%);box-shadow:0 5px 40px rgb(0 0 0 / 7%),0 0 3px -1px rgb(83 45 245 / 15%);-moz-transition:.3s cubic-bezier(.64,-.09,.13,1.15);-o-transition:.3s cubic-bezier(.64,-.09,.13,1.15);transition:.3s cubic-bezier(.64,-.09,.13,1.15);color:#333}.px-color-switcher .px_tooltip span{display:block;position:absolute;left:-5px;top:12px;width:0;height:0;border-right:5px solid #fff;border-bottom:5px solid transparent;border-top:5px solid transparent}.px-color-switcher .px-color-selector:hover .px_tooltip{opacity:1;left:45px;visibility:visible;-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}