/* ========================== */
/* ===        START       === */
/* ========================== */


.start_contain {
    transition: opacity 2s ease;
    opacity: 0;
}
.start_contain.show {
    opacity: 1;
}
.start, .start_contain, .start_presents, .start_title, .start_subtitle, .start_mission {
    position: absolute;
    height: 100vh;
    width: 100vw;
    display: flex;
    justify-content: center;
    align-items: center;
    user-select: none;
    cursor: none;
}
.start h3 {
    line-height: 2em;
    letter-spacing: .15em;
    font-size: 1.5em;
}
.start_contain {
    cursor: pointer;
    z-index: 10000;
    display: flex; /*um*/
}
.start_contain > h3 {
    animation: start_text 2s ease-in-out infinite;
}
.start_presents {
    opacity: 0;
    display: none; /*dois*/
    animation: start_text_opacity 6s ease-in-out;
}
.start_title {
    opacity: 0;
    display: none; /*tres*/
    animation: start_text_opacity 6s ease-in-out;
}
.start_subtitle {
    opacity: 0;
    display: none; /*quatro*/
    animation: start_text_opacity 6s ease-in-out;
}
.video {
    height: 100vh;
    width: 100vw;
    display: flex;
    align-items: center;
    justify-content: center;
}
.video > video {
    visibility: hidden; /*cinco*/
    opacity: 0;
    height: 100%;
    width: 100%;
    opacity: .4;
    object-fit: cover;
}
.speaks {
    height: 100vh;
    width: 100vw;
    position: absolute;
    bottom: 150px;
    display: flex;
    align-items: end;
    justify-content: center;
}
#speak01 {
    display: none;
    opacity: 0;
    animation: start_text_opacity 6s ease-in-out;
}
#speak02 {
    display: none;
    opacity: 0;
    animation: start_text_opacity 5s ease-in-out;
}
#speak03 {
    display: none;
    opacity: 0;
    animation: start_text_opacity 5s ease-in-out;
}
#speak04 {
    display: none;
    opacity: 0;
    animation: start_text_opacity 6s ease-in-out;
}
#speak05 {
    display: none;
    opacity: 0;
    animation: start_text_opacity 7s ease-in-out;
}
#speak06 {
    display: none;
    opacity: 0;
    animation: start_text_opacity 6s ease-in-out;
}
#speak07 {
    display: none;
    opacity: 0;
    animation: start_text_opacity 5s ease-in-out;
}
.speaks > p {
    text-align: center;
    width: 800px;
    letter-spacing: .12em;
    font-weight: 700;
    color: #fff;
    text-shadow: 0 0 20px #4EFFFF, 0 0 10px #4EFFFF, 0 0 2px #4EFFFF, 0 0 1px #4EFFFF;
    font-size: 1.7em;
}
.start_mission {
    display: none; /*cinco*/
}
.start_mission_height {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    width: 100%;
}
.start_mission_type {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    gap: 10px;
    opacity: 0;
    animation: mission_left 3.8s ease-in;
}
.start_mission_svg_wrapper {
    width: 50px;
}
.start_mission_type_wrapper > h2 {
    letter-spacing: .03em;
}
.start_mission_overlay { 
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 30;
    width: 100%;
    height: 125px;
    margin: 10px 0;
}
.start_mission_overlay::after {
    content: '';
    position: absolute;
    width: 0px;
    height: 100%;
    background-color: #dbe3a00a;
    animation: mission_all_left 4s ease-in;
}
.start_mission_overlay {
    position: relative;
}
.start_mission_overlay::before {
    content: '';
    position: absolute;
    width: 0px;
    height: 110px;
    background-color: #dbe3a050;
    animation: mission_all_left 4s ease-in;
}
.start_mission_overlay_wrapper > h1 {
    position: absolute;
    font-family: 'Hylia', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-style: italic;
    width: 100%;
    z-index: 1;
    text-align: center;
    font-weight: 100;
    font-size: 6em;
    word-spacing: .1em;
    color: #0C0C0Cd0;
    position: relative;
    letter-spacing: .005em;
    opacity: 0;
    animation: mission_left 3.8s ease-in;
}
.start_mission_objective {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    animation: objective 4s ease-in;
    position: relative;
    padding: 25px;
    margin-top: -50px;
}
.objective_icon {
    height: 22px;
    width: 22px;
    margin-right: -15px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    padding: 25px;
    aspect-ratio: 1/1;
}
.objective_icon::after {
    content: '';
    z-index: 3000;
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 2px solid #CFA834;
    box-shadow: 0 0 3px #CFA83490, inset 0 0 3px #CFA83490;
    position: absolute;
    background-color: transparent;
    animation: borderSelected 1.3s ease-out infinite;
}
.start_mission_objective > svg {
    filter: drop-shadow(0 0 5px #f9d00860) drop-shadow(0 0 4px #f9d10860) drop-shadow(0 0 2px #f9d10860);
    width: 20px;
}
.start_mission_objective > p {
    font-size: 1.2em;
    color: #f9d008;
}