/* ==================================================================================================================== */
/* =============================         PARTE CENTRAL DEL CSS DE MATERIAL STYLE       ================================ */
/* ==================================================================================================================== */



/* ***************************************************************************** */
/* ****************   ESTILOS GENERALES PARA TODAS PAGINAS   ******************* */
/* ***************************************************************************** */


    /* ===================================== */
    /* ==   CONTENEDORES, DIVS Y FOTOS    == */
    /* ===================================== */

        /* CONTENEDOR: Contenedor que encapsula a todo la parte de arriba de las Paginas */
        .ContenedorParteSuperiorPagina {
            width: 960px;
            margin: 0 auto;
        }

        /* DIV: Centrado... Si, solo hace eso */
        .CeldaCentrada {
            display: inline-block;
            vertical-align: middle;
        }


    /* ===================================== */
    /* ==      CONTENEDOS DE FOTOS        == */
    /* ===================================== */

        /* FOTOS: Las fotos de una manera importante en la Pagina */
        .FotoPrincipal {
            border-top-left-radius: 1em;
            border-bottom-left-radius: 1em;
            border-top-right-radius: 1em;
            border-bottom-right-radius: 1em;
            box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 7px 0 rgba(0, 0, 0, 0.19);
        }

        .FotoID {
        border-top-left-radius: 2em;
        border-bottom-left-radius: 2em;
        border-top-right-radius: 2em;
        border-bottom-right-radius: 2em;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    }





        



    /* ===================================== */
    /* ==   MATERIAL CARDS EN LA PAGINA   == */
    /* ===================================== */

        /* MDCARD: Cartas del Estilo Material Design : USADA PARA MENUS*/
        .MDCardWhiteLite {
            vertical-align:text-top;
            background-color:#FAFAFA;
            border-radius:10px;
            box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 3px 10px 0 rgba(0, 0, 0, 0.19);
            padding: 20px;
        }

        /* MDCARD: Cartas del Estilo Material Design */
        .MDCardTealLite {
            vertical-align:text-top;
            background-color:#E0F2F1;
            border-radius:10px;
            box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2), 0 4px 12px 0 rgba(0, 0, 0, 0.19);
            padding: 25px;
        }

        /* MDCARD: Cartas del Estilo Material Design */
        .MDCardAmbarLite {
            vertical-align:text-top;
            background-color:#FFF8E1;
            border-radius:10px;
            box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2), 0 4px 12px 0 rgba(0, 0, 0, 0.19);
            padding: 25px;
        }

        /* MDCARD: Cartas del Estilo Material Design */
        .MDCardBlueGreyLite {
            vertical-align:text-top;
            background-color:#ECEFF1;
            border-radius:10px;
            box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2), 0 4px 12px 0 rgba(0, 0, 0, 0.19);
            padding: 25px;
        }

        /* MDCARD: Cartas del Estilo Material Design: Util para banners */
        .MDCardOrangeLite {
            vertical-align:text-top;
            background-color:#FFE0B2;
            border-radius:10px;
            box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2), 0 4px 12px 0 rgba(0, 0, 0, 0.19);
            padding: 20px;
        }

        /* MDCARD: Cartas del Estilo Material Design: Util para banners */
        .MDCardGreenLite {
            vertical-align:text-top;
            background-color:#F1F8E9;
            border-radius:10px;
            box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2), 0 4px 12px 0 rgba(0, 0, 0, 0.19);
            padding: 20px;
        }

        /* MDCARD: Cartas del Estilo Material Design: Util para banners */
        .MDCardIndigoLite {
            vertical-align:text-top;
            background-color:#E8EAF6;
            border-radius:10px;
            box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2), 0 4px 12px 0 rgba(0, 0, 0, 0.19);
            padding: 20px;
        }

        /* MDCARD: Cartas del Estilo Material Design: Util para banners */
        .MDCardPinkLite {
            vertical-align:text-top;
            background-color:#F8BBD0;
            border-radius:10px;
            box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2), 0 4px 12px 0 rgba(0, 0, 0, 0.19);
            padding: 20px;
        }
        /* MDCARD: Cartas del Estilo Material Design: Util para banners */
        .MDCardAmbarMedium {
            vertical-align:text-top;
            background-color:#FFD740;
            border-radius:10px;
            box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2), 0 4px 12px 0 rgba(0, 0, 0, 0.19);
            padding: 20px;
        }




    

    /* ===================================== */
    /* ==   MATERIAL CARDS ESPECIALES     == */
    /* ===================================== */
        .MDCardDivLeftHardAmbar {
            background-color:#FDD835;
            border-top-left-radius: 10px;
            border-bottom-left-radius: 10px;
            padding: 25px;
        }
        

