/* CSS Document */
/*Styles always used regardless of javascript's state of enablement*/

/*Page Body Styles*/
/*so IE 5/6 will re-size text more gradually when using ems */
html { 
	font-size: 100%; 
} 

html, body
{
    padding: 0px;
    margin: 0px;
    background: black;
    color: white;
    font-family: Verdana, Sans-serif;
    line-height: 1.5em;
    font-size: medium;
    text-align: center;
}
/*End page body styles*/

/*Page layout blocks*/  
#header 
{
    margin-bottom: 40px;
    text-align: center;
    margin-left: -50px;/*needed in ff??*/
}   
#container 
{ 
	  position: relative;
   	margin-left: auto;
	  margin-right: auto;
	  width: 900px;
}
#page-container 
{
    position: relative; 
    width: 960px;
    margin-left: auto;
    margin-right: auto;
    text-align: left; 
    margin-top: 2em;
}
#footer 
{
    position: relative; 
    clear: both; 
    text-align: left;
    font-size: 10px;
    top: 20px;
	  font-weight: bold;
	  color: #cccccc;
	  border-top: 1px solid #cccccc; /* light grey */
	  border-bottom: 1px solid #cccccc;	
	  padding: 10px 25px; /* sets top and bottom padding at 10px and left and right at 25px */
}
#footer a 
{
  	color: #cccccc; /* light grey */
	  text-decoration: none;
}
#footer a:hover 
{
  	color: #c00; /* deep red */
}
#webdesigner-credits 
{
    position: relative;
    float: right;
    text-align: right;
}
#webdesigner-credits img 
{
    padding-top: 10px;
}
/*End page layout blocks*/

/*Accordian feature styles*/
#sectional .section 
{
	float: left;
	position: relative;
}
#sectional #home.section 
{
	background-color: black;
}
#sectional #resume.section 
{
	background-color: black;
}
#sectional #contact.section 
{
	background-color: black;
}
#sectional #showreel.section 
{
	background-color: black;
}
#sectional .section h3 
{
  cursor: pointer; 
}

/*sliding tabs styles*/
#panes, #panes2, #showreels, #info 
{
		border-style: none;
		margin: 0 1em;			
}
#heading *, #heading2 *, #heading2b *, #heading3 * 
{
			display: inline;
			padding: 4px;
			user-select: none;
			cursor: pointer;
			vertical-align: middle;
}
#heading li.active, #heading2 li.active, #heading2b li.active, #heading3 li.active 
{
			color: white;
}	
#skills-list 
{ 
    list-style: none;
    line-height: 2em;
}
#profile-list 
{ 
    line-height: 2em; 
}
#profile-list li 
{
    padding-bottom: 1em;
}

li:hover {color: white;}
/*end sliding tabs*/


/*Page element styles*/

a:link {color: #c00;} /*deep red*/

a:visited {color: #c00;} /*deep red*/

a:hover {color: white;}

img 
{
     border: none;
}
#small-h2 
{
    text-align: center;
    font-size: 20px;
}
#img-center 
{
    text-align: center;
    margin-top: -40px;
}
.interests-image 
{
margin-top: -20px;
text-align: center;
}
.pad 
{
    padding-top: 20px;
}
.float-right 
{
    float: right;
}
/*End page element styles*/ 


/*Emphasize text styles*/       
.emph 
{
    font-weight: bold;
    color: #c00; /*deep red*/
}
.para-emph 
{ 
    color: #ccc; /*pale grey*/
}
.red-emph 
{
    color: #c00; /*deep red*/
    font-size: 1.2em;
}
.small-text 
{ 
    font-size: 15px;
}
.small-link 
{
    font-size: 10px;
}
.red-block 
{
    background: #900; /*deep red*/
    color: white;
    font-weight: bold;
    font-size: 1.2em;
    float: left;
    margin-right: 1em;
}
.white-block 
{
    background: white;
    color: #900; /*deep red*/
    font-weight: bold;
    font-size: 1.2em;
    float: left;
    margin-right: 1em;
}
.red-line 
{
    border-top: 1px solid red;
}
.white-line 
{
    border-top: 1px solid white; 
}
.emph-title 
{ 
    font-weight: bold;
    border-bottom: 1px solid white; /*#990000*/;
    padding-bottom: 10px;
}
/*End*/