/* A CSS Framework by Mike Stenhouse of Content with Style */

@import url("forms.css");

/* SITE SPECIFIC LAYOUT */
    body {
        margin: 0;
        padding: 0;
        background: #fff; 
        text-align: center;
    }
    
    /* Force vertical scrollbar to avoid page shift in browsers such as Firefox */
	html { min-height: 100%; margin-bottom: 1px; }
    

	div#branding {
	    float: left;
		position: relative;
	    height: 45px;
	    width: 500px;
		background: url('../images/logo.gif') no-repeat left bottom;
		text-align: left;
		vertical-align: bottom;
	}    
	
	div#branding div#tagline {
		position: absolute;
		left: 0px;
	    bottom: -3px;
		text-indent: 140px;
		color: #999;
		line-height: 1.4em;
		font-stretch:extra-expanded;
		font-weight:600;
		font-size: 80%;
	}    

	
    div#page {
        width: 960px;
        margin: auto;
        padding: 0px 17px;
        background: white;
        text-align: center;
		float: center;
    }
    
    /* HEADER */
        div#header {
            margin: 0px 0px 8px 0px;
            padding: 20px 0px 0px 0px;
            color: black;
            text-align: left;
        }
        div#personal-menu {
            margin: 0;
            padding: 2px 0px 0px 0px;
			text-align: right;
			line-height: 1.2em;
			z-index: 50;
        }
        div#menu-bar {
			position: relative;
			font-weight: 600;
			font-size: 12px;
            float: left;
            width: 100%;
			background: #000;
            margin: 3px 0px 0px 0px;
			height: 27px;
			z-index: 50;
        }
        div#search {
        	position: relative;
			top: 5px;
			left: 768px;
            width: 200px;
			margin: 0px 0px 0px 0px;
			padding: 0px 0px 0px 0px;
            text-align: left;
			height: 20px;
        }
        
        .search-cell {
        	background: #0f0;
        }

		div#search a {
			text-decoration: underline;
			color:#F60;
			margin-right: 5px;
		}
		
		div#search a:hover {
			text-decoration: underline;
		}
		
		div#search form {
			margin: 0px 0px 0px 0px;
			padding: 0px 0px 0px 0px;
		}
		
		div#search input {
			height: 15px;
			margin: 0px 0px 0px 0px;
			padding: 0px 0px 0px 0px;
			font-size: 11px;
			border: 0px 0px 0px 0px;
			border-left: #fff solid 0px;
			width: 150px;
			height: 15px;
			background:#fff; 
			text-align:left;
			color:#333;	
			border-color:#777;			
		}
		
		div#search input:focus {
            outline:none;
		}

    /* END HEADER */
    
    
    /* CONTENT */
        div#content {
         	width: 960px;    
            padding: 0px 0px 0px 0px;    
        }
        
        /* MAIN */
            div#main {
            	position: relative;
            	padding: 0px 0px 0px 0px;    
            }
						
			
        /* END MAIN */
        
        /* SUB */
            div#sub {
          	                
            }
			
            div#sub div#followlist {
                border: #666 1px solid;
				margin: 10px 0px 10px 0px;
				width: 298px;
				height: 300px;
				overflow: scroll;
				position:relative;
				display: block;
            }
			
			
			
        /* END SUB */
        
    /* END CONTENT */
    
    
    /* FOOTER */
        div#footer {
            width: 960px;
            clear: both;
            float: left;
             background: white;
        }
        div#footer p {           
            color: white;
            background: #000;
        	           font-size: 0.8em;           
           margin: 0;
           padding: 5px;
        }
    /* END FOOTER */
    
    div#admin-content {
    	padding: 0px 25px 25px 25px;
    }
    
    /* TABLES */
	table#mapList {
	    padding: 0px 0px 0px 0px;
	    margin: 0px 0px 0px 0px;
	    border-right: #ccc 1px solid;
	    border-bottom: #ccc 1px solid;	}
	
	table#mapList td {
		vertical-align:top;
	    padding: 0px 0px 0px 0px;
	    border-left: #ccc 1px solid;
	    border-top: #ccc 1px solid;
	}

	table#userList {
	    padding: 0px 0px 0px 0px;
	    margin: 0px 0px 0px 0px;
	    border-right: #ccc 1px solid;
	    border-bottom: #ccc 1px solid;	}
	
	table#userList td {
		vertical-align:top;
	    padding: 0px 0px 0px 0px;
	    border-left: #ccc 1px solid;
	    border-top: #ccc 1px solid;
	}

	table#user {
	    padding: 0px 0px 0px 0px;
	    margin: 0px 0px 0px 0px;
	    border-right: #ccc 1px solid;
	    border-bottom: #ccc 1px solid;	}
	
	table#user td {
		vertical-align:top;
	    padding: 0px 0px 0px 0px;
	    border-left: #ccc 1px solid;
	    border-top: #ccc 1px solid;
	}

	.separator {
		background: url('../images/dotted.gif') repeat-x left top;
		height: 5px;
	}
	
	/* APPFUSE TABLE STUFF */
	div.exportlinks {
		display: block;
		margin: 0px 0px 10px 10px;
		padding: 2px 4px 2px 0px;
	}
	
	span.pagebanner {
		display: block;
		margin: 10px 0px 0px 10px;
		padding: 2px 4px 2px 0px;
	}
	
	span.pagelinks {
		display: block;
		font-size: .95em;
		margin-bottom: 5px;
		margin-top: -18px;
		padding: 2px 0px 2px 10px;
		text-align: right;
		width: 100%;
	}	
    
	.white {
		position: relative;
		border: #fff 1px solid;
		width: 72px;
		height: 54px;
	}
	
	.white2 {
		position: relative;
		border: #fff 1px solid;
		width: 120px;
		height: 90px;
	}
	
	.thumbnail {
		position:absolute;
		left: 0px;
		top: 0px;
	}
	
	.minus {
		position:absolute;
		left: 1px;
		bottom: 1px;
		height:15px;
	}
	
	.minus a {
		background: url('../images/minus.gif') no-repeat left bottom;
		font-size: 1.5em;
	}
	
	.minus a:hover {
		background: url('../images/minus-hl.gif') no-repeat left bottom;
	}
	
	.plus {
		position:absolute;
		left: 1px;
		bottom: 1px;
		height:15px;
	}
	
	.plus a {
		background: url('../images/plus.gif') no-repeat left bottom;
		font-size: 1.5em;
	}
	
	.plus a:hover {
		background: url('../images/plus-hl.gif') no-repeat left bottom;
	}
	
	.typeOutdoorFollow {
		border: #3b3 1px solid;
		width: 74px;
	}
	.typeRoadFollow {
		border: #c00 1px solid;
		width: 74px;
	}
	.typeWaterFollow {
		border: #55d 1px solid;
		width: 74px;
	}
	.typeAirFollow {
		border: #999 1px solid;
		width: 74px;
	}
	.typeOtherFollow {
		border: #aa0 1px solid;
		width: 74px;
	}
	
	.typeOutdoor {
		border: #3b3 1px solid;
		width: 122px;
	}
	.typeRoad {
		border: #c00 1px solid;
		width: 122px;
	}
	.typeWater {
		border: #55d 1px solid;
		width: 122px;
	}
	.typeAir {
		border: #999 1px solid;
		width: 122px;
	}
	.typeOther {
		border: #aa0 1px solid;
		width: 122px;
	}
	
	.hOutdoor h2 a {
		color: #393;
	}
	.hOutdoor h2 a:hover {
		text-decoration: underline;
	}
	.hRoad h2 a {
		color: #c00;
		text-decoration: none;
	}
	.hRoad h2 a:hover {
		text-decoration: underline;
	}
	.hWater a {
		color: #00d;
	}
	.hWater h2 a:hover {
		text-decoration: underline;
	}
	.hAir a {
		color: #999;
	}
	.hAir h2 a:hover {
		text-decoration: underline;
	}
	.hOther a {
		color: #aa0;
	}
	.hOther h2 a:hover {
		text-decoration: underline;
	}
