/*===============================================
Template Name: finweb - Consulting & Finance HTML5 Template
Author:  https://themeforest.net/user/dreamit-solution
Description: Description
Version: 1.0.0
Text Domain: finweb
Tags: consulting, finance, corporate, business, consultant, multipurpose, technology, it-solution, software, agency, company, portfolio, bangking, insurance, digital-agency, digital-marketing.
================================================*/

/*TABLE OF CONTENTS*/
/*=====================
01. finweb Header Top Menu Area Css
02. finweb Nav Menu Area Css 
03. finweb Slider Area Css
04. finweb Section Title Css
05. finweb Service Area css
06. finweb About Area Css
07. finweb Counter Area Css
08. finweb Case Study Area Css
09. finweb Testimonial Area Css
10. finweb Process Area Css
11. finweb Team Area Css
12. finweb Faq Area Css
13. finweb Brand Section Css
14. finweb Call Do Section Css
15. finweb Form Box Css
16. finweb Skill Area Css
17. finweb Blog Area Css
18. finweb footer Area Css
19. finweb Subscribe Area Css
20. finweb Lines CSS
21. finweb Prossess Ber Css
22. finweb Scrollup Section
23. finweb Bounce Animation Css 
24. finweb Animation Dance
25. finweb Breadcumb Area Css
26. finweb abouts_areas Css
27. finweb Feture-Area Css
28. finweb Pricing Section Css
29. finweb Web Development Section CSS
30. finweb Contact  US Css
31. finweb Blog Sidber Widget CSS
32. finweb Case Study Details Css
33. finweb Search Box Css
34. finweb Loader Css
=======================*/




/*================================
<--  Fin-Web  Header Area Css -->
==================================*/

.header-area {
	padding: 16px 0 18px;
}
.header-bottom-logo {
	margin-top: 1px;
}
.finweb-menu ul li {
	list-style: none;
}
.finweb-menu ul li a {
	font-size: 17px;
	font-weight: 500;
	margin-right: 38px;
	line-height: 45px;
	-webkit-transition: .4s;
	transition: .4s;
	position: relative;
	padding: 0px 0 4px 0;
}
.finweb-menu ul li a:hover {
    color: #04316d;
}
.finweb-menu ul li a.home-active {
    color: #04316d;
}
.finweb-menu ul li a::before {
	content: "";
	position: absolute;
	width: 0%;
	height: 2px;
	display: inline-block;
	background: #04306d;
	left: 0;
	bottom: 0;
    -webkit-transition: .4s;
	transition: .4s;
}
.finweb-menu ul li a.home-active::before {
	width: 100%;
    color: #04316d;
}
.finweb-menu ul li a:hover::before {
    width: 100%;
}

/* Fin-Web Dropdown */

.finweb-menu ul li {
    position: relative;
}
.finweb-menu ul li ul.sub-menu {
	position: absolute;
	top: 200%;
	left: 0;
	width: 218px;
	background: #fff;
	border-top: 5px solid #04306d;
	box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
	text-align: left;
	border-radius: 3px 3px 3px 3px;
	-webkit-transition: .4s;
	transition: .4s;
	visibility: hidden;
	opacity: 0;
	z-index: 999;
}
.finweb-menu ul li ul.sub-menu li {
	display: block;
}
.finweb-menu ul li ul.sub-menu li a {
	line-height: 44px;
	padding: 0px 0px 0px 22px;
	margin: 0px 0 0 0;
	display: block;
}
.finweb-menu ul li ul.sub-menu li a:before {
  display: none;
}
.finweb-menu ul li ul.sub-menu li a:hover {
	background: #eee;
	color: #000;
	display: block;
}
.finweb-menu ul li:hover ul.sub-menu {
	opacity: 1;
	visibility: visible;
	top: 140%;
}

/*--  Fin-Web search btn Css --*/

.header-search-button {
	margin: 13px 38px 0px 2px;
}
.header-search-button a {
	color: #1a1a1a;
	font-size: 20px;
}

/*--  Fin-Web shop btn Css --*/

.header-shop-button {
	width: 85px;
}
.header-shop-button a {
	width: 50px;
	height: 50px;
	display: inline-block;
	background: #ecedef;
	text-align: center;
	line-height: 50px;
	border-radius: 50%;
	position: relative;
}
.header-shop-button a::before {
	content: "0";
	position: absolute;
	width: 18px;
	height: 18px;
	top: 0;
	right: 0px;
	background: #02264a;
	line-height: 18px;
	color: #fff;
	border-radius: 50%;
	font-size: 12px;
	font-weight: 500;
}
.header-shop-button a i {
	font-size: 17px;
}

/*--  Fin-Web themes btn Css --*/

.finweb-btn {
	margin-top: 3px;
}
.finweb-btn a {
	background: #04306d;
	color: #fff;
	padding: 15px 32px;
	font-size: 17px;
	font-weight: 500;
	border-radius: 3px;
	line-height: 40px;
	border: 2px solid transparent;
	-webkit-transition: .4s;
	transition: .4s;
}
.finweb-btn a:hover {
	background: transparent;
	border: 2px solid #04306d;
	color: #04306d;
}


/*================================
<--  Fin-Web  Hero Area Css -->
==================================*/

.hero-area {
	position: relative;
}
.hero-active {
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
    height: 827px;
	display: flex;
	align-items: center;
}
.hero-content h6 {
	color: #fff;
	font-size: 16px;
	font-weight: 500;
	margin-bottom: 26px;
}
.hero-content h1 {
	color: #fff;
	font-size: 65px;
	line-height: 66px;
	font-weight: 800;
}
.hero-content h1 span {
	position: relative;
	display: inline-block;
	z-index: 1;
}
.hero-content h1 span::before {
	content: "";
	position: absolute;
	width: 103%;
	height: 8px;
	left: -3px;
	bottom: 2px;
	background: #1b7ce5;
	display: inline-block;
	z-index: -1;
}
.hero-content p {
	color: #fff;
	opacity: 0.902;
	font-size: 20px;
	font-weight: 700;
	padding: 21px 0 45px;
}
.hero-btn a {
	background: #fff;
	color: #04316d;
	padding: 16px 32px;
	border-radius: 3px;
	font-size: 17px;
	font-weight: 500;
	border: 2px solid transparent;
}
.hero-btn a:hover {
	background: transparent;
	border: 2px solid #fff;
    color: #fff;
}
.hero-btn a span {
	margin-left: 10px;
	font-size: 16px;
}


/*--  Animation content Css --*/

#customers-hero .owl-item.active .hero-content h6 {
    animation: fadeInDownBig ease 2s;
}
#customers-hero .owl-item.active .hero-content h1.hero-heading-one {
    animation: fadeInLeftBig ease 2s;
}
#customers-hero .owl-item.active .hero-content h1.hero-heading-two {
    animation: fadeInRightBig ease 2s;
}
#customers-hero .owl-item.active .hero-content p {
    animation: rotateIn ease 2s;
}
#customers-hero .owl-item.active .hero-btn {
    animation: fadeInUpBig ease 2s;
}

/*--  Owl Carousel Nav Css --*/

#customers-hero .owl-nav .owl-prev, #customers-hero .owl-nav .owl-next {
	width: 65px;
	height: 65px;
	line-height: 65px;
	background: transparent;
	color: #fff;
	font-size: 30px;
	text-align: center;
	position: absolute;
	left: 110px;
	top: 50%;
	transform: translateY(-50%);
	-webkit-transition: .4s;
	transition: .4s;
	border-radius: 50%;
	border: 2px solid #fff;
}
#customers-hero .owl-nav .owl-next {
	left: auto;
	right: 110px;
}








/*================================
<--  Fin-Web Feature Area Css -->
==================================*/


.feature-area {
	background: #04306d;
	padding: 56px 0 168px;
}
.feature-tl-content h2 {
	font-size: 30px;
	line-height: 30px;
	color: #ffffff;
	font-weight: 700;
}
.feature-btn {
	margin-top: 35px;
}


