html {
    font-size: 62.5%;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5 {
    margin: 0 0 1.5rem 0;
    font-family: "IBM Plex Sans", sans-serif;
}
h1 {
    font-size: 5rem;
}

h2 {
    font-size: 4rem;
}

h3 {
    font-size: 3rem;
}

h4 {
    font-size: 2rem;
}
.h2_red{
    color: #D72305;
}
.h3_red{
    color: #D72305;
}
.h4_red{
    color: #D72305;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    font-size: 1.7rem;
    line-height: 2.8rem;
    font-family: "IBM Plex Sans", sans-serif;/* 总风格 */
    color: black;
}

a{
    text-decoration: none;
}
/*-----------------------------------------------Button-----------------------------------------*/
.button-white {
    font-size: 1.125rem;
    background: white;
    display: inline-block;
    border: 2px solid #D72305;
    cursor: pointer;
    padding: 5px 12px;
    line-height: 1.5;
    color: #D72305;
    text-align: center;
    width: auto;
}
.button-white:hover {
    color: white;
    border: 2px solid #D72305;
    background-color: #D72305;
}

.button-red {
    font-size: 1.125rem;
    background: #D72305;
    display: inline-block;
    border: 2px solid #D72305;
    cursor: pointer;
    padding: 5px 12px;
    line-height: 1.5;
    color: white;
    text-align: center;
    width: auto;
}
.button-red:hover {
    color: #D72305;
    border: 2px solid #D72305;
    background-color: white;
}

.button-logout {
    font-size: 1.125rem;
    background: white;
    display: inline-block;
    border: 2px solid #D72305;
    cursor: pointer;
    padding: 5px 12px;
    line-height: 1.5;
    color: #D72305;
    text-align: center;
    width: auto;
}

.button-logout:hover {
    color: white;
    border: 2px solid #D72305;
    background-color: #D72305;
}

/*-----------------------------------------------container-----------------------------------------*/
.container{
    height: auto;
    padding: 2rem 0;
    margin: auto;
}

/*-----------------------------------------------Header-----------------------------------------*/
.header {
    background-color: #f4f4f4;
    padding: 20px 15px;
    height: 200px;
    overflow: visible;
    position: relative;
}
.header a {
    /*float: left;*/
    color: black;
    text-align: center;
    margin: 20px;
    text-decoration: none;
    font-size: medium;
    box-sizing: border-box;
}
.header a:hover {
    background-color: #ddd;
    color: black;
}
.header h1 {
    /*float: right;*/
    color: black;
    text-align:left;
    margin: 5px 46px;
    text-decoration: none;
    font-size: x-large;
/*    line-height: 25px; */
    font-family: "Meta", Arial, sans-serif;
}


#logo_mobile {display: none;}
#logo {display: block; height:auto; width: 230px;}
#logo_right {height:auto; width: 80px; position: absolute; top:60px; right: 15px;}

#mobile_title {display: none;}
#main_title {display: block;}
/*-------------------------------------------------------------------------------------------------------*/

/*-----------------------------------------------Footer--------------------------------------------------*/
.footer {
    position: fixed;
    left: 0;
    bottom: 3px;
    width: 100%;
    height:40px;
    background-color: #D72305;
    color: white;
    text-align: center;
    line-height: 40px;
    font-size: 12px;
}

.distance {
    width: 100%;
    min-height: 5%;
}
.footer a {
    color: white;
    text-align: center;
    margin: 12px;
    text-decoration: none;
    font-size: 15px;
    line-height: 40px;
}

.footer a:hover {
    text-decoration: underline;
}

#imprint_data{
    position: fixed;
    left: 30px;
}

/*-------------------------------------------------------------------------------------------------------*/

/*-------------------------------------------Index-------------------------------------------------------*/
.index_information {
    display: flex;
    justify-content: center;
    width: 250px;
    margin: 0 auto;
    background:#f5f5f5;
}

.index_information .item {
    flex-grow: 1;
}

