.block-form
{
  margin: auto;
  margin-top: var(--sp-block-normal);
  text-align: center;
  display: grid;
  width: 90%;

  height: fit-content;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto auto;
  grid-template-areas:
    "block-title block-title"
    "block-img block-text";
  padding-block: var(--sp-block-normal);
}
.block-form-map {
    margin: auto;
    content:"";
    background-image: url("../images/home/microsembly_map.webp");
   
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 92%;
    grid-area: block-img;
    border-radius: var(--border-radius);
}
.container-form{
    text-align: center;
    font-weight: bold;
    font-size: 1.5rem;
    color: rgb(2, 30, 52);
    margin:auto;
    padding: 1rem;
    width: 100%;
    padding-block: 2rem;
    background-color: var(--color-block-white);
    border-radius: 10px;
    box-shadow: var(--box-shadow);

}
.form-group{
    text-align: start;
    margin: 1.5rem;
    display: flex;
    flex-direction: row;
    align-items: center;
}
.form-group label{
    padding-inline-start: 1.5rem;
    text-indent: 0px;
    text-align: start;
    width: 40%;
}   
.form-control{
   
    padding: .8rem;
    border-radius: 5px;
    border: 2px solid rgb(150, 162, 200);
    width: 100%;
}
.form-control:focus{

    border: 2px solid rgb(12, 35, 101);
}
.form-control::placeholder{
    color: rgb(150, 162, 200);
}
.form-control:focus::placeholder{
    color: rgb(12, 35, 101);
}
.block-form button{
    cursor: pointer;
  text-align: center;
    margin-top: 2rem;
  font-size: 1.5rem;
  font-weight: bold;
  padding: 10px 25px;
  width:auto;
  background-color: var(--color-blue);
  color: white;
  text-decoration: none;
  border-radius: 5px;
  box-shadow: var(--text-shadow);
  text-shadow: var(--text-shadow);
  border: 4px solid var(--color-blue);
  transition: background-color 0.2s ease-in-out;
}
.block-form button:hover{
    background-color: var(--color-button-hover);
}
@media screen and (max-width: 1100px) {
    .block-form{
        width: 100%;
      grid-template-columns: 1fr;
      grid-template-rows: 1fr 300px;
      grid-template-areas:  "block-text" "block-img";
    }
    .container-form{
        font-size: 1.2rem;
        color: rgb(2, 30, 52);
        margin:auto;
        padding: 0rem;
        padding-block: 2rem;
        background-color: var(--color-block-white);
        border-radius: 10px;
        box-shadow: var(--box-shadow);
    
    }
    .block-form-map {
        margin: auto;
        content:"";
        background-image: url("../images/home/google-microsembly.webp");
        background-size: fit;
        background-position: center;
        background-repeat: no-repeat;
        width: 100%;
        height: 100%;
        grid-area: block-img;
    }
    .form-group{
        text-align: start;
        margin: 2rem;
        display: flex;
        flex-direction: column;
        align-items: start;
    }
    .form-control{
   
        padding: .8rem;
        border-radius: 5px;
        border: 2px solid rgb(150, 162, 200);
        width: 90%;
    }
    }