/*------MAIN BODY STYLES------*/

* {
	margin: 0px; /*sets 0 margin to the whole website*/
	padding: 0px; /*sets 0 padding to the whole website*/
}

body {
	font-family: Verdana, Arial, Helvetica, sans-serif; /*website font family*/
	background-color: #000000; /*website background color*/
	color: #999a9a; /*website default text color*/
	background-image: url(images/backgroundcompl.png); /*our background image*/
	background-repeat: repeat-y; /*repeats background image along the Y axis*/
	background-position: center; /*centers our background*/
	height: 1100px;
	}

a:link {
	color: #acf349; /*color of our hyperlinks*/
}
a:visited {
	color: #acf349; /*color of visited hyperlinks*/
}
a:hover {
	color: #FFFFFF; /*color of the hyperlink when hovered over*/
}
a:active {
	color: #acf349; /*color of our active links*/
}

p {
	font-size: 0.7em; /*sets default paragraph text size*/
	line-height: 18px; /*sets default paragraph line height*/
	text-align: justify; /*justifys our paragraph*/
}

h1 {
	color: #727372; /*color of our H1 tag*/
	text-transform: uppercase; /*sets all H1 tags to uppercase*/
	font-size: 1.2em; /*sets H1 font size*/
	font-weight: normal; /*sets H1 font weight to normal*/
}

h2 {  
	color: #FFFFFF; /*color of our H2 tag*/ 
	text-transform: uppercase; /*sets all H2 tags to uppcase*/ 
	font-size: 1em; /*sets H2 font size*/ 
	font-weight: normal; /*sets H2 font weight to normal*/ 
}  


h3 {  
	color: #727372; /*color of our H3 tag*/ 
	text-transform: uppercase; /*sets all H3 tags to uppcase*/ 
	font-size: 0.9em; /*sets H3 font size*/ 
	font-weight: normal; /*sets H3 font weight to normal*/ 
}   

h4 {  
	color: #FFFFFF; /*color of our H4 tag*/ 
	/*text-transform: uppercase; sets all H4 tags to uppcase*/ 
	font-size: 0.7em; /*sets H4 font size*/ 
	font-weight: normal; /*sets H4 font weight to normal*/ 
}

/*img {
	border:none; removes borders from images*/
}

.float-left {
	float:left; /*class for float left*/
}

.float-right {
	float:right; /*class for float right*/
}

/*------MAIN CONTAINER STYLES------*/

#container {
	width: 900px; /*width of our container*/
	margin-top: 0px; /*sets top margin to 0*/
	margin-right: auto; /*sets right margin to auto for which centers our website*/
	margin-left: auto; /*sets left margin to auto for whitch centers our website*/
	}

/*------HEADER STYLES------*/

#header {
	background-image: url(images/bg.png); /*sets our header background image*/
	background-repeat: no-repeat; /*sets our background to no repeat*/
	float: left; /*floats our header left*/
	width: 900px; /*gives our header a width of 900px*/
	}
	
#top-elements {
	float: left; /*floats top elements left*/
	width: 900px; /*sets our top elements width to 900px*/
	padding-top: 20px; /*gives our top elements a padding of 20px*/
	}

/*------LOGO STYLES------*/

#logo {
	float: left; /*floats our logo left*/
	height: 24px; /*gives our logo a height of 121px same as our logo image*/
	width: 900px; /*sets our logo div's height to 344px same as our logo image*/
	}

/*------NAVIGATION STYLES------*/

#nav-bar {  
	float: right; /*floats our navigation right*/ 
	height: 10px; /*gives our navigation a height of 29px*/ 
	padding-top: 8px; /*gives our navigation top padding*/ 
	margin-bottom: 40px; /*gives our navigation a bottom margin*/ 
	}  
   
.navlinks ul {  
	margin: 0px; /*gives our unordered list 0 margin*/ 
	padding: 0px; /*gives our unordered list 0 padding*/ 
}    

.navlinks li {  
	display: inline; /*displays our navigation links inline*/ 
	list-style-type: none; /*removes bullets points from our navigation*/ 
	padding-left: 10px; /*gives our navigation list items left padding*/
    margin-right: 20px;
}    

.navlinks li a {  
	text-decoration: none; /*removes bottom line from nav links*/ 
	font-size: 12px; /*sets navigation font size*/ 
	color: #FFFFFF; /*sets navigation link color*/ 
	padding-bottom: 2px; /*gives our navigation links bottom padding*/ 
}  

.navlinks li a:hover {  
	border-bottom-width: medium; /*gives links a medium thickness bottom border*/ 
	border-bottom-style: solid; /*makes the bottom border line solid*/ 
	border-bottom-color: #acf349; /*sets the color of the border*/ 
}  

.navlinks li.current a{  
	border-bottom-width: medium; /*gives links a medium thickness bottom border*/ 
	border-bottom-style: solid; /*makes the bottom border line solid*/ 
	border-bottom-color: #acf349; /*sets the color of the border*/ 
}

/* ----------FEATURED CONTENT STYLES---------- */ 



#featured {  
    float: right; /*floats our featured area right*/ 
	width: 900px; /*gives our featured area a width of 900px*/ 
	margin-bottom: 20px; /*gives our featured area a bottom margin*/ 
	}  


.featured-text {  
	float: left; /*floats our featured text left*/ 
	width: 350px; /*sets our featured text box width*/ 
	margin-top: 80px; /*gives our featured text box a top margin*/ 
	margin-bottom: 20px;
	padding-left: 40px;
	padding-right: 50px;
	}  


