theme.css

*
{
 /* General styles for tidy look */
  text-align: center;
/* Adjust margin for center the elements better using percentages for
   adapt to the screen size instead of use the dangerous letter size */
  margin-bottom: 0%;
  margin-top: 2%;
  margin-left: 5%;
  margin-right: 5%;
 /* Adjust inner spacing */
  padding: 0 auto;
}

body
{
   background: radial-gradient(rgba(135, 35, 15, 0.2), rgba(175, 142, 0, 0.4));
}

header, footer
{
  margin: 1.5%;
  padding: 0.4%;
  border-radius: 0.15em;
  width: 100%;
  height: 50%;
}

header
{
  font-family: 'sans-serif';
  font-size: 140%; 
  background: rgba(255, 95, 95, 0.6);
  color: rgb(90, 90, 90);
}

h1, h2, h3, h4, h5, h6
{
  font-family: 'Arial';
  font-size: 1.6em;
  text-decoration: underline;
}

footer
{
  font-family: 'Helvetica';
  background: rgba(65, 65, 65, 1);
  color: rgb(235, 200, 200);
}

img
{
  margin: 1.5%;
  padding: 0.4%;
  border-radius: 0.15em;
  width: 50%;
  height: 50%;
}

a
{
  margin: 1.5%;
  padding: 0.4%;
  border-radius: 0.15em;
  text-decoration: none;
  color: rgb(65, 150, 217);
}

a:visited
{
  color: rgb(182, 182, 182);
}

a:hover
{
  transition: linear 0.38s;
  color: rgb(242, 242, 242);
  background: rgb(65, 150, 217);
}

input[type=color]
{
  border-radius: 100%;
  width: 3em;
  margin-left: 9%;
  margin-right: 5%; 
}

button
{
  width: 20%;
  margin-left: -5%;
  margin-right: -9.5%;
  background: rgba(10, 100, 200, 0.3);
  font-size: 100%;
  border: 0.42em solid rgb(255, 95, 95);
  border-radius: 5%; 
}