:root{
    --color-primary: #0d1c3f;
    --color-tei-primary: #0d1c3f;
    --color-tei-secondary: #0064c0;
}

body{
    font-family: 'Nunito', sans-serif;
    font-size: 14px;
    font-weight: 400;
}
a{
    color: var(--color-tei-secondary);
}
.content-editable *:not(strong){
    font-size: 16px;
    line-height: 20px;
    color: #334155;
}
.content-editable a{
    color: var(--color-tei-secondary);
}
.content-editable:not(.not-spacing) p{
    margin-bottom: 20px;
}
.content-editable img{
    max-width: 100%;
    max-height: 300px;
    object-fit: contain;
}
.content-editable ul{
    list-style: disc;
    padding-left: 40px;
}
.content-editable ol{
    list-style: decimal;
    padding-left: 40px;
}
.content-editable:not(.not-spacing) ul,
.content-editable:not(.not-spacing) ol{
    margin-bottom: 20px;
}
.content-editable:not(.not-spacing) ul li:not(:last-child),
.content-editable:not(.not-spacing) ol li:not(:last-child){
    margin-bottom: 10px;
}
.content-editable h1{
    font-size: 1.875rem; /* 30px */
    line-height: 2.25rem; /* 36px */
}
.content-editable h2{
    font-size: 1.5rem; /* 24px */
    line-height: 2rem; /* 32px */
}
.content-editable h3,
.content-editable h4,
.content-editable h5,
.content-editable h6{
    font-size: 1.25rem; /* 20px */
    line-height: 1.75rem; /* 28px */
}
.content-editable h1,
.content-editable h2,
.content-editable h3,
.content-editable h4,
.content-editable h5,
.content-editable h6{
    color: #0F172A;
    font-weight: 500;
    margin-bottom: 20px;
}
.content-editable table{
    font-size: .875rem;
    line-height: 1.25rem;
    border-collapse: collapse;
    width: 100%;
    text-indent: 0;
    border-color: inherit;
}
.content-editable table thead th{
    color: #334155;
    font-weight: bold;
    text-align: left;
    padding: 12px 16px;
    border: 1px solid #e5e7eb;
}
.content-editable table tbody td{
    color: #334155;
    text-align: left;
    padding: 12px 16px;
    border: 1px solid #e5e7eb;
}
.hover\:bg-tei-secondary:hover{
    background-color: rgba(0, 100, 192, 0.14);
}
.hover\:border-tei-secondary:hover{
    border-color: var(--color-tei-secondary);
}
.hover\:text-tei-secondary:hover{
    color: var(--color-tei-secondary);
}
.border-primary{
    border-color: var(--color-primary);
}
.disabled,
:disabled{
    opacity: .6;
    pointer-events: none;
}
.min-w-5{
    min-width: 1.25rem;
}
.min-h-5{
    min-height: 1.25rem;
}
/* Transparencia - diseño 1 */
/* --------------------------------------------------------------------- */
#transparency-design-1 header{
    min-height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: url("/img/transparency/banner.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
}
#transparency-design-1 header::after{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-color: var(--color-primary);
    opacity: .5;
}
#transparency-design-1 header > div{
    position: relative;
    z-index: 2;
}
#transparency-design-1 header form{
    margin-top: 45px;
}
#transparency-design-1 header form .input-group{
    width: 500px;
    max-width: 100%;
    position: relative;
    margin: auto;
}
#transparency-design-1 header form input{
    width: 100%;
    padding: 15px 64px 15px 20px;
    border-radius: 24px;
    border: none;
}
#transparency-design-1 header form button{
    position: absolute;
    right: 0;
    top: 0;
    border-top-right-radius: 24px;
    border-bottom-right-radius: 24px;
    padding: 15px 20px;
    transition: .3s all;
}
#transparency-design-1 header form button:hover{
    background-color: rgba(0,0,0,.1);
}
#transparency-design-1 section .container{
    padding: 32px 24px;
    margin-left: auto;
    margin-right: auto;
}
#transparency-design-1 #pages-grid a{
    width: 100%;
    display: block;
    border: 1px solid var(--color-primary);
    font-size: 18px;
    line-height: 24px;
    padding: 25px;
    text-align: center;
    font-weight: 500;
    transition: .2s all;
    color: var(--color-primary);
    border-radius: 8px;
}
#transparency-design-1 #pages-grid a:hover{
    background-color: var(--color-primary);
    color: white;
}
#transparency-design-1 #copyright > .container{
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 10px 24px;
}
#transparency-design-1 #copyright a{
    font-weight: 500;
}
@media only screen and (max-width: 500px){
    #transparency-design-1 header form .input-group{
        width: 100%;
    }
}

