
:root {
	/*-----------------------PROYECTO---------------------*/

	/*alturas*/
	--h-nav-bar: 5.0rem;
	--h-cont-imguser: 10.0rem;
	--h-item-menu: 2.4rem;

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

	/*Colors*/
  --color-white: #FFFFFF;
  --color-black: #000000;

  --color-main-color: #4cbf6b;
  /* --color-main-color: #4C6FBF; */
  --color-secondary:#7B96D4;

  --color-of-links: #707070;

  --color-aside-dark: #363636;
  --color-aside-light: #2a3542;

  --color-error:red;
  --color-warning:#FAC511;

  --color-headtable:#18AABB;
  --color-bodytable:#EFEFEF;
  --color-backgrundmodule:#0c235b; /* DBDBDB */
  /* --color-backgrundmodule:#4C6FBF;  */

  --other1: #E38646;
  --other2: #F7F7F7;
  --color-create: #139e36;
  --navbar:black;
  --text-input-field: #ACD9B2;

  --background-modal: rgba(0, 0, 0, 0.7);

  --wrapContainerTable: 90%;



  
  	/*color: #707070;  COLOR GRIS SOLIDO, bonito para H2 y links*/
	/*texts:*/
	/*font-size*/
  --textExSm: 0.7rem; 
  --textSm: 1.0rem; 
  --textNormal:  1.1rem;
  --textMd: 1.6rem;
  --textLg: 2.0rem;
  --textExtaLg: 2.2rem;
  --rem: 1rem;

	/*content-font-size*/
	--contTextSm: 1.6rem; 
	--contTextNormal:  1.8rem;
	--contTextMd: 2.0rem;
	--contTextLg: 2.6rem;
	--contTeCxtExtaLg: 3.0em;

  	/*ver clases mas abajo*/

	/*alturas*/
	--h-hero: 25.0rem;
	--h-cart: 15.0rem;
	--h-contFooter: 5.0rem;

	--padding04 : 0.4rem;
	/*ver clases mas abajo*/

  	/*font-family*/
  --fontMain: sans-serif;
  --fontSecondary: sans-serif;
  --fontHeading: sans-serif;

  /*tamaño imagenes - width*/
  --contImgPostSm: 15rem;
  --contImgPostMd: 25rem;
  --contImgPostLg: 35rem;

  --contImgcardSm: 10rem;
  --contImgcardMd: 15rem;
  --contImgcardLg: 20rem;

  --contImgLogoMain: 20rem;
  --contImgLogoSm: 0.25rem;
  --contImgLogoMd: 0.5rem;

  /*tamaño imagenes - height*/

  /* min-width para el margen de los contenedores: ;*/
    /* se puede desactivar en desarrollo: */
  --wrapContainer: 78rem;

}

/* MovilFirst */
	/*body {overflow: hidden}*/
	

/* GENERICOS */
*{ margin: 0; box-sizing: border-box;};
html {  overflow-x: hidden; width: 100vw; padding: 0; line-height: 1.15; } /*puede llegar a ser necesario*/
html {  font-family: sans-serif; font-size: 62.5%; }  /* Now 10px = 1rem! */ /*dar font-family acá si se trae de googleFont etc*/
body {font-size: 16px; font-size: var(--textNormal); line-height: 1.5; margin: 0}
		/*fuente: https://gist.github.com/mrwweb/5627502; */ /*si no soporta rem soportara px*/
main {  display: block;}
.hidden{display: none;}
/*heading*/
h1,h2,h3,h4,h5,h6{
		margin-top: 0;
		font-family: var(--fontHeading);
		line-height: 1.5;
	} 
p{font-weight: 300; margin: 0} /*es recomendable guardar los valores en variables root*/
h1{font-size: var(--textExtaLg); font-weight: 700; margin-top: 0px; letter-spacing: 1px;}
/*h1{text-align: center;}  */
h2{font-size: var(--textLg)}
h3{font-size: var(--textMd)}
h4{font-size: var(--textNormal)}
h5{font-size: var(--textSm)}

a{text-decoration: none; display: inline-block; /*overflow: hidden*/}
ul{list-style: none; margin: 0; padding: 0;}
[type="submit"]{border:none; border-radius: 25%; font-size: 1.6rem; padding: 0.5rem; cursor: pointer; width: 100%; height: 5rem}
span{display: inline-block;}  /*verificar su buen comportamiento*/

picture {margin:0; overflow: hidden; width: var(--contImgPostMd)} /*imagenes post*/
figure {margin:0; overflow: hidden; width: var(--contImgcardMd); /*height:var(--contImgcardMd);*/}
img{max-width: 100%; height: auto; object-fit: contain; vertical-align: top; object-position: 1px 1px; object-fit: cover;}  /* 100% de un contenedor ; object-fit: cover */

.figImg{display: block; width: auto; margin: 0; padding: 0; object-fit: cover; }

header{ margin: 0 auto; padding: 0; /*width: 95%*; max-width: 1200px; padding: 1rem*/}
main{ width: 100%; margin: 0 auto;} /*en pantalla <1200px toma el 95%*//*max-width: 120.0rem;*/
footer{margin: 0 auto; padding: 0;/*width: 95%*; max-width: 1200px; padding: 1rem*/}

.bodyTag{
	background: #a4b0be;
}
.padding4{
	padding: var(--padding04)
}

.bold{font-weight: bold;}
.textC{text-align:center}
.textL{text-align:left;}
.textSm{font-size: var(--textSm);}
.textMd{font-size: var(--textMd)}
.textLg{font-size: var(--textLg)}

.fontMain{font-style: var(--fontMain)}
.fontSecondary{font-style: var(--fontSecondary)}
.fontHeading{font-style: var(--fontHeading)}


	/*//Body/////////////////////////////////////////////////////////*/
	  .contBody{min-height: 100vh; overflow-x:hidden;}
	  .contCentrado {max-width: 120.0rem; width: 95%; margin: 0 auto} /* BEM-layout*/
	/*//Header/////////////////////////////////////////////////////////*/
	  .contHeader{}/* min-width: var(--wrapContainer);*/
	  .contLogo{}
	/*//flexMainAside/////////////////////////////////////////////////////////*/
	  .contMainAndAside{display: flex; margin: 0; min-height: 100vh}  /*	  min-width: var(--wrapContainer);*/
	  /* ||.contMainAside ||.coverMainAside || .cover*/
	/*//Main///////////////////////////////////////////////////////////*/
	  .contMain{ min-height: 100vh; margin: 0; width: 100%; background-color: var(--color-backgrundmodule); }
	  .direction_column_center {display: flex;  flex-direction: column; justify-content: center;}
	  /*main>section>article*/
	/*//Aside//////////////////////////////////////////////////////////*/
	  .contAside{ min-height: 100vh; margin: 0; width: 30.0rem; background-color: var(--color-aside-light); position:relative;}

	  /*//Footer/////////////////////////////////////////////////////////*/
	  .contFooter{ margin: 0; }
/*	  min-width: var(--wrapContainer);*/

	.centradoflex{
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.ColumCentradoflex{
		display: flex;
		flex-direction: column; 
		justify-content: center;
		align-items: center;
	}
	.textMd{font-size: var(--textMd)} ;
	.textLg{font-size: var(--textLg)} ;
	.textExtaLg{font-size: var(--textExtaLg)} ;





