/*
Awesome Template
http://www.templatemo.com/preview/templatemo_450_awesome
*/

body {
	padding-bottom:0px!important;
    background: transparent;
    color: #fff;
    font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    overflow-x: hidden; /* prevent horizontal scrollbar from appearing */
}
iframe {
    border: none;
    height: 100vh!important;
    overflow: hidden!important;
}
.mt-50{
	margin-top:50px;
}
div, p, h1, h2, h3, h4, h5 ,h6{
    color:#000;
}
.bg-0{
	background:transparent;
}
.active{
	 color: #28a7e9;
    background:transparent;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
    color: #28a7e9;
    background:transparent;
}
.order-md-1 {
    padding-top: 4rem;
}
.w-100{
    width:100%;
}
a:hover {
    color: #fff !important;
}

.thumbnail {
    padding: 0px !important;
}

.border-0 {
    border: none !important;
}

/* start h2 */
h2 {
    text-align: center;
    font-size: 40px;
    padding-bottom: 12px;
}

    h2 span {
        color: #28a7e9;
        font-weight: bold;
    }
/* end h2 */


/* start header */

header {
    color: #fff;
    background: orange;
    min-height: 20px;
    padding-top: 10px;
    padding-bottom: 6px;
    font-size: 16px;
    font-weight: 600;
}
header p{
    color:#fff;
}
    header a {
        color: #fff !important;
        font-weight: 600;
    }

    header .fa {
        color: #fff;
    }

    header span {
        font-weight: bold;
        padding-right: 10px;
        padding-left: 4px;
        color:#fff;
    }

    header .social-icon {
        text-align: right;
    }

        header .social-icon li a {
            border: none;
            width: 20px;
            height: 20px;
            color: #fff !important;
            line-height: 20px;
            text-align: center;
        }


/* end header */
/*************mobview *********************/
a.list-group-item.small {
    background: orange;
    color: white;
}
li#accordion {
    padding-left: 0px;
    margin-left: 0px;
    width: 86%;
}
/********* client webview*************************/
.dropdown-menu {
    margin: 2px -36px 0px 0px!important;
}
.client h2 {
    color: #fff;
}

.jumbOverlay {
    background: orange;
    opacity: 0.9;
    padding: 4rem 2rem;
}

.bg-white {
    background-color: #fff;
    width: 100%;
}
.bg-text{
    color:#555;
}
.imageflex {
    padding: 2.5rem !important;
}

.client img {
    border: none;
    width: 70%;
}
/***********end of client *******************/


/******************start of product ***************/

#portfolio .col-md-3, #portfolio .col-md-4, #portfolio .col-md-2 {
    border: none;
}
.h200{
	width:500px;
	height:200px;
	overflow:auto;
}

#portfolio{
    background-color: #fff;
    padding: 5rem;
}
  
.card-img-overlay {

    text-align:center;
}
.productimg {
    width: 100%;
    height: 138px !important;

}

.product .productimgNormal {
    width: 375px;
    height: 300px;

}

.explore-text-overlay {
    opacity: 0;
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: calc(100% - 30px);
    height: 100%;
    z-index: 1;
    background-color: rgba(0,0,0,0.6);
    margin-left: 15px;
    -webkit-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}

.margintop11 {
    margin-top: 11%;
}

.vertical-middle {
    z-index: 3;
    position: relative;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    min-height: 100%;
    justify-content: center;
    flex-flow: column;
}
/***************end of product *******************/

/**************start of let Started ***********/
.filters .nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover{
	color:red!important;
	background:transparent!important;
}

/**************end of let Started ************/
/*************start of services *************/
.gallery {
    position: relative;
    width: 50%;
  }
  
  .image {
    display: block;
    width: 100%;
    height: auto;
  }
  
  .overlay {
    position: absolute;
  
    left: 0;
    right: 0;
    bottom: 80%;
    background-color: rgba(35, 50, 149, .8);
    opacity:1;
    overflow: hidden;
    width: 100%;
    height:0;
    transition: .5s ease;
  }
  
  .gallery:hover .overlay {
    bottom: 0%;
    height: 100%;
  }
  
  .text {
    color: white;
    font-size: 20px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
  }
.card-text-overlay{
        color: #fff;
        position: absolute;
        z-index: 15;
        padding-left: 4%;
        margin-top: -288px;
}
.card-text-overlay1{
    color: #fff;
    position: absolute;
    z-index: 15;
    padding-left: 4%;
    margin-top: -140px;
}
.img-hover-zoom {
    width: auto;
    height: auto; /* [1.1] Set it as per your need */
    overflow: hidden; /* [1.2] Hide the overflowing of child elements */
  }
  
  /* [2] Transition property for smooth transformation of images */
  .img-hover-zoom img {
    transition: transform .2s;
  }
  
  /* [3] Finally, transforming the image when container gets hovered */
  .img-hover-zoom:hover img {
    -ms-transform: scale(1.1); /* IE 9 */
    -webkit-transform: scale(1.1); /* Safari 3-8 */
    transform: scale(1.2); 
  }


    .wpb_wrapper h4 {
        color: cadetblue;
    }

    .wpb_wrapper h2 {
        color: #h4h4h4;
    }

.service {
    background: url('../images/ban1.jpg');
}

.blinkPadding {
    padding: 4rem 0rem;
}

.tabblink {
    margin: 0 auto;
    background-color: red;
    animation-name: stretch;
    animation-duration: 2s;
    animation-timing-function: linear;
    animation-delay: 0;
    animation-direction: normal;
    animation-iteration-count: infinite;
    animation-fill-mode: backwards;
    animation-play-state: running;
    opacity: 0.1;
}

.servicebg {
    padding: 4rem 2rem;
    background-color: orange;
    opacity: 96%;
    height: -webkit-fill-available;
}

.tab {
    background: rgb(255, 255, 255);
    color: rgb(101, 99, 100);
    height: auto;
    width: 67px;
    margin: -30px;
    /*line-height: 60px;
            opacity: 1;
        display:table;*/
    border-radius: 50%;
    background-color: #f1f1f1;
    position: absolute;
    -webkit-animation: zoom 5s infinite;
    animation: zoom 5s infinite;
}


    /* Style the buttons inside the tab */
    .tab button {
        border: none;
        border-radius: 50%;
        display: block;
        background-color: inherit;
        color: rgb(101, 99, 100);
        padding: 18px 16px;
        width: 100%;
        outline: none;
        cursor: pointer;
        font-size: 21px;
    }

@-webkit-keyframes zoomup {
    0% {
        transform: scale(1,1);
    }

    50% {
        transform: scale(1.2,1.2);
    }

    100% {
        transform: scale(1,1);
    }
}

@keyframes zoomup {
    0% {
        transform: scale(1,1);
    }

    50% {
        transform: scale(1.2,1.2);
    }

    100% {
        transform: scale(1,1);
    }
}
/* Change background color of buttons on hover */
.tab button:hover, .tab button:active, .tab.active {
    -webkit-animation: zoomup 5s infinite;
    animation: zoomup 5s infinite;
    background-color: cadetblue;
}

.serviceTabBorder {
    /* margin-right: 0rem; */
    background-color: transparent;
    color: #353333;
    width: 81%;
    height: 426px;
    margin: 0% 15%;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.12);
}

/* Style the tab content */
.tabcontent {
    text-align: center;
    background-color: #fff;
    float: left;
    margin: 15%;
    padding: 20px;
    border-radius: 50%;
    border: 1px solid #ccc;
    width: 71%;
    border-left: none;
    height: 69%;
    display: none;
}

    .tabcontent i {
        font-size: 60px;
        color: cadetblue;
    }

    .tabcontent h3 {
        font-family: 'Dosis';
        font-weight: 600;
    }

