/* this is really fun part -you can customize the appearance of you homepage here */
/* and note that the comment environment here is different as it is CSS file not html */

/* first, body of your homepage */
/* i will use throught rgb colors-you can see them for egzample here  http://www.web-source.net/216_color_chart.htm  */

/* here i used for a background picture 'bg10.png'  'url(bg10.png)', then i repeated picture in y dimension from the top and centered 'repeat-y top center'  remember to end each line with ';' */
/* and font is Arial,Helvetica,sans-serif 10pt  */
/* change to whatever you like */
body {
background: rgb(255,255,255) url(bg10.png) repeat-y top center;
font-size:10pt;  
font-family: Arial,Helvetica,sans-serif;
}
 
/* this is positioning of the page and apperance, you can change width of page 'width:900px;' ; text aligning 'text-align: justify;' background color 'background : rgb(255,255,255);' you can even put image in the background -uncomment 'url(../img/epps.png) repeat-y top center' and color of the font 'color : rgb(0,0,0);'  do not change other thing unless you know what you are doing*/
#page {
width:900px;
margin-left: auto;
margin-right: auto;
margin:auto;
padding:auto;
text-align: justify; 
background: rgb(255,255,255) /* url(../img/epps.png) repeat-y top center */;
color : rgb(0,0,0);
}


hr {
/* 	border:none; */
/* 	border-top:1px solid #CCCCCC; */
/* 	height:1px; */
/* 	margin-bottom:25px; */
/* color: rgb(102,204,255); */


color: rgb(102,204,255);
background-color: rgb(102,204,255);
height: 1px;
	}




/* here you change the apperance of headings */
h1 {
/* font-family:'Lucida Casual', 'Comic Sans MS'; */
text-transform:lowercase; 
font-family:Arial, Helvetica, sans-serif;
font-size:16pt;
color:#5179DF;
padding-top:0px;
}

h2 {
font-size:14pt;
padding-top:6px;
color:black;

}

h3 {
font-size:14pt;
padding-top:6px;
text-align:center;
}


/* apperance of links */

a {
/* 	color: blue; */
/* 	font-weight: 600; */
/* 	text-decoration: none; */
	}

/* a:hover {
	background: #900;
	color: #FFF;
	} */



/* and apperance of table */
table { 
border-color: red;
border-width: 0px 0px 0px 0px;
    border-style: solid; 
       }

td { 

border-color: blue;
    border-width: 0px 0px 0px 0px;
    border-style: solid;
    margin: 0;
    padding: 4px;
     cell-spacing: 0;
    background-color: rgb(135, 206, 250);

 }

 /* colors for footer */
#footer {

color:#140ACA;
}

#footer  a:link, #footer  a:visited {
	color:#140ACA;
/* 	display: block; */
/* 	background: url(menu1.gif); */
/* 	padding: 10px 0 0 20px; */
	}

/* I did not use these but you may want if you want to have two columns within page environment */
#d1 {
width:500px;
padding-top:0px;
padding-left:0px;
padding-bottom:0px;
float:left;
line-height:14pt;
}

#d2 {
width:250px;
padding-top:0px;
padding-left:0px;
padding-bottom:0px;
float:left;
line-height:14pt;
}

/* and this is code for the left menu-be careful while editing it is easy to mess it up - better do not edit*/

ul#menu,
ul#menu li,
ul#menu ul {
	margin: 0;
	border: 0 none;
	padding: 0;
	width: 130px; 
	list-style: none;
	float: left; 
	display: block ;
	display: inline;
	position: relative;
        height: 54px;
 	background: url(menu1.gif);

}

/* Root Menu */
ul#menu a {
	display: block;
 	background: url(menu1.gif);
/* 	background: #EEE; */
	color: rgb(255,255,255);
	text-decoration: none;
	font-size: 16px;
	padding: 10px 0 0 10px;
	font-weight: 900;
	}

/* Root Menu Hover  */
ul#menu a:hover,
ul#menu li:hover a,
ul#menu li.iehover a {
 	background: url(menu1.gif) 0 -69px;
	height: 34px ;
        color:red;
	}

/* 2nd Menu */
ul#menu li:hover li a,
ul#menu li.iehover li a {
 	background: url(menu1.gif);
	padding: 2px 0 0 2px;
        font-size:10pt;
        color:yellow;
	}

