/*EMPIEZA ESTRUCTURA GENERAL COMPLETA PARA gridMain: EL RESTO SON DERIVADAS DE ESTA*/
/***********************************************************************/

div
{
   /* 
    padding:9px;
    margin:9px;

    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;*/
}

.gridMain{
    display: grid;
    /*border: turquoise 1px solid;*/
    width: auto;
    grid-template-columns: repeat(3, auto);
    grid-template-rows: repeat(14, auto);
    grid-column-gap: 5%;
    grid-row-gap: 0px;
    grid-template-areas: 
    'gm1 gm1 gm1' 
    'gm2 gm2 gm2' 
    'gm3 gm3 gm3' 
     
    'gcol_izq_1 gcc_2 gcol_der_1'
    'gcol_izq_1 gcc_4 gcol_der_2'
    'gcol_izq_1 gcc_9 gcol_der_3'

    'gcol_izq_2 gcc_9 .'
    'gcol_izq_3 gcc_9 .'

    '. gcc_1 .'
    '. gcc_3 .'
    '. gcc_5 .'
    '. gcc_6 .'
    '. gcc_7 .'
    '. gcc_8 .'

    'gm7 gm7 gm7'
    'gm8 gm8 gm8';
    align-items: start;
}

.gm1{grid-area:gm1;}
.gm2{grid-area:gm2;height:280px;}

/* contiene: buscador*/
.gm3 {
    grid-area: gm3;
    background-image: url("/images/background-buscador-repo-ade-001.jpg");
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}


.gcol_izq_1{grid-area:gcol_izq_1;} /* contiene: lista Series*/
.gcol_izq_2{grid-area:gcol_izq_2;}
.gcol_izq_3{grid-area:gcol_izq_3;} /* no tiene contenidos todavía*/

.gcc_1{grid-area:gcc_1; margin-bottom: 2%; border: tomato 0px dashed;} /*contiene:random*/
.gcc_2{grid-area:gcc_2;}
.gcc_3{grid-area:gcc_3;}
.gcc_4{grid-area:gcc_4;}
.gcc_5{grid-area:gcc_5;}
.gcc_6{grid-area:gcc_6;}
.gcc_7{grid-area:gcc_7;border: tomato 0px dashed; width: 70%; max-width: 800px; margin: auto;}
.gcc_8{grid-area:gcc_8;border: tomato 0px dashed; width: 70%; max-width: 800px; margin: auto;}
.gcc_9{grid-area:gcc_9;}

.gcol_der_1{grid-area:gcol_der_1;grid-row:4/span 9;} 
.gcol_der_2{grid-area:gcol_der_2;}
.gcol_der_3{grid-area:gcol_der_3;}

.gm7{grid-area:gm7;} /* no tiene contenidos todavía*/
.gm8{grid-area:gm8;}


.gcc_2,
.gcc_4,
.gcc_9 {
    background-color: rgba(206, 228, 235, 0.137);
    box-shadow: -5px 0 5px -5px rgba(68, 66, 66, 0.397);
    border-radius: 0 0 0 0;
}




/*TERMINA ESTRUCTURA GENERAL COMPLETA PARA gridMain: EL RESTO SON DERIVADAS DE ESTA*/
/***********************************************************************/

/*---------------------------------------------------------------------------*/


.gridMain__HOME{
    width:auto;
    margin: auto;
    display: grid;
    border: blue 0px solid;
    width: auto;
    grid-template-columns: repeat(3, auto);
    grid-template-rows: repeat(14, auto);
    grid-column-gap: 20px;
    grid-row-gap: 0px;
    grid-template-areas: 
    'gm1 gm1 gm1' 
    'gm2 gm2 gm2' 
    'gm3 gm3 gm3' 
     
    'gcol_izq_1 gcc_1 gcol_der_1'
    'gcol_izq_1 gcc_7 gcol_der_2'
    'gcol_izq_3 gcc_7 gcol_der_3'

    'gcol_izq_3 gcc_7 .'
    'gcol_izq_3 gcc_8 .'

    '. gcc_4 .'
    '. gcc_5 .'
    '. gcc_6 .'

    'gcol_izq_2 gcc_9 .'

    'gm7 gm7 gm7'
    'gm8 gm8 gm8';
    
}

