@font-face {
    font-family: 'Fakt';
    src: url('https://dk0xyuea3a8kt.cloudfront.net/khaite/fonts/FaktPro-Normal.eot');
    src: url('https://dk0xyuea3a8kt.cloudfront.net/khaite/fonts/FaktPro-Normal.eot?#iefix') format('embedded-opentype'),
    url('https://dk0xyuea3a8kt.cloudfront.net/khaite/fonts/FaktPro-Normal.woff2') format('woff2'),
    url('https://dk0xyuea3a8kt.cloudfront.net/khaite/fonts/FaktPro-Normal.woff') format('woff'),
    url('https://dk0xyuea3a8kt.cloudfront.net/khaite/fonts/FaktPro-Normal.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Fakt';
    src: url('https://dk0xyuea3a8kt.cloudfront.net/khaite/fonts/FaktPro-NormalItalic.eot');
    src: url('https://dk0xyuea3a8kt.cloudfront.net/khaite/fonts/FaktPro-NormalItalic.eot?#iefix') format('embedded-opentype'),
    url('https://dk0xyuea3a8kt.cloudfront.net/khaite/fonts/FaktPro-NormalItalic.woff2') format('woff2'),
    url('https://dk0xyuea3a8kt.cloudfront.net/khaite/fonts/FaktPro-NormalItalic.woff') format('woff'),
    url('https://dk0xyuea3a8kt.cloudfront.net/khaite/fonts/FaktPro-NormalItalic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

/*@font-face {*/
/*    font-family: 'Fakt Pro Blond';*/
/*    src: url('FaktPro-BlondItalic.eot');*/
/*    src: url('FaktPro-BlondItalic.eot?#iefix') format('embedded-opentype'),*/
/*    url('FaktPro-BlondItalic.woff2') format('woff2'),*/
/*    url('FaktPro-BlondItalic.woff') format('woff'),*/
/*    url('FaktPro-BlondItalic.ttf') format('truetype');*/
/*    font-weight: normal;*/
/*    font-style: italic;*/
/*    font-display: swap;*/
/*}*/

/*@font-face {*/
/*    font-family: 'Fakt Pro Blond';*/
/*    src: url('FaktPro-Blond.eot');*/
/*    src: url('FaktPro-Blond.eot?#iefix') format('embedded-opentype'),*/
/*    url('FaktPro-Blond.woff2') format('woff2'),*/
/*    url('FaktPro-Blond.woff') format('woff'),*/
/*    url('FaktPro-Blond.ttf') format('truetype');*/
/*    font-weight: normal;*/
/*    font-style: normal;*/
/*    font-display: swap;*/
/*}*/

@font-face {
    font-family: 'Gaillard';
    src: url('https://dk0xyuea3a8kt.cloudfront.net/khaite/fonts/gaillard.eot'); /* IE9 Compat Modes */
    src: url('https://dk0xyuea3a8kt.cloudfront.net/khaite/fonts/gaillard.woff2') format('woff2'), /* Super Modern Browsers */
    url('https://dk0xyuea3a8kt.cloudfront.net/khaite/fonts/gaillard.woff') format('woff'), /* Pretty Modern Browsers */
    url('https://dk0xyuea3a8kt.cloudfront.net/khaite/fonts/gaillard.ttf')  format('truetype'); /* Safari, Android, iOS */
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gaillard';
    src: url('https://dk0xyuea3a8kt.cloudfront.net/khaite/fonts/gaillard-italic.eot'); /* IE9 Compat Modes */
    src: url('https://dk0xyuea3a8kt.cloudfront.net/khaite/fonts/gaillard-italic.woff2') format('woff2'), /* Super Modern Browsers */
    url('https://dk0xyuea3a8kt.cloudfront.net/khaite/fonts/gaillard-italic.woff') format('woff'), /* Pretty Modern Browsers */
    url('https://dk0xyuea3a8kt.cloudfront.net/khaite/fonts/gaillard-italic.ttf')  format('truetype'); /* Safari, Android, iOS */
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

.hidden {
    display: none;
}

#loadImage {
    display: none !important;
}

#loadBackground {
    background-color: #000000 !important;
}

.permission-error {
    background-color: #000000 !important
}

/* iOS Permission Container */
#loadingContainer > #requestingCameraPermissions {
    font-family: Fakt;
    color: #FFFFFF;
    text-transform: none;
    background-color: #000000 !important;
    font-size: 1rem;
}

/* iOS Permission Error */
#loadingContainer > #cameraPermissionsErrorApple {
    /*font-family: Fakt;*/
    font-family: Fakt;
    text-transform: none;
    background-color: #000000 !important;
    font-size: 0.6rem;
    text-align: center;
}

