html
{
	font-family: 'Open Sans', sans-serif;
}

@font-face
{
	font-family: fontvnt;
    src: url(../fonts/HangedLetters.ttf);
}

@font-face
{
	font-family: nexabold;
    src: url(../fonts/NexaBold.otf);
}

@font-face
{
	font-family: nexalight;
    src: url(../fonts/NexaLight.otf);
}

@keyframes animatedBackground 
{
	from { background-position: 0 0; }
	to { background-position: 100% 0; }
}

#animate-area	
{ 
	width: 100vw; 
	height: 100vh; 
	background-image: url(../img/bg.jpg);
	background-position: 0px 0px;
	background-repeat: repeat-x;
	animation: animatedBackground 40s linear infinite;
}

.hconst
{
	margin-top: 55px;
	font-family: fontvnt;
	font-size: 65px;
	color: white;
}

.hconstxs
{
	margin-top: 55px;
	font-family: fontvnt;
	font-size: 45px;
	color: white;
}

body
{
    margin: 0px;
    color: white;
}

.progress
{
	margin-top: 60px;
	width: 70%;
	background-color: #c4c4c4;
}

.asosmed
{
	height: 70px !important;
	width: 70px !important;	
}

.btn-circle 
{
  width: 60px;
  height: 60px;
  text-align: center;
  padding: 6px 0;
  font-size: 12px;
  line-height: 1.428571429;
  border-radius: 100px;
}

.divsosmed
{
	width: 300px;
}

.progress-bar
{
	background-color: grey !important;
}

.pwelcome
{
	font-family: nexabold;
	font-size: 25px;
	margin-top: 90px;
}

.pwelcomexs
{
	font-family: nexabold;
	font-size: 15px;
	margin-top: 10px;
}

.pnormal
{
	font-family: nexalight;
	margin-top: 80px;
}

#backcolor
{
    width: 100vw; 
	height: 100vh;
    background: linear-gradient(rgba(47, 47, 47, 0.65), rgba(47, 47, 47, 0.65));
    position: absolute;
}

.spancomplete
{
	font-family: nexabold;
}