* {
  padding: 0px;
  margin: 0px;
  box-sizing: border-box;
}

html {
  font-family: "Verdana", sans-serif;
  background-color: cadetblue;
  font-size: 12px; 
}

/*------------------ HEADER SECTION ------------------*/
header {
  background-color: white;
  padding: 20px 10px;
  box-shadow:0 6px 6px -5px #666;
  position: fixed;
  top: 0px;
  width: 100%;
}

header > nav > ul {
  display: flex;
  list-style: none;
  align-items: center;
  justify-content: flex-end;
  
 }

 

ul > li:not(:last-child) {
  margin-right: 10px;
}

ul > li > a {
  color: black;
  text-decoration: none; 
  transition: 0.5s all; 
  padding: 15px 10px;
  }

ul > li > a:hover {
  color: white; 
  background-color: rgb(253, 37, 0);
}

#logo {
  position: absolute; top: 0px; left: 0px;
  box-shadow:0 6px 6px -6px #666;
}

/*------------------ MAIN SECTION ------------------*/
main {
   margin-top: 80px;
   margin-left: 10px;
   margin-right: 10px;
 }



h1 {
  padding: 10px 0px;
  font-weight: 700;
  font-size: 26px;
}

/*------------------ FOOTER SECTION ------------------*/

footer {
background-color: whitesmoke;
height: 45px;
 bottom: 0px;
 width: 100%;
 color: rgb(124, 124, 124);
}

footer > div {
  padding: 15px 15px;
  float: left;
  width: 300px;
  
}
footer > div > a{
  text-decoration: none; 
  color: rgb(187, 187, 187);
}


.footer_position {
position: fixed;
bottom: 0px;
}

.right {
  float: right;
  text-align: right;
}


/*------------------ CAT SECTION ------------------*/

img.catImage {
  width: 300px;
  height: 300px;
  padding: 10px;
}

.cats__section {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}


/*------------------ MEDIA SECTION ------------------*/
/* względne */
/* bezwzględne */
/*
@media screen and (max-width: 768px) {
  .news__section {
    flex-direction: column;
  }
  .news__world {
    margin: 0px;
  }
  article.news {
    width: 100%;
  }
  .news__country {
    margin-top: 50px;
  }
}

@media screen and (min-width: 320px) {
  html {
    background-color: salmon;
  }
}

@media screen and (min-width: 1000px) {
  html {
    background-color: slategray;
  }
}
*/