.MainTitle {
    color: #007d32;
}

.SubtitleAppointmentStartPage {
    color: #007d32;
}

.Appointment .Title {
    color: #000000;
}

.EventOnline
{
    overflow: hidden;
}

.EventOnline .gwt-TabLayoutPanelContentContainer
{
    border-style: none;
}

.gwt-DialogBox
{
    z-index: 3;
}

body
{
    font-size: 11pt;
    font-family: Open Sans, arial, sans-serif;
    color: #3F3F3F;
}

.Container
{
    text-align: center;
    width: 100%;
    padding-top: 21px;
}

.CenteredContainer
{
    width: 100%;
    text-align: left;
    margin: auto;
}

.CenteredContainer::after {
	float: right;
	content: "SMC InformationsTechnologien AG – www.smc-it.de ";
	margin-bottom: 20px;
}

@media (min-width: 600px) {
    .CenteredContainer
    {
        width: 600px;
    }
}

.Header
{
    margin-left: 8px;
    margin-bottom: 15px;
}

.Header .AddressLetter
{
    font-size: 13pt;
    font-weight: bold;
    margin-bottom: 6px;
}

.Info
{
    font-size: 16px;
}

.InvitationInfo
{
    /*font-family: Open Sans;*/
    font-weight: bold;
    font-size: 11pt;
    margin-bottom: 12px;
}

.EmptyInterval
{
    height: 20px;
}

.EmptyIntervalSmall
{
    height: 10px;
}

.MainTitle
{
    width: 100%;
    margin-top: 0px;
    padding: 0px;
    margin-bottom: 9px;
    font-size: 15pt;
    color: #007d32;
    font-weight: bold;
}

.BottomWrapper
{
    padding: 14px;
    padding-right: 19px;
    border: 1px solid #D2D2D2;
    border-top: 0px;
    margin-bottom: 25px;
    display: flex;
}

.EventOnlineButtonsWrapper
{
    margin: auto;
    flex-flow: row-reverse;
}

.EventOnlineLinksWrapper
{
    margin: auto;
    flex-flow: column;
}

.Subtitle
{
    font-size: 11pt;
    margin-top: 0px;
    text-decoration: none;
    color: #007d32;
    font-weight: bold;
}

.SubtitleAppointment, .SubtitleAppointmentStartPage
{
    font-size: 11pt;
    margin-top: 0px;
    text-decoration: none;
    color: #007d32;
    font-weight: bold;
}

.SubtitleAppointmentStartPage
{
    margin-top: 16px;
    margin-bottom: 6px;
}

.SubtitleAppointmentText
{
    font-weight: bold;
}

.SubtitleDetails
{
    padding-top: 6px;
}

.ContentWrapper
{
    border-style: solid;
    border-width: 1px;
    border-color: #D2D2D2;
    padding: 12px;
    padding-top: 15px;
}

.Content
{
    width: 100%;
    background-color: white;
}


.RegisterOthersContent
{
    height: 450px;
}

.EventTable
{
    width: 100%;
    margin-bottom: 3px;
}

.EventTable td {
    padding-top: 3px;
    padding-bottom: 3px;
}

.PlainText
{
    background-color: #EDF2FF;
    width: 100%;
    height: 100%;
    overflow: auto;
}

.InvitationDatas
{
    width: 100%;
    table-layout: fixed;
}

.InvitationDatas label
{
    display: block;
    padding-left: 30px;
    margin-top: -17px;
}

.InvitationDatas td, .MandatoryLabel
{
    font-size: 13px;
    /*font-family: Arial;*/
    padding-right: 10px;
}

.RegistrationDatasSecondColumn
{
    text-align: right;
}

.Appointments
{
    width: 100%;
    margin-bottom: 3px;
}

.Appointments td
{
    padding-top: 4px;
    padding-bottom: 4px;
    vertical-align: baseline;
}

.Appointment
{
    background-color: #F9F9F9;
	border: 3px solid #6699CC;
    margin-left: 3px;
}

.Appointment.FullyBooked, .AppointmentGroupAppointment.FullyBooked
{
    color: #666;
    background-color: #E8E8E8;
}

.Appointment.FullyBooked .Title, .AppointmentGroupAppointment.FullyBooked .Title
{
    color: #666;
}

.AppointmentFirst td
{
    padding-top: 9px;
    border-top: 2px dashed #D2D2D2;
}

.AppointmentFirstSeparator td
{
    padding: 0;
}

