@import url('https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700');

* {
    margin:         0px;
    padding:        0px;
    font-family:    'Open Sans Condensed', sans-serif;
}

a:link, a:visited, a:hover, a:active {
    text-decoration:    none;
    color:              #369;
}

fieldset {
    border-style:   solid;
    border-width:   3px;
    border-color:   #369;
    border-radius:  3px;
    padding-left:   1%;
    padding-right:  1%;
    padding-top:    5px;
    padding-bottom: 5px;
    margin-top:     5px;    
}

fieldset legend {
    font-size:      30px;
    padding-right:  10px;
    padding-left:   10px;
    color:          #369;
}

.cajaedicion {
    border-style:   solid;
    border-width:   1px;
    border-color:   #FFF;
    border-radius:  3px;
    padding-left:   1%;
    padding-right:  1%;
    padding-top:    5px;
    padding-bottom: 5px;
    margin-top:     5px;
    float:          left;
}

.cajaedicion:hover {
    border-color:   #DDD;
}

.cajaedicion h2 {
    color:      #666;
    font-size:  18px;
}

.cajaedicion input {
    color:          #666;
    width:          96%;
    font-size:      16px;
    padding-left:   2%;
    padding-right:  2%;
    padding-top:    5px;
    padding-bottom: 5px;
    border-style:   solid;
    border-color:   #AAA;
    border-width:   1px;
    border-radius:  3px;
}

.cajaedicion input:focus {
    border-color:   #369;
}

.cajaedicion select {
    color:          #666;
    width:          100%;
    font-size:      16px;
    padding-left:   2%;
    padding-right:  2%;
    padding-top:    4px;
    padding-bottom: 4px;
    border-style:   solid;
    border-color:   #AAA;
    border-width:   1px;
    border-radius:  3px;
}

.cajaedicion select:focus {
    border-color:   #369;
}

.cajaedicion textarea {
    color:          #666;
    width:          96%;
    height:         200px;
    font-size:      16px;
    padding-left:   2%;
    padding-right:  2%;
    padding-top:    4px;
    padding-bottom: 4px;
    border-style:   solid;
    border-color:   #AAA;
    border-width:   1px;
    border-radius:  3px;
}

.cajaedicion textarea:focus {
    border-color:   #369;
}

.comentario_autor {
    padding-left:       2%;
    padding-right:      2%;
    margin-top:         20px;
    background-color:   #336699;
    border-radius:      5px 5px 0px 0px;
    width:              40%;
}

.comentario_autor p {
    color:      #FFFFFF;
    font-size:  24px;
    text-align: center;
}

.comentario_texto {
    padding:            2%;
    background-color:   #D6EAF8;
    border-radius:      0px 5px 5px 5px;
    border-color:       #336699;
    border-width:       2px;
    border-style:       solid;
}

.comentario_texto p {
    font-size:  20px;
    color:      #444444;
}

.direccionip {
    width:      100%;
    text-align: center;
    color:      #999999;
}

.mensajeconfirmacion {
    font-size:      24px !important;
    margin:         0px;
    color:          #d84315;
    width:          97.5%;
    padding:        1%;
    font-family:    'Ubuntu Condensed', sans-serif;
    border-color:   #CCCCCC;
    border-style:   solid;
    border-width:   1px;
    border-radius:  5px;
}

.completo {
    width:  98%;
}

.cajamensajenegativo {
    width:          80%;
    margin-left:    10%;
    margin-right:   10%;
    text-align:     center;
    font-size:      24px;
    color:          crimson;
}

.cajamensajepositivo {
    width:          80%;
    margin-left:    10%;
    margin-right:   10%;
    text-align:     center;
    font-size:      24px;
    color:          #369;
}

.cajamenu {
    width:          29%;
    box-shadow:     0px 2px 5px #666;
    border-radius:  3px;
    margin-top:     15px;
    opacity:        0.6;
    float:          left;
    margin-left:    1%;
    margin-right:   1%;
    padding:        1%;
}

.cajamenu:hover {
    box-shadow:     0px 2px 20px #369;
    opacity:        0.8;
}

.cajamenu img {
    width:  25%;
    float:  left;
}

.cajamenu h2 {
    font-size:  24px;
}

.corte {
    clear: both;
}

.material-icons {
    font-family:    'Material Icons';
    font-weight:    normal;
    font-style:     normal;
    font-size:      24px;  /* Preferred icon size */
    display: inline-block;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;

    /* Support for all WebKit browsers. */
    -webkit-font-smoothing: antialiased;
    /* Support for Safari and Chrome. */
    text-rendering: optimizeLegibility;

    /* Support for Firefox. */
    -moz-osx-font-smoothing: grayscale;

    /* Support for IE. */
    font-feature-settings: 'liga';
}

