.profile-data{
	margin: 27px 0px 2px 0px;
	padding: 0px;
}

/***************************** PHOTO (left) *****************************/
.profile-data .photo-name{
	padding: 45px 20px;
}

.profile-data .photo-name .photo{
	display: inline-block;
	position: relative;
	width: 100px;
	height: 100px;
	border-radius: 50px;
	background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.profile-data .photo-name .photo .edit-photo-icon{
	width: 25px;
	height: 25px;
	position: absolute;
	top: 9px;
	right: 0px;
	background-color: #3181EE;
	border-radius: 12.5px;
	padding: 4px;
	cursor: pointer;
}

.profile-data .photo-name .photo .edit-photo-icon i{
	color: white;
	font-size: 16px;
}

.profile-data .photo-name .name{
	font-size: 20px;
	color: #706B6B;
	letter-spacing: 0;
	margin: 21px 0px 0px 0px;
	padding: 0px;
}

.profile-data .photo-name .account-type{
	font-size: 13px;
	color: #B9B8B8;
	letter-spacing: 0;
	line-height: 15px;
	margin: 4px 0px 0px 0px;
	padding: 0px;
}


/***************************** EDIT FIELDS (right) *****************************/
.profile-data .edit-fields
{
	padding: 37px 40px 36px 40px;
}

.profile-data .edit-fields p{
	font-size: 11px;
	color: #B9B8B8;
	letter-spacing: 0;
	line-height: 15px;
	margin: 0px 0px 4px 0px;
	padding: 0px;
}

.profile-data .edit-fields input{
	width: 100%;
	font-size: 13px;
	color: #706B6B;
	letter-spacing: 0;
	line-height: 15px;
}

.profile-data .edit-fields .email-area{
	padding-left: 0px;
}

.profile-data .edit-fields .email-area input:-moz-read-only{ /* For Firefox */
    font-size: 13px;
	color: #B9B8B8;
	letter-spacing: 0;
	line-height: 15px;
	background: #F2F4F6;
	border: 1px solid #EBEBEB;
	border-radius: 4px;
}
.profile-data .edit-fields .email-area input:read-only{ 
    font-size: 13px;
	color: #B9B8B8;
	letter-spacing: 0;
	line-height: 15px;
	background: #F2F4F6;
	border: 1px solid #EBEBEB;
	border-radius: 4px;
}


.profile-data .edit-fields .phone-area{
	padding-right: 0px;
}

.profile-data .edit-fields .address-area{
	padding: 0px;
	margin: 21px 0px 0px 0px;
}

.profile-data .edit-fields .buttons{
	padding: 0px;
	margin: 24px 0px 0px 0px;
}

.profile-data .edit-fields .buttons .button, #userPhotoModal .button, #changePasswordModal .button, #changePasswordResultModal .button{
	display: inline-block;
	padding: 8px 17px;
	font-size: 11px;
	letter-spacing: 0;
	line-height: 15px;
	cursor: pointer;
}

.profile-data .edit-fields .buttons .button.cancel-button{
	color: #B9B8B8;
	background: #F2F4F6;
	border: 1px solid #EFEFEF;
	border-radius: 4px;
}
.profile-data .edit-fields .buttons .button.cancel-button:hover{
	background-color: #ECECEC;
}

.profile-data .edit-fields .buttons .button.save-button, #userPhotoModal .button.save-button, #changePasswordModal .button.save-button{
	color: #FFFFFF;
	background: #49D158;
	border-radius: 4px;
	margin-left: 10px;
}
.profile-data .edit-fields .buttons .button.save-button:hover, 
#userPhotoModal .button.save-button:hover, 
#changePasswordModal .button.save-button:hover{
	background-color: #39C949;
}

#changePasswordResultModal .button{
	color: #FFFFFF;
	background: #49D158;
	border-radius: 4px;
}

/***************************** MODALS *****************************/
#uploadLoadingModal .modal-body{
	padding: 60px;
}

#uploadLoadingModal .new-user-photo{
	display: inline-block;
	width: 120px;
	height: 120px;
	border-radius: 60px;
	
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

#uploadLoadingModal p{
	margin: 40px 0px;
}

#uploadLoadingModal .uploadProgressBar{
	display: inline-block;
	position: relative;
	width: 100%;
	height: 20px;
	border-radius: 2em;
	background-color: #F2F4F6;
}

#uploadLoadingModal .uploadProgressBar .progress{
	width: 50%;
	height: 100%;
	color: white;
	background-color: #49D158;
	border-radius: 2em;
	text-align: right;
	padding: 0px 10px;
	font-size: 13px;
	
	-webkit-transition: width 0.25s ease-in-out;
	-moz-transition: width 0.25s ease-in-out;
	-o-transition: width 0.25s ease-in-out;
	transition: width 0.25s ease-in-out;
}


#changePasswordModal p{
	font-size: 11px;
    color: #B9B8B8;
    letter-spacing: 0;
    line-height: 15px;
    margin: 20px 0px 4px 0px;
    padding: 0px;
}

#changePasswordModal .button{
	margin: 20px 0px 0px 0px;
}

#changePasswordModal .button.save-button{
	margin-left: 0px !important;
}

/********************* RESPONSIVE *********************/
@media screen and (max-width: 812px) {
	
	.profile-data>div.col-xs-12{
		padding: 0px;
		margin-bottom: 10px;
	}
	
	.profile-data .photo-name, .profile-data .edit-fields{
		padding: 20px;
	}
	
	.profile-data .edit-fields>div.col-xs-12{
		padding: 0px;
		margin: 0px 0px 10px 0px;
	}
	
	.profile-data .edit-fields .buttons{
		margin: 10px 0px 0px 0px !important;
	}
	
	.profile-data .edit-fields .buttons .button{
		width: calc(50% - 5px) !important;
		text-align: center !important;
	}
	.profile-data .edit-fields .buttons .button:first-child{
		margin: 0px 2.5px 0px 0px !important;
	}
	.profile-data .edit-fields .buttons .button:last-child{
		margin: 0px 0px 0px 2.5px !important;
	}
	
	.occurrences_list{
		margin-top: 0px !important;
	}
}


@media screen and (max-width: 768px) {
	.email-area, .address-area{
		padding: 0px !important;
	}
	.phone-area{
		margin: 21px 0px 0px 0px !important;
		padding: 0px !important;
	}
}