/*================================
<--  Fin-Web Fliping Area Css -->
==================================*/

.fliping-area {
	position: relative;
	top: -100px;
	z-index: 1;
	margin-bottom: -70px;
}
#customers-fliping.owl-carousel .owl-item img {
	display: inherit;
}
.fliping-card {
	position: relative;
	width: 100%;
	height: auto;
	perspective: 1000px;
	transform-style: preserve-3d;
	margin-bottom: 30px;
}
.fliping-layer {
    position: absolute;
    top: 0;
    left: 0;
}

/*--  fliping font  Css --*/

.front-card {
    width: 100%;
    height: 100%;
    border-radius: 5px;
    background: #fff;
    position: relative;
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
    backface-visibility: hidden;
    transform: rotateX(0deg);
    transition: .6s linear;
    transform-style: preserve-3d;
}
.front-card-box {
	transform-style: preserve-3d;
	-webkit-transform: translateY(0%) translateZ(30px) scale(0.94);
	transform: translateY(0%) translateZ(60px) scale(0.94);
	backface-visibility: hidden;
}
.front-content {
	padding: 36px 16px 34px;
	transform: translateZ(50px);
    transform-style: preserve-3d;
	backface-visibility: hidden;
	
}
.front-card-icon-img {
	margin-bottom: 20px;
}
.front-card-heading h4 {
	font-size: 22px;
	line-height: 32px;
	color: #1a1a1a;
	font-weight: 600;
}

/*--  fliping back  Css --*/

.back-card {
	width: 100%;
	height: 100%;
	background: #2b84e7;
	border-radius: 5px;
	backface-visibility: hidden;
	transform: rotateX(180deg);
	transition: .6s linear;
	transform-style: preserve-3d;
}
.back-card-box {
    transform-style: preserve-3d;
    -webkit-transform: translateY(0%) translateZ(50px) scale(0.94);
	transform: translateY(0%) translateZ(50px) scale(0.94);
	backface-visibility: hidden;
}
.back-content {
	padding: 18px 40px 16px;
}
.back-content h4 {
    font-size: 22px;
	line-height: 32px;
	color: #fff;
	font-weight: 600;
}
.back-content p {
	color: #fff;
	padding-top: 18px;
	opacity: 0.902;
}
.fliping-card:hover > .front-card {
    transform: rotateX(-180deg);
    transition: .6s linear;
}
.fliping-card:hover > .back-card {
    transform: rotateX(0deg);
    transition: .6s linear;
}



/*================================
<--  Fin-Web About Area Css -->
==================================*/


.about-area {
	padding: 180px 0 116px;
	margin-top: -250px;
}
.about-heading {
	position: relative;
	padding-bottom: 14px;
	margin-bottom: 35px;
}
.about-heading::before {
	content: "";
	position: absolute;
	width: 64%;
	height: 1px;
	background: #dfdfdf;
	left: 0;
	bottom: 0;
}
.about-content .about-heading h2 {
	font-size: 30px;
	font-weight: 800;
	margin-bottom: 18px;
}
.about-content .about-heading p {
	font-size: 17px;
	line-height: 28px;
	width: 68%;
}
.about-inner-item {
	margin-bottom: 16px;
}
.about-icon-img {
	float: left;
	margin-right: 26px;
}
.about-inner-content {
	overflow: hidden;
}
.about-inner-content h4 {
	font-weight: 700;
	margin-bottom: 14px;
	margin-top: -6px;
}
.about-inner-content p {
	width: 75%;
}
.about-btn {
	margin-top: 50px;
}
.about-btn a {
	background: #04306d;
	color: #fff;
}
.about-btn a:hover {
	border: 2px solid #04306d;
	color: #04306d;
}
.about-right-item {
	position: relative;
}
.about-right-thum {
	position: relative;
    z-index: 2;
}
.about-thume-shape {
	position: absolute;
	bottom: -69px;
	left: 46px;
	z-index: -1;
    animation: loader 18s linear infinite;
}
@keyframes loader {
	form{
		transform:rotate(0deg);
	}
	to{
		transform:rotate(360deg);
	}
}
.about-thume-shape2 {
	position: absolute;
	bottom: -69px;
	left: 46px;
	z-index: -1;
    animation: loader 18s linear infinite;
}
@keyframes loader {
	form{
		transform:rotate(0deg);
	}
	to{
		transform:rotate(360deg);
	}
}



/*================================
<--  Fin-Web Counter Area Css -->
==================================*/

.counter-area {
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	padding: 85px 0 80px;
}
.count {
	margin-bottom: 30px;
}
.count-number-item h2.counter {
	color: #fff;
	font-size: 48px;
	font-weight: 800;
}
.count-number-item h3 {
	color: #fff;
	font-size: 48px;
	font-weight: 800;
	margin-left: 5px;
}
.count-text p {
	font-size: 22px;
    color: #ffffff;
    font-weight: 700;
	margin-top: 4px;
}


/*================================
<--  Fin-Web Project Area Css -->
==================================*/


.project-area {
	overflow: hidden;
	padding: 42px 0 20px;
}
.section-title {
	margin-bottom: 10px;
}
.section-title .section-main-title {
	margin-top: 0;
	font-size: 30px;
	font-weight: 800;
	margin-bottom: 14px;
}
.section-title .section-paragraph {
	font-size: 17px;
}
ul.project-menu {
	display: flex;
	justify-content: center;
	margin-bottom: 50px;
}
ul.project-menu li {
	cursor: pointer;
	margin-right: 0px;
	border-radius: 3px;
	transition: .3s;
	list-style: none;
	font-size: 18px;
	font-weight: 500;
	color: #04316d;
	padding: 3px 14px;
}
.project-menu .active {
	color: #fff;
	background: #04306d;
	padding: 3px 14px;
}
.polytia-project-item {
	overflow: hidden;
}
.single-project-inner {
	position: relative;
}
.single-project-inner::before {
	position: absolute;
	content: "";
	left: 0;
	bottom: -181px;
	width: 100%;
	height: 100%;
	background-image: linear-gradient(0deg, rgb(19, 102, 226, 0.902) 0%, rgb(19, 102, 226, 0.902) 24%, rgba(3, 3, 33, 0) 62%, rgba(3, 3, 33, 0) 100%);
	border-radius: 3px;
    -webkit-transition: .9s;
	transition: .9s;
	visibility: hidden;
	opacity: 0;

}
.single-project-inner {
	position: relative;
}
.project-inner-img::before {
	content: "";
	position: absolute;
	width: 0;
	height: 100%;
	top: 0;
	left: 50%;
	background: rgba(3, 37, 82, .70);
	-webkit-transition: .3s;
	-moz-transition: .3s;
	transition: .3s;
	transition: all 400ms linear;
	border-radius: 4px;
}
.project-inner-img img {
	width: 100%;
	border-radius: 5px;
}
.project-top-heading {
	position: absolute;
	top: 0px;
	left: 34px;
	background: #1366e2;
	text-align: center;
	padding: 6px 9px 5px;
	border-radius: 0 0 5px 5px;
}
.project-top-heading h4 {
	color: #fff;
	font-size: 18px;
	line-height: 24px;
	font-weight: 500;
	margin-bottom: 0;
	margin-top: 0;
}
.project-content {
	position: absolute;
	bottom: 26px;
	padding: 0px 30px 0px;
	left: 0;
	-webkit-transition: .9s;
	transition: .9s;
}
.project-content h4 {
	color: #fff;
	font-size: 30px;
	margin-bottom: 18px;
	font-weight: 800;
}
.project-content p {
	opacity: 0.902;
	font-size: 16px;
	line-height: 28px;
	color: #ffffff;
}
.single-project-inner:hover .project-inner-img::before {
	width: 100%;
	left: 0;
}


/*================================
<--  Fin-Web Service Area Css -->
==================================*/


