/*!
Theme Name: kaltek
Theme URI: http://underscores.me/
Author: Pablo Broca
Author URI: https://pablobroca.com/
Description: kaltek by Pablo Broca
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: kaltek
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

kaltek is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*
Template Name: CODEIT - Technology & IT Solutions HTML5 Template
Description: CODEIT - Technology & IT Solutions HTML5 Template
Version: 1.0
*
* ------------------ CSS INDEX--------------------
 * #-Button
 * #-Header
 * #-Hero Slider
 * #-About Us
 * #-Info Box
 * #-Works About
 * #-Blog
 * #-Subscribe Form
 * #-Footer
 * #-Hero Banner
 * #-Pricing Plane
 * #-Team
 * #-Contact Form
 * #-Services Details
 * #-Widgets
 * #-Mobile Menu
*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,500&display=swap');
body{
	margin: 0;
	padding: 0;
	font-size: 16px;
	color: #0e1a1f;
	font-family: 'Poppins', sans-serif;
	font-weight: normal;
	font-style: normal;
}
a,
button {
	-webkit-transition: all 0.3s ease-out 0s;
	-moz-transition: all 0.3s ease-out 0s;
	-ms-transition: all 0.3s ease-out 0s;
	-o-transition: all 0.3s ease-out 0s;
	transition: all 0.3s ease-out 0s;
}
*::-moz-selection {
	background: #003366;
	color: #fff;
	text-shadow: none;
}
::-moz-selection {
	background: #003366;
	color: #fff;
	text-shadow: none;
}
::selection {
	background: #003366;
	color: #fff;
	text-shadow: none;
}
*::-moz-placeholder {
	color: #555555;
	font-size: 14px;
	opacity: 1;
}
*::placeholder {
	color: #555555;
	font-size: 14px;
	opacity: 1;
}
h1,h2,h3,h4,h5,h6,p{
	margin:0;
	padding: 0;
}
h1,h2,h3,h4,h5,h6{
	font-weight: 700;
	color: #0e1a1f;
}
ul{
	margin:0;
	padding: 0;
	list-style: none;
}
a{
	text-decoration: none;
	transition: .4s;
	-webkit-transition: all .4s ease-in-out;
}
a:hover{
	text-decoration: none;
	color: #003366;
}
button:focus{
	outline: none;
}
input:focus{
	outline: none;
}
textarea:focus{
	outline: none;
}
p{
	color: #0e1a1f;
}
img{
	max-width: 100%;
	height: auto;
}
/*Scroll Area*/
.scroll-area {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1;
    display: none;
}
.scroll-area i {
    width: 50px;
    height: 50px;
    background-color: #003366;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    color: #fff;
    font-size: 20px;
}
.text-right{
	text-align: right;
}
.section-padding{
	padding: 100px 0px;
}
.section-padding-2{
	padding-top: 100px;
	padding-bottom: 70px;
}
.section-bg{
	background: #f5f5f5;
}
/*
 * #-Button
*/
.button-1 {
	padding: 15px 40px;
	display: inline-block;
	font-size: 16px;
	color: #fff;
	background: #003366;
	font-weight: 600;
	letter-spacing: .5px;
	text-transform: capitalize;
	border: 1px solid #003366;
	-webkit-transition: all .3s ease-in-out;
	transition: all .25s ease-in-out;
	position: relative;
	z-index: 1;
}
.button-1::after {
	z-index: -1;
	content: "";
	clear: both;
	position: absolute;
	width: 0%;
	height: 100%;
	-webkit-transition: all .2s ease-in-out;
	transition: all .25s ease-in-out;
	background: #fff;
	top: 0;
	left: 0;
	left: 0;
}
.button-1:hover:after{
	width: 100%;
}
.button-1:hover{
	color: #0e1a1f;
	border-color: #0e1a1f;
}
.button-2 {
	padding: 16px 40px;
	display: inline-block;
	font-size: 16px;
	color: #0e1a1f;
	font-weight: 600;
	letter-spacing: .5px;
	text-transform: capitalize;
	-webkit-transition: all .3s ease-in-out;
	transition: all .25s ease-in-out;
	position: relative;
	z-index: 1;
	box-shadow: 0px 1px 10px 0px #b9b4b4;
}
.button-2::after {
	z-index: -1;
	content: "";
	clear: both;
	position: absolute;
	width: 0%;
	height: 100%;
	-webkit-transition: all .2s ease-in-out;
	transition: all .25s ease-in-out;
	background: #0e1a1f;
	top: 0;
	left: 0;
	left: 0;
}
.button-2:hover:after{
	width: 100%;
}
.button-2:hover{
	color: #fff;
}
/*
 * #-Header
*/
.header .row {
	width: 100%;
}
.header-top {
	background: #003366;
	padding: 15px 0px;
	box-sizing: border-box;
}
.top-info-left span {
	color: #fff;
	padding-right: 20px;
	font-size: 14px;
}
.top-info-left span:last-child{
	padding-right: 0px;
}
.top-info-right .office-time {
	display: inline;
}
.top-info-right .top-social {
	display: inline-block;
}
.top-info-right .office-time span {
	font-size: 14px;
	color: #fff;
	padding-right: 20px;
	margin-right: 20px;
	position: relative;
}
.top-info-right .office-time span::after {
	content: "";
	clear: both;
	display: block;
	position: absolute;
	top: 0;
	right: 0px;
	width: 2px;
	height: 100%;
	background: #5b5b5b;
}
.top-info-right .top-social ul li {
	display: inline-block;
	margin: 0px 10px;
	font-size: 15px;
}
.top-info-right .top-social ul li a{
	color: #fff;
}
.logo {
	display: flex;
	height: 100%;
	align-items: center;
	justify-content: center;
}
.logo img{
	max-width: 40px;
}
.header-search {
	float: right;
	padding-right: 0px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	height: 100%;
	position: relative;
	padding-left: 30px;
}
.menu {
	text-align: right;
}
.menu ul li {
	display: inline-block;
	position: relative;
}
.menu ul li a {
	display: inline-block;
	color: #333;
	text-transform: capitalize;
	font-weight: 500;
	padding: 35px 20px;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
	font-size: 16px;
}
.menu ul li:hover > a{
	color: #003366;
}
.menu nav ul li > ul {
	position: absolute;
	top: 110px;
	left: -4px;
	background-color: #fff;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
	width: 200px;
	opacity: 0;
	visibility: hidden;
	z-index: 999;
	text-align: left;
	border: 1px solid #efefef;
}
.menu nav ul li:hover > ul {
	opacity: 1;
	visibility: visible;
	top: 93px;
	left: 0;
}
.menu nav ul li > ul > li {
	display: block;
	position: relative;
	-webkit-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
	margin: 0px;
	padding: 0px;
}
.menu nav ul li > ul > li a::after {
	content: "";
	clear: both;
	display: block;
	width: 14px;
	height: 1px;
	background: #003366;
	position: absolute;
	top: 49%;
	left: 14px;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: all .4 ease-in-out;
	transition: all .4s ease-in-out;
}
.menu nav ul li > ul > li:hover > a {
	color: #003366;
	padding-left: 30px;
	background: #f7f9fe;
}
.menu nav ul li > ul > li:hover > a::after{
	opacity: 1;
	visibility: visible;
}
.menu nav ul li > ul > li:hover > a {
	color: #003366 !important;
}
.menu nav ul li > ul > li li > a:hover{
	color: #fff;
}
.menu nav ul li > ul > li a {
	display: inline-block;
	width: 100%;
	padding: 15px 14px;
	border-bottom: 1px dashed #efefef;
	font-size: 14px;
	color: #333;
	margin: 0px;
	font-weight: 400;
	text-transform: capitalize;
}
.menu nav ul li > ul > li:last-child a{
	border-bottom: none;
}
.menu nav ul > li > ul > li > ul {
	left: 200px;
	top: 28px;
}
.menu nav ul li > ul > li:hover > ul {
	top: -3px;
}
.menu nav ul li > ul > li:hover > ul {
	top: -3px;
	left: 100%;
}
.header-search-icon i.fa-times {
	display: none;
	-webkit-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}
