[ Mini Kiebo ]
Server: Windows NT DESKTOP-5B8S0D4 6.2 build 9200 (Windows 8 Professional Edition) i586
Path:
D:
/
Backup
/
Data Shendy
/
Back up Shendy
/
DATA
/
PT TSP
/
Web TSP
/
gifatt
/
assets
/
css
/
[
Home
]
File: style.css
/*------------------------------------------------------------- Template Name: Gifatt Template URL: Author Name: SoftTech IT Author URL: https://themeforest.net/user/softtech-it/portfolio Version: 1.0 Description: Tags: agency, personal portfolio Text Domain: gifatt -------------------------------------------------------------*/ /*------------------------------------------------------------- TABLE OF CONTENTS: --------------------------------------------------------------- >> Author CSS >> Navbar >> Header Section >> Footer Section >> Breadcrumb Section >> Preloader >> Button >> Form >> Theme >> Homepage 1 >> Service Page >> Single Service Page >> Single Portfolio >> Contact Page >> Blog Page >> About Page >> Blog Single Page >> Homepage 2 >> Header 2 >> Footer 2 --------------------------------------------------------------*/ @import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&family=Viga&display=swap"); /* Author CSS */ body { margin: 0; color: #221b68; font-family: "Roboto", sans-serif; } h1, h2, h3, h4, h5, h6 { font-family: "Roboto", sans-serif; font-weight: 700; text-transform: capitalize; line-height: 1.2; margin-bottom: 0; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } h1 { color: #221b68; font-size: 72px; font-family: "Viga", sans-serif; } @media (max-width: 575.98px) { h1 { font-size: 40px; } } h2 { color: #221b68; font-size: 48px; font-family: "Viga", sans-serif; font-weight: 400; } h3 { color: #221b68; font-size: 24px; } h4 { color: #221b68; font-size: 18px; } h5 { color: #221b68; font-size: 16px; } h6 { color: #ff6d3c; font-size: 14px; margin-bottom: 0; } p { color: #221b68; font-size: 16px; margin-bottom: 10px; } ul { margin: 0; padding: 0; list-style: none; } a:hover, a:focus { text-decoration: none; outline: none; } input:focus, textarea:focus, select:focus, button:focus, .slick-slide { outline: none; } button { cursor: pointer; } img { width: 100%; height: auto; display: block; } a { color: #221b68; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } /* Navbar */ .main-menu { text-align: right; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } @media (max-width: 991.98px) { .main-menu { -webkit-transition: initial; -o-transition: initial; transition: initial; } } .main-menu li { display: inline-block; position: relative; } .main-menu li a { color: #221b68; text-transform: capitalize; font-family: "Roboto", sans-serif; font-weight: 500; font-size: 16px; padding: 40px 20px; } @media (min-width: 992px) and (max-width: 1199.98px) { .main-menu li a { padding: 40px 12px; } } .main-menu li:hover::after { color: #ff6d3c; } .main-menu li:hover a { color: #ff6d3c; } @media (min-width: 992px) { .main-menu li.has-submenu::after { content: '\f078'; font-family: 'Font Awesome 5 Free'; font-weight: 900; position: absolute; top: 5px; right: 5px; font-size: 10px; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } } @media (min-width: 992px) and (min-width: 992px) and (max-width: 1199.98px) { .main-menu li.has-submenu::after { right: -4px; } } @media (min-width: 992px) { .main-menu li .submenu { position: absolute; top: 170%; left: 0%; z-index: 44; background: #ff6d3c; width: 220px; text-align: initial; padding: 20px; opacity: 0; visibility: hidden; display: none; border-radius: 5px; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .main-menu li .submenu li { display: block; margin-right: 0; line-height: 1.7; } .main-menu li .submenu li a { color: #ffffff; padding: 0; margin-bottom: 10px; width: 100%; display: inline-block; } .main-menu li .submenu li a:hover { margin-left: 5px; } .main-menu li:hover .submenu { top: 209%; visibility: visible; opacity: 1; display: block; } } .mean-container .mean-bar { background: transparent; } @media (max-width: 575.98px) { .mean-container .mean-bar a { top: -13px; } } @media (max-width: 575.98px) { .mean-container .mean-bar { z-index: 9999; } } .mean-container .mean-bar a.meanmenu-reveal { background-color: #ff6d3c; border-radius: 5px; } .mean-container .mean-bar .mean-nav { background: #ff6d3c; } @media (max-width: 575.98px) { .mean-container .mean-bar .mean-nav { margin-top: 35px; } } .mean-container.mobile-menu2 .mean-bar a { top: 22px; right: 122px !important; } @media (max-width: 767px) { .mean-container.mobile-menu2 .mean-bar a { top: 20px; right: 10px !important; } } @media (max-width: 575.98px) { .mean-container.mobile-menu2 .mean-bar { z-index: 9999; } } .mean-container.mobile-menu2 .mean-bar a.meanmenu-reveal { background-color: #ff6d3c; border-radius: 5px; } .mean-container.mobile-menu2 .mean-bar .mean-nav { background: primary-color; margin-top: 78px; } .mean-container.mobile-menu2 .mean-bar .mean-nav ul li a.mean-expand { width: 25px; height: 25px; right: 0 !important; } .main-menu2 li a { font-size: 14px; color: #ffffff; } .main-menu2 li.has-submenu:hover::after { color: #ff6d3c; } .main-menu2 li.has-submenu::after { color: #ffffff; } /* Header Section */ html { overflow-x: hidden; } body { position: relative; overflow-x: hidden; } .hambinfo { width: 350px; height: 100vh; -webkit-box-shadow: 0 0 25px 0px rgba(130, 36, 5, 0.15); box-shadow: 0 0 25px 0px rgba(130, 36, 5, 0.15); overflow-y: scroll; position: absolute; top: 0; right: -350px; z-index: 999; -webkit-transition: .5s; -o-transition: .5s; transition: .5s; opacity: 0; visibility: hidden; } .hambinfo.active { right: 0; opacity: 1; visibility: visible; } .hambinfo .hamb-content { background: #ffffff; padding: 30px; -webkit-transition: .5s; -o-transition: .5s; transition: .5s; } .hambinfo .hamb-content .hambinfo-close { font-size: 30px; float: right; color: #221b68; cursor: pointer; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; -webkit-transform: scale(0.9); -ms-transform: scale(0.9); transform: scale(0.9); } .hambinfo .hamb-content .hambinfo-close:hover { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .hambinfo .hamb-content .logo img { width: 160px; margin-bottom: 30px; } @media (min-width: 768px) and (max-width: 991.98px) { .hambinfo .hamb-content .logo img { width: 120px; } } @media (max-width: 767px) { .hambinfo .hamb-content .logo img { width: 80px; } } .hambinfo .hamb-content .aboutus { margin-bottom: 50px; } .hambinfo .hamb-content .aboutus h3 { margin-bottom: 20px; } .hambinfo .hamb-content .aboutus p { margin-bottom: 25px; } .hambinfo .hamb-content .aboutus ul li { line-height: 2.5; font-weight: 500; } .hambinfo .hamb-content .aboutus ul li span { color: #ff6d3c; margin-right: 10px; } .header-area .separator hr { border-color: #f1f1f1; margin-top: 3px; } .header-area .header-top .header-top-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } .header-area .header-top .header-top-wrapper .contact-info { padding: 20px 0; } @media (max-width: 575.98px) { .header-area .header-top .header-top-wrapper .contact-info { padding: 10px 0; } } .header-area .header-top .header-top-wrapper .contact-info span { font-family: "Roboto", sans-serif; font-weight: 500; font-size: 18px; color: #221b68; } .header-area .header-top .header-top-wrapper .contact-info span span { width: 30px; height: 30px; line-height: 30px; text-align: center; border: 1px solid #ff6d3c; border-radius: 50%; color: #ff6d3c; display: inline-block; background: transparent; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .header-area .header-top .header-top-wrapper .contact-info span span:hover { color: #ffffff; background: #ff6d3c; } .header-area .header-top .header-top-wrapper .social-box { padding: 20px 0; } @media (max-width: 575.98px) { .header-area .header-top .header-top-wrapper .social-box { padding: 10px 0; } } .header-area .header-top .header-top-wrapper .social-box span a { color: #ff6d3c; border: 1px solid #ff6d3c; border-radius: 50%; line-height: 30px; width: 30px; height: 30px; display: inline-block; text-align: center; background: transparent; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; margin-right: 10px; } .header-area .header-top .header-top-wrapper .social-box span a:hover { color: #ffffff; background: #ff6d3c; } .header-area .header-top .header-top-wrapper .hambmenu-icon { cursor: pointer; } .header-area .header-top .header-top-wrapper .hambmenu-icon span { background: #ff6d3c; color: #ffffff; width: 65px; height: 65px; line-height: 65px; text-align: center; display: inline-block; font-size: 24px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; } .header-area .header-bottom .logo { position: relative; z-index: 111; } .header-area .header-bottom .logo img { width: 160px; } @media (min-width: 768px) and (max-width: 991.98px) { .header-area .header-bottom .logo img { width: 120px; } } @media (max-width: 767px) { .header-area .header-bottom .logo img { width: 120px; } } .header-area .header-bottom .menu-toggle::after { content: '\f0c9'; font-family: "Font Awesome 5 Free"; font-weight: 900; font-size: 24px; } @media (max-width: 767px) { .header-area .header-bottom .menu-toggle { position: absolute; top: 0; right: 15px; } } .header-area .header-bottom .menu-toggle.active::after { content: '\f00d'; } .header-area .header-bottom .lan_wrapper { position: relative; z-index: 111; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } @media (min-width: 576px) and (max-width: 767.98px) { .header-area .header-bottom .lan_wrapper { -ms-flex-pack: distribute; justify-content: space-around; } } @media (max-width: 575.98px) { .header-area .header-bottom .lan_wrapper { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-top: 25px; } } .header-area .header-bottom .lan_wrapper .lang-switcher { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-right: 20px; padding: 14px 0; } .header-area .header-bottom .lan_wrapper .lang-switcher .flag { margin-right: 10px; width: 30px; border-radius: 50%; display: inline-block; overflow: hidden; } .header-area .header-bottom .lan_wrapper .lang-switcher .lang { color: #535c7c; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; font-weight: 700; } .header-area .header-bottom .lan_wrapper .lang-switcher .lang-list { background-color: #ffffff; padding: 12px; position: absolute; top: 120%; left: 0px; width: 100px; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; border: 1px solid #f1f1f1; border-radius: 5px; } .header-area .header-bottom .lan_wrapper .lang-switcher .lang-list.lang-list-open { opacity: 1; visibility: visible; } .header-area .header-bottom .lan_wrapper .lang-switcher .lang-list li { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 8px 5px; cursor: pointer; border-bottom: 1px solid #f1f1f1; } .header-area .header-bottom .lan_wrapper .lang-switcher .lang-list li:last-child { border-bottom: initial; } .header-area .header-bottom .lan_wrapper .lang-switcher .lang-list li span { margin-right: 6px; border-radius: 50%; } .header-area .header-bottom .lan_wrapper .lang-switcher .lang-list li a { color: #221b68; display: block; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } /* Header 2 */ .header-area2 { border-bottom: 1px solid #7b48b5; position: absolute; top: 0; left: 0; width: 100%; z-index: 99; } .header-area2 .menu-toggle.menu-toggle2 { top: 30px; } @media (min-width: 992px) and (max-width: 1199.98px) { .header-area2 .header-bottom .logo { margin-left: 60px; } } @media (min-width: 1200px) and (max-width: 1439.98px) { .header-area2 .header-bottom .logo { margin-left: 60px; } } .header-area2 .hambmenu-icon { position: absolute; top: 0; left: 0; cursor: pointer; } @media (min-width: 768px) and (max-width: 991.98px) { .header-area2 .hambmenu-icon { left: initial; right: 5%; top: 10px; z-index: 8888; } } @media (min-width: 992px) and (max-width: 1199.98px) { .header-area2 .hambmenu-icon { top: 10px; z-index: 8888; } } @media (min-width: 1200px) and (max-width: 1439.98px) { .header-area2 .hambmenu-icon { top: 30px; z-index: 8888; } } .header-area2 .hambmenu-icon span { background: #ff6d3c; color: #ffffff; width: 110px; height: 110px; line-height: 110px; text-align: center; display: inline-block; font-size: 24px; } @media (min-width: 768px) and (max-width: 991.98px) { .header-area2 .hambmenu-icon span { width: 80px; height: 80px; line-height: 80px; } } @media (min-width: 992px) and (max-width: 1199.98px) { .header-area2 .hambmenu-icon span { width: 80px; height: 80px; line-height: 80px; } } @media (min-width: 1200px) and (max-width: 1439.98px) { .header-area2 .hambmenu-icon span { width: 50px; height: 50px; line-height: 50px; } } .header-area2 .btn-box .btn2 { border-radius: 10px; } /* Footer Section */ .footer-area { background: -webkit-linear-gradient(127deg, #fdffda 0%, #f3fff6 100%); background: -o-linear-gradient(127deg, #fdffda 0%, #f3fff6 100%); background: linear-gradient(323deg, #fdffda 0%, #f3fff6 100%); position: relative; } .footer-area .foo-shapes img { width: inherit; } .footer-area .foo-shapes .a1 { position: absolute; top: 50%; left: 10%; } .footer-area .foo-shapes .a2 { position: absolute; top: 50%; right: 10%; } .footer-area .footer-top .widget { margin-bottom: 30px; } @media (max-width: 575.98px) { .footer-area .footer-top .widget { text-align: center; } } .footer-area .footer-top .widget .logo { margin-bottom: 20px; } .footer-area .footer-top .widget .logo img { width: 160px; } @media (max-width: 575.98px) { .footer-area .footer-top .widget .logo img { margin: 0 auto; } } @media (min-width: 768px) and (max-width: 991.98px) { .footer-area .footer-top .widget .logo img { width: 120px; } } @media (max-width: 767px) { .footer-area .footer-top .widget .logo img { width: 120px; } } .footer-area .footer-top .widget h3 { font-family: "Viga", sans-serif; font-weight: 400; margin-bottom: 20px; } .footer-area .footer-top .widget ul li { line-height: 2; } .footer-area .footer-top .widget ul li a { text-transform: capitalize; font-family: "Roboto", sans-serif; font-weight: 400; font-size: 16px; } .footer-area .footer-top .widget ul li a:hover { color: #ff6d3c; } .footer-area .footer-top .copyright p a { font-weight: 700; } .footer-area .footer-top .copyright p a:hover { color: #ff6d3c; } /* Footer 2 */ .footer-area2 { position: relative; overflow: hidden; } .footer-area2 .foo-shapes .a3 { position: absolute; bottom: -60px; left: 0; } .footer-area2 .foo-shapes .a4 { position: absolute; bottom: -60px; right: 0; } .footer-area2 .footer-top .widget h3 { margin-left: 40px; } @media (max-width: 575.98px) { .footer-area2 .footer-top .widget h3 { margin-left: 0px; } } .footer-area2 .footer-top .widget h3::before { content: ''; height: 4px; width: 25px; background: #ff6d3c; position: absolute; top: 14px; left: 18px; } @media (max-width: 575.98px) { .footer-area2 .footer-top .widget h3::before { display: none; } } .footer-area2 .footer-top .social-box span { width: 30px; height: 30px; text-align: center; line-height: 30px; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; display: inline-block; border-radius: 50%; background: #fffcf1; } .footer-area2 .footer-top .social-box span:hover { background: #ff6d3c; } .footer-area2 .footer-top .social-box span:hover a { color: #ffffff; } .footer-area2 .copyright2 .divider hr { border-color: #ff6d3c; opacity: .2; } .footer-area2 .copyright2 p a { font-weight: 700; } .footer-area2 .copyright2 p a:hover { color: #7027c3; } /* Breadcrumb Section */ .breadcrumb-section { background: -webkit-linear-gradient(127deg, #fdffda 0%, #f3fff6 100%); background: -o-linear-gradient(127deg, #fdffda 0%, #f3fff6 100%); background: linear-gradient(323deg, #fdffda 0%, #f3fff6 100%); position: relative; } .breadcrumb-section .bread-shapes img { width: inherit; } .breadcrumb-section .bread-shapes .a1 { position: absolute; top: 5%; left: 10%; } .breadcrumb-section .bread-shapes .a2 { position: absolute; top: 5%; right: 10%; } .breadcrumb-section h2 { text-align: center; } .breadcrumb-section .breadcrumb { background-color: initial; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .breadcrumb-section .breadcrumb-item { color: #221b68; font-family: "Roboto", sans-serif; font-weight: 500; font-size: 18px; text-transform: capitalize; } .breadcrumb-section .breadcrumb-item a:hover { color: #ff6d3c; } .breadcrumb-section .breadcrumb-item + .breadcrumb-item::before { content: "-"; } /* Preloader */ .preloader-inner { position: fixed; left: 0; top: 0; z-index: 9999; background-color: #ffffff; width: 100%; height: 100%; 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; } .preloader-inner .cancel-preloader { position: absolute; bottom: 30px; right: 30px; } .preloader-inner .cancel-preloader a { background-color: #ffffff; font-weight: 600; text-transform: capitalize; color: #ff6d3c; width: 200px; height: 50px; text-align: center; line-height: 50px; border-radius: 30px; display: block; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .preloader-inner .cancel-preloader a:hover { background-color: #221b68; color: #ffffff; } .spinner { width: 70px; text-align: center; } .spinner > div { width: 15px; height: 15px; background-color: #ff6d3c; border-radius: 100%; display: inline-block; -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both; animation: sk-bouncedelay 1.4s infinite ease-in-out both; } .spinner .bounce1 { -webkit-animation-delay: -0.32s; animation-delay: -0.32s; } .spinner .bounce2 { -webkit-animation-delay: -0.16s; animation-delay: -0.16s; } @-webkit-keyframes sk-bouncedelay { 0%, 80%, 100% { -webkit-transform: scale(0); } 40% { -webkit-transform: scale(1); } } @keyframes sk-bouncedelay { 0%, 80%, 100% { -webkit-transform: scale(0); transform: scale(0); } 40% { -webkit-transform: scale(1); transform: scale(1); } } /* Button */ .btn1 { font-family: "Roboto", sans-serif; font-weight: 700; font-size: 16px; color: #ff6d3c; min-width: 140px; line-height: 40px; display: inline-block; text-align: center; text-transform: capitalize; border-radius: 5px; border: 1px solid #ff6d3c; background: transparent; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; position: relative; z-index: 1; overflow: hidden; } .btn1::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; border-radius: 5px; border: 1px solid #ff6d3c; height: 100%; background: #ff6d3c; z-index: -1; -webkit-transform: rotateX(90deg); transform: rotateX(90deg); -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .btn1:hover { color: #ffffff; } .btn1:hover::after { -webkit-transform: rotateX(172deg); transform: rotateX(172deg); } .btn2 { font-family: "Roboto", sans-serif; font-weight: 700; font-size: 16px; color: #ffffff; min-width: 140px; line-height: 40px; display: inline-block; text-align: center; border-radius: 5px; border: 1px solid #ff6d3c; text-transform: capitalize; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; position: relative; z-index: 1; overflow: hidden; } .btn2::after { content: ''; position: absolute; top: 0; left: 0; width: 100%; border-radius: 5px; border: 1px solid #ff6d3c; height: 100%; background: #ff6d3c; z-index: -1; -webkit-transform: rotateX(172deg); transform: rotateX(172deg); -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .btn2:hover { color: #ff6d3c; } .btn2:hover::after { -webkit-transform: rotateX(90deg); transform: rotateX(90deg); } .btn3 { font-family: "Roboto", sans-serif; font-weight: 700; font-size: 16px; color: #221b68; min-width: 140px; line-height: 40px; display: inline-block; text-align: center; text-transform: capitalize; border-radius: 5px; border: 1px solid #221b68; background: transparent; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; position: relative; z-index: 1; overflow: hidden; } /* Form */ .subscribe-area { background: #ff6d3c; position: relative; } .subscribe-area .big-logo { width: inherit; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } @media (max-width: 767px) { .subscribe-area .big-logo { display: none; } } .subscribe-area .subs-left { padding: 0 60px; margin-bottom: 30px; } .subscribe-area .subs-left h2 { color: #ffffff; } .subscribe-area .subs-right { padding: 0 60px; } .subscribe-area .subs-right form .subs-form { position: relative; margin-bottom: 20px; } .subscribe-area .subs-right form .subs-form input[type="text"] { width: 100%; padding: 14px 20px; padding-right: 152px; border-radius: 5px; border: 1px solid #f1f1f1; } @media (max-width: 575.98px) { .subscribe-area .subs-right form .subs-form input[type="text"] { padding-right: 0; } } .subscribe-area .subs-right form .subs-form button { position: absolute; right: 5px; top: 5px; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } @media (max-width: 575.98px) { .subscribe-area .subs-right form .subs-form button { position: static; margin-top: 30px; width: 100%; background: #ffffff; color: #ff6d3c; } .subscribe-area .subs-right form .subs-form button:hover { color: #221b68; } } .subscribe-area .subs-right form input[type='checkbox'] { border: 0; outline: 0; margin-right: 5px; } .subscribe-area .subs-right form label { color: #ffffff; } /* Theme Default */ .padding-top-10 { padding-top: 10px; } .padding-top-20 { padding-top: 20px; } .padding-top-30 { padding-top: 30px; } .padding-top-40 { padding-top: 40px; } .padding-top-50 { padding-top: 50px; } .padding-top-60 { padding-top: 60px; } .padding-top-70 { padding-top: 70px; } .padding-top-80 { padding-top: 80px; } .padding-top-85 { padding-top: 85px; } .padding-top-90 { padding-top: 90px; } .padding-top-100 { padding-top: 100px; } .padding-top-105 { padding-top: 105px; } .padding-top-110 { padding-top: 110px; } .padding-top-115 { padding-top: 115px; } .padding-top-120 { padding-top: 120px; } .padding-top-200 { padding-top: 200px; } .padding-top-340 { padding-top: 340px; } .padding-top-150 { padding-top: 150px; } .padding-top-358 { padding-top: 358px; } .padding-bottom-10 { padding-bottom: 10px; } .padding-bottom-20 { padding-bottom: 20px; } .padding-bottom-30 { padding-bottom: 30px; } .padding-bottom-40 { padding-bottom: 40px; } .padding-bottom-50 { padding-bottom: 50px; } .padding-bottom-55 { padding-bottom: 55px; } .padding-bottom-60 { padding-bottom: 60px; } .padding-bottom-70 { padding-bottom: 70px; } .padding-bottom-75 { padding-bottom: 75px; } .padding-bottom-80 { padding-bottom: 80px; } .padding-bottom-90 { padding-bottom: 90px; } .padding-bottom-100 { padding-bottom: 100px; } .padding-bottom-105 { padding-bottom: 105px; } .padding-bottom-110 { padding-bottom: 110px; } .padding-bottom-115 { padding-bottom: 115px; } .padding-bottom-120 { padding-bottom: 120px; } .padding-bottom-150 { padding-bottom: 150px; } .padding-bottom-220 { padding-bottom: 220px; } .padding-10 { padding-top: 10px; padding-bottom: 10px; } .padding-20 { padding-top: 20px; padding-bottom: 20px; } .padding-30 { padding-top: 30px; padding-bottom: 30px; } .padding-40 { padding-top: 40px; padding-bottom: 40px; } .padding-50 { padding-top: 50px; padding-bottom: 50px; } .padding-60 { padding-top: 60px; padding-bottom: 60px; } .padding-70 { padding-top: 70px; padding-bottom: 70px; } .padding-80 { padding-top: 80px; padding-bottom: 80px; } .padding-90 { padding-top: 90px; padding-bottom: 90px; } .padding-100 { padding-top: 100px; padding-bottom: 100px; } .padding-105 { padding-top: 105px; padding-bottom: 105px; } .padding-115 { padding-top: 115px; padding-bottom: 115px; } .padding-120 { padding-top: 120px; padding-bottom: 120px; } .margin-top-10 { margin-top: 10px; } .margin-top-20 { margin-top: 20px; } .margin-top-30 { margin-top: 30px; } .margin-top-40 { margin-top: 40px; } .margin-top-50 { margin-top: 50px; } .margin-top-60 { margin-top: 60px; } .margin-top-70 { margin-top: 70px; } .margin-top-80 { margin-top: 80px; } .margin-top-90 { margin-top: 90px; } .margin-top-100 { margin-top: 100px; } .margin-bottom-10 { margin-bottom: 10px; } .margin-bottom-15 { margin-bottom: 15px; } .margin-bottom-20 { margin-bottom: 20px; } .margin-bottom-25 { margin-bottom: 25px; } .margin-bottom-30 { margin-bottom: 30px; } .margin-bottom-40 { margin-bottom: 40px; } .margin-bottom-45 { margin-bottom: 45px; } .margin-bottom-50 { margin-bottom: 50px; } .margin-bottom-60 { margin-bottom: 60px; } .margin-bottom-70 { margin-bottom: 70px; } .margin-bottom-80 { margin-bottom: 80px; } .margin-bottom-90 { margin-bottom: 90px; } .margin-bottom-100 { margin-bottom: 100px; } .margin-right-10 { margin-right: 10px; } .margin-right-20 { margin-right: 20px; } .margin-right-30 { margin-right: 30px; } .margin-right-40 { margin-right: 40px; } .margin-right-50 { margin-right: 50px; } .margin-right-60 { margin-right: 60px; } .margin-right-70 { margin-right: 70px; } .margin-right-80 { margin-right: 80px; } .margin-right-90 { margin-right: 90px; } .margin-right-100 { margin-right: 100px; } .margin-left-10 { margin-left: 10px; } .margin-left-20 { margin-left: 20px; } .margin-left-30 { margin-left: 30px; } .margin-left-40 { margin-left: 40px; } .margin-left-50 { margin-left: 50px; } .margin-left-60 { margin-left: 60px; } .margin-left-70 { margin-left: 70px; } .margin-left-80 { margin-left: 80px; } .margin-left-90 { margin-left: 90px; } .margin-left-100 { margin-left: 100px; } .margin-10 { margin: 10px 0; } .margin-20 { margin: 10px 0; } .margin-30 { margin: 10px 0; } .margin-40 { margin: 10px 0; } .margin-50 { margin: 10px 0; } .margin-60 { margin: 10px 0; } .margin-70 { margin: 10px 0; } .margin-80 { margin: 10px 0; } .margin-90 { margin: 10px 0; } .margin-100 { margin: 10px 0; } .scrollup { background: #ff6d3c; color: #ffffff; display: block; width: 40px; height: 40px; line-height: 40px; border-radius: 50%; text-align: center; font-size: 18px; outline: none; border: none; -webkit-transition: .5s; -o-transition: .5s; transition: .5s; position: fixed; right: 30px; bottom: 30px; display: none; z-index: 9999; } .scrollup:hover { background: #221b68; } .scrollup.home2-color { background: #7027c3; } .item-bounce { -webkit-animation: bounce 3s infinite ease-in-out; -o-animation: bounce 3s infinite ease-in-out; -ms-animation: bounce 3s infinite ease-in-out; -moz-animation: bounce 3s infinite ease-in-out; animation: bounce 3s infinite ease-in-out; } @-webkit-keyframes bounce { 0% { -webkit-transform: translateY(-5px); transform: translateY(-5px); } 50% { -webkit-transform: translateY(10px); transform: translateY(10px); } 100% { -webkit-transform: translateY(-5px); transform: translateY(-5px); } } @keyframes bounce { 0% { -webkit-transform: translateY(-5px); transform: translateY(-5px); } 50% { -webkit-transform: translateY(10px); transform: translateY(10px); } 100% { -webkit-transform: translateY(-5px); transform: translateY(-5px); } } .item-zooming { -webkit-animation: zooming 3s infinite ease-in-out; -o-animation: zooming 3s infinite ease-in-out; -ms-animation: zooming 3s infinite ease-in-out; -moz-animation: zooming 3s infinite ease-in-out; animation: zooming 3s infinite ease-in-out; } @-webkit-keyframes zooming { 0% { -webkit-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.2); transform: scale(1.2); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes zooming { 0% { -webkit-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.2); transform: scale(1.2); } 100% { -webkit-transform: scale(1); transform: scale(1); } } .item-ripple { -webkit-animation: ripple 3s infinite ease-in-out; -o-animation: ripple 3s infinite ease-in-out; -ms-animation: ripple 3s infinite ease-in-out; -moz-animation: ripple 3s infinite ease-in-out; animation: ripple 3s infinite ease-in-out; } @-webkit-keyframes ripple { 0% { -webkit-box-shadow: 0 0 0 0 rgba(255, 109, 60, 0.2), 0 0 0 20px rgba(255, 109, 60, 0.2); box-shadow: 0 0 0 0 rgba(255, 109, 60, 0.2), 0 0 0 20px rgba(255, 109, 60, 0.2); } 100% { -webkit-box-shadow: 0 0 0 20px rgba(255, 109, 60, 0.2), 0 0 0 40px rgba(255, 109, 60, 0.1); box-shadow: 0 0 0 20px rgba(255, 109, 60, 0.2), 0 0 0 40px rgba(255, 109, 60, 0.1); } } @keyframes ripple { 0% { -webkit-box-shadow: 0 0 0 0 rgba(255, 109, 60, 0.2), 0 0 0 20px rgba(255, 109, 60, 0.2); box-shadow: 0 0 0 0 rgba(255, 109, 60, 0.2), 0 0 0 20px rgba(255, 109, 60, 0.2); } 100% { -webkit-box-shadow: 0 0 0 20px rgba(255, 109, 60, 0.2), 0 0 0 40px rgba(255, 109, 60, 0.1); box-shadow: 0 0 0 20px rgba(255, 109, 60, 0.2), 0 0 0 40px rgba(255, 109, 60, 0.1); } } .item-animateOne { -webkit-animation: animateOne 15s infinite ease-in-out; -o-animation: animateOne 15s infinite ease-in-out; -ms-animation: animateOne 15s infinite ease-in-out; -moz-animation: animateOne 15s infinite ease-in-out; animation: animateOne 15s infinite ease-in-out; } .item-ripple2 { -webkit-animation: ripple2 3s infinite ease-in-out; -o-animation: ripple2 3s infinite ease-in-out; -ms-animation: ripple2 3s infinite ease-in-out; -moz-animation: ripple2 3s infinite ease-in-out; animation: ripple2 3s infinite ease-in-out; } @-webkit-keyframes ripple2 { 0% { -webkit-box-shadow: 0 0 0 0 rgba(112, 39, 195, 0.2), 0 0 0 10px rgba(112, 39, 195, 0.2); box-shadow: 0 0 0 0 rgba(112, 39, 195, 0.2), 0 0 0 10px rgba(112, 39, 195, 0.2); } 100% { -webkit-box-shadow: 0 0 0 10px rgba(112, 39, 195, 0.2), 0 0 0 20px rgba(112, 39, 195, 0.1); box-shadow: 0 0 0 10px rgba(112, 39, 195, 0.2), 0 0 0 20px rgba(112, 39, 195, 0.1); } } @keyframes ripple2 { 0% { -webkit-box-shadow: 0 0 0 0 rgba(112, 39, 195, 0.2), 0 0 0 10px rgba(112, 39, 195, 0.2); box-shadow: 0 0 0 0 rgba(112, 39, 195, 0.2), 0 0 0 10px rgba(112, 39, 195, 0.2); } 100% { -webkit-box-shadow: 0 0 0 10px rgba(112, 39, 195, 0.2), 0 0 0 20px rgba(112, 39, 195, 0.1); box-shadow: 0 0 0 10px rgba(112, 39, 195, 0.2), 0 0 0 20px rgba(112, 39, 195, 0.1); } } .item-animateOne { -webkit-animation: animateOne 15s infinite ease-in-out; -o-animation: animateOne 15s infinite ease-in-out; -ms-animation: animateOne 15s infinite ease-in-out; -moz-animation: animateOne 15s infinite ease-in-out; animation: animateOne 15s infinite ease-in-out; } @-webkit-keyframes animateOne { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 50% { -webkit-transform: translateX(-100px); transform: translateX(-100px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes animateOne { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 50% { -webkit-transform: translateX(-100px); transform: translateX(-100px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } .item-animateTwo { -webkit-animation: animateTwo 15s infinite ease-in-out; -o-animation: animateTwo 15s infinite ease-in-out; -ms-animation: animateTwo 15s infinite ease-in-out; -moz-animation: animateTwo 15s infinite ease-in-out; animation: animateTwo 15s infinite ease-in-out; } @-webkit-keyframes animateTwo { 0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); } 50% { -webkit-transform: translate(-50px, 50px); transform: translate(-50px, 50px); } 100% { -webkit-transform: translate(0, 0); transform: translate(0, 0); } } @keyframes animateTwo { 0% { -webkit-transform: translate(0, 0); transform: translate(0, 0); } 50% { -webkit-transform: translate(-50px, 50px); transform: translate(-50px, 50px); } 100% { -webkit-transform: translate(0, 0); transform: translate(0, 0); } } /* Homepage 1*/ .common-title h4 { margin-bottom: 10px; font-weight: 500; text-transform: capitalize; } .hslider-active .slider__counter { position: absolute; bottom: 19%; left: 19.5%; z-index: 1; font-weight: 400; pointer-events: none; font-family: "Viga", sans-serif; font-size: 24px; color: #221b68; text-transform: capitalize; } @media (max-width: 991.98px) { .hslider-active .slider__counter { display: none; } } @media (min-width: 992px) and (max-width: 1199.98px) { .hslider-active .slider__counter { left: 50%; bottom: 10%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } } @media (min-width: 1200px) and (max-width: 1439.98px) { .hslider-active .slider__counter { left: 50%; bottom: 10%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } } @media (min-width: 1440px) and (max-width: 1599.98px) { .hslider-active .slider__counter { left: 50%; bottom: 10%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } } @media (min-width: 1600px) and (max-width: 1919.98px) { .hslider-active .slider__counter { left: 50%; bottom: 10%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } } .hslider-active .slider__counter .slideInfo { display: inline-block; margin-right: 150px; position: relative; } @media (max-width: 991.98px) { .hslider-active .slider__counter .slideInfo { margin-right: 60px; } } .hslider-active .slider__counter .slideInfo::after { content: ''; width: 110px; height: 2px; background: #f1f1f1; position: absolute; top: 13px; right: -120px; } @media (max-width: 991.98px) { .hslider-active .slider__counter .slideInfo::after { display: none; } } .hslider-active .slider__counter .slideActive { color: #ff6d3c; display: inline-block; } .hslider-active .slick-active .hero-left .animate1 { -webkit-animation: fadeInUp; animation: fadeInUp; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; } .hslider-active .slick-active .hero-left .animate2 { -webkit-animation: fadeInUp; animation: fadeInUp; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; } .hslider-active .slick-active .hero-left .animate3 { -webkit-animation: fadeInDown; animation: fadeInDown; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; } .hslider-active .slick-active .hero-right .animate5 { -webkit-animation: fadeIn; animation: fadeIn; -webkit-animation-duration: 3s; animation-duration: 3s; } .hslider-active .slick-dots { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; position: absolute; top: 50%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; right: 1%; } @media (max-width: 991.98px) { .hslider-active .slick-dots { display: none !important; } } .hslider-active .slick-dots li button { font-size: 0; width: 10px; height: 10px; border-radius: 50%; border: 1px solid #221b68; outline: none; float: left; margin-left: 10px; background: #221b68; margin-bottom: 10px; padding: 2px; } @media (min-width: 768px) and (max-width: 991.98px) { .hslider-active .slick-dots li button { margin-right: 10px; } } @media (max-width: 767px) { .hslider-active .slick-dots li button { margin-right: 10px; } } .hslider-active .slick-dots li.slick-active button { background: #ff6d3c; border: 1px solid #ff6d3c; } .heroSlider { background: -webkit-linear-gradient(127deg, #fdffda 0%, #f3fff6 100%); background: -o-linear-gradient(127deg, #fdffda 0%, #f3fff6 100%); background: linear-gradient(323deg, #fdffda 0%, #f3fff6 100%); display: block; position: relative; padding: 150px 0; height: 800px; } @media (max-width: 991.98px) { .heroSlider { padding-top: 100px; padding-bottom: 70px; height: initial; } } .heroSlider .hero-shapes img { width: inherit; } .heroSlider .hero-shapes .s1 { position: absolute; top: 10%; left: 10%; } .heroSlider .hero-shapes .s2 { position: absolute; top: 10%; right: 10%; } @media (max-width: 991.98px) { .heroSlider .hero-left { text-align: center; } } .heroSlider .hero-left h3 { font-weight: 500; margin-bottom: 30px; } .heroSlider .hero-left h1 { margin-bottom: 70px; font-weight: 400; } @media (max-width: 575.98px) { .heroSlider .hero-left h1 { font-size: 40px; } } .heroSlider .hero-left .btn-box { margin-bottom: 70px; } @media (max-width: 991.98px) { .heroSlider .hero-left .btn-box { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } .heroSlider .hero-left .btn-box .btn-text { font-weight: 600; text-transform: capitalize; color: #221b68; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .heroSlider .hero-left .btn-box .btn-text:hover { color: #ff6d3c; } @media (max-width: 767px) { .heroSlider .hero-left .btn-box .btn-text { display: none; } } .heroSlider .hero-left .btn-box .play-btn { background: #ff6d3c; color: #ffffff; width: 55px; height: 55px; border-radius: 50%; display: inline-block; text-align: center; line-height: 55px; margin-left: 50px; margin-right: 50px; } @media (max-width: 575.98px) { .heroSlider .hero-left .btn-box .play-btn { margin-right: 20px; } } .heroSlider .hero-left .slider-info h4 { font-weight: 400; } .heroSlider .hero-left .slider-info .span_gap { width: 150px; height: 1px; background: #c5d3ff; display: block; margin: 0 20px 0 5px; } .service-slider-active .slick-track { padding: 20px 0; } .service-slider-active .slick-dots { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .service-slider-active .slick-dots li button { font-size: 0; width: 10px; height: 10px; border-radius: 50%; border: 1px solid #221b68; outline: none; float: left; margin-left: 10px; background: #221b68; margin-bottom: 10px; padding: 2px; } @media (min-width: 768px) and (max-width: 991.98px) { .service-slider-active .slick-dots li button { margin-right: 10px; } } @media (max-width: 767px) { .service-slider-active .slick-dots li button { margin-right: 10px; } } .service-slider-active .slick-dots li.slick-active button { background: #ff6d3c; border: 1px solid #ff6d3c; } .service-section .single-service { background: #fffcf1; padding: 50px 18px; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; position: relative; overflow: hidden; margin-bottom: 30px; } .service-section .single-service .ser-vec { position: absolute; width: 150px; top: -22px; left: -22px; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .service-section .single-service .icon-box { margin-bottom: 15px; overflow: hidden; position: relative; } .service-section .single-service .icon-box span i::before { font-size: 40px; color: #ff6d3c; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .service-section .single-service h3 { font-family: "Viga", sans-serif; font-weight: 400; margin-bottom: 20px; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .service-section .single-service a { color: #ff6d3c; text-transform: capitalize; } .service-section .single-service a::after { content: '\f101'; font-weight: 900; font-family: "Font Awesome 5 Free"; margin-left: 5px; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .service-section .single-service:hover { background: #ff6d3c; -webkit-box-shadow: 0 0 25px 0px rgba(130, 36, 5, 0.15); box-shadow: 0 0 25px 0px rgba(130, 36, 5, 0.15); } .service-section .single-service:hover .ser-vec { opacity: 1; visibility: visible; } .service-section .single-service:hover .icon-box span i::before { color: #ffffff; } .service-section .single-service:hover h3 { color: #ffffff; } .service-section .single-service:hover a { color: #ffffff; } .service-section .single-service:hover a::after { opacity: 1; visibility: visible; } .about-section { background: #fffcf1; position: relative; } .about-section .about-shapes img { width: inherit; } .about-section .about-shapes .a1 { position: absolute; top: 10%; left: 10%; } .about-section .about-shapes .a2 { position: absolute; top: 10%; right: 10%; } .about-section .about-left { position: relative; margin-bottom: 60px; } .about-section .about-left .aboutimg-1 { -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .about-section .about-left .aboutimg-2 { -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .about-section .about-left:hover .aboutimg-1 { position: relative; z-index: 2; -webkit-transform: translate(5px, 5px); -ms-transform: translate(5px, 5px); transform: translate(5px, 5px); } .about-section .about-left:hover .aboutimg-2 { opacity: .5; -webkit-transform: translate(-5px, -5px); -ms-transform: translate(-5px, -5px); transform: translate(-5px, -5px); } .about-section .about-left .aboutimg-2 { position: absolute; right: 0; bottom: -50px; z-index: 1; } @media (min-width: 768px) and (max-width: 991.98px) { .about-section .about-left .aboutimg-2 { right: 85px; } } .about-section .about-left img { width: inherit; } .about-section .about-right p { margin-bottom: 30px; } .about-section .about-right a { margin-top: 12px; } .counter-area .single-counter { margin-bottom: 60px; } .counter-area .single-counter h2::after { content: '+'; } .counter-area .single-counter h5 { font-weight: 500; position: relative; } .counter-area .single-counter h5::after { content: ""; position: absolute; width: 25px; height: 5px; margin-left: 10px; bottom: 4px; background: #ff6d3c; } @media (max-width: 575.98px) { .counter-area .single-counter h5::after { width: 11px; height: 2px; margin-left: 4px; bottom: 4px; } } .portfolio-section .portfolio-btn { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } @media (max-width: 767px) { .portfolio-section .portfolio-btn { display: initial; } } .portfolio-section .portfolio-btn button { color: #221b68; border: none; font-family: "Roboto", sans-serif; font-weight: 500; font-size: 16px; text-transform: capitalize; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; background: inherit; position: relative; margin-left: 20px; } .portfolio-section .portfolio-btn button::before { content: ''; position: absolute; left: -6px; bottom: 8px; width: 5px; background: #221b68; height: 5px; border-radius: 50%; display: inline-block; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .portfolio-section .portfolio-btn button:hover { color: #ff6d3c; } .portfolio-section .portfolio-btn button.active { color: #ff6d3c; } .portfolio-section .portfolio-btn button.active::before { background: #ff6d3c; } .portfolio-section .portfolio-wrapper .single-portfolio { position: relative; margin-bottom: 30px; overflow: hidden; } .portfolio-section .portfolio-wrapper .single-portfolio::after { content: ''; position: absolute; bottom: -100%; left: 0; width: 100%; height: 100%; background: #221b68; opacity: 0; visibility: hidden; z-index: 1; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .portfolio-section .portfolio-wrapper .single-portfolio img { width: 100%; } .portfolio-section .portfolio-wrapper .single-portfolio .port-content { background: #ff6d3c; padding: 30px 20px; position: absolute; width: 100%; bottom: 0; left: 0; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; z-index: 2; visibility: hidden; opacity: 0; } .portfolio-section .portfolio-wrapper .single-portfolio .port-content h5 { color: #ffffff; font-family: "Roboto", sans-serif; font-weight: 500; margin-bottom: 10px; } .portfolio-section .portfolio-wrapper .single-portfolio .port-content h3 a { font-family: "Viga", sans-serif; color: #ffffff; font-weight: 400; } .portfolio-section .portfolio-wrapper .single-portfolio .port-content h3 a:hover { color: #221b68; } .portfolio-section .portfolio-wrapper .single-portfolio:hover::after { bottom: 0; visibility: visible; opacity: .4; } .portfolio-section .portfolio-wrapper .single-portfolio:hover .port-content { opacity: 1; visibility: visible; } .team-section { background: #fffcf1; position: relative; } .team-section .team-slider-active .slick-track { padding: 20px 0; } .team-section .team-slider-active .slick-dots { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-top: 50px; } .team-section .team-slider-active .slick-dots li button { font-size: 0; width: 10px; height: 10px; border-radius: 50%; border: 1px solid #221b68; outline: none; float: left; margin-left: 10px; background: #221b68; margin-bottom: 10px; padding: 2px; } @media (min-width: 768px) and (max-width: 991.98px) { .team-section .team-slider-active .slick-dots li button { margin-right: 10px; } } @media (max-width: 767px) { .team-section .team-slider-active .slick-dots li button { margin-right: 10px; } } .team-section .team-slider-active .slick-dots li.slick-active button { background: #ff6d3c; border: 1px solid #ff6d3c; } .team-section .team-shapes img { width: inherit; } .team-section .team-shapes .a1 { position: absolute; top: 50%; left: 10%; } .team-section .team-shapes .a2 { position: absolute; top: 50%; right: 10%; } .team-section .single-team { position: relative; overflow: hidden; padding: 40px 25px; background: #ffffff; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .team-section .single-team .ser-vec { position: absolute; width: 150px; top: -22px; left: -22px; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .team-section .single-team .team-img { margin-bottom: 20px; position: relative; z-index: 1; } .team-section .single-team .team-img img { max-width: 145px; margin: 0 auto; } .team-section .single-team .team-content h3 { font-family: "Viga", sans-serif; font-weight: 400; margin-bottom: 10px; } .team-section .single-team .team-content h6 { font-family: "Roboto", sans-serif; font-weight: 500; color: #221b68; margin-bottom: 10px; } .team-section .single-team .team-content h5 { font-weight: 500; } .team-section .single-team .team-content h5 span { font-family: "Viga", sans-serif; font-size: 24px; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .team-section .single-team .social-icons { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; position: absolute; right: 20px; top: 40px; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; z-index: 2; } .team-section .single-team .social-icons img { width: 25px; margin-bottom: 10px; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; -webkit-transform: scale(0.9); -ms-transform: scale(0.9); transform: scale(0.9); } .team-section .single-team:hover { background: #ff6d3c; -webkit-box-shadow: 0 0 20px 0px rgba(130, 36, 5, 0.15); box-shadow: 0 0 20px 0px rgba(130, 36, 5, 0.15); } .team-section .single-team:hover .ser-vec { opacity: 1; visibility: visible; } .team-section .single-team:hover .team-content h3 { color: #ffffff; } .team-section .single-team:hover .team-content h6 { color: #ffffff; } .team-section .single-team:hover .team-content h5 { color: #ffffff; } .team-section .single-team:hover .team-content h5 span { color: #ffffff; } .team-section .single-team:hover .social-icons { opacity: 1; visibility: visible; } .team-section .single-team:hover .social-icons img:hover { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .feedback-section .common-title { padding: 20px; } .feedback-section .feedback-slider-active .slick-track { padding: 20px 0; } .feedback-section .feedback-slider-active .slick-dots { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: absolute; top: -78px; right: 35px; } @media (max-width: 991.98px) { .feedback-section .feedback-slider-active .slick-dots { position: initial; margin-top: 30px; } } .feedback-section .feedback-slider-active .slick-dots li button { font-size: 0; width: 10px; height: 10px; border-radius: 50%; border: 1px solid #221b68; outline: none; float: left; margin-left: 10px; background: #221b68; margin-bottom: 10px; padding: 2px; } @media (min-width: 768px) and (max-width: 991.98px) { .feedback-section .feedback-slider-active .slick-dots li button { margin-right: 10px; } } @media (max-width: 767px) { .feedback-section .feedback-slider-active .slick-dots li button { margin-right: 10px; } } .feedback-section .feedback-slider-active .slick-dots li.slick-active button { background: #ff6d3c; border: 1px solid #ff6d3c; } .feedback-section .single-feedback { background: #fffcf1; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; position: relative; padding: 50px 35px; } .feedback-section .single-feedback .slider-no { font-family: "Viga", sans-serif; font-size: 16px; color: #221b68; position: absolute; right: 30px; top: 60px; } @media (max-width: 575.98px) { .feedback-section .single-feedback .slider-no { display: none; } } .feedback-section .single-feedback .slider-no::before { content: "__"; position: relative; top: -9px; font-size: 30px; left: 0; margin-right: 5px; color: #ff6d3c; } .feedback-section .single-feedback .upper-content { margin-bottom: 35px; display: -webkit-box; display: -ms-flexbox; display: flex; } .feedback-section .single-feedback .upper-content .img-box img { max-width: 100px; } .feedback-section .single-feedback .upper-content .content-box { margin-left: 20px; } .feedback-section .single-feedback .upper-content .content-box h3 { font-family: "Viga", sans-serif; color: #221b68; font-weight: 400; margin-bottom: 10px; } .feedback-section .single-feedback .upper-content .content-box h5 { margin-bottom: 10px; font-weight: 400; } .feedback-section .single-feedback .upper-content .content-box .ratings { background: #ff6d3c; font-family: "Viga", sans-serif; font-size: 18px; color: #ffffff; padding: 0 5px; } .feedback-section .single-feedback:hover { background: #ffffff; -webkit-box-shadow: 0 0 10px 0px rgba(130, 36, 5, 0.1); box-shadow: 0 0 10px 0px rgba(130, 36, 5, 0.1); } .feedback-section .single-feedback:hover .upper-content .content-box { margin-left: 20px; } .feedback-section .single-feedback:hover .upper-content .content-box h3 { color: #ff6d3c; } .blog-section { background: #fffcf1; } .blog-section .common-title { padding: 0 20px; } .blog-section .single-blog { margin-bottom: 30px; position: relative; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .blog-section .single-blog .blog-img { margin-bottom: 30px; } .blog-section .single-blog .blog-content { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 5px 5px 35px 5px; } .blog-section .single-blog .blog-content a .content-left { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; border: 1px solid #ff6d3c; padding: 10px 20px; border-radius: 10px; text-align: center; background: #ffffff; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; margin-right: 12px; } .blog-section .single-blog .blog-content a .content-left .day { font-family: "Viga", sans-serif; font-size: 30px; font-weight: 400; } .blog-section .single-blog .blog-content a .content-left .month { text-transform: capitalize; font-size: 16px; } .blog-section .single-blog .blog-content a .content-left:hover { background: #ff6d3c; } .blog-section .single-blog .blog-content a .content-left:hover .day { color: #ffffff; } .blog-section .single-blog .blog-content a .content-left:hover .month { color: #ffffff; } .blog-section .single-blog .blog-content .content-right h5 { font-weight: 400; text-transform: capitalize; } .blog-section .single-blog .blog-content .content-right h5 span { font-size: 32px; font-weight: 600; margin-right: 4px; position: relative; top: -7px; color: #ff6d3c; } .blog-section .single-blog .blog-content .content-right h3 { font-family: "Viga", sans-serif; font-weight: 400; } .blog-section .single-blog .blog-content .content-right h3 a:hover { color: #ff6d3c; } .blog-section .single-blog:hover .blog-content { display: -webkit-box; display: -ms-flexbox; display: flex; } .blog-section .single-blog:hover .blog-content a .content-left { background: #ff6d3c; } .blog-section .single-blog:hover .blog-content a .content-left .day { color: #ffffff; } .blog-section .single-blog:hover .blog-content a .content-left .month { color: #ffffff; } .blog-section .single-blog:hover .blog-content .content-right h3 a:hover { color: #ff6d3c; } .clients-section .cllients-left { background: #221b68; padding: 90px 0; overflow: hidden; position: relative; } @media (max-width: 575.98px) { .clients-section .cllients-left { padding: 90px 30px; } } .clients-section .cllients-left .bg-img { width: 200px; position: absolute; right: -18px; bottom: -21px; z-index: 0; } .clients-section .cllients-left .upper-content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 50px; position: relative; z-index: 1; } .clients-section .cllients-left .upper-content img { width: inherit; margin-right: 15px; } .clients-section .cllients-left .upper-content h2 { color: #ffffff; } @media (max-width: 575.98px) { .clients-section .cllients-left .upper-content h2 { font-size: 37px; } } .clients-section .cllients-left .upper-content h4 { font-weight: 500; color: #ffffff; } .clients-section .cllients-left p { font-weight: 500; font-size: 18px; text-transform: capitalize; color: #ffffff; position: relative; z-index: 1; } .clients-section .cllients-left .email-info { position: relative; z-index: 1; color: #ff6d3c; text-decoration: underline; } .clients-section .clients-right img { margin-bottom: 30px; } /* Service Page*/ .pricing-section { background: #fffcf1; position: relative; } .pricing-section .price-shapes img { width: inherit; } .pricing-section .price-shapes .a1 { position: absolute; top: 50%; left: 10%; } .pricing-section .price-shapes .a2 { position: absolute; top: 50%; right: 10%; } .pricing-section .single-pricing { padding: 55px 80px; background: #ffffff; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; overflow: hidden; position: relative; border-radius: 10px; margin-bottom: 30px; } @media (min-width: 992px) and (max-width: 1199.98px) { .pricing-section .single-pricing { padding: 55px 40px; } } @media (max-width: 991.98px) { .pricing-section .single-pricing { padding: 55px 40px; } } @media (min-width: 576px) and (max-width: 767.98px) { .pricing-section .single-pricing { padding: 55px 160px; } } .pricing-section .single-pricing .ser-vec { position: absolute; width: 150px; top: -22px; left: -22px; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .pricing-section .single-pricing h4 { font-weight: 400; margin-bottom: 40px; } .pricing-section .single-pricing h4 span { font-size: 64px; font-family: "Viga", sans-serif; font-weight: 700; } .pricing-section .single-pricing ul { margin-bottom: 43px; } .pricing-section .single-pricing ul li { line-height: 1.7; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .pricing-section .single-pricing ul li::before { content: '\f35a'; font-family: "Font Awesome 5 Free"; margin-right: 10px; font-weight: 400; } .pricing-section .single-pricing:hover { background: #ff6d3c; border-radius: 0px; -webkit-box-shadow: 17.634px 24.271px 40px 0px rgba(130, 36, 5, 0.15); box-shadow: 17.634px 24.271px 40px 0px rgba(130, 36, 5, 0.15); } .pricing-section .single-pricing:hover .ser-vec { opacity: 1; visibility: visible; } .pricing-section .single-pricing:hover h4 { color: #ffffff; } .pricing-section .single-pricing:hover ul li { color: #ffffff; } .pricing-section .single-pricing:hover a.btn3 { background: #ffffff; color: #ff6d3c; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; border: 1px solid #ffffff; } .pricing-section .single-pricing:hover a.btn3:hover { color: #221b68; } /* Single Service Page */ .service-about .serbout-left h2 { margin-bottom: 60px; } .service-about .serbout-left img { width: 100%; } .service-about .serbout-right p { margin-bottom: 30px; } .service-about .serbout-right h2 { margin-bottom: 20px; } .service-about .serbout-right ul { margin-bottom: 30px; } .service-about .serbout-right ul li { line-height: 2.5; } .service-about .serbout-right ul li::before { content: '\f560'; font-family: 'Font Awesome 5 Free'; font-weight: 900; margin-right: 5px; } .cstudy-section { background: #fffcf1; } .cstudy-section .clients-tab-menu .single-menu { display: block; width: 250px; padding: 45px 20px; background: #ffffff; position: relative; overflow: hidden; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; -webkit-box-shadow: 0px 10px 30px 0px rgba(66, 25, 11, 0.1); box-shadow: 0px 10px 30px 0px rgba(66, 25, 11, 0.1); } @media (min-width: 576px) and (max-width: 767.98px) { .cstudy-section .clients-tab-menu .single-menu { width: 200px; } } .cstudy-section .clients-tab-menu .single-menu .ser-vec { position: absolute; width: 150px; top: -22px; left: -22px; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .cstudy-section .clients-tab-menu .single-menu .icon-box { margin-bottom: 20px; } .cstudy-section .clients-tab-menu .single-menu .icon-box span i::before { font-size: 50px; color: #ff6d3c; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .cstudy-section .clients-tab-menu .single-menu h3 { font-family: "Viga", sans-serif; font-weight: 400; } .cstudy-section .clients-tab-menu .single-menu .counter_no { position: absolute; top: 17px; right: 20px; font-size: 16px; font-family: "Viga", sans-serif; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .cstudy-section .clients-tab-menu .single-menu .counter_no::before { content: "_"; position: relative; top: -9px; font-size: 30px; left: 0; margin-right: 5px; color: #ff6d3c; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .cstudy-section .clients-tab-menu .single-menu:hover { background: #ff6d3c; } .cstudy-section .clients-tab-menu .single-menu:hover .ser-vec { opacity: 1; visibility: visible; } .cstudy-section .clients-tab-menu .single-menu:hover .icon-box span i::before { color: #ffffff; } .cstudy-section .clients-tab-menu .single-menu:hover h3 { color: #ffffff; } .cstudy-section .clients-tab-menu .single-menu:hover .counter_no { color: #ffffff; } .cstudy-section .clients-tab-menu .single-menu:hover .counter_no::before { content: "_"; color: #ffffff; } .cstudy-section .clients-tab-menu .nav-link.active .single-menu { background: #ff6d3c; } .cstudy-section .clients-tab-menu .nav-link.active .single-menu .ser-vec { opacity: 1; visibility: visible; } .cstudy-section .clients-tab-menu .nav-link.active .single-menu .icon-box span i::before { color: #ffffff; } .cstudy-section .clients-tab-menu .nav-link.active .single-menu h3 { color: #ffffff; } .cstudy-section .clients-tab-menu .nav-link.active .single-menu .counter_no { color: #ffffff; } .cstudy-section .clients-tab-menu .nav-link.active .single-menu .counter_no::before { content: "_"; color: #ffffff; } .cstudy-section .clients-tab-content .single-content .content-left { position: relative; } .cstudy-section .clients-tab-content .single-content .content-left .img1 { width: inherit; } @media (min-width: 992px) and (max-width: 1199.98px) { .cstudy-section .clients-tab-content .single-content .content-left .img1 { width: 100%; } } @media (max-width: 991.98px) { .cstudy-section .clients-tab-content .single-content .content-left .img1 { width: 100%; } } .cstudy-section .clients-tab-content .single-content .content-left .img2 { position: absolute; bottom: 0; right: 0; z-index: 11; width: inherit; } .cstudy-section .clients-tab-content .single-content .content-right .single-idea { background: #ffffff; padding: 25px 30px; border-radius: 10px; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; margin-bottom: 30px; } .cstudy-section .clients-tab-content .single-content .content-right .single-idea h4 { font-weight: 400; font-family: "Viga", sans-serif; margin-bottom: 5px; } .cstudy-section .clients-tab-content .single-content .content-right .single-idea h5 { font-weight: 500; } .cstudy-section .clients-tab-content .single-content .content-right .single-idea:hover { -webkit-box-shadow: 8.817px 12.135px 30px 0px rgba(130, 36, 5, 0.1); box-shadow: 8.817px 12.135px 30px 0px rgba(130, 36, 5, 0.1); } .cstudy-section .clients-tab-content .single-content .content-right .single-idea:hover h4 { color: #ff6d3c; } /*Single Portfolio*/ .mainport-section { background: #fffcf1; } .mainport-section .port-bottom { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media (max-width: 767px) { .mainport-section .port-bottom { display: block; } } .mainport-section .port-bottom h4 { margin-bottom: 20px; font-weight: 500; } .mainport-section .port-bottom h4 span { font-family: "Viga", sans-serif; font-weight: 400; } .port-slider-active .slickArrow { width: 35px; height: 35px; text-align: center; line-height: 35px; border: 1px solid #221b68; background: transparent; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; outline: none; } .port-slider-active .slickArrow:hover { color: #ffffff; background: #ff6d3c; border: 1px solid transparent; } .port-slider-active .arrow-prev { position: absolute; top: 50%; left: 0; z-index: 1; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .port-slider-active .arrow-next { position: absolute; top: 50%; right: 0; z-index: 1; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .port-slider-area { margin-top: -13%; } @media (min-width: 1200px) and (max-width: 1439.98px) { .port-slider-area { margin-top: -20%; } } @media (min-width: 992px) and (max-width: 1199.98px) { .port-slider-area { margin-top: -20%; } } @media (min-width: 768px) and (max-width: 991.98px) { .port-slider-area { margin-top: -20%; } } @media (max-width: 767px) { .port-slider-area { margin-top: -17%; } } .project-slider-active .slick-track { padding: 20px 0; } .project-slider-active .slick-dots { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .project-slider-active .slick-dots li button { font-size: 0; width: 10px; height: 10px; border-radius: 50%; border: 1px solid #221b68; outline: none; float: left; margin-left: 10px; background: #221b68; margin-bottom: 10px; padding: 2px; } @media (min-width: 768px) and (max-width: 991.98px) { .project-slider-active .slick-dots li button { margin-right: 10px; } } @media (max-width: 767px) { .project-slider-active .slick-dots li button { margin-right: 10px; } } .project-slider-active .slick-dots li.slick-active button { background: #ff6d3c; border: 1px solid #ff6d3c; } .projects-section .single-portfolio { position: relative; margin-bottom: 30px; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .projects-section .single-portfolio img { width: 100%; } .projects-section .single-portfolio .port-content { background: #ff6d3c; padding: 30px 20px; position: absolute; width: 100%; bottom: 0; left: 0; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; visibility: hidden; opacity: 0; } .projects-section .single-portfolio .port-content h5 { color: #ffffff; font-family: "Roboto", sans-serif; font-weight: 500; margin-bottom: 10px; } .projects-section .single-portfolio .port-content h3 a { font-family: "Viga", sans-serif; color: #ffffff; font-weight: 400; } .projects-section .single-portfolio .port-content h3 a:hover { color: #221b68; } .projects-section .single-portfolio:hover { -webkit-box-shadow: 17.634px 24.271px 40px 0px rgba(130, 36, 5, 0.15); box-shadow: 17.634px 24.271px 40px 0px rgba(130, 36, 5, 0.15); } .projects-section .single-portfolio:hover .port-content { opacity: 1; visibility: visible; } /* Contact Page */ @media (min-width: 992px) and (max-width: 1199.98px) { .mcontact-section .mcontact-left { padding-top: 110px; margin-bottom: 80px; text-align: center; } } @media (max-width: 991.98px) { .mcontact-section .mcontact-left { padding-top: 110px; margin-bottom: 60px; text-align: center; } } .mcontact-section .mcontact-left h2 { margin-bottom: 30px; } .mcontact-section .mcontact-left .inner-con { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (min-width: 992px) and (max-width: 1199.98px) { .mcontact-section .mcontact-left .inner-con { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } @media (max-width: 991.98px) { .mcontact-section .mcontact-left .inner-con { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } .mcontact-section .mcontact-left .inner-con img { width: 60px; margin-right: 20px; } .mcontact-section .mcontact-left .inner-con h5 { font-weight: 400; } .mcontact-section .mcontact-left .inner-con h5 span { color: #ff6d3c; font-size: 30px; margin-left: 20px; display: inline-block; position: relative; top: -5px; } .mcontact-section .mcontact-left .inner-con h2 { font-size: 36px; margin-bottom: 0; } @media (min-width: 992px) and (max-width: 1199.98px) { .mcontact-section .mcontact-left .support-box { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } @media (max-width: 991.98px) { .mcontact-section .mcontact-left .support-box { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } .mcontact-section .mcontact-left .support-box .single-sup { width: 250px; height: 250px; background-color: #ffffff; -webkit-box-shadow: 9.786px 16.286px 69px 0px rgba(0, 0, 0, 0.07); box-shadow: 9.786px 16.286px 69px 0px rgba(0, 0, 0, 0.07); margin-bottom: 30px; margin-right: 30px; padding: 30px; } @media (max-width: 575.98px) { .mcontact-section .mcontact-left .support-box .single-sup { width: 100%; } } .mcontact-section .mcontact-left .support-box .single-sup .img-box { margin-bottom: 30px; } @media (min-width: 992px) and (max-width: 1199.98px) { .mcontact-section .mcontact-left .support-box .single-sup .img-box { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } @media (max-width: 991.98px) { .mcontact-section .mcontact-left .support-box .single-sup .img-box { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } .mcontact-section .mcontact-left .support-box .single-sup .img-box img { max-width: 50px; max-height: 50px; } .mcontact-section .mcontact-left .support-box .single-sup h3 { font-family: "Viga", sans-serif; font-weight: 400; margin-bottom: 30px; } .mcontact-section .mcontact-left .support-box .single-sup p span { color: #ff6d3c; } @media (max-width: 991.98px) { .mcontact-section .mcontact-right { margin-top: 30px; } } .mcontact-section .mcontact-right iframe { width: 100%; height: 560px; } @media (max-width: 991.98px) { .mconform-section .mconform-left { margin-bottom: 60px; } } .mconform-section .mconform-right form { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .mconform-section .mconform-right form input { margin-bottom: 30px; background: #f6f6f6; border: none; padding: 15px; } .mconform-section .mconform-right form textarea { margin-bottom: 30px; background: #f6f6f6; width: 100%; border: none; padding: 15px; } .mconform-section .mconform-right form .input-one { width: 100%; } .mconform-section .mconform-right form .input-two { width: 48%; } /* Blog Page */ .blog-single-post { padding: 10px; margin-bottom: 20px; } .blog-single-post.different-bg-color { background-color: #ff6d3c; } .blog-single-post .blog-common { position: relative; } .blog-single-post .blog-common .g-date { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: #ffffff; width: 55px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; border: 1px solid #ff6d3c; padding: 10px 20px; border-radius: 10px; text-align: center; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; margin-right: 18px; position: absolute; top: 5%; left: 5%; line-height: 1.1; } .blog-single-post .blog-common .g-date .day { font-family: "Viga", sans-serif; font-size: 30px; font-weight: 400; } .blog-single-post .blog-common .g-date .month { text-transform: capitalize; font-size: 16px; } .blog-single-post .blog-thumbnail { overflow: hidden; position: relative; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .blog-single-post .blog-thumbnail img { -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .blog-single-post .blog-content-part { padding: 20px 0; } .blog-single-post .blog-content-part .blog-content-top { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-top: 10px; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .blog-single-post .blog-content-part .blog-content-top .blog-author a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .blog-single-post .blog-content-part .blog-content-top .blog-author a img { width: 40px; margin-right: 10px; } .blog-single-post .blog-content-part .blog-content-top div { margin-right: 20px; } @media (max-width: 575.98px) { .blog-single-post .blog-content-part .blog-content-top div { margin-right: 2px; } } .blog-single-post .blog-content-part .blog-content-top a { color: #221b68; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; text-transform: capitalize; font-family: "Viga", sans-serif; font-size: 16px; font-weight: 400; } .blog-single-post .blog-content-part .blog-content-top a:hover { color: #ff6d3c; } .blog-single-post .blog-content-part .blog-content-top a i { margin-right: 10px; } .blog-single-post .blog-content-part .blog-title { margin-top: 20px; } .blog-single-post .blog-content-part .blog-title h3 { font-family: "Viga", sans-serif; font-weight: 400; } .blog-single-post .blog-content-part .blog-title h3 a { color: #221b68; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .blog-single-post .blog-content-part .blog-title h3 a:hover { color: #ff6d3c; } .blog-single-post .blog-content-part .blog-content { margin-top: 20px; } .blog-single-post .blog-content-part .btn1 { margin-top: 20px; } .blog-single-post .blog-thumbnail-slider .slick-dots { position: absolute; bottom: 10px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .blog-single-post .blog-thumbnail-slider .slick-dots li button { font-size: 0; width: 6px; height: 6px; border-radius: 50%; border: 1px solid #221b68; outline: none; float: left; margin-left: 10px; background: #221b68; margin-bottom: 10px; padding: 2px; } @media (min-width: 768px) and (max-width: 991.98px) { .blog-single-post .blog-thumbnail-slider .slick-dots li button { margin-right: 10px; } } @media (max-width: 767px) { .blog-single-post .blog-thumbnail-slider .slick-dots li button { margin-right: 10px; } } .blog-single-post .blog-thumbnail-slider .slick-dots li.slick-active button { width: 3px; height: 3px; padding: 1px; background: #ff6d3c; border: 1px solid #ff6d3c; position: relative; z-index: 5; } .blog-single-post .blog-thumbnail-slider .slick-dots li.slick-active button::after { content: ''; position: absolute; top: -5px; left: -5px; width: 12px; height: 12px; border-radius: 50%; border: 1px solid #ff6d3c; } .blog-single-post .blog-thumbnail-slider .slick-dots li.slick-active button::before { content: ''; position: absolute; top: -4px; left: -4px; width: 11px; height: 11px; border-radius: 50%; background: #ffffff; z-index: -1; } .blog-single-post .blog-thumbnail-slider .thumbnail-single-slide { position: relative; } .blog-single-post .blog-thumbnail-slider .prev-arrow, .blog-single-post .blog-thumbnail-slider .next-arrow { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); font-size: 16px; background-color: #221b68; border: 1px solid transparent; border-radius: 5px; color: #ffffff; width: 30px; height: 30px; line-height: 30px; text-align: center; cursor: pointer; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; z-index: 1; } .blog-single-post .blog-thumbnail-slider .prev-arrow:hover, .blog-single-post .blog-thumbnail-slider .next-arrow:hover { background-color: #ff6d3c; } .blog-single-post .blog-thumbnail-slider .prev-arrow { left: 20px; } .blog-single-post .blog-thumbnail-slider .next-arrow { right: 20px; } .blog-single-post .blog-thumbnail-video { position: relative; } .blog-single-post .blog-thumbnail-video .video-play-button { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .blog-single-post .blog-thumbnail-video .video-play-button i { color: #ffffff; background-color: #ff6d3c; font-size: 16px !important; width: 70px !important; height: 70px !important; line-height: 70px !important; text-align: center; border-radius: 50%; } .template-pagination ul li { display: inline; margin: 0 5px; } .template-pagination ul li a { display: inline-block; color: #ff6d3c; background-color: #ffffff; border: 1px solid #ff6d3c; padding: 10px; border-radius: 5px; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; line-height: 16px; font-family: "Viga", sans-serif; } .template-pagination ul li a:hover { color: #ffffff; background-color: #ff6d3c; } .template-pagination ul li a.active { color: #ffffff; background-color: #ff6d3c; } .template-pagination ul li.pagination-arrow a { color: #221b68; background-color: transparent; border: 1px solid transparent; padding: 0; font-size: 18px; } .template-pagination ul li.pagination-arrow a i { font-weight: 700; } .single-widget { padding: 50px 20px; margin-bottom: 30px; background: #ffffff; border-radius: 5px; -webkit-box-shadow: 9.786px 16.286px 69px 0px rgba(0, 0, 0, 0.07); box-shadow: 9.786px 16.286px 69px 0px rgba(0, 0, 0, 0.07); } .single-widget h3 { font-family: "Viga", sans-serif; font-weight: 400; margin-bottom: 20px; } @media (min-width: 576px) and (max-width: 767.98px) { .single-widget { padding: 50px 100px; } } @media (min-width: 768px) and (max-width: 991.98px) { .single-widget { padding: 50px 100px; } } .single-widget + .single-widget { margin-top: 30px; } .single-widget img { width: inherit; margin: 0 auto; } .single-widget .widget-title { margin-bottom: 30px; } .single-widget.search-widget form { width: 100%; } .single-widget.rspost-widget { padding-bottom: 20px; } .single-widget.rspost-widget .separator hr { border: 1px solid #f1f1f1; } .single-widget.rspost-widget .single-pos h4 { font-family: "Viga", sans-serif; font-weight: 400; } .single-widget.rspost-widget .single-pos h4 a:hover { color: #ff6d3c; } .single-widget.tag-widget { margin-top: 30px; } .single-widget.tag-widget li { display: inline-block; margin-right: 5px; margin-bottom: 8px; } .single-widget.tag-widget li a { display: inline-block; text-transform: capitalize; padding: 8px; color: #ff6d3c; border: 1px solid #ff6d3c; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; border-radius: 5px; background: #ffffff; font-size: 14px; line-height: 14px; } .single-widget.tag-widget li a:hover { color: #ffffff; background-color: #ff6d3c; border: 1px solid transparent; border-radius: 5px; } .single-widget.category-widget { margin-top: 30px; } .single-widget.category-widget ul li { line-height: 2; -webkit-transition: all 0.3s ease-in .single-widget.category-widget ul li; -o-transition: all 0.3s ease-in .single-widget.category-widget ul li; transition: all 0.3s ease-in .single-widget.category-widget ul li; } .single-widget.category-widget ul li ::before { content: "\f101"; font-family: "Font Awesome 5 Free"; font-weight: 900; margin-right: 10px; } .single-widget.category-widget ul li a { text-transform: capitalize; font-size: 18px; } .single-widget.category-widget ul li:hover::before { color: #ff6d3c; } .single-widget.category-widget ul li:hover a { color: #ff6d3c; } .header-search { background: #ffffff; border-radius: 5px; -webkit-box-shadow: 9.786px 16.286px 69px 0px rgba(0, 0, 0, 0.07); box-shadow: 9.786px 16.286px 69px 0px rgba(0, 0, 0, 0.07); } .header-search form { position: relative; } .header-search form input { padding: 15px 20px; padding-right: 65px; border: 1px solid #f1f1f1; border-radius: 5px; width: 100%; } .header-search form button { width: 45px; height: 45px; text-align: center; line-height: 45px; background-color: #ff6d3c; color: #ffffff; border-radius: 5px; border: transparent; position: absolute; top: 5px; right: 6px; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .header-search form button:hover { background: transparent; color: #ff6d3c; border: 1px solid #ff6d3c; } .blog-single-item .single-blog-image img { width: inherit; } .blog-single-item .blog-meta ul li a { color: #221b68; text-transform: capitalize; } .blog-single-item .single-blog-content h4 a { color: #221b68; } .blog-comment-area .single-comment img { width: inherit; } .blog-comment-form h3 { margin-bottom: 60px; } .blog-comment-form form input { width: 100%; padding: 20px 30px; border-radius: 5px; border: 1px solid #f1f1f1; margin-bottom: 30px; } .blog-comment-form form textarea { width: 100%; padding: 20px 30px; border-radius: 5px; border: 1px solid #f1f1f1; } .blog-sidebar .single-widget h4 { margin-bottom: 30px; } .blog-sidebar .single-widget h4 a { color: #221b68; } .blog-sidebar .single-widget .author-social-link ul li { color: #221b68; } .blog-sidebar .single-widget .banner-widget-button .btn { background: #ffffff; color: #ff6d3c; } @media (min-width: 768px) and (max-width: 991.98px) { .blog-sidebar { margin-top: 60px; } } @media (min-width: 576px) and (max-width: 767.98px) { .blog-sidebar { margin-top: 60px; } } @media (max-width: 575.98px) { .blog-sidebar { margin-top: 60px; } } /* About Page */ @media (min-width: 768px) and (max-width: 991.98px) { .about-section .about-left { margin-bottom: 120px; } } @media (max-width: 991.98px) { .about-section .about-right { text-align: center; } } .about-section .counter-area { padding-top: 100px; } @media (min-width: 992px) and (max-width: 1199.98px) { .about-section .counter-area { padding-top: 70px; } } @media (max-width: 991.98px) { .about-section .counter-area { padding-top: 70px; } } /* Blog Single Page*/ .blog-content-section .blog-posts .blog-quote { background-color: #ff6d3c; padding: 50px 35px; position: relative; } .blog-content-section .blog-posts .blog-quote .quote-text h3 { color: #ffffff; font-family: "Viga", sans-serif; font-weight: 400; } .blog-content-section .blog-posts .blog-quote span.quote-icon { color: #221b68; -webkit-text-fill-color: #ff6d3c; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: #221b68; font-size: 40px; margin-left: 7px; position: absolute; top: 90px; right: 97px; opacity: .5; } @media (max-width: 991.98px) { .blog-content-section .blog-posts .blog-quote span.quote-icon { top: initial; right: 20px; bottom: 10px; } } .blog-content-section .blog-posts .blog-title { margin-top: 20px; } .blog-content-section .blog-posts .blog-title h3 { font-family: "Viga", sans-serif; font-weight: 400; } .blog-content-section .blog-posts .blog-title h3 a { color: #221b68; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .blog-content-section .blog-posts .blog-title h3 a:hover { color: #ff6d3c; } .blog-content-section .blog-posts .blog-content { margin-top: 20px; } .blog-content-section .blog-posts .content-list .single-list { display: inline-block; font-family: "Viga", sans-serif; margin: 5px 0; font-size: 18px; } .blog-content-section .blog-posts .content-list .single-list i { margin-right: 10px; } .blog-content-section .blog-posts .content-bottom .content-bottom-tag li { display: inline; margin-right: 10px; text-transform: capitalize; font-family: "Roboto", sans-serif; font-weight: 700; font-size: 16px; } .blog-content-section .blog-posts .content-bottom .content-bottom-tag li a { border: 1px solid #ff6d3c; color: #ff6d3c; background: #ffffff; text-transform: capitalize; padding: 5px 10px; font-size: 14px; font-weight: 400; } .blog-content-section .blog-posts .content-bottom .content-bottom-tag li a:hover { color: #ffffff; background: #ff6d3c; } .blog-content-section .blog-posts .content-bottom .blog-social-icons ul { float: right; } @media (min-width: 768px) and (max-width: 991.98px) { .blog-content-section .blog-posts .content-bottom .blog-social-icons ul { float: none; margin-top: 20px; } } @media (max-width: 767px) { .blog-content-section .blog-posts .content-bottom .blog-social-icons ul { float: none; margin-top: 20px; } } .blog-content-section .blog-posts .content-bottom .blog-social-icons ul li { display: inline; margin-left: 10px; } .blog-content-section .blog-posts .content-bottom .blog-social-icons ul li span { font-size: 16px; font-weight: 700; text-transform: capitalize; font-family: #221b68; } .blog-content-section .blog-posts .content-bottom .blog-social-icons ul li a:hover { color: #ff6d3c; } .blog-content-section .blog-posts .single-comment { background: #fafafa; padding: 35px 40px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .blog-content-section .blog-posts .single-comment .comment-image { margin-right: 20px; } .blog-content-section .blog-posts .single-comment .comment-image img { max-width: 100px; } @media (max-width: 575.98px) { .blog-content-section .blog-posts .single-comment .comment-image { display: none; } } .blog-content-section .blog-posts .single-comment .comment-content .comment-content-top { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .blog-content-section .blog-posts .single-comment .comment-content .comment-content-top .content-top-left h4 { font-family: "Viga", sans-serif; font-weight: 400; line-height: 1; } .blog-content-section .blog-posts .single-comment .comment-content .comment-content-top a.reply { border: 1px solid #ff6d3c; color: #ffffff; background: #ff6d3c; text-transform: capitalize; padding: 2px 10px; font-size: 14px; font-weight: 400; } .blog-content-section .blog-posts .single-comment .comment-content .comment-content-top a.reply:hover { color: #ff6d3c; background: #ffffff; } .blog-content-section .blog-posts .blog-excerpt .single-excerpt { background: #fafafa; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 25px; margin-bottom: 30px; } .blog-content-section .blog-posts .blog-excerpt .single-excerpt a .content-left { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; border: 1px solid #ff6d3c; padding: 10px 20px; border-radius: 10px; text-align: center; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; margin-right: 18px; } .blog-content-section .blog-posts .blog-excerpt .single-excerpt a .content-left .day { font-family: "Viga", sans-serif; font-size: 30px; font-weight: 400; } .blog-content-section .blog-posts .blog-excerpt .single-excerpt a .content-left .month { text-transform: capitalize; font-size: 16px; } .blog-content-section .blog-posts .blog-excerpt .single-excerpt a .content-left:hover { background: #ff6d3c; } .blog-content-section .blog-posts .blog-excerpt .single-excerpt a .content-left:hover .day { color: #ffffff; } .blog-content-section .blog-posts .blog-excerpt .single-excerpt a .content-left:hover .month { color: #ffffff; } .blog-content-section .blog-posts .blog-excerpt .single-excerpt .content-right h5 { font-weight: 400; text-transform: capitalize; } .blog-content-section .blog-posts .blog-excerpt .single-excerpt .content-right h5 span { font-size: 32px; font-weight: 600; margin-right: 10px; position: relative; top: -10px; color: #ff6d3c; } .blog-content-section .blog-posts .blog-excerpt .single-excerpt .content-right h3 { font-family: "Viga", sans-serif; font-weight: 400; } .blog-content-section .blog-posts .blog-excerpt .single-excerpt .content-right h3 a:hover { color: #ff6d3c; } .blog-content-section .blog-posts .divider hr { background: #f1f1f1; margin: 60px 0; } .blog-content-section .blog-posts .blog-comment-form { padding: 55px 45px; background: #ffffff; -webkit-box-shadow: 0px 10px 69px 0px rgba(0, 0, 0, 0.07); box-shadow: 0px 10px 69px 0px rgba(0, 0, 0, 0.07); } .blog-content-section .blog-posts .blog-comment-form .comment-title .blog-title h3 { margin-bottom: 30px; } .blog-content-section .blog-posts .blog-comment-form .comment-title .mconform-right form { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .blog-content-section .blog-posts .blog-comment-form .comment-title .mconform-right form input { margin-bottom: 30px; background: #f6f6f6; border: none; padding: 15px; } .blog-content-section .blog-posts .blog-comment-form .comment-title .mconform-right form textarea { margin-bottom: 30px; background: #f6f6f6; width: 100%; border: none; padding: 15px; } .blog-content-section .blog-posts .blog-comment-form .comment-title .mconform-right form .input-one { width: 100%; } .blog-content-section .blog-posts .blog-comment-form .comment-title .mconform-right form .input-two { width: 48%; } /* Homapage 2*/ .hslider2-active .slick-active .hero-left .animate1 { -webkit-animation: fadeInUp; animation: fadeInUp; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; } .hslider2-active .slick-active .hero-left .animate2 { -webkit-animation: fadeInUp; animation: fadeInUp; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; } .hslider2-active .slick-active .hero-left .animate3 { -webkit-animation: fadeInDown; animation: fadeInDown; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; } .hslider2-active .slick-active .hero-right .animate5 { -webkit-animation: fadeIn; animation: fadeIn; -webkit-animation-duration: 3s; animation-duration: 3s; } .hslider2-active .slickArrow { position: absolute; bottom: 10px; } .hslider2-active .arrow-prev { position: absolute; bottom: 10px; z-index: 10; } .hslider2-active .arrow-prev { position: absolute; bottom: 120px; left: 30px; width: 40px; height: 40px; background: #ff6d3c; z-index: 10; border-radius: 50%; text-align: center; line-height: 40px; color: #ffffff; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; cursor: pointer; } @media (min-width: 1200px) and (max-width: 1439.98px) { .hslider2-active .arrow-prev { bottom: 109px; } } .hslider2-active .arrow-next { position: absolute; bottom: 60px; left: 30px; width: 40px; height: 40px; background: transparent; z-index: 10; border-radius: 50%; text-align: center; line-height: 40px; color: #ffffff; border: 1px solid #ff6d3c; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; cursor: pointer; } @media (min-width: 1200px) and (max-width: 1439.98px) { .hslider2-active .arrow-next { bottom: 109px; left: 80px; } } .hslider2-active .arrow-next:hover { background: #ff6d3c; } .hslider2-active .slick-dots { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: absolute; top: 50%; left: 30px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .hslider2-active .slick-dots li button { font-size: 0; width: 10px; height: 10px; border-radius: 50%; border: 1px solid #221b68; outline: none; float: left; margin-left: 10px; background: #ffffff; margin-bottom: 10px; padding: 2px; } @media (min-width: 768px) and (max-width: 991.98px) { .hslider2-active .slick-dots li button { margin-right: 10px; } } @media (max-width: 767px) { .hslider2-active .slick-dots li button { margin-right: 10px; } } .hslider2-active .slick-dots li.slick-active button { background: #ff6d3c; border: 1px solid #ff6d3c; } .heroSlider2 { background: #7027c3; position: relative; overflow: hidden; padding-top: 200px; padding-bottom: 150px; } @media (min-width: 768px) and (max-width: 991.98px) { .heroSlider2 { padding-bottom: 110px; } } @media (max-width: 767px) { .heroSlider2 { padding-top: 180px; padding-bottom: 100px; } } .heroSlider2::after { content: ''; position: absolute; background: #7b48b5; top: 0; left: 110px; width: 1px; height: 100%; } @media (min-width: 1200px) and (max-width: 1439.98px) { .heroSlider2::after { display: none; } } @media (min-width: 992px) and (max-width: 1199.98px) { .heroSlider2::after { display: none; } } @media (max-width: 991.98px) { .heroSlider2::after { display: none; } } .heroSlider2::before { content: ''; position: absolute; background: #7b48b5; top: 0; right: 110px; width: 1px; height: 100%; } @media (min-width: 1200px) and (max-width: 1439.98px) { .heroSlider2::before { display: none; } } @media (min-width: 992px) and (max-width: 1199.98px) { .heroSlider2::before { display: none; } } @media (max-width: 991.98px) { .heroSlider2::before { display: none; } } .heroSlider2 .hero-shapes img { width: inherit; } .heroSlider2 .hero-shapes .s1 { position: absolute; left: 10%; top: 16%; } .heroSlider2 .hero-shapes .s2 { position: absolute; right: 10%; top: 16%; } .heroSlider2 .hero-shapes .s3 { position: absolute; left: 0px; bottom: 0px; } .heroSlider2 .hero-shapes .s4 { position: absolute; right: 0px; bottom: 0px; } .heroSlider2 .social-text { position: absolute; right: -90px; top: 50%; } @media (min-width: 1200px) and (max-width: 1439.98px) { .heroSlider2 .social-text { right: initial; top: initial; left: 12%; bottom: 14%; } } @media (min-width: 992px) and (max-width: 1199.98px) { .heroSlider2 .social-text { right: initial; top: initial; left: 50%; bottom: 11%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } } @media (max-width: 991.98px) { .heroSlider2 .social-text { right: initial; top: initial; left: 48%; bottom: 8%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } } .heroSlider2 .social-text ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); } @media (min-width: 1200px) and (max-width: 1439.98px) { .heroSlider2 .social-text ul { -webkit-transform: initial; -ms-transform: initial; transform: initial; } } @media (min-width: 992px) and (max-width: 1199.98px) { .heroSlider2 .social-text ul { -webkit-transform: initial; -ms-transform: initial; transform: initial; } } @media (max-width: 991.98px) { .heroSlider2 .social-text ul { -webkit-transform: initial; -ms-transform: initial; transform: initial; } } .heroSlider2 .social-text ul li { margin-left: 20px; position: relative; } .heroSlider2 .social-text ul li a { color: #ffffff; text-transform: uppercase; } .heroSlider2 .social-text ul li:hover a { color: #ff6d3c; } .heroSlider2 .social-text ul li:hover::before { color: #ff6d3c; } @media (max-width: 991.98px) { .heroSlider2 .hero-left { text-align: center; } } .heroSlider2 .hero-left h5 { color: #ffffff; font-weight: 400; margin-bottom: 15px; } .heroSlider2 .hero-left h1 { color: #ffffff; font-weight: 400; margin-bottom: 55px; } .fea2-area .fea2-wrapper { background: #ff6d3c; padding: 60px 130px; margin-top: -95px; z-index: 11; position: relative; overflow: hidden; } @media (min-width: 992px) and (max-width: 1199.98px) { .fea2-area .fea2-wrapper { margin-top: -40px; } } @media (max-width: 991.98px) { .fea2-area .fea2-wrapper { margin-top: 120px; padding: 60px 70px; } } @media (max-width: 767px) { .fea2-area .fea2-wrapper { padding: 60px 30px; } } .fea2-area .fea2-wrapper .fea2-shapes .f1 { position: absolute; bottom: -44%; right: -8%; width: inherit; } .fea2-area .fea2-wrapper .fea2-shapes .f2 { position: absolute; top: 17%; right: 12%; width: inherit; } @media (max-width: 991.98px) { .fea2-area .fea2-wrapper .fea2-left { margin-bottom: 60px; } } .fea2-area .fea2-wrapper .fea2-right { padding: 10px; } .fea2-area .fea2-wrapper .fea2-right h4 { color: #ffffff; } .fea2-area .fea2-wrapper .fea2-right h2 { color: #ffffff; } .fea2-area .fea2-wrapper .fea2-right .content-bottom { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (max-width: 575.98px) { .fea2-area .fea2-wrapper .fea2-right .content-bottom { display: initial; } } .fea2-area .fea2-wrapper .fea2-right .content-bottom .price { margin-right: 50px; } @media (max-width: 575.98px) { .fea2-area .fea2-wrapper .fea2-right .content-bottom .price { margin-bottom: 30px; } } .fea2-area .fea2-wrapper .fea2-right .content-bottom .price h3 { color: #ffffff; font-family: "Viga", sans-serif; font-weight: 400; } .fea2-area .fea2-wrapper .fea2-right .content-bottom a { color: #ffffff; font-family: "Viga", sans-serif; font-weight: 400; font-size: 24px; } .fea2-area .fea2-wrapper .fea2-right .content-bottom a span { background: #7027c3; width: 50px; height: 50px; line-height: 50px; border-radius: 50%; margin-right: 20px; text-align: center; display: inline-block; } .about2-section { overflow: hidden; } @media (min-width: 768px) and (max-width: 991.98px) { .about2-section .about-left { margin-bottom: 70px; } } @media (max-width: 767px) { .about2-section .about-left { margin-bottom: initial; } } .about2-section .about-left h3 { font-family: "Viga", sans-serif; margin-bottom: 30px; } .about2-section .about-left p { margin-bottom: 30px; } .about2-section .about-left .brands { display: -webkit-box; display: -ms-flexbox; display: flex; margin-bottom: 60px; -ms-flex-wrap: wrap; flex-wrap: wrap; } .about2-section .about-left .brands img { width: inherit; margin-right: 20px; margin-top: 20px; } .about2-section .about-right { position: relative; } @media (max-width: 991.98px) { .about2-section .about-right { margin-bottom: 90px; } } .about2-section .about-right img { width: inherit; } .about2-section .about-right .aboutimg-2 { position: absolute; right: 6px; top: -4px; z-index: -1; } .service-section2 { background: -webkit-linear-gradient(127deg, #fdffda 0%, #f3fff6 100%); background: -o-linear-gradient(127deg, #fdffda 0%, #f3fff6 100%); background: linear-gradient(323deg, #fdffda 0%, #f3fff6 100%); position: relative; overflow: hidden; } .service-section2 .ser2-shapes .s11 { width: inherit; position: absolute; bottom: -50px; left: 0; } .service-section2 .ser2-shapes .s12 { width: inherit; position: absolute; bottom: -50px; right: 0; } .service-section2 .ser2-shapes .s13 { width: inherit; position: absolute; top: 70px; left: 70px; } .service-section2 .ser2-shapes .s14 { width: inherit; position: absolute; top: 70px; right: 70px; } .service-section2 .service2-slider-active .slick-dots { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-top: 30px; } .service-section2 .service2-slider-active .slick-dots li button { font-size: 0; width: 10px; height: 10px; border-radius: 50%; border: 1px solid #221b68; outline: none; float: left; margin-left: 10px; background: #221b68; margin-bottom: 10px; padding: 2px; } @media (min-width: 768px) and (max-width: 991.98px) { .service-section2 .service2-slider-active .slick-dots li button { margin-right: 10px; } } @media (max-width: 767px) { .service-section2 .service2-slider-active .slick-dots li button { margin-right: 10px; } } .service-section2 .service2-slider-active .slick-dots li.slick-active button { background: #ff6d3c; border: 1px solid #ff6d3c; } .service-section2 .single2-service { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: #ffffff; padding: 30px 15px; position: relative; overflow: hidden; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; margin-bottom: 30px; } .service-section2 .single2-service .shapes .vec { width: 150px; position: absolute; top: -20px; left: -20px; opacity: 0; visibility: hidden; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .service-section2 .single2-service .icon-box span { color: #ff6d3c; margin-right: 20px; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .service-section2 .single2-service .icon-box span i::before { font-size: 50px; } .service-section2 .single2-service .content-box h3 { margin-bottom: 20px; } .service-section2 .single2-service .content-box h3 a { font-family: "Viga", sans-serif; font-weight: 400; } .service-section2 .single2-service .content-box a { font-family: "Roboto", sans-serif; font-weight: 400; text-transform: uppercase; } .service-section2 .single2-service:hover { background: #ff6d3c; -webkit-box-shadow: 0px 0px 30px 0px rgba(130, 36, 5, 0.15); box-shadow: 0px 0px 30px 0px rgba(130, 36, 5, 0.15); } .service-section2 .single2-service:hover .shapes .vec { visibility: visible; opacity: 1; } .service-section2 .single2-service:hover .icon-box span { color: #ffffff; } .service-section2 .single2-service:hover .content-box h3 a { color: #ffffff; } .service-section2 .single2-service:hover .content-box h3 a:hover { color: #7027c3; } .service-section2 .single2-service:hover .content-box a { color: #ffffff; } .service-section2 .single2-service:hover .content-box a:hover { color: #7027c3; } @media (min-width: 992px) and (max-width: 1199.98px) { .portfolio-section2 .common-title { margin-bottom: 20px; } } @media (max-width: 991.98px) { .portfolio-section2 .common-title { margin-bottom: 20px; } } .portfolio-section2 .portfolio-btn button { border-radius: 8px; padding: 5px 15px; margin-left: 2px; } .portfolio-section2 .portfolio-btn button::before { content: ''; display: none; } .portfolio-section2 .portfolio-btn button:hover { background: #ff6d3c; color: #ffffff; } .portfolio-section2 .portfolio-btn button.active { background: #ff6d3c; color: #ffffff; } .business-section { background: #7027c3; } @media (max-width: 991.98px) { .business-section .business-left { margin-bottom: 60px; } } .business-section .business-left .common-title h5 { color: #ffffff; margin-bottom: 30px; } .business-section .business-left .common-title h2 { color: #ffffff; } .business-section .business-left .tools { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .business-section .business-left .tools span { color: #ffffff; font-size: 16px; font-weight: 400; text-transform: capitalize; } .business-section .business-left .tools .tol { width: 40px; margin-left: 20px; } .business-section .business-left .designer { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (max-width: 575.98px) { .business-section .business-left .designer { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } .business-section .business-left .designer .single-designer { margin-right: 20px; padding: 20px; background: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .business-section .business-left .designer .single-designer .img-box { margin-bottom: 20px; } .business-section .business-left .designer .single-designer .img-box img { width: 60px; margin: 0 auto; } .business-section .business-left .designer .single-designer .content-box { margin-left: 10px; } .business-section .business-left .designer .single-designer .content-box h4 { margin-bottom: 10px; font-family: "Viga", sans-serif; font-weight: 400; } .business-section .business-left .designer .single-designer .content-box p { text-transform: capitalize; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .business-section .business-left .designer .single-designer:hover { background: #ff6d3c; border-radius: 10px; } .business-section .business-left .designer .single-designer:hover .content-box { margin-left: 10px; } .business-section .business-left .designer .single-designer:hover .content-box h4 { color: #ffffff; } .business-section .business-left .designer .single-designer:hover .content-box p { color: #ffffff; } .business-section .business-right { position: relative; } .business-section .business-right .bs1 { position: absolute; max-width: 120px; top: 0; left: 0; } .business-section .business-right .bs2 { position: absolute; max-width: 120px; bottom: 0; right: 0; } .pricing-section2 ul.nav { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .pricing-section2 ul.nav li a { padding: 8px 15px; border-radius: 8px; font-size: 16px; font-weight: 500; text-transform: capitalize; margin-left: 10px; } .pricing-section2 ul.nav li a.active { background: #ff6d3c; color: #ffffff; } .pricing-section2 .single-pricing { background: #f6f6f6; border-radius: 0; padding: 55px 60px; } .pricing-section2 .single-pricing .img-box { width: 55px; height: 55px; border-radius: 50%; padding: 15px; background: #7027c3; margin-bottom: 20px; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .pricing-section2 .single-pricing h5 { font-weight: 500; margin-bottom: 10px; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .pricing-section2 .single-pricing .hdline { font-size: 30px; font-weight: 400; text-transform: capitalize; font-family: "Viga", sans-serif; -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .pricing-section2 .single-pricing:hover { border-radius: 10px; } .pricing-section2 .single-pricing:hover .img-box { background: #ffffff; } .pricing-section2 .single-pricing:hover h5 { color: #ffffff; } .pricing-section2 .single-pricing:hover .hdline { color: #ffffff; } .pricing-section2 .single-pricing:hover .btn3 { background: #ffffff; border: 1px solid transparent; color: #ff6d3c; -webkit-transform: all 0.3s ease-in; -ms-transform: all 0.3s ease-in; transform: all 0.3s ease-in; } .pricing-section2 .single-pricing:hover .btn3:hover { color: #221b68; } .feedback-section2 { background: #7027c3; position: relative; overflow: hidden; } .feedback-section2 .common-title { padding: 20px; } .feedback-section2 .feed-shapes .s1 { position: absolute; bottom: -20px; left: 0; width: inherit; } .feedback-section2 .feed-shapes .s2 { position: absolute; bottom: -20px; right: 0; width: inherit; } .feedback-section2 .feedback-slider-active .slick-track { padding: 20px 0; } .feedback-section2 .feedback-slider-active .slick-dots { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: absolute; top: -78px; right: 35px; } @media (max-width: 991.98px) { .feedback-section2 .feedback-slider-active .slick-dots { position: initial; margin-top: 30px; } } .feedback-section2 .feedback-slider-active .slick-dots li button { font-size: 0; width: 10px; height: 10px; border-radius: 50%; border: 1px solid #221b68; outline: none; float: left; margin-left: 10px; background: #ffffff; margin-bottom: 10px; padding: 2px; } @media (min-width: 768px) and (max-width: 991.98px) { .feedback-section2 .feedback-slider-active .slick-dots li button { margin-right: 10px; } } @media (max-width: 767px) { .feedback-section2 .feedback-slider-active .slick-dots li button { margin-right: 10px; } } .feedback-section2 .feedback-slider-active .slick-dots li.slick-active button { background: #ff6d3c; border: 1px solid #ff6d3c; } .feedback-section2 .common-title h4 { color: #ffffff; } .feedback-section2 .common-title h2 { color: #ffffff; } .feedback-section2 .single-feedback2 { background: #ffffff; } .feedback-section2 .single-feedback2 p { -webkit-transition: all 0.3s ease-in; -o-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } .feedback-section2 .single-feedback2 .upper-content { margin-bottom: 0; } .feedback-section2 .single-feedback2 .upper-content .content-box { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .feedback-section2 .single-feedback2 .upper-content .content-box h3 { margin-right: 20px; } .feedback-section2 .single-feedback2 .upper-content .content-box h5 { margin-right: 20px; } .feedback-section2 .single-feedback2:hover { background: #ff6d3c; border-radius: 8px; } .feedback-section2 .single-feedback2:hover p { color: #ffffff; } .feedback-section2 .single-feedback2:hover .upper-content .content-box h3 { color: #ffffff; } .feedback-section2 .single-feedback2:hover .upper-content .content-box h5 { color: #ffffff; } .feedback-section2 .single-feedback2:hover .upper-content .content-box .ratings { background: #7027c3; } .subs-area2 { margin-bottom: -240px; z-index: 111; position: relative; } @media (max-width: 991.98px) { .subs-area2 .cllients-left { margin-bottom: 30px; } } .subs-area2 .subscribe-area { position: relative; overflow: hidden; } .subs-area2 .subscribe-area .s1 { position: absolute; bottom: -143px; right: -145px; width: inherit; } .subs-area2 .subscribe-area .subs-right .subs-form { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .subs-area2 .subscribe-area .subs-right .subs-form input[type="text"] { height: 50px; width: 64%; padding-right: initial; border-radius: 5px; padding: 20px; } @media (min-width: 992px) and (max-width: 1199.98px) { .subs-area2 .subscribe-area .subs-right .subs-form input[type="text"] { width: 50%; } } @media (min-width: 576px) and (max-width: 767.98px) { .subs-area2 .subscribe-area .subs-right .subs-form input[type="text"] { width: 100%; margin-bottom: 30px; } } @media (max-width: 575.98px) { .subs-area2 .subscribe-area .subs-right .subs-form input[type="text"] { width: 100%; } } .subs-area2 .subscribe-area .subs-right .subs-form button { position: initial; background: #ffffff; color: #ff6d3c; height: initial; width: initial; display: inline-block; padding: 5px 20px; margin-left: 10px; border: 1px solid transparent; } @media (min-width: 992px) and (max-width: 1199.98px) { .subs-area2 .subscribe-area .subs-right .subs-form button { width: 46%; } } @media (max-width: 767px) { .subs-area2 .subscribe-area .subs-right .subs-form button { width: 100%; margin-left: initial; } } .subs-area2 .subscribe-area .subs-right .subs-form button:hover { color: #ffffff; border: 1px solid #ffffff; background: transparent; } .subs-area2 .subscribe-area .subs-right .subs-form button.btn2::after { display: none; }