@font-face {
	font-family: "Supreme";
	src: url("../fonts/Supreme-Regular.otf") format("opentype");
	font-weight: normal;
	font-style: normal;
}

@font-face {
    font-family: "Supreme";
    font-weight: bold;
    src: url("../fonts/Supreme-Bold.otf") format("opentype");
}

html, body {
   height: 100%;
}

body {
	background-color:#f4f4f4;
	font-family:"Supreme","Lucida Sans Unicode", "Lucida Grande", sans-serif;
	}



.button-post {
	font: bold 1em;
	text-decoration: none;
	background-color: #EEEEEE;
	color: #333333;
	padding: 1em 2em;
	border-top: 1px solid grey;
	border-right: 1px solid grey;
	border-bottom: 1px solid grey;
	border-left: 1px solid grey;
	text-align:center;
}


/* LOGO */
#logo {
	height : 1em;
}

@media (min-width: 767px) {
	#logo {
		height : 2.5em;
	}
}


/**************************/
/* Common styles   */
/**************************/

.toggler-wrapper {
  display: block;
  width: 45px;
  height: 25px;
  cursor: pointer;
  position: relative;
}

.toggler-wrapper input[type="checkbox"] {
  display: none;
}

.toggler-wrapper input[type="checkbox"]:checked+.toggler-slider {
  background-color: #7fb700;
}

.toggler-wrapper .toggler-slider {
  background-color: #ccc;
  position: absolute;
  border-radius: 100px;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-transition: all 300ms ease;
  transition: all 300ms ease;
}

.toggler-wrapper .toggler-knob {
  position: absolute;
  -webkit-transition: all 300ms ease;
  transition: all 300ms ease;
}

.toggler-wrapper.style-1 input[type="checkbox"]:checked+.toggler-slider .toggler-knob {
  left: calc(100% - 19px - 3px);
}

.toggler-wrapper.style-1 .toggler-knob {
  width: calc(25px - 6px);
  height: calc(25px - 6px);
  border-radius: 50%;
  left: 3px;
  top: 3px;
  background-color: #fff;
}

/**************************/
/* End of common styles   */
/**************************/

/******************/
/* QUICK Session list   */
/******************/
div.quicksession {
	margin: 0 auto 0.5em auto;
	background-color: rgba(196,196,196,0.2);
	border: 1px solid rgba(176, 15, 7, 0.7);
	width: 40%;
	padding: 1em;
	text-align: center;
	color: #2e2e2e;
	}
@media (max-width: 767px) {
	div.quicksession {
	width: 90%;
	margin : 0 5% 0 5%;
		}
	}
div.quicksession a:hover{
	color: #2e2e2e;
	}

span.quicksession-datetime {
	font-weight:bold;
	}

span.quicksession-infos {
	display : block;
	font-size : 0.7em;
	}

/******************/
/* Session list   */
/******************/
div#sessions {width:95%;margin:0 auto;}

div.session {
	margin-bottom : 1em;
	overflow:auto;
	width:100%;
	background-color:#eaeaea;
	padding: 0.5em 1em;
	margin-left:0.5em;
	box-shadow: 5px 5px 3px #aaaaaa;
}

@media (max-width: 767px) {
	div.session {margin-left:0em;}
	div#sessions {width:100%;margin:0;}
}
@media (min-width: 767px) {
	div.session.full {
		float:left;
		width:100%;
	}
	div.session {
		float:left;
		width:32%;
	}
}
.session-desc {
	background-color : rgba(196,196,196,0.2);
	/*border-radius : 0.5em;*/
	padding : 0.5em 1em;
	width:100%;
	float:left;}

/*
@media (min-width:767px) {
	.session-desc {
		margin-right: 2em;
	}
}
@media (max-width:767px) {
	.session-desc {
		width:100%;
	}
}
*/


/* Session title container */
.session-title-container {
	padding:0em 1em;
	/*border-radius: 0.2em;*/
	color:white;
	background-color:#343a40;
	font-weight:bold;
	min-height:1.5em;
	font-size:1.5em;
	text-align:center;
	width:100%;
}
/*
@media (min-width:767px) {
	.session-title-container {
		font-size:1.8em;
		width:100%;
		margin-bottom:0.1em;
		text-align:center;
		}
}
@media (max-width:767px) {
	.session-title-container {
		font-size:1em;
		text-align:center;
	}
}
*/

.session-canceled-container {
	padding:0em 1em;
	/*border-radius: 0.2em;*/
	color:white;
	background-color:red;
	font-weight:bold;
	min-height:1.5em;
	text-align : center;
}
@media (min-width:767px) {
	.session-canceled-container {
		font-size:1.8em;
		width:100%;
		margin-bottom:0.1em;
		float:left;
		}
}
@media (max-width:767px) {
	.session-canceled-container {font-size:1em;}
}



.session-plus-wrapper {	background: rgba(176, 15, 7, 0.7);float:left;padding:0.1em 0.3em;}
.session-share-wrapper {background: rgba(176, 15, 7, 0.7);float:left;padding:0.1em 0.3em;}

