/*
SEQUENTIELLE CSS TRANSITIONS
============================
#selector {
    transition-property: top, left, border-radius, background-color;
    transition-duration: 2s, 1s, 0.5s, 0.5s;
    transition-delay: 0s, 0.5s, 1s, 1.5s;
}

*/

/*************************************************************************
** ICONS
**************************************************************************/


#sc_adjust i.bfIcon,
#sd_adjust i.bfIcon,
#imp_adjust i.bfIcon {
    transition: transform .4s ease-out;
}



/*************************************************************************
** Controls
**************************************************************************/
/* nur dB: Reiter Tab-Control ( Standard, Zusatzfelder ) */
.dB #searchTab_main .dijitTab,
.dB #import_main .dijitTab {
    transition-property: background-color, border-color, padding, box-shadow;
    transition-duration: 0.3s, 0.3s, 0.6s, 0.3s;
    transition-delay: 0s, 0s, 0s, 0.3s;
}


input.mblTextBox, #doc_wvlTable .dojoxCheckedMultiSelectButton {
    transition: border .3s;
}

/*************************************************************************
** CLASSES
**************************************************************************/

.dB.claro .dijitMenuItem {
    transition: background-color .3s ease-in-out;
}

.material-icons {
    transition: color .5s;
}

.awesomplete > input, .ddArrow, .mblCheckBox, .mblSliderHandle {
    transition: border-color .3s ease-in-out;
}

.mblButton, .mblToolBarButton,
.dB .dijitButton .dijitButtonNode,
#filesysBtn {
    transition-property: background-color, box-shadow, border-color;
    transition-duration: 0.3s, 0.3s, 0.3s;
    transition-delay: 0s, 0s, 0s;
}

.mblTabBarButton, .SF_statusInd, .ddArrow {    /* .gridConfElement*/
    transition: background-color .3s ease-in-out;
}

.pi_job {
    transition-property: color, transform;
    transition-duration: 1s, .3s;
    transition-delay: 0s, 0s;
    transition-timing-function: ease-in, cubic-bezier(0.9, 0.4, 0.7, 1.6);
}

.naviBtn {
    transition-property: transform, box-shadow, border-color;
    transition-duration: 400ms, 300ms, 300ms;
    transition-delay: 0s, 100ms, 0s;
    transition-timing-function: ease-in-out, ease-in-out, linear;
}

/* Das ist das Bild als solches (img) */
.doc_preview_img {
    transition: opacity 333ms ease-in-out;
}

.fileBox {
    transition-property: background-color, border-color;
    transition-duration: 400ms, 400ms;
}

/*************************************************************************
** ID´s
**************************************************************************/

/* IMPORT */

.dB #docview {
    transition: border .4s ease-in-out;
    -moz-transition: border .4s ease-in-out;
    -webkit-transition: border .4s ease-in-out;
}


#PIP {
    transition: transform .3s ease-in-out;
    -moz-transition: transform .3s ease-in-out;
    -webkit-transition: transform .3s ease-in-out;
}


#statusContainer, #import_statusContainer, #sd_statusContainer {
    transition: height .2s ease-in-out;
    -moz-transition: height .2s ease-in-out;
    -webkit-transition: height .2s ease-in-out;
}


#import_main {
    transition-property: right, width, top, height;
    transition-duration: 0.4s, 0.3s, 0.4s, 0.3s;
    transition-delay: 0s, 0s, 0s, 0s;
    transition-timing-function: ease-out, ease-out, ease-out, ease-out;
}
#import_main.expanded {
    transition-property: right, width, top, height;
    transition-duration: 0.4s, 0.3s, 0.4s, 0.3s;
    transition-delay: 0s, 0s, 0s, 0s;
    transition-timing-function: ease-in-out, ease-in-out, ease-in-out, ease-in-out;
}

#imp_wvlTable {
    transition-property: height, border-color;
    transition-duration: .4s, .4s;
    transition-delay: 0s, .4s;
    transition-timing-function: ease-in, linear;
}

#imp_wvl_handle {
    transition-property: transform, background-color;
    transition-duration: .4s, .4s;
    transition-delay: 0s, .4s;
    transition-timing-function: ease-in, linear;
}

#imp_wvl_handle .bfIcon {
    transition-property: background-position;
    transition-duration: .2s;
    transition-delay: .6s;
    transition-timing-function: linear;
}


/* NAVI */

#navi_container {
    transition: transform .3s ease-in-out;
    -moz-transition: transform .3s ease-in-out;
    -webkit-transition: transform .3s ease-in-out;
}


/* Context Menu */
#contextMenu {
    transition: opacity .3s ease-in-out;
    -moz-transition: opacity .3s ease-in-out;
    -webkit-transition: opacity .3s ease-in-out;
}

