#spacing {
    height: 100px;

    &[data-size-desktop="xsmall"] {
        height: 25px;
    } 

    &[data-size-desktop="small"] {
        height: 50px;
    }    

    &[data-size-desktop="medium"] {
        height: 100px;
    }

    &[data-size-desktop="large"] {
        height: 160px;
    }

    @media only screen and (min-width: 980px) {
        &[data-size-desktop="hidden"] {
            display: none;
        }        
    }

    @media only screen and (max-width: 980px) {
        height: 50px;

        &[data-size-desktop="xsmall"] {
            height: 13px;
        }  

        &[data-size-desktop="small"] {
            height: 25px;
        }    

        &[data-size-desktop="medium"] {
            height: 50px;
        }

        &[data-size-desktop="large"] {
            height: 80px;
        }

        &[data-size-mobile="hidden"] {
            display: none;
        }        
    }
}