/* 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.qdqtkb {background: var(--px-color-2)} .px_s_info.qdqtkb:hover{border:1px solid var(--px-color-2);} .px_s_info.qdqtkb:hover::before {background: var(--px-color-1);} /* Video CSS */ .px_exp_video .dd0vkx2oke{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 .dd0vkx2oke{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 .hl9gr9pwpa 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 .orxjpgztnk{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 .m1bejqf82h{justify-content:end !important;} } /* ----------------------------------- Header Section CSS Version 2 -------------------------------------*/ /* Header Navigation CSS */ /* .px_header_menu .gqc94lc7nt ul li a{color: #fff;} .px_header_menu .obeod78k li a{color: #0a0a0a !important;} .px_header_2 .gqc94lc7nt ul li a{color: var(--px-color-2);} .px_header_2 .gqc94lc7nt ul li.mylqxls5u0 a:hover, .px_header_2 .gqc94lc7nt ul li a:hover{color: var(--px-color-1)!important;background:transparent !important;} .px_header_2 .gqc94lc7nt ul li.mylqxls5u0 a{color: var(--px-color-1)!important; opacity:1 !important;} .px_header_menu .gqc94lc7nt ul li a:hover{color: var(--px-color-1)!important; opacity:1 !important;} .px_header_menu .gqc94lc7nt ul li.mylqxls5u0 a{color: var(--px-color-1)!important; opacity:1 !important;} */ .px_h_menu.zr1osrucuz ul li{margin-top: 0 !important;padding:0px !important;} .px_h_menu.zr1osrucuz ul li a{line-height: 30px;padding:15px 15px !important;} .px_h_menu.zr1osrucuz ul li a:after{top: auto !important;} .px_h_menu.zr1osrucuz ul li.kjayiaws5m ul.obeod78k{padding:0;border: none;border-radius: 0px;} .px_h_menu.zr1osrucuz ul li.kjayiaws5m ul.obeod78k li{display:block;float:none;} .px_h_menu.zr1osrucuz ul li.kjayiaws5m ul.obeod78k 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.zr1osrucuz ul li.kjayiaws5m ul.obeod78k 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.zr1osrucuz ul li.kjayiaws5m ul.obeod78k li a:hover{opacity:1;padding-left: 20px !important;background-color: var(--px-color-2);color: #fff !important;} .px_h_menu.zr1osrucuz ul li.kjayiaws5m ul.obeod78k li a:hover:before{opacity:1;width: 5px;} .nav li li ul{top:0px;} .px_h_menu.gqc94lc7nt li.mega-menu > ul{padding:10px !important;} .px_h_menu.zr1osrucuz ul li.kjayiaws5m.mega-menu ul.obeod78k li a{padding: 13px 2px !important;color:var(--px-color-2 )!important;font-size:13px;} .px_h_menu.zr1osrucuz ul li.kjayiaws5m.mega-menu ul.obeod78k li a:before{display:none;} /* Header Bottom CSS */ .px_header_bottom .f0spw69xgd{width: 170px;} .px_header_bottom .obeod78k{box-shadow: 0px 15px 30px 0px rgba(0 0 0 / 5%);border-top: 2px solid var(--px-color-1);top: -3%;} .px_header_bottom .obeod78k li{display: block;border-bottom: 1px solid #E6E7E8;} .px_header_bottom .obeod78k li a{padding: 15px 0;} .px_header_bottom .zr1osrucuz .xmy72n77mo>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 .czjhf2mxw6.ve90ita4h5: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 .czjhf2mxw6.ve90ita4h5: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 .jjyamvtuwc.ve90ita4h5: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 .jjyamvtuwc.ve90ita4h5: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 .wno141ma4x.center img{position: absolute;width: 75px;right: 45%;top: -15%;animation: mymove 5s infinite;} .px_main_header .jjyamvtuwc.ve90ita4h5: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 .jjyamvtuwc.ve90ita4h5: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 .obeod78k{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 .ve90ita4h5::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 .ve90ita4h5:hover::before {height: 380%;} .px_slider_1 .ve90ita4h5:hover{color: var(--px-color-1)!important;} .px_slider_1 .ve90ita4h5{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 .orxjpgztnk .dd0vkx2oke{z-index: 2; color: var(--px-color-1);} .px_features .px_f_blurb .w469emuavs {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 .orxjpgztnk{width: 100%;} .px_about_image{border-radius: 50px 50px 0 0;} .px_about_image .orxjpgztnk 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 .orxjpgztnk {margin-right:0px !important;} .px_service .px_s_item .orxjpgztnk {margin-right:10px !important;} .px_service .px_s_item.img .orxjpgztnk {margin-right:0px !important;} .px_service .px_s_item .orxjpgztnk .dd0vkx2oke{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 .w469emuavs {color: #fff;} .px_service:hover .px_s_item.img .orxjpgztnk img{filter:unset; } .px_service:hover .px_s_item .orxjpgztnk 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.udu9ma53ku:last-child{margin-right:10px !important;} */ .px_slider .px_service.udu9ma53ku, .px_slider .px_service:last-child{margin-right: 10px!important;} /* ----------------------------------- Service Section CSS Version 2 -------------------------------------*/ .px_h2_service .orxjpgztnk .dd0vkx2oke{color: var(--px-color-2); transition: 0.3s;} .px_h2_service:hover .orxjpgztnk .dd0vkx2oke{color: var(--px-color-1);} .px_h2_service .w469emuavs{color: var(--px-color-1);transition: 0.3s;} .px_h2_service:hover .w469emuavs{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 .pym5e44zxq{max-width:100% !important;} } @media only screen and (max-width: 767px) { .px_h2_service .w469emuavs{font-size: 22px !important;} } /* ----------------------------------- Service Section CSS Version 3 -------------------------------------*/ .px_services_item .dd0vkx2oke{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 .jles38z9s3{ 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 .jles38z9s3{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.udu9ma53ku, .px_service_list:last-child{padding-bottom:40px !important;} /* ----------------------------------- 08. Portfolio Section CSS -------------------------------------*/ /* Portfolio Header CSS */ .px_portfolio_filter .et_pb_portfolio_item .w469emuavs{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 .w469emuavs{opacity: 1;bottom: 40px;} /* Portfolio Post Meta CSS*/ .px_portfolio_filter .et_pb_portfolio_item .vlrnb48ii{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 .vlrnb48ii a{color:var(--px-color-1);} .px_portfolio_filter .et_pb_portfolio_item:hover .vlrnb48ii{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 .w469emuavs{padding:0;} .px_portfolio_list .et_pb_portfolio_item .project_block .vlrnb48ii 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 .jas6z7pbtu{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 .jas6z7pbtu{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 .jas6z7pbtu {grid-template-columns: repeat(1, 100%);} } /* ----------------------------------- Projects Grid 3 Column CSS -------------------------------------*/ .px_portfolio_list.px_col_3 .jas6z7pbtu,.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 .jas6z7pbtu,.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 .jas6z7pbtu,.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 .jas6z7pbtu,.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 .jas6z7pbtu,.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 .w469emuavs {opacity: 1;z-index: 1;transform: translateY(0px);transition: 0.5s;} .px_portfolio_style .et_pb_portfolio_item:hover .vlrnb48ii{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 .w469emuavs{position: absolute;bottom: 40px;padding-left: 20px;color: #fff;opacity: 0;transform: translateY(70px);} .px_portfolio_style .vlrnb48ii{position: absolute;bottom: 10px;padding-left: 20px;color: #fff !important;opacity: 0;transform: translateY(50px);} /* Portfolio Style 1 CSS */ .px_portfolio_style1 .jas6z7pbtu{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 .jas6z7pbtu{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 .jas6z7pbtu {grid-template-columns: repeat(1, 1fr);} .px_portfolio_style1 .w469emuavs{bottom: 45px;} } /* Portfolio Style 2 CSS */ .px_portfolio_style2 .jas6z7pbtu{display: grid;grid-template-columns: repeat(3, 1fr);grid-column-gap: 10px;grid-row-gap: 10px;} .px_portfolio_style2 .jas6z7pbtu .et_pb_portfolio_item{position: relative;display: flex;align-items: flex-end;min-height: 245px;} .px_portfolio_style2 .jas6z7pbtu .et_pb_portfolio_item:nth-child(4n+1), .px_portfolio_style2 .jas6z7pbtu .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 .jas6z7pbtu {grid-template-columns: repeat(2, 1fr);} .px_portfolio_style2 .jas6z7pbtu .et_pb_portfolio_item:nth-child(4n+1), .px_portfolio_style2 .jas6z7pbtu .et_pb_portfolio_item:nth-child(4n) {grid-column-end: unset;} } @media only screen and (max-width: 767px){ .px_portfolio_style2 .jas6z7pbtu {grid-template-columns: repeat(1, 1fr);} } /* Portfolio Style 3 CSS */ .px_portfolio_style3 .jas6z7pbtu {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 .jas6z7pbtu {grid-template-columns: repeat(2, 1fr);} .px_portfolio_style3 .t7veo29hs{float: right;} } @media only screen and (max-width: 767px){ .px_portfolio_style3 .jas6z7pbtu {grid-template-columns: repeat(1, 1fr);} .px_portfolio_style3 .t7veo29hs{float: left;} } /* Portfolio Style 4 CSS */ .px_portfolio_style4 .jas6z7pbtu {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 .jas6z7pbtu {grid-template-columns: repeat(2, 1fr);} .px_portfolio_style4 .et_pb_portfolio_item:nth-child(1) {grid-row-end: unset;} .px_portfolio_style4 .t7veo29hs{float: right;} } @media only screen and (max-width: 767px){ .px_portfolio_style4 .jas6z7pbtu {grid-template-columns: repeat(1, 1fr);} .px_portfolio_style4 .t7veo29hs{float: left;} } /* Portfolio Style 5 CSS */ .px_portfolio_style5 .jas6z7pbtu{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 .jas6z7pbtu {grid-template-columns: repeat(2, 1fr);} .px_portfolio_style5 .et_pb_portfolio_item:nth-child(1) {grid-row-end: unset;} .px_portfolio_style5 .t7veo29hs{float: right;} } @media only screen and (max-width: 767px){ .px_portfolio_style5 .jas6z7pbtu {grid-template-columns: repeat(1, 1fr);} .px_portfolio_style5 .t7veo29hs{float: left;} } /* Portfolio Style 6 CSS */ .px_portfolio_style6 .jas6z7pbtu {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 .jas6z7pbtu {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 .jas6z7pbtu {grid-template-columns: repeat(1, 1fr);} } /* Portfolio Style 7 CSS */ .px_portfolio_style7 .jas6z7pbtu {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 .jas6z7pbtu {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 .jas6z7pbtu {grid-template-columns: repeat(1, 1fr);} } /* Portfolio Style 8 CSS */ .px_portfolio_style8 .et_pb_portfolio_item {margin-bottom: 0;} .px_portfolio_style8 .jas6z7pbtu {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 .jas6z7pbtu {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 .jas6z7pbtu {grid-template-columns: repeat(1, 1fr);} } /* Portfolio Style 9 CSS */ .px_portfolio_style9 .jas6z7pbtu {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 .jas6z7pbtu {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 .jas6z7pbtu {grid-template-columns: repeat(1, 1fr);} } /* Portfolio Style 10 CSS */ .px_portfolio_style10 .jas6z7pbtu {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 .jas6z7pbtu {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 .jas6z7pbtu {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 .w469emuavs{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 .w469emuavs{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 .orxjpgztnk{width:100% !important;} .px_team_list .orxjpgztnk 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 .dd0vkx2oke {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 .dd0vkx2oke: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 .orxjpgztnk{position: absolute;top: 25%;} .px_choose_content .orxjpgztnk .dd0vkx2oke{ 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 .fjlyu5nrjb{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 .orxjpgztnk{height:100%;width:100%;} .px_testimonial_img .orxjpgztnk 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 .w469emuavs{color:var(--px-color-2);padding:0 !important;} .px_testimonial_content .dd0vkx2oke{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 .fjlyu5nrjb{position: absolute;top: 65px;left: 5px;transform: translate(50px, 50px);} /* Managements Icon CSS */ .px_management .px_management_contact .orxjpgztnk .dd0vkx2oke{ 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 .orxjpgztnk .dd0vkx2oke: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 .orxjpgztnk .dd0vkx2oke{left: 55px;} .px_management_contact .fjlyu5nrjb{left:-5px;} } /* ----------------------------------- 15. Blog Section CSS -------------------------------------*/ /* Blog Image CSS*/ .px_blog_v1 .jfag7b5v4i {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 .jfag7b5v4i:hover {box-shadow: var(--px-color-1) 0px 5px 15px;} .px_blog_v1 .ht8oir3jhc{margin-bottom:0;z-index:0;} .px_blog_v1 .ht8oir3jhc: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 .jfag7b5v4i:hover .ht8oir3jhc:before{animation: animation 0.95s;transition: 0.5s;} .px_blog_v1 .ht8oir3jhc img{transform: scale(1);overflow: hidden;filter: grayscale(1);} .px_blog_v1 .jfag7b5v4i:hover .ht8oir3jhc img{filter: grayscale(0);transform: scale(1.1);transition: 0.5s;border-radius: 20px 0px 20px;} .px_blog_v1 .gy1gci5j5w .ht8oir3jhc{margin-bottom: 0!important;} /* Blog Container CSS*/ .px_blog_v1 .gy1gci5j5w{overflow: hidden;border-radius: 20px 0px 20px;} .px_blog_v1 .gy1gci5j5w{margin-bottom: 45px;} /* Blog Published CSS */ .px_blog_v1 .vlrnb48ii .pbbsmm8mi{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 .vlrnb48ii .pbbsmm8mi:before{content: '\e025';margin-right: 15px;font-family: ETmodules!important;} .px_blog_v1 .vlrnb48ii .pbbsmm8mi: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 .vlrnb48ii .gn6gds:before{content: '\e08a';margin-right: 10px;font-family: ETmodules!important;color: var(--px-color-1);font-size: 18px;} .px_blog_v1 .vlrnb48ii .gn6gds{margin-right: 10px;} .px_blog_v1 .vlrnb48ii a:before{content: '\e0df';margin-right: 10px;font-family: ETmodules!important;color: var(--px-color-1);font-size: 18px;} .px_blog_v1 .vlrnb48ii .gn6gds a:before{display: none;} .px_blog_v1 .vlrnb48ii{padding-bottom: 20px!important;border-bottom: 1px solid #E6E7E8;} /* Blog Content CSS */ .px_blog_v1 .o8e56hn0q3{margin-top: 15px;} .px_blog_v1 .o8e56hn0q3 .jintru37n{color: var(--px-color-1);position: relative;} .px_blog_v1 .o8e56hn0q3 .jintru37n::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 .jfag7b5v4i{padding-bottom: 40px;} /* Blog Standard Image Section CSS*/ .px_blog_v1.list .jfag7b5v4i:hover .ht8oir3jhc img{transform: scale(1);} .px_blog_v1.list .jfag7b5v4i .ht8oir3jhc img{border-radius: 20px 0px 20px;} /* Blog Standard Description CSS*/ .px_blog_v1.list .pjqzvs6grw{margin-left: 20px;margin-bottom: 10px;} .px_blog_v1.list .vlrnb48ii .pbbsmm8mi{position: relative;margin-left: 0 !important;margin-right: 20px;} .px_blog_v1.list .vlrnb48ii .pbbsmm8mi:after{right: -14px;top: 5px;} .px_blog_v1.list .vlrnb48ii{margin-left: 20px;margin-right: 20px;} .px_blog_v1.list .o8e56hn0q3{margin-left: 20px;} .px_blog_v1 .o8e56hn0q3 .jintru37n{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 .rhd4tdqcjl h4{color: var(--px-color-2);margin-bottom: 30px;position: relative;} .px_bd_list .rhd4tdqcjl h4:before{position: absolute;content: '';width: 30px;height: 4px;bottom: -5px;left: 0;background: var(--px-color-1);} .px_bd_list .rhd4tdqcjl ul{list-style: none;margin: 0;padding: 0;} .px_bd_list .rhd4tdqcjl ul li{margin-bottom: 15px;} .px_bd_list .rhd4tdqcjl 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 .vlrnb48ii .pbbsmm8mi{display: none;} } @media only screen and (max-width: 480px){ .px_blog_v1 .vlrnb48ii .pbbsmm8mi{transform: translate(20px, -80px);} .px_blog_v1 .gy1gci5j5w{margin-bottom: 35px;} } /* ----------------------------------- Blog Column 2 CSS -------------------------------------*/ .px_blog_2 .jas6z7pbtu{display: grid;grid-gap: 30px;grid-template-columns: repeat(2, 50%);} .px_blog_2 .jfag7b5v4i{overflow:hidden} .px_blog_2 .info{z-index: 4;position: relative;background: #fff;padding: 40px 20px;width:100%;} .px_blog_2 .ht8oir3jhc{margin-bottom:0px !important;} .px_blog_2 .vlrnb48ii .pbbsmm8mi {transform: translate(25px, -90px);} .px_blog_2 .jfag7b5v4i{margin-bottom:0px !important;} /* Responsive CSS */ @media only screen and (max-width: 767px){ .px_blog_2 .jas6z7pbtu{grid-template-columns: repeat(1, 100%);} .px_blog_2 .pjqzvs6grw{margin-bottom:20px;} } /* ----------------------------------- Blog List Left Image CSS -------------------------------------*/ .px_blog_list_left .ht8oir3jhc{margin-bottom: 0;width: 50%;float: left;overflow: hidden;border-radius: 15px 0px 0px 15px;} .px_blog_list_left .jfag7b5v4i .info{width: 50%;float: left;padding: 30px 20px;} .px_blog_list_left .vlrnb48ii .pbbsmm8mi {position: relative !important;transform: translate(0, 0)!important;margin-left: 0 !important;margin-right: 20px;} .px_blog_list_left .jfag7b5v4i{padding:0px;} .px_blog_list_left .vlrnb48ii .pbbsmm8mi:after{right: -14px !important;top: 3px !important;} /* Responsive CSS */ @media only screen and (max-width: 767px){ .px_blog_list_left .ht8oir3jhc{width:100%;} .px_blog_list_left .jfag7b5v4i .info{padding-left:0px !important;width:100%;} .px_blog_list_left .jfag7b5v4i .info .pjqzvs6grw{margin-bottom:15px;} .px_blog_list_right .ht8oir3jhc{width:100%;} } /* ----------------------------------- Blog List Right Image CSS -------------------------------------*/ .px_blog_list_right .ht8oir3jhc{margin-bottom: 0;width: 50%;float: right;overflow: hidden;border-radius: 0px 15px 15px 0px;} .px_blog_list_right .jfag7b5v4i .info{width: 50%;float: right;padding: 30px 20px;} /* Responsive CSS */ @media only screen and (max-width: 767px){ .px_blog_list_right .ht8oir3jhc{width:100% !important;} .px_blog_list_right .jfag7b5v4i .info{padding-left:0px !important;width:100%;} } /* ----------------------------------- Blog Full Width CSS -------------------------------------*/ .px_blog_v1.px_blog_fw .jfag7b5v4i{overflow:hidden;} .px_blog_v1.px_blog_fw .info{padding: 30px 50px 50px;} .px_blog_v1.px_blog_fw .vlrnb48ii .pbbsmm8mi{position:static !important;margin-left:0px !important;} .px_blog_v1.px_blog_fw .jfag7b5v4i .ht8oir3jhc{margin-bottom:0px !important;} .px_blog_v1.px_blog_fw .jfag7b5v4i:hover .ht8oir3jhc img{transform: scale(1) !important;} .px_blog_v1.px_blog_fw .info .pjqzvs6grw{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 .jfag7b5v4i , .px_blog_v1.px_blog_list_right.px_blog_list_sidebar .jfag7b5v4i {padding:0px;} .px_blog_v1.px_blog_list_right.px_blog_list_sidebar .jfag7b5v4i .info, .px_blog_v1.px_blog_list_left.px_blog_list_sidebar .jfag7b5v4i .info{padding:15px !important;} /* ----------------------------------- Blog Category CSS -------------------------------------*/ .px_blog_v1.px_blog_cat .gy1gci5j5w{margin-bottom:25px;} /* ----------------------------------- Blog Slider CSS -------------------------------------*/ .px_blog_slider .slick-track{padding: 55px 0;} .px_blog_slider .px_blog_v1 .jfag7b5v4i{overflow:hidden;} .px_blog_slider .jas6z7pbtu .info{padding:20px 30px 30px;background:#fff;z-index:3;} .px_blog_slider .jas6z7pbtu .jfag7b5v4i{margin: 10px; overflow: hidden;} .px_blog_slider .vlrnb48ii .pbbsmm8mi{transform: translate(25px, -73px);} .px_blog_slider .ht8oir3jhc{z-index:-1;} /* ----------------------------------- Home 2 Blog Tiles Section CSS -------------------------------------*/ /* Blog Style 5 CSS */ .px_posttiles_style5 .jas6z7pbtu{grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_posttiles_style5 .jfag7b5v4i:nth-child(2){grid-row-end: span 2;} .px_posttiles_style5.px_blog_2 .jfag7b5v4i:nth-child(2) .ht8oir3jhc{height: 83%;} .px_posttiles_style5.px_blog_2 .jfag7b5v4i:nth-child(2) .ht8oir3jhc img{height: 100%;object-fit: cover;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_posttiles_style5 .jas6z7pbtu {grid-template-columns: repeat(2, 1fr);} .px_posttiles_style5 .jfag7b5v4i:nth-child(2){grid-row-end: span 1;} .px_posttiles_style5.px_blog_2 .jfag7b5v4i:nth-child(2) .ht8oir3jhc{height:auto;} } @media only screen and (max-width: 767px){ .px_posttiles_style5 .jas6z7pbtu {grid-template-columns: repeat(1, 1fr);} } /* ----------------------------------- Blog Tiles Section CSS -------------------------------------*/ .px_blog_2.px_bblog_3 .vlrnb48ii .pbbsmm8mi{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 .jas6z7pbtu{grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_posttiles_style1 .jfag7b5v4i{margin-bottom: 0px !important;} .px_posttiles_style1 .ht8oir3jhc{margin-bottom: 0px !important;overflow: hidden;} .px_posttiles_style1 .ht8oir3jhc img{transition: transform 0.3s ease;filter: brightness(0.6);transform: scale(1);} .px_posttiles_style1 .ht8oir3jhc:hover img{transform: scale(1.1);} .px_posttiles_style1 .jfag7b5v4i:nth-child(1){grid-column: span 2;grid-row: span 2;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_posttiles_style1 .jas6z7pbtu{grid-template-columns: repeat(2, 1fr);} .px_posttiles_style1 .jfag7b5v4i:nth-child(1){grid-column: unset;grid-row: unset;} } @media only screen and (max-width: 767px){ .px_posttiles_style1 .jas6z7pbtu {grid-template-columns: repeat(1, 1fr);} } /* Blog Style 2 CSS */ .px_posttiles_style2 .jas6z7pbtu{display: grid;grid-template-columns: repeat(3, 1fr);grid-column-gap: 10px;grid-row-gap: 10px;} .px_posttiles_style2 .jas6z7pbtu .jfag7b5v4i{position: relative;display: flex;align-items: flex-end;min-height: 245px;} .px_posttiles_style2 .jas6z7pbtu .jfag7b5v4i:nth-child(4n+1), .px_posttiles_style2 .jas6z7pbtu .jfag7b5v4i:nth-child(4n){grid-column-end: span 2;} .px_posttiles_style2 .jfag7b5v4i{margin-bottom: 0px !important;} .px_posttiles_style2 .ht8oir3jhc{margin-bottom: 0px !important;overflow: hidden;} .px_posttiles_style2 .ht8oir3jhc img{transition: transform 0.3s ease;filter: brightness(0.6);transform: scale(1);height: 300px;} .px_posttiles_style2 .ht8oir3jhc:hover img{transform: scale(1.1);} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_posttiles_style2 .jas6z7pbtu {grid-template-columns: repeat(2, 1fr);} .px_posttiles_style2 .jas6z7pbtu .jfag7b5v4i:nth-child(4n+1), .px_posttiles_style2 .jas6z7pbtu .jfag7b5v4i:nth-child(4n){grid-column-end: unset;} } @media only screen and (max-width: 767px){ .px_posttiles_style2 .jas6z7pbtu {grid-template-columns: repeat(1, 1fr);} } /* Blog Style 3 CSS */ .px_posttiles_style3 .jas6z7pbtu {grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 0px;grid-row-gap: 0px;} .px_posttiles_style3 .jfag7b5v4i {margin-bottom: 0px !important;display: flex;align-items: flex-end;min-height: 260px;} .px_posttiles_style3 .jfag7b5v4i:nth-child(3) {grid-row-end: span 2;} .px_posttiles_style3 .ht8oir3jhc img{transition: transform 0.3s ease;filter: brightness(0.6);transform: scale(1); height: 100%;object-fit: cover;} .px_posttiles_style3 .ht8oir3jhc:hover img{transform: scale(1.1);} .px_posttiles_style3 .ht8oir3jhc {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 .jfag7b5v4i:nth-child(3) {grid-row-end: unset;} .px_posttiles_style3 .jas6z7pbtu {grid-template-columns: repeat(2, 1fr);} .px_posttiles_style3 .t7veo29hs{float: right;} } @media only screen and (max-width: 767px){ .px_posttiles_style3 .jas6z7pbtu {grid-template-columns: repeat(1, 1fr);} .px_posttiles_style3 .t7veo29hs{float: left;} } /* Blog Style 4 CSS */ .px_posttiles_style4 .jas6z7pbtu {grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_posttiles_style4 .jfag7b5v4i:nth-child(1) {grid-row-end: span 2;} .px_posttiles_style4 .jfag7b5v4i{margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} .px_posttiles_style4 .ht8oir3jhc img{transition: transform 0.3s ease;filter: brightness(0.6);transform: scale(1); height: 100%;object-fit: cover;} .px_posttiles_style4 .ht8oir3jhc:hover img{transform: scale(1.1);} .px_posttiles_style4 .ht8oir3jhc {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 .jas6z7pbtu {grid-template-columns: repeat(2, 1fr);} .px_posttiles_style4 .jfag7b5v4i:nth-child(1) {grid-row-end: unset;} .px_posttiles_style4 .t7veo29hs{float: right;} } @media only screen and (max-width: 767px){ .px_posttiles_style4 .jas6z7pbtu {grid-template-columns: repeat(1, 1fr);} .px_posttiles_style4 .t7veo29hs{float: left;} } /* Blog Style 6 CSS */ .px_posttiles_style6 .jas6z7pbtu {grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_posttiles_style6 .jfag7b5v4i {margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} .px_posttiles_style6 .jfag7b5v4i .ht8oir3jhc {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} .px_posttiles_style6 .jfag7b5v4i:nth-child(2n+5):nth-child(3n+2) {grid-column-end: span 2;} .px_posttiles_style6 .jfag7b5v4i:nth-child(5n+2):nth-child(2n+3) {grid-row-end: span 2;} .px_posttiles_style6 .jfag7b5v4i .ht8oir3jhc {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} .px_posttiles_style6 .ht8oir3jhc img{transition: all 0.3s;filter: brightness(0.6);height: 100%!important;object-fit: cover;} .px_posttiles_style6 .jfag7b5v4i:hover .ht8oir3jhc img{filter: brightness(1);} .px_posttiles_style6 .jfag7b5v4i{margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_posttiles_style6 .jas6z7pbtu {grid-template-columns: repeat(2, 1fr);} .px_posttiles_style6 .jfag7b5v4i:nth-child(2n+5):nth-child(3n+2) {grid-column-end: unset;} .px_posttiles_style6 .jfag7b5v4i:nth-child(5n+2):nth-child(2n+3) {grid-row-end: unset;} } @media only screen and (max-width: 767px){ .px_posttiles_style6 .jas6z7pbtu {grid-template-columns: repeat(1, 1fr);} } /* Blog Style 7 CSS */ .px_posttiles_style7 .jas6z7pbtu {grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_posttiles_style7 .jfag7b5v4i {margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} .px_posttiles_style7 .jfag7b5v4i:nth-child(5) {grid-column: span 2;grid-row: span 2;} .px_posttiles_style7 .jfag7b5v4i{margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} .px_posttiles_style7 .jfag7b5v4i .ht8oir3jhc {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} .px_posttiles_style7 .ht8oir3jhc img {transition: transform 0.3s ease;filter: brightness(0.6);height: 100%!important;object-fit: cover;} .px_posttiles_style7 .jfag7b5v4i:hover .ht8oir3jhc img {transform: scale(1.2) rotate(5deg);} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_posttiles_style7 .jas6z7pbtu {grid-template-columns: repeat(2, 1fr);} .px_posttiles_style7 .jfag7b5v4i:nth-child(5) {grid-column: unset;grid-row: unset;} } @media only screen and (max-width: 767px){ .px_posttiles_style7 .jas6z7pbtu {grid-template-columns: repeat(1, 1fr);} } /* Blog Style 8 CSS */ .px_posttiles_style8 .jfag7b5v4i {margin-bottom: 0;} .px_posttiles_style8 .jas6z7pbtu {grid-template-columns: repeat(2, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_posttiles_style8 .jfag7b5v4i:nth-child(6n+1), .px_posttiles_style8 .jfag7b5v4i:nth-child(6n+5) {grid-row-end: span 2;} .px_posttiles_style8 .jfag7b5v4i .ht8oir3jhc {margin-bottom: 0;overflow: hidden;height: 100%} .px_posttiles_style8 .jfag7b5v4i:hover .ht8oir3jhc img {filter: brightness(1);} .px_posttiles_style8 .ht8oir3jhc img {transition: all 0.3s;filter: brightness(0.6);height: 260px;object-fit: cover;} .px_posttiles_style8 .jfag7b5v4i:nth-child(6n+1) img, .px_posttiles_style8 .jfag7b5v4i:nth-child(6n+5) img {height: 100%;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_posttiles_style8 .jas6z7pbtu {grid-template-columns: repeat(2, 1fr);} .px_posttiles_style8 .jfag7b5v4i:nth-child(6n+1), .px_posttiles_style8 .jfag7b5v4i:nth-child(6n+5) {grid-row-end: unset;} } @media only screen and (max-width: 767px){ .px_posttiles_style8 .jas6z7pbtu {grid-template-columns: repeat(1, 1fr);} } /* Blog Style 9 CSS */ .px_posttiles_style9 .jas6z7pbtu {grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_posttiles_style9 .jfag7b5v4i {margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} .px_posttiles_style9 .jfag7b5v4i .ht8oir3jhc {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} .px_posttiles_style9 .ht8oir3jhc img{transition: all 0.3s;filter: brightness(0.6);height: 100%!important;object-fit: cover;} .px_posttiles_style9 .jfag7b5v4i:hover .ht8oir3jhc img {filter: brightness(1);} .px_posttiles_style9 .jfag7b5v4i:nth-child(5) {grid-row: span 1;grid-column: span 2;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_posttiles_style9 .jas6z7pbtu {grid-template-columns: repeat(2, 1fr);} .px_posttiles_style9 .jfag7b5v4i:nth-child(5n) {grid-row: unset;grid-column: unset;} } @media only screen and (max-width: 767px){ .px_posttiles_style9 .jas6z7pbtu {grid-template-columns: repeat(1, 1fr);} } /* Blog Style 10 CSS */ .px_posttiles_style10 .jas6z7pbtu {grid-template-columns: repeat(3, 1fr);display: grid;grid-column-gap: 15px;grid-row-gap: 15px;} .px_posttiles_style10 .jfag7b5v4i {margin-bottom: 0;display: flex;align-items: flex-end;min-height: 260px;} .px_posttiles_style10 .jfag7b5v4i .ht8oir3jhc {margin-bottom: 0;overflow: hidden;height: 100%;width: 100%;position: absolute !important;left: 0;bottom: 0;} .px_posttiles_style10 .ht8oir3jhc img {transition: all 0.3s;filter: grayscale(100%);height: 100%!important;object-fit: cover;} .px_posttiles_style10 .jfag7b5v4i:hover .ht8oir3jhc img {filter: grayscale(0);} .px_posttiles_style10 .jfag7b5v4i:nth-child(3n+2) {grid-row-end: span 2;} /* Responsive CSS */ @media only screen and (max-width: 981px){ .px_posttiles_style10 .jas6z7pbtu {grid-template-columns: repeat(2, 1fr);} .px_posttiles_style10 .jfag7b5v4i:nth-child(3n+2) {grid-row-end: unset;} } @media only screen and (max-width: 767px){ .px_posttiles_style10 .jas6z7pbtu {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 .gnztw2lhgm{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 .rhd4tdqcjl 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 .rhd4tdqcjl 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 .rhd4tdqcjl 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 .udu9ma53ku, .px_slider .px_pricing_table :last-child{margin-right: 10px!important;} /* Responsive CSS */ @media only screen and (max-width: 990px){ .px_pricing_v2 .wgpft7cxnj{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 .dd0vkx2oke{color: var(--px-color-1) !important;} /* ----------------------------------- 20. Achievement Section CSS -------------------------------------*/ .px_achievement .percent{height: 25px;} .px_achievement .et_pb_icon_wrap .dd0vkx2oke{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 .w469emuavs{padding: 0 !important;} .px_contact_form .et_contact_bottom_container{float: left !important;} .px_contact_form .et_contact_bottom_container .ve90ita4h5: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 .dd0vkx2oke{ 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 .orxjpgztnk{height:100%;} .px_contact_v2_img .orxjpgztnk img{height:100% !important;object-fit:cover;} .px_contact_form_v2 .ve90ita4h5{background: var(--px-color-1);transition: all 0.5s ease-in-out;color:#fff;} .px_contact_form_v2 .ve90ita4h5: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 .orxjpgztnk img{border-radius:30px;} .px_blog_post .d39jpza7sa{padding: 30px 0;} .px_blog_post .pjqzvs6grw{position: absolute;color: var(--px-color-2);bottom: -30%;left: 0;} .px_blog_post .pbbsmm8mi{background: var(--px-color-1);padding: 5px 15px;position: relative;color: #fff;border-radius: 30px;margin-right: 25px;margin-left: 10px;} .px_blog_post .pbbsmm8mi: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 .pbbsmm8mi:before{content: '\e025';font-family: ETmodules!important;margin-right: 10px;} .px_blog_post .gn6gds: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 .ve90ita4h5{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 .ve90ita4h5: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 .z1ztcf2njw{margin-bottom: 30px !important;} .px_blog_sidebar .ov1cerczq0{width: 100%;height: 60px !important;border: none;overflow: hidden;} .px_blog_sidebar .rfal8t3fa5{background: #F5F5F5;padding: 40px 30px;} .px_blog_sidebar .ggeezlyt3o{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 .mfp273w37d{background: #F5F5F5;padding: 40px 30px;} .px_blog_sidebar .mfp273w37d h2{font-size: 20px;line-height: 30px;color: var(--px-color-2);font-weight: 800;margin-bottom: 30px;position: relative;} .px_blog_sidebar .mfp273w37d h2:before{position: absolute;content: '';width: 30px;height: 4px;bottom: -5px;left: 0;background: #FE8C12;} /* Blog Details Sidebar List CSS */ .px_blog_sidebar .tzk7oudtj1 li{margin-bottom: 15px;} .px_blog_sidebar .tzk7oudtj1 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 .tzk7oudtj1 li a:hover{padding-left: 25px;color: var(--px-color-1);} .px_blog_sidebar .tzk7oudtj1 li a:before {content: '\24';position: absolute;font-family: ETmodules!important;left: 35px;opacity: 0;transition: 0.5s;} .px_blog_sidebar .tzk7oudtj1 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 .aupcoe3bkr{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 .rhd4tdqcjl h2{color:var(--px-color-2);} .px_404_title .rhd4tdqcjl span{color:var(--px-color-1);} /* ----------------------------------- 28. Coming Soon Page CSS -------------------------------------*/ .px_cs_image .orxjpgztnk 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 .dd0vkx2oke{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.ve90ita4h5: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.ve90ita4h5:hover:after {background: var(--px-color-2);} .px_footer_newsletter .jles38z9s3 { 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 .orxjpgztnk .dd0vkx2oke {transform: rotate(-45deg);color:#fff;background:var(--px-color-2);} /* ----------------------------------- Footer Section CSS Version 2 -------------------------------------*/ .px_h2_footer .ve90ita4h5{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 .ve90ita4h5:hover{background-color: transparent !important;} /* Footer Social Media CSS*/ .px_h2_footer .hl9gr9pwpa .icon{margin-right: 20px;} .px_h2_footer .hl9gr9pwpa .icon:before{background: var(--px-color-1);width: 37px!important;height: 37px!important;line-height: 37px!important;border-radius: 50%;} .px_h2_footer .hl9gr9pwpa .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 .ve90ita4h5:hover{color: var(--px-color-1)!important;margin-left: 5px;transition: all 0.3s ease;background-color: transparent;} .px_h2_footer .rhd4tdqcjl span:hover{color: var(--px-color-1);transition: 0.3s;} .px_h2_footer .gnztw2lhgm .ve90ita4h5{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 .eychbi4jw { 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 */ .wr7iycdv1h.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 .gnztw2lhgm{background:#fff;padding-bottom:15px;} .px_slidein:hover:after{bottom: -15px;transition: all 0.2s;opacity:1;} .px_feature_info .jles38z9s3 .orxjpgztnk .dd0vkx2oke{color:var(--px-color-1);} .px_feature_info .w469emuavs 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 .orxjpgztnk span{color: var(--px-color-1) !important;} .px_services_item.slide .jles38z9s3{margin-bottom:0px !important;} .px_slide_info:hover .px_slide_In_demo .w469emuavs{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 .ve90ita4h5{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 .eychbi4jw: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.erpf0t{padding:10px 8px 6px 10px;left:0;border-top-left-radius:0;border-bottom-left-radius:0;transition:.25s}.px-color-switcher.erpf0t:hover{padding-right:14px}.px-color-switcher.erpf0t img:hover,.tm-font-selector:hover{cursor:pointer}.px-color-switcher.erpf0t .close,.px-color-switcher.erpf0t div{display:none}.px-color-switcher.erpf0t .img{display:block;overflow:hidden;height:42px;width:45px;text-align:center;animation:8s linear infinite rotation}.px-color-switcher.erpf0t .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)}