/* @media only screen and (min-width: 992px) { */

/* 
@font-face {
  font-family: "Open Sans";
  src: url("SFNSRounded.ttf");
}
 */

@import url('https://fonts.googleapis.com/css2?family=Rubik&display=swap');

body{
  height:auto;
  margin:0;
/*   font-size:min(22px,1.8vw); */
  background-image: linear-gradient(90deg, rgba(0,179,255,1) 0%, rgba(223,228,228,1) 100%, rgba(20,54,197,1) 100%);
}


body {
	font-family: 'Rubik', sans-serif;
}


#foots{
	left:0;
}

#ocean{
	width:100%;
	margin-top:35vh;
	height:65vh;
	bottom:0%;
	position:absolute;
}

#logo{
	position:absolute;
	height:65vh;
	margin-left:calc((100vw - 65vh)/2);
	z-index:1;
	margin-top:10vh;
	animation: 1s ease-out 0s 1 fade;
	text-shadow: #000 .1vh 0 2vh;
}


.navbar{
	font-size:150%;
}



@keyframes fade {
  0% { opacity: 0; }
  100% { opacity: 1; }
}



@keyframes slideInFromBottom {
    0% {
        transform: translateY(+300%);
    }
    100% {
        transform: translateY(0);
    }
}

@keyframes scale {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(1.2);
    }
}

@keyframes scale2 {
    0% {
        transform: scale(0);
    }
    100% {
        transform: scale(1);
    }
}


@keyframes image_blur {
    0% { -webkit-filter: blur(10vh);}
    50% { -webkit-filter: blur(10vh);}
    100% { -webkit-filter: blur(0px);}
}


/* all of the modal */


.popup-form {
	max-width: 400px;
	margin: 0 auto;
	padding: 20px;
	background: #f8f9fa;
	border-radius: 5px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

.modal-dialog {
  max-height: 20vh; /* Change this value as needed */
}


/* } */