*{
    margin: 0;
}
body{
    font-family: 'Inter', sans-serif;
    background-color: hsl(233, 47%, 7%);

}
.container{
    margin: 2rem auto;
    max-width: 85%;

   
}
img{
    max-width: 100%;
    z-index: 1;

}
.section-image{
    position: relative;
    display: inline-block;
}
.overlay {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(45, 26, 138, 0.5); /* Adjust the color and opacity as needed */
    z-index: 1; /* Ensure the overlay is on top of the image */
  }

.site-content{
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    background-color: hsl(244, 38%, 16%);
}
.site-content h1{
    color: hsl(0, 0%, 100%);
    margin: 2rem 0;
}
span{
    color: hsl(277, 64%, 61%);
}
.mainparagragh{
    color: hsla(0, 0%, 100%, 0.75);
    font-size: .9rem;
    margin-bottom: 2rem;
}
.companies-template-queries{
    margin-bottom: 2rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.companies-template-queries h2{
    color: hsl(0, 0%, 100%);
}
.companies-template-queries p{
    color: hsla(0, 0%, 100%, 0.6);
}

@media (min-width:1107px) {
    .container{
        display: flex;
        margin: 9rem auto;
        max-width: 70%;
    }
    .companies-template-queries{
        display: flex;
        flex-direction: row;
        gap: 3rem;
    }
    .section-image{
        order: 2;
    }
    .site-content{
        order: 1;
        max-width: 70%;
    }
}