
/*******************************
    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;
    -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, .5);
    --navy-blue:#0061a1;
    --light-blue: #0097D6;
    --light-blue-transparency: rgba(0, 151, 214, .4);
    --light-gray: #eee;
    --medium-gray: #ccc;
    --gray: #666;
 
}

/*******************************
    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
/*******************************/

h1, h2 {
    color: var(--navy-blue);
    font-family: 'notesesabold';
}

h1, h1.h1-artes-elements {
    border-bottom: 1px solid var(--medium-gray);
    font-size: 32px;
    line-height: 34px;
    margin-bottom: 20px;
    padding-bottom: 10px;
}

h2, h2.h2-artes-elements {
    font-family: 'notesesareg';
    font-size: 22px;
    padding: 20px 0;
    
}

h2.page-h2 {
    font-size: 22px;
    line-height: 24px;
}

h2.page-h2 a {
    font-size: 22px;
    line-height: 24px;
    font-family: 'notesesabold';
}

h2.h2-enlace-bloque {
    font-size: 18px;
    line-height: 22px;
    font-family: 'notesesabold';
    padding-bottom: 10px;
}

h2.h2-cabecera {
    background-color: var(--navy-blue);
    color: #fff;
    font-size: 27px;
    line-height: 30px;
    font-family: 'notesesabold';
    padding: 20px;
}

h3 {
    font-size: 16px;
    font-family: 'notesesabold';
    line-height: 20px;
}

p {
    color: #000;
    font-size: 14px;
    font-family: Verdana, arial;
    line-height: 25px;
}

a {
    text-decoration: none;
}

/* Forms elements */
input[type="submit"] {
    /* content: '\f35a'; */
    border-radius: 0;
    background-color: #fff;
    border: 1px solid var(--navy-blue);
    color: var(--navy-blue);
    font-family: 'notesesabold';
}

/* List */

ul li {
    list-style: none;
}

/* General classes */
.container {
    max-width: 1170px;
    width: 100%;
    padding-bottom: 30px;
    z-index: 0;
}

.dark-blue {
    background-color: var(--dark-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: #fff;
}    

blockquote {
    padding: 10px 20px;
    margin: 0 0 20px;
    font-size: 17.5px;
    border-left: 5px solid #eeeeee;
}
blockquote p {
    font-size: 17.5px;
}

