/* =====================================
Template Name: Cliping Hunt
Author Name: Salim Mohammad Salauddin
Author URI: 
Description: Cliping Hunt - Photoshop Clipping HTML5 Template.
Version:1.0
========================================*/
/*======================================
[ CSS Table of contents ]
01. Preloader CSS
02. Header CSS
	+ Logo
	+ Category Menu
	+ Main Menu
	
03. Hero Area CSS
04. Why Choose Us CSS
05. Services Area CSS
06. Service Page CSS
07. Contact CSS
08. Pricing CSS
09. Pricing Page CSS
10. Team CSS
11. Testimonials CSS
12. Free Trial CSS
13. Client CSS
14. Contact Page CSS
    +Mail Success
    
15. Portfolio Page CSS
16. About-US Page CSS
17. 404 Error Page CSS
18. Free Trial Page CSS
19. Footer CSS
========================================*/



/*======================================
	01. Preloader CSS
========================================*/

.preloader {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999999999;
    width: 100%;
    height: 100%;
    background-color: #fff;
    overflow: hidden;
}

.preloader-inner {
    position: absolute;
    top: 50% !important;
    left: 50% !important;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.preloader-icon {
    width: 100px;
    height: 100px;
    display: inline-block;
    padding: 0px;
}

.preloader-icon span {
    position: absolute;
    display: inline-block;
    width: 100px;
    height: 100px;
    border-radius: 100%;
    background: #00d966;
    -webkit-animation: preloader-fx 1.6s linear infinite;
    animation: preloader-fx 1.6s linear infinite;
}

.preloader-icon span:last-child {
    animation-delay: -0.8s;
    -webkit-animation-delay: -0.8s;
}

@keyframes preloader-fx {
    0% {
        transform: scale(0, 0);
        opacity: 0.5;
    }
    100% {
        transform: scale(1, 1);
        opacity: 0;
    }
}

@-webkit-keyframes preloader-fx {
    0% {
        -webkit-transform: scale(0, 0);
        opacity: 0.5;
    }
    100% {
        -webkit-transform: scale(1, 1);
        opacity: 0;
    }
}
/* End Preloader */


.btn {
    display: inline-block;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 500;
    color: #fff;
    background: #333;
    display: inline-block;
    padding: 10px 20px;
    border-radius: 0px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.btn:hover {
    background-color: #00d966;
    color: #fff;
    -webkit-box-shadow: 0 1rem 3rem rgba(0, 217, 102, .15)!important;
    box-shadow: 0 1rem 3rem rgba(0, 217, 102, .15)!important;
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
}

#scrollUp {
    right: 90px;
    z-index: 33;
    bottom: 27px;
    text-align: center;
}

#scrollUp i {
    height: 40px;
    width: 40px;
    line-height: 40px;
    background: transparent;
    background: #222;
    border-radius: 0;
    font-size: 18px;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    transition: all 500ms ease;
    display: block;
    color: #fff;
    box-shadow: 0px 4px 19px #00000038;
}

#scrollUp i:hover {
    background: #00d966;
    color: #fff;
}


/*======================================
	02. Header CSS
========================================*/

/* Topbar */

.topbar {
    background-color: #fff;
    padding: 15px 0;
}

/* Logo */

.header .logo {
    float: left;
    margin-top: 35px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.header .navbar {
    padding: 0;
}

.header .middle-inner {
    display: none;
}


/* Main Menu */

.navbar-expand-lg .navbar-collapse {
    display: block !important;
}

.header.v3 .navbar-expand-lg .navbar-collapse {
    display: block !important;
    background: #333;
}

.header .nav li a i {
    margin-left: 6px;
    font-size: 10px;
}


/* Dropdown Menu */

.header .nav li .dropdown {
    background: #fff;
    width: 240px;
    position: absolute;
    top: 100%;
    z-index: 999;
    -webkit-box-shadow: 0px 3px 5px #3333334d;
    -moz-box-shadow: 0px 3px 5px #3333334d;
    box-shadow: 0px 3px 5px #3333334d;
    transform-origin: 0 0 0;
    transform: scaleY(0.2);
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    opacity: 0;
    visibility: hidden;
    padding: 10px;
    left: 0;
    margin: 0;
}

.header .nav li:hover .dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0px);
}

.header .nav li .dropdown li {
    float: none;
    margin: 0;
}

.header .nav li .dropdown li a {
    padding: 8px 15px;
    color: #666;
    display: block;
    font-weight: 400;
    text-transform: capitalize;
    background: transparent;
}

.header .nav li .dropdown li a:before {
    display: none;
}

.header .nav li .dropdown li:last-child a {
    border-bottom: 0px;
}

.header .nav li .dropdown li:hover a {
    color: #fff;
    background: #00d966;
}

.header .nav li .dropdown li a:hover {
    border-color: transparent;
}

.header .nav li .dropdown li i {
    float: right;
    margin-top: 8px;
    font-size: 10px;
    z-index: 5;
}

.header .nav li .dropdown.sub-dropdown {
    background: #fff;
    width: 220px;
    position: absolute;
    left: 186px;
    top: 0;
    z-index: 999;
    -webkit-box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 3px 5px #3333334d;
    transform-origin: 0 0 0;
    transform: scaleY(0.2);
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    opacity: 0;
    visibility: hidden;
    padding: 10px;
}

.header .nav li .dropdown li:hover .dropdown.sub-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0px);
}

.header .nav li .dropdown.sub-dropdown li a {
    padding: 8px 15px;
    color: #666;
    display: block;
    font-weight: 400;
    text-transform: capitalize;
    background: transparent;
}

.header .nav li .dropdown li:hover .dropdown.sub-dropdown li a {
    background: transparent;
}

.header .nav li .dropdown li .dropdown.sub-dropdown li a:hover {
    color: #fff;
    background: #00d966;
}

.header .nav li .dropdown.sub-dropdown li:last-child a {
    border-bottom: 0px solid;
}

.mobile-search {
    display: none;
}

.header.shop .topbar {
    padding: 12px 0px;
}

.header.shop .nav-inner {
    margin-right: 188px;
}

.header.shop .logo {
    float: left;
    margin-top: 35px;
}

.header.shop .top-contact {
    margin-top: 0px;
}

.header.shop .topbar p {
    color: #ccc;
}

.header.shop .topbar .login a {
    color: #00d966;
}


/* Topbar Left Nav */

.header.shop .left-nav {}

.header.shop .top-left .list-main li:first-child {
    padding-left: 0;
}

.header.shop .top-left .list-main li i {
    display: inline-block;
    margin-right: 4px;
    font-size: 18px;
    color: #00d966;
    position: relative;
    top: 3px;
}

.header.shop .right-content {
    float: right;
}

.header.shop .right-content .list-main .button .btn {
    padding: 0px 15px;
    color: #fff;
}

.header.shop .right-content .list-main .button .btn:hover {}

.header.shop .list-main li {
    display: inline-block;
    color: #333;
    font-size: 13px;
    font-weight: 500;
    border-right: 1px solid #f0f0f0;
    padding: 0px 13px;
}

.header.shop .list-main li i {
    display: inline-block;
    margin-right: 4px;
    font-size: 18px;
    color: #00d966;
    position: relative;
    top: 1px;
}

.header.shop .list-main li:last-child {
    padding-right: 0;
    border-right: none;
}

.header.shop .list-main li a {
    color: #333;
}

.header.shop .list-main li a:hover {
    color: #00d966;
}

.header.shop .nav li {
    margin-right: 40px;
    float: left;
    position: relative;
}

.header.shop .nav li {
    margin-right: 38px;
    position: relative;
}

.header.shop .nav li:last-child {
    margin: 0 !important;
}


/* Shopping Cart */

.header .shopping {
    display: inline-block;
    z-index: 9999;
}

.header .shopping .icon {
    position: relative;
    cursor: pointer;
    color: #222;
}

.header .shopping .shopping-item {
    position: absolute;
    top: 68px;
    right: 0;
    width: 300px;
    background: #fff;
    padding: 20px 25px;
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    -webkit-transform: translateY(10px);
    -moz-transform: translateY(10px);
    transform: translateY(10px);
    -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
    opacity: 0;
    visibility: hidden;
    z-index: 99;
}

.header .shopping:hover .shopping-item {
    transform: translateY(0px);
    opacity: 1;
    visibility: visible;
}

.header .shopping .dropdown-cart-header {
    padding-bottom: 10px;
    margin-bottom: 15px;
    border-bottom: 1px solid #e6e6e6;
}

.header .shopping .dropdown-cart-header span {
    text-transform: uppercase;
    color: #222;
    font-size: 13px;
    font-weight: 600;
}

