// <weight>: Use a value from 100 to 1000
// <uniquifier>: Use a unique and descriptive class name

.dm-sans-<uniquifier> {
  font-family: "DM Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

body{
    /*    */
    background-image:url('../pic/bg.jpg');
    background-attachment:fixed;
    background-repeat: no-repeat;
    background-size: cover;


    color: #fff;
    margin : 0px;
	background-color : rgba(255,248,236,1);
	
	font-family: 'DM Sans', sans-serif;
	font-weight: 300; /* Adjust based on available font weights */
	font-size: 1.1em;
}
   
nav {
	background-color: #fff;
	width : 100%;
	height : 5em;
	z-index : 99;
	position : absolute;
	top : 0px;
	left : 0px;
	overflow : auto;  
	position: -webkit-sticky; /* Safari */
  	position: sticky;
	color : rgb(0,0,51);
	padding-left : 20px;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'DM Sans', sans-serif;
  font-weight: 500; /* Adjust based on available font weights */
}


.login {
	display : block;
	position : relative;
	width : 30vw;
	/*width: min(100%, 600px);*/
	border-radius: 25px;
	padding : 25px;
	padding-top : 10px;
	padding-bottom : 10px;
	
	left: calc(50vw - 15vw);
	top: calc(50vh - 30vh);
	
	background-color : rgba(255,248,236,1);
	
	color : rgb(0,0,51);
	overflow : visible;
}

.input {
	font-size : 1.5em;
	width : 20vw;
}

.button{
    border-style: none;
    border-radius: calc(32px * var(--scale, 1));
    z-index: 169;
    width: calc(187px * var(--scale, 1));
    height: calc(48px * var(--scale, 1));
    margin-top : 1.5em;
    background: rgba(255, 160, 0, 1);
    box-shadow: none;
    text-shadow: none;
    color: #fff;
    font-size: calc(20px * var(--scale, 1));
    line-height: calc(24px * var(--scale, 1));
    font-weight: 500;
    font-family: 'DM Sans';
    font-style: normal;
    text-align: center;
}

.button:hover {
    background: rgb(0,0,51);
    cursor: pointer;
}

.video-wrapper {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 aspect ratio */
  height: 0;
  overflow: hidden;
}

.video-wrapper iframe {
  position: absolute;
  top: 2,5em;
  left: 0;
  width: 100%;
  height: calc(100% - 2,5em);
}