/* END LAYOUT */

	.typeLRoad {
		border: #c00 1px solid;
		width: 390px;
	}

	.textLRoad a, .textLRoad a:link, .textLRoad a:active, .textLRoad a:visited, .textLRoad a:hover {
		color: #c00;
	}

	.textLRoad span {
		color: #c00;
	}

	.typeLOutdoor {
		border: #393 1px solid;
		width: 390px;
	}

	.textLOutdoor a, .textLOutdoor a:link, .textLOutdoor a:active, .textLOutdoor a:visited, .textLOutdoor a:hover {
		color: #393;
	}

	.textLOutdoor span {
		color: #393;
	}

	.typeLWater {
		border: #00d 1px solid;
		width: 390px;
	}

	.textLWater a, .textLWater a:link, .textLWater a:active, .textLWater a:visited, .textLWater a:hover {
		color: #00d;
	}

	.textLWater span {
		color: #00d;
	}

	.typeLAir {
		border: #999 1px solid;
		width: 390px;
	}

	.textLAir a, .textLAir a:link, .textLAir a:active, .textLAir a:visited, .textLAir a:hover {
		color: #999;
	}

	.textLAir span {
		color: #999;
	}

	.typeLOther {
		border: #aa0 1px solid;
		width: 390px;
	}

	.textLOther a, .textLOther a:link, .textLOther a:active, .textLOther a:visited, .textLOther a:hover {
		color: #aa0;
	}

	.textLOther span {
		color: #aa0;
	}

	.whiteL {
		position: relative;
		border: #fff 1px solid;
		width: 388px;
		height: 291px;
	}
	
	.type-profile {
		border: #999 1px solid;
		margin: 10px 0px 0px 0px;
		padding: 1px 1px 1px 1px;
		width: 220px;
		height: 107px;
		overflow : hidden;
	}

	.type-profile img {
		float: left;
		padding: 0px 5px 0px 0px; 
	}
	
	.download-instructions {
		clear:both;
		background: #e3e3e3;
		margin: 0px 0px 10px 10px;
		padding: 5px 0px 5px 5px;
		width: 544px;
		height: 250px;
		overflow : hidden;
	}
	
	.radioimg {
		margin: 0; 
		vertical-align: middle;
	}
	
	.dllink {
		height:17px;
	}
	
	.dllink a {
		background: url('../images/download.gif') no-repeat left bottom;
		font-size: 1.5em;
	}
	
	.dllink a:hover {
		background: url('../images/download-hl.gif') no-repeat left bottom;
	}
	

	div#text-profile {
		font-size: 85%;
		float: left
		width: 100px;
	}


