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

body{ background:#D5D9DF;}

#wrapper{background:#FFF; max-width:1024px; height:auto; margin:0 auto;}

#wrapper nav ul{
background: #d8001d; /*degradado rojo*/
background: -moz-linear-gradient(left, #d8001d 0%, #b80d2f 100%);
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#d8001d), color-stop(100%,#b80d2f));
background: -webkit-linear-gradient(left, #d8001d 0%,#b80d2f 100%);
background: -o-linear-gradient(left, #d8001d 0%,#b80d2f 100%);
background: -ms-linear-gradient(left, #d8001d 0%,#b80d2f 100%);
background: linear-gradient(to right, #d8001d 0%,#b80d2f 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d8001d', endColorstr='#b80d2f',GradientType=1 );
height:50px; width:1024px;}

#active3{ color:#BEC5CE; text-decoration:underline;}

#celExa2 article{ width:960px;}
#celExa2 p{width:550px; color:#CBCFD6; text-align:right; float:left; font-size:10px; margin-left:230px; margin-top:7px;}
#celExa2 h1{background: #002777; clear:both;
background: -moz-linear-gradient(left, #002777 0%, #2754d3 77%);
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#002777), color-stop(77%,#2754d3));
background: -webkit-linear-gradient(left, #002777 0%,#2754d3 77%);
background: -o-linear-gradient(left, #002777 0%,#2754d3 77%);
background: -ms-linear-gradient(left, #002777 0%,#2754d3 77%);
background: linear-gradient(to right, #002777 0%,#2754d3 77%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#002777', endColorstr='#2754d3',GradientType=1 );
width:365px; margin:0 auto; margin-bottom:60px; margin-top:45px;
-webkit-border-bottom-right-radius: 25px;
-webkit-border-bottom-left-radius: 25px;
-moz-border-radius-bottomright: 25px;
-moz-border-radius-bottomleft: 25px;
border-bottom-right-radius: 25px;
border-bottom-left-radius: 25px; text-transform:lowercase;
margin-left:50%;}

#celExa2 article span{ float:left; margin-bottom:35px; margin-left:5px;}

#celExa2 figure img{ margin-left:50%; margin-bottom:65px;}

#plecaWhite7{ background:#FFFFFF; width:100%; height:10px;}

#imgExaUp1{ float:left;}
#imgExaUp2{ float:right;}

#celExa3 h1{ color:#000000;
font-family: 'ubuntubold_italic'; margin:13px 0px 45px 70px; text-align:left; font-size:30px;}

#celExa3{ margin-top:15px;}

#inicioExa{float:left; margin-top:20px;}

#inicioExa img{ margin-left:-32px;}

#inicioExa p{ width:540px; margin-left:50px; margin-bottom:100px;}

#inicioExa2{width:290px; float:left; margin-left:35px;}

#inicioExa2 img, #inicioExa3 img{ margin-left:35px; margin-top:30px; margin-bottom:25px;
-webkit-transition: all 500ms ease-in-out;
-moz-transition: all 500ms ease-in-out;
-ms-transition: all 500ms ease-in-out;
-o-transition: all 500ms ease-in-out;
transition: all 500ms ease-in-out;}

#inicioExa2 img:hover,#inicioExa3 img:hover{
opacity: 0.70;
filter: alpha(opacity =70);}

#inicioExa2 p{ width:240px;}

#celExa3 #inicioExa h1{ font-size:25px; color:#0053D8; font-family: 'ubuntubold';}

#inicioExa2 h2{ font-size:23px; padding:20px 40px; font-family: 'ubuntubold'; background-color:#000000; color:#FFFFFF; text-align:right;
-webkit-border-top-left-radius: 35px;
-webkit-border-bottom-left-radius: 35px;
-moz-border-radius-topleft: 35px;
-moz-border-radius-bottomleft: 35px;
border-top-left-radius: 35px;
border-bottom-left-radius: 35px;}

#inicioExa3{width:290px; float:left; margin-left:-32px; margin-top:30px;}

#inicioExa3 h2{ font-size:23px; padding:20px 40px; font-family: 'ubuntubold'; background-color:#000000; color:#FFFFFF; text-align:left;
-webkit-border-top-right-radius: 35px;
-webkit-border-bottom-right-radius: 35px;
-moz-border-radius-topright: 35px;
-moz-border-radius-bottomright: 35px;
border-top-right-radius: 35px;
border-bottom-right-radius: 35px;
}

#inicioExa3 p{ width:210px; margin-left:40px; margin-bottom:100px;}

/*Contacto*/

#inicioExa4 div { border: 1px solid #c7cdd4; width:270px; float:left;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
-webkit-box-shadow: 2px 2px 2px 0px rgba(150, 161, 175, 1);
-moz-box-shadow:    2px 2px 2px 0px rgba(150, 161, 175, 1);
box-shadow:         2px 2px 2px 0px rgba(150, 161, 175, 1);
background: #ffffff;
background: -moz-linear-gradient(top, #ffffff 12%, #c8ced5 100%);
background: -webkit-linear-gradient(top, #ffffff 12%,#c8ced5 100%);
background: linear-gradient(to bottom, #ffffff 12%,#c8ced5 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#c8ced5',GradientType=0 );
margin-left:150px; margin-top:32px; padding:50px 80px 50px 65px; 
	}

#inicioExa4 p{ font-size:15px; font-family: 'ubuntubold_italic';}
#inicioExa4 h1{ color:#fc0017; margin-left:150px; float:left;}
#inicioExa4 p b{color:#fc0017;}

#inicioExa5 { float:left; margin-left:150px; margin-top:30px; margin-bottom:100px;}

#inicioExa5 p b{ color:#0053d8; font-family: 'ubuntubold_italic'; font-size:14px;}


/*elementos para boletines
*/
#celExa4 h1{ color:#0053D8; font-size:30px; font-family: 'ubuntubold'; text-align:left; margin-left:80px; margin-top:50px;}

#celExa4 h2{font-size:24px; width:180px; padding:20px 40px 20px 80px; font-family: 'ubuntubold'; background-color:#000000; color:#FFFFFF; text-align:left;
-webkit-border-top-right-radius: 35px;
-webkit-border-bottom-right-radius: 35px;
-moz-border-radius-topright: 35px;
-moz-border-radius-bottomright: 35px;
border-top-right-radius: 35px;
border-bottom-right-radius: 35px;
margin-top:50px;}
   
#celExa4 b{font-family: 'ubuntubold'; font-size:18px;}


#celExa4 p{ width:180px; margin-left:80px; color:#0053d8; }

#celExa4 span{ font-family: 'ubuntuitalic'; color:#000000;}

#celExa4 article, #celExa4 #boletines figure { float:left;}

#celExa4 article:first-child{ margin-left:-32px;}

#celExa4 #boletines { width:62%; margin-left:30px; margin-bottom:35px; margin-top:32px;}

#celExa4 #boletines img{ margin-left:15px; margin-top:20px;
-webkit-transition: all 500ms ease-in-out;
-moz-transition: all 500ms ease-in-out;
-ms-transition: all 500ms ease-in-out;
-o-transition: all 500ms ease-in-out;
transition: all 500ms ease-in-out; width:100%; height:auto;
}

.bNew{opacity: 0.60;
filter: alpha(opacity =60);}

#celExa4 #boletines img:hover{opacity: 1;
filter: alpha(opacity =100);}

#celExa5{ background: url(../imgs/beneficiosbg.jpg) no-repeat top center; margin-top:32px;}
#celExa6{ background: url(../imgs/beneficios2bg.jpg) no-repeat top center; margin-top:32px;}
#celExa8{ background: url(../imgs/beneficios3bg.jpg) no-repeat top center; margin-top:32px;}
#beneficios2 h1{font-family: 'ubuntubold_italic'; font-size:28px; color:#fc0017; text-align:left; margin-top:32px; margin-left:70px;}

#celExa5 h1, #celExa6 h1, #celExa8 h1{font-family: 'ubuntubold'; font-size:28px;}

#celExa5 p, #celExa6 p, #celExa8 p{ color:#cbd0d7; font-size:14px; text-align:center; padding-bottom:110px;}

#celExa5 p b, #celExa6 p b{font-family: 'ubuntubold_italic'; font-size:21px; color:#FFFFFF;}

#celExa8 p b{font-family: 'ubuntubold_italic'; font-size:18px; color:#FFFFFF; text-align:center;}

#beneficios{ margin:0 auto; margin-top:50px; width:88%;}

#beneficios figure{ display:inline-table;}

#beneficios figure img{ float:left; margin:15px;}

#celExa7 figure img{ max-width:1024px; width:100%; }

#beneficios4{ margin:0 auto; margin-top:50px; width:100%;}

#beneficios4 figure{ display:inline-table;}

#beneficios4 figure img{ float:left; margin:15px;}

#bgLuna{ width:100%;
	background: #e4e7eb;
background: -moz-linear-gradient(left, #e4e7eb 1%, #ffffff 35%, #ffffff 49%, #ffffff 65%, #e4e7eb 99%);
background: -webkit-linear-gradient(left, #e4e7eb 1%,#ffffff 35%,#ffffff 49%,#ffffff 65%,#e4e7eb 99%);
background: linear-gradient(to right, #e4e7eb 1%,#ffffff 35%,#ffffff 49%,#ffffff 65%,#e4e7eb 99%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e4e7eb', endColorstr='#e4e7eb',GradientType=1 );
margin:0 auto; text-align:center; padding:45px 0px;}

.lunaLogos img{-webkit-filter:none; filter: none;
-webkit-transition: all 400ms ease-in-out;
-moz-transition: all 400ms ease-in-out;
-ms-transition: all 400ms ease-in-out;
-o-transition: all 400ms ease-in-out;
transition: all 400ms ease-in-out;}

.lunaLogos img:hover{filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 10+, Firefox on Android */ 
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */ filter: grayscale(100%);}

#Beneficios3 a{ width:75%; display:block; text-align:center; margin:0 auto;}

/*Imagenes de boletines*/

#beneficios5{ margin:0 auto; margin-top:50px; width:100%;}

#beneficios5 figure{ display:inline-block; width:30%; height:auto; float:left; margin:15px;}

#beneficios5 figure img{ width:100%; height:auto;
-webkit-transition: all 350ms ease-in-out;
-moz-transition: all 350ms ease-in-out;
-ms-transition: all 350ms ease-in-out;
-o-transition: all 350ms ease-in-out;
transition: all 350ms ease-in-out;}

#beneficios5 figure img:hover{
-moz-transform: scale(1.1) translateY(-15px);
-webkit-transform: scale(1.1) translateY(-15px);
-o-transform: scale(1.1) translateY(-15px);
-ms-transform: scale(1.1) translateY(-15px);
transform: scale(1.1) translateY(-15px);}

/*INICIO DE RESPONSIVE DESIGN*/

@media (min-width: 1199px) {
	body{overflow-x: hidden;}
	}

@media (max-width: 1015px) {
	}
	
	@media (max-width: 900px) {
		#beneficios{ margin:5%; margin-top:50px; width:100%;}
		#beneficios figure{ display:inline-block table;}
		#beneficios figure img{ width:65%; height:auto;}
		
		#beneficios4{ margin:5%; margin-top:50px; width:100%;}
		#beneficios4 figure{ display:inline-block table;}
		#beneficios4 figure img{ width:65%; height:auto;}
		
		#beneficios5{ margin:0 auto; margin-top:50px; width:100%;}
		#beneficios5 figure{ display:inline-block; width:45%; height:auto; float:left; margin:15px;}
		#beneficios5 figure img{ width:100%; height:auto;}
		
		#celExa2 article{ width:100%;}
#celExa2 p{width:80%; text-align:left; float:left; font-size:10px; margin-left:100px; margin-top:7px;}
#celExa2 h1{width:100%; margin:0 auto; margin-bottom:60px; margin-top:45px;
margin-left:0;}

#celExa2 article span{ float:none; margin-bottom:25px; margin-left:5px;}
#celExa2 figure img{ margin-left:0%; margin-bottom:65px;}
		
		}

@media (max-width: 650px) {
	#beneficios{ margin:0 auto; width:70%; }
	#beneficios figure{ display:inline;}
	#beneficios figure img{ width:80%; height:auto;}
	
	#beneficios4{ margin:0 auto; width:80%;}
	#beneficios4 figure{ display: inline;}
	#beneficios4 figure img{ width:80%; height:auto;}
	
	#beneficios5{ margin:0 auto; margin-top:50px; width:100%;}

	#beneficios5 figure{ display:inline-block; width:90%; height:auto; float:left; margin:15px;}

	#beneficios5 figure img{ width:100%; height:auto;}
	
	#Beneficios3 a{ width:80%; display: inline-block; text-align:center; margin:0 auto;}

	
}
/* FONTIN */

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

/* FRAY */

@font-face {
    font-family: 'fray_gabriel_negritabold';
    src: url('fonts/fray/fray_gabriel_negrita-webfont.eot');
    src: url('fonts/fray/fray_gabriel_negrita-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/fray/fray_gabriel_negrita-webfont.woff2') format('woff2'),
         url('fonts/fray/fray_gabriel_negrita-webfont.woff') format('woff'),
         url('fonts/fray/fray_gabriel_negrita-webfont.ttf') format('truetype'),
         url('fonts/fray/fray_gabriel_negrita-webfont.svg#fray_gabriel_negritabold') format('svg');
    font-weight: normal;
    font-style: normal; text-transform:lowercase;
}

/* UBUNTU */

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

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

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

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