/*
 * Menu user buttons
 */
#user-buttons a {
	display: block;
	margin: .8em;
	padding: 1em;
	border: 1px solid #EEE;
	border-radius: .4em;
	-webkit-border-radius: .4em;
	-moz-border-radius: .4em;
	color: white;
	text-align: center;
	/*font-size: .8em; see in layout */
}

#login-button {
	border-color: $gn_color1;
	background-color: $gn_color1;
}

#register-button {
	border-color: $gn_color2;
	background-color: $gn_color2;
}

#login-form {
	font-size: .84em;
	padding: .7em;
	margin: 1em;
	border: 1px solid #EEE;
	border-radius: .4em;
}

#login-form input {
	font-size: 1em;
	padding: .2em;
	margin-right: .3em;
	border: 1px solid #EEE;
	border-radius: .4em;
}

/**
 * Interface modification when user is connected
 */

.user-connected #header {
	padding-top: 0;
}

.user-connected #searchbar {
	margin-top: -1em;
}

.user-login {
	font-weight: bold;
}

/*
 * Logged user box
 */
 #user-account  {
 margin: .3em;
 padding:1rem;
 padding-top: .4rem;
 font-size: 1rem;
 border: 2px solid $gn_color1;
 border-radius: .4em;
}

#user-account h2 {
	font-weight: bold;
	margin: .2em;
	font-size: 1em;
}

#user-account ul {
	margin: 0;
}

#user-account li {
	padding: .3m;
	margin-top: .4em;
	margin-left: .2em;
	font-size: .84em;
}

#user-account .actions {
	padding-top: .5em
}

#user-account a {
	text-decoration: none;
}

#user-account a:hover {
	text-decoration: underline;
}

/**
 * User box is user specific menu 
 */

#user-box {
}

#user-box h2 {
	font-weight: bold;
	font-size: 1rem;
	border-bottom: 1px solid #EEE;
}

#user-box li {
	margin-top: .9rem;
}

#user-box i.fas {
	font-size: 1.3em;
}
#page #user-box h3 {
	margin: .2em 0;
	margin-top: .7rem;
	font-weight: normal;
	font-size: .9rem;
	padding: 0;
}

#user-buttons > p {
 text-align: center;
}

#user-avatar {
	float: left;
	margin: .2em;
}

#user-login {
	text-align: left;
	padding: .3em;
	font-size: .7rem;
}

#user-action {
	text-align: left;
}

#user-action span {
	display: block;
	font-size: .8em;
}

.icon {
 display: inline-block;
 width: 16px;
 height: 16px;
 margin: 0 .2em;
 background: transparent url() left center no-repeat;
 vertical-align: middle;
}

.icon-32 {
	width: 32px;
	height: 32px;
}

.icon-survey { background-image: url(../survey.png)}
.icon-logout { background-image:url(../logout.png)}
.icon-tip { background-image:url(../help-tip.png) }
.icon-help-white { background-image:url(../question-white.png) }
.icon-warning { background-image:url(../warning.png) }
.icon-email { background-image:url(../mail.png)}
.icon-tick { background-image: url(../tick.png) }
.icon-clock { background-image: url(../clock.png) }
.icon-edit { background-image:url(../edit.png) }
.icon-invite {  background-image:url(../mail-air.png) }
.icon-dashboard { background-image:url(../dashboard.png) }
.icon-demo { background-image:url(../demo.png) }

.col-main .avatar {
  display:inline-block;
  height: 32px;
  width: 32px;
  padding-right: .2em;
  vertical-align: middle;
}

/* User pages */
.select-user li {
	padding: .5em .3em;
	list-style-type: none;
}

.select-user li a {
	line-height: 48px;
	padding: 15px .4em;
	border-radius: .4em;
	border: 2px solid white;
}

.select-user li a:hover {
	border-color: $gn_color1;
}

.participant {
	color: $gn_color1;
	font-weight: bold;
}