.index_information a {
    color: #666;
    text-align: right;
    padding: 12px;
    text-decoration: none;
    font-size: 18px;
    line-height: 25px;
    border-radius: 4px;
}
.index_information button {
    background: #D72305;
    font-size: 16px;
    border: 2px solid #D72305;
    cursor: pointer;
    padding: 5px 10px;
    color: #fff;
    text-align: center;

}
.index_information button:hover {
    color: #D72305;
    border: 2px solid #D72305;
    background-color: white;
}
/*-----------------------------------------------------------------------------------------------*/

/*-------------------------------------------Login SignUp----------------------------------------*/
.login-invite {
    font-family: "Arial", sans-serif;
    font-size: 19px;
    font-weight: bold;
    color: #222;
    text-align: center;
    margin: 15px auto;
}

.login-title {
    font-size: 24px;
    margin-bottom: 30px;
    font-weight: 500;
    color: #333;
}

.login-buttons {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-top: 20px;
}

.information_box {
    width: 300px;
    height: auto;
    margin: auto;
    margin-top: 20px;
    background:#f5f5f5;
    box-sizing: border-box;
    padding: 20px;
    position: relative;
    bottom: -50px;
}

.information_box_g {
    width: 350px;
    height: auto;
    margin: 45px auto;
    background:#f1f1f1;
    padding: 50px;
}

.information_box_g h1 {
    color: black;
    width: fit-content;
    text-align: center;
    font-size: 2.25rem;
    font-family: "Meta", Arial, sans-serif;
    padding: 5px 5px;
    margin: 0 auto 24px;
}

.information_box_g h4 {
    float: left;
    color: #666;
    text-align: left;
    font-size: 10px;
    line-height: 10px;
    border-radius: 4px;
    font-family: "Meta", Arial, sans-serif;
    padding: 2px 2px 2px 15px;
}

.information_box_g p{
    color: #666666;
    margin-bottom: 10px;
}
.information_box_g label {
    display: block;
    font-weight: 700;
    font-size: 1.5rem;
    color: black;
}
.information_box_g input, select, textarea {
    width: 100%;
    padding: 10px;
    background-color: #f5f5f5;   /* 浅灰背景 */
    border: none;
    border-bottom: 3px solid #999;  /* 只留底部边框 */
    outline: none;
    font-size: 16px;
    box-sizing: border-box;
    transition: border-color 0.3s;
}

.information_box_g button {
    font-size: 1.125rem;
    background: #D72305;
    display: inline;
    border: 2px solid #D72305;
    cursor: pointer;
    padding: 5px 5px;
    line-height: 1.5;
    color: #fff;
    text-align: center;
    width: 80px;
}
.information_box_g button:hover {
    color: #D72305;
    border: 2px solid #D72305;
    background-color: white;
}

.action-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-top: 25px;
}

.forgot-link {
    text-align: center;
    text-decoration: none;
    color: #555;
    font-size: 1.25rem;
    cursor: pointer;
}

.forgot-link:hover {
    text-decoration: underline;
}


/*-----------------------------------------------------------------------------------------------*/

/*-------------------------------------------Landing Page----------------------------------------*/

/*---Border for Body-----*/
.information_login{
    width:98%;
    margin:0 auto;
    background:#ffffff;
    padding: 5px 5px 20px 5px;
}
.info_header button {
    font-size: 1.125rem;
    background: white;
    display: inline-block;
    border: 2px solid #D72305;
    cursor: pointer;
    padding: 5px 5px;
    line-height: 1.5;
    color: #D72305;
    text-align: center;
    width: 80px;
}
.info_header button:hover {
    color: white;
    border: 2px solid #D72305;
    background-color: #D72305;
}

.notes{
    width:98%;
    padding: 20px 2rem;
    margin:2rem auto;
    background-color: #f1f1f1;
}
.notes a{
    color: #D72305;
}

