/*** Common ***/

.kfx-hidden {
    display: none !important;
}

.kfx-invisible {
    visibility: hidden;
}

/*** Layout ***/

.kfx-layout {
    width: 100%;
    height: 100%;
    position: relative;
}

.kfx-content {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 4em;

    text-align: center;
    white-space: nowrap;
}

.kfx-disableac .kfx-content{
    bottom: 0;
}

.kfx-content::before {
    content: '';
    display: inline-block;
    vertical-align: middle;
    height: 100%;
}

.kfx-content > * {
    display: inline-block;
    vertical-align: middle;
}

/*** Toolbar ***/

.kfx-toolbar {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 4em;
}

.kfx-toolbar * {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.kfx-button {
    color: inherit;
    font: inherit;
    margin: 0;
    padding: 0;
    background-color: transparent;
    border: none;

    display: block;
    height: 4em;
    cursor: pointer;

    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.kfx-button:focus {
    outline: none;
}

.kfx-button:active {
    -webkit-transform: scale(0.9, 0.9);
    -moz-transform: scale(0.9, 0.9);
    -ms-transform: scale(0.9, 0.9);
    -o-transform: scale(0.9, 0.9);
    transform: scale(0.9, 0.9);
}

.kfx-button .kfx-icon {
    display: inline-block;
    vertical-align: middle;
    width: 4em;
    height: 4em;
    background-position: center;
    background-size: contain;
}

.kfx-button .kfx-text {
    display: inline-block;
    vertical-align: middle;
    font-size: 2em;
    color: white;
}

/*** Capture ***/
.kfx-capture video {
    position: absolute;
}

.kfx-capture #kfx-selfie-capture-video {
    /* transform: rotateY(180deg); */
    transform: scaleX(-1);
    -webkit-transform:scaleX(-1); /* Safari and Chrome */
    -moz-transform:scaleX(-1); /* Firefox */
}

.kfx-capture canvas{
    position: relative;
}

.kfx-capture .kfx-button.kfx-force-capture {
    margin: 0 auto;
}

.kfx-capture .kfx-button.kfx-force-capture .kfx-icon {
    background-image: url('../Images/camera_icon.png');
}

.kfx-capture .kfx-button.kfx-gallery {
    position: absolute;
    right: 0;
    top: 0;
}

.kfx-capture .kfx-button.kfx-gallery .kfx-icon {
    background-image: url('../Images/gallery_icon.png');
}

/*** Review ***/

.kfx-review .kfx-content .kfx-image {
    max-width: 100%;
    max-height: 100%;
}

.kfx-review .kfx-button.kfx-accept {
    float: right;
    margin-right: 1em;
}

.kfx-review .kfx-button.kfx-accept .kfx-text::before {
    content: 'Accept';
}

.kfx-review .kfx-button.kfx-accept.kfx-next .kfx-text::before {
    content: 'Next Image';
}

.kfx-review .kfx-button.kfx-retake {
    float: left;
    margin-left: 1em;
}

.kfx-review .kfx-button.kfx-retake .kfx-text::before {
    content: 'Retake';
}