 /* ######### NEWS ######### */

.news_headline {text-align: center; font-size: 36px; font-family: 'Yeseva One', cursive; letter-spacing: 0.5pt; font-weight: bold; text-transform: uppercase; height: 30px; color: var(--schwarz); margin: 30px 30px 10px 30px; display: flex;}
.news_headline_small {text-align: center; font-size: 14px; font-family: 'Yeseva One', cursive; letter-spacing: 2pt; text-transform: uppercase; margin-top: 30px; color: var(--schwarz);}
.news_headline::before {height: 1px; flex-grow: 1; content:''; background-color: var(--accent1); margin: 10px 10px 0px 0px}
.news_headline::after {height: 1px; flex-grow: 1; content:''; background-color: var(--accent1); margin: 10px 0px 0px 10px}

.news_title {font-family: 'Yeseva One', cursive; font-size: 18px; font-weight: 400; text-transform: uppercase; letter-spacing: 0.3pt;  padding: 5px 5px 5px 0;}

.news_text {text-align: justify; padding: 20px 30px 20px 30px; line-height: 26px; letter-spacing: 0.5pt;}

.news_subtext {margin: 0 20px 0 50px; padding: 0 0 0 20px; border-left: 2px solid var(--accent1);}
.news_text a {font-weight: bold; text-transform: uppercase;}


/* ######### LISTEN ######### */
.list_menu { padding: 20px; margin-bottom: 50px;}
.list_menu a {font-size: 10px; color: var(--schwarz); text-transform: uppercase; letter-spacing: 1.5pt; padding: 4px 8px 4px 8px; border: 1px solid var(--schwarz); margin: 3px 1px 3px 1px; display: inline-block;}
.list_menu a:hover {opacity: 0.6;}
.list_title { text-transform: uppercase; background: var(--hell); font-family: 'Frank Ruhl Libre', serif; font-size: 14px; letter-spacing: 2px; font-weight: 600; opacity: 0.7; padding: 10px;}
.list_text {padding-bottom: 30px; letter-spacing: 0.5pt; font-size: 12px;}

.list_names_flex { display: flex; gap: 10px; margin: 20px;}
.list_names_block {width: 50%; }
.list_names_text {column-count:2; padding: 20px; margin: 20px; letter-spacing: 0.4pt; text-align: left;}
.list_names_text2 {column-count:5; padding: 20px; margin: 20px; letter-spacing: 0.4pt; text-align: left;}
.list_names_block2 {margin: 20px;}
.list_names_entry::before {content: '# ';}

.list_group {column-count:3; padding: 20px; margin: 20px 20px 20px 150px; letter-spacing: 0.4pt; text-align: left;}
.list_group_user::before {content: '# ';}

.list_school {text-align: left; line-height: 24px; padding: 20px; margin: 20px; }
.list_school_flex {display: flex; gap: 10px; margin: 20px;}
.list_school_block {width: 50%;}
.list_school_school {font-family: 'Frank Ruhl Libre', serif; font-size: 18px; font-weight: bold; text-transform: uppercase; letter-spacing: 0.3pt;}
.list_school_house {font-family: 'Frank Ruhl Libre', serif; font-size: 14px; font-weight: bold; text-transform: uppercase; letter-spacing: 0.3pt; padding-left: 30px;}
.list_school_year {font-family: 'Frank Ruhl Libre', serif; font-size: 14px; font-weight: bold; text-transform: uppercase; letter-spacing: 0.3pt; padding-left: 30px;}
.list_school_user {padding-left: 30px; letter-spacing: 0.3pt; font-size: 12px;}
.list_school_user::before {content: '# ';}

.list_patronus {column-count:2; padding: 20px; margin: 20px 20px 20px 150px; letter-spacing: 0.4pt; text-align: left;}
.list_patronus_form::before {content: '# ';}
.list_patronus_user {font-style: italic;}

.list_charagb {display: flex; flex-wrap: wrap; margin: 30px 30px 30px 70px; letter-spacing: 0.4pt; text-align: left; line-height: 26px;}
.list_charagb_month {font-family: 'Frank Ruhl Libre', serif; font-size: 18px; font-weight: bold; text-transform: uppercase; letter-spacing: 0.3pt; margin: 0px 0 10px 0;}
.list_charagb_block {margin-left: 30px;}
.list_charagb_entries {margin-bottom: 30px;}
.list_charagb_flexbox {width: 33%;}

.list_spielergb {column-count:2; padding: 20px; margin: 30px; letter-spacing: 0.4pt; text-align: left; line-height: 26px;}
.list_spielergb_month {font-family: 'Frank Ruhl Libre', serif; font-size: 18px; font-weight: bold; text-transform: uppercase; letter-spacing: 0.3pt; padding: 10px 0 10px 0;}
.list_spielergb_user {font-size: 12px; letter-spacing: 0.3pt;}

