body{padding-bottom: 40px;
  color: #5a5a5a;
background:#dfc12a url('pop.png') repeat;
}
.quienes{color:#fff; font-size:1.6em !important; margin:40px; text-align:justify; font-family:    font: italic bold 12px/30px Georgia, serif;
}
@font-face {
    font-family: pop;
    src: url(fonts/english-towne.regular.ttf
);
} 
.galeria{
width:80%;	
max-width:700px;
margin:0 auto;
}
.rown > .columna {
  padding: 0 8px;
 
}

.rown:after {
  content: "";
  display: table;
  clear: both;
}

.columna {
  float: left;
  
}
#main{min-width:200px;
	max-width:1240px;
	margin:0 auto;
}
/* The Modal (background) */
.modal {
  display: none;
  position: fixed;
  z-index: 1;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.8); /* Black w/ opacity */ 
}

/* Modal Content */
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  width: 90%;
  max-width: 1200px;
}

/* The Close Button */
.close {
  color: white;
  position: absolute;
  top: 10px;
  right: 25px;
  font-size: 35px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #999;
  text-decoration: none;
  cursor: pointer;
}

.mySlides {
  display: none;
}

/* Next & previous buttons */


/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover,
.next:hover {
  background-color: rgba(0, 0, 0, 0.8);
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}


.demo {
  opacity: 0.6;
height:50px;
width:50px;
}
.active,
.demo:hover {
  opacity: 1;
}

img.hover-shadow {
  transition: 0.3s;
height:100px;
width:150px;
}

.hover-shadow:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)
}
.cupon{width:60%;
min-width:300px;
padding:10%;
	margin:0 auto;
height:auto;
background-color:#dfc12a;
border: 2px dashed #000;
}
.cupon h2{color:#000; } 
.cupon p{color:#000; } 
.cupon h3{color:#dfc12a;
background-color:#000;
 } 
.marketing{background-color: red;
min-width:200px;
	max-width:1150px;
	padding:30px;
	min-height:400px;
	margin:0 auto;
color: white;
}
.ribbon {
 font-size: 16px !important;
 /* This ribbon is based on a 16px font side and a 24px vertical rhythm. I've used em's to position each element for scalability. If you want to use a different font size you may have to play with the position of the ribbon elements */

 width: 100%;
    
 position: relative;
 background: yellow;
 color: red; 
 z-index: 1;
 text-align: center;
 padding: 1em 2em; /* Adjust to suit */
 margin: 2em auto 3em; /* Based on 24px vertical rhythm. 48px bottom margin - normally 24 but the ribbon 'graphics' take up 24px themselves so we double it. */
}
.ribbon:before, .ribbon:after {
 content: "";
 position: absolute;
 display: block;
 bottom: -1em;
 border: 1.5em solid yellow;
 z-index: -1; 
 
}
.ribbon:before {
 left: -2em;
 border-right-width: 1.5em;
 border-left-color: transparent;
}
.ribbon:after {
 right: -2em;
 border-left-width: 1.5em;
 border-right-color: transparent;
}
.ribbon .ribbon-content:before, .ribbon .ribbon-content:after {
 content: "";
 position: absolute;
 display: block;
 border-style: solid;
 border-color: gold transparent transparent transparent;
 bottom: -1em;
}
.ribbon .ribbon-content:before {
 left: 0;
 border-width: 1em 0 0 1em;
} 
.ribbon .ribbon-content:after {
 right: 0;
 border-width: 1em 1em 0 0;
} 
.promo{background:beige; border:1px solid black; border-top:0; position: relative;
left: 0;
right: 0;
margin: auto;
max-width: 500px!important; min-width: 300px; padding:0 0 15px 0; min-height:200px;}  
.promo p{ margin:25px 0 0 25px; color:red;}





.navbar-wrapper{position:relative; }
.navbar, button, button.icon-bar{background-color: red !important;}
.navbar .nav>li>a:active{background-color: gold !important;

}
.navbar .nav>li>a{font-size:1.3em !important;
color:white;}
#letter-container {
width:100%;
height:80px;
font-family: pop !important;
color:#FFD700;
	position:relative;
clear:both;
}
 #st{
background-repeat: repeat-x;
    background-image: url("st.png") ;
    min-width:200px;
    width:100%;
	max-width:1140px;
	position: absolute;
left: 0;
right: 0;
margin: auto;
height:60px;  
margin-top:-25px;
margin-bottom:-5px;
z-index:100;
position:absolute;
 
} 
label {
    color: #333;
}
.btn-send {
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    margin-bottom: 20px;
}
.letter-container  span {

	color: #FFD700;

   	opacity: 1;
	font-size: 1.4em;

   	text-shadow: 0px 0px 2px #fff, 1px 1px 4px rgba(0,0,0,0.7);

	-webkit-transition: all 0.3s linear;

	-moz-transition: all 0.3s linear;

	-o-transition: all 0.3s linear;

	-ms-transition: all 0.3s linear;

	transition: all 0.3s linear;

	-webkit-animation: sharpen 0.9s linear backwards;

	-moz-animation: sharpen 0.9s linear backwards;

	-ms-animation: sharpen 0.9s linear backwards;

	animation: sharpen 0.9s linear backwards;

}

