﻿.section-one-banner{
    height: 25rem;
    background-color: var(--clr-blue);
    background-size: cover;
    background-position-x: center;
}

.banner-grid{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.banner-one-content{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding-right: var(--size-8xl);
}

.banner-one-header{
    margin-top: var(--size-base);
    padding-top: var(--size-4xl);
    padding-bottom: var(--size-base);
    margin-bottom: var(--size-xxs);
    color: var(--clr-sea-blue);
    font-size: var(--size-lg);
    line-height: var(--size-2xl);
    text-align: left;
    width: 15rem;
}

.banner-one-paragraph{
    color: var(--clr-light);
    width: 12rem;
    font-size: var(--size-base);
    padding-bottom: var(--size-sm);
}

.content-grid{
    padding-top: var(--size-2xl);
    padding-bottom: var(--size-xs);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.section-header{
    display: flex;
    align-items: center;
}

.section-header-div{
    width: 75%;
}

.joined-heading{
    padding-left: var(--size-base);
    padding-right: var(--size-3xl);
}

.work-with-us{
    margin-bottom: 0;
}

.why-choose{
    margin-top: 0;
    padding-left: 0;
}

.section-content{
    height: 100%;
    background: transparent linear-gradient(270deg, var(--clr-blue) 28%, var(--clr-light-blue) 80%, var(--clr-dark-blue) 100%) 0 0 no-repeat padding-box;
    padding-bottom: var(--size-4xl);
}

.section-content-card{
    border-bottom-style: solid;
    border-color: gray;
    border-width: 1px;
    height: 100%;
    width: 75%;
    margin-top: var(--size-xl);

}

.section-two-banner,
.section-three-banner{
    height: 18.2rem;
    background-size: cover;
    background-position-x: center;
}

.banner-three-content{
    height: 285px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: var(--size-8xl);
    padding-left: var(--size-6xl);
}

.connect-with-us-button{
    background-color: var(--clr-blue);
    color: var(--clr-sea-blue);
    font-family: var(--font-one);
    border: 2px solid var(--clr-sea-blue);
    font-size: var(--size-base);
    width: 20rem;
    height: var(--size-8xl);
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    cursor: pointer;
    text-decoration: none;
}

.water-mark{
    position: absolute;
    height: 31.25rem;
    z-index: 10000;
    width: 31.25rem;
    opacity: 0.8;
    left: -6.25rem;
    background: no-repeat left;
}
.water-mark-container{
    position: relative;
    overflow-x: hidden;
}
