@import url("http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,900");

body
{
	color: #fff;
	font-family: 'Source Sans Pro', sans-serif;
}

figure
{
	margin:0px;
	padding:0px;
}

ul
{
	margin:0px;
	padding:0px;
}

/* WRAPPER */

@-moz-keyframes wrapper 
{
	0% {opacity: 0;}

	100% {opacity: 1;}
}

@-webkit-keyframes wrapper 
{
	0% {opacity: 0;}

	100% {opacity: 1;}
}

@-ms-keyframes wrapper 
{
	0% {opacity: 0;}

	100% {opacity: 1;}
}

@keyframes wrapper 
{
	0% 	{opacity: 0;}
	100% {opacity: 1;}
}

#wrapper
{
	-moz-animation: wrapper 2s forwards;
	-webkit-animation: wrapper 2s forwards;
	-ms-animation: wrapper 2s forwards;
	animation: wrapper 2s forwards;
	height: 100%;
	left: 0;
	opacity: 0;
	position: fixed;
	top: 0;
	width: 100%;
}

/* BG */

#bg 
{
	-moz-animation: bg 30s linear infinite;
	-webkit-animation: bg 30s linear infinite;
	-ms-animation: bg 30s linear infinite;
	animation: bg 30s linear infinite;
	-moz-backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
	-moz-transform: translate3d(0,0,0);
	-webkit-transform: translate3d(0,0,0);
	-ms-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
	/* settings */
	background: #972E2A ;
	background-repeat: repeat-x;
	background-size: 2250px auto;
	width: 6750px;
	height: 100%;
	left: 0;
	opacity: 1;
	position: fixed;
	top: 0;
}

/* OVERLAY */

@-moz-keyframes overlay 
{
	0% {opacity: 0;}
	100% {opacity: 1;}
}

@-webkit-keyframes overlay 
{
	0% {opacity: 0;}
	100% {opacity: 1;}
}

@-ms-keyframes overlay 
{
	0% {opacity: 0;}
	100% {opacity: 1;}
}


@keyframes overlay
{
	0% {opacity: 0;}
	100% {opacity: 1;}
}

#overlay 
{
	-moz-animation: overlay 1.5s 1.5s forwards;
	-webkit-animation: overlay 1.5s 1.5s forwards;
	-ms-animation: overlay 1.5s 1.5s forwards;
	animation: overlay 1.5s 1.5s forwards;
	background-attachment: fixed, fixed;
	background-image: url("images/overlay-pattern.png"), url("images/overlay.svg");
	background-position: top left, center center;
	background-repeat: repeat, no-repeat;
	background-size: auto, cover;
	height: 100%;
	left: 0;
	opacity: 0;
	position: fixed;
	top: 0;
	width: 100%;
}

/* MAIN */

#main 
{
	height: 100%;
	left: 0;
	position: fixed;
	text-align: center;
	top: 0;
	width: 100%;
}

#main:before 
{
	content: '';
	display: inline-block;
	height: 100%;
	margin-right: 0;
	vertical-align: middle;
	width: 1px;
}

/* HEADER */

@-moz-keyframes header 
{
	0% 
	{
		-moz-transform: translate3d(0,1em,0);
		-webkit-transform: translate3d(0,1em,0);
		-ms-transform: translate3d(0,1em,0);
		transform: translate3d(0,1em,0);
		opacity: 0;
	}

	100% 
	{
		-moz-transform: translate3d(0,0,0);
		-webkit-transform: translate3d(0,0,0);
		-ms-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0);
		opacity: 1;
	}
}

@-webkit-keyframes header 
{
	0% 
	{
		-moz-transform: translate3d(0,1em,0);
		-webkit-transform: translate3d(0,1em,0);
		-ms-transform: translate3d(0,1em,0);
		transform: translate3d(0,1em,0);
		opacity: 0;
	}

	100%
	{
		-moz-transform: translate3d(0,0,0);
		-webkit-transform: translate3d(0,0,0);
		-ms-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0);
		opacity: 1;
	}
}

@-ms-keyframes header 
{
	0% 
	{
		-moz-transform: translate3d(0,1em,0);
		-webkit-transform: translate3d(0,1em,0);
		-ms-transform: translate3d(0,1em,0);
		transform: translate3d(0,1em,0);
		opacity: 0;
	}

	100% 
	{
		-moz-transform: translate3d(0,0,0);
		-webkit-transform: translate3d(0,0,0);
		-ms-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0);
		opacity: 1;
	}
}

@keyframes header
{
	0% 
	{
		-moz-transform: translate3d(0,1em,0);
		-webkit-transform: translate3d(0,1em,0);
		-ms-transform: translate3d(0,1em,0);
		transform: translate3d(0,1em,0);
		opacity: 0;
	}

	100% 
	{
		-moz-transform: translate3d(0,0,0);
		-webkit-transform: translate3d(0,0,0);
		-ms-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0);
		opacity: 1;
	}
}

@-moz-keyframes nav-icons
{
	0% 
	{
		-moz-transform: translate3d(0,1em,0);
		-webkit-transform: translate3d(0,1em,0);
		-ms-transform: translate3d(0,1em,0);
		transform: translate3d(0,1em,0);
		opacity: 0;
	}

	100%
	{
		-moz-transform: translate3d(0,0,0);
		-webkit-transform: translate3d(0,0,0);
		-ms-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0);
		opacity: 1;
	}
}

@-webkit-keyframes nav-icons 
{
	0% 
	{
		-moz-transform: translate3d(0,1em,0);
		-webkit-transform: translate3d(0,1em,0);
		-ms-transform: translate3d(0,1em,0);
		transform: translate3d(0,1em,0);
		opacity: 0;
	}

	100% 
	{
		-moz-transform: translate3d(0,0,0);
		-webkit-transform: translate3d(0,0,0);
		-ms-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0);
		opacity: 1;
	}
}