.infogap {
    margin: 15px 0px;
}

.toph {
    left: 55%;
    margin-top: -3rem;
}

.one {
    margin-left: 36%;
    margin-top: 38.5rem;
}

.two {
    top: 11rem;
    left: 89%;
}

.three {
    margin-top: 7rem;
    left: 22%;
}

.four {
    margin-top: 25rem;
    left: 20%;
}

.five {
    left: 91%;
    margin-top: 26rem;
}
/* Clear floats after the tab */
.clearfix::after {
    content: "";
    clear: both;
    display: table;
}

.description-tab {
    padding: 1rem;
    border: 2px solid #ccc;
    font-size: 25px;
    color: rgb(53, 51, 51);
    background-color: #fff;
    border-radius: 11px;
}

::marker {
}

.Blinkservice:hover, .Blinkservice:active {
    /* margin: 0 auto; */
    background-color: red;
    animation-name: stretch;
    animation-duration: 2s;
    animation-timing-function: linear;
    animation-delay: 0;
    animation-direction: normal;
    animation-iteration-count: infinite;
    animation-fill-mode: both;
    animation-play-state: running;
}

.iconul {
    font-size: 146px;
    width: 86%;
    border-left: 5px solid black;
    margin-top: 7rem;
}

.iconli {
    margin-left: 32px;
    font-size: 126px;
}
/*************service responsive *************/
.serviceresponsive {
    margin-left: -24px;
    padding: 1rem;
    background-color: #fff;
    border-radius: 50%;
}

    .serviceresponsive i {
        font-size: 21px;
        color: rgb(101, 99, 100);
    }

.servicecardmob {
    background-color: #fff;
    border-radius: 8px;
    padding: 1rem;
    margin-bottom: 28px;
}

    .servicecardmob h5 {
        font-size: 16px;
        color: rgb(101, 99, 100);
    }

    .servicecardmob p {
        font-size: 14px;
    }

.servicestick {
    margin-left: 9px;
    border-left: 1px solid rgb(101, 99, 100);
}
/*********end of service responsive***********/
/**********end of services**************/

/****************start of footer *********************************/
.padding12px{
    padding-top:12px;
}
.foothead{
	font-size:16px;
}
#footer .card-img, #footer .card-img-top {
    padding: 2rem;
    height: 220px;
    /*width:220px;
        height:220px;*/
}

#footer .card-deck .card {
	width:25%;
    border: none;
    background-color: transparent;
}

#footer .card-body {
    /*border:1px solid #fff;*/
    margin-top: 12rem;
    height: 7rem;
}

#footer .list-group {
	height:184px;
    font-weight: 600;
    margin: 2rem;
    background-color: #000;
    /*/opacity: 0.5;*/
}

.mtimg1 {
    width: 219px;
}

::marker {
    color: transparent;
}

.serviceimg {
    width: 250px;
}

.followimg {
    width: 219px;
}

.blogimg {
    margin-top: 0rem;
    width: 300px;
}

.list-group-flush .list-group-item:first-child {
    border-top-width: 0;
}

#footer .list-group-flush .list-group-item {
	height:107px;
    border: 0px;
    background-color: transparent;
    /*height:4rem;*/
}

#footer {
    background-color: #eee;
    /* border-top: 5px solid rgba(0,0,0,.2); */
}

.bg-color {
    background: url(../images/footerbghome_algaeservices.jpg);
    position: relative;
    background-position: center center;
}

.parallax {
    background-attachment: fixed !important;
}

.d-flex {
    display: flex;
}

.dark {
    background-color: #000 !important;
}

.bg-color::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    /**border-top: 10px solid #000000;
    border-bottom: 100px solid #000000; **/
    background-color: #fff;
    opacity: .9;
}


#footer .footer-widgets-wrap {
    position: relative;
    padding: 40px 0;
}

#footer .footer-copywrite-wrap {
    position: relative;
    padding: 0px;
    margin-top:88px;
    height: 93px;
}
.footerwrap{
    margin-top:3px;
    font-size:12px;
}
.footerpara {
    margin: 0px;
    font-size: 12px;
}
#footer .footer-mobilefooter-wrap {
    position: relative;
    padding: 6px;
}
/******************End of Footer******************************/


/* start about team service portfolio contact */
#about, #team, #service,
#portfolio, #contact {
    padding-top: 60px;
    padding-bottom: 40px;
}
/* end about team service portfolio contact */

/* start preloader */
.preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99999;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-flow: row nowrap;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    background: none repeat scroll 0 0 #ffffff;
}

.sk-spinner-wave.sk-spinner {
    width: 50px;
    height: 30px;
    text-align: center;
    font-size: 10px;
}

.sk-spinner-wave div {
    background-color: #333;
    height: 100%;
    width: 6px;
    display: inline-block;
    -webkit-animation: sk-waveStretchDelay 1.2s infinite ease-in-out;
    animation: sk-waveStretchDelay 1.2s infinite ease-in-out;
}

.sk-spinner-wave .sk-rect2 {
    -webkit-animation-delay: -1.1s;
    animation-delay: -1.1s;
}

.sk-spinner-wave .sk-rect3 {
    -webkit-animation-delay: -1s;
    animation-delay: -1s;
}

.sk-spinner-wave .sk-rect4 {
    -webkit-animation-delay: -0.9s;
    animation-delay: -0.9s;
}

.sk-spinner-wave .sk-rect5 {
    -webkit-animation-delay: -0.8s;
    animation-delay: -0.8s;
}

@-webkit-keyframes sk-waveStretchDelay {
    0%, 40%, 100% {
        -webkit-transform: scaleY(0.4);
        transform: scaleY(0.4);
    }

    20% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
    }
}

@keyframes sk-waveStretchDelay {
    0%, 40%, 100% {
        -webkit-transform: scaleY(0.4);
        transform: scaleY(0.4);
    }

    20% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
    }
}
/* end preloader */


/* start nagivation */
.navbar-default {
    background: #fff;
    border: none;
    box-shadow: none;
    margin: 0 !important;
}

    .navbar-default .navbar-brand {
        font-weight: 500;
        font-size: 30px;
        height: 55px;
        line-height: 40px;
        padding: 12px 0px 0px 12px;
    }

    .navbar-default .navbar-nav li a {
        font-weight: bold;
        font-size: 13px;
        height: 70px;
        line-height: 40px;
    }

    .navbar-default .navbar-nav > li > a.current {
        color: #28A7E9;
    }

.navbar a:hover {
    color: #28A7E9 !important;
}

.templatemo-nav {
    border-radius: 0;
    width: 100%;
    z-index: 1000;
}

.sticky {
    position: fixed;
    left: 0;
    top: 0;
}
/* end navigation */

/* start home */
.menu-button{
    height: 36px!important;
	   display: block;
   width: 100%;
   text-align: left;
}

.submit-button, .menu-button{
	font-weight: bold;
       font-size: 13px;
    height: 70px;
   /** padding-left: 10px;
    padding-right: 10px;**/
    border: none;
    line-height: 40px;
    background: transparent;
	color: #777;
}
.submit-button:hover, .menu-button:hover{
	color:#28A7E9;
}

#home {
    background: url('../images/homebannerconnectalgaeservices.jpg') no-repeat;
    background-size: 100% 100%;
    padding-top: 160px;
    padding-bottom: 100px;
    min-height: 650px;
}

    #home h1 {
        font-weight: 300;
        font-size: 70px;
        padding-bottom: 10px;
    }

        #home h1 span {
			font-size:30px;
            color: #000;
            font-weight: bold;
        }

    #home .btn {
        background: transparent;
        border-radius: 2px;
        color: #fff;
        font-size: 16px;
        font-weight: bold;
        margin-top: 20px;
        border: 2px solid #fff !important;
        width: 180px;
        height: 60px;
        padding-top: 18px;
        -webkit-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
    }

        #home .btn:hover {
            background: #28a7e9;
            border-color: transparent;
        }

