html {
    font-size: 100%;
}

html,
body {
    height: 100%;
    background-color: #DEE0DF;
    color: #000000;
    font-family: Roboto, Helvetica, Tahoma, sans-serif;
}

body,
p,
h1,
h2,
h3,
h4 {
    margin: 0;
    border: 0;
    padding: 0;
}

img {
    border: 0;
    margin: 0;
}

a:focus {
    outline: thin dotted;
}

a:active,
a:hover {
    outline: 0;
}

.autoTamano {
    max-width: 100%;
    max-height: 100%;
}

.listaLimpia,
.listaLimpia > li {
    list-style-image: none;
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.pagina {
    height: 100%;
    display: flex;
    flex-flow: column nowrap;
}

.pagina-encabezado {
    width: 100%;
    display: flex;
    flex-flow: column nowrap;
}

.actionButton {
    position: fixed;
    width: 0;
    height: 0;
    padding: 0 0 6rem 6rem;
    overflow: hidden;
    bottom: 3rem;
    right: 3rem;
    background-repeat: no-repeat;
    background-size: cover;
}

.uploadButton {
    background-image: url('../img/badge2.png');
}

@media all and (min-width: 1300px) {
    .pagina {
        max-width: 1280px;
        margin: 0 auto;
        position: relative;
        top: 5%;
        height: 90%;
        box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.06), 0 2px 5px 0 rgba(0, 0, 0, 0.2);
    }

    .actionButton {
        position: absolute;
    }
}


/*.pagina-encabezado {
    background-color: #93CCC1;;
    
    background-position: center;
    background-size: auto 15rem;
    color: #FFFFFF;
    padding-top: 1rem;
    position: relative;
}


.pagina-encabezado-banner {
    display: block;
}*/

.body{
    background-color: #93CCC1;
    

}

@media all and (max-width: 768px) {
    .pagina-encabezado {
        background-image: none;
        
    }
}

.autoTamano {
    max-width: 80%;
    max-height: 80%;
    margin: 10%;
}

.pagina-pie {
    background-color: #93CCC1;
    font-size: 0.8rem;
    padding: 1rem;
    margin: 10% auto;
}

.pagina-contenido-cargando {
    background-color: #44BBA8;
    background-image: url('../img/inicio.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

.encabezado-principal {
    background-color: #8E8C8F;
    display: flex;
    flex-flow: row nowrap;
    align-items: stretch;
    align-content: stretch;
    height: 3rem;
    line-height: 3rem;
}

.principal-titulo {
    order: 2;
    flex-grow: 1;
    font-size: 1.5rem;
    font-weight: normal;
    overflow: hidden;
    text-overflow: ellipsis;
}

.principal-menu,
.principal-busqueda {
    order: 1;
    width: 0;
    height: 0;
    padding: 0 0 3rem 3rem;
    overflow: hidden;
    background-repeat: no-repeat;
    background-size: contain;
}

.principal-menu {
    padding: 0 0 3rem 4rem;
    background-image: url('../img/headMenu.png');
    background-position: center;
}

.principal-busqueda {
    order: 3;
    background-image: url('../img/headLupa.png');
}

.encabezado-perfil {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    align-content: stretch;
    justify-content: space-around;
}

.mensaje-perfil {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    align-content: flex-start;
    justify-content: space-around;
}

.mensaje-perfil-item {
    color: #606060;
}

.mensaje-col1,
.mensaje-col3 {
    flex-grow: 0;
    padding: 0 1rem;
}

.mensaje-col2 {
    flex-grow: 1;
}

.ofertaItemImg {
    width: 6rem;
}

.encabezado-perfil > div {
    width: 50%;
}

.perfil-base {
    position: relative;
}

.imgPerfilCompleto {
    position: absolute;
    width: 3rem;
    top: 50%;
    left: 50%;
    margin-top: 0.5rem;
    margin-left: 0.5rem;
}

.encabezado-perfil-nombre {
    font-weight: normal;
    font-size: 1.3rem;
}

.encabezado-perfil-carrera {
    font-weight: normal;
    font-size: 1.1rem;
}

.imgPerfilExtrellas4 {
    width: 5rem;
    display: block;
}

.imgPerfilEditarLink {
    display: block;
    width: 5rem;
}

.imgPerfil {
    display: block;
    border-radius: 100%;
    border: 0.5rem solid #44BBA8;
    width: 5rem;
    margin: 1rem auto;
}

@media all and (min-width: 768px) {
    .imgPerfil {
        display: block;
        border-radius: 100%;
        border: 0.5rem solid #44BBA8;
        width: 5rem;
        margin: 1rem 1rem 1rem auto;
    }

    .imgPerfilCompleto {
        left: auto;
        right: 0.5rem;
        margin-left: 0;
    }
}

.oferta-aceptada {
    padding: 1rem 0;
    margin: 0 1rem;
    border-bottom: 1px solid #CCCCCC;
}

.oferta-fila {
    text-align: center;
    vertical-align: middle;
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    align-content: stretch;
    justify-content: space-around;
}

.botonFinalizarOferta {
    display: block;
    margin: 1rem auto 0 auto;
    width: 7rem;
}

.busqueda-item {
    padding: 1rem 0 0.5rem 0;
    margin: 0 1rem;
    border-bottom: 1px solid #808080;
}

.busqueda-item-titulo {
    font-weight: normal;
    font-size: 1.4rem;
}

.item-contador {
    color: #606060;
}

.busqueda-item-extra {
    color: #606060;
    text-indent: 1rem;
}

.navegacion-listado,
.navegacion-extra {
    display: flex;
    flex-flow: row nowrap;
    align-items: stretch;
    align-content: stretch;
    border-bottom: 2px solid #8E8C8F;
}

.navegacion-listado > li,
.navegacion-extra > li {
    flex-grow: 1;
    text-align: center;
}

.navegacion-listado > li > span,
.navegacion-listado > li > a {
    display: block;
    width: 100%;
    height: 0;
    padding: 0 0 3rem 0;
    overflow: hidden;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    text-indent: 200%;
}

.navegacion-listado > li > a:hover,
.navegacion-listado > li > span:hover{
    background-color: #E9EBEA;
}

.navegacion-extra > li > span,
.navegacion-extra > li > a,
.navegacion-extra > li > a:link,
.navegacion-extra > li > a:visited {
    display: block;
    width: 100%;
    height: 2rem;
    line-height: 2rem;
    padding: 0;
    overflow: hidden;
    text-decoration: none;
    color: #8E8C8F;
    font-size: 1.1rem;
    border-bottom: 2px solid transparent;
    box-sizing: border-box;
}

.navegacion-extra > li > a:hover,
.navegacion-extra > li > span:hover {
    background-color: #E9EBEA;
}

.navegacion-extra > li > span {
    color: #F25D3C;
    border-bottom: 2px solid #F25D3C;
}

.listado-link-inicio {
    background-image: url('../img/navInicio.png');
}

.listado-link-ofertas {
    background-image: url('../img/navOfertas.png');
}

.listado-link-mensajes {
    background-image: url('../img/navChat.png');
}

.listado-link-perfil {
    background-image: url('../img/navPerfil.png');
}

.listado-link-inicio.activo,
span.listado-link-inicio {
    background-image: url('../img/navInicioActivo.png');
}

.listado-link-ofertas.activo,
span.listado-link-ofertas {
    background-image: url('../img/navOfertasActivo.png');
}

.listado-link-mensajes.activo,
span.listado-link-mensajes {
    background-image: url('../img/navChatActivo.png');
}

.listado-link-perfil.activo,
span.listado-link-perfil {
    background-image: url('../img/navPerfilActivo.png');
}

.pagina-contenido {
    flex-grow: 1;
    overflow-x: hidden;
    overflow-y: auto;
    position: relative;
}

/* Particulares */
.contenido-items-cajas {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-content: flex-start;
    align-items: flex-start;
    justify-content: flex-start;
}

.items-caja {
    margin: 0.5rem;
    flex-grow: 1;
    background-color: #CCCCCC;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: calc(50% - 1rem);
    position: relative;
}

.items-caja:before {
    content: '';
    float: left;
    padding-top: 100%;
}

@media all and (max-width: 480px) {
    .contenido-items-cajas {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-content: flex-start;
        align-items: flex-start;
        justify-content: flex-start;
    }

    .items-caja:before {
        padding-top: 130%;
    }
}

@media all and (max-width: 320px) {
    .items-caja {
        margin: 0.5rem;
        flex-grow: 0;
        width: calc(100% - 1rem);
    }

    .items-caja:before {
        padding-top: 100%;
    }
}

@media all and (min-width: 768px) {
    .items-caja {
        margin: 0.5rem;
        flex-grow: 0;
        width: calc(25% - 1rem);
    }
}

@media all and (min-width: 1000px) {
    .items-caja {
        margin: 0.5rem;
        flex-grow: 0;
        width: calc(20% - 1rem);
    }
}

.items-caja-detalles {
    background-color: #E7E9E8;
    padding: 0.25rem;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    box-sizing: border-box;
}

.contenido-items-cajas-sola {
    display: flex;
    flex-direction: column;
    align-content: flex-start;
    align-items: center;
    justify-content: flex-start;
}

.contenido-items-cajas-sola > .items-caja {
    margin: 0.5rem auto;
    flex-grow: 1;
    background-color: #CCCCCC;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: calc(100% - 1rem);
    margin: 0 0.5rem;
    max-width: 480px;
    position: relative;
}

.contenido-items-cajas-sola > .items-caja:before {
    content: '';
    float: left;
    padding-top: 70%;
}

.botonOfertarLink {
    display: block;
    width: 7rem;
    margin: 1rem auto 0 auto;
}

.items-caja.item1 {
    background-image: url('../img/item1.jpg');
}

.items-caja.item2 {
    background-image: url('../img/item2.jpg');
}

.items-caja.item3 {
    background-image: url('../img/item3.jpg');
}

.items-caja.item4 {
    background-image: url('../img/item4.jpg');
}

.items-caja.item5 {
    background-image: url('../img/item5.jpg');
}

.items-caja.item6 {
    background-image: url('../img/item6.jpg');
}

.contenido-items-cajas .items-caja.item6 {
    cursor: pointer;
}

.items-caja.item7 {
    background-image: url('../img/item7.jpg');
}

.items-caja.item8 {
    background-image: url('../img/item8.jpg');
}

.items-caja.item9 {
    background-image: url('../img/item9.jpg');
}

.items-caja.item10 {
    background-image: url('../img/item10.jpg');
}

.items-caja.item11 {
    background-image: url('../img/item11.jpg');
}

.items-caja.item12 {
    background-image: url('../img/item12.jpg');
}

.items-caja.item13 {
    background-image: url('../img/item13.jpg');
}

.items-caja.item14 {
    background-image: url('../img/item14.jpg');
}

.items-caja.item15 {
    background-image: url('../img/item15.jpg');
}

.items-caja.item16 {
    background-image: url('../img/item16.jpg');
}

.items-caja.item17 {
    background-image: url('../img/item17.jpg');
}

.items-caja.item18 {
    background-image: url('../img/item18.jpg');
}

.items-caja.item19 {
    background-image: url('../img/item19.jpg');
}

.items-caja.item20 {
    background-image: url('../img/item20.jpg');
}

.items-caja-detalles-titulo {
    border-bottom: 1px solid #8E8C8F;
    font-size: 1rem;
    font-weight: normal;
    background-position: right center;
    background-repeat: no-repeat;
    background-size: contain;
}

.items-caja-detalles-controls {
    overflow: hidden;
    line-height: 1.25rem;
    height: 1.25rem;
}

.items-caja-detalles-controls,
.items-caja-detalles-controls a {
    color: #606060;
    font-size: 0.8rem;
    text-decoration: none;
    vertical-align: middle;
}

.items-caja-detalles-controls img {
    vertical-align: top;
}

.items-caja-detalles-tags,
.items-caja-detalles-tags a {
    color: #404040;
    font-size: 0.8rem;
    text-decoration: none;
}

@media all and (max-width: 768px) {

}

@media all and (max-width: 620px) {

}