div#intro {
		float: left;
		padding-right: 0px;
}
	
	div#featured {
		clear: both;
		width: 680px;
		padding: 20px 0px 0px 7px; 
		margin: 18px -23px 0px -23px; 
	}
	
	div#intro-text {
	    position: absolute;
	    right: 5px;
		width: 230px;
		margin: -10px 0px 0px 0px;		
		line-height: 1.1em;
	}

.minimap {
	float: left;
	width: 122px;
	height: 180px;
	margin: 0px 11px 0px 11px;
	}	

.search-minimap {
	float: left;
	width: 600px;
	height: 90px;
	margin: 0px 11px 0px 11px;
	}	

.search-title {
	float: left;
	width: 144px;
	height: 90px;
	margin: 0px 0px 0px 0px;
}	
.search-preamble {
	float: left;
	width: 288px;
	height: 90px;
	margin: 0px 0px 0px 0px;
}	

div#interactive-map {
		margin-top: 20px;
		width: 627px;
		height: 627px;
		border: #666 solid 1px; 
}

div#search-map {
		margin: 5px 0px 10px 0px;
		width: 590px;
		height: 350px;
		border: #666 solid 1px; 
}

div#map-description {
		border: #888 solid 1px;
		border-top: #fff none 0px;
		width: 617px;		
	    padding: 5px 5px 5px 5px; 
}