.header .shopping .dropdown-cart-header a {
    float: right;
    text-transform: uppercase;
    color: #222;
    font-size: 13px;
    font-weight: 600;
}

.header .shopping .dropdown-cart-header a:hover {
    color: #00d966;
}

.header .shopping-list li {
    overflow: hidden;
    border-bottom: 1px solid #e6e6e6;
    padding-bottom: 15px;
    margin-bottom: 15px;
    position: relative;
}

.header .shopping-list li .remove {
    position: absolute;
    left: 0;
    bottom: 16px;
    margin-top: -20px;
    height: 20px;
    width: 20px;
    line-height: 18px;
    text-align: center;
    background: #fff;
    color: #222;
    border-radius: 0;
    font-size: 11px;
    border: 1px solid #ededed;
}

.header .shopping-list li .remove:hover {
    background: #222;
    color: #fff !important;
    border-color: transparent;
}

.header .shopping-list .cart-img {
    float: right;
    border: 1px solid #ededed;
    overflow: hidden;
}

.header .shopping-list .cart-img img {
    width: 70px;
    height: 70px;
    border-radius: 0;
}

.header .shopping-list .cart-img:hover img {
    transform: scale(1.09);
}

.header .shopping-list .quantity {
    line-height: 22px;
    font-size: 13px;
    padding-bottom: 30px;
}

.header .shopping-list h4 {
    font-size: 14px;
}

.header .shopping-list h4 a {
    font-weight: 600;
    font-size: 13px;
    color: #333;
}

.header .shopping-list h4 a:hover {
    color: #00d966;
}

.header .shopping-item .bottom {
    text-align: center;
}

.header .shopping-item .total {
    overflow: hidden;
    display: block;
    padding-bottom: 10px;
}

.header .shopping-item .total span {
    text-transform: uppercase;
    color: #222;
    font-size: 13px;
    font-weight: 600;
    float: left;
}

.header .shopping-item .total .total-amount {
    float: right;
    font-size: 14px;
}

.header .shopping-item .bottom .btn {
    background: #222;
    padding: 10px 20px;
    display: block;
    color: #fff;
    margin-top: 10px;
    border-radius: 0px;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 500;
}

.header .shopping-item .bottom .btn:hover {
    background: #00d966;
    color: #fff;
}

.header.shop {
    background: #fff;
}

.header.shop .nav-inner {
    margin: 0;
    float: left;
}

.header.shop .topbar {
    background-color: #fff;
    border: none;
}

.header.shop.v3 .topbar {
    padding: 0;
}

.header.shop.v3 .topbar .inner-content {
    border-bottom: 1px solid #eee;
    padding: 12px 0px;
}

.header.shop .right-nav li a {
    color: #333;
}

.header.shop .logo {
    float: left;
    margin: 8px 0 0;
}
.header.shop .logo img{
    width:92%;
}

.header.shop .top-contact {
    margin-top: 0px;
}


/* Header Middle */

.header.shop .search-bar-top {
    text-align: center;
    margin-top: 10px;
}

.header.shop .search-bar {
    margin-top: 33px;
    width: 460px;
    height: 40px;
    display: inline-block;
    background: #fff;
    position: relative;
}

.header.shop .search-bar {
    width: 535px;
    height: 50px;
    display: inline-block;
    background: #fff;
    position: relative;
    margin: 0;
    line-height: 45px;
    border-radius: 5px;
    border: 1px solid #ececec;
}

.header.shop .nice-select {
    clear: initial;
    margin: 0;
    height: 48px;
    width: 150px;
    border: none;
    text-align: center;
    background: transparent;
    text-transform: capitalize;
    padding: 0 0 0 20px;
    border-right: 1px solid #eee;
    line-height: 50px;
    font-size: 14px;
    font-weight: 400;
}

.header.shop .nice-select::after {
    border-color: #666;
    right: 20px;
}

.header.shop .nice-select .list {
    border-radius: 0px;
}

.header.shop .nice-select .list li.focus {
    font-weight: 400;
}

.header.shop .nice-select .list li {
    color: #666;
    border-radius: 0px;
    font-size: 14px;
    font-weight: 400;
}

.header.shop .nice-select .list li:hover {
    background: #00d966;
    color: #fff;
}

.header.shop .search-bar form {
    display: inline-block;
    float: left;
    width: 260px;
}

.header.shop .search-bar input {
    height: 48px;
    background: transparent;
    color: #666;
    border-radius: 0;
    border: none;
    font-size: 14px;
    font-weight: 400;
    padding: 0 25px 0 20px;
    width: 328px;
}

