@charset "utf-8";

/* ::::::::::::::::::::::::: Formate ::::::::::::::::::::::::: */
html, body {
scroll-behavior: smooth;
}

body {
padding: 0;
margin: 0;
overflow-y: scroll;
}

.preload { display: none; }

.prnv {}					/* Teile, die nicht gedruckt werden. */
.prtx { display: none; }	/* 'Nicht für den Druck vorgesehen.' */

p, td, li, a {
font-family: 'latoregular';
font-size: 18px;
}

.small {
font-size: 13px;
color: #999999;
}

p {
margin: 0 0 12px 0;
padding: 0;
line-height: 1.4;
}

h1 { /* Seitentitel */
padding: 0;
margin: 0;
font-family: 'latoregular';
font-size: 24px;
font-weight: normal;
text-transform: uppercase;
letter-spacing: 2px;
word-spacing: 3px;
color: #999999;
}

h2 {
padding: 0;
margin: 0 0 4px 0;
font-family: 'latoregular';
font-size: 18px;
text-transform: uppercase;
letter-spacing: 1px;
word-spacing: 2px;
line-height: 1.5;
}

h3 { /* Module */
padding: 0;
margin: 0;
font-family: 'latoregular';
font-size: 20px;
line-height: 24px;
}

.titlebox {
/* padding, margin individuell */
border: 1px solid #999999;
border-radius: 8px;
background-color: #D0E3CF;
}

ul {
padding: 0;
margin: 0;
}
ul li {
padding-left: 6px;
margin: 0 0 4px 7%;
}

ul.ring {
padding: 0;
margin: 0;
list-style-type: none;
}
ul.ring li {
padding-left: 25px;
margin: 0 0 4px 7%;
background-image: url(../images/pic_ul.svg);
background-repeat: no-repeat;
background-position-y: 5px;
}

.hyph    { hyphens: auto; }
.hyphnon { hyphens: none; }

.dnl { margin-bottom:  0px !important; }
.dsm { margin-bottom:  6px !important; }
.dnm { margin-bottom: 12px !important; }
.dbg { margin-bottom: 22px !important; }
.dgr { margin-bottom: 36px !important; }
.dmx { margin-bottom: 60px !important; }

.spc2 { letter-spacing: 2px; }

