﻿section.filter div.title {
    display: grid;
    grid-template-columns: 1fr auto auto;
    margin: 0 0 10px 0;
    gap: 8px;
    align-items: end;
}

section.filter h2{margin:0;}

section.filter .button {
    padding: 5px 10px;
}

section .filter a {
    display: inline-block;
}

/*section.filter .right {
    float: right;
    margin-top: -35px;
}*/

section.filter span.icon {
    color: white;
    border: 0;
    font-size: 150%;
    cursor: pointer;
    font-size: 26px;
    line-height:36px;
}

section.filter .teamFilter {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    /* align-items: flex-start;*/
    /* justify-content: center;*/
    margin: 10px auto;
}

    section.filter .teamFilter a {
        display: block;
        width: 70px;
        height: 70px;
    }

        section.filter .teamFilter a img {
            display: block;
            width: 100%;
            max-height: 100%;
            transform: scale(1);
            transition: all 2s;
        }

        section.filter .teamFilter a:hover img {
            transform: scale(1.05);
        }

    section.filter .teamFilter span {
        display: none;
    }

/*section.filter a.selected, section.filter a:hover, section.filter button.selected, section.filter button:hover {
    background-color: white;
    color: #404040;
}*/


/*
section.filter span.sportFilter, section.filter span.stateFilter, section.filter span.seasonFilter {
    padding-right: 35px;
}*/

section.filter .sportFilter, 
section.filter .stateFilter, 
section.filter .seasonFilter,
section.filter .leagueFilter, 
section.filter .subLeagueFilter {
    display: block;
    margin-bottom: 10px;
}

/*section.filter .leagueFilter {
    padding-top: 0px;
    padding-bottom: 10px;
}*/


section.filter .seasonFilter .button {
    display: inline-block;
}

#ui-datepicker-div {
    margin-top: 50px;
}

section.filter button.show-all {
    display: none;
}


    section.filter button.show-all.visible {
        display: inline;
    }

/* mobilni design */
@media screen and (max-width: 444px) {

    section.filter .button{
        margin: 0px 2px 2px 0;
    }

    section.filter h2 span, section.filter span.seasonFilter .button span {
        display: block;
    }

    section.filter .teamFilter {
        display: grid;
        grid-template-columns: 25% 25% 25% 25%;
        gap: 5px;
        padding: 0 10px;
    }

        section.filter .teamFilter .button{
            font-size:inherit;
        }

        section.filter .teamFilter a {
            width: initial;
            height: initial;
            padding: 0;
            margin: 0;
            /*width: 100%;*/
            position: relative;
        }

            section.filter .teamFilter a:after {
                content: "";
                display: block;
                padding-bottom: 100%;
            }

            section.filter .teamFilter a img {
                width: initial;
                position: absolute;
                top: 5px;
                bottom: 5px;
                left: 5px;
                right: 5px;
                max-width: calc(100% - 10px);
                max-height: calc(100% - 10px);
                  object-fit: contain;
                object-position: center;
            }


    section.filter h2 span.separator, section.filter span.seasonFilter .button span.separator, h2.title .separator {
        display: none;
    }

    .secondRow.homepageSportButtons {
        display: grid;
        grid-template-columns: 50% 50%;
        gap: 5px;
    }

   

        section.filter span.sportFilter .button, section.filter span.stateFilter .button{
            text-align: center;
            align-self:center;
            grid-template-columns:1fr;
        }

        section.filter span.stateFilter {
            display: grid;
            grid-template-columns: auto auto auto;
            gap: 3px;
            align-items:center;
        }

}
