/*********** Layout **********/
body { background-image: url(images/bg_pg_blue.png); background-color: #555577; margin: 3px 17px; padding: 0px; font-size: 82%; min-width: 900px; }
#container { margin: 0 auto; background-image: url(images/mr.png); background-repeat: repeat-y; background-position: right top; width: 100%; max-width: 1280px;	 }
#page { width: 100%; background-image: url(images/ml.png); background-repeat: repeat-y; font-family: Verdana, Arial, Helvetica, sans-serif;	 margin: 0 auto; height: 100%; }

#header { height: 120px; margin: 0 15px; background-color: #101012;	border-left: solid 1px #000; border-right: solid 1px #000; background-image: url(images/header_middle_image_bk_08.jpg); background-repeat: no-repeat; background-position: right 23px; }
#header img { border: none; }
#header_top { font-size: 0.80em; padding-top: 5px; padding-left: 7px; color: #c4ccef; /*color: #83a9e9;*/ text-decoration: none; font-weight: 200; height: 17px; border-top: solid 1px #000; background-color: #227; background-image: url(images/header_top_bk.png); background-position: left 4px; }
#header_top_datetime { 	float: left; font-size: 11px; padding-top: 1px; width: 400px; } 
#header_top_options { float: right;	 font-size: 11px; padding-right: 8px; text-align: right; margin-top: -4px; width: 300px; white-space: nowrap;	}
#header_top_options a  { display: inline-block;	 color: #416683; overflow: visible;	 text-decoration: underline; }
#header_middle { padding: 17px 0 0 10px; height: 100%; }
#header_middle a { color: White; text-decoration: none; border-bottom: none; }
#header h1, #header h2 { font-family: "trebuchet MS", "Century Gothic", Arial, sans-serif, serif; font-size: 2.1em; margin: 0px; color: #FFF; padding-top: 10px; padding-right: 0px; padding-bottom: 0px; padding-left: 10px; }
#header h2 { font-size: 1.2em; padding-top: 5px; font-weight: normal; font-family: Arial, sans-serif, serif}

#sitenav  { margin: 0 15px; background-color: #17294a; height: 23px; border-top: solid 1px #234566; border-left: solid 1px #000; border-right: solid 1px #000; }
#sitenav ul { float: right; margin: 0px; padding: 0px; list-style-type: none; }
#sitenav ul li  { display: block; float: left; text-align: center; }

#home, #tech, #other, #photos, #aboutme { display: block; white-space: nowrap; font-size: 0.9em; text-align: center; color: #c4ccef; text-decoration: none; text-transform: lowercase; font-weight: 200; height: 19px; padding-top: 4px; padding-right: 10px; padding-left: 10px; border-right: solid 1px  #35546c; border-bottom: none; }
#home:hover, #tech:hover, #other:hover, #photos:hover, #aboutme:hover { color: #FFF; background-color: #000; }

div.google-ads { padding: 5px; margin: 10px 10px 0px 10px; border: solid 1px #CCC; background-color: #E6E6E6; }

div.main_left, div.main_right { position: relative;	 margin: 0 15px; background-color: #FFF; height:100% !important; border: solid 1px #000; }
div.main_left #panel_a { margin-left: -100%; }
div.main_right #panel_a { margin-left: -550px; }
div.main_right #panel_a, div.main_left #panel_a  { float: left; width: 530px; padding: 25px 10px 10px 10px; background-image: url(images/small_strap.png); background-repeat: repeat-x;	}
div.main_left #panel_b_wrapper, div.main_right #panel_b_wrapper { float: left; width: 100%;	}
div.main_left #panel_b { margin-left: 550px; background-image: url(images/large_strap_right.png); background-position: right top; background-repeat: no-repeat;	}
div.main_right #panel_b { margin-right: 550px; background-image: url(images/large_strap_left.png); background-position: left top; }
div.main_left #panel_b, div.main_right #panel_b { height: 100%; padding: 25px 15px 10px 10px; background-repeat: no-repeat; border-right: 1px dotted #BBB; }

.panel_content { font-size: 1em; line-height: 1.5em; }
.panel_content h2 { color: #2a3e63; font-weight: normal; margin: 0; padding: 3px 0 5px 0; border-bottom: dotted 1px #CCC; background-repeat: no-repeat; background-position: left top; }
.panel_content a { color: #445a80;  font-weight: bold;}
.panel_content a:visited { color: #445a80;  font-weight: bold;}
.panel_content a:hover { color: #F00; font-weight: bold; text-decoration: none}
.panel_content ul { margin: 18px 10px 3px 0; padding: 0; list-style-type: none;	}
.panel_content ul li { margin-bottom: 0.7em; padding-left: 12px; background-image: url(images/list_bullet.png); background-repeat: no-repeat; background-position: left 6px;	}

div.syndication-panel-more { margin: 5px 5px 20px 40px; float: right;}

div.account-forms { background-color: White; padding: 10px; }
div.error-forms { background-color: White; padding: 10px; }


#footer { padding: 3px 0 25px 0; overflow: hidden; color: #c4ccef; background-color: #000; text-align: left; margin: 0 15px;}
#footer img { border: none; }
ul.footer { margin: 0; padding: 0; list-style-type: none; width: 100%; }
ul.footer li { display: block; float: left; text-align: left; width: 31.5%; border-top: dotted 1px #336; margin: 0 0 0 15px; padding: 5px 0 0 0; }
a.bright { color: #DDD; text-decoration: underline; border-bottom: none;}
a.bright:visited { color: #DDD; text-decoration: underline; border-bottom: none;}
a.bright:hover { color: #C99; text-decoration: underline; border-bottom: none; }

/*********** Social Icons **********/

#social_icons { margin: 5px 0 0 0; padding: 0; width: 275px; height: 60px;}
#social_icons li { float: left; margin: 0; padding: 0; width: auto; border-top:none;}
#social_icons a { color: #DDD; text-align: center; text-decoration: underline; border-bottom: none; background: url(images/socialsprite.png) no-repeat scroll center top transparent; display:block; width: 63px; padding: 40px 2px 0 2px; }
#social_icons a:visited { color: #DDD; text-decoration: underline; border-bottom: none;}
#social_icons a:hover { color: #C99; text-decoration: underline; border-bottom: none; }
#social_icons .twitter a { background-position: center -35px; }
#social_icons .facebook a { background-position: center -107px; }
#social_icons .atom a { background-position: center -250px; }
#social_icons .email a { background-position: center -318px; }

/*********** Shadow **********/
#top { background-image: url(images/tc.png); background-repeat: repeat-x; height: 15px; }
.tr { float: right; width: 15px; height: 15px; background-color: transparent; background-image: url(images/tr.png); background-repeat: repeat; background-position: right top; }
.tl { float: left; width: 15px; height: 15px; background-color: transparent; background-image: url(images/tl.png); background-position: left top; }
#bottom { width: 100%; height: 15px; background-image: url(images/bc.png);	background-repeat: repeat-x; }
.bl { float: left; height: 15px; width: 15px; background-image: url(images/bl.png); background-position: left bottom; background-repeat: no-repeat; }
.br { float: right; height: 15px; width: 15px; background-image: url(images/br.png); background-position: right bottom; background-repeat: no-repeat; }


/*********** Elements **********/

p { margin: 0 0 10px 0; padding: 0}
a { color: #226; text-decoration: none; border-bottom: dotted 1px #3558a0 }
a:visited { color: #226; text-decoration: none; border-bottom: dotted 1px #3558a0 }
a:hover { color: #c93f3f; text-decoration: none; border-bottom: solid 1px #c93f3f; }
.clear { clear: both; height: 0em; font-size: 0em; line-height: 0; margin: 0; padding: 0; visibility: hidden; }
blockquote { border-left-width: 5px; border-left-style: solid; border-left-color: #416683; margin-left: 40px; margin-right: 40px; font-style: italic; background-color: #EEE; padding: 10px; text-align: justify; color: #416683; }

/************************Slide Show*************/
#gallery { margin: 10px 0 10px 1px; position:relative; width: 525px;  height:333px; border: solid 1px #222; overflow: hidden; }
#gallery #slides div { float: left; position: absolute; }
#gallery #slides div.show { z-index:500 }
#gallery #slides div a img { border: none; }
div.caption { display: none; }
#gallery #caption { z-index:600; background-color:#000; color:#ffffff; 	height: 45px; width:100%; position:absolute; bottom:0; }
#gallery #caption .content { margin:5px }
#gallery #caption .content h3 { margin:0; padding:0; color:#1DCCEF; 	}
