.moviban{
        display:flex;
        width:100%;
        background-color:grey;
        padding:20px;
        justify-content:center;
        align-items:center;
        height:548px;
        position:relative;
      }
      
      .moviban .grading{
        position:absolute;
        display:flex;
        top:0;
        left:0;
        width:100%;
        height:100%;
        /*background-color:green;*/
        opacity:0.8;
        z-index:2;
        background:linear-gradient(to right, black, rgba(0,0,0,0.3));
      }
      
      
      .moviban .fondo{
        display:flex;
        position:absolute;
        top:0;
        left:0;
        width:100%;
        height:100%;
        /*background-color:purple;*/
        z-index:1;
      }
      
      
      .moviban .grading img, .moviban .fondo img{
        width:100%;
        height:100%;
        object-position:center;
        object-fit:cover;
      }
      
      .moviban h2{
        width:100%;
        max-width:1146px;
        color:white;
        z-index:4;
        font-size:40px;
        line-height:47px;
        font-weight:700;
      }
      
      .movi{
        width:100%;
        display:flex;
        padding:73px 20px 111px 20px;
        justify-content:center;
        /*background-color:darkblue;*/
      }
      
      .movi .contenedor{
        display:flex;
        width:100%;
        max-width:1168px;
        gap:30px;
        /*background-color:darkgrey;*/
        justify-content:center;
      }
      
      
     .movi .intro{
        display:flex;
        gap:20px;
        align-items:center;
        justify-content:space-between;
        max-width:860px;
        /*background-color:grey;*/
        width:100%;
      }
      
      .movi .intro h3{
        text-align:center;
        max-width:721px;
        /*background-color:pink;*/
        color:white;
      }
      
      .movi .corchete{
        display:flex;
        width:32px;
        height:210px;
        /*background-color:orange;*/
        flex-shrink:0;
      }
      
      .movi .corchete img{
        width:100%;
        height:100%;
        object-position:center;
        object-fit:cover;
      }
      



      @media( max-width:1000px){

        .moviban h2 {
          text-align: center;
          max-width: 300px;
        }

      }


      @media( max-width:700px){

        .moviban h2 {
          text-align: center;
          max-width: 300px;
        font-size: 35px;
        line-height: 39px;
        }


        .movi {
          padding:70px 20px 80px 20px;
        }

        .movi .intro h3 {
              font-size:17px;
              line-height:23px;
        }

        .movi .intro{
          gap: 7px;
        }

        .movi .corchete{
          height: 100%
        }

        .movi .corchete img {
          object-fit: fill;
        }

      }