﻿/* #1 MEDIA QUERIES */

/* Para todas las media querys */
    
#submenuwebrun li a.application 
{
    padding-left: 30px; 
    margin-bottom: .2em;
}
    
/* Ventanas de diálogo */   
.div-ventana-texto
{
    width: 90%;
    max-width: 40em;
    margin: auto;
}
      
.ulwindow { 
    margin: auto;
    width: 85%;
}
     
.div-buttons { 
    margin: .5em auto;
    width: 85%;
}
   
.buttonLeft 
{
    float: left;
    margin-left: 0.3em;
}

.buttonRight 
{
    float: right;
}
    
.ui-dialog
{
    width: 90% !important;
    max-width: 40em;
    margin: auto;
}
    
  
/* Tres columnas*/
@media only screen and (max-width: 1070px){
    
}

@media only screen and (min-width: 1025px)
{
    body 
    {
        width: 98%;
        max-width: 58em;
        margin: auto;
    }
    
    /* General */
    .unoCol{
        width: 33%;
    }
    .dosCol {
        width: 66%;
    }
    .tresCol {
        width: 100%;
    }
   
    /* Cabecera */
    #titulo 
    {
        float: right;
    }
   
    #titulo #titulo-texto
    {
        float: right;
        padding-top: .7em;
    }
   
    #cabeceraimagen 
    {
        float: left;
    }   

    #banner 
    {
        margin-top: .5em;
    }
   
    /* Contenido */
    #divflags 
    {
        float: right; margin-top: .5em;
    }
        #divflags-contenido 
        {
            float: right;
        }
}

/* Dos columnas */
@media only screen and (max-width: 1024px){	
}	

@media only screen and (min-width: 481px) and (max-width: 1024px) 
{
    body 
    {
        width: 98%;
        max-width: 58em;
        margin: auto;
    }
    
    /* General */
    .unoCol{
        width: 50%;
    }
    .dosCol {
        width: 50%;
    }
    .tresCol {
        width: 100%;
    }
   
    /* Cabecera */
    #titulo 
    {
        float: right;
    }
   
    #titulo #titulo-texto
    {
        float: right;
        padding-top: .7em;
    }
   
    #cabeceraimagen 
    {
        float: left;
    }   

    #banner 
    {
        margin-top: .5em;
    }    
   
    /* Contenido */
    #divflags 
    {
        margin: .5em auto auto auto;
        width: 50%;
    }
        #divflags-contenido 
        {
            margin: auto;
            display: table;
        }  

            #divflags-contenido img {width : 1.8em; margin-left: .2em;}         
}

@media only screen and (min-width: 481px) 
{
    #ulLogin, #submenuwebrun { 
        margin: auto;
        width: 90%;
    }
    
    #submenuwebrun li a.application 
    {
        padding-left: 30px; 
        margin-bottom: .2em;
    }
        
    #form2
    {
        width: 90%;
        max-width: 45em;
        margin: auto;
        padding-top: .5em;
    }  
        
    #form,  .barCont 
    {
        width: 90%;
        max-width: 25em;
        margin: auto;
        padding-top: .5em;
    }  
}

/* Una columna */
@media only screen and (max-width: 480px)
{
    body 
    {
        width: 98%;
        max-width: 58em;
        margin: auto;
    }
    
    /* General */
    .unoCol{
        width: 100%;
    }
    .dosCol {
        width: 100%;
    }
    .tresCol {
        width: 100%;
    }
    
    /* Cabecera */
    #cabeceraimagen,#banner
    {
        display: none;
    }
   
    #titulo #titulo-texto
    {
        font-size: 16px !important;
        text-align: center;
        background-color: #CF142B;
        color: White !important;
        padding-top: .5em;
        padding-bottom: .5em;
        border-radius: .5em;
    } 
     
    /* Contenido */        
    #form, #form2, .barCont 
    {
        width: 95%;
        margin: auto;
        padding-top: .5em;
    }

    #ulLogin, #submenuwebrun { 
        margin: auto;
        width: 95%;
    }
    
    #divflags 
    {
        margin: .5em auto auto auto;
        width: 50%;
    }
        #divflags-contenido 
        {
            margin: auto;
            display: table;
        }  

            #divflags-contenido img {width : 1.8em; margin-left: .2em;}    
}