@import url('https://fonts.googleapis.com/css?family=Arvo|Open+Sans');


html{
	box-sizing: border-box;
}

*, *before, *:after{
	box-sizing: inherit;
}

body{
	padding: 0% 10px;
	font-family: "Open Sans", sans-serif;
	margin-top: 20px;
}

main, header, .centered{
	max-width: 1213px;
	margin-left: auto;
	margin-right: auto;
	
	}

header nav a:link, header nav a:visited, nav label{
	padding: 15px;
	display: inline-block;
	font-weight: bold;
	font-size: 1.2em;
	text-decoration: none;
	color: #001430;
	width: 100%;
	text-align: center;
	
}

header nav a:hover, nav label{
	background: #001430;
	color: white;
	}

header nav a:active{
	background: #001430;
	color: #cccccc;
}

main nav div{
	font-size: .9em;
		line-height: 1em;
	padding: 10px 10px 15px 10px;
	
	}

main nav li{
	background-color:  #001430;
	margin: 2px 0px;
	display: inline-block;
}

main nav a:link, main nav a:visited{
	text-decoration: none;
	color: #ffffff;
	text-align: center;
}

main nav a:hover img{
	opacity: .5;
}

main nav a:hover div{
	color: #cccccc;
}

main nav a:active div{
	text-decoration: underline;
}

h1,h2,h3,h4,h5,h6{
	font-weight: normal;
	font-family: 'Arvo', serif;
	margin-bottom: .5em;
	margin-top: 1em;
	text-transform: capitalize;
}

h1{
	font-size: 2em;
}

h2{
	font-size: 1.5em;
}

h3{
	font-size: 1.25em;
}

h4{
	font-size: 1em;
}

p{
	font-size: 1em;
	margin: 10px 0px;
	line-height: 1.3em;
	
}

blockquote{
	font-size: 1.2em;
	font-weight: strong;
	line-weight: 1.3em;
	padding: 20px 30px;
	color: #828c9a;
	font-style: italic;
	position: relative;
		}

blockquote:before, blockquote:after{
	font-size: 7em;
	color: #cccccc;
	position: absolute;
}
	

blockquote:before, q:before{
	content: '"';
	top: -20px;
	left: -35px
}

blockquote:after{
	content: '"';
	bottom: -80px;
	position: absolute;
	
}

q{
	text-decoration: underline;
}

q:before, q:after{
	content: '"';
	font-size: 1em;
}

strong{
	font-weight: bold;
}

em{
	font-style: italic;
}

main ul{
	list-style-type: disc;
}

main ol{
	list-style-type: decimal;
}
main ul, main ol{
	line-height: 2em;
	list-style-position: inside;
}

main ol ul, main ol ul, main ol ol, main ul ul{
	padding-left: 20px;
	margin: 10px;
	line-height: 1.5em;
	color: #777777;
}

article{
	
	margin: 5px 0px;
	padding: 20px;
}

article img{
	width: 100%
	max-width: 100px;
}

.oddarticle{
	background: #dddddd;
}

.author{
		font-weight: bold;
}

.button:link{
	border: 1px solid #001430;
	color: #001430;
	padding: 10px;
	display: inline-block;
	font-size: .8em;
	text-decoration: none;
	margin-top: 10px;
	transition: .5s;
		
}

.button:visited{
	color: #666666;
	border: 1px solid #666666;
}

.button:hover{
	color: #ffffff;
	border: 1px solid #001430;
	background: #001430;
	padding: 10px 20px;
}

.button:active{
	color: #ffffff;
	text-decoration: underline;
	background: #001430;
}

footer{
	background: #001430;
	color: white;
	padding: 30px;
	line-height: 1.25em;
	font-size: .8em;
	margin-top: 50px;
	text-align: center;
	margin-left: -10px;
	margin-right: -10px;
	
}

footer p{
	line-height: .4em;
}

.social li{
	display: inline-block;
	}

footer a:link, footer a:visited{
	color: #999;
}

footer a:hover{
	color: #bbb;
}

footer a:active{
	color: #fff;
}

#conference-center{
background-image: url(../images/conference-center-full.jpg);
padding: 50px;
color: white;
text-shadow: 2px 2px 2px black;
background-size: cover;
background-position: center;
margin: 10px -10px;
}

	
}
#conference-center p{
	width: 35%;
	min-width: 200px;
	
}

.col{
	display: inline-block;
	vertical-align: top;
	margin: .5%;
	padding: 0px;
}

main nav .col{
	padding: 0px%
}

.onefourth{
	width: 24%;
}

.onefourth img{
	width: 100%;
}

main nav ul{
	font-size: 0px;
}
main nav li{
	font-size: 1rem;
}
.onethird{
	width: 32.3333%;
	}
.onethird img{
	width: 100%;
	
}

.twothird{
	width: 65.3333%;
}

.col-container{
	font-size: 0px;
	
}

.col-container > *{
	font-size: 1rem;
	
}

#links{
	display: none;
	}
#toggle:checked ~ #links{
	display: block;
	}

#toggle{
	display: none;
}

nav label{
	margin-top: 10px;
}

header{
	text-align: center;
}

@media screen and (min-width: 800px){
	
	#links li{
		display: inline-block;
	}
	
	#toggle:not(:checked) ~ #links{
		display: block;
		
	}
	nav label, #toggle{
		display: none;
	}
	
	#links{
		text-align: right;
		margin-top: -30px;
	}
	
	header{
		text-align: left;
	}
	
}

@media screen and (max-width: 800px){
	.onethird	, twothird{
		width: 100%;
	}
}