@import '../functions.less';
@import '../../../../files/config/colors.less';


.drs-council-01 {
    * { .fx(); }
    position: relative;
    overflow: hidden;
    padding-top: 0;
    header {
        display: block;
        text-transform: uppercase;
        font-weight: bold;
        font-size: 1.25em;
        margin-bottom: 40px;
        border-bottom: 2px solid #1238;
        padding-bottom: 3px;
    }
    .conselho {
        .representacao {
            .grid(60px auto 1fr; 20px);
            font-size: 1.3em;
            color: @fundoTopo1;
            hr {
                border: none;
                border-top: 1px solid #EEE;
                border-bottom: 1px solid @fundoTopo1;
            }
        }
        .grid {
            .grid(1fr 1fr; 10px; stretch);
            padding: 30px 0 50px 0;
            .membro {
                .card(20px);
                .nome {
                    font-size: 1.15em;
                }
                span {
                    display: block;
                    font-style: italic;
                    font-size: .9em;
                    opacity: 70%;
                    margin-bottom: 10px;
                }

                .configBTNcontato(){
                    content: "";
                    display: inline-block;
                    width: 35px;
                    height: 25px;
                    margin-right: 10px;
                    background-size: 16px;
                    background-position: center;
                }
                .email:empty, .phone:empty  {
                    display: none;
                }
                .email:not(:empty) {
                    background: #1231;
                    max-width: 350px;
                    &:before {
                        background: #0005 no-repeat url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAB/0lEQVR4nO3YTYhNcRjH8b/3vCVvJUQUyWKKbKQkpWZFYWGBsrG1nOwsLGZriR2ZJDuUWEgpSlJS3sJGyEsh78N8dOq5dbpNY5q5Z+69/8637j2L8z/PyznneZ7f/6RUU1NTU9MOZEKSUSJ/ZJJILz7qXoZwvFEnK3BX9/EFuxtJbI7jLAzoHh5gTcS+sPgbRF+pix3Gb53NAGZHvBvwoty1zmBmnNyKtzqPwaabfgDfhmu/97AyFi3HHZ3DO2yP2GbgxP/myPumC05rP7ewNGJahtujHYjD1c0v7eEkppde+Tdjmeznim4WRrbgtYnjBw6F70k4MlITGo1EuY9VYXAxbqieZ+gJn3NwoVVa6wN2hOGp6FcdlzE/fK3Fw1aLxkKT9RWPOZzsx3etlRr9mBz2d+JTler3fNMwemn8FFqvN2xOwbFIrHIZ/wjrwvEiXDd2ihpcXbJ1baL3I5+xq3QXx1I3Z0tdceN4nm5q8Xu9D19Hcd3Pop2W5tTB8dZb0houYV4E1YPnI6x9VVLchXI41Wlb3SdYHwEuwNVh1tzEkiq0XFLRRiemcdGu/5akxrQ4t63V6jppPUPRPht1swd7S8kdreI7QVIdVxoTOpKYi4vd+jnoKTbF73GVjpJMSDIhyYQkE5JMSDIhyYQkE5JMSDIhyYRUU1NTU5PawD95ZgOCo89UiQAAAABJRU5ErkJggg==);
                        .configBTNcontato();
                    }
                }
                .phone:not(:empty) {
                    background: #1231;
                    max-width: 350px;
                    &:before {
                        background: #0005 no-repeat url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAACEElEQVR4nO3ZzYtNYRzA8Z/XUWJDGKJk5WUpWUrsyEYUNanBn6D8BbLDCv+BxcR4jSxQkxoLRnmLImXl5UZIqI9OcxY3Zu7c59zuuc9kPn/B/fac+5zn+Z2IGTN6B3swii94gK0xnWAezvpXA6tiOsAiXDe5a5E7rMQTUxuIXGE5XmjPJ/RHbjAfI9IMR25wXDUHIyd4UzHkA1ZELvBVdUORC7zUmf2RAwx1GPI8coCjHYZ8jxxgGX53EHI/coHbHYQM5HbSreIRZkcuMAtjFUJ2Rm6wLzHicuTI+KrcSwgZjFxhI34mnILXRa5wMmFVHmJh5Ah95Q9sV7F190WOsAHfEmIuYm7kCEekOV9sGJEjE09TWjkVGY+G7iTGnM5yZYwPJl5VeMzmRG6wBm8TYy5hQeQGm/AxMebmRO+ZYrVwqBzF/sKz4ohUZ8yWchacYqz5BIDtLd5TV4pBYV0xO/AjMaY4zgziapvTmQN13l9SY1T4j/XXEbOtwmOWqlHMFOqI2Yz3uu8GVtdx9H9XQ0yj2Gy6HbO2wkuzitGuhjSNlVJumFV87npI0yeKc10MGaklpCnocOJ9pl27ag0pY9Yn3jSncqb2iL+uzScSBhqttt/e30DLLfquah5jcWQ2N9ub+Lg9Le5DkaMyaDdulUf4yRRb+dKYDrCkPBVfKD4YlZ8BX+NYcc3u9e+b8d/6A8BzVur0abPMAAAAAElFTkSuQmCC);
                        .configBTNcontato();
                    }
                    &.whatsapp:before {
                        background: #090 no-repeat url(data:image/png;base64,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);
                        background-size: 60%;
                        background-position: center;
                    }
                }
                .mandato:before {
                    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAyNS4yLjEsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iQ2FtYWRhXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB2aWV3Qm94PSIwIDAgNjAgNDAiIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDYwIDQwOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQo8c3R5bGUgdHlwZT0idGV4dC9jc3MiPg0KCS5zdDB7ZmlsbDojRkZGRkZGO30NCgkuc3Qxe2ZpbGw6IzAxMDEwMTt9DQo8L3N0eWxlPg0KPHBhdGggZD0iTTYwLDR2MzJjMCwyLjItMS44LDQtNCw0SDRjLTIuMiwwLTQtMS44LTQtNFY0YzAtMi4yLDEuOC00LDQtNGg1MkM1OC4yLDAsNjAsMS44LDYwLDR6Ii8+DQo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNNDguMiw0LjZjMCwxLjEtMS4xLDEuNy0yLjksMS43Yy0xLjcsMC0yLjYtMC42LTIuNi0xLjhjMC0xLDAtMiwwLTIuOWMwLTAuNSwwLTEuMSwwLTEuNmg1LjYNCglDNDguMiwxLjUsNDguMiwzLjEsNDguMiw0LjZ6Ii8+DQo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNMTcuOSw0LjZjMCwxLjEtMSwxLjctMi43LDEuN2MtMS44LDAtMi44LTAuNS0yLjktMS43YzAtMS42LDAtMy4xLDAtNC43aDUuNmMwLDAuNiwwLDEuMSwwLDEuNw0KCUMxNy45LDIuNiwxNy45LDMuNiwxNy45LDQuNnoiLz4NCjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0yOS45LDEwLjljNy44LDAsMTUuNiwwLDIzLjQsMGMxLDAsMS4yLDAuMiwxLjIsMWMwLDguMSwwLDE2LjIsMCwyNC4yYzAsMC43LTAuMywwLjktMS4yLDAuOQ0KCWMtMTUuNiwwLTMxLjIsMC00Ni43LDBjLTAuOSwwLTEuMi0wLjEtMS4yLTAuOWMwLTguMSwwLTE2LjIsMC0yNC4zYzAtMC43LDAuMy0wLjksMS4yLTAuOUMxNC4zLDEwLjksMjIuMSwxMC45LDI5LjksMTAuOXoiLz4NCjxnPg0KCTxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik0zNS41LDE5LjNjLTEsMC0yLDAtMi45LDBjLTAuNywwLTEtMC4yLTEtMC43YzAtMS4yLDAtMi41LDAtMy43YzAtMC42LDAuMy0wLjcsMS4xLTAuN2MxLjksMCwzLjksMCw1LjgsMA0KCQljMC43LDAsMSwwLjEsMSwwLjdjMCwxLjMsMCwyLjUsMCwzLjhjMCwwLjUtMC4zLDAuNy0xLDAuN0MzNy41LDE5LjIsMzYuNSwxOS4zLDM1LjUsMTkuM3oiLz4NCgk8cGF0aCBjbGFzcz0ic3QxIiBkPSJNNDYuOCwxOS4zYy0xLDAtMiwwLTMsMGMtMC43LDAtMC45LTAuMi0wLjktMC43YzAtMS4zLDAtMi42LDAtMy45YzAtMC40LDAuMy0wLjYsMC45LTAuNmMyLjEsMCw0LjEsMCw2LjIsMA0KCQljMC42LDAsMC44LDAuMiwwLjgsMC42YzAsMS4zLDAsMi42LDAsMy45YzAsMC41LTAuMywwLjctMC45LDAuNkM0OC44LDE5LjIsNDcuOCwxOS4zLDQ2LjgsMTkuM3oiLz4NCgk8cGF0aCBjbGFzcz0ic3QxIiBkPSJNMTMsMjEuM2MxLDAsMiwwLDMsMGMwLjcsMCwxLDAuMiwwLjksMC43YzAsMS4yLDAsMi41LDAsMy43YzAsMC42LTAuMywwLjctMS4xLDAuN2MtMS45LDAtMy45LDAtNS44LDANCgkJYy0wLjgsMC0xLTAuMi0xLTAuOGMwLTEuMiwwLTIuNCwwLTMuNmMwLTAuNiwwLjMtMC44LDEuMS0wLjhDMTEuMSwyMS40LDEyLjEsMjEuMywxMywyMS4zeiIvPg0KCTxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik0yNC4zLDI2LjVjLTEsMC0yLDAtMi45LDBjLTAuNywwLTEuMS0wLjEtMS4xLTAuN2MwLTEuMiwwLTIuNSwwLTMuN2MwLTAuNSwwLjItMC43LDEtMC43YzIsMCw0LDAsNiwwDQoJCWMwLjcsMCwxLDAuMSwxLDAuN2MwLDEuMywwLDIuNSwwLDMuOGMwLDAuNi0wLjMsMC43LTEsMC43QzI2LjMsMjYuNSwyNS4zLDI2LjUsMjQuMywyNi41eiIvPg0KCTxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik0zNS42LDIxLjNjMSwwLDIsMCwzLDBjMC42LDAsMC44LDAuMiwwLjgsMC42YzAsMS4zLDAsMi42LDAsNGMwLDAuNC0wLjMsMC42LTAuOCwwLjZjLTIuMSwwLTQuMiwwLTYuMywwDQoJCWMtMC41LDAtMC44LTAuMi0wLjgtMC42YzAtMS4zLDAtMi42LDAtNGMwLTAuNCwwLjMtMC42LDAuOS0wLjZDMzMuNSwyMS4zLDM0LjUsMjEuMywzNS42LDIxLjN6Ii8+DQoJPHBhdGggY2xhc3M9InN0MSIgZD0iTTQ2LjgsMjYuNWMtMSwwLTIsMC0zLDBjLTAuNiwwLTAuOS0wLjItMC45LTAuN2MwLTEuMywwLTIuNSwwLTMuOGMwLTAuNSwwLjMtMC43LDEtMC43YzIsMCw0LDAsNiwwDQoJCWMwLjcsMCwxLDAuMiwxLDAuN2MwLDEuMiwwLDIuNSwwLDMuN2MwLDAuNi0wLjMsMC44LTEsMC43QzQ4LjcsMjYuNSw0Ny43LDI2LjUsNDYuOCwyNi41eiIvPg0KCTxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik0xMy4xLDMzLjdjLTEsMC0yLDAtMywwYy0wLjcsMC0xLTAuMS0xLTAuN2MwLTEuMywwLTIuNSwwLTMuOGMwLTAuNSwwLjMtMC43LDAuOS0wLjdjMiwwLDQuMSwwLDYuMSwwDQoJCWMwLjcsMCwwLjksMC4yLDAuOSwwLjdjMCwxLjIsMCwyLjUsMCwzLjdjMCwwLjUtMC4zLDAuNy0xLDAuN0MxNSwzMy43LDE0LjEsMzMuNywxMy4xLDMzLjd6Ii8+DQoJPHBhdGggY2xhc3M9InN0MSIgZD0iTTI0LjMsMzMuN2MtMSwwLTIsMC0zLDBjLTAuNywwLTEtMC4xLTEtMC43YzAtMS4zLDAtMi41LDAtMy44YzAtMC41LDAuMy0wLjcsMC45LTAuN2MyLDAsNC4xLDAsNi4xLDANCgkJYzAuNywwLDAuOSwwLjIsMC45LDAuN2MwLDEuMiwwLDIuNSwwLDMuN2MwLDAuNS0wLjMsMC43LTEsMC43QzI2LjMsMzMuNywyNS4zLDMzLjcsMjQuMywzMy43eiIvPg0KCTxwYXRoIGNsYXNzPSJzdDEiIGQ9Ik0zNS42LDI4LjZjMSwwLDEuOSwwLDIuOSwwYzAuNywwLDEsMC4yLDEsMC43YzAsMS4yLDAsMi41LDAsMy43YzAsMC41LTAuMiwwLjctMC45LDAuN2MtMiwwLTQuMSwwLTYuMSwwDQoJCWMtMC42LDAtMC45LTAuMi0wLjktMC42YzAtMS4zLDAtMi41LDAtMy44YzAtMC41LDAuMy0wLjcsMS0wLjdDMzMuNiwyOC42LDM0LjYsMjguNiwzNS42LDI4LjZ6Ii8+DQoJPHBhdGggY2xhc3M9InN0MSIgZD0iTTQ2LjgsMjguNmMxLDAsMS45LDAsMi45LDBjMC43LDAsMSwwLjIsMSwwLjdjMCwxLjIsMCwyLjUsMCwzLjdjMCwwLjUtMC4yLDAuNy0wLjksMC43Yy0yLDAtNC4xLDAtNi4xLDANCgkJYy0wLjYsMC0wLjktMC4yLTAuOS0wLjdjMC0xLjMsMC0yLjUsMC0zLjhjMC0wLjUsMC4zLTAuNywxLTAuN0M0NC44LDI4LjYsNDUuOCwyOC42LDQ2LjgsMjguNnoiLz4NCjwvZz4NCjwvc3ZnPg0K);
                }
                .email, .phone, .mandato {
                    .flex();
                    font-size: .9em;
                    &:before {
                        content: "";
                        display: inline-block;
                        width: 20px;
                        height: 13px;
                        margin-right: 10px;
                        background-size: cover;
                        background-position: center;
                        opacity: 50%;
                    }
                }
                .email {
                    color: @corLink;
                    cursor: pointer;
                    margin-bottom: 3px;
                    &:hover {
                        color: @corLinkHover;
                    }
                }
                .mandato {
                    color: #888;
                }
                &.hide {
                    opacity: 0;
                }
            }
            &:last-child {
                padding-bottom: 0;
            }
        }
    }
}

@media screen and ( max-width: 850px ){
    .drs-council-01 .conselho {
        .representacao {
            .grid(40px auto 1fr; 20px);
            font-size: 1.1em;
        }
        .grid {
            .grid(1fr; 10px);
            .membro .nome {
                font-size: 1.05em;
            }
        }
    }
}

@media screen and ( max-width: 600px ){
    .drs-council-01 .conselho .representacao {
        .grid(1fr 240px 1fr; 10px);
        text-align: center;
    }
}