.bar1,
.bar2,
.bar3
{
  background-color: var(--white) !important;
}
.navbar-on .bar1 {
    background-color: var(--blue)!important;
  }
  .navbar-on .bar3 {
    background-color: var(--blue)!important;
  }

/* SECTORS ROLES */
.sectors-roles {
    color: var(--blue);
    padding: 0;
}
.sectors-roles .row {
    --bs-gutter-x: 0rem;
}
.image-side img {
    width: 100%;
    height: auto;
    display: block;
    filter: grayscale(100%);
}
.content-side {
    padding:100px;
    /* padding: 20px 50px 0 50px; */
    background-color: white;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.service-list {
    list-style: disc;
    padding: 0;
    margin: 0;
    padding-left: 15px;
}
.service-list li {
    padding: 5px 0;
    font-size: 16px;
    letter-spacing: 1px;
    padding-left: 10px;
}

.accordion-body {
    background-color: var(--red);
    color: var(--blue);
    padding-top: 0;
    /* border-color: #C2AE92 !important; */
}
.accordion-item {
    border:0;
    border-bottom: 0 !important;
}
.accordion-item:focus {
    border-bottom: none !important;
}
.accordion-button:focus {
    
}
.accordion-button:not(.collapsed) {
    color: var(--blue) !important;
    background-color: var(--white);
    box-shadow: none !important;
}
.accordion-button:not(.collapsed)::after, .accordion-button:after {
    filter: grayscale(100%);
}

.accordion-button:focus {
    box-shadow: none;
    border-bottom: none !important;
    border-color: var(--gold);
}

.accordion-button {
    padding-left: 0;
    border-top: 1px var(--gold) solid;
} 
h6.accordion-header:focus {
    border: none !important;
}
/* END OF SECTORS ROLES*/





/*
	•	Targets: Mobile phones and small tablets in portrait
	•	Examples: iPhone SE, iPhone 13/14, Galaxy phones, smaller Androids, small tablets
*/
@media (max-width: 767px) {

    .content-side {
        padding: 120px 30px 0px 30px;
    }
    .second-content-side {
        padding-top: 50px;
    }
}

/* Tablets (portrait) */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
    .content-side {
        padding: 120px 30px 0px 30px;
    }
    .second-content-side {
        padding-top: 50px;
    }
    h2 {
        font-size: 40px;
        line-height: 35px;
    }
    p {
        font-size: 12px;
    }
    h6 {
        font-size: 8px;
    }
    .service-list li {
        
        font-size: 12px;
    }
}
  
/* Tablets (landscape) */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    .content-side {
        padding: 120px 30px 0px 30px;
    }
    .second-content-side {
        padding-top: 50px;
    }
    h2 {
        font-size: 40px;
        line-height: 35px;
    }
    p {
        font-size: 12px;
    }
    h6 {
        font-size: 8px;
    }
    .service-list li {
        
        font-size: 12px;
    }
}

/* iPad Pro-specific styling */
@media (min-width: 834px) and (max-width: 1366px) and (orientation: portrait) {
    h2 {
        font-size: 60px;
        line-height: 55px;
    }
}

/* iPad Pro-specific styling */
@media (min-width: 834px) and (max-width: 1366px) and (orientation: landscape) {
    h2 {
        font-size: 60px;
        line-height: 55px;
    }
}

/* Small desktops */
@media (min-width: 1025px) and (max-width: 1439px) {
    
    h2 {
        font-size: 60px;
        line-height: 55px;
    }
}

/* Large desktops */
@media (min-width: 1440px) {

    h2 {
        font-size: 60px;
        line-height: 55px;
    }
}

/* Ultra-wide monitors */
@media (min-width: 1920px) {
/* Optional refinements here */
}

@media (min-width: 2560px) {
    h2 {
        font-size: 90px;
        line-height: 85px;
    }
}