/*
	CSS personalizado para 03 PARTNERS
*/

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

/*    Azul Oscuro: 017CBA rgb(  1,124,186) */
/*           Gris: 999999 rgb(153,153,153) */
/*     Azul Medio: 80BDDC rgb(128,189,220) */
/*     Azul Claro: BFDEED rgb(191,222,237) */
/* Azul Muy Claro: DFEEF6 rgb(223,238,243) */

/*   Verde Oscuro: 07B289 rgb(  7,178,137) */
/*    Verde Medio: 83D8C4 rgb(131,216,196) */
/*    Verde Claro: C1EBE1 rgb(193,235,225) */
/*Verde Muy Claro: E0F5F0 rgb(224,245,240) */

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

/****************************************** #rowContent ******************************************/

#rowContent .divTitle   h1             { font-family: var(--font-family-narrow); font-size: 24px; font-weight: 600; }
#rowContent .divContent p              { margin: 15px 0px; text-align: justify; }
#rowContent .divContent p:last-of-type { margin-bottom: 0px; }
#rowContent .divContent a              { color: var(--color1-hex) !important; }
#rowContent .divContent a:hover        { color: var(--color3-hex) !important; }

#rowContent { padding-left: 20px; max-width: 780px; border-left: solid 4px var(--color3-hex); }

