body {
    background-color: #F2F2F2;
    /* font-family: Arial, Helvetica, sans-serif; */
    font-family: 'Noticia Text', serif;
}

h1, h2, p {
    /* font-family: 'Edu SA Beginner', cursive; */
}

a {
    /* font-family: 'Noticia Text', serif; */
    font-weight: 1000;
    font-size: 1.6rem;
}

h1, h2 {
    font-weight: 600;
}

p {
    font-weight: 400;
}


/* Logo */

.navbar-brand {
    padding-right: 20px; 
    padding-left: 100px;
}


/* Start of the scroller */

#scroller {
    background: rgb(238, 230, 230);
    box-shadow: 3px 2px #888888;
    height: 35px;
    width: 35px;
    border-radius: 8px;
    color: rgb(31, 2, 2);
    display: inline-block;
    text-align: center;  
    font-size: 21px;
    padding: 5px 3px 1px 3px;   
    position: fixed;
    bottom: 10px;
    right: 10px;  
    cursor: pointer;    
    transition: 0.8s; 
    z-index: 2;
}

#scroller:hover {
    background: #fff;
} 

/* End of the scroller */

/* Start of the navbar css */

nav a {
    font-size: 25.6px;
}

.navbar-light .navbar-nav .nav-link {
    /* color:rgba(9, 152, 9, 0.837); */
    color: black;
    padding: 0px 15px;
} 

.bg-light {
    padding: 0px;
}


.navbar-light .navbar-nav .nav-link:hover ,
.dropdown-item:hover {
    background: rgb(131, 132, 143);
    color: white;
}

/* Navbar links separator */

@media only screen and (min-width: 992px) {
    .navbar .navbar-nav .nav-item .nav-link {
      /* padding: 0 0.5em; */
    }
    .navbar .navbar-nav .nav-item:not(:last-child) .nav-link {
      border-right: 2px solid rgb(131, 132, 143);
    }
    .navbar .navbar-nav .nav-item .first-link {
      border-left: 2px solid rgb(131, 132, 143);
    }
  }

  nav  ul  li {
    padding-left: 15px;
  }


/* End of the navbar css */

/* Start of the carousel */

.carousel .carousel-item {
    height: 600px;
}

.carousel-item img {
    position: absolute;
    object-fit:cover;
    top: 0;
    left: 0;
    min-height: 500px;
}


section .carousel h2 {
    color:#ffff;
}

section .carousel p {
    color:#ffff;
    font-weight: bolder;
    font-size: 1.8rem;
}

section .carousel-caption, .sec-cap, .thir-cap {
    background: rgba(0, 0, 0, 0.3);
    border-radius: 35px;
    padding: 20px 20px;
    width: 500px;
    height: 240px;
}

section .first-cap {
    left: 35%;
    top: 179px;
}

section .sec-cap {
    left: 35%;
    top: 179px;
    width: 550px;
}

section .thir-cap {
    left: 35%;
    top: 179px;
}

.first-cap h2, .sec-cap h2, .thir-cap h2 {
    font-size: 4rem;
}


/* End of the carousel */

/* Start of the About Us Section using icons */

#about-us .fa-primary {
    color:rgb(106,99,254);
}

#about-us span {
    color: rgb(106,99,254);
    line-height: 22.85px;
    font-size: 20px;
}

hr {
    border: 0;
    clear:both;
    display:block;
    width: 96%;               
    background-color:#0068b5;
    height: 1px;
}

/* End of the About Us Section using icons */


/* Start of the footer */

footer {
    background: #e7e7e7;
}

footer a {
    color: black;
    font-weight: 500;
}

footer div p > a {
    font-size: 1rem;
}


/* End of the footer */

/* Start of adjusting navbar on all screens */

.navbar {
    border: 1px solid black;
    position: absolute; 
    padding-right: 200px;
    top: 10px;
    /* right: 40%; */
    /* left: 25%; */
    left: 200px;
    right: 200px;
    z-index: 2;
}

nav .navbar-nav {
    margin-left: 65px;
}

@media (min-width: 319px) and (max-width: 1348px) {
    .navbar { 
      right: 5px;
      left: 5px;
      padding-right: 0px;
    }

    .navbar .navbar-brand {
        padding-left: 10px;
    }
}

.navbar {
    border-radius: 36px;
}


#main-body {
    margin-bottom: 100px;
}

#main-body .container .row p {
    font-size: 1.3rem;
}

#main-body a {
    font-size: 1.1rem;
}

/* End of Navbar adjustments & slider and body adjustments*/

/* Start of caption adjustments on screens */

@media (max-width: 420px) {
    section .carousel-caption {
        left: 1%;
        top: 199px;
        width: 100%;
    }

    section .carousel-caption.sec-cap{
        height: 280px;
    }

    .navbar img {
        padding-left: 15px;
    }

    .navbar-light .navbar-toggler {
        border: 0;
    }

    nav .navbar-toggler-icon {
        margin-left: 10px;
    }

    .services .card {
        margin-top: 15px;
        margin-bottom: 15px;
    }
}

/* Remove the outline from the navbar focus button */
body > div.container > nav > div > button {
    outline: none;
}

/* End of caption adjustments on screens */

/* Start of the contact us page Styling */

.contact-pg {
    margin-top: 200px;
    background: rgb(131, 132, 143);
    border-radius: 15px;
    color: white;
}

span {
    color: black;
    /* font-family: Arial, Helvetica, sans-serif; */
    font-size: 2rem;
    font-weight: 600;
    line-height: 39px;
}

section.contact {
    margin-top: 80px;
    margin-bottom: 180px;
}

section.contact p {
    font-size: 1.7rem;
    font-weight: 600;
}

/* End of the contact us page Styling */

/* Start of the Services page Styling */

#upper-section {
    margin-top: 200px;
    color: white;
}

#upper-section h1 {
    background: rgb(131, 132, 143);
    border-radius: 15px;
    font-weight: 600;
}

.services .card {
    background: white;
    border: 1px solid black;
    border-radius: 30px;
    transition: transform 0.5s ease; 
}

.services .card .card-text {
    font-size: 1.3rem;
}

.services .card:hover {
    transform: scale(1.2);
}

section .cards-services {
    margin-bottom: 150px;
}

section.services .info-box  .inf {
    font-size: 1.5rem;
}

section.services .info-box  .inf > h1{
    font-size: 1.7rem;
}

.services .info-box .inf p {
    font-weight: 520;
    line-height: 1.6;
} 


/* Creating cards images using font awesome icons */
section .cards-services .card i {
    background: rgb(131, 132, 143, 0.5);
    border-radius: 30px 30px 0px 0px;
    padding: 35px;
    color: white;
}

section .cards-services .card h4 {
    font-weight: bold;
}

section.services h4,a {
    font-size: 2rem;
}

/* End of the Services page Styling */