/* @override http://triton-oceanic.com//css/screen.css */

/* @override http://triton-oceanic.com//css/screen.css */
/*

	TRITON OCEANIC by ERSKINE DESIGN
	VERSION 1.0
	
	CONTENTS ----------
	
	   1.BODY
	   2.DEFAULT STYLING
	   3.HEADINGS
	   4.LINKS
	   5.IMAGES
	   6.LAYOUT
	   7.BRANDING/MASTHEAD
	   8.NAVIGATION
	   9.SITEINFO/FOOTER
	   10.HOMEPAGE
	   
    -------------------
	
*/

@import url(reset.css); /* RESET CSS */
@import url(forms.css); /* FORMS CSS */

@import url(dev/scratch-cw.css); /* WOBBLE'S SCRATCH */
@import url(dev/scratch-cm.css); /* C TO THE MACCY P'S SCRATCH */
@import url(dev/scratch-jp.css); /* PITTOCK'S SCRATCH */
@import url(dev/scratch-gs.css); /* SWINBROOK'S SCRATCH */
@import url(dev/scratch-ps.css); /* SWANNY'S SCRATCH */
@import url(dev/scratch-gw.css); /* GREGORIOUS'S SCRATCH */

/* 1.BODY
---------------------------------------------------------------------- */

body { font:12px/1.7 verdana, sans-serif; color:#ccc; background:#00161E url(../images/bg-bar.png) repeat-x; width: 920px; margin: 0 auto; text-shadow: #181818 0 0 0; }

ul#nav_access { position:absolute; top:-9999px; left:-9999px; }


/* triton nav */

ul#triton_nav { height:20px; margin:3px 0 0 0; padding:0; }
ul#triton_nav li { font-size:10px; float:left; margin-right:7px; }

ul#triton_nav li a { display:block; height:17px; background-color:transparent; background-position: 0 0; background-repeat:no-repeat; text-indent:-9999em; }
ul#triton_nav li a:hover { background-position: 0 -17px; }

ul#triton_nav li#triton_nav_triton_oceanic a { width:97px; background-image:url(../images/triton_nav/triton-oceanic.gif); }
ul#triton_nav li#triton_nav_triton_oceanic.cur a { background-position: 0 -34px; }

ul#triton_nav li#triton_nav_triton_technical a { width:109px; background-image:url(../images/triton_nav/triton-technical.gif); }
ul#triton_nav li#triton_nav_triton_technical.cur a { background-position: 0 -34px; }



/* 2.DEFAULT STYLING
---------------------------------------------------------------------- */

p,ul,dl,ol { margin:1.3em 0; }

ul li { margin-bottom:0.5em; }
dl { margin:0 0 1.5em 0; }
dl dt { font-weight:bold; }
dd { margin-left:1.5em; }

ol { list-style-type:decimal; }
ol li { margin-left:24px; }

ol p { margin-top:0; }

abbr { border-bottom:1px solid #ccc; cursor:help; }
del { text-decoration:line-through; }
strong { font-weight:bold; }
em { font-style:italic; }
sup { font-size:0.75em; position:relative; top:-3px; }

table { margin-bottom:1.4em; width:100%; }
th { font-weight:bold; color: #000; }
th, td { padding:4px 10px 4px 5px; }

hr { display:none; }

/* 3.HEADINGS
---------------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 { color: #FFF; font-weight:bold; clear: both; }
h2 { font-weight:bold; font-size:15px; letter-spacing:-1px; text-transform:uppercase; border-bottom:1px solid #333; margin:0 20px; }
h3 {  font-size:14px; font-weight:bold; line-height:1.3; margin:0.8em 0 1.2em 0; position:relative; top: 0.4em;}
h4 {  font-size:12px; font-weight:bold; line-height:1.4; margin:1em 0; position:relative; top: 0.5em;}

/* 4.LINKS
---------------------------------------------------------------------- */

a:link, a:visited { color:#5BE9FF; text-decoration:none; }
a:hover, a:focus { text-decoration:underline; }
.alt a { color: #FFF; }

/* 4.IMG STYLES
---------------------------------------------------------------------- */
p img { position:relative; top: 4px; margin-bottom:4px;  }

img.left, div.left  { float:left; margin-right:10px;  }
img.right, div.right { float:right; margin-left:10px; position:relative;  }

p.left img {margin-top:1px;}

div.image_wrap span { font-size:10px; display:block;  }

/* 6.LAYOUT
---------------------------------------------------------------------- */

div#content { background-color:#00070c; border-top:1px solid #FFF; min-height: 650px; opacity:0.999;}
div#content_pri { width:560px; float:left; margin: 0 0 20px 20px; }
div#content_pri ul { list-style-type:disc; }
div#content_pri ul li { margin-left:15px; }

/* wide */
body#wide div#content_pri { width:100%; margin: 0 20px 20px 20px; }

div#content_sec { width:280px; float:right; margin: 0 20px 20px 0; }
div#content_pri h2, div#content_sec h2 { margin:0 0 12px 0;  }

/* clearing floats */
div#content { display: inline-block; }
div#content:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html div#content { height: 1%; }
div#content { display: block; }

/* 7.GLOBAL STYLES
---------------------------------------------------------------------- */

.clear { clear:both; }
.hide {display:none;}
.break { clear: both; }
p.left { display:inline; float:left; margin:3px 10px 0px 0; }
p.pagination { font-size:11px; margin:0; }

/* 7.BRANDING/MASTHEAD
---------------------------------------------------------------------- */

div#branding { position:relative; height: 123px; }
div#branding h1 { position:absolute; left: 0; top: 43px; background:transparent url(../images/triton_oceanic_logo.gif) 0 0; width: 207px; height: 68px; text-indent:-9999em; }
div#branding h1 a { display:block; width: 205px; height: 60px; }

/* 8.NAVIGATION
---------------------------------------------------------------------- */

/* primary nav */
ul#navigation_pri { font-size: 12px; margin:0; line-height:1;position:absolute; right:0; bottom:0; text-transform:uppercase; }
ul#navigation_pri li { margin: 0; display: block; float:left; }
ul#navigation_pri li a { color: #CCC; display: block; text-decoration: none; padding: 10px 10px 15px 10px; }
ul#navigation_pri li a:hover { background-color: #00131B; color:#FFF; }
ul#navigation_pri li.cur a { color: #000; background:#DEDEDE url(../images/prim_nav_cur_bg.png) repeat-x; }

/* clearing floats */
ul#navigation_pri { display: inline-block; }
ul#navigation_pri:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html ul#navigation_pri { height: 1%; }
ul#navigation_pri { display: block; }

/* 8.BANNER
---------------------------------------------------------------------- */
div#home_banner, div#banner { margin-bottom:20px; }
div#banner { position:relative; }

div#home_banner p#banner_copyright { font-size:10px; position:absolute; bottom: 0; display:block; text-align:left; margin:0 13px 0 0; padding:2px 7px 5px 7px; color:#CCC; right: 0; background-color:#00070C; opacity:0.5;}

div#banner p { font-size:10px; position:absolute; bottom: 0; display:block; text-align:left; margin:0 13px 0 0; padding:2px 7px 5px 7px; color:#CCC; right: 0; background-color:#00070C; opacity:0.5;}

div#home_banner p#banner_copyright { padding-bottom:0; }

/* home banner specific  */
div#home_banner { width: 920px; height: 400px; position:relative; }
div#home_banner img { position:absolute; top: 0; left:0; }
div#home_banner div#intro { position:absolute; bottom:20px; left: 0; width:480px; padding:16px 20px 10px 20px; background-image:url(../images/intro_bg.png); }
div#home_banner div#intro h2 { margin:0; border:none; }
div#home_banner div#intro p { margin-bottom:0; position:relative; top: -10px; }
p.captioned{ font-size:11px; }

/* 9.CONTENT PRI STYLES
---------------------------------------------------------------------- */

div#content_pri div.post_summary, div#content_sec div.post_summary, div.post { border-top:1px dotted #333; }

div#content_pri div.post_summary.first, div#content_sec div.post_summary.first, div.post.first { border:none; }


div.post_summary img { float:left; margin-right:10px; }
div#content_pri p.meta { font-size:11px; margin-bottom:15px; color:#808790; }
div#content_pri p.meta a { color:#808790; }
div#content_pri p.meta a:hover { color:#FFF; }
div#content_pri p.meta span.continue a, div#content_pri p.meta span.continue a:hover { color:#5BE9FF; }


/* 9.CONTENT SEC STYLES
---------------------------------------------------------------------- */

div#content_sec div.post_summary img { margin-bottom:10px;}
div#content_sec div.post_summary p { }
/*div#content_sec div.post_summary { margin-bottom:30px;}*/
div#content_sec small { font-size:10px;}

/* 9.BLOG
---------------------------------------------------------------------- */

div#content_sec div#rss_subscribe { border-bottom:1px solid #333;}

div#content_sec div#rss_subscribe h3 { background:url(/images/icons/rss-large.gif) no-repeat 0 4px; padding-left:16px; }




/* 9.TEAM
---------------------------------------------------------------------- */
div.team_member_wrap {width: 100%;}
div.team_member1, div.team_member2 { width: 420px; float:left; }
div.team_member2 { margin-left:40px; }
div.team_member1 img, div.team_member2 img { float:left; margin-right:10px; }


#content_pri div#profile div.vcard { position:absolute; top:-9999px; left:-9999px; }



/* clearing floats */
div.team_member_wrap { display: inline-block; }
div.team_member_wrap:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html div.team_member_wrap { height: 1%; }
div.team_member_wrap { display: block; }

/* 9.PROJECTS
---------------------------------------------------------------------- */

div.project_wrap {width: 100%;}
div.project1, div.project2 { width: 420px; float:left; }
div.project2 { margin-left:40px; }
div.project1.project_alt, div.project2.project_alt {border-top:1px dotted #333; }

/* clearing floats */
div.project_wrap { display: inline-block; }
div.project_wrap:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html div.project_wrap { height: 1%; }
div.project_wrap { display: block; }

/* 8.SPECIAL LISTS
---------------------------------------------------------------------- */

/* file list */
ul.file_list li { list-style-type:none; background-repeat:no-repeat; background-position:0 0; 
padding:0 0 5px 23px; border-bottom:1px solid #333; margin:5px 0; }
ul.file_list li.pdf { background-image:url(../images/file_types/pdf.gif); }
ul.file_list li.mov { background-image:url(../images/file_types/mov.gif); }
ul.file_list li.txt { background-image:url(../images/file_types/txt.gif); }
ul.file_list li.zip { background-image:url(../images/file_types/zip.gif); }
ul.file_list li.word { background-image:url(../images/file_types/word.gif); }
ul.file_list li.mp3 { background-image:url(../images/file_types/mp3.gif); }
ul.file_list li.image { background-image:url(../images/file_types/image.gif); }
ul.file_list li.excel { background-image:url(../images/file_types/xls.gif); }
ul.file_list li.generic { background-image:url(../images/file_types/generic.gif); }

/* feature list */
ul.feature_list { font-weight:normal; }
ul.feature_list li { font-weight: bold; background:url(../images/icons/arrw_med.gif) no-repeat 0 6px; padding: 0 0 5px 15px; border-bottom:1px dotted #333; margin:5px 0; color: #FFF; }
ul.feature_list li a { font-weight:normal; }


/* 8.COMMENT STYLES
---------------------------------------------------------------------- */

h4#comments { border-top:1px solid #333; padding-top: 15px; top:0; margin-top:30px; }

form#comment_form h5 { margin-top:10px; }
form#comment_form p.notice { font-size:11px; color:#656a71; }

/* comment blocks */
div.commbox  { margin: 0 0 1em 0; font-size: 12px; border-bottom:1px dotted #333; padding:10px 0 10px; }
div.commbox a, div.commbox a:hover { color: #FFF; background:none; padding:0; }
div.commbox img  { float:left; margin-bottom:6px;}
div.commbox h5 { margin:0 0 8px 0; font-size:12px; font-weight:normal; top: 0;  }
div.commbox h5 a { color: #FFF; text-decoration:underline; }
div.commbox p { margin:0 0 8px 0;}
div.commbox div.commbox_inner { float:right; width: 480px; }

div#content_pri div.commbox blockquote { font-style: italic; padding-left: 23px; background:url(../images/comm_quote.gif) no-repeat 0 1px; }

/* clearing floats  */
div.commbox  { display: inline-block; }
div.commbox:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html div.commbox { height: 1%; }
div.commbox { display: block; }

/* 8.CONTACT STYLES
---------------------------------------------------------------------- */

p#add_address { background:url(/images/icons/vcard.gif) no-repeat 0 3px; padding-left:18px;}
.alert, .message { color:#ff4b58}
p#registered_address { font-size:10px; }

/* 8.FORM STYLES
---------------------------------------------------------------------- */

form input, form textarea { font-family:Verdana, sans-serif; font-size:12px; }
form input.text_field { margin-top:5px; width: 300px; padding:5px; border:1px solid #454b50; background-color:#14181d !important; color: #FFF;}
form textarea#message, form textarea#comment { margin-top:5px; width: 548px; height: 300px; border:1px solid #454b50; padding:5px; background-color:#14181d !important; color: #FFF;  }
form select { margin-top:5px; width: 310px; }
form label { color: #FFF; }
.submit { padding-top:5px; }

/* 8.MEDIA STYLES
---------------------------------------------------------------------- */

/* gallery */
div#content_pri ul#thumbs { margin-bottom:0; list-style-type:none;  }
div#content_pri ul#thumbs li { float: left; margin: 4px 10px 7px 0; line-height:0; border:1px solid #ccc; }
div#content_pri ul#thumbs li.last { float: left; margin:4px 0 0 0; }

/* video */
p.video_thumb img { border:1px solid #ccc; }
p.video_thumb { font-size:11px; }

/* clearing floats */
ul#thumbs { display: inline-block; }
ul#thumbs:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html ul#thumbs { height: 1%; }
ul#thumbs { display: block; }


/* 9.SITEINFO/FOOTER
---------------------------------------------------------------------- */

div#siteinfo { margin:10px 0 20px 0; font-size:10px; clear:both;} 
div#siteinfo p#legal { float:left; width: 700px; margin:0; line-height:1;}

div#siteinfo p#legal img {position:relative; top: 6px; margin-right:2px;}

div#siteinfo p#credits { float:right; width: 200px; margin:0; line-height:1; text-align:right; position:relative; top: 8px;}
div#siteinfo span.subscribe { background:url(/images/icons/rss-small.gif) no-repeat 0 2px; padding-left:10px; }

div#siteinfo p#license_detail { clear:both; color: #637075; }
div#siteinfo p#license_detail:hover { color: #CCC; }

div#siteinfo p#license_detail a { color: #297482; }
div#siteinfo p#license_detail:hover a, div#siteinfo p#license_detail a:hover { color:#5BE9FF; }

/* clearing floats */
div#siteinfo { display: inline-block; }
div#siteinfo:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html div#siteinfo { height: 1%; }
div#siteinfo { display: block; }