@charset "utf-8";
/* CSS Document */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section,
summary {
  display: block;
}
@font-face {
    font-family:caviardreams; 
    src:url(Fonts/caviardreams-webfont.woff)
}

html, body{height: 100%;font-family:"caviardreams";}
html, body, div, span, h1, h2, h3, h4, h5, h6, p, ul, li {
	margin: 0;
	padding: 0;
	border: 0;
}
body {background-image:url(Carolyn%20Li%20Ming%20Geh.jpg); background-position:center; background-repeat:no-repeat; background-size:cover; background-attachment:fixed;
		}

@media only screen and (max-width: 480px) {
header {width: 100%; 
 		/*position:absolute;*/}
header h1 {font-size:200%; 
 	margin-top:30px; 
	color: rgb(252,252,252);
	text-align:center;
	}
	
header	h1 a:link {color:rgb(252,252,252);text-decoration:none;}
header	h1 a:visited {color: rgb(252,252,252);}
header	h1 a:hover {color: rgb(252,252,252);}

nav { width:100%;
	 margin-top:10px;
	 text-align:center;
	}

nav ul li {
	font-size: 14px;
	list-style-type: none;
	margin-right: 10px;
	border:none;
	line-height:8px;
	display:inline;
	}
		
nav a:link {text-decoration:none; border:none; color: rgb(252,252,252);}
nav a:visited {color: rgb(252,252,252);}
nav a:hover {color: rgb(252,252,252);}

footer {
	width: 100%;
	bottom:0;
	position:fixed;}

	#site-info {
	width: 100%;
	margin: 0 auto;}
	
	.copyright {width:100%; }
    p.copyright {
	font-size: 14px;
	text-align: center;
	float:right; margin: 0; padding:0; /*all three needed to make p and ul on the same line*/
	margin-bottom:20px;
	margin-top:15px;
	color:rgb(102,102,102);}
	
	p.copyright a:link {color: rgb(102,102,102); text-decoration:none;}
	p.copyright a:visited {color: rgb(102,102,102); text-decoration:none;}
	p.copyright a:hover {color: rgb(102,102,102); text-decoration:none;}
	p.copyright a:active {color: rgb(102,102,102); text-decoration:none;}
}


@media only screen and (min-width: 481px) {
header {width: 500px; position:absolute;}
header h1 {font-size:36px; 
 	margin-top:50px; 
	margin-left: 40px;
	color: rgb(252,252,252);
	}
	
header a:link {text-decoration:none; border:none; color: rgb(252,252,252);}
header a:visited {color: rgb(252,252,252);}
header a:hover {color: rgb(252,252,252);}

nav {width:300px; 
	 margin-top:130px;
	 position:absolute;}

nav ul li {
	font-size: 20px;
	list-style-type: none;
	margin-left: 40px;
	margin-top: 20px;
	border:none;
	font-weight:300;
	line-height:8px;
	 }
		
nav a:link {text-decoration:none; border:none; color: rgb(252,252,252);}
nav a:visited {color: rgb(252,252,252);}
nav a:hover {color: rgb(252,252,252);}

#side-menu {
/*  position: absolute;*/
   left: -300px;  /* uncomment to default hidden */
   margin-top:30px;
}
#content-button {
    width: 100%;
    height: 50px;
}

#open-menu {
    width: 100px;
    height: 100px;
	margin-left:40px;
	font-size:42px;
	color: rgb(252,252,252);
	cursor: pointer; cursor: hand;
}


footer {
	width: 100%;
	bottom:0;
	position:fixed;
	}


	#site-info {
	width: 100%;
	margin: 0 auto;
		}
	
	.copyright {width:100%; }
    p.copyright {
	font-size: 14px;
	text-align: center;
	float:right; margin: 0; padding:0;	 /*all three needed to make p and ul on the same line*/
	margin-bottom:20px;
	margin-top:15px;
	color:rgb(102,102,102);}
	
	p.copyright a:link {color: rgb(102,102,102); text-decoration:none;}
	p.copyright a:visited {color: rgb(102,102,102); text-decoration:none;}
	p.copyright a:hover {color: rgb(102,102,102); text-decoration:none;}
	p.copyright a:active {color: rgb(102,102,102); text-decoration:none;}

}



@media only screen and (min-width: 1024px) {
header {width: 500px; position:absolute;}
header h1 {font-size:46px; 
 	margin-top:50px; 
	margin-left: 40px;
	color: rgb(252,252,252);
	}
	
header a:link {text-decoration:none; border:none; color: rgb(252,252,252);}
header a:visited {color: rgb(252,252,252);}
header a:hover {color: rgb(252,252,252);}

nav {width:300px; 	
	 margin-top:160px;
	 position:absolute;}

nav ul li {
	font-size: 20px;
	list-style-type: none;
	margin-left: 50px;
	margin-top: 20px;
	border:none;
	font-weight:600;
	line-height:10px;
	 }
		
nav a:link {text-decoration:none; border:none; color: rgb(252,252,252);}
nav a:visited {color: rgb(252,252,252);}
nav a:hover {color: rgb(252,252,252);}

#side-menu {
/*  position: absolute;*/
   left: -300px;  /* uncomment to default hidden */
   margin-top:30px;
}
#content-button {
    width: 100%;
    height: 50px; /*Space between → and the Ul li*/
}

#open-menu {
    width: 100px;
	margin-left:40px;
	
}
	
}