// Place all the styles related to the notes controller here.
// They will automatically be included in application.css.
// You can use Sass (SCSS) here: http://sass-lang.com/
.note{
	//@include box-shadow(0 0 5px rgba(0,0,0,0.5) inset);
	@include border-radius(5px);
	@include box-shadow(0px 0px 5px rgba(0,0,0,0.5) inset);
	position:relative;
	margin-bottom:1em;
	min-height:120px;
	.left{
		@include box-shadow(0px 0px 5px rgba(0,0,0,0.5));
		@include border-radius(3px 0px 0px 3px);
		position:absolute;
		top:0px;
		left:0px;
		bottom:0px;
		width:100px;
		background:rgba(0,0,0,0.8);
		text-align:center;
		padding:10px;
		
		color:rgba(255,255,255,0.9);
		
		*{
			text-align:center;
		}
		
		.avatar{
			width:70px;
			height:70px;
			@include border-radius(50%);
			margin:auto;
		}
	
	}
	.right{
	min-height:150px;
		margin-left:120px;
			padding:10px;
			line-height:1.1em;
			
			img{
			max-width:100%;
			max-height:99%;
			
			}
			p,ul{
			max-width:600px;
			margin-left:100px;
			
			p,ul{
			margin-left:0px;
			max-width:inherit;
			
			}
			}
			
			.large{
			max-width:100%;
			margin-left:0px;
			
			
			}
		
		.links{
			float:right;
		
		}
	}
	
	.bottom{
		background:rgb(255, 255, 204);
		position:relative;
		margin-left:120px;
		@include border-radius(0px 0px 3px 0px);
		@include box-shadow(0px 0px 2px rgba(0,0,0,0.3),-1px -1px 5px rgba(0,0,0,0.2) inset);
		padding:10px;
		min-height:1em;
		
		.note_file{
			margin:8px 0px;
		}
		
		.note_file_queue{
			position:absolute;
			top:1em;
			right:0em;
		
			.file_upload_progress{
				width:100px;
			
			
			
			}
		
		}
		.note_file_form{
			float:right;
			
			input[type=file]{
				display:none;
			
			}
			label{
				color: #17b;
				cursor:pointer;
				  &:hover, &:active {
				    color: #39e;
				    background-color: none;
				    outline: none; }
				  &:link, &:visited, &:hover {
				    -webkit-transition: all 0.3s ease;
				    -moz-transition: all 0.3s ease;
				    -o-transition: all 0.3s ease;
				    transition: all 0.3s ease; }
				  &:active {
				    color: #b41;
				    -webkit-transition: none;
				    -moz-transition: none;
				    -o-transition: none;
				    transition: none; }
			
			}
		
		}
		
	
	}
	
	
	

}



#file_prev{
	position:absolute;
	top:10px;
	bottom:10px;
	background:rgba(0,0,0,0.9);
	width:98%;
	right:-50%;

	@include border-radius(5px);
	
	@include transition(all 1s ease);
	

	&:hover{

		right:1%;
	
	}
	iframe{
		position:absolute;
		width:96%;
		height:95%;
		top:20px;
		left:0px;
		right:0px;
		bottom:0px;
		margin:auto;
	
	}

}