.classic_container{
    width:98%;
    max-width: 1120px;
    height: auto;
    padding: 2rem 0;
    margin: auto;
}
.info_header_1
{
    display: flex;
    justify-content: space-between;
    max-width: 1120px;
    height: auto;
    padding: 2rem 0;
    margin: auto;
}
.left_info_header_1 {
    text-align: left;
}
.right_info_header_1 {
    text-align: right;
}
.info_header_2{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    max-width: 1120px;
    height: auto;
    padding: 2rem 0;
    margin:auto;
}
.info_header_2 a{
    color: #D72305;
    font-weight: bold;
}
.info_header_2 a:hover{
    color: black;
    font-weight: bold;
}
.info_gmcm{
    background-color: white;
    border: 2px solid #D72305;
    padding: 2.4rem 2.8rem;
    width: 49%;
}
.info_sstm{
    background-color: white;
    border: 2px solid #D72305;
    padding: 2.4rem 2.8rem;
    width: 49%;
}

.left_info_header h2 {
    text-align: left;
}

input#gmcm {display: none;}
input#sstm {display: none;}
span#gmcm_info {display: none;}
span#sstm_info {display: none;}
input#gmcm:checked ~ span#gmcm_info {display: inline-block;}
input#sstm:checked ~ span#sstm_info {display: inline-block;}

.admin_container{
    max-width: 1120px;
    height: auto;
    padding: 2rem 0;
    margin: auto;
}
.admin_button{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 1120px;
    height: auto;
    padding: 2rem 0;
    margin: auto;
}

.admin_button button{
    font-size: 2rem;
    background: #D72305;
    display: inline-block;
    border: 2px solid #D72305;
    cursor: pointer;
    padding: 2rem 2rem;
    margin-bottom: 20px;
    line-height: 1.5;
    color: white;
    text-align: center;
    width:  550px;
    height: auto;
}

.admin_button button:hover {
    color: #D72305;
    border: 2px solid #D72305;
    background-color: white;
}

/*                                              Welcome Page                                                      */
.welcome-information-container{
    max-width: 1120px;
    height: auto;
    padding: 2rem 0;
    margin: auto;
    /*background-color: #f1f1f1;*/
}
.welcome-information-row-1{
    text-align: center;
}

