/* 
Theme Name: Equine 
Text Domain: Template
Version: 1.6
Description: Equine Website 
Tags: banner, horse, business, therapy, military
Author: Adam Hoidahl
Author URI: https://hoidahlresume.herokuapp.com/
*/
img.alignright { float: right; margin: 0 0 1em 1em; }
img.alignleft { float: left; margin: 0 1em 1em 0; }
img.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.alignright { float: right; }
.alignleft { float: left; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }



.gal-img-wrap{
  position: relative;
  height: 18.75rem;
  filter: grayscale(0%);
  transition: 0.4s ease;
}

.gal-img-wrap:hover {
  cursor: pointer;
  opacity:.8;
  filter: grayscale(100%);
  opacity: 1;
}

.gal-img-wrap.zoom {
  transform: scale(1.5);
  filter: grayscale(0%);
  border-radius:20px;
}
.gal-img-wrap.ontop {
  z-index: 99;
}

/* Accordion Styles */
.accordion-container{
  position: relative;
  width: 90%;
  height: auto;
  margin: 10px auto;
}

.set{

  margin:5px;
  position: relative;
  width: 100%;
  height: auto;
  background-color: transparent;
}
.set > a{
  display: block;
  border-radius:20px;
  padding: 10px 15px;
  text-decoration: none;
  background-color: #3774AA;
  color: white;
  font-weight: 600;
  -webkit-transition:all 0.2s linear;
  -moz-transition:all 0.2s linear;
  transition:all 0.2s linear;
}
.set > a i{
  float: right;
  margin-top: 2px;
}
/* .set > a.active{

} */
.content{
background-color:transparent;
  display:none;
}
/* END ACCORDION STYLES */

p {padding:0;}
/* Modal Styles */
/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  z-index: 10000; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.parallax {
  background-position: center;
  position: relative;
}

/* Modal Content */
.modal-content {
  background-color: #fefefe;
 
  padding: 20px;
  width: 80%;
}

/* The Close Button */
.close {
  color: #aaaaaa;
  margin-left:auto;
  font-size: 35px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}
/* END MODAL STYLES */

html, body{
    scroll-behavior: smooth;
    position: relative;
    font-family: 'Raleway', sans-serif;
	overflow-x:hidden;
  background-color: #F7F9FA;
  } 
  * {
    margin:0;
    padding:0;
    box-sizing: border-box;
  }
  h1, h2, h3, .titlefont {
    font-family: 'Bebas Neue', cursive;
  }
  .logopic {max-height:100%;}
/* Bootstrap rows have padding automatically. Take that away: */
.row {padding: 0;
  margin: 0;
max-width:100%;}
.pagebannerimage {z-index:100;}
  .overflowwrap {
    overflow-y: hidden;
  }

  #wpcf7-f210-p7-o1, #wpcf7-f210-o1 {max-width:90%;
  margin:auto;}
  .container {max-width:75%;}
.lineheight-sm {line-height: 100%;}
.title {font-size: 80px;}
.display-3 {font-weight:300;}
#contact {
	background-size:cover;