.element {
    height: 60px;
    font-size: 20px;
    font-weight: 600;
    color: #28A7E9;
}
/* end home */

/* start about */
.wpb_wrapper {
    padding: 0rem!important;
}
.vc_column_container {
    padding-left: 0;
    padding-right: 0;
}
audio, canvas, progress, video {
    display: inline-block;
    vertical-align: baseline;
}
.vc_chart .vc_chart-legend span {
    border-radius: .3em;
    display: inline-block;
    height: 1.3em;
    left: 0;
    margin-right: .5em;
    vertical-align: middle;
    width: 1.3em;
}
.vc_chart .vc_chart-legend {
    font-size: 14px;
    margin: 0;
    padding: 0;
}
@media (min-width: 768px){
.vc_chart .vc_chart-with-legend {
    display: inline-block;
    vertical-align: middle;
    width: 60%;
}
}
@media (min-width: 768px){
.vc_chart .vc_chart-legend {
    display: inline-block;
    vertical-align: middle;
    width: 40%;
}
}
@media (min-width: 768px){
.vc_chart .vc_chart-legend li {
    margin-left: 1em;
}
}
@media (min-width: 768px){
.vc_chart .vc_chart-legend {
    display: inline-block;
    vertical-align: middle;
    width: 40%;
}
}
@media (min-width: 768px){
.vc_chart .vc_chart-legend li {
    margin-left: 1em;
}
}
.vc_chart .vc_chart-legend li {
    line-height: 1.3em;
    list-style: none;
    margin: 0 0 .3em 0;
    min-height: 1.3em;
}
.aboutbannerimg{
	background-image:url("../images/Algae-About us Agentic AI.jpg");

	height:350px;
	background-repeat:no-repeat;
	background-size:cover;
	background-position:left center;
}
.crackin-ul {
    line-height: 2;
    list-style: none;
    padding-left: 27px;
}
.crackin-ul li:before {
    content: ' ';
	filter: invert(100%) sepia() saturate(10000%) hue-rotate(
320deg);
    background: url(../images/long-arrow.svg);
    width: 20px;
    height: 30px;
        margin-top: 3px;
    left: 8%;
    position: absolute;
}
#about .media-heading-wrapper {
    padding-bottom: 32px;
}

    #about .media-heading-wrapper .fa {
        border: 1px solid #fff;
        border-radius: 2px;
        color: #fff;
        font-size: 24px;
        width: 60px;
        height: 60px;
        line-height: 60px;
        text-align: center;
        margin-bottom: 20px;
        margin-right: 20px;
    }

    #about .media-heading-wrapper h3 {
        font-size: 18px;
        font-weight: bold;
        padding-top: 20px;
        padding-left: 52px;
    }
/* end about */

/* start team */
#team .team-wrapper {
    background: #404040;
    padding-bottom: 10px;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    position: relative;
}

    #team .team-wrapper:hover {
        cursor: pointer;
        opacity: 0.4;
        bottom: 4px;
    }

    #team .team-wrapper .team-des {
        padding: 20px;
    }

        #team .team-wrapper .team-des span {
            color: #28a7e9;
            display: block;
            font-weight: bold;
            padding-bottom: 12px;
        }
/* end team */

/* start service */
#service .col-md-4 {
    padding: 40px;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

    #service .col-md-4:hover {
        background: #505050;
    }

#service .active {
    /*background: #505050;*/
    background: #transparent;
    padding: 40px;
}

#service .fa {
    border: 1px solid #fff;
    border-radius: 2px;
    color: #fff;
    font-size: 50px;
    width: 100px;
    height: 100px;
    line-height: 100px;
    text-align: center;
}

#service h4 {
    color: #28a7e9;
    font-weight: 600;
    padding-top: 10px;
    padding-bottom: 14px;
}
/* end service */

/* start portfolio */
.portfolio-thumb, .portfolio-overlay, .port img {
    max-width: 100%;
	height:383px;
}

.col-md-6.col-sm-12.col-xs-12.wow.fadeIn.animated.border-0.animated {
    padding: 0px;
}
.col-md-6.col-sm-6.col-xs-12.wow.fadeIn.animated.animated {
    padding: 0px!important;
}
.col-md-4.col-sm-12.col-xs-12.wow.fadeIn.animated.animated {
    padding: 0px;
}
.col-md-4.col-sm-6.col-xs-12.wow.fadeIn.animated.border-0.animated {
    padding: 0px;
}

.card-text-overlay {
    margin-top: -393px;
}
.text-overlay{
    margin-top: -348px;
}


    #portfolio .col-md-3 {
        padding: 0px;
        border: 1px solid black;
    }

.overlaywidth {
    width: 90% !important;
    margin-left: 3% !important;
}

.overlaywidthsmall {
    width: 86% !important;
    margin-left: 7% !important;
}

#portfolio .portfolio-thumb {
    border: 2px solid transparent;
    overflow: hidden;
    padding: 0;
    margin: 0 auto;
}
#portfolio .portfolio-thumb .portfolio-overlay1{
    width: 92%!important;
    left:1%!important;
}
.portfolioAlign{
	padding: 68px 0px 0px 23px!important;
}
    #portfolio .portfolio-thumb .portfolio-overlay, #portfolio .portfolio-thumb .portfolio-overlayhash {
        color: #fff;
        background:#013763;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        position: absolute;
        padding: 68px 0px 0px 31px;
        margin-left: auto;
        margin-right: auto;
        -webkit-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
    }

        #portfolio .portfolio-thumb .portfolio-overlay h4 {
            font-weight: bold;
            padding-bottom: 0px;
        }

        #portfolio .portfolio-thumb .portfolio-overlay .btn {
            background: none;
            border: 1px solid #fff;
            border-radius: 2px;
            color: #fff;
            font-weight: bold;
        }

    #portfolio .portfolio-thumb:hover .portfolio-overlay, #portfolio .portfolio-thumb:hover .portfolio-overlay1 {
        cursor: pointer;
        opacity: 0.8;
    }
/* end portfolio */

/* start contact */
#contact {
    color: #000;
    background: #fff;
}

    #contact .form-control {
        background: transparent;
        border: 1px solid #28a7e9;
        border-radius: 2px;
        box-shadow: none;
        color: #000;
        margin-top: 6px;
        margin-bottom: 16px;
    }

    #contact label {
        font-weight: 500;
    }

    #contact input {
        height: 50px;
    }

        #contact input[type="submit"] {
            background: #28a7e9;
            font-weight: bold;
            -webkit-transition: all 0.4s ease-in-out;
            transition: all 0.4s ease-in-out;
        }

            #contact input[type="submit"]:hover {
                background: transparent;
            }

    #contact address {
        border-bottom: 1px solid #505050;
        padding-top: 30px;
    }

        #contact address .address-title {
            font-weight: bold;
            font-size: 20px;
            padding-bottom: 10px;
        }

        #contact address span {
            display: block;
            padding-bottom: 30px;
        }

        #contact address .fa {
            border: 1px solid #fff;
            border-radius: 2px;
            width: 40px;
            height: 40px;
            line-height: 40px;
            text-align: center;
            margin-right: 10px;
            margin-bottom: 10px;
        }
/* end contact */

/* start copyright */

#copyright p {
    font-weight: 400;
}
/* end copyright */

