/* Theme Name: Ubold - Web App Kit (One page)
   Author: Coderthemes
   Author e-mail: coderthemes@gmail.com
   Version: 1.0.0
   File Description:Main CSS file of the template
*/

/*------------------------------------------------------------------

[Table of contents]

1. Reset
2. Helper classes 
3. Buttons
4. Dropdown
5. Navbar Custom
6. Home
7. FEATURES
8. Pricing
9. Testimonials
10. SUBSCRIBE
11. Footer
12. Other pages CSS
    12.1 Contact
    12.2 Team
    12.3 FAQ
    12.4 JOB
    12.5 Intro Form
13. Responsive 

--------------------------------------*/

@font-face {
  font-family: 'MyWebFont';
  src: url('../fonts/WoodfordBournePro-Thin.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
       url('../fonts/WoodfordBournePro-Thin.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}


/*-----------------------------Index--------------------------------------*/

.video-container {
    position: fixed; /* ¡Importante! Mantiene el video fijo */
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    z-index: -10;
}

/* El video ocupa toda la pantalla sin deformarse */
#bg-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.info-container {
  display: flex;
  background: linear-gradient(135deg, #52b997, #206d99, #c7dfd9);
  color: white;
  justify-content: space-around;
  padding: 40px 0;
  border-radius: 65px;
}

.info-box {
  flex: 1;
  padding: 0 20px;
  text-align: left;
  border-right: 1px solid #5c8229;
  
}

.info-box:last-child {
  border-right: none;
}

.icon {
  font-size: 36px;
  color: white;
  margin-bottom: 10px;
}

#sol {
  -webkit-animation-name:            rotate; 
  -webkit-animation-duration:        3s; 
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
}

@keyframes heartbeat {
  0% {
    transform: scale(1);
  }
  14% {
    transform: scale(1.3);
  }
  28% {
    transform: scale(1);
  }
  42% {
    transform: scale(1.3);
  }
  70% {
    transform: scale(1);
  }
}

#planta {
  animation: heartbeat 1.5s infinite;
  transform-origin: center;
}

@keyframes magnify {
  0% {
    transform: scale(.5);
  }
  100% {
    transform: scale(1.5);
  }
}

#lupa {
  animation: magnify 2s infinite;
}

@media (max-width: 767.98px) {
  .info-box {
    border-right: none;
    border-bottom: 1px solid #5c8229;
  }
  .info-box:last-child {
    border-bottom: none;
  }
}

#matraz {
  color: white;
  animation: bubble-flask 2s infinite ease-in-out;
  transform-origin: center;
  text-shadow: 0 0 10px #52b997, 0 0 20px #c7dfd9;
}

@keyframes bubble-flask {
  0%, 100% {
    transform: scale(1) rotate(0deg);
    text-shadow: 0 0 10px #52b997, 0 0 20px #c7dfd9;
  }
  25% {
    transform: scale(1.1) rotate(-3deg);
    text-shadow: 0 0 15px #c7dfd9, 0 0 25px #206d99;
  }
  50% {
    transform: scale(0.95) rotate(3deg);
    text-shadow: 0 0 10px #206d99, 0 0 20px #52b997;
  }
  75% {
    transform: scale(1.05) rotate(-2deg);
    text-shadow: 0 0 12px #c7dfd9, 0 0 18px #206d99;
  }
}


/*-----------------------------Index--------------------------------------*/

/*-----------------------------Nosotros--------------------------------------*/

#Nosotros {
  background: url("../images/nosotros.jpg") no-repeat;
  background-size: cover;         /* Ensures the image fills the screen */
  background-position: center;    /* Keeps the focal point centered */
  background-attachment: fixed;   /* Optional: keeps background static while scrolling */
  width: 100vw;
  height: 100vh;
  
}

.bubbles-section {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
  background: rgba(255, 255, 255, 0.1); /* transparent over bg if needed */
  padding: 2rem;
}

.bubble-container {
  display: flex;
  gap: 2rem;
  flex-wrap: wrap;
  justify-content: center;
}

