* {
    box-sizing: border-box;
    margin: 0; 
    padding: 0;
}

html, body {
    width: 100%;
}


body {	
	display: flex;
	flex-direction: column;
	align-items: stretch;		
	background: linear-gradient(-25deg, #FFFFFF, #A9A9A9,  #696969,  #000000, #000000);		
	background-size: 400% 400%;		
	animation: gradient 30s ease infinite;		
	height: 100vh;		
}			

	
header, article, footer {
    flex-shrink: 0;
}
	
/***************************
HEADER
***************************/
header {
	position: -webkit-sticky;
   position: sticky;
	top: 0px;
	padding: 0px;
	border-bottom: 2px solid #000000;
}

.hd-main {
   background-color: white;
   display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

.hd-main-logo {
/*background-color: #d03400;*/
   padding: 10px 40px 5px 15px;	
	min-width: 100px;
	text-align: left;
}

.hd-main-list {
/*	background-color: #FC0;*/
	padding: 0;
	min-width: 100px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-align: center;
}
	
@keyframes gradient {			
	0% {		
		background-position: 0% 15%;	
	}		
	20% {		
		background-position: 15% 50%;	
	}		
	40% {		
		background-position: 50% 100%;	
	}		
	60% {		
		background-position: 100% 50%;	
	}		
	80% {		
		background-position: 50% 15%;	
	}		
	100% {		
		background-position: 15% 0%;	
	}		
}			

div.MovingPageHeader {
	position: fixed;
  font-family: Verdana, sans-serif;
  font-size: 30px;
  text-align: center;
  display: table-cell;
  vertical-align: middle;
  color: black;
  font-weight: bold;
}


ul {
    list-style: none;
    padding-left: 0;
}

/***************************
FOOTER
***************************/
footer {
	line-height: 1.5;
}

footer a {
    text-decoration: none;
    color: #eee;
}

.ft-legal {
	background-color: #000;
	color: #bbb;
	position: fixed;
	bottom: 0px;
	width:100%;
}

.ft-legal-list {
	width: 100%;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	list-style: none;
}