/* font-family: 'Open Sans', sans-serif; */

/*Start Navbar*/

.navbar
{
    background-color: rgba(0, 0, 0, .3);
    border-bottom: 1px solid rgba(255, 255, 255, .7);
    padding: 0;
    z-index: 99999;
}
.navbar-nav
{
    font-weight: 600;
}
.nav-item .nav-link
{
    color: #fff !important;
}
.bezel-social a
{
    margin-right: 8px;
}
.nav-social
{
  border-left: 1px solid rgba(255, 255, 255, .7); 
  height: 52px;
  left: 50%; 
  margin-left: -1px; 
  top: 0;
}
.bezel-social
{
    margin-top: 16%;
    margin-left: 20px;
}
.bezel-social a
{
    transition: all 1s ease-in-out;
}
.bezel-social a:hover
{
    color: #ddd !important;
}
.d-md-block
{
    top: 50%;
}
.home-heading
{
    font-size: 5rem;
}
.btn-more
{
    background-color: #00c3da;
    color: #fff;
    padding: 8px 15px;
    transition: all 1s ease-in-out;
}
.btn-more:hover{
   background-color: #00c3dad9;
}
.btn-contact
{
    background-color: transparent;
    border: 1px solid rgba(255,255,255.9);
    padding: 8px 15px;
    transition: all 1s ease-in-out;
}
.btn-contact:hover{
    background-color: #fff;
    color: #000 !important;
}
@media all and (max-width:992px)
{
    .bezel-social,.nav-social
    {
        display: none;
    }
}

/*Start Header*/
.home .overlay
{
    background: rgba(0, 0, 0, .3);
    width: 100%;
    height: 100%;
}
.home .carousel-item img
{
    opacity: .7;
}
.home .carousel-control-next
{
    width: 2% !important;
    border: 1px solid rgba(255,255,255.9);
    left: 0;
    top: 45.5%;
    transition: all 1s ease-in-out;
}
.home .carousel-control-prev 
{
    width: 3.1% !important;
    border: 1px solid rgba(255,255,255.9);
    height: 0;
    top: 48.5% ;
    padding: 20px;
    transition: all 1s ease-in-out;
}
.home .carousel-control-prev:hover,.home .carousel-control-next:hover 
{
    background: #fff;
    
}
.home .carousel-control-next:hover .fa-long-arrow-alt-left
{
    color: #000 !important;
}
.home .carousel-control-prev:hover .fa-long-arrow-alt-right
{
    color: #000 !important;
}
@media all and (max-width:1370px)
{
    .home .carousel-control-prev 
    {
        top: 48.5%;
    }
}

@media all and (max-width:768px)
{
    .home-heading
    {
        font-size: 3.5rem;
    }
}
@media all and (max-width:576px)
{
    .home-heading
    {
        font-size: 3rem;
    }
}
@media all and (max-width:500px)
{
    .home-heading
    {
        font-size: 2rem;
    }
}
/*Start Who*/

.who
{
    position: relative;
}
.who-heading
{
    font-size: .8rem;
    font-weight: 500px;
    letter-spacing: .01rem;
}
.who-paragraph
{
    font-size: 1.2rem;
    font-weight: 400;
    max-width: 85%;
    line-height: 1.6;
    color: #787878;
}
.paragraph-animate{
   color: #00c3da !important;
   overflow: hidden;
   white-space: nowrap;
   border-right: 4px solid #fff;
   -webkit-animation: type 2s steps(8) infinite ;
           animation: type 2s steps(8) infinite ;
   -webkit-animation-delay: 2s;
           animation-delay: 2s;
   display: inline-flex;

}

@keyframes type{
   0%{
       width: 0ch;
   }
   100%
   {
        width: 10ch;   
   }    
}

.who-btn
{
   padding: 15px 30px;
   font-size: 14px;
   background: #fff;
   border: 1px solid rgba(222,222,222,.7);
}
.who-btn:hover
{
   background-color: #1f1f1f;
   border-color: #1f1f1f;
   color: #fff;
}

/*Start Team*/

.team
{
    border-top:1px solid rgba(238, 238, 238, .7) ;
}
.team-heading
{
    position: relative;
    font-size: 40px;
    font-weight: 700;
}
.team-heading::before
{
    position: absolute;
    content: "C";
    color: #f1f1f1;
    left: 50%;
    transform: translate(-50%);
    top: -23px;
    font-weight: 900;
    opacity: .6;
    font-family: sans-serif;
    font-size: 4rem;
    z-index: -5;
}
.team-per-heading
{
    font-size: 1.01rem;
    color: #787878;
}
.team-imag
{
    position: relative;
	display: inline-block;
	overflow: hidden;
	max-width: 100%;
	height: auto;
}
.team-imag img
{
    max-width: 100%;
}

.team-imag .overlay
{
    -moz-transform: translateY(100%);
	-webkit-transform: translateY(100%);
	-ms-transform: translateY(100%);
    transform: translateY(100%);
    opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	background: rgba(21, 193, 211, 0.6);
	color: #fff;
	padding: 15px;
	-moz-transition: all 0.4s ease-in-out 0s;
	-webkit-transition: all 0.4s ease-in-out 0s;
	-ms-transition: all 0.4s ease-in-out 0s;
	transition: all 0.4s ease-in-out 0s;
}
.team-imag:hover .overlay
{
    -moz-transform: translateY(0);
	-webkit-transform: translateY(0);
	-ms-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
}
.team-imag .text
{
    position: absolute;
    bottom: 1.2rem;
}
.team-imag .text h6
{
    font-size: .9rem;
}
.team-imag .text p
{
    font-size: .6rem;
}
.team-social-link
{
    margin-right: 5px;
}