.service-area {
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	padding: 40px 0 20px;
}
.service-top-content {
	margin-bottom: 55px;
}
.service-top-content h2 {
	color: #fff;
	font-size: 30px;
	font-weight: 800;
	margin: 0 0 14px;
}
.service-top-content p {
	opacity: 0.902;
	font-size: 17px;
	color: #ffffff;
}
.service-top-btn {
	margin-top: 30px;
}

/*--  Fin-Web fliping-card Css --*/

.service-fliping-card {
	position: relative;
	perspective: 1000px;
	transform-style: preserve-3d;
	margin-bottom: 30px;
}
.service-fliping-layer {
    position: absolute;
    top: 0;
    left: 0;
	transition: .6s linear;
	transform-style: preserve-3d;
}


/*--  Fin-Web Service Front  Css --*/


.service-front-card {
	width: 100%;
	height: 100%;
	border-radius: 5px;
	position: relative;
	box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
	backface-visibility: hidden;
	transform: rotateY(0deg);
	transition: .5s linear;
	transform-style: preserve-3d;
	background: #1a7be4;
}

.service-front-card-box {
	transform-style: preserve-3d;
	-webkit-transform: translateY(0%) translateZ(150px) scale(0.94);
	transform: translateY(0%) translateZ(150px) scale(0.94);
	backface-visibility: hidden;
}
.service-front-content {
	padding: 45px 44px 38px 44px;
	text-align: center;
}
.service-img-icon {
	width: 94px;
	height: 86px;
	margin: auto;
	background: #fff;
	line-height: 86px;
	border-radius: 5px;
	margin-bottom: 20px;
	text-align: center;
}
.service-front-card-heading h4 {
	color: #fff;
	font-weight: 700;
	font-size: 22px;
	margin-bottom: 12px;
}
.service-front-card-heading p {
	color: #fff;
	font-size: 15px;
}



/*--  Fin-Web Service Back  Css --*/

.service-back-card {
	width: 100%;
	height: 100%;
	border: 1px solid #ddd;
	border-radius: 5px;
	backface-visibility: hidden;
	transform: rotateY(-180deg);
	transition: .5s linear;
	transform-style: preserve-3d;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
}
.service-back-card-box {
    backface-visibility: hidden;
    transform-style: preserve-3d;
    -webkit-transform: translateY(0%) translateZ(100px) scale(0.94);
	transform: translateY(0%) translateZ(100px) scale(0.94);
}
.service-back-content {
	text-align: center;
	padding: 40px 30px 70px 35px;
	margin-top: 10px;
}
.service-back-content h4 {
	margin-top: 14px;
	margin-bottom: 16px;
	font-size: 22px;
	color: #fff;
	font-weight: 700;
}
.service-back-content p {
	font-size: 16px;
	line-height: 26px;
	color: #ffffff;
	font-weight: 400;
	margin-bottom: 40px;
}
.service-back-content a {
	color: #04316d;
	font-weight: 600;
	font-size: 17px;
	background: #fff;
	padding: 14px 26px;
	border-radius: 5px;
}
.service-back-content a span {
	font-size: 14px;
	margin-left: 10px;
}

.service-fliping-card:hover > .service-front-card {
    transform: rotateY(180deg);
    transition: .5s linear;
}
.service-fliping-card:hover > .service-back-card {
    transform: rotateY(0deg);
    transition: .5s linear;
}


/*================================
<--  Fin-Web Team Area Css -->
==================================*/


.team-area {
	padding: 42px 0 20px;
}
.team-section-title {
	margin-bottom: 40px;
}
.team-item-box {
	background: #fff;
	box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
	border-radius: 5px;
	position: relative;
	overflow: hidden;
	margin-bottom: 30px;
}
.team-img-thum {
	position: relative;
}
.team-img-thum::before {
	content: "";
	position: absolute;
	width: 0;
	height: 100%;
	top: 0;
	left: 50%;
	background: rgba(3, 37, 82, .70);
	-webkit-transition: .3s;
	-moz-transition: .3s;
	transition: .3s;
	transition: all 400ms linear;
	border-radius: 4px;
}

.team-img-thum img {
	width: 100%;
}
.team-content {
	padding: 10px 0 6px;
}
.team-content h4 {
	font-size: 22px;
	color: #021835;
	font-weight: 700;
	margin-bottom: 10px;
}
.team-content p {
	font-size: 16px;
	color: #848484;
}
.team-social-icon {
	position: absolute;
	left: -13%;
	bottom: 30%;
    -webkit-transition: .4s;
    transition: .4s;
}
.team-social-icon ul li {
	list-style: none;
}
.team-social-icon ul li a {
	width: 40px;
	height: 40px;
	display: inline-block;
	line-height: 40px;
	text-align: center;
	background: #fff;
	border-radius: 50%;
	margin-bottom: 8px;
	position: relative;
	z-index: 1;
    -webkit-transition: .4s;
    transition: .4s;
}
.team-social-icon ul li a::before {
	content: "";
	position: absolute;
	width: 36px;
	height: 36px;
	background: #04306d;
	left: 2px;
	top: 2px;
	border-radius: 50%;
	z-index: -1;
	visibility: hidden;
	opacity: 0;
    -webkit-transition: .4s;
    transition: .4s;
}
.team-social-icon ul li a:hover::before {
    visibility: visible;
    opacity: 1;
}
.team-social-icon ul li a:hover {
    color: #fff;
}
.team-item-box:hover .team-social-icon {
	transform: translateX(166%);
}
.team-item-box:hover .team-img-thum::before {
	width: 100%;
	left: 0;
}

/*================================
<--  Fin-Web Testimonial Area Css -->
==================================*/


.testimonial-area {
	background: #fafafa;
	padding: 42px 0 112px;
}
.testimonial-top-content h2 {
	color: #04316d;
}
.testimonial-top-content p {
	color: #848484;
}
.testimonial-item {
	background: #fff;
	padding: 40px 24px 20px;
	border-radius: 5px;
}
.testi-icon {
	margin-bottom: 15px;
}
.testi-paragraph {
	margin-bottom: 32px;
}
.testi-paragraph {
	margin-bottom: 32px;
}
.testi-paragraph p {
	font-size: 15px;
	line-height: 28px;
	font-weight: 300;
}
.testi-member-content h4 {
	font-size: 18px;
	color: #1a1a1a;
	font-weight: 700;
	margin-bottom: 4px;
}
.testi-member-content p {
	font-size: 15px;
	color: #04316d;
	font-weight: 400;
}
#customers-testimonial.owl-carousel .owl-dots {
	text-align: center;
	position: absolute;
	left: 0;
	right: 0;
	bottom: -70px;
}
#customers-testimonial.owl-carousel .owl-dots .owl-dot {
	background: #1a7be4;
	display: inline-block;
	height: 10px;
	width: 10px;
	border-radius: 10px;
	margin: 0 3px;
}
#customers-testimonial.owl-carousel .owl-dot.active {
	background: #ddd;
}


/*================================
<--  Fin-Web Brand Area Css -->
==================================*/


.brand-area {
	background: #04306d;
	padding: 42px 0 20px;
}
.brand-section-title .section-main-title {
	color: #ffff;
}
.brand-section-title .section-paragraph {
	opacity: 0.851;
	color: #ffffff;
}
.brand-single-box {
	width: 18%;
	display: inline-block;
	text-align: center;
	border: 1px solid #fff;
	margin-right: 2%;
	padding: 55px 0 55px;
	border-radius: 5px;
	margin-bottom: 30px;
}



/*================================
<--  Fin-Web Pricing Area Css -->
==================================*/


