/* -------------------------
---------- Global ---------- 
------------------------- */

body, html {
margin: 0;
}

body {
margin: 0 0 auto 0;
background: #ddd url("../images/pageBG.gif") repeat-y bottom center;
text-decoration: none !important;
font: 12px/20px Georgia, Helvetica, serif;
}

br.spacer {
clear: both;
margin: 6px;
}

br.clear {
clear: both;
}

/* -------------------------
---------- Links -----------
------------------------- */

a, a:active, a:visited {
text-decoration: none;
outline: none;
color: #13617c;
border-bottom: 1px dotted #13617c;
}

a:hover {
border-bottom: 1px dotted #ccc;
}

#content a strong {
color: #13617c;	
}

.thumbDisplay a, .thumbDisplay a:hover, .thumbDisplay a:active, .thumbDisplay a:visited {
border-bottom: none;
}

#nav a, #nav a:active, #nav a:visited, #nav a:hover {
border: none;
}

#footer a, #footer a:visited, #footer a:active {
color: #eee;
border-bottom: none;
}

#footer a:hover {
color: #aaa;
}

/* -------------------------
---------- Header ---------- 
------------------------- */

#headerBG {
position: relative;
top: 0;
height: 125px;
width: auto;
background: url("../images/topBG.gif") repeat-x;
text-align: center;
}

#header {
position: relative;
margin: 0 auto;
height: 126px;
width: 920px;
background: transparent url("../images/headerBG.gif") no-repeat;
}

#header .resumeLink {
margin-left: auto;
height: 75px;
width: 225px;
background-color: transparent;
}

.resumeLink span {
height: 75px;
width: 225px;
background-color: transparent;
display: block;
}

/* -------------------------
---------- Footer ---------- 
------------------------- */

#footer {
position: relative;
bottom: 0;
height: 100px;
width: auto;
clear: both;
margin: 0 auto;
background: url("../images/footerBG.gif") repeat-x center;
text-align: center;
}

#footer span {
display: block;	
padding-top: 48px;
color: #dedede;
text-align: center;
letter-spacing: 4px;
font-size: 10px;
}

/* -------------------------
------------ Nav -----------
------------------------- */

#nav {
position: relative;
top: -49px;
height: 39px;
width: 900px;
margin: 0 auto;
background: transparent;
text-align: left;
color: #fff;
font-size: 12px;
line-height: 38px;
word-spacing: 80px;
}

/* -------------------------
------- Nav Buttons --------
------------------------- */

.navHome, .navAbout, .navPortfolio, .navContact {
position: absolute;
height: 48px;
width: 115px;
}

#nav .navHome {
left: 50px;
background-image: url("../images/homeButton.gif");
}

#nav .navAbout {
left: 270px;
background-image: url("../images/aboutButton.gif");
}

#nav .navPortfolio {
left: 505px;
background-image: url("../images/portfolioButton.gif");
}

#nav .navContact {
left: 735px;
background-image: url("../images/contactButton.gif");
}

#nav .navHome:hover, #nav .navAbout:hover, #nav .navPortfolio:hover, #nav .navContact:hover {
background-color: transparent !important;
background-position: 0 -48px;
}

#nav .active, #nav .active:hover {
background-position: 0 -96px;
}

/* -------------------------
--------- Content ----------
------------------------- */

#wrapper { /* For IE 6 */
min-height: 800px;
height: auto !important;
height: 100%;
width: 932px;
margin: 0 auto;
margin-top: -40px;
background-color: transparent!important;
}

html>body #wrapper { /* For Proper Browsers */
min-height: 800px;
height: auto !important;
height: 100%;
width: 932px;
margin: 0 auto;
background-color: transparent!important;
}

#content {  /* For IE6 */
min-height: 800px;
height: auto !important;
height: 100%;
padding-top: 5px;
padding-bottom: 5px;
margin-left: auto;
margin-right: auto;
height: 1000px;
width: 900px;
background-color: transparent !important;
color: #656565;
line-height: 20px;
}

html>body #content { /* For Proper Browsers */
min-height: 800px;
height: auto !important;
height: 100%;
width: 900px;
margin: 0 auto;
padding: 1px 0 5px 0;
background-color: transparent!important;
color: #656565;
line-height: 20px;
}

/* -------------------------
----- Custom Classes -------
------------------------- */

h1, h2, h3 {
font-family: Tahoma, Verdana, sans-serif!important;
}

#content h1 {
font-size: 14px;
font-weight: bold;
color: #12316d;
letter-spacing: 1px;
padding: 2px 0 2px 4px;
margin: 8px 0 4px 0;
background: #ececec url("../images/h1bg.gif");
clear: both;
}

#content h2 {
font-size: 12px;
font-weight: bold;
color: #12316d;
letter-spacing: 1px;
}

#content h3 {
font-size: 14px;
font-weight: bold;
letter-spacing: 1px;
color: #13617c;
border-bottom: 3px solid #13617c;
}

#content strong {
color: #223146;
}

/* -------------------------
-------- Two Column --------
------------------------- */

#content .leftContainer { 
top: 0;
width: 650px;
float: left;
text-align: left;
border-right: dotted 1px #dfdfdf;
padding-right: 10px;
min-height: 805px;
line-height: 20px;
}

#content .rightContainer { /* For IE6 */
top: 0;
width:230px;
float: right;
text-align: left;
min-height: 100%;
margin-left: auto;
}

html>body #content .rightContainer { /* For Proper Browsers */
top: 0;
width:230px;
float: right;
text-align: left;
min-height: 100%;
height: auto !important;
height: 100%;
margin-left: auto;
}