.rot      { color: #CC0000 !important; }
.rosa     { color: #F7EEE7 !important; }
.gruen    { color: #0C833C !important; }
.hgruen   { color: #D0E3CF !important; }
.errcolor { color: #CC0000; }

.marked {
color: #CC0000;
font-weight: bold;
}

a:link, a:visited {
color: #000000;
text-decoration: none;
}
a:hover, a:active {
color: #CC0000;
}

a.int:link, a.int:visited {
display: inline-block;
padding-left: 10px;
background-image: url(../images/pic_int.svg);
background-repeat: no-repeat;
background-position: 0 center;
}
a.int:hover, a.int:active {
background-image: url(../images/pic_int_ov.svg);
}

.cta-button { /* Call to Action */
display: block;
width: 320px;
padding: 7px 0 8px 0;
border: 1px solid #999999;
border-radius: 8px;
background-color: #F7EEE7;
font-weight: bold;
text-decoration: none;
text-align: center;
transition: background-color 0.3s;
}
.cta-button:hover {
border-color: #CC0000;
color: #000000;
background-color: #F2D5CF;
}

a.em:link, a.em:visited { /* EM-Symbol grau in p- oder span-Tag */
display: inline-block;
width: 18px;	/* Breite Symbol */
height: 100%;	/* Höhe Leerzeichen im a-Tag */
background-image: url(../images/pic_em.svg);
background-repeat: no-repeat;
background-position: center;
}
a.em:hover, a.em:active {
background-image: url(../images/pic_em_ov.svg);
}

.pgnav {
display: flex;
flex-wrap: wrap;
column-gap: 20px;
padding-bottom: 8px;
margin-bottom: 36px;
border-bottom: 1px solid #999999;
}
.pgnav a:link, .pgnav a:visited {
padding-left: 10px;
font-family: 'roboto_condensedregular';
font-size: 14px;
color: #333333;
background-image: url(../images/pic_int.svg);
background-repeat: no-repeat;
background-position: 0 5px;
}
.pgnav a:hover, .pgnav a:active {
background-image: url(../images/pic_int_ov.svg);
}

.anc {
position: relative;
z-index: -10;
margin-top: -170px;
padding-top: 170px;
}

table {
border-spacing: 0;
border-collapse: collapse;
border-width: 0;
}
td {
padding: 0;
border-width: 0;
}

img {
display: block; /* sonst Abstand unten, ist kein margin oder padding */
max-width: 100%;
height: auto;
}

.gallery a { /* Thumbnails 130 x 130, Slides H = 1080 */
display: block;
}
.gallery a img {
border: 1px solid #C2C2C2;
}
.gallery a img:hover {
border-color: #CC0000;
}

.flexitem { /* simulierte Tablle, wird bei kleinen Screens zur Liste */
display: flex;
margin-bottom: 16px;
}
.flexitem div:first-of-type { /* linke Spalte */
min-width: 150px;
max-width: 150px;
hyphens: none;
}
.flexitem p {
margin-bottom: 4px; /* Standard 12px */
}
.flexitem p:last-of-type {
margin-bottom: 0;
}

.iboxKlm { /* ergänzender Text in eckigen Klammern */
display: inline-block;
padding: 8px 15px 5px 15px;
margin-left: 7%;
background-image: url(../images/pic_Klammer_links.svg), url(../images/pic_Klammer_rechts.svg);
background-position-x: left, right;
background-position-y: 0;
background-repeat: no-repeat;
background-size: contain;
}
.iboxKlm h3 {
margin-bottom: 2px;
}


/* ::::::::::::::::::::::::: header :::::::::::::::::::::::::: */
header {
z-index: 10;
position: fixed;
top: 0;
left: 50%;
transform: translatex(-50%);
width: 90vw;
max-width: 1200px;
height: 160px; /* Kante Durchscrollen */
border-left: 4px solid #FFFFFF; /* border verdeckt main beim Durchscrollen */
border-right: 4px solid #FFFFFF;
background-color: #FFFFFF;
}

#header_title_1 { /* große Breite */
display: flex;
flex-direction: column;
height: 70px; /* Position border */
margin: 30px 0 10px 0;
border-bottom: 2px solid #0C833C;
}
#header_title_1 p:first-of-type { /* Sächsisches Institut ... */
padding-bottom: 6px;
font-size: 26px;
line-height: normal;
}
#header_title_1 p:last-of-type { /* Weiterbildungsprogramm KIVEER */
font-size: 21px;
line-height: normal;
}

#header_title_2 { /* mittlere Breite */
display: none;
}

/* #header_title_1 */
@media screen and (max-width: 1300px) {
	header { height: 155px; }
	#header_title_1 { height: 67.3px; margin: 28.8px 0 9.6px 0; }
	#header_title_1 p:first-of-type { padding-bottom: 5.8px; font-size: 25px; }
	#header_title_1 p:last-of-type { font-size: 20.2px; }
}
@media screen and (max-width: 1250px) {
	header { height: 150px; }
	#header_title_1 { height: 64.6px; margin: 27.7px 0 9.2px 0; }
	#header_title_1 p:first-of-type { padding-bottom: 5.5px; font-size: 24px; }
	#header_title_1 p:last-of-type { font-size: 19.4px; }
}
@media screen and (max-width: 1200px) {
	header { height: 145px; }
	#header_title_1 { height: 61.9px; margin: 26.5px 0 8.8px 0; }
	#header_title_1 p:first-of-type { padding-bottom: 5.3px; font-size: 23px; }
	#header_title_1 p:last-of-type { font-size: 18.6px; }
}

/* #header_title_2 */
@media screen and (max-width: 1150px) {
	header { height: 110px; }
	#header_title_1 { display: none; }
	#header_title_2 { display: flex; column-gap: 5vw; align-items: flex-end; height: 30px; margin: 30px 0 10px 0; border-bottom: 2px solid #0C833C; }
	#header_title_2 p:first-of-type { padding-bottom: 5px; margin: 0; font-size: 32px; line-height: normal; }
	#header_title_2 p:last-of-type { padding-bottom: 7px; margin: 0; font-size: 18.6px; line-height: normal; }
}

nav {
display: flex;
column-gap: 35px;
margin-left: 30%;
}
nav a:link, nav a:visited {
font-family: 'roboto_condensedregular';
font-size: 20px;
text-transform: uppercase;
text-decoration: none;
letter-spacing: 1px;
color: #000000;
}
nav a:hover, nav a:active {
color: #CC0000;
}
.pr {
color: #CC0000 !important;
}

a#pic_nav_sm { display: none; }

#nav_sm { display: none; }


/* ::::::::::: main (alles zw. header und footer) :::::::::::: */
main {
display: flex;
column-gap: 7%;
width: 90vw;
max-width: 1200px;
margin: 185px auto;
}

@media screen and (max-width: 1300px) {
	main { margin-top: 185px; }
}
@media screen and (max-width: 1250px) {
	main { margin-top: 180px; }
}
@media screen and (max-width: 1200px) {
	main { margin-top: 175px; }
}
@media screen and (max-width: 1150px) {
	main { margin-top: 130px; }
}

/* ...................... main > #left ....................... */
#left { /* Logo, Bilder */
flex-basis: 20%;
min-width: 160px;
padding-left: 3%;
margin-top: -20px;
}