div#rate {
	height: 40px;
}

div.tabbox {
	clear: both;
	float: left;
	border: #ccc solid 1px;
	width: 580px;
	margin: 10px 0px 0px 0px; 
	padding: 10px 10px 10px 10px; 
	
}

div.tabgbox {
	width: 570px;
	margin: 10px 0px 0px 0px; 
	padding: 5px 5px 15px 5px;
	background: #e3e3e3;
}

div.gboxitem {
	width: 278px;	
	float: left;
	margin: 2px 2px 2px 2px; 
	padding: 0px 0px 0px 0px;
	border-bottom: #ccc 1px solid;
}

div.comments {
	clear: both;
	float: left;
	border: #ccc solid 1px;
	width: 580px;
	margin: 10px 0px 0px 0px; 
	padding: 10px 10px 10px 10px; 
	
}	

div.newcomment {
	width: 570px;
	margin: 10px 0px 0px 0px; 
	padding: 5px 5px 15px 5px;
	background: #e3e3e3;
}

div.newcomment img {
	clear: both;
	float: left;
	padding: 0px 5px 5px 0px;
}

div.newcomment textarea {
	margin: 0px 0px 0px 0px; 
	height: 60px;
	width: 395px;
}

div.newcomment button {
	position: relative;
	left: 0px;
	top: 0px;
}	

div.comment img {
	clear: both;
	float: left;
	padding: 0px 5px 5px 0px;
}

div.comment {
	width: 570px;
	margin: 3px 0px 0px 0px; 
	padding: 5px 5px 18px 5px;
	background: #e3e3e3;
	min-height: 57px;
}
	
div.comment-text {
	margin: 5px 0px 0px 0px; 
}

div.comment-info {
	font-size: 80%;
}

div.reply img {
	clear: both;
	float: left;
	padding: 0px 5px 5px 0px;
}

div.reply {
	width: 495px;
	margin: 3px 0px 0px 75px; 
	padding: 5px 5px 15px 5px;
	background: #e3e3e3;
	min-height: 40px;
}
	
div.reply-text {
	margin: 5px 0px 0px 0px; 
}

div.reply-info {
	font-size: 80%;
}

div.newreply img {
	clear: both;
	float: left;
	padding: 0px 5px 5px 0px;
}

div.newreply {
	width: 495px;
	margin: 3px 0px 0px 75px; 
	padding: 5px 5px 15px 5px;
	background: #e3e3e3;
}

div.newreply textarea {
	margin: 0px 0px 0px 0px; 
	height: 30px;
	width: 360px;
}

div.newreply button {
	position: relative;
	left: 0px;
	top: 0px;
}	

div#map-description img {
	margin-top: 15px; 
	margin-bottom: 15px; 
    padding-left: 15px;
    padding-right: 15px;
    margin-left: auto;
    margin-right: auto;
}

textarea.publish {
	 font-family: "Courier New", Courier, monospace;
     font-size: 0.9em;
     white-space: pre;
     width: 564px;
}
 
select#sel-element {
	font: bold 1.0em Verdana, Geneva, sans-serif;
	font-weight: 600;
	line-height: 1.2em;
	color: #000;
	width: 200px;
}

option#opt-all {
	font-weight: 600;
	color: #000;
}

option#opt-road {
	font-weight: 600;
	color: #c00;
}

option#opt-outdoor {
	font-weight: 600;
	color: #393;
}

option#opt-water {
	font-weight: 600;
	color: #00d;
}

option#opt-air {
	font-weight: 600;
	color: #999;
}

option#opt-other {
	font-weight: 600;
	color: #aa0;
}

.infoText {
	line-height: 1.2em;
	float: left;
	width: 400px;
	padding: 30px;
}