body {
	font-size: 10pt;
	color: #006400;
  font-family: 'Raleway', arial, helvetica, sans-serif;
}

h1 {
  text-shadow: 1px 1px 1px #000;
  font-size: 5.2vw;
  margin: 0;
}

#container > div:nth-of-type(2) {
  grid-row: 2;
  font-size: 2.2vw;
  color: #908d6a;
}

@media screen and (max-width: 700px) {
  h1 {
    font-size: 8vw;
  }

  #container > div:nth-of-type(2) {
    font-size: 3vw;
  }
}

h3 {
  margin-top: 5px;
  font-size: 14pt;
}

a[href] {
   color: #336699;
   text-decoration: none;
}

a[href]:hover {
   color: red;
}

img {
  border:1px solid #555;
  border-radius:4px;
  box-shadow:2px 2px 4px 0 #999;
  height:83px;
  width:130px;
  vertical-align: middle;
}

@media screen and (min-width: 700px) {
  #container {
    display: grid;
  }

  #container > div:nth-of-type(1) {
	grid-row: 1;
  }

  #sqltuning {
	grid-row: 3;
	grid-column: 1;
  }

  #security {
	grid-row: 3;
	grid-column: 2;
  }

  #links {
  grid-row: 3 / 7;
  grid-column: 3;
  }

  #sqlxml {
	grid-row: 4;
	grid-column: 1 / 2;
  }

  #general {
	grid-row: 5;
	grid-column: 1 / 3;
  }

  #plsql {
	grid-row: 4;
	grid-column: 2 / 3;
  }

  #author {
	grid-row: 7;
  }

  #logos {
	grid-row: 8;
  }
}

#author, #logos, #container > div:nth-of-type(1), #container > div:nth-of-type(2) {
	text-align: center;
	grid-column: 1 / 4;
}

#container > div[id] {
  background: linear-gradient(to bottom, #c3fbbd, white);
  margin: 5px;
  padding: 10px;
  box-shadow: 0 0 10px rgba(0,0,0,0.2);
  border-radius: 5px;
  border: 1px solid #aab123;
}

div[id]#links {
    background: linear-gradient(to bottom, #fffbbd, white);
}