﻿@media screen and (max-width:1310px) {
    .sticky #siteHeader #menuMobileIcon {
        display: block
    }

    .icon-bar {
        left: initial;
        display: flex;
        bottom: 0;
        width: 100%;
        transform: initial;
        top: initial
    }

    #menuPrincipal .icon-bar a {
        height: 50px;
        padding: 6px 10px;
        width: 25%
    }
}

@media screen and (max-width:980px) {
    .sticky {
        padding-top: 85px
    }

    #siteHeader {
        background: #eee;
        border-bottom: 1px solid #ddd;
        height: 85px;
        align-items: center
    }

        #siteHeader > div {
            justify-content: space-between;
            display: flex;
            height: 85px;
            margin: 0 auto;
            padding: 0 15px
        }

    .sticky #siteHeader > div {
        padding: 0 15px
    }

    #siteHeader > div > div:nth-child(1) {
        align-items: center;
        background: 0 0;
        display: flex;
        order: 1
    }

    #siteHeader > div > div:nth-child(2) {
        background: 0 0;
        border-bottom: 0;
        order: 0
    }

    #siteHeader #logo {
        padding: 10px 0
    }

    .sticky #siteHeader nav ul li:last-child {
        display: block
    }

    #siteHeader #telefone {
        display: none
    }

    #siteHeader #buscaMembrosAssociese {
        width: auto
    }

    #siteHeader > div > div:nth-child(2), .sticky #siteHeader > div > div:nth-child(2) {
        align-items: center;
        background: 0 0;
        border-bottom: 0;
        display: flex;
        order: 0;
        flex-grow: initial
    }

    #siteHeader > div > div > div {
        justify-content: space-between;
        padding: 0
    }

    #siteHeader #membrosCtn {
        border-left: none;
        margin: 0 10px 0 5px;
        padding: 0 20px;
        order: 0
    }

    #siteHeader #busca {
        order: 1;
        width: auto
    }

        #siteHeader #busca div:first-child {
            align-items: center;
            border-right: 1px solid #c9c9c9;
            height: 24px;
            display: flex;
            margin-right: 15px;
            padding: 0 10px 0 0
        }

        #siteHeader #busca #buscaTextSubmit {
            display: none;
            align-items: center;
            justify-content: center;
            position: absolute;
            top: 0;
            left: 0;
            width: 100vw;
            height: 100vh;
            z-index: 10;
            background: rgba(0,0,0,.7)
        }

            #siteHeader #busca #buscaTextSubmit input[type=image] {
                width: 70px
            }

        #siteHeader #busca > #buscaTextSubmit > div {
            background: 0 0;
            border-radius: 0;
            border-right: none;
            height: auto;
            justify-content: center;
            margin-right: 0;
            padding: 0
        }

        #siteHeader #busca input[type=text] {
            background: 0 0;
            border: 0;
            border-bottom: 2px solid #fff;
            border-radius: 0;
            color: #fff;
            line-height: 70px;
            height: 70px;
            font-size: 50px;
            outline: 0;
            padding: 0 10px;
            width: auto
        }

    #siteHeader #associeseCtn {
        order: 2
    }

    #siteHeader #menuMobileIcon {
        background: 0 0;
        border: 0;
        font-size: 28px;
        display: block;
        outline: 0;
        padding: 0
    }

    #menuPrincipal {
        display: none;
        background: #fff;
        box-shadow: 0 3px 3px rgba(0,0,0,.1);
        left: 0;
        height: calc(100vh - 135px);
        overflow: scroll;
        position: absolute;
        top: 85px;
        z-index: 8;
        width: 100%
    }

        #menuPrincipal .subMenuTitle, #menuPrincipal .subSubMenuTitle, #menuPrincipal a {
            align-items: center;
            border-bottom: 1px solid #e8e8e8;
            display: flex;
            font-weight: 400;
            justify-content: space-between;
            padding: 15px
        }

            #menuPrincipal .subMenuTitle:after, #menuPrincipal .subSubMenuTitle:after {
                content: '▼';
                font-size: 10px;
                margin-left: 10px
            }

        #menuPrincipal .subMenu, #menuPrincipal .subSubMenu {
            background: #fff;
            height: calc(100vh - 135px);
            overflow: scroll;
            position: absolute;
            top: 0;
            width: 100%
        }

            #menuPrincipal .ativo .subMenu, #menuPrincipal .subMenu ul li.ativo > div.subSubMenu {
                display: block;
                visibility: visible;
                opacity: 1
            }

            #menuPrincipal .subMenu ul li > div.subSubMenu {
                display: none
            }

        #menuPrincipal .adsense {
            display: none
        }

    .voltar {
        align-items: center;
        background: #656565;
        color: #fff;
        display: flex;
        justify-content: space-between;
        padding: 15px
    }
}

