锘 =====================================================================*/ /*====================================================*/ /*=== fonts ====*/ @import url("032099da720b4c79b94b957f573ab4a9.css"); /*===== color =====*/ /*====================================================*/ /*====================================================*/ .m0 { margin: 0px; } a { text-decoration: none; } a:hover, a:focus { text-decoration: none; } i:before { margin-left: 0px !important; } h1, h2, h3, h4, h5, h6 { font-family: "Muli", sans-serif; color: #1a1d31; } body { font: 400 16px/28px "Muli", sans-serif; letter-spacing: 0px; padding: 0px; color: #77798a; z-index: 0; } .body_wrapper { overflow: hidden; } a, .btn, button { text-decoration: none; outline: none; } a:hover, a:focus, .btn:hover, .btn:focus, button:hover, button:focus { text-decoration: none; outline: none; } .btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus { outline: none; -webkit-box-shadow: none; box-shadow: none; } @media (min-width: 1250px) { .container { max-width: 1200px; } } @media (min-width: 1250px) { .container.custom_container { max-width: 1520px; } } .sec_gap { padding: 60px 0px; } .bg_color { background: #fbfbfd; } .st_section_title { margin-bottom: 60px; } .st_section_title p { margin-bottom: 0; } .title { font-size: 16px; font-weight: 600; text-transform: uppercase; color: #b5b7c7; position: relative; text-align: center; padding: 0px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 70px; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .title .line { width: 100%; height: 1px; background: #d9ddef; } .title span { white-space: nowrap; padding: 0px 32px; } /*====================================================*/ /*====================================================*/ /*============ st_btn css ============*/ .st_btn { font-size: 14px; line-height: 50px; font-weight: 600; background: #3452ff; display: inline-block; color: #fff; padding: 0px 28px; border: 1px solid #3452ff; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; cursor: pointer; } .st_btn:hover { background: transparent; color: #3452ff; } .w_btn { background: #fff; color: #3452ff; border-color: #fff; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .w_btn:hover { background: #3452ff; border-color: #3452ff; color: #fff; } .b_radious { border-radius: 3px; } .stock_btn { background: transparent; color: #3452ff; } .stock_btn:hover { background: #3452ff; color: #fff; } /*============ st_btn css ============*/ /*====================================================*/ /*====================================================*/ /* Preloader */ .ctn-preloader { -webkit-box-align: center; -ms-flex-align: center; align-items: center; cursor: default; display: -webkit-box; display: -ms-flexbox; display: flex; background: #fff; height: 100%; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: fixed; left: 0; top: 0; width: 100%; z-index: 9000; } /*============ header css ==============*/ .header_position { position: fixed; top: 0; width: 100%; left: 0; z-index: 100; -webkit-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear; background-color: rgb(1,104,183,0.9); } .header_position.header_two { position: absolute; } @media (min-width: 992px) { .mobile_btn { visibility: hidden; display: none; } } @media (max-width: 991px) { .hidden-sm { visibility: hidden; display: none; } } .navbar { padding: 0px; } .navbar .navbar-brand img + img { display: none; } .menu > .nav-item { position: relative; padding-bottom: 42px; padding-top: 41px; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .menu > .nav-item > .nav-link { font: 600 14px "Muli", sans-serif; color: #fff; padding: 0px; -webkit-transition: color 0.3s ease 0s; -o-transition: color 0.3s ease 0s; transition: color 0.3s ease 0s; position: relative; } .menu > .nav-item > .nav-link:before { content: ""; width: 0; height: 1px; background: #fff; position: absolute; top: 100%; left: auto; right: 0; -webkit-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear; } .menu > .nav-item > .nav-link:after { display: none; } .menu > .nav-item.submenu .dropdown-menu { border: 0px; margin: 0px; border-radius: 0px; left: -30px; min-width: 120px; padding: 20px 30px; background: #fff; -webkit-box-shadow: -1px 2px 19px 3px rgba(14, 0, 40, 0.05); box-shadow: -1px 2px 19px 3px rgba(14, 0, 40, 0.05); } @media (min-width: 992px) { .menu > .nav-item.submenu .dropdown-menu { -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; opacity: 0; visibility: hidden; display: block; } } .menu > .nav-item.submenu .dropdown-menu .nav-item { display: block; width: 100%; margin-right: 0px; padding: 0px; position: relative; } .menu > .nav-item.submenu .dropdown-menu .nav-item .nav-link { padding: 0px; white-space: nowrap; font: 600 14px/34px "Muli", sans-serif; color: #1a1d31; -webkit-transition: color 0.2s linear; -o-transition: color 0.2s linear; transition: color 0.2s linear; } .menu > .nav-item.submenu .dropdown-menu .nav-item .nav-link:after { display: none; } .menu > .nav-item.submenu .dropdown-menu .nav-item:hover > .nav-link, .menu > .nav-item.submenu .dropdown-menu .nav-item:focus > .nav-link, .menu > .nav-item.submenu .dropdown-menu .nav-item.active > .nav-link { color: #3452ff; } .menu > .nav-item.submenu .dropdown-menu .nav-item > .dropdown-menu { -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; padding: 0px; } .menu > .nav-item.submenu .dropdown-menu .nav-item > .dropdown-menu:before { display: none; } @media (min-width: 992px) { .menu > .nav-item.submenu .dropdown-menu .nav-item > .dropdown-menu { position: absolute; left: 100%; top: -25px; opacity: 0; display: block; visibility: hidden; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } } .menu > .nav-item + .nav-item { margin-left: 50px; } .menu > .nav-item.active .nav-link:before { width: 100%; left: 0; right: auto; } .menu > .nav-item:hover .nav-link:before { width: 100%; left: 0; right: auto; } @media (min-width: 992px) { .menu > .nav-item:hover .dropdown-menu { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); visibility: visible; } } @media (min-width: 992px) and (min-width: 992px) { .menu > .nav-item:hover .dropdown-menu > .nav-item:hover .dropdown-menu { -webkit-transform: scaleY(1); -ms-transform: scaleY(1); transform: scaleY(1); opacity: 1; visibility: visible; } } .btn_get { background: #b4bc2e; font-size: 14px; font-weight: 600; color: #fff; padding: 11px 31px; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .btn_get:hover { background: #fff; color: #3452ff; } .btn_blue { background: #3452ff; color: #fff; } .btn_blue:hover { background: #fff; color: #3452ff; } .social_icon { margin-bottom: 0; } .social_icon li { display: inline-block; } .social_icon li a { width: 46px; height: 46px; font-size: 14px; color: #1a1d31; line-height: 48px; border-radius: 50%; text-align: center; display: inline-block; background: #fff; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .social_icon li a:hover { background: #3452ff; color: #fff; } .social_icon li:not(:last-child) { margin-right: 7px; } .header_two + section, .header_two + div { margin-top: 160px; } .header_top { background: #3452ff; padding: 15px 0px; } .header_top .header_info a { font-size: 14px; color: #b6c0fa; } .header_top .header_info a span { color: #fff; font-weight: 600; padding-right: 12px; } .header_top .header_info a + a { margin-left: 20px; } .header_top .header_info a + a:before { content: ""; width: 1px; height: 14px; background: #b6c0fa; display: inline-block; margin-right: 21px; top: 2px; position: relative; } .header_social a { font-size: 14px; color: #b6c0fa; -webkit-transition: color 0.3s linear; -o-transition: color 0.3s linear; transition: color 0.3s linear; } .header_social a + a { margin-left: 20px; } .header_social a:hover { color: #fff; } .menu_two { -webkit-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear; } .menu_two .menu > .nav-item > .nav-link { color: #1a1d31; font-weight: 700; } .menu_two .menu > .nav-item > .nav-link:before { display: none; } .menu_two .menu > .nav-item.active .nav-link, .menu_two .menu > .nav-item:hover .nav-link { color: #3452ff; } .menu_two .search { margin-bottom: 0; position: relative; margin-left: 26px; } .menu_two .search:before { content: ""; width: 1px; height: 20px; background: #d1d5ef; display: inline-block; top: 2px; left: -13px; position: absolute; } .menu_two .search li a { color: #1a1d31; } .menu_two .search li a:hover { color: #3452ff; } .menu_four .menu > .nav-item > .nav-link:before { bottom: 0; top: auto; } .menu_four .menu > .nav-item.active .nav-link, .menu_four .menu > .nav-item:hover .nav-link { color: #fff; } /*========= hamburger menu css ========*/ .navbar-toggler { padding: 0px; margin-left: 20px; } .navbar-toggler:focus { outline: none; } .menu_toggle { width: 22px; height: 22px; position: relative; cursor: pointer; display: block; } .menu_toggle .hamburger { position: absolute; height: 100%; width: 100%; display: block; } .menu_toggle .hamburger span { width: 0%; height: 2px; position: relative; top: 0; left: 0; margin: 4px 0; display: block; background: #fff; border-radius: 3px; -webkit-transition: .2s ease-in-out; -o-transition: .2s ease-in-out; transition: .2s ease-in-out; } .menu_toggle .hamburger span:nth-child(1) { -webkit-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; } .menu_toggle .hamburger span:nth-child(2) { -webkit-transition-delay: .125s; -o-transition-delay: .125s; transition-delay: .125s; } .menu_toggle .hamburger span:nth-child(3) { -webkit-transition-delay: .2s; -o-transition-delay: .2s; transition-delay: .2s; } .menu_toggle .hamburger-cross { position: absolute; height: 100%; width: 100%; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); display: block; } .menu_toggle .hamburger-cross span { display: block; background: #fff; border-radius: 3px; -webkit-transition: .2s ease-in-out; -o-transition: .2s ease-in-out; transition: .2s ease-in-out; } .menu_toggle .hamburger-cross span:nth-child(1) { height: 100%; width: 2px; position: absolute; top: 0; left: 10px; -webkit-transition-delay: .3s; -o-transition-delay: .3s; transition-delay: .3s; } .menu_toggle .hamburger-cross span:nth-child(2) { width: 100%; height: 2px; position: absolute; left: 0; top: 10px; -webkit-transition-delay: .4s; -o-transition-delay: .4s; transition-delay: .4s; } .collapsed .menu_toggle .hamburger span { width: 100%; } .collapsed .menu_toggle .hamburger span:nth-child(1) { -webkit-transition-delay: .3s; -o-transition-delay: .3s; transition-delay: .3s; } .collapsed .menu_toggle .hamburger span:nth-child(2) { -webkit-transition-delay: .4s; -o-transition-delay: .4s; transition-delay: .4s; } .collapsed .menu_toggle .hamburger span:nth-child(3) { -webkit-transition-delay: .5s; -o-transition-delay: .5s; transition-delay: .5s; } .collapsed .menu_toggle .hamburger-cross span:nth-child(1) { height: 0%; -webkit-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; } .collapsed .menu_toggle .hamburger-cross span:nth-child(2) { width: 0%; -webkit-transition-delay: .2s; -o-transition-delay: .2s; transition-delay: .2s; } .ml_50 { margin-left: 50px; } .navbar_fixed.header_area { background: #fff; -webkit-box-shadow: 0px 4px 6px 0px rgba(12, 0, 46, 0.06); box-shadow: 0px 4px 6px 0px rgba(12, 0, 46, 0.06); position: fixed; width: 100%; left: 0; } .navbar_fixed.header_area .navbar-brand img { display: none; } .navbar_fixed.header_area .navbar-brand img + img { display: block; } .navbar_fixed.header_area .menu > .nav-item { padding-top: 35px; padding-bottom: 35px; } .navbar_fixed.header_area .menu > .nav-item > .nav-link { color: #1a1d31; } .navbar_fixed.header_area .menu > .nav-item > .nav-link:before { background: #1a1d31; } .navbar_fixed.header_area .menu_toggle .hamburger span, .navbar_fixed.header_area .menu_toggle .hamburger-cross span { background: #1a1d31; } .navbar_fixed .btn_get:hover { background: #3452ff; color: #fff; } .navbar_fixed .social_icon li a { border: 1px solid #1a1d31; } .navbar_fixed .social_icon li a:hover { border-color: #3452ff; } .navbar_fixed .header_top { display: none; } .navbar_fixed.menu_two { background: #fff; -webkit-box-shadow: 0px 4px 6px 0px rgba(12, 0, 46, 0.06); box-shadow: 0px 4px 6px 0px rgba(12, 0, 46, 0.06); position: fixed; top: 0; left: 0; width: 100%; } /*====================================================*/ /*====================================================*/ /*============== startup_slider_area ==============*/ .startup_slider_area { height: 1000px; position: relative; overflow: hidden; background: #151828; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .startup_slider_area .parallax-effect { background: url("../images/startup_bg.jpg") no-repeat scroll center 0/cover; opacity: 0.15; } .startup_slider_content h6, .startup_slider_content h2, .startup_slider_content p { color: #fff; } .startup_slider_content h6 { font-size: 20px; font-weight: 600; margin-bottom: 22px; } .startup_slider_content h2 { font-weight: 900; font-size: 50px; line-height: 66px; margin-bottom: 22px; } .startup_slider_content p { font-size: 16px; line-height: 28px; margin-bottom: 40px; } .startup_slider_content .st_btn { -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .startup_slider_content .st_btn:hover { background: #fff; color: #3452ff; border-color: #fff; } .video_btn { width: 150px; height: 150px; border: 1px solid #fff; background: rgba(255, 255, 255, 0.1); display: block; margin-left: auto; margin-right: 0; border-radius: 50%; position: relative; z-index: 1; } .video_btn:before { content: ""; position: absolute; left: 50%; top: 50%; height: 100%; width: 100%; margin-left: -75px; margin-top: -75px; border-radius: 999px; z-index: -1; background: rgba(255, 255, 255, 0.3); -webkit-animation: thscale 3s ease-in-out 0s infinite both; animation: thscale 3s ease-in-out 0s infinite both; } .video_btn span { width: 90px; height: 90px; border-radius: 50%; background: #fff; display: inline-block; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; line-height: 95px; } .video_btn span:after { content: ""; display: inline-block; width: 0; height: 0; border-style: solid; border-width: 10px 0 10px 16px; border-color: transparent transparent transparent #007bff; } .video_btn .shine { border-radius: 50%; background: -webkit-linear-gradient(350.218deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 80%) !important; background: -o-linear-gradient(350.218deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 80%) !important; background: linear-gradient(99.7824deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 80%) !important; } @-webkit-keyframes thscale { 0% { -webkit-transform: scale(0.2); transform: scale(0.2); opacity: 1; } 100% { -webkit-transform: scale(1.55); transform: scale(1.55); opacity: 0; } } @keyframes thscale { 0% { -webkit-transform: scale(0.2); transform: scale(0.2); opacity: 1; } 100% { -webkit-transform: scale(1.55); transform: scale(1.55); opacity: 0; } } /*============== startup_slider_area ==============*/ /*=========== business_slider css =============*/ .business_slider { height: 100vh; min-height: 650px; position: relative; } .business_slider .slick-list, .business_slider .slick-track, .business_slider .main_slider { height: 100%; } .business_slider .slider_item { height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; background: #151828; } .business_slider .slider_item .overlay_bg { opacity: 0.2; } .slider_text { min-height: 400px; } .slider_text h6 { font-size: 30px; font-weight: 600; line-height: 45px; margin-bottom: 20px; } .slider_text h1 { font-weight: 900; font-size: 50px; line-height: 66px; margin-bottom: 20px; } .slider_text h1, .slider_text p, .slider_text h6 { color: #fff; } .slider_text p { font-size: 16px; line-height: 28px; margin-bottom: 42px; } .slider_text .st_btn { margin: 0px 10px; } .slider_text .st_btn:hover { background: #fff; border-color: #fff; } .slider_text .st_btn.w_btn:hover { background: #3452ff; border-color: #3452ff; } .slider_nav .left_arrow, .slider_nav .right_arrow { position: absolute; width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.4); background: rgba(255, 255, 255, 0.059); text-align: center; line-height: 46px; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; color: #fff; cursor: pointer; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .slider_nav .left_arrow:hover, .slider_nav .right_arrow:hover { background: #fff; border-color: #fff; color: #1a1d31; } .slider_nav .left_arrow.left_arrow, .slider_nav .right_arrow.left_arrow { left: 50px; } .slider_nav .left_arrow.right_arrow, .slider_nav .right_arrow.right_arrow { right: 50px; } .overlay_bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -1; } .overlay_bg.one { background: url("../images/slider_1.jpg") no-repeat scroll center 0/cover; } .overlay_bg.two { background: url("../images/slider_2.jpg") no-repeat scroll center 0/cover; } /*=========== business_slider css =============*/ /*=========== business_slider_two css =============*/ .business_slider_two { /* height: calc(100vh - 400px);*/ min-height: 300px; position: relative; } .business_slider_two .slider_item { height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; background: #151828; } /*.business_slider_two .slider_item .overlay_bg { opacity: 0.3; }*/ .business_slider_two .overlay_bg.one { background: url("../images/slider_3.jpg") no-repeat scroll center 0/cover; } .business_slider_two .overlay_bg.two { background: url("../images/slider_4.jpg") no-repeat scroll center 0/cover; } .business_slider_two .st_btn:hover { background: #fff; border-color: #fff; } .business_slider_two .st_btn.w_btn:hover { background: #3452ff; border-color: #3452ff; } /*=========== business_slider_two css =============*/ /*=========== agency_banner_area css =============*/ .agency_banner_area { height: 100vh; min-height: 650px; background: url("../images/slider.png") no-repeat scroll center right; position: relative; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .agency_banner_area:before { content: ""; width: 100%; height: 100%; background: #151828; opacity: 0.50; position: absolute; top: 0; left: 0; z-index: -2; } .agency_banner_area .agency_bg_shap { position: absolute; top: 0; left: 0; width: 100%; height: 100.1%; background: url("../images/shap_bg.png") no-repeat scroll bottom/cover; z-index: -1; } .agency_banner_area .video_btn { border-color: rgba(255, 255, 255, 0.1); background: transparent; width: 170px; height: 170px; } .agency_banner_area .video_btn:before { content: ""; position: absolute; width: 120px; height: 120px; top: 50%; left: 50%; margin-top: -60px; margin-left: -60px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, 0.3); } .agency_banner_area .video_btn span { width: 80px; height: 80px; line-height: 85px; background-image: -moz-linear-gradient(-140deg, #6e83fa 0%, #3452ff 100%); background-image: -webkit-linear-gradient(-140deg, #6e83fa 0%, #3452ff 100%); background-image: -ms-linear-gradient(-140deg, #6e83fa 0%, #3452ff 100%); -webkit-box-shadow: 0px 16px 30px 0px rgba(0, 12, 31, 0.1); box-shadow: 0px 16px 30px 0px rgba(0, 12, 31, 0.1); } .agency_banner_area .video_btn span:after { border-color: transparent transparent transparent #fff; } .agency_banner_text { max-width: 470px; } .agency_banner_text h2 { font: 700 50px/55px "Muli", sans-serif; color: #1a1d31; margin-bottom: 25px; } .agency_banner_text p { margin-bottom: 45px; } /*=========== agency_banner_area css =============*/ /*====================================================*/ /*====================================================*/ /*================= startup_about_area css ================*/ .st_about_img { padding: 40px 30px 30px; position: relative; } .st_about_img .shap_top { position: absolute; height: 120px; width: 100%; background: #3452ff; left: 0; top: 0; z-index: -1; } .st_about_img .shap_bottom { position: absolute; height: 90px; width: 80px; opacity: 0.50; background: #3452ff; left: 0; bottom: 0; z-index: 0; } .st_about_img .shap_right { background: url("../images/shap.jpg") no-repeat scroll right; position: absolute; bottom: 0; right: -60px; height: 100px; width: 100px; z-index: -1; } .st_title_top { font: 600 16px/20px "Muli", sans-serif; color: #b4bc2e; border-bottom: 1px solid #b4bc2e; display: inline-block; margin-bottom: 20px; } .st_title { font-size: 30px; line-height: 40px; font-weight: 700; color: #1a1d31; margin-bottom: 14px; } .st_about_content { padding-left: 90px; } .st_about_content p { margin: 0px 0px 40px; } /*================= startup_about_area css ================*/ /*================= business_about_area css ================*/ .business_about_area { padding-top: 110px; } .business_features_area_three { padding: 120px 0px 200px; } .about_img { margin-left: -80px; position: relative; margin-top: -180px; padding-bottom: 30px; z-index: 1; } .about_img .ph_img, .about_img .p_img { position: absolute; bottom: 0; z-index: 0; } .about_img .p_img { left: -155px; } .about_img .ph_img { left: 30px; bottom: -15px; } .b_about_content { margin-right: -175px; padding-left: 100px; } .b_about_content h5 { font-size: 20px; line-height: 30px; font-weight: 600; color: #77798a; } .b_about_content h2 { font-size: 30px; line-height: 46px; font-weight: 700; color: #1a1d31; margin-bottom: 25px; } .b_about_content p { margin-bottom: 55px; } .b_about_content .st_btn:hover { border-color: #3452ff; } /*================= business_about_area css ================*/ /*================= business_skill_area css ================*/ .business_skill_area { padding: 120px 0px; } .skill_info .b_about_content { padding-left: 0; margin-right: 0; padding-right: 100px; } .skill_info .b_about_content p { margin-bottom: 34px; } .skill_info .b_about_content .st_btn { background: #1a1d31; border: 0px; color: #fff; } .skill_info .b_about_content .st_btn:hover { background: #3452ff; } .progress-element p { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; font-size: 16px; color: #1a1d31; font-weight: 600; margin-bottom: 10px; } .progress-element .progress { height: 4px; background: #e5e6ef; margin-bottom: 30px; border-radius: 0px; } .progress-element .progress .progress-bar { background: #3452ff; -webkit-transition: width 1s linear; -o-transition: width 1s linear; transition: width 1s linear; width: 0; } /*================= business_skill_area css ================*/ /*================= page_banner_area css ================*/ .page_banner_area { position: relative; z-index: 0; height: 600px; overflow: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; background: #151828; } .page_banner_area .parallax-effect { opacity: 0.20; } .page_banner_area .parallax-effect.about_bg { background: url("../images/banner_bg.jpg") no-repeat scroll center 0/cover; } .page_banner_area .parallax-effect.blog_bg { background: url(../images/blog_baner_bg.jpg) no-repeat scroll center 0/cover; } .page_banner_area .parallax-effect.contact_bg { background: url("../images/contact_bg.jpg") no-repeat scroll center 0/cover; } .page_banner_area h2 { font-size: 50px; line-height: 66px; font-weight: 700; margin-bottom: 15px; color: #fff; margin-top: 50px; } .page_banner_area ol { margin-bottom: 0; } .page_banner_area ol li { display: inline-block; font-size: 18px; line-height: 30px; color: #fff; position: relative; } .page_banner_area ol li a { color: #fff; -webkit-transition: color 0.3s linear; -o-transition: color 0.3s linear; transition: color 0.3s linear; } .page_banner_area ol li a:hover { color: #3452ff; } .page_banner_area ol li + li:before { content: ""; position: relative; width: 2px; height: 15px; top: 2px; background: #fff; left: 0; display: inline-block; margin-right: 13px; margin-left: 10px; } /*================= page_banner_area css ================*/ /*====================================================*/ /*====================================================*/ /*=========== startup_features_area css =============*/ .startup_features_area { margin-top: -190px; padding-bottom: 100px; position: relative; z-index: 1; } .s_features_item h3 { color: #fff; font-size: 18px; font-weight: 700; margin-bottom: 20px; } .s_features_item p { color: #bdc0d3; font-size: 15px; line-height: 24px; margin-bottom: 0; } /*=========== startup_features_area css =============*/ /*============== st_features_area css ==============*/ .st_features_area { background: #fbfbfd; overflow: hidden; } .st_f_img { position: relative; z-index: 0; } .parallax-effect { position: absolute; background-size: cover !important; left: 0; width: 100%; height: 120%; z-index: -1; top: 0; } .f_content_left { padding: 170px 0px; } .f_content_left .st_about_content { max-width: 585px; margin-left: auto; margin-right: 0; padding-right: 115px; padding-left: 0; } .f_content_left .st_about_content p { margin-bottom: 0; } .f_content_left .st_about_content .st_btn { margin-top: 40px; } .f_content_left .st_about_content.st_about_content_two { margin-right: auto; margin-left: 0; padding-right: 0; padding-left: 115px; } /*============== st_features_area css ==============*/ /*============== business_features_area css ==============*/ .business_features_info .st_title { margin-bottom: 0; } .business_features_info ul { list-style: none; padding: 30px 0 0 0; width: 95%; margin: 0 auto; } .business_features_info ul li { padding-bottom: 5px;; border-bottom: 1px solid #eef; list-style-type: none; line-height: 30px; margin-bottom:10px; margin-right: 10px; background:url("../images/dot.gif") no-repeat left; } .business_features_info ul i { font-size: 20px; padding-right: 4px; color: #005ca1; } .business_features_info a { display: block; text-align: left; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; margin-right: 90px; margin-left: 20px; color: #1a1d31; } .business_features_info a:hover { color: #3452ff; } .business_features_info .spanright { line-height: 27px; margin-right: 0; float: right; text-align: right; } .business_features_item { padding-right: 100px; margin-top: 100px; } .business_features_item i { font-size: 40px; line-height: 45px; color: #3452ff; margin-bottom: 30px; display: inline-block; } .business_features_item h4 { font-size: 20px; line-height: 26px; font-weight: 700; margin-bottom: 20px; } .business_features_item p { font-size: 18px; line-height: 28px; margin-bottom: 0; } .ft_about_img { margin-right: -175px; padding: 40px 40px 30px 30px; position: relative; } .ft_about_img img { max-width: 100%; } .ft_about_img .shap_top { height: 500px; width: 450px; background: #3452ff; position: absolute; right: 0; top: 0; -webkit-clip-path: polygon(0px 0%, 0px 0px, 100% 0px, 100% 100%); clip-path: polygon(0px 0%, 0px 0px, 100% 0px, 100% 100%); z-index: -1; } .ft_about_img .shap_left { background: url(../images/shap.jpg) no-repeat scroll right; position: absolute; bottom: 0; left: 0px; height: 100px; width: 100px; z-index: -1; } /*============== business_features_area css ==============*/ /*============== business_features_area_two css ==============*/ .business_features_item_two { padding-right: 20px; margin-bottom: 50px; cursor: pointer; } .business_features_item_two i { font-size: 40px; color: #1a1d31; margin-right: 35px; -webkit-transition: color 0.3s linear; -o-transition: color 0.3s linear; transition: color 0.3s linear; } .business_features_item_two .media-body h3 { margin-bottom: 15px; -webkit-transition: color 0.3s linear; -o-transition: color 0.3s linear; transition: color 0.3s linear; } .business_features_item_two:hover h3, .business_features_item_two:hover i { color: #3452ff; } /*============== business_features_area_two css ==============*/ /*============== business_features_area_three css ==============*/ .business_features_area_three { background: #f9f9fc; } .business_features_area_three .border_line { margin-bottom: 100px; } .business_features_area_three .business_features_item_two { margin-bottom: 0; } .business_features_area_three .business_features_item_two p { margin-bottom: 0; } .border_line { width: 100%; height: 1px; background: #dfdff5; } .business_features_area_four { padding: 120px 0px 200px; } /*============== business_features_area_three css ==============*/ /*================= agency_features_area css ================*/ .ag_about_img { margin-right: 55px; padding: 40px 40px 30px 30px; } .ag_about_img .shap_top { right: auto; left: 0; height: 100%; width: 100%; background: #eceffd; -webkit-clip-path: polygon(0px 100%, 0 0px, 84% 0px, 54% 100%); clip-path: polygon(0px 100%, 0 0px, 84% 0px, 54% 100%); } .ag_about_img .shap_left { left: auto; right: 0; } .agency_about_content { padding-left: 0; padding-right: 100px; } .agency_about_content .st_title_top { color: #3452ff; border-color: #3452ff; } /*================= agency_features_area css ================*/ /*====================================================*/ /*====================================================*/ .search_boxs { z-index: 20000; position: fixed; top: -105%; left: 0; width: 100%; height: 100%; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; overflow: hidden; } .search_boxs:before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; background: rgba(27, 29, 34, 0.95); width: 100%; height: 0; padding-bottom: 100%; border-radius: 100%; -webkit-transform: scale(0.04), translateY(9999px); -ms-transform: scale(0.04), translateY(9999px); transform: scale(0.04), translateY(9999px); overflow: hidden; } .search_boxs .close_icon { position: absolute; right: 20px; top: 20px; font-size: 20px; color: #fff; cursor: pointer; -webkit-backface-visibility: hidden; backface-visibility: hidden; transition: transform 0.2s ease-out, opacity 0.2s ease-out, -webkit-transform 0.2s ease-out; opacity: 0; } .search_boxs .input-group { position: absolute; left: 50%; top: 50%; -webkit-transform: scale(0.5); -ms-transform: scale(0.5); transform: scale(0.5); -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); max-width: 800px; width: 20%; opacity: 0; -webkit-transition: all 900ms linear; -o-transition: all 900ms linear; transition: all 900ms linear; -webkit-transition-delay: 0.75s; -o-transition-delay: 0.75s; transition-delay: 0.75s; } .search_boxs .input-group input { border: none; height: 55px; padding: 0px 15px; font-size: 16px; padding-left: 0px; width: 100%; color: #fff; background: transparent; border-bottom: 2px solid rgba(255, 255, 255, 0.6); border-radius: 0px; outline: none; } .search_boxs .input-group input.placeholder { font-size: 16px; color: rgba(255, 255, 255, 0.6); } .search_boxs .input-group input:-moz-placeholder { font-size: 16px; color: rgba(255, 255, 255, 0.6); } .search_boxs .input-group input::-moz-placeholder { font-size: 16px; color: rgba(255, 255, 255, 0.6); } .search_boxs .input-group input::-webkit-input-placeholder { font-size: 16px; color: rgba(255, 255, 255, 0.6); } .search_boxs .input-group .input-group-append { margin-left: 0px; position: absolute; right: 0px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); cursor: pointer; z-index: 4; } .search_boxs .input-group .input-group-append button { border: none; background: transparent; border-radius: 0px; height: 55px; border-bottom-left-radius: 0px; border-top-left-radius: 0px; color: rgba(255, 255, 255, 0.6); font-size: 24px; padding: 0px; font-family: "Muli", sans-serif; outline: none !important; -webkit-box-shadow: none !important; box-shadow: none !important; cursor: pointer; } .search_boxs .input-group .input-group-append button i { cursor: pointer; } input[type="text"] { -webkit-appearance: none; outline: none; } .open .search_boxs { top: 0px; } .open .search_boxs:before { -webkit-animation: menu-animation 0.8s ease-out forwards; animation: menu-animation 0.8s ease-out forwards; height: 100%; } .open .search_boxs .close_icon { -webkit-transition-delay: 0.75s; -o-transition-delay: 0.75s; transition-delay: 0.75s; opacity: 1; } .open .search_boxs .input-group { width: 100%; opacity: 1; } /* Css keyframes css ============================================================================================ */ @-webkit-keyframes menu-animation { 0% { opacity: 0; -webkit-transform: scale(0.04) translateY(300%); transform: scale(0.04) translateY(300%); } 40% { -webkit-transform: scale(0.04) translateY(0); transform: scale(0.04) translateY(0); -webkit-transition: ease-out; -o-transition: ease-out; transition: ease-out; } 40% { -webkit-transform: scale(0.04) translateY(0); transform: scale(0.04) translateY(0); } 60% { opacity: 1; -webkit-transform: scale(0.02) translateY(0px); transform: scale(0.02) translateY(0px); } 61% { -webkit-transform: scale(0.04); transform: scale(0.04); } 99.9% { height: 0; padding-bottom: 100%; border-radius: 100%; } 100% { -webkit-transform: scale(2); transform: scale(2); height: 100%; padding-bottom: 0; border-radius: 0; } } @keyframes menu-animation { 0% { opacity: 0; -webkit-transform: scale(0.04) translateY(300%); transform: scale(0.04) translateY(300%); } 40% { -webkit-transform: scale(0.04) translateY(0); transform: scale(0.04) translateY(0); -webkit-transition: ease-out; -o-transition: ease-out; transition: ease-out; } 40% { -webkit-transform: scale(0.04) translateY(0); transform: scale(0.04) translateY(0); } 60% { opacity: 1; -webkit-transform: scale(0.02) translateY(0px); transform: scale(0.02) translateY(0px); } 61% { -webkit-transform: scale(0.04); transform: scale(0.04); } 99.9% { height: 0; padding-bottom: 100%; border-radius: 100%; } 100% { -webkit-transform: scale(2); transform: scale(2); height: 100%; padding-bottom: 0; border-radius: 0; } } /* End Css keyframes css ============================================================================================ */ /*====================================================*/ /*====================================================*/ /*============== st_service_area css =============*/ .st_features_item { text-align: center; padding: 50px; -webkit-transition: background 0.4s linear; -o-transition: background 0.4s linear; transition: background 0.4s linear; cursor: pointer; } .st_features_item i { color: #3452ff; font-size: 40px; line-height: 45px; margin-bottom: 25px; display: inline-block; } .st_features_item h4 { font-size: 20px; line-height: 28px; font-weight: 700; margin-bottom: 16px; color: #1a1d31; } .st_features_item p { margin-bottom: 0; } .st_features_item:hover { background: #3452ff; } .st_features_item:hover i, .st_features_item:hover h4, .st_features_item:hover p { color: #fff; } /*============== st_service_area css =============*/ /*============= st_fact_area css =============*/ .st_fact_area { overflow: hidden; position: relative; background: #3452ff; z-index: 1; } .st_fact_area .parallax-effect { opacity: 0.14; height: 140%; background-position: center 50% !important; } .st_fact_item { padding-top: 30px; } .st_fact_item h1 { font: 700 100px/105px "Muli", sans-serif; color: #fff; } .st_fact_item sub { font-size: 40px; bottom: 0; } .st_fact_item p { font-size: 16px; font-weight: 600; margin-bottom: 0; color: #fff; } .st_fact_content .st_title_top, .st_fact_content .st_title { color: #fff; border-color: #fff; } .st_fact_content .st_title { margin-bottom: 35px; } .st_fact_content .st_btn { background: #fff; color: #3452ff; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .st_fact_content .st_btn:hover { -webkit-box-shadow: 0px 20px 60px 0px rgba(0, 12, 31, 0.1); box-shadow: 0px 20px 60px 0px rgba(0, 12, 31, 0.1); } /*============= st_fact_area css =============*/ /*============= business_fact_area css =============*/ .business_fact_area { position: relative; z-index: 1; } .business_fact_area .st_fact_item h1 { font-size: 80px; line-height: 80px; } /*============= business_fact_area css =============*/ /*============= st_action_area css =============*/ .st_action_area { position: relative; overflow: hidden; background: #151828; text-align: center; padding: 96px 0px; z-index: 1; } .st_action_area .parallax-effect { opacity: 0.3; height: 150%; background-position: center bottom !important; } .st_action_area h1 { font-weight: 700; font-size: 30px; line-height: 60px; color: #fff; margin-bottom: 32px; } .st_action_area h1 span { font-weight: 900; font-size: 50px; } .st_action_area .st_btn:hover { border-color: #fff; color: #fff; } /*============= st_action_area css =============*/ /*============= business_service_area css =============*/ .business_service_area { background: #f9f9fc; } .business_service_item { -webkit-box-shadow: 0px 4px 15px 0px rgba(0, 5, 36, 0.05); box-shadow: 0px 4px 15px 0px rgba(0, 5, 36, 0.05); padding: 50px 40px; background: #fff; text-align: center; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; cursor: pointer; } .business_service_item i { font-size: 40px; line-height: 45px; color: #3452ff; margin-bottom: 32px; display: inline-block; } .business_service_item .b_title { margin-bottom: 15px; } .business_service_item:hover { -webkit-box-shadow: 0px 15px 40px 0px rgba(0, 5, 36, 0.06); box-shadow: 0px 15px 40px 0px rgba(0, 5, 36, 0.06); } .read_btn { font-size: 14px; line-height: 18px; color: #1a1d31; font-weight: 600; display: inline-block; position: relative; -webkit-transition: color 0.3s linear; -o-transition: color 0.3s linear; transition: color 0.3s linear; margin-top: 25px; } .read_btn:before { content: ""; width: 0; height: 1px; background: #3452ff; bottom: 0; right: 0; position: absolute; -webkit-transition: width 0.3s linear; -o-transition: width 0.3s linear; transition: width 0.3s linear; } .read_btn:hover { color: #3452ff; } .read_btn:hover:before { width: 100%; left: 0; right: auto; } .b_title { font-size: 20px; font-weight: 700; line-height: 28px; } .b_p { font-size: 18px; } /*============= business_service_area css =============*/ /*================= agency_price_area css =============*/ .agency_price_area { background: #f9f9fc; } .price_item { padding: 50px; background-color: white; -webkit-box-shadow: 0px 4px 5px 0px rgba(0, 12, 31, 0.06); box-shadow: 0px 4px 5px 0px rgba(0, 12, 31, 0.06); text-align: center; border-radius: 6px; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; border: 1px solid transparent; cursor: pointer; position: relative; } .price_item .p_head { border-bottom: 1px solid #e8edf4; } .price_item .p_head h5 { font-size: 20px; line-height: 26px; color: #1a1d31; font-weight: 700; } .price_item .p_head p { font-size: 16px; line-height: 18px; color: #99a1af; } .price_item .rate { font-size: 54px; font-weight: 700; line-height: 60px; color: #1a1d31; padding: 30px 0px 20px; } .price_item .rate sub { font-weight: 400; color: #77798a; font-size: 16px; } .price_item ul { margin-bottom: 0; } .price_item ul li { font-weight: 400; font-size: 16px; line-height: 40px; color: #77798a; } .price_item ul li i { font-size: 12px; color: #3452ff; margin-right: 10px; } .price_item ul li i.ti-close { color: #fa1f1f; } .price_item .tag_label { font: 400 12px/22px "Muli", sans-serif; color: #fff; text-transform: uppercase; background: #3452ff; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); position: absolute; top: 23px; right: 0; padding: 8px 15px; border: 0; display: block; } .price_item .tag_label:after { content: ""; border-top: 19px solid #3452ff; border-bottom: 19px solid #3452ff; border-right: 11px solid transparent; border-left: 11px solid transparent; position: absolute; right: -11px; top: 0; } .price_item .price_btn { margin-top: 35px; color: #151828; border-color: #cbcbe2; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .price_item .price_btn:hover { background: #3452ff; border-color: #3452ff; color: #fff; -webkit-box-shadow: 0px 20px 40px 0px rgba(0, 12, 31, 0.1); box-shadow: 0px 20px 40px 0px rgba(0, 12, 31, 0.1); } .price_item:hover { border-color: #f6f8fc; -webkit-box-shadow: 0px 20px 40px 0px rgba(0, 12, 31, 0.1); box-shadow: 0px 20px 40px 0px rgba(0, 12, 31, 0.1); } /*================= agency_price_area css =============*/ /*================= service_tab_area css =============*/ .service_tab_area { position: relative; background: #151828; z-index: 1; padding-top: 180px; margin-bottom: 160px; } .service_tab_area .overlay_bg { background: url(../images/service_tab.jpg) no-repeat scroll center 0/cover; opacity: 0.30; height: 100%; position: absolute; width: 100%; top: 0; left: 0; } .s_tab_content { max-width: 470px; margin: 0 auto; color: #fff; } .s_tab_content h6 { font-size: 20px; font-weight: 600; color: #fff; } .s_tab_content h2 { font-weight: 700; font-size: 34px; color: #fff; margin-bottom: 28px; } .s_tab_content p { font-size: 18px; line-height: 28px; font-weight: 400; margin-bottom: 0; } .service_tab { border: 0px; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; position: relative; bottom: -150px; } .service_tab .nav-item { margin: 0; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .service_tab .nav-item:nth-child(2) .nav-link, .service_tab .nav-item:nth-child(5) .nav-link { background: #f6f6fb; } .service_tab .nav-item .nav-link { border-radius: 0px; text-align: center; border: 0px; font-size: 16px; font-weight: 600; padding: 71px 0px; color: #1a1d31; background: #fbfbfd; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .service_tab .nav-item .nav-link i { display: block; font-size: 40px; margin-bottom: 20px; } .service_tab .nav-item .nav-link.active { background: #3452ff; -webkit-transform: scaleY(1.099); -ms-transform: scaleY(1.099); transform: scaleY(1.099); color: #fff; } /*================= service_tab_area css =============*/ /*====================================================*/ /*====================================================*/ /*============= st_testimonial_area css =========*/ .st_testimonial_area .st_section_title { padding-left: 15px; padding-right: 15px; } .st_testimonial_slider { margin-top: -30px; } .st_testimonial_slider .item { background: #fff; -webkit-box-shadow: 0px 20px 40px 0px rgba(0, 5, 36, 0.06); box-shadow: 0px 20px 40px 0px rgba(0, 5, 36, 0.06); margin: 30px 30px 60px; padding: 40px 50px; position: relative; } .st_testimonial_slider .item .clients_img { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .st_testimonial_slider .item .clients_img .img { width: 60px; height: 60px; border-radius: 50%; overflow: hidden; margin-right: 25px; } .st_testimonial_slider .item .clients_img .img img { max-width: 100%; } .st_testimonial_slider .item .media-body h5 { font-size: 18px; color: #1a1d31; font-weight: 700; margin-bottom: 0; } .st_testimonial_slider .item .media-body p { font-size: 16px; margin-bottom: 0; padding-top: 0; } .st_testimonial_slider .item .ratting { position: absolute; right: 50px; font-size: 14px; color: #f6b60d; top: 45px; } .st_testimonial_slider .item .ratting:after { content: "\e60a \e60a \e60a \e60a" "\e60a"; font-family: 'themify'; } .st_testimonial_slider .item p { font-size: 18px; padding-top: 25px; } .owl-dots { text-align: center; } .owl-dots button.owl-dot { width: 8px; height: 8px; border: 1px solid transparent; border-radius: 50%; background-color: #cbcbda; margin: 0px 7px; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .owl-dots button.owl-dot.active { background: #fff; border-color: #3452ff; -webkit-transform: scale(1.6); -ms-transform: scale(1.6); transform: scale(1.6); } /*============= st_testimonial_area css =========*/ .business_testimonial_area .st_testimonial_slider .item { margin-left: 15px; margin-right: 15px; -webkit-box-shadow: 0px 15px 20px 0px rgba(0, 5, 36, 0.05); box-shadow: 0px 15px 20px 0px rgba(0, 5, 36, 0.05); } /*=========== business_clients_logo_area css =========*/ .business_clients_logo_area { padding: 60px 0px 100px; } .b_logo_info { margin: 0px; } .b_logo_info .b_log_item img { opacity: 0.35; -webkit-transition: opacity 0.3s linear; -o-transition: opacity 0.3s linear; transition: opacity 0.3s linear; } .b_logo_info .b_log_item:hover img { opacity: 1; } /*=========== business_clients_logo_area css =========*/ /*=========== agency_testimonial_area css =========*/ .agency_testimonial_area { background: #f9f9fc; } .agency_testimonial_slider .item .img { border: 3px solid #c1c1f9; width: 70px; height: 70px; border-radius: 50%; overflow: hidden; margin-right: 30px; } .agency_testimonial_slider .item .author { margin-bottom: 25px; } .agency_testimonial_slider .item .author h5 { font-size: 18px; line-height: 26px; color: #1a1d31; font-weight: 700; margin-bottom: 0; } .agency_testimonial_slider .item .author p { margin-bottom: 0; font-size: 16px; margin-bottom: 0; } .agency_testimonial_slider .item p { font-size: 18px; margin-bottom: 0; } .agency_testimonial_slider .owl-dots { margin-top: 80px; } .agency_testimonial_slider .owl-dots .owl-dot { background: #f9f9f9; border: 1px solid #a3a8b1; } .agency_testimonial_slider .owl-dots .owl-dot.active { background: #4040f3; -webkit-transform: scale(1.3); -ms-transform: scale(1.3); transform: scale(1.3); } /*=========== agency_testimonial_area css =========*/ /*====================================================*/ /*====================================================*/ /*============== business_team_area css =============*/ .business_team_info .st_btn { margin-top: 42px; } .business_team_item { margin-bottom: 30px; cursor: pointer; } .business_team_item .team_img { position: relative; z-index: 1; text-align: center; } .business_team_item .team_img img { max-width: 100%; } .business_team_item .team_img .social_icon { position: absolute; bottom: 0; right: 0; z-index: 1; background: #242639; width: 110px; height: 110px; -webkit-clip-path: polygon(0px 100%, 0px 100%, 100% 0px, 100% 100%); clip-path: polygon(0px 100%, 0px 100%, 100% 0px, 100% 100%); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; padding-bottom: 20px; padding-right: 8px; -webkit-transition: background 0.3s linear; -o-transition: background 0.3s linear; transition: background 0.3s linear; } .business_team_item .team_img .social_icon a { font-size: 14px; color: #fff; margin-right: 8px; } .business_team_item .team_img .hover_content { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(21, 24, 40, 0.7); z-index: 0; padding: 40px; opacity: 0; -webkit-transition: opacity 0.3s linear; -o-transition: opacity 0.3s linear; transition: opacity 0.3s linear; } .business_team_item .team_img .hover_content p { font-size: 18px; line-height: 28px; color: #fff; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); opacity: 0; -webkit-transition: opacity 0.7s linear, -webkit-transform 0.5s linear; transition: opacity 0.7s linear, -webkit-transform 0.5s linear; -o-transition: transform 0.5s linear, opacity 0.7s linear; transition: transform 0.5s linear, opacity 0.7s linear; transition: transform 0.5s linear, opacity 0.7s linear, -webkit-transform 0.5s linear; } .hover_content a{ color: #fff; } .business_team_item .content { padding: 20px 0px 0px 40px; } .business_team_item .content h4 { font-size: 20px; line-height: 28px; font-weight: 700; margin-bottom: 0; } .business_team_item .content h4:hover { color: #3452ff; -webkit-transition: color 0.5s linear; -o-transition: color 0.5s linear; transition: color 0.5s linear; } .business_team_item .content p { font-size: 16px; font-weight: 400; color: #77798a; margin-bottom: 0; } .business_team_item:hover .hover_content { opacity: 1; } .business_team_item:hover .hover_content p { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; } .business_team_item:hover .social_icon { background: #3452ff; } /*============== business_team_area css =============*/ .business_team_info_two .business_team_item .team_img .social_icon { width: 100%; -webkit-clip-path: inherit; clip-path: inherit; background: rgba(52, 82, 255, 0.9); height: auto; padding-bottom: 0; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 12px 0px; opacity: 0; -webkit-transition: opacity 0.7s linear; -o-transition: opacity 0.7s linear; transition: opacity 0.7s linear; } .business_team_info_two .business_team_item .team_img .social_icon a { width: 40px; height: 40px; border: 1px solid transparent; display: inline-block; border-radius: 50%; line-height: 40px; text-align: center; margin: 0px; -webkit-transition: all 0.3s linear, border 0.5s linear, -webkit-transform 0.6s linear; transition: all 0.3s linear, border 0.5s linear, -webkit-transform 0.6s linear; -o-transition: all 0.3s linear, transform 0.6s linear, border 0.5s linear; transition: all 0.3s linear, transform 0.6s linear, border 0.5s linear; transition: all 0.3s linear, transform 0.6s linear, border 0.5s linear, -webkit-transform 0.6s linear; -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); opacity: 0; } .business_team_info_two .business_team_item .team_img .social_icon a:hover { border-color: #fff; } .business_team_info_two .business_team_item:hover .team_img .social_icon { opacity: 1; } .business_team_info_two .business_team_item:hover .team_img .social_icon a { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } .business_team_info_two .st_btn { margin-top: 40px; } /*====================================================*/ /*====================================================*/ /*=============agency_portfolio_area css =============*/ .agency_portfolio_area .portfolio_gallery { -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 55px; } .w_35 { width: 36%; padding: 5px; } .w_20 { width: 1%; } .w_30 { width: 32%; padding: 5px; } .portfolio_filter { text-align: center; margin-bottom: 30px; } .portfolio_filter .work_portfolio_item { font-size: 16px; line-height: 22px; font-weight: 600; color: #77798a; display: inline-block; position: relative; cursor: pointer; } .portfolio_filter .work_portfolio_item:before { content: ""; width: 0; height: 1px; background: #3452ff; position: absolute; right: 0; bottom: 0; -webkit-transition: width 0.3s linear; -o-transition: width 0.3s linear; transition: width 0.3s linear; } .portfolio_filter .work_portfolio_item:hover, .portfolio_filter .work_portfolio_item.active { color: #3452ff; } .portfolio_filter .work_portfolio_item:hover:before, .portfolio_filter .work_portfolio_item.active:before { width: 100%; left: 0; } .portfolio_filter .work_portfolio_item + .work_portfolio_item { margin-left: 50px; } .portfolio_item { cursor: pointer; } .portfolio_item img { width: 100%; -webkit-transition: all 0.4s linear; -o-transition: all 0.4s linear; transition: all 0.4s linear; } .portfolio_item .portfolio_img { position: relative; z-index: 1; overflow: hidden; border-radius: 10px; } .portfolio_item .hover_bg { position: absolute; top: 0; width: 100%; height: 100%; left: 0; background: rgba(25, 28, 44, 0.7); z-index: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; opacity: 0; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .portfolio_item .hover_bg a { width: 50px; height: 50px; border-radius: 50%; background: #fff; text-align: center; font-size: 18px; line-height: 52px; color: #1a1d31; display: inline-block; } .portfolio_item:hover .hover_bg { opacity: 1; } .portfolio_item:hover img { -webkit-transform: scale(1.03); -ms-transform: scale(1.03); transform: scale(1.03); } /*============ business_portfolio_area css =============*/ .business_portfolio_area .portfolio_item { padding: 15px; } /*====================================================*/ /*====================================================*/ /*==============st_blog_area css ============ */ .st_blog_item { position: relative; z-index: 1; overflow: hidden; cursor: pointer; } .st_blog_item .h_overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #151828; opacity: 0.7; z-index: 0; -webkit-transition: opacity 0.3s linear; -o-transition: opacity 0.3s linear; transition: opacity 0.3s linear; } .st_blog_item .blog_content { position: absolute; bottom: 50px; width: 100%; padding: 40px 40px 0px; overflow: hidden; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; transition: all 0.5s linear; } .st_blog_item .blog_content .post_info { padding-bottom: 15px; } .st_blog_item .blog_content .post_info a { font-size: 16px; line-height: 18px; display: inline-block; font-weight: 400; color: #fff; } .st_blog_item .blog_content .post_info a + a { padding-left: 10px; } .st_blog_item .blog_content .post_info a + a:before { content: ""; width: 2px; height: 15px; display: inline-block; background: #fff; margin-right: 14px; top: 2px; position: relative; } .st_blog_item .blog_content h3 { font-size: 20px; line-height: 32px; font-weight: 700; color: #fff; margin-bottom: 0; } .st_blog_item .blog_content.hover_content { opacity: 0; -webkit-transition: opacity 0.3s linear; -o-transition: opacity 0.3s linear; transition: opacity 0.3s linear; } .st_blog_item .blog_content.hover_content p { font-size: 18px; line-height: 26px; margin-top: 22px; color: #fff; } .st_blog_item:hover .h_overlay { opacity: 0.3; } .st_blog_item:hover .blog_content_one { -webkit-transform: translateY(125%); -ms-transform: translateY(125%); transform: translateY(125%); } .st_blog_item:hover .hover_content { opacity: 1; -webkit-transition: opacity 0.5s 0.4s linear; -o-transition: opacity 0.5s 0.4s linear; transition: opacity 0.5s 0.4s linear; } .st_blog_item:hover p { display: block; } /*==============st_blog_area css ============ */ /*=============== business_blog_area css ================*/ .b_hover_overlay { content: ""; width: 100%; height: 100%; background: rgba(21, 24, 40, 0.5); top: 0; left: 0; position: absolute; z-index: 0; -webkit-transition: opacity 0.3s linear; -o-transition: opacity 0.3s linear; transition: opacity 0.3s linear; } .b_blog_info { margin-bottom: -30px; } .business_blog_item { margin-bottom: 30px; } .business_blog_item .business_blog_img { position: relative; z-index: 1; } .business_blog_item .business_blog_img img { max-width: 100%; } .business_blog_item .business_blog_img .b_hover_overlay { opacity: 0; } .business_blog_item .business_blog_img .arrow { width: 50px; height: 50px; line-height: 50px; position: absolute; top: 50%; left: 50%; margin-top: -25px; margin-left: -25px; text-align: center; font-size: 18px; color: #fff; border: 1px solid #fff; border-radius: 50%; -webkit-transform: translateY(50px); -ms-transform: translateY(50px); transform: translateY(50px); opacity: 0; -webkit-transition: opacity 0.7s linear, background 0.4s linear, color 0.3s, -webkit-transform 0.4s linear; transition: opacity 0.7s linear, background 0.4s linear, color 0.3s, -webkit-transform 0.4s linear; -o-transition: transform 0.4s linear, opacity 0.7s linear, background 0.4s linear, color 0.3s; transition: transform 0.4s linear, opacity 0.7s linear, background 0.4s linear, color 0.3s; transition: transform 0.4s linear, opacity 0.7s linear, background 0.4s linear, color 0.3s, -webkit-transform 0.4s linear; } .business_blog_item .business_blog_img .arrow:hover { background: #fff; color: #1a1d31; } .business_blog_item h3 { font-size: 18px; line-height: 26px; font-weight: 700; margin-bottom: 12px; margin-top: 30px; -webkit-transition: all 0.5s linear; -o-transition: all 0.5s linear; transition: all 0.5s linear; } .business_blog_item h3:hover { color: #3452ff; text-decoration: underline; } .business_blog_item .post_date { font-size: 16px; color: #77798a; } .business_blog_item:hover .business_blog_img .b_hover_overlay { opacity: 1; } .business_blog_item:hover .business_blog_img .arrow { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; } /*=============== business_blog_area css ================*/ .b_blog_info_two { margin-bottom: -30px; } .b_blog_info_two .business_blog_item { background: #fbfbfd; } .b_blog_info_two .business_blog_item .content { padding: 30px; } .b_blog_info_two .business_blog_item .content h3 { margin-top: 0; } .b_blog_info_two .business_blog_item .content p { margin: 15px 0px 5px; } .b_blog_info_two .business_blog_item:hover .content h3 { text-decoration: none; } /*============= agency_blog_area css =============*/ .agency_blog_info { margin-bottom: -30px; } .agency_blog_item { margin-bottom: 30px; } .agency_blog_item .agency_blog_img { position: relative; z-index: 1; } .agency_blog_item .agency_blog_img:before { content: ""; position: absolute; top: 0; left: 0; background: rgba(21, 24, 40, 0.5); width: 100%; height: 100%; opacity: 0; -webkit-transition: opacity 0.3s linear; -o-transition: opacity 0.3s linear; transition: opacity 0.3s linear; } .agency_blog_item h2 { font-size: 18px; line-height: 26px; color: #1a1d31; font-weight: 700; -webkit-transition: color 0.3s linear; -o-transition: color 0.3s linear; transition: color 0.3s linear; } .agency_blog_item:hover h2 { color: #3452ff; } .agency_blog_item:hover .agency_blog_img:before { opacity: 1; } .post_info { padding-top: 32px; } .post_info li { font-size: 16px; color: #77798a; display: inline-block; } .post_info li a { color: #77798a; -webkit-transition: color 0.3s linear; -o-transition: color 0.3s linear; transition: color 0.3s linear; } .post_info li a:hover { color: #3452ff; } .post_info li + li:before { content: ""; width: 1px; height: 15px; display: inline-block; background: #77798a; top: 2px; position: relative; margin: 0px 10px 0px 5px; } /*============= agency_blog_area css =============*/ /*============= blog_area css =============*/ .blog_item { -webkit-box-shadow: 0px 10px 20px 0px rgba(0, 12, 31, 0.06); box-shadow: 0px 10px 20px 0px rgba(0, 12, 31, 0.06); margin-bottom: 50px; } .blog_item .blog_content { padding: 35px 50px; } .blog_item h2 { font-size: 26px; line-height: 36px; color: #1a1d31; font-weight: 700; } .blog_item h2 a { color: #1a1d31; } .blog_item h2 a:hover { color: #3452ff; } .blog_item .post_info { padding-top: 5px; padding-bottom: 10px; } .blog_item .post_info li { font-size: 18px; color: #77798a; } .blog_item p { font-size: 18px; color: #9395a7; } .blog_item .blog_btn { font-size: 14px; line-height: 20px; font-weight: 600; color: #1a1d31; text-transform: uppercase; position: relative; display: inline-block; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; margin-top: 18px; } .blog_item .blog_btn:after { content: "\e649"; font-family: 'themify'; padding-left: 10px; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .blog_item .blog_btn:before { content: ""; position: absolute; height: 1px; background: #3452ff; left: 0; bottom: 0; width: 0; -webkit-transition: width 0.3s linear; -o-transition: width 0.3s linear; transition: width 0.3s linear; } .blog_item .blog_btn:hover { color: #3452ff; } .blog_item .blog_btn:hover:after { padding-left: 15px; } .blog_item .blog_btn:hover:before { width: 100%; } .page_numbers { padding-top: 10px; margin-bottom: 0; } .page_numbers li { display: inline-block; } .page_numbers li .page-numbers { width: 45px; height: 45px; border-radius: 50%; text-align: center; line-height: 45px; background: #f2f2f7; color: #77798a; display: inline-block; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .page_numbers li .page-numbers:hover, .page_numbers li .page-numbers.current { background: #4a4af4; border-color: #4a4af4; color: #fff; } .blog_sidebar { padding-left: 40px; } .blog_sidebar .widget .widget_title { font-size: 20px; font-weight: 700; color: #151828; margin-bottom: 30px; } .blog_sidebar .widget.widget_search .search-form .form-control { height: 56px; border: 1px solid #e0e3ec; border-radius: 4px; background: #fbfbfd; font-size: 14px; color: #1a1d31; -webkit-box-shadow: none; box-shadow: none; padding-left: 30px; position: relative; z-index: 0; } .blog_sidebar .widget.widget_search .search-form .form-control.placeholder { color: #b1b3c7; } .blog_sidebar .widget.widget_search .search-form .form-control:-moz-placeholder { color: #b1b3c7; } .blog_sidebar .widget.widget_search .search-form .form-control::-moz-placeholder { color: #b1b3c7; } .blog_sidebar .widget.widget_search .search-form .form-control::-webkit-input-placeholder { color: #b1b3c7; } .blog_sidebar .widget.widget_search .search-form button { border: 0px; background: transparent; padding: 0px; font-size: 16px; color: #4040f3; position: absolute; right: 30px; height: 100%; z-index: 1; cursor: pointer; } .blog_sidebar .widget.widget_recent_post .post_item { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .blog_sidebar .widget.widget_recent_post .post_item img { margin-right: 20px; } .blog_sidebar .widget.widget_recent_post .post_item .media-body h3 { font-size: 18px; line-height: 26px; color: #151828; font-weight: 600; } .blog_sidebar .widget.widget_recent_post .post_item .media-body .date { font-size: 14px; color: #77798a; } .blog_sidebar .widget.widget_recent_post .post_item .media-body h3:hover, .blog_sidebar .widget.widget_recent_post .post_item .media-body .date:hover { color: #3452ff; } .blog_sidebar .widget.widget_recent_post .post_item + .post_item { margin-top: 30px; } .blog_sidebar .widget.widget_categorie ul { margin-bottom: 0; margin-top: -5px; } .blog_sidebar .widget.widget_categorie ul li { font-size: 16px; } .blog_sidebar .widget.widget_categorie ul li a { color: #77798a; } .blog_sidebar .widget.widget_categorie ul li a span { border-bottom: 1px solid transparent; -webkit-transition: all .3s linear; -o-transition: all .3s linear; transition: all .3s linear; } .blog_sidebar .widget.widget_categorie ul li a:hover { color: #3452ff; } .blog_sidebar .widget.widget_categorie ul li a:hover span { border-color: #3452ff; } .blog_sidebar .widget.widget_categorie ul li em { float: right; font-style: normal; } .blog_sidebar .widget.widget_categorie ul li + li { margin-top: 12px; } .blog_sidebar .widget.widget_tag_cloud .post-tags { overflow: hidden; margin: -5px; } .blog_sidebar .widget.widget_tag_cloud .post-tags a { float: left; border: 1px solid #cacfdc; border-radius: 3px; text-align: center; padding: 3px 17px; font-size: 14px; color: #5d6068; margin: 5px; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .blog_sidebar .widget.widget_tag_cloud .post-tags a:hover { background: #3452ff; color: #fff; border-color: #3452ff; } .blog_sidebar .widget.flicker_widget { padding-left: 0; } .blog_sidebar .widget.widget_social ul { margin: -3px; } .blog_sidebar .widget.widget_social ul li { display: inline-block; margin: 3px; } .blog_sidebar .widget.widget_social ul li a { width: 45px; height: 45px; text-align: center; line-height: 45px; background: #f2f2f7; display: inline-block; border-radius: 50%; color: #888dae; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .blog_sidebar .widget.widget_social ul li a:hover { background: #3452ff; color: #fff; } .blog_sidebar .widget:not(:last-child) { margin-bottom: 60px; } /*============= blog_area css =============*/ /*============= blog_Single css =============*/ .blog_single { -webkit-box-shadow: none; box-shadow: none; } .blog_single .blog_content { -webkit-box-shadow: none; box-shadow: none; padding: 35px 0px 0px; } .blog_single .blog_content p { color: #9395a7; margin-bottom: 30px; } .blog_single .post_info { border-bottom: 1px solid #d6dbe8; padding-bottom: 20px; } .post-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; border-bottom: 1px solid #d6dbe8; border-top: 1px solid #d6dbe8; padding: 30px 0px; margin-top: 45px; } .post-info .social_icon { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .post-info .social_icon h4 { font-size: 18px; line-height: 28px; color: #77798a; background: #f1f1f7; border-radius: 45px; padding: 9px 36px; display: inline-block; margin-bottom: 0; margin-right: 10px; cursor: pointer; } .post-info .social_icon ul { visibility: hidden; position: absolute; left: 19%; } .post-info .social_icon ul li { -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); visibility: hidden; opacity: 0; -webkit-transition: opacity 0.4s linear, -webkit-transform 0.5s linear; transition: opacity 0.4s linear, -webkit-transform 0.5s linear; -o-transition: transform 0.5s linear, opacity 0.4s linear; transition: transform 0.5s linear, opacity 0.4s linear; transition: transform 0.5s linear, opacity 0.4s linear, -webkit-transform 0.5s linear; } .post-info .social_icon:hover ul li { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; visibility: visible; } .post-info ul { margin-bottom: 0; } .post-info ul li { display: inline-block; } .post-info ul li a { width: 45px; height: 45px; border-radius: 50%; background: #f2f2f7; color: #888dae; font-size: 14px; line-height: 45px; display: inline-block; text-align: center; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .post-info ul li a:hover { background: #4a4af4; color: #fff; } .post-info .pagination li + li { margin-left: 10px; } .blog_recent_post { border-bottom: 1px solid #d6dbe8; padding: 20px 0px 40px; margin-bottom: 50px; } .blog_title { margin-bottom: 50px; } .blog_title h4 { font-size: 20px; line-height: 24px; color: #151828; font-weight: 700; } .blog_title .border_bottom { width: 40px; height: 2px; background: #4040f3; } .recent_post_item { margin-bottom: 40px; } .recent_post_item h2 { font-size: 18px; line-height: 24px; color: #1a1d31; font-weight: 700; } .comment-box { margin-bottom: 80px; } .comment-box .post_comment .post_author .media-left { margin-right: 40px; } .comment-box .post_comment .post_author .media-body h4 { font-size: 16px; line-height: 28px; color: #151828; font-weight: 700; } .comment-box .post_comment .post_author .media-body h4 span { font-style: italic; color: #acaebe; font-weight: 400; } .comment-box .post_comment .post_author .media-body h4 span:before { content: "/"; display: inline-block; margin: 0px 10px 0px 6px; } .comment-box .post_comment .post_author .media-body p { font-size: 18px; line-height: 26px; color: #9395a7; } .comment-box .post_comment .post_author .media-body .reply { font-size: 16px; color: #77798a; } .comment-box .post_comment .post_author .media-body .reply i { padding-right: 8px; } .comment-box .post_comment .post_author .media-body .reply:hover { color: #3452ff; } .comment-box .post_comment .reply-comment { padding-left: 100px; margin-top: 50px; } .comment-box .post_comment:not(:last-child) { margin-bottom: 50px; } .get_quote_form .form-group { margin-bottom: 20px; } .get_quote_form .form-group .form-control { font-size: 16px; line-height: 22px; color: #9395a7; background: #fcfcff; border-color: #efeff9; height: 60px; padding-left: 30px; } .get_quote_form .form-group .form-control.placeholder { color: #9395a7; } .get_quote_form .form-group .form-control:-moz-placeholder { color: #9395a7; } .get_quote_form .form-group .form-control::-moz-placeholder { color: #9395a7; } .get_quote_form .form-group .form-control::-webkit-input-placeholder { color: #9395a7; } .get_quote_form .form-group .form-control:focus { -webkit-box-shadow: 0px 20px 20px 0px rgba(0, 12, 31, 0.08); box-shadow: 0px 20px 20px 0px rgba(0, 12, 31, 0.08); background: #fff; } .get_quote_form .form-group textarea.form-control { height: 250px; padding-top: 24px; } .get_quote_form .st_btn { margin-top: 10px; } /*============= blog_Single css =============*/ /*====================================================*/ /*====================================================*/ /*=============== action_info_area css ============*/ .action_info_item { padding: 99px 140px; } .action_info_item i { font-size: 40px; color: #c2cafb; margin-right: 30px; } .action_info_item h4 { font-size: 16px; font-weight: 600; color: #fff; margin-bottom: 4px; } .action_info_item a, .action_info_item p { font-size: 14px; font-weight: 400; color: #c2cafb; margin-bottom: 0; } .action_info_item.one { background: #3452ff; } .action_info_item.two { background: #334ff2; } .action_info_item.three { background: #3753f6; } /*=============== action_info_area css ============*/ /*=============== agency_logo_area css ============*/ .agency_logo_area { background: #f9f9fc; padding: 100px 0px 80px; } .agency_slider .owl-stage { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .agency_slider .agency_logo_item a { display: block; } .agency_slider .agency_logo_item a:hover img { opacity: 1; -webkit-filter: grayscale(0); filter: grayscale(0); } .agency_slider .agency_logo_item img { width: auto; -webkit-filter: grayscale(1); filter: grayscale(1); opacity: 0.20; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .agency_slider .owl-dots button.owl-dot { border-color: #a3a8b0; background: #fff; margin-top: 50px; } .agency_slider .owl-dots button.owl-dot.active { background: #3452ff; border-color: #3452ff; } /*=============== agency_logo_area css ============*/ /*=============== contact_area css ============*/ .contact_info { max-width: 970px; margin: 0 auto; } .contact_info_item { margin-bottom: 30px; } .contact_info_item i { font-size: 40px; color: #4040f3; margin-right: 30px; } .contact_info_item h4 { font-size: 16px; line-height: 18px; color: #1a1d31; margin-bottom: 14px; font-weight: 700; } .contact_info_item p, .contact_info_item a { font-size: 16px; line-height: 22px; color: #77798a; display: block; } .contact_info_item a:hover { color: #3452ff; } .contact_form_box { padding-top: 20px; } .contact_form_box .form-group { margin-bottom: 20px; } .contact_form_box .form-group input, .contact_form_box .form-group textarea { font-size: 16px; line-height: 28px; border: 1px solid #efeff9; background: #fcfcff; border-radius: 3px; width: 100%; padding-left: 30px; outline: none; -webkit-transition: all 0.2s linear; -o-transition: all 0.2s linear; transition: all 0.2s linear; } .contact_form_box .form-group input.placeholder, .contact_form_box .form-group textarea.placeholder { color: #9395a7; } .contact_form_box .form-group input:-moz-placeholder, .contact_form_box .form-group textarea:-moz-placeholder { color: #9395a7; } .contact_form_box .form-group input::-moz-placeholder, .contact_form_box .form-group textarea::-moz-placeholder { color: #9395a7; } .contact_form_box .form-group input::-webkit-input-placeholder, .contact_form_box .form-group textarea::-webkit-input-placeholder { color: #9395a7; } .contact_form_box .form-group input:focus, .contact_form_box .form-group textarea:focus { -webkit-box-shadow: 0px 20px 20px 0px rgba(0, 12, 31, 0.08); box-shadow: 0px 20px 20px 0px rgba(0, 12, 31, 0.08); background: #fff; } .contact_form_box .form-group input { height: 60px; } .contact_form_box .form-group textarea { height: 250px; padding-top: 18px; } .mapBox { height: 450px; } #success, #error { display: none; } /*=============== contact_area css ============*/ /*====================================================*/ /*====================================================*/ /*============ st_footer_area css ==============*/ .st_footer_area { background: #1a1d31; } .footer_top { padding: 120px 0px 70px; } .f_widget .f_title { color: #fff; font-size: 20px; line-height: 30px; font-weight: 700; margin-bottom: 30px; } .f_widget p, .f_widget a { font-size: 16px; line-height: 26px; color: #c6cade; } .f_widget.about_widget .f_logo { margin-bottom: 25px; display: inline-block; } .f_widget.about_widget ul { margin-bottom: 0px; padding-top: 10px; } .f_widget.about_widget ul li { display: inline-block; } .f_widget.about_widget ul li a { font-size: 14px; color: #757991; margin-right: 8px; -webkit-transition: color 0.3s linear; -o-transition: color 0.3s linear; transition: color 0.3s linear; } .f_widget.about_widget ul li a:hover { color: #3452ff; } .f_widget.link_widget { padding-left: 100px; } .f_widget.link_widget ul { margin-bottom: 0; } .f_widget.link_widget ul li a { font-size: 16px; line-height: 20px; position: relative; -webkit-transition: color 0.3s linear; -o-transition: color 0.3s linear; transition: color 0.3s linear; } .f_widget.link_widget ul li a:before { content: ""; width: 0; position: absolute; height: 1px; right: 0; bottom: 0; background: #3452ff; -webkit-transition: width 0.3s linear; -o-transition: width 0.3s linear; transition: width 0.3s linear; } .f_widget.link_widget ul li a:hover { color: #3452ff; } .f_widget.link_widget ul li a:hover:before { right: auto; width: 100%; left: 0; } .f_widget.link_widget ul li:not(:last-child) { margin-bottom: 8px; } .border-line { width: 100%; height: 1px; background: #272a43; } .footer_bottom { text-align: center; } .footer_bottom p { margin-bottom: 0; font-size: 14px; line-height: 26px; color: #6f738c; padding: 17px 0px; } .footer_bottom a { color: #6f738c; } /*============ business footer area css =============*/ .business_footer_top { padding: 120px 0px 80px; } .business_footer_top .f_widget.about_widget { padding-right: 90px; } .business_footer_top .f_widget.link_widget { padding-left: 0; } .flicker_widget { padding-left: 30px; } .flicker_widget ul { margin: 0px -2px -5px; } .flicker_widget ul li { width: calc(97% / 3); padding: 5px 2px; display: inline-block; } .flicker_widget ul li img { width: 100%; max-width: 100%; } /*====================================================*/ .news-class { margin: 0 auto; /* background-color: #75b85b; color: #fff; border-color: #75b85b;*/ } .news-class a { display: block; text-align: left; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; margin-right: 90px; margin-left: 20px; } .news-class span { line-height: 27px; margin-right: 0; float: right; text-align: right; color: #3c4d6b; } .news-class ul { padding-left: 0px; } .news-class li { border-bottom: 1px dotted #ccc; list-style-type: none; line-height: 30px; margin-bottom:10px; margin-right: 10px; background:url("../images/dot.gif") no-repeat left; } .paging { color:#0168b7; font-size: 14px; margin:10px auto; text-align: center; padding: 30px 0; } .paging span { color:#ddd; font-size: 14px; margin-left: 5px; border: 1px #ddd solid; padding: 5px; } .paging a { color: #333; padding: 0; margin: 0; } .paging a:hover { color: #0168b7; } .newsmain { margin: 50px auto; font-size: 18px; line-height: 2; width: 96%; height: auto; } @media only screen and (max-width: 480px) { .newsmain img { width: 96%; } } /*-------------------------------------------------------------- # About --------------------------------------------------------------*/ .about { min-height: 600px; margin-bottom: 40px; } .about .content h2 { font-weight: 600; font-size: 32px; text-align: left; margin: 40px 0; padding-left: 10px; line-height: 32px; background-color: #eeeeee; padding: 10px; border-left: #3452ff solid 5px; } .about .content h3 { font-weight: 600; font-size: 26px; text-align: center; } .about .content h5 { text-align: center; } .about .content ul { list-style: none; padding: 0; width: 95%; margin: 0 auto; } .about .content ul li { padding-bottom: 5px;; border-bottom: 1px solid #eef; list-style-type: none; line-height: 30px; margin-bottom:10px; margin-right: 10px; background:url("../images/dot.gif") no-repeat left; } .about .content ul i { font-size: 20px; padding-right: 4px; color: #005ca1; } .about .content .learn-more-btn { background: #005ca1; color: #fff; border-radius: 50px; padding: 8px 25px 9px 25px; white-space: nowrap; transition: 0.3s; font-size: 14px; display: inline-block; } .about .content .learn-more-btn:hover { background: #3ac162; color: #fff; } .about .content a { display: block; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; margin-left: 20px; } .about .content .spanright { line-height: 27px; margin-right: 0; float: right; text-align: right; } @media (max-width: 768px) { .about .content .learn-more-btn { margin: 0 48px 0 0; padding: 6px 18px; } } .section-title h2 { font-size: 32px; font-weight: 600; margin-bottom: 6px; padding-bottom: 10px; color: #b91314; } .bg_color1{ background-color: #eee; } .bg_color2{ background-color: #f6f6f6; } .bottom-bar { line-height: 3; font-size: 14px; color: #ccc; } .bottom-bar li { width: 25%; text-align: center; float: left; list-style-type: none; } .banner_title { background-color: #f6f6f6; height: 80px; } .banner_title ul { margin-top: 15px; } .banner_title li { width: 23%; float: left; list-style-type: none; margin: 0 1%; } .banner_title a { background-color: #f96747; padding: 10px 0; text-align: center; font-size: 24px; width: 100%; display: block; color: #fff; font-weight:600; } .banner_title a:hover { background-color: rgb(1,104,183,0.9); color: #ff0; } /* CSS Document */ .toolbar-item,.toolbar-layer{background:url(../images/toolbar.png) no-repeat;} .toolbar{position:fixed;right:0px;bottom:50px;}/*鍋囪缃戦〉瀹藉害涓?200px锛屽鑸潯鍦ㄥ彸渚ф偓娴?/ .toolbar-item{display:block;width:52px;height:52px;margin-top:1px;position:relative;-moz-transition:background-position 1s;-ms-transition:background-position 1s;-o-moz-transition:background-position 1s;-webkit-moz-transition:background-position 1s;transition:background-position 1s;} .toolbar-item:hover .toolbar-layer{opacity:1;filter:alpha(opacity=100);transform:scale(1);-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);} .toolbar-item-weixin{background-position:0 -798px;} .toolbar-item-weixin:hover{background-position:0 -860px;} .toolbar-item-weixin .toolbar-layer{height:212px;background-position:0 0;} .toolbar-item-feedback{background-position:0 -426px;} .toolbar-item-feedback:hover{background-position:0 -488px;} .toolbar-item-app{background-position:0 -550px;} .toolbar-item-app:hover{background-position:0 -612px;} .toolbar-item-app .toolbar-layer{height:194px;background-position:0 -222px;} .toolbar-item-top{background-position:0 -674px;} .toolbar-item-top:hover{background-position:0 -736px;} .toolbar-layer{position:absolute;right:46px;bottom:-10px;width:172px;opacity:0;filter:alpha(opacity=0); transform-origin: 95% 95%;-moz-transform-origin: 95% 95%;-ms-transform-origin: 95% 95%;-o-transform-origin: 95% 95%;-webkit-transform-origin: 95% 95%;transform:scale(0.01); -moz-transform:scale(0.01);-ms-transform:scale(0.01);-o-transform:scale(0.01);-webkit-transform:scale(0.01);transition:all 1s;-moz-transition:all 1s;-ms-transition:all 1s;-o-transition:all 1s;-webkit-transition:all 1s;}