.welcome-information-row-2{
    height: auto;
    padding: 2rem 2.8rem;
    margin: auto;
}
.welcome-information-row-3{
    width: 40%;
    height: auto;
    margin: auto;
}
.welcome-information-row-2 a{
    color: #D72305;
    font-weight: bold;
}
.welcome-information-row-3 input{
    display: inline-block;
    width: 100%;
    padding: 10px;
    background-color: #f5f5f5;
    border: none;
    border-bottom: 3px solid #999;
    outline: none;
    font-size: 16px;
    box-sizing: border-box;
    transition: border-color 0.3s;
}
.welcome-information-row-3 button{
    background: #D72305;
    font-size: 16px;
    border: 2px solid #D72305;
    cursor: pointer;
    padding: 5px 10px;
    color: #fff;
    text-align: center;
}
.welcome-information-row-3 button:hover{
    color: #D72305;
    border: 2px solid #D72305;
    background-color: white;
}
.welcome-information-row-3 label {
    display: inline-block;
    font-weight: 700;
    font-size: 1.5rem;
    color: black;
}
.welcome-information-row-4{
    padding: 4rem 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.welcome-information-row-4 button{
    font-size: 2rem;
    background: white;
    display: inline-block;
    border: 2px solid #D72305;
    cursor: pointer;
    padding: 2rem 2rem;
    margin-bottom: 20px;
    line-height: 1.5;
    color: #D72305;
    text-align: center;
    width:  550px;
    height: auto;
}
.welcome-information-row-4 button:hover {
    color: white;
    border: 2px solid #D72305;
    background-color: #D72305;
}


.welcome-information {
    width:80%;
    background:#f1f1f1;
    display: inline-block;
    margin: 80px 1px;
    box-shadow: inset 2px 2px 2px 0 rgba(0,0,0,0.1), 2px 2px 2px 0 rgba(0,0,0,0.1);
    box-sizing: border-box;
    padding: 20px 5px;
    text-align: center;
    position: static;
}

.welcome-information button {
    background: #f1f1f1;
    display: inline-block;
    border: 1px solid #990b24;
    border-radius: 5px;
    box-shadow: inset 2px 2px 2px 0 rgba(0,0,0,0.1), 2px 2px 2px 0 rgba(0,0,0,0.1);
    cursor: pointer;
    padding: 5px 20px;
    line-height: 1.5;
    color: #990b24;
    text-align: center;
}

.welcome-information button:hover {
    border-right: #666666;
    border-left: #666666;
    border-top: #666666;
}

.welcome-information table {
    font-family: "Meta", Arial, sans-serif;
    border-collapse: collapse;
    width: 100%;
}
.welcome-information td, th {
    padding: 8px;
    width: 50%
}
.welcome-information tr:nth-child(even) {background-color: #dddddd;}

.welcome-form {
    border: 1px solid #D72305;
    border-radius: 5px;
    margin: 10px;
    background: #ffffff;
    box-shadow: inset 2px 2px 2px 0 rgba(0,0,0,0.1), 2px 2px 2px 0 rgba(0,0,0,0.1);
    box-sizing: content-box;
    padding: 20px;
}


input#additional-docs {display: none;}
table#additional-docs-table {display: table;}
input#additional-docs:checked ~ table#additional-docs-table {display: inline-block;}

.view{
    color: #D72305;
}
.view:hover{
    font-size: 1.5rem;
}

#doc_label {
    display: inline-block;
    font-size: 1.7rem;
    color: #D72305;
}

#doc_label_cell {
    width: 50%;
}

#doc_label_input {
    width: 50%;
}

.upload-add-docs-form label{
    color: #D72305;
    font-weight: bold;
    display: inline-block;
}

.upload-add-docs-form input, select, textarea {
    float: left;
    text-align: left;
    color: #000000;
}
.upload-add-docs-form input[type=text]{
    border: 2px solid #D72305;
    padding: 10px 10px 10px 10px;
}

.upload-add-docs-form input[type=file]::-webkit-file-upload-button {
    background: #fff;
    display: inline-block;
    border: 2px solid #D72305;
    cursor: pointer;
    padding: 5px 20px;
    line-height: 1.5;
    color: #D72305;
    text-align: center;
}

.upload-add-docs-form input[type=file]::-webkit-file-upload-button:hover {
    border: 2px solid #D72305;
    background-color: #D72305;
    color:white;
}
#submit-add-docs{
    border: 2px solid #D72305;
    color: #D72305;
    background-color: white;
    padding: 10px 10px;
    cursor: pointer;
}
#submit-add-docs:hover{
    border: 2px solid #D72305;
    color: white;
    background-color: #D72305;
}

#back-button {
    color: #D72305;
    text-align: left;
    font-size: 2rem;
    line-height: 5px;
}

#back-button:hover {
    font-size: 1.8rem;
}

/*--------------------------------------------------------Form-----------------------------------------------------*/

.inside_information {
    max-width: 1120px;
    height: auto;
    padding: 2rem 0;
    margin: 2rem auto;
}

.inside_information table {
    font-family: "Meta", Arial, sans-serif;
    border-collapse: collapse;
    width: 100%;
}
.inside_information td, th {
    border-bottom: 3px solid #f5f5f5;
    text-align: left;
    padding: 8px;
    width: 50%
}
/*.inside_information tr:nth-child(even) {background-color: #dddddd;}*/

.firstform label{
    color: #D72305;
    font-weight: bold;
    display: inline-block;
}

.firstform input, select, textarea {
    float: left;
    padding: 10px 10px 10px 10px;
    text-align: left;
    box-sizing: border-box;
    margin-bottom: 10px;
    border: 1px solid #D72305;
    border-radius: 5px;
    font-family: "Meta", Arial, sans-serif;
    color: #000000;
}