/*Start What We Do*/

.we-do
{
    background-image: linear-gradient(to right,#00bfd6, #00b9cf, #00bcd2, #00c0d7,#00c1d8,#00c1d9);
}
.we-social
{
    font-size: 3rem;
    color: #00ac9e;
}
.we-do h4
{
    font-size: 1.1rem;
    font-weight: 400;
}

.we-heading
{
    position: relative;
}
.we-top
{
    flex-wrap: wrap;
}
.we-heading::before
{
    position: absolute;
    content: "W";
    color: #f1f1f1;
    left: 8.5%;
    transform: translate(-50%);
    top: -31px;
    font-weight: 900;
    opacity: .1;
    font-family: sans-serif;
    font-size: 4rem;
}
.we-per-heading
{
    font-size: 1.01rem;
    color: #787878;
}
.we-paragraph
{
    font-size: .9rem;
    font-weight: 600;
    line-height: 1.6;
}
.we-middle-paragraph
{
    position: relative;
}
.we-middle-paragraph::before
{
    position: absolute;
    content: "\f00c";
    font-family: "Font Awesome 5 Free";
    display: inline-block;
    vertical-align: middle;
    font-weight: 900;
    margin-left: -22px;
    border: 1px solid #fff;
    border-radius: 50%;
    width: 17px;
    text-align: center;
    font-size: 11px;
    top: 5px;
}
@media all and (max-width:991px)
{
    .we-heading::before
    {
    position: absolute;
    content: "W";
    color: #f1f1f1;
    left: 50%;
    transform: translate(-50%);
    top: -31px;
    font-weight: 900;
    opacity: .1;
    font-family: sans-serif;
    }
}
@media all and (max-width:768px) 
{
    .we-middle
    {
        margin-top: .5rem;
    }
}
@media all and (max-width:576px)
{
    .we-caption
    {
        text-align: center;
    }
}
/*Start Pricing*/

.pricing
{
    background-color: #f7f7f7;
}
.price-heading
{
    position: relative;
    z-index: 888;
    font-size: 40px;
    font-weight: 700;
}
.price-heading::before
{
    position: absolute;
    content: "C";
    color: #f1f1f1;
    left: 50%;
    transform: translate(-50%);
    top: -27px;
    font-weight: 900;
    opacity: .6;
    font-family: sans-serif;
    font-size: 4rem;    
    z-index: -1;

}
.price-shadow:hover
{
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.price-per-heading
{
    font-size: 1.01rem;
    color: #787878;
}

.btn-hover {
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    cursor: pointer;
    text-align: center;
    border: none;
    background-size: 300% 100%;
    border-radius: 10px;
    padding: 10px 16px;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.btn-hover:hover {
    background-position: 100% 0;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.btn-hover:focus {
    outline: none;
}
.btn-hover.color-9 {
    background-image: linear-gradient(to right, #25aae1, #4481eb, #04befe);
    box-shadow: 0 4px 15px 0 rgba(65, 132, 234, 0.75);
}
.price-paragraph
{
    color: #979797;
}
.price-sup
{
    font-size: 3.5rem;
    font-weight: 600;
}
hr
{
    margin-top: 0 !important;
}
.value-price
{
    position: absolute;
    right: 35px;
    top: 45px;
    background: #00c3da;
    border-radius: 8px;
    padding: 4px;
}
/*Start Customer*/

.customer
{
    background-color: #f7f7f7;
}
.cust-head
{
    font-size: 16px;
    font-weight: 400;
}
.customer-content
{
    max-width: 85%;
    margin-top: 5rem;
    margin-bottom: 5rem !important;

}
.customer-img img
{
    position: absolute;
    border-radius: 50%;
    width: 15%;
    transform: translate(-50%,-50%);
    top: 0;
}
.testimonial-info
{
    display: inline-block;
    margin-bottom: 1rem;
    color: #878787;
    font-size: .9rem;
}
.customer-paragraph
{
    font-size: 1.1rem !important;
}
.customer .carousel-inner {
    padding-top: 20px;
}
.customer .carousel-indicators li
{
    background-color: #ddd;
    height: 15px;
    border-radius: 50%;
    width: 15px;
  
}
.customer .carousel-indicators .active
{
    background-color: #00c3da !important;
}
.customer .fa-long-arrow-alt-left,.fa-long-arrow-alt-right
{
    transition: all 1s ease-in-out;
}
.customer .fa-long-arrow-alt-left:hover
{
    transform: translateX(-20px);
}
.customer .fa-long-arrow-alt-right:hover
{
    transform: translateX(20px);
}
.customer .carousel-control-prev,.carousel-control-next
{
    top: 50%;
    height: 0;
    padding: 20px;
    transform: translateY(-50%);
}
@media all and (max-width:991px)
{
   .customer .carousel-control-prev
    {
        display: none;
    }
    .customer .carousel-control-next
    {
        display: none;
    }
}
/*Start Contact*/


.contact-heading
{
    position: relative;
    font-size: 40px;
    font-weight: 700;
}
.contact-heading::before
{
    position: absolute;
    content: "G";
    color: #f1f1f1;
    left: 3%;
    transform: translate(-50%);
    top: -15px;
    font-weight: 900;
    opacity: .6;
    font-family: sans-serif;
    font-size: 3rem;
    z-index: -5;
}
.contact-per-heading
{
    font-size: 1.01rem;
    color: #787878;
}

.form-group textarea
{
    resize: none;
}
.contact input
{
    height: 2.8rem;
}
.google-link
{
    bottom: 1%;
}

@media all and (max-width: 631px) 
{
    .map iframe
    {
        width: 100%;
        height: 600px;
    }
}