.AppointmentLast td
{
    padding-bottom: 8px;
    border-bottom: 2px dashed #D2D2D2;
}

.Appointment .Title
{
    color: #007d32;
}

.Time
{
    color: grey;
}

.AppointmentGroup
{
    font-weight: bold;
    color: black;
}

.AppointmentGroup Table
{
    width: 100%;
    background-color: Blue;
}

.AppointmentGroup .Title
{
    width: 100%;
    position: relative;
}

.AppointmentGroup .TitleText
{
    float: left;
    position: relative;
    z-index: 2;
    background-color: White;
    padding-right: 14px;
}

.AppointmentGroup .Separator
{
    position: absolute;
    left: 0px;
    right: 10px;
    top: 8px;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-color: #D2D2D2;
    z-index: 1;
}

* + html .AppointmentGroup .Separator
{
    top: -8px;
}

* + html .AppointmentFirstSeparator
{
    height: 10px;
}

* + html .AppointmentGroupAppointmentSeparator td
{
    height: 10px;
    padding-bottom: 0px;
}

.AppointmentCount
{
    color: #999999;
    font-weight: normal;
}

.AppointmentGroup td
{
    padding-top: 16px;
}

.Appointments .Date
{
    width: 10%;
    vertical-align: top;
    white-space: nowrap;
    padding-left: 24px;
    display: flex;
    color: gray;
}

 .GroupAppointmentDate {
    padding-left: 41px !important;
}

.AppointmentGroupAppointment
{
}

.AppointmentGroupAppointmentFirst td
{
}

.AppointmentGroupAppointmentLast td .Date
{
    padding-bottom: 8px;
}

.AppointmentGroupAppointmentLastSeparator td
{
    padding-top: 1px;
    padding-bottom: 0px;
}

.AppointmentGroupAppointmentSeparator td
{
    padding-top: 9px;
    padding-bottom: 8px;
    padding-left: 14px;
    padding-right: 10px;
}

.AppointmentGroupAppointmentSeparator td .Separator
{
    border-top: 1px solid #D2D2D2;
    width: 100%;
}

.AppointmentGroupAppointment .Title
{
    color: black;
}

.Appointments .Title
{
    vertical-align: top;
    margin-bottom: 4px;
}

.DateTimeSeparator
{
    padding: 0 0.4em;
}

.eventOnlineLabel
{
    /*font-family: Verdana;*/
    font-size: 14px;
    padding-bottom: 4px;
}

.eventOnlineLink
{
    color: #007d32;
    display: block;
    /*font-family: Trebuchet MS;*/
    text-decoration: underline;
    cursor: pointer;
    margin: 0 8px 15px 8px;
}

.eventOnlineLink:hover
{
    color: #94AD60;
}

.eventOnlineLink::after
{
    content: "\0020\2192";
}

.eventOnlineTextfield
{
    border: 1px solid #007d32;
	border-radius: 4px;
    font-size: 13px;
    height: 21px;
    margin-bottom: 3px;
    margin-top: 3px;
    padding-left: 4px;
    padding-top: 3px;
    width: 100%;
	transition: background-color 0.5s linear, transform 0.5s ease;
}

.eventOnlineTextfield:focus
{
    background-color: #F0F3F4;
	transition: background-color 0.5s linear, transform 0.5s ease;
	transform: translateX(-5px);
}

.eventOnlineTextarea
{
    border: 1px solid #007d32;
	border-radius: 4px;
    font-size: 13px;
    height: 51px;
    margin-bottom: 4px;
    margin-top: 4px;
    padding-left: 4px;
    padding-top: 1px;
    width: 100%;
    resize: none;
    /*font-family: Arial;*/
}

.eventOnlineTextarea:focus
{
    background-color: #F0F3F4;
	transition: background-color 0.5s linear, transform 0.5s ease;
	transform: translateX(-5px);
}

.eventOnlineCombobox
{
    border: 1px solid #007d32;
	border-radius: 4px;
    font-size: 13px;
    height: 26px;
    margin-bottom: 3px;
    margin-top: 3px;
    padding: 2px;
    width: 100%;
}

.eventOnlineCombobox:focus
{
    background-color: #F0F3F4;
}

.textareaLabel
{
    margin-top: -25px;
}

.eventOnlineComboboxTD
{
    padding-right: 4px !important;
}

.eventErrorInputField
{
    border-color: red;
}