@media (max-width: 1180px) { #rowContent              { margin: 0px 20px; } }
@media (max-width:  980px) { #rowContent .divTitle h1 { font-size: 20px; } }

@media (max-width:  780px) {
	#rowContent                { padding-left: 15px; }
	#rowContent .divTitle   h1 { font-size: 18px; }
	#rowContent .divContent p  { margin: 10px 0px; font-size: 14px; }
}

@media (max-width:  480px) { #rowContent { margin: 0px; padding-left: 10px; border-left: solid 2px var(--color3-hex); } }

/****************************************** #rowPartners *****************************************/

#rowPartners .divPartners   { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; }
#rowPartners .divPartners * { -webkit-transition: all 1s ease; transition: all 1s ease; }

#rowPartners .divPartner.closed             { margin: 15px; width: calc(30% - 30px); height: 100px; }
#rowPartners .divPartner.closed:after       { content: "\f107"; margin: auto; font-family: "FontAwesome"; font-size: 40px; display: none; }
#rowPartners .divPartner.closed:after       { -webkit-animation: blink-animation 1s steps(5,start) infinite; animation: blink-animation 1s steps(5,start) infinite; }
#rowPartners .divPartner.closed:hover:after { display: table; }
#rowPartners .divPartner.closed .divBox     { display: none; }
#rowPartners .divPartner.closed .divLogo    { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; cursor: pointer; }

#rowPartners .divPartner.opened                            { width: 100%; height: auto; }
#rowPartners .divPartner.opened .divLogo                   { width: 100%; display: flex; align-items: flex-end; cursor: pointer; }
#rowPartners .divPartner.opened .divLogo:after             { content: "\f106"; margin: 0px 0px 10px 10px; font-family: "FontAwesome"; font-size: 40px; }
#rowPartners .divPartner.opened .divLogo:after             { -webkit-animation: blink-animation 1s steps(5,start) infinite; animation: blink-animation 1s steps(5,start) infinite; }
#rowPartners .divPartner.opened .divBox                    { padding: 20px; display: flex; flex-wrap: wrap; box-shadow: 0px 25px 12px -20px rgba(0,0,0,0.3); }
#rowPartners .divPartner.opened .divFlag                   { width: 32px; height: 32px; border-radius: 50%; box-shadow: 0px 6px 6px -4px rgba(0,0,0,0.5); }
#rowPartners .divPartner.opened .divFlag                   { background-repeat: no-repeat; background-position: center center; background-size: contain; }
#rowPartners .divPartner.opened .divNombre                 { padding-left: 10px; width: calc(100% - 32px); display: flex; align-items: center; }
#rowPartners .divPartner.opened .divNombre h2              { font-family: var(--font-family-narrow); font-size: 28px; font-weight: 600; color: var(--color1-hex); line-height: 100%; }
#rowPartners .divPartner.opened .divDescripcion            { margin-top: 10px; }
#rowPartners .divPartner.opened .divDescripcion p          { margin: 10px 0px; font-family: var(--font-family-narrow); font-size: 16px; text-align: justify; }
#rowPartners .divPartner.opened .divGallery                { margin-top: 20px; width: 100%; display: flex; justify-content: center; }
#rowPartners .divPartner.opened .divGallery .divFoto       { position: relative; margin: 0px 5px; padding: 2px; }
#rowPartners .divPartner.opened .divGallery .divFoto       { border: solid 1px #333333; box-shadow: 0px 10px 10px -10px rgba(0,0,0,0.5); }
#rowPartners .divPartner.opened .divGallery .divFondo      { width: 100px; height: 100px; background-repeat: no-repeat; background-position: center center; background-size: cover; }
#rowPartners .divPartner.opened .divGallery .divFoto a     { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; display: block; cursor: zoom-in; }
#rowPartners .divPartner.opened .divGallery .divFoto:hover { transform: translateY(-5px); opacity: 0.5; }
#rowPartners .divPartner.opened .divWeb                    { margin-top: 20px; width: 100%; }
#rowPartners .divPartner.opened .divWeb a                  { width: 100%; color: var(--color1-hex) !important; display: flex; align-items: center; justify-content: center; }
#rowPartners .divPartner.opened .divWeb a:hover            { color: var(--color3-hex) !important; }
#rowPartners .divPartner.opened .divWeb a i                { margin-right: 5px; }

@media (max-width:  980px) {
	#rowPartners .divPartner.closed                          { height: 85px; }
	#rowPartners .divPartner.closed:after                    { font-size: 36px; }
	#rowPartners .divPartner.opened .divLogo:after           { margin: 0px 0px 6px 6px; font-size: 36px; }
	#rowPartners .divPartner.opened .divFlag                 { width: 30px; height: 30px; box-shadow: 0px 6px 6px -4px rgba(0,0,0,0.5); }
	#rowPartners .divPartner.opened .divNombre               { padding-left: 8px; width: calc(100% - 30px); }
	#rowPartners .divPartner.opened .divNombre h2            { font-size: 24px; }
	#rowPartners .divPartner.opened .divDescripcion          { margin-top: 8px; }
	#rowPartners .divPartner.opened .divDescripcion p        { margin: 8px 0px; font-size: 14px; }
	#rowPartners .divPartner.opened .divGallery              { margin-top: 15px; }
	#rowPartners .divPartner.opened .divGallery .divFoto     { margin: 0px 5px; padding: 2px; box-shadow: 0px 10px 10px -10px rgba(0,0,0,0.5); }
	#rowPartners .divPartner.opened .divGallery .divFondo    { width: 85px; height: 85px; }
	#rowPartners .divPartner.opened .divWeb                  { margin-top: 15px; }
	#rowPartners .divPartner.opened .divWeb a                { font-size: 14px; }
	#rowPartners .divPartner.opened .divWeb a i              { margin-right: 5px; }
}

@media (max-width:  780px) {
	#rowPartners .divPartner.closed                          { width: calc(33% - 30px); height: 75px; }
	#rowPartners .divPartner.closed:after                    { font-size: 32px; }
	#rowPartners .divPartner.opened .divLogo:after           { margin: 0px 0px 5px 5px; font-size: 32px; }
	#rowPartners .divPartner.opened .divFlag                 { width: 28px; height: 28px; box-shadow: 0px 4px 4px -2px rgba(0,0,0,0.5); }
	#rowPartners .divPartner.opened .divNombre               { width: calc(100% - 28px); }
	#rowPartners .divPartner.opened .divNombre h2            { font-size: 22px; }
	#rowPartners .divPartner.opened .divGallery .divFondo    { width: 75px; height: 75px; }
}

@media (max-width:  580px) {
	#rowPartners .divPartner.closed                          { width: calc(50% - 30px); }
	#rowPartners .divPartner.closed:after                    { font-size: 28px; }
	#rowPartners .divPartner.opened .divLogo:after           { font-size: 28px; }
	#rowPartners .divPartner.opened .divFlag                 { width: 24px; height: 24px; }
	#rowPartners .divPartner.opened .divNombre               { width: calc(100% - 24px); }
	#rowPartners .divPartner.opened .divNombre h2            { font-size: 20px; }
	#rowPartners .divPartner.opened .divDescripcion p        { font-size: 13px; }
	#rowPartners .divPartner.opened .divGallery .divFoto     { box-shadow: 0px 8px 8px -8px rgba(0,0,0,0.5); }
	#rowPartners .divPartner.opened .divWeb a                { font-size: 13px; }
}

@media (max-width:  480px) {
	#rowPartners .divPartner.closed:after                    { font-size: 24px; }
	#rowPartners .divPartner.opened .divBox                  { padding: 15px 0px; }
	#rowPartners .divPartner.opened .divLogo:after           { font-size: 24px; }
	#rowPartners .divPartner.opened .divLogo img             { max-height: 70px; }
	#rowPartners .divPartner.opened .divNombre h2            { font-size: 18px; }
	#rowPartners .divPartner.opened .divGallery .divFondo    { width: 65px; height: 65px; }
}

@media (max-width:  380px) {
	#rowPartners .divPartner.closed                          { margin: 20px auto; width: 100%; max-width: 200px; }
	#rowPartners .divPartner.opened                          { margin: 20px auto; width: 100%; }
	#rowPartners .divPartner.opened .divLogo                 { max-width: 280px; }
	#rowPartners .divPartner.opened .divGallery              { flex-wrap: wrap; }
	#rowPartners .divPartner.opened .divGallery .divFoto     { margin: 5px; }
}