@import url('https://fonts.googleapis.com/css?family=Poppins&display=swap');
html,body{
    height: 100%;
    width: 100%;
    font-family: 'Poppins', 'sans-serif';
    color: #222;
}


/* Navbar css */
/* .navbar{
    /* padding: 0.5%; */
 
    .navbar-brand{
        padding: 0%!important;
    }
.navbar-brand img{
    top: 50%;
    /* height: 10rem; */
    width: 17rem;
}
.navbar-nav li{
    font-size: 20px;
    padding-right: 50px;
}
.nav-link{
    color: #e71952!important;
    transition-duration: .8s;
    /* font-size: 1.1rem !important; */
}
.nav-link:hover{
    color: grey!important;
    transition: ease-in-out;
}
/* navbar css ends */

/* carousel css */
.carousel-inner img{
    width: 100%;
    height: 600px;
}
.carousel-caption{
    position: absolute;
    top: 55%;
}
.carousel-caption h2{
    font-size: 400%;
    text-transform: uppercase;
    text-shadow: 10px 10px 15px #222;
}
.carousel-caption h3{
    font-size: 200%;
    font-weight: 500;
    text-shadow: 10px 10px 15px #222;
    padding-bottom: 1rem;
}
.btn-primary{
    background-color: blueviolet;
    border: 1px solid rgb(160, 111, 206);
    transition-duration: 0.5s;
}
.btn-primary:hover{
    background-color: rgb(48, 16, 78);
    border: 1px solid rgb(160, 111, 206);
    transition: ease-in-out;
}
/* carousel css ends */

/* Details css */

.welcome{
    width: 75%;
    margin: 0 auto;
    padding-top: 2rem;
}
.welcome hr{
    border-bottom: 2px solid #b4b4b4;
    width: 95%;
    margin-top: 0.3rem;
    margin-bottom: 1rem;
}
.welcome h1{
    padding-top: 60px;
    font-size: 300%;
    font-weight: 500;
}

/* Details css ends */

/* Cards */


#app-features .contain{
    text-align: center;
}


/* Cards Ends */
.my-4{
    border-bottom: 2px solid #b4b4b4;
}
.social a{
    font-size: 4em;
    padding: 3rem;
}
.fa-facebook{
    color: #3b5998;
}
.fa-twitter{
    color: #00aced;
}
.fa-google-plus-g{
    color: #dd4b39;
}
.fa-instagram{
    color: #405DE6;
}
.fa-youtube{
    color: #bb0000;
}

footer{
    background-color: #3f3f3f;
    color: #d5d5d5;
    padding-top: 2rem;
    margin-top: 6rem;
}
.Phone:hover{
    color: #d5d5d5;
}
hr.light{
    border-top: 1px solid #d5d5d5;
    width: 75%;
    margin-top: .8rem;
    margin-bottom: 1rem;
}
footer a{
    color: #d5d5d5;
}
hr.light-100{
    border-top: 1px solid #d5d5d5;
    width: 100%;
    margin-top: .8rem;
    margin-bottom: 1rem;
}
.fa-heart{
    color: red;
    padding: .5%;
}
.Name:hover{
    color: #d5d5d5;
}









/* Media Queries */
@media (max-width: 992px){
    .social a{
        font-size: 4em;
        padding: 2rem;
    }
    .carousel-caption h2{
        font-size: 350%;
        text-transform: uppercase;
        text-shadow: 10px 10px 15px #222; 
    }
    .carousel-caption h3{
        font-size: 150%;
        font-weight: 400;
        text-shadow: 10px 10px 15px #222; 
        padding-bottom: .3rem;
    }
}
@media (max-width: 768px){
.carousel-caption{
    top: 55%;
}
.carousel-caption .btn{
    font-size: 95%;
    padding: 8px 14px;
}
.carousel-caption h2{
    font-size: 250%;
    text-transform: uppercase;
    text-shadow: 10px 10px 15px #222; 
}
.carousel-caption h3{
    font-size: 100%;
    font-weight: 400;
    text-shadow: 10px 10px 15px #222; 
    padding-bottom: .3rem;
}
.social a{
    font-size: 2.5em;
    padding: 1.2rem;
}
}
@media(max-width:576px){
    .carousel-caption{
        top: 40%;
    }
    .carousel-caption .btn{
        font-size: 90%;
        padding: 4px 8px;
    }
    .carousel-caption h2{
        font-size: 200%;
        text-transform: uppercase; 
    }
    .carousel-caption h3{
        font-size: 90%;
        font-weight: 400;
        padding-bottom: .3rem;
    }
    .carousel-indicators{
        display: none;
    }
    .social a{
        font-size: 2em;
        padding: 0.8rem;
    }
    .display-3{
        font-size: 60px!important;
    }
}