body,
html {
    margin: 0;
    height: 100%;
    width: 100%;
    font-family: 'Amsi Pro';
}

/*          SECCION DE TITULO         */
.titulo {
    font-size: 2vw;
    text-align: center;
}

.col {
    text-align: center;
}

.descripcion {
    font-size: .85vw;
    letter-spacing: 0px;
    word-spacing: 0px;
    color: #000000;
    font-weight: bold;
    text-decoration: none;
    font-style: normal;
    font-variant: normal;
    text-transform: none;
    text-align: center;
}

/*          SECCION DE ICONOS          */
.cc-selector input {
    margin: 0;
    padding: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.cc-selector-2 input {
    position: absolute;
    z-index: 999;
}

.aPublico {
    background-image: url(/assets/images/n_alumbrado_publico.png);
}

.bache {
    background-image: url(/assets/images/n_bache.png);
}

.desazolve {
    background-image: url(/assets/images/n_desazolve.png);
}

.fAgua {
    background-image: url(/assets/images/n_fuga_agua.png);
}

.fAguaNegra {
    background-image: url(/assets/images/n_fuga_negra.png);
}

.lCalles {
    background-image: url(/assets/images/n_limpieza_calles.png);
}

.rBasura {
    background-image: url(/assets/images/n_recoleccion_basura.png);
}

.semaforo {
    background-image: url(/assets/images/n_semaforo.png);
}

.vAbandonado {
    background-image: url(/assets/images/n_vehiculo_abandonado.png);
}

.otro {
    background-image: url(/assets/images/n_otro.png);
}

.cc-selector-2 input:active+.drinkcard-cc,
.cc-selector input:active+.drinkcard-cc {
    opacity: .9;
}

.cc-selector-2 input:checked+.drinkcard-cc,
.cc-selector input:checked+.drinkcard-cc {
    -webkit-filter: none;
    -moz-filter: none;
    filter: none;
}

.drinkcard-cc {
    cursor: pointer;
    background-size: 85%;
    background-position: center center;
    background-repeat: no-repeat;
    width: 100px;
    max-width: calc(100% - 35px);
    height: 100px;
    max-height: calc(100% - 35px);
    display: inline-block;
    -webkit-transition: all 100ms ease-in;
    -moz-transition: all 100ms ease-in;
    transition: all 100ms ease-in;
    -webkit-filter: brightness(.8) grayscale(1) opacity(.7);
    -moz-filter: brightness(.8) grayscale(1) opacity(.7);
    filter: brightness(.8) grayscale(1) opacity(.7);
}

.drinkcard-cc:hover {
    -webkit-filter: brightness(1.2) grayscale(.2) opacity(.9);
    -moz-filter: brightness(1.2) grayscale(.2) opacity(.9);
    filter: brightness(1.2) grayscale(.2) opacity(.9);
}

.cc-selector-2 input {
    margin: 5px 0 0 12px;
}

.cc-selector-2 label {
    margin-left: 7px;
}

/*          SECCION DE MAPA          */
#map {
    width: 100%;
    height: 550px;
}

.list-inline {

    filter: invert(57%) sepia(80%) saturate(1653%) hue-rotate(344deg) brightness(102%) contrast(93%);
}

.contador {
    float: right;
    font-size: small;
    font-style: italic;
    padding: 5px;
}

/* pagina gracias */

.titulo_gracias {
    font-size: 2vw;
    text-align: center;
    color: #f68728;
}

.reporte_nuevo a {
    color: #f68728;
    background-color: transparent;
    text-decoration: none;
}

/*          AJUSTE DE PÁGINA          */
@media screen and (max-width: 575.98px) {
    .titulo {
        font-size: 5vw;
        text-align: center;
    }

    .titulo_gracias {
        font-size: 7vw;
    }

    .col-sm-3 {
        position: relative;
        align-content: center;
        align-items: center;
    }

    .descripcion {
        font-size: 3vw;
    }

    .position-absolute {
        left: 0;
    }

    .footer {
        position: relative;
        bottom: -400px;
    }

    .container-fluid img,
    a {
        width: 50%;
        align-content: center;
        align-items: center;
    }
}