/*---------------------------------------------*/
/* Globals */
/*---------------------------------------------*/
@import url("https://fonts.googleapis.com/css?family=Droid+Serif");
@font-face {
  font-family: 'andale';
  src: url("../type/andale-mono.ttf"); }

/*---------------------------------------------*/
/* Overarching styles */
/*---------------------------------------------*/
* {
  font-family: "Droid Serif", serif;
  margin: 0;
  padding: 0; }

.nav-bar {
  font-family: andale; }

body {
  margin-left: auto;
  margin-right: auto;
  width: 960px; }

.spacer {
  margin: 20px 0px 20px; }

a {
  text-decoration: none;
  color: black; }

a:hover {
  text-decoration: line-through; }

.current-strike {
  text-decoration: line-through; }

br {
  margin-bottom: 15px; }

/*---------------------------------------------*/
/* Extenders */
/*---------------------------------------------*/
.flex_space, .spacer, nav, nav ul, .about_section_single, .project-repeat-middle, .month_name_contain, .image_grid, footer ul {
  display: flex;
  display: -webkit-flex;
  justify-content: space-around;
  -webkit-justify-content: space-around;
  align-items: center;
  -webkit-align-items: center;
  flex-wrap: wrap;
  -webkit-flex-wrap: wrap; }

.flex_column {
  display: flex;
  flex-direction: column; }

.flex_end, .project-repeat-bottom, #copyright {
  display: flex;
  justify-content: flex-end; }

/*---------------------------------------------*/
/* Navigation */
/*---------------------------------------------*/
#logo {
  height: 50px; }

nav {
  justify-content: space-between;
  padding-top: 30px; }

nav a {
  font-family: andale; }

#index_nav {
  justify-content: space-around; }

#index_nav ul {
  width: 100%;
  font-family: andale; }

#main-page-image {
  width: 100%; }

nav ul {
  width: 80%;
  height: 34px;
  font-size: 24px;
  list-style: none; }

#menu-toggle {
  display: none; }

.label-toggle {
  display: none; }

/*---------------------------------------------*/
/* About Page */
/*---------------------------------------------*/
.half_image_right {
  width: 30%;
  float: right; }

#site-descriptor {
  font-size: 18px;
  padding: 15px 0 0px 0;
  text-indent: 30px; }

/*---------------------------------------------*/
/* Overview Pages */
/*---------------------------------------------*/
.overview-holder {
  font-family: andale;
  margin-top: 30px;
  font-size: 24px; }

.overview-holder span {
  font-family: andale; }

.project-repeat-top {
  font-family: andale;
  width: 100%;
  height: 30px; }

.project-repeat-middle {
  width: 100%;
  height: 260px; }

.project-repeat-bottom {
  font-family: andale;
  width: 100%;
  height: 30px;
  border-bottom-style: solid;
  padding-bottom: 15px;
  margin-bottom: 15px; }

.overview-description {
  font-size: 18px;
  text-indent: 30px;
  margin-bottom: 30px; }

.project-description {
  font-size: 18px;
  width: 600px; }

.preview_image {
  height: 230px; }

.whole_project_show {
  padding: auto 10px auto auto; }

/*---------------------------------------------*/
/* Content View Page */
/*---------------------------------------------*/
.month_name_contain {
  font-size: 30px; }

.single_day_tag {
  text-decoration: underline; }

.image_grid {
  margin-top: 30px; }

.grid_image {
  max-height: 400px;
  max-width: 400px;
  padding: 20px; }

.proj_description_text {
  font-size: 18px;
  padding: 15px 0 15px 0;
  text-indent: 30px; }

.project_description_image {
  width: 100%;
  margin: 0 auto 0 auto; }

.poems {
  font-size: 30px; }

.single_day_div {
  width: 450px;
  height: 100%; }

/*---------------------------------------------*/
/* footer */
/*---------------------------------------------*/
footer {
  margin-top: 30px; }

footer ul {
  width: 30%;
  float: left;
  list-style: none;
  text-decoration: none; }

footer li {
  margin-right: 5px; }

/*------------------------------------------------------------------------------------------*/
/* 960 and below */
/*------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 960px) {
  .flex_end_mobile, .label-toggle {
    display: flex;
    justify-content: flex-end; }
  .flex_space_mobile, nav {
    display: flex;
    display: -webkit-flex;
    justify-content: space-around;
    -webkit-justify-content: space-around;
    align-items: center;
    -webkit-align-items: center;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap; }
  body {
    margin-left: auto;
    margin-right: auto;
    margin-top: 0px;
    width: 90%; }
  /*---------------------------------------------*/
  /* Navigation */
  /*---------------------------------------------*/
  nav {
    justify-content: space-between;
    padding-top: 0px; }
  #logo-holder-left {
    position: static;
    margin-left: 30px;
    margin-top: 30px;
    width: 70px; }
  #menu-toggle:checked ~ .nav-bar {
    opacity: 1;
    height: 100vh;
    visibility: visible; }
  .label-toggle {
    font-size: 30px;
    margin-right: 30px;
    margin-top: 30px;
    cursor: pointer; }
  .nav-bar {
    display: block;
    height: 0;
    list-style-type: none;
    opacity: 0;
    text-align: center;
    transition: all 1s ease;
    width: 100%;
    visibility: hidden; }
  .nav-bar li {
    display: block;
    font-size: 1.5em;
    padding: 0.8em 0; }
  /*---------------------------------------------*/
  /* overview pages */
  /*---------------------------------------------*/
  .overview-holder {
    font-size: 24px; }
  .preview_image:not(:nth-child(-n+3)) {
    display: none; } }

/*---------------------------------------------*/
/* Content View pages */
/*---------------------------------------------*/
.single_day_div {
  width: 400px; }

/*------------------------------------------------------------------------------------------*/
/* mobile */
/*------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 800px) {
  #index_nav ul {
    height: 100%;
    padding-top: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center; }
  #index_nav li {
    margin: 30px auto; }
  .preview_image:not(:nth-child(-n+2)) {
    display: none; }
  #copyright, #main-page-image {
    display: none; }
  .label-toggle {
    font-family: andale; }
  footer ul {
    width: 100%; } }

@media only screen and (max-width: 520px) {
  .preview_image:not(:first-of-type) {
    display: none; } }