@media screen and (max-width: 1150px) {
	#left { margin-top: 0; }
}

#left .gallery {
margin-left: 18%;
margin-top: 80px;
}
#left .gallery a { /* Thumbnails 130 x 130, Slides H = 1080 */
width: 130px;
}

/* ...................... main > aricle ...................... */
article {
flex-basis: 65%;
}


/* ::::::::::::::::::::::::: footer :::::::::::::::::::::::::: */
footer {
z-index: 10;
position: fixed;
bottom: 0;
left: 50%;
transform: translatex(-50%);
width: 90vw;
max-width: 1200px;
height: 45px;
border-top: 1px solid #999999;
box-shadow: 0 -10px #FFFFFF;
background-color: #FFFFFF;
}

#footer_nav {
display: flex;
align-items: baseline; /* Schrift und pic_print auf Grundlinie */
column-gap: 3%;
margin-top: 6px;
}
#footer_nav a {
font-size: 16px;
}

a#print {
display: block;
width: 20px;
height: 18px;
background-image: url(../images/pic_print.gif);
background-repeat: no-repeat;
}
a#print:hover {
background-image: url(../images/pic_print_ov.gif);
}

a#footer_scrolltop {
position: absolute;
right: 0;
top: 10px;
display: block;
width: 30px;
height: 24px;
background-image: url(../images/pic_ScrollTop.svg);
}
a#footer_scrolltop:hover {
background-image: url(../images/pic_ScrollTop_ov.svg);
}


/* ::::::::::::::::: Cookiebanner ::::::::::::::::: */
div#mbmcookie {
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 20;
padding-top: 10px; /* Distanz zu article */
background-color: #FFFFFF;
}

#mbmcookie table {
position: relative; /* erf. für z-index */
z-index: 21;
width: 90vw;
max-width: 1200px;
margin: 0 auto;
border-top: 2px solid #0C833C;
}
#mbmcookie table td {
padding: 10px 0 20px 0;
}
#cookiemessage {
font-size: 16px;
}

a#cookiebutton { /* wie input[type=submit] */
margin-left: 10px;
padding: 6px 20px;
border: 1px solid #999999;
background-color: #F7EEE7;
border-radius: 4px;
cursor: pointer;
font-family: 'roboto_condensedregular';
font-size: 14px;
transition: background-color .3s;
}
a#cookiebutton:hover {
background-color: #F2D5CF;
color: #000000;
}
div#cookieblende {
position: fixed;
left: 0;
right: 0;
top: 0;
bottom: 0;
z-index: 19;
background-color: #FFFFFF;
opacity: 0.6;
}


/* :::::::::::::::::::::::::: Seiten ::::::::::::::::::::::::: */
/* .................... KIVEER.php (home) .................... */
#home .titlebox {
padding: 18px 15px 20px 20px;
margin-bottom: 25px;
}

