/* Create equal columns that floats next to each other */
.four_columns {
	float: left;
	width: 25%;
	padding: 2px 10px;
}

.three_columns {
	float: left;
	width: 33.3%;
	padding: 2px 10px;
}

.two_columns {
	float: left;
	width: 50%;
	padding: 2px 10px;
}

.one_column {
	float: left;
	width: 100%;
	padding: 2px 10px;
	display: inline;
	
}

form.formConference label {
	margin-bottom: 10px;
	font-size: 14px;
	margin-left: 8px;
}

div.text_center{
	text-align: center;
}

form.formConference div select,
form.formConference div input[type='number'],
form.formConference div input[type='email'],
form.formConference div input[type='password'],
form.formConference div input[type='text'] {
	font-size: 14px;
	border-radius: 0px;
	border-color: var(--conf-color-border);
	background-color: var(--conf-color-background);
	border-width: 0 0 1px;
	margin: 4px 0px;
	padding-left: 5px;
	width: 100%;
}


form.formConference table input[type='number'] {
	font-size: 14px;
	border-radius: 0px;
	margin-left: 8px;
	border-color: var(--conf-color-border);
	background-color: var(--conf-color-background);
	border-width: 0 0 1px;
	margin: 0px 0px;
	padding-left: 5px;
	width: 100%;
}

.radio-inline input[type='radio'] {
	float: left;

	margin-left: -20px;
	margin-top: 4px;
	font-size: 14px;
	border-radius: 0px;
	border-color: var(--conf-color-border);
	background-color: var(--conf-color-background);
	border-width: 0 0 1px;
	margin: 10px 10px;
	padding-left: 5px;
	width: 5%;
	position: absolute;
	display: inline-axis;
}

.radio-inline label {
	float: left;
	font-size: 14px;
	border-radius: 0px;
	margin-left: 8px;
	border-color: var(--conf-color-border);
	background-color: var(--conf-color-background);
	border-width: 0 0 1px;
	margin: 10px 10px;
	padding-left: 5px;
	padding-bottom: 10px;
	width: 95%;
	cursor: none;
}

.conf_block td,
.conf_block tr {
	padding-top: 0px;
	padding-bottom: 6px;
	margin-bottom: 5px;
	margin-top: 0px;
	color: var(--conf-color-text);
}

form.formConference div.conf_block {
	margin-left: 8px;
	border-bottom: 10px;
	display: inline;
}

form.formConference div textarea {
	padding: 4px 8px;
	font-size: 14px;
	border-radius: 5px;
	margin-left: 8px;
	margin-top: 0px;
	width: 100%;
}

form.formConference h3 {
	font-size: 20px;
	font-weight: bold;
	color: var(--conf-color-header);
	margin-bottom: 10px;
	margin-top: 0px;
}

/*form.formConference a,*/
form.formConference button {
	border: 1px solid var(--conf-color-button);
	background-color: var(--conf-color-button);
	color: #ffffff;
	padding: 5px 10px;
	font-size: 15px;
	border-left: 5px;
	border-right: 5px;
	cursor: pointer;
	margin-top: 15px;
	margin-bottom: 7px;
}

form.formConference .link-button,
form.formConference .link-button a,
.conf_block a {
	background: none;
	border: none;
	font-size: 1em;
	color: var(--conf-color-button);
	padding: 5px 0px;
}


.conf_block h1 {
	font-size: 25px;
	font-weight: bold;
	margin-bottom: 10px;
	margin-top: 0px;
}

.conf_block h2 {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 10px;
	margin-top: 0px;
}

div span.title {
	color: var(--conf-color-abstract-title);
	font-size: 16px;
	font-weight: bold;
	margin-right: 5px;
	margin-bottom: 5px;
	line-height: 1.4;
}

div span.name {
	color: var(--conf-color-abstract-participant);
	font-size: 16px;
	font-weight: bold;
	margin-right: 5px;
	margin-bottom: 5px;
	line-height: 1.4;
}

div p.abstract {
	color: var(--conf-color-abstract-text);
	margin-bottom: 5px;
	margin-right: 30px;
	line-height: 1.2;
	text-align: justify;
	text-justify: inter-word;
}

.side-bar p {
	background: none;
	border: none;
	cursor: pointer;
	font-size: 1em;
	color: var(--conf-color-header);
	padding: 0px 0px;
}

.radio-button p {
	background: none;
	border: none;
	padding-bottom: 0px;
}


form.formConference button:disabled,
form.formConference button[disabled] {
	border: 1px solid var(--conf-color-disabled-background);
	background-color: var(--conf-color-disabled-background);
	color: var(--conf-color-disabled);
}

.mandatory {
	color: var(--conf-color-mandatory);
}

.conf_light_blue_box {
	margin: 0;
	margin-bottom: 0px;
	margin-bottom: 0px;
	padding: 15px;
	border-bottom: 1px solid #ddd;
	margin-bottom: 15px;
	background: #d6ffff;
}