.bubble {
  width: 300px;
  height: 300px;
  background: linear-gradient(135deg, #52b997, #206d99, #c7dfd9);
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: white;
  text-align: center;
  padding: 20px;
  opacity: 0.9;
  cursor: pointer;
  transition: transform 0.3s ease, opacity 0.3s ease, box-shadow 0.3s ease;
  animation: floatBubbles 5s ease-in-out infinite;
  position: relative;
  overflow: hidden;
}

.bubble h2 {
  margin-bottom: 1rem;
  font-size: 1.5rem;
  color: white;
}

/* Animation for bubbles floating */
@keyframes floatBubbles {
  0% {
    transform: translateY(0);
    opacity: 0.9;
  }
  50% {
    transform: translateY(-20px);
    opacity: 1;
  }
  100% {
    transform: translateY(0);
    opacity: 0.9;
  }
}

.bubble-content, .reveal-text {
  position: absolute;
  text-align: center;
  padding: 10px;
}

/* When bubble is revealing content */
.bubble.reveal-mode {
  width: 300px;
  height: 300px;
  border-radius: 20px;
  padding: 20px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  overflow: auto;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
  animation: none;
}

.reveal-text {
  display: none;
  font-size: 16px;
  line-height: 1.6;
  padding: 10px 20px;
  animation: fadeIn 0.5s ease-in-out forwards;
}
.bubble.explode {
  animation: explode 0.5s ease forwards;
}

@keyframes explode {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(1.5);
    opacity: 0;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: scale(0.8);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* Revert animation */
.bubble.revert {
  animation: revertBubble 0.3s ease forwards;
}

@keyframes revertBubble {
  from {
    transform: scale(0.8);
    opacity: 0.5;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}


/*-----------------------------Nosotros--------------------------------------*/

/*-----------------------------Productos--------------------------------------*/

#Productos {
  background: url("../images/prod-fondo.jpg") no-repeat;
  background-size: cover;         /* Ensures the image fills the screen */
  background-position: center;    /* Keeps the focal point centered */
  background-attachment: fixed;   /* Optional: keeps background static while scrolling */
  width: 100vw;
  height: 100vh;
}

/* === Contenedor general de la sección transparente === */
.section#Texto {
  background: transparent;
}

.pulsating-square {
  background: linear-gradient(135deg, #52b997, #206d99, #c7dfd9);
  color: white;
  padding: 2rem;
  max-width: 35em;
  text-align: center;
  border-radius: 8px;
  animation: pulse 1.5s ease-in-out infinite;
}

@keyframes pulse {
  0%,100% { transform: scale(1); }
  50%    { transform: scale(1.05); }
}

.pulsating-square h1 {
  margin-bottom: 1rem;
}
.pulsating-square h4 {
  text-align: justify;
  line-height: 2;
}

/* 2) La abeja será absoluta y ocupará un punto de partida en el centro */
.bee {
  position: absolute;      /* <— */
  top: 50%;
  left: 50%;
  font-size: 5rem;
  transform: translate(-50%, -50%);
  animation:
    buzz 0.3s ease-in-out infinite alternate,
    fly 6s ease-in-out infinite;  /* <— nueva animación */
}

/* 3) Mantenemos el “zumbido” pequeño */
@keyframes buzz {
  from { transform: translate(-50%, -50%) scale(1); }
  to   { transform: translate(-50%, -50%) scale(1.1); }
}

/* 4) Definimos la ruta de vuelo dentro del hexágono */
@keyframes fly {
  0%   { top: 50%; left: 50%; }
  15%  { top: 20%; left: 40%; }
  30%  { top: 10%; left: 60%; }
  45%  { top: 30%; left: 75%; }
  60%  { top: 60%; left: 80%; }
  75%  { top: 75%; left: 50%; }
  90%  { top: 65%; left: 25%; }
  100% { top: 50%; left: 50%; }
}

/*-----------------------------Productos--------------------------------------*/

/*======= 1.Reset ======== */

body {
  /*font-family: 'Varela Round', sans-serif;*/
  color: #496174;
  background: #fff;
  font-size: 14px;
  line-height: 22px;
  overflow-x:hidden;
}

::selection{
  background: rgba(249, 230, 5, 0.5);
  color: #496174;
}

::-moz-selection {
  background: rgba(249, 230, 5, 0.5);
  color: #496174;
}

a:hover,a:focus,.a:active {
  text-decoration: none;
  outline: none !important;
}

/* Back to top */
.back-to-top {
  width: 30px;
  height: 30px;
  position: fixed;
  bottom: 10px;
  right: 20px;
  display: none;
  text-align: center;
  z-index: 10000;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: #496174;
}

.back-to-top:hover {
  background-color: #5d9cec;
}

.back-to-top i {
  color: #fff;
  font-size: 22px;
  display: block;
  line-height: 30px;
}


/*======= 2.Helper classes ======== */
.section {
  padding-top: 60px;
  padding-bottom: 60px;
}

.sub-title {
  margin-bottom: 40px;
  font-size: 15px;
}

.title {
  font-size: 22px;
  margin-top: 0;
}

.text-white {
  color: #ffffff !important;
}

.text-muted {
  color: #95A8B7;
}

.text-custom {
  color: #5d9cec;
}

.text-light {
  color: rgba(255, 255, 255, 0.7);
}

.font-light {
  font-weight: 300;
}

.bg-custom {
  background-color: #5d9cec;
}

.bg-light {
  border-top: 1px solid #E6EDF3;
}

.bg-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*background: rgba(0, 0, 0, 0.5);*/
    z-index: 1;
}


.m-t-20 {
  margin-top: 20px;
}

.m-t-0 {
  margin-top: 0px !important;
}

.m-b-0 {
  margin-bottom: 0px;
}

.p-0 {
  padding: 0px !important;
}

.p-t-0 {
  padding-top: 0px !important;
}

.w-full {
  width: 100% !important;
}

/* Background Images */
.bg-img-1 {
  /*background: url("../images/intro.mp4") no-repeat;*/
  background-size: cover;
  position: relative;
  height: 700px;
}

.bg-img-left {
  background: url("../images/hleft.jpg") no-repeat;
  background-size: cover;
  position: relative;
  height: 450px;
  display: flex;
  align-items: center; /* Center content vertically inside each section */
  justify-content: center; 

}

.bg-img-right {
  background: url("../images/hright.jpg") no-repeat;
  background-size: cover;
  position: relative;
  height: 450px;
  display: flex;
  align-items: center; /* Center content vertically inside each section */
  justify-content: center; 
  
}

.bg-img-4 {
  background: url("../images/pcut.png") no-repeat;
  background-size: cover;
  position: relative;
  height: 450px;
}

/* Custom */

.bottom-left {
  position: absolute;
  bottom: 60px;
  left: 60px;
}

.center {
  position: absolute;
  top: 50%;
  width: 100%;
  text-align: center;
  font-size: 18px;
}

/*======= 3.Buttons ======= */
.btn {
  border-radius: 2px;
  padding: 8px 16px;
  outline: none !important;
  box-shadow: none !important;
}

.btn-sm {
  padding: 5px 10px !important;
}

.btn-white-fill {
  padding: 8px 24px !important;
  background-color: #ffffff;
  border: 2px solid rgba(255, 255, 255, 0.75) !important;
  color: #5d9cec !important;
  border-radius: 50px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.btn-white-fill:hover {
  border: 2px solid rgba(255, 255, 255, 0.75) !important;
  background-color: transparent;
  color: #ffffff !important;
}

.btn-white-bordered {
  padding: 8px 24px !important;
  background-color: transparent !important;
  border: 2px solid rgba(255, 255, 255, 0.75) !important;
  color: #ffffff;
  border-radius: 50px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.btn-white-bordered:hover {
  background-color: #ffffff !important;
  color: #5d9cec !important;
}

.btn-custom {
  padding: 8px 24px !important;
  background-color: #5d9cec !important;
  border: 2px solid #5d9cec !important;
  color: #ffffff !important;
  border-radius: 50px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.btn-custom:hover {
  background-color: transparent !important;
  color: #5d9cec !important;
}

.video-btn {
  color: #ffffff !important;
  letter-spacing: 1px;
  outline: none !important;
}

.video-btn i {
  margin-right: 7px;
  width: 20px;
  height: 20px;
  border: 2px solid #fff;
  border-radius: 50%;
  line-height: 17px;
  vertical-align: middle;
  text-align: center;
  font-size: 12px;
  padding-left: 3px;
  margin-left: -12px;
}

/*======= 4.Dropdown ======= */
.dropdown-menu {
  box-shadow: none;
  padding: 4px;
  border-radius: 4px !important;
  -webkit-animation: dropdownOpen 0.3s ease-out;
  -o-animation: dropdownOpen 0.3s ease-out;
  animation: dropdownOpen 0.3s ease-out;
  border: 2px solid #eee;
}

.dropdown-menu > li > a {
  padding: 6px 20px;
  font-size: 15px !important;
  color: #496174 !important;
}

.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover {
  background-color: #5d9cec;
  color: #ffffff !important;
}

@-webkit-keyframes dropdownOpen {
  0% {
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes dropdownOpen {
  0% {
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    opacity: 0;
  }
  100% {
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}

/* Modals */
.modal .modal-dialog .modal-content {
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  border-color: #DDDDDD;
  border-radius: 2px;
  box-shadow: none;
  padding: 25px;
}

.modal .modal-dialog .modal-content .modal-header {
  border-bottom-width: 2px;
  margin: 0;
  padding: 0;
  padding-bottom: 15px;
}

.modal .modal-dialog .modal-content .modal-body {
  padding: 20px 0;
}

.modal .modal-dialog .modal-content .modal-footer {
  padding: 0;
  padding-top: 15px;
}

/*===== 5. Navbar Custom ======*/

.zoom {
}

.zoom:hover {
  transform: scale(2.5); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}

.navbar-custom {
  width: 100%;
  border-radius: 0px;
  z-index: 999;
  padding: 20px 0px;
  margin-bottom: 0px;
  -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;
  /*background-color: rgba(60, 64, 70, 0.9);*/
}

.navbar-custom .navbar-nav li a {
  color: rgba(255, 255, 255, 0.75);
  font-size: 15px;
  margin: 5px 0px;
}

.navbar-custom .nav>li>a:focus,.navbar-custom .nav>li>a:hover,.navbar-custom .navbar-nav li.active a {
  background-color: transparent;
  color: #ffffff;
}

.navbar-toggle .icon-bar {
  background-color: #ffffff;
}

.navbar-btn {
  padding: 5px 20px !important;
  text-transform: none !important;
  font-weight: 400;
  margin-top: 8px !important;
}

.logo {
  font-weight: 700;
  font-size: 22px;
  color: #ffffff !important;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.navbar-toggle {
  font-size: 30px;
}

.navbar-custom .btn-custom {
  margin-top: 8px;
  margin-left: 20px;
}

.nav .open>a, .nav .open>a:focus, .nav .open>a:hover {
  background-color: transparent;
  /*border-color: #337ab7;*/
}

.sticky-wrapper {
	position: absolute;
	width: 100%;
}

.sticky-wrapper.is-sticky .navbar-custom {
	padding: 10px 0px !important;
  background: linear-gradient(135deg, #52b997, #206d99, #c7dfd9);
}

.sticky-wrapper.is-sticky .navbar-custom .logo span.text-custom {
  color: #ffffff !important;
}


/*======= 6. Home =======*/

.home-fullscreen {
  height: 100%;
  min-height: 400px;
}

.home-wrapper {
  padding: 220px 0px 170px 0px;
}

.home-sm {
  padding: 175px 0px 125px 0px !important;
}
.home-sm .h1 {
  margin-top: 30px !important;
}
.home-wrapper-alt{
  display: table-cell;
  vertical-align: middle;
}

.home-wrapper h2{
  line-height: 46px;
  width: 85%;
  margin: 0 auto;
  text-transform: uppercase;
}

.home-wrapper h4 {
  line-height: 28px;
  font-weight: 400;
  width: 80%;
  font-size: 16px;
  margin: 30px auto 50px auto;
}

.full-screen {
  display: table;
  height: 100%;
  width: 100%;
}

.or-space {
  margin: 0 20px;
}

iframe {
  max-width: 100%;
}

.frame-border {
  border: 9px solid rgba(0, 0, 0, 0.3);
  webkit-border-radius: 5px 5px 5px 5px;
  -moz-border-radius: 5px 5px 5px 5px;
  border-radius: 5px 5px 5px 5px;
}

/* ==== 7. FEATURES ==== */

.feat-description p {
  margin-top: 20px;
  margin-bottom: 20px;
  line-height: 26px;
}

.feat-description h4 {
  font-weight: 300;
  line-height: 28px;
}

.title-box-icon i {
  font-size: 48px;
  margin-bottom: 20px;
}

.title-box-icon h3 {
  margin-bottom: 70px;
}

.features-box {
  margin-top: 30px;
  padding: 20px;
  text-align: center;
}

.features-box i {
  font-size: 48px;
  color: #5d9cec;
  line-height: 54px;
}

.features-box p {
  line-height: 24px;
  margin-top: 20px;
}



/* ==== 8. Pricing === */

.pricing-column {
  position: relative;
  margin-bottom: 40px;
}

.pricing-column .inner-box {
  position: relative;
  margin: 20px auto 0px auto;
  max-width: 320px;
  padding: 0px 30px 50px;
  background-color: #f3f6fa;
  border-radius: 5px;
}

.inner-box p {
  padding: 0px 20px;
  text-align: center;
  font-size: 15px;
  line-height: 26px;
  color: #7f7f7f;
  margin-bottom: 30px;
}

.pricing-column .plan-header {
  position: relative;
  padding: 30px 20px 25px;
}

.pricing-column .plan-title {
  font-size: 16px;
  margin-bottom: 10px;
  color: #5d9cec;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: 400;
}

.pricing-column .plan-price {
  font-size: 38px;
  margin-bottom: 10px;
  font-weight: 700;
}

.pricing-column .plan-duration {
  font-size: 13px;
  color: #98a6ad;
}

.pricing-column .plan-stats {
  position: relative;
  padding: 30px 20px 15px;
}

.pricing-column .plan-stats li {
  margin-bottom: 15px;
  line-height: 24px;
}

.pricing-column .plan-stats li i {
  font-size: 18px;
  width: 26px;
  vertical-align: middle;
}



/* === 9.Testimonials === */

.testimonial-box {
  color: #ffffff;
}

.testimonial-box h4 {
  font-size: 16px;
  line-height: 30px;
}

.testimonial-box .testi-user {
  width: 48px !important;
  margin: 10px auto;
}


/* === 10. SUBSCRIBE === */

.input-subscribe {
  background-color: transparent;
  color: #fff;
  border: 2px solid rgba(255, 255, 255, 0.4);
  height: 50px;
  padding-left: 20px;
  box-shadow: none !important;
}

.input-subscribe:focus {
  border: 2px solid rgba(255, 255, 255, 0.6);
}

input.input-subscribe::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.4);
  font-weight: normal;
}

input.input-subscribe:-moz-placeholder {
  color: rgba(255, 255, 255, 0.4);
}

input.input-subscribe::-moz-placeholder {
  color: rgba(255, 255, 255, 0.4);
}

input.input-subscribe:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.4);
}



/*======= 11 Footer =======*/

.footer {
  padding-top: 20px;
  padding-bottom: 20px;
  background-color: #2f3e47;
}

/* Social */

ul.social-icons {
  padding: 0;
  margin: 0;
  margin-top: 10px;
}
ul.social-icons li {
  list-style: none;
  display: inline-block;
  margin-left: 6px;
}
ul.social-icons li:first-child {
  margin-left: 0px;
}
ul.social-icons li a {
  display: inline-block;
  margin: 0;
  width: 30px;
  height: 30px;
  background-color: rgba(255, 255, 255, 0.3);
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  -o-border-radius: 50px;
  border-radius: 50px;
  text-decoration: none;
  text-align: center;
  transition: all 0.17s ease-in-out;
  -moz-transition: all 0.17s ease-in-out;
  -webkit-transition: all 0.17s ease-in-out;
  -o-transition: all 0.17s ease-in-out;
}
ul.social-icons li a:hover {
  background-color: #ffffff;
}
ul.social-icons li a i {
  color: #2c3035;
  font-size: 15px;
  line-height: 30px;
  transition: all 0.17s ease-in-out;
  -moz-transition: all 0.17s ease-in-out;
  -webkit-transition: all 0.17s ease-in-out;
  -o-transition: all 0.17s ease-in-out;
}
.footer .navbar-nav {
  margin-top: 10px;
}
.footer .navbar-nav li a {
  color: rgba(255, 255, 255, 0.7);
  background-color: transparent !important;
}


/* == 12. Other pages CSS === */

.header-title-box {
  padding-top: 190px;
  padding-bottom: 155px
}

.header-title-box h3 {
  font-size: 30px;
  font-weight: 300;
}

.title-about h3 {
  margin-bottom: 30px;
}

.wide-img-showcase-row {
  position: relative;
}

.no-padding.img {
  background: url(../images/showcase-1.jpg) scroll center no-repeat;
  background-size: cover;
  position: absolute;
  height: 100%;
}

.no-padding.img-2 {
  background: url(../images/showcase-2.jpg) scroll center no-repeat;
  background-size: cover;
  position: absolute;
  height: 100%;
}

.about-detail-img-box {
  padding: 15% 0;
}


/* == 12.1 Contact ==*/
textarea {
  max-width: 100%;
}

.contact-form .form-control {
  height: 42px;
  box-shadow: none;
  border: 2px solid rgba(40, 40, 46, 0.3);
}

textarea.form-control {
  height: auto !important;
}

.error {
  margin: 8px 0px;
  display: none;
  color: red;
}

#ajaxsuccess {
  font-size: 16px;
  width: 100%;
  display: none;
  clear: both;
  margin: 8px 0px;
}

.contact-box {
  padding: 30px;
}

.contact-detail {
  margin-bottom: 40px;
}
.contact-detail i{
  float: left;
  width: 40px;
  font-size: 24px;
}

.contact-detail p,.contact-detail address{
  overflow: hidden;
}

.contact-detail a {
  color: #496174;
}
.parsley-error {
  border: 2px solid red !important;
}
.parsley-errors-list {
  padding-left: 0px;
}
.parsley-errors-list li {
  list-style: none;
  color: red;
  margin-top: 3px;
  font-size: 13px;
}

/*== 12.2 Team ==*/

.team img {
  max-width: 240px;
  margin: 0px auto;
  background-color: #fafafa;
}

.team .team-member {
  margin: 30px 0px;
}

.team .team-member h4 {
  padding-top: 10px;
  margin-bottom: 5px;
}

.team .team-member p {
  margin-bottom: 0px;
}

/* ==== 12.3 FAQ ==== */
.question {
  margin-top: 40px;
  font-weight: 400;
  font-size: 16px;
}

/* === 12.4 JOB ===*/
.job-box {
  padding: 20px 30px;
  background-color: #f3f6fa;
  border: 1px solid #E6EDF3;
  border-radius: 5px;
  margin-bottom: 30px;
}

.job-box h5 {
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 15px;
}

.btn-job {
  padding: 6px 20px !important;
  font-size: 12px;
  text-transform: none;
  margin-top: 10px;
}

/* == 12.5 Intro Form ===*/
.intro-form {
  background-color: #ffffff;
  padding: 30px;
  border-radius: 5px;
  -webkit-box-shadow: 0px 22px 45px -15px rgba(0,0,0,0.5) !important;
  -moz-box-shadow: 0px 22px 45px -15px rgba(0,0,0,0.5) !important;
  box-shadow: 0px 22px 45px -15px rgba(0,0,0,0.5) !important;
}

.intro-form h3{
  color: #949799;
  font-size: 20px;
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 30px;
  margin-top: 0px;
}

.intro-form input {
  border: 1px solid #eee;
  height: 38px;
  box-shadow: none !important;
}
.intro-form input:focus {
  border: 1px solid #5d9cec;
}

.intro-form .form-group:last-of-type {
  margin-bottom: 0;
}




/*======= 13. Responsive ======*/
@media (min-width: 768px) {
  .nav-custom-left {
    margin-left: 5%;
  }
  .navbar-nav>li>a {
    padding-top: 10px;
    padding-bottom: 10px;
  }
}

@media (max-width: 767px) {
  .navbar-custom {
    padding: 10px 0px !important;
    /*background-color: #5d9cec;*/
  }
  .navbar-custom .logo span.text-custom {
    color: #ffffff !important;
  }
  .navbar-btn {
    margin: 8px 20px 0 !important;
  }
  .video-wrapper {
    padding-top: 50px;
  }
  .intro-form {
    margin-top: 50px;
  }
  .feat-description {
    margin-bottom: 50px;
    text-align: center;
  }
}