a {
    color: white;
/*#4F6F52*/    
    font-family: 'Lemon', serif;
}
.container > nav {
    width: 100%;
}
body {
    background-color: #E5D4FF; /* #304D30*/
}

a:hover {
    color: black;
    /*#163020*/
}

.material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 400,
  'GRAD' 0,
  'opsz' 24
}
span {
    background-color: #C7B7A3; /* #4F6F52 */;
}
span:hover {
    background-color: #D0BFFF;
}

.card-style {
    border-width: 0.5rem;
    border-color: #FBF6EE;
    
}

.spacer {
    aspect-ratio: 960/300;
    width: 100%;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.layer1 {
    background-image: url('./wave-haikei\(4\).svg');
}

.layer2 {
    background-image: url('./wave-haikei\(3\).svg');
}



.service-element{
    background-color: #FDF0D1;
    border-radius: 10%;
    font-weight: 500;
    font-size: 1.1rem;
    border-color: #FFF8E3;
    margin-bottom: 200px;
    padding: 10px;
}

thead {
    font-weight: 600;
    
}

table {
    font-family: 'Merriweather', serif;
}


/* Extra small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) { 
    #about-section {
        margin: 10px;
        margin-top: 20px;
    }

    .navbar-heading {
        font-size: 1rem;
    }

    .info-card {
        width: auto;
    }

    .service-element{
        font-size: 0.9rem;
    }
    .card-margin1{
        margin-bottom: 620px;
    }
    .card-margin2{
        margin-bottom: 120px;
    }

    .service-btn{
        height: 30px;
        width: 15rem;
        margin: 10px;
    }
 }

/*// Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) and (max-width: 767.98px) {
    
 }

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991.98px) { 
    
}

/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) and (max-width: 1199.98px) {
    .navbar-heading{
        font-size: 5000px;
    }
    
 }

/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) { 
    .navbar-heading{
        font-size: xx-large;
    }
    .card-margin1{
        margin-bottom: 200px;
        
    }
    .card-margin2{
        margin-bottom: 200px;
    }
    
    .service-btn {
        height: 90px;
        font-weight: 600;
    }
}