@CHARSET "UTF-8";

div.body {
	width: 835px;
}

.keyline {
	border: 1px solid #E8EBFA;
	padding: 8px 12px;
}

	.welcome .member-badge {
		float: left;
		width: 325px;
	}
	
	.welcome p {
		margin: 8px 0 0 0;
	}

img.placeholder {
	border: 1px solid #CCC;
	display: block;
}
	img.placeholder.member-photo {
		width: 150px;
		height: 170px;
	}

	
.join-us {
	width: 100%;
}
	.join-us td {
		vertical-align: top;
		padding-top: 15px;
	}
	.join-us td.welcome {
		padding-top: 8px;;
	}
    .join-us td.art-box {
        width: 100%;
        height: 300px;
        
        background-color: black;
        color: white;
    }
    div.body .join-us h1 {
        margin: 1em 0 0.5em 0;
        padding: 3px 8px;
        
        font-size: 10pt;
        font-weight: bold;
        text-align: left;
        
        color: black;
        background-color: #e6ecfa;
    }
    div.body .join-us h2 {
        margin: 0;
        padding: 0 8px;
        
        font-size: 8pt;
        font-weight: normal;
        text-align: left;
        
        color: #555;
    }
.join-us.confirm {
	
}
	.join-us.confirm p {
		margin: 4px 0 0 0;
	}
	.join-us.confirm .input {
		width: 100%;
		text-align: left;
	}
	.join-us.confirm label {
		color: #555;
		line-height: 25px;
		margin: 0 1em 0 0;
	}
	.join-us.confirm input {
		margin: 0 1em 0 0;
	}


.input {
	padding: 6px;
	
	width: 280px;
	
	text-align: right;
}
    .input.text input,
    .input.password input {
        width: 144px;
        
        border: 1px solid #CCC;
    }
    .input label {
		display: block;
		float: left;
		
		white-space: nowrap;
		margin-right: 1.5em;
		line-height: 22px;
		
		color: #555;
	}
		.input.select label,
		.input.date label {
			line-height: 20px;
		}
		
    .input select {
        border: 1px solid #CCC;
    }

    .input.textarea {
        width: 315px;
        margin-bottom: -2px;
        padding-left: 10px;
    }
		.input.textarea textarea {
			font-family: Verdana, sans-serif;
			font-size: 8pt;
			width: 315px;
			border: 1px solid #CCC;
		}

	.input.radio {
		text-align: left;
	}
		.input.radio input  {
			line-height: 20px;
		}
		.input.radio label {
			display: inline;
			float: none;
			margin-right: 0;
			line-height: 20px;
			vertical-align: 1px;
		}
		
    .input.checkbox {
        text-align: left;
        width: auto;
        white-space: nowrap;
        padding: 6px 0;
    }
        .input.checkbox input  {
            margin: 0 0.5em 0 0;
        }
        .input.checkbox label {
            display: inline;
            float: none;
            margin-right: 0;
            line-height: 22px;
            vertical-align: 0px;
        }
    
    .input.file {
	   width: auto;
	   text-align: left;
	   padding: 6px 0;
	}
		.input.file input {
			width: 150px;
		}
	.submit {
		text-align: right;
		padding-right: 3em;
	}
		.submit input {
			font-size: 1.6em;
			font-weight: bold;
			background: url(../img/join/bg-btn-join.png) no-repeat top left;
			color: white;
			
			padding: 0.2em 1em 8px 1em;
			
			border: 0px solid green;
			width: 141px;
			height: 39px;
			
		}

		
	.input .caption {
		padding: 4px 0;
		font-size: 8pt;
	}
	
	
	.input .error-message {
	    font-size: 90%;
	    color: red;
	}
	
.traveller-type {
	width: 350px;
	padding: 0 0 1em 0;
}
    .traveller-type .error-message {
        font-size: 90%;
        color: red;
        padding: 0 10px;
    }
    .traveller-type .input.radio {
        width: 350px;
        height: 50px;
        padding: 0 6px;
    }
    .traveller-type .input.radio span {
        display: block;
        float: left;
        
        padding: 4px 0.7em 0 0;
    }
	.traveller-type .description {
		width: 90%;
		padding: 6px 12px;
		margin-top: 0.5em;
		
		color: #555;
		
		display: none;
		
		clear: both;
	}
		.traveller-type .description.current {
			display: block;
			min-height: 60px;
			//height: 60px;
			height: auto;
		}