.letter-container  span:hover{

	text-shadow: 0px 0px 40px #fff;

}

.letter-container  span:nth-child(1) {

	-webkit-animation-delay: 0s;

	-moz-animation-delay: 0s;

	-ms-animation-delay: 0s;

	animation-delay: 0s;

}

.letter-container  span:nth-child(2) {

	-webkit-animation-delay: 0.1s;

	-moz-animation-delay: 0.1s;

	-ms-animation-delay: 0.1s;

	animation-delay: 0.1s;

}

.letter-container  span:nth-child(3) {

	-webkit-animation-delay: 0.2s;

	-moz-animation-delay: 0.2s;

	-ms-animation-delay: 0.2s;

	animation-delay: 0.2s;

}

.letter-container  span:nth-child(4) {

	-webkit-animation-delay: 0.3s;

	-moz-animation-delay: 0.3s;

	-ms-animation-delay: 0.3s;

	animation-delay: 0.3s;

}

.letter-container  span:nth-child(5) {

	-webkit-animation-delay: 0.4s;

	-moz-animation-delay: 0.4s;

	-ms-animation-delay: 0.4s;

	animation-delay: 0.4s;

}

.letter-container  span:nth-child(6) {

	-webkit-animation-delay: 0.5s;

	-moz-animation-delay: 0.5s;

	-ms-animation-delay: 0.5s;

	animation-delay: 0.5s;

}

.letter-container  span:nth-child(7) {

	-webkit-animation-delay: 0.6s;

	-moz-animation-delay: 0.6s;

	-ms-animation-delay: 0.6s;

	animation-delay: 0.6s;

}

.letter-container  span:nth-child(8) {

	-webkit-animation-delay: 0.7s;

	-moz-animation-delay: 0.7s;

	-ms-animation-delay: 0.7s;

	animation-delay: 0.7s;

}

.letter-container  span:nth-child(9) {

	-webkit-animation-delay: 0.8s;

	-moz-animation-delay: 0.8s;

	-ms-animation-delay: 0.8s;

	animation-delay: 0.8s;

}

.letter-container  span:nth-child(10) {

	-webkit-animation-delay: 0.9s;

	-moz-animation-delay: 0.9s;

	-ms-animation-delay: 0.9s;

	animation-delay: 0.9s;

}

.letter-container  span:nth-child(11) {

	-webkit-animation-delay: 1s;

	-moz-animation-delay: 1s;

	-ms-animation-delay: 1s;

	animation-delay: 1s;

}

.letter-container  span:nth-child(12) {

	-webkit-animation-delay: 1.1s;

	-moz-animation-delay: 1.1s;

	-ms-animation-delay: 1.1s;

	animation-delay: 1.1s;

}

.letter-container  span:nth-child(13) {

	-webkit-animation-delay: 1.2s;

	-moz-animation-delay: 1.2s;

	-ms-animation-delay: 1.2s;

	animation-delay: 1.2s;

}

.letter-container  span:nth-child(14) {

	-webkit-animation-delay: 1.3s;

	-moz-animation-delay: 1.3s;

	-ms-animation-delay: 1.3s;

	animation-delay: 1.3s;

}

.letter-container  span:nth-child(15) {

	-webkit-animation-delay: 1.4s;

	-moz-animation-delay: 1.4s;

	-ms-animation-delay: 1.4s;

	animation-delay: 1.4s;

}

.letter-container  span:nth-child(16) {

	-webkit-animation-delay: 1.5s;

	-moz-animation-delay: 1.5s;

	-ms-animation-delay: 1.5s;

	animation-delay: 1.5s;

}

.letter-container  span:nth-child(17) {

	-webkit-animation-delay: 1.6s;

	-moz-animation-delay: 1.6s;

	-ms-animation-delay: 1.6s;

	animation-delay: 1.6s;

}

.letter-container  span:nth-child(17) {

	-webkit-animation-delay: 1.6s;

	-moz-animation-delay: 1.6s;

	-ms-animation-delay: 1.6s;

	animation-delay: 1.6s;

}

.letter-container  span:nth-child(18) {

	-webkit-animation-delay: 1.7s;

	-moz-animation-delay: 1.7s;

	-ms-animation-delay: 1.7s;

	animation-delay: 1.7s;

}

.letter-container  span:nth-child(19) {

	-webkit-animation-delay: 1.8s;

	-moz-animation-delay: 1.8s;

	-ms-animation-delay: 1.8s;

	animation-delay: 1.8s;

}

