/*
Theme Name: EthanLabs
Text Domain: EthanLabs
Version: 1.0
Description: Simple theme for Ethan Labs
Author: Latasha Wanjira
 */
:root {
  --primary-blue: #00c9fe;
  --primary-yellow: #E8b35A;
  --heading-colour: #000000;
  --text-colour: #848484;
  --secondary-colour: #D0E0D9;
}

@font-face {
  font-family: MyriadPro-Regular;
  src: url(https://ethanlabs-et.com/wp-content/themes/ethanLabs/fonts/MyriadPro-Regular.otf);
  font-weight: normal;
}

@font-face {
  font-family: MyriadPro-Bold;
  src: url(https://ethanlabs-et.com/wp-content/themes/ethanLabs/fonts/MyriadPro-Bold.otf);
  font-weight: normal;
}

html {
  scroll-behavior: smooth;
}

body {
  color: var(--text-colour);
  font-family: "MyriadPro-Regular";
  overflow-x: hidden;
  font-size: 18px;
}

h1, h2, h3, h4, h5, h6, .wpforms-title {
  color: var(--heading-colour);
  font-family: "MyriadPro-Bold";
}

h6 {
  color: var(--text-colour);
}

button, button a {
    font-family: "MyriadPro-Bold";
}

a, a:hover{
  color: inherit;
  text-decoration: none;
}

.btn-blue {
	background: var(--primary-blue);
	color: white;
}

/* NAVBAR STYLING */
.navbar-contact {
  background: var(--primary-blue);
  position: fixed;
  width: 100vw;
  top: 0;
  z-index: 1001;
  text-align: right;
  color: white;
}

.navbar-contact p {
  margin: 8px 0;
  font-size: 14px;
  color: white;
}

.navbar {
  background: none;
/*   top: 37px; */
  transition: 0.5s;
}

.navbar .navbar-brand img {
  height: 70px;
  width: auto;
}

.white-logo {
  display: block;
}

.green-logo {
  display: none;
}

.navbar-nav .nav-item, .nav-link {
  padding: 0px 10px;
  color: #FFFFFF;
}

.navbar-nav .nav-link {
  position: relative;
  color: #FFFFFF;
  font-size: 1.2rem !important;
}

.navbar-nav .active .nav-link, .scrolled .navbar-nav .active .nav-link {
  color: var(--primary-blue);
}

/* Scrolled Navbar Styling */
.navbar.scrolled {
  background-color: #FFFFFF;
  box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.3);
}

.scrolled .white-logo {
  display: none;
}

.scrolled .green-logo {
  display: block;
}

.navbar.scrolled .navbar-brand img {
  height: 60px;
  width: auto;
}

.scrolled .navbar-nav .nav-link {
  color: var(--primary-blue);
}

.scrolled .navbar-nav .nav-item {
  padding: 0 10px 10px 10px;
}

.post-header {
  height: 53vh;
  background: linear-gradient(rgba(0, 95, 90, 0.5), rgba(0, 95, 90, 0.5)), url("https://ethanlabs-et.com/wp-content/themes/ethanLabs/assets/images/header.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
  margin-bottom: 50px;
}

h1.post-title {
  text-align: center;
}

hr {
  border-bottom: 5px solid #bcf0ff;
  width: 150px;
  position: relative;
  left: 44%;
}

/* FOOTER STYLING */
footer {
  padding: 2rem 0;
  background: #000;
}

.site-footer {
  color: #f5f5f5;
  padding: 50px 0px;
  border-top: 1px solid white;
}

.site-footer .heading h2 {
  color: #f5f5f5;
  text-align: center;
}

.motto {
  background-color: white;
  color: black;
  padding: 20px;
  text-align: center;
  border-radius: 20px;
}

/* Contact Forms */

div.wpforms-container-full .wpforms-form input[type=date], div.wpforms-container-full .wpforms-form input[type=datetime], div.wpforms-container-full .wpforms-form input[type=datetime-local], div.wpforms-container-full .wpforms-form input[type=email], div.wpforms-container-full .wpforms-form input[type=month], div.wpforms-container-full .wpforms-form input[type=number], div.wpforms-container-full .wpforms-form input[type=password], div.wpforms-container-full .wpforms-form input[type=tel], div.wpforms-container-full .wpforms-form input[type=text], div.wpforms-container-full .wpforms-form input[type=time], div.wpforms-container-full .wpforms-form input[type=url], div.wpforms-container-full .wpforms-form input[type=week], div.wpforms-container-full .wpforms-form select, div.wpforms-container-full .wpforms-form textarea {
	border: 0 !important;
    border-bottom: 1px solid #ccc !important;
    height: 30px !important;
}

div.wpforms-container-full .wpforms-form input[type=submit], 
div.wpforms-container-full .wpforms-form button[type=submit] {
    background-color: #005f5a !important;
	border: 0 !important;
    border-radius: 5px !important;
    color: #fff !important;
}

.subscription .wpforms-field-medium.wpforms-field-required{
    padding: 20px 10px !important;
    min-width: 500px !important;
}

form#wpforms-form-19.wpforms-validate.wpforms-form {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

button#wpforms-submit-19.wpforms-submit {
    background-color: #E8b35A !important;
    color: #005F5A !important;
}

.subscription-area h5 {
	color: white !important;
 }

@media screen and (max-width: 992px) {
  .navbar {
    background: rgba(0, 96, 91, 0.7); 
  }
  
  .navbar {
  background: none;
  transition: 0.5s;
    top: 60px;

}

  .navbar .navbar-brand img {
    height: 50px;
  }

  .navbar.scrolled .navbar-brand img {
    height: 40px;
  }

  .fa-bars {
    color: white;
  }

  .scrolled .fa-bars {
    color: var(--primary-blue);
  }

  .navbar-collapse.collapse.show {
    background-color: RGBA(0, 95, 90, 1);
    transition: background-color 0.5s;
    padding: 20px 10px;
  }
  
  .scrolled .navbar-collapse.collapse.show {
    background-color: #fff;
    padding: 0;
  }
  
  form#wpforms-form-19.wpforms-validate.wpforms-form {
    flex-wrap: wrap;
  }
}

.form-control {
	border: 1px solid #ccc !important;
}

@media screen and (max-width: 500px) {
.subscription .wpforms-field-medium.wpforms-field-required{
    min-width: 100% !important;
}
  .navbar {
    top: 40px;
    padding:0.5rem;
  }
}