<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License

Name       : Breakeven 
Description: A two-column, fixed-width design with dark color scheme.
Version    : 1.0
Released   : 20130509

-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Liderazgo que une fuerzas.</title>

<link href="http://fonts.googleapis.com/css?family=Open+Sans:400,300,600" rel="stylesheet" type="text/css" />
<link href='http://fonts.googleapis.com/css?family=Abel|Satisfy' rel='stylesheet' type='text/css'>
<link href="style2.css" rel="stylesheet" type="text/css" media="screen" />
<link href="stylemenu2.css" rel="stylesheet" type="text/css" />
<link href="assets/royalslider/royalslider2.css" rel="stylesheet">
<link href="assets/royalslider/skins/default-inverted/rs-default-inverted2.css" rel="stylesheet">
<link href="assets/royalslider/skins/minimal-white/rs-minimal-white.css" rel="stylesheet">
{literal}

<script type="text/javascript" src="js/ajax.js"></script>
<script type="text/javascript" src="js/ajax-dynamic-content.js"></script>

<script type="text/javascript" src="assets/royalslider/jquery-1.8.3.min.js" ></script>
<script type="text/javascript" src="assets/royalslider/jquery.royalslider.min.js" ></script>
<script src="../assets/royalslider/jquery.easing-1.3.js" ></script>
<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-50319400-1', 'cred.com.mx');
  ga('send', 'pageview');

</script>

<style>
#slider-in-laptop {
  width: 522px;
  height: 320px;
  padding: 0% 15% 2%;
margin-top:2px;
  background: none;
}
#slider-in-laptop .rsOverflow,
#slider-in-laptop .rsSlide,
#slider-in-laptop .rsVideoFrameHolder,
#slider-in-laptop .rsThumbs {
  background: #151515;
}
.imgBg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: auto;
}
#slider-in-laptop .rsBullets {
  bottom: -25px;
}
.laptopBg {
  position: relative;
  width: 100%;
  height: 572px;
}
#slider-in-laptop .rsBullets {
    bottom: -30px;
}

/****/
#slider-with-blocks-1 {
  width: 100%;
}

.rsContent {
  color: #FFF;
  font-size: 24px;
  line-height: 32px;
  float: left;
}
.bContainer {
  position: relative;
}
.rsABlock {
  position: relative;
  display: block;
  left: auto;
  top: auto;
}
.blockHeadline {
  font-size: 42px;
  line-height: 50px;
}
.blockSubHeadline {
  font-size: 32px;
  line-height: 40px
}
.txtCent {
  text-align: center; 
  width: 80%; 
}

.slide1 {
  background: #e6e6e6;
color:#f06d3e;
}
.slide1 .bContainer {
  top: 36%;
}
.slide2 {
    background: #e6e6e6;
    color:#666;
}
.slide2 .bContainer {
  top: 24px;
}
.slide2 .txtCent {
text-align: left; 
font-size: 14px;
margin-left:10px;
  line-height: 20px;
}
.slide2 .h1 .h2 .h3 {
   line-height: 66px;
color:#f06d3e;
}
.slide2 .blockHeadline {
   line-height: 66px;
color:#f06d3e;
}



.slide2 .blockSubHeadline {
   line-height: 24px;
font-size: 16px;
color:#f06d3e;
}
.slide3 {
    background: #45aab8;
    color:#FFF;
}
.slide3 .bContainer {
   top: 24px;
}
.slide3 span {
  line-height: 44px;
}
.slide4 .bContainer {
  position: absolute;
  left: 0;
  width: 100%;
  height: auto;
  top: 24px;
}

.photoCopy {
  position: absolute;
  line-height: 24px;
  font-size: 12px;
  background: black;
  color: white;
  background-color: rgba(0, 0, 0, 0.75);
  padding: 0px 10px;
  position: absolute;
  left: 12px;
  bottom: 12px;
  top: auto;
  border-radius: 2px;
  z-index: 25;
}
.photoCopy a {
  color: #FFF;
}
.palmImg {
  left: 0;
  top: auto;
  bottom: -60px;
  position: absolute;
}