.letter-container  span:nth-child(20) {

	-webkit-animation-delay: 1.9s;

	-moz-animation-delay: 1.9s;

	-ms-animation-delay: 1.9s;

	animation-delay: 1.9s;

}

.letter-container  span:nth-child(21) {

	-webkit-animation-delay: 2s;

	-moz-animation-delay: 2s;

	-ms-animation-delay: 2s;

	animation-delay: 2s;

}

.letter-container  span:nth-child(22) {

	-webkit-animation-delay: 2.1s;

	-moz-animation-delay: 2.1s;

	-ms-animation-delay: 2.1s;

	animation-delay: 2.1s;

}

.letter-container  span:nth-child(23) {

	-webkit-animation-delay: 2.2s;

	-moz-animation-delay: 2.2s;

	-ms-animation-delay: 2.2s;

	animation-delay: 2.2s;

}

.letter-container  span:nth-child(24) {

	-webkit-animation-delay: 2.3s;

	-moz-animation-delay: 2.3s;

	-ms-animation-delay: 2.3s;

	animation-delay: 2.3s;

}

.letter-container  span:nth-child(25) {

	-webkit-animation-delay: 2.4s;

	-moz-animation-delay: 2.4s;

	-ms-animation-delay: 2.4s;

	animation-delay: 2.4s;

}

.letter-container  span:nth-child(26) {

	-webkit-animation-delay: 2.5s;

	-moz-animation-delay: 2.5s;

	-ms-animation-delay: 2.5s;

	animation-delay: 2.5s;

}

.letter-container  span:nth-child(27) {

	-webkit-animation-delay: 2.6s;

	-moz-animation-delay: 2.6s;

	-ms-animation-delay: 2.6s;

	animation-delay: 2.6s;

}

.letter-container  span:nth-child(28) {

	-webkit-animation-delay: 2.7s;

	-moz-animation-delay: 2.7s;

	-ms-animation-delay: 2.7s;

	animation-delay: 2.7s;

}

.letter-container  span:nth-child(29) {

	-webkit-animation-delay: 2.8s;

	-moz-animation-delay: 2.8s;

	-ms-animation-delay: 2.8s;

	animation-delay: 2.8s;

}

.letter-container  span:nth-child(30) {

	-webkit-animation-delay: 2.9s;

	-moz-animation-delay: 2.9s;

	-ms-animation-delay: 2.9s;

	animation-delay: 2.9s;

}

.letter-container  span:nth-child(31) {

	-webkit-animation-delay: 3s;

	-moz-animation-delay: 3s;

	-ms-animation-delay: 3s;

	animation-delay: 3s;

}

.letter-container  span:nth-child(32) {

	-webkit-animation-delay: 3.1s;

	-moz-animation-delay: 3.1s;

	-ms-animation-delay: 3.1s;

	animation-delay: 3.1s;

}

.letter-container  span:nth-child(33) {

	-webkit-animation-delay: 3.2s;

	-moz-animation-delay: 3.2s;

	-ms-animation-delay: 3.2s;

	animation-delay: 3.2s;

}

@keyframes sharpen {

 0% {

   	opacity: 0;

   	text-shadow: 0px 0px 100px #fff;

   	color: transparent;

 }

 90% {

   	opacity: 0.9;

   	text-shadow: 0px 0px 10px #fff;

   	color: transparent;

 }

 100% {

    color: #fff;

   	opacity: 1;

   	text-shadow: 0px 0px 2px #fff, 1px 1px 4px rgba(0,0,0,0.7);

 }

}

@-moz-keyframes sharpen {

 0% {

   	opacity: 0;

   	text-shadow: 0px 0px 100px #fff;

   	color: transparent;

 }

 90% {

   	opacity: 0.9;

   	text-shadow: 0px 0px 10px #fff;

   	color: transparent;

 }

 100% {

    color: #fff;

   	opacity: 1;

   	text-shadow: 0px 0px 2px #fff, 1px 1px 4px rgba(0,0,0,0.7);

 }

}

@-webkit-keyframes sharpen {

 0% {

   	opacity: 0;

   	text-shadow: 0px 0px 100px #fff;

   	color: transparent;

 }

 90% {

   	opacity: 0.9;

   	text-shadow: 0px 0px 10px #fff;

   	color: transparent;

 }

 100% {

    color: #fff;

   	opacity: 1;

   	text-shadow: 0px 0px 2px #fff, 1px 1px 4px rgba(0,0,0,0.7);

 }

}

@-ms-keyframes sharpen {

 0% {

   	opacity: 0;

   	text-shadow: 0px 0px 100px #fff;

   	color: transparent;

 }

 90% {

   	opacity: 0.9;

   	text-shadow: 0px 0px 10px #fff;

   	color: transparent;

 }

 100% {

    color: #fff;

   	opacity: 1;

   	text-shadow: 0px 0px 2px #fff, 1px 1px 4px rgba(0,0,0,0.7);

 }