@charset "UTF-8";
/* CSS Document */

/*====================================================


	Table of Contents
	
		01. Generel Styles
		02 Body fonts
		03 sidebar
		04 Titulos
		05 cartas
		07 bloquetes
		08 uikit
		09 scroll page
		10 home genericos
			10.1 home cifras
		11 type efects
		12 icons svg
		13 menu
		14 core headings sizes
		15 pleased rotate
		16 mapa paises home
		30 responsive


	
	// eliminar background del uikit min

		
====================================================*/
@import "SpBuilder.css"; /* Using a string */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;700&display=swap');



:root { 
  /** azules roadis **/
	--color-primary: #1654A2 ; /** blue **/
	--color-secondary:#9fbee4 ; /** blue light **/
  
	--color-primary-dark:  #1654A2; /** blue dark **/
	--color-primary-light:#9fbee4 ; /** blue light **/
	--color-primary-alpha:rgba(3,63,135,0.8) ;
	--color-secondary-alpha:rgba(77,141,225,0.85) ;
	--color-grey-light-alpha:rgba(231,231,231,0.85) ;


	/* ----reset tema----*/

	--font-weight-heading: 200;
	--font-weight-body: 200;
	--font-size-base: 14px;
	
	--body-font: "Karla", sans-serif;
  	--font-H:"DM Sans", sans-serif;
	--heading-font:"DM Sans", sans-serif;
    --font-code: Menlo, monaco, Consolas, Lucida Console, monospace;
    --font-pre: "Courier 10 Pitch", Courier, monospace;
	--font-family-sans-serif: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    --font-family-monospace: SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;
	
}

/* ----thema oscuro ------    --font-color: #ddd;-----*/

:root .v-dark, :root .v-dark-head {
    --bg-color: #1654A2;/** blue **/
    --assistant-color: #080808;
    --theme-color: #1e87f0; /* ----li menu -----*/
	--font-color:#ffffff;
    --heading-color: #fff;
    --border-color: #ffffff14;
    --smooth-color: #f9f9f9;
    --reverse-color: #f9f9f9;
    --reverse-heading-color: #000;
}


/* ----Colors -----------*/

.background-black {background-color: black;}


.color-white , span.text-primary.white{color:#ffffff !important;}
.color-blue-light {color: var(--color-secondary)!important;}
.color-blue-dark { color: var(--color-primary-dark)!important;}
.color-bg-blue-dark { background-color: var(--color-primary-dark)!important;}
.color-bg-blue-light {background-color: var(--color-secondary)!important;}
.text-black{color:black}
.text-white{color:white}





.blue{color: var(--color-primary);} 

h1, h2, h3, h4, h5, h6 {
    color: var(--heading-color);
    font-weight: var(--font-weight-heading);
    line-height: var(--line-height-base);
    font-family: var(--font-H);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    letter-spacing: 2px;
	

    letter-spacing: 4px;
	

}
strong,b {font-weight: 600!important}
.uppercase{text-transform: uppercase}
/* ----menu -----------*/
.site-header .extend-container .main-navigation {
background-color: var(--color-primary); 
}

.site-header .extend-container .main-navigation ul.extend-container li.dsn-active, .site-header .extend-container .main-navigation ul.extend-container li:hover {
    color: var(--color-secondary);
}
html{
    flex: 1 1 auto;
    font-size: 0.9rem;!important
    font-weight: 100;!important
    line-height: 1.36363636!important;
    letter-spacing: -.2px;
}




/* Centered texts in each section
		* --------------------------------------- */
		#videoBG{
  object-fit: cover;
  width: 99.5vw;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;overflow: hidden;
}




.sm-title-block {
    letter-spacing: 2px;
    font-size: 12px;
    font-weight: 400; 
}

html {
    font-size: var(--font-size-base); 
}

.section-title {
    margin-bottom: 20px; font-size: 1.2rem/* separacion contenedor texto + linea--------------- */
}

