@charset "UTF-8";


@import url(https://fonts.googleapis.com/css?family=Roboto+Mono:400,300,300italic,400italic,500,500italic,600);


img, embed, object, video{
	max-width: 100%;
	}
	
	
.grid {
    margin: 0 auto;
    max-width: 400px;
    width: 100%;
	padding: 70px;
}


* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
}


.title {
	font-family: 'Roboto Mono', 'Helvetica', sans-serif;
	font-weight:600;	
	font-size: 15px;
	margin: 19px 0;
	text-align: left;
}


A.titlelink {color:black;}
A.titlelink:link  {text-decoration: none; color: black;}
A.titlelink:visited {text-decoration: none; color: black;}
A.titlelink:hover {text-decoration: none; color: black;}
A.titlelink:active {text-decoration: none; color: black;}





.about {
	font-family: 'Roboto Mono', 'Helvetica', sans-serif;
	font-weight:400;	
	font-size: 14px;
	text-align: left;
}



.eventlisting {
	font-family: 'Roboto Mono', 'Helvetica', sans-serif;
	font-weight:400;	
	font-size: 14px;
	text-align: left;
}

A.eventlistinglink {color:#999;}
A.eventlistinglink:link  {text-decoration: none; color: #999;}
A.eventlistinglink:visited {text-decoration: none; color: #999;}
A.eventlistinglink:hover {text-decoration: none; color: #666;}
A.eventlistinglink:active {text-decoration: none; color: #666;}



.eventtitle {
	font-family: 'Roboto Mono', 'Helvetica', sans-serif;
	font-weight:500;	
	font-size: 14px;
	text-align: left;
}



.name {
	font-family: 'Roboto Mono', 'Helvetica', sans-serif;
	font-weight:500;	
	font-size: 14px;
	text-align: left;
	line-height:2.5;
}




img {
    padding-top: 20px;
    padding-bottom: 20px;
}


smallimg img {
	padding-top: 20px;
	padding-bottom: 20px;
	width: 10%;
}

.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.row {
	list-style: none;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: flex;
  -webkit-flex-flow: row wrap;
  -moz-flex-flow: row wrap;
  -ms-flex-flow: row wrap;
  flex-flow: row wrap;
  position:relative;
}

.testsmallcol {
	-webkit-flex:auto;
  -moz-flex:auto;
  flex: auto;
  width: 10%;
}

.testlargecol {
	-webkit-flex:auto;
  -moz-flex:auto;
  flex: auto;
  width: 90%;
}


@media only screen and (min-width:30em) {
	 .testsmallcol {
    width:10%; 
  }
  	.testlargecol {
	width:90%;
}
}

@media only screen and (min-width:40em) {
	 .testsmallcol {
    width:30%; 
  }
  	.testlargecol {
	width:70%;
}
}

@media only screen and (min-width:50em) {
	 .testsmallcol {
    width:40%; 
  }
  	.testlargecol {
	width:60%;
}
}