#home h1 {
font-size: 28px;
font-weight: normal;
text-transform: none;
letter-spacing: 1px;
word-spacing: normal;
color: #000000;
}
@media screen and (max-width: 1300px) {
	#home h1 { font-size: 26px; }
}
@media screen and (max-width: 1250px) {
	#home h1 { font-size: 25px; }
}
@media screen and (max-width: 1200px) {
	#home h1 { font-size: 24px; }
}
@media screen and (max-width: 1150px) {
	#home h1 { font-size: 23px; }
}
@media screen and (max-width: 1100px) {
	#home h1 { font-size: 22px; }
}
@media screen and (max-width: 1050px) {
	#home h1 { font-size: 21px; }
}

#LogoInl {
display: none;
}

#ProjFoerd_EU { /* identisch für Impressum.php */
display: flex;
column-gap: 12px;
align-items: center;
margin-bottom: 15px;
}
#ProjFoerd_EU_Bild { /* Flagge EU */
min-width: 120px;
max-width: 120px;
}
#ProjFoerd_EU_Text {} /* Kofinanziert ... */
#ProjFoerd_EU_Text p {
font-family: Arial, Helvetica, sans-serif !important; /* important gegen .flexitem (small) */
font-size: 22px !important;
line-height: 28px !important;
font-weight: bold;
letter-spacing: normal;
color: #003399;
white-space: nowrap;
}

#ProjFoerd_Sachsen {
display: flex;
column-gap: 12px;
align-items: center;
}
#ProjFoerd_Sachsen_Bild { /* Wappen Sachsen */
min-width: 120px;
max-width: 120px;
}
#ProjFoerd_Sachsen_Bild img {
width: 80px;
margin: 0 auto;
}
#ProjFoerd_Sachsen_Text {} /* Diese Maßnahme ... */
#ProjFoerd_Sachsen_Text p {
font-family: 'rotis_sans_serif_stdregular';
font-size: 16px;
line-height: 21px;
white-space: nowrap;
}

/* ....................... KIVEER01.php ...................... */
main#kiveer01 {
margin-bottom: 500px;
}

#kiveer01 .titlebox {
padding: 20px 15px 15px 20px;
margin-bottom: 25px;
}

table#modul_nav {
margin-bottom: 5px;
}
#modul_nav td:first-of-type {
min-width: 60px;
padding-top: 4px;
vertical-align: top;
font-size: 14px;
line-height: normal;
}

a.modul_btn:link, a.modul_btn:visited {
display: inline-block;
width: 55px;
padding-bottom: 1px;
margin: 0 8px 8px 0;
border: 1px solid #999999;
border-radius: 4px;
background-color: #ECF4E8;
font-family: 'roboto_condensedregular';
font-size: 14px;
text-align: center;
line-height: normal;
color: #333333;
}
a.modul_btn:hover, a.modul_btn:active {
border-color: #CC0000;
background-color: #F2D5CF;
}

.modul {
padding: 15px 15px 10px 30px;
margin-bottom: 42px;
border: 1px solid #999999;
border-radius: 8px;
background-color: #ECF4E8;
}
#mod_K1_M2, #mod_K1_M3, #mod_K1_M4, #mod_K1_M5, #mod_K1_M6, #mod_K1_M7, #mod_K1_M8, #mod_K1_M9, #mod_K1_M10 { display: none; }

.modul_titel {
margin-bottom: 15px;
}
.modul_titel td:first-of-type {			/* Icon */
width: 350px;
}
.modul_titel table td:first-of-type {	/* beide Tabellen Datum */
width: auto;
padding-right: 10px;
hyphens: none;
}
.modul_titel_basic { display: block; }	/* Datum lang */
.modul_titel_small { display: none; }	/* Datum abgekürzt */

.modul_inhalt {
margin-left: 8%;
}
.modul_inhalt p {
line-height: normal;
}