.border-section-bottom, .section-title {
    position: relative;
    padding-bottom: 10px;/* separacion linea titulo--------------- */
}



@media only screen and (max-width: 991px){
.section-title {
    margin-bottom: 10px;
}
	}

/* ----------------------------------
02 Body fonts
------------------------------------- */



/* ----------------------------------
03 Sidebars
------------------------------------- */

body .main-root > .side-bar-full .side-box-right {
    position: relative;
    width: var(--s-box-right);
    left: var(--s-box-left);
    z-index: 2; 
}

body, .main-root {
    background-color: var(--bg-color);
    color: var(--font-color);
}

/* ----------------------------------
v-dark fondo negro
------------------------------------- */

.border-right {border-right: 1px solid rgba(255, 255, 255, 0.1)}
.border-left {border-left: 1px solid rgba(255, 255, 255, 0.1);}

/* ----------------------------------
v-light fondo blanco
------------------------------------- */
body:not(.v-dark) .main-root > .side-bar-full {}
body:not(.v-dark) .main-root > .side-bar-full > .border-right {border-right: 1px solid  rgba(0, 0, 0, 0.5);}/* ---border más right-------- */
body:not(.v-dark)  .main-root > .side-bar-full >.side-box-left >.side-men > .border-left {border-left: 1px solid rgba(0, 0, 0, 0.5);}


/* ----------------------------------
04 Titulos
------------------------------------- */
.section-title-dark {
    position: relative;
    padding-bottom: 10px;
	color:black;
}
.section-title-dark {
    margin-bottom: 10px; 
}
h1.section-title-dark  {
color:white;
}

 .section-title-dark:before {
    width: 30%;
    background: #333;
    z-index: 1;
}

.section-title-dark:after, .section-title-dark:before {
    content: "";
    position: absolute;
    height: 2px;
    bottom: 0;
    left: 0;
}

.section-title-dark:after {
    width: 100%;
    background: rgba(161,161,161,1.00);
}

.letter-stroke-dark {
    color: transparent;
    -webkit-text-stroke: 1.2px black;
}
.title-dark {
    position: relative;
    color: rgba(36,36,36,1.00);
    font-size: 62px;
    letter-spacing: 2px;
}

/* ----------------------------------
05 cartas
------------------------------------- */
.wp-caption {
    background: #f7f7f7;
    padding: 17px;
    text-align: center;
    border: 1px solid rgba(178,178,178,0.2);
    max-width: 40%;
}

div.foto-carta { background: #f7f7f7;
    padding: 17px;
    text-align: center;
    border: 1px solid rgba(178,178,178,0.2);
    max-width: 90%; }


a.sppb-btn.sppb-btn-link.sppb-btn-xs.sppb-btn-square{position: relative;
    padding: 12px 35px;
    letter-spacing: 2px;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    border: solid 1px #333;
    z-index: 2;
    cursor: pointer;color:white; background-color: grey}

a.sppb-btn.sppb-btn-link.sppb-btn-xs.sppb-btn-square:before, input[type=submit]:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    left: 6px;
    top: 6px;
    transition: all 0.3s ease;
    border: solid 1px #222;
    z-index: -1;
}
/* ------------------------------------------------------------------------------------------------------------------------------------------------------
07 blockquote
------------------------------------------------------------------------------------------------------------------------------------------------------*/
.has-pullquote{background: url(../../../images/openquote.gif) top right no-repeat;}
.has-pullquote p:first-letter {
			font-size: 39px;
			font-weight: bold;
		}

.has-pullquote:before {
	/* Reset metrics. */
	padding: 0;
	border: none;
	
	/* Content */
	content: attr(data-pullquote);
	
	/* Pull out to the right, modular scale based margins. */
	float: right;
	width: 20%;
	margin: 12px 1% 24px 10%;
	
	/* Baseline correction */
	position: relative;
	top: 5px;
	
	/* Typography (30px line-height equals 25% incremental leading) */
	font-size: 23px;
	line-height: 30px;
	
}