/* start social icon */
.social-icon {
    position: relative;
    padding: 0;
    margin: 0;
}

    .social-icon h4 {
        display: inline-block;
        padding-right: 20px;
    }

    .social-icon li {
        display: inline-block;
        list-style: none;
    }

#contact .social-icon li a {
    border-radius: 2px;
    color: #000 !important;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    text-decoration: none;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    margin-right: 0px;
}

.social-icon li a:hover {
    background: #28a7e9;
}
/* end social icon */
/***********testimonial*/
.testimonial {
    color: #000;
    background-image: url('../images/map1.jpg');
}

    .testimonial .jumbOverlay {
        background: #fff;
        opacity: 0.9;
        padding: 4rem 2rem;
    }

.report-module .thumbnail {
    background: #fff;
    height: 26vh;
    overflow: hidden;
}

.report-module a {
    color: #000;
}

.thumbnail {
    padding: 0;
}

.report-module:hover {
    -webkit-box-shadow: 0px 1px 35px 0px rgba(0, 0, 0, 0.3);
    -moz-box-shadow: 0px 1px 35px 0px rgba(0, 0, 0, 0.3);
    box-shadow: 0px 1px 35px 0px rgba(0, 0, 0, 0.3);
}

    .report-module:hover .thumbnail img {
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        transform: scale(1.1);
        opacity: .9;
    }

.report-module .thumbnail img {
    display: block;
    width: 100%;
    -webkit-transition: all 0.3s linear 0s;
    -moz-transition: all 0.3s linear 0s;
    -ms-transition: all 0.3s linear 0s;
    -o-transition: all 0.3s linear 0s;
    transition: all 0.3s linear 0s;
    opacity: .2;
}

.category img {
    width: 98px;
    z-index: 1;
    position: absolute;
    top: 46%;
    left: 33%;
    border-radius: 50%;
    background: #333;
    padding: 10px 10px;
}

.report-module .card-body {
    position: absolute;
    top: 66%;
    width: 90%;
    color: #000;
}

.card-body.testimonialpara {
    background: orange;
    color: #000;
    height: 40vh;
}

.testimonialCard p {
    padding: 3rem 3rem 7rem 3rem;
    text-align: justify;
    margin: 0px;
    text-align: justify;
    margin: 0px;
}

.btn-primary {
    color: #fff;
    background: #28A7E9;
    text-decoration: none;
    border: none;
    padding: 1rem 2rem;
}
/***********************end of testimonial*****/
/******************start of LMS**************/
.fa-building, .fa-cubes, .fa-th {
    font-size: 9rem;
    color: #28A7E9
}
.fa-usps {
    color: #28A7E9; font-size: 9rem;
}
.paddingbanner {
    padding: 3rem;
}

.whitebg{
    background-color:#fff;
    color:#000;
}
.icon-text a, .icon-text a:hover{
    display: block;
    line-height: 22px;
    padding-top: 7rem;
    font-size:20px;
    text-decoration: none;
    color:#000!important;
}
.first-col{
padding:7rem 8rem;
}
.svg-bg {
    background-image: url("../images/svgbg1.png") !important;
    background-repeat: no-repeat;
    background-size: 100% 100% !important;
}
.svg-bg img, .help-bg img, .edu-bg{
    background:transparent;
    border:none;
}
.help-bg {
    background-image: url("../images/lmsbg.png") !important;
    background-repeat: no-repeat;
    background-size: 100% 100% !important;
}
.help-bg img{
    background:transparent;
}
@media only screen and (max-width: 1199px) and (min-width: 992px) {
    #portfolio .portfolio-thumb .portfolio-overlay {
        padding: 0px 8px;
    }
}
/*****************************start of education*/
.edu-bg {
    background-image: url("../images/graphbg.png") !important;
    background-repeat: no-repeat;
    background-size: 100% 100% !important;
}
.edu-bg img {
    text-align: center;
    background: transparent!important;
    border: none;
    margin: auto;
}
.features {
    background:#fff;
    /*color: darkorange;
    background-image: url('../images/educationbg.png');*/
}

    .features .jumbOverlay {
        background: transparent;
        opacity: 0.9;
        padding: 4rem 2rem;
    }
    .features .w-15{
        width:15%;
    }
