/* CLASES asociadas CONFIGURACIONES (públicas, no personalizadas) DE CONTENEDORES (panel izquierdo del editor Vualà2) */ /* CSS relacionados: > https://web[-desa].ua.es/es/comun2/plantilla7/vuala2-formatos-tiny.css (CLASES asociadas NUEVOS FORMATOS PARA TINY (tinyMCE.init.style_formats, los añadidos al selector de formato en el editor)) > https://web[-desa].ua.es/es/comun2/plantilla7/vuala2-config-contenedores.css (CLASES asociadas CONFIGURACIONES (públicas, no personalizadas) DE CONTENEDORES (panel izquierdo del editor Vualà2)) > css\plantillas-ua\plantillas-ua.css (SOLO los estilos COMUNES para KEditor y la visualización WEB) > editor/keditor/css/keditor-overrides.css (SOLO los que modifican los originales de KEditor) > css\editor\editor.css (SOLO los que se aplican en la visualización de contenedores y componentes durante la edición) > css\editor\keditor-iei.css (los ESPECÍFICOS de las plantillas del IEI) ========================================================================== */ /* espaciados con borde de página */ main > section[data-type='container'] { padding-left: 15px; padding-right: 15px; } /* en los 100% de primer nivel, padding por defecto de 0 */ main > section[data-type='container'] > div.container-fluid.p-0 > .row > div[class*='col-']:not([class*='padding']):not([class*='p-']) { padding-left: 0 !important; padding-right: 0 !important; } /* contenedores "accesible" */ main section[data-type="container"][data-name="cols-1-accesible"] > div.container, #keditor section[data-type="container"][data-name="cols-1-accesible"] > section.keditor-container-inner > div.container { max-width: 684px; } /* Evitar, por ejemplo, que se contraiga el ancho de desplegables si el texto anterior tiene menos anchura */ main section[data-type], #keditor section[data-type] { width: 100%; } #keditor, /* para editor */ main /* para web */ { font-family: Arial, Helvetica, sans-serif; font-size: 1rem; --color-white: #fff; --color-white-hover: #e8e7e8; --color-white-semitransparent: #ffffff26; --color-dark: #343a40; /*BS*/ /*antes era #3a3838; */ --color-dark-hover: #201f1f; --color-dark-gray: #52575c; /*dark+semitransparent*/ /* antes #e8e7e8, demasiado parecido al white-gray */ --color-dark-gray-hover: #343a40; --color-gray: #ccc; /*guia*/ /* antes #e8e7e8, demasiado parecido al white-gray */ /* uno más claro -propuesto y utilizado para fecha de noticias- sería el #707070 */ --color-gray-hover: #52575c; --color-white-gray: #f8f9fa; /*light BS*/ /* antes #e4e4e4 */ --color-white-gray-hover: #cbcbcb; --color-light: #f7f7f7; /*guia, gris azulado*/ /* antes #f7f7f7 */ --color-light-hover: #cbcbcb; /*guia, gris azulado*/ /* antes #f7f7f7 */ --color-dark-blue: #003366; /*guia*/ --color-dark-blue-hover: #001a33; --color-blue: #005682; /*guia*/ --color-blue-hover: #003366; --color-light-blue: #d8e5ea; /*guia*/ /*cv: #86b7d9*/ --color-light-blue-hover: #005682; --color-white-blue: #f1f5f8; /*guia, gris azulado*/ --color-white-blue-hover: #d8e5ea; /*guia, gris azulado*/ --color-red: #bf4544; /*iei*/ --color-red-hover: #5f2121; --color-orange: #bd5b00; /*de la guía era #ce6f05, cambiamos a #bd5b00 por accesibilidad. Otra alternativa era #b95e05 */ --color-orange-hover: #7c4403; --color-orange2: #ff6633; /* Félix, antes era el puesto como light-orange: #ed7100 */ --color-orange2a: #d63600; /* por accesibilidad, el más naranja que permite texto blanco. De desear texto blanco, éste podría sustituir a bg-light-orange */ --color-orange2-hover: #b32d00; --color-light-orange: #ed7100; /*cv*/ --color-light-orange-hover: #b35600; /* por accesibilidad, el texto más naranja para fondo blanco (o José María propuso para noticias el #aa5b00) */ --color-light-orange-2: #FBD8B4; /*ama*/ --color-light-orange-2-hover: #ce6f05; --color-white-orange: #FCF5EE; /*ama*/ --color-white-orange-hover: #FBD8B4; --color-yellow: #f39912; /*(light-orange?)gobernanza, antes era #ffd23a (de la guía)*/ --color-yellow-hover: #aa6909; --color-yellow2: #ffd23a; /*guía*/ --color-yellow2-hover: #cc9c00; /* --color-green: #009688; --color-light-green: #7cb342;; */ /* color: #333; color: var(--color-primary, #333); */ --color-text-default: #212529; color: var(--color-text-default, #212529); /*por defecto BS*/ color: #212529; color: var(--color-text-default, #212529); /*por defecto BS*/ --color-a-default: #069; /*Vuala1*/ --color-a-default-hover: #f63; /*Vuala1*/ /* --color-a-dark: #343a40; */ --color-a-dark: #2A2D32; /* actualizado por accesibilidad con bg-light-orange, antes era #343a40 --color-a-dark-hover: #201f1f; --color-a-white: #fff; --color-a-white-hover: #e8e7e8; --color-a-ua: #003366; --color-a-ua-hover: #001a33; /* --color-personalizado1: #e8413d; --color-orange: #e8413d; --color-personalizado1-hover: #ce5a09; --color-orange-hover: #ce5a09; --color-personalizado2: #ef6536; --color-orange2: #ef6536; --color-personalizado2-hover: #e04612; --color-orange2-hover: #e04612; --color-personalizado3: #bf4544; --color-red: #bf4544; --color-personalizado3-hover: #752928; --color-red-hover: #752928; --color-personalizado4: #f78f46; --color-yellow: #f78f46; --color-personalizado4-hover: #f57115; --color-yellow-hover: #f57115; --color-personalizado5: #af4c48; --color-wine: #af4c48; */ } /* .keditor-content-area a { color: #069; } .keditor-content-area a:hover { color: #f63; } */ /* snippets en vista previa o al navegar */ main [data-name="snippet"] .ayuda-snippet, main [data-name="snippet"] .form-row:nth-child(2) { display: none; /* no mostrar ayuda ni descripción */ } main [data-name="snippet"] { border: 2px dashed gray; padding: 10px; margin-bottom: 10px; } /* PADDINGs adicionales a los de Bootstrap */ .p-0-5 { padding: 0.125rem !important; /* 2px*/} .pt-0-5 { padding-top: 0.125rem !important; } .pr-0-5 { padding-right: 0.125rem !important; } .pb-0-5 { padding-bottom: 0.125rem !important; } .pl-0-5 { padding-left: 0.125rem !important; } .p-15px { padding: 15px !important; } .pt-15px { padding-top: 15px !important; } .pr-15px { padding-right: 15px !important; } .pb-15px { padding-bottom: 15px !important; } .pl-15px { padding-left: 15px !important; } .p-3-5 { padding: 1.25rem !important; /* 20px*/} .pt-3-5 { padding-top: 1.25rem !important; } .pr-3-5 { padding-right: 1.25rem !important; } .pb-3-5 { padding-bottom: 1.25rem !important; } .pl-3-5 { padding-left: 1.25rem !important; } .p-4-5 { padding: 2rem !important; /* 32px*/} .pt-4-5 { padding-top: 2rem !important; } .pr-4-5 { padding-right: 2rem !important; } .pb-4-5 { padding-bottom: 2rem !important; } .pl-4-5 { padding-left: 2rem !important; } .p-4-75 { padding: 2.5rem !important; /* 40px*/} .pt-4-75 { padding-top: 2.5rem !important; } .pr-4-75 { padding-right: 2.5rem !important; } .pb-4-75 { padding-bottom: 2.5rem !important; } .pl-4-75 { padding-left: 2.5rem !important; } .p-6 { padding: 4rem !important; /* 64px*/ } .pt-6 { padding-top: 4rem !important; } .pr-6 { padding-right: 4rem !important; } .pb-6 { padding-bottom: 4rem !important; } .pl-6 { padding-left: 4rem !important; } .p-6-5 { padding: 4.5rem !important; /* 72px*/ } .pt-6-5 { padding-top: 4.5rem !important; } .pr-6-5 { padding-right: 4.5rem !important; } .pb-6-5 { padding-bottom: 4.5rem !important; } .pl-6-5 { padding-left: 4.5rem !important; } .p-7 { padding: 5rem !important; /* 80px*/ } .pt-7 { padding-top: 5rem !important; } .pr-7 { padding-right: 5rem !important; } .pb-7 { padding-bottom: 5rem !important; } .pl-7 { padding-left: 5rem !important; } .p-8 { padding: 6rem !important; /* 96px*/ } .pt-8 { padding-top: 6rem !important; } .pr-8 { padding-right: 6rem !important; } .pb-8 { padding-bottom: 6rem !important; } .pl-8 { padding-left: 6rem !important; } .p-9 { padding: 7.5rem !important; /* 120px*/ } .pt-9 { padding-top: 7.5rem !important; } .pr-9 { padding-right: 7.5rem !important; } .pb-9 { padding-bottom: 7.5rem !important; } .pl-9 { padding-left: 7.5rem !important; } .p-10 { padding: 9rem !important; /* 150px*/ } .pt-10 { padding-top: 9rem !important; } .pr-10 { padding-right: 9rem !important; } .pb-10 { padding-bottom: 9rem !important; } .pl-10 { padding-left: 9rem !important; } /* MARGINs adicionales a los de Bootstrap */ .mr-n15px { margin-right: -15px } .ml-n15px { margin-left: -15px } .m-0-5 { margin: 0.125rem !important; /* 2px*/} .mt-0-5 { margin-top: 0.125rem !important; } .mr-0-5 { margin-right: 0.125rem !important; } .mb-0-5 { margin-bottom: 0.125rem !important; } .ml-0-5 { margin-left: 0.125rem !important; } .m-3-5 { margin: 1.25rem !important; /* 20px*/} .mt-3-5 { margin-top: 1.25rem !important; } .mr-3-5 { margin-right: 1.25rem !important;} .mb-3-5 { margin-bottom: 1.25rem !important; } .ml-3-5 { margin-left: 1.25rem !important; } .m-4-5 { margin: 2rem !important; /* 32px*/} .mt-4-5 { margin-top: 2rem !important; } .mr-4-5 { margin-right: 2rem !important; } .mb-4-5 { margin-bottom: 2rem !important; } .ml-4-5 { margin-left: 2rem !important; } .m-4-75 { margin: 2.5rem !important; /* 40px*/} .mt-4-75 { margin-top: 2.5rem !important; } .mr-4-75 { margin-right: 2.5rem !important; } .mb-4-75 { margin-bottom: 2.5rem !important; } .ml-4-75 { margin-left: 2.5rem !important; } .m-6 { margin: 4rem !important; /* 64px*/ } .mt-6 { margin-top: 4rem !important; } .mr-6 { margin-right: 4rem !important; } .mb-6 { margin-bottom: 4rem !important; } .ml-6 { margin-left: 4rem !important; } .m-6-5 { margin: 4.5rem !important; /* 72px*/ } .mt-6-5 { margin-top: 4.5rem !important; } .mr-6-5 { margin-right: 4.5rem !important; } .mb-6-5 { margin-bottom: 4.5rem !important; } .ml-6-5 { margin-left: 4.5rem !important; } .m-7 { margin: 5rem !important; /* 80px*/ } .mt-7 { margin-top: 5rem !important; } .mr-7 { margin-right: 5rem !important; } .mb-7 { margin-bottom: 5rem !important; } .ml-7 { margin-left: 5rem !important; } .m-8 { margin: 6rem !important; /* 96px*/ } .mt-8 { margin-top: 6rem !important; } .mr-8 { margin-right: 6rem !important; } .mb-8 { margin-bottom: 6rem !important; } .ml-8 { margin-left: 6rem !important; } .m-9 { margin: 7.5rem !important; /* 120px*/ } .mt-9 { margin-top: 7.5rem !important; } .mr-9 { margin-right: 7.5rem !important; } .mb-9 { margin-bottom: 7.5rem !important; } .ml-9 { margin-left: 7.5rem !important; } .m-10 { margin: 9rem !important; /* 150px*/ } .mt-10 { margin-top: 9rem !important; } .mr-10 { margin-right: 9rem !important; } .mb-10 { margin-bottom: 9rem !important; } .ml-10 { margin-left: 9rem !important; } /* HEIGHTMIN-<...px/...x100> */ .minheight-auto {min-height:auto;} .minheight-25px {min-height: 25px;} .minheight-50px {min-height: 50px;} .minheight-75px {min-height: 75px;} .minheight-100px {min-height: 100px;} .minheight-125px {min-height: 125px;} .minheight-150px {min-height: 150px;} .minheight-175px {min-height: 175px;} .minheight-200px {min-height: 200px;} .minheight-225px {min-height: 225px;} .minheight-250px {min-height: 250px;} .minheight-275px {min-height: 275px;} .minheight-300px {min-height: 300px;} .minheight-350px {min-height: 350px;} .minheight-400px {min-height: 400px;} .minheight-500px {min-height: 500px;} .minheight-600px {min-height: 600px;} /* BG- */ /* .bg-personalizado1 { background-color: #e8413d; background-color: var(--color-orange, #e8413d); color: #fff; color: var(--color-white, #fff); } .bg-personalizado1 p, .bg-personalizado1 h1, .bg-personalizado1 h2, .bg-personalizado1 h3, .bg-personalizado1 h4, .bg-personalizado1 h5, .bg-personalizado1 h6 { color: #fff; color: var(--color-white, #fff); } */ section[data-type="container"] .bg-default, #keditor-setting-panel .bg-default { background-color: transparent; color: #212529; color: var(--color-text-default, #212529); } /* .bg-default p, .bg-default h1, .bg-default h2, .bg-default h3, .bg-default h4, .bg-default h5, .bg-default h6 { color: #212529; color: var(--color-text-default, #212529); } */ section[data-type="container"] .bg-transparent, #keditor-setting-panel .bg-transparent { background-color: transparent; color: #212529; color: var(--color-text-default, #212529); } /* .bg-transparent p, .bg-transparent h1, .bg-transparent h2, .bg-transparent h3, .bg-transparent h4, .bg-transparent h5, .bg-transparent h6 { color: #212529; color: var(--color-text-default, #212529); } */ section[data-type="container"] .bg-white, #keditor-setting-panel .bg-white { background-color: #f3f3f3; color: #212529; color: var(--color-text-default, #212529); } /* .bg-white p, .bg-white h1, .bg-white h2, .bg-white h3, .bg-white h4, .bg-white h5, .bg-white h6 { color: #212529; color: var(--color-text-default, #212529); } */ section[data-type="container"] .efect-bg-over-darken.bg-white:hover { background-color: #e8e7e8; background-color: var(--color-white-hover, #e8e7e8); } section[data-type="container"] .bg-white-semitransparent, #keditor-setting-panel .bg-white-semitransparent { background-color: #ffffff26; color: var(--color-white-semitransparent, #ffffff26); color: #fff; color: var(--color-white, #fff); } /* .bg-white-semitransparent a, .bg-white-semitransparent p, .bg-white-semitransparent h1, .bg-white-semitransparent h2, .bg-white-semitransparent h3, .bg-white-semitransparent h4, .bg-white-semitransparent h5, .bg-white-semitransparent h6 { color: #fff; color: var(--color-white, #fff); } */ section[data-type="container"] .efect-bg-over-darken.bg-white-semitransparent:hover { background-color: #ffffff16; } section[data-type="container"] .bg-black-semitransparent, #keditor-setting-panel .bg-black-semitransparent { background-color: rgba(0, 0, 0, 0.55); color: #fff; } /* .bg-black-semitransparent a, .bg-black-semitransparent p, .bg-black-semitransparent h1, .bg-black-semitransparent h2, .bg-black-semitransparent h3, .bg-black-semitransparent h4, .bg-black-semitransparent h5, .bg-black-semitransparent h6 { color: #fff; } */ section[data-type="container"] .efect-bg-over-darken.bg-black-semitransparent:hover { background-color: rgba(0, 0, 0, 0.7); } section[data-type="container"] .bg-black, #keditor-setting-panel .bg-black { background-color: #201f1f; background-color: var(--color-dark-hover, #201f1f); color: #fff; color: var(--color-white, #fff); } /* .bg-black p, .bg-black h1, .bg-black h2, .bg-black h3, .bg-black h4, .bg-black h5, .bg-black h6 { color: #fff; color: var(--color-white, #fff); } */ section[data-type="container"] .efect-bg-over-blacken.bg-black:hover { background-color: #000; } section[data-type="container"] .bg-dark, #keditor-setting-panel .bg-dark { background-color: #343a40 !important; background-color: var(--color-dark, #343a40) !important; color: #fff; color: var(--color-white, #fff); } /* .bg-dark p, .bg-dark h1, .bg-dark h2, .bg-dark h3, .bg-dark h4, .bg-dark h5, .bg-dark h6 { color: #fff; color: var(--color-white, #fff); } */ section[data-type="container"] .efect-bg-over-darken.bg-dark:hover { background-color: #201f1f; background-color: var(--color-dark-hover, #201f1f); } section[data-type="container"] .bg-dark-gray, #keditor-setting-panel .bg-dark-gray { background-color: #52575c; color: var(--color-dark-gray, #52575c); color: #fff; color: var(--color-white, #fff); } /* .bg-dark-gray p, .bg-dark-gray h1, .bg-dark-gray h2, .bg-dark-gray h3, .bg-dark-gray h4, .bg-dark-gray h5, .bg-dark-gray h6 { color: #fff; color: var(--color-white, #fff); } */ section[data-type="container"] .efect-bg-over-darken.bg-dark-gray:hover { background-color: #343a40; background-color: var(--color-dark-gray-hover, #343a40); } section[data-type="container"] .bg-gray, #keditor-setting-panel .bg-gray { background-color: #ccc; /* color: #ef6536; color: var(--color-orange2, #ef6536); */ color: #3a3838; color: var(--color-dark, #3a3838); } /* .bg-gray p, .bg-gray h1, .bg-gray h2, .bg-gray h3, .bg-gray h4, .bg-gray h5, .bg-gray h6 { color: #3a3838; color: var(--color-dark, #3a3838); } */ section[data-type="container"] .efect-bg-over-darken.bg-gray:hover { background-color: #343a40; background-color: var(--color-gray-hover, #343a40); } section[data-type="container"] .bg-white-gray, #keditor-setting-panel .bg-white-gray, section[data-type="container"] .bg-light-gray, #keditor-setting-panel .bg-light-gray { background-color: #f7f7f7; background-color: var(--color-light, #f7f7f7); color: #212529; color: var(--color-text-default, #212529); } section[data-type="container"] .efect-bg-over-darken.bg-white-gray:hover, section[data-type="container"] .efect-bg-over-darken.bg-light-gray:hover { background-color: #cbcbcb; background-color: var(--color-white-gray-hover, #cbcbcb); } section[data-type="container"] .bg-light, #keditor-setting-panel .bg-light { background-color: #f8f9fa; background-color: var(--color-white-gray, #f8f9fa); color: #495057; } /* .bg-light, .bg-light p, .bg-light h1, .bg-light h2, .bg-light h3, .bg-light h4, .bg-light h5, .bg-light h6 { color: #003366; color: var(--color-dark-blue, #003366); } */ section[data-type="container"] .efect-bg-over-darken.bg-light:hover { background-color: #cbcbcb; background-color: var(--color-light-hover, #cbcbcb); } section[data-type="container"] .bg-dark-blue, #keditor-setting-panel .bg-dark-blue { background-color: #003366; color: var(--color-dark-blue, #003366); color: #fff; color: var(--color-white, #fff); } /* .bg-dark-blue, .bg-dark-blue p, .bg-dark-blue h1, .bg-dark-blue h2, .bg-dark-blue h3, .bg-dark-blue h4, .bg-dark-blue h5, .bg-dark-blue h6 { color: #fff; color: var(--color-white, #fff); } */ section[data-type="container"] .efect-bg-over-darken.bg-light-dark-blue:hover { background-color: #001a33; background-color: var(--color-light-dark-blue-hover, #001a33); } section[data-type="container"] .bg-blue, #keditor-setting-panel .bg-blue { background-color: #005682; color: var(--color-blue, #005682); color: #fff; color: var(--color-white, #fff); } /* .bg-blue, .bg-blue p, .bg-blue h1, .bg-blue h2, .bg-blue h3, .bg-blue h4, .bg-blue h5, .bg-blue h6 { color: #fff; color: var(--color-white, #fff); } */ section[data-type="container"] .efect-bg-over-darken.bg-light-blue:hover { background-color: #003366; background-color: var(--color-light-blue-hover, #003366); } section[data-type="container"] .bg-light-blue, #keditor-setting-panel .bg-light-blue { background-color: #d8e5ea; color: var(--color-light-blue, #d8e5ea); color: #003366; color: var(--color-dark-blue, #003366); } /* .bg-light-blue, .bg-light-blue p, .bg-light-blue h1, .bg-light-blue h2, .bg-light-blue h3, .bg-light-blue h4, .bg-light-blue h5, .bg-light-blue h6 { color: #003366; color: var(--color-dark-blue, #003366); } */ section[data-type="container"] .efect-bg-over-darken.bg-light-blue:hover { background-color: #005682; background-color: var(--color-light-blue-hover, #005682); } section[data-type="container"] .bg-white-blue, #keditor-setting-panel .bg-white-blue { background-color: #f1f5f8; color: var(--color-white-blue, #f1f5f8); color: #003366; color: var(--color-dark-blue, #003366); } section[data-type="container"] .efect-bg-over-darken.bg-white-blue:hover { background-color: #d8e5ea; background-color: var(--color-white-blue-hover, #d8e5ea); } section[data-type="container"] .bg-red, #keditor-setting-panel .bg-red { background-color: #bf4544; color: var(--color-red, #bf4544); color: #fff; color: var(--color-white, #fff); } /* .bg-red, .bg-red p, .bg-red h1, .bg-red h2, .bg-red h3, .bg-red h4, .bg-red h5, .bg-red h6 { color: #fff; color: var(--color-white, #fff); } */ section[data-type="container"] .efect-bg-over-darken.bg-red:hover { background-color: #5f2121; background-color: var(--color-red-hover, #5f2121); } section[data-type="container"] .bg-orange, #keditor-setting-panel .bg-orange { /* background-color: #ce6f05; color: var(--color-orange, #ce6f05); */ background-color: #bd5b00; color: var(--color-orange, #bd5b00); /* cambiado por accesibilidad con texto blanco */ color: #fff; color: var(--color-white, #fff); } /* .bg-orange, .bg-orange p, .bg-orange h1, .bg-orange h2, .bg-orange h3, .bg-orange h4, .bg-orange h5, .bg-orange h6 { color: #fff; color: var(--color-white, #fff); } */ section[data-type="container"] .efect-bg-over-darken.bg-orange:hover { background-color: #7c4403; background-color: var(--color-orange-hover, #7c4403); } section[data-type="container"] .bg-orange2, #keditor-setting-panel .bg-orange2 { /* background-color: #ff6633; color: var(--color-orange2, #ff6633); */ background-color: #d63600; color: var(--color-orange2a, #d63600); /* alternativa más naranja accesible con texto blanco */ color: #fff; color: var(--color-white, #fff); } /* .bg-orange2, .bg-orange2 p, .bg-orange2 h1, .bg-orange2 h2, .bg-orange2 h3, .bg-orange2 h4, .bg-orange2 h5, .bg-orange2 h6 { color: #fff; color: var(--color-white, #fff); } */ section[data-type="container"] .efect-bg-over-darken.bg-orange2:hover { background-color: #b32d00; background-color: var(--color-orange2-hover, #b32d00); } section[data-type="container"] .bg-light-orange, #keditor-setting-panel .bg-light-orange { background-color: #ed7100; color: var(--color-light-orange, #ed7100); /* color: #fff; color: var(--color-white, #fff); */ color: #212529; color: var(--color-text-default, #212529); /* con blanco no era accesible. La alternativa con texto blanco es el nuevo bg-orange2 */ } section[data-type="container"] .efect-bg-over-darken.bg-light-orange:hover { background-color: #b35600; background-color: var(--color-light-orange-hover, #b35600); } section[data-type="container"] .bg-light-orange-2, #keditor-setting-panel .bg-light-orange-2 { background-color: #FBD8B4; color: var(--color-light-orange-2, #FBD8B4); color: #212529; color: var(--color-text-default, #212529); } section[data-type="container"] .efect-bg-over-darken.bg-light-orange-2:hover { background-color: #7c4403; background-color: var(--color-light-orange-2-hover, #7c4403); } section[data-type="container"] .bg-white-orange, #keditor-setting-panel .bg-white-orange { background-color: #FCF5EE; color: var(--color-white-orange, #FCF5EE); /*color: #212529; color: var(--color-text-default, #212529); */ color: #b35600; color: var(--color-light-orange-hover, #b35600); } section[data-type="container"] .efect-bg-over-darken.bg-white-orange:hover { background-color: #FBD8B4; background-color: var(--color-white-orange-hover, #FBD8B4); } section[data-type="container"] .bg-yellow, #keditor-setting-panel .bg-yellow { background-color: #f39912; color: var(--color-yellow, #f39912); color: #212529; color: var(--color-text-default, #212529); } /* .bg-yellow, .bg-yellow p, .bg-yellow h1, .bg-yellow h2, .bg-yellow h3, .bg-yellow h4, .bg-yellow h5, .bg-yellow h6 { color: #212529; color: var(--color-text-default, #212529); } */ section[data-type="container"] .efect-bg-over-darken.bg-yellow:hover { background-color: #aa6909; background-color: var(--color-yellow-hover, #aa6909); } section[data-type="container"] .bg-yellow2, #keditor-setting-panel .bg-yellow2 { background-color: #ffd23a; color: var(--color-yellow2, #ffd23a); color: #212529; color: var(--color-text-default, #212529); } /* .bg-yellow2, .bg-yellow2 p, .bg-yellow2 h1, .bg-yellow2 h2, .bg-yellow2 h3, .bg-yellow2 h4, .bg-yellow2 h5, .bg-yellow2 h6 { color: #212529; color: var(--color-text-default, #212529); } */ section[data-type="container"] .efect-bg-over-darken.bg-yellow2:hover { background-color: #cc9c00; background-color: var(--color-yellow2-hover, #cc9c00); } section[data-type="container"] a.text-decoration-none:hover { text-decoration: none; } /* enlaces dentro de las cajas con .bg- */ section[data-type="container"] .bg-default a { color: #069; color: var(--color-a-default, #069); text-decoration: none; } section[data-type="container"] .bg-default a, section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-default a:hover { color: #f63; color: var(--color-a-default-hover, #f63); /* text-decoration: underline; */ } /* enlaces normales sobre otros colores: subrayado en hover */ section[data-type="container"] [class*="bg-"]:not(.bg-default) a:not(.flecha-animada):not(.subrayado-animado):not(.desplazamiento-animado):not(.text-decoration-none), section[data-type="container"] [class*="bg-"]:not(.bg-default) a:not(.flecha-animada):not(.subrayado-animado):not(.desplazamiento-animado):not(.text-decoration-none) { text-decoration: underline; } /* enlaces animados: sin subrayar en hover (ya se destaca con su animación) */ section[data-type="container"] a.flecha-animada:hover, section[data-type="container"] a.subrayado-animado:hover, section[data-type="container"] a.desplazamiento-animado:hover { text-decoration: none; } /* colores de enlace (normal y ante hover) según fondo */ section[data-type="container"] .bg-transparent a, section[data-type="container"] .bg-white a, section[data-type="container"] .bg-gray a, section[data-type="container"] .bg-light a, section[data-type="container"] .bg-white-gray a, section[data-type="container"] .bg-light-gray a, section[data-type="container"] .bg-white-blue a, section[data-type="container"] .bg-yellow a, section[data-type="container"] .bg-yellow2 a, section[data-type="container"] .bg-light-orange a { color: #343a40; color: var(--color-a-dark, #343a40); } /* TODO: el estilo .efect-no-destacar-enlaces da problemas al combinar un .bg- con un .text- ... -> ¿habría que aplicarlos sin el :not, reasignando el color sin :hover? */ section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-transparent a:hover, section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-white a:hover, section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-gray a:hover, section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-light a:hover, section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-white-gray a:hover, section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-light-gray a:hover, section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-white-blue a:hover, section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-yellow a:hover, section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-yellow2 a:hover, section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-light-orange a:hover { color: #201f1f; color: var(--color-a-dark-hover, #201f1f); } section[data-type="container"] .bg-white-orange a { color: #b32d00; color: var(--color-orange2-hover, #b32d00); } section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-white-orange a:hover { color: #7c4403; color: var(--color-orange-hover, #7c4403); } section[data-type="container"] .bg-white-semitransparent a, section[data-type="container"] .bg-black-semitransparent a, section[data-type="container"] .bg-black a, section[data-type="container"] .bg-dark a, section[data-type="container"] .bg-dark-gray a, section[data-type="container"] .bg-dark-blue a, section[data-type="container"] .bg-blue a, section[data-type="container"] .bg-red a, section[data-type="container"] .bg-orange a, section[data-type="container"] .bg-orange2 a /* .bg-light-orange a */ /* se cambia a texto oscuro por accesibilidad */ { color: #fff; color: var(--color-a-white, #fff); } section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-black a:hover, section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-white-semitransparent a:hover, section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-dark a:hover, section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-dark-gray a:hover, section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-dark-blue a:hover, section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-blue a:hover, section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-red a:hover, section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-orange a:hover, section[data-type="container"] /* :not(.efect-no-destacar-enlaces).bg-light-orange a:hover */ section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-orange2 a:hover { color: #e8e7e8; color: var(--color-a-white-hover, #e8e7e8); } section[data-type="container"] .bg-light-blue a, section[data-type="container"] .bg-white-blue a { color: #003366; color: var(--color-a-ua, #003366); } section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-light-blue a:hover, section[data-type="container"] :not(.efect-no-destacar-enlaces).bg-light a:hover { color: #001a33; color: var(--color-a-ua-hover, #001a33); } /* TEXT- */ #keditor-setting-panel .text-default, section[data-type="container"] .text-default, section[data-type="container"] .text-default p, section[data-type="container"] .text-default h1, section[data-type="container"] .text-default h2, section[data-type="container"] .text-default h3, section[data-type="container"] .text-default h4, section[data-type="container"] .text-default h5, section[data-type="container"] .text-default h6 { color: #212529; color: var(--color-text-default, #212529); } section[data-type="container"] .text-default a { color: #069; color: var(--color-a-default, #069); text-decoration: none; } section[data-type="container"] .text-default a:hover { color: #f63 !important; } section[data-type="container"] .text-default a:hover:not(.flecha-animada):not(.subrayado-animado):not(.desplazamiento-animado):not(.text-decoration-none) { text-decoration: underline; } /* enlaces normales en otros colores: subrayado en hover */ section[data-type="container"] [class*="text-"]:not(.text-default) a:not(.flecha-animada):not(.subrayado-animado):not(.desplazamiento-animado):not(.btn):not(.nav-link):not(.dropdown-item) { text-decoration: underline; } /* enlaces animados: sin subrayar en hover (ya se destaca con su animación) */ section[data-type="container"] a.flecha-animada:hover, section[data-type="container"] a.subrayado-animado:hover, section[data-type="container"] a.desplazamiento-animado:hover { text-decoration: none; } /* Bootstrap (recuperarlos, por si han sido sobreescritos por un bg-) */ #keditor-setting-panel .text-dark, section[data-type="container"] .text-dark, section[data-type="container"] .text-dark p, section[data-type="container"] .text-dark h1, section[data-type="container"] .text-dark h2, section[data-type="container"] .text-dark h3, section[data-type="container"] .text-dark h4, section[data-type="container"] .text-dark h5, section[data-type="container"] .text-dark h6, section[data-type="container"] .text-dark a { color: #343a40; color: var(--color-dark, #343a40); } #keditor-setting-panel .text-dark-gray, section[data-type="container"] .text-dark-gray, section[data-type="container"] .text-dark-gray p, section[data-type="container"] .text-dark-gray h1, section[data-type="container"] .text-dark-gray h2, section[data-type="container"] .text-dark-gray h3, section[data-type="container"] .text-dark-gray h4, section[data-type="container"] .text-dark-gray h5, section[data-type="container"] .text-dark-gray h6, section[data-type="container"] .text-dark-gray a { color: #52575c; color: var(--color-dark-gray, #52575c); } #keditor-setting-panel .text-gray, section[data-type="container"] .text-gray, section[data-type="container"] .text-gray p, section[data-type="container"] .text-gray h1, section[data-type="container"] .text-gray h2, section[data-type="container"] .text-gray h3, section[data-type="container"] .text-gray h4, section[data-type="container"] .text-gray h5, section[data-type="container"] .text-gray h6, section[data-type="container"] .text-gray a { color: #ccc; color: var(--color-gray, #ccc); } #keditor-setting-panel .text-white-gray, section[data-type="container"] .text-white-gray, section[data-type="container"] .text-white-gray p, section[data-type="container"] .text-white-gray h1, section[data-type="container"] .text-white-gray h2, section[data-type="container"] .text-white-gray h3, section[data-type="container"] .text-white-gray h4, section[data-type="container"] .text-white-gray h5, section[data-type="container"] .text-white-gray h6, section[data-type="container"] .text-white-gray a { color: #f8f9fa; color: var(--color-white-gray, #f8f9fa); } #keditor-setting-panel .text-muted, section[data-type="container"] .text-muted, section[data-type="container"] .text-muted p, section[data-type="container"] .text-muted h1, section[data-type="container"] .text-muted h2, section[data-type="container"] .text-muted h3, section[data-type="container"] .text-muted h4, section[data-type="container"] .text-muted h5, section[data-type="container"] .text-muted h6, section[data-type="container"] .text-muted a { color: #6c757d; } #keditor-setting-panel .text-white, section[data-type="container"] .text-white, section[data-type="container"] .text-white p, section[data-type="container"] .text-white h1, section[data-type="container"] .text-white h2, section[data-type="container"] .text-white h3, section[data-type="container"] .text-white h4, section[data-type="container"] .text-white h5, section[data-type="container"] .text-white h6, section[data-type="container"] .text-white a { color: #fff; color: var(--color-white, #fff); } #keditor-setting-panel .text-black-50, section[data-type="container"] .text-black-50, section[data-type="container"] .text-black-50 p, section[data-type="container"] .text-black-50 h1, section[data-type="container"] .text-black-50 h2, section[data-type="container"] .text-black-50 h3, section[data-type="container"] .text-black-50 h4, section[data-type="container"] .text-black-50 h5, section[data-type="container"] .text-black-50 h6, section[data-type="container"] .text-black-50 a { color: rgba(0, 0, 0, 0.5); } #keditor-setting-panel .text-white-50, section[data-type="container"] .text-white-50, section[data-type="container"] .text-white-50 p, section[data-type="container"] .text-white-50 h1, section[data-type="container"] .text-white-50 h2, section[data-type="container"] .text-white-50 h3, section[data-type="container"] .text-white-50 h4, section[data-type="container"] .text-white-50 h5, section[data-type="container"] .text-white-50 h6, section[data-type="container"] .text-white-50 a { color: rgba(255, 255, 255, 0.5) } /* propios */ #keditor-setting-panel .text-black, section[data-type="container"] .text-black, section[data-type="container"] .text-black p, section[data-type="container"] .text-black h1, section[data-type="container"] .text-black h2, section[data-type="container"] .text-black h3, section[data-type="container"] .text-black h4, section[data-type="container"] .text-black h5, section[data-type="container"] .text-black h6, section[data-type="container"] .text-black a { color: #212529; color: var(--color-text-default, #212529); } #keditor-setting-panel .text-dark-blue, section[data-type="container"] .text-dark-blue, section[data-type="container"] .text-dark-blue p, section[data-type="container"] .text-dark-blue h1, section[data-type="container"] .text-dark-blue h2, section[data-type="container"] .text-dark-blue h3, section[data-type="container"] .text-dark-blue h4, section[data-type="container"] .text-dark-blue h5, section[data-type="container"] .text-dark-blue h6, section[data-type="container"] .text-dark-blue a { color: #003366; color: var(--color-dark-blue, #003366); } #keditor-setting-panel .text-blue, section[data-type="container"] .text-blue, section[data-type="container"] .text-blue p, section[data-type="container"] .text-blue h1, section[data-type="container"] .text-blue h2, section[data-type="container"] .text-blue h3, section[data-type="container"] .text-blue h4, section[data-type="container"] .text-blue h5, section[data-type="container"] .text-blue h6, section[data-type="container"] .text-blue a { color: #005682; color: var(--color-blue, #005682); } #keditor-setting-panel .text-light-blue, section[data-type="container"] .text-light-blue, section[data-type="container"] .text-light-blue p, section[data-type="container"] .text-light-blue h1, section[data-type="container"] .text-light-blue h2, section[data-type="container"] .text-light-blue h3, section[data-type="container"] .text-light-blue h4, section[data-type="container"] .text-light-blue h5, section[data-type="container"] .text-light-blue h6, section[data-type="container"] .text-light-blue a { color: #d8e5ea; color: var(--color-light-blue, #d8e5ea); } #keditor-setting-panel .text-light, section[data-type="container"] .text-light, section[data-type="container"] .text-light p, section[data-type="container"] .text-light h1, section[data-type="container"] .text-light h2, section[data-type="container"] .text-light h3, section[data-type="container"] .text-light h4, section[data-type="container"] .text-light h5, section[data-type="container"] .text-light h6, section[data-type="container"] .text-light a { color: #f1f5f8; color: var(--color-light, #f1f5f8); } #keditor-setting-panel .text-red, section[data-type="container"] .text-red, section[data-type="container"] .text-red p, section[data-type="container"] .text-red h1, section[data-type="container"] .text-red h2, section[data-type="container"] .text-red h3, section[data-type="container"] .text-red h4, section[data-type="container"] .text-red h5, section[data-type="container"] .text-red h6, section[data-type="container"] .text-red a { color: #bf4544; color: var(--color-red, #bf4544); } #keditor-setting-panel .text-red-orange, section[data-type="container"] .text-red-orange, section[data-type="container"] .text-red-orange p, section[data-type="container"] .text-red-orange h1, section[data-type="container"] .text-red-orange h2, section[data-type="container"] .text-red-orange h3, section[data-type="container"] .text-red-orange h4, section[data-type="container"] .text-red-orange h5, section[data-type="container"] .text-red-orange h6, section[data-type="container"] .text-red-orange a { color: #d63600; color: var(--color-orange2a, #d63600); } #keditor-setting-panel .text-orange, section[data-type="container"] .text-orange, section[data-type="container"] .text-orange p, section[data-type="container"] .text-orange h1, section[data-type="container"] .text-orange h2, section[data-type="container"] .text-orange h3, section[data-type="container"] .text-orange h4, section[data-type="container"] .text-orange h5, section[data-type="container"] .text-orange h6, section[data-type="container"] .text-orange a { color: #ce6f05; color: var(--color-orange, #ce6f05); } #keditor-setting-panel .text-orange2, section[data-type="container"] .text-orange2, section[data-type="container"] .text-orange2 p, section[data-type="container"] .text-orange2 h1, section[data-type="container"] .text-orange2 h2, section[data-type="container"] .text-orange2 h3, section[data-type="container"] .text-orange2 h4, section[data-type="container"] .text-orange2 h5, section[data-type="container"] .text-orange2 h6, section[data-type="container"] .text-orange2 a { color: #ff6633; color: var(--color-orange2, #ff6633); } #keditor-setting-panel .text-light-orange, section[data-type="container"] .text-light-orange, section[data-type="container"] .text-light-orange p, section[data-type="container"] .text-light-orange h1, section[data-type="container"] .text-light-orange h2, section[data-type="container"] .text-light-orange h3, section[data-type="container"] .text-light-orange h4, section[data-type="container"] .text-light-orange h5, section[data-type="container"] .text-light-orange h6, section[data-type="container"] .text-light-orange a { color: #ed7100; color: var(--color-light-orange, #ed7100); } #keditor-setting-panel .text-white-orange, section[data-type="container"] .text-white-orange, section[data-type="container"] .text-white-orange p, section[data-type="container"] .text-white-orange h1, section[data-type="container"] .text-white-orange h2, section[data-type="container"] .text-white-orange h3, section[data-type="container"] .text-white-orange h4, section[data-type="container"] .text-white-orange h5, section[data-type="container"] .text-white-orange h6, section[data-type="container"] .text-white-orange a { color: #FCF5EE; color: var(--color-white-orange, #FCF5EE); } #keditor-setting-panel .text-yellow, section[data-type="container"] .text-yellow, section[data-type="container"] .text-yellow p, section[data-type="container"] .text-yellow h1, section[data-type="container"] .text-yellow h2, section[data-type="container"] .text-yellow h3, section[data-type="container"] .text-yellow h4, section[data-type="container"] .text-yellow h5, section[data-type="container"] .text-yellow h6, section[data-type="container"] .text-yellow a { color: #f39912; color: var(--color-yellow, #f39912); } #keditor-setting-panel .text-yellow2, section[data-type="container"] .text-yellow2, section[data-type="container"] .text-yellow2 p, section[data-type="container"] .text-yellow2 h1, section[data-type="container"] .text-yellow2 h2, section[data-type="container"] .text-yellow2 h3, section[data-type="container"] .text-yellow2 h4, section[data-type="container"] .text-yellow2 h5, section[data-type="container"] .text-yellow2 h6, section[data-type="container"] .text-yellow2 a { color: #ffd23a; color: var(--color-yellow2, #ffd23a); } /* border- propios */ /* misma nomenglatura que para textos -que no bordes- en Bootstrap */ section[data-type="container"] .border-dark { border-color: #343a40 !important; border-color: var(--color-dark, #343a40) !important; } section[data-type="container"] .border-dark-gray { border-color: #52575c !important; border-color: var(--color-dark-gray, #52575c) !important; } section[data-type="container"] .border-gray { border-color: #ccc !important; border-color: var(--color-gray, #ccc) !important; } section[data-type="container"] .border-white-gray { border-color: #f8f9fa !important; border-color: var(--color-white-gray, #f8f9fa) !important; } section[data-type="container"] .border-muted { border-color: #6c757d !important; } section[data-type="container"] .border-white { border-color: #fff !important; border-color: var(--color-white, #fff) !important; } section[data-type="container"] .border-black-50 { border-color: rgba(0, 0, 0, 0.5) !important; } section[data-type="container"] .border-white-50 { border-color: rgba(255, 255, 255, 0.5) !important; } /* propios del todo*/ section[data-type="container"] .border-black { border-color: #212529 !important; border-color: var(--color-text-default, #212529) !important; } section[data-type="container"] .border-dark-blue { border-color: #003366 !important; border-color: var(--color-dark-blue, #003366) !important; } section[data-type="container"] .border-blue { border-color: #005682 !important; border-color: var(--color-blue, #005682) !important; } section[data-type="container"] .border-light-blue { border-color: #d8e5ea !important; border-color: var(--color-light-blue, #d8e5ea) !important; } section[data-type="container"] .border-light { border-color: #f1f5f8 !important; border-color: var(--color-light, #f1f5f8) !important; } section[data-type="container"] .border-red { border-color: #bf4544 !important; border-color: var(--color-red, #bf4544) !important; } section[data-type="container"] .border-red-orange { border-color: #d63600 !important; border-color: var(--color-orange2a, #d63600) !important; } section[data-type="container"] .border-orange { border-color: #ce6f05 !important; border-color: var(--color-orange, #ce6f05) !important; } section[data-type="container"] .border-orange2 { border-color: #ff6633 !important; border-color: var(--color-orange2, #ff6633) !important; } section[data-type="container"] .border-light-orange { border-color: #ed7100 !important; border-color: var(--color-light-orange, #ed7100) !important; } section[data-type="container"] .border-white-orange { border-color: #FCF5EE !important; border-color: var(--color-white-orange, #FCF5EE) !important; } section[data-type="container"] .border-yellow { border-color: #f39912 !important; border-color: var(--color-yellow, #f39912) !important; } section[data-type="container"] .border-yellow2 { border-color: #ffd23a !important; border-color: var(--color-yellow2, #ffd23a) !important; } /* EFECTOS / MISCELÁNEA */ /* enlaces oscurecidos al pasar sobre ellos */ section[data-type="container"] :not(.efect-no-destacar-enlaces).text-black a:hover { color: #000; } section[data-type="container"] :not(.efect-no-destacar-enlaces).text-dark-gray a:hover { color: #201f1f; color: var(--color-dark-gray-hover, #343a40); } section[data-type="container"] :not(.efect-no-destacar-enlaces).text-gray a:hover { color: #201f1f; color: var(--color-gray-hover, #3a3838); } section[data-type="container"] :not(.efect-no-destacar-enlaces).text-white-gray a:hover { color: #cbcbcb; color: var(--color-white-gray-hover, #cbcbcb); } section[data-type="container"] :not(.efect-no-destacar-enlaces).text-muted a:hover { color: #52575c; color: var(--color-dark-gray, #52575c); } section[data-type="container"] :not(.efect-no-destacar-enlaces).text-white a:hover { color: #e8e7e8; color: var(--color-white-over, #e8e7e8); } section[data-type="container"] :not(.efect-no-destacar-enlaces).text-black-50 a:hover { color: rgba(0, 0, 0, 0.7); } section[data-type="container"] :not(.efect-no-destacar-enlaces).text-white-50 a:hover { color: rgba(255, 255, 255, 0.3) } section[data-type="container"] :not(.efect-no-destacar-enlaces).text-dark-blue a:hover { color: #001a33; color: var(--color-dark-blue-hover, #001a33); } section[data-type="container"] :not(.efect-no-destacar-enlaces).text-blue a:hover { color: #003366; color: var(--color-blue-hover, #003366); } section[data-type="container"] :not(.efect-no-destacar-enlaces).text-light-blue a:hover { color: #005682; color: var(--color-light-blue-hover, #005682); } section[data-type="container"] :not(.efect-no-destacar-enlaces).text-light a:hover { color: #d8e5ea; color: var(--color-light-hover, #d8e5ea); } section[data-type="container"] :not(.efect-no-destacar-enlaces).text-red a:hover { color: #5f2121; color: var(--color-red-hover, #5f2121); } section[data-type="container"] :not(.efect-no-destacar-enlaces).text-red-orange a:hover { color: #5f2121; color: var(--color-red-hover, #5f2121); } section[data-type="container"] :not(.efect-no-destacar-enlaces).text-orange a:hover { color: #7c4403; color: var(--color-orange-hover, #7c4403); } section[data-type="container"] :not(.efect-no-destacar-enlaces).text-orange2 a:hover { color: #b32d00; color: var(--color-orange2-hover, #b32d00); } section[data-type="container"] :not(.efect-no-destacar-enlaces).text-light-orange a:hover { color: #b35600; color: var(--color-light-orange-hover, #b35600); } section[data-type="container"] :not(.efect-no-destacar-enlaces).text-yellow a:hover { color: #aa6909; color: var(--color-yellow-hover, #aa6909); } section[data-type="container"] :not(.efect-no-destacar-enlaces).text-yellow2 a:hover { color: #cc9c00; color: var(--color-yellow2-hover, #cc9c00); } /* BGEFECT- */ /* stripe-triangles-light-1920px (1 stripe)*/ section[data-type="container"] .bgefect-texture-back { /* originariamente 'back.jpg': 1920x386px FRANJA UNIFORME white-gray */ background-image: url(https://web.ua.es/es/comun2/img/css-cajas/bgefect/texture-back.jpg); background-position: top; background-repeat: repeat-x; } /* texture-triangles-light-1920px (repeat)*/ section[data-type="container"] .bgefect-texture-back-repeat { /* originariamente 'back.jpg': 1920x386px FRANJA UNIFORME white-gray */ background-image: url(https://web.ua.es/es/comun2/img/css-cajas/bgefect/texture-back.jpg); background-position: top; background-repeat: repeat; } /* texture-triangles-vertical-light-to-white */ section[data-type="container"] .bgefect-texture-layer { /* originariamente 'layer.png' (NO utilizado): 1920x587 white-gray a blanco difuminado hacia abajo*/ background-image: url(https://web.ua.es/es/comun2/img/css-cajas/bgefect/texture-layer.png); background-position: center; background-size: cover; } /* texture-triangles-vertical-white-to-light */ section[data-type="container"] .bgefect-texture-back-block { /* originariamente 'FIRST-BLOCK-back.png': 1916x606 BLANCO a white-gray hacia abajo */ background-image: url(https://web.ua.es/es/comun2/img/css-cajas/bgefect/texture-back-block.png); background-position: center; background-size: cover; } /* texture-triangles-horizontal-white-to-orange-onright */ section[data-type="container"] .bgefect-texture-back-pers-1 { /* originariamente 'TITLE-back.png': 632x256px gradiente blanco-NARANJA a la DERECHA*/ background-image: url(https://web.ua.es/es/comun2/img/css-cajas/bgefect/texture-back-pers-1.png); background-position: center right; background-repeat: repeat-y; } /* texture-triangles-light-cover */ section[data-type="container"] .bgefect-texture-back-box { /* 'back-white.png': 400x318 CAJA white-gray */ background-image: url(https://web.ua.es/es/comun2/img/css-cajas/bgefect/texture-back-box.png); background-position: center; background-size: cover; } /* texture-triangles-orange-cover */ section[data-type="container"] .bgefect-texture-back-box-pers-1 { /* 'layer-box'.png: 400x318 CAJA ANARANJADA */ background-image: url(https://web.ua.es/es/comun2/img/css-cajas/bgefect/texture-back-box-pers-1.png); background-position: center; background-size: cover; } /* texture-rectangles-fullheight-onright */ section[data-type="container"] .bgefect-texture-back-gray-squares { /* originariamente 'squares.png': 1032x634 grises (cuadros a la derecha del título de la sección formación) */ background-image: url(https://web.ua.es/es/comun2/img/css-cajas/bgefect/texture-back-gray-squares.png); background-position: right top; background-size: auto 100%; /* height: 100% */ background-repeat: no-repeat; /* height: 100% */ } /* OSCURECER hacia derecha */ section[data-type="container"] .bgefect-linear-gradient-1 { background-image: linear-gradient(to right, rgba(0,0,0,0.4) 0%,rgba(0,0,0,0.4) 100%); } /* ANARANJADO hacia derecha */ section[data-type="container"] .bgefect-linear-gradient-2 { background-image: linear-gradient(to right, #df8f4c 0%, #f25828 100%); } /* BGFILL- */ /* encoger */ section[data-type="container"] .bgfill-fully-visible { /* contraer si es necesario para completamente visible*/ background-size: contain; background-repeat: no-repeat; } /* estirar */ /* cover: Resize the background image to cover the entire container, even if it has to stretch the image or cut a little bit off one of the edges */ section[data-type="container"] .bgfill-full-center, .bgfill-cover-center { /* .full-bg { */ background-position: center; background-size: cover; background-repeat: no-repeat; } section[data-type="container"] .bgfill-full, .bgfill-cover /* from-left*/ { background-position: left top; background-size: cover; background-repeat: no-repeat; } section[data-type="container"] .bgfill-full-from-right, .bgfill-cover-from-right { background-position: right top; background-size: cover; background-repeat: no-repeat; } /* estirar al 100% */ section[data-type="container"] .bgfill-stretch100 { background-size: 100% 100%; background-repeat: no-repeat; } /* repetir */ section[data-type="container"] .bgfill-fill-nogaps { background-repeat: round; /* background-image is repeated and squished or stretched to fill the space (no gaps) */ } section[data-type="container"] .bgfill-repeat-x { background-position: top; background-repeat: repeat-x; } section[data-type="container"] .bgfill-repeat-y { background-position: top; background-repeat: repeat-y; } /* sin escalar */ section[data-type="container"] .bgfill-original-center-center, .bgfill-original-left-top, .bgfill-original-left-center, .bgfill-original-left-bottom, .bgfill-original-right-top, .bgfill-original-left-center, .bgfill-original-right-bottom, .bgfill-original-center-top, .bgfill-original-center-bottom { background-size: initial; /* original size */ background-repeat: no-repeat; } section[data-type="container"] .bgfill-original-center-center { background-position: center; } section[data-type="container"] .bgfill-original-left-top { background-position: initial; } section[data-type="container"] .bgfill-original-center-top { background-position: center top; } section[data-type="container"] .bgfill-original-right-top { background-position: right top; } section[data-type="container"] .bgfill-original-left-center { background-position: left center; } section[data-type="container"] .bgfill-original-right-center { background-position: right center; } section[data-type="container"] .bgfill-original-left-bottom { background-position: left bottom; } section[data-type="container"] .bgfill-original-center-bottom { background-position: center bottom; } section[data-type="container"] .bgfill-original-right-bottom { background-position: right bottom; } /* Móvil */ /* padding mínimo a los lados */ @media (max-width: 575.98px) { /* main > section[data-type='container'] > div[class^='container'].p-0 { padding-left: 15px !important; padding-right: 15px !important; } */ /* main { padding-left: 15px !important; padding-right: 15px !important; } */ }