.firstform input[type=file]::-webkit-file-upload-button {
    background: #fff;
    display: inline-block;
    border: 1px solid #D72305;
    border-radius: 5px;
    box-shadow: inset 2px 2px 2px 0 rgba(0,0,0,0.1), 2px 2px 2px 0 rgba(0,0,0,0.1);
    cursor: pointer;
    padding: 5px 20px;
    line-height: 1;
    color: #D72305;
    text-align: center;
}

.firstform input[type=file]::-webkit-file-upload-button:hover {
    border-right: #666666;
    border-left: #666666;
    border-top: #666666;
}

input#uploaded[type=file] {
    content: 'Test';
}

#row1col1 {width: 95%;}
#row1col2 {width: 5%;}
#row2col1 {width: 95%;}

.secondform label{
    color: #D72305;
    font-weight: bold;
    display: inline-block;
}

.secondform input, select, textarea {
    float: left;
    padding: 10px 10px 10px 10px;
    text-align: left;
    box-sizing: border-box;
    margin-bottom: 10px;
    border: 1px solid #D72305;
    border-radius: 5px;
    font-family: "Meta", Arial, sans-serif;
    color: #000000;
}

#degree_awarded_field {
    display: inline-block;
    float:left;
}
#degree_awarded_field label{
    color: #666;
    float: left;
    font-weight: bold;
    font-size: 13px;
    font-family: "Meta", Arial, sans-serif;
    display: block;
    padding-top: 1px;
    padding-right: 15px;

}

#enrollment_in_de_field {
    display: inline-block;
    float:left;
}
#enrollment_in_de_field label{
    color: #666;
    float: left;
    font-weight: bold;
    font-size: 13px;
    font-family: "Meta", Arial, sans-serif;
    display: block;
    padding-top: 1px;
    padding-right: 15px;
}

input#secondpage_enrollment_in_de {display: inline-block;}

span#secondadditionalform {display: none;}

input#secondpage_enrollment_in_de:checked ~ span#secondadditionalform {display: block;}

#de_degree_awarded_field {
    display: inline-block;

}
#de_degree_awarded_field label{
    color: #666;
    float: left;
    font-weight: bold;
    font-size: 13px;
    font-family: "Meta", Arial, sans-serif;
    display: block;
    padding-top: 1px;
    padding-right: 15px;

}

.thirdform label{
    color: #D72305;
    font-weight: bold;
    display: inline-block;
}

.thirdform p {
    font-family: "Meta", Arial, sans-serif;
    color: #000;
    font-size: 16px;
}

.thirdform select, textarea {
    float: left;
    padding: 10px 10px 10px 10px;
    text-align: left;
    box-sizing: border-box;
    margin-bottom: 10px;
    border: 1px solid #D72305;
    border-radius: 5px;
    font-family: "Meta", Arial, sans-serif;
    color: #666;
}

.thirdform input {
    background: #fff;
    display: inline-block;
    border: 1px solid #D72305;
    border-radius: 5px;
    box-shadow: inset 2px 2px 2px 0 rgba(0,0,0,0.1), 2px 2px 2px 0 rgba(0,0,0,0.1);
    cursor: pointer;
    padding: 5px 20px;
    line-height: 1.5;
    color: #D72305;
    text-align: center;
    float: right;
}
.thirdform input:hover {
    border-right: #666666;
    border-left: #666666;
    border-top: #666666;
}


dt {
    display: inline-block;
    font-family: "Meta", Arial, sans-serif;
    font-size: 0.75vw;
    color: #D72305;
    font-weight: bold;
    padding-bottom: 5px;
}

