@charset "utf-8";
/* CSS Document */

html, body{margin:0; padding:0; width:100%; height:100%; font-family: open-sans, sans-serif; color:#000000;}

.orange{color:#f58220;}
.red{color:#ed1c24;}
.red-femsa{color: #810430;}
.blue-femsa{color:#305364;}
.green{color: #8daa37 !important;}
.purple{color: #764c76;}
.white{color: #ffffff;}
.gray2{color: #939598;}
.black{color:#000000;}
.blue2{color: #00aeef;}
.green2{color: #41ad49 !important;}
.gray3{color: #6d6e71;}
.blue{color: #25408f;}
.aqua{color:#3dbbd4;}
.blue3{color: #4e85c5;}

.bg-orange{background-color: #f58220;}
.bg-red{background-color: #ed1c24;}
.bg-blue{background-color: #25408f;}
.bg-green{background-color: #8daa37;}
.bg-purple{background-color: #764c76;}
.bg-white{background-color: #ffffff;}
.bg-gray{background-color: #d1d3d4;}
.bg-red-femsa{background-color: #810430;}
.bg-gray2{background-color: #939598;}
.bg-blue2{background-color: #00aeef;}
.bg-green2{background-color: #41ad49 !important;}
.bg-aqua{background-color:#3dbbd4;}

.bg-orange-soc{background-color: #ffefe1;}
.bg-green-soc{background-color:#eef0e3;}
.bg-purple-soc{background-color:#e8e2e7;}

.fo-light{font-weight: 300 !important;}
.fo-regular{font-weight: 400 !important;}
.fo-semibold{font-weight: 600 !important;}
.fo-bold{font-weight: 700 !important;}
.fo-talic{font-family: open-sans, sans-serif;
font-style: normal;
font-weight: 300; }

.fp-bold{font-weight: 700 !important;}

.program{font-family: program, sans-serif;}

.f10{font-size: 10px !important;}
.f12{font-size: 12px !important;}
.f13{font-size: 13px !important;}
.f14{font-size: 14px !important;}
.f15{font-size: 15px !important;}
.f16{font-size: 16px !important;}
.f20{font-size: 20px !important;}
.f22{font-size: 22px !important;}
.f28{font-size: 28px !important;}
.f32{font-size: 32px !important;}
.f38{font-size: 38px !important;}

.italic{font-style: italic;}
.uppercase{text-transform: uppercase;}
.versalitas{font-variant: small-caps;}


.txt{padding: 0 30px;}
.txt-left{padding-left:30px;}
.txt15{padding: 0 15px;}
.txt-right{padding-right:30px;}

.container{max-width: 1140px; margin:0 auto;}

.p10{ width: 10%; float: left;}
.p15{ width: 15%; float: left;}
.p21{ width: 21%; float: left;}
.p20{ width: 20%; float: left;}
.p25{ width: 25%; float: left;}
.p30{ width: 30%; float: left;}
.p33{ width: 33.3%; float: left;}
.p35{ width: 35%; float: left;}
.p40{ width: 40%; float: left;}
.p45{ width: 45%; float: left;}
.p48{ width: 48%; float: left;}
.p50{ width: 50%; float: left;}
.p55{ width: 55%; float: left;}
.p57{ width: 57%; float: left;}
.p60{ width: 60%; float: left;}
.p65{ width: 65%; float: left;}
.p70{ width: 70%; float: left;}
.p75{ width: 75%; float: left;}
.p80{ width: 80%; float: left;}
.p79{ width: 79%; float: left;}
.p85{ width: 85%; float: left;}
.p90{ width: 90%; float: left;}

.overflow{overflow: auto;}
.overflow-table{overflow: auto;}

.clear{clear:both;}

.button-red{background-color: #810430;  font-family: open-sans, sans-serif; font-weight: 500;  color: #ffffff; padding:12px 24px; cursor: pointer; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;	transition: all 0.3s ease-out; -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);}
.button-red:hover{background-color: #305364; text-decoration: none; color: #ffffff;}

.button-green{background-color: #305364;  font-family: open-sans, sans-serif; font-weight: 500;  color: #ffffff; padding:12px 24px; cursor: pointer; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;	transition: all 0.3s ease-out; -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);}
.button-green:hover{background-color: #810430; text-decoration: none; color: #ffffff;}

.button-white{background-color: #ffffff;  font-family: open-sans, sans-serif; font-weight: 500;  color: #305364; padding:12px 24px; cursor: pointer; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out;	transition: all 0.3s ease-out; -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);
box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.3);}
.button-white:hover{background-color: #810430; text-decoration: none; color: #ffffff;}


.square{width:8px; height: 8px; display: inline-block; margin-bottom: 1px;}
.circle{text-align: center; border-radius: 50%; -moz-border-radius:  50%; -webkit-border-radius:  50%; width: 8px; height: 8px; display: block; margin-top: 3px;}

header{z-index: 60; position: fixed; height: 60px; top:0; width: 100%; -webkit-box-shadow: 0px 1px 4px 0px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 1px 4px 0px rgba(0,0,0,0.2);
box-shadow: 0px 1px 4px 0px rgba(0,0,0,0.2);   background-color: #ffffff;}

header .menu-btn{width: 24%; float: left; height: 100%; position: relative; background-color: #810430;}
header .menu-btn #toggle {z-index: 20; display: block; width: 37px; height: 20px; position: absolute; right: 30px; top:30px;}
header .menu-btn #toggle span:after,
header .menu-btn #toggle span:before {content: ""; position: absolute; right: 0; top: -8px;}
header .menu-btn #toggle span:after{top: 8px;}
header .menu-btn #toggle span {position: relative; display: block;}
header .menu-btn #toggle span,
header .menu-btn #toggle span:after{width: 100%; height: 1.5px; background:#939598; transition: all 0.3s; backface-visibility: hidden; border-radius: 0px;}
header .menu-btn #toggle span:before {width: 100%; height: 1.5px; background:#939598; transition: all 0.3s; backface-visibility: hidden; border-radius: 0px;}
/* on activation */
header .menu-btn #toggle.on span {background: transparent;}
header .menu-btn #toggle.on span:before {transform: rotate(45deg) translate(7px, 5px); width: 100%; height: 2px;}
header .menu-btn #toggle.on span:after {transform: rotate(-45deg) translate(6px, -5px); width: 100%; height: 2px;}


header .logo{ height:60px; line-height: 56px; float: left;}
header .logo img{ height:21px; margin: 1px 30px 0;}
header .annual{ height:30px; line-height: 30px; font-size: 14px; font-weight: 500; color: #4d4d4d;}
header .annual .txt{text-align: right;}
header .annual .txt span{text-align: right; color: #810430; font-weight: 600;}


header .menu-redes{width:33.3%; float: right; height: 60px;}
header .menu-redes ul{margin:0; padding:0; list-style: none; height: 30px; padding-right: 20px;}
header .menu-redes ul li{float:right; width:10%; text-align:center; display: table;}
header .menu-redes ul li a{font-weight:500; font-size:12px; display: table-cell; vertical-align: middle; text-decoration: none; color: #810430; -webkit-transition: all 0.3s ease-out;
  	-moz-transition: all 0.3s ease-out;
  	-o-transition: all 0.3s ease-out;
  	transition: all 0.3s ease-out;}
header .menu-redes ul li a:hover{color: #305364;}

/* menu appearance*/
header #menu {text-transform: uppercase; opacity: 0; visibility: hidden; clear: both; z-index: 59; color: #ffffff; width: 100%; text-align: center;  /*transition: opacity .4s; */vertical-align: middle;}
header #menu ul.about{list-style: none; padding: 0; width: 12%; height: 115px; float: left; margin:0; background-color: #810430; padding-bottom: 6px;}
header #menu ul.about li{display: table; position: relative; padding: 2px 0;}
header #menu ul.about li a{display: table-cell; padding:5px 30px; text-align: left; line-height: 1;  color: #ffffff; text-decoration: none; font-size: 12px; font-weight: 300; font-family: program, sans-serif;  -webkit-transition: all 0.3s ease-out;
  	-moz-transition: all 0.3s ease-out;
  	-o-transition: all 0.3s ease-out;
  	transition: all 0.3s ease-out; width: 95px;}
header #menu ul.about li a .negrita{font-weight:500!important;}
header #menu ul.about li a:hover{color: #939598;}

header #menu ul.femsa{list-style: none; padding: 0; width: 80%; height: 121px; float: left; margin:0;}
header #menu ul.femsa li{height: 100%; float:left; width:15%; display: table; position: relative;}
header #menu ul.femsa li a{display: table-cell; padding:0 5px; text-align: center; line-height: 1; height: 40px; vertical-align: middle;  color: #ffffff; text-decoration: none; font-size: 12px; font-weight: 300; font-family: program, sans-serif; position: relative;}
header #menu ul.femsa li a .negrita{font-weight:500 !important;}
header #menu ul li a span{font-size: 12px;}

header #menu ul.femsa li .fondo{position: absolute; width: 100%; height: 100%;  -webkit-transition: all 0.3s ease-out;
  	-moz-transition: all 0.3s ease-out;
  	-o-transition: all 0.3s ease-out;
  	transition: all 0.3s ease-out;}
header #menu ul.femsa li:hover .fondo{opacity: 1;}

header #menu ul.femsa .glance{background:#4d4d4d; opacity: 0.85; }
header #menu ul.femsa .highlights{background:#939598; opacity: 0.85; }
header #menu ul.femsa .comercio{background:#f58220; opacity: 0.85; }
header #menu ul.femsa .coca{background:#ed1c24; opacity: 0.85; }
header #menu ul.femsa .businesses{background:#25408f; opacity: 0.85; }
header #menu ul.femsa .foundation{background:#3dbbd4; opacity: 0.85; }




#intro{width:100%; height: 100%; position:relative; background: url(../images2018/bg-intro.jpg) right top; background-size: cover;}
#intro2 .intro-txt{background-color: #305364; padding: 30px 0;}
#intro2 .intro-txt p{font-size: 16px; color: #ffffff;}

#intro, #intro2{display: none;}

#intro-values{padding: 30px 0; background: #98002e;}
#intro-values h2{font-size: 40px; text-align: center; font-family: program, sans-serif; font-weight: 700; color: #ffffff; text-transform: uppercase;}
#intro-values p{font-size: 18px; text-align: center; font-family: program, sans-serif; font-weight: 400; color: #ffffff;}
#intro-values .more{margin: 40px auto 0;  width: auto; display: table; font-size: 13px;}

#intro-ejes{padding: 0 0 40px 0; overflow: hidden; position: relative;}
#intro-ejes h3{text-shadow: 0px 2px 3px #000000; position: relative; line-height: 1; text-transform: uppercase; margin: 0 auto; display: block; padding: 180px 0 30px; text-align: center; font-family: program, sans-serif; font-weight: 700; color:#ffffff; font-size: 30px;}
#intro-ejes .more{margin: 40px auto 0; left: 0; right: 0;  width: 70px; text-align: center; display: table; font-size: 13px; position: absolute; bottom:70px;}
#intro-ejes .intro-comercio{position: relative; height: 400px; margin-right: 30px; overflow: hidden;}
#intro-ejes .intro-coca-cola{position: relative; height: 400px; margin:0 20px 0 10px; overflow: hidden; text-align: center;}
#intro-ejes .intro-businesses{position: relative;height: 400px; margin:0 10px 0 20px; overflow: hidden;}
#intro-ejes .intro-foundation{position: relative;height: 400px; margin-left: 30px; overflow: hidden;}

#intro-ejes .intro-comercio .bg-eje{position: absolute; height: 400px; width: 100%; background: url(../images2018/femsa-comercio.jpg) left top no-repeat; background-size:cover;  -webkit-transition: .4s ease-in-out; transition: .4s ease-in-out;}
#intro-ejes .intro-coca-cola .bg-eje{position: absolute; height: 400px; width: 100%; background: url(../images2018/coca-cola-femsa.jpg) center left no-repeat; background-size:cover;  -webkit-transition: .4s ease-in-out; transition: .4s ease-in-out;}
#intro-ejes .intro-businesses .bg-eje{position: absolute; height: 400px; width: 100%; background: url(../images2018/businesses.jpg) center top no-repeat; background-size:cover;  -webkit-transition: .4s ease-in-out; transition: .4s ease-in-out;}
#intro-ejes .intro-foundation .bg-eje{position: absolute; height: 400px; width: 100%; background: url(../images2018/foundation.jpg) center center no-repeat; background-size:cover;  -webkit-transition: .4s ease-in-out; transition: .4s ease-in-out;}

#intro-ejes .intro-comercio:hover > .bg-eje{-webkit-transform: scale(1.1); transform: scale(1.1);}
#intro-ejes .intro-coca-cola:hover > .bg-eje{-webkit-transform: scale(1.1); transform: scale(1.1);}
#intro-ejes .intro-businesses:hover > .bg-eje{-webkit-transform: scale(1.1); transform: scale(1.1);}
#intro-ejes .intro-foundation:hover > .bg-eje{-webkit-transform: scale(1.1); transform: scale(1.1);}


#fomento{display: none; background-image: url(../images2018/bg-intro-b.jpg); background-size: cover; margin-bottom: 30px; background-position: center; padding: 80px 0 60px; overflow: hidden; position: relative;}
#fomento p{font-size: 14px; color: #ffffff; font-weight: 400;}
#fomento .container{position: relative;}
#fomento .persona{position: absolute; bottom:0; height: 95%; right: 8%;}

#fomento2{background-image: url(../images2018/bg-intro-b.jpg); background-size: cover; background-position: center; padding: 80px 0 60px; overflow: hidden; position: relative;}
#fomento2 p{font-size: 14px; color: #ffffff; font-weight: 400;}
#fomento2 .container{position: relative;}
#fomento2 .persona{position: absolute; bottom:0; height: 95%; right: 8%;}


/****At a glance****/
#at-a-glance{padding: 60px 0 30px;}
#at-a-glance h1{margin-top: 40px; font-size: 50px; text-transform: uppercase; color: #810430;  font-family: program, sans-serif; font-weight: 700;}
#at-a-glance .mapa{background-color: #d1d3d4; text-align: center; padding: 30px 0; position: relative;}
#at-a-glance .mapa .map{width: 50%;}
#at-a-glance .mapa .map-names{width: 50%; position: absolute; left: 0; right:0; margin:0 auto;}
#at-a-glance .personas{position: relative; margin-top: 30%; margin-left: -30%; width: 120%;}
#at-a-glance p.highlight{font-size: 26px; font-weight: 300; margin-top: 60px;}
#at-a-glance ul{margin:0; padding-left: 100px; position: absolute; bottom: 30px; list-style-type: none; text-align: left;}
#at-a-glance ul li{ font-size: 13px;}
#at-a-glance h3 span{ font-size: 22px; font-family: program, sans-serif;}
#at-a-glance h3{ font-size: 18px; font-family: open-sans, sans-serif; margin: 30px 0 15px 70px; line-height: 1.2;}
#at-a-glance .mapa-circulos{text-align: right;}
#at-a-glance .mapa-circulos img{width:55%;}
#at-a-glance .movil{display:none;}
#at-a-glance .pc{display:block;}

#at-a-glance-table{background-color: #d1d3d4; padding: 60px 0; color: #000000;}
#at-a-glance-table tr{background-color: #d1d3d4;}
#at-a-glance-table tr th{background-color: #d1d3d4; border-bottom: 1px solid #98002e;  font-family: program, sans-serif; font-size: 13px; color: #98002e;}
#at-a-glance-table tr td{border-bottom: 1px solid #ffffff; -webkit-transition: all 0.3s ease-out;
  	-moz-transition: all 0.3s ease-out;
  	-o-transition: all 0.3s ease-out;
  	transition: all 0.3s ease-out;  font-size: 13px; text-align: center;}
#at-a-glance-table tr td.borde-right{border-right: 1px solid #ffffff;}
#at-a-glance-table tr td.bg-black{ color:#305364; font-family: program, sans-serif; font-size: 16px; font-weight: 700; text-align: center; padding: 5px 0;}
#at-a-glance-table .tr3:hover td{background-color: #98002e; color:#ffffff;}

#at-a-glance-images .highlights-glance{height: 250px; overflow: hidden;}
#at-a-glance-images .highlights-glance .txt{height: 100%; text-align: center; vertical-align: middle;}
#at-a-glance-images .highlights-glance img{width: 25%; margin-top: 30px;}
#at-a-glance-images .highlights-glance p{font-size: 16px; font-weight: 400; color: #ffffff; line-height: 1.3;}
#at-a-glance-images .highlights-glance p span{font-size: 32px; font-weight: 700;}

#at-a-glance-images .imagen1{width: 25%; float: left; height: 350px; background: url(../images2018/glance-2.jpg) left top; background-size: cover;}
#at-a-glance-images .imagen2{width: 50%; float: left; height: 350px; background: url(../images2018/glance-3.jpg) center top; background-size: cover;}
#at-a-glance-images .imagen3{width: 25%; float: left; height: 350px; background: url(../images2018/glance-4.jpg) left top; background-size: cover;}
/****At a glance****/

/******Value creation highlights******/
#highlights{padding: 100px 0; height: auto; background-image: url(../images2018/bg-highlights.jpg); background-position: center bottom; background-attachment: fixed; overflow: hidden;  background-size: cover}
#highlights h1{margin-top: 15px; font-size: 40px; text-transform: uppercase; color: #ffffff;  font-family: program, sans-serif; font-weight: 700;}

#highlights table.high-table{width: 80%;}
#highlights table.high-table tr th{font-size:14px; color:#ffffff; background-color:#98002e; padding: 0 2px 1px; text-align: right; white-space: nowrap;}
#highlights table.high-table tr td{font-size:13px; text-align: right; font-weight: 400; color:#ffffff;  border-bottom: 1px solid #ffffff; padding: 1 2px; -webkit-transition: all 0.3s ease-out;
  	-moz-transition: all 0.3s ease-out;
  	-o-transition: all 0.3s ease-out;
  	transition: all 0.3s ease-out; text-shadow: 0px 0px 2px rgba(0,0,0,0.6);}
#highlights table.high-table tr .left{text-align: left;}
#highlights table.high-table tr:hover td{background-color:#98002e;  }
#highlights .notas{margin:20px auto 0; width: 80%; padding-left: 15px;}
#highlights .notas li{font-size: 10px; color:#ffffff; line-height: 1.2; text-shadow: 0px 0px 2px rgba(0,0,0,0.6);}

#highlights .graficas-cont{width: 80%; margin: 0 auto; overflow: hidden; padding-top: 30px;}
#highlights .grafica{padding:20px 0; font-family: program, sans-serif;}
#highlights .grafica .title{color: #ffffff; text-align: center; line-height: 1.1; font-size: 14px;}
#highlights .grafica .graf{display: flex;
   justify-content: center;
   align-items: center; position: relative;}
#highlights .grafica .graf .numbers{font-size: 18px; font-weight: 700; color:#ffffff; position: absolute; vertical-align: middle;}
#highlights .grafica table td{color:#ffffff; font-size: 13px; line-height: 1.1;}
#highlights .notas-pie{width: 30%; float: right;}
#highlights .notas-pie ol{margin:0;   padding:0;	list-style:none;}
#highlights .notas-pie ol li{font-size: 10px; color:#ffffff; line-height: 1.2; text-shadow: 0px 0px 2px rgba(0,0,0,0.6);  text-indent: -0.8em;}
#highlights .notas-pie ol li:nth-child(1):before {
   content: "*";  margin-right: 0.5rem;  display: inline-block;
}
#highlights .notas-pie ol li:nth-child(2):before {
   content: "1";  margin-right: 0.5rem;  display: inline-block; 
}
#highlights .notas-pie ol li:nth-child(3):before {
   content: "2";  margin-right: 0.5rem;  display: inline-block;
}

#social-value{padding:60px 0; background-color: #ffffff;}
#social-value h1{font-size: 50px; text-transform: uppercase; color: #305364;  font-family: program, sans-serif; font-weight: 700;}
#social-value p{font-size: 14px; font-weight: 300; line-height: 1.4;}
#social-value p.highlight{font-size: 16px; font-weight: 300; text-transform: uppercase;}
#social-value .borde-left{border-left: 1px solid #ffffff;}

#social-value .cuadro{overflow: auto;}
#social-value p{margin: 12px 0 !important;}
#social-value #imagen-shape img{width: 43%; margin-top: 12px; float: left; margin-right: 15px; margin-bottom: 5px;}
#social-value #imagen-shape p{font-size: 16px;}

#social-value .table-social-value {font-size: 14px; width: 90%;}
#social-value .table-social-value th{color:#ffffff;}
#social-value .table-social-value .notas2{font-size: 12px; margin-top: 10px;}

#social-value .planta-eloica{padding-top: 60px;}
#social-value .planta-eloica img{margin-left: -60px; width: 200px !important;}
#social-value .arbol{width: 60%; margin-bottom: 15px;}

/******Value creation highlights******/


/****Shareholders*****/
#shareholders{padding: 60px 0 15px;}
#shareholders h1{margin-top: 40px; margin-bottom: 10px; font-size: 50px; text-transform: uppercase; color: #305364;  font-family: program, sans-serif; font-weight: 700; line-height: 0.8;}
#shareholders h1 span{line-height: 0.8 !important;}
#shareholders .shareholders-foto{margin-top: -90px; width: 100%;}
#shareholders .nombres{position: absolute; bottom: 0; display: block; width: 1140px; margin:0 auto; left:0; right:0;}
#shareholders .nombres p{ font-size: 14px; color: #305364; font-weight: 600;}
#shareholders .nombres p span{font-style: italic; font-weight: 300;}
#shareholders-cont .movil{display: none;}

#shareholders-cont{padding:15px 0 30px;}
#shareholders-cont p{font-size: 14px; font-weight: 300; margin: 15px 0 !important;}
#shareholders-cont p.highlight{font-size: 20px; font-weight: 400; font-family: program, sans-serif; color:#305364; margin: 15px 0;}
#shareholders-cont a{color:#215e9e; font-weight: 400; -webkit-transition: all 0.3s ease-out;
  	-moz-transition: all 0.3s ease-out;
  	-o-transition: all 0.3s ease-out;
  	transition: all 0.3s ease-out;}
#shareholders-cont a:hover{color:#305364;}
#shareholders-cont .muchacho {margin-top: 285px;}
/****Shareholders*****/

/****Identity*****/
#identity{padding: 30px 0 15px;}
#identity p, #identity ol{margin:10px 0; font-size: 14px;}
#identity h1{margin-top: 40px; margin-bottom: 10px; font-size: 50px; text-transform: uppercase; color: #810430;  font-family: program, sans-serif; font-weight: 700; line-height: 0.8;}
#identity h1 span{line-height: 0.8 !important;}
#identity .mision {position: relative; margin-top: 30px; height: auto; display: block; text-align: center; border: 2px solid #810430;}
#identity .mision  .mision-title{width: 10%; position: relative; color: #ffffff; display: table; float: left; transform-origin: center;  vertical-align: middle; text-align: center; margin: 0 auto;}
#identity .mision  .mision-title p{font-family: program, sans-serif; font-size: 35px; font-weight: 500; color:#ffffff; display:none;}
#identity .mision  .mision-title img{width: 50px; display: table-cell; margin:30px auto 0;}
#identity .mision .content{width: 90%; float: left; background-color: #ffffff; padding: 0px 0 15px;}
#identity .mision .content .title{border: 1px solid #e7e7e8;  padding: 10px 0; font-size: 18px;}
#identity .mision .content .subtitle{font-size: 16px; color: #2f5364;}

#identity .vision {position: relative; margin-top: 5px; height: auto; display: block; text-align: center;}
#identity .vision  .mision-title{width: 10%; position: relative; color: #ffffff; display: table; float: left; transform-origin: center;  vertical-align: middle; text-align: center; margin: 0 auto;}
#identity .vision  .mision-title img{width: 50px; display: table-cell; margin:10px auto 0;}
#identity .vision  .mision-title p{font-family: program, sans-serif; font-size: 35px; font-weight: 500; color:#ffffff; display:none; line-height: 1;}
#identity .vision  .mision-title p.doble{font-size: 26px; line-height: 0.9;}
#identity .vision .content{width: 90%; float: left; background-color: #ffffff; padding: 0px 0 15px;}
#identity .vision .content .subtitle{font-size: 16px; color: #2f5364;}
#identity p.highlight{font-size: 19px; font-weight: 400; color: #2f5364; line-height: 1.4; margin-top: 30px;}
/****Identity*****/

/**************FEMSA Comercio*************/
#comercio-intro{ width: 100%; min-height: 100%; background: url(../images2018/bg-comercio.jpg) no-repeat; background-size: cover; display: block; overflow: auto;}
#comercio-intro .borde-right{border-right: 1px solid #000000;}
#comercio-intro  h2{color:#ffffff; margin-top: 100px; margin-right: 5%; text-shadow: 0px 3px 4px rgba(0, 0, 0, 0.47); font-family: program, sans-serif; text-align: right; font-weight: 700; text-transform: uppercase; font-size: 50px;}

#comercio-intro .datos-intro{max-width: 650px; float: right; padding: 0px 0 30px; margin-right: 5%;}
#comercio-intro .datos-intro .cont-datos{background: #ffffff; overflow: auto; padding: 15px 0;}
#comercio-intro .datos-intro .cont-datos h3{color:#305364; font-size: 18px; margin: 15px 0; line-height: 1.3; font-family: open-sans, sans-serif;}
#comercio-intro .datos-intro .cont-datos p.highlight{font-size: 14px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#comercio-intro .datos-intro .cont-datos p.highlight span{font-size: 18px;}

#comercio-intro .datos-intro .cont-datos .square{margin-left: -15px;}

#comercio-intro .datos-intro .cont-datos p.highlight2{font-size: 18px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#comercio-intro .datos-intro .cont-datos p.highlight2 span{font-size: 60px;}

#comercio-intro .datos-intro .cont-datos p.highlight3{font-size: 14px; margin: 15px 0; font-weight: 300; line-height: 1.2; color:#6d6e71;}
#comercio-intro .datos-intro .cont-datos p.highlight3 span{font-size: 32px;}

#comercio .cont-datos-movil{background: #ffffff; overflow: auto; padding: 15px 0; display: none;}
#comercio .cont-datos-movil h3{color:#305364; font-size: 18px; margin: 15px 0; line-height: 1.3; font-family: open-sans, sans-serif;}
#comercio .cont-datos-movil p.highlight{font-size: 16px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#comercio .cont-datos-movil p.highlight span{font-size: 20px;}
#comercio .cont-datos-movil p.highlight .mover {padding-left: 15px; display: block;}

#comercio .cont-datos-movil p.highlight2{font-size: 18px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#comercio .cont-datos-movil p.highlight2 span{font-size: 60px;}

#comercio .cont-datos-movil p.highlight3{font-size: 14px; margin: 15px 0; font-weight: 300; line-height: 1.2; color:#6d6e71;}
#comercio .cont-datos-movil p.highlight3 span{font-size: 32px;}

#comercio{padding: 30px 0;}
#comercio h2{font-weight: 700; font-size: 30px; color: #f58220; margin-top: 0;}
#comercio h2 span{font-weight: 400; font-size: 16px; color: #6d6e71;}
#comercio p{font-size: 14px; font-weight: 300; margin: 15px 0;}
#comercio .cuadro{width: 100%; height: 180px; display: table;}
#comercio .cuadro .txt{width: 100%; height: 100%; display:table-cell; vertical-align: middle; line-height: 1.2;}
#comercio .cuadro2 .txt{width: 100%; height: 100%; display:table-cell; vertical-align: middle; line-height: 1.2;}

#comercio .cuadro2{width: 100%; height: 200px; display: table;}
#comercio .cuadro3{width: 100%; height: 360px; display: table;}
#comercio .cuadro4{width: 100%; height: 140px; display: table;}
#comercio .cuadro4 .txt{width: 100%; height: 100%; display:table-cell; vertical-align: middle; line-height: 1.2;}

#comercio .imagen1{background: url(../images2018/comercio-2.jpg) no-repeat center; background-size: cover; margin-top:15px;}
#comercio .imagen2{background: url(../images2018/comercio-3.jpg) no-repeat center; background-size: cover;}
#comercio .imagen3{background: url(../images2018/comercio-7.jpg) no-repeat center; background-size: cover;}
#comercio .imagen4{background: url(../images2018/comercio-10.jpg) no-repeat center; background-size: cover; }
#comercio .imagen5{background: url(../images2018/comercio-11.jpg) no-repeat center; background-size: cover;}
#comercio .imagen6{background: url(../images2018/comercio-15.jpg)no-repeat center; background-size: cover;}
#comercio .imagen7{background: url(../images2018/comercio-18.jpg) no-repeat center; background-size: cover;}
#comercio .imagen8{background: url(../images2018/comercio-19.jpg) no-repeat center; background-size: cover;}
#comercio .imagen9{background: url(../images2018/comercio-24.jpg) no-repeat center; background-size: cover;}
#comercio .imagen10{background: url(../images2018/comercio-25.jpg) no-repeat center; background-size: cover;}

#comercio .tazas{float: left; padding: 90px 0px 20px 0px;}
#comercio .mundo{float: left; padding: 0px 0px 5px 30px;}
#comercio .people-more{float: left; padding: 0px 15px 20px 0px;}
#comercio .barritas{float: left; padding: 0px 15px 0px 0px;}
#comercio .tarjeta{float: left; padding: 10px 15px 0px 0px;}
#comercio .pills{float: right; padding: 10px 15px 0px 0px;}
#comercio .portfolio{padding: 10px 15px 0px 0px;}
#comercio .gas{float: right; padding:0 70px 0 0;}
/**************FEMSA Comercio*************/



/**************COCA-COLA FEMSA *************/
#coca-intro{ width: 100%; min-height: 100%; background: url(../images2018/bg-coca.jpg) no-repeat; background-size: cover; display: block; overflow: auto;}
#coca-intro .borde-right{border-right: 1px solid #000000;}
#coca-intro .datos-intro{max-width: 650px; float: right; padding: 0 0 30px; margin-right: 5%;}
#coca-intro h2{color:#ffffff; margin-top: 100px; text-align: right; text-shadow: 0px 3px 4px rgba(0, 0, 0, 0.47); font-family: program, sans-serif; font-weight: 700; text-transform: uppercase; font-size: 50px; margin-right: 5%;}
#coca-intro .datos-intro .cont-datos{background: #ffffff; overflow: auto; padding: 15px 0;}
#coca-intro .datos-intro .cont-datos h3{color:#305364; font-size: 18px; margin: 15px 0; line-height: 1.3; font-family: open-sans, sans-serif;}
#coca-intro .datos-intro .cont-datos p.highlight{font-size: 14px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#coca-intro .datos-intro .cont-datos p.highlight span{font-size: 18px;}

#coca-intro .datos-intro .cont-datos p.highlight2{font-size: 18px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#coca-intro .datos-intro .cont-datos p.highlight2 span{font-size: 60px;}

#coca-intro .datos-intro .cont-datos p.highlight3{font-size: 16px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#coca-intro .datos-intro .cont-datos p.highlight3 span{font-size: 32px;}

#coca-intro .datos-intro .cont-datos p.highlight4{font-size: 14px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#coca-intro .datos-intro .cont-datos p.highlight4 span{font-size: 32px;}

#coca .cont-datos-movil{background: #ffffff; overflow: auto; padding: 15px 0; display: none;}
#coca .cont-datos-movil h3{color:#305364; font-size: 18px;  margin: 15px 0; line-height: 1.3; font-family: open-sans, sans-serif;}
#coca .cont-datos-movil p.highlight{font-size: 14px; margin: 0px 0 15px; font-weight: 300; line-height: 1.2; text-align: center;}
#coca .cont-datos-movil p.highlight span{font-size: 18px;}

#coca .cont-datos-movil p.highlight2{font-size: 18px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#coca .cont-datos-movil p.highlight2 span{font-size: 60px;}

#coca .cont-datos-movil p.highlight3{font-size: 16px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#coca .cont-datos-movil p.highlight3 span{font-size: 32px;}

#coca .cont-datos-movil p.highlight4{font-size: 14px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#coca .cont-datos-movil p.highlight4 span{font-size: 32px;}


#coca{padding: 30px 0;}
#coca h2{font-weight: 700; font-size: 30px; color: #ed1c24; margin-top: 0;}
#coca h2 span{font-weight: 400; font-size: 16px; color: #6d6e71;}
#coca p{font-size: 14px; font-weight: 300; margin: 15px 0; line-height: 1.5;}
#coca .cuadro{width: 100%; height: 180px; display: table;}
#coca .cuadro .txt{height: 100%; display:table-cell; vertical-align: middle; line-height: 1.2;}
#coca .cuadro2 .txt{width: 100%; height: 100%; display:table-cell; vertical-align: middle; line-height: 1.2;}
#coca .cuadro .txt2{height: 90%; display:table-cell; vertical-align: middle; line-height: 1.1;}
#coca .cuadro2 .txt2{height: 90%; display:table-cell; vertical-align: middle; line-height: 1.1;}

#coca .cuadro2{width: 100%; height: 200px; display: table;}
#coca .cuadro3{width: 100%; height: 360px; display: table;}

#coca .cuadro2 .arriba{vertical-align: top;}

#coca .imagen1{background: url(../images2018/coca-2.jpg) no-repeat center; background-size: cover; margin-top:15px;}
#coca .imagen2{background: url(../images2018/coca-5.jpg) no-repeat center; background-size: cover;}
#coca .imagen3{background: url(../images2018/coca-16.jpg) no-repeat center; background-size: cover;}
#coca .imagen4{background: url(../images2018/coca-21.jpg) no-repeat center; background-size: cover;}
#coca .imagen5{background: url(../images2018/coca-22.jpg) no-repeat center; background-size: cover;}

#coca .ades{float: left; padding: 50px 5px 20px 0px;}
#coca .carro-carga{float: left; padding: 6px 15px 5px 0px; width: 100%;}
#coca .recycle{float: right; padding: 6px 0px 0px 15px;}
#coca .telephone{float: right; padding: 0px 0px 0px 15px;}

#coca .sinazucar{text-align: center;}
#coca .sinazucar img{width: 70%; margin-top: -30px;}
#coca .monster{text-align: center;}
#coca .monster img{width: 70%; margin-top: -30px;}
#coca .kin{text-align: center;}
#coca .kin img{width: 75%; margin: -55px auto 0;}

#coca .fanta{text-align: center;}
#coca .fanta img{width: 90%; }

#coca .elices{width: 35px;}

#coca ul {list-style: none; padding-left: 15px; margin-top: 15px; margin-bottom: 15px;}
#coca ul li{font-size: 14px; color:#ed1c24; text-indent: -0.5em;}
#coca ul li span{color:#000000; font-weight: 300;}
#coca ul li::before{content: '❱'; display: inline-block; margin-right: 0.5rem;}

#coca .borde-right{border-right: 1px solid #FFFFFF;}
#coca .borde-left{border-left: 1px solid #FFFFFF;}

#coca .grafica{width: 60%; margin:0 auto;}
#coca .grafica .barra-cont {float: left; width: 30%;}
#coca .grafica .barra-cont .barra{text-align: center; overflow: hidden;}

#coca .sust-progress{border-bottom: 1px solid #7F7F7F; overflow: hidden;}

#coca .texto-movil{display: none;}
#coca .cuadro-reciclar{height: auto; padding: 0px 0 50px;}
#coca .recycle-movil{display:none;}
/**************COCA-COLA FEMSA *************/


/************** STRATEGIC BUSINESSES *************/
#business-intro{ width: 100%; min-height: 100%; background: url(../images2018/bg-business.jpg) no-repeat top right; background-size: cover; display: block; overflow: auto;}
#business-intro h2{color:#ffffff; margin-top: 100px; text-shadow: 0px 3px 4px rgba(0, 0, 0, 0.47); font-family: program, sans-serif; font-weight: 700; text-transform: uppercase; font-size: 50px; padding-left: 5%;}
#business-intro .borde-right{border-right: 1px solid #000000;}
#business-intro .datos-intro{max-width: 650px; float: left; padding: 0 0 30px; margin-left: 5%;}
#business-intro .datos-intro .cont-datos{background: #ffffff; overflow: auto; padding: 15px 0;}
#business-intro .datos-intro .cont-datos h3{color:#305364; font-size: 18px; margin: 15px 0; line-height: 1.3; font-family: open-sans, sans-serif;}

#business-intro .datos-intro .cont-datos p.highlight2{font-size: 18px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#business-intro .datos-intro .cont-datos p.highlight2 span{font-size: 60px;}

#business-intro .datos-intro .cont-datos p.highlight3{font-size: 16px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#business-intro .datos-intro .cont-datos p.highlight3 span{font-size: 32px;}


#business .cont-datos-movil{background: #ffffff; overflow: auto; padding:0 0 15px 0; display: none;}
#business .cont-datos-movil h3{color:#305364; font-size: 18px; margin: 15px 0; line-height: 1.3; font-family: open-sans, sans-serif;}

#business .cont-datos-movil p.highlight2{font-size: 18px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#business .cont-datos-movil p.highlight2 span{font-size: 60px;}

#business .cont-datos-movil p.highlight3{font-size: 16px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#business .cont-datos-movil p.highlight3 span{font-size: 32px;}

#business{padding: 30px 0;}
#business h2{font-weight: 700; font-size: 30px; color: #25408f; margin-top:0;}
#business h2 span{font-weight: 400; font-size: 16px; color: #6d6e71;}
#business p{font-size: 14px; font-weight: 300; margin: 15px 0; line-height: 1.5;}
#business .borde-right{border-right: 1px solid #FFFFFF;}
#business .borde-left{border-left: 1px solid #FFFFFF;}
#business .cuadro{width: 100%; height: 180px; display: table;}
#business .cuadro .txt{height: 100%; display:table-cell; vertical-align: middle; line-height: 1.2;}
#business .cuadro2 .txt{width: 100%; height: 100%; display:table-cell; vertical-align: middle; line-height: 1.2;}
#business .cuadro .txt2{height: 90%; display:table-cell; vertical-align: middle; line-height: 1.1;}
#business .cuadro2 .txt2{height: 90%; display:table-cell; vertical-align: middle; line-height: 1.1;}

#business .cuadro2{width: 100%; height: 200px; display: table;}
#business .cuadro3{width: 100%; height: 360px; display: table;}

#business .imagen1{background: url(../images2018/business-1.jpg) no-repeat center; background-size: cover; margin-top:15px;}
#business .imagen2{background: url(../images2018/business-2.jpg) no-repeat center; background-size: cover;}
#business .imagen3{background: url(../images2018/business-6.jpg) no-repeat center; background-size: cover;}

#business .refri{float:left; padding: 0 5px 0 0; margin-top:-80px; width: 210px;}
/************** STRATEGIC BUSINESSES *************/

/************** FEMSA FOUNDATION *************/
#foundation-intro{ width: 100%; min-height: 100%; background: url(../images2018/bg-foundation.jpg) no-repeat top right; background-size: cover; display: block; overflow: auto;}
#foundation-intro h2{color:#ffffff; margin-top: 100px; text-shadow: 0px 3px 4px rgba(0, 0, 0, 0.47); font-family: program, sans-serif; font-weight: 700; text-transform: uppercase; font-size: 50px; margin-left:5%;}
#foundation-intro .borde-right{border-right: 1px solid #000000;}
#foundation-intro .datos-intro{max-width: 650px; float: left; padding: 0 0 30px; margin-left: 5%;}
#foundation-intro .datos-intro .cont-datos{background: #ffffff; overflow: auto; padding: 15px 0;}
#foundation-intro .datos-intro .cont-datos h3{color:#305364; font-size: 18px; margin: 15px 0; line-height: 1.3; font-family: open-sans, sans-serif;}

#foundation-intro .datos-intro .cont-datos p.highlight2{font-size: 18px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#foundation-intro .datos-intro .cont-datos p.highlight2 span{font-size: 60px;}

#foundation-intro .datos-intro .cont-datos p.highlight3{font-size: 16px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#foundation-intro .datos-intro .cont-datos p.highlight3 span{font-size: 32px;}


#foundation .cont-datos-movil{background: #ffffff; overflow: auto; padding: 15px 0; display: none;}
#foundation .cont-datos-movil h3{color:#305364; font-size: 18px; margin: 15px 0; line-height: 1.3; font-family: open-sans, sans-serif;}

#foundation .cont-datos-movil p.highlight2{font-size: 18px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#foundation .cont-datos-movil p.highlight2 span{font-size: 60px;}

#foundation .cont-datos-movil p.highlight3{font-size: 16px; margin: 15px 0; font-weight: 300; line-height: 1.2;}
#foundation .cont-datos-movil p.highlight3 span{font-size: 32px;}

#foundation{padding: 30px 0;}
#foundation h2{font-weight: 700; font-size: 30px; color: #3dbbd4; margin-top: 0;}
#foundation h2 span{font-weight: 400; font-size: 16px; color: #6d6e71;}
#foundation p{font-size: 14px; font-weight: 300; margin: 15px 0; line-height: 1.5;}
#foundation .borde-right{border-right: 1px solid #FFFFFF;}
#foundation .borde-left{border-left: 1px solid #FFFFFF;}
#foundation .cuadro{width: 100%; height: 180px; display: table;}
#foundation .cuadro .txt{height: 100%; display:table-cell; vertical-align: middle; line-height: 1.2;}
#foundation .cuadro2 .txt{width: 100%; height: 100%; display:table-cell; vertical-align: middle; line-height: 1.2;}
#foundation .cuadro .txt2{height: 90%; display:table-cell; vertical-align: middle; line-height: 1.1;}
#foundation .cuadro2 .txt2{height: 90%; display:table-cell; vertical-align: middle; line-height: 1.1;}
#foundation .cuadro2{width: 100%; height: 200px; display: table;}
#foundation .cuadro3{width: 100%; height: 360px; display: table;}

#foundation .imagen1{background: url(../images2018/foundation-1.jpg) no-repeat center; background-size: cover; margin-top:15px;}
#foundation .imagen2{background: url(../images2018/foundation-3.jpg) no-repeat center; background-size: cover; margin-top:15px;}
#foundation .imagen3{background: url(../images2018/foundation-8.jpg) no-repeat center; background-size: cover;}
#foundation .imagen4{background: url(../images2018/foundation-9.jpg) no-repeat center; background-size: cover;}

#foundation .cisterna{width: 220px; float: left; padding: 0 7px 0 0;}
#foundation .museo{width: 350px; float: left; padding: 0 7px 5px 0;}

#foundation .icon-f{vertical-align: middle; width: 50px; padding: 0 5px 0 0; float: left;}

#foundation ul {list-style: none; padding-left: 15px; margin-top: -10px; margin-bottom: 15px;}
#foundation ul li{font-size: 14px; color:#3dbbd4; text-indent: -0.5em;}
#foundation ul li span{color:#000000; font-weight: 300;}
#foundation ul li::before{content: '❱'; display: inline-block; margin-right: 0.5rem;}

#foundation .linea{margin-top: 30px;}
#foundation .linea .circulo-1{text-align: center; border-radius: 50%; vertical-align: middle; -moz-border-radius:  50%; -webkit-border-radius:  50%; width: 250px; height: 250px; display: table; margin-top: -20px;}
#foundation .linea .circulo-1 h5{display: table-cell; vertical-align: middle; color: #ffffff; font-size: 60px; font-weight: 300; line-height: 0.4;}
#foundation .linea .circulo-1 h5 span{font-size: 16px;}

#foundation .container-year{overflow: hidden; height: 100%; box-sizing: border-box;}
#foundation .container-year .linea-color{ height: 100%; background: #000000; display: block;}

#foundation .linea .p33{
	width: 33.3%;
	display: inline;
}

#foundation .linea p{font-size: 12px; line-height: 1.3;}

/************** FEMSA FOUNDATION *************/

/**** Corporate Governance *****/
#governance{padding: 60px 0 15px ;}
#governance h1{margin-top: 40px; margin-bottom: 10px; font-size: 50px; text-transform: uppercase; color: #305364;  font-family: program, sans-serif; font-weight: 700; line-height: 0.8;}
#governance h1 span{line-height: 0.8 !important;}

#governance-cont{padding:15px 0 0 ;}

#governance-cont p{font-size: 14px; font-weight: 300; margin: 15px 0 !important;}
#governance-cont p.highlight{font-size: 18px; font-weight: 400; font-family: program, sans-serif; color:#305364; margin: 15px 0;}
#governance-cont a{color:#215e9e; font-weight: 400; -webkit-transition: all 0.3s ease-out;
  	-moz-transition: all 0.3s ease-out;
  	-o-transition: all 0.3s ease-out;
  	transition: all 0.3s ease-out;}
#governance-cont a:hover{color:#305364;}
#governance-cont table{font-size: 14px;}
#governance-cont table tr th{text-align: right; padding: 2px 6px; border-bottom: 1px solid #000000;}
#governance-cont table tr td{text-align: right; padding: 3px 6px; -webkit-transition: all 0.3s ease-out;
  	-moz-transition: all 0.3s ease-out;
  	-o-transition: all 0.3s ease-out;
  	transition: all 0.3s ease-out; border-bottom: 1px solid #000000;}
#governance-cont table tr .left{text-align: left;}
#governance-cont table tr .borde-left{border-left: 1px solid #000000;}
#governance-cont table tr .borde-right{border-right: 1px solid #000000;}
#governance-cont .notas{font-size: 13px; }
#governance-cont table tr:hover td{background-color: #810430; color: #ffffff;}


#board-of-diectors-intro{padding: 30px 0; background-color: #e6e7e8;}
#board-of-diectors-intro h1{margin-top: 40px; margin-bottom: 10px; font-size: 50px; text-transform: uppercase; color: #305364;  font-family: program, sans-serif; font-weight: 700; line-height: 0.8;}
#board-of-diectors-intro h1 span{line-height: 0.8 !important;}
#board-of-diectors-intro p{font-size: 14px; font-weight: 400; margin: 15px 0 !important;}

#board-of-diectors{padding:30px 0 30px;}
#board-of-diectors h4{margin: 15px 0;}
#board-of-diectors p{font-size: 14px; font-weight: 300; margin: 15px 0 !important;}
#board-of-diectors p.highlight{font-size: 18px; font-weight: 400; font-family: program, sans-serif; color:#305364; margin: 15px 0;}
#board-of-diectors ul {list-style: none; padding-left: 15px;}
#board-of-diectors ul li{font-size: 14px; color:#810430; text-indent: -0.5em;}
#board-of-diectors ul li::before{content: '❱'; display: inline-block; margin-right: 0.5rem;}


#management-team-intro{padding: 30px 0; background-color: #e6e7e8;}
#management-team-intro h1{margin-top: 40px; margin-bottom: 10px; font-size: 50px; text-transform: uppercase; color: #305364;  font-family: program, sans-serif; font-weight: 700; line-height: 0.8;}
#management-team-intro h1 span{line-height: 0.8 !important;}
#management-team-intro p{font-size: 14px; font-weight: 400; margin: 15px 0 !important;}

#management-team{padding:30px 0 30px;}
#management-team p{font-size: 14px; font-weight: 300; margin: 15px 0 !important;}
/**** Corporate Governance *****/

/**** Financial  Summary *****/
#financial-sumary-intro{padding: 60px 0 30px;}
#financial-sumary-intro h1{margin-top: 40px; margin-bottom: 10px; font-size: 50px; text-transform: uppercase; color: #305364;  font-family: program, sans-serif; font-weight: 700; line-height: 0.8;}
#financial-sumary-intro h1 span{line-height: 0.8 !important;}
#financial-sumary-intro p{font-size: 14px; font-weight: 300; margin: 15px 0 !important;}

#financial-sumary{padding:30px 0; background-color: #e6e7e8;}
#financial-sumary p{font-size: 14px; font-weight: 300; margin: 15px 0 !important;}
#financial-sumary p.highlight{font-size: 18px; font-weight: 400; font-family: program, sans-serif; color:#305364; margin: 15px 0;}
#financial-sumary a{color:#215e9e; font-weight: 400; -webkit-transition: all 0.3s ease-out;
  	-moz-transition: all 0.3s ease-out;
  	-o-transition: all 0.3s ease-out;
  	transition: all 0.3s ease-out;}
#financial-sumary a:hover{color:#305364;}

#financial-sumary table{font-size: 14px; text-align: right;}
#financial-sumary table tr th{background-color: #810430; color:#ffffff; padding: 2px 5px;}
#financial-sumary table tr td{padding: 1px 5px; -webkit-transition: all 0.3s ease-out;
  	-moz-transition: all 0.3s ease-out;
  	-o-transition: all 0.3s ease-out;
  	transition: all 0.3s ease-out;}
#financial-sumary table tr:hover td{color:#ffffff; background-color:#305364 ;}
#financial-sumary table tr:hover td sup{color:#ffffff;}

#financial-sumary table tr .left{text-align: left;}
#financial-sumary table .line1{border-bottom:1px solid #305364;}
#financial-sumary table .line2{border-bottom:2px solid #305364;}
#financial-sumary table .line3{border-bottom:2px solid #305364;}

#financial-sumary table .tab1{padding-left:15px; display: block;}
#financial-sumary table .tab2{padding-left:30px;}
#financial-sumary .notas {font-size:13px; color:#305364;}
#financial-sumary sup{font-size:12px; color:#000000; font-weight:400;}


/**** Financial  Summary *****/

/*****MDA*****/
#mda-intro{padding: 70px 0 30px; background-color: #e6e7e8;}
#mda-intro h1{margin-top: 40px; margin-bottom: 10px; font-size: 50px; text-transform: uppercase; color: #305364;  font-family: program, sans-serif; font-weight: 700; line-height: 0.8;}
#mda-intro h1 span{line-height: 0.8 !important;}
#mda-intro p{font-size: 14px; font-weight: 400; margin: 15px 0 !important;}

#mda{padding:30px 0;}
#mda p{font-size: 14px; font-weight: 300; margin: 15px 0 !important;}
#mda a{color:#215e9e; font-weight: 400; -webkit-transition: all 0.3s ease-out;
  	-moz-transition: all 0.3s ease-out;
  	-o-transition: all 0.3s ease-out;
  	transition: all 0.3s ease-out;}
#mda a:hover{color:#305364;}
#mda table{font-size: 14px; margin: 15px 0 30px;}
#mda table tr th{text-align: right; padding: 2px 6px; border-bottom: 1px solid #000000; color:#810430; text-transform: uppercase; font-size: 13px;}
#mda table tr td{text-align: right; padding: 3px 6px; -webkit-transition: all 0.3s ease-out;
  	-moz-transition: all 0.3s ease-out;
  	-o-transition: all 0.3s ease-out;
  	transition: all 0.3s ease-out; border-bottom: 1px solid #000000;}
#mda table tr .left{text-align: left;}
#mda table tr .borde-left{border-left: 1px solid #000000;}
#mda table tr .borde-right{border-right: 1px solid #000000;}
#mda .notas{font-size: 13px; color:#305364; padding-left: 15px;}
#mda sup{font-size: 10px; color:#305364; font-weight: 400;}
#mda table tr:hover td{background-color: #810430; color: #ffffff;}
/*****MDA*****/


/************** CONTACT *************/
#contact-intro{ width: 100%; padding: 70px 0 30px; }
#contact-intro h1{margin-top: 40px; margin-bottom: 10px; font-size: 50px; text-transform: uppercase; color: #305364;  font-family: program, sans-serif; font-weight: 700; line-height: 0.8;}

#contact{padding-bottom: 30px;}
#contact p{font-size: 14px; font-weight: 300; margin: 15px 0 !important; line-height: 1.4;}
#contact a{color:#810430; font-weight: 400; -webkit-transition: all 0.3s ease-out;
  	-moz-transition: all 0.3s ease-out;
  	-o-transition: all 0.3s ease-out;
  	transition: all 0.3s ease-out;}
#contact a:hover{color:#305364;}

/************** CONTACT *************/

/************** DOWNLOAD CENTER *************/
#download-intro{ width: 100%; padding: 70px 0 30px; }
#download-intro h1{margin-top: 40px; margin-bottom: 10px; font-size: 50px; text-transform: uppercase; color: #305364;  font-family: program, sans-serif; font-weight: 700; line-height: 0.8;}

#download{padding:30px 0; background: #d1d3d4;}
#download p{font-size: 14px; font-weight: 300; margin: 15px 0 !important; line-height: 1.4;}
#download a{color:#810430; font-weight: 400; -webkit-transition: all 0.3s ease-out;
  	-moz-transition: all 0.3s ease-out;
  	-o-transition: all 0.3s ease-out;
  	transition: all 0.3s ease-out;}
#download a:hover{color:#305364;}

#download .descarga .portada img{width: 60%; -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);}

/************** DOWNLOAD CENTER *************/


footer{background-color:#305364; padding: 30px 0; overflow: hidden;}
footer .logo img{width: 120px;}
footer .copy {font-size: 12px; color:#ffffff; margin-top:112px; font-weight: 600;}

footer ul{margin: 0; padding: 0; list-style: none;}
footer ul li{}
footer ul li a{color:#ffffff; font-size: 12px; line-height: 1.2; display: block; padding: 0 0 6px; font-weight: 600; -webkit-transition: all 0.3s ease-out;
  	-moz-transition: all 0.3s ease-out;
  	-o-transition: all 0.3s ease-out;
  	transition: all 0.3s ease-out;}
footer ul li a:hover{color:#810430; text-decoration: none;}

footer .menu-redes{width:100%; float: right; height: 60px;}
footer .menu-redes ul{margin:0; padding:0; list-style: none; height: 30px; padding-right: 20px;}
footer .menu-redes ul li{float:right; width:40px; text-align:center; display: table;}
footer .menu-redes ul li a{font-weight:500; font-size:12px; display: block; vertical-align: middle; text-decoration: none; color: #ffffff; -webkit-transition: all 0.3s ease-out;
  	-moz-transition: all 0.3s ease-out;
  	-o-transition: all 0.3s ease-out;
  	transition: all 0.3s ease-out;}
footer .menu-redes ul li a:hover{color: #810430;}

/* Preloader */
#preloader {
	position: fixed;
	top:0;
	left:0;
	right:0;
	bottom:0;
	background-color:#98002e; /* change if the mask should have another color then white */
	z-index:9999999999; /* makes sure it stays on top */
}

#status {text-align: center;
	width:300px;
	height:300px;
	position:absolute;
	left:0; /* centers the loading animation horizontally one the screen */
	right: 0;
	top:50%; /* centers the loading animation vertically one the screen */
	/*background-image:url(../images/loader.gif);  path to your loading animation 
	background-repeat:no-repeat;
	background-position:center;*/
	margin: 0 auto; /* is width and height divided by two */
	color: #ffffff;
}
#status h2{color: #ffffff; font-size: 18px; text-align: center;}
#status h2 span{font-weight: 700;}


