@font-face{
	font-family: 'Montserrat';
	src: url('../font/Montserrat-Light.ttf')format('truetype');
}
*{
	margin: 0;
	padding: 0;
	 box-sizing: border-box;
	 font-family: 'Montserrat', sans-serif;
}
:root{
	--myFont: calc(14px + (18 - 14)*(100vw - 300px)/(1400 - 300));
}
h2, small{
	color: #ececec;
	pointer-events: none;
}
h2{
	letter-spacing: 3px;
	font-variant: small-caps;
	font-size: calc(14px + (22 - 14)*(100vw - 300px)/(1400 - 300));
	margin-bottom: 25px;
}
a{
	text-decoration: none;
	outline: none;
	color: #ececec;
	letter-spacing: 3px;
	font-size: var(--myFont);
}
body{
	max-width: 1400px;
	height: 100%;
	margin: 0 auto;
	background: #000;
}
#boxBorderAni{
	position: relative;
	margin: 15% auto 0;
	width: 50%;
	height: 50%;
	background: linear-gradient(135deg, #000, #354);
}
#boxBorderAni:before, #boxBorderAni:after {
	content: '';
	position: absolute;
	left: -2px;
	top: -2px;
	background: linear-gradient(45deg, #fb0094, #0000ff, #00ff00,#ffff00, #ff0000, #fb0094, 
		#0000ff, #00ff00,#ffff00, #ff0000);
	background-size: 400%;
	width: calc(100% + 4px);
	height: calc(100% + 4px);
	z-index: -1;
	animation: sliding 50s linear infinite;
}
#boxBorderAni:after {
	filter: blur(5px);
}
@keyframes sliding {
	0% {
		background-position: 0 0;
	}
	50% {
		background-position: 400% 0;
	}
	100% {
		background-position: 0 0;
	}
}
#box{
	width: 80%;
	margin: 15% auto;
	padding: 5% 0 5% 3%;
}