.featuresCard {
    border: 5px solid;
    border-image-slice: 1;
    border-width: 5px;
    border-image-source: linear-gradient(to left, darkorange, #eee);
    border-radius:8px;
    height:auto;
    padding:2rem;
    margin:2px;
}
.featuresCard p{
    background:transparent;
    font-weight:bold;
    font-size:20px;
}
.mt5{
    margin-top:5%;
}
.mt-2{
    margin-top:10px;
}
.has-material-orange-color {
    color: #ff9900;
    font-weight: bold;
}
.has-s-font-size{
    padding-bottom:12px;
    font-size:18px;
    color:#777;
}
/* start 980 media quires */
/*********************start of councel*********/
.councel .jumbOverlay {
    background: transparent;
    opacity: 0.9;
    padding: 4rem 2rem;
}
.pb-20{
    padding-bottom:20px;
}
.councel .card-body{
    color:#fff;
}
.cardCounsel {
    color: #fff;
    text-align: center;
    margin: auto;
}
.cardCounsel .card-title{
    color:#fff;
}
    .cardCounsel p{
        color: #fff;
        margin:auto;
    }
.w-80 {
    width: 80%;
}
.pb-3{
    height:1rem;
}
.card-body ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.card-body li {
    padding-left: 1em;
    text-indent: -.7em;
}

    .card-body li::before {
        content: "* ";
        font-weight: 800;
        color: #28A7E9;
    }
.councelCenter {
    vertical-align: middle;
    height: auto;
    display: flex;
    padding-left: 11rem;
    justify-content: center;
    align-items: left;
    flex-direction: column;
}
.councelimg{
    width:200px;
    height:200px;
    border-radius:50%;
}
section.councel {
    background-size:100% 100%;
    background: url("../images/academicbg_algaeservices.jpg");
    background-size:100% 100%;
    height:100%;

}
section.councel img {
   margin:auto;
}
.borderradiusShow{
    height:350px;
    border-radius:40% 0% 0% 40%;
}
.borderradiusnext {
    padding-left:0px;
    height:350px;
    border-radius: 0% 40% 40% 0%;
}
.borderradiusgap{
    padding-right:0px;
    padding-top:4rem;
    padding-bottom:4rem;
}
.has-font-size {
    font-size: 20px;
}
/**************lms*************/
.w-20{
    width:20%!important;
}
.m-25{
 margin:25px;
}
.elearningWrapper.lmsWrapPadding, .brandWrapper {
    padding: 4rem;
    text-align: center;
    padding: 29px 23px;
    border-radius: 22px;
    margin-bottom: 40px;
    min-height: 248px;
    box-shadow: 7px 7px 30px -5px rgb(15 133 187 / 25%);
    max-width: 218px;
}
.orangebg{
    background:orange
}
.centerAlign {
    vertical-align: middle;
    height: 405px;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
.elearningWrapper {
    margin:auto;
    text-align: center;
    padding: 10px 23px;
    border-radius: 22px;
    margin-bottom: 40px;
    min-height: 248px;
    box-shadow: 7px 7px 30px -5px rgb(15 133 187 / 25%);
    max-width: 218px;
    text-align: center;
    background: #fff;
    filter: drop-shadow(0px 0px 6px rgba(17,143,201,0.078));
    border-radius: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-bottom: 25px !important;
    min-height: 90px;
}
.elearningWrapper img{
    margin:auto;
}
/********************************IT Services*/
/********************mobile view*****************/
.font-700{
	font-weight:700;
}
.pb-7{
	padding-bottom:7rem;
}
.pt-7{
	padding-top:7rem;
}
.pt-4{
	padding-top:4rem;
}
.pb-4{
	padding-bottom:4rem;
}
.jumbOverlay.white-bg {
    background: white!important;
}
.title-block p {
    font-size: 18px;
    color: #000;
    line-height: 30px;
}
.title-block h2 {
    font-size: 21px;
    line-height: 21px;
    margin-bottom: 24px;
}
.title-block {
    width: 60%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 60px;
}
.btn-open {
    color: #337ab7;
    font-weight: 700;
	font-size: 14px;
}
.zoom-rotate{
    width: auto;
    height: auto;
    overflow: hidden;
}
.zoom-rotate img {
 transition: all 0.3s;
}

.zoom-rotate:hover img {
transform: scale(1.2);
}
.cards .card-title{
	    font-size: 18px;
    margin-top: 24px;
	    color: #222;
		    font-weight: bold;
}
.card-para{
	margin:10px 0px;
	    font-size: 16px;
    line-height: 28px;
}

.image-container {
    position: relative;
    margin:auto;
}
.image-container img {
   height:350px;
}
    .image-container p {
       font-size:20px;
    }


    .image-container .after {
        position: absolute;
        top: 0;
        left: 0;
        padding:3rem;
        width: 100%;
        height: 100%;
        color: #FFF;
        display: block;
        background: rgba(0, 0, 0, .6);
    }

/*****************************end of mob view*/
.itbanner{
    height:350px;
}
.mb-50{
    margin-bottom:5rem;
}
.pb-100 {
    padding-bottom: 10rem;
}
.cardService {
    position: relative;
    overflow: hidden;
}
.cardService img {
    height:215px;
}

    .cardService > div { /* ADDED THIS */
        position: relative;
    }

    .cardService:hover .cardOverlay {
        left: 0;
    }
.bg-theme-colored-transparent-9 {
    background-color: orange;
}
.cardOverlay {
    position: absolute;
    left: -100%;
    background-color: orange !important;
    color: #fff;
    opacity:90%;
    height: 100%;
    width: 100%;
    z-index: 10;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    transition: left .7s;
}
.pt-5 {
    padding-top: 5rem;
}
    .cardOverlay h3{
        margin:auto;
        text-align:center;
        color: #fff;
    }
    .cardOverlay p {
        padding: 1rem;
        color:#fff;
        text-align:justify;
    }
.info-box h3{
    color:#fff;
}
.info-title {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 0px 70px 15px 15px;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
}

    .info-title:before {
        color: #fff;
        content: "\f054";
        font-family: "fontAwesome";
        position: absolute;
        text-align: center;
        line-height: 50px;
        bottom: 5px;
        top: 2px;
        right: 7px;
        width: 50px;
        height: 50px;
        background-color: rgba(9, 9, 9, 0.3);
        text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5);
        font-size: 18px;
    }
    /**********************start of staffing image*/
	.boardbg{
		background:url('../images/staffingservicebg.jpg');
		background-repeat:no-repeat;
		background-size:cover;
		background-position:left center;
		height:330px;
	}
	.boardpadding{
		    min-height: 330px;
    vertical-align: middle;
    display: flex;
    justify-content: center;
    /**align-items: center;**/
    flex-direction: column;
	}
	.staffhead{
		text-align: center;
    font-size: 40px;
	color:#00a1cb;
	font-weight:700;
	}
	h4.tm20 {
    text-align: left;
    color: #00a1cb;
    color: color: #00a1cb;
    font-size: 20px;
    font-weight: 700;
}
	.widget ul {
    list-style: none;
    padding-left: 0;
}
.widget_categories li {
    border-bottom: 1
px
 solid #ebebeb;
}
.widget_categories li a {
    color: #606060!important;
    display: block;
    padding: 10px;
    font-weight: 700;
	border-bottom: 1px solid #ebebeb;
}
.widget_categories li a:hover {
    color: #606060;
    display: block;
    padding: 10px;
    font-weight: 700;
	    
}
.widget_categories li a:before, .widget_categories .badge {
    -webkit-transition: all .25s ease;
    -moz-transition: all .25s ease;
    -ms-transition: all .25s ease;
    -o-transition: all .25s ease;
    transition: all .25s ease;
}
.widget_categories li a:before {
    width: 12px;
    height: 12px;
    display: inline-block;
    margin-right: 10px;
    content: "\f058";
    font: normal normal normal 14px/1 FontAwesome;
    color: #00a1cb;
}
.widget .stripe-full {
    padding-top: 3px;
    margin-bottom: 25px;
	text-align:center;
}
.stripe-over:before, .stripe-full:before, .stripe-bfixw:before {
    height: 3px;
    border-top: 1px solid #dedede!important;
}
.stripe-blue:after, .stripe-blue:before {
    border-color: #00a1cb!important;
}
.stripe-full h4 {
    color: #333;
}
.widget h4 {
    letter-spacing: 2px;
}
.carousel-indicators li{
	border-radius:0px;
	background:gray;
	border:1px solid #000;
}
.carousel-indicators .active{
	background:blue;
}
.carousel-indicators{
	bottom:50px;
}
.product-carousel .item-caption{
	    background-color: #1c1c1c;
    padding: 10px;
    text-align: center;
    color: #FFF;
}
.product-carousel .item-caption h5{
	color:#fff;
}

.stripe-over {
    display: inline-block;
    position: relative;
    margin-bottom: 0;
}
    .staffingimg{
        width:100px;
        height:100px;
        border-radius:50%;
    }
.staffingBGGradient {
    background: linear-gradient(-45deg, #ee7752, orange, #23a6d5, #23d5ab);
    background-size: 100% 100%;
    animation: gradient 15s ease infinite;
}
.stripe-over:before, .stripe-full:before, .stripe-bfixw:before {
    height: 3px;
    border-top: 1px solid #dedede;
}
.widget .stripe-full:after, .widget .stripe-full:before {
    bottom: -10px;
}
.stripe-full h4 {
    color: #333;
}
.text-white{
    color:#fff;
}
section.staffingBGGradient img {
    margin: auto;
}
section.staffingBGGradient .jumbOverlay {
    background: transparent;
    opacity: 0.9;
    padding: 4rem 2rem;
}
.typeElement {
    font-size: 28px;
}

@keyframes gradient {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}
/******************************start of timeline**********/
.mx-auto{
    margin:auto;
}
.margin2{
    padding-top:1rem;
}
.timeline .jumbOverlay{
    background:transparent;
}
.main-timeline12 .timeline {
    padding: 0 2px;
    position: relative;
    display: inline-block
}
.recruitment .main-timeline12 .timeline-icon:before {
    background: transparent;
}
.main-timeline12 .col-md-2 {
    -ms-flex: 0 0 15.666667%;
    flex: 0 0 15.666667%;
    max-width: 15.666667%
}

.main-timeline12 .timeline-icon {
    display: block;
    text-align: center;
    padding: 20px 0 55px;
    z-index: 1;
    position: relative
}

.main-timeline12 .timeline:nth-child(2n) .timeline-icon {
    padding: 55px 0 20px
}

.main-timeline12 .timeline-icon:before {
    content: "";
    width: 1px;
    height: 75%;
    background: #39ae99;
    margin: 0 auto;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
    transition: all .3s ease 0s
}

.main-timeline12 .timeline:nth-child(2n) .timeline-icon:before {
    bottom: auto;
    top: 0
}

.main-timeline12 .timeline:hover .timeline-icon:before {
    background: #555
}

.main-timeline12 .timeline-icon i {
    width: 45px;
    height: 45px;
    line-height: 45px;
    border-radius: 50%;
    background: #28A7E9;
    font-size: 14px;
    color: #fff;
    transition: all .3s ease 0s
}

.main-timeline12 .timeline:hover .timeline-icon i {
    background: #555;
    animation: icon-load 2.5s ease 0s infinite
}

.main-timeline12 .border {
    height: 15px;
    background: #28A7E9;
    margin-bottom: 0;
    transition: all .3s ease 0s
}

.main-timeline12 .timeline:hover .border {
    background: #555
}

.main-timeline12 .timeline:first-child .border {
    border-radius: 4px 0 0 4px
}

.main-timeline12 .timeline:last-child .border {
    border-radius: 0 4px 4px 0
}

.main-timeline12 .timeline:nth-child(2n) .border {
    margin: 18px 0 0
}

.main-timeline12 .timeline-content {
    padding: 15px;
    border: 1px solid #ddd;
    background: #f9f9f9;
    border-radius: 3px;
    transition: all .3s ease 0s
}

.main-timeline12 .timeline:hover .timeline-content {
    background: #555
}

.main-timeline12 .title {
    font-size: 18px;
    font-weight: 700;
    color: #28A7E9;
    text-transform: uppercase;
    margin: 0 0 10px;
    transition: all .3s ease 0s
}

.main-timeline12 .timeline:hover .title {
    color: #fff
}

.main-timeline12 .timeline-content .description {
    font-size: 14px;
    color: #888;
    margin: 0;
    transition: all .3s ease 0s
}

.main-timeline12 .timeline:hover .description {
    color: #fff
}

@keyframes icon-load {
    0% {
        transform: rotate(-12deg)
    }

    8% {
        transform: rotate(12deg)
    }

    10%,28%,30%,48%,50%,68% {
        transform: rotate(24deg)
    }

    18%,20%,38%,40%,58%,60% {
        transform: rotate(-24deg)
    }

    100%,75% {
        transform: rotate(0)
    }
}
/********************mobview Key desc****************/
    /***************getstarted*********/
    section.hero-area{
		background: url("images/getstartedbg_algaeServices.jpg");
		background-size:cover;
	}
	.fun-facts-section {
    background: url(../images/itservices_bg_algaeservices.jpg) center no-repeat;
    background-size: cover;
    position: relative;
    z-index: 1;
    padding-bottom: 0;
}

.fun-facts-02 {
    padding-top: 6rem;
    padding-bottom: 8rem;
    /* padding-bottom: 48px; */
    text-align: center;
}
.fun-facts-section:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, .7);
    z-index: -1;
}
.container::before{
    display: table;
    content: " ";
}
.fun-facts-02 i {
    color: #fff;
    font-size: 48px;
}
[class^="pe-7s-"], [class*=" pe-7s-"] {
    display: inline-block;
    font-family: 'Pe-icon-7-stroke';
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.fun-facts-02 h3 {
    color: #fff;
    font-size: 18px;
}
.fun-facts-02 h3 span {
    display: block;
    font-size: 36px;
    margin-top: 24px;
    margin-bottom: 18px;
}

/***************letstarted*********/
/******************* Timeline Demo - 3 *****************/
.main-timeline3 {
    overflow: hidden;
    position: relative
}


    .main-timeline3:before {
        content: "";
        width: 10px;
        height: 100%;
        border: 3px solid #959595;
        position: absolute;
        top: 40px;
        left: 50%;
        transform: translateX(-50%)
    }

    .main-timeline3 .timeline {
        width: 100%;
        /****padding: 10px 60px 10px 100px;**/
        float: left;
        position: relative
    }

        .main-timeline3 .timeline:before {
            content: "";
            width: 40px;
            height: 40px;
            border-radius: 50%;
            background: #c47c48;
            border: 5px solid #fff;
            box-shadow: 0 0 1px 5px #c47c48;
            position: absolute;
            top: 42px;
            left: -20px
        }

    .main-timeline3 .timeline-content {
        display: block;
        background: #e9e9e7;
        padding: 70px 30px 20px;
        box-shadow: 0 0 10px rgba(0,0,0,.2) inset;
        position: relative
    }

        .main-timeline3 .timeline-content:hover {
            text-decoration: none
        }

    .main-timeline3 .year {
        display: block;
        width: 100%;
        height: 50px;
        background: orange;
        padding: 0 0 0 20px;
        font-size: 18px;
        font-weight: 800;
        color: #fff;
        line-height: 50px;
        box-shadow: 0 0 20px rgba(0,0,0,.4) inset;
        border-radius: 10px 10px 10px 0;
        position: absolute;
        top: 20px;
        left: -20px
    }

        .main-timeline3 .year:before {
            content: "";
            border-top: 40px solid orange;
            border-left: 20px solid transparent;
            border-bottom: 20px solid transparent;
            position: absolute;
            bottom: -60px;
            left: 0
        }

    .main-timeline3 .title {
        font-size: 18px;
        font-weight: 600;
        text-transform: uppercase;
        color: #4a4a4a
    }

    .main-timeline3 .description {
        font-size: 20px;
        color: #6f6f6f;
        margin: 0 0 5px
    }

    .main-timeline3 .timeline:nth-child(2n) {
        padding: 10px 100px 10px 60px;
        text-align: right
    }

        .main-timeline3 .timeline:nth-child(2n):before {
            left: auto;
            right: -20px;
            background: #bf3fc8;
            box-shadow: 0 0 1px 5px #bf3fc8;
        }

        .main-timeline3 .timeline:nth-child(2n) .year {
            padding-right: 50px;
            border-radius: 10px 10px 0;
            left: auto;
            right: -20px;
            background: orange;
        }

            .main-timeline3 .timeline:nth-child(2n) .year:before {
                border-left: none;
                border-right: 20px solid transparent;
                left: auto;
                right: 0;
                border-top-color: orange;
            }

    .main-timeline3 .timeline:nth-child(2) {
        margin-top: 140px
    }

    .main-timeline3 .timeline:nth-child(odd) {
        margin: -15px 0 0
    }

    .main-timeline3 .timeline:nth-child(even) {
        margin-bottom: 60px
    }

    .main-timeline3 .timeline:first-child, .main-timeline3 .timeline:last-child:nth-child(even) {
        margin: 0
    }

    .main-timeline3 .timeline:nth-child(3n):before {
        background: #ce3c41;
        box-shadow: 0 0 1px 5px orange;
    }

    .main-timeline3 .timeline:nth-child(3n) .year {
        background: orange;
    }

        .main-timeline3 .timeline:nth-child(3n) .year:before {
            border-top-color: orange;
        }

    .main-timeline3 .timeline:nth-child(4n):before {
        background: #8cc43d;
        box-shadow: 0 0 1px 5px orange;
    }

    .main-timeline3 .timeline:nth-child(4n) .year {
        background: orange;
    }

        .main-timeline3 .timeline:nth-child(4n) .year:before {
            border-top-color: orange;
        }

@media only screen and (max-width:990px) {

        .main-timeline3:before {
        top: 8%
    }

    .main-timeline3 .timeline {
        padding: 10px 10px 10px 100px
    }

        .main-timeline3 .timeline:nth-child(2n) {
            padding: 10px 100px 10px 10px
        }
}

@media only screen and (max-width:767px) {
.pt-21{
    padding-top:21rem;
}
.title-block {
    width: 90%;
}
.portfolio-thumb, .portfolio-overlay, .port img{
	height:auto!important;
}

        .main-timeline3:before {
        width: 8px;
        top: 0;
        left: 12px;
        transform: translateX(0)
    }

    .main-timeline3 .timeline, .main-timeline3 .timeline:nth-child(even), .main-timeline3 .timeline:nth-child(odd) {
        width: 100%;
        float: none;
        text-align: left;
        padding: 0 0 0 60px;
        margin: 0 0 30px
    }

        .main-timeline3 .timeline:before, .main-timeline3 .timeline:nth-child(2n):before {
            width: 20px;
            height: 20px;
            border: 3px solid #fff;
            top: 38px;
            left: 6px
        }

        .main-timeline3 .timeline:nth-child(2n) .year {
            right: auto;
            left: -20px;
            border-radius: 10px 10px 10px 0
        }

            .main-timeline3 .timeline:nth-child(2n) .year:before {
                border-left: 20px solid transparent;
                border-bottom: 20px solid transparent;
                border-right: none;
                right: auto;
                left: 0
            }
}

/*********************end of Recruitment Partnership***************/
h4 {
    text-align: center;
    margin: 10px 0;
    color: #444
}

.main-timeline {
    position: relative
}

    .main-timeline:before {
        content: "";
        width: 5px;
        height: 100%;
        border-radius: 20px;
        margin: 0 auto;
        background: #242922;
        position: absolute;
        top: 0;
        left: 0;
        right: 0
    }

    .main-timeline .timeline {
        display: inline-block;
        margin-bottom: 50px;
        position: relative
    }

        .main-timeline .timeline:before {
            content: "";
            width: 20px;
            height: 20px;
            border-radius: 50%;
            border: 4px solid #fff;
            background: #ec496e;
            position: absolute;
            top: 50%;
            left: 50%;
            z-index: 1;
            transform: translate(-50%,-50%)
        }

    .main-timeline .timeline-icon {
        display: inline-block;
        width: 130px;
        height: 130px;
        border-radius: 50%;
        border: 3px solid #f9850f;
        padding: 13px;
        text-align: center;
        position: absolute;
        top: 50%;
        left: 30%;
        transform: translateY(-50%)
    }

        .main-timeline .timeline-icon i {
            display: block;
            border-radius: 50%;
            background: #f9850f;
            font-size: 64px;
            color: #fff;
            line-height: 100px;
            z-index: 1;
            position: relative
        }

        .main-timeline .timeline-icon:after, .main-timeline .timeline-icon:before {
            content: "";
            width: 100px;
            height: 4px;
            background: #f9850f;
            position: absolute;
            top: 50%;
            right: -100px;
            transform: translateY(-50%)
        }

        .main-timeline .timeline-icon:after {
            width: 70px;
            height: 50px;
            background: #fff;
            top: 89px;
            right: -30px
        }

    .main-timeline .timeline-content {
        width: 50%;
        padding: 0 183px;
        margin: 52px 138px 0;
        float: right;
        position: relative
    }

        .main-timeline .timeline-content:before {
            content: "";
            width: 70%;
            height: 100%;
            border: 3px solid #f9850f;
            border-top: none;
            border-right: none;
            position: absolute;
            bottom: -13px;
            left: 160px
        }

        .main-timeline .timeline-content:after {
            content: "";
            width: 37px;
            height: 3px;
            background: #f9850f;
            position: absolute;
            top: 13px;
            left: 0
        }

    .main-timeline .title {
        font-size: 20px;
        font-weight: 600;
        color: #f9850f;
        text-transform: uppercase;
        margin: 0 0 5px
    }

    .main-timeline .description {
        display: inline-block;
        font-size: 16px;
        color: #404040;
        line-height: 20px;
        letter-spacing: 1px;
        margin: 0
    }

    .main-timeline .timeline:nth-child(even) .timeline-icon {
        left: auto;
        right: 30%
    }

        .main-timeline .timeline:nth-child(even) .timeline-icon:before {
            right: auto;
            left: -100px
        }

        .main-timeline .timeline:nth-child(even) .timeline-icon:after {
            right: auto;
            left: -30px
        }

    .main-timeline .timeline:nth-child(even) .timeline-content {
        float: left
    }

        .main-timeline .timeline:nth-child(even) .timeline-content:before {
            left: auto;
            right: 35px;
            transform: rotateY(180deg)
        }

        .main-timeline .timeline:nth-child(even) .timeline-content:after {
            left: auto;
            right: 0
        }

    .main-timeline .timeline:nth-child(2n) .timeline-content:after, .main-timeline .timeline:nth-child(2n) .timeline-icon i, .main-timeline .timeline:nth-child(2n) .timeline-icon:before, .main-timeline .timeline:nth-child(2n):before {
        background: #f9850f;
    }

    .main-timeline .timeline:nth-child(2n) .timeline-icon {
        border-color: #f9850f;
    }

    .main-timeline .timeline:nth-child(2n) .title {
        color: #f9850f;
    }

    .main-timeline .timeline:nth-child(2n) .timeline-content:before {
        border-left-color: #f9850f;
        border-bottom-color: #f9850f;
    }

    .main-timeline .timeline:nth-child(3n) .timeline-content:after, .main-timeline .timeline:nth-child(3n) .timeline-icon i, .main-timeline .timeline:nth-child(3n) .timeline-icon:before, .main-timeline .timeline:nth-child(3n):before {
        background: #f9850f;
    }

    .main-timeline .timeline:nth-child(3n) .timeline-icon {
        border-color: #f9850f;
    }

    .main-timeline .timeline:nth-child(3n) .title {
        color: #f9850f;
    }

    .main-timeline .timeline:nth-child(3n) .timeline-content:before {
        border-left-color: #f9850f;
        border-bottom-color: #f9850f;
    }

    .main-timeline .timeline:nth-child(4n) .timeline-content:after, .main-timeline .timeline:nth-child(4n) .timeline-icon i, .main-timeline .timeline:nth-child(4n) .timeline-icon:before, .main-timeline .timeline:nth-child(4n):before {
        background: #f9850f;
    }

    .main-timeline .timeline:nth-child(4n) .timeline-icon {
        border-color: #f9850f;
    }

    .main-timeline .timeline:nth-child(4n) .title {
        color: #f9850f;
    }

    .main-timeline .timeline:nth-child(4n) .timeline-content:before {
        border-left-color: #f9850f;
        border-bottom-color: #f9850f;
    }
	   @media only screen and ( max-width: 767px) {
			#home{
			background: url(../images/homebannerconnectalgaeservices.jpg) no-repeat;
    background-size: cover;
		}
#home h1 span {
    color: #00!important;
    font-size: 20px;
    font-weight: bold;
}
        .productimg {
            height: 12.5rem;
        }
    }
    @media only screen and (max-width:350px){
    .card-body.testimonialpara{
        height: 56vh!important;
    }
}
@media only screen and (max-width:523px){
	.crackin-ul {
    padding-left: 40px;
}
}
@media only screen and (min-width) and (max-width:800px){
	.crackin-ul {
    padding-left: 72px;
}
}
@media (max-width:1023px){
	.portfolio-section .portfolio-category {
    display: grid!important;
}
.corporate ul, .corporate h4{
	padding-left:1rem;
}
	canvas.vc_round-chart-canvas {
    width: 250px!important;
    margin: auto;
    height: 250px!important;
}
	.submit-button{
		font-weight: 600;
    font-size: 13px;
    height: 37px;
    padding-left: 5%;
	}

	.itbanner{
		display:none;
	}
    .filters .nav{
        padding: 0px!important;
        margin-left: 0px!important;
        margin-top: 0px!important;
    }
    .gallery{
        width:100%!important;
    }
    .category img{
        position: inherit;
        margin:auto;
        margin-top:-43px;
    }
    .category{
        text-align: center;
    }
    .report-module .thumbnail{
        margin-top:-18rem;
        height: 33vh;
    }
    .report-module .card-body{
        position: inherit;
        
    }
}
@media only screen and (max-width:1200px) {
    .main-timeline .timeline-icon:before {
        width: 50px;
        right: -50px
    }

    .main-timeline .timeline:nth-child(even) .timeline-icon:before {
        right: auto;
        left: -50px
    }

    .main-timeline .timeline-content {
        margin-top: 75px
    }
}