#VAOrt_Adr_small {
display: none;
}
#VAOrt {
display: flex;
column-gap: 6%;
margin-bottom: 42px;
}
#VAOrt_Adr_basic {
display: table;
padding: 0 5% 0 3%;
border: 1px solid #C2C2C2;
background-color: #FAFAFA;
}
#VAOrt_Adr_basic div { /* Adresse, inneres Div */
display: table-cell;
vertical-align: middle;
}

/* ......................... Team.php ........................ */
#team_Container {
width: 538px; /* = 100% in kiveer_small.css */
}
#teamGrpImg {
margin-bottom: 30px;
}
#teamGrpImg img {
width: 100%;
border: 1px solid #999999;
}

#teamFlex { /* #teamTxt + #teamLtrImg */
display: flex;
justify-content: space-between;
}
#teamTxt p:first-of-type {
margin-top: -7px;
}
#teamLtrImg img {
border: 1px solid #999999;
}

#team #trenner {
margin: 25px 0 14px 0;
border-bottom: 1px solid #999999;
}

/* ....................... Kontakt.php ....................... */
#kont_daten {
display: flex;
column-gap: 10%;
align-items: flex-end; /* unten ausgerichtet */
}
#kont_daten div:last-of-type {
flex-basis: 35%;
min-width: 220px;
}
#kont_daten div:first-of-type table tr:first-of-type td {	/* 1. Zeile 'Telefon 03727 9981550' */
padding-bottom: 6px;
}
#kont_daten div:first-of-type table td:first-of-type {		/* 1. Spalte */
padding-right: 15px;
}

#kontakt #trenner {
margin: 25px 0 14px 0;
border-bottom: 1px solid #999999;
}

/* ...................... Impressum.php ...................... */
main#impr p, main#impr li, main#impr a {
font-size: 16px;
line-height: 1.3;
}

#impr #trenner1 {
margin: 18px 0 23px 0;
border-bottom: 1px solid #999999;
}
#impr #trenner2 {
margin: 18px 0 18px 0;
border-bottom: 1px solid #999999;
}

/* ..................... Datenschutz.php ..................... */
main#ds p, main#ds li, main#ds a {
font-size: 16px;
line-height: 1.3;
}

/* ....................... Infothek.php ...................... */
a.InfothItem:link, a.InfothItem:visited {
display: block;
width: 80%;
padding: 12px 20px;
border: 1px solid #999999;
border-radius: 8px;
background-color: #F6F6F6;
transition: all 0.3s;
}
a.InfothItem:hover, a.InfothItem:active {
color: #000000;
border-color: #CC0000;
background-color: #EEEEEE;
}

/* .......................... Fehler ......................... */
.errcolor {
color: #CC0000;
}

body#fehler404 {
background-color: #999999;
}

#fehlerContainer {
position: relative;
margin: 5vw auto 0 auto;
width: 80vw;
max-width: 800px;
}

#fehlerBox {
position: absolute;
right: 8%;
bottom: 0;
padding-top: 30px;
background-color: rgba(255, 255, 255, 0.9);
}
#fehlerBox img { /* Logo */
width: 160px;
margin-left: 20px;
}
#fehlerTxt1 {
margin: 20px 20px 20px 55px;
}
#fehlerTxt2 {
margin: 0 0 30px 30px;
}
@media screen and (max-width: 800px) {
	#fehlerContainer { width: 90vw; }
	#fehlerBox { padding-top: 20px; }
	#fehlerBox img { width: 130px; }
	#fehlerTxt1 { margin: 12px 20px 12px 55px; }
	#fehlerTxt2 { margin-bottom: 20px; }
	#fehlerTxt1 p, #fehlerTxt2 a { font-size: 16px; }
}
@media screen and (max-width: 650px) {
	#fehlerBox { padding: 20px 15px 20px 20px; }
	#fehlerBox img { display: none; }
	#fehlerTxt1 { margin: 0 0 10px 0; }
	#fehlerTxt2 { margin: 0; }
}
@media screen and (max-width: 400px) {
	#fehlerContainerHG { display: none; }
	#fehlerBox { position: static; }
	#fehlerBox img { display: block; margin-left: 0; }
	#fehlerTxt1 { margin: 10px 0 10px 29px; }
	#fehlerTxt2 { margin-left: 29px; }
}