:root{
    --blue0:#116fb5;
	--blue1:#211e5a;
	--blue2:#2e95c0;
	--blue3:#d4eefb;
	--yellow:#f4c716;
	--green:#4eba6f;
}

body{
	margin: 0;
	padding: 0;
	min-height: 100vh;
	position: relative;
}
section{
	width: 100%;
	min-height: 100vh;
	position: relative;	
}
h1{
	font-family: KufamMedium;
	font-size: 3vw;
	color: var(--blue1);
}
h2{
	font-family: KufamRegular;
	font-size: 2.5vw;
	color: var(--blue1);
}
h3{
	font-family: KufamRegular;
	font-size: 1.5vw;
	color: var(--blue1);
}
p{
	font-family: NunitoLight;
	font-size: 2vw;
	color: var(--blue0);
}
span{
	font-family: NunitoLight;
	font-size: 1.2vw;
	color: var(--blue2);
}
ul{
	margin: 0;
	padding:0 5px;
	position: relative;
}

li{
	font-family: NunitoLight;
	font-size: 2vw;
	color: var(--blue0);
	text-decoration: none;
	padding: 0 10px;
	margin-left: 5%;
}
cite{
	font-family: NunitoExtraLightItalic;
	font-size: 1.5vw;
	color: var(--blue1); 

}
blockquote{

	background: var(--blue3);
	font-family: NunitoExtraLight;
	font-size: 1.5vw;
	color: var(--blue0); 
	border-left: 3px solid var(--blue1);
	padding: 5%;
	margin: 5% auto;
}
sup{
	font-family: NunitoExtraLightItalic;
	font-size: 1.5vw;
	color: var(--blue1); 
}
a{
	text-decoration: none;	
	color: #ffffff;
}
a:link{	
	color: #ffffff;	
}
a:visited{
	color: #ffffff;	
}
a:active{
	color: #ffffff;
	border: none;
}
header span{
	font-family: NunitoBold;
	font-size: 1vw;
}
@media handheld, only screen and (max-width: 1000px) {
	section{
		}
	
	h1{
		font-size: 3vh;
	}
	h2{
		font-size: 2.5vh;
		color: var(--blue1);
	}
	h3{
		font-size: 2vh;
	}
	p{
		font-size: 2vh;
	}
	span{
		font-size: 2vh;
	}
	li{
		font-size: 2vh;
	}
	cite{
		font-size: 2vh;
	}
	blockquote{
		font-size: 2vh;
	}
	sup{
		font-size: 1.5vh;
	}
	a{
	}
	a:visited{
	}
	header span{
		font-size: 1.5vh;
	}
}
.preloader-box{
	display: none;
	width: 15vw;
	height: 20vh;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 1001;
	-webkit-animation: spin 2s  infinite ease-out;
    -moz-animation: spin 2s  infinite ease-out;
    animation: spin 2s  infinite ease-out;
	
	transition: opacity 0.2 linear;
	opacity: 1;
	transform: opacity 1s linear;
}

