

span.icon-holder {
    background-color: #4ba3c440;
    border-radius: 50%;
    width: 2em;
    max-width: 2em;
    min-width: 2em;
    height: 2em;
    max-height: 2em;
    text-align: center;
    margin: auto;
    display: flex;
}


ul.pizza li i {

    text-align:center;
    margin:auto;
}

ul.pizza li span {
    margin: auto 0.25em;
    font-weight: bold;
}


.flex-grid {
    display: grid;
    grid-gap: 1rem;
    grid-template-columns: repeat(1, 1fr);
    list-style: none;
    margin: 0;
    margin-block-start: 0;
    padding-inline-start: 0;
}

.flex-grid-21 {
    width:100%;
    display: grid;
    grid-gap: 1rem;
    grid-template-columns: repeat(1, 1fr);
    list-style: none;
    margin: 0;

}


.flex-grid-21 > article {
    flex-grow:3;

}

    .flex-grid-21 > div {
        flex-grow:1;
 
    }

ul.resources-inline {
    display: grid;
    grid-gap: 0.5rem;
    grid-template-columns: repeat(1, 1fr);
    list-style: none;
    margin: 1em 0;
  
}

ul.resources-inline > ul > li {
    border: 1em solid pink;
    border-radius: .25rem;
    margin-bottom: auto;
}

@media (min-width: 768px) {
    ul.resources-inline {
        grid-template-columns: repeat(1, 1fr);
        margin:1.5em 0;
    }

}


@media (min-width: 1024px) {
    ul.resources-inline {
        grid-template-columns: repeat(2, 1fr);
        grid-gap:1rem;
    }
    .flex-grid-21 {
        grid-template-columns: repeat(1, 3fr 1fr);
    }
}


@media (min-width: 1280px) {
    ul.resources-inline {
        grid-template-columns: repeat(4, 1fr);
    }
}


.cm-hero {
    /* Photo by mnm.all on Unsplash */
    background: url('https://classanalytics.com.au/media/itvdoohq/hero-header.png') center;
    background-size: cover;
    padding: 4rem 2rem;
    /* Grid styles */
    display: grid;
    align-items: center;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}


.cm-answers {
    display: grid;
    align-items: center;
    grid-template-columns: 2fr 1fr;
}

ul.cm-answers {
    display: grid;
    grid-template-columns: 2fr;
    grid-gap: 2rem;
    list-style: none;
    margin: 0;
    margin-block-start: 0;
    padding-inline-start: 0;
}

        .cm-answers > ul > li {
            border: 1em solid pink;
            border-radius: .25rem;
            margin-bottom:auto;
        }





    .cm-features {
        /* Photo by mnm.all on Unsplash */
        /*background: url('https://classanalytics.com.au/media/itvdoohq/hero-header.png') center;
    background-size: cover;*/
        padding: 3rem;
        /* Grid styles */
        display: grid;
        align-items: center;
        grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    }

        .cm-features > ul {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
            grid-gap: 2rem;
            list-style: none;
            margin: 0;
            margin-block-start: 0;
            padding-inline-start: 0;
        }

            .cm-features > ul > li {
                border: 1em solid transparent;
                border-radius: .25rem;
            }
@media (max-width:1024px) {

    ul.cm-answers {
        display: grid;
        grid-template-columns: 1fr;
        grid-gap: 2rem;
        list-style: none;
        margin: 0;
        margin-block-start: 0;
        padding-inline-start: 0;
    }

    .cm-features {
        padding: 1rem;
    }
}
    .subscription-grid-icons > ul {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(64px, 1fr));
        grid-gap: 0.5rem;
        list-style: none;
        margin: 0;
        margin-block-start: 0;
        padding-inline-start: 0;
    }

        .subscription-grid-icons > ul > li {
            border: 1em solid transparent;
            border-radius: .25rem;
        }


    .cm-more-features {
        /* Photo by mnm.all on Unsplash */
        background: url('https://classanalytics.com.au/media/itvdoohq/hero-header.png') center;
        background-size: cover;
        padding: 4rem 2rem;
        /* Grid styles */
        display: grid;
        align-items: center;
        grid-template-columns: minmax(240px, 1fr) minmax(480px, 2fr);
    }

        .cm-more-features > ul {
            display: grid;
            /*grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));*/
            grid-template-columns: minmax(320px, 1fr) minmax(640px, 2fr);
            grid-gap: 1rem;
            list-style: none;
            margin: 0;
            margin-block-start: 0;
            padding-inline-start: 0;
        }

            .cm-more-features > ul > li {
                border: 1px solid #E2E2E2;
                border-radius: .25rem;
            }








    /* Flex */


    .flex {
        display: flex;
    }

    .flex-column {
        display: flex;
        flex-direction: column;
    }

    .flex-row {
        display: flex;
        flex-direction: row;
    }

