@import './style.css';

#intro .img-bg{
   background: url('../img/rapel/bg-rapel.webp') center center no-repeat;
}

/* rapel */
#rapel{
   padding: 0 130px;
   display: grid;
   
   grid-template-columns: 60% 40%;
   grid-template-rows: auto;
   height: 100vh;
   width: 100vw;
   max-width: 100%;

   align-content: center;
}

.modalidade{
   width: 100vw;
   height: 100vh;
   max-width: 100%;

   display: grid;

   padding: 0 130px;
}

.modalidade img{
   align-self: center;
   justify-self: center;
   grid-row: 1;
}

.modalidade .texto{
   width: 80%;

   text-align: left;

   align-self: center;
   justify-self: start;
   grid-row: 1;
}

#modalidades .modalidade.img-lado-direito .texto{
   padding-left: 50px;
}