.header-search-icon i.fa-times.active{
	display: block;
}
.header-search-icon i.fa-search {
	display: block;
	-webkit-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}
.header-search-icon {
	position: relative;
	width: 35px;
	height: 35px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #003366;
	color: #fff;
	border-radius: 5px;
}
.header-search-icon i.fa-times.active {
	position: absolute;
	z-index: 999;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #003366;
	border-radius: 5px;
}
.header-search-icon i{
	cursor: pointer;
}
.header-top-search-form {
	transform: scale(0);
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
	position: absolute;
	top: 100%;
	right: 0;
	opacity: 0;
	visibility: hidden;
	width: 360px;
	background: #fff;
	width: 400px;
	background: #ffffff;
	border-top: 3px solid #003366;
	box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
	z-index: 9;
}
.header-top-search-form.active {
	transform: scale(1);
	opacity: 1;
	visibility: visible;
}
.header-top-search-form-full {
	padding: 20px;
	position: relative;
	width: 100%;
}
.header-top-search-form-full form {
	width: 100%;
	position: relative;
}
.header-top-search-form-full::after {
	content: "";
	position: absolute;
	right: 4px;
	top: -12px;
	clear: both;
	display: block;
	clip-path: polygon(55% 0, 0% 100%, 100% 100%);
	width: 20px;
	height: 10px;
	background: #003366;
}
.header-top-search-form-full input {
	font-size: 14px;
	background-color: #f7f9fe;
	color: #333;
	border: 1px solid #f1f1f1;
	width: 100%;
	position: relative;
	padding: 14px 20px;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.header-top-search-form-full input:focus{
	border-color: #003366;
}
.header-top-search-form-full button {
	position: absolute;
	top: 0;
	background: #003366;
	height: 100%;
	border: none;
	right: 0;
	color: #fff;
	padding: 0px 15px;
}
/*
 * #-Hero Slider
*/
.hero-slider-item{
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	padding-top: 200px;
	padding-bottom: 150px;
	position: relative;
	z-index: 1;
}
.hero-slider-item::after {
	content: "";
	clear: both;
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: -1;
	background: #0e1a1f6b;
	top: 0;
	left: 0;
}
.hero-lsider-caption h4 {
	text-transform: uppercase;
	font-weight: 600;
	color: #fff;
	font-size: 26px;
	margin-bottom: 10px;
}
.hero-lsider-caption h2 {
	font-size: 65px;
	text-transform: capitalize;
	font-weight: 700;
	line-height: 1.1;
	margin-bottom: 20px;
	color: #fff;
}
.hero-slider-full .owl-dots {
	position: absolute;
	bottom: 37%;
	right: 2%;
	counter-reset: dots;
	width: 30px;
	text-align: center;
}
.hero-slider-full .owl-dots .owl-dot {
	margin: 0 6px;
	border: 0;
	background: none;
	cursor: pointer;
}
.hero-slider-full .owl-dots .owl-dot span {
	display: block;
	border-radius: 50%;
	background-color: #fff;
	width: 12px;
	height: 12px;
	position: relative;
	transition: all 0.3s ease;
}
.hero-slider-full .owl-dots .owl-dot span::after {
	position: absolute;
	content: "";
	top: -5px;
	left: -5px;
	border: 1px solid #003366;
	border-radius: 50%;
	width: calc(100% + 10px);
	height: calc(100% + 10px);
	transform: scale(0);
	transition: all 0.3s ease;
}
.hero-slider-full .owl-dots .owl-dot.active span{
	background:#003366;
}
.hero-slider-full .owl-dots .owl-dot.active span::after {
	transform: scale(1);
}
/*Animation*/
.active .hero-slider-item h2, .active .hero-slider-item a, .active .hero-slider-item h4{
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-duration: 1s;
  animation-duration: 1.3s;
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
  -webkit-animation-delay: 1.7s;
  animation-delay: 1.6s;
}
.active .hero-slider-item h4{
  -webkit-animation-delay: 0.7s;
  animation-delay: 0.7s;
}
.active .hero-slider-item a {
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s;
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
/*===== All Preloader Style =====*/
#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff;
  z-index: 999999; 
}
#preloader .preloader {
	width: 100%;
	height: 100%;
	display: inline-block;
	padding: 0px;
	text-align: left;
	box-sizing: border-box;
	position: absolute;
	margin-left: -25px;
	margin-top: -25px;
	display: flex;
	justify-content: center;
	align-items: center;
}
#preloader .preloader span {
    position: absolute;
    display: inline-block;
    width: 150px;
    height: 150px;
    border-radius: 100%;
    background-color: #e52e06;
    -webkit-animation: preloader 1.3s linear infinite;
    animation: preloader 1.3s linear infinite;
}
#preloader .preloader span:last-child {
	animation-delay: -0.8s;
	-webkit-animation-delay: -0.8s;
	background-color: green;
}