.flex-grid {
    display: grid;
    grid-gap: 1rem;
    grid-template-columns: repeat(1, 1fr);
    list-style: none;
    margin: 0;
    margin-block-start: 0;
    padding-inline-start: 0;
}



    /* Standard grid sizes */

    .container {
        display: flex;
        /*margin-right: auto;
    margin-left: auto;*/
    }

        .container:after, .container:before {
            content: " ";
            display: table
        }

        .container:after {
            clear: both
        }

    .container-fluid {
        margin-right: auto;
        margin-left: auto;
        padding-left: 15px;
        padding-right: 15px
    }

        .container-fluid:after, .container-fluid:before {
            content: " ";
            display: table
        }

        .container-fluid:after {
            clear: both
        }

    .maths-courses {
        background-color: #175676;
        padding: 0.25em;
        font-size: 1em;
        font-weight: bold;
        border-radius: 0.25em;
        width: 100%
    }

        .maths-courses:hover {
            background-color: #17567680;
            cursor: pointer;
        }


    .row {
        margin: 0 0.5em;
    }

        .row:after, .row:before {
            content: " ";
            display: table
        }

        .row:after {
            clear: both
        }

    .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
        position: relative;
        min-height: 1px;
    }



    @media (min-width:768px) {
        .container {
        }

        .mobile-hidden {
            display: none
        }

        .form-inline .form-group {
            display: inline-block;
            margin-bottom: 0;
            vertical-align: middle
        }

        .form-inline .form-control {
            display: inline-block;
            width: auto;
            vertical-align: middle
        }

        .form-inline .form-control-static {
            display: inline-block
        }

        .form-inline .input-group {
            display: inline-table;
            vertical-align: middle
        }

            .form-inline .input-group .form-control, .form-inline .input-group .input-group-addon, .form-inline .input-group .input-group-btn {
                width: auto
            }

            .form-inline .input-group > .form-control {
                width: 100%
            }

        .form-inline .control-label {
            margin-bottom: 0;
            vertical-align: middle
        }

        .form-inline .checkbox, .form-inline .radio {
            display: inline-block;
            margin-top: 0;
            margin-bottom: 0;
            vertical-align: middle
        }

            .form-inline .checkbox label, .form-inline .radio label {
                padding-left: 0
            }

            .form-inline .checkbox input[type=checkbox], .form-inline .radio input[type=radio] {
                position: relative;
                margin-left: 0
            }

        .form-inline .has-feedback .form-control-feedback {
            top: 0
        }

        .form-horizontal .control-label {
            text-align: right;
            margin-bottom: 0;
            padding-top: 7px
        }

        .form-horizontal .form-group-lg .control-label {
            padding-top: 11px;
            font-size: 18px
        }

        .form-horizontal .form-group-sm .control-label {
            padding-top: 6px;
            font-size: 12px
        }

        .employee-grid__item, .product-grid__item {
            -ms-flex: 1 1 50%;
            flex: 1 1 50%;
            max-width: 50%
        }

        .employee-grid__item {
            padding: 10px
        }
    }

    .compat-msg {
        color: #000;
        display: block;
        background: #f4f4f0;
        padding: 30px
    }

    .list-label {
        display: none
    }

    .resources-topics {
        display: none;
        border: 10px solid pink;
    }

    .resources-inline li.item {
        align-items: stretch;
        justify-content: flex-start;
        width: 100%;
    }

    .resources-inline div.item a i {
        width: inherit;
        text-align: left;
    }

    .resources-grid .item {
        margin: 0;
    }

    h1.crumbs-head {
        font-size: 1.3em
    }

    .header--icon i {
        font-size: 300%
    }

    .back {
        display: block
    }

    .search {
        display: none
    }





    @media (min-width:990px) {

        .back {
            display: none
        }

        .search {
            display: flex
        }

        .header--icon i {
            font-size: 450%
        }

        h1.crumbs-head {
            font-size: 1.8em
        }

        .list-label {
            display: block
        }


        .resources-topics {
            display: block;
            border: 0;
        }

        .resources-inline li.item {

        }

        .resources-inline div.item a i {
            width: 100%;
            text-align: center;
        }


        .container {
            width: 100%;
        }

        .nav-link, .nav-link:visited {
            margin-left: 15px;
        }

        .button, .button--small {
            padding: 10px 80px
        }





        .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
            float: left
        }

        .col-md-1 {
            width: 8.333333%
        }

        .col-md-2 {
            width: 16.666667%
        }

        .col-md-3 {
            width: 25%
        }

        .col-md-4 {
            width: 33.333333%
        }

        .col-md-5 {
            width: 41.666667%
        }

        .col-md-6 {
            width: 50%
        }

        .col-md-7 {
            width: 58.333333%
        }

        .col-md-8 {
            width: 66.666667%
        }

        .col-md-9 {
            width: 75%
        }

        .col-md-10 {
            width: 83.333333%
        }

        .col-md-11 {
            width: 91.666667%
        }

        .col-md-12 {
            width: 100%
        }

        .col-md-pull-0 {
            right: auto
        }

        .col-md-pull-1 {
            right: 8.333333%
        }

        .col-md-pull-2 {
            right: 16.666667%
        }

        .col-md-pull-3 {
            right: 25%
        }

        .col-md-pull-4 {
            right: 33.333333%
        }

        .col-md-pull-5 {
            right: 41.666667%
        }

        .col-md-pull-6 {
            right: 50%
        }

        .col-md-pull-7 {
            right: 58.333333%
        }

        .col-md-pull-8 {
            right: 66.666667%
        }

        .col-md-pull-9 {
            right: 75%
        }

        .col-md-pull-10 {
            right: 83.333333%
        }

        .col-md-pull-11 {
            right: 91.666667%
        }

        .col-md-pull-12 {
            right: 100%
        }

        .col-md-push-0 {
            left: auto
        }

        .col-md-push-1 {
            left: 8.333333%
        }

        .col-md-push-2 {
            left: 16.666667%
        }

        .col-md-push-3 {
            left: 25%
        }

        .col-md-push-4 {
            left: 33.333333%
        }

        .col-md-push-5 {
            left: 41.666667%
        }

        .col-md-push-6 {
            left: 50%
        }

        .col-md-push-7 {
            left: 58.333333%
        }

        .col-md-push-8 {
            left: 66.666667%
        }

        .col-md-push-9 {
            left: 75%
        }

        .col-md-push-10 {
            left: 83.333333%
        }

        .col-md-push-11 {
            left: 91.666667%
        }

        .col-md-push-12 {
            left: 100%
        }

        .col-md-offset-0 {
            margin-left: 0
        }

        .col-md-offset-1 {
            margin-left: 8.333333%
        }

        .col-md-offset-2 {
            margin-left: 16.666667%
        }

        .col-md-offset-3 {
            margin-left: 25%
        }

        .col-md-offset-4 {
            margin-left: 33.333333%
        }

        .col-md-offset-5 {
            margin-left: 41.666667%
        }

        .col-md-offset-6 {
            margin-left: 50%
        }

        .col-md-offset-7 {
            margin-left: 58.333333%
        }

        .col-md-offset-8 {
            margin-left: 66.666667%
        }

        .col-md-offset-9 {
            margin-left: 75%
        }

        .col-md-offset-10 {
            margin-left: 83.333333%
        }

        .col-md-offset-11 {
            margin-left: 91.666667%
        }

        .col-md-offset-12 {
            margin-left: 100%
        }
    }

    @media (min-width:1200px) {
        .container {
            width: 100%
        }

        .employee-grid__item, .product-grid__item {
            -ms-flex: 1 1 30%;
            flex: 1 1 30%;
            max-width: 30%
        }
    }

    @media (min-width:1400px) {
        .container {
            width: 100%
        }
    }

    /*The annoying column funny businessmin-width: 1344px;*/

    .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
        float: left
    }

    .col-xs-1 {
        width: 8.333333%
    }

    .col-xs-2 {
        width: 16.666667%
    }

    .col-xs-3 {
        width: 25%
    }

    .col-xs-4 {
        width: 33.333333%
    }

    .col-xs-5 {
        width: 41.666667%
    }

    .col-xs-6 {
        width: 50%
    }

    .col-xs-7 {
        width: 58.333333%
    }

    .col-xs-8 {
        width: 66.666667%
    }

    .col-xs-9 {
        width: 75%
    }

    .col-xs-10 {
        width: 83.333333%
    }

    .col-xs-11 {
        width: 91.666667%
    }

    .col-xs-12 {
        width: 100%
    }

    .col-xs-pull-0 {
        right: auto
    }

    .col-xs-pull-1 {
        right: 8.333333%
    }

    .col-xs-pull-2 {
        right: 16.666667%
    }

    .col-xs-pull-3 {
        right: 25%
    }

    .col-xs-pull-4 {
        right: 33.333333%
    }

    .col-xs-pull-5 {
        right: 41.666667%
    }

    .col-xs-pull-6 {
        right: 50%
    }

    .col-xs-pull-7 {
        right: 58.333333%
    }

    .col-xs-pull-8 {
        right: 66.666667%
    }

    .col-xs-pull-9 {
        right: 75%
    }

    .col-xs-pull-10 {
        right: 83.333333%
    }

    .col-xs-pull-11 {
        right: 91.666667%
    }

    .col-xs-pull-12 {
        right: 100%
    }

    .col-xs-push-0 {
        left: auto
    }

    .col-xs-push-1 {
        left: 8.333333%
    }

    .col-xs-push-2 {
        left: 16.666667%
    }

    .col-xs-push-3 {
        left: 25%
    }

    .col-xs-push-4 {
        left: 33.333333%
    }

    .col-xs-push-5 {
        left: 41.666667%
    }

    .col-xs-push-6 {
        left: 50%
    }

    .col-xs-push-7 {
        left: 58.333333%
    }

    .col-xs-push-8 {
        left: 66.666667%
    }

    .col-xs-push-9 {
        left: 75%
    }

    .col-xs-push-10 {
        left: 83.333333%
    }

    .col-xs-push-11 {
        left: 91.666667%
    }

    .col-xs-push-12 {
        left: 100%
    }

    .col-xs-offset-0 {
        margin-left: 0
    }

    .col-xs-offset-1 {
        margin-left: 8.333333%
    }

    .col-xs-offset-2 {
        margin-left: 16.666667%
    }

    .col-xs-offset-3 {
        margin-left: 25%
    }

    .col-xs-offset-4 {
        margin-left: 33.333333%
    }

    .col-xs-offset-5 {
        margin-left: 41.666667%
    }

    .col-xs-offset-6 {
        margin-left: 50%
    }

    .col-xs-offset-7 {
        margin-left: 58.333333%
    }

    .col-xs-offset-8 {
        margin-left: 66.666667%
    }

    .col-xs-offset-9 {
        margin-left: 75%
    }

    .col-xs-offset-10 {
        margin-left: 83.333333%
    }

    .col-xs-offset-11 {
        margin-left: 91.666667%
    }

    .col-xs-offset-12 {
        margin-left: 100%
    }


    .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
        float: left
    }

    .col-sm-1 {
        width: 8.333333%
    }

    .col-sm-2 {
        width: 16.666667%
    }

    .col-sm-3 {
        width: 25%
    }

    .col-sm-4 {
        width: 33.333333%
    }

    .col-sm-5 {
        width: 41.666667%
    }

    .col-sm-6 {
        width: 50%
    }

    .col-sm-7 {
        width: 58.333333%
    }

    .col-sm-8 {
        width: 66.666667%
    }

    .col-sm-9 {
        width: 75%
    }

    .col-sm-10 {
        width: 83.333333%
    }

    .col-sm-11 {
        width: 91.666667%
    }

    .col-sm-12 {
        width: 100%
    }

    .col-sm-pull-0 {
        right: auto
    }

    .col-sm-pull-1 {
        right: 8.333333%
    }

    .col-sm-pull-2 {
        right: 16.666667%
    }

    .col-sm-pull-3 {
        right: 25%
    }

    .col-sm-pull-4 {
        right: 33.333333%
    }

    .col-sm-pull-5 {
        right: 41.666667%
    }

    .col-sm-pull-6 {
        right: 50%
    }

    .col-sm-pull-7 {
        right: 58.333333%
    }

    .col-sm-pull-8 {
        right: 66.666667%
    }

    .col-sm-pull-9 {
        right: 75%
    }

    .col-sm-pull-10 {
        right: 83.333333%
    }

    .col-sm-pull-11 {
        right: 91.666667%
    }

    .col-sm-pull-12 {
        right: 100%
    }

    .col-sm-push-0 {
        left: auto
    }

    .col-sm-push-1 {
        left: 8.333333%
    }

    .col-sm-push-2 {
        left: 16.666667%
    }

    .col-sm-push-3 {
        left: 25%
    }

    .col-sm-push-4 {
        left: 33.333333%
    }

    .col-sm-push-5 {
        left: 41.666667%
    }

    .col-sm-push-6 {
        left: 50%
    }

    .col-sm-push-7 {
        left: 58.333333%
    }

    .col-sm-push-8 {
        left: 66.666667%
    }

    .col-sm-push-9 {
        left: 75%
    }

    .col-sm-push-10 {
        left: 83.333333%
    }

    .col-sm-push-11 {
        left: 91.666667%
    }

    .col-sm-push-12 {
        left: 100%
    }

    .col-sm-offset-0 {
        margin-left: 0
    }

    .col-sm-offset-1 {
        margin-left: 8.333333%
    }

    .col-sm-offset-2 {
        margin-left: 16.666667%
    }

    .col-sm-offset-3 {
        margin-left: 25%
    }

    .col-sm-offset-4 {
        margin-left: 33.333333%
    }

    .col-sm-offset-5 {
        margin-left: 41.666667%
    }

    .col-sm-offset-6 {
        margin-left: 50%
    }

    .col-sm-offset-7 {
        margin-left: 58.333333%
    }

    .col-sm-offset-8 {
        margin-left: 66.666667%
    }

    .col-sm-offset-9 {
        margin-left: 75%
    }

    .col-sm-offset-10 {
        margin-left: 83.333333%
    }

    .col-sm-offset-11 {
        margin-left: 91.666667%
    }

    .col-sm-offset-12 {
        margin-left: 100%
    }




    .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
        float: left
    }

    .col-lg-1 {
        width: 8.333333%
    }

    .col-lg-2 {
        width: 16.666667%
    }

    .col-lg-3 {
        width: 25%
    }

    .col-lg-4 {
        width: 33.333333%
    }

    .col-lg-5 {
        width: 41.666667%
    }

    .col-lg-6 {
        width: 50%
    }

    .col-lg-7 {
        width: 58.333333%
    }

    .col-lg-8 {
        width: 66.666667%
    }

    .col-lg-9 {
        width: 75%
    }

    .col-lg-10 {
        width: 83.333333%
    }

    .col-lg-11 {
        width: 91.666667%
    }

    .col-lg-12 {
        width: 100%
    }

    .col-lg-pull-0 {
        right: auto
    }

    .col-lg-pull-1 {
        right: 8.333333%
    }

    .col-lg-pull-2 {
        right: 16.666667%
    }

    .col-lg-pull-3 {
        right: 25%
    }

    .col-lg-pull-4 {
        right: 33.333333%
    }

    .col-lg-pull-5 {
        right: 41.666667%
    }

    .col-lg-pull-6 {
        right: 50%
    }

    .col-lg-pull-7 {
        right: 58.333333%
    }

    .col-lg-pull-8 {
        right: 66.666667%
    }

    .col-lg-pull-9 {
        right: 75%
    }

    .col-lg-pull-10 {
        right: 83.333333%
    }

    .col-lg-pull-11 {
        right: 91.666667%
    }

    .col-lg-pull-12 {
        right: 100%
    }

    .col-lg-push-0 {
        left: auto
    }

    .col-lg-push-1 {
        left: 8.333333%
    }

    .col-lg-push-2 {
        left: 16.666667%
    }

    .col-lg-push-3 {
        left: 25%
    }

    .col-lg-push-4 {
        left: 33.333333%
    }

    .col-lg-push-5 {
        left: 41.666667%
    }

    .col-lg-push-6 {
        left: 50%
    }

    .col-lg-push-7 {
        left: 58.333333%
    }

    .col-lg-push-8 {
        left: 66.666667%
    }

    .col-lg-push-9 {
        left: 75%
    }

    .col-lg-push-10 {
        left: 83.333333%
    }

    .col-lg-push-11 {
        left: 91.666667%
    }

    .col-lg-push-12 {
        left: 100%
    }

    .col-lg-offset-0 {
        margin-left: 0
    }

    .col-lg-offset-1 {
        margin-left: 8.333333%
    }

    .col-lg-offset-2 {
        margin-left: 16.666667%
    }

    .col-lg-offset-3 {
        margin-left: 25%
    }

    .col-lg-offset-4 {
        margin-left: 33.333333%
    }

    .col-lg-offset-5 {
        margin-left: 41.666667%
    }

    .col-lg-offset-6 {
        margin-left: 50%
    }

    .col-lg-offset-7 {
        margin-left: 58.333333%
    }

    .col-lg-offset-8 {
        margin-left: 66.666667%
    }

    .col-lg-offset-9 {
        margin-left: 75%
    }

    .col-lg-offset-10 {
        margin-left: 83.333333%
    }

    .col-lg-offset-11 {
        margin-left: 91.666667%
    }

    .col-lg-offset-12 {
        margin-left: 100%
    }


    /*End of grids*/
