/* *{
    overflow: hidden;
} */
a {
    text-decoration: none !important;
}

section {
    display: block;
}

[hidden] {
    display: none;
}

@font-face {
    font-family: 'gorditabold';
    src: url('../fonts/gorditabold-webfont.woff2') format('woff2'), url('../fonts/gorditabold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'gorditamedium';
    src: url('../fonts/gorditamedium-webfont.woff2') format('woff2'), url('../fonts/gorditamedium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'gorditaregular';
    src: url('../fonts/gorditaregular-webfont.woff2') format('woff2'), url('../fonts/gorditaregular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

body {
    padding: 0;
    margin: 0;
    font-size: 14px;
    font-family: 'Karla', sans-serif;
    line-height: 18px;
    color: #5d6b7b;
    width: 100%;
    height: 100%;
}

.speciality,
.partners {
    background: #fff;
    padding: 60px 0;
}

.iq-list li i {
    float: left;
    font-size: 22px;
    margin-right: 15px;
    color: #4ac4f3;
}

#home {
    margin-top: 100px;
    height: calc(100vh - 100px)
}
/*---------- m a i n - b a n n e r --------------*/
.main-banner {
    padding: 12% 0;
    position: relative;
    text-align: center;
    overflow: hidden;
    height: 100%;
    z-index: 1;
}

.main-banner::after {
	content: "";
	width: 100%;
	height: 100%;
	position: absolute;
	bottom: 0;
	right: 0;
	background: -webkit-linear-gradient(90deg,#fff 30%,hsla(0,0%,100%,0) 80%);
	z-index: -1;
}

.main-banner .background {
    opacity: 0.5;
    text-align: left;
}

.list-inline>li {
    display: inline-block;
}

.main-banner .main-intro {
    animation-delay: 0s;
    animation-duration: 1s;
    animation-fill-mode: forwards;
    animation-name: u;
    background-color: #fff;
    height: auto;
    opacity: 1;
    position: absolute;
    top: 0;
    width: 100%;
}

.main-banner>.content {
    padding-left: 105px;
    text-align: left;
    position: relative;
    z-index: 2;
    width: 50%;
}

.main-banner .welcome {
	color: #5d6b7b;
	letter-spacing: .75px;
	font-size: 16px;
}

.main-banner .banner-title {
    color: #098798;
    /* font-family: 'gorditamedium'; */
}

.home-service-content h2::after,
.banner-title:after,
.feature-details h3:after,
.service-content h1:after,
.product-clients h2:after {
    background: #5d6b7b none repeat scroll 0 0;
    content: "";
    display: block;
    height: 2px;
    margin: 10px 0;
    width: 40px;
}

.main-banner .banner-title span {
    color: #39b99a;
}

.main-banner .content ul li {
    color: #098798;
    font-size: 16px;
    letter-spacing: 0.75px;
    line-height: 28px;
    padding: 0 15px 0 20px;
    position: relative;
}

.main-banner .content ul li::before {
    background: #d8d8d8 none repeat scroll 0 0;
    border-radius: 50%;
    content: "";
    height: 12px;
    left: 0;
    position: absolute;
    top: 7px;
    width: 12px;
}

.main-banner a {
    /* border: 2px solid #39B99A; */
    color: white;
    display: inline-block;
    font-family: "gorditamedium";
    font-size: 12px;
    letter-spacing: 1px;
    padding: 10px 20px;
    text-transform: uppercase;
    transition: all 0.3s linear 0s;
    margin-right: 5px;
}

.main-banner a:hover {
    /* border: 2px solid #fff;
    color: #098798; */
}
.certification {
    position: absolute;
    right: 0;
    bottom: 0;
    width: auto;
    padding-top: 100px;
    background: -webkit-linear-gradient(118deg,#ffffff 0%,hsla(0,0%,100%,0) 50%);
}

.certification img {
    display: block;
    height: 80px;
}
.list-inline {
    margin-left: -5px;
}
.list-inline, .list-unstyled {
    padding-left: 0;
    list-style: none;
}
.certification ul li {
	margin: 0 0 0 15px;
	padding: 0;
	vertical-align: middle;
}
.list-inline>li {
    display: inline-block;
    padding-right: 5px;
    padding-left: 5px;
}
.certification img {
    display: block;
}


/*----------- W O R K ----------*/
.work-heading{
   padding-top: 70px;
}
.portfolio {
    padding: 0 15px;
    margin-bottom: 50px;
}

.portfolio-box {
    display: block;
    height: auto;
    overflow: hidden;
    position: relative;
    width: 100%;
}

.portfolio-box img {
    filter: grayscale(100%);
    -moz-transition: all 0.3s linear 0s;
    -ms-transition: all 0.3s linear 0s;
    -o-transition: all 0.3s linear 0s;
    -webkit-transition: all 0.3s linear 0s;
    transition: all 0.3s linear 0s;
}

.portfolio-box:hover img {
    -webkit-filter: grayscale(0);
    -mos-filter: grayscale(0);
    filter: grayscale(0);
}

.portfolio-overlay {
    background: #fff none repeat scroll 0 0;
    bottom: 0;
    height: auto;
    left: 0;
    position: absolute;
    top: auto;
    padding: 10px;
    -moz-transform: translateY(100px);
    -ms-transform: translateY(100px);
    -o-transform: translateY(100px);
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
    -moz-transition: all 0.3s linear 0s;
    -ms-transition: all 0.3s linear 0s;
    -o-transition: all 0.3s linear 0s;
    -webkit-transition: all 0.3s linear 0s;
    transition: all 0.3s linear 0s;
    width: 100%;
    z-index: 5;
}

.portfolio-overlay:before {
    bottom: 100%;
    left: 70px;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(255, 255, 255, 0);
    border-bottom-color: #ffffff;
    border-width: 15px;
    margin-left: -15px;
}

.portfolio-overlay h3 {
    color: #111;
    /* font-family: "gorditamedium"; */
    font-size: 18px;
    letter-spacing: 0.5px;
    margin: 0;
    text-transform: capitalize;
}

.portfolio-box:hover .portfolio-overlay {
    -moz-transform: translateY(1px);
    -ms-transform: translateY(1px);
    -o-transform: translateY(1px);
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
}

.portfolio-nav {
    margin-bottom: 40px;
}

.portfolio-nav ul li a {
    padding: 10px 20px;
    text-transform: uppercase;
    letter-spacing: 0.25px;
    font-size: 13px;
    color: #098798;
    font-family: "gorditabold";
    border: 2px solid #098798;
}

.portfolio-nav ul li a:hover,
.portfolio-nav ul li a.active {
    background: #3ebb9d;
    color: #fff;
    border: 2px solid #3ebb9d;
}

.no-gutter>[class*=col-] {
    padding-left: 0;
    padding-right: 0;
}

.portfolio-nav .list-inline>li {
    display: inline-block;
    padding-right: 5px;
    padding-left: 5px;
}


/* page banner secthin */

.banner {
    width: 100%;
    overflow: hidden;
    display: table;
    border-top: 5px solid #1face3;
    height: 50%;
    height: 55vh;
    position: relative;
    background-position: left center;
    z-index: 1;
}

.banner .container {
    display: table-cell;
    height: 100%;
    width: 100%;
    text-align: center;
    vertical-align: middle;
}

.banner-content h3 {
    color: #fff;
    font-size: 24px;
    font-weight: 800;
    letter-spacing: 0.5px;
    line-height: normal;
    text-transform: uppercase;
    padding-top: 70px;
}


/*-------- About --------*/

.express-digitally {
    color: #111;
    display: inline-block;
    font-family: "gorditabold";
    font-size: 48px;
    letter-spacing: 2px;
    line-height: 70px;
    margin: 40px 0 0;
    position: relative;
    text-align: center;
    background: -webkit-linear-gradient(45deg,#39B99A, #098798);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.about-content {
    padding: 40px 0 0;
}

.home-service-content p,
.intro-text,
.service-content,
.service-content p,
.service-content ul li,
.testimonial .content p {
    color: #111;
    font-size: 16px;
    letter-spacing: 0.35px;
    line-height: 28px;
    margin: 0 0 16px;
}

.testimonial {
    padding: 50px 0 50px;
    background: #F0F3F3;
}

h2.sub-heading {
    color: #098798;
    font-size: 35px;
    letter-spacing: 2px;
    margin: 0 0 50px;
    font-weight: 600;
    text-align: center;
    text-transform: uppercase;
}

.testimonial .content {
    width: 50%;
    margin: 0 auto;
}

.testimonial .content h2 a {
    font-size: 14px;
}

.testimonial .content img {
    width: auto;
    margin: 0 auto;
    display: block;
}

.testimonial .carousel-control {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;   
    color: #098798;
    font-size: 40px;     
    opacity: 1;
    text-shadow: none;
    top: 24%;
}
   
.testimonial .content h4 {
    color: #424e5d;
    font-weight: 700;
    font-size: 16px;
    letter-spacing: 3px;
    text-transform: uppercase;
}

.sister-concern {
    padding: 70px 0 50px;
}

.sister-content {
    background: #f9f9f9;
    position: relative;
    box-shadow: 0 5px 50px rgba(0, 0, 0, 0.22);
    padding: 0px 40px 0px 50px;
    margin: 1px 41px 10px 43px;
}

.sister-content a {
    text-decoration: none;
}

.sister-content:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    background: #098798;
    width: 0;
    height: 5px;
    transition: all 0.3s linear;
}

.sister-content:hover:after {
    width: 100%;
}
.sister-content:hover {
    background-color: rgb(224, 238, 243);
    transition: all 0.3s linear;
}

.sister-content img {
    margin: 20px 0;
    height: 65px;
}

.sister-content a {
    /* padding: 20px; */
    display: block;
}

.sister-content p {
    color: #5d6b7b;
    font-size: 15px;
    letter-spacing: 0.35px;
    line-height: 26px;
    min-height: 185px;
}

.sister-content h2 {
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    transition: all 0.3s linear;
}

.sister-content:hover h2 {
    color: #39b99a;
}

.heading {
    margin-bottom: 50px;
}

.heading h3 {
    font-size: 37px;
    font-weight: 600;
    margin: -30px 0 55px;
    text-transform: uppercase;
    line-height: normal;
    color: darkcyan;
}

.heading p {
    color: rgb(93, 107, 123);
    letter-spacing: 1.0px;
    font-weight: 400;
    text-align: center;
    margin-top: -43px;
    font-size: 16px;
}

.choose-box img {
    display: block;
    margin: 0 auto;
}

.choose-box h3 {
    color: #098798;
    font-size: 30px;
    font-weight: 300;
    /* margin-top: 20px; */
    margin-bottom: 10px;
}

.choose-box ul {
    padding: 0;
}

.choose-box ul li {
    color: #5d6b7b;
    font-size: 16px;
    font-weight: 300;
    padding: 5px 0;
    line-height: 1.5;
    list-style: none outside none;
    font-family: 'Karla', sans-serif;
}

.parallax {
    padding: 100px;
    text-align: center;
}

.para-intro h3 {
    color: #fff;
    font-size: 36px;
    font-weight: 700;
    letter-spacing: 0.25px;
    line-height: normal;
    text-transform: uppercase;
    text-shadow: 0 0 2px rgba(0, 0, 0, 0.3);
}


/* about page css end */


/*----------------- V A T - P A G E ----------------*/

.banner {
    width: 100%;
    overflow: hidden;
    display: table;
    border-top: 5px solid #1face3;
    height: 50%;
    height: 55vh;
    position: relative;
    background-position: left center;
    z-index: 1;
}

.banner::after {
    background: rgba(0, 0, 0, 0.1) none repeat scroll 0 0;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;
}

.banner .container {
    display: table-cell;
    height: 100%;
    width: 100%;
    text-align: center;
    vertical-align: middle;
}

.banner-content h3 {
    color: #fff;
    font-size: 24px;
    font-weight: 800;
    letter-spacing: 0.5px;
    line-height: normal;
    text-transform: uppercase;
}

.banner-content h3 span {
    color: #1FACE3;
}

.banner-content p {
    color: #fff;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0.5px;
    line-height: normal;
    margin: 0 auto;
    text-transform: capitalize;
    width: 50%;
}

.banner-content h3 {
    color: #fff;
    font-size: 24px;
    font-weight: 800;
    letter-spacing: 0.5px;
    line-height: normal;
    text-transform: uppercase;
}

.banner-content h3 span {
    color: #1FACE3;
}

.banner-content p {
    color: #fff;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0.5px;
    line-height: normal;
    margin: 0 auto;
    text-transform: capitalize;
    width: 50%;
}

.product-details {
    background: #F0F3FA;
    padding: 40px 0 0;
}

.product-content {
    display: block;
    overflow: hidden;
}

.product-content+.row {
    margin-bottom: 30px;
}

.product-content .center-block {
    margin-bottom: 40px;
}

.product-content p,
.product-content ul li,
.service-content p,
.service-content ul li {
    color: #222;
    font-size: 15px;
    letter-spacing: 0.35px;
    line-height: 24px;
}

.product-details .clients-list {
    height: 100px;
}

.product-content ul,
.service-content ul {
    padding: 0;
}

.product-content ul li::before {
    content: "";
    display: inline-block;
    font-family: 'Karla', sans-serif;
    line-height: normal;
    padding-right: 5px;
}

.product-content ul li {
    display: inline-block;
    padding: 10px 0;
    vertical-align: top;
    width: 31%;
}

.product-list {}

.product-list h3 {
    border-bottom: 1px solid #666;
    color: #2497e3;
    font-size: 21px;
    font-weight: 600;
    letter-spacing: 0.35px;
    margin: 0 0 15px;
    padding-bottom: 5px;
    text-transform: uppercase;
}

.product-list-aside {
    margin-bottom: 20px;
}

.product-list-aside h4 {
    margin: 5px 0;
}

.product-list-aside h4 a {
    color: #214081;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 0.25px;
    line-height: normal;
}

.product-list-aside p {
    color: #585858;
    letter-spacing: 0.25px;
    line-height: normal;
}

.killer-project {
    padding: 50px 0;
    background: url(../images/shattered.png) repeat fixed;
    margin: 0 0 0;
    color: #fff;
}

.killer-project h1 {
    color: #098798;
    font-size: 32px;
    margin: 0 0 20px;
}

.killer-project .start-project {
    border: 2px solid #5d6b7b;
    color: #5d6b7b;
    display: inline-block;
    font-size: 18px;
    letter-spacing: 1px;
    padding: 15px 30px;
}

.killer-project .start-project:hover {
    border: 2px solid #098798;
    color: #098798;
}

.view-all-prod-btn {
    width: 250px;
    margin: auto;
    background: #fff;
    padding: 15px;
    font-weight: 600;
    text-transform: uppercase;
    border: 2px solid #008ece;
    border-radius: 4px;
    font-size: 18px;
}


/* P R O D U C T - P A G E */

.business-plan {
    background:#F0F3FA;
    display: block;
    overflow: hidden;
    width: 100%;
}
.plan-img {
    -moz-background-size: cover;
    -ms-background-size: cover;
    -o-background-size: cover;
    -webkit-background-size: cover;
    background-size: cover;
    height:400px;
    background-repeat: no-repeat;
    background-position: center center;
}

.plan-content {
    padding: 50px 30px 0 50px;
    width: 100%;
}
.package-box {
    height: auto;
}
.package-box .package-name {
    color:#39b99a;
    font-size: 21px;
    font-weight: 700;
    letter-spacing: 0.55px;
    line-height: normal;
    margin: 0 0 15px;
    text-transform: capitalize;
}

.package-box ul {
    margin: 0 0 10px;
    min-height: 120px;
    padding: 0;
}

.package-box ul li::before {
    content: "";
    display: inline-block;
    font-family: FontAwesome;
    padding-right: 5px;
    line-height: normal;
}
.package-box ul li,.package-box p {
    display: block;
    color: #424e5d;
    font-weight: 300;
    font-size: 14px;
    letter-spacing: 0.35px;
    padding: 5px 0;
}
.package-box p {
    font-weight: 400;
    line-height: 22px;
}

.package-box .btn-primary{
    background: #098798;
    border: 2px solid #098798;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    color: #fff;
    letter-spacing: 0.25px;
    padding: 8px 15px;
    -moz-transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    transition: all 0.3s linear;
}
.package-box .btn-primary:hover, .package-box .btn-primary:active{
    background: #F0F3FA;
    border: 2px solid #424e5d;
    color: #424e5d;
}

.package-box .btn-primary {
    padding:8px 20px;
}

/* p r o d u c t - p a g e - e n d */

.home-service-content h2::after,
.banner-title:after,
.feature-details h3:after,
.service-content h1:after,
.product-clients h2:after {
    background: #111 none repeat scroll 0 0;
    content: "";
    display: block;
    height: 2px;
    margin: 10px 0;
    width: 40px;
}
.service-content h1{
    margin-top: 30px;
}

.home-service-content h2,
.feature-details h3,
.product-clients h2 {
    color: #111;
    /* font-family: "gorditamedium"; */
    font-size: 20px;
    padding-bottom: 10px;
    position: relative;
    letter-spacing: 0.75px;
}

.home-service-content p,
.testimonial .content p,
.intro-text,
.service-content p,
.service-content ul li,
.service-content {
    font-size: 16px;
    color: #212529;
    line-height: 31px;
    letter-spacing: 0.35px;
    margin: 0 0 16px;
    font-family: 'Karla', sans-serif;
    text-align: justify;
}

.home-service-content a {
    color: #5d6b7b;
    display: inline-block;
    /* font-family: "gorditabold"; */
    font-size: 12px;
    letter-spacing: 2px;
    line-height: 30px;
    text-transform: uppercase;
    position: relative;
    z-index: 2;
    font-weight: 700;
}

.home-service-content a::after {
    background: url(../images/rm-arrow.svg) no-repeat left center;
    content: "";
    height: 30px;
    left: 120px;
    position: absolute;
    top: 0;
    -moz-transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    transition: all 0.3s linear;
    width: 0;
}

.home-service-content a:hover::after {
    background: url(../images/rm-arrow.svg) no-repeat -100px center;
    left: 0;
    top: 0;
    z-index: 3;
    width: 110px;
}

.clients-list {
    height: 150px;
    display: table;
    width: 100%;
}

.clients-list:hover .clients-logo img {
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
}

.product-clients .clients-list {
    background: #fff none repeat scroll 0 0;
    height: 110px;
    margin-bottom: 15px;
    padding: 0 10px;
}

.clients-logo {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
}

.clients-logo img {
    margin: 0 auto;
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    -moz-transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    transition: all 0.3s linear;
}

.clients-list:hover .clients-logo img {
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
}

.product-share-link {
    border-top: 1px solid #dbdbdb;
}

.product-share-link ul li {
    margin-right: 10px;
    vertical-align: middle;
}

.product-share-link ul li a {
    border: 2px solid #098798;
    border-radius: 50%;
    color: #098798;
    display: inline-block;
    font-size: 18px;
    font-weight: 500;
    height: 40px;
    letter-spacing: 0.25px;
    padding: 10px;
    text-align: center;
    width: 40px;
}

.product-share-link ul li a:hover {
    background: #2DB1E5 none repeat scroll 0 0;
    border: 2px solid #2DB1E5;
    color: #fff;
}

.product-share-link ul li {
    margin-right: 10px;
}

.product-share-link ul {
    margin: 1em 0;
}


/*------------- s e r v i c e - p a g e ----------------------*/

.features {
    background: #f7f7f7;
    padding: 10px 0 50px;
}
.services{
    padding: 70px 0 50px!important;
}

.features .container-fluid {
    width: 90%;
}

.feature-box {
    min-height: 260px;
    margin-top: 40px;
}

.feature-box h4 {
    color: #098798;
    font-size: 21px;
    font-weight: 600;
    letter-spacing: 0.25px;
    line-height: 1em;
    margin: 1em 0 0.4em;
}

.feature-box p {
    color: #5d6b7b;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: 0.25px;
    line-height: 25px;
    margin: 1em auto;
}

.feature-box .btn {
    background: #39b99a;
}

.feature-box .btn, .wp-btn {
    background: #39b99a;
    border: 2px solid #39b99a;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    color: #fff;
    letter-spacing: 0.25px;
    padding: 8px 15px;
    -moz-transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    transition: all 0.3s linear;
}
.feature-box .btn {
    background: #39b99a;
}

.feature-box .btn:hover{
    background: #F0F3FA;
    border: 2px solid #424e5d;
    color: #424e5d;
}

/*--------- s e r v i c e - d e t a i l s -------------*/

/* ...........CEO IMG....  */

.ceo-img img{
	height: 450px;
	width: 70%;
	margin-left: 135px;
}

.service-nav {
    position: relative;
    top: 80px;
}

.service-nav ul {
    margin: 0;
    padding: 0;
}
.features ul li {
   list-style: none;
}

.service-nav ul li a {
    display: block;
    font-size: 16px;
    letter-spacing: 1px;
    padding: 12px 0;
    color: #333;
}
.service-nav ul li.active a, .service-nav ul li a:hover {
    color: #1face3;
    letter-spacing: 1.5px;
}

.sticky {
  position: sticky;
  top: 180px;
  width: 100%;
  transition: 0.3s ease-in;
}
.sticky-after {
  transition: 0.3s ease-in;
}

/*-------- c o n t a c t -  p a g e ---------*/

.contact-banner h3 {
    color: #fff!important;
    font-size: 24px!important;
    font-weight: 800!important;
    letter-spacing: 0.5px!important;
    line-height: normal!important;
    text-transform: uppercase!important;

}

.contact-banner h3 span {
    color: #fff!important;
    font-size: 40px;
}

.contact-banner p {
    color: #fff!important;
    font-size: 18px!important;
    font-weight: 500;
    letter-spacing: 0.5px!important;
    line-height: normal!important;
    margin: 20px;
    text-transform: capitalize!important;
}

.contact {
    position: relative;
}

.contact::before,
.contact::after {
    background: #ddd none repeat scroll 0 0;
    content: "";
    height: 1px;
    left: -10%;
    position: absolute;
    top: -25%;
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    width: 250px;
    z-index: 1;
}

.contact::after {
    left: -5%;
    top: -30%;
}

.contact-info {
    margin-bottom: 50px;
}
.contact-info {
    position: relative;
    padding-top: 85px !important;
}

.contact-info h3,
.contact-title {
    color: #098798;
    font-size: 18px;
    letter-spacing: 0.35px;
    text-transform: capitalize;
}

.contact-info h3:after {
    content: '';
    display: block;
    height: 2px;
    width: 40px;
    background: #424e5d;
    margin-bottom: 20px;
}

.contact-info p {
    font-size: 15px;
    line-height: 28px;
    font-family: 'Poppins', sans-serif;
    color: #363232;
    text-align: justify;
}

.contact-info p a{
    color: #098798;
}

.contact-title {
    margin: 0;
}

.contact-form {}

.contact-form .form-group {
    margin-bottom: 20px;
}

.contact-form .form-control {
    border: 2px solid #b8b7b7;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    color: #00acff;
    display: block;
    font-size: 16px;
    height: auto;
    letter-spacing: 0.45px;
    padding: 0px 15px;
    resize: none;
}

.contact-form .form-control:focus {
    border: 3px solid #afadad !important;
}

.contact-form .btn {
    background:#58B8DE url("../images/arrow.svg") no-repeat scroll 92% center;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    -webkit-border-radius: 0;
    border-radius: 0;
    color: white;
    font-family: "gorditabold";
    font-size: 14px;
    letter-spacing: 1px;
    padding: 10px 20px;
    border-radius: 10px;
    text-transform: uppercase;
    -moz-transition: all 0.3s linear;
    -ms-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear;
}

.contact-form .btn:hover {
    /* background: #f2f2f2 url("../images/arrow.svg") no-repeat scroll 98% center; */
}

/*------- f o t t e r-----------*/
ul.info-share li {
    display: inline-block;
}
.container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
.banner{
  width: 100%;
  height: 100vh;
  background: #fff;
  position: relative;
}
.banner .container{
  max-width: 95%;
  width: 1600px;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
}
.banner video{
  position: absolute;
  top: 0;
  right: 0;
  filter: grayscale(1);
  pointer-events: none;
  display: none;
}
.banner .package-box h3{
  font-size: 60px;
}
.banner img{
  position: absolute;
  bottom: 0;
  right: 0;
}





.uy-container,.vat-inner .content-vat,.clients,.home-about,.products-items{
  margin: 0 auto;
  max-width: 90%;
  width: 1600px;
}
.content-row{
  display: grid;
  grid-template-columns: repeat(2,1fr);
  grid-gap: 50px;
  align-items: center;
  padding: 50px 0;
}
.content-row:nth-child(2n+1) .content-col:first-child{
  order: 2;
}
.shape-morph svg {
  fill: none;
}
.package-box h3,.service-box h3 {
  color: #098798;
  font-size: 28px;
  margin: 0;
}
.package-box p,.service-box p,.home-about p{
  color: #5d6b7b;
  font-size: 16px;
  max-width: 80%;
  line-height: 26px;
  font-family: 'Karla', sans-serif;
}
.service-box p,.home-about p{
  max-width: 100%;
}
.home-about p,.home-about h2{
    color: #fff;
    text-align: justify;
    font-size: 14px;
    font-family: 'Poppins', sans-serif;
}

.service-box h3 {
font-size: 24px;
}
.package-box ul{
  padding: 0;
  margin: 0 0 30px;
}
.package-box ul li {
  display: block;
  margin: 3px 0;
  font-size: 15px;
  color: #424e5d;
  position: relative;
  padding-left: 20px;
  font-family: 'Karla', sans-serif;

}
.package-box ul li::before{
  content: '';
  position: absolute;
  top: 9px;
  left: 0;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #6b6b6b;
}
.btn-common {
  color: black;
  background: white;
  padding: 15px 40px;
  display: inline-block;
  font-size: 18px;
  border-radius: 30px;
  transition: all 0.3s linear;
}
.btn-common:hover{
  box-shadow: 0 0 15px -2px rgba(32,63,127,0.7);
  color: black;
}
.uy-service{
  text-align: center;
  display: grid;
  grid-template-columns: repeat(3,1fr);
  grid-gap: 60px 100px;
}
.service-box-img{
  width: 150px;
  height: 137px;
  background: url(../images/web-shape.svg) no-repeat center center;
  background-size: 100%;
  margin: 0 auto 15px;
  position: relative;
}
.service-box-img img{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
}
.service-box .btn-common {
	background: #3ebb9d;
}

.clients{
  background: url(../images/bg.png) no-repeat left center;
}
.clients,.home-about{
  display: grid;
  grid-template-columns: 600px 1fr;
  grid-gap: 100px 100px;
  align-items: center;
  padding: 50px 0;
}
.home-about{
        grid-template-columns: 1fr 570px;
}
.home-about svg{
   fill: #fff;
position: absolute;
top: 0;
right: -15%;
width: 75%;
}
.home-about img{
position: relative;
z-index: 9;
}
.home-about-main{
  padding: 50px 0;
  background: -webkit-linear-gradient(45deg, #251d7d, #098798);
  position: relative;
  z-index: 1;
  margin-top: 40px;
}
/* .home-about-main:before{
    content:  url(../images/plant-02.png);
    display: block;
    width: 120px;
    position: absolute;
    bottom:-80px;
    left: 0;
    z-index: -1;
} */
.vat-inner{
    background: url(../images/bg.png) no-repeat right center
}
.vat-inner svg{
    width: 150%;
    -webkit-transform: translateX(-20%);
    transform: translateX(-20%);
}
.clients .package-box h3,.home-about h2{
    font-size: 44px;
}

.clients .package-box h3:after,.home-about h2:after{
    content: '';
    display: block;
    width: 40px;
    height: 3px;
    background: #5d6b7b;
    border-radius: 3px;
    margin: 20px 0;
}
.home-about h2:after{
    background: #fff;
}
.clients__item {

    display: grid;
    justify-content: center;
    width: 100%;
    height: 100%;
    min-width: 100%;
    grid-template-columns: repeat(3,1fr);
    grid-gap: 30px;
    text-align: center;

}
.clients__col{
    display: grid;
    grid-gap: 30px;
}
.clients__box {
    background-color: #f6f6f6;
    padding: 25px;
    display: flex;
    align-items: center;
    justify-content: center;

}
.clients__box img{
  max-width:100%;
  mix-blend-mode: multiply;
}
.clients__col:nth-child(2) .clients__box:first-child{
  margin-top: 70px;
  align-self: flex-end;
}
.clients__col:nth-child(3) .clients__box:first-child{
  margin-top: 120px;
  align-self: flex-end;
}
.products-items{
    display: grid;
}
.products-items:first-child{
    grid-template-columns: 45% 30% 1fr;
}
.products-items:last-child{
    grid-template-columns: 33% 1fr 33%;
}
.products-items a{
    height: 50vh;
    background: #f2f2f2;
    padding: 25px;
    display: grid;
    position: relative;
    align-content: center;
    overflow: hidden;
}
.products-items h2 {
    color: #098798;
    font-size: 20px;
    line-height: normal;
    margin: 0 0 10px;
}
.products-items p{
    color: #424e5d;
    font-size: 15px;
    margin-bottom: 0;
}
.products-items img{
    height: 110px;
    margin-bottom: 10px;
}
.products-items:first-child a:nth-child(2) img{
    mix-blend-mode: multiply;
}
.products-items:first-child a:nth-child(1) p,.products-items:first-child a:nth-child(1) h2{
    color: #fff;
}

.products-items:first-child a:nth-child(1){
    background: #424e5d;
    align-content: flex-end;
    
}
.products-items:first-child a:nth-child(2){
    background:rgba(57, 185, 154,0.25);
}
.products-items:last-child a:nth-child(3){
    background:rgba(57, 185, 154,0.5);
}
.products-items:last-child a:nth-child(2){
    background:#dadbdd;
}

.uy-testimonial{
    text-align: center;
    padding: 50px 0;
    background: rgba(247, 247, 247, 0.85);
}
.uy-testimonial .owl-carousel img{
    height: 50px;
    margin: 0 auto;
    width: 50px !important;
}
.uy-testimonial .owl-carousel{
    max-width: 50%;
    margin: 0 auto;

}
.uy-testimonial p{
    max-width: 80%;
    margin: 20px auto 0;
}
.uy-testimonial .owl-carousel .owl-nav i{
    background: none;
    color: #203f7f;
    font-size: 28px;
}
.iq-background-overlay{
    background: -webkit-linear-gradient(45deg,#39b99a,#098798);
    opacity: 0.85;
}
.uy-partner{
    padding: 50px 0;
}
.uy-partner img{
    mix-blend-mode: multiply;
}
.uy-partner .heading-title {
    margin-bottom: 20px;
}









/* b l o g - p a g e */

.iq-page-blog {
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 30px;
}

@media all and (min-width:768px) and (max-width:1024px) {
    .main-banner>.content {
        width: 50%;
    }
}

@media all and (max-width:767px) {
    body {
        padding: 0px;
    }
    #home {
        margin-top: 82px;
    }
    .portfolio-nav .list-inline>li {
        margin: 15px 0;
    }
    header .navbar .navbar-brand img {
        height: 52px;
    }
    .heading-title {
        padding-top: 0;
    }
    .main-banner {
        padding: 22% 0;
        margin-top: 52px;
        width: 100%;
        background: url(../images/poster-img.jpg) no-repeat center center;
        -moz-background-size: cover;
        -ms-background-size: cover;
        -o-background-size: cover;
        -webkit-background-size: cover;
    }
    .iq-breadcrumb {
        background-size: cover !important;
    }
    .main-banner .background {
        display: none;
    }
    .main-banner>.content {
        padding-left: 20px;
    }
    .main-banner .banner-title {
        font-size: 24px;
    }
    .main-banner>.content {
        width: 95%;
    }
    .product-carousel .owl-prev,
    .product-carousel .owl-next {
        position: static;
    }
    .home-service-content {
        padding: 25px 15px;
        min-height: 0;
    }
    .home-service-content p {
        height: auto;
    }
    .product-clients {
        display: none;
    }
    .home-service-content h2 {
        font-size: 18px;
        line-height: 18px;
    }
    .clients, .home-about, .content-row, .products-items, .uy-service {
        display: block;
    }
    .home-about svg {
        display: none;
    }
    .certification{
        position: static;
        padding-top: 15px;
    }
    .certification img{
        height: 50px;
    }
}

/* old mobile */
@media all and (max-width:767px) {
    body {
        padding: 0px;
    }
    #home {
        margin-top: 82px;
    }
    .portfolio-nav .list-inline>li {
        margin: 15px 0;
    }
    header .navbar .navbar-brand img {
        height: 52px;
    }
    .heading-title {
        padding-top: 0;
    }
    .main-banner {
        padding: 22% 0;
        margin-top: 52px;
        width: 100%;
        background: url(../images/poster-img.jpg) no-repeat center center;
        -moz-background-size: cover;
        -ms-background-size: cover;
        -o-background-size: cover;
        -webkit-background-size: cover;
    }
    .iq-breadcrumb {
        background-size: cover !important;
    }
    .main-banner .background {
        display: none;
    }
    .main-banner>.content {
        padding-left: 20px;
    }
    .main-banner .banner-title {
        font-size: 24px;
    }
    .main-banner>.content {
        width: 95%;
    }
    .product-carousel .owl-prev,
    .product-carousel .owl-next {
        position: static;
    }
    .home-service-content {
        padding: 25px 15px;
        min-height: 0;
    }
    .home-service-content p {
        height: auto;
    }
    .product-clients {
        display: none;
    }
    .home-service-content h2 {
        font-size: 18px;
        line-height: 18px;
    }
    .certification {
        right: 0;
        width: 100%;
    }
    .certification ul{
        text-align: center;
    }
    .certification ul li{
        margin: 0 5px;
    }
    .certification ul li img{
        height: 50px;
    }
    .clients, .home-about,.content-row,.products-items,.uy-service{
        display: block;
    }
    .home-about-main {
        padding: 25px 0;
    }
    .home-about-main::before {
        left: -7px;
    }
    .home-about svg{
        display: none;
    }
    .clients .package-box h3, .home-about h2 {
        font-size: 36px;
    }
    .package-box h3, .service-box h3 {
        font-size: 20px;
    }
    .vat-inner svg {
        width: auto;
        -webkit-transform: translateX(0%);
        transform: translateX(0%);
        margin: 25px 0 0;
    }
    .products-items a{
        height: auto;
        display: block;
        margin-bottom: 15px;
    }
    .service-box {
        margin-bottom: 30px;
    }
    .clients .package-box {
        text-align: center;
    }
    .package-box p, .service-box p, .home-about p {
        max-width: 100%;
    }
    .clients .package-box h3, .home-about h2 {
        font-size: 30px;
    }
    .clients .package-box h3::after{
        margin: 0 auto;
    }
    .clients__col,.clients__item {
        grid-gap: 10px;
    }
    .clients__box {
        padding: 10px;
    }
    .uy-testimonial .owl-carousel {
        max-width: 100%;
    }
    .parallax {
        padding: 40px 30px;
    }
    .para-intro h3 {
        font-size: 22px;
    }
    .iq-footer-box {
        margin-bottom: 25px;
    }
    .sticky {
        position: static;
    }
    .service-content h1 {
        font-size: 24px;
    }
    .services .service-content{
        padding: 30px 0;
    }
    .plan-img {
        height: 200px;
    }
    .plan-content {
        padding: 35px 20px 0 20px;
        margin-bottom: 20px;
    }
    header.menu-sticky.about-header{
        transform: translateY(24px);
    }
    .testimonial .content {
        width: 90%;
    }
    .contact-info {
        margin-bottom: 0;
        padding-top: 30px;
    }
    iframe{
        height: 250px;
    }
}



/* --------------CEO DETAILS----------- */

    .ceo-img img {
    max-width: 100%; /* Ensures the image resizes within the container */
    height: auto; /* Maintains aspect ratio */
    border-radius: 10px; /* Optional: Soft rounded corners */
    display: block;
    margin: 80px auto; /* Centers the image */
}

@media only screen and (min-width: 320px) and (max-width: 574px) {
    .ceo-img {
        text-align: center; /* Ensures proper centering on smaller screens */
    }
    .ceo-img img {
    max-width: 100% !important;
    border-radius: 10px;
    display: block;
    margin: 189px auto !important;
}
}
@media only screen and (min-width: 575px) and (max-width: 975px) {
    .ceo-img {
        text-align: center; /* Ensures proper centering on smaller screens */
    }
    .ceo-img img {
        max-width: 100%;
        border-radius: 10px;
        display: block;
        margin: 128px auto;
        height: 450px;
        width: 100%;
    }
}
@media only screen and (min-width: 975px) and (max-width: 1275px) {
    .ceo-img {
        text-align: center; /* Ensures proper centering on smaller screens */
    }
    .ceo-img img {
        max-width: 100%;
        border-radius: 10px;
        display: block;
        margin: 128px auto;
        height: 500px;
        width: 100%;
    }
}