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

body { background-color:#fefdfb; color: #555; font-family: 'Abel', sans-serif; font-size: 93%; font-weight:normal;margin: 0; }
a:link, a:visited, a:active{ color:inherit; text-decoration: none; }
a:hover {color: #000; text-decoration:underline; }

.right {text-align:right; }
.hide {display: none;}
.img-left{float: left; margin:5px 10px 5px 0;}
.img-right{float: right; margin:5px 0 5px 10px;}

#loader-wrapper { position: fixed; top: 0; width: 100%; height: 100%; background-color: #FFFFFF; background-image: url("https://upload.wikimedia.org/wikipedia/commons/b/b1/Loading_icon.gif");  background-repeat: no-repeat; background-position: center; z-index: 1000; opacity: 1;}
    
#container {
    width:100%;
    margin-top:10px;
}

#pageheader {
    width:80%;
    margin:auto;
}

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

.pageitem {
    display:table;
    table-layout:fixed;
    width:100%;
    margin-bottom:15px;
    padding-top:15px;
}

#pageheader h1 {
    font-size:250%;
    font-weight:normal;
    color:#555;
    margin:0;
}

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

.pageitem p {
    padding:0;
    margin:1em 0;
    font-size:115%;
    line-height:175%;
    text-align:justify;
}

.pageitem a {
	text-decoration:underline;
}

.pageitem .col {
     padding:0 2% 0 1%;    
}

.col {
    display: table-cell;
}

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

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

#credits {
    display:table;
    table-layout:fixed;
    width:100%;
    font-size:12px;
    color:#777;
    line-height:100%;
    text-align:center;
}

#show-menu  {display:none;}
.open, .close { background-color:inherit; color:#fff; text-align:right; font-weight:normal; font-size:1.5em; padding: 0; position:absolute; top:10%; right:5%; display:none; }


/* start make items responsive */
@media screen and (max-width : 1024px){

/* other items */
.pageitem p { padding:0; line-height:150%; font-size:99%;}
.pageitem .col {padding:0 3% 0 2%; }

}

@media screen and (max-width : 700px){

.col { float:left; margin:auto; width:100%; margin-bottom:10%;}
#credits p { text-align:center; margin-bottom:-10%;}

}
/* end make items responsive */