/* Página - diseño 1 */
/* --------------------------------------------------------------------- */
#page-design-1 header{
    min-height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: url("/img/transparency/banner.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
}
#page-design-1 header::after{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-color: var(--color-primary);
    opacity: .5;
}
#page-design-1 header > div{
    position: relative;
    z-index: 2;
}
#page-design-1 header .link{
    background-color: white;
    border-radius: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 250px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 15px 20px;
    margin-top: 45px;
    font-size: 18px;
    line-height: 24px;
    color: #0F172A;
}
#page-design-1 header .link > svg{
    margin-right: 5px;
}
#page-design-1 section .container{
    padding: 32px 24px;
    margin-left: auto;
    margin-right: auto;
}
#page-design-1 #copyright > .container{
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 10px 24px;
}
#page-design-1 #copyright a{
    font-weight: 500;
}
/* Transparencia - diseño 2 */
/* --------------------------------------------------------------------- */
#transparency-design-2{
    min-height: 100vh;
}
#transparency-design-2 header{
    min-height: 350px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background-color: var(--color-primary);
}
#transparency-design-2 section .container{
    padding: 60px 24px;
    margin-left: auto;
    margin-right: auto;
}
#transparency-design-2 .cube{
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    height: 100%;
}
#transparency-design-2 .cube::after{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background-color: var(--color-primary);
    opacity: .04
}
#transparency-design-2 .cube h4,
#transparency-design-2 .cube a{
    position: relative;
    z-index: 2;
}
#transparency-design-2 .cube .link{
    background-color: transparent;
    transition: .2s all;
    color: var(--color-primary);
    font-weight: 600;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
#transparency-design-2 #copyright > .container{
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 10px 24px;
}
#transparency-design-2 #copyright a{
    font-weight: 500;
}
/* Página - diseño 2 */
/* --------------------------------------------------------------------- */
#page-design-2{
    min-height: 100vh;
}
#page-design-2 header{
    min-height: 350px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background-color: var(--color-primary);
}
#page-design-2 header .link{
    background-color: white;
    border-radius: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 250px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 15px 20px;
    margin-top: 45px;
    font-size: 18px;
    line-height: 24px;
    color: #0F172A;
}
#page-design-2 header .link > svg{
    margin-right: 5px;
}
#page-design-2 section > .container{
    padding: 60px 24px;
    margin-left: auto;
    margin-right: auto;
}
#page-design-2 #copyright > .container{
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 10px 24px;
}
#page-design-2 #copyright a{
    font-weight: 500;
}
/* Transparencia - diseño 3 */
/* --------------------------------------------------------------------- */
#transparency-design-3{
    min-height: 100vh;
}
#transparency-design-3 header{
    min-height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background-color: var(--color-primary);
}
#transparency-design-3 section .container{
    padding: 60px 24px;
    margin-left: auto;
    margin-right: auto;
}
#transparency-design-3 .description{
    background-image: url("/img/transparency/banner.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
#transparency-design-3 .description .overlay{
    background-color: rgba(213, 225, 230, 0.6);

}
#transparency-design-3 .cube{
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 244px;
}
#transparency-design-3 .cube::after{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background-color: var(--color-primary);
    opacity: .04
}
#transparency-design-3 .cube h4,
#transparency-design-3 .cube a{
    position: relative;
    z-index: 2;
}
#transparency-design-3 .cube .link{
    background-color: transparent;
    transition: .2s all;
    color: var(--color-primary);
    font-weight: 600;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