@media only screen and (max-width:990px) {
    .main-timeline .timeline {
        margin: 0 0 10px
    }

    .main-timeline .timeline-icon {
        left: 25%
    }

    .main-timeline .timeline:nth-child(even) .timeline-icon {
        right: 25%
    }

    .main-timeline .timeline-content {
        margin-top: 115px;
        margin-left:0px;
    }
}

@media only screen and (max-width:767px) {
    .main-timeline {
        padding-top: 50px
    }

        .main-timeline:before {
            left: 80px;
            right: 0;
            margin: 0
        }

        .main-timeline .timeline {
            margin-bottom: 70px
        }

            .main-timeline .timeline:before {
                top: 0;
                left: 83px;
                right: 0;
                margin: 0
            }

        .main-timeline .timeline-icon {
            width: 60px;
            height: 60px;
            line-height: 40px;
            padding: 5px;
            top: 0;
            left: 0
        }

        .main-timeline .timeline:nth-child(even) .timeline-icon {
            left: 0;
            right: auto
        }

            .main-timeline .timeline-icon:before, .main-timeline .timeline:nth-child(even) .timeline-icon:before {
                width: 25px;
                left: auto;
                right: -25px
            }

            .main-timeline .timeline-icon:after, .main-timeline .timeline:nth-child(even) .timeline-icon:after {
                width: 25px;
                height: 30px;
                top: 44px;
                left: auto;
                right: -5px
            }

        .main-timeline .timeline-icon i {
            font-size: 30px;
            line-height: 45px
        }

        .main-timeline .timeline-content, .main-timeline .timeline:nth-child(even) .timeline-content {
            width: 100%;
            margin-top: -15px;
            padding-left: 130px;
            padding-right: 5px
        }

        .main-timeline .timeline:nth-child(even) .timeline-content {
            float: right
        }

            .main-timeline .timeline-content:before, .main-timeline .timeline:nth-child(even) .timeline-content:before {
                width: 50%;
                left: 120px
            }

            .main-timeline .timeline:nth-child(even) .timeline-content:before {
                right: auto;
                transform: rotateY(0)
            }

            .main-timeline .timeline-content:after, .main-timeline .timeline:nth-child(even) .timeline-content:after {
                left: 85px
            }
}