.list_wohnort_city {font-family: 'Frank Ruhl Libre', serif; font-size: 18px; font-weight: bold; text-transform: uppercase; letter-spacing: 0.3pt;}
.list_wohnort_place {font-family: 'Frank Ruhl Libre', serif; font-size: 14px; font-weight: bold; text-transform: uppercase; letter-spacing: 0.3pt; padding-left: 30px;}
.list_wohnort_block {letter-spacing: 0.3pt; width: 100%; margin-bottom: 20px;}
.list_wohnort_count {font-weight: 300; font-size: 12px; }
.list_wohnort_bewohner {font-family: 'Frank Ruhl Libre', serif; font-size: 12px; letter-spacing: 0.3pt; padding-left: 30px;}
.list_wohnort_bg {font-size: 14px; letter-spacing: 0.3pt; padding: 10px;}




/* ######### EIGENE SEITEN ######### */
.page_title {margin: 0px auto; width: 1000px; height: auto; padding: 20px 20px 5px 20px; text-align: center; text-transform: lowercase; margin-top: 30px; font-style: italic;  margin-bottom: 5px; height: 20px; overflow:hidden; font-family: 'Yeseva One', cursive; letter-spacing: 1pt; color: var(--schwarz); font-size: 26px; font-weight: 100;}
.page_line {height: 1px; width: 1000px; border-top: 5px solid var(--accent1); margin: 0px auto; padding: 0px 20px 5px 20px;}
.page_head {background: var(--dunkel); padding: 20px 0 20px 0; font-family: 'Frank Ruhl Libre', serif; font-size: 16px; letter-spacing: 4px; font-weight: 600; opacity: 0.7; }

.page_around {width: 1040px; margin:auto; background: var(--dunkel); padding-bottom: 30px;}
.page_text { padding: 60px; text-align: justify; letter-spacing: 0.3pt; line-height: 20px;}

 /* ######### WHO IS ONLINE ######### */
.wio_grid {display: grid; grid-template-columns: 33% 33% 33%; padding: 20px; margin: auto;}
.wio_grid_1_head a, .wio_grid_2_head a, .wio_grid_3_head a {font-weight: bold; letter-spacing: 1px; font-size: 12px; text-transform: uppercase;}
.wio_footer a {font-size: 10px; letter-spacing: 2px; padding: 10px; text-transform: uppercase;  }

 /* ######### WHO WAS ONLINE ######### */
.wwo_grid {display: grid; grid-template-columns: 50% 50%; padding: 20px; margin: auto;}
.wwo_grid_1, .wwo_grid_2 {letter-spacing: 1px; font-size: 12px;}
.wio_footer {font-size: 10px; letter-spacing: 2px; padding: 10px; }

 /* ######### BLACKLIST ######### */
.bl_text {padding: 40px; }
.bl_grid {display: grid; grid-template-columns: 30% 70%; padding: 40px; width: 600px; margin: auto;}
.bl_username {grid-column: 1/2; grid-row: 1/2; }
.bl_lastpost {grid-column: 2/3; grid-row: 1/2; }

.bl_mod_grid {display: grid; grid-template-columns: 30% 30% 30% 10%; width: 800px; margin: auto; background: var(--hell); padding: 20px;}
.bl_mod_grid_1, .bl_mod_grid_2, .bl_mod_grid_3, .bl_mod_grid_4 {padding: 10px;}

.bl_mod_gridaway {display: grid; grid-template-columns: 33% 33% 33%; width: 800px; margin: auto; background: var(--hell); padding: 20px;}
.bl_mod_gridaway_1, .bl_mod_gridaway_2, .bl_mod_gridaway_3 {padding: 10px;}

 /* ######### ALERTS ######### */
.alert_nav {text-transform: uppercase; padding: 10px;}
.alert_grid {display: grid; grid-template-columns: 10% 60% 30%; padding: 20px; width: 900px; margin:auto; align-items: center;}
.alert_grid_1 img {width: 50px; height: 50px; object-fit: cover;}
.alert_grid_2 {text-align: left;}
.alert_title {margin: 0px auto; width: 1000px; height: auto; padding: 20px 20px 5px 20px; text-align: center; text-transform: lowercase; margin-top: 30px; font-style: italic;  margin-bottom: 5px;font-family: 'Yeseva One', cursive; letter-spacing: 1pt; color: var(--schwarz); font-size: 20px; font-weight: 100;}
.alert_setting {padding: 5px; text-align: left;margin-left: 40px;}

.alert_popup {padding: 10px;}
.alert_popup_title {font-family: 'Yeseva One', cursive; font-size: 12px; letter-spacing: 1pt; font-weight: bold; text-transform: uppercase; text-align: center; padding: 10px; background: var(--hell);}
.alert_popup_grid {display: grid; padding: 20px; grid-template-columns: 15% 60% 25%; margin:auto; align-items: center;}
.alert_popup_grid_1 img {width: 40px; height: 40px; object-fit: cover; }
.alert_popup_grid_2 {text-align: left;}
.alert_popup_footer {padding: 10px;}