@import url(http://fonts.googleapis.com/css?family=Abel);

body { background-color:#fefdfb; color: #555; font-family: 'Abel', sans-serif;  font-size: 14px; font-weight:normal;margin: 0; }
a:link, a:visited, a:active{ color:inherit; text-decoration: none; }
a:hover {color: #009933; text-decoration:underline; }
img {padding:5px; border-radius: 50%;
 -webkit-border-radius: 50%;
 -moz-border-radius: 50%;}

.icon, .hide {font-size:20px;}
.right {text-align:right; }
.hide {display: none;}

#menu {
    width:100%;
    min-height:35px;
    background-color: #009933 /*#B61B82 #03D7CB  #FC436B*/;
    position:fixed;
    top:0; left:0;
}

#menu a {
    background-color:inherit;
    color: #fff;
}

#menu a:hover {
    background: inherit;
    color: #ccc;
    text-decoration:none;
}

nav {
    display: table;
    table-layout: fixed;
    width: 70%;
    margin: 0 auto;
}

ul#topnav  {
    display: table-row;
    padding: 0;
    overflow: hidden;
    position:relative;
    bottom:0;
}

ul#topnav li {
    list-style-type: none;
    display: table-cell;
    text-align:center;
    vertical-align:middle;
}

img#kris {
	all: initial;
}

ul#topnav li a {
    display:block;
    padding:4px 0px;
}

#container {
    width:100%;
    margin-top:48px;
}

#pageheader {
    display:table;
    width:62.5%;
    margin:auto;
}


.section {
    width:62.5%;
    border-top:1px solid #eee;
    padding:20px 0;
    margin:auto;
}

.pageitem {
    display:table;
    width:100%;
    margin-bottom:15px;
    padding-top:15px;
    text-align:center;
}

.pageitem h1 {
    font-weight:normal;
    color:#555;
    margin:0;
    text-align:center;
}

.pageitem h2 {
    font-size:24px;
    background-color:inherit;
    color:#444;
    margin-top:0;
}

.pageitem video {
    max-width: 100%;
    max-height: 100vh;
    height: auto;
}

.pageitem p em {
    background-color:inherit;
    color:#444;
    font-size:40px;
    font-style:normal;
    font-weight:100;
}

.pageitem p {
    padding:0 75px;
    margin:0;
    font-size:18px;
    line-height:200%;
 }


.col {
    display: table-cell;
}


.col ul#sub {
    float:right; 
    padding:0;
    margin:0; 
}

.col ul#sub li {
    display:inline;
    list-style-type: none;
    text-align:right;
}

.col ul#sub li a {
    padding:5px;
    background-color:inherit;
    color:#777;
}

.col ul#sub li a:hover {
    color:#009933;
}

#footer {
    display:table;
    width:100%;
    margin-bottom:15px;
    padding:15px 0;
    text-align:left;
    font-size:13px;
     color:#999;
}

#footer p {
     text-align:left;
     padding:0;
}

ul#bottomnav  {
    display: table-row;
    padding: 0;
}

ul#bottomnav li {
    list-style-type: none;
    display: table-cell;
    text-align:left;
    font-weight:bold;
    vertical-align:top;
}

ul#bottomnav li ul {
padding:0;
padding-bottom:20px;
}

ul#bottomnav li li {
    display: list-item;
    font-weight:100;
}

#credits {
    display:table;
    width:100%;
    text-align:left;
    font-size:12px;
    color:#999;
    line-height:100%;
}

#show-menu {display: none;}
.responsive { background-color:inherit; color:#fff; text-align:left; font-weight:normal; font-size:1.5em; padding: 0; position:absolute; top:10%; left:5%; display:none; }
@media screen and (max-width : 700px){

/* menu */

ul#topnav {display:none;}
.hide, .responsive { display:block;}
.icon { display:none;}
.logo {  position:absolute; top:10%; right:50%;}
.search {position:absolute; top:10%; right:5%; }

#show-menu:checked ~ ul#topnav {display: block; position: absolute; top:100%; width:100%; margin:0; overflow:visible; }
ul#topnav li { display: block; text-align:left; margin:0 0 1px -15%; background-color:#009933;}
ul#topnav li a { padding-left:20px;}

.pageitem p{
    padding:0;
}

.col {
    float:left;
    margin:auto;
    width:100%;
    text-align:center;
}

.col ul#sub {
   clear:both;
   float:none;
   margin:auto; 
}

.col ul#sub li {
    text-align:center;
}

ul#bottomnav {
    display: list-item;
    list-style-type: none;
 }

ul#bottomnav li {
    display:block;
    text-align:center;
}

#credits p{
text-align:center;
}