/*
      New Perspectives on HTML and CSS
      Module 7 Final Project
     

    
      Author: Brett Dayton
      Date:   5/20/2016

      	Filename: Styles.css
*/

/*Header Styles*/

header{margin-left: 140px;}

header nav { position: absolute;
			  left: 230px;
			   top: 220px;
				width: 70%;
				 z-index: 2;}

header nav ul li { display: block; 
					float: left; 
				     width: 12%;
					  margin: 0px 2px;
					   text-align: center;
					   -moz-border-radius: 20px;
   	                    -webkit-border-radius: 10px;
			              border: 4px outset;}

header nav ul li a { display: block;				 
					  width: 100%;
					   -moz-border-radius: 20px;
   	                    -webkit-border-radius: 10px;
					      background-color: #d3141c;
						   color: black;
						    font-size: 30px;
						     font-family: Impact, Charcoal, sans-serif;
						      font-variant: small-caps;}

header nav ul li a:hover { color: white;}

/*Body Styles*/

body { background-color: #090909;
	    width: 950px; 
	     margin: 0px auto; 
	      font-family: Arial, Helvetica, sans-serif;
		   font-variant: small-caps;
		    font-size: 25px;
	         color: #FFF;}
			 
h1 { margin-left: 280px;	
	  font-variant: small-caps;}

h2 { font-size: 20px;
      font-family: Arial, Helvetica, sans-serif;
	   margin-left: 200px;}
	  
/*Table Styles*/

table.strengths {background: url(marvelheroes.jpg) center;
				  -moz-background-size: cover;
				   -webkit-background-size: cover;
					 background-size: cover;
					  border-collapse: collapse; 					   
					    font-size: 20px;
						 color: #d3141c;
						 -webkit-text-stroke-width: 1px;
                          -webkit-text-stroke-color: black;
						   font-weight: bold;
						    margin-left: 100px; }

table.strengths td {padding: 0px 5px;}

/* Table Caption */
table.strengths caption {font-size: 18px;
						  letter-spacing: 5px; 
						   text-align: center; 
						    caption-side: top;
						     margin: 0px 0px 10px 0px;}
							 
/* Table Header Styles */
table.strengths thead { border-bottom: 2px solid gray;}

table.strengths thead tr {height: 40px;}

table.strengths thead th {padding: 0px 5px; 
						   letter-spacing: 2px;}

/* Table Footer Styles */
table tfoot { border-top: 2px solid gray; 
			   text-align: center;}

table.strengths tfoot tr {height: 40px;}

/* Table Body Styles */
table.strengths tbody tr {border-bottom: 1px dotted gray;
						   height: 50px;}

table.strengths tbody td:last-of-type { text-align: right;}

table.strengths tbody tr:nth-of-type(even) {background-color: rgba(152, 228, 215,0.6);}

table.strengths tbody tr:nth-of-type(odd) {background-color: rgba(255, 255, 255,0.6);}

/* Column Styles */
table.strengths col.firstColumn {width: 22%;}

table.strengths col.middleColumns {width: 28%;}

table.strengths col.lastColumn {width: 22%;}

/*Date Box Styles*/
#dateBox { margin-top: 20px;
			margin-left: 200px;
			 width: 200px; 
			  height: 50px; 
			   font-weight: normal;
			    border: 1px solid #090909; 
				 background-color: #090909; 
				  color: #d3141c;
				   padding-top: 10px;
					font-size: 15px; 
					 text-align: center; 
					  letter-spacing: 1px; 
				       word-spacing: 1px;}

/*Footer Styles*/
footer { clear: both;
		  padding-top: 20px;
		   border-top: 2px solid #d3141c;
			font-size: 15px;
			 font-style: normal;  
			  text-align: center;}