.conf_white_box {
	padding: 15px;
	border-bottom: 1px solid #ddd;
	margin-bottom: 15px;
	background: #fff;
}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  border: 1px solid #888;
  width: 50%;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.4s;
  animation-name: animatetop;
  animation-duration: 0.4s
}

/* Add Animation */
@-webkit-keyframes animatetop {
  from {top:-300px; opacity:0} 
  to {top:0; opacity:1}
}

@keyframes animatetop {
  from {top:-300px; opacity:0}
  to {top:0; opacity:1}
}

/* The Close Button */
.close,
.close-error,
.close-exist-account {
  color: white;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close-exist-account:focus,
.close-exist-account:hover,
.close-error:hover,
.close-error:focus,
.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.modal-header {
  padding: 2px 16px;
  background-color: var(--conf-color-modal-pass);
  color: var(--conf-color-modal-header-text);
}

.modal-body {padding: 2px 16px;}

.modal-footer {
  padding: 2px 16px;
  background-color: var(--conf-color-modal-pass);
  color: var(--conf-color-background);
}

.modal-header-error {
	padding: 2px 16px;
	background-color: var(--conf-color-modal-error);
	color: var(--conf-color-background);
  }

.modal-footer-error {
	padding: 2px 16px;
	background-color: var(--conf-color-modal-error);
	color: var(--conf-color-modal-background);
  }


 /* The switch - the box around the slider */
 .switch {
	position: relative;
	display: inline-block;
	width: 40px;
	height: 23px;
  }
  
  /* Hide default HTML checkbox */
  .switch input {
	opacity: 0;
	width: 0;
	height: 0;
  }
  
  /* The slider */
  .slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: var(--conf-color-rch-background);
	-webkit-transition: .4s;
	transition: .4s;
  }
  
  .slider:before {
	position: absolute;
	content: "";
	height: 15px;
	width: 15px;
	left: 4px;
	bottom: 4px;
	background-color: var(--conf-color-rch-sel-in);
	-webkit-transition: .4s;
	transition: .4s;
  }
  
  input:checked + .slider {
	background-color: var(--conf-color-rch-sel-out);
  }
  
  input:focus + .slider {
	box-shadow: 0 0 1px var(--conf-color-rch-hover);
  }
  
  input:checked + .slider:before {
	-webkit-transform: translateX(16px);
	-ms-transform: translateX(16px);
	transform: translateX(16px);
  }
  
  /* Rounded sliders */
  .slider.round {
	border-radius: 23px;
  }
  
  .slider.round:before {
	border-radius: 50%;
  } 

  /* Progress bar */
  #progressBar {
	width: 50%;
	background-color: var(--conf-color-background);
  }
  
  #bar {
	width: 10%;
	height: 30px;
	background-color: var(--conf-color-header);
	text-align: center;
	line-height: 30px;
	color: var(--conf-color-background);
  }


  #fees { list-style-type: none; margin: 0; padding: 0; width: 60%; }
  #fees li, #fees ul {border: 2px 2px 2px 2px; border-color:black;  margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1.4em;  }
  #fees li span.ui-icon { position: absolute; margin-left: -1.3em;  vertical-align: center;}
  #fees small {display: inline-block; margin-left: 10px; padding: 2px; vertical-align: center;}
  #fees span:focus {background-color: #ccf;}
  

/* The container */
.conf_radio {
	display: inline;
	position: relative;
	padding-left: 25px;
	margin-bottom: 10px;
	cursor: pointer;
	font-size: 22px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
  }
  
  /* Hide the browser's default radio button */
  .conf_radio input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
  }
  
  /* Create a custom radio button */
  .conf_checkmark {
	position: absolute;
	top: 0;
	left: 0;
	height: 18px;
	width: 18px;
	background-color: var(--conf-color-rch-background);
	border-radius: 50%;
  }
  
  /* On mouse-over, add a grey background color */
  .conf_radio:hover input ~ .conf_checkmark {
	background-color: var(--conf-color-rch-hover);
  }
  
  /* When the radio button is checked, add background */
  .conf_radio input:checked ~ .conf_checkmark {
	background-color: var(--conf-color-rch-sel-out);
  }
  
  /* Create the indicator (the dot/circle - hidden when not checked) */
  .conf_checkmark:after {
	content: "";
	position: absolute;
	display: none;
  }
  
  /* Show the indicator (dot/circle) when checked */
  .conf_radio input:checked ~ .conf_checkmark:after {
	display: block;
  }
  
  /* Style the indicator (dot/circle) */
  .conf_radio .conf_checkmark:after {
	  top: 5px;
	  left: 5px;
	  width: 8px;
	  height: 8px;
	  border-radius: 50%;
	  background: var(--conf-color-rch-sel-in);
  }

table.conf_table_no_border,
table.conf_table_no_border tr,
table.conf_table_no_border td {
	border: 0;
}