/*  =============================================================================
    
    Copyright © Vent Origins 
    By Adrian Mandee and Randy Truong
    ========================================================================== */

/*Overall search box of Splash Screen*/
#search-box {
  height: 100vh;
  font-size: 0px;
  text-align: center;
  position: relative;
}

#title-splash-screen {
  height: 200px;
  min-width: 520px;
  text-align: center;
}

/*Title of the splash screen*/
#title-splash-screen h1 {
  /*Displays the h1's in line*/
  display: inline;
  /*To see the left side of the V in vent*/
  padding-left: 10px; 
  /*Font*/
  color: white;
  font-size: 150px;
  font-weight: 1000;

  
  /*Transparency*/
  opacity: .95;
}

/*Part of the title of the splash screen*/
#title-splash-screen #hash-tag {
  /*Font*/
  color: #71B500;
  /*font-size: 150px;*/
  font-weight: 1000;
  

  /*Transparency*/
  opacity: .7
}

/* FORMS */
#query-box {
  height: 300px;
  margin: auto;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  position: absolute;

}
/*Both submit and query box*/
#input-group {
  padding-left: 20px;
}

/*SEARCH BOX*/
#input-query-box {
  width: 500px;
  height: 30px;
  margin-top: 30px;

  /*Adds spacing for the text inside the search box*/
  padding-left: 15px;
  padding-right: 15px;

  /*Font*/
  font-size: 18px;

  /*Border*/
  border: none;
  border-top-right-radius: 50px 50px;
  border-top-left-radius: 50px 50px;
  border-bottom-right-radius: 50px 50px;
  border-bottom-left-radius: 50px 50px;
  opacity: .7;

  /*Font for the Search Icon*/
  /*NOTE: adding Open Sans for some reason doesn't cut off a part of the icon*/
  font-family: 'Open Sans', FontAwesome;
}

#input-query-box:focus {
  opacity: .9;
}

/*SUBMIT BUTTON*/
#button-query-box {
  width: 80px;
  height: 25px;
  margin-top: 15px;

  /*Submit button color*/
  background-color: #71B500;

  /*Font*/
  font-size: 14px;
  color: white;
  text-shadow: -1px 0px 1px black, 1px 0px 1px black, 2px 2px 2px black;

  /*Border*/
  border: solid 0px;
  border-top-right-radius: 50px 50px;
  border-top-left-radius: 50px 50px;
  border-bottom-right-radius: 50px 50px;
  border-bottom-left-radius: 50px 50px;
  opacity: .7;
  outline: none;
}

#button-query-box:hover {
  border: solid 2px white;
  opacity: 1.0;
}

@media screen and (max-width: 900px) {
    #title-splash-screen h1 {
      font-size: 100px;
    }
}