/* 2nd Menu Hover Persistence */
ul#menu li:hover li a:hover,
ul#menu li:hover li:hover a,
ul#menu li.iehover li a:hover,
ul#menu li.iehover li.iehover a {
 	background: url(menu1.gif) 0 -69px; 
	color: red;
	}

ul#menu ul,
ul#menu ul ul,
ul#menu ul ul ul {
	display: none;
	position: absolute;
	top: 0;
	left: 130px;
	}


ul#menu li:hover ul ul,
ul#menu li:hover ul ul ul,
ul#menu li.iehover ul ul,
ul#menu li.iehover ul ul ul {
	display: none;
	}

ul#menu li:hover ul,
ul#menu ul li:hover ul,
ul#menu ul ul li:hover ul,
ul#menu li.iehover ul,
ul#menu ul li.iehover ul,
ul#menu ul ul li.iehover ul {
	display: block;
	}


	
/* please be carful with editing things below-you may easily mess up your website, edit only if you know what you are doing */
	
	/* this one just squezzes text to 750px so that the left nbar fits in -rather do not chante it*/
#container {
float: left;
width:750px;
padding-top:20px;
padding-left:0px;
padding-left:0px;
line-height:14pt;
padding-bottom:20px;
text-align: justify;
display: inline;
}

/* this one places sidebar-rather do not change */
#sidebar {
float:left;
width:150px;
padding-top:30px;
padding-right:0px
}

	
	
	
/* 	please do not change things that are below as we try to have some consistency with respcet to format */
	
/* this is a general font for program names in the header-please do not change */
#epps {  
/* padding: 1px 1px 1px 1px; */
line-height:16pt; 
text-transform:lowercase; 
font-family:Arial, Helvetica, sans-serif;
font-size: 16pt;
font-weight: 900;
margin-top:-3px;
}

#pcrim  {
	color: rgb(15,170,229);  
	}

#peco {
	color:   rgb(227,27,35);
	}
	
#pgis{
       color: rgb(140,198,63);
            }
#ppppe{ 
       color: rgb(142,11,58);
     
}
#psci{ 
       color: rgb(245,131,42);
     
}

#ppa{ 
       color: rgb(0,85,149);
}

#psoc{ 
       color: rgb(34,180,102);
     
}

	

#d_prog{
	width:250px;
	padding-top:0px;
	padding-left:0px;
	padding-bottom:0px;
	float:left;
	line-height:14pt;
	/*font-family:'Lucida Casual', 'Comic Sans MS';*/
	font-size:10pt;
	color: #0FAAE5;
	font-weight: 900;
}

#d_prog li a:link, #d_prog li a:visited {
	color: blue;
	display: block;
	padding: 10px 0 0 20px;
	text-decoration:none;
	}
#d_prog li a:hover {
	border: 1px #ffffff outset;	
	}



 /* *** */
 /* nav */
 /* *** */

	
#prog {
	float:left;
	width:100%;
/* 	background:rgb(255,255,255); */
/* 	line-height:normal; */
	border-bottom:0px solid #BCD2E6;
	}

#prog ul {
	margin:0;
	padding:0px 1px 0 1px;
	list-style:none;
	}
#prog li {
	display:inline;
	margin:0;
	padding:0;
	}
#prog a {
	float:left;
	margin:0;
	padding:0 3px 0 3px;
	text-decoration:none;
	}

#prog li a:hover {
      border: 2px rgb(3,5,200) outset;	
	}	
	
	
	
	
	

/*programs*/


#crim{
	font-family:'Lucida Casual', 'Comic Sans MS';
	font-size:12pt;
	color: #0FAAE5;
	font-weight: 900;
}



#crim a {
	float:left;
	margin:0;
	padding:0 0 0 13px;
	text-decoration:none;
	}





#crim li a:link, #crim li a:visited {
	color: #0FAAE5;
	}

#crim li a:hover {
border: 1px #ffffff outset;	
	}
#eco{
	font-family:'Lucida Casual', 'Comic Sans MS';
	font-size:12pt;
	color: #E31B23;
	font-weight: 900;
}

#eco li a:link, #eco li a:visited {
	color:   #E31B23;
	}

	}
#gis{
	font-family:'Lucida Casual', 'Comic Sans MS';
	font-size:12pt;
	color: #8CC63F;
	font-weight: 900;
}

#gis li a:link, #gis li a:visited {
	color:   #8CC63F;
	}