/*
	CSS personalizado para 02 PROJECT
*/

/**************************************** GAMA DE COLORES ****************************************/

/*    Azul Oscuro: 00435E rgb(  0, 67, 94) */
/*           Gris: 999999 rgb(153,153,153) */
/*     Azul Medio: 7FA1AE rgb(127,161,174) */
/*     Azul Claro: BFD0D6 rgb(191,208,214) */
/* Azul Muy Claro: DFE7EA rgb(223,231,234) */

/*       Turquesa: 5FD6DA rgb( 95,214,218) */
/*     GrisFooter: 565E62 rgb( 86, 94, 98) */

/************************************ MODIFICADOS DE syle-home ***********************************/

/**************************************** #rowProjectIntro ***************************************/

#rowProjectIntro .divProjectIntro            { margin: auto; max-width: 1440px; }
#rowProjectIntro .divProjectIntro *          { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
#rowProjectIntro .divContent p               { margin: 10px 0px; }
#rowProjectIntro .divContent p:first-of-type { margin-top: 0px; }
#rowProjectIntro .divContent p:last-of-type  { margin-bottom: 30px; }

@media (max-width: 1580px) { #rowProjectIntro .divProjectIntro { margin: 0px 40px; max-width: none; } }
@media (max-width: 1380px) { #rowProjectIntro .divProjectIntro { margin: 0px 30px; } }

/*************************************** #rowProjectObjectives ****************************************/

#rowProjectObjectives .divProjectObjectives    { margin: auto; max-width: 1440px; }
#rowProjectObjectives .divProjectObjectives *  { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
#rowProjectObjectives .divObjectives           { margin-top: 60px; display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#rowProjectObjectives .divObjective            { margin: 10px 0px; width: calc((100% - 80px) / 3); }
#rowProjectObjectives .divNumero               { font-size: 26px; font-weight: 600; color: var(--color-turquesa-hex); line-height: 120%; }
#rowProjectObjectives .divObjective         p  { margin: 10px 0px; }

@media (max-width: 1580px) { #rowProjectObjectives .divProjectObjectives { margin: 0px 40px; max-width: none; } }
@media (max-width: 1380px) { #rowProjectObjectives .divProjectObjectives { margin: 0px 30px;                  } }
@media (max-width: 1280px) { #rowProjectObjectives .divNumero            { font-size: 24px;                   } }

@media (max-width:  780px) {
	#rowProjectObjectives .divObjectives  { margin-top: 40px; }
	#rowProjectObjectives .divObjective   { margin: 10px 0px; width: 100%; }
	#rowProjectObjectives .divNumero      { font-size: 20px; }
	#rowProjectObjectives .divObjective p { margin: 5px 0px; }
}

/*************************************** #rowProjectImpact ***************************************/

#rowProjectImpact .divProjectImpact           { margin: auto; max-width: 1440px; }
#rowProjectImpact .divProjectImpact *         { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; }
#rowProjectImpact .divFeatures                { margin-top: 80px; display: flex; align-items: flex-start; justify-content: space-between; }
#rowProjectImpact .divFeature                 { width: calc((100% - 120px) / 3); }
#rowProjectImpact .divNumero                  { font-size: 80px; font-weight: 600; color: var(--color-turquesa-hex); line-height: 120%; }

@media (max-width: 1580px) { #rowProjectImpact .divProjectImpact { margin: 0px 40px; max-width: none; } }
@media (max-width: 1380px) { #rowProjectImpact .divProjectImpact { margin: 0px 30px;                  } }
@media (max-width: 1280px) { #rowProjectImpact .divFeatures      { margin-top: 60px;                  } }
@media (max-width: 1080px) { #rowProjectImpact .divNumero        { font-size: 70px;                   } }
@media (max-width:  980px) { #rowProjectImpact .divFeatures      { margin-top: 40px; flex-wrap: wrap; } #rowProjectImpact .divFeature { padding: 10px 0px; width: 100%; } }
@media (max-width:  780px) { #rowProjectImpact .divNumero        { font-size: 60px;                   } }
@media (max-width:  380px) { #rowProjectImpact .divFeatures      { margin-top: 30px;                  } #rowProjectImpact .divNumero  { font-size: 50px;                } }