body,html{
 	font-size:22px;
 	background-color:#EEE;
 	/*image-rendering: pixelated;*/
}
img, object, iframe{
	display: block;
    margin-left: auto;
    margin-right: auto;
}

p{
	max-width:650px;
	display: block;
    margin-left: auto;
    margin-right: auto;
}

p img{
	display: inline;
	vertical-align: middle;
	border:0;
	padding:0 1px 2px 0;
	margin:0;
	vertical-align: -16%;
	max-width: 650px;
}

li img{
	display: inline;
	vertical-align: middle;
	border:0;
	padding:0 1px 2px 0;
	margin-top:13px;
	vertical-align: -16%;
}

img{
	max-width: 100%;
    height: auto;
    width: auto\9; /* ie8 */
}

p a{
	background: rgba(0,128,255,0.3);
}

p a:hover{
	background: white;
}

li a{
	background: rgba(0,128,255,0.3);
}

li a:hover{
	background: white;
}

ul{
	text-align:left;
	margin:0;
	padding:0;
}

li{
	font-family: courier, Comic Sans MS, courier, "Courier New", Georgia, serif;
	list-style:none;	
	margin:0;
	padding:0;
}

#header1{
	text-align:left;
}

.center_this{
	text-align:center;	
}

pre{
	width:40em;
	margin-left:1em;
	margin-left:auto;
	margin-right:auto;
}

.pre{
	white-space:pre;
	border-style:solid;
	border-color:silver;
	border-width:1px;
	background-color: #F2F2F2;
	overflow:hidden;
}
	
#content ul, ol{
	display: block;
}

#menu{
	padding:40px;
}

#rootlink{
	position:fixed; top:0; left:0;
	margin:0;
	padding:0;
}

#dropmenu{
	position:fixed; top:0.4em; right:0.4em;
}

/*extra wide imges and videos*/
.images{
    max-width: 100%;
    height: auto;
    width: auto\9; /* ie8 */
    margin-bottom:0.31em;
    margin-top:0.31em;
}
.container {
    max-width: 900px;
    margin-left:auto;
    margin-right:auto;
}
.videocontainer {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
}
.video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/*switch screen size*/
@media screen and (max-height: 2200px){
	.container {
    	max-width: 2200px;
	}
}
@media screen and (max-height: 1300px){
	.container {
    	max-width: 1300px;
	}
}
@media screen and (max-height: 900px){
	.container {
    	max-width: 900px;
	}
}
@media screen and (max-height: 700px){
	.container {
    	max-width: 700px;
	}
}

/* Smartphones (portrait and landscape) ----------- */
@media only screen  
and (max-device-width : 480px) {
/* Styles */
img, embed, iframe, p, ul, li{
max-width:420px;
}
}