html{
	scroll-behavior: smooth;
}

body{
	width:100%;
	height:100%;
	padding:0px;
	margin:0px;
	overflow-x:hidden;
}

.ProductPanel {
	width:100vw;
	height:100vh;
	display:flex;
	flex-direction: column;
	align-items:center;
	justify-content:center;
	background-size:cover;
	background-position: center;
}


.ProductPanel .ProductName {
	color:rgb(255, 255, 255);
	font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
	text-align:center;
	font-weight:bolder;
	font-size:12vw;
	text-shadow: rgb(136, 136, 136) 1px 0 10px;
	padding: 5px;
	margin: 0px;
	
    animation: fadeInLeft 1s ease-in-out;
} 

.ProductPanel .Description {
	color:rgb(255, 255, 255);
	font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
	text-align:center;
	font-weight:bold;
	font-size:3vw;
	text-shadow: rgb(0, 0, 0) 0px 0px 5px;
	margin: 0px;

	width: 50vw;

	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 40px;

}


.Button {
    display: inline-block;
    padding: 10px 20px;
    background-color: #000;
    color: #fff;
    text-decoration: none;
    border: 2px solid #fff;
    border-radius: 5px;
    font-weight: bold;
    transition: scale 0.3s, color 0.3s, background-color 0.3s;
	font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

	text-shadow: rgb(0, 0, 0) 1px 0 10px;
}

.Button:hover {
	scale: 1.2;
	background-color: #fff;
	color: #000;
}

.Arrow{
	text-align: center;

	color:rgb(255, 255, 255);
	font-family: consolas;
	text-decoration: none;
	text-align:center;
	font-weight:bold;
	font-size:4vh;
	text-shadow: rgb(0, 0, 0) 0px 0px 5px;

	background-color: #000;
    border: 2px solid #fff;
	border-radius: 50%;

	font-size: 4vh;
    padding: 0.5vh 1.75vh;

	position: absolute;
    bottom: 0;

    animation: hover 2s infinite;

    transition: scale 0.3s, color 0.3s, background-color 0.3s;
}

.Arrow:hover{
	scale: 1.2;
	background-color: #fff;
	color: #000;
}

@keyframes fadeInLeft {
	0% {
	  opacity: 0;
	  transform: translateX(-20px);
	}
	100% {
	  opacity: 1;
	  transform: translateX(0);
	}
}

@keyframes hover {
    0% { bottom: 20px; }
    50% { bottom: 40px; }
    100% { bottom: 20px; }
}