/*
	CSS personalizado para 03 CALIDAD
*/

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

/*    Rojo Oscuro: DE053E rgb(222,  5, 62) */
/*           Gris: 999999 rgb(153,153,153) */
/*     Rojo Medio: EE829E rgb(238,130,158) */
/*     Rojo Claro: F6C0CE rgb(246,192,206) */
/* Rojo Muy Claro: FADFE6 rgb(250,223,230) */

/*Amarillo oscuro: FFD700 rgb(255,215,  0) */
/* Amarillo claro: FFEB7F rgb(255,235,157) */

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

@media (max-width:  580px) { :root { --cabecera-size: 280px; } }
@media (max-width:  480px) { :root { --cabecera-size: 340px; } #rowPageCabecera .divCabecera .divContent { padding: 0px 20px; } }

/************************************ #rowCalidadDOP ************************************/

#rowCalidadDOP *                            { -webkit-transition: all 0.2s ease; transition: all 0.2s ease; }
#rowCalidadDOP .divCalidadDOP               { margin-top: 100px; position: relative; padding: 200px 0px 150px 0px; background: #F4F4F4; }
#rowCalidadDOP .divLogoDOP                  { position: absolute; top: 0px; left: 50%; transform: translate(-50%,-40%); margin: auto; width: 250px; line-height: 0px; z-index: 1; }
#rowCalidadDOP .divContent                  { margin: auto; max-width: 1180px; display: flex; align-items: center; justify-content: space-between; }
#rowCalidadDOP .divIzda                     { width: 540px; }
#rowCalidadDOP .divIzda p                   { font-size: 13px; text-align: justify; }
#rowCalidadDOP .divDcha                     { position: relative; width: 540px; z-index: 1; }
#rowCalidadDOP .divDcha .divMiembros        { display: flex; flex-wrap: wrap; justify-content: center; }
#rowCalidadDOP .divDcha .divMiembro         { padding: 20px; width: calc(100% / 3); }
#rowCalidadDOP .divDcha .divMiembro a       { display: block; line-height: 0px; }
#rowCalidadDOP .divDcha .divMiembro a:hover { transform: scale(1.2); }

@media (max-width: 1380px) {
	#rowCalidadDOP .divCalidadDOP       { padding: 200px 40px 150px 40px; }
	#rowCalidadDOP .divIzda             { width: calc((100% - 80px) / 2); }
	#rowCalidadDOP .divDcha             { width: calc((100% - 80px) / 2); }
}

@media (max-width: 1180px) {
	#rowCalidadDOP .divCalidadDOP       { margin-top: 80px; padding: 150px 40px 100px 40px; }
	#rowCalidadDOP .divLogoDOP          { width: 200px; }
	#rowCalidadDOP .divIzda             { width: calc((100% - 60px) / 2); }
	#rowCalidadDOP .divDcha             { width: calc((100% - 60px) / 2); }
}

@media (max-width:  980px) {
	#rowCalidadDOP .divCalidadDOP       { margin-top: 60px; padding: 100px 40px 75px 40px; }
	#rowCalidadDOP .divLogoDOP          { width: 160px; }
	#rowCalidadDOP .divIzda             { width: calc((100% - 40px) / 2); }
	#rowCalidadDOP .divIzda p           { font-size: 12px; }
	#rowCalidadDOP .divDcha             { width: calc((100% - 40px) / 2); }
	#rowCalidadDOP .divDcha .divMiembro { padding: 10px 20px; width: 50%; }
}

@media (max-width:  780px) {
	#rowCalidadDOP .divCalidadDOP       { padding: 110px 30px 75px 30px; }
	#rowCalidadDOP .divLogoDOP          { width: 140px; }
	#rowCalidadDOP .divContent          { flex-direction: column; }
	#rowCalidadDOP .divIzda             { width: 100%; }
	#rowCalidadDOP .divIzda p           { font-size: 12px; }
	#rowCalidadDOP .divDcha             { width: 100%; }
	#rowCalidadDOP .divDcha .divMiembro { padding: 10px; width: 20%; min-width: 120px; }
}

@media (max-width:  580px) {
	#rowCalidadDOP .divCalidadDOP       { margin-top: 40px; padding: 90px 30px 70px 30px; }
	#rowCalidadDOP .divLogoDOP          { width: 120px; }
	#rowCalidadDOP .divIzda p           { font-size: 11px; }
}

@media (max-width:  380px) {
	#rowCalidadDOP .divCalidadDOP       { padding: 90px 20px 70px 20px; }
	#rowCalidadDOP .divIzda p           { font-size: 10px; }
}

/************************************ #rowCalidadIGP ************************************/

#rowCalidadIGP *                            { -webkit-transition: all 0.2s ease; transition: all 0.2s ease; }
#rowCalidadIGP .divCalidadIGP               { position: relative; padding: 200px 0px 100px 0px; background: #FFFFFF; }
#rowCalidadIGP .divLogoIGP                  { position: absolute; top: 0px; left: 50%; transform: translate(-50%,-40%); margin: auto; width: 250px; line-height: 0px; z-index: 1; }
#rowCalidadIGP .divContent                  { margin: auto; max-width: 1180px; display: flex; align-items: center; justify-content: space-between; }
#rowCalidadIGP .divIzda                     { position: relative; width: 540px; z-index: 1; }
#rowCalidadIGP .divIzda .divMiembros        { display: flex; flex-wrap: wrap; justify-content: center; }
#rowCalidadIGP .divIzda .divMiembro         { padding: 20px; width: calc(100% / 3); }
#rowCalidadIGP .divIzda .divMiembro a       { display: block; line-height: 0px; }
#rowCalidadIGP .divIzda .divMiembro a:hover { transform: scale(1.2); }
#rowCalidadIGP .divDcha                     { width: 540px; }
#rowCalidadIGP .divDcha p                   { font-size: 13px; text-align: justify; }

@media (max-width: 1380px) {
	#rowCalidadIGP .divCalidadIGP       { padding: 200px 40px 100px 40px; }
	#rowCalidadIGP .divIzda             { width: calc((100% - 80px) / 2); }
	#rowCalidadIGP .divDcha             { width: calc((100% - 80px) / 2); }
}

@media (max-width: 1180px) {
	#rowCalidadIGP .divCalidadIGP       { padding: 150px 40px 75px 40px; }
	#rowCalidadIGP .divLogoIGP          { width: 200px; }
	#rowCalidadIGP .divIzda             { width: calc((100% - 60px) / 2); }
	#rowCalidadIGP .divDcha             { width: calc((100% - 60px) / 2); }
}

@media (max-width:  980px) {
	#rowCalidadIGP .divCalidadIGP       { padding: 100px 40px 50px 40px; }
	#rowCalidadIGP .divLogoIGP          { width: 160px; }
	#rowCalidadIGP .divIzda             { width: calc((100% - 40px) / 2); }
	#rowCalidadIGP .divIzda .divMiembro { padding: 10px 20px; width: 50%; }
	#rowCalidadIGP .divDcha             { width: calc((100% - 40px) / 2); }
	#rowCalidadIGP .divDcha p           { font-size: 12px; }
}

@media (max-width:  780px) {
	#rowCalidadIGP .divCalidadIGP       { padding: 110px 30px 50px 30px; }
	#rowCalidadIGP .divLogoIGP          { width: 140px; }
	#rowCalidadIGP .divContent          { flex-direction: column-reverse; }
	#rowCalidadIGP .divIzda             { width: 100%; }
	#rowCalidadIGP .divIzda .divMiembro { padding: 10px; width: 20%; min-width: 120px; }
	#rowCalidadIGP .divDcha             { width: 100%; }
	#rowCalidadIGP .divDcha p           { font-size: 12px; }
}

@media (max-width:  580px) {
	#rowCalidadIGP .divCalidadIGP       { padding: 90px 30px 30px 30px; }
	#rowCalidadIGP .divLogoIGP          { width: 120px; }
	#rowCalidadIGP .divDcha p           { font-size: 11px; }
}

@media (max-width:  380px) {
	#rowCalidadIGP .divCalidadIGP       { padding: 90px 20px 30px 20px; }
	#rowCalidadIGP .divDcha p           { font-size: 10px; }
}

/************************************ #rowCalidadExigencia ***********************************/

#rowCalidadExigencia *                          { -webkit-transition: all 0.2s ease; transition: all 0.2s ease; }
#rowCalidadExigencia .divCalidadExigencia       { padding: 150px 0px; background: #F4F4F4; background-image: url(/wp-content/uploads/calidad-exigencia.jpg); }
#rowCalidadExigencia .divCalidadExigencia       { background-repeat: no-repeat; background-size: contain; background-position: calc(((100vw - 1180px) / 2) + 640px); }
#rowCalidadExigencia .divCalidadExigencia:after { transform: scaleX(-1); }
#rowCalidadExigencia .divContent                { margin: auto; max-width: 1180px; display: flex; align-items: center; justify-content: space-between; }
#rowCalidadExigencia .divIzda                   { width: 540px; display: flex; flex-wrap: wrap; align-items: flex-end; }
#rowCalidadExigencia .divIzda h2                { width: 280px; font-size: 50px !important; }
#rowCalidadExigencia .divIzda .divForma         { width: calc(100% - 280px); line-height: 0px; filter: var(--filter-to-rojo); }
#rowCalidadExigencia .divIzda p                 { margin: 30px 0px 0px 0px; font-size: 13px; text-align: justify; }

@media (max-width: 1380px) {
	#rowCalidadExigencia .divCalidadExigencia { padding: 150px 40px; }
	#rowCalidadExigencia .divIzda             { width: calc((100% - 80px) / 2); }
}

@media (max-width: 1180px) {
	#rowCalidadExigencia .divCalidadExigencia { padding: 100px 40px; }
	#rowCalidadExigencia .divIzda             { width: calc((100% - 60px) / 2); }
}

@media (max-width:  980px) {
	#rowCalidadExigencia .divCalidadExigencia { padding: 80px 40px; background-position: 52vw; }
	#rowCalidadExigencia .divIzda             { width: calc((100% - 40px) / 2); }
	#rowCalidadExigencia .divIzda h2          { width: 220px; font-size: 40px !important; line-height: 110%; }
	#rowCalidadExigencia .divIzda .divForma   { width: calc(100% - 220px); }
	#rowCalidadExigencia .divIzda p           { font-size: 12px; }
}

@media (max-width:  780px) {
	#rowCalidadExigencia .divCalidadExigencia { padding: 60px 40px; background-position: 50vw; }
	#rowCalidadExigencia .divContent          { flex-direction: column; }
	#rowCalidadExigencia .divIzda             { width: 100%; }
	#rowCalidadExigencia .divIzda h2          { width: 200px; font-size: 36px !important; }
	#rowCalidadExigencia .divIzda .divForma   { width: 200px; }
	#rowCalidadExigencia .divIzda p           { padding: 15px 20px; font-size: 12px; background: rgba(var(--color-ama2-rgb), 0.7); backdrop-filter: blur(5px); }
}

@media (max-width:  580px) {
	#rowCalidadExigencia .divCalidadExigencia { padding: 50px 30px; }
	#rowCalidadExigencia .divIzda h2          { width: 170px; font-size: 30px !important; }
	#rowCalidadExigencia .divIzda .divForma   { width: 130px; }
	#rowCalidadExigencia .divIzda p           { margin: 20px 0px 0px 0px; padding: 10px 15px; font-size: 11px; }
}

@media (max-width:  480px) {
	#rowCalidadExigencia .divCalidadExigencia { background-size: cover; background-position: left; }
	#rowCalidadExigencia .divIzda h2          { color: #FFFFFF; text-shadow: 2px 2px 2px rgba(0,0,0,0.5); }
}

@media (max-width:  380px) {
	#rowCalidadExigencia .divCalidadExigencia { padding: 40px 20px; }
	#rowCalidadExigencia .divIzda p           { font-size: 10px; }
	#rowCalidadExigencia .divIzda .divForma   { display: none; }
}

/*************************************** #rowCalidadPorque ***************************************/

#rowCalidadPorque *                            { -webkit-transition: all 0.2s ease; transition: all 0.2s ease; }
#rowCalidadPorque .divCalidadPorque            { position: relative; padding: 150px 0px; }
#rowCalidadPorque .divCalidadPorque:before     { content: ""; position: absolute; top: 30px; left: 100px; width: 100%; height: calc(100% - 30px); background-image: var(--fondo-forma); }
#rowCalidadPorque .divCalidadPorque:before     { background-repeat: no-repeat; background-size: contain; background-position: left; filter: var(--filter-to-rojo); opacity: 0.1; }
#rowCalidadPorque .divContent                  { margin: auto; max-width: 1080px; }
#rowCalidadPorque .divTitulo   h2              { width: 660px; font-size: 50px !important; text-align: center; margin: auto !important; }
#rowCalidadPorque .divTitulo   h2 span         { color: var(--color1-hex); line-height: 120%; }
#rowCalidadPorque .divFeatures                 { margin-top: 60px; display: flex; justify-content: space-between; }
#rowCalidadPorque .divFeature                  { width: calc((100% - 100px) / 3); }
#rowCalidadPorque .divFeature .divFoto         { position: relative; line-height: 0px; }
#rowCalidadPorque .divFeature .divForma        { margin: auto; width: 30%; background: #FFFFFF; border-radius: 50%; transform: translateY(-50%); }
#rowCalidadPorque .divFeature .divForma:before { content: ""; padding-top: 100%; background-image: var(--fondo-forma-abajo); display: block; }
#rowCalidadPorque .divFeature .divForma:before { background-repeat: no-repeat; background-size: contain; background-position: center; filter: var(--filter-to-amarillo); }
#rowCalidadPorque .divFeature .divTexto        { margin-top: -40px; font-size: 15px; text-align: center; line-height: 180%; }

@media (max-width: 1380px) { #rowCalidadPorque .divCalidadPorque { padding: 150px 40px; } }
@media (max-width: 1180px) { #rowCalidadPorque .divCalidadPorque { padding: 120px 40px; } }

@media (max-width:  980px) {
	#rowCalidadPorque .divCalidadPorque     { padding: 100px 40px; }
	#rowCalidadPorque .divTitulo   h2       { width: 530px; font-size: 40px !important; }
	#rowCalidadPorque .divFeatures          { margin-top: 50px; }
	#rowCalidadPorque .divFeature           { width: calc((100% - 60px) / 3); }
	#rowCalidadPorque .divFeature .divTexto { margin-top: -30px; font-size: 14px; line-height: 160%; }
}

@media (max-width:  780px) {
	#rowCalidadPorque .divCalidadPorque     { padding: 80px 40px; }
	#rowCalidadPorque .divTitulo   h2       { width: 480px; font-size: 36px !important; }
	#rowCalidadPorque .divFeatures          { margin-top: 30px; flex-direction: column; }
	#rowCalidadPorque .divFeature           { margin-top: 20px; width: 100%; display: flex; align-items: center; }
	#rowCalidadPorque .divFeature .divFoto  { flex: 0 0 130px; }
	#rowCalidadPorque .divFeature .divForma { flex: 0 0 40px; width: auto; transform: translateX(-50%); }
	#rowCalidadPorque .divFeature .divTexto { margin-top: 0px; }
}

@media (max-width:  580px) {
	#rowCalidadPorque .divCalidadPorque     { padding: 60px 30px; }
	#rowCalidadPorque .divTitulo   h2       { width: 400px; font-size: 30px !important; }
	#rowCalidadPorque .divFeatures          { margin-top: 20px; }
	#rowCalidadPorque .divFeature           { margin-top: 30px; display: block; }
	#rowCalidadPorque .divFeature .divFoto  { margin: auto; width: 240px; }
	#rowCalidadPorque .divFeature .divForma { margin: auto; width: 80px; transform: translateY(-50%); }
	#rowCalidadPorque .divFeature .divTexto { margin-top: -30px; }
}

@media (max-width:  480px) {
	#rowCalidadPorque .divTitulo   h2       { width: 230px; }
}

@media (max-width:  380px) {
	#rowCalidadPorque .divCalidadPorque     { padding: 40px 20px; }
	#rowCalidadPorque .divFeatures          { margin-top: 20px; }
	#rowCalidadPorque .divFeature .divFoto  { width: 90%; }
	#rowCalidadPorque .divFeature .divForma { width: 25%; }
}