﻿#detailPageContainer{
	width:100%;

	#titleBar{
		width:100%;
		height:45px;
		background-color:#eeeeee;
		
		#titleText{
			color:#003366;
			font-size:1.8em;
			padding-top:10px;
			padding-left:20px;
		}
	}

	#descInfoContainer{
		width:100%;
		margin-top:5px;
		height:300px;
		color:#003366;
		
		#descImage{
			float:left;
			width:500px;
			height:300px;
		
			img{
				width:100%;
				height:100%;
			}
		}

		#descInfo{
			float:left;
			width:400px;
			padding:20px;
			height:300px;
			
			#summery{
				width:100%;
				font-size:1.4em;
				height:105px;
				word-break: break-all;
			}

			#otherContainer{
				
				.infoContainer{
					width:100%;
					float:left;

					.infoLabel{
						font-size:1.4em;
						float:left;	
						margin-top:3px;
						width:100px;
					}

					.infoValue{
						float:left;	
						margin-left:10px;
						font-size:1.8em;
						color:#FF9900;
					}
				}

				#optionContainer{
					width:100%;
					float:left;
					margin-top:20px;
				
					.optionBtn{
						float:left;
						margin-right:5px;

						button{
							width:110px;
						}
					}
				}	
			}
		}

		#detailInfoContainer{
			margin-top:20px;
			float:left;
			width:100%;

			.nav-tabs{
				border-bottom: 1px solid #cccccc;
			}

			.nav-tabs>li.active>a{
				color:#ffffff;
				background-color:#336699;
				cursor:default;

				&:hover{
					background-color:#336699;
					color:#ffffff;	
				}	
			}

			.nav-tabs>li>a{
				background-color:#cccccc;
				cursor:pointer;
				color:#336699;
				
				&:hover{
					background-color:#bbbbbb;
					color:#336699;	
				}	
			}

			.tabContainer{
				width:100%;
				padding:20px;
				word-break: break-all;
			}
		}
	}
}