.menuamplio {
    opacity:    1;
    transition: width 1s ease-in-out;
    width:      90%;
}

.menucorto {
    transition: opacity 1s ease-in-out;
    opacity:    0;
}

.material-icons.md-48 { font-size: 48px; }

#comentario_input {
    width:          100%;
    margin-top:     20px;
}

#comentario_input input[type='submit'] {
    width:              15%;
    float:              right;
    height:             40px;
    font-size:          24px;
    background-color:   #336699;
    border-radius:      5px;
    border-style:       none;
    color:              #FFF;
}

#comentario_input input[type='text'] {
    width:          76%;
    float:          left;
    height:         40px;
    font-size:      20px;
    border-style:   solid;
    border-radius:  5px;
    border-color:   #AAA;
    border-width:   1px;
    padding-left:   2%;
    padding-right:  2%;
}

#pestanaseleccionada {
    background-color:   #FFFFFF;
    color:              #336699;
    width:              97%;
    margin-left:        3%;
}

#resultados table {
    width:          100%;
    padding-top:    10px;
    border-spacing: 0px;
}

#resultados table .filaencabezado td {
    background-color:   #369;
}

#resultados table .filaencabezado td p {
    background-color:   #369;
    color:              #FFF;
    font-size:          18px;
    font-weight:        700;
    margin-left:        1%;
    margin-right:       1%;
}

#resultados table .filadetalle td {
    background-color:       #FAFAFA;
    border-bottom-style:    solid;
    border-bottom-width:    1px;
    border-bottom-color:    #CCC;
}

#resultados table .filadetalle td p {
    color:          #369;
    font-size:      16px;
    margin-left:    1%;
    margin-right:   1%;
}

#resultados img {
    opacity:    0.6;
    width:      18px;
    margin-top: 4px;
}

#resultados img:hover {
    opacity:    1;
}

#resultados .opcionmenu {
    width:          30px;
    margin-right:   10px;
}

@media screen and (max-width:1000px) {
    header {
        background-color:   #404040;
        height:             50px;
        position:           fixed;
        top:                0px;
        left:               0px;
        right:              0px;
        z-index:            1000;
    }

    header h1 {
        color:          #FFF;
        font-family:    'Open Sans Condensed', sans-serif;
        margin-left:    10px;
        margin-top:     10px;
        float:          left;
        font-size:      20px;
    }

    header h2{
        display:    none;
    }

    header img{
        float:  right;
    }
    
    nav {
        background-color:   #404040;
        width:              0%;
        position:           fixed;
        top:                51px;
        left:               0px;
        bottom:             0px;
        z-index:            1000;
    }

    nav button {
        width:              90%;
        margin-left:        10%;
        background-color:   #505050;
        color:              #FFFFFF;
        border-style:       none;
        font-family:        'Open Sans Condensed', sans-serif;
        font-weight:        bold;
        font-size:          20px;
        padding-top:        5px;
        padding-bottom:     5px;
        border-radius:      5px 0px 0px 5px;
        margin-top:         5px;
        text-align:         left;
        padding-left:       10%;
        overflow:           hidden;
    }

    nav button:hover {
        background-color:   #555555;
        color:              #FFFFFF;
    }
    
    nav img {
        width:          90%;
        margin-left:    5%;
        margin-right:   5%;
        margin-top:     50px;
    }
    
    .tercio {
        width:  96%;
    }

    .medio {
        width:  96%;
    }
    
    #cajalogin {
        width:          94%;
        box-shadow:     0px 0px 2px #666;
        min-height:     100px;
        margin-left:    3%;
        margin-right:   3%;
        border-radius:  0px 0px 5px 5px;
        margin-top:     50px;
        padding-bottom: 20px;
    }

    #cajalogin input {
        width:          90%;
        margin-left:    5%;
        margin-right:   5%;
        text-align:     center;
        border-style:   none;
        box-shadow:     0px 0px 2px #666;
        border-radius:  5px;
        margin-top:     20px;
        font-size:      24px;
    }

    #cajalogin input[type=submit] {
        background-color:   #369;
        color:              #FFF;
        font-weight:        bold;
        font-size:          30px;
    }

    #contenido {
        margin-left:    0%;
        margin-top:     50px;
        width:          96%;
        padding-top:    20px;
        padding-bottom: 20px;
        padding-left:   2%;
        padding-right:  2%;
    }

    #contenido h1 {
        color:              #FFFFFF;
        background-color:   #369;
        padding-left:       1%;
        padding-right:      1%;
        padding-top:        5px;
        width:              50%;
        font-size:          18px;
        border-radius:      5px 5px 0px 0px;
        text-align:         center;
        float:              left;
        height:             43px;
    }

    #contenido #divisionmenu {
        background-color:   #369;
        padding-left:       1%;
        padding-right:      1%;
        width:              98%;
        height:             3px;
    }

    #contenido #menu {
        color:              #369;
        background-color:   #FFF;
        padding-left:       1%;
        padding-right:      1%;
        width:              98%;
        min-height:         24px;
        border-radius:      0px 5px 0px 0px;
    }

    #contenido #menu p {
        float:left;
    }

    #contenido #menu #filtro {
        display:    none;
    }
}

