/*
CSS Datei zur Nachbesserung der Babiel Styles
*/
/* 
    Created on : 31.08.2017, 06:31:48
    Author     : ThR
*/



/* Darstellung deaktivierter Checkboxen und radio-buttons.
   Darstellungsbeispiel siehe Confluence: "checkox deaktiviert.png"*/
#main form input[type="checkbox"][disabled] ~ label::before,
#main form input[type="radio"][disabled] + label::before,
#main form input[type="radio"][disabled] + input + label::before
{
    opacity: 0.4 ;
}



/** loader start **/
.dbtg-loader {
    border: 4px solid rgb(51,51,51,0.33);
    border-top: 4px solid #000;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/** loader end **/



/* tag list design 
   Darstellungsbeispiel siehe Confluence: "tag button list.png"*/
.dbtg-tag-list-button:after {
    font-family: "bt-icons";
    content: "\e84a";
    margin-left: 5px
}
.dbtg-tag-list-button {
    border:0px;
    border-radius:5px;
    background:#eee;
    padding-left:5px;
    margin-left:5px;
    font-size:1.6em;
    white-space: nowrap;
    height:26px;
}

/* tag list design ende */


/* 
 * Style-classes to customize the choice of appointments. 
 */
.timeToSelectButton { margin-bottom: 4px; width: 68px; }

.prioButton { margin-left: 3px; }

.tableTextOutput { font-size: 1.4em; }

.appointmentButtonsAlignment {text-align: right; }

.appointmentButtonsFont { font-family: "bt-icons" !important; }

/* 
 * Style-classes to customize the confirmation of booking requests, 
 * especially the table to enter the participants . 
 */
.participantListTableTextOutput td, .participantListTableTextOutput th { padding: 1px; }

.table > tbody > tr > td.participantListColumnPosition { vertical-align: center; }

.participantListTableTextOutput { font-size: 1.4em; }

.enterCommercialGroupLeaderLabel { padding-top: 10px; }

.enterCommercialGroupLeaderInput { margin-top: 2px; }

.bootstrap-datetimepicker-widget table th.dow, .bootstrap-datetimepicker-widget table th.cw { width: 12.5%; }

/* 
 * Moving the labels of checkboxes and radio buttons
 */
#main form input[type="radio"] + label, #main form input[type="radio"] + input + label {
    margin-left: 2.5em;
    padding-right: 2.5em;
}

#main form input[type="checkbox"] ~ label {
    margin-left: 2.5em;
    padding-right: 2.5em;
}

#main form input[type="checkbox"] ~ label::before, #main form input[type="radio"] + label::before, #main form input[type="radio"] + input + label::before {
    left: -2.5em;
    margin-right: -1.5em;
    position: relative;
}

#main form input[type="radio"] + label::before, #main form input[type="radio"] + input + label::before {
    left: -2.5em;
    margin-right: -1.8em;
    position: relative;
}

/**
 * Moving the labels and the satrt of the input fields to the correct position 
 */
.editGroupLabel { padding-top: 10px; }

.editGroupInput { margin-top: 2px; padding-left: 18px; }

/**
 * Improving the style of the calendar, adding borders to the dates where possible events exist.
 */
#dateTimePickerId .datepicker-days table { border-collapse: separate; border-spacing: 2px; }

#dateTimePickerId .day { border: 2px solid #337ab7; 
                         border-radius: 4px; }

#dateTimePickerId .disabled { border: none; }   

/**
 * Moving the buttons a bit away from the previous divs
 */
.buttonsMarginTop { margin-top: 10px; }

.checkBoxMarginTop { margin-top: 10px; }  

/**
 * Updating the font of messages 
 */
.globalMessage { font-size: 1.4rem; }

.confirmBRInputTextArea { color: #000000; font-weight: normal; width: 100%; font-size: 1.4em; }

/**
 * Changing the border color of input fields which contain invalid inputs
 */
.has-error { border-color: #ca2f56; }

.captcha-audio-error { display: inline-block; font-size: 1.4rem }

.versionInformationFooter { font-size: 1.2em; color: gray; }

/* Ende dbtg.css */