/* Style the topnav */
ul.topnavi {
  display: flex;
  list-style-type: none;
  margin: 0;
  padding: 0;
  background-color: #333333;
}

/* Style links in topnav */
ul.topnavi li a {
  display: block;
  color: #f1f1f1;
  padding: 14px 16px;
  text-decoration: none;
}

/* Change color on hover */
ul.topnavi li a:hover {
  background-color: #9f0042;
  color: black;
}

.Giorno  {
    display: flex; /* makes items arranged in a row by default */
    gap: 10px; /* adds space between the image and the text */
    padding: 20px; 
    background-color: #f78fba;
    margin: 20px;
   border: 7px solid white; 
}

.text-section {
    width: 20px;
    flex: 1;
}

.text-section h2{ /*div's name then the selector you want to specifically change*/
    text-align: left;
    color:#9f0042;
}

img{
    margin: 10px; /*outside*/
    padding:2px; /*inside*/
    border: 10px dotted white; /*ON the boarded line*/

}

header {
    background-color: #f1f1f1;
    text-align: center;
    padding: 10px;
    margin: 0;
 
}

.whatever div{
   display: inline-block;
   background-color: #ff9ab5;
   padding: 20px;
   margin: 1px 20px 1px 20px; 
   width: 250px;
}

header {
  background-color: #f78fba;
  padding: 10px;
  text-align: center;
}

/* Typography*/
h1{
   color: #9f0042;
   text-align: center;
}

b{
    color: deeppink;
}

.contents {
   
   width: 300px;
   padding: 20px;
   
   
}
a:hover{
  color: rgb(217, 45, 116);
}



body{ /*effects everything on the page*/
   background-color: rgba(255, 191, 166, 0.95); 
   text-align: left;
   color: darkslategrey;
   font-size: 1rem;
   letter-spacing: 1.5px;
   margin: 0;
   padding: 0;
} 


div.main_stuff {
  display: flex;
  flex-direction: row;
}

div.main_stuff > div {
  margin: 10px;
}

footer {
  background-color: #f1f1f1;
  padding: 8px;
  text-align: center;
}


/*Styling types

color:
text-align:
font-size:

background-color:
background-image: url(/);
background-repeat: no-repeat;

margin: 50px; (outside boarder)
padding: (inside)
border: 10px dotted white; (ON the boarded line)

font-family:
letter-spacing:

a:link{}
a:hover{}


*/