/* ***************************************************************************** */
/* **********************   FUENTES DE LA PAGINA   ***************************** */
/* ***************************************************************************** */


    /* ===================================== */
    /* ==  FUENTES DE ENCABEZADO - TITULO == */
    /* ===================================== */

        /* FUENTE: Titulos ... Pero pequeños, pequeños */
        .FuenteTituloPrincipalMiniMini {
            font-size: 1.35rem;
            color:#004D40;
        }

        /* FUENTE: Titulos ... Pero pequeños */
        .FuenteTituloPrincipalMini {
            font-size: 1.55rem;
            color:#004D40;
        }

        /* FUENTE: Titulos ... Los que deberiamos usar pero un poco mas normal */
        .FuenteTituloPrincipalMediano {
            font-size: 1.80rem;
            color:#004D40;
        }

        /* FUENTE: Titulos ... Los que deberiamos usar */
        .FuenteTituloPrincipal {
            font-size: 2.00rem;
            color:#004D40;
        }


    /* ===================================== */
    /* == FUENTES ESPECIALES EN LA PAGINA == */
    /* ===================================== */

        /* FUENTE: Tamaño de los Encabezados para el NOMBRE de la Pagina */
        .FuenteEncabezadosFuerte {
            font-family: 'Titillium Web';
            color:#616161;
        }

        /* FUENTE: Tamaño de los Encabezados del link a Pagina */
        .FuenteEncabezadosDebil {
            font-family: 'Titillium Web';
            color:#424242;
        }

        /* FUENTE: Parte de la Barra Horizontal */
        .FuenteBarraHorizontalSecundaria {
            font-family: 'Titillium Web';
            font-size: 1.05rem;
            color: #004D40;
            font-weight:bold;
        }

        /* FUENTE: Parte de la Barra Horizontal */
        .FuenteBarraHorizontalPrincipal {
            font-family: 'Titillium Web';
            font-size: 1.2rem;
            color: #3F51B5;
            font-weight:bold;
        }




    /* ===================================== */
    /* == FUENTES TEXTO - NORMAL - BOTON  == */
    /* ===================================== */

        /* FUENTE: Para un Texto de Informacion, por ejemplo para Card un poco mas grande*/
        .FuenteTextoParrafoSecundario {
            font-size: 1.10rem;
            color:#004D40;
            text-align: justify;
        }

        /* FUENTE: Parrafo de buen tamaño */
        p.FuenteTextoParrafo {
            font-size: 1.20rem;
            color:#004D40;
            text-align: justify;
        }

        /* FUENTE: Para un Texto de Informacion, por ejemplo para Card */
        .FuenteTextoInformacion {
            font-size: 1.30rem;
            color:#004D40;
            text-align: justify;
        }

        /* FUENTE: Fuente de Texto Chips */
        .FuenteTextoChip{
            font-size: 1.40rem;
            color:#212121;
        }

        /* FUENTE: Fuente de Pie de Pagina */
        .FuentePieDePagina{
            font-size: 0.95rem;
            text-align: left;
        }


    /* ===================================== */
    /* ===  FUENTES DE HYPER REF        ==== */
    /* ===================================== */
        /* FUENTE: Fuente de Links */
        a.FuenteTextoParrafo:link {
            font-size: 1.20rem;
            color:#004D40;
            text-align: justify;
            text-decoration:underline;
        }


    /* ===================================== */
    /* ===  FUENTES DE LISTAS           ==== */
    /* ===================================== */
        /* FUENTE: Parrafo de buen tamaño */
        li.FuenteTextoParrafo {
            font-size: 1.20rem;
            color:#004D40;
            text-align: justify;
        }


    /* ===================================== */
    /* ===  FUENTES  PARA FORMULARIOS   ==== */
    /* ===================================== */
/* do not group these rules */
*::-webkit-input-placeholder {
    color: red;
}
*:-moz-placeholder {
    /* FF 4-18 */
    color: red;
    opacity: 1;
}
*::-moz-placeholder {
    /* FF 19+ */
    color: red;
    opacity: 1;
}
*:-ms-input-placeholder {
    /* IE 10+ */
    color: red;
}
*::-ms-input-placeholder {
    /* Microsoft Edge */
    color: red;
}
*::placeholder {
    /* modern browser */
    color: red;
}
        /* FUENTE: Citas del Index */
        p.FuenteTextoCitas {
            color: #455A64;
            font-size: 0.90rem;
            font-weight: bold;
            font-style: oblique;
        }

        /* FUENTE: Usada para el Nombre de Campos de Formulario */
        .FuenteFormularioNombreDelCampo {
            font-weight:bold;
            font-size: 1.30rem;
            color:#37474F;
        }

        /* FUENTE: Usada para el Valor de Campo de Formulario */
        .FuenteFormularioValorDelCampo{
            font-weight: bold;
            font-size: 1.15rem;
            color: #757575;
            background: transparent;
            border: none;
            border-bottom: 1px solid #BDBDBD;
        }

        /* FUENTE: Usada para el Anotaciones en un Formulario */
        .FuenteFormularioAnotacionesDelCampo{
            font-weight: bold;
            font-size: 0.95rem;
            color: #455A64;
        }
		
 




























































