#featured-text p {  
	font-size: 0.7em; /*sets our featured text paragraph font size*/ 
	line-height: 24px; /*sets our featured text line height*/ 
	text-align: justify; /*justifys our paragraphs*/ 
	padding-top: 40px; /*adds top padding to our featured text paragraph*/ 
	}  
   

   
h1.featured {  
	color: #FFFFFF; /*sets featured H1 color*/ 
	text-transform: uppercase; /*transforms featured H1 tag to uppercase*/ 
	font-size: 18px; /*sets font size of featured H1 tag*/ 
	background-image: url(images/hint.png); /*addeds our bullet image to our featured H1 tag*/ 
	background-repeat: no-repeat; /*stops bullet from repeating*/ 
	padding-left: 46px; /*adds padding to the left of our featured H1 tag*/ 
	line-height: 34px; /*sets featured H1 tag's line height*/ 
    margin-bottom: 15px;   
   }  

#images {
	margin-top: 40px;
	float: left;
	height: auto;
	width: auto;
	border: 1px solid;
	padding: 10px;
	}

/* ----------CONTENT LEFT STYLES---------- */ 

    

 #content-left {  
float: left; /*floats left*/ 
width: 600px; /*adds a fixed width*/ 
padding-bottom: 40px; /*adds bottom padding*/ 
}  

    

.box {  
float: left; /*floats left*/ 
width: 498px; /*adds a fixed width*/ 
border: 1px solid #121212; /*adds a 1 px colored border*/ 
margin-bottom: 15px; /*adds a bottom margin*/ 
width: 598px; /*adds a fixed width*/ 
}  

    

.box-inside {  
background-color: #0c0c0c; /*adds a background color*/ 
border: 1px solid #030303; /*adds a 1px colored border*/ 
float: left; /*floats left*/ 
width: 576px; /*adds a fix width */ 
padding: 10px; /*adds padding all the way around*/ 
}  

    

.box-inside p {  
padding-top: 10px; /*adds top padding*/ 
}  

    

.boxtitle1 {  
color: #FFFFFF; /*text color*/ 
text-transform: uppercase; /*transforms text to uppercase*/ 
font-size: 1em; /*sets font size*/ 
font-weight: normal; /*sets font weight*/ 
background-image: url(images/post_icon.png); /*adds our right icon to our header*/ 
background-repeat: no-repeat; /*stops icon repeating*/ 
background-position: right; /*positions background right*/ 
}  

  

.boxtitle2 {  
color: #aaaaaa; /*sets font color*/ 
text-transform: uppercase; /*transforms text to uppercase*/ 
font-size: 0.7em; /*sets font size*/ 
background-image: url(images/divider.png); /*adds our divider image*/ 
background-repeat: repeat-x; /*repeats our divider image horizontally*/ 
background-position: bottom; /*positions divider at the bottom*/ 
padding-bottom: 10px; /*adds bottom padding*/ 
} 



/* ----------CONTENT RIGHT (sidebar) STYLES---------- */ 


#content-right {  
float: right; /*floats right*/ 
width: 290px; /*sets a fixed width*/ 
margin-left: 10px; /*adds a left margin*/ 
padding-bottom: 40px; /*adds bottom padding*/ 
}  

   

.sidebar {  
float: left; /*floats left*/ 
width: 287px; /*adds a fixed width*/ 
border: 1px solid #121212; /*adds a 1 px colored border*/ 
margin-bottom: 15px; /*adds a bottom margin*/ 
}  
    

.sidebar-inside {  
background-color: #0c0c0c; /*sets background color*/ 
border: 1px solid #030303; /*adds a 1px colored border*/ 
float: left; /*floats left*/ 
width: 266px; /*sets a fixed width*/ 
padding: 10px; /*adds padding all the way around*/ 
}  
    

.sidebar-inside p {  
padding-top: 10px; /*adds top padding*/ 
}  

   
.sidebar-title1 {  
background-image: url(images/hint.jpg); /*adds our sidebar bullet icon*/ 
background-repeat: no-repeat; /*stops background from repeating*/ 
background-position: right; /*positions background right*/ 
}  


.sidebar-title2 {  
color: #aaaaaa; /*sets text color*/ 
text-transform: uppercase; /*transforms text to uppercase*/ 
font-size: 0.7em; /*sets font size*/ 
background-image: url(images/divider.png); /*adds our divider image*/ 
background-repeat: repeat-x; /*repeats divider image horizontally*/ 
background-position: bottom; /*positions background bottom*/ 
padding-bottom: 10px; /*adds bottom padding*/ 
} 

 /* Setup Tabs */


 .pictures {
            margin: 0;
            padding: 0;
            border: 0;
            outline: 0;
			
			        }

ul.pictures {
        background:#000;
        width:74px; /* Width of Tab Image */
        float: left;
        list-style: none;
        margin-right:10px;
		
		    }
    
li {
        height:56px; /* Height of Tab Image */
			list-style-type: none;
			
		}
    
    /* Setup Tab so normal opacity is 40 and rollover is 100 */
 ul li a img {
        /* for IE */
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
        filter:alpha(opacity=40);
      
        /* CSS3 standard */
        opacity:0.4;
      border:0px;
    }
    
    /* Change Opacity to 100% on roll over */
ul li a:hover img {
          
        /* for IE */
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
        filter:alpha(opacity=100);
        
        /* CSS3 standard */
        opacity:1.0;
		
    }

    /* Places images to the right of the tabs,
    and hides non selected images */
 #featureimages {
        width:300px; 
        height:225px; 
        overflow:hidden;  /* Hides the non selected images */
        float:left;
	    }
    
#wrapper
{
height: auto;
width: auto;
margin-top: 20px;
margin-left:20px;
float:left;
}