/*con esto decido cuales oculto en todo el sitio*/
div.__home
{
   display:none;
   visibility: hidden;
   content: ''; 
}

/* contiene: lista Series*/ /**************************************/
.gcol_izq_1{
    
    grid-row:4/span 9;
     

} 



/* CONFIG: PAGINAS:OTROS */

.gridMain__OTROS{
    width:auto;
    margin: auto;
    display: grid;
    border: blue 0px solid;
    width: auto;
    grid-template-columns: repeat(3, auto);
    grid-template-rows: repeat(14, auto);
    grid-column-gap: auto;
    grid-row-gap: auto;
    grid-template-areas: 
    'gm1 gm1 gm1' 
    'gm2 gm2 gm2' 
    'gm3 gm3 gm3' 
     
    'gcol_izq_1 gcc_6 gcol_der_1'
    'gcol_izq_1 gcc_7 gcol_der_2'
    'gcol_izq_3 gcc_7 gcol_der_3'

    'gcol_izq_3 gcc_7 .'
    'gcol_izq_3 gcc_8 .'

    '. gcc_4 .'
    '. gcc_5 .'
    '. . .'

    'gcol_izq_2 gcc_9 .'

    'gm7 gm7 gm7'
    'gm8 gm8 gm8';
    align-items: start;
}



.gridMain__EXPLORAR {
    display: grid;

    border: blue 0px solid;
   
    grid-template-columns: repeat(3, auto);
    grid-template-rows: auto auto auto  auto auto auto auto auto auto auto auto auto;
    grid-column-gap: 100px;
    grid-row-gap: 0px;
 
  }

.gm1_menu_izq { grid-area: 1 / 1 / 2 / 4; }
.gm2_menu_izq { grid-area: 2 / 1 / 3 / 4; height:280px;}


/* contiene: buscador*/
.gm3_menu_izq { 
    grid-area: 3 / 1 / 4 / 4; 
    background-image: url("/images/background-buscador-repo-ade-001.jpg");
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}


.gcc_2_menu_izq { grid-area: 4 / 2 / 5 / 3; }
.gcc_3_menu_izq { grid-area: 5 / 2 / 6 / 3; }
.gcc_9_menu_izq { grid-area: 6 / 2 / 7 / 3; }
.gm8_menu_izq { grid-area: 7 / 1 / 9 / 4; }
.gcol_izq_menu { grid-area: 4 / 1 / 7 / 2; }
.gcol_izq_1_menu_izq { grid-area: 4 / 1 / 5 / 2; }
.gcol_izq_2_menu_izq { grid-area: 5 / 1 / 6 / 2; }

.__controlaContenedorRegistros
{
/*border: aquamarine 3px dotted;*/
}


.gridMain__DETALLE{
    
    margin: auto;
    display: grid;
    border: blue 0px solid;
    width: auto;
    grid-template-columns: repeat(3, auto);
    grid-template-rows: repeat(16, auto);
    grid-template-areas: 
    'gm1 gm1 gm1' 
    'gm2 gm2 gm2' 
    'gm3 gm3 gm3' 
     
    'gcol_izq_1 gcc_1 gcol_der_1'
    'gcol_izq_1 gcc_7 gcol_der_2'
    'gcol_izq_3 gcc_7 gcol_der_3'

    'gcol_izq_3 gcc_8 .'

    '. gcc_2 .'
    '. gcc_3 .'
    '. gcc_4 .'
    '. gcc_5 .'
    '. gcc_6 .'

    'gcol_izq_2 gcc_9 .'

    'gm7 gm7 gm7'
    'gm8 gm8 gm8';
    
}


/*este altera la separacion del grid entre series y cajas para que funcione en dektop y responsives */
div.SwitchHideDivFragment
{
    display:flex;
    flex-direction: column;
}