/* 
=========================================================================================
Global
=========================================================================================
*/
body{
	background-color:#ffffff;
	font-size:12px;
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Verdana, Tahoma, sans-serif;
	color: #222;
	text-align:center;
	margin:0 auto;
}
.btn,.btn-green{
	color: #888;
	font-size: 12px;
	line-height:1.15em;
	padding: 12px 18px;
	text-decoration: none;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	-webkit-box-shadow: 0px 1px 0px #999999;
	-moz-box-shadow: 0px 1px 0px #999999;
	text-shadow: 0px 1px 0px #ffffff;
	border: solid #C0C0C0 1px;
	background: #fdfdfd;
	background: -webkit-gradient(linear, 0 0, 0 100%, from(#fdfdfd), to(#e1e1e1));
	background: -moz-linear-gradient(top, #fdfdfd, #e1e1e1);
}	
.btn:hover{
	cursor:pointer;
	background: #ffffff;
	background: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#eeeeee));
	background: -moz-linear-gradient(top, #ffffff, #eeeeee);	
}
.btn-green{
	cursor:pointer;
	color: #444;
	text-shadow: 0px 0px 0px;
	border: solid #4a7e23 1px;
	background: #75c738;
	background: -webkit-gradient(linear, 0 0, 0 100%, from(#75c738), to(#84e13f));
	background: -moz-linear-gradient(top, #75c738, #84e13f);	
}
.btn-green:hover{
	cursor:pointer;
	background: #96ff47;
	background: -webkit-gradient(linear, 0 0, 0 100%, from(#75c738), to(#96ff47));
	background: -moz-linear-gradient(top, #75c738, #96ff47);	
}
.btn.disabled{
	cursor:auto;
	color:#dddddd;
}
.btn-green.disabled{
	cursor:auto;
	color:#888;
	border: solid #b0c7ac 1px;
	background: #cbe5c6;
	background: -webkit-gradient(linear, 0 0, 0 100%, from(#cbe5c6), to(#cbe5c6));
	background: -moz-linear-gradient(top, #cbe5c6, #cbe5c6);		
}
.modal-footer{
	text-align: center;
	clear: both;
	margin-top:10px;
	margin-bottom:10px;
}
/* 
=========================================================================================
Photo crop page
=========================================================================================
*/
h1,.header{
	font-size:16px;
	font-weight:bold;
	padding:0;
	margin:0;
	color:#fff;
	background-color:#444;
	padding-top:5px;
	padding-bottom:5px;
	width:100%;
	margin-bottom:10px;
}
.instructions{
	display:inline-block;
	width:100%;
	margin-bottom:10px;
}
.instructions .disabled{
	display:none;
}
.instructions .messaging{
	float:left;
	margin-left:20px;
	margin-top:12px;
	font-weight:bold;
}
.instructions .btn-container{
	float:right;
	margin-right:20px;
}
#photo-container{
	text-align:center;
	display:inline-block;
	margin:0 auto;
}
.photo-add{
	width:200px;
}
#photo-btns-holder{
	padding-top:20px;
	position:relative;
	width:100%;
	display:inline-block;
	background-color:#bbbbbb;
	padding-bottom:20px;	
}
#photo-btns{
	position:relative;
	width:250px;
	margin:0 auto;
	display:inline-block;
}
#photo-btns button{
	margin-top:5px;
	margin-bottom:5px;
}
#cropper .btn-upload{
	margin:0 auto;
}
#btn-change,#btn-save{
	display:none;
	width:125px;
}
/* 
=========================================================================================
Loading modal
=========================================================================================
*/
#loading-modal #messaging{
	margin-top:25px;
	margin-bottom:25px;
}
/* 
=========================================================================================
Error modal
=========================================================================================
*/
#error-modal #messaging{
	margin-top:15px;
	margin-bottom:15px;
}
/* 
=========================================================================================
Photo select modal (Facebook/Instagram)
=========================================================================================
*/
#photo-select-modal{
	display:inline-block;
	margin:0 auto;
	width:100%;
}
#photo-select {
	width: 448px;
	height: 335px;
	position: relative;
	overflow: hidden;
	margin: 0px auto;
	padding-left: 9px;
	float:left;
}
#photo-select-holder{
	display:inline-block;
	margin:0 auto;
}
#photo-select .cropped,
#photo-select .square {
	height: 101px;
	width: 101px;
	float: left;
	margin-right: 11px;
	margin-bottom: 12px;
	padding: 0 !important;
	position: relative;
	overflow: hidden;
	border: none;
	cursor: pointer;
	cursor: hand;
}
#photo-select .vert img{
	height: 100%;
	top:0;
}
#photo-select .horiz img{
	width: 100%;
	left:0;
}
#photo-select .photoThumb{
	border: solid 4px #fff;
	position: absolute;
	top: 0;
	left: 0;
	width: 93px;
	height: 93px;
	overflow: hidden;
	background: #ddd url("../assets/img/ajax-loader.gif") no-repeat center center;
}
#photo-select .photoactive{
	background-color:#dddddd;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	display: none;
}
#photo-select .active,
#photo-select .photoThumb:hover{
	border: solid 4px #75c738;
}
#photo-select-container{
	display:inline-block;
	margin: 0 auto;
	float:left;
	clear:both;
	padding: 0 10px;
}
#photo-select-container	#pagination .number{
	height:22px;
	line-height:22px;
	float:left;
	padding:0 3px;
	cursor: pointer;
	cursor: hand;
}
#photo-select-container	.left,
#photo-select-container	.right{
	background-repeat:no-repeat;
	width:16px;
	height:32px;
	text-indent: -3000px;
	overflow:hidden;
	cursor: pointer;
	cursor: hand;
	float:left;
	margin-top:167px;
}	
#photo-select-container	.left{
	background: transparent url("../assets/img/pagination-arrows.png") no-repeat 0 0;
}
#photo-select-container .left:hover{
	background: transparent url("../assets/img/pagination-arrows.png") no-repeat 0 -32px;
}
#photo-select-container .left.disabled,
#photo-select-container .left.disabled:hover{
	background: transparent url("../assets/img/pagination-arrows.png") no-repeat 0 -64px;
	cursor: default;
}
#photo-select-container .right{
	background: transparent url("../assets/img/pagination-arrows.png") no-repeat -17px 0;
}
#photo-select-container .right:hover{
	background: transparent url("../assets/img/pagination-arrows.png") no-repeat -17px -32px;
}
#photo-select-container .right.disabled,
#photo-select-container .right.disabled:hover{
	background: transparent url("../assets/img/pagination-arrows.png") no-repeat -17px -64px;
	cursor: default;
}
#photo-select-modal .active{
	display:block;
}

/* 
=========================================================================================
Photo upload page
=========================================================================================
*/
#uploader #btn-upload{
	display:none;
	width:150px;
}
.upload-holder{
	padding-top:15px;
	padding-bottom:18px;	
}
.error,.notice{
	padding: 7px;
}
.error{
	color:red;
}