/* 
For index.html
==============
*/

/* Default (Desktop) */
#hero {
    background-image: url("../img/card (3).jpg");
    background-attachment: fixed;
    background-size: cover;
    background-position: center;
}

/* Tablets (768px - 1024px) */
@media (max-width: 1024px) {
    #hero {
        background-attachment: scroll;
        background-size: cover;
        background-position: center center;
    }
}

/* Small Tablets & Large Phones (600px - 768px) */
@media (max-width: 768px) {
    #hero {
        background-attachment: scroll;
        background-size: cover;
        background-position: top center;
    }
}

/* Phones (below 600px) */
@media (max-width: 600px) {
    #hero {
        background-attachment: scroll;
        background-size: cover;
        background-position: top center;
    }
}

.img-fluid {
  border-radius: 10px;
}

:root{
  --color1: #7ac0a1;
}

.center{
  display:flex;
  justify-content: center;
  align-items: center;
}
/* ------------------------------------------ */

/* NAVBAR */
#header{
  background-color: white;
}

.navmenu a, .navmenu a:focus {
  /* color: #7ac0a1 !important; */
  color: #9ab633 !important;

}
.navmenu a:hover {
  color: #9ab633 !important;
}
/* --------------------------------------------- */

/* SECTIONS */
/* hero */
.btn-get-started{
  background-color: #9ab633;  
  color:white;     
}

#hero .contact-btn{
  background-color: white;
  color:#9ab633; 
}

/* about */
.section-title h2::after {
  background-color: #9ab633;      
}
.section-title {
  padding-bottom:20px;
}

/* contact */
.btn-quote{
  background-color: #9ab633;  
  color:white;   
  padding:10px;
  border-radius:10px;   
}
.btn-quote:hover, .btn-quote:focus{
  color:white;   
}
/* --------------------------------------------- */

/* FOOTER */
.footer {
  background-color: #ffffff;      
  color:black; 
}

.footer .footer-links ul a{
  color:rgb(0, 0, 0); 
}

.footer .social-links a:hover {
  color: #9ab633; 
  border-color: #9ab633;
}

footer a{
  color:rgb(0, 0, 0); 
}
footer a:hover{
  color:rgb(0, 0, 0); 
}
#footer {
  border-top:  1px solid color-mix(in srgb, var(--default-color), transparent 90%); /* Adjust thickness and color */
}

/* --------------------------------------------- */