/* ==================  PARA LA PARTE CENTRAL DE LA PAGINA  ==================== */

    .estiloTituloPrincipal{
        font-size: 190%;
        color:#004D40;
    }

    .estiloTituloPrincipalEnorme{
        font-size: 230%;
        color:#004D40;
    }

    .estiloTituloPrincipalMini{
        font-size: 155%;
        color:#004D40;
    }


    .estiloTextoMediano{
        font-size: 130%;
        color:#004D40;
    }

    .estiloTextoChip{
        font-size: 140%;
        color:#212121;
    }

    .estiloTextoInstrucciones{
        font-size: 90%;
        color:#004D40;
    }

    p.estiloTextoParrafo{
        font-size: 115%;
        color:#004D40;
        text-align: justify;
    }

    p.estiloParrafoImportante{
        font-size: 120%;
        color:#D32F2F;
        font-weight:bold;
        text-align: justify;
    }


/* ==================  PARA LA PARTE LATERAL DE LA PAGINA  =================== */

    .estiloTituloLateral{
        color:#1A237E;
        font-size: 150%;
    }




/* ==================  DATOS INMPORTANTES  =================================== */   

    .estiloTitulo{
        font-size:20px;
    }

    .estiloDatosNombre{
        font-weight:bold;
        font-size:17px;
        color:#37474F;
    }

    .estiloDatosValorSelect{
        font-weight:bold;
        font-size:16px;
        color:#757575;
        background: transparent;
         border: none;
    border-bottom: 1px solid #BDBDBD;
    }

    .estiloDatosValor{
        font-weight:bold;
        font-size:16px;
        color:#757575;
        border: none;
        border-bottom: 1px solid #BDBDBD;
        background: transparent;
    }

    p.estiloTextoParrafo{
        font-size: 130%;
        color:#004D40;
        text-align: justify;
    }

    .estiloParrafoMini{
        color: #004D40;
        font-size: 15px;
        text-align: justify;
    }

    .estiloParrafoAzul{
        color: #1A237E;
        font-size: 13px;
        text-align: justify;
    }
    .estiloAnotaciones{
        font-weight:bold;
        font-size:14px;
        color:#455A64;
    }


/* ==================  DATOS INMPORTANTES  =================================== */   
    .MDCard {
        vertical-align:text-top;
        background-color:#ECEFF1;
        border-radius:10px;
        box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        padding: 25px;
    }

    .MDCardAmbar {
        vertical-align:text-top;
        background-color:#FFF8E1;
        border-radius:10px;
        box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        padding: 25px;
    }

    .MDCardAzul {
        vertical-align:text-top;
        background-color:#FFECB3;
        border-radius:10px;
        box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2), 0 2px 3px 0 rgba(0, 0, 0, 0.19);
        padding: 15px;
    }

    .MDCardDivisorIzquierdo {
        background-color:#FDD835;
        border-top-left-radius: 2em;
        border-bottom-left-radius: 2em;
        padding: 10px;
    }

    .MDCardDivisorDerecho {
        background-color:#FFF8E1;
        border-top-right-radius: 10px;
        border-bottom-right-radius: 10px;
        padding: 30px;
    }


    .foto {
        border-top-left-radius: 2em;
        border-bottom-left-radius: 2em;
        border-top-right-radius: 2em;
        border-bottom-right-radius: 2em;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    }

    .MDCardDatos {
        border-top-left-radius: 2em;
        border-bottom-left-radius: 2em;
        border-top-right-radius: 10em;
        border-bottom-right-radius: 10em;
        box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        padding: -1px;
    }



    #nacionalidad{
        width:350px;   
    }

    #paisNacimiento{
        width:350px;   
    }

    #entidadFederativaNacimiento{
        width:350px;   
    }



/* ==================  TABLA EN MD  ========================================== */    

    .TableDivider {
        background-color:#F5F5F5;
        border-radius:10px;
        box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
        padding: 8px;
    }

    .MDCardTable {
        vertical-align:text-top;
        border-collapse: collapse;
    }

    .MDCardTable tr { 
      border-bottom: 1px solid #ddd;
    }
    .MDCardTable tr:hover { 
      background-color: #ECEFF1;
    }

    .MDCardTable td {
        padding:0 15px 0 15px;
    }

    .MDCardTable tr:first-child {
      border-top: none;
      background-color: #F5F5F5;
    }
    .MDCardTable tr:last-child {
      border-bottom: none;
    }