@media only screen and (max-width:479px) {
    .main-timeline .timeline-content, .main-timeline .timeline:nth-child(2n) .timeline-content {
        padding-left: 252px;
    }

        .main-timeline .timeline-content:before, .main-timeline .timeline:nth-child(2n) .timeline-content:before {
            left: 208px;
        }

        .main-timeline .timeline-content:after, .main-timeline .timeline:nth-child(2n) .timeline-content:after {
            left: 65px;
        }
}

@media only screen and (max-width:990px) {
    .main-timeline12 .timeline {
        margin-bottom: 20px
    }
}

@media only screen and (max-width:767px) {
    .main-timeline12 .timeline-icon {
        padding-top: 0
    }

    .main-timeline12 .timeline:nth-child(2n) .timeline-icon {
        padding-bottom: 0
    }

    .main-timeline12 .border {
        margin-bottom: 10px
    }

    .main-timeline12 .timeline:nth-child(2n) .border {
        margin: 10px 0 0
    }

    .main-timeline12 .timeline-content {
        text-align: center
    }
}


@media only screen and ( max-width: 980px ) {
    #team .team-wrapper {
        margin-top: 40px;
    }

    #portfolio .portfolio-thumb .portfolio-overlay {
        background: #000000;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        position: absolute;
        padding: 40px 10px 20px 20px;
        -webkit-transition: all 0.4s ease-in-out;
        transition: all 0.4s ease-in-out;
    }
}
/* end 360 media quires */