.pricing-area {
	background: #fafafa;
	padding: 80px 0 20px;
}
.pricing-ip-area {
	background: #ffff;
}
.pricing-item-box {
	background: #fff;
	box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
	padding: 45px 53px 60px 50px;
	border-radius: 10px;
	position: relative;
	overflow: hidden;
	z-index: 1;
	-webkit-transition: .5s;
	transition: .5s;
	margin-bottom: 30px;
}
.pricing-item-box::before {
	content: "";
	position: absolute;
	width: 0;
	height: 100%;
	top: 0;
	left: 50%;
	background: rgba(4, 48, 109, .80);
	-webkit-transition: .3s;
	-moz-transition: .3s;
	transition: .3s;
	transition: all 400ms linear;
	border-radius: 4px;
	z-index: -1;
}
.pricing-shape {
	position: absolute;
	right: -24px;
	bottom: -50px;
    z-index: -1;
}
.pricing-shape img {
    -webkit-transition: .4s;
	transition: .4s;
}
.pricing-top-content h3 {
	font-size: 28px;
	font-weight: 800;
	margin-bottom: 20px;
    -webkit-transition: .3s;
	transition: .3s;
}
.pricing-top-content p {
	font-size: 15px;
	line-height: 29px;
	border-bottom: 1px solid #ddd;
	padding-bottom: 20px;
	margin-bottom: 36px;
    -webkit-transition: .3s;
	transition: .3s;
}
.pricing-middle-content {
	margin-bottom: 20px;
}
.pricing-middle-content h2 {
	font-size: 56px;
	letter-spacing: 0px;
	line-height: 25px;
	color: #0d0d0d;
	font-weight: 700;
	margin-bottom: 24px;
    -webkit-transition: .3s;
	transition: .3s;
}
.pricing-middle-content h2 span {
	font-size: 40px;
	margin-right: -10px;
}
.pricing-middle-content h2 span.month {
	font-size: 18px;
	font-weight: 500;
	margin-left: -8px;
}
.pricing-middle-content h6 {
	font-size: 20px;
	color: #0d0d0d;
	font-weight: 500;
    -webkit-transition: .3s;
	transition: .3s;
}
.pricing-list-item {
	margin-bottom: 65px;
}
.pricing-list-item ul li {
	list-style: none;
	margin-bottom: 10px;
	color: #0d0d0d;
    -webkit-transition: .3s;
	transition: .3s;
}
.pricing-list-item ul li span {
	width: 25px;
	height: 25px;
	line-height: 25px;
	text-align: center;
	display: inline-block;
	background: #04316d;
	color: #fff;
	border-radius: 50%;
	font-size: 12px;
	margin-right: 10px;
    -webkit-transition: .4s;
	transition: .4s;
}
.pricing-list-item ul li.unactive {
	color: #848484;
    -webkit-transition: .3s;
	transition: .3s;
}
.pricing-list-item ul li.unactive span {
	background: #848484;
    -webkit-transition: .3s;
	transition: .3s;
}
.pricing-btn a {
	background: #04306d;
	color: #fff;
	padding: 14px 26px;
	border-radius: 5px;
    -webkit-transition: .3s;
	transition: .3s;
}
.pricing-btn a:hover {
	border: 2px solid #04306d;
	color: #04306d;
}
.pricing-item-box:hover::before {
	width: 100%;
	left: 0;
}
.pricing-item-box:hover .pricing-top-content h3 {
    color: #fff;
}
.pricing-item-box:hover .pricing-top-content p {
    color: #fff;
}
.pricing-item-box:hover .pricing-middle-content h2 {
    color: #fff;
}
.pricing-item-box:hover .pricing-middle-content h6 {
    color: #fff;
}
.pricing-item-box:hover .pricing-list-item ul li {
    color: #fff;
}
.pricing-item-box:hover .pricing-list-item ul li span {
    background: #fff;
    color: #04316c;
}
.pricing-item-box:hover .pricing-btn a {
	background: #1a7be4;
	color: #fff;
	border: 2px solid transparent;
}
.pricing-item-box:hover .pricing-list-item ul li.unactive {
	color: #fff;
}
.pricing-item-box:hover .pricing-list-item ul li.unactive span {
	background: #848484;
    color: #fff;
}
.pricing-item-box:hover {
	transform: translateY(-5%);
}
.pricing-item-box:hover .pricing-shape img {
	filter: brightness(0) invert(1);
}




/*================================
<--  Fin-Web Blog Area Css -->
==================================*/


.blog-area {
	padding: 42px 0 110px;
}
.blog-item-box {
	background: #fafafa;
	box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
	margin: 10px;
	border-radius: 5px;
	position: relative;
}
.blog-img-thum {
	overflow: hidden;
}
.blog-img-thum img {
	width: 100%;
	border-radius: 5px 5px 0 0;
    -webkit-transition: .5s;
	transition: .5s;
}
.blog-solution-text {
	position: absolute;
	left: 7%;
	top: 46%;
}
.blog-solution-text span {
	background: #1b7be5;
	color: #fff;
	padding: 5px 14px;
	font-size: 15px;
	border-radius: 3px;
    cursor: pointer;
    -webkit-transition: .5s;
	transition: .5s;
}
.blog-solution-text span:hover {
	background: #fff;
	color: #04316d;
}
.blog-content {
	padding: 16px 27px 10px 27px;
}
.blog-content h4 {
	font-size: 22px;
	font-weight: 600;
	line-height: 32px;
	margin-bottom: 12px;
}
.blog-content p {
	font-size: 17px;
	line-height: 28px;
	color: #616161;
}
.blog-bottom-item {
	display: flex;
	justify-content: space-between;
	padding: 14px 24px 20px 24px;
	border-top: 5px solid #fff;
	position: relative;
}
.blog-bottom-item::before {
	content: "";
	position: absolute;
	width: 64px;
	height: 60px;
	background: #1a7be4;
	right: 0;
	bottom: 0px;
	z-index: -1;
	border-radius: 3px;
}
.blog-celender-user ul li {
	list-style: none;
	display: inline-block;
	font-size: 14px;
	color: #616161;
	font-weight: 400;
}
.blog-celender-user ul li i {
	-webkit-text-stroke-width: 1px;
	color: transparent;
	-webkit-text-stroke-color: #04306d;
	margin-right: 4px;
}
.blog-celender-user ul li.celender-1st {
	margin-right: 21px;
}
.blog-bottom-btn a {
	color: #fff;
}
.blog-item-box:hover .blog-img-thum img {
    -webkit-transform: scale(1.3);
    -ms-transform: scale(1.3);
    transform: scale(1.3);
    border-radius: 5px 5px 0 0;
}
#customers-blog.owl-carousel .owl-dots {
	text-align: center;
	position: absolute;
	left: 0;
	right: 0;
	bottom: -70px;
}
#customers-blog.owl-carousel .owl-dots .owl-dot {
	background: #1a7be4;
	display: inline-block;
	height: 10px;
	width: 10px;
	border-radius: 10px;
	margin: 0 3px;
}
#customers-blog.owl-carousel .owl-dot.active {
	background: #ddd;
}



/*================================
<--  Fin-Web Footer Area Css -->
==================================*/


.footer-area {
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	padding: 60px 0 16px;
	overflow: hidden;
}

.widgets-company-info-inner .politics-logo {
	margin-bottom: 29px;
}
.company-info-desc p {
	margin-bottom: 30px;
	opacity: 0.851;
	font-size: 16px;
	line-height: 26px;
	color: #ffffff;
}
.widget-social-icon ul li a {
	width: 35px;
	height: 35px;
	line-height: 35px;
	text-align: center;
	border-radius: 3px;
	display: block;
	background: #fff;
	margin-right: 9px;
	-webkit-transition: .3s;
	transition: .3s;
	color: #04316d;
}
.widget-social-icon ul li a:hover {
	color: #fff;
	background: #1a7be4;
}
.widget-nav-menu h4.widget-title {
	color: #fff;
	font-size: 22px;
	font-weight: 700;
	margin-bottom: 26px;
}
.menu-quick-link-content {
	margin-left: 22px;
}
.menu-quick-link-content ul.footer-widget-list li {
	list-style: disc;
	margin-bottom: 9px;
	color: #fff;
	font-size: 23px;
}
.menu-quick-link-content ul.footer-widget-list li a {
	color: #fff;
	-webkit-transition: .3s;
	transition: .3s;
	border-bottom: 2px solid transparent;
	padding-bottom: 5px;
	opacity: 0.949;
	font-size: 16px;
	margin-left: -6px;
}
.menu-quick-link-content ul.footer-widget-list li a:hover {
	color: #1a7be4;
}
.widget-social-icon {
	margin-bottom: 23px;
}
.widget-social-icon ul li {
	list-style: none;
}