/*
#navi_quickSearchField {
    transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
}

#mainLogo {
    transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -webkit-transition: all .5s ease-in-out;
}
*/
#mainHeading {
    transition: border-color 1s ease-in-out;
    -moz-transition: border-color 1s ease-in-out;
    -webkit-transition: border-color 1s ease-in-out;
}

#main_footer {
    transition: font-size 2s ease-in-out;
    -moz-transition: font-size 2s ease-in-out;
    -webkit-transition: font-size 2s ease-in-out;
}

#settings_extOptions {
    transition: opacity .3s ease-in-out;
    -moz-transition: opacity .3s ease-in-out;
    -webkit-transition: opacity .3s ease-in-out;
}

/* Info Container
----------------*/

/* cubic-bezier( 0.7, -0.2, 0.1, 0.3 ) */

#info_container {
    transition: transform .3s ease-out;
    -moz-transition: transform .3s ease-out;
    -webkit-transition: transform .3s ease-out;
}
#info_container.expanded {
    transition: transform .3s ease-in-out;
    -moz-transition: transform .3s ease-in-out;
    -webkit-transition: transform .3s ease-in-out;
}

#addfields_wrapper {
    transition: background-color .3s;
    -moz-transition: background-color .3s;
    -webkit-transition: background-color .3s;
}

#addfields_handle {
    transition-property: background-color, transform, box-shadow;
    transition-duration: 0.5s, 0.5s, 0.5s;
    transition-delay: 0s, 0s, 0s;
}

.handle {
    transition-property: opacity, transform, background-color, box-shadow, border-radius;
    transition-duration: 500ms, 500ms, 500ms, 500ms, 500ms;
    transition-delay:    250ms, 000ms, 250ms, 400ms, 500ms;
}


/* Info Container - DESKTOP
--------------------------*/

.dB #addfields_handle {
    transition-property: opacity, transform, background-color, box-shadow, border-radius;
    transition-duration: 300ms, 300ms, 500ms, 300ms, 300ms;
    transition-delay:    100ms, 300ms, 100ms, 300ms, 400ms;
}

.dB #history_handle {
    transition-property: opacity, transform, background-color, box-shadow, border-radius;
    transition-duration: 300ms, 300ms, 500ms, 300ms, 300ms;
    transition-delay:    200ms, 400ms, 200ms, 400ms, 500ms;
}
/* warten auf Implementierung
.dB #discussion_handle {
    transition-property: opacity, transform, background-color, box-shadow, border-radius;
    transition-duration: 300ms, 300ms, 500ms, 300ms, 300ms;
    transition-delay:    300ms, 500ms, 300ms, 500ms, 600ms;
}
*/
.dB #ftx_handle {
    transition-property: opacity, transform, background-color, box-shadow, border-radius;
    transition-duration: 300ms, 300ms, 500ms, 300ms, 300ms;
    transition-delay:    300ms, 500ms, 300ms, 500ms, 600ms;
    /* transform-delay +100ms wenn discussion implementiert */
}
.dB #wvl_handle {
    transition-property: opacity, transform, background-color, box-shadow, border-radius;
    transition-duration: 300ms, 300ms, 500ms, 300ms, 300ms;
    transition-delay:    400ms, 600ms, 400ms, 600ms, 700ms;
    /* transform-delay +200ms wenn discussion implementiert */
}

#pin_handle i.bfIcon {
    transition-property: transform;
    transition-duration: 300ms;
    transition-delay: 0s;
    transition-timing-function: ease-out;
}
#pin_handle.fHandleActive i.bfIcon {
    transition-property: transform;
    transition-duration: 300ms;
    transition-delay: 0s;
    transition-timing-function: ease-in;
}

#staticSF_layout button.statField {
    transition-property: background-color, box-shadow;
    transition-duration: 0.5s, 0.5s;
    transition-delay: 0s, 0.25s;
}
/* Den Selektor könnte man noch mit folgendem ergänzen wenn wir denn lustig sind
 * #dynSF_layout button.statefield <- für die dynamischen Statefields
 */

#doc_ftx{
    transition: height 0.3s ease-in-out;
}


/* LISTEN-Elemente
-----------------*/


.dB .mblListItem {
    transition-property: border-color, border-width;
    transition-duration: 0.4s, 0.4s;
    transition-delay: 0s, 0s;
}


/*************************************************************************
** overwrites
**************************************************************************/

.dark_style .mblHeading, .light_style .mblHeading {
    transition: border-color 2s ease-in-out;
    -moz-transition: border-color 2s ease-in-out;
    -webkit-transition: border-color 2s ease-in-out;
}

#trefferliste .dgrid-row {
    transition-duration: 200ms;
    transition-property: background-color, border-color;
    -moz-transition-duration: 200ms;
    -moz-transition-property: background-color, border-color;
    -webkit-transition-duration: 200ms;
    -webkit-transition-property: background-color, border-color;
}