.eventOnlineButton
{
    float: right;
    margin: 0 5px 0 5px;
	font-size: 14px !important;
	border: 1px solid #007d32 !important;
	border-radius: 8px !important;
	background-color: #eee !important;
	height:25px !important;	
}

.eventOnlineButton:hover:enabled
{
	background-color: #fff !important;
	border: 2px solid #007d32 !important;
	transition: background-color 0.7s linear;
}

.eventOnlineButton:disabled
{
	border: 1px solid #e44f28 !important;
}

.dialogMiddleCenterInner > div > div:last-child
{
    bottom: 7px !important;
}

.loadingImage
{
    width: 20px;
    height: 20px;
    background-image: url('../Images/SMC_Logo_Img_120.png');
    margin-right: 10px;
}

#STARTPAGE_LOADING {
	width: 1px;
    height: 1px;	
}

#LOADING::before
{
	content: "";
	position:absolute;
	width:40px;
	height:40px;
	z-index:10;
	margin-top:-10px;
	margin-left:-40px;
	background-image: url('../Images/SMC_Logo_Img_120.png');
	background-size: cover;
	animation: dobby 1s infinite;
	animation-direction: alternate;
	animation-timing-function: ease-in;
}

@keyframes dobby {
	0% { transform:scale(0.3) rotateZ(0deg) }
	100%	{ transform:scale(1) rotateZ(360deg) }
}

#LOADING
{
    text-align: center;
    margin-top: 100px;
}

#LOADING span
{
    text-align: left;
    margin: auto;
}

#REGISTRATION_DEADLINE, #REGISTRATION_NOT_POSSIBLE
{
    color: #E11125;
}

#COMPANION
{
    white-space: nowrap;
}

#STARTPAGE_NOTES2
{
    background: white;
}

.MandatoryHint
{
    font-weight: normal;
    color: Gray;
}

.TitleSeparator
{
    border-top-style: solid;
    border-top-width: 3px;
    border-top-color: #007d32;
    width: 100%;
    padding-top: 4px;
    padding-bottom: 7px;
    margin-top: 4px;
    margin-bottom: 4px;
}

.InputHolder
{
    vertical-align: top;
}

.InputHolder input
{
    margin-top: 1px;
}

* + html .InputHolder input
{
    margin-top: -2px;
}

.Appointment .InputHolder, .AppointmentGroup .InputHolder
{
    width: 18px;
    padding-left: 1px;
}

.AppointmentGroupAppointment .InputHolder
{
    padding-left: 0px;
    margin-left: 0px;
}

.AppointmentGroupAppointment .InputHolder input
{
    margin-left: 3px;
}

.RegisterPage .Appointment .Title, .RegisterPage .AppointmentGroupAppointment .Title
{
    display: inline-block;
    padding-left: 3px;
}

.RegisterPage .AppointmentGroup .Separator
{
    right: 0px;
}

.RegisterPage .AppointmentGroupAppointmentSeparator td
{
    padding-left: 0px;
    padding-right: 0px;
}

.Companions td
{
    padding-top: 20px;
    padding-bottom: 8px;
}

.Companions p
{
    font-weight: bold;
}

.Companions > td > div
{
    margin-top: 16px;
}

.Companions > td > div > span
{
    float: left;
}

.Companions .comboboxWrapper
{
    float: left;
    margin-left: 7px;
    margin-top: -3px;
    width: 45px;
}

.RegisterPage .AppointmentGroupTitle
{
    padding-left: 3px;
    padding-bottom: 4px;
}

.InfoEmptyInterval
{
    margin-bottom: 16px;
}

.SuggestionPage
{
    padding: 0px !important;
}

.SuggestionPage .ContentWrapper
{
    border: none;
    padding: 0px !important;
}

.SuggestionPage .BottomWrapper
{
    border: none;
    padding: 0 !important;
}

.SuggestionForm
{
    width: 90%;
    margin-top: -15px;
}

.SuggestionFormFirstColumn
{
    float: right;
    /*font-family: sans-serif;*/
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 5px;
    padding-right: 15px !important;
}

.SuggestionFormSecondColumn
{
    width: 85% !important;
}

.suggestionSendButton
{
}

.suggestionTextarea
{
    /*font-family: Verdana;*/
    font-size: 11px;
    padding: 2px;
    resize: none;
}

.suggestionCheckbox
{
    margin-bottom: 15px;
    margin-top: 15px;
}

