/*-------------------------------------*/

.cf:before, .cf:after{
  content:"";
  display:table;
}

.cf:after{
  clear:both;
}

.cf{
  zoom:1;
}

/*-------------------------------------*/	

.form-wrapper {
	width: 600px;
	padding: 10px;
	margin: 20px auto 20px auto;
	background: #00172D;
	/*background: rgba(0,0,0,.2);*/
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
	-moz-box-shadow: 0 1px 1px rgba(0,0,0,.4) inset, 0 1px 0 rgba(255,255,255,.2);
	-webkit-box-shadow: 0 1px 1px rgba(0,0,0,.4) inset, 0 1px 0 rgba(255,255,255,.2);
	box-shadow: 0 1px 1px rgba(0,0,0,.4) inset, 0 1px 0 rgba(255,255,255,.2);
}

.form-wrapper input {
	width: 480px;
	height: 20px;
	padding: 10px 5px;
	float: left;    
	font: bold 15px 'lucida sans', 'trebuchet MS', 'Tahoma';
	border: 0;
	background: #eee;
	-moz-border-radius: 3px 0 0 3px;
	-webkit-border-radius: 3px 0 0 3px;
	border-radius: 3px 0 0 3px;      
}

.form-wrapper input:focus {
	outline: 0;
	background: #fff;
	-moz-box-shadow: 0 0 2px rgba(0,0,0,.8) inset;
	-webkit-box-shadow: 0 0 2px rgba(0,0,0,.8) inset;
	box-shadow: 0 0 2px rgba(0,0,0,.8) inset;
}

.form-wrapper input::-webkit-input-placeholder {
   color: #999;
   font-weight: normal;
   font-style: italic;
}

.form-wrapper input:-moz-placeholder {
	color: #999;
	font-weight: normal;
	font-style: italic;
}

.form-wrapper input:-ms-input-placeholder {
	color: #999;
	font-weight: normal;
	font-style: italic;
}    

.form-wrapper button {
	overflow: visible;
	position: relative;
	float: right;
	border: 0;
	padding: 0;
	cursor: pointer;
	height: 40px;
	width: 110px;
	font: bold 15px/40px 'lucida sans', 'trebuchet MS', 'Tahoma';
	color: #fff;
	text-transform: uppercase;
	background: #CD1F25;
	-moz-border-radius: 0 3px 3px 0;
	-webkit-border-radius: 0 3px 3px 0;
	border-radius: 0 3px 3px 0;      
	text-shadow: 0 -1px 0 rgba(0, 0 ,0, .3);
}   
  
.form-wrapper button:hover{		
	background: #e54040;
}	
  
.form-wrapper button:active,
.form-wrapper button:focus{   
	background: #CD1F25;    
}

.form-wrapper button:before {
	content: '';
	position: absolute;
	border-width: 8px 8px 8px 0;
	border-style: solid solid solid none;
	border-color: transparent #CD1F25 transparent;
	top: 12px;
	left: -6px;
}

.form-wrapper button:hover:before{
	border-right-color: #e54040;
}

.form-wrapper button:focus:before{
	border-right-color: #c42f2f;
}    

.form-wrapper button::-moz-focus-inner {
	border: 0;
	padding: 0;
}
.form-wrapper textarea {
	resize: none;
	width: 590px;
	height: 120px;
	padding: 10px 5px;
	float: left;    
	font: bold 15px 'lucida sans', 'trebuchet MS', 'Tahoma';
	border: 0;
	background: #eee;
	-moz-border-radius: 3px 0 0 3px;
	-webkit-border-radius: 3px 0 0 3px;
	border-radius: 3px 0 0 3px;      
}
.boton-rojo{
	font-size:0.9em;
	/*display: block;*/
	padding:10px 15px;
	font-family: 'ambleregular';
	background:#CD1F25;
	border-color:#CD1F25;
	color: #FFF;
	text-decoration: none;
	text-align: center;
	outline: 0;
	float: center;
	cursor: pointer;
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

.boton-rojo:hover{
	text-shadow: 0px 0px 1px #000;
	background:#292929;
	border-color:#292929;
}
.caja-grande {
	resize: none;
	width: 600px;
	height: 120px;
	padding: 10px 5px;  
	font: bold 15px 'lucida sans', 'trebuchet MS', 'Tahoma';
	margin: 20px;
	border: 4px solid #292929;
	background: #eee;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;      
}
.caja-normal {
	resize: none;
	width: 90%;
	height: 20px;
	padding: 10px 5px;  
	font: bold 15px 'lucida sans', 'trebuchet MS', 'Tahoma';
	margin: 20px;
	border: 4px solid #292929;
	background: #eee;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;      
}
/*NUEVO*/
* {
  box-sizing: border-box;
}

/* Create two equal columns that floats next to each other */
.column {
  float: left;
  width: 50%;
  padding: 10px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}
.col-25 {
  width: 25%;
  float: left;
  text-align: right;
  margin-top: 6px;
  padding-top: 6px;
}
.col-75 {
  width: 75%;
  float: left;
  text-align: center;
  margin-top: 6px;
  padding-top: 6px;
}
.col-25-ext {
  width: 25%;
  float: right;
  margin-top: 6px;
  padding-top: 6px;
}
.ancho-completo {
  width: 100%
}