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

* { margin: 0; padding: 0; }
body{
	font-family: Arial, Helvetica, sans-serif;
	font-size: medium;
	color: #333;
	background-image: url(../images/background_pattern_13.png);
	background-repeat: repeat;
} 
.bodycopy {
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	line-height: 1.25em;
	text-align: justify;
	margin: 15px;
}
.bodycopy ul li {
	list-style: square
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
}
.bodycopy a {
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	line-height: 1.5em;
	color: #FFF;
	text-decoration: underline;
	text-align: right;
}

ul {

     margin-left: 2em;

}



#main { width: 100%; margin: 0; padding: 0;}
#shade { width: 59.75em; margin: 0 auto; padding: 0; background-image:url(../images/white_with_shadow_bkgd_3.png); background-repeat: repeat-y; background-color: transparent; } 
#container { width: 59.375em; margin: 0 auto; background-color: #fff; padding: 0; } 
#header {
	width: 59.375em;
	background-color: #fff;
	background-image: url(../images/2017_ouac_logo.png);
	background-repeat: no-repeat;
	background-position: center bottom;
} 
/* This is the logo link clickable area */
#skipper {
	width: auto;
	height: 0.813em;
	margin: 0em;
	float: right;
	font-size: small;
	padding-top: 9em;
	padding-right: 1em;
	padding-bottom: 0.2em;
	padding-left: 0.2em;
} 
#dates {
	width: 21.875em;
	height: 5em;
	margin-top: 0em;
	margin-right: 5em;
	margin-bottom: 0.938em;
	margin-left: 5em;
	padding-top: 1.875em;
	padding-right: 0.313em;
	padding-bottom: 0.625em;
	padding-left: 0.625em;
} 
.dates_heading { font-family: Arial, Helvetica, sans-serif; font-size: small; font-weight: bold; color: #333; }
ul.dates { list-style-type: none; }
li.dates { font-weight: bold; color: #339;} 

#banner { float: left; width: 100%; background-image: url(../images/banner_bkgd.png); background-repeat: repeat-x; background-color: #fff; margin: 0 auto; padding-top: 1em; z-index: 0; } 
#banner_left { width: 1.625em; height: 4em; background-image:url(../images/left_banner_wo_shade.png); background-repeat: no-repeat; margin-left: -1.625em; margin-top: -1em; z-index: 1; } 
#banner_right { float: right; width: 1.625em; height: 4em; background-image: url(../images/right_banner_wo_shade.png); background-repeat: no-repeat; margin-right: -1.625em; margin-top: -2.2em; }
/* #banner_right { float: right; width: 1.563em; height: 3.813em; background-image: url(../images/right_banner_wo_shade.png); background-repeat: no-repeat; margin-right: -1.563em; margin-top: -2.188em; } */

#wordmark { float: left; width: 11.875em; height: 11.875em; margin-top: -6em; margin-left: 3em; margin-bottom: 0em; z-index: 1000; }

#left_wave { position: relative; background-image:url(../images/bottom_left_wave.png); background-repeat: no-repeat; background-color: transparent; width: 8.688em; height: 15.188em; z-index: -10000; top: 4.375em; left: -64.5em; }
#right_wave { position: relative; background-image:url(../images/top_right_wave.png); background-repeat: no-repeat; background-color: transparent; width: 8.938em; height: 11.563em; z-index: -1000; top: -9.375em; left: -4.063em; } 
#social { position: relative; background: transparent; border: none; width: 8.75em; height: 3.125em; top: -7.5em; left: 0em; margin: 0em; } 
#social a { display: block; width: 8.75em; height: 3.125em; } 

#wrap_1 { width: 59.813em; padding: 0; margin: 0; }  
#wrap_2 { width: 100%; padding: 0; margin: 0; background-color: fff;} 

#left { float: left; width: 34%; padding: 0.625em 0 1.25em 0; margin:0 1% 0 3%; display: inline; background:#fff; } 
#centre { float: left; width: 38%; padding: 0.625em 0 1.25em 0; margin:0 0.5% 0 1.5%; background:#fff; } 
#second_left { float: left; width: 72%; padding: 0.625em 0 1.25em 0; margin:0 1% 0 3%; display: inline; background:#fff; }
#right { float: right; width: 20%; padding: 0.625em 0 1.25em 0; margin:0 3% 1% 0; display: inline; background:#fff; } 
#app { margin: 1.875em 0 0 -0.625em; } 

#facts {
	width: auto;
	display: block;
	background-color: #004677;
	margin: 5;
	border: solid 0.063em #333;
	font-family: Arial, Helvetica, sans-serif;
	font-size: medium;
	color: #FFF;
	background-repeat: no-repeat;
	background-position: left top;
	padding-top: 0.313em;
	padding-right: 0.313em;
	padding-bottom: 0.313em;
	padding-left: 0.625em;
} 
#facts img { margin: 0.625em 0 1.25em 0; } 
#facts h2 {
	font-family: Arial, Helvetica, sans-serif;
	color: #FFF;
	text-align: left;
	font-size: 1em;
	font-weight: bold;
	margin-bottom: 1em;
	margin-top: 0.625em;
	border: none;
} 
#facts h3 { font-family: Arial, sans-serif; color: #000; text-align: left; font-size: 0.9em; margin-bottom: 0; margin-top: 0.625em; border: none; } 
p#facts { font-family: Arial, sans-serif; color: #000; text-align: left; font-size: 0.75em; margin-bottom: 0; margin-top: 0.625em; border: none; }
ol#facts {
	font-family: Arial, Helvetica, sans-serif;
	color: #FFF;
	font-size: small;
	padding-left: 1em;
	border: none;
	background-color: #004677;
	background-image: url(../images/blue.gif);
	margin-top: 0.625em;
	margin-right: 0.625em;
	margin-bottom: 20px;
	margin-left: 0.625em;
	text-align: left;
} 
#facts > li {
	margin-top: 5px;
	margin-right: 0;
	margin-bottom: 20px;
	margin-left: 0;
	border-bottom-style: none;
	border-bottom-width: 0px;
	border-top-width: 0px;
	border-right-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-left-style: none;
}

