
/*******************************
    TIPOGRAFÍAS
/*******************************/

@font-face {
    font-family: 'notesesabold';
    src: url('../webfonts/notesesabol-webfont.eot');
    src: url('../webfonts/notesesabol-webfont.eot?#iefix') format('embedded-opentype'),
         url('../webfonts/notesesabol-webfont.woff2') format('woff2'),
         url('../webfonts/notesesabol-webfont.woff') format('woff'),
         url('../webfonts/notesesabol-webfont.ttf') format('truetype'),
         url('../webfonts/notesesabol-webfont.svg#webfontregular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-smooth: auto;
    text-rendering: optimizeLegibility ;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;


}

@font-face {
    font-family: 'notesesareg';
    src: url('../webfonts/notesesareg-webfont.eot');
    src: url('../webfonts/notesesareg-webfont.eot?#iefix') format('embedded-opentype'),
         url('../webfonts/notesesareg-webfont.woff2') format('woff2'),
         url('../webfonts/notesesareg-webfont.woff') format('woff'),
         url('../webfonts/notesesareg-webfont.ttf') format('truetype'),
         url('../webfonts/notesesareg-webfont.svg#webfontregular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-smooth: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

}
/*
@font-face {
    font-family: 'fontawesome';
    src: url('../webfonts/fontawesome-webfont.eot');
    src: url('../webfonts/fontawesome-webfont.eot?#iefix') format('embedded-opentype'),
         url('../webfonts/fontawesome-webfont.woff2') format('woff2'),
         url('../webfonts/fontawesome-webfont.woff') format('woff'),
         url('../webfonts/fontawesome-webfont.ttf') format('truetype'),
         url('../webfonts/fontawesome-webfont.svg#webfontregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
*/

/*******************************
    VARIABLES COLORS
/*******************************/

:root {
    --dark-blue: #013146;
    --dark-blue-transparency: rgba(1, 49, 70, .7);
    --navy-blue:#0061a1;
    --light-blue: #0097D6;
    --light-blue-transparency: rgba(0, 151, 214, .4);
    --light-gray: #eee;
    --medium-gray: #ccc;
    --gray: #666;
 
}
:root {
  --background-blue: #001F2C;
  --background-blue-alpha: rgba(0, 31, 44, 0.6);
  --background-footer: #023145;
  --whiteLight: rgba(255,255,255,1);
  --white: rgba(255,255,255,0.8);
  --whiteTag: rgba(255,255,255,0.55);
  --aquamarine: #00ae9d;
  --aquamarine-alpha: rgba(25, 217, 208, 0.28);
  --subtitle: rgba(25, 217, 208, 0.66);
  --linkhover: rgba(25, 217, 208, 0.33);
  --linkhover-alpha: rgba(25, 217, 208, 0.05);
}

/*******************************
    DISPLAY
/*******************************/

.dib {
    display: inline-block;
}

.dif {
    display: inline-flex;
}

.db {
    display: block;
}

/*******************************
    ANCHOS PERSONALIZADOS
/*******************************/

.w100 {
    width: 100%;
}

.w80 {
    width: 80%;
}

/*.w70 {
    width: 70%;
}*/

.w60 {
    width: 60%;
}

.w50 {
    width: 50%;
}

.w40 {
    width: 40%;
}

.w33 {
    width: 33.333%;
}

.w30 {
    width: 30%;
}

.w20 {
    width: 20%;
}

.w10 {
    width: 10%;
}

.w0 {
    width: 0;
}

/*******************************
    POSITIONS
/*******************************/

.pa {
    position: absolute;
}

.pr {
    position: relative;
}

.pf {
    position: fixed;
}

/*******************************
    TEXT ALIGNS
/*******************************/

.tal {
    text-align: left;
}

.tac {
    text-align: center;
}

.tar {
    text-align: right;
}

/*******************************
    VISIBILIDAD
/*******************************/

.hidden {
    display: none;
}

.show-dib {
    display: inline-block;
}

.show-db {
    display: block;
}

/*******************************
    FLOATS
/*******************************/

.fl {
    float: left;
}

.fr {
    float: right;
}

/*******************************
    GENERAL TAGGS
/*******************************/

p {
    color: var(--white);
    line-height: 1.65;
    font-size: 1.125rem; 
    font-size: 1.125rem;
}
h1, h2 {
    color: var(--whiteLight);
    font-family: 'notesesabold';
}
.node--unpublished {
    background-color: var(--linkhover);
}
.node--unpublished:before {
    content: 'UNPUBLISH CONTENT';
    font-weight: bold;
    padding: 1rem;
    display: block;
    background: #ff9700;
    color: var(--whiteLight);
    border-bottom: 4px solid var(--background-blue);
}

#main-content h1 {
/*    font-size: 2.875rem;
    line-height: 1.3;*/
    font-family: 'notesesareg';
    font-size: 2.375rem;
    line-height: 1.25;
    margin: 1rem auto 1rem;
    text-transform: uppercase;
    color: var(--whiteLight);
}
#main-content h1.newsandevents {
    text-transform: initial;
    margin: 0rem 0 1rem;
}
#main-content h1.node-news, 
#main-content h1.node-events {
    text-transform: initial;
    font-size: 2.375rem;
}