#content .rightContainer p {
line-height: 15px;
min-height: 100%;
height: auto !important;
height: 100%;
margin-left: auto;
}

/* -------------------------
----------- Lists ----------
------------------------- */

#content .listContainer {
line-height: 13px;
width: 640px;
}

html>body .listing ul {  /* For Proper Browsers */
font-size: 11px;
margin-top: -8px;
list-style-type: square;
}

html>body .listing li {  /* For Proper Browsers */
margin-top: 8px;
margin-left: -25px;
padding-left: 5px;
}

html>body #content .ulLeft {  /* For Proper Browsers */
float: left;
width: 245px;
margin-left: 75px;
}

html>body #content .ulRight {  /* For Proper Browsers */
float: right;
width: 245px;
margin-right: 55px;
}

#content .mailer {
display: block;
background-color: #ececec;
border: 1px solid #dcdcdc;
padding: 5px;
margin-top: 15px;
width: 500px;
font-size: 12px;
text-decoration: none !important;
}

/* -------------------------
------ Spacing Fixes -------
------------------------- */

html>body #content p .unPush {  /* For Proper Browsers */
margin-top: -90px;
}

.unPush {
display: block;
margin-top: 50px;
}

/* -------------------------
------ Image Classes -------
------------------------- */

.gliderIMG {
border: none;
}

.thumb {
border: none;
width: 640px;
height: 360px;
}

.thumb2 {
border: none;
width: 720px;
height: 540px;
}

.centered {
margin-top: 15px;
margin-left: auto;
margin-right: auto;
width: 500px;
}

.pImage {
width: 640px;
height: 360px;
}

.zoomify {
position: absolute;
display: none;
right: 0;
top: 0;
height: 15px;
width: 15px;
border-left: 1px solid #ccc;
border-bottom: 1px solid #ccc;
z-index: 50;
background-image: url("../images/zoomify.gif");
}

/* -------------------------
------ Image Display -------
------------------------- */

.thumbDisplay {
display:inline-block;
float: left;
height: 125px;
width: 125px;
padding: 5px;
margin: 6px;
background-color: #e9e9e9;
border: 1px solid #dedede;
overflow: hidden;
}

html>body.thumbDisplay {
margin: 5px;
}

.thumbDisplay img {
border: none;
}

.overlayName {
position: relative;
bottom: 0;
display: none;
height: 21px;
width: 125px;
background-color: #e9e9e9;
color: #12316D;
font: 11px/22px Tahoma,sans-serif;
text-align: left;
border-top: 1px solid #dedede;
margin-top: -25px;
font-weight: bold;
letter-spacing: 1px;
}

.imgCenter {
display: block;
width: 125px;
height: 25px;
border: none;
margin: 0 auto
}

/* -------------------------
---- Slideshow Classes -----
------------------------- */

.ldrgif {
display: block;
margin: 0 auto;
}

.svw {
background: #dedede;
display: block;
margin-top: 8px;
color: black;
text-align: center;
font-size: 12px;
font-weight: bold;
text-align: center;
height: 25px;
width: 208px;
} 

.svw ul {
position: relative; 
left: -999em;
} 

.stripViewer {  
position: relative; 
overflow: hidden;  
border: 5px solid #dedede;   
margin: 8px 0 1px 0; 
} 
.stripViewer ul { /* this is your UL of images */ 
margin: 0; 
padding: 0; 
position: relative; 
left: 0; 
top: 0; 
list-style-type: none; 
} 
.stripViewer ul li {  
float:left; 
} 
.stripTransmitter { 
overflow: auto; 
width: 1%; 
margin-left: auto;
margin-right: auto;
} 
.stripTransmitter ul { 
margin: 0; 
padding: 0; 
position: relative; 
list-style-type: none; 
} 
.stripTransmitter ul li{ 
width: 20px; 
float:left; 
margin: 0 1px 1px 0; 
} 
.stripTransmitter a { 
font: bold 10px Verdana, Arial; 
text-align: center; 
line-height: 22px; 
background: #dedede;
display: block; 
border: none;
} 
.stripTransmitter a:hover, a.current{ 
border-bottom: 2px solid #cbcbcb;
margin-bottom: -1px;
background: #cbcbcb;
border: none;
}

.stripTransmitter a.current {
border-bottom: 2px solid #cbcbcb;
}

#tooltip { 
background: #fff; 
color: #000; 
border: 5px solid #dedede; 
} 
#tooltip h3 {  
font: normal 10px Verdana;  
margin: 0;  
padding: 6px 2px;  
border: 0; 
} 

/* -------------------------
---- Portfolio Display -----
------------------------- */

#portfolioGallery {
width: 800px;
margin: 0 auto;
background: #ffffff url("../images/stopIE.jpg") no-repeat top left;
}

html>body #portfolioGallery {
background-color: #fff;
background-image: none;
}

#slideshow1 {
position: relative; /* Do not change this value */
margin-top: 8px;
width: 890px;
height: 350px; /* Set height to be able to contain height of largest content shown*/
border: 5px solid #DEDEDE;
overflow: hidden;
background-color: black;
}

.slideContent {
position: relative;
width: 890px;
height: 350px;
}

.imageDisplay {
position: relative;
}

.overlayText {
position: absolute;
display: none;
bottom: 0;
height: 0;
width: 0;
background-color: #000;
color: #fff;
font: 11px Verdana!important;
border-top: 1px solid white;
text-align: left;
z-index: -100000;
}

html>body .overlayText {
position: absolute;
bottom: 0;
height: 45px;
width: 890px;
z-index: 500;
}

.overlayText p {
line-height: 4px;
margin-left: 5px;
}

.overlayText p:first-child {
font-weight: bold;
}
