/*#region banner */
section.banner > div{
  background-repeat: no-repeat;
  height: 450px;
  background-size: 70% ;
  background-color: #152775; 
  position: relative;
  display:grid;
  align-content: center;
  justify-content: center;
  gap: 10px;
}

section.banner > div > img{
  height: calc(100% - 60px);
  position: absolute;
  right: 0;
  top: 60px;

}

section.banner > div > h2{
  font-size: 48px;
  padding-right: 150px;
}

section.banner > div > p{
  font-size: 20px;
  padding-right: 150px;
}

/*#endregion */

/*#region banner */

/*#endregion loans */

section.loan {
  margin: 0 10%;
}

section.loan > ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  list-style-type: none;
  gap:25px;
  margin: 25px 0;
}

section.loan > ul > li{
  display: grid;
  padding: 30px;
  background-color: #25214d;
  border-radius: 10px;
  height: 300px;
  grid-template-columns: 1fr 3fr;
  grid-template-rows: max-content max-content max-content;
  gap: 15px;
  align-items: center;
}

section.loan > ul > li > img {
  width: 100%;
}

section.loan > ul > li > h1 {
  font-size: 36px;
}

section.loan > ul > li > h2 {
  font-size: 20px;
  grid-column: 1 / span 2;
  grid-row: 2;
}

section.loan > ul > li > p {
  font-size: 14px;
  text-wrap: wrap;
  display: inline-block;
  color: rgb(224, 223, 241);
  grid-column: 1 / span 2;
}

/*#region responsive */

/* Monitor */
@media (min-width: 768px) and (max-width: 992px) {
}

/* Tablet */
@media (min-width: 576px) and (max-width: 768px) {

}

/* Phone */
@media (max-width: 576px) {

}

/*#endregion */