div.fulleventlink {width:100%;background:rgba(176, 15, 7, 0.7);padding:0.3em;text-align:center;font-size:2em;color:white;}
div.fulleventlink a {text-decoration:underline;color:white;}
div.fulleventlink a:hover {text-decoration:underline;color:white;}
div.fulleventlink a:visited {text-decoration:underline;color:white;}

@media (max-width:767px) {.session-plus-wrapper {transform:scale(0.8,0.8);}}
@media (max-width:767px) {.session-share-wrapper {transform:scale(0.8,0.8);}}

/* / Session title container */	
@media (min-width:767px) {div.session.full .session-image-container img{width:30%;}}
.session-image-container {text-align:center;}
.session-image-container img {width:100%;}
/*@media (max-width:767px) { .session-image-container img {width:6em;clear:both;max-width: 100%;max-height: 30%;display:block;margin:auto;}}*/

#sessions .datetime {
	font-weight:bold;
	font-size: 1em;
	color: black;
	padding: 0.5em 1em;
	text-align: center;
	position: relative;
	top: 75%;
	right: 0px;
	width: 70%;
	background-color: #ffffffe8;
	float: right;
	}
/*
@media (max-width:767px) {
	#sessions .datetime {
		max-width:100%;
		text-align: center;
		margin : 0 auto;
	}
}

@media (min-width:767px) {#sessions .datetime {float:left;}}
*/




/* Session data container */

/*@media (min-width:767px) {.session-data-container {float:left;max-width:70%;}}*/
.session-data-container {width:100%;}

