::-webkit-scrollbar {
    width: 15px;
    height: 15px;
    border-bottom: 1px solid #eee; 
    border-top: 1px solid #eee;
	-webkit-appearance: none;
}
::-webkit-scrollbar-thumb {
    border-radius: 8px;
    background-color: #C3C3C3;
    border: 2px solid #eee;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.2); 
}

@font-face {
  font-family: Roboto;
  src: url(../fonts/Roboto-Regular.ttf);
}

body{
    font-family: Roboto;
	margin-top: 100px;
}

.table > tbody > tr > td {
     vertical-align: middle;
}

.navbar-toggler>.close {
    display:inline;
}

.navbar-toggler.collapsed>.close, .navbar-toggler:not(.collapsed)>.navbar-toggler-icon {
    display:none;
}

.card-tide{
	width: 100px;
}

@media (max-width: 768px) {
	.navbar-fixed-top {
		box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16);
		max-height: 100vh;
		overflow-y: auto;
	}
	.nav-item {
		margin: 1.5vh 0;
	}
	.navbar-nav {
		margin-bottom: 90vh;
	}  
	.navbar-nav .dropdown-menu {
		display: block;
		position: static;
		float: none;
		width: auto;
		margin-top: 0;
		border: 0;
		-webkit-box-shadow: none;
		box-shadow: none;
	}  
	.navbar-inverse .navbar-nav .dropdown-menu > li > a {
		color: #9d9d9d;
	}
}

@media (min-width: 768px) {
	.nav-dropdown-menu {
		box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16);
		max-height: 40vh;
		overflow-y: scroll;
	}
	.navbar-logo {
		margin-left: 10vh;
	}
}
/* Styling for the snow container */
.snow-container {
  position: fixed; /* or absolute, depending on desired coverage */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none; /* Allows interaction with elements beneath the snow */
  overflow: hidden; /* Prevents scrollbars if snowflakes go off-screen */
  z-index: 9999; /* Ensures snow is on top of other content */
}

/* Styling for individual snowflakes */
.snowflake {
  position: absolute;
  background-color: white;
  border-radius: 50%; /* Makes them circular */
  opacity: 0.8;
  animation: snowfall linear infinite; /* Apply the animation */
}

/* Keyframes for the snowfall animation */
@keyframes snowfall {
  0% {
    transform: translateY(-100%) translateX(0);
    opacity: 0;
  }
  20% {
    opacity: 1;
  }
  100% {
    transform: translateY(100vh) translateX(var(--random-x)); /* Customize x-axis movement */
    opacity: 0;
  }
}