* {box-sizing: border-box;}

    .wrapper {
        max-width: 1024px;
        margin: 0 auto;
        font: 1.2em Helvetica, arial, sans-serif;
    }

    .wrapper > * {
/*
        border: 2px solid #f08c00;
        background-color: #ffec99;
        border-radius: 5px;
*/
        padding: 10px;
    }

    nav ul {
        list-style: none;
        margin: 0;
        padding: 0;
    }
	

.wrapper {
  display: grid;
  grid-template-columns: repeat(12, [col-start] 1fr);
  grid-gap: 20px;
}

.wrapper > * {
  grid-column: col-start / span 12;
}

  .dropdown {
	  display: inline;
  }

.main-footer {
	background-color: #3A529F;
	color: white;
	border: none;
	border-radius: 0px;
	font: 0.6em Helvetica, arial, sams-serif;
}

.logo {
  background-size: contain;
  background-repeat: no-repeat;
  height: 20vh;
  margin-right: 30px;
  float: left;
}

@media (min-width: 500px) {

  .news {
    grid-column: col-start / span 3;
    grid-row: 3;
  }
  .ad {
    grid-column: col-start / span 3;
    grid-row: 4;
  }
  .content, .main-footer {
    grid-column: col-start 4 / span 9;
  }
  nav ul {
    display: flex;
    justify-content: space-between;
  }
}
@media (min-width: 700px) {

/*  .main-nav {
    grid-column: col-start / span 2;
    grid-row: 2 / 4;
  }
 */
 
  .content {
    grid-column: col-start / span 9;
    grid-row: 2 / 4;
  }
  .news {
    grid-column: col-start 10 / span 3;
    grid-row: 2;
  }
  .ad {
    grid-column: col-start 10 / span 3;
    grid-row: 3;
  }
  .main-footer {
    grid-column: col-start / span 12;
  }
.navbar {
  overflow: hidden;
}

.navbar a {
  float: left;
  font-size: 16px;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  background-color: #3A529F;
  font-weight: bold;
}

.dropdown {
  float: left;
  overflow: hidden;
}

.dropdown .dropbtn {
  float: left;
  font-size: 16px;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
  background-color: #3A529F;
  font-weight: bold;
  border: none;
  outline: none;
  font-family: inherit;
  margin: 0;
}

.navbar a:hover, .dropdown:hover .dropbtn {
  background-color: #777B88;
}

.dropdown-content {
  display: none;
/*  position: absolute; */
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content a {
  float: none;
  color: white;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
  font-weight: bold;
}

.dropdown-content a:hover {
  background-color: #777b88;
}

.dropdown:hover .dropdown-content {
  display: block;
}

.news h2 {
  font-weight: bold;
  /*font: 1.2em Helvetica, arial, sans-serif;*/
}

.news p {
  font: 0.6em Helvetica, arial, sans-serif;
}
/* Styling for Forms */

input, select {
  margin-bottom: 10px;
}

#subject {
  height: 170px;
  width: 600px;
  margin-bottom: 10px;
}

}