#loadingContainer > #cameraPermissionsErrorApple > p {
    width: 60%;
    margin: 3rem auto;
}

/* Android Permission Error */
#loadingContainer > #cameraPermissionsErrorAndroid {
    background-color: #000000 !important;
    font-family: Fakt;
    font-size: 0.6rem;
    text-align: center;
}

/* Android Permission Error Bullets */
#loadingContainer > #cameraPermissionsErrorAndroid .loading-error-instructions>li:before {
    background-color: #000000;
}

#loadingContainer > #deviceMotionErrorApple .loading-error-instructions > li {
    font-family: Fakt;
}

#loadingContainer > #userPromptError {
    font-family: Fakt;
}

#loadingContainer > #userPromptError > button {
    background-color: #7F83A2;
    color: #FFFFFF;
}

#loadingContainer > #motionPermissionsErrorApple {
    font-family: Fakt;
}

#loadingContainer > #cameraSelectionWorldTrackingError {
    background-color: #000000;
    font-family: Fakt;
}

#loadingContainer > #deviceMotionErrorApple .loading-error-instructions>li:before {
    background-color: #000000;
}

#loadingContainer > #linkOutViewAndroid > .error-text-outer-container .start-ar-button {
    background-color: #000000;
    color: #FFFFFF;
}

#loadingContainer > #copyLinkViewAndroid > .error-text-outer-container .error-text-container > span > h2 {
    font-family: Fakt;
}

#loadingContainer > #copyLinkViewAndroid > .error-text-outer-container .error-text-container .copy-link-btn {
    font-family: Fakt;
    background-color: #7F83A2;
    color: #FFFFFF;
}

/*#loadingContainer > #copyLinkViewAndroid > .error-text-outer-container .error-text-container .copy-link-btn {*/
/*    font-family: Fakt;*/
/*    background-color: gray;*/
/*    color: #FFFFFF;*/
/*}*/

#requestingCameraIcon {
    /* This changes the image from white to black */
    filter: invert(1);
}

.prompt-box-8w,
.prompt-box-8w-iframe {
    width: 80vw; 
    height: 35vh;
    /*font-family: Fakt;*/
    /*font-size: 0.75rem;*/
    text-transform: uppercase;
    font-size: 1.5rem;
    font-family: Gaillard;
    line-height: 1.5;
    background-color: #FFFFFF !important;
    color: #000000 !important;
    border-radius: 0px !important;
}

.prompt-box-8w strong,
.prompt-box-8w-iframe strong {
    font-size: 1.25rem !important;
}

.prompt-box-8w p,
.prompt-box-8w-iframe p {
    text-transform: none !important;
}

.prompt-box-8w .italic,
.prompt-box-8w-iframe .italic {
    font-style: italic !important;
    font-size: 1.25rem !important;
}

.prompt-box-8w .small,
.prompt-box-8w-iframe .small {
    font-family: Fakt !important;
    font-size: 0.75rem !important;
    margin: 2rem 0 !important;
}

.prompt-button-8w,
.prompt-button-8w-iframe {
    font-family: Fakt !important;
    font-size: 0.75rem !important;
    background-color: #ffffff !important;
    color: #000000 !important;
    border-radius: 0px !important;
    border: 1px solid black !important;
    padding: 0.75rem !important;
}

.button-primary-8w,
.button-primary-8w-iframe {
    font-family: Fakt !important;
    background-color: #000000 !important;
    color: #FFFFFF !important;
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 1) !important;
    border: none !important;
    transition: background-color 0.3s ease-out !important;
}

.prompt-box-8w::before,
.prompt-box-8w-iframe::before {
    content: 'THE AR EXPERIENCE';
    font-size: 1.25rem !important;
    position: absolute;
    top: 2rem;
    left: 0;
    right: 0;
}

.prompt-box-8w::after,
.prompt-box-8w-iframe::after {
    content: 'Spring/Summer 2021';
    font-style: italic !important;
    font-size: 1.25rem !important;
    position: absolute;
    top: 4rem;
    left: 0;
    right: 0;
}

.prompt-box-8w p,
.prompt-box-8w-iframe p {
    font-family: Fakt !important;
    font-size: 0.75rem !important;
    margin: 7rem 0 2rem 0 !important;
    text-transform: none !important;
}