#firstpage_course_field, #firstpage_year_of_joining_field, #firstpage_gender_field, #firstpage_title_field,
#firstpage_surname_field, #firstpage_fullname_field, #firstpage_photo_field, #firstpage_dob_field,
#firstpage_birthplace_field, #firstpage_nationality_field, #firstpage_additionalinfo_field, #firstpage_street_field,
#firstpage_housenumber_field, #firstpage_postalcode_field, #firstpage_city_field, #firstpage_country_field,
#firstpage_email_field, #firstpage_phonenumber_field, #secondpage_previous_institution_field, #upload_file_frame,
#secondpage_city_of_institution_field, #secondpage_gained_mark_field, #secondpage_best_mark_field,
#secondpage_pass_mark_field, #secondpage_previous_course_field, #from_field, #to_field, #uploaded_field,
#secondadditionalpage_de_institution_field, #secondadditionalpage_de_course_field, #de_from_field, #de_to_field {
    display: inline-block;
    padding-right: 20px;
}

.error {
    font-family: "Meta", Arial, sans-serif;
    font-size: 10px;
    color: red;
    text-align: left;
    display: inline-block;
}


.inside_information h4 {
    display: block;
}

.inside_information h5 {
    display: inline-block;
    font-size: 15px;
    font-family: "Meta", Arial, sans-serif;
    margin-top: 10px;
    padding-right: 50px;
}

.upload-button {
    background: #fff;
    display: inline-block;
    border: 1px solid #D72305;
    border-radius: 5px;
    box-shadow: inset 2px 2px 2px 0 rgba(0,0,0,0.1), 2px 2px 2px 0 rgba(0,0,0,0.1);
    cursor: pointer;
    padding: 5px 20px;
    line-height: 1.5;
    color: #D72305;
    text-align: center;
}
.upload-button:hover {
    border-right: #666666;
    border-left: #666666;
    border-top: #666666;
}

#upload-text {
    text-align: center;
}


.info {
    display: inline-block;
    font-family: "Meta", Arial, sans-serif;
    color: #D72305;
    font-size: 5px;
    margin-inline-start: 0;
}

/*--------------------------------------------Upload Documents-----------------------------------------*/

#bullets {
    text-align: left;
}
.table-container{

}
.row-container{
    display: flex;
    justify-content: space-between;
    border-bottom:3px solid #f1f1f1;
    padding-bottom: 10px;
    padding-top: 10px;
}
.column-container-1{
    color: #D72305;
    width: 50%;
}
.column-container-1 input[type="text"] {
    width: 50%;
    padding: 5px 5px;
    font-size: 1.7rem;
    border: 2px solid #D72305;
    background-color: #fff;
}
.column-container-2{
    width: 30%;
    font-size: 1.7rem;
}
.upload-docs-form {
    font-weight: bold;
    padding: 10px 10px 10px 10px;
}
.docview {
    color: #D72305;
    font-weight: bold;
    padding: 10px 10px 10px 10px;
}
.docview a{
    color: #D72305;
    text-align: left;
    font-size: 1.7rem;
    line-height: 5px;
}

.docview a:hover {
    font-size: 1.5rem;
}

.upload-docs-form label{
    color: #D72305;
    font-weight: bold;
    display: inline-block;
}

.upload-docs-form input, select, textarea {
    float: left;
    padding: 10px;
    display: inline-block;
    text-align: left;
    color: #000000;
}

.upload-docs-form input[type=file]::-webkit-file-upload-button {
    background: #fff;
    display: inline-block;
    border: 1px solid #990b24;
    border-radius: 5px;
    box-shadow: inset 2px 2px 2px 0 rgba(0,0,0,0.1), 2px 2px 2px 0 rgba(0,0,0,0.1);
    cursor: pointer;
    padding: 5px 20px;
    line-height: 1.5;
    color: #990b24;
    text-align: center;
}

.upload-docs-form input[type=file]::-webkit-file-upload-button:hover {
    border-right: #666666;
    border-left: #666666;
    border-top: #666666;
}