@-moz-keyframes spin { 
    100% { -moz-transform: rotate(360deg); } 
}
@-webkit-keyframes spin { 
    100% { -webkit-transform: rotate(360deg); } 
}
@keyframes spin { 
    100% { 
        -webkit-transform: rotate(360deg); 
        transform:rotate(360deg); 
    } 
}
.preloader{
	width: 100%;
	height: 100%;
}
.clear{
	clear: both;
}
@media handheld, only screen and (max-width: 1000px) {
	.preloader-box{
		width: 30vw;
		height: 20vh;
		
	}
	.preloader{
	}
	#menu-button{
		background: url("../images/_common/bg-white-50.png");
		width: 60px;
		height: 60px;
		border-radius: 50% 50% 50% 50%;
		position: fixed;
		bottom: 5vh;
		right: 30px;
		z-index: 1010;
		cursor: pointer;
		box-shadow: 0 0 20px 0 var(--blue0);
	}
	#menu-button:hover{
		background: url("../images/_common/bg-blue-50.png");
	}
	#menu-button:active{
		box-shadow: none; 
		
	}
	.menu-button{
		background: url("../images/bt-menu.svg") no-repeat center;
		background-size: contain;
		width: 40px;
		height: 40px;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		margin: auto;	
	}
}
header{
	background: url("../images/_common/bg-black-25.png");
	width: 100%;
	height: 15vh;
	position: fixed;
	z-index: 100;
}
header .header-logo{
	background: url("../images/logo-06.svg") no-repeat center;
	background-size: contain;
	width: 20%;
	height: 100%;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	margin: auto;
}
header .header-menu{

	width: auto;
	height: 50%;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 1%;
	margin: auto;
}
header .header-menu-opt{
	width: auto;
	display: inline-block;		
	cursor: pointer;
	color: #ffffff;	
	text-align: center;
}
header .header-menu-opt:hover{	
	border-bottom: 3px solid #ffffff;
	text-decoration: none;

}
header .header-menu-opt:active{	
	background: url("../images/_common/bg-blue-25.png");	
}
header .header-menu-opt:link{	
	
	text-decoration: none;
}
header .header-menu-opt:visited{	
	
	text-decoration: none;
}
header span{
	margin: auto 5px;
	padding: 5px;	
	color: #ffffff;
}
header .header-menu-ico{
	width: 30px;
	height: 30px;
	margin: auto;
}
header .header-menu-ico-home{
	background: url("../images/ico-home.svg") no-repeat center bottom;
	background-size: contain;
}
header .header-menu-ico-aboutus{
	background: url("../images/ico-aboutus.svg") no-repeat center bottom;
	background-size: contain;
}
header .header-menu-ico-data{
	background: url("../images/ico-data.svg") no-repeat center bottom;
	background-size: contain;
}
header .header-menu-ico-projects{
	background: url("../images/ico-projects.svg") no-repeat center bottom;
	background-size: contain;
}
header .header-menu-ico-workshop{
	background: url("../images/ico-workshops.svg") no-repeat center bottom;
	background-size: contain;
}
header .header-menu-ico-linkage{
	background: url("../images/ico-linkage.svg") no-repeat center bottom;
	background-size: contain;
}
header .header-menu-ico-news{
	background: url("../images/ico-news.svg") no-repeat center bottom;
	background-size: contain;
}
header .header-menu-ico-store{
	background: url("../images/ico-store.svg") no-repeat center bottom;
	background-size: contain;
}
header .header-menu-ico-market{
	background: url("../images/ico-market-1.svg") no-repeat center bottom;
	background-size: contain;
}
@media handheld, only screen and (max-width: 1000px) {
	header{
		background: url("../images/_common/bg-black-25.png"); 
		height: 10vh;
	}
	header .header-logo{
		background: url("../images/logo-05.svg") no-repeat center;
		background-size: contain;
		width: 50%;
		height: 100%;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		margin: auto;
	}
	header .header-menu{		
		background: url("../images/_common/bg-blue-75.png");
		width: 0;
		height: 80%;
		position: fixed;		
		top: 0;
		bottom: auto;
		right: 0;
		margin: auto;
		box-shadow: 5px 5px 20px 0 var(--blue0);
		border-bottom: 5px solid var(--blue1);
	}
	header .header-menu-opt{
		width: 100%;
		padding: 10px;
		display: block;
		position: relative;
		text-align: left;
		margin: 10px 0;
	}
	header .header-menu-opt:hover{	
		background: url("../images/_common/bg-white-25.png");
		border: none;
	}
	header .header-menu-opt:active{	
		background: url("../images/_common/bg-blue-75.png"); 
	}
	header span{		
		margin: 5px 0;
		padding: 5px;		

		margin-left: 50px;
	}
	header .header-menu-ico{
		width: 30px;
		height: 30px;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 5px;
		margin: auto;
	}
	header .header-menu-ico-home{
	}
	header .header-menu-ico-aboutus{
	}
	header .header-menu-ico-data{
	}
	header .header-menu-ico-projects{
	}
	header .header-menu-ico-workshop{
	}
	header .header-menu-ico-linkage{
	}
	header .header-menu-ico-news{
	}
	header .header-menu-ico-store{
	}
	header .header-menu-ico-market{
	}
}