:root {
  /* colors */
	--main_bg: peachpuff;
	--main_text: purple;
	--main_box: yellow;
	--links_basic: cadetblue;
	--links_hover: pink;
	--links_visited: grey;
  /* type sizing*/
	--title: 60px;
	--header: 30px;
	--subtitle: 25px;
	--accent-subtitle: 25px;
  --main_font: monospace;
  --main_font-weight: normal;
  --main_font-style: italic;
	--main_font-size: 20px;
} 

body {
  background: var(--main_bg);
  color: var(--main_text);
  font-family: var(--main_font);
  font-style: var(--main_font-style);
  font-size: var(--main_font-size);
  font-weight: var(--main_font-weight);
	background-size: 40px 40px;
  background-image:
    linear-gradient(to right, grey 1px, transparent 1px),
    linear-gradient(to bottom, grey 1px, transparent 1px);

}

header {
  text-align: center;
  font-style: normal;
  font-variant: small-caps;
}

main {
  display: flex;
  flex-flow: column;
  max-width: 80vw; 
  margin: auto;
	margin-bottom: 2em;
}

a {
	color: var(--links_basic);
}

main div {
	border: solid 1px var(--main_text);
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  background: var(--main_bg);
  padding: 0 1rem 0 1rem;
}

main div a {
  text-align: center;
}

main div.pic {
  padding: 0;
}

main div.pic a {
  line-height: 0;
}

div#darpan{
  grid-area: darp;
}
div#water{
	grid-area: wtr;
  background-image: url('../water/water-meditation.gif');
}
div#library{
  grid-area: lib;
}
div#live{
	grid-area:live;
}
div#newsletter{
  grid-area: news;
}
div#picture{
  grid-area: pic;
}
div#picture2{
	grid-area:pic2;
}
div#link {
  grid-area: link;
}
div#yoga-set{
  grid-area: kry;
}
div#drink{
  grid-area: drnk;
}
div#resources{
  grid-area: res;
}
div#expanding{
	grid-area: exp;
}
img {
  max-width: 100%;
} 

@media(min-width: 40em) {
  main {
    display: grid;
    grid-gap: 1em;
    min-height: 90vh;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-areas:
    "darp darp darp lib live news"
    "darp darp darp lib live news"
    "darp darp darp pic pic  pic"
    "wtr  wtr  wtr pic pic  pic"
    "wtr  wtr  wtr pic pic  pic"
    "pic2 pic2 kry kry res res"  
    "pic2 pic2 kry kry exp exp"
    "drnk drnk kry kry exp exp"
    "drnk drnk kry kry exp exp"
    ;
  }
}
/* six columns seven rows