#submit-docs {
    background: #fff;
    display: inline-block;
    border: 1px solid #990b24;
    border-radius: 5px;
    box-shadow: inset 2px 2px 2px 0 rgba(0,0,0,0.1), 2px 2px 2px 0 rgba(0,0,0,0.1);
    cursor: pointer;
    padding: 5px 20px;
    line-height: 1.5;
    color: #990b24;
    text-align: center;
    float: right;
}
#submit-docs:hover {
    border-right: #666666;
    border-left: #666666;
    border-top: #666666;
}

#additional-docs {
    background: #fff;
    display: inline-block;
    border: 1px solid #990b24;
    border-radius: 5px;
    box-shadow: inset 2px 2px 2px 0 rgba(0,0,0,0.1), 2px 2px 2px 0 rgba(0,0,0,0.1);
    cursor: pointer;
    padding: 5px 20px;
    line-height: 1.5;
    color: #990b24;
    text-align: center;
    float: left;
}
#additional-docs:hover {
    border-right: #666666;
    border-left: #666666;
    border-top: #666666;
}

input#additional_docs {display: none;}
span#additional_docs_info {display: none;}
input#additional_docs:checked ~ span#additional_docs_info {display: inline-block;}



@media screen and (max-width: 1120px){
    .welcome-information-row-4{
        justify-content: center;
    }
    .admin_button{
        justify-content: center;
    }
}

/*--------------------------------------- Pad ------------------------------------------------*/
@media screen and (max-width: 768px) {

    .header a.logo {
        width: 30vw;
    }

    .header img.logo {
        width: 100%;
    }

    #logo_right {height:auto; width: 10vw; float: right; margin-top:60px; }

    #logo_mobile {
        display: block;
    }

    #logo {
        display: none;
    }

    .header h1 {
        color: black;
        text-align:left;
        margin: 5px 46px;
        text-decoration: none;
        font-size: clamp(18px, 4vw, 24px);
        font-family: "Meta", Arial, sans-serif;
        width: 60vw;
    }

    #mobile_title {
        display: none;
    }
    #main_title {
        display: block;
    }

    .info_header_2{
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        height: auto;
        padding: 2rem 0;
        margin:auto;
    }
    .info_gmcm{
        background-color: white;
        border: 2px solid #D72305;
        padding: 2.4rem 2.8rem;
        margin: 1rem 0;
        width: 80%;
    }
    .info_sstm{
        background-color: white;
        border: 2px solid #D72305;
        padding: 2.4rem 2.8rem;
        margin: 1rem 0;
        width: 80%;
    }
    .admin_button button{
        width: 480px;
    }
    .welcome-information-row-4 button{
        max-width: 550px;
        width: 90%;
    }

    .row-container{
        flex-wrap: wrap;
    }
    .column-container-1{
        width: 550px;
    }


    /*-------------------------------------------footer----------------------------------------*/
    .footer {
        line-height: 60px;
        text-align: right;
        font-size: 10px;
    }
    #imprint_data{
        position: fixed;
        left: 30px;
        bottom: 2px;
    }

    #user-login-form label {
        float: left;
        text-align: left;
        font-size: 3vw;
        font-weight: bold;
        padding: 20px 12px 12px 0;
        display: inline-block;
        font-family: "Meta", Arial, sans-serif;
        color: #666;
    }

}

/*--------------------------------------- Handy ------------------------------------------------*/
@media screen and (max-width: 480px){

    .header a.logo {
        width: 150px;
    }

    .header img.logo {
        width: 100%;
    }

    #logo_right {height:auto; width: 50px; float: right; margin-top:60px; }

    #logo_mobile {
        display: block;
    }

    #logo {
        display: none;
    }

    .header h1 {
        color: black;
        text-align:left;
        margin: 5px 40px;
        text-decoration: none;
        font-size: clamp(18px, 4vw, 24px);
        font-family: "Meta", Arial, sans-serif;
        /*width: 60vw;*/
    }

    .admin_button button{
        width: 90%
    }

    .welcome-information-row-4 button{
        width: 90%;
    }
}