background-attachment:fixed;
background-position:left;}
 html {scroll-behavior: smooth;} 
 .greenback {background-color: #63715a;}
 .greentext {color: #63715a;}
 .bluetext {color: rgb(2,33,53);}
 .redback {background-color:#DA5857}
 .red {color:#DA5857}
 .blueback {background-color:rgb(2,33,53);}
 .darkblue {color: rgb(2,33,53);}
 .darkblueback {background-color: rgb(2,33,53);}
 .lightblue {color: #D0E0EA;}
 .lightblueback {background: rgb(2,33,53);}
 .nav-link {color: #1E496B !important;}
 .btn:not(.myBtn_multi):hover {color:#1E496B!important;}
 .menu-item {
  -ms-flex-preferred-size:0;
  flex-basis:0;
  -ms-flex-positive:1;
  flex-grow:1;
  text-align:center;
  margin-bottom: 10px;
 }
.lightred {color:rgb(205, 0, 0);}
a {text-decoration: none !important;
color:#1E496B; }
.greyback{background-color: #e7e9ec;
padding: 70px;}
ul {list-style-type: none;}
li {margin-top: 10px}

.ontop {z-index: 2000;}
.inmiddle {z-index:1000}
.under{z-index: -2000;}
.opacity-1 {opacity:.2}
.opacity-4 {opacity: .6;}
.opacity-5 {opacity: 1;}

.h-viewport {height:calc(var(--vh, 1vh)*100);}


#header {
background-image: url(/wp-content/uploads/2021/05/flagback-scaled.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
background-position: top;
background-size:cover;}


.bold {font-weight:800;}
.btn-grey {background-color: #c1c6bd;
border-radius: 0; 
border: none;
color: #0f224f;
font-weight: bold;}
.navbar {height: 200px;
  top:0;
  background-color:rgb(2,33,53);
z-index: 1000;}


#about {
padding-top:50px;
padding-bottom:50px;}
.military {border-bottom:5px solid white;
}
.fillerpic {height:500px;
background: url(http://equineimmersion.flywheelstaging.com/wp-content/uploads/2021/05/shutterstock_1183176739-scaled.jpg);
background-size: cover;
background-position:center;
background-attachment:fixed;}
#desktopheader {height:calc(var(--vh, 1vh)*100);}


/* ANIMATIONS */
.delay {    animation-delay: 200ms;}
.delay-md {    animation-delay: 400ms;}
.delay-long {    animation-delay: 600ms;}
.delay-xlong {    animation-delay: 3000ms;}
.blinker {
  opacity: 0;
  animation: blinker 1s linear infinite;
  animation-delay:3s;
}
@keyframes blinker {
  50% {opacity:100;}
}


/* Scroll Reveal */
.has-scroll-reveal { opacity: 0; animation-play-state: paused;}
      
.animated {
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
    animation-play-state: running;
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}
.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

/* scroll reveal end */

/* HoverExpand */
.hoverexpand {
  transition: all .2s ease-in-out;}
  .hoverexpand:hover{ transform: scale(1.1);
  }

  /* Moving Arrows */
  .arrow {
    transition: 0.3s;

  }
  .arrowbutton:hover + .arrow {
    transform: translateX(10px);
  }
  .btn-secondary:hover + .arrow {
    transform: translateX(15px);
  }

  .btn-secondary:hover {
    background-color:#0f224f;
  }
  /* Hover Underline */
.hoverunderline:hover {background:transparent;
  color: #1E496B;}
  .hoverunderline::after {
      content: '';
      display: block;
      width: 0;
      height: 3px;
      /* Change this color for the reavealed underline: */
      background:  #1E496B;
      transition: width .3s;
   
  }
  
  .hoverunderline:hover::after {
      width: 100%;
  }

  @media only screen and (max-width: 1000px) {
    #header {
      position: relative;
      background-repeat: none;
      background-size: cover;
      background-attachment: fixed;
     width:100%;
     background: url("/wp-content/uploads/2021/05/flagback-scaled.jpg") center;
     background-size: cover;
    } 
    .fillerpic {

position: relative;
height:300px;
background-repeat: none;
background-position:left;
background-size: cover;
background-attachment: fixed;
width:100%;
background: url(http://equineimmersion.flywheelstaging.com/wp-content/uploads/2021/05/shutterstock_1183176739-scaled.jpg);
background-size: cover;
    }

      
    #about .w-50 {
      width:75%!important;
    }
    .display-4 {font-size:25px;}
    .display-3, .display-2 {font-size:40px;}
    
#contact
 {
      position: relative;
      background-repeat: none;
      background-size: cover;
      background-attachment: fixed;
     width:100%;
     background: url("/wp-content/uploads/2021/05/contactback-1-scaled.jpg") center;
     background-size: cover;
    } 


  .fadeIn {opacity:0;
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
  }}
  

  @keyframes fadeIn {
    from {
      opacity: 0;
    }
  
    to {
      opacity: 1;
    }
  }