.header.shop .search-bar .btnn {
    height: 50px;
    line-height: 53px;
    width: 62px;
    text-align: center;
    font-size: 18px;
    color: #fff;
    background: #333333;
    position: absolute;
    right: -2px;
    top: -1px;
    border: none;
    border-radius: 0 5px 5px 0;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.header.shop .search-bar .btnn:hover {
    color: #fff;
    background: #00d966;
}


/* Search Form */

.header.shop .search-top {
    opacity: 1;
    visibility: visible;
    top: 0;
    background: transparent;
    border: none;
    box-shadow: none;
    padding: 0;
    top: 0;
}

.header.shop .middle-inner {
    padding: 20px 0;
    background: #fff;
}

.header.shop.v3 .middle-inner {
    border: none;
}

.header.shop .header-inner {
    background: #f5f5f5;
}

.header.shop.v3 .header-inner {
    background: transparent;
}

.header.shop.v2 .header-inner {
    background: #f5f5f5;
}

.header.shop .topbar p {
    color: #333;
}

.header.shop .menu-origin {
    float: none;
    display: inline-block;
    float: right;
}

.header.shop .nav li {
    margin-right: 40px;
    float: left;
    position: relative;
}

.header.shop .nav li {
    margin-right: 5px;
    position: relative;
    float: none;
}

.header.shop .nav li:last-child {
    margin-right: 0;
}

.header.shop .nav li .new {
    background: #00d966;
    color: #fff;
    text-transform: uppercase;
    font-size: 9px;
    position: absolute;
    left: 21px;
    top: 2px;
    font-weight: 500;
    height: 18px;
    line-height: 18px;
    text-align: center;
    display: block;
}

.header.shop.v2 .nav li a {
    color: #333;
}

.header.shop .nav li a {
    color: #333;
    text-transform: capitalize;
    font-size: 15px;
    padding:18px 7px;
    font-weight: 500;
    display: block;
    position: relative;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.header.shop .nav li:hover a {
    color: #fff;
    background: #00d966;
}

.header.shop.v2 .nav li:hover a {
    color: #00d966;
    background: transparent;
}

.header.shop .nav li.active a {
    color: #fff;
    background: #00d966;
}

.header.shop.v2 .nav li.active a {
    color: #333 !important;
    background: transparent !important;
}

.header.shop.v2 .nav li.active a {
    color: #00d966 !important;
}

.header.shop .nav .dropdown li {
    margin: 0;
}

.header.shop .nav li .dropdown li:hover a {
    background: #00d966;
}

.header.shop.v2 .nav li.active .dropdown li a {
    color: #333 !important;
}

.header.shop.v2 .nav li.active .dropdown li a:hover {
    color: #fff !important;
    background: #00d966 !important;
}

.header.shop.v2 .nav li.active .dropdown li a:hover {
    color: #fff !important;
}

.header.shop.v2 .nav li .dropdown li:hover a {
    color: #00d966;
}

.header.shop .nav li .dropdown li a {
    color: #333;
    padding: 8px 15px;
    font-weight: 400;
    background: #fff;
}

.header.shop.v2 .nav li .dropdown li a {
    color: #333;
    background: #fff;
}

.header.shop .nav li .dropdown li a {
    font-weight: 400;
    font-size: 14px;
}

.header.shop .nav li .dropdown li a:hover {
    color: #fff;
}

.header.shop.v2 .nav li .dropdown li a:hover {
    color: #fff !important;
    background: #00d966;
}

.header.shop .nav li .dropdown li .dropdown.sub-dropdown li a:hover {
    background: #00d966;
}

.header.shop .right-bar {
    display: inline-block;
    padding: 0;
    margin: 0;
    top: 10px;
    float: right;
    position: relative;
    margin-top: 2px;
}

.header.shop .right-bar .sinlge-bar.top-search a {
    transform: translateY(3px);
}

.header.shop .right-bar .sinlge-bar.top-search a:hover {
    color: #00d966;
}

.header.shop .right-bar .sinlge-bar .single-icon {
    color: #333;
    font-size: 20px;
    position: relative;
}

.header.shop .right-bar .sinlge-bar .single-icon:hover {
    color: #00d966;
}

.header.shop .right-bar .sinlge-bar .single-icon .total-count {
    position: absolute;
    top: -7px;
    right: -8px;
    background: #f6931d;
    width: 18px;
    height: 18px;
    line-height: 18px;
    text-align: center;
    color: #fff;
    border-radius: 100%;
    font-size: 11px;
}

.header.shop .right-bar .sinlge-bar {
    display: inline-block;
    margin-right: 10px;
}

.header.shop .right-bar .sinlge-bar:last-child {
    margin-right: 0px;
}

.header.shop .right-bar .sinlge-bar li a:hover {
    color: #00d966;
}

.header.shop .right-bar .sinlge-bar .button .btn {
    background: #000;
    padding: 5px 15px;
    color: #fff;
}

.header.shop .right-bar .sinlge-bar .button .btn.alt {
    background: #00d966;
    color: #fff;
}

.header.shop .right-bar .sinlge-bar .button .btn.alt:hover {
    background: #333;
    color: #fff;
}

.header.shop .right-bar .sinlge-bar .button .btn:hover {
    color: #fff;
    background-color: #00d966;
    -webkit-box-shadow: 0 1rem 3rem rgba(0, 217, 102, .15)!important;
    box-shadow: 0 1rem 3rem rgba(0, 217, 102, .15)!important;
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
}

.mobile-search {
    display: none;
}


/* Header Sticky */

.header .header-inner {
    width: 100%;
    z-index: 999;
}

.header.sticky .all-category h3 {
    cursor: pointer;
}

.header.sticky .all-category .main-category {
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.header.sticky .all-category:hover .main-category {
    opacity: 1;
    visibility: visible;
}

.header.sticky .header-inner .nav li a {
    color: #333;
}

.header.sticky.v3 .header-inner .nav li a {
    color: #fff;
}

.header.sticky .header-inner .nav li:hover a {
    color: #fff;
}

.header.sticky.v2 .header-inner .nav li:hover a {
    color: #00d966;
}

.header.sticky .header-inner .nav li .dropdown li a {
    color: #333;
}

.header.sticky.v2 .header-inner .nav li .dropdown li a {
    color: #333;
}

.header.sticky .header-inner .nav li .dropdown li a:hover {
    color: #fff;
}

.header.sticky .header-inner .nav li.active a {
    color: #fff;
}

.header.sticky .header-inner {
    position: fixed;
    top: 0;
    left: 0;
    background: #fff;
    animation: fadeInDown 1s both 0.2s;
    -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
    z-index: 999;
}

.header.sticky.v3 .header-inner {
    box-shadow: none;
}

.header.sticky.v3 .navbar-expand-lg .navbar-collapse {
    animation: fadeInDown 1s both 0.2s;
    -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
}
/*======================================
	End Header CSS
========================================*/



/*======================================
    Start About Web CSS
========================================*/
.about-web {
    background-color: #00d966;
    color: white;
    margin-top: 40px;
}

.about-web-content {
	text-align: center;
	width: 94%;
	margin: auto;
}

.web-title {
	font-weight: 800;
	margin-bottom: 1.5rem;
	font-size: 38px;
	line-height: 32px;
}

.web-subtitle {
	font-size: 24px;
	line-height: 1.5;
	font-weight: 400 !important;
}

.about-web-content-bottom {
	margin-top: 60px;
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	row-gap: 78px;
	column-gap: 48px;
}

.single-web-content {
	display: flex;
	align-items: center;
	justify-content: center;
}

.single-web {
	height: 85px;
	width: 85px;
	border: 2px solid #fff;
	border-radius: 16px;
}

.single-web-img {
	display: block;
	height: 100%;
	width: 100%;
	object-fit: contain;
}

.single-web-title {
	display: flex;
	justify-content: center;
	margin-top: 20px;
}

.single-web-title p {
	margin-top: 5px;
	font-size: 14px;
	line-height: 20px;
	font-weight: 600;
	color: #fff;
}

.web-projects {
	background-color: #00d966;
	padding-bottom: 200px;
}

.project-title {
	text-align: center;
	font-size: 42px;
	line-height: 52px;
	font-weight: 700;
	margin-bottom: 50px;
	color: #fff;
}

.project-title span {
	color: #333;
}

.web-projects-content {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-direction: row-reverse;
}
.web-projects-content-left h2 {
	font-weight: 600;
	font-size: 35px;
	line-height: 52px;
	color: #fff;
}

.web-projects-content-left p {
	padding-top: 12px;
	font-size: 20px;
	line-height: 33px;

}

.projects-content-left-bottom {
	display: flex;
	flex-direction: row;
}

.projects-content-tech {
	display: flex;
	flex-direction: column;
	flex-basis: 60%;
	padding: 8px;
	padding-left: 0px;
}

.projects-content-tech span {
	margin-top: 16px;
	margin-bottom: 12px;
	font-size: 22px;
	line-height: 33px;
	color: #333;
}

.projects-techs {
	display: flex;
	width: 100%;
	flex-wrap: wrap;
	gap: 25px;
	margin-top: 24px;
}

.projects-content-preview {
	display: flex;
	column-gap: 12px;
	padding-top: 14px;
	flex-basis: 40%;
	flex-direction: column;
	padding: 8px;
}

.projects-content-preview span {
	margin-top: 16px;
	margin-bottom: 12px;
	font-size: 22px;
	line-height: 33px;
	color: #333;
}

.preview-content {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-top: 24px;
}

.single-preview {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 8px 30px !important;
	color: #fff !important;
	background-color: #333;
	border-radius: 22px;
}

.web-img {
	display: none;
	flex: 1 1 0%;
}

.img-one {
	width: 80vw;
	height: 192px;
	object-position: top;
	object-fit: cover;
}

.image-wrap {
	width: 100%;
	height: 500px;
	border-radius: 20px;
	overflow: hidden;
	position: relative;
}

.image-wrap img {
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
	-o-object-position: top center;
	object-position: top center;
	transition: all 4s ease-in-out;
}

.image-wrap:hover img {
	-o-object-position: bottom center;
	object-position: bottom center;
}

.project-button {
	text-align: center;
	margin-top: 50px;
}

.project-button .btn {
	background-color: #000;
	border: 1px solid transparent;
	border-radius: 30px;
	display: inline-block;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 500;
	color: #fff;
	padding: 15px 30px;

}

.project-button .btn:hover {
	background-color: transparent;
	border: 1px solid #fff;
}

.single-tech {
	border: 2px solid #fff;
	border-radius: 16px;
}

.single-tech-img {
	height: 60px;
	width: 60px;
}

.card {
	position: absolute;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 11;
	background: transparent;
	border: none;
}

.hiring-card {
	width: 1170px;
	background-color: #333;
	border-radius: 30px;
	display: flex;
	justify-content: space-between;
	padding: 50px 80px 50px 60px;
	align-items: center;
	margin: auto;
}

.hiringCard-content {
	display: flex;
	gap: 46px;
	align-items: center;
}


.hiringCard-leftContent h4 {
	font-size: 40px;
	font-weight: 700;
	line-height: 48px;
	color: rgba(255, 255, 255, 1);
}

.hiringCard-leftContent p {
	font-size: 18px;
	line-height: 32px;
	color: rgba(255, 255, 255, 0.5);
}

.hiring-card .hiringCard-btn {
	color: rgba(46, 19, 58, 1);
	background-color: rgba(252, 226, 139, 1);
}

.hiring-card .hiringCard-btn:hover {
	color: rgba(51, 51, 51, 1) !important;
	background-color: rgba(255, 255, 255, 1) !important;
}

.contact-content-right {
	width: 100%;
}

.contact-content-right .contact-info {
	display: flex;
	align-items: center;
	gap: 22px;
	margin-bottom: 16px;
}

.contact-content-right .contact-info ul li {
	margin-bottom: 8px;
}

.contact-content-right .contact-info ul li a {
	font-size: 18px;
	color: #fff;
}

.contact-content-right .contact-info .contact-icon {
	width: 52px;
	height: 52px;
	line-height: 52px;
	background-color: #00d966;
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.contact-content-right .contact-info .contact-icon i {
	color: #fff;
	font-size: 18px;
}
/*======================================
    End About Web CSS
========================================*/


/*======================================
	03. Start Hero Area CSS
========================================*/

.hero-area .single-slider {
    height: auto;
    position: relative;
    background-color: #F7F7F7;
    margin-top:40px;
}

.hero-area .single-slider .container {
    overflow: hidden;
    margin: 0 !important;
    padding: 0 !important;
}

.hero-area .single-slider .hero-image img {
    width: 100%;
}


/* Owl Nav*/

.hero-area .owl-carousel .owl-nav {
    margin: 0;
    position: absolute;
    top: 50%;
    width: 100%;
    margin-top: 0px;
    visibility: hidden;
    opacity: 0;
}

.hero-area:hover .owl-carousel .owl-nav {
    visibility: visible;
    opacity: 1;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    transition: all 0.6s ease;
}

.hero-area .owl-carousel .owl-nav div {
    height: 40px;
    width: 40px;
    line-height: 40px;
    text-align: center;
    background: #333;
    color: #fff;
    font-size: 18px;
    position: absolute;
    margin: 0;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
    padding: 0;
    border-radius: 0;
}

.hero-area .owl-carousel .owl-nav div:hover {
    background: #00d966;
    color: #fff;
}

.hero-area .owl-carousel .owl-controls .owl-nav .owl-prev {
    left: 0;
}

.hero-area .owl-carousel .owl-controls .owl-nav .owl-next {
    right: 0;
}


/* Owl Dots*/

.hero-area .owl-theme .owl-dots {
    position: absolute;
    text-align: center;
    left: 50%;
    transform: translateX(-50%);
    bottom: 25px;
    width: 100%;
    z-index: 99;
}

.hero-area .owl-theme .owl-dots .owl-dot {
    margin-right: 10px;
}

.hero-area .owl-theme .owl-dots .owl-dot:last-child {
    margin-right: 0;
}

.hero-area .owl-theme .owl-dots .owl-dot span {
    height: 5px;
    width: 30px;
    background-color: #333;
    border-radius: 0;
    display: inline-block;
    border: none;
    margin: 0px 5px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.hero-area .owl-theme .owl-dots .owl-dot.active span {
    background: #00d966;
}

.hero-area .owl-theme .owl-dots .owl-dot:hover span {
    background: #00d966;
}
/*======================================
	End Hero Area CSS
========================================*/



/*======================================
	04 Start Why Choose-Us Area CSS
========================================*/

.choose-us {
    background-color: #fff;
    /*margin-top: 100px;*/
}

.choose-us h2 {
    font-size: 40px;
    font-weight: 400;
    color: #333;
    letter-spacing: 0.2px;
    text-align: center;
    margin-bottom: 60px;
    text-transform: capitalize;
}

.choose-us .single-card {
    background-color: transparent;
    border: 0px;
    text-align: center;
    margin-bottom: 30px;
}

.choose-us .single-card img {
    margin: auto;
    float: none;
}

.choose-us .single-card .card-body {
    padding: 1rem 0rem 0rem 0rem;
}

.choose-us .single-card .card-body h5 {
    margin-top: 20px;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 20px;
    color: #333;
}

.choose-us .single-card .card-body p {
    font-size: 15px;
    font-weight: 300;
    color: #666;
}

.choose-us .single-card .card-body p strong {
    font-weight: 500;
}

.choose-us .single-icon {
    font-size: 45px;
    width: 75px;
    height: 75px;
    line-height: 75px;
    border-radius: 50%;
    color: #fff;
    background: #00d966;
    top: 9px;
    position: relative;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
    display: inline-block;
}

.choose-us .single-card:hover .single-icon {
    transform: scale(1.2);
}
/*======================================
	End Why Choose Us Area CSS
========================================*/



/*======================================
	05. Start Services Area CSS
========================================*/

.services {
    background: #00d9661a;
    padding-bottom: 230px;
}


/* Sinlge Service */

.single-service {
    margin-top: 0px;
    padding: 10px;
    box-shadow: 0px 0px 40px #00000012;
    border-radius: 12px;
    background: #fff;
    position: relative;
    overflow: hidden;
    margin-bottom: 30px;
}

.single-service:before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    height: 7px;
    width: 0%;
    background: #00d966;
    -webkit-transition: all 0.6s cubic-bezier(.91, .01, .28, .99);
    -moz-transition: all 0.6s cubic-bezier(.91, .01, .28, .99);
    transition: all 0.6s cubic-bezier(.91, .01, .28, .99);
}

.single-service:hover:before {
    width: 100%;
}

.single-service .service-img {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    border-radius: 10px;
    border: 1px solid #e9ecef;
}

.single-service .service-img .image-change {
    display: block;
    position: relative;
}

.single-service .service-img .image-change .caption span {
    background: #00d966;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    padding: 10px 25px;
    position: absolute;
    left: 20px;
    top: 20px;
    z-index: 9;
    text-transform: uppercase;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
    letter-spacing: 1px;
    border-radius: 5px;
}

.single-service .service-img .image-change .caption .before {
    opacity: 0;
    visibility: hidden;
}

.single-service:hover .service-img .image-change .caption .before {
    opacity: 1;
    visibility: visible;
    background: #333;
}

.single-service:hover .service-img .image-change .caption .after {
    opacity: 0;
    visibility: hidden;
}

.single-service .service-img .image-change img {
    width: 100%;
}

.single-service .service-img .image-change img.hover-img {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.5s ease, transform 2s cubic-bezier(0, 0, 0.44, 1.18), -webkit-transform 2s cubic-bezier(0, 0, 0.44, 1.18);
}

.single-service .service-content {
    padding: 30px 25px 25px;
    background: #fff;
}

.single-service:hover .service-img img.hover-img {
    opacity: 1;
}

.single-service .service-content h2 a {
    font-size: 24px;
    font-weight: 600;
    line-height: 42px;
    margin: 0;
}

.single-service .service-content h2 a:hover {
    color: #00d966;
}

.single-service .service-content h4 {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 20px;
    margin-top: 8px;
}

.single-service .service-content p {
    font-size: 15px;
    color: #666;
    line-height: 24px;
    margin-bottom: 22px;
}

.single-service .service-content .button {
    margin-top: 20px;
}

.single-service .service-content .button .btn {
    border-radius: 5px;
    color: #fff;
}

.single-service .service-content .button .btn i {
    font-size: 18px;
    margin-left: 5px;
    font-weight: 600;
}

.service-img .service-action {
    display: inline-block;
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 99;
    border-radius: 3px;
}

.service-img .service-action a {
    background-color: transparent;
    color: #333;
    display: block;
    font-size: 16px;
    display: inline-block;
    margin-right: 15px;
    text-align: right;
    height: 52px;
    position: relative;
    top: 2px;
}

.service-img .service-action a:last-child {
    margin-right: 10px;
    border: none;
}

.service-img .service-action a i {
    line-height: 40px;
}

.service-img .service-action a span {
    visibility: hidden;
    position: absolute;
    background: #00d966 !important;
    color: #fff !important;
    text-align: center;
    padding: 5px 12px;
    z-index: 3;
    opacity: 0;
    -webkit-transition: opacity .6s, margin .3s;
    -o-transition: opacity .6s, margin .3s;
    transition: opacity .6s, margin .3s;
    font-size: 11px;
    right: 0;
    line-height: 14px;
    top: -12px;
    margin-top: -5px;
    margin-right: 0;
    display: inline-block;
    width: 120px;
    border-radius: 15px 0 0 15px;
}

.service-img .service-action a:hover {
    color: #00d966;
}

.service-img .service-action a:hover span {
    visibility: visible;
    opacity: 1;
    color: #333;
    background: #fff;
    margin-top: -12px;
}

.service-img .service-action.pro-action-width-dec a {
    width: 30px;
    height: 30px;
    font-size: 14px;
}

.service-img .service-action.pro-action-width-dec a i {
    line-height: 30px;
}

.service-img .service-action.pro-action-width-dec-2 {
    bottom: 45px;
}

.service-img .service-action-2 {
    position: absolute;
    left: 0;
    bottom: 0;
    text-align: left;
    margin-left: 10px;
    z-index: 99;
    -webkit-transition: all 250ms ease-out;
    -o-transition: all 250ms ease-out;
    transition: all 250ms ease-out;
}

.service-img .service-action-2 a {
    display: block;
    background-color: transparent;
    color: #333;
    text-align: left;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    line-height: 1;
    display: inline-block;
}

.service-img .service-action-2 a:hover {
    color: #00d966;
}

.service-img .shop-list-quickview {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0;
    right: 0;
    text-align: center;
    z-index: 99;
    margin-top: 20px;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all .35s ease 0s;
    -o-transition: all .35s ease 0s;
    transition: all .35s ease 0s;
}

.service-img .shop-list-quickview a {
    color: #000;
    background-color: #fff;
    display: inline-block;
    width: 50px;
    height: 50px;
    border-radius: 100%;
    font-size: 18px;
}

.service-img .shop-list-quickview a:hover {
    background-color: #222;
    color: #fff;
}

.service-img .shop-list-quickview a i {
    line-height: 50px;
}
/*======================================
   End Services Area CSS
========================================*/



/*======================================
	06. Start Service Page CSS
========================================*/

.service-page {
    background: #fff;
}

.service-page .service-tab-list {
    padding-top: 30px;
    background: #333;
    border-top: 5px solid #00D966;
}

.nav-pills .nav-link {
    border-radius: 0px;
    color: #fff;
    text-transform: capitalize;
    font-size: 15px;
    padding: 15px 20px;
    font-weight: 500;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
    position: relative;
    border-bottom: 1px solid #000;
}

.nav-pills .nav-link:last-child {
    border-bottom: none;
}

.nav-pills .nav-link:hover {
    background: #00d966;
    color: #fff;
}

.nav-pills .nav-link i {
    color: #fff;
    font-size: 18px;
    font-weight: 500;
    height: 54px;
    width: 40px;
    line-height: 54px;
    float: right;
    background: #00d966;
    right: 0;
    text-align: center;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
    border-radius: 0px 30px 30px 0px;
    opacity: 0;
    visibility: hidden;
    z-index: -11;
}

.nav-pills .nav-link.active {
    color: #fff;
    background-color: #00d966;
}

.nav-pills .nav-link.active i {
    right: -30px;
    opacity: 1;
    visibility: visible;
    z-index: 111;
}

.nav-pills .nav-link:hover i {
    right: -30px;
    opacity: 1;
    visibility: visible;
    z-index: 111;
}

.service-page .service-page-content {
    padding: 30px;
    background: #fff;
    margin-left: 15px;
    border-top: 5px solid #00D966;
    border-right: 1px solid #eee;
    border-bottom: 1px solid #eee;
    border-left: 1px solid #eee;
}

.service-page .service-page-content h3.first-h3 {
    margin-top: 0;
}

.service-page .service-page-content h3 {
    font-size: 32px;
    line-height: 38px;
    font-weight: 700;
    color: #333;
    display: block;
    margin: 18px 0;
    text-transform: capitalize;
}

.service-page .service-page-content .h3-inner {
    font-size: 24px;
    line-height: 35px;
    font-weight: 600;
    color: #333;
    display: block;
    text-transform: capitalize;
    margin-top: 0;
    margin-bottom: 10px;
}

.service-page .service-page-content p {
    margin-bottom: 20px;
    display: block;
    font-size: 14px;
    color: #666;
    line-height: 24px;
}

.service-page .service-page-content img {
    display: block;
}

.service-page .service-page-content ul {
    display: block;
    margin-bottom: 20px;
}

.service-page .service-page-content ul li {
    font-size: 14px;
    color: #666;
    line-height: 24px;
    display: block;
    margin-bottom: 8px;
    position: relative;
    padding-left: 15px;
}

.service-page .service-page-content ul li:before {
    position: absolute;
    content: "";
    left: 0;
    top: 9px;
    height: 7px;
    width: 7px;
    background: #00D966;
    border-radius: 50%;
}

.service-page .service-page-content ul li:last-child {
    margin: 0;
}

.service-page .service-page-img {
    margin: 30px 0px;
}

.service-page .service-page-img .image-change {
    display: block;
    position: relative;
}

.service-page .service-page-img .image-change .caption {}

.service-page .service-page-img .image-change .caption span {
    background: #00d966;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    padding: 6px 16px;
    position: absolute;
    left: 15px;
    top: 15px;
    z-index: 9;
    text-transform: uppercase;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
    letter-spacing: 1px;
    border-radius: 5px;
}

.service-page .service-page-img .image-change .caption .before {
    opacity: 0;
    visibility: hidden;
    background: #333;
}

.service-page .service-page-img:hover .image-change .caption .before {
    opacity: 1;
    visibility: visible;
}

.service-page .service-page-img:hover .image-change .caption .after {
    opacity: 0;
    visibility: hidden;
}

.service-page .service-page-img .image-change img {
    width: 100%;
    border:1px solid #eee;
}

.service-page .service-page-img .image-change img.hover-img {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.5s ease, transform 2s cubic-bezier(0, 0, 0.44, 1.18), -webkit-transform 2s cubic-bezier(0, 0, 0.44, 1.18);
    height: 100%;
}

.service-page .service-page-img:hover img.hover-img {
    opacity: 1;
}

.service-tab-list.sticky {
    position: sticky;
    top: 80px;
}
/*======================================
	End Service Page CSS
========================================*/



/*======================================
   07. Start Contact CSS
========================================*/

.contact-area {}

.contact-area .contact-inner-area {
    background: #fff;
    box-shadow: 0px 10px 30px 0px rgba(0, 49, 43, 0.05);
    margin-top: -260px;
    position: relative;
    z-index: 11;
}

.contact-area .contact-inner {}

.contact-area .contact-inner h2 {
    font-size: 50px;
    font-weight: 600;
    color: #fff;
    background: #00d966;
    padding: 20px 30px;
    text-align: center;
    margin-bottom: 0;
}

.contact-area .contact-inner .contact-form {
    padding: 50px 40px;
    background: #111;
}

.contact-area .contact-inner .contact-form input,
.contact-area .contact-inner .contact-form textarea {
    width: 100%;
    margin-bottom: 20px;
    height: 70px;
    background: #333;
    color: #fff;
    padding: 20px;
    border: none;
    border-radius: 3px;
}

.contact-area .contact-inner .contact-form textarea {
    height: 140px;
    resize: none;
}

.contact-form input::-moz-placeholder {
    color: #fff;
    font-size: 14px;
    opacity: 1;
}

.contact-form input::placeholder {
    color: #fff;
    font-size: 14px;
    opacity: 1;
}

.contact-form textarea::-moz-placeholder {
    color: #fff;
    font-size: 14px;
    opacity: 1;
}

.contact-form textarea::placeholder {
    color: #fff;
    font-size: 14px;
    opacity: 1;
}

.contact-area .contact-inner .contact-form .btn {
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    height: 70px;
    background: #00d966;
    color: #fff;
    border: none;
    width: 100%;
    border-radius: 3px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.contact-area .contact-inner .contact-form .sub-btn:hover {
    background: #005046;
}

.contact-area .fun-facts .section-title {
    margin-bottom: 60px;
    text-align: left;
    padding: 0;
}

.contact-area .fun-facts .section-title .title-icon {
    margin-bottom: 20px;
}

.contact-area .fun-facts .section-title h2 {
    font-size: 48px;
    font-weight: 600;
    color: #333;
    padding: 0;
    margin: 0;
}

.contact-area .fun-facts .section-title h2:before {
    display: none;
}

.contact-area .fun-facts .section-title span {
    font-size: 14px;
    font-weight: 400;
    color: #333;
    margin-left: 5px;
    text-transform: uppercase;
    font-family: 'Rubik', sans-serif;
    background: none;
    padding: 0;
    margin-bottom: 0;
}

.contact-area .fun-facts {
    padding: 86px 40px 86px 40px;
}

.contact-area .fun-facts .contact-counter {
    position: relative;
    overflow: hidden;
    margin-right: 60px;
}

.contact-area .fun-facts .contact-counter:before {
    position: absolute;
    content: "";
    height: 1px;
    width: 100%;
    background: #dfe3e2;
    left: 0;
    top: 50%;
}

.contact-area .fun-facts .contact-counter::after {
    position: absolute;
    content: "";
    height: 100%;
    width: 1px;
    background: #dfe3e2;
    left: 50%;
    top: 0;
}

.contact-area .fun-facts .contact-counter .counter-top {
    padding: 0px 0px 15px 20px;
}

.contact-area .fun-facts .contact-counter .counter-bottom {
    padding: 15px 0px 0px 20px;
}

.contact-area .fun-facts .contact-counter .single-counter h3 {
    font-size: 60px;
    font-weight: 400;
    margin-bottom: 15px;
    color: #333;
    line-height: 1.1;
}

.contact-area .fun-facts .contact-counter .single-counter .green-color {
    color: #00d966;
}

.contact-area .fun-facts .contact-counter .single-counter p {
    font-size: 25px;
    font-weight: 400;
    color: #848b8a;
    margin-bottom: 15px;
}
/*======================================
   End Contact CSS
========================================*/



/*======================================
   08. Start Pricing CSS
========================================*/

.pricing {
    background: #00d9661a;
    padding-bottom: 120px;
}

.pricing .single-pricing {
    margin-top: 0px;
    padding: 10px;
    box-shadow: 0px 5px 10px #00000012;
    border-radius: 12px;
    background: #fff;
    position: relative;
    margin-bottom: 30px;
}

.pricing .single-pricing:hover:before {
    width: 100%;
}

.pricing .single-pricing .pricing-img {
    position: relative;
    overflow: hidden;
    cursor: pointer;
    height: 230px;
    border-radius: 10px;
}

.pricing .single-pricing .pricing-img .image-change {
    display: block;
    position: relative;
}

.pricing .single-pricing .pricing-img .image-change .caption {}

.pricing .single-pricing .pricing-img .image-change .caption span {
    background: #00d966;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    padding: 6px 16px;
    position: absolute;
    left: 15px;
    top: 15px;
    z-index: 9;
    text-transform: uppercase;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
    letter-spacing: 1px;
    border-radius: 5px;
}

.pricing .single-pricing .pricing-img .image-change .caption .before {
    opacity: 0;
    visibility: hidden;
}

.pricing .single-pricing:hover .pricing-img .image-change .caption .before {
    opacity: 1;
    visibility: visible;
    background: #333;
}

.pricing .single-pricing:hover .pricing-img .image-change .caption .after {
    opacity: 0;
    visibility: hidden;
}

.pricing .single-pricing .pricing-img .image-change img {
    width: 100%;
}

.pricing .single-pricing .pricing-img .image-change img.hover-img {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.5s ease, transform 2s cubic-bezier(0, 0, 0.44, 1.18), -webkit-transform 2s cubic-bezier(0, 0, 0.44, 1.18);
}

.pricing .single-pricing:hover .pricing-img img.hover-img {
    opacity: 1;
}

.pricing .single-pricing .pricing-content {
    padding: 80px 20px 45px 20px;
    background: #ffffff;
    position: relative;
}

.pricing .single-pricing .pricing-content .pricing-price {
    height: 150px;
    width: 150px;
    background: #fff;
    border: 8px solid #00d966;
    border-radius: 50%;
    position: absolute;
    text-align: center;
    top: -15px;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 11;
}

.pricing .single-pricing .pricing-content .pricing-price .price h4 {
    color: #848b8a;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
}

.pricing .single-pricing .pricing-content .pricing-price .price h3 {
    font-size: 36px;
    font-weight: 600;
    color: #00d966;
    font-family: inherit;
    line-height: 1;
    margin-bottom: 0px;
}

.pricing .single-pricing .pricing-content .pricing-price .price span {
    font-size: 13px;
    font-weight: 400;
    color: #848b8a;
}

.pricing .single-pricing .pricing-content h3 {
    font-size: 26px;
    font-weight: 700;
    color: #333;
}

.pricing .single-pricing .pricing-content .plan-inside {
    padding: 30px 20px;
    text-align: center;
}

.pricing .single-pricing .pricing-content .plan-inside ul {
    margin: 0;
    font-size: 100%;
    line-height: normal;
}

.pricing .single-pricing .pricing-content .plan-inside ul li {
    text-align: center;
    padding: 12px 0px;
    display: inline-block;
    position: relative;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
    font-size: 14px;
    font-weight: 500;
}

.pricing .single-pricing .pricing-content .plan-inside ul li:hover {
    transform: scale(1.2);
    color: #00d966;
}

.pricing .single-pricing .pricing-content .plan-inside ul li:before {
    position: absolute;
    content: "";
    height: 1px;
    width: 100px;
    background-image: -webkit-gradient(linear, left bottom, right bottom, color-stop(0.02, #fbf7f3), color-stop(0.5, #d7d3cf), color-stop(0.98, #fbf7f3));
    bottom: 0;
    text-align: center;
    left: 0;
    right: 0;
    margin: auto;
}

.pricing .single-pricing .pricing-content .plan-inside ul li strong {
    float: right;
    clear: both;
    margin-left: 10px;
}

.pricing .single-pricing .pricing-content .pricing-button {
    top: 100%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    position: absolute;
}

.pricing .single-pricing .pricing-content .pricing-button .btn {
    color: #fff !important;
    border-radius: 0px 50px 50px 50px;
}


/* Owl Dots*/

.pricing .owl-carousel {
    position: inherit;
}

.pricing .owl-theme .owl-dots {
    position: absolute;
    text-align: center;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    z-index: 99;
    bottom: 50px;
}

.pricing .owl-theme .owl-dots .owl-dot {
    margin-right: 10px;
}

.pricing .owl-theme .owl-dots .owl-dot:last-child {
    margin-right: 0;
}

.pricing .owl-theme .owl-dots .owl-dot span {
    height: 5px;
    width: 30px;
    background-color: #333;
    border-radius: 0;
    display: inline-block;
    border: none;
    margin: 0px 5px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.pricing .owl-theme .owl-dots .owl-dot.active span {
    background: #00d966;
}

.pricing .owl-theme .owl-dots .owl-dot:hover span {
    background: #00d966;
}

.pricing .owl-theme .owl-dots .owl-dot {}
/*======================================
   End Pricing CSS
========================================*/



/*======================================
   09. Start Pricing Page CSS
========================================*/

.pricing-page {}

.pricing-page .pricing-page-single {
    box-shadow: 0 10px 30px rgb(111 111 111 / 10%);
    border-radius: 3px;
    background: #fff;
    position: relative;
    overflow: hidden;
    margin-bottom: 30px;
}

.pricing-page .pricing-page-single:before {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    height: 5px;
    width: 0%;
    background: #00d966;
    -webkit-transition: all 0.6s cubic-bezier(.91, .01, .28, .99);
    -moz-transition: all 0.6s cubic-bezier(.91, .01, .28, .99);
    transition: all 0.6s cubic-bezier(.91, .01, .28, .99);
}

.pricing-page .pricing-page-single:hover:before {
    width: 100%;
}

.pricing-page .pricing-image {
    overflow: hidden;
}

.pricing-page .pricing-image img {
    width: 100%;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.pricing-page .pricing-page-single:hover .pricing-image img {
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}

.pricing-page .price {
    text-align: center;
    padding: 15px;
    background: #fff;
}

.pricing-page .price h2 {
    margin-bottom: 10px;
}

.pricing-page .price h2 a {
    font-size: 20px;
    font-weight: 700;
    line-height: 26px;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.pricing-page .price h2 a:hover {
    color: #00d966;
}

.pricing-page .price h4 {
    font-size: 22px;
    font-weight: 500;
    color: #848b8a;
    margin-bottom: 10px;
}

.pricing-page .price h3 {}

.pricing-page .price h3 a {
    font-size: 40px;
    font-weight: 700;
    line-height: 42px;
    color: #00d966;
}

.pricing-page .price h3 span {
    font-size: 16px;
    font-weight: 500;
    line-height: 42px;
    color: #848b8a;
    margin-left: 5px;
}
/*======================================
   End Pricing Page CSS
========================================*/



/*======================================
   10. Start Team CSS
========================================*/

.team {
    padding-bottom: 70px;
}

.team .single-team {
    position: relative;
    overflow: hidden;
    margin-bottom: 30px;
}

.team .single-team img {
    width: 100%;
    height: 100%;
}

.team .single-team:before {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: #ef4f4f;
    transform: translateY(-100%);
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
}

.team .single-team:hover:before {
    transform: translateY(95%);
}

.team .single-team.nth-child2:before {
    background: #007965;
}

.team .single-team.nth-child3:before {
    background: #6dc77a;
}

.team .single-team.nth-child4:before {
    background: #008891;
}

.team .single-team .team-content {
    text-align: center;
    padding: 40px 20px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    background: rgb(239 72 79 / 0.7);
    transform: translateY(-100%);
    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    transition: all 0.7s ease;
}

.team .single-team.nth-child2 .team-content {
    background: rgb(0 121 101 / 0.7);
}

.team .single-team.nth-child3 .team-content {
    background: rgb(109 199 122 / 0.7);
}

.team .single-team.nth-child4 .team-content {
    background: rgb(0 136 145 / 0.7);
}

.team .single-team:hover .team-content {
    transform: translateY(0%);
}

.team .single-team .team-content h4 {
    font-size: 32px;
    font-weight: 600;
    margin-bottom: 5px;
}

.team .single-team .team-content p {
    font-size: 16px;
    font-weight: 500;
}

.team .single-team .team-content .social-link {
    margin-top: 20px;
}

.team .single-team .team-content .social-link li {
    display: inline-block;
    margin: 0px 6px;
}

.team .single-team .team-content .social-link li a {
    font-size: 20px;
    font-weight: 500;
    color: #333;
    height: 35px;
    width: 35px;
    line-height: 35px;
    background: #fff;
    border-radius: 50%;
    display: block;
    text-align: center;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.team .single-team .team-content .social-link li a:hover {
    background: #00d966;
    color: #fff;
}

.team .single-team .team-content h4,
p,
.social-link {
    color: #fff;
    opacity: 0;
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.team .single-team:hover .team-content h4,
p,
.social-link {
    opacity: 1;
    transition-delay: all 0.4s ease;
}
/*======================================
   End Team CSS
========================================*/



/*======================================
   11. Start Testimonials CSS
========================================*/

.testimonials {
    background: #00d9661a;
}

.testimonials .testimonial-inner {
    position: relative;
}

.testimonials #tns1>.tns-item {
    -webkit-transform: scale(.9);
    transform: scale(.9);
}

.testimonials .single-testimonial {
    height: 100%;
    width: 100%;
    position: relative;
    padding: 40px;
    border-radius: 8px;
    border: 1px solid #eee;
    background-color: #fff;
    border-radius: 8px;
}

.testimonials .single-testimonial .review {
    margin-bottom: 20px;
}

.testimonials .single-testimonial .review li {
    display: inline-block;
    margin-right: 3px;
    font-size: 20px;
}

.testimonials .single-testimonial .review li:last-child {
    margin-right: 0
}

.testimonials .single-testimonial .review li i {
    color: #FFD700;
}

.testimonials .single-testimonial .quote i {
    font-size: 30px;
    color: #00d966;
}

.testimonials .single-testimonial p {
    font-size: 15px;
    color: #666;
}

.testimonials .single-testimonial .bottom {
    position: relative;
    margin-top: 30px;
    display: flex;
}

.testimonials .single-testimonial .bottom .clien-image {
    margin-right: 20px;
}

.testimonials .single-testimonial .bottom .clien-image img {
    height: 80px;
    width: 80px;
    border-radius: 100%;
    margin-right: 22px;
    float: left;
}

.testimonials .single-testimonial .bottom .name {
    font-size: 17px;
    position: relative;
    top: 20px;
}

.testimonials .single-testimonial .bottom .name span {
    font-size: 13px;
    display: block;
    margin-top: 5px;
    color: #888;
    font-weight: 400;
}

.testimonials .testimonial-slider {
    margin: 0;
}

.testimonials .testimonial-slider-head {
    position: relative;
}

.testimonials .owl-carousel {
    position: inherit;
}

.owl-carousel .owl-stage-outer {
    position: inherit;
}

.testimonials .owl-controls {
    position: absolute;
    left: -30px;
    top: 50%;
    transform: rotate(90deg) translateX(-50%);
}

.testimonials .owl-dots {
    background: #fff;
    display: inline-block;
    padding: 12px 24px 7px 20px;
    border-radius: 16px 16px 0 0;
    z-index: 9;
    border-radius: 12px 12px 0px 0;
    box-shadow: 0px 0px 10px #0000001c;
}

.testimonials .owl-dots .owl-dot span {
    width: 10px;
    height: 10px;
    border-radius: 0;
    margin: 0;
    background: #00d966;
    display: inline-block;
    border: none;
    margin-right: 9px;
    border-radius: 30px;
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    transition: all .4s ease;
}

.testimonials .owl-dots .owl-dot:last-child span {
    margin: 0;
}

.testimonials .owl-dots .owl-dot.active span {
    width: 20px;
    background: #00d966;
}

.testimonials .owl-dots .owl-dot:hover span {
    background: #00d966;
}
/*======================================
   End Testimonials CSS
========================================*/



/*======================================
   12. Start Free Trial CSS
========================================*/

.free-trial {
    background: #f5f5f5;
    padding:70px 0;
}

.free-trial .left-img {}

.free-trial .trial-content {}

.free-trial .trial-content h3 {
    font-size: 28px;
    font-weight: 600;
    line-height: 34px;
    text-transform: capitalize;
    margin-bottom: 10px;
    color: #000;
}

.free-trial .trial-content p {
    font-size: 17px;
    font-weight: 400;
    color: #666;
}

.free-trial .trial-button {}

.free-trial .trial-button .btn {
    color: #fff !important;
}
/*======================================
   End Free Trial CSS
========================================*/



/*======================================
   13. Start Client CSS
========================================*/

.client-logo-section {
    background: #151616;
}

.client-logo-section .client-logo-wrapper .client-logo-carousel .client-logo {
    padding: 15px;
    text-align: center;
    margin: auto;
    background: #fff;
    border-radius: 10px;
    margin: 0px 5px;
}

.client-logo-section .client-logo-wrapper .client-logo-carousel .client-logo img {
    max-width: 220px;
    width: 100%;
    -webkit-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s;
}

.client-logo-section .client-logo-wrapper .client-logo-carousel .client-logo img:hover {
    opacity: 1;
}
/*======================================
   End Client CSS
========================================*/



/*======================================
  14. Start Contact Page CSS
========================================*/

.contact-us {
    position: relative;
    z-index: 43;
}

.contact-us .title {
    margin-bottom: 30px;
}

.contact-us .title h4 {
    font-size: 17px;
    font-weight: 500;
    margin-bottom: 5px;
    color: #00d966;
}

.contact-us .title h3 {
    font-size: 25px;
    text-transform: capitalize;
    font-weight: 600;
}

.contact-us .single-head {
    padding: 50px;
    box-shadow: 0px 0px 15px #0000001a;
    height: 100%;
}

.contact-us .single-info {
    text-align: left;
    margin-bottom: 30px;
}

.contact-us .single-info i {
    color: #fff;
    font-size: 18px;
    display: inline-block;
    margin-bottom: 15px;
    height: 40px;
    width: 40px;
    display: block;
    text-align: center;
    border-radius: 3px;
    line-height: 40px;
    background: #00d966;
}

.contact-us .single-info ul .contact-us .single-info ul li {
    margin-bottom: 5px;
}

.contact-us .single-info ul li:last-child {
    margin-bottom: 0;
}

.contact-us .single-info ul li a {
    font-weight: 400;
}

.contact-us .single-info ul li a:hover {
    color: #00d966;
}

.contact-us .single-info .title {
    margin-bottom: 10px;
    font-weight: 500;
    color: #333;
    font-size: 18px;
}

.contact-us .form-main {
    box-shadow: 0px 0px 15px #0000001a;
    padding: 50px;
}

.contact-us .form .form-group input {
    height: 48px;
    line-height: 48px;
    width: 100%;
    border: 1px solid #e6e2f5;
    padding: 0px 20px;
    color: #333;
    border-radius: 0px;
    font-weight: 400;
}

.contact-us .form .form-group textarea {
    height: 180px;
    width: 100%;
    border: 1px solid #e6e2f5;
    padding: 15px 20px;
    color: #333;
    border-radius: 0px;
    resize: none;
    font-weight: 400;
}

.contact-us .form .form-group label {
    color: #333;
    position: relative;
}

.contact-us .form .form-group label span {
    color: #ff2c18;
    display: inline-block;
    position: absolute;
    right: -12px;
    top: 4px;
    font-size: 16px;
}

.contact-us .form .button {
    margin: 0;
}

.contact-us .form .button .btn {
    height: 50px;
    border: none;
}


/* Mail Success */

.mail-success .mail-inner {
    text-align: center;
    background: #fff;
    padding: 0px 30px;
}

.mail-success .mail-inner h2 {
    margin-bottom: 10px;
    display: block;
    font-weight: 600;
    color: #00d966;
    text-transform: uppercase;
    font-size: 30px;
}

.mail-success .mail-inner p {
    font-size: 14;
    color: #333;
    margin-bottom: 30px;
    line-height: 22px;
}

.mail-success .mail-inner .btn {
    color: #fff;
    padding: 10px 30px;
}

.mail-success .mail-inner .btn i {
    margin-right: 5px;
}
/*======================================
  End Contact Page CSS
========================================*/



/*======================================
	15. Start Portfolio Page CSS
========================================*/

.portfolio {
    background: #00d9661a;
}

.portfolio-menu {
    text-align: center;
    margin-bottom: 20px;
}

.portfolio .portfolio-menu ul {}

.portfolio .portfolio-menu ul li {
    display: inline-block;
    cursor: pointer;
    padding: 8px 20px;
    font-size: 13px;
    font-weight: 500;
    color: #051441;
    margin-right: 10px;
    margin-bottom: 10px;
    -webkit-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s;
    background: 0 0;
    border: 1px solid #eee;
    border-radius: 30px;
}

.portfolio .portfolio-menu ul li:hover {
    background: #00d966!important;
    color: #fff;
    border-color: transparent;
}

.portfolio .portfolio-menu ul li.active:before {
    width: 50%;
}

.portfolio .portfolio-menu ul li.active {
    background: #00d966!important;
    color: #fff;
    border-color: transparent;
}

.portfolio .portfolio-menu ul li:last-child {
    margin-right: 0px;
}

.portfolio .single-portfolio {
    position: relative;
    overflow: hidden;
    margin-top: 40px;
}

.portfolio .single-portfolio img {
    height: 100%;
    width: 100%;
    position: relative;
}

.portfolio .single-portfolio p {
    font-size: 18px;
    font-weight: 500;
    color: #fff;
    background: #333;
    padding: 12px 18px;
    text-align: center;
    position: absolute;
    bottom: 20px;
    transform: translateX(-100%);
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    transition: all 0.4s ease;
    opacity: 0;
    visibility: hidden;
    z-index: 99;
}

.portfolio .single-portfolio:hover p {
    transform: translateX(0);
    opacity: 1;
    visibility: visible;
}

.portfolio .single-portfolio .portfolio-img {
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.portfolio .single-portfolio .portfolio-img .image-change {
    display: block;
    position: relative;
}

.portfolio .single-portfolio .portfolio-img .image-change img {
    width: 100%;
}

.portfolio .single-portfolio .portfolio-img .image-change img.hover-img {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.5s ease, transform 2s cubic-bezier(0, 0, 0.44, 1.18), -webkit-transform 2s cubic-bezier(0, 0, 0.44, 1.18);
}

.portfolio .single-portfolio:hover .portfolio-img img.hover-img {
    opacity: 1;
}
/*======================================
	End Portfolio Page CSS
========================================*/



/*======================================
	16. Start About-US Page CSS
========================================*/

.about-us {
    background-color: #00d9661a;
    padding-bottom: 230px;
}

.about-us .section-title h2:before {
    left: 0;
    margin-left: 0;
}

.about-us .about-left .section-title {
    padding: 0;
    margin-bottom: 40px;
    text-align: left;
}

.about-us .about-left .about-tab .nav {
    margin-bottom: 20px;
    background: transform;
    position: relative;
    border: none;
}

.about-us .about-left .about-tab .nav li {
    text-align: center;
    margin-right: 10px;
    margin-bottom: 20px;
}

.about-us .about-left .about-tab .nav li a {
    color: #081828;
    border: none;
    padding: 0;
    padding: 10px 25px;
    border-radius: 4px;
    font-size: 13px;
    background-color: #fff;
    -webkit-box-shadow: 0 0 20px 0 rgba(52, 49, 75, .1);
    box-shadow: 0 0 20px 0 rgba(52, 49, 75, .1);
}

.about-us .about-left .about-tab .nav li a.active {
    background: #00d966;
    color: #fff;
}

.about-us .about-left .tab-content .content-heading {
    font-size: 16px;
    color: #081828;
    display: block;
    margin-bottom: 25px;
}

.about-us .about-left .tab-content p {
    margin-bottom: 20px;
    color: #666;
}

.about-us .about-left .tab-content p:last-child {
    margin: 0;
}

.about-us .about-left .tab-content ul {
    margin-top: 20px;
}

.about-us .about-left .tab-content ul li {
    display: block;
    margin-bottom: 10px;
}

.about-us .about-left .tab-content ul li i {
    display: inline-block;
    margin-right: 5px;
    color: #00d966;
}

.about-us .about-left .tab-content ul li:last-child {
    margin: 0;
}

.about-us .about-right img {
    width: 100%;
}

.team.about {
    background: #00d9661a;
}

.testimonials.about {
    background: #fff;
}
/*======================================
	End About-US Page CSS
========================================*/



/*=============================
	17. Start 404 Error Page  CSS
===============================*/

.error-page {
    background: #fff;
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
}

.error-page .error-inner {
    text-align: center;
    flex-direction: initial;
    height: auto;
    text-align: center;
}

.error-page .error-inner h2 {
    color: #00d966;
    margin-bottom: 0;
    font-weight: 700;
    font-size: 100px;
    display: inline-block;
    font-size: 120px;
}

.error-page .error-inner h5 {
    display: block;
    color: #444;
    font-size: 20px;
    margin-bottom: 20px;
    font-weight: 600;
    text-transform: capitalize;
}

.error-page .error-inner p {
    color: #666;
    font-weight: 400;
    line-height: 22px;
    font-size: 15px;
    padding: 0 30px;
}

.error-page .button {
    margin-top: 30px;
}

.error-page .button .btn {
    margin-right: 15px;
    border-radius: 30px;
    background: #333;
    color: #fff;
    font-weight: 600;
    font-size: 14px;
    font-weight: 500;
    border: 1px solid #d7d7d7;
    background: transparent;
    color: #333;
    padding: 10px 28px;
}

.error-page .button .btn:hover {
    color: #fff;
    background: #00d966;
    border-color: transparent;
}
/*=============================
	End 404 Error Page  CSS
===============================*/



/*=============================
	18. Start Free Trial Page CSS
===============================*/
#free_trial_form h3 {
    font-size: 42px;
    font-weight: 700;
    color: #333;
    text-align: center;
    margin-bottom: 20px;
}
#free_trial_form p {
    font-size: 16px;
    font-weight: 400;
    color: #666;
    text-align: center;
    margin-bottom: 40px;
    padding: 0px 100px;
}
#free_trial_form h6 {
    font-size: 22px;
    font-weight: 600;
    color: #333;
    text-align: center;
    margin-bottom: 30px;
}
/*=============================
	End Free Trial Page CSS
===============================*/



/*======================================
	19. Start Footer CSS
========================================*/

.footer {
    background: #151616;
}
.footer-top.section {
    padding-top: 0px;
}
.footer .about {
    padding-right: 50px;
}

.footer .single-footer h4 {
    font-size: 22px;
    font-weight: 500;
    color: #fff;
    text-transform: capitalize;
    margin-bottom: 25px;
}

.footer .about .logo {
    margin-bottom: 20px;
}

.footer .about .logo img {}

.footer .about .text {
    color: #b3b3b3;
    font-weight: 400;
    font-size: 15px;
}

.footer .about .call {
    color: #fff;
    margin-top: 15px;
    font-weight: 400;
}

.footer .about .call span {
    display: block;
}

.footer .about .call a {
    color: #00d966;
    font-size: 20px;
    font-weight: 600;
}

.footer .links ul {}

.footer .links ul li {
    display: block;
    margin-bottom: 8px;
}

.footer .links ul li:last-child {
    margin-bottom: 0;
}

.footer .links ul li a {
    color: #bababa;
}

.footer .links ul li a:hover {
    color: #fff;
    padding-left: 8px;
}

.footer .contact {}

.footer .contact ul {}

.footer .contact ul li {
    display: block;
    margin-right: 0px;
}

.footer .contact ul li .footer__contact-address {
    margin-bottom: 20px;
}

.footer .contact ul li .footer__contact-address p {}

.footer .contact ul li .footer__contact-item {
    margin-bottom: 15px;
}

.footer .contact ul li .footer__contact-item h6 {
    color: #00d966;
}

.footer .contact ul li .footer__contact-item p {
    color: #bababa;
}

.footer .contact ul li:last-child {
    margin-bottom: 0;
}

.footer .single-footer.social .social h4 {
    margin-bottom: 0px;
    padding-top: 10px;
}

.footer .social ul {
    margin-top: 20px;
}

.footer .social ul li {
    display: inline-block;
    margin-right: 8px;
}

.footer .social ul li:last-child {
    margin-right: 0;
}

.footer .social ul li a {
    color: #fff;
    display: block;
    font-size: 16px;
    width: 42px;
    height: 42px;
    line-height: 42px;
    text-align: center;
    background-color: #313232;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}

.footer .social ul li a:hover {
    color: #fff;
    background: #00d966;
}


/* Copyright */

.footer .copyright {}

.footer .copyright .inner {
    border-top: 1px solid #eeeeee3d;
    padding: 20px 0;
}

.footer .copyright .left {}

.footer .copyright .right {
    float: right;
}

.footer .copyright p {
    color: #fff;
}

.footer .copyright p a {
    color: #00d966;
}
/*========================================
	End Footer CSS
========================================*/


/*===== menu ====*/

.menu-area {
    margin:0 12px;
}

.hide {
    display: none;
}

form .successcheck,
form .successtext {
    color: #23C58F;
}

form .successcheck,
form .wrrongcheck {
    position: absolute;
    right: 15px;
    top: 10px;
    z-index: 1;
    font-size: 18px;
}

form .successcheck2 {
    color: #23C58F;
}

form .successcheck2,
form .wrrongcheck2 {
    position: absolute;
    right: 24px;
    top: 42px;
    z-index: 1;
    font-size: 18px;
}

form .wrrongcheck,
form .wrrongtext {
    color: #F36E6E;
}


/*mendotory color span tag*/

form span {
    color: red;
}

.contact_wrrongsms {
    padding: 10px;
    position: fixed;
    right: 20px;
    top: 55px;
    z-index: 99;
}

.contact_wrrongsms p {
    padding: 10px;
    border-radius: 10px;
    text-align: center;
}

.reg_wrrongsms {
    padding: 10px;
}

.reg_wrrongsms p {
    padding: 10px;
    border-radius: 10px;
    text-align: center;
}

.form-floating>label {
    top: -5px;
}


/*=====verify========*/

.felxdiv {
    width: 50%;
    margin: 50px auto;
}