/* Collapsable div 1 */
.session-collapse-1 {clear:both;}
.session-desc-meta-inf-title {clear: both;background: #dfdddd none repeat scroll 0 0;color: #383838;padding: 0.5em;text-shadow: 1px 1px #fff;width: 100%;margin-top : 0.2em;}
.session-desc-meta-inf-content a {text-decoration:underline;}
.session-desc-meta-inf-content {margin-top:0.5em;clear:both;width:59%;padding : 0.2em 1em 0.2em 2em;background-color:#f4f4f4;}
.session-aside-container {margin-top:0.5em;padding : 0.5em;width:40%;background-color:#f4f4f4;}
@media (min-width:767px) {.session-desc-meta-inf-content {float:left;}}
@media (min-width:767px) {.session-aside-container {margin-left:0.5em;float:left;}}
@media (max-width:767px) {.session-aside-container {clear:both;width:95%;}}
@media (max-width:767px) {.session-desc-meta-inf-content {clear:both;width:95%;}}
/* Collapsable div 2 (share button) */
.share-button {clear:both;}
.share-button .share-input {width: 100%;}
/* Div count attendee */

.template-count-attendees {width:100%;background: #dfdddd none repeat scroll 0 0;color: #383838;padding: 0.5em;text-shadow: 1px 1px #fff;text-align:center;}
@media (max-width:767px) {.template-count-attendees {width:100%;clear:left;text-align:center;}}

.template-comment {padding : 0.2em 1em;color:black;background-color:#d4d4d4;}
@media (max-width:767px) {.template-comment {text-align:center;}}
/* Animator infos */
.animator-name {clear:both;
background: #dfdddd none repeat scroll 0 0;
border-radius: 4px;
color: #383838;
padding: 5px;
text-shadow: 1px 1px #fff;}
.animator-comment {padding : 0.2em 1em;color:black;background-color:#d4d4d4;}
@media (max-width:767px) {
	.animator-name {text-align:center;}
	.animator-comment {text-align:center;}
	}

input.sessionlist-button {width:100%;border : 1px solid #e1e1e1; background-color:rgba(176, 15, 7, 0.7);margin:0.3em;padding:0.5em 0em;}
input.sessionlist-button.take, input.sessionlist-button.release {background-color:background-color:rgba(176, 15, 7, 0.7);color:white;font-weight:bold;}
input.sessionlist-button.cancel {background-color:rgba(100, 100, 100, 0.7);color:white;}
input.sessionlist-button.modify {background-color:#ffc65f;}
input.sessionlist-button.restore {background-color:#ffe65f;}
/* Take animation form */

.sessionlist_button_hidden_input { display:none;}
.sessionlist_button {clear:both;}
/* / Take animation form */

/* Attendee List */
@media (max-width:767px) {
	.attendeeslist {
		width:100%;
		text-align: center;
	}
}

.attendeeslist {
	padding-top : 2em;
	clear:both;
	float:left;
	/*text-align:center;*/
	background-color : rgba(196,196,196,0.2);
	border-radius : 0.5em;
	padding : 0.5em 1em;}

a.moreinfobutton {/*height:100%;*/width:100%;display:block;}
/*.attendeeslist span {color : white; border-radius : 0.3em;padding-left: 0.5em;padding-right: 0.5em;}
.attendeeslist .TITLE {background-color:rgba(176, 15, 7, 0.7);}
.attendeeslist .WAIT4CONFIRM {background-color : rgb(176, 15, 7);}
.attendeeslist .CONFIRMED {background-color : orange;}
.attendeeslist .PAID {background-color : rgb(31, 133, 0);}
*/

.count-attendees {color: #8F8F8F;}

@media (max-width:767px) {

	.count-attendees {width:100%;text-align:center;}

}
/* Attendee List Admin form */
form.newstate {display: inline;}

form.newstate input.attendee_id {
	display:none;
}

/* Register form */
form.register {padding-top:0.5em;}
/* NEW registration form */
form.register input.email{
  /*font-family: 'Ubuntu', sans-serif;*/
  display: block;
  padding: 0.5em;
  border: none;
  font-size: 1.3em;
}

form.register input.sessionlist-captcha-input{padding:0.3em 0.5em;}

/* Question */

.register input.email,
.register textarea.email {
  font-size: 24px;
  font-weight: 300;
  margin: 0;
  border: 1px solid #e1e1e1;
  width: 100%;
  background-color:rgba(176, 15, 7, 0.7);
  color:white;
}
/* Underline and Placeholder
.register input.email + label,
.register textarea.email + label
	{
	display: block;
	position: relative;
	white-space: nowrap;
	padding: 0;
	margin: 0;
	width: 10%;
	border-top: 1px solid red;
	-webkit-transition: width 0.4s ease;
	transition: width 0.4s ease;
	height: 0px;
}

.register input.email:focus + label,
.register textarea.email:focus + label {
	width: 80%;
}

.register input.email:focus,
.register input.email:valid {
  padding-top: 18px;
}

.register textarea.email:valid,
.register textarea.email:focus {
  margin-top: 18px;
}

.register input.email:focus + label > span,
.register input.email:valid + label > span
{
  top: -60px;
  font-size: 11px;
  color: #333;
}

.register input.email:valid + label,
.register textarea.email:valid + label {
  border-color: green;
}

.register input.email:invalid,
.register textarea.email:invalid {
  box-shadow: none;
}


.register input.email + label > span,
.register textarea.email + label > span {
  font-weight: 300;
  margin: 0;
  position: absolute;
  color: #8F8F8F;
  font-size: 2em;
  top: -40px;
  left: 0px;
  z-index: -1;
  -webkit-transition: top 0.2s ease, font-size 0.2s ease, color 0.2s ease;
  transition: top 0.2s ease, font-size 0.2s ease, color 0.2s ease;
  background-color : white;
  padding: 0em 0.5em;
}

@media (max-width:767px) {
	.register input.email + label > span,
	.register textarea.email + label > span {
	font-size: 1em;
	}
}
.register input[type="submit"] {
  -webkit-transition: opacity 0.2s ease, background 0.2s ease;
  transition: opacity 0.2s ease, background 0.2s ease;
  display: float;
  opacity: 0;
  margin: 10px 0 0 0;
  padding: 10px;
  cursor: pointer;
  border: 1px solid grey;
}

@media (max-width:767px) {
	.register input[type="submit"] {
		width: 100%;
	}

}

.register input[type="submit"]:hover {
  background: #EEE;
}

.register input[type="submit"]:active {
  background: #999;
}

.register input.email:valid ~ input[type="submit"], .register textarea.email:valid ~ input[type="submit"] {
  -webkit-animation: appear 1s forwards;
  animation: appear 1s forwards;
}

.register input.email:invalid ~ input[type="submit"], .register textarea.email:invalid ~ input[type="submit"] {
  display: none;
}

@-webkit-keyframes appear {
  100% {
    opacity: 1;
  }
}

@keyframes appear {
  100% {
    opacity: 1;
  }
}

*/
/* / NEW register form

/* Captcha form */
/*
.register input.email:valid ~ .sessionlist-captcha {
	-webkit-animation: appear 1s forwards;
	animation: appear 1s forwards;
	}
.register input.email:invalid ~ .sessionlist-captcha {
	display: none;
}
*/
.sessionlist-captcha input {
	/*text-align:center;*/
	display:inline;
	}

@media (max-width:767px) {
	.sessionlist-captcha {
	width:100%;
	text-align:center;
	/*display:inline;*/
	}
}

.sessionlist-captcha input {
	border : 1px solid grey;
	/*display:inline;*/
}

.captcha-label {
	margin:0px;
	font-size: 11px;
	color: #8F8F8F;
	margin:0.5em 0;
}


/* Buttons */

form.register input.submit-email {width:100%;border : 1px solid gray;padding:0.5em;margin-top:0.5em;}
div.buttons-wrapper {margin-top : 0.5em;}

/* Notifications */
@media (min-width:767px) {
	div.message {
		left : 32%;
		width : 32%;
	}
}
@media (max-width:767px) {
	div.message {
		left : 0%;
		width:100%;
	}
}

div.message {
	display:none;
	margin : 0 auto;
	padding:0.5em;
	top : 0px;
	position:absolute;
	/*border-radius : 0em 0em 1em 1em;*/
	color: white;
	text-align:center;
	z-index: 10;
}

div.message.infos {
	background-color: #0a84bd;
}
div.message.warnings {
	background-color: #ecbd00;
}
div.message.errors {
	background-color: #8a1b17;
}
div.message .emoji{
font-size: 3em;
text-align: center;
}

div.message .hidemessagebutton {border : 1px solid white; padding : 0.5em 1em;margin-top:1em;}

/*LOGIN Form CSS */
/* Mask for background, by default is not display */
#mask {
    display: none;
    background: #000;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 10;
    width: 100%;
    height: 100%;
    opacity: 0.8;
    z-index: 999;
}

.login-popup {
    display: none;
    background: #ccc;
    padding: 10px;
    border: 2px solid rgb(176, 15, 7);;
    float: left;
    font-size: 1.2em;
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 99999;
    box-shadow: 0px 0px 20px #999;
    /* CSS3 */
        -moz-box-shadow: 0px 0px 20px #999;
    /* Firefox */
        -webkit-box-shadow: 0px 0px 20px #999;
    /* Safari, Chrome */
	border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px;
    /* Firefox */
        -webkit-border-radius: 3px;
    /* Safari, Chrome */;
}

img.btn_close {
    /*Position the close button*/
float: right;
margin: -28px -28px 0 0;
}

fieldset {
    border: none;
}

form.signin .textbox label {
    display: block;
    padding-bottom: 7px;
}

form.signin .textbox span {
    display: block;
}

form.signin p, form.signin span {
color : rgb(176, 15, 7);
    font-size: 11px;
    line-height: 18px;
}

form.signin .textbox input {
    background: #666666;
    border-bottom: 1px solid #333;
    border-left: 1px solid #000;
    border-right: 1px solid #333;
    border-top: 1px solid #000;
    color: #fff;
    border-radius: 3px 3px 3px 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    /*font: 13px Arial, Helvetica, sans-serif;*/
    padding: 6px 6px 4px;
    width: 200px;
}

form.signin input:-moz-placeholder {
    color: #bbb;
    text-shadow: 0 0 2px #000;
}

form.signin input::-webkit-input-placeholder {
    color: #bbb;
    text-shadow: 0 0 2px #000;
}

.button {
    background: -moz-linear-gradient(center top, #f3f3f3, #dddddd);
    background: -webkit-gradient(linear, left top, left bottom, from(#f3f3f3), to(#dddddd));
    background: -o-linear-gradient(top, #f3f3f3, #dddddd);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f3f3f3', EndColorStr='#dddddd');
    border-color: #000;
    border-width: 1px;
    border-radius: 4px 4px 4px 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    color: #333;
    cursor: pointer;
    display: inline-block;
    padding: 6px 6px 4px;
    margin-top: 10px;
    font: 12px;
    width: 214px;
    text-align:center;
}

.button:hover {
    background: #ddd;
    text-decoration : none;
    color: #333;
    text-align:center;
}

.login-buttons {
	position:absolute;
	top:0%;
	right:0%;
	margin: 1em;
}

.login-window {
	/*padding: 1em;*/
	/*background: rgb(176, 15, 7);*/
	background: rgba(176, 15, 7, 0.7);
	display:inline;
	color:white;
	font-size:2em;
	}

.logout-window {
	/*padding: 1em;*/
	background: rgb(176, 15, 7);
	background: rgba(176, 15, 7, 0.7);
	display:inline;
	color:white;
	font-size:2em;
	}

.close.icono-cross {	
	background: rgb(176, 15, 7);
	background: rgba(176, 15, 7, 0.7); 
	}

/* / LOGIN FORM CSS */


/** SELECT BOX ***/
#sessions-title-filter {
	border: 1px solid #ccc;
	width: 100%;
	border-radius: 3px;
	overflow: hidden;
	padding: 0.5em;
	font-weight: bold;
	/*background: #fafafa url("img/icon-select.png") no-repeat 90% 50%;*/
}

#sessions-title-filter select {
	width:100%;
	border: none;
	box-shadow: none;
	background: transparent;
	background-image: none;
	-webkit-appearance: none;
	margin : 0 auto;
	text-align:center;
}

#sessions-title-filter select:focus {
	outline: none;
}
/* / SELECT BOX */

/* Footer */
#attendeefooter {color:grey;font-size:0.7em;text-align:center;clear: both;}
#attendeefooter a{color:grey;text-decoration:none;}
#attendeefooter a:hover {color : grey;text-decoration:underline;}
#attendeefooter a:visited {color : grey;text-decoration:none;}


/****** CALENDAR VIEW ********/
.calendar-wrapper {
   	max-width: 80%;
	height:100vh;
	margin: 0 auto;
}

@media (max-width:767px) {
	.fc button {font-size: 0.5em;}
	.fc-toolbar.fc-header-toolbar {margin-bottom: 0em;}
	.fc-toolbar.fc-header-toolbar h2 {font-size:0.7em;}
}


.calendar-recommandations {text-align:center;width:100%;font-weight:bold;}

/******** SCHEDULE/PLACES VIEW ********/

#schedule span.schedule-wrapper.content input.session-title, #places span.places-wrapper input.place-title {width:50%;}
#schedule span.schedule-wrapper.content, #places span.places-wrapper.content {margin:0 auto; width : 75%; margin-bottom:1em;}
#schedule span.schedule-wrapper.title, #places span.places-wrapper.title {font-weight:bold;}
#schedule span.schedule-wrapper,#places span.places-wrapper {display:block;width:100%;text-align:center;}

#schedule span.schedule-wrapper textarea,#places span.places-wrapper textarea{position: relative;}

div.schedule-new-button-wrapper {margin:0 auto; width : 50%; margin-bottom:1em;text-align:center;}

#places .disabled-place {background-color:#5b0010;color:white;padding:0 5em;}

/*#schedule .schedule-wrapper.content .jqte {margin-top:0;}*/

#schedule .schedule-wrapper.content-editor .ck-content {height : 20em;}

#schedule .schedule-wrapper.content-editor .ck-source-editing-area {height : 20em;}
#schedule .schedule-wrapper.content-editor .ck-source-editing-area textarea {height : 20em;}

#schedule input.grey {background-color:#aaa;}

/******** ATTENDEE VIEW & PROFILE VIEW & STATS VIEW ********/
div.userspace-wrapper {max-width:100%;width:50%;margin : 0 auto;}
div.userspace-wrapper .subtitle {align-items: center;font-size:2em;display:flex;height:3em;width:100%;text-align:center;background-color:#efefef;border-radius:0.3em;color:black;margin-top:1em;font-weight:bold;}
div.userspace-wrapper .subtitle div {  width:100%;}

.bgwhite {background-color : white;}
.attendee-stats-title, .global-stats-title, .attendee-tpl-title { display:block;width:100%;text-align:center;background-color:#8a1b17;color:white;}
.attendee-stats-subtitle, .global-stats-subtitle, .attendee-tpl-subtitle {display:block;width:50%;margin:0 auto;max-width:100%;text-align:center;background-color:#dfdddd;color:black;}
.attendee-stats-table, .global-stats-table, .attendee-tab-table {margin:0 auto;text-align:center;margin-bottom:1em;}
.attendee-stats-table th,  .global-stats-table th, .attendee-tab-table th {background-color:#8a1b17;color:white;padding:0.3em 1em;}
.attendee-stats-table td, .global-stats-table td, .attendee-tab-table td {background-color:#343a40;color:white;padding:0.3em 1em;}

.global-stats-table td.total {background-color:grey;color:black;}
.global-stats-table td.totalyear {background-color:#8a1b17;color:white;}

.global-stats-form-wrapper { display:block;width:100%;text-align:center;}

.profile-submit, .profile-description, .profile-password, .profile-address {text-align:center;}

.dolibarr {text-align:center;font-weight:bold;}
.dolibarr.valid {background-color:#17818a;color:white;}
.dolibarr.invalid {background-color:#8a1d17;color:white;}
.dolibarr.error {background-color:black;color:white;}

#attendee-tabs-1{font-size: 14px;color: rgba(176, 15, 7, 0.7);}
.ui-widget-header {
	background:transparent;
	border-bottom: 1px solid rgba(176, 15, 7, 0.7);
        border-top:none;
        border-right:none;
        border-left:none;}

span.userspace-starred-skills {display: inline-block;margin-left:1em;text-align:center;vertical-align:middle;}


/*********** TABS ********************/


/*#attendee-tabs-1 .ui-state-default a,#attendee-tabs-1 .ui-state-default a:link,#attendee-tabs-1 .ui-state-default a:visited {color:rgba(176, 15, 7, 0.7);}*/
#attendee-tabs-1 .ui-state-default a,#attendee-tabs-1 .ui-state-default a:link,#attendee-tabs-1 {color:rgba(176, 15, 7, 0.7);}
#attendee-tabs-1 .ui-state-active a,#attendee-tabs-1 .ui-state-active a:link,#attendee-tabs-1 .ui-state-active, #attendee-tabs-1 .ui-state-active a:visited {font-weight:bold;background-color: rgba(176, 15, 7, 0.7);background-image:none;color:white;}
#attendee-tabs-1 .ui-state-default,#attendee-tabs-1 .ui-widget-content .ui-state-default,#attendee-tabs-1 .ui-widget-header .ui-state-default {color:rgba(176, 15, 7, 0.7);background-color:white;background-image:none;}


/*********** LDAPADMIN VIEW - TAG : RBAC ********************/

div.ldapadmin-wrapper {max-width:100%;width:75%;margin : 0 auto;}
div.ldapadmin-wrapper .subtitle {align-items: center;font-size:2em;display:flex;height:3em;width:100%;text-align:center;background-color:#efefef;border-radius:0.3em;color:black;margin-top:1em;font-weight:bold;}
div.ldapadmin-wrapper .subtitle div {  width:100%;}

#attendee-tabs-3 select.NONE {background-color:red;color:white;}
#attendee-tabs-3 select.USER {background-color:green;color:white;}
#attendee-tabs-3 select.MANAGER {background-color:orange;color:white;}
#attendee-tabs-3 select.ADMIN {background-color:blue;color:white;}


/*********** USER STATS VIEW ********************/

#users-stats-table td.red {background-color:#c15a57;}
#users-stats-table td.green {background-color:#71c157;}


/*********** SKILLS ********************/
.global-stats-table tr td.cat {background-color:#d4d4d4; padding: 0 1em; color:black;}
.attendee-skills-buttons {width:50%;margin:0 auto;}
.attendee-skills-buttons input[type="submit"], #profile-submit{
width: 100%;
border: 1px solid #f99;
padding: 1em;
background: #8a1b17;
color: white;
font-weight: bold;
}
#attendee-skills {min-width:50%;}
/*********** END OF SKILLS ********************/

/*********** USERSPACE ********************/

@media (max-width:767px) {
	.offline-notification {width:100%;}
}
@media (min-width:767px) {
	.offline-notification {width:50%;}
}
.offline-notification {
	margin: 0.5em auto 0 auto;
	text-align: center;
	color: rgba(176, 15, 7, 0.7);
	/*font-family: "Roboto Slab",serif;*/
	letter-spacing: 0;
	/*font-weight: 700;*/
	font-size: 1.3em;
	border : 1px solid #d0d0d0;
	padding :1em;
}


/*********** END OF USERSPACE ********************/

/******** DOLISTOCK VIEW ********/

#dolistock {
	/*border:1px solid grey;*/
	margin : 0 auto;
	width : 50%;
}

#dolistock .image-and-description {background-color:white;}

#dolistock .price {background-color:#d4d4d4; padding: 0 1em;}

#dolistock .delimiter {padding:0.3em; /*background-color:#d4d4d4;*/ background-color:inherit;}

#dolistock .image {text-align:center;}

#dolistock .label {color:white;background-color:#8a1b17;padding: 0.5em 1em;}

#dolistock .description {border-radius:0.5em;color:grey;background-color:white;}

/******** NEWMEMBER VIEW ********/

#member-search { 
	width: 50%;
	margin: 0 auto;
	text-align: center;
	color:grey;
	margin:0;}

#member-search .pure-controls {margin:0;}

#member-search .pure-button-primary, .pure-button-selected, a.pure-button-primary, a.pure-button-selected {background-color : #8a1b17;}
#member-subscribe .pure-button-primary, .pure-button-selected, a.pure-button-primary, a.pure-button-selected {background-color : #8a1b17;}
/*#member-renew  .pure-button-primary, .pure-button-selected, a.pure-button-primary, a.pure-button-selected {background-color : #8a1b17;}*/

#member-search #newmember-welcome-message,
#member-result,
#member-result {
	background: #8a1b17;
	margin: 1em 0;
	padding: .3em 1em;
	border-radius: 3px;
	color: #fff;
	width:50%;
	margin : 0 auto;
	text-align:center
}

@media (max-width:767px) {
	#member-search #newmember-welcome-message,
	#member-result,
	#member-result {
		width:100%;
	}
}



#member-result .pure-controls,
#member-subscribe .pure-controls {
	margin: 1.5em 0em 1.5em 0em;
}

#member-subscribe .error {
	background-color: red;
	}

#member-subscribe, #member-renew {
	text-align:center;
	width: 50%;
	margin : 0 auto;
}

@media (max-width:767px) {
#member-subscribe, #member-renew {
	width: 100%;
	}
}

#member-subscribe .disclaimer, #member-subscribe .explanation {padding : 1em 0;font-size : 0.8em;}


/* NAV LINKS */
ul.navbar-nav {padding-right:0em;}
.nav-item a.help {border : 1px solid white;font-weight:bold;color:white;}
.nav-link {text-align:center;}
.navbar-nav .nav-link {padding: 0.5em;}
.dropdown-menu {background-color:#4c555e;min-width: 20rem;}

@media (min-width:767px) {
	div#main-login {position: absolute;right: 0.5em;}
	}
@media (max-width:767px) {
	div#main-login {text-align: center;}
	}
/* \ NAV LINKS */

/* HELP MODAL */

.help-title {
	background-color: rgba(176, 15, 7, 0.7);
	color: white;
	margin: 2em;
	padding: 1em 1em;
	font-weight: bold;
	text-align: center;
}
/* \ HELP MODAL */


/* ARTINDER */
.artinder-container {margin-top:1em;width:50%;text-align:center;margin:1em auto;float:left;}
@media (max-width:767px) {.artinder-container {margin-top:1em;width:100%;text-align:center;margin:1em auto;}}

.search-user-input {
	padding : 0.3em 1em;
	background-color:white;
	/*border-radius: 0.5em;*/
	font-size: 1.3em;
	border: 3px solid #555;
}
.search-user-submit {
padding : 0.3em 1em;
border : 4px solid #8a1b17;
background-color: #bd3131;
color: white;
font-size: 1.3em;
}
.artinder-logo {width : 20%;}
.artinder-subtitle {font-style:italic;}
#selected-skills-id-list {margin: 1em 0em;}
.selectedskill {
	display: inline-block;
	border : 1px solid #c0c0c0;
	padding:0.5em 1em;
	margin:0em 0.5em;
	word-wrap: break-word;
	max-width: 20em;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}
.selected-skillid {display:none;}
.artinder-result {font-size : 3em;}
/* \ ARTINDER */


/** FORBIDEN **/

.forbidden {padding : 1em; color:#343a40; width:80%; margin:1em auto; text-align:center;border : 3px solid #343a40;font-weight:bold;}
/** \ FORBIDEN **/


/** NEW DOLISTOCK **/

div#products {width:95%;margin:0 auto;}

div.product.clear-both {clear:both;} /* unused since flex */

div.product {
	margin-bottom : 1em;
	overflow:auto;
	width:100%;
	background-color:#eaeaea;
	padding: 0.5em 1em;
	margin-left:0.5em;
	/*min-height:50%;*/
}


@media (min-width:767px) {
	div.products-flex-line {display:flex;}
	}

@media (max-width: 767px) {
	div.product {margin-left:0em;}
	div#sessions {width:100%;margin:0;}
}
@media (min-width: 767px) {
	div.product {
		/*float:left;*/
		width:23%;
	}
}
.product-desc {
	background-color : rgba(196,196,196,0.2);
	/*border-radius : 0.5em;*/
	padding : 0.5em 1em;
	width:100%;
	float:left;}

/* Session title container */
.product-title-container {
	padding:0em 1em;
	/*border-radius: 0.2em;*/
	color:white;
	background-color:#343a40;
	font-weight:bold;
	min-height:1.5em;
	font-size:1.5em;
	text-align:center;
	width:100%;
}

.product-subtitle {width:100%;background: #dfdddd none repeat scroll 0 0;color: #383838;padding: 0.5em;text-shadow: 1px 1px #fff;text-align:center;}

.product-image {text-align: center;}

div#template-information {
	padding: 1em;
	text-align: center;
	text-align: center;
	color: #323232;
	/*font-family: 'Montserrat', sans-serif;*/
	font-size: 1em;
	font-weight: 600;
	}


/** \ NEW DOLISTOCK **/


/** USERMAP **/

#map.fullpage {
	min-height:80%;max-height:100%;width:100%;
}
#map.search {min-height:70%;max-height:100%;width:48%;}
@media (max-width:767px) {#map.search {min-height:70%;max-height:100%;width:100%;}}


/** / USERMAP **/


/** LETTER **/

#letters {min-width:10%;max-width:20%;float:left;padding:0em 0.5em;margin-right:1em;}
#letterwrapper {width:70%;float:left;}

#letter-content {background-color:white;}
#letter-content .table {margin:0 auto;}
#letterwrapperdisplay .table {width:auto;}

#letter-display {margin:0 auto;}

#letterwrapperdisplay {width:100%;}

#letters span.letters-leftspan a{
text-decoration:none;
overflow: hidden;
display: inline-block;
white-space: nowrap;
width: 80%;
text-overflow: ellipsis;}

#letters span.letters-leftspan span.leftmenu-namewrapper {overflow: hidden;width: 70%;text-overflow: ellipsis;float: left;}

#letters span.letters-leftspan {
	clear:both;
	margin-top:0.2em;
	display:block;
	padding:0.7em 1em;
	background-color:#f7f7f7;
	color:black;
	border-radius:0.5em;
	border:1px solid #d2d2d2;
	height: 3em;
	}


#letters span.letters-leftspan:hover {background-color:#ebebeb;box-shadow: 0 0 0.1em #bf1500;}


#letters span.letters-leftspan a:hover{}
#letters span.letters-leftspan a:visited{color:black;}
#letters span.letters-leftspan a.selected {font-size:0.8em;}
#letters span.letters-leftspan.selected {font-weight:bold;}

#letters span.letters-leftspan button{float:right;border: 1px solid #d2d2d2;color: #d2d2d2;border-radius: 0.2em;}

#letters-menu { margin:0.5em;}
#letters-menu a{background-color:rgb(176, 15, 7);color:white;padding:0.5em 2em;}

#letters-menu span.lastshipping {background-color:#474747;color:white;padding:0.5em 2em;}

#letterwrapper .letter-settings {width:100%;display:block;}
#letterwrapper .letter-settings .letter-title {display:block;width:70%;float:left;}
#letterwrapper .letter-settings .letter-title input {padding:0.3em 1em;width:100%;font-size:1.5em;background-color:#ebebeb;border:1px solid #f7f7f7; }
#letterwrapper .letter-settings .letter-textarea-title {clear:both;display:block;width:30%;background-color:#bf1500;border-radius:0.3em;color:white;padding:0.5em 0.5em;}
#letterwrapper .letter-settings textarea
{
	/*float:left;
	clear:both;*/
	width: 30%;
	height: 10%;
	border: 0.3em solid #cccccc;
	padding: 1em;
	/*font-family: Tahoma, sans-serif;
	background-image: url(bg.gif);
	background-position: bottom right;
	background-repeat: no-repeat;*/
	}


#letterwrapper .letter-settings .lastshipping {float:right;font-size:0.7em;background-color:#474747;color:white;padding:0.5em 2em;}

#letter-row1 {width: 100%;min-height: 3em;}
#letter-row2 {width:100%;/*height:3em;*/margin-top: 1em;}
#letter-row3 {width:100%;height:auto;margin-top: 1em;}

#letterwrapper .letter-toggle {float:left;}

#letterwrapper .external-link {float:left;font-size:2em;}

#letterwrapper .letter-stats {float:right;font-size:0.8em;margin-top:0em;}
#letterwrapper .letter-stats span {text-align:center;padding:0.1em 0.5em;}
#letterwrapper .letter-stats span.total {background-color:#d6efff;}
#letterwrapper .letter-stats span.success {background-color:#e0ffd6;}
#letterwrapper .letter-stats span.errors {background-color:#ffd6d6;}
#letterwrapper .letter-stats span.pending {background-color:#ffdd44}

#letterwrapper #letters-groups {font-size:0.7em;border : 1px solid grey;width:auto;background-color:#ebebeb;color:}
#letterwrapper #letters-groups option[selected]{font-weight:bold;}
#letterwrapper #letters-groups option:nth-child(even) {background-color:#fbfbfb;padding:0.2em 1em;}
#letterwrapper #letters-groups option:nth-child(odd) {background-color:#efefef;padding:0.2em 1em;}

#letterwrapper .letters-options {background-color:#bf1500;border-radius:0.3em;color:white;padding:0.5em 0.5em;}
#letterwrapper .group-adresses {clear:both;display:block;margin-top:0.5em;}
#letterwrapper .letters-options input[type="color"] {border: none;width: 5em;height: 1.5em;font-size:0.8em;}

#lettersdisplayeditor,#lettersave{font-size:2em;float:right;}

#letterwrapper .letters-groups-settings-left {float:left;border: 0.3em solid #cccccc;padding: 1em;width:45%;}
#letterwrapper .letters-groups-settings-right {float:right;border: 0.3em solid #cccccc;padding: 1em;width:45%;}
#letterwrapper .letters-groups-settings-middle {float:left;font-size:6em;max-width:10%;width:10%;color:#bf1500;text-align:center;}
/** / LETTER **/

/** DEFAULT FORM **/

.formwrapper { margin: 0 auto;text-align: center;width:50%;}

/* Minimal modern input */
.formtext {
  /*width: 100%;*/
  padding: 10px 12px;
  font: 16px system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: #0f172a;
  background: #fff;
  border: 1px solid #e6e9ee;
  border-radius: 8px;
  box-shadow: 0 1px 0 rgba(16,24,40,0.03);
  outline: none;
  transition: border-color .12s, box-shadow .12s, transform .08s;
}

.formtext::placeholder { color: #94a3b8; }

.formtext:focus {
  border-color: #5b7cff;
  box-shadow: 0 6px 18px rgba(91,124,255,0.12);
  transform: translateY(-1px);
}

.formtext:disabled {
  background: #f5f7fb;
  color: #9aa4b2;
  cursor: not-allowed;
}

/* Select */
.formselect {
  /*width: 100%;*/
  padding: 9px 12px; /* slightly less to align visually */
  background: #fff;
  border: 1px solid #e6e9ee;
  border-radius: 8px;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  box-shadow: 0 1px 0 rgba(16,24,40,0.03);
  outline: none;
  transition: border-color .12s, box-shadow .12s;
  background-image: linear-gradient(45deg, transparent 50%, #94a3b8 50%),
                    linear-gradient(135deg, #94a3b8 50%, transparent 50%);
  background-position: calc(100% - 12px) calc(1em + 2px), calc(100% - 7px) calc(1em + 2px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  padding-right: 36px;
}
.formselect:focus { border-color: #5b7cff; box-shadow: 0 6px 18px rgba(91,124,255,0.12); }
.formselect:disabled { background: #f5f7fb; color: #9aa4b2; cursor: not-allowed; }

/* Checkbox (custom simple) */
.formcheckbox {
  --size: 18px;
  width: var(--size);
  height: var(--size);
  display: inline-block;
  vertical-align: middle;
  border-radius: 4px;
  border: 1px solid #e6e9ee;
  background: #fff;
  box-shadow: 0 1px 0 rgba(16,24,40,0.03);
  position: relative;
  transition: background .12s, border-color .12s, transform .08s;
}
.formcheckbox input {
  position: absolute;
  opacity: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  cursor: pointer;
}
.formcheckbox .formcheckmark {
  pointer-events: none;
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: white;
  transform: scale(0.85);
  opacity: 0;
  transition: opacity .12s, transform .12s;
  border-radius: 3px;
  background: #5b7cff; /* check background */
}
.formcheckbox input:checked + .checkmark {
  opacity: 1;
  transform: scale(1);
}
.formcheckbox input:disabled + .checkmark {
  background: #9aa4b2;
  opacity: 0.8;
}
.formcheckbox input:disabled ~ * { cursor: not-allowed; }

/* Focus outlines for accessibility */
.formtext:focus-visible, .select:focus-visible, .checkbox input:focus-visible {
  outline: 3px solid rgba(91,124,255,0.14);
  outline-offset: 2px;
}

/* Submit button */
.formbtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 14px;
  background: linear-gradient(180deg,#8a1b17,#aa4541);
  color: #fff;
  border: none;
  border-radius: 10px;
  font: 16px system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  cursor: pointer;
  box-shadow: 0 6px 18px rgba(72,104,230,0.16), 0 1px 0 rgba(0,0,0,0.03) inset;
  transition: transform .08s, box-shadow .12s, opacity .12s;
}
.formbtn:hover { transform: translateY(-1px); box-shadow: 0 10px 30px rgba(72,104,230,0.18); }
.formbtn:active { transform: translateY(0); box-shadow: 0 6px 18px rgba(72,104,230,0.14); }
.formbtn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  background: linear-gradient(180deg,#8a1b17,#aa4541);
  box-shadow: none;
}