#transparency-design-3 .cube:hover{
    background-color: var(--color-primary);
    transition: ease-in 0.1s;
    color: white;
}
#transparency-design-3 .cube:hover h4,
#transparency-design-3 .cube:hover a,
#transparency-design-3 .cube:hover span,
#transparency-design-3 .cube:hover svg{
    color: white;
}
#transparency-design-3 .cube svg{
    color: var(--color-primary);
}
#transparency-design-3 #copyright > .container{
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 10px 24px;
}
#transparency-design-3 #copyright a{
    font-weight: 500;
}
/* Página - diseño 3 */
/* --------------------------------------------------------------------- */
#page-design-3{
    min-height: 100vh;
}
#page-design-3 header{
    min-height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background-color: var(--color-primary);
}
#btnflotante .link{
    border-radius: 24px 0 0 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 250px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 10px 20px;
    font-size: 18px;
    line-height: 24px;
    color: white;
    background-color: var(--color-primary);
}
#btnflotante .link > svg{
    margin-right: 5px;
}
#page-design-3 section > .container{
    padding: 60px 24px;
    margin-left: auto;
    margin-right: auto;
}
#page-design-3 #copyright > .container{
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 10px 24px;
}
#page-design-3 #copyright a{
    font-weight: 500;
}
#btnflotante{
    position: fixed;
    right: 0;
    bottom: 20%;
    width: 100px;
}
/* Transparencia - diseño 4 */
/* --------------------------------------------------------------------- */
#transparency-design-4{
    min-height: 100vh;
    height: 100%;
    background-color: var(--color-primary);
}
#transparency-design-4 .main-container{
    width: 100%;
    height: auto;
    max-width: 3840px;
    margin: 0 auto;
}
#transparency-design-4 header,
#transparency-design-4 .overlay {
    min-height: 100vh;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
}
#transparency-design-4 header{
    background-image: url("/img/transparency/banner.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
#transparency-design-4 .overlay{
    background-color: rgba(0,0,0,.8);
    width: 100%;
    height: 100%;
}

#transparency-design-4 section .container{
    padding: 60px 24px;
    margin-left: auto;
    margin-right: auto;
}
#transparency-design-4 .description{
    /*background-color: var(--color-primary);*/
}
#transparency-design-4 .cube{
    position: relative;
    display: flex;
    /*flex-direction: column;*/
    align-items: center;
    justify-content: space-between;
    min-height: 93px;
    border: 1px solid transparent;
}
#transparency-design-4 .cube::after{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background-color: var(--color-primary);
    opacity: .04
}

#transparency-design-4 .cube h4,
#transparency-design-4 .cube a{
    position: relative;
    z-index: 2;
}
#transparency-design-4 .cube .link{
    background-color: transparent;
    transition: .2s all;
    color: var(--color-primary);
    font-weight: 600;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
#transparency-design-4 .cube:hover{
    background-color: var(--color-primary);
    transition: ease-in 0.1s;
    color: white;
    border: white 1px solid;
}


#transparency-design-4 .cube:hover h4,
#transparency-design-4 .cube:hover a,
#transparency-design-4 .cube:hover span,
#transparency-design-4 .cube:hover svg{
    color: white;
}
#transparency-design-4 .cube svg{
    color: var(--color-primary);
}
#transparency-design-4 footer{
    /*background: var(--color-tei-primary);*/
    background: white;
    position: absolute;
    bottom: 0;
    width: 100%;
}
#transparency-design-4 #copyright > .container{
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 10px 24px;
    /*color: white;*/
}
#transparency-design-4 #copyright a{
    font-weight: 500;

}
/* Página - diseño 4 */
/* --------------------------------------------------------------------- */
#page-design-4{
    min-height: 100vh;
    height: 100%;
    background-color: var(--color-primary);
}
#page-design-4 .main-container{
    width: 100%;
    height: auto;
    max-width: 3840px;
    margin: 0 auto;
}
#page-design-4 header,
#page-design-4 .overlay {
    min-height: 100vh;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
}

#page-design-4 header{
    background-image: url("/img/transparency/banner.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
#page-design-4 .overlay{
    background-color: rgba(0,0,0,.8);
    width: 100%;
    height: 100%;
}

#page-design-4 section .container{
    padding: 60px 24px;
    margin-left: auto;
    margin-right: auto;
}
#page-design-4 .description{
    /*background-color: var(--color-primary);*/
}
#page-design-4 .cube{
    position: relative;
    display: flex;
    /*flex-direction: column;*/
    align-items: center;
    justify-content: space-between;
    min-height: 93px;
    border: 1px solid transparent;
}
#page-design-4 .cube::after{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background-color: var(--color-primary);
    opacity: .04
}

#page-design-4 .cube h4,
#page-design-4 .cube a{
    position: relative;
    z-index: 2;
}
#page-design-4 .cube .link{
    background-color: transparent;
    transition: .2s all;
    color: var(--color-primary);
    font-weight: 600;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
#page-design-4 .cube:hover{
    background-color: var(--color-primary);
    transition: ease-in 0.1s;
    color: white;
    border: white 1px solid;
}


