@charset "utf-8";
/** Changing the file size */ 
html,body{margin:0;padding:0}
body{font: 84% arial,sans-serif; background:url(../images/bodyBG.jpg) repeat-x bottom; background-color:#bababa}
a{color: #e4e28b; text-decoration:none}
a:hover{color:#598160}
div#GapFill{background: #fff}
div#container{}
div#header {height:24px; line-height:22px; background: #2d243b; color: #e4e28b; text-align:right; font-size: 13px}

div#logo{width:auto; max-width: 25.2%; background:url(../images/18logoLg.jpg) no-repeat top; height: 200px}

div#content{margin-left:30px; width: 51.3em; z-index: 20}
div#content p {padding-left: 16px; margin-right: 2.2em; margin-bottom: 10px; font-size:15px}
div#contentImg{margin-left: 54px; margin-bottom: -8px}
div#content a{color:#2d243b}
div#content a:hover{color:#598160}

div#wrapper{float:right; width:75%; background:url(../images/TopFade.jpg) no-repeat top center; height: auto; min-height: 778px}

div#tab1{margin-left: 36px; height: auto; max-height: 90px; width: 600px}
#col1 {width: 161px; float: left; display:block}
#col2 {width: 181px; float:left; display:block}
#car a { display:block; height:30px; width:120px; overflow:hidden;}
#car a:hover { display:block; text-indent:-120px;}
#renting a { display:block; height:30px; width:160px; overflow:hidden;}
#renting a:hover { display:block; text-indent:-160px; }
#harassment a { display:block; height:30px; width:180px; overflow:hidden;}
#harassment a:hover { display:block; text-indent:-180px; }
#CC a { display:block; height:30px; width:120px; overflow:hidden;}
#CC a:hover { display:block; text-indent:-120px; }
#Internet a { display:block; height:30px; width:162px; overflow:hidden;}
#Internet a:hover { display:block; text-indent:-162px; }
#Contracts a { display:block; height:30px; width:100px; overflow:hidden;}
#Contracts a:hover { display:block; text-indent:-100px; }
#SS a { display:block; height:30px; width:230px; overflow:hidden;}
#SS a:hover { display:block; text-indent:-230px; }
#DUI a { display:block; height:30px; width:226px; overflow:hidden;}
#DUI a:hover { display:block; text-indent:-226px; }
#Law a { display:block; height:30px; width:100px; overflow:hidden;}
#Law a:hover { display:block; text-indent:-100px; }
#program a { display:block; height:30px; width:320px; overflow:hidden;}
#program a:hover { display:block; text-indent:-320px; }

div#VidSpace{background:transparent; width:23%; height: 400px; margin-top: 40px; padding-left: 12px}
div#VidSpace a:link{color: #2d243b}
div#VidSpace a:hover{color:#598160}

div#footer{color: #000; clear:both; width:100%; height: 42px;  padding-top: 0px}
div#footerLeft{ width: 170px; height: 26px; position: absolute; left: 50px; text-align: left}
div#footerCenter{width: 300px; height: 26px; position: absolute; left: 510px; font-size: 12px}
div#footerRight{width: 140px; height: 26px; position: absolute; left: 1100px; text-align: left}
div#footer p{font-size: 10px}
div#footer a:link{color:#2d243b}
div#footer a:hover{color:#598160}

/* holds the information for the center image and captions */
#imap {display:block; width:640px; height:365px; background:url(../images/teensLG.jpg) no-repeat top; position:relative; margin:10px 0 0px 5px;}
#imap a#display {display:block; width:386px; height:0; padding-top:100px; overflow:hidden; position:absolute; left:0; top:0; background:transparent; cursor:default; font-size: 70%}
* html #imap a#display {height:210px; he\ight:0}
#imap a#display:hover {background-position: 0 0; z-index:10}
#imap dd {position:absolute; padding:0; margin:0; margin-left: -10px}
/* moves the hover sweet spot */
#imap #teenA {left:20px; top:20px; z-index:20;}
#imap #teenB {left:96px; top:14px; z-index:20;}
#imap #teenC {left:166px; top:26px; z-index:20;}
#imap #teenD {left:229px; top:26px; z-index:20;}
#imap #teenE {left:312px; top:32px; z-index:20;}
#imap #teenF {left:376px; top:34px; z-index:20;}
#imap #teenG {left:445px; top:35px; z-index:20;}
#imap #teenH {left:518px; top:35px; z-index:20;}
#imap #teenI {left:579px; top:31px; z-index:20;}

/* changes the width and height hover spot */
#imap a#link_teenA {display:block; width:75px; height:300px; text-decoration:none; z-index:20;}
#imap a#link_teenB {display:block; width:70px; height:300px; text-decoration:none; z-index:20;}
#imap a#link_teenC {display:block; width:60px; height:270px; text-decoration:none; z-index:20;}
#imap a#link_teenD {display:block; width:80px; height:270px; text-decoration:none; z-index:20;}
#imap a#link_teenE {display:block; width:64px; height:264px; text-decoration:none; z-index:20;}
#imap a#link_teenF {display:block; width:70px; height:258px; text-decoration:none; z-index:20;}
#imap a#link_teenG {display:block; width:70px; height:260px; text-decoration:none; z-index:20;}
#imap a#link_teenH {display:block; width:60px; height:270px; text-decoration:none; z-index:20;}
#imap a#link_teenI {display:block; width:60px; height:278px; text-decoration:none; z-index:20;}

#imap a em {display:none;}	
#imap a span, #imap a:visited span {display:none; border: none}

/* places a yellow box around the person */
#imap a#link_teenA:hover, #imap a#link_teenB:hover, #imap a#link_teenC:hover, #imap a#link_teenD:hover, #imap a#link_teenD:hover, #imap a#link_teenF:hover, #imap a#link_teenG:hover, #imap a#link_teenH:hover, #imap a#link_teenI:hover {border: 0px solid #fc0;}
/* Style the text box */
#imap a:hover span {position:absolute; display:block; color:#000; width:194px; height:430px; line-height:1.2em; font-size:1.0em; text-align:left; background:url(../images/DetailBox.jpg) no-repeat top center; padding: 20px; padding-left: 30px; padding-right: 34px}

#imap a:hover span H2{color:#FFFFFF; margin-bottom: -14px; font-family:"Courier New", Courier, monospace; font-size: 1.8em; margin-left: 0px; margin-top:-16px}

#imap a#link_teenA:hover span {left:640px; top:-5px;}
#imap a#link_teenA:hover em {position:absolute; display:block; left:60px; top:34px; width:600px; height:1px; overflow:hidden; font-size:1px; background:#2556e2}

#imap a#link_teenB:hover span {left:564px; top: 1px;}
#imap a#link_teenB:hover em {position:absolute; display:block; left:54px; top:40px; width:536px; height:1px; overflow:hidden; font-size:1px; background:#209035;}

#imap a#link_teenC:hover span {left:494px; top:-11px;}
#imap a#link_teenC:hover em {position:absolute; display:block; left:38px; top:28px; width:477px; height:1px; overflow:hidden; font-size:1px; background:#7f276d;}

#imap a#link_teenD:hover span {left:431px; top:-11px;}
#imap a#link_teenD:hover em {position:absolute; display:block; left:50px; top:28px; width:400px; height:1px; overflow:hidden; font-size:1px; background:#e35000;}

#imap a#link_teenE:hover span {left:348px; top:-17px;}
#imap a#link_teenE:hover em {position:absolute; display:block; left:50px; top:22px; width:350px; height:1px; overflow:hidden; font-size:1px; background:#ca0002;}

#imap a#link_teenF:hover span {left:284px; top:-19px;}
#imap a#link_teenF:hover em {position:absolute; display:block; left:54px; top:20px; width:260px; height:1px; overflow:hidden; font-size:1px; background:#209035;}

#imap a#link_teenG:hover span {left:215px; top:-20px;}
#imap a#link_teenG:hover em {position:absolute; display:block; left:50px; top:19px; width:200px; height:1px; overflow:hidden; font-size:1px; background:#2556e2;}

#imap a#link_teenH:hover span {left:142px; top:-20px;}
#imap a#link_teenH:hover em {position:absolute; display:block; left:52px; top:19px; width:230px; height:1px; overflow:hidden; font-size:1px; background:#840b9f;}

#imap a#link_teenI:hover span {left:81px; top:-16px;}
#imap a#link_teenI:hover em {position:absolute; display:block; left:52px; top:23px; width:230px; height:1px; overflow:hidden; font-size:1px; background:#e35000;}

/* Style the image in the text box */
#imap a:hover span img {float:left; margin-right:1em; margin-bottom:0.1em; margin-top: 36px; margin-left: 10px; border:1px solid #000;}

#info h3 {margin:0 0 0 75px; font-size:1.2em; font-weight:normal; font-family:georgia, "times new roman", serif; letter-spacing:0.1em; padding-bottom:5px; border-bottom:1px solid #aaa; width:450px;}
#info .para {width:400px; margin:0 0 0 75px;}