body * {
  font-family: roboto;
}


/* NAV BAR */
.nav-bar{
    background-color: #365b6d;
    width: 100vw;
    margin: 0px;
}

.nav-item{
  margin-top: 30px;
  margin-bottom: 20px;
  font-family: roboto;
  font-size: 30px;
  font-weight: 100;
  color: #ffffff;
  text-decoration: none;
  padding: 20px;
}

.nav-item:hover{
  text-decoration: underline;
  color: #ffffff;
}

.navbar-toggler{
  color: #ffffff;
}


/* HOME PAGE */

.opening-para{
  text-align: justify;
  margin-top: 30px;
  margin-bottom: 20px;
  font-family: roboto;
  font-size: 20px;
  color: #365b6d;
}


.title{
  text-align: justify;
  margin-top: 30px;
  margin-bottom: 20px;
  font-family: roboto;
  font-size: 50px;
  font-weight: 300;
  color: #365b6d; 
}




/* flip cards */
.flip-card {
  background-color: transparent;
  
  height: 200px;
  border: 1px solid #f1f1f1;
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
}

.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden; /* Safari */
  backface-visibility: hidden;
}

.flip-card-front {
  background-color: #ffffff;
  border: 1px solid #365b6d;
  color: #365b6d;
  box-shadow: 0 3px 10px rgb(0 0 0 / 0.5);
  border-radius: 8px;
  font-weight:100;
}

.flip-card-front-font{
  font-weight:100;
}

.flip-card-back {
  background-color: #41c1ba;
  color: white;
  transform: rotateY(180deg);
  box-shadow: 0 3px 10px rgb(0 0 0 / 0.5);
  border-radius: 8px;
  font-weight:100;
  font-size: 16px;
}

.flip-card-back-font {
  font-weight:100;
  font-size: 20px;
}


/* Testimonial Section */


.testimonial-section{
  
}


.subheading{
  color: #41c1ba;
  font-size: 30px;
  font-weight:100;
  padding-top: 20px;
  padding-bottom: 20px;
}

.line{
  position: relative;
  height: 20px;
  width: 100%;
}
.line-animation { 
            width: 300px; 
            height: 2px; 
            background: #41c1ba; 
            position: absolute; 
            top: 50%; 
            left: 50%; 
            transform: translate(-50%, -50%); 
        } 
  
        .line-animation::before { 
            content: ""; 
            position: absolute; 
            top: 0; 
            left: 0; 
            width: 100%; 
            height: 100%; 
            background: #ffffff; 
            animation: animate 5s linear infinite; 
        } 
  
        @keyframes animate { 
            0% { 
                left: 0; 
            } 
  
            100% { 
                left: 100%; 
            } 
  
        } 

.carousel{
  background-color: #ffffff;
  width: 100%;
}

.carousel-item{
  /*width: 95%;*/
  height: auto;
  background-color:#ffffff;
  
}


.testimonial-text{
  font-size: 2em;
  color: #365b6d;
  font-family: "roboto", sans-serif;
  font-weight: 400;
  text-align: justify;
  text-justify: inter-word;
}

.testimonial-text::before{
  color: #41c1ba;
  font-family: "Space Grotesk", sans-serif;
  font-weight: 600;
  content: "\201C";
  font-size: 4em;
  line-height: 0.1em;
  margin-right: 0.1em;
  vertical-align: -0.4em;
}

.testimonial-text::after{
  font-size: 4em;
  color: #41c1ba;
  font-family: "Space Grotesk", sans-serif;
  font-weight: 600;
  content: "\201D";
  line-height: 0.1em;
  margin-left: 0.1em;
  vertical-align: -0.45em;
}


.carousel-inner{
  background-color: #ffffff;
  
}

.client-row{
  height: 90px;
}

.testimonial-name{
  color: #41c1ba;
  font-family: "Oswald", sans-serif;
  font-weight: 100;
  font-size: 20px;
  padding-left: 30px;
}

.testimonial-image {
  border-radius: 50%;
 
}




/* SERVICES PAGE */

.service-box{
  border: 1px solid #365b6d;
  border-radius: 8px;
  margin-bottom: 20px;
}

.service-name{
  font-family: roboto;
  font-size: 30px;
  font-weight: 200;
  color: #365b6d;
  padding-left: 15px;
}


.service-text{
  font-family: roboto;
  font-size: 20px;
  font-weight: 100;
  color: #365b6d;
  padding-left: 15px;
  padding-bottom: 30px;
}


/* CONTACT FORM */

    .bob{
      margin: 0 auto; 
      width:250px;
    }

    .contact-form {
        list-style-type: none;
        padding-left: 0;
    }

    .contact-form li {
        margin-bottom: 1.5rem;
    }

    .contact-form label {
        display: block;
        font-family: roboto;
        font-size: 20px;
        font-weight: 100;
        color: #365b6d;
    }

    .contact-form .helptext {
        display: block;
        font-size: 80%;
    }





/* FOOTER */
.footer{
    background-color: #365b6d;
    width: 100vw;
    margin: 0px;
}

.copyright{
  color: #ffffff;
}


.footer-title{
  color: #ffffff;
  font-family: roboto;
  font-size: 30px;
  font-weight: 100;
  padding-top: 20px;
}


.contact-icon{
  color: #ffffff;
  padding-right: 10px;
}