html, body {font-family: 'FuturaLT', sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 15px; }
.container { width: 1043px; padding: 0; position: relative; }

h2 { color: white; background: #212121; font-size: 25px; line-height: 43px; padding: 0 14px; display: inline-block;  }
.display-table { display: table; height: 100%; width: 100%; }
.display-cell { display: table-cell; vertical-align: middle; height: 100%;}
#back-to-top { display: block; position: fixed; bottom: 20px; right: 20px; width: 40px; height: 40px; background: url(../img/flechamenu.png); background-size: 100%; background-repeat: no-repeat; background-position: center center; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); opacity: 0.7; }
a.anchor{display: block; position: relative; visibility: hidden; top: -100px;}
a.glosario-anchor{display: block; position: relative; visibility: hidden; top: -20px;}

/**
* Cookies
*/
	.cookies { background:#e0e0e0; text-align:center; color:#767676; padding:11px 20px; font-size:15px;}
	.cookies p { display: inline-block; margin-bottom: 0; }
	.cookies p .info { display: inline-block; vertical-align: middle; width: 18px; height: 18px; -webkit-border-radius: 50%; border-radius: 50%; line-height: 18px; font-size: 14px; color: black; margin-right: 26px; border: black 1px solid; background: transparent;}
	.cookies p a.mas { color: #3e7800; display: inline-block; margin-left: 9px; }
	.cookies p a.ok { background: #3e7800; color: white; height: 35px; display: inline-block; vertical-align: middle; line-height: 35px; margin-left: 13px; padding: 0 7px; -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s;}
	.cookies p a.ok:hover {text-decoration: none; background: #2e5702; }


/**
* Header
*/
	header { background: #212121; position: fixed;  top: 0; left: 0; width: 100%; z-index: 25; transition: all 0.5s;}
	header .menu { list-style-type: none; padding: 0; margin: 0; height: 100%; }
	header .menu li { margin: 0; padding: 0; float: left; margin-right: 35px; }
	header .menu li a { color:white; height:74px; display: inline-block; position: relative; transition: all 0.5s; line-height: 80px; }
	header .menu li a span { display: inline-block; width: 14px; height: 8px; background: url(../img/flechamenu.png) no-repeat; background-size: 100%; position: relative;top:0; -webkit-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; }

	header .menu li a:hover,
	header .menu li a:active,
	header .menu li a:focus { text-decoration: none; color: #3e7800; }

	header .menu li a:after { content: ' '; display: block; position: absolute; bottom: 0; left: 0; height: 6px; background: #3e7800; width: 100%; opacity: 0; -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; }
	header .menu li a.active:after,
	header .menu li a:hover:after { opacity: 1; }
	header .menu li a:hover span { top: 2px; }

	header .logo { display: block; float: right; margin-top: 10px; position: relative; left: 8px; }
	header .logo img.normal {display: inline; width: 96px; }
	header .logo img.smaller {display: none; }

	header .submenu { background: rgba(255,255,255,0.9); position: absolute; top: 100%; -webkit-transform: scale(0.8); -ms-transform: scale(0.8); -o-transform: scale(0.8); transform: scale(0.8); -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; -o-transform-origin: 0 0; transform-origin: 0 0; -webkit-transition: -webkit-transform 0.5s; -o-transition: -o-transform 0.5s; transition: transform 0.5s; }
	header .submenu.active { -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1);  }

	header .submenu ul { list-style-type: none; padding: 0; }
	header .submenu ul li { margin-bottom: 10px; }
	header .submenu ul li a {color: #3e7800;font-weight: lighter; transition: all 0.5s ;}
	header .submenu ul li a:focus,
	header .submenu ul li a:active,
	header .submenu ul li a:hover { text-decoration: none; color: #212121; }
	header .submenu ul li a:before { content: ' '; display: inline-block; width: 14px; height: 8px; background: url(../img/flechamenu.png) no-repeat; background-size: 100%; position: relative;top:0; -webkit-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; -webkit-transform:rotate(-90deg); -ms-transform:rotate(-90deg); -o-transform:rotate(-90deg); transform:rotate(-90deg); margin-right:10px; position: relative; left: 0;  }
	header .submenu ul li a:hover:before { left: 2px; }


	header .submenu-ue { left: 210px; height: 350px; width: 60%; padding-top: 36px; padding-left: 36px;  }
	header .submenu-ue ul { float: left;  }
	header .submenu-es ue.left { margin-right: 22px; }
	header .submenu-anteriores { left: 810px; height: 350px; width: 554px; padding-top: 36px; padding-left: 36px;  }
	header .submenu-es { width: 100%; height: 400px; padding-top: 42px; padding-left: 40px;  }
	header .submenu-es ul { float: left;  }
	header .submenu-es ul.left { margin-right: 22px; }

	header.smaller {  }
	header.smaller .menu li a { height: 50px; line-height: 54px; }
	header.smaller .logo { margin-top: 5px; }
	header.smaller .logo img.normal { display: none; }
	header.smaller .logo img.smaller {display: block; width: auto; height: 42px; }

/**
* Hero
*/
	.hero { background: url(../img/hero.jpg) no-repeat bottom center; height: 497px; text-align: center; padding-top: 90px; background-attachment: fixed; background-size: cover; margin-top: 20px;}

	.hero img { margin-bottom: 40px;}
	.hero p { color: #FFFFFF; font-size: 42px; font-weight: bold;}



/**
* Que es
*/
	#que-es { background: #3e7800; height: 557px; padding-top: 32px; }
	#que-es .wrapper { width: 1043px; margin: 0 auto; }

	.carousel {width: 100%; margin: 0 auto; height: 433px; }

	.carousel .carousel-control.left { background:  url(../img/prev.png) no-repeat 97% 117px; filter: none;
		transition: all 0.2s;
		-webkit-transition: all 0.2s;
		-moz-transition: all 0.2s;
		-o-transition: all 0.2s;
		-ms-transition: all 0.2s;
		width: 130px;
	}
	.carousel .carousel-control.right { background: url(../img/next.png) no-repeat 24% 117px; filter: none;
		transition: all 0.2s;
		-webkit-transition: all 0.2s;
		-moz-transition: all 0.2s;
		-o-transition: all 0.2s;
		-ms-transition: all 0.2s;
		width: 130px;
	}
	.carousel .carousel-control.left:hover { }
	.carousel .carousel-control.right:hover { }
	.carousel .carousel-control.left .glyphicon,
	.carousel .carousel-control.right .glyphicon { display: none; }
	.carousel .carousel-caption { font-size: 30px; bottom: auto; top:26%; text-shadow: none; padding: 0; line-height: 33px; }
	.carousel .carousel-caption h3 { font-size: 55px;text-transform: uppercase; margin: 0 auto; line-height: 56px; margin-bottom: 8px; margin-top: 0; text-transform: uppercase; }
	.carousel .carousel-caption p { margin:0; }
	.carousel .carousel-caption a { color: white; text-decoration: underline;}
	.carousel .carousel-indicators { bottom: 16px;}
	.carousel .carousel-indicators li { width: 20px; height: 20px; margin: 0 3px; -webkit-border-radius: 50%; border-radius: 50%; background: #fff; -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s;}
	.carousel .carousel-indicators li.active { border: 0 none; background-color: #212121;}

	.carousel-inner { height: 100%; }
	.carousel .item { height: 100%; color: white; padding-left: 466px; padding-top: 77px;  }
	.carousel .item .imagen { position: absolute; top: 64px; left: 140px; width: 300px;  }
	.carousel .item h3 { font-weight: bold; margin-bottom: 23px; font-family: 'DINCondensed-Bold', sans-serif; font-size: 30px; margin-top: 0;  }
	.carousel .item p { width: 400px; line-height: 24px; font-size: 15px;  }

	.carousel .item.derechoasilo .imagen { width: 253px; left: 164px;}
	.carousel .item.convencionginebra .imagen { width: 301px; top: 76px; left: 141px;}
	.carousel .item.nodevolucion .imagen { top: 65px; width: 253px; left: 168px;}
	.carousel .item.personasrefugiadas .imagen { width: 217px; left: 194px; top: 59px;}
	.carousel .item.mundo .imagen { width: 185px; left: 222px; top: 63px;}
	.carousel .item.espana .imagen { width: 320px; left: 120px; top: 67px;}

/**
* Cifras españa
*/
	#cifras-espana { text-align: center; padding-top: 85px;}
	#cifras-espana h2 { margin-bottom: 54px;}
	#cifras-espana p.intro { margin: 0 auto; width: 60%; color: #000000; margin-bottom: 87px;}


/**
* Cifras UE
*/
	#cifras-ue { text-align: center; padding-top: 75px; background: #f0f0f0; }
	#cifras-ue h2 { margin-bottom: 61px;}
	#cifras-ue p.intro { margin: 0 auto; width: 90%; color: #000000; margin-bottom: 87px;}


/**
* Infografia
*/
	.infografia { margin-bottom: 65px;}
	.infografia h3 { margin-top: 0; font-family: 'DINCondensed-Bold', sans-serif; font-size: 22px; text-transform: uppercase; margin-bottom: 32px; }
	.infografia h3:before { content: ' '; background: url(../img/parentesis-open.png); display: inline-block;width:10px; height: 31px; vertical-align: middle; margin-right: 6px; position: relative; top: -2px; }
	.infografia h3:after { content: ' '; background: url(../img/parentesis-close.png); display: inline-block;width:10px; height: 31px; margin-left: 6px; vertical-align: middle; position: relative; top: -2px;}
	.infografia .wrapper { padding-left: 50px; }
	.infografia .imagen { width: 831px; height: 545px; display: block;  border: #eeeeee 1px solid; float: left; margin-bottom: 22px; background: url(../img/ajax-loader.gif) no-repeat center center;}
	.infografia .opciones { float: left; width: 160px; text-align: left; padding-left: 15px;}
	.infografia .opciones a { display: block; font-weight: lighter; color: #535353; height: 46px; outline: 0 none; position: relative; padding-left: 57px; margin-bottom: 10px; transition: all 0.5s; }
	.infografia .opciones a:hover { font-weight: normal; color: #3e7800; }
	.infografia .opciones a:before { content: ' '; width: 46px; height: 46px; display: block; background-color: #535353; background-position: center center; background-size: 50%; background-repeat: no-repeat; -webkit-border-radius: 50%; border-radius: 50%; position: absolute; top: 0; left: 0; -webkit-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s;}
	.infografia .opciones a:hover:before { background-size: 60%; background-color: #3e7800;}
	
	.infografia .opciones a.ampliar:before {background-image: url(../img/lupa.png); }
	.infografia .opciones a.descargar:before {background-image: url(../img/descargar.png); }
	.infografia .opciones a.twitter:before {background-image: url(../img/twitter_icon.png); }
	.infografia .opciones a.facebook:before {background-image: url(../img/facebook_icon.png); }

	.infografia .opciones a.twitter,
	.infografia .opciones a.facebook {color: #3e7800; }

	.infografia .opciones a.twitter:hover,
	.infografia .opciones a.facebook:hover {color: #535353; }

	.infografia .opciones a.twitter:before,
	.infografia .opciones a.facebook:before {background-color: #3e7800; }

	.infografia .opciones a.twitter:hover:before,
	.infografia .opciones a.facebook:hover:before {background-color: #535353; }

	.infografia .help { text-align: left; color: #3e7800; display: block; text-decoration: none; margin-bottom: 8px; transition: all 0.5s;}
	.infografia .help:hover { color: #535353;}
	.infografia .help:before { content: ' '; width: 22px; height: 22px; display: inline-block; background: url(../img/info.png) left center no-repeat; background-size: 100%; vertical-align: middle; margin-right: 13px;}


/**
* Glosario
*/
	#glosario { background: #313131; text-align: center; padding-top: 22px; color: white; padding-bottom: 120px; }
	#glosario h2 { background: black; margin-bottom: 51px; }
	#glosario p.intro { color: white; margin-bottom: 80px;}
	#glosario dl { text-align: left; margin-bottom: 36px; position: relative;}
	#glosario dl[data-letra] { margin-top: 85px; }
	#glosario dl[data-letra]:before { content: attr(data-letra); font-family: 'DINCondensed-Bold', sans-serif; position: absolute; display: block; font-size: 121px; top: -26px; left: 41px;  }
	#glosario dl:after { content: ' '; display: block; clear: both; }
	#glosario dl dt { float: left; width: 27.6%; text-align: right; line-height: 27px; font-family: 'DINCondensed-Bold', sans-serif;display: inline-block; text-transform: uppercase; font-size: 27px; }
	#glosario dl dt span{ background: #a4b83f;  padding-top: 8px; padding-right: 5px; display: inline-block; padding-left: 10px;  }
	#glosario dl dt.fw-122 span{ width:122px;  }
	#glosario dl dd { width: 72%; padding-left: 46px; display: inline-block;}

/**
* Footer
*/
	footer { color: white; background: black; text-align: center; padding-top: 60px;}
	footer img.logo { width: 263px; margin-bottom: 25px; }
	footer p.intro { width: 70%; margin: 0 auto; line-height: 24px; margin-bottom: 50px; }
	footer a.visita { display: inline-block; background: white; padding: 18px 61px; text-transform: uppercase; color: black; font-size: 18px; margin-bottom: 124px; -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; }
	footer a.visita:focus,
	footer a.visita:active,
	footer a.visita:hover { text-decoration: none; }
	footer a.visita:hover { background: #535353; color: white; }

	footer .legal { font-size: 16px; margin-bottom: 9px; }
	footer .credits { font-size: 16px; color: #878787; margin-bottom: 61px; }
	footer .con-el-apoyo { margin-bottom: 26px; }

	footer .apoyos { margin-bottom: 38px;}
	footer .apoyos img { height: 52px; margin: 0 16px;}


/* overlay at start */
	.mfp-fade.mfp-bg {
	  opacity: 0;
	  -webkit-transition: all 0.5s ease-out;
	       -o-transition: all 0.5s ease-out;
	          transition: all 0.5s ease-out;
	}
	/* overlay animate in */
	.mfp-fade.mfp-bg.mfp-ready {
	  opacity: 0.8;
	}
	/* overlay animate out */
	.mfp-fade.mfp-bg.mfp-removing {
	  opacity: 0;
	}

	/* content at start */
	.mfp-fade.mfp-wrap .mfp-content {
	  opacity: 0;
	  -webkit-transition: all 0.5s ease-out;
	       -o-transition: all 0.5s ease-out;
	          transition: all 0.5s ease-out;
	}
	/* content animate it */
	.mfp-fade.mfp-wrap.mfp-ready .mfp-content {
	  opacity: 1;
	}
	/* content animate out */
	.mfp-fade.mfp-wrap.mfp-removing .mfp-content {
	  opacity: 0;
	}