@keyframes preloader {
  	0% {
    	transform: scale(0, 0);
    	opacity: 0.5; 
	}
  	100% {
    	transform: scale(1, 1);
    	opacity: 0; 
	} 
}
@-webkit-keyframes preloader {
  	0% {
    	-webkit-transform: scale(0, 0);
    	opacity: 0.5; 
	}
  	100% {
    	-webkit-transform: scale(1, 1);
    	opacity: 0; 
    } 
}
/*End Preloader Style*/
/*
 * Features Area
*/
.feature-area-content h5 {
	font-size: 14px;
	color: #003366;
	font-weight: 500;
	text-transform: uppercase;
}
.feature-area-content h2 {
	margin-top: 10px;
	margin-bottom: 20px;
	font-weight: 700;
	line-height: 1.2;
	font-size: 32px;
}
.features-item.active {
    background: #fff;
    display: block;
    position: relative;
    box-shadow: -1px 5px 20px 0px rgb(82 90 101 / 10%)
}
.features-item {
    padding: 20px 30px;
}
.features-item h2 {
    font-size: 20px;
    margin-top: 19px;
}
.features-item p {
	font-size: 16px;
	line-height: 28px;
	margin-top: 10px;
}
.shap-features {
	position: absolute;
	top: -28px;
	left: -24px;
}
.features-area-left-content {
	position: relative;
}
.shap-features {
	animation-name: bounce-1;
	animation-timing-function: linear;
	animation-duration: 3s;
	animation-iteration-count: infinite;
	margin: 0 auto 0 auto;
	transform-origin: bottom;
}
@keyframes bounce-1 {
    0%   { transform: translateY(0); }
    50%  { transform: translateY(-50px); }
    100% { transform: translateY(0); }
}
/*
 * #-About Us
*/
.about-thumbnail img {
	width: 100%;
}
.about-content h5 {
	font-size: 14px;
	color: #003366;
	font-weight: 500;
	text-transform: uppercase;
}
.about-content h2 {
	margin-top: 10px;
	margin-bottom: 20px;
	font-weight: 700;
	line-height: 1.2;
	font-size: 32px;
}
.about-content-navs-tab .nav-tabs {
	border-bottom: none;
}
.about-content-navs-tab .nav-tabs .nav-item {
	margin: 4px 4px;
}
.about-content-navs-tab .nav-tabs .nav-item button {
	background: transparent;
	border: 1px solid #cac4c4;
	border-radius: 3px;
	font-weight: 500;
	text-transform: capitalize;
	font-size: 16px;
	padding: 10px 20px;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.about-content-navs-tab .nav-tabs .nav-item button:hover{
	color: #003366;
	border-color: #003366;
}
.about-content-navs-tab .nav-tabs .nav-item button.active{
	background: #003366;
	color: #fff;
	border-color:#003366;
}
.about-content-navs-tab .tab-content {
	margin-top: 10px;
}
.about-content-navs-tab-content-full .title {
	width: 100%;
	overflow: hidden;
}
.about-content-navs-tab-content-full .title span {
	overflow: hidden;
	display: inline-block;
	font-size: 24px;
	text-transform: capitalize;
	font-weight: 600;
	padding-left: 10px;
}
.about-content-navs-tab-content-full .title h2 {
	display: inline-block;
	color: #003366;
	font-size: 50px;
	font-weight: 900;
	line-height: 1;
}
.about-content-navs-tab-content-full p {
	line-height: 28px;
	margin-bottom: 15px;
}
.about-content-navs-tab-content-full ul{
	margin-bottom: 15px;
}
.about-content-navs-tab-content-full ul li {
	line-height: 30px;
	font-weight: 600;
}
.about-content-navs-tab-content-full ul li i{
	color: #003366;
	padding-right: 3px;
}
.tab-pane.fade {
	transition: all 0.6s ease-out;
	transform: translateY(1rem);
}
.tab-pane.fade.show {
	transform: translateY(0rem);
}
.section-headding h5 {
	font-size: 14px;
	color: #003366;
	font-weight: 500;
	text-transform: uppercase;
}
.section-headding h2 {
	margin-top: 10px;
	font-weight: 700;
	line-height: 1.2;
	font-size: 32px;
}
/*
 * #-Info Box
*/
.info-box-1 {
	border: 1px solid #e7e7e7;
	padding: 50px 35px;
	background: #ffffff;
	position: relative;
	z-index: 1;
	overflow: hidden;
	text-align: center;
}
.info-box-1::before {
	content: "";
	width: 0;
	height: 2px;
	position: absolute;
	transition: all 0.2s linear;
	transition-delay: 0s;
	background: #003366;
	transition-delay: 0.2s;
	right: 0;
	top: 0;
}
.info-box-1::after {
	content: "";
	width: 0;
	height: 2px;
	position: absolute;
	transition: all 0.2s linear;
	transition-delay: 0s;
	background: #003366;
	transition-delay: 0.2s;
	left: 0;
	bottom: 0;
}
.info-box-1:hover::after {
	width: 100%;
	transition-delay: 0s;
}
.info-box-1:hover::before {
	width: 100%;
	transition-delay: 0s;
}
.info-box-1-inner:after{
	content: "";
	width: 2px;
	height: 0;
	position: absolute;
	transition: all 0.2s linear;
    transition-delay: 0s;
	background: #003366;
	transition-delay: 0s;
	right: 0;
	bottom: 0;
}
.info-box-1-inner:before{
	content: "";
	width: 2px;
	height: 0;
	position: absolute;
	transition: all 0.2s linear;
	transition-delay: 0s;
	background: #003366;
	transition-delay: 0s;
	top: 0;
	left: 0;
}
.info-box-1:hover .info-box-1-inner:before{
	transition-delay: 0.2s;
	height: 100%;
}
.info-box-1:hover .info-box-1-inner:after{
	transition-delay: 0.2s;
	height: 100%;
}
.info-box-1-inner .icon {
	width: 70px;
	height: 70px;
	background: #003366;
	margin: 0 auto;
	margin-bottom: 0px;
	margin-bottom: 30px;
	display: flex;
	justify-content: center;
	align-items: center;
	box-shadow: 0px 0px 10px 0px #dbd8d8;
	color: #fff;
	font-size: 26px;
}
.info-box-1 .number-c {
	position: absolute;
	top: -4px;
	right: 4px;
	font-size: 100px;
	line-height: 1;
	font-weight: 900;
	font-style: italic;
	-webkit-text-stroke-width: 1.5px;
	-webkit-text-stroke-color: #003366;
	color: transparent;
	opacity: .28;
}
.info-box-1 .content h3 {
	font-size: 22px;
	font-weight: 600;
	margin-bottom: 12px;
}
.info-box-1 .content h3 a{
	color: #0e1a1f;
}
.info-box-1 .content h3:hover a{
	color: #003366;
}
.info-box-1 .content p {
	line-height: 30px;
	margin-bottom: 20px;
}
.info-box-1 a.link {
	position: relative;
	font-weight: 600;
	text-transform: capitalize;
	font-style: italic;
	color: #333;
	font-size: 16px;
}
.info-box-1 a.link::after {
	content: "";
	clear: both;
	display: block;
	position: absolute;
	width: 50%;
	height: 2px;
	background: #003366;
	bottom: 0px;
	left: 0;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.info-box-1 a.link:hover{
	color: #003366;
}
.info-box-1 a.link:hover::after{
	width: 100%;
}
/*Info Box 2*/
.info-box-2 {
	width: 100%;
	overflow: hidden;
	border: 5px solid #e7e7e7;
	padding: 50px 35px;
	position: relative;
	border-radius: 10px;
	transition: all .4s ease-in-out;
}
.info-box-2 .content-top .icon {
	font-size: 50px;
	color: #003366;
}
.info-box-2 .content-top .con p {
	line-height: 30px;
	margin-bottom: 15px;
}
.info-box-2 .content-top .con a {
	display: flex;
	justify-content: center;
	align-items: center;
	background: #0033663d;
	width: 35px;
	height: 35px;
	border-radius: 50%;
	color: #003366;
}
.info-box-2 .content-top .con h2 {
	font-size: 20px;
	font-weight: 600;
	text-transform: capitalize;
	line-height: 1.2;
	margin-top: 2px;
	margin-bottom: 10px;
}
.info-box-2 .content-overly {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: #003366;
	display: flex;
	align-items: center;
	justify-content: center;
	transform: scale(1.4);
	transition: all .4s ease-in-out;
	opacity: 0;
}
.info-box-2:hover .content-overly{
	opacity: 1;
	transform: scale(1.0);
}
.info-box-2:hover{
	border-color: #003366;
}
.content-overly-full {
	text-align: center;
	padding: 30px 30px;
}
.content-overly-full h2 {
	font-size: 20px;
	font-weight: 700;
	color: #fff;
	line-height: 1.2;
	margin-bottom: 10px;
}
.content-overly-full p {
	color: #cecdcd;
	margin-bottom: 12px;
}
.content-overly-full a {
	display: inline-block;
	width: 100%;
	padding: 15px 20px;
	background: #4608f7;
	text-transform: capitalize;
	font-weight: 600;
	color: #fff;
	border-radius: 10px;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.content-overly-full a:hover{
	background: #0e1a1f;
}
/*
 * #-Works About
*/
.works-about-area {
	width: 100%;
	overflow: hidden;
	position: relative;
	z-index: 1;
}
.works-about-area::after {
	content: "";
	clear: both;
	display: block;
	position: absolute;
	width: 80%;
	height: 100%;
	background: #003366;
	z-index: -1;
	top: 0;
	left: 0;
}
.video-btn a {
	background: #fff;
	height: 100px;
	width: 100px;
	text-align: center;
	border-radius: 50%;
	line-height: 100px;
	font-size: 30px;
	-webkit-transition: .5s -webkit-animation ripple-red 1s linear infinite;
	animation: ripple-red 1s linear infinite;
	-webkit-transition: .5s;
	display: flex;
	margin: 0 auto;
	align-items: center;
	justify-content: center;
	color: #003366;
}
@-webkit-keyframes ripple-red {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.3), 0 0 0 10px rgba(255, 255, 255, 0.3), 0 0 0 20px rgba(255, 255, 255, 0.3);
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.3), 0 0 0 10px rgba(255, 255, 255, 0.3), 0 0 0 20px rgba(255, 255, 255, 0.3)
    }
    100% {
        -webkit-box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.3), 0 0 0 20px rgba(255, 255, 255, 0.3), 0 0 0 30px rgba(255, 255, 255, 0);
        box-shadow: 0 0 0 10px rgba(255, 255, 255, 0.3), 0 0 0 20px rgba(255, 255, 255, 0.3), 0 0 0 30px rgba(2241, 42, 2, 0)
    }
}
.video-btn span {
	display: none;
}
.works-about-content h5 {
	font-size: 14px;
	color: #fff;
	font-weight: 500;
	text-transform: uppercase;
}
.works-about-thumbanil {
	position: relative;
}
.works-about-thumbanil img{
	width: 100%;
}
.works-about-vedio {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	display: flex;
	width: 100%;
	height: 100%;
	align-items: center;
	justify-content: center;
	background: #33333375;
}
.works-about-content h2 {
	margin-top: 10px;
	margin-bottom: 20px;
	font-weight: 700;
	line-height: 1.2;
	font-size: 32px;
	color: #fff;
}
.works-about-content p {
	line-height: 28px;
	color: #ffff;
	margin-bottom: 20px;
}
.works-about-content ul {
	margin-bottom: 20px;
}
.works-about-content ul li {
	line-height: 30px;
	color: #fff;
	font-weight: 600;
}
.works-about-content a{
	background: #fff;
}
.works-about-content ul li i {
	padding-right: 5px;
}
.latest-project-area .row {
	width: 100%;
	margin: 0;
	padding: 0;
}
.latest-project-area .col-lg-4.col-md-6 {
	margin: 0;
	padding: 0;
}
.project-item {
	position: relative;
	width: 100%;
	overflow: hidden;
}
.project-item .thumbnail img {
	width: 100%;
	-webkit-transition: all .4s ease-in-out;
	transition: all .7s ease-in-out;
}
.project-item:hover .thumbnail img{
	transform: scale(1.2);
}
.project-item .info {
	position: relative;
	z-index: 1;
}
.project-item .info .info-item {
	position: absolute;
	left: 30px;
	right: 60px;
	bottom: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: #ffffff;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
	transition: all 0.35s ease-in-out;
	opacity: 0;
}
.project-item:hover .info .info-item{
	opacity: 1;
	bottom: 30px;
}
.project-item .info .info-item .left-info {
	padding: 20px 30px;
	padding-right: 100px;
}
.project-item .info .info-item .left-info h4 {
	font-weight: 600;
	margin-bottom: 7px;
	font-size: 18px;
	text-transform: capitalize;
}
.project-item .info .info-item .left-info h4 a{
	color: #333;
}
.project-item .info .info-item .left-info h4:hover a{
	color: #003366;
}
.project-item .info .info-item .left-info a.cat {
	color: #666;
	font-size: 14px;
	text-transform: capitalize;
	font-weight: 500;
}
.project-item .info .info-item .right-info a {
	display: inline-block;
	padding: 0 30px;
	background: #086AD8;
	color: #ffffff;
	position: absolute;
	height: 80%;
	right: -30px;
	top: 10%;
	display: flex;
	align-items: center;
	font-size: 18px;
}
/*
 * Counter
*/
.counter-area {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.counter-item {
	display: flex;
	width: 100%;
	overflow: hidden;
}
.counter-item .icon {
	float: left;
	font-size: 30px;
	color: #fff;
	padding-right: 10px;
	padding-top: 8px;
}
.counter-item .content {
	overflow: hidden;
}
.counter-item .content .title {
	display: flex;
}
.counter-item .content p {
	color: #fff;
	font-weight: 600;
	text-transform: capitalize;
}
.counter-item .content .title .counter {
	display: inline-block;
	color: #fff;
	font-size: 36px;
	font-weight: 700;
}
.counter-item .content .title h3 {
	display: inline-block;
	padding-top: 2px;
	padding-left: 5px;
	color: #fff;
	font-size: 30px;
}
.web-prodive {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	position: relative;
	z-index: 1;
	padding-top: 150px;
	padding-bottom: 200px;
	background-attachment: fixed;
}
.web-prodive::after {
	content: "";
	clear: both;
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: #0033669c;
	z-index: -1;
}
.we-provide-content h2 {
	font-size: 36px;
	font-weight: 700;
	color: #fff;
	line-height: 1.2;
	margin-top: 50px;
	padding-bottom: 20px;
}
.we-provide-content a{
	background: #fff;
}
.we-provide-content p {
	color: #fff;
	font-size: 18px;
	line-height: 30px;
	max-width: 600px;
	margin: 0 auto;
	margin-bottom: 30px;
}
.progress {
    height: 20px;
    padding-top: 5px;
    background: #f6f6f6;
    border-radius: 0 10px 10px 0;
    overflow: visible;
}
.progress-bar {
	height: 10px;
    border-radius: 0 5px 5px 0;
    background-color: #222222;
    position: relative;
    overflow: visible;
    animation: animate 3s ease 0s 1 normal;    
    opacity: 1;
}
@keyframes animate{
	0%{
		width: 0%;
	}
}
.progress-bar .percent {
    position: absolute;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    background-color: #333;
    border-radius: 5px;
    top: -45px;
    right: -10px;
}
.progress .progress-bar .percent::after {
    position: absolute;
    content: '';
    top: 30px;
    left: 10px;
    border-top: 5px solid #333;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
}
.testimonial-item img {
	width: auto !important;
}
.testimonial-area-full {
	background: #003366;
	margin-top: -100px;
	z-index: 1;
	position: relative;
}
.what-we-do-c {
	padding: 50px 50px;
}
.what-we-do-c h5 {
	font-size: 14px;
	color: #fff;
	font-weight: 500;
	text-transform: uppercase;
}
.what-we-do-c h2 {
	margin-top: 10px;
	margin-bottom: 20px;
	font-weight: 700;
	line-height: 1.2;
	font-size: 32px;
	color: #fff;
}
.single-progress {
	margin-bottom: 20px;
}
.single-progress h3 {
	font-size: 18px;
	text-transform: capitalize;
	font-weight: 600;
	color: #fff;
	margin-bottom: 10px;
}
.single-progress .progress {
	background: transparent;
}
.testimonial-item-full {
	background-size: cover;
	background-repeat: no-repeat;
	text-align: center;
	position: relative;
	z-index: 1;
	height: 100%;
	display: flex !important;
	align-items: center;
}
.testimonial-item-full::after {
	content: "";
	clear: both;
	display: block;
	position: absolute;
	width: 100%;
	top: 0;
	left: 0;
	height: 100%;
	background: #003366e8;
	z-index: -1;
}
.testimonial-item {
	padding: 50px;
	margin-bottom: 20px;
}
.testimonial-item .thumbnail {
	margin-bottom: 30px;
}
.testimonial-item .thumbnail img {
	width: 100px;
	border-radius: 50%;
	border: 8px solid #fff;
	border-left-color: rebeccapurple;
	border-right-color: #ff3c61;
	border-bottom-color: #0e1a1f;
	margin: 0 auto;
	box-sizing: border-box;
}
.testimonial-item .content p {
	color: #fff;
	line-height: 30px;
	font-style: italic;
	font-size: 18px;
	margin-bottom: 30px;
}
.ratting {
	margin-bottom: 6px;
	color: #fff;
}
.testimonial-item .content h4 {
	color: #fff;
	font-weight: 500;
	text-transform: uppercase;
	font-size: 18px;
}
.testimonial-item .content h5 {
	color: #fff;
	font-size: 14px;
	text-transform: capitalize;
	font-weight: 400;
	margin-top: 4px;
}
.testimonial-item-full .owl-dots {
	position: absolute;
	counter-reset: dots;
	text-align: center;
	left: 0;
	right: 0;
	bottom: 20px;
}
.testimonial-item-full .owl-dots .owl-dot {
	margin: 0 6px;
	border: 0;
	background: none;
	cursor: pointer;
}
.testimonial-item-full .owl-dots .owl-dot span {
	display: block;
	border-radius: 50%;
	background-color: #fff;
	width: 12px;
	height: 12px;
	position: relative;
	transition: all 0.3s ease;
}
.testimonial-item-full .owl-dots .owl-dot span::after {
	position: absolute;
	content: "";
	top: -5px;
	left: -5px;
	border: 1px solid #fff;
	border-radius: 50%;
	width: calc(100% + 10px);
	height: calc(100% + 10px);
	transform: scale(0);
	transition: all 0.3s ease;
}
.testimonial-item-full .owl-dots .owl-dot.active span{
	background:#fff;
}
.testimonial-item-full .owl-dots .owl-dot.active span::after {
	transform: scale(1);
}
/*
 * #-Blog
*/
.blog-item {
	width: 100%;
	box-sizing: border-box;
	box-shadow: 0px 0px 14px 0px #ccc6c657;
	border-radius: 5px;
}
.blog-item .thumbnail {
	width: 100%;
	overflow: hidden;
}
.blog-item .thumbnail img{
	width: 100%;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease;
}
.blog-item:hover .thumbnail img{
	transform: scale(1.12);
}
.blog-item .content {
	padding: 25px 20px;
}
.blog-item .content .meta {
	margin-bottom: 15px;
}
.blog-item .content .meta span {
	padding-right: 20px;
	font-size: 14px;
	color: #666;
}
.blog-item .content .meta span:last-child{
	padding-right: 0px;
}
.blog-item .content .meta span a{
	color: #666;
}
.blog-item .content .meta span i{
	color: #003366;
}
.blog-item .content .meta span:hover a{
	color: #003366;
}
.blog-item .content h2.title {
	margin-bottom: 15px;
	font-weight: 700;
	font-size: 22px;
	line-height: 1.2;
}
.blog-item .content h2.title a{
	color: #0e1a1f;
}
.blog-item .content h2.title:hover a{
	color: #003366;
}
.blog-item .content p {
	margin-bottom: 30px;
	line-height: 30px;
}
.blog-item .content .author img {
	width: 45px;
	border-radius: 50%;
	border: 3px solid #848484;
	margin-right: 5px;
}
.blog-item .content .author span {
	color: #333;
	font-size: 14px;
	text-transform: capitalize;
}
.blog-item .content .author a:hover span{
	color: #003366;
}
/*
 * #-Subscribe Form
*/
.subscribe-area {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: left center;
	position: relative;
	z-index: 1;
}
.subscribe-area::after {
	content: "";
	clear: both;
	display: block;
	position: absolute;
	width: 70%;
	height: 100%;
	background: #003366;
	top: 0;
	left: 0;
	z-index: -1;
	clip-path: polygon(0 1%, 62% 0, 90% 100%, 0% 100%);
}
.subscribe-area::before {
	content: "";
	clear: both;
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	background: #003366b5;
	top: 0;
	right: 0;
	z-index: -1;
}
.subscribe-content h2 {
	font-size: 30px;
	font-weight: 700;
	text-transform: capitalize;
	line-height: 1.2;
	margin-bottom: 10px;
	color: #fff;
}
.subscribe-content p {
	font-size: 16px;
	color: #fff;
	line-height: 30px;
}
.subscribe-form {
	width: 100%;
	position: relative;
}
.subscribe-form input {
	width: 100%;
	height: 50px;
	padding: 0px 20px;
	border: none;
	position: relative;
}
.subscribe-form button {
	position: absolute;
	top: 0;
	right: 0;
	border: none;
	height: 100%;
	padding: 0px 30px;
	font-size: 20px;
	background: #ff205f;
	color: #fff;
}
/*
 * #-Footer
*/
.footer {
	background: #0e1a1f;
}
.footer-widgets-single h2.title {
	color: #fff;
	font-size: 18px;
	text-transform: capitalize;
	font-weight: 600;
	margin-bottom: 25px;
}
.footer-widgets-single p {
	line-height: 30px;
	color: #ccc;
	margin-bottom: 20px;
}
.footer-call-btn {
	background: #260c73;
	padding: 20px;
	border-radius: 30px;
	overflow: hidden;
}
.footer-call-btn .icon {
	float: left;
	font-size: 30px;
	color: #fff;
	background: #003366;
	width: 60px;
	height: 60px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 50px;
	margin-right: 10px;
}
.footer-call-btn .con {
	overflow: hidden;
}
.footer-call-btn .con p {
	line-height: 20px;
	font-size: 14px;
	color: #fff;
	margin: 0px;
	padding-bottom: 7px;
}
.footer-call-btn .con span {
	font-size: 18px;
	font-weight: 700;
	color: #fff;
}
.f-w-l-blog .single {
	margin-bottom: 20px;
	width: 100%;
	overflow: hidden;
}
.f-w-l-blog .single:last-child{
	margin-bottom: 0px;
}
.f-w-l-blog .single .thumbnail {
	width: 80px;
	float: left;
	height: 75px;
	margin-right: 8px;
}
.f-w-l-blog .single .thumbnail img {
	width: 100%;
	height: 100%;
}
.f-w-l-blog .single .cont {
	overflow: hidden;
}
.f-w-l-blog .single .cont h4 {
	font-size: 16px;
	line-height: 1.3;
	margin-bottom: 8px;
	font-weight: 600;
}
.f-w-l-blog .single .cont h4 a{
	color: #fff;
}
.f-w-l-blog .single .cont span {
	font-size: 15px;
	color: #797979;
}
.footer-widgets-single ul li {
	line-height: 34px;
	padding: 4px 0px;
}
.footer-widgets-single ul li a {
	display: inline-block;
	color: #ccc;
	font-weight: 400;
	position: relative;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.footer-widgets-single ul li a::after {
	content: "//";
	clear: both;
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	letter-spacing: 0px;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
	opacity: 0;
	visibility: hidden;
	font-size: 12px;
}
.footer-widgets-single ul li a:hover {
	color: #fff;
	padding-left: 15px;
}
.footer-widgets-single ul li a:hover::after {
	opacity: 1;
	visibility: visible;
}
.footer-bottom {
	border-top: 1px solid #373737;
}
.copy-text p {
	color: #ccc;
	font-size: 15px;
}
.copy-text p a{
	font-weight: 500;
	color: #ccc;
}
.copy-text p a:hover{
	color: #fff;
}
/*
 * #-Hero Banner
*/
.hero-banner-area {
	padding: 100px 0px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	position: relative;
	z-index: 1;
	padding-bottom: 135px;
}
.hero-banner-area::after {
	content: "";
	clear: both;
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: -1;
	background: #0e1a1f3b;
}
.hero-banner-content h4 {
	text-transform: uppercase;
	font-weight: 600;
	color: #fff;
	font-size: 26px;
	margin-bottom: 10px;
}
.hero-banner-content h2 {
	font-size: 65px;
	text-transform: capitalize;
	font-weight: 700;
	line-height: 1.1;
	margin-bottom: 20px;
	color: #fff;
}
.hero-appointment-form {
	text-align: center;
	background: #fff;
	position: relative;
	box-sizing: border-box;
	padding: 50px 30px;
	z-index: 1;
	background: #0e1a1f;
}
.hero-appointment-form::after {
	content: "";
	clear: both;
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	background: #003366;
	top: 0;
	left: 0;
	z-index: -1;
	clip-path: polygon(100% 0%, 100% 50%, 100% 100%, 0 100%, 0 0, 50% 50%);
}
.hero-appointment-form h2 {
	font-size: 30px;
	color: #fff;
	text-transform: capitalize;
	font-weight: 700;
	margin-bottom: 20px;
}
.hero-appointment-form input {
	width: 100%;
	margin-bottom: 20px;
	border: none;
	padding: 20px;
	font-weight: 600;
	text-transform: capitalize;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.hero-appointment-form button {
	width: 100%;
	border: 0px;
	box-shadow: none;
	padding: 20px;
}
.themetechmount-area-full {
	background: #003366;
	margin-top: -50px;
	z-index: 1;
	position: relative;
	padding: 0px 10px;
}
.themetechmount-item {
	padding: 20px 10px;
	overflow: hidden;
}
.themetechmount-item.active {
	background: #003366;
}
.themetechmount-item .icon {
	float: left;
	width: 55px;
	height: 55px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #0e1a1f;
	color: #fff;
	font-size: 20px;
	margin-right: 10px;
}
.themetechmount-item .content {
	overflow: hidden;
}
.themetechmount-item .content h4 {
	font-size: 20px;
	color: #fff;
	font-weight: 700;
	line-height: 1.2;
	margin-bottom: 4px;
}
.themetechmount-item .content p {
	font-size: 14px;
	color: #b0b0b0;
}
.latest-project-slider {
	width: 100%;
	overflow: hidden;
}
.latest-projects-slider-full .owl-nav .owl-prev {
	position: absolute;
	top: 48%;
	left: 10px;
}
.latest-projects-slider-full .owl-nav .owl-next {
	position: absolute;
	top: 48%;
	right: 10px;
}
.latest-p-slider-arrow {
	display: flex;
	background: #003366;
	width: 35px;
	height: 35px;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 20px;
}
/*
 * #-Pricing Plane
*/
.pricing-item {
	box-shadow: 0px 0px 30px 0px hsl(0deg 0% 0% / 7%);
	text-align: center;
	box-sizing: border-box;
	padding: 12px;
	border-radius: 5px;
}
.pricing-header {
	background: #00336642;
	border-radius: 5px;
	padding: 20px 0px;
	margin-bottom: 20px;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease;
}
.pricing-item:hover .pricing-header{
	background: #003366;
}
.pricing-header h4 {
	text-transform: uppercase;
	font-weight: 600;
	font-size: 18px;
	line-height: 1.2;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease;
}
.pricing-item:hover .pricing-header h4{
	color: #fff;
}
.pricing-header h2 {
	color: #003366;
	font-size: 40px;
	font-weight: 700;
	line-height: 1.2;
	margin-top: 10px;
	margin-bottom: 10px;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease;
}
.pricing-item:hover .pricing-header h2{
	color: #fff;
}
.pricing-header h2 span {
	font-size: 20px;
}
.pricing-header p {
	font-weight: 500;
	text-transform: capitalize;
	font-size: 16px;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease;
}
.pricing-item:hover .pricing-header p{
	color: #fff;
}
.pricing-content {
	padding-bottom: 20px;
}
.pricing-content ul {
	margin-bottom: 20px;
}
.pricing-content ul li {
	line-height: 34px;
	padding: 10px 0px;
	color: #0e1a1f;
}
.pricing-btn {
	background: #0033664f;
	color: #0e1a1f;
	text-transform: capitalize;
	font-weight: 500;
	padding: 15px 30px;
	display: inline-block;
	border-radius: 40px;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.pricing-btn:hover{
	color: #fff;
	background: #003366;
}
/*
 * Breadcrumb
*/
.breadcrumb-area {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	padding: 200px 0px;
	position: relative;
	z-index: 1;
}
.breadcrumb-area::after {
	content: "";
	clear: both;
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,.3);
	top: 0;
	left: 0;
	z-index: -1;
}
.breadcrumb-content h2 {
	text-transform: capitalize;
	font-weight: 700;
	color: #fff;
	font-size: 50px;
	letter-spacing: 1.2px;
}
/*
 * #-Team
*/
.team-item {
	width: 100%;
	overflow: hidden;
	position: relative;
}
.team-item .content {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	background: #003366;
	text-align: center;
	padding: 15px 10px;
	border-top-left-radius: 60px;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.team-item:hover .content{
	border-radius: 0px;
}
.team-item .content h2 {
	font-size: 20px;
	color: #fff;
	text-transform: capitalize;
	font-weight: 600;
	line-height: 1.2;
	margin-bottom: 5px;
}
.team-item .content p {
	color: #fff;
	font-size: 16px;
	text-transform: capitalize;
}
.team-item .team-social {
	position: absolute;
	top: 14%;
	right: 10px;
	bottom: 0;
	height: 100%;
	-webkit-transition: all .4s ease-in-out;
	transition: all .6s ease-in-out;
	transform: translateY(100%);
}
.team-item:hover .team-social{
	transform: translateY(0);
}
.team-item .team-social ul li a i{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 40px;
	height: 40px;
	background: #084f99;
	color: #fff;
	font-size: 14px;
	border-radius: 2px;
}
.team-item .team-social ul li a i.fa-twitter {
	background: #1da1f2;
}
.team-item .team-social ul li a i.fa-instagram {
	background: radial-gradient(circle farthest-corner at 32% 106%,#ffe17d 0,#ffcd69 10%,#fa9137 28%,#eb4141 42%,transparent 82%),linear-gradient(135deg,#234bd7 12%,#c33cbe 58%);
}
.team-item .team-social ul li a i.fa-linkedin {
	background: #0e76a8;
}
.team-item .team-social ul li a {
	margin: 3px 0px;
	display: inline-block;
}
/*
 * #-Contact Form
*/
.contact-form h2 {
	font-size: 30px;
	font-weight: 700;
	margin-bottom: 20px;
}
.contact-form .single-input {
	position: relative;
	width: 100%;
	margin-bottom: 25px;
}
.contact-form input {
	width: 100%;
	padding: 20px;
	border: 2px solid #eee;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.contact-form textarea {
	width: 100%;
	padding: 20px;
	border: 2px solid #eee;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
	height: 160px;
}
.contact-form input:focus{
	border-color: #003366;
}
.contact-form textarea:focus{
	border-color: #003366;
}
.contact-form .single-input i {
	position: absolute;
	top: 22px;
	right: 10px;
	color: #003366;
}
.contact-form button {
	padding: 20px 40px;
}
.contact-form-info {
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center center;
	position: relative;
	z-index: 1;
	padding: 40px 30px;
}
.contact-form-info::after {
	content: "";
	clear: both;
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: -1;
	background: rgb(94, 44, 237,.8);
}
.contact-form-info h2 {
	font-size: 30px;
	font-weight: 700;
	color: #fff;
	line-height: 1.1;
	text-transform: capitalize;
	margin-bottom: 20px;
}
.contact-info-list .item {
	width: 100%;
	overflow: hidden;
}
.contact-info-list .item .icon {
	width: 50px;
	height: 50px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #fff;
	border-radius: 50%;
	color: #5f3afc;
	margin-right: 10px;
	float: left;
}
.contact-info-list .item .content {
	overflow: hidden;
}
.contact-info-list .item .content h4 {
	font-size: 16px;
	text-transform: capitalize;
	font-weight: 600;
	color: #fff;
}
.contact-info-list p {
	margin: 0;
	color: #ddd;
	font-size: 14px;
}
/*
 * #-Services Details
*/
.services-details img {
	width: 100%;
}
.services-details .content h2 {
	font-size: 24px;
	margin-top: 20px;
	font-weight: 700;
	margin-bottom: 10px;
}
.services-details .content p {
	line-height: 30px;
	margin-bottom: 15px;
}
.counter-item.counter-item-2 .icon {
	color: #003366;
}
.counter-item.counter-item-2 .content .title .counter {
	color: #333;
	margin: 0;
}
.counter-item.counter-item-2 .content .title h3 {
	color: #0e1a1f;
	margin: 0;
}
.counter-item.counter-item-2 .content p {
	color: #333;
	margin: 0;
}
.services-details .content h3 {
	font-size: 20px;
	font-weight: 700;
	text-transform: capitalize;
	margin-bottom: 15px;
}
.services-details .content ul li {
	line-height: 30px;
	padding: 4px 0px;
	display: inline-block;
}
.services-details .content ul li i{
	padding-right: 3px;
	color: #003366;
}
.accordion-item {
	border: 2px solid #eee;
	border-bottom: none;
}
.accordion-item:last-child{
	border-bottom: 2px solid #eee;
}
.accordion-item .accordion-header {
	line-height: 1;
	margin: 0;
	padding: 0;
}
.accordion-item .accordion-header a {
	font-size: 16px;
	width: 100%;
	display: inline-block;
	color: #333;
	padding: 20px 20px;
	font-weight: 500;
	text-transform: capitalize;
	position: relative;
}
.accordion-item .accordion-header a::after {
	content: "-";
	clear: both;
	overflow: hidden;
	position: absolute;
	top: 14px;
	right: 10px;
	width: 30px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #003366;
	color: #fff;
	font-size: 20px;
	height: 30px;
}
.accordion-item .accordion-header a.collapsed::after{
	content: "+";
}
.accordion-item .accordion-body {
	border: none;
	padding: 15px 20px;
	border-top: 2px solid #eee;
}
.accordion-item .accordion-collapse {
	border: none;
}
.accordion-item .accordion-body p {
	line-height: 30px;
	color: #666;
	margin-bottom: 10px;
}
h2.accordion-header {
	padding: 0 !important;
	margin: 0 !important;
}
.services-wi-category {
	box-sizing: border-box;
	padding: 25px 20px;
	box-shadow: 0px 0px 10px 0px #d9d7d7;
}
.services-wi-category ul li {
	display: inline-block;
	width: 100%;
	line-height: 1.2;
	padding: 4px 0px;
}
.services-wi-category ul li a i {
	border-right: 1px solid #eee;
	height: 100%;
	padding: 20px 20px;
	background: #003366;
	color: #fff;
}
.services-wi-category ul li a {
	border: 1px solid #eee;
	width: 100%;
	display: inline-block;
	position: relative;
	z-index: 1;
	color: #333;
	text-transform: capitalize;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease;
}
.services-wi-category ul li a::after {
	content: "";
	clear: both;
	display: block;
	position: absolute;
	width: 0%;
	height: 100%;
	background: #003366;
	top: 0;
	left: 0;
	z-index: -1;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease;
}
.services-wi-category ul li a:hover:after{
	width: 100%;
}
.services-wi-category ul li a:hover{
	color: #fff;
}
.services-wi-category ul li a.active:after{
	width: 100%;
}
.services-wi-category ul li a.active{
	color: #fff;
}
.faq-area-vedio {
	padding-top: 150px;
	padding-bottom: 150px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	position: relative;
	z-index: 1;
}
.faq-area-vedio::after {
	content: "";
	clear: both;
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, .35);
	z-index: -1;
}
.error-404-content h2 {
	font-size: 50px;
	font-weight: 700;
	text-transform: capitalize;
	margin-top: 30px;
	margin-bottom: 10px;
}
.error-404-content p {
	font-size: 20px;
	margin-bottom: 30px;
}
.portfolio-cate-list-full ul li {
	display: inline-block;
	cursor: pointer;
	border: 1px solid #eee;
	padding: 10px 20px;
	text-transform: capitalize;
	font-weight: 500;
	margin: 4px 4px;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.portfolio-cate-list-full ul li:hover {
	border-color: #003366;
	color: #003366;
	background: #0033662e;
}
.portfolio-cate-list-full ul li.mixitup-control-active {
	background: #003366;
	color: #fff;
	border-color: #003366;
}
.project-details-content h2 {
	margin-top: 20px;
	text-transform: capitalize;
	font-weight: 600;
	margin-bottom: 20px;
	font-size: 30px;
}
.project-details-content p {
	line-height: 30px;
	margin-bottom: 20px;
}
.project-details-info {
	padding: 20px;
	box-sizing: border-box;
	box-shadow: 0px 0px 10px 0px #eee;
}
.project-details-info h2 {
	font-size: 20px;
	font-weight: 600;
	text-transform: capitalize;
	margin-bottom: 10px;
}
.project-details-info p {
	line-height: 30px;
	margin-bottom: 15px;
}
.project-details-info ul li {
	line-height: 30px;
	padding: 14px 0px;
	width: 100%;
	border-bottom: 1px solid #eee;
}
.project-details-info ul li span {
	text-align: right;
	float: right;
}
.prject-share span {
	display: inline-block;
	margin: 0px 2px;
}
.prject-share span a{
	display: inline-block;
}
.prject-share span a i{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 30px;
	height: 30px;
	background: #084f99;
	color: #fff;
	font-size: 14px;
	border-radius: 2px;
}
.prject-share span a i.fa-twitter {
	background: #1da1f2;
}
.prject-share span a i.fa-instagram {
	background: radial-gradient(circle farthest-corner at 32% 106%,#ffe17d 0,#ffcd69 10%,#fa9137 28%,#eb4141 42%,transparent 82%),linear-gradient(135deg,#234bd7 12%,#c33cbe 58%);
}
.prject-share span a i.fa-linkedin {
	background: #0e76a8;
}
/*
 * Pagination
*/
.blog-pagination ul li {
	display: inline-block;
	margin: 4px 2px;
}
.blog-pagination ul li a {
	display: flex;
	width: 40px;
	height: 40px;
	justify-content: center;
	align-items: center;
	border: 1px solid #eee;
	color: #444;
	font-weight: 600;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease;
}
.blog-pagination ul li span {
	display: flex;
	width: 40px;
	height: 40px;
	justify-content: center;
	align-items: center;
	border: 1px solid #eee;
	color: #fff;
	font-weight: 600;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease;
	background: #003366;
	border-color: #003366;
}
.blog-pagination ul li a:hover{
	color: #fff;
	background: #003366;
	border-color: #003366;
}
/*
 * #-Widgets
*/
.widets-single {
	box-shadow: 0px 0px 14px 0px #ccc6c657;
	padding: 30px;
}
.wi-search-form form {
	width: 100%;
	position: relative;
}
.wi-search-form form input {
	width: 100%;
	height: 50px;
	border-radius: 0px;
	border: 1px solid #eee;
	padding: 0px 20px;
	font-weight: 500;
	text-transform: capitalize;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.wi-search-form form input:focus{
	border-color: #003366;
}
.wi-search-form form button {
	border: none;
	background: #003366;
	color: #fff;
	position: absolute;
	top: 0;
	height: 100%;
	right: 0;
	padding: 0px 15px;
}
.widets-single h2.title {
	font-size: 18px;
	text-transform: capitalize;
	margin-bottom: 12px;
	font-weight: 600;
	position: relative;
}
.widets-single h2.title::after {
	content: "";
	clear: both;
	display: block;
	position: absolute;
	width: 10px;
	height: 6px;
	background: #0e1a1f;
	top: 6px;
	left: -30px;
}
.widets-single ul li {
	line-height: 30px;
	padding: 6px 0px;
	border-bottom: 1px solid #eee;
}
.widets-single ul li:last-child{
	border-bottom: 0px;
}
.widets-single ul li a {
	font-weight: 400;
	font-size: 14px;
	color: #444;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.widets-single ul li a i {
	padding-right: 5px;
	font-size: 10px;
}
.widets-single ul li a:hover{
	color: #003366;
}
.side-widgets-l-blog .item {
	width: 100%;
	overflow: hidden;
	position: relative;
}
.side-widgets-l-blog .item .thubnail {
	width: 80px;
	height: 70px;
	float: left;
}
.side-widgets-l-blog .item .thubnail img{
	width: 100%;
	height: 100%;
}
.side-widgets-l-blog .item .content {
	overflow: hidden;
	padding-left: 10px;
}
.side-widgets-l-blog .item .content h4 {
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
	margin-bottom: 4px;
}
.side-widgets-l-blog .item .content h4 a{
	color: #333;
}
.side-widgets-l-blog .item:hover .content h4 a{
	color: #003366;
}
.side-widgets-l-blog .item .content span {
	padding-top: 4px;
	display: block;
	font-size: 14px;
}
.tagcloud a {
	display: inline-block;
	border: 1px solid #eee;
	padding: 8px 14px;
	margin: 4px 3px;
	color: #333;
	text-transform: uppercase;
	font-size: 13px;
	font-weight: 600;
	background: #0033660a;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.tagcloud a:hover{
	color: #fff;
	border-color: #003366;
	background: #003366;
}
.blog-details {
	box-shadow: 0px 0px 14px 0px #ccc6c657;
}
.blog-details img{
	width: 100%;
}
.blog-details .content {
	padding: 30px 20px;
}
.blog-details .content .meta {
	margin-bottom: 20px;
}
.blog-details .content .meta span {
	padding-right: 20px;
	font-size: 14px;
	color: #666;
}
.blog-details .content .meta span:last-child {
	padding-right: 0px;
}
.blog-details .content .meta span i {
	color: #003366;
}
.blog-details .content .meta span a {
	color: #666;
}
.blog-details .content h2 {
	font-size: 24px;
	text-transform: capitalize;
	font-weight: 700;
	margin-bottom: 10px;
}
.blog-details .content p {
	line-height: 30px;
	margin-bottom: 20px;
	font-size: 16px;
}
.comments-list-full, .comments-form-full{
	padding: 30px;
	box-shadow: 0px 0px 14px 0px #ccc6c657;
}
.comments-list-full h2, .comments-form-full h2{
	font-size: 22px;
	font-weight: 700;
	text-transform: capitalize;
	margin-bottom: 30px;
}
.comments-list-full ul li {
	margin-bottom: 30px;
	overflow: hidden;
	position: relative;
	padding-left: 85px;
}
.comments-list-full ul li ul.comment-reply li {
	margin-top: 30px;
	overflow: hidden;
	width: 100%;
	margin-bottom: 0px;
}
.comments-list-full ul li .thum {
	width: 70px;
	position: absolute;
	top: 0;
	left: 0;
}
.comments-list-full ul li .content h4 {
	font-size: 16px;
	text-transform: capitalize;
	font-weight: 500;
}
.comments-list-full ul li .content h4 a {
	color: #0e1a1f;
}
.comments-list-full ul li .content span {
	font-size: 12px;
}
.comments-list-full ul li .content p {
	width: 100%;
	line-height: 28px;
	color: #666;
	font-size: 14px;
}
.comments-list-full ul li .content a.reply {
	display: inline-block;
	color: #333;
	text-transform: capitalize;
	border: 1px solid #eee;
	margin-top: 10px;
	border-radius: 50px;
	padding: 5px 20px;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.comments-list-full ul li .content a.reply:hover{
	color: #003366;
	border-color: #003366;
}
.comments-form-full textarea {
	width: 100%;
	margin-bottom: 20px;
	border: 1px solid #eee;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
	height: 160px;
	padding: 20px;
}
.comments-form-full input {
	width: 100%;
	margin-bottom: 20px;
	border: 1px solid #eee;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
	padding: 20px;
}
.comments-form-full textarea:focus{
	border-color: #003366;
}
.comments-form-full input:focus{
	border-color: #003366;
}
.comments-form-full button{
	padding: 20px 40px;
}
/*
 * #-Mobile Menu
*/
.off_canvars_overlay {
  width: 100%;
  height: 100%;
  position: fixed;
  z-index: 999;
  opacity: 0;
  visibility: hidden;
  cursor: crosshair;
  background: #232323;
  top: 0;
}
.off_canvars_overlay.active {
  opacity: 0.5;
  visibility: visible;
}
.offcanvas_menu {
  display: none;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .offcanvas_menu {
    display: block;
  }
}
@media only screen and (max-width: 767px) {
  .offcanvas_menu {
    display: block;
  }
}
.offcanvas_menu_wrapper {
	width: 290px;
	position: fixed;
	background: #fff;
	z-index: 999;
	top: 0;
	height: 100vh;
	transition: .5s;
	left: 0;
	margin-left: -300px;
	padding: 20px 0px 30px;
	overflow-y: auto;
}
.offcanvas_menu_wrapper.active {
  margin-left: 0;
}
.offcanvas_menu_wrapper .slinky-theme-default {
  background: inherit;
  min-height: 300px;
  overflow-y: auto;
}
.offcanvas_menu_wrapper .header_search_box {
  display: block;
}
.offcanvas_main_menu > li.menu-item-has-children.menu-open > span.menu-expand {
  transform: rotate(180deg);
}
.offcanvas_main_menu > li ul li.menu-item-has-children.menu-open span.menu-expand {
  transform: rotate(180deg);
}
.offcanvas_main_menu li {
  position: relative;
}
.offcanvas_main_menu li:last-child {
  margin: 0;
}
.offcanvas_main_menu li span.menu-expand {
  position: absolute;
  right: 10px;
}
.offcanvas_main_menu li a {
  font-size: 16px;
  font-weight: 400;
  text-transform: capitalize;
  display: block;
  padding: 0px 10px;
  padding-bottom: 10px;
  margin-bottom: 10px;
  border-bottom: 1px solid #ededed;
  color: #333;
}
.offcanvas_main_menu li a:hover {
  color: #003366;
}
.offcanvas_main_menu li ul.sub-menu {
  padding-left: 20px;
}
.offcanvas_footer {
  margin-top: 50px;
  padding-bottom: 50px;
  text-align: center;
}
.offcanvas_footer span a {
  font-size: 14px;
}
.offcanvas_footer span a:hover {
  color: #003366;
}
.slinky-theme-default a:not(.back) {
  padding: 10px 0;
  text-transform: capitalize;
  font-size: 16px;
  font-weight: 400;
}
.slinky-theme-default a:not(.back):hover {
  background: inherit;
  color: #003366;
}
.canvas_close {
  position: absolute;
  top: 10px;
  right: 13px;
}
.canvas_close a {
  font-size: 18px;
  text-transform: uppercase;
  font-weight: 500;
  width: 32px;
  height: 32px;
  display: block;
  text-align: center;
  line-height: 32px;
  border: 1px solid #ededed;
  border-radius: 50%;
  color: #333;
}
.canvas_close a:hover {
  background: #003366;
  border-color: #003366;
  color: #fff;
}
.mobile-logo {
	margin-bottom: 40px;
	text-align: center;
}
.mobile-logo img{
	max-width: 70px;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  .canvas_open {
    display: block;
  }
}
@media only screen and (max-width: 767px) {
  .canvas_open {
    right: 20px;
    top: 27px;
    display: block;
    width: 36px;
  }
}
.canvas_open a:hover {
  color: #fe3737;
  border-color: #fe3737;
}
/*
 * Sticky
*/
.header-bottom.sticky {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 99;
	-webkit-animation: sticky 1s;
	-moz-animation: sticky 1s;
	-o-animation: sticky 1s;
	animation: sticky 1s;
	-webkit-box-shadow: 2px 4px 8px rgba(51, 51, 51, 0.25);
	-moz-box-shadow: 2px 4px 8px rgba(51, 51, 51, 0.25);
	box-shadow: 2px 4px 8px rgba(140, 129, 129, 0.25);
	background: #fff;
}
@-webkit-keyframes sticky {
  	0% {
    	-webkit-transform: translateY(-100%);
    	transform: translateY(-100%); 
    }
  	100% {
    	-webkit-transform: translateY(0%);
    	transform: translateY(0%); 
	} 
}
@keyframes sticky {
  	0% {
    	-webkit-transform: translateY(-100%);
    	transform: translateY(-100%); 
	}
  	100% {
    	-webkit-transform: translateY(0%);
    	transform: translateY(0%); 
	} 
}

.whatsapp-float {
    position: fixed;
    bottom: 20px; /* Ajusta la distancia desde la parte inferior */
    left: 20px; /* Ajusta la distancia desde la derecha */
    background-color: #25D366; /* Color del fondo de WhatsApp */
    color: white; /* Color del icono */
    border-radius: 50%; /* Bordes redondeados para hacer un botón circular */
    width: 60px; /* Ancho del botón */
    height: 60px; /* Altura del botón */
    display: flex;
    align-items: center; /* Centra verticalmente el contenido */
    justify-content: center; /* Centra horizontalmente el contenido */
    font-size: 24px; /* Tamaño del icono */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); /* Sombra del botón */
    text-decoration: none; /* Eliminar subrayado del enlace */
    z-index: 1000; /* Asegura que el botón esté por encima de otros elementos */
}

.whatsapp-float:hover {
    background-color: #128C7E; /* Color más oscuro al pasar el mouse */
}
