/* --------------------------------------------------------------------------
Colorado.gov - Colorado Treatment Facility Search Application     global.css
-------------------------------------------------------------------------- */
/* GENERAL RULES
-------------------------------------------------------------------------- */
*{margin:0; padding:0}
body{background-color:#666; font-family:Arial,Helvetica,sans-serif; font-size:80%; text-align:center}
table{border-collapse:collapse; font-size:100%}

/* Global Link Settings
-------------------------------------------------------------------------- */
a{color:#03F; text-decoration:underline}

/* Global Text Settings
-------------------------------------------------------------------------- */
h1{margin:15px 0; font-size:120%; color:#000}
h2{font-size:110%;font-weight:normal; line-height:1.3}/* Home Page Specific */
h3{font-size:120%; border-bottom:#D2D2D2 1px solid; margin-bottom:15px; padding-bottom:2px}/* Page Titles */
h4{font-size:120%; color:#F00}/* File Reqeust Confirmation */

/* General Elements
-------------------------------------------------------------------------- */
img{border:0}
input{font-size:105%}

/* Often used Classes
-------------------------------------------------------------------------- */
.font11{margin:0; font-size:11px; font-weight:normal}
.pad5{padding:5px}
.padLeft10{padding-left:10px;}
.padLeft26{padding-left:26px}
.padLeft40{padding-left:40px}
.padLeft52{padding-left:52px}
.padBtm5{padding-bottom:5px}
.padRight10{padding-right:10px}
.padTop10{padding-top:10px}
.padTop20{padding-top:20px}
.padBtm10{padding-bottom:10px}
.padBtm15{padding-bottom:15px}
.padBtm20{padding-bottom:20px}
.marginTop10{margin-top:10px}

/* Tables
-------------------------------------------------------------------------- */
.mainTable{background:#FFF; width:780px; margin:0 auto}
.contentTable{background:#FFF; text-align:left; width:780px}
.copyTable{text-align:left; width:100%}
.copyTable p{padding-top:6px}
.copyTable blockquote{padding:5px 0 10px 45px}
/* Narrow Search Check boxes td */
.narrowSearch{background:#FFF; border:#CCC 1px solid; font-size:86%;}
.narrowSearch p{background:#CCC; padding:3px; margin:0}
.narrowSearch ul{list-style-type:none; margin:0; padding:0}
.narrowSearch ul ul{margin:0 0 0 2px; padding:0}
.narrowSearch li{margin:6px 3px 6px 3px; padding:0; white-space: normal;}
/* Provider Summary table */
.providerSummary{border:1px solid #18419A; border-collapse:collapse; width:700px}
.providerSummary th{background:#18419A; color:#FFF; padding:5px 5px; text-align:left}
.providerSummary td{text-align:center; font-size:86%; font-weight:bold}
.providerSummary input{/*font-size:110%; */}
.titles td{border-bottom:#000 1px solid; padding:3px 2px; background:#EEE;}
/* Map Pop Window table */
.mapPopTable {width:244px; margin:0 15px 0 15px; border-collapse:collapse;}
.mapPopTable th{background:#FFF; color:#000; text-align:left;}
.mapPopTable td{text-align:left; font-size:95%; line-height:1.1;}
/* td styles w/ pad */
.odd td{background:#FFF; border-bottom:#18419A 1px solid; padding:7px 3px; font-weight:normal}
.even td{background:#EEE; border-bottom:#18419A 1px solid; padding:7px 3px; font-weight:normal}
/* td styles w/o pad */
.odd2 td{background:#FFF}
.even2 td{background:#EEE}
table.demo{background:url(../images/demo.gif) repeat}
td.image img{display:block}
/* specific td padding */
td.td10-20-0-20pad{padding:10px 20px 0 20px}
td.td0-40-0-40pad{padding:0 40px 0 40px}
td.td0-40-10-40pad{padding:0 40px 10px 40px}
td.td10-40-0-40pad{padding:10px 40px 0 40px}
td.td10-40-10-40pad{padding:10px 40px 10px 40px}
td.td10-0-10-0pad{padding:10px 0 10px 0}
td.td10-0-20-0pad{padding:10px 0 20px 0}
td.td0-40-20-40pad{padding:0 40px 20px 40px}
td.td0-40-20-214pad{padding:0 40px 20px 250px}
td.td15-40-10-40pad{padding:15px 40px 10px 40px}
td.td15-40-20-40pad{padding:15px 40px 20px 40px}
td.td20-40-0-40pad{padding:20px 40px 0 40px}
td.td20-40-20-40pad{padding:20px 40px 20px 40px}
td.td20-40-10-40pad{padding:20px 40px 10px 40px}
td.td20pad{padding:20px}
td.grayLine-1{background:#999; height:1px; margin:5px}
td.grayLine-2{background:#999; height:2px}
td.grayLine-3{background:#999; height:3px}
td.blueLine-1{background:#153681; height:1px}
td.whiteLine-1{background:#FFF; height:1px}
.td15{width:15%}
.td17{width:17%}
.td20{width:20%}
.td26{width:26%}
.td30{width:30%}
.td32{width:40%}
.td35{width:35%}
.td40{width:40%}
.td60{width:60%}
.td65{width:65%}
.td68{width:60%}
.td70{width:70%}
.td74{width:74%}
.td80{width:80%}
.td83{width:83%}
.td85{width:85%}
.td433px{width:433px}
.td217px{width:217px} /* Narrow Search TD */
.td258px{width:258px}
.printVersion{margin:0; padding:0; list-style-type:none; text-align:right}
.printVersion li a{background:url(../images/icon_printer.gif) left center no-repeat; color:#000; padding:3px 0 3px 20px; font-size:86%}

/* Address Bar
-------------------------------------------------------------------------- */
.address{background:#18419A; color:#FFF; padding-top:5px; padding-right:0px; padding-bottom:5px; padding-left:0px; text-align:center; letter-spacing:1px}
table.subnav{background:#34506d; border-collapse:collapse; border-spacing:0; color:#FFF; float:right; margin:1px} 

/* Home Page
-------------------------------------------------------------------------- */
td.viewDemo{padding-left:25px; width:129px; height:107px}
td.viewDemo img{float:left}
td.logo{padding-right:25px; width:151px}
td.logo img{float:right}
td.width129{width:129px}
td.width151{width:151px}
td.width500{width:500px}

/* Sub Pages
-------------------------------------------------------------------------- */
.sectionTitle {
	font-size:140%;
	padding-bottom:1px;
	margin-bottom:20px;
	background: url(../images/horizTitleLine.gif) no-repeat bottom left;
}

/* Forms
-------------------------------------------------------------------------- */
/* Checkbox Tree */
.radioWrapper {background:url(../images/bgrd_radioWrapper.gif) repeat-y;margin-top:10px;padding:10px;}
.radioTitles {font-size:110%; margin-top:7px;}
.radioTitles label { padding-left:5px; color:#18419A; font-weight:bold;}

.textFields{border-top:1px solid #818181; border-right:1px solid #d9d9d9; border-bottom:1px solid #d9d9d9; border-left:1px solid #818181; color:#000; font-family:Arial,Helvetica,sans-serif; height:1.4em; padding:3px 3px 0 3px; font-weight:normal}
textarea.textFields{height:auto; font-weight:normal; font-size:105%}
.required{font-size:14px; font-weight:bold; color:#C00}
.error{color:#C00; font-weight:bold; font-size:12px}

/* FOOTER
-------------------------------------------------------------------------- */
.footerColorBars{background-image:url(../images/footerColorBars.gif); background-repeat:no-repeat; height:16px}
.footerText{background:#666; color:#FFF; font-weight:normal; text-align:center; padding-top:13px; padding-bottom:15px}
.footerText a{color:#FFF; text-decoration:underline}

/* JQUERY TABS
-------------------------------------------------------------------------- */
@media projection, screen{.tabs-hide{ display:none}} /* Use class for showing/hiding tab content,so that visibility can be better controlled in different media types... */
@media print{ .tabs-nav{ display:none}}
/* Skin */
.tabs-nav{list-style:none;  margin:0;  padding:0}
.tabs-nav:after{display:block; clear:both; content:""} /* clearing without presentational markup,IE gets extra treatment */
.tabs-nav li{float:left; margin:0 2px 0 0; min-width:104px; /* be nice to Opera */}
.tabs-nav a, .tabs-nav a span{display:block; padding:0 20px;     background:url(../images/tab.gif) no-repeat}
.tabs-nav a{position:relative; top:1px;  z-index:2;  padding-left:0;  color:#18419A;  font-size:100%;  font-weight:bold;  line-height:1.1;  text-align:center;  text-decoration:none;  white-space:nowrap; /* required in IE 6 */ }
.tabs-nav .tabs-selected a{color:#000}
.tabs-nav .tabs-selected a, .tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active{ background-position:100% -150px;  outline:0; /* prevent dotted border in Firefox */}
.tabs-nav a, .tabs-nav .tabs-disabled a:hover, .tabs-nav .tabs-disabled a:focus, .tabs-nav .tabs-disabled a:active{ background-position:100% -100px}
.tabs-nav a span{ width:64px; /* IE 6 treats width as min-width */ min-width:64px;  height:25px; /* IE 6 treats height as min-height */ min-height:18px;  padding-top:6px;  padding-right:0}
*>.tabs-nav a span{/* hide from IE 6 */ width:auto;  height:auto}
.tabs-nav .tabs-selected a span{ padding-top:7px}
.tabs-nav .tabs-selected a span, .tabs-nav a:hover span, .tabs-nav a:focus span, .tabs-nav a:active span{ background-position:0 -50px}
.tabs-nav a span, .tabs-nav .tabs-disabled a:hover span, .tabs-nav .tabs-disabled a:focus span, .tabs-nav .tabs-disabled a:active span{ background-position:0 0}
.tabs-nav .tabs-selected a:link, .tabs-nav .tabs-selected a:visited, .tabs-nav .tabs-disabled a:link, .tabs-nav .tabs-disabled a:visited{/* @ Opera,use pseudo classes otherwise it confuses cursor... */ cursor:text}
.tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active{/* @ Opera,we need to be explicit again here now... */ cursor:pointer}
.tabs-container{ border:1px solid #18419A; position:relative; padding:1em .7em;  background:#fff; /* declare background color for container to avoid distorted fonts in IE while fading */}
.tabs-container h1{color:#153987; font-weight:bold; font-size:100%; padding:0 0 5px 0; margin:0}
.tabs-container p{padding-top:6px; font-weight:bold}
input.disabled{background:#CCC; color:333; width:4.2em}
select.list{border-top:1px solid #818181; border-right:1px solid #d9d9d9; border-bottom:1px solid #d9d9d9; border-left:1px solid #818181; color:#000; font-family:Arial,Helvetica,sans-serif; padding:1px; font-weight:normal; width:165px}

/* THICKBOX */
#TB_window{font:12px Arial,Helvetica,sans-serif; color:#333}
#TB_secondLine{font:10px Arial,Helvetica,sans-serif; color:#666}
#TB_window a:link{color:#03F}
#TB_window a:visited{color:#03F}
#TB_window a:hover{color:#000}
#TB_window a:active{color:#03F}
#TB_window a:focus{color:#03F}

/* thickbox settings */
#TB_overlay{position:fixed; z-index:100; top:0px; left:0px; height:100%; width:100%}
.TB_overlayMacFFBGHack{background:url(../images/bgrd_macFFBgHack.png) repeat}
.TB_overlayBG{background:#000; filter:alpha(opacity=50); -moz-opacity:0.50; opacity:0.50}
#TB_window{position:fixed; background:#FFF; z-index:102; color:#000; display:none; border:4px solid #525252; text-align:left; top:50%; left:50%}
#TB_window img#TB_Image{display:block; margin:10px 15px 0px 15px; padding:0; /*border-right:1px solid #ccc; border-bottom:1px solid #ccc; border-top:1px solid #666; border-left:1px solid #666; */}
#TB_caption{height:25px; padding:7px 30px 10px 25px; float:left}
#TB_closeWindow{height:20px; padding:11px 25px 10px 0; float:right}
#TB_closeAjaxWindow{/* integrated top right close button */padding:7px 7px 0 0; text-align:right; margin:0}
/*#TB_ajaxWindowTitle{float:left; padding:0; margin-bottom:1px}
*/
#TB_title{background-color:#FFF}
#TB_ajaxContent{background:#FFF; clear:both; margin:0; padding:0; /*overflow:hidden; */text-align:left; line-height:1.3em}
#TB_ajaxContent.TB_modal{padding:5px}
#TB_ajaxContent p{padding:0px 0px 5px 15px; margin:0}
#TB_load{position:fixed; display:none; height:13px; width:208px; z-index:103; top:50%; left:50%; margin:-6px 0 0 -104px; /* -height/2 0 0 -width/2 */}
#TB_HideSelect{z-index:99; position:fixed; top:0; left:0; background-color:#fff; border:none; filter:alpha(opacity=0); -moz-opacity:0; opacity:0; height:100%; width:100%}
#TB_iframeContent{clear:both; border:none; margin-bottom:-1px; margin-top:1px; _margin-bottom:1px}

/* TOOLTIP */
.bubbleInfo {
            position: relative;
            top:0;
            left:0;
			padding:0;
			width:100%;
        }
        .trigger {
            position:relative; color:#03F; text-decoration:underline; cursor:pointer;}
.popup {position:absolute; display:none; z-index:50; border-collapse:collapse; }
.popup td { border:0; padding:0;}

        .popup td.corner {
        	height: 9px;
        	width: 9px;
        }

        .popup td#topleft { background-image: url(../images/img_tipTopLeft.gif);}
        .popup td.top { background-image: url(../images/img_tipTopLine.gif);}
        .popup td#topright { background-image: url(../images/img_tipTopRight.gif);}
        .popup td.left { background-image: url(../images/img_tipLeftLine.gif);}
        .popup td.right { background-image: url(../images/img_tipRightLine.gif);}
        .popup td#bottomleft { background-image: url(../images/img_tipBtmLeft.gif);}
        .popup td.bottom { background-image: url(../images/img_tipBtmLine.gif);}
        .popup td.bottom img { display: block; margin: 0 auto;}
        .popup td#bottomright { background-image: url(../images/img_tipBtmRight.gif);}

        .popup td.topleft { background-image: url(../images/img_tipTopLeft.gif);}
        .popup td.topright { background-image: url(../images/img_tipTopRight.gif);}
        .popup td.bottomleft { background-image: url(../images/img_tipBtmLeft.gif);}
        .popup td.bottomright { background-image: url(../images/img_tipBtmRight.gif);}
           
        .popup table.popup-contents {
        	background-color: #fff;
        	color: #000;
        	}


        table.popup-contents td {
			background:#FFF;
		    font-size: 120%;
        	text-align: left;
			line-height: 1.5em;
			padding:3px;

        	}
			
			
			
			
			
a.info {
    position:relative; /*this is the key*/
    z-index:24;
    color:#0033FF;
    text-decoration:none;
	padding:3px;
}
a.info:hover {
	z-index:25;
	background:transparent;
	padding:3px;
	color:#000;
}
a.info span {display: none}
a.info:hover span{ /*the span will display just on :hover state*/
    display:block;
    position:absolute;
    bottom:0;
	left:2.8em;
    border:3px solid #a0c7ff;
    background:#FFF;
	color:#000;
    text-align: left;
	padding:7px;
}



/*JSF Tab*/
.tabActive {
	padding:0 20px !important;
	background:url(../images/tab.gif) no-repeat !important;
	background-position:0 0 !important
	outline:0 !important;
}

.tabInactive {
	padding:0 20px !important;
	background-color: #AAAAAA !important;
	background:url(../images/tab.gif) no-repeat !important;
	background-position:0 0 !important
	outline:0 !important;
}

.activeSub {
    background-color: #FFFFFA !important;
    padding: 0px !important;
    border: 1px solid #FFFFFF !important;
}

.inactiveSub {
    background-color: #FFFFFA !important;
    padding: 0px !important;
    border: 1px solid #FFFFFF !important;
}


.tabContainer {
	float:left !important; margin:0 2px 0 0 !important; min-width:104px !important;

}

.tabBackground {
	width: 70% !important;
    vertical-align: top !important;
    border-collapse: separate !important;
    border-spacing: 0px !important;
    background-color: #FFFFFF !important;
	outline: 0 !important;
}

.tabContent {
    background-color: #FFFFFF !important;
    border:1px solid #18419A !important;
    vertical-align: top !important;
    padding-top: 5px !important;
    padding-left: 5px !important;
    height: 100% !important;
    text-align:left !important;
    width:765px;
	outline:0 !important;
}

/* THE MAP ITSELF
-------------------------------------------------------------------------- */
div#map {width:510px;height:400px;border: 1px solid #666666;}
div#minimap {width: 244px;height: 244px;border: 1px solid #999999;margin:10px 15px 15px 15px;padding:0;}
span.fakeanchor {color:#00f;text-decoration:underline;cursor:pointer;}