*{margin: 0;
padding: 0;}

html{box-sizing: border-box;
font-size: 62,5%;}

body{background-image:url(img/a.gif);
margin: 3%;
background-attachment:fixed;
background-size: 50%;}

h1{color:  rgb(8, 252, 0);
text-transform:uppercase;
text-align: center;
font-size: 1rem;}

nav{display: flex;
justify-content: space-evenly;;}

a{text-decoration: none;
color: orange;}

nav > a:hover {text-decoration: underline;}

.texto{margin: 3%;
padding: 1%;}

.universo{width: 90%;
display: flex;
margin-left:5%;
margin-right: 5%;
margin-top: 5%;
border: 5px grey solid;}




/* */

.sol{display: flex;
    margin: 5%;
border: red 2px solid;
padding: 5px;}

p{color: rgb(255, 174, 0);
text-align: justify;
padding: 5%;}

.sistema1{display: flex;
width: 40%;
padding:1%}

@media screen and (min-width: 700px){

body{background-image: url(img/a.gif)}

nav{justify-content:space-evenly;}

a{font-size: 2rem;}  

h1{font-size: 2rem;}

.sol{float: left;
width: 40%;
margin: 2%;}


}