@media screen and (min-width: 0px) and (max-width: 960px) { 
  .rsContent {
    font-size: 22px;
    line-height: 28px;
  }
  .blockHeadline {
    font-size: 32px;
    line-height: 32px;
  }
  .blockSubHeadline {
    font-size: 26px;
    line-height: 32px
  }
}
@media screen and (min-width: 0px) and (max-width: 500px) { 
  .royalSlider,
  .rsOverflow {
    height: 330px !important;
  }
  .rsContent {
    font-size: 18px;
    line-height: 26px;
  }
  .blockHeadline {
    font-size: 24px;
    line-height: 32px;
  }
  .blockSubHeadline {
    font-size: 22px;
    line-height: 32px
  }
}
</style>
{/literal}
</head>

<body>

<div id="wrapper">
	<div id="header-wrapper">
		<div id="header" class="container">
			<div id="logo">
				<!--- <img style="border-width: 0px;background: none repeat scroll 0px 0px rgb(91, 91, 91);" src="Imagenes/carlos-faros2_01.gif" width="1024" height="142" /> -->
				<img style="background: none repeat scroll 0px 0px rgb(91, 91, 91);border-width: 0px;" src="Imagenes/cenefa_velero_01.gif" width="1024" height="137" />
				
				
			</div>
{literal}		
<div id="menu">
<div class="menuc" id="menuc"></div>

                                        <script type="text/javascript">
                                           ajax_loadContent('menuc','/nueva_pag/index.php?page=menu');
                                         </script> 

<div class="submenuc" id="submenuc"></div>
</div>
{/literal}		

<div id="tapon"><img style="border-width: 0px;" src="Imagenes/tapon.gif" width="128px" height="27px" />
				</div>
		</div>
	
	
	</div> 
		
		
	<!-- end #header -->
	<center>
	<div id="page">
		<div id="content">
			<div class="post">
			
			<div class="laptopBg">
				
     <img src="Imagenes/main_interior_faro_03.gif" class="imgBg">
<div id="slider-in-laptop" class="royalSlider rsMinW">
 {content}
    </div>
{literal}
<script type="text/javascript">
jQuery(document).ready(function($) {
  var rsi = $('#slider-in-laptop').royalSlider({
    autoHeight: false,
    arrowsNav: true,
    fadeinLoadedSlide: false,
    controlNavigationSpacing: 0,
    controlNavigation: 'arrows',
    imageScaleMode: 'fill',
    imageAlignCenter: true,
    loop: false,
    loopRewind: false,
    numImagesToPreload: 6,
    keyboardNavEnabled: true,
    autoScaleSlider: true,  
arrowsNavAutoHide:false,
slidesOrientation: 'vertical',
video: {
      autoHideArrows:true,
      autoHideControlNav:true
    }, 
    autoScaleSliderWidth: 521,     
    autoScaleSliderHeight: 527,
    
    autoPlay: {
    		
    		enabled: true,
    		pauseOnHover: true
    	},
    /* size of all images http://help.dimsemenov.com/kb/royalslider-jquery-plugin-faq/adding-width-and-height-properties-to-images */
    imgWidth: 792,
    imgHeight: 479



  }).data('royalSlider');

  $('#slider-next').click(function() {
    rsi.next();
  });
  $('#slider-prev').click(function() {
    rsi.prev();
  });
});

</script>
	{/literal}			
					
				
			</div>
		</div>
		<!-- end #content -->
		<div id="sidebar">
		<br><br>
			
		</div>
		<!-- end #sidebar -->
		<div style="clear: both; background:#4C4C4C;">&nbsp;</div>
	</div>
	<!-- end #page --> 
	
</div>
<!---
<div id="footer">
	
</div>
--->
</center>
<!-- end #footer -->
</body>
</html>