div.formulario-container {border:0px solid #ff0000; color:#51515d; margin:0 auto; max-width:900px; font-family: "Raleway", sans-serif;}
div.forulario-block {width:90%; margin:0 auto;}
span.texto {font-size:  0.9em;}

div.nombreExp {margin-bottom:10px; font-size: 1.0em;}
div.email {margin-bottom:10px; font-size: 1.0em;}
div.mensaje { margin-right:35px; font-size: 1.0em;}


div.nombreExp input {width:100%; max-width:350px; color:#B3BC00; border:1px solid #ededed; padding:10px;font-size: 1.0em; font-family: 'Raleway', sans-serif;}
div.email input {width:100%; max-width:350px; color:#B3BC00; border:1px solid #ededed;  padding:10px;font-size: 1.0em; font-family: 'Raleway', sans-serif;}
div.mensaje input { max-width: 450px; color: #B3BC00; border: 1px solid #ededed; padding: 5px; font-size: 15px; font-family: 'Roboto'; margin-bottom: 7px;}

button[type=submit] {background-color:#B3BC00; font-family: "Barlow", sans-serif; font-size:14px; border:1px solid #B3BC00; color:#ffffff; padding: 7px 12px; text-decoration:none; margin:0px 10px 0px 0px; cursor:pointer; border-radius:0px;}
button[type=submit]:hover {background-color:#ffffff; color:#B3BC00 !important; text-decoration:none;}
input[type=text]{padding-right:20px;}

button[type=reset]  {background-color:#B3BC00; font-family: "Barlow", sans-serif; font-size:14px;  border:1px solid #B3BC00; color:#ffffff; padding: 5px 12px; text-decoration:none; margin:0px 0px 0px 0px; cursor:pointer; border-radius:0px;}
button[type=reset]:hover  {background-color:#ffffff; color:#B3BC00 !important; text-decoration:none;}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}
input[type=number] {
  -moz-appearance: textfield;
}

.validation-message {
  display: none;
}
.validation-message-valid {
  display: block;
}

.invalid{
  display: block;
  color: red;

}
#nameError {
  display: none;
  font-size: 0.8em;
}

#nameError.visible {
  display: block;
}

input.invalid {
  border-color: red;
}
#success_tic .page-body{
  max-width:400px;
  background-color:#FFFFFF;
  margin:10% auto;
  position: relative;
}
 #success_tic .page-body .head{
  text-align:center;
  max-width: 350px;
}
/* #success_tic .tic{
  font-size:186px;
} */
#success_tic .close{
      opacity: 1;
    position: absolute;
    right: 0px;
    font-size: 30px;
    padding: 3px 15px;
  margin-bottom: 10px;
}
#success_tic .checkmark-circle {
  width: 150px;
  height: 150px;
  position: relative;
  display: inline-block;
  vertical-align: top;
}
.checkmark-circle .background {
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background: #1ab394;
  position: absolute;
}
#success_tic .checkmark-circle .checkmark {
  border-radius: 5px;
}
#success_tic .checkmark-circle .checkmark.draw:after {
  -webkit-animation-delay: 300ms;
  -moz-animation-delay: 300ms;
  animation-delay: 300ms;
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease;
  -moz-animation-timing-function: ease;
  animation-timing-function: ease;
  -webkit-animation-name: checkmark;
  -moz-animation-name: checkmark;
  animation-name: checkmark;
  -webkit-transform: scaleX(-1) rotate(135deg);
  -moz-transform: scaleX(-1) rotate(135deg);
  -ms-transform: scaleX(-1) rotate(135deg);
  -o-transform: scaleX(-1) rotate(135deg);
  transform: scaleX(-1) rotate(135deg);
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}
#success_tic .checkmark-circle .checkmark:after {
  opacity: 1;
  height: 75px;
  width: 37.5px;
  -webkit-transform-origin: left top;
  -moz-transform-origin: left top;
  -ms-transform-origin: left top;
  -o-transform-origin: left top;
  transform-origin: left top;
  border-right: 15px solid #fff;
  border-top: 15px solid #fff;
  border-radius: 2.5px !important;
  content: '';
  left: 35px;
  top: 80px;
  position: absolute;
}

@-webkit-keyframes checkmark {
  0% {
    height: 0;
    width: 0;
    opacity: 1;
  }
  20% {
    height: 0;
    width: 37.5px;
    opacity: 1;
  }
  40% {
    height: 75px;
    width: 37.5px;
    opacity: 1;
  }
  100% {
    height: 75px;
    width: 37.5px;
    opacity: 1;
  }
}
@-moz-keyframes checkmark {
  0% {
    height: 0;
    width: 0;
    opacity: 1;
  }
  20% {
    height: 0;
    width: 37.5px;
    opacity: 1;
  }
  40% {
    height: 75px;
    width: 37.5px;
    opacity: 1;
  }
  100% {
    height: 75px;
    width: 37.5px;
    opacity: 1;
  }
}
@keyframes checkmark {
  0% {
    height: 0;
    width: 0;
    opacity: 1;
  }
  20% {
    height: 0;
    width: 37.5px;
    opacity: 1;
  }
  40% {
    height: 75px;
    width: 37.5px;
    opacity: 1;
  }
  100% {
    height: 75px;
    width: 37.5px;
    opacity: 1;
  }
}
column {
  float: left;
  width: 50%;
  padding: 10px;
  height: 300px; /* Should be removed. Only for demonstration */
}
/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  .column {
    width: 100%;
  }
}