/*
Orange: #f49426;
Blue:#1166ff
Grey: #f2f1f1
*/

body 
{
    background-color:#f2f1f1;
    
  	font-family:Verdana, Arial, Helvetica, sans-serif;

 	font-size:0.75em;
	line-height:1.4em;
	color:#666666;
    
}

h1
{
	
  line-height :normal;
  font-size : 2.5em; 
    
}

h2
{
    
  line-height :normal;
  font-size : 2em; 
    
}



*
{
 margin:0;
 padding:0;
 border:0;
    
}

p
{
  margin:10px 0;
}

hr
{
 border:solid 1px silver;  
 margin:5px 0; 
}








ul 
{
    
    line-height:1.75em; 
    
}

ul li
{
    margin: 0 20px;
    padding: 3px 7px;
    


    list-style-type:circle;
    list-style-position:outside;
   

/*    list-style-image:url(../images/bullet-point.gif); */
    
    
    
}



a img
{
    border:0;
    
}


#header
{
 background-image:url(../images/header.gif);   
}

#header img
{
 margin:5px;
}

#top-border
{
 margin: 0 auto;
 width:900px;
 height:23px;
 background: url(../images/top.gif) White no-repeat top center;
 
}

#bottom-border
{
 margin: 0 auto;
 width:900px;
 height:26px;
 background: white url(../images/bottom.gif) no-repeat top center;
 
}



#container
{
 margin: 0 auto;
 width:900px; /* 800px + to allow for shaded border */
 background: white url(../images/side.gif) repeat-y top center;
}

#content
{
 margin: 0 auto;

 width:800px;
    
}



#left-column
{
 width:488px; 
 padding:10px;
 margin:5px;
 padding:0;
 
 float:left;
 
 
 
 
 
}


#right-column
{
    
 /* total width  10 + 150 + 10 = 170 */
 width:150px;   
 margin:0;
 padding:10px;
 
 float:right;
 
 border-left:dotted 2px silver;
 background-color:white;
 
}

#right-column h2
{
  font-size:1em;
  font-style:normal;
  color:#3647bd; 
  
 
  margin:0;
    
}

#right-column h3
{
  
  
  margin:0 0 5px 0;
  
  font-size:small;
  color:#3647bd;   
}

#right-column p
{
  margin:0;

 font-size:small;
 color:gray;   
}


#right-column li
{
    
 color:red;
 list-style-type:disc;
}

#menu
{
    float:left;
    width:130px;
    
    
    
}



#menu ul
{
    margin-top:10px;
    list-style-type:none;
    list-style-position:inside;
}

#menu li
{
 display:inline; /* for IE6 margin bug */
 margin:0;
 padding:0;

}

#menu li a
{
    /* total width 129px */
    
    display:block;
    width:109px;
    padding:5px;
    height: 42px;
 
    text-decoration: none;
	font-weight:bold;
    color: black;
    background:transparent url('../images/button.gif') top center no-repeat;
    text-align:center;
    line-height:2em;
}

#w3-validation
{
    margin-left:10px;
}


/*------------------------------------------------------------*
**  website_design_list
**------------------------------------------------------------*/
.website_design_list
{
  margin:0;
  padding:10px;
    
}

.website_design_list ul {
	
 
   padding:0;
    
 	}
	
.website_design_list li {
	
	list-style-type:none;
    background: url(../images/bullet-point.gif) no-repeat  0 50%;
    padding-left: 15px;
    line-height:normal;

	}
	
.website_design_list li a {
	color: #735f55;
	

	text-decoration: none;
	font-size:1.5em;
	padding:5px;
	
	
	
	}

.website_design_list li a:hover 
{ 
   
    color:#2b211d;
    border-bottom: dotted 1px #2b211d;
    
    cursor:pointer;
 }
 
.website_design_list li a.on 
{ 
     color: white; 
     background-color:#735f55;
}



.website_design_image
{
 display:block; /* necessary for IE6 to remove bottom margin */
    
}

.nowrap 
{white-space: nowrap;}

#menu li a:hover
{
    color:blue;
    
}

#menu li a.on
{
    color:red;
}

#middle-text
{
 margin-left:130px;   
 border-left:dotted 1px silver;
}


#portfolio
{
    
    
}



#portfolio h3
{
    color:White;
    background-color:#1166ff;
    margin:0;
    padding:5px 10px;
    
}


#portfolio h3.course_item
{
    color:White;
    background-color:red;
    margin:0;
    padding:5px 10px;
    
}



#portfolio li
{
 
 list-style:none;
    
}

#course
{
    
    
}

#course h2
{
    color:#f49426;
    font-size:medium;
   
    font-weight:bold;
    margin:10px 0 0 0;
    
}


#course h3
{
    color:White;
    background-color:#1166ff;
    margin:0;
    padding:5px 10px;
    
}

#course h4
{
    
    margin:0;
    padding:5px 10px;
    font-size:small;
    
}

#course table
{
    margin:10px;
    padding:5px 10px;
    font-size:small;
    
}

#course tr.title
{
    
    color:white;
    background-color:Red;
    border:solid 1px black;
    
}

#course table td
{
 width:100px;   
}


#course li
{
 
 list-style:none;
    
}

.clear
{
        clear: both;
    

}

.quote
{
 font-style:italic;
 color:blue;   
 font-size:smaller;
}

.more
{
    
    background: transparent url(../images/more.jpg) no-repeat top left;
    height:30px;
    width:65px;
    
    
}

.portfolio_image
{
 padding:2px;
 border:solid 1px silver;  
 margin:30px 5px 0px 0px; 
    
   
}


.portfolio_item
{
    border:solid 1px silver;
    padding-left:0px;
    margin:10px 0;
    width:475px;
    height:245px;
    
}

.portfolio_item p
{
    padding-left:10px;
    
}


.course_item
{
    border:solid 1px silver;
    padding-left:0px;
    margin:10px 0;
    width:475px;
    height:245px;
    
}

.course_item p
{
    padding-left:10px;
    
}


.slide
{
  border:0;  
}

.form_button
{
   
    border:solid 1px gray;
    cursor:pointer;
    
}

.portfolio_item p
{
    float:left;
    width:240px;
}

.portfolio_item img
{
    float:right;
}


.more p
{
   padding:0 0 0 10px;
   margin:0;
   font-size:smaller;
   
    
}

.more a
{
 text-decoration:none;   
}

.more a:hover
{
    color:Red;
}


.contact
{
 border:solid 1px silver;   
}

/*------------------------------------------------------------*
**  Bottom navigation menu
**------------------------------------------------------------*/

#nav 
{
	
	clear:both;
	font-size:small;
	text-align:center;
    margin:0;
    border-top:solid 1px silver;
    
    
	
}

#nav ul
{
    margin:0;
    padding:5px 0;
  
}

#nav li
{

  
    display:inline;
  
	padding:0;
	margin:0;
	
    
    
}
	
#nav li a 
{
	text-decoration:none;
	color:black;
	
}

#nav a.active, #nav a:hover  , #nav a.on
{
	text-decoration:underline;
	
}



#footer
{
 
 clear:both;
 color:black;
 font-size:small;
 text-align:center;
 padding-top:0px;
 
 

}

#footer a
{
    color:blue;
}