@media only screen and (max-width: 320px) {
    
    .contenedor{
      width: 320px;
    }
    .encabezado{
        width: 300px;
        height: 44px;
    }
    .mobile{
        display: inline-block;
        margin-top: 10px;
    }
    .burger-container{
        height: 30px;
        width: 30px;
        display: inline-block;
        position: relative;
        cursor: pointer;
    }
    .linea {
        height: 10%;
        width: 80%;
        background-color: black;
        box-shadow: 10px;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        transition: all 0.3s ease;
    }
    .linea1{
        top:25%;
    }
    .linea3{
        top:72%;
    }
    #burger-ch:checked + .burger-container .linea2{
        opacity: 0;
        
    }
    #burger-ch:checked + .burger-container .linea1{
        transform: translate(-50%, -50%) rotate(45deg);
        background-color: red;
        top: 50%;
    }
    #burger-ch:checked + .burger-container .linea3{
        transform: translate(-50%, -50%) rotate(-45deg);
        top: 50%;
        background-color: red;
    }
    #burger-ch{
        display: none;
    }
    .menu-mobile{
        position: fixed;
        color:white;
        width: 100%;
        background-color:blue;
        padding: 10px;
        display: none; 
    }
    #burger-ch:checked ~ .menu-mobile{
      transform: translateX(-10%);
      display: inline-block; 
      position: fixed;
      width: 90%;
      padding-left: 20px;
      right: -10px;
      top:60px;
      background-color:blue;
    }
    .menu-mobile-item {
        height: 40px;
    }
    .logo{
        margin-top: 2px;
        margin-left: 10px;
    }
    .navegacion{
        padding-right: 10px;
        display: none;
    }
    .titulo{
        font-size: 36px;
        margin-left: 15px;
        width: 250px;
        letter-spacing: 0;
        line-height: 25px;
    }
    .parrafo{
        width: 288px;
        height: 66px;
        margin-left: 14px;
        font-size: 14px;
    }
    .descripcion{
        margin-left: 0px;
        margin-top: 50px;
    }
    .boton{
        width: 288px;
        height: 48px;
        margin-left: 15px;
        font-weight: bold;
        font-size: 16px;
    }
    .contenido{
        width: 315px;
        height: 1250px;
        clip-path: polygon(0 5%, 100% 2%, 100% 95%, 0 100% );
    }
    .episodios{
        margin-left: 2px;
        padding-top: 0px;
        padding-left: 5px;
        position: absolute;
        top: 80px;
    }
    .sonido{
        top: 150px;
        padding-top: 0px;
        padding-left: 3px;
        padding-right: 0px;
        flex-direction: column;
        position: relative;
    }
    .podcast{
        width: 298px;
        margin-left: 5px;
        height: 245;
        margin-bottom: 7px;
    }
    .index{
        left: 20px;
        margin-top: 4px;
        margin-right: 35px;
        width: 300px;
        height: 500px;
        position: relative;
        bottom: 100px;
    }
    .telefono{
      flex-wrap: wrap;
    }
    .columna{
        padding-left: 2px;
        position: relative;
        bottom: 30px;
    }
    .secundario{
        width: 288px;
        height: 88px;
        font-size: 36px;
    }
    .texto{
        width: 288px;
        height: 258px; 
        font-size: 14px;
        margin-top: 12px;
    }
    .invitadas{
        margin-top: 80px;
    }
    .estelares{
        font-size: 36px;
        margin-left: 15px;
        margin-bottom: 10px;
    }
    .mujeres{
        flex-wrap: wrap;
    }
    .tamaño{
        width: 320px;
        height: 243px;
    }
    .subtitulo{
        margin-left: 20px;
        margin-bottom: 40px;
        font-size: 36px;
        width: 288px;
        height: 84px;
    }
    .iconos{
        flex-wrap: wrap;
    }
    .temas{
        margin-bottom: 20px;
    }
    .clip{
        clip-path:polygon(0 15%, 100% 0, 100% 100%, 0 100%);
        width: 320px;
        height: 341px;
    }
    .novedades{
        font-size: 36px;
        width: 288px;
        height: 126px;
        position: static;
        padding-top: 80px;
        padding-left: 40px;
    }
    .escuchar{
        position: initial;
        width: 288px;
        height: 48px;
        margin-top: 130px;
        margin-left: 20px;   
        font-size: 16px;
        font-weight: bold;
    }
    .footer{
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
    }
    .hello{
        height: 22px;
        padding-left: 5px;
        font-size: 14px;
        line-height: 22px;
    }
    .cajon{
        display:none;
    }
     
}
