@font-face {
    font-family: 'Iranian Sans';
    src: url('/fonts/iran_sans.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
html {

  margin:0;
  padding:0;
}

body {

  
  background-color:#395D6D;
  margin:auto;
}

.container {

  margin:auto;
  width:80%;
  text-align: center;
  position:relative;
  height:100vh;

}
.text {


  width:30%;
  text-align: center;
  z-index: 0;
  position:absolute;
  background-color:white;
  padding-bottom:3rem;
  padding-top:3rem;
  padding-left:3rem;
  padding-right:3rem;
  left:0;
  right:0;
  margin-right:auto;
  margin-left:auto;
  top:30%;
  box-shadow: 7px 7px 10px #27414C;
  justify-content: space-around;
  align-items:center;
  flex-wrap:wrap;

}


h1 {
    font-family: 'Iranian Sans','B Nazanin',Tahoma;
    font-weight: 900;
    font-size: 2rem;
    text-align: center;
    margin: auto;
    color: #395D6D;
    /*letter-spacing: .10rem;*/
    padding-bottom: .5rem;
}

h2 {
    font-family: 'Iranian Sans','B Nazanin',Tahoma;
    font-weight: 400;
    font-size: 1rem;
    text-align: center;
    margin: auto;
    color: #395D6D;
    /*letter-spacing: .10rem;*/
    padding-bottom: 2rem;
}

h3 {
    font-family: 'Iranian Sans','B Nazanin',Tahoma;
    font-weight: 900;
    font-size: .8rem;
    text-align: center;
    margin: auto;
    /*letter-spacing: .10rem;*/
}

.button {

  width:6rem;
  border:3px solid #FCA671;
  margin:auto;
  text-align:center;
  padding:.5rem;
  color:#FCA671;
}

#home:hover {
  background-color:#FCA671;
  color:white;
}


svg {
  text-align: center;
  position: absolute;
  left:0;
  right:0;
  margin-left:auto;
  margin-right:auto;
  height:100%;
  
}


#hotel-top {
 
  -webkit-animation: fall-8 8s ease-in infinite;
  opacity: .5;
}


#left-martini-page {

-webkit-animation: fall-8 8s ease-in infinite;
opacity: .5;

        
}

#top-spa {

  -webkit-animation: fall-7 7s ease-in infinite;
  .opacity:.75;
  

}

#chemistry-big {

  -webkit-animation: fall-12 12s ease-in infinite;


}

#comp-big {

  -webkit-animation: fall-13 13s ease-in infinite;

          animation: fall-13 13s ease-in infinite;
  opacity: .5;
}

#martini-bottom {

  -webkit-animation: fall-12 12s ease-in infinite;

          animation: fall-12 12s ease-in infinite;
  
  

}

#spa-bottom {

 -webkit-animation: fall-10 10s ease-in infinite;

         animation: fall-10 10s ease-in infinite;
  
}

#hotel-bottom {

  -webkit-animation: fall-10 10s ease-in infinite;
  opacity:.25;

}

#chemistry-little {

  -webkit-animation: fall-8 8s ease-in infinite;
 
}

#hotel-tiny {

  -webkit-animation: fall-10 10s ease-in infinite;  
}

#chemistry-top-right {

  -webkit-animation: fall-10 10s ease-in infinite;
  
}

#comp-little {

  -webkit-animation: fall-7 7s ease-in infinite;

}

.page-fall2 {

  -webkit-animation: fall-12 12s ease-in infinite;
  


}

.page-fall3 {

  -webkit-animation: fall-13 13s ease-in infinite;
  opacity: .5;

}

@-webkit-keyframes fall-13 {
  from{
    -webkit-transform: translateY(-700px);
            transform: translateY(-700px);
  }
  to {
    -webkit-transform: translateY(800px);
            transform: translateY(800px)
  }
}

@-webkit-keyframes fall-7 {
  from{
    -webkit-transform: translateY(-700px);
            transform: translateY(-700px);
  }
  to {
    -webkit-transform: translateY(800px);
            transform: translateY(800px)
  }
}

@-webkit-keyframes fall-8 {
  from{
    -webkit-transform: translateY(-700px);
            transform: translateY(-700px);
  }
  to {
    -webkit-transform: translateY(800px);
            transform: translateY(800px)
  }
}

@-webkit-keyframes fall-10 {
  from{
    -webkit-transform: translateY(-700px);
            transform: translateY(-700px);
  }
  to {
    -webkit-transform: translateY(800px);
            transform: translateY(800px)
  }
}

@-webkit-keyframes fall-12 {
  from{
    -webkit-transform: translateY(-700px);
            transform: translateY(-700px);
  }
  to {
    -webkit-transform: translateY(800px);
            transform: translateY(800px)
  }
}