/*******************************************/
/* Canadian Coast Connection               */
/* Author: Eric Tai                        */
/* Email: tai.eric@gmail.com               */
/*******************************************/
/* basic elements */
body {background: #4E555C; margin: 0px; background-image: url(../images/background.jpg); background-repeat: repeat-x;}
p {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif;}
h1 {font: 13pt/5pt Arial, Helvetica, sans-serif;}
h2 {font: 10pt/5pt Arial, Helvetica, sans-serif;}
h3 {font: 8pt/5pt Arial, Helvetica, sans-serif;}
a:link {text-decoration: underline; color:#333333;}
a:visited {text-decoration: underline; color: #333333;}
a:hover {text-decoration: none; color: #CCCCCC;}
a:active {text-decoration: underline; color: #333333;}
ol {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #4D4D4D;}
ul {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #4D4D4D;}
li {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #4D4D4D;}
dt {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #4D4D4D;}
dd {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #4D4D4D;}
dl {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #4D4D4D;}

img.floatleft {float: left; margin-left: 40px; margin-right: 10px; margin-bottom: 5px; margin-top:5px; border: 1px solid #727C87; }
img.floatright {float: right; margin-left: 10px; margin-right: 40px; margin-bottom: 5px; margin-top:5px; border: 1px solid #727C87; }

#topContainer {position: absolute; left: 50%; width: 750px; margin-top: 0px; margin-left: -376px; padding: 0px;}
/* #containter - Centering - The main division is absolutely positioned 50% across
 the page, and then the left margin is set to -316px, 
 ie. -((width/2) + left padding + left border) = -((600/2) + 15 + 1) = -316 */
#container {background-color: #FFFFFF; position: absolute; left: 50%; width: 750px; margin-top: 0px; margin-left: -376px; padding: 0px; border: 4px solid #FFFFFF;}

#menu {width: 750 px; height: 27px;}

#mainContent {width: 550px; height: auto; border: 1px solid #CCCCCC; margin-top:5px; margin-bottom:5px; background-image: url(../images/background_mainContent.jpg); background-repeat: repeat-x;}
/*#mainContent.multimediaFrame {width: 540px; height: auto; border: 1px solid #CCCCCC; background:#F0F0F0;}*/

#mainContent p {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #727C87; margin-left: 40px; margin-right: 30px; text-align: left; margin-top: 5px; margin-bottom: 4px; }
#mainContent p.links {font: 7pt/15pt Verdana, Arial, Helvetica, sans-serif; color: #727C87; margin-left: 10px; margin-right: 10px; text-align: left; margin-top: 5px; margin-bottom: 20px; }
#mainContent p.signature {text-align:right; margin-right:10px; margin-top:20px; margin-bottom:10px;}

#mainContent h1 {font: 13pt/5pt Arial, Helvetica, sans-serif; font-weight: bold; color: #4E555C; margin-left: 40px; margin-top: 15px; margin-bottom: 10px;}
#mainContent h2 {font: 10pt/5pt Arial, Helvetica, sans-serif; font-weight: bold; color: #7FC31C; margin-left: 40px; margin-top: 15px; margin-bottom: 10px;}	
#mainContent h3 {font: 8pt/5pt Arial, Helvetica, sans-serif; font-weight: bold; color: #4E555C; margin-left: 40px; margin-top: 15px; margin-bottom: 10px;}	
#mainContent ol {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #727C87; margin-left: 40px; margin-right: 30px;}
#mainContent ul {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #727C87; margin-left: 40px; margin-right: 30px; list-style-image: url(../images/bullet_red.gif);}
#mainContent li {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #727C87; margin-left: 30px; margin-right: 30px; vertical-align: top;}
#mainContent dt {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #727C87; margin-left: 30px; margin-right: 30px;}
#mainContent dd {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #727C87; margin-left: 30px; margin-right: 30px;}
#mainContent dl {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #727C87; margin-left: 30px; margin-right: 30px;}
#mainContent a:link {text-decoration: underline; color: #333333;}
#mainContent a:visited {text-decoration: underline; color: #333333;}
#mainContent a:hover {text-decoration: none; color: #CBCFD3;}
#mainContent a:active {text-decoration: underline; color: #333333;}
#mainContent img.multimediaImage {text-align:center; margin-top:0px; margin-bottom:0px; padding:0px; display: block; margin-left: auto; margin-right: auto;}
	
#mainContent table {font: 8pt/14pt Verdana, Arial, Helvetica, sans-serif; background: #FFFFFF; color: #727C87; margin-left: 40px; margin-right: 10px; margin-top: 5px; margin-bottom: 0px; border: 1px solid #DADDE0; border-collapse: collapse;}
#mainContent table td {text-align: center; border: 1px solid #DADDE0; padding: 2px; background:#F0F0F0; }

#mainContent table td.highlight {background:#C5C5C5;}
#mainContent table p{font: 8pt/14pt Verdana, Arial, Helvetica, sans-serif; color: #727C87; margin-left:0px; margin-right:0px;}
#mainContent table h1{font: 13pt/5pt Arial, Helvetica, sans-serif; font-weight: bold; margin-left:0px; margin-right:0px;}
#mainContent table h2{font: 10pt/5pt Arial, Helvetica, sans-serif; font-weight: bold; color: #4E555C; margin-left: 0px; margin-right: 0px;}
#mainContent table h3{font: 8pt/5pt Arial, Helvetica, sans-serif; font-weight: bold; color: #4E555C; margin-left: 0px; margin-right: 0px;}
#mainContent table ol {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #727C87; margin-left: 0px; margin-right: 0px;}
#mainContent table ul {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #727C87; list-style-image: url(../images/bullet_red.gif); margin-left: 0px; margin-right: 0px;}
#mainContent table li {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #727C87; margin-left: 0px; margin-right: 0px; vertical-align: top;}
#mainContent table dt {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #727C87; margin-left: 0px; margin-right: 0px;}
#mainContent table dd {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #727C87; margin-left: 0px; margin-right: 0px;}
#mainContent table dl {font: 8pt/16pt Verdana, Arial, Helvetica, sans-serif; color: #727C87; margin-left: 0px; margin-right: 0px;}

/*Forms--------------------------------*/
/*#maincontent form, label, input {font: 8pt/18pt Verdana, Arial, Helvetica, sans-serif; color: #727C87;}
#maincontent fieldset {width: 500px; height: 300px; padding: 0.5em 1em; display: block; background: #FCFCFC; border: #CCCCCC solid 0px; text-align: left;}

#maincontent label {position: relative; width: 6em; display: block; margin: .5em 0em;}
#maincontent label input {position: absolute; left: 100%; top: 2px;}
#maincontent label textarea {position: absolute; left: 100%; top: 0px;}
*/

#sideContent {position: absolute; top: 36px; margin-left: 556px; width: 200px;}
#sideContent p {font: 8pt/12pt Verdana, Arial, Helvetica, sans-serif; color: #727C87; margin-left: 10px; margin-right: 10px; margin-top: 2px; margin-bottom: 5px; }
#sideContent h1 {font: 10pt/13pt Arial, Helvetica, sans-serif; font-weight: bold; color: #66CC00; margin-left: 5px; margin-right: 10px; margin-top: 10px; margin-bottom: 0px;}
#sideContent h2 {font: 9pt/12pt Arial, Helvetica, sans-serif; font-weight: bold; color: #B0B6BD;  margin-left: 15px; margin-right: 10px; margin-top: 10px; margin-bottom: 5px; text-align: left;}
#sideContent h3 {font: 7pt/12pt Arial, Helvetica, sans-serif; color: #B0B6BD;  margin-left: 10px; margin-right: 0px; margin-top: 10px; margin-bottom: 10px;}
#sidecontent ol {font: 8pt/12pt Verdana, Arial, Helvetica, sans-serif; color: #727C87; margin-left: 30px; margin-right: 40px; margin-top: 10px; margin-bottom: 10px;}
#sidecontent ul {font: 8pt/12pt Verdana, Arial, Helvetica, sans-serif; color: #727C87; margin-left: 30px; margin-right: 20px; margin-top: 10px; margin-bottom: 10px;}
#sidecontent li {font: 8pt/12pt Verdana, Arial, Helvetica, sans-serif; color: #727C87;}
#sidecontent dt {font: 8pt/12pt Verdana, Arial, Helvetica, sans-serif; color: #727C87;}
#sidecontent dd {font: 8pt/12pt Verdana, Arial, Helvetica, sans-serif; color: #727C87;}
#sidecontent dl {font: 8pt/12pt Verdana, Arial, Helvetica, sans-serif; color: #727C87;}
#sidecontent a:link {text-decoration: none; color: #727C87;}
#sidecontent a:visited {text-decoration: none; color: #727C87;}
#sidecontent a:hover {text-decoration: none; color: #D9DCDF;}
#sidecontent a:active {text-decoration: none; color: #727C87;}


#sidecontent img.bottomAlign {margin-top: 10px ; vertical-align:bottom;}


#sidecontent img.multimediaIcon {border: 1px solid #CCCCCC;}
#sidecontent a.multimediaIcon {text-decoration: none; color: #727C87;}
#sidecontent a.multimediaIcon:link {text-decoration: none; color: #727C87;}
#sidecontent a.multimediaIcon:visited {text-decoration: none; color: #727C87;}
#sidecontent a.multimediaIcon:hover {text-decoration: none; color: #123456;}
#sidecontent a.multimediaIcon:active {text-decoration: none; color: #727C87;}


#footer {width: 750 px;}
#footer p {font: 8pt Arial, Helvetica, sans-serif; background:#4E555C; color: #7FC31C; text-align: right; margin-top: 0px; margin-bottom: 0px; margin-right: 0px;}
#footer a {color: #7FC31C; text-decoration: none; }
#footer a:link {color: #7FC31C; text-decoration: none; }
#footer a:visited {color: #7FC31C; text-decoration: none; }
#footer a:hover {color: #7FC31C; text-decoration: none; }

#footer p.copyright {font: 8pt Arial, Helvetica, sans-serif; background:#FFFFFF; color: #CCCCCC; text-align: right; margin-top: 0px; margin-bottom: 0px; margin-right: 0px;}
#footer a.copyright {color: #CCCCCC; text-decoration: none; }
#footer a:link.copyright {color: #CCCCCC; text-decoration: none; }
#footer a:visited.copyright {color: #CCCCC; text-decoration: none; }
#footer a:hover.copyright {color: #7FC31C; text-decoration: underline; }
#footer a:active.copyright {text-decoration: underline; color: #333333;}


/*label.name {position: relative; width: 6em; display: block; margin: 1em 0em;}
label.name input {position : absolute; left : 100%; top : 2px; width: 15em;}
label.name textarea {position: absolute; left: 100%; top: 0px; width: 10em;}

label.email {position: relative; width: 6em; display: block; margin: 1em 0em;}
label.email input {position: absolute; left: 100%; top: 2px; width: 20em;}
label.email textarea {position: absolute; left: 100%; top: 0px; width: 10em;}

label.tel {position: relative; width: 6em; display: block; margin: 1em 0em;}
label.tel input {position: absolute; left: 100%; top: 2px; width: 10em;}
label.tel textarea {position: absolute; left: 100%; top: 0px; width: 10em;}

label.subject {position: relative; width: 6em; display: block; margin: 1em 0em;}
label.subject input {position: absolute; left: 100%; top: 2px; width: 10em;}
label.subject textarea {position: absolute; left: 100%; top: 0px; width: 10em;}

label.comment {position: relative; width: 6em; display: block; margin: 1em 0em;}
label.comment input {position: absolute; left: 100%; top: 2px; width: 20em;}
label.comment textarea {position: absolute; left: 100%; top: 1px; width: 30em;}*/

/*input.submit {margin-left: 430px; margin-top:5.2em; color: #FFFFFF; background: #999999; border: #4D4D4D solid 1px;}
br {display: none;} */
/*-------------------------------------*/