@-ms-keyframes nav-icons 
{
	0% 
	{
		-moz-transform: translate3d(0,1em,0);
		-webkit-transform: translate3d(0,1em,0);
		-ms-transform: translate3d(0,1em,0);
		transform: translate3d(0,1em,0);
		opacity: 0;
	}

	100% 
	{
		-moz-transform: translate3d(0,0,0);
		-webkit-transform: translate3d(0,0,0);
		-ms-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0);
		opacity: 1;
	}
}

@keyframes nav-icons
 {
	0% 
	{
		-moz-transform: translate3d(0,1em,0);
		-webkit-transform: translate3d(0,1em,0);
		-ms-transform: translate3d(0,1em,0);
		transform: translate3d(0,1em,0);
		opacity: 0;
	}

	100%
	{
		-moz-transform: translate3d(0,0,0);
		-webkit-transform: translate3d(0,0,0);
		-ms-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0);
		opacity: 1;
	}
}

#header 
{
	-moz-animation: header 1s 2.25s forwards;
	-webkit-animation: header 1s 2.25s forwards;
	-ms-animation: header 1s 2.25s forwards;
	animation: header 1s 2.25s forwards;
	-moz-backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
	-moz-transform: translate3d(0,0,0);
	-webkit-transform: translate3d(0,0,0);
	-ms-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
	cursor: default;
	display: inline-block;
	opacity: 0;
	position: relative;
	text-align: center;
	top: -1em;
	vertical-align: middle;
	width: 90%;
}

#header p 
{
	font-size: 30px;
	margin: 40px 0 30px 0;
	opacity: 0.75;
}

#header nav li 
{
	-moz-animation: nav-icons 0.5s ease-in-out forwards;
	-webkit-animation: nav-icons 0.5s ease-in-out forwards;
	-ms-animation: nav-icons 0.5s ease-in-out forwards;
	animation: nav-icons 0.5s ease-in-out forwards;
	-moz-backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	backface-visibility: hidden;
	-moz-transform: translate3d(0,0,0);
	-webkit-transform: translate3d(0,0,0);
	-ms-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
	display: inline-block;
	opacity: 0;
	position: relative;
	top:0;
	margin:0 20px 0 0;
}

#header nav li:last-child 
{
	margin: 0;
}	

#header nav li:nth-child(1) 
{
	-moz-animation-delay: 2.5s;
	-webkit-animation-delay: 2.5s;
	-ms-animation-delay: 2.5s;
	animation-delay: 2.5s;
}

#header nav li:nth-child(2) 
{
	-moz-animation-delay: 2.75s;
	-webkit-animation-delay: 2.75s;
	-ms-animation-delay: 2.75s;
	animation-delay: 2.75s;
}

#header nav li:nth-child(3) 
{
	-moz-animation-delay: 3s;
	-webkit-animation-delay: 3s;
	-ms-animation-delay: 3s;
	animation-delay: 3s;
}

#header nav li:nth-child(4) 
{
	-moz-animation-delay: 3.25s;
	-webkit-animation-delay: 3.25s;
	-ms-animation-delay: 3.25s;
	animation-delay: 3.25s;
}

#header nav a 
{
	-webkit-tap-highlight-color: transparent;
	-webkit-touch-callout: none;
	border: 0;
	display: inline-block;
}

#header nav a:before
 {
	-moz-transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	border-radius: 100%;
	border: solid 1px #fff;
	display: block;
	font-size: 1.75em;
	height: 2.5em;
	line-height: 2.5em;
	position: relative;
	text-align: center;
	top: 0;
	width: 2.5em;
}

/* FOOTER */

#footer 
{
	background-image: -moz-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.5) 75%);
	background-image: -webkit-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.5) 75%);
	background-image: -ms-linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.5) 75%);
	background-image: linear-gradient(top, rgba(0,0,0,0), rgba(0,0,0,0.5) 75%);
	bottom: 0;
	cursor: default;
	height: 6em;
	left: 0;
	line-height: 8em;
	position: absolute;
	text-align: center;
	width: 100%;
}

/* CONFIGURAÇÕES GERAIS*/

.logotipo
{
	width:700px;
}
        
.bandeira
{
    width:75px;
    opacity:0.5;
}
        
.bandeira:hover
{
    opacity:1;
    filter:alpha(opacity=100);
    transition-duration: 0.5s;
    -webkit-transition-duration: 0.5s;
    filter: alpha(transition-duration=0.5s);
}


/* CONFIGURAÇÕES RESPONSIVO*/

@media screen and (max-width: 1000px)
{

.logotipo
{
	width:500px;
}
#header p 
{
	font-size: 25px;
	margin: 40px 0 15px 0;
}	

.bandeira
{
    width:60px;
}

}

@media screen and (max-width: 800px)
{

.logotipo
{
	width:400px;
}
#header p 
{
	font-size: 22px;
}	

}

@media screen and (max-width: 600px)
{

.logotipo
{
	width:400px;
}

#header p 
{
	font-size: 20px;
}	

.bandeira
{
    width:50px;
}

footer span
{
	font-size: 12px;
}

}

@media screen and (max-width: 500px)
{

.logotipo
{
	width:90%;
}
#header p 
{
	font-size: 16px;
}	

.bandeira
{
    width:40px;
}

}

@media screen and (max-width: 400px)
{

#header p 
{
	font-size: 14px;
}	

footer span
{
	font-size: 10px;
}

}

@media screen and (max-width: 350px)
{

#header p 
{
	font-size: 12px;
}	

footer span
{
	font-size: 9px;
}

}