/* general styles */
a{text-decoration: none;}

/* general styles */

/* component */

.text-white{color: white}
.text-gray{color: #9c9fa0}
.main1-bg{background-color:#0c9ed3!important}
.main1-cl{color:#0c9ed3!important}
.main2-bg{background-color:#ec1c23!important}
.main2-cl{color:#ec1c23}
.overlay{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 1;
}
.relative{position: relative;}
.border-raduis{border-radius: 50%;}
.transition{
    transition: all 0.8s ease;
}
/* component */

/* info */
.info .quote{    
    background-color: transparent;
    border: none;
    border: 1px solid #f00;
    padding-left: 15px;
    padding-right: 15px;
}

/* info */

/* navbare */

.navbar-light .navbar-nav .active>.nav-link,
.navbar-light .navbar-nav .nav-link:hover{
    color: #ec1c23!important;
}

/* navbare */

/* front slider */

.front-slider{background-color: #0c9ed3;}
.front-slider .carousel,
.front-slider .carousel .carousel-inner,
.front-slider .carousel .carousel-inner .carousel-item{height: 100%;}
.front-slider .carousel .carousel-inner .carousel-item:first-of-type{background: url('../images/imagec1.jpg');background-size: cover;}
.front-slider .carousel .carousel-inner .carousel-item:nth-of-type(2){background: url('../images/image2.jpg');background-size: cover;}
.front-slider .carousel .carousel-inner .carousel-item:last-of-type{background: url('../images/imagec3.jpg');background-size: cover;}
.front-slider .slider-inf{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
    line-height: 1.8;
}
@media (max-width: 576px) { 
    .front-slider .slider-inf{
       font-size: 125%;
    }
}
/* front slider */

/* services */
.services .service div:first-child i{
    width: 4.5vw;
    height: 4.5vw;
    text-align: center;
    line-height: 4.5vw;
}
@media (max-width: 991px) { 
    .services .service div:first-child i{
        width: 6vw;
        height: 6vw;
        line-height: 6vw;
    }
}
@media (max-width: 576px) { 
    .services .service div:first-child i{
        width: 13vw;
        height: 13vw;
        line-height: 13vw;
    }
}
/* services */

/* company overview */
.overview{
    background-color: #f0f5f7;
}
.overview p{
    width: 60%;
    margin: auto;
}
.overview a:hover{
    text-decoration: none;
    cursor: pointer;
    background-color: #e07377;
    color: #000!important;
}
/* company overview */

/* featured work */
.featured-work p{
    width: 60%;
    margin: auto;
}
.featured-work .feat-menu{
    display: flex;
    justify-content: space-between;
}
.featured-work .feat-menu li{
    cursor: pointer;
    border: 1px solid #0c9ed3;
    padding: 2px 5px;
}
.featured-work .feat-menu li.active,
.featured-work .feat-menu li:hover{
    border: 1px solid #ec1c23;
    background: #ec1c23;
    color: #fff!important;
}
.featured-work .works{
    display: flex;
    flex-wrap: wrap;
}
.featured-work .works .work{
    width: 25%;
    cursor: pointer;
    position: relative;
}
.featured-work .works .work img{
    width: 100%;
}
.featured-work .works .work .main-overlay{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: rgba(57, 117, 138, 0.6);
    opacity: 0;
}
.featured-work .works .work .main-overlay:hover{opacity: 1;}
@media (max-width: 767px) { 
    .featured-work .feat-menu{
        flex-direction: column;
    }
    .featured-work .feat-menu li{
        margin-bottom: 15px;
    }
}
@media (max-width: 576px) { 
    .featured-work .works .work{
        width: 50%;
    }
}
/* featured work */

/* latest posts */
.latest-posts .description{width: 60%;margin:auto;}
/* latest posts */

/* our team  */
.team{
    background: url('../images/technology-785742_1920.jpg') center center;
    background-size: cover;
}
.team .carousel{
    z-index: 10;
    padding: 100px 0;
}
.team .carousel .carousel-inner .carousel-item{text-align: center;}
.team .carousel .carousel-inner .carousel-item p{width: 60%;margin: auto}
.team .carousel .carousel-inner .carousel-item .team-member .image{width: 100px;height:100px;margin: auto;border-radius: 50%;overflow: hidden;}
.team .carousel .carousel-inner .carousel-item .team-member .image img{width: 100%;height: 100%;}
/* our team  */

/* pricing tables */
.latest-posts{
    background-color: #f7f7f7;
}
.latest-posts .plans{
    display: flex;
    justify-content: space-between;
}
.latest-posts .plans .plan{
    width: 30%;
    background-color: #fff;
    box-shadow: 2px 2px 10px #ddd;

}
.latest-posts .plans .plan .price{background-color: #f9f9f9;};
.latest-posts .plans .plan .price .small{font-size: 80%;}

@media (max-width: 767px) { 
    .latest-posts .plans{
        flex-direction: column;
        justify-content: normal;
    }
    .latest-posts .plans .plan{
        width: 100%;
        margin-bottom: 20px;
    }
    .latest-posts .plans .plan:nth-last-of-type(2){
        bottom: 0!important;
    }
}
/* pricing tables */

/* shooce us */
.choose-us{display: flex;}
.choose-us .choose-us-image{width: 50%;}
.choose-us .choose-us-image img{width: 100%;height: 100%;}
.choose-us .choose-us-text{width: 50%;background-color: #08526d;}
.choose-us .choose-us-text p{color: #f7f7f7;}
.choose-us .choose-us-text a{cursor: pointer!important;}
@media (max-width: 767px) { 
    .choose-us{flex-direction: column}
    .choose-us .choose-us-image{width: 100%;}
    .choose-us .choose-us-text{width: 100%;}
}
/* shooce us */

/* statistics */
.contact-us p{
    font-size: 1.5rem;
    margin: 0
}
.contact-us button{
    background-color: transparent;
    border: 1px solid #fff;
    padding: 0.5rem 1.5rem;
}
.contact-us button:hover{
    background-color: #e07377
}
/* statistics */

/* footer */
footer .copy-rights{
    border: 1px solid #ddd;
}
/* footer */

/* got to top button */
.to-top{
    position: fixed;
    right: 30px;
    bottom: 30px;
    cursor: pointer;
    display: none;
}
/* got to top button */