@charset "utf-8";
/* CSS Document */




@font-face {
    font-family: cool;
    src: url(antipasto-regular.ttf);
}
/* css for home page  */

*
{
  margin:0;
  padding:0;
font-family: 'Raleway', sans-serif;

text-transform: uppercase;

}



#body
{
      width: 100%;
      height: 100%;
      border: 0;
      background-color: black;
      display: block;
    overflow: auto;
    -ms-overflow-style: none; /* IE 11 */
    scrollbar-width: none; /* Firefox 64 */
}

::-webkit-scrollbar {
    width: 0px;  /* Remove scrollbar space */
    background: transparent;  /* Optional: just make scrollbar invisible */
}
/* Optional: show position indicator in red */
::-webkit-scrollbar-thumb {
    background: #FF0000;
}


/* unvisited link */
a:link {
  color: silver;
}

/* visited link */
a:visited {
  color: silver;
}

/* mouse over link */
a:hover {
  color: whitesmoke;
}

/* selected link */
a:active {
  text-decoration: underline;
}

h3{
  color: #c0c0c0;
}

p{
  color: white;
}

#ytplayer{width: 100%; height: 100%;}

form input {padding: 5%;}
form textarea {padding: 5%;}

#content{
  padding-top: 5%;
  padding-left: 10%;
  text-align: left; 
  width: 50%; 
  display: none;
}

#photos{
  display:none; 
  width: 65%; 
  position: absolute; 
  top: 25%; 
  left: 20%; 
  height: 75%; 
  overflow-y: scroll;
}

.photo-sample{
cursor: pointer;
padding-left: 5%;
}

.photo-like{
  z-index: 100;
  width: 50px;
  position: absolute;
  bottom: 3%;
  left: 1%;
  padding: 3%;
  background-color: rgba(255,255,255,0.9);
  display: none;
}

.photo-sample:hover .photo-like{
display: block;
}



#contact{
color: white;
font-weight: bold;
font-size: 21px;
float: right;
margin-right: 5%;
}


::-webkit-input-placeholder { /* Edge */
  text-decoration: underline;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  text-decoration: underline;
}

::placeholder {
  text-decoration: underline;
}

/* css for 3D-Background */


#mediaHbg{
  position: fixed;
  top: 50%;
  left: 50%;
  width: 90%;
  height: auto;
  z-index: -100;
  transform: translate(-50%, -50%);
}






  @media only screen and (max-width: 1100px) {
  #menu {
    clear: left; width: 100%;
  }

  #menu h3 { font-size:31px; padding-left: 5%; z-index: 1000; }
  #content { font-size:1.5em; }
  #overlay {
    position: absolute; top:5%; text-align: left; width: 85%;
  }



#content{position: absolute; top:33%; left:0%; text-align: center; width: 90%; height: auto; display: none;}
  
  #photos{
  display:none; 
  width: 65%; 
  position: absolute; 
  top: 20%; 
  left: 20%; 
  height: 75%; 
  overflow-y: scroll;
}

  #graphics{
  display:none; 
  width: 65%; 
  position: absolute; 
  top: 20%; 
  left: 20%; 
  height: 75%; 
  overflow-y: scroll;
}