.widget-gallery-img {
	margin-top: 40px;
}
.widget-gallery-img img {
	margin-right: 4px;
	margin-bottom: 8px;
	border-radius: 3px;
}
.widget-nav-menu p {
	color: #fff;
	width: 90%;
	line-height: 30px;
}
.row.footer-border {
	border-top: 1px solid #385a88;
	margin-top: 40px;
}
.widget-copy-right {
	padding-top: 26px;
}
.widget-copy-right p {
	color: #fff;
	opacity: 0.902;
}
.widget-copy-right p a {
	color: #fff;
    -webkit-transition: .3s;
    transition: .3s;
}
.widget-copy-right p a:hover {
    color: #1a7be4;
}



/*================================
<-- Fin-Web Braedcrumb  Css -->
==================================*/



.braedcrumb-area {
	display: flex;
	align-items: center;
	height: 400px;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	position: relative;
}
.breadcrumb-heading h1 {
    color: #fff;
    text-transform: capitalize;
    margin-bottom: 10px;
    font-size: 45px;
	font-weight: 700;
}
.breadcrumb-item a {
	color: #fff;
	text-decoration: none;
	transition: .5s;
}
.braedcrumb-area .breadcrumb-item + .breadcrumb-item::before {
	color: #fff;
}
.breadcrumb-item a:hover {
    color: #fff;
    opacity: 1;
}
.breadcrumb-item.active {
	color: #fff;
}


/*============================================================
		<-- Start Fin-Web All Inner Page  Css -->
==============================================================*/



/*================================
<-- Fin-Web About Inner Page  Css -->
==================================*/

.about-area.about-inner-page {
	margin-top: 0;
	padding: 50px 0 116px;
	overflow: hidden;
}
.about-inner-page-box {
	padding-left: 60px;
}
.about-content .about-inner-heading p {
	width: 75%;
}


/*================================
<-- Fin-Web Blog Inner Page  Css -->
==================================*/


.blog-area.blog-ip-area {
	padding: 42px 0 25px;
}
.blog-ip-box {
	margin: 0;
	margin-bottom: 30px;
}


/*================================
<-- Fin-Web Blog-Details Inner Page  Css -->
==================================*/
.blog-two-area {
	padding: 50px 0 20px;
}
.blog-categories {
	background: #f9f9f9;
	padding: 40px 40px 40px 40px;
	margin-bottom: 60px;
}
.blog-categories h4 {
	background: #1a7be4;
	color: #fff;
	width: 335px;
	padding: 14px 14px 14px 30px;
	margin-bottom: 25px;
}
.blog-categories-list ul li {
	list-style: none;
}
.blog-categories-list ul li a {
	margin-bottom: 14px;
	display: block;
	border-bottom: 1px solid #eaeaea;
	padding-bottom: 26px;
	color: #04306d;
	font-weight: 500;
}
.blog-categories-list ul li a i {
	margin-right: 12px;
}
.blog-Recent-img {
	float: left;
	margin-right: 20px;
}
.blog-Recent-Post {
	margin-bottom: 20px;
}
.blog-Recent-Post-content h5 {
	font-size: 16px;
	width: 90%;
	margin-bottom: 8px;
	line-height: 24px;
	font-weight: 500;
}
.blog-Recent-Post-content p {
	font-size: 14px;
}
.blog-gallary img {
	margin-right: 19px;
	margin-bottom: 10px;
}
.blog-item-box:hover .blog-img::after {
	left: 0;
	right: 0;
	opacity: 1;
}




/*================================
<-- Fin-Web Contact Inner Page  Css -->
==================================*/

.contact-area {
	background: #f7f5f6;
}
.row.contact_bg {
	padding: 25px 36px 65px;
	background: #fff;
	position: relative;
	background-position: top;
	background-size: cover;
	background-repeat: no-repeat;
}
.section-title.contact-title {
	margin-bottom: 40px;
}
.section-title .contact-main-title {
	font-size: 40px;
}
.form_box input {
	border: 1px solid rgba(100,100,100,0.3);
	width: 100%;
	height: 50px;
	padding: 26px 20px;
	margin-bottom: 26px;
	outline: 0;
	background: #f7f5f6;
}
.contact-left {
	padding: 50px 105px 50px 304px;
}
.contact-title h2 {
	font-size: 30px;
	letter-spacing: 0px;
	color: #3b1d82;
	font-weight: 700;
}
.form_box input::placeholder {
    color: rgba(100,100,100,0.8);
}
.form_box textarea {
	width: 100%;
	height: 160px;
	padding: 14px 18px;
	outline: 0;
	background: #f7f5f6;
	border: 1px solid rgba(100,100,100,0.3);
}
.form_box textarea::placeholder {
    color: rgba(100,100,100,0.8);
}
.contact-form-button button {
    background: #E11143;
    color: #fff;
    border: 1px solid #E11143;
    padding: 11px 33px;
    margin-top: 35px;
    position: relative;
    z-index: 1;
    transition: .5s;
}
.contact-form-button button:hover {
    color: #E11143;
}
.contact-form-button button:before {
    position: absolute;
    top: 0;
    right: 0;
    content: "";
    background: #fff;
    height: 100%;
    transition: .5s;
    width: 0;
    z-index: -1;
}
.contact-form-button button:hover:before {
    width: 100%;
    left: 0;
}
.contact-form-button button i {
    margin-left: 10px;
}
.contact-btn {
	margin-top: 70px;
}
.mapouter.fixed-height {
	height: 775px;
	padding-left: 185px;
}
.gmap_canvas {
    width: 100%;
    height: 100%;
}
.mapouter iframe {
	height: 100%;
	width: 100%;
}

/* Contact-Two  */

.contact-two-area {
	padding: 50px 0 20px;
}
.contact-two-item {
	border: 1px solid #3b1d81;
	padding: 45px 20px 38px;
	margin-bottom: 30px;
}
.contact-two-icon {
	margin-bottom: 25px;
}
.contact-two-icon i {
	width: 82px;
	height: 82px;
	line-height: 82px;
	background: #1a7be4;
	color: #fff;
	font-size: 30px;
	border-radius: 50%;
	-webkit-transition: .4s;
	transition: .4s;
}
.contact-two-content h4 {
	font-size: 23px;
	font-weight: 700;
	margin-bottom: 19px;
	-webkit-transition: .4s;
	transition: .4s;
}
.contact-two-content p {
	margin-bottom: 0;
	font-size: 15px;
}
.contact-two-item:hover .contact-two-icon i {
	background: #04306d;
	color: #fff;
}
.contact-two-item:hover .contact-two-content h4 {
	color: #04306d;
}
.hurryup-area {
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	padding: 115px 0 265px;
}
.hurryup-bg-up {
	margin-top: -130px;
}
























































.finweb_nav_manu {
    transition: .5s;
    z-index: 2;
    position: relative;
    padding: 0 70px 0;
    margin-bottom: -95px;
    border-bottom: 1px solid rgba(16,18,16,0.10196078431372549);
}

.sticky {
	left: 0;
	margin: auto;
	position: fixed !important;
	top: 0;
	width: 100%;
	-webkit-box-shadow: 0 2px 5px -2px rgba(0, 0, 0, 0.1);
	box-shadow: 0 2px 5px -2px rgba(0, 0, 0, 0.1);
	background: #fff;
	transition: .5s !important;
	z-index: 922;
	-webkit-animation: 300ms running fadeInDown;
	animation: 500ms running fadeInUp;
	animation-name: slideInDown;
}

.sticky .finweb_menu>ul>li>a {
    color: #fff;
}

.sticky .header-button a {
    background: #ffde5d;
}

.sticky .header-button a i {
    color: #fff;
}

