@font-face {
    font-family: toren;
    src: url(fonts/Toren-Proportional.otf);
}

@font-face {
    font-family: toren rotalic;
    src: url(fonts/Toren-Rotalic.otf);
}

/* general */
html, body {
  margin: 0;
  padding: 0;
  color: black;
  font-size: 18px;
  font-family: toren;
}


h2 {
    font-weight: normal;
    margin: 0;
    padding: 0;
}

.floatleft {
    float: left;
    display: flex;
    width: 60%;
    overflow: auto;
}

.floatright {
    float: right;
    width: 40%;
    overflow: auto;
}

.clearfloat {
    clear: both;
}


/* header */
header {
    height: 28px;
    width: 100%;
    border-bottom: solid 1px;
    position: fixed;
    top: 0;
}


.mainnav a {
    display: inline-block;
    margin: 0;
    padding-left: 1rem;
    padding-top: 5px;
    text-decoration: none;
    color: black;
}

.mainnav a:hover {
    text-decoration: underline;
}


/* content */
.maincontent {
    margin-top: 28px;
}

.maincontent h2 {
    font-family: toren rotalic;
    margin-top: 1rem;
    margin-left: 1rem;
    margin-bottom: 1rem;
}

.maincontent p {
    margin-left: 1rem;
    margin-right: 1rem;
}


.newsfeed {
    height: 800px;
    width: 100%;
    border-right: solid 1px;
    overflow: auto;
}

.goals {
    border-bottom: solid 1px;
    height: 500px;
    overflow: auto;
}

.resources { 
    height: 300px;
    overflow: auto;
}