h1 .full-project-name {
    font-size: 1.6rem;
    text-transform: capitalize;
    color: var(--white);
    font-family: 'notesesareg';
    display: block;
}
#main-content h2 {
    font-family: 'notesesareg';
    font-size:2rem;
    line-height: 1.45;
    margin: 1.6rem 0 1rem;
    text-transform: uppercase;
}
.region-sidebar-second h2, 
h2.sidebar-second {
    font-family: 'notesesareg' !important;
    font-size: 1.75rem !important;
    margin: 0;
    padding: 0.6rem 0;
    color: var(--whiteLight);
    text-transform: uppercase;
}
#main-content h2:first-child {
    margin: 1rem 0 1rem;
}
#main-content h2 strong {
    font-weight: normal;
}
#main-content h2.container {
    margin: 1.6rem auto 0.8rem;
}
.path-frontpage #main-content h2 {
    text-transform: uppercase;
}
#main-content .node-body h2, 
#main-content .node__content h2{
/*    text-transform: capitalize;*/
}
#main-content .node-body h2::first-letter, 
#main-content .node__content h2::first-letter{
    text-transform: uppercase;
}
#main-content .node__content h2.related-content,  
#main-content .arteselements h2.related-content {
    text-transform: uppercase;
}
.arteselements .node-related_content {
    margin: 4rem 0 2rem;
}
.view-id-news_and_events .views-field-created, 
.view-id-news_and_events .views-field-changed {
    text-align: right;
    color: var(--whiteTag);  
}
#main-content h2.title-news-events, 
#main-content h2.node-projects {
    font-size: 1.75rem;
    font-weight: 300;
    font-family: 'notesesareg';
    padding: 0;
    margin: 0 0 0.8rem 0;
    text-transform: uppercase;
}
#main-content h2.title-news-events a, 
#main-content h2.node-projects a {
    text-decoration: none;
    color: var(--aquamarine);
}
#main-content h2.title-news-events a:hover, 
#main-content h2.node-projects a:hover {
    color: var(--whiteLight);
    transition: 0.5s;
}
#main-content h2.lower {
    text-transform: lowercase !important;
}
#main-content h2.lower::first-letter,  {
    text-transform: uppercase !important;
}


#main-content h3 {
    font-family: 'notesesareg';
    font-size: 2rem;
    line-height: 1.2;
    text-transform: initial;
    font-weight: normal;
}
#main-content h4 {
    font-family: 'notesesareg';
    font-size: 1.75rem;
    line-height: 1.2;
    text-transform: initial;
    color: var(--whiteLight);
}
#main-content h5 {
    font-family: 'notesesareg';
    font-size: 1.375rem;
    line-height: 1.2;
    text-transform: initial;
    color: var(--whiteLight);
}
#main-content h6 {
    font-family: 'Arial';
    font-weight: bold;
    font-size: 1.125rem;
    line-height: 1.2;
    text-transform: initial;
    color: var(--whiteLight);
}
.centered {
    text-align: center;
}



.field--name-field-subtitle {
    margin: 0 0 1.6rem 0;
}
.figure {
    margin: 0 0 1.6rem;
}
.line{
  color: var(--whiteLight);
  background: var(--aquamarine);
  font-family: 'notesesabold';
  font-size: 18px;
  font-style: normal;
  line-height: 100%;
  text-transform: uppercase;
  opacity: 1 !important;
  padding: 6px 12px;
  margin: 0 0 6px 0 !important;
  clear: both;
  display: inline-block;
}

a {
    text-decoration: none;
    transition: 0.5s;
    color: var(--aquamarine);
}
a:hover {
    color: var(--whiteLight);
    text-decoration: none;
}
a:hover *{
    color: var(--whiteLight);
    fill: var(--whiteLight) !important;
    stroke: var(--whiteLight) !important;
}

main a {
    text-decoration: underline;
}

figure.caption.caption-img br {
    display: none;
}
figure.caption.caption-img > figcaption {
    background: none repeat scroll 0 0 #002635;
    font-size: 12px;
    padding: 0.3rem 0.8rem 0.5rem;
    margin-top: 0px;
    font-family: Arial;
    line-height: 1.2rem;
    color: var(--whiteTag);    
}