.pullquote-left:before {
	float: left;
	margin: 12px 31px 24px -102px;
	
	width: 251px;
}


.pullquote-adelle:before {
 color:var(--color-primary) ;
	font-weight: 100;
	top: 10px !important;
}

.pullquote-helvetica:before {
	
	font-weight: bold;
	
	top: 7px !important;
}

.pullquote-facit:before {

	font-weight: bold;
	
	top: 7px !important;
}

.wp-caption { background: #f7f7f7; padding:17px; text-align: center; border: 1px solid  rgba(178,178,178,0.2); max-width: 40%; }
.wp-caption figcaption {padding: 18px 25px 0 25px;}
.wp-caption img {width: 100%}
.wp-caption.alignnone { margin: 5px 30px 40px 0;}
.wp-caption.alignleft {margin: 5px 40px 30px 0; }
.wp-caption.alignright { margin: 5px 0 40px 30px; }
.wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; margin: 0; padding: 0 4px 5px; }

/* ----------------------------------
08 Uikit
------------------------------------- */

.uk-h1, .uk-h2, .uk-h3, .uk-h4, .uk-h5, .uk-h6, .uk-heading-2xlarge, .uk-heading-large, .uk-heading-medium, .uk-heading-small, .uk-heading-xlarge, h1, h2, h3, h4, h5, h6 {
    color: var(--heading-color);
    font-weight: var(--font-weight-heading);
    line-height: var(--line-height-base);
    font-family: var(--heading-font);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    letter-spacing: 2px;
   
}

.uk-slider-container-offset {
    margin: 0px 0px 0px 0px;
    padding: 11px 25px 39px 25px;
}
/* ------infobox spbuilder--------------------- */
.uk-heading-small {
    font-size: 1rem;
    line-height: 1.2;
}


div.Tit-carrousel-div{   color: var(--color-primary);font-size: 1.2rem;}



/* ----------------------------------
09 scroll page
------------------------------------- */

div#dsn-scrollbar{ overflow: hidden;}


/* ----------------------------------
10 Home genericos
------------------------------------- */

.cifra-col{padding: 0px 20px;}
.cifra-col img{padding: 5px 0px;}
div.ui-text.intro-text{max-width: 90%; padding-left: 3vw; padding-top: 2vw}
.intro-text , p.intro-text{font-size:1.2rem;letter-spacing: inherit; line-height: 1.2rem}
section.row-white.ui-text.intro-text.tm-content{color:black}


/* ----------------------------------
10 home cifras
------------------------------------- */
.cifras-datos-container{ padding: 0px 40px}
.cifra-col{}
.cifra-col img{width: 80%; text-align: center; margin-bottom: 10px;}
.cifra-col  h4{ font-size: 1.3rem; padding-bottom: 5px;line-height: 1.4rem;}
.cifra-col .tm-content{}


.link-custom-dark,
input[type=submit] {
  position: relative;
  padding: 12px 30px;
  letter-spacing: 2px;
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  border: solid 1px var(--border-color);
  z-index: 2;
  cursor: pointer;
}
.link-custom.border-radius,
input[type=submit].border-radius {
  border-radius: 30px;
}
.link-custom.border-radius::before,
input[type=submit].border-radius::before {
  display: none;
}
.link-custom-dark:not(.background-reverse),
input[type=submit]:not(.background-reverse) {
  color: var(--heading-color);
}
.link-custom-dark:before,
input[type=submit]:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  left: 6px;
  top: 6px;
  transition: all 0.3s ease;
  border: solid 1px var(--border-color);
  z-index: -1;
}
.link-custom-dark:hover::before,
input[type=submit]:hover::before {
  left: 0;
  top: 0;
}

/* ----------------------------------
11 type efects
------------------------------------- */

.massive , h1.title.massive {
    font-size: 7vw;
    font-weight: 900;
    letter-spacing: -0.07em;
    line-height: 1;
    text-indent: -0.039em;
    margin-bottom: 0.25em;

}

