/* Small screens */
@media only screen {

}

/* Define mobile styles */

@media only screen and (max-width: 40em) {

    .logo h1, .logo h1 a {
        font-size: 1rem;
    }

}

/* max-width 640px, mobile-only styles, use when QAing mobile issues */

/* Medium screens */
@media only screen and (min-width: 40.063em) {
    .filter-title {
        /*background-color: green;*/
    }

    .header {
        height: 66px;
    }
}

/* min-width 641px, medium screens  */

@media only screen and (min-width: 40.063em) and (max-width: 64em) {

    .filter-title {
        /*background-color: blue;*/
    }

    .top-bar, .top-bar-section, .top-bar-section ul li a {
        height: 2.0125rem;
    }

    /*
    .map-control
     */
    .map-control {
        padding: 10px 0px;
    }

    .map-control-title {
        font-size: 16px;
    }

    .map-control-opacity {
        font-size: 12px;
    }

    .base-map label {
        font-size: 12px;
    }

}

/* min-width 641px and max-width 1024px, use when QAing tablet-only issues */

/* Large screens */
@media only screen and (min-width: 64.063em) {

    .filter-title {
        /*background-color: rebeccapurple;*/
    }

    .top-bar-section ul.left {
        margin-left: 240px;
    }

    .sub-header {
        position: relative;
        bottom: 60px;
        height: 0px;
    }
}

/* min-width 1025px, large screens  */

@media only screen and (min-width: 64.063em) and (max-width: 90em) {

    .filter-title {
        /*background-color: blueviolet;*/
    }

    .top-bar-section ul.left {
        /*margin-left: 0px;*/
    }

    .logo-unal img {
        position: relative;
        bottom: 0px;
    }

    .logo-text {
        /*margin-left: 240px;*/
    }

    .top-bar {
        height: 2.0125rem;
    }

}

/* min-width 1025px and max-width 1440px, use when QAing large screen-only issues */

/* XLarge screens */
@media only screen and (min-width: 90.063em) {
    .logo-text {
        /*margin-left: 240px;*/
    }

    .top-bar {
        height: 2.0125rem;
    }

    .filter-title {
        /*background-color: greenyellow;*/
    }
}

/* min-width 1441px, xlarge screens  */

@media only screen and (min-width: 90.063em) and (max-width: 120em) {

    .logo-text {
        /*margin-left: 240px;*/
    }

    .top-bar {
        height: 2.0125rem;
    }

    .filter-title {
        /*background-color: indianred;*/
    }

}

/* min-width 1441px and max-width 1920px, use when QAing xlarge screen-only issues */

/* XXLarge screens */
@media only screen and (min-width: 120.063em) and  (max-width: 2880em) {
    body {
        /*background-color: blue;*/
    }

    .top-bar-section ul li > a {
        /*font-size: 1.2rem;*/
    }

    .logo-text {
        margin-left: 240px;
    }

    .menu-left {
        margin-left: 240px;
    }

    .menu-left > ul {
        margin-left: 16px;
    }

    .top-bar {
        height: 2.0125rem;
    }

    .filter-title {
        /*background-color: deepskyblue;*/
    }
}

/* min-width 1921px, xxlarge screens  */
/* TANGRAMA */

/* EN ESTA SECCION PUEDES MONTAR LOS ESTILOS CUANDO LA PANTALLA ES MUY PEQUEÑA */
@media only screen and (min-width: 2881px) {


}