* {
  box-sizing: border-box;
}

 /* unvisited link */
a:link {
  color: white;
}

/* visited link */
a:visited {
  color: white;
}

/* mouse over link */
a:hover {
  color: white;
}

/* selected link */
a:active {
  color: white;
} 

#floated{
    float: left;
    
}

figure{
	 margin: 0px
}

.item{
	float: left;
}

body {
    background-image: url('/img/fundo-brilho_sparkle.gif');
	background-repeat: repeat;
}

.flip-horizontally {
  transform: scaleX(-1);
}

h1,h2,h3,h4,p {
  color: white;
}


nav {
  	display: block;
	margin: auto;
  	background-color: #803020;
  	padding: 0px;
  	text-align: center;
  	color: white;
  	width: 500px;
}

/* Style the footer */
footer {
	background-image: url("/img/sparkle_background.gif");
  	margin: auto;
  	padding: 0px;
  	text-align: center;
  	color: black;
  	width: 100%;
}

/* Style the header */
header {
  	background-image: url("/img/sparkle_background.gif");
  	margin: auto;
  	padding: 0px;
  	text-align: center;
  	color: black;
  	width: 100%;
}

/* Create two columns/boxes that floats next to each other */
topnav {
  	margin: auto;
  	background-color: #f1f1f1;
  	padding: 0px;
  	text-align: center;
  	color: white;
  	width: 50%;
}

/* Style the list inside the menu */
nav ul {
  list-style-type: none;
  padding: 0;
}

article {
  
  padding: 20px;
  width: 350px;
  background-color: #f1f1f1;
  
}

articlenonav {
  margin: auto;
  background-color: #f1f1f1;
  padding: 0px;
  text-align: center;
  color: white;
  width: 500px;
}

img{
	padding: 0;
	margin: 0;
	line-height: 0;
}

section{
  margin: auto;
  background-image: url("/img/dev.png");
  padding: 30px;
  text-align: left;
  width: 1000px;
}

gamer_section{
  margin: auto;
  background-color: #f1f1f1;
  padding: 30px;
  text-align: left;
  width: 800px;
}
/* Clear floats after the columns */
section::after {
  content: "";
  display: table;
  clear: both;
}

/* Clear floats after the columns */
gamer_section::after {
  content: "";
  display: table;
  clear: both;
}

/*WOKE marquee...... */
.marquee {
    margin: 0 auto;
    white-space: nowrap;
    overflow: hidden;
    /*box-sizing: border-box;*/
    padding: 0;
    display: block;
}
.marquee span {
    display: inline-block;
    text-indent: 0;
    overflow: hidden;
    
}

@keyframes marquee {
    0% { transform: translate(100%, 0); -webkit-transform: translateX(100%); }
    100% { transform: translate(-100%, 0); -webkit-transform: translateX(-100%); }
}

.marqueeflip {
    margin: 0 auto;
    white-space: nowrap;
    overflow: hidden;
    /*box-sizing: border-box;*/
    padding: 0;
    display: block;
}
.marqueeflip span {
    display: inline-block;
    text-indent: 0;
    overflow: hidden;
    /*-webkit-transition: 15s;
    transition: 15s;
    -webkit-animation: marquee 15s linear infinite;
    animation: marquee 15s linear infinite;*/
}

.mspeed5 {
	-webkit-transition: 5s;
    transition: 5s;
    -webkit-animation: marquee 5s linear infinite;
    animation: marquee 5s linear infinite;
}

.mspeed10 {
	-webkit-transition: 10s;
    transition: 10s;
    -webkit-animation: marquee 10s linear infinite;
    animation: marquee 10s linear infinite;
}

.mspeed15 {
	-webkit-transition: 15s;
    transition: 15s;
    -webkit-animation: marquee 15s linear infinite;
    animation: marquee 15s linear infinite;
}

.mspeed30 {
	-webkit-transition: 30s;
    transition: 30s;
    -webkit-animation: marquee 30s linear infinite;
    animation: marquee 30s linear infinite;
}

@keyframes marqueeflip {
    0% { transform: translate(100%, 0); -webkit-transform: translateX(100%); }
    100% { transform: translate(-100%, 0); -webkit-transform: translateX(-100%); }
}