.massive , h2.title.massive {
    font-size: 6vw;
    font-weight: 900;
    letter-spacing: -0.07em;
    line-height: 1;
    text-indent: -0.039em;
    margin-bottom: 0.25em;

}

.invert .massive {
    text-shadow: 0 0 0.25em rgb(0 0 0 / 15%);
}
.Htext-shadow{ text-shadow: 0 8px rgb(0 0 0 / 5%);}

/* -----gradiente fondos claraos  background: linear-gradient(120deg
,#1c99fe 20.69%,#7644ff 50.19%,#22AA37 79.69%);----------------- */
.title-gradient {
  background: linear-gradient(120deg
,#1c99fe 20.69%,#1C99FE 50.19%,#1C99FE 79.69%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

/* ------sobre fondos oscuros 
-background: linear-gradient(120deg
,#3C98E4 20.69%,#5C99E6 50.19%,#8BB6DE 79.69%);----------------- */
.title-gradient-light {
	background: linear-gradient(120deg
,#1c99fe 20.69%,#1c99fe 50.19%,#1c99fe 79.69%);

    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}


@media only screen and (max-width: 650px){
.massive , h2.title.massive {
    font-size: 12vw;
    font-weight: 900;
    letter-spacing: -0.07em;
    line-height: 1;
    text-indent: -0.039em;
    margin-bottom: 0.25em;

}
	
	h3 {
    font-size: 1.3rem;
}
	}
/* ----------------------------------
12 icons svg
------------------------------------- */
.icon img,  .icon svg {
    width: 60px;
    fill: var(--theme-color);
}

/* ----------------------------------
13 meu
------------------------------------- */

.site-header .extend-container .main-navigation ul.extend-container li a .dsn-meta-menu {

    font-size: 11px;

}


.site-header .extend-container .main-navigation ul.extend-container > li {
    font-size: 32px;
}

@media only screen and (max-width: 991px){
.site-header .extend-container .main-navigation ul.extend-container > li {
    font-size: 22px;
}
	
	}

.site-header .container-content .title-line, .site-header .container-content p.title-line {

    font-size: 16px;

}

.site-header .container-content {
    width: 25%;
   padding-left: 3rem
}
/* ------submenu 2 nivel--------------------- */

.site-header .extend-container .main-navigation ul.extend-container > li ul li {
    font-size: 22px;
    line-height: 1;
}

/* ----------------------------------
14 core headings sizes
------------------------------------- */
.h-xl{font-size:4rem;}
.h-l{font-size:3rem;}
.h-m{font-size:2rem;}
.h-s{font-size:1rem;}
.h-xs{font-size:0.5rem;}

/* ----------------------------------
15 pleased rotate
------------------------------------- */
   /* style the elements with CSS */
    #pleaserotate-graphic{
        fill: #333;
    }

    #pleaserotate-backdrop {
        color: #333;
        background-color: #fff;
    }


/* ----------------------------------
16 mapa paises home
------------------------------------- */

#jform_params_imgpath_preview_img .point .bg {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    font-family: 'fontAwesome';
    font-size: .8em;
    line-height: 30px;
    height: 30px;
    width: 30px;
	min-height: 20px;
	min-width: 20px;
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
}

/* ----------------------------------
mapa parte publica / se pone tamaño 0 en el modulo de gestión
------------------------------------- */
.jai-map-container .point .bg {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: contain;
    font-family: 'fontAwesome';
    font-size: .8em;
    line-height: 30px;
    height: 30px;
    width: 30px;
		min-height: 20px;
	min-width: 20px;
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
}


/* ----------------------------------
30 responsive
------------------------------------- */



@media only screen and (max-width: 800px){

	.title {

    font-size: 42px;
    letter-spacing: 2px;
}
:root { 
	    --font-size-base: 16px;
	}
	}

@media only screen and (max-width: 650px){
	
	.jai-map-container .point .bg {
   display:none;
}

	
.title {

    font-size: 32px;
    letter-spacing: 2px;
}

	
	
	}