/* Forms elements */
main input[type="submit"] {
    border-radius: 16px;
    border: 1px solid var(--aquamarine);
    background: var(--aquamarine); 
    background-color: rgba(25, 217, 208, 0.28);
    color: var(--white);
    font-family: "notesesabold";
    letter-spacing: 0.05rem;
    text-transform: uppercase;
    font-size: 1rem;
    padding: 0.8rem 1.1rem;
    margin: 16px 0;
    width: auto;
    min-width: 250px;
}
main input[type="submit"]:focus, 
main input[type="submit"]:focus-visible, 
main input[type="submit"]:active {
    background-color: var(--aquamarine) !important; 
    border: 1px solid var(--aquamarine) !important;
}
.webform-button--submit {
    border-radius: 16px !important;
    border: 1px solid var(--aquamarine) !important;
    background: var(--aquamarine) !important; 
    background-color: rgba(25, 217, 208, 0.28) !important;
    color: var(--white) !important;
    font-family: "notesesabold" !important;
    letter-spacing: 0.05rem !important;
    text-transform: uppercase !important;
    font-size: 1rem !important;
    padding: 0.8rem 1.1rem !important;
    margin: 16px 0 !important;
    width: auto !important;
    min-width: 250px !important;
}
.simple-button-plugin {
    border-radius: 16px !important;
    border: 1px solid var(--aquamarine) !important;
    background: var(--aquamarine) !important; 
    background-color: rgba(25, 217, 208, 0.28) !important;
    color: var(--white) !important;
    font-family: "notesesabold" !important;
    letter-spacing: 0.05rem !important;
    text-transform: uppercase !important;
    font-size: 1rem !important;
    padding: 0.8rem 1.1rem !important;
    margin: 16px 0 !important;
    width: auto !important;
    min-width: 250px;    
}
.webform-button--submit:hover, 
.simple-button-plugin:hover,  
main input[type="submit"]:hover {
  background: var(--aquamarine) !important;
  text-decoration: none !important;
}
select, 
.form-control {
    padding: 0.3rem 1rem;
    border: 1px solid var(--linkhover);
    background: transparent;
    color: var(--w);
    border-radius: 0;
    box-shadow: none;
    transition: border-color ease-in-out 0.15s;
}

/* List */

ul li {
    list-style: none;
}

/* General classes */
.main-container {
    padding:2rem 0;
}
.event--content ul li {
    list-style-type:disc;
}
.front-container {
    padding:0;
}
.container {
    max-width: 1170px;
    width: 100%;
/*    padding-bottom: 30px;*/
    z-index: 0;
}

.dark-blue {
    background-color: var(--background-blue);
}

.dark-blue h1, 
.dark-blue h2, 
.dark-blue h3,
.dark-blue h4,
.dark-blue h5,
.dark-blue h6,
.dark-blue p,
.h2-white {
    color: var(--whiteLight);
}    

.ckeditor-accordion-container {

}
.ckeditor-accordion-container > dl {
    border: 1px solid var(--linkhover) !important;
}
.ckeditor-accordion-container > dl dt > a {
    background-color: var(--aquamarine)!important;
    border-bottom: 1px solid var(--aquamarine) !important;
}
.ckeditor-accordion-container > dl dt > a:hover {
    background-color: var(--linkhover) !important;
}
.ckeditor-accordion-container > dl dt.active > a {
    background-color: var(--linkhover) !important;
}
.ckeditor-accordion-container > dl dd {
    padding: 2rem 1rem 1rem !important;
}


a[href$=".pdf"] {
  padding: 0;
  background: none;
  margin: 0 0 1rem 0;
}
a[href$=".pdf"]:before {
    content: "\f1c1";
    display: inline-block;
    font: normal normal normal 20px/1 FontAwesome;
    font-size: 2rem;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    margin-right: 0.6rem;
}
a[href$=".docx"], 
a[href$=".doc"] {
  padding: 0;
  background: none;
  margin: 0 0 1rem 0;
}
a[href$=".docx"]:before, 
a[href$=".doc"]:before {
    content: "\f1c2";
    display: inline-block;
    font: normal normal normal 20px/1 FontAwesome;
    font-size: 2rem;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    margin-right: 0.6rem;
}
a[href$=".xlsx"], 
a[href$=".xls"] {
  padding: 0;
  background: none;
  margin: 0 0 1rem 0;
}
a[href$=".xlsx"]:before, 
a[href$=".xls"]:before {
    content: "\f1c3";
    display: inline-block;
    font: normal normal normal 20px/1 FontAwesome;
    font-size: 2rem;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    margin-right: 0.6rem;
}
a[href$=".pptx"], 
a[href$=".ppt"] {
  padding: 0;
  background: none;
  margin: 0 0 1rem 0;
}
a[href$=".pptx"]:before, 
a[href$=".ppt"]:before {
    content:"\f1c4";
    display: inline-block;
    font: normal normal normal 20px/1 FontAwesome;
    font-size: 2rem;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    margin-right: 0.6rem;
}
a[href$=".jpg"], 
a[href$=".png"] {
  padding: 0;
  background: none;
  margin: 0 0 1rem 0;
}
a[href$=".jpg"]:before, 
a[href$=".png"]:before {
    content: "\f1c5";
    display: inline-block;
    font: normal normal normal 20px/1 FontAwesome;
    font-size: 2rem;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    margin-right: 0.6rem;
}
a[href$=".txt"] {
  padding: 0;
  background: none;
  margin: 0 0 1rem 0;
}
a[href$=".txt"]:before  {
    content: "\f15c";
    display: inline-block;
    font: normal normal normal 20px/1 FontAwesome;
    font-size: 2rem;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    margin-right: 0.6rem;
}