/* finweb Menu Css*/
nav.finweb_menu {
    text-align: center;
    position: relative;
    z-index: 1;
    margin-bottom: -3px;
    margin-left: 11px;
}

.finweb_menu ul {
    list-style: none;
    display: inline-block;
}

.finweb_menu>ul>li {
    display: inline-block;
    position: relative;
    z-index: 1;
}

.finweb_menu>ul>li>a {
    font-size: 17px;
    display: block;
    margin: 35px 15px;
    transition: .5s;
    color: #101210;
    font-weight: 500;
}

nav.finweb_menu span {
    font-size: 11px;
    padding-left: 5px;
    font-family: FontAwesome;
    opacity: .5;
}

.finweb_menu>ul>li>a:hover {
    color: #ffde5d;
}

/*menu button*/

.header-button {
    display: inline-block;
    margin-top: 20px;
}

.header-button a {
    font-size: 16px;
    padding: 12px 30px;
    font-weight: 500;
    color: #fff;
    background: #101210;
    border-radius: 5px;
    display: inline-block;
    position: relative;
    z-index: 1;
    transition: .5s;
}

.header-button a:before {
    position: absolute;
    content: "";
    z-index: -1;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    border-radius: 5px;
    background: #ffde5d;
    transform: scale(0);
    transition: .5s;
}

.header-button a i {
    padding-right: 5px;
    position: relative;
    top: 3px;
    color: #ffde5d;
    transition: .5s;
}

.header-button a:hover:before {
    transform: scale(1);
}

.header-button a:hover i {
    color: #fff;
}

/*Style Two Nav Menu*/

.style-two.finweb_nav_manu {
    border-bottom: 1px solid rgba(255,255,255,0.10196078431372549);
}

.style-two .finweb_menu>ul>li>a {
    color: #fff;

}

/*style two btn*/

.style-two .header-button a {
    background: rgba(16,18,16,0);
    border: 1px solid rgba(255,255,255,0.3);
}

.style-two .header-button a i {
    color: #bbf737;
}

/*** Sub Menu Style 
==========================***/

.finweb_menu ul .sub-menu {
    position: absolute;
    left: 0;
    top: 130%;
    width: 217px;
    text-align: left;
    background: #fff;
    margin: 0;
    z-index: 1;
    -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3);
    transition: .5s;
    visibility: hidden;
    border-top: 2px solid #ffde5d;
    opacity: 0;
}

.finweb_menu ul li:hover>.sub-menu {
    visibility: visible;
    top: 100%;
    opacity: 1;
}

.finweb_menu ul .sub-menu li {
    position: relative;
}

.finweb_menu ul .sub-menu li a {
    display: block;
    padding: 12px 20px;
    margin: 0;
    line-height: 1.3;
    letter-spacing: normal;
    font-size: 16px;
    font-weight: 500;
    text-transform: capitalize;
    -webkit-transition: .1s;
    transition: .1s;
    visibility: inherit !important;
    color: #101210 !important;
}

.finweb_menu ul .sub-menu li:hover>a,
.finweb_menu ul .sub-menu .sub-menu li:hover>a,
.finweb_menu ul .sub-menu .sub-menu .sub-menu li:hover>a,
.finweb_menu ul .sub-menu .sub-menu .sub-menu .sub-menu li:hover>a {
    background: #ffde5d;
    color: #fff !important;
}

/* sub menu 2 
=================*/

.finweb_menu ul .sub-menu .sub-menu {
    left: 100%;
    top: 130%;
    opacity: 0;
    visibility: hidden;
}

.finweb_menu ul .sub-menu li:hover>.sub-menu {
    opacity: 1;
    visibility: visible;
    top: 0%;
}

/* sub menu 3 
==================*/

.finweb_menu ul .sub-menu .sub-menu li {
    position: relative;
}

.finweb_menu ul .sub-menu .sub-menu .sub-menu {
    right: 100%;
    left: auto;
    top: 130%;
    opacity: 0;
    visibility: hidden;
}

.finweb_menu ul .sub-menu .sub-menu li:hover>.sub-menu {
    opacity: 1;
    visibility: visible;
    top: 0%;
}

ul.sub-menu li a span {
    background: #ffde5d;
    padding: 5px 10px;
    color: #fff;
    opacity: 1;
    font-family: 'Fira Sans';
    border-radius: 2px;
    margin-left: 5px;
    transition: .5s;
}

ul.sub-menu li:hover a span{
    background: rgba(255,255,255, 0.20);
}

/* sub menu 4 
====================*/

.finweb_menu ul .sub-menu .sub-menu .sub-menu li {
    position: relative;
}


.finweb_menu ul .sub-menu .sub-menu .sub-menu li:hover>.sub-menu {
    opacity: 1;
    visibility: visible;
    top: 0%;
}

.finweb_menu li a:hover:before {
    width: 101%;
}

.finweb_nav_manu.sticky .logo_img {
    display: none;
}

.main_sticky {
    display: none;
}

.finweb_nav_manu.sticky .main_sticky {
    display: inherit;
}

.mobile-menu.mean-container {
    overflow: hidden;
}







/*
<!-- ============================================================== -->
<!-- finweb Start Cart Section -->
<!-- ============================================================== -->*/

.cart-section {
    padding: 100px 0 100px;
}

.cart-empty p {
    padding: 18px 25px;
    position: relative;
    background-color: #F6F7F9;
    border-bottom: 2px solid #050505;
    display: inline-block;
    width: 100%;
    color: #050505;
}

.cart-empty p i {
    color: #050505;
    padding-right: 10px;
}

.cart-section a.finweb-button {
    margin-top: 10px;
    display: inline-block;
}


@keyframes ripple {

    0%,
    35% {
        -webkit-transform: scale(0);
        -moz-transform: scale(0);
        -ms-transform: scale(0);
        -o-transform: scale(0);
        transform: scale(0);
        opacity: 1;
    }

    50% {
        -webkit-transform: scale(1.5);
        -moz-transform: scale(1.5);
        -ms-transform: scale(1.5);
        -o-transform: scale(1.5);
        transform: scale(1.5);
        opacity: 0.8;
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(2);
        -moz-transform: scale(2);
        -ms-transform: scale(2);
        -o-transform: scale(2);
        transform: scale(2);
    }
}


@keyframes movebounce {
    0% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
    }

    50% {
        -webkit-transform: translateY(20px);
        transform: translateY(20px);
    }

    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
    }
}


@keyframes moveleftbounce {
    0% {
        -webkit-transform: translateX(0px);
        transform: translateX(0px);
    }

    50% {
        -webkit-transform: translateX(20px);
        transform: translateX(20px);
    }

    100% {
        -webkit-transform: translateX(0px);
        transform: translateX(0px);
    }
}



/*--==============================================->
  <!-- finweb Animation Dance -->
 ==================================================-*/
/**/
.dance3 {
    -webkit-animation: dance3 8s alternate infinite;
    animation: dance3 8s alternate infinite;
}

@keyframes dance3 {
    0% {
        -webkit-transform: scale(0.5);
    }

    100% {
        -webkit-transform: scale(1);
    }
}

.dance {
    -webkit-animation: dance 2s alternate infinite;
    animation: dance 2s alternate infinite;
}

@keyframes dance {
    0% {
        -webkit-transform: scale(0.5);
    }

    100% {
        -webkit-transform: scale(1.2);
    }
}

.dance2 {
    -webkit-animation: dance2 4s alternate infinite;
    animation: dance2 4s alternate infinite;
}

@keyframes dance2 {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
    }

    50% {
        -webkit-transform: translate3d(25px, -25px, 0);
    }

    100% {
        -webkit-transform: translate3d(0, -25px, 25px);
    }
}

.watermark-animate {
    -webkit-animation: watermark-animate 8s infinite;
    animation: watermark-animate 8s infinite;
    animation-direction: alternate-reverse;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
}

@keyframes watermark-animate {
    0% {
        left: 0;
    }

    100% {
        left: 100%;
    }
}



