/* fonts */
@font-face {
  font-family: 'sf_wasabi_condensedregular';
  src: url('../fonts/SF_Wasabi_Condensed-webfont.eot');
  src: url('../fonts/SF_Wasabi_Condensed-webfont.eot?#iefix') format('embedded-opentype'),
       url('../fonts/SF_Wasabi_Condensed-webfont.woff2') format('woff2'),
       url('../fonts/SF_Wasabi_Condensed-webfont.woff') format('woff'),
       url('../fonts/SF_Wasabi_Condensed-webfont.ttf') format('truetype'),
       url('../fonts/SF_Wasabi_Condensed-webfont.svg#sf_wasabi_condensedregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'tizaregular';
  src: url('../fonts/tiza-webfont.eot');
  src: url('.../fonts/tiza-webfont.eot?#iefix') format('embedded-opentype'),
       url('../fonts/tiza-webfont.woff2') format('woff2'),
       url('../fonts/tiza-webfont.woff') format('woff'),
       url('../fonts/tiza-webfont.ttf') format('truetype'),
       url('../fonts/tiza-webfont.svg#tizaregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'unifrakturmaguntiabook';
  src: url('../fonts/UnifrakturMaguntia-webfont.eot');
  src: url('../fonts/UnifrakturMaguntia-webfont.eot?#iefix') format('embedded-opentype'),
       url('../fonts/UnifrakturMaguntia-webfont.woff2') format('woff2'),
       url('../fonts/UnifrakturMaguntia-webfont.woff') format('woff'),
       url('../fonts/UnifrakturMaguntia-webfont.ttf') format('truetype'),
       url('../fonts/UnifrakturMaguntia-webfont.svg#unifrakturmaguntiabook') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'special_eliteregular';
  src: url('../fonts/SpecialElite-webfont.eot');
  src: url('../fonts/SpecialElite-webfont.eot?#iefix') format('embedded-opentype'),
       url('../fonts/SpecialElite-webfont.woff2') format('woff2'),
       url('../fonts/SpecialElite-webfont.woff') format('woff'),
       url('../fonts/SpecialElite-webfont.ttf') format('truetype'),
       url('../fonts/SpecialElite-webfont.svg#special_eliteregular') format('svg');
  font-weight: normal;
  font-style: normal;
}

/* all */
h1 strong{
  font-family: 'sf_wasabi_condensedregular';
}

h1 em{
  font-family: 'unifrakturmaguntiabook';
}

h1, h2, h6{
  font-family: 'tizaregular';
}

p, li{
  font-family: 'special_eliteregular';
}

/* Header */
#header-style{
  background-image: url("../images/beach_header.jpg");
  background-repeat: no-repeat;
  background-position: center;
  border-style:dashed;
  color: white;
  text-align: center;
  border-width: 10px;
  padding-top: 10px;
  margin-bottom: 10px;
  border-top: none;
  border-bottom: none;
}

header div div h1{
  /* this makes it so the header is always visible no matter the background */
  mix-blend-mode: difference;
}

@media(max-width:500px){
  /* this makes it so the menu button is always visible no matter the background */
  button{
    mix-blend-mode: difference;
  }
}

@media(max-width:804px){
  #about-pic{
    width: 300px;
  }
}

/* Body */
body header{
  background: rgb(185,167,147);
  background: linear-gradient(0deg, rgba(185,167,147,1) 0%, rgba(167,196,202,1) 100%); 
  background-repeat: no-repeat;
}

#menu-list-main{
  font-family: 'tizaregular';
}

#mid-section{
  border: dashed;
  border-top: none;
  border-bottom: none;
  margin-bottom: 10px;
}

/* carousel area */
#carousel-area{
  border: dashed;
  border-top: none;
  border-bottom: none;
  margin-bottom: 40px;
}

/* footer */
#footer-style{
  border-style:dashed;
  color: white;
  border-width: 10px;
  border-top: none;
  margin-top: 40px;
}

body footer{
  background: rgb(167,196,202);
  background: linear-gradient(0deg, rgba(167,196,202,1) 0%, rgba(185,167,147,1) 100%); 
}

/* Link's Style */
.links-style a:link{
  color:white;
  text-decoration: none;
}

.links-style a:visited{
 color: white;
 text-decoration: none;
}

.links-style a:hover{
  color: red;
}

/* Form Style */
form {
  width: 300px;
  margin: auto;
  background: rgb(167,196,202);
  background: linear-gradient(0deg, rgba(167,196,202,1) 0%, rgba(185,167,147,1) 100%); 
  text-align: center;
  float:none;
  font-family: 'special_eliteregular';
}

form legend {
  border-bottom: 2px solid white;
  width: 100%;
  font-size: larger;
  font-family: 'special_eliteregular';
  text-align: center;
}