@media screen and (max-width:980px) and (min-width:361px) {
    #associeseRow > div > div {
        padding: 22px 15px
    }

    #homeDestaques .destaque {
        font-size: 16px
    }

    #homeDestaques p {
        font-size: 15px
    }
}

@media screen and (max-width:450px) {
    .slick-dots {
        align-items: center;
        display: flex;
        justify-content: center;
        list-style: none;
        margin: 0;
        padding: 0;
        position: absolute;
        width: 100%
    }

        .slick-dots button {
            background: #ccc;
            border: 0;
            border-radius: 8px;
            font-size: 0;
            height: 16px;
            margin: 0 3px;
            outline: 0;
            width: 16px
        }

        .slick-dots .slick-active button {
            background: #ba2425
        }

    #siteHeader #associeseCtn {
        display: none
    }

    #siteHeader #logo img {
        max-width: 90px
    }

    #siteHeader #membrosCtn, .sticky #siteHeader #membrosCtn {
        border: 0;
        font-size: 0;
        height: auto;
        line-height: initial;
        margin: 0;
        padding: 0;
        position: initial
    }

        #siteHeader #membrosCtn > div:first-child > div {
            background-size: 272px 299px;
            background-position: -24px 0;
            height: 23px;
            margin-right: 0;
            width: 23px
        }

        #siteHeader #membrosCtn > #membrosDropdown {
            box-shadow: 0 3px 3px rgba(0,0,0,.1);
            padding: 0;
            top: 85px;
            z-index: 8;
            width: 100%
        }

            #siteHeader #membrosCtn > #membrosDropdown > div {
                background: #fff;
                border: 0;
                border-bottom: 15px solid #eee;
                border-radius: 0;
                display: block;
                padding: 15px
            }

                #siteHeader #membrosCtn > #membrosDropdown > div > div:first-child {
                    display: none
                }

            #siteHeader #membrosCtn > #membrosDropdown input[type=text] {
                border: 1px solid #c9c9c9;
                border-radius: 20px;
                height: 40px
            }

            #siteHeader #membrosCtn > #membrosDropdown input[type=submit] {
                border-radius: 20px;
                height: 40px
            }

    #siteHeader #busca, .sticky #siteHeader #busca {
        order: initial;
        margin-right: 15px
    }

        #siteHeader #busca input[type=image] {
            height: 25px;
            padding: 0;
            width: 25px
        }

        #siteHeader #busca div:first-child, .sticky #siteHeader #busca div:first-child {
            border-right: 0;
            margin-right: 0;
            padding-right: 0
        }

    #associeseRow > div:nth-child(2) > div {
        border-bottom: 0;
        border-radius: 0;
        border-top: 0
    }

    #associeseRow > div:nth-child(1) > div {
        border-radius: 15px 15px 0 0
    }

    #associeseRow > div:nth-child(3) > div {
        border-radius: 0 0 15px 15px
    }

    #homeEventos a img {
        display: block;
        width: 100%
    }

    #siteHeader #busca #buscaTextSubmit {
        padding: 15px
    }

    #siteHeader #busca > #buscaTextSubmit > div {
        display: block
    }

    #siteHeader #busca input[type=text], .sticky #siteHeader #busca input[type=text] {
        font-size: 30px;
        width: 100%;
        text-align: center
    }

    #siteHeader #busca #buscaTextSubmit input[type=image], .sticky #siteHeader #busca #buscaTextSubmit input[type=image] {
        display: block;
        height: 60px;
        margin: 10px auto;
        width: 60px
    }


    .nav-tabs {
        margin: 0;
    }

        .nav-tabs .nav-item {
            margin-bottom: 5px;
            width: 100%;
        }

        .nav-tabs .nav-link {
            border-radius: 15px;
            border: 1px solid #dee2e6 !important;
            margin: 0;
            border-color: #dee2e6;
        }

    table, tbody, td, th, thead, tr {
        /*display: block*/
    }

    .tbl thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px
    }

    .tbl td {
        border: none;
        border-top: 1px solid #ddd;
        position: relative;
        /*padding-left: 40%;*/
        white-space: normal;
        text-align: left
    }

        .tbl td:first-child {
            /*border-top: none*/
        }

        .tbl td:before {
            position: absolute;
            left: 10px;
            width: 35%;
            padding-right: 10px;
            white-space: nowrap;
            text-align: left;
            font-weight: 700
        }

        .tbl td:before {
            content: attr(data-title)
        }

    .pagination > span > a, .pagination > span > span.paginas {
        display: none
    }

        .pagination > span > a.anterior, .pagination > span > a.proximo {
            display: block
        }

    .pagination > span {
        border-radius: .25rem;
        justify-content: center;
        width: 100%
    }
}
