body {
    font-family: 'Roboto', sans-serif; /* Common Android font */
    background-color: #f5f5f5; /* Light grey background */
    margin: 0;
    padding: 0; /* Added: User requested */
    display: flex;
    flex-direction: column;
    align-items: center;
}
header {
    background-color: #2196F3; /* Android blue */
    color: white;
    padding: 20px;
    width: 100%;
    max-width: 1000px;
    text-align: center;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    margin-bottom: 30px;
    position: relative; /* For language switcher positioning */
    opacity: 0.8;
}
.about_us_class {
    background-color: #48baf3; /* Android blue */
    color: white;
    padding: 20px;
    width: 100%;
    max-width: 1000px;
    text-align: center;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    margin-bottom: 30px;
    position: relative; /* For language switcher positioning */
    opacity: 0.7;
}
.language-switcher {
    position: absolute;
    top: 10px;
    right: 20px;
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 5px;
    padding: 5px 10px;
}
.language-switcher select {
    background-color: transparent;
    color: white;
    border: none;
    padding: 5px;
    font-size: 1em;
    cursor: pointer;
    -webkit-appearance: none; /* Remove default dropdown arrow for better styling */
    -moz-appearance: none;
    appearance: none;
}
.language-switcher select option {
    color: black; /* Options should be visible */
    background-color: white;
}
h1 {
    color: #333; /* Heading color */
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: center;
    font-size: 2.5em;
}
.image-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    margin-bottom: 30px;
    max-width: 1000px;
    width: 100%;
}
.image-row img {
    border-radius: 12px; /* Rounded corners */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Shadow */
    object-fit: cover;
    width: 100%;
    max-width: 500px;
    height: auto;
}
/* Adjustments for larger images in the second row */
.image-row.large-images img {
    max-width: 700px;
}

/* Unity Container Specific Styles (from user input) */
#unity-container {
    position: relative; /* Updated: User requested */
    width: 100%;
    max-width: 960px;
    height: 600px;
    margin-bottom: 30px;
    border-radius: 12px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    background-color: #e0e0e0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
#unity-container.unity-desktop { /* Added: User requested */
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
#unity-container.unity-mobile { /* Added: User requested */
    position: fixed;
    width: 100%;
    height: 100%;
}
#unity-canvas {
    background: #231F20; /* Updated: User requested */
    width: 100%; /* Existing */
    height: 100%; /* Existing */
    display: block; /* Existing */
}
.unity-mobile #unity-canvas { /* Added: User requested */
    width: 100%;
    height: 100%;
}
#unity-loading-bar {
    position:absolute;
    left: 45%;
    right: 50%;
    top:auto;
    bottom: 50%; /* Updated: User requested */
    width: 15%; /* Existing */
    height: 20px; /* Existing */
    background-color: #ccc; /* Existing */
    border-radius: 10px; /* Existing */
    overflow: hidden; /* Existing */
}
#unity-progress-bar-empty {
    width: 141px; /* Updated: User requested */
    height: 18px; /* Updated: User requested */
    margin-top: 10px; /* Updated: User requested */
    margin-left: 6.5px; /* Updated: User requested */
    background: url('TemplateData/progress-bar-empty-dark.png') no-repeat center; /* Updated: User requested */
}
#unity-progress-bar-full {
    width: 0%; /* Existing */
    height: 18px; /* Updated: User requested */
    margin-top: 10px; /* Existing */
    background: url('TemplateData/progress-bar-full-dark.png') no-repeat center; /* Updated: User requested */
    border-radius: 10px; /* Existing */
}
#unity-footer {
    position: absolute; /* Updated: User requested */
    bottom: 0; /* Existing */
    width: 100%; /* Existing */
    display: flex; /* Existing */
    justify-content: space-between; /* Existing */
    align-items: center; /* Existing */
    padding: 10px; /* Existing */
    background-color: rgba(0, 0, 0, 0.5); /* Existing */
    color: white; /* Existing */
}
.unity-mobile #unity-footer { /* Added: User requested */
    display: none;
}
#unity-build-title {
    float: left; /* Updated: User requested */
    margin-right: 10px; /* Updated: User requested */
    line-height: 38px; /* Updated: User requested */
    font-family: arial; /* Updated: User requested */
    font-size: 18px; /* Updated: User requested */
    font-weight: bold; /* Existing */
}
#unity-fullscreen-button {
    cursor:pointer; /* Updated: User requested */
    float: left; /* Updated: User requested */
    width: 38px; /* Updated: User requested */
    height: 38px; /* Updated: User requested */
    background: url('TemplateData/fullscreen-button.png') no-repeat center; /* Updated: User requested */
    border-radius: 50%; /* Existing */
    /* background-color: #fff; Removed as per new background property */
}
#unity-warning {
    position: absolute; /* Updated: User requested */
    left: 50%; /* Updated: User requested */
    top: 5%; /* Updated: User requested */
    transform: translate(-50%); /* Updated: User requested */
    background: white; /* Updated: User requested */
    padding: 10px; /* Updated: User requested */
    display: none; /* Updated: User requested */
    /* Existing color: #f44336; Removed as per new background property */
}