/* start 768 media quires **/

@media only screen and ( max-width: 767px ) {
    #portfolio .portfolio-thumb .portfolio-overlay .btn{
        margin-top:-213px!important;
        margin-left: 24rem!important;
    }
   .regularclient img{
       height:200px!important;
    }
    .mb9rem{
        margin-bottom:9rem;
    }
    #footer {
       /**position: fixed;
        height: 100px;
        bottom: 0;
        width: 100%;******/
    }

    #home {
        min-height: 300px;
        padding-top: 80px;
        padding-bottom: 60px;
    }

        #home h1 {
            font-size: 52px;
        }

    .templatemo-nav {
        position: fixed;
        top: 0;
    }

    header {
        margin-top: 70px;
    }

        header .social-icon {
            text-align: left;
        }

    .navbar-toggle {
        margin-top: 15px;
    }

    .navbar-collapse {
        max-height: 300px;
        overflow-y: auto;
    }

    .navbar-default .navbar-nav li a {
        height: 45px;
        padding-top: 5px;
        padding-bottom: 5px;
        line-height: 35px;
    }
}
/* end 768 media quires */

/* start 360 media quires */
@media only screen and ( max-width: 360px ) {
    header .social-icon {
        text-align: left;
    }
}
@media (max-width: 991px) {
	.submit-button, .menu-button{
		text-align:left;
		display:block;
	}
	.menu-button {
    color: #fff;
    background: orange;
    width: 100%;
}
.panel-title:after {
    font-family: FontAwesome;
    content: "\f107";
    float: right;
    color: grey;
}
    .webview {
        display: none !important;
    }

    .mobview {
        display: block;
    }
    .borderradiusgap {
        padding: 0px;
    }

    .order-md-1 {
        padding-top: 4rem;
    }

    #about, #team,#service, #portfolio, #contact {
        padding-top: 0px;
        padding-bottom: 0px;
    }

    #portfolio {
        padding-bottom: 0px;
    }

    .first-col {
        padding: 0rem 2rem;
    }

    .counselSlide .card {
        padding: 2rem;
    }

    .slick-dotted.slick-slider {
        margin-bottom: 73px !important;
    }

    .slick-dots {
        bottom: -53px !important;
    }

    .tabbg::after {
        height: -webkit-fill-available;
    }

    #footer .card-deck {
        display: block;
    }

    .regularanimate {
        height: -webkit-fill-available;
    }
}
    @media (max-width: 767px) {
        #contact address span {
            padding-bottom: 0px;
        }

        .tabbg::after {
            top: 0px !important;
        }



       
    }

    @media (min-width: 992px) {
        .webview {
            display: block;
        }

        .mobview {
            display: none;
        }

        .vision img {
            display: none !important;
        }

        .paddingbanneraside {
            padding: 15rem 6rem;
        }
    }

    @media only screen and (min-width: 1049px) {
        .card-deck {
            display: flex;
        }
    }

    @media only screen and (max-width: 1049px) {
        .card-deck {
            display: block;
        }

        .mtimg1 {
            height: 50%;
            margin-top: -1rem;
        }

        .serviceimg {
            height: 55%;
        }

        .blogimg {
            height: 39%;
        }

        .followimg {
            margin-top: -3rem;
            height: 61%;
        }
    }



    @media (max-width: 340px) {
        .report-module .thumbnail {
            height: 43vh;
        }

            .report-module .thumbnail img {
                height: 42vh;
            }
    }

    #contact address span {
        padding-bottom: 0px;
    }
    /* end 360 media quires */