#footer {
	clear: both;
	width: 59.375em;
	background-color: #004677;
	text-align: right;
	padding: 2.5em 0 0.625em 0;
} 
#ouf_logo { float: left; margin: -5.625em 0 0 0.625em; padding: 0.625em; } 
#ouac_logo_2 { float: left; margin: -2.188em 0 0 0.625em; padding: 0.313em; } 


.nav li { display: inline; list-style-type: none; overflow: visible; } 
.nav li a { font-family: Arial, sans-serif; font-size: 0.95em; font-weight: bold; text-decoration: none; color: #fff; margin-right: 0.875em; margin-left: 0.875em; } 
.nav li a:hover { text-decoration: underline; }
.nav li a:active { text-decoration: underline; }

#navfooter { margin: -0.938em 0 0 0; } 
.navfooter li { display: inline; list-style-type: none; font-family: Arial, sans-serif; font-size: 0.8em; color: #fff; padding-right: 0.625em; padding-left: 0.625em; }  
.navfooter a { text-decoration: none; color: #fff;} 
.navfooter a:hover { text-decoration: underline; }
.navfooter a:active { text-decoration: underline; }
.navcopy { font-family: Arial, sans-serif; font-size: 0.7em; color: #fff; padding-top: 0.188em; padding-right: 0.75em; padding-left: 0.625em; margin-top: 0.188em; } 
.navcopy > a { text-decoration: none; color: #fff; }
.navcopy a:hover { text-decoration: underline; }

h1 { font-family: Arial, Helvetica, sans-serif; color: #000; text-align: left; font-size: 1.15em; padding-top: 0.313em; } 
h2 {
	font-family: Arial, Helvetica, sans-serif;
	color: #000;
	text-align: left;
	font-size: 1.05em;
	margin-bottom: 0.313em;
	margin-top: 0.625em;
} 
.slider_captions {
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	color: #999;
	text-align: center;
}
.slider_h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: large;
	color: #000;
	text-align: center;
}

p { font-family: Arial, Helvetica, sans-serif; font-size: 0.9em; color: #000; margin: 0.938em 0.313em 0.313em 0.313em; } 

a {	color: #F30; text-decoration: none }
a:hover { color: #F30; text-decoration: underline; }
a:visited { color: #999; text-decoration: none; } 
a img { text-decoration: none; border: 0 none; }


/*  Slideshow */
		
/*** Overall MovingBoxes Slider ***/
.mb-wrapper {
	border: 5px solid #ccc;
	margin: 0 auto;
	position: relative;
	left: 0px;
	top: 0;
	border-radius: 1em;
	-moz-border-radius: 1em;
	-webkit-border-radius: 1em;
	box-shadow: inset 0 0 10px #888;
	-moz-box-shadow: inset 0 0 10px #888;
	-webkit-box-shadow: inset 0 0 10px #888;
}

/* Panel Wrapper */
.mb-slider, .mb-scroll {
	width: 100%;
	height: 100%;
	overflow: hidden;
	margin: 0 auto;
	padding: 0;
	position: relative;
	left: 0;
	top: 0;

	/***(>'-')> Control Panel Font size here <('-'<)***/
	font-size: 18px;
}

/* active slider border highlight */
.mb-active-slider {
	border-color: #ccc; /* 999bff */
}

/*** Slider panel ***/
.mb-slider .mb-panel {
	margin: 0;
	padding: 10px 5px;
	display: block;
	cursor: pointer;
	float: left;
	list-style: none;
}

/* Cursor to arrow over current panel, pointer for all others,
change .current class name using plugin option, currentPanel : 'current' */
.mb-slider .mb-panel.current {
	cursor: auto;
}

/*** Inside the panel ***/
.mb-inside {
	padding: 10px;
	border: 1px solid #999;
}

.mb-inside * {
	max-width: 100%;
}

.mb-inside img { width: 100%; }

/* height of the placeholder until image completely loads - needed for
   webkit browsers, add this only if you don't want the height animation
   on startup. 326px measures the height of the current image when enlarged 
*/
#slider-two .current img { /* height: 326px; */ }

/*** Left & Right Navigation Arrows ***/
a.mb-scrollButtons {
	display: block;
	width: 45px;
	height: 58px;
	background: transparent url(../photo_gallery/images/arrows.png) no-repeat;
	position: absolute;
	top: 50%;
	margin-top: -29px; /* if you change the arrow images, you may have to adjust this (1/2 height of arrow image) */
	cursor: pointer;
	text-decoration: none;
	outline: 0;
	border: 0;
}
a.mb-scrollButtons.mb-left {
	background-position: left top;
	left: -45px;
}
a.mb-scrollButtons.mb-right {
	background-position: right top;
	right: -45px;
}
a.mb-scrollButtons.mb-left:hover {
	background-position: left bottom;
}
a.mb-scrollButtons.mb-right:hover {
	background-position: right bottom;
}
a.mb-scrollButtons.disabled {
	display: none;
}

/*** Controls added below the panels ***/
.mb-controls {
	margin: 0 auto;
	text-align: center;
	position: relative;
	z-index: 100;
	background-color: #ccc;
	vertical-align: middle;
	}
.mb-controls a {
	display: inline-block;
	text-decoration: none;
	padding: 2px;
	height: 18px;
	margin: 0 5px 0 0;
	text-align: center;
	outline: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	background-color: #CCC;
	background-image: url(../photo_gallery/images/indicator_grey.png);
	background-repeat: no-repeat;
	background-position: center center;
}
.mb-controls a.current, .mb-controls a:hover {
	font-weight: bold;
	background-image:url(../photo_gallery/images/indicator.png);
	background-repeat: no-repeat;
	background-position: center;
	background-color: #CCC;
}
.mb-active-slider .mb-controls {
	background: #ccc; /* 999bff */
}