.SuggestionLink
{
    display: block;
    float: right;
    margin-top: 11px;
    color: black;
    cursor: pointer;
}

.SuggestionLinkPicture
{
    width: 32px;
    height: 20px;
    background: url(../Images/envelope_small.png) no-repeat 0px 0px;
    margin-bottom: 5px;
    margin-left: 13px;
}

.SuggestionLinkLabel, .SuggestionLinkLabel:visited
{
    color: #666;
    /*font-family: Verdana;*/
    font-size: 10px;
    font-weight: lighter;
}

.CloseButtonImage
{
    margin: 1px;
    width: 15px;
    height: 15px;
    background: url(../Images/closeBtn.png) no-repeat 0px 0px;
    float: right;
}

.CloseButtonImage:hover
{
    background: url(../Images/closeBtnHover.png) no-repeat 0px 0px;
}

#SUGGESTIONPAGE_TEXTFIELD_TO
{
    color: #666;
    height: 50px !important;
}

#SUGGESTIONPAGE_TEXTFIELD_MESSAGE
{
    height: 70px !important;
}

#SUGGESTIONPAGE_CHECKBOXLABEL_EMAIL
{
    margin-left: -2px !important;
}

.gwt-PopupPanel
{
    z-index: 99999 !important;
}

.VersionNumber
{
    bottom: 8px !important;
    position: fixed;
    right: 10px;
}

.HiddenSection
{
    display: none;
}

.FormDatasHeader
{
    font-weight: bold;
    font-size: 11pt !important;
    padding-bottom: 5px;
    padding-top: 5px;
}

.TwoColumns
{
    float: left;
    margin-right: 5px;
}

.FormDatas
{
    font-size: 11pt;
    margin-bottom: 10px;
    line-height: 125%;
    color: black;
}

#questionnaireDataTable input
{
    margin-bottom: 5px;
    margin-left: 0;
    margin-top: 5px;
}

#questionnaireDataTable label
{
    display: block;
    margin-top: -23px;
    padding-bottom: 4px;
    padding-left: 20px;
    padding-top: 4px;
}

.StartPage .BottomWrapper, .SuccessfulRegisterPage .BottomWrapper
{
    padding-bottom: 5px !important;
}

.LabelInForm
{
    padding-top: 3px;
    padding-bottom: 3px;
}

.CaptionInForm
{
}

input[type="checkbox"] {
  display: none;
}

input[type="checkbox"] + label {
  padding-top: 30px;
  position: relative;
  display: inline-flex;
  cursor: pointer;
  font-family: Open sans;
  font-size: 14px;
  line-height: 1.3;
}

input[type="checkbox"] + label:before {
  width: 40px;
  height: 20px;
  border-radius: 20px;
  border: 2px solid #ddd;
  background-color: #fff;
  content: "";
  margin-right: 15px;
  transition: background-color 0.5s linear;
}

a {
	color: #007d32 !important;
	transition: color 0.5s linear;
}

a:hover {
	color: #93aa63 !important;
	transition: color 0.5s linear;
}

input[type="checkbox"]::required + label:before {
  width: 40px;
  height: 20px;
  border-radius: 20px;
  border: 2px solid #ddd;
  background-color: red;
  content: "ok";
  margin-right: 15px;
  transition: background-color 0.5s linear;
}

input[type="checkbox"] + label:after {
  width: 20px;
  height: 20px;
  border-radius: 30px;
  background-color: #fff;
  content: "";
  transition: margin 0.2s linear;
  box-shadow: 0px 0px 5px #aaa;
  position: absolute;
  left: 32px;
  top: 32px;
}

input[type="checkbox"]:checked + label:before {
  background-color: #007d32;
}

input[type="checkbox"]:checked + label:after {
  margin: 0 0 0 20px;
}

.CheckBoxWithLabelWrapper, .RadioButtonWithLabelWrapper
{
    display: flex;
    align-items: flex-start;
}

.eventOnlineCheckBox {
    margin-left: 5px;
    margin-top: 2px;
}

.AppointmentGroupAppointment.AppointmentGroupAppointmentFirst > td {
    width: 19px;
}

.AppointmentGroupTitle .Title .TitleText .eventOnlineCheckBox {
    margin-left: 2px;
    margin-right: 6px;
}

.AppointmentGroupAppointment .eventOnlineRadioButton {
    margin: 2px 0 0 16px;
}

.FreeSeatsDiv {
    display:inline-block;
}