/*rotateme animation*/

.rotateme {
    -webkit-animation-name: rotateme;
    animation-name: rotateme;
    -webkit-animation-duration: 20s;
    animation-duration: 20s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
}

@keyframes rotateme {
  from {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
  }
}

@-webkit-keyframes rotateme {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
  }
}






/*----------------
==============   Start finweb shop Nav Sidebar button
------------------*/

/*nav button*/

.nav-btn.navSidebar-button {
    display: inline-block;
    padding: 10px 0 0;
}

.nav-btn.navSidebar-button a i {
    padding-right: 10px;
    font-size: 20px;
}

.xs-sidebar-group .xs-overlay {
    left: 100%;
    top: 0;
    position: fixed;
    z-index: 101;
    height: 100%;
    opacity: 0;
    width: 100%;
    visibility: hidden;
    -webkit-transition: all 0.4s ease-in 0.8s;
    -o-transition: all 0.4s ease-in 0.8s;
    transition: all 0.4s ease-in 0.8s;
}

.xs-sidebar-group .widget-heading {
    position: absolute;
    top: 12px;
    right: 12px;
    padding: 0;
}

.xs-sidebar-widget {
    position: fixed;
    left: -100%;
    top: 0;
    bottom: 0;
    width: 100%;
    max-width: 360px;
    z-index: 999999;
    overflow: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    background-color: #fff;
    -webkit-transition: all 0.5s cubic-bezier(0.9, 0.03, 0, 0.96) 0.6s;
    transition: all 0.5s cubic-bezier(0.9, 0.03, 0, 0.96) 0.6s;
    visibility: hidden;
    opacity: 0;
}

.xs-sidebar-group.isActive .xs-overlay {
    opacity: 0.4;
    visibility: visible;
    -webkit-transition: all 0.8s ease-out 0s;
    -o-transition: all 0.8s ease-out 0s;
    transition: all 0.8s ease-out 0s;
    left: 0;
}

.xs-sidebar-group.isActive .xs-sidebar-widget {
    opacity: 1;
    visibility: visible;
    left: 0;
    -webkit-transition: all 0.7s cubic-bezier(0.9, 0.03, 0, 0.96) 0.4s;
    transition: all 0.7s cubic-bezier(0.9, 0.03, 0, 0.96) 0.4s;
}

.sidebar-textwidget {
    padding: 40px 32px;
}

.close-side-widget i {
    color: #101010;
    font-size: 28px;
    display: block;
}

.sidebar-widget-container {
    position: relative;
    top: 150px;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all 0.3s ease-in 0.3s;
    -o-transition: all 0.3s ease-in 0.3s;
    transition: all 0.3s ease-in 0.3s;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.xs-sidebar-group.isActive .sidebar-widget-container {
    top: 0px;
    opacity: 1;
    visibility: visible;
    -webkit-transition: all 1s ease-out 1.2s;
    -o-transition: all 1s ease-out 1.2s;
    transition: all 1s ease-out 1.2s;
    -webkit-backface-visibility: hidden;
  
    backface-visibility: hidden;
}

.xs-overlay {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    opacity: 0.5;
    z-index: 0;
}

.xs-bg-black {
    background-color: #101010;
}


/*html css*/
.nav-logo {
    padding: 0 0 40px;
}

.sidebar-info-contents .widget-search {
    padding: 0 0 15px;
}

.sidebar-info-contents .widget {
    display: block;
} 

.sidebar-info-contents h3.widget-title {
    font-size: 25px;
    padding: 8px 0 20px;
    margin-bottom: 10px;
    border-bottom: 1px solid #e9e9e9;
    font-style: italic;
}

.sidebar-info-contents h3.widget-title {
    font-size: 25px;
    padding: 15px 0 15px;
}

.widget form {
    position: relative;
}

.widget input {
    border-radius: 4px;
    padding-left: 20px;
    height: 56px;
    width: 100%;
    color: #fff;
    border: 1px solid #e9e9e9;
}

button.icon {
    border: 0;
    font-size: 18px;
    color: #fff;
    padding: 1px 15px;
    position: absolute;
    right: 0;
    top: 0;
    height: 56px;
    width: 60px;
    background: #ffde5d;
    border-radius: 0 4px 4px 0;
}

.widget input::placeholder {
    color: #101010;
}

ul.list-style-one li {
    display: block;
    list-style: none;
    color: #fff;
    padding: 16px 0 0;
    overflow: hidden;
}

ul.list-style-one li span {
    font-size: 16px;
    font-weight: 600;
    color: #101010;
    display: inline-block;
    padding: 0 5px;
}

ul.list-style-one li a {
    transition: .5s;
    color: #101010;
}

ul.list-style-one li a i {
    background: red;
    width: 25px;
    height: 25px;
    line-height: 25px;
    text-align: center;
    display: inline-block;
    border-radius: 30px;
    color: #fff;
    margin-right: 5px;
}

a.white-bg i {
    background: #e9e9e9 !important;
}

a.yellow-bg i {
    background: #eeee22 !important;
}

a.green-bg i {
    background: #9BC45C !important;
}

/*Tag
=======*/

.sidebar-tag-menu {
    padding: 12px 0 0;
}

.sidebar-tag-menu ul li {
    display: inline-block;
    list-style: none;
    margin-right: 6px;
    color: #101010;
    padding: 0 0 12px;
}

/*social icon*/

ul.social-icon {
    padding: 20px 0 0;
}

ul.social-icon li {
    display: inline-block;
    list-style: none;
    margin: 0 10px 0 0;
}

ul.social-icon li a {
    display: inline-block;
    width: 35px;
    height: 35px;
    line-height: 36px;
    text-align: center;
    background: #fff;
    color: #101010;
    transition: .5s;
    font-size: 18px;
    border-radius: 3px;
}

ul.social-icon li a:hover {
    background: #ffde5d;
    color: #fff;
}

ul.list-style-one li a:hover span {
    background: #ffde5d;
    border-radius: 30px;
    color: #fff;
} 

ul.list-style-one li a:hover {
    color: #ffde5d;
}














/*** 
====================================================================
    Cursor Css
====================================================================
***/

.cursor {
    position: fixed;
    top: 0;
    left: 0;
    width: 60px;
    height: 60px;
    background: transparent;
    border: 2px solid #fff !important;
    mix-blend-mode: difference;
    border-radius: 50%;
    pointer-events: none;
    transform: translate(-50%, -50%);
    z-index: 1000;
    transition: .15s;
}

.cursor2 {
    position: fixed;
    top: 0;
    left: 0;
    width: 5px;
    height: 5px;
    background: #fff;
    mix-blend-mode: difference;
    border-radius: 50%;
    pointer-events: none;
    transform: translate(-5px, 0px);
    z-index: 1000;
    transition: .1s;
}

.grow,
.grow-small {
    transform: scale(2);
    background: #032552;
    mix-blend-mode: difference;
    border: none;
    transition: .5s;
    opacity: 0;
}

.grow-small {
    transform: scale(2);
}





/*** 
====================================================================
    Search Popup
====================================================================
***/
.search-popup{
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    width: 100%;
    z-index: 99999;
    margin-top: -540px;
    transform: translateY(-100%);
    background-color: rgba(0,0,0,0.90);
    -webkit-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -moz-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -o-transition: all 500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
    transition: all 1500ms cubic-bezier(0.860, 0.000, 0.070, 1.000); /* easeInOutQuint */
    -webkit-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -moz-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    -o-transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
    transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000); /* easeInOutQuint */
}

.search-popup{
    width: 100%;
}

.search-active .search-popup{
    transform: translateY(0%);
    margin-top: 0;
}

.search-popup .close-search {
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	margin-top: -200px;
	border-radius: 50%;
	text-align: center;
	background-color: #04306d;
	width: 70px;
	cursor: pointer;
	box-shadow: 0 0 10px rgba(0,0,0,0.05);
	border-bottom: 3px solid #fff;
	border-top: 3px solid #fff;
	border-right: 3px solid #062462;
	border-left: 3px solid #062462;
	-webkit-transition: all 500ms ease;
	transition: all 500ms ease;
	height: 70px;
	line-height: 70px;
	text-align: center;
}

.search-active .search-popup .close-search{
    visibility: visible;
    opacity: 1;
    top: 50%;
    -webkit-transition-delay: 1500ms;
    -moz-transition-delay: 1500ms;
    -ms-transition-delay: 1500ms;
    -o-transition-delay: 1500ms;
    transition-delay: 1500ms;
}

.search-popup form{
    position: absolute;
    max-width: 700px;
    top: 50%;
    left: 15px;
    right: 15px;
    margin:-35px auto 0;
    transform: scaleX(0);
    transform-origin: center;
    background-color: #111111;
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

.search-active .search-popup form{
    transform: scaleX(1);
    -webkit-transition-delay: 1200ms;
    -moz-transition-delay: 1200ms;
    -ms-transition-delay: 1200ms;
    -o-transition-delay: 1200ms;
    transition-delay: 1200ms;
}

.search-popup .form-group{
    position:relative;
    margin:0px; 
  
    overflow: hidden;
}
.search-popup .form-group input[type="text"],
.search-popup .form-group input[type="search"]{
    position:relative;
    display:block;
    font-size:18px;
    line-height: 50px;
    color:#000000;
    height:70px;
    width:100%;
    padding: 10px 30px;
    background-color: #ffffff;
    -webkit-transition:all 500ms ease;
    -moz-transition:all 500ms ease;
    -ms-transition:all 500ms ease;
    -o-transition:all 500ms ease;
    transition:all 500ms ease;
    font-weight:500;
    text-transform:capitalize;
}

.search-popup .form-group input[type="submit"], .search-popup .form-group button {
	position: absolute;
	right: 30px;
	top: 0px;
	height: 70px;
	line-height: 70px;
	background: transparent;
	text-align: center;
	font-size: 24px;
	color: #04306d;
	padding: 0;
	cursor: pointer;
	-webkit-transition: all 500ms ease;
    transition: all 500ms ease;
	border: none;
}

.search-popup .form-group input[type="submit"]:hover,
.search-popup .form-group button:hover{
    color: #000000;
}

.search-popup input::placeholder,
.search-popup textarea::placeholder{
    color:#000000;
}

.search-popup .close-search.style-two{
    position: absolute;
    right: 25px;
    left: auto;
    color:#ffffff;
    width:auto;
    height:auto;
    top:25px;
    margin:0px;
    border:none;
    background:none !important;
    box-shadow:none !important;
    -webkit-transition:all 500ms ease;
    -moz-transition:all 500ms ease;
    -ms-transition:all 500ms ease;
    -o-transition:all 500ms ease;
    transition:all 500ms ease;
}

.search-box-btn {
    display: inline-block;
    padding-left: 22px;
}
.search-box-btn i {
    display: inline-block;
    color: #fff;
    line-height: 30px;
    text-align: center;
    font-size: 18px;
    cursor: pointer;
    transition: .5s;
}
.upp.search-box-btn i {
    color: #9E9FA1;
}
.search-box-btn.search-box-outer span i {
    font-size: 20px;
    display: inline-block;
    color: #fff;
    padding-left: 17px;
    position: relative;
    z-index: 1;
}
.upp.search-box-btn.search-box-outer span i {
    color: #9E9FA1;
}
.search-box-btn.search-box-outer span i:after {
    position: absolute;
    content: "0";
    right: -10px;
    top: -4px;
    width: 16px;
    height: 16px;
    line-height: 16px;
    text-align: center;
    background: #1552F6;
    color: #fff;
    border-radius: 50%;
    display: inline-block;
    font-size: 12px;
}
.flaticon-multiply:before {
    content: inherit;
}
button.close-search i {
    font-size: 25px;
    color: #fff;
    display: inline-block;
}
span.flaticon-multiply i {
	display: inline-block;
	color: #04306d;
}







/*===========================
<-- finweb Loader Css -->
=============================*/
.loader-wrapper {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    transition: 0.8s 1s ease;
    z-index: 999;
}

.loader {
    position: relative;
    display: block;
    z-index: 201;
    top: 50%;
    left: 50%;
    width: 100px;
    height: 100px;
    margin: -50px 0 0 -50px;
    border-radius: 50%;
    transition: all 1s 1s ease;
    border: 3px solid transparent;
    border-top-color: #04306D;
    -webkit-animation: spin 1.5s linear infinite;
    -moz-animation: spin 1.5s linear infinite;
    -o-animation: spin 1.5s linear infinite;
    animation: spin 1.5s linear infinite;
}

.loader:before {
    position: absolute;
    content: '';
    top: 6px;
    left: 6px;
    right: 6px;
    bottom: 6px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-left-color: #1A7BE4;
    -webkit-animation: spin 2s linear infinite;
    -moz-animation: spin 2s linear infinite;
    -o-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
}

.loader:after {
    position: absolute;
    content: '';
    top: 15px;
    left: 15px;
    right: 15px;
    bottom: 15px;
    border-radius: 50%;
    border: 3px solid transparent;
    border-right-color: #fff;
    -webkit-animation: spin 2.5s linear infinite;
    -moz-animation: spin 2.5s linear infinite;
    -o-animation: spin 2.5s linear infinite;
    animation: spin 2.5s linear infinite;
}

/*/ Here comes the Magic /*/

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-moz-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.loader-wrapper .loder-section {
    position: fixed;
    top: 0;
    width: 50%;
    height: 100%;
    background: #111;
    z-index: 2;
}

.loader-wrapper .loder-section.left-section {
    left: 0;
    transition: 1s 1.4s ease;
}

.loader-wrapper .loder-section.right-section {
    right: 0;
    transition: 1s 1.4s ease;
}

/*/ When page loaded /*/

.loaded .loder-section.left-section {
    left: -100%;
}

.loaded .loder-section.right-section {
    right: -100%;
}

.loaded .loader-wrapper {
    visibility: hidden;
}

.loaded .loader {
    top: -100%;
    opacity: 0;
}


/*
<!-- ============================================================== -->
<!--Scrollup Button Section -->
<!-- ============================================================== -->*/

/*------back-to-top------------*/

.prgoress_indicator {
	position: fixed;
	right: 50px;
	bottom: 20px;
	height: 46px;
	width: 46px;
	cursor: pointer;
	display: block;
	border-radius: 50px;
	box-shadow: inset 0 0 0 2px rgba(4, 48, 109, 0.2);
	z-index: 10000;
	opacity: 0;
	visibility: hidden;
	transform: translateY(15px);
	transform: translateY(15px) !important;
	transition: all 200ms linear !important;
}

.prgoress_indicator.active-progress {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) !important;
}

.prgoress_indicator::after {
	position: absolute;
	content: "\f106";
	font-family: "Font Awesome 5 Free";
	text-align: center;
	line-height: 46px;
	font-size: 18px;
	color: #04306d;
	left: 0;
	top: 0;
	height: 46px;
	width: 46px;
	cursor: pointer;
	display: block;
	font-weight: 900;
	z-index: 1;
	transition: all 200ms linear !important;
}

.prgoress_indicator::before {
  position: absolute;
  content: "\f106";
  font-family: "Font Awesome 5 Free";
  text-align: center;
  line-height: 46px;
  font-size: 18px;
  font-weight: 900;
  opacity: 0;
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
  left: 0;
  top: 0;
  height: 46px;
  width: 46px;
  cursor: pointer;
  display: block;
  z-index: 2;
  transition: all 200ms linear !important;
}

.prgoress_indicator:hover ::after {
  color: #2871ff;
}

.prgoress_indicator:hover ::before {
  opacity: 1;
}

.prgoress_indicator svg path {
  fill: none;
}

.prgoress_indicator svg.progress-circle path {
    stroke: #04306d;
    stroke-width: 4;
    box-sizing: border-box;
    transition: all 200ms linear !important;
}