@media screen and (min-width:1001px) {
    header {
        background-color:   #404040;
        height:             50px;
        position:           fixed;
        top:                0px;
        left:               0px;
        right:              0px;
        z-index:            1000;
    }

    header h1{
        color:          #FFF;
        font-family:    'Open Sans Condensed', sans-serif;
        margin-left:    10px;
        float:          left;
    }

    header h2{
        color:          #FFF;
        font-family:    'Open Sans Condensed', sans-serif;
        font-size:      14px;
        margin-right:   10px;
        margin-top:     14px;
        float:          right;

    }

    header img{
        float:  right;
    }
    
    nav {
        background-color:   #404040;
        width:              15%;
        position:           fixed;
        top:                51px;
        left:               0px;
        bottom:             0px;
    }

    nav button {
        width:              90%;
        margin-left:        10%;
        background-color:   #505050;
        color:              #FFFFFF;
        border-style:       none;
        font-family:        'Open Sans Condensed', sans-serif;
        font-weight:        bold;
        font-size:          20px;
        padding-top:        5px;
        padding-bottom:     5px;
        border-radius:      5px 0px 0px 5px;
        margin-top:         5px;
        text-align:         left;
        padding-left:       10%;
    }

    nav button:hover {
        background-color:   #555555;
        color:              #FFFFFF;
    }
    
    .tercio {
        width:  31%;
    }

    .medio {
        width:  47.5%;
    }
    
    .cuarto {
        width:  22.5%
    }
    
    .quinto {
        width:  17.5%
    }
    
    #ampliarmenu {
        display:    none;
    }

    #cajalogin {
        width:          40%;
        box-shadow:     0px 0px 2px #666;
        min-height:     100px;
        margin-left:    30%;
        margin-right:   30%;
        border-radius:  0px 0px 5px 5px;
        margin-top:     50px;
        padding-bottom: 20px;
    }

    #cajalogin input {
        width:          90%;
        margin-left:    5%;
        margin-right:   5%;
        text-align:     center;
        border-style:   none;
        box-shadow:     0px 0px 2px #666;
        border-radius:  5px;
        margin-top:     20px;
        font-size:      24px;
    }

    #cajalogin input[type=submit] {
        background-color:   #369;
        color:              #FFF;
        font-weight:        bold;
        font-size:          30px;
    }
    
    #contenido {
        margin-left:    15%;
        margin-top:     50px;
        width:          81%;
        padding-top:    20px;
        padding-bottom: 20px;
        padding-left:   2%;
        padding-right:  2%;
    }

    #contenido h1 {
        color:              #FFFFFF;
        background-color:   #369;
        padding-left:       1%;
        padding-right:      1%;
        padding-top:        5px;
        width:              auto;
        font-size:          30px;
        border-radius:      5px 5px 0px 0px;
        text-align:         center;
        float:              left;
        height:             43px;
    }

    #contenido #divisionmenu {
        background-color:   #369;
        padding-left:       1%;
        padding-right:      1%;
        width:              98%;
        height:             3px;
    }

    #contenido #menu {
        color:              #369;
        background-color:   #FFF;
        padding-left:       1%;
        padding-right:      1%;
        width:              98%;
        min-height:         24px;
        border-radius:      0px 5px 0px 0px;
    }

    #contenido #menu p {
        float:left;
    }

    #contenido #menu #filtro {
        color:              #369;
        font-size:          24px;
        background-color:   #FFF;
        padding-left:       1%;
        padding-right:      1%;
        margin-top:         7px;
        width:              25%;
        border-radius:      0px 5px 0px 0px;
        float:              right;
        border-style:       solid;
        border-radius:      5px;
        border-width:       1px;
        text-align:         center;
        border-color:       #AAA;
    }

    #contenido #menu #filtro:hover {
        border-color:   #369;
    }

}

/* JQUERY MODIFICATIONS */
.ui-tabs .ui-tabs-nav li a {
    font-size:  20px !important;
}
