.deck {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
    }
    /*!Desktop*/
    
    @media screen and (min-width: 800px) {
        .headerA {
            height: 55vh;
            background-image: url('https://images.pexels.com/photos/3783425/pexels-photo-3783425.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940');
            background-color: rgb(88, 88, 88);
            background-blend-mode: multiply;
            background-size: cover;
            display: grid;
            place-items: center;
            /* Create the parallax scrolling effect */
            background-attachment: fixed;
            background-position: center;
            background-repeat: no-repeat;
            background-size: cover;
            color: white;
        }
        .headerA h1 {
            color: white;
            font-size: 4vw;
            font-family: 'Itim', cursive;
            text-shadow: 0px 2px 6px black;
        }
        h3 {
            font-size: 25px;
            font-family: 'Itim', cursive;
        }
        .sensory,
        .gross,
        .fine,
        .concerntration,
        .behaviour,
        .perception,
        .play,
        .selfcare {
            box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.753);
            border-radius: 15px;
            width: 45%;
            margin: 2%;
            padding: 2%;
            text-align: center;
            font-size: 21px;
            font-family: 'Itim', cursive;
        }
        .info {
            width: 50%;
            margin: 1%;
            float: right;
            text-align: left;
        }
        .type {
            width: 45%;
            margin: 1%;
        }
    }
    /*!mobile*/
    
    @media screen and (max-width:800px) {
        .headerA {
            height: 55vh;
            background-image: url('https://images.pexels.com/photos/3783425/pexels-photo-3783425.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940');
            background-color: rgb(88, 88, 88);
            background-blend-mode: multiply;
            background-size: cover;
            display: grid;
            place-items: center;
            /* Create the parallax scrolling effect */
            background-attachment: fixed;
            background-position: center;
            background-repeat: no-repeat;
            background-size: cover;
            color: white;
        }
        .headerA h1 {
            color: white;
            font-size: 5vw;
            font-family: 'Itim', cursive;
            text-shadow: 0px 2px 6px black;
        }
        .sensory,
        .gross,
        .fine,
        .concerntration,
        .behaviour,
        .perception,
        .play,
        .selfcare {
            box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.753);
            border-radius: 15px;
            width: 100%;
            text-align: center;
            margin: 3%;
        }
        .info {
            height: auto;
            margin: 4%;
            text-align: left;
        }
        .type {
            float: center;
            width: 95%;
            margin: 2%;
        }
        h3 {
            margin-top: 2%;
            font-size: 25px;
            font-family: 'Itim', cursive;
        }
    }