#page-design-4 .cube:hover h4,
#page-design-4 .cube:hover a,
#page-design-4 .cube:hover span,
#page-design-4 .cube:hover svg{
    color: white;
}
#page-design-4 .cube svg{
    color: var(--color-primary);
}
#page-design-4 footer{
    /*background: var(--color-tei-primary);*/
    background: white;
    position: absolute;
    bottom: 0;
    width: 100%;
}
#page-design-4 #copyright > .container{
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding: 10px 24px;
    /*color: white;*/
}
#page-design-4 #copyright a{
    font-weight: 500;
}

#page-design-4 > #btnflotante .link{
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 250px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 10px 20px;
    font-size: 18px;
    line-height: 24px;
    color: white;
    background-color: rgba(0,0,0,0.8);
}


/* Welcome */
/* --------------------------------------------------------------------- */
#welcome #information{
    background: rgb(13,28,63);
    background: linear-gradient(0deg, rgba(13,28,63,1) 0%, rgba(9,52,106,1) 33%, rgba(4,76,149,1) 66%, rgba(0,100,192,1) 100%);
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}
#welcome #information{
    position: fixed;
    top: 0;
    left: 0;
    width: 33.333%;
}
#welcome #information svg{
    width: 350px;
}
#welcome #information .link{
    padding: 10px 20px;
    border-radius: 24px;
    color: var(--color-tei-primary);
    background-color: white;
    display: inline-block;
    margin-top: 20px;
    font-weight: bold;
    font-size: 16px;
    line-height: 22px;
}
#welcome #content{
    min-height: 100vh;
    padding: 16px;
}
#welcome #content header img{
    height: 70px;
}
#welcome #content #form{
    display: flex;
    width: 992px;
    margin: 150px auto 0 auto;
}
#welcome #content #form label:not(.label-file){
    font-weight: bold;
    color: var(--color-primary);
    font-size: 14px;
    line-height: 18px;
    display: block;
    margin-bottom: 6px;
}
#welcome #content #form input,
#welcome #content #form select,
#welcome #content #form textarea{
    background-color: #fff;
    border: 1px solid rgb(203, 213, 225);
    border-radius: 4px;
    font-size: 14px;
    padding: 8px 12px;
    width: 100%;
    transition: box-shadow .3s, color .3s, border-color .3s;
}
#welcome #content #form input:focus,
#welcome #content #form select:focus,
#welcome #content #form textarea:focus{
    border-color: rgba(0, 100, 192, 1);
    box-shadow: 0 0 0 4px rgba(0, 100, 192, 0.2);
}

#welcome #content #form .button-primary{
    border-radius: 24px;
    line-height: 20px;
    font-size: 14px;
    background: var(--color-tei-secondary);
    padding: 10px 16px;
    color: white;
    font-weight: bold;
    transition: .2s all;
}
#welcome #content #form .button-primary:hover{
    background-color: #00529D;
}
#welcome #content #form .button-primary:focus{
    background-color: var(--color-tei-primary);
}
#welcome #content .ql-container{
    height: auto;
    border: 1px solid rgb(203, 213, 225);
}
#welcome #content .ql-toolbar.ql-snow{
    border: 1px solid rgb(203, 213, 225);
    border-bottom: 0;
}
#welcome #content .ql-editor{
    height: 200px;
}
#welcome .business-select input:checked + span + span{
    border-color: var(--color-tei-secondary);
}
/* Quill */
/* --------------------------------------------------------------------- */
.ql-toolbar.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before{
    content: 'Título 1';
}
.ql-toolbar.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before{
    content: 'Título 2';
}
.ql-toolbar.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before{
    content: 'Título 3';
}
.ql-toolbar.ql-snow .ql-picker.ql-header .ql-picker-item::before{
    content: 'Texto';
}
.ql-container.ql-snow .ql-tooltip.ql-editing input[type="text"]{
    width: auto !important;
}
.ql-container.ql-snow .ql-tooltip[data-mode="link"]::before {
    content: "Introduce enlace:";
}
.ql-container.ql-snow .ql-tooltip.ql-editing a.ql-action::after {
    content: 'Guardar';
}
.ql-container.ql-snow .ql-tooltip a.ql-action::after {
    content: 'Editar';
}
.ql-container.ql-snow .ql-tooltip a.ql-remove::before {
    content: 'Quitar';
}
@media only screen and (max-width: 572px){
    #welcome #information,
    #welcome #content{
        min-height: auto;
    }
}
/* Políticas */
/* --------------------------------------------------------------------- */
.policies section .container,
.policies footer .container{
    padding: 32px 24px;
    margin-left: auto;
    margin-right: auto;
}
