body {
  color: black;
  background-color: #fff;
  background-repeat: repeat;
  line-height: normal;
  font-size: 11px;


font-family: monospace;
}

.blinking{
	animation:blinkingText 0.8s infinite;
}
@keyframes blinkingText{
	0%{		color: #ff0000;	}
	50%{	color: #0000FF;	}
	100%{		color: #ff0000;	}

}




.scroll-left {
 height: 50px;	
 overflow: hidden;
 position: relative;
 background: yellow;
 color: orange;
 border: 1px solid orange;
}
.scroll-left p {
 position: absolute;
 width: 100%;
 height: 100%;
 margin: 0;
 line-height: 50px;
 text-align: center;
 /* Starting position */
 transform:translateX(100%);
 /* Apply animation to this element */
 animation: scroll-left 15s linear infinite;
}
/* Move it (define the animation) */
@keyframes scroll-left {
 0%   {
 transform: translateX(100%); 		
 }
 100% {
 transform: translateX(-100%); 
 }
}






.ss {
        font-size: 11px;
        white-space: nowrap;
        overflow: hidden;
        animation: typewriter 2s steps(50) infinite alternate,
          blink 800ms steps(50) infinite normal;
        border-right: 5px solid black;
      }

@keyframes typewriter {
        from {
          width: 0%;
        }
        to {
          width: 50%;
        }
      }
      @keyframes blink {
        from {
          border-color: black;
        }
        to {
          border-color: transparent;
        }
      }
      
  
  .image {
    position: absolute;
    top: 90%;
    left: 90%;
    width: 50px;
    height: 50px;
    margin:-60px 0 0 -60px;
    -webkit-animation:spin 1s linear infinite;
    -moz-animation:spin 1s linear infinite;
    animation:spin 1s linear infinite;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }

.float-area{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.floating-img{
  position: absolute;
  top: 25%;
  right: 40%;
  transform: translateY(-10%);
  animation: floater 1.5s infinite;
  transition: ease 0.5s;
  
}



@keyframes floater {
  0%{transform: translateY(-10%);transition: ease 0.5s;}
  50%{transform: translateY(10%);transition: ease 0.5s;}
}






.dropbtn {
  background-color: #FFFFFF;
  color: black;
  font-size: 11px;
  padding: 16px;
  border: none;
  text-decoration: underline;
}

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  display: none;
  background-color: #FFFFFF;
  min-width: 160px;
  z-index: 1;
}

.dropdown-content a {
  color: #0066CC;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-decoration: underline;
}

.dropdown-content a:hover {background-color: #ddd;}

.dropdown:hover .dropdown-content {display: block;}

.dropdown:hover .dropbtn {background-color: #FFFFFF;}

.point {
        width: 111px;
        height: 62px;
        background: url("img/poiinthover.png") no-repeat;
    }
    .point:hover {
        background: url("img/poiint.png") no-repeat;
    }
