@charset "UTF-8";
/* Generated by Font Squirrel (http: //www.fontsquirrel.com) on December 11, 2010 09: 59: 59 AM America/New_York */
@font-face {
font-family: 'DesyrelRegular';
src: url('../f/desyrel-webfont.eot');
src: local('☺'), url('../f/desyrel-webfont.woff') format('woff'), url('../f/desyrel-webfont.ttf') format('truetype'), url('../f/desyrel-webfont.svg#webfontOicIDNk6') format('svg');
}
/* Helping older browsers understand HTML5 and reset */
article, aside, footer, header, menu, nav, section, details, body, h1, h2, h3, p, ul, li {
	border:0;
	margin:0;
	padding:0;
	display: block;	
}

body {
	background-color: #AFDDFF;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#AFDDFF), to(#00003C));        /* for cross browser compatability */
	background-image: -moz-linear-gradient(top, #AFDDFF, #00003C); /* FF3.6 */
	background-image: linear-gradient(top, #AFDDFF, #00003C); /* future proofing (hopefully) */
	filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#AFDDFF', EndColorStr='#00003C');
	margin: 0;
	padding: 0;
	color: #F6FFFC;
	font: 10px Verdana, Arial, Helvetica, sans-serif;
/* 	The iPhone automatically adjusts font size for readability, which is a great feature for users. 
	Normally we want this to happen, but with a webapp when you change the orientation of device 
	from portrait to landscape it actually scales up the text a little (due to increased width). */
	-webkit-text-size-adjust: none ;
}
div#x {                   /*  I had to specifiy an id on this div because of the Add to Homescreen by Matteo script otherwise it would be a plain div, just functional as a container.  */
	width: 40em;
	max-height: 3000em;
	margin: 0 auto;
	padding: 0;
	background: #0D81D8 url('bkaa.jpg') no-repeat;
	border: 1px solid #036;
}
header, aside, footer, article, nav, details, #home section, .homeCurtain {
	background: rgba(27, 27, 27, .2);                                                                                                    /* browser compatability code from http: //css3please.com/ */
	background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, .2)), to(rgba(19, 19, 100, .4)));        /* for cross browser compatability */
	background-image: -moz-linear-gradient(top, rgba(255, 255, 255, .2), rgba(19, 19, 100, .4));  /*FF3.6 */
	background-image: linear-gradient(top, rgba(255, 255, 255, .2), rgba(19, 19, 100, .4)); /* future proofing (hopefully) */
	-webkit-border-radius: 1em;	                                                                                                        /* for cross browser compatability */
	-moz-border-radius: 1em; /* FF1+ */
	border-radius: 1em; /* Saf3-4 */
	-webkit-box-shadow: .15em .25em .5em rgba(27, 27, 27, .6);                                                                          /* for cross browser compatability */
	-moz-box-shadow: .15em .25em .5em rgba(27, 27, 27, .6); /* FF3.5+ */
	box-shadow: .15em .25em .5em rgba(27, 27, 27, .6); /* Opera 10.5, IE 9 */
	padding: .5em;
	margin: .5em;
	border: #666;
	text-align: right;/*border: 1px dashed green;*/
}
aside, details {
	width: 30%;
	position: relative;
	float: right;
}
aside header {
	margin: 0;
	padding: .5em 1em;
	display: block;
}
img {                                                               /* browser compatability code from http: //css3please.com/ */
	-webkit-border-radius: .5em;	                                /* for cross browser compatability */
	-moz-border-radius: .5em; /* FF1+ */
	border-radius: .5em; /* Saf3-4 */
	-webkit-box-shadow: .15em .25em .5em rgba(27, 27, 100, .6);     /* for cross browser compatability */
	-moz-box-shadow: .15em .25em .5em rgba(27, 27, 100, .6); /* FF3.5+ */
	box-shadow: .15em .25em .5em rgba(27, 27, 100, .6); /* Opera 10.5, IE 9 */
	border: 0;
}
video {
	width: 80%;
	display: block;
	margin-left: auto;
	margin-right: auto;
}
a:link {
	color: #CFF;
	text-decoration: none;
}
a:visited {
	color: #CFF;
	text-decoration: none;
}
a:hover {
	color: #FFCC00;
}
a:active {
	color: #FFCC00;
}
h1, h1 a:link, h1 a:visited, h1 a:hover, h1 a:active {
	font-size: 3em;
	color: #F6FFFC;
}
h2, h2 a:link, h2 a:visited, h2 a:hover, h2 a:active {
	font-size: 2.5em;
	margin-top: -.5em;
	color: #F6FFFC;
}
h3 {
	font-size: 2em;
}
h4 {
	font-size: 1.5em;
}
h1, h2, h3, h4 {
	text-shadow: .01em .01em .3em #333;
	font-family: 'DesyrelRegular', Arial, sans-serif;
	padding: .3em;
	margin: 0;
}
p {
	text-align: left;
	line-height: 1.5em;
	font-size: 1.4em;
}
footer, nav {
	display: block;
	font-size: small;
	clear: left;
	text-align: center;/*border: 1px dashed purple;*/
	color: rgba(11, 35, 83, .9);
}
footer a: link, footer a: visited {
	color: rgba(11, 35, 83, .9);
}
footer {
	background-color: rgba(11, 35, 83, .7);
}
nav {
	overflow: hidden;
	clear: both;
}
nav ul {
	padding: 0;
	margin: 0 auto;
}
nav ul li {
	float: left;
	width: 9.2em;
	display: table-cell;
	text-align: center;
	list-style: inside;
	list-style-type: none;
	margin: .25em 2.5em;
}
sup {
	vertical-align: super;
	font-size: xx-small;
}
.banner {
	background: rgba(27, 27, 27, .2);                                                                                                    /* browser compatability code from http: //css3please.com/ */
	background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, .2)), to(rgba(19, 19, 100, .4)));        /* for cross browser compatability */
	/*background-image: -moz-linear-gradient(top, #5E8EB3, #2A4E88);  FF3.6 */ /* no transparency support, hides our background images from lower levels */
	background-image: linear-gradient(top, #5E8EB3, #2A4E88); /* future proofing (hopefully) */
	-webkit-border-radius: .5em;	                                                                                                        /* for cross browser compatability */
	-moz-border-radius: .5em; /* FF1+ */
	border-radius: .5em; /* Saf3-4 */
	-webkit-box-shadow: .15em .25em .5em rgba(27, 27, 27, .6);                                                                          /* for cross browser compatability */
	-moz-box-shadow: .15em .25em .5em rgba(27, 27, 27, .6); /* FF3.5+ */
	box-shadow: .15em .25em .5em rgba(27, 27, 27, .6); /* Opera 10.5, IE 9 */
	padding: .5em;
	margin: .5em 13.3em .5em .5em;
	border: #666;
	text-align: right;
	clear: left;
	width: auto;
}
.yellow {
	color: #FFC;
}

/* page specific CSS */

body#home div#x {
	height: 80.4em;
	background-image: none;
}
body#home .homeCurtain {
	background-image: url('../images/bkHome.jpg');
	-webkit-background-size: 100% auto;
	height: 44.6em;
	background-repeat: no-repeat;
	background-position: center center;
	-o-background-size: 100% 100%, auto;
	-moz-background-size: 100% 100%, auto;
	-webkit-background-size: 100% 100%, auto;
	background-size: 100% 100%, auto;
	width: 97.5%
}
}
body#home nav ul {
	padding: .5em;
}
body#home nav ul li {
	width: 13em;
}
#aquariums aside p img {
	width: 200px;
	height: 180px;
}
#ml article section p img {
	float: left;
	margin: 0 1em;
}
#ml article section p:nth-child(7) img {
float: right;
}
body#contact h4 {
	clear: left;
}
body#contact div article section {
	overflow: hidden;
}
body#contact div article section img {
	border: 1em solid white;
	float: left;
	margin: 0 .5em .5em 0;
}
body#contact div article section aside img {
	float: none;
	margin-left: auto;
	margin-right: auto;
	display: block;
}
body#contact div article